浏览代码

Refactor shared video manager

j8
yanas 9 年前
父节点
当前提交
c2f46a5cfe
共有 3 个文件被更改,包括 60 次插入57 次删除
  1. 4
    4
      conference.js
  2. 6
    6
      modules/UI/UI.js
  3. 50
    47
      modules/UI/shared_video/SharedVideo.js

+ 4
- 4
conference.js 查看文件

762
             console.log('USER %s LEFT', id, user);
762
             console.log('USER %s LEFT', id, user);
763
             APP.API.notifyUserLeft(id);
763
             APP.API.notifyUserLeft(id);
764
             APP.UI.removeUser(id, user.getDisplayName());
764
             APP.UI.removeUser(id, user.getDisplayName());
765
-            APP.UI.stopSharedVideo(id);
765
+            APP.UI.onSharedVideoStop(id);
766
         });
766
         });
767
 
767
 
768
 
768
 
1130
             this.commands.defaults.SHARED_VIDEO, ({value, attributes}, id) => {
1130
             this.commands.defaults.SHARED_VIDEO, ({value, attributes}, id) => {
1131
 
1131
 
1132
                 if (attributes.state === 'stop') {
1132
                 if (attributes.state === 'stop') {
1133
-                    APP.UI.stopSharedVideo(id, attributes);
1133
+                    APP.UI.onSharedVideoStop(id, attributes);
1134
                 }
1134
                 }
1135
                 else if (attributes.state === 'start') {
1135
                 else if (attributes.state === 'start') {
1136
-                    APP.UI.showSharedVideo(id, value, attributes);
1136
+                    APP.UI.onSharedVideoStart(id, value, attributes);
1137
                 }
1137
                 }
1138
                 else if (attributes.state === 'playing'
1138
                 else if (attributes.state === 'playing'
1139
                     || attributes.state === 'pause') {
1139
                     || attributes.state === 'pause') {
1140
-                    APP.UI.updateSharedVideo(id, value, attributes);
1140
+                    APP.UI.onSharedVideoUpdate(id, value, attributes);
1141
                 }
1141
                 }
1142
             });
1142
             });
1143
     },
1143
     },

+ 6
- 6
modules/UI/UI.js 查看文件

1116
  * @param {string} url video url
1116
  * @param {string} url video url
1117
  * @param {string} attributes
1117
  * @param {string} attributes
1118
 */
1118
 */
1119
-UI.showSharedVideo = function (id, url, attributes) {
1119
+UI.onSharedVideoStart = function (id, url, attributes) {
1120
     if (sharedVideoManager)
1120
     if (sharedVideoManager)
1121
-        sharedVideoManager.showSharedVideo(id, url, attributes);
1121
+        sharedVideoManager.onSharedVideoStart(id, url, attributes);
1122
 };
1122
 };
1123
 
1123
 
1124
 /**
1124
 /**
1127
  * @param {string} url video url
1127
  * @param {string} url video url
1128
  * @param {string} attributes
1128
  * @param {string} attributes
1129
  */
1129
  */
1130
-UI.updateSharedVideo = function (id, url, attributes) {
1130
+UI.onSharedVideoUpdate = function (id, url, attributes) {
1131
     if (sharedVideoManager)
1131
     if (sharedVideoManager)
1132
-        sharedVideoManager.updateSharedVideo(id, url, attributes);
1132
+        sharedVideoManager.onSharedVideoUpdate(id, url, attributes);
1133
 };
1133
 };
1134
 
1134
 
1135
 /**
1135
 /**
1137
  * @param {string} id the id of the sender of the command
1137
  * @param {string} id the id of the sender of the command
1138
  * @param {string} attributes
1138
  * @param {string} attributes
1139
  */
1139
  */
1140
-UI.stopSharedVideo = function (id, attributes) {
1140
+UI.onSharedVideoStop = function (id, attributes) {
1141
     if (sharedVideoManager)
1141
     if (sharedVideoManager)
1142
-        sharedVideoManager.stopSharedVideo(id, attributes);
1142
+        sharedVideoManager.onSharedVideoStop(id, attributes);
1143
 };
1143
 };
1144
 
1144
 
1145
 module.exports = UI;
1145
 module.exports = UI;

+ 50
- 47
modules/UI/shared_video/SharedVideo.js 查看文件

79
     }
79
     }
80
 
80
 
81
     /**
81
     /**
82
-     * Shows the player component and starts the checking function
83
-     * that will be sending updates, if we are the one shared the video
82
+     * Shows the player component and starts the process that will be sending
83
+     * updates, if we are the one shared the video.
84
+     *
84
      * @param id the id of the sender of the command
85
      * @param id the id of the sender of the command
85
      * @param url the video url
86
      * @param url the video url
86
      * @param attributes
87
      * @param attributes
87
      */
88
      */
88
-    showSharedVideo (id, url, attributes) {
89
+    onSharedVideoStart (id, url, attributes) {
89
         if (this.isSharedVideoShown)
90
         if (this.isSharedVideoShown)
90
             return;
91
             return;
91
 
92
 
153
                 }
154
                 }
154
             };
155
             };
155
 
156
 
157
+        /**
158
+         * Indicates that a change in state has occurred for the shared video.
159
+         * @param event the event notifying us of the change
160
+         */
156
         window.onPlayerStateChange = function(event) {
161
         window.onPlayerStateChange = function(event) {
157
             if (event.data == YT.PlayerState.PLAYING) {
162
             if (event.data == YT.PlayerState.PLAYING) {
158
 
163
 
160
 
165
 
161
                 if(self.initialAttributes)
166
                 if(self.initialAttributes)
162
                 {
167
                 {
163
-                    self.processAttributes(
168
+                    // If a network update has occurred already now is the
169
+                    // time to process it.
170
+                    self.processVideoUpdate(
164
                         self.player,
171
                         self.player,
165
-                        self.initialAttributes,
166
-                        false);
172
+                        self.initialAttributes);
167
 
173
 
168
                     self.initialAttributes = null;
174
                     self.initialAttributes = null;
169
                 }
175
                 }
170
-                self.smartMute();
171
-                self.updateCheck();
176
+                self.smartAudioMute();
172
             } else if (event.data == YT.PlayerState.PAUSED) {
177
             } else if (event.data == YT.PlayerState.PAUSED) {
173
-                self.smartUnmute();
174
-                self.updateCheck(true);
178
+                self.smartAudioUnmute();
175
             }
179
             }
180
+            self.fireSharedVideoEvent(event.data == YT.PlayerState.PAUSED);
176
         };
181
         };
177
 
182
 
178
         /**
183
         /**
182
         window.onVideoProgress = function (event) {
187
         window.onVideoProgress = function (event) {
183
             let state = event.target.getPlayerState();
188
             let state = event.target.getPlayerState();
184
             if (state == YT.PlayerState.PAUSED) {
189
             if (state == YT.PlayerState.PAUSED) {
185
-                self.updateCheck(true);
190
+                self.fireSharedVideoEvent(true);
186
             }
191
             }
187
         };
192
         };
188
 
193
 
191
          * @param event
196
          * @param event
192
          */
197
          */
193
         window.onVolumeChange = function (event) {
198
         window.onVolumeChange = function (event) {
194
-            self.updateCheck();
199
+            self.fireSharedVideoEvent();
195
 
200
 
196
             // let's check, if player is not muted lets mute locally
201
             // let's check, if player is not muted lets mute locally
197
             if(event.data.volume > 0 && !event.data.muted) {
202
             if(event.data.volume > 0 && !event.data.muted) {
198
-                self.smartMute();
203
+                self.smartAudioMute();
199
             }
204
             }
200
             else if (event.data.volume <=0 || event.data.muted) {
205
             else if (event.data.volume <=0 || event.data.muted) {
201
-                self.smartUnmute();
206
+                self.smartAudioUnmute();
202
             }
207
             }
203
         };
208
         };
204
 
209
 
230
             // we need to continuously send the player current time position
235
             // we need to continuously send the player current time position
231
             if(APP.conference.isLocalId(self.from)) {
236
             if(APP.conference.isLocalId(self.from)) {
232
                 self.intervalId = setInterval(
237
                 self.intervalId = setInterval(
233
-                    self.updateCheck.bind(self),
238
+                    self.fireSharedVideoEvent.bind(self),
234
                     updateInterval);
239
                     updateInterval);
235
             }
240
             }
236
         };
241
         };
246
      * Process attributes, whether player needs to be paused or seek.
251
      * Process attributes, whether player needs to be paused or seek.
247
      * @param player the player to operate over
252
      * @param player the player to operate over
248
      * @param attributes the attributes with the player state we want
253
      * @param attributes the attributes with the player state we want
249
-     * @param playerPaused current saved state for the player
250
      */
254
      */
251
-    processAttributes (player, attributes, playerPaused)
255
+    processVideoUpdate (player, attributes)
252
     {
256
     {
253
         if(!attributes)
257
         if(!attributes)
254
             return;
258
             return;
255
 
259
 
256
         if (attributes.state == 'playing') {
260
         if (attributes.state == 'playing') {
257
 
261
 
258
-            this.processTime(player, attributes, playerPaused);
262
+            let isPlayerPaused
263
+                = (this.player.getPlayerState() === YT.PlayerState.PAUSED);
259
 
264
 
260
-            let isAttrMuted = (attributes.muted === "true");
265
+            // If our player is currently paused force the seek.
266
+            this.processTime(player, attributes, isPlayerPaused);
261
 
267
 
262
-            // Process player unmute
263
-            if (player.isMuted() && !isAttrMuted) {
264
-                console.log("Process player unmute and smart mike mute.");
265
-                this.mutePlayer(false);
266
-            }
267
-            // Process player mute
268
-            else if (!player.isMuted() && isAttrMuted) {
269
-                console.log("Process player mute and smart mike unmute.");
270
-                this.mutePlayer(true);
268
+            // Process mute.
269
+            let isAttrMuted = (attributes.muted === "true");
270
+            if (player.isMuted() !== isAttrMuted) {
271
+                this.smartPlayerMute(isAttrMuted, true);
271
             }
272
             }
272
 
273
 
273
             // Process volume
274
             // Process volume
280
                 this.showSharedVideoMutedPopup(false);
281
                 this.showSharedVideoMutedPopup(false);
281
             }
282
             }
282
 
283
 
283
-            if (playerPaused)
284
+            if (isPlayerPaused)
284
                 player.playVideo();
285
                 player.playVideo();
285
 
286
 
286
         } else if (attributes.state == 'pause') {
287
         } else if (attributes.state == 'pause') {
288
             player.pauseVideo();
289
             player.pauseVideo();
289
 
290
 
290
             this.processTime(player, attributes, true);
291
             this.processTime(player, attributes, true);
291
-        } else if (attributes.state == 'stop') {
292
-            this.stopSharedVideo(this.from);
293
         }
292
         }
294
     }
293
     }
295
 
294
 
323
     /**
322
     /**
324
      * Checks current state of the player and fire an event with the values.
323
      * Checks current state of the player and fire an event with the values.
325
      */
324
      */
326
-    updateCheck(sendPauseEvent)
325
+    fireSharedVideoEvent(sendPauseEvent)
327
     {
326
     {
328
         // ignore update checks if we are not the owner of the video
327
         // ignore update checks if we are not the owner of the video
329
         // or there is still no player defined or we are stopped
328
         // or there is still no player defined or we are stopped
356
      * @param url the video url
355
      * @param url the video url
357
      * @param attributes
356
      * @param attributes
358
      */
357
      */
359
-    updateSharedVideo (id, url, attributes) {
358
+    onSharedVideoUpdate (id, url, attributes) {
360
         // if we are sending the event ignore
359
         // if we are sending the event ignore
361
         if(APP.conference.isLocalId(this.from)) {
360
         if(APP.conference.isLocalId(this.from)) {
362
             return;
361
             return;
363
         }
362
         }
364
 
363
 
365
         if(!this.isSharedVideoShown) {
364
         if(!this.isSharedVideoShown) {
366
-            this.showSharedVideo(id, url, attributes);
365
+            this.onSharedVideoStart(id, url, attributes);
367
             return;
366
             return;
368
         }
367
         }
369
 
368
 
370
         if(!this.player)
369
         if(!this.player)
371
             this.initialAttributes = attributes;
370
             this.initialAttributes = attributes;
372
         else {
371
         else {
373
-            this.processAttributes(this.player, attributes,
374
-                (this.player.getPlayerState() === YT.PlayerState.PAUSED));
372
+            this.processVideoUpdate(this.player, attributes);
375
         }
373
         }
376
     }
374
     }
377
 
375
 
381
      * left and we want to remove video if the user sharing it left).
379
      * left and we want to remove video if the user sharing it left).
382
      * @param id the id of the sender of the command
380
      * @param id the id of the sender of the command
383
      */
381
      */
384
-    stopSharedVideo (id, attributes) {
382
+    onSharedVideoStop (id, attributes) {
385
         if (!this.isSharedVideoShown)
383
         if (!this.isSharedVideoShown)
386
             return;
384
             return;
387
 
385
 
421
                     this.errorInPlayer.destroy();
419
                     this.errorInPlayer.destroy();
422
                     this.errorInPlayer = null;
420
                     this.errorInPlayer = null;
423
                 }
421
                 }
424
-                this.smartUnmute();
422
+                this.smartAudioUnmute();
425
                 // revert to original behavior (prevents pausing
423
                 // revert to original behavior (prevents pausing
426
                 // for participants not sharing the video to pause it)
424
                 // for participants not sharing the video to pause it)
427
                 $("#sharedVideo").css("pointer-events","auto");
425
                 $("#sharedVideo").css("pointer-events","auto");
446
             this.mutedWithUserInteraction = userInteraction;
444
             this.mutedWithUserInteraction = userInteraction;
447
         }
445
         }
448
         else if (this.player.getPlayerState() !== YT.PlayerState.PAUSED) {
446
         else if (this.player.getPlayerState() !== YT.PlayerState.PAUSED) {
449
-            this.mutePlayer(true);
447
+            this.smartPlayerMute(true, false);
448
+            // Check if we need to update other participants
449
+            this.fireSharedVideoEvent();
450
+
450
         }
451
         }
451
     }
452
     }
452
 
453
 
453
     /**
454
     /**
454
      * Mutes / unmutes the player.
455
      * Mutes / unmutes the player.
455
      * @param mute true to mute the shared video, false - otherwise.
456
      * @param mute true to mute the shared video, false - otherwise.
457
+     * @param {boolean} Indicates if this mute is a consequence of a network
458
+     * video update or is called locally.
456
      */
459
      */
457
-    mutePlayer(mute) {
460
+    smartPlayerMute(mute, isVideoUpdate) {
458
         if (!this.player.isMuted() && mute) {
461
         if (!this.player.isMuted() && mute) {
459
             this.player.mute();
462
             this.player.mute();
460
-            this.smartUnmute();
463
+
464
+            if (isVideoUpdate)
465
+                this.smartAudioUnmute();
461
         }
466
         }
462
         else if (this.player.isMuted() && !mute) {
467
         else if (this.player.isMuted() && !mute) {
463
             this.player.unMute();
468
             this.player.unMute();
464
-            this.smartMute();
469
+            if (isVideoUpdate)
470
+                this.smartAudioMute();
465
         }
471
         }
466
 
472
 
467
-        // Check if we need to update other participants
468
-        this.updateCheck();
469
-
470
         this.showSharedVideoMutedPopup(mute);
473
         this.showSharedVideoMutedPopup(mute);
471
     }
474
     }
472
 
475
 
475
      * by the user via the mike button and the volume of the shared video is on
478
      * by the user via the mike button and the volume of the shared video is on
476
      * we're unmuting the mike automatically.
479
      * we're unmuting the mike automatically.
477
      */
480
      */
478
-    smartUnmute() {
481
+    smartAudioUnmute() {
479
         if (APP.conference.isLocalAudioMuted()
482
         if (APP.conference.isLocalAudioMuted()
480
             && !this.mutedWithUserInteraction
483
             && !this.mutedWithUserInteraction
481
             && !this.isSharedVideoVolumeOn()) {
484
             && !this.isSharedVideoVolumeOn()) {
489
      * Smart mike mute. If the mike isn't currently muted and the shared video
492
      * Smart mike mute. If the mike isn't currently muted and the shared video
490
      * volume is on we mute the mike.
493
      * volume is on we mute the mike.
491
      */
494
      */
492
-    smartMute() {
495
+    smartAudioMute() {
493
         if (!APP.conference.isLocalAudioMuted()
496
         if (!APP.conference.isLocalAudioMuted()
494
             && this.isSharedVideoVolumeOn()) {
497
             && this.isSharedVideoVolumeOn()) {
495
 
498
 

正在加载...
取消
保存