diff --git a/plugins/precise-volume/back.js b/plugins/precise-volume/back.js index c0767535..1d53e4eb 100644 --- a/plugins/precise-volume/back.js +++ b/plugins/precise-volume/back.js @@ -7,8 +7,9 @@ let enabled = false; module.exports = (win) => { enabled = true; - //did-finish-load is called after DOMContentLoaded. - //thats the reason the timing is controlled from main + // youtube-music register some of the target listeners after DOMContentLoaded + // did-finish-load is called after all elements finished loading, including said listeners + // Thats the reason the timing is controlled from main win.webContents.once("did-finish-load", () => { win.webContents.send("restoreAddEventListener"); }); diff --git a/plugins/precise-volume/front.js b/plugins/precise-volume/front.js index 24b9e44b..762ded10 100644 --- a/plugins/precise-volume/front.js +++ b/plugins/precise-volume/front.js @@ -24,7 +24,6 @@ function firstRun(options) { const slider = $("#volume-slider"); // Those elements load abit after DOMContentLoaded if (videoStream && slider) { - // Set saved volume IF it pass checks if (options.savedVolume && options.savedVolume >= 0 && options.savedVolume <= 100 @@ -68,7 +67,7 @@ function changeVolume(increase, options) { // Change tooltips to new value setTooltip(options.savedVolume); // Show volume slider on volume change - slider.classList.add("on-hover") + slider.classList.add("on-hover"); } // Save volume + Update the volume tooltip when volume-slider is manually changed @@ -95,7 +94,7 @@ function setupSliderObserver(options) { // Set new volume as tooltip for volume slider and icon + expanding slider (appears when window size is small) const tooltipTargets = [ "#volume-slider", - "tp-yt-paper-icon-button.volume.style-scope.ytmusic-player-bar", + "tp-yt-paper-icon-button.volume", "#expand-volume-slider", "#expand-volume" ]; diff --git a/plugins/precise-volume/preload.js b/plugins/precise-volume/preload.js index 75580d3b..bfd6a01c 100644 --- a/plugins/precise-volume/preload.js +++ b/plugins/precise-volume/preload.js @@ -1,28 +1,28 @@ const { ipcRenderer } = require("electron"); // Override specific listeners of volume-slider by modifying Element.prototype -function overrideAddEventListener(){ +function overrideAddEventListener() { // Events to ignore const nativeEvents = ["mousewheel", "keydown", "keyup"]; // Save native addEventListener - Element.prototype._addEventListener = Element.prototype.addEventListener; - - Element.prototype.addEventListener = function(type,listener,useCapture=false) { - if(this.tagName === "TP-YT-PAPER-SLIDER") { //tagName of #volume-slider + Element.prototype._addEventListener = Element.prototype.addEventListener; + // Override addEventListener to Ignore specific events in volume-slider + Element.prototype.addEventListener = function (type, listener, useCapture = false) { + if (this.tagName === "TP-YT-PAPER-SLIDER") { // tagName of #volume-slider for (const eventType of nativeEvents) { if (eventType === type) { return; } } - } //else - this._addEventListener(type,listener,useCapture); + }//else + this._addEventListener(type, listener, useCapture); }; } module.exports = () => { overrideAddEventListener(); - // Restore the listeners after load to avoid keeping Element.prototype altered + // Restore original function after did-finish-load to avoid keeping Element.prototype altered ipcRenderer.once("restoreAddEventListener", () => { //called from Main to make sure page is completly loaded - Element.prototype.addEventListener = Element.prototype._addEventListener; - }); -} + Element.prototype.addEventListener = Element.prototype._addEventListener; + }); +};