t88: new newsletter

remotes/origin/t90_expo_page
Slava Kyrachevsky 9 years ago
parent 9b3e54a490
commit 347a5bea8d
  1. 8
      apps/emencia/django/newsletter/views/expo_views.py
  2. 40
      static/mailing_settings/css/main.css
  3. 34
      static/mailing_settings/js/main.js
  4. 115
      templates/client/newsletters/mailing_settings.html

@ -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']

@ -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;

@ -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 = $()
})
});

@ -70,36 +70,55 @@
{{ form.email }}
</span>
</div>
<button>{% trans 'Подписаться' %}</button>
{% comment %}<button>{% trans 'Выбрать рубрики' %}</button>{% endcomment %}
<a href="#themes_block" class="button smooth_scroll">{% trans 'Выбрать рубрики' %}</a>
</fieldset>
</div>
</div>
</section>
{% endif %}
<div class="themes_block">
<div id="themes_block" class="themes_block">
<div class="container">
<h2>{% trans 'Какие события включать в ваше письмо?' %}</h2>
<div class="columns">
<div class="column">
<h3>{% trans 'Ваши темы:' %}</h3>
<ul id="selected_themes" class="selected selected_themes">
{% for theme in object.themes.all %}
<li data-id="{{ theme.pk }}" data-type="th" class="theme_{{ theme.pk }}">
<input type="hidden" name="th" value="{{ theme.pk }}">
{{ theme }}
<a href="#">&times;</a>
</li>
{% endfor %}
{% for tag in object.tags.all %}
<li data-id="{{ tag.pk }}" data-type="tg" data-parent="{{ tag.theme.pk }}" class="tag_{{ tag.pk }}">
<input type="hidden" name="tg" value="{{ tag.pk }}">
{{ tag }}
<a href="#">&times;</a>
</li>
{% endfor %}
</ul>
<a href="#search-modal" class="modal_trigger themes_trigger">{% trans 'Уточнить темы' %}</a>
<div id="selected_themes_block">
<h3>{% trans 'Ваши темы:' %}</h3>
<p>Отметьте темы, по которым вы хотите получать анонсы событий</p>
{% if not user.is_authenticated %}
<ul id="popular_themes" class="popular_themes">
{% for theme in popular_themes %}
<li>
<input id="id_popular_theme_{{ theme.pk }}" type="checkbox" name="th" value="{{ theme.pk }}">
<label for="id_popular_theme_{{ theme.pk }}">{{ theme }}</label>
</li>
{% endfor %}
</ul>
{% endif %}
<ul id="selected_themes" class="selected selected_themes">
{% for theme in object.themes.all %}
<li data-id="{{ theme.pk }}" data-type="th" class="theme_{{ theme.pk }}">
<input type="hidden" name="th" value="{{ theme.pk }}">
{{ theme }}
<a href="#">&times;</a>
</li>
{% endfor %}
{% for tag in object.tags.all %}
<li data-id="{{ tag.pk }}" data-type="tg" data-parent="{{ tag.theme.pk }}" class="tag_{{ tag.pk }}">
<input type="hidden" name="tg" value="{{ tag.pk }}">
{{ tag }}
<a href="#">&times;</a>
</li>
{% endfor %}
</ul>
<a href="#search-modal" class="modal_trigger themes_trigger">
{% comment %}{% trans 'Уточнить темы' %}{% endcomment %}
{% trans 'Выбрать из полного списка' %}
</a>
</div>
</div>
<div class="column">
<h3>{% trans 'Ваши гео-фильтры:' %}</h3>
@ -169,37 +188,39 @@
</div>
</div>
</div>
<div class="period_block">
<div class="container">
<h2>{% trans 'Регулярность получения писем' %}</h2>
<div class="columns">
<div class="column periodic">
<ul>
{% for field in form.periodic %}
<li>
<label>
{{ field.tag }}
<span class="radio">
{{ field.choice_label }}
</span>
</label>
</li>
{% comment %}
<div class="period_block">
<div class="container">
<h2>{% trans 'Регулярность получения писем' %}</h2>
<div class="columns">
<div class="column periodic">
<ul>
{% for field in form.periodic %}
<li>
<label>
{{ field.tag }}
<span class="radio">
{{ field.choice_label }}
</span>
</label>
</li>
{% endfor %}
</ul>
</div>
<div class="column mailing_day">
{% for field in form.periodic_day %}
<label>
{{ field.tag }}
<span class="radio">
{{ field.choice_label }}
</span>
</label>
{% endfor %}
</ul>
</div>
<div class="column mailing_day">
{% for field in form.periodic_day %}
<label>
{{ field.tag }}
<span class="radio">
{{ field.choice_label }}
</span>
</label>
{% endfor %}
</div>
</div>
</div>
</div>
</div>
{% endcomment %}
<div class="button_block">
<div class="container">
{% if not user.is_authenticated %}

Loading…
Cancel
Save