chore: Add background.js for timer functionality and manifest.json up…

…dates

background.js

@@ -1,11 +1,117 @@
-// Service Worker for Google Chrome Extension
-// Handles when extension is installed
-chrome.runtime.onInstalled.addListener(() => {
-    console.log('Extension installed');
-});
+var timerInterval;
+var startTime;
+var elapsedTime = 0;
+var isTimerRunning = false;
+var firstIntervalDuration = 20 * 1000; // 20 seconds
+var secondIntervalDuration = 10 * 1000; // 10 seconds
+
+// Function to start the timer
+function startTimer() {
+    chrome.storage.local.get(["startTime", "elapsedTime"], function(result) {
+        startTime = result.startTime || Date.now() + firstIntervalDuration;
+        elapsedTime = result.elapsedTime || 0;
+        if (elapsedTime > 0) {
+            startTime += elapsedTime;
+        }
+        timerInterval = setInterval(updateTimer, 1000);
+        isTimerRunning = true;
+    });
+}
+
+// Function to pause the timer
+function pauseTimer() {
+    clearInterval(timerInterval);
+    isTimerRunning = false;
+}
+
+// Function to resume the timer
+function resumeTimer() {
+    startTimer();
+}
+
+// Function to reset the timer
+function resetTimer() {
+    clearInterval(timerInterval);
+    elapsedTime = 0;
+    chrome.storage.local.set({ startTime: Date.now() + firstIntervalDuration, elapsedTime: 0 }, function() {
+        startTimer();
+    });
+}
+
+// Function to update the timer
+function updateTimer() {
+    try {
+        var currentTime = Date.now();
+        elapsedTime = startTime - currentTime;
+        if (elapsedTime <= 0) {
+            clearInterval(timerInterval);
+            // Send message to popup to show alert
+            chrome.runtime.sendMessage({ type: "updateTimer", time: "00:00:00" });
+            chrome.notifications.create("breakTimeNotification", {
+                type: "basic",
+                iconUrl: "images/hourglass.png",
+                title: "Take a break!",
+                message: "It's time to take a break. Look at something 20 feet away for 20 seconds."
+            });
+            // Start short break timer
+            startShortTimer();
+        } else {
+            // Send message to popup to update timer display
+            chrome.runtime.sendMessage({ type: "updateTimer", time: formatTime(elapsedTime) });
+        }
+    } catch (error) {
+        console.error(error);
+    }
+}
+
+// Function to start the short break timer
+function startShortTimer() {
+    startTime = Date.now() + secondIntervalDuration;
+    timerInterval = setInterval(updateShortTimer, 1000);
+}
+
+// Function to update the short break timer
+function updateShortTimer() {
+    var currentTime = Date.now();
+    elapsedTime = startTime - currentTime;
+    if (elapsedTime <= 0) {
+        clearInterval(timerInterval);
+        resetTimer();
+    }
+}
+
+// Function to format time
+function formatTime(time) {
+    var seconds = Math.floor((time / 1000) % 60);
+    var minutes = Math.floor((time / 1000 / 60) % 60);
+    var hours = Math.floor((time / 1000 / 60 / 60) % 24);
+
+    var formattedSeconds = seconds.toString().padStart(2, "0");
+    var formattedMinutes = minutes.toString().padStart(2, "0");
+    var formattedHours = hours.toString().padStart(2, "0");
+
+    return formattedHours + ":" + formattedMinutes + ":" + formattedSeconds;
+}
 
-// Handles when message is received
-chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
-    console.log('Message received:', message);
-    sendResponse("Message received");
+// Listen for messages from popup script
+chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
+    console.log(message);
+    switch (message.type) {
+        case "startTimer":
+            startTimer();
+            break;
+        case "pauseTimer":
+            pauseTimer();
+            break;
+        case "resumeTimer":
+            resumeTimer();
+            break;
+        case "resetTimer":
+            resetTimer();
+            break;
+        case "getTimerState":
+            sendResponse({ isTimerRunning: isTimerRunning, elapsedTime: elapsedTime });
+            chrome.runtime.sendMessage({ type: "updateTimer", time: formatTime(elapsedTime) });
+            break;
+    }
 });

manifest.json

@@ -6,9 +6,19 @@
     "permissions": [
         "tabs",
         "activeTab",
-        "storage"
+        "storage",
+        "notifications"
     ],
     "action": {
         "default_popup": "popup.html"
-    }
+    },
+    "background": {
+        "service_worker": "background.js"
+    },
+    "content_scripts": [
+        {
+            "matches": ["<all_urls>"],
+            "js": ["content_script.js"]
+        }
+    ]
 }

popup.js

@@ -4,132 +4,57 @@ var isTimerPaused = false;
 var startButton = document.getElementById("start");
 var resumeButton = document.getElementById("resume");
 var resetButton = document.getElementById("reset");
-var timerInterval;
-var startTime;
-var elapsedTime = 0;
 var isTimerRunning = false;
 
+// Listen for messages from background script
+chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
+    console.log(message);
+    if (message.type === "updateTimer") {
+        // Update timer display
+        timerElement.textContent = message.time;
+    }
+});
 
 function startTimer() {
     if (!isTimerRunning) {
-        startTime = localStorage.getItem("startTime") || Date.now() + 20 * 60 * 1000;
-        elapsedTime = localStorage.getItem("elapsedTime") || 0;
-        if (elapsedTime > 0) {
-            startTime += elapsedTime;
-        }
-        timerInterval = setInterval(updateTimer, 1000);
+        // Send message to background script to start the timer
+        chrome.runtime.sendMessage({ type: "startTimer" });
         isTimerRunning = true;
-        timerElement.textContent = formatTime(startTime - Date.now());
-    }
-}
-
-// Prevent the extension from closing on window click
-window.addEventListener("click", function(event) {
-    event.preventDefault();
-});
-
-// Prevent the extension from closing on tab switch
-window.addEventListener("visibilitychange", function(event) {
-    event.preventDefault();
-});
-
-// Keep the extension running even when the window is closed
-window.addEventListener("beforeunload", function(event) {
-    event.preventDefault();
-});
-
-function updateTimer() {
-    var currentTime = Date.now();
-    elapsedTime = startTime - currentTime;
-    if (elapsedTime <= 0) {
-        clearInterval(timerInterval);
-        timerElement.innerHTML = "00:00:00";
-        isTimerRunning = false;
-        // Show popup
-        alert("Take a 20-second break!");
-        // Start 20-second timer
-        startShortTimer();
-    } else {
-        var formattedTime = formatTime(elapsedTime);
-        timerElement.innerHTML = formattedTime;
-    }
-}
-
-function startShortTimer() {
-    startTime = Date.now() + 20 * 1000;
-    timerInterval = setInterval(updateShortTimer, 1000);
-    isTimerRunning = true;
-}
-
-function updateShortTimer() {
-    var currentTime = Date.now();
-    elapsedTime = startTime - currentTime;
-    if (elapsedTime <= 0) {
-        clearInterval(timerInterval);
-        timerElement.textContent = "00:00:00";
-        isTimerRunning = false;
-        // Update long timer in local storage
-        localStorage.setItem("startTime", Date.now() + 20 * 60 * 1000);
-        localStorage.setItem("elapsedTime", 0);
-        // Start the long timer again for 20 minutes
-        startTimer();
-    } else {
-        var formattedTime = formatTime(elapsedTime);
-        timerElement.textContent = formattedTime;
     }
 }
 
-
-function formatTime(time) {
-    var seconds = Math.floor((time / 1000) % 60);
-    var minutes = Math.floor((time / 1000 / 60) % 60);
-    var hours = Math.floor((time / 1000 / 60 / 60) % 24);
-
-    var formattedSeconds = seconds.toString().padStart(2, "0");
-    var formattedMinutes = minutes.toString().padStart(2, "0");
-    var formattedHours = hours.toString().padStart(2, "0");
-
-    return formattedHours + ":" + formattedMinutes + ":" + formattedSeconds;
-}
-
+startButton.addEventListener("click", startTimer);
 
 pauseButton.addEventListener("click", pauseTimer);
 
 function pauseTimer() {
     if (isTimerRunning) {
-        clearInterval(timerInterval);
-        isTimerRunning = false;
+        // Send message to background script to pause the timer
+        chrome.runtime.sendMessage({ type: "pauseTimer" });
         isTimerPaused = true;
     }
 }
 
+resumeButton.addEventListener("click", resumeTimer);
 
 function resumeTimer() {
-    if (!isTimerRunning && isTimerPaused) {
-        startTime = Date.now() + elapsedTime;
-        timerInterval = setInterval(updateTimer, 1000);
-        isTimerRunning = true;
+    if (isTimerPaused) {
+        // Send message to background script to resume the timer
+        chrome.runtime.sendMessage({ type: "resumeTimer" });
         isTimerPaused = false;
     }
 }
 
+resetButton.addEventListener("click", resetTimer);
+
 function resetTimer() {
-    clearInterval(timerInterval);
-    elapsedTime = 0;
-    timerElement.textContent = "00:00:00";
+    // Send message to background script to reset the timer
+    chrome.runtime.sendMessage({ type: "resetTimer" });
     isTimerRunning = false;
-    startTimer();
 }
 
-startButton.onclick = startTimer;
-resumeButton.addEventListener("click", resumeTimer);
-resetButton.addEventListener("click", resetTimer);
-
-// Save start time and elapsed time to localStorage
-window.addEventListener("beforeunload", function() {
-    localStorage.setItem("startTime", startTime);
-    localStorage.setItem("elapsedTime", elapsedTime);
-});
-
 // Start the timer when the page loads
-window.addEventListener("load", startTimer);
+window.addEventListener("load", function() {
+    // Send message to background script to get the current timer state
+    chrome.runtime.sendMessage({ type: "getTimerState" });
+});