Removes document bind events between modules.

index.html

@@ -28,9 +28,9 @@
     <script src="service/UI/UIEvents.js?v=1"></script>
     <script src="service/desktopsharing/DesktopSharingEventTypes.js?v=1"></script>
     <script src="libs/modules/connectionquality.bundle.js?v=3"></script>
-    <script src="libs/modules/UI.bundle.js?v=13"></script>
+    <script src="libs/modules/UI.bundle.js?v=14"></script>
     <script src="libs/modules/statistics.bundle.js?v=5"></script>
-    <script src="libs/modules/RTC.bundle.js?v=8"></script>
+    <script src="libs/modules/RTC.bundle.js?v=9"></script>
     <script src="libs/modules/simulcast.bundle.js?v=6"></script>
     <script src="libs/modules/desktopsharing.bundle.js?v=3"></script><!-- desktop sharing -->
     <script src="libs/modules/xmpp.bundle.js?v=8"></script>

libs/modules/RTC.bundle.js

@@ -178,9 +178,11 @@ var DataChannels =
          var msgData = event.data;
          console.info("Got My Data Channel Message:", msgData, dataChannel);
          };*/
-    }
+    },
+    handleSelectedEndpointEvent: onSelectedEndpointChanged,
+    handlePinnedEndpointEvent: onPinnedEndpointChanged
 
-}
+};
 
 function onSelectedEndpointChanged(userResource)
 {
@@ -203,10 +205,6 @@ function onSelectedEndpointChanged(userResource)
     }
 }
 
-$(document).bind("selectedendpointchanged", function(event, userResource) {
-    onSelectedEndpointChanged(userResource);
-});
-
 function onPinnedEndpointChanged(userResource)
 {
     console.log('pinned endpoint changed: ', userResource);
@@ -228,10 +226,6 @@ function onPinnedEndpointChanged(userResource)
     }
 }
 
-$(document).bind("pinnedendpointchanged", function(event, userResource) {
-    onPinnedEndpointChanged(userResource);
-});
-
 module.exports = DataChannels;
 
 
@@ -513,6 +507,10 @@ var RTC = {
         xmpp.addListener(XMPPEvents.CALL_INCOMING, function(event) {
             DataChannels.init(event.peerconnection, eventEmitter);
         });
+        UI.addListener(UIEvents.SELECTED_ENDPOINT,
+            DataChannels.handleSelectedEndpointEvent);
+        UI.addListener(UIEvents.PINNED_ENDPOINT,
+            DataChannels.handlePinnedEndpointEvent);
         this.rtcUtils = new RTCUtils(this);
         this.rtcUtils.obtainAudioAndVideoPermissions();
     },

libs/modules/UI.bundle.js

@@ -97,7 +97,7 @@ function registerListeners() {
         function (endpointSimulcastLayers) {
             VideoLayout.onSimulcastLayersChanging(endpointSimulcastLayers);
         });
-    VideoLayout.init();
+    VideoLayout.init(eventEmitter);
 
     statistics.addAudioLevelListener(function(jid, audioLevel)
     {
@@ -4806,6 +4806,9 @@ var largeVideoState = {
     updateInProgress: false,
     newSrc: ''
 };
+
+var eventEmitter = null;
+
 /**
  * Currently focused video "src"(displayed in large video).
  * @type {String}
@@ -5284,7 +5287,7 @@ var VideoLayout = (function (my) {
     my.getVideoSize = getCameraVideoSize;
     my.getVideoPosition = getCameraVideoPosition;
 
-    my.init = function () {
+    my.init = function (emitter) {
         // Listen for large video size updates
         document.getElementById('largeVideo')
             .addEventListener('loadedmetadata', function (e) {
@@ -5292,6 +5295,7 @@ var VideoLayout = (function (my) {
                 currentVideoHeight = this.videoHeight;
                 VideoLayout.positionLarge(currentVideoWidth, currentVideoHeight);
             });
+        eventEmitter = emitter;
     };
 
     my.isInLastN = function(resource) {
@@ -5518,7 +5522,8 @@ var VideoLayout = (function (my) {
                 userChanged = true;
                 // we want the notification to trigger even if userJid is undefined,
                 // or null.
-                $(document).trigger("selectedendpointchanged", [largeVideoState.userResourceJid]);
+                eventEmitter.emit(UIEvents.SELECTED_ENDPOINT,
+                    largeVideoState.userResourceJid);
             }
 
             if (!largeVideoState.updateInProgress) {
@@ -5662,7 +5667,7 @@ var VideoLayout = (function (my) {
             }
 
             if (!noPinnedEndpointChangedEvent) {
-                $(document).trigger("pinnedendpointchanged");
+                eventEmitter.emit(UIEvents.PINNED_ENDPOINT);
             }
             return;
         }
@@ -5680,7 +5685,7 @@ var VideoLayout = (function (my) {
             container.addClass("videoContainerFocused");
 
             if (!noPinnedEndpointChangedEvent) {
-                $(document).trigger("pinnedendpointchanged", [resourceJid]);
+                eventEmitter.emit(UIEvents.PINNED_ENDPOINT, resourceJid);
             }
         }
 
@@ -6481,7 +6486,8 @@ var VideoLayout = (function (my) {
                     // picked up later by the lastN changed event handler.
 
                     lastNPickupJid = jid;
-                    $(document).trigger("pinnedendpointchanged", [Strophe.getResourceFromJid(jid)]);
+                    eventEmitter.emit(UIEvents.PINNED_ENDPOINT,
+                        Strophe.getResourceFromJid(jid));
                 }
             } else if (jid == xmpp.myJid()) {
                 $("#localVideoContainer").click();
@@ -6778,8 +6784,6 @@ var VideoLayout = (function (my) {
 
                 console.info([esl, primarySSRC, msid, sid, electedStream]);
 
-                var msidParts = msid.split(' ');
-
                 var preload = (Strophe.getResourceFromJid(xmpp.getJidFromSSRC(primarySSRC)) == largeVideoState.userResourceJid);
 
                 if (preload) {

modules/RTC/DataChannels.js

@@ -177,9 +177,11 @@ var DataChannels =
          var msgData = event.data;
          console.info("Got My Data Channel Message:", msgData, dataChannel);
          };*/
-    }
+    },
+    handleSelectedEndpointEvent: onSelectedEndpointChanged,
+    handlePinnedEndpointEvent: onPinnedEndpointChanged
 
-}
+};
 
 function onSelectedEndpointChanged(userResource)
 {
@@ -202,10 +204,6 @@ function onSelectedEndpointChanged(userResource)
     }
 }
 
-$(document).bind("selectedendpointchanged", function(event, userResource) {
-    onSelectedEndpointChanged(userResource);
-});
-
 function onPinnedEndpointChanged(userResource)
 {
     console.log('pinned endpoint changed: ', userResource);
@@ -227,9 +225,5 @@ function onPinnedEndpointChanged(userResource)
     }
 }
 
-$(document).bind("pinnedendpointchanged", function(event, userResource) {
-    onPinnedEndpointChanged(userResource);
-});
-
 module.exports = DataChannels;
 

modules/RTC/RTC.js

@@ -126,6 +126,10 @@ var RTC = {
         xmpp.addListener(XMPPEvents.CALL_INCOMING, function(event) {
             DataChannels.init(event.peerconnection, eventEmitter);
         });
+        UI.addListener(UIEvents.SELECTED_ENDPOINT,
+            DataChannels.handleSelectedEndpointEvent);
+        UI.addListener(UIEvents.PINNED_ENDPOINT,
+            DataChannels.handlePinnedEndpointEvent);
         this.rtcUtils = new RTCUtils(this);
         this.rtcUtils.obtainAudioAndVideoPermissions();
     },

modules/UI/UI.js

@@ -96,7 +96,7 @@ function registerListeners() {
         function (endpointSimulcastLayers) {
             VideoLayout.onSimulcastLayersChanging(endpointSimulcastLayers);
         });
-    VideoLayout.init();
+    VideoLayout.init(eventEmitter);
 
     statistics.addAudioLevelListener(function(jid, audioLevel)
     {

modules/UI/videolayout/VideoLayout.js

@@ -16,6 +16,9 @@ var largeVideoState = {
     updateInProgress: false,
     newSrc: ''
 };
+
+var eventEmitter = null;
+
 /**
  * Currently focused video "src"(displayed in large video).
  * @type {String}
@@ -494,7 +497,7 @@ var VideoLayout = (function (my) {
     my.getVideoSize = getCameraVideoSize;
     my.getVideoPosition = getCameraVideoPosition;
 
-    my.init = function () {
+    my.init = function (emitter) {
         // Listen for large video size updates
         document.getElementById('largeVideo')
             .addEventListener('loadedmetadata', function (e) {
@@ -502,6 +505,7 @@ var VideoLayout = (function (my) {
                 currentVideoHeight = this.videoHeight;
                 VideoLayout.positionLarge(currentVideoWidth, currentVideoHeight);
             });
+        eventEmitter = emitter;
     };
 
     my.isInLastN = function(resource) {
@@ -728,7 +732,8 @@ var VideoLayout = (function (my) {
                 userChanged = true;
                 // we want the notification to trigger even if userJid is undefined,
                 // or null.
-                $(document).trigger("selectedendpointchanged", [largeVideoState.userResourceJid]);
+                eventEmitter.emit(UIEvents.SELECTED_ENDPOINT,
+                    largeVideoState.userResourceJid);
             }
 
             if (!largeVideoState.updateInProgress) {
@@ -872,7 +877,7 @@ var VideoLayout = (function (my) {
             }
 
             if (!noPinnedEndpointChangedEvent) {
-                $(document).trigger("pinnedendpointchanged");
+                eventEmitter.emit(UIEvents.PINNED_ENDPOINT);
             }
             return;
         }
@@ -890,7 +895,7 @@ var VideoLayout = (function (my) {
             container.addClass("videoContainerFocused");
 
             if (!noPinnedEndpointChangedEvent) {
-                $(document).trigger("pinnedendpointchanged", [resourceJid]);
+                eventEmitter.emit(UIEvents.PINNED_ENDPOINT, resourceJid);
             }
         }
 
@@ -1509,6 +1514,8 @@ var VideoLayout = (function (my) {
 
         $('.userAvatar').css('left', (width - height) / 2);
 
+
+
         $(document).trigger("remotevideo.resized", [width, height]);
     };
 
@@ -1691,7 +1698,8 @@ var VideoLayout = (function (my) {
                     // picked up later by the lastN changed event handler.
 
                     lastNPickupJid = jid;
-                    $(document).trigger("pinnedendpointchanged", [Strophe.getResourceFromJid(jid)]);
+                    eventEmitter.emit(UIEvents.PINNED_ENDPOINT,
+                        Strophe.getResourceFromJid(jid));
                 }
             } else if (jid == xmpp.myJid()) {
                 $("#localVideoContainer").click();

service/UI/UIEvents.js

@@ -1,4 +1,6 @@
 var UIEvents = {
-    NICKNAME_CHANGED: "UI.nickname_changed"
+    NICKNAME_CHANGED: "UI.nickname_changed",
+    SELECTED_ENDPOINT: "UI.selected_endpoint",
+    PINNED_ENDPOINT: "UI.pinned_endpoint"
 };
 //module.exports = UIEvents;