better hot reloading for themes

src/main/base/browserwindow.ts

@@ -12,7 +12,7 @@ import fetch from 'electron-fetch'
 import { wsapi } from "./wsapi";
 import { AppImageUpdater, NsisUpdater } from "electron-updater";
 import { utils } from './utils';
-
+const fileWatcher = require('chokidar');
 const AdmZip = require("adm-zip");
 
 
@@ -233,13 +233,52 @@ export class BrowserWindow {
             preload: join(utils.getPath('srcPath'), "./preload/cider-preload.js"),
         },
     };
+    StartWatcher(path: string) {
+        var chokidar = require("chokidar");
 
+        var watcher = chokidar.watch(path, {
+            ignored: /[\/\\]\./,
+            persistent: true
+        });
+
+        function onWatcherReady() {
+            console.info('From here can you check for real changes, the initial scan has been completed.');
+        }
+
+        // Declare the listeners of the watcher
+        watcher
+            .on('add', function (path: string) {
+                // console.log('File', path, 'has been added');
+            })
+            .on('addDir', function (path: string) {
+                // console.log('Directory', path, 'has been added');
+            })
+            .on('change', function (path: string) {
+                console.log('File', path, 'has been changed');
+                BrowserWindow.win.webContents.send("theme-update", "")
+            })
+            .on('unlink', function (path: string) {
+                // console.log('File', path, 'has been removed');
+            })
+            .on('unlinkDir', function (path: string) {
+                // console.log('Directory', path, 'has been removed');
+            })
+            .on('error', function (error: string) {
+                // console.log('Error happened', error);
+            })
+            .on('ready', onWatcherReady)
+            .on('raw', function (event: any, path: any, details: any) {
+                // This event should be triggered everytime something happens.
+                // console.log('Raw event info:', event, path, details);
+            });
+    }
     /**
      * Creates the browser window
      */
     async createWindow(): Promise<Electron.BrowserWindow> {
         this.clientPort = await getPort({ port: 9000 });
         BrowserWindow.verifyFiles();
+        this.StartWatcher(utils.getPath('themes'));
 
         // Load the previous state with fallback to defaults
         const windowState = windowStateKeeper({

src/renderer/index.js

@@ -779,6 +779,10 @@ const app = new Vue({
 
             MusicKit.getInstance().videoContainerElement = document.getElementById("apple-music-video-player")
 
+            ipcRenderer.on('theme-update', (event, arg) => {
+                less.refresh(true, true, true)
+            })
+
             ipcRenderer.on('SoundCheckTag', (event, tag) => {
                 let replaygain = self.parseSCTagToRG(tag)
                 try {
@@ -906,6 +910,7 @@ const app = new Vue({
             if (theme == "") {
                 theme = this.cfg.visual.theme
             } else {
+                this.cfg.visual.theme = ""
                 this.cfg.visual.theme = theme
             }
             this.chrome.appliedTheme.info = await (await fetch("themes/" + app.cfg.visual.theme.replace("index.less", "theme.json"))).json()