diff --git a/api/v1/serializers/config.py b/api/v1/serializers/config.py
index d2f199bd..1dbf8de9 100644
--- a/api/v1/serializers/config.py
+++ b/api/v1/serializers/config.py
@@ -25,6 +25,7 @@ class ConfigSerializer(serializers.ModelSerializer):
REFERRER_BONUS = serializers.IntegerField()
REFERRAL_BONUS = serializers.IntegerField()
MAIN_PAGE_VIDEO_URL = serializers.CharField(required=False)
+ MAIN_PAGE_VIDEO_PREVIEW_IMG = serializers.SerializerMethodField()
class Meta:
model = Config
@@ -47,6 +48,7 @@ class ConfigSerializer(serializers.ModelSerializer):
'REFERRER_BONUS',
'REFERRAL_BONUS',
'MAIN_PAGE_VIDEO_URL',
+ 'MAIN_PAGE_VIDEO_PREVIEW_IMG',
)
def get_SCHOOL_LOGO_IMAGE(self, config):
@@ -68,3 +70,13 @@ class ConfigSerializer(serializers.ModelSerializer):
return MAIN_PAGE_TOP_IMAGE_url
else:
return None
+
+ def get_MAIN_PAGE_VIDEO_PREVIEW_IMG(self, config):
+ request = self.context.get('request')
+ http_host = request.META.get('HTTP_ORIGIN')
+ if http_host and config.MAIN_PAGE_VIDEO_PREVIEW_IMG:
+ domain = urlparse(http_host).netloc.split(':')[0]
+ MAIN_PAGE_VIDEO_PREVIEW_IMG_url = 'http://' + domain + config.MAIN_PAGE_VIDEO_PREVIEW_IMG.url
+ return MAIN_PAGE_VIDEO_PREVIEW_IMG_url
+ else:
+ return None
diff --git a/apps/config/migrations/0013_config_main_page_video_preview_img.py b/apps/config/migrations/0013_config_main_page_video_preview_img.py
new file mode 100644
index 00000000..be039788
--- /dev/null
+++ b/apps/config/migrations/0013_config_main_page_video_preview_img.py
@@ -0,0 +1,18 @@
+# Generated by Django 2.0.7 on 2018-12-13 15:11
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+ dependencies = [
+ ('config', '0012_auto_20181210_1729'),
+ ]
+
+ operations = [
+ migrations.AddField(
+ model_name='config',
+ name='MAIN_PAGE_VIDEO_PREVIEW_IMG',
+ field=models.ImageField(blank=True, null=True, upload_to=''),
+ ),
+ ]
diff --git a/apps/config/models.py b/apps/config/models.py
index d6fed883..18756e20 100644
--- a/apps/config/models.py
+++ b/apps/config/models.py
@@ -22,6 +22,7 @@ class Config(models.Model):
REFERRER_BONUS = models.IntegerField(default=10)
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)
def save(self, *args, **kwargs):
self.pk = 1
@@ -43,6 +44,8 @@ class Config(models.Model):
'SERVICE_INSTAGRAM_URL': '',
'SERVICE_TWITTER_URL': '',
'SERVICE_FB_URL': '',
+ 'SERVICE_VK_URL': '',
+ 'SERVICE_OK_URL': '',
'SERVICE_YOUTUBE_URL': '',
'SERVICE_TELEGRAM_CHANNEL': '',
'SERVICE_COMMISSION': '',
@@ -52,5 +55,7 @@ class Config(models.Model):
'MAIN_PAGE_TOP_IMAGE': '',
'REFERRER_BONUS': '',
'REFERRAL_BONUS': '',
+ 'MAIN_PAGE_VIDEO_URL': '',
+ 'MAIN_PAGE_VIDEO_PREVIEW_IMG': '',
}
return obj
diff --git a/project/templates/blocks/popup_capture_email.html b/project/templates/blocks/popup_capture_email.html
index 5eee0add..6e90b5b5 100644
--- a/project/templates/blocks/popup_capture_email.html
+++ b/project/templates/blocks/popup_capture_email.html
@@ -19,6 +19,7 @@
diff --git a/project/templates/blocks/video.html b/project/templates/blocks/video.html
index 33b3a4f1..0537a6b0 100644
--- a/project/templates/blocks/video.html
+++ b/project/templates/blocks/video.html
@@ -1,13 +1,10 @@
diff --git a/web/src/js/modules/popup.js b/web/src/js/modules/popup.js
index 22505dc8..dba6e466 100644
--- a/web/src/js/modules/popup.js
+++ b/web/src/js/modules/popup.js
@@ -21,43 +21,48 @@ $(document).ready(function () {
Cookies.remove(EMAIL_CAPTURED_COOKIE);
}
- $('.js-popup-capture-email .js-popup-close').on('click', function(e){
- e.preventDefault();
- hidePopup().then(() => {
- popup = prevPopup;
- });
- $('.modal-video').remove();
- });
-
- const captureEmail = (callback) => {
- prevPopup = popup;
- popup = $('.js-popup-capture-email');
- const $modalVideo = $('.modal-video');
- const $email = popup.find('.capture-email__email');
- const $error = popup.find('.capture-email__error');
- $modalVideo.css('opacity', 0);
- $email.val('');
- $error.text('');
- popup.css('z-index', 1000001);
- showPopup();
- popup.find('.capture-email__btn').unbind('click').click(e => {
- e.preventDefault();
- const email = $email.val();
- if(! email){
- $error.text('Пожалуйста, укажите почту');
- return;
- }
- if(! emailValid(email)){
- $error.text('Пожалуйста, укажите коректную почту');
- return;
+ const captureEmail = show => {
+ return new Promise((resolve, reject) => {
+ prevPopup = popup;
+ popup = $('.js-popup-capture-email');
+ const $email = popup.find('.capture-email__email');
+ const $error = popup.find('.capture-email__error');
+ $email.val('');
+ $error.text('');
+ popup.css('z-index', 1000001);
+ if(show){
+ showPopup();
}
- api.captureEmail(email);
- hidePopup().then(() => {
- popup = prevPopup;
+ $('.js-popup-capture-email .js-popup-close').unbind('click').on('click', e => {
+ e.preventDefault();
+ hidePopup().then(() => {
+ popup = prevPopup;
+ reject();
+ });
+ });
+ popup.find('.capture-email__btn').unbind('click').click(e => {
+ e.preventDefault();
+ const email = $email.val();
+ if(! email){
+ $error.text('Пожалуйста, укажите почту');
+ return;
+ }
+ if(! emailValid(email)){
+ $error.text('Пожалуйста, укажите коректную почту');
+ return;
+ }
+ const $loader = popup.find('.loading-loader');
+ const $btn = popup.find('.capture-email__btn');
+ $loader.show();
+ $btn.prop('disabled', true);
+ api.captureEmail(email).then(resolve).catch(reject).finally(() => {
+ $btn.prop('disabled', false);
+ $loader.hide();
+ hidePopup().then(() => {
+ popup = prevPopup;
+ });
+ });
});
- $modalVideo.css('opacity', 1);
- Cookies.set(EMAIL_CAPTURED_COOKIE, 1);
- callback();
});
};
@@ -94,27 +99,42 @@ $(document).ready(function () {
if(window.LIL_STORE.user.id || ! $(e.target).data('trialLesson') || Cookies.get(EMAIL_CAPTURED_COOKIE)){
return;
}
- let stopVideo = () => {};
- let playVideo = () => {};
const channel = $(e.target).data('channel');
- const $iframe = $('.modal-video-movie-wrap iframe');
const player = e.detail.player;
let timeout = null;
const interval = 1000 * 10;// 60 * 2; // 2 min
- if(channel == 'youtube'){
- const pauseVideo = () => {
+ const pauseVideo = () => {
+ timeout = setTimeout(() => {
clearTimeout(timeout);
- if(! $('.modal-video').length){
+ const $modalVideo = $('.modal-video');
+ if(! $modalVideo.length){
return;
}
- player.pauseVideo();
- captureEmail(() => {
- player.playVideo();
+ if(channel == 'youtube'){
+ player.pauseVideo();
+ }
+ else if(channel == 'vimeo'){
+ player.pause();
+ }
+ $modalVideo.css('opacity', 0);
+ captureEmail(true).then(() => {
+ $modalVideo.css('opacity', 1);
+ Cookies.set(EMAIL_CAPTURED_COOKIE, 1);
+ if(channel == 'youtube'){
+ player.playVideo();
+ }
+ else if(channel == 'vimeo'){
+ player.play();
+ }
+ }).catch(() => {
+ $('.modal-video').remove();
});
- }
+ }, interval);
+ }
+ if(channel == 'youtube'){
window.onYTPlayerStateChange = (event) => {
if(event.data == YT.PlayerState.PLAYING && ! timeout){
- timeout = setTimeout(pauseVideo, interval);
+ pauseVideo();
}
if(event.data == YT.PlayerState.ENDED && timeout){
clearTimeout(timeout);
@@ -123,19 +143,9 @@ $(document).ready(function () {
player.addEventListener('onStateChange', 'onYTPlayerStateChange');
}
else if (channel == 'vimeo'){
- const pauseVideo = () => {
- clearTimeout(timeout);
- if(! $('.modal-video').length){
- return;
- }
- player.pause();
- captureEmail(() => {
- player.play();
- });
- }
player.on('play', () => {
if(! timeout){
- timeout = setTimeout(pauseVideo, interval);
+ pauseVideo();
}
})
player.on('ended', () => {
@@ -156,7 +166,6 @@ $(document).ready(function () {
e.stopPropagation();
popup = $(data);
- showPopup();
if(data === '.js-popup-buy') {
popup.data('date-start', $this.data('date-start') || '');
@@ -260,6 +269,8 @@ $(document).ready(function () {
window.location.href = `/gift-certificate/${code}/get`;
});
}
+
+ showPopup();
});
$('.js-popup-close').on('click', function(e){
diff --git a/web/src/sass/_common.sass b/web/src/sass/_common.sass
index ca0759a1..ac68c313 100755
--- a/web/src/sass/_common.sass
+++ b/web/src/sass/_common.sass
@@ -2413,11 +2413,12 @@ a.grey-link
&.visible &__wrap
transform: scale(1)
-.main-video
- margin-top: -140px
+.main-video-preview
z-index: 10
position: relative
box-shadow: 0 10px 100px rgba(0,0,0,0.20)
+ width: 640px
+ height: 360px
.head
display: flex