Spaces:
Sleeping
Sleeping
File size: 2,822 Bytes
3936a00 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Text-to-Image Gradio Template</title>
<script src="https://cdn.jsdelivr.net/npm/@gradio/[email protected]/dist/gradio.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@gradio/[email protected]/dist/gradio.min.css">
<style>
#col-container {
margin: 0 auto;
max-width: 520px;
}
</style>
</head>
<body>
<div id="gradio-app"></div>
<script>
const { gr, gradio } = window;
const MAX_SEED = 2147483647; // Max seed for np.int32
const MAX_IMAGE_SIZE = 1024;
// Your Python function for inference
const infer = gr.pythonFunction({
functionAddress: 'somewhere',
returnType: 'numpy',
functionArgs: ['prompt', 'negative_prompt', 'seed', 'randomize_seed', 'width', 'height', 'guidance_scale', 'num_inference_steps']
});
const examples = [
"Astronaut in a jungle, cold color palette, muted colors, detailed, 8k",
"An astronaut riding a green horse",
"A delicious ceviche cheesecake slice",
];
const demo = gr.Interface(
infer,
gr.Blocks,
() => ({
elem_id: "col-container",
examples: examples,
inputs: [
gr.Text({label: "Prompt", show_label: false, maxLines: 1, placeholder: "Enter your prompt", container: false}),
gr.Button("Run", {scale: 0})
],
outputs: gr.Image({label: "Result", show_label: false}),
advanced: [
gr.Accordion("Advanced Settings", false, [
gr.Text({label: "Negative prompt", maxLines: 1, placeholder: "Enter a negative prompt", visible: false}),
gr.Slider({label: "Seed", min: 0, max: MAX_SEED, step: 1, value: 0}),
gr.Checkbox("Randomize seed", true),
gr.Row([
gr.Slider({label: "Width", min: 256, max: MAX_IMAGE_SIZE, step: 32, value: 512}),
gr.Slider({label: "Height", min: 256, max: MAX_IMAGE_SIZE, step: 32, value: 512})
]),
gr.Row([
gr.Slider({label: "Guidance scale", min: 0.0, max: 10.0, step: 0.1, value: 0.0}),
gr.Slider({label: "Number of inference steps", min: 1, max: 12, step: 1, value: 2})
])
])
]
})
);
demo.render(document.getElementById("gradio-app"));
</script>
</body>
</html>
|