added support for parsing run log and displaying images in the fronte…

…nd init state
invoke-ai · Sep 7, 2022 · 7459f50 · 7459f50
1 parent edada04
commit 7459f50
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 6 deletions.
diff --git a/ldm/dream/server.py b/ldm/dream/server.py
@@ -31,6 +31,23 @@ def do_GET(self):
  'gfpgan_model_exists': gfpgan_model_exists
  }
  self.wfile.write(bytes("let config = " + json.dumps(config) + ";\n", "utf-8"))
+ elif self.path == "/run_log.json":
+ self.send_response(200)
+ self.send_header("Content-type", "application/json")
+ self.end_headers()
+ output = []
+
+ log_file = os.path.join(self.outdir, "dream_web_log.txt")
+ if os.path.exists(log_file):
+ with open(log_file, "r") as log:
+ for line in log:
+ url, config = line.split(": {", maxsplit=1)
+ config = json.loads("{" + config)
+ config["url"] = url.lstrip(".")
+ if os.path.exists(url):
+ output.append(config)
+
+ self.wfile.write(bytes(json.dumps({"run_log": output}), "utf-8"))
  elif self.path == "/cancel":
  self.canceled.set()
  self.send_response(200)

diff --git a/static/dream_web/index.css b/static/dream_web/index.css
@@ -86,8 +86,8 @@ header h1 {
  cursor: pointer;
 }
 #results img {
- height: 30vh;
  border-radius: 5px;
+ object-fit: cover;
 }
 #fieldset-config {
  line-height:2em;
@@ -138,3 +138,7 @@ label {
  background-color: #F5F5F5;
 }
 
+#no-results-message:not(:only-child) {
+ display: none;
+}
+
diff --git a/static/dream_web/index.js b/static/dream_web/index.js
@@ -11,9 +11,15 @@ function appendOutput(src, seed, config) {
  let outputNode = document.createElement("figure");
  let altText = seed.toString() + " | " + config.prompt;
 
+ // img needs width and height for lazy loading to work
  const figureContents = `
  <a href="${src}" target="_blank">
- <img src="${src}" alt="${altText}" title="${altText}">
+ <img src="${src}"
+ alt="${altText}"
+ title="${altText}"
+ loading="lazy"
+ width="256"
+ height="256">
  </a>
  <figcaption>${seed}</figcaption>
  `;
@@ -117,7 +123,6 @@ async function generateSubmit(form) {
 
  if (data.event === 'result') {
  noOutputs = false;
- document.querySelector("#no-results-message")?.remove();
  appendOutput(data.url, data.seed, data.config);
  progressEle.setAttribute('value', 0);
  progressEle.setAttribute('max', totalSteps);
@@ -153,13 +158,12 @@ async function generateSubmit(form) {
  document.querySelector("#prompt").value = `Generating: "${prompt}"`;
 }
 
-window.onload = () => {
+window.onload = async () => {
  document.querySelector("#prompt").addEventListener("keydown", (e) => {
  if (e.key === "Enter" && !e.shiftKey) {
  const form = e.target.form;
  generateSubmit(form);
- }
- });
+ }
  document.querySelector("#generate-form").addEventListener('submit', (e) => {
  e.preventDefault();
  const form = e.target;
@@ -196,4 +200,5 @@ window.onload = () => {
  if (!config.gfpgan_model_exists) {
  document.querySelector("#gfpgan").style.display = 'none';
  }
+ await fetchRunLog()
 };