mirror of
https://github.com/th-ch/youtube-music.git
synced 2026-01-12 11:01:45 +00:00
fix(synced-lyrics): fix type error
This commit is contained in:
@ -1,21 +1,28 @@
|
||||
/* eslint-disable prefer-const, @typescript-eslint/no-unused-vars */
|
||||
|
||||
import { createRenderer } from '@/utils';
|
||||
import { SongInfo } from '@/providers/song-info';
|
||||
import { YoutubePlayer } from '@/types/youtube-player';
|
||||
|
||||
import { makeLyricsRequest } from './lyrics';
|
||||
import { selectors, tabStates } from './utils';
|
||||
import { setConfig } from './renderer';
|
||||
import { setCurrentTime } from './components/LyricsContainer';
|
||||
|
||||
import type { RendererContext } from '@/types/contexts';
|
||||
import type { YoutubePlayer } from '@/types/youtube-player';
|
||||
import type { SongInfo } from '@/providers/song-info';
|
||||
|
||||
import type { SyncedLyricsPluginConfig } from '../types';
|
||||
|
||||
export let _ytAPI: YoutubePlayer | null = null;
|
||||
|
||||
export const renderer = createRenderer({
|
||||
export const renderer = createRenderer<{
|
||||
observerCallback: MutationCallback;
|
||||
onPlayerApiReady: (api: YoutubePlayer) => void;
|
||||
hasAddedEvents: boolean;
|
||||
observer?: MutationObserver;
|
||||
videoDataChange: () => void;
|
||||
progressCallback: (evt: Event) => void;
|
||||
}, SyncedLyricsPluginConfig>({
|
||||
onConfigChange(newConfig) {
|
||||
setConfig(newConfig as SyncedLyricsPluginConfig);
|
||||
setConfig(newConfig);
|
||||
},
|
||||
|
||||
observerCallback(mutations: MutationRecord[]) {
|
||||
@ -35,23 +42,20 @@ export const renderer = createRenderer({
|
||||
}
|
||||
},
|
||||
|
||||
onPlayerApiReady(api) {
|
||||
onPlayerApiReady(api: YoutubePlayer) {
|
||||
_ytAPI = api;
|
||||
|
||||
// @ts-expect-error type is 'unknown', so TS complains
|
||||
api.addEventListener('videodatachange', this.videoDataChange);
|
||||
|
||||
// @ts-expect-error type is 'unknown', so TS complains
|
||||
this.videoDataChange();
|
||||
},
|
||||
|
||||
hasAddedEvents: false,
|
||||
observer: null as MutationObserver | null,
|
||||
|
||||
videoDataChange() {
|
||||
if (!this.hasAddedEvents) {
|
||||
const video = document.querySelector('video');
|
||||
|
||||
// @ts-expect-error type is 'unknown', so TS complains
|
||||
video?.addEventListener('timeupdate', this.progressCallback);
|
||||
|
||||
if (video) this.hasAddedEvents = true;
|
||||
@ -61,7 +65,7 @@ export const renderer = createRenderer({
|
||||
if (!header) return;
|
||||
|
||||
this.observer ??= new MutationObserver(
|
||||
this.observerCallback as MutationCallback,
|
||||
this.observerCallback,
|
||||
);
|
||||
|
||||
// Force the lyrics tab to be enabled at all times.
|
||||
@ -80,10 +84,10 @@ export const renderer = createRenderer({
|
||||
}
|
||||
},
|
||||
|
||||
async start({ getConfig, ipc: { on } }) {
|
||||
setConfig((await getConfig()) as SyncedLyricsPluginConfig);
|
||||
async start(ctx: RendererContext<SyncedLyricsPluginConfig>) {
|
||||
setConfig(await ctx.getConfig());
|
||||
|
||||
on('ytmd:update-song-info', async (info: SongInfo) => {
|
||||
ctx.ipc.on('ytmd:update-song-info', async (info: SongInfo) => {
|
||||
await makeLyricsRequest(info);
|
||||
});
|
||||
},
|
||||
|
||||
@ -1,6 +1,5 @@
|
||||
/* eslint-disable import/order */
|
||||
|
||||
import { createEffect } from 'solid-js';
|
||||
|
||||
import { config } from '../renderer';
|
||||
|
||||
export { makeLyricsRequest } from './fetch';
|
||||
|
||||
@ -1,15 +1,14 @@
|
||||
/* eslint-disable import/order */
|
||||
|
||||
import { createSignal, Show } from 'solid-js';
|
||||
|
||||
import { VideoDetails } from '@/types/video-details';
|
||||
import { SyncedLyricsPluginConfig } from '../types';
|
||||
|
||||
import { LyricsContainer } from './components/LyricsContainer';
|
||||
|
||||
import { SyncedLyricsPluginConfig } from '../types';
|
||||
|
||||
export const [isVisible, setIsVisible] = createSignal<boolean>(false);
|
||||
|
||||
// prettier-ignore
|
||||
export const [config, setConfig] = createSignal<SyncedLyricsPluginConfig | null>(null);
|
||||
// prettier-ignore
|
||||
export const [playerState, setPlayerState] = createSignal<VideoDetails | null>(null);
|
||||
|
||||
export const LyricsRenderer = () => {
|
||||
|
||||
Reference in New Issue
Block a user