From f726df8a2fd2620ba245de5702e2afe620f79b91 Mon Sep 17 00:00:00 2001
From: James Tolton <jjtolton@gmail.com>
Date: Sat, 21 Jan 2023 12:59:05 -0500
Subject: [PATCH] Compile and serve js from /statica instead of inline in html

---
 modules/ui.py                     | 35 ++++++++++++++++++++++++++-----
 statica/put-static-files-here.txt |  1 +
 webui.py                          |  2 ++
 3 files changed, 33 insertions(+), 5 deletions(-)
 create mode 100644 statica/put-static-files-here.txt

diff --git a/modules/ui.py b/modules/ui.py
index fbc3efa0..d19eaf25 100644
--- a/modules/ui.py
+++ b/modules/ui.py
@@ -10,6 +10,7 @@ import sys
 import tempfile
 import time
 import traceback
+from collections import OrderedDict
 from functools import partial, reduce
 import warnings
 
@@ -1918,27 +1919,51 @@ def create_ui():
 
 
 def reload_javascript():
+    javascript_files = OrderedDict()
     with open(os.path.join(script_path, "script.js"), "r", encoding="utf8") as jsfile:
-        javascript = f'<script>{jsfile.read()}</script>'
+        contents = jsfile.read()
+        javascript_files["script.js"] = [contents]
+        # javascript = f'<script>{contents}</script>'
 
     scripts_list = modules.scripts.list_scripts("javascript", ".js")
 
     for basedir, filename, path in scripts_list:
         with open(path, "r", encoding="utf8") as jsfile:
-            javascript += f"\n<!-- {filename} --><script>{jsfile.read()}</script>"
+            contents = jsfile.read()
+            javascript_files[filename] = [contents]
+            # javascript += f"\n<!-- {filename} --><script>{contents}</script>"
 
     if cmd_opts.theme is not None:
-        javascript += f"\n<script>set_theme('{cmd_opts.theme}');</script>\n"
+        javascript_files["theme.js"] = [f"set_theme('{cmd_opts.theme}');"]
+        # javascript += f"\n<script>set_theme('{cmd_opts.theme}');</script>\n"
 
-    javascript += f"\n<script>{localization.localization_js(shared.opts.localization)}</script>"
+    # javascript += f"\n<script>{localization.localization_js(shared.opts.localization)}</script>"
+    javascript_files["localization.js"] = [f"{localization.localization_js(shared.opts.localization)}"]
+
+    compiled_name = "webui-compiled.js"
+    head = f"""
+    <script src=/statica/{compiled_name}?{int(time.time())} type="text/javascript"></script>
+    """
 
     def template_response(*args, **kwargs):
         res = shared.GradioTemplateResponseOriginal(*args, **kwargs)
         res.body = res.body.replace(
-            b'</head>', f'{javascript}</head>'.encode("utf8"))
+            b'</head>', f'{head}</head>'.encode("utf8"))
         res.init_headers()
         return res
 
+    for k in javascript_files:
+        javascript_files[k] = "\n".join(javascript_files[k])
+
+    # make static_path if not exists
+    statica_path = os.path.join(script_path, 'statica')
+    if not os.path.exists(statica_path):
+        os.mkdir(statica_path)
+
+    javascript_out = "\n\n\n".join([f"// <!-- {k} -->\n\n{v}" for k, v in javascript_files.items()])
+    with open(os.path.join(script_path, "statica", compiled_name), "w", encoding="utf8") as jsfile:
+        jsfile.write(javascript_out)
+
     gradio.routes.templates.TemplateResponse = template_response
 
 
diff --git a/statica/put-static-files-here.txt b/statica/put-static-files-here.txt
new file mode 100644
index 00000000..7cfaaa86
--- /dev/null
+++ b/statica/put-static-files-here.txt
@@ -0,0 +1 @@
+ayo
\ No newline at end of file
diff --git a/webui.py b/webui.py
index d235da74..50dee700 100644
--- a/webui.py
+++ b/webui.py
@@ -8,6 +8,7 @@ import re
 from fastapi import FastAPI
 from fastapi.middleware.cors import CORSMiddleware
 from fastapi.middleware.gzip import GZipMiddleware
+from starlette.staticfiles import StaticFiles
 
 from modules import import_hook, errors, extra_networks
 from modules import extra_networks_hypernet, ui_extra_networks_hypernets, ui_extra_networks_textual_inversion
@@ -195,6 +196,7 @@ def webui():
         setup_cors(app)
 
         app.add_middleware(GZipMiddleware, minimum_size=1000)
+        app.mount("/statica", StaticFiles(directory=os.path.join(script_path, 'statica')), name="statica")
 
         modules.progress.setup_progress_api(app)