Added option to hide the video player controls button in the popup.

content.js

@@ -27,6 +27,9 @@ var lastSponsorTimeSkipped = null;
 //if showing the start sponsor button or the end sponsor button on the player
 var showingStartSponsor = true;
 
+//should the video controls buttons be added
+var hideVideoPlayerControls = false;
+
 //if the notice should not be shown
 //happens when the user click's the "Don't show notice again" button
 var dontShowNotice = false;
@@ -70,6 +73,12 @@ chrome.runtime.onMessage.addListener( // Detect URL Changes
     if (request.message == "toggleStartSponsorButton") {
       toggleStartSponsorButton();
     }
+
+    if (request.message == "changeVideoPlayerControlsVisibility") {
+      hideVideoPlayerControls = request.value;
+
+      updateVisibilityOfPlayerControlsButton();
+    }
 });
 
 function videoIDChange(id) {
@@ -89,6 +98,15 @@ function videoIDChange(id) {
       }
     }
   });
+
+  //see if video control buttons should be added
+  chrome.storage.local.get(["hideVideoPlayerControls"], function(result) {
+    if (result.hideVideoPlayerControls != undefined) {
+      hideVideoPlayerControls = result.hideVideoPlayerControls;
+    }
+
+    updateVisibilityOfPlayerControlsButton();
+  });
 }
 
 function sponsorsLookup(id) {
@@ -149,6 +167,7 @@ function goBackToPreviousTime() {
 //Adds a sponsorship starts button to the player controls
 function addPlayerControlsButton() {
   let startSponsorButton = document.createElement("button");
+  startSponsorButton.id = "startSponsorButton";
   startSponsorButton.className = "ytp-button";
   startSponsorButton.setAttribute("title", "Sponsor Starts Now");
   startSponsorButton.addEventListener("click", startSponsorClicked);
@@ -170,7 +189,18 @@ function addPlayerControlsButton() {
   referenceNode.prepend(startSponsorButton);
 }
 
-addPlayerControlsButton();
+function removePlayerControlsButton() {
+  document.getElementById("startSponsorButton").style.display = "none";
+}
+
+//adds or removes the player controls button to what it should be
+function updateVisibilityOfPlayerControlsButton() {
+  if (hideVideoPlayerControls) {
+    removePlayerControlsButton();
+  } else {
+    addPlayerControlsButton();
+  }
+}
 
 function startSponsorClicked() {
   toggleStartSponsorButton();

popup.css

@@ -59,6 +59,31 @@ body {
 	top:1px;
 }
 
+.warningButton {
+	-moz-box-shadow:inset 0px 1px 0px 0px #cfbd6c;
+	-webkit-box-shadow:inset 0px 1px 0px 0px #cfbd6c;
+	box-shadow:inset 0px 1px 0px 0px #cfbd6c;
+	background-color:#d0821b;
+	-moz-border-radius:3px;
+	-webkit-border-radius:3px;
+	border-radius:3px;
+	border:1px solid #948b11;
+	display:inline-block;
+	cursor:pointer;
+	color:#ffffff;
+	font-size:13px;
+	padding:6px 24px;
+	text-decoration:none;
+	text-shadow:0px 1px 0px #856829;
+}
+.warningButton:hover {
+	background-color:#bc8215;
+}
+.warningButton:active {
+	position:relative;
+	top:1px;
+}
+
 .smallButton {
 	background-color:#f9902d;
 	-moz-border-radius:3px;

popup.html

@@ -55,6 +55,12 @@
           <br/>
           <br/>
 
+          <button id="hideVideoPlayerControls" class="warningButton">Hide Button On YouTube Player</button>
+          <button id="showVideoPlayerControls" style="display: none" class="warningButton">Show Button On YouTube Player</button>
+
+          <br/>
+          <br/>
+    
           <button id="showNoticeAgain" style="display: none" class="noticeButton">Show Notice Again</button>
         </div>
       </div>

popup.js

@@ -3,6 +3,8 @@ document.getElementById("sponsorStart").addEventListener("click", sendSponsorSta
 document.getElementById("clearTimes").addEventListener("click", clearTimes);
 document.getElementById("submitTimes").addEventListener("click", submitTimes);
 document.getElementById("showNoticeAgain").addEventListener("click", showNoticeAgain);
+document.getElementById("hideVideoPlayerControls").addEventListener("click", hideVideoPlayerControls);
+document.getElementById("showVideoPlayerControls").addEventListener("click", showVideoPlayerControls);
 
 //if true, the button now selects the end time
 var startTimeChosen = false;
@@ -25,6 +27,15 @@ chrome.storage.local.get(["dontShowNoticeAgain"], function(result) {
   }
 });
 
+//show proper video player controls option
+chrome.storage.local.get(["hideVideoPlayerControls"], function(result) {
+  let hideVideoPlayerControls = result.hideVideoPlayerControls;
+  if (hideVideoPlayerControls != undefined && hideVideoPlayerControls) {
+    document.getElementById("hideVideoPlayerControls").style.display = "none";
+    document.getElementById("showVideoPlayerControls").style.display = "unset";
+  }
+});
+
 chrome.tabs.query({
   active: true,
   currentWindow: true
@@ -230,6 +241,40 @@ function showNoticeAgain() {
   document.getElementById("showNoticeAgain").style.display = "none";
 }
 
+function hideVideoPlayerControls() {
+  chrome.storage.local.set({"hideVideoPlayerControls": true});
+
+  chrome.tabs.query({
+    active: true,
+    currentWindow: true
+  }, function(tabs) {
+    chrome.tabs.sendMessage(tabs[0].id, {
+      message: "changeVideoPlayerControlsVisibility",
+      value: true
+    });
+  });
+
+  document.getElementById("hideVideoPlayerControls").style.display = "none";
+  document.getElementById("showVideoPlayerControls").style.display = "unset";
+}
+
+function showVideoPlayerControls() {
+  chrome.storage.local.set({"hideVideoPlayerControls": false});
+
+  chrome.tabs.query({
+    active: true,
+    currentWindow: true
+  }, function(tabs) {
+    chrome.tabs.sendMessage(tabs[0].id, {
+      message: "changeVideoPlayerControlsVisibility",
+      value: false
+    });
+  });
+
+  document.getElementById("hideVideoPlayerControls").style.display = "unset";
+  document.getElementById("showVideoPlayerControls").style.display = "none";
+}
+
 function updateStartTimeChosen() {
   //update startTimeChosen variable
   if (!startTimeChosen) {