Prettier for IDAA pages only

This commit is contained in:
Scott Idem
2026-03-24 12:28:07 -04:00
parent b74c6d0e9c
commit 12a9472064
39 changed files with 8673 additions and 8050 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -4,29 +4,31 @@ import { load_jitsi_report } from '$lib/ae_reports/reports_functions';
import { get } from 'svelte/store';
export const load: PageLoad = async ({ fetch }) => {
console.log('*** /idaa/jitsi_reports/+page.ts ***');
console.log('*** /idaa/jitsi_reports/+page.ts ***');
const api_cfg = get(ae_api);
const account_id = get(ae_loc)?.account_id;
const api_cfg = get(ae_api);
const account_id = get(ae_loc)?.account_id;
if (!api_cfg || !account_id) {
console.error('API config or Account ID not available for loading Jitsi reports.');
return {
streamed: {
meetings: Promise.resolve([])
}
};
}
if (!api_cfg || !account_id) {
console.error(
'API config or Account ID not available for loading Jitsi reports.'
);
return {
streamed: {
meetings: Promise.resolve([])
}
};
}
const meetings_promise = load_jitsi_report({
api_cfg,
account_id,
log_lvl: 1
});
const meetings_promise = load_jitsi_report({
api_cfg,
account_id,
log_lvl: 1
});
return {
streamed: {
meetings: meetings_promise
}
};
return {
streamed: {
meetings: meetings_promise
}
};
};

View File

@@ -1,78 +1,77 @@
<script lang="ts">
// ae_idaa_comp__jitsi_url_builder.svelte
// Builds and previews Jitsi iframe URLs for testing and Novi page configuration.
// Only shown to trusted_access users — not for general IDAA members.
// ae_idaa_comp__jitsi_url_builder.svelte
// Builds and previews Jitsi iframe URLs for testing and Novi page configuration.
// Only shown to trusted_access users — not for general IDAA members.
// --- 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: 'Local',
value: 'http://idaa.localhost:5173/idaa/video_conferences'
},
{ label: 'Custom…', value: 'custom' }
];
// --- 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: 'Local',
value: 'http://idaa.localhost:5173/idaa/video_conferences'
},
{ label: 'Custom…', value: 'custom' }
];
// --- State ---
let base_url_preset = $state(BASE_URL_OPTIONS[1].value); // dev by default
let base_url_custom = $state('');
let room_name = $state('IDAA-Test-Meeting');
let site_key = $state('restricted-access');
let uuid = $state('');
let is_moderator = $state(false);
let domain = $state('jitsi.dgrzone.com');
let start_muted = $state(true);
let start_hidden = $state(false);
let disable_incoming_msg = $state(true);
let disable_participant_joined = $state(false);
let disable_participant_left = $state(false);
let disable_reaction = $state(true);
let disable_raise_hand = $state(true);
// --- State ---
let base_url_preset = $state(BASE_URL_OPTIONS[1].value); // dev by default
let base_url_custom = $state('');
let room_name = $state('IDAA-Test-Meeting');
let site_key = $state('restricted-access');
let uuid = $state('');
let is_moderator = $state(false);
let domain = $state('jitsi.dgrzone.com');
let start_muted = $state(true);
let start_hidden = $state(false);
let disable_incoming_msg = $state(true);
let disable_participant_joined = $state(false);
let disable_participant_left = $state(false);
let disable_reaction = $state(true);
let disable_raise_hand = $state(true);
// show_menu=true overrides the default iframe hide — for admins testing the embed
let show_ae_menu = $state(false);
// show_menu=true overrides the default iframe hide — for admins testing the embed
let show_ae_menu = $state(false);
let show_advanced = $state(false);
let show_sound = $state(false);
let output_mode = $state<'url' | 'iframe'>('url');
let copied = $state(false);
let show_advanced = $state(false);
let show_sound = $state(false);
let output_mode = $state<'url' | 'iframe'>('url');
let copied = $state(false);
// --- Derived URL ---
let effective_base = $derived(
base_url_preset === 'custom' ? base_url_custom.trim() : base_url_preset
);
// --- Derived URL ---
let effective_base = $derived(
base_url_preset === 'custom' ? base_url_custom.trim() : base_url_preset
);
let built_url = $derived.by(() => {
if (!effective_base || !room_name.trim()) return '';
const p = new URLSearchParams();
if (uuid.trim()) p.set('uuid', uuid.trim());
p.set('iframe', 'true');
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 (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_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');
// AE embed: iframe=true hides the menu by default; show_menu=true lets admins override
if (show_ae_menu) p.set('show_menu', 'true');
return `${effective_base}?${p.toString()}`;
});
let built_url = $derived.by(() => {
if (!effective_base || !room_name.trim()) return '';
const p = new URLSearchParams();
if (uuid.trim()) p.set('uuid', uuid.trim());
p.set('iframe', 'true');
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 (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_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');
// AE embed: iframe=true hides the menu by default; show_menu=true lets admins override
if (show_ae_menu) p.set('show_menu', 'true');
return `${effective_base}?${p.toString()}`;
});
let iframe_snippet = $derived(`<p>
let iframe_snippet = $derived(`<p>
<iframe
width="100%"
height="950"
@@ -85,34 +84,30 @@
></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;
navigator.clipboard.writeText(output).then(() => {
copied = true;
setTimeout(() => (copied = false), 2000);
});
}
function copy_output() {
if (!output) return;
navigator.clipboard.writeText(output).then(() => {
copied = true;
setTimeout(() => (copied = false), 2000);
});
}
</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 class="grid grid-cols-1 gap-2 sm:grid-cols-2">
<div>
<label
for="jub_base_url"
class="block text-xs uppercase tracking-wide opacity-40 mb-1"
>
class="mb-1 block text-xs tracking-wide uppercase opacity-40">
Environment
</label>
<select
id="jub_base_url"
bind:value={base_url_preset}
class="border border-surface-200-800 rounded px-2 py-1 w-full bg-surface-50-950 text-sm"
>
class="border-surface-200-800 bg-surface-50-950 w-full rounded border px-2 py-1 text-sm">
{#each BASE_URL_OPTIONS as opt}
<option value={opt.value}>{opt.label}</option>
{/each}
@@ -122,15 +117,13 @@
type="url"
bind:value={base_url_custom}
placeholder="https://…/idaa/video_conferences"
class="border border-surface-200-800 rounded px-2 py-1 w-full bg-surface-50-950 text-sm font-mono mt-1"
/>
class="border-surface-200-800 bg-surface-50-950 mt-1 w-full rounded border px-2 py-1 font-mono text-sm" />
{/if}
</div>
<div>
<label
for="jub_room"
class="block text-xs uppercase tracking-wide opacity-40 mb-1"
>
class="mb-1 block text-xs tracking-wide uppercase opacity-40">
Room Name <span class="text-error-500">*</span>
</label>
<input
@@ -138,18 +131,16 @@
id="jub_room"
bind:value={room_name}
placeholder="IDAA-Meeting-Room"
class="border border-surface-200-800 rounded px-2 py-1 w-full bg-surface-50-950 text-sm font-mono"
/>
class="border-surface-200-800 bg-surface-50-950 w-full rounded border px-2 py-1 font-mono text-sm" />
</div>
</div>
<!-- UUID + Key -->
<div class="grid grid-cols-1 sm:grid-cols-2 gap-2">
<div class="grid grid-cols-1 gap-2 sm:grid-cols-2">
<div>
<label
for="jub_uuid"
class="block text-xs uppercase tracking-wide opacity-40 mb-1"
>
class="mb-1 block text-xs tracking-wide uppercase opacity-40">
Novi UUID <span class="opacity-60">(blank = guest)</span>
</label>
<input
@@ -157,101 +148,87 @@
id="jub_uuid"
bind:value={uuid}
placeholder="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
class="border border-surface-200-800 rounded px-2 py-1 w-full bg-surface-50-950 text-sm font-mono"
/>
class="border-surface-200-800 bg-surface-50-950 w-full rounded border px-2 py-1 font-mono text-sm" />
</div>
<div>
<label
for="jub_key"
class="block text-xs uppercase tracking-wide opacity-40 mb-1"
>
class="mb-1 block text-xs tracking-wide uppercase opacity-40">
Site Key
</label>
<input
type="text"
id="jub_key"
bind:value={site_key}
class="border border-surface-200-800 rounded px-2 py-1 w-full bg-surface-50-950 text-sm font-mono"
/>
class="border-surface-200-800 bg-surface-50-950 w-full rounded border px-2 py-1 font-mono text-sm" />
</div>
</div>
<!-- Moderator toggle -->
<label class="flex items-center gap-2 cursor-pointer w-fit">
<label class="flex w-fit cursor-pointer items-center gap-2">
<input
type="checkbox"
bind:checked={is_moderator}
class="checkbox checkbox-sm"
/>
class="checkbox checkbox-sm" />
<span class="text-sm">Moderator</span>
<span class="text-xs opacity-40"
>(requests JWT, enables lobby + activity logging)</span
>
>(requests JWT, enables lobby + activity logging)</span>
</label>
<!-- Advanced toggle -->
<button
type="button"
onclick={() => (show_advanced = !show_advanced)}
class="flex items-center gap-1 text-xs opacity-60 hover:opacity-100 transition-opacity"
>
class="flex items-center gap-1 text-xs opacity-60 transition-opacity hover:opacity-100">
<span
class="fas {show_advanced ? 'fa-chevron-up' : 'fa-chevron-down'}"
aria-hidden="true"
></span>
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"
>
class="border-surface-200-800 bg-surface-100-900 space-y-3 rounded-xl border p-3">
<!-- Domain -->
<div>
<label
for="jub_domain"
class="block text-xs uppercase tracking-wide opacity-40 mb-1"
>
class="mb-1 block text-xs tracking-wide uppercase opacity-40">
Jitsi Domain
</label>
<input
type="text"
id="jub_domain"
bind:value={domain}
class="border border-surface-200-800 rounded px-2 py-1 w-full bg-surface-50-950 text-sm font-mono"
/>
class="border-surface-200-800 bg-surface-50-950 w-full rounded border px-2 py-1 font-mono text-sm" />
</div>
<!-- AE menu — hides the AE nav chrome; useful when embedding in Novi or pages with their own navigation -->
<label class="flex items-center gap-2 cursor-pointer w-fit">
<label class="flex w-fit cursor-pointer items-center gap-2">
<input
type="checkbox"
bind:checked={show_ae_menu}
class="checkbox checkbox-sm"
/>
class="checkbox checkbox-sm" />
<span class="text-xs"
>Show AE system menu <span class="opacity-40"
>(show_menu=true)</span
></span
>
></span>
</label>
<!-- Start options -->
<div class="flex flex-wrap gap-4">
<label class="flex items-center gap-2 cursor-pointer">
<label class="flex cursor-pointer items-center gap-2">
<input
type="checkbox"
bind:checked={start_muted}
class="checkbox checkbox-sm"
/>
class="checkbox checkbox-sm" />
<span class="text-xs">Start muted</span>
</label>
<label class="flex items-center gap-2 cursor-pointer">
<label class="flex cursor-pointer items-center gap-2">
<input
type="checkbox"
bind:checked={start_hidden}
class="checkbox checkbox-sm"
/>
class="checkbox checkbox-sm" />
<span class="text-xs">Start hidden (video off)</span>
</label>
</div>
@@ -261,64 +238,54 @@
<button
type="button"
onclick={() => (show_sound = !show_sound)}
class="flex items-center gap-1 text-xs opacity-60 hover:opacity-100 transition-opacity"
>
class="flex items-center gap-1 text-xs opacity-60 transition-opacity hover:opacity-100">
<span
class="fas {show_sound
? 'fa-chevron-up'
: 'fa-chevron-down'}"
aria-hidden="true"
></span>
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">
<div class="mt-2 flex flex-wrap gap-4">
<label class="flex cursor-pointer items-center gap-2">
<input
type="checkbox"
bind:checked={disable_incoming_msg}
class="checkbox checkbox-sm"
/>
class="checkbox checkbox-sm" />
<span class="text-xs"
>Disable incoming msg sound</span
>
>Disable incoming msg sound</span>
</label>
<label class="flex items-center gap-2 cursor-pointer">
<label class="flex cursor-pointer items-center gap-2">
<input
type="checkbox"
bind:checked={disable_participant_joined}
class="checkbox checkbox-sm"
/>
class="checkbox checkbox-sm" />
<span class="text-xs"
>Disable participant joined sound</span
>
>Disable participant joined sound</span>
</label>
<label class="flex items-center gap-2 cursor-pointer">
<label class="flex cursor-pointer items-center gap-2">
<input
type="checkbox"
bind:checked={disable_participant_left}
class="checkbox checkbox-sm"
/>
class="checkbox checkbox-sm" />
<span class="text-xs"
>Disable participant left sound</span
>
>Disable participant left sound</span>
</label>
<label class="flex items-center gap-2 cursor-pointer">
<label class="flex cursor-pointer items-center gap-2">
<input
type="checkbox"
bind:checked={disable_reaction}
class="checkbox checkbox-sm"
/>
class="checkbox checkbox-sm" />
<span class="text-xs">Disable reaction sound</span>
</label>
<label class="flex items-center gap-2 cursor-pointer">
<label class="flex cursor-pointer items-center gap-2">
<input
type="checkbox"
bind:checked={disable_raise_hand}
class="checkbox checkbox-sm"
/>
<span class="text-xs">Disable raise hand sound</span
>
class="checkbox checkbox-sm" />
<span class="text-xs"
>Disable raise hand sound</span>
</label>
</div>
{/if}
@@ -327,7 +294,7 @@
{/if}
<!-- Output -->
<div class="border-t border-surface-200-800 pt-3 space-y-2">
<div class="border-surface-200-800 space-y-2 border-t pt-3">
<!-- Mode toggle -->
<div class="flex gap-2">
<button
@@ -335,8 +302,7 @@
onclick={() => (output_mode = 'url')}
class="btn btn-sm {output_mode === 'url'
? 'preset-tonal-primary'
: 'preset-tonal-surface border border-surface-200-800'}"
>
: 'preset-tonal-surface border-surface-200-800 border'}">
<span class="fas fa-link mr-1" aria-hidden="true"></span>
URL
</button>
@@ -345,35 +311,31 @@
onclick={() => (output_mode = 'iframe')}
class="btn btn-sm {output_mode === 'iframe'
? 'preset-tonal-primary'
: 'preset-tonal-surface border border-surface-200-800'}"
>
: 'preset-tonal-surface border-surface-200-800 border'}">
<span class="fas fa-code mr-1" aria-hidden="true"></span>
iframe HTML
</button>
</div>
{#if built_url}
<div class="flex gap-1 items-stretch">
<div class="flex items-stretch gap-1">
<textarea
readonly
rows={output_mode === 'iframe' ? 8 : 2}
value={output}
class="border border-surface-200-800 rounded px-2 py-1.5 w-full bg-surface-50-950 text-xs font-mono resize-none cursor-text"
class="border-surface-200-800 bg-surface-50-950 w-full cursor-text resize-none rounded border px-2 py-1.5 font-mono text-xs"
onclick={(e) => (e.target as HTMLTextAreaElement).select()}
title="Click to select all"
></textarea>
title="Click to select all"></textarea>
<button
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"
>
: 'preset-tonal-primary'} transition-colors">
<span
class="fas {copied ? 'fa-check' : 'fa-copy'}"
aria-hidden="true"
></span>
aria-hidden="true"></span>
</button>
</div>
{#if output_mode === 'url'}
@@ -381,15 +343,14 @@
href={built_url}
target="_blank"
rel="noopener noreferrer"
class="text-xs text-primary-600 dark:text-primary-400 hover:underline inline-flex items-center gap-1"
>
class="text-primary-600 dark:text-primary-400 inline-flex items-center gap-1 text-xs hover:underline">
<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">
<p class="text-xs italic opacity-40">
Fill in Room Name to generate a URL.
</p>
{/if}