mirror of
https://github.com/th-ch/youtube-music.git
synced 2026-01-11 10:31:47 +00:00
add volume hud
This commit is contained in:
@ -1,5 +1,3 @@
|
|||||||
const { isEnabled } = require("../../config/plugins");
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
This is used to determine if plugin is actually active
|
This is used to determine if plugin is actually active
|
||||||
(not if its only enabled in options)
|
(not if its only enabled in options)
|
||||||
@ -9,12 +7,8 @@ let enabled = false;
|
|||||||
module.exports = (win) => {
|
module.exports = (win) => {
|
||||||
enabled = true;
|
enabled = true;
|
||||||
|
|
||||||
// youtube-music register some of the target listeners after DOMContentLoaded
|
|
||||||
// did-finish-load is called after all elements finished loading, including said listeners
|
|
||||||
// Thats the reason the timing is controlled from main
|
|
||||||
win.webContents.once("did-finish-load", () => {
|
win.webContents.once("did-finish-load", () => {
|
||||||
win.webContents.send("restoreAddEventListener");
|
win.webContents.send("did-finish-load");
|
||||||
win.webContents.send("setupVideoPlayerVolumeMousewheel", !isEnabled("hide-video-player"));
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@ -16,15 +16,45 @@ module.exports = (options) => {
|
|||||||
setupGlobalShortcuts(options);
|
setupGlobalShortcuts(options);
|
||||||
}
|
}
|
||||||
|
|
||||||
firstRun(options);
|
ipcRenderer.once("did-finish-load", () => {
|
||||||
|
injectVolumeHud();
|
||||||
// This way the ipc listener gets cleared either way
|
// if hideVideo is disabled
|
||||||
ipcRenderer.once("setupVideoPlayerVolumeMousewheel", (_event, toEnable) => {
|
if ($("#main-panel")?.computedStyleMap().get("display").value !== "none") {
|
||||||
if (toEnable)
|
|
||||||
setupVideoPlayerOnwheel(options);
|
setupVideoPlayerOnwheel(options);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
firstRun(options);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
function injectVolumeHud() {
|
||||||
|
const position = `top: 18px; right: 60px; z-index: 999; position: absolute;`;
|
||||||
|
const mainStyle = "font-size: xx-large; padding: 10px; transition: opacity 1.5s"
|
||||||
|
$(".center-content.ytmusic-nav-bar").insertAdjacentHTML('beforeend', `<span id="volumeHud" style="${position + mainStyle}"></span>`)
|
||||||
|
}
|
||||||
|
|
||||||
|
let hudFadeTimeout;
|
||||||
|
|
||||||
|
function showVolumeHud(volume) {
|
||||||
|
let volumeHud = $('#volumeHud');
|
||||||
|
if (!volumeHud) {
|
||||||
|
console.error("volumeHud Not Found !");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
volumeHud.textContent = volume + '%';
|
||||||
|
volumeHud.style.opacity = 1;
|
||||||
|
|
||||||
|
if (hudFadeTimeout) {
|
||||||
|
clearTimeout(hudFadeTimeout);
|
||||||
|
}
|
||||||
|
|
||||||
|
hudFadeTimeout = setTimeout(() => {
|
||||||
|
volumeHud.style.opacity = 0;
|
||||||
|
hudFadeTimeout = null;
|
||||||
|
}, 2000);
|
||||||
|
}
|
||||||
|
|
||||||
/** Add onwheel event to video player */
|
/** Add onwheel event to video player */
|
||||||
function setupVideoPlayerOnwheel(options) {
|
function setupVideoPlayerOnwheel(options) {
|
||||||
$("#main-panel").addEventListener("wheel", event => {
|
$("#main-panel").addEventListener("wheel", event => {
|
||||||
@ -102,8 +132,10 @@ function changeVolume(toIncrease, options) {
|
|||||||
slider.value = options.savedVolume;
|
slider.value = options.savedVolume;
|
||||||
// Change tooltips to new value
|
// Change tooltips to new value
|
||||||
setTooltip(options.savedVolume);
|
setTooltip(options.savedVolume);
|
||||||
// Show volume slider on volume change
|
// Show volume slider
|
||||||
showVolumeSlider(slider);
|
showVolumeSlider(slider);
|
||||||
|
// Show volume HUD
|
||||||
|
showVolumeHud(options.savedVolume);
|
||||||
}
|
}
|
||||||
|
|
||||||
let volumeHoverTimeoutID;
|
let volumeHoverTimeoutID;
|
||||||
|
|||||||
@ -25,7 +25,7 @@ function overrideAddEventListener() {
|
|||||||
module.exports = () => {
|
module.exports = () => {
|
||||||
overrideAddEventListener();
|
overrideAddEventListener();
|
||||||
// Restore original function after did-finish-load to avoid keeping Element.prototype altered
|
// Restore original function after did-finish-load to avoid keeping Element.prototype altered
|
||||||
ipcRenderer.once("restoreAddEventListener", () => { // Called from main to make sure page is completly loaded
|
ipcRenderer.once("did-finish-load", () => { // Called from main to make sure page is completly loaded
|
||||||
Element.prototype.addEventListener = Element.prototype._addEventListener;
|
Element.prototype.addEventListener = Element.prototype._addEventListener;
|
||||||
Element.prototype._addEventListener = undefined;
|
Element.prototype._addEventListener = undefined;
|
||||||
ignored = undefined;
|
ignored = undefined;
|
||||||
|
|||||||
Reference in New Issue
Block a user