auth btn removed. login/logout --> Profile

conference.js

@@ -1086,7 +1086,6 @@ export default {
             }
         );
 
-
         room.on(ConferenceEvents.USER_JOINED, (id, user) => {
             if (user.isHidden())
                 return;

css/_login_menu.scss

@@ -31,11 +31,6 @@ ul.loginmenu:after {
     left: 18px;
 }
 
-
-.authentication {
-    position: relative;
-}
-
 a.disabled {
     color: gray !important;
     pointer-events: none;
@@ -60,25 +55,4 @@ ul.loginmenu.extendedToolbarPopup:after {
     position: absolute;
     top: 18px;
     left: -7px;
-}
-
-//extended toolbar: Log In menu
-.auth_container {
-    ul {
-        margin-top: 40px;
-        padding: 0;
-
-        li a.authButton{
-            width: 160px;
-            margin: 10px 20px;
-            background-color: #06a5df;
-            padding-top: 3px;
-            padding-bottom: 3px;
-            padding-left: 29px;
-            padding-right: 29px;
-            border-radius: 4px;
-            cursor: pointer;
-            box-sizing: border-box;
-        }
-    }
 }

css/_side_toolbar_container.scss

@@ -124,3 +124,29 @@
 #followMeCheckBox {
     width: 13px !important;
 }
+
+/**
+ * Profile
+ */
+.auth_container {
+    ul {
+        padding: 0;
+
+        li {
+            list-style-type: none;
+
+            a.authButton{
+                width: 160px;
+                margin: 10px 20px;
+                padding: 3px 29px;
+                box-sizing: border-box;
+                background-color: #06a5df;
+                border-radius: 4px;
+                cursor: pointer;
+                color: $defaultColor;
+                text-decoration: none;
+                text-align: center;
+            }
+        }
+    }
+}

css/input-control/_input-control.scss

@@ -20,7 +20,11 @@
     }
 
     &__input {
-        margin: 8px 0;
+        margin-bottom: 8px;
+
+        &:last-child {
+            margin-bottom: inherit;
+        }
 
         &::selection {
             background-color: $defaultDarkSelectionColor;

index.html

@@ -108,7 +108,6 @@
             <a class="button" id="toolbar_button_profile" data-container="body" data-placement="right" data-i18n="[content]toolbar.profile" content="Edit your profile">
                 <img id="avatar" src="images/avatar2.png"/>
             </a>
-            <a class="button icon-avatar authentication" id="toolbar_button_authentication" data-i18n="[content]toolbar.authenticate"></a>
             <a class="button icon-contactList" id="toolbar_contact_list" shortcut="contactlistpopover">
                 <span class="badge-round">
                     <span id="numberOfParticipants"></span>
@@ -135,17 +134,6 @@
             <a class="button icon-feedback" id="feedbackButton"></a>
 
             <div id="sideToolbarContainer">
-                <div id="authentication_container" class="auth_container">
-                    <ul>
-                        <li id="toolbar_auth_identity"></li>
-                        <li id="toolbar_button_login">
-                            <a class="authButton" data-i18n="toolbar.login"></a>
-                        </li>
-                        <li id="toolbar_button_logout">
-                            <a class="authButton" data-i18n="toolbar.logout"></a>
-                        </li>
-                    </ul>
-                </div>
                 <div id="profile_container" class="sideToolbarContainer__inner">
                     <div class="title" data-i18n="profile.title"></div>
                     <div class="sideToolbarBlock first">
@@ -156,6 +144,18 @@
                         <label data-i18n="profile.setEmailLabel"></label>
                         <input type="text" id="setEmail" placeholder="Enter e-mail">
                     </div>
+                    <div class="sideToolbarBlock auth_container" id="authenticationContainer">
+                        <p data-i18n="toolbar.authenticate"></p>
+                        <ul>
+                            <li id="toolbar_auth_identity"></li>
+                            <li id="toolbar_button_login">
+                                <a class="authButton" data-i18n="toolbar.login"></a>
+                            </li>
+                            <li id="toolbar_button_logout">
+                                <a class="authButton" data-i18n="toolbar.logout"></a>
+                            </li>
+                        </ul>
+                    </div>
                 </div>
                 <div id="chat_container" class="sideToolbarContainer__inner">
                     <div id="nickname">

interface_config.js

@@ -17,6 +17,10 @@ var interfaceConfig = { // eslint-disable-line no-unused-vars
     GENERATE_ROOMNAMES_ON_WELCOME_PAGE: true,
     APP_NAME: "Jitsi Meet",
     INVITATION_POWERED_BY: true,
+    /**
+     * If we should show authentication block in profile
+     */
+    AUTHENTICATION_ENABLE: true,
     // the toolbar buttons line is intentionally left in one line, to be able
     // to easily override values or remove them using regex
     MAIN_TOOLBAR_BUTTONS: ['microphone', 'camera', 'desktop', 'invite', 'fullscreen', 'hangup'], // jshint ignore:line

modules/UI/UI.js

@@ -362,8 +362,6 @@ function registerListeners() {
 
     UI.addListener(UIEvents.TOGGLE_FULLSCREEN, UI.toggleFullScreen);
 
-    UI.addListener(UIEvents.TOGGLE_AUTHENTICATION, UI.toggleAuthentication);
-
     UI.addListener(UIEvents.TOGGLE_CHAT, UI.toggleChat);
 
     UI.addListener(UIEvents.TOGGLE_SETTINGS, function () {
@@ -724,13 +722,6 @@ UI.isFilmStripVisible = function () {
     return FilmStrip.isFilmStripVisible();
 };
 
-/**
- * Toggles authentication panel.
- */
-UI.toggleAuthentication = function () {
-    UI.toggleSidePanel("authentication_container");
-};
-
 /**
  * Toggles chat panel.
  */
@@ -1149,11 +1140,12 @@ UI.notifyFocusLeft = function () {
  * @param {string} [login] current login
  */
 UI.updateAuthInfo = function (isAuthEnabled, login) {
+    let showAuth = isAuthEnabled && UIUtil.isAuthenticationEnabled();
     let loggedIn = !!login;
 
-    Toolbar.showAuthenticateButton(isAuthEnabled);
+    Toolbar.showAuthenticateButton(showAuth);
 
-    if (isAuthEnabled) {
+    if (showAuth) {
         Toolbar.setAuthenticatedIdentity(login);
 
         Toolbar.showLoginButton(!loggedIn);

modules/UI/authentication/LoginDialog.js

@@ -8,16 +8,15 @@ function getPasswordInputHtml() {
     let placeholder = config.hosts.authdomain
         ? "user identity"
         : "user@domain.net";
-    let passRequiredMsg = APP.translation.translateString(
-        "dialog.passwordRequired"
-    );
+
     return `
-        <h2 data-i18n="dialog.passwordRequired">${passRequiredMsg}</h2>
-        <input name="username" type="text" placeholder=${placeholder} autofocus>
+        <input name="username" type="text" 
+               class="input-control__input"
+               placeholder=${placeholder} autofocus>
         <input name="password" type="password"
+               class="input-control__input"
                data-i18n="[placeholder]dialog.userPassword"
-               placeholder="user password">
-        `;
+               placeholder="user password">`;
 }
 
 /**
@@ -80,6 +79,7 @@ function LoginDialog(successCallback, cancelCallback) {
 
     const states = {
         login: {
+            title: APP.translation.translateString('dialog.passwordRequired'),
             html: getPasswordInputHtml(),
             buttons: loginButtons,
             focus: ':input:first',

modules/UI/toolbars/Toolbar.js

@@ -6,68 +6,7 @@ import SideContainerToggler from "../side_pannels/SideContainerToggler";
 let emitter = null;
 let Toolbar;
 
-/**
- * Opens the invite link dialog.
- */
-function openLinkDialog () {
-    let inviteAttributes;
-
-    if (roomUrl === null) {
-        inviteAttributes = 'data-i18n="[value]roomUrlDefaultMsg" value="' +
-            APP.translation.translateString("roomUrlDefaultMsg") + '"';
-    } else {
-        inviteAttributes = "value=\"" + encodeURI(roomUrl) + "\"";
-    }
-
-    let inviteLinkId = "inviteLinkRef";
-    let focusInviteLink = function() {
-        $('#' + inviteLinkId)
-            .focus()
-            .select();
-    };
-
-    let title = APP.translation.generateTranslationHTML("dialog.shareLink");
-    APP.UI.messageHandler.openTwoButtonDialog(
-        null, title, null,
-        '<input id="' + inviteLinkId + '" type="text" '
-            + inviteAttributes + ' readonly/>',
-        false, "dialog.copy",
-        function (e, v) {
-            if (v && roomUrl) {
-                JitsiMeetJS.analytics.sendEvent('toolbar.invite.button');
-
-                focusInviteLink();
-
-                document.execCommand('copy');
-            }
-            else {
-                JitsiMeetJS.analytics.sendEvent('toolbar.invite.cancel');
-            }
-        },
-        function (event) {
-            if (!roomUrl) {
-                if (event && event.target) {
-                    $(event.target).find('button[value=true]')
-                        .prop('disabled', true);
-                }
-            }
-            else {
-                focusInviteLink();
-            }
-        },
-        function (e, v, m, f) {
-            if(!v && !m && !f)
-                JitsiMeetJS.analytics.sendEvent('toolbar.invite.close');
-        },
-        'Copy' // Focus Copy button.
-    );
-}
-
 const buttonHandlers = {
-    "toolbar_button_authentication": function() {
-        JitsiMeetJS.analytics.sendEvent('toolbar.authentication.toggled');
-        emitter.emit(UIEvents.TOGGLE_AUTHENTICATION);
-    },
     "toolbar_button_profile": function () {
         JitsiMeetJS.analytics.sendEvent('toolbar.profile.toggled');
         emitter.emit(UIEvents.TOGGLE_PROFILE);
@@ -186,11 +125,6 @@ const buttonHandlers = {
 };
 
 const defaultToolbarButtons = {
-    'authentication': {
-        id: 'toolbar_button_authentication',
-        tooltipKey: 'toolbar.authenticate',
-        sideContainerId: 'authentication_container'
-    },
     'microphone': {
         id: 'toolbar_button_mute',
         tooltipKey: 'toolbar.mute',
@@ -457,11 +391,9 @@ Toolbar = {
      * @param show <tt>true</tt> to show or <tt>false</tt> to hide
      */
     showAuthenticateButton (show) {
-        if (UIUtil.isButtonEnabled('authentication') && show) {
-            $('#toolbar_button_authentication').css({display: "inline"});
-        } else {
-            $('#toolbar_button_authentication').css({display: "none"});
-        }
+        let display = show ? 'block' : 'none';
+
+        $('#authenticationContainer').css({display});
     },
 
     showEtherpadButton () {
@@ -515,12 +447,14 @@ Toolbar = {
      * @param authIdentity identity name to be displayed.
      */
     setAuthenticatedIdentity (authIdentity) {
+        let selector = $('#toolbar_auth_identity');
+
         if (authIdentity) {
-            let selector = $('#toolbar_auth_identity');
             selector.css({display: "list-item"});
             selector.text(authIdentity);
         } else {
-            $('#toolbar_auth_identity').css({display: "none"});
+            selector.css({display: "none"});
+            selector.text('');
         }
     },
 
@@ -529,7 +463,7 @@ Toolbar = {
      * @param show <tt>true</tt> to show
      */
     showLoginButton (show) {
-        if (UIUtil.isButtonEnabled('authentication') && show) {
+        if (show) {
             $('#toolbar_button_login').css({display: "list-item"});
         } else {
             $('#toolbar_button_login').css({display: "none"});
@@ -541,7 +475,7 @@ Toolbar = {
      * @param show <tt>true</tt> to show
      */
     showLogoutButton (show) {
-        if (UIUtil.isButtonEnabled('authentication') && show) {
+        if (show) {
             $('#toolbar_button_logout').css({display: "list-item"});
         } else {
             $('#toolbar_button_logout').css({display: "none"});

modules/UI/util/UIUtil.js

@@ -204,6 +204,15 @@ const TOOLTIP_POSITIONS = {
         return interfaceConfig.SETTINGS_SECTIONS.indexOf(name) !== -1;
     },
 
+    /**
+     * Indicates if Authentication Section should be shown
+     *
+     * @returns {boolean}
+     */
+    isAuthenticationEnabled: function() {
+        return interfaceConfig.AUTHENTICATION_ENABLE;
+    },
+
     /**
      * Shows the element given by id.
      *

service/UI/UIEvents.js

@@ -44,10 +44,6 @@ export default {
      * Notifies that the profile toolbar button has been clicked.
      */
     TOGGLE_PROFILE: "UI.toggle_profile",
-    /**
-     * Notifies that the authentication toolbar button has been clicked.
-     */
-    TOGGLE_AUTHENTICATION: "UI.toggle_authentication",
     /**
      * Notifies that a command to toggle the film strip has been issued. The
      * event may optionally specify a {Boolean} (primitive) value to assign to