jiti-meet/modules/UI/authentication/LoginDialog.js

256 lines
7.3 KiB
JavaScript
Raw Normal View History

/* global $, APP, config */
2017-09-18 07:09:43 +00:00
import { toJid } from '../../../react/features/base/connection/functions';
import {
JitsiConnectionErrors
} from '../../../react/features/base/lib-jitsi-meet';
2016-01-15 14:59:35 +00:00
/**
* Build html for "password required" dialog.
* @returns {string} html string
*/
2015-12-17 15:31:11 +00:00
function getPasswordInputHtml() {
const placeholder = config.hosts.authdomain
? 'user identity'
: 'user@domain.net';
2015-12-17 15:31:11 +00:00
return `
<input name="username" type="text"
2016-11-09 16:46:58 +00:00
class="input-control"
placeholder=${placeholder} autofocus>
2015-12-17 15:31:11 +00:00
<input name="password" type="password"
2016-11-09 16:46:58 +00:00
class="input-control"
data-i18n="[placeholder]dialog.userPassword">`;
}
2016-01-15 14:59:35 +00:00
/**
* Generate cancel button config for the dialog.
* @returns {Object}
*/
function cancelButton() {
return {
title: APP.translation.generateTranslationHTML('dialog.Cancel'),
value: false
};
2015-12-17 15:31:11 +00:00
}
2016-01-15 14:59:35 +00:00
/**
* Auth dialog for JitsiConnection which supports retries.
* If no cancelCallback provided then there will be
* no cancel button on the dialog.
*
* @class LoginDialog
* @constructor
*
* @param {function(jid, password)} successCallback
* @param {function} [cancelCallback] callback to invoke if user canceled.
*/
function LoginDialog(successCallback, cancelCallback) {
const loginButtons = [ {
title: APP.translation.generateTranslationHTML('dialog.Ok'),
value: true
} ];
const finishedButtons = [ {
title: APP.translation.generateTranslationHTML('dialog.retry'),
value: 'retry'
} ];
// show "cancel" button only if cancelCallback provided
if (cancelCallback) {
loginButtons.push(cancelButton());
finishedButtons.push(cancelButton());
}
const states = {
login: {
buttons: loginButtons,
focus: ':input:first',
html: getPasswordInputHtml(),
titleKey: 'dialog.passwordRequired',
submit(e, v, m, f) { // eslint-disable-line max-params
e.preventDefault();
if (v) {
const jid = f.username;
const password = f.password;
if (jid && password) {
// eslint-disable-next-line no-use-before-define
connDialog.goToState('connecting');
2017-09-08 13:36:42 +00:00
successCallback(toJid(jid, config.hosts), password);
}
} else {
// User cancelled
2015-12-15 12:09:44 +00:00
cancelCallback();
}
}
},
connecting: {
buttons: [],
defaultButton: 0,
html: '<div id="connectionStatus"></div>',
titleKey: 'dialog.connecting'
},
finished: {
buttons: finishedButtons,
defaultButton: 0,
html: '<div id="errorMessage"></div>',
titleKey: 'dialog.error',
submit(e, v) {
e.preventDefault();
if (v === 'retry') {
// eslint-disable-next-line no-use-before-define
connDialog.goToState('login');
} else {
// User cancelled
cancelCallback();
}
}
}
};
const connDialog = APP.UI.messageHandler.openDialogWithStates(
states,
{
closeText: '',
persistent: true,
zIndex: 1020
},
null
);
/**
* Displays error message in 'finished' state which allows either to cancel
* or retry.
* @param error the key to the error to be displayed.
* @param options the options to the error message (optional)
*/
this.displayError = function(error, options) {
const finishedState = connDialog.getState('finished');
const errorMessageElem = finishedState.find('#errorMessage');
let messageKey;
if (error === JitsiConnectionErrors.PASSWORD_REQUIRED) {
// this is a password required error, as login window was already
// open once, this means username or password is wrong
messageKey = 'dialog.incorrectPassword';
} else {
messageKey = 'dialog.connectErrorWithMsg';
if (!options) {
options = {};// eslint-disable-line no-param-reassign
}
options.msg = error;
}
errorMessageElem.attr('data-i18n', messageKey);
APP.translation.translateElement($(errorMessageElem), options);
connDialog.goToState('finished');
};
2016-01-15 14:59:35 +00:00
/**
* Show message as connection status.
* @param {string} messageKey the key to the message
2016-01-15 14:59:35 +00:00
*/
this.displayConnectionStatus = function(messageKey) {
const connectingState = connDialog.getState('connecting');
2015-12-29 14:41:24 +00:00
const connectionStatus = connectingState.find('#connectionStatus');
connectionStatus.attr('data-i18n', messageKey);
APP.translation.translateElement($(connectionStatus));
2015-12-29 14:41:24 +00:00
};
/**
* Closes LoginDialog.
*/
this.close = function() {
connDialog.close();
};
}
2016-01-15 14:59:35 +00:00
export default {
2016-01-15 14:59:35 +00:00
/**
* Show new auth dialog for JitsiConnection.
*
* @param {function(jid, password)} successCallback
* @param {function} [cancelCallback] callback to invoke if user canceled.
*
* @returns {LoginDialog}
*/
showAuthDialog(successCallback, cancelCallback) {
2016-01-15 14:59:35 +00:00
return new LoginDialog(successCallback, cancelCallback);
2015-12-15 12:09:44 +00:00
},
2016-01-15 14:59:35 +00:00
/**
* Show notification that external auth is required (using provided url).
* @param {string} url URL to use for external auth.
* @param {function} callback callback to invoke when auth popup is closed.
* @returns auth dialog
*/
showExternalAuthDialog(url, callback) {
const dialog = APP.UI.messageHandler.openCenteredPopup(
2015-12-15 12:09:44 +00:00
url, 910, 660,
2015-12-15 12:09:44 +00:00
// On closed
callback
);
if (!dialog) {
ref(notifications): convert some dialogs to error or warning notifica… (#1991) * ref(notifications): convert some dialogs to error or warning notifications - Expand the configurability of the Notification component so warnings and errors can be displayed. - Allow Notification to take in arbitrary text for the body. - Rename defaultTitleKey to titleKey for consistency with descriptionKey. * ref(notifications): remove openReportDialog method openReportDialog is a wrapper around showError that adds a logger statement. It is being called in one place only so remove the method and have that one place call logger. * ref(notifications): UI.showTrackNotWorkingDialog takes a boolean Change UI.showTrackNotWorkingDialog so it takes a boolean arguments instead of the entire track. A small refactor so the method needs to know less. * [squash] Fixes eslint errors * WiP: Fixes desktop sharing error strings and adds support button * [squash] Fix icons appearances * [squash] Fix translate titles and messages * [squash] fix(translation): Fixes incorrect password string * [squash] fix(recording): Fixes recording message * [squash] fix(warning): Turns some warnings to errors and makes support link optional. * [squash] fix(translation): Addressing language comments * [squash] Fixes jsdoc and formatting * [squash] fix(noopener): Fixes window.open noopener * [squash] fix(constants): Extract constants and refactor NotificationWithToggle * [squash] fix(lang): Fixes camera and mic error titles * [squash] fix(supportLink): Renames addSupportLink to hideErrorSupportLink
2017-11-03 19:05:03 +00:00
APP.UI.messageHandler.showWarning({
descriptionKey: 'dialog.popupError',
titleKey: 'dialog.popupErrorTitle'
});
2015-12-15 12:09:44 +00:00
}
return dialog;
2015-12-15 16:29:37 +00:00
},
2016-01-15 14:59:35 +00:00
/**
2017-09-18 07:09:43 +00:00
* Shows a notification that authentication is required to create the
* conference, so the local participant should authenticate or wait for a
* host.
*
* @param {string} room - The name of the conference.
* @param {function} onAuthNow - The callback to invoke if the local
* participant wants to authenticate.
2016-01-15 14:59:35 +00:00
* @returns dialog
*/
2017-09-18 07:09:43 +00:00
showAuthRequiredDialog(room, onAuthNow) {
const msg = APP.translation.generateTranslationHTML(
'[html]dialog.WaitForHostMsg',
{ room }
2015-12-15 16:29:37 +00:00
);
2017-09-18 07:09:43 +00:00
const buttonTxt = APP.translation.generateTranslationHTML(
'dialog.IamHost'
2015-12-15 16:29:37 +00:00
);
const buttons = [ {
2017-09-18 07:09:43 +00:00
title: buttonTxt,
value: 'authNow'
} ];
2015-12-15 16:29:37 +00:00
return APP.UI.messageHandler.openDialog(
2017-09-18 07:09:43 +00:00
'dialog.WaitingForHost',
2015-12-15 16:29:37 +00:00
msg,
true,
buttons,
2017-09-18 07:09:43 +00:00
(e, submitValue) => {
// Do not close the dialog yet.
2015-12-17 15:31:11 +00:00
e.preventDefault();
2015-12-15 16:29:37 +00:00
2017-09-18 07:09:43 +00:00
// Open login popup.
2015-12-15 16:29:37 +00:00
if (submitValue === 'authNow') {
onAuthNow();
}
}
);
}
};