128 lines
4.3 KiB
HTML
128 lines
4.3 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Jitsi Meetings iframe API for IDAA</title>
|
|
</head>
|
|
<body>
|
|
|
|
|
|
<h1>New Jitsi Meetings for IDAA</h1>
|
|
<p>The URL parameters are passed from the Novi page that contains this as an iframe. This will automatically set the attendees name, email address, moderator status, and room name. The moderator status is based on the Novi UUID. This message will be hidden before going live.</p>
|
|
|
|
<div id="jitsi_meet_external_api_container" style="height: 750px; width: 100%;"></div>
|
|
<script src="https://jitsi.dgrzone.com/external_api.js"></script>
|
|
|
|
<script lang="ts">
|
|
|
|
// Get user info from URL parameters. Generated by the Novi page that contains this iframe.
|
|
let novi_url_params = new URLSearchParams(document.location.search);
|
|
let user_id = novi_url_params.get('uuid');
|
|
let user_full_name = novi_url_params.get('full_name');
|
|
let user_email = novi_url_params.get('email');
|
|
let user_moderator = novi_url_params.get('moderator');
|
|
|
|
// Jitsi Meet External API variables
|
|
let domain = 'jitsi.dgrzone.com';
|
|
let room_name = novi_url_params.get('room') ?? 'the-default-room';
|
|
let display_name = user_full_name ?? 'Not My Name';
|
|
let email = user_email ?? 'test+unknown@oneskyit.com';
|
|
// Replace spaces with plus symbol in email addresses
|
|
email = email.replace(/\s+/g, '+');
|
|
let is_moderator = (user_moderator === 'true' || user_moderator === true) ? true : false;
|
|
|
|
|
|
// Temporarily hard coding moderators:
|
|
// 5724aad7-6d89-47e7-8943-966fd22911bd = Steven L. Klein - Stevenklein425@gmail.com
|
|
let novi_jitsi_mod_li = ["2b078deb-b4e7-4203-99da-9f7cd62159a5", "c9ea07b5-06b0-4a43-a2d0-8d06558c8a82", "58db22ee-4b0a-49a7-9f34-53d2ba85a84b", "5724aad7-6d89-47e7-8943-966fd22911bd"];
|
|
|
|
if (novi_jitsi_mod_li.includes(user_id)) {
|
|
is_moderator = true;
|
|
}
|
|
|
|
|
|
// 1. Function to fetch the JWT from your backend
|
|
async function getJitsiJwt() {
|
|
// This is the URL of your backend API endpoint.
|
|
// It's a server-side route that will create the JWT for you.
|
|
const tokenEndpoint = 'https://api.oneskyit.com/api/jitsi_token';
|
|
|
|
// Pass user information and moderator status to the backend
|
|
const payload = {
|
|
room: room_name,
|
|
name: display_name,
|
|
email: email,
|
|
is_moderator: is_moderator
|
|
};
|
|
console.log("Requesting JWT with payload:", payload);
|
|
|
|
try {
|
|
const response = await fetch(tokenEndpoint, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify(payload)
|
|
});
|
|
|
|
if (!response.ok) {
|
|
throw new Error('Failed to fetch JWT token from the server.');
|
|
}
|
|
|
|
const data = await response.json();
|
|
return data.token; // Your backend should return a JSON object like { "token": "..." }
|
|
|
|
} catch (error) {
|
|
console.error("Error getting JWT:", error);
|
|
return null;
|
|
}
|
|
}
|
|
|
|
// 2. Main function to initialize the Jitsi API with the JWT
|
|
async function initJitsiApi() {
|
|
let jwtToken = null;
|
|
if (is_moderator) {
|
|
jwtToken = await getJitsiJwt();
|
|
|
|
if (!jwtToken) {
|
|
// Handle the error (e.g., show a message to the user)
|
|
document.getElementById('jitsi_meet_external_api_container').innerHTML = "<h1>Authentication Failed. Please try again.</h1>";
|
|
return;
|
|
}
|
|
}
|
|
|
|
const options = {
|
|
roomName: room_name,
|
|
width: '100%',
|
|
height: '100%',
|
|
parentNode: document.getElementById('jitsi_meet_external_api_container'),
|
|
userInfo: {
|
|
displayName: display_name,
|
|
email: email,
|
|
},
|
|
configOverwrite: {
|
|
prejoinPageEnabled: false,
|
|
startWithAudioMuted: true,
|
|
startWithVideoMuted: true,
|
|
enablePrejoinPage: false,
|
|
enableWelcomePage: false,
|
|
enableClosePage: false,
|
|
enableLobby: is_moderator,
|
|
},
|
|
// Pass the fetched JWT to the Jitsi API
|
|
jwt: jwtToken
|
|
};
|
|
|
|
const api = new JitsiMeetExternalAPI(domain, options);
|
|
console.log("Jitsi API initialized with options:", options);
|
|
}
|
|
|
|
// 3. Call the initialization function when the page loads
|
|
document.addEventListener('DOMContentLoaded', initJitsiApi);
|
|
|
|
</script>
|
|
|
|
|
|
</body>
|
|
</html> |