Phase 2
Some checks failed
ci-bundle.yml / Phase 2 (push) Failing after 0s
ci-copr.yml / Phase 2 (push) Failing after 0s
ci-homebrew.yml / Phase 2 (push) Failing after 0s

This commit is contained in:
Joey Yakimowich-Payne 2026-02-11 13:44:02 -07:00
commit 0c16e913da
11 changed files with 277 additions and 0 deletions

View file

@ -147,6 +147,49 @@
</li>
</ul>
</div>
<!-- Live Input Status -->
<div class="card my-4">
<div class="card-body">
<h2 id="input_status">Live Input Status</h2>
<p>Per-session input activity and policy. Indicators update every second.</p>
</div>
<div v-if="activeSessions.length === 0" class="card-body pt-0">
<em>No active streaming sessions.</em>
</div>
<ul class="list-group list-group-flush" v-else>
<li v-for="s in activeSessions" :key="s.session_id" class="list-group-item">
<div class="d-flex align-items-center justify-content-between">
<div>
<strong>{{ s.client_name || s.client_uuid || 'Unknown' }}</strong>
<span v-if="s.is_owner_session" class="badge bg-primary ms-2">Owner</span>
</div>
<div class="d-flex gap-3 align-items-center">
<span class="d-flex align-items-center gap-1" title="Keyboard">
<span :class="['activity-dot', s.activity.keyboard_active ? 'dot-green' : 'dot-gray']"></span>
KB
<span :class="['badge', s.policy.allow_keyboard ? 'bg-success' : 'bg-secondary']" style="font-size: 0.7em">
{{ s.policy.allow_keyboard ? 'ON' : 'OFF' }}
</span>
</span>
<span class="d-flex align-items-center gap-1" title="Mouse">
<span :class="['activity-dot', s.activity.mouse_active ? 'dot-green' : 'dot-gray']"></span>
Mouse
<span :class="['badge', s.policy.allow_mouse ? 'bg-success' : 'bg-secondary']" style="font-size: 0.7em">
{{ s.policy.allow_mouse ? 'ON' : 'OFF' }}
</span>
</span>
<span class="d-flex align-items-center gap-1" title="Gamepad">
<span :class="['activity-dot', s.activity.gamepad_active ? 'dot-green' : 'dot-gray']"></span>
Gamepad
<span :class="['badge', s.policy.allow_gamepad ? 'bg-success' : 'bg-secondary']" style="font-size: 0.7em">
{{ s.policy.allow_gamepad ? 'ON' : 'OFF' }}
</span>
</span>
</div>
</div>
</li>
</ul>
</div>
<!-- Logs -->
<div class="card my-4">
<div class="card-body">
@ -229,6 +272,7 @@
},
data() {
return {
activeSessions: [],
clients: [],
closeAppPressed: false,
closeAppStatus: null,
@ -237,6 +281,7 @@
logs: 'Loading...',
logFilter: null,
logInterval: null,
sessionInterval: null,
restartPressed: false,
showApplyMessage: false,
platform: "",
@ -389,13 +434,32 @@
this.logInterval = setInterval(() => {
this.refreshLogs();
}, 5000);
this.sessionInterval = setInterval(() => {
this.refreshActiveSessions();
}, 1000);
this.refreshLogs();
this.refreshClients();
this.refreshActiveSessions();
},
beforeDestroy() {
clearInterval(this.logInterval);
clearInterval(this.sessionInterval);
},
methods: {
refreshActiveSessions() {
fetch("./api/sessions/active")
.then((r) => r.json())
.then((r) => {
if (r.status === true && r.sessions) {
this.activeSessions = r.sessions;
} else {
this.activeSessions = [];
}
})
.catch(() => {
this.activeSessions = [];
});
},
refreshLogs() {
fetch("./api/logs",)
.then((r) => r.text())
@ -610,4 +674,21 @@
initApp(app);
</script>
<style>
.activity-dot {
display: inline-block;
width: 10px;
height: 10px;
border-radius: 50%;
transition: background-color 0.2s;
}
.dot-green {
background-color: #22c55e;
box-shadow: 0 0 4px #22c55e;
}
.dot-gray {
background-color: #6b7280;
}
</style>
</body>