|
15 | 15 |
|
16 | 16 | <body>
|
17 | 17 |
|
18 |
| -<table> |
19 |
| - <tr> |
20 |
| - <td style="text-align: right; width: 286px; vertical-align: top;"> |
21 |
| - <form id="main-form"> |
| 18 | +<form id="main-form"> |
| 19 | + <table style="width: 100%;"> |
| 20 | + <tr> |
| 21 | + <td style="text-align: right; width: 286px; vertical-align: top;"> |
22 | 22 | <label>
|
23 | 23 | Prompt:<br/>
|
24 |
| - <textarea name="prompt" cols="30" rows="30"></textarea> |
| 24 | + <textarea name="prompt" cols="30" rows="48"></textarea> |
25 | 25 | </label><br/>
|
26 | 26 |
|
27 | 27 | <div style="text-align: right;">
|
28 | 28 | <span id="status"></span> <button type="submit">Send</button>
|
29 | 29 | </div>
|
| 30 | + </td> |
30 | 31 |
|
31 |
| - <hr/> |
| 32 | + <td id="preview" style="vertical-align: top;"> |
| 33 | + |
| 34 | + </td> |
32 | 35 |
|
| 36 | + <td style="text-align: right; width: 286px; vertical-align: top;"> |
33 | 37 | <label>
|
34 | 38 | Negative prompt:<br/>
|
35 | 39 | <textarea name="negative_prompt" cols="30" rows="4"></textarea>
|
|
46 | 50 | </label><br/>
|
47 | 51 |
|
48 | 52 | <label>
|
49 |
| - Width: |
50 |
| - <input type="number" name="width" value="1024"/> |
51 |
| - </label><br/> |
| 53 | + Size: |
| 54 | + <input type="number" name="width" value="1024" style="width: 100px;"/>x |
| 55 | + <input type="number" name="height" value="768" style="width: 100px;"/> |
52 | 56 |
|
53 |
| - <label> |
54 |
| - Height: |
55 |
| - <input type="number" name="height" value="768"/> |
56 | 57 | </label><br/>
|
57 |
| - |
58 | 58 | <label>
|
59 | 59 | CFG scale:
|
60 | 60 | <input type="number" name="cfg_scale" value="7"/>
|
|
100 | 100 |
|
101 | 101 | <label>
|
102 | 102 | <textarea name="loras" cols="30" rows="4"></textarea>
|
103 |
| - </label><br/> |
104 |
| - </form> |
105 |
| - </td> |
106 |
| - |
107 |
| - <td id="preview" style="vertical-align: top;"> |
108 |
| - |
109 |
| - </td> |
110 |
| - </tr> |
111 |
| -</table> |
112 |
| - |
| 103 | + </label> |
| 104 | + </td> |
| 105 | + </tr> |
| 106 | + </table> |
| 107 | +</form> |
113 | 108 |
|
114 | 109 | <script type="text/javascript">
|
115 | 110 | const form = document.getElementById("main-form")
|
|
202 | 197 | form.addEventListener("submit", formSend);
|
203 | 198 | document.addEventListener("keydown", handleShortcut);
|
204 | 199 |
|
| 200 | + |
| 201 | + // getModels() |
| 202 | + |
205 | 203 | if (typeof Storage !== "undefined") {
|
206 | 204 | if (typeof localStorage["main-form-data"] !== "undefined") {
|
207 | 205 | const stored = JSON.parse(localStorage.getItem('main-form-data'));
|
|
239 | 237 | document.getElementById("status").textContent = status
|
240 | 238 | document.title = "GWD - " + status
|
241 | 239 | }
|
| 240 | + |
| 241 | + |
| 242 | + function getModels() { |
| 243 | + let xhr = new XMLHttpRequest(); |
| 244 | + xhr.open("GET", "/models", true); |
| 245 | + xhr.setRequestHeader("Content-Type", "application/json"); |
| 246 | + xhr.onreadystatechange = function () { |
| 247 | + if (xhr.readyState === 4 && xhr.status === 200) { |
| 248 | + |
| 249 | + } |
| 250 | + } |
| 251 | + |
| 252 | + xhr.send() |
| 253 | + } |
242 | 254 | </script>
|
243 | 255 | </body>
|
244 | 256 | </html>
|
0 commit comments