fix: companion indicator shows relay state, add node-profile script
Some checks failed
Build Archipelago ISO (dev) / build-iso (push) Has been cancelled
Build Archipelago ISO / build-iso (push) Has been cancelled

CompanionIndicator: show muted icon when relay connected but idle,
orange when companion actively sending input. Removes Transition
wrapper for always-visible relay status.

Add scripts/node-profile.sh utility.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-04-02 11:14:34 +01:00
parent f0ef424ce2
commit ae4791d438
2 changed files with 295 additions and 38 deletions

View File

@@ -1,34 +1,32 @@
<template>
<Transition name="companion-fade">
<div
v-if="companionActive"
class="companion-indicator"
title="Companion app connected"
>
<!-- Wire going down off-screen -->
<div class="companion-wire" />
<div
v-if="relayConnected"
class="companion-indicator"
:title="companionActive ? 'Companion app sending input' : 'Relay ready — waiting for companion'"
>
<!-- Wire going down off-screen -->
<div class="companion-wire" :class="{ active: companionActive }" />
<!-- Gamepad body -->
<div class="companion-pad" :class="{ 'input-flash': companionInputActive }">
<svg width="28" height="28" viewBox="0 0 24 24" fill="none" aria-hidden="true">
<!-- Controller body -->
<rect x="3" y="7" width="18" height="11" rx="3" stroke="currentColor" stroke-width="1.5" />
<!-- D-pad vertical -->
<rect x="7.5" y="10" width="2" height="5" rx="0.5" fill="currentColor" />
<!-- D-pad horizontal -->
<rect x="6" y="11.5" width="5" height="2" rx="0.5" fill="currentColor" />
<!-- A button -->
<circle cx="16" cy="11" r="1.2" fill="currentColor" />
<!-- B button -->
<circle cx="14" cy="13.5" r="1.2" fill="currentColor" />
</svg>
</div>
<!-- Gamepad body -->
<div class="companion-pad" :class="{ connected: companionActive, 'input-flash': companionInputActive }">
<svg width="28" height="28" viewBox="0 0 24 24" fill="none" aria-hidden="true">
<!-- Controller body -->
<rect x="3" y="7" width="18" height="11" rx="3" stroke="currentColor" stroke-width="1.5" />
<!-- D-pad vertical -->
<rect x="7.5" y="10" width="2" height="5" rx="0.5" fill="currentColor" />
<!-- D-pad horizontal -->
<rect x="6" y="11.5" width="5" height="2" rx="0.5" fill="currentColor" />
<!-- A button -->
<circle cx="16" cy="11" r="1.2" fill="currentColor" />
<!-- B button -->
<circle cx="14" cy="13.5" r="1.2" fill="currentColor" />
</svg>
</div>
</Transition>
</div>
</template>
<script setup lang="ts">
import { companionActive, companionInputActive } from '@/api/remote-relay'
import { relayConnected, companionActive, companionInputActive } from '@/api/remote-relay'
</script>
<style scoped>
@@ -41,41 +39,48 @@ import { companionActive, companionInputActive } from '@/api/remote-relay'
flex-direction: column;
align-items: center;
pointer-events: none;
transition: opacity 0.4s ease;
}
/* Idle state — subtle, muted */
.companion-pad {
color: rgba(247, 147, 26, 0.7);
background: rgba(0, 0, 0, 0.6);
border: 1px solid rgba(247, 147, 26, 0.3);
color: rgba(255, 255, 255, 0.15);
background: rgba(0, 0, 0, 0.3);
border: 1px solid rgba(255, 255, 255, 0.06);
border-bottom: none;
border-radius: 8px 8px 0 0;
padding: 6px 10px 4px;
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
transition: color 0.15s, border-color 0.15s, box-shadow 0.15s;
transition: color 0.3s, border-color 0.3s, box-shadow 0.3s, background 0.3s;
order: 0;
}
/* Companion actively sending */
.companion-pad.connected {
color: rgba(247, 147, 26, 0.7);
background: rgba(0, 0, 0, 0.6);
border-color: rgba(247, 147, 26, 0.3);
}
/* Input flash — brightens on each event */
.companion-pad.input-flash {
color: rgba(247, 147, 26, 1);
border-color: rgba(247, 147, 26, 0.6);
box-shadow: 0 0 12px rgba(247, 147, 26, 0.25);
}
/* Wire */
.companion-wire {
width: 2px;
height: 20px;
background: linear-gradient(to bottom, rgba(247, 147, 26, 0.5), rgba(247, 147, 26, 0.15));
background: linear-gradient(to bottom, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03));
border-radius: 1px;
order: 1;
transition: background 0.3s;
}
.companion-pad {
order: 0;
.companion-wire.active {
background: linear-gradient(to bottom, rgba(247, 147, 26, 0.5), rgba(247, 147, 26, 0.15));
}
/* Fade transition */
.companion-fade-enter-active { transition: opacity 0.4s ease, transform 0.4s ease; }
.companion-fade-leave-active { transition: opacity 0.3s ease, transform 0.3s ease; }
.companion-fade-enter-from { opacity: 0; transform: translateY(20px); }
.companion-fade-leave-to { opacity: 0; transform: translateY(20px); }
</style>