Merge pull request #101 from ajayyy/experimental

Better lookups + userID generator improvements

README.md

@@ -3,7 +3,7 @@
 
 # SponsorBlock
 
-SponsorBlock is an extension that will skip over sponsored segments of YouTube videos. SponsorBlock is a crowdsourced browser extension that let's anyone submit the start and end time's of sponsored segments of YouTube videos. Once one person submits this information, everyone else with this extension will skip right over the sponsored segment.
+SponsorBlock is an extension that will skip over sponsored segments of YouTube videos. SponsorBlock is a crowdsourced browser extension that lets anyone submit the start and end times of sponsored segments of YouTube videos. Once one person submits this information, everyone else with this extension will skip right over the sponsored segment.
 
 # Available for Chrome and Firefox
 
@@ -23,11 +23,11 @@ Hopefully this project can be combined with projects like [this](https://github.
 
 # API
 
-You can read the API docs [here](https://github.com/ajayyy/SponsorBlockServer#api-docs)
+You can read the API docs [here](https://github.com/ajayyy/SponsorBlockServer#api-docs).
 
 # Previous extension
 
-This project is partially based off of [this experimental extension](https://github.com/OfficialNoob/YTSponsorSkip). That extension has the basic video skipping functionality.
+This project is partially based off of [this experimental extension](https://github.com/OfficialNoob/YTSponsorSkip), which has the basic video skipping functionality.
 
 # Build Yourself
 
@@ -39,4 +39,4 @@ The awesome [Invidious API](https://github.com/omarroth/invidious/wiki/API) is u
 
 Some icons made by <a href="https://www.flaticon.com/authors/gregor-cresnar" title="Gregor Cresnar">Gregor Cresnar</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a> and are licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a>
 
-Some icons made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a>
+Some icons made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik">Freepik</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a> are licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a>

background.js

@@ -1,11 +1,3 @@
-var previousVideoID = null
-
-//the id of this user, randomly generated once per install
-var userID = null;
-
-//the last video id loaded, to make sure it is a video id change
-var sponsorVideoID = null;
-
 //when a new tab is highlighted
 chrome.tabs.onActivated.addListener(
   function(activeInfo) {
@@ -62,14 +54,38 @@ chrome.runtime.onMessage.addListener(function (request, sender, callback) {
 
 //add help page on install
 chrome.runtime.onInstalled.addListener(function (object) {
-  chrome.storage.sync.get(["shownInstallPage"], function(result) {
+  // TODO (shownInstallPage): remove shownInstallPage logic after sufficient amount of time,
-    let shownInstallPage = result.shownInstallPage;
+  // so that people have time to upgrade and move to shownInstallPage-free code.
-    if (shownInstallPage == undefined || !shownInstallPage) {
+  chrome.storage.sync.get(["userID", "shownInstallPage"], function(result) {
-      //open up the install page
+    const userID = result.userID;
-      chrome.tabs.create({url: chrome.extension.getURL("/help/index.html")});
+    // TODO (shownInstallPage): delete row below
+    const shownInstallPage = result.shownInstallPage;
 
-      //save that this happened
+    // If there is no userID, then it is the first install.
-      chrome.storage.sync.set({shownInstallPage: true});
+    if (!userID){
+      // Show install page, if there is no user id
+      // and there is no shownInstallPage.
+      // TODO (shownInstallPage): remove this if statement, but leave contents
+      if (!shownInstallPage){
+        //open up the install page
+        chrome.tabs.create({url: chrome.extension.getURL("/help/index.html")});
+      }
+
+      // TODO (shownInstallPage): delete if statement and contents
+      // If shownInstallPage is set, remove it.
+      if (!!shownInstallPage){
+        chrome.storage.sync.remove("shownInstallPage");
+      }
+
+      //generate a userID
+      const newUserID = generateUUID();
+      //save this UUID
+      chrome.storage.sync.set({
+        "userID": newUserID,
+        //the last video id loaded, to make sure it is a video id change
+        "sponsorVideoID": null,
+        "previousVideoID": null
+      });
     }
   });
 });
@@ -109,9 +125,11 @@ function addSponsorTime(time, videoID, callback) {
 }
 
 function submitVote(type, UUID, callback) {
-  getUserID(function(userID) {
+  chrome.storage.sync.get(["userID"], function(result) {
+    let userID = result.userID;
+
     //publish this vote
-    sendRequestToServer('GET', "/api/voteOnSponsorTime?UUID=" + UUID + "&userID=" + userID + "&type=" + type, function(xmlhttp, error) {
+    sendRequestToServer("GET", "/api/voteOnSponsorTime?UUID=" + UUID + "&userID=" + userID + "&type=" + type, function(xmlhttp, error) {
       if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
         callback({
           successType: 1
@@ -138,14 +156,14 @@ function submitTimes(videoID, callback) {
   let sponsorTimeKey = 'sponsorTimes' + videoID;
   chrome.storage.sync.get([sponsorTimeKey], function(result) {
     let sponsorTimes = result[sponsorTimeKey];
+    let userID = result.userID;
 
     if (sponsorTimes != undefined && sponsorTimes.length > 0) {
       //submit these times
       for (let i = 0; i < sponsorTimes.length; i++) {
-        getUserID(function(userIDStorage) {
           //submit the sponsorTime
-          sendRequestToServer('GET', "/api/postVideoSponsorTimes?videoID=" + videoID + "&startTime=" + sponsorTimes[i][0] + "&endTime=" + sponsorTimes[i][1]
+          sendRequestToServer("GET", "/api/postVideoSponsorTimes?videoID=" + videoID + "&startTime=" + sponsorTimes[i][0] + "&endTime=" + sponsorTimes[i][1]
-          + "&userID=" + userIDStorage, function(xmlhttp, error) {
+          + "&userID=" + userID, function(xmlhttp, error) {
             if (xmlhttp.readyState == 4 && !error) {
               callback({
                 statusCode: xmlhttp.status
@@ -169,7 +187,6 @@ function submitTimes(videoID, callback) {
                 statusCode: -1
               });
             }
-          });
         });
       }
     }
@@ -183,63 +200,45 @@ function videoIDChange(currentVideoID, tabId) {
     id: currentVideoID
   });
 
-  //not a url change
+  chrome.storage.sync.get(["sponsorVideoID", "previousVideoID"], function(result) {
-  if (sponsorVideoID == currentVideoID){
+    const sponsorVideoID = result.sponsorVideoID;
-    return;
+    const previousVideoID = result.previousVideoID;
-  }
-  sponsorVideoID = currentVideoID;
 
-  //warn them if they had unsubmitted times
+    //not a url change
-  if (previousVideoID != null) {
+    if (sponsorVideoID == currentVideoID){
-    //get the sponsor times from storage
+      return;
-    let sponsorTimeKey = 'sponsorTimes' + previousVideoID;
+    }
-    chrome.storage.sync.get([sponsorTimeKey], function(result) {
-      let sponsorTimes = result[sponsorTimeKey];
 
-      if (sponsorTimes != undefined && sponsorTimes.length > 0) {
+    chrome.storage.sync.set({
-        //warn them that they have unsubmitted sponsor times
+      "sponsorVideoID": currentVideoID
-        chrome.notifications.create("stillThere" + Math.random(), {
-          type: "basic",
-          title: "Do you want to submit the sponsor times for watch?v=" + previousVideoID + "?",
-          message: "You seem to have left some sponsor times unsubmitted. Go back to that page to submit them (they are not deleted).",
-          iconUrl: "./icons/LogoSponsorBlocker256px.png"
-        });
-      }
-
-      //set the previous video id to the currentID
-      previousVideoID = currentVideoID;
     });
-  } else {
-    previousVideoID = currentVideoID;
-  }
-}
 
-function getUserID(callback) {
+    //warn them if they had unsubmitted times
-  if (userID != null) {
+    if (previousVideoID != null) {
-    callback(userID);
+      //get the sponsor times from storage
-    return;
+      let sponsorTimeKey = 'sponsorTimes' + previousVideoID;
-  }
+      chrome.storage.sync.get([sponsorTimeKey], function(result) {
+        let sponsorTimes = result[sponsorTimeKey];
 
-  //if it is not cached yet, grab it from storage
+        if (sponsorTimes != undefined && sponsorTimes.length > 0) {
-  chrome.storage.sync.get(["userID"], function(result) {
+          //warn them that they have unsubmitted sponsor times
-    let userIDStorage = result.userID;
+          chrome.notifications.create("stillThere" + Math.random(), {
-    if (userIDStorage != undefined) {
+            type: "basic",
-      userID = userIDStorage;
+            title: "Do you want to submit the sponsor times for watch?v=" + previousVideoID + "?",
-      callback(userID);
+            message: "You seem to have left some sponsor times unsubmitted. Go back to that page to submit them (they are not deleted).",
+            iconUrl: "./icons/LogoSponsorBlocker256px.png"
+          });
+        }
+
+        //set the previous video id to the currentID
+        chrome.storage.sync.set({
+          "previousVideoID": currentVideoID
+        });
+      });
     } else {
-      //double check if a UUID hasn't been created since this was first called
+      chrome.storage.sync.set({
-      if (userID != null) {
+        "previousVideoID": currentVideoID
-        callback(userID);
+      });
-        return;
-      }
-
-      //generate a userID
-      userID = generateUUID();
-      
-      //save this UUID
-      chrome.storage.sync.set({"userID": userID});
-
-      callback(userID);
     }
   });
 }
@@ -263,11 +262,21 @@ function sendRequestToServer(type, address, callback) {
   xmlhttp.send();
 }
 
-function getYouTubeVideoID(url) { // Return video id or false
+function generateUUID(length = 36) {
-  var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/;
+    let charset = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
-  var match = url.match(regExp);
+    let result = "";
-  return (match && match[7].length == 11) ? match[7] : false;
+    let isOpera = Object.prototype.toString.call(window.opera) == '[object Opera]';
+    if (window.crypto && window.crypto.getRandomValues) {
+        values = new Uint32Array(length);
+        window.crypto.getRandomValues(values);
+        for (i = 0; i < length; i++) {
+            result += charset[values[i] % charset.length];
+        }
+        return result;
+    } else {
+        for (let i = 0; i < length; i++) {
+          result += charset[Math.floor(Math.random() * charset.length)];
+        }
+        return result;
+    }
 }
-
-//uuid generator function from https://gist.github.com/jed/982883
-function generateUUID(a){return a?(a^Math.random()*16>>a/4).toString(16):([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g,generateUUID)}

content.js

@@ -10,10 +10,6 @@ var sponsorVideoID = null;
 //the time this video is starting at when first played, if not zero
 var youtubeVideoStartTime = null;
 
-if(id = getYouTubeVideoID(document.URL)){ // Direct Links
-  videoIDChange(id);
-}
-
 //the video
 var v;
 
@@ -23,12 +19,20 @@ var channelURL;
 //is this channel whitelised from getting sponsors skipped
 var channelWhitelisted = false;
 
+if(id = getYouTubeVideoID(document.URL)){ // Direct Links
+  videoIDChange(id);
+}
+
 //the last time looked at (used to see if this time is in the interval)
 var lastTime = -1;
 
 //the actual time (not video time) that the last skip happened
 var lastUnixTimeSkipped = -1;
 
+//the amount of times the sponsor lookup has retried
+//this only happens if there is an error
+var sponsorLookupRetries = 0;
+
 //the last time in the video a sponsor was skipped
 //used for the go back button
 var lastSponsorTimeSkipped = null;
@@ -195,6 +199,7 @@ function videoIDChange(id) {
   sponsorTimes = null;
   UUIDs = null;
   sponsorVideoID = id;
+  sponsorLookupRetries = 0;
 
   //see if there is a video start time
   youtubeVideoStartTime = getYouTubeVideoStartTime(document.URL);
@@ -275,7 +280,8 @@ function sponsorsLookup(id) {
 
       getChannelID();
 
-    } else if (xmlhttp.readyState == 4) {
+      sponsorLookupRetries = 0;
+    } else if (xmlhttp.readyState == 4 && xmlhttp.status == 404) {
       sponsorDataFound = false;
 
       //check if this video was uploaded recently
@@ -290,6 +296,13 @@ function sponsorsLookup(id) {
           }
         }
       });
+
+      sponsorLookupRetries = 0;
+    } else if (xmlhttp.readyState == 4 && sponsorLookupRetries < 15) {
+      //some error occurred, try again in a second
+      setTimeout(() => sponsorsLookup(id), 1000);
+
+      sponsorLookupRetries++;
     }
   });
 
@@ -1048,6 +1061,9 @@ function sendSubmitMessage(){
         //clear the sponsor times
         let sponsorTimeKey = "sponsorTimes" + currentVideoID;
         chrome.storage.sync.set({[sponsorTimeKey]: []});
+
+        //request the sponsors from the server again
+        sponsorsLookup(currentVideoID);
       } else {
         //for a more detailed error message, they should check the popup
         //show that the upload failed
@@ -1143,26 +1159,3 @@ function sendRequestToCustomServer(type, fullAddress, callback) {
   //submit this request
   xmlhttp.send();
 }
-
-function getYouTubeVideoID(url) { // Returns with video id else returns false
-  var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/;
-  var match = url.match(regExp);
-  var id = new URL(url).searchParams.get("v");
-  if (url.includes("/embed/")) {
-    //it is an embed, don't search for v
-    id = match[7];
-  }
-
-  return (match && match[7].length == 11) ? id : false;
-}
-
-//returns the start time of the video if there was one specified (ex. ?t=5s)
-function getYouTubeVideoStartTime(url) {
-  let searchParams = new URL(url).searchParams;
-  var startTime = searchParams.get("t");
-  if (startTime == null) {
-    startTime = searchParams.get("time_continue");
-  }
-
-  return startTime;
-}

manifest.json

@@ -1,7 +1,7 @@
 {
   "name": "SponsorBlock for YouTube - Skip Sponsorships",
   "short_name": "SponsorBlock",
-  "version": "1.0.29",
+  "version": "1.0.31",
   "description": "Skip over sponsorship on YouTube videos. Report sponsors on videos you watch to save the time of others.",
   "content_scripts": [
     {
@@ -11,6 +11,7 @@
       "all_frames": true,
       "js": [
         "config.js",
+        "utils.js",
         "content.js",
         "popup.js"
       ],
@@ -32,9 +33,7 @@
     "icons/downvote.png",
     "icons/PlayerInfoIconSponsorBlocker256px.png",
     "icons/PlayerDeleteIconSponsorBlocker256px.png",
-    "popup.html",
+    "popup.html"
-    "help/index.html",
-    "help/style.css"
   ],
   "permissions": [
     "tabs",
@@ -48,9 +47,11 @@
   }, 
   "background": {
     "scripts":[
+      "utils.js",
       "config.js",
       "background.js"
-    ]
+    ],
+    "persistent": false
   },
   "icons": {
     "16": "icons/IconSponsorBlocker16px.png",

popup.html

@@ -193,5 +193,6 @@
 
   <!-- Scripts that need to load after the html -->
   <script src="config.js"></script>
+  <script src="utils.js"></script>
   <script src="popup.js"></script>
-</html>
+</html>

popup.js

@@ -123,26 +123,6 @@ function runThePopup() {
     }
   });
 
-  //see if whitelist button should be swapped
-  chrome.tabs.query({
-    active: true,
-    currentWindow: true
-  }, tabs => {
-    chrome.tabs.sendMessage(
-      tabs[0].id,
-      {message: 'isChannelWhitelisted'},
-      function(response) {
-        if (response.value) {
-          SB.whitelistChannel.style.display = "none";
-          SB.unwhitelistChannel.style.display = "unset";
-
-          SB.downloadedSponsorMessageTimes.innerText = "Channel Whitelisted!";
-          SB.downloadedSponsorMessageTimes.style.fontWeight = "bold";
-        }
-      });
-    }
-  );
-  
   //if the don't show notice again letiable is true, an option to 
   //  disable should be available
   chrome.storage.sync.get(["dontShowNoticeAgain"], function(result) {
@@ -292,6 +272,26 @@ function runThePopup() {
         SB.videoFound.innerHTML = "No sponsors found"
       }
     }
+
+    //see if whitelist button should be swapped
+    chrome.tabs.query({
+      active: true,
+      currentWindow: true
+    }, tabs => {
+      chrome.tabs.sendMessage(
+        tabs[0].id,
+        {message: 'isChannelWhitelisted'},
+        function(response) {
+          if (response.value) {
+            SB.whitelistChannel.style.display = "none";
+            SB.unwhitelistChannel.style.display = "unset";
+
+            SB.downloadedSponsorMessageTimes.innerText = "Channel Whitelisted!";
+            SB.downloadedSponsorMessageTimes.style.fontWeight = "bold";
+          }
+        });
+      }
+    );
   }
   
   function setVideoID(request) {
@@ -1127,13 +1127,6 @@ function runThePopup() {
     xmlhttp.send();
   }
   
-  function getYouTubeVideoID(url) { // Returns with video id else returns false
-    var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/;
-    var match = url.match(regExp);
-    var id = new URL(url).searchParams.get("v");
-    return (match && match[7].length == 11) ? id : false;
-  }
-  
 //end of function
 }
 
@@ -1143,4 +1136,4 @@ if (chrome.tabs != undefined) {
 
   //this means it is actually opened in the popup
   runThePopup();
-}
+}

utils.js

@@ -0,0 +1,37 @@
+function getYouTubeVideoID(url) {
+    //Attempt to parse url
+    let urlObject = null;
+    try { 
+        urlObject = new URL(url);
+    } catch (e) {      
+        console.error("[SB] Unable to parse URL: " + url);
+        return false
+    }
+  
+    //Check if valid hostname
+    if(!["www.youtube.com","www.youtube-nocookie.com"].includes(urlObject.host)) return false; 
+    
+    //Get ID from searchParam
+    if ((urlObject.pathname == "/watch" || urlObject.pathname == "/watch/") && urlObject.searchParams.has("v")) {
+      id = urlObject.searchParams.get("v"); 
+      return id.length == 11 ? id : false;
+    } else if (urlObject.pathname.startsWith("/embed/")) {
+      try {
+        return urlObject.pathname.substr(7, 11);
+      } catch (e) {
+        console.error("[SB] Video ID not valid for " + url);
+        return false;
+      }
+    }
+}
+
+//returns the start time of the video if there was one specified (ex. ?t=5s)
+function getYouTubeVideoStartTime(url) {
+  let searchParams = new URL(url).searchParams;
+  let startTime = searchParams.get("t");
+  if (startTime == null) {
+    startTime = searchParams.get("time_continue");
+  }
+
+  return startTime;
+}