Initial settings tab

src/app/core/services/electron.service.ts

@@ -2,40 +2,29 @@ import { Injectable } from '@angular/core'
 
 // If you import a module but never use any of the imported values other than as TypeScript types,
 // the resulting javascript file will look as if you never imported the module at all.
-import { ipcRenderer, webFrame, remote } from 'electron'
-import * as childProcess from 'child_process'
-import * as fs from 'fs'
-import * as util from 'util'
+import * as electron from 'electron'
 import { IPCInvokeEvents, IPCEmitEvents } from '../../../electron/shared/IPCHandler'
 
 @Injectable({
   providedIn: 'root'
 })
 export class ElectronService {
-  ipcRenderer: typeof ipcRenderer
-  webFrame: typeof webFrame
-  remote: typeof remote
-  childProcess: typeof childProcess
-  fs: typeof fs
-  util: typeof util
+  electron: typeof electron
 
   get isElectron() {
     return !!(window && window.process && window.process.type)
   }
 
   constructor() {
-    // Conditional imports
     if (this.isElectron) {
-      this.ipcRenderer = window.require('electron').ipcRenderer
-      this.webFrame = window.require('electron').webFrame
-      this.remote = window.require('electron').remote
-
-      this.childProcess = window.require('child_process')
-      this.fs = window.require('fs')
-      this.util = window.require('util')
+      this.electron = window.require('electron')
     }
   }
 
+  get currentWindow() {
+    return this.electron.remote.getCurrentWindow()
+  }
+
   /**
    * Calls an async function in the main process.
    * @param event The name of the IPC event to invoke.
@@ -43,7 +32,7 @@ export class ElectronService {
    * @returns A promise that resolves to the output data.
    */
   async invoke<E extends keyof IPCInvokeEvents>(event: E, data: IPCInvokeEvents[E]['input']) {
-    return this.ipcRenderer.invoke(event, data) as Promise<IPCInvokeEvents[E]['output']>
+    return this.electron.ipcRenderer.invoke(event, data) as Promise<IPCInvokeEvents[E]['output']>
   }
 
   /**
@@ -52,7 +41,7 @@ export class ElectronService {
    * @param data The data object to send across IPC.
    */
   sendIPC<E extends keyof IPCEmitEvents>(event: E, data: IPCEmitEvents[E]) {
-    this.ipcRenderer.send(event, data)
+    this.electron.ipcRenderer.send(event, data)
   }
 
   /**
@@ -61,8 +50,28 @@ export class ElectronService {
    * @param callback The data object to receive across IPC.
    */
   receiveIPC<E extends keyof IPCEmitEvents>(event: E, callback: (result: IPCEmitEvents[E]) => void) {
-    this.ipcRenderer.on(event, (_event, ...results) => {
+    this.electron.ipcRenderer.on(event, (_event, ...results) => {
       callback(results[0])
     })
   }
+
+  quit() {
+    this.electron.remote.app.quit()
+  }
+
+  openFolder(filepath: string) {
+    this.electron.shell.openItem(filepath)
+  }
+
+  showFolder(filepath: string) {
+    this.electron.shell.showItemInFolder(filepath)
+  }
+
+  showOpenDialog(options: Electron.OpenDialogOptions) {
+    return this.electron.remote.dialog.showOpenDialog(this.currentWindow, options)
+  }
+
+  get defaultSession() {
+    return this.electron.remote.session.defaultSession
+  }
 }

src/app/core/services/settings.service.ts

@@ -6,8 +6,10 @@ import { Settings } from 'src/electron/shared/Settings'
   providedIn: 'root'
 })
 export class SettingsService {
+  readonly builtinThemes = ['Default', 'Dark']
 
   private settings: Settings
+  private currentThemeLink: HTMLLinkElement
 
   constructor(private electronService: ElectronService) { }
 
@@ -17,4 +19,47 @@ export class SettingsService {
     }
     return this.settings
   }
+
+  saveSettings() {
+    if (this.settings != undefined) {
+      this.electronService.sendIPC('update-settings', this.settings)
+    }
+  }
+
+  changeTheme(theme: string) {
+    if (this.currentThemeLink != undefined) this.currentThemeLink.remove()
+    if (theme == 'Default') { return }
+
+    const link = document.createElement('link')
+    link.type = 'text/css'
+    link.rel = 'stylesheet'
+    link.href = `assets/themes/${theme}.css`
+    this.currentThemeLink = document.head.appendChild(link)
+  }
+
+  async getCacheSize() {
+    return this.electronService.defaultSession.getCacheSize()
+  }
+  
+  async clearCache() {
+    this.saveSettings()
+    return this.electronService.defaultSession.clearCache()
+  }
+
+  get libraryDirectory() {
+    return this.settings == undefined ? '' : this.settings.libraryPath
+  }
+  set libraryDirectory(newValue: string) {
+    this.settings.libraryPath = newValue
+    this.saveSettings()
+  }
+
+  get theme() {
+    return this.settings == undefined ? '' : this.settings.theme
+  }
+  set theme(newValue: string) {
+    this.settings.theme = newValue
+    this.changeTheme(newValue)
+    this.saveSettings()
+  }
 }