Files
webmanager-mvp/webui/html/index.html
T
2026-03-12 11:45:56 +01:00

219 lines
10 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>WebManager v2</title>
<link rel="stylesheet" href="/ui/style.css">
</head>
<body>
<div id="app-shell">
<header id="title-zone">
<h1>WebManager v2</h1>
<div id="title-zone-actions">
<div id="status"></div>
<button id="theme-toggle" type="button" aria-label="Toggle theme" title="Toggle theme">
<span id="theme-toggle-icon" aria-hidden="true"></span>
</button>
</div>
</header>
<main id="workspace" class="workspace">
<section class="panel pane" id="left-pane" data-pane="left">
<div class="pane-header">
<div class="toolbar compact-toolbar pane-topbar">
<h2 class="pane-title">Left</h2>
<label class="checkbox"><input id="left-hidden-toggle" type="checkbox">Hidden</label>
</div>
<div class="pathline compact-line">C:<code id="left-current-path"></code></div>
<nav id="left-breadcrumbs" class="breadcrumbs" aria-label="Left breadcrumb"></nav>
<div id="left-browse-error" class="error"></div>
</div>
<div class="pane-content">
<div class="list-grid-header">
<span class="col-sel"></span>
<span class="col-name">Name</span>
<span class="col-size">Size</span>
<span class="col-modified">Modified</span>
</div>
<ul id="left-items" class="list"></ul>
</div>
</section>
<section class="panel pane" id="right-pane" data-pane="right">
<div class="pane-header">
<div class="toolbar compact-toolbar pane-topbar">
<h2 class="pane-title">Right</h2>
<label class="checkbox"><input id="right-hidden-toggle" type="checkbox">Hidden</label>
</div>
<div class="pathline compact-line">C:<code id="right-current-path"></code></div>
<nav id="right-breadcrumbs" class="breadcrumbs" aria-label="Right breadcrumb"></nav>
<div id="right-browse-error" class="error"></div>
</div>
<div class="pane-content">
<div class="list-grid-header">
<span class="col-sel"></span>
<span class="col-name">Name</span>
<span class="col-size">Size</span>
<span class="col-modified">Modified</span>
</div>
<ul id="right-items" class="list"></ul>
</div>
</section>
</main>
<section id="footer-bar">
<div id="function-bar-meta" class="pathline compact-line">Active:<code id="active-pane-label">left</code></div>
<div id="function-bar" class="toolbar compact-toolbar">
<button id="settings-btn" type="button"><span class="shortcut-hint">F1</span><span>Settings</span></button>
<button id="rename-btn" type="button" disabled><span class="shortcut-hint">F2</span><span>Rename</span></button>
<button id="view-btn" type="button" disabled><span class="shortcut-hint">F3</span><span>View</span></button>
<button id="edit-btn" type="button" disabled><span class="shortcut-hint">F4</span><span>Edit</span></button>
<button id="copy-btn" type="button" disabled><span class="shortcut-hint">F5</span><span>Copy</span></button>
<button id="move-btn" type="button" disabled><span class="shortcut-hint">F6</span><span>Move</span></button>
<button id="mkdir-btn" type="button"><span class="shortcut-hint">F7</span><span>MKdir</span></button>
<button id="delete-btn" type="button" disabled><span class="shortcut-hint">F8</span><span>Delete</span></button>
</div>
<div id="actions-error" class="error"></div>
</section>
</div>
<div id="settings-modal" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="settings-title">
<div class="popup-card settings-card">
<button id="settings-close-btn" class="viewer-close" type="button" aria-label="Close settings">X</button>
<h3 id="settings-title">Settings</h3>
<div class="settings-tabs" role="tablist" aria-label="Settings tabs">
<button id="settings-general-tab" class="settings-tab is-active" type="button" role="tab" aria-selected="true">General</button>
<button id="settings-logs-tab" class="settings-tab" type="button" role="tab" aria-selected="false">Logs</button>
</div>
<section id="settings-general-panel" class="settings-panel" role="tabpanel" aria-labelledby="settings-general-tab">
<div class="settings-placeholder-title">General</div>
<div class="popup-meta">Future application settings will appear here.</div>
</section>
<section id="settings-logs-panel" class="settings-panel hidden" role="tabpanel" aria-labelledby="settings-logs-tab">
<div id="settings-logs-error" class="error"></div>
<div id="settings-logs-list" class="settings-log-list"></div>
</section>
</div>
</div>
<div id="search-modal" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="search-title">
<div class="popup-card search-card">
<button id="search-close-btn" class="viewer-close" type="button" aria-label="Close search">X</button>
<h3 id="search-title">Search</h3>
<div id="search-context" class="popup-meta"></div>
<label for="search-input" class="popup-label">Query</label>
<input id="search-input" class="search-input" type="text" autocomplete="off" placeholder="Enter at least 3 characters">
<div id="search-error" class="error"></div>
<div id="search-results" class="search-results"></div>
</div>
</div>
<div id="info-modal" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="info-title">
<div class="popup-card info-card">
<button id="info-close-btn" class="viewer-close" type="button" aria-label="Close info">X</button>
<h3 id="info-title">Info</h3>
<div id="info-error" class="error"></div>
<div id="info-grid" class="info-grid"></div>
</div>
</div>
<div id="wildcard-popup" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="wildcard-popup-title">
<div class="popup-card">
<h3 id="wildcard-popup-title">Wildcard Select</h3>
<div id="wildcard-popup-meta" class="popup-meta"></div>
<label for="wildcard-pattern-input" class="popup-label">Pattern</label>
<input id="wildcard-pattern-input" type="text" autocomplete="off" placeholder="*.mkv">
<div id="wildcard-popup-error" class="error"></div>
<div class="popup-actions">
<button id="wildcard-apply-btn" type="button">Apply</button>
<button id="wildcard-cancel-btn" type="button">Cancel</button>
</div>
</div>
</div>
<div id="move-popup" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="move-title">
<div class="popup-card">
<button id="move-close-btn" class="viewer-close" type="button" aria-label="Close move">X</button>
<h3 id="move-title">Move</h3>
<div id="move-source" class="popup-meta"></div>
<label for="move-input" class="popup-label">Target path</label>
<input id="move-input" type="text" autocomplete="off">
<div id="move-error" class="error"></div>
<div class="popup-actions">
<button id="move-apply-btn" type="button">Move</button>
<button id="move-cancel-btn" type="button">Cancel</button>
</div>
</div>
</div>
<div id="rename-popup" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="rename-title">
<div class="popup-card">
<button id="rename-close-btn" class="viewer-close" type="button" aria-label="Close rename">X</button>
<h3 id="rename-title">Rename</h3>
<label for="rename-input" class="popup-label">Name</label>
<input id="rename-input" type="text" autocomplete="off">
<div id="rename-error" class="error"></div>
<div class="popup-actions">
<button id="rename-apply-btn" type="button">Rename</button>
<button id="rename-cancel-btn" type="button">Cancel</button>
</div>
</div>
</div>
<div id="batch-move-popup" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="batch-move-title">
<div class="popup-card">
<h3 id="batch-move-title">Batch Move</h3>
<div id="batch-move-count" class="popup-meta"></div>
<div id="batch-move-destination" class="popup-meta"></div>
<div id="batch-move-error" class="error"></div>
<div class="popup-actions">
<button id="batch-move-apply-btn" type="button">Move</button>
<button id="batch-move-cancel-btn" type="button">Cancel</button>
</div>
</div>
</div>
<div id="viewer-modal" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="viewer-title">
<div class="popup-card viewer-card">
<button id="viewer-close-btn" class="viewer-close" type="button" aria-label="Close viewer">X</button>
<h3 id="viewer-title">View</h3>
<div id="viewer-file-name" class="popup-meta"></div>
<div id="viewer-file-path" class="popup-meta"></div>
<div id="viewer-error" class="error"></div>
<pre id="viewer-content" class="viewer-content"></pre>
</div>
</div>
<div id="video-modal" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="video-title">
<div class="popup-card viewer-card">
<button id="video-close-btn" class="viewer-close" type="button" aria-label="Close video">X</button>
<h3 id="video-title">Video</h3>
<div id="video-file-name" class="popup-meta"></div>
<div id="video-file-path" class="popup-meta"></div>
<div id="video-error" class="error"></div>
<video id="video-player" class="video-player" controls playsinline preload="metadata"></video>
</div>
</div>
<div id="editor-modal" class="popup-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="editor-title">
<div class="popup-card viewer-card">
<button id="editor-close-btn" class="viewer-close" type="button" aria-label="Close editor">X</button>
<h3 id="editor-title">Edit</h3>
<div id="editor-file-name" class="popup-meta"></div>
<div id="editor-file-path" class="popup-meta"></div>
<div id="editor-error" class="error"></div>
<textarea id="editor-content" class="editor-content" spellcheck="false"></textarea>
<div class="popup-actions">
<button id="editor-save-btn" type="button">Save</button>
<button id="editor-cancel-btn" type="button">Cancel</button>
</div>
</div>
</div>
<script src="/ui/app.js"></script>
</body>
</html>