feat: updzate GUI with cache options

jersou · Oct 7, 2024 · 40750bc · 40750bc
1 parent 041d209
commit 40750bc
Show file tree

Hide file tree

Showing 8 changed files with 104 additions and 68 deletions.
diff --git a/common-types.ts b/common-types.ts
@@ -0,0 +1,57 @@
+// shared types with the GUI
+
+export const OPEN_AI_VOICES = [
+  "alloy",
+  "echo",
+  "fable",
+  "onyx",
+  "nova",
+  "shimmer",
+] as const;
+export const OPEN_AI_MODELS = ["tts-1", "tts-1-hd"] as const;
+
+export type CliOptions = {
+  storyPath: string;
+  lang: string;
+  rssSplitLength: number;
+  rssSplitSeasons?: boolean;
+  rssMinDuration: number;
+  rssUseImageAsThumbnail?: boolean;
+  rssUseSubtitleAsTitle?: boolean;
+  skipImageItemGen?: boolean;
+  thumbnailFromFirstItem: boolean;
+  useThumbnailAsRootImage?: boolean;
+  imageItemGenFont: string;
+  skipAudioItemGen?: boolean;
+  skipAudioConvert?: boolean;
+  skipImageConvert?: boolean;
+  skipExtractImageFromMp3?: boolean;
+  skipZipGeneration?: boolean;
+  skipNotRss?: boolean;
+  autoNextStoryTransition?: boolean;
+  selectNextStoryAtEnd?: boolean;
+  addDelay?: boolean;
+  nightMode?: boolean;
+  seekStory?: string;
+  skipWsl?: boolean;
+  skipRssImageDl?: boolean;
+  outputFolder?: string;
+  useOpenAiTts?: boolean;
+  openAiApiKey?: string;
+  openAiModel?: typeof OPEN_AI_MODELS[number];
+  openAiVoice?: typeof OPEN_AI_VOICES[number];
+  useCoquiTts?: boolean;
+  coquiTtsModel?: string;
+  coquiTtsLanguageIdx?: string;
+  coquiTtsSpeakerIdx?: string;
+  extract?: boolean;
+  server?: boolean;
+  port?: number;
+  configFile?: string;
+  isCompiled?: boolean;
+  gui?: boolean;
+  skipWriteTtsCache?: boolean;
+  skipReadTtsCache?: boolean;
+  ttsCachePath?: string;
+  customScript?: string;
+};
diff --git a/deno.json b/deno.json
@@ -11,7 +11,8 @@
     "pre-commit": "deno task fmt --check && deno task lint && deno task test && deno task check",
     "start": "deno run -A --unstable studio_pack_generator.ts",
     "test": "deno test -A --ignore=gui/assets_bundle.json,gui/frontend,tmp,dist,.cov_profile,vendor",
-    "test-watch": "deno test -A --watch --unstable --ignore=gui/assets_bundle.json,gui/frontend,tmp,dist,.cov_profile,vendor"
+    "test-watch": "deno test -A --watch --unstable --ignore=gui/assets_bundle.json,gui/frontend,tmp,dist,.cov_profile,vendor",
+    "update-frontend-assets": "cd gui/frontend && npm run build && ../gui.ts updateAssets"
   },
   "imports": {
     "@david/dax": "jsr:@david/dax@^0.42.0",

diff --git a/gui/assets_bundle.json b/gui/assets_bundle.json
diff --git a/gui/frontend/src/app.tsx b/gui/frontend/src/app.tsx
@@ -18,7 +18,7 @@ import { OpenFolder } from "./openFolder.tsx";
 import { StageNode } from "./stageNode.tsx";
 import { Pack } from "../../../serialize/serialize-types";
 import { enqueueSnackbar } from "notistack";
-import type { ModOptions } from "../../../types.ts";
+import type { CliOptions } from "../../../common-types.ts";
 import { Loader } from "./loader.tsx";
 import DriveFolderUploadIcon from "@mui/icons-material/DriveFolderUpload";
 import RestartAltIcon from "@mui/icons-material/RestartAlt";
@@ -125,7 +125,7 @@ export function App() {
       audio: null,
     },
   });
-  const [opt, setOpt] = useState<Partial<ModOptions>>({});
+  const [opt, setOpt] = useState<Partial<CliOptions>>({});
   const [inProgress, setInProgress] = useState(false);
   const [updatePackInProgress, setUpdatePackInProgress] = useState(false);
 

diff --git a/gui/frontend/src/config.tsx b/gui/frontend/src/config.tsx
@@ -16,7 +16,7 @@ import {
 } from "@mui/material";
 import SettingsIcon from "@mui/icons-material/Settings";
 import ArrowDownwardIcon from "@mui/icons-material/ArrowDropDown";
-import type { ModOptions } from "../../../types.ts";
+import type { CliOptions } from "../../../common-types.ts";
 
 import Radio from "@mui/material/Radio";
 import RadioGroup from "@mui/material/RadioGroup";
@@ -26,8 +26,8 @@ export function Config({
   opt,
   setOpt,
 }: {
-  opt: Partial<ModOptions>;
-  setOpt: (o: Partial<ModOptions>) => unknown;
+  opt: Partial<CliOptions>;
+  setOpt: (o: Partial<CliOptions>) => unknown;
 }) {
   const update = useCallback(
     (type: string) => (event: ChangeEvent<HTMLInputElement>) =>
@@ -172,6 +172,24 @@ export function Config({
             }
             label="Disable WSL usage"
           />
+          <FormControlLabel
+            control={
+              <Checkbox
+                checked={!!opt.skipReadTtsCache}
+                onChange={update("skipReadTtsCache")}
+              />
+            }
+            label="Disable the TTS cache usage"
+          />
+          <FormControlLabel
+            control={
+              <Checkbox
+                checked={!!opt.skipWriteTtsCache}
+                onChange={update("skipWriteTtsCache")}
+              />
+            }
+            label="Disable the TTS cache write"
+          />
           <FormControlLabel
             control={
               <Checkbox
@@ -223,6 +241,12 @@ export function Config({
             onChange={update("outputFolder")}
             label="Zip output folder"
           ></TextField>
+          <TextField
+            variant="standard"
+            value={opt.ttsCachePath || ""}
+            onChange={update("ttsCachePath")}
+            label="Path to the TTS cache"
+          ></TextField>
 
           <FormControl style={{ gridColumn: "1 / 3" }}>
             <FormLabel id="tts-label">

diff --git a/gui/frontend/src/stageNode.tsx b/gui/frontend/src/stageNode.tsx
@@ -1,6 +1,11 @@
 import InventoryIcon from "@mui/icons-material/Inventory";
 import { OpenFolder } from "./openFolder.tsx";
-import { Menu, StoryItem, Entrypoint, ZipMenu } from "../../../serialize/serialize-types";
+import {
+  Menu,
+  StoryItem,
+  Entrypoint,
+  ZipMenu,
+} from "../../../serialize/serialize-types";
 import { Line } from "./line.tsx";
 import { clearPath } from "./utils.tsx";
 import { BASE } from "./app.tsx";

diff --git a/types.ts b/types.ts
@@ -1,62 +1,11 @@
 import type { RssItem } from "./generate/rss_parser.ts";
-
-export const OPEN_AI_VOICES = [
-  "alloy",
-  "echo",
-  "fable",
-  "onyx",
-  "nova",
-  "shimmer",
-] as const;
-export const OPEN_AI_MODELS = ["tts-1", "tts-1-hd"] as const;
+import type { CliOptions } from "./common-types.ts";
 
 export interface CustomModule {
   fetchRssItemImage?: (item: RssItem, opt: ModOptions) => Promise<string>;
 }
-export type ModOptions = {
-  storyPath: string;
-  lang: string;
-  rssSplitLength: number;
-  rssSplitSeasons?: boolean;
-  rssMinDuration: number;
-  rssUseImageAsThumbnail?: boolean;
-  rssUseSubtitleAsTitle?: boolean;
-  skipImageItemGen?: boolean;
-  thumbnailFromFirstItem: boolean;
-  useThumbnailAsRootImage?: boolean;
-  imageItemGenFont: string;
-  skipAudioItemGen?: boolean;
-  skipAudioConvert?: boolean;
-  skipImageConvert?: boolean;
-  skipExtractImageFromMp3?: boolean;
-  skipZipGeneration?: boolean;
-  skipNotRss?: boolean;
-  autoNextStoryTransition?: boolean;
-  selectNextStoryAtEnd?: boolean;
-  addDelay?: boolean;
-  nightMode?: boolean;
-  seekStory?: string;
-  skipWsl?: boolean;
-  skipRssImageDl?: boolean;
-  outputFolder?: string;
-  useOpenAiTts?: boolean;
-  openAiApiKey?: string;
-  openAiModel?: typeof OPEN_AI_MODELS[number];
-  openAiVoice?: typeof OPEN_AI_VOICES[number];
-  useCoquiTts?: boolean;
-  coquiTtsModel?: string;
-  coquiTtsLanguageIdx?: string;
-  coquiTtsSpeakerIdx?: string;
-  extract?: boolean;
-  server?: boolean;
-  port?: number;
-  configFile?: string;
-  isCompiled?: boolean;
-  gui?: boolean;
-  skipWriteTtsCache?: boolean;
-  skipReadTtsCache?: boolean;
-  ttsCachePath?: string;
-  customScript?: string;
+
+export type ModOptions = CliOptions & {
   customModule?: CustomModule;
   i18n?: Record<string, string>;
 };
diff --git a/utils/parse_args.ts b/utils/parse_args.ts
@@ -5,8 +5,8 @@ import { generatePack } from "../gen_pack.ts";
 import { PackExtractor } from "../extract_pack.ts";
 import { openGui } from "../gui/gui.ts";
 import type { ModOptions } from "../types.ts";
-import { OPEN_AI_MODELS, OPEN_AI_VOICES } from "../types.ts";
 import { getDefaultTtsPath } from "../generate/tts_cache.ts";
+import { OPEN_AI_MODELS, OPEN_AI_VOICES } from "../common-types.ts";
 
 export async function parseArgs(args: string[]) {
   // @ts-ignore yargs