diff --git a/gui/examples/config.json b/gui/examples/config.json
index e088b494..0f1b17a8 100644
--- a/gui/examples/config.json
+++ b/gui/examples/config.json
@@ -1,5 +1,11 @@
{
"api": {
"root": "http://127.0.0.1:5000"
+ },
+ "default": {
+ "model": "stable-diffusion-onnx-v1-5",
+ "platform": "amd",
+ "scheduler": "euler-a",
+ "prompt": "an astronaut eating a hamburger"
}
}
\ No newline at end of file
diff --git a/gui/src/components/OnnxWeb.tsx b/gui/src/components/OnnxWeb.tsx
index c197b1e8..e947df0e 100644
--- a/gui/src/components/OnnxWeb.tsx
+++ b/gui/src/components/OnnxWeb.tsx
@@ -4,6 +4,7 @@ import * as React from 'react';
import { useQuery } from 'react-query';
import { ApiClient } from '../api/client.js';
+import { Config } from '../config.js';
import { QueryList } from './QueryList.js';
import { STALE_TIME, Txt2Img } from './Txt2Img.js';
@@ -11,6 +12,7 @@ const { useState } = React;
export interface OnnxWebProps {
client: ApiClient;
+ config: Config;
}
const MODEL_LABELS = {
@@ -18,8 +20,10 @@ const MODEL_LABELS = {
};
export function OnnxWeb(props: OnnxWebProps) {
+ const { client, config } = props;
+
const [tab, setTab] = useState('1');
- const [model, setModel] = useState('stable-diffusion-onnx-v1-5');
+ const [model, setModel] = useState(config.default.model);
const models = useQuery('models', async () => props.client.models(), {
staleTime: STALE_TIME,
@@ -49,7 +53,7 @@ export function OnnxWeb(props: OnnxWebProps) {
-
+
diff --git a/gui/src/components/Txt2Img.tsx b/gui/src/components/Txt2Img.tsx
index e68503b4..7a778bcd 100644
--- a/gui/src/components/Txt2Img.tsx
+++ b/gui/src/components/Txt2Img.tsx
@@ -3,6 +3,7 @@ import * as React from 'react';
import { useMutation, useQuery } from 'react-query';
import { ApiClient } from '../api/client.js';
+import { Config } from '../config.js';
import { ImageCard } from './ImageCard.js';
import { ImageControl, ImageParams } from './ImageControl.js';
import { MutationHistory } from './MutationHistory.js';
@@ -30,6 +31,7 @@ const SCHEDULER_LABELS: Record = {
export interface Txt2ImgProps {
client: ApiClient;
+ config: Config;
model: string;
}
@@ -53,15 +55,15 @@ export function Txt2Img(props: Txt2ImgProps) {
staleTime: STALE_TIME,
});
- const [prompt, setPrompt] = useState('an astronaut eating a hamburger');
const [params, setParams] = useState({
cfg: 6,
steps: 25,
width: 512,
height: 512,
});
- const [scheduler, setScheduler] = useState('euler-a');
- const [platform, setPlatform] = useState('amd');
+ const [prompt, setPrompt] = useState(props.config.default.prompt);
+ const [platform, setPlatform] = useState(props.config.default.platform);
+ const [scheduler, setScheduler] = useState(props.config.default.scheduler);
return
diff --git a/gui/src/config.ts b/gui/src/config.ts
new file mode 100644
index 00000000..9017563d
--- /dev/null
+++ b/gui/src/config.ts
@@ -0,0 +1,23 @@
+import { STATUS_SUCCESS } from './api/client.js';
+
+export interface Config {
+ api: {
+ root: string;
+ };
+ default: {
+ model: string;
+ platform: string;
+ scheduler: string;
+ prompt: string;
+ };
+}
+
+export async function loadConfig(): Promise {
+ const configPath = new URL('./config.json', window.origin);
+ const configReq = await fetch(configPath);
+ if (configReq.status === STATUS_SUCCESS) {
+ return configReq.json();
+ } else {
+ throw new Error('could not load config');
+ }
+}
diff --git a/gui/src/main.tsx b/gui/src/main.tsx
index 6ea715f0..32c0a63a 100644
--- a/gui/src/main.tsx
+++ b/gui/src/main.tsx
@@ -4,24 +4,9 @@ import * as React from 'react';
import ReactDOM from 'react-dom/client';
import { QueryClient, QueryClientProvider } from 'react-query';
-import { makeClient, STATUS_SUCCESS } from './api/client.js';
+import { makeClient } from './api/client.js';
import { OnnxWeb } from './components/OnnxWeb.js';
-
-export interface Config {
- api: {
- root: string;
- };
-}
-
-export async function loadConfig(): Promise {
- const configPath = new URL('./config.json', window.origin);
- const configReq = await fetch(configPath);
- if (configReq.status === STATUS_SUCCESS) {
- return configReq.json();
- } else {
- throw new Error('could not load config');
- }
-}
+import { loadConfig } from './config.js';
export async function main() {
const config = await loadConfig();
@@ -31,7 +16,7 @@ export async function main() {
const appElement = mustExist(document.getElementById('app'));
const app = ReactDOM.createRoot(appElement);
app.render(
-
+
);
}
diff --git a/gui/src/types.ts b/gui/src/types.ts
new file mode 100644
index 00000000..e69de29b