feat: add hide_ae_menu toggle to Jitsi URL builder advanced panel

Adds ae_hide_menu=true query param option to suppress the AE navigation
chrome when embedding the Jitsi video conference page in Novi or other
host pages that provide their own navigation.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/routes/idaa/(idaa)/jitsi_reports/ae_idaa_comp__jitsi_url_builder.svelte

@@ -5,9 +5,18 @@
 
     // --- Environment presets ---
     const BASE_URL_OPTIONS = [
-		{ label: 'Production', value: 'https://sk-idaa.oneskyit.com/idaa/video_conferences' },
+        {
-		{ label: 'Dev / Staging', value: 'https://dev-idaa.oneskyit.com/idaa/video_conferences' },
+            label: 'Production',
-		{ label: 'Local', value: 'http://idaa.localhost:5173/idaa/video_conferences' },
+            value: 'https://sk-idaa.oneskyit.com/idaa/video_conferences'
+        },
+        {
+            label: 'Dev / Staging',
+            value: 'https://dev-idaa.oneskyit.com/idaa/video_conferences'
+        },
+        {
+            label: 'Local',
+            value: 'http://idaa.localhost:5173/idaa/video_conferences'
+        },
         { label: 'Custom…', value: 'custom' }
     ];
 
@@ -48,11 +57,13 @@
         p.set('key', site_key.trim() || 'restricted-access');
         p.set('room', room_name.trim());
         if (is_moderator) p.set('moderator', 'true');
-		if (domain.trim() && domain.trim() !== 'jitsi.dgrzone.com') p.set('domain', domain.trim());
+        if (domain.trim() && domain.trim() !== 'jitsi.dgrzone.com')
+            p.set('domain', domain.trim());
         if (start_muted) p.set('start_muted', 'true');
         if (start_hidden) p.set('start_hidden', 'true');
         if (disable_incoming_msg) p.set('incoming_msg_sound', 'true');
-		if (disable_participant_joined) p.set('participant_joined_sound', 'true');
+        if (disable_participant_joined)
+            p.set('participant_joined_sound', 'true');
         if (disable_participant_left) p.set('participant_left_sound', 'true');
         if (disable_reaction) p.set('reaction_sound', 'true');
         if (disable_raise_hand) p.set('raise_hand_sound', 'true');
@@ -74,7 +85,9 @@
   ></iframe>
 </p>`);
 
-	let output = $derived(output_mode === 'iframe' ? iframe_snippet : built_url);
+    let output = $derived(
+        output_mode === 'iframe' ? iframe_snippet : built_url
+    );
 
     function copy_output() {
         if (!output) return;
@@ -86,11 +99,13 @@
 </script>
 
 <div class="space-y-3 text-sm">
-
     <!-- Environment + Room (always visible) -->
     <div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
         <div>
-			<label for="jub_base_url" class="block text-xs uppercase tracking-wide opacity-40 mb-1">
+            <label
+                for="jub_base_url"
+                class="block text-xs uppercase tracking-wide opacity-40 mb-1"
+            >
                 Environment
             </label>
             <select
@@ -112,7 +127,10 @@
             {/if}
         </div>
         <div>
-			<label for="jub_room" class="block text-xs uppercase tracking-wide opacity-40 mb-1">
+            <label
+                for="jub_room"
+                class="block text-xs uppercase tracking-wide opacity-40 mb-1"
+            >
                 Room Name <span class="text-error-500">*</span>
             </label>
             <input
@@ -128,7 +146,10 @@
     <!-- UUID + Key -->
     <div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
         <div>
-			<label for="jub_uuid" class="block text-xs uppercase tracking-wide opacity-40 mb-1">
+            <label
+                for="jub_uuid"
+                class="block text-xs uppercase tracking-wide opacity-40 mb-1"
+            >
                 Novi UUID <span class="opacity-60">(blank = guest)</span>
             </label>
             <input
@@ -140,7 +161,10 @@
             />
         </div>
         <div>
-			<label for="jub_key" class="block text-xs uppercase tracking-wide opacity-40 mb-1">
+            <label
+                for="jub_key"
+                class="block text-xs uppercase tracking-wide opacity-40 mb-1"
+            >
                 Site Key
             </label>
             <input
@@ -154,9 +178,15 @@
 
     <!-- Moderator toggle -->
     <label class="flex items-center gap-2 cursor-pointer w-fit">
-		<input type="checkbox" bind:checked={is_moderator} class="checkbox checkbox-sm" />
+        <input
+            type="checkbox"
+            bind:checked={is_moderator}
+            class="checkbox checkbox-sm"
+        />
         <span class="text-sm">Moderator</span>
-		<span class="text-xs opacity-40">(requests JWT, enables lobby + activity logging)</span>
+        <span class="text-xs opacity-40"
+            >(requests JWT, enables lobby + activity logging)</span
+        >
     </label>
 
     <!-- Advanced toggle -->
@@ -165,15 +195,23 @@
         onclick={() => (show_advanced = !show_advanced)}
         class="flex items-center gap-1 text-xs opacity-60 hover:opacity-100 transition-opacity"
     >
-		<span class="fas {show_advanced ? 'fa-chevron-up' : 'fa-chevron-down'}" aria-hidden="true"></span>
+        <span
+            class="fas {show_advanced ? 'fa-chevron-up' : 'fa-chevron-down'}"
+            aria-hidden="true"
+        ></span>
         {show_advanced ? 'Hide' : 'Show'} advanced options
     </button>
 
     {#if show_advanced}
-		<div class="border border-surface-200-800 rounded-xl p-3 space-y-3 bg-surface-100-900">
+        <div
+            class="border border-surface-200-800 rounded-xl p-3 space-y-3 bg-surface-100-900"
+        >
             <!-- Domain -->
             <div>
-				<label for="jub_domain" class="block text-xs uppercase tracking-wide opacity-40 mb-1">
+                <label
+                    for="jub_domain"
+                    class="block text-xs uppercase tracking-wide opacity-40 mb-1"
+                >
                     Jitsi Domain
                 </label>
                 <input
@@ -184,22 +222,36 @@
                 />
             </div>
 
-				<!-- AE menu toggle -->
+            <!-- AE menu — hides the AE nav chrome; useful when embedding in Novi or pages with their own navigation -->
-				<div>
+            <label class="flex items-center gap-2 cursor-pointer w-fit">
-					<label class="flex items-center gap-2 cursor-pointer">
+                <input
-						<input type="checkbox" bind:checked={hide_ae_menu} class="checkbox checkbox-sm" />
+                    type="checkbox"
-						<span class="text-xs">Hide AE system menu (for embed)</span>
+                    bind:checked={hide_ae_menu}
+                    class="checkbox checkbox-sm"
+                />
+                <span class="text-xs"
+                    >Hide AE system menu <span class="opacity-40"
+                        >(ae_hide_menu=true)</span
+                    ></span
+                >
             </label>
-				</div>
 
             <!-- Start options -->
             <div class="flex flex-wrap gap-4">
                 <label class="flex items-center gap-2 cursor-pointer">
-					<input type="checkbox" bind:checked={start_muted} class="checkbox checkbox-sm" />
+                    <input
+                        type="checkbox"
+                        bind:checked={start_muted}
+                        class="checkbox checkbox-sm"
+                    />
                     <span class="text-xs">Start muted</span>
                 </label>
                 <label class="flex items-center gap-2 cursor-pointer">
-					<input type="checkbox" bind:checked={start_hidden} class="checkbox checkbox-sm" />
+                    <input
+                        type="checkbox"
+                        bind:checked={start_hidden}
+                        class="checkbox checkbox-sm"
+                    />
                     <span class="text-xs">Start hidden (video off)</span>
                 </label>
             </div>
@@ -211,30 +263,62 @@
                     onclick={() => (show_sound = !show_sound)}
                     class="flex items-center gap-1 text-xs opacity-60 hover:opacity-100 transition-opacity"
                 >
-					<span class="fas {show_sound ? 'fa-chevron-up' : 'fa-chevron-down'}" aria-hidden="true"></span>
+                    <span
+                        class="fas {show_sound
+                            ? 'fa-chevron-up'
+                            : 'fa-chevron-down'}"
+                        aria-hidden="true"
+                    ></span>
                     {show_sound ? 'Hide' : 'Show'} sound settings
                 </button>
                 {#if show_sound}
                     <div class="flex flex-wrap gap-4 mt-2">
                         <label class="flex items-center gap-2 cursor-pointer">
-							<input type="checkbox" bind:checked={disable_incoming_msg} class="checkbox checkbox-sm" />
+                            <input
-							<span class="text-xs">Disable incoming msg sound</span>
+                                type="checkbox"
+                                bind:checked={disable_incoming_msg}
+                                class="checkbox checkbox-sm"
+                            />
+                            <span class="text-xs"
+                                >Disable incoming msg sound</span
+                            >
                         </label>
                         <label class="flex items-center gap-2 cursor-pointer">
-							<input type="checkbox" bind:checked={disable_participant_joined} class="checkbox checkbox-sm" />
+                            <input
-							<span class="text-xs">Disable participant joined sound</span>
+                                type="checkbox"
+                                bind:checked={disable_participant_joined}
+                                class="checkbox checkbox-sm"
+                            />
+                            <span class="text-xs"
+                                >Disable participant joined sound</span
+                            >
                         </label>
                         <label class="flex items-center gap-2 cursor-pointer">
-							<input type="checkbox" bind:checked={disable_participant_left} class="checkbox checkbox-sm" />
+                            <input
-							<span class="text-xs">Disable participant left sound</span>
+                                type="checkbox"
+                                bind:checked={disable_participant_left}
+                                class="checkbox checkbox-sm"
+                            />
+                            <span class="text-xs"
+                                >Disable participant left sound</span
+                            >
                         </label>
                         <label class="flex items-center gap-2 cursor-pointer">
-							<input type="checkbox" bind:checked={disable_reaction} class="checkbox checkbox-sm" />
+                            <input
+                                type="checkbox"
+                                bind:checked={disable_reaction}
+                                class="checkbox checkbox-sm"
+                            />
                             <span class="text-xs">Disable reaction sound</span>
                         </label>
                         <label class="flex items-center gap-2 cursor-pointer">
-							<input type="checkbox" bind:checked={disable_raise_hand} class="checkbox checkbox-sm" />
+                            <input
-							<span class="text-xs">Disable raise hand sound</span>
+                                type="checkbox"
+                                bind:checked={disable_raise_hand}
+                                class="checkbox checkbox-sm"
+                            />
+                            <span class="text-xs">Disable raise hand sound</span
+                            >
                         </label>
                     </div>
                 {/if}
@@ -249,7 +333,9 @@
             <button
                 type="button"
                 onclick={() => (output_mode = 'url')}
-				class="btn btn-sm {output_mode === 'url' ? 'preset-tonal-primary' : 'preset-tonal-surface border border-surface-200-800'}"
+                class="btn btn-sm {output_mode === 'url'
+                    ? 'preset-tonal-primary'
+                    : 'preset-tonal-surface border border-surface-200-800'}"
             >
                 <span class="fas fa-link mr-1" aria-hidden="true"></span>
                 URL
@@ -257,7 +343,9 @@
             <button
                 type="button"
                 onclick={() => (output_mode = 'iframe')}
-				class="btn btn-sm {output_mode === 'iframe' ? 'preset-tonal-primary' : 'preset-tonal-surface border border-surface-200-800'}"
+                class="btn btn-sm {output_mode === 'iframe'
+                    ? 'preset-tonal-primary'
+                    : 'preset-tonal-surface border border-surface-200-800'}"
             >
                 <span class="fas fa-code mr-1" aria-hidden="true"></span>
                 iframe HTML
@@ -278,9 +366,14 @@
                     type="button"
                     onclick={copy_output}
                     title="Copy to clipboard"
-					class="btn btn-sm shrink-0 self-start {copied ? 'preset-tonal-success' : 'preset-tonal-primary'} transition-colors"
+                    class="btn btn-sm shrink-0 self-start {copied
+                        ? 'preset-tonal-success'
+                        : 'preset-tonal-primary'} transition-colors"
                 >
-					<span class="fas {copied ? 'fa-check' : 'fa-copy'}" aria-hidden="true"></span>
+                    <span
+                        class="fas {copied ? 'fa-check' : 'fa-copy'}"
+                        aria-hidden="true"
+                    ></span>
                 </button>
             </div>
             {#if output_mode === 'url'}
@@ -290,13 +383,15 @@
                     rel="noopener noreferrer"
                     class="text-xs text-primary-600 dark:text-primary-400 hover:underline inline-flex items-center gap-1"
                 >
-					<span class="fas fa-external-link-alt" aria-hidden="true"></span>
+                    <span class="fas fa-external-link-alt" aria-hidden="true"
+                    ></span>
                     Open in new tab
                 </a>
             {/if}
         {:else}
-			<p class="text-xs opacity-40 italic">Fill in Room Name to generate a URL.</p>
+            <p class="text-xs opacity-40 italic">
+                Fill in Room Name to generate a URL.
+            </p>
         {/if}
     </div>
-
 </div>