Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
184 changes: 87 additions & 97 deletions app/src/main/assets/web/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -546,45 +546,15 @@
background: rgba(255,255,255,0.35);
box-shadow: 0 0 0 1px rgba(0,0,0,0.35);
}
#split-toolbar-tap-zone {
display: none;
position: absolute;
top: 0;
left: 30%;
width: 40%;
height: 48px;
z-index: 230;
cursor: pointer;
pointer-events: none;
}
#player-shell.browser-split #split-toolbar-tap-zone,
#player-shell.freeform-split #split-toolbar-tap-zone {
display: block;
}
#split-pane-toolbar {
position: absolute;
top: 12px;
left: 50%;
transform: translateX(-50%);
z-index: 231;
display: none;
gap: 5px;
align-items: center;
background: rgba(0,0,0,0.6);
backdrop-filter: blur(10px);
border-radius: 999px;
padding: 4px 6px;
opacity: 0;
transition: opacity 0.25s ease;
pointer-events: none;
}
#split-pane-toolbar.visible {
opacity: 1;
pointer-events: auto;
}
#player-shell.browser-split #split-pane-toolbar,
#player-shell.freeform-split #split-pane-toolbar {
display: flex;
flex-shrink: 0;
}
.split-pane-btn {
border: none;
Expand Down Expand Up @@ -687,16 +657,6 @@
</div>
</div>
</div>
<div id="split-toolbar-tap-zone"></div>
<div id="split-pane-toolbar">
<button class="split-pane-btn split-ratio-btn" data-ratio="0.3">3:7</button>
<button class="split-pane-btn split-ratio-btn" data-ratio="0.4">4:6</button>
<button class="split-pane-btn split-ratio-btn active" data-ratio="0.5">5:5</button>
<button class="split-pane-btn split-ratio-btn" data-ratio="0.6">6:4</button>
<button class="split-pane-btn split-ratio-btn" data-ratio="0.7">7:3</button>
<div class="split-toolbar-sep"></div>
<button id="split-close-btn" class="split-pane-btn stop-btn">종료</button>
</div>
</div>
<div id="overlay">
<div id="status">Connecting...</div>
Expand All @@ -713,39 +673,94 @@
<button id="bubble-cancel" class="bubble-btn">취소</button>
</div>

<button id="home-btn" title="Home"
style="position:fixed;bottom:12px;left:12px;z-index:201;width:48px;height:48px;
border-radius:50%;border:none;background:rgba(0,0,0,0.6);
color:#fff;font-size:24px;cursor:pointer;backdrop-filter:blur(4px);
display:none;box-shadow:0 4px 6px rgba(0,0,0,0.3);">
&#x1F3E0;
</button>

<div id="density-control"
style="position:fixed;bottom:12px;left:72px;z-index:201;display:none;">
<button id="density-btn"
style="height:48px;padding:0 14px;border-radius:24px;border:none;
background:rgba(0,0,0,0.6);color:#fff;font-size:13px;
font-weight:500;cursor:pointer;backdrop-filter:blur(4px);
box-shadow:0 4px 6px rgba(0,0,0,0.3);
font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
white-space:nowrap;display:flex;align-items:center;gap:6px;">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="4" width="18" height="14" rx="2" ry="2"/>
<line x1="8" y1="20" x2="16" y2="20"/>
<line x1="12" y1="18" x2="12" y2="20"/>
<div id="overlay-menu"
style="position:fixed;bottom:12px;left:12px;z-index:201;display:none;align-items:center;gap:8px;">

<button id="overlay-menu-toggle" title="Menu"
aria-label="Open overlay menu" aria-expanded="false" aria-controls="overlay-menu-panel"
style="width:48px;height:48px;border-radius:50%;border:none;
background:rgba(0,0,0,0.6);color:#fff;cursor:pointer;
backdrop-filter:blur(4px);box-shadow:0 4px 6px rgba(0,0,0,0.3);
display:flex;align-items:center;justify-content:center;flex-shrink:0;">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor"
stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="3" y1="6" x2="21" y2="6"/>
<line x1="3" y1="12" x2="21" y2="12"/>
<line x1="3" y1="18" x2="21" y2="18"/>
</svg>
<span id="density-label">Small</span>
</button>
<div id="density-popup"
style="position:absolute;bottom:56px;left:0;
background:rgba(20,20,30,0.95);backdrop-filter:blur(10px);
border-radius:12px;padding:6px;display:none;
box-shadow:0 8px 24px rgba(0,0,0,0.5);
border:1px solid rgba(255,255,255,0.1);
min-width:140px;">
</div>
</div>

<div id="overlay-menu-panel" style="display:none;align-items:center;gap:8px;flex-wrap:wrap;row-gap:8px;max-width:calc(100vw - 72px);">

<button id="home-btn" title="Home"
style="width:48px;height:48px;border-radius:50%;border:none;
background:rgba(0,0,0,0.6);color:#fff;font-size:24px;cursor:pointer;
backdrop-filter:blur(4px);box-shadow:0 4px 6px rgba(0,0,0,0.3);
display:none;flex-shrink:0;">
&#x1F3E0;
</button>

<div id="density-control" style="position:relative;">
<button id="density-btn"
style="height:48px;padding:0 14px;border-radius:24px;border:none;
background:rgba(0,0,0,0.6);color:#fff;font-size:13px;
font-weight:500;cursor:pointer;backdrop-filter:blur(4px);
box-shadow:0 4px 6px rgba(0,0,0,0.3);
font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
white-space:nowrap;display:flex;align-items:center;gap:6px;">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect x="3" y="4" width="18" height="14" rx="2" ry="2"/>
<line x1="8" y1="20" x2="16" y2="20"/>
<line x1="12" y1="18" x2="12" y2="20"/>
</svg>
<span id="density-label">Small</span>
</button>
<div id="density-popup"
style="position:absolute;bottom:56px;left:0;
background:rgba(20,20,30,0.95);backdrop-filter:blur(10px);
border-radius:12px;padding:6px;display:none;
box-shadow:0 8px 24px rgba(0,0,0,0.5);
border:1px solid rgba(255,255,255,0.1);
min-width:140px;">
</div>
</div>

<!-- Playback Profile Control (relocated inside #overlay-menu-panel) -->
<div id="playback-profile-control" style="position:relative;">
<button id="playback-profile-btn"
style="height:48px;padding:0 14px;border-radius:24px;border:none;
background:rgba(0,0,0,0.6);color:#fff;font-size:13px;
font-weight:500;cursor:pointer;backdrop-filter:blur(4px);
box-shadow:0 4px 6px rgba(0,0,0,0.3);
font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
white-space:nowrap;display:flex;align-items:center;gap:6px;">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polygon points="5 3 19 12 5 21 5 3"/>
</svg>
<span id="playback-profile-label">Balanced</span>
</button>
<div id="playback-profile-popup"
style="position:absolute;bottom:56px;left:0;
background:rgba(20,20,30,0.95);backdrop-filter:blur(10px);
border-radius:12px;padding:6px;display:none;
box-shadow:0 8px 24px rgba(0,0,0,0.5);
border:1px solid rgba(255,255,255,0.1);
min-width:160px;">
</div>
</div>

<div id="split-pane-toolbar">
<button class="split-pane-btn split-ratio-btn" data-ratio="0.3">3:7</button>
<button class="split-pane-btn split-ratio-btn" data-ratio="0.4">4:6</button>
<button class="split-pane-btn split-ratio-btn active" data-ratio="0.5">5:5</button>
<button class="split-pane-btn split-ratio-btn" data-ratio="0.6">6:4</button>
<button class="split-pane-btn split-ratio-btn" data-ratio="0.7">7:3</button>
<div class="split-toolbar-sep"></div>
<button id="split-close-btn" class="split-pane-btn stop-btn">종료</button>
</div>

</div> <!-- /#overlay-menu-panel -->
</div> <!-- /#overlay-menu -->

<!-- Auto Tier Toast -->
<div id="auto-tier-toast"
Expand All @@ -760,31 +775,6 @@
transition:opacity 0.3s ease;white-space:nowrap;">
</div>

<!-- Playback Profile Control -->
<div id="playback-profile-control"
style="position:fixed;bottom:12px;right:12px;z-index:201;display:none;">
<button id="playback-profile-btn"
style="height:48px;padding:0 14px;border-radius:24px;border:none;
background:rgba(0,0,0,0.6);color:#fff;font-size:13px;
font-weight:500;cursor:pointer;backdrop-filter:blur(4px);
box-shadow:0 4px 6px rgba(0,0,0,0.3);
font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
white-space:nowrap;display:flex;align-items:center;gap:6px;">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polygon points="5 3 19 12 5 21 5 3"/>
</svg>
<span id="playback-profile-label">Balanced</span>
</button>
<div id="playback-profile-popup"
style="position:absolute;bottom:56px;right:0;
background:rgba(20,20,30,0.95);backdrop-filter:blur(10px);
border-radius:12px;padding:6px;display:none;
box-shadow:0 8px 24px rgba(0,0,0,0.5);
border:1px solid rgba(255,255,255,0.1);
min-width:160px;">
</div>
</div>

</div>

<script src="js/decoder.js"></script>
Expand Down
Loading