Made it warn you when you are on a non YouTube tab

2 files changed, 51 insertions, 28 deletions

diff --git a/popup.html b/popup.html
index c04c9415..1ee5d853 100644
--- a/popup.html
+++ b/popup.html
@@ -3,37 +3,41 @@
     <title>Set Page Color Popup</title>
     <link rel="stylesheet" type="text/css" href="popup.css"/>
   </head>
-  <div id="app">
-    <div class="main">
-      <center>
-        <h1>SponsorBlock</h1>
 
-        <!-- If the video was found in the database -->
-        <div id="videoFound">
-  
-        </div>
+  <center>
+    <div id="app">
+        <h1>SponsorBlock</h1>
 
-        <br/>
+        <!-- Loading text -->
+        <p id="loadingIndicator">Loading...</p>
 
-        <div>
-          <button id="sponsorStart">Sponsorship Starts</button>
+        <!-- Hidden until loading complete -->
+        <div id="mainControls" class="main" style="display: none">
+            <!-- If the video was found in the database -->
+            <div id="videoFound">
+      
+            </div>
+    
+            <br/>
+    
+            <div>
+              <button id="sponsorStart">Sponsorship Starts</button>
+            </div>
+      
+            <h3>Latest Sponsor Message Times Chosen</h3>
+            <b>
+              <div id="sponsorMessageTimes">
+      
+              </div>
+            </b>
+    
+            <button id="clearTimes">Clear Times</button>
+    
+            <br/>
+    
+            <button id="submitTimes">Submit Times</button>
         </div>
-  
-        <h3>Latest Sponsor Message Times Chosen</h3>
-        <b>
-          <div id="sponsorMessageTimes">
-  
-          </div>
-        </b>
-
-        <button id="clearTimes">Clear Times</button>
-
-        <br/>
-
-        <button id="submitTimes">Submit Times</button>
-      </center>
-    </div>
-  </div>
-
+      </div>
+  </center>
   <script src="popup.js"></script>
 </html>
\ No newline at end of file
diff --git a/popup.js b/popup.js
index abf6a9ce..4d9b242d 100644
--- a/popup.js
+++ b/popup.js
@@ -11,6 +11,17 @@ var videoTimes = [];
 //current video ID of this tab
 var currentVideoID = null;
 
+//is this a YouTube tab?
+var isYouTubeTab = false;
+
+//if no response comes by this point, give up
+setTimeout(function() {
+  if (!isYouTubeTab) {
+    document.getElementById("loadingIndicator").innerHTML = "This probably isn't a YouTube tab, or you clicked too early." +
+      "If you know this is a YouTube tab, close this popup and open it again.";
+  }
+}, 100);
+
 chrome.tabs.query({
   active: true,
   currentWindow: true
@@ -46,6 +57,14 @@ function loadTabData(tabs) {
 function infoFound(request) {
   //if request is undefined, then the page currently being browsed is not YouTube
   if (request != undefined) {
+    //this must be a YouTube video
+    //set variable
+    isYouTubeTab = true;
+
+    //remove loading text
+    document.getElementById("mainControls").style.display = "unset"
+    document.getElementById("loadingIndicator").innerHTML = "";
+
     if (request.found) {
       document.getElementById("videoFound").innerHTML = "This video's sponsors are in the database!"
     } else {