diff --git a/apps/emencia/django/newsletter/views/expo_views.py b/apps/emencia/django/newsletter/views/expo_views.py index 45d16142..d414e574 100644 --- a/apps/emencia/django/newsletter/views/expo_views.py +++ b/apps/emencia/django/newsletter/views/expo_views.py @@ -15,6 +15,7 @@ from accounts.models import User from accounts.views import GetUserMixin from functions.http import JsonResponse from city.models import City +from theme.models import Theme class SubscribeView(GetUserMixin, FormView): @@ -81,6 +82,7 @@ class SubscribeView(GetUserMixin, FormView): ctx['object'] = self.object ctx['r_cities'] = self.get_russian_cities() ctx['checked_th'] = self.get_checked_th() + ctx['popular_themes'] = self.get_popular_themes() if self.object is not None: if self.request.GET.get('unsibscribe') and self.object.subscriber: @@ -105,6 +107,12 @@ class SubscribeView(GetUserMixin, FormView): return self.object.themes.values_list('pk', flat=True) return [] + def get_popular_themes(self): + """ + :return: + """ + return Theme.objects.all()[:7] + class ActivationView(TemplateView): http_method_names = ['get'] diff --git a/static/mailing_settings/css/main.css b/static/mailing_settings/css/main.css index 8f7f887d..275f6cab 100644 --- a/static/mailing_settings/css/main.css +++ b/static/mailing_settings/css/main.css @@ -88,11 +88,29 @@ h3{ } .themes_block h3 { - margin-bottom: 30px; + margin-bottom: 20px; +} + +.themes_block p { + font-size: 18px; + color: #999999; + margin-bottom: 20px; +} + +.popular_themes { + font-size: 18px; + margin-bottom: 20px; + list-style: none; +} + +.popular_themes li { + padding: 5px 0; + font-weight: 300; } .subjects_block{ padding: 50px 0; + margin-bottom: 10px; } .page_footer{ @@ -262,12 +280,14 @@ h3{ .subjects_block input, .periodic input, -.mailing_day input{ +.mailing_day input, +.popular_themes input{ display: none; } .subjects_block input + label, -.periodic input + .radio{ +.periodic input + .radio, +.popular_themes input + label{ position: relative; padding-left: 40px; cursor: pointer; @@ -275,6 +295,7 @@ h3{ } .subjects_block input + label:before, +.popular_themes input + label:before, .periodic input + .radio:before, .mailing_day input + .radio:before{ content: ""; @@ -290,6 +311,7 @@ h3{ } .subjects_block input + label:after, +.popular_themes input + label:after, .periodic input + .radio:after, .mailing_day input + .radio:after{ content: ''; @@ -305,6 +327,7 @@ h3{ } .subjects_block input:checked + label:before, +.popular_themes input:checked + label:before, .periodic input:checked + .radio:before, .mailing_day input:checked + .radio:before{ border-color: #FF6600; @@ -312,6 +335,7 @@ h3{ } .subjects_block input:checked + label:after, +.popular_themes input:checked + label:after, .periodic input:checked + .radio:after, .mailing_day input:checked + .radio:after{ opacity: 1; @@ -354,6 +378,7 @@ h3{ } .mailing_day label:hover .radio:before, +.popular_themes label:hover .radio:before, .periodic label:hover .radio:before, .subjects_block label:hover:before { border-color: #FF6600; @@ -416,8 +441,8 @@ h3{ } a.themes_trigger{ - display: block; - width: 190px; + display: inline-block; + min-width: 190px; height: 35px; line-height: 35px; background-color: #FF6600; @@ -427,6 +452,7 @@ a.themes_trigger{ text-decoration: none; text-align: center; font-weight: 300; + padding: 0 40px; } .selected{ @@ -922,8 +948,10 @@ a.themes_trigger{ opacity:1; } -.pr-form button{ +.pr-form button, +.pr-form .button{ display:block; + text-decoration: none; border:2px solid #fff; border-radius:4px; background:#ff6900; diff --git a/static/mailing_settings/js/main.js b/static/mailing_settings/js/main.js index 249e0ca6..fa923e1e 100644 --- a/static/mailing_settings/js/main.js +++ b/static/mailing_settings/js/main.js @@ -58,6 +58,7 @@ function sendForm (show_modal) { $autocomplete = $('#autocomplete_themes', $themes_modal), $autocomplete_results = $('#autocomplete_themes_results', $themes_modal), $selected_themes = $('.selected_themes', $themes_modal), + $popular_themes = $('#popular_themes'), timer, themes_data = {}, // template for mustache.js @@ -218,6 +219,16 @@ function sendForm (show_modal) { } + $popular_themes.on('change', 'input[type="checkbox"]', function () { + var theme_id = this.value; + changeThemeData(theme_id, !themes_data[theme_id].checked, true); + $themes_modal + .find('#id_th_' + theme_id) + .prop('checked', themes_data[theme_id].checked) + .trigger('change'); + }); + + $themes_modal.on('change', 'input[type="checkbox"]', function (e) { e.preventDefault(); // sendForm(); @@ -232,6 +243,7 @@ function sendForm (show_modal) { if ($checkbox.is(':checked')) { changeThemeData($checkbox.val(), true, true); + // Отмечаем выбранными все теги у темы $sub_list.find('input[name="tg"]').each(function (i, checkbox) { $(checkbox).prop('checked', true); }); @@ -243,6 +255,14 @@ function sendForm (show_modal) { var rendered_theme = renderTheme($checkbox.val()); $selected_themes.append(rendered_theme); + + console.log($popular_themes.find('#id_popular_theme_' + $checkbox.val())); + + // Ставим чекбокс на популярных темах + $popular_themes + .find('#id_popular_theme_' + $checkbox.val()) + .prop('checked', true); + // Сняли чекбокс темы } else { changeThemeData($checkbox.val(), false, true); @@ -252,6 +272,10 @@ function sendForm (show_modal) { }); removeSelectedItem($checkbox.attr('name'), $checkbox.val()); + + $popular_themes + .find('#id_popular_theme_' + $checkbox.val()) + .prop('checked', false); } // Изменили чекбокс тега @@ -381,6 +405,10 @@ function sendForm (show_modal) { $this.parents('li').remove(); } + if (!$('#selected_themes').find('li').length) { + $popular_themes.show(); + } + checkSelected(); } @@ -409,6 +437,8 @@ function sendForm (show_modal) { $('#selected_themes').html($selected); sendForm(); + $selected.length ? $popular_themes.hide() : $popular_themes.show(); + $.fancybox.close(); }); @@ -675,4 +705,8 @@ $(function () { if ($('#unsibscribed').length) $.fancybox.open({href: '#unsibscribed'}); + + $('.smooth_scroll').on('click', function (event) { + var target = $() + }) }); diff --git a/templates/client/newsletters/mailing_settings.html b/templates/client/newsletters/mailing_settings.html index 60e1929c..fdb8d228 100644 --- a/templates/client/newsletters/mailing_settings.html +++ b/templates/client/newsletters/mailing_settings.html @@ -70,36 +70,55 @@ {{ form.email }} - + {% comment %}{% endcomment %} + {% trans 'Выбрать рубрики' %} {% endif %} -
+

{% trans 'Какие события включать в ваше письмо?' %}

-

{% trans 'Ваши темы:' %}

-
    - {% for theme in object.themes.all %} -
  • - - {{ theme }} - × -
    • - {% endfor %} - {% for tag in object.tags.all %} -
  • - - {{ tag }} - × -
    • - {% endfor %} -
- {% trans 'Уточнить темы' %} +
+

{% trans 'Ваши темы:' %}

+

Отметьте темы, по которым вы хотите получать анонсы событий

+ + {% if not user.is_authenticated %} + + {% endif %} + +
    + {% for theme in object.themes.all %} +
  • + + {{ theme }} + × +
    • + {% endfor %} + {% for tag in object.tags.all %} +
  • + + {{ tag }} + × +
    • + {% endfor %} +
+ + {% comment %}{% trans 'Уточнить темы' %}{% endcomment %} + {% trans 'Выбрать из полного списка' %} + +

{% trans 'Ваши гео-фильтры:' %}

@@ -169,37 +188,39 @@
-
-
-

{% trans 'Регулярность получения писем' %}

-
-
-
    - {% for field in form.periodic %} -
  • - -
    • + {% comment %} +
    +
    +

    {% trans 'Регулярность получения писем' %}

    +
    +
    +
      + {% for field in form.periodic %} +
    • + +
      • + {% endfor %} +
    +
    +
    + {% for field in form.periodic_day %} + {% endfor %} -
-
-
- {% for field in form.periodic_day %} - - {% endfor %} +
-
+ {% endcomment %}
{% if not user.is_authenticated %}