Add restart action to the settings dialog

app/controllers/settings-controller.js

@@ -1,16 +1,40 @@
 let angApp = require(__dirname+'/../init')
 
-angApp.controller('SettingsController', function ($scope, AppStateService, SettingsService) {
+angApp.controller('SettingsController', function ($scope, $rootScope, AppStateService, SettingsService) {
+
+    let formInitialized = false
+    $scope.settingsChanged = false
+    $scope.settingsSaved = false
+
+    const settingsSetPristine = () => {
+        $scope.settingsChanged = false
+        formInitialized = false
+    }
 
     $scope.closeSettings = () => {
-        AppStateService.set(AppStateService.previousState)
+        $scope.settings = SettingsService.loadAll()
+        settingsSetPristine()
+        AppStateService.set(AppStateService.APP_STATE_DEFAULT)
     }
 
     $scope.saveSettings = () => {
+        $scope.settingsSaved = true
         SettingsService.saveAll($scope.settings)
-        $scope.closeSettings()
+        settingsSetPristine()
+    }
+
+    $scope.restartApp = () => {
+        $rootScope.$broadcast('app:restart')
     }
 
     $scope.settings = SettingsService.loadAll()
 
+    $scope.$watch("settings", () => {
+        if (!formInitialized) {
+            formInitialized = true
+        } else {
+            $scope.settingsChanged = true
+        }
+    }, true)
+
 })

app/views/settings/page.html

@@ -14,8 +14,13 @@
         </label>
         <div class="form-item__hint">{{item.hint}}</div>
     </div>
+    <div class="form-item" ng-show="settingsSaved">
+        <a href="#" ng-click="restartApp()" class="form-item__restart-app">
+            Click here to restart the app and apply your changes
+        </a>
+    </div>
     <div class="form-actions">
-        <button class="form-item__save-button" ng-click="saveSettings()">Save</button>
+        <button class="form-item__save-button" ng-class="{'active': settingsChanged == true}" ng-click="saveSettings()">Save</button>
         <button class="form-item__cancel-button" ng-click="closeSettings()">Cancel</button>
     </div>
 </form>

main.js

@@ -1,5 +1,5 @@
 // Modules to control application life and create native browser window
-const { app, BrowserWindow, shell } = require('electron')
+const { app, BrowserWindow, ipcMain, shell } = require('electron')
 
 // Keep a global reference of the window object, if you don't, the window will
 // be closed automatically when the JavaScript object is garbage collected.
@@ -80,16 +80,6 @@ function createWindow () {
         })
     }
 
-    // Handle shutdown event on Mac with minimizeOnClose
-    // to prevent shutdown interrupt
-    if (isMac && minimizeOnClose) {
-        const { powerMonitor } = require('electron')
-        powerMonitor.on('shutdown', () => {
-            app.isQuitting = true
-            app.quit()
-        })
-    }
-
     // Save window size
     if (preserveWindowSize) {
         mainWindow.on('resize', (e) => {
@@ -112,6 +102,23 @@ function createWindow () {
         })
     }
 
+    // Handle shutdown event on Mac with minimizeOnClose
+    // to prevent shutdown interrupt
+    if (isMac && minimizeOnClose) {
+        const { powerMonitor } = require('electron')
+        powerMonitor.on('shutdown', () => {
+            app.isQuitting = true
+            app.quit()
+        })
+    }
+
+    // Handle restart
+    ipcMain.on('app-restart', (evt, arg) => {
+        app.isQuitting = true
+        app.relaunch()
+        app.exit()
+    })
+
     // Emitted when the window is closed.
     mainWindow.on('closed', function () {
         // Dereference the window object, usually you would store windows

renderer.js

@@ -52,6 +52,10 @@ angApp.controller('AppController', function ($scope, $timeout, ChimeVerseService
         }, 0)
     })
 
+    $scope.$on('app:restart', (event, data) => {
+        ipcRenderer.send('app-restart')
+    })
+
     SettingsService.initDefaults()
 
     ChimeVerseService.getCredentialsAndLogin()

resources/css/page-settings.css

@@ -9,4 +9,8 @@
 .form-item__hint {
     color: #777;
     font-size: 13px;
+}
+
+.form-item__save-button.active {
+    color: blue;
 }