X-Git-Url: https://git.mdrn.pl/wolnelektury.git/blobdiff_plain/d019a9b5e928dcf777852d0c8d5413fd3d69b4dd..4dad587dac33c6c04d9a1a594fbbd1c58dbf2bda:/src/catalogue/static/player/2022_player.js

diff --git a/src/catalogue/static/player/2022_player.js b/src/catalogue/static/player/2022_player.js
index da0ba9a32..f6dc06965 100644
--- a/src/catalogue/static/player/2022_player.js
+++ b/src/catalogue/static/player/2022_player.js
@@ -1,17 +1,24 @@
 (function($) {
     $(function() {
 
+        $.jPlayer.timeFormat.showHour = true;
+
         $(".jp-jplayer").each(function() {
             console.log('starting player')
-      	var $self = $(this);
-        var $root = $self.parent();
+            var $self = $(this);
+            var $root = $self.parent();
+            var $currentMedia = null
+            var currentDuration = 0;
+            var speed = 1;
+            var totalDurationLeft = 0;
+            var lastUpdate = 0;
 
-            //  //  var $number = $('.number', $root);
         $self.jPlayer({
-            swfPath: "/static/jplayer/",
+            swfPath: "/static/js/contrib/jplayer/",
             solution: "html,flash",
             supplied: 'oga,mp3',
             cssSelectorAncestor: "#" + $self.attr("data-player"),
+            useStateClassSkin: true,
 
             ready: function() {
                 var player = $(this);
@@ -25,39 +32,72 @@
                     media['oga'] = elem.attr('data-ogg');
                     media['id'] = elem.attr('data-media-id');
 
-                    $(".c-player__title", $root).html($(".title", elem).html());
-                    $(".c-player__info", $root).html($(".attribution", elem).html());
+                    $(".c-player__head", $root).html(
+                        $(".attribution", elem).html())
+                    ;
+                    $(".c-player__info", $root).html(
+                        $(".title", elem).html()
+                    );
                     $(".c-media__caption .content", $root).html($(".project-description", elem).html());
                     $(".c-media__caption .license", $root).html($(".license", elem).html());
                     $(".c-media__caption .project-logo", $root).html($(".project-icon", elem).html());
                     
                     player.jPlayer("setMedia", media);
+                    $("audio")[0].playbackRate = speed;
                     player.jPlayer("pause", time);
+
+                    $currentMedia = elem;
+                    $(".play-prev", $root).prop("disabled", !elem.prev().length);
+                    $(".play-next", $root).prop("disabled", !elem.next().length);
+
+                    let du = elem.data('duration');
+                    currentDuration = du;
+                    elem.nextAll().each(function() {
+                        du += $(this).data('duration');
+                    });
+                    totalDurationLeft = du;
+
                     return player;
                 };
 
+                let selectItem = $('.c-select li');
+                selectItem.on('click', function() {
+                    let speedStr = $(this).data('speed');
+                    speed = parseFloat(speedStr);
+                    $("audio")[0].playbackRate = speed;
+                    localStorage['audiobook-speed'] = speedStr;
+                });
+                
                 $('.play-next', $root).click(function() {
-                    var next = parseInt($number.text()) + 1;
-                    var p = $('.jp-playlist .play:eq(' + (next - 1) + ')', $root);
+                    let p = $currentMedia.next();
                     if (p.length) {
                         setMedia(p).jPlayer("play");
-                        $number.text(next)
                     }
                 });
                 $('.play-prev', $root).click(function() {
-                    var next = parseInt($number.text()) - 1;
-                    if (next < 1)
-                        return;
-                    var p = $('.jp-playlist .play:eq(' + (next - 1) + ')', $root);
-                    setMedia(p).jPlayer("play");
-                    $number.text(next)
+                    let p = $currentMedia.prev();
+                    if (p.length) {
+                        setMedia(p).jPlayer("play");
+                    }
                 });
 
-                console.log(1);
+                $('.jp-playlist li', $root).click(function() {
+                    setMedia($(this)).jPlayer("play");
+                    $('.c-player__chapters').removeClass('is-active');
+                });
 
                 var initialElem = $('.jp-playlist li', $root).first();
                 var initialTime = 0;
                 if (true || Modernizr.localstorage) {
+                    try {
+                        let speedStr = localStorage['audiobook-speed'];
+                        if (speedStr) {
+                            speed = parseFloat(speedStr);
+                            $(".speed .is-active").removeClass("is-active");
+                            $(".speed [data-speed='" + speedStr + "']").addClass("is-active");
+                        }
+                    } catch {}
+
                     try {
                         audiobooks = JSON.parse(localStorage["audiobook-history"]);
                     } catch {
@@ -70,26 +110,32 @@
                     }
 
                     if (last) {
-                        initialElem = $('[data-media-id="' + last[1] + '"] .play', $root).first();
+                        initialElem = $('[data-media-id="' + last[1] + '"]', $root).first();
                         initialTime = last[2];
-                        $number.text($(".jp-playlist .play", $root).index(initialElem) + 1);
                     }
                 }
                 setMedia(initialElem, initialTime);
             },
 
             timeupdate: function(event) {
-                //event.jPlayer.status.currentTime
+                t = event.jPlayer.status.currentTime;
+                ttl = (totalDurationLeft - t) / speed;
+                ttl = $.jPlayer.convertTime(ttl);
+                $(".total-time-left").text('Czas do końca: ' + ttl);
+
+                $(".time-left").text('– ' + $.jPlayer.convertTime(
+                    currentDuration - t,
+                ));
                 
                 
-                if (true || (event.jPlayer.status.currentTime && Modernizr.localstorage)) {
+                if (Math.abs(t - lastUpdate) > 3) {
                     try {
                         audiobooks = JSON.parse(localStorage["audiobook-history"]);
                     } catch {
                         audiobooks = {};
                     }
-                    t = event.jPlayer.status.currentTime;
                     if (t && event.jPlayer.status.duration - t > 10) {
+                        console.log('writer');
                         audiobooks[$root.attr("data-book-slug")] = [
                             Date.now(),
                             event.jPlayer.status.media.id,
@@ -101,6 +147,7 @@
                     // Remove old book id, if present.
                     delete audiobooks[$root.attr("data-book-id")];
                     localStorage["audiobook-history"] = JSON.stringify(audiobooks);
+                    lastUpdate = t;
                 }
             }
         });