diff --git a/app/lib/RoomClient.js b/app/lib/RoomClient.js
index bed1425..7ac80e3 100644
--- a/app/lib/RoomClient.js
+++ b/app/lib/RoomClient.js
@@ -178,11 +178,11 @@ export default class RoomClient
});
}
- changeProfilePicture(picture)
+ changeProfilePicture(picture)
{
logger.debug('changeProfilePicture() [picture: "%s"]', picture);
- this._protoo.send('change-profile-picture', { picture }).catch((error) =>
+ this._protoo.send('change-profile-picture', { picture }).catch((error) =>
{
logger.error('shareProfilePicure() | failed: %o', error);
});
@@ -913,11 +913,6 @@ export default class RoomClient
{
this._dispatch(
stateActions.setMyRaiseHandState(state));
-
- this._dispatch(requestActions.notify(
- {
- text : 'raiseHand state changed'
- }));
this._dispatch(
stateActions.setMyRaiseHandStateInProgress(false));
})
@@ -1806,10 +1801,11 @@ export default class RoomClient
this._dispatch(stateActions.addPeer(
{
- name : peer.name,
- displayName : displayName,
- device : peer.appData.device,
- consumers : []
+ name : peer.name,
+ displayName : displayName,
+ device : peer.appData.device,
+ raiseHandState : peer.appData.raiseHandState,
+ consumers : []
}));
if (notify)
diff --git a/app/lib/components/ParticipantList/ListPeer.jsx b/app/lib/components/ParticipantList/ListPeer.jsx
index 8308f79..fec2269 100644
--- a/app/lib/components/ParticipantList/ListPeer.jsx
+++ b/app/lib/components/ParticipantList/ListPeer.jsx
@@ -47,6 +47,20 @@ const ListPeer = (props) =>
{peer.displayName}
+
+ {peer.raiseHandState ?
+
+ :null
+ }
+
{ screenConsumer ?
.indicators {
+ left: 0;
+ top: 0;
+ display: flex;
+ flex-direction:; row;
+ justify-content: flex-start;
+ align-items: center;
+ padding: 0.4vmin;
+ transition: opacity 0.3s;
+ > .icon {
+ flex: 0 0 auto;
+ margin: 0.2vmin;
+ border-radius: 2px;
+ background-position: center;
+ background-size: 75%;
+ background-repeat: no-repeat;
+ background-color: rgba(#000, 0.5);
+ transition-property: opacity, background-color;
+ transition-duration: 0.15s;
+
+ +desktop() {
+ width: 24px;
+ height: 24px;
+ opacity: 0.85;
+
+ &:hover {
+ opacity: 1;
+ }
+ }
+
+ +mobile() {
+ width: 22px;
+ height: 22px;
+ }
+
+ &.on {
+ opacity: 1;
+ }
+
+ &.off {
+ opacity: 0.2;
+ }
+
+ &.raise-hand {
+ background-image: url('/resources/images/icon-hand-white.svg');
+ }
+ }
+ }
> .controls {
float: right;
display: flex;
@@ -124,4 +172,4 @@
flex-grow: 1;
align-items: center;
}
-}
\ No newline at end of file
+}
diff --git a/app/stylus/components/Peer.styl b/app/stylus/components/Peer.styl
index fcff116..8afedd3 100644
--- a/app/stylus/components/Peer.styl
+++ b/app/stylus/components/Peer.styl
@@ -34,7 +34,6 @@
}
> .indicators {
position: absolute;
- z-index: 200;
left: 0;
top: 0;
display: flex;
@@ -43,6 +42,7 @@
align-items: center;
padding: 0.4vmin;
transition: opacity 0.3s;
+ z-index: 10;
> .icon {
flex: 0 0 auto;
@@ -52,7 +52,6 @@
background-size: 75%;
background-repeat: no-repeat;
background-color: rgba(#000, 0.5);
- cursor: pointer;
transition-property: opacity, background-color;
transition-duration: 0.15s;
diff --git a/server/lib/Room.js b/server/lib/Room.js
index 096f055..9b312fe 100644
--- a/server/lib/Room.js
+++ b/server/lib/Room.js
@@ -279,7 +279,7 @@ class Room extends EventEmitter
const { raiseHandState } = request.data;
const { mediaPeer } = protooPeer.data;
- mediaPeer.appData.raiseHand = request.data.raiseHandState;
+ mediaPeer.appData.raiseHandState = request.data.raiseHandState;
// Spread to others via protoo.
this._protooRoom.spread(
'raisehand-message',