haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor BottomToolbar

This commit is contained in:
isymchych 2015-12-10 18:36:03 +02:00
parent cf578b7732
commit e23dd62d86
5 changed files with 76 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
modules/UI/UI.js
View File

@ -188,10 +188,6 @@ function registerListeners() {
AudioLevels.init();
});
UI.addListener(UIEvents.FILM_STRIP_TOGGLED, function (isToggled) {
VideoLayout.onFilmStripToggled(isToggled);
});
UI.addListener(UIEvents.EMAIL_CHANGED, function (email) {
UI.setUserAvatar(APP.conference.localId, email);
});
@ -215,6 +211,10 @@ function registerListeners() {
UI.addListener(UIEvents.TOGGLE_SETTINGS, function () {
PanelToggler.toggleSettingsMenu();
});
UI.addListener(UIEvents.TOGGLE_CONTACT_LIST, UI.toggleContactList);
UI.addListener(UIEvents.TOGGLE_FILM_STRIP, UI.toggleFilmStrip);
}
function bindEvents() {
@ -446,14 +446,15 @@ UI.getSettings = function () {
UI.toggleFilmStrip = function () {
BottomToolbar.toggleFilmStrip();
VideoLayout.updateLargeVideoSize();
};
UI.toggleChat = function () {
BottomToolbar.toggleChat();
PanelToggler.toggleChat();
};
UI.toggleContactList = function () {
BottomToolbar.toggleContactList();
PanelToggler.toggleContactList();
};
UI.inputDisplayNameHandler = function (value) {

92
modules/UI/toolbars/BottomToolbar.js
View File

@ -1,66 +1,48 @@
/* global $ */
var PanelToggler = require("../side_pannels/SidePanelToggler");
var UIUtil = require("../util/UIUtil");
var AnalyticsAdapter = require("../../statistics/AnalyticsAdapter");
var UIEvents = require("../../../service/UI/UIEvents");
import UIUtil from '../util/UIUtil';
import UIEvents from '../../../service/UI/UIEvents';
import AnalyticsAdapter from '../../statistics/AnalyticsAdapter';
var eventEmitter = null;
var buttonHandlers = {
"bottom_toolbar_contact_list": function () {
AnalyticsAdapter.sendEvent('bottomtoolbar.contacts.toggled');
BottomToolbar.toggleContactList();
},
"bottom_toolbar_film_strip": function () {
AnalyticsAdapter.sendEvent('bottomtoolbar.filmstrip.toggled');
BottomToolbar.toggleFilmStrip();
},
"bottom_toolbar_chat": function () {
AnalyticsAdapter.sendEvent('bottomtoolbar.chat.toggled');
BottomToolbar.toggleChat();
}
};
var defaultBottomToolbarButtons = {
'chat': '#bottom_toolbar_chat',
'contacts': '#bottom_toolbar_contact_list',
const defaultBottomToolbarButtons = {
'chat': '#bottom_toolbar_chat',
'contacts': '#bottom_toolbar_contact_list',
'filmstrip': '#bottom_toolbar_film_strip'
};
$(document).bind("remotevideo.resized", function (event, width, height) {
let toolbar = $('#bottomToolbar');
let bottom = (height - toolbar.outerHeight())/2 + 18;
var BottomToolbar = (function (my) {
my.init = function (emitter) {
eventEmitter = emitter;
toolbar.css({bottom});
});
const BottomToolbar = {
init (emitter) {
UIUtil.hideDisabledButtons(defaultBottomToolbarButtons);
for(var k in buttonHandlers)
$("#" + k).click(buttonHandlers[k]);
};
const buttonHandlers = {
"bottom_toolbar_contact_list": function () {
AnalyticsAdapter.sendEvent('bottomtoolbar.contacts.toggled');
emitter.emit(UIEvents.TOGGLE_CONTACT_LIST);
},
"bottom_toolbar_film_strip": function () {
AnalyticsAdapter.sendEvent('bottomtoolbar.filmstrip.toggled');
emitter.emit(UIEvents.TOGGLE_FILM_STRIP);
},
"bottom_toolbar_chat": function () {
AnalyticsAdapter.sendEvent('bottomtoolbar.chat.toggled');
emitter.emit(UIEvents.TOGGLE_CHAT);
}
};
my.toggleChat = function() {
PanelToggler.toggleChat();
};
Object.keys(buttonHandlers).forEach(
buttonId => $(`#${buttonId}`).click(buttonHandlers[buttonId])
);
},
my.toggleContactList = function() {
PanelToggler.toggleContactList();
};
toggleFilmStrip () {
$("#remoteVideos").toggleClass("hidden");
}
};
my.toggleFilmStrip = function() {
var filmstrip = $("#remoteVideos");
filmstrip.toggleClass("hidden");
eventEmitter.emit( UIEvents.FILM_STRIP_TOGGLED,
filmstrip.hasClass("hidden"));
};
$(document).bind("remotevideo.resized", function (event, width, height) {
var bottom = (height - $('#bottomToolbar').outerHeight())/2 + 18;
$('#bottomToolbar').css({bottom: bottom + 'px'});
});
return my;
}(BottomToolbar || {}));
module.exports = BottomToolbar;
export default BottomToolbar;

52
modules/UI/toolbars/Toolbar.js
View File

@ -1,20 +1,20 @@
/* global APP, $, config, interfaceConfig */
/* jshint -W101 */
var messageHandler = require("../util/MessageHandler");
var UIUtil = require("../util/UIUtil");
var AnalyticsAdapter = require("../../statistics/AnalyticsAdapter");
var UIEvents = require("../../../service/UI/UIEvents");
import messageHandler from '../util/MessageHandler';
import UIUtil from '../util/UIUtil';
import AnalyticsAdapter from '../../statistics/AnalyticsAdapter';
import UIEvents from '../../../service/UI/UIEvents';
var roomUrl = null;
var recordingToaster = null;
var emitter = null;
let roomUrl = null;
let recordingToaster = null;
let emitter = null;
/**
* Opens the invite link dialog.
*/
function openLinkDialog () {
var inviteAttributes;
let inviteAttributes;
if (roomUrl === null) {
inviteAttributes = 'data-i18n="[value]roomUrlDefaultMsg" value="' +
@ -181,18 +181,18 @@ const buttonHandlers = {
);
}
};
var defaultToolbarButtons = {
'microphone': '#toolbar_button_mute',
'camera': '#toolbar_button_camera',
'desktop': '#toolbar_button_desktopsharing',
'security': '#toolbar_button_security',
'invite': '#toolbar_button_link',
'chat': '#toolbar_button_chat',
'prezi': '#toolbar_button_prezi',
'etherpad': '#toolbar_button_etherpad',
'fullscreen': '#toolbar_button_fullScreen',
'settings': '#toolbar_button_settings',
'hangup': '#toolbar_button_hangup'
const defaultToolbarButtons = {
'microphone': '#toolbar_button_mute',
'camera': '#toolbar_button_camera',
'desktop': '#toolbar_button_desktopsharing',
'security': '#toolbar_button_security',
'invite': '#toolbar_button_link',
'chat': '#toolbar_button_chat',
'prezi': '#toolbar_button_prezi',
'etherpad': '#toolbar_button_etherpad',
'fullscreen': '#toolbar_button_fullScreen',
'settings': '#toolbar_button_settings',
'hangup': '#toolbar_button_hangup'
};
function dialpadButtonClicked() {
@ -222,10 +222,12 @@ function showSipNumberInput () {
const Toolbar = {
init (eventEmitter) {
emitter = eventEmitter;
UIUtil.hideDisabledButtons(defaultToolbarButtons);
for(var k in buttonHandlers)
$("#" + k).click(buttonHandlers[k]);
Object.keys(buttonHandlers).forEach(
buttonId => $(`#${buttonId}`).click(buttonHandlers[buttonId])
);
},
/**
@ -235,7 +237,7 @@ const Toolbar = {
roomUrl = newRoomUrl;
// If the invite dialog has been already opened we update the information.
var inviteLink = document.getElementById('inviteLinkRef');
let inviteLink = document.getElementById('inviteLinkRef');
if (inviteLink) {
inviteLink.value = roomUrl;
inviteLink.select();
@ -333,7 +335,7 @@ const Toolbar = {
*/
setAuthenticatedIdentity (authIdentity) {
if (authIdentity) {
var selector = $('#toolbar_auth_identity');
let selector = $('#toolbar_auth_identity');
selector.css({display: "list-item"});
selector.text(authIdentity);
} else {
@ -371,7 +373,7 @@ const Toolbar = {
* @param active the state of the desktop streaming.
*/
changeDesktopSharingButtonState (active) {
var button = $("#toolbar_button_desktopsharing");
let button = $("#toolbar_button_desktopsharing");
if (active) {
button.addClass("glow");
} else {

7
modules/UI/videolayout/VideoLayout.js
View File

@ -900,12 +900,9 @@ var VideoLayout = (function (my) {
};
/**
* Updates the video size and position when the film strip is toggled.
*
* @param isToggled indicates if the film strip is toggled or not. True
* would mean that the film strip is hidden, false would mean it's shown
* Updates the video size and position.
*/
my.onFilmStripToggled = function(isToggled) {
my.updateLargeVideoSize = function () {
LargeVideo.updateVideoSizeAndPosition();
LargeVideo.position(null, null, null, null, true);
};

9
service/UI/UIEvents.js
View File

@ -29,12 +29,9 @@ export default {
AUTH_CLICKED: "UI.auth_clicked",
TOGGLE_CHAT: "UI.toggle_chat",
TOGGLE_SETTINGS: "UI.toggle_settings",
TOGGLE_CONTACT_LIST: "UI.toggle_contact_list",
TOGGLE_FILM_STRIP: "UI.toggle_film_strip",
HANGUP: "UI.hangup",
LOGOUT: "UI.logout",
RECORDING_TOGGLE: "UI.recording_toggle",
/**
* Notifies interested parties when the film strip (remote video's panel)
* is hidden (toggled) or shown (un-toggled).
*/
FILM_STRIP_TOGGLED: "UI.filmstrip_toggled"
RECORDING_TOGGLE: "UI.recording_toggle"
};