dreamio/docs/turns/2026-05-25-fix-native-player-controls-tap.html

265 lines
No EOL
122 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Fix Native Player Controls Tap-to-Show</title>
<style>
:root {
color-scheme: light;
--ink: oklch(0.22 0.025 275);
--muted: oklch(0.46 0.025 275);
--paper: oklch(0.985 0.006 285);
--panel: oklch(0.96 0.014 286);
--line: oklch(0.88 0.018 286);
--accent: oklch(0.55 0.18 286);
--accent-soft: oklch(0.91 0.045 286);
--good: oklch(0.56 0.13 154);
}
* { box-sizing: border-box; }
body {
margin: 0;
background: var(--paper);
color: var(--ink);
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
line-height: 1.58;
}
main {
width: min(1080px, calc(100vw - 40px));
margin: 0 auto;
padding: 56px 0 72px;
}
header {
border-bottom: 1px solid var(--line);
padding-bottom: 28px;
margin-bottom: 34px;
}
.eyebrow {
color: var(--accent);
font-size: 0.78rem;
font-weight: 750;
letter-spacing: 0.08em;
text-transform: uppercase;
}
h1 {
margin: 10px 0 12px;
font-size: clamp(2rem, 5vw, 4.25rem);
line-height: 1.02;
letter-spacing: 0;
max-width: 880px;
}
h2 {
margin: 38px 0 12px;
font-size: 1.18rem;
line-height: 1.2;
}
p, li { max-width: 76ch; }
code {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
font-size: 0.94em;
background: var(--accent-soft);
border-radius: 4px;
padding: 0.08rem 0.28rem;
}
.summary {
font-size: 1.12rem;
max-width: 78ch;
color: oklch(0.32 0.026 275);
}
.meta {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: 18px;
}
.pill {
border: 1px solid var(--line);
background: var(--panel);
border-radius: 999px;
padding: 6px 10px;
color: var(--muted);
font-size: 0.9rem;
}
section {
border-top: 1px solid var(--line);
padding-top: 8px;
}
.callout {
background: var(--panel);
border: 1px solid var(--line);
border-radius: 8px;
padding: 16px 18px;
margin: 16px 0;
}
.status-good { color: var(--good); font-weight: 700; }
.diff-wrap {
margin-top: 16px;
border: 1px solid var(--line);
border-radius: 8px;
overflow: auto;
background: oklch(0.997 0.004 285);
max-height: 680px;
}
.diff-wrap > * { min-width: 720px; }
ul { padding-left: 1.25rem; }
a { color: var(--accent); }
</style>
</head>
<body>
<main>
<header>
<div class="eyebrow">Turn document · 2026-05-25 05:28 EDT</div>
<h1>Fix Native Player Controls Tap-to-Show</h1>
<p class="summary">Native player controls can now be brought back after they auto-hide or are hidden by tapping the player. The fix gives player taps a reliable full-screen gesture surface above the VLC video view while keeping visible controls interactive.</p>
<div class="meta">
<span class="pill">Issue: dreamio-wgk</span>
<span class="pill">File: Dreamio/NativePlayerViewController.swift</span>
<span class="pill">Validation: Xcode build passed</span>
</div>
</header>
<section>
<h2>Summary</h2>
<p>Fixed the native playback overlay so hidden controls are not effectively gone forever. A transparent tap surface now receives taps over the video, and hidden control views stop intercepting touches until they are visible again.</p>
</section>
<section>
<h2>Changes Made</h2>
<ul>
<li>Added a full-screen transparent <code>tapSurfaceView</code> above the VLC drawable and below the loading, failure, controls, and close-button layers.</li>
<li>Moved the tap gesture recognizer from the root view to that tap surface so player taps are handled consistently.</li>
<li>Disabled user interaction on the controls container and close button while they are hidden, then re-enabled it when controls are revealed.</li>
</ul>
</section>
<section>
<h2>Context</h2>
<p>The native player uses MobileVLCKit for video rendering and an overlay built in UIKit for playback controls. Before this change, the gesture recognizer was attached to the root view. Once controls faded out, the visible controls had alpha zero but still occupied their layout area, and the video drawable could also interfere with root-level tap handling. That left some taps with no route back to <code>revealControls()</code>.</p>
</section>
<section>
<h2>Important Implementation Details</h2>
<p>The tap surface is inserted immediately after <code>backend.view</code>, which keeps it above the video but below the actual controls. This preserves normal button and slider behavior when controls are visible while making the rest of the player a reliable tap target.</p>
<p>When <code>hideControls()</code> runs, the controls and close button are also made non-interactive. This matters because alpha-zero UIKit views can still participate in hit testing unless interaction is disabled or the views are hidden.</p>
</section>
<section>
<h2>Relevant Diff Snippets</h2>
<p>The diff below is rendered with <code>@pierre/diffs/ssr</code> using <code>preloadPatchDiff</code>.</p>
<div class="diff-wrap">
<svg data-icon-sprite aria-hidden="true" width="0" height="0">
<symbol id="diffs-icon-arrow-right-short" viewBox="0 0 16 16">
<path d="M8.47 4.22a.75.75 0 0 0 0 1.06l1.97 1.97H3.75a.75.75 0 0 0 0 1.5h6.69l-1.97 1.97a.75.75 0 1 0 1.06 1.06l3.25-3.25a.75.75 0 0 0 0-1.06L9.53 4.22a.75.75 0 0 0-1.06 0"/>
</symbol>
<symbol id="diffs-icon-brand-github" viewBox="0 0 16 16">
<path d="M8 0c4.42 0 8 3.58 8 8a8.01 8.01 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27s-1.36.09-2 .27c-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8"/>
</symbol>
<symbol id="diffs-icon-chevron" viewBox="0 0 16 16">
<path d="M1.47 4.47a.75.75 0 0 1 1.06 0L8 9.94l5.47-5.47a.75.75 0 1 1 1.06 1.06l-6 6a.75.75 0 0 1-1.06 0l-6-6a.75.75 0 0 1 0-1.06"/>
</symbol>
<symbol id="diffs-icon-chevrons-narrow" viewBox="0 0 10 16">
<path d="M4.47 2.22a.75.75 0 0 1 1.06 0l3.25 3.25a.75.75 0 0 1-1.06 1.06L5 3.81 2.28 6.53a.75.75 0 0 1-1.06-1.06zM1.22 9.47a.75.75 0 0 1 1.06 0L5 12.19l2.72-2.72a.75.75 0 0 1 1.06 1.06l-3.25 3.25a.75.75 0 0 1-1.06 0l-3.25-3.25a.75.75 0 0 1 0-1.06"/>
</symbol>
<symbol id="diffs-icon-diff-split" viewBox="0 0 16 16">
<path d="M14 0H8.5v16H14a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2m-1.5 6.5v1h1a.5.5 0 0 1 0 1h-1v1a.5.5 0 0 1-1 0v-1h-1a.5.5 0 0 1 0-1h1v-1a.5.5 0 0 1 1 0"/><path d="M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h5.5V0zm.5 7.5h3a.5.5 0 0 1 0 1h-3a.5.5 0 0 1 0-1" opacity=".3"/>
</symbol>
<symbol id="diffs-icon-diff-unified" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M16 14a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V8.5h16zm-8-4a.5.5 0 0 0-.5.5v1h-1a.5.5 0 0 0 0 1h1v1a.5.5 0 0 0 1 0v-1h1a.5.5 0 0 0 0-1h-1v-1A.5.5 0 0 0 8 10" clip-rule="evenodd"/><path fill-rule="evenodd" d="M14 0a2 2 0 0 1 2 2v5.5H0V2a2 2 0 0 1 2-2zM6.5 3.5a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1z" clip-rule="evenodd" opacity=".4"/>
</symbol>
<symbol id="diffs-icon-expand" viewBox="0 0 16 16">
<path d="M3.47 5.47a.75.75 0 0 1 1.06 0L8 8.94l3.47-3.47a.75.75 0 1 1 1.06 1.06l-4 4a.75.75 0 0 1-1.06 0l-4-4a.75.75 0 0 1 0-1.06"/>
</symbol>
<symbol id="diffs-icon-expand-all" viewBox="0 0 16 16">
<path d="M11.47 9.47a.75.75 0 1 1 1.06 1.06l-4 4a.75.75 0 0 1-1.06 0l-4-4a.75.75 0 1 1 1.06-1.06L8 12.94zM7.526 1.418a.75.75 0 0 1 1.004.052l4 4a.75.75 0 1 1-1.06 1.06L8 3.06 4.53 6.53a.75.75 0 1 1-1.06-1.06l4-4z"/>
</symbol>
<symbol id="diffs-icon-file-code" viewBox="0 0 16 16">
<path d="M10.75 0c.199 0 .39.08.53.22l3.5 3.5c.14.14.22.331.22.53v9A2.75 2.75 0 0 1 12.25 16h-8.5A2.75 2.75 0 0 1 1 13.25V2.75A2.75 2.75 0 0 1 3.75 0zm-7 1.5c-.69 0-1.25.56-1.25 1.25v10.5c0 .69.56 1.25 1.25 1.25h8.5c.69 0 1.25-.56 1.25-1.25V5h-1.25A2.25 2.25 0 0 1 10 2.75V1.5z"/><path d="M7.248 6.19a.75.75 0 0 1 .063 1.058L5.753 9l1.558 1.752a.75.75 0 0 1-1.122.996l-2-2.25a.75.75 0 0 1 0-.996l2-2.25a.75.75 0 0 1 1.06-.063M8.69 7.248a.75.75 0 1 1 1.12-.996l2 2.25a.75.75 0 0 1 0 .996l-2 2.25a.75.75 0 1 1-1.12-.996L10.245 9z"/>
</symbol>
<symbol id="diffs-icon-plus" viewBox="0 0 16 16">
<path d="M8 3a.75.75 0 0 1 .75.75v3.5h3.5a.75.75 0 0 1 0 1.5h-3.5v3.5a.75.75 0 0 1-1.5 0v-3.5h-3.5a.75.75 0 0 1 0-1.5h3.5v-3.5A.75.75 0 0 1 8 3"/>
</symbol>
<symbol id="diffs-icon-symbol-added" viewBox="0 0 16 16">
<path d="M8 4a.75.75 0 0 1 .75.75v2.5h2.5a.75.75 0 0 1 0 1.5h-2.5v2.5a.75.75 0 0 1-1.5 0v-2.5h-2.5a.75.75 0 0 1 0-1.5h2.5v-2.5A.75.75 0 0 1 8 4"/><path d="M1.788 4.296c.196-.88.478-1.381.802-1.706s.826-.606 1.706-.802C5.194 1.588 6.387 1.5 8 1.5s2.806.088 3.704.288c.88.196 1.381.478 1.706.802s.607.826.802 1.706c.2.898.288 2.091.288 3.704s-.088 2.806-.288 3.704c-.195.88-.478 1.381-.802 1.706s-.826.607-1.706.802c-.898.2-2.091.288-3.704.288s-2.806-.088-3.704-.288c-.88-.195-1.381-.478-1.706-.802s-.606-.826-.802-1.706C1.588 10.806 1.5 9.613 1.5 8s.088-2.806.288-3.704M8 0C1.412 0 0 1.412 0 8s1.412 8 8 8 8-1.412 8-8-1.412-8-8-8"/>
</symbol>
<symbol id="diffs-icon-symbol-deleted" viewBox="0 0 16 16">
<path d="M4 8a.75.75 0 0 1 .75-.75h6.5a.75.75 0 0 1 0 1.5h-6.5A.75.75 0 0 1 4 8"/><path d="M1.788 4.296c.196-.88.478-1.381.802-1.706s.826-.606 1.706-.802C5.194 1.588 6.387 1.5 8 1.5s2.806.088 3.704.288c.88.196 1.381.478 1.706.802s.607.826.802 1.706c.2.898.288 2.091.288 3.704s-.088 2.806-.288 3.704c-.195.88-.478 1.381-.802 1.706s-.826.607-1.706.802c-.898.2-2.091.288-3.704.288s-2.806-.088-3.704-.288c-.88-.195-1.381-.478-1.706-.802s-.606-.826-.802-1.706C1.588 10.806 1.5 9.613 1.5 8s.088-2.806.288-3.704M8 0C1.412 0 0 1.412 0 8s1.412 8 8 8 8-1.412 8-8-1.412-8-8-8"/>
</symbol>
<symbol id="diffs-icon-symbol-diffstat" viewBox="0 0 16 16">
<path d="M1.788 4.296c.196-.88.478-1.381.802-1.706s.826-.606 1.706-.802C5.194 1.588 6.387 1.5 8 1.5s2.806.088 3.704.288c.88.196 1.381.478 1.706.802s.607.826.802 1.706c.2.898.288 2.091.288 3.704s-.088 2.806-.288 3.704c-.195.88-.478 1.381-.802 1.706s-.826.607-1.706.802c-.898.2-2.091.288-3.704.288s-2.806-.088-3.704-.288c-.88-.195-1.381-.478-1.706-.802s-.606-.826-.802-1.706C1.588 10.806 1.5 9.613 1.5 8s.088-2.806.288-3.704M8 0C1.412 0 0 1.412 0 8s1.412 8 8 8 8-1.412 8-8-1.412-8-8-8"/><path d="M8.75 4.296a.75.75 0 0 0-1.5 0V6.25h-2a.75.75 0 0 0 0 1.5h2v1.5h1.5v-1.5h2a.75.75 0 0 0 0-1.5h-2zM5.25 10a.75.75 0 0 0 0 1.5h5.5a.75.75 0 0 0 0-1.5z"/>
</symbol>
<symbol id="diffs-icon-symbol-ignored" viewBox="0 0 16 16">
<path d="M1.5 8c0 1.613.088 2.806.288 3.704.196.88.478 1.381.802 1.706s.826.607 1.706.802c.898.2 2.091.288 3.704.288s2.806-.088 3.704-.288c.88-.195 1.381-.478 1.706-.802s.607-.826.802-1.706c.2-.898.288-2.091.288-3.704s-.088-2.806-.288-3.704c-.195-.88-.478-1.381-.802-1.706s-.826-.606-1.706-.802C10.806 1.588 9.613 1.5 8 1.5s-2.806.088-3.704.288c-.88.196-1.381.478-1.706.802s-.606.826-.802 1.706C1.588 5.194 1.5 6.387 1.5 8M0 8c0-6.588 1.412-8 8-8s8 1.412 8 8-1.412 8-8 8-8-1.412-8-8m11.53-2.47a.75.75 0 0 0-1.06-1.06l-6 6a.75.75 0 1 0 1.06 1.06z"/>
</symbol>
<symbol id="diffs-icon-symbol-modified" viewBox="0 0 16 16">
<path d="M1.5 8c0 1.613.088 2.806.288 3.704.196.88.478 1.381.802 1.706s.826.607 1.706.802c.898.2 2.091.288 3.704.288s2.806-.088 3.704-.288c.88-.195 1.381-.478 1.706-.802s.607-.826.802-1.706c.2-.898.288-2.091.288-3.704s-.088-2.806-.288-3.704c-.195-.88-.478-1.381-.802-1.706s-.826-.606-1.706-.802C10.806 1.588 9.613 1.5 8 1.5s-2.806.088-3.704.288c-.88.196-1.381.478-1.706.802s-.606.826-.802 1.706C1.588 5.194 1.5 6.387 1.5 8M0 8c0-6.588 1.412-8 8-8s8 1.412 8 8-1.412 8-8 8-8-1.412-8-8m8 3a3 3 0 1 0 0-6 3 3 0 0 0 0 6"/>
</symbol>
<symbol id="diffs-icon-symbol-moved" viewBox="0 0 16 16">
<path d="M1.788 4.296c.196-.88.478-1.381.802-1.706s.826-.606 1.706-.802C5.194 1.588 6.387 1.5 8 1.5s2.806.088 3.704.288c.88.196 1.381.478 1.706.802s.607.826.802 1.706c.2.898.288 2.091.288 3.704s-.088 2.806-.288 3.704c-.195.88-.478 1.381-.802 1.706s-.826.607-1.706.802c-.898.2-2.091.288-3.704.288s-2.806-.088-3.704-.288c-.88-.195-1.381-.478-1.706-.802s-.606-.826-.802-1.706C1.588 10.806 1.5 9.613 1.5 8s.088-2.806.288-3.704M8 0C1.412 0 0 1.412 0 8s1.412 8 8 8 8-1.412 8-8-1.412-8-8-8"/><path d="M8.495 4.695a.75.75 0 0 0-.05 1.06L10.486 8l-2.041 2.246a.75.75 0 0 0 1.11 1.008l2.5-2.75a.75.75 0 0 0 0-1.008l-2.5-2.75a.75.75 0 0 0-1.06-.051m-4 0a.75.75 0 0 0-.05 1.06l2.044 2.248-1.796 1.995a.75.75 0 0 0 1.114 1.004l2.25-2.5a.75.75 0 0 0-.002-1.007l-2.5-2.75a.75.75 0 0 0-1.06-.05"/>
</symbol>
<symbol id="diffs-icon-symbol-ref" viewBox="0 0 16 16">
<path d="M1.5 8c0 1.613.088 2.806.288 3.704.196.88.478 1.381.802 1.706.286.286.71.54 1.41.73V1.86c-.7.19-1.124.444-1.41.73-.324.325-.606.826-.802 1.706C1.588 5.194 1.5 6.387 1.5 8m4 6.397c.697.07 1.522.103 2.5.103 1.613 0 2.806-.088 3.704-.288.88-.195 1.381-.478 1.706-.802s.607-.826.802-1.706c.2-.898.288-2.091.288-3.704s-.088-2.806-.288-3.704c-.195-.88-.478-1.381-.802-1.706s-.826-.606-1.706-.802C10.806 1.588 9.613 1.5 8 1.5c-.978 0-1.803.033-2.5.103zM0 8c0-6.588 1.412-8 8-8s8 1.412 8 8-1.412 8-8 8-8-1.412-8-8m7-2a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1z"/>
</symbol>
</svg><style data-core-css="">@layer base, theme, rendered, unsafe;
@layer base,theme,rendered,unsafe;@layer base{:host{--diffs-font-fallback:"SF Mono", Monaco, Consolas, "Ubuntu Mono", "Liberation Mono", "Courier New", monospace;--diffs-header-font-fallback:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif;--diffs-mixer:light-dark(#000,#fff);--diffs-gap-fallback:8px;--diffs-scrollbar-gutter-fallback:6px;--diffs-scrollbar-gutter:var(--diffs-scrollbar-gutter-override,var(--diffs-scrollbar-gutter-measured,var(--diffs-scrollbar-gutter-fallback)));--diffs-added-light:#0dbe4e;--diffs-added-dark:#5ecc71;--diffs-modified-light:#009fff;--diffs-modified-dark:#69b1ff;--diffs-deleted-light:#ff2e3f;--diffs-deleted-dark:#ff6762;color-scheme:light dark;font-family:var(--diffs-header-font-family,var(--diffs-header-font-fallback));font-size:var(--diffs-font-size,13px);line-height:var(--diffs-line-height,20px);font-feature-settings:var(--diffs-font-features);--diffs-bg:light-dark(var(--diffs-light-bg,#fff),var(--diffs-dark-bg,#000));--diffs-bg-buffer:var(--diffs-bg-buffer-override,light-dark(color-mix(in lab, var(--diffs-bg) 92%, var(--diffs-mixer)),color-mix(in lab, var(--diffs-bg) 92%, var(--diffs-mixer))));--diffs-bg-context:var(--diffs-bg-context-override,light-dark(color-mix(in lab, var(--diffs-bg) 98.5%, var(--diffs-mixer)),color-mix(in lab, var(--diffs-bg) 92.5%, var(--diffs-mixer))));--diffs-bg-context-gutter:var(--diffs-bg-context-gutter-override,light-dark(color-mix(in lab, var(--diffs-bg-context) 90%, var(--diffs-bg)),color-mix(in lab, var(--diffs-bg-context) 45%, var(--diffs-bg))));--diffs-bg-separator:var(--diffs-bg-separator-override,light-dark(color-mix(in lab, var(--diffs-bg) 96%, var(--diffs-mixer)),color-mix(in lab, var(--diffs-bg) 85%, var(--diffs-mixer))));--diffs-fg:light-dark(var(--diffs-light,#000),var(--diffs-dark,#fff));--diffs-fg-number:var(--diffs-fg-number-override,light-dark(color-mix(in lab, var(--diffs-fg) 65%, var(--diffs-bg)),color-mix(in lab, var(--diffs-fg) 65%, var(--diffs-bg))));--diffs-fg-conflict-marker:var(--diffs-fg-conflict-marker-override,var(--diffs-fg-number));--diffs-deletion-base:var(--diffs-deletion-color-override,light-dark(var(--diffs-light-deletion-color,var(--diffs-deletion-color,var(--diffs-deleted-light))),var(--diffs-dark-deletion-color,var(--diffs-deletion-color,var(--diffs-deleted-dark)))));--diffs-addition-base:var(--diffs-addition-color-override,light-dark(var(--diffs-light-addition-color,var(--diffs-addition-color,var(--diffs-added-light))),var(--diffs-dark-addition-color,var(--diffs-addition-color,var(--diffs-added-dark)))));--diffs-modified-base:var(--diffs-modified-color-override,light-dark(var(--diffs-light-modified-color,var(--diffs-modified-color,var(--diffs-modified-light))),var(--diffs-dark-modified-color,var(--diffs-modified-color,var(--diffs-modified-dark)))));--diffs-bg-deletion:var(--diffs-bg-deletion-override,light-dark(color-mix(in lab, var(--diffs-bg) 88%, var(--diffs-deletion-base)),color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-deletion-base))));--diffs-bg-deletion-emphasis:var(--diffs-bg-deletion-emphasis-override,light-dark(rgb(from var(--diffs-deletion-base) r g b / .15),rgb(from var(--diffs-deletion-base) r g b / .2)));--diffs-bg-addition:var(--diffs-bg-addition-override,light-dark(color-mix(in lab, var(--diffs-bg) 88%, var(--diffs-addition-base)),color-mix(in lab, var(--diffs-bg) 80%, var(--diffs-addition-base))));--diffs-bg-addition-emphasis:var(--diffs-bg-addition-emphasis-override,light-dark(rgb(from var(--diffs-addition-base) r g b / .15),rgb(from var(--diffs-addition-base) r g b / .2)));--diffs-selection-base:var(--diffs-modified-base);--diffs-selection-number-fg:light-dark(color-mix(in lab, var(--diffs-selection-base) 65%, var(--diffs-mixer)),color-mix(in lab, var(--diffs-selection-base) 75%, var(--diffs-mixer)));background-color:var(--diffs-bg);color:var(--diffs-fg);display:block}pre,code,[data-error-wrapper]{isolation:isolate;font-family:var(--diffs-font-family,var(--diffs-font-fallback));outline:none;margin:0;padding:0;display:block}pre,code{background-color:var(--diffs-bg)}code{contain:content}*,:before,:after{box-sizing:border-box}[data-icon-sprite]{display:none}[data-diffs-header],[data-separator]{font-family:var(--diffs-header-font-family,var(--diffs-header-font-fallback))}[data-diffs-header][data-sticky]{z-index:1;background-color:var(--diffs-bg);position:sticky;top:0}[data-file-info]{color:var(--fg);background-color:color-mix(in lab, var(--bg) 98%, var(--fg));border-block:1px solid color-mix(in lab, var(--bg) 95%, var(--fg));padding:10px;font-weight:700}[data-diff],[data-file]{--diffs-grid-number-column-width:minmax(min-content, max-content);--diffs-code-grid:var(--diffs-grid-number-column-width) 1fr}[data-dehydrated]:is([data-diff],[data-file]){--diffs-code-grid:var(--diffs-grid-number-column-width) minmax(0, 1fr)}:is([data-diff],[data-file]):hover [data-code]::-webkit-scrollbar-thumb{background-color:var(--diffs-bg-context)}@supports (-webkit-touch-callout:none){:host{--diffs-scrollbar-gutter-fallback:0px}}[data-line] span{color:light-dark(var(--diffs-token-light,var(--diffs-light)),var(--diffs-token-dark,var(--diffs-dark)));background-color:light-dark(var(--diffs-token-light-bg,inherit),var(--diffs-token-dark-bg,inherit));font-weight:light-dark(var(--diffs-token-light-font-weight,inherit),var(--diffs-token-dark-font-weight,inherit));font-style:light-dark(var(--diffs-token-light-font-style,inherit),var(--diffs-token-dark-font-style,inherit));-webkit-text-decoration:light-dark(var(--diffs-token-light-text-decoration,inherit),var(--diffs-token-dark-text-decoration,inherit));text-decoration:light-dark(var(--diffs-token-light-text-decoration,inherit),var(--diffs-token-dark-text-decoration,inherit))}[data-line],[data-gutter-buffer],[data-column-number],[data-line-annotation],[data-no-newline],[data-merge-conflict],[data-merge-conflict-actions]{--diffs-computed-decoration-bg:var(--diffs-bg);--diffs-computed-diff-line-bg:var(--diffs-bg);--diffs-computed-selected-line-bg:var(--diffs-bg);color:var(--diffs-fg);background-color:var(--diffs-line-bg,var(--diffs-bg))}@media (pointer:fine){:is([data-line],[data-gutter-buffer],[data-column-number],[data-line-annotation],[data-no-newline],[data-merge-conflict],[data-merge-conflict-actions]):where([data-hovered]){--diffs-computed-hovered-line-bg:light-dark(color-mix(in lab, var(--diffs-computed-selected-line-bg) 97%, var(--diffs-bg-hover-override,var(--diffs-mixer))),color-mix(in lab, var(--diffs-computed-selected-line-bg) 91%, var(--diffs-bg-hover-override,var(--diffs-mixer))));--diffs-line-bg:var(--diffs-computed-hovered-line-bg,inherit)}}[data-decoration-bg]:is([data-line],[data-no-newline]){--mix-deco-light:92%;--mix-deco-dark:85%}[data-decoration-bg][data-decoration-bg-depth="2"]:is([data-line],[data-no-newline]){--mix-deco-light:88%;--mix-deco-dark:80%}[data-decoration-bg][data-decoration-bg-depth="3"]:is([data-line],[data-no-newline]){--mix-deco-light:85%;--mix-deco-dark:78%}@media (pointer:fine){[data-decoration-bg][data-hovered]:is([data-line],[data-no-newline]):not([data-selected-line]){--mix-deco-light:85%;--mix-deco-dark:85%}[data-decoration-bg][data-hovered][data-decoration-bg-depth="2"]:is([data-line],[data-no-newline]):not([data-selected-line]){--mix-deco-light:83%;--mix-deco-dark:83%}[data-decoration-bg][data-hovered][data-decoration-bg-depth="3"]:is([data-line],[data-no-newline]):not([data-selected-line]){--mix-deco-light:81%;--mix-deco-dark:81%}}[data-decoration-bg]:is([data-line],[data-no-newline]){--diffs-computed-decoration-bg:light-dark(color-mix(in lab, var(--diffs-bg) var(--mix-deco-light), var(--diffs-decoration-bg)),color-mix(in lab, var(--diffs-bg) var(--mix-deco-dark), var(--diffs-decoration-bg)));--diffs-computed-diff-line-bg:var(--diffs-computed-decoration-bg);--diffs-computed-selected-line-bg:var(--diffs-computed-decoration-bg);--diffs-line-bg:var(--diffs-computed-decoration-bg)}[data-line-annotation],[data-gutter-buffer=annotation]{--diffs-annotation-bg:var(--diffs-bg-context);--diffs-computed-decoration-bg:var(--diffs-annotation-bg);--diffs-computed-diff-line-bg:var(--diffs-annotation-bg);--diffs-computed-selected-line-bg:var(--diffs-annotation-bg);--diffs-line-bg:var(--diffs-annotation-bg)}[data-merge-conflict-actions],[data-gutter-buffer=merge-conflict-action],[data-gutter-buffer=merge-conflict-marker-base],[data-gutter-buffer=merge-conflict-marker-separator],[data-merge-conflict=marker-base],[data-merge-conflict=marker-separator]{--diffs-computed-decoration-bg:var(--diffs-bg-context);--diffs-computed-diff-line-bg:var(--diffs-bg-context);--diffs-computed-selected-line-bg:var(--diffs-bg-context);--diffs-line-bg:var(--diffs-bg-context)}[data-gutter-buffer=merge-conflict-marker-start],[data-merge-conflict=marker-start]{--diffs-computed-decoration-bg:light-dark(color-mix(in lab, var(--diffs-bg) 78%, var(--conflict-bg-current-header-override,var(--diffs-addition-base))),color-mix(in lab, var(--diffs-bg) 68%, var(--conflict-bg-current-header-override,var(--diffs-addition-base))));--diffs-computed-diff-line-bg:var(--diffs-computed-decoration-bg);--diffs-computed-selected-line-bg:var(--diffs-computed-decoration-bg);--diffs-line-bg:var(--diffs-computed-decoration-bg)}[data-gutter-buffer=merge-conflict-marker-end],[data-merge-conflict=marker-end]{--diffs-computed-decoration-bg:light-dark(color-mix(in lab, var(--diffs-bg) 78%, var(--conflict-bg-incoming-header-override,var(--diffs-modified-base))),color-mix(in lab, var(--diffs-bg) 68%, var(--conflict-bg-incoming-header-override,var(--diffs-modified-base))));--diffs-computed-diff-line-bg:var(--diffs-computed-decoration-bg);--diffs-computed-selected-line-bg:var(--diffs-computed-decoration-bg);--diffs-line-bg:var(--diffs-computed-decoration-bg)}[data-has-merge-conflict] [data-line-annotation],[data-has-merge-conflict] [data-gutter-buffer=annotation]{--diffs-computed-decoration-bg:var(--diffs-bg);--diffs-computed-diff-line-bg:var(--diffs-bg);--diffs-computed-selected-line-bg:var(--diffs-bg);--diffs-line-bg:var(--diffs-bg)}:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number]{--mix-light:91%;--mix-dark:85%}:where([data-background]) [data-line],:where([data-background]) [data-no-newline]{--mix-light:88%;--mix-dark:80%}:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]{--diffs-diff-line-mix-target:var(--diffs-bg)}[data-line-type=change-deletion]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--diffs-diff-line-mix-target:var(--diffs-bg-deletion-override,var(--diffs-deletion-base))}@media (pointer:fine){[data-line-type=change-deletion][data-hovered]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--mix-light:80%;--mix-dark:75%}}[data-line-type=change-deletion]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]):where([data-gutter-buffer],[data-column-number]){color:var(--diffs-fg-number-deletion-override,var(--diffs-deletion-base));--diffs-diff-line-mix-target:var(--diffs-bg-deletion-number-override,var(--diffs-deletion-base))}[data-line-type=change-deletion]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--diffs-computed-diff-line-bg:light-dark(color-mix(in lab, var(--diffs-computed-decoration-bg) var(--mix-light), var(--diffs-diff-line-mix-target)),color-mix(in lab, var(--diffs-computed-decoration-bg) var(--mix-dark), var(--diffs-diff-line-mix-target)));--diffs-computed-selected-line-bg:var(--diffs-computed-diff-line-bg);--diffs-line-bg:var(--diffs-computed-diff-line-bg,inherit)}[data-line-type=change-addition]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--diffs-diff-line-mix-target:var(--diffs-bg-addition-override,var(--diffs-addition-base))}@media (pointer:fine){[data-line-type=change-addition][data-hovered]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--mix-light:80%;--mix-dark:70%}}[data-line-type=change-addition]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]):where([data-gutter-buffer],[data-column-number]){color:var(--diffs-fg-number-addition-override,var(--diffs-addition-base));--diffs-diff-line-mix-target:var(--diffs-bg-addition-number-override,var(--diffs-addition-base))}[data-line-type=change-addition]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--diffs-computed-diff-line-bg:light-dark(color-mix(in lab, var(--diffs-computed-decoration-bg) var(--mix-light), var(--diffs-diff-line-mix-target)),color-mix(in lab, var(--diffs-computed-decoration-bg) var(--mix-dark), var(--diffs-diff-line-mix-target)));--diffs-computed-selected-line-bg:var(--diffs-computed-diff-line-bg);--diffs-line-bg:var(--diffs-computed-diff-line-bg,inherit)}[data-merge-conflict=current]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--diffs-diff-line-mix-target:var(--conflict-bg-current-override,var(--diffs-addition-base))}[data-merge-conflict=current]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]):where([data-gutter-buffer],[data-column-number]){color:var(--diffs-fg-number-addition-override,var(--diffs-addition-base));--diffs-diff-line-mix-target:var(--conflict-bg-current-number-override,var(--diffs-addition-base))}@media (pointer:fine){[data-merge-conflict=current][data-hovered]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--mix-light:80%;--mix-dark:70%}}[data-merge-conflict=current]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--diffs-computed-diff-line-bg:light-dark(color-mix(in lab, var(--diffs-computed-decoration-bg) var(--mix-light), var(--diffs-diff-line-mix-target)),color-mix(in lab, var(--diffs-computed-decoration-bg) var(--mix-dark), var(--diffs-diff-line-mix-target)));--diffs-computed-selected-line-bg:var(--diffs-computed-diff-line-bg);--diffs-line-bg:var(--diffs-computed-diff-line-bg,inherit)}[data-merge-conflict=incoming]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--diffs-diff-line-mix-target:var(--conflict-bg-incoming-override,var(--diffs-modified-base))}[data-merge-conflict=incoming]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]):where([data-gutter-buffer],[data-column-number]){color:var(--diffs-modified-base);--diffs-diff-line-mix-target:var(--conflict-bg-incoming-number-override,var(--diffs-modified-base))}@media (pointer:fine){[data-merge-conflict=incoming][data-hovered]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--mix-light:80%;--mix-dark:70%}}[data-merge-conflict=incoming]:is(:where([data-background]) [data-gutter-buffer],:where([data-background]) [data-column-number],:where([data-background]) [data-line],:where([data-background]) [data-no-newline]){--diffs-computed-diff-line-bg:light-dark(color-mix(in lab, var(--diffs-computed-decoration-bg) var(--mix-light), var(--diffs-diff-line-mix-target)),color-mix(in lab, var(--diffs-computed-decoration-bg) var(--mix-dark), var(--diffs-diff-line-mix-target)));--diffs-computed-selected-line-bg:var(--diffs-computed-diff-line-bg);--diffs-line-bg:var(--diffs-computed-diff-line-bg,inherit)}[data-gutter-buffer],[data-column-number],[data-line],[data-line-annotation],[data-merge-conflict],[data-merge-conflict-actions],[data-no-newline]{--diffs-selection-mix-target:var(--diffs-bg-selection-override,var(--diffs-selection-base))}[data-selected-line]:is([data-gutter-buffer],[data-column-number],[data-line],[data-line-annotation],[data-merge-conflict],[data-merge-conflict-actions],[data-no-newline]):where([data-line],[data-line-annotation],[data-merge-conflict],[data-merge-conflict-actions],[data-no-newline]){--mix-selection-light:82%;--mix-selection-dark:75%}@media (pointer:fine){[data-selected-line][data-hovered]:is([data-gutter-buffer],[data-column-number],[data-line],[data-line-annotation],[data-merge-conflict],[data-merge-conflict-actions],[data-no-newline]):where([data-line],[data-line-annotation],[data-merge-conflict],[data-merge-conflict-actions],[data-no-newline]):not([data-merge-conflict],[data-line-type=change-addition],[data-line-type=change-deletion]){--mix-selection-light:75%;--mix-selection-dark:70%}}[data-selected-line]:is([data-gutter-buffer],[data-column-number],[data-line],[data-line-annotation],[data-merge-conflict],[data-merge-conflict-actions],[data-no-newline]):where([data-gutter-buffer],[data-column-number]){--mix-selection-light:75%;--mix-selection-dark:60%;--diffs-selection-mix-target:var(--diffs-bg-selection-number-override,var(--diffs-selection-base))}@media (pointer:fine){[data-selected-line][data-hovered]:is([data-gutter-buffer],[data-column-number],[data-line],[data-line-annotation],[data-merge-conflict],[data-merge-conflict-actions],[data-no-newline]):where([data-gutter-buffer],[data-column-number]):not([data-merge-conflict],[data-line-type=change-addition],[data-line-type=change-deletion]){--mix-selection-light:70%;--mix-selection-dark:55%}}[data-selected-line]:is([data-gutter-buffer],[data-column-number],[data-line],[data-line-annotation],[data-merge-conflict],[data-merge-conflict-actions],[data-no-newline]){--diffs-computed-selected-line-bg:light-dark(color-mix(in lab, var(--diffs-computed-diff-line-bg) var(--mix-selection-light), var(--diffs-selection-mix-target)),color-mix(in lab, var(--diffs-computed-diff-line-bg) var(--mix-selection-dark), var(--diffs-selection-mix-target)));--diffs-line-bg:var(--diffs-computed-selected-line-bg,inherit)}[data-selected-line]:is([data-gutter-buffer],[data-column-number]){color:var(--diffs-selection-number-fg)}[data-no-newline]{-webkit-user-select:none;user-select:none}[data-no-newline] span{opacity:.6}[data-diff-type=split][data-overflow=scroll]{grid-template-columns:1fr 1fr;display:grid}[data-diff-type=split][data-overflow=scroll] [data-additions]{border-left:1px solid var(--diffs-bg)}[data-diff-type=split][data-overflow=scroll] [data-deletions]{border-right:1px solid var(--diffs-bg)}[data-code]{grid-auto-flow:dense;grid-template-columns:var(--diffs-code-grid);overflow:var(--diffs-overflow-override,scroll) clip;overscroll-behavior-x:none;tab-size:var(--diffs-tab-size,2);padding-top:var(--diffs-gap-block,var(--diffs-gap-fallback));padding-bottom:max(0px, calc(var(--diffs-gap-block,var(--diffs-gap-fallback)) - var(--diffs-scrollbar-gutter)));scrollbar-gutter:stable;align-self:flex-start;display:grid}[data-diffs-scrollbar-measure]{opacity:0;pointer-events:none;scrollbar-gutter:auto;grid-template-columns:none;width:100px;height:100px;padding:0;position:absolute;top:-200px;left:-200px}[data-container-size]{container-type:inline-size}[data-code]::-webkit-scrollbar{width:0;height:var(--diffs-scrollbar-gutter)}[data-code]::-webkit-scrollbar-track{background:0 0}[data-code]::-webkit-scrollbar-thumb{background-color:#0000;background-clip:content-box;border:1px solid #0000;border-radius:3px}[data-code]::-webkit-scrollbar-corner{background-color:#0000}@supports ((-moz-appearance:none)){[data-code]{scrollbar-width:thin;scrollbar-color:var(--diffs-bg-context) transparent;padding-bottom:var(--diffs-gap-block,var(--diffs-gap-fallback))}}:is([data-diffs-header]~[data-diff],[data-diffs-header]~[data-file]) [data-code],[data-overflow=wrap]:is([data-diffs-header]~[data-diff],[data-diffs-header]~[data-file]){padding-top:0}[data-gutter]{grid-template-rows:subgrid;grid-template-columns:subgrid;z-index:3;background-color:var(--diffs-bg);grid-column:1;display:grid;position:relative}[data-gutter] [data-gutter-buffer],[data-gutter] [data-column-number]{border-right:var(--diffs-gap-style,2px solid var(--diffs-bg))}[data-content]{grid-template-rows:subgrid;grid-template-columns:subgrid;background-color:var(--diffs-bg);grid-column:2;min-width:0;display:grid}[data-diff-type=split][data-overflow=wrap]{grid-auto-flow:dense;grid-template-columns:repeat(2, var(--diffs-code-grid));padding-block:var(--diffs-gap-block,var(--diffs-gap-fallback));display:grid}[data-diff-type=split][data-overflow=wrap] [data-deletions]{display:contents}:is([data-diff-type=split][data-overflow=wrap] [data-deletions]) [data-gutter]{grid-column:1}:is([data-diff-type=split][data-overflow=wrap] [data-deletions]) [data-content]{border-right:1px solid var(--diffs-bg);grid-column:2}[data-diff-type=split][data-overflow=wrap] [data-additions]{display:contents}:is([data-diff-type=split][data-overflow=wrap] [data-additions]) [data-gutter]{border-left:1px solid var(--diffs-bg);grid-column:3}:is([data-diff-type=split][data-overflow=wrap] [data-additions]) [data-content]{grid-column:4}[data-overflow=scroll] [data-gutter]{position:sticky;left:0}[data-interactive-lines] [data-line]{cursor:pointer}[data-interactive-line-numbers] [data-column-number]{cursor:pointer;touch-action:none}[data-content-buffer],[data-gutter-buffer]{-webkit-user-select:none;user-select:none;min-height:1lh;position:relative}[data-gutter-buffer]{padding-left:2ch;padding-right:1ch}[data-gutter-buffer]:before{content:"";min-width:var(--diffs-min-number-column-width,var(--diffs-min-number-column-width-default,3ch));display:block}[data-gutter-buffer=annotation]{--diffs-annotation-bg:var(--diffs-bg-context-gutter);min-height:0}[data-gutter-buffer=buffer]{--diffs-line-bg:var(--diffs-bg-context-gutter)}[data-content-buffer]{background-position:5px 0;background-size:8px 8px;background-origin:border-box;background-image:repeating-linear-gradient(-45deg, transparent, transparent 4.242px, var(--diffs-bg-buffer) 4.242px, var(--diffs-bg-buffer) 5.656px);grid-column:1}[data-separator]{box-sizing:content-box;background-color:var(--diffs-bg)}[data-separator=simple]{min-height:4px}[data-separator=line-info],[data-separator=line-info-basic],[data-separator=metadata],[data-separator=simple]{background-color:var(--diffs-bg-separator)}[data-separator=line-info],[data-separator=line-info-basic],[data-separator=metadata]{height:32px;position:relative}[data-separator-wrapper]{-webkit-user-select:none;user-select:none;fill:currentColor;background-color:var(--diffs-bg);align-items:center;height:100%;display:flex;position:absolute;inset-inline:0}[data-content] [data-separator-wrapper]{display:none}[data-separator=metadata] [data-separator-wrapper]{background-color:var(--diffs-bg-separator);height:100%;color:var(--diffs-fg-number);white-space:nowrap;text-overflow:ellipsis;min-width:min-content;padding-inline:1ch;inset-inline:100% auto;overflow:hidden}[data-separator=line-info]{margin-block:var(--diffs-gap-block,var(--diffs-gap-fallback))}[data-separator=line-info] [data-separator-wrapper]{min-width:16px}[data-separator=line-info-basic],[data-separator=metadata]{margin-block:0}[data-separator=line-info][data-separator-first]{margin-top:0}[data-separator=line-info][data-separator-last]{margin-bottom:0}[data-expand-index] [data-separator-wrapper]{grid-template-columns:32px auto;display:grid}[data-expand-index] [data-separator-wrapper][data-separator-multi-button]{grid-template-columns:32px 32px auto}[data-expand-button],[data-separator-content]{background-color:var(--diffs-bg-separator);flex:none;align-items:center;display:flex}[data-expand-index] [data-separator-content]:hover{cursor:pointer;text-decoration:underline}[data-expand-button]{cursor:pointer;min-width:32px;color:var(--diffs-fg-number);border-right:2px solid var(--diffs-bg);flex-shrink:0;justify-content:center;align-self:stretch}[data-expand-button]:hover{color:var(--diffs-fg)}[data-expand-button][data-expand-all-button]{display:none}[data-expand-down] [data-icon]{transform:scaleY(-1)}[data-separator-content]{height:100%;color:var(--diffs-fg-number);flex:auto;justify-content:flex-start;padding:0 1ch;overflow:hidden}:is([data-separator=line-info],[data-separator=line-info-basic]) [data-separator-content]{-webkit-user-select:none;user-select:none;height:100%;overflow:clip}[data-unmodified-lines]{text-overflow:ellipsis;white-space:nowrap;flex:0 auto;min-width:0;display:block;overflow:hidden}@supports (width:1cqi){[data-unified] [data-separator=line-info] [data-separator-wrapper]{padding-inline:var(--diffs-gap-inline,var(--diffs-gap-fallback));width:100cqi}:is([data-unified] [data-separator=line-info] [data-separator-wrapper]) [data-separator-content]{border-radius:6px}[data-unified] [data-separator=line-info][data-expand-index] [data-separator-wrapper] [data-separator-content]{border-top-left-radius:unset;border-bottom-left-radius:unset}[data-gutter] [data-separator=line-info] [data-separator-wrapper]{padding-left:var(--diffs-gap-inline,var(--diffs-gap-fallback))}[data-gutter] [data-separator=line-info] [data-separator-content]{border-top-left-radius:6px;border-bottom-left-radius:6px}[data-gutter] [data-separator=line-info][data-expand-index] [data-separator-content]{border-top-left-radius:unset;border-bottom-left-radius:unset}[data-additions] [data-content] [data-separator=line-info]{background-color:var(--diffs-bg)}:is([data-additions] [data-content] [data-separator=line-info]) [data-separator-wrapper]{display:none}[data-additions] [data-gutter] [data-separator=line-info] [data-separator-wrapper]{background-color:var(--diffs-bg-separator);border-top-right-radius:6px;border-bottom-right-radius:6px;height:100%;display:block}:is([data-additions] [data-gutter] [data-separator=line-info] [data-separator-wrapper]) [data-separator-content],:is([data-additions] [data-gutter] [data-separator=line-info] [data-separator-wrapper]) [data-expand-button]{display:none}[data-overflow=scroll] [data-additions] [data-gutter] [data-separator=line-info] [data-separator-wrapper]{width:calc(100cqi - var(--diffs-gap-inline,var(--diffs-gap-fallback)))}[data-overflow=wrap] [data-additions] [data-content] [data-separator=line-info] [data-separator-wrapper]{background-color:var(--diffs-bg-separator);height:100%;margin-right:var(--diffs-gap-inline,var(--diffs-gap-fallback));border-top-right-radius:6px;border-bottom-right-radius:6px;display:block}:is([data-overflow=wrap] [data-additions] [data-content] [data-separator=line-info] [data-separator-wrapper]) [data-separator-content],:is([data-overflow=wrap] [data-additions] [data-content] [data-separator=line-info] [data-separator-wrapper]) [data-expand-button]{display:none}:is([data-separator=line-info] [data-separator-wrapper]) [data-expand-both],:is([data-separator=line-info] [data-separator-wrapper]) [data-expand-down],:is([data-separator=line-info] [data-separator-wrapper]) [data-expand-up]{border-top-left-radius:6px;border-bottom-left-radius:6px}@media (pointer:fine){[data-separator-multi-button]:is([data-separator=line-info] [data-separator-wrapper]) [data-expand-up]{border-top-left-radius:6px;border-bottom-left-radius:unset}[data-separator-multi-button]:is([data-separator=line-info] [data-separator-wrapper]) [data-expand-down]{border-bottom-left-radius:6px;border-top-left-radius:unset}}}@media (pointer:coarse){[data-separator=line-info-basic] [data-separator-wrapper][data-separator-multi-button]{grid-template-columns:34px 34px auto}:is([data-separator=line-info-basic] [data-separator-wrapper][data-separator-multi-button]) [data-separator-content]{grid-column:unset;grid-row:unset}@supports (width:1cqi){:is([data-separator=line-info] [data-separator-wrapper]) [data-expand-both],:is([data-separator=line-info] [data-separator-wrapper]) [data-expand-down],:is([data-separator=line-info] [data-separator-wrapper]) [data-expand-up],[data-separator-multi-button]:is([data-separator=line-info] [data-separator-wrapper]) [data-expand-up]{border-top-left-radius:6px;border-bottom-left-radius:6px}[data-separator-multi-button]:is([data-separator=line-info] [data-separator-wrapper]) [data-expand-down]{border-bottom-left-radius:unset;border-top-left-radius:unset}}}@media (pointer:fine){[data-separator-wrapper][data-separator-multi-button]{grid-template-rows:50% 50%;display:grid}[data-separator-wrapper][data-separator-multi-button] [data-separator-content]{grid-area:1/2/-1;min-width:min-content}[data-separator-wrapper][data-separator-multi-button] [data-expand-button]{grid-column:1}[data-separator=line-info] [data-separator-wrapper],[data-separator=line-info] [data-separator-wrapper][data-separator-multi-button]{grid-template-columns:34px auto}[data-separator=line-info-basic][data-expand-index] [data-separator-wrapper]{grid-template-columns:100% auto}:is(:is([data-separator=line-info],[data-separator=line-info-basic]) [data-separator-multi-button]) [data-expand-up]{border-bottom:1px solid var(--diffs-bg);border-right:2px solid var(--diffs-bg)}:is(:is([data-separator=line-info],[data-separator=line-info-basic]) [data-separator-multi-button]) [data-expand-down]{border-top:1px solid var(--diffs-bg);border-right:2px solid var(--diffs-bg)}}[data-additions] [data-gutter] [data-separator-wrapper],[data-additions] [data-separator=line-info-basic] [data-separator-wrapper],[data-content] [data-separator-wrapper]{display:none}[data-line-annotation]{min-height:var(--diffs-annotation-min-height,0);z-index:2}[data-merge-conflict-actions]{z-index:2}[data-separator=custom]{grid-template-columns:subgrid;display:grid}[data-line],[data-column-number],[data-no-newline]{padding-inline:1ch;position:relative}[data-indicators=classic] [data-line]{padding-inline-start:2ch}:is([data-no-newline]:is([data-indicators=classic] [data-line-type=change-addition],[data-indicators=classic] [data-line-type=change-deletion]),[data-line]:is([data-indicators=classic] [data-line-type=change-addition],[data-indicators=classic] [data-line-type=change-deletion])):before{-webkit-user-select:none;user-select:none;width:1ch;height:1lh;display:inline-block;position:absolute;top:0;left:0}:is([data-line]:is([data-indicators=classic] [data-line-type=change-addition]),[data-no-newline]:is([data-indicators=classic] [data-line-type=change-addition])):before{content:"+";color:var(--diffs-addition-base)}:is([data-line]:is([data-indicators=classic] [data-line-type=change-deletion]),[data-no-newline]:is([data-indicators=classic] [data-line-type=change-deletion])):before{content:"-";color:var(--diffs-deletion-base)}[data-column-number]:is([data-indicators=bars] [data-line-type=change-deletion],[data-indicators=bars] [data-line-type=change-addition]):before{content:"";-webkit-user-select:none;user-select:none;contain:strict;width:4px;height:100%;display:block;position:absolute;top:0;left:0}[data-column-number]:is([data-indicators=bars] [data-line-type=change-deletion]):before{background-image:linear-gradient(0deg, var(--diffs-bg-deletion) 50%, var(--diffs-deletion-base) 50%);background-repeat:repeat;background-size:2px 2px;background-size:calc(1lh/round(1lh / 2px)) calc(1lh/round(1lh / 2px))}[data-column-number]:is([data-indicators=bars] [data-line-type=change-addition]):before{background-color:var(--diffs-addition-base)}[data-overflow=wrap] [data-line],[data-overflow=wrap] [data-annotation-content]{white-space:pre-wrap;word-break:break-word}[data-overflow=scroll] [data-line]{white-space:pre;min-height:1lh}[data-column-number]{box-sizing:content-box;text-align:right;-webkit-user-select:none;user-select:none;color:var(--diffs-fg-number);padding-left:2ch}[data-line-number-content]{min-width:var(--diffs-min-number-column-width,var(--diffs-min-number-column-width-default,3ch));z-index:1;display:inline-block;position:relative}[data-disable-line-numbers] [data-gutter-buffer],[data-disable-line-numbers] [data-column-number]{min-width:4px;padding:0}:is([data-disable-line-numbers] [data-gutter-buffer],[data-disable-line-numbers] [data-column-number]):before{min-width:0}[data-disable-line-numbers] [data-line-number-content]{display:none}[data-disable-line-numbers] [data-gutter-utility-slot]{right:unset;justify-content:flex-start;left:0}[data-disable-line-numbers][data-indicators=bars] [data-gutter-utility-slot]{left:6px}[data-file][data-disable-line-numbers] [data-gutter-buffer],[data-file][data-disable-line-numbers] [data-column-number]{border-right:0;min-width:0}[data-diff-span]{-webkit-box-decoration-break:clone;box-decoration-break:clone;border-radius:3px}[data-line-type=change-addition] [data-diff-span]{background-color:var(--diffs-bg-addition-emphasis)}[data-line-type=change-deletion] [data-diff-span]{background-color:var(--diffs-bg-deletion-emphasis)}[data-merge-conflict=marker-start],[data-merge-conflict=marker-base],[data-merge-conflict=marker-separator],[data-merge-conflict=marker-end]{color:var(--diffs-fg);padding-left:1ch}[data-merge-conflict=marker-start],[data-merge-conflict=marker-end]{align-items:center;display:flex}:is([data-merge-conflict=marker-start],[data-merge-conflict=marker-end]):after{color:var(--diffs-fg-conflict-marker);font-size:.75rem;font-style:normal;line-height:1.25rem;font-family:var(--diffs-header-font-family,var(--diffs-header-font-fallback));padding-left:1ch}[data-merge-conflict=marker-start]:after{content:"(Current Change)"}[data-merge-conflict=marker-end]:after{content:"(Incoming Change)"}[data-merge-conflict-actions-content]{min-height:1.75rem;font-family:var(--diffs-header-font-family,var(--diffs-header-font-fallback));color:var(--diffs-fg);align-items:center;gap:.25rem;padding-inline:.5rem;font-size:.75rem;line-height:1.2;display:flex}[data-merge-conflict-action]{appearance:none;color:var(--diffs-fg-number);font:inherit;cursor:pointer;background:0 0;border:0;padding:0;font-style:normal}[data-merge-conflict-action]:hover{color:var(--diffs-fg)}[data-merge-conflict-action=current]:hover{color:var(--diffs-addition-base)}[data-merge-conflict-action=incoming]:hover{color:var(--diffs-modified-base)}[data-merge-conflict-action-separator]{color:var(--diffs-fg-number);opacity:.6;-webkit-user-select:none;user-select:none}[data-diffs-header=default]{background-color:var(--diffs-bg);justify-content:space-between;align-items:center;gap:var(--diffs-gap-inline,var(--diffs-gap-fallback));min-height:calc(1lh + var(--diffs-gap-block,var(--diffs-gap-fallback))*3);z-index:2;flex-direction:row;padding-inline:16px;display:flex;position:relative;top:0}[data-header-content]{align-items:center;gap:var(--diffs-gap-inline,var(--diffs-gap-fallback));white-space:nowrap;flex-direction:row;min-width:0;display:flex}[data-header-content] [data-prev-name],[data-header-content] [data-title]{text-overflow:ellipsis;white-space:nowrap;direction:rtl;min-width:0;overflow:hidden}[data-prev-name]{opacity:.7}[data-rename-icon]{fill:currentColor;flex-grow:0;flex-shrink:0}[data-diffs-header=default] [data-metadata]{white-space:nowrap;align-items:center;gap:1ch;display:flex}[data-diffs-header=default] [data-additions-count]{font-family:var(--diffs-font-family,var(--diffs-font-fallback));color:var(--diffs-addition-base)}[data-diffs-header=default] [data-deletions-count]{font-family:var(--diffs-font-family,var(--diffs-font-fallback));color:var(--diffs-deletion-base)}[data-change-icon]{fill:currentColor;flex-shrink:0}[data-change-icon=change],[data-change-icon=rename-pure],[data-change-icon=rename-changed]{color:var(--diffs-modified-base)}[data-change-icon=new]{color:var(--diffs-addition-base)}[data-change-icon=deleted]{color:var(--diffs-deletion-base)}[data-change-icon=file]{opacity:.6}[data-annotation-content]{z-index:2;isolation:isolate;align-self:flex-start;min-width:0;display:flow-root;position:relative}[data-overflow=scroll] [data-annotation-content],[data-overflow=scroll] [data-merge-conflict-actions-content]{width:var(--diffs-column-content-width,auto);left:var(--diffs-column-number-width,0);position:sticky}[data-annotation-slot]{text-wrap-mode:wrap;word-break:normal;white-space-collapse:collapse}[data-gutter-utility-slot]{touch-action:none;justify-content:flex-end;display:flex;position:absolute;top:0;bottom:0;right:0}[data-utility-button]{appearance:none;cursor:pointer;width:1lh;height:1lh;font-size:var(--diffs-font-size,13px);line-height:var(--diffs-line-height,20px);background-color:var(--diffs-modified-base);color:var(--diffs-bg);fill:currentColor;z-index:4;touch-action:none;border:none;border-radius:4px;justify-content:center;align-items:center;margin-right:calc(1ch - 1lh);padding:0;display:flex;position:relative}[data-utility-button]:before{content:"";display:block;position:absolute;inset:0 0 0 -4px}[data-decoration-bar-stack]{pointer-events:none;isolation:isolate;z-index:1;background-color:var(--diffs-decoration-bar-color,transparent);box-sizing:content-box;border-left:2px solid var(--diffs-bg);border-right:2px solid var(--diffs-bg);width:6px;position:absolute;top:0;bottom:0;right:-2px}[data-decoration-bar-depth="1"] [data-decoration-bar-stack]{background-color:color-mix(in lab, var(--diffs-bg) 20%, var(--diffs-decoration-bar-color,transparent))}[data-decoration-bar-depth="2"] [data-decoration-bar-stack]{background-color:color-mix(in lab, var(--diffs-bg) 45%, var(--diffs-decoration-bar-color,transparent))}[data-decoration-bar-depth="3"] [data-decoration-bar-stack]{background-color:color-mix(in lab, var(--diffs-bg) 65%, var(--diffs-decoration-bar-color,transparent))}[data-decoration-bar-start] [data-decoration-bar-stack]{border-top-left-radius:5px;border-top-right-radius:5px}[data-decoration-bar-end] [data-decoration-bar-stack]{z-index:3;border-bottom-right-radius:5px;border-bottom-left-radius:5px}[data-placeholder]{contain:strict}[data-error-wrapper]{padding:var(--diffs-gap-block,var(--diffs-gap-fallback)) var(--diffs-gap-inline,var(--diffs-gap-fallback));scrollbar-width:none;max-height:400px;overflow:auto}[data-error-wrapper] [data-error-message]{color:var(--diffs-deletion-base);font-size:18px;font-weight:700}[data-error-wrapper] [data-error-stack]{color:var(--diffs-fg-number)}}@layer theme,rendered,unsafe;
@layer theme {
}</style><style data-theme-css="">@layer base, theme, rendered, unsafe;
@layer rendered {
:host {
--diffs-scrollbar-gutter-measured: var(--diffs-scrollbar-gutter-fallback);
--diffs-dark:#fafafa;--diffs-dark-bg:#0a0a0a;--diffs-dark-addition-color:#07c480;--diffs-dark-deletion-color:#ff2e3f;--diffs-dark-modified-color:#009fff;--diffs-light:#0a0a0a;--diffs-light-bg:#ffffff;--diffs-light-addition-color:#18a46c;--diffs-light-deletion-color:#d52c36;--diffs-light-modified-color:#009fff;
}
}</style><div data-diffs-header="default" data-change-type="change"><div data-header-content=""><slot name="header-prefix"></slot><svg width="16" height="16" viewBox="0 0 16 16" data-change-icon="change"><use href="#diffs-icon-symbol-modified"></use></svg><div data-title=""><bdi>Dreamio/NativePlayerViewController.swift</bdi></div></div><div data-metadata=""><span data-deletions-count="">-1</span><span data-additions-count="">+18</span><slot name="header-metadata"></slot></div></div><pre data-diff="" data-diff-type="split" data-overflow="scroll" data-background="" data-indicators="bars" tabindex="0" style="--diffs-min-number-column-width-default:3ch;" data-dehydrated=""><code data-code="" data-container-size="" data-deletions=""><div data-gutter="" style="grid-row: span 60"><div data-separator="line-info" data-separator-first=""><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">35 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="36" data-line-index="35,35"><span data-line-number-content="">36</span></div><div data-line-type="context" data-column-number="37" data-line-index="36,36"><span data-line-number-content="">37</span></div><div data-line-type="context" data-column-number="38" data-line-index="37,37"><span data-line-number-content="">38</span></div><div data-gutter-buffer="buffer" data-buffer-size="7" style="grid-row: span 7;min-height:calc(7 * 1lh);"></div><div data-line-type="context" data-column-number="39" data-line-index="45,45"><span data-line-number-content="">39</span></div><div data-line-type="context" data-column-number="40" data-line-index="46,46"><span data-line-number-content="">40</span></div><div data-line-type="context" data-column-number="41" data-line-index="47,47"><span data-line-number-content="">41</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">125 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="167" data-line-index="173,173"><span data-line-number-content="">167</span></div><div data-line-type="context" data-column-number="168" data-line-index="174,174"><span data-line-number-content="">168</span></div><div data-line-type="context" data-column-number="169" data-line-index="175,175"><span data-line-number-content="">169</span></div><div data-gutter-buffer="buffer" data-buffer-size="1" style="grid-row: span 1;min-height:calc(1 * 1lh);"></div><div data-line-type="context" data-column-number="170" data-line-index="177,177"><span data-line-number-content="">170</span></div><div data-line-type="context" data-column-number="171" data-line-index="178,178"><span data-line-number-content="">171</span></div><div data-line-type="context" data-column-number="172" data-line-index="179,179"><span data-line-number-content="">172</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">9 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="182" data-line-index="189,189"><span data-line-number-content="">182</span></div><div data-line-type="context" data-column-number="183" data-line-index="190,190"><span data-line-number-content="">183</span></div><div data-line-type="context" data-column-number="184" data-line-index="191,191"><span data-line-number-content="">184</span></div><div data-line-type="change-deletion" data-column-number="185" data-line-index="192,192"><span data-line-number-content="">185</span></div><div data-line-type="context" data-column-number="186" data-line-index="194,193"><span data-line-number-content="">186</span></div><div data-line-type="context" data-column-number="187" data-line-index="195,194"><span data-line-number-content="">187</span></div><div data-line-type="context" data-column-number="188" data-line-index="196,195"><span data-line-number-content="">188</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">19 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="208" data-line-index="216,215"><span data-line-number-content="">208</span></div><div data-line-type="context" data-column-number="209" data-line-index="217,216"><span data-line-number-content="">209</span></div><div data-line-type="context" data-column-number="210" data-line-index="218,217"><span data-line-number-content="">210</span></div><div data-gutter-buffer="buffer" data-buffer-size="5" style="grid-row: span 5;min-height:calc(5 * 1lh);"></div><div data-line-type="context" data-column-number="211" data-line-index="224,223"><span data-line-number-content="">211</span></div><div data-line-type="context" data-column-number="212" data-line-index="225,224"><span data-line-number-content="">212</span></div><div data-line-type="context" data-column-number="213" data-line-index="226,225"><span data-line-number-content="">213</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">124 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="338" data-line-index="351,350"><span data-line-number-content="">338</span></div><div data-line-type="context" data-column-number="339" data-line-index="352,351"><span data-line-number-content="">339</span></div><div data-line-type="context" data-column-number="340" data-line-index="353,352"><span data-line-number-content="">340</span></div><div data-gutter-buffer="buffer" data-buffer-size="2" style="grid-row: span 2;min-height:calc(2 * 1lh);"></div><div data-line-type="context" data-column-number="341" data-line-index="356,355"><span data-line-number-content="">341</span></div><div data-line-type="context" data-column-number="342" data-line-index="357,356"><span data-line-number-content="">342</span></div><div data-line-type="context" data-column-number="343" data-line-index="358,357"><span data-line-number-content="">343</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">2 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="346" data-line-index="361,360"><span data-line-number-content="">346</span></div><div data-line-type="context" data-column-number="347" data-line-index="362,361"><span data-line-number-content="">347</span></div><div data-line-type="context" data-column-number="348" data-line-index="363,362"><span data-line-number-content="">348</span></div><div data-gutter-buffer="buffer" data-buffer-size="2" style="grid-row: span 2;min-height:calc(2 * 1lh);"></div><div data-line-type="context" data-column-number="349" data-line-index="366,365"><span data-line-number-content="">349</span></div><div data-line-type="context" data-column-number="350" data-line-index="367,366"><span data-line-number-content="">350</span></div><div data-line-type="context" data-column-number="351" data-line-index="368,367"><span data-line-number-content="">351</span></div></div><div data-content="" style="grid-row: span 60"><div data-separator="line-info" data-separator-first=""><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">35 unmodified lines</span></div></div></div><div data-line="36" data-alt-line="36" data-line-type="context" data-line-index="35,35"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> return</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view</span></div><div data-line="37" data-alt-line="37" data-line-type="context" data-line-index="36,36"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> }</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">()</span></div><div data-line="38" data-alt-line="38" data-line-type="context" data-line-index="37,37">
</div><div data-content-buffer="" data-buffer-size="7" style="grid-row: span 7;min-height:calc(7 * 1lh)"></div><div data-line="39" data-alt-line="46" data-line-type="context" data-line-index="45,45"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> playPauseButton </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> NativePlayerViewController.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">iconButton</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">systemName</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "pause.fill"</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">, label</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "Play or Pause"</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="40" data-alt-line="47" data-line-type="context" data-line-index="46,46"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> jumpBackButton </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> NativePlayerViewController.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">iconButton</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">systemName</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "gobackward.15"</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">, label</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "Jump Back 15 Seconds"</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="41" data-alt-line="48" data-line-type="context" data-line-index="47,47"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> jumpForwardButton </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> NativePlayerViewController.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">iconButton</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">systemName</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "goforward.15"</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">, label</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "Jump Forward 15 Seconds"</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">125 unmodified lines</span></div></div></div><div data-line="167" data-alt-line="174" data-line-type="context" data-line-index="173,173">
</div><div data-line="168" data-alt-line="175" data-line-type="context" data-line-index="174,174"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#D568EA;--diffs-token-light:#A631BE"> func</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> configureLayout</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">()</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-line="169" data-alt-line="176" data-line-type="context" data-line-index="175,175"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addSubview</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">backend.view</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-content-buffer="" data-buffer-size="1" style="grid-row: span 1;min-height:calc(1 * 1lh)"></div><div data-line="170" data-alt-line="178" data-line-type="context" data-line-index="177,177"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addSubview</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">loadingView</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="171" data-alt-line="179" data-line-type="context" data-line-index="178,178"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addSubview</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">failureLabel</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="172" data-alt-line="180" data-line-type="context" data-line-index="179,179"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addSubview</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">controlsContainer</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">9 unmodified lines</span></div></div></div><div data-line="182" data-alt-line="190" data-line-type="context" data-line-index="189,189">
</div><div data-line="183" data-alt-line="191" data-line-type="context" data-line-index="190,190"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> tap </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> UITapGestureRecognizer</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">target</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#FFAB16;--diffs-token-light:#D5901C"> self</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">, action</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> #selector</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">toggleControlsVisibility</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">))</span></div><div data-line="184" data-alt-line="192" data-line-type="context" data-line-index="191,191"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> tap.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">cancelsTouchesInView</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> false</span></div><div data-line="185" data-line-type="change-deletion" data-line-index="192,192"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> </span><span data-diff-span=""><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">view</span></span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addGestureRecognizer</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">tap</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="186" data-alt-line="194" data-line-type="context" data-line-index="194,193">
</div><div data-line="187" data-alt-line="195" data-line-type="context" data-line-index="195,194"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> controlRow </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> UIStackView</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">arrangedSubviews</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> [jumpBackButton, playPauseButton, jumpForwardButton, captionsButton]</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="188" data-alt-line="196" data-line-type="context" data-line-index="196,195"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> controlRow.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">translatesAutoresizingMaskIntoConstraints</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> false</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">19 unmodified lines</span></div></div></div><div data-line="208" data-alt-line="216" data-line-type="context" data-line-index="216,215"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> backend.view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">topAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">topAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="209" data-alt-line="217" data-line-type="context" data-line-index="217,216"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> backend.view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">bottomAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">bottomAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="210" data-alt-line="218" data-line-type="context" data-line-index="218,217">
</div><div data-content-buffer="" data-buffer-size="5" style="grid-row: span 5;min-height:calc(5 * 1lh)"></div><div data-line="211" data-alt-line="224" data-line-type="context" data-line-index="224,223"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> loadingView.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">centerXAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">centerXAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="212" data-alt-line="225" data-line-type="context" data-line-index="225,224"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> loadingView.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">centerYAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">centerYAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="213" data-alt-line="226" data-line-type="context" data-line-index="226,225">
</div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">124 unmodified lines</span></div></div></div><div data-line="338" data-alt-line="351" data-line-type="context" data-line-index="351,350"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> }</span></div><div data-line="339" data-alt-line="352" data-line-type="context" data-line-index="352,351">
</div><div data-line="340" data-alt-line="353" data-line-type="context" data-line-index="353,352"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#D568EA;--diffs-token-light:#A631BE"> func</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> revealControls</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">()</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-content-buffer="" data-buffer-size="2" style="grid-row: span 2;min-height:calc(2 * 1lh)"></div><div data-line="341" data-alt-line="356" data-line-type="context" data-line-index="356,355"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> UIView.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">animate</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">withDuration</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 0.18</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-line="342" data-alt-line="357" data-line-type="context" data-line-index="357,356"><span style="--diffs-token-dark:#FFAB16;--diffs-token-light:#D5901C"> self</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">controlsContainer</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">alpha</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 1</span></div><div data-line="343" data-alt-line="358" data-line-type="context" data-line-index="358,357"><span style="--diffs-token-dark:#FFAB16;--diffs-token-light:#D5901C"> self</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">closeButton</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">alpha</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 1</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">2 unmodified lines</span></div></div></div><div data-line="346" data-alt-line="361" data-line-type="context" data-line-index="361,360"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> }</span></div><div data-line="347" data-alt-line="362" data-line-type="context" data-line-index="362,361">
</div><div data-line="348" data-alt-line="363" data-line-type="context" data-line-index="363,362"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#D568EA;--diffs-token-light:#A631BE"> func</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> hideControls</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">()</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-content-buffer="" data-buffer-size="2" style="grid-row: span 2;min-height:calc(2 * 1lh)"></div><div data-line="349" data-alt-line="366" data-line-type="context" data-line-index="366,365"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> UIView.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">animate</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">withDuration</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 0.24</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-line="350" data-alt-line="367" data-line-type="context" data-line-index="367,366"><span style="--diffs-token-dark:#FFAB16;--diffs-token-light:#D5901C"> self</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">controlsContainer</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">alpha</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 0</span></div><div data-line="351" data-alt-line="368" data-line-type="context" data-line-index="368,367"><span style="--diffs-token-dark:#FFAB16;--diffs-token-light:#D5901C"> self</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">closeButton</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">alpha</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 0</span></div></div></code><code data-code="" data-container-size="" data-additions=""><div data-gutter="" style="grid-row: span 60"><div data-separator="line-info" data-separator-first=""><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">35 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="36" data-line-index="35,35"><span data-line-number-content="">36</span></div><div data-line-type="context" data-column-number="37" data-line-index="36,36"><span data-line-number-content="">37</span></div><div data-line-type="context" data-column-number="38" data-line-index="37,37"><span data-line-number-content="">38</span></div><div data-line-type="change-addition" data-column-number="39" data-line-index="38,38"><span data-line-number-content="">39</span></div><div data-line-type="change-addition" data-column-number="40" data-line-index="39,39"><span data-line-number-content="">40</span></div><div data-line-type="change-addition" data-column-number="41" data-line-index="40,40"><span data-line-number-content="">41</span></div><div data-line-type="change-addition" data-column-number="42" data-line-index="41,41"><span data-line-number-content="">42</span></div><div data-line-type="change-addition" data-column-number="43" data-line-index="42,42"><span data-line-number-content="">43</span></div><div data-line-type="change-addition" data-column-number="44" data-line-index="43,43"><span data-line-number-content="">44</span></div><div data-line-type="change-addition" data-column-number="45" data-line-index="44,44"><span data-line-number-content="">45</span></div><div data-line-type="context" data-column-number="46" data-line-index="45,45"><span data-line-number-content="">46</span></div><div data-line-type="context" data-column-number="47" data-line-index="46,46"><span data-line-number-content="">47</span></div><div data-line-type="context" data-column-number="48" data-line-index="47,47"><span data-line-number-content="">48</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">125 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="174" data-line-index="173,173"><span data-line-number-content="">174</span></div><div data-line-type="context" data-column-number="175" data-line-index="174,174"><span data-line-number-content="">175</span></div><div data-line-type="context" data-column-number="176" data-line-index="175,175"><span data-line-number-content="">176</span></div><div data-line-type="change-addition" data-column-number="177" data-line-index="176,176"><span data-line-number-content="">177</span></div><div data-line-type="context" data-column-number="178" data-line-index="177,177"><span data-line-number-content="">178</span></div><div data-line-type="context" data-column-number="179" data-line-index="178,178"><span data-line-number-content="">179</span></div><div data-line-type="context" data-column-number="180" data-line-index="179,179"><span data-line-number-content="">180</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">9 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="190" data-line-index="189,189"><span data-line-number-content="">190</span></div><div data-line-type="context" data-column-number="191" data-line-index="190,190"><span data-line-number-content="">191</span></div><div data-line-type="context" data-column-number="192" data-line-index="191,191"><span data-line-number-content="">192</span></div><div data-line-type="change-addition" data-column-number="193" data-line-index="193,192"><span data-line-number-content="">193</span></div><div data-line-type="context" data-column-number="194" data-line-index="194,193"><span data-line-number-content="">194</span></div><div data-line-type="context" data-column-number="195" data-line-index="195,194"><span data-line-number-content="">195</span></div><div data-line-type="context" data-column-number="196" data-line-index="196,195"><span data-line-number-content="">196</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">19 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="216" data-line-index="216,215"><span data-line-number-content="">216</span></div><div data-line-type="context" data-column-number="217" data-line-index="217,216"><span data-line-number-content="">217</span></div><div data-line-type="context" data-column-number="218" data-line-index="218,217"><span data-line-number-content="">218</span></div><div data-line-type="change-addition" data-column-number="219" data-line-index="219,218"><span data-line-number-content="">219</span></div><div data-line-type="change-addition" data-column-number="220" data-line-index="220,219"><span data-line-number-content="">220</span></div><div data-line-type="change-addition" data-column-number="221" data-line-index="221,220"><span data-line-number-content="">221</span></div><div data-line-type="change-addition" data-column-number="222" data-line-index="222,221"><span data-line-number-content="">222</span></div><div data-line-type="change-addition" data-column-number="223" data-line-index="223,222"><span data-line-number-content="">223</span></div><div data-line-type="context" data-column-number="224" data-line-index="224,223"><span data-line-number-content="">224</span></div><div data-line-type="context" data-column-number="225" data-line-index="225,224"><span data-line-number-content="">225</span></div><div data-line-type="context" data-column-number="226" data-line-index="226,225"><span data-line-number-content="">226</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">124 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="351" data-line-index="351,350"><span data-line-number-content="">351</span></div><div data-line-type="context" data-column-number="352" data-line-index="352,351"><span data-line-number-content="">352</span></div><div data-line-type="context" data-column-number="353" data-line-index="353,352"><span data-line-number-content="">353</span></div><div data-line-type="change-addition" data-column-number="354" data-line-index="354,353"><span data-line-number-content="">354</span></div><div data-line-type="change-addition" data-column-number="355" data-line-index="355,354"><span data-line-number-content="">355</span></div><div data-line-type="context" data-column-number="356" data-line-index="356,355"><span data-line-number-content="">356</span></div><div data-line-type="context" data-column-number="357" data-line-index="357,356"><span data-line-number-content="">357</span></div><div data-line-type="context" data-column-number="358" data-line-index="358,357"><span data-line-number-content="">358</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">2 unmodified lines</span></div></div></div><div data-line-type="context" data-column-number="361" data-line-index="361,360"><span data-line-number-content="">361</span></div><div data-line-type="context" data-column-number="362" data-line-index="362,361"><span data-line-number-content="">362</span></div><div data-line-type="context" data-column-number="363" data-line-index="363,362"><span data-line-number-content="">363</span></div><div data-line-type="change-addition" data-column-number="364" data-line-index="364,363"><span data-line-number-content="">364</span></div><div data-line-type="change-addition" data-column-number="365" data-line-index="365,364"><span data-line-number-content="">365</span></div><div data-line-type="context" data-column-number="366" data-line-index="366,365"><span data-line-number-content="">366</span></div><div data-line-type="context" data-column-number="367" data-line-index="367,366"><span data-line-number-content="">367</span></div><div data-line-type="context" data-column-number="368" data-line-index="368,367"><span data-line-number-content="">368</span></div></div><div data-content="" style="grid-row: span 60"><div data-separator="line-info" data-separator-first=""><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">35 unmodified lines</span></div></div></div><div data-line="36" data-alt-line="36" data-line-type="context" data-line-index="35,35"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> return</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view</span></div><div data-line="37" data-alt-line="37" data-line-type="context" data-line-index="36,36"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> }</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">()</span></div><div data-line="38" data-alt-line="38" data-line-type="context" data-line-index="37,37">
</div><div data-line="39" data-line-type="change-addition" data-line-index="38,38"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> tapSurfaceView: UIView </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-line="40" data-line-type="change-addition" data-line-index="39,39"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> UIView</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">()</span></div><div data-line="41" data-line-type="change-addition" data-line-index="40,40"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">translatesAutoresizingMaskIntoConstraints</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> false</span></div><div data-line="42" data-line-type="change-addition" data-line-index="41,41"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">backgroundColor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> .</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">clear</span></div><div data-line="43" data-line-type="change-addition" data-line-index="42,42"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> return</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view</span></div><div data-line="44" data-line-type="change-addition" data-line-index="43,43"><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> }()</span></div><div data-line="45" data-line-type="change-addition" data-line-index="44,44">
</div><div data-line="46" data-alt-line="39" data-line-type="context" data-line-index="45,45"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> playPauseButton </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> NativePlayerViewController.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">iconButton</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">systemName</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "pause.fill"</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">, label</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "Play or Pause"</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="47" data-alt-line="40" data-line-type="context" data-line-index="46,46"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> jumpBackButton </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> NativePlayerViewController.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">iconButton</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">systemName</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "gobackward.15"</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">, label</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "Jump Back 15 Seconds"</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="48" data-alt-line="41" data-line-type="context" data-line-index="47,47"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> jumpForwardButton </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> NativePlayerViewController.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">iconButton</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">systemName</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "goforward.15"</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">, label</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#5ECC71;--diffs-token-light:#199F43"> "Jump Forward 15 Seconds"</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">125 unmodified lines</span></div></div></div><div data-line="174" data-alt-line="167" data-line-type="context" data-line-index="173,173">
</div><div data-line="175" data-alt-line="168" data-line-type="context" data-line-index="174,174"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#D568EA;--diffs-token-light:#A631BE"> func</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> configureLayout</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">()</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-line="176" data-alt-line="169" data-line-type="context" data-line-index="175,175"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addSubview</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">backend.view</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="177" data-line-type="change-addition" data-line-index="176,176"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addSubview</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">tapSurfaceView</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="178" data-alt-line="170" data-line-type="context" data-line-index="177,177"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addSubview</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">loadingView</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="179" data-alt-line="171" data-line-type="context" data-line-index="178,178"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addSubview</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">failureLabel</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="180" data-alt-line="172" data-line-type="context" data-line-index="179,179"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> view.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addSubview</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">controlsContainer</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">9 unmodified lines</span></div></div></div><div data-line="190" data-alt-line="182" data-line-type="context" data-line-index="189,189">
</div><div data-line="191" data-alt-line="183" data-line-type="context" data-line-index="190,190"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> tap </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> UITapGestureRecognizer</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">target</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#FFAB16;--diffs-token-light:#D5901C"> self</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">, action</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> #selector</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">toggleControlsVisibility</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">))</span></div><div data-line="192" data-alt-line="184" data-line-type="context" data-line-index="191,191"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> tap.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">cancelsTouchesInView</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> false</span></div><div data-line="193" data-line-type="change-addition" data-line-index="193,192"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> </span><span data-diff-span=""><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">tapSurfaceView</span></span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">addGestureRecognizer</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">tap</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="194" data-alt-line="186" data-line-type="context" data-line-index="194,193">
</div><div data-line="195" data-alt-line="187" data-line-type="context" data-line-index="195,194"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> let</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> controlRow </span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">=</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> UIStackView</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">arrangedSubviews</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> [jumpBackButton, playPauseButton, jumpForwardButton, captionsButton]</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span></div><div data-line="196" data-alt-line="188" data-line-type="context" data-line-index="196,195"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> controlRow.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">translatesAutoresizingMaskIntoConstraints</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> false</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">19 unmodified lines</span></div></div></div><div data-line="216" data-alt-line="208" data-line-type="context" data-line-index="216,215"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> backend.view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">topAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">topAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="217" data-alt-line="209" data-line-type="context" data-line-index="217,216"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> backend.view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">bottomAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">bottomAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="218" data-alt-line="210" data-line-type="context" data-line-index="218,217">
</div><div data-line="219" data-line-type="change-addition" data-line-index="219,218"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> tapSurfaceView.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">leadingAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">leadingAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="220" data-line-type="change-addition" data-line-index="220,219"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> tapSurfaceView.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">trailingAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">trailingAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="221" data-line-type="change-addition" data-line-index="221,220"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> tapSurfaceView.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">topAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">topAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="222" data-line-type="change-addition" data-line-index="222,221"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> tapSurfaceView.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">bottomAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">bottomAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="223" data-line-type="change-addition" data-line-index="223,222">
</div><div data-line="224" data-alt-line="211" data-line-type="context" data-line-index="224,223"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> loadingView.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">centerXAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">centerXAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="225" data-alt-line="212" data-line-type="context" data-line-index="225,224"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> loadingView.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">centerYAnchor</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">constraint</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">equalTo</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> view.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">centerYAnchor</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">,</span></div><div data-line="226" data-alt-line="213" data-line-type="context" data-line-index="226,225">
</div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">124 unmodified lines</span></div></div></div><div data-line="351" data-alt-line="338" data-line-type="context" data-line-index="351,350"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> }</span></div><div data-line="352" data-alt-line="339" data-line-type="context" data-line-index="352,351">
</div><div data-line="353" data-alt-line="340" data-line-type="context" data-line-index="353,352"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#D568EA;--diffs-token-light:#A631BE"> func</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> revealControls</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">()</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-line="354" data-line-type="change-addition" data-line-index="354,353"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> controlsContainer.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">isUserInteractionEnabled</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> true</span></div><div data-line="355" data-line-type="change-addition" data-line-index="355,354"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> closeButton.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">isUserInteractionEnabled</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> true</span></div><div data-line="356" data-alt-line="341" data-line-type="context" data-line-index="356,355"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> UIView.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">animate</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">withDuration</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 0.18</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-line="357" data-alt-line="342" data-line-type="context" data-line-index="357,356"><span style="--diffs-token-dark:#FFAB16;--diffs-token-light:#D5901C"> self</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">controlsContainer</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">alpha</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 1</span></div><div data-line="358" data-alt-line="343" data-line-type="context" data-line-index="358,357"><span style="--diffs-token-dark:#FFAB16;--diffs-token-light:#D5901C"> self</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">closeButton</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">alpha</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 1</span></div><div data-separator="line-info"><div data-separator-wrapper=""><div data-separator-content=""><span data-unmodified-lines="">2 unmodified lines</span></div></div></div><div data-line="361" data-alt-line="346" data-line-type="context" data-line-index="361,360"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> }</span></div><div data-line="362" data-alt-line="347" data-line-type="context" data-line-index="362,361">
</div><div data-line="363" data-alt-line="348" data-line-type="context" data-line-index="363,362"><span style="--diffs-token-dark:#FF678D;--diffs-token-light:#D32A61"> private</span><span style="--diffs-token-dark:#D568EA;--diffs-token-light:#A631BE"> func</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF"> hideControls</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">()</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-line="364" data-line-type="change-addition" data-line-index="364,363"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> controlsContainer.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">isUserInteractionEnabled</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> false</span></div><div data-line="365" data-line-type="change-addition" data-line-index="365,364"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> closeButton.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">isUserInteractionEnabled</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> false</span></div><div data-line="366" data-alt-line="349" data-line-type="context" data-line-index="366,365"><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A"> UIView.</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">animate</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">(</span><span style="--diffs-token-dark:#9D6AFB;--diffs-token-light:#693ACF">withDuration</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">:</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 0.24</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363">)</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> {</span></div><div data-line="367" data-alt-line="350" data-line-type="context" data-line-index="367,366"><span style="--diffs-token-dark:#FFAB16;--diffs-token-light:#D5901C"> self</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">controlsContainer</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">alpha</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 0</span></div><div data-line="368" data-alt-line="351" data-line-type="context" data-line-index="368,367"><span style="--diffs-token-dark:#FFAB16;--diffs-token-light:#D5901C"> self</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">closeButton</span><span style="--diffs-token-dark:#FAFAFA;--diffs-token-light:#0A0A0A">.</span><span style="--diffs-token-dark:#FFA359;--diffs-token-light:#D47628">alpha</span><span style="--diffs-token-dark:#636363;--diffs-token-light:#636363"> =</span><span style="--diffs-token-dark:#68CDF2;--diffs-token-light:#1CA1C7"> 0</span></div></div></code></pre>
</div>
</section>
<section>
<h2>Expected Impact for End-Users</h2>
<p>Users should be able to tap the native player to hide controls and tap the video again to bring them back. Auto-hidden controls should behave the same way, so playback is no longer trapped in a controls-hidden state.</p>
</section>
<section>
<h2>Validation</h2>
<div class="callout">
<p><span class="status-good">Passed:</span> <code>xcodebuild build -workspace Dreamio.xcworkspace -scheme Dreamio -destination 'generic/platform=iOS'</code></p>
</div>
<p>The build succeeded for the Dreamio scheme against a generic iOS destination. Manual on-device interaction was not run in this turn, so the remaining risk is limited to real touch behavior across physical device sizes.</p>
</section>
<section>
<h2>Issues, Limitations, and Mitigations</h2>
<ul>
<li>The fix is intentionally scoped to tap routing and hidden overlay hit testing. It does not change VLC playback state, seeking, captions, or close behavior.</li>
<li>Manual device testing is still useful because UIKit gesture delivery around embedded native video surfaces can vary with presentation details.</li>
<li>The Xcode build reports an existing warning that the MobileVLCKit preparation script has no declared outputs. This was not introduced by the tap fix.</li>
</ul>
</section>
<section>
<h2>Follow-up Work</h2>
<ul>
<li>No new follow-up issue is required for this fix.</li>
<li>Optional future improvement: add an injectable player overlay test harness so tap-to-show behavior can be exercised without launching MobileVLCKit on a device.</li>
</ul>
</section>
</main>
</body>
</html>