From d41e90e120072acb99e1c9a37879c8458660b751 Mon Sep 17 00:00:00 2001 From: yungsamd17 Date: Sat, 6 Jan 2024 07:24:36 +0100 Subject: [PATCH 01/11] =?UTF-8?q?=F0=9F=94=A7Apply/save=20`colorInput`=20c?= =?UTF-8?q?olor=20instantly?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/js/settings.js | 40 ++++++++++++++++++++++++---------------- 1 file changed, 24 insertions(+), 16 deletions(-) diff --git a/src/js/settings.js b/src/js/settings.js index 3daecd5..30557cb 100644 --- a/src/js/settings.js +++ b/src/js/settings.js @@ -41,28 +41,36 @@ const colorInput = document.getElementById("colorInput"); console.log("Toggle Switch Status - Open in New Window:", openInNewWindowToggle.checked);*/ // Custom color badge input -colorInput.addEventListener("keydown", function (event) { - if (event.key === "Enter") { - const color = this.value.trim(); +colorInput.addEventListener("focus", function () { + this.addEventListener("input", handleColorInput); +}); + +colorInput.addEventListener("blur", function () { + this.removeEventListener("input", handleColorInput); +}); + +function handleColorInput() { + const color = this.value.trim(); + + // Check if the entered color is a valid HEX format and starts with "#" + if (/^#[0-9A-Fa-f]{6}$/.test(color) && color.startsWith("#") && color.length >= 7) { + // Clear any existing timeout + clearTimeout(this.timeoutId); - // Check if the entered color is a valid HEX format and starts with "#" - if (/^#[0-9A-Fa-f]{6}$/.test(color) && color.startsWith("#")) { + // Schedule the update after a delay (e.g., 100 milliseconds) + this.timeoutId = setTimeout(() => { chrome.storage.local.set({ customBadgeColor: color }, () => { // Update the badge color chrome.action.setBadgeBackgroundColor({ color }); }); - } else { - // If the input is invalid or empty, set to default color and clear the input - chrome.storage.local.set({ customBadgeColor: "" }, () => { - this.value = ""; - chrome.action.setBadgeBackgroundColor({ color: "#666666" }); - }); - } - - // Prevent the default form submission behavior - event.preventDefault(); + }, 100); + } else if (color.length === 0) { + // If the input is empty, set to default color + chrome.storage.local.set({ customBadgeColor: "" }, () => { + chrome.action.setBadgeBackgroundColor({ color: "#666666" }); + }); } -}); +} // Settings Modal var modal = document.getElementById("settingsModal"); From 0d3a05d6c191d5a881cf73de4e1a955f340130f9 Mon Sep 17 00:00:00 2001 From: yungsamd17 Date: Sat, 6 Jan 2024 14:11:39 +0100 Subject: [PATCH 02/11] =?UTF-8?q?=F0=9F=94=A7Added=20Stream=20`startedAt`?= =?UTF-8?q?=20date/time=20when=20hovering=20over=20uptime=20#10?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/js/background.js | 1 + src/js/main.js | 1 + src/js/util.js | 18 ++++++++++++++++++ 3 files changed, 20 insertions(+) diff --git a/src/js/background.js b/src/js/background.js index 92039c6..a66732c 100644 --- a/src/js/background.js +++ b/src/js/background.js @@ -188,6 +188,7 @@ const getLiveTwitchStreams = async () => { channelName: stream["user_name"], viewerCount: stream["viewer_count"], liveTime: getTimePassed(stream["started_at"]), + startedAt: getStartedAtTime(stream["started_at"]), })), }); diff --git a/src/js/main.js b/src/js/main.js index 6c860a1..8b677a7 100644 --- a/src/js/main.js +++ b/src/js/main.js @@ -105,6 +105,7 @@ const loadTwitchContent = async () => { const uptime = document.createElement("div"); uptime.setAttribute("class", "stream-uptime"); uptime.innerHTML = `${stream.liveTime}`; + uptime.setAttribute("title", `${stream.startedAt}`); streamThumbnail.appendChild(uptime); const thumbnail = document.createElement("img"); diff --git a/src/js/util.js b/src/js/util.js index 1b455c3..1442d44 100644 --- a/src/js/util.js +++ b/src/js/util.js @@ -1,3 +1,21 @@ +const getStartedAtTime = (startTime) => { + const options = { + year: 'numeric', + month: 'numeric', + day: 'numeric', + hour: 'numeric', + minute: 'numeric', + second: 'numeric', + hour12: true, + }; + + const formattedTime = new Intl.DateTimeFormat('en-US', options) + .format(new Date(startTime)) + .replace(',', ''); + + return formattedTime; +}; + const getTimePassed = (startTime) => { let elapsedTime = Date.now() - Date.parse(startTime); const hours = Math.floor(elapsedTime / 3600000); From 9be6195cca0f79491fef845fdf38cbf57b54f85a Mon Sep 17 00:00:00 2001 From: yungsamd17 Date: Sat, 6 Jan 2024 14:23:58 +0100 Subject: [PATCH 03/11] =?UTF-8?q?=F0=9F=94=A7Update=20player=20info=20icon?= =?UTF-8?q?=20link?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- popup.html | 2 +- src/css/tooltips.css | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/popup.html b/popup.html index 55271cd..348e9a1 100644 --- a/popup.html +++ b/popup.html @@ -65,7 +65,7 @@

Settings

- Open streams in player + Open streams in player