mirror of
https://github.com/SoPat712/Speeder.git
synced 2026-10-08 03:03:14 -04:00
Reorganize extension source layout
This commit is contained in:
47 files changed
+209
-326
No files matched your search
@@ -0,0 +1,2995 @@
|
||||
var isUserSeek = false; // Track if seek was user-initiated
|
||||
var lastToggleSpeed = {}; // Store last toggle speeds per video
|
||||
var speederShared =
|
||||
typeof SpeederShared === "object" && SpeederShared ? SpeederShared : {};
|
||||
var controllerUtils = speederShared.controllerUtils || {};
|
||||
var keyBindingUtils = speederShared.keyBindings || {};
|
||||
var siteRuleUtils = speederShared.siteRules || {};
|
||||
|
||||
function getPrimaryVideoElement() {
|
||||
if (!tc.mediaElements || tc.mediaElements.length === 0) return null;
|
||||
for (var i = 0; i < tc.mediaElements.length; i++) {
|
||||
var el = tc.mediaElements[i];
|
||||
if (el && !el.paused) return el;
|
||||
}
|
||||
return tc.mediaElements[0];
|
||||
}
|
||||
|
||||
var tc = {
|
||||
settings: {
|
||||
lastSpeed: 1.0,
|
||||
enabled: true,
|
||||
speeds: {},
|
||||
rememberSpeed: false,
|
||||
forceLastSavedSpeed: false,
|
||||
audioBoolean: false,
|
||||
startHidden: false,
|
||||
hideWithYouTubeControls: false,
|
||||
hideWithControls: false,
|
||||
hideWithControlsTimer: 2.0,
|
||||
controllerLocation: "top-left",
|
||||
controllerOpacity: 0.3,
|
||||
controllerMarginTop: 0,
|
||||
controllerMarginRight: 0,
|
||||
controllerMarginBottom: 65,
|
||||
controllerMarginLeft: 0,
|
||||
keyBindings: [],
|
||||
siteRules: [],
|
||||
controllerButtons: ["rewind", "slower", "faster", "advance", "display"],
|
||||
defaultLogLevel: 3,
|
||||
logLevel: 3,
|
||||
enableSubtitleNudge: false,
|
||||
subtitleNudgeEnabledByDefault: true,
|
||||
subtitleNudgeInterval: 50, // Default 50ms balances subtitle tracking with CPU cost
|
||||
subtitleNudgeAmount: 0.001,
|
||||
customButtonIcons: {}
|
||||
},
|
||||
mediaElements: [],
|
||||
isNudging: false,
|
||||
pendingLastSpeedSave: null,
|
||||
pendingLastSpeedValue: null,
|
||||
persistedLastSpeed: 1.0,
|
||||
activeSiteRule: null,
|
||||
siteRuleBase: null
|
||||
};
|
||||
|
||||
var MIN_SPEED = 0.0625;
|
||||
var MAX_SPEED = 16;
|
||||
var YT_NATIVE_MIN = 0.25;
|
||||
var YT_NATIVE_MAX = 2.0;
|
||||
var YT_NATIVE_STEP = 0.05;
|
||||
var vscObservedRoots = new WeakSet();
|
||||
var vscConnectedScannedRoots = new WeakSet();
|
||||
var vscInitializedDocuments = new Set();
|
||||
var requestIdle =
|
||||
typeof window.requestIdleCallback === "function"
|
||||
? window.requestIdleCallback.bind(window)
|
||||
: function(callback, options) {
|
||||
return setTimeout(callback, (options && options.timeout) || 1);
|
||||
};
|
||||
var controllerLocations = Array.isArray(controllerUtils.controllerLocations)
|
||||
? controllerUtils.controllerLocations.slice()
|
||||
: [
|
||||
"top-left",
|
||||
"top-center",
|
||||
"top-right",
|
||||
"middle-right",
|
||||
"bottom-right",
|
||||
"bottom-center",
|
||||
"bottom-left",
|
||||
"middle-left"
|
||||
];
|
||||
var defaultControllerLocation =
|
||||
controllerUtils.defaultControllerLocation || controllerLocations[0];
|
||||
var controllerLocationStyles = {
|
||||
"top-left": {
|
||||
top: "10px",
|
||||
left: "15px",
|
||||
transform: "translate(0, 0)"
|
||||
},
|
||||
"top-center": {
|
||||
top: "10px",
|
||||
left: "50%",
|
||||
transform: "translate(-50%, 0)"
|
||||
},
|
||||
"top-right": {
|
||||
top: "10px",
|
||||
left: "calc(100% - 10px)",
|
||||
transform: "translate(-100%, 0)"
|
||||
},
|
||||
"middle-right": {
|
||||
top: "50%",
|
||||
left: "calc(100% - 10px)",
|
||||
transform: "translate(-100%, -50%)"
|
||||
},
|
||||
"bottom-right": {
|
||||
top: "calc(100% - 0px)",
|
||||
left: "calc(100% - 10px)",
|
||||
transform: "translate(-100%, -100%)"
|
||||
},
|
||||
"bottom-center": {
|
||||
top: "calc(100% - 0px)",
|
||||
left: "50%",
|
||||
transform: "translate(-50%, -100%)"
|
||||
},
|
||||
"bottom-left": {
|
||||
top: "calc(100% - 0px)",
|
||||
left: "15px",
|
||||
transform: "translate(0, -100%)"
|
||||
},
|
||||
"middle-left": {
|
||||
top: "50%",
|
||||
left: "15px",
|
||||
transform: "translate(0, -50%)"
|
||||
}
|
||||
};
|
||||
|
||||
/* `label` fallback only when ui-icons has no path for the action. */
|
||||
var controllerButtonDefs = {
|
||||
rewind: { label: "", className: "rw" },
|
||||
slower: { label: "", className: "" },
|
||||
faster: { label: "", className: "" },
|
||||
advance: { label: "", className: "rw" },
|
||||
display: { label: "", className: "hideButton" },
|
||||
reset: { label: "\u21BB", className: "" },
|
||||
fast: { label: "", className: "" },
|
||||
nudge: { label: "", className: "" },
|
||||
pause: { label: "", className: "" },
|
||||
muted: { label: "", className: "" },
|
||||
louder: { label: "", className: "" },
|
||||
softer: { label: "", className: "" },
|
||||
mark: { label: "", className: "" },
|
||||
jump: { label: "", className: "" },
|
||||
settings: { label: "", className: "" }
|
||||
};
|
||||
|
||||
function createDefaultBinding(action, code, value) {
|
||||
return {
|
||||
action: action,
|
||||
code: code,
|
||||
value: value,
|
||||
force: false,
|
||||
predefined: true
|
||||
};
|
||||
}
|
||||
|
||||
function defaultKeyBindings(storage) {
|
||||
return [
|
||||
createDefaultBinding(
|
||||
"slower",
|
||||
"KeyS",
|
||||
Number(storage.speedStep) || 0.1
|
||||
),
|
||||
createDefaultBinding(
|
||||
"faster",
|
||||
"KeyD",
|
||||
Number(storage.speedStep) || 0.1
|
||||
),
|
||||
createDefaultBinding(
|
||||
"rewind",
|
||||
"KeyZ",
|
||||
Number(storage.rewindTime) || 10
|
||||
),
|
||||
createDefaultBinding(
|
||||
"advance",
|
||||
"KeyX",
|
||||
Number(storage.advanceTime) || 10
|
||||
),
|
||||
createDefaultBinding(
|
||||
"reset",
|
||||
"KeyR",
|
||||
1.0
|
||||
),
|
||||
createDefaultBinding(
|
||||
"fast",
|
||||
"KeyG",
|
||||
Number(storage.fastSpeed) || 1.8
|
||||
),
|
||||
createDefaultBinding(
|
||||
"move",
|
||||
"KeyP",
|
||||
0
|
||||
),
|
||||
createDefaultBinding(
|
||||
"toggleSubtitleNudge",
|
||||
"KeyN",
|
||||
0
|
||||
)
|
||||
];
|
||||
}
|
||||
|
||||
function ensureDefaultKeyBinding(action, code, value) {
|
||||
if (tc.settings.keyBindings.some((binding) => binding.action === action)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
tc.settings.keyBindings.push(
|
||||
createDefaultBinding(action, code, value)
|
||||
);
|
||||
return true;
|
||||
}
|
||||
|
||||
function getLegacyKeyCode(binding) {
|
||||
return keyBindingUtils.getLegacyKeyCode(binding);
|
||||
}
|
||||
|
||||
function normalizeControllerLocation(location) {
|
||||
return controllerUtils.normalizeControllerLocation(
|
||||
location,
|
||||
defaultControllerLocation
|
||||
);
|
||||
}
|
||||
|
||||
var CONTROLLER_MARGIN_MAX_PX = 200;
|
||||
|
||||
function normalizeControllerMarginPx(value, fallback) {
|
||||
return controllerUtils.clampControllerMarginPx(value, fallback);
|
||||
}
|
||||
|
||||
function applyControllerMargins(controller) {
|
||||
if (!controller) return;
|
||||
var d = tc.settings;
|
||||
var loc = controller.dataset.location;
|
||||
var manual = controller.dataset.positionMode === "manual";
|
||||
var isTopAnchored =
|
||||
!manual &&
|
||||
(loc === "top-left" ||
|
||||
loc === "top-center" ||
|
||||
loc === "top-right");
|
||||
var isBottomAnchored =
|
||||
!manual &&
|
||||
(loc === "bottom-right" ||
|
||||
loc === "bottom-center" ||
|
||||
loc === "bottom-left");
|
||||
var isMiddleRow =
|
||||
!manual && (loc === "middle-left" || loc === "middle-right");
|
||||
var mt = normalizeControllerMarginPx(d.controllerMarginTop, 0);
|
||||
var mb = normalizeControllerMarginPx(d.controllerMarginBottom, 65);
|
||||
if (isTopAnchored || isBottomAnchored || isMiddleRow) {
|
||||
mt = 0;
|
||||
mb = 0;
|
||||
}
|
||||
controller.style.marginTop = mt + "px";
|
||||
var ml = normalizeControllerMarginPx(d.controllerMarginLeft, 0);
|
||||
var mr = normalizeControllerMarginPx(d.controllerMarginRight, 0);
|
||||
if (!manual) {
|
||||
ml = 0;
|
||||
mr = 0;
|
||||
}
|
||||
controller.style.marginRight = mr + "px";
|
||||
controller.style.marginBottom = mb + "px";
|
||||
controller.style.marginLeft = ml + "px";
|
||||
}
|
||||
|
||||
function getNextControllerLocation(location) {
|
||||
return controllerUtils.getNextControllerLocation(location);
|
||||
}
|
||||
|
||||
function getControllerElement(videoOrController) {
|
||||
if (!videoOrController) return null;
|
||||
|
||||
if (
|
||||
videoOrController.shadowRoot &&
|
||||
typeof videoOrController.shadowRoot.querySelector === "function"
|
||||
) {
|
||||
return videoOrController.shadowRoot.querySelector("#controller");
|
||||
}
|
||||
|
||||
if (
|
||||
videoOrController.div &&
|
||||
videoOrController.div.shadowRoot &&
|
||||
typeof videoOrController.div.shadowRoot.querySelector === "function"
|
||||
) {
|
||||
return videoOrController.div.shadowRoot.querySelector("#controller");
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
function applyControllerLocationToElement(controller, location) {
|
||||
if (!controller) return defaultControllerLocation;
|
||||
var normalizedLocation = normalizeControllerLocation(location);
|
||||
var styles = controllerLocationStyles[normalizedLocation];
|
||||
|
||||
controller.dataset.location = normalizedLocation;
|
||||
controller.dataset.positionMode = "anchored";
|
||||
|
||||
var top = styles.top;
|
||||
if (
|
||||
normalizedLocation === "top-left" ||
|
||||
normalizedLocation === "top-center" ||
|
||||
normalizedLocation === "top-right"
|
||||
) {
|
||||
var insetTop = normalizeControllerMarginPx(
|
||||
tc.settings.controllerMarginTop,
|
||||
0
|
||||
);
|
||||
top = "calc(10px + " + insetTop + "px)";
|
||||
}
|
||||
if (
|
||||
normalizedLocation === "bottom-right" ||
|
||||
normalizedLocation === "bottom-center" ||
|
||||
normalizedLocation === "bottom-left"
|
||||
) {
|
||||
var lift = normalizeControllerMarginPx(
|
||||
tc.settings.controllerMarginBottom,
|
||||
65
|
||||
);
|
||||
top = "calc(100% - " + lift + "px)";
|
||||
}
|
||||
// If in fullscreen, move the controller down to avoid overlapping video titles
|
||||
if (
|
||||
document.fullscreenElement ||
|
||||
document.webkitFullscreenElement ||
|
||||
document.mozFullScreenElement ||
|
||||
document.msFullscreenElement
|
||||
) {
|
||||
if (normalizedLocation.startsWith("top-")) {
|
||||
var insetTopFs = normalizeControllerMarginPx(
|
||||
tc.settings.controllerMarginTop,
|
||||
0
|
||||
);
|
||||
top = "calc(63px + " + insetTopFs + "px)";
|
||||
}
|
||||
}
|
||||
|
||||
controller.style.top = top;
|
||||
|
||||
var left = styles.left;
|
||||
switch (normalizedLocation) {
|
||||
case "top-left":
|
||||
case "middle-left":
|
||||
case "bottom-left":
|
||||
left = "15px";
|
||||
break;
|
||||
case "top-right":
|
||||
case "middle-right":
|
||||
case "bottom-right":
|
||||
left = "calc(100% - 10px)";
|
||||
break;
|
||||
case "top-center":
|
||||
case "bottom-center":
|
||||
left = "50%";
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
controller.style.left = left;
|
||||
controller.style.transform = styles.transform;
|
||||
|
||||
applyControllerMargins(controller);
|
||||
|
||||
return normalizedLocation;
|
||||
}
|
||||
|
||||
function applyControllerLocation(videoController, location) {
|
||||
if (!videoController) return;
|
||||
|
||||
var controller = getControllerElement(videoController);
|
||||
if (!controller) return;
|
||||
|
||||
videoController.controllerLocation = applyControllerLocationToElement(
|
||||
controller,
|
||||
location
|
||||
);
|
||||
}
|
||||
|
||||
function captureSiteRuleBase() {
|
||||
tc.siteRuleBase = {
|
||||
startHidden: tc.settings.startHidden,
|
||||
hideWithControls: tc.settings.hideWithControls,
|
||||
hideWithControlsTimer: tc.settings.hideWithControlsTimer,
|
||||
controllerLocation: tc.settings.controllerLocation,
|
||||
rememberSpeed: tc.settings.rememberSpeed,
|
||||
forceLastSavedSpeed: tc.settings.forceLastSavedSpeed,
|
||||
audioBoolean: tc.settings.audioBoolean,
|
||||
controllerOpacity: tc.settings.controllerOpacity,
|
||||
controllerMarginTop: tc.settings.controllerMarginTop,
|
||||
controllerMarginBottom: tc.settings.controllerMarginBottom,
|
||||
enableSubtitleNudge: tc.settings.enableSubtitleNudge,
|
||||
subtitleNudgeEnabledByDefault: tc.settings.subtitleNudgeEnabledByDefault,
|
||||
subtitleNudgeInterval: tc.settings.subtitleNudgeInterval,
|
||||
controllerButtons: Array.isArray(tc.settings.controllerButtons)
|
||||
? tc.settings.controllerButtons.slice()
|
||||
: tc.settings.controllerButtons,
|
||||
keyBindings: Array.isArray(tc.settings.keyBindings)
|
||||
? tc.settings.keyBindings.map(function(binding) {
|
||||
return Object.assign({}, binding);
|
||||
})
|
||||
: tc.settings.keyBindings
|
||||
};
|
||||
}
|
||||
|
||||
function resetSettingsFromSiteRuleBase() {
|
||||
if (!tc.siteRuleBase) return;
|
||||
var base = tc.siteRuleBase;
|
||||
tc.settings.startHidden = base.startHidden;
|
||||
tc.settings.hideWithControls = base.hideWithControls;
|
||||
tc.settings.hideWithControlsTimer = base.hideWithControlsTimer;
|
||||
tc.settings.controllerLocation = base.controllerLocation;
|
||||
tc.settings.rememberSpeed = base.rememberSpeed;
|
||||
tc.settings.forceLastSavedSpeed = base.forceLastSavedSpeed;
|
||||
tc.settings.audioBoolean = base.audioBoolean;
|
||||
tc.settings.controllerOpacity = base.controllerOpacity;
|
||||
tc.settings.controllerMarginTop = base.controllerMarginTop;
|
||||
tc.settings.controllerMarginBottom = base.controllerMarginBottom;
|
||||
tc.settings.enableSubtitleNudge = base.enableSubtitleNudge;
|
||||
tc.settings.subtitleNudgeEnabledByDefault = base.subtitleNudgeEnabledByDefault;
|
||||
tc.settings.subtitleNudgeInterval = base.subtitleNudgeInterval;
|
||||
tc.settings.controllerButtons = Array.isArray(base.controllerButtons)
|
||||
? base.controllerButtons.slice()
|
||||
: base.controllerButtons;
|
||||
tc.settings.keyBindings = Array.isArray(base.keyBindings)
|
||||
? base.keyBindings.map(function(binding) {
|
||||
return Object.assign({}, binding);
|
||||
})
|
||||
: base.keyBindings;
|
||||
}
|
||||
|
||||
function clearManualControllerPosition(videoController) {
|
||||
if (!videoController) return;
|
||||
applyControllerLocation(
|
||||
videoController,
|
||||
videoController.controllerLocation || tc.settings.controllerLocation
|
||||
);
|
||||
}
|
||||
|
||||
function convertControllerToManualPosition(videoController) {
|
||||
if (!videoController) return null;
|
||||
|
||||
var controller = getControllerElement(videoController);
|
||||
if (!controller) return null;
|
||||
|
||||
controller.dataset.positionMode = "manual";
|
||||
|
||||
var offsetParent = controller.offsetParent;
|
||||
if (offsetParent) {
|
||||
var controllerRect = controller.getBoundingClientRect();
|
||||
var offsetParentRect = offsetParent.getBoundingClientRect();
|
||||
|
||||
controller.style.setProperty(
|
||||
"left",
|
||||
controllerRect.left - offsetParentRect.left + "px",
|
||||
"important"
|
||||
);
|
||||
controller.style.setProperty(
|
||||
"top",
|
||||
controllerRect.top - offsetParentRect.top + "px",
|
||||
"important"
|
||||
);
|
||||
} else {
|
||||
controller.style.setProperty(
|
||||
"left",
|
||||
controller.offsetLeft + "px",
|
||||
"important"
|
||||
);
|
||||
controller.style.setProperty(
|
||||
"top",
|
||||
controller.offsetTop + "px",
|
||||
"important"
|
||||
);
|
||||
}
|
||||
controller.style.setProperty("transform", "none", "important");
|
||||
|
||||
return controller;
|
||||
}
|
||||
|
||||
function cycleControllerLocation(video) {
|
||||
if (!video || !video.vsc) return;
|
||||
|
||||
video.vsc.controllerLocation = getNextControllerLocation(
|
||||
video.vsc.controllerLocation || tc.settings.controllerLocation
|
||||
);
|
||||
clearManualControllerPosition(video.vsc);
|
||||
}
|
||||
|
||||
function normalizeBindingKey(key) {
|
||||
return keyBindingUtils.normalizeBindingKey(key);
|
||||
}
|
||||
|
||||
function legacyBindingKeyToCode(key) {
|
||||
return keyBindingUtils.legacyBindingKeyToCode(key);
|
||||
}
|
||||
|
||||
function legacyKeyCodeToCode(keyCode) {
|
||||
return keyBindingUtils.legacyKeyCodeToCode(keyCode);
|
||||
}
|
||||
|
||||
function inferBindingCode(binding, fallbackCode) {
|
||||
return keyBindingUtils.inferBindingCode(binding, fallbackCode);
|
||||
}
|
||||
|
||||
function normalizeStoredBinding(binding, fallbackCode) {
|
||||
if (!binding) {
|
||||
if (!fallbackCode) return null;
|
||||
return {
|
||||
code: fallbackCode,
|
||||
disabled: false,
|
||||
value: 0,
|
||||
force: "false",
|
||||
predefined: false
|
||||
};
|
||||
}
|
||||
|
||||
if (
|
||||
binding.disabled === true ||
|
||||
(binding.code === null &&
|
||||
binding.key === null &&
|
||||
binding.keyCode === null)
|
||||
) {
|
||||
return {
|
||||
action: binding.action,
|
||||
code: null,
|
||||
disabled: true,
|
||||
value: Number(binding.value),
|
||||
force: String(binding.force) === "true" ? "true" : "false",
|
||||
predefined: Boolean(binding.predefined)
|
||||
};
|
||||
}
|
||||
|
||||
var normalizedCode = inferBindingCode(binding, fallbackCode);
|
||||
if (!normalizedCode) {
|
||||
return null;
|
||||
}
|
||||
|
||||
var normalized = {
|
||||
action: binding.action,
|
||||
code: normalizedCode,
|
||||
disabled: false,
|
||||
value: Number(binding.value),
|
||||
force: String(binding.force) === "true" ? "true" : "false",
|
||||
predefined: Boolean(binding.predefined)
|
||||
};
|
||||
|
||||
return normalized;
|
||||
}
|
||||
|
||||
function isValidSpeed(speed) {
|
||||
return !isNaN(speed) && speed >= MIN_SPEED && speed <= MAX_SPEED;
|
||||
}
|
||||
|
||||
function sanitizeSpeed(speed, fallback) {
|
||||
var numericSpeed = Number(speed);
|
||||
return isValidSpeed(numericSpeed) ? numericSpeed : fallback;
|
||||
}
|
||||
|
||||
function getVideoSourceKey(video) {
|
||||
return (video && (video.currentSrc || video.src)) || "unknown_src";
|
||||
}
|
||||
|
||||
function getControllerTargetSpeed(video) {
|
||||
if (!video || !video.vsc) return null;
|
||||
if (!isValidSpeed(video.vsc.targetSpeed)) return null;
|
||||
|
||||
var currentSourceKey = getVideoSourceKey(video);
|
||||
var targetSourceKey = video.vsc.targetSpeedSourceKey;
|
||||
|
||||
// SPA sites (e.g. YouTube) can reuse the same <video> element.
|
||||
// Don't carry controller target speed across a source swap.
|
||||
if (
|
||||
targetSourceKey &&
|
||||
currentSourceKey === "unknown_src" &&
|
||||
targetSourceKey !== "unknown_src"
|
||||
) {
|
||||
return null;
|
||||
}
|
||||
if (
|
||||
targetSourceKey &&
|
||||
currentSourceKey !== "unknown_src" &&
|
||||
targetSourceKey !== currentSourceKey
|
||||
) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return video.vsc.targetSpeed;
|
||||
}
|
||||
|
||||
function getRememberedSpeed(video) {
|
||||
if (!tc.settings.rememberSpeed && !tc.settings.forceLastSavedSpeed) {
|
||||
return null;
|
||||
}
|
||||
|
||||
var sourceKey = getVideoSourceKey(video);
|
||||
if (sourceKey !== "unknown_src") {
|
||||
var videoSpeed = tc.settings.speeds[sourceKey];
|
||||
if (isValidSpeed(videoSpeed)) return videoSpeed;
|
||||
}
|
||||
if (tc.settings.forceLastSavedSpeed && isValidSpeed(tc.settings.lastSpeed)) {
|
||||
return tc.settings.lastSpeed;
|
||||
}
|
||||
if (tc.settings.rememberSpeed && isValidSpeed(tc.settings.lastSpeed)) {
|
||||
return tc.settings.lastSpeed;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
function getDesiredSpeed(video) {
|
||||
return getControllerTargetSpeed(video) || getRememberedSpeed(video) || 1.0;
|
||||
}
|
||||
|
||||
function isOnYouTube() {
|
||||
return (
|
||||
location.hostname.includes("youtube.com") ||
|
||||
location.hostname.includes("youtube-nocookie.com")
|
||||
);
|
||||
}
|
||||
|
||||
function isYouTubeNativeSpeedRange(speed) {
|
||||
if (speed < YT_NATIVE_MIN || speed > YT_NATIVE_MAX) return false;
|
||||
// Check if speed is a multiple of 0.05 (with floating point tolerance)
|
||||
var remainder = Math.abs((speed * 100) % (YT_NATIVE_STEP * 100));
|
||||
return remainder < 0.01 || remainder > (YT_NATIVE_STEP * 100 - 0.01);
|
||||
}
|
||||
|
||||
function tryYouTubeNativeSpeed(video, speed) {
|
||||
if (!isOnYouTube() || !isYouTubeNativeSpeedRange(speed)) return false;
|
||||
|
||||
try {
|
||||
// YouTube's movie_player element exposes setPlaybackRate() but it's a
|
||||
// page-level JS method, not a native DOM method. Content scripts can't
|
||||
// see it directly. In Firefox, wrappedJSObject gives access to the
|
||||
// page's JS context.
|
||||
var playerEl =
|
||||
video.closest(".html5-video-player") ||
|
||||
document.getElementById("movie_player");
|
||||
if (!playerEl) return false;
|
||||
|
||||
// Try wrappedJSObject first (Firefox content script → page context)
|
||||
var player = playerEl.wrappedJSObject || playerEl;
|
||||
if (typeof player.setPlaybackRate === "function") {
|
||||
player.setPlaybackRate(speed);
|
||||
// Verify YouTube actually accepted the speed (it may silently clamp)
|
||||
var actualSpeed = video.playbackRate;
|
||||
if (Math.abs(actualSpeed - speed) > 0.01) {
|
||||
log("YouTube clamped speed to " + actualSpeed + ", falling back", 4);
|
||||
return false;
|
||||
}
|
||||
log("Used YouTube native setPlaybackRate: " + speed, 4);
|
||||
return true;
|
||||
}
|
||||
} catch (e) {
|
||||
log("YouTube native speed failed: " + e.message, 3);
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
function isSubtitleNudgeSupported(video) {
|
||||
return Boolean(video);
|
||||
}
|
||||
|
||||
function isSubtitleNudgeAvailableForVideo(video) {
|
||||
return isSubtitleNudgeSupported(video) && Boolean(tc.settings.enableSubtitleNudge);
|
||||
}
|
||||
|
||||
function isSubtitleNudgeEnabledForVideo(video) {
|
||||
if (!isSubtitleNudgeAvailableForVideo(video)) return false;
|
||||
|
||||
if (!video || !video.vsc) {
|
||||
return Boolean(tc.settings.subtitleNudgeEnabledByDefault);
|
||||
}
|
||||
|
||||
if (typeof video.vsc.subtitleNudgeEnabledOverride === "boolean") {
|
||||
return video.vsc.subtitleNudgeEnabledOverride;
|
||||
}
|
||||
|
||||
return Boolean(tc.settings.subtitleNudgeEnabledByDefault);
|
||||
}
|
||||
|
||||
function setSubtitleNudgeEnabledForVideo(video, enabled) {
|
||||
if (!video || !video.vsc) return false;
|
||||
|
||||
if (!isSubtitleNudgeAvailableForVideo(video)) {
|
||||
video.vsc.subtitleNudgeEnabledOverride = null;
|
||||
video.vsc.stopSubtitleNudge();
|
||||
updateSubtitleNudgeIndicator(video);
|
||||
return false;
|
||||
}
|
||||
|
||||
var normalizedEnabled = Boolean(enabled);
|
||||
video.vsc.subtitleNudgeEnabledOverride = normalizedEnabled;
|
||||
|
||||
if (!normalizedEnabled) {
|
||||
video.vsc.stopSubtitleNudge();
|
||||
} else if (!video.paused && video.playbackRate !== 1.0) {
|
||||
video.vsc.startSubtitleNudge();
|
||||
}
|
||||
|
||||
updateSubtitleNudgeIndicator(video);
|
||||
|
||||
// Briefly flash the standalone indicator next to the speed text
|
||||
var flashEl = video.vsc.nudgeFlashIndicator;
|
||||
if (flashEl) {
|
||||
flashEl.classList.add("visible");
|
||||
clearTimeout(flashEl._flashTimer);
|
||||
flashEl._flashTimer = setTimeout(function() {
|
||||
flashEl.classList.remove("visible");
|
||||
}, 1500);
|
||||
}
|
||||
|
||||
return normalizedEnabled;
|
||||
}
|
||||
|
||||
function renderSubtitleNudgeIndicatorContent(target, isEnabled) {
|
||||
if (!target) return;
|
||||
var action = isEnabled ? "subtitleNudgeOn" : "subtitleNudgeOff";
|
||||
var custom =
|
||||
tc.settings.customButtonIcons &&
|
||||
tc.settings.customButtonIcons[action] &&
|
||||
tc.settings.customButtonIcons[action].svg;
|
||||
vscClearElement(target);
|
||||
if (custom) {
|
||||
var customWrap = vscCreateSvgWrap(
|
||||
target.ownerDocument || document,
|
||||
custom,
|
||||
"vsc-btn-icon"
|
||||
);
|
||||
if (customWrap) {
|
||||
target.appendChild(customWrap);
|
||||
return;
|
||||
}
|
||||
}
|
||||
if (typeof vscIconSvgString !== "function") {
|
||||
target.textContent = isEnabled ? "✓" : "×";
|
||||
return;
|
||||
}
|
||||
var svg = vscIconSvgString(action, 14);
|
||||
if (!svg) {
|
||||
target.textContent = isEnabled ? "✓" : "×";
|
||||
return;
|
||||
}
|
||||
var wrap = vscCreateSvgWrap(target.ownerDocument || document, svg, "vsc-btn-icon");
|
||||
if (wrap) {
|
||||
target.appendChild(wrap);
|
||||
return;
|
||||
}
|
||||
target.textContent = isEnabled ? "✓" : "×";
|
||||
}
|
||||
|
||||
function updateSubtitleNudgeIndicator(video) {
|
||||
if (!video || !video.vsc) return;
|
||||
|
||||
var isAvailable = isSubtitleNudgeAvailableForVideo(video);
|
||||
var isEnabled = isSubtitleNudgeEnabledForVideo(video);
|
||||
var title = !isAvailable
|
||||
? "Subtitle nudge unavailable on this site"
|
||||
: isEnabled
|
||||
? "Subtitle nudge enabled"
|
||||
: "Subtitle nudge disabled";
|
||||
|
||||
var indicator = video.vsc.subtitleNudgeIndicator;
|
||||
if (indicator) {
|
||||
renderSubtitleNudgeIndicatorContent(indicator, isEnabled);
|
||||
indicator.dataset.enabled = isEnabled ? "true" : "false";
|
||||
indicator.dataset.supported = isAvailable ? "true" : "false";
|
||||
indicator.title = title;
|
||||
indicator.setAttribute("aria-label", title);
|
||||
}
|
||||
|
||||
var flashEl = video.vsc.nudgeFlashIndicator;
|
||||
if (flashEl) {
|
||||
renderSubtitleNudgeIndicatorContent(flashEl, isEnabled);
|
||||
flashEl.dataset.enabled = isEnabled ? "true" : "false";
|
||||
flashEl.dataset.supported = isAvailable ? "true" : "false";
|
||||
flashEl.setAttribute("aria-label", title);
|
||||
}
|
||||
}
|
||||
|
||||
function schedulePersistLastSpeed(speed) {
|
||||
if (!isValidSpeed(speed)) return;
|
||||
|
||||
tc.pendingLastSpeedValue = speed;
|
||||
if (tc.pendingLastSpeedSave !== null) return;
|
||||
|
||||
tc.pendingLastSpeedSave = setTimeout(function() {
|
||||
var speedToPersist = tc.pendingLastSpeedValue;
|
||||
tc.pendingLastSpeedSave = null;
|
||||
|
||||
if (!isValidSpeed(speedToPersist) || tc.persistedLastSpeed === speedToPersist) {
|
||||
return;
|
||||
}
|
||||
|
||||
chrome.storage.sync.set({ lastSpeed: speedToPersist }, function() {
|
||||
});
|
||||
tc.persistedLastSpeed = speedToPersist;
|
||||
}, 250);
|
||||
}
|
||||
|
||||
function suppressNextNudgeRateChanges(controller, count) {
|
||||
if (!controller) return;
|
||||
|
||||
controller.suppressedRateChangeCount =
|
||||
(controller.suppressedRateChangeCount || 0) + (count || 2);
|
||||
controller.suppressedRateChangeUntil =
|
||||
Date.now() + Math.max(250, tc.settings.subtitleNudgeInterval * 4);
|
||||
}
|
||||
|
||||
function shouldIgnoreSuppressedRateChange(video) {
|
||||
if (!video || !video.vsc) return false;
|
||||
|
||||
var controller = video.vsc;
|
||||
if (
|
||||
controller.suppressedRateChangeCount > 0 &&
|
||||
controller.suppressedRateChangeUntil >= Date.now()
|
||||
) {
|
||||
controller.suppressedRateChangeCount -= 1;
|
||||
return true;
|
||||
}
|
||||
|
||||
if (controller.suppressedRateChangeUntil < Date.now()) {
|
||||
controller.suppressedRateChangeCount = 0;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function resolveTargetSpeed(video) {
|
||||
return getDesiredSpeed(video);
|
||||
}
|
||||
|
||||
function applySourceTransitionPolicy(video, forceUpdate) {
|
||||
if (!video || !video.vsc) return;
|
||||
|
||||
var sourceKey = getVideoSourceKey(video);
|
||||
if (!forceUpdate && video.vsc.mediaSourceKey === sourceKey) return;
|
||||
|
||||
video.vsc.mediaSourceKey = sourceKey;
|
||||
|
||||
var desiredSpeed =
|
||||
tc.settings.rememberSpeed || tc.settings.forceLastSavedSpeed
|
||||
? sanitizeSpeed(tc.settings.lastSpeed, 1.0)
|
||||
: 1.0;
|
||||
|
||||
video.vsc.targetSpeed = desiredSpeed;
|
||||
video.vsc.targetSpeedSourceKey = sourceKey;
|
||||
if (video.vsc.speedIndicator) {
|
||||
video.vsc.speedIndicator.textContent = desiredSpeed.toFixed(2);
|
||||
}
|
||||
|
||||
if (Math.abs(video.playbackRate - desiredSpeed) > 0.01) {
|
||||
setSpeed(video, desiredSpeed, false, false);
|
||||
}
|
||||
|
||||
// Same-tab SPA (e.g. YouTube watch → Shorts): URL can change while remember-speed
|
||||
// already ran on src mutation — re-apply margins / location / opacity for new rules.
|
||||
reapplySiteRulesAndControllerGeometry();
|
||||
}
|
||||
|
||||
function extendSpeedRestoreWindow(video, duration) {
|
||||
if (!video || !video.vsc) return;
|
||||
|
||||
var restoreDuration = Number(duration) || 1500;
|
||||
var restoreUntil = Date.now() + restoreDuration;
|
||||
var currentUntil = Number(video.vsc.speedRestoreUntil) || 0;
|
||||
|
||||
video.vsc.speedRestoreUntil = Math.max(currentUntil, restoreUntil);
|
||||
}
|
||||
|
||||
function scheduleSpeedRestore(video, desiredSpeed, reason) {
|
||||
if (!video || !video.vsc || !isValidSpeed(desiredSpeed)) return;
|
||||
|
||||
if (video.vsc.restoreSpeedTimer) {
|
||||
clearTimeout(video.vsc.restoreSpeedTimer);
|
||||
}
|
||||
|
||||
video.vsc.restoreSpeedTimer = setTimeout(function() {
|
||||
if (!video.vsc) return;
|
||||
|
||||
if (Math.abs(video.playbackRate - desiredSpeed) > 0.01) {
|
||||
log(
|
||||
`Restoring playbackRate to ${desiredSpeed.toFixed(2)} after ${reason}`,
|
||||
4
|
||||
);
|
||||
setSpeed(video, desiredSpeed, false, false);
|
||||
}
|
||||
|
||||
if (video.vsc) {
|
||||
video.vsc.restoreSpeedTimer = null;
|
||||
}
|
||||
}, 0);
|
||||
}
|
||||
|
||||
function rememberPendingRateChange(video, speed) {
|
||||
if (!video || !video.vsc || !isValidSpeed(speed)) return;
|
||||
|
||||
video.vsc.pendingRateChange = {
|
||||
speed: Number(speed),
|
||||
expiresAt: Date.now() + 1000
|
||||
};
|
||||
}
|
||||
|
||||
function takePendingRateChange(video, currentSpeed) {
|
||||
if (!video || !video.vsc || !video.vsc.pendingRateChange) return null;
|
||||
|
||||
var pendingRateChange = video.vsc.pendingRateChange;
|
||||
if (
|
||||
!isValidSpeed(pendingRateChange.speed) ||
|
||||
pendingRateChange.expiresAt <= Date.now()
|
||||
) {
|
||||
video.vsc.pendingRateChange = null;
|
||||
return null;
|
||||
}
|
||||
|
||||
if (Math.abs(Number(pendingRateChange.speed) - currentSpeed) > 0.01) {
|
||||
return null;
|
||||
}
|
||||
|
||||
video.vsc.pendingRateChange = null;
|
||||
return pendingRateChange;
|
||||
}
|
||||
|
||||
function matchesKeyBinding(binding, event) {
|
||||
return Boolean(
|
||||
binding &&
|
||||
binding.disabled !== true &&
|
||||
typeof binding.code === "string" &&
|
||||
binding.code.length > 0 &&
|
||||
binding.code === event.code
|
||||
);
|
||||
}
|
||||
|
||||
function mediaSelector() {
|
||||
return tc.settings.audioBoolean ? "video,audio" : "video";
|
||||
}
|
||||
|
||||
function isMediaElement(node) {
|
||||
return (
|
||||
node &&
|
||||
node.nodeType === Node.ELEMENT_NODE &&
|
||||
(node.nodeName === "VIDEO" ||
|
||||
(node.nodeName === "AUDIO" && tc.settings.audioBoolean))
|
||||
);
|
||||
}
|
||||
|
||||
function hasUsableMediaSource(node) {
|
||||
if (!isMediaElement(node) || !node.isConnected) return false;
|
||||
if (node.currentSrc || node.src || node.srcObject) return true;
|
||||
if (typeof node.readyState === "number" && node.readyState > 0) return true;
|
||||
if (
|
||||
typeof node.networkState === "number" &&
|
||||
typeof HTMLMediaElement !== "undefined" &&
|
||||
(node.networkState === HTMLMediaElement.NETWORK_IDLE ||
|
||||
node.networkState === HTMLMediaElement.NETWORK_LOADING)
|
||||
) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (node.querySelectorAll) {
|
||||
return Array.from(node.querySelectorAll("source[src]")).some(function(
|
||||
source
|
||||
) {
|
||||
var src = source.getAttribute("src");
|
||||
return typeof src === "string" && src.trim().length > 0;
|
||||
});
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
function ensureController(node, parent) {
|
||||
if (!isMediaElement(node) || node.vsc) return node && node.vsc;
|
||||
if (!hasUsableMediaSource(node)) {
|
||||
log(
|
||||
`Deferring controller creation for ${node.tagName}: no usable source yet`,
|
||||
5
|
||||
);
|
||||
return null;
|
||||
}
|
||||
|
||||
// href selects site rules; re-run on every new/usable media so margins/opacity match current URL.
|
||||
applySiteRuleOverrides();
|
||||
if (!siteRuleUtils.isSpeederActiveForSite(tc.settings.enabled, tc.activeSiteRule)) {
|
||||
return null;
|
||||
}
|
||||
refreshAllControllerGeometry();
|
||||
|
||||
log(
|
||||
`Creating controller for ${node.tagName}: ${node.src || node.currentSrc || "no src"}`,
|
||||
4
|
||||
);
|
||||
node.vsc = new tc.videoController(
|
||||
node,
|
||||
parent || node.parentElement || node.parentNode
|
||||
);
|
||||
return node.vsc;
|
||||
}
|
||||
|
||||
function removeController(node) {
|
||||
if (node && node.vsc) node.vsc.remove();
|
||||
}
|
||||
|
||||
function scanNodeForMedia(node, parent, added) {
|
||||
if (!node || typeof node === "function") return;
|
||||
|
||||
if (node.nodeType === Node.DOCUMENT_NODE) {
|
||||
scanNodeForMedia(node.body || node.documentElement, node.body, added);
|
||||
return;
|
||||
}
|
||||
|
||||
if (
|
||||
node.nodeType !== Node.ELEMENT_NODE &&
|
||||
node.nodeType !== Node.DOCUMENT_FRAGMENT_NODE
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
var ownerDocument = node.ownerDocument || document;
|
||||
if (!added && ownerDocument.body && ownerDocument.body.contains(node)) return;
|
||||
|
||||
// Check if the node itself is a media element
|
||||
if (isMediaElement(node)) {
|
||||
if (added) ensureController(node, parent);
|
||||
else removeController(node);
|
||||
}
|
||||
|
||||
// Use querySelectorAll instead of recursive child walking — the browser's
|
||||
// native selector engine is orders of magnitude faster than JS recursion.
|
||||
if (typeof node.querySelectorAll === "function") {
|
||||
var selector = mediaSelector();
|
||||
try {
|
||||
var mediaElements = node.querySelectorAll(selector);
|
||||
for (var i = 0; i < mediaElements.length; i++) {
|
||||
var el = mediaElements[i];
|
||||
if (added) ensureController(el, el.parentNode || parent);
|
||||
else removeController(el);
|
||||
}
|
||||
} catch (e) {
|
||||
// querySelectorAll may throw on detached or unusual nodes
|
||||
}
|
||||
}
|
||||
|
||||
// Still need to observe shadow roots for media inside web components
|
||||
if (node.shadowRoot) {
|
||||
observeRoot(node.shadowRoot);
|
||||
}
|
||||
|
||||
// Deep-scan descendant elements for shadow roots we haven't observed yet.
|
||||
// This catches custom elements (like archive.org's <play-av>) whose shadow
|
||||
// roots were created before our attachShadow patch was installed.
|
||||
if (added && typeof node.querySelectorAll === "function") {
|
||||
try {
|
||||
var allElements = node.querySelectorAll("*");
|
||||
for (var j = 0; j < allElements.length; j++) {
|
||||
if (allElements[j].shadowRoot && !vscObservedRoots.has(allElements[j].shadowRoot)) {
|
||||
observeRoot(allElements[j].shadowRoot);
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
// querySelectorAll may throw on detached or unusual nodes
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function getScanNodeForRoot(root) {
|
||||
if (!root) return null;
|
||||
if (root.nodeType === Node.DOCUMENT_NODE) {
|
||||
return root.body || root.documentElement;
|
||||
}
|
||||
return root;
|
||||
}
|
||||
|
||||
function rootMayContainMedia(root) {
|
||||
if (!root) return false;
|
||||
if (root.nodeType === Node.DOCUMENT_NODE) return true;
|
||||
// Always scan shadow roots so we can find nested shadow roots or media.
|
||||
if (root.host || (typeof ShadowRoot !== "undefined" && root instanceof ShadowRoot)) return true;
|
||||
if (typeof root.querySelector !== "function") return true;
|
||||
|
||||
try {
|
||||
return Boolean(root.querySelector(mediaSelector()));
|
||||
} catch (error) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
function scanRootForMedia(root) {
|
||||
var scanRoot = getScanNodeForRoot(root);
|
||||
if (!scanRoot) return;
|
||||
scanNodeForMedia(scanRoot, root.host || scanRoot.parentNode || scanRoot, true);
|
||||
if (root.nodeType === Node.DOCUMENT_NODE) {
|
||||
attachIframeListeners(root);
|
||||
}
|
||||
}
|
||||
|
||||
function observeRoot(root) {
|
||||
if (!root) return;
|
||||
|
||||
var isConnected = false;
|
||||
try {
|
||||
isConnected = root.nodeType === Node.DOCUMENT_NODE ||
|
||||
root.isConnected ||
|
||||
(root.host && (root.host.isConnected || (root.host.ownerDocument && root.host.ownerDocument.contains(root.host)))) ||
|
||||
(root.ownerDocument && root.ownerDocument.contains(root));
|
||||
} catch (e) {
|
||||
isConnected = true;
|
||||
}
|
||||
|
||||
if (!vscObservedRoots.has(root)) {
|
||||
vscObservedRoots.add(root);
|
||||
setupListener(root);
|
||||
attachMutationObserver(root);
|
||||
attachMediaDetectionListeners(root);
|
||||
}
|
||||
|
||||
if (isConnected && !vscConnectedScannedRoots.has(root)) {
|
||||
vscConnectedScannedRoots.add(root);
|
||||
if (rootMayContainMedia(root)) {
|
||||
scanRootForMedia(root);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function patchAttachShadow() {
|
||||
if (
|
||||
window.vscAttachShadowPatched ||
|
||||
typeof Element === "undefined" ||
|
||||
typeof Element.prototype.attachShadow !== "function"
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
var originalAttachShadow = Element.prototype.attachShadow;
|
||||
Element.prototype.attachShadow = function() {
|
||||
var shadowRoot = originalAttachShadow.apply(this, arguments);
|
||||
try {
|
||||
if (shadowRoot) {
|
||||
observeRoot(shadowRoot);
|
||||
}
|
||||
} catch (error) {
|
||||
log(`Unable to observe shadow root: ${error.message}`, 3);
|
||||
}
|
||||
return shadowRoot;
|
||||
};
|
||||
window.vscAttachShadowPatched = true;
|
||||
}
|
||||
|
||||
/* Log levels */
|
||||
function log(message, level) {
|
||||
verbosity = tc.settings.logLevel;
|
||||
if (typeof level === "undefined") level = tc.settings.defaultLogLevel;
|
||||
if (verbosity >= level) {
|
||||
let prefix = "[VSC] ";
|
||||
if (level === 2) console.log(prefix + "ERROR: " + message);
|
||||
else if (level === 3) console.log(prefix + "WARNING: " + message);
|
||||
else if (level === 4) console.log(prefix + "INFO: " + message);
|
||||
else if (level === 5) console.log(prefix + "DEBUG: " + message);
|
||||
else if (level === 6) {
|
||||
console.log(prefix + "DEBUG (VERBOSE): " + message);
|
||||
console.trace();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Patch attachShadow immediately — before any async operations — so we
|
||||
// catch shadow roots created while chrome.storage.sync.get is pending.
|
||||
// Sites like archive.org create Lit/LitElement shadow DOMs during page load;
|
||||
// waiting for the storage callback would miss them entirely.
|
||||
patchAttachShadow();
|
||||
|
||||
chrome.storage.sync.get(tc.settings, function(storage) {
|
||||
var storedBindings = Array.isArray(storage.keyBindings)
|
||||
? storage.keyBindings
|
||||
: [];
|
||||
|
||||
tc.settings.keyBindings = storedBindings
|
||||
.map((binding) => normalizeStoredBinding(binding))
|
||||
.filter(Boolean);
|
||||
|
||||
if (tc.settings.keyBindings.length === 0) {
|
||||
tc.settings.keyBindings = defaultKeyBindings(storage);
|
||||
tc.settings.version = "0.5.3";
|
||||
chrome.storage.sync.set({
|
||||
keyBindings: tc.settings.keyBindings,
|
||||
version: tc.settings.version,
|
||||
rememberSpeed: tc.settings.rememberSpeed,
|
||||
forceLastSavedSpeed: tc.settings.forceLastSavedSpeed,
|
||||
audioBoolean: tc.settings.audioBoolean,
|
||||
startHidden: tc.settings.startHidden,
|
||||
enabled: tc.settings.enabled,
|
||||
controllerLocation: tc.settings.controllerLocation,
|
||||
controllerOpacity: tc.settings.controllerOpacity
|
||||
});
|
||||
}
|
||||
tc.settings.lastSpeed = Number(storage.lastSpeed);
|
||||
if (!isValidSpeed(tc.settings.lastSpeed) && tc.settings.lastSpeed !== 1.0) {
|
||||
log(`Invalid lastSpeed detected: ${storage.lastSpeed}, resetting to 1.0`, 3);
|
||||
tc.settings.lastSpeed = 1.0;
|
||||
tc.persistedLastSpeed = 1.0;
|
||||
chrome.storage.sync.set({ lastSpeed: 1.0 });
|
||||
} else if (!isValidSpeed(tc.settings.lastSpeed)) {
|
||||
tc.settings.lastSpeed = 1.0;
|
||||
}
|
||||
tc.persistedLastSpeed = tc.settings.lastSpeed;
|
||||
tc.settings.rememberSpeed = Boolean(storage.rememberSpeed);
|
||||
tc.settings.forceLastSavedSpeed = Boolean(storage.forceLastSavedSpeed);
|
||||
tc.settings.audioBoolean = Boolean(storage.audioBoolean);
|
||||
tc.settings.enabled = Boolean(storage.enabled);
|
||||
tc.settings.startHidden = Boolean(storage.startHidden);
|
||||
tc.settings.hideWithControls =
|
||||
typeof storage.hideWithControls !== "undefined"
|
||||
? Boolean(storage.hideWithControls)
|
||||
: Boolean(storage.hideWithYouTubeControls);
|
||||
tc.settings.hideWithControlsTimer =
|
||||
Math.min(15, Math.max(0.1, Number(storage.hideWithControlsTimer) || 2.0));
|
||||
tc.settings.hideWithYouTubeControls = tc.settings.hideWithControls;
|
||||
tc.settings.controllerLocation = normalizeControllerLocation(
|
||||
storage.controllerLocation
|
||||
);
|
||||
tc.settings.controllerOpacity = Number(storage.controllerOpacity);
|
||||
tc.settings.controllerMarginTop = normalizeControllerMarginPx(
|
||||
storage.controllerMarginTop,
|
||||
0
|
||||
);
|
||||
tc.settings.controllerMarginRight = normalizeControllerMarginPx(
|
||||
0,
|
||||
0
|
||||
);
|
||||
tc.settings.controllerMarginBottom = normalizeControllerMarginPx(
|
||||
storage.controllerMarginBottom,
|
||||
typeof storage.controllerMarginBottom !== "undefined" ? 0 : 65
|
||||
);
|
||||
tc.settings.controllerMarginLeft = normalizeControllerMarginPx(
|
||||
0,
|
||||
0
|
||||
);
|
||||
tc.settings.siteRules = Array.isArray(storage.siteRules)
|
||||
? storage.siteRules
|
||||
: [];
|
||||
|
||||
tc.settings.controllerButtons = Array.isArray(storage.controllerButtons)
|
||||
? storage.controllerButtons
|
||||
: tc.settings.controllerButtons;
|
||||
|
||||
tc.settings.enableSubtitleNudge =
|
||||
typeof storage.enableSubtitleNudge !== "undefined"
|
||||
? Boolean(storage.enableSubtitleNudge)
|
||||
: tc.settings.enableSubtitleNudge;
|
||||
tc.settings.subtitleNudgeEnabledByDefault =
|
||||
typeof storage.subtitleNudgeEnabledByDefault !== "undefined"
|
||||
? Boolean(storage.subtitleNudgeEnabledByDefault)
|
||||
: tc.settings.subtitleNudgeEnabledByDefault;
|
||||
tc.settings.subtitleNudgeInterval = Math.min(
|
||||
1000,
|
||||
Math.max(10, Number(storage.subtitleNudgeInterval) || 50)
|
||||
);
|
||||
tc.settings.subtitleNudgeAmount =
|
||||
Number(storage.subtitleNudgeAmount) || tc.settings.subtitleNudgeAmount;
|
||||
var addedDefaultBinding = false;
|
||||
addedDefaultBinding =
|
||||
ensureDefaultKeyBinding(
|
||||
"display",
|
||||
"KeyV",
|
||||
0
|
||||
) || addedDefaultBinding;
|
||||
addedDefaultBinding =
|
||||
ensureDefaultKeyBinding("move", "KeyP", 0) || addedDefaultBinding;
|
||||
addedDefaultBinding =
|
||||
ensureDefaultKeyBinding("toggleSubtitleNudge", "KeyN", 0) ||
|
||||
addedDefaultBinding;
|
||||
|
||||
if (addedDefaultBinding) {
|
||||
chrome.storage.sync.set({ keyBindings: tc.settings.keyBindings });
|
||||
}
|
||||
captureSiteRuleBase();
|
||||
// patchAttachShadow() is now called at top-level before this callback
|
||||
// Add a listener for messages from the popup.
|
||||
// We use a global flag to ensure the listener is only attached once.
|
||||
if (!window.vscMessageListener) {
|
||||
chrome.runtime.onMessage.addListener(
|
||||
function(request, sender, sendResponse) {
|
||||
if (request.action === "rescan_page") {
|
||||
log("Re-scan command received from popup.", 4);
|
||||
initializeWhenReady(document, true);
|
||||
sendResponse({ status: "complete" });
|
||||
return false;
|
||||
}
|
||||
if (request.action === "get_speed") {
|
||||
// Do not sendResponse in frames with no media — only one response is
|
||||
// accepted tab-wide, and the top frame often wins before an iframe.
|
||||
var videoGs = getPrimaryVideoElement();
|
||||
if (!videoGs) return false;
|
||||
sendResponse({
|
||||
speed: videoGs.playbackRate
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (request.action === "get_page_context") {
|
||||
sendResponse({ url: location.href });
|
||||
return false;
|
||||
}
|
||||
if (request.action === "run_action") {
|
||||
var value = request.value;
|
||||
if (value === undefined || value === null) {
|
||||
value = getKeyBindings(request.actionName, "value");
|
||||
}
|
||||
runAction(request.actionName, value);
|
||||
var videoAfter = getPrimaryVideoElement();
|
||||
if (!videoAfter) return false;
|
||||
sendResponse({
|
||||
speed: videoAfter.playbackRate
|
||||
});
|
||||
return false;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
);
|
||||
|
||||
// Set the flag to prevent adding the listener again.
|
||||
window.vscMessageListener = true;
|
||||
}
|
||||
chrome.storage.local.get(["customButtonIcons"], function(loc) {
|
||||
tc.settings.customButtonIcons =
|
||||
loc &&
|
||||
loc.customButtonIcons &&
|
||||
typeof loc.customButtonIcons === "object"
|
||||
? loc.customButtonIcons
|
||||
: {};
|
||||
|
||||
if (!window.vscCustomIconListener) {
|
||||
window.vscCustomIconListener = true;
|
||||
chrome.storage.onChanged.addListener(function(changes, area) {
|
||||
if (area !== "local" || !changes.customButtonIcons) return;
|
||||
var nv = changes.customButtonIcons.newValue;
|
||||
tc.settings.customButtonIcons =
|
||||
nv && typeof nv === "object" ? nv : {};
|
||||
if (tc.mediaElements && tc.mediaElements.length) {
|
||||
tc.mediaElements.forEach(function(video) {
|
||||
if (!video.vsc || !video.vsc.div) return;
|
||||
var doc = video.ownerDocument;
|
||||
var shadow = video.vsc.div.shadowRoot;
|
||||
if (!shadow) return;
|
||||
shadow.querySelectorAll("button[data-action]").forEach(function(btn) {
|
||||
var act = btn.dataset.action;
|
||||
if (!act) return;
|
||||
var svg =
|
||||
tc.settings.customButtonIcons &&
|
||||
tc.settings.customButtonIcons[act] &&
|
||||
tc.settings.customButtonIcons[act].svg;
|
||||
vscClearElement(btn);
|
||||
if (svg) {
|
||||
var cw = vscCreateSvgWrap(doc, svg, "vsc-btn-icon");
|
||||
if (cw) {
|
||||
btn.appendChild(cw);
|
||||
} else {
|
||||
var cdf = controllerButtonDefs[act];
|
||||
btn.textContent = (cdf && cdf.label) || "?";
|
||||
}
|
||||
} else if (typeof vscIconWrap === "function") {
|
||||
var wrap = vscIconWrap(doc, act, 14);
|
||||
if (wrap) {
|
||||
btn.appendChild(wrap);
|
||||
} else {
|
||||
var cdf = controllerButtonDefs[act];
|
||||
btn.textContent = (cdf && cdf.label) || "?";
|
||||
}
|
||||
} else {
|
||||
var cdf2 = controllerButtonDefs[act];
|
||||
btn.textContent = (cdf2 && cdf2.label) || "?";
|
||||
}
|
||||
});
|
||||
updateSubtitleNudgeIndicator(video);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
initializeWhenReady(document);
|
||||
});
|
||||
});
|
||||
|
||||
function getKeyBindings(action, what = "value") {
|
||||
try {
|
||||
return tc.settings.keyBindings.find((item) => item.action === action)[what];
|
||||
} catch (e) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
function setKeyBindings(action, value) {
|
||||
tc.settings.keyBindings.find((item) => item.action === action)["value"] =
|
||||
value;
|
||||
}
|
||||
|
||||
function createControllerButton(doc, action, label, className) {
|
||||
var button = doc.createElement("button");
|
||||
button.dataset.action = action;
|
||||
var custom =
|
||||
tc.settings.customButtonIcons &&
|
||||
tc.settings.customButtonIcons[action] &&
|
||||
tc.settings.customButtonIcons[action].svg;
|
||||
if (custom) {
|
||||
var customWrap = vscCreateSvgWrap(doc, custom, "vsc-btn-icon");
|
||||
if (customWrap) {
|
||||
button.appendChild(customWrap);
|
||||
} else {
|
||||
button.textContent = label || "?";
|
||||
}
|
||||
} else if (typeof vscIconWrap === "function") {
|
||||
var wrap = vscIconWrap(doc, action, 14);
|
||||
if (wrap) {
|
||||
button.appendChild(wrap);
|
||||
} else {
|
||||
button.textContent = label || "?";
|
||||
}
|
||||
} else {
|
||||
button.textContent = label || "?";
|
||||
}
|
||||
if (className) {
|
||||
button.className = className;
|
||||
}
|
||||
return button;
|
||||
}
|
||||
|
||||
function defineVideoController() {
|
||||
tc.videoController = function(target, parent) {
|
||||
if (target.vsc) return target.vsc;
|
||||
tc.mediaElements.push(target);
|
||||
target.vsc = this;
|
||||
this.video = target;
|
||||
this.parent = target.parentElement || parent;
|
||||
this.nudgeAnimationId = null;
|
||||
this.restoreSpeedTimer = null;
|
||||
this.pendingRateChange = null;
|
||||
this.speedRestoreUntil = 0;
|
||||
this.subtitleNudgeEnabledOverride = null;
|
||||
this.suppressedRateChangeCount = 0;
|
||||
this.suppressedRateChangeUntil = 0;
|
||||
this.visibilityResumeHandler = null;
|
||||
this.resetToggleArmed = false;
|
||||
this.resetButtonEl = null;
|
||||
this.controllerLocation = normalizeControllerLocation(
|
||||
tc.settings.controllerLocation
|
||||
);
|
||||
|
||||
log(`Creating video controller for ${target.tagName} with src: ${target.src || target.currentSrc || "none"}`, 4);
|
||||
|
||||
let storedSpeed = sanitizeSpeed(resolveTargetSpeed(target), 1.0);
|
||||
this.targetSpeed = storedSpeed;
|
||||
this.targetSpeedSourceKey = getVideoSourceKey(target);
|
||||
this.mediaSourceKey = getVideoSourceKey(target);
|
||||
if (!tc.settings.rememberSpeed && !tc.settings.forceLastSavedSpeed) {
|
||||
setKeyBindings("reset", getKeyBindings("fast"));
|
||||
}
|
||||
|
||||
log("Explicitly setting playbackRate to: " + storedSpeed, 5);
|
||||
target.playbackRate = storedSpeed;
|
||||
|
||||
this.div = this.initializeControls();
|
||||
|
||||
if (!this.div) {
|
||||
log("ERROR: Failed to create controller div!", 2);
|
||||
return;
|
||||
}
|
||||
|
||||
log(`Controller created and attached to DOM. Hidden: ${this.div.classList.contains("vsc-hidden")}`, 4);
|
||||
|
||||
var mediaEventAction = function(event) {
|
||||
if (
|
||||
event.type === "loadedmetadata" ||
|
||||
event.type === "loadeddata" ||
|
||||
event.type === "canplay"
|
||||
) {
|
||||
applySourceTransitionPolicy(event.target, false);
|
||||
}
|
||||
|
||||
if (event.type === "play") {
|
||||
applySourceTransitionPolicy(event.target, false);
|
||||
extendSpeedRestoreWindow(event.target);
|
||||
|
||||
if (!tc.settings.rememberSpeed && !tc.settings.forceLastSavedSpeed) {
|
||||
setKeyBindings("reset", getKeyBindings("fast"));
|
||||
}
|
||||
|
||||
var playSpeed = sanitizeSpeed(resolveTargetSpeed(event.target), 1.0);
|
||||
if (Math.abs(event.target.playbackRate - playSpeed) > 0.01) {
|
||||
log("Play event: setting playbackRate to: " + playSpeed, 4);
|
||||
setSpeed(event.target, playSpeed, false, false);
|
||||
} else if (playSpeed === 1.0 || event.target.paused) {
|
||||
this.stopSubtitleNudge();
|
||||
} else {
|
||||
this.startSubtitleNudge();
|
||||
}
|
||||
} else if (event.type === "pause") {
|
||||
extendSpeedRestoreWindow(event.target);
|
||||
this.stopSubtitleNudge();
|
||||
tc.isNudging = false;
|
||||
} else if (event.type === "seeking") {
|
||||
extendSpeedRestoreWindow(event.target);
|
||||
} else if (event.type === "ended") {
|
||||
this.speedRestoreUntil = 0;
|
||||
this.stopSubtitleNudge();
|
||||
tc.isNudging = false;
|
||||
} else if (event.type === "seeked") {
|
||||
extendSpeedRestoreWindow(event.target);
|
||||
var expectedSpeed = sanitizeSpeed(resolveTargetSpeed(event.target), 1.0);
|
||||
var currentSpeed = event.target.playbackRate;
|
||||
|
||||
if (
|
||||
Math.abs(currentSpeed - expectedSpeed) > 0.01
|
||||
) {
|
||||
log(
|
||||
`Seeked: speed changed from ${expectedSpeed} to ${currentSpeed}, restoring`,
|
||||
4
|
||||
);
|
||||
setSpeed(event.target, expectedSpeed, false, false);
|
||||
}
|
||||
|
||||
if (isUserSeek) {
|
||||
isUserSeek = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
target.addEventListener(
|
||||
"loadedmetadata",
|
||||
(this.handleLoadedMetadata = mediaEventAction.bind(this))
|
||||
);
|
||||
target.addEventListener(
|
||||
"loadeddata",
|
||||
(this.handleLoadedData = mediaEventAction.bind(this))
|
||||
);
|
||||
target.addEventListener(
|
||||
"canplay",
|
||||
(this.handleCanPlay = mediaEventAction.bind(this))
|
||||
);
|
||||
target.addEventListener(
|
||||
"play",
|
||||
(this.handlePlay = mediaEventAction.bind(this))
|
||||
);
|
||||
target.addEventListener(
|
||||
"pause",
|
||||
(this.handlePause = mediaEventAction.bind(this))
|
||||
);
|
||||
target.addEventListener(
|
||||
"seeking",
|
||||
(this.handleSeeking = mediaEventAction.bind(this))
|
||||
);
|
||||
target.addEventListener(
|
||||
"ended",
|
||||
(this.handleEnded = mediaEventAction.bind(this))
|
||||
);
|
||||
target.addEventListener(
|
||||
"seeked",
|
||||
(this.handleSeek = mediaEventAction.bind(this))
|
||||
);
|
||||
|
||||
var srcObserver = new MutationObserver((mutations) => {
|
||||
mutations.forEach((mutation) => {
|
||||
if (
|
||||
mutation.type === "attributes" &&
|
||||
(mutation.attributeName === "src" ||
|
||||
mutation.attributeName === "currentSrc")
|
||||
) {
|
||||
log("mutation of A/V element", 5);
|
||||
if (this.div) {
|
||||
this.stopSubtitleNudge();
|
||||
if (!mutation.target.src && !mutation.target.currentSrc) {
|
||||
this.div.classList.add("vsc-nosource");
|
||||
} else {
|
||||
this.div.classList.remove("vsc-nosource");
|
||||
applySourceTransitionPolicy(this.video, true);
|
||||
if (!mutation.target.paused) this.startSubtitleNudge();
|
||||
}
|
||||
updateSubtitleNudgeIndicator(this.video);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
this.srcObserver = srcObserver;
|
||||
srcObserver.observe(target, { attributeFilter: ["src", "currentSrc"] });
|
||||
if (!target.paused && target.playbackRate !== 1.0)
|
||||
this.startSubtitleNudge();
|
||||
};
|
||||
|
||||
tc.videoController.prototype.remove = function() {
|
||||
this.stopSubtitleNudge();
|
||||
if (this.youTubeAutoHideObserver) {
|
||||
this.youTubeAutoHideObserver.disconnect();
|
||||
this.youTubeAutoHideObserver = null;
|
||||
}
|
||||
if (this.youTubeAutoHideCleanup) {
|
||||
this.youTubeAutoHideCleanup();
|
||||
this.youTubeAutoHideCleanup = null;
|
||||
}
|
||||
if (this.genericAutoHideCleanup) {
|
||||
this.genericAutoHideCleanup();
|
||||
this.genericAutoHideCleanup = null;
|
||||
}
|
||||
if (this.div) this.div.remove();
|
||||
if (this.restoreSpeedTimer) clearTimeout(this.restoreSpeedTimer);
|
||||
if (this.video) {
|
||||
this.video.removeEventListener("loadedmetadata", this.handleLoadedMetadata);
|
||||
this.video.removeEventListener("loadeddata", this.handleLoadedData);
|
||||
this.video.removeEventListener("canplay", this.handleCanPlay);
|
||||
this.video.removeEventListener("play", this.handlePlay);
|
||||
this.video.removeEventListener("pause", this.handlePause);
|
||||
this.video.removeEventListener("seeking", this.handleSeeking);
|
||||
this.video.removeEventListener("ended", this.handleEnded);
|
||||
this.video.removeEventListener("seeked", this.handleSeek);
|
||||
delete this.video.vsc;
|
||||
}
|
||||
if (this.srcObserver) this.srcObserver.disconnect();
|
||||
let idx = tc.mediaElements.indexOf(this.video);
|
||||
if (idx != -1) tc.mediaElements.splice(idx, 1);
|
||||
};
|
||||
|
||||
tc.videoController.prototype.startSubtitleNudge = function() {
|
||||
if (
|
||||
!isSubtitleNudgeSupported(this.video) ||
|
||||
!isSubtitleNudgeEnabledForVideo(this.video) ||
|
||||
this.nudgeAnimationId !== null ||
|
||||
!this.video ||
|
||||
this.video.paused ||
|
||||
this.video.playbackRate === 1.0
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Store the target speed so we can always revert to it
|
||||
this.targetSpeed = this.video.playbackRate;
|
||||
|
||||
const performNudge = () => {
|
||||
// Check if we should stop
|
||||
if (!this.video || this.video.paused || this.video.playbackRate === 1.0) {
|
||||
this.stopSubtitleNudge();
|
||||
return;
|
||||
}
|
||||
|
||||
// CRITICAL: Don't nudge if tab is hidden - prevents speed drift
|
||||
if (document.hidden) {
|
||||
if (!this.visibilityResumeHandler && this.video && this.video.ownerDocument) {
|
||||
this.visibilityResumeHandler = () => {
|
||||
if (this.video.ownerDocument.hidden) return;
|
||||
this.video.ownerDocument.removeEventListener(
|
||||
"visibilitychange",
|
||||
this.visibilityResumeHandler,
|
||||
true
|
||||
);
|
||||
this.visibilityResumeHandler = null;
|
||||
this.startSubtitleNudge();
|
||||
};
|
||||
this.video.ownerDocument.addEventListener(
|
||||
"visibilitychange",
|
||||
this.visibilityResumeHandler,
|
||||
true
|
||||
);
|
||||
}
|
||||
this.nudgeAnimationId = null;
|
||||
return;
|
||||
}
|
||||
|
||||
// Set flag to prevent ratechange listener from interfering
|
||||
tc.isNudging = true;
|
||||
suppressNextNudgeRateChanges(this, 2);
|
||||
|
||||
// Cache values to avoid repeated property access
|
||||
const targetSpeed = this.targetSpeed;
|
||||
const nudgeAmount = tc.settings.subtitleNudgeAmount;
|
||||
|
||||
// Apply nudge from the stored target speed (not current rate)
|
||||
this.video.playbackRate = targetSpeed + nudgeAmount;
|
||||
|
||||
// Revert synchronously after a microtask to ensure it happens immediately
|
||||
Promise.resolve().then(() => {
|
||||
if (this.video && targetSpeed) {
|
||||
this.video.playbackRate = targetSpeed;
|
||||
}
|
||||
tc.isNudging = false;
|
||||
});
|
||||
|
||||
// Schedule next nudge
|
||||
this.nudgeAnimationId = setTimeout(performNudge, tc.settings.subtitleNudgeInterval);
|
||||
};
|
||||
|
||||
// Start the first nudge
|
||||
this.nudgeAnimationId = setTimeout(performNudge, tc.settings.subtitleNudgeInterval);
|
||||
log(`Nudge: Starting with interval ${tc.settings.subtitleNudgeInterval}ms.`, 5);
|
||||
};
|
||||
|
||||
tc.videoController.prototype.stopSubtitleNudge = function() {
|
||||
if (this.nudgeAnimationId !== null) {
|
||||
clearTimeout(this.nudgeAnimationId);
|
||||
this.nudgeAnimationId = null;
|
||||
log(`Nudge: Stopping.`, 5);
|
||||
}
|
||||
if (this.visibilityResumeHandler && this.video && this.video.ownerDocument) {
|
||||
this.video.ownerDocument.removeEventListener(
|
||||
"visibilitychange",
|
||||
this.visibilityResumeHandler,
|
||||
true
|
||||
);
|
||||
this.visibilityResumeHandler = null;
|
||||
}
|
||||
// Clear the animation state, but PRESERVE targetSpeed so getDesiredSpeed
|
||||
// doesn't lose the user's intended speed if the site hijacks it.
|
||||
};
|
||||
|
||||
tc.videoController.prototype.performImmediateNudge = function() {
|
||||
if (
|
||||
!isSubtitleNudgeSupported(this.video) ||
|
||||
!isSubtitleNudgeEnabledForVideo(this.video) ||
|
||||
!this.video ||
|
||||
this.video.paused ||
|
||||
this.video.playbackRate === 1.0 ||
|
||||
document.hidden
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
const targetRate = this.targetSpeed || this.video.playbackRate;
|
||||
const nudgeAmount = tc.settings.subtitleNudgeAmount;
|
||||
|
||||
tc.isNudging = true;
|
||||
suppressNextNudgeRateChanges(this, 2);
|
||||
this.video.playbackRate = targetRate + nudgeAmount;
|
||||
|
||||
// Revert synchronously via microtask
|
||||
Promise.resolve().then(() => {
|
||||
if (this.video) {
|
||||
this.video.playbackRate = targetRate;
|
||||
}
|
||||
tc.isNudging = false;
|
||||
});
|
||||
|
||||
log(`Immediate nudge performed at rate ${targetRate.toFixed(2)}`, 5);
|
||||
};
|
||||
|
||||
tc.videoController.prototype.setupYouTubeAutoHide = function(wrapper) {
|
||||
if (!wrapper || !isOnYouTube()) return;
|
||||
|
||||
const video = this.video;
|
||||
const ytPlayer = video.closest(".html5-video-player");
|
||||
if (!ytPlayer) {
|
||||
log("YouTube player not found for auto-hide setup", 4);
|
||||
return;
|
||||
}
|
||||
|
||||
const syncControllerVisibility = () => {
|
||||
// YouTube adds ytp-autohide class to the player when controls should be hidden
|
||||
// We mirror this class state to enable CSS-based hiding
|
||||
// The vsc-hidden class (from V key) takes precedence via CSS specificity
|
||||
if (ytPlayer.classList.contains("ytp-autohide")) {
|
||||
wrapper.classList.add("ytp-autohide");
|
||||
|
||||
// Immediately end any temporary "vsc-show" state to hide with YouTube
|
||||
// UNLESS it was forced by a shortcut (vsc-forced-show)
|
||||
if (!wrapper.classList.contains("vsc-forced-show")) {
|
||||
wrapper.classList.remove("vsc-show");
|
||||
if (wrapper.showTimeOut) {
|
||||
clearTimeout(wrapper.showTimeOut);
|
||||
wrapper.showTimeOut = undefined;
|
||||
}
|
||||
}
|
||||
|
||||
log("YouTube controls hidden, hiding controller", 5);
|
||||
} else {
|
||||
wrapper.classList.remove("ytp-autohide");
|
||||
log("YouTube controls visible, showing controller", 5);
|
||||
}
|
||||
};
|
||||
|
||||
// Initial sync
|
||||
syncControllerVisibility();
|
||||
|
||||
// Observe YouTube player class changes
|
||||
this.youTubeAutoHideObserver = new MutationObserver((mutations) => {
|
||||
mutations.forEach((mutation) => {
|
||||
if (mutation.type === "attributes" && mutation.attributeName === "class") {
|
||||
syncControllerVisibility();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
this.youTubeAutoHideObserver.observe(ytPlayer, {
|
||||
attributes: true,
|
||||
attributeFilter: ["class"]
|
||||
});
|
||||
|
||||
log("YouTube auto-hide observer setup complete", 4);
|
||||
|
||||
// Also reveal on hover/activity independently of YouTube's own controls
|
||||
// for immediate responsiveness, UNLESS Speeder is actually toggled hidden (vsc-hidden)
|
||||
const resetTimer = () => {
|
||||
showController(wrapper, tc.settings.hideWithControlsTimer * 1000);
|
||||
};
|
||||
|
||||
const activityEvents = ["mousemove", "mousedown", "touchstart"];
|
||||
activityEvents.forEach((type) => {
|
||||
video.addEventListener(type, resetTimer, { passive: true });
|
||||
wrapper.addEventListener(type, resetTimer, { passive: true });
|
||||
ytPlayer.addEventListener(type, resetTimer, { passive: true });
|
||||
});
|
||||
|
||||
// Store a cleanup function
|
||||
this.youTubeAutoHideCleanup = () => {
|
||||
activityEvents.forEach((type) => {
|
||||
video.removeEventListener(type, resetTimer);
|
||||
wrapper.removeEventListener(type, resetTimer);
|
||||
ytPlayer.removeEventListener(type, resetTimer);
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
tc.videoController.prototype.setupGenericAutoHide = function(wrapper) {
|
||||
if (!wrapper) return;
|
||||
|
||||
const video = this.video;
|
||||
let timer = null;
|
||||
|
||||
const resetTimer = () => {
|
||||
wrapper.classList.remove("vsc-idle-hidden");
|
||||
showController(wrapper, tc.settings.hideWithControlsTimer * 1000);
|
||||
if (timer) {
|
||||
clearTimeout(timer);
|
||||
}
|
||||
timer = setTimeout(() => {
|
||||
// Only hide if the video is not paused
|
||||
// (Many players keep controls visible while paused)
|
||||
// However, the user said "Reveal on every mouse and keyboard input"
|
||||
// and "auto-hidden after timespan".
|
||||
// We'll follow the timer strictly.
|
||||
wrapper.classList.add("vsc-idle-hidden");
|
||||
log("Generic hide: controller hidden due to inactivity", 5);
|
||||
}, tc.settings.hideWithControlsTimer * 1000);
|
||||
};
|
||||
|
||||
// Initial show/timer
|
||||
resetTimer();
|
||||
|
||||
// The wrapper covers the player area on most sites due to inject.css styles,
|
||||
// but we listen on both the video and the wrapper for maximum coverage.
|
||||
const activityEvents = ["mousemove", "mousedown", "keydown", "touchstart"];
|
||||
const parentEl = video.parentElement;
|
||||
activityEvents.forEach((type) => {
|
||||
video.addEventListener(type, resetTimer, { passive: true });
|
||||
wrapper.addEventListener(type, resetTimer, { passive: true });
|
||||
if (parentEl) {
|
||||
parentEl.addEventListener(type, resetTimer, { passive: true });
|
||||
}
|
||||
});
|
||||
|
||||
// Also reset timer on play/pause events to ensure sync when player state changes
|
||||
video.addEventListener("play", resetTimer, { passive: true });
|
||||
video.addEventListener("pause", resetTimer, { passive: true });
|
||||
|
||||
// Store a cleanup function
|
||||
this.genericAutoHideCleanup = () => {
|
||||
if (timer) clearTimeout(timer);
|
||||
activityEvents.forEach((type) => {
|
||||
video.removeEventListener(type, resetTimer);
|
||||
wrapper.removeEventListener(type, resetTimer);
|
||||
if (parentEl) {
|
||||
parentEl.removeEventListener(type, resetTimer);
|
||||
}
|
||||
});
|
||||
video.removeEventListener("play", resetTimer);
|
||||
video.removeEventListener("pause", resetTimer);
|
||||
};
|
||||
|
||||
log(`Generic auto-hide setup complete with ${tc.settings.hideWithControlsTimer}s timer`, 4);
|
||||
};
|
||||
|
||||
tc.videoController.prototype.initializeControls = function() {
|
||||
const doc = this.video.ownerDocument;
|
||||
const speed = this.video.playbackRate.toFixed(2);
|
||||
var wrapper = doc.createElement("div");
|
||||
wrapper.classList.add("vsc-controller");
|
||||
if (!this.video.src && !this.video.currentSrc)
|
||||
wrapper.classList.add("vsc-nosource");
|
||||
if (tc.settings.startHidden) wrapper.classList.add("vsc-hidden");
|
||||
// z-index is handled by the base .vsc-controller CSS rule (2147483646).
|
||||
// The controller lives inside the video container, so high z-index only
|
||||
// makes it topmost within the local stacking context — it won't overlay
|
||||
// page-level modals or dialogs.
|
||||
var shadow = wrapper.attachShadow({ mode: "open" });
|
||||
var shadowStylesheet = doc.createElement("link");
|
||||
shadowStylesheet.rel = "stylesheet";
|
||||
shadowStylesheet.href = chrome.runtime.getURL("content/shadow.css");
|
||||
shadow.appendChild(shadowStylesheet);
|
||||
|
||||
var controller = doc.createElement("div");
|
||||
controller.id = "controller";
|
||||
controller.style.opacity = String(tc.settings.controllerOpacity);
|
||||
this.controllerLocation = applyControllerLocationToElement(
|
||||
controller,
|
||||
this.controllerLocation
|
||||
);
|
||||
|
||||
var dragHandle = doc.createElement("span");
|
||||
dragHandle.dataset.action = "drag";
|
||||
dragHandle.className = "draggable";
|
||||
dragHandle.textContent = speed;
|
||||
|
||||
var controls = doc.createElement("span");
|
||||
controls.id = "controls";
|
||||
|
||||
var buttonConfig = Array.isArray(tc.settings.controllerButtons)
|
||||
? tc.settings.controllerButtons
|
||||
: ["rewind", "slower", "faster", "advance", "display"];
|
||||
|
||||
var subtitleNudgeIndicator = null;
|
||||
|
||||
buttonConfig.forEach(function(btnId) {
|
||||
if (btnId === "nudge") {
|
||||
subtitleNudgeIndicator = doc.createElement("span");
|
||||
subtitleNudgeIndicator.id = "nudge-indicator";
|
||||
subtitleNudgeIndicator.setAttribute("role", "button");
|
||||
subtitleNudgeIndicator.setAttribute("aria-live", "polite");
|
||||
subtitleNudgeIndicator.setAttribute("tabindex", "0");
|
||||
controls.appendChild(subtitleNudgeIndicator);
|
||||
} else {
|
||||
var def = controllerButtonDefs[btnId];
|
||||
if (def) {
|
||||
controls.appendChild(
|
||||
createControllerButton(doc, btnId, def.label, def.className)
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var nudgeFlashIndicator = doc.createElement("span");
|
||||
nudgeFlashIndicator.id = "nudge-flash-indicator";
|
||||
nudgeFlashIndicator.setAttribute("aria-hidden", "true");
|
||||
|
||||
controller.appendChild(dragHandle);
|
||||
controller.appendChild(controls);
|
||||
/* Flash sits after #controls so it never inserts space between speed and buttons. */
|
||||
controller.appendChild(nudgeFlashIndicator);
|
||||
shadow.appendChild(controller);
|
||||
|
||||
this.speedIndicator = dragHandle;
|
||||
this.subtitleNudgeIndicator = subtitleNudgeIndicator;
|
||||
this.nudgeFlashIndicator = nudgeFlashIndicator;
|
||||
this.resetButtonEl =
|
||||
shadow.querySelector("button[data-action=\"reset\"]") || null;
|
||||
this.resetToggleArmed = false;
|
||||
if (subtitleNudgeIndicator) {
|
||||
updateSubtitleNudgeIndicator(this.video);
|
||||
}
|
||||
|
||||
function blurAfterPointerTap(target, e) {
|
||||
if (!target || typeof target.blur !== "function") return;
|
||||
var pt = e.pointerType;
|
||||
if (pt === "mouse" || pt === "touch" || (!pt && e.detail > 0)) {
|
||||
requestAnimationFrame(function() {
|
||||
target.blur();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
dragHandle.addEventListener(
|
||||
"mousedown",
|
||||
(e) => {
|
||||
var dragAction = dragHandle.dataset.action;
|
||||
runAction(dragAction, getKeyBindings(dragAction, "value"), e);
|
||||
e.stopPropagation();
|
||||
},
|
||||
true
|
||||
);
|
||||
shadow.querySelectorAll("button").forEach((button) => {
|
||||
button.addEventListener(
|
||||
"click",
|
||||
(e) => {
|
||||
var action = button.dataset.action;
|
||||
runAction(action, getKeyBindings(action), e);
|
||||
blurAfterPointerTap(button, e);
|
||||
e.stopPropagation();
|
||||
},
|
||||
true
|
||||
);
|
||||
});
|
||||
if (subtitleNudgeIndicator) {
|
||||
subtitleNudgeIndicator.addEventListener(
|
||||
"click",
|
||||
(e) => {
|
||||
var video = this.video;
|
||||
if (video) {
|
||||
var newState = !isSubtitleNudgeEnabledForVideo(video);
|
||||
setSubtitleNudgeEnabledForVideo(video, newState);
|
||||
}
|
||||
blurAfterPointerTap(subtitleNudgeIndicator, e);
|
||||
e.stopPropagation();
|
||||
},
|
||||
true
|
||||
);
|
||||
}
|
||||
controller.addEventListener("click", (e) => e.stopPropagation(), false);
|
||||
controller.addEventListener("mousedown", (e) => e.stopPropagation(), false);
|
||||
|
||||
// Setup auto-hide observers if enabled
|
||||
if (tc.settings.hideWithControls) {
|
||||
if (isOnYouTube()) {
|
||||
this.setupYouTubeAutoHide(wrapper);
|
||||
} else {
|
||||
this.setupGenericAutoHide(wrapper);
|
||||
}
|
||||
}
|
||||
|
||||
var fragment = doc.createDocumentFragment();
|
||||
fragment.appendChild(wrapper);
|
||||
const parentEl = this.parent || this.video.parentElement;
|
||||
|
||||
log(`Inserting controller: parentEl=${!!parentEl}, parentNode=${!!parentEl?.parentNode}, hostname=${location.hostname}`, 4);
|
||||
|
||||
if (!parentEl || !parentEl.parentNode) {
|
||||
log("No suitable parent found, appending to body", 4);
|
||||
doc.body.appendChild(fragment);
|
||||
return wrapper;
|
||||
}
|
||||
|
||||
try {
|
||||
switch (true) {
|
||||
case location.hostname == "www.amazon.com":
|
||||
case location.hostname == "www.reddit.com":
|
||||
case /hbogo\./.test(location.hostname):
|
||||
log("Using parentElement.parentElement insertion", 5);
|
||||
parentEl.parentElement.insertBefore(fragment, parentEl);
|
||||
break;
|
||||
case location.hostname == "www.facebook.com":
|
||||
log("Using Facebook-specific insertion", 5);
|
||||
let p =
|
||||
parentEl.parentElement.parentElement.parentElement.parentElement
|
||||
.parentElement.parentElement.parentElement;
|
||||
if (p && p.firstChild) p.insertBefore(fragment, p.firstChild);
|
||||
else parentEl.insertBefore(fragment, parentEl.firstChild);
|
||||
break;
|
||||
case location.hostname == "tv.apple.com":
|
||||
log("Using Apple TV-specific insertion", 5);
|
||||
const r = parentEl.getRootNode();
|
||||
const s = r && r.querySelector ? r.querySelector(".scrim") : null;
|
||||
if (s) s.prepend(fragment);
|
||||
else parentEl.insertBefore(fragment, parentEl.firstChild);
|
||||
break;
|
||||
case location.hostname == "www.youtube.com":
|
||||
case location.hostname == "m.youtube.com":
|
||||
case location.hostname == "music.youtube.com":
|
||||
// YouTube's player DOM has .html5-video-container (video's parent) as a
|
||||
// low layer with overlay siblings (.ytp-player-content, etc.) on top that
|
||||
// intercept mouse events. Insert into .html5-video-player (the player
|
||||
// root) so the controller sits above all overlay layers.
|
||||
log("Using YouTube-specific insertion", 5);
|
||||
var ytPlayer = parentEl.closest(".html5-video-player");
|
||||
if (ytPlayer) {
|
||||
ytPlayer.insertBefore(fragment, ytPlayer.firstChild);
|
||||
} else {
|
||||
parentEl.insertBefore(fragment, parentEl.firstChild);
|
||||
}
|
||||
break;
|
||||
default:
|
||||
log("Using default insertion method", 5);
|
||||
parentEl.insertBefore(fragment, parentEl.firstChild);
|
||||
}
|
||||
log("Controller successfully inserted into DOM", 4);
|
||||
} catch (error) {
|
||||
log(`Error inserting controller: ${error.message}`, 2);
|
||||
// Fallback to body insertion
|
||||
doc.body.appendChild(fragment);
|
||||
}
|
||||
|
||||
return wrapper;
|
||||
};
|
||||
}
|
||||
|
||||
function applySiteRuleOverrides() {
|
||||
resetSettingsFromSiteRuleBase();
|
||||
tc.activeSiteRule = null;
|
||||
|
||||
if (!Array.isArray(tc.settings.siteRules) || tc.settings.siteRules.length === 0) {
|
||||
return false;
|
||||
}
|
||||
|
||||
var currentUrl = location.href;
|
||||
var matchedRule = siteRuleUtils.matchSiteRule(currentUrl, tc.settings.siteRules);
|
||||
|
||||
if (!matchedRule) {
|
||||
return false;
|
||||
}
|
||||
|
||||
tc.activeSiteRule = matchedRule;
|
||||
log(`Matched site rule: ${matchedRule.pattern}`, 4);
|
||||
|
||||
// Check if extension should be enabled/disabled on this site
|
||||
if (siteRuleUtils.isSiteRuleDisabled(matchedRule)) {
|
||||
log(`Extension disabled for site: ${currentUrl}`, 4);
|
||||
return true;
|
||||
}
|
||||
|
||||
// Override general settings with site-specific overrides
|
||||
const siteSettings = [
|
||||
"startHidden",
|
||||
"hideWithControls",
|
||||
"hideWithControlsTimer",
|
||||
"controllerLocation",
|
||||
"rememberSpeed",
|
||||
"forceLastSavedSpeed",
|
||||
"audioBoolean",
|
||||
"controllerOpacity",
|
||||
"controllerMarginTop",
|
||||
"controllerMarginBottom",
|
||||
"enableSubtitleNudge",
|
||||
"subtitleNudgeEnabledByDefault",
|
||||
"subtitleNudgeInterval"
|
||||
];
|
||||
|
||||
siteSettings.forEach((key) => {
|
||||
if (matchedRule[key] !== undefined) {
|
||||
log(`Overriding ${key} for site: ${matchedRule[key]}`, 4);
|
||||
tc.settings[key] = matchedRule[key];
|
||||
}
|
||||
});
|
||||
|
||||
[
|
||||
"controllerMarginTop",
|
||||
"controllerMarginBottom"
|
||||
].forEach(function(key) {
|
||||
tc.settings[key] = normalizeControllerMarginPx(tc.settings[key], 0);
|
||||
});
|
||||
|
||||
if (Array.isArray(matchedRule.controllerButtons)) {
|
||||
log(`Overriding controllerButtons for site`, 4);
|
||||
tc.settings.controllerButtons = matchedRule.controllerButtons;
|
||||
}
|
||||
|
||||
// Override key bindings with site-specific shortcuts
|
||||
if (Array.isArray(matchedRule.shortcuts) && matchedRule.shortcuts.length > 0) {
|
||||
var overriddenActions = new Set();
|
||||
matchedRule.shortcuts.forEach((shortcut) => {
|
||||
overriddenActions.add(shortcut.action);
|
||||
});
|
||||
|
||||
// Keep global bindings that aren't overridden, add site-specific ones
|
||||
tc.settings.keyBindings = tc.settings.keyBindings
|
||||
.filter((binding) => !overriddenActions.has(binding.action))
|
||||
.concat(
|
||||
matchedRule.shortcuts.map((shortcut) =>
|
||||
normalizeStoredBinding(shortcut)
|
||||
).filter(Boolean)
|
||||
);
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
/** Apply current tc.settings controller layout/opacity to every attached controller (after site rules). */
|
||||
function refreshAllControllerGeometry() {
|
||||
tc.mediaElements.forEach(function(video) {
|
||||
if (!video || !video.vsc) return;
|
||||
applyControllerLocation(video.vsc, tc.settings.controllerLocation);
|
||||
var controllerEl = getControllerElement(video.vsc);
|
||||
if (controllerEl) {
|
||||
controllerEl.style.opacity = String(tc.settings.controllerOpacity);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/** Re-match site rules for current URL and refresh controller position/opacity on every video. */
|
||||
function reapplySiteRulesAndControllerGeometry() {
|
||||
applySiteRuleOverrides();
|
||||
if (!siteRuleUtils.isSpeederActiveForSite(tc.settings.enabled, tc.activeSiteRule)) {
|
||||
return;
|
||||
}
|
||||
refreshAllControllerGeometry();
|
||||
}
|
||||
|
||||
function shouldPreserveDesiredSpeed(video, speed) {
|
||||
if (!video || !video.vsc) return false;
|
||||
var desiredSpeed = getDesiredSpeed(video);
|
||||
if (!isValidSpeed(desiredSpeed) || Math.abs(speed - desiredSpeed) <= 0.01) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return (
|
||||
video.paused === true ||
|
||||
(typeof video.vsc.speedRestoreUntil === "number" &&
|
||||
video.vsc.speedRestoreUntil > Date.now())
|
||||
);
|
||||
}
|
||||
|
||||
function setupListener(root) {
|
||||
root = root || document;
|
||||
if (root.vscRateListenerAttached) return;
|
||||
|
||||
function updateSpeedFromEvent(video, skipResetDisarm) {
|
||||
if (!video.vsc || !video.vsc.speedIndicator) return;
|
||||
if (!skipResetDisarm) {
|
||||
video.vsc.resetToggleArmed = false;
|
||||
}
|
||||
var speed = video.playbackRate; // Preserve full precision (e.g. 0.0625)
|
||||
video.vsc.speedIndicator.textContent = speed.toFixed(2);
|
||||
video.vsc.targetSpeed = speed;
|
||||
video.vsc.targetSpeedSourceKey = getVideoSourceKey(video);
|
||||
var sourceKey = getVideoSourceKey(video);
|
||||
if (sourceKey !== "unknown_src") {
|
||||
tc.settings.speeds[sourceKey] = speed;
|
||||
}
|
||||
tc.settings.lastSpeed = speed;
|
||||
schedulePersistLastSpeed(speed);
|
||||
if (video.vsc) {
|
||||
if (speed === 1.0 || video.paused) video.vsc.stopSubtitleNudge();
|
||||
else video.vsc.startSubtitleNudge();
|
||||
}
|
||||
}
|
||||
|
||||
root.addEventListener(
|
||||
"ratechange",
|
||||
function(event) {
|
||||
if (tc.isNudging) return;
|
||||
var video = event.target;
|
||||
if (!video || typeof video.playbackRate === "undefined" || !video.vsc)
|
||||
return;
|
||||
if (shouldIgnoreSuppressedRateChange(video)) return;
|
||||
if (tc.settings.forceLastSavedSpeed) {
|
||||
if (event.detail && event.detail.origin === "videoSpeed") {
|
||||
video.playbackRate = event.detail.speed;
|
||||
updateSpeedFromEvent(video, true);
|
||||
} else {
|
||||
video.playbackRate = sanitizeSpeed(tc.settings.lastSpeed, 1.0);
|
||||
}
|
||||
event.stopImmediatePropagation();
|
||||
} else {
|
||||
var currentSpeed = video.playbackRate; // Preserve full precision (e.g. 0.0625)
|
||||
var desiredSpeed = getDesiredSpeed(video);
|
||||
var pendingRateChange = takePendingRateChange(video, currentSpeed);
|
||||
|
||||
if (pendingRateChange) {
|
||||
updateSpeedFromEvent(video, true);
|
||||
return;
|
||||
}
|
||||
|
||||
if (shouldPreserveDesiredSpeed(video, currentSpeed)) {
|
||||
log(
|
||||
`Ignoring external rate change to ${currentSpeed.toFixed(4)} while preserving ${desiredSpeed.toFixed(4)}`,
|
||||
4
|
||||
);
|
||||
video.vsc.resetToggleArmed = false;
|
||||
video.vsc.speedIndicator.textContent = desiredSpeed.toFixed(2);
|
||||
scheduleSpeedRestore(video, desiredSpeed, "pause/play or seek");
|
||||
return;
|
||||
}
|
||||
|
||||
updateSpeedFromEvent(video);
|
||||
}
|
||||
},
|
||||
true
|
||||
);
|
||||
root.vscRateListenerAttached = true;
|
||||
}
|
||||
|
||||
function clearPendingInitialization(doc) {
|
||||
if (!doc || !doc.vscPendingInitializeHandler) return;
|
||||
|
||||
var handler = doc.vscPendingInitializeHandler;
|
||||
doc.removeEventListener("DOMContentLoaded", handler);
|
||||
doc.removeEventListener("readystatechange", handler);
|
||||
|
||||
if (doc.defaultView) {
|
||||
doc.defaultView.removeEventListener("load", handler);
|
||||
}
|
||||
|
||||
delete doc.vscPendingInitializeHandler;
|
||||
doc.vscPendingForceReinit = false;
|
||||
}
|
||||
|
||||
function tryInitializeDocument(doc, forceReinit) {
|
||||
if (!doc) return false;
|
||||
if ((!forceReinit && vscInitializedDocuments.has(doc)) || !doc.body) {
|
||||
return false;
|
||||
}
|
||||
|
||||
initializeNow(doc, forceReinit);
|
||||
clearPendingInitialization(doc);
|
||||
return true;
|
||||
}
|
||||
|
||||
function initializeWhenReady(doc, forceReinit = false) {
|
||||
if (!doc) return;
|
||||
doc.vscPendingForceReinit = doc.vscPendingForceReinit === true || forceReinit;
|
||||
|
||||
if (tryInitializeDocument(doc, doc.vscPendingForceReinit)) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (doc.vscPendingInitializeHandler) return;
|
||||
|
||||
var pendingInitializeHandler = function() {
|
||||
tryInitializeDocument(doc, doc.vscPendingForceReinit === true);
|
||||
};
|
||||
|
||||
doc.vscPendingInitializeHandler = pendingInitializeHandler;
|
||||
doc.addEventListener("DOMContentLoaded", pendingInitializeHandler);
|
||||
doc.addEventListener("readystatechange", pendingInitializeHandler);
|
||||
|
||||
if (doc.defaultView) {
|
||||
doc.defaultView.addEventListener("load", pendingInitializeHandler);
|
||||
doc.defaultView.setTimeout(pendingInitializeHandler, 0);
|
||||
} else {
|
||||
setTimeout(pendingInitializeHandler, 0);
|
||||
}
|
||||
}
|
||||
|
||||
function inIframe() {
|
||||
try {
|
||||
return window.self !== window.top;
|
||||
} catch (e) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
function attachKeydownListeners(doc) {
|
||||
var docs = [doc];
|
||||
try {
|
||||
if (inIframe() && window.top.document !== doc) docs.push(window.top.document);
|
||||
} catch (e) {
|
||||
}
|
||||
|
||||
docs.forEach(function(keyDoc) {
|
||||
if (keyDoc.vscKeydownListenerAttached) return;
|
||||
keyDoc.addEventListener(
|
||||
"keydown",
|
||||
function(event) {
|
||||
if (
|
||||
!event.getModifierState ||
|
||||
event.getModifierState("Alt") ||
|
||||
event.getModifierState("Control") ||
|
||||
event.getModifierState("Fn") ||
|
||||
event.getModifierState("Meta") ||
|
||||
event.getModifierState("Hyper") ||
|
||||
event.getModifierState("OS")
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (
|
||||
event.target.nodeName === "INPUT" ||
|
||||
event.target.nodeName === "TEXTAREA" ||
|
||||
event.target.isContentEditable
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (!tc.mediaElements.length) return;
|
||||
|
||||
var item = tc.settings.keyBindings.find(function(binding) {
|
||||
return matchesKeyBinding(binding, event);
|
||||
});
|
||||
|
||||
if (item) {
|
||||
runAction(item.action, item.value, event);
|
||||
|
||||
// Always prevent default and stop propagation for Speeder shortcuts
|
||||
// to prevent the website (e.g. YouTube) from reacting to these keys.
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
},
|
||||
true
|
||||
);
|
||||
keyDoc.vscKeydownListenerAttached = true;
|
||||
});
|
||||
}
|
||||
|
||||
function attachMutationObserver(root) {
|
||||
if (root.vscMutationObserverAttached) return;
|
||||
|
||||
var pendingMutations = [];
|
||||
var mutationProcessingScheduled = false;
|
||||
var observer = new MutationObserver(function(mutations) {
|
||||
pendingMutations.push(...mutations);
|
||||
if (mutationProcessingScheduled) return;
|
||||
|
||||
mutationProcessingScheduled = true;
|
||||
requestIdle(
|
||||
function() {
|
||||
var mutationsToProcess = pendingMutations.splice(0);
|
||||
mutationProcessingScheduled = false;
|
||||
|
||||
mutationsToProcess.forEach(function(mutation) {
|
||||
if (mutation.type === "childList") {
|
||||
mutation.addedNodes.forEach(function(node) {
|
||||
// Skip text nodes, comments, etc. — only elements can contain media
|
||||
if (node.nodeType !== Node.ELEMENT_NODE) return;
|
||||
scanNodeForMedia(node, node.parentNode || mutation.target, true);
|
||||
});
|
||||
mutation.removedNodes.forEach(function(node) {
|
||||
if (node.nodeType !== Node.ELEMENT_NODE) return;
|
||||
scanNodeForMedia(node, node.parentNode || mutation.target, false);
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (mutation.type !== "attributes") return;
|
||||
|
||||
var target = mutation.target;
|
||||
if (
|
||||
isMediaElement(target) &&
|
||||
(mutation.attributeName === "src" ||
|
||||
mutation.attributeName === "currentSrc")
|
||||
) {
|
||||
ensureController(target, target.parentElement || target.parentNode);
|
||||
return;
|
||||
}
|
||||
|
||||
if (
|
||||
mutation.attributeName === "aria-hidden" &&
|
||||
target.attributes["aria-hidden"] &&
|
||||
target.attributes["aria-hidden"].value === "false"
|
||||
) {
|
||||
scanNodeForMedia(
|
||||
target,
|
||||
target.parentNode || root.host || mutation.target,
|
||||
true
|
||||
);
|
||||
}
|
||||
});
|
||||
},
|
||||
{ timeout: 1000 }
|
||||
);
|
||||
});
|
||||
|
||||
observer.observe(root, {
|
||||
attributeFilter: ["aria-hidden", "src", "currentSrc"],
|
||||
childList: true,
|
||||
subtree: true,
|
||||
attributes: true
|
||||
});
|
||||
|
||||
root.vscMutationObserverAttached = true;
|
||||
}
|
||||
|
||||
function attachMediaDetectionListeners(root) {
|
||||
if (root.vscMediaEventListenersAttached) return;
|
||||
|
||||
var handleDetectedMedia = function(event) {
|
||||
var target = event.target;
|
||||
if (!isMediaElement(target)) return;
|
||||
ensureController(target, target.parentElement || target.parentNode);
|
||||
};
|
||||
|
||||
[
|
||||
"loadstart",
|
||||
"loadeddata",
|
||||
"loadedmetadata",
|
||||
"canplay",
|
||||
"playing",
|
||||
"play"
|
||||
].forEach(function(eventName) {
|
||||
root.addEventListener(eventName, handleDetectedMedia, true);
|
||||
});
|
||||
root.vscMediaEventListenersAttached = true;
|
||||
}
|
||||
|
||||
function attachIframeListeners(doc) {
|
||||
Array.from(doc.getElementsByTagName("iframe")).forEach(function(frame) {
|
||||
if (!frame.vscLoadListenerAttached) {
|
||||
frame.addEventListener("load", function() {
|
||||
try {
|
||||
if (frame.contentDocument) {
|
||||
initializeWhenReady(frame.contentDocument, true);
|
||||
}
|
||||
} catch (e) {
|
||||
}
|
||||
});
|
||||
frame.vscLoadListenerAttached = true;
|
||||
}
|
||||
|
||||
try {
|
||||
if (frame.contentDocument) {
|
||||
initializeWhenReady(frame.contentDocument);
|
||||
}
|
||||
} catch (e) {
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function attachNavigationListeners() {
|
||||
if (window.vscNavigationListenersAttached) return;
|
||||
|
||||
var scheduleRescan = function() {
|
||||
clearTimeout(window.vscNavigationRescanTimer);
|
||||
window.vscNavigationRescanTimer = setTimeout(function() {
|
||||
initializeWhenReady(document, true);
|
||||
}, 300);
|
||||
};
|
||||
|
||||
["pushState", "replaceState"].forEach(function(method) {
|
||||
if (typeof history[method] !== "function") return;
|
||||
var original = history[method];
|
||||
history[method] = function() {
|
||||
var result = original.apply(this, arguments);
|
||||
scheduleRescan();
|
||||
return result;
|
||||
};
|
||||
});
|
||||
|
||||
window.addEventListener("popstate", scheduleRescan);
|
||||
window.addEventListener("hashchange", scheduleRescan);
|
||||
/* YouTube often navigates without a history API call the extension can see first */
|
||||
if (typeof document !== "undefined" && isOnYouTube()) {
|
||||
document.addEventListener("yt-navigate-finish", scheduleRescan);
|
||||
}
|
||||
window.vscNavigationListenersAttached = true;
|
||||
}
|
||||
|
||||
function initializeNow(doc, forceReinit = false) {
|
||||
if ((!forceReinit && vscInitializedDocuments.has(doc)) || !doc.body) return;
|
||||
|
||||
applySiteRuleOverrides();
|
||||
if (!siteRuleUtils.isSpeederActiveForSite(tc.settings.enabled, tc.activeSiteRule)) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (!doc.body.classList.contains("vsc-initialized")) {
|
||||
doc.body.classList.add("vsc-initialized");
|
||||
}
|
||||
if (typeof tc.videoController === "undefined") defineVideoController();
|
||||
attachKeydownListeners(doc);
|
||||
attachNavigationListeners();
|
||||
observeRoot(doc);
|
||||
|
||||
// Delayed rescan to catch custom elements whose shadow roots were created
|
||||
// before our attachShadow patch was installed (e.g. archive.org's <play-av>
|
||||
// Lit component, or any site that lazily creates shadow DOM video players).
|
||||
if (!doc.vscDelayedShadowScanDone) {
|
||||
doc.vscDelayedShadowScanDone = true;
|
||||
setTimeout(function() {
|
||||
if (!doc.body) return;
|
||||
try {
|
||||
var els = doc.body.querySelectorAll("*");
|
||||
for (var i = 0; i < els.length; i++) {
|
||||
if (els[i].shadowRoot && !vscObservedRoots.has(els[i].shadowRoot)) {
|
||||
observeRoot(els[i].shadowRoot);
|
||||
}
|
||||
}
|
||||
} catch (e) {}
|
||||
}, 3000);
|
||||
}
|
||||
|
||||
if (forceReinit) {
|
||||
log("Force re-initialization requested", 4);
|
||||
refreshAllControllerGeometry();
|
||||
}
|
||||
|
||||
vscInitializedDocuments.add(doc);
|
||||
}
|
||||
|
||||
function setSpeed(
|
||||
video,
|
||||
speed,
|
||||
isInitialCall = false,
|
||||
isUserKeyPress = false,
|
||||
fromResetSpeedToggle = false
|
||||
) {
|
||||
const numericSpeed = Number(speed);
|
||||
|
||||
if (!isValidSpeed(numericSpeed)) {
|
||||
log(
|
||||
`Invalid speed rejected: ${speed}, must be between ${MIN_SPEED} and ${MAX_SPEED}`,
|
||||
2
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
if (!video || !video.vsc || !video.vsc.speedIndicator) return;
|
||||
|
||||
if (isUserKeyPress && !fromResetSpeedToggle) {
|
||||
video.vsc.resetToggleArmed = false;
|
||||
}
|
||||
|
||||
log(
|
||||
`setSpeed: Target ${numericSpeed.toFixed(2)}. Initial: ${isInitialCall}. UserKeyPress: ${isUserKeyPress}`,
|
||||
4
|
||||
);
|
||||
tc.settings.lastSpeed = numericSpeed;
|
||||
video.vsc.speedIndicator.textContent = numericSpeed.toFixed(2);
|
||||
|
||||
// Update the target speed for nudge so it knows what to revert to
|
||||
video.vsc.targetSpeed = numericSpeed;
|
||||
video.vsc.targetSpeedSourceKey = getVideoSourceKey(video);
|
||||
|
||||
if (isUserKeyPress && !isInitialCall && video.vsc && video.vsc.div) {
|
||||
runAction("blink", 1000, null, video); // Pass video to blink
|
||||
extendSpeedRestoreWindow(video); // Protect against immediate site-driven resets
|
||||
}
|
||||
|
||||
// Try YouTube's native speed API first — keeps subtitles in sync without nudge
|
||||
var usedNativeSpeed = false;
|
||||
if (tc.settings.forceLastSavedSpeed) {
|
||||
video.dispatchEvent(
|
||||
new CustomEvent("ratechange", {
|
||||
detail: {
|
||||
origin: "videoSpeed",
|
||||
speed: numericSpeed.toFixed(2),
|
||||
fromUserInput: isUserKeyPress
|
||||
}
|
||||
})
|
||||
);
|
||||
} else {
|
||||
if (Math.abs(video.playbackRate - numericSpeed) > 0.001) {
|
||||
rememberPendingRateChange(video, numericSpeed);
|
||||
usedNativeSpeed = tryYouTubeNativeSpeed(video, numericSpeed);
|
||||
if (!usedNativeSpeed) {
|
||||
video.playbackRate = numericSpeed;
|
||||
}
|
||||
}
|
||||
}
|
||||
if (video.vsc) {
|
||||
if (numericSpeed === 1.0 || video.paused) {
|
||||
video.vsc.stopSubtitleNudge();
|
||||
} else if (usedNativeSpeed) {
|
||||
// YouTube's native API handles subtitle sync — no nudge needed
|
||||
video.vsc.stopSubtitleNudge();
|
||||
} else {
|
||||
video.vsc.startSubtitleNudge();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function runAction(action, value, e) {
|
||||
log("runAction Begin", 5);
|
||||
var mediaTagsToProcess;
|
||||
const specificVideo = arguments[3] || null;
|
||||
var subtitleNudgeToggleValue = null;
|
||||
|
||||
if (specificVideo) {
|
||||
mediaTagsToProcess = [specificVideo];
|
||||
} else if (e && e.target && e.target.getRootNode) {
|
||||
// Event-driven action
|
||||
const docContext = e.target.ownerDocument || document;
|
||||
mediaTagsToProcess = tc.mediaElements.filter(
|
||||
(v) => v.ownerDocument === docContext
|
||||
);
|
||||
const targetController = e.target.getRootNode().host;
|
||||
if (targetController) {
|
||||
// If it's a click on a controller, only use that one video
|
||||
const videoFromController = tc.mediaElements.find(
|
||||
(v) => v.vsc && v.vsc.div === targetController
|
||||
);
|
||||
if (videoFromController) mediaTagsToProcess = [videoFromController];
|
||||
}
|
||||
} else {
|
||||
mediaTagsToProcess = tc.mediaElements;
|
||||
}
|
||||
if (action === "settings") {
|
||||
chrome.runtime.sendMessage({ action: "openOptions" });
|
||||
return;
|
||||
}
|
||||
if (mediaTagsToProcess.length === 0 && action !== "display") return;
|
||||
|
||||
if (action === "toggleSubtitleNudge" && mediaTagsToProcess.length > 0) {
|
||||
subtitleNudgeToggleValue = !isSubtitleNudgeEnabledForVideo(
|
||||
mediaTagsToProcess[0]
|
||||
);
|
||||
}
|
||||
|
||||
mediaTagsToProcess.forEach(function(v) {
|
||||
if (!v.vsc) return; // Don't process videos without a controller
|
||||
var controller = v.vsc.div;
|
||||
const userDrivenActionsThatShowController = [
|
||||
"rewind",
|
||||
"advance",
|
||||
"faster",
|
||||
"slower",
|
||||
"louder",
|
||||
"softer",
|
||||
"reset",
|
||||
"fast",
|
||||
"move",
|
||||
"pause",
|
||||
"muted",
|
||||
"mark",
|
||||
"jump",
|
||||
"drag",
|
||||
"nudge",
|
||||
"toggleSubtitleNudge",
|
||||
"display"
|
||||
];
|
||||
var subtitleNudgeActionBlocked =
|
||||
(action === "toggleSubtitleNudge" || action === "nudge") &&
|
||||
!isSubtitleNudgeAvailableForVideo(v);
|
||||
if (
|
||||
userDrivenActionsThatShowController.includes(action) &&
|
||||
action !== "display" &&
|
||||
!subtitleNudgeActionBlocked
|
||||
) {
|
||||
showController(controller, 2000, true);
|
||||
}
|
||||
if (v.classList.contains("vsc-cancelled")) return;
|
||||
const numValue = parseFloat(value);
|
||||
switch (action) {
|
||||
case "rewind":
|
||||
isUserSeek = true;
|
||||
extendSpeedRestoreWindow(v);
|
||||
v.currentTime -= numValue;
|
||||
break;
|
||||
case "advance":
|
||||
isUserSeek = true;
|
||||
extendSpeedRestoreWindow(v);
|
||||
v.currentTime += numValue;
|
||||
break;
|
||||
case "faster":
|
||||
var fasterStep = numValue;
|
||||
// Use grid-snapping: always move to the next multiple of fasterStep
|
||||
// Add a tiny epsilon (1% of step) to jump clear of the current point
|
||||
var newFasterSpeed = Math.ceil((v.playbackRate + (fasterStep * 0.01)) / fasterStep) * fasterStep;
|
||||
// Clean up JS floating point math (e.g. 0.30000000000000004 -> 0.30)
|
||||
newFasterSpeed = Math.round(newFasterSpeed * 1000) / 1000;
|
||||
setSpeed(v, Math.min(newFasterSpeed, MAX_SPEED), false, true);
|
||||
break;
|
||||
case "slower":
|
||||
var slowerStep = numValue;
|
||||
// Use grid-snapping: always move to the previous multiple of slowerStep
|
||||
// Subtract a tiny epsilon (1% of step) to jump clear of the current point
|
||||
var newSlowerSpeed = Math.floor((v.playbackRate - (slowerStep * 0.01)) / slowerStep) * slowerStep;
|
||||
// Clean up JS floating point math
|
||||
newSlowerSpeed = Math.round(newSlowerSpeed * 1000) / 1000;
|
||||
setSpeed(v, Math.max(newSlowerSpeed, MIN_SPEED), false, true);
|
||||
break;
|
||||
case "reset":
|
||||
resetSpeed(v, 1.0, false); // Use enhanced resetSpeed
|
||||
break;
|
||||
case "fast":
|
||||
var preferredSpeed = numValue;
|
||||
// Apply site-specific preferred speed override if available
|
||||
if (tc.activeSiteRule && typeof tc.activeSiteRule.preferredSpeed === "number") {
|
||||
preferredSpeed = tc.activeSiteRule.preferredSpeed;
|
||||
}
|
||||
resetSpeed(v, preferredSpeed, true);
|
||||
break;
|
||||
case "display":
|
||||
if (controller.classList.contains("vsc-hidden")) {
|
||||
controller.classList.remove("vsc-hidden");
|
||||
showController(controller, 2000, true);
|
||||
} else {
|
||||
controller.classList.add("vsc-hidden");
|
||||
// Clear any show state when explicitly hiding
|
||||
controller.classList.remove("vsc-show");
|
||||
controller.classList.remove("vsc-forced-show");
|
||||
if (controller.showTimeOut) {
|
||||
clearTimeout(controller.showTimeOut);
|
||||
controller.showTimeOut = undefined;
|
||||
}
|
||||
}
|
||||
break;
|
||||
case "blink":
|
||||
log(`Blink action: controller hidden=${controller.classList.contains("vsc-hidden")}, timeout=${controller.blinkTimeOut !== undefined}, duration=${numValue}`, 5);
|
||||
|
||||
if (
|
||||
controller.classList.contains("vsc-hidden") ||
|
||||
controller.blinkTimeOut !== undefined
|
||||
) {
|
||||
var restoreHidden =
|
||||
controller.restoreHiddenAfterBlink === true ||
|
||||
controller.classList.contains("vsc-hidden");
|
||||
|
||||
if (controller.blinkTimeOut !== undefined) {
|
||||
clearTimeout(controller.blinkTimeOut);
|
||||
}
|
||||
|
||||
controller.restoreHiddenAfterBlink = restoreHidden;
|
||||
controller.classList.remove("vsc-hidden");
|
||||
log(`Controller shown, setting timeout for ${numValue || 1000}ms`, 5);
|
||||
|
||||
controller.blinkTimeOut = setTimeout(() => {
|
||||
if (controller.restoreHiddenAfterBlink === true) {
|
||||
controller.classList.add("vsc-hidden");
|
||||
log("Controller auto-hidden after blink timeout", 5);
|
||||
} else {
|
||||
log("Controller kept visible", 5);
|
||||
}
|
||||
controller.restoreHiddenAfterBlink = false;
|
||||
controller.blinkTimeOut = undefined;
|
||||
}, numValue || 1000);
|
||||
}
|
||||
break;
|
||||
case "drag":
|
||||
if (e) handleDrag(v, e);
|
||||
break;
|
||||
case "move":
|
||||
cycleControllerLocation(v);
|
||||
break;
|
||||
case "pause":
|
||||
pause(v);
|
||||
break;
|
||||
case "muted":
|
||||
muted(v);
|
||||
break;
|
||||
case "louder":
|
||||
volumeUp(v, Number.isFinite(numValue) ? numValue : 0.1);
|
||||
break;
|
||||
case "softer":
|
||||
volumeDown(v, Number.isFinite(numValue) ? numValue : 0.1);
|
||||
break;
|
||||
case "mark":
|
||||
setMark(v);
|
||||
break;
|
||||
case "jump":
|
||||
jumpToMark(v);
|
||||
break;
|
||||
case "toggleSubtitleNudge":
|
||||
setSubtitleNudgeEnabledForVideo(v, subtitleNudgeToggleValue);
|
||||
break;
|
||||
case "nudge":
|
||||
setSubtitleNudgeEnabledForVideo(
|
||||
v,
|
||||
!isSubtitleNudgeEnabledForVideo(v)
|
||||
);
|
||||
break;
|
||||
}
|
||||
});
|
||||
log("runAction End", 5);
|
||||
}
|
||||
|
||||
function pause(v) {
|
||||
if (v.paused) v.play().catch((e) => log(`Play err:${e.message}`, 2));
|
||||
else v.pause();
|
||||
}
|
||||
|
||||
function resetSpeed(v, target, isFastKey = false) {
|
||||
const videoId = getVideoSourceKey(v);
|
||||
const currentSpeed = v.playbackRate;
|
||||
|
||||
if (isFastKey) {
|
||||
// G key: Toggle between current speed and preferred speed (e.g., 1.8)
|
||||
const preferredSpeed = target;
|
||||
const lastToggle = lastToggleSpeed[videoId] || currentSpeed;
|
||||
|
||||
if (Math.abs(currentSpeed - preferredSpeed) < 0.01) {
|
||||
// Currently at preferred speed, toggle to the last speed
|
||||
setSpeed(v, lastToggle, false, true);
|
||||
} else {
|
||||
// Not at preferred speed, save current as toggle speed and go to preferred
|
||||
lastToggleSpeed[videoId] = currentSpeed;
|
||||
setSpeed(v, preferredSpeed, false, true);
|
||||
}
|
||||
} else {
|
||||
// R key: Toggle between current speed and 1.0
|
||||
const resetSpeedValue = 1.0;
|
||||
const lastToggle = lastToggleSpeed[videoId] || currentSpeed;
|
||||
|
||||
if (Math.abs(currentSpeed - resetSpeedValue) < 0.01) {
|
||||
// Currently at 1.0, toggle to the last speed (or 1.8 if no history)
|
||||
const speedToRestore =
|
||||
Math.abs(lastToggle - 1.0) < 0.01
|
||||
? getKeyBindings("fast") || 1.8
|
||||
: lastToggle;
|
||||
setSpeed(v, speedToRestore, false, true, true);
|
||||
} else {
|
||||
// Not at 1.0, save current as toggle speed and go to 1.0
|
||||
lastToggleSpeed[videoId] = currentSpeed;
|
||||
v.vsc.resetToggleArmed = true;
|
||||
setSpeed(v, resetSpeedValue, false, true, true);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function muted(v) {
|
||||
var nextMuted = !v.muted;
|
||||
v.muted = nextMuted;
|
||||
if (!isOnYouTube()) return;
|
||||
var ytApi = getYouTubePlayerApi(v);
|
||||
if (!ytApi) return;
|
||||
if (nextMuted && typeof ytApi.mute === "function") ytApi.mute();
|
||||
if (!nextMuted && typeof ytApi.unMute === "function") ytApi.unMute();
|
||||
}
|
||||
|
||||
function getYouTubePlayerApi(video) {
|
||||
if (!isOnYouTube()) return null;
|
||||
var playerEl =
|
||||
(video && video.closest ? video.closest(".html5-video-player") : null) ||
|
||||
document.getElementById("movie_player") ||
|
||||
document.querySelector(".html5-video-player");
|
||||
if (!playerEl) return null;
|
||||
return playerEl.wrappedJSObject || playerEl;
|
||||
}
|
||||
|
||||
function syncYouTubePlayerVolume(video, volume) {
|
||||
var ytApi = getYouTubePlayerApi(video);
|
||||
if (!ytApi || typeof ytApi.setVolume !== "function") return;
|
||||
ytApi.setVolume(Math.round(volume * 100));
|
||||
if (volume > 0 && typeof ytApi.unMute === "function") {
|
||||
ytApi.unMute();
|
||||
}
|
||||
}
|
||||
|
||||
function setVideoVolume(video, targetVolume) {
|
||||
var nextVolume = Math.max(0, Math.min(1, Number(targetVolume.toFixed(2))));
|
||||
video.volume = nextVolume;
|
||||
if (nextVolume > 0 && video.muted) {
|
||||
video.muted = false;
|
||||
}
|
||||
syncYouTubePlayerVolume(video, nextVolume);
|
||||
}
|
||||
|
||||
function volumeUp(v, value) {
|
||||
setVideoVolume(v, v.volume + value);
|
||||
}
|
||||
|
||||
function volumeDown(v, value) {
|
||||
setVideoVolume(v, v.volume - value);
|
||||
}
|
||||
|
||||
function setMark(v) {
|
||||
v.vsc.mark = v.currentTime;
|
||||
}
|
||||
|
||||
function jumpToMark(v) {
|
||||
if (v.vsc && typeof v.vsc.mark === "number") {
|
||||
extendSpeedRestoreWindow(v);
|
||||
v.currentTime = v.vsc.mark;
|
||||
}
|
||||
}
|
||||
|
||||
function handleDrag(video, e) {
|
||||
const c = video.vsc.div;
|
||||
const sC = convertControllerToManualPosition(video.vsc);
|
||||
if (!sC) return;
|
||||
var pE = c.parentElement;
|
||||
while (
|
||||
pE.parentNode &&
|
||||
pE.parentNode.offsetHeight === pE.offsetHeight &&
|
||||
pE.parentNode.offsetWidth === pE.offsetWidth
|
||||
)
|
||||
pE = pE.parentNode;
|
||||
video.classList.add("vcs-dragging");
|
||||
sC.classList.add("dragging");
|
||||
const iXY = [e.clientX, e.clientY],
|
||||
iCXY = [parseInt(sC.style.left), parseInt(sC.style.top)];
|
||||
const sD = (e) => {
|
||||
sC.style.setProperty(
|
||||
"left",
|
||||
iCXY[0] + e.clientX - iXY[0] + "px",
|
||||
"important"
|
||||
);
|
||||
sC.style.setProperty(
|
||||
"top",
|
||||
iCXY[1] + e.clientY - iXY[1] + "px",
|
||||
"important"
|
||||
);
|
||||
};
|
||||
const eD = () => {
|
||||
pE.removeEventListener("mousemove", sD);
|
||||
pE.removeEventListener("mouseup", eD);
|
||||
pE.removeEventListener("mouseleave", eD);
|
||||
sC.classList.remove("dragging");
|
||||
video.classList.remove("vcs-dragging");
|
||||
};
|
||||
pE.addEventListener("mouseup", eD);
|
||||
pE.addEventListener("mouseleave", eD);
|
||||
pE.addEventListener("mousemove", sD);
|
||||
}
|
||||
|
||||
function showController(controller, duration = 2000, forced = false) {
|
||||
if (!controller || typeof controller.classList === "undefined") return;
|
||||
var restoreHidden =
|
||||
controller.restoreHiddenAfterShow === true ||
|
||||
controller.classList.contains("vsc-hidden");
|
||||
|
||||
controller.restoreHiddenAfterShow = restoreHidden;
|
||||
controller.classList.remove("vsc-hidden");
|
||||
controller.classList.add("vsc-show");
|
||||
if (forced) {
|
||||
controller.classList.add("vsc-forced-show");
|
||||
}
|
||||
|
||||
if (controller.showTimeOut !== undefined) {
|
||||
clearTimeout(controller.showTimeOut);
|
||||
}
|
||||
|
||||
controller.showTimeOut = setTimeout(function() {
|
||||
controller.classList.remove("vsc-show");
|
||||
controller.classList.remove("vsc-forced-show");
|
||||
if (controller.restoreHiddenAfterShow === true) {
|
||||
controller.classList.add("vsc-hidden");
|
||||
}
|
||||
controller.restoreHiddenAfterShow = false;
|
||||
controller.showTimeOut = undefined;
|
||||
}, duration);
|
||||
}
|
||||
|
||||
// Add global listener to handle fullscreen transitions and adjust controller positions
|
||||
document.addEventListener("fullscreenchange", () => {
|
||||
tc.mediaElements.forEach((video) => {
|
||||
if (video.vsc) {
|
||||
applyControllerLocation(video.vsc, video.vsc.controllerLocation);
|
||||
}
|
||||
});
|
||||
});
|
||||
Reference in new issue
Block a user