kato/go-worm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add log viewing and downloading functionality to the web interface. Implement interactive log selection with visual feedback, and enhance modifier button states for improved user experience. Update styles for better accessibility and usability of log-related elements.

Browse Source
This commit is contained in:
kato
2026-08-28 13:22:59 +03:00
parent ea71090a53
commit 4f8ee5f6be
2 changed files with 150 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/agent/web/index.html
+57 -19
View File
@@ -130,24 +130,60 @@
padding: 0.65rem 1.25rem;
color: var(--danger);
}
nav button.mod-btn.active {
background: var(--accent);
border-color: var(--accent);
color: #fff;
.mod-btn {
position: relative;
min-width: 3.75rem;
font-weight: 600;
letter-spacing: 0.02em;
background: #f3f4f6;
border-color: #d1d5db;
color: var(--muted);
transition: background 0.12s, border-color 0.12s, color 0.12s, box-shadow 0.12s;
}
#video-keys {
.mod-btn::before {
content: "";
display: inline-block;
width: 0.45rem;
height: 0.45rem;
margin-right: 0.35rem;
border-radius: 50%;
background: #9ca3af;
vertical-align: 0.05em;
transition: background 0.12s, box-shadow 0.12s;
}
.mod-btn.active {
background: #dbeafe;
border-color: var(--accent);
color: #1e40af;
box-shadow: inset 0 1px 2px rgba(37, 99, 235, 0.12);
}
.mod-btn.active::before {
background: var(--accent);
box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.25);
}
#video-key-hint {
flex: 1;
min-width: 12rem;
padding: 0.55rem 0.75rem;
border: 1px dashed var(--line);
border: 1px solid var(--line);
border-radius: 6px;
background: #fff;
cursor: text;
outline: none;
background: #f9fafb;
color: var(--muted);
font-size: 0.9rem;
}
#video-keys:focus {
border-color: var(--accent);
box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);
td.log-name {
cursor: pointer;
color: var(--accent);
}
tr.log-row.selected td { background: #eff6ff; }
#log-view {
margin-top: 0.75rem;
max-height: 28rem;
}
#log-view-title {
margin: 0 0 0.35rem;
font-size: 0.9rem;
color: var(--muted);
}
</style>
</head>
@@ -226,14 +262,14 @@
<canvas id="video-canvas" width="1280" height="720"></canvas>
<p id="video-meta" class="meta"></p>
<div class="row" style="margin-top:0.75rem">
<div id="video-keys" tabindex="0">Click here, then type on your keyboard</div>
<div id="video-key-hint">Keyboard sends to remote while this tab is active</div>
</div>
<div class="row">
<button type="button" class="mod-btn" data-mod="ctrl">Ctrl</button>
<button type="button" class="mod-btn" data-mod="alt">Alt</button>
<button type="button" class="mod-btn" data-mod="shift">Shift</button>
<button type="button" class="mod-btn" data-mod="win">Win</button>
<span class="meta">Toggle modifiers, then type in the box above</span>
<button type="button" class="mod-btn" data-mod="ctrl" aria-pressed="false">Ctrl</button>
<button type="button" class="mod-btn" data-mod="alt" aria-pressed="false">Alt</button>
<button type="button" class="mod-btn" data-mod="shift" aria-pressed="false">Shift</button>
<button type="button" class="mod-btn" data-mod="win" aria-pressed="false">Win</button>
<span class="meta">Toggle sticky modifiers · type anywhere on this tab</span>
</div>
</section>
<section id="exec" class="panel">
@@ -257,10 +293,12 @@
<p id="log-meta" class="meta"></p>
<table>
<thead>
<tr><th>File</th><th>Size</th><th>Modified</th><th></th></tr>
<tr><th>File</th><th>Size</th><th>Modified</th></tr>
</thead>
<tbody id="log-rows"></tbody>
</table>
<p id="log-view-title" class="meta"></p>
<pre id="log-view" hidden></pre>
</section>
</main>
<script src="/app.js"></script>