Add the basic touch bar support for macOS

Author: eNkru

package.json

@@ -23,7 +23,7 @@
   "author": "Howard Ju <howard.ju@outlook.com>",
   "license": "MIT",
   "devDependencies": {
-    "electron": "~1.7.10",
+    "electron": "~1.8.2",
     "electron-builder": "^19.8.0"
   },
   "dependencies": {

src/controller/player-controller.js

@@ -1,4 +1,5 @@
-const {app, BrowserWindow, Notification, ipcMain} = require('electron');
+const {app, BrowserWindow, Notification, ipcMain, TouchBar, nativeImage} = require('electron');
+const {TouchBarLabel, TouchBarButton} = TouchBar
 const urlLib = require('url');
 const http = require('http');
 const path = require('path');
@@ -74,6 +75,9 @@ class XiamiPlayer {
     // load xiami player page.
     this.window.loadURL(playerUrl);
 
+    // set the touch bar.
+    this.window.setTouchBar(this.createTouchBar());
+
     // inject the custom layout.
     this.window.webContents.on('dom-ready', () => {
 
@@ -174,6 +178,26 @@ class XiamiPlayer {
     this.window.webContents.executeJavaScript("document.querySelector('.prev-btn').dispatchEvent(new MouseEvent('click'));");
   }
 
+  /**
+   * Create the touch bar for macOS
+   */
+  createTouchBar() {
+    return new TouchBar([
+      new TouchBarButton({
+        icon: nativeImage.createFromNamedImage('NSTouchBarRewindTemplate', [-1, 0, 1]),
+        click: () => this.previous()
+      }),
+      new TouchBarButton({
+        icon: nativeImage.createFromNamedImage('NSTouchBarPlayPauseTemplate', [-1, 0, 1]),
+        click: () => this.toggle()
+      }),
+      new TouchBarButton({
+        icon: nativeImage.createFromNamedImage('NSTouchBarFastForwardTemplate', [-1, 0, 1]),
+        click: () => this.next()
+      })
+    ]);
+  }
+
   /**
    * Add the listener to monitor the play time.
    */