smueller/youtube-music
1
0
Fork 0
mirror of https://github.com/th-ch/youtube-music.git synced 2026-01-11 10:31:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: Ambient Mode intialization improvement (#1857)

Browse Source
This commit is contained in:
FrostyBiscuit
2024-03-17 03:52:46 +01:00
committed by GitHub
parent 70ed6f8e6c
commit 9b2c1a320b
2 changed files with 9 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/plugins/ambient-mode/index.ts
View File

@ -179,19 +179,14 @@ export default createPlugin({
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.type === 'attributes') {
if (mutation.type === 'attributes' || mutation.type === 'childList') {
applyImageAttribute();
}
});
});
const resizeObserver = new ResizeObserver(() => {
applyImageAttribute();
});
applyImageAttribute();
observer.observe(songImage, { attributes: true });
resizeObserver.observe(songImage);
window.addEventListener('resize', applyImageAttribute);
observer.observe(songImage, { attributes: true, subtree: true });
/* injecting */
songImage.prepend(blurImage);
@ -199,7 +194,6 @@ export default createPlugin({
/* cleanup */
return () => {
observer.disconnect();
resizeObserver.disconnect();
window.removeEventListener('resize', applyImageAttribute);
if (blurImage.isConnected) blurImage.remove();
@ -284,14 +278,11 @@ export default createPlugin({
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.type === 'attributes') {
if (mutation.type === 'attributes' || mutation.type === 'childList') {
applyVideoAttributes();
}
});
});
const resizeObserver = new ResizeObserver(() => {
applyVideoAttributes();
});
/* hooking */
let canvasInterval: NodeJS.Timeout | null = null;
@ -300,9 +291,7 @@ export default createPlugin({
Math.max(1, Math.ceil(1000 / this.buffer)),
);
applyVideoAttributes();
observer.observe(songVideo, { attributes: true });
resizeObserver.observe(songVideo);
window.addEventListener('resize', applyVideoAttributes);
observer.observe(songVideo, { attributes: true, subtree: true });
const onPause = () => {
if (canvasInterval) clearInterval(canvasInterval);
@ -329,8 +318,6 @@ export default createPlugin({
songVideo.removeEventListener('play', onPlay);
observer.disconnect();
resizeObserver.disconnect();
window.removeEventListener('resize', applyVideoAttributes);
if (blurCanvas.isConnected) blurCanvas.remove();
};
@ -354,7 +341,7 @@ export default createPlugin({
const observer = new MutationObserver((mutationsList) => {
for (const mutation of mutationsList) {
if (mutation.type === 'attributes') {
if (mutation.type === 'attributes' || mutation.type === 'childList') {
const isPageOpen =
ytmusicAppLayout?.hasAttribute('player-page-open');
if (isPageOpen) {
@ -369,7 +356,7 @@ export default createPlugin({
});
if (playerPage) {
observer.observe(playerPage, { attributes: true });
observer.observe(playerPage, { attributes: true, subtree: true });
}
},
onConfigChange(newConfig) {

5
src/plugins/ambient-mode/style.css
View File

@ -25,11 +25,12 @@
height: 100%;
}
#song-video .html5-video-container > video {
top: 0 !important;
#song-video .html5-video-container {
height: 100%;
}
#player:not([video-mode]):not(.video-mode) {
width: 100%;
margin: 0 auto !important;
overflow: visible;
}