2017-10-10 23:31:40 +00:00
|
|
|
/* global APP, $, config, interfaceConfig */
|
2017-01-10 21:55:31 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const logger = require('jitsi-meet-logger').getLogger(__filename);
|
2016-11-11 15:00:54 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const UI = {};
|
2015-01-07 14:54:03 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
import Chat from './side_pannels/chat/Chat';
|
|
|
|
import SidePanels from './side_pannels/SidePanels';
|
|
|
|
import SideContainerToggler from './side_pannels/SideContainerToggler';
|
|
|
|
import messageHandler from './util/MessageHandler';
|
|
|
|
import UIUtil from './util/UIUtil';
|
|
|
|
import UIEvents from '../../service/UI/UIEvents';
|
2015-12-25 16:55:45 +00:00
|
|
|
import EtherpadManager from './etherpad/Etherpad';
|
2016-03-18 20:00:55 +00:00
|
|
|
import SharedVideoManager from './shared_video/SharedVideo';
|
2017-10-12 23:02:29 +00:00
|
|
|
import Recording from './recording/Recording';
|
2015-12-14 12:26:50 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
import VideoLayout from './videolayout/VideoLayout';
|
|
|
|
import Filmstrip from './videolayout/Filmstrip';
|
|
|
|
import Profile from './side_pannels/profile/Profile';
|
2015-12-14 12:26:50 +00:00
|
|
|
|
2017-04-09 21:20:37 +00:00
|
|
|
import {
|
|
|
|
openDeviceSelectionDialog
|
|
|
|
} from '../../react/features/device-selection';
|
2017-10-13 19:31:05 +00:00
|
|
|
import { updateDeviceList } from '../../react/features/base/devices';
|
|
|
|
import { JitsiTrackErrors } from '../../react/features/base/lib-jitsi-meet';
|
2017-11-21 17:38:40 +00:00
|
|
|
import {
|
|
|
|
getLocalParticipant,
|
2017-11-27 23:05:53 +00:00
|
|
|
participantPresenceChanged,
|
2017-11-21 17:38:40 +00:00
|
|
|
showParticipantJoinedNotification
|
|
|
|
} from '../../react/features/base/participants';
|
2017-07-28 17:58:04 +00:00
|
|
|
import { openDisplayNamePrompt } from '../../react/features/display-name';
|
2017-10-13 19:31:05 +00:00
|
|
|
import {
|
2017-11-16 17:25:04 +00:00
|
|
|
setNotificationsEnabled,
|
|
|
|
showWarningNotification
|
2017-10-13 19:31:05 +00:00
|
|
|
} from '../../react/features/notifications';
|
2017-02-16 23:02:40 +00:00
|
|
|
import {
|
|
|
|
checkAutoEnableDesktopSharing,
|
2017-08-15 23:52:42 +00:00
|
|
|
clearButtonPopup,
|
2017-04-01 05:52:40 +00:00
|
|
|
dockToolbox,
|
2017-08-15 23:52:42 +00:00
|
|
|
setButtonPopupTimeout,
|
2017-02-16 23:02:40 +00:00
|
|
|
setToolbarButton,
|
|
|
|
showDialPadButton,
|
|
|
|
showEtherpadButton,
|
|
|
|
showSharedVideoButton,
|
2017-04-01 05:52:40 +00:00
|
|
|
showToolbox
|
|
|
|
} from '../../react/features/toolbox';
|
2017-02-16 23:02:40 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const EventEmitter = require('events');
|
|
|
|
|
2017-06-14 18:13:41 +00:00
|
|
|
UI.messageHandler = messageHandler;
|
2017-10-12 23:02:29 +00:00
|
|
|
import FollowMe from '../FollowMe';
|
|
|
|
|
|
|
|
const eventEmitter = new EventEmitter();
|
2016-04-07 17:08:00 +00:00
|
|
|
|
2015-12-03 13:11:01 +00:00
|
|
|
UI.eventEmitter = eventEmitter;
|
2015-01-07 14:54:03 +00:00
|
|
|
|
2015-12-25 16:55:45 +00:00
|
|
|
let etherpadManager;
|
2016-03-18 20:00:55 +00:00
|
|
|
let sharedVideoManager;
|
2015-12-25 16:55:45 +00:00
|
|
|
|
2016-03-24 01:43:29 +00:00
|
|
|
let followMeHandler;
|
|
|
|
|
2016-05-26 08:53:02 +00:00
|
|
|
const JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP = {
|
|
|
|
microphone: {},
|
|
|
|
camera: {}
|
|
|
|
};
|
|
|
|
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP
|
|
|
|
.camera[JitsiTrackErrors.UNSUPPORTED_RESOLUTION]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.cameraUnsupportedResolutionError';
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP.camera[JitsiTrackErrors.GENERAL]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.cameraUnknownError';
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP.camera[JitsiTrackErrors.PERMISSION_DENIED]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.cameraPermissionDeniedError';
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP.camera[JitsiTrackErrors.NOT_FOUND]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.cameraNotFoundError';
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP.camera[JitsiTrackErrors.CONSTRAINT_FAILED]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.cameraConstraintFailedError';
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP
|
|
|
|
.camera[JitsiTrackErrors.NO_DATA_FROM_SOURCE]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.cameraNotSendingData';
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP.microphone[JitsiTrackErrors.GENERAL]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.micUnknownError';
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP
|
|
|
|
.microphone[JitsiTrackErrors.PERMISSION_DENIED]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.micPermissionDeniedError';
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP.microphone[JitsiTrackErrors.NOT_FOUND]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.micNotFoundError';
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP
|
|
|
|
.microphone[JitsiTrackErrors.CONSTRAINT_FAILED]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.micConstraintFailedError';
|
2017-10-10 23:31:40 +00:00
|
|
|
JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP
|
|
|
|
.microphone[JitsiTrackErrors.NO_DATA_FROM_SOURCE]
|
2017-10-12 23:02:29 +00:00
|
|
|
= 'dialog.micNotSendingData';
|
|
|
|
|
|
|
|
const UIListeners = new Map([
|
|
|
|
[
|
|
|
|
UIEvents.ETHERPAD_CLICKED,
|
|
|
|
() => etherpadManager && etherpadManager.toggleEtherpad()
|
|
|
|
], [
|
|
|
|
UIEvents.SHARED_VIDEO_CLICKED,
|
|
|
|
() => sharedVideoManager && sharedVideoManager.toggleSharedVideo()
|
|
|
|
], [
|
|
|
|
UIEvents.TOGGLE_FULLSCREEN,
|
|
|
|
() => UI.toggleFullScreen()
|
|
|
|
], [
|
|
|
|
UIEvents.TOGGLE_CHAT,
|
|
|
|
() => UI.toggleChat()
|
|
|
|
], [
|
|
|
|
UIEvents.TOGGLE_SETTINGS,
|
|
|
|
() => {
|
|
|
|
// Opening of device selection is special-cased as it is a dialog
|
|
|
|
// opened through a button in settings and not directly displayed in
|
|
|
|
// settings itself. As it is not useful to only have a settings menu
|
|
|
|
// with a button to open a dialog, open the dialog directly instead.
|
|
|
|
if (interfaceConfig.SETTINGS_SECTIONS.length === 1
|
|
|
|
&& UIUtil.isSettingEnabled('devices')) {
|
|
|
|
APP.store.dispatch(openDeviceSelectionDialog());
|
|
|
|
} else {
|
|
|
|
UI.toggleSidePanel('settings_container');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
], [
|
|
|
|
UIEvents.TOGGLE_CONTACT_LIST,
|
|
|
|
() => UI.toggleContactList()
|
|
|
|
], [
|
|
|
|
UIEvents.TOGGLE_PROFILE,
|
2017-10-16 20:37:13 +00:00
|
|
|
() => UI.toggleSidePanel('profile_container')
|
2017-10-12 23:02:29 +00:00
|
|
|
], [
|
|
|
|
UIEvents.TOGGLE_FILMSTRIP,
|
|
|
|
() => UI.handleToggleFilmstrip()
|
|
|
|
], [
|
|
|
|
UIEvents.FOLLOW_ME_ENABLED,
|
|
|
|
enabled => followMeHandler && followMeHandler.enableFollowMe(enabled)
|
|
|
|
]
|
|
|
|
]);
|
2016-05-26 08:53:02 +00:00
|
|
|
|
2015-12-10 13:30:25 +00:00
|
|
|
/**
|
|
|
|
* Toggles the application in and out of full screen mode
|
|
|
|
* (a.k.a. presentation mode in Chrome).
|
|
|
|
*/
|
2016-09-11 21:54:32 +00:00
|
|
|
UI.toggleFullScreen = function() {
|
2017-10-16 20:37:13 +00:00
|
|
|
UIUtil.isFullScreen() ? UIUtil.exitFullScreen() : UIUtil.enterFullScreen();
|
2016-09-11 21:54:32 +00:00
|
|
|
};
|
2015-12-10 13:30:25 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Notify user that server has shut down.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.notifyGracefulShutdown = function() {
|
2017-11-03 19:05:03 +00:00
|
|
|
messageHandler.showError({
|
|
|
|
descriptionKey: 'dialog.gracefulShutdown',
|
|
|
|
titleKey: 'dialog.serviceUnavailable'
|
|
|
|
});
|
2015-11-30 15:24:42 +00:00
|
|
|
};
|
2015-01-19 09:20:00 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Notify user that reservation error happened.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.notifyReservationError = function(code, msg) {
|
2017-11-03 19:05:03 +00:00
|
|
|
messageHandler.showError({
|
|
|
|
descriptionArguments: {
|
|
|
|
code,
|
|
|
|
msg
|
|
|
|
},
|
|
|
|
descriptionKey: 'dialog.reservationErrorMsg',
|
|
|
|
titleKey: 'dialog.reservationError'
|
|
|
|
});
|
2015-11-30 15:24:42 +00:00
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Notify user that he has been kicked from the server.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.notifyKicked = function() {
|
2017-11-03 19:05:03 +00:00
|
|
|
messageHandler.showError({
|
|
|
|
hideErrorSupportLink: true,
|
|
|
|
descriptionKey: 'dialog.kickMessage',
|
|
|
|
titleKey: 'dialog.sessTerminated'
|
|
|
|
});
|
2015-11-30 15:24:42 +00:00
|
|
|
};
|
|
|
|
|
2016-01-25 22:39:05 +00:00
|
|
|
/**
|
|
|
|
* Notify user that conference was destroyed.
|
|
|
|
* @param reason {string} the reason text
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.notifyConferenceDestroyed = function(reason) {
|
|
|
|
// FIXME: use Session Terminated from translation, but
|
2016-01-25 22:39:05 +00:00
|
|
|
// 'reason' text comes from XMPP packet and is not translated
|
2017-11-03 19:05:03 +00:00
|
|
|
messageHandler.showError({
|
|
|
|
description: reason,
|
|
|
|
titleKey: 'dialog.sessTerminated'
|
|
|
|
});
|
2016-01-25 22:39:05 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Show chat error.
|
|
|
|
* @param err the Error
|
2016-01-26 21:26:28 +00:00
|
|
|
* @param msg
|
2016-01-25 22:39:05 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.showChatError = function(err, msg) {
|
2017-10-16 20:37:13 +00:00
|
|
|
if (!interfaceConfig.filmStripOnly) {
|
|
|
|
Chat.chatAddError(err, msg);
|
2016-01-25 22:39:05 +00:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Change nickname for the user.
|
|
|
|
* @param {string} id user id
|
|
|
|
* @param {string} displayName new nickname
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.changeDisplayName = function(id, displayName) {
|
2015-12-01 13:41:58 +00:00
|
|
|
VideoLayout.onDisplayNameChanged(id, displayName);
|
2015-12-14 16:54:08 +00:00
|
|
|
|
2016-03-02 15:39:39 +00:00
|
|
|
if (APP.conference.isLocalId(id) || id === 'localVideoContainer') {
|
2016-09-11 21:54:32 +00:00
|
|
|
Profile.changeDisplayName(displayName);
|
2017-10-12 23:02:29 +00:00
|
|
|
Chat.setChatConversationMode(Boolean(displayName));
|
2015-12-14 16:54:08 +00:00
|
|
|
}
|
2015-11-30 15:24:42 +00:00
|
|
|
};
|
2015-01-19 09:20:00 +00:00
|
|
|
|
2016-09-16 20:33:22 +00:00
|
|
|
/**
|
|
|
|
* Shows/hides the indication about local connection being interrupted.
|
|
|
|
*
|
|
|
|
* @param {boolean} isInterrupted <tt>true</tt> if local connection is
|
|
|
|
* currently in the interrupted state or <tt>false</tt> if the connection
|
|
|
|
* is fine.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.showLocalConnectionInterrupted = function(isInterrupted) {
|
2016-09-16 20:33:22 +00:00
|
|
|
VideoLayout.showLocalConnectionInterrupted(isInterrupted);
|
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
2016-06-20 21:13:17 +00:00
|
|
|
* Sets the "raised hand" status for a participant.
|
|
|
|
*/
|
|
|
|
UI.setRaisedHandStatus = (participant, raisedHandStatus) => {
|
|
|
|
VideoLayout.setRaisedHandStatus(participant.getId(), raisedHandStatus);
|
|
|
|
if (raisedHandStatus) {
|
2017-10-16 20:37:13 +00:00
|
|
|
messageHandler.participantNotification(
|
|
|
|
participant.getDisplayName(),
|
|
|
|
'notify.somebody',
|
|
|
|
'connected',
|
|
|
|
'notify.raisedHand');
|
2016-06-20 21:13:17 +00:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Sets the local "raised hand" status.
|
|
|
|
*/
|
2017-03-31 17:54:58 +00:00
|
|
|
UI.setLocalRaisedHandStatus
|
2017-04-01 05:52:40 +00:00
|
|
|
= raisedHandStatus =>
|
2017-03-31 17:54:58 +00:00
|
|
|
VideoLayout.setRaisedHandStatus(
|
2016-10-03 16:12:04 +00:00
|
|
|
APP.conference.getMyUserId(),
|
|
|
|
raisedHandStatus);
|
2016-06-20 21:13:17 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Initialize conference UI.
|
2016-01-15 14:59:35 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.initConference = function() {
|
2017-10-13 19:31:05 +00:00
|
|
|
const { dispatch, getState } = APP.store;
|
2017-12-19 23:11:54 +00:00
|
|
|
const { email, id, name } = getLocalParticipant(getState);
|
2015-08-06 23:34:40 +00:00
|
|
|
|
2016-09-23 22:42:29 +00:00
|
|
|
// Update default button states before showing the toolbar
|
|
|
|
// if local role changes buttons state will be again updated.
|
|
|
|
UI.updateLocalRole(APP.conference.isModerator);
|
2016-03-28 16:46:45 +00:00
|
|
|
|
2016-09-08 18:16:23 +00:00
|
|
|
UI.showToolbar();
|
2015-06-18 17:49:43 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const displayName = config.displayJids ? id : name;
|
2015-08-06 23:34:40 +00:00
|
|
|
|
2015-11-30 15:24:42 +00:00
|
|
|
if (displayName) {
|
|
|
|
UI.changeDisplayName('localVideoContainer', displayName);
|
|
|
|
}
|
|
|
|
|
2016-01-05 23:23:24 +00:00
|
|
|
// Make sure we configure our avatar id, before creating avatar for us
|
2016-08-31 16:40:06 +00:00
|
|
|
if (email) {
|
|
|
|
UI.setUserEmail(id, email);
|
|
|
|
}
|
2016-01-05 23:23:24 +00:00
|
|
|
|
2017-10-13 19:31:05 +00:00
|
|
|
dispatch(checkAutoEnableDesktopSharing());
|
2016-04-15 20:41:51 +00:00
|
|
|
|
2016-03-11 10:55:29 +00:00
|
|
|
// FollowMe attempts to copy certain aspects of the moderator's UI into the
|
|
|
|
// other participants' UI. Consequently, it needs (1) read and write access
|
|
|
|
// to the UI (depending on the moderator role of the local participant) and
|
|
|
|
// (2) APP.conference as means of communication between the participants.
|
2016-03-24 01:43:29 +00:00
|
|
|
followMeHandler = new FollowMe(APP.conference, UI);
|
2015-11-30 15:24:42 +00:00
|
|
|
};
|
2015-07-29 19:39:09 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.mucJoined = function() {
|
2016-01-11 23:14:56 +00:00
|
|
|
VideoLayout.mucJoined();
|
2017-06-29 03:35:43 +00:00
|
|
|
|
|
|
|
// Update local video now that a conference is joined a user ID should be
|
|
|
|
// set.
|
2017-10-06 17:52:23 +00:00
|
|
|
UI.changeDisplayName(
|
|
|
|
'localVideoContainer',
|
|
|
|
APP.conference.getLocalDisplayName());
|
2016-01-11 23:14:56 +00:00
|
|
|
};
|
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
/** *
|
2016-09-01 05:29:41 +00:00
|
|
|
* Handler for toggling filmstrip
|
|
|
|
*/
|
2017-04-10 17:59:44 +00:00
|
|
|
UI.handleToggleFilmstrip = () => UI.toggleFilmstrip();
|
2016-09-01 05:29:41 +00:00
|
|
|
|
2016-04-19 18:07:04 +00:00
|
|
|
/**
|
|
|
|
* Returns the shared document manager object.
|
|
|
|
* @return {EtherpadManager} the shared document manager object
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.getSharedVideoManager = function() {
|
2016-04-19 18:07:04 +00:00
|
|
|
return sharedVideoManager;
|
|
|
|
};
|
|
|
|
|
2016-01-11 20:26:04 +00:00
|
|
|
/**
|
|
|
|
* Starts the UI module and initializes all related components.
|
|
|
|
*
|
|
|
|
* @returns {boolean} true if the UI is ready and the conference should be
|
2017-05-26 16:28:14 +00:00
|
|
|
* established, false - otherwise (for example in the case of welcome page)
|
2016-01-11 20:26:04 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.start = function() {
|
2015-01-07 14:54:03 +00:00
|
|
|
document.title = interfaceConfig.APP_NAME;
|
|
|
|
|
|
|
|
// Set the defaults for prompt dialogs.
|
2017-10-12 23:02:29 +00:00
|
|
|
$.prompt.setDefaults({ persistent: false });
|
2015-01-07 14:54:03 +00:00
|
|
|
|
2016-09-08 22:34:16 +00:00
|
|
|
SideContainerToggler.init(eventEmitter);
|
2017-04-10 17:59:44 +00:00
|
|
|
Filmstrip.init(eventEmitter);
|
2015-12-30 10:55:51 +00:00
|
|
|
|
2015-02-13 09:31:25 +00:00
|
|
|
VideoLayout.init(eventEmitter);
|
2015-12-25 16:55:45 +00:00
|
|
|
if (!interfaceConfig.filmStripOnly) {
|
2016-09-08 18:16:23 +00:00
|
|
|
VideoLayout.initLargeVideo();
|
2015-12-25 16:55:45 +00:00
|
|
|
}
|
2016-09-08 18:16:23 +00:00
|
|
|
VideoLayout.resizeVideoArea(true, true);
|
2015-12-25 16:55:45 +00:00
|
|
|
|
2016-03-18 20:00:55 +00:00
|
|
|
sharedVideoManager = new SharedVideoManager(eventEmitter);
|
2017-10-12 23:02:29 +00:00
|
|
|
// eslint-disable-next-line no-negated-condition
|
2015-08-10 17:59:12 +00:00
|
|
|
if (!interfaceConfig.filmStripOnly) {
|
2017-04-12 19:06:56 +00:00
|
|
|
// Initialise the recording module.
|
|
|
|
if (config.enableRecording) {
|
|
|
|
Recording.init(eventEmitter, config.recordingType);
|
|
|
|
}
|
2017-10-12 23:02:29 +00:00
|
|
|
|
2017-02-16 23:02:40 +00:00
|
|
|
// Initialize side panels
|
|
|
|
SidePanels.init(eventEmitter);
|
2015-12-02 13:05:29 +00:00
|
|
|
} else {
|
2017-10-12 23:02:29 +00:00
|
|
|
$('body').addClass('filmstrip-only');
|
2017-04-06 18:28:47 +00:00
|
|
|
UI.showToolbar();
|
2017-04-10 17:59:44 +00:00
|
|
|
Filmstrip.setFilmstripOnly();
|
2017-08-02 18:15:55 +00:00
|
|
|
APP.store.dispatch(setNotificationsEnabled(false));
|
2015-08-06 23:34:40 +00:00
|
|
|
}
|
2015-01-22 16:02:37 +00:00
|
|
|
|
2017-05-17 22:40:41 +00:00
|
|
|
if (interfaceConfig.VERTICAL_FILMSTRIP) {
|
2017-10-12 23:02:29 +00:00
|
|
|
$('body').addClass('vertical-filmstrip');
|
2017-05-17 22:40:41 +00:00
|
|
|
}
|
|
|
|
|
2015-01-07 14:54:03 +00:00
|
|
|
document.title = interfaceConfig.APP_NAME;
|
2017-02-15 21:39:16 +00:00
|
|
|
};
|
2016-06-13 21:11:44 +00:00
|
|
|
|
2017-05-11 00:19:35 +00:00
|
|
|
/**
|
|
|
|
* Invokes cleanup of any deferred execution within relevant UI modules.
|
|
|
|
*
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
|
|
|
UI.stopDaemons = () => {
|
|
|
|
VideoLayout.resetLargeVideo();
|
|
|
|
};
|
|
|
|
|
2017-02-15 21:39:16 +00:00
|
|
|
/**
|
|
|
|
* Setup some UI event listeners.
|
|
|
|
*/
|
|
|
|
UI.registerListeners
|
|
|
|
= () => UIListeners.forEach((value, key) => UI.addListener(key, value));
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Unregister some UI event listeners.
|
|
|
|
*/
|
|
|
|
UI.unregisterListeners
|
|
|
|
= () => UIListeners.forEach((value, key) => UI.removeListener(key, value));
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Setup some DOM event listeners.
|
|
|
|
*/
|
|
|
|
UI.bindEvents = () => {
|
2017-10-12 23:02:29 +00:00
|
|
|
/**
|
|
|
|
*
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
function onResize() {
|
|
|
|
SideContainerToggler.resize();
|
|
|
|
VideoLayout.resizeVideoArea();
|
|
|
|
}
|
|
|
|
|
|
|
|
// Resize and reposition videos in full screen mode.
|
|
|
|
$(document).on(
|
|
|
|
'webkitfullscreenchange mozfullscreenchange fullscreenchange',
|
|
|
|
() => {
|
|
|
|
eventEmitter.emit(
|
|
|
|
UIEvents.FULLSCREEN_TOGGLED,
|
|
|
|
UIUtil.isFullScreen());
|
|
|
|
onResize();
|
|
|
|
});
|
|
|
|
|
|
|
|
$(window).resize(onResize);
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Unbind some DOM event listeners.
|
|
|
|
*/
|
|
|
|
UI.unbindEvents = () => {
|
|
|
|
$(document).off(
|
|
|
|
'webkitfullscreenchange mozfullscreenchange fullscreenchange');
|
|
|
|
|
|
|
|
$(window).off('resize');
|
2015-01-07 14:54:03 +00:00
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Show local stream on UI.
|
|
|
|
* @param {JitsiTrack} track stream to show
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.addLocalStream = track => {
|
2015-12-07 16:26:25 +00:00
|
|
|
switch (track.getType()) {
|
2015-11-30 11:54:54 +00:00
|
|
|
case 'audio':
|
2017-06-30 20:02:51 +00:00
|
|
|
// Local audio is not rendered so no further action is needed at this
|
|
|
|
// point.
|
2015-11-30 11:54:54 +00:00
|
|
|
break;
|
|
|
|
case 'video':
|
2015-12-07 16:26:25 +00:00
|
|
|
VideoLayout.changeLocalVideo(track);
|
2015-11-30 11:54:54 +00:00
|
|
|
break;
|
|
|
|
default:
|
2017-10-12 23:02:29 +00:00
|
|
|
logger.error(`Unknown stream type: ${track.getType()}`);
|
2015-11-30 11:54:54 +00:00
|
|
|
break;
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Show remote stream on UI.
|
|
|
|
* @param {JitsiTrack} track stream to show
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.addRemoteStream = track => VideoLayout.onRemoteStreamAdded(track);
|
2015-11-30 11:54:54 +00:00
|
|
|
|
2016-02-23 22:47:55 +00:00
|
|
|
/**
|
|
|
|
* Removed remote stream from UI.
|
|
|
|
* @param {JitsiTrack} track stream to remove
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.removeRemoteStream = track => VideoLayout.onRemoteStreamRemoved(track);
|
2016-02-23 22:47:55 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Update chat subject.
|
|
|
|
* @param {string} subject new chat subject
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.setSubject = subject => Chat.setSubject(subject);
|
2015-01-07 14:54:03 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Setup and show Etherpad.
|
|
|
|
* @param {string} name etherpad id
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.initEtherpad = name => {
|
2015-12-30 20:57:28 +00:00
|
|
|
if (etherpadManager || !config.etherpad_base || !name) {
|
2015-12-25 16:55:45 +00:00
|
|
|
return;
|
|
|
|
}
|
2016-11-11 15:00:54 +00:00
|
|
|
logger.log('Etherpad is enabled');
|
2016-03-24 01:43:29 +00:00
|
|
|
etherpadManager
|
|
|
|
= new EtherpadManager(config.etherpad_base, name, eventEmitter);
|
2017-02-16 23:02:40 +00:00
|
|
|
|
|
|
|
APP.store.dispatch(showEtherpadButton());
|
2015-12-25 16:55:45 +00:00
|
|
|
};
|
2015-01-07 14:54:03 +00:00
|
|
|
|
2016-03-24 01:43:29 +00:00
|
|
|
/**
|
|
|
|
* Returns the shared document manager object.
|
|
|
|
* @return {EtherpadManager} the shared document manager object
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.getSharedDocumentManager = () => etherpadManager;
|
2016-03-24 01:43:29 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Show user on UI.
|
2016-09-16 20:17:00 +00:00
|
|
|
* @param {JitsiParticipant} user
|
2016-01-15 14:59:35 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.addUser = function(user) {
|
|
|
|
const id = user.getId();
|
|
|
|
const displayName = user.getDisplayName();
|
2017-11-27 23:05:53 +00:00
|
|
|
const status = user.getStatus();
|
2017-06-05 18:19:25 +00:00
|
|
|
|
2017-11-27 23:05:53 +00:00
|
|
|
if (status) {
|
|
|
|
// if user has initial status dispatch it
|
|
|
|
// and skip 'connected' notifications
|
|
|
|
APP.store.dispatch(participantPresenceChanged(id, status));
|
|
|
|
|
|
|
|
// FIXME: move updateUserStatus in participantPresenceChanged action
|
|
|
|
UI.updateUserStatus(user, status);
|
|
|
|
} else {
|
|
|
|
APP.store.dispatch(showParticipantJoinedNotification(displayName));
|
|
|
|
}
|
2015-01-07 14:54:03 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
if (!config.startAudioMuted
|
|
|
|
|| config.startAudioMuted > APP.conference.membersCount) {
|
2015-05-28 11:34:40 +00:00
|
|
|
UIUtil.playSoundNotification('userJoined');
|
2017-10-12 23:02:29 +00:00
|
|
|
}
|
2015-07-20 17:32:04 +00:00
|
|
|
|
2015-01-07 14:54:03 +00:00
|
|
|
// Add Peer's container
|
2016-09-16 20:17:00 +00:00
|
|
|
VideoLayout.addParticipantContainer(user);
|
2016-03-18 22:44:32 +00:00
|
|
|
|
|
|
|
// Configure avatar
|
2016-06-13 21:11:44 +00:00
|
|
|
UI.setUserEmail(id);
|
2016-04-10 03:08:06 +00:00
|
|
|
|
|
|
|
// set initial display name
|
2017-10-12 23:02:29 +00:00
|
|
|
if (displayName) {
|
2016-04-10 03:08:06 +00:00
|
|
|
UI.changeDisplayName(id, displayName);
|
2017-10-12 23:02:29 +00:00
|
|
|
}
|
2015-11-30 15:24:42 +00:00
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Remove user from UI.
|
|
|
|
* @param {string} id user id
|
|
|
|
* @param {string} displayName user nickname
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.removeUser = function(id, displayName) {
|
2017-07-10 03:01:48 +00:00
|
|
|
messageHandler.participantNotification(
|
2017-10-16 20:37:13 +00:00
|
|
|
displayName, 'notify.somebody', 'disconnected', 'notify.disconnected');
|
2015-12-14 15:40:30 +00:00
|
|
|
|
2016-01-06 22:39:13 +00:00
|
|
|
if (!config.startAudioMuted
|
2017-10-16 20:37:13 +00:00
|
|
|
|| config.startAudioMuted > APP.conference.membersCount) {
|
2015-11-30 15:24:42 +00:00
|
|
|
UIUtil.playSoundNotification('userLeft');
|
|
|
|
}
|
|
|
|
|
2015-12-14 15:40:30 +00:00
|
|
|
VideoLayout.removeParticipantContainer(id);
|
2015-11-30 15:24:42 +00:00
|
|
|
};
|
2015-01-07 14:54:03 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Update videotype for specified user.
|
|
|
|
* @param {string} id user id
|
|
|
|
* @param {string} newVideoType new videotype
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.onPeerVideoTypeChanged
|
|
|
|
= (id, newVideoType) => VideoLayout.onVideoTypeChanged(id, newVideoType);
|
2015-08-05 12:09:12 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Update local user role and show notification if user is moderator.
|
|
|
|
* @param {boolean} isModerator if local user is moderator or not
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.updateLocalRole = isModerator => {
|
2015-01-07 14:54:03 +00:00
|
|
|
VideoLayout.showModeratorIndicator();
|
|
|
|
|
2017-02-16 23:02:40 +00:00
|
|
|
APP.store.dispatch(showSharedVideoButton());
|
|
|
|
|
2016-03-29 17:13:54 +00:00
|
|
|
Recording.showRecordingButton(isModerator);
|
2015-12-08 15:13:44 +00:00
|
|
|
|
|
|
|
if (isModerator) {
|
2017-10-12 23:02:29 +00:00
|
|
|
if (!interfaceConfig.DISABLE_FOCUS_INDICATOR) {
|
2017-07-10 03:01:48 +00:00
|
|
|
messageHandler.participantNotification(
|
2017-10-12 23:02:29 +00:00
|
|
|
null, 'notify.me', 'connected', 'notify.moderator');
|
|
|
|
}
|
2015-12-08 15:13:44 +00:00
|
|
|
|
2016-03-29 17:13:54 +00:00
|
|
|
Recording.checkAutoRecord();
|
2015-12-08 15:13:44 +00:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
2016-01-13 21:17:33 +00:00
|
|
|
/**
|
|
|
|
* Check the role for the user and reflect it in the UI, moderator ui indication
|
|
|
|
* and notifies user who is the moderator
|
|
|
|
* @param user to check for moderator
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.updateUserRole = user => {
|
2015-12-08 15:13:44 +00:00
|
|
|
VideoLayout.showModeratorIndicator();
|
|
|
|
|
2016-09-27 19:32:54 +00:00
|
|
|
// We don't need to show moderator notifications when the focus (moderator)
|
|
|
|
// indicator is disabled.
|
|
|
|
if (!user.isModerator() || interfaceConfig.DISABLE_FOCUS_INDICATOR) {
|
2015-12-08 15:13:44 +00:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const displayName = user.getDisplayName();
|
|
|
|
|
2015-12-08 15:13:44 +00:00
|
|
|
if (displayName) {
|
2017-07-10 03:01:48 +00:00
|
|
|
messageHandler.participantNotification(
|
2017-10-16 20:37:13 +00:00
|
|
|
displayName,
|
|
|
|
'notify.somebody',
|
|
|
|
'connected',
|
|
|
|
'notify.grantedTo',
|
|
|
|
{ to: UIUtil.escapeHtml(displayName) });
|
2015-12-08 15:13:44 +00:00
|
|
|
} else {
|
2017-07-10 03:01:48 +00:00
|
|
|
messageHandler.participantNotification(
|
2017-10-16 20:37:13 +00:00
|
|
|
'',
|
|
|
|
'notify.somebody',
|
|
|
|
'connected',
|
|
|
|
'notify.grantedToUnknown');
|
2015-01-07 14:54:03 +00:00
|
|
|
}
|
2015-12-08 15:13:44 +00:00
|
|
|
};
|
2015-01-23 15:36:17 +00:00
|
|
|
|
2017-05-19 15:12:24 +00:00
|
|
|
/**
|
|
|
|
* Updates the user status.
|
|
|
|
*
|
|
|
|
* @param {JitsiParticipant} user - The user which status we need to update.
|
|
|
|
* @param {string} status - The new status.
|
|
|
|
*/
|
|
|
|
UI.updateUserStatus = (user, status) => {
|
2017-08-23 18:41:55 +00:00
|
|
|
if (!status) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const displayName = user.getDisplayName();
|
|
|
|
|
2017-07-10 03:01:48 +00:00
|
|
|
messageHandler.participantNotification(
|
2017-10-16 20:37:13 +00:00
|
|
|
displayName,
|
|
|
|
'',
|
|
|
|
'connected',
|
|
|
|
'dialOut.statusMessage',
|
|
|
|
{ status: UIUtil.escapeHtml(status) });
|
2017-05-19 15:12:24 +00:00
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Toggles smileys in the chat.
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.toggleSmileys = () => Chat.toggleSmileys();
|
2015-01-28 14:35:22 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
2017-04-10 17:59:44 +00:00
|
|
|
* Toggles filmstrip.
|
2016-01-15 14:59:35 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.toggleFilmstrip = function() {
|
|
|
|
// eslint-disable-next-line prefer-rest-params
|
|
|
|
Filmstrip.toggleFilmstrip(...arguments);
|
2016-10-07 22:27:32 +00:00
|
|
|
VideoLayout.resizeVideoArea(true, false);
|
2015-01-27 09:56:22 +00:00
|
|
|
};
|
|
|
|
|
2016-04-01 21:26:30 +00:00
|
|
|
/**
|
2017-04-10 17:59:44 +00:00
|
|
|
* Indicates if the filmstrip is currently visible or not.
|
|
|
|
* @returns {true} if the filmstrip is currently visible, otherwise
|
2016-04-01 21:26:30 +00:00
|
|
|
*/
|
2017-04-10 17:59:44 +00:00
|
|
|
UI.isFilmstripVisible = () => Filmstrip.isFilmstripVisible();
|
2016-04-01 21:26:30 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Toggles chat panel.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.toggleChat = () => UI.toggleSidePanel('chat_container');
|
2015-01-27 09:56:22 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Toggles contact list panel.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.toggleContactList = () => UI.toggleSidePanel('contacts_container');
|
2015-01-27 09:56:22 +00:00
|
|
|
|
2016-09-11 21:54:32 +00:00
|
|
|
/**
|
|
|
|
* Toggles the given side panel.
|
|
|
|
*
|
|
|
|
* @param {String} sidePanelId the identifier of the side panel to toggle
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.toggleSidePanel = sidePanelId => SideContainerToggler.toggle(sidePanelId);
|
2015-01-27 09:56:22 +00:00
|
|
|
|
2016-09-11 21:54:32 +00:00
|
|
|
|
2016-02-12 12:48:57 +00:00
|
|
|
/**
|
|
|
|
* Handle new user display name.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.inputDisplayNameHandler = function(newDisplayName) {
|
2016-02-12 12:48:57 +00:00
|
|
|
eventEmitter.emit(UIEvents.NICKNAME_CHANGED, newDisplayName);
|
2015-01-07 14:54:03 +00:00
|
|
|
};
|
|
|
|
|
2017-02-15 08:54:57 +00:00
|
|
|
/**
|
|
|
|
* Show custom popup/tooltip for a specified button.
|
2017-08-15 23:52:42 +00:00
|
|
|
*
|
|
|
|
* @param {string} buttonName - The name of the button as specified in the
|
|
|
|
* button configurations for the toolbar.
|
|
|
|
* @param {string} popupSelectorID - The id of the popup to show as specified in
|
|
|
|
* the button configurations for the toolbar.
|
|
|
|
* @param {boolean} show - True or false/show or hide the popup
|
|
|
|
* @param {number} timeout - The time to show the popup
|
|
|
|
* @returns {void}
|
2017-02-15 08:54:57 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
// eslint-disable-next-line max-params
|
|
|
|
UI.showCustomToolbarPopup = function(buttonName, popupID, show, timeout) {
|
2017-10-16 20:37:13 +00:00
|
|
|
const action
|
|
|
|
= show
|
|
|
|
? setButtonPopupTimeout(buttonName, popupID, timeout)
|
|
|
|
: clearButtonPopup(buttonName);
|
2017-08-15 23:52:42 +00:00
|
|
|
|
|
|
|
APP.store.dispatch(action);
|
2017-02-15 08:54:57 +00:00
|
|
|
};
|
|
|
|
|
2015-11-16 23:42:21 +00:00
|
|
|
/**
|
|
|
|
* Return the type of the remote video.
|
|
|
|
* @param jid the jid for the remote video
|
|
|
|
* @returns the video type video or screen.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.getRemoteVideoType = function(jid) {
|
2015-11-16 23:42:21 +00:00
|
|
|
return VideoLayout.getRemoteVideoType(jid);
|
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
// FIXME check if someone user this
|
2015-07-28 21:52:32 +00:00
|
|
|
UI.showLoginPopup = function(callback) {
|
2016-11-11 15:00:54 +00:00
|
|
|
logger.log('password is required');
|
2016-10-12 00:08:24 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const message
|
|
|
|
= `<input name="username" type="text"
|
2016-11-09 16:46:58 +00:00
|
|
|
placeholder="user@domain.net"
|
|
|
|
class="input-control" autofocus>
|
2016-10-12 00:08:24 +00:00
|
|
|
<input name="password" type="password"
|
|
|
|
data-i18n="[placeholder]dialog.userPassword"
|
2016-11-09 16:46:58 +00:00
|
|
|
class="input-control"
|
2016-10-12 00:08:24 +00:00
|
|
|
placeholder="user password">`
|
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
;
|
|
|
|
|
|
|
|
// eslint-disable-next-line max-params
|
|
|
|
const submitFunction = (e, v, m, f) => {
|
2017-10-16 20:37:13 +00:00
|
|
|
if (v && f.username && f.password) {
|
|
|
|
callback(f.username, f.password);
|
2016-10-12 00:08:24 +00:00
|
|
|
}
|
|
|
|
};
|
2015-03-11 09:03:32 +00:00
|
|
|
|
2016-10-12 00:08:24 +00:00
|
|
|
messageHandler.openTwoButtonDialog({
|
2017-10-12 23:02:29 +00:00
|
|
|
titleKey: 'dialog.passwordRequired',
|
2016-10-12 00:08:24 +00:00
|
|
|
msgString: message,
|
|
|
|
leftButtonKey: 'dialog.Ok',
|
|
|
|
submitFunction,
|
|
|
|
focus: ':input:first'
|
|
|
|
});
|
2015-07-28 21:52:32 +00:00
|
|
|
};
|
2015-01-19 09:20:00 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.askForNickname = function() {
|
|
|
|
// eslint-disable-next-line no-alert
|
2015-11-30 15:24:42 +00:00
|
|
|
return window.prompt('Your nickname (optional)');
|
|
|
|
};
|
2015-01-07 14:54:03 +00:00
|
|
|
|
2015-01-19 09:20:00 +00:00
|
|
|
/**
|
2016-01-06 22:39:13 +00:00
|
|
|
* Sets muted audio state for participant
|
2015-01-19 09:20:00 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.setAudioMuted = function(id, muted) {
|
2016-01-06 22:39:13 +00:00
|
|
|
VideoLayout.onAudioMute(id, muted);
|
2016-02-09 10:19:43 +00:00
|
|
|
if (APP.conference.isLocalId(id)) {
|
2017-07-24 13:56:57 +00:00
|
|
|
APP.conference.updateAudioIconEnabled();
|
2016-02-09 10:19:43 +00:00
|
|
|
}
|
2015-11-30 11:54:54 +00:00
|
|
|
};
|
2015-01-19 09:20:00 +00:00
|
|
|
|
2016-01-06 22:39:13 +00:00
|
|
|
/**
|
|
|
|
* Sets muted video state for participant
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.setVideoMuted = function(id, muted) {
|
2016-01-06 22:39:13 +00:00
|
|
|
VideoLayout.onVideoMute(id, muted);
|
2016-02-09 10:19:43 +00:00
|
|
|
if (APP.conference.isLocalId(id)) {
|
2017-07-24 13:56:57 +00:00
|
|
|
APP.conference.updateVideoIconEnabled();
|
2016-02-09 10:19:43 +00:00
|
|
|
}
|
2015-07-28 21:52:32 +00:00
|
|
|
};
|
2015-01-19 09:20:00 +00:00
|
|
|
|
2017-04-05 15:14:26 +00:00
|
|
|
/**
|
|
|
|
* Triggers an update of remote video and large video displays so they may pick
|
|
|
|
* up any state changes that have occurred elsewhere.
|
|
|
|
*
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
|
|
|
UI.updateAllVideos = () => VideoLayout.updateAllVideos();
|
|
|
|
|
2016-03-24 01:43:29 +00:00
|
|
|
/**
|
|
|
|
* Adds a listener that would be notified on the given type of event.
|
|
|
|
*
|
|
|
|
* @param type the type of the event we're listening for
|
|
|
|
* @param listener a function that would be called when notified
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.addListener = function(type, listener) {
|
2015-01-22 16:02:37 +00:00
|
|
|
eventEmitter.on(type, listener);
|
2015-07-28 21:52:32 +00:00
|
|
|
};
|
2015-01-22 16:02:37 +00:00
|
|
|
|
2016-03-24 01:43:29 +00:00
|
|
|
/**
|
|
|
|
* Removes the given listener for the given type of event.
|
|
|
|
*
|
|
|
|
* @param type the type of the event we're listening for
|
|
|
|
* @param listener the listener we want to remove
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.removeListener = function(type, listener) {
|
2016-03-24 01:43:29 +00:00
|
|
|
eventEmitter.removeListener(type, listener);
|
|
|
|
};
|
|
|
|
|
2016-09-11 21:54:32 +00:00
|
|
|
/**
|
|
|
|
* Emits the event of given type by specifying the parameters in options.
|
|
|
|
*
|
|
|
|
* @param type the type of the event we're emitting
|
|
|
|
* @param options the parameters for the event
|
|
|
|
*/
|
2017-02-16 23:02:40 +00:00
|
|
|
UI.emitEvent = (type, ...options) => eventEmitter.emit(type, ...options);
|
2016-09-11 21:54:32 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.clickOnVideo = function(videoNumber) {
|
|
|
|
const videos = $('#remoteVideos .videocontainer:not(#mixedstream)');
|
|
|
|
const videosLength = videos.length;
|
2016-11-03 10:13:03 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
if (videosLength <= videoNumber) {
|
2016-11-03 10:13:03 +00:00
|
|
|
return;
|
2015-01-22 16:26:05 +00:00
|
|
|
}
|
2017-10-12 23:02:29 +00:00
|
|
|
const videoIndex = videoNumber === 0 ? 0 : videosLength - videoNumber;
|
|
|
|
|
2016-11-03 10:13:03 +00:00
|
|
|
videos[videoIndex].click();
|
2015-07-28 21:52:32 +00:00
|
|
|
};
|
2015-01-22 16:26:05 +00:00
|
|
|
|
2017-04-01 05:52:40 +00:00
|
|
|
// Used by torture.
|
|
|
|
UI.showToolbar = timeout => APP.store.dispatch(showToolbox(timeout));
|
2015-02-09 08:12:55 +00:00
|
|
|
|
2017-04-01 05:52:40 +00:00
|
|
|
// Used by torture.
|
|
|
|
UI.dockToolbar = dock => APP.store.dispatch(dockToolbox(dock));
|
2015-02-09 08:12:55 +00:00
|
|
|
|
2016-06-13 21:11:44 +00:00
|
|
|
/**
|
|
|
|
* Update user email.
|
|
|
|
* @param {string} id user id
|
2016-08-31 16:40:06 +00:00
|
|
|
* @param {string} email user email
|
2016-06-13 21:11:44 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.setUserEmail = function(id, email) {
|
2017-03-23 18:01:33 +00:00
|
|
|
if (APP.conference.isLocalId(id)) {
|
|
|
|
Profile.changeEmail(email);
|
|
|
|
}
|
2016-06-13 21:11:44 +00:00
|
|
|
};
|
|
|
|
|
2016-08-31 16:40:06 +00:00
|
|
|
/**
|
2017-12-19 23:11:54 +00:00
|
|
|
* Updates the displayed avatar for participant.
|
|
|
|
*
|
|
|
|
* @param {string} id - User id whose avatar should be updated.
|
|
|
|
* @param {string} avatarURL - The URL to avatar image to display.
|
|
|
|
* @returns {void}
|
2016-06-13 21:11:44 +00:00
|
|
|
*/
|
2017-12-19 23:11:54 +00:00
|
|
|
UI.refreshAvatarDisplay = function(id, avatarURL) {
|
|
|
|
VideoLayout.changeUserAvatar(id, avatarURL);
|
2015-11-30 11:54:54 +00:00
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Notify user that connection failed.
|
|
|
|
* @param {string} stropheErrorMsg raw Strophe error message
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.notifyConnectionFailed = function(stropheErrorMsg) {
|
2017-11-03 19:05:03 +00:00
|
|
|
let descriptionKey;
|
|
|
|
let descriptionArguments;
|
2017-10-12 23:02:29 +00:00
|
|
|
|
2015-11-30 11:54:54 +00:00
|
|
|
if (stropheErrorMsg) {
|
2017-11-03 19:05:03 +00:00
|
|
|
descriptionKey = 'dialog.connectErrorWithMsg';
|
|
|
|
descriptionArguments = { msg: stropheErrorMsg };
|
2015-03-23 16:12:24 +00:00
|
|
|
} else {
|
2017-11-03 19:05:03 +00:00
|
|
|
descriptionKey = 'dialog.connectError';
|
2015-03-23 16:12:24 +00:00
|
|
|
}
|
2015-11-30 11:54:54 +00:00
|
|
|
|
2017-11-03 19:05:03 +00:00
|
|
|
messageHandler.showError({
|
|
|
|
descriptionArguments,
|
|
|
|
descriptionKey,
|
|
|
|
titleKey: 'connection.CONNFAIL'
|
|
|
|
});
|
2015-07-28 21:52:32 +00:00
|
|
|
};
|
2015-03-23 16:12:24 +00:00
|
|
|
|
2016-03-15 19:08:01 +00:00
|
|
|
|
|
|
|
/**
|
2016-03-17 18:23:03 +00:00
|
|
|
* Notify user that maximum users limit has been reached.
|
2016-03-15 19:08:01 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.notifyMaxUsersLimitReached = function() {
|
2017-11-03 19:05:03 +00:00
|
|
|
messageHandler.showError({
|
|
|
|
hideErrorSupportLink: true,
|
|
|
|
descriptionKey: 'dialog.maxUsersLimitReached',
|
|
|
|
titleKey: 'dialog.maxUsersLimitReachedTitle'
|
|
|
|
});
|
2015-07-28 21:52:32 +00:00
|
|
|
};
|
2015-03-23 16:12:24 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Notify user that he was automatically muted when joned the conference.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.notifyInitiallyMuted = function() {
|
2017-07-10 03:01:48 +00:00
|
|
|
messageHandler.participantNotification(
|
2016-10-03 16:12:04 +00:00
|
|
|
null,
|
2017-10-12 23:02:29 +00:00
|
|
|
'notify.mutedTitle',
|
|
|
|
'connected',
|
|
|
|
'notify.muted',
|
2016-10-03 16:12:04 +00:00
|
|
|
null,
|
2017-07-28 17:56:49 +00:00
|
|
|
120000);
|
2015-11-30 11:54:54 +00:00
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Mark user as dominant speaker.
|
|
|
|
* @param {string} id user id
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.markDominantSpeaker = function(id) {
|
2015-11-30 11:54:54 +00:00
|
|
|
VideoLayout.onDominantSpeakerChanged(id);
|
|
|
|
};
|
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.handleLastNEndpoints = function(leavingIds, enteringIds) {
|
2017-03-21 21:51:49 +00:00
|
|
|
VideoLayout.onLastNEndpointsChanged(leavingIds, enteringIds);
|
2015-11-30 11:54:54 +00:00
|
|
|
};
|
|
|
|
|
2016-09-16 20:51:19 +00:00
|
|
|
/**
|
|
|
|
* Will handle notification about participant's connectivity status change.
|
|
|
|
*
|
|
|
|
* @param {string} id the id of remote participant(MUC jid)
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.participantConnectionStatusChanged = function(id) {
|
2017-04-03 16:53:04 +00:00
|
|
|
VideoLayout.onParticipantConnectionStatusChanged(id);
|
2016-09-16 20:51:19 +00:00
|
|
|
};
|
|
|
|
|
2017-02-16 21:22:40 +00:00
|
|
|
/**
|
|
|
|
* Prompt user for nickname.
|
|
|
|
*/
|
|
|
|
UI.promptDisplayName = () => {
|
2017-07-28 17:58:04 +00:00
|
|
|
APP.store.dispatch(openDisplayNamePrompt());
|
2017-02-16 21:22:40 +00:00
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Update audio level visualization for specified user.
|
|
|
|
* @param {string} id user id
|
|
|
|
* @param {number} lvl audio level
|
|
|
|
*/
|
2017-03-31 17:54:58 +00:00
|
|
|
UI.setAudioLevel = (id, lvl) => VideoLayout.setAudioLevel(id, lvl);
|
2015-11-30 11:54:54 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Update state of desktop sharing buttons.
|
2017-02-16 23:02:40 +00:00
|
|
|
*
|
|
|
|
* @returns {void}
|
2016-01-15 14:59:35 +00:00
|
|
|
*/
|
2017-02-16 23:02:40 +00:00
|
|
|
UI.updateDesktopSharingButtons
|
|
|
|
= () =>
|
|
|
|
APP.store.dispatch(setToolbarButton('desktop', {
|
|
|
|
toggled: APP.conference.isSharingScreen
|
|
|
|
}));
|
2015-11-30 11:54:54 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Hide connection quality statistics from UI.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.hideStats = function() {
|
2015-11-30 11:54:54 +00:00
|
|
|
VideoLayout.hideStats();
|
2015-07-28 21:52:32 +00:00
|
|
|
};
|
2015-04-22 09:31:08 +00:00
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Mark video as interrupted or not.
|
|
|
|
* @param {boolean} interrupted if video is interrupted
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.markVideoInterrupted = function(interrupted) {
|
2015-12-01 10:05:55 +00:00
|
|
|
if (interrupted) {
|
|
|
|
VideoLayout.onVideoInterrupted();
|
|
|
|
} else {
|
|
|
|
VideoLayout.onVideoRestored();
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Add chat message.
|
|
|
|
* @param {string} from user id
|
|
|
|
* @param {string} displayName user nickname
|
|
|
|
* @param {string} message message text
|
|
|
|
* @param {number} stamp timestamp when message was created
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
// eslint-disable-next-line max-params
|
|
|
|
UI.addMessage = function(from, displayName, message, stamp) {
|
2015-12-04 14:12:57 +00:00
|
|
|
Chat.updateChatConversation(from, displayName, message, stamp);
|
|
|
|
};
|
|
|
|
|
2017-02-16 23:02:40 +00:00
|
|
|
UI.updateDTMFSupport
|
|
|
|
= isDTMFSupported => APP.store.dispatch(showDialPadButton(isDTMFSupported));
|
2015-12-10 11:57:18 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.updateRecordingState = function(state) {
|
2016-03-29 17:13:54 +00:00
|
|
|
Recording.updateRecordingState(state);
|
2015-12-10 15:48:56 +00:00
|
|
|
};
|
2015-12-10 13:30:25 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.notifyTokenAuthFailed = function() {
|
2017-11-03 19:05:03 +00:00
|
|
|
messageHandler.showError({
|
|
|
|
descriptionKey: 'dialog.tokenAuthFailed',
|
|
|
|
titleKey: 'dialog.tokenAuthFailedTitle'
|
|
|
|
});
|
2015-12-17 15:31:11 +00:00
|
|
|
};
|
|
|
|
|
2017-11-03 19:05:03 +00:00
|
|
|
UI.notifyInternalError = function(error) {
|
|
|
|
messageHandler.showError({
|
|
|
|
descriptionArguments: { error },
|
|
|
|
descriptionKey: 'dialog.internalError',
|
|
|
|
titleKey: 'dialog.internalErrorTitle'
|
|
|
|
});
|
2016-01-25 22:39:05 +00:00
|
|
|
};
|
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.notifyFocusDisconnected = function(focus, retrySec) {
|
2017-07-10 03:01:48 +00:00
|
|
|
messageHandler.participantNotification(
|
2017-10-12 23:02:29 +00:00
|
|
|
null, 'notify.focus',
|
|
|
|
'disconnected', 'notify.focusFail',
|
|
|
|
{ component: focus,
|
|
|
|
ms: retrySec }
|
2016-01-25 22:39:05 +00:00
|
|
|
);
|
|
|
|
};
|
|
|
|
|
2016-01-15 14:59:35 +00:00
|
|
|
/**
|
|
|
|
* Updates auth info on the UI.
|
|
|
|
* @param {boolean} isAuthEnabled if authentication is enabled
|
|
|
|
* @param {string} [login] current login
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.updateAuthInfo = function(isAuthEnabled, login) {
|
|
|
|
const showAuth = isAuthEnabled && UIUtil.isAuthenticationEnabled();
|
|
|
|
const loggedIn = Boolean(login);
|
2015-12-18 17:54:15 +00:00
|
|
|
|
2016-11-23 21:24:55 +00:00
|
|
|
Profile.showAuthenticationButtons(showAuth);
|
2015-12-21 11:27:36 +00:00
|
|
|
|
2016-10-12 12:33:07 +00:00
|
|
|
if (showAuth) {
|
2016-11-23 21:24:55 +00:00
|
|
|
Profile.setAuthenticatedIdentity(login);
|
2015-12-18 17:54:15 +00:00
|
|
|
|
2016-11-23 21:24:55 +00:00
|
|
|
Profile.showLoginButton(!loggedIn);
|
|
|
|
Profile.showLogoutButton(loggedIn);
|
2015-12-18 17:54:15 +00:00
|
|
|
}
|
|
|
|
};
|
|
|
|
|
2016-09-16 05:17:27 +00:00
|
|
|
/**
|
|
|
|
* Notifies interested listeners that the raise hand property has changed.
|
|
|
|
*
|
|
|
|
* @param {boolean} isRaisedHand indicates the current state of the
|
|
|
|
* "raised hand"
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.onLocalRaiseHandChanged = function(isRaisedHand) {
|
2016-09-16 15:17:49 +00:00
|
|
|
eventEmitter.emit(UIEvents.LOCAL_RAISE_HAND_CHANGED, isRaisedHand);
|
2016-09-16 05:09:26 +00:00
|
|
|
};
|
|
|
|
|
2016-02-09 10:19:43 +00:00
|
|
|
/**
|
|
|
|
* Update list of available physical devices.
|
|
|
|
* @param {object[]} devices new list of available devices
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.onAvailableDevicesChanged = function(devices) {
|
2017-03-29 17:43:30 +00:00
|
|
|
APP.store.dispatch(updateDeviceList(devices));
|
2017-07-24 13:56:57 +00:00
|
|
|
APP.conference.updateAudioIconEnabled();
|
|
|
|
APP.conference.updateVideoIconEnabled();
|
2016-05-26 08:53:02 +00:00
|
|
|
};
|
|
|
|
|
2016-01-14 19:30:27 +00:00
|
|
|
/**
|
|
|
|
* Returns the id of the current video shown on large.
|
2016-01-15 14:59:35 +00:00
|
|
|
* Currently used by tests (torture).
|
2016-01-14 19:30:27 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.getLargeVideoID = function() {
|
2016-01-14 19:30:27 +00:00
|
|
|
return VideoLayout.getLargeVideoID();
|
|
|
|
};
|
|
|
|
|
2016-03-18 20:00:55 +00:00
|
|
|
/**
|
|
|
|
* Returns the current video shown on large.
|
|
|
|
* Currently used by tests (torture).
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.getLargeVideo = function() {
|
2016-03-18 20:00:55 +00:00
|
|
|
return VideoLayout.getLargeVideo();
|
|
|
|
};
|
|
|
|
|
2017-05-19 00:40:14 +00:00
|
|
|
/**
|
|
|
|
* Returns whether or not the passed in user id is currently pinned to the large
|
|
|
|
* video.
|
|
|
|
*
|
|
|
|
* @param {string} userId - The id of the user to check is pinned or not.
|
|
|
|
* @returns {boolean} True if the user is currently pinned to the large video.
|
|
|
|
*/
|
|
|
|
UI.isPinned = userId => VideoLayout.getPinnedId() === userId;
|
|
|
|
|
2016-01-21 19:28:43 +00:00
|
|
|
/**
|
|
|
|
* Shows dialog with a link to FF extension.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.showExtensionRequiredDialog = function(url) {
|
2016-02-05 15:04:48 +00:00
|
|
|
messageHandler.openMessageDialog(
|
2017-10-12 23:02:29 +00:00
|
|
|
'dialog.extensionRequired',
|
|
|
|
'[html]dialog.firefoxExtensionPrompt',
|
|
|
|
{ url });
|
2016-01-21 19:28:43 +00:00
|
|
|
};
|
2016-01-21 00:17:22 +00:00
|
|
|
|
2016-08-10 19:13:32 +00:00
|
|
|
/**
|
|
|
|
* Shows "Please go to chrome webstore to install the desktop sharing extension"
|
|
|
|
* 2 button dialog with buttons - cancel and go to web store.
|
|
|
|
* @param url {string} the url of the extension.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.showExtensionExternalInstallationDialog = function(url) {
|
2017-06-29 17:43:35 +00:00
|
|
|
let openedWindow = null;
|
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const submitFunction = function(e, v) {
|
2016-10-12 00:08:24 +00:00
|
|
|
if (v) {
|
|
|
|
e.preventDefault();
|
2017-06-29 17:43:35 +00:00
|
|
|
if (openedWindow === null || openedWindow.closed) {
|
|
|
|
openedWindow
|
|
|
|
= window.open(
|
|
|
|
url,
|
2017-10-12 23:02:29 +00:00
|
|
|
'extension_store_window',
|
|
|
|
'resizable,scrollbars=yes,status=1');
|
2017-06-29 17:43:35 +00:00
|
|
|
} else {
|
|
|
|
openedWindow.focus();
|
|
|
|
}
|
2016-08-10 19:13:32 +00:00
|
|
|
}
|
2016-10-12 00:08:24 +00:00
|
|
|
};
|
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const closeFunction = function(e, v) {
|
2017-06-29 17:43:35 +00:00
|
|
|
if (openedWindow) {
|
|
|
|
// Ideally we would close the popup, but this does not seem to work
|
|
|
|
// on Chrome. Leaving it uncommented in case it could work
|
|
|
|
// in some version.
|
|
|
|
openedWindow.close();
|
|
|
|
openedWindow = null;
|
|
|
|
}
|
|
|
|
if (!v) {
|
|
|
|
eventEmitter.emit(UIEvents.EXTERNAL_INSTALLATION_CANCELED);
|
|
|
|
}
|
2016-10-12 00:08:24 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
messageHandler.openTwoButtonDialog({
|
|
|
|
titleKey: 'dialog.externalInstallationTitle',
|
|
|
|
msgKey: 'dialog.externalInstallationMsg',
|
|
|
|
leftButtonKey: 'dialog.goToStore',
|
|
|
|
submitFunction,
|
|
|
|
loadedFunction: $.noop,
|
|
|
|
closeFunction
|
|
|
|
});
|
2017-06-29 17:43:35 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Shows a dialog which asks user to install the extension. This one is
|
|
|
|
* displayed after installation is triggered from the script, but fails because
|
|
|
|
* it must be initiated by user gesture.
|
|
|
|
* @param callback {function} function to be executed after user clicks
|
|
|
|
* the install button - it should make another attempt to install the extension.
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.showExtensionInlineInstallationDialog = function(callback) {
|
|
|
|
const submitFunction = function(e, v) {
|
2017-06-29 17:43:35 +00:00
|
|
|
if (v) {
|
|
|
|
callback();
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const closeFunction = function(e, v) {
|
2017-06-29 17:43:35 +00:00
|
|
|
if (!v) {
|
|
|
|
eventEmitter.emit(UIEvents.EXTERNAL_INSTALLATION_CANCELED);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
messageHandler.openTwoButtonDialog({
|
|
|
|
titleKey: 'dialog.externalInstallationTitle',
|
|
|
|
msgKey: 'dialog.inlineInstallationMsg',
|
|
|
|
leftButtonKey: 'dialog.inlineInstallExtension',
|
|
|
|
submitFunction,
|
|
|
|
loadedFunction: $.noop,
|
|
|
|
closeFunction
|
|
|
|
});
|
2016-08-10 19:13:32 +00:00
|
|
|
};
|
|
|
|
|
2016-05-26 08:53:02 +00:00
|
|
|
/**
|
2017-07-31 18:36:41 +00:00
|
|
|
* Shows a notifications about the passed in microphone error.
|
|
|
|
*
|
|
|
|
* @param {JitsiTrackError} micError - An error object related to using or
|
|
|
|
* acquiring an audio stream.
|
|
|
|
* @returns {void}
|
2016-05-26 08:53:02 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.showMicErrorNotification = function(micError) {
|
2017-07-31 18:36:41 +00:00
|
|
|
if (!micError) {
|
|
|
|
return;
|
2016-05-26 08:53:02 +00:00
|
|
|
}
|
|
|
|
|
2017-07-31 18:36:41 +00:00
|
|
|
const { message, name } = micError;
|
2016-05-27 15:49:26 +00:00
|
|
|
|
2017-07-31 18:36:41 +00:00
|
|
|
const micJitsiTrackErrorMsg
|
|
|
|
= JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP.microphone[name];
|
|
|
|
const micErrorMsg = micJitsiTrackErrorMsg
|
2017-10-10 23:31:40 +00:00
|
|
|
|| JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP
|
|
|
|
.microphone[JitsiTrackErrors.GENERAL];
|
2017-07-31 18:36:41 +00:00
|
|
|
const additionalMicErrorMsg = micJitsiTrackErrorMsg ? null : message;
|
2016-05-27 15:49:26 +00:00
|
|
|
|
2017-11-16 17:25:04 +00:00
|
|
|
APP.store.dispatch(showWarningNotification({
|
|
|
|
description: additionalMicErrorMsg,
|
|
|
|
descriptionKey: micErrorMsg,
|
|
|
|
titleKey: name === JitsiTrackErrors.PERMISSION_DENIED
|
|
|
|
? 'deviceError.microphonePermission'
|
|
|
|
: 'deviceError.microphoneError'
|
|
|
|
}));
|
2017-07-31 18:36:41 +00:00
|
|
|
};
|
2016-05-27 15:49:26 +00:00
|
|
|
|
2017-07-31 18:36:41 +00:00
|
|
|
/**
|
|
|
|
* Shows a notifications about the passed in camera error.
|
|
|
|
*
|
|
|
|
* @param {JitsiTrackError} cameraError - An error object related to using or
|
|
|
|
* acquiring a video stream.
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.showCameraErrorNotification = function(cameraError) {
|
2017-07-31 18:36:41 +00:00
|
|
|
if (!cameraError) {
|
|
|
|
return;
|
|
|
|
}
|
2016-06-17 12:31:25 +00:00
|
|
|
|
2017-07-31 18:36:41 +00:00
|
|
|
const { message, name } = cameraError;
|
2016-05-26 08:53:02 +00:00
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
const cameraJitsiTrackErrorMsg
|
|
|
|
= JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP.camera[name];
|
2017-07-31 18:36:41 +00:00
|
|
|
const cameraErrorMsg = cameraJitsiTrackErrorMsg
|
2017-10-10 23:31:40 +00:00
|
|
|
|| JITSI_TRACK_ERROR_TO_MESSAGE_KEY_MAP
|
|
|
|
.camera[JitsiTrackErrors.GENERAL];
|
2017-07-31 18:36:41 +00:00
|
|
|
const additionalCameraErrorMsg = cameraJitsiTrackErrorMsg ? null : message;
|
2016-05-27 15:49:26 +00:00
|
|
|
|
2017-11-16 17:25:04 +00:00
|
|
|
APP.store.dispatch(showWarningNotification({
|
|
|
|
description: additionalCameraErrorMsg,
|
|
|
|
descriptionKey: cameraErrorMsg,
|
|
|
|
titleKey: name === JitsiTrackErrors.PERMISSION_DENIED
|
|
|
|
? 'deviceError.cameraPermission' : 'deviceError.cameraError'
|
|
|
|
}));
|
2016-05-26 08:53:02 +00:00
|
|
|
};
|
|
|
|
|
2016-09-01 17:57:21 +00:00
|
|
|
/**
|
|
|
|
* Shows error dialog that informs the user that no data is received from the
|
2016-09-13 17:20:08 +00:00
|
|
|
* device.
|
2017-11-03 19:05:03 +00:00
|
|
|
*
|
|
|
|
* @param {boolean} isAudioTrack - Whether or not the dialog is for an audio
|
|
|
|
* track error.
|
|
|
|
* @returns {void}
|
2016-09-01 17:57:21 +00:00
|
|
|
*/
|
2017-11-03 19:05:03 +00:00
|
|
|
UI.showTrackNotWorkingDialog = function(isAudioTrack) {
|
|
|
|
messageHandler.showError({
|
|
|
|
descriptionKey: isAudioTrack
|
|
|
|
? 'dialog.micNotSendingData' : 'dialog.cameraNotSendingData',
|
|
|
|
titleKey: isAudioTrack
|
|
|
|
? 'dialog.micNotSendingDataTitle'
|
|
|
|
: 'dialog.cameraNotSendingDataTitle'
|
|
|
|
});
|
2016-09-01 17:57:21 +00:00
|
|
|
};
|
|
|
|
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.updateDevicesAvailability = function(id, devices) {
|
2016-01-25 22:39:05 +00:00
|
|
|
VideoLayout.setDeviceAvailabilityIcons(id, devices);
|
|
|
|
};
|
|
|
|
|
2016-03-18 20:00:55 +00:00
|
|
|
/**
|
2016-03-24 20:25:26 +00:00
|
|
|
* Show shared video.
|
|
|
|
* @param {string} id the id of the sender of the command
|
|
|
|
* @param {string} url video url
|
|
|
|
* @param {string} attributes
|
2016-03-18 20:00:55 +00:00
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.onSharedVideoStart = function(id, url, attributes) {
|
|
|
|
if (sharedVideoManager) {
|
2016-04-28 16:54:10 +00:00
|
|
|
sharedVideoManager.onSharedVideoStart(id, url, attributes);
|
2017-10-12 23:02:29 +00:00
|
|
|
}
|
2016-03-18 20:00:55 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Update shared video.
|
2016-03-24 20:25:26 +00:00
|
|
|
* @param {string} id the id of the sender of the command
|
2016-03-18 20:00:55 +00:00
|
|
|
* @param {string} url video url
|
|
|
|
* @param {string} attributes
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.onSharedVideoUpdate = function(id, url, attributes) {
|
|
|
|
if (sharedVideoManager) {
|
2016-04-28 16:54:10 +00:00
|
|
|
sharedVideoManager.onSharedVideoUpdate(id, url, attributes);
|
2017-10-12 23:02:29 +00:00
|
|
|
}
|
2016-03-18 20:00:55 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Stop showing shared video.
|
2016-03-24 20:25:26 +00:00
|
|
|
* @param {string} id the id of the sender of the command
|
2016-03-18 20:00:55 +00:00
|
|
|
* @param {string} attributes
|
|
|
|
*/
|
2017-10-12 23:02:29 +00:00
|
|
|
UI.onSharedVideoStop = function(id, attributes) {
|
|
|
|
if (sharedVideoManager) {
|
2016-04-28 16:54:10 +00:00
|
|
|
sharedVideoManager.onSharedVideoStop(id, attributes);
|
2017-10-12 23:02:29 +00:00
|
|
|
}
|
2016-03-18 20:00:55 +00:00
|
|
|
};
|
|
|
|
|
2017-01-06 01:18:07 +00:00
|
|
|
/**
|
|
|
|
* Handles user's features changes.
|
|
|
|
*/
|
2017-02-15 21:39:16 +00:00
|
|
|
UI.onUserFeaturesChanged = user => VideoLayout.onUserFeaturesChanged(user);
|
|
|
|
|
2017-05-19 00:40:14 +00:00
|
|
|
/**
|
|
|
|
* Returns the number of known remote videos.
|
|
|
|
*
|
|
|
|
* @returns {number} The number of remote videos.
|
|
|
|
*/
|
|
|
|
UI.getRemoteVideosCount = () => VideoLayout.getRemoteVideosCount();
|
|
|
|
|
2017-08-17 16:43:22 +00:00
|
|
|
/**
|
|
|
|
* Sets the remote control active status for a remote participant.
|
|
|
|
*
|
|
|
|
* @param {string} participantID - The id of the remote participant.
|
|
|
|
* @param {boolean} isActive - The new remote control active status.
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
|
|
|
UI.setRemoteControlActiveStatus = function(participantID, isActive) {
|
|
|
|
VideoLayout.setRemoteControlActiveStatus(participantID, isActive);
|
|
|
|
};
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Sets the remote control active status for the local participant.
|
|
|
|
*
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
|
|
|
UI.setLocalRemoteControlActiveChanged = function() {
|
|
|
|
VideoLayout.setLocalRemoteControlActiveChanged();
|
|
|
|
};
|
|
|
|
|
2017-06-14 18:13:41 +00:00
|
|
|
// TODO: Export every function separately. For now there is no point of doing
|
|
|
|
// this because we are importing everything.
|
|
|
|
export default UI;
|