mici raylib ui diff report for PR #36792

Author: GitHub Actions Bot

diff_pr_36792.html

@@ -0,0 +1,58 @@
+<h2>UI Diff</h2>
+<table>
+<tr>
+<td width='33%'>
+  <p><strong>Video 1</strong></p>
+  <video id='video1' width='100%' autoplay muted loop onplay='syncVideos()'>
+    <source src='https://github.com/commaai/ci-artifacts/raw/refs/heads/openpilot/pr-36792-mici-raylib-ui/mici_ui_replay_master.mp4' type='video/mp4'>
+    Your browser does not support the video tag.
+  </video>
+</td>
+<td width='33%'>
+  <p><strong>Video 2</strong></p>
+  <video id='video2' width='100%' autoplay muted loop onplay='syncVideos()'>
+    <source src='https://github.com/commaai/ci-artifacts/raw/refs/heads/openpilot/pr-36792-mici-raylib-ui/mici_ui_replay_proposed.mp4' type='video/mp4'>
+    Your browser does not support the video tag.
+  </video>
+</td>
+<td width='33%'>
+  <p><strong>Pixel Diff</strong></p>
+  <video id='diffVideo' width='100%' autoplay muted loop>
+    <source src='https://github.com/commaai/ci-artifacts/raw/refs/heads/openpilot/pr-36792-mici-raylib-ui/diff.mp4' type='video/mp4'>
+    Your browser does not support the video tag.
+  </video>
+</td>
+</tr>
+</table>
+<script>
+function syncVideos() {
+  const video1 = document.getElementById('video1');
+  const video2 = document.getElementById('video2');
+  const diffVideo = document.getElementById('diffVideo');
+  video1.currentTime = video2.currentTime = diffVideo.currentTime;
+}
+video1.addEventListener('timeupdate', () => {
+  if (Math.abs(video1.currentTime - video2.currentTime) > 0.1) {
+    video2.currentTime = video1.currentTime;
+  }
+  if (Math.abs(video1.currentTime - diffVideo.currentTime) > 0.1) {
+    diffVideo.currentTime = video1.currentTime;
+  }
+});
+video2.addEventListener('timeupdate', () => {
+  if (Math.abs(video2.currentTime - video1.currentTime) > 0.1) {
+    video1.currentTime = video2.currentTime;
+  }
+  if (Math.abs(video2.currentTime - diffVideo.currentTime) > 0.1) {
+    diffVideo.currentTime = video2.currentTime;
+  }
+});
+diffVideo.addEventListener('timeupdate', () => {
+  if (Math.abs(diffVideo.currentTime - video1.currentTime) > 0.1) {
+    video1.currentTime = diffVideo.currentTime;
+    video2.currentTime = diffVideo.currentTime;
+  }
+});
+</script>
+<hr>
+<p><strong>Results:</strong> ✅ Videos are identical! (180 frames)</p>