feat(view): View, Game Overlay 기능 개선

common/constants.ts

@@ -66,6 +66,7 @@ export const DEFAULT_CONFIG = {
     {
       enabled: true,
       theme: 'Default Theme',
+      name: 'Default View',
       position: {
         anchor: 'bottom-right' as const,
         display: null as number | null,

common/intl/translations/de.json

@@ -48,6 +48,7 @@
   "setting.game.unregister-game": "Spiel entfernen",
   "setting.game.show-all-programs-running-in-the-background": "alle im Hintergrund laufende Spiele anzeigen",
   "setting.game.show-only-programs-running-in-the-foreground": "alle im Vordergrund laufende Spiele anzeigen",
+  "setting.game.select-view-to-show-game-overlay": "Select view to show game overlay",
 
   "setting.game.registered-game-list.description": "Register",
   "setting.game.registered-game-list.adding-manually": "Spiel manuell hinzufügen",
@@ -128,6 +129,12 @@
   "setting.view.applied-theme": "Applied theme",
   "setting.view.edit-view": "Edit view",
   "setting.view.add-view": "Add view",
+  "setting.view.new-view": "New View",
+  "setting.view.rename-view": "Rename view",
+  "setting.view.rename-alert-title": "Rename view",
+  "setting.view.rename-alert": "Please write a name that change \"{{name}}\" view.",
+  "setting.view.rename-conflict-title": "Cannot rename view",
+  "setting.view.rename-conflict": "\"{{name}}\" is already exist.",
 
   "setting.theme.animation": "Übergangsanimation für Lyrics",
   "setting.theme.animation.none": "keine",

common/intl/translations/en.json

@@ -48,6 +48,7 @@
   "setting.game.unregister-game": "Remove registered game",
   "setting.game.show-all-programs-running-in-the-background": "Show all background programs",
   "setting.game.show-only-programs-running-in-the-foreground": "Show all foreground programs only",
+  "setting.game.select-view-to-show-game-overlay": "Select view to show game overlay",
 
   "setting.game.registered-game-list.description": "List",
   "setting.game.registered-game-list.adding-manually": "Add Game Manually",
@@ -129,6 +130,12 @@
   "setting.view.applied-theme": "Applied theme",
   "setting.view.edit-view": "Edit view",
   "setting.view.add-view": "Add view",
+  "setting.view.new-view": "New View",
+  "setting.view.rename-view": "Rename view",
+  "setting.view.rename-alert-title": "Rename view",
+  "setting.view.rename-alert": "Please write a name that change \"{{name}}\" view.",
+  "setting.view.rename-conflict-title": "Cannot rename view",
+  "setting.view.rename-conflict": "\"{{name}}\" is already exist.",
 
   "setting.theme.animation": "Change lyrics animation",
   "setting.theme.animation.none": "None",

common/intl/translations/ja.json

@@ -48,6 +48,7 @@
   "setting.game.unregister-game": "登録取消",
   "setting.game.show-all-programs-running-in-the-background": "バックグラウンドで実行されているすべてのプログラムを表示する",
   "setting.game.show-only-programs-running-in-the-foreground": "フォアグラウンドで実行されているすべてのプログラムを表示する",
+  "setting.game.select-view-to-show-game-overlay": "Select view to show game overlay",
 
   "setting.game.registered-game-list.description": "一覧",
   "setting.game.registered-game-list.adding-manually": "手動追加",
@@ -128,6 +129,12 @@
   "setting.view.applied-theme": "Applied theme",
   "setting.view.edit-view": "Edit view",
   "setting.view.add-view": "Add view",
+  "setting.view.new-view": "New View",
+  "setting.view.rename-view": "Rename view",
+  "setting.view.rename-alert-title": "Rename view",
+  "setting.view.rename-alert": "Please write a name that change \"{{name}}\" view.",
+  "setting.view.rename-conflict-title": "Cannot rename view",
+  "setting.view.rename-conflict": "\"{{name}}\" is already exist.",
 
   "setting.theme.animation": "歌詞切り替えアニメーション",
   "setting.theme.animation.none": "なし",

common/intl/translations/ko.json

@@ -31,7 +31,7 @@
   "lyrics.delay": "지연 시간",
 
   "setting.title.position": "위치",
-  "setting.title.view": "표시",
+  "setting.title.view": "창",
   "setting.title.theme": "테마",
   "setting.title.general": "일반",
   "setting.title.plugin": "플러그인",
@@ -48,6 +48,7 @@
   "setting.game.unregister-game": "등록 해제",
   "setting.game.show-all-programs-running-in-the-background": "백그라운드에서 실행 중인 모든 프로그램 표시",
   "setting.game.show-only-programs-running-in-the-foreground": "포그라운드에서 실행 중인 프로그램만 표시",
+  "setting.game.select-view-to-show-game-overlay": "게임 오버레이로 설정할 창 선택",
 
   "setting.game.registered-game-list.description": "목록",
   "setting.game.registered-game-list.adding-manually": "게임 수동 추가",
@@ -129,6 +130,12 @@
   "setting.view.applied-theme": "적용된 테마",
   "setting.view.edit-view": "창 수정",
   "setting.view.add-view": "창 추가",
+  "setting.view.new-view": "새 창",
+  "setting.view.rename-view": "창 이름 변경",
+  "setting.view.rename-alert-title": "창 이름 수정",
+  "setting.view.rename-alert": "\"{{name}}\" 창을 어떤 이름으로 바꿀것인지 입력해주세요.",
+  "setting.view.rename-conflict-title": "이름을 변경할 수 없습니다",
+  "setting.view.rename-conflict": "\"{{name}}\"는 이미 존재하는 이름입니다.",
 
   "setting.theme.animation": "가사 전환 애니메이션",
   "setting.theme.animation.none": "없음",

common/schema/config.ts

@@ -75,6 +75,7 @@ export const ConfigSchema = z.object({
   views: z.object({
     enabled: z.boolean().catch(DEFAULT_CONFIG.views[0].enabled),
     theme: z.string().catch(DEFAULT_CONFIG.views[0].theme),
+    name: z.string().catch(DEFAULT_CONFIG.views[0].name),
     position: z.object({
       anchor: AnchorSchema.catch(DEFAULT_CONFIG.views[0].position.anchor),
       display: z.number().nullable().catch(DEFAULT_CONFIG.views[0].position.display),
@@ -129,7 +130,10 @@ export const LyricMapperSchema = z.record(z.object({
 }).optional());
 
 export const ThemeListSchema = z.record(StyleConfigSchema.optional());
-export const GameListSchema = z.record(z.string().optional());
+export const GameListSchema = z.record(z.object({
+  name: z.string(),
+  path: z.string(),
+}).array());
 
 export type StyleConfig = z.infer<typeof StyleConfigSchema>;
 export type Config = z.infer<typeof ConfigSchema>;

common/schema/legacy/before-0.20.0.ts

@@ -66,4 +66,6 @@ export type LEGACY_Config0_20_0 = {
   streamingMode: boolean;
   hardwareAcceleration: boolean;
   provider: 'alsong';
-};
+};
+
+export type LEGACY_GameList0_20_0 = Record<string, string | undefined>;

index.ts

@@ -15,6 +15,7 @@ const application = new Application(overlayManager);
 
   application.initPluginLoader();
 
+  application.initOverlay();
   application.initAutoUpdater();
   application.initTray();
   application.initServer();

renderer/components/Modal.tsx

@@ -55,22 +55,24 @@ const Modal = (props: ModalProps) => {
               <div class={'text-black dark:text-white px-6 py-5 fluent-scrollbar'}>
                 {props.children}
               </div>
-              <div class={'flex justify-end items-center gap-2 bg-stone-200 dark:bg-stone-800 px-6 py-5'}>
-                <For each={local.buttons ?? []}>
-                  {(button) => (
-                    <button
-                      class={
-                        button.type === 'positive' ? 'btn-primary' :
-                        button.type === 'negative' ? 'btn-error' :
-                        'btn-text'
-                      }
-                      onClick={button.onClick}
-                    >
-                      {button.name}
-                    </button>
-                  )}
-                </For>
-              </div>
+              <Show when={local.buttons}>
+                <div class={'flex justify-end items-center gap-2 bg-stone-200 dark:bg-stone-800 px-6 py-5'}>
+                  <For each={local.buttons ?? []}>
+                    {(button) => (
+                      <button
+                        class={
+                          button.type === 'positive' ? 'btn-primary' :
+                          button.type === 'negative' ? 'btn-error' :
+                          'btn-text'
+                        }
+                        onClick={button.onClick}
+                      >
+                        {button.name}
+                      </button>
+                    )}
+                  </For>
+                </div>
+              </Show>
             </div>
           </div>
         </Show>

renderer/hooks/useCurrent.ts

@@ -16,6 +16,8 @@ const useCurrent = () => {
   const theme = () => themeList()[themeName()];
 
   onMount(() => {
+    window.setIndex = (index: number) => setIndex(index);
+
     const interval = setInterval(() => {
       if (typeof window.index === 'number') {
         setIndex(window.index);
@@ -36,5 +38,6 @@ export default useCurrent;
 declare global {
   interface Window {
     index?: number;
+    setIndex?: (index: number) => void;
   }
 }

renderer/hooks/usePlayingGame.ts

@@ -4,9 +4,9 @@ const usePlayingGame = () => {
   const [gameList, setGameList] = createSignal<number[]>([]);
 
   (async () => {
-    const result = await window.ipcRenderer.invoke('get-registered-process-list') as number[];
+    const result = await window.ipcRenderer.invoke('get-registered-process-list');
 
-    setGameList(result || []);
+    setGameList(result.map((it) => it.pid) || []);
   })();
 
   window.ipcRenderer.on('registered-process-list', (_, data: number[]) => {

renderer/main/App.tsx

@@ -97,7 +97,7 @@ const App = () => {
   const proximityHandles = useProximityStyle();
 
   return (
-    <Show when={view()?.enabled}>
+    <Show when={window.enabled || view()?.enabled}>
       <PlayingInfoProvider>
         <AnchoredView
           class={userCSSSelectors.wrapper}
@@ -116,3 +116,9 @@ const App = () => {
 };
 
 export default App;
+
+declare global {
+  interface Window {
+    enabled?: boolean;
+  }
+}