Show a real flight on /low-latency, drone and pilot's screen side by side

data/locales/pages.en.yml

@@ -457,6 +457,31 @@ en:
       credits_title: Standing on open shoulders
       cta_chat: Join the FPV chat
       cta_guide: Read the build guide
+      flight_copy: H.264 copy
+      flight_credit_html: Flight and both recordings by <a href="https://github.com/gilankpam">gilankpam</a>, flying <a href="https://github.com/gilankpam/mabur">mabur</a> — an SSC338Q air unit transmitting through OpenIPC's devourer driver on an RTL8812EU.
+      flight_error: This browser cannot play the stream
+      flight_flicker: Flicker
+      flight_frame_back: Previous frame
+      flight_frame_forward: Next frame
+      flight_fullscreen: Full screen
+      flight_gs: On the pilot's screen
+      flight_handle: Divider between the two recordings
+      flight_latency_html: The figures along the bottom of the right side are the link's own telemetry, drawn live by the ground station. <code>lat</code> is the latency mabur measures across the link, in milliseconds; beside it are signal strength, modulation and loss.
+      flight_lede: Six minutes of one real flight, recorded twice. Left of the line is what the drone recorded on board, 1080p at 60 frames per second and 19 Mbit/s. Right of it is what reached the pilot's screen over the radio link, at about 5 Mbit/s on air. Drag the line, or switch to flicker, and compare the same frame.
+      flight_loading: Loading…
+      flight_note: Each side adapts to your connection on its own, and its badge says when it is showing less than its recording. Tick Original quality to compare the recordings themselves. The ground station's side was re-encoded at 8 Mbit/s when it was saved, so it is a little softer than the pilot's live picture.
+      flight_onboard: On the drone
+      flight_open_rnd: Open in R&D Player
+      flight_original: Original quality
+      flight_pause: Pause
+      flight_play: Play
+      flight_reduced: reduced
+      flight_seek: Position in the flight
+      flight_split: Split
+      flight_stat_duration: minutes of flight, start to finish, nothing cut
+      flight_stat_holds: pauses longer than 50 ms in the whole flight; the longest held one picture for {ms} ms
+      flight_stat_shown: of the frames reached the pilot's screen; the rest were each replaced by the frame before
+      flight_title: A real flight, frame by frame
       fpv_text: 'A fully open digital FPV system: no locked ecosystem, no paired hardware, no firmware ceiling. Build the air unit from a supported camera, pick your ground station, and tune every stage of the pipeline.'
       fpv_title: 'FPV: from lens to goggles'
       hardware_text_html: Air units are built from supported cameras and AIO boards — start from the <a href="/supported-hardware">supported hardware list</a>. RunCam and other vendors ship OpenIPC-based FPV hardware out of the box.

data/locales/pages.ru.yml

@@ -495,6 +495,31 @@ ru:
       credits_title: Стоим на открытых плечах
       cta_chat: FPV-чат
       cta_guide: Гайд по сборке
+      flight_copy: копия H.264
+      flight_credit_html: 'Полёт и обе записи — <a href="https://github.com/gilankpam">gilankpam</a>, борт на <a href="https://github.com/gilankpam/mabur">mabur</a>: SSC338Q, передача через драйвер devourer от OpenIPC на RTL8812EU.'
+      flight_error: Этот браузер не может воспроизвести поток
+      flight_flicker: Мерцание
+      flight_frame_back: Предыдущий кадр
+      flight_frame_forward: Следующий кадр
+      flight_fullscreen: Во весь экран
+      flight_gs: На экране пилота
+      flight_handle: Граница между двумя записями
+      flight_latency_html: Цифры внизу справа — собственная телеметрия линка, которую наземная станция рисует на лету. <code>lat</code> — задержка через линк по замеру mabur, в миллисекундах; рядом уровень сигнала, модуляция и потери.
+      flight_lede: Шесть минут одного настоящего полёта, записанные дважды. Слева от линии — запись на борту дрона, 1080p, 60 кадров в секунду, 19 Мбит/с. Справа — то, что дошло до экрана пилота по радиолинку, около 5 Мбит/с в эфире. Двигайте линию или включите мерцание и сравнивайте один и тот же кадр.
+      flight_loading: Загрузка…
+      flight_note: Каждая сторона подстраивается под ваше соединение сама, и значок говорит, когда она показывает меньше, чем в записи. Включите «Исходное качество», чтобы сравнивать сами записи. Запись наземной станции при сохранении перекодирована в 8 Мбит/с, поэтому она чуть мягче живой картинки у пилота.
+      flight_onboard: На борту дрона
+      flight_open_rnd: Открыть в R&D Player
+      flight_original: Исходное качество
+      flight_pause: Пауза
+      flight_play: Смотреть
+      flight_reduced: снижено
+      flight_seek: Позиция в полёте
+      flight_split: Шторка
+      flight_stat_duration: минут полёта, от взлёта до конца, без монтажа
+      flight_stat_holds: пауз дольше 50 мс за весь полёт; самая долгая задержала картинку на {ms} мс
+      flight_stat_shown: кадров дошли до экрана пилота; каждый из остальных заменён предыдущим кадром
+      flight_title: Настоящий полёт, кадр за кадром
       fpv_text: 'Полностью открытая цифровая FPV-система: никакой закрытой экосистемы, никакого спаренного железа, никакого потолка прошивки. Соберите борт из поддерживаемой камеры, выберите наземную станцию и настройте каждый этап конвейера.'
       fpv_title: 'FPV: от объектива до очков'
       hardware_text_html: Борт собирается из поддерживаемых камер и AIO-плат — начните со <a href="/supported-hardware">списка поддерживаемого оборудования</a>. RunCam и другие вендоры выпускают FPV-железо на OpenIPC из коробки.

data/locales/pages.zh.yml

@@ -457,6 +457,31 @@ zh:
       credits_title: 站在开放的肩膀上
       cta_chat: 加入 FPV 聊天群
       cta_guide: 阅读搭建指南
+      flight_copy: H.264 副本
+      flight_credit_html: 飞行与两段录像均来自 <a href="https://github.com/gilankpam">gilankpam</a>，机载端使用 <a href="https://github.com/gilankpam/mabur">mabur</a>：SSC338Q 天空端，经 OpenIPC 的 devourer 驱动在 RTL8812EU 上发射。
+      flight_error: 此浏览器无法播放该视频流
+      flight_flicker: 闪烁对比
+      flight_frame_back: 上一帧
+      flight_frame_forward: 下一帧
+      flight_fullscreen: 全屏
+      flight_gs: 飞手屏幕上
+      flight_handle: 两段录像之间的分隔线
+      flight_latency_html: 右侧底部的数字是链路自己的遥测，由地面站实时绘制。<code>lat</code> 是 mabur 测得的链路延迟（毫秒），旁边是信号强度、调制方式和丢包。
+      flight_lede: 一次真实飞行的六分钟，录了两遍。分隔线左边是无人机机载录制：1080p、每秒 60 帧、19 Mbit/s。右边是经无线链路到达飞手屏幕的画面，空中码率约 5 Mbit/s。拖动分隔线或切换到闪烁对比，比较同一帧。
+      flight_loading: 加载中…
+      flight_note: 两侧各自根据你的网络自适应，角标会提示某一侧低于原始录像。勾选“原始画质”即可比较录像本身。地面站一侧保存时以 8 Mbit/s 重新编码过，因此比飞手实时看到的画面略软。
+      flight_onboard: 无人机机载
+      flight_open_rnd: 在 R&D Player 中打开
+      flight_original: 原始画质
+      flight_pause: 暂停
+      flight_play: 播放
+      flight_reduced: 已降低
+      flight_seek: 飞行中的位置
+      flight_split: 分屏
+      flight_stat_duration: 分钟飞行，从头到尾，未剪辑
+      flight_stat_holds: 次超过 50 毫秒的停顿（整次飞行）；最长一次画面停留 {ms} 毫秒
+      flight_stat_shown: 的帧到达了飞手屏幕；其余每一帧都由前一帧代替
+      flight_title: 一次真实飞行，逐帧对比
       fpv_text: '一套完全开放的数字 FPV 系统：没有封闭生态，没有配对绑定的硬件，也没有固件上限。用受支持的摄像机搭建天空端，挑选你的地面站，并可调节管线的每一个环节。'
       fpv_title: 'FPV：从镜头到眼镜'
       hardware_text_html: 天空端由受支持的摄像机和 AIO 板搭建——请从<a href="/supported-hardware">支持硬件列表</a>开始。RunCam 等厂商出厂即提供基于 OpenIPC 的 FPV 硬件。

deploy/RESTORE.md

@@ -310,6 +310,12 @@ Only needed on a rebuilt host:
 - `/srv/www/shared/wall` — the wall's images. **Not** in the backup; the Open
   Wall is empty until cameras re-upload, so an empty directory owned by uid
   1000 is a complete restore.
+- `/srv/www/shared/media` — the recorded flight the A/B player on
+  `/low-latency` streams. **Not** in the backup: about 2.5 GB, rebuilt from the
+  two source recordings by `tools/flight-ab/run.sh` and uploaded as its README
+  says. The sources are on this host too (`/srv/www/flight-sources/`, not in
+  S3), so a rebuilt host needs them from wherever else they were kept. Until then the page shows its poster and the player says it cannot
+  play.
 - **analytics**, via `deploy/install-analytics.sh` (#181). It installs
   GoatCounter, its account and its systemd unit, and creates the site on first
   run from `ANALYTICS_EMAIL` and `ANALYTICS_PASSWORD`. The SQLite database is

deploy/nginx/check-config.sh

@@ -191,6 +191,10 @@ ln -s site-test /srv/www/static/prod/current
 printf 'TOKEN-OK\n' > /var/lib/dehydrated/acme-challenges/probe-token
 install -d -m 0755 /srv/www/shared/images
 printf 'PNG\n' > /srv/www/shared/images/logo_openipc.png
+# A recorded flight for the A/B player on /low-latency (tools/flight-ab).
+install -d -m 0755 /srv/www/shared/media/flights/test/v1/gs/original
+printf '<MPD/>\n' > /srv/www/shared/media/flights/test/v1/gs.mpd
+printf '0123456789' > /srv/www/shared/media/flights/test/v1/gs/original/1.m4s
 
 # A second loopback address stands in for a datacentre client, so the block
 # and CI's way through it are measured rather than read off the map.
@@ -440,6 +444,30 @@ expect_cache /no-such-page-at-all   "no-cache"
 expect /fonts/ibm-plex-sans-latin-400-normal.woff2 200 static hsts
 expect_cache /fonts/ibm-plex-sans-latin-400-normal.woff2 "public, max-age=31536000, immutable"
 expect /assets/application.css      410 -      no-hsts
+
+# Recorded flights (tools/flight-ab): versioned directories never rewritten, so
+# a year of cache; the types DASH players insist on; ranges, which a player
+# may ask for; and CORS for the R&D Player's origin and nobody else's.
+expect /media/flights/test/v1/gs.mpd 200 -      hsts
+expect_cache /media/flights/test/v1/gs.mpd "public, max-age=31536000, immutable"
+media_header() {
+  path=$1; header=$2; want=$3; shift 3
+  curl -sS -o /dev/null -D /tmp/hm -k --max-time 5 "$@" \
+    --resolve "openipc.org:443:127.0.0.1" "https://openipc.org$path" >/dev/null 2>&1
+  if [ "$header" = status ]; then got=$(awk 'NR==1{print $2}' /tmp/hm)
+  else got=$(grep -i "^$header:" /tmp/hm | tr -d '\r' | cut -d' ' -f2- | head -1); fi
+  if [ "$got" = "$want" ]; then
+    printf '  %-32s %s: %s\n' "$path" "$header" "$got"
+  else
+    printf '  %-32s MISMATCH: %s is %s (want %s)\n' "$path" "$header" "${got:-<none>}" "$want"
+    fail=1
+  fi
+}
+media_header /media/flights/test/v1/gs.mpd content-type application/dash+xml
+media_header /media/flights/test/v1/gs/original/1.m4s content-type video/iso.segment
+media_header /media/flights/test/v1/gs/original/1.m4s status 206 -H 'Range: bytes=2-5'
+media_header /media/flights/test/v1/gs.mpd access-control-allow-origin https://openipc.github.io
+expect /media/flights/test/v1/none.mpd 404 -     no-hsts
 # The home page keeps its address when its content changes, like every other
 # page in the bundle, so it may be cached and must always be revalidated.
 expect_cache /                      "public, max-age=0, must-revalidate"

deploy/nginx/sites-available/org.openipc

@@ -202,6 +202,32 @@ server {
         alias /srv/www/shared/images/;
     }
 
+    # Recorded flights, streamed as DASH by the A/B player on /low-latency
+    # (tools/flight-ab). Each flight is one versioned directory that is never
+    # rewritten -- a new cut is a new v<N>/ -- so a year of immutable cache is
+    # safe. Host-only and in no backup: the tree is regenerated from the two
+    # source recordings by tools/flight-ab/run.sh.
+    #
+    # The CORS header is for one origin only, the R&D Player's, which the page
+    # offers as "open in R&D Player" and which fetches the manifests and
+    # segments cross-origin. Both players fetch a segment per stream at a
+    # time, well inside the http-level per_subnet twenty.
+    location ^~ /media/ {
+        alias /srv/www/shared/media/;
+        types {
+            application/dash+xml mpd;
+            video/iso.segment m4s;
+            video/mp4 mp4;
+            application/json json;
+            image/jpeg jpg;
+        }
+        add_header Strict-Transport-Security max-age=15768000;
+        add_header X-Content-Type-Options nosniff always;
+        add_header Access-Control-Allow-Origin https://openipc.github.io always;
+        # Not `always`: a 404 cached for a year would outlive the upload.
+        add_header Cache-Control "public, max-age=31536000, immutable";
+    }
+
     # Analytics beacon (#181). GoatCounter runs on the loopback and these are
     # the only two paths of it the public site exposes.
     #

deploy/nginx/sites-available/org.openipc.dev

@@ -772,6 +772,33 @@ server {
     }
 
 
+    # Recorded flights, streamed as DASH by the A/B player on /low-latency
+    # (tools/flight-ab). Each flight is one versioned directory that is never
+    # rewritten -- a new cut is a new v<N>/ -- so a year of immutable cache is
+    # safe. Host-only and in no backup: the tree is regenerated from the two
+    # source recordings by tools/flight-ab/run.sh.
+    #
+    # The CORS header is for one origin only, the R&D Player's, which the page
+    # offers as "open in R&D Player" and which fetches the manifests and
+    # segments cross-origin. Both players fetch a segment per stream at a
+    # time, well inside the http-level per_subnet twenty.
+    location ^~ /media/ {
+        alias /srv/www/shared/media/;
+        types {
+            application/dash+xml mpd;
+            video/iso.segment m4s;
+            video/mp4 mp4;
+            application/json json;
+            image/jpeg jpg;
+        }
+        add_header Strict-Transport-Security max-age=15768000;
+        add_header X-Content-Type-Options nosniff always;
+        add_header Access-Control-Allow-Origin https://openipc.github.io always;
+        # Not `always`: a 404 cached for a year would outlive the upload.
+        add_header Cache-Control "public, max-age=31536000, immutable";
+        add_header X-Robots-Tag "noindex, nofollow, noarchive" always;
+    }
+
     # The Go firmware process's image cache (#299): one version of each image,
     # built on first request. Reachable only through its X-Accel-Redirect.
     location /firmware-cache/ {

deploy/static/reserved-paths

@@ -54,6 +54,8 @@
 /board-files/
 # Owner reports' files, internal: reached only through the web role's X-Accel-Redirect for a published report.
 /report-files/
+# Recorded flights for the A/B player on /low-latency (tools/flight-ab), host-only.
+/media/
 
 # --- the expensive leaf ------------------------------------------------------
 # /cameras/ is deliberately NOT reserved: the catalogue is exactly what #162

frontend/apps/site/package.json

@@ -18,7 +18,8 @@
   "dependencies": {
     "@openipc/ui": "*",
     "d3-hierarchy": "^3.1.2",
-    "preact": "10.27.2"
+    "preact": "10.27.2",
+    "shaka-player": "^4.16.51"
   },
   "devDependencies": {
     "@astrojs/check": "^0.9.4",