The Jitsi meetings and most settings are working well enough for IDAA members to use for now.
This commit is contained in:
Scott Idem
@@ -3,145 +3,205 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>IDAA Novi Jitsi iframe Test Page</title>
|
||||
<title>IDAA Novi Jitsi iframe Example Template Page</title>
|
||||
</head>
|
||||
<body>
|
||||
<script>
|
||||
let novi_customer_uid = '<%=Novi.User.CustomerUniqueId%>'; // NOTE: The Novi UUID for the current current user/customer
|
||||
console.log(`Novi's Current User's ID: ${novi_customer_uid}`);
|
||||
|
||||
// var novi_current_user_role = '<%=Novi.User.xyz%>';
|
||||
// console.log(`Novi's Current User's Role: ${novi_current_user_role}`);
|
||||
<!-- START: Copy below this point -->
|
||||
<!-- IMPORTANT: This <script> element and <p> element below are for using in an iframe in the IDAA Nov site. One Sky IT's Jitsi meeting iframe -->
|
||||
|
||||
let novi_api_root_url = 'https://www.idaa.org/api';
|
||||
let novi_api_key_for_idaa = 'CmNdWgdPmgluBWjiTd8xsUCk5mio8F1O9DYAh0pVDcg=';
|
||||
<!-- IDAA and Novi specific JavaScript to get current Novi user info and load Jitsi iframe -->
|
||||
<script>
|
||||
let novi_customer_uid = '<%=Novi.User.CustomerUniqueId%>'; // NOTE: The Novi UUID for the current current user/customer
|
||||
console.log(`Novi's Current User's ID: ${novi_customer_uid}`);
|
||||
|
||||
let novi_current_user_obj = null;
|
||||
let novi_current_user_email = null;
|
||||
// var novi_current_user_role = '<%=Novi.User.xyz%>';
|
||||
// console.log(`Novi's Current User's Role: ${novi_current_user_role}`);
|
||||
|
||||
let room_name = 'IDAA-Student-and-Resident-Meeting'; // 'IDAA-Student-and-Resident-Meeting' 'idaa-meeting'
|
||||
let is_moderator = false;
|
||||
let novi_api_root_url = 'https://www.idaa.org/api';
|
||||
let novi_api_key_for_idaa = 'CmNdWgdPmgluBWjiTd8xsUCk5mio8F1O9DYAh0pVDcg=';
|
||||
|
||||
let idaa_osit_site_key = '8VTOJ0X5hvT6JdiTJsGEzQ'; // 'restricted-access'
|
||||
// let idaa_ae_api_root_url = 'https://sk-idaa.oneskyit.com/idaa/jitsi_meet';
|
||||
let idaa_ae_api_root_url =
|
||||
'https://static.oneskyit.com/c/DgrZone/jitsi_iframe_api.html';
|
||||
let idaa_ae_params = new URLSearchParams(document.location.search);
|
||||
// let idaa_ae_slct_event_id = idaa_ae_params.get('event_id');
|
||||
let novi_current_user_obj = null;
|
||||
let novi_current_user_email = null;
|
||||
|
||||
let idaa_ae_iframe_height = null;
|
||||
let room_name = 'IDAA-Example-Meeting'; // 'IDAA-Student-and-Resident-Meeting'; 'IDAA-Meeting';
|
||||
let is_moderator = false;
|
||||
|
||||
var novi_api_headers = new Headers();
|
||||
novi_api_headers.append('Authorization', `Basic ${novi_api_key_for_idaa}`);
|
||||
// Disable Jitsi sound settings. Set to true DISABLES the sound.
|
||||
let incoming_msg_sound = true;
|
||||
let participant_joined_sound = false;
|
||||
let participant_left_sound = false;
|
||||
let reaction_sound = true;
|
||||
let raise_hand_sound = true;
|
||||
|
||||
var requestOptions = {
|
||||
method: 'GET',
|
||||
headers: novi_api_headers,
|
||||
redirect: 'follow'
|
||||
};
|
||||
let idaa_osit_site_key = '8VTOJ0X5hvT6JdiTJsGEzQ'; // 'restricted-access'
|
||||
// let idaa_ae_api_root_url = 'https://sk-idaa.oneskyit.com/idaa/jitsi_meet';
|
||||
let idaa_ae_api_root_url =
|
||||
'https://static.oneskyit.com/c/DgrZone/jitsi_iframe_api_testing.html';
|
||||
let idaa_ae_params = new URLSearchParams(document.location.search);
|
||||
// let idaa_ae_slct_event_id = idaa_ae_params.get('event_id');
|
||||
|
||||
let novi_api_get_customer_endpoint = `${novi_api_root_url}/customers/${novi_customer_uid}`;
|
||||
console.log(novi_api_get_customer_endpoint);
|
||||
let idaa_ae_iframe_height = null;
|
||||
|
||||
fetch(novi_api_get_customer_endpoint, requestOptions)
|
||||
// .then(response => response.text())
|
||||
.then((response) => response.json())
|
||||
.then((result) => {
|
||||
novi_current_user_obj = result;
|
||||
console.log(`Novi's Current User Obj:`, novi_current_user_obj);
|
||||
// console.log(`Novi's Current User Obj (${novi_current_user_obj.Email}):`, novi_current_user_obj);
|
||||
var novi_api_headers = new Headers();
|
||||
novi_api_headers.append('Authorization', `Basic ${novi_api_key_for_idaa}`);
|
||||
|
||||
let full_name = novi_current_user_obj?.Name;
|
||||
let first_name = novi_current_user_obj?.FirstName;
|
||||
let last_initial = novi_current_user_obj?.LastName
|
||||
? novi_current_user_obj.LastName.charAt(0).toUpperCase() + '.'
|
||||
: '';
|
||||
if (last_initial) {
|
||||
full_name = `${first_name} ${last_initial}`;
|
||||
}
|
||||
console.log(`Novi's Current User's Full Name: ${full_name}`);
|
||||
var requestOptions = {
|
||||
method: 'GET',
|
||||
headers: novi_api_headers,
|
||||
redirect: 'follow'
|
||||
};
|
||||
|
||||
let idaa_ae_iframe_element = document.getElementById(
|
||||
'ae_idaa_jitsi_meeting_iframe'
|
||||
);
|
||||
let novi_api_get_customer_endpoint = `${novi_api_root_url}/customers/${novi_customer_uid}`;
|
||||
console.log(novi_api_get_customer_endpoint);
|
||||
|
||||
idaa_ae_iframe_element.src = `${idaa_ae_api_root_url}?uuid=${novi_customer_uid}&email=${novi_current_user_obj.Email}&full_name=${full_name}&moderator=${is_moderator}&room=${room_name}&iframe=true&key=${idaa_osit_site_key}`;
|
||||
fetch(novi_api_get_customer_endpoint, requestOptions)
|
||||
// .then(response => response.text())
|
||||
.then((response) => response.json())
|
||||
.then((result) => {
|
||||
novi_current_user_obj = result;
|
||||
console.log(`Novi's Current User Obj:`, novi_current_user_obj);
|
||||
// console.log(`Novi's Current User Obj (${novi_current_user_obj.Email}):`, novi_current_user_obj);
|
||||
|
||||
// url.searchParams.delete('event_id');
|
||||
// history.pushState({}, '', url);
|
||||
})
|
||||
.catch((error) => console.log('error', error));
|
||||
let full_name = novi_current_user_obj?.Name;
|
||||
let first_name = novi_current_user_obj?.FirstName;
|
||||
let last_initial = novi_current_user_obj?.LastName
|
||||
? novi_current_user_obj.LastName.charAt(0).toUpperCase() + '.'
|
||||
: '';
|
||||
if (last_initial) {
|
||||
full_name = `${first_name} ${last_initial}`;
|
||||
}
|
||||
console.log(`Novi's Current User's Full Name: ${full_name}`);
|
||||
|
||||
window.addEventListener('message', function (event) {
|
||||
// console.log('Message received from the child:', event.data); // Message received from child
|
||||
let idaa_ae_iframe_element = document.getElementById(
|
||||
'ae_idaa_jitsi_meeting_iframe'
|
||||
);
|
||||
|
||||
if (event.data) {
|
||||
if (event.data.iframe_height) {
|
||||
// console.log(`Got iframe height: ${event.data.iframe_height}`);
|
||||
idaa_ae_iframe_height = event.data.iframe_height;
|
||||
idaa_ae_iframe_element.src =
|
||||
`${idaa_ae_api_root_url}?uuid=${novi_customer_uid}&email=${novi_current_user_obj.Email}&full_name=${full_name}&moderator=${is_moderator}&room=${room_name}&iframe=true&key=${idaa_osit_site_key}&incoming_msg_sound=${incoming_msg_sound}&participant_joined_sound=${participant_joined_sound}&participant_left_sound=${participant_left_sound}&reaction_sound=${reaction_sound}&raise_hand_sound=${raise_hand_sound}`
|
||||
;
|
||||
|
||||
let idaa_ae_iframe_element = document.getElementById(
|
||||
'ae_idaa_novi_meeting_iframe'
|
||||
);
|
||||
// url.searchParams.delete('event_id');
|
||||
// history.pushState({}, '', url);
|
||||
})
|
||||
.catch((error) => console.log('error', error));
|
||||
|
||||
// idaa_ae_iframe_element.style.height = idaa_ae_iframe_height;
|
||||
idaa_ae_iframe_element.style.height = `${idaa_ae_iframe_height + 50}px`;
|
||||
}
|
||||
window.addEventListener('message', function (event) {
|
||||
// console.log('Message received from the child:', event.data); // Message received from child
|
||||
|
||||
if (event.data.scroll_to !== undefined) {
|
||||
console.log(`Got scroll_to: ${event.data.scroll_to}`);
|
||||
if (event.data) {
|
||||
if (event.data.iframe_height) {
|
||||
// console.log(`Got iframe height: ${event.data.iframe_height}`);
|
||||
idaa_ae_iframe_height = event.data.iframe_height;
|
||||
|
||||
let idaa_ae_iframe_element = document.getElementById(
|
||||
'ae_idaa_novi_meeting_iframe'
|
||||
);
|
||||
if (idaa_ae_iframe_element) {
|
||||
console.log(`Scrolling to: ${event.data.scroll_to}`);
|
||||
// window.scrollTo(0, 0); // This works for all current browsers
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
left: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
// idaa_ae_iframe_element.scrollTo({x: 0, y: 0}); // Scroll to top
|
||||
// document.body.scrollTo({x: 0, y: 0}); // Scroll to top
|
||||
// document.body.scrollTo({
|
||||
// top: 0,
|
||||
// behavior: 'smooth'
|
||||
// });
|
||||
// document.body.scrollTop = 0;
|
||||
// idaa_ae_iframe_element?.scrollTo(0, 0)
|
||||
// idaa_ae_iframe_element.scrollTo({
|
||||
// top: 0,
|
||||
// behavior: 'smooth'
|
||||
// });
|
||||
// idaa_ae_iframe_element.scrollTo({
|
||||
// top: event.data.scroll_to,
|
||||
// behavior: 'smooth'
|
||||
// });
|
||||
} else {
|
||||
console.warn(
|
||||
`Element with ID "ae_idaa_jitsi_meeting_iframe" not found.`
|
||||
);
|
||||
}
|
||||
}
|
||||
let idaa_ae_iframe_element = document.getElementById(
|
||||
'ae_idaa_novi_meeting_iframe'
|
||||
);
|
||||
|
||||
// idaa_ae_iframe_element.style.height = idaa_ae_iframe_height;
|
||||
idaa_ae_iframe_element.style.height = `${idaa_ae_iframe_height + 50}px`;
|
||||
}
|
||||
|
||||
if (event.data.scroll_to !== undefined) {
|
||||
console.log(`Got scroll_to: ${event.data.scroll_to}`);
|
||||
|
||||
let idaa_ae_iframe_element = document.getElementById(
|
||||
'ae_idaa_novi_meeting_iframe'
|
||||
);
|
||||
if (idaa_ae_iframe_element) {
|
||||
console.log(`Scrolling to: ${event.data.scroll_to}`);
|
||||
// window.scrollTo(0, 0); // This works for all current browsers
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
left: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
// idaa_ae_iframe_element.scrollTo({x: 0, y: 0}); // Scroll to top
|
||||
// document.body.scrollTo({x: 0, y: 0}); // Scroll to top
|
||||
// document.body.scrollTo({
|
||||
// top: 0,
|
||||
// behavior: 'smooth'
|
||||
// });
|
||||
// document.body.scrollTop = 0;
|
||||
// idaa_ae_iframe_element?.scrollTo(0, 0)
|
||||
// idaa_ae_iframe_element.scrollTo({
|
||||
// top: 0,
|
||||
// behavior: 'smooth'
|
||||
// });
|
||||
// idaa_ae_iframe_element.scrollTo({
|
||||
// top: event.data.scroll_to,
|
||||
// behavior: 'smooth'
|
||||
// });
|
||||
} else {
|
||||
console.log(`No data in message? ${event}`);
|
||||
console.warn(
|
||||
`Element with ID "ae_idaa_jitsi_meeting_iframe" not found.`
|
||||
);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
}
|
||||
} else {
|
||||
console.log(`No data in message? ${event}`);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- IDAA OSIT iframe container element for Novi - Jitsi Meeting iframe -->
|
||||
<p>
|
||||
<iframe
|
||||
width="100%"
|
||||
height="950"
|
||||
id="ae_idaa_jitsi_meeting_iframe"
|
||||
src=""
|
||||
style="min-height: 750px; height: min-content; max-height: 2048px"
|
||||
class="ae_idaa_iframe"
|
||||
allow="camera; microphone; fullscreen; display-capture; autoplay; clipboard-write"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</p>
|
||||
|
||||
<!-- Enable or disable sounds -->
|
||||
<div
|
||||
class=""
|
||||
style="margin-top: 1.5em; border-top: 2px dashed #ccc; padding: 1em; background-color: pink;"
|
||||
>
|
||||
<strong>Jitsi Sound Settings:</strong>
|
||||
<label>
|
||||
<input type="checkbox" id="incoming_msg_sound_checkbox" checked disabled />
|
||||
Disable Incoming Message Sound
|
||||
</label>
|
||||
|
||||
<label>
|
||||
<input type="checkbox" id="participant_joined_sound_checkbox" disabled />
|
||||
Disable Participant Joined Sound
|
||||
</label>
|
||||
|
||||
<label>
|
||||
<input type="checkbox" id="participant_left_sound_checkbox" disabled />
|
||||
Disable Participant Left Sound
|
||||
</label>
|
||||
|
||||
<label>
|
||||
<input type="checkbox" id="reaction_sound_checkbox" checked disabled />
|
||||
Disable Reaction Sound
|
||||
</label>
|
||||
<label>
|
||||
<input type="checkbox" id="raise_hand_sound_checkbox" checked disabled />
|
||||
Disable Raise Hand Sound
|
||||
</label>
|
||||
|
||||
<button
|
||||
id="reload_iframe_button"
|
||||
style="background-color: orange;"
|
||||
onclick="
|
||||
let iframe_element = document.getElementById('ae_idaa_jitsi_meeting_iframe');
|
||||
if (iframe_element) {
|
||||
iframe_element.src = iframe_element.src;
|
||||
}
|
||||
">
|
||||
Reload Iframe
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- STOP: Do not copy below this point -->
|
||||
|
||||
<!-- IDAA Aether Apps for Novi - Recovery Meetings (events) iframe -->
|
||||
<p>
|
||||
<iframe
|
||||
width="100%"
|
||||
height="950"
|
||||
id="ae_idaa_jitsi_meeting_iframe"
|
||||
src=""
|
||||
style="min-height: 950px; height: min-content; max-height: 2048px"
|
||||
class="ae_idaa_iframe"
|
||||
allow="camera; microphone; fullscreen; display-capture; autoplay; clipboard-write"
|
||||
allowfullscreen
|
||||
></iframe>
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user