diff --git a/plugins/precise-volume/front.js b/plugins/precise-volume/front.js index 4bb606cd..189a20eb 100644 --- a/plugins/precise-volume/front.js +++ b/plugins/precise-volume/front.js @@ -39,13 +39,13 @@ function firstRun(options) { function injectVolumeHud(noVid) { if (noVid) { const position = "top: 18px; right: 60px; z-index: 999; position: absolute;"; - const mainStyle = "font-size: xx-large; padding: 10px; transition: opacity 1s"; + const mainStyle = "font-size: xx-large; padding: 10px; transition: opacity 1s; pointer-events: none;"; $(".center-content.ytmusic-nav-bar").insertAdjacentHTML("beforeend", ``) } else { const position = `top: 10px; left: 10px; z-index: 999; position: absolute;`; - const mainStyle = "font-size: xxx-large; padding: 10px; transition: opacity 0.6s; webkit-text-stroke: 1px black; font-weight: 600;"; + const mainStyle = "font-size: xxx-large; padding: 10px; transition: opacity 0.6s; webkit-text-stroke: 1px black; font-weight: 600; pointer-events: none;"; $("#song-video").insertAdjacentHTML('afterend', ``) diff --git a/plugins/video-toggle/front.js b/plugins/video-toggle/front.js index 1c3911e3..76ec8f5d 100644 --- a/plugins/video-toggle/front.js +++ b/plugins/video-toggle/front.js @@ -21,7 +21,7 @@ function setup(e) { api = e.detail; player = $('ytmusic-player'); video = $('video'); - + $('ytmusic-player-page').prepend(switchButtonDiv); $('#song-image.ytmusic-player').style.display = "block"; @@ -48,7 +48,10 @@ function changeDisplay(showVideo) { player.style.margin = showVideo ? '' : 'auto 0px'; player.setAttribute('playback-mode', showVideo ? 'OMV_PREFERRED' : 'ATV_PREFERRED'); $('#song-video.ytmusic-player').style.display = showVideo ? 'unset' : 'none'; - if(showVideo && !video.style.top) video.style.top = `${(player.clientHeight - video.clientHeight) / 2}px`; + if (showVideo && !video.style.top) { + video.style.top = `${(player.clientHeight - video.clientHeight) / 2}px`; + } + moveVolumeHud(showVideo); } function videoStarted() { @@ -63,6 +66,8 @@ function videoStarted() { // change display to video mode if video exist & video is hidden & option.hideVideo = false if (!options.hideVideo && $('#song-video.ytmusic-player').style.display === "none") { changeDisplay(true); + } else { + moveVolumeHud(!options.hideVideo); } } else { // video doesn't exist -> switch to song mode @@ -85,3 +90,10 @@ function forcePlaybackMode() { }); playbackModeObserver.observe(player, { attributeFilter: ["playback-mode"] }); } + +// if precise volume plugin is enabled, move its hud to be on top of the video +function moveVolumeHud(showVideo) { + const volumeHud = $('#volumeHud'); + if (volumeHud) + volumeHud.style.top = showVideo ? `${(player.clientHeight - video.clientHeight) / 2}px` : 0; +}