Merge branch 'feature/end-video-popup-28-05-19' into 'master'

цифры на главной вынес в настройки

See merge request lilschool/site!316

api/v1/serializers/config.py

@@ -27,6 +27,9 @@ class ConfigSerializer(serializers.ModelSerializer):
     REFERRAL_BONUS = serializers.IntegerField()
     MAIN_PAGE_VIDEO_URL = serializers.CharField(required=False)
     MAIN_PAGE_VIDEO_PREVIEW_IMG = serializers.SerializerMethodField()
+    NUMBER_OF_STUDENTS = serializers.IntegerField()
+    NUMBER_OF_COUNTRIES = serializers.IntegerField()
+    NUMBER_OF_CITIES = serializers.IntegerField()
 
     class Meta:
         model = Config
@@ -50,6 +53,9 @@ class ConfigSerializer(serializers.ModelSerializer):
             'REFERRAL_BONUS',
             'MAIN_PAGE_VIDEO_URL',
             'MAIN_PAGE_VIDEO_PREVIEW_IMG',
+            'NUMBER_OF_STUDENTS',
+            'NUMBER_OF_COUNTRIES',
+            'NUMBER_OF_CITIES',
         )
 
     def get_SCHOOL_LOGO_IMAGE(self, config):

apps/config/migrations/0014_auto_20190605_1338.py

@@ -0,0 +1,28 @@
+# Generated by Django 2.0.7 on 2019-06-05 13:38
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('config', '0013_config_main_page_video_preview_img'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='config',
+            name='NUMBER_OF_CITIES',
+            field=models.IntegerField(default=107),
+        ),
+        migrations.AddField(
+            model_name='config',
+            name='NUMBER_OF_COUNTRIES',
+            field=models.IntegerField(default=81),
+        ),
+        migrations.AddField(
+            model_name='config',
+            name='NUMBER_OF_STUDENTS',
+            field=models.IntegerField(default=17000),
+        ),
+    ]

apps/config/models.py

@@ -23,6 +23,9 @@ class Config(models.Model):
     REFERRAL_BONUS = models.IntegerField(default=10)
     MAIN_PAGE_VIDEO_URL = models.URLField(max_length=126, default='https://www.youtube.com/embed/1w3amQGtQyc')
     MAIN_PAGE_VIDEO_PREVIEW_IMG = models.ImageField(null=True, blank=True)
+    NUMBER_OF_STUDENTS = models.IntegerField(default=17000)
+    NUMBER_OF_COUNTRIES = models.IntegerField(default=81)
+    NUMBER_OF_CITIES = models.IntegerField(default=107)
 
     def save(self, *args, **kwargs):
         self.pk = 1
@@ -57,5 +60,8 @@ class Config(models.Model):
                 'REFERRAL_BONUS': '',
                 'MAIN_PAGE_VIDEO_URL': '',
                 'MAIN_PAGE_VIDEO_PREVIEW_IMG': '',
+                'NUMBER_OF_STUDENTS': '',
+                'NUMBER_OF_COUNTRIES': '',
+                'NUMBER_OF_CITIES': '',
             }
         return obj

apps/course/templatetags/plural.py

@@ -4,14 +4,23 @@ from django.template.defaultfilters import stringfilter
 register = template.Library()
 
 
-@register.filter(is_safe=False)
+def _ruplural(value, arg):
-@stringfilter
-def rupluralize(value, arg):
     args = arg.split(',')
     try:
         _value = str(0 if not value or int(value) <= 0 else value)[-1:]
-        value = value + ' ' + args[0 if _value == '1' else (1 if _value in '234' else 2)]
+        return args[0 if _value == '1' else (1 if _value in '234' else 2)]
-        return value
     except:
         raise template.TemplateSyntaxError
     return ''
+
+
+@register.filter(is_safe=False)
+@stringfilter
+def rupluralize(value, arg):
+    return value + ' ' + _ruplural(value, arg)
+
+
+@register.filter(is_safe=False)
+@stringfilter
+def ruplural(value, arg):
+    return _ruplural(value, arg)

project/templates/blocks/about.html

@@ -1,4 +1,5 @@
 {% load static %}
+{% load ruplural from plural %}
 <div class="anchor" id="about"></div>
 <div class="section section_school" style="padding-top: 0;">
   <div class="section__center center">
@@ -20,26 +21,26 @@
     </div>
     <div class="school school_main">
       <div class="school__col">
-        <div class="school__preview">> 12000</div>
+        <div class="school__preview">> {{ config.NUMBER_OF_STUDENTS }}</div>
-        <div class="school__title">учеников</div>
+        <div class="school__title">{{ config.NUMBER_OF_STUDENTS|ruplural:'ученик,ученика,учеников' }}</div>
         <div class="school__text">прошли обучение в&nbsp;Lil&nbsp;School</div>
       </div>
       <div class="school__col">
         <div class="school__preview">{{ works_count }}</div>
-        <div class="school__title">работ</div>
+        <div class="school__title">{{ works_count|ruplural:'работа,работы,работ' }}</div>
         <div class="school__text">
           создано учениками Lil&nbsp;School.<br>
           Большую часть из&nbsp;них легко найти в&nbsp;<a href="{{ config.SERVICE_INSTAGRAM_URL }}">инстаграм</a>
         </div>
       </div>
       <div class="school__col">
-        <div class="school__preview">32</div>
+        <div class="school__preview">{{ config.NUMBER_OF_COUNTRIES }}</div>
-        <div class="school__title">страны</div>
+        <div class="school__title">{{ config.NUMBER_OF_COUNTRIES|ruplural:'страна,страны,стран' }}</div>
         <div class="school__text">где живут талантливые ученики Lil&nbsp;School</div>
       </div>
       <div class="school__col">
-        <div class="school__preview">107</div>
+        <div class="school__preview">{{ config.NUMBER_OF_CITIES }}</div>
-        <div class="school__title">городов</div>
+        <div class="school__title">{{ config.NUMBER_OF_CITIES|ruplural:'город,города,городов' }}</div>
         <div class="school__text">со&nbsp;всего мира со&nbsp;счастливыми учениками Lil&nbsp;School</div>
       </div>
     </div>

web/src/js/modules/api.js

@@ -89,13 +89,6 @@ export const api = {
             }
         });
     },
-    likeCourse: (courseId) => {
-        return api.post(`/api/v1/courses/${courseId}/like`, {
-            headers: {
-                'Authorization': `Token ${window.LIL_STORE.accessToken}`,
-            }
-        });
-    },
     loadLive: (courseId, accessToken) => {
         return api.get(`/api/v1/live-lesson/${courseId}/`, {
             headers: {

web/src/js/modules/content.js

@@ -1,23 +1,13 @@
 import $ from 'jquery';
 import {loadScript} from '../utils';
-import {api} from '../modules/api';
 
 function getVideoPopup($videoEl){
     const $container = $videoEl.parent();
-    const courseId = $videoEl.data('courseId');
     let $popup = $container.children('.video-ended-popup');
     if(! $popup[0]){
-        $popup = $('<div class="video-ended-popup"><div class="video-ended-popup__like-btn"></div></div>');
+        $popup = $('<div class="video-ended-popup">' +
-        /*if(courseId){
+          '<div class="loading-loader"></div>' +
-            $popup.addClass('video-ended-popup_black');
+          '<div class="video-ended-popup__like-btn"></div></div>');
-
-            $popup.find('.video-ended-popup__like-btn').click(() => {
-                api.likeCourse(courseId).then(() => {
-                    $popup.addClass('video-ended-popup_black');
-                });
-            });
-        }*/
-
         $container.append($popup);
     }
     return $popup;
@@ -34,16 +24,36 @@ $(document).ready(function () {
                 const player = new Vimeo.Player(this);
                 player.on('pause', function(data) {
                     if(data.percent == 1){
-                        getVideoPopup($iframe).show().animate({opacity: 1}, 200);
+                        const $popup = getVideoPopup($iframe);
+                        $popup.show().animate({opacity: 1}, 200);
                         if (document.fullscreenElement){
                             document.exitFullscreen();
                         }
+                        const courseId = $iframe.data('courseId');
+                        if(courseId && window.LIL_STORE.user.id && !window.LIL_STORE.data.courseLiked){
+                            $popup.addClass('video-ended-popup_loading');
+                            $.get('/api/v1/likes/course-liked/', {
+                                course_id: courseId,
+                                user_id: window.LIL_STORE.user.id
+                            }).then(response => {
+                                if(! response.is_liked){
+                                    $popup.addClass('video-ended-popup_like');
+                                    $popup.find('.video-ended-popup__like-btn').click(() => {
+                                        $.post(`/course/${courseId}/like`).then(response => {
+                                            $popup.removeClass('video-ended-popup_like');
+                                            window.LIL_STORE.data.courseLiked = response.success;
+                                        });
+                                    });
+                                }
+                                $popup.removeClass('video-ended-popup_loading');
+                            });
+                        }
                     }
                 });
                 player.on('play', function() {
                     const $p = getVideoPopup($iframe);
                     if($p.is(':visible')){
-                        $p.animate({opacity: 0}, 800).then(() => {$p.hide();});
+                        $p.animate({opacity: 0}, 800).then(() => {$p.hide().attr('class', 'video-ended-popup');});
                     }
                 });
             });

web/src/js/modules/courses.js

@@ -91,9 +91,11 @@ $(document).ready(function () {
                     if (data.is_liked) {
                         likedCourseElement.addClass('active');
                         likedCourseElement.attr('data-liked', '1');
+                        window.LIL_STORE.data.courseLiked = true;
                     } else {
                         likedCourseElement.removeClass('active');
                         likedCourseElement.attr('data-liked', '0');
+                        window.LIL_STORE.data.courseLiked = false;
                     }
                 }
             })

web/src/sass/_common.sass

@@ -4801,12 +4801,21 @@ a
     background-color: #151a1e
     margin-left: 0
 
+  & .loading-loader
+    display: none
+
   &_like
     background-image: url(../img/video-ended-popup-like.jpg)
 
   &_black
     background: url(../img/video-ended-popup-logo.png) no-repeat center #141a1d
 
+  &_loading
+    background: #141a1d
+
+  &_loading .loading-loader
+    display: block
+
   &__like-btn
     background: url(../img/heart.png) no-repeat center
     position: absolute