From 021d2a8a54531355f3943e104aa2b3bce36e8d20 Mon Sep 17 00:00:00 2001
From: Araxeus <oaeben@gmail.com>
Date: Thu, 22 Apr 2021 05:34:54 +0300
Subject: [PATCH] disable native volume-slider listeners

---
 plugins/precise-volume/back.js    |  9 ++++++++-
 plugins/precise-volume/front.js   | 10 ++++++----
 plugins/precise-volume/preload.js | 28 ++++++++++++++++++++++++++++
 3 files changed, 42 insertions(+), 5 deletions(-)
 create mode 100644 plugins/precise-volume/preload.js

diff --git a/plugins/precise-volume/back.js b/plugins/precise-volume/back.js
index e6b101f9..c0767535 100644
--- a/plugins/precise-volume/back.js
+++ b/plugins/precise-volume/back.js
@@ -3,8 +3,15 @@ This is used to determine if plugin is actually active
 (not if its only enabled in options)
 */
 let enabled = false;
-module.exports = () => {
+
+module.exports = (win) => {
 	enabled = true;
+
+	//did-finish-load is called after DOMContentLoaded.
+	//thats the reason the timing is controlled from main
+	win.webContents.once("did-finish-load", () => {
+		win.webContents.send("restoreAddEventListener");
+	});
 };
 
 module.exports.enabled = () => {
diff --git a/plugins/precise-volume/front.js b/plugins/precise-volume/front.js
index 33ad5095..91203655 100644
--- a/plugins/precise-volume/front.js
+++ b/plugins/precise-volume/front.js
@@ -1,6 +1,7 @@
-const { setOptions } = require("../../config/plugins");
 const { ipcRenderer } = require("electron");
-function $(selector){ return document.querySelector(selector); }
+const { setOptions } = require("../../config/plugins");
+ 
+function $(selector) { return document.querySelector(selector); }
 
 module.exports = (options) => {
 	setPlaybarOnwheel(options);
@@ -23,6 +24,7 @@ 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
@@ -52,7 +54,7 @@ function setPlaybarOnwheel(options) {
 function changeVolume(increase, options) {
 	// Need to change both the actual volume and the slider
 	const videoStream = $(".video-stream");
-	
+
 	// Apply volume change if valid
 	const steps = options.steps / 100;
 	videoStream.volume = increase ?
@@ -98,7 +100,7 @@ const tooltipTargets = [
 
 function setTooltip(volume) {
 	for (target of tooltipTargets) {
-		$(target).title =  `${volume}%`;
+		$(target).title = `${volume}%`;
 	}
 }
 
diff --git a/plugins/precise-volume/preload.js b/plugins/precise-volume/preload.js
new file mode 100644
index 00000000..75580d3b
--- /dev/null
+++ b/plugins/precise-volume/preload.js
@@ -0,0 +1,28 @@
+const { ipcRenderer } = require("electron");
+
+// Override specific listeners of volume-slider by modifying Element.prototype
+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
+            for (const eventType of nativeEvents) {
+                if (eventType === type) {
+                    return;
+                }
+            }
+        } //else
+		this._addEventListener(type,listener,useCapture);
+    };
+}
+
+module.exports = () => {
+    overrideAddEventListener();
+    // Restore the listeners after 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;
+	});
+}