Myx
dea114aed0
All checks were successful
Queue Release Build / prepare (push) Successful in 1m6s
Deploy Web Apps / deploy (push) Successful in 7m35s
Queue Release Build / build-windows (push) Successful in 29m57s
Queue Release Build / build-linux (push) Successful in 46m28s
Queue Release Build / finalize (push) Successful in 49s
109 lines
3.3 KiB
HTML
109 lines
3.3 KiB
HTML
@if (showFloatingControls()) {
|
|
<div
|
|
appThemeNode="floatingVoiceControls"
|
|
class="fixed bottom-4 right-4 z-50 border border-border bg-card shadow-lg"
|
|
>
|
|
<div class="flex items-center gap-2 p-2">
|
|
<!-- Back to server button -->
|
|
<button
|
|
(click)="navigateToServer()"
|
|
type="button"
|
|
class="flex items-center gap-1.5 rounded-md bg-secondary px-2 py-1 text-foreground transition-colors hover:bg-secondary/80"
|
|
title="Back to {{ voiceSession()?.serverName }}"
|
|
>
|
|
<ng-icon
|
|
name="lucideArrowLeft"
|
|
class="w-3.5 h-3.5"
|
|
/>
|
|
@if (voiceSession()?.serverIcon) {
|
|
<span
|
|
aria-hidden="true"
|
|
class="h-5 w-5 rounded bg-cover bg-center bg-no-repeat"
|
|
[style.backgroundImage]="'url(' + voiceSession()!.serverIcon + ')'"
|
|
></span>
|
|
} @else {
|
|
<div class="flex h-5 w-5 items-center justify-center rounded-sm bg-muted text-[10px] font-semibold">
|
|
{{ voiceSession()?.serverName?.charAt(0)?.toUpperCase() || '?' }}
|
|
</div>
|
|
}
|
|
</button>
|
|
|
|
<!-- Voice status indicator -->
|
|
<div class="flex items-center gap-1 px-1">
|
|
<span class="w-1.5 h-1.5 rounded-full bg-green-500 animate-pulse"></span>
|
|
<span class="text-xs text-muted-foreground max-w-20 truncate">{{ voiceSession()?.roomName || 'Voice' }}</span>
|
|
</div>
|
|
|
|
<!-- Divider -->
|
|
<div class="h-6 w-px bg-border"></div>
|
|
|
|
<!-- Voice controls -->
|
|
<div class="flex items-center gap-1">
|
|
<button
|
|
(click)="toggleMute()"
|
|
type="button"
|
|
[class]="getCompactButtonClass(isMuted())"
|
|
title="Toggle Mute"
|
|
>
|
|
<ng-icon
|
|
[name]="isMuted() ? 'lucideMicOff' : 'lucideMic'"
|
|
class="w-4 h-4"
|
|
/>
|
|
</button>
|
|
|
|
<button
|
|
(click)="toggleDeafen()"
|
|
type="button"
|
|
[class]="getCompactButtonClass(isDeafened())"
|
|
title="Toggle Deafen"
|
|
>
|
|
<ng-icon
|
|
name="lucideHeadphones"
|
|
class="w-4 h-4"
|
|
/>
|
|
</button>
|
|
|
|
@if (!isMobile()) {
|
|
<button
|
|
(click)="toggleScreenShare()"
|
|
type="button"
|
|
[class]="getCompactScreenShareClass()"
|
|
title="Toggle Screen Share"
|
|
>
|
|
<ng-icon
|
|
[name]="isScreenSharing() ? 'lucideMonitorOff' : 'lucideMonitor'"
|
|
class="w-4 h-4"
|
|
/>
|
|
</button>
|
|
}
|
|
|
|
<app-debug-console
|
|
launcherVariant="compact"
|
|
[showPanel]="false"
|
|
/>
|
|
|
|
<button
|
|
(click)="disconnect()"
|
|
type="button"
|
|
class="inline-flex h-7 w-7 items-center justify-center rounded-md border border-destructive/20 bg-destructive/10 text-destructive transition-colors hover:bg-destructive/15"
|
|
title="Disconnect"
|
|
>
|
|
<ng-icon
|
|
name="lucidePhoneOff"
|
|
class="w-4 h-4"
|
|
/>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
@if (showScreenShareQualityDialog()) {
|
|
<app-screen-share-quality-dialog
|
|
[selectedQuality]="screenShareQuality()"
|
|
[includeSystemAudio]="includeSystemAudio()"
|
|
(cancelled)="onScreenShareQualityCancelled()"
|
|
(confirmed)="onScreenShareQualityConfirmed($event)"
|
|
/>
|
|
}
|