if (typeof window.enSubExist === "undefined") {
    window.enSubExist = true
}
if (typeof window.ruSubExist === "undefined") {
    window.ruSubExist = true
}
var trialTicker=0;
var trialCounter=0;

var video = {
    init: function() {
      // debugger;
        if (!window.vjs) window.vjs = videojs;
        $(function() {
            if ($("#video").length) {
                vjs("video").ready(video.onReady)
            }
        });
        this.setupElements();
        this.setupControls()
    },
    onReady: function() {
        video_api = this;
        if (window.provider == "megogo") {
            video.setupMegogoPlayer()
        }
        video.setupVolumeControl();
        video.setupKeyboardShortcuts();
        video.buildHotkeysPopup();
        video.setupHints();
        player.settings_controls.init();
        $("#video .vjs-control").removeAttr("tabindex");
        video_api.on("fullscreenchange", function() {
            $("body").toggleClass("video-fullscreen", this.isFullscreen());
            if (localStorage.getItem("subsFontSizeNum")) {
                video.find("#vid-subs").css("font-size", localStorage.getItem("subsFontSizeNum") + "px");
                video.find("#vid-subslist-subs-container .sub").css("font-size", localStorage.getItem("subsFontSizeNum") + "px");
                video.find("#vid-subslist .sub .sub-container").css("font-size", localStorage.getItem("subsFontSizeNum") + "px")
            }
        });
        video_api.on("play", function() {
            this.removeClass("pause_manual")
        });
        video_api.on("timeupdate", function(event) {
            if(window.isTrialMode){
                trialTicker++;
                if(trialTicker%100===0){
                    //
                    // var modal = document.getElementById('id01');
                    // document.getElementById('id01').style.display='block';
// When the user clicks anywhere outside of the modal, close it
//                     window.onclick = function(event) {
//                         if (event.target == modal) {
//                             modal.style.display = "none";
//                         }
//                     }
                    trialCounter++;
                    // $.get("engine/ajax/adminfunction.php?action=clearcache&user_hash={$dle_login_hash}", function( data ){
                    $.post("/engine/ajax/trialuser.php",
                        {"news_trial_id":window.news_trial_id}, function( data ){
                            //время вышло смотреть
                            if(data.module.isExpired){
                                showModalFinish(data);
                            }else if(data.module.see_new){
                                showModalSeeAnother(data);
                            }
                        });
                    console.log('trialCounter',trialCounter,window.news_trial_id);
                }
            }

        });
        disableSelection("#video .vjs-control:not(.vjs-settings-control)")
    },
    setupMegogoPlayer: function() {},
    setupElements: function() {
        var elementsToRemove = "textTrackDisplay errorDisplay textTrackSettings".split(" ");
        this.deregisterElement(elementsToRemove);
        var elements = [{
            name: "gradientOverlay",
            options: {
                className: "gradient-overlay"
            }
        }, {
            name: "subs",
            options: {
                id: "vid-subs",
                className: "balloon-row vid-subs none"
            }
        }, {
            name: "pauseMode",
            options: {
                id: "vid-pause-mode",
                className: "vid-pause-mode",
                innerHTML: "<div class=top-shadow></div>" + "<div class=bottom-shadow></div>" + "<div id=vid-subslist>" + "<div class=scroll-content>" + "<div id=vid-subslist-subs-container class=subs-container></div>" + "</div>" + "</div>"
            }
        }, {
            name: "quiz",
            options: {
                id: "vid-quiz",
                className: "vid-quiz container-style-1"
            }
        }];
        this.registerElement(elements);
        vjs.PosterImage.prototype.onClick = function() {}
    },
    setupControls: function() {
        var buttonsToRemove = "muteToggle volumeControl subtitlesButton captionsButton chaptersButton remainingTimeDisplay timeDivider".split(" ");
        this.deregisterButton(buttonsToRemove);
        var enSubControl = {
            name: "toggleEnSubControl",
            options: {
                className: "toggleEnSub-control vjs-control" + (storage.get("vid-enSub-enabled") === null || storage.get("vid-enSub-enabled") ? " active" : ""),
                innerHTML: "<div><span></span></div>"
            },
            onClick: this.toggleEnSubs
        };
        var ruSubControl = {
            name: "toggleRuSubControl",
            options: {
                className: "toggleRuSub-control vjs-control" + (storage.get("vid-ruSub-enabled") === null || storage.get("vid-ruSub-enabled") ? " active" : ""),
                innerHTML: "<div><span></span></div>"
            },
            onClick: this.toggleRuSubs
        };
        var volumeControl = {
            name: "volumeControl",
            options: {
                className: "volume-control vjs-control",
                innerHTML: "<div></div>" + "<div class=volume-control>" + "<div class=volume-bar>" + "<div class=volume-level></div>" + "</div>" + "</div>"
            }
        };
        var increaseSubs = {
            name: "increaseSubs",
            options: {
                className: "vjs-increase-subs vjs-control",
                innerHTML: "<div>" + "<span></span>" + "</div>"
            },
            onClick: video.increaseSubs
        };
        var decreaseSubs = {
            name: "decreaseSubs",
            options: {
                className: "vjs-decrease-subs vjs-control",
                innerHTML: "<div>" + "<span></span>" + "</div>"
            },
            onClick: video.decreaseSubs
        };
        var buttons = [];
        if (window.enSubExist) buttons.push(enSubControl);
        if (window.ruSubExist) buttons.push(ruSubControl);
        buttons.push(volumeControl);
        if (window.enSubExist || window.ruSubExist) {
            buttons.push(increaseSubs, decreaseSubs)
        }
        var pauseByHover = "<li class=paused_by_hover><input type=checkbox name=paused_by_hover class=ui-checkbox id=vid-settings-paused_by_hover><label for=vid-settings-paused_by_hover>Пауза при наведении</label></li>";
        var prevPeace = "<li class=prev_piece><input type=checkbox name=prev_piece class=ui-checkbox id=vid-settings-prev_piece><label for=vid-settings-prev_piece>Предыдущая фраза</label></li>";
        var pauseBetween = "<li class=autopause><input type=checkbox name=autopause class=ui-checkbox id=vid-settings-autopause><label for=vid-settings-autopause>Пауза между фразами</label></li>";
        var scenario = "<li class=scenario><input type=checkbox name=scenario class=ui-checkbox id=vid-settings-scenario><label for=vid-settings-scenario>Сценарий при паузе</label></li>";
        var slowMo = '<li class=options__slow-set-range><div class="j-slow-ratio__speed-range slow-ratio__speed-range"> <div class="popover--settings-video__slow-set-range"> <div class="popover--settings-video__slow-set-range__title">Скорость воспроизведения</div> <input class="slowRatioRange playMovieSlowly_js" type="range" min="1" max="5" value="4"/> <div class="popover--settings-video__slow-set-range-values slow-range__values_js popover--settings-dots"> <span style="left: 4px;"><i>0.3</i></span> <span style="left: 25%;"><i>0.5</i></span> <span style="left: 50%;"><i>0.75</i></span> <span style="left: 75%;"><i>обычная </i></span> <span style="left: 98%;"><i>2</i></span> </div></div> </div></li>';
        var fastTranslate = "<li class=translator><input type=checkbox name=translator class=ui-checkbox>Быстрый перевод</label></li>";
        var autoTransition = "";
        var quizes = "<li class=quizes><input type=checkbox name=quizes class=ui-checkbox id=vid-settings-quizes><label for=vid-settings-quizes>Тесты</label></li>";
        var autoContinue = "<li class=autocontinue><input type=checkbox name=autocontinue class=ui-checkbox id=vid-settings-autocontinue><label for=vid-settings-autocontinue>Автопереход</label></li>";
        var opacity = '<li class="options__slow-set-range options__sub-bg-opacity"><div class="popover--settings-video__slow-set-range__title">Прозрачность фона под субтитрами</div><div class="j-slow-ratio__speed-range slow-ratio__speed-range"> <div class="popover--settings-video__slow-set-range"> <input class="slowRatioRange subBgOpacity_js" type="range" min="1" max="4" value="2"/> <div class="popover--settings-video__slow-set-range-values sub-bg-opacity__values_js"> <span style="left: -3%;">РќРµС‚</span> <span style="left: 36%;">50%</span> <span style="left: 67%;">75%</span> <span style="left: 96%;">100%</span> </div> </div> </div></li>';
        var hotKeys = '<a href="#" onclick="player.hotkeysPopup.toggle(); return false" class=hotkeys-toggle>Показать горячие клавиши</a>';
        var settingsOptions = "";
        if (window.media_type === "serial") settingsOptions = pauseByHover + pauseBetween + prevPeace + quizes + scenario + autoContinue + slowMo + autoTransition + opacity;
        else if (window.media_type === "serials-light") settingsOptions = pauseByHover + prevPeace + scenario + autoContinue + slowMo + opacity;
        else if (window.media_type === "films") settingsOptions = pauseByHover + prevPeace + scenario + slowMo + opacity;
        else settingsOptions = pauseByHover + pauseBetween + prevPeace + slowMo;
        var settingsControlInner = '<div class="vjs-settings-control__open"><span></span></div><form id=vid-settings-controls class=controls><h3 class=title.asdf>Настройки</h3><ul class=options>' + settingsOptions + "</ul>" + hotKeys + "</form>";
        var settingsControl = {
            name: "settingsControl",
            options: {
                className: "vjs-settings-control vjs-control",
                innerHTML: settingsControlInner
            },
            onClick: function(e) {
                if ($("html").hasClass("mobile") || $(e.target).parents("#vid-settings-controls").length || e.target.id == "vid-settings-controls") return;
                player.settings_controls.toggle()
            }
        };
        buttons.push(settingsControl);
        this.registerButton(buttons);
        vjs.Player.prototype.onPlay = function() {
            this.removeClass("vjs-ended");
            this.removeClass("vjs-paused");
            this.addClass("vjs-playing");
            this.hasStarted(true);
            $(this.el).removeClass("play_manual pause_manual vjs-paused blur")
        };
        vjs.Player.prototype.onPause = function() {
            this.addClass("vjs-paused");
            $(this.el).removeClass("play_manual vjs-playing blur");
            if (video.blur_effect_enabled !== false) {
                this.addClass("blur")
            }
        };
        var onplayclick = function(e) {
            if (video_api.paused()) {
                video_api.play();
                video_api.trigger("play_manual");
                video_api.removeClass("play_manual");
                setTimeout('$("#video").removeClass("pause_manual")', 0)
            } else {
                video_api.pause();
                video_api.trigger("pause_manual");
                setTimeout(function() {
                    $("#video").addClass("pause_manual")
                }, 0)
            }
        };
        vjs.PlayToggle.prototype.onClick = onplayclick;
        var components = vjs.ControlBar.prototype.options_.children;
        delete components.currentTimeDisplay;
        delete components.durationDisplay;
        components.durationDisplay = {}
    },
    setupVolumeControl: function() {
        var $video = $("#video");
        var $volumeLevel = $video.find(".volume-level");
        var $volumeBtn = $video.find(".vjs-control-bar > .volume-control");
        $volumeLevel.css("height", video_api.volume() * 100 + "%");
        $volumeBtn.mouseover(function() {
            setTimeout(function() {
                $volumeBtn[0].style.zIndex = $volumeBtn[0].style.zIndex > 100 ? 100 : 101
            }, 0)
        });
        $(document).on("mousedown.vid-volume touchstart.vid-volume", function(e) {
            var $target = $(e.target);
            if (!$target.is(".volume-bar") && !$target.parent().is(".volume-bar")) return;
            $volumeBtn.addClass("active");
            if (!$target.is(".volume-bar")) $target = $target.parent();
            var barHeight = $target.height();
            var position = e.pageY - $target.offset().top - 1;
            var percentage = 100 - position / barHeight * 100;
            video.setVolume(percentage / 100);
            $(document).on("mousemove.vid-volume touchmove.vid-volume", function(e) {
                var position = e.pageY - $target.offset().top - 1;
                if (position < 0) position = 0;
                else if (position > barHeight) position = barHeight;
                var percentage = 100 - position / barHeight * 100;
                video.setVolume(percentage / 100)
            })
        });
        $(document).on("mouseup.vid-volume touchend.vid-volume", function(e) {
            $(document).off("mousemove.vid-volume touchmove.vid-volume");
            $video.find(".vjs-control-bar > .volume-control").removeClass("active")
        });
        if (storage.get("player.volume") !== null) {
            video.setVolume(storage.get("player.volume"))
        }
    },
    setVolume: function(volume) {
        if (volume < 0) volume = 0;
        if (volume > 1) volume = 1;
        var $volume_control = $("#video .volume-control.vjs-control");
        var $bar = $(".volume-bar", $volume_control);
        var $level = $(".volume-level", $volume_control);
        var barH = $bar.height();
        var h = barH / 100 * (volume * 100);
        $level.css({
            height: h,
            marginTop: barH - h
        });
        storage.set("player.volume", volume);
        video_api.muted(false);
        $("#video").removeClass("muted");
        video_api.volume(volume);
        audio.volume && audio.volume(volume);
        if (player.background_video) player.background_video.volume = volume;
        var btn = $volume_control.children("div:first")[0];
        if (btn.hint_text) {
            btn.hint_text = btn.hint_original_text.replace("%percent%", Math.round(volume * 100));
            var $hint = $("#hint");
            if ($hint.length && btn.hint_original_text == $hint[0].hint_original_text) {
                $(".hint-content", $hint).html(btn.hint_text)
            }
        }
    },
    hints: [{
        selector: ".vjs-increase-subs",
        text: ["Увеличить шрифт субтитров"]
    }, {
        selector: ".vjs-decrease-subs",
        text: ["Уменьшить шрифт субтитров"]
    }, {
        selector: ".toggleEnSub-control",
        text: ["Показать английские субтитры [E]", "Скрыть английские субтитры [E]"]
    }, {
        selector: ".toggleRuSub-control",
        text: ["Показать русский перевод [R]", "Скрыть русский перевод [R]"]
    }, {
        selector: ".volume-control.vjs-control > div:first",
        text: "Громкость звука (%percent%%)"
    }, {
        selector: ".vjs-play-control",
        text: ["Поставить видео на паузу [пробел]", "Продолжить просмотр видео [пробел]"]
    }, {
        selector: ".vjs-fullscreen-control",
        text: ["Перейти в полноэкранный режим видео [F]", "Выйти из полноэкранного режима видео [ESC]"]
    }, {
        selector: ".vjs-settings-control > div",
        text: ["Показать настройки", "Скрыть настройки"]
    }, {
        selector: ".dictionary-toggle",
        text: ["Развернуть словарь", "Свернуть словарь"]
    }, {
        selector: ".button-play-audio",
        text: "Прослушать эту фразу"
    }, {
        selector: ".button-play-video",
        text: "Перейти к просмотру видео с этой фразы"
    }, {
        selector: "#vid-settings-controls .prev_piece",
        position: "left",
        offset: {
            left: "-=3"
        },
        title: "Подсказка",
        text: "Показывать предыдущую фразу сверху текущей фразы (полезно, если вы иногда не успеваете прочитать строку субтитра до того, как она сменяется следующей).<br>" + "<strong>Горячая клавиша:</strong> P"
    }, {
        selector: "#vid-settings-controls .paused_by_hover",
        position: "left",
        offset: {
            left: "-=3"
        },
        title: "Пауза при наведении",
        text: "При наведении мышью на субтитры, делается автоматическая пауза"
    }, {
        selector: "#vid-settings-controls .autopause",
        position: "left",
        offset: {
            left: "-=3"
        },
        title: "Подсказка",
        text: "Режим для начинающих. Видео автоматически встаёт на паузу после каждой фразы. Во время паузы вы слышите повторное звучание фразы и затем видео автоматически продолжается.<br>" + "<strong>Горячая клавиша:</strong> A"
    }, {
        selector: "#vid-settings-controls .quizes",
        position: "left",
        offset: {
            left: "-=3"
        },
        title: "Подсказка",
        text: "Прерывать видео вопросами грамматических тестов, связанных с содержимым видео. Время появления тестов подобрано так, чтобы не отвлекать вас от восприятия сюжета фильма."
    }, {
        selector: "#vid-settings-controls .hotkeys-toggle",
        position: "left",
        offset: {
            left: "-=16"
        },
        title: "Подсказка",
        text: "Вывести на экран окно со списком горячих клавиш (быстрые действия с клавиатуры).<br>" + "<strong>Горячая клавиша:</strong> H"
    }, {
        selector: "#vid-settings-controls .autocontinue",
        position: "left",
        offset: {
            left: "-=16"
        },
        title: "Подсказка",
        text: "Автоматический переход к просмотру следующего эпизода после окончания текущего."
    }, {
        selector: "#vid-settings-controls .scenario",
        position: "left",
        offset: {
            left: "-=16"
        },
        title: "Подсказка",
        text: "Показывать сценарий при паузе."
    }],
    setupHints: function() {
        if (browser.is_touchscreen) return;
        setTimeout(function() {
            for (var i = 0; i < video.hints.length; i++) {
                var options = video.hints[i];
                options.containment = "#video";
                options.hint_class = "hint-video"; /* $(video.hints[i].selector,"#video").hint(options) */
            }
            video.setVolume(video_api.volume())
        }, 100)
    },
    setupKeyboardShortcuts: function() {
        var player_focused = false;
        $(document).click(function(e) {
            player_focused = $(e.target).parents("#video").length
        });
        $(document).on("keydown", function(e) {
            if ((e.ctrlKey || e.metaKey || e.shiftKey) && e.which != 37 && e.which != 39 || e.altKey || $(e.target).is("input, textarea, [contenteditable]")) return;
            switch (e.which) {
                case 13:
                    e.preventDefault();
                    video.blur_effect_enabled = false;
                    if (media_type == "series") {
                        if (video_api.paused()) $(".b-episode_media_container .vjs-play-control").click();
                        else video_api.pause()
                    } else {
                        if (video_api.paused()) $(".vjs-play-control").click();
                        else video_api.pause()
                    }
                    setTimeout("video.blur_effect_enabled = true", 0);
                    break;
                case 32:
                    e.preventDefault();
                    $(".vjs-play-control").click();
                    break;
                case 27:
                    e.preventDefault();
                    $(".vjs-play-control").click();
                    break;
                case 72:
                    e.preventDefault();
                    player.hotkeysPopup.toggle();
                    break;
                case 69:
                    e.preventDefault();
                    video.toggleEnSubs();
                    break;
                case 82:
                    e.preventDefault();
                    video.toggleRuSubs();
                    break;
                case 80:
                    e.preventDefault();
                    $("#vid-settings-controls ul.options #vid-settings-prev_piece").click();
                    break;
                case 65:
                    e.preventDefault();
                    $("#vid-settings-controls ul.options #vid-settings-autopause").click();
                    break;
                case 70:
                    e.preventDefault();
                    $("#video .vjs-fullscreen-control").click();
                    break;
                case 77:
                    e.preventDefault();
                    video_api.muted(!video_api.muted());
                    if (video_api.muted()) {
                        video.addClass("muted");
                        var $volume_control = $("#video .vjs-volume-control");
                        var btn = $volume_control.children("div:first")[0];
                        if (btn.hint_text) {
                            btn.hint_text = btn.hint_original_text.replace("%percent%", "0");
                            var $hint = $("#hint");
                            if ($hint.length && btn.hint_original_text == $hint[0].hint_original_text) {
                                $(".hint-content", $hint).html(btn.hint_text)
                            }
                        }
                    } else {
                        video.removeClass("muted");
                        video.setVolume(video_api.volume())
                    }
                    break;
                case 37:
                    e.preventDefault();
                    if (e.ctrlKey || e.metaKey || e.shiftKey) video_api.currentTime(video_api.currentTime() - 3);
                    else {
                        var i = player.subs.current_index;
                        var cur_piece = SUBTITLES[i];
                        if (video_api.currentTime() < cur_piece.start - 0 + 1) {
                            video_api.currentTime(i == 0 ? 0 : SUBTITLES[i - 1].start)
                        } else {
                            video_api.currentTime(SUBTITLES[i].start)
                        }
                    }
                    break;
                case 39:
                    e.preventDefault();
                    if (e.ctrlKey || e.metaKey || e.shiftKey) {
                        video_api.currentTime(video_api.currentTime() + 3)
                    } else {
                        var next_index = player.subs.current_index + 1;
                        if (typeof SUBTITLES[next_index] !== "undefined") {
                            if (video_api.currentTime() < SUBTITLES[0].start) next_index = 0;
                            video_api.currentTime(SUBTITLES[next_index].start)
                        }
                    }
                    break;
                case 38:
                    e.preventDefault();
                    video.setVolume(video_api.volume() + .15);
                    break;
                case 40:
                    e.preventDefault();
                    video.setVolume(video_api.volume() - .15);
                    break;
                case 187:
                    video.increaseSubs();
                    break;
                case 189:
                    video.decreaseSubs();
                    break
            }
        })
    },
    buildHotkeysPopup: function() {
        if (window.media_type === "serial") {
            var html = '<div id=vid-hotkeys-popup class="hotkeys-popup container-style-1">' + "<h3>Горячие клавиши</h3>" + "<div class=left-col>" + '<div class="item key-e">' + "<div class=key>E</div>" + "<p>Скрыть/показать английские субтитры (Eng)</p>" + "</div>" + '<div class="item key-s">' + "<div class=key>S</div>" + "<p>Скрыть/показать субтитры</p>" + "</div>" + '<div class="item key-r">' + "<div class=key>R</div>" + "<p>Скрыть/показать русский перевод (Rus)</p>" + "</div>" + '<div class="item key-p">' + "<div class=key>P</div>" + "<p>Скрыть/показать предыдущую фразу (Phrase)</p>" + "</div>" + '<div class="item key-a">' + "<div class=key>A</div>" + "<p>Переключить режим Авто-паузы (Autopause)</p>" + "</div>" + '<div class="item key-f">' + "<div class=key>F</div>" + "<p>Переключить полноэкранный режим (Fullscreen)</p>" + "</div>" + '<div class="item key-enter">' + "<div class=key>Enter</div>" + "<p>Быстрая пауза (без сценария)</p>" + "</div>" + "</div>" + "<div class=right-col>" + '<div class="item key-h">' + "<div class=key>+</div>" + "<p>Увеличить шрифт субтитров</p>" + "</div>" + '<div class="item key-m">' + "<div class=key>-</div>" + "<p>Уменьшить шрифт субтитров</p>" + "</div>" + "</div>" + "<div class=arrows>" + "<div class=key-top>" + "<div class=key></div>" + "<p>Громче</p>" + "</div>" + "<div class=key-right>" + "<div class=key></div>" + "<p>На фразу вперед</p>" + "</div>" + "<div class=key-bottom>" + "<div class=key></div>" + "<p>Тише</p>" + "</div>" + "<div class=key-left>" + "<div class=key></div>" + "<p>На фразу назад</p>" + "</div>" + "</div>" + "<div class=wspace>" + '<div class="key key-wspace">Пауза/Воспроизведение</div>' + "</div>" + '<div class=close onclick="player.hotkeysPopup.close()"></div>' + "</div>";
            $("#video").append(html);
            $("#vid-hotkeys-popup .close").html(svg_icons.close.cloneNode(true));
            $("#vid-hotkeys-popup .arrows .key").html(svg_icons.key_up_arrow.cloneNode(true))
        } else {
            var html = '<div id=vid-hotkeys-popup class="hotkeys-popup container-style-1">' + "<h3>Горячие клавиши</h3>" + "<div class=left-col>" + '<div class="item key-e">' + "<div class=key>E</div>" + "<p>Скрыть/показать английские субтитры (Eng)</p>" + "</div>" + '<div class="item key-s">' + "<div class=key>S</div>" + "<p>Скрыть/показать субтитры</p>" + "</div>" + '<div class="item key-r">' + "<div class=key>R</div>" + "<p>Скрыть/показать русский перевод (Rus)</p>" + "</div>" + '<div class="item key-p">' + "<div class=key>P</div>" + "<p>Скрыть/показать предыдущую фразу (Phrase)</p>" + "</div>" + '<div class="item key-f">' + "<div class=key>F</div>" + "<p>Переключить полноэкранный режим (Fullscreen)</p>" + "</div>" + '<div class="item key-enter">' + "<div class=key>Enter</div>" + "<p>Быстрая пауза (без сценария)</p>" + "</div>" + "</div>" + "<div class=right-col>" + '<div class="item key-h">' + "<div class=key>+</div>" + "<p>Увеличить шрифт субтитров</p>" + "</div>" + '<div class="item key-m">' + "<div class=key>-</div>" + "<p>Уменьшить шрифт субтитров</p>" + "</div>" + "</div>" + "<div class=arrows>" + "<div class=key-top>" + "<div class=key></div>" + "<p>Громче</p>" + "</div>" + "<div class=key-right>" + "<div class=key></div>" + "<p>На фразу вперед</p>" + "</div>" + "<div class=key-bottom>" + "<div class=key></div>" + "<p>Тише</p>" + "</div>" + "<div class=key-left>" + "<div class=key></div>" + "<p>На фразу назад</p>" + "</div>" + "</div>" + "<div class=wspace>" + '<div class="key key-wspace">Пауза/Воспроизведение</div>' + "</div>" + '<div class=close onclick="player.hotkeysPopup.close()"></div>' + "</div>";
            $("#video").append(html);
            $("#vid-hotkeys-popup .close").html(svg_icons.close.cloneNode(true));
            $("#vid-hotkeys-popup .arrows .key").html(svg_icons.key_up_arrow.cloneNode(true))
        }

        },
    toggleEnSubs: function() {
        if (!window.enSubExist) return;
        if (typeof post_type == "string") {
            if (post_type == "academy") {
                var button_cor = $(".toggleRuSub-control", video);
                button_cor.toggleClass("active")
            }
        }
        var button = $(".toggleEnSub-control", video);
        button.toggleClass("active");
        storage.set("vid-enSub-enabled", button.is(".active"));
        player.subs.langs.en.visibility = button.is(".active") ? "visible" : "hidden";
        if (window.SUBTITLES && SUBTITLES.length > 0) player.subs.update()
    },
    toggleRuSubs: function(forceState) {
        if (!window.ruSubExist) return;
        if (media_type === "video") {
            var button = $(".toggleRuSub-control", video);
            button.toggleClass("active");
            storage.set("vid-ruSub-enabled", button.is(".active"));
            player.subs.langs.ru.visibility = button.is(".active") ? "visible" : "hidden";
            if (window.SUBTITLES && SUBTITLES.length > 0) player.subs.update()
        } else {
            forceState = typeof forceState === "undefined" && !player.subs.rus_exists ? 0 : undefined;
            var button = $(".toggleRuSub-control", video);
            button.toggleClass("active");
            player.subs.langs.ru.visibility = button.is(".active") ? "visible" : "hidden";
            if (window.SUBTITLES && SUBTITLES.length > 0) player.subs.update();
            storage.set("vid-ruSub-enabled", button.is(".active"))
        }
    },
    increaseSubs: function() {
        var maxFontSize = video_api.isFullscreen() ? 80 : 44;
        if (player.subs.font_size <= maxFontSize) {
            if (localStorage.getItem("subsFontSizeNum")) {
                player.subs.font_size = +localStorage.getItem("subsFontSizeNum") + 2
            } else {
                player.subs.font_size = +player.subs.font_size + 2
            }
            localStorage.setItem("subsFontSizeNum", player.subs.font_size);
            video.find("#vid-subs").css("font-size", localStorage.getItem("subsFontSizeNum") + "px");
            video.find("#vid-subslist-sub-current").css("font-size", localStorage.getItem("subsFontSizeNum") + "px");
            video.find("#vid-subslist .sub .sub-container").css("font-size", localStorage.getItem("subsFontSizeNum") + "px")
        }
    },
    decreaseSubs: function() {
        if (player.subs.font_size >= 20) {
            if (localStorage.getItem("subsFontSizeNum")) {
                player.subs.font_size = +localStorage.getItem("subsFontSizeNum") - 2
            } else {
                player.subs.font_size = +player.subs.font_size - 2
            }
            localStorage.setItem("subsFontSizeNum", player.subs.font_size);
            video.find("#vid-subs").css("font-size", localStorage.getItem("subsFontSizeNum") + "px");
            video.find("#vid-subslist-sub-current").css("font-size", localStorage.getItem("subsFontSizeNum") + "px");
            video.find("#vid-subslist .sub .sub-container").css("font-size", localStorage.getItem("subsFontSizeNum") + "px")
        }
    },
    registerElement: function(elements) {
        if (!elements instanceof Array) {
            elements = [elements]
        }
        for (var i = 0; i < elements.length; i++) {
            (function(el) {
                vjs.options.children[el.name] = {};
                var componentClass = vjs.capitalize(el.name);
                vjs[componentClass] = vjs.Component.extend({
                    init: function(player, options) {
                        vjs.Component.call(this, player, options)
                    }
                });
                vjs[componentClass].prototype.createEl = function() {
                    return vjs.Component.prototype.createEl.call(this, "div", el.options)
                }
            })(elements[i])
        }
    },
    deregisterElement: function(names) {
        if (typeof names == "string") {
            names = [names]
        }
        for (var i = 0; i < names.length; i++) {
            delete vjs.options.children[names[i]]
        }
    },
    registerButton: function(buttons) {
        if (!buttons instanceof Array) {
            buttons = [buttons]
        }
        for (var i = 0; i < buttons.length; i++) {
            (function(button) {
                vjs.ControlBar.prototype.options_.children[button.name] = {};
                var component = vjs.capitalize(button.name);
                vjs[component] = vjs.Button.extend({
                    init: function(player, options) {
                        vjs.Button.call(this, player, options);
                        button.init && button.init.call(this, player, options)
                    }
                });
                vjs[component].prototype.buttonText = "Play";
                vjs[component].prototype.createEl = function() {
                    return vjs.Component.prototype.createEl.call(this, "div", button.options)
                };
                if (button.onClick) vjs[component].prototype.onClick = button.onClick
            })(buttons[i])
        }
    },
    deregisterButton: function(names) {
        if (typeof names == "string") {
            names = [names]
        }
        for (var i = 0; i < names.length; i++) {
            delete vjs[names[i]]
        }
    }
};
video.init();

console.log(234);
vjs.formatTime = function(seconds, guide) {
    guide = guide || seconds;
    var s = Math.floor(seconds % 60),
        m = Math.floor(seconds / 60 % 60),
        h = Math.floor(seconds / 3600),
        gm = Math.floor(guide / 60 % 60),
        gh = Math.floor(guide / 3600);
    h = h > 0 || gh > 0 ? h + ":" : "";
    m = (h && m < 10 ? "0" + m : m) + ":";
    s = s < 10 ? "0" + s : s;
    return h + m + s
};
vjs.Slider.prototype.update = function() {
    if (!this.el_) return;
    var barProgress, progress = this.getPercent(),
        handle = this.handle,
        bar = this.bar;
    if (typeof progress !== "number" || progress !== progress || progress < 0 || progress === Infinity) {
        progress = 0
    }
    barProgress = progress;
    if (handle) {
        var box = this.el_,
            boxWidth = box.offsetWidth,
            handleWidth = handle.el().offsetWidth,
            handlePercent = handleWidth ? handleWidth / boxWidth : 0,
            boxAdjustedPercent = 1 - handlePercent,
            adjustedProgress = progress * boxAdjustedPercent;
        barProgress = adjustedProgress + handlePercent / 2;
        handle.el().style.left = vjs.round(adjustedProgress * 100, 2) + "%";
        var bar_w_percent = vjs.round(barProgress * 100, 2);
        var handle_span = handle.el().childNodes[0];
        var handle_half_w = handle_span.clientWidth / 2;
        var left = -handle_half_w;
        if (bar.el().clientWidth < handle_half_w) left = -bar.el.clientWidth;
        else if (this.el().clientWidth - bar.el().clientWidth < handle_half_w) left = this.el().clientWidth - bar.el().clientWidth - handle_span.clientWidth;
        handle_span.style.left = left + "px";
        handle.el().style.left = bar_w_percent + "%";
        try {
            handle_span.innerHTML = vjs.formatTime(window.video_api ? video_api.currentTime() : 0);
            handle.el().style.display = "block"
        } catch (e) {
            handle.el().style.display = "none"
        }
    }
    if (bar) {
        bar.el().style.width = vjs.round(barProgress * 100, 2) + "%"
    }
};
vjs.Slider.prototype.calculateDistance = function(event) {
    var el = this.el_,
        box = vjs.findPosition(el),
        boxX = box.left,
        boxW = boxH = el.offsetWidth;
    return Math.max(0, Math.min(1, (event.pageX - boxX) / boxW))
};
vjs.Player.prototype.requestFullscreen = function() {
    var fsApi = vjs.browser.fullscreenAPI;
    this.isFullscreen(true);
    if (fsApi) {
        vjs.on(document, fsApi["fullscreenchange"], vjs.bind(this, function(e) {
            this.isFullscreen(document[fsApi.fullscreenElement]);
            if (this.isFullscreen() === false) {
                vjs.off(document, fsApi["fullscreenchange"], arguments.callee)
            }
            this.trigger("fullscreenchange")
        }));
        document.body[fsApi.requestFullscreen]()
    } else if (this.tech.supportsFullScreen()) {
        this.techCall("enterFullScreen")
    } else {
        this.enterFullWindow();
        this.trigger("fullscreenchange")
    }
    return this
};

$(function() {
    if ($("#video").length) {
        window.video_html5_api = document.getElementById("video_html5_api");
        window.video_element = $("#video .vjs-tech")[0];
        video = $.extend($("#video"), video);
        $(video_element).wrap("<div class=video_wrap />");
        $(".vjs-control-bar > .volume-control > div:first", video).prepend(svg_icons.volume.cloneNode(true));
        if (window.media_type === "serial" || window.media_type === "serials-light" || window.media_type === "films") $(".vjs-big-play-button", video).append(svg_icons.play.cloneNode(true));
        if (typeof window.vjs_autoinit === "undefined" || window.vjs_autoinit) {
            vjs("video").ready(function() {
                audio.types = ["mp3"];
                audio.init();
                player.init();

                if (typeof window.post_id !== "undefined") {
                    var fromTime = storage.get("episode" + post_id);
                    if (fromTime !== null) player.playFromTime(fromTime)
                }

                // video.timeupdatefunction (event,fff,ddd) {
                //     debugger;
                // };
            })
        }
    }
});
$(document).ready(function() {
    $(".playMovieSlowly_js").change(function() {
        var targetVideo = $("#video_html5_api").get(0);
        var slowRatioValue = $(this).val();
        switch (slowRatioValue) {
            case "1":
                targetVideo.playbackRate = "0.3";
                break;
            case "2":
                targetVideo.playbackRate = ".5";
                break;
            case "3":
                targetVideo.playbackRate = ".75";
                break;
            case "4":
                targetVideo.playbackRate = "1";
                break;
            case "5":
                targetVideo.playbackRate = "2";
                break
        }
    });
    $(".options__slow-set-range .slow-range__values_js span:first-child").on("click", function(event) {
        event.preventDefault();
        $(this).parents(".slow-ratio__speed-range").find(".slowRatioRange").val("1");
        $("#video_html5_api").get(0).playbackRate = "0.3"
    });
    $(".options__slow-set-range .slow-range__values_js span:nth-child(2)").on("click", function(event) {
        event.preventDefault();
        $(this).parents(".slow-ratio__speed-range").find(".slowRatioRange").val("2");
        $("#video_html5_api").get(0).playbackRate = ".5"
    });
    $(".options__slow-set-range .slow-range__values_js span:nth-child(3)").on("click", function(event) {
        event.preventDefault();
        $(this).parents(".slow-ratio__speed-range").find(".slowRatioRange").val("3");
        $("#video_html5_api").get(0).playbackRate = ".75"
    });
    $(".options__slow-set-range .slow-range__values_js span:nth-child(4)").on("click", function(event) {
        event.preventDefault();
        $(this).parents(".slow-ratio__speed-range").find(".slowRatioRange").val("4");
        $("#video_html5_api").get(0).playbackRate = "1"
    });
    $(".options__slow-set-range .slow-range__values_js span:last-child").on("click", function(event) {
        event.preventDefault();
        $(this).parents(".slow-ratio__speed-range").find(".slowRatioRange").val("5");
        $("#video_html5_api").get(0).playbackRate = "2"
    })
});
$(document).ready(function() {
    $(".subBgOpacity_js").change(function() {
        var $target = $(this).parents("#video").find(".vid-subs");
        var subBgOpacityValue = $(this).val();
        switch (subBgOpacityValue) {
            case "1":
                $target.css("background", "rgba(0, 0, 0, 1)");
                $("#vid-subslist .sub .bg").css("background", "rgba(0, 0, 0, 1)");
                break;
            case "2":
                $target.css("background", "rgba(0, 0, 0, .5)");
                $("#vid-subslist .sub .bg").css("background", "rgba(0, 0, 0, .5)");
                break;
            case "3":
                $target.css("background", "rgba(0, 0, 0, .25)");
                $("#vid-subslist .sub .bg").css("background", "rgba(0, 0, 0, .25)");
                break;
            case "4":
                $target.css("background", "rgba(0, 0, 0, 0)");
                $("#vid-subslist .sub .bg").css("background", "rgba(0, 0, 0, 0)");
                break
        }
    });
    $(".options__slow-set-range .sub-bg-opacity__values_js span:first-child").on("click", function(event) {
        event.preventDefault();
        $(this).parents(".slow-ratio__speed-range").find(".slowRatioRange").val("1");
        $(this).parents("#video").find(".vid-subs").css("background", "rgba(0, 0, 0, 1)");
        $("#vid-subslist .sub .bg").css("background", "rgba(0, 0, 0, 1)")
    });
    $(".options__slow-set-range .sub-bg-opacity__values_js span:nth-child(2)").on("click", function(event) {
        event.preventDefault();
        $(this).parents(".slow-ratio__speed-range").find(".slowRatioRange").val("2");
        $(this).parents("#video").find(".vid-subs").css("background", "rgba(0, 0, 0, .5)");
        $("#vid-subslist .sub .bg").css("background", "rgba(0, 0, 0, .5)")
    });
    $(".options__slow-set-range .sub-bg-opacity__values_js span:nth-child(3)").on("click", function(event) {
        event.preventDefault();
        $(this).parents(".slow-ratio__speed-range").find(".slowRatioRange").val("3");
        $(this).parents("#video").find(".vid-subs").css("background", "rgba(0, 0, 0, .25)");
        $("#vid-subslist .sub .bg").css("background", "rgba(0, 0, 0, .25)")
    });
    $(".options__slow-set-range .sub-bg-opacity__values_js span:last-child").on("click", function(event) {
        event.preventDefault();
        $(this).parents(".slow-ratio__speed-range").find(".slowRatioRange").val("4");
        $(this).parents("#video").find(".vid-subs").css("background", "rgba(0, 0, 0, 0)");
        $("#vid-subslist .sub .bg").css("background", "rgba(0, 0, 0, 0)")
    });
    $("#vid-settings-autocontinue").on("change", function() {
        if (this.checked) {
            storage.set("autocontinue", "on")
        } else {
            storage.set("autocontinue", "off");
            $(".puzzle-notification").fadeOut(400);
            clearInterval(window.next_episode_countdown)
        }
    });
    $("body").on("touchstart", ".hotkeys-toggle", function() {
        player.hotkeysPopup.toggle();
        return false
    });
    var isTouchMoved = false;
    $("body").on("touchstart touchmove touchend", "#vid-settings-controls ul.options label", function(event) {
        switch (event.type) {
            case "touchstart":
                isTouchMoved = false;
                break;
            case "touchmove":
                isTouchMoved = true;
                break;
            case "touchend":
                if (isTouchMoved) return;
                $(this).siblings("input").click();
                isTouchMoved = false;
                break
        }
    })
});
if ($("html").hasClass("mobile")) {
    document.addEventListener("touchstart", function(e) {
        if (e.target.classList.contains("vjs-settings-control__open") || e.target.parentNode.classList.contains("vjs-settings-control__open")) {
            player.settings_controls.toggle()
        }
    })
}

function videoSettingsControls() {
    var widthwin = $(window).width();
    var heightVideoContent = $(".video_wrap").outerHeight();
    if (widthwin < 992) {
        $("#vid-settings-controls").css({
            height: heightVideoContent - 60,
            overflow: "scroll"
        })
    }
}

function showModalFinish() {
    document.getElementById('idFinish').style.display='block';
}
function showModalSeeAnother(data) {
    var newLink = document.createElement("a");
    newLink.innerHTML = data.module.see_new_name;
    newLink.setAttribute('href', data.module.see_new_url);
    document.getElementById('new_film_move').innerHTML='';
    document.getElementById('new_film_move').append(newLink);
    document.getElementById('idShowAnother').style.display='block';
}
function forceClose(force) {
    document.getElementById('idFinish').style.display='none';
    document.getElementById('idShowAnother').style.display='none';

    $.post("/engine/ajax/trialuser.php",
        {"news_trial_id":window.news_trial_id,force:force}, function( data ){
            document.location.reload();
        });
}

// console.log(123);
// $.ajax({
//     url: 'https://translate.english-films.club/api/1249726/language/ru/json',
//     success: function(data){
//
//         // console.error(data)
//         // console.error(window.SUBTITLES);
//
//       // const res=  window.SUBTITLES.map(function (o) {
//       //    let resObj= data.find(function (rus) {
//       //        return  rus.id===o.id;
//       //    });
//       //     o.ru=resObj.text;
//       //     o.clean_ru=resObj.text;
//       //     return o;
//       //   })
//       //   window.SUBTITLES=res;
//       //   console.error(window.SUBTITLES);
//         // video.init();
//         // alert('Load was performed.');
//     },
//     complete: function (data) {
//         // setTimeout(function () {
//         //     // video.init();
//         // },1000)
//
//     }
// });

// $.ajax({
//     // accepts: {
//     //     mycustomtype: 'application/x-some-custom-type'
//     // },
//
//     // Instructions for how to deserialize a `mycustomtype`
//     converters: {
//         'text mycustomtype': function(result) {
//             // Do Stuff
//             return newresult;
//         }
//     },
//
//     // Expect a `mycustomtype` back from server
//     dataType: 'mycustomtype'
// });
