Allow to use Websocket connection at the login form

2020-06-07 17:32:09 +03:00 · 2020-06-07 17:32:09 +03:00 · db6ef71e65
parent 2e76ad772b
commit db6ef71e65
7 changed files with 73 additions and 29 deletions
--- a/app/controllers/about-controller.js
+++ b/app/controllers/about-controller.js
@ -5,6 +5,6 @@ angApp.controller('AboutController', function($scope, AppStateService, AppInfo)
    $scope.appInfo = AppInfo

    $scope.closeAbout = () => {
-        AppStateService.set(AppStateService.previousState)
+        AppStateService.set(AppStateService.APP_STATE_DEFAULT)
    }
 })
--- a/app/controllers/login-controller.js
+++ b/app/controllers/login-controller.js
@ -2,8 +2,14 @@ let angApp = require(__dirname+'/../init')

 angApp.controller('LoginController', function($scope, ChimeVerseService, CredentialsServise) {

+    $scope.help = {}
+
+    $scope.showHelp = (item) => {
+        $scope.help[item] = typeof $scope.help[item] === 'undefined' ? true : !$scope.help[item];
+    }
+
    $scope.addAccountAndLoginAction = () => {
-        CredentialsServise.addCredentials($scope.credentials.bosh,
+        CredentialsServise.addCredentials($scope.credentials.connectionManager,
            $scope.credentials.login,
            $scope.credentials.password
        )
--- a/app/services/chimeverse-service.js
+++ b/app/services/chimeverse-service.js
@ -19,42 +19,47 @@ angApp.factory('ChimeVerseService', ($window, $timeout, CredentialsServise, Syst
        let credentials = CredentialsServise.getCredentials()
        credentials.then((result) => {
            let remove = CredentialsServise.removeCredentials(result.login)
-            console.log('Remove credential on logout')
+            console.log('Remove credentials on logout')
            remove.then(() => {
                AppStateService.set(AppStateService.APP_STATE_LOGIN)
            })
        })
    }

-    chimeverseService.initConverse = (bosh, login, password) => {
+    chimeverseService.initConverse = (connectionManager, login, password) => {
        AppStateService.set(AppStateService.APP_STATE_DEFAULT) // Always set to default state before init
        chimeversePlugin.register(login)
        let lang = navigator.language
        let allowBookmarks = SettingsService.get('allowBookmarks')
        let omemoDefault = SettingsService.get('omemoDefault')
        let xmppResource = '.' + (Math.random().toString(36)+'00000000000000000').slice(2, 7); // Generate 5 char unique str
+        let conversejsParams = {
+            allow_bookmarks: allowBookmarks,
+            auto_login: true,
+            auto_reconnect: true,
+            // debug: true,
+            i18n: lang,
+            jid: login + '/Chimeverse'+xmppResource,
+            omemo_default: omemoDefault,
+            password: password,
+            priority: 50,
+            view_mode: 'embedded',
+            whitelisted_plugins: ['chimeVerse'],
+        }
+        if (connectionManager.startsWith('ws')) {
+            conversejsParams.websocket_url = connectionManager
+        } else {
+            conversejsParams.bosh_service_url = connectionManager
+        }
        $timeout(() => {
-            converse.initialize({
-                allow_bookmarks: allowBookmarks,
-                auto_login: true,
-                auto_reconnect: true,
-                bosh_service_url: bosh,
-                // debug: true,
-                i18n: lang,
-                jid: login + '/Chimeverse'+xmppResource,
-                omemo_default: omemoDefault,
-                password: password,
-                priority: 50,
-                view_mode: 'embedded',
-                whitelisted_plugins: ['chimeVerse'],
-            })
+            converse.initialize(conversejsParams)
        }, 50)
    }

    chimeverseService.getCredentialsAndLogin = () => {
        let credentials = CredentialsServise.getCredentials()
        credentials.then((result) => {
-            chimeverseService.initConverse(result.bosh, result.login, result.password)
+            chimeverseService.initConverse(result.connectionManager, result.login, result.password)
        }, (error) => {
            AppStateService.set(AppStateService.APP_STATE_LOGIN)
        })
--- a/app/services/credentials-service.js
+++ b/app/services/credentials-service.js
@ -12,7 +12,7 @@ angApp.factory('CredentialsServise', () => {
        credentials.login = settings.get('login')
        let promise = new Promise((resolve, reject) => {
            if (credentials.login) {
-                credentials.bosh = settings.get('bosh')
+                credentials.connectionManager = settings.get('connectionManager')
                credentials.xmppService = credentials.login.split('@').pop()
                let password = keytar.getPassword(credentials.xmppService, credentials.login)
                password.then((result) => {
@ -27,9 +27,9 @@ angApp.factory('CredentialsServise', () => {
        return promise
    }

-    credentialsService.addCredentials = (bosh, login, password) => {
+    credentialsService.addCredentials = (connectionManager, login, password) => {
        let xmppService = login.split('@').pop()
-        settings.set('bosh', bosh)
+        settings.set('connectionManager', connectionManager)
        settings.set('login', login)
        keytar.setPassword(xmppService, login, password)
    }
@ -40,7 +40,7 @@ angApp.factory('CredentialsServise', () => {
        let promise = new Promise((resolve, reject) => {
            passwordDelete.then((result) => {
                settings.delete('login')
-                settings.delete('bosh')
+                settings.delete('connectionManager')
                resolve()
            }, (error) => {
                reject(error)
--- a/app/services/settings-service.js
+++ b/app/services/settings-service.js
@ -83,6 +83,11 @@ angApp.factory('SettingsService', () => {
     */
    settingsService.initDefaults = () => {
        iterateSettings(saveDefault)
+        // Logout for versions with BOSH only
+        if (electronSettings.has('bosh')) {
+            electronSettings.delete('bosh')
+            electronSettings.delete('login')
+        }
    }

    settingsService.get = (key) => {
--- a/app/views/login/page.html
+++ b/app/views/login/page.html
@ -5,19 +5,29 @@
        <form name="accountForm" ng-controller="LoginController">
            <div class="login-form__wrapper">
                <div class="login-form__input-group">
-                    <span class="oi" data-glyph="link-intact"></span>
-                    <input ng-model="credentials.bosh" class="login-form__input" type="text" placeholder="Bosh service url" required>
+                    <span class="group-prepend oi" data-glyph="link-intact"></span>
+                    <input ng-model="credentials.connectionManager" class="login-form__input login-form__input--with-append" type="text" placeholder="Connection manager url" required>
+                    <span class="group-append--backgrounded oi" data-glyph="info" ng-click="showHelp('connectionManager')"></span>
+                </div>
+                <div class="login-form__input-help" ng-show="help.connectionManager == true"">
+                    <div>
+                        Should be a
+                        <a href="https://m.conversejs.org/docs/html/setup.html#bosh-section" target="_blank">BOSH service</a>
+                         or a
+                        <a href="https://m.conversejs.org/docs/html/setup.html#websocket-section" target="_blank">Websocket</a>
+                         URL
+                    </div>
                </div>
            </div>
            <div class="login-form__wrapper">
                <div class="login-form__input-group">
-                    <span class="oi" data-glyph="person"></span>
+                    <span class="group-prepend oi" data-glyph="person"></span>
                    <input ng-model="credentials.login" class="login-form__input" type="text" placeholder="jid@jabber.org" required>
                </div>
            </div>
            <div class="login-form__wrapper">
                <div class="login-form__input-group">
-                    <span class="oi" data-glyph="lock-locked"></span>
+                    <span class="group-prepend oi" data-glyph="lock-locked"></span>
                    <input ng-model="credentials.password" class="login-form__input" type="password" placeholder="Password" required>
                </div>
            </div>
--- a/resources/css/page-login.css
+++ b/resources/css/page-login.css
@ -41,12 +41,21 @@
    border: 1px solid #aaa;
 }

-.login-form__input-group span {
+.login-form__input-group .group-prepend {
    position: absolute;
    left: 15px;
    top: 12px;
 }

+.login-form__input-group .group-append--backgrounded {
+    background: #f2f2f2;
+    cursor: pointer;
+    padding: 12px;
+    position: absolute;
+    right: 0px;
+    top: 0  px;
+}
+
 .login-form__input {
    border: 0px;
    color: #222;
@ -57,7 +66,16 @@
 }

 .login-form__input::placeholder { /* Most modern browsers support this now. */
-    color:  #ddd;
+    color:  #ccc;
+ }
+
+ .login-form__input--with-append {
+    width: 260px;
+ }
+
+ .login-form__input-help {
+    font-size: 13px;
+    margin: 4px;
 }

 .login-form__button {