pict-converter now export datetime correctly (some pictures don't have right datetime in exif, why ?

www/pict-converter.sh

@@ -53,9 +53,9 @@ function convert {
     # SRC
     src="${pict/public_html\/pictures\//}"
     # TIME
-    time="${pict/public_html\/pictures\/hehe-/}"
-    time="${time/.jpg/}"
-    # time=`exiftool 2>/dev/null -S --DateTimeOriginal -p '$DateTimeOriginal' -d %Y/%m/%d-%T "$pict"`
+    # time="${pict/public_html\/pictures\/hehe-/}"
+    # time="${time/.jpg/}"
+    time=`exiftool 2>/dev/null -S --DateTimeOriginal -p '$DateTimeOriginal' -d %Y-%m-%dT%T "$pict"`
     # GPS
     gps=`exiftool 2>/dev/null -n -p '$GPSLatitude,$GPSLongitude' $pict`
 

www/public_html/index.php

@@ -14,7 +14,7 @@
         <h1>Lot Explorer</h1>
       </header>
       <section id="pictures">
-        <video autoplay poster="">
+        <video id="video" autoplay poster="">
           <!-- <source class="240p" src="videos/timelaps-240p.mp4" type="video/mp4">
           <source class="360p" src="videos/timelaps-360p.mp4" type="video/mp4">
           <source class="480p" src="videos/timelaps-480p.mp4" type="video/mp4">

www/public_html/js/script.js

@@ -1,6 +1,7 @@
 $(document).ready(function() {
 
-  var _timeline, _timeline_container = document.getElementById('timeline'), _tl_data_ar;
+  var _video = document.getElementById('video'), _fps = 24;
+  var _timeline, _timeline_container = document.getElementById('timeline'), _tl_data_ar=[], _tl_items;
 
   function init(){
     console.log("Init");
@@ -10,7 +11,7 @@ $(document).ready(function() {
     //   play();
     // }, 5000);
     getMetaData();
-    setupTimeline();
+    // setupTimeline();
   };
 
   function getMetaData(){
@@ -28,37 +29,45 @@ $(document).ready(function() {
 
   function setUpData(data){
     console.log("setUpData");
-    console.log("data", data);
+    // console.log("data", data);
 
     var frame;
     for (var i in data.frames) {
       console.log(data.frames[i]);
       _tl_data_ar.push({
-        start:data.frames[i],
-        end:,
+        start:new Date(data.frames[i].time),
+        id:data.frames[i].frame
       });
     }
+
+    setupTimeline();
   };
 
   function setupTimeline(){
 
     // Create a DataSet (allows two way data-binding)
-    var items = new vis.DataSet([
-      {id: 1, content: 'item 1', start: '2016-06-20'},
-      {id: 2, content: 'item 2', start: '2016-06-14'},
-      {id: 3, content: 'item 3', start: '2016-06-18'},
-      {id: 4, content: 'item 4', start: '2016-06-16', end: '2015-06-19'},
-      {id: 5, content: 'item 5', start: '2016-06-25'},
-      {id: 6, content: 'item 6', start: '2016-06-27', type: 'point'}
-    ]);
+    _tl_items = new vis.DataSet(_tl_data_ar);
 
     // Configuration for the Timeline
     // var options = {};
 
     // Create a Timeline
-    _timeline = new vis.Timeline(_timeline_container, items, {});
+    _timeline = new vis.Timeline(_timeline_container, _tl_items, {});
+
+    _timeline.on('select', onSelectTimelineItem)
   }
 
+  function onSelectTimelineItem(props){
+    console.log("onSelectTimelineItem", props);
+    seekVideoTo(props.items[0]);
+  };
+
+  function seekVideoTo(f){
+    console.log("seekVideoTo frame", f);
+    _video.pause();
+    _video.currentTime = f/_fps;
+  };
+
   function play(millis){
     requestAnimationFrame(play);