From 2b747f1856fb2ff31c04428eaf6bd3a56135d794 Mon Sep 17 00:00:00 2001
From: Nick Denry <nick.denry@gmail.com>
Date: Mon, 11 May 2020 21:26:51 +0300
Subject: [PATCH] Login form styling accomplished

---
 app/controllers/login-controller.js           | 14 +++++++-----
 app/services/chimeverse-service.js            |  6 ++---
 ...ings-service.js => credentials-service.js} |  2 +-
 app/views/login/page.html                     | 14 +++++++-----
 index.html                                    |  1 +
 main.js                                       |  1 +
 package-lock.json                             |  5 +++++
 package.json                                  |  1 +
 renderer.js                                   | 10 ++++++---
 resources/css/app.css                         |  4 ++++
 resources/css/login-form.css                  | 22 ++++++++++++++++++-
 11 files changed, 62 insertions(+), 18 deletions(-)
 rename app/services/{settings-service.js => credentials-service.js} (97%)

diff --git a/app/controllers/login-controller.js b/app/controllers/login-controller.js
index 1a5a98b..4c9e1a7 100644
--- a/app/controllers/login-controller.js
+++ b/app/controllers/login-controller.js
@@ -1,11 +1,15 @@
 let angApp = require(__dirname+'/../init')
 
-angApp.controller('LoginController', function($scope, ChimeVerseService, SettingsServise) {
+angApp.controller('LoginController', function($scope, ChimeVerseService, CredentialsServise) {
+
     $scope.addAccountAndLoginAction = () => {
-        SettingsServise.addCredentials($scope.bosh,
-            $scope.login,
-            $scope.password
+        CredentialsServise.addCredentials($scope.credentials.bosh,
+            $scope.credentials.login,
+            $scope.credentials.password
         )
-        ChimeVerseService.initConverse($scope.bosh, $scope.login, $scope.password)
+        ChimeVerseService.initConverse($scope.credentials.bosh, $scope.credentials.login, $scope.credentials.password)
+        $scope.accountForm.$setPristine()
+        $scope.accountForm.$setUntouched()
+        $scope.credentials = {}
     }
 });
\ No newline at end of file
diff --git a/app/services/chimeverse-service.js b/app/services/chimeverse-service.js
index 6e64c87..aebd7ec 100644
--- a/app/services/chimeverse-service.js
+++ b/app/services/chimeverse-service.js
@@ -1,6 +1,6 @@
 let angApp = require(__dirname + '/../init')
 
-angApp.factory('ChimeVerseService', ($window, SettingsServise, SystemService, AppStateService) => {
+angApp.factory('ChimeVerseService', ($window, CredentialsServise, SystemService, AppStateService) => {
 
     let chimeverseService = {}
 
@@ -14,9 +14,9 @@ angApp.factory('ChimeVerseService', ($window, SettingsServise, SystemService, Ap
     }
 
     chimeverseService.logout = () => {
-        let credentials = SettingsServise.getCredentials()
+        let credentials = CredentialsServise.getCredentials()
         credentials.then((result) => {
-            let remove = SettingsServise.removeCredentials(result.login)
+            let remove = CredentialsServise.removeCredentials(result.login)
             console.log('Remove credential on logout')
             remove.then(() => {
                 AppStateService.set(AppStateService.APP_STATE_LOGIN)
diff --git a/app/services/settings-service.js b/app/services/credentials-service.js
similarity index 97%
rename from app/services/settings-service.js
rename to app/services/credentials-service.js
index dbd0deb..712f566 100644
--- a/app/services/settings-service.js
+++ b/app/services/credentials-service.js
@@ -1,6 +1,6 @@
 let angApp = require(__dirname+'/../init')
 
-angApp.factory('SettingsServise', () => {
+angApp.factory('CredentialsServise', () => {
 
     const keytar = require('keytar')
     const settings = require('electron-settings')
diff --git a/app/views/login/page.html b/app/views/login/page.html
index 17032f4..c370270 100644
--- a/app/views/login/page.html
+++ b/app/views/login/page.html
@@ -6,27 +6,31 @@
             <div class="login-form__wrapper">
                 <div class="login-form__input-group">
                     <span class="oi" data-glyph="link-intact"></span>
-                    <input ng-model="bosh" class="login-form__input" type="text" placeholder="Bosh service url" required>
+                    <input ng-model="credentials.bosh" class="login-form__input" type="text" placeholder="Bosh service url" required>
                 </div>
             </div>
             <div class="login-form__wrapper">
                 <div class="login-form__input-group">
                     <span class="oi" data-glyph="person"></span>
-                    <input ng-model="login" class="login-form__input" type="text" placeholder="jid@jabber.org" required>
+                    <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>
-                    <input ng-model="password" class="login-form__input" type="password" placeholder="Password" required>
+                    <input ng-model="credentials.password" class="login-form__input" type="password" placeholder="Password" required>
                 </div>
             </div>
             <div class="login-form__wrapper">
                 <button class="login-form__button" ng-click="addAccountAndLoginAction()" ng-disabled="accountForm.$invalid" disabled>Add account</button>
             </div>
-            <div class="uk-text-small uk-text-center">
-            Credentials stored via Keychain
+            <div class="login-form__credentials-message">
+                Credentials stored via <a href="https://atom.github.io/node-keytar/" target="_blank">Keychain</a>
             </div>
         </form>
     </div>
+</div>
+<div class="login-form__footer">
+    <span class="footer__version">Chimeverse v0.1.52.</span>
+    <a class="github-button" href="https://github.com/nick-denry/Chimeverse" data-icon="octicon-star" aria-label="Star nick-denry/Chimeverse on GitHub">Star</a>
 </div>
\ No newline at end of file
diff --git a/index.html b/index.html
index 4394b65..6603304 100644
--- a/index.html
+++ b/index.html
@@ -38,6 +38,7 @@
     window.require = window.nodeRequire
     delete window.nodeRequire
   </script>
+  <script async defer src="node_modules/github-buttons/dist/buttons.min.js"></script>
   <script>
     // You can also require other files to run in this process
     require('./node_modules/converse.js/dist/locales/' + navigator.language + '-LC_MESSAGES-converse-po.js')
diff --git a/main.js b/main.js
index 490d151..aa98ea1 100644
--- a/main.js
+++ b/main.js
@@ -43,6 +43,7 @@ function createWindow () {
         mainWindow = null
     })
 
+    // Open links on system default browser
     mainWindow.webContents.on('new-window', function(e, url) {
         e.preventDefault()
         shell.openExternal(url)
diff --git a/package-lock.json b/package-lock.json
index 52833c3..35096fb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1639,6 +1639,11 @@
         "assert-plus": "^1.0.0"
       }
     },
+    "github-buttons": {
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/github-buttons/-/github-buttons-2.8.0.tgz",
+      "integrity": "sha512-luN2vRGV0GKT/P9FLqrWfa2DXddjNrDmv6eOLhFTU99yGv1OrMxVZEXKwSHlGmxhxvnZFYT6a3Hz42W07m3J1g=="
+    },
     "github-from-package": {
       "version": "0.0.0",
       "resolved": "https://registry.npmjs.org/github-from-package/-/github-from-package-0.0.0.tgz",
diff --git a/package.json b/package.json
index ac38312..63c8878 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
     "angular": "^1.7.9",
     "converse.js": "^6.0.0",
     "electron-settings": "^3.2.0",
+    "github-buttons": "^2.8.0",
     "keytar": "^4.13.0",
     "n": "^6.5.1",
     "open-iconic": "^1.1.1"
diff --git a/renderer.js b/renderer.js
index b30804d..31897f7 100644
--- a/renderer.js
+++ b/renderer.js
@@ -4,7 +4,7 @@
 
 var angApp = require('./app/init')
 
-require('./app/services/settings-service')
+require('./app/services/credentials-service')
 require('./app/services/system-service')
 require('./app/services/app-state-service')
 require('./app/services/chimeverse-service')
@@ -14,7 +14,7 @@ require('./app/controllers/default-controller')
 const chimeversePlugin = require('./libs/converse.js/3rdparty/chimeverse-plugin')
 chimeversePlugin.register()
 
-angApp.controller('AppController', function ($scope, $timeout, ChimeVerseService, SettingsServise, AppStateService) {
+angApp.controller('AppController', function ($scope, $timeout, ChimeVerseService, CredentialsServise, AppStateService) {
 
     //const { remote, ipcRenderer } = require('electron')
     const { ipcRenderer } = require('electron')
@@ -26,6 +26,10 @@ angApp.controller('AppController', function ($scope, $timeout, ChimeVerseService
         //remote.getCurrentWindow().reload()
     })
 
+    ipcRenderer.on('preferences-event', () => {
+        AppStateService.set(AppStateService.APP_STATE_SETTINGS)
+    })
+
     $scope.state = AppStateService.APP_STATE_DEFAULT
 
     $scope.$on('app:state:changed', (event, data) => {
@@ -37,7 +41,7 @@ angApp.controller('AppController', function ($scope, $timeout, ChimeVerseService
     });
 
     $scope.getCredentialsAndLogin = () => {
-        let credentials = SettingsServise.getCredentials()
+        let credentials = CredentialsServise.getCredentials()
         credentials.then((result) => {
             ChimeVerseService.initConverse(result.bosh, result.login, result.password)
         }, (error) => {
diff --git a/resources/css/app.css b/resources/css/app.css
index 42f6626..d27edaf 100644
--- a/resources/css/app.css
+++ b/resources/css/app.css
@@ -16,6 +16,10 @@ body {
 	-webkit-text-size-adjust: 100%;
 }
 
+a {
+    color: #777;
+}
+
 .main-background {
     background: #f8f8f8;
     height: 100%;
diff --git a/resources/css/login-form.css b/resources/css/login-form.css
index b3df71c..5b49bb2 100644
--- a/resources/css/login-form.css
+++ b/resources/css/login-form.css
@@ -2,7 +2,7 @@
     color: #777;
     left: 50%;
     position: absolute;
-    top: 50%;
+    top: 47%;
     transform: translate(-50%, -50%);
 }
 
@@ -75,3 +75,23 @@
  .login-form__button:disabled {
     background: #eee;
  }
+
+ .login-form__credentials-message {
+     font-size: 14px;
+    text-align: center;
+ }
+
+ .login-form__footer {
+    bottom: 20px;
+    color: #777;
+    display: flex;
+    left: 50%;
+    position: absolute;
+    text-align: center;
+    transform: translate(-50%, 0%);
+ }
+
+ .footer__version {
+    font-size: 13px;
+    margin-right: 30px;
+ }
\ No newline at end of file