Files

313 lines
66 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<!-- Generated using the ComfyUI Prompt Combinator nodes (https://github.com/lquesada/ComfyUI-Prompt-Combinator) -->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Image Gallery</title>
<style>
html {
overflow-y: scroll;
}
body {
font-family: Arial, sans-serif;
}
.header {
font-size: 70%;
text-align: right;
}
.buttons {
margin-bottom: 15px;
text-align: center;
}
.button {
display: inline-block;
padding: 10px 20px;
margin: 5px;
border: 1px solid #ccc;
border-radius: 5px;
cursor: pointer;
user-select: none;
}
.button.selected {
background-color: #007bff;
color: white;
}
.button.disabled {
background-color: #e0e0e0;
color: #a0a0a0;
}
.button.selected-disabled {
background-color: #ff6666;
color: white;
}
.image-container {
text-align: center;
margin-top: 20px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.image-container img {
display: block;
}
.prompt {
margin-top: 20px;
}
.filename {
margin-top: 20px;
font-size: 80%;
}
.zoom-controls {
text-align: center;
margin: 20px 0;
}
.zoom-controls input[type=range] {
width: 300px;
}
</style>
</head>
<body>
<div class="header">Generated using the <a href="https://github.com/lquesada/ComfyUI-Prompt-Combinator">ComfyUI Prompt Combinator</a> nodes</div>
<div class="zoom-controls">
Zoom <input type="range" id="zoom-slider" min="10" max="300" value="100">
<button id="reset-zoom">Set to 100%</button>
<button id="auto-zoom-device">Fit device screen</button>
<button id="auto-zoom-window">Fit window</button>
</div>
<div id="button-container"></div>
<div class="image-container" id="image-container">
<img id="selected-image" src="">
<div class="prompt" id="image-prompt"></div>
<div class="filename" id="image-filename-container">(<a id="image-filename" href="" target="_blank"></a>)</div>
</div>
<script>
// Fill these in from the node
const ids1 = ['colorful', 'black and white', 'psychedelic'];
const ids2 = ['picture', 'pencil', 'watercolor', 'cartoon', 'blueprint', '3d render'];
const ids3 = ['dog', 'man', 'monster', 'airplane'];
const ids4 = ['umbrella', 'icecream', 'book', 'flying'];
const ids5 = null;
const ids6 = null;
const ids7 = null;
const ids8 = null;
const fileprefix = "example_files/img-";
const filesuffix = ".webp";
const images = [{ id: "colorful-picture-dog-umbrella----", filename: "example_files/img-colorful-picture-dog-umbrella----.webp", prompt: "colorful picture of a dog holding an umbrella"},{ id: "colorful-picture-dog-icecream----", filename: "example_files/img-colorful-picture-dog-icecream----.webp", prompt: "colorful picture of a dog eating icecream"},{ id: "colorful-picture-dog-book----", filename: "example_files/img-colorful-picture-dog-book----.webp", prompt: "colorful picture of a dog reading a book"},{ id: "colorful-picture-dog-flying----", filename: "example_files/img-colorful-picture-dog-flying----.webp", prompt: "colorful picture of a dog flying through the sky"},{ id: "colorful-picture-man-umbrella----", filename: "example_files/img-colorful-picture-man-umbrella----.webp", prompt: "colorful picture of a man holding an umbrella"},{ id: "colorful-picture-man-icecream----", filename: "example_files/img-colorful-picture-man-icecream----.webp", prompt: "colorful picture of a man eating icecream"},{ id: "colorful-picture-man-book----", filename: "example_files/img-colorful-picture-man-book----.webp", prompt: "colorful picture of a man reading a book"},{ id: "colorful-picture-man-flying----", filename: "example_files/img-colorful-picture-man-flying----.webp", prompt: "colorful picture of a man flying through the sky"},{ id: "colorful-picture-monster-umbrella----", filename: "example_files/img-colorful-picture-monster-umbrella----.webp", prompt: "colorful picture of a monster holding an umbrella"},{ id: "colorful-picture-monster-icecream----", filename: "example_files/img-colorful-picture-monster-icecream----.webp", prompt: "colorful picture of a monster eating icecream"},{ id: "colorful-picture-monster-book----", filename: "example_files/img-colorful-picture-monster-book----.webp", prompt: "colorful picture of a monster reading a book"},{ id: "colorful-picture-monster-flying----", filename: "example_files/img-colorful-picture-monster-flying----.webp", prompt: "colorful picture of a monster flying through the sky"},{ id: "colorful-picture-airplane-umbrella----", filename: "example_files/img-colorful-picture-airplane-umbrella----.webp", prompt: "colorful picture of an airplane holding an umbrella"},{ id: "colorful-picture-airplane-icecream----", filename: "example_files/img-colorful-picture-airplane-icecream----.webp", prompt: "colorful picture of an airplane eating icecream"},{ id: "colorful-picture-airplane-book----", filename: "example_files/img-colorful-picture-airplane-book----.webp", prompt: "colorful picture of an airplane reading a book"},{ id: "colorful-picture-airplane-flying----", filename: "example_files/img-colorful-picture-airplane-flying----.webp", prompt: "colorful picture of an airplane flying through the sky"},{ id: "colorful-pencil-dog-umbrella----", filename: "example_files/img-colorful-pencil-dog-umbrella----.webp", prompt: "colorful simple pencil sketch of a dog holding an umbrella"},{ id: "colorful-pencil-dog-icecream----", filename: "example_files/img-colorful-pencil-dog-icecream----.webp", prompt: "colorful simple pencil sketch of a dog eating icecream"},{ id: "colorful-pencil-dog-book----", filename: "example_files/img-colorful-pencil-dog-book----.webp", prompt: "colorful simple pencil sketch of a dog reading a book"},{ id: "colorful-pencil-dog-flying----", filename: "example_files/img-colorful-pencil-dog-flying----.webp", prompt: "colorful simple pencil sketch of a dog flying through the sky"},{ id: "colorful-pencil-man-umbrella----", filename: "example_files/img-colorful-pencil-man-umbrella----.webp", prompt: "colorful simple pencil sketch of a man holding an umbrella"},{ id: "colorful-pencil-man-icecream----", filename: "example_files/img-colorful-pencil-man-icecream----.webp", prompt: "colorful simple pencil sketch of a man eating icecream"},{ id: "colorful-pencil-man-book----", filename: "example_files/img-colorful-pencil-man-book----.webp", prompt: "colorful simple pencil sketch of a man reading a book"},{ id: "colorful-pencil-man-flying----", filename: "example_files/img-colorful-pencil-man-flying----.webp", prompt: "colorful simple pencil sketch of a man flying through the sky"},{ id: "colorful-pencil-monster-umbrella----", filename: "example_files/img-colorful-pencil-monster-umbrella----.webp", prompt: "colorful simple pencil sketch of a monster holding an umbrella"},{ id: "colorful-pencil-monster-icecream----", filename: "example_files/img-colorful-pencil-monster-icecream----.webp", prompt: "colorful simple pencil sketch of a monster eating icecream"},{ id: "colorful-pencil-monster-book----", filename: "example_files/img-colorful-pencil-monster-book----.webp", prompt: "colorful simple pencil sketch of a monster reading a book"},{ id: "colorful-pencil-monster-flying----", filename: "example_files/img-colorful-pencil-monster-flying----.webp", prompt: "colorful simple pencil sketch of a monster flying through the sky"},{ id: "colorful-pencil-airplane-umbrella----", filename: "example_files/img-colorful-pencil-airplane-umbrella----.webp", prompt: "colorful simple pencil sketch of an airplane holding an umbrella"},{ id: "colorful-pencil-airplane-icecream----", filename: "example_files/img-colorful-pencil-airplane-icecream----.webp", prompt: "colorful simple pencil sketch of an airplane eating icecream"},{ id: "colorful-pencil-airplane-book----", filename: "example_files/img-colorful-pencil-airplane-book----.webp", prompt: "colorful simple pencil sketch of an airplane reading a book"},{ id: "colorful-pencil-airplane-flying----", filename: "example_files/img-colorful-pencil-airplane-flying----.webp", prompt: "colorful simple pencil sketch of an airplane flying through the sky"},{ id: "colorful-watercolor-dog-umbrella----", filename: "example_files/img-colorful-watercolor-dog-umbrella----.webp", prompt: "colorful watercolor painting of a dog holding an umbrella"},{ id: "colorful-watercolor-dog-icecream----", filename: "example_files/img-colorful-watercolor-dog-icecream----.webp", prompt: "colorful watercolor painting of a dog eating icecream"},{ id: "colorful-watercolor-dog-book----", filename: "example_files/img-colorful-watercolor-dog-book----.webp", prompt: "colorful watercolor painting of a dog reading a book"},{ id: "colorful-watercolor-dog-flying----", filename: "example_files/img-colorful-watercolor-dog-flying----.webp", prompt: "colorful watercolor painting of a dog flying through the sky"},{ id: "colorful-watercolor-man-umbrella----", filename: "example_files/img-colorful-watercolor-man-umbrella----.webp", prompt: "colorful watercolor painting of a man holding an umbrella"},{ id: "colorful-watercolor-man-icecream----", filename: "example_files/img-colorful-watercolor-man-icecream----.webp", prompt: "colorful watercolor painting of a man eating icecream"},{ id: "colorful-watercolor-man-book----", filename: "example_files/img-colorful-watercolor-man-book----.webp", prompt: "colorful watercolor painting of a man reading a book"},{ id: "colorful-watercolor-man-flying----", filename: "example_files/img-colorful-watercolor-man-flying----.webp", prompt: "colorful watercolor painting of a man flying through the sky"},{ id: "colorful-watercolor-monster-umbrella----", filename: "example_files/img-colorful-watercolor-monster-umbrella----.webp", prompt: "colorful watercolor painting of a monster holding an umbrella"},{ id: "colorful-watercolor-monster-icecream----", filename: "example_files/img-colorful-watercolor-monster-icecream----.webp", prompt: "colorful watercolor painting of a monster eating icecream"},{ id: "colorful-watercolor-monster-book----", filename: "example_files/img-colorful-watercolor-monster-book----.webp", prompt: "colorful watercolor painting of a monster reading a book"},{ id: "colorful-watercolor-monster-flying----", filename: "example_files/img-colorful-watercolor-monster-flying----.webp", prompt: "colorful watercolor painting of a monster flying through the sky"},{ id: "colorful-watercolor-airplane-umbrella----", filename: "example_files/img-colorful-watercolor-airplane-umbrella----.webp", prompt: "colorful watercolor painting of an airplane holding an umbrella"},{ id: "colorful-watercolor-airplane-icecream----", filename: "example_files/img-colorful-watercolor-airplane-icecream----.webp", prompt: "colorful watercolor painting of an airplane eating icecream"},{ id: "colorful-watercolor-airplane-book----", filename: "example_files/img-colorful-watercolor-airplane-book----.webp", prompt: "colorful watercolor painting of an airplane reading a book"},{ id: "colorful-watercolor-airplane-flying----", filename: "example_files/img-colorful-watercolor-airplane-flying----.webp", prompt: "colorful watercolor painting of an airplane flying through the sky"},{ id: "colorful-cartoon-dog-umbrella----", filename: "example_files/img-colorful-cartoon-dog-umbrella----.webp", prompt: "colorful animated cartoon still of a dog holding an umbrella"},{ id: "colorful-cartoon-dog-icecream----", filename: "example_files/img-colorful-cartoon-dog-icecream----.webp", prompt: "colorful animated cartoon still of a dog eating icecream"},{ id: "colorful-cartoon-dog-book----", filename: "example_files/img-colorful-cartoon-dog-book----.webp", prompt: "colorful animated cartoon still of a dog reading a book"},{ id: "colorful-cartoon-dog-flying----", filename: "example_files/img-colorful-cartoon-dog-flying----.webp", prompt: "colorful animated cartoon still of a dog flying through the sky"},{ id: "colorful-cartoon-man-umbrella----", filename: "example_files/img-colorful-cartoon-man-umbrella----.webp", prompt: "colorful animated cartoon still of a man holding an umbrella"},{ id: "colorful-cartoon-man-icecream----", filename: "example_files/img-colorful-cartoon-man-icecream----.webp", prompt: "colorful animated cartoon still of a man eating icecream"},{ id: "colorful-cartoon-man-book----", filename: "example_files/img-colorful-cartoon-man-book----.webp", prompt: "colorful animated cartoon still of a man reading a book"},{ id: "colorful-cartoon-man-flying----", filename: "example_files/img-colorful-cartoon-man-flying----.webp", prompt: "colorful animated cartoon still of a man flying through the sky"},{ id: "colorful-cartoon-monster-umbrella----", filename: "example_files/img-colorful-cartoon-monster-umbrella----.webp", prompt: "colorful animated cartoon still of a monster holding an umbrella"},{ id: "colorful-cartoon-monster-icecream----", filename: "example_files/img-colorful-cartoon-monster-icecream----.webp", prompt: "colorful animated cartoon still of a monster eating icecream"},{ id: "colorful-cartoon-monster-book----", filename: "example_files/img-colorful-cartoon-monster-book----.webp", prompt: "colorful animated cartoon still of a monster reading a book"},{ id: "colorful-cartoon-monster-flying----", filename: "example_files/img-colorful-cartoon-monster-flying----.webp", prompt: "colorful animated cartoon still of a monster flying through the sky"},{ id: "colorful-cartoon-airplane-umbrella----", filename: "example_files/img-colorful-cartoon-airplane-umbrella----.webp", prompt: "colorful animated cartoon still of an airplane holding an umbrella"},{ id: "colorful-cartoon-airplane-icecream----", filename: "example_files/img-colorful-cartoon-airplane-icecream----.webp", prompt: "colorful animated cartoon still of an airplane eating icecream"},{ id: "colorful-cartoon-airplane-book----", filename: "example_files/img-colorful-cartoon-airplane-book----.webp", prompt: "colorful animated cartoon still of an airplane reading a book"},{ id: "colorful-cartoon-airplane-flying----", filename: "example_files/img-colorful-cartoon-airplane-flying----.webp", prompt: "colorful animated cartoon still of an airplane flying through the sky"},{ id: "colorful-blueprint-dog-umbrella----", filename: "example_files/img-colorful-blueprint-dog-umbrella----.webp", prompt: "colorful blueprint in orthographic projection of a dog holding an umbrella"},{ id: "colorful-blueprint-dog-icecream----", filename: "example_files/img-colorful-blueprint-dog-icecream----.webp", prompt: "colorful blueprint in orthographic projection of a dog eating icecream"},{ id: "colorful-blueprint-dog-book----", filename: "example_files/img-colorful-blueprint-dog-book----.webp", prompt: "colorful blueprint in orthographic projection of a dog reading a book"},{ id: "colorful-blueprint-dog-flying----", filename: "example_files/img-colorful-blueprint-dog-flying----.webp", prompt: "colorful blueprint in orthographic projection of a dog flying through the sky"},{ id: "colorful-blueprint-man-umbrella----", filename: "example_files/img-colorful-blueprint-man-umbrella----.webp", prompt: "colorful blueprint in orthographic projection of a man holding an umbrella"},{ id: "colorful-blueprint-man-icecream----", filename: "example_files/img-colorful-blueprint-man-icecream----.webp", prompt: "colorful blueprint in orthographic projection of a man eating icecream"},{ id: "colorful-blueprint-man-book----", filename: "example_files/img-colorful-blueprint-man-book----.webp", prompt: "colorful blueprint in orthographic projection of a man reading a book"},{ id: "colorful-blueprint-man-flying----", filename: "example_files/img-colorful-blueprint-man-flying----.webp", prompt: "colorful blueprint in orthographic projection of a man flying through the sky"},{ id: "colorful-blueprint-monster-umbrella----", filename: "example_files/img-colorful-blueprint-monster-umbrella----.webp", prompt: "colorful blueprint in orthographic projection of a monster holding an umbrella"},{ id: "colorful-blueprint-monster-icecream----", filename: "example_files/img-colorful-blueprint-monster-icecream----.webp", prompt: "colorful blueprint in orthographic projection of a monster eating icecream"},{ id: "colorful-blueprint-monster-book----", filename: "example_files/img-colorful-blueprint-monster-book----.webp", prompt: "colorful blueprint in orthographic projection of a monster reading a book"},{ id: "colorful-blueprint-monster-flying----", filename: "example_files/img-colorful-blueprint-monster-flying----.webp", prompt: "colorful blueprint in orthographic projection of a monster flying through the sky"},{ id: "colorful-blueprint-airplane-umbrella----", filename: "example_files/img-colorful-blueprint-airplane-umbrella----.webp", prompt: "colorful blueprint in orthographic projection of an airplane holding an umbrella"},{ id: "colorful-blueprint-airplane-icecream----", filename: "example_files/img-colorful-blueprint-airplane-icecream----.webp", prompt: "colorful blueprint in orthographic projection of an airplane eating icecream"},{ id: "colorful-blueprint-airplane-book----", filename: "example_files/img-colorful-blueprint-airplane-book----.webp", prompt: "colorful blueprint in orthographic projection of an airplane reading a book"},{ id: "colorful-blueprint-airplane-flying----", filename: "example_files/img-colorful-blueprint-airplane-flying----.webp", prompt: "colorful blueprint in orthographic projection of an airplane flying through the sky"},{ id: "colorful-3d render-dog-umbrella----", filename: "example_files/img-colorful-3d render-dog-umbrella----.webp", prompt: "colorful 3d render of a dog holding an umbrella"},{ id: "colorful-3d render-dog-icecream----", filename: "example_files/img-colorful-3d render-dog-icecream----.webp", prompt: "colorful 3d render of a dog eating icecream"},{ id: "colorful-3d render-dog-book----", filename: "example_files/img-colorful-3d render-dog-book----.webp", prompt: "colorful 3d render of a dog reading a book"},{ id: "colorful-3d render-dog-flying----", filename: "example_files/img-colorful-3d render-dog-flying----.webp", prompt: "colorful 3d render of a dog flying through the sky"},{ id: "colorful-3d render-man-umbrella----", filename: "example_files/img-colorful-3d render-man-umbrella----.webp", prompt: "colorful 3d render of a man holding an umbrella"},{ id: "colorful-3d render-man-icecream----", filename: "example_files/img-colorful-3d render-man-icecream----.webp", prompt: "colorful 3d render of a man eating icecream"},{ id: "colorful-3d render-man-book----", filename: "example_files/img-colorful-3d render-man-book----.webp", prompt: "colorful 3d render of a man reading a book"},{ id: "colorful-3d render-man-flying----", filename: "example_files/img-colorful-3d render-man-flying----.webp", prompt: "colorful 3d render of a man flying through the sky"},{ id: "colorful-3d render-monster-umbrella----", filename: "example_files/img-colorful-3d render-monster-umbrella----.webp", prompt: "colorful 3d render of a monster holding an umbrella"},{ id: "colorful-3d render-monster-icecream----", filename: "example_files/img-colorful-3d render-monster-icecream----.webp", prompt: "colorful 3d render of a monster eating icecream"},{ id: "colorful-3d render-monster-book----", filename: "example_files/img-colorful-3d render-monster-book----.webp", prompt: "colorful 3d render of a monster reading a book"},{ id: "colorful-3d render-monster-flying----", filename: "example_files/img-colorful-3d render-monster-flying----.webp", prompt: "colorful 3d render of a monster flying through the sky"},{ id: "colorful-3d render-airplane-umbrella----", filename: "example_files/img-colorful-3d render-airplane-umbrella----.webp", prompt: "colorful 3d render of an airplane holding an umbrella"},{ id: "colorful-3d render-airplane-icecream----", filename: "example_files/img-colorful-3d render-airplane-icecream----.webp", prompt: "colorful 3d render of an airplane eating icecream"},{ id: "colorful-3d render-airplane-book----", filename: "example_files/img-colorful-3d render-airplane-book----.webp", prompt: "colorful 3d render of an airplane reading a book"},{ id: "colorful-3d render-airplane-flying----", filename: "example_files/img-colorful-3d render-airplane-flying----.webp", prompt: "colorful 3d render of an airplane flying through the sky"},{ id: "black and white-picture-dog-umbrella----", filename: "example_files/img-black and white-picture-dog-umbrella----.webp", prompt: "black and white picture of a dog holding an umbrella"},{ id: "black and white-picture-dog-icecream----", filename: "example_files/img-black and white-picture-dog-icecream----.webp", prompt: "black and white picture of a dog eating icecream"},{ id: "black and white-picture-dog-book----", filename: "example_files/img-black and white-picture-dog-book----.webp", prompt: "black and white picture of a dog reading a book"},{ id: "black and white-picture-dog-flying----", filename: "example_files/img-black and white-picture-dog-flying----.webp", prompt: "black and white picture of a dog flying through the sky"},{ id: "black and white-picture-man-umbrella----", filename: "example_files/img-black and white-picture-man-umbrella----.webp", prompt: "black and white picture of a man holding an umbrella"},{ id: "black and white-picture-man-icecream----", filename: "example_files/img-black and white-picture-man-icecream----.webp", prompt: "black and white picture of a man eating icecream"},{ id: "black and white-picture-man-book----", filename: "example_files/img-black and white-picture-man-book----.webp", prompt: "black and white picture of a man reading a book"},{ id: "black and white-picture-man-flying----", filename: "example_files/img-black and white-picture-man-flying----.webp", prompt: "black and white picture of a man flying through the sky"},{ id: "black and white-picture-monster-umbrella----", filename: "example_files/img-black and white-picture-monster-umbrella----.webp", prompt: "black and white picture of a monster holding an umbrella"},{ id: "black and white-picture-monster-icecream----", filename: "example_files/img-black and white-picture-monster-icecream----.webp", prompt: "black and white picture of a monster eating icecream"},{ id: "black and white-picture-monster-book----", filename: "example_files/img-black and white-picture-monster-book----.webp", prompt: "black and white picture of a monster reading a book"},{ id: "black and white-picture-monster-flying----", filename: "example_files/img-black and white-picture-monster-flying----.webp", prompt: "black and white picture of a monster flying through the sky"},{ id: "black and white-picture-airplane-umbrella----", filename: "example_files/img-black and white-picture-airplane-umbrella----.webp", prompt: "black and white picture of an airplane holding an umbrella"},{ id: "black and white-picture-airplane-icecream----", filename: "example_files/img-black and white-picture-airplane-icecream----.webp", prompt: "black and white picture of an airplane eating icecream"},{ id: "black and white-picture-airplane-book----", filename: "example_files/img-black and white-picture-airplane-book----.webp", prompt: "black and white picture of an airplane reading a book"},{ id: "black and white-picture-airplane-flying----", filename: "example_files/img-black and white-picture-airplane-flying----.webp", prompt: "black and white picture of an airplane flying through the sky"},{ id: "black and white-pencil-dog-umbrella----", filename: "example_files/img-black and white-pencil-dog-umbrella----.webp", prompt: "black and white simple pencil sketch of a dog holding an umbrella"},{ id: "black and white-pencil-dog-icecream----", filename: "example_files/img-black and white-pencil-dog-icecream----.webp", prompt: "black and white simple pencil sketch of a dog eating icecream"},{ id: "black and white-pencil-dog-book----", filename: "example_files/img-black and white-pencil-dog-book----.webp", prompt: "black and white simple pencil sketch of a dog reading a book"},{ id: "black and white-pencil-dog-flying----", filename: "example_files/img-black and white-pencil-dog-flying----.webp", prompt: "black and white simple pencil sketch of a dog flying through the sky"},{ id: "black and white-pencil-man-umbrella----", filename: "example_files/img-black and white-pencil-man-umbrella----.webp", prompt: "black and white simple pencil sketch of a man holding an umbrella"},{ id: "black and white-pencil-man-icecream----", filename: "example_files/img-black and white-pencil-man-icecream----.webp", prompt: "black and white simple pencil sketch of a man eating icecream"},{ id: "black and white-pencil-man-book----", filename: "example_files/img-black and white-pencil-man-book----.webp", prompt: "black and white simple pencil sketch of a man reading a book"},{ id: "black and white-pencil-man-flying----", filename: "example_files/img-black and white-pencil-man-flying----.webp", prompt: "black and white simple pencil sketch of a man flying through the sky"},{ id: "black and white-pencil-monster-umbrella----", filename: "example_files/img-black and white-pencil-monster-umbrella----.webp", prompt: "black and white simple pencil sketch of a monster holding an umbrella"},{ id: "black and white-pencil-monster-icecream----", filename: "example_files/img-black and white-pencil-monster-icecream----.webp", prompt: "black and white simple pencil sketch of a monster eating icecream"},{ id: "black and white-pencil-monster-book----", filename: "example_files/img-black and white-pencil-monster-book----.webp", prompt: "black and white simple pencil sketch of a monster reading a book"},{ id: "black and white-pencil-monster-flying----", filename: "example_files/img-black and white-pencil-monster-flying----.webp", prompt: "black and white simple pencil sketch of a monster flying through the sky"},{ id: "black and white-pencil-airplane-umbrella----", filename: "example_files/img-black and white-pencil-airplane-umbrella----.webp", prompt: "black and white simple pencil sketch of an airplane holding an umbrella"},{ id: "black and white-pencil-airplane-icecream----", filename: "example_files/img-black and white-pencil-airplane-icecream----.webp", prompt: "black and white simple pencil sketch of an airplane eating icecream"},{ id: "black and white-pencil-airplane-book----", filename: "example_files/img-black and white-pencil-airplane-book----.webp", prompt: "black and white simple pencil sketch of an airplane reading a book"},{ id: "black and white-pencil-airplane-flying----", filename: "example_files/img-black and white-pencil-airplane-flying----.webp", prompt: "black and white simple pencil sketch of an airplane flying through the sky"},{ id: "black and white-watercolor-dog-umbrella----", filename: "example_files/img-black and white-watercolor-dog-umbrella----.webp", prompt: "black and white watercolor painting of a dog holding an umbrella"},{ id: "black and white-watercolor-dog-icecream----", filename: "example_files/img-black and white-watercolor-dog-icecream----.webp", prompt: "black and white watercolor painting of a dog eating icecream"},{ id: "black and white-watercolor-dog-book----", filename: "example_files/img-black and white-watercolor-dog-book----.webp", prompt: "black and white watercolor painting of a dog reading a book"},{ id: "black and white-watercolor-dog-flying----", filename: "example_files/img-black and white-watercolor-dog-flying----.webp", prompt: "black and white watercolor painting of a dog flying through the sky"},{ id: "black and white-watercolor-man-umbrella----", filename: "example_files/img-black and white-watercolor-man-umbrella----.webp", prompt: "black and white watercolor painting of a man holding an umbrella"},{ id: "black and white-watercolor-man-icecream----", filename: "example_files/img-black and white-watercolor-man-icecream----.webp", prompt: "black and white watercolor painting of a man eating icecream"},{ id: "black and white-watercolor-man-book----", filename: "example_files/img-black and white-watercolor-man-book----.webp", prompt: "black and white watercolor painting of a man reading a book"},{ id: "black and white-watercolor-man-flying----", filename: "example_files/img-black and white-watercolor-man-flying----.webp", prompt: "black and white watercolor painting of a man flying through the sky"},{ id: "black and white-watercolor-monster-umbrella----", filename: "example_files/img-black and white-watercolor-monster-umbrella----.webp", prompt: "black and white watercolor painting of a monster holding an umbrella"},{ id: "black and white-watercolor-monster-icecream----", filename: "example_files/img-black and white-watercolor-monster-icecream----.webp", prompt: "black and white watercolor painting of a monster eating icecream"},{ id: "black and white-watercolor-monster-book----", filename: "example_files/img-black and white-watercolor-monster-book----.webp", prompt: "black and white watercolor painting of a monster reading a book"},{ id: "black and white-watercolor-monster-flying----", filename: "example_files/img-black and white-watercolor-monster-flying----.webp", prompt: "black and white watercolor painting of a monster flying through the sky"},{ id: "black and white-watercolor-airplane-umbrella----", filename: "example_files/img-black and white-watercolor-airplane-umbrella----.webp", prompt: "black and white watercolor painting of an airplane holding an umbrella"},{ id: "black and white-watercolor-airplane-icecream----", filename: "example_files/img-black and white-watercolor-airplane-icecream----.webp", prompt: "black and white watercolor painting of an airplane eating icecream"},{ id: "black and white-watercolor-airplane-book----", filename: "example_files/img-black and white-watercolor-airplane-book----.webp", prompt: "black and white watercolor painting of an airplane reading a book"},{ id: "black and white-watercolor-airplane-flying----", filename: "example_files/img-black and white-watercolor-airplane-flying----.webp", prompt: "black and white watercolor painting of an airplane flying through the sky"},{ id: "black and white-cartoon-dog-umbrella----", filename: "example_files/img-black and white-cartoon-dog-umbrella----.webp", prompt: "black and white animated cartoon still of a dog holding an umbrella"},{ id: "black and white-cartoon-dog-icecream----", filename: "example_files/img-black and white-cartoon-dog-icecream----.webp", prompt: "black and white animated cartoon still of a dog eating icecream"},{ id: "black and white-cartoon-dog-book----", filename: "example_files/img-black and white-cartoon-dog-book----.webp", prompt: "black and white animated cartoon still of a dog reading a book"},{ id: "black and white-cartoon-dog-flying----", filename: "example_files/img-black and white-cartoon-dog-flying----.webp", prompt: "black and white animated cartoon still of a dog flying through the sky"},{ id: "black and white-cartoon-man-umbrella----", filename: "example_files/img-black and white-cartoon-man-umbrella----.webp", prompt: "black and white animated cartoon still of a man holding an umbrella"},{ id: "black and white-cartoon-man-icecream----", filename: "example_files/img-black and white-cartoon-man-icecream----.webp", prompt: "black and white animated cartoon still of a man eating icecream"},{ id: "black and white-cartoon-man-book----", filename: "example_files/img-black and white-cartoon-man-book----.webp", prompt: "black and white animated cartoon still of a man reading a book"},{ id: "black and white-cartoon-man-flying----", filename: "example_files/img-black and white-cartoon-man-flying----.webp", prompt: "black and white animated cartoon still of a man flying through the sky"},{ id: "black and white-cartoon-monster-umbrella----", filename: "example_files/img-black and white-cartoon-monster-umbrella----.webp", prompt: "black and white animated cartoon still of a monster holding an umbrella"},{ id: "black and white-cartoon-monster-icecream----", filename: "example_files/img-black and white-cartoon-monster-icecream----.webp", prompt: "black and white animated cartoon still of a monster eating icecream"},{ id: "black and white-cartoon-monster-book----", filename: "example_files/img-black and white-cartoon-monster-book----.webp", prompt: "black and white animated cartoon still of a monster reading a book"},{ id: "black and white-cartoon-monster-flying----", filename: "example_files/img-black and white-cartoon-monster-flying----.webp", prompt: "black and white animated cartoon still of a monster flying through the sky"},{ id: "black and white-cartoon-airplane-umbrella----", filename: "example_files/img-black and white-cartoon-airplane-umbrella----.webp", prompt: "black and white animated cartoon still of an airplane holding an umbrella"},{ id: "black and white-cartoon-airplane-icecream----", filename: "example_files/img-black and white-cartoon-airplane-icecream----.webp", prompt: "black and white animated cartoon still of an airplane eating icecream"},{ id: "black and white-cartoon-airplane-book----", filename: "example_files/img-black and white-cartoon-airplane-book----.webp", prompt: "black and white animated cartoon still of an airplane reading a book"},{ id: "black and white-cartoon-airplane-flying----", filename: "example_files/img-black and white-cartoon-airplane-flying----.webp", prompt: "black and white animated cartoon still of an airplane flying through the sky"},{ id: "black and white-blueprint-dog-umbrella----", filename: "example_files/img-black and white-blueprint-dog-umbrella----.webp", prompt: "black and white blueprint in orthographic projection of a dog holding an umbrella"},{ id: "black and white-blueprint-dog-icecream----", filename: "example_files/img-black and white-blueprint-dog-icecream----.webp", prompt: "black and white blueprint in orthographic projection of a dog eating icecream"},{ id: "black and white-blueprint-dog-book----", filename: "example_files/img-black and white-blueprint-dog-book----.webp", prompt: "black and white blueprint in orthographic projection of a dog reading a book"},{ id: "black and white-blueprint-dog-flying----", filename: "example_files/img-black and white-blueprint-dog-flying----.webp", prompt: "black and white blueprint in orthographic projection of a dog flying through the sky"},{ id: "black and white-blueprint-man-umbrella----", filename: "example_files/img-black and white-blueprint-man-umbrella----.webp", prompt: "black and white blueprint in orthographic projection of a man holding an umbrella"},{ id: "black and white-blueprint-man-icecream----", filename: "example_files/img-black and white-blueprint-man-icecream----.webp", prompt: "black and white blueprint in orthographic projection of a man eating icecream"},{ id: "black and white-blueprint-man-book----", filename: "example_files/img-black and white-blueprint-man-book----.webp", prompt: "black and white blueprint in orthographic projection of a man reading a book"},{ id: "black and white-blueprint-man-flying----", filename: "example_files/img-black and white-blueprint-man-flying----.webp", prompt: "black and white blueprint in orthographic projection of a man flying through the sky"},{ id: "black and white-blueprint-monster-umbrella----", filename: "example_files/img-black and white-blueprint-monster-umbrella----.webp", prompt: "black and white blueprint in orthographic projection of a monster holding an umbrella"},{ id: "black and white-blueprint-monster-icecream----", filename: "example_files/img-black and white-blueprint-monster-icecream----.webp", prompt: "black and white blueprint in orthographic projection of a monster eating icecream"},{ id: "black and white-blueprint-monster-book----", filename: "example_files/img-black and white-blueprint-monster-book----.webp", prompt: "black and white blueprint in orthographic projection of a monster reading a book"},{ id: "black and white-blueprint-monster-flying----", filename: "example_files/img-black and white-blueprint-monster-flying----.webp", prompt: "black and white blueprint in orthographic projection of a monster flying through the sky"},{ id: "black and white-blueprint-airplane-umbrella----", filename: "example_files/img-black and white-blueprint-airplane-umbrella----.webp", prompt: "black and white blueprint in orthographic projection of an airplane holding an umbrella"},{ id: "black and white-blueprint-airplane-icecream----", filename: "example_files/img-black and white-blueprint-airplane-icecream----.webp", prompt: "black and white blueprint in orthographic projection of an airplane eating icecream"},{ id: "black and white-blueprint-airplane-book----", filename: "example_files/img-black and white-blueprint-airplane-book----.webp", prompt: "black and white blueprint in orthographic projection of an airplane reading a book"},{ id: "black and white-blueprint-airplane-flying----", filename: "example_files/img-black and white-blueprint-airplane-flying----.webp", prompt: "black and white blueprint in orthographic projection of an airplane flying through the sky"},{ id: "black and white-3d render-dog-umbrella----", filename: "example_files/img-black and white-3d render-dog-umbrella----.webp", prompt: "black and white 3d render of a dog holding an umbrella"},{ id: "black and white-3d render-dog-icecream----", filename: "example_files/img-black and white-3d render-dog-icecream----.webp", prompt: "black and white 3d render of a dog eating icecream"},{ id: "black and white-3d render-dog-book----", filename: "example_files/img-black and white-3d render-dog-book----.webp", prompt: "black and white 3d render of a dog reading a book"},{ id: "black and white-3d render-dog-flying----", filename: "example_files/img-black and white-3d render-dog-flying----.webp", prompt: "black and white 3d render of a dog flying through the sky"},{ id: "black and white-3d render-man-umbrella----", filename: "example_files/img-black and white-3d render-man-umbrella----.webp", prompt: "black and white 3d render of a man holding an umbrella"},{ id: "black and white-3d render-man-icecream----", filename: "example_files/img-black and white-3d render-man-icecream----.webp", prompt: "black and white 3d render of a man eating icecream"},{ id: "black and white-3d render-man-book----", filename: "example_files/img-black and white-3d render-man-book----.webp", prompt: "black and white 3d render of a man reading a book"},{ id: "black and white-3d render-man-flying----", filename: "example_files/img-black and white-3d render-man-flying----.webp", prompt: "black and white 3d render of a man flying through the sky"},{ id: "black and white-3d render-monster-umbrella----", filename: "example_files/img-black and white-3d render-monster-umbrella----.webp", prompt: "black and white 3d render of a monster holding an umbrella"},{ id: "black and white-3d render-monster-icecream----", filename: "example_files/img-black and white-3d render-monster-icecream----.webp", prompt: "black and white 3d render of a monster eating icecream"},{ id: "black and white-3d render-monster-book----", filename: "example_files/img-black and white-3d render-monster-book----.webp", prompt: "black and white 3d render of a monster reading a book"},{ id: "black and white-3d render-monster-flying----", filename: "example_files/img-black and white-3d render-monster-flying----.webp", prompt: "black and white 3d render of a monster flying through the sky"},{ id: "black and white-3d render-airplane-umbrella----", filename: "example_files/img-black and white-3d render-airplane-umbrella----.webp", prompt: "black and white 3d render of an airplane holding an umbrella"},{ id: "black and white-3d render-airplane-icecream----", filename: "example_files/img-black and white-3d render-airplane-icecream----.webp", prompt: "black and white 3d render of an airplane eating icecream"},{ id: "black and white-3d render-airplane-book----", filename: "example_files/img-black and white-3d render-airplane-book----.webp", prompt: "black and white 3d render of an airplane reading a book"},{ id: "black and white-3d render-airplane-flying----", filename: "example_files/img-black and white-3d render-airplane-flying----.webp", prompt: "black and white 3d render of an airplane flying through the sky"},{ id: "psychedelic-picture-dog-umbrella----", filename: "example_files/img-psychedelic-picture-dog-umbrella----.webp", prompt: "psychedelic picture of a dog holding an umbrella"},{ id: "psychedelic-picture-dog-icecream----", filename: "example_files/img-psychedelic-picture-dog-icecream----.webp", prompt: "psychedelic picture of a dog eating icecream"},{ id: "psychedelic-picture-dog-book----", filename: "example_files/img-psychedelic-picture-dog-book----.webp", prompt: "psychedelic picture of a dog reading a book"},{ id: "psychedelic-picture-dog-flying----", filename: "example_files/img-psychedelic-picture-dog-flying----.webp", prompt: "psychedelic picture of a dog flying through the sky"},{ id: "psychedelic-picture-man-umbrella----", filename: "example_files/img-psychedelic-picture-man-umbrella----.webp", prompt: "psychedelic picture of a man holding an umbrella"},{ id: "psychedelic-picture-man-icecream----", filename: "example_files/img-psychedelic-picture-man-icecream----.webp", prompt: "psychedelic picture of a man eating icecream"},{ id: "psychedelic-picture-man-book----", filename: "example_files/img-psychedelic-picture-man-book----.webp", prompt: "psychedelic picture of a man reading a book"},{ id: "psychedelic-picture-man-flying----", filename: "example_files/img-psychedelic-picture-man-flying----.webp", prompt: "psychedelic picture of a man flying through the sky"},{ id: "psychedelic-picture-monster-umbrella----", filename: "example_files/img-psychedelic-picture-monster-umbrella----.webp", prompt: "psychedelic picture of a monster holding an umbrella"},{ id: "psychedelic-picture-monster-icecream----", filename: "example_files/img-psychedelic-picture-monster-icecream----.webp", prompt: "psychedelic picture of a monster eating icecream"},{ id: "psychedelic-picture-monster-book----", filename: "example_files/img-psychedelic-picture-monster-book----.webp", prompt: "psychedelic picture of a monster reading a book"},{ id: "psychedelic-picture-monster-flying----", filename: "example_files/img-psychedelic-picture-monster-flying----.webp", prompt: "psychedelic picture of a monster flying through the sky"},{ id: "psychedelic-picture-airplane-umbrella----", filename: "example_files/img-psychedelic-picture-airplane-umbrella----.webp", prompt: "psychedelic picture of an airplane holding an umbrella"},{ id: "psychedelic-picture-airplane-icecream----", filename: "example_files/img-psychedelic-picture-airplane-icecream----.webp", prompt: "psychedelic picture of an airplane eating icecream"},{ id: "psychedelic-picture-airplane-book----", filename: "example_files/img-psychedelic-picture-airplane-book----.webp", prompt: "psychedelic picture of an airplane reading a book"},{ id: "psychedelic-picture-airplane-flying----", filename: "example_files/img-psychedelic-picture-airplane-flying----.webp", prompt: "psychedelic picture of an airplane flying through the sky"},{ id: "psychedelic-pencil-dog-umbrella----", filename: "example_files/img-psychedelic-pencil-dog-umbrella----.webp", prompt: "psychedelic simple pencil sketch of a dog holding an umbrella"},{ id: "psychedelic-pencil-dog-icecream----", filename: "example_files/img-psychedelic-pencil-dog-icecream----.webp", prompt: "psychedelic simple pencil sketch of a dog eating icecream"},{ id: "psychedelic-pencil-dog-book----", filename: "example_files/img-psychedelic-pencil-dog-book----.webp", prompt: "psychedelic simple pencil sketch of a dog reading a book"},{ id: "psychedelic-pencil-dog-flying----", filename: "example_files/img-psychedelic-pencil-dog-flying----.webp", prompt: "psychedelic simple pencil sketch of a dog flying through the sky"},{ id: "psychedelic-pencil-man-umbrella----", filename: "example_files/img-psychedelic-pencil-man-umbrella----.webp", prompt: "psychedelic simple pencil sketch of a man holding an umbrella"},{ id: "psychedelic-pencil-man-icecream----", filename: "example_files/img-psychedelic-pencil-man-icecream----.webp", prompt: "psychedelic simple pencil sketch of a man eating icecream"},{ id: "psychedelic-pencil-man-book----", filename: "example_files/img-psychedelic-pencil-man-book----.webp", prompt: "psychedelic simple pencil sketch of a man reading a book"},{ id: "psychedelic-pencil-man-flying----", filename: "example_files/img-psychedelic-pencil-man-flying----.webp", prompt: "psychedelic simple pencil sketch of a man flying through the sky"},{ id: "psychedelic-pencil-monster-umbrella----", filename: "example_files/img-psychedelic-pencil-monster-umbrella----.webp", prompt: "psychedelic simple pencil sketch of a monster holding an umbrella"},{ id: "psychedelic-pencil-monster-icecream----", filename: "example_files/img-psychedelic-pencil-monster-icecream----.webp", prompt: "psychedelic simple pencil sketch of a monster eating icecream"},{ id: "psychedelic-pencil-monster-book----", filename: "example_files/img-psychedelic-pencil-monster-book----.webp", prompt: "psychedelic simple pencil sketch of a monster reading a book"},{ id: "psychedelic-pencil-monster-flying----", filename: "example_files/img-psychedelic-pencil-monster-flying----.webp", prompt: "psychedelic simple pencil sketch of a monster flying through the sky"},{ id: "psychedelic-pencil-airplane-umbrella----", filename: "example_files/img-psychedelic-pencil-airplane-umbrella----.webp", prompt: "psychedelic simple pencil sketch of an airplane holding an umbrella"},{ id: "psychedelic-pencil-airplane-icecream----", filename: "example_files/img-psychedelic-pencil-airplane-icecream----.webp", prompt: "psychedelic simple pencil sketch of an airplane eating icecream"},{ id: "psychedelic-pencil-airplane-book----", filename: "example_files/img-psychedelic-pencil-airplane-book----.webp", prompt: "psychedelic simple pencil sketch of an airplane reading a book"},{ id: "psychedelic-pencil-airplane-flying----", filename: "example_files/img-psychedelic-pencil-airplane-flying----.webp", prompt: "psychedelic simple pencil sketch of an airplane flying through the sky"},{ id: "psychedelic-watercolor-dog-umbrella----", filename: "example_files/img-psychedelic-watercolor-dog-umbrella----.webp", prompt: "psychedelic watercolor painting of a dog holding an umbrella"},{ id: "psychedelic-watercolor-dog-icecream----", filename: "example_files/img-psychedelic-watercolor-dog-icecream----.webp", prompt: "psychedelic watercolor painting of a dog eating icecream"},{ id: "psychedelic-watercolor-dog-book----", filename: "example_files/img-psychedelic-watercolor-dog-book----.webp", prompt: "psychedelic watercolor painting of a dog reading a book"},{ id: "psychedelic-watercolor-dog-flying----", filename: "example_files/img-psychedelic-watercolor-dog-flying----.webp", prompt: "psychedelic watercolor painting of a dog flying through the sky"},{ id: "psychedelic-watercolor-man-umbrella----", filename: "example_files/img-psychedelic-watercolor-man-umbrella----.webp", prompt: "psychedelic watercolor painting of a man holding an umbrella"},{ id: "psychedelic-watercolor-man-icecream----", filename: "example_files/img-psychedelic-watercolor-man-icecream----.webp", prompt: "psychedelic watercolor painting of a man eating icecream"},{ id: "psychedelic-watercolor-man-book----", filename: "example_files/img-psychedelic-watercolor-man-book----.webp", prompt: "psychedelic watercolor painting of a man reading a book"},{ id: "psychedelic-watercolor-man-flying----", filename: "example_files/img-psychedelic-watercolor-man-flying----.webp", prompt: "psychedelic watercolor painting of a man flying through the sky"},{ id: "psychedelic-watercolor-monster-umbrella----", filename: "example_files/img-psychedelic-watercolor-monster-umbrella----.webp", prompt: "psychedelic watercolor painting of a monster holding an umbrella"},{ id: "psychedelic-watercolor-monster-icecream----", filename: "example_files/img-psychedelic-watercolor-monster-icecream----.webp", prompt: "psychedelic watercolor painting of a monster eating icecream"},{ id: "psychedelic-watercolor-monster-book----", filename: "example_files/img-psychedelic-watercolor-monster-book----.webp", prompt: "psychedelic watercolor painting of a monster reading a book"},{ id: "psychedelic-watercolor-monster-flying----", filename: "example_files/img-psychedelic-watercolor-monster-flying----.webp", prompt: "psychedelic watercolor painting of a monster flying through the sky"},{ id: "psychedelic-watercolor-airplane-umbrella----", filename: "example_files/img-psychedelic-watercolor-airplane-umbrella----.webp", prompt: "psychedelic watercolor painting of an airplane holding an umbrella"},{ id: "psychedelic-watercolor-airplane-icecream----", filename: "example_files/img-psychedelic-watercolor-airplane-icecream----.webp", prompt: "psychedelic watercolor painting of an airplane eating icecream"},{ id: "psychedelic-watercolor-airplane-book----", filename: "example_files/img-psychedelic-watercolor-airplane-book----.webp", prompt: "psychedelic watercolor painting of an airplane reading a book"},{ id: "psychedelic-watercolor-airplane-flying----", filename: "example_files/img-psychedelic-watercolor-airplane-flying----.webp", prompt: "psychedelic watercolor painting of an airplane flying through the sky"},{ id: "psychedelic-cartoon-dog-umbrella----", filename: "example_files/img-psychedelic-cartoon-dog-umbrella----.webp", prompt: "psychedelic animated cartoon still of a dog holding an umbrella"},{ id: "psychedelic-cartoon-dog-icecream----", filename: "example_files/img-psychedelic-cartoon-dog-icecream----.webp", prompt: "psychedelic animated cartoon still of a dog eating icecream"},{ id: "psychedelic-cartoon-dog-book----", filename: "example_files/img-psychedelic-cartoon-dog-book----.webp", prompt: "psychedelic animated cartoon still of a dog reading a book"},{ id: "psychedelic-cartoon-dog-flying----", filename: "example_files/img-psychedelic-cartoon-dog-flying----.webp", prompt: "psychedelic animated cartoon still of a dog flying through the sky"},{ id: "psychedelic-cartoon-man-umbrella----", filename: "example_files/img-psychedelic-cartoon-man-umbrella----.webp", prompt: "psychedelic animated cartoon still of a man holding an umbrella"},{ id: "psychedelic-cartoon-man-icecream----", filename: "example_files/img-psychedelic-cartoon-man-icecream----.webp", prompt: "psychedelic animated cartoon still of a man eating icecream"},{ id: "psychedelic-cartoon-man-book----", filename: "example_files/img-psychedelic-cartoon-man-book----.webp", prompt: "psychedelic animated cartoon still of a man reading a book"},{ id: "psychedelic-cartoon-man-flying----", filename: "example_files/img-psychedelic-cartoon-man-flying----.webp", prompt: "psychedelic animated cartoon still of a man flying through the sky"},{ id: "psychedelic-cartoon-monster-umbrella----", filename: "example_files/img-psychedelic-cartoon-monster-umbrella----.webp", prompt: "psychedelic animated cartoon still of a monster holding an umbrella"},{ id: "psychedelic-cartoon-monster-icecream----", filename: "example_files/img-psychedelic-cartoon-monster-icecream----.webp", prompt: "psychedelic animated cartoon still of a monster eating icecream"},{ id: "psychedelic-cartoon-monster-book----", filename: "example_files/img-psychedelic-cartoon-monster-book----.webp", prompt: "psychedelic animated cartoon still of a monster reading a book"},{ id: "psychedelic-cartoon-monster-flying----", filename: "example_files/img-psychedelic-cartoon-monster-flying----.webp", prompt: "psychedelic animated cartoon still of a monster flying through the sky"},{ id: "psychedelic-cartoon-airplane-umbrella----", filename: "example_files/img-psychedelic-cartoon-airplane-umbrella----.webp", prompt: "psychedelic animated cartoon still of an airplane holding an umbrella"},{ id: "psychedelic-cartoon-airplane-icecream----", filename: "example_files/img-psychedelic-cartoon-airplane-icecream----.webp", prompt: "psychedelic animated cartoon still of an airplane eating icecream"},{ id: "psychedelic-cartoon-airplane-book----", filename: "example_files/img-psychedelic-cartoon-airplane-book----.webp", prompt: "psychedelic animated cartoon still of an airplane reading a book"},{ id: "psychedelic-cartoon-airplane-flying----", filename: "example_files/img-psychedelic-cartoon-airplane-flying----.webp", prompt: "psychedelic animated cartoon still of an airplane flying through the sky"},{ id: "psychedelic-blueprint-dog-umbrella----", filename: "example_files/img-psychedelic-blueprint-dog-umbrella----.webp", prompt: "psychedelic blueprint in orthographic projection of a dog holding an umbrella"},{ id: "psychedelic-blueprint-dog-icecream----", filename: "example_files/img-psychedelic-blueprint-dog-icecream----.webp", prompt: "psychedelic blueprint in orthographic projection of a dog eating icecream"},{ id: "psychedelic-blueprint-dog-book----", filename: "example_files/img-psychedelic-blueprint-dog-book----.webp", prompt: "psychedelic blueprint in orthographic projection of a dog reading a book"},{ id: "psychedelic-blueprint-dog-flying----", filename: "example_files/img-psychedelic-blueprint-dog-flying----.webp", prompt: "psychedelic blueprint in orthographic projection of a dog flying through the sky"},{ id: "psychedelic-blueprint-man-umbrella----", filename: "example_files/img-psychedelic-blueprint-man-umbrella----.webp", prompt: "psychedelic blueprint in orthographic projection of a man holding an umbrella"},{ id: "psychedelic-blueprint-man-icecream----", filename: "example_files/img-psychedelic-blueprint-man-icecream----.webp", prompt: "psychedelic blueprint in orthographic projection of a man eating icecream"},{ id: "psychedelic-blueprint-man-book----", filename: "example_files/img-psychedelic-blueprint-man-book----.webp", prompt: "psychedelic blueprint in orthographic projection of a man reading a book"},{ id: "psychedelic-blueprint-man-flying----", filename: "example_files/img-psychedelic-blueprint-man-flying----.webp", prompt: "psychedelic blueprint in orthographic projection of a man flying through the sky"},{ id: "psychedelic-blueprint-monster-umbrella----", filename: "example_files/img-psychedelic-blueprint-monster-umbrella----.webp", prompt: "psychedelic blueprint in orthographic projection of a monster holding an umbrella"},{ id: "psychedelic-blueprint-monster-icecream----", filename: "example_files/img-psychedelic-blueprint-monster-icecream----.webp", prompt: "psychedelic blueprint in orthographic projection of a monster eating icecream"},{ id: "psychedelic-blueprint-monster-book----", filename: "example_files/img-psychedelic-blueprint-monster-book----.webp", prompt: "psychedelic blueprint in orthographic projection of a monster reading a book"},{ id: "psychedelic-blueprint-monster-flying----", filename: "example_files/img-psychedelic-blueprint-monster-flying----.webp", prompt: "psychedelic blueprint in orthographic projection of a monster flying through the sky"},{ id: "psychedelic-blueprint-airplane-umbrella----", filename: "example_files/img-psychedelic-blueprint-airplane-umbrella----.webp", prompt: "psychedelic blueprint in orthographic projection of an airplane holding an umbrella"},{ id: "psychedelic-blueprint-airplane-icecream----", filename: "example_files/img-psychedelic-blueprint-airplane-icecream----.webp", prompt: "psychedelic blueprint in orthographic projection of an airplane eating icecream"},{ id: "psychedelic-blueprint-airplane-book----", filename: "example_files/img-psychedelic-blueprint-airplane-book----.webp", prompt: "psychedelic blueprint in orthographic projection of an airplane reading a book"},{ id: "psychedelic-blueprint-airplane-flying----", filename: "example_files/img-psychedelic-blueprint-airplane-flying----.webp", prompt: "psychedelic blueprint in orthographic projection of an airplane flying through the sky"},{ id: "psychedelic-3d render-dog-umbrella----", filename: "example_files/img-psychedelic-3d render-dog-umbrella----.webp", prompt: "psychedelic 3d render of a dog holding an umbrella"},{ id: "psychedelic-3d render-dog-icecream----", filename: "example_files/img-psychedelic-3d render-dog-icecream----.webp", prompt: "psychedelic 3d render of a dog eating icecream"},{ id: "psychedelic-3d render-dog-book----", filename: "example_files/img-psychedelic-3d render-dog-book----.webp", prompt: "psychedelic 3d render of a dog reading a book"},{ id: "psychedelic-3d render-dog-flying----", filename: "example_files/img-psychedelic-3d render-dog-flying----.webp", prompt: "psychedelic 3d render of a dog flying through the sky"},{ id: "psychedelic-3d render-man-umbrella----", filename: "example_files/img-psychedelic-3d render-man-umbrella----.webp", prompt: "psychedelic 3d render of a man holding an umbrella"},{ id: "psychedelic-3d render-man-icecream----", filename: "example_files/img-psychedelic-3d render-man-icecream----.webp", prompt: "psychedelic 3d render of a man eating icecream"},{ id: "psychedelic-3d render-man-book----", filename: "example_files/img-psychedelic-3d render-man-book----.webp", prompt: "psychedelic 3d render of a man reading a book"},{ id: "psychedelic-3d render-man-flying----", filename: "example_files/img-psychedelic-3d render-man-flying----.webp", prompt: "psychedelic 3d render of a man flying through the sky"},{ id: "psychedelic-3d render-monster-umbrella----", filename: "example_files/img-psychedelic-3d render-monster-umbrella----.webp", prompt: "psychedelic 3d render of a monster holding an umbrella"},{ id: "psychedelic-3d render-monster-icecream----", filename: "example_files/img-psychedelic-3d render-monster-icecream----.webp", prompt: "psychedelic 3d render of a monster eating icecream"},{ id: "psychedelic-3d render-monster-book----", filename: "example_files/img-psychedelic-3d render-monster-book----.webp", prompt: "psychedelic 3d render of a monster reading a book"},{ id: "psychedelic-3d render-monster-flying----", filename: "example_files/img-psychedelic-3d render-monster-flying----.webp", prompt: "psychedelic 3d render of a monster flying through the sky"},{ id: "psychedelic-3d render-airplane-umbrella----", filename: "example_files/img-psychedelic-3d render-airplane-umbrella----.webp", prompt: "psychedelic 3d render of an airplane holding an umbrella"},{ id: "psychedelic-3d render-airplane-icecream----", filename: "example_files/img-psychedelic-3d render-airplane-icecream----.webp", prompt: "psychedelic 3d render of an airplane eating icecream"},{ id: "psychedelic-3d render-airplane-book----", filename: "example_files/img-psychedelic-3d render-airplane-book----.webp", prompt: "psychedelic 3d render of an airplane reading a book"},{ id: "psychedelic-3d render-airplane-flying----", filename: "example_files/img-psychedelic-3d render-airplane-flying----.webp", prompt: "psychedelic 3d render of an airplane flying through the sky"},];
const width = 512;
const height = 512;
const format = "webp";
const defaultImage = images[0].filename;
const idLists = [ids1, ids2, ids3, ids4, ids5, ids6, ids7, ids8];
const selectedIds = idLists.map(list => list ? list[0] : null);
const initialSelections = defaultImage.replace(fileprefix, '').replace(filesuffix, '').split('-');
idLists.forEach((list, index) => {
if (list && initialSelections[index]) {
selectedIds[index] = initialSelections[index];
}
});
const selectedClass = 'selected';
function isValidCombination() {
const selectedPath = selectedIds.map(id => id || '').join('-');
const imagePath = `${fileprefix}${selectedPath}${filesuffix}`;
return images.some(image => image.filename === imagePath);
}
function getImageData() {
const selectedPath = selectedIds.map(id => id || '').join('-');
const imagePath = `${fileprefix}${selectedPath}${filesuffix}`;
return images.find(image => image.filename === imagePath);
}
function updateImage() {
const imageContainer = document.getElementById('image-container');
const selectedImage = document.getElementById('selected-image');
const promptDiv = document.getElementById('image-prompt');
const filenameLink = document.getElementById('image-filename');
const filenameLinkContainer = document.getElementById('image-filename-container');
const zoomSlider = document.getElementById('zoom-slider');
const imageData = getImageData();
if (!imageData) {
// No valid combination selected, hide all elements and return
selectedImage.style.display = 'none';
promptDiv.style.display = 'none';
filenameLink.style.display = 'none';
filenameLinkContainer.style.display = 'none';
} else {
// Valid combination selected, show all elements
selectedImage.style.display = 'block';
promptDiv.style.display = 'block';
filenameLink.style.display = 'inline';
filenameLinkContainer.style.display = 'block';
// Update the elements
selectedImage.src = imageData.filename;
selectedImage.style.width = `${width}px`;
selectedImage.style.height = `${height}px`;
promptDiv.textContent = imageData.prompt;
filenameLink.textContent = `${imageData.id}.${format}`;
filenameLink.href = imageData.filename;
filenameLink.download = `${imageData.id}.${format}`;
// Update zoom level
setZoomLevel(zoomSlider.value);
}
preloadNearbyImages();
}
function createButtons(list, index) {
if (!list) return;
const container = document.createElement('div');
container.className = 'buttons';
list.forEach(id => {
const button = document.createElement('div');
button.className = 'button';
if (id) {
button.textContent = id;
} else {
button.innerHTML = '&nbsp;';
}
button.addEventListener('click', () => {
document.querySelectorAll(`.buttons:nth-child(${index + 1}) .button`).forEach(btn => {
btn.classList.remove('selected', 'selected-disabled');
});
selectedIds[index] = id;
updateButtonStates();
updateImage();
});
container.appendChild(button);
});
document.getElementById('button-container').appendChild(container);
}
function updateButtonStates() {
idLists.forEach((list, index) => {
if (list) {
const buttonsContainer = document.querySelector(`.buttons:nth-child(${index + 1})`);
if (buttonsContainer) {
const buttons = buttonsContainer.querySelectorAll('.button');
list.forEach((id, idIndex) => {
const tempSelectedIds = [...selectedIds];
tempSelectedIds[index] = id;
const isValid = images.some(image => image.filename === `${fileprefix}${tempSelectedIds.map(id => id || '').join('-')}${filesuffix}`);
const button = buttons[idIndex];
if (button) {
button.classList.remove('disabled', 'selected', 'selected-disabled');
if (!isValid) {
button.classList.add('disabled');
if (id === selectedIds[index]) {
button.classList.add('selected-disabled');
}
} else {
if (id === selectedIds[index]) {
button.classList.add('selected');
}
}
}
});
}
}
});
}
function preloadImage(src) {
if (images.some(image => image.filename === src)) {
const img = new Image();
img.src = src;
}
}
function preloadNearbyImages() {
idLists.forEach((list, index) => {
if (list) {
list.forEach(id => {
const tempSelectedIds = [...selectedIds];
tempSelectedIds[index] = id;
const selectedPath = tempSelectedIds.map(id => id || '').join('-');
const imagePath = `${fileprefix}${selectedPath}${filesuffix}`;
preloadImage(imagePath);
});
}
});
}
function setZoomLevel(zoom) {
const selectedImage = document.getElementById('selected-image');
selectedImage.style.width = `${width * (zoom / 100)}px`;
selectedImage.style.height = `${height * (zoom / 100)}px`;
}
function setAutoZoomWindow() {
const windowHeight = window.innerHeight;
const headerHeight = 190; // Adjust as necessary for header height
const footerHeight = 110; // Adjust as necessary for footer height
const margin = 20; // Adjust as necessary for margins
const availableHeight = windowHeight - headerHeight - footerHeight - margin;
const imageAspectRatio = width / height;
const windowAspectRatio = window.innerWidth / availableHeight;
let zoomLevel;
if (imageAspectRatio > windowAspectRatio) {
zoomLevel = Math.min(200, Math.max(10, (window.innerWidth / width) * 100));
} else {
zoomLevel = Math.min(200, Math.max(10, (availableHeight / height) * 100));
}
document.getElementById('zoom-slider').value = zoomLevel;
setZoomLevel(zoomLevel);
}
function setAutoZoomDevice() {
const windowHeight = window.innerHeight;
const margin = 100; // Adjust as necessary for margins
const zoomLevel = Math.min(200, Math.max(10, (windowHeight - margin) / height * 100));
document.getElementById('zoom-slider').value = zoomLevel;
setZoomLevel(zoomLevel);
}
document.getElementById('zoom-slider').addEventListener('input', (event) => {
setZoomLevel(event.target.value);
});
document.getElementById('reset-zoom').addEventListener('click', function() {
document.getElementById('zoom-slider').value = 100;
setZoomLevel(100);
});
document.getElementById('auto-zoom-window').addEventListener('click', setAutoZoomWindow);
document.getElementById('auto-zoom-device').addEventListener('click', setAutoZoomDevice);
idLists.forEach((list, index) => {
if (list) {
createButtons(list, index);
}
});
updateButtonStates();
updateImage();
preloadNearbyImages(); // Preload images on initial load
</script>
</body>
</html>