apextoaster
/
onnx-web
1
0
Fork 0
Code Actions

fix(gui): remove paragraph wrapping image details

This commit is contained in:
Sean Sube 2023-01-06 08:40:48 -06:00
parent b5d67b4886
commit 0376499cc7
3 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
README.md
View File

@ -121,6 +121,7 @@ Install the following packages for AI:
> pip install numpy>=1.20,<1.24 # version is important, 1.24 removed the deprecated np.float symbol > pip install numpy>=1.20,<1.24 # version is important, 1.24 removed the deprecated np.float symbol
> pip install accelerate diffusers transformers ftfy spacy scipy > pip install accelerate diffusers transformers ftfy spacy scipy
> pip install onnx onnxruntime torch > pip install onnx onnxruntime torch
# TODO: is pytorch needed?
``` ```
If you are running on Windows, install the DirectML ONNX runtime as well: If you are running on Windows, install the DirectML ONNX runtime as well:

14
gui/src/api/client.ts
View File

@ -29,10 +29,14 @@ export interface ApiClient {
export const STATUS_SUCCESS = 200; export const STATUS_SUCCESS = 200;
export function joinPath(...parts: Array<string>): string {
return parts.join('/');
}
export async function imageFromResponse(root: string, res: Response): Promise<ApiResponse> { export async function imageFromResponse(root: string, res: Response): Promise<ApiResponse> {
if (res.status === STATUS_SUCCESS) { if (res.status === STATUS_SUCCESS) {
const data = await res.json() as ApiResponse; const data = await res.json() as ApiResponse;
const output = new URL(['output', data.output].join('/'), root).toString(); const output = new URL(joinPath('output', data.output), root).toString();
return { return {
output, output,
params: data.params, params: data.params,
@ -47,17 +51,17 @@ export function makeClient(root: string, f = fetch): ApiClient {
return { return {
async models(): Promise<Array<string>> { async models(): Promise<Array<string>> {
const path = new URL('/settings/models', root); const path = new URL(joinPath('settings', 'models'), root);
const res = await f(path); const res = await f(path);
return await res.json() as Array<string>; return await res.json() as Array<string>;
}, },
async schedulers(): Promise<Array<string>> { async schedulers(): Promise<Array<string>> {
const path = new URL('/settings/schedulers', root); const path = new URL(joinPath('settings', 'schedulers'), root);
const res = await f(path); const res = await f(path);
return await res.json() as Array<string>; return await res.json() as Array<string>;
}, },
async platforms(): Promise<Array<string>> { async platforms(): Promise<Array<string>> {
const path = new URL('/settings/platforms', root); const path = new URL(joinPath('settings', 'platforms'), root);
const res = await f(path); const res = await f(path);
return await res.json() as Array<string>; return await res.json() as Array<string>;
}, },
@ -66,7 +70,7 @@ export function makeClient(root: string, f = fetch): ApiClient {
return pending; return pending;
} }
const url = new URL('/txt2img', root); const url = new URL('txt2img', root);
url.searchParams.append('cfg', params.cfg.toFixed(0)); url.searchParams.append('cfg', params.cfg.toFixed(0));
url.searchParams.append('steps', params.steps.toFixed(0)); url.searchParams.append('steps', params.steps.toFixed(0));

6
gui/src/components/ImageCard.tsx
View File

@ -1,4 +1,4 @@
import { Card, CardContent, CardMedia, List, Paper, Stack, Typography } from '@mui/material'; import { Card, CardContent, CardMedia, Paper, Stack } from '@mui/material';
import * as React from 'react'; import * as React from 'react';
import { UseMutationResult } from 'react-query'; import { UseMutationResult } from 'react-query';
@ -34,13 +34,11 @@ export function ImageCard(props: ImageCardProps) {
title={params.prompt} title={params.prompt}
/> />
<CardContent> <CardContent>
<Typography variant='body2'> <Stack spacing={2}>
<Stack spacing={1}>
<Paper>CFG: {params.cfg}</Paper> <Paper>CFG: {params.cfg}</Paper>
<Paper>Steps: {params.steps}</Paper> <Paper>Steps: {params.steps}</Paper>
<Paper>Seed: {params.seed}</Paper> <Paper>Seed: {params.seed}</Paper>
</Stack> </Stack>
</Typography>
</CardContent> </CardContent>
</Card>; </Card>;
} }