seeking

sites/all/themes/custom/edlptheme/assets/scripts/main.js

@@ -889,6 +889,8 @@
         this.$container.appendTo(this.$container_parent);
         // record timeline width
         this.timeline_w = parseInt(this.$timeline.width());
+        // init seeking
+        this.$loader.on('click', this.seek.bind(this));
         // init audio events
         var fn = '';
         for (var i = 0; i < this.audio_events.length; i++) {
@@ -1016,6 +1018,7 @@
         // need to trigger play right now to prevent safari blocking auto-play
         this.play();
       },
+      // audio is ready to play
       onLoadedmetadata(){
         var rem = parseInt(this.audio.duration, 10),
             mins = Math.floor(rem/60,10),
@@ -1103,6 +1106,11 @@
           this.timeOutToHide();
         }
       },
+      seek(e){
+        var seek = e.originalEvent.layerX / this.timeline_w * this.audio.duration
+        console.log("Audio seeking : seek", seek);
+        this.audio.currentTime = seek;
+      },
       // audio events
       onPlaying(){
         this.$btns.addClass('is-playing');

sites/all/themes/custom/edlptheme/assets/styles/app.scss

@@ -675,16 +675,22 @@ main[role="main"]{
       background-color: #000;
       overflow: visible;
       transform: rotateZ(-46deg);
+      // outline: 3px solid blue;
       .loader{
-        width:0; height:100%;
+        width:0; height:1px;
         background-color: red;
-        top:0;left:0;
+        border-top: 2px solid white;
+        border-bottom: 2px solid white;
+        position: absolute;
+        top:-2px;left:0;
+        cursor: pointer;
       }
       .cursor{
         height:10px;width:0;
         border-left: 2px solid red;
         position:absolute;
         left:0; top:-5px;
+        pointer-events: none;
       }
     }
   }