apextoaster
/
onnx-web
1
0
Fork 0
Code Actions

load config from JSON, expand on setup instructions

This commit is contained in:
Sean Sube 2023-01-05 10:39:46 -06:00
parent ccbce9abe8
commit 6cb04fcbba
9 changed files with 67 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
README.md
View File

@ -120,14 +120,19 @@ Sign up for an account at https://huggingface.co and find the models you want to
- https://huggingface.co/runwayml/stable-diffusion-v1-5 - https://huggingface.co/runwayml/stable-diffusion-v1-5
Download the conversion script from the `huggingface/diffusers` repository: Log into the HuggingFace CLI:
- https://raw.githubusercontent.com/huggingface/diffusers/main/scripts/convert_stable_diffusion_checkpoint_to_onnx.py
```shell ```shell
> wget https://raw.githubusercontent.com/huggingface/diffusers/main/scripts/convert_stable_diffusion_checkpoint_to_onnx.py > huggingface-cli.exe login
``` ```
Issue an API token from https://huggingface.co/settings/tokens, naming it something memorable like `onnx-web`, and then
paste it into the prompt.
Download the conversion script from the `huggingface/diffusers` repository to the root of this project:
- https://raw.githubusercontent.com/huggingface/diffusers/main/scripts/convert_stable_diffusion_checkpoint_to_onnx.py
Run the conversion script with your desired model(s): Run the conversion script with your desired model(s):
```shell ```shell
@ -136,8 +141,8 @@ Run the conversion script with your desired model(s):
This will take a little while to convert each model. Stable diffusion v1.4 is about 6GB, v1.5 is at least 10GB or so. This will take a little while to convert each model. Stable diffusion v1.4 is about 6GB, v1.5 is at least 10GB or so.
You can verify that all of the steps up to this point worked correctly by attempting to run the basic `txt2img` script You can verify that all of the steps up to this point worked correctly by attempting to run the `api/setup-test.py`
provided with `diffusers` and included here as `api/setup-test.py`. script, which is a slight variation on the original txt2img script.
## Usage ## Usage

2
api/serve.py
View File

@ -117,4 +117,4 @@ def txt2img():
res = make_response(send_file(img_io, mimetype='image/png')) res = make_response(send_file(img_io, mimetype='image/png'))
res.headers.add('Access-Control-Allow-Origin', '*') res.headers.add('Access-Control-Allow-Origin', '*')
return res return res

BIN
docs/readme-preview.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 346 KiB

After

Width:  |  Height:  |  Size: 340 KiB

14
gui/Makefile
View File

@ -30,6 +30,7 @@ build-shebang: build
bundle: build bundle: build
node esbuild.js node esbuild.js
cp -v src/index.html out/ cp -v src/index.html out/
cp -v examples/config.json out/
COVER_OPTS := --all \ COVER_OPTS := --all \
--exclude ".eslintrc.js" \ --exclude ".eslintrc.js" \
@ -54,16 +55,3 @@ lint: deps
test: build test: build
MOCHA_FILE=out/test-results.xml yarn c8 $(COVER_OPTS) mocha $(MOCHA_OPTS) "out/**/Test*.js" MOCHA_FILE=out/test-results.xml yarn c8 $(COVER_OPTS) mocha $(MOCHA_OPTS) "out/**/Test*.js"
# image-building targets
image:
podman build -t docker-push.artifacts.apextoaster.com/ssube/conan-discord:main -f Containerfile .
image-local: ci
podman pull docker-push.artifacts.apextoaster.com/ssube/conan-discord:main
$(MAKE) image
podman push docker-push.artifacts.apextoaster.com/ssube/conan-discord:main
# run targets
run: build
node out/src/index.js

5
gui/examples/config.json Normal file
View File

@ -0,0 +1,5 @@
{
"api": {
"root": "http://ssube-desktop.home.holdmyran.ch:5000"
}
}

23
gui/serve.js
View File

@ -11,14 +11,33 @@ const root = process.cwd();
const portNum = parseInt(port, 10); const portNum = parseInt(port, 10);
const contentTypes = [
[/^.*\.html$/, 'text/html'],
[/^.*\.js$/, 'application/javascript'],
[/^.*\.json$/, 'text/json'],
];
function getContentType(path) {
for (const [regex, type] of contentTypes) {
if (regex.test(path)) {
return type;
}
}
return 'unknown';
}
const server = createServer((req, res) => { const server = createServer((req, res) => {
readFile(join(root, 'out', req.url || 'index.html'), function (err, data) { const path = join(root, 'out', req.url || 'index.html');
readFile(path, function (err, data) {
if (err) { if (err) {
res.writeHead(404); res.writeHead(404);
res.end(JSON.stringify(err)); res.end(JSON.stringify(err));
return; return;
} }
res.writeHead(200); res.writeHead(200, {
'Content-Type': getContentType(path),
});
res.end(data); res.end(data);
}); });
}); });

5
gui/src/config.ts
View File

@ -1,5 +0,0 @@
export const CONFIG = {
api: {
root: 'http://ssube-desktop.home.holdmyran.ch:5000',
},
};

3
gui/src/index.html
View File

@ -1,5 +1,4 @@
<html> <html>
<div id="app"></div> <div id="app"></div>
<script src="./bundle/main.js"> <script id="bundle" src="./bundle/main.js" type="module"></script>
</script>
</html> </html>

33
gui/src/main.tsx
View File

@ -1,15 +1,36 @@
import { mustExist } from '@apextoaster/js-utils'; import { mustExist } from '@apextoaster/js-utils';
import * as React from 'react'; import * as React from 'react';
import ReactDOM from 'react-dom/client'; import ReactDOM from 'react-dom/client';
import { makeClient } from './api/client';
import { OnnxWeb } from './components/OnnxWeb';
import { CONFIG } from './config';
export function main() { import { makeClient } from './api/client.js';
import { OnnxWeb } from './components/OnnxWeb.js';
export interface Config {
api: {
root: string;
}
}
export async function loadConfig() {
const configPath = new URL('./config.json', window.origin);
const configReq = await fetch(configPath);
if (configReq.status === 200) {
return configReq.json();
} else {
throw new Error('could not load config');
}
}
export async function main() {
const config = await loadConfig();
const appElement = mustExist(document.getElementById('app')); const appElement = mustExist(document.getElementById('app'));
const app = ReactDOM.createRoot(appElement); const app = ReactDOM.createRoot(appElement);
const client = makeClient(CONFIG.api.root); const client = makeClient(config.api.root);
app.render(<OnnxWeb client={client} />); app.render(<OnnxWeb client={client} />);
} }
main(); window.addEventListener('load', () => {
console.log('launching onnx-web');
main();
}, false);