From 8bf1a383ac9633c7d2aafae822f811351f35c67c Mon Sep 17 00:00:00 2001 From: DmitriyMX Date: Tue, 12 Dec 2017 09:40:44 +0300 Subject: [PATCH] =?UTF-8?q?=D0=BD=D0=B0=D0=B2=D0=BE=D0=B4=D0=B8=D0=BC=20?= =?UTF-8?q?=D0=BF=D0=BE=D1=80=D1=8F=D0=B4=D0=BE=D0=BA=20=D0=B2=20javascrip?= =?UTF-8?q?t?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit see #28 --- .../resources/kinosearch/webapp/player.ftl | 67 +---- .../kinosearch/webapp/static/js/player.js | 232 +++++++++++------- 2 files changed, 153 insertions(+), 146 deletions(-) diff --git a/src/main/resources/kinosearch/webapp/player.ftl b/src/main/resources/kinosearch/webapp/player.ftl index d6ba356..59d015d 100644 --- a/src/main/resources/kinosearch/webapp/player.ftl +++ b/src/main/resources/kinosearch/webapp/player.ftl @@ -2,66 +2,6 @@ [#include "/header.inc.ftl"] -
- - + +
@@ -114,4 +54,7 @@
+ [#include "/fother.inc.ftl"] \ No newline at end of file diff --git a/src/main/resources/kinosearch/webapp/static/js/player.js b/src/main/resources/kinosearch/webapp/static/js/player.js index fe1df2b..92aa3b5 100644 --- a/src/main/resources/kinosearch/webapp/static/js/player.js +++ b/src/main/resources/kinosearch/webapp/static/js/player.js @@ -1,51 +1,60 @@ -function PlayerCore(playerObj, titleObj, videoData) { - this.playerObj = playerObj; - this.titleObj = titleObj; - this.videoData = videoData; +const PlayerCore = function(playerObj, titleObj, videoData) { + this.path = window.location.pathname; this.origDocTitle = document.title; - this.timeLast = 0; - this.msToTime = function(ms) { - function addZ(n) { return (n<10? '0':'') + n; } + const _this = this; - var _ms = ms % 1000; - ms = (ms - _ms) / 1000; - var _sec = ms % 60; - ms = (ms - _sec) / 60; - var _min = ms % 60; - var _hr = (ms - _min) / 60; + // сохранение времени просмотра + playerObj.bind('play', function() { + _this.timeLast = $.now(); + }); - return { - 's': addZ(_sec), - 'm': addZ(_min), - 'h': addZ(_hr) - }; + playerObj.bind('timeupdate', function() { + let timeCurrent = $.now(); + let sec = Math.floor((timeCurrent - _this.timeLast)/1000); + if (sec >= 5) { + let playerCurrentTime = playerObj[0].currentTime; + if (Math.floor(playerCurrentTime) <= 10) + return; + let save_data = { 'time': playerCurrentTime }; + Cookies.set(_this.path, save_data, { 'expires': 30 }); + _this.timeLast = timeCurrent; + console.debug({ + 'path': _this.path, + 'saveTime': save_data + }); //TODO убрать на продакшене + } + }); + + this.getType = function() { + return videoData.type; }; - this.setTitle = function(title = videoData.title) { - document.title = title + " :: " + this.origDocTitle; + this.setTitle = function(title) { + if (!title) { + title = videoData.title; + } + document.title = title + " :: " + _this.origDocTitle; titleObj.text(title); titleObj.show(); }; - this.getType = function() { - return this.videoData.type; - }; - - this.setupPlayerForOneFilm = function() { + this.setupForOneFilm = function() { playerObj.attr('src', videoData.file); playerObj.load(); }; - this.setupPlayerForSimpleSerial = function(serialBlock) { - var menu = serialBlock.find('.dropdown-menu'); + this.setupForSimpleSerial = function(serialBlock) { + let menu = serialBlock.find('.dropdown-menu'); menu.html(''); - var _self = this; - this.videoData.serials.forEach(function(item, i) { - var aTag = $('', {'href':'#', 'text':item.title}); - aTag.click(function(){_self.setSerial(i, serialBlock)}); - var liTag = $('
  • ') + let _self = this; + videoData.serials.forEach(function(item, i) { + let aTag = $('', { 'href': '#', 'text': item.title }); + aTag.click(function() { + _self.setSerial(i, serialBlock); + }); + let liTag = $('
  • '); liTag.append(aTag); menu.append(liTag); }); @@ -53,14 +62,16 @@ function PlayerCore(playerObj, titleObj, videoData) { serialBlock.removeClass('hide'); }; - this.setupPlayerForSeasonSerial = function(seasonBlock, serialBlock) { - var menu = seasonBlock.find('.dropdown-menu'); + this.setupForSeasonSerial = function(seasonBlock, serialBlock) { + let menu = seasonBlock.find('.dropdown-menu'); menu.html(''); - var _self = this; - this.videoData.seasons.forEach(function(item, i) { - var aTag = $('', {'href':'#', 'text':item.title}); - aTag.click(function(){_self.setSeason(i, seasonBlock, serialBlock)}); - var liTag = $('
  • '); + let _self = this; + videoData.seasons.forEach(function(item, i) { + let aTag = $('', { 'href': '#', 'text': item.title }); + aTag.click(function() { + _self.setSeason(i, seasonBlock, serialBlock); + }); + let liTag = $('
  • '); liTag.append(aTag); menu.append(liTag); }); @@ -68,65 +79,118 @@ function PlayerCore(playerObj, titleObj, videoData) { seasonBlock.removeClass('hide'); }; - this.setupPlayer = function() { - var _self = this; - // сохранение времени просмотра - playerObj.bind('play', function(){ - _self.timeLast = $.now(); - }); + this.setSerial = function(idx, serialBlock, sidx) { + if (!sidx) { + sidx = 0; + } - playerObj.bind('timeupdate', function(){ - var timeCurrent = $.now(); - var sec = Math.floor((timeCurrent - _self.timeLast)/1000); - if (sec >= 5) { - playerCurrentTime = playerObj[0].currentTime; - if (Math.floor(playerCurrentTime) <= 10) return; - - var save_data = {'time':playerCurrentTime}; - Cookies.set(_self.path, save_data, {'expires':30}); - _self.timeLast = timeCurrent; - console.debug({'path': _self.path, 'saveTime': save_data}); - } - }); - }; - - this.setSerial = function(idx, serialBlock, sidx = 0) { - var title; - var playerSrc; - if (this.getType() == 'seasons_serial') { + let title; + let playerSrc; + if (_this.getType() == 'seasons_serial') { title = videoData.seasons[sidx].serials[idx].title; playerSrc = videoData.seasons[sidx].serials[idx].file; } else { title = videoData.serials[idx].title; playerSrc = videoData.serials[idx].file; } - this.setTitle(title); + _this.setTitle(title); - var menuBtn = serialBlock.find('#dropdownSerial'); + let menuBtn = serialBlock.find('#dropdownSerial'); menuBtn.html(title + ' '); playerObj.attr('src', playerSrc); playerObj.attr('data-serial', idx); - playerObj.load(); }; - this.setSeason = function(idx, seasonBlock, serialBlock) { - var title = videoData.seasons[idx].title; + this.setTime = function(time) { + playerObj[0].currentTime = time; + }; - var menuBtn = seasonBlock.find('#dropdownSeason'); - menuBtn.html(title + ' '); + this.load = function() { + playerObj.load(); + }; +}; - var menu = serialBlock.find('.dropdown-menu'); - menu.html(''); - var _self = this; - this.videoData.seasons[idx].serials.forEach(function(item, i) { - var aTag = $('', {'href':'#', 'text':item.title}); - aTag.click(function(){_self.setSerial(i, serialBlock, idx)}); - var liTag = $('
  • '); - liTag.append(aTag); - menu.append(liTag); - }); - - serialBlock.removeClass('hide'); +function msToTime(ms) { + function addZ(n) { + return (n < 10 ? '0' : '') + n; } -} \ No newline at end of file + + const _ms = ms % 1000; + ms = (ms - _ms) / 1000; + const _sec = ms % 60; + ms = (ms - _sec) / 60; + const _min = ms % 60; + const _hr = (ms - _min) / 60; + + return { + 'sec': addZ(_sec), + 'min': addZ(_min), + 'hour': addZ(_hr) + }; +} + +function loadPlayerCookieData(playerCore) { + let data = Cookies.getJSON(playerCore.path); + + if (data != null) { + let fulltime = msToTime(data.time * 1000); + $('#mdl-vtime').text(fulltime.hour + ':' + fulltime.min + ':' + fulltime.sec); + + if (playerCore.getType() == 'simple_serial') { + $('#mdl-serial').find('span').text(data.serial + 1); + $('#mdl-serial').removeClass('hide'); + + $('#mdl-btn-yes').click(function() { + playerCore.setSerial(data.serial, $('#pl-serial')); + + playerCore.setTime(data.time); + playerCore.load(); + }); + + $('#mdl-btn-no').click(function() { + playerCore.load(); + }); + } else if (playerCore.getType() == 'seasons_serial') { + $('#mdl-season').find('span').text(data.season + 1); + $('#mdl-season').removeClass('hide'); + $('#mdl-serial').find('span').text(data.serial + 1); + $('#mdl-serial').removeClass('hide'); + + $('#mdl-btn-yes').click(function() { + playerCore.setSeason(data.season, $('#pl-season')); + playerCore.setSerial(data.serial, $('#pl-serial'), data.season); + + playerCore.setTime(data.time); + playerCore.load(); + }); + + $('#mdl-btn-no').click(function() { + playerCore.load(); + }); + } + $('#modal').modal('show'); + } +} + +function initPlayer(video_data) { + const playerCore = new PlayerCore($('#player'), $('#title'), video_data); + + // загрузка ранее сохранённых данных + loadPlayerCookieData(playerCore); + + if (playerCore.getType() == 'one_film') { + playerCore.setTitle(); + playerCore.setupForOneFilm(); + } else if (playerCore.getType() == 'simple_serial') { + playerCore.setupForSimpleSerial($('#pl-serial')); + $('#title').hide(); + } else if (playerCore.getType() == 'seasons_serial') { + playerCore.setupForSeasonSerial($('#pl-season'), $('#pl-serial')); + $('#title').hide(); + } else { + console.debug(video_data); //TODO убрать из продакшена + } + + return playerCore; +}