From bcc1e9f2183db80cd3a4dcc421c91fec4dd8fc56 Mon Sep 17 00:00:00 2001
From: Paul Horn <dev@knutwalker.engineer>
Date: Sat, 18 Jul 2026 23:08:57 +0200
Subject: [PATCH] Add option to share split times to YouTube or LosslessCut

---
 src/css/ShareTimes.module.css    | 114 ++++++++
 src/ui/LiveSplit.tsx             |  22 ++
 src/ui/components/TextBox.tsx    |   6 +
 src/ui/views/ShareTimes.tsx      | 313 ++++++++++++++++++++
 src/ui/views/SplitsSelection.tsx |  11 +
 src/util/ShareTimes.ts           | 488 +++++++++++++++++++++++++++++++
 6 files changed, 954 insertions(+)
 create mode 100644 src/css/ShareTimes.module.css
 create mode 100644 src/ui/views/ShareTimes.tsx
 create mode 100644 src/util/ShareTimes.ts

diff --git a/src/css/ShareTimes.module.css b/src/css/ShareTimes.module.css
new file mode 100644
index 00000000..48d34f46
--- /dev/null
+++ b/src/css/ShareTimes.module.css
@@ -0,0 +1,114 @@
+.shareTimes {
+    display: flex;
+    padding: var(--ui-large-margin);
+
+    :global(.is-mobile) & {
+        width: 100%;
+        box-sizing: border-box;
+    }
+}
+
+.form {
+    display: flex;
+    flex-direction: column;
+    gap: var(--ui-large-margin);
+    width: 100%;
+    max-width: 480px;
+}
+
+.field {
+    display: flex;
+    flex-direction: column;
+    gap: var(--ui-margin);
+}
+
+.label {
+    font-weight: bold;
+}
+
+.runSelect {
+    width: 100%;
+    height: 40px;
+    box-sizing: border-box;
+    padding: 0 6px;
+    appearance: none;
+    background: var(--button-middle-color);
+    border: 1px solid var(--border-color);
+    border-radius: 5px;
+    color: var(--button-text-color);
+    cursor: pointer;
+    font-family: "fira", sans-serif;
+    font-size: 20px;
+    text-align: left;
+    text-overflow: ellipsis;
+}
+
+.offsetRow {
+    display: flex;
+    gap: var(--ui-margin);
+    align-items: flex-end;
+    width: 100%;
+}
+
+.offsetCell {
+    flex: 5 1 0;
+    min-width: 0;
+}
+
+.fpsCell {
+    flex: 1 1 0;
+    min-width: 0;
+}
+
+.error {
+    color: #e46;
+    font-size: 0.9em;
+}
+
+.warning {
+    color: #e9a13b;
+    font-size: 0.9em;
+}
+
+.timingMethod {
+    opacity: 0.7;
+}
+
+.hidden {
+    visibility: hidden;
+}
+
+.activeTab {
+    box-shadow: inset 3px 0 0 var(--button-text-color);
+    font-weight: bold;
+}
+
+.buttons {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: var(--ui-margin);
+
+    button {
+        margin: 0;
+    }
+}
+
+.youtube {
+    display: flex;
+    flex-direction: column;
+    gap: var(--ui-margin);
+}
+
+.youtubeText {
+    width: 100%;
+    box-sizing: border-box;
+    resize: vertical;
+    font-family: var(--fira, monospace);
+    white-space: pre;
+}
+
+.copyButton {
+    align-self: flex-start;
+    margin: 0;
+}
diff --git a/src/ui/LiveSplit.tsx b/src/ui/LiveSplit.tsx
index eb87b8e4..1c0ac0d8 100644
--- a/src/ui/LiveSplit.tsx
+++ b/src/ui/LiveSplit.tsx
@@ -42,6 +42,7 @@ import {
 import { TimerView } from "./views/TimerView";
 import { About } from "./views/About";
 import { SplitsSelection, EditingInfo } from "./views/SplitsSelection";
+import { ShareTimes, ShareTimesInfo } from "./views/ShareTimes";
 import { LayoutView } from "./views/LayoutView";
 import { ToastContainer, toast } from "react-toastify";
 import * as Storage from "../storage";
@@ -99,6 +100,7 @@ export enum MenuKind {
     Timer,
     Splits,
     RunEditor,
+    ShareTimes,
     Layout,
     LayoutEditor,
     MainSettings,
@@ -119,6 +121,7 @@ type Menu =
     | { kind: MenuKind.Timer }
     | { kind: MenuKind.Splits }
     | { kind: MenuKind.RunEditor; editor: RunEditor; splitsKey?: number }
+    | { kind: MenuKind.ShareTimes; run: Run; splitsKey?: number }
     | { kind: MenuKind.Layout }
     | { kind: MenuKind.LayoutEditor; editor: LayoutEditor }
     | { kind: MenuKind.MainSettings; config: HotkeyConfig }
@@ -478,6 +481,10 @@ export class LiveSplit extends React.Component<Props, State> {
                     splitsModified={this.state.splitsModified}
                 />
             );
+        } else if (this.state.menu.kind === MenuKind.ShareTimes) {
+            view = (
+                <ShareTimes run={this.state.menu.run} callbacks={this} />
+            );
         } else if (this.state.menu.kind === MenuKind.Timer) {
             view = (
                 <TimerView
@@ -772,6 +779,21 @@ export class LiveSplit extends React.Component<Props, State> {
         this.openSplitsView();
     }
 
+    public openShareTimes({ splitsKey, run }: ShareTimesInfo) {
+        this.changeMenu({ kind: MenuKind.ShareTimes, run, splitsKey });
+    }
+
+    public closeShareTimes() {
+        if (this.state.menu.kind !== MenuKind.ShareTimes) {
+            panic(
+                "No Share Times view to close",
+                this.state.generalSettings.lang,
+            );
+        }
+        this.state.menu.run[Symbol.dispose]();
+        this.openSplitsView();
+    }
+
     public setSplitsKey(openedSplitsKey?: number) {
         this.setState({
             openedSplitsKey,
diff --git a/src/ui/components/TextBox.tsx b/src/ui/components/TextBox.tsx
index c6a36ffb..97b9f76f 100644
--- a/src/ui/components/TextBox.tsx
+++ b/src/ui/components/TextBox.tsx
@@ -10,6 +10,8 @@ export function TextBox({
     label,
     invalid,
     list,
+    disabled,
+    placeholder,
 }: {
     className?: string;
     value?: string | number | readonly string[];
@@ -18,6 +20,8 @@ export function TextBox({
     label: string;
     invalid?: boolean;
     list?: [string, string[]];
+    disabled?: boolean;
+    placeholder?: string;
 }) {
     let outerClassName = classes.group;
     if (invalid) {
@@ -43,6 +47,8 @@ export function TextBox({
                 list={name}
                 type="text text-box"
                 required
+                disabled={disabled}
+                placeholder={placeholder}
                 className={className}
                 value={value}
                 onChange={onChange}
diff --git a/src/ui/views/ShareTimes.tsx b/src/ui/views/ShareTimes.tsx
new file mode 100644
index 00000000..24e17a0b
--- /dev/null
+++ b/src/ui/views/ShareTimes.tsx
@@ -0,0 +1,313 @@
+import React, { useMemo, useState } from "react";
+import { toast } from "react-toastify";
+import { ArrowLeft, Clipboard, Download, ListVideo, Scissors } from "lucide-react";
+
+import { Run, RunRef, TimingMethod } from "../../livesplit-core";
+import { TextBox } from "../components/TextBox";
+import { exportFile } from "../../util/FileUtil";
+import {
+    buildRows,
+    buildSelectionEntries,
+    chooseTimingMethod,
+    formatFps,
+    parseYoutubeOffset,
+    resolveLosslessCutOffset,
+    rowsToFramesCsv,
+    rowsToYoutube,
+    CsvSource,
+} from "../../util/ShareTimes";
+
+import classes from "../../css/ShareTimes.module.css";
+
+type Tab = "youtube" | "losslesscut";
+
+export interface ShareTimesInfo {
+    splitsKey?: number;
+    run: Run;
+}
+
+interface Callbacks {
+    renderViewWithSidebar(
+        renderedView: React.JSX.Element,
+        sidebarContent: React.JSX.Element,
+    ): React.JSX.Element;
+    closeShareTimes(): void;
+}
+
+export function ShareTimes({
+    run,
+    callbacks,
+}: {
+    run: RunRef;
+    callbacks: Callbacks;
+}) {
+    const [tab, setTab] = useState<Tab>("youtube");
+    return callbacks.renderViewWithSidebar(
+        <View run={run} tab={tab} />,
+        <SideBar tab={tab} setTab={setTab} callbacks={callbacks} />,
+    );
+}
+
+function View({ run, tab }: { run: RunRef; tab: Tab }) {
+    const method = useMemo(() => chooseTimingMethod(run), [run]);
+    const entries = useMemo(
+        () => buildSelectionEntries(run, method),
+        [run, method],
+    );
+
+    const [selectedValue, setSelectedValue] = useState(
+        () => entries[0]?.value ?? "",
+    );
+
+    const source: CsvSource | undefined = useMemo(
+        () => entries.find((e) => e.value === selectedValue)?.source,
+        [entries, selectedValue],
+    );
+
+    const runSelector = (
+        <div className={classes.field}>
+            <span className={classes.label}>Run / Time</span>
+            <select
+                className={classes.runSelect}
+                value={selectedValue}
+                onChange={(e) => setSelectedValue(e.target.value)}
+            >
+                {entries.map((entry) => (
+                    <option key={entry.value} value={entry.value}>
+                        {entry.label}
+                    </option>
+                ))}
+            </select>
+        </div>
+    );
+
+    const timingMethod = (
+        <div
+            className={`${classes.timingMethod}${
+                method === TimingMethod.GameTime ? "" : ` ${classes.hidden}`
+            }`}
+        >
+            Timing method:{" "}
+            {method === TimingMethod.GameTime ? "Game Time" : "Real Time"}
+        </div>
+    );
+
+    return (
+        <div className={classes.shareTimes}>
+            <div className={classes.form}>
+                {runSelector}
+                {tab === "youtube" ? (
+                    <YoutubeTab
+                        run={run}
+                        source={source}
+                        method={method}
+                        timingMethod={timingMethod}
+                    />
+                ) : (
+                    <LosslessCutTab
+                        run={run}
+                        source={source}
+                        method={method}
+                        timingMethod={timingMethod}
+                    />
+                )}
+            </div>
+        </div>
+    );
+}
+
+function YoutubeTab({
+    run,
+    source,
+    method,
+    timingMethod,
+}: {
+    run: RunRef;
+    source: CsvSource | undefined;
+    method: TimingMethod;
+    timingMethod: React.JSX.Element;
+}) {
+    const [offsetInput, setOffsetInput] = useState("");
+    const offset = useMemo(() => parseYoutubeOffset(offsetInput), [offsetInput]);
+
+    const youtube = useMemo(() => {
+        if (source === undefined || !offset.valid) {
+            return { text: "", adjusted: false };
+        }
+        return rowsToYoutube(
+            buildRows(run, source, method, offset.offsetSeconds),
+        );
+    }, [run, source, method, offset]);
+
+    const onCopy = async () => {
+        try {
+            await navigator.clipboard.writeText(youtube.text);
+            toast.success("Copied to clipboard.");
+        } catch {
+            toast.error("Failed to copy to the clipboard.");
+        }
+    };
+
+    return (
+        <>
+            <div className={classes.field}>
+                <TextBox
+                    label="Start Time Offset"
+                    placeholder="e.g. 1:23 or 1:02:03"
+                    value={offsetInput}
+                    invalid={!offset.valid}
+                    onChange={(e) => setOffsetInput(e.target.value)}
+                />
+                {!offset.valid && (
+                    <span className={classes.error}>
+                        The offset couldn't be parsed.
+                    </span>
+                )}
+            </div>
+
+            {timingMethod}
+
+            <div className={classes.youtube}>
+                <textarea
+                    className={classes.youtubeText}
+                    readOnly
+                    rows={14}
+                    value={youtube.text}
+                    onFocus={(e) => e.target.select()}
+                />
+                <button className={classes.copyButton} onClick={onCopy}>
+                    <Clipboard strokeWidth={2.5} />
+                    Copy to Clipboard
+                </button>
+                {youtube.adjusted && (
+                    <span className={classes.warning}>
+                        Some chapters were dropped to conform to YouTube's
+                        chapter format (unique start times, at least 10 seconds
+                        apart).
+                    </span>
+                )}
+            </div>
+        </>
+    );
+}
+
+function LosslessCutTab({
+    run,
+    source,
+    method,
+    timingMethod,
+}: {
+    run: RunRef;
+    source: CsvSource | undefined;
+    method: TimingMethod;
+    timingMethod: React.JSX.Element;
+}) {
+    const [offsetInput, setOffsetInput] = useState("");
+    const [fpsInput, setFpsInput] = useState("");
+
+    const offset = useMemo(
+        () => resolveLosslessCutOffset(offsetInput, fpsInput),
+        [offsetInput, fpsInput],
+    );
+
+    const canDownload =
+        source !== undefined && offset.error === null && offset.fps !== null;
+
+    const fpsFieldValue =
+        offset.fpsDerived && offset.fps !== null
+            ? formatFps(offset.fps)
+            : fpsInput;
+
+    const onDownload = () => {
+        if (source === undefined || offset.fps === null) {
+            return;
+        }
+        const rows = buildRows(run, source, method, offset.offsetSeconds);
+        const baseName = run.extendedFileName(true) || "splits";
+        try {
+            exportFile(`${baseName}.csv`, rowsToFramesCsv(rows, offset.fps));
+        } catch {
+            toast.error("Failed to export the CSV.");
+        }
+    };
+
+    return (
+        <>
+            <div className={classes.field}>
+                <div className={classes.offsetRow}>
+                    <div className={classes.offsetCell}>
+                        <TextBox
+                            label="Frame Offset"
+                            placeholder="00:17:39.0731777"
+                            value={offsetInput}
+                            invalid={offset.error !== null}
+                            onChange={(e) => setOffsetInput(e.target.value)}
+                        />
+                    </div>
+                    <div className={classes.fpsCell}>
+                        <TextBox
+                            label="FPS"
+                            placeholder="60"
+                            value={fpsFieldValue}
+                            disabled={offset.fpsDerived}
+                            onChange={(e) => setFpsInput(e.target.value)}
+                        />
+                    </div>
+                </div>
+                {offset.error !== null && (
+                    <span className={classes.error}>{offset.error}</span>
+                )}
+                {offset.warnings.map((warning, i) => (
+                    <span key={i} className={classes.warning}>
+                        {warning}
+                    </span>
+                ))}
+            </div>
+
+            {timingMethod}
+
+            <div className={classes.buttons}>
+                <button disabled={!canDownload} onClick={onDownload}>
+                    <Download strokeWidth={2.5} />
+                    Download Frame numbers (CSV)
+                </button>
+            </div>
+        </>
+    );
+}
+
+function SideBar({
+    tab,
+    setTab,
+    callbacks,
+}: {
+    tab: Tab;
+    setTab: (tab: Tab) => void;
+    callbacks: Callbacks;
+}) {
+    return (
+        <>
+            <h1>Share Times</h1>
+            <hr />
+            <button
+                className={tab === "youtube" ? classes.activeTab : undefined}
+                onClick={() => setTab("youtube")}
+            >
+                <ListVideo strokeWidth={2.5} />
+                YouTube Chapters
+            </button>
+            <button
+                className={tab === "losslesscut" ? classes.activeTab : undefined}
+                onClick={() => setTab("losslesscut")}
+            >
+                <Scissors strokeWidth={2.5} />
+                LosslessCut
+            </button>
+            <hr />
+            <button onClick={() => callbacks.closeShareTimes()}>
+                <ArrowLeft strokeWidth={2.5} />
+                Back
+            </button>
+        </>
+    );
+}
diff --git a/src/ui/views/SplitsSelection.tsx b/src/ui/views/SplitsSelection.tsx
index de2437e6..f00c4769 100644
--- a/src/ui/views/SplitsSelection.tsx
+++ b/src/ui/views/SplitsSelection.tsx
@@ -30,6 +30,7 @@ import {
     FolderOpen,
     Plus,
     Save,
+    Share2,
     SquarePen,
     Trash,
     Upload,
@@ -53,6 +54,7 @@ export interface Props {
 
 interface Callbacks {
     openRunEditor(editingInfo: EditingInfo): void;
+    openShareTimes(editingInfo: EditingInfo): void;
     setSplitsKey(newKey?: number): void;
     openTimerView(): void;
     renderViewWithSidebar(
@@ -481,6 +483,15 @@ function SideBar({
                 <Upload strokeWidth={2.5} />
                 {resolve(Label.Export, lang)}
             </button>
+            <button
+                onClick={() => {
+                    const run = commandSink.getRun().clone();
+                    callbacks.openShareTimes({ run });
+                }}
+            >
+                <Share2 strokeWidth={2.5} />
+                Share Times
+            </button>
             <hr />
             <button onClick={openTimerView}>
                 <ArrowLeft strokeWidth={2.5} />
diff --git a/src/util/ShareTimes.ts b/src/util/ShareTimes.ts
new file mode 100644
index 00000000..6765be95
--- /dev/null
+++ b/src/util/ShareTimes.ts
@@ -0,0 +1,488 @@
+import { RunRef, TimeRef, TimingMethod } from "../livesplit-core";
+import { formatLeaderboardTime } from "./TimeUtil";
+
+// The comparison name that livesplit-core always stores for the Personal Best.
+const PERSONAL_BEST_COMPARISON = "Personal Best";
+
+// The FPS value is only considered sensible within this open range.
+const FPS_MIN = 10;
+const FPS_MAX = 600;
+
+// Where the split times used for the export are taken from.
+export type CsvSource =
+    | { kind: "comparison"; comparison: string }
+    | { kind: "attempt"; attemptIndex: number };
+
+export interface SelectionEntry {
+    value: string;
+    label: string;
+    source: CsvSource;
+}
+
+export interface YoutubeOffset {
+    valid: boolean;
+    offsetSeconds: number;
+}
+
+export interface LosslessCutOffset {
+    valid: boolean;
+    // Whether the FPS was derived from the offset. When true, the FPS field is
+    // shown pre-filled and disabled; otherwise it's editable.
+    fpsDerived: boolean;
+    offsetSeconds: number;
+    offsetFrames: number;
+    fps: number | null;
+    // A hard error disables the output; warnings keep it enabled.
+    error: string | null;
+    warnings: string[];
+}
+
+// The frame based format: `HH:MM:SS.FF{whitespace}TOTAL`. `FF` are exactly the
+// two digits right after the period (the frame within the current second).
+const FRAME_REGEX = /^(\d+):(\d{1,2}):(\d{1,2})\.(\d{2})\s*(\d*)$/;
+
+const NUMBER_INT = /^\d+$/;
+const NUMBER_FRACTIONAL = /^\d+(?:\.\d+)?$/;
+
+function parseFpsInput(fpsInput: string): number | null {
+    const trimmed = fpsInput.trim();
+    if (trimmed === "" || !NUMBER_FRACTIONAL.test(trimmed)) {
+        return null;
+    }
+    const value = Number.parseFloat(trimmed);
+    return Number.isFinite(value) && value > 0 ? value : null;
+}
+
+function padTwo(value: number): string {
+    return value.toString().padStart(2, "0");
+}
+
+function formatHmsFrames(wholeSeconds: number, frames: number): string {
+    const seconds = wholeSeconds % 60;
+    const minutes = Math.floor(wholeSeconds / 60) % 60;
+    const hours = Math.floor(wholeSeconds / 3600);
+    return `${padTwo(hours)}:${padTwo(minutes)}:${padTwo(seconds)}.${padTwo(frames)}`;
+}
+
+// Parses a plain `{s}` / `{m}:{s}` / `{h}:{m}:{s}` timestamp into seconds.
+function parseTimestampSeconds(input: string): number | null {
+    const parts = input.split(":");
+    if (parts.length > 3) {
+        return null;
+    }
+
+    const secondsPart = parts[parts.length - 1];
+    if (!NUMBER_FRACTIONAL.test(secondsPart)) {
+        return null;
+    }
+    let total = Number.parseFloat(secondsPart);
+    let multiplier = 60;
+    for (let i = parts.length - 2; i >= 0; i -= 1) {
+        if (!NUMBER_INT.test(parts[i])) {
+            return null;
+        }
+        total += Number.parseInt(parts[i], 10) * multiplier;
+        multiplier *= 60;
+    }
+    return total;
+}
+
+export function parseYoutubeOffset(input: string): YoutubeOffset {
+    const trimmed = input.trim();
+    if (trimmed === "") {
+        return { valid: true, offsetSeconds: 0 };
+    }
+    const seconds = parseTimestampSeconds(trimmed);
+    if (seconds === null) {
+        return { valid: false, offsetSeconds: 0 };
+    }
+    return { valid: true, offsetSeconds: seconds };
+}
+
+// Resolves the LosslessCut offset. The offset must be the full frame format
+// `HH:MM:SS.FF{ws}TOTAL` (or empty); the plain seconds shortcut is not accepted.
+export function resolveLosslessCutOffset(
+    input: string,
+    fpsInput: string,
+): LosslessCutOffset {
+    const trimmed = input.trim();
+    const offsetEmpty = trimmed === "";
+
+    let wholeSeconds = 0;
+    let framesInSecond = 0;
+    let totalFrames = 0;
+
+    if (!offsetEmpty) {
+        const match = FRAME_REGEX.exec(trimmed);
+        if (match === null) {
+            return {
+                valid: false,
+                fpsDerived: false,
+                offsetSeconds: 0,
+                offsetFrames: 0,
+                fps: null,
+                error: "Enter a full offset like 00:17:39.0731777 (HH:MM:SS.FF followed by the total frame number).",
+                warnings: [],
+            };
+        }
+        const hours = Number.parseInt(match[1], 10);
+        const minutes = Number.parseInt(match[2], 10);
+        const seconds = Number.parseInt(match[3], 10);
+        // Parse in base 10 explicitly so a leading zero isn't treated as octal.
+        framesInSecond = Number.parseInt(match[4], 10);
+        totalFrames = match[5] === "" ? 0 : Number.parseInt(match[5], 10);
+        wholeSeconds = hours * 3600 + minutes * 60 + seconds;
+    }
+
+    const frameDelta = totalFrames - framesInSecond;
+    const calculatedFps =
+        totalFrames > 0 && wholeSeconds > 0 && frameDelta > 0
+            ? frameDelta / wholeSeconds
+            : null;
+
+    let fps: number | null;
+    let fpsDerived: boolean;
+    let error: string | null = null;
+    if (calculatedFps !== null) {
+        fps = calculatedFps;
+        fpsDerived = true;
+    } else {
+        fpsDerived = false;
+        fps = parseFpsInput(fpsInput);
+        // Don't complain about a missing FPS until an offset has been entered.
+        if (fps === null && !offsetEmpty) {
+            error = "An FPS value is required, as it can't be calculated from the offset.";
+        }
+    }
+
+    const warnings: string[] = [];
+    if (error === null && fps !== null) {
+        if (fps <= FPS_MIN || fps >= FPS_MAX) {
+            warnings.push(
+                `The FPS value (${formatFps(
+                    fps,
+                )}) is outside the expected range of ${FPS_MIN}–${FPS_MAX}.`,
+            );
+        }
+
+        // The time part and the total frame number should describe the same
+        // point in time. If they don't (only possible when the FPS was provided
+        // rather than calculated), warn about it.
+        const expectedFrames = wholeSeconds * fps + framesInSecond;
+        if (Math.abs(expectedFrames - totalFrames) > 0.5) {
+            const given = formatHmsFrames(wholeSeconds, framesInSecond);
+            const expectedWholeSeconds = Math.floor(totalFrames / fps);
+            const expectedFrameInSecond = Math.round(
+                totalFrames - expectedWholeSeconds * fps,
+            );
+            const expected = formatHmsFrames(
+                expectedWholeSeconds,
+                expectedFrameInSecond,
+            );
+            warnings.push(
+                `The offset time (${given}) doesn't match the frame offset: ${totalFrames} frames at ${formatFps(
+                    fps,
+                )} FPS would be ${expected}.`,
+            );
+        }
+    }
+
+    const offsetSeconds = fps !== null ? totalFrames / fps : 0;
+
+    return {
+        valid: true,
+        fpsDerived,
+        offsetSeconds,
+        offsetFrames: totalFrames,
+        fps,
+        error,
+        warnings,
+    };
+}
+
+export function formatFps(fps: number): string {
+    return String(Math.round(fps * 1e6) / 1e6);
+}
+
+function timeValue(time: TimeRef, method: TimingMethod): number | null {
+    const span =
+        method === TimingMethod.GameTime ? time.gameTime() : time.realTime();
+    return span?.totalSeconds() ?? null;
+}
+
+// Real Time is preferred if the run has any real times, otherwise Game Time.
+export function chooseTimingMethod(run: RunRef): TimingMethod {
+    const len = run.segmentsLen();
+    for (let i = len - 1; i >= 0; i -= 1) {
+        const pb = run.segment(i).personalBestSplitTime();
+        if (pb.realTime() != null) {
+            return TimingMethod.RealTime;
+        }
+        if (pb.gameTime() != null) {
+            return TimingMethod.GameTime;
+        }
+    }
+
+    const attempts = run.attemptHistoryLen();
+    for (let i = attempts - 1; i >= 0; i -= 1) {
+        const time = run.attemptHistoryIndex(i).time();
+        if (time.realTime() != null) {
+            return TimingMethod.RealTime;
+        }
+        if (time.gameTime() != null) {
+            return TimingMethod.GameTime;
+        }
+    }
+
+    return TimingMethod.RealTime;
+}
+
+function formatDateTime(rfc3339: string): string {
+    const date = new Date(rfc3339);
+    if (Number.isNaN(date.getTime())) {
+        return rfc3339;
+    }
+    return date.toLocaleString();
+}
+
+function attemptLabel(
+    id: number,
+    timeSeconds: number,
+    started: string | null,
+): string {
+    const time = formatLeaderboardTime(timeSeconds, false, undefined);
+    let label = `Run #${id}, ${time}`;
+    if (started !== null) {
+        label += `, started at ${started}`;
+    }
+    return label;
+}
+
+// Personal Best first (the default), then completed numbered attempts from most
+// recent to least recent, then all other named comparisons.
+export function buildSelectionEntries(
+    run: RunRef,
+    method: TimingMethod,
+): SelectionEntry[] {
+    const customComparisons: string[] = [];
+    const customLen = run.customComparisonsLen();
+    for (let i = 0; i < customLen; i += 1) {
+        customComparisons.push(run.customComparison(i));
+    }
+
+    const entries: SelectionEntry[] = [];
+
+    if (customComparisons.includes(PERSONAL_BEST_COMPARISON)) {
+        entries.push({
+            value: `cmp:${PERSONAL_BEST_COMPARISON}`,
+            label: PERSONAL_BEST_COMPARISON,
+            source: {
+                kind: "comparison",
+                comparison: PERSONAL_BEST_COMPARISON,
+            },
+        });
+    }
+
+    // The attempt history is stored oldest to newest, so collect and reverse.
+    const attemptEntries: SelectionEntry[] = [];
+    const attempts = run.attemptHistoryLen();
+    for (let i = 0; i < attempts; i += 1) {
+        const attempt = run.attemptHistoryIndex(i);
+        const id = attempt.index();
+
+        const finish = timeValue(attempt.time(), method);
+        if (finish === null) {
+            // Only completed attempts have a finish time.
+            continue;
+        }
+
+        const started = attempt.started();
+        const start = started !== null ? formatDateTime(started.toRfc3339()) : null;
+        started?.[Symbol.dispose]();
+
+        attemptEntries.push({
+            value: `att:${id}`,
+            label: attemptLabel(id, finish, start),
+            source: { kind: "attempt", attemptIndex: id },
+        });
+    }
+    attemptEntries.reverse();
+    entries.push(...attemptEntries);
+
+    for (const comparison of customComparisons) {
+        if (comparison === PERSONAL_BEST_COMPARISON) {
+            continue;
+        }
+        entries.push({
+            value: `cmp:${comparison}`,
+            label: comparison,
+            source: { kind: "comparison", comparison },
+        });
+    }
+
+    return entries;
+}
+
+// Cumulative split time (in seconds) at each segment, or `null` where no time is
+// known (a skipped segment in an attempt, or a missing comparison time).
+function splitTimesInSeconds(
+    run: RunRef,
+    source: CsvSource,
+    method: TimingMethod,
+): Array<number | null> {
+    const len = run.segmentsLen();
+    const result: Array<number | null> = [];
+
+    if (source.kind === "comparison") {
+        // Comparisons store cumulative split times directly.
+        for (let i = 0; i < len; i += 1) {
+            result.push(timeValue(run.segment(i).comparison(source.comparison), method));
+        }
+        return result;
+    }
+
+    // The segment history stores individual segment times (durations), so the
+    // cumulative split time is the running sum for the selected attempt. A
+    // skipped segment has no entry; its duration rolls into a later segment, so
+    // the running sum stays correct.
+    let cumulative = 0;
+    for (let i = 0; i < len; i += 1) {
+        using iter = run.segment(i).segmentHistory().iter();
+        let segmentTime: number | null = null;
+        while (true) {
+            const element = iter.next();
+            if (element === null) {
+                break;
+            }
+            if (element.index() === source.attemptIndex) {
+                segmentTime = timeValue(element.time(), method);
+                break;
+            }
+        }
+
+        if (segmentTime !== null) {
+            cumulative += segmentTime;
+            result.push(cumulative);
+        } else {
+            result.push(null);
+        }
+    }
+
+    return result;
+}
+
+interface CsvRow {
+    start: number;
+    // The end time in seconds, or `null` for the trailing "End" row.
+    end: number | null;
+    name: string;
+}
+
+// Rows in seconds. Segments without a time are skipped. A leading `Start` row is
+// added when the offset is non-zero, and a trailing `End` row is always added.
+export function buildRows(
+    run: RunRef,
+    source: CsvSource,
+    method: TimingMethod,
+    offsetSeconds: number,
+): CsvRow[] {
+    const splitTimes = splitTimesInSeconds(run, source, method);
+    const len = run.segmentsLen();
+
+    const rows: CsvRow[] = [];
+
+    if (offsetSeconds !== 0) {
+        rows.push({ start: 0, end: offsetSeconds, name: "Start" });
+    }
+
+    let previousEnd = offsetSeconds;
+    for (let i = 0; i < len; i += 1) {
+        const cumulative = splitTimes[i];
+        if (cumulative === null) {
+            continue;
+        }
+        const end = cumulative + offsetSeconds;
+        rows.push({ start: previousEnd, end, name: run.segment(i).name() });
+        previousEnd = end;
+    }
+
+    rows.push({ start: previousEnd, end: null, name: "End" });
+
+    return rows;
+}
+
+function escapeCsv(value: string): string {
+    if (/[",\r\n]/.test(value)) {
+        return `"${value.replace(/"/g, '""')}"`;
+    }
+    return value;
+}
+
+// An empty end value works too, but this large sentinel fits LosslessCut better.
+const LOSSLESSCUT_END_FRAME = 999999999;
+
+export function rowsToFramesCsv(rows: CsvRow[], fps: number): string {
+    const lines = ["Start,End,Name"];
+    for (const row of rows) {
+        const start = Math.round(row.start * fps);
+        const end =
+            row.end === null
+                ? LOSSLESSCUT_END_FRAME
+                : Math.round(row.end * fps);
+        lines.push(`${start},${end},${escapeCsv(row.name)}`);
+    }
+    return lines.join("\n") + "\n";
+}
+
+function youtubeTimestamp(totalSeconds: number): string {
+    const seconds = totalSeconds % 60;
+    const totalMinutes = Math.floor(totalSeconds / 60);
+    const minutes = totalMinutes % 60;
+    const hours = Math.floor(totalMinutes / 60);
+    if (hours > 0) {
+        return `${hours}:${padTwo(minutes)}:${padTwo(seconds)}`;
+    }
+    return `${minutes}:${padTwo(seconds)}`;
+}
+
+const YOUTUBE_MIN_CHAPTER_GAP = 10;
+
+export interface YoutubeResult {
+    text: string;
+    // Whether chapters had to be dropped to satisfy YouTube's chapter format.
+    adjusted: boolean;
+}
+
+// YouTube requires chapters to have unique start times at least 10 seconds
+// apart. Chapters that round to the previous timestamp, or land less than 10
+// seconds after the previous kept chapter, are dropped.
+export function rowsToYoutube(rows: CsvRow[]): YoutubeResult {
+    const kept: Array<{ seconds: number; name: string }> = [];
+    let adjusted = false;
+
+    for (const row of rows) {
+        const seconds = Math.floor(row.start);
+        if (kept.length === 0) {
+            kept.push({ seconds, name: row.name });
+            continue;
+        }
+
+        const previous = kept[kept.length - 1];
+        if (seconds === previous.seconds) {
+            // Same timestamp: drop the earlier chapter, keep the later one.
+            kept[kept.length - 1] = { seconds, name: row.name };
+            adjusted = true;
+        } else if (seconds - previous.seconds < YOUTUBE_MIN_CHAPTER_GAP) {
+            // Too close to the previous kept chapter: drop this one.
+            adjusted = true;
+        } else {
+            kept.push({ seconds, name: row.name });
+        }
+    }
+
+    const text = kept
+        .map((chapter) => `${youtubeTimestamp(chapter.seconds)} ${chapter.name}`)
+        .join("\n");
+
+    return { text, adjusted };
+}