сохранение времени последнего просмотра

webapp/WEB-INF/player.html

@@ -1,10 +1,33 @@
 <#include "/header.inc.html">
+    <script type="text/javascript" src="${basedir}/js/js.cookie-2.1.0.min.js"></script>
     <script type="text/javascript">
         var video_data = ${json};
+        var player;
+        var videotime = 0;
+
+        function msToTime(ms) {
+            function addZ(n) { return (n<10? '0':'') + n; }
+
+            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;
+
+            return {
+                's': addZ(_sec),
+                'm': addZ(_min),
+                'h': addZ(_hr)
+            };
+        }
 
         $(function(){
+            player = $('#player');
+
+            // set video
             if (typeof(video_data.file) !== 'undefined') {
-                $('#player').attr('src', '${basedir}'+video_data.file);
+                player.attr('src', '${basedir}'+video_data.file);
             } else if (typeof(video_data.playlist) !== 'undefined') {
                 $('#pl-season').removeClass('hide');
                 menu = $('#pl-season-menu');
@@ -28,15 +51,59 @@
 
                     smenu.find('a').bind('click', function(){
                         $('#dropdownSerial').html(this.text + '&nbsp;<span class="caret"></span>');
-                        $('#player').attr('src', '${basedir}'+this.attributes['data-file'].value);
+                        player.attr('src', '${basedir}'+this.attributes['data-file'].value);
                     });
 
                     $('#pl-serial').removeClass('hide');
                 });
             }
+
+            // save video time
+            var path = window.location.pathname.substr("${basedir}".length);
+            var data = Cookies.getJSON(path);
+            if (data != null) {
+                videotime = data.time;
+                var fulltime = msToTime(videotime * 1000);
+                $('#mdl-vtime').text(fulltime.h + ':' + fulltime.m + ':' + fulltime.s);
+                $('#modal').modal('show');
+            } else {
+                player.load();
+            }
+
+            var tl;
+            player.bind('play', function(){
+                tl = $.now();
             });
+            player.bind('timeupdate', function(){
+                var tc = $.now();
+                var sec = Math.floor((tc-tl)/1000);
+                if (sec >= 5) {
+                    Cookies.set(path, {time:player[0].currentTime});
+                    tl = tc;
+                }
+            });
+        });
+
+        function continueVideo() {
+            player[0].currentTime = videotime;
+            player[0].load();
+        }
     </script>
 
+    <div class="modal fade" tabindex="-1" role="dialog" id="modal">
+        <div class="modal-dialog modal-sm">
+            <div class="modal-content">
+                <div class="modal-body">
+                    <p class="text-center">Продолжить просмотр с <span id="mdl-vtime"></span>?</p>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-primary" data-dismiss="modal" onclick="continueVideo()">Да</button>
+                    <button type="button" class="btn btn-default" data-dismiss="modal" onclick="player[0].load()">Нет</button>
+                </div>
+            </div>
+        </div>
+    </div>
+
     <hr>
 
     <div id="pl-season" class="dropdown hide" style="display: inline-block;">
@@ -61,6 +128,6 @@
 
     <br><br>
 
-    <video id="player" class="center-block" controls="controls"></video>
+    <video id="player" class="center-block" controls="controls" preload="none"></video>
     <br>
 <#include "/fother.inc.html">

webapp/js/js.cookie-2.1.0.min.js

@@ -0,0 +1,2 @@
+/*! js-cookie v2.1.0 | MIT */
+!function(a){if("function"==typeof define&&define.amd)define(a);else if("object"==typeof exports)module.exports=a();else{var b=window.Cookies,c=window.Cookies=a();c.noConflict=function(){return window.Cookies=b,c}}}(function(){function a(){for(var a=0,b={};a<arguments.length;a++){var c=arguments[a];for(var d in c)b[d]=c[d]}return b}function b(c){function d(b,e,f){var g;if(arguments.length>1){if(f=a({path:"/"},d.defaults,f),"number"==typeof f.expires){var h=new Date;h.setMilliseconds(h.getMilliseconds()+864e5*f.expires),f.expires=h}try{g=JSON.stringify(e),/^[\{\[]/.test(g)&&(e=g)}catch(i){}return e=c.write?c.write(e,b):encodeURIComponent(String(e)).replace(/%(23|24|26|2B|3A|3C|3E|3D|2F|3F|40|5B|5D|5E|60|7B|7D|7C)/g,decodeURIComponent),b=encodeURIComponent(String(b)),b=b.replace(/%(23|24|26|2B|5E|60|7C)/g,decodeURIComponent),b=b.replace(/[\(\)]/g,escape),document.cookie=[b,"=",e,f.expires&&"; expires="+f.expires.toUTCString(),f.path&&"; path="+f.path,f.domain&&"; domain="+f.domain,f.secure?"; secure":""].join("")}b||(g={});for(var j=document.cookie?document.cookie.split("; "):[],k=/(%[0-9A-Z]{2})+/g,l=0;l<j.length;l++){var m=j[l].split("="),n=m[0].replace(k,decodeURIComponent),o=m.slice(1).join("=");'"'===o.charAt(0)&&(o=o.slice(1,-1));try{if(o=c.read?c.read(o,n):c(o,n)||o.replace(k,decodeURIComponent),this.json)try{o=JSON.parse(o)}catch(i){}if(b===n){g=o;break}b||(g[n]=o)}catch(i){}}return g}return d.get=d.set=d,d.getJSON=function(){return d.apply({json:!0},[].slice.call(arguments))},d.defaults={},d.remove=function(b,c){d(b,"",a(c,{expires:-1}))},d.withConverter=b,d}return b(function(){})});