BigBlueButton/bigbluebutton-Github
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
0a5548a058
bigbluebutton-Github/bigbluebutton-html5/private/static/guest-wait/guest-wait.html

346 lines
9.3 KiB
HTML
Raw Normal View History

Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
<!DOCTYPE html>
<html>
lint
2021-05-21 19:23:47 +08:00
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
<head>
wcag 2.1 access update to guest-waiting room
2021-09-20 06:09:49 +08:00
<title>BigBlueButton - Guest Lobby</title>
Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
<meta charset="UTF-8">
<style>
lint
2021-05-21 19:23:47 +08:00
:root {
--enableAnimation: 1;
}
body {
display: flex;
justify-content: center;
align-items: center;
background: #06172A;
height: 100vh;
margin: 0;
}
#content {
text-align: center;
color: white;
font-weight: bold;
font-size: 24px;
font-family: arial, sans-serif;
}
wcag 2.1 access update to guest-waiting room
2021-09-20 06:09:49 +08:00
#content h1 {
font-size: 2rem;
}
lint
2021-05-21 19:23:47 +08:00
.spinner {
margin: 20px auto;
}
.spinner .bounce1 {
animation-delay: -0.32s;
}
.spinner .bounce2 {
animation-delay: -0.16s;
}
.spinner>div {
width: 30px;
height: 30px;
background-color: rgb(255, 255, 255);
display: inline-block;
border-radius: 100%;
animation: sk-bouncedelay calc(var(--enableAnimation) * 1.4s) infinite ease-in-out both;
}
@-webkit-keyframes sk-bouncedelay {
0%,
80%,
100% {
-webkit-transform: scale(0)
Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
}
lint
2021-05-21 19:23:47 +08:00
Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
40% {
lint
2021-05-21 19:23:47 +08:00
-webkit-transform: scale(1.0)
Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
}
lint
2021-05-21 19:23:47 +08:00
}
@keyframes sk-bouncedelay {
Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
lint
2021-05-21 19:23:47 +08:00
0%,
80%,
100% {
-webkit-transform: scale(0);
transform: scale(0);
Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
}
lint
2021-05-21 19:23:47 +08:00
Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
40% {
lint
2021-05-21 19:23:47 +08:00
-webkit-transform: scale(1.0);
transform: scale(1.0);
Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
}
lint
2021-05-21 19:23:47 +08:00
}
Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
</style>
Add guest lobby messages Moderators are able to send a message to the meeting's guest lobby. This new event reaches bbb-web and is sent to the guest user with her/his status response while polling. All guest users that are waiting for acceptance will be able to read this message. enableGuestLobbyMessage is disabled by default.
2020-10-03 01:29:27 +08:00
localize guest wait page
2021-05-21 02:03:15 +08:00
<script type="text/javascript">
let messages = {};
feature(bbb-html5): localize guest-wait.html This introduces initial translations for the guest-wait pages. The only supported languages are en and de for now. Needs a concept to hook it up with transifex.
2021-04-30 00:55:15 +08:00
localize guest wait page
2021-05-21 02:03:15 +08:00
function _(message) {
return messages[message];
}
feature(bbb-html5): localize guest-wait.html This introduces initial translations for the guest-wait pages. The only supported languages are en and de for now. Needs a concept to hook it up with transifex.
2021-04-30 00:55:15 +08:00
Improve guest lobby feedback Included a message and a redirect for the cases where the guest is not allowed to join or the meeting has expired/ended.
2021-03-30 09:17:59 +08:00
const REDIRECT_TIMEOUT = 15000;
add approved redirect message in guest wait page
2021-09-29 10:13:31 +08:00
const MESSAGE_TIMEOUT = 3000;
Improve guest lobby feedback Included a message and a redirect for the cases where the guest is not allowed to join or the meeting has expired/ended.
2021-03-30 09:17:59 +08:00
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
function updateMessage(message) {
Remove JQuery
2020-07-07 04:07:55 +08:00
document.querySelector('#content > p').innerHTML = message;
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
}
Improve guest lobby feedback Included a message and a redirect for the cases where the guest is not allowed to join or the meeting has expired/ended.
2021-03-30 09:17:59 +08:00
let lobbyMessage = '';
Add guest lobby messages Moderators are able to send a message to the meeting's guest lobby. This new event reaches bbb-web and is sent to the guest user with her/his status response while polling. All guest users that are waiting for acceptance will be able to read this message. enableGuestLobbyMessage is disabled by default.
2020-10-03 01:29:27 +08:00
function updateLobbyMessage(message) {
if (message !== lobbyMessage) {
lobbyMessage = message;
if (lobbyMessage.length !== 0) {
updateMessage(lobbyMessage);
} else {
localize guest wait page
2021-05-21 02:03:15 +08:00
updateMessage(_('app.guest.guestWait'));
Add guest lobby messages Moderators are able to send a message to the meeting's guest lobby. This new event reaches bbb-web and is sent to the guest user with her/his status response while polling. All guest users that are waiting for acceptance will be able to read this message. enableGuestLobbyMessage is disabled by default.
2020-10-03 01:29:27 +08:00
}
}
}
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
function findSessionToken() {
return location.search
.substr(1)
.split('&')
lint
2021-05-21 19:23:47 +08:00
.find(function (item) {
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
return item.split('=')[0] === 'sessionToken'
});
};
get overrideLocale param from api
2021-08-03 04:08:32 +08:00
async function fetchOverrideLocale() {
const token = findSessionToken();
let overrideLocale = false;
if (token) {
const sessionToken = token.split('=')[1];
// use enter api to get params for the client
const ENTER_ENDPOINT = `/bigbluebutton/api/enter?sessionToken=${sessionToken}`;
const url = new URL(`${window.location.origin}${ENTER_ENDPOINT}`);
const fetchContent = await fetch(url, { credentials: 'same-origin' });
const parseToJson = await fetchContent.json();
const { response } = parseToJson;
if (response.returncode !== 'FAILED') {
const { customdata } = response;
customdata.forEach((el) => {
const settingKey = Object.keys(el).shift();
if (settingKey === 'bbb_override_default_locale') {
overrideLocale = el[settingKey];
}
});
}
}
return overrideLocale;
}
async function fetchLocalizedMessages() {
localize guest wait page
2021-05-21 02:03:15 +08:00
const DEFAULT_LANGUAGE = 'en';
const LOCALES_ENDPOINT = '/html5client/locale';
const url = new URL(`${window.location.origin}${LOCALES_ENDPOINT}`);
get overrideLocale param from api
2021-08-03 04:08:32 +08:00
const overrideLocale = await fetchOverrideLocale();
url.search = overrideLocale
? `locale=${overrideLocale}`
: `locale=${navigator.language}&init=true`;
wcag 2.1 access update to guest-waiting room
2021-09-20 06:09:49 +08:00
document.getElementsByTagName('html')[0].lang = overrideLocale || navigator.language;
localize guest wait page
2021-05-21 02:03:15 +08:00
const localesPath = 'locales';
fetch(url)
.then((response) => {
if (!response.ok) {
return false;
}
return response.json();
})
.then(({ normalizedLocale, regionDefaultLocale }) => {
const fetchFallbackMessages = new Promise((resolve, reject) => {
fetch(`${localesPath}/${DEFAULT_LANGUAGE}.json`)
.then((response) => {
if (!response.ok) {
return reject();
}
return resolve(response.json());
});
});
const fetchRegionMessages = new Promise((resolve) => {
if (!regionDefaultLocale) {
return resolve(false);
}
fetch(`${localesPath}/${regionDefaultLocale}.json`)
.then((response) => {
if (!response.ok) {
return resolve(false);
}
prevent endless loop if locale file is invalid json
2021-08-26 00:12:38 +08:00
return response.json()
.then((jsonResponse) => resolve(jsonResponse))
.catch(() => {
resolve(false);
});
localize guest wait page
2021-05-21 02:03:15 +08:00
});
});
const fetchSpecificMessages = new Promise((resolve) => {
if (!normalizedLocale || normalizedLocale === DEFAULT_LANGUAGE || normalizedLocale === regionDefaultLocale) {
return resolve(false);
}
fetch(`${localesPath}/${normalizedLocale}.json`)
.then((response) => {
if (!response.ok) {
return resolve(false);
}
prevent endless loop if locale file is invalid json
2021-08-26 00:12:38 +08:00
return response.json()
.then((jsonResponse) => resolve(jsonResponse))
.catch(() => {
resolve(false);
});
localize guest wait page
2021-05-21 02:03:15 +08:00
});
});
Promise.all([fetchFallbackMessages, fetchRegionMessages, fetchSpecificMessages])
.then((values) => {
let mergedMessages = Object.assign({}, values[0]);
if (!values[1] && !values[2]) {
normalizedLocale = DEFAULT_LANGUAGE;
} else {
if (values[1]) {
mergedMessages = Object.assign(mergedMessages, values[1]);
}
if (values[2]) {
mergedMessages = Object.assign(mergedMessages, values[2]);
}
}
messages = mergedMessages;
window.document.title = _('app.guest.windowTitle');
updateMessage(_('app.guest.guestWait'));
enableAnimation();
try {
const ATTEMPT_EVERY_MS = 5000;
const ATTEMPT_LIMIT = 100;
const sessionToken = findSessionToken();
if (!sessionToken) {
disableAnimation()
updateMessage(_('app.guest.noSessionToken'));
return;
}
pollGuestStatus(sessionToken, 0, ATTEMPT_LIMIT, ATTEMPT_EVERY_MS);
} catch (e) {
disableAnimation();
console.error(e);
updateMessage(_('app.guest.errorSeeConsole'));
}
})
.catch((e) => {
console.error(e);
});
});
lint
2021-05-21 19:23:47 +08:00
}
localize guest wait page
2021-05-21 02:03:15 +08:00
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
function fetchGuestWait(sessionToken) {
Add guest lobby messages Moderators are able to send a message to the meeting's guest lobby. This new event reaches bbb-web and is sent to the guest user with her/his status response while polling. All guest users that are waiting for acceptance will be able to read this message. enableGuestLobbyMessage is disabled by default.
2020-10-03 01:29:27 +08:00
const GUEST_WAIT_ENDPOINT = '/bigbluebutton/api/guestWait';
Remove JQuery
2020-07-07 04:07:55 +08:00
const urlTest = new URL(`${window.location.origin}${GUEST_WAIT_ENDPOINT}`);
const concatedParams = sessionToken.concat('&redirect=false');
urlTest.search = concatedParams;
Improve guest lobby feedback Included a message and a redirect for the cases where the guest is not allowed to join or the meeting has expired/ended.
2021-03-30 09:17:59 +08:00
return fetch(urlTest, { method: 'get' });
};
function redirect(message, url) {
disableAnimation();
updateMessage(message);
setTimeout(() => {
window.location = url;
}, REDIRECT_TIMEOUT);
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
};
function pollGuestStatus(token, attempt, limit, everyMs) {
lint
2021-05-21 19:23:47 +08:00
setTimeout(function () {
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
if (attempt >= limit) {
Tweak animation to stop when request fails
2020-07-07 04:24:46 +08:00
disableAnimation();
localize guest wait page
2021-05-21 02:03:15 +08:00
updateMessage(_('app.guest.noModeratorResponse'));
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
return;
}
Remove JQuery
2020-07-07 04:07:55 +08:00
fetchGuestWait(token)
lint
2021-05-21 19:23:47 +08:00
.then(async (resp) => await resp.json())
.then((data) => {
const code = data.response.returncode;
Improve guest lobby feedback Included a message and a redirect for the cases where the guest is not allowed to join or the meeting has expired/ended.
2021-03-30 09:17:59 +08:00
lint
2021-05-21 19:23:47 +08:00
if (code === 'FAILED') {
return redirect(_('app.guest.' + data.response.messageKey), data.response.url);
}
Improve guest lobby feedback Included a message and a redirect for the cases where the guest is not allowed to join or the meeting has expired/ended.
2021-03-30 09:17:59 +08:00
lint
2021-05-21 19:23:47 +08:00
const status = data.response.guestStatus;
Improve guest lobby feedback Included a message and a redirect for the cases where the guest is not allowed to join or the meeting has expired/ended.
2021-03-30 09:17:59 +08:00
lint
2021-05-21 19:23:47 +08:00
if (status === 'DENY') {
return redirect(_('app.guest.' + data.response.messageKey), data.response.url);
}
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
lint
2021-05-21 19:23:47 +08:00
if (status === 'ALLOW') {
add approved redirect message in guest wait page
2021-09-29 10:13:31 +08:00
updateLobbyMessage(_('app.guest.allow'));
Add comment
2021-09-29 23:08:35 +08:00
// Timeout is required by accessibility to allow viewing of the message for a minimum of 3 seconds
// before redirecting.
add approved redirect message in guest wait page
2021-09-29 10:13:31 +08:00
setTimeout(() => {
disableAnimation();
window.location = data.response.url;
}, MESSAGE_TIMEOUT);
lint
2021-05-21 19:23:47 +08:00
return;
}
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
lint
2021-05-21 19:23:47 +08:00
updateLobbyMessage(data.response.lobbyMessage);
Add guest lobby messages Moderators are able to send a message to the meeting's guest lobby. This new event reaches bbb-web and is sent to the guest user with her/his status response while polling. All guest users that are waiting for acceptance will be able to read this message. enableGuestLobbyMessage is disabled by default.
2020-10-03 01:29:27 +08:00
lint
2021-05-21 19:23:47 +08:00
return pollGuestStatus(token, attempt + 1, limit, everyMs);
});
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
}, everyMs);
};
lint
2021-05-21 19:23:47 +08:00
function enableAnimation() {
Tweak animation to stop when request fails
2020-07-07 04:24:46 +08:00
document.documentElement.style.setProperty('--enableAnimation', 1);
}
function disableAnimation() {
document.documentElement.style.setProperty('--enableAnimation', 0);
}
lint
2021-05-21 19:23:47 +08:00
window.onload = function () {
localize guest wait page
2021-05-21 02:03:15 +08:00
fetchLocalizedMessages();
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
};
</script>
</head>
<body>
<div id="content">
update guest lobby title
2021-09-20 09:12:08 +08:00
<h1>Guest Lobby</h1>
Move guest-wait.html to bbb-html5 package
2020-07-07 01:53:15 +08:00
<div class="spinner">
<div class="bounce1"></div>
<div class="bounce2"></div>
<div class="bounce3"></div>
</div>
wcag 2.1 access update to guest-waiting room
2021-09-20 06:09:49 +08:00
<p aria-live="polite">Please wait for a moderator to approve you joining the meeting.</p>
Move guest wait from bbb-client to bbb-html
2020-07-03 04:14:49 +08:00
</div>
</body>
remove unused function
2021-05-21 19:26:44 +08:00
</html>
Reference in New Issue Copy Permalink