smueller/youtube-music
1
0
Fork 0
mirror of https://github.com/th-ch/youtube-music.git synced 2026-01-17 21:22:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor

Browse Source
This commit is contained in:
Araxeus
2021-04-16 23:30:43 +03:00
parent 02896cac03
commit 06958c424c
1 changed files with 31 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
plugins/precise-volume/front.js
View File

@ -7,19 +7,19 @@ module.exports = () => {
function setFirstTooltip() { function setFirstTooltip() {
const videoStream = document.querySelector(".video-stream"); const videoStream = document.querySelector(".video-stream");
if (videoStream?.volume) { if (videoStream?.volume) {
setTooltip(Math.round(parseFloat(videoStream.volume) * 100)); setTooltip(toPercent(videoStream.volume));
} else { } else {
setTimeout(setFirstTooltip, 500); // Try again in 500 milliseconds setTimeout(setFirstTooltip, 500); // Try again in 500 milliseconds
} }
} }
function setPlaybarOnwheel() { function setPlaybarOnwheel() {
// Add onwheel event to play bar // Add onwheel event to play bar
document.querySelector("ytmusic-player-bar").onwheel = event => { document.querySelector("ytmusic-player-bar").onwheel = event => {
event.preventDefault(); event.preventDefault();
// Event.deltaY < 0 => wheel up // Event.deltaY < 0 => wheel up
changeVolume(event.deltaY < 0); changeVolume(event.deltaY < 0);
}; };
} }
// The last volume set by changeVolume() is stored here // The last volume set by changeVolume() is stored here
@ -29,13 +29,14 @@ function changeVolume(increase) {
// Need to change both the slider and the actual volume // Need to change both the slider and the actual volume
const videoStream = document.querySelector(".video-stream"); const videoStream = document.querySelector(".video-stream");
const slider = document.querySelector("#volume-slider"); const slider = document.querySelector("#volume-slider");
// Get the volume diff to apply
const diff = increase ? // Apply volume change if valid
(videoStream.volume < 1 ? 0.01 : 0) : videoStream.volume = increase ?
(videoStream.volume > 0 ? -0.01 : 0); Math.min(videoStream.volume + 0.01, 1) :
// Apply on both elements and save the new volume Math.max(videoStream.volume - 0.01, 0);
videoStream.volume += diff;
newVolume = Math.round(Number.parseFloat(videoStream.volume) * 100); // Save the new volume
newVolume = toPercent(videoStream.volume);
// Slider value automatically rounds to multiples of 5 // Slider value automatically rounds to multiples of 5
slider.value = newVolume; slider.value = newVolume;
// Finally change tooltip to new value // Finally change tooltip to new value
@ -62,14 +63,22 @@ function setObserver() {
}); });
} }
// Set new volume as tooltip for volume slider and icon + expanding slider (appears when window size is small)
const tooltipTargets = [
"#volume-slider",
"tp-yt-paper-icon-button.volume.style-scope.ytmusic-player-bar",
"#expand-volume-slider",
"#expand-volume"
];
function setTooltip(newValue) { function setTooltip(newValue) {
newValue += "%"; newValue += "%";
// Set new volume as tooltip for volume slider and icon for (target of tooltipTargets) {
document.querySelector("#volume-slider").title = newValue; document.querySelector(target).title = newValue;
document.querySelector("tp-yt-paper-icon-button.volume.style-scope.ytmusic-player-bar").title = newValue; }
// Also for expanding slider (appears when window size is small)
const expandingSlider = document.querySelector("#expanding-menu");
expandingSlider.querySelector("#expand-volume-slider").title = newValue;
expandingSlider.querySelector("#expand-volume").title = newValue;
} }
function toPercent(volume) {
return Math.round(Number.parseFloat(volume) * 100);
}