diff --git a/submissions/AFK Timer & Stopwatch/icon.png b/submissions/AFK Timer & Stopwatch/icon.png new file mode 100644 index 00000000..2c53f3b8 Binary files /dev/null and b/submissions/AFK Timer & Stopwatch/icon.png differ diff --git a/submissions/AFK Timer & Stopwatch/manifest.json b/submissions/AFK Timer & Stopwatch/manifest.json new file mode 100644 index 00000000..c9b63eb9 --- /dev/null +++ b/submissions/AFK Timer & Stopwatch/manifest.json @@ -0,0 +1,22 @@ +{ + "manifest_version": 3, + "name": "AFK Timer & Stopwatch", + "version": "1.0", + "description": "A simple timer and stopwatch extension", + "action": { + "default_popup": "popup.html", + "default_icon": { + "128": "icon.png" + } + }, + "icons": { + "256": "icon.png" + }, + "permissions": [], + "browser_specific_settings": { + "gecko": { + "id": "timer@yourdomain.com" + } + } + } + diff --git a/submissions/AFK Timer & Stopwatch/popup.css b/submissions/AFK Timer & Stopwatch/popup.css new file mode 100644 index 00000000..f6cfb34a --- /dev/null +++ b/submissions/AFK Timer & Stopwatch/popup.css @@ -0,0 +1,105 @@ +body { + font-family: Arial, sans-serif; + margin: 0; + padding: 0; + background-color: #f5f5f5; + } + + .container { + width: 300px; + padding: 15px; + box-sizing: border-box; + } + + .title { + text-align: center; + margin-top: 0; + margin-bottom: 15px; + color: #333; + } + + .tabs { + display: flex; + margin-bottom: 15px; + border-bottom: 1px solid #ddd; + } + + .tab-btn { + flex: 1; + background-color: #f5f5f5; + border: none; + padding: 8px; + cursor: pointer; + transition: background-color 0.3s; + } + + .tab-btn.active { + background-color: #e0e0e0; + font-weight: bold; + } + + .section { + display: none; + padding: 10px; + background-color: white; + border-radius: 5px; + box-shadow: 0 2px 5px rgba(0,0,0,0.1); + } + + .section.active { + display: block; + } + + .display { + font-size: 2.5rem; + text-align: center; + margin: 15px 0; + font-family: monospace; + } + + .controls { + display: flex; + justify-content: space-between; + } + + button { + padding: 8px 15px; + background-color: #4285f4; + color: black; + border: none; + border-radius: 4px; + cursor: pointer; + transition: background-color 0.3s; + font-family: monospace; + } + + button:hover { + background-color: #3367d6; + color: white; + } + + button:disabled { + background-color: #cccccc; + cursor: not-allowed; + } + + .input-group { + display: flex; + justify-content: center; + align-items: center; + margin-top: 10px; + } + + input[type="number"] { + width: 60px; + padding: 8px; + text-align: center; + font-size: 1.2rem; + border: 1px solid #ddd; + border-radius: 4px; + } + + .input-group span { + margin: 0 5px; + font-size: 1.5rem; + } \ No newline at end of file diff --git a/submissions/AFK Timer & Stopwatch/popup.html b/submissions/AFK Timer & Stopwatch/popup.html new file mode 100644 index 00000000..39bb8b5c --- /dev/null +++ b/submissions/AFK Timer & Stopwatch/popup.html @@ -0,0 +1,46 @@ + + + + AFK Timer & Stopwatch + + + +
+

AFK Timer & Stopwatch

+ +
+ + +
+ +
+
00:00:00
+
+ + + +
+
+ +
+
+ + : + + : + +
+
00:00:00
+
+ + + +
+
+
+ + + + + + \ No newline at end of file diff --git a/submissions/AFK Timer & Stopwatch/popup.js b/submissions/AFK Timer & Stopwatch/popup.js new file mode 100644 index 00000000..038bb1a6 --- /dev/null +++ b/submissions/AFK Timer & Stopwatch/popup.js @@ -0,0 +1,141 @@ +document.addEventListener('DOMContentLoaded', function() { + // Tab switching + const stopwatchTab = document.getElementById('stopwatch-tab'); + const timerTab = document.getElementById('timer-tab'); + const stopwatchSection = document.getElementById('stopwatch-section'); + const timerSection = document.getElementById('timer-section'); + + stopwatchTab.addEventListener('click', function() { + stopwatchTab.classList.add('active'); + timerTab.classList.remove('active'); + stopwatchSection.classList.add('active'); + timerSection.classList.remove('active'); + }); + + timerTab.addEventListener('click', function() { + timerTab.classList.add('active'); + stopwatchTab.classList.remove('active'); + timerSection.classList.add('active'); + stopwatchSection.classList.remove('active'); + }); + + // Stopwatch functionality + const stopwatchDisplay = document.getElementById('stopwatch-display'); + const stopwatchStartBtn = document.getElementById('stopwatch-start'); + const stopwatchPauseBtn = document.getElementById('stopwatch-pause'); + const stopwatchResetBtn = document.getElementById('stopwatch-reset'); + + let stopwatchInterval; + let stopwatchSeconds = 0; + + function updateStopwatchDisplay() { + const hours = Math.floor(stopwatchSeconds / 3600); + const minutes = Math.floor((stopwatchSeconds % 3600) / 60); + const seconds = stopwatchSeconds % 60; + + stopwatchDisplay.textContent = + (hours < 10 ? '0' + hours : hours) + ':' + + (minutes < 10 ? '0' + minutes : minutes) + ':' + + (seconds < 10 ? '0' + seconds : seconds); + } + + stopwatchStartBtn.addEventListener('click', function() { + stopwatchInterval = setInterval(function() { + stopwatchSeconds++; + updateStopwatchDisplay(); + }, 1000); + + stopwatchStartBtn.disabled = true; + stopwatchPauseBtn.disabled = false; + }); + + stopwatchPauseBtn.addEventListener('click', function() { + clearInterval(stopwatchInterval); + stopwatchStartBtn.disabled = false; + stopwatchPauseBtn.disabled = true; + }); + + stopwatchResetBtn.addEventListener('click', function() { + clearInterval(stopwatchInterval); + stopwatchSeconds = 0; + updateStopwatchDisplay(); + stopwatchStartBtn.disabled = false; + stopwatchPauseBtn.disabled = true; + }); + + // Timer functionality + const timerDisplay = document.getElementById('timer-display'); + const timerStartBtn = document.getElementById('timer-start'); + const timerPauseBtn = document.getElementById('timer-pause'); + const timerResetBtn = document.getElementById('timer-reset'); + const hoursInput = document.getElementById('hours'); + const minutesInput = document.getElementById('minutes'); + const secondsInput = document.getElementById('seconds'); + + let timerInterval; + let timerSeconds = 0; + let initialTimerSeconds = 0; + + function updateTimerDisplay() { + const hours = Math.floor(timerSeconds / 3600); + const minutes = Math.floor((timerSeconds % 3600) / 60); + const seconds = timerSeconds % 60; + + timerDisplay.textContent = + (hours < 10 ? '0' + hours : hours) + ':' + + (minutes < 10 ? '0' + minutes : minutes) + ':' + + (seconds < 10 ? '0' + seconds : seconds); + } + + timerStartBtn.addEventListener('click', function() { + if (timerSeconds === 0) { + // Get time from inputs + const hours = parseInt(hoursInput.value) || 0; + const minutes = parseInt(minutesInput.value) || 0; + const seconds = parseInt(secondsInput.value) || 0; + + initialTimerSeconds = timerSeconds = hours * 3600 + minutes * 60 + seconds; + + if (timerSeconds === 0) { + alert('Please set a time for the timer'); + return; + } + } + + timerInterval = setInterval(function() { + if (timerSeconds > 0) { + timerSeconds--; + updateTimerDisplay(); + } else { + clearInterval(timerInterval); + alert('Timer completed!'); + timerStartBtn.disabled = false; + timerPauseBtn.disabled = true; + } + }, 1000); + + timerStartBtn.disabled = true; + timerPauseBtn.disabled = false; + }); + + timerPauseBtn.addEventListener('click', function() { + clearInterval(timerInterval); + timerStartBtn.disabled = false; + timerPauseBtn.disabled = true; + }); + + timerResetBtn.addEventListener('click', function() { + clearInterval(timerInterval); + timerSeconds = 0; + updateTimerDisplay(); + hoursInput.value = 0; + minutesInput.value = 0; + secondsInput.value = 0; + timerStartBtn.disabled = false; + timerPauseBtn.disabled = true; + }); + + // Initialize displays + updateStopwatchDisplay(); + updateTimerDisplay(); + }); \ No newline at end of file