From 1853fa6fae26424486348088748407af993655ac Mon Sep 17 00:00:00 2001 From: yanas Date: Fri, 16 Sep 2016 00:09:26 -0500 Subject: [PATCH 1/4] Adds raise hand toggle state. --- conference.js | 2 ++ css/_toolbars.scss | 4 ++++ css/_variables.scss | 1 + modules/UI/UI.js | 4 ++++ modules/UI/toolbars/Toolbar.js | 12 ++++++++++++ service/UI/UIEvents.js | 5 +++++ 6 files changed, 28 insertions(+) diff --git a/conference.js b/conference.js index c586953f1..4d3eece68 100644 --- a/conference.js +++ b/conference.js @@ -1648,6 +1648,8 @@ export default { setRaisedHand(raisedHand) { if (raisedHand !== this.isHandRaised) { + APP.UI.onRaiseHandChanged(raisedHand); + this.isHandRaised = raisedHand; // Advertise the updated status room.setLocalParticipantProperty("raisedHand", raisedHand); diff --git a/css/_toolbars.scss b/css/_toolbars.scss index 2e1675533..23489bb73 100644 --- a/css/_toolbars.scss +++ b/css/_toolbars.scss @@ -118,6 +118,10 @@ cursor: default; } +.button.toggled { + color: $toolbarButtonToggled; +} + a.button.unclickable:hover, a.button.unclickable:active, a.button.unclickable.selected{ diff --git a/css/_variables.scss b/css/_variables.scss index a2f3f9416..71b8145dd 100644 --- a/css/_variables.scss +++ b/css/_variables.scss @@ -25,6 +25,7 @@ $defaultBackground: #474747; // Toolbar $toolbarSelectBackground: rgba(0, 0, 0, .6); +$toolbarButtonToggled: #0091EA; // Main controls $inputBackground: rgba(132, 132, 132, .5); diff --git a/modules/UI/UI.js b/modules/UI/UI.js index a79d3d7d9..082c9e828 100644 --- a/modules/UI/UI.js +++ b/modules/UI/UI.js @@ -1211,6 +1211,10 @@ UI.onStartMutedChanged = function (startAudioMuted, startVideoMuted) { SettingsMenu.updateStartMutedBox(startAudioMuted, startVideoMuted); }; +UI.onRaiseHandChanged = function (isRaiseHand) { + eventEmitter.emit(UIEvents.RAISE_HAND_CHANGED, isRaiseHand); +}; + /** * Update list of available physical devices. * @param {object[]} devices new list of available devices diff --git a/modules/UI/toolbars/Toolbar.js b/modules/UI/toolbars/Toolbar.js index 258e787a7..344bacb51 100644 --- a/modules/UI/toolbars/Toolbar.js +++ b/modules/UI/toolbars/Toolbar.js @@ -400,6 +400,11 @@ const Toolbar = { isVisible); }); + APP.UI.addListener(UIEvents.RAISE_HAND_CHANGED, + function(isRaisedHand) { + Toolbar._toggleRaiseHand(isRaisedHand); + }); + if(!APP.tokenData.isGuest) { $("#toolbar_button_profile").addClass("unclickable"); } @@ -565,6 +570,13 @@ const Toolbar = { } }, + /** + * Toggles / untoggles the view for raised hand. + */ + _toggleRaiseHand(isRaisedHand) { + $('#toolbar_button_raisehand').toggleClass("toggled", isRaisedHand); + }, + /** * Marks video icon as muted or not. * @param {boolean} muted if icon should look like muted or not diff --git a/service/UI/UIEvents.js b/service/UI/UIEvents.js index fbe5679bb..7d5c95d4b 100644 --- a/service/UI/UIEvents.js +++ b/service/UI/UIEvents.js @@ -107,6 +107,11 @@ export default { */ SIDE_TOOLBAR_CONTAINER_TOGGLED: "UI.side_container_toggled", + /** + * Notifies that the raise hand has been changed. + */ + RAISE_HAND_CHANGED: "UI.raise_hand_changed", + /** * Notifies that the avatar is displayed or not on the largeVideo. */ From a1635ccc689f7f34c20b772fb46269a4d5b34160 Mon Sep 17 00:00:00 2001 From: yanas Date: Fri, 16 Sep 2016 00:17:27 -0500 Subject: [PATCH 2/4] Adds javadoc --- modules/UI/UI.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/modules/UI/UI.js b/modules/UI/UI.js index 082c9e828..44b5af156 100644 --- a/modules/UI/UI.js +++ b/modules/UI/UI.js @@ -1211,8 +1211,14 @@ UI.onStartMutedChanged = function (startAudioMuted, startVideoMuted) { SettingsMenu.updateStartMutedBox(startAudioMuted, startVideoMuted); }; -UI.onRaiseHandChanged = function (isRaiseHand) { - eventEmitter.emit(UIEvents.RAISE_HAND_CHANGED, isRaiseHand); +/** + * Notifies interested listeners that the raise hand property has changed. + * + * @param {boolean} isRaisedHand indicates the current state of the + * "raised hand" + */ +UI.onRaiseHandChanged = function (isRaisedHand) { + eventEmitter.emit(UIEvents.RAISE_HAND_CHANGED, isRaisedHand); }; /** From bd4643043467c545e93c255991c5d4773506686d Mon Sep 17 00:00:00 2001 From: yanas Date: Fri, 16 Sep 2016 00:19:59 -0500 Subject: [PATCH 3/4] Small color change --- css/_variables.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/css/_variables.scss b/css/_variables.scss index 71b8145dd..47f5c3171 100644 --- a/css/_variables.scss +++ b/css/_variables.scss @@ -25,7 +25,7 @@ $defaultBackground: #474747; // Toolbar $toolbarSelectBackground: rgba(0, 0, 0, .6); -$toolbarButtonToggled: #0091EA; +$toolbarButtonToggled: #44A5FF; // Main controls $inputBackground: rgba(132, 132, 132, .5); From 8b7bdb4957a23bfe548804184e88f63f68759d83 Mon Sep 17 00:00:00 2001 From: yanas Date: Fri, 16 Sep 2016 10:17:49 -0500 Subject: [PATCH 4/4] Changes the raise hand event name to fit better the action --- conference.js | 2 +- modules/UI/UI.js | 4 ++-- modules/UI/toolbars/Toolbar.js | 2 +- service/UI/UIEvents.js | 2 +- 4 files changed, 5 insertions(+), 5 deletions(-) diff --git a/conference.js b/conference.js index 4d3eece68..500e7368a 100644 --- a/conference.js +++ b/conference.js @@ -1648,7 +1648,7 @@ export default { setRaisedHand(raisedHand) { if (raisedHand !== this.isHandRaised) { - APP.UI.onRaiseHandChanged(raisedHand); + APP.UI.onLocalRaiseHandChanged(raisedHand); this.isHandRaised = raisedHand; // Advertise the updated status diff --git a/modules/UI/UI.js b/modules/UI/UI.js index 44b5af156..25da99633 100644 --- a/modules/UI/UI.js +++ b/modules/UI/UI.js @@ -1217,8 +1217,8 @@ UI.onStartMutedChanged = function (startAudioMuted, startVideoMuted) { * @param {boolean} isRaisedHand indicates the current state of the * "raised hand" */ -UI.onRaiseHandChanged = function (isRaisedHand) { - eventEmitter.emit(UIEvents.RAISE_HAND_CHANGED, isRaisedHand); +UI.onLocalRaiseHandChanged = function (isRaisedHand) { + eventEmitter.emit(UIEvents.LOCAL_RAISE_HAND_CHANGED, isRaisedHand); }; /** diff --git a/modules/UI/toolbars/Toolbar.js b/modules/UI/toolbars/Toolbar.js index 344bacb51..f7576cf52 100644 --- a/modules/UI/toolbars/Toolbar.js +++ b/modules/UI/toolbars/Toolbar.js @@ -400,7 +400,7 @@ const Toolbar = { isVisible); }); - APP.UI.addListener(UIEvents.RAISE_HAND_CHANGED, + APP.UI.addListener(UIEvents.LOCAL_RAISE_HAND_CHANGED, function(isRaisedHand) { Toolbar._toggleRaiseHand(isRaisedHand); }); diff --git a/service/UI/UIEvents.js b/service/UI/UIEvents.js index 7d5c95d4b..c1ffa54a6 100644 --- a/service/UI/UIEvents.js +++ b/service/UI/UIEvents.js @@ -110,7 +110,7 @@ export default { /** * Notifies that the raise hand has been changed. */ - RAISE_HAND_CHANGED: "UI.raise_hand_changed", + LOCAL_RAISE_HAND_CHANGED: "UI.local_raise_hand_changed", /** * Notifies that the avatar is displayed or not on the largeVideo.