Skip to content
Snippets Groups Projects
Commit b63163fc authored by jindra12's avatar jindra12 Committed by jan.bednarik
Browse files

Add basic newsletter form FE support

parent 68871102
No related branches found
No related tags found
2 merge requests!804Release,!779Add basic newsletter form FE support
Expand all Show whitespace changes
Inline Side-by-side
Showing
with 182 additions and 0 deletions
district/templates/district/base.html
+ 4
− 0
View file @ b63163fc
......@@ -22,6 +22,7 @@
<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/css/helpers.css" %}">
<link rel="stylesheet" href="{% static "shared/vendor/bootstrap-4.4.1/css/bootstrap.min.css" %}">
{% block styles %}{% endblock %}
......@@ -351,6 +352,9 @@
<script src="{% static "shared/vendor/jquery/jquery-3.4.1.min.js" %}"></script>
<script src="{% static "shared/vendor/lazysizes/lazysizes.min.js" %}"></script>
<script src="{% static "shared/vendor/fancybox/jquery.fancybox.min.js" %}"></script>
<script src="{% static "shared/vendor/vue-formulate-2.5.3/js/formulate.umd.min.js" %}"></script>
<script src="{% static "shared/vendor/vue-formulate-i18n-1.16.0/js/cs.min.js" %}"></script>
<script src="{% static "shared/js/vue-formulate-helper.js" %}"></script>
{% include "maps_utils/includes/scripts.html" %}
......
shared/blocks.py
+ 110
− 0
View file @ b63163fc
......@@ -1073,6 +1073,116 @@ class FooterLinksBlock(blocks.StructBlock):
template = "shared/blocks/footer_links_block.html"
class NewsletterSubscriptionBlock(blocks.StructBlock):
subscription_id = blocks.CharBlock(label="ID newsletteru")
access_token = blocks.CharBlock(label="Access token")
design = blocks.StructBlock(
local_blocks=[
("icon", ImageChooserBlock(label="Vyberte si ikonku k formuláři")),
("title", blocks.CharBlock(label="Nadpis formuláře")),
("subtitle", blocks.CharBlock(label="Podnadpis formuláře")),
(
"consent",
blocks.RichTextBlock(label="Souhlas se zpracováním osobních údajů"),
),
("button", blocks.CharBlock(label="Tlačítko pro přihlášení k newsletteru")),
(
"require_confirmation",
blocks.CharBlock(
label="Zpráva o úspěšném zaslání potvrzovacího emailu"
),
),
(
"no_require_confirmation",
blocks.CharBlock(
label="Zpráva o úspěšném zaregistrování k newsletteru",
help_text="Zobrazí se pouze pokud od uživatele nepožadujeme ověřovací email",
),
),
(
"labels",
blocks.StructBlock(
local_blocks=[
("email", blocks.CharBlock(label="Popisek emailu")),
(
"first_name",
blocks.CharBlock(label="Popisek křestního jména"),
),
("last_name", blocks.CharBlock(label="Popisek příjmení")),
],
default=[
("email", "Tvůj e-mail"),
("first_name", "Tvoje křestní jméno"),
("last_name", "Tvoje příjmení"),
],
label="popisky vstupů uživatele",
required=True,
),
),
],
default=[
("title", "Odebírej náš newsletter"),
(
"subtitle",
"Fake news tam nenajdeš, ale dozvíš se, co chystáme doopravdy!",
),
("consent", "Souhlasím se zpracováním osobních údajů"),
(
"require_confirmation",
"Zkontroluj si prosím schránku, poslali jsme ti potvrzovací e-mail.",
),
("no_require_confirmation", "Jsi přihlášen/a k odběru našich novinek."),
("button", "Odebírat"),
],
label="Design formuláře",
required=True,
)
config = blocks.StructBlock(
local_blocks=[
(
"require_confirmation",
blocks.BooleanBlock(
label="Požadovat zaslání ověřovacího e-mailu?", required=False
),
)(
"show_name_input",
blocks.BooleanBlock(
label="Umožnit uživateli přidat jméno a příjmení?", required=False
),
),
(
"force_subscribe",
blocks.BooleanBlock(
label="Přihlásit uživatele, i když se v minulosti odhlásil?",
required=False,
),
),
(
"send_timezone",
blocks.BooleanBlock(
label="Zasílat timezone podle uživatelova prohlížeče?",
required=False,
),
),
],
default=[
("require_confirmation", True),
("show_name_input", False),
("force_subscribe", True),
("send_timezone", False),
],
label="Konfigurace",
required=True,
)
class Meta:
label = "Formulář pro odebírání newsletteru"
icon = "form"
template = "shared/blocks/newsletter_subscription_block.html"
DEFAULT_CONTENT_BLOCKS = [
(
"text",
......
shared/static/shared/js/vue-formulate-helper.js 0 → 100644
+ 4
− 0
View file @ b63163fc
Vue.use(VueFormulate, {
plugins: [VueFormulateI18n.cs],
locale: "cs",
});
shared/static/shared/vendor/vue-formulate-2.5.3/js/formulate.umd.min.js 0 → 100644
+ 7
− 0
View file @ b63163fc
This diff is collapsed.
shared/static/shared/vendor/vue-formulate-i18n-1.16.0/js/cs.min.js 0 → 100644
+ 1
− 0
View file @ b63163fc
this.VueFormulateI18n=this.VueFormulateI18n||{},this.VueFormulateI18n.cs=function(n){"use strict";function e(n){return"string"==typeof n?n[0].toUpperCase()+n.substr(1):n}var r={accepted:function(n){return"Prosím potvrďte "+n.name+"."},after:function(n){var r=n.name,a=n.args;return Array.isArray(a)&&a.length?e(r)+" musí bý po "+a[0]+".":e(r)+" musí být pozdější datum."},alpha:function(n){return e(n.name)+" může obsahovat pouze písmena."},alphanumeric:function(n){return e(n.name)+" může obsahovat pouze písmena a čísla."},before:function(n){var r=n.name,a=n.args;return Array.isArray(a)&&a.length?e(r)+" musí být před "+a[0]+".":e(r)+" musí být dřívější datum."},between:function(n){var r=n.name,a=n.value,t=n.args,o=!(!Array.isArray(t)||!t[2])&&t[2];return!isNaN(a)&&"length"!==o||"value"===o?e(r)+" musí být mezi "+t[0]+" a "+t[1]+".":e(r)+" délka musí být mezi "+t[0]+" a "+t[1]+" znaky."},confirm:function(n){var r=n.name;n.args;return e(r)+" se neshoduje."},date:function(n){var r=n.name,a=n.args;return Array.isArray(a)&&a.length?e(r)+" není platné datum, použijte formát "+a[0]:e(r)+" není platné datum."},default:function(n){n.name;return"Toto pole není vyplěno správně."},email:function(n){n.name;var e=n.value;return e?"“"+e+"” není platná e-mailová adresa.":"Zadejte platnou e-mailovou adresu."},endsWith:function(n){n.name;var e=n.value;return e?"“"+e+"” nekončí správnou hodnotou.":"Toto pole nekončí správnou hodnotou."},in:function(n){var r=n.name,a=n.value;return"string"==typeof a&&a?"“"+e(a)+"” není povolená hodnota "+r+".":"Toto není povolená hodnota "+r+"."},matches:function(n){return e(n.name)+" není povolená hodnota."},max:function(n){var r=n.name,a=n.value,t=n.args;if(Array.isArray(a))return"Můžete vybrat pouze "+t[0]+" "+r+".";var o=!(!Array.isArray(t)||!t[1])&&t[1];return!isNaN(a)&&"length"!==o||"value"===o?e(r)+" musí být menší nebo rovno "+t[0]+".":e(r)+" musí být menší nebo rovno "+t[0]+" znaků."},mime:function(n){var r=n.name,a=n.args;return e(r)+" musí být typ: "+(a[0]||"Žádné typy souborů nejsou povolené.")},min:function(n){var r=n.name,a=n.value,t=n.args;if(Array.isArray(a))return"Je potřeba nejméně "+t[0]+" "+r+".";var o=!(!Array.isArray(t)||!t[1])&&t[1];return!isNaN(a)&&"length"!==o||"value"===o?e(r)+" musí být nejméně "+t[0]+".":e(r)+" musí být nejméně "+t[0]+" znaků."},not:function(n){var e=n.name;return"“"+n.value+"” není povolená hodnota "+e+"."},number:function(n){return e(n.name)+" musí být číslo."},required:function(n){return"Pole "+e(n.name)+" je povinné."},startsWith:function(n){n.name;var e=n.value;return e?"“"+e+"” nezačíná platnou hodnotou.":"Toto pole nezačíná platnou hodnotou."},url:function(n){n.name;return"Zadejte platnou URL adresu."}};return n.default=function(n){var e;n.extend({locales:(e={},e.cs=r,e)})},n}({});
shared/templates/shared/blocks/newsletter_subscription_block.html 0 → 100644
+ 56
− 0
View file @ b63163fc
{% load wagtailcore_tags %}
<div class="__js-root">
<ui-app inline-template>
<div class="grid-container mt-20 xl:mt-0 xl:items-center z-10">
<ul class="flex flex-col w-full drop-shadow-lg">
<li class="px-5 py-4 text-center relative z-50 bg-green-400 text-white">
<i class="ico--checkmark mr-2"></i>
{% if self.config.require_confirmation %}
{{ self.design.require_confirmation }}
{% else %}
{{ self.design.no_require_confirmation }}
{% endif %}
</li>
</ul>
<div>
<img src="{{ self.design.icon.full_url }}" alt="newsletter_icon" class="newsletter-grid__icon text-7xl xl:text-9xl w-32">
</div>
<div>
<h5 class="font-alt mb-2 text-5xl md:text-6xl xl:text-7xl uppercase">
{{ self.design.title }}
</h5>
<span class="inline-block uppercase text-xl xl:text-base font-bold mb-4 xl:w-full">
{{ self.design.subtitle }}
</span>
<div class="flex flex-col items-start">
<FormulateForm method="POST" action="{% fullpageurl page.root_page %}/newsletter" #default="{ isLoading, hasErrors }">
{% csrf_token %}
{% if self.config.show_name_input %}
<FormulateInput 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" />
<FormulateInput 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 %}
<FormulateInput 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">
<FormulateInput type="checkbox" label="{% include_block self.design.consent %}" label-class="text-xs font-alt font-light" validation="required" error-behavior="value" />
</div>
<FormulateErrors />
<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>
</FormulateForm>
</div>
</div>
</div>
</ui-app>
</div>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment

Pirátský GitLab - Home of the CopyLeft