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

Saving my work while we working on making the Jitsi integration better.

Browse Source
This commit is contained in:
Scott Idem
2025-12-15 15:27:34 -05:00
parent 44364186ed
commit 825f5c4829
1 changed files with 117 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

143
src/routes/idaa/(idaa)/video_conferences/+page.svelte
View File

@@ -22,6 +22,12 @@
let jitsi_api: any = null;
const jitsi_container_id = 'jitsi_meet_external_api_container';
let disable_incoming_msg_sound: boolean = $state(true);
let disable_participant_joined_sound: boolean = $state(false); // NOTE: Disable by default
let disable_participant_left_sound: boolean = $state(false);
let disable_reaction_sound: boolean = $state(true); // NOTE: Disable by default
let disable_raise_hand_sound: boolean = $state(true); // NOTE: Disable by default
let name_input: string = $state('');
async function handle_name_update() {
@@ -99,6 +105,13 @@
room_name = url_params.room ?? 'Default-Room';
domain = url_params.domain ?? 'jitsi.dgrzone.com';
// Initialize sound settings from URL params
disable_incoming_msg_sound = url_params.incoming_msg_sound === 'true';
disable_participant_joined_sound = url_params.participant_joined_sound === 'true';
disable_participant_left_sound = url_params.participant_left_sound === 'true';
disable_reaction_sound = url_params.reaction_sound === 'true';
disable_raise_hand_sound = url_params.raise_hand_sound === 'true';
console.log(
`Jitsi: Initial data: user_id: ${user_id}, display_name: ${display_name}, email: ${email}, room_name: ${room_name}, domain: ${domain}`
);
@@ -321,11 +334,11 @@
}
const disabled_sounds = [
url_params.incoming_msg_sound === 'true' ? 'INCOMING_MSG_SOUND' : null,
url_params.participant_joined_sound === 'true' ? 'PARTICIPANT_JOINED_SOUND' : null,
url_params.participant_left_sound === 'true' ? 'PARTICIPANT_LEFT_SOUND' : null,
url_params.reaction_sound === 'true' ? 'REACTION_SOUND' : null,
url_params.raise_hand_sound === 'true' ? 'RAISE_HAND_SOUND' : null
disable_incoming_msg_sound ? 'INCOMING_MSG_SOUND' : null,
disable_participant_joined_sound ? 'PARTICIPANT_JOINED_SOUND' : null,
disable_participant_left_sound ? 'PARTICIPANT_LEFT_SOUND' : null,
disable_reaction_sound ? 'REACTION_SOUND' : null,
disable_raise_hand_sound ? 'RAISE_HAND_SOUND' : null
].filter((sound) => sound);
const options = {
@@ -366,15 +379,16 @@
{/if}
<div class="jitsi-tools text-sm max-w-xl outline">
{#if show_jitsi_tools}
<div class="jitsi-tools text-sm max-w-xl outline">
{#if expand_jitsi_tools}
<!-- NOTE: This is a <div> instead of <header> to work with IDAA's Novi styles. -->
<div class="flex flex-row gap-1 items-center justify-between w-full">
<!-- NOTE: This is a <div> instead of <h1> to work with IDAA's Novi styles. -->
<div class="text-lg w-fit">IDAA Jitsi</div>
<button
class="px-2 py-1 bg-red-200 text-white rounded hover:bg-red-400"
onclick={() => (show_jitsi_tools = false)}
onclick={() => (expand_jitsi_tools = false)}
>
<span class="fas fa-times" aria-hidden="true"></span>
<span class="sr-only">Close Jitsi Tools</span>
@@ -402,7 +416,7 @@
/>
<button
onclick={handle_name_update}
class="px-2 py-1 bg-green-500 text-white rounded hover:bg-green-600"
class="px-2 py-1 bg-green-200 text-white rounded hover:bg-green-400"
>
<span class="fas fa-user-edit" aria-hidden="true"></span>
Update
@@ -419,59 +433,136 @@
"
>
<strong>Jitsi Sound Settings:</strong>
<label>
<input type="checkbox" id="incoming_msg_sound_checkbox" checked disabled />
Disable Incoming Message Sound
<!-- WARNING: Fully disables the Play sound on option in the Jitsi > Settings > Notifications tab. -->
<label class="flex items-center space-x-2 mt-1">
<input
type="checkbox"
bind:checked={disable_incoming_msg_sound}
disabled={!is_moderator}
onchange={init_jitsi}
/>
<span>Disable Incoming Message Sound</span>
</label>
<label>
<input type="checkbox" id="participant_joined_sound_checkbox" disabled />
Disable Participant Joined Sound
<label class="flex items-center space-x-2 mt-1">
<input
type="checkbox"
bind:checked={disable_participant_joined_sound}
disabled={!is_moderator}
onchange={init_jitsi}
/>
<span>Disable Participant Joined Sound</span>
</label>
<label>
<input type="checkbox" id="participant_left_sound_checkbox" disabled />
Disable Participant Left Sound
<label class="flex items-center space-x-2 mt-1">
<input
type="checkbox"
bind:checked={disable_participant_left_sound}
disabled={!is_moderator}
onchange={init_jitsi}
/>
<span>Disable Participant Left Sound</span>
</label>
<label>
<input type="checkbox" id="reaction_sound_checkbox" checked disabled />
Disable Reaction Sound
<!-- FUTURE: Under Notifications: Talk while muted -->
<!-- FUTURE: Under Notifications: Participant entered lobby -->
<!--
FUTURE: Under Moderator:
"Everyone starts muted"
"Everyone starts hidden"
"Everyone follows me"
"Recorder follows me"
-->
<!-- WARNING: This does not seem to work. It should be unchecking Moderator options under Jitsi > Settings > Moderator tab. -->
<!-- NOTE: This does not seem to work as expected. It does not seem to do anything at all? -->
<label class="flex items-center space-x-2 mt-1">
<input
type="checkbox"
bind:checked={disable_reaction_sound}
disabled={!is_moderator}
onchange={init_jitsi}
/>
<!-- Full text from Jitsi Settings popup: "Mute reaction sounds for everyone" -->
<span>Disable Reaction Sound</span>
</label>
<label>
<input type="checkbox" id="raise_hand_sound_checkbox" checked disabled />
Disable Raise Hand Sound
<!-- WARNING: What does this correspond to in the Jitsi settings? -->
<!-- NOTE: This does not seem to work as expected. It does not seem to do anything at all? -->
<label class="flex items-center space-x-2 mt-1">
<input
type="checkbox"
bind:checked={disable_raise_hand_sound}
disabled={!is_moderator}
onchange={init_jitsi}
/>
<span>Disable Raise Hand Sound</span>
</label>
</div>
<div class="mt-2 pt-2 border-t-2 border-dashed border-gray-400">
<button
class="mt-2 px-2 py-1 bg-orange-500 text-white rounded hover:bg-orange-600"
class="mt-2 px-2 py-1 bg-orange-200 text-white rounded hover:bg-orange-400"
onclick={() => init_jitsi()}
>
<span class="fas fa-redo" aria-hidden="true"></span>
Re-initialize Jitsi
</button>
<button
class="mt-2 px-2 py-1 bg-blue-500 text-white rounded hover:bg-blue-600"
onclick={() => jitsi_api && jitsi_api.executeCommand('endMeeting')}
class="mt-2 px-2 py-1 bg-red-200 text-white rounded hover:bg-red-400"
>
<span class="fas fa-phone-slash" aria-hidden="true"></span>
End Meeting for *All*
</button>
<button
onclick={() => (show_jitsi_container = !show_jitsi_container)}
class="mt-2 px-2 py-1 bg-gray-200 text-white rounded hover:bg-gray-400"
>
{#if show_jitsi_container}
<span class="fas fa-video-slash" aria-hidden="true"></span>
Hide
{:else}
<span class="fas fa-video" aria-hidden="true"></span>
Show
{/if}
Jitsi Meeting
<span class="sr-only">Container</span>
</button>
<button
class="mt-2 px-2 py-1 bg-blue-200 text-white rounded hover:bg-blue-400"
onclick={() => {
// Placeholder for function calls to update Novi data
console.log('Re-sync Novi Data button clicked. Implement as needed.');
}}
>
<span class="fas fa-sync" aria-hidden="true"></span>
Re-sync Novi Data
</button>
</div>
{:else}
<button
class="px-2 py-1 bg-red-200 text-white rounded hover:bg-red-400"
onclick={() => (show_jitsi_tools = true)}
onclick={() => (expand_jitsi_tools = true)}
aria-label="Open Jitsi Tools"
title="Open Jitsi tools and settings for IDAA Jitsi meetings"
>
<span class="fas fa-tools" aria-hidden="true"></span>
<span class="sr-only">Open Jitsi Tools</span>
</button>
{/if}
</div>
{/if}
<style>
.jitsi-container {