fix(Turntable): correctly control the rotation of the turntable, for spicetify v2.4.0

This commit is contained in:
Grason Chan 2021-07-04 22:45:09 +08:00
parent 8deecbb492
commit 6f4184b160

View File

@ -1,52 +1,72 @@
window.addEventListener("load", rotateTurntable = () => { window.addEventListener("load", rotateTurntable = () => {
if (!Spicetify.Player.origin || !document.querySelector("#fad-art-image")) { const fadBtn = document.querySelector(".main-topBar-button[title='Full App Display']");
if (!Spicetify.Player.origin || !fadBtn) {
setTimeout(rotateTurntable, 250); setTimeout(rotateTurntable, 250);
return; return;
} }
const fullAppDisplay = document.querySelector("#full-app-display");
let playState; let playState;
function handleRotate(fromEvent) { function handleRotate(fromEvent) {
const fadArt = document.querySelector("#fad-art-image"); const fadArt = document.querySelector("#fad-art-image");
if (!fromEvent && Spicetify.Player.isPlaying() || fromEvent && !playState) { if (!fromEvent && Spicetify.Player.isPlaying() || fromEvent && !playState) {
fadArt.style.animationPlayState = "running"; fadArt && (fadArt.style.animationPlayState = "running");
return playState = true; return playState = true;
} else { } else {
fadArt.style.animationPlayState = "paused"; fadArt && (fadArt.style.animationPlayState = "paused");
return playState = false; return playState = false;
} }
} }
function handleFadControl(event) {
event.stopPropagation();
}
function handleFadDblclick() { function handleFadDblclick() {
const fadControlsBtns = document.querySelectorAll("#fad-controls button"); const fadControlsBtns = document.querySelectorAll("#fad-controls button");
for (const fadControl of fadControlsBtns) { for (const fadControl of fadControlsBtns) {
fadControl.addEventListener("dblclick", event => event.stopPropagation()); fadControl.addEventListener("dblclick", handleFadControl);
} }
} }
function handleConfigSwitch() {
const genericModal = document.querySelector("generic-modal");
handleInitalStatus(genericModal);
}
function handleInitalStatus(genericModal) { function handleInitalStatus(genericModal) {
if (genericModal) { genericModal.remove();
genericModal.remove();
}
handleRotate(); handleRotate();
handleFadDblclick(); handleFadDblclick();
} }
handleInitalStatus(); function handleContextMenu() {
Spicetify.Player.addEventListener("onplaypause", () => handleRotate(true));
fullAppDisplay.addEventListener("contextmenu", () => {
const genericModal = document.querySelector("generic-modal");
const configSwitchBtns = document.querySelectorAll("#popup-config-container button.switch"); const configSwitchBtns = document.querySelectorAll("#popup-config-container button.switch");
for (const configSwitch of configSwitchBtns) { for (const configSwitch of configSwitchBtns) {
configSwitch.addEventListener("click", () => handleInitalStatus(genericModal)); configSwitch.addEventListener("click", handleConfigSwitch);
} }
}
handleRotate();
Spicetify.Player.addEventListener("onplaypause", () => handleRotate(true));
fadBtn.addEventListener("click", () => {
const fullAppDisplay = document.querySelector("#full-app-display");
const fadArt = document.querySelector("#fad-art-image");
playState
? fadArt.style.animationPlayState = "running"
: fadArt.style.animationPlayState = "paused";
handleFadDblclick();
fullAppDisplay.addEventListener("contextmenu", handleContextMenu);
}); });
}); });