restructure files onto electron-vite boilerplate

src/preload/browser.ts

@@ -0,0 +1,41 @@
+import { ipcRenderer } from 'electron';
+
+const exit = () => {
+    ipcRenderer.send('window-close');
+};
+
+const maximize = () => {
+    ipcRenderer.send('window-maximize');
+};
+
+const minimize = () => {
+    ipcRenderer.send('window-minimize');
+};
+
+const unmaximize = () => {
+    ipcRenderer.send('window-unmaximize');
+};
+
+const quit = () => {
+    ipcRenderer.send('window-quit');
+};
+
+const devtools = () => {
+    ipcRenderer.send('window-dev-tools');
+};
+
+const clearCache = (): Promise<void> => {
+    return ipcRenderer.invoke('window-clear-cache');
+};
+
+export const browser = {
+    clearCache,
+    devtools,
+    exit,
+    maximize,
+    minimize,
+    quit,
+    unmaximize,
+};
+
+export type Browser = typeof browser;

src/preload/discord-rpc.ts

@@ -0,0 +1,28 @@
+import { SetActivity } from '@xhayper/discord-rpc';
+import { ipcRenderer } from 'electron';
+
+const initialize = (clientId: string) => {
+    const client = ipcRenderer.invoke('discord-rpc-initialize', clientId);
+    return client;
+};
+
+const clearActivity = () => {
+    ipcRenderer.invoke('discord-rpc-clear-activity');
+};
+
+const setActivity = (activity: SetActivity) => {
+    ipcRenderer.invoke('discord-rpc-set-activity', activity);
+};
+
+const quit = () => {
+    ipcRenderer.invoke('discord-rpc-quit');
+};
+
+export const discordRpc = {
+    clearActivity,
+    initialize,
+    quit,
+    setActivity,
+};
+
+export type DiscordRpc = typeof discordRpc;

src/preload/index.d.ts

@@ -0,0 +1,10 @@
+import { ElectronAPI } from '@electron-toolkit/preload';
+
+import { PreloadApi } from './index';
+
+declare global {
+    interface Window {
+        api: PreloadApi;
+        electron: ElectronAPI;
+    }
+}

src/preload/index.ts

@@ -0,0 +1,45 @@
+import { electronAPI } from '@electron-toolkit/preload';
+import { contextBridge } from 'electron';
+
+import { browser } from './browser';
+import { discordRpc } from './discord-rpc';
+import { ipc } from './ipc';
+import { localSettings } from './local-settings';
+import { lyrics } from './lyrics';
+import { mpris } from './mpris';
+import { mpvPlayer, mpvPlayerListener } from './mpv-player';
+import { remote } from './remote';
+import { utils } from './utils';
+
+// Custom APIs for renderer
+const api = {
+    browser,
+    discordRpc,
+    ipc,
+    localSettings,
+    lyrics,
+    mpris,
+    mpvPlayer,
+    mpvPlayerListener,
+    remote,
+    utils,
+};
+
+export type PreloadApi = typeof api;
+
+// Use `contextBridge` APIs to expose Electron APIs to
+// renderer only if context isolation is enabled, otherwise
+// just add to the DOM global.
+if (process.contextIsolated) {
+    try {
+        contextBridge.exposeInMainWorld('electron', electronAPI);
+        contextBridge.exposeInMainWorld('api', api);
+    } catch (error) {
+        console.error(error);
+    }
+} else {
+    // @ts-ignore (define in dts)
+    window.electron = electronAPI;
+    // @ts-ignore (define in dts)
+    window.api = api;
+}

src/preload/ipc.ts

@@ -0,0 +1,16 @@
+import { ipcRenderer } from 'electron';
+
+const removeAllListeners = (channel: string) => {
+    ipcRenderer.removeAllListeners(channel);
+};
+
+const send = (channel: string, ...args: any[]) => {
+    ipcRenderer.send(channel, ...args);
+};
+
+export const ipc = {
+    removeAllListeners,
+    send,
+};
+
+export type Ipc = typeof ipc;

src/preload/local-settings.ts

@@ -0,0 +1,97 @@
+import { ipcRenderer, IpcRendererEvent, webFrame } from 'electron';
+import Store from 'electron-store';
+
+const store = new Store();
+
+const set = (
+    property: string,
+    value: boolean | Record<string, unknown> | string | string[] | undefined,
+) => {
+    if (value === undefined) {
+        store.delete(property);
+        return;
+    }
+
+    store.set(`${property}`, value);
+};
+
+const get = (property: string) => {
+    return store.get(`${property}`);
+};
+
+const restart = () => {
+    ipcRenderer.send('app-restart');
+};
+
+const enableMediaKeys = () => {
+    ipcRenderer.send('global-media-keys-enable');
+};
+
+const disableMediaKeys = () => {
+    ipcRenderer.send('global-media-keys-disable');
+};
+
+const passwordGet = async (server: string): Promise<null | string> => {
+    return ipcRenderer.invoke('password-get', server);
+};
+
+const passwordRemove = (server: string) => {
+    ipcRenderer.send('password-remove', server);
+};
+
+const passwordSet = async (password: string, server: string): Promise<boolean> => {
+    return ipcRenderer.invoke('password-set', password, server);
+};
+
+const setZoomFactor = (zoomFactor: number) => {
+    webFrame.setZoomFactor(zoomFactor / 100);
+};
+
+const fontError = (cb: (event: IpcRendererEvent, file: string) => void) => {
+    ipcRenderer.on('custom-font-error', cb);
+};
+
+const themeSet = (theme: TitleTheme): void => {
+    ipcRenderer.send('theme-set', theme);
+};
+
+export const toServerType = (value?: string): null | string => {
+    switch (value?.toLowerCase()) {
+        case 'jellyfin':
+            return 'jellyfin';
+        case 'navidrome':
+            return 'navidrome';
+        case 'subsonic':
+            return 'subsonic';
+        default:
+            return null;
+    }
+};
+
+const SERVER_TYPE = toServerType(process.env.SERVER_TYPE);
+
+const env = {
+    SERVER_LOCK:
+        SERVER_TYPE !== null ? process.env.SERVER_LOCK?.toLocaleLowerCase() === 'true' : false,
+    SERVER_NAME: process.env.SERVER_NAME ?? '',
+    SERVER_TYPE,
+    SERVER_URL: process.env.SERVER_URL ?? 'http://',
+    START_MAXIMIZED: store.get('maximized'),
+};
+
+export const localSettings = {
+    disableMediaKeys,
+    enableMediaKeys,
+    env,
+    fontError,
+    get,
+    passwordGet,
+    passwordRemove,
+    passwordSet,
+    restart,
+    set,
+    setZoomFactor,
+    themeSet,
+};
+
+export type LocalSettings = typeof localSettings;

src/preload/lyrics.ts

@@ -0,0 +1,33 @@
+import { ipcRenderer } from 'electron';
+
+import {
+    InternetProviderLyricSearchResponse,
+    LyricGetQuery,
+    LyricSearchQuery,
+    LyricSource,
+} from '../main/features/core/lyrics';
+
+const getRemoteLyricsBySong = (song: QueueSong) => {
+    const result = ipcRenderer.invoke('lyric-by-song', song);
+    return result;
+};
+
+const searchRemoteLyrics = (
+    params: LyricSearchQuery,
+): Promise<Record<LyricSource, InternetProviderLyricSearchResponse[]>> => {
+    const result = ipcRenderer.invoke('lyric-search', params);
+    return result;
+};
+
+const getRemoteLyricsByRemoteId = (id: LyricGetQuery) => {
+    const result = ipcRenderer.invoke('lyric-by-remote-id', id);
+    return result;
+};
+
+export const lyrics = {
+    getRemoteLyricsByRemoteId,
+    getRemoteLyricsBySong,
+    searchRemoteLyrics,
+};
+
+export type Lyrics = typeof lyrics;

src/preload/mpris.ts

@@ -0,0 +1,40 @@
+import { ipcRenderer, IpcRendererEvent } from 'electron';
+
+const updatePosition = (timeSec: number) => {
+    ipcRenderer.send('mpris-update-position', timeSec);
+};
+
+const updateSeek = (timeSec: number) => {
+    ipcRenderer.send('mpris-update-seek', timeSec);
+};
+
+const toggleRepeat = () => {
+    ipcRenderer.send('mpris-toggle-repeat');
+};
+
+const toggleShuffle = () => {
+    ipcRenderer.send('mpris-toggle-shuffle');
+};
+
+const requestToggleRepeat = (
+    cb: (event: IpcRendererEvent, data: { repeat: PlayerRepeat }) => void,
+) => {
+    ipcRenderer.on('mpris-request-toggle-repeat', cb);
+};
+
+const requestToggleShuffle = (
+    cb: (event: IpcRendererEvent, data: { shuffle: boolean }) => void,
+) => {
+    ipcRenderer.on('mpris-request-toggle-shuffle', cb);
+};
+
+export const mpris = {
+    requestToggleRepeat,
+    requestToggleShuffle,
+    toggleRepeat,
+    toggleShuffle,
+    updatePosition,
+    updateSeek,
+};
+
+export type Mpris = typeof mpris;

src/preload/mpv-player.ts

@@ -0,0 +1,204 @@
+import { ipcRenderer, IpcRendererEvent } from 'electron';
+
+const initialize = (data: { extraParameters?: string[]; properties?: Record<string, any> }) => {
+    return ipcRenderer.invoke('player-initialize', data);
+};
+
+const restart = (data: {
+    binaryPath?: string;
+    extraParameters?: string[];
+    properties?: Record<string, any>;
+}) => {
+    return ipcRenderer.invoke('player-restart', data);
+};
+
+const isRunning = () => {
+    return ipcRenderer.invoke('player-is-running');
+};
+
+const cleanup = () => {
+    return ipcRenderer.invoke('player-clean-up');
+};
+
+const setProperties = (data: Record<string, any>) => {
+    ipcRenderer.send('player-set-properties', data);
+};
+
+const autoNext = (url?: string) => {
+    ipcRenderer.send('player-auto-next', url);
+};
+
+const currentTime = () => {
+    ipcRenderer.send('player-current-time');
+};
+
+const mute = (mute: boolean) => {
+    ipcRenderer.send('player-mute', mute);
+};
+
+const next = () => {
+    ipcRenderer.send('player-next');
+};
+
+const pause = () => {
+    ipcRenderer.send('player-pause');
+};
+
+const play = () => {
+    ipcRenderer.send('player-play');
+};
+
+const previous = () => {
+    ipcRenderer.send('player-previous');
+};
+
+const seek = (seconds: number) => {
+    ipcRenderer.send('player-seek', seconds);
+};
+
+const seekTo = (seconds: number) => {
+    ipcRenderer.send('player-seek-to', seconds);
+};
+
+const setQueue = (current?: string, next?: string, pause?: boolean) => {
+    ipcRenderer.send('player-set-queue', current, next, pause);
+};
+
+const setQueueNext = (url?: string) => {
+    ipcRenderer.send('player-set-queue-next', url);
+};
+
+const stop = () => {
+    ipcRenderer.send('player-stop');
+};
+
+const volume = (value: number) => {
+    ipcRenderer.send('player-volume', value);
+};
+
+const quit = () => {
+    ipcRenderer.send('player-quit');
+};
+
+const getCurrentTime = async () => {
+    return ipcRenderer.invoke('player-get-time');
+};
+
+const rendererAutoNext = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-auto-next', cb);
+};
+
+const rendererCurrentTime = (cb: (event: IpcRendererEvent, data: number) => void) => {
+    ipcRenderer.on('renderer-player-current-time', cb);
+};
+
+const rendererNext = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-next', cb);
+};
+
+const rendererPause = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-pause', cb);
+};
+
+const rendererPlay = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-play', cb);
+};
+
+const rendererPlayPause = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-play-pause', cb);
+};
+
+const rendererPrevious = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-previous', cb);
+};
+
+const rendererStop = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-stop', cb);
+};
+
+const rendererSkipForward = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-skip-forward', cb);
+};
+
+const rendererSkipBackward = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-skip-backward', cb);
+};
+
+const rendererVolumeUp = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-volume-up', cb);
+};
+
+const rendererVolumeDown = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-volume-down', cb);
+};
+
+const rendererVolumeMute = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-volume-mute', cb);
+};
+
+const rendererToggleRepeat = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-toggle-repeat', cb);
+};
+
+const rendererToggleShuffle = (cb: (event: IpcRendererEvent, data: PlayerData) => void) => {
+    ipcRenderer.on('renderer-player-toggle-shuffle', cb);
+};
+
+const rendererQuit = (cb: (event: IpcRendererEvent) => void) => {
+    ipcRenderer.on('renderer-player-quit', cb);
+};
+
+const rendererError = (cb: (event: IpcRendererEvent, data: string) => void) => {
+    ipcRenderer.on('renderer-player-error', cb);
+};
+
+const rendererPlayerFallback = (cb: (event: IpcRendererEvent, data: boolean) => void) => {
+    ipcRenderer.on('renderer-player-fallback', cb);
+};
+
+export const mpvPlayer = {
+    autoNext,
+    cleanup,
+    currentTime,
+    getCurrentTime,
+    initialize,
+    isRunning,
+    mute,
+    next,
+    pause,
+    play,
+    previous,
+    quit,
+    restart,
+    seek,
+    seekTo,
+    setProperties,
+    setQueue,
+    setQueueNext,
+    stop,
+    volume,
+};
+
+export const mpvPlayerListener = {
+    rendererAutoNext,
+    rendererCurrentTime,
+    rendererError,
+    rendererNext,
+    rendererPause,
+    rendererPlay,
+    rendererPlayerFallback,
+    rendererPlayPause,
+    rendererPrevious,
+    rendererQuit,
+    rendererSkipBackward,
+    rendererSkipForward,
+    rendererStop,
+    rendererToggleRepeat,
+    rendererToggleShuffle,
+    rendererVolumeDown,
+    rendererVolumeMute,
+    rendererVolumeUp,
+};
+
+export type MpvPLayer = typeof mpvPlayer;
+export type MpvPlayerListener = typeof mpvPlayerListener;

src/preload/remote.ts

@@ -0,0 +1,110 @@
+import { ipcRenderer, IpcRendererEvent } from 'electron';
+
+const requestFavorite = (
+    cb: (
+        event: IpcRendererEvent,
+        data: { favorite: boolean; id: string; serverId: string },
+    ) => void,
+) => {
+    ipcRenderer.on('request-favorite', cb);
+};
+
+const requestPosition = (cb: (event: IpcRendererEvent, data: { position: number }) => void) => {
+    ipcRenderer.on('request-position', cb);
+};
+
+const requestRating = (
+    cb: (event: IpcRendererEvent, data: { id: string; rating: number; serverId: string }) => void,
+) => {
+    ipcRenderer.on('request-rating', cb);
+};
+
+const requestSeek = (cb: (event: IpcRendererEvent, data: { offset: number }) => void) => {
+    ipcRenderer.on('request-seek', cb);
+};
+
+const requestVolume = (cb: (event: IpcRendererEvent, data: { volume: number }) => void) => {
+    ipcRenderer.on('request-volume', cb);
+};
+
+const setRemoteEnabled = (enabled: boolean): Promise<null | string> => {
+    const result = ipcRenderer.invoke('remote-enable', enabled);
+    return result;
+};
+
+const setRemotePort = (port: number): Promise<null | string> => {
+    const result = ipcRenderer.invoke('remote-port', port);
+    return result;
+};
+
+const updateFavorite = (favorite: boolean, serverId: string, ids: string[]) => {
+    ipcRenderer.send('update-favorite', favorite, serverId, ids);
+};
+
+const updatePassword = (password: string) => {
+    ipcRenderer.send('remote-password', password);
+};
+
+const updatePlayback = (playback: PlayerStatus) => {
+    ipcRenderer.send('update-playback', playback);
+};
+
+const updateSetting = (
+    enabled: boolean,
+    port: number,
+    username: string,
+    password: string,
+): Promise<null | string> => {
+    return ipcRenderer.invoke('remote-settings', enabled, port, username, password);
+};
+
+const updateRating = (rating: number, serverId: string, ids: string[]) => {
+    ipcRenderer.send('update-rating', rating, serverId, ids);
+};
+
+const updateRepeat = (repeat: string) => {
+    ipcRenderer.send('update-repeat', repeat);
+};
+
+const updateShuffle = (shuffle: boolean) => {
+    ipcRenderer.send('update-shuffle', shuffle);
+};
+
+const updateSong = (args: QueueSong | undefined) => {
+    ipcRenderer.send('update-song', args);
+};
+
+const updateUsername = (username: string) => {
+    ipcRenderer.send('remote-username', username);
+};
+
+const updateVolume = (volume: number) => {
+    ipcRenderer.send('update-volume', volume);
+};
+
+const updatePosition = (timeSec: number) => {
+    ipcRenderer.send('update-position', timeSec);
+};
+
+export const remote = {
+    requestFavorite,
+    requestPosition,
+    requestRating,
+    requestSeek,
+    requestVolume,
+    setRemoteEnabled,
+    setRemotePort,
+    updateFavorite,
+    updatePassword,
+    updatePlayback,
+    updatePosition,
+    updateRating,
+    updateRepeat,
+    updateSetting,
+    updateShuffle,
+    updateSong,
+    updateUsername,
+    updateVolume,
+};
+
+export type Remote = typeof remote;

src/preload/utils.ts

@@ -0,0 +1,69 @@
+import { ipcRenderer, IpcRendererEvent } from 'electron';
+
+import { isLinux, isMacOS, isWindows } from '../main/utils';
+
+const saveQueue = (data: Record<string, any>) => {
+    ipcRenderer.send('player-save-queue', data);
+};
+
+const restoreQueue = () => {
+    ipcRenderer.send('player-restore-queue');
+};
+
+const openItem = async (path: string) => {
+    return ipcRenderer.invoke('open-item', path);
+};
+
+const onSaveQueue = (cb: (event: IpcRendererEvent) => void) => {
+    ipcRenderer.on('renderer-save-queue', cb);
+};
+
+const onRestoreQueue = (cb: (event: IpcRendererEvent, data: Partial<any>) => void) => {
+    ipcRenderer.on('renderer-restore-queue', cb);
+};
+
+const playerErrorListener = (cb: (event: IpcRendererEvent, data: { code: number }) => void) => {
+    ipcRenderer.on('player-error-listener', cb);
+};
+
+const mainMessageListener = (
+    cb: (
+        event: IpcRendererEvent,
+        data: { message: string; type: 'error' | 'info' | 'success' | 'warning' },
+    ) => void,
+) => {
+    ipcRenderer.on('toast-from-main', cb);
+};
+
+const logger = (
+    cb: (
+        event: IpcRendererEvent,
+        data: {
+            message: string;
+            type: 'debug' | 'error' | 'info' | 'verbose' | 'warning';
+        },
+    ) => void,
+) => {
+    ipcRenderer.send('logger', cb);
+};
+
+const download = (url: string) => {
+    ipcRenderer.send('download-url', url);
+};
+
+export const utils = {
+    download,
+    isLinux,
+    isMacOS,
+    isWindows,
+    logger,
+    mainMessageListener,
+    onRestoreQueue,
+    onSaveQueue,
+    openItem,
+    playerErrorListener,
+    restoreQueue,
+    saveQueue,
+};
+
+export type Utils = typeof utils;