From 8088d4a7a61430a52413081d35c999b42ace093a Mon Sep 17 00:00:00 2001
From: Alexander Weidinger <alexwegoo@gmail.com>
Date: Sat, 6 Oct 2018 18:43:19 +0200
Subject: [PATCH] Use MutationObserver

---
 netflix-speed.user.js | 76 +++++++++++++++++++++++++++----------------
 1 file changed, 48 insertions(+), 28 deletions(-)

diff --git a/netflix-speed.user.js b/netflix-speed.user.js
index 6a31050..2aacdf2 100644
--- a/netflix-speed.user.js
+++ b/netflix-speed.user.js
@@ -1,34 +1,54 @@
 // ==UserScript==
 // @name netflix-speed
 // @version 0.1
-// @include https://www.netflix.com/watch/*
+// @include https://www.netflix.com/*
 // ==/UserScript==
 
-var speed_control = document.createElement('select');
-speed_control.style.cssText = `
-border:none;
--moz-appearance: none;
--webkit-appearance: none;
-appearance: none;
-cursor: pointer;
-background: none;
-`;
-speed_control.onchange = function() {
-  document.getElementsByClassName('VideoContainer')[0].getElementsByTagName('video')[0].playbackRate = this.value;
-};
-speed_control.innerHTML = `<option value=0.5>0.5</option>
-<option value=0.75>0.75</option>
-<option value=1.0 selected="selected">Normal</option>
-<option value=1.25>1.25</option>
-<option value=1.5>1.5</option>
-<option value=1.75>1.75</option>
-<option value=2.0>2.0</option>`;
-function append(){
-  if(!document.getElementsByClassName('PlayerControlsNeo__controls-group').length) {
-    setTimeout(append, 200);
-  } else {
-    console.log(document.getElementsByClassName('PlayerControlsNeo__controls-group')[0]);
-    document.getElementsByClassName('PlayerControlsNeo__controls-group')[0].appendChild(speed_control);
-  }
+function find_controls() {
+	return new Promise(function(resolve, reject) {
+		var observer = new MutationObserver(function(mutationsList) {
+			mutationsList.forEach(function(mutation) {
+				var nodes = Array.from(mutation.addedNodes);
+				for (var node of nodes) {
+					if (node.parentNode && node.parentNode.matches && node.parentNode.matches('.PlayerControlsNeo__controls-group')) {
+						observer.disconnect();
+						resolve(node.parentNode);
+						return;
+					}
+				}
+			});
+		});
+
+		observer.observe(document.documentElement, { childList: true, subtree: true });
+	});
 }
-append();
+
+function inject_controls() {
+	find_controls().then(function(controls) {
+		var speed_control = document.createElement('select');
+		speed_control.style.cssText = `
+		border:none;
+		-moz-appearance: none;
+		-webkit-appearance: none;
+		appearance: none;
+		cursor: pointer;
+		background: none;
+		`;
+		speed_control.onchange = function() {
+			document.querySelector('.VideoContainer video').playbackRate = this.value;
+		};
+		speed_control.innerHTML = `<option value=0.5>0.5</option>
+		<option value=0.75>0.75</option>
+		<option value=1.0 selected="selected">Normal</option>
+		<option value=1.25>1.25</option>
+		<option value=1.5>1.5</option>
+		<option value=1.75>1.75</option>
+		<option value=2.0>2.0</option>`;
+
+		controls.appendChild(speed_control);
+
+		inject_controls();
+	});
+};
+
+inject_controls();