Creates keyboard shortcuts module.

app.js

@@ -18,6 +18,8 @@ $(document).ready(function () {
     
     // Set default desktop sharing method
     desktopsharing.init();
+
+    keyboardshortcut.init();
 });
 
 $(window).bind('beforeunload', function () {

index.html

@@ -27,17 +27,17 @@
     <script src="service/desktopsharing/DesktopSharingEventTypes.js?v=1"></script>
     <script src="libs/modules/simulcast.bundle.js?v=5"></script>
     <script src="libs/modules/connectionquality.bundle.js?v=2"></script>
-    <script src="libs/modules/UI.bundle.js?v=9"></script>
+    <script src="libs/modules/UI.bundle.js?v=10"></script>
     <script src="libs/modules/statistics.bundle.js?v=4"></script>
     <script src="libs/modules/RTC.bundle.js?v=6"></script>
     <script src="libs/modules/desktopsharing.bundle.js?v=3"></script><!-- desktop sharing -->
     <script src="util.js?v=7"></script><!-- utility functions -->
     <script src="libs/modules/xmpp.bundle.js?v=5"></script>
-    <script src="app.js?v=29"></script><!-- application logic -->
+    <script src="libs/modules/keyboardshortcut.bundle.js?v=1"></script>
+    <script src="app.js?v=30"></script><!-- application logic -->
     <script src="libs/modules/API.bundle.js?v=1"></script>
 
     <script src="analytics.js?v=1"></script><!-- google analytics plugin -->
-    <script src="keyboard_shortcut.js?v=5"></script>
     <link rel="stylesheet" href="css/font.css?v=6"/>
     <link rel="stylesheet" href="css/toastr.css?v=1">
     <link rel="stylesheet" type="text/css" media="screen" href="css/main.css?v=30"/>

keyboard_shortcut.js

@@ -1,79 +0,0 @@
-var KeyboardShortcut = (function(my) {
-    //maps keycode to character, id of popover for given function and function
-    var shortcuts = {
-        67: {
-            character: "C",
-            id: "toggleChatPopover",
-            function: UI.toggleChat
-        },
-        70: {
-            character: "F",
-            id: "filmstripPopover",
-            function: UI.toggleFilmStrip
-        },
-        77: {
-            character: "M",
-            id: "mutePopover",
-            function: UI.toggleAudio
-        },
-        84: {
-            character: "T",
-            function: function() {
-                if(!RTC.localAudio.isMuted()) {
-                    UI.toggleAudio();
-                }
-            }
-        },
-        86: {
-            character: "V",
-            id: "toggleVideoPopover",
-            function: UI.toggleVideo
-        }
-    };
-
-    window.onkeyup = function(e) {
-        var keycode = e.which;
-        if(!($(":focus").is("input[type=text]") || $(":focus").is("input[type=password]") || $(":focus").is("textarea"))) {
-            if (typeof shortcuts[keycode] === "object") {
-                shortcuts[keycode].function();
-            } else if (keycode >= "0".charCodeAt(0) && keycode <= "9".charCodeAt(0)) {
-                var remoteVideos = $(".videocontainer:not(#mixedstream)"),
-                    videoWanted = keycode - "0".charCodeAt(0) + 1;
-                if (remoteVideos.length > videoWanted) {
-                    remoteVideos[videoWanted].click();
-                }
-            }
-          //esc while the smileys are visible hides them
-        } else if (keycode === 27 && $('#smileysContainer').is(':visible')) {
-            UI.toggleSmileys();
-        }
-    };
-
-    window.onkeydown = function(e) {
-        if(!($(":focus").is("input[type=text]") || $(":focus").is("input[type=password]") || $(":focus").is("textarea"))) {
-            if(e.which === "T".charCodeAt(0)) {
-                if(RTC.localAudio.isMuted()) {
-                    UI.toggleAudio();
-                }
-            }
-        }
-    };
-    
-    /**
-     *  
-     * @param id indicates the popover associated with the shortcut
-     * @returns {string} the keyboard shortcut used for the id given
-     */
-    my.getShortcut = function(id) {
-        for(var keycode in shortcuts) {
-            if(shortcuts.hasOwnProperty(keycode)) {
-                if (shortcuts[keycode].id === id) {
-                    return " (" + shortcuts[keycode].character + ")";
-                }
-            }
-        }
-        return "";
-    };
-    return my;
-}(KeyboardShortcut || {}))
-

libs/modules/UI.bundle.js

@@ -202,7 +202,7 @@ UI.start = function () {
         trigger: 'click hover',
         content: function() {
             return this.getAttribute("content") +
-                KeyboardShortcut.getShortcut(this.getAttribute("shortcut"));
+                keyboardshortcut.getShortcut(this.getAttribute("shortcut"));
         }
     });
     VideoLayout.resizeLargeVideoContainer();
@@ -692,6 +692,13 @@ UI.addListener = function (type, listener) {
     eventEmitter.on(type, listener);
 }
 
+UI.clickOnVideo = function (videoNumber) {
+    var remoteVideos = $(".videocontainer:not(#mixedstream)");
+    if (remoteVideos.length > videoNumber) {
+        remoteVideos[videoNumber].click();
+    }
+}
+
 module.exports = UI;
 
 

libs/modules/keyboardshortcut.bundle.js

@@ -0,0 +1,87 @@
+!function(e){if("object"==typeof exports&&"undefined"!=typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var o;"undefined"!=typeof window?o=window:"undefined"!=typeof global?o=global:"undefined"!=typeof self&&(o=self),o.keyboardshortcut=e()}}(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+//maps keycode to character, id of popover for given function and function
+var shortcuts = {
+    67: {
+        character: "C",
+        id: "toggleChatPopover",
+        function: UI.toggleChat
+    },
+    70: {
+        character: "F",
+        id: "filmstripPopover",
+        function: UI.toggleFilmStrip
+    },
+    77: {
+        character: "M",
+        id: "mutePopover",
+        function: UI.toggleAudio
+    },
+    84: {
+        character: "T",
+        function: function() {
+            if(!RTC.localAudio.isMuted()) {
+                UI.toggleAudio();
+            }
+        }
+    },
+    86: {
+        character: "V",
+        id: "toggleVideoPopover",
+        function: UI.toggleVideo
+    }
+};
+
+
+var KeyboardShortcut = {
+    init: function () {
+        window.onkeyup = function(e) {
+            var keycode = e.which;
+            if(!($(":focus").is("input[type=text]") ||
+                $(":focus").is("input[type=password]") ||
+                $(":focus").is("textarea"))) {
+                if (typeof shortcuts[keycode] === "object") {
+                    shortcuts[keycode].function();
+                }
+                else if (keycode >= "0".charCodeAt(0) &&
+                    keycode <= "9".charCodeAt(0)) {
+                    UI.clickOnVideo(keycode - "0".charCodeAt(0) + 1);
+                }
+                //esc while the smileys are visible hides them
+            } else if (keycode === 27 && $('#smileysContainer').is(':visible')) {
+                UI.toggleSmileys();
+            }
+        };
+
+        window.onkeydown = function(e) {
+            if(!($(":focus").is("input[type=text]") ||
+                $(":focus").is("input[type=password]") ||
+                $(":focus").is("textarea"))) {
+                if(e.which === "T".charCodeAt(0)) {
+                    if(RTC.localAudio.isMuted()) {
+                        UI.toggleAudio();
+                    }
+                }
+            }
+        };
+    },
+    /**
+     *
+     * @param id indicates the popover associated with the shortcut
+     * @returns {string} the keyboard shortcut used for the id given
+     */
+    getShortcut: function (id) {
+        for (var keycode in shortcuts) {
+            if (shortcuts.hasOwnProperty(keycode)) {
+                if (shortcuts[keycode].id === id) {
+                    return " (" + shortcuts[keycode].character + ")";
+                }
+            }
+        }
+        return "";
+    }
+};
+
+module.exports = KeyboardShortcut;
+
+},{}]},{},[1])(1)
+});

modules/UI/UI.js

@@ -201,7 +201,7 @@ UI.start = function () {
         trigger: 'click hover',
         content: function() {
             return this.getAttribute("content") +
-                KeyboardShortcut.getShortcut(this.getAttribute("shortcut"));
+                keyboardshortcut.getShortcut(this.getAttribute("shortcut"));
         }
     });
     VideoLayout.resizeLargeVideoContainer();
@@ -691,5 +691,12 @@ UI.addListener = function (type, listener) {
     eventEmitter.on(type, listener);
 }
 
+UI.clickOnVideo = function (videoNumber) {
+    var remoteVideos = $(".videocontainer:not(#mixedstream)");
+    if (remoteVideos.length > videoNumber) {
+        remoteVideos[videoNumber].click();
+    }
+}
+
 module.exports = UI;
 

modules/keyboardshortcut/keyboardshortcut.js

@@ -0,0 +1,83 @@
+//maps keycode to character, id of popover for given function and function
+var shortcuts = {
+    67: {
+        character: "C",
+        id: "toggleChatPopover",
+        function: UI.toggleChat
+    },
+    70: {
+        character: "F",
+        id: "filmstripPopover",
+        function: UI.toggleFilmStrip
+    },
+    77: {
+        character: "M",
+        id: "mutePopover",
+        function: UI.toggleAudio
+    },
+    84: {
+        character: "T",
+        function: function() {
+            if(!RTC.localAudio.isMuted()) {
+                UI.toggleAudio();
+            }
+        }
+    },
+    86: {
+        character: "V",
+        id: "toggleVideoPopover",
+        function: UI.toggleVideo
+    }
+};
+
+
+var KeyboardShortcut = {
+    init: function () {
+        window.onkeyup = function(e) {
+            var keycode = e.which;
+            if(!($(":focus").is("input[type=text]") ||
+                $(":focus").is("input[type=password]") ||
+                $(":focus").is("textarea"))) {
+                if (typeof shortcuts[keycode] === "object") {
+                    shortcuts[keycode].function();
+                }
+                else if (keycode >= "0".charCodeAt(0) &&
+                    keycode <= "9".charCodeAt(0)) {
+                    UI.clickOnVideo(keycode - "0".charCodeAt(0) + 1);
+                }
+                //esc while the smileys are visible hides them
+            } else if (keycode === 27 && $('#smileysContainer').is(':visible')) {
+                UI.toggleSmileys();
+            }
+        };
+
+        window.onkeydown = function(e) {
+            if(!($(":focus").is("input[type=text]") ||
+                $(":focus").is("input[type=password]") ||
+                $(":focus").is("textarea"))) {
+                if(e.which === "T".charCodeAt(0)) {
+                    if(RTC.localAudio.isMuted()) {
+                        UI.toggleAudio();
+                    }
+                }
+            }
+        };
+    },
+    /**
+     *
+     * @param id indicates the popover associated with the shortcut
+     * @returns {string} the keyboard shortcut used for the id given
+     */
+    getShortcut: function (id) {
+        for (var keycode in shortcuts) {
+            if (shortcuts.hasOwnProperty(keycode)) {
+                if (shortcuts[keycode].id === id) {
+                    return " (" + shortcuts[keycode].character + ")";
+                }
+            }
+        }
+        return "";
+    }
+};
+
+module.exports = KeyboardShortcut;