Add lock button shown for VIPs

5 files changed, 44 insertions, 42 deletions

diff --git a/manifest/manifest.json b/manifest/manifest.json
index 771562e4..a8229541 100644
--- a/manifest/manifest.json
+++ b/manifest/manifest.json
@@ -41,6 +41,7 @@
         "icons/report.png",
         "icons/close.png",
         "icons/refresh.svg",
+        "icons/lock.svg",
         "icons/beep.ogg",
         "icons/PlayerInfoIconSponsorBlocker.svg",
         "icons/PlayerDeleteIconSponsorBlocker.svg",
diff --git a/public/icons/lock.svg b/public/icons/lock.svg
new file mode 100644
index 00000000..95a257b2
--- /dev/null
+++ b/public/icons/lock.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#FFFFFF"><g fill="none"><path d="M0 0h24v24H0V0z"/><path d="M0 0h24v24H0V0z" opacity=".87"/></g><path d="M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zM9 6c0-1.66 1.34-3 3-3s3 1.34 3 3v2H9V6zm9 14H6V10h12v10zm-6-3c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2z"/></svg>
\ No newline at end of file
diff --git a/public/popup.html b/public/popup.html
index 466de0bd..9cc97612 100644
--- a/public/popup.html
+++ b/public/popup.html
@@ -21,6 +21,9 @@
         <button class="sbSlimButton" id="refreshSegmentsButton" title="__MSG_refreshSegments__">
           <img id="refreshSegments" src="/icons/refresh.svg"/>
         </button>
+        <button class="sbSlimButton hidden" id="lockSegmentsButton">
+          <img id="LockSegments" src="/icons/lock.svg"/>
+        </button>
       </div>
       <div id="issueReporterContainer">
         <div id="issueReporterTimeButtons"></div>
diff --git a/src/content.ts b/src/content.ts
index 8f98edaa..12a2a9f2 100644
--- a/src/content.ts
+++ b/src/content.ts
@@ -1412,11 +1412,13 @@ function openInfoMenu() {
             const edit = <HTMLImageElement> popup.querySelector("#sbPopupIconEdit");
             const check = <HTMLImageElement> popup.querySelector("#sbPopupIconCheck");
             const refreshSegments = <HTMLImageElement> popup.querySelector("#refreshSegments");
+            const lockSegments = <HTMLImageElement> popup.querySelector("#lockSegments");
             logo.src = chrome.extension.getURL("icons/IconSponsorBlocker256px.png");
             settings.src = chrome.extension.getURL("icons/settings.svg");
             edit.src = chrome.extension.getURL("icons/pencil.svg");
             check.src = chrome.extension.getURL("icons/check.svg");
             refreshSegments.src = chrome.extension.getURL("icons/refresh.svg");
+            lockSegments.src = chrome.extension.getURL("icons/lock.svg");
 
             parentNode.insertBefore(popup, parentNode.firstChild);
 
diff --git a/src/popup.ts b/src/popup.ts
index 9efa790f..e1dac07b 100644
--- a/src/popup.ts
+++ b/src/popup.ts
@@ -103,6 +103,7 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
         "sponsorMessageTimes",
         //"downloadedSponsorMessageTimes",
         "refreshSegmentsButton",
+        "lockSegmentsButton",
         "whitelistButton",
         "sbDonate"
     ].forEach(id => PageElements[id] = document.getElementById(id));
@@ -133,6 +134,7 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
     PageElements.optionsButton.addEventListener("click", openOptions);
     PageElements.helpButton.addEventListener("click", openHelp);
     PageElements.refreshSegmentsButton.addEventListener("click", refreshSegments);
+    PageElements.lockSegmentsButton.addEventListener("click", lockSegments);
 
     /** If true, the content script is in the process of creating a new segment. */
     let creatingSegment = false;
@@ -158,53 +160,42 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
         PageElements.showNoticeAgain.style.display = "unset";
     }
 
-    utils.sendRequestToServer("GET", "/api/getUsername?userID=" + Config.config.userID, (res) => {
-        if (res.status === 200) {
-            PageElements.usernameValue.innerText = JSON.parse(res.responseText).userName
-        }
-    })
-
-    //get the amount of times this user has contributed and display it to thank them
-    if (Config.config.sponsorTimesContributed != undefined) {
-        PageElements.sponsorTimesContributionsDisplay.innerText = Config.config.sponsorTimesContributed.toLocaleString();
-        PageElements.sponsorTimesContributionsContainer.classList.remove("hidden");
-
-        //get the userID
-        const userID = Config.config.userID;
-        if (userID != undefined) {
-            //there are probably some views on these submissions then
-            //get the amount of views from the sponsors submitted
-            utils.sendRequestToServer("GET", "/api/getViewsForUser?userID=" + userID, function(response) {
-                if (response.status == 200) {
-                    const viewCount = JSON.parse(response.responseText).viewCount;
-                    if (viewCount != 0) {
-                        if (viewCount > 1) {
-                            PageElements.sponsorTimesViewsDisplayEndWord.innerText = chrome.i18n.getMessage("Segments");
-                        } else {
-                            PageElements.sponsorTimesViewsDisplayEndWord.innerText = chrome.i18n.getMessage("Segment");
-                        }
+    const userInfoRes = await utils.asyncRequestToServer("GET", "/api/userInfo?userID=" + Config.config.userID);
+    if (userInfoRes.ok) {
+        const userInfo = JSON.parse(userInfoRes.responseText);
 
-                        PageElements.sponsorTimesViewsDisplay.innerText = viewCount.toLocaleString();
-                        PageElements.sponsorTimesViewsContainer.style.display = "unset";
-                    }
+        if (userInfo.vip) PageElements.lockSegmentsButton.classList.remove("hidden");
+
+        PageElements.usernameValue.innerText = userInfo.userName;
+
+        //get the amount of times this user has contributed and display it to thank them
+        if (Config.config.sponsorTimesContributed != undefined) {
+            PageElements.sponsorTimesContributionsDisplay.innerText = Config.config.sponsorTimesContributed.toLocaleString();
+            PageElements.sponsorTimesContributionsContainer.classList.remove("hidden");
+
+            //get the userID
+            const viewCount = userInfo.viewCount;
+            if (viewCount != 0) {
+                if (viewCount > 1) {
+                    PageElements.sponsorTimesViewsDisplayEndWord.innerText = chrome.i18n.getMessage("Segments");
+                } else {
+                    PageElements.sponsorTimesViewsDisplayEndWord.innerText = chrome.i18n.getMessage("Segment");
                 }
-            });
 
-            //get this time in minutes
-            utils.sendRequestToServer("GET", "/api/getSavedTimeForUser?userID=" + userID, function(response) {
-                if (response.status == 200) {
-                    const minutesSaved = JSON.parse(response.responseText).timeSaved;
-                    if (minutesSaved != 0) {
-                        if (minutesSaved != 1) {
-                            PageElements.sponsorTimesOthersTimeSavedEndWord.innerText = chrome.i18n.getMessage("minsLower");
-                        } else {
-                            PageElements.sponsorTimesOthersTimeSavedEndWord.innerText = chrome.i18n.getMessage("minLower");
-                        }
+                PageElements.sponsorTimesViewsDisplay.innerText = viewCount.toLocaleString();
+                PageElements.sponsorTimesViewsContainer.style.display = "unset";
+            }
 
-                        PageElements.sponsorTimesOthersTimeSavedDisplay.innerText = getFormattedHours(minutesSaved);
-                    }
+            const minutesSaved = userInfo.minutesSaved;
+            if (minutesSaved != 0) {
+                if (minutesSaved != 1) {
+                    PageElements.sponsorTimesOthersTimeSavedEndWord.innerText = chrome.i18n.getMessage("minsLower");
+                } else {
+                    PageElements.sponsorTimesOthersTimeSavedEndWord.innerText = chrome.i18n.getMessage("minLower");
                 }
-            });
+
+                PageElements.sponsorTimesOthersTimeSavedDisplay.innerText = getFormattedHours(minutesSaved);
+            }
         }
     }
 
@@ -690,6 +681,10 @@ async function runThePopup(messageListener?: MessageListener): Promise<void> {
         );
     }
 
+    function lockSegments() {
+        alert("lock");
+    }
+
     /**
      * Should skipping be disabled (visuals stay)
      */