diff --git a/district/models.py b/district/models.py
index f81217b6a169d1d0fc716c1fc691755e1b0982c8..5d2db2a50c56d111180d02e9782a02cd679b4393 100644
--- a/district/models.py
+++ b/district/models.py
@@ -40,7 +40,6 @@ from shared.blocks import (
ButtonGroupBlock,
ChartBlock,
FigureBlock,
- FooterLinksBlock,
FullSizeHeaderBlock,
HeadlineBlock,
NewsletterSubscriptionBlock,
@@ -76,6 +75,7 @@ class DistrictHomePage(
CalendarMixin,
FooterMixin,
NewsletterFormMixin,
+ RoutablePageMixin,
Page,
):
### FIELDS
@@ -311,6 +311,10 @@ class DistrictHomePage(
### OTHERS
+ @route(r"^newsletter/$", name="newsletter")
+ def newsletter(self, posted):
+ return self.newsletter_post(posted)
+
class Meta:
verbose_name = "Oblastní sdružení"
@@ -1412,6 +1416,7 @@ class DistrictCustomPage(
SubpageMixin,
MetadataPageMixin,
NewsletterFormMixin,
+ RoutablePageMixin,
Page,
):
### FIELDS
@@ -1445,6 +1450,10 @@ class DistrictCustomPage(
### OTHERS
+ @route(r"^newsletter/$", name="newsletter")
+ def newsletter(self, posted):
+ return self.newsletter_post(posted)
+
class Meta:
verbose_name = "Libovolná vlastní stránka"
diff --git a/district/templates/district/base.html b/district/templates/district/base.html
index 50cdcd0602c15033213739532ab6308b866a4545..46f8662743f32ef405539ae93b06709751a87527 100644
--- a/district/templates/district/base.html
+++ b/district/templates/district/base.html
@@ -21,8 +21,8 @@
<!-- Styles -->
<link rel="stylesheet" href="https://styleguide.pirati.cz/2.13.x/css/styles.css">
<link href="{% static "shared/vendor/fancybox/jquery.fancybox.min.css" %}" rel="stylesheet">
+ <link rel="stylesheet" href="{% static "shared/vendor/vue-formulate-2.5.3/css/snow.min.css" %}">
<link rel="stylesheet" href="{% static "shared/css/helpers.css" %}">
- <link rel="stylesheet" href="{% static "shared/vendor/bootstrap-4.4.1/css/bootstrap.min.css" %}">
{% block styles %}{% endblock %}
diff --git a/shared/models.py b/shared/models.py
index 2db25f1d2254b8a405c05755dd5bdf5264e820a5..a5e326ed2ece9a5c76ac364e1a72b171c45c4110 100644
--- a/shared/models.py
+++ b/shared/models.py
@@ -5,7 +5,6 @@ from django.http import HttpResponse
from django.utils import timezone
from requests import request
from wagtail.admin.panels import FieldPanel, MultiFieldPanel, PublishingPanel
-from wagtail.contrib.routable_page.models import RoutablePageMixin, route
from wagtail.fields import StreamField
from wagtail.models import Page
@@ -19,7 +18,12 @@ from shared.blocks import (
logger = logging.getLogger(__name__)
-class NewsletterFormMixin(RoutablePageMixin, models.Model):
+class NewsletterFormMixin(models.Model):
+ """
+ Use this for pages to which you want to submit newsletter requests.
+ Pages inheriting from this should have a route defined with RoutablePageMixin that use the method newsletter_post
+ """
+
subscription_id = models.CharField(
verbose_name="ID newsletteru", max_length=512, null=True, blank=True
)
@@ -41,7 +45,6 @@ class NewsletterFormMixin(RoutablePageMixin, models.Model):
),
]
- @route(r"^newsletter/$", name="newsletter")
def newsletter_post(self, posted):
client_response = HttpResponse()
if posted.method == "POST":
@@ -80,7 +83,7 @@ class NewsletterFormMixin(RoutablePageMixin, models.Model):
@property
def has_newsletter_form(self):
- return True
+ return self.subscription_id != None and self.access_token != None
class Meta:
abstract = True
diff --git a/shared/static/shared/css/helpers.css b/shared/static/shared/css/helpers.css
index ed5cbd098799e8fd382338932fd3695c12a05a6e..007b04d35119908bfb64c161e31ad29add5bb7e1 100644
--- a/shared/static/shared/css/helpers.css
+++ b/shared/static/shared/css/helpers.css
@@ -39,3 +39,22 @@ table caption {
.content-block {
clear: both;
}
+
+.sr-only {
+ position: absolute;
+ width: 1px;
+ height: 1px;
+ padding: 0;
+ margin: -1px;
+ overflow: hidden;
+ clip: rect(0,0,0,0);
+ border: 0;
+}
+
+.checkbox .formulate-input-element-decorator {
+ display: none!important;
+}
+
+.checkbox .formulate-input-element-decorator::before {
+ display: none!important;
+}
diff --git a/shared/static/shared/js/vue-formulate-helper.js b/shared/static/shared/js/vue-formulate-helper.js
index 091453405e412a383a6197b453095c4f387665a9..34e4e7504042a275b53b26a117682169c9d620a5 100644
--- a/shared/static/shared/js/vue-formulate-helper.js
+++ b/shared/static/shared/js/vue-formulate-helper.js
@@ -1,17 +1,22 @@
+VueFormulate
+
Vue.use(VueFormulate, {
- plugins: [VueFormulateI18n.cs],
+ plugins: [VueFormulateI18n.cs.default],
locale: "cs",
});
-new Vue({
- el: ".mailtrain-form-container",
- props: {
- url: String,
- },
- methods: {
- onSubmit(...data) {
- // Intl.DateTimeFormat().resolvedOptions().timeZone)
- console.log(this, ...data);
- },
- },
-});
+Vue.options.methods ||= {};
+Vue.options.methods.mailtrainsubmit = function (data) {
+ const csrftoken = $("[name='csrfmiddlewaretoken']", this.$el).val();
+ const headers = new Headers();
+ headers.append('X-CSRFToken', csrftoken);
+
+ return fetch(this.$el.dataset.url, {
+ method: "POST",
+ body: JSON.stringify({
+ ...data,
+ }),
+ headers: headers,
+ credentials: "include",
+ });
+};
diff --git a/shared/static/shared/vendor/vue-formulate-2.5.3/css/snow.min.css b/shared/static/shared/vendor/vue-formulate-2.5.3/css/snow.min.css
new file mode 100644
index 0000000000000000000000000000000000000000..c483577c131fe63c1cd0e738bcd9a8fa8cd9e715
--- /dev/null
+++ b/shared/static/shared/vendor/vue-formulate-2.5.3/css/snow.min.css
@@ -0,0 +1 @@
+.formulate-input{margin-bottom:1.5em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol}.formulate-input .formulate-input-label{display:block;line-height:1.5;font-size:.9em;font-weight:600;margin-bottom:.1em}.formulate-input .formulate-input-label--before+.formulate-input-help--before{margin-top:-.25em;margin-bottom:.75em}.formulate-input .formulate-input-element{max-width:20em;margin-bottom:.1em}.formulate-input .formulate-input-help{color:#6d6d6d;font-size:.7em;font-weight:400;line-height:1.5;margin-bottom:.25em}.formulate-input .formulate-input-errors{list-style-type:none;padding:0;margin:0}.formulate-input .formulate-file-upload-error,.formulate-input .formulate-input-error{color:#960505;font-size:.8em;font-weight:300;line-height:1.5;margin-bottom:.25em}.formulate-input:last-child{margin-bottom:0}.formulate-input[data-classification=text] input{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.3em;border:1px solid #cecece;box-sizing:border-box;background-color:transparent;font-size:.9em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;padding:.75em;display:block;width:100%;font-weight:400;line-height:1.2em;margin:0}.formulate-input[data-classification=text] input::-moz-placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=text] input:-ms-input-placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=text] input::placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=text] input:focus{outline:0;border:1px solid #41b883}.formulate-input[data-classification=text] .formulate-input-element--date input,.formulate-input[data-classification=text] .formulate-input-element--datetime-local input,.formulate-input[data-classification=text] .formulate-input-element--month input,.formulate-input[data-classification=text] .formulate-input-element--week input{min-height:2.2em}.formulate-input[data-classification=text] .formulate-input-element--search{position:relative}.formulate-input[data-classification=text] .formulate-input-element--search:before{content:"";width:2em;height:100%;position:absolute;left:0;top:0;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 72.99 72.9"><path fill="%236d6d6d" d="M71.77,66,53.87,48.1A29.94,29.94,0,1,0,30,60a29.52,29.52,0,0,0,18.1-6.1l18,17.8A4,4,0,0,0,69,72.9a4.18,4.18,0,0,0,2.9-1.2A4.09,4.09,0,0,0,71.77,66ZM30.07,51.9a21.9,21.9,0,1,1,15.5-37.4A21.37,21.37,0,0,1,52,30a22,22,0,0,1-6.4,15.5A21.54,21.54,0,0,1,30.07,51.9Z"/></svg>');background-size:1em 1em;background-repeat:no-repeat;background-position:50%;pointer-events:none}.formulate-input[data-classification=text] .formulate-input-element--search input{padding-left:2em}.formulate-input[data-classification=text] input[type=color]{height:1.1em;box-sizing:content-box;width:auto;min-width:5em}.formulate-input[data-classification=text] input[type=color]::-webkit-color-swatch-wrapper{padding:0 0 0 1.5em;display:flex;align-items:center;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 79.17 79.17"><path fill="%236d6d6d" d="M40.8,22.92c-3.4-3.4-4.76-8.44-1-12.24s8.84-2.44,12.24,1c5-5,10.69-13.33,18.81-11.31a11,11,0,0,1,7.62,14.34c-1.26,3.45-4.63,6.06-7.16,8.59-.92.93-3,2.26-3.46,3.46-.42,1,1.82,2.63,2.36,4a8,8,0,0,1-12.42,9.19c-.21-.16-1.35-1.51-1.59-1.51s-.83.83-1,1L49.71,44.9,32.43,62.18c-3.37,3.38-6.6,7.14-10.26,10.21a11,11,0,0,1-4.48,2.28c-1.25.3-3.11-.22-4.18.18-1.28.48-2.42,2.65-3.68,3.4-6.05,3.61-12.64-4-8.46-9.57.73-1,2.53-1.92,3-3a14.46,14.46,0,0,0-.09-2.52,10.75,10.75,0,0,1,3.14-6.77c.92-1,1.93-1.93,2.89-2.9Zm4.4-1.5c4.19,4,8.24,8.24,12.36,12.36,2.06,2.06,5,5.59,8,2.61,4.65-4.62-5-6.8-2.42-10.78C66.3,20.7,76.4,16.48,74.84,9.45,73.62,4,67.12,2.78,63.29,6.32c-2.55,2.36-4.93,4.94-7.39,7.4-.79.78-1.8,2.28-2.88,2.73-2.14.88-3.4-1.62-4.79-2.77-2.58-2.14-6.89-.82-6.53,3C41.89,18.68,43.87,20.09,45.2,21.42Zm-1.45,4.44L27.82,41.79C22,47.57,15.89,53.14,10.41,59.2a8.23,8.23,0,0,0-1.44,2c-.93,2,.25,4.14-.5,6S4.92,69.94,4.3,72a2.34,2.34,0,0,0,2.56,3c1.11-.17,2-1.33,2.71-2.07a11.17,11.17,0,0,1,2.08-2c1.68-.94,4,.17,5.93-.57C20,69.41,22,66.73,23.76,65L34.42,54.3,53.3,35.42Z"/></svg>');background-repeat:no-repeat;background-size:.9em .9em;background-position:left .1em}.formulate-input[data-classification=text] input[type=color]::-webkit-color-swatch{display:block;height:1em;border-radius:.2em;border:0;flex:auto}.formulate-input[data-classification=text] input[type=color]::-moz-color-swatch{display:block;height:1em;border-radius:.2em;border:0;flex:auto}.formulate-input[data-classification=slider] .formulate-input-element--range{display:flex;align-items:center}.formulate-input[data-classification=slider] .formulate-input-element-range-value{font-size:.9em;line-height:1;margin-left:.5em;background-color:#efefef;padding:.25em .3em;border-radius:.25em;color:#6d6d6d;font-variant-numeric:tabular-nums}.formulate-input[data-classification=slider] input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;font-size:1em;padding:.5em 0}.formulate-input[data-classification=slider] input:focus{outline:0}.formulate-input[data-classification=slider] input::-webkit-slider-thumb{cursor:pointer;-webkit-appearance:none;appearance:none;width:1em;height:1em;border-radius:1em;border:0;background-color:#41b883;margin-top:calc(-.5em + 2px)}.formulate-input[data-classification=slider] input::-moz-range-thumb{cursor:pointer;-moz-appearance:none;appearance:none;width:1em;height:1em;border-radius:1em;border:0;background-color:#41b883;margin-top:calc(-.5em + 2px)}.formulate-input[data-classification=slider] input::-ms-thumb{cursor:pointer;appearance:none;width:1em;height:1em;border-radius:1em;border:0;background-color:#41b883;margin-top:calc(-.5em + 2px)}.formulate-input[data-classification=slider] input::-webkit-slider-runnable-track{-webkit-appearance:none;appearance:none;width:100%;height:4px;background-color:#efefef;border-radius:3px;margin:0;padding:0}.formulate-input[data-classification=slider] input::-moz-range-track{-moz-appearance:none;appearance:none;width:100%;height:4px;background-color:#efefef;border-radius:3px;margin:0;padding:0}.formulate-input[data-classification=textarea] textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.3em;border:1px solid #cecece;box-sizing:border-box;background-color:transparent;font-size:.9em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;padding:.75em;display:block;width:100%;font-weight:400;line-height:1.2em;margin:0}.formulate-input[data-classification=textarea] textarea::-moz-placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=textarea] textarea:-ms-input-placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=textarea] textarea::placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=textarea] textarea:focus{outline:0;border:1px solid #41b883}.formulate-input[data-classification=button] button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.3em;box-sizing:border-box;background-color:transparent;font-size:.9em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;padding:.75em;display:block;width:100%;font-weight:400;line-height:1.2em;margin:0;border:1px solid #41b883;background-color:#41b883;color:#fff;min-width:0;width:auto;font-weight:700;cursor:pointer;display:inline-flex;align-items:center}.formulate-input[data-classification=button] button::-moz-placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=button] button:-ms-input-placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=button] button::placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=button] button:focus{outline:0;border:1px solid #41b883}.formulate-input[data-classification=button] button[disabled],.formulate-input[data-classification=button] button[disabled]:active{background-color:#cecece;border-color:#cecece}.formulate-input[data-classification=button] button[data-ghost]{color:#41b883;background-color:transparent;border-color:currentColor}.formulate-input[data-classification=button] button[data-minor]{font-size:.75em;display:inline-block}.formulate-input[data-classification=button] button[data-danger]{background-color:#960505;border-color:#960505}.formulate-input[data-classification=button] button[data-danger][data-ghost]{color:#960505;background-color:transparent}.formulate-input[data-classification=button] button:active{background-color:#64c89b;border-color:#64c89b}.formulate-input[data-classification=select] .formulate-input-element{position:relative}.formulate-input[data-classification=select] .formulate-input-element:before{content:"";width:0;height:0;border-color:#cecece transparent transparent;border-style:solid;border-width:.3em .3em 0;top:50%;margin-top:-.1em;right:1em;position:absolute}.formulate-input[data-classification=select] .formulate-input-element[data-multiple]:before{display:none}.formulate-input[data-classification=select] select{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.3em;border:1px solid #cecece;box-sizing:border-box;background-color:transparent;font-size:.9em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;display:block;width:100%;font-weight:400;line-height:1.2em;margin:0;padding:.75em 2em .75em .75em}.formulate-input[data-classification=select] select::-moz-placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=select] select:-ms-input-placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=select] select::placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=select] select:focus{outline:0;border:1px solid #41b883}.formulate-input[data-classification=select] select option{color:#000}.formulate-input[data-classification=select] select option:disabled{color:#a8a8a8}.formulate-input[data-classification=select] select[multiple]{padding:0;overflow-y:auto}.formulate-input[data-classification=select] select[multiple] option{padding:.75em}.formulate-input[data-classification=select] select[data-placeholder-selected]{color:#a8a8a8}.formulate-input[data-classification=box] .formulate-input-wrapper{display:flex;align-items:center}.formulate-input[data-classification=box] .formulate-input-element{overflow:hidden;display:flex;align-items:center}.formulate-input[data-classification=box] .formulate-input-element input{position:absolute;left:-999px;opacity:0;pointer-events:none}.formulate-input[data-classification=box] .formulate-input-element-decorator{display:block;width:1em;height:1em;border-radius:.25em;border:1px solid #cecece;position:relative}.formulate-input[data-classification=box] .formulate-input-element-decorator:before{content:"";display:block;background-size:contain;background-position:100%;width:calc(100% - .125em);height:calc(100% - .125em);box-sizing:border-box;position:absolute;top:.0625em;left:.0625em}.formulate-input[data-classification=box] .formulate-input-element[data-type=radio] .formulate-input-element-decorator{border-radius:1em}.formulate-input[data-classification=box] .formulate-input-element[data-type=radio] .formulate-input-element-decorator:before{border-radius:1em;width:calc(100% - .5em);height:calc(100% - .5em);top:.25em;left:.25em}.formulate-input[data-classification=box] .formulate-input-element input[type=checkbox]:checked~.formulate-input-element-decorator{border-color:#41b883}.formulate-input[data-classification=box] .formulate-input-element input[type=checkbox]:checked~.formulate-input-element-decorator:before{background-color:#41b883;-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M8.76,56.2c-6.38-6.34,3.26-16,9.64-9.69L38,65.88,80.56,23.29c6.38-6.38,16.07,3.32,9.69,9.69L42.84,80.37a6.83,6.83,0,0,1-9.65,0Z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M8.76,56.2c-6.38-6.34,3.26-16,9.64-9.69L38,65.88,80.56,23.29c6.38-6.38,16.07,3.32,9.69,9.69L42.84,80.37a6.83,6.83,0,0,1-9.65,0Z"/></svg>')}.formulate-input[data-classification=box] .formulate-input-element input[type=radio]:checked~.formulate-input-element-decorator{border-color:#41b883}.formulate-input[data-classification=box] .formulate-input-element input[type=radio]:checked~.formulate-input-element-decorator:before{background-color:#41b883}.formulate-input[data-classification=box] .formulate-input-element input:focus~.formulate-input-element-decorator{border-color:#41b883}.formulate-input[data-classification=box] .formulate-input-label--after{margin-left:.5em}.formulate-input[data-classification=box] .formulate-input-label--before{margin-right:.5em}.formulate-input[data-classification=group] .formulate-input-group-item,.formulate-input[data-classification=group]>.formulate-input-wrapper>.formulate-input-label{margin-bottom:.5em}.formulate-input[data-classification=group] [data-is-repeatable]{padding:1em;border:1px solid #efefef;border-radius:.3em}.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-grouping{margin:-1em -1em 0}.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable{padding:1em 3em 1em 1em;border-bottom:1px solid #efefef;position:relative}.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable-remove{position:absolute;display:block;top:calc(50% - .15em);width:1.3em;height:1.3em;background-color:#cecece;right:.85em;border-radius:1.3em;cursor:pointer;transition:background-color .2s;overflow:hidden;text-indent:-1000px}.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable-remove[data-disabled]{opacity:.2;pointer-events:none}.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable-remove:after,.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable-remove:before{content:"";position:absolute;top:calc(50% - .1em);left:.325em;display:block;width:.65em;height:.2em;background-color:#fff;transform-origin:center center;transition:transform .25s}@media (pointer:fine){.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable-remove:hover{background-color:#dc2c2c}.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable-remove:hover:after,.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable-remove:hover:before{height:.2em;width:.75em;left:.25em;top:calc(50% - .075em)}.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable-remove:hover:after{transform:rotate(45deg)}.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable-remove:hover:before{transform:rotate(-45deg)}}.formulate-input[data-classification=group] [data-is-repeatable] .formulate-input-group-repeatable:last-child{margin-bottom:1em}.formulate-input[data-classification=file] .formulate-input-upload-area{width:100%;position:relative;padding:2em 0}.formulate-input[data-classification=file] .formulate-input-upload-area input{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;opacity:0;position:absolute;left:0;right:0;bottom:0;top:0;width:100%;height:100%;z-index:5}.formulate-input[data-classification=file] .formulate-input-upload-area[data-has-files]{padding:0}.formulate-input[data-classification=file] .formulate-input-upload-area[data-has-files] input{display:none}.formulate-input[data-classification=file] .formulate-input-upload-area-mask{border-radius:.4em;position:absolute;pointer-events:none;display:flex;justify-content:center;align-items:center;left:0;right:0;top:0;bottom:0;border:2px dashed #a8a8a8;z-index:2}.formulate-input[data-classification=file] .formulate-input-upload-area-mask:before{content:"";background-color:#a8a8a8;-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 58 58"><path d="M29,58A29,29,0,1,0,0,29,29,29,0,0,0,29,58ZM29,4A25,25,0,1,1,4,29,25,25,0,0,1,29,4Z"/><polygon points="27 22 27 44.4 31 44.4 31 22 41.7 31.1 44.3 28.1 29 15 13.7 28.1 16.3 31.1 27 22"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 58 58"><path d="M29,58A29,29,0,1,0,0,29,29,29,0,0,0,29,58ZM29,4A25,25,0,1,1,4,29,25,25,0,0,1,29,4Z"/><polygon points="27 22 27 44.4 31 44.4 31 22 41.7 31.1 44.3 28.1 29 15 13.7 28.1 16.3 31.1 27 22"/></svg>');-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;width:2em;height:2em;position:absolute;pointer-events:none}.formulate-input[data-classification=file] .formulate-input-upload-area input:focus~.formulate-input-upload-area-mask,.formulate-input[data-classification=file] .formulate-input-upload-area input:hover~.formulate-input-upload-area-mask,.formulate-input[data-classification=file] .formulate-input-upload-area input[data-is-drag-hover]~.formulate-input-upload-area-mask{border-color:#41b883}.formulate-input[data-classification=file] .formulate-input-upload-area input:focus~.formulate-input-upload-area-mask:before,.formulate-input[data-classification=file] .formulate-input-upload-area input:hover~.formulate-input-upload-area-mask:before,.formulate-input[data-classification=file] .formulate-input-upload-area input[data-is-drag-hover]~.formulate-input-upload-area-mask:before{background-color:#41b883}.formulate-input[data-classification=file] .formulate-files{list-style-type:none;margin:0;padding:0}.formulate-input[data-classification=file] .formulate-files .formulate-file-add{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;min-width:75px;border:1px solid #41b883;color:#41b883;padding:5px;border-radius:5px;text-align:center;position:relative;font-size:13px;background-color:transparent;cursor:pointer;margin:.5em 0}.formulate-input[data-classification=file] .formulate-files .formulate-file-add input{position:absolute;display:block;cursor:pointer}.formulate-input[data-classification=file] .formulate-files .formulate-file-add input::-webkit-file-upload-button{display:none}.formulate-input[data-classification=file] .formulate-files .formulate-file-progress{background-color:#cecece;height:.3em;border-radius:1.25em;width:5em;overflow:hidden;position:relative;flex:0 0 5em;right:.75em;transition:height .25s,width .25s,flex-basis .25s;z-index:2}.formulate-input[data-classification=file] .formulate-files .formulate-file-progress:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;display:block;opacity:0;transform:scale(.08);background-color:#fff;-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M8.76,56.2c-6.38-6.34,3.26-16,9.64-9.69L38,65.88,80.56,23.29c6.38-6.38,16.07,3.32,9.69,9.69L42.84,80.37a6.83,6.83,0,0,1-9.65,0Z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M8.76,56.2c-6.38-6.34,3.26-16,9.64-9.69L38,65.88,80.56,23.29c6.38-6.38,16.07,3.32,9.69,9.69L42.84,80.37a6.83,6.83,0,0,1-9.65,0Z"/></svg>');-webkit-mask-size:77%;mask-size:77%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;z-index:3}.formulate-input[data-classification=file] .formulate-files .formulate-file-progress[data-just-finished]{width:1.25em;height:1.25em;flex:0 0 1.25em}.formulate-input[data-classification=file] .formulate-files .formulate-file-progress[data-just-finished]:before{transition:transform .25s .2s,opacity .25s .2s;transform:scale(1);opacity:1}.formulate-input[data-classification=file] .formulate-files .formulate-file-progress[data-is-finished]{transition:height .25s,width .25s,left .25s,top,.25s,border-radius .25s;width:.3em;flex:0 0 .3em;height:100%;right:0;border-radius:0 .23em .23em 0}.formulate-input[data-classification=file] .formulate-files .formulate-file-progress[data-is-finished]:before{transition:opacity .1s;opacity:0}.formulate-input[data-classification=file] .formulate-files .formulate-file-progress .formulate-file-progress-inner{background-color:#41b883;width:1%;position:absolute;left:0;bottom:0;top:0;z-index:2}.formulate-input[data-classification=file] .formulate-files .formulate-file-name{padding-left:1.5em;padding-right:2em;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:auto}.formulate-input[data-classification=file] .formulate-files .formulate-file-name:before{position:absolute;left:.7em;top:50%;margin-top:-.7em;background-color:#a8a8a8;content:"";-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64.06 83.59"><path d="M55.94,83.59a8.16,8.16,0,0,0,8.12-8.16V19.12a1.77,1.77,0,0,0-.52-1.25L46.21.59A1.69,1.69,0,0,0,45.14.08L44.69,0l-.18,0H8.13A8.18,8.18,0,0,0,0,8.16V75.41a8.16,8.16,0,0,0,8.13,8.16H55.94ZM46.68,6,58.11,17.38H46.68ZM3.52,75.43V8.16A4.64,4.64,0,0,1,8.13,3.52h35V19.16a1.75,1.75,0,0,0,1.76,1.74H60.55V75.43a4.65,4.65,0,0,1-4.61,4.65H8.13A4.65,4.65,0,0,1,3.52,75.43Z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64.06 83.59"><path d="M55.94,83.59a8.16,8.16,0,0,0,8.12-8.16V19.12a1.77,1.77,0,0,0-.52-1.25L46.21.59A1.69,1.69,0,0,0,45.14.08L44.69,0l-.18,0H8.13A8.18,8.18,0,0,0,0,8.16V75.41a8.16,8.16,0,0,0,8.13,8.16H55.94ZM46.68,6,58.11,17.38H46.68ZM3.52,75.43V8.16A4.64,4.64,0,0,1,8.13,3.52h35V19.16a1.75,1.75,0,0,0,1.76,1.74H60.55V75.43a4.65,4.65,0,0,1-4.61,4.65H8.13A4.65,4.65,0,0,1,3.52,75.43Z"/></svg>');-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;width:1.25em;height:1.25em;display:inline-block;margin-right:.5em}.formulate-input[data-classification=file] .formulate-files .formulate-file-remove{width:1.25em;height:1.25em;border-radius:1em;border:1px solid #a8a8a8;background-color:#a8a8a8;-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 59.1 59.2"><path d="M1.6,57.7a5,5,0,0,0,3.5,1.5,4.85,4.85,0,0,0,3.5-1.5l21-21,21,21a5,5,0,0,0,3.5,1.5,4.85,4.85,0,0,0,3.5-1.5,5,5,0,0,0,0-7.1l-21-21,21-21a5,5,0,0,0,0-7.1,5,5,0,0,0-7.1,0l-21,21L8.6,1.7a5,5,0,0,0-7.1,0,5,5,0,0,0,0,7.1l21,21L1.6,50.7A4.83,4.83,0,0,0,1.6,57.7Z"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 59.1 59.2"><path d="M1.6,57.7a5,5,0,0,0,3.5,1.5,4.85,4.85,0,0,0,3.5-1.5l21-21,21,21a5,5,0,0,0,3.5,1.5,4.85,4.85,0,0,0,3.5-1.5,5,5,0,0,0,0-7.1l-21-21,21-21a5,5,0,0,0,0-7.1,5,5,0,0,0-7.1,0l-21,21L8.6,1.7a5,5,0,0,0-7.1,0,5,5,0,0,0,0,7.1l21,21L1.6,50.7A4.83,4.83,0,0,0,1.6,57.7Z"/></svg>');-webkit-mask-size:.6em;mask-size:.6em;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;cursor:pointer;position:absolute;right:.75em;z-index:1;transition:transform .25s}@media (pointer:fine){.formulate-input[data-classification=file] .formulate-files .formulate-file-remove:hover{transform:scale(1.5)}}.formulate-input[data-classification=file] .formulate-files li{display:block}.formulate-input[data-classification=file] .formulate-files li[data-has-error] .formulate-file-progress{background-color:#dc2c2c}.formulate-input[data-classification=file] .formulate-files li[data-has-preview] .formulate-file-name:before{display:none}.formulate-input[data-classification=file] .formulate-files li+li{margin-top:.5em}.formulate-input[data-classification=file] .formulate-files .formulate-file{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:.3em;border:1px solid #cecece;box-sizing:border-box;background-color:transparent;font-size:.9em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;padding:.75em;display:block;font-weight:400;line-height:1.2em;margin:0;width:100%;display:flex;justify-content:space-between;align-items:center;position:relative}.formulate-input[data-classification=file] .formulate-files .formulate-file::-moz-placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=file] .formulate-files .formulate-file:-ms-input-placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=file] .formulate-files .formulate-file::placeholder{color:#a8a8a8;line-height:normal}.formulate-input[data-classification=file] .formulate-files .formulate-file:focus{outline:0;border:1px solid #41b883}.formulate-input[data-classification=file] .formulate-files .formulate-file ::-webkit-progress-bar{-webkit-appearance:none;appearance:none;height:.5em;border-radius:.5em;overflow:hidden}.formulate-input[data-classification=file] .formulate-files .formulate-file-image-preview{width:3em;height:3em;flex:0 0 3em;position:relative;z-index:2;left:-1px;box-shadow:0 0 0 1px #efefef;transition:transform .25s,box-shadow .25s,background-color .25s}@media (pointer:fine){.formulate-input[data-classification=file] .formulate-files .formulate-file-image-preview:hover{transition-delay:.2s;transform:scale(3);background-color:#fff;box-shadow:0 0 2px 0 rgba(0,0,0,.1)}}.formulate-input[data-classification=file] .formulate-files .formulate-file-image-preview img{display:block;position:absolute;width:100%;height:100%;left:0;right:0;bottom:0;top:0;-o-object-fit:contain;object-fit:contain;transition:all .25s}.formulate-input[data-classification=file] [data-type=image] .formulate-input-upload-area .formulate-input-upload-area-mask:before{-webkit-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 90 71.05"><path d="M82.89,0H7.1A7.12,7.12,0,0,0,0,7.11V64a7.11,7.11,0,0,0,7.1,7.1H82.9A7.11,7.11,0,0,0,90,64V7.11A7.12,7.12,0,0,0,82.89,0ZM69.28,39.35a5.44,5.44,0,0,0-8,0L50.58,50.74,32.38,30.88a5.31,5.31,0,0,0-7.92,0L4.74,52.4V7.11A2.37,2.37,0,0,1,7.11,4.74H82.9a2.37,2.37,0,0,1,2.36,2.37V56.3Z"/><circle cx="67.74" cy="22.26" r="8.53"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 90 71.05"><path d="M82.89,0H7.1A7.12,7.12,0,0,0,0,7.11V64a7.11,7.11,0,0,0,7.1,7.1H82.9A7.11,7.11,0,0,0,90,64V7.11A7.12,7.12,0,0,0,82.89,0ZM69.28,39.35a5.44,5.44,0,0,0-8,0L50.58,50.74,32.38,30.88a5.31,5.31,0,0,0-7.92,0L4.74,52.4V7.11A2.37,2.37,0,0,1,7.11,4.74H82.9a2.37,2.37,0,0,1,2.36,2.37V56.3Z"/><circle cx="67.74" cy="22.26" r="8.53"/></svg>')}.formulate-form-errors{margin:.75em 0;padding:0;list-style-type:none}.formulate-form-errors:first-child{margin-top:0}.formulate-form-errors:last-child{margin-bottom:0}.formulate-form-errors .formulate-form-error{color:#960505;font-size:.9em;font-weight:300;line-height:1.5;margin-bottom:.25em}
diff --git a/shared/templates/shared/blocks/newsletter_subscription_block.html b/shared/templates/shared/blocks/newsletter_subscription_block.html
index 5054b5208b98cdbced687fb12fe3cf518c9a4507..26092503f782604f36ba32e542fa728cc1363ca4 100644
--- a/shared/templates/shared/blocks/newsletter_subscription_block.html
+++ b/shared/templates/shared/blocks/newsletter_subscription_block.html
@@ -1,8 +1,12 @@
-{% load static wagtailcore_tags wagtailroutablepage_tags %}
+{% load static shared_filters wagtailcore_tags wagtailroutablepage_tags %}
<div class="__js-root">
<ui-app inline-template>
- <div class="flex flex-row flex-wrap xl:items-center mt-20 xl:mt-0">
+ {% if page.has_newsletter_form %}
+ <div data-url="{{ request.scheme }}://{{ request.get_host }}{% pageurl page %}{% routablepageurl page 'newsletter' %}" class="flex flex-row flex-wrap xl:items-center mt-20 xl:mt-0">
+ {% else %}
+ <div data-url="{{ request.scheme }}://{{ request.get_host }}{% routablepageurl page.root_page 'newsletter' %}" class="flex flex-row flex-wrap xl:items-center mt-20 xl:mt-0">
+ {% endif %}
<noscript>
<ul class="flex flex-col w-full drop-shadow-lg">
<li class="px-5 py-4 text-center relative bg-green-400 text-white">
@@ -15,7 +19,7 @@
</li>
</ul>
</noscript>
- <div class="mr-5">
+ <div class="mr-20">
{% if self.design.icon %}
<img src="{{ self.design.icon.full_url }}" alt="newsletter_icon" class="newsletter-grid__icon text-7xl xl:text-9xl w-32">
{% else %}
@@ -30,54 +34,46 @@
{{ self.design.subtitle }}
</span>
<div class="flex flex-col items-start">
- {% if page.has_newsletter_form %}
- <div url="{% routablepageurl page.root_page 'newsletter' %}" class="mailtrain-form-container">
- {% else %}
- <div url="{% routablepageurl page 'newsletter' %}" class="mailtrain-form-container">
- {% endif %}
- <formulate-form @submit="onSubmit" #default="{ isLoading, hasErrors }">
- {% csrf_token %}
- {% if self.config.send_timezone %}
- <formulate-input
- type="hidden"
- name="send_timezone"
- value="True"
- />
- {% endif %}
- {% if self.config.force_subscribe %}
- <formulate-input
- type="hidden"
- name="force_subscribe"
- value="True"
- />
- {% endif %}
- {% if self.config.show_name_input %}
- <formulate-input type="text" name="first_name" :element-class="() => ['text-input', 'bg-white', 'form-field__control', 'mb-3', 'w-full']" label="{{ self.design.labels.first_name }}"
- placeholder="{{ self.design.labels.first_name }}" validation="required" error-behavior="value"
- label-class="sr-only" />
- <formulate-input type="text" name="last_name" :element-class="() => ['text-input', 'bg-white', 'form-field__control', 'mb-3', 'w-full']" label="{{ self.design.labels.last_name }}"
- placeholder="{{ self.design.labels.last_name }}" validation="required" error-behavior="value"
- label-class="sr-only" />
- {% endif %}
- <formulate-input type="email" name="email" :element-class="() => ['text-input', 'bg-white', 'form-field__control', 'mb-3', 'w-full']" label="{{ self.design.labels.email }}"
- placeholder="{{ self.design.labels.email }}" validation="required|email" error-behavior="value"
- label-class="sr-only" />
- <div class="checkbox form-field__control flex items-center mb-3">
- <formulate-input id="consent_checkbox" type="checkbox" :element-class="() => []" validation="required" error-behavior="value" />
- <label for="consent_checkbox" class="text-xs font-alt font-light">
- {% include_block self.design.consent %}
+ <formulate-form @submit="mailtrainsubmit" #default="{ isLoading, hasErrors }">
+ {% csrf_token %}
+ {% if self.config.send_timezone %}
+ <formulate-input
+ type="hidden"
+ name="send_timezone"
+ value="True"
+ ></formulate-input>
+ {% endif %}
+ {% if self.config.force_subscribe %}
+ <formulate-input
+ type="hidden"
+ name="force_subscribe"
+ value="True"
+ ></formulate-input>
+ {% endif %}
+ {% if self.config.show_name_input %}
+ <formulate-input type="text" name="first_name" :input-class="() => ['text-input', 'bg-white', 'form-field__control', 'mb-3', 'w-full']" label="{{ self.design.labels.first_name }}"
+ placeholder="{{ self.design.labels.first_name }}" validation="required" error-behavior="blur"
+ label-class="sr-only"></formulate-input>
+ <formulate-input type="text" name="last_name" :input-class="() => ['text-input', 'bg-white', 'form-field__control', 'mb-3', 'w-full']" label="{{ self.design.labels.last_name }}"
+ placeholder="{{ self.design.labels.last_name }}" validation="required" error-behavior="blur"
+ label-class="sr-only"></formulate-input>
+ {% endif %}
+ <formulate-input type="email" name="email" :input-class="() => ['text-input', 'bg-white', 'form-field__control', 'mb-3', 'w-full']" label="{{ self.design.labels.email }}"
+ placeholder="{{ self.design.labels.email }}" validation="^required|email" error-behavior="blur"
+ label-class="sr-only"></formulate-input>
+ <formulate-input type="checkbox" name="consent" validation-name="souhlas s osobními údaji" :wrapper-class="() => []" :input-class="() => []" :element-class="() => ['checkbox', 'form-field__control', 'flex', 'items-center', 'mb-3']" validation="required" error-behavior="blur">
+ <template #suffix="{ id }">
+ <label :for="id" class="text-xs font-alt font-light">
+ {{ self.design.consent|inline_richtext }}
</label>
+ </template>
+ </formulate-input>
+ <button type="submit" class="btn btn--black font-alt btn--to-yellow-500 btn--hoveractive uppercase">
+ <div class="btn__body-wrap">
+ <div v-html="isLoading ? 'Odesílám...' : '{{ self.design.button }}'" class="btn__body"></div>
</div>
- <formulate-errors />
- <button type="submit" :disabled="isLoading || hasErrors" class="btn btn--black btn--to-yellow-500 btn--hoveractive uppercase">
- <span class="btn__body-wrap">
- <span v-html="isLoading ? 'Odesílám...' : '{{ self.design.button }}'" class="btn__body text-lg lg:text-base">
- Odebírat
- </span>
- </span>
- </button>
- </formulate-form>
- </div>
+ </button>
+ </formulate-form>
</div>
</div>
</div>
diff --git a/shared/templatetags/shared_filters.py b/shared/templatetags/shared_filters.py
index 2f06f9ad6a92564d9e3e51757ad0d935f2f7f84f..7fcb579557eb348927a7d633ca82fda854544d7c 100644
--- a/shared/templatetags/shared_filters.py
+++ b/shared/templatetags/shared_filters.py
@@ -1,6 +1,7 @@
import markdown as md
from django import template
from django.utils.safestring import mark_safe
+from wagtail.rich_text import RichText, expand_db_html
register = template.Library()
@@ -9,3 +10,21 @@ register = template.Library()
def markdown(value):
"""Prekonvertuje vstupni text na markdown, necekane"""
return mark_safe(md.markdown(value))
+
+
+@register.filter
+def inline_richtext(value):
+ if isinstance(value, RichText):
+ html = expand_db_html(value.source)
+ elif isinstance(value, str):
+ html = expand_db_html(value)
+ elif value is None:
+ html = ""
+ else:
+ raise TypeError(
+ "'richtext_withclasses' template filter received an invalid value; expected string, got {}.".format(
+ type(value)
+ )
+ )
+
+ return mark_safe(html)
diff --git a/uniweb/models.py b/uniweb/models.py
index 40dba580af830ace5f6d86eaeb7b7cefe2d597b7..9d798ff285007dab0c1113fbea51752213d6323c 100644
--- a/uniweb/models.py
+++ b/uniweb/models.py
@@ -18,6 +18,7 @@ from wagtail.admin.panels import (
)
from wagtail.contrib.forms.models import AbstractForm, AbstractFormField
from wagtail.contrib.forms.panels import FormSubmissionsPanel
+from wagtail.contrib.routable_page.models import RoutablePageMixin, route
from wagtail.contrib.table_block.blocks import TableBlock
from wagtail.fields import RichTextField, StreamField
from wagtail.images.blocks import ImageChooserBlock
@@ -307,6 +308,7 @@ class UniwebHomePage(
MetadataPageMixin,
CalendarMixin,
NewsletterFormMixin,
+ RoutablePageMixin,
FooterMixin,
):
### FIELDS
@@ -408,6 +410,10 @@ class UniwebHomePage(
### OTHERS
+ @route(r"^newsletter/$", name="newsletter")
+ def newsletter(self, posted):
+ return self.newsletter_post(posted)
+
class Meta:
verbose_name = "Univerzální web"
@@ -426,6 +432,7 @@ class UniwebFlexiblePage(
SubpageMixin,
MetadataPageMixin,
NewsletterFormMixin,
+ RoutablePageMixin,
):
### FIELDS
@@ -457,6 +464,10 @@ class UniwebFlexiblePage(
### OTHERS
+ @route(r"^newsletter/$", name="newsletter")
+ def newsletter(self, posted):
+ return self.newsletter_post(posted)
+
class Meta:
verbose_name = "Flexibilní stránka"
diff --git a/uniweb/templates/uniweb/base.html b/uniweb/templates/uniweb/base.html
index 2c2f2f6182dd6445a7d98aeeb4760636f584d217..b4f780c67c8852d3ec08b492428eeb6164108aae 100644
--- a/uniweb/templates/uniweb/base.html
+++ b/uniweb/templates/uniweb/base.html
@@ -20,7 +20,8 @@
<link href="https://styleguide.pirati.cz/2.11.x/css/styles.css" rel="stylesheet" media="all" />
<link href="https://styleguide.pirati.cz/2.11.x/css/pattern-scaffolding.css" rel="stylesheet" media="all" />
<link href="{% static "shared/vendor/fancybox/jquery.fancybox.min.css" %}" rel="stylesheet">
- <link rel="stylesheet" href="{% static "shared/vendor/bootstrap-4.4.1/css/bootstrap.min.css" %}">
+ <link rel="stylesheet" href="{% static "shared/vendor/vue-formulate-2.5.3/css/snow.min.css" %}">
+ <link rel="stylesheet" href="{% static "shared/css/helpers.css" %}">
<style type="text/css">
.head-alt-md, .head-alt-lg {