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

feat: migration to TypeScript FINAL

Browse Source 
Co-authored-by: Su-Yong <simssy2205@gmail.com>
This commit is contained in:
JellyBrick
2023-09-04 02:27:53 +09:00
parent c0d7972da3
commit 53f5bda382
72 changed files with 1290 additions and 693 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
plugins/playback-speed/front.js → plugins/playback-speed/front.ts
View File

@ -1,14 +1,15 @@
const { getSongMenu } = require('../../providers/dom-elements');
const { ElementFromFile, templatePath } = require('../utils');
const { singleton } = require('../../providers/decorators');
import { getSongMenu } from '../../providers/dom-elements';
import { ElementFromFile, templatePath } from '../utils';
import { singleton } from '../../providers/decorators';
function $(selector) {
function $(selector: string) {
return document.querySelector(selector);
}
const slider = ElementFromFile(templatePath(__dirname, 'slider.html'));
const roundToTwo = (n) => Math.round(n * 1e2) / 1e2;
const roundToTwo = (n: number) => Math.round(n * 1e2) / 1e2;
const MIN_PLAYBACK_SPEED = 0.07;
const MAX_PLAYBACK_SPEED = 16;
@ -16,19 +17,19 @@ const MAX_PLAYBACK_SPEED = 16;
let playbackSpeed = 1;
const updatePlayBackSpeed = () => {
$('video').playbackRate = playbackSpeed;
($('video') as HTMLVideoElement).playbackRate = playbackSpeed;
const playbackSpeedElement = $('#playback-speed-value');
if (playbackSpeedElement) {
playbackSpeedElement.innerHTML = playbackSpeed;
playbackSpeedElement.innerHTML = String(playbackSpeed);
}
};
let menu;
let menu: Element | null = null;
const setupSliderListener = singleton(() => {
$('#playback-speed-slider').addEventListener('immediate-value-changed', (e) => {
playbackSpeed = e.detail.value || MIN_PLAYBACK_SPEED;
$('#playback-speed-slider')?.addEventListener('immediate-value-changed', (e) => {
playbackSpeed = (e as CustomEvent<{ value: number; }>).detail.value || MIN_PLAYBACK_SPEED;
if (isNaN(playbackSpeed)) {
playbackSpeed = 1;
}
@ -43,20 +44,28 @@ const observePopupContainer = () => {
menu = getSongMenu();
}
if (menu && menu.parentElement.eventSink_?.matches('ytmusic-menu-renderer.ytmusic-player-bar') && !menu.contains(slider)) {
if (
menu &&
(menu.parentElement as HTMLElement & { eventSink_: Element | null })
?.eventSink_
?.matches('ytmusic-menu-renderer.ytmusic-player-bar')&& !menu.contains(slider)
) {
menu.prepend(slider);
setupSliderListener();
}
});
observer.observe($('ytmusic-popup-container'), {
childList: true,
subtree: true,
});
const popupContainer = $('ytmusic-popup-container');
if (popupContainer) {
observer.observe(popupContainer, {
childList: true,
subtree: true,
});
}
};
const observeVideo = () => {
const video = $('video');+
const video = $('video') as HTMLVideoElement;
video.addEventListener('ratechange', forcePlaybackRate);
video.addEventListener('srcChanged', forcePlaybackRate);
};
@ -76,17 +85,18 @@ const setupWheelListener = () => {
updatePlayBackSpeed();
// Update slider position
$('#playback-speed-slider').value = playbackSpeed;
($('#playback-speed-slider') as HTMLElement & { value: number }).value = playbackSpeed;
});
};
function forcePlaybackRate(e) {
if (e.target.playbackRate !== playbackSpeed) {
e.target.playbackRate = playbackSpeed;
function forcePlaybackRate(e: Event) {
const videoElement = (e.target as HTMLVideoElement);
if (videoElement.playbackRate !== playbackSpeed) {
videoElement.playbackRate = playbackSpeed;
}
}
module.exports = () => {
export default () => {
document.addEventListener('apiLoaded', () => {
observePopupContainer();
observeVideo();