Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(launcher): add quick mirror/extend toggle in left menu

Browse Source 
Always visible in launcher menu, disabled outside native mode, with title text and preview-note messaging.
This commit is contained in:
Scott Idem
2026-05-20 19:28:46 -04:00
parent c0f828ec2c
commit a56f520d4e
1 changed files with 61 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/routes/events/[event_id]/(launcher)/menu_launcher_controls.svelte
View File

@@ -18,16 +18,29 @@
* theme mode without hunting through the system menu or requiring admin access.
*/
import { Moon, Sun, Eye, EyeOff } from '@lucide/svelte';
import { Moon, Sun, Eye, EyeOff, Columns2, Copy } from '@lucide/svelte';
import { ae_loc } from '$lib/stores/ae_stores';
import { events_loc } from '$lib/stores/ae_events_stores';
import * as native from '$lib/electron/electron_relay';
interface Props {
log_lvl?: number;
}
let { log_lvl = $bindable(0) }: Props = $props();
let quick_display_mode = $state<'extend' | 'mirror'>('extend');
const is_native_launcher_mode = $derived(
!!$ae_loc.is_native && $events_loc.launcher.app_mode === 'native'
);
async function set_quick_display_mode(mode: 'extend' | 'mirror') {
if (!is_native_launcher_mode) return;
const res = await native.set_display_layout({ mode });
if (res?.success) quick_display_mode = mode;
}
</script>
<div class="flex w-full max-w-full flex-col items-center justify-center gap-1">
@@ -152,4 +165,51 @@ let { log_lvl = $bindable(0) }: Props = $props();
{/if}
</button>
</div>
<!-- ── Quick display mode controls — always visible (native-only action) ── -->
<div class="flex w-full max-w-full flex-row items-center justify-center gap-1">
<button
type="button"
onclick={() => set_quick_display_mode('extend')}
disabled={!is_native_launcher_mode}
class="
btn btn-sm group w-1/2 max-w-1/2 text-xs transition-all
border-2
"
class:border-primary-500={quick_display_mode === 'extend'}
class:preset-tonal-primary={quick_display_mode === 'extend'}
class:border-surface-400={quick_display_mode !== 'extend'}
class:preset-tonal-surface={quick_display_mode !== 'extend'}
title="Set display layout to Extend (separate laptop and projector screens).">
<Columns2 size="0.9em" class="m-1 inline-block" />
<span class="hidden group-hover:inline-block">Display: Extend</span>
<span class="group-hover:hidden">Extend</span>
</button>
<button
type="button"
onclick={() => set_quick_display_mode('mirror')}
disabled={!is_native_launcher_mode}
class="
btn btn-sm group w-1/2 max-w-1/2 text-xs transition-all
border-2
"
class:border-warning-500={quick_display_mode === 'mirror'}
class:preset-tonal-warning={quick_display_mode === 'mirror'}
class:border-surface-400={quick_display_mode !== 'mirror'}
class:preset-tonal-surface={quick_display_mode !== 'mirror'}
title="Set display layout to Mirror (same content on laptop and projector).">
<Copy size="0.9em" class="m-1 inline-block" />
<span class="hidden group-hover:inline-block">Display: Mirror</span>
<span class="group-hover:hidden">Mirror</span>
</button>
</div>
{#if !is_native_launcher_mode}
<div
class="text-[10px] leading-tight opacity-70 text-center px-2"
title="Shown here as a visual preview. Active in native app mode in the session room.">
Display toggle shown as an example preview. Active in native app mode in the session room.
</div>
{/if}
</div>