Globalized the song info and song controls, and updated Touch Bar for it.

index.js

@@ -28,6 +28,8 @@ if (config.get("options.disableHardwareAcceleration")) {
 // Adds debug features like hotkeys for triggering dev tools and reload
 require("electron-debug")();
 
+// these are the providers for the plugins, this shouldn't be hardcoded but it's temporarily
+const providers = ["song-info"];
 // Prevent window being garbage collected
 let mainWindow;
 autoUpdater.autoDownload = false;
@@ -54,6 +56,15 @@ function loadPlugins(win) {
  }
  });
 
+ providers.forEach(provider => {
+ console.log("Loaded provider - " + provider);
+ const providerPath = path.join(__dirname, "providers", provider, "back.js");
+ fileExists(providerPath, () => {
+ const handle = require(providerPath);
+ handle(win);
+ });
+ });
+
  config.plugins.getEnabled().forEach(([plugin, options]) => {
  console.log("Loaded plugin - " + plugin);
  const pluginPath = path.join(__dirname, "plugins", plugin, "back.js");

plugins/notifications/back.js

@@ -1,33 +1,31 @@
-const { nativeImage, Notification } = require("electron");
+const {Notification} = require('electron');
 
-const { listenAction } = require("../utils");
-const { ACTIONS, CHANNEL } = require("./actions.js");
+const notify = info => {
+ let notificationImage = 'assets/youtube-music.png';
 
-function notify(info) {
- let notificationImage = "assets/youtube-music.png";
  if (info.image) {
- notificationImage = nativeImage.createFromDataURL(info.image);
+ notificationImage = info.image.resize({height: 256, width: 256});
  }
 
+ // Fill the notification with content
  const notification = {
- title: info.title || "Playing",
+ title: info.title || 'Playing',
  body: info.artist,
  icon: notificationImage,
- silent: true,
+ silent: true
  };
+ // Send the notification
  new Notification(notification).show();
-}
+};
 
-function listenAndNotify() {
- listenAction(CHANNEL, (event, action, imageSrc) => {
- switch (action) {
-  case ACTIONS.NOTIFICATION:
-  notify(imageSrc);
-  break;
- default:
-  console.log("Unknown action: " + action);
- }
+module.exports = win => {
+ win.on('ready-to-show', () => {
+ // Register the callback for new song information
+ global.songInfo.onNewData(songInfo => {
+ // If song is playing send notification
+ if (!songInfo.isPaused) {
+  notify(songInfo);
+ }
+ });
  });
-}
-
-module.exports = listenAndNotify;
+};

plugins/touchbar/back.js

@@ -1,110 +1,85 @@
-const {
- TouchBar, nativeImage
-} = require('electron');
+const {TouchBar} = require('electron');
 const {
  TouchBarButton,
  TouchBarLabel,
  TouchBarSpacer,
  TouchBarSegmentedControl,
  TouchBarScrubber
 } = TouchBar;
-const fetch = require('node-fetch');
 
-// This selects the song title
-const titleSelector = '.title.style-scope.ytmusic-player-bar';
+// Songtitle label
+const songTitle = new TouchBarLabel({
+ label: ''
+});
+// This will store the song controls once available
+let controls = [];
 
-// This selects the song image
-const imageSelector = '#layout > ytmusic-player-bar > div.middle-controls.style-scope.ytmusic-player-bar > img';
+// This will store the song image once available
+const songImage = {};
 
-// These keys will be used to go backwards, pause, skip songs, like songs, dislike songs
-const keys = ['k', 'space', 'j', '_', '+'];
+// Pause/play button
+const pausePlayButton = new TouchBarButton();
 
-const presskey = (window, key) => {
- window.webContents.sendInputEvent({
- type: 'keydown',
- keyCode: key
- });
-};
+// The song control buttons (control functions are in the same order)
+const buttons = new TouchBarSegmentedControl({
+ mode: 'buttons',
+ segments: [
+ new TouchBarButton({
+ label: '⏮'
+ }),
+ pausePlayButton,
+ new TouchBarButton({
+ label: '⏭'
+ }),
+ new TouchBarButton({
+ label: '👎'
+ }),
+ new TouchBarButton({
+ label: '👍'
+ })
+ ],
+ change: i => controls[i]()
+});
 
-// Grab the title using the selector
-const getTitle = win => {
- return win.webContents.executeJavaScript(
- 'document.querySelector(\'' + titleSelector + '\').innerText'
- ).catch(error => {
- console.log(error);
- });
-};
-
-// Grab the image src using the selector
-const getImage = win => {
- return win.webContents.executeJavaScript(
- 'document.querySelector(\'' + imageSelector + '\').src'
- ).catch(error => {
- console.log(error);
- });
-};
+// This is the touchbar object, this combines everything with proper layout
+const touchBar = new TouchBar({
+ items: [
+ new TouchBarScrubber({
+ items: [songImage, songTitle],
+ continuous: false
+ }),
+ new TouchBarSpacer({
+ size: 'flexible'
+ }),
+ buttons
+ ]
+});
 
 module.exports = win => {
- // Songtitle label
- const songTitle = new TouchBarLabel({
- label: ''
- });
-
- // This will store the song image once available
- const songImage = {};
+ // If the page is ready, register the callback
+ win.on('ready-to-show', () => {
+ controls = [
+ global.songControls.previous,
+ global.songControls.pause,
+ global.songControls.next,
+ global.songControls.like,
+ global.songControls.dislike
+ ];
 
- // The song control buttons (keys to press are in the same order)
- const buttons = new TouchBarSegmentedControl({
- mode: 'buttons',
- segments: [
- new TouchBarButton({
- label: '⏮'
- }),
- new TouchBarButton({
- label: '⏯️'
- }),
- new TouchBarButton({
- label: '⏭'
- }),
- new TouchBarButton({
- label: '👎'
- }),
- new TouchBarButton({
- label: '👍'
- })
- ],
- change: i => presskey(win, keys[i])
- });
-
- // This is the touchbar object, this combines everything with proper layout
- const touchBar = new TouchBar({
- items: [
- new TouchBarScrubber({
- items: [songImage, songTitle],
- continuous: false
- }),
- new TouchBarSpacer({
- size: 'flexible'
- }),
- buttons
- ]
- });
+ // Register the callback
+ global.songInfo.onNewData(songInfo => {
+ // Song information changed, so lets update the touchBar
 
- // If the page title changes, update touchbar and song title
- win.on('page-title-updated', async () => {
- // Set the song title
- songTitle.label = await getTitle(win);
+ // Set the song title
+ songTitle.label = songInfo.title;
 
- // Get image source
- const imageSrc = await getImage(win);
+  // Changes the pause button if paused
+  pausePlayButton.label = songInfo.isPaused ? '▶️' : '⏸';
 
- // Fetch and set song image
- await fetch(imageSrc)
- .then(response => response.buffer())
- .then(data => {
- songImage.icon = nativeImage.createFromBuffer(data).resize({height: 23});
- });
+ // Get image source
+ songImage.icon = songInfo.image ? songInfo.image.resize({height: 23}) : null;
 
- win.setTouchBar(touchBar);
+ win.setTouchBar(touchBar);
+ });
  });
 };