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

349 lines
9.7 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>
style(guest wait): adjust font Adds client's font to the guest's waiting page.
2021-10-07 22:13:13 +08:00
/* vietnamese */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 300;
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
url('fonts/SourceSansPro/SourceSansPro-Light.woff') format('woff');
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 300;
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
url('fonts/SourceSansPro/SourceSansPro-Light.woff') format('woff');
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Source Sans Pro';
font-style: normal;
font-weight: 300;
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
url('fonts/SourceSansPro/SourceSansPro-Light.woff') format('woff');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
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;
style(guest wait): adjust font Adds client's font to the guest's waiting page.
2021-10-07 22:13:13 +08:00
font-family: 'Source Sans Pro', arial, sans-serif;
lint
2021-05-21 19:23:47 +08:00
}
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;
style(guest wait): loading dots Adjusts guest waiting page loading dots to be the same as the one displayed at the client.
2021-10-05 03:21:36 +08:00
font-size: 0px;
lint
2021-05-21 19:23:47 +08:00
}
.spinner .bounce1 {
animation-delay: -0.32s;
}
.spinner .bounce2 {
animation-delay: -0.16s;
}
.spinner>div {
style(guest wait): loading dots Adjusts guest waiting page loading dots to be the same as the one displayed at the client.
2021-10-05 03:21:36 +08:00
width: 18px;
height: 18px;
margin: 0 5px;
lint
2021-05-21 19:23:47 +08:00
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
}
}
}
fix(guests): max participants Waiting users shouldn't count as valid participants at the meeting's `maxParticipants` constraint. Avoid calling `enter` at the waiting page. Reference https://github.com/bigbluebutton/bigbluebutton/pull/10542
2021-09-28 19:31:18 +08:00
function getSearchParam(name) {
const params = new URLSearchParams(window.location.search);
get overrideLocale param from api
2021-08-03 04:08:32 +08:00
fix(guests): max participants Waiting users shouldn't count as valid participants at the meeting's `maxParticipants` constraint. Avoid calling `enter` at the waiting page. Reference https://github.com/bigbluebutton/bigbluebutton/pull/10542
2021-09-28 19:31:18 +08:00
if (params && params.has(name)) {
const param = params.get(name);
get overrideLocale param from api
2021-08-03 04:08:32 +08:00
fix(guests): max participants Waiting users shouldn't count as valid participants at the meeting's `maxParticipants` constraint. Avoid calling `enter` at the waiting page. Reference https://github.com/bigbluebutton/bigbluebutton/pull/10542
2021-09-28 19:31:18 +08:00
return param;
get overrideLocale param from api
2021-08-03 04:08:32 +08:00
}
fix(guests): max participants Waiting users shouldn't count as valid participants at the meeting's `maxParticipants` constraint. Avoid calling `enter` at the waiting page. Reference https://github.com/bigbluebutton/bigbluebutton/pull/10542
2021-09-28 19:31:18 +08:00
return null;
get overrideLocale param from api
2021-08-03 04:08:32 +08:00
}
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}`);
fix(guests): max participants Waiting users shouldn't count as valid participants at the meeting's `maxParticipants` constraint. Avoid calling `enter` at the waiting page. Reference https://github.com/bigbluebutton/bigbluebutton/pull/10542
2021-09-28 19:31:18 +08:00
const overrideLocale = getSearchParam('locale');
get overrideLocale param from api
2021-08-03 04:08:32 +08:00
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');
localize guest wait page heading
2021-10-09 16:46:10 +08:00
document.querySelector('#heading').innerHTML = _('app.guest.windowTitle');
localize guest wait page
2021-05-21 02:03:15 +08:00
updateMessage(_('app.guest.guestWait'));
enableAnimation();
try {
const ATTEMPT_EVERY_MS = 5000;
const ATTEMPT_LIMIT = 100;
fix(guests): max participants Waiting users shouldn't count as valid participants at the meeting's `maxParticipants` constraint. Avoid calling `enter` at the waiting page. Reference https://github.com/bigbluebutton/bigbluebutton/pull/10542
2021-09-28 19:31:18 +08:00
const sessionToken = getSearchParam('sessionToken');
localize guest wait page
2021-05-21 02:03:15 +08:00
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';
fix(guests): max participants Waiting users shouldn't count as valid participants at the meeting's `maxParticipants` constraint. Avoid calling `enter` at the waiting page. Reference https://github.com/bigbluebutton/bigbluebutton/pull/10542
2021-09-28 19:31:18 +08:00
const url = new URL(`${window.location.origin}${GUEST_WAIT_ENDPOINT}`);
url.search = `sessionToken=${sessionToken}&redirect=false`;
return fetch(url, { method: 'get' });
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
};
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">
Merge branch 'v2.4.x-release' of https://github.com/bigbluebutton/bigbluebutton into BBB-WCAG2.1-FINAL
2021-10-13 20:03:58 +08:00
<h1 id="heading">BigBlueButton - 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