Merge pull request #1056 from jitsi/translations-update

Translations update
This commit is contained in:
hristoterezov 2016-10-25 18:11:15 -05:00 committed by GitHub
commit 221f6d1d68
24 changed files with 237 additions and 342 deletions

View File

@ -195,11 +195,7 @@ function maybeRedirectToWelcomePage(showThankYou) {
if (showThankYou) {
APP.UI.messageHandler.openMessageDialog(
null, null, null,
APP.translation.translateString(
"dialog.thankYou", {appName:interfaceConfig.APP_NAME}
)
);
null, "dialog.thankYou", {appName:interfaceConfig.APP_NAME});
}
if (!config.enableWelcomePage) {
@ -1045,21 +1041,20 @@ export default {
// TrackErrors.GENERAL
// and any other
let dialogTxt;
let dialogTitle;
let dialogTitleKey;
if (err.name === TrackErrors.PERMISSION_DENIED) {
dialogTxt = APP.translation.generateTranslationHTML(
"dialog.screenSharingPermissionDeniedError");
dialogTitle = APP.translation.generateTranslationHTML(
"dialog.error");
dialogTitleKey = "dialog.error";
} else {
dialogTxt = APP.translation.generateTranslationHTML(
"dialog.failtoinstall");
dialogTitle = APP.translation.generateTranslationHTML(
"dialog.permissionDenied");
dialogTitleKey = "dialog.permissionDenied";
}
APP.UI.messageHandler.openDialog(dialogTitle, dialogTxt, false);
APP.UI.messageHandler.openDialog(
dialogTitleKey, dialogTxt, false);
});
} else {
createLocalTracks({ devices: ['video'] }).then(

View File

@ -105,7 +105,7 @@
<div id="subject" class="hide"></div>
<div id="extendedToolbar" class="toolbar">
<a class="button" id="toolbar_button_profile" data-container="body" data-placement="right" data-i18n="[content]toolbar.profile" content="Edit your profile">
<a class="button" id="toolbar_button_profile" data-container="body" data-placement="right" data-i18n="[content]toolbar.profile">
<img id="avatar" src="images/avatar2.png"/>
</a>
<a class="button icon-contactList" id="toolbar_contact_list" shortcut="contactlistpopover">
@ -138,11 +138,11 @@
<div class="title" data-i18n="profile.title"></div>
<div class="sideToolbarBlock first">
<label class="first" data-i18n="profile.setDisplayNameLabel"></label>
<input type="text" id="setDisplayName" data-i18n="[placeholder]settings.name" placeholder="Name">
<input type="text" id="setDisplayName" data-i18n="[placeholder]settings.name">
</div>
<div class="sideToolbarBlock">
<label data-i18n="profile.setEmailLabel"></label>
<input type="text" id="setEmail" placeholder="Enter e-mail">
<input data-i18n="[placeholder]profile.setEmailInput" type="text" id="setEmail">
</div>
<div class="sideToolbarBlock auth_container" id="authenticationContainer">
<p data-i18n="toolbar.authenticate"></p>
@ -175,7 +175,7 @@
</div>
</div>
<div id="contacts_container" class="sideToolbarContainer__inner">
<div class="title" data-i18n="contactlist"></div>
<div class="title" data-i18n="contactlist" data-i18n-options='{"pcount":"1"}'></div>
<ul id="contacts"></ul>
</div>
<div id="settings_container" class="sideToolbarContainer__inner">

View File

@ -1,5 +1,5 @@
{
"contactlist": "Participants",
"contactlist": "Participants (__pcount__)",
"addParticipants": "Add Participants",
"roomLocked": "Callers must enter a password",
"roomUnlocked": "Anyone with the link can join",
@ -99,6 +99,7 @@
"cameraDisabled": "Camera is not available",
"micDisabled": "Microphone is not available",
"filmstrip": "Show / hide videos",
"profile": "Edit your profile",
"raiseHand": "Raise hand to speak"
},
"bottomtoolbar": {
@ -135,7 +136,8 @@
"profile": {
"title": "Profile",
"setDisplayNameLabel": "Set your display name",
"setEmailLabel": "Set your gravatar email"
"setEmailLabel": "Set your gravatar email",
"setEmailInput": "Enter e-mail"
},
"videothumbnail":
{
@ -342,7 +344,7 @@
"ATTACHED": "Attached",
"FETCH_SESSION_ID": "Obtaining session-id...",
"GOT_SESSION_ID": "Obtaining session-id... Done",
"GET_SESSION_ID_ERROR": "Get session-id error: ",
"GET_SESSION_ID_ERROR": "Get session-id error: __code__",
"USER_CONNECTION_INTERRUPTED": "__displayName__ is having connectivity issues..."
},
"recording":

View File

@ -41,7 +41,6 @@ You can add translatable text in the HTML:
**Note:** If you dynamically add HTML elements don't forget to call APP.translation.translateElement(jquery_selector) to translate the text initially.
* **via Javascript string** - call APP.translation.translateString(key, options). You can use that method to get the translated string in Javascript and then attach it in the HTML.
```
APP.translation.translateString("dialog.OK") // returns the value for the key of the current language file. "OK" for example.
@ -50,7 +49,6 @@ You can add translatable text in the HTML:
For the available values of ``options`` parameter for the above methods of translation module see [i18next documentation](http://i18next.com/pages/doc_features).
**Note:** It is useful to add attributes in the HTML for persistent HTML elements because when the language is changed the text will be automatically translated.
Otherwise you should call ``APP.translation.translateString`` and manually change the text every time the language is changed.

View File

@ -75,17 +75,13 @@ JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP.microphone[TrackErrors.NO_DATA_FROM_SOURCE]
*/
function promptDisplayName() {
let labelKey = 'dialog.enterDisplayName';
let labelStr = APP.translation.translateString(labelKey);
let titleStr
= APP.translation.translateString('dialog.displayNameRequired');
let defaultNickMsg = APP.translation.translateString("defaultNickname");
let message = (
`<div class="input-control">
<label class="input-control__label">${labelStr}</label>
<label data-i18n="${labelKey}" class="input-control__label"></label>
<input name="displayName" type="text"
data-i18n="[placeholder]defaultNickname"
class="input-control__input"
placeholder="${defaultNickMsg}" autofocus>
autofocus>
</div>`
);
@ -94,7 +90,7 @@ function promptDisplayName() {
let buttons = {Ok:true};
let dialog = messageHandler.openDialog(
titleStr,
'dialog.displayNameRequired',
message,
true,
buttons,
@ -167,11 +163,10 @@ UI.notifyGracefulShutdown = function () {
* Notify user that reservation error happened.
*/
UI.notifyReservationError = function (code, msg) {
var title = APP.translation.generateTranslationHTML(
"dialog.reservationError");
var message = APP.translation.generateTranslationHTML(
"dialog.reservationErrorMsg", {code: code, msg: msg});
messageHandler.openDialog(title, message, true, {}, () => false);
messageHandler.openDialog(
"dialog.reservationError", message, true, {}, () => false);
};
/**
@ -190,9 +185,8 @@ UI.notifyKicked = function () {
UI.notifyConferenceDestroyed = function (reason) {
//FIXME: use Session Terminated from translation, but
// 'reason' text comes from XMPP packet and is not translated
const title
= APP.translation.generateTranslationHTML("dialog.sessTerminated");
messageHandler.openDialog(title, reason, true, {}, () => false);
messageHandler.openDialog(
"dialog.sessTerminated", reason, true, {}, () => false);
};
/**
@ -750,8 +744,6 @@ UI.connectionIndicatorShowMore = function(id) {
// FIXME check if someone user this
UI.showLoginPopup = function(callback) {
console.log('password is required');
let titleKey = "dialog.passwordRequired";
let titleString = APP.translation.translateString(titleKey);
let message = (
`<input name="username" type="text"
@ -770,8 +762,7 @@ UI.showLoginPopup = function(callback) {
};
messageHandler.openTwoButtonDialog({
titleKey,
titleString,
titleKey : "dialog.passwordRequired",
msgString: message,
leftButtonKey: 'dialog.Ok',
submitFunction,
@ -904,9 +895,6 @@ UI.setUserAvatarUrl = function (id, url) {
* @param {string} stropheErrorMsg raw Strophe error message
*/
UI.notifyConnectionFailed = function (stropheErrorMsg) {
var title = APP.translation.generateTranslationHTML(
"dialog.error");
var message;
if (stropheErrorMsg) {
message = APP.translation.generateTranslationHTML(
@ -916,7 +904,7 @@ UI.notifyConnectionFailed = function (stropheErrorMsg) {
"dialog.connectError");
}
messageHandler.openDialog(title, message, true, {}, () => false);
messageHandler.openDialog("dialog.error", message, true, {}, () => false);
};
@ -924,13 +912,10 @@ UI.notifyConnectionFailed = function (stropheErrorMsg) {
* Notify user that maximum users limit has been reached.
*/
UI.notifyMaxUsersLimitReached = function () {
var title = APP.translation.generateTranslationHTML(
"dialog.error");
var message = APP.translation.generateTranslationHTML(
"dialog.maxUsersLimitReached");
messageHandler.openDialog(title, message, true, {}, () => false);
messageHandler.openDialog("dialog.error", message, true, {}, () => false);
};
/**
@ -1191,10 +1176,8 @@ UI.getLargeVideo = function () {
UI.showExtensionRequiredDialog = function (url) {
messageHandler.openMessageDialog(
"dialog.extensionRequired",
null,
null,
APP.translation.generateTranslationHTML(
"dialog.firefoxExtensionPrompt", {url: url}));
"dialog.firefoxExtensionPrompt",
{url: url});
};
/**
@ -1216,9 +1199,7 @@ UI.showExtensionExternalInstallationDialog = function (url) {
messageHandler.openTwoButtonDialog({
titleKey: 'dialog.externalInstallationTitle',
titleString: '',
msgKey: 'dialog.externalInstallationMsg',
msgString: '',
leftButtonKey: 'dialog.goToStore',
submitFunction,
loadedFunction: $.noop,
@ -1263,8 +1244,6 @@ UI.showDeviceErrorDialog = function (micError, cameraError) {
}
}
let title = getTitleKey();
let titleMsg = `<span data-i18n="${title}"></span>`;
let cameraJitsiTrackErrorMsg = cameraError
? JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP.camera[cameraError.name]
: undefined;
@ -1318,7 +1297,7 @@ UI.showDeviceErrorDialog = function (micError, cameraError) {
deviceErrorDialog && deviceErrorDialog.close();
deviceErrorDialog = messageHandler.openDialog(
titleMsg,
getTitleKey(),
message,
false,
{Ok: true},
@ -1342,8 +1321,6 @@ UI.showDeviceErrorDialog = function (micError, cameraError) {
}
);
APP.translation.translateElement($(".jqibox"));
function getTitleKey() {
let title = "dialog.error";
@ -1369,9 +1346,7 @@ UI.showTrackNotWorkingDialog = function (stream) {
messageHandler.openMessageDialog(
"dialog.error",
stream.isAudioTrack()? "dialog.micNotSendingData" :
"dialog.cameraNotSendingData",
null,
null);
"dialog.cameraNotSendingData");
};
UI.updateDevicesAvailability = function (id, devices) {
@ -1483,12 +1458,11 @@ UI.hideUserMediaPermissionsGuidanceOverlay = function () {
*/
UI.toggleKeyboardShortcutsPanel = function() {
if (!messageHandler.isDialogOpened()) {
let titleKey = 'keyboardShortcuts.keyboardShortcuts';
let title = APP.translation.translateString(titleKey);
let msg = $('#keyboard-shortcuts').html();
let buttons = { Close: true };
messageHandler.openDialog(title, msg, true, buttons);
messageHandler.openDialog(
'keyboardShortcuts.keyboardShortcuts', msg, true, buttons);
} else {
messageHandler.closeDialog();
}

View File

@ -146,16 +146,13 @@ function doXmppAuth (room, lockPassword) {
room.getName(), APP.conference._getConferenceOptions()
);
loginDialog.displayConnectionStatus(
APP.translation.translateString('connection.FETCH_SESSION_ID')
);
loginDialog.displayConnectionStatus('connection.FETCH_SESSION_ID');
newRoom.room.moderator.authenticate().then(function () {
connection.disconnect();
loginDialog.displayConnectionStatus(
APP.translation.translateString('connection.GOT_SESSION_ID')
);
'connection.GOT_SESSION_ID');
// authenticate conference on the fly
room.join(lockPassword);
@ -166,11 +163,8 @@ function doXmppAuth (room, lockPassword) {
console.error('Auth on the fly failed', error);
let errorMsg = APP.translation.translateString(
'connection.GET_SESSION_ID_ERROR'
);
loginDialog.displayError(errorMsg + code);
loginDialog.displayError(
'connection.GET_SESSION_ID_ERROR', {code: code});
});
}, function (err) {
loginDialog.displayError(err);

View File

@ -1,4 +1,4 @@
/* global APP, config */
/* global $, APP, config */
/**
* Build html for "password required" dialog.
@ -15,8 +15,7 @@ function getPasswordInputHtml() {
placeholder=${placeholder} autofocus>
<input name="password" type="password"
class="input-control__input"
data-i18n="[placeholder]dialog.userPassword"
placeholder="user password">`;
data-i18n="[placeholder]dialog.userPassword">`;
}
/**
@ -67,7 +66,7 @@ function LoginDialog(successCallback, cancelCallback) {
value: true
}];
let finishedButtons = [{
title: APP.translation.translateString('dialog.retry'),
title: APP.translation.generateTranslationHTML('dialog.retry'),
value: 'retry'
}];
@ -79,7 +78,7 @@ function LoginDialog(successCallback, cancelCallback) {
const states = {
login: {
title: APP.translation.translateString('dialog.passwordRequired'),
titleKey: 'dialog.passwordRequired',
html: getPasswordInputHtml(),
buttons: loginButtons,
focus: ':input:first',
@ -99,13 +98,13 @@ function LoginDialog(successCallback, cancelCallback) {
}
},
connecting: {
title: APP.translation.translateString('dialog.connecting'),
titleKey: 'dialog.connecting',
html: '<div id="connectionStatus"></div>',
buttons: [],
defaultButton: 0
},
finished: {
title: APP.translation.translateString('dialog.error'),
titleKey: 'dialog.error',
html: '<div id="errorMessage"></div>',
buttons: finishedButtons,
defaultButton: 0,
@ -128,27 +127,31 @@ function LoginDialog(successCallback, cancelCallback) {
/**
* Displays error message in 'finished' state which allows either to cancel
* or retry.
* @param message the final message to be displayed.
* @param messageKey the key to the message to be displayed.
* @param options the options to the error message (optional)
*/
this.displayError = function (message) {
this.displayError = function (messageKey, options) {
let finishedState = connDialog.getState('finished');
let errorMessageElem = finishedState.find('#errorMessage');
errorMessageElem.text(message);
errorMessageElem.attr("data-i18n", messageKey);
APP.translation.translateElement($(errorMessageElem), options);
connDialog.goToState('finished');
};
/**
* Show message as connection status.
* @param {string} message
* @param {string} messageKey the key to the message
*/
this.displayConnectionStatus = function (message) {
this.displayConnectionStatus = function (messageKey) {
let connectingState = connDialog.getState('connecting');
let connectionStatus = connectingState.find('#connectionStatus');
connectionStatus.text(message);
connectionStatus.attr("data-i18n", messageKey);
APP.translation.translateElement($(connectionStatus));
};
/**
@ -202,9 +205,6 @@ export default {
* @returns dialog
*/
showAuthRequiredDialog: function (roomName, onAuthNow) {
var title = APP.translation.generateTranslationHTML(
"dialog.WaitingForHost"
);
var msg = APP.translation.generateTranslationHTML(
"dialog.WaitForHostMsg", {room: roomName}
);
@ -215,7 +215,7 @@ export default {
var buttons = [{title: buttonTxt, value: "authNow"}];
return APP.UI.messageHandler.openDialog(
title,
"dialog.WaitingForHost",
msg,
true,
buttons,

View File

@ -35,7 +35,6 @@ function toggleStars(starCount) {
* @returns {string} the contructed html string
*/
function createRateFeedbackHTML() {
let feedbackHelp = APP.translation.translateString('dialog.feedbackHelp');
let starClassName = (interfaceConfig.ENABLE_FEEDBACK_ANIMATION)
? "icon-star-full shake-rotate"
@ -68,7 +67,7 @@ function createRateFeedbackHTML() {
</div>
<div class="details">
<textarea id="feedbackTextArea" class="input-control__input"
placeholder="${ feedbackHelp }"></textarea>
data-i18n="[placeholder]dialog.feedbackHelp"></textarea>
</div>
</form>`;
}
@ -147,10 +146,10 @@ export default class Dialog {
this.submitted = false;
this.onCloseCallback = function() {};
this.setDefoulOptions();
this.setDefaultOptions();
}
setDefoulOptions() {
setDefaultOptions() {
var self = this;
this.options = {

View File

@ -8,12 +8,10 @@ import UIUtil from '../util/UIUtil';
*/
export default function askForPassword () {
let titleKey = "dialog.passwordRequired";
let passMsg = APP.translation.translateString("dialog.password");
let msgString = `
<input name="lockKey" type="text"
data-i18n="[placeholder]dialog.password"
placeholder="${passMsg}" autofocus>
`;
autofocus>`;
return new Promise(function (resolve, reject) {
APP.UI.messageHandler.openTwoButtonDialog({
titleKey,

View File

@ -191,8 +191,10 @@ class Invite {
* @param isLocked
*/
setLockedFromElsewhere(isLocked) {
let oldLockState = this.roomLocker.lockedElsewhere;
if (oldLockState !== isLocked) {
// isLocked can be 1, true or false
let newLockState = (isLocked === 1) || isLocked;
let oldLockState = this.roomLocker.isLocked;
if (oldLockState !== newLockState) {
this.roomLocker.lockedElsewhere = isLocked;
APP.UI.emitEvent(UIEvents.TOGGLE_ROOM_LOCK);
this.updateView();

View File

@ -15,20 +15,15 @@ const States = {
*/
export default class InviteDialogView {
constructor(model) {
let InviteAttributesKey = 'inviteUrlDefaultMsg';
let title = APP.translation.translateString(InviteAttributesKey);
this.unlockHint = "unlockHint";
this.lockHint = "lockHint";
this.model = model;
if (this.model.inviteUrl === null) {
this.inviteAttributes = (
`data-i18n="[value]inviteUrlDefaultMsg" value="${title}"`
);
this.inviteAttributes = `data-i18n="[value]inviteUrlDefaultMsg"`;
} else {
let encodedInviteUrl = this.model.getEncodedInviteUrl();
this.inviteAttributes = `value="${encodedInviteUrl}"`;
this.inviteAttributes
= `value="${this.model.getEncodedInviteUrl()}"`;
}
this.initDialog();
@ -43,11 +38,7 @@ export default class InviteDialogView {
dialog.submitFunction = this.submitFunction.bind(this);
dialog.loadedFunction = this.loadedFunction.bind(this);
let titleKey = "dialog.shareLink";
let titleString = APP.translation.generateTranslationHTML(titleKey);
dialog.titleKey = titleKey;
dialog.titleString = titleString;
dialog.titleKey = "dialog.shareLink";
this.dialog = dialog;
this.dialog.states = this.getStates();
@ -101,21 +92,20 @@ export default class InviteDialogView {
*/
getStates() {
let {
titleString
titleKey
} = this.dialog;
let doneKey = 'dialog.done';
let doneMsg = APP.translation.translateString(doneKey);
let doneMsg = APP.translation.generateTranslationHTML('dialog.done');
let states = {};
let buttons = {};
buttons[`${doneMsg}`] = true;
states[States.UNLOCKED] = {
title: titleString,
titleKey,
html: this.getShareLinkBlock() + this.getAddPasswordBlock(),
buttons
};
states[States.LOCKED] = {
title: titleString,
titleKey,
html: this.getShareLinkBlock() + this.getPasswordBlock(),
buttons
};
@ -128,34 +118,24 @@ export default class InviteDialogView {
* @returns {string}
*/
getShareLinkBlock() {
let copyKey = 'dialog.copy';
let copyText = APP.translation.translateString(copyKey);
let roomLockDescKey = 'dialog.roomLocked';
let roomLockDesc = APP.translation.translateString(roomLockDescKey);
let roomUnlockKey = 'roomUnlocked';
let roomUnlock = APP.translation.translateString(roomUnlockKey);
let classes = 'button-control button-control_light copyInviteLink';
return (
`<div class="input-control">
<label class="input-control__label" for="inviteLinkRef">
${this.dialog.titleString}
</label>
<label class="input-control__label" for="inviteLinkRef"
data-i18n="${this.dialog.titleKey}"></label>
<div class="input-control__container">
<input class="input-control__input inviteLink"
id="inviteLinkRef" type="text"
${this.inviteAttributes} readonly>
<button data-i18n="${copyKey}"
class="${classes}">
${copyText}
</button>
<button data-i18n="dialog.copy" class="${classes}"></button>
</div>
<p class="input-control__hint ${this.lockHint}">
<span class="icon-security-locked"></span>
<span data-i18n="${roomLockDescKey}">${roomLockDesc}</span>
<span data-i18n="dialog.roomLocked"></span>
</p>
<p class="input-control__hint ${this.unlockHint}">
<span class="icon-security"></span>
<span data-i18n="${roomUnlockKey}">${roomUnlock}</span>
<span data-i18n="roomUnlocked"></span>
</p>
</div>`
);
@ -166,27 +146,21 @@ export default class InviteDialogView {
* @returns {string}
*/
getAddPasswordBlock() {
let addPassKey = 'dialog.addPassword';
let addPassText = APP.translation.translateString(addPassKey);
let addKey = 'dialog.add';
let addText = APP.translation.translateString(addKey);
let hintKey = 'dialog.createPassword';
let hintMsg = APP.translation.translateString(hintKey);
let html;
if (this.model.isModerator) {
html = (`
<div class="input-control">
<label class="input-control__label
for="newPasswordInput"
data-i18n="${addPassKey}">${addPassText}</label>
<label class="input-control__label"
for="newPasswordInput" data-i18n="dialog.addPassword">
</label>
<div class="input-control__container">
<input class="input-control__input" id="newPasswordInput"
type="text" placeholder="${hintMsg}">
type="text"
data-i18n="[placeholder]dialog.createPassword">
<button id="addPasswordBtn" id="inviteDialogAddPassword"
disabled data-i18n="${addKey}"
disabled data-i18n="dialog.add"
class="button-control button-control_light">
${addText}
</button>
</div>
</div>
@ -204,22 +178,16 @@ export default class InviteDialogView {
*/
getPasswordBlock() {
let { password, isModerator } = this.model;
let removePassKey = 'dialog.removePassword';
let removePassText = APP.translation.translateString(removePassKey);
let currentPassKey = 'dialog.currentPassword';
let currentPassText = APP.translation.translateString(currentPassKey);
let passwordKey = "dialog.passwordLabel";
let passwordText = APP.translation.translateString(passwordKey);
if (isModerator) {
return (`
<div class="input-control">
<label class="input-control__label"
data-i18n="${passwordKey}">${passwordText}</label>
data-i18n="dialog.passwordLabel"></label>
<div class="input-control__container">
<p class="input-control__text"
data-i18n="${currentPassKey}">
${currentPassText}
<p>
<span class="input-control__text"
data-i18n="dialog.currentPassword"></span>
<span id="inviteDialogPassword"
class="input-control__em">
${password}
@ -227,9 +195,7 @@ export default class InviteDialogView {
</p>
<a class="link input-control__right"
id="inviteDialogRemovePassword"
data-i18n="${removePassKey}">
${removePassText}
</a>
data-i18n="dialog.removePassword"></a>
</div>
</div>
`);
@ -355,10 +321,17 @@ export default class InviteDialogView {
*/
updateView() {
let pass = this.model.getPassword();
if (!pass)
pass = APP.translation.translateString("passwordSetRemotely");
if (this.model.getRoomLocker().lockedElsewhere || !pass)
$('#inviteDialogPassword').attr("data-i18n", "passwordSetRemotely");
else
$('#inviteDialogPassword').text(pass);
// if we are not moderator we cannot remove password
if (APP.conference.isModerator)
$('#inviteDialogRemovePassword').show();
else
$('#inviteDialogRemovePassword').hide();
$('#newPasswordInput').val('');
this.disableAddPassIfInputEmpty();

View File

@ -41,8 +41,6 @@ function _isRecordingButtonEnabled() {
* @returns {Promise}
*/
function _requestLiveStreamId() {
const msg = APP.translation.generateTranslationHTML("dialog.liveStreaming");
const token = APP.translation.translateString("dialog.streamKey");
const cancelButton
= APP.translation.generateTranslationHTML("dialog.Cancel");
const backButton = APP.translation.generateTranslationHTML("dialog.Back");
@ -55,11 +53,11 @@ function _requestLiveStreamId() {
return new Promise(function (resolve, reject) {
dialog = APP.UI.messageHandler.openDialogWithStates({
state0: {
title: msg,
titleKey: "dialog.liveStreaming",
html:
`<input name="streamId" type="text"
data-i18n="[placeholder]dialog.streamKey"
placeholder="${token}" autofocus>`,
autofocus>`,
persistent: false,
buttons: [
{title: cancelButton, value: false},
@ -89,7 +87,7 @@ function _requestLiveStreamId() {
},
state1: {
title: msg,
titleKey: "dialog.liveStreaming",
html: streamIdRequired,
persistent: false,
buttons: [
@ -122,11 +120,10 @@ function _requestLiveStreamId() {
*/
function _requestRecordingToken () {
let titleKey = "dialog.recordingToken";
let token = APP.translation.translateString("dialog.token");
let messageString = (
`<input name="recordingToken" type="text"
data-i18n="[placeholder]dialog.token"
placeholder="${token}" autofocus>`
autofocus>`
);
return new Promise(function (resolve, reject) {
dialog = APP.UI.messageHandler.openTwoButtonDialog({
@ -297,8 +294,7 @@ var Recording = {
selector.addClass(this.baseClass);
selector.attr("data-i18n", "[content]" + this.recordingButtonTooltip);
selector.attr("content",
APP.translation.translateString(this.recordingButtonTooltip));
APP.translation.translateElement(selector);
var self = this;
selector.click(function () {
@ -365,7 +361,7 @@ var Recording = {
dialog = APP.UI.messageHandler.openMessageDialog(
self.recordingTitle,
self.recordingBusy,
null, null,
null,
function () {
dialog = null;
}
@ -376,7 +372,7 @@ var Recording = {
dialog = APP.UI.messageHandler.openMessageDialog(
self.recordingTitle,
self.recordingUnavailable,
null, null,
null,
function () {
dialog = null;
}
@ -505,7 +501,7 @@ var Recording = {
moveToCorner(labelSelector, !isCentered);
labelTextSelector.attr("data-i18n", textKey);
labelTextSelector.text(APP.translation.translateString(textKey));
APP.translation.translateElement(labelSelector);
},
/**

View File

@ -40,7 +40,9 @@ class PageReloadOverlayImpl extends Overlay{
<div id='reloadProgressBar' class="aui-progress-indicator">
<span class="aui-progress-indicator-value"></span>
</div>
<span id='reloadSecRemaining' class='reload_overlay_msg'>
<span id='reloadSecRemaining'
data-i18n="dialog.conferenceReloadTimeLeft"
class='reload_overlay_msg'>
</span>
</div>`;
}
@ -50,11 +52,8 @@ class PageReloadOverlayImpl extends Overlay{
*/
updateDisplay() {
const timeLeftTxt
= APP.translation.translateString(
"dialog.conferenceReloadTimeLeft",
{ seconds: this.timeLeft });
$("#reloadSecRemaining").text(timeLeftTxt);
APP.translation.translateElement(
$("#reloadSecRemaining"), { seconds: this.timeLeft });
const ratio = (this.timeout - this.timeLeft) / this.timeout;
AJS.progressBars.update("#reloadProgressBar", ratio);

View File

@ -93,7 +93,7 @@ export default class SharedVideoManager {
dialog = APP.UI.messageHandler.openMessageDialog(
"dialog.shareVideoTitle",
"dialog.alreadySharedVideoMsg",
null, null,
null,
function () {
dialog = null;
}
@ -750,24 +750,19 @@ function showStopVideoPropmpt() {
*/
function requestVideoLink() {
let i18n = APP.translation;
const title = i18n.generateTranslationHTML("dialog.shareVideoTitle");
const cancelButton = i18n.generateTranslationHTML("dialog.Cancel");
const shareButton = i18n.generateTranslationHTML("dialog.Share");
const backButton = i18n.generateTranslationHTML("dialog.Back");
const linkError
= i18n.generateTranslationHTML("dialog.shareVideoLinkError");
const i18nOptions = {url: defaultSharedVideoLink};
const defaultUrl = i18n.translateString("defaultLink", i18nOptions);
return new Promise(function (resolve, reject) {
dialog = APP.UI.messageHandler.openDialogWithStates({
state0: {
title: title,
titleKey: "dialog.shareVideoTitle",
html: `
<input name="sharedVideoUrl" type="text"
data-i18n="[placeholder]defaultLink"
data-i18n-options="${JSON.stringify(i18nOptions)}"
placeholder="${defaultUrl}"
autofocus>`,
persistent: false,
buttons: [
@ -802,7 +797,7 @@ function requestVideoLink() {
},
state1: {
title: title,
titleKey: "dialog.shareVideoTitle",
html: linkError,
persistent: false,
buttons: [
@ -825,7 +820,8 @@ function requestVideoLink() {
close: function () {
dialog = null;
}
}, {
url: defaultSharedVideoLink
});
});
}

View File

@ -21,9 +21,8 @@ function updateNumberOfParticipants(delta) {
$("#numberOfParticipants").text(numberOfContacts);
$("#contacts_container>div.title").text(
APP.translation.translateString("contactlist")
+ ' (' + numberOfContacts + ')');
APP.translation.translateElement(
$("#contacts_container>div.title"), {pcount: numberOfContacts});
}
/**
@ -50,7 +49,6 @@ function createDisplayNameParagraph(key, displayName) {
p.innerHTML = displayName;
} else if(key) {
p.setAttribute("data-i18n",key);
p.innerHTML = APP.translation.translateString(key);
}
return p;
@ -82,10 +80,11 @@ var ContactListView = {
*/
addInviteButton() {
let container = document.getElementById('contacts_container');
let title = container.firstElementChild;
let htmlLayout = this.getInviteButtonLayout();
title.insertAdjacentHTML('afterend', htmlLayout);
container.firstElementChild // this is the title
.insertAdjacentHTML('afterend', this.getInviteButtonLayout());
APP.translation.translateElement($(container));
$(document).on('click', '#addParticipantsBtn', () => {
APP.UI.emitEvent(UIEvents.INVITE_CLICKED);
});
@ -97,32 +96,26 @@ var ContactListView = {
let classes = 'button-control button-control_primary';
classes += ' button-control_full-width';
let key = 'addParticipants';
let text = APP.translation.translateString(key);
let lockedHtml = this.getLockDescriptionLayout(this.lockKey);
let unlockedHtml = this.getLockDescriptionLayout(this.unlockKey);
let html = (
return (
`<div class="sideToolbarBlock first">
<button id="addParticipantsBtn"
data-i18n="${key}"
class="${classes}">
${text}
</button>
class="${classes}"></button>
<div>
${lockedHtml}
${unlockedHtml}
</div>
</div>`);
return html;
},
/**
* Adds layout for lock description
*/
getLockDescriptionLayout(key) {
let classes = "input-control__hint input-control_full-width";
let description = APP.translation.translateString(key);
let padlockSuffix = '';
if (key === this.lockKey) {
padlockSuffix = '-locked';
@ -130,7 +123,7 @@ var ContactListView = {
return `<p id="contactList${key}" class="${classes}">
<span class="icon-security${padlockSuffix}"></span>
<span data-i18n="${key}">${description}</span>
<span data-i18n="${key}"></span>
</p>`;
},
/**
@ -198,6 +191,7 @@ var ContactListView = {
createDisplayNameParagraph(
isLocal ? interfaceConfig.DEFAULT_LOCAL_DISPLAY_NAME : null,
isLocal ? null : interfaceConfig.DEFAULT_REMOTE_DISPLAY_NAME));
APP.translation.translateElement($(newContact));
if (APP.conference.isLocalId(id)) {
contactlist.prepend(newContact);

View File

@ -279,7 +279,6 @@ function showSipNumberInput () {
? config.defaultSipNumber
: '';
let titleKey = "dialog.sipMsg";
let sipMsg = APP.translation.generateTranslationHTML("dialog.sipMsg");
let msgString = (`
<input name="sipNumber" type="text"
value="${defaultNumber}" autofocus>
@ -287,7 +286,6 @@ function showSipNumberInput () {
APP.UI.messageHandler.openTwoButtonDialog({
titleKey,
titleString: sipMsg,
msgString,
leftButtonKey: "dialog.Dial",
submitFunction: function (e, v, m, f) {

View File

@ -1,22 +1,26 @@
/* global $ */
var JitsiPopover = (function () {
/**
* The default options
*/
const defaultOptions = {
skin: 'white',
content: '',
hasArrow: true,
onBeforePosition: undefined
};
/**
* Constructs new JitsiPopover and attaches it to the element
* @param element jquery selector
* @param options the options for the popover.
* - {Function} onBeforePosition - function executed just before
* positioning the popover. Useful for translation.
* @constructor
*/
function JitsiPopover(element, options)
{
let { skin, content, hasArrow } = options;
this.options = {};
this.options.skin = skin || 'white';
this.options.content = content || '';
this.options.hasArrow = true;
if (typeof(hasArrow) !== 'undefined') {
this.options.hasArrow = false;
}
this.options = Object.assign({}, defaultOptions, options);
this.elementIsHovered = false;
this.popoverIsHovered = false;
@ -86,7 +90,11 @@ var JitsiPopover = (function () {
*/
JitsiPopover.prototype.createPopover = function () {
$("body").append(this.template);
$(".jitsipopover > .jitsipopover__content").html(this.options.content);
let popoverElem = $(".jitsipopover > .jitsipopover__content");
popoverElem.html(this.options.content);
if(typeof this.options.onBeforePosition === "function") {
this.options.onBeforePosition($(".jitsipopover"));
}
var self = this;
$(".jitsipopover").on("mouseenter", function () {
self.popoverIsHovered = true;

View File

@ -29,30 +29,20 @@ var messageHandler = {
*
* @param titleKey the key used to find the translation of the title of the
* message, if a message title is not provided.
* @param messageKey the key used to find the translation of the message,
* if a message is not provided.
* @param title the title of the message. If a falsy value is provided,
* titleKey will be used to get a title via the translation API.
* @param message the message to show. If a falsy value is provided,
* messageKey will be used to get a message via the translation API.
* @param messageKey the key used to find the translation of the message
* @param i18nOptions the i18n options (optional)
* @param closeFunction function to be called after
* the prompt is closed (optional)
* @return the prompt that was created, or null
*/
openMessageDialog: function(titleKey, messageKey, title, message,
closeFunction) {
openMessageDialog:
function(titleKey, messageKey, i18nOptions, closeFunction) {
if (!popupEnabled)
return null;
if (!title) {
title = APP.translation.generateTranslationHTML(titleKey);
}
if (!message) {
message = APP.translation.generateTranslationHTML(messageKey);
}
return $.prompt(message, {
title: this._getFormattedTitleString(title),
let dialog = $.prompt(
APP.translation.generateTranslationHTML(messageKey, i18nOptions), {
title: this._getFormattedTitleString(titleKey),
persistent: false,
promptspeed: 0,
classes: this._getDialogClasses(),
@ -61,12 +51,14 @@ var messageHandler = {
closeFunction(e, v, m, f);
}
});
APP.translation.translateElement(dialog, i18nOptions);
return dialog;
},
/**
* Shows a message to the user with two buttons: first is given as a
* parameter and the second is Cancel.
*
* @param titleString the title of the message
* @param titleKey the key for the title of the message
* @param msgString the text of the message
* @param persistent boolean value which determines whether the message is
* persistent or not
@ -84,7 +76,6 @@ var messageHandler = {
openTwoButtonDialog: function(options) {
let {
titleKey,
titleString,
msgKey,
msgString,
leftButtonKey,
@ -112,10 +103,7 @@ var messageHandler = {
= APP.translation.generateTranslationHTML("dialog.Cancel");
buttons.push({title: cancelButton, value: false});
var message = msgString, title = titleString;
if (titleKey) {
title = APP.translation.generateTranslationHTML(titleKey);
}
var message = msgString;
if (msgKey) {
message = APP.translation.generateTranslationHTML(msgKey);
}
@ -125,7 +113,7 @@ var messageHandler = {
}
twoButtonDialog = $.prompt(message, {
title: this._getFormattedTitleString(title),
title: this._getFormattedTitleString(titleKey),
persistent: false,
buttons: buttons,
defaultButton: defaultButton,
@ -147,6 +135,7 @@ var messageHandler = {
}
}
});
APP.translation.translateElement(twoButtonDialog);
return twoButtonDialog;
},
@ -154,7 +143,7 @@ var messageHandler = {
* Shows a message to the user with two buttons: first is given as a
* parameter and the second is Cancel.
*
* @param titleString the title of the message
* @param titleKey the key for the title of the message
* @param msgString the text of the message
* @param persistent boolean value which determines whether the message is
* persistent or not
@ -166,13 +155,13 @@ var messageHandler = {
* loaded
* @param closeFunction function to be called on dialog close
*/
openDialog: function (titleString, msgString, persistent, buttons,
openDialog: function (titleKey, msgString, persistent, buttons,
submitFunction, loadedFunction, closeFunction) {
if (!popupEnabled)
return;
let args = {
title: this._getFormattedTitleString(titleString),
title: this._getFormattedTitleString(titleKey),
persistent: persistent,
buttons: buttons,
defaultButton: 1,
@ -187,7 +176,9 @@ var messageHandler = {
args.closeText = '';
}
return new Impromptu(msgString, args);
let dialog = new Impromptu(msgString, args);
APP.translation.translateElement(dialog.getPrompt());
return dialog;
},
/**
@ -195,13 +186,11 @@ var messageHandler = {
*
* @return the title string formatted as a div.
*/
_getFormattedTitleString(titleString) {
_getFormattedTitleString(titleKey) {
let $titleString = $('<h2>');
$titleString.addClass('aui-dialog2-header-main');
$titleString.append(titleString);
titleString = $('<div>').append($titleString).html();
return titleString;
$titleString.attr('data-i18n',titleKey);
return $('<div>').append($titleString).html();
},
/**
@ -235,8 +224,10 @@ var messageHandler = {
* Shows a dialog with different states to the user.
*
* @param statesObject object containing all the states of the dialog.
* @param options impromptu options
* @param translateOptions options passed to translation
*/
openDialogWithStates: function (statesObject, options) {
openDialogWithStates: function (statesObject, options, translateOptions) {
if (!popupEnabled)
return;
let { classes, size } = options;
@ -246,12 +237,14 @@ var messageHandler = {
for (let state in statesObject) {
let currentState = statesObject[state];
if(currentState.title) {
let title = currentState.title;
currentState.title = this._getFormattedTitleString(title);
if(currentState.titleKey) {
currentState.title
= this._getFormattedTitleString(currentState.titleKey);
}
}
return new Impromptu(statesObject, options);
let dialog = new Impromptu(statesObject, options);
APP.translation.translateElement(dialog.getPrompt(), translateOptions);
return dialog;
},
/**
@ -340,20 +333,18 @@ var messageHandler = {
if (displayName) {
displayNameSpan += ">" + UIUtil.escapeHtml(displayName);
} else {
displayNameSpan += "data-i18n='" + displayNameKey +
"'>" + APP.translation.translateString(displayNameKey);
displayNameSpan += "data-i18n='" + displayNameKey + "'>";
}
displayNameSpan += "</span>";
return toastr.info(
let element = toastr.info(
displayNameSpan + '<br>' +
'<span class=' + cls + ' data-i18n="' + messageKey + '"' +
(messageArguments?
" data-i18n-options='" + JSON.stringify(messageArguments)
+ "'"
: "") + ">" +
APP.translation.translateString(messageKey,
messageArguments) +
'</span>', null, options);
" data-i18n-options='"
+ JSON.stringify(messageArguments) + "'"
: "") + "></span>", null, options);
APP.translation.translateElement(element);
return element;
},
/**

View File

@ -1,4 +1,4 @@
/* global APP, $, config */
/* global $, APP, config */
/* jshint -W101 */
import JitsiPopover from "../util/JitsiPopover";
import VideoLayout from "./VideoLayout";
@ -63,8 +63,6 @@ ConnectionIndicator.getStringFromArray = function (array) {
ConnectionIndicator.prototype.generateText = function () {
var downloadBitrate, uploadBitrate, packetLoss, i;
var translate = APP.translation.translateString;
if(this.bitrate === null) {
downloadBitrate = "N/A";
uploadBitrate = "N/A";
@ -99,9 +97,7 @@ ConnectionIndicator.prototype.generateText = function () {
`<table class="connection-info__container" style='width:100%'>
<tr>
<td>
<span data-i18n='connectionindicator.bitrate'>
${translate("connectionindicator.bitrate")}
</span>
<span data-i18n='connectionindicator.bitrate'></span>
</td>
<td>
<span class='connection-info__download'>&darr;</span>${downloadBitrate}
@ -110,17 +106,13 @@ ConnectionIndicator.prototype.generateText = function () {
</tr>
<tr>
<td>
<span data-i18n='connectionindicator.packetloss'>
${translate("connectionindicator.packetloss")}
</span>
<span data-i18n='connectionindicator.packetloss'></span>
</td>
<td>${packetLoss}</td>
</tr>
<tr>
<td>
<span data-i18n='connectionindicator.resolution'>
${translate("connectionindicator.resolution")}
</span>
<span data-i18n='connectionindicator.resolution'></span>
</td>
<td>
${resolutionStr}
@ -134,9 +126,7 @@ ConnectionIndicator.prototype.generateText = function () {
// FIXME: we do not know local id when this text is generated
//this.id + "')\" data-i18n='connectionindicator." +
"local')\" data-i18n='connectionindicator." +
(this.showMoreValue ? "less" : "more") + "'>" +
translate("connectionindicator." + (this.showMoreValue ? "less" : "more")) +
"</a>";
(this.showMoreValue ? "less" : "more") + "'></a>";
}
if (this.showMoreValue) {
@ -156,8 +146,7 @@ ConnectionIndicator.prototype.generateText = function () {
if (!this.transport || this.transport.length === 0) {
transport = "<tr>" +
"<td><span " +
"data-i18n='connectionindicator.address'>" +
translate("connectionindicator.address") + "</span></td>" +
"data-i18n='connectionindicator.address'></span></td>" +
"<td> N/A</td></tr>";
} else {
var data = {remoteIP: [], localIP:[], remotePort:[], localPort:[]};
@ -190,18 +179,15 @@ ConnectionIndicator.prototype.generateText = function () {
var localTransport =
"<tr><td><span data-i18n='" +
local_address_key +"' data-i18n-options='" +
JSON.stringify({count: data.localIP.length}) + "'>" +
translate(local_address_key, {count: data.localIP.length}) +
"</span></td><td> " +
JSON.stringify({count: data.localIP.length})
+ "'></span></td><td> " +
ConnectionIndicator.getStringFromArray(data.localIP) +
"</td></tr>";
transport =
"<tr><td><span data-i18n='" +
remote_address_key + "' data-i18n-options='" +
JSON.stringify({count: data.remoteIP.length}) + "'>" +
translate(remote_address_key,
{count: data.remoteIP.length}) +
"</span></td><td> " +
JSON.stringify({count: data.remoteIP.length})
+ "'></span></td><td> " +
ConnectionIndicator.getStringFromArray(data.remoteIP) +
"</td></tr>";
@ -212,16 +198,14 @@ ConnectionIndicator.prototype.generateText = function () {
"<td>" +
"<span data-i18n='" + key_remote +
"' data-i18n-options='" +
JSON.stringify({count: this.transport.length}) + "'>" +
translate(key_remote, {count: this.transport.length}) +
"</span></td><td>";
JSON.stringify({count: this.transport.length})
+ "'></span></td><td>";
localTransport += "<tr>" +
"<td>" +
"<span data-i18n='" + key_local +
"' data-i18n-options='" +
JSON.stringify({count: this.transport.length}) + "'>" +
translate(key_local, {count: this.transport.length}) +
"</span></td><td>";
JSON.stringify({count: this.transport.length})
+ "'></span></td><td>";
transport +=
ConnectionIndicator.getStringFromArray(data.remotePort);
@ -231,7 +215,7 @@ ConnectionIndicator.prototype.generateText = function () {
transport += localTransport + "</td></tr>";
transport +="<tr>" +
"<td><span data-i18n='connectionindicator.transport'>" +
translate("connectionindicator.transport") + "</span></td>" +
"</span></td>" +
"<td>" + this.transport[0].type + "</td></tr>";
}
@ -239,8 +223,7 @@ ConnectionIndicator.prototype.generateText = function () {
result += "<table class='connection-info__container' style='width:100%'>" +
"<tr>" +
"<td>" +
"<span data-i18n='connectionindicator.bandwidth'>" +
translate("connectionindicator.bandwidth") + "</span>" +
"<span data-i18n='connectionindicator.bandwidth'></span>" +
"</td><td>" +
"<span class='connection-info__download'>&darr;</span>" +
downloadBandwidth +
@ -282,10 +265,12 @@ ConnectionIndicator.prototype.create = function () {
this.videoContainer.container.appendChild(
this.connectionIndicatorContainer);
this.popover = new JitsiPopover(
$("#" + this.videoContainer.videoSpanId + " > .connectionindicator"),
{content: "<div class=\"connection-info\" data-i18n='connectionindicator.na'>" +
APP.translation.translateString("connectionindicator.na") + "</div>",
skin: "black"});
$("#" + this.videoContainer.videoSpanId + " > .connectionindicator"), {
content: "<div class=\"connection-info\" " +
"data-i18n='connectionindicator.na'></div>",
skin: "black",
onBeforePosition: el => APP.translation.translateElement(el)
});
// override popover show method to make sure we will update the content
// before showing the popover
@ -398,7 +383,6 @@ ConnectionIndicator.prototype.updatePopoverData = function (force) {
this.popover.updateContent(
`<div class="connection-info">${this.generateText()}</div>`
);
APP.translation.translateElement($(".connection-info"));
}
};

View File

@ -379,9 +379,10 @@ export default class LargeVideoManager {
*/
_setRemoteConnectionMessage (msgKey, msgOptions) {
if (msgKey) {
let text = APP.translation.translateString(msgKey, msgOptions);
$('#remoteConnectionMessage')
.attr("data-i18n", msgKey).text(text);
.attr("data-i18n", msgKey)
.attr("data-i18n-options", JSON.stringify(msgOptions));
APP.translation.translateElement($('#remoteConnectionMessage'));
}
this.videoContainer.positionRemoteConnectionMessage();
@ -400,7 +401,8 @@ export default class LargeVideoManager {
_setLocalConnectionMessage (msgKey, msgOptions) {
$('#localConnectionMessage')
.attr("data-i18n", msgKey)
.text(APP.translation.translateString(msgKey, msgOptions));
.attr("data-i18n-options", JSON.stringify(msgOptions));
APP.translation.translateElement($('#localConnectionMessage'));
}
/**

View File

@ -96,14 +96,12 @@ LocalVideo.prototype.setDisplayName = function(displayName) {
editableText.value = displayName;
}
var defaultNickname = APP.translation.translateString(
"defaultNickname", {name: "Jane Pink"});
editableText.setAttribute('style', 'display:none;');
editableText.setAttribute('data-18n',
editableText.setAttribute('data-i18n',
'[placeholder]defaultNickname');
editableText.setAttribute("data-i18n-options",
JSON.stringify({name: "Jane Pink"}));
editableText.setAttribute("placeholder", defaultNickname);
APP.translation.translateElement($(editableText));
this.container
.querySelector('.videocontainer__toolbar')
@ -253,7 +251,8 @@ LocalVideo.prototype._buildContextMenu = function () {
events: {
show : function(options){
options.items.flip.name =
APP.translation.translateString("videothumbnail.flip");
APP.translation.generateTranslationHTML(
"videothumbnail.flip");
}
}
});

View File

@ -78,7 +78,8 @@ RemoteVideo.prototype._initPopupMenu = function (popupMenuElement) {
let options = {
content: popupMenuElement.outerHTML,
skin: "black",
hasArrow: false
hasArrow: false,
onBeforePosition: el => APP.translation.translateElement(el)
};
let element = $("#" + this.videoSpanId + " .remotevideomenu");
this.popover = new JitsiPopover(element, options);
@ -112,16 +113,10 @@ RemoteVideo.prototype._generatePopupContent = function () {
var mutedIndicator = "<i class='icon-mic-disabled'></i>";
var doMuteHTML = mutedIndicator +
" <div " +
"data-i18n='videothumbnail.domute'>" +
APP.translation.translateString("videothumbnail.domute") +
"</div>";
" <div data-i18n='videothumbnail.domute'></div>";
var mutedHTML = mutedIndicator +
" <div " +
"data-i18n='videothumbnail.muted'>" +
APP.translation.translateString("videothumbnail.muted") +
"</div>";
" <div data-i18n='videothumbnail.muted'></div>";
muteLinkItem.id = "mutelink_" + this.id;
@ -153,10 +148,7 @@ RemoteVideo.prototype._generatePopupContent = function () {
var ejectMenuItem = document.createElement('li');
var ejectLinkItem = document.createElement('a');
var ejectText = "<div " +
"data-i18n='videothumbnail.kick'>" +
APP.translation.translateString("videothumbnail.kick") +
"</div>";
var ejectText = "<div data-i18n='videothumbnail.kick'></div>";
ejectLinkItem.className = 'ejectlink';
ejectLinkItem.innerHTML = ejectIndicator + ' ' + ejectText;
@ -170,6 +162,8 @@ RemoteVideo.prototype._generatePopupContent = function () {
ejectMenuItem.appendChild(ejectLinkItem);
popupmenuElement.appendChild(ejectMenuItem);
APP.translation.translateElement($(popupmenuElement));
return popupmenuElement;
};

View File

@ -190,8 +190,7 @@ var KeyboardShortcut = {
let descriptionClass = "shortcuts-list__description";
descriptionElement.className = descriptionClass;
descriptionElement.setAttribute("data-i18n", shortcutDescriptionKey);
descriptionElement.innerHTML
= APP.translation.translateString(shortcutDescriptionKey);
APP.translation.translateElement($(descriptionElement));
listElement.appendChild(spanElement);
listElement.appendChild(descriptionElement);

View File

@ -89,9 +89,6 @@ module.exports = {
i18n.init(options, initCompleted);
},
translateString: function (key, options) {
return i18n.t(key, options);
},
setLanguage: function (lang) {
if(!lang)
lang = DEFAULT_LANG;
@ -100,16 +97,19 @@ module.exports = {
getCurrentLanguage: function () {
return i18n.lng();
},
translateElement: function (selector) {
selector.i18n();
translateElement: function (selector, options) {
// i18next expects undefined if options are missing, check if its null
selector.i18n(
options === null ? undefined : options);
},
generateTranslationHTML: function (key, options) {
var str = "<span data-i18n=\"" + key + "\"";
if (options) {
str += " data-i18n-options=\"" + JSON.stringify(options) + "\"";
str += " data-i18n-options='" + JSON.stringify(options) + "'";
}
str += ">";
str += this.translateString(key, options);
// i18next expects undefined if options ARE missing, check if its null
str += i18n.t(key, options === null ? undefined : options);
str += "</span>";
return str;