feat: migration to TypeScript FINAL

Co-authored-by: Su-Yong <simssy2205@gmail.com>

plugins/quality-changer/front.ts

@@ -0,0 +1,40 @@
+import { ipcRenderer } from 'electron';
+
+import { ElementFromFile, templatePath } from '../utils';
+import { YoutubePlayer } from '../../types/youtube-player';
+
+function $(selector: string): HTMLElement | null {
+  return document.querySelector(selector);
+}
+
+const qualitySettingsButton = ElementFromFile(
+  templatePath(__dirname, 'qualitySettingsTemplate.html'),
+);
+
+function setup(event: CustomEvent<YoutubePlayer>) {
+  const api = event.detail;
+
+  $('.top-row-buttons.ytmusic-player')?.prepend(qualitySettingsButton);
+
+  qualitySettingsButton.addEventListener('click', function chooseQuality() {
+    setTimeout(() => $('#player')?.click());
+
+    const qualityLevels = api.getAvailableQualityLevels();
+
+    const currentIndex = qualityLevels.indexOf(api.getPlaybackQuality());
+
+    ipcRenderer.invoke('qualityChanger', api.getAvailableQualityLabels(), currentIndex).then((promise: { response: number }) => {
+      if (promise.response === -1) {
+        return;
+      }
+
+      const newQuality = qualityLevels[promise.response];
+      api.setPlaybackQualityRange(newQuality);
+      api.setPlaybackQuality(newQuality);
+    });
+  });
+}
+
+export default () => {
+  document.addEventListener('apiLoaded', setup, { once: true, passive: true });
+};