diff --git a/inject.js b/inject.js index af5cd84..a100184 100644 --- a/inject.js +++ b/inject.js @@ -121,7 +121,7 @@ var controllerButtonDefs = { faster: { label: "", className: "" }, advance: { label: "", className: "rw" }, display: { label: "", className: "hideButton" }, - reset: { label: "", className: "" }, + reset: { label: "\u21BB", className: "" }, fast: { label: "", className: "" }, settings: { label: "", className: "" }, pause: { label: "", className: "" }, @@ -778,6 +778,15 @@ function setSubtitleNudgeEnabledForVideo(video, enabled) { function subtitleNudgeIconMarkup(isEnabled) { var action = isEnabled ? "subtitleNudgeOn" : "subtitleNudgeOff"; + var custom = + tc.settings.customButtonIcons && + tc.settings.customButtonIcons[action] && + tc.settings.customButtonIcons[action].svg; + if (custom) { + return ( + '" + ); + } if (typeof vscIconSvgString !== "function") { return isEnabled ? "✓" : "×"; } @@ -1367,6 +1376,7 @@ chrome.storage.sync.get(tc.settings, function (storage) { btn.textContent = (cdf2 && cdf2.label) || "?"; } }); + updateSubtitleNudgeIndicator(video); }); } }); diff --git a/manifest.json b/manifest.json index aa94588..63e22e0 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "name": "Speeder", "short_name": "Speeder", - "version": "5.1.3", + "version": "5.1.4", "manifest_version": 2, "description": "Speed up, slow down, advance and rewind HTML5 audio/video with shortcuts (New and improved version of \"Video Speed Controller\")", "homepage_url": "https://github.com/SoPat712/speeder", diff --git a/options.css b/options.css index f766c6b..9119cb5 100644 --- a/options.css +++ b/options.css @@ -545,6 +545,51 @@ label em { flex-shrink: 0; } +.cb-icon.cb-icon-nudge-pair { + width: auto; + min-width: 0; + padding: 0 4px; + gap: 4px; + background: transparent; + border: none; +} + +.cb-nudge-chip { + display: inline-flex; + align-items: center; + justify-content: center; + width: 22px; + height: 22px; + border-radius: 6px; + flex-shrink: 0; + color: #fff; +} + +.cb-nudge-chip[data-nudge-state="on"] { + background: #4b9135; + border: 1px solid #6ec754; +} + +.cb-nudge-chip[data-nudge-state="off"] { + background: #943e3e; + border: 1px solid #c06060; +} + +.cb-nudge-chip .vsc-btn-icon svg, +.cb-nudge-chip svg { + width: 14px; + height: 14px; + flex-shrink: 0; +} + +.cb-nudge-sep { + font-size: 11px; + font-weight: 600; + opacity: 0.45; + color: var(--text); + flex-shrink: 0; +} + .row-lucide-pair select { justify-self: end; } diff --git a/options.html b/options.html index 385b676..3d5be8d 100644 --- a/options.html +++ b/options.html @@ -382,9 +382,11 @@ rel="noopener noreferrer" >Lucide - set (fetched from jsDelivr). Chosen SVGs are cached in local - storage and included in settings export. - Reset speed stays numeric text only. + set (fetched from jsDelivr). Custom icons are cached in local + storage and included when you export settings. Subtitle nudge + icons use two menu entries (enabled and disabled), not the bar + block id + nudge.

diff --git a/options.js b/options.js index 03e6b77..e280f1e 100644 --- a/options.js +++ b/options.js @@ -138,7 +138,7 @@ var controllerButtonDefs = { faster: { icon: "+", name: "Increase speed" }, advance: { icon: "\u00BB", name: "Advance" }, display: { icon: "\u00D7", name: "Close controller" }, - reset: { icon: "", name: "Reset speed" }, + reset: { icon: "\u21BB", name: "Reset speed" }, fast: { icon: "\u2605", name: "Preferred speed" }, nudge: { icon: "\u2713", name: "Subtitle nudge" }, settings: { icon: "\u2699", name: "Settings" }, @@ -149,6 +149,12 @@ var controllerButtonDefs = { }; var popupExcludedButtonIds = new Set(["settings"]); +/** Lucide picker only — not control-bar blocks (chip uses subtitleNudgeOn/Off). */ +var lucideSubtitleNudgeActionLabels = { + subtitleNudgeOn: "Subtitle nudge — enabled", + subtitleNudgeOff: "Subtitle nudge — disabled" +}; + function sanitizePopupButtonOrder(buttonIds) { if (!Array.isArray(buttonIds)) return []; var seen = new Set(); @@ -166,6 +172,39 @@ var customButtonIconsLive = {}; function fillControlBarIconElement(icon, buttonId) { if (!icon || !buttonId) return; + if (buttonId === "nudge") { + icon.innerHTML = ""; + icon.className = "cb-icon cb-icon-nudge-pair"; + function nudgeChipMarkup(action) { + var c = customButtonIconsLive[action]; + if (c && c.svg) return c.svg; + if (typeof vscIconSvgString === "function") { + return vscIconSvgString(action, 14) || ""; + } + return ""; + } + function appendChip(action, stateKey) { + var sp = document.createElement("span"); + sp.className = "cb-nudge-chip"; + sp.setAttribute("data-nudge-state", stateKey); + var inner = nudgeChipMarkup(action); + if (inner) { + var wrap = document.createElement("span"); + wrap.className = "vsc-btn-icon"; + wrap.innerHTML = inner; + sp.appendChild(wrap); + } + icon.appendChild(sp); + } + appendChip("subtitleNudgeOn", "on"); + var sep = document.createElement("span"); + sep.className = "cb-nudge-sep"; + sep.textContent = "/"; + icon.appendChild(sep); + appendChip("subtitleNudgeOff", "off"); + return; + } + icon.className = "cb-icon"; var custom = customButtonIconsLive[buttonId]; if (custom && custom.svg) { icon.innerHTML = custom.svg; @@ -1357,7 +1396,16 @@ function initLucideButtonIconsUI() { actionSel.dataset.lucideInit = "1"; actionSel.innerHTML = ""; Object.keys(controllerButtonDefs).forEach(function (aid) { - if (aid === "reset") return; + if (aid === "nudge") { + Object.keys(lucideSubtitleNudgeActionLabels).forEach(function (subId) { + var o2 = document.createElement("option"); + o2.value = subId; + o2.textContent = + lucideSubtitleNudgeActionLabels[subId] + " (" + subId + ")"; + actionSel.appendChild(o2); + }); + return; + } var o = document.createElement("option"); o.value = aid; o.textContent = diff --git a/popup.js b/popup.js index 9e524e8..76c9273 100644 --- a/popup.js +++ b/popup.js @@ -8,7 +8,7 @@ document.addEventListener("DOMContentLoaded", function () { faster: { label: "", className: "" }, advance: { label: "", className: "rw" }, display: { label: "", className: "hideButton" }, - reset: { label: "", className: "" }, + reset: { label: "\u21BB", className: "" }, fast: { label: "", className: "" }, nudge: { label: "", className: "" }, settings: { label: "", className: "" },