Преглед изворни кода

fix(VideoLayout): "connection interrupted" shown only on video

The message about having connectivity issues should be displayed only
on top of the video like the "video problems filter" is.
j8
paweldomas пре 9 година
родитељ
комит
419950ca49
2 измењених фајлова са 53 додато и 15 уклоњено
  1. 48
    0
      modules/UI/videolayout/LargeVideoManager.js
  2. 5
    15
      modules/UI/videolayout/VideoLayout.js

+ 48
- 0
modules/UI/videolayout/LargeVideoManager.js Прегледај датотеку

81
         container.onHoverOut(e);
81
         container.onHoverOut(e);
82
     }
82
     }
83
 
83
 
84
+    /**
85
+     * Called when the media connection has been interrupted.
86
+     */
87
+    onVideoInterrupted () {
88
+        this.enableVideoProblemFilter(true);
89
+        let reconnectingKey = "connection.RECONNECTING";
90
+        $('#videoConnectionMessage')
91
+            .attr("data-i18n", reconnectingKey)
92
+            .text(APP.translation.translateString(reconnectingKey));
93
+        // Show the message only if the video is currently being displayed
94
+        this.showVideoConnectionMessage(this.state === VIDEO_CONTAINER_TYPE);
95
+    }
96
+
97
+    /**
98
+     * Called when the media connection has been restored.
99
+     */
100
+    onVideoRestored () {
101
+        this.enableVideoProblemFilter(false);
102
+        this.showVideoConnectionMessage(false);
103
+    }
104
+
84
     get id () {
105
     get id () {
85
         let container = this.getContainer(this.state);
106
         let container = this.getContainer(this.state);
86
         return container.id;
107
         return container.id;
231
         $('.watermark').css('visibility', show ? 'visible' : 'hidden');
252
         $('.watermark').css('visibility', show ? 'visible' : 'hidden');
232
     }
253
     }
233
 
254
 
255
+    /**
256
+     * Shows/hides the "video connection message".
257
+     * @param {boolean|null} show(optional) tells whether the message is to be
258
+     * displayed or not. If missing the condition will be based on the value
259
+     * obtained from {@link APP.conference.isConnectionInterrupted}.
260
+     */
261
+    showVideoConnectionMessage (show) {
262
+        if (typeof show !== 'boolean') {
263
+            show = APP.conference.isConnectionInterrupted();
264
+        }
265
+
266
+        if (show) {
267
+            $('#videoConnectionMessage').css({display: "block"});
268
+        } else {
269
+            $('#videoConnectionMessage').css({display: "none"});
270
+        }
271
+    }
272
+
234
     /**
273
     /**
235
      * Add container of specified type.
274
      * Add container of specified type.
236
      * @param {string} type container type
275
      * @param {string} type container type
284
         }
323
         }
285
 
324
 
286
         let oldContainer = this.containers[this.state];
325
         let oldContainer = this.containers[this.state];
326
+        // FIXME when video is being replaced with other content we need to hide
327
+        // companion icons/messages. It would be best if the container would
328
+        // be taking care of it by itself, but that is a bigger refactoring
287
         if (this.state === VIDEO_CONTAINER_TYPE) {
329
         if (this.state === VIDEO_CONTAINER_TYPE) {
288
             this.showWatermark(false);
330
             this.showWatermark(false);
331
+            this.showVideoConnectionMessage(false);
289
         }
332
         }
290
         oldContainer.hide();
333
         oldContainer.hide();
291
 
334
 
294
 
337
 
295
         return container.show().then(() => {
338
         return container.show().then(() => {
296
             if (type === VIDEO_CONTAINER_TYPE) {
339
             if (type === VIDEO_CONTAINER_TYPE) {
340
+                // FIXME when video appears on top of other content we need to
341
+                // show companion icons/messages. It would be best if
342
+                // the container would be taking care of it by itself, but that
343
+                // is a bigger refactoring
297
                 this.showWatermark(true);
344
                 this.showWatermark(true);
345
+                this.showVideoConnectionMessage(/* fetch the current state */);
298
             }
346
             }
299
         });
347
         });
300
     }
348
     }

+ 5
- 15
modules/UI/videolayout/VideoLayout.js Прегледај датотеку

950
      * Indicates that the video has been interrupted.
950
      * Indicates that the video has been interrupted.
951
      */
951
      */
952
     onVideoInterrupted () {
952
     onVideoInterrupted () {
953
-        this.enableVideoProblemFilter(true);
954
-        let reconnectingKey = "connection.RECONNECTING";
955
-        $('#videoConnectionMessage')
956
-            .attr("data-i18n", reconnectingKey)
957
-            .text(APP.translation.translateString(reconnectingKey))
958
-            .css({display: "block"});
953
+        if (largeVideo) {
954
+            largeVideo.onVideoInterrupted();
955
+        }
959
     },
956
     },
960
 
957
 
961
     /**
958
     /**
962
      * Indicates that the video has been restored.
959
      * Indicates that the video has been restored.
963
      */
960
      */
964
     onVideoRestored () {
961
     onVideoRestored () {
965
-        this.enableVideoProblemFilter(false);
966
-        $('#videoConnectionMessage').css({display: "none"});
967
-    },
968
-
969
-    enableVideoProblemFilter (enable) {
970
-        if (!largeVideo) {
971
-            return;
962
+        if (largeVideo) {
963
+            largeVideo.onVideoRestored();
972
         }
964
         }
973
-
974
-        largeVideo.enableVideoProblemFilter(enable);
975
     },
965
     },
976
 
966
 
977
     isLargeVideoVisible () {
967
     isLargeVideoVisible () {

Loading…
Откажи
Сачувај