You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
398 lines
14 KiB
398 lines
14 KiB
import $ from 'jquery';
|
|
import moment from 'moment';
|
|
import {api} from './api';
|
|
import "modal-video/js/jquery-modal-video.js";
|
|
import "modal-video/css/modal-video.min.css";
|
|
import {email as emailValid} from 'vuelidate/lib/validators';
|
|
import Cookies from 'js-cookie'
|
|
|
|
moment.locale('ru');
|
|
|
|
var selectedWeekdays = {};
|
|
$(document).ready(function () {
|
|
let body = $('body'),
|
|
popup = $('.popup.visible.open'),
|
|
prevPopup = null;
|
|
|
|
// CAPTURE EMAIL
|
|
const EMAIL_CAPTURED_COOKIE = 'email-captured';
|
|
|
|
if(window.LIL_STORE.user.id){
|
|
Cookies.remove(EMAIL_CAPTURED_COOKIE);
|
|
}
|
|
|
|
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();
|
|
}
|
|
$('.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;
|
|
});
|
|
});
|
|
});
|
|
});
|
|
};
|
|
|
|
$(".js-video-modal").each(function(){
|
|
const $this = $(this);
|
|
const url = $this.data('videoUrl');
|
|
if(! url){
|
|
return;
|
|
}
|
|
let data;
|
|
let videoId;
|
|
let channel;
|
|
if(url.indexOf('youtu.be') > -1){
|
|
videoId = url.split('youtu.be/')[1];
|
|
channel = 'youtube';
|
|
}
|
|
if(url.indexOf('youtube.com') > -1 && url.indexOf('watch') > -1){
|
|
const m = /[?&]v=([a-zA-Z]+)(&.)?/.exec(url);
|
|
channel = 'youtube';
|
|
videoId = m && m[1];
|
|
}
|
|
if(url.indexOf('vimeo.com') > -1){
|
|
const split = url.split('/');
|
|
channel = 'vimeo';
|
|
videoId = split[split.length - 1];
|
|
}
|
|
$this.attr('data-video-id', videoId);
|
|
$this.attr('data-video-url', '');
|
|
$this.attr('data-channel', channel);
|
|
$this.modalVideo({ channel, jsapi: true });
|
|
});
|
|
|
|
$(".js-video-modal").on('player-created', e => {
|
|
if(window.LIL_STORE.user.id || ! $(e.target).data('trialLesson') || Cookies.get(EMAIL_CAPTURED_COOKIE)){
|
|
return;
|
|
}
|
|
const channel = $(e.target).data('channel');
|
|
const player = e.detail.player;
|
|
let timeout = null;
|
|
const interval = 1000 * 60; // 1 min
|
|
const pauseVideo = () => {
|
|
timeout = setTimeout(() => {
|
|
clearTimeout(timeout);
|
|
const $modalVideo = $('.modal-video');
|
|
if(! $modalVideo.length){
|
|
return;
|
|
}
|
|
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){
|
|
pauseVideo();
|
|
}
|
|
if(event.data == YT.PlayerState.ENDED && timeout){
|
|
clearTimeout(timeout);
|
|
}
|
|
}
|
|
player.addEventListener('onStateChange', 'onYTPlayerStateChange');
|
|
}
|
|
else if (channel == 'vimeo'){
|
|
player.on('play', () => {
|
|
if(! timeout){
|
|
pauseVideo();
|
|
}
|
|
})
|
|
player.on('ended', () => {
|
|
if(timeout){
|
|
clearTimeout(timeout);
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
body.on('click', '[data-popup]', function(e){
|
|
const $this = $(this);
|
|
let data = $this.data('popup');
|
|
if(! data) {
|
|
return true;
|
|
}
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
|
|
popup = $(data);
|
|
|
|
if(data === '.js-popup-buy') {
|
|
popup.data('date-start', $this.data('date-start') || '');
|
|
popup.data('day', $this.data('day') || '');
|
|
$('[data-day]').prop('checked', false);
|
|
|
|
if(! window.LIL_STORE.user.id) {
|
|
const $btn = popup.find('.buy__btn');
|
|
$btn.click(function(event) {
|
|
event.preventDefault();
|
|
hidePopup().then(() => {
|
|
popup = $('.js-popup-auth');
|
|
popup.data('next-url', $btn.attr('href'));
|
|
showPopup();
|
|
});
|
|
});
|
|
}
|
|
|
|
if ($this.data('prolong')) {
|
|
$('[data-day][data-purchased]').each(function(){
|
|
$(this).prop('checked', true).prop('disabled', false);
|
|
});
|
|
}
|
|
else{
|
|
if($this.data('day')) {
|
|
let day = $this.data('day');
|
|
$('[data-day][data-purchased]').each(function(){
|
|
$(this).prop('checked', false).prop('disabled', true);
|
|
});
|
|
$('[data-day='+day+']').prop('checked', true);
|
|
}
|
|
else{
|
|
$('[data-day]').each(function(){
|
|
$(this).prop('checked', true).prop('disabled', false);
|
|
});
|
|
}
|
|
}
|
|
popup.on('change', '[data-day]', function(){
|
|
updateCart();
|
|
});
|
|
|
|
popup.on('change', '[data-bonuses]', function(){
|
|
updateCart();
|
|
});
|
|
|
|
updateCart();
|
|
}
|
|
|
|
if(data === '.js-popup-course-buy'){
|
|
//TODO: cloudpayments
|
|
const updateCourseCart = () => {
|
|
const $orderPrice = popup.find('.order_price_text');
|
|
const useBonuses = $bonusesCheckbox.prop('checked');
|
|
const amount = useBonuses ? coursePrice - bonusesCount : coursePrice;
|
|
|
|
$orderPrice.html(amount !== coursePrice ? `<del>${coursePrice}</del> ${amount}р.` : `${amount}р.`);
|
|
$buyBtn.attr('href', link + '?' + decodeURIComponent($.param({
|
|
use_bonuses: useBonuses || ''
|
|
})));
|
|
}
|
|
const $buyBtn = popup.find('.but_btn_popup');
|
|
const link = $buyBtn.data('link');
|
|
const coursePrice = +$buyBtn.data('price').replace(',', '.');
|
|
const $bonuses = popup.find('.buy__bonuses');
|
|
const $bonusesCount = popup.find('.buy__bonuses-count');
|
|
const $bonusesCheckbox = popup.find('[data-bonuses]');
|
|
const bonuses = +$bonusesCheckbox.data('bonuses');
|
|
const bonusesCount = bonuses > coursePrice ? coursePrice : bonuses;
|
|
const isCourseLock = $this.data('course-lock');
|
|
|
|
popup.find('.buy__subtitle').css('display', isCourseLock ? '' : 'none');
|
|
|
|
$bonuses.hide();
|
|
if(bonuses){
|
|
$bonusesCount.text(bonusesCount + ' Lil');
|
|
$bonuses.show();
|
|
}
|
|
|
|
popup.on('change', '[data-bonuses]', updateCourseCart);
|
|
updateCourseCart();
|
|
}
|
|
|
|
if( data === '.js-popup-auth') {
|
|
let nextUrl = $this.data('auth-next-url');
|
|
if(nextUrl === 'href') {
|
|
nextUrl = $this.attr('href');
|
|
}
|
|
popup.data('next-url', nextUrl);
|
|
}
|
|
|
|
if( data === '.js-popup-enter-gift-code') {
|
|
const $giftCode = popup.find('.enter-gift-code__code');
|
|
const $giftError = popup.find('.enter-gift-code__error');
|
|
$giftCode.val('');
|
|
$giftError.text('');
|
|
popup.find('.enter-gift-code__btn').one('click', () => {
|
|
const code = $giftCode.val();
|
|
if(! code){
|
|
$giftError.text('Укажите код');
|
|
return false;
|
|
}
|
|
window.location.href = `/gift-certificate/${code}/get`;
|
|
});
|
|
}
|
|
|
|
showPopup();
|
|
});
|
|
|
|
$('.js-popup-close').on('click', function(e){
|
|
if(popup.data('manual-close')){
|
|
return;
|
|
}
|
|
e.preventDefault();
|
|
hidePopup();
|
|
});
|
|
|
|
body.on('click', '.js-outer', function(){
|
|
if (popup !== undefined && ! popup.data('manual-close')) {
|
|
hidePopup();
|
|
}
|
|
});
|
|
|
|
$('.js-popup-wrap').on('click', function(e){
|
|
e.stopPropagation();
|
|
});
|
|
|
|
$(document).keyup(function(e){
|
|
if (e.keyCode === 27 && ! popup.data('manual-close')) {
|
|
hidePopup();
|
|
}
|
|
});
|
|
|
|
|
|
if(window.LIL_STORE.flags.isGiftCertificateUrl){
|
|
popup = $('.js-popup-gift-certificate');
|
|
showPopup();
|
|
}
|
|
|
|
function showPopup(){
|
|
if(! popup && popupName){
|
|
popup = $(popupName);
|
|
}
|
|
body.addClass('no-scroll');
|
|
popup.addClass('open');
|
|
return new Promise((resolve) => {
|
|
setTimeout(function(){
|
|
popup.addClass('visible');
|
|
resolve();
|
|
$(document).trigger('popup-opened', popup);
|
|
}, 100);
|
|
});
|
|
}
|
|
|
|
function hidePopup(){
|
|
body.removeClass('no-scroll');
|
|
popup.removeClass('visible');
|
|
popup.data('next-url', null);
|
|
|
|
if($('#password-reset__sent').is(':visible')) {
|
|
window.location.reload();
|
|
}
|
|
return new Promise((resolve) => {
|
|
setTimeout(function(){
|
|
popup.removeClass('open');
|
|
resolve();
|
|
$(document).trigger('popup-closed', popup);
|
|
}, 300);
|
|
});
|
|
}
|
|
|
|
function updateCart(){
|
|
var link = popup.find('.but_btn_popup').data('link');
|
|
var $order = popup.find('.order');
|
|
var $orderPrice = popup.find('.order_price_text');
|
|
var $orderDates = popup.find('.order__dates');
|
|
var dateStart = popup.data('date-start');
|
|
var days = ['', 'Понедельник', 'Вторник', 'Среда', 'Четверг', 'Пятница', 'Суббота', 'Воскресенье'];
|
|
var weekdays = [];
|
|
var daysText = [];
|
|
var $bonuses = popup.find('.buy__bonuses');
|
|
var $bonusesCheckbox = popup.find('[data-bonuses]');
|
|
var $bonusesCount = popup.find('.buy__bonuses-count');
|
|
var useBonuses = $bonusesCheckbox.prop('checked');
|
|
var bonuses = +$bonusesCheckbox.data('bonuses');
|
|
$('[data-day]').each(function() {
|
|
var weekday = $(this).data('day');
|
|
if($(this).is(':checked')) {
|
|
weekdays.push(weekday);
|
|
daysText.push(days[weekday]);
|
|
}
|
|
});
|
|
|
|
if(weekdays.length){
|
|
$order.addClass('order--loading');
|
|
$orderPrice.html('');
|
|
api.getPaymentAmount({ user: window.LIL_STORE.user.id, weekdays: weekdays, date_start: dateStart})
|
|
.then(response => {
|
|
$order.removeClass('order--loading');
|
|
var text = '';
|
|
var amount = +response.data.amount;
|
|
if(bonuses){
|
|
$bonusesCount.text(bonuses > amount ? amount : bonuses + ' Lil');
|
|
$bonuses.show();
|
|
if(useBonuses) {
|
|
amount = bonuses > amount ? 0 : amount - bonuses;
|
|
}
|
|
}
|
|
if(response.data.price != amount) {
|
|
text = '<del>' + response.data.price+'</del> ' + amount + 'р.';
|
|
} else {
|
|
text = amount + 'p.';
|
|
}
|
|
$orderPrice.html(text);
|
|
$orderDates.text(moment(response.data.date_start).format('D MMM') + ' - ' + moment(response.data.date_end).format('D MMM'));
|
|
$('.but_btn_popup').attr('href', link+'?'+decodeURIComponent($.param({
|
|
weekdays: weekdays,
|
|
date_start: moment(response.data.date_start).format('YYYY-MM-DD'),
|
|
use_bonuses: useBonuses || '',
|
|
}, true)));
|
|
}).catch(() => {
|
|
$order.removeClass('order--loading');
|
|
});
|
|
}
|
|
else {
|
|
$orderPrice.html('0p.');
|
|
$bonuses.hide();
|
|
}
|
|
|
|
}
|
|
});
|
|
|