From a99e384a02ec0cfbbe8b4ae0268b022a754237a2 Mon Sep 17 00:00:00 2001
From: Mike Singleton <MS1674@gmail.com>
Date: Tue, 18 Apr 2023 17:33:17 -0400
Subject: [PATCH 1/3] v1.1.6 init commit

Fixes duplicate injection bug
Adds pause buttons to action menu (in progress)
Adds website link in action menu
---
 app/extension/html/popup.html | 29 +++++++++++++++++--
 app/manifest.json             |  2 +-
 app/scripts.babel/inject.js   |  2 +-
 app/scripts.babel/popup.js    | 53 ++++++++++++++++++++++++++++++++++-
 app/scripts.babel/settings.js |  3 +-
 app/styles/popup.css          | 16 +++++++++--
 6 files changed, 97 insertions(+), 8 deletions(-)

diff --git a/app/extension/html/popup.html b/app/extension/html/popup.html
index 76fe283..4ef20a9 100644
--- a/app/extension/html/popup.html
+++ b/app/extension/html/popup.html
@@ -22,13 +22,28 @@
             </svg>
         </div>
         <div id="popupBox">
-            <div class="if">
+            <div id="if-title" class="if" style="cursor: pointer;">
                 Internet Friends
             </div>
             <div id="website" class="website">
                 website.com
             </div>
-            <table class="table">
+            <table id="paused" class="table">
+                <tr>
+                    <td>
+                        Internet Friends is paused:
+                        <span id="countdownTimer"></span>
+                    </td>
+                </tr>
+                <tr>
+                    <td>
+                        <button id="reenableButton" class="reenableButton">
+                            Re-Enable Internet Friends
+                        </button>
+                    </td>
+                </tr>
+            </table>
+            <table id="settings" class="table" style="display: hidden">
                 <tr>
                     <td>
                         Enable for this website
@@ -61,6 +76,16 @@
                         </button>
                     </td>
                 </tr>
+                <tr>
+                    <td>
+                        Pause Extension   
+                        <div style="display: flex;">
+                            <button id="pause15m" class="pauseButton">15m</button>
+                            <button id="pause3h" class="pauseButton">3h</button>
+                            <button id="pause24h" class="pauseButton">24h</button>
+                        </div>
+                    </td>
+                </tr>
             </table>
             <div id="refresh" class="refresh">
                 Refresh for changes to take effect
diff --git a/app/manifest.json b/app/manifest.json
index 58d7fe3..0829561 100644
--- a/app/manifest.json
+++ b/app/manifest.json
@@ -1,6 +1,6 @@
 {
     "name": "__MSG_appName__",
-    "version": "1.1.5",
+    "version": "1.1.6",
     "manifest_version": 3,
     "description": "__MSG_appDescription__",
     "icons": {
diff --git a/app/scripts.babel/inject.js b/app/scripts.babel/inject.js
index 652b4b1..5aaec71 100644
--- a/app/scripts.babel/inject.js
+++ b/app/scripts.babel/inject.js
@@ -230,7 +230,7 @@ if (isWebRTCSupported) {
             // else, init now
             Inject.tryInit();
         }
-    }, false);
+    }, { once: true });
 } else {
     console.log("InternetFriends does not work without WebRTC support!"); // use console log here so it's logged regardless of whether general logging is enabled
 }
\ No newline at end of file
diff --git a/app/scripts.babel/popup.js b/app/scripts.babel/popup.js
index f60aa36..a93a66c 100644
--- a/app/scripts.babel/popup.js
+++ b/app/scripts.babel/popup.js
@@ -3,13 +3,15 @@
 var Popup = (function() {
     // variables ----------------------------------------------------------------
     var _this = {},
+        _title = null,
         _website = null,
         _websiteUrl = null,
         _enableForSite = null,
         _enableChat = null,
         _keyComboInput = null,
         _settingsTimeout = null,
-        _userColor = null;
+        _userColor = null,
+        _pauseButtons = null;
 
     // initialize ---------------------------------------------------------------
     _this.init = function() {
@@ -20,10 +22,18 @@ var Popup = (function() {
 
         // Get document elements
 
+        _title = document.getElementById('if-title');
         _website = document.getElementById('website');
         _enableForSite = document.getElementById('enableForSite');
         _enableChat = document.getElementById('enableChat');
         _keyComboInput = document.getElementById('keyComboInput');
+        _pauseButtons = document.querySelectorAll(".pauseButton");
+
+        // Set website click event
+
+        _title.addEventListener('click', function () {
+            window.open('https://internetfriends.social', '_blank');
+        });
 
         // Populate values
         
@@ -102,6 +112,10 @@ var Popup = (function() {
 
         _cursorColorButton.addEventListener("click", onCursorButtonClicked);
         _colorWheelContainerBackground.addEventListener("click", onPopupContainerClicked);
+
+        // Handle Pause Timer
+
+        setupPauseButtons();
     };
 
     // private functions --------------------------------------------------------
@@ -208,6 +222,43 @@ var Popup = (function() {
         _refreshText.style.visibility = "visible";
     };
 
+    function setupPauseButtons() {
+        _pauseButtons.forEach(button => {
+            button.addEventListener("click", function() {
+              const duration = button.id === "pause15m" ? 15 * 60 * 1000 :      // 15m
+                               button.id === "pause3h" ? 3 * 60 * 60 * 1000 :   // 3h
+                               24 * 60 * 60 * 1000;                             // 24hr
+        
+              // Clear any existing countdown
+              if (countdown) {
+                clearTimeout(countdown);
+              }
+        
+              const endTime = new Date().getTime() + duration;
+              timerContainer.classList.remove("hidden");
+        
+              // Update the countdown timer
+              function updateCountdown() {
+                const timeLeft = endTime - new Date().getTime();
+                
+                if (timeLeft <= 0) {
+                  timerContainer.classList.add("hidden");
+                  clearTimeout(countdown);
+                } else {
+                  const hours = Math.floor(timeLeft / (60 * 60 * 1000));
+                  const minutes = Math.floor((timeLeft % (60 * 60 * 1000)) / (60 * 1000));
+                  const seconds = Math.floor((timeLeft % (60 * 1000)) / 1000);
+        
+                  countdownTimer.textContent = `${hours}h ${minutes}m ${seconds}s`;
+                  countdown = setTimeout(updateCountdown, 1000);
+                }
+              }
+        
+              updateCountdown();
+            });
+          });
+    }
+
     return _this;
 }());
 
diff --git a/app/scripts.babel/settings.js b/app/scripts.babel/settings.js
index b8336de..2cd8f06 100644
--- a/app/scripts.babel/settings.js
+++ b/app/scripts.babel/settings.js
@@ -66,7 +66,8 @@ var IFEvents = new EventTarget();
             combo: _defaultCombo,
             disabledSites: {},
             enableChat: true,
-            userColor: getRandomIroColor()
+            userColor: getRandomIroColor(),
+            pausedUntil: 
         }
         
         IFEvents.dispatchEvent(initEvent);
diff --git a/app/styles/popup.css b/app/styles/popup.css
index 0a7b7dc..53d094c 100644
--- a/app/styles/popup.css
+++ b/app/styles/popup.css
@@ -9,7 +9,7 @@
 body {
   text-align: center;
   width: 314px;
-  height: 282px;
+  height: 318px;
   overflow: hidden;
   margin: auto;
   user-select: none;
@@ -18,7 +18,7 @@ body {
 .popupContainer {
   position: absolute;
   width: 314px;
-  height: 282px;
+  height: 318px;
 }
 
 table {
@@ -111,6 +111,18 @@ td {
   cursor: pointer;
 }
 
+.pauseButton {
+  font-size: 10px;
+  font-weight: bold;
+  width: 30px;
+  height: 30px;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+  font-family: "Open Sans",Verdana,Geneva,Tahoma,sans-serif;
+  margin-left: 5px;
+}
+
 .popup {
   position: relative;
   display: inline-block;

From 0e1af6c393840a8c18179302367d04cadeed8aeb Mon Sep 17 00:00:00 2001
From: Mike Singleton <MS1674@gmail.com>
Date: Tue, 18 Apr 2023 20:38:45 -0400
Subject: [PATCH 2/3] Completes pause feature

---
 app/extension/html/popup.html |  25 ++++++--
 app/scripts.babel/inject.js   |   8 ++-
 app/scripts.babel/popup.js    | 110 +++++++++++++++++++++++++---------
 app/scripts.babel/settings.js |   5 +-
 app/styles/popup.css          |  11 ++++
 5 files changed, 122 insertions(+), 37 deletions(-)

diff --git a/app/extension/html/popup.html b/app/extension/html/popup.html
index 4ef20a9..62b33f7 100644
--- a/app/extension/html/popup.html
+++ b/app/extension/html/popup.html
@@ -28,22 +28,37 @@
             <div id="website" class="website">
                 website.com
             </div>
-            <table id="paused" class="table">
+            <table id="pauseTable" class="table">
+                <tr>
+                    <td>
+                        Internet Friends is paused...
+                    </td>
+                </tr>
                 <tr>
                     <td>
-                        Internet Friends is paused:
                         <span id="countdownTimer"></span>
                     </td>
                 </tr>
+                <tr><td></td></tr>
+                <tr>
+                    <td style="justify-content: space-between;">
+                        Add Time
+                        <div style="display: flex;">
+                            <button id="pause15m" class="pauseButton">15m</button>
+                            <button id="pause3h" class="pauseButton">3h</button>
+                            <button id="pause24h" class="pauseButton">24h</button>
+                        </div>
+                    </td>
+                </tr>
                 <tr>
                     <td>
-                        <button id="reenableButton" class="reenableButton">
-                            Re-Enable Internet Friends
+                        <button id="unpauseButton" class="unpauseButton">
+                            Unpause Internet Friends
                         </button>
                     </td>
                 </tr>
             </table>
-            <table id="settings" class="table" style="display: hidden">
+            <table id="settingsTable" class="table" style="display: hidden">
                 <tr>
                     <td>
                         Enable for this website
diff --git a/app/scripts.babel/inject.js b/app/scripts.babel/inject.js
index 5aaec71..082ece8 100644
--- a/app/scripts.babel/inject.js
+++ b/app/scripts.babel/inject.js
@@ -47,11 +47,17 @@ var Inject = (function() {
 
     _this.init = function() {
         Logger.log(`Internet Friends Initializing Room "${window.location.host + window.location.pathname} : ${document.title}"`);
+        
+        // if InternetFriends is paused, return
+        if (IFSettings.pausedUntil > Date.now()) {
+            Logger.log('Internet Friends is paused. Exiting.');
+            return;
+        }
 
         // if websiteUrl is present in disabledSites, InternetFriends is disabled for this site, return
         let websiteUrl = window.location.host;
         if (IFSettings.disabledSites[websiteUrl]) {
-            Logger.log('Website is disabled. Exiting.');
+            Logger.log('Website is disabled in Internet Friends settings. Exiting.');
             return;
         }
 
diff --git a/app/scripts.babel/popup.js b/app/scripts.babel/popup.js
index a93a66c..2a13db2 100644
--- a/app/scripts.babel/popup.js
+++ b/app/scripts.babel/popup.js
@@ -3,6 +3,7 @@
 var Popup = (function() {
     // variables ----------------------------------------------------------------
     var _this = {},
+        _settingsTable = null,
         _title = null,
         _website = null,
         _websiteUrl = null,
@@ -11,7 +12,10 @@ var Popup = (function() {
         _keyComboInput = null,
         _settingsTimeout = null,
         _userColor = null,
-        _pauseButtons = null;
+        _pauseTable = null,
+        _countdownTimeout = null,
+        _pausedUntil = null,
+        _pausedUntilTimeout = null;
 
     // initialize ---------------------------------------------------------------
     _this.init = function() {
@@ -27,7 +31,8 @@ var Popup = (function() {
         _enableForSite = document.getElementById('enableForSite');
         _enableChat = document.getElementById('enableChat');
         _keyComboInput = document.getElementById('keyComboInput');
-        _pauseButtons = document.querySelectorAll(".pauseButton");
+        _pauseTable = document.getElementById('pauseTable');
+        _settingsTable = document.getElementById('settingsTable');
 
         // Set website click event
 
@@ -115,7 +120,18 @@ var Popup = (function() {
 
         // Handle Pause Timer
 
+        _pausedUntil = IFSettings.pausedUntil
         setupPauseButtons();
+
+        // Handle Table Display
+
+        // if currently paused
+        if (_pausedUntil > Date.now()) {
+            _settingsTable.classList.add("hidden");
+            updateCountdown();
+        } else {
+            _pauseTable.classList.add("hidden");
+        }
     };
 
     // private functions --------------------------------------------------------
@@ -222,41 +238,77 @@ var Popup = (function() {
         _refreshText.style.visibility = "visible";
     };
 
+    function updateCountdown() {
+        var countdownTimer = document.getElementById('countdownTimer');
+        const timeLeft = _pausedUntil - new Date().getTime();
+        
+        if (timeLeft <= 0) {
+            _pauseTable.classList.add("hidden");
+            _settingsTable.classList.remove("hidden");
+            clearTimeout(_countdownTimeout);
+        } else {
+            const days = Math.floor(timeLeft / (24 * 60 * 60 * 1000));
+            const hours = Math.floor((timeLeft % (24 * 60 * 60 * 1000)) / (60 * 60 * 1000));
+            const minutes = Math.floor((timeLeft % (60 * 60 * 1000)) / (60 * 1000));
+            const seconds = Math.floor((timeLeft % (60 * 1000)) / 1000);
+
+            countdownTimer.textContent = `${days}d ${hours}h ${minutes}m ${seconds}s`;                
+            _countdownTimeout = setTimeout(updateCountdown, 1000);
+        }
+    }
+
     function setupPauseButtons() {
-        _pauseButtons.forEach(button => {
-            button.addEventListener("click", function() {
-              const duration = button.id === "pause15m" ? 15 * 60 * 1000 :      // 15m
-                               button.id === "pause3h" ? 3 * 60 * 60 * 1000 :   // 3h
-                               24 * 60 * 60 * 1000;                             // 24hr
+        var pauseButtons = document.querySelectorAll(".pauseButton");
+        var unpauseButton = document.getElementById('unpauseButton');
         
-              // Clear any existing countdown
-              if (countdown) {
-                clearTimeout(countdown);
-              }
+        pauseButtons.forEach(button => {
+            button.addEventListener("click", function() {
+                const duration = button.id === "pause15m" ? 15 * 60 * 1000 :      // 15m
+                                button.id === "pause3h" ? 3 * 60 * 60 * 1000 :   // 3h
+                                24 * 60 * 60 * 1000;                             // 24hr
         
-              const endTime = new Date().getTime() + duration;
-              timerContainer.classList.remove("hidden");
+                // Clear any existing countdown
+                if (_countdownTimeout) {
+                clearTimeout(_countdownTimeout);
+                }
         
-              // Update the countdown timer
-              function updateCountdown() {
-                const timeLeft = endTime - new Date().getTime();
-                
-                if (timeLeft <= 0) {
-                  timerContainer.classList.add("hidden");
-                  clearTimeout(countdown);
+                // If extension is already paused
+                if (_pausedUntil > new Date().getTime()) {
+                    // Add time
+                    _pausedUntil += duration
                 } else {
-                  const hours = Math.floor(timeLeft / (60 * 60 * 1000));
-                  const minutes = Math.floor((timeLeft % (60 * 60 * 1000)) / (60 * 1000));
-                  const seconds = Math.floor((timeLeft % (60 * 1000)) / 1000);
-        
-                  countdownTimer.textContent = `${hours}h ${minutes}m ${seconds}s`;
-                  countdown = setTimeout(updateCountdown, 1000);
+                    // Set time
+                    _pausedUntil = new Date().getTime() + duration
+
+                    // Set refresh text
+                    var _refreshText = document.getElementById('refresh');
+                    _refreshText.style.visibility = "visible";
                 }
-              }
+
+                // use timeout to prevent settings from being updated too quickly
+                if (_pausedUntilTimeout)
+                    clearTimeout(_pausedUntilTimeout);
+                _pausedUntilTimeout = setTimeout(updatePausedUntil, 100);
+                _pauseTable.classList.remove("hidden");
+                _settingsTable.classList.add("hidden");
         
-              updateCountdown();
+                updateCountdown();
             });
-          });
+        });
+
+        unpauseButton.addEventListener("click", function() {
+            _pausedUntil = -1
+            updatePausedUntil();
+            _pauseTable.classList.add("hidden");
+            _settingsTable.classList.remove("hidden");
+            
+            var _refreshText = document.getElementById('refresh');
+            _refreshText.style.visibility = "visible";
+        });
+    }
+
+    function updatePausedUntil () {
+        chrome.storage.sync.set({'pausedUntil': _pausedUntil});
     }
 
     return _this;
diff --git a/app/scripts.babel/settings.js b/app/scripts.babel/settings.js
index 2cd8f06..3624464 100644
--- a/app/scripts.babel/settings.js
+++ b/app/scripts.babel/settings.js
@@ -34,7 +34,8 @@ var IFEvents = new EventTarget();
                 combo: storedSettings?.combo || _defaultCombo,
                 disabledSites: storedSettings?.disabledSites || {},
                 enableChat: storedSettings?.enableChat === true || storedSettings?.enableChat === undefined,
-                userColor: storedSettings?.userColor || getRandomIroColor()
+                userColor: storedSettings?.userColor || getRandomIroColor(),
+                pausedUntil: storedSettings?.pausedUntil || -1
             }
 
             // set new settings
@@ -67,7 +68,7 @@ var IFEvents = new EventTarget();
             disabledSites: {},
             enableChat: true,
             userColor: getRandomIroColor(),
-            pausedUntil: 
+            pausedUntil: -1
         }
         
         IFEvents.dispatchEvent(initEvent);
diff --git a/app/styles/popup.css b/app/styles/popup.css
index 53d094c..eceda2f 100644
--- a/app/styles/popup.css
+++ b/app/styles/popup.css
@@ -15,6 +15,10 @@ body {
   user-select: none;
 }
 
+.hidden {
+  display: none;
+}
+
 .popupContainer {
   position: absolute;
   width: 314px;
@@ -34,9 +38,16 @@ td {
   height: 34px;
   align-items: center;
   display: flex;
+}
+
+#settingsTable td {
   justify-content: space-between;
 }
 
+#pauseTable td {
+  justify-content: center;
+}
+
 #keyComboInput {
   width: 146px;
 }

From b4a763377bd4974527645a8cafda8041264f748f Mon Sep 17 00:00:00 2001
From: Mike Singleton <MS1674@gmail.com>
Date: Tue, 18 Apr 2023 20:44:07 -0400
Subject: [PATCH 3/3] Fixes capitalization

---
 app/extension/html/popup.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/extension/html/popup.html b/app/extension/html/popup.html
index 62b33f7..e0123a0 100644
--- a/app/extension/html/popup.html
+++ b/app/extension/html/popup.html
@@ -93,7 +93,7 @@
                 </tr>
                 <tr>
                     <td>
-                        Pause Extension   
+                        Pause extension   
                         <div style="display: flex;">
                             <button id="pause15m" class="pauseButton">15m</button>
                             <button id="pause3h" class="pauseButton">3h</button>