thrimbletrimmer: Update bustime/UTC values when you switch

so if you change one it changes the other.

Also in general takes those conversions and makes them available as functions for re-use.

thrimbletrimmer/index.html

@@ -127,11 +127,13 @@
         }
         function toggleTimeInput(toggleInput) {
             if(toggleInput == "UTC") {
+                setStreamRange();
                 document.getElementById("BusTimeStart").style.display = "none";
                 document.getElementById("BusTimeEnd").style.display = "none";
                 document.getElementById("StreamStart").style.display = "";
                 document.getElementById("StreamEnd").style.display = "";
             } else {
+                setBustimeRange();
                 document.getElementById("StreamStart").style.display = "none";
                 document.getElementById("StreamEnd").style.display = "none";
                 document.getElementById("BusTimeStart").style.display = "";

thrimbletrimmer/scripts/IO.js

@@ -9,19 +9,19 @@ pageSetup = function() {
                 alert("No video available for stream.");
                 return;
             }
-            //data = testThrimShim;
             desertBusStart = new Date(data.bustime_start);
             document.getElementById("VideoTitlePrefix").value = data.title_prefix;
             document.getElementById("VideoTitle").setAttribute("maxlength", data.title_max_length);
 
             document.getElementById("hiddenSubmissionID").value = data.id;
             document.getElementById("StreamName").value = data.video_channel ? data.video_channel:document.getElementById("StreamName").value;
+            // set stream start/end, then copy to bustime inputs
             document.getElementById("StreamStart").value = data.event_start;
-            document.getElementById("BusTimeStart").value = (new Date(data.event_start+"Z") < desertBusStart ? "-":"") + videojs.formatTime(Math.abs((new Date(data.event_start+"Z") - desertBusStart)/1000), 600.01).padStart(7, "0:");
             document.getElementById("StreamEnd").value = data.event_end;
-            document.getElementById("BusTimeEnd").value = (new Date(data.event_end+"Z") < desertBusStart ? "-":"") + videojs.formatTime(Math.abs((new Date(data.event_end+"Z") - desertBusStart)/1000), 600.01).padStart(7, "0:");
+            setBustimeRange();
-            document.getElementById("VideoTitle").value = data.video_title ? data.video_title:document.getElementById("VideoTitle").value;
+            // title and description both default to row description
-            document.getElementById("VideoDescription").value = data.video_description ? data.video_description:data.description;
+            document.getElementById("VideoTitle").value = data.video_title ? data.video_title : data.description;
+            document.getElementById("VideoDescription").value = data.video_description ? data.video_description : data.description;
 
             loadPlaylist(data.video_start, data.video_end);
         });
@@ -37,20 +37,38 @@ pageSetup = function() {
     }
 };
 
+timestampToBustime = function(ts) {
+    date = new Date(ts + "Z");
+    return (date < desertBusStart ? "-":"") + videojs.formatTime(Math.abs((date - desertBusStart)/1000), 600.01).padStart(7, "0:");
+};
+
+bustimeToTimestamp = function(bustime) {
+    direction = 1;
+    if(bustime.startsWith("-")) {
+        bustime = bustime.slice(1);
+        direction = -1;
+    }
+    parts = bustime.split(':')
+    bustime_ms = (parseInt(parts[0]) + parts[1]/60 + parts[2]/3600) * 1000 * 60 * 60;
+    return new Date(desertBusStart.getTime() + direction * bustime_ms).toISOString().substring(0, 19);
+};
+
+setBustimeRange = function() {
+    document.getElementById("BusTimeStart").value = timestampToBustime(document.getElementById("StreamStart").value);
+    document.getElementById("BusTimeEnd").value = timestampToBustime(document.getElementById("StreamEnd").value);
+};
+
+setStreamRange = function() {
+    document.getElementById("StreamStart").value = bustimeToTimestamp(document.getElementById("BusTimeStart").value);
+    document.getElementById("StreamEnd").value = bustimeToTimestamp(document.getElementById("BusTimeEnd").value);
+}
+
 loadPlaylist = function(startTrim, endTrim) {
     var playlist = "/playlist/" + document.getElementById("StreamName").value + ".m3u8";
 
+    // If we're using bustime, update stream start/end from it first
     if(document.getElementById("BusTimeToggleBus").checked) {
-        var streamStart = desertBusStart;
+        setStreamRange();
-        var busTimeStart = document.getElementById("BusTimeStart").value;
-        var busTimeEnd = document.getElementById("BusTimeEnd").value;
-        
-        //Convert BusTime to milliseconds from start of stream
-        busTimeStart = (parseInt(busTimeStart.split(':')[0]) + busTimeStart.split(':')[1]/60)  * 1000 * 60 * 60;
-        busTimeEnd = (parseInt(busTimeEnd.split(':')[0]) + busTimeEnd.split(':')[1]/60)  * 1000 * 60 * 60;
-        
-        document.getElementById("StreamStart").value = new Date(streamStart.getTime() + busTimeStart).toISOString().substring(0,19);
-        document.getElementById("StreamEnd").value = new Date(streamStart.getTime() + busTimeEnd).toISOString().substring(0,19);
     }
 
     var streamStart = document.getElementById("StreamStart").value ? "start="+document.getElementById("StreamStart").value:null;