From d261acb6d6895cafad9d1f7090a4c3e301246497 Mon Sep 17 00:00:00 2001
From: gzbender <gzbender74@gmail.com>
Date: Fri, 31 May 2019 21:22:53 +0300
Subject: [PATCH] =?UTF-8?q?=D0=BF=D0=BE=D0=BF=D0=B0=D0=BF=20=D0=B2=20?=
 =?UTF-8?q?=D0=BA=D0=BE=D0=BD=D1=86=D0=B5=20=D0=B2=D0=B8=D0=B4=D0=B5=D0=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../templates/content/blocks/video.html       |   6 +++--
 apps/course/templates/course/course.html      |   1 +
 web/src/img/heart.png                         | Bin 0 -> 5456 bytes
 web/src/js/modules/content.js                 |   9 ++++---
 web/src/js/pages/course.js                    |   1 +
 web/src/sass/_common.sass                     |  23 ++++++++++++------
 web/webpack.config.js                         |   1 +
 7 files changed, 27 insertions(+), 14 deletions(-)
 create mode 100644 web/src/img/heart.png
 create mode 100644 web/src/js/pages/course.js

diff --git a/apps/content/templates/content/blocks/video.html b/apps/content/templates/content/blocks/video.html
index fc4bd60c..16b13a4b 100644
--- a/apps/content/templates/content/blocks/video.html
+++ b/apps/content/templates/content/blocks/video.html
@@ -5,10 +5,12 @@
     </div>
     <div class="content-block__video iframe__container">
       {% if content.is_youtube_video %}
-      <iframe class="js-content-video" data-is-youtube="1" src="https://www.youtube.com/embed/{{ content.video_index }}"
+      <iframe class="js-video" data-is-youtube="1" src="https://www.youtube.com/embed/{{ content.video_index }}"
+              data-course-id="{{ content.course_id|default:'' }}"
               frameborder="0" allow="autoplay; encrypted-media" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
       {% elif content.is_vimeo_video %}
-      <iframe class="js-content-video" data-is-vimeo="1" src="https://player.vimeo.com/video/{{ content.video_index }}"
+      <iframe class="js-video" data-is-vimeo="1" src="https://player.vimeo.com/video/{{ content.video_index }}"
+              data-course-id="{{ content.course_id|default:'' }}"
               frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen>
       </iframe>
       {% endif %}
diff --git a/apps/course/templates/course/course.html b/apps/course/templates/course/course.html
index fb9c351f..79bab74d 100644
--- a/apps/course/templates/course/course.html
+++ b/apps/course/templates/course/course.html
@@ -394,4 +394,5 @@
 
 {% block foot %}
 {% include "templates/blocks/popup_course_buy.html" %}
+<script type="text/javascript" src="{% static 'course.js' %}"></script>
 {% endblock foot %}
diff --git a/web/src/img/heart.png b/web/src/img/heart.png
new file mode 100644
index 0000000000000000000000000000000000000000..2cfccaed65247169860db5edc30959cceb553829
GIT binary patch
literal 5456
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
GLSTaP-Zu3B

literal 0
HcmV?d00001

diff --git a/web/src/js/modules/content.js b/web/src/js/modules/content.js
index 55997833..3724e6b5 100644
--- a/web/src/js/modules/content.js
+++ b/web/src/js/modules/content.js
@@ -1,6 +1,6 @@
 import $ from 'jquery';
 import {loadScript} from '../utils';
-import api from '../modules/api';
+import {api} from '../modules/api';
 
 function getVideoPopup($videoEl){
     const $container = $videoEl.parent();
@@ -9,12 +9,13 @@ function getVideoPopup($videoEl){
     if(! $popup[0]){
         $popup = $('<div class="video-ended-popup"><div class="video-ended-popup__like-btn"></div></div>');
         if(courseId){
-            $popup.addClass('video-ended-popup_like')
+            $popup.addClass('video-ended-popup_black');
+            /*
             $popup.find('.video-ended-popup__like-btn').click(() => {
                 api.likeCourse(courseId).then(() => {
                     $popup.addClass('video-ended-popup_black');
                 });
-            });
+            });*/
         }
 
         $container.append($popup);
@@ -42,7 +43,7 @@ $(document).ready(function () {
             player.on('play', function() {
                 const $p = getVideoPopup($iframe)
                 if($p.is(':visible')){
-                    $p.animate({opacity: 0}, 500).then(() => {$p.hide();});
+                    $p.animate({opacity: 0}, 800).then(() => {$p.hide();});
                 }
             });
         }
diff --git a/web/src/js/pages/course.js b/web/src/js/pages/course.js
new file mode 100644
index 00000000..525f893c
--- /dev/null
+++ b/web/src/js/pages/course.js
@@ -0,0 +1 @@
+import "../modules/content";
diff --git a/web/src/sass/_common.sass b/web/src/sass/_common.sass
index 7a91d142..05f69589 100755
--- a/web/src/sass/_common.sass
+++ b/web/src/sass/_common.sass
@@ -4358,11 +4358,13 @@ a
   &.pic
     position: relative
     width: 100%
+  &__video
+    position: relative
   &__video iframe
-    height: 360px;
-    width: 640px;
-    max-width: 100%;
-    max-height: 60%;
+    height: 360px
+    width: 640px
+    max-width: 100%
+    max-height: 60%
 
 @media only screen and (max-width: 639px)
   .content-block__video iframe
@@ -4775,7 +4777,7 @@ a
 .video-ended-popup
   display: none
   position: absolute
-  top: 100px
+  top: 90px
   height: 200px
   background: url(../img/video-ended-popup-ref.jpg) no-repeat center white
   left: 60px
@@ -4789,13 +4791,18 @@ a
     background-image: url(../img/video-ended-popup-like.jpg)
 
   &_black
-    background: url(../img/video-ended-popup-logo.png) no-repeat center black
+    background: url(../img/video-ended-popup-logo.png) no-repeat center #151a1e
 
   &__like-btn
+    background: url(../img/heart.png) no-repeat center
     position: absolute
-    top: 100px
-    margin: 0 auto
+    top: 90px
     display: none
+    width: 91px
+    height: 52px
+    cursor: pointer
+    left: 50%
+    margin-left: -45px
 
   &_like &__like-btn
     display: block
diff --git a/web/webpack.config.js b/web/webpack.config.js
index bde23572..498b4e3a 100644
--- a/web/webpack.config.js
+++ b/web/webpack.config.js
@@ -9,6 +9,7 @@ const SpriteLoaderPlugin = require('svg-sprite-loader/plugin');
 module.exports = {
   entry: {
     app: "./src/js/app.js",
+    course: "./src/js/pages/course.js",
     courseEdit: "./src/js/pages/course-edit.js",
     contest: "./src/js/pages/contest.js",
     contestEdit: "./src/js/pages/contest-edit.js",