File replay ui update for backend chanages

SauceLLC · Apr 18, 2024 · f4ed792 · f4ed792
1 parent ca0c650
commit f4ed792
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 7 deletions.
diff --git a/pages/file-replay.html b/pages/file-replay.html
@@ -37,10 +37,12 @@
             <div class="category">Load activity <i>(i.e. .fit file)</i>:</div>
             <input type="file" name="activity" accept=".fit"/>
             <div class="button-group">
+                <div class="std button disabled" data-call="fileReplayRewind" data-args="[1e20]"><ms>skip_previous</ms></div>
                 <div class="std button disabled" data-call="fileReplayRewind"><ms>fast_rewind</ms></div>
                 <div class="std button negative disabled" data-call="fileReplayStop"><ms>stop_circle</ms></div>
                 <div class="std button positive disabled" data-call="fileReplayPlay"><ms>play_circle</ms></div>
                 <div class="std button disabled" data-call="fileReplayForward"><ms>fast_forward</ms></div>
+                <div class="std button disabled" data-call="fileReplayForward" data-args="[1e20]"><ms>skip_next</ms></div>
             </div>
             <div class="category">Time code:</div>
             <div class="timecode">mm:ss.---</div>

diff --git a/pages/src/file-replay.mjs b/pages/src/file-replay.mjs
@@ -7,13 +7,12 @@ let playing;
 let timecodeOffset;
 let timecode;
 
+
 const _timeCodeEl = document.querySelector('.timecode');
 function drawTimeCode() {
     requestAnimationFrame(drawTimeCode);
-    if (!playing) {
-        return;
-    }
-    const ts = timecode + ((Date.now() - timecodeOffset) / 1000);
+    const realTimeAdjust = playing ? (Date.now() - timecodeOffset) / 1000 : 0;
+    const ts = timecode + realTimeAdjust;
     _timeCodeEl.innerHTML = locale.human.timer(ts, {ms: true, long: true});
 }
 
@@ -46,10 +45,10 @@ export async function main() {
         const args = btn.dataset.args ? JSON.parse(btn.dataset.args) : [];
         common.rpc[btn.dataset.call](...args);
     });
-    common.subscribe('file-replay-timesync', ts => {
+    common.subscribe('file-replay-timesync', ev => {
         timecodeOffset = Date.now();
-        timecode = ts;
-        playing = ts !== null;
+        timecode = ev.time;
+        playing = ev.playing;
     });
     const status = await common.rpc.fileReplayStatus();
     if (status === 'playing') {