diff --git a/templates/macros.html b/templates/macros.html index 55155e1cc5e9b2763a6ed2e61e0d59c1d20d9135..1564dc366d56c14548fab270059af8860b61df0a 100644 --- a/templates/macros.html +++ b/templates/macros.html @@ -56,78 +56,79 @@ <track srclang="de" kind="chapters" src="{{ url_for('chapters',lectureid=lecture.id) }}" /> </video> <script> -$('#videoplayer').addClass("vjs-fluid"); -$('#videoplayer').css("width"); $(function() { -videojs("videoplayer").ready(function() { + $('#videoplayer').addClass("vjs-fluid"); + $('#videoplayer').css("width"); + videojs("videoplayer").ready(function() { - //resume - var progress_key = "progress_{{ lecture.id }}"; - var seconds_played; - if (localStorage) { - seconds_played = localStorage.getItem(progress_key); - if (!seconds_played) { - seconds_played = 0; - } else { - videojs('videoplayer').currentTime(seconds_played); - } - } - videojs("videoplayer").on("timeupdate", function() { + //resume + var progress_key = "progress_{{ lecture.id }}"; + var seconds_played; if (localStorage) { - var player_cur_Time = Math.round(videojs("videoplayer").currentTime()); - if(Math.abs(player_cur_Time - seconds_played) >= 10) { - seconds_played = player_cur_Time; - localStorage.setItem( progress_key , seconds_played) + seconds_played = localStorage.getItem(progress_key); + if (!seconds_played) { + seconds_played = 0; + } else { + videojs('videoplayer').currentTime(seconds_played); } } + videojs("videoplayer").on("timeupdate", function() { + if (localStorage) { + var player_cur_Time = Math.round(videojs("videoplayer").currentTime()); + if(Math.abs(player_cur_Time - seconds_played) >= 10) { + seconds_played = player_cur_Time; + localStorage.setItem( progress_key , seconds_played) + } + } - }); + }); - //autoplay - var playerplay = function() { - if ($('#videoplayer').data("wasnotplayed") == 1) { - videojs('videoplayer').play(); - $('#videoplayer').data("wasnotplayed","0"); + //autoplay + var playerplay = function() { + if ($('#videoplayer').data("wasnotplayed") == 1) { + videojs('videoplayer').play(); + $('#videoplayer').data("wasnotplayed","0"); + } + }; + $(window).focus(playerplay); + if (document.hasFocus()) { + playerplay(); } - }; - $(window).focus(playerplay); - if (document.hasFocus()) { - playerplay(); - } + // errors as modal dialog + videojs("videoplayer").on("error", function() { + var modals = []; + //display errors + {% for msg in msgs %} + var m = videojs("videoplayer").createModal('',{"uncloseable": true }); + modals.push(m); + m.contentEl().innerHTML='<div class="hidden-print alert alert-danger" role="alert">{{ msg|safe }}</div>'; + + {% endfor %} + videojs("videoplayer").on('play', function() { + for (var i=0; i < modals.length; i++) { + modals[i].close(); + } + }); + }); + //markers + $.ajax({method: "GET", url: "{{url_for('chapters',lectureid=lecture.id, json=1)}}", dataType: "json", + success: function (data) { + videojs("videoplayer").markers({ + markerStyle: { + 'width':'5px', + 'border-radius': '40%', + 'background-color': 'black' + }, + markerTip:{ + display: true, + text: function(marker) { + return marker.text; + } + }, + markers: data}); + }}); - var modals = []; - //display errors - {% for msg in msgs %} - var m = videojs("videoplayer").createModal('',{"uncloseable": true }); - modals.push(m); - m.contentEl().innerHTML='<div class="hidden-print alert alert-danger" role="alert">{{ msg|safe }}</div>'; - - {% endfor %} - videojs("videoplayer").on('play', function() { - for (var i=0; i < modals.length; i++) { - modals[i].close(); - } }); - - //markers - $.ajax({method: "GET", url: "{{url_for('chapters',lectureid=lecture.id, json=1)}}", dataType: "json", - success: function (data) { - videojs("videoplayer").markers({ - markerStyle: { - 'width':'5px', - 'border-radius': '40%', - 'background-color': 'black' - }, - markerTip:{ - display: true, - text: function(marker) { - return marker.text; - } - }, - markers: data}); - }}); - -}); }); </script> {% endmacro %}