forked from lavender/watch-party
44 lines
1.8 KiB
JavaScript
44 lines
1.8 KiB
JavaScript
|
export const toggleOptionPane = (event, element) => {
|
||
|
|
event.preventDefault();
|
||
|
|
// show options
|
||
|
|
if (
|
||
|
|
!document.querySelector("#options").style.display ||
|
||
|
|
document.querySelector("#options").style.display === "none"
|
||
|
|
) {
|
||
|
|
// using this to do any potential init logic for the fields too
|
||
|
|
loadPlayerControlsShown(document.querySelector("#playerControlsShown"))
|
||
|
|
loadPlingVolume(document.querySelector("#plingVolume"))
|
||
|
|
|
||
|
|
element.innerText = "❌";
|
||
|
|
document.querySelector("#options").style.display = "block";
|
||
|
|
return (document.querySelector("#viewing").style.display = "none");
|
||
|
|
}
|
||
|
|
// hide options
|
||
|
|
element.innerText = "⚙️";
|
||
|
|
document.querySelector("#options").style.display = "none";
|
||
|
|
document.querySelector("#viewing").style.display = "block";
|
||
|
|
};
|
||
|
|
|
||
|
|
const getPlayerControlsShown = () => localStorage.getItem("watch-party-default-allow-controls") || false
|
||
|
|
// delete from storage on false to prevent weird js boolean parsing (Boolean('false') === True)
|
||
|
|
const setPlayerControlShown = (boolean) => !boolean
|
||
|
|
? localStorage.removeItem("watch-party-default-allow-controls")
|
||
|
|
: localStorage.setItem("watch-party-default-allow-controls", boolean)
|
||
|
|
export const togglePlayerControlsShown = (element) => {
|
||
|
|
const isShown = element.checked
|
||
|
|
setPlayerControlShown(!isShown)
|
||
|
|
}
|
||
|
|
const loadPlayerControlsShown = (element) => {
|
||
|
|
const isShown = getPlayerControlsShown()
|
||
|
|
element.checked = !isShown
|
||
|
|
}
|
||
|
|
|
||
|
|
const getPlingVolume = () => localStorage.getItem("watch-party-pling-volume") || 100
|
||
|
|
const setPlingVolume = (value) => localStorage.setItem("watch-party-pling-volume", value)
|
||
|
|
export const handlePlingVolume = (element) => {
|
||
|
|
setPlingVolume(element.value)
|
||
|
|
}
|
||
|
|
const loadPlingVolume = (element) => {
|
||
|
|
element.value = getPlingVolume()
|
||
|
|
}
|