do not use xmpp module in Toolbar

app.js

@@ -67,6 +67,7 @@ const APP = {
             membersCount: 0,
             audioMuted: false,
             videoMuted: false,
+            sipGatewayEnabled: false, //FIXME handle
             isLocalId (id) {
                 return this.localId === id;
             },
@@ -363,6 +364,57 @@ function initConference(localTracks, connection) {
         );
     });
 
+    // call hangup
+    APP.UI.addListener(UIEvents.HANGUP, function () {
+        APP.UI.requestFeedback().then(function () {
+            connection.disconnect();
+
+            if (config.enableWelcomePage) {
+                setTimeout(function() {
+                    window.localStorage.welcomePageDisabled = false;
+                    window.location.pathname = "/";
+                }, 3000);
+            }
+        });
+    });
+
+    // logout
+    APP.UI.addListener(UIEvents.LOGOUT, function () {
+        // FIXME handle logout
+        // APP.xmpp.logout(function (url) {
+        //     if (url) {
+        //         window.location.href = url;
+        //     } else {
+        //         hangup();
+        //     }
+        // });
+    });
+
+    APP.UI.addListener(UIEvents.SIP_DIAL, function (sipNumber) {
+        // FIXME add dial
+        // APP.xmpp.dial(
+        //     sipNumber,
+        //     'fromnumber',
+        //     APP.conference.roomName,
+        //     roomLocker.password
+        // );
+    });
+
+
+    // Starts or stops the recording for the conference.
+    APP.UI.addListener(UIEvents.RECORDING_TOGGLE, function (predefinedToken) {
+        // FIXME recording
+        // APP.xmpp.toggleRecording(function (callback) {
+        //     if (predefinedToken) {
+        //         callback(predefinedToken);
+        //         return;
+        //     }
+
+        //     APP.UI.requestRecordingToken().then(callback);
+
+        // }, APP.UI.updateRecordingState);
+    });
+
     room.on(ConferenceEvents.DTMF_SUPPORT_CHANGED, function (isDTMFSupported) {
         APP.UI.updateDTMFSupport(isDTMFSupported);
     });

modules/UI/UI.js

@@ -32,27 +32,26 @@ var eventEmitter = new EventEmitter();
 UI.eventEmitter = eventEmitter;
 
 function promptDisplayName() {
-    var message = '<h2 data-i18n="dialog.displayNameRequired">';
+    let nickRequiredMsg = APP.translation.translateString("dialog.displayNameRequired");
-    message += APP.translation.translateString(
+    let defaultNickMsg = APP.translation.translateString(
-        "dialog.displayNameRequired");
+        "defaultNickname", {name: "Jane Pink"}
-    message += '</h2>' +
+    );
-        '<input name="displayName" type="text" data-i18n=' +
+    let message = `
-        '"[placeholder]defaultNickname" placeholder="' +
+        <h2 data-i18n="dialog.displayNameRequired">${nickRequiredMsg}</h2>
-        APP.translation.translateString(
+        <input name="displayName" type="text"
-            "defaultNickname", {name: "Jane Pink"}) +
+               data-i18n="[placeholder]defaultNickname"
-        '" autofocus>';
+               placeholder="${defaultNickMsg}" autofocus>`;
 
-    var buttonTxt
+    let buttonTxt = APP.translation.generateTranslationHTML("dialog.Ok");
-        = APP.translation.generateTranslationHTML("dialog.Ok");
+    let buttons = [{title: buttonTxt, value: "ok"}];
-    var buttons = [];
-    buttons.push({title: buttonTxt, value: "ok"});
 
-    messageHandler.openDialog(null, message,
+    messageHandler.openDialog(
+        null, message,
         true,
         buttons,
         function (e, v, m, f) {
             if (v == "ok") {
-                var displayName = f.displayName;
+                let displayName = f.displayName;
                 if (displayName) {
                     UI.inputDisplayNameHandler(displayName);
                     return true;
@@ -61,16 +60,17 @@ function promptDisplayName() {
             e.preventDefault();
         },
         function () {
-            var form  = $.prompt.getPrompt();
+            let form  = $.prompt.getPrompt();
-            var input = form.find("input[name='displayName']");
+            let input = form.find("input[name='displayName']");
             input.focus();
-            var button = form.find("button");
+            let button = form.find("button");
             button.attr("disabled", "disabled");
             input.keyup(function () {
-                if(!input.val())
+                if (input.val()) {
-                    button.attr("disabled", "disabled");
-                else
                     button.removeAttr("disabled");
+                } else {
+                    button.attr("disabled", "disabled");
+                }
             });
         }
     );
@@ -689,5 +689,59 @@ UI.inviteParticipants = function (roomUrl, conferenceName, key, nick) {
     window.open(`mailto:?subject=${subject}&body=${body}`, '_blank');
 };
 
+UI.requestFeedback = function () {
+    return new Promise(function (resolve, reject) {
+        if (Feedback.isEnabled()) {
+            // If the user has already entered feedback, we'll show the window and
+            // immidiately start the conference dispose timeout.
+            if (Feedback.feedbackScore > 0) {
+                Feedback.openFeedbackWindow();
+                resolve();
+
+            } else { // Otherwise we'll wait for user's feedback.
+                Feedback.openFeedbackWindow(resolve);
+            }
+        } else {
+            // If the feedback functionality isn't enabled we show a thank you
+            // dialog.
+            messageHandler.openMessageDialog(
+                null, null, null,
+                APP.translation.translateString(
+                    "dialog.thankYou", {appName:interfaceConfig.APP_NAME}
+                )
+            );
+            resolve();
+        }
+    });
+};
+
+UI.requestRecordingToken = function () {
+    let msg = APP.translation.generateTranslationHTML("dialog.recordingToken");
+    let token = APP.translation.translateString("dialog.token");
+    return new Promise(function (resolve, reject) {
+        messageHandler.openTwoButtonDialog(
+            null, null, null,
+            `<h2>${msg}</h2>
+             <input name="recordingToken" type="text"
+                    data-i18n="[placeholder]dialog.token"
+                    placeholder="${token}" autofocus>`,
+            false, "dialog.Save",
+            function (e, v, m, f) {
+                if (v && f.recordingToken) {
+                    resolve(UIUtil.escapeHtml(f.recordingToken));
+                } else {
+                    reject();
+                }
+            },
+            null,
+            function () { },
+            ':input:first'
+        );
+    });
+};
+
+UI.updateRecordingState = function (state) {
+    Toolbar.updateRecordingState(state);
+};
 
 module.exports = UI;

modules/UI/toolbars/Toolbar.js

@@ -3,7 +3,6 @@
 var messageHandler = require("../util/MessageHandler");
 var UIUtil = require("../util/UIUtil");
 var AnalyticsAdapter = require("../../statistics/AnalyticsAdapter");
-var Feedback = require("../Feedback");
 var UIEvents = require("../../../service/UI/UIEvents");
 
 var roomUrl = null;
@@ -110,7 +109,7 @@ const buttonHandlers = {
     },
     "toolbar_button_record": function () {
         AnalyticsAdapter.sendEvent('toolbar.recording.toggled');
-        toggleRecording();
+        emitter.emit(UIEvents.RECORDING_TOGGLE);
     },
     "toolbar_button_security": function () {
         emitter.emit(UIEvents.ROOM_LOCK_CLICKED);
@@ -146,7 +145,7 @@ const buttonHandlers = {
     },
     "toolbar_button_sip": function () {
         AnalyticsAdapter.sendEvent('toolbar.sip.clicked');
-        callSipButtonClicked();
+        showSipNumberInput();
     },
     "toolbar_button_dialpad": function () {
         AnalyticsAdapter.sendEvent('toolbar.sip.dialpad.clicked');
@@ -158,7 +157,7 @@ const buttonHandlers = {
     },
     "toolbar_button_hangup": function () {
         AnalyticsAdapter.sendEvent('toolbar.hangup');
-        hangup();
+        emitter.emit(UIEvents.HANGUP);
     },
     "toolbar_button_login": function () {
         AnalyticsAdapter.sendEvent('toolbar.authenticate.login.clicked');
@@ -176,15 +175,10 @@ const buttonHandlers = {
             "dialog.Yes",
             function (evt, yes) {
                 if (yes) {
-                    APP.xmpp.logout(function (url) {
+                    emitter.emit(UIEvents.LOGOUT);
-                        if (url) {
-                            window.location.href = url;
-                        } else {
-                            hangup();
-                        }
-                    });
                 }
-            });
+            }
+        );
     }
 };
 var defaultToolbarButtons = {
@@ -201,85 +195,11 @@ var defaultToolbarButtons = {
     'hangup': '#toolbar_button_hangup'
 };
 
-/**
- * Hangs up this call.
- */
-function hangup() {
-    var conferenceDispose = function () {
-        APP.xmpp.disposeConference();
-
-        if (config.enableWelcomePage) {
-            setTimeout(function() {
-                window.localStorage.welcomePageDisabled = false;
-                window.location.pathname = "/";
-            }, 3000);
-        }
-    };
-
-    if (Feedback.isEnabled()) {
-        // If the user has already entered feedback, we'll show the window and
-        // immidiately start the conference dispose timeout.
-        if (Feedback.feedbackScore > 0) {
-            Feedback.openFeedbackWindow();
-            conferenceDispose();
-
-        }
-        // Otherwise we'll wait for user's feedback.
-        else
-            Feedback.openFeedbackWindow(conferenceDispose);
-    }
-    else {
-        conferenceDispose();
-
-        // If the feedback functionality isn't enabled we show a thank you
-        // dialog.
-        messageHandler.openMessageDialog(null, null, null,
-            APP.translation.translateString("dialog.thankYou",
-                {appName:interfaceConfig.APP_NAME}));
-    }
-}
-
-/**
- * Starts or stops the recording for the conference.
- */
-function toggleRecording(predefinedToken) {
-    APP.xmpp.toggleRecording(function (callback) {
-        if (predefinedToken) {
-            callback(UIUtil.escapeHtml(predefinedToken));
-            return;
-        }
-
-        var msg = APP.translation.generateTranslationHTML(
-            "dialog.recordingToken");
-        var token = APP.translation.translateString("dialog.token");
-        messageHandler.openTwoButtonDialog(null, null, null,
-                '<h2>' + msg + '</h2>' +
-                '<input name="recordingToken" type="text" ' +
-                ' data-i18n="[placeholder]dialog.token" ' +
-                'placeholder="' + token + '" autofocus>',
-            false,
-            "dialog.Save",
-            function (e, v, m, f) {
-                if (v) {
-                    var token = f.recordingToken;
-
-                    if (token) {
-                        callback(UIUtil.escapeHtml(token));
-                    }
-                }
-            },
-            null,
-            function () { },
-            ':input:first'
-        );
-    }, setRecordingButtonState);
-}
-
 function dialpadButtonClicked() {
     //TODO show the dialpad box
 }
 
-function callSipButtonClicked() {
+function showSipNumberInput () {
     let defaultNumber = config.defaultSipNumber
         ? config.defaultSipNumber
         : '';
@@ -291,11 +211,8 @@ function callSipButtonClicked() {
          <input name="sipNumber" type="text" value="${defaultNumber}" autofocus>`,
         false, "dialog.Dial",
         function (e, v, m, f) {
-            if (v) {
+            if (v && f.sipNumber) {
-                var numberInput = f.sipNumber;
+                emitter.emit(UIEvents.SIP_DIAL, f.sipNumber);
-                if (numberInput) {
-                    APP.xmpp.dial(numberInput, 'fromnumber', APP.conference.roomName, APP.conference.sharedKey);
-                }
             }
         },
         null, null, ':input:first'
@@ -379,7 +296,7 @@ const Toolbar = {
     // to start automatically recording
     checkAutoRecord () {
         if (UIUtil.isButtonEnabled('recording') && config.autoRecord) {
-            toggleRecording(config.autoRecordToken);
+            emitter.emit(UIEvents.RECORDING_TOGGLE, UIUtil.escapeHtml(config.autoRecordToken));
         }
     },
 
@@ -394,7 +311,7 @@ const Toolbar = {
 
     // Shows or hides SIP calls button
     showSipCallButton (show) {
-        if (APP.xmpp.isSipGatewayEnabled() && UIUtil.isButtonEnabled('sip') && show) {
+        if (APP.conference.sipGatewayEnabled && UIUtil.isButtonEnabled('sip') && show) {
             $('#toolbar_button_sip').css({display: "inline-block"});
         } else {
             $('#toolbar_button_sip').css({display: "none"});
@@ -460,6 +377,10 @@ const Toolbar = {
         } else {
             button.removeClass("glow");
         }
+    },
+
+    updateRecordingState (state) {
+        setRecordingButtonState(state);
     }
 };
 

service/UI/UIEvents.js

@@ -29,6 +29,9 @@ export default {
     AUTH_CLICKED: "UI.auth_clicked",
     TOGGLE_CHAT: "UI.toggle_chat",
     TOGGLE_SETTINGS: "UI.toggle_settings",
+    HANGUP: "UI.hangup",
+    LOGOUT: "UI.logout",
+    RECORDING_TOGGLE: "UI.recording_toggle",
     /**
      * Notifies interested parties when the film strip (remote video's panel)
      * is hidden (toggled) or shown (un-toggled).