fix seek for items

static/mobile/js/VideoElement.js

@@ -8,6 +8,7 @@ VideoElement <f> VideoElement Object
         loop <b|false> loop playback
         playbackRate <n|1> playback rate
         position <n|0> start position
+        in <n|0> start offset
     self <o> Shared private variable
     ([options[, self]]) -> <o:Element> VideoElement Object
         loadedmetadata <!> loadedmetadata
@@ -38,6 +39,7 @@ window.VideoElement = function(options) {
         muted: false,
         playbackRate: 1,
         position: 0,
+        "in": 0,
         volume: 1
     }
     Object.assign(self.options, options);
@@ -166,9 +168,10 @@ window.VideoElement = function(options) {
 
     function getCurrentTime() {
         var item = self.items[self.currentItem];
-        return self.seeking || self.loading
+        var currentTime = self.seeking || self.loading
             ? self.currentTime
-            : item ? item.position + self.video.currentTime - item['in'] : 0;
+            : item ? item.position + self.video.currentTime - item['in'] - self.options["in"] : 0;
+        return currentTime
     }
 
     function getset(key, value) {
@@ -508,6 +511,7 @@ window.VideoElement = function(options) {
     }
 
     function setCurrentItemTime(currentTime) {
+        currentTime += self.options["in"]
         debug('Video', 'sCIT', currentTime, self.video.currentTime,
             'delta', currentTime - self.video.currentTime);
         isReady(self.video, function(video) {

static/mobile/js/VideoPlayer.js

@@ -10,6 +10,7 @@ window.VideoPlayer = function(options) {
         loop: false,
         muted: false,
         playbackRate: 1,
+        "in": 0,
         position: 0,
         volume: 1
     }

static/mobile/js/main.js

@@ -67,6 +67,7 @@ function parseURL() {
         id = id.replace('/editor/', '/').replace('/player/', '/')
         type = "item"
     }
+    //console.log(type, id, args)
     return [type, id, args]
 }
 

static/mobile/js/render.js

@@ -75,7 +75,8 @@ function renderItem(data) {
     var video = window.video = VideoPlayer({
         items: data.videos,
         poster: data.poster,
-        position: data["in"] || 0,
+        "in": data["in"] || 0,
+        position: 0,
         duration: data.duration,
         aspectratio: data.aspectratio
     })
@@ -85,16 +86,10 @@ function renderItem(data) {
     video.addEventListener("loadedmetadata", event => {
         //
     })
-    video.addEventListener("timeupdate", event => {
+
-        var currentTime = video.currentTime()
+    function updateAnnotations(currentTime) {
-        if (currentTime >= data['out']) {
-            if (!video.paused) {
-                video.pause()
-            }
-            video.currentTime(data['in'])
-        }
         div.querySelectorAll('.annotation').forEach(annot => {
-            var now = currentTime
+            var now = currentTime +  (data["in"] || 0)
             var start = parseFloat(annot.dataset.in)
             var end = parseFloat(annot.dataset.out)
             if (now >= start && now <= end) {
@@ -107,8 +102,18 @@ function renderItem(data) {
                 }
             }
         })
-
+    }
+    video.addEventListener("timeupdate", event => {
+        var currentTime = video.currentTime()
+        if ((currentTime  +  (data["in"] || 0)) >= data['out']) {
+            if (!video.paused) {
+                video.pause()
+            }
+            video.currentTime(0)
+        }
+        updateAnnotations(currentTime)
     })
+    updateAnnotations(data["position"] || 0)
     if (item.next || item.previous) {
         var nav = document.createElement('nav')
         nav.classList.add('items')