Add user-friendly solution link to README

Added a note about neta.art as a user-friendly solution.

.github/workflows/publish.yml

@@ -0,0 +1,21 @@
+name: Publish to Comfy registry
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+    paths:
+      - "pyproject.toml"
+
+jobs:
+  publish-node:
+    name: Publish Custom Node to registry
+    runs-on: ubuntu-latest
+    steps:
+      - name: Check out code
+        uses: actions/checkout@v4
+      - name: Publish Custom Node
+        uses: Comfy-Org/publish-node-action@main
+        with:
+          ## Add your own personal access token to your Github Repository secrets and reference it here.
+          personal_access_token: ${{ secrets.REGISTRY_ACCESS_TOKEN }}

CHANGELOG.md

@@ -1,6 +1,14 @@
 # ChangeLog
 
-## v1.7.0 - 2023-01-14
+## v1.8.1 - 2024-03-22
+
+- Update xyz_plot to support score mode
+
+## v1.8.0 - 2024-03-19
+
+- Update xyz_plot to support Z axis
+
+## v1.7.0 - 2024-01-14
 
 - Add xyz_plot and select_inputs nodes
 

README.md

@@ -1,5 +1,7 @@
 # ComfyUI Browser
 
+### For user-friendly agentic solution, please try [neta.art](https://neta.art) from the team :)
+
 [中文说明](README_CN.md)
 
 This is an image/video/workflow browser and manager for ComfyUI.
@@ -31,9 +33,9 @@ https://github.com/talesofai/comfyui-browser/assets/828837/803ce57a-1cf2-4e1c-be
 
 - Simple XYZ Plot by selecting inputs and filling in the values.
 
-<img width="256" alt="image" src="https://github.com/talesofai/comfyui-browser/assets/828837/23ce6a4d-3311-4058-9b46-ddb50d07e22a">
+<img width="512" alt="image" src="https://github.com/talesofai/comfyui-browser/assets/828837/23ce6a4d-3311-4058-9b46-ddb50d07e22a">
 
-<img width="256" alt="image" src="https://github.com/talesofai/comfyui-browser/assets/828837/347cad17-17c0-46f1-8df3-4b188b16a354">
+<img width="768" alt="image" src="https://github.com/talesofai/comfyui-browser/assets/828837/d46461ac-3fb3-4037-b1be-048a7ae5e89a">
 
 
 ## Preview
@@ -61,6 +63,37 @@ https://github.com/talesofai/comfyui-browser/assets/828837/803ce57a-1cf2-4e1c-be
 
 Install [ComfyUI Manager](https://github.com/ltdrdata/ComfyUI-Manager), search `comfyui-browser` in Install Custom Node and install it.
 
+#### Configuring
+
+In your `comfyui-browser` directory, you can add a `config.json` to override
+the directories that `comfyui-browser` uses.  Ex:
+
+``` json
+{
+  "collections": "/var/lib/comfyui/comfyui-browser-collections",
+  "download_logs": "/var/lib/comfyui/comfyui-browser-download-logs",
+  "outputs": "/var/lib/comfyui/outputs",
+  "sources": "/var/lib/comfyui/comfyui-browser-sources"
+}
+```
+
+The default configuration values are:
+
+``` json
+{
+  "collections": "[comfyui-browser]/collections",
+  "download_logs": "[comfyui-browser]/download-logs",
+  "outputs": "[comfyui]/outputs",
+  "sources": "[comfyui-browser]/sources"
+}
+```
+
+Where `[comfyui-browser]` is the automatically determined path of your
+`comfyui-browser` installation, and `[comfyui]` is the automatically determined
+path of your `comfyui` server.  Notably, the `outputs` directory defaults to the
+`--output-directory` argument to `comfyui` itself, or the default path that
+`comfyui` wishes to use for the `--output-directory` argument.
+
 ### Manually
 
 Clone this repo into the `custom_nodes` folder and restart the ComfyUI.
@@ -71,7 +104,9 @@ cd custom_nodes && git clone https://github.com/tzwm/comfyui-browser.git
 
 ## Notes
 
-- Your 'Saves' are stored in the `ComfyUI/custom_nodes/comfyui-browser/collections`.
+- Your 'Saves' are stored in the `collections` configuration value.  See <a
+  href="#Configuring">Configuring</a> for its default, and how to set the path
+  to something different.
 - Press 'B' to toggle the Browser dialog in the ComfyUI.
 
 

__init__.py

@@ -4,8 +4,9 @@ from aiohttp import web
 import server
 
 from .utils import collections_path, browser_path, sources_path, download_logs_path, outputs_path
-from .routes import sources, collections, config, files, downloads
-from .nodes import select_inputs, load_image_by_url, xyz_plot, upload_to_remote
+from .routes import sources, collections, config, files, downloads, xyz_plot as xyz_plot_routes
+from .nodes import select_inputs, load_image_by_url, xyz_plot, dify_text_generator, upload_to_remote
+
 
 browser_app = web.Application()
 browser_app.add_routes([
@@ -31,11 +32,14 @@ browser_app.add_routes([
     web.get("/downloads", downloads.api_list_downloads),
     web.get("/downloads/{uuid}", downloads.api_show_download),
 
+    web.put("/xyz_plot/score", xyz_plot_routes.api_update_score),
+    web.get("/xyz_plot/statistic", xyz_plot_routes.api_get_score_statistic),
+
     web.static("/web", os.path.join(browser_path, 'web/build')),
 
-    web.static("/s/outputs", outputs_path),
-    web.static("/s/collections", collections_path),
-    web.static("/s/sources", sources_path),
+    web.static("/s/outputs", outputs_path()),
+    web.static("/s/collections", collections_path()),
+    web.static("/s/sources", sources_path()),
 ])
 server.PromptServer.instance.app.add_subapp("/browser/", browser_app)
 
@@ -44,11 +48,13 @@ NODE_CLASS_MAPPINGS = {
     "LoadImageByUrl //Browser": load_image_by_url.LoadImageByUrl,
     "SelectInputs //Browser": select_inputs.SelectInputs,
     "XyzPlot //Browser": xyz_plot.XyzPlot,
+    "DifyTextGenerator //Browser": dify_text_generator.DifyTextGenerator,
     "UploadToRemote //Browser": upload_to_remote.UploadToRemote,
 }
 NODE_DISPLAY_NAME_MAPPINGS = {
     "LoadImageByUrl //Browser": "Load Image By URL",
     "SelectInputs //Browser": "Select Node Inputs",
     "XyzPlot //Browser": "XYZ Plot",
+    "DifyTextGenerator //Browser": "Dify Text Generator",
     "UploadToRemote //Browser": "Upload To Remote",
 }

data/sources.json

@@ -7,6 +7,13 @@
       "type": "git",
       "description": "Examples of ComfyUI workflows"
     },
+    {
+      "title": "ComfyUI-Workflows-ZHO",
+      "author": "ZHO-ZHO-ZHO",
+      "url": "https://github.com/ZHO-ZHO-ZHO/ComfyUI-Workflows-ZHO",
+      "type": "git",
+      "description": "我的 ComfyUI 工作流合集 | My ComfyUI workflows collection"
+    },
     {
       "title": "comfyui-workflow",
       "author": "hylarucoder",

nodes/dify_text_generator.py

@@ -0,0 +1,53 @@
+import json
+from ..utils import http_client
+
+class DifyTextGenerator:
+    CATEGORY = "Browser"
+
+    RETURN_TYPES = ("STRING", )
+
+    FUNCTION = "run"
+
+    OUTPUT_NODE = True
+
+    @classmethod
+    def INPUT_TYPES(s):
+        return {
+            "required": {
+                "dify_api_endpoint": ["STRING", {}],
+                "api_key": ["STRING", {}],
+            },
+            "optional": {
+                "query": ["STRING", {"multiline": True, "placeholder": "Input as the Query field."}],
+                "inputs_json_str": ["STRING", {"multiline": True, "placeholder":  "JSON format. It will overwrite the query field above."}],
+            },
+        }
+
+    def run(self, dify_api_endpoint, api_key, query, inputs_json_str=None):
+        # for some special network environments like AutoDL
+        proxies = {"http": "", "https": ""}
+        header = {
+            "Content-Type": "application/json",
+            "Authorization": f"Bearer {api_key}",
+        }
+        data = {
+            "user": "comfyui-browser",
+            "response_mode": "blocking",
+            "inputs" : { "query": query },
+        }
+        if inputs_json_str and len(inputs_json_str.strip()) > 0:
+            # something weird, I have to add '{' and '}' manually
+            data["inputs"] = json.loads("{" + inputs_json_str + "}")
+
+        r = http_client().post(
+            dify_api_endpoint,
+            headers=header,
+            data=json.dumps(data),
+            proxies=proxies
+        )
+
+        if not r.ok:
+            raise Exception(f"Request Dify Error: {r.text}")
+
+        content = json.loads(r.content)
+        return (content["answer"], )

nodes/load_image_by_url.py

@@ -1,9 +1,10 @@
 import hashlib
-import requests
 import os
+import io
 from PIL import Image, ImageSequence, ImageOps
 import numpy as np
 import torch
+from ..utils import http_client
 
 
 import folder_paths
@@ -22,6 +23,9 @@ class LoadImageByUrl:
             "required": {
                 "url": ["STRING", {}],
             },
+            "optional": {
+                "cache": ["BOOLEAN", {"default": True}],
+            },
         }
 
 
@@ -29,26 +33,27 @@ class LoadImageByUrl:
         self.url = ""
 
     def filename(self):
-        return hashlib.md5(self.url.encode()).hexdigest()[:24] + '.jpg'
+        return hashlib.md5(self.url.encode()).hexdigest()[:48] + '.jpg'
 
     def download_by_url(self):
         input_dir = folder_paths.get_input_directory()
-        res = requests.get(self.url)
+        res = http_client().get(self.url)
         if res.status_code == 200:
             download_path = os.path.join(input_dir, self.filename())
             with open(download_path, 'wb') as file:
                 file.write(res.content)
+            return res.content
         else:
-            raise ValueError(f"Failed to load image from {self.url}: {res.status_code}")
+            raise ValueError(f"Failed to load image from {self.url}: {res.status_code} {res.text}")
 
-    def run(self, url):
+    def run(self, url, cache=True):
         self.url = url
         input_dir = folder_paths.get_input_directory()
         image_path = os.path.join(input_dir, self.filename())
-        if not os.path.isfile(image_path):
-            self.download_by_url()
-
-        img = Image.open(image_path)
+        if cache == False or not os.path.isfile(image_path):
+            img = Image.open(io.BytesIO(self.download_by_url())) 
+        else:
+            img = Image.open(image_path)
         output_images = []
         for i in ImageSequence.Iterator(img):
             i = ImageOps.exif_transpose(i)

nodes/upload_to_remote.py

@@ -1,4 +1,3 @@
-import requests
 import threading
 import asyncio
 import json
@@ -7,6 +6,7 @@ from PIL.PngImagePlugin import PngInfo
 import numpy as np
 import io
 import base64
+from ..utils import http_client, log
 
 class UploadToRemote:
     CATEGORY = "Browser"
@@ -23,13 +23,14 @@ class UploadToRemote:
     def INPUT_TYPES(s):
         return {
             "required": {
-                "images": ["IMAGE", {}],
                 "remote_url": ["STRING", {}],
                 "extension": (['jpeg', 'webp', 'png', 'jpg', 'gif'], ),
                 "quality": ("INT", {"default": 85, "min": 1, "max": 100, "step": 1}),
                 "embed_workflow": (["false", "true"],),
             },
             "optional": {
+                "images": ["IMAGE", {}],
+                "extra": ["STRING", {"forceInput": True}],
                 "track_id": ["STRING", {"placeholder": "Optional. Post it as the track_id field."}],
             },
             "hidden": {
@@ -39,7 +40,7 @@ class UploadToRemote:
         }
 
 
-    def run(self, images, remote_url, extension='jpeg', quality=85, embed_workflow='false', track_id=None, unique_id=None, prompt=None):
+    def run(self, remote_url, extension='jpeg', quality=85, images=[], extra='', embed_workflow='false', track_id=None, unique_id=None, prompt=None):
         def process_images(images, extension='jpeg', quality=85, embed_workflow='false', prompt=None):
             results = list()
             for image in images:
@@ -60,9 +61,9 @@ class UploadToRemote:
 
                 output = io.BytesIO()
                 if extension in ["jpg", "jpeg"]:
-                    img.save(output, quality=quality, optimize=True, format="JPEG")
+                    img.convert('RGB').save(output, quality=quality, optimize=True, format="JPEG")
                 elif extension == 'webp':
-                    img.save(output, quality=quality, exif=exif_data, format="WEBP")
+                    img.convert('RGB').save(output, quality=quality, exif=exif_data, format="WEBP")
                 else:
                     img.save(output, pnginfo=exif_data, optimize=True, format="PNG")
                 image_bytes = output.getvalue()
@@ -72,22 +73,29 @@ class UploadToRemote:
 
             return results
 
-        async def callback(images, remote_url, extension='jpeg', quality=85, embed_workflow='false', track_id=None, unique_id=None, prompt=None):
+        async def callback(images, extra, remote_url, extension='jpeg', quality=85, embed_workflow='false', track_id=None, unique_id=None, prompt=None):
             data = {
-                "images": process_images(images, extension, quality, embed_workflow, prompt)
+                "images": process_images(images, extension, quality, embed_workflow, prompt),
+                "extra": extra,
             }
             if track_id:
                 data['track_id'] = track_id
             if unique_id:
                 data['unique_id'] = unique_id
+
+            headers = {
+                "Content-Type": "application/json",
+            }
             data = json.dumps(data).encode('utf-8')
-            res = requests.post(remote_url, data=data)
+            log(f"uploading {track_id} to {remote_url}")
+            res = http_client().post(remote_url, data=data, headers=headers)
+            log(f"uploaded {track_id}: {res.status_code} {res.text}")
             # TODO: check the response
 
 
         threading.Thread(
             target=asyncio.run,
-            args=(callback(images, remote_url, extension, quality, embed_workflow, track_id, unique_id, prompt),),
+            args=(callback(images, extra, remote_url, extension, quality, embed_workflow, track_id, unique_id, prompt),),
         ).start()
 
         return ()

nodes/xyz_plot.py

@@ -1,14 +1,14 @@
-import requests
+import shutil
+import time
 import json
 from PIL import Image
 import numpy as np
 import os
 import copy
-import pandas as pd
 
 import folder_paths
 
-from ..utils import SERVER_BASE_URL
+from ..utils import SERVER_BASE_URL, http_client
 
 class XyzPlot:
     CATEGORY = "Browser"
@@ -35,8 +35,11 @@ class XyzPlot:
                 "input_y": ["INPUT", {}],
                 "value_x": ["STRING", {"multiline": True, "placeholder": 'X values split by semicolon such as "1girl; 1boy"'}],
                 "value_y": ["STRING", {"multiline": True, "placeholder": 'Y values split by semicolon such as "1girl; 1boy"'}],
+                "value_z": ["STRING", {"multiline": True, "placeholder": 'Z values split by semicolon such as "1girl; 1boy"'}],
                 "output_folder_name": ["STRING", {"default": "xyz_plot"}],
-                "result_filename": ["STRING", {"default": "result"}],
+            },
+            "optional": {
+                "input_z": ["INPUT", {}],
             },
             "hidden": {
                 "prompt": "PROMPT",
@@ -56,99 +59,159 @@ class XyzPlot:
         self.y_index = 0
 
     @staticmethod
-    def get_filename(ix, iy, i):
-        return f"x{ix}_y{iy}_{i}.jpeg"
+    def get_filename(ix, iy, iz, i):
+        if (iz >= 0):
+            return f"x{ix}_y{iy}_z{iz}_{i}.jpeg"
+        else:
+            return f"x{ix}_y{iy}_{i}.jpeg"
 
     @staticmethod
     def get_preview_url(folder_name, filename):
         return f"/browser/files/view?folder_type=outputs&filename={filename}&folder_path={folder_name}"
 
     def save_images(self, images):
-        if not os.path.exists(self.output_folder_name):
-            os.mkdir(self.output_folder_name)
+        os.makedirs(self.output_folder_name, exist_ok=True)
 
         for index, image in enumerate(images):
             i = 255. * image.cpu().numpy()
             img = Image.fromarray(np.clip(i, 0, 255).astype(np.uint8))
             img = img.convert('RGB')
-            filename = self.get_filename(self.x_index, self.y_index, index)
+            filename = self.get_filename(self.x_index, self.y_index, self.z_index, index)
             target_path = os.path.join(self.output_folder_name, filename)
             img.save(target_path, 'JPEG', quality=90)
 
-    def run(self, images, input_x, input_y, value_x, value_y, output_folder_name, result_filename, prompt, unique_id, extra_pnginfo=None):
-        self.output_folder_name = os.path.join(folder_paths.get_output_directory(), output_folder_name)
+    def run(self, images, input_x, input_y, value_x, value_y, output_folder_name, prompt, unique_id, input_z=None, value_z="", extra_pnginfo=None):
+        self.output_folder_name = os.path.join(
+            folder_paths.get_output_directory(),
+            output_folder_name,
+        )
+
         if 'xyz_data' in prompt[unique_id]['inputs']:
             self.x_index = prompt[unique_id]['inputs']['xyz_data']['x_index']
             self.y_index = prompt[unique_id]['inputs']['xyz_data']['y_index']
+            self.z_index = prompt[unique_id]['inputs']['xyz_data']['z_index']
             self.save_images(images)
             return ()
 
+        if os.path.exists(self.output_folder_name):
+            shutil.move(self.output_folder_name, self.output_folder_name + f'_old_{int(time.time())}')
+
+        def filter_values(value):
+            return list(filter(lambda x: x != '', value.split(";")))
+
+        def queue_new_prompt(prompt):
+            data = json.dumps({
+                'prompt': prompt
+            }).encode('utf-8')
+
+            # for some special network environments like AutoDL
+            proxies = {"http": "", "https": ""}
+            return http_client().post(SERVER_BASE_URL + '/prompt', data=data, proxies=proxies)
+
+
         batch_size = len(images)
-        values_x = value_x.split(";")
-        values_y = value_y.split(";")
-        new_prompt =  copy.deepcopy(prompt)
-        ret = {}
+        values_x = filter_values(value_x)
+        values_y = filter_values(value_y)
+        values_z = filter_values(value_z)
+        new_prompt = copy.deepcopy(prompt)
+        ret = []
         for ix, vx in enumerate(values_x):
             vx = vx.strip()
-            row = {}
+            row = []
             for iy, vy in enumerate(values_y):
                 vy = vy.strip()
                 new_prompt[input_x["node_id"]]["inputs"][input_x["widget_name"]] = vx
                 new_prompt[input_y["node_id"]]["inputs"][input_y["widget_name"]] = vy
+
                 new_prompt[unique_id]['inputs']['xyz_data'] = {
                     "source_unique_id": unique_id,
                     "output_folder_name": output_folder_name,
                     "x_index": ix,
                     "y_index": iy,
+                    "z_index": -1,
                 }
-                data = json.dumps({
-                    'prompt': new_prompt
-                }).encode('utf-8')
 
-                # for some special network environments like AutoDL
-                proxies = {"http": "", "https": ""}
-                r = requests.post(SERVER_BASE_URL + '/prompt', data=data, proxies=proxies)
+                ceil = []
+                if (input_z and len(values_z) > 0):
+                    for iz, vz in enumerate(values_z):
+                        vz = vz.strip()
+                        new_prompt[input_z["node_id"]]["inputs"][input_z["widget_name"]] = vz
+                        new_prompt[unique_id]['inputs']['xyz_data']['z_index'] = iz
+                        queue_new_prompt(new_prompt)
+                        zCeil = []
+                        for i in range(batch_size):
+                            filename = self.get_filename(ix, iy, iz, i)
+                            preview_url = self.get_preview_url(output_folder_name, filename)
+                            zCeil.append({
+                                "uuid": ":".join([output_folder_name, str(ix), str(iy), str(iz), str(i)]),
+                                "type": "img",
+                                "src": preview_url,
+                            })
+                        ceil.append({
+                            "type": "axis",
+                            "value": vz,
+                            "children": zCeil,
+                        })
+                else:
+                    queue_new_prompt(new_prompt)
+                    for i in range(batch_size):
+                        filename = self.get_filename(ix, iy, -1, i)
+                        preview_url = self.get_preview_url(output_folder_name, filename)
+                        ceil.append({
+                            "uuid": ":".join([output_folder_name, str(ix), str(iy), "-1", str(i)]),
+                            "type": "img",
+                            "src": preview_url,
+                        })
 
-                row[vy] = ""
-                for i in range(batch_size):
-                    filename = self.get_filename(ix, iy, i)
-                    preview_url = self.get_preview_url(output_folder_name, filename)
-                    row[vy] += f'<img src="{preview_url}" width="100">'
+                row.append({
+                    "type": "axis",
+                    "value": vy,
+                    "children": ceil,
+                })
 
-            ret[vx] = row
+            ret.append({
+                "type": "axis",
+                "value": vx,
+                "children": row,
+            })
 
         # Check if the directory exists
-        if not os.path.exists(self.output_folder_name):
-            try:
-                os.makedirs(self.output_folder_name)
-            except Exception as e:
-                raise Exception(f"Failed to create directory: {e}")
+        try:
+            os.makedirs(self.output_folder_name, exist_ok=True)
+        except Exception as e:
+            raise Exception(f"Failed to create directory: {e}")
 
         browser_base_url = f"/browser/s/outputs/{output_folder_name}"
-
-        workflow_html = ""
+        retData = {
+            "result": ret,
+        }
         if extra_pnginfo:
-            workflow_filename = f"{result_filename}_workflow.json"
-            with open(f"{self.output_folder_name}/{workflow_filename}", "w") as f:
-                json.dump(extra_pnginfo, f)
-            workflow_html = f'<p><a target="_blank" href="{browser_base_url}/{workflow_filename}">Open the workflow</a></p>'
+            workflow_filename = "workflow.json"
+            with open(f"{self.output_folder_name}/{workflow_filename}", "w", encoding="utf-8") as f:
+                json.dump(extra_pnginfo['workflow'], f)
+            retData["workflow"] = {
+                "url": f'{browser_base_url}/{workflow_filename}',
+            }
+
+        axisConst = ["X", "Y", "Z"]
+        retData["annotations"] = []
+        for index, ele in enumerate([input_x, input_y, input_z]):
+            if not ele:
+                continue
+            retData["annotations"].append({
+                "axis": axisConst[index],
+                "key": f"#{ele['node_id']} {ele['node_title']}",
+                "type": ele['widget_name'],
+            })
 
 
-        # To generate grid HTML
-        def gird_title(input):
-            return f"#{input['node_id']} {input['node_title']} - {input['widget_name']}"
-
-        df = pd.DataFrame(ret)
-        html = workflow_html
-        html += f"<p>X: {gird_title(input_x)}</p><p>Y: {gird_title(input_y)}</p>"
-        html += df.to_html(escape=False)
-        target_path = f"{self.output_folder_name}/{result_filename}.html"
-        with open(target_path, "w") as f:
-            f.write(html)
+        target_path = f"{self.output_folder_name}/result.json"
+        with open(target_path, "w", encoding="utf-8") as f:
+            json.dump(retData, f)
 
         return {
             "ui": {
-                "result_path": [f"{browser_base_url}/{result_filename}.html"],
+                "result_path": [f"/browser/web/xyz_plot.html?path={browser_base_url}/result.json"],
             },
             "result": (),
         }

pyproject.toml

@@ -0,0 +1,15 @@
+[project]
+name = "comfyui-browser"
+description = "This is an image/video/workflow browser and manager for ComfyUI. You could add image/video/workflow to collections and load it to ComfyUI. You will be able to use your collections everywhere."
+version = "1.0.0"
+license = "LICENSE"
+dependencies = ["tqdm", "pandas", "numpy", "requests", "urllib3"]
+
+[project.urls]
+Repository = "https://github.com/talesofai/comfyui-browser"
+#  Used by Comfy Registry https://comfyregistry.org
+
+[tool.comfy]
+PublisherId = ""
+DisplayName = "comfyui-browser"
+Icon = ""

requirements.txt

@@ -1,3 +1,5 @@
 tqdm
 pandas
 numpy
+requests
+urllib3

routes/collections.py

@@ -1,4 +1,4 @@
-from os import path, mkdir
+from os import path, makedirs
 from aiohttp import web
 import shutil
 import time
@@ -19,15 +19,14 @@ async def api_add_to_collections(request):
     folder_type = json_data.get("folder_type", "outputs")
     parent_path = get_parent_path(folder_type)
 
-    if not path.exists(collections_path):
-        mkdir(collections_path)
+    makedirs(collections_path(), exist_ok=True)
 
     source_file_path = path.join(parent_path, folder_path, filename)
     if not path.exists(source_file_path):
         return web.Response(status=404)
 
     new_filepath = path.join(
-        collections_path,
+        collections_path(),
         add_uuid_to_filename(filename)
     )
 
@@ -48,7 +47,7 @@ async def api_create_new_workflow(request):
         return web.Response(status=404)
 
     new_filepath = path.join(
-        collections_path,
+        collections_path(),
         add_uuid_to_filename(filename)
     )
     with open(new_filepath, 'w', encoding='utf-8') as f:
@@ -68,10 +67,10 @@ async def api_sync_my_collections(_):
     git_init()
 
     cmd = 'git status -s'
-    ret = run_cmd(cmd, collections_path)
+    ret = run_cmd(cmd, collections_path())
     if len(ret.stdout) > 0:
         cmd = f'git add . && git commit -m "sync by comfyui-browser at {int(time.time())}"'
-        ret = run_cmd(cmd, collections_path)
+        ret = run_cmd(cmd, collections_path())
         if not ret.returncode == 0:
             return web.json_response(
                 { 'message': "\n".join([ret.stdout, ret.stderr]) },
@@ -79,7 +78,7 @@ async def api_sync_my_collections(_):
             )
 
     cmd = f'git fetch {git_remote_name} -v'
-    ret = run_cmd(cmd, collections_path)
+    ret = run_cmd(cmd, collections_path())
     if not ret.returncode == 0:
         return web.json_response(
             { 'message': "\n".join([ret.stdout, ret.stderr]) },
@@ -87,14 +86,14 @@ async def api_sync_my_collections(_):
         )
 
     cmd = 'git branch --show-current'
-    ret = run_cmd(cmd, collections_path)
+    ret = run_cmd(cmd, collections_path())
     branch = ret.stdout.replace('\n', '')
 
     cmd = f'git merge {git_remote_name}/{branch}'
-    ret = run_cmd(cmd, collections_path, log_code=False)
+    ret = run_cmd(cmd, collections_path(), log_code=False)
 
     cmd = f'git push {git_remote_name} {branch}'
-    ret = run_cmd(cmd, collections_path)
+    ret = run_cmd(cmd, collections_path())
     if not ret.returncode == 0:
         return web.json_response(
             { 'message': "\n".join([ret.stdout, ret.stderr]) },

routes/config.py

@@ -18,7 +18,7 @@ async def api_update_browser_config(request):
     git_init()
 
     if git_repo == '':
-        ret = run_cmd(f'git remote remove {git_remote_name}', collections_path)
+        ret = run_cmd(f'git remote remove {git_remote_name}', collections_path())
         if not ret.returncode == 0:
             return web.json_response(
                 { 'message': ret.stderr },
@@ -42,7 +42,7 @@ def set_config(config):
     with open(config_path, 'w', encoding='utf-8') as f:
         json.dump(config, f)
 
-def git_set_remote_url(remote_url, run_path = collections_path):
+def git_set_remote_url(remote_url, run_path = collections_path()):
     ret = run_cmd('git remote', run_path)
 
     if git_remote_name in ret.stdout.split('\n'):

routes/downloads.py

@@ -1,7 +1,6 @@
 from os import path
 import os
 import shutil
-import requests
 import time
 import asyncio
 import json
@@ -11,7 +10,7 @@ from tqdm import tqdm
 
 import folder_paths
 
-from ..utils import download_logs_path, log
+from ..utils import download_logs_path, log, http_client
 
 def parse_options_header(content_disposition):
     param, options = '', {}
@@ -34,7 +33,7 @@ def parse_options_header(content_disposition):
 
 # credit: https://gist.github.com/phineas-pta/d73f9a035b05f8e923af8c01df057175
 async def download_by_requests(uuid:str, download_url:str, save_in:str, filename:str="", overwrite:bool=False, chunk_size:int=1):
-    log_file_path = path.join(download_logs_path, uuid + '.json')
+    log_file_path = path.join(download_logs_path(), uuid + '.json')
     base_info = {
         'uuid': uuid,
         'download_url': download_url,
@@ -53,7 +52,7 @@ async def download_by_requests(uuid:str, download_url:str, save_in:str, filename
 
     HEADERS = {"User-Agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36"}
 
-    with requests.get(download_url, headers=HEADERS, stream=True) as resp:
+    with http_client().get(download_url, headers=HEADERS, stream=True) as resp:
         MISSING_FILENAME = f"unkwown_{uuid}"
         # get file name
         if filename == "":
@@ -129,7 +128,7 @@ async def api_create_new_download(request):
 
 async def api_list_downloads(_):
     download_logs = []
-    folder_listing = os.scandir(download_logs_path)
+    folder_listing = os.scandir(download_logs_path())
     folder_listing = sorted(folder_listing, key=lambda f: (f.is_file(), -f.stat().st_ctime))
     for item in folder_listing:
         if not path.exists(item.path):
@@ -162,7 +161,7 @@ async def api_show_download(request):
     if uuid == '':
         return web.Response(status=400)
 
-    target_path = path.join(download_logs_path, uuid + '.json')
+    target_path = path.join(download_logs_path(), uuid + '.json')
     if not path.exists(target_path):
         return web.Response(status=404)
 

routes/sources.py

@@ -1,4 +1,4 @@
-from os import path, scandir, mkdir
+from os import path, scandir, makedirs
 import json
 from aiohttp import web, ClientSession, ClientTimeout
 import re
@@ -17,13 +17,13 @@ def handle_remove_readonly(func, path, exc):
         raise
 
 async def api_get_sources(_):
-    if not path.exists(sources_path):
+    if not path.exists(sources_path()):
         return web.json_response({
             'sources': []
         })
 
     sources = []
-    source_list = scandir(sources_path)
+    source_list = scandir(sources_path())
     source_list = sorted(source_list, key=lambda f: (-f.stat().st_ctime))
     for item in source_list:
         if not path.exists(item.path):
@@ -58,8 +58,7 @@ async def api_create_source(request):
     if not repo_url:
         return web.Response(status=400)
 
-    if not path.exists(sources_path):
-        mkdir(sources_path)
+    makedirs(sources_path(), exist_ok=True)
 
     pattern = r'[\:\/]([a-zA-Z0-9-_]+)\/([a-zA-Z0-9-_]+)(\.git)?'
     ret = re.search(pattern, repo_url)
@@ -69,7 +68,7 @@ async def api_create_source(request):
         return web.Response(status=400, text='wrong url')
 
     cmd = f'git clone --depth 1 {repo_url} {author}-{name}'
-    ret = run_cmd(cmd, sources_path)
+    ret = run_cmd(cmd, sources_path())
     if ret.returncode != 0:
         return web.Response(status=400, text=ret.stdout + ret.stderr)
 
@@ -83,7 +82,7 @@ async def api_delete_source(request):
     if not name:
         return web.Response(status=401)
 
-    target_path = path.join(sources_path, name)
+    target_path = path.join(sources_path(), name)
     if not path.exists(target_path):
         return web.Response(status=404)
 
@@ -96,11 +95,11 @@ async def api_sync_source(request):
 
     if not name:
         return web.Response(status=401)
-    if not path.exists(path.join(sources_path, name)):
+    if not path.exists(path.join(sources_path(), name)):
         return web.Response(status=404)
 
     cmd = f'git pull'
-    ret = run_cmd(cmd, path.join(sources_path, name))
+    ret = run_cmd(cmd, path.join(sources_path(), name))
 
     if ret.returncode == 0:
         return web.Response(status=200)

routes/xyz_plot.py

@@ -0,0 +1,124 @@
+import os
+from aiohttp import web
+import datetime
+import csv
+import json
+
+import folder_paths
+
+LOG_FILE_NAME = 'score_log.csv'
+
+async def api_update_score(request):
+    body = await request.json()
+    user_uuid = body.get("user", "anonymous")
+    source = body.get("source")
+    score = body.get("score")
+
+    source_arr = source.split(":")
+    if len(source_arr) != 5:
+        return web.Response(status=404)
+
+    log_path = os.path.join(
+        folder_paths.get_output_directory(),
+        source_arr[0],
+        LOG_FILE_NAME,
+    )
+
+    dtstr = datetime.datetime.utcnow().strftime("%Y-%m-%d %H:%M:%S%Z")
+
+    # created_at, user_uuid, score, ix, iy, iz, index
+    new_line = ",".join([dtstr, user_uuid, str(score), source_arr[1], source_arr[2], source_arr[3], source_arr[4]]) + '\n'
+    if not os.path.exists(log_path):
+        with open(log_path, "w", encoding="utf-8") as f:
+            f.write(new_line)
+    else:
+        lines = []
+        with open(log_path, "r", encoding="utf-8") as f:
+            lines = f.readlines()
+        pattern = ",".join([source_arr[1], source_arr[2], source_arr[3], source_arr[4]])
+        lines = [line for line in lines if pattern not in line]
+        lines.append(new_line)
+        with open(log_path, "w", encoding="utf-8") as f:
+            f.writelines(lines)
+
+    return web.Response(status=200)
+
+async def api_get_score_statistic(request):
+    target_path = request.query.get('path')
+    if not target_path:
+        return web.Response(status=404)
+
+    #/browser/s/outputs/xyz_plot_4/result.json
+    if len(target_path.split('/')) < 5:
+        return web.Response(status=400)
+
+    target_path = target_path.split('/')[4]
+    log_path = os.path.join(
+        folder_paths.get_output_directory(),
+        target_path,
+        LOG_FILE_NAME,
+    )
+    if not os.path.exists(log_path):
+        return web.Response(status=404)
+
+    data = []
+    with open(log_path, 'r', encoding='utf-8') as f:
+        reader = csv.reader(f)
+        for row in reader:
+            data.append(row)
+
+    statistic = {}
+    for row in data:
+        if not row[3] in statistic:
+            statistic[row[3]] = { 'total': 0 }
+        if not row[4] in statistic[row[3]]:
+            statistic[row[3]][row[4]] = { 'total': 0 }
+        if not row[5] in statistic[row[3]][row[4]]:
+            statistic[row[3]][row[4]][row[5]] = 0
+
+        statistic[row[3]][row[4]][row[5]] += int(row[2])
+        statistic[row[3]][row[4]]['total'] += int(row[2])
+        statistic[row[3]]['total'] += int(row[2])
+
+    result_path = os.path.join(
+        folder_paths.get_output_directory(),
+        target_path,
+        'result.json',
+    )
+    xyz_result = []
+    with open(result_path, 'r', encoding='utf-8') as f:
+        xyz_result = json.load(f)['result']
+
+    stat_ret = []
+    for ix, _ in enumerate(xyz_result):
+        vy = xyz_result[ix]['children']
+        rx = {
+            'type': 'axis',
+            'score': statistic.get(str(ix), {}).get('total', 0),
+            'children': [],
+        }
+        for iy, _ in enumerate(vy):
+            vz = vy[iy]['children']
+            ry = {
+                'type': 'axis',
+                'score': statistic.get(str(ix), {}).get(str(iy), {}).get('total', 0),
+                'children': [],
+            }
+            if vz[0]['type'] == 'img':
+                ry['children'].append({
+                    'type': 'axis',
+                    'score': statistic.get(str(ix), {}).get(str(iy), {}).get('-1', 0),
+                })
+            else:
+                for iz, _ in enumerate(vz):
+                    ry['children'].append({
+                        'type': 'axis',
+                        'score': statistic.get(str(ix), {}).get(str(iy), {}).get(str(iz), 0),
+                    })
+            rx['children'].append(ry)
+        stat_ret.append(rx)
+
+
+    return web.json_response({
+        'result': stat_ret,
+    })

svelte/package-lock.json

@@ -12,18 +12,24 @@
         "svelte-i18n": "^4.0.0"
       },
       "devDependencies": {
+        "@faker-js/faker": "^8.4.1",
         "@sveltejs/adapter-auto": "^3.0.1",
         "@sveltejs/adapter-static": "^3.0.1",
         "@sveltejs/kit": "^2.0.4",
         "@sveltejs/vite-plugin-svelte": "^3.0.1",
+        "@types/node": "^20.11.28",
+        "@types/uuid": "^9.0.8",
         "autoprefixer": "^10.4.16",
         "daisyui": "^4.4.22",
+        "dexie": "4.0.1-beta.14",
         "postcss": "^8.4.32",
+        "sass": "^1.72.0",
         "svelte": "^4.2.8",
         "svelte-check": "^3.6.2",
         "tailwindcss": "^3.4.0",
         "tslib": "^2.6.2",
         "typescript": "^5.3.3",
+        "uuid": "^9.0.1",
         "vite": "^5.0.10"
       }
     },
@@ -396,6 +402,22 @@
         "node": ">=12"
       }
     },
+    "node_modules/@faker-js/faker": {
+      "version": "8.4.1",
+      "resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-8.4.1.tgz",
+      "integrity": "sha512-XQ3cU+Q8Uqmrbf2e0cIC/QN43sTBSC8KF12u29Mb47tWrt2hAgBXSgpZMj4Ao8Uk0iJcU99QsOCaIL8934obCg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/fakerjs"
+        }
+      ],
+      "engines": {
+        "node": "^14.17.0 || ^16.13.0 || >=18.0.0",
+        "npm": ">=6.14.13"
+      }
+    },
     "node_modules/@formatjs/ecma402-abstract": {
       "version": "1.18.0",
       "resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-1.18.0.tgz",
@@ -822,12 +844,27 @@
       "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.5.tgz",
       "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw=="
     },
+    "node_modules/@types/node": {
+      "version": "20.11.29",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.11.29.tgz",
+      "integrity": "sha512-P99thMkD/1YkCvAtOd6/zGedKNA0p2fj4ZpjCzcNiSCBWgm3cNRTBfa/qjFnsKkkojxu4vVLtWpesnZ9+ap+gA==",
+      "dev": true,
+      "dependencies": {
+        "undici-types": "~5.26.4"
+      }
+    },
     "node_modules/@types/pug": {
       "version": "2.0.10",
       "resolved": "https://registry.npmjs.org/@types/pug/-/pug-2.0.10.tgz",
       "integrity": "sha512-Sk/uYFOBAB7mb74XcpizmH0KOR2Pv3D2Hmrh1Dmy5BmK3MpdSa5kqZcg6EKBdklU0bFXX9gCfzvpnyUehrPIuA==",
       "dev": true
     },
+    "node_modules/@types/uuid": {
+      "version": "9.0.8",
+      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-9.0.8.tgz",
+      "integrity": "sha512-jg+97EGIcY9AGHJJRaaPVgetKDsrTgbRjQ5Msgjh/DQKEFl0DtyRr/VCOyD1T2R1MNeWPK/u7JoGhlDZnKBAfA==",
+      "dev": true
+    },
     "node_modules/acorn": {
       "version": "8.11.2",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.2.tgz",
@@ -1291,6 +1328,12 @@
       "integrity": "sha512-KqFl6pOgOW+Y6wJgu80rHpo2/3H07vr8ntR9rkkFIRETewbf5GaYYcakYfiKz89K+sLsuPkQIZaXDMjUObZwWg==",
       "dev": true
     },
+    "node_modules/dexie": {
+      "version": "4.0.1-beta.14",
+      "resolved": "https://registry.npmjs.org/dexie/-/dexie-4.0.1-beta.14.tgz",
+      "integrity": "sha512-1Glgs4nyHUriknstBku1T0Qz9qxJbHQy49JFeDEacHQK+XljN/sn1zyIH/HwouQ7a+WAdWHInm51i0GqWOAyHg==",
+      "dev": true
+    },
     "node_modules/didyoumean": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz",
@@ -1614,6 +1657,12 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/immutable": {
+      "version": "4.3.5",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-4.3.5.tgz",
+      "integrity": "sha512-8eabxkth9gZatlwl5TBuJnCsoTADlL6ftEr7A4qgdaTsPyreilDSnUk57SO+jfKcNtxPa22U5KK6DSeAYhpBJw==",
+      "dev": true
+    },
     "node_modules/import-fresh": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
@@ -2442,6 +2491,23 @@
         "rimraf": "^2.5.2"
       }
     },
+    "node_modules/sass": {
+      "version": "1.72.0",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.72.0.tgz",
+      "integrity": "sha512-Gpczt3WA56Ly0Mn8Sl21Vj94s1axi9hDIzDFn9Ph9x3C3p4nNyvsqJoQyVXKou6cBlfFWEgRW4rT8Tb4i3XnVA==",
+      "dev": true,
+      "dependencies": {
+        "chokidar": ">=3.0.0 <4.0.0",
+        "immutable": "^4.0.0",
+        "source-map-js": ">=0.6.2 <2.0.0"
+      },
+      "bin": {
+        "sass": "sass.js"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
     "node_modules/set-cookie-parser": {
       "version": "2.6.0",
       "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.6.0.tgz",
@@ -2992,6 +3058,12 @@
         "node": ">=14.17"
       }
     },
+    "node_modules/undici-types": {
+      "version": "5.26.5",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz",
+      "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==",
+      "dev": true
+    },
     "node_modules/update-browserslist-db": {
       "version": "1.0.13",
       "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz",
@@ -3028,6 +3100,19 @@
       "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
       "dev": true
     },
+    "node_modules/uuid": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-9.0.1.tgz",
+      "integrity": "sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==",
+      "dev": true,
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
+      "bin": {
+        "uuid": "dist/bin/uuid"
+      }
+    },
     "node_modules/vite": {
       "version": "5.0.10",
       "resolved": "https://registry.npmjs.org/vite/-/vite-5.0.10.tgz",

svelte/package.json

@@ -11,18 +11,26 @@
     "extract": "svelte-i18n extract './src/**/*.svelte' ./src/i18n/zh-CN.json && svelte-i18n extract './src/**/*.svelte' ./src/i18n/en-US.json"
   },
   "devDependencies": {
+    "@faker-js/faker": "^8.4.1",
     "@sveltejs/adapter-auto": "^3.0.1",
     "@sveltejs/adapter-static": "^3.0.1",
     "@sveltejs/kit": "^2.0.4",
     "@sveltejs/vite-plugin-svelte": "^3.0.1",
+    "@types/node": "^20.11.28",
+    "@types/pubsub-js": "^1.8.6",
+    "@types/uuid": "^9.0.8",
     "autoprefixer": "^10.4.16",
     "daisyui": "^4.4.22",
+    "dexie": "4.0.1-beta.14",
     "postcss": "^8.4.32",
+    "pubsub-js": "^1.9.4",
+    "sass": "^1.72.0",
     "svelte": "^4.2.8",
     "svelte-check": "^3.6.2",
     "tailwindcss": "^3.4.0",
     "tslib": "^2.6.2",
     "typescript": "^5.3.3",
+    "uuid": "^9.0.1",
     "vite": "^5.0.10"
   },
   "type": "module",
@@ -30,4 +38,4 @@
     "dayjs": "^1.11.10",
     "svelte-i18n": "^4.0.0"
   }
-}
+}

svelte/pnpm-lock.yaml

@@ -13,6 +13,9 @@ dependencies:
     version: 4.0.0(svelte@4.2.8)
 
 devDependencies:
+  '@faker-js/faker':
+    specifier: ^8.4.1
+    version: 8.4.1
   '@sveltejs/adapter-auto':
     specifier: ^3.0.1
     version: 3.0.1(@sveltejs/kit@2.0.4)
@@ -25,21 +28,39 @@ devDependencies:
   '@sveltejs/vite-plugin-svelte':
     specifier: ^3.0.1
     version: 3.0.1(svelte@4.2.8)(vite@5.0.10)
+  '@types/node':
+    specifier: ^20.11.28
+    version: 20.11.28
+  '@types/pubsub-js':
+    specifier: ^1.8.6
+    version: 1.8.6
+  '@types/uuid':
+    specifier: ^9.0.8
+    version: 9.0.8
   autoprefixer:
     specifier: ^10.4.16
     version: 10.4.16(postcss@8.4.32)
   daisyui:
     specifier: ^4.4.22
     version: 4.4.22(postcss@8.4.32)
+  dexie:
+    specifier: 4.0.1-beta.14
+    version: 4.0.1-beta.14
   postcss:
     specifier: ^8.4.32
     version: 8.4.32
+  pubsub-js:
+    specifier: ^1.9.4
+    version: 1.9.4
+  sass:
+    specifier: ^1.72.0
+    version: 1.72.0
   svelte:
     specifier: ^4.2.8
     version: 4.2.8
   svelte-check:
     specifier: ^3.6.2
-    version: 3.6.2(postcss@8.4.32)(svelte@4.2.8)
+    version: 3.6.2(postcss@8.4.32)(sass@1.72.0)(svelte@4.2.8)
   tailwindcss:
     specifier: ^3.4.0
     version: 3.4.0
@@ -49,9 +70,12 @@ devDependencies:
   typescript:
     specifier: ^5.3.3
     version: 5.3.3
+  uuid:
+    specifier: ^9.0.1
+    version: 9.0.1
   vite:
     specifier: ^5.0.10
-    version: 5.0.10
+    version: 5.0.10(@types/node@20.11.28)(sass@1.72.0)
 
 packages:
 
@@ -251,6 +275,11 @@ packages:
     requiresBuild: true
     optional: true
 
+  /@faker-js/faker@8.4.1:
+    resolution: {integrity: sha512-XQ3cU+Q8Uqmrbf2e0cIC/QN43sTBSC8KF12u29Mb47tWrt2hAgBXSgpZMj4Ao8Uk0iJcU99QsOCaIL8934obCg==}
+    engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0, npm: '>=6.14.13'}
+    dev: true
+
   /@formatjs/ecma402-abstract@1.18.0:
     resolution: {integrity: sha512-PEVLoa3zBevWSCZzPIM/lvPCi8P5l4G+NXQMc/CjEiaCWgyHieUoo0nM7Bs0n/NbuQ6JpXEolivQ9pKSBHaDlA==}
     dependencies:
@@ -484,7 +513,7 @@ packages:
       sirv: 2.0.3
       svelte: 4.2.8
       tiny-glob: 0.2.9
-      vite: 5.0.10
+      vite: 5.0.10(@types/node@20.11.28)(sass@1.72.0)
     dev: true
 
   /@sveltejs/vite-plugin-svelte-inspector@2.0.0(@sveltejs/vite-plugin-svelte@3.0.1)(svelte@4.2.8)(vite@5.0.10):
@@ -498,7 +527,7 @@ packages:
       '@sveltejs/vite-plugin-svelte': 3.0.1(svelte@4.2.8)(vite@5.0.10)
       debug: 4.3.4
       svelte: 4.2.8
-      vite: 5.0.10
+      vite: 5.0.10(@types/node@20.11.28)(sass@1.72.0)
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -517,7 +546,7 @@ packages:
       magic-string: 0.30.5
       svelte: 4.2.8
       svelte-hmr: 0.15.3(svelte@4.2.8)
-      vite: 5.0.10
+      vite: 5.0.10(@types/node@20.11.28)(sass@1.72.0)
       vitefu: 0.2.5(vite@5.0.10)
     transitivePeerDependencies:
       - supports-color
@@ -530,10 +559,24 @@ packages:
   /@types/estree@1.0.5:
     resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
 
+  /@types/node@20.11.28:
+    resolution: {integrity: sha512-M/GPWVS2wLkSkNHVeLkrF2fD5Lx5UC4PxA0uZcKc6QqbIQUJyW1jVjueJYi1z8n0I5PxYrtpnPnWglE+y9A0KA==}
+    dependencies:
+      undici-types: 5.26.5
+    dev: true
+
+  /@types/pubsub-js@1.8.6:
+    resolution: {integrity: sha512-Kwug5cwV0paUDm/NfwDx1sp9xI0bGIvmWJjJWCU8NngkCCMt3EIC7oPDvb6fV7BR8kPpFyyBu4D11bda/2MdPA==}
+    dev: true
+
   /@types/pug@2.0.10:
     resolution: {integrity: sha512-Sk/uYFOBAB7mb74XcpizmH0KOR2Pv3D2Hmrh1Dmy5BmK3MpdSa5kqZcg6EKBdklU0bFXX9gCfzvpnyUehrPIuA==}
     dev: true
 
+  /@types/uuid@9.0.8:
+    resolution: {integrity: sha512-jg+97EGIcY9AGHJJRaaPVgetKDsrTgbRjQ5Msgjh/DQKEFl0DtyRr/VCOyD1T2R1MNeWPK/u7JoGhlDZnKBAfA==}
+    dev: true
+
   /acorn@8.11.2:
     resolution: {integrity: sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==}
     engines: {node: '>=0.4.0'}
@@ -759,6 +802,10 @@ packages:
     resolution: {integrity: sha512-KqFl6pOgOW+Y6wJgu80rHpo2/3H07vr8ntR9rkkFIRETewbf5GaYYcakYfiKz89K+sLsuPkQIZaXDMjUObZwWg==}
     dev: true
 
+  /dexie@4.0.1-beta.14:
+    resolution: {integrity: sha512-1Glgs4nyHUriknstBku1T0Qz9qxJbHQy49JFeDEacHQK+XljN/sn1zyIH/HwouQ7a+WAdWHInm51i0GqWOAyHg==}
+    dev: true
+
   /didyoumean@1.2.2:
     resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
     dev: true
@@ -971,6 +1018,10 @@ packages:
       function-bind: 1.1.2
     dev: true
 
+  /immutable@4.3.5:
+    resolution: {integrity: sha512-8eabxkth9gZatlwl5TBuJnCsoTADlL6ftEr7A4qgdaTsPyreilDSnUk57SO+jfKcNtxPa22U5KK6DSeAYhpBJw==}
+    dev: true
+
   /import-fresh@3.3.0:
     resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==}
     engines: {node: '>=6'}
@@ -1305,6 +1356,10 @@ packages:
       source-map-js: 1.0.2
     dev: true
 
+  /pubsub-js@1.9.4:
+    resolution: {integrity: sha512-hJYpaDvPH4w8ZX/0Fdf9ma1AwRgU353GfbaVfPjfJQf1KxZ2iHaHl3fAUw1qlJIR5dr4F3RzjGaWohYUEyoh7A==}
+    dev: true
+
   /queue-microtask@1.2.3:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
     dev: true
@@ -1390,6 +1445,16 @@ packages:
       rimraf: 2.7.1
     dev: true
 
+  /sass@1.72.0:
+    resolution: {integrity: sha512-Gpczt3WA56Ly0Mn8Sl21Vj94s1axi9hDIzDFn9Ph9x3C3p4nNyvsqJoQyVXKou6cBlfFWEgRW4rT8Tb4i3XnVA==}
+    engines: {node: '>=14.0.0'}
+    hasBin: true
+    dependencies:
+      chokidar: 3.5.3
+      immutable: 4.3.5
+      source-map-js: 1.0.2
+    dev: true
+
   /set-cookie-parser@2.6.0:
     resolution: {integrity: sha512-RVnVQxTXuerk653XfuliOxBP81Sf0+qfQE73LIYKcyMYHG94AuH0kgrQpRDuTZnSmjpysHmzxJXKNfa6PjFhyQ==}
     dev: true
@@ -1443,7 +1508,7 @@ packages:
     engines: {node: '>= 0.4'}
     dev: true
 
-  /svelte-check@3.6.2(postcss@8.4.32)(svelte@4.2.8):
+  /svelte-check@3.6.2(postcss@8.4.32)(sass@1.72.0)(svelte@4.2.8):
     resolution: {integrity: sha512-E6iFh4aUCGJLRz6QZXH3gcN/VFfkzwtruWSRmlKrLWQTiO6VzLsivR6q02WYLGNAGecV3EocqZuCDrC2uttZ0g==}
     hasBin: true
     peerDependencies:
@@ -1456,7 +1521,7 @@ packages:
       picocolors: 1.0.0
       sade: 1.8.1
       svelte: 4.2.8
-      svelte-preprocess: 5.1.3(postcss@8.4.32)(svelte@4.2.8)(typescript@5.3.3)
+      svelte-preprocess: 5.1.3(postcss@8.4.32)(sass@1.72.0)(svelte@4.2.8)(typescript@5.3.3)
       typescript: 5.3.3
     transitivePeerDependencies:
       - '@babel/core'
@@ -1496,7 +1561,7 @@ packages:
       tiny-glob: 0.2.9
     dev: false
 
-  /svelte-preprocess@5.1.3(postcss@8.4.32)(svelte@4.2.8)(typescript@5.3.3):
+  /svelte-preprocess@5.1.3(postcss@8.4.32)(sass@1.72.0)(svelte@4.2.8)(typescript@5.3.3):
     resolution: {integrity: sha512-xxAkmxGHT+J/GourS5mVJeOXZzne1FR5ljeOUAMXUkfEhkLEllRreXpbl3dIYJlcJRfL1LO1uIAPpBpBfiqGPw==}
     engines: {node: '>= 16.0.0', pnpm: ^8.0.0}
     requiresBuild: true
@@ -1538,6 +1603,7 @@ packages:
       detect-indent: 6.1.0
       magic-string: 0.30.5
       postcss: 8.4.32
+      sass: 1.72.0
       sorcery: 0.11.0
       strip-indent: 3.0.0
       svelte: 4.2.8
@@ -1652,6 +1718,10 @@ packages:
     hasBin: true
     dev: true
 
+  /undici-types@5.26.5:
+    resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
+    dev: true
+
   /update-browserslist-db@1.0.13(browserslist@4.22.2):
     resolution: {integrity: sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==}
     hasBin: true
@@ -1667,7 +1737,12 @@ packages:
     resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
     dev: true
 
-  /vite@5.0.10:
+  /uuid@9.0.1:
+    resolution: {integrity: sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA==}
+    hasBin: true
+    dev: true
+
+  /vite@5.0.10(@types/node@20.11.28)(sass@1.72.0):
     resolution: {integrity: sha512-2P8J7WWgmc355HUMlFrwofacvr98DAjoE52BfdbwQtyLH06XKwaL/FMnmKM2crF0iX4MpmMKoDlNCB1ok7zHCw==}
     engines: {node: ^18.0.0 || >=20.0.0}
     hasBin: true
@@ -1695,9 +1770,11 @@ packages:
       terser:
         optional: true
     dependencies:
+      '@types/node': 20.11.28
       esbuild: 0.19.10
       postcss: 8.4.32
       rollup: 4.9.1
+      sass: 1.72.0
     optionalDependencies:
       fsevents: 2.3.3
     dev: true
@@ -1710,7 +1787,7 @@ packages:
       vite:
         optional: true
     dependencies:
-      vite: 5.0.10
+      vite: 5.0.10(@types/node@20.11.28)(sass@1.72.0)
     dev: true
 
   /wrappy@1.0.2:

svelte/src/app.css

@@ -1,3 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;

svelte/src/app.sass

@@ -0,0 +1,3 @@
+@tailwind base
+@tailwind components
+@tailwind utilities

svelte/src/lib/db.ts

@@ -0,0 +1,53 @@
+import Dexie, { type Table } from 'dexie';
+export interface User {
+  uuid: string;
+  name: string;
+  ctime: number;
+  mtime: number;
+}
+
+export interface Score {
+  uuid: string;
+  score: number;
+  link?: string;
+  ctime: number;
+  mtime: number;
+}
+
+export class ScoreDB extends Dexie {
+  user!: Table<User>;
+  scoreboard!: Table<Score>;
+
+  constructor() {
+    super('scores');
+    this.version(1).stores({
+      user: 'uuid, name, ctime, mtime',
+      scoreboard: 'uuid, score, link, ctime, mtime',
+    });
+  }
+}
+
+export const db = new ScoreDB();
+
+export function getUser() {
+  return db.user.toArray().then((d) => (d.length > 0 ? d[0] : null));
+}
+
+export function getScore(uuid: string) {
+  return db.scoreboard
+    .where('uuid')
+    .equals(uuid)
+    .toArray()
+    .then((d) => (d.length > 0 ? d[0] : null));
+}
+
+export function updateScore(
+  uuid: string,
+  value: Partial<Omit<Score, 'ctime' | 'mtime' | 'uuid'>>
+) {
+  return db.scoreboard.where('uuid').equals(uuid).modify({
+    link: value.link,
+    score: value.score,
+    mtime: Date.now(),
+  });
+}

svelte/src/lib/icons/info.svelte

@@ -0,0 +1,15 @@
+<script>
+  export let width = 34;
+  export let height = 34;
+</script>
+
+<svg
+  viewBox="0 0 1024 1024"
+  {height}
+  {width}
+  class="inline-block stroke-current fill-current"
+  ><path
+    stroke-width="2"
+    d="M509.92 795.84c157.904 0 285.92-128.016 285.92-285.92C795.84 352 667.808 224 509.92 224 352 224 224 352 224 509.92c0 157.904 128 285.92 285.92 285.92z m0 48C325.504 843.84 176 694.32 176 509.92 176 325.504 325.504 176 509.92 176c184.416 0 333.92 149.504 333.92 333.92 0 184.416-149.504 333.92-333.92 333.92z m-2.448-400.704h16a16 16 0 0 1 16 16v201.728a16 16 0 0 1-16 16h-16a16 16 0 0 1-16-16V459.136a16 16 0 0 1 16-16z m0-100.176h16a16 16 0 0 1 16 16v23.648a16 16 0 0 1-16 16h-16a16 16 0 0 1-16-16v-23.648a16 16 0 0 1 16-16z"
+  ></path></svg
+>

svelte/src/lib/multi-dim-table/layout.svelte

@@ -0,0 +1,110 @@
+<script lang="ts">
+  import { TableMode, imageWidth, mode } from './store';
+
+  export let extraItems:
+    | undefined
+    | {
+        label: string;
+        onClick?: () => void;
+      }[] = undefined;
+
+  export let sidebarItems: typeof extraItems = undefined;
+
+  let _imageWidth = 180;
+  let _mode = TableMode.View;
+
+  mode.subscribe((v) => {
+    _mode = v;
+  });
+  $: {
+    imageWidth.set(_imageWidth);
+  }
+</script>
+
+<div class="drawer absolute h-full w-full overflow-y-hidden">
+  <input id="my-drawer-3" type="checkbox" class="drawer-toggle" />
+  <div class="drawer-content flex flex-col">
+    <!-- Navbar -->
+    <div class="w-full navbar p-0 bg-base-300 min-h-0">
+      <div class="flex-none">
+        {#if sidebarItems}
+          <label
+            for="my-drawer-3"
+            aria-label="open sidebar"
+            class="btn btn-square btn-ghost"
+          >
+            <svg
+              fill="none"
+              viewBox="0 0 24 24"
+              class="inline-block w-6 h-6 stroke-current"
+              ><path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                d="M4 6h16M4 12h16M4 18h16"
+              ></path>
+            </svg>
+          </label>
+        {/if}
+      </div>
+      <div class="flex-1 px-2 mx-2">
+        <slot name="title" />
+      </div>
+      <div class="flex-none">
+        {#if extraItems}
+          <ul class="menu menu-horizontal items-center">
+            <li>
+              <div>
+                <input
+                  type="range"
+                  min="50"
+                  max="500"
+                  bind:value={_imageWidth}
+                  class="range"
+                />
+              </div>
+            </li>
+
+            <li>
+              <button
+                on:click={() => {
+                  if (_mode === TableMode.Score) {
+                    mode.set(TableMode.View);
+                  } else {
+                    mode.set(TableMode.Score);
+                  }
+                }}
+              >
+                {_mode === TableMode.Score ? 'Score Mode' : 'View Mode'}
+              </button>
+            </li>
+
+            {#each extraItems as item}
+              <li>
+                <button on:click={item.onClick}>
+                  {item.label}
+                </button>
+              </li>
+            {/each}
+          </ul>
+        {/if}
+      </div>
+    </div>
+    <slot />
+  </div>
+  <div class="drawer-side z-50">
+    <label for="my-drawer-3" aria-label="close sidebar" class="drawer-overlay"
+    ></label>
+    {#if sidebarItems}
+      <ul class="menu p-4 w-80 min-h-full bg-base-200">
+        {#each sidebarItems as item}
+          <li>
+            <a on:click={item.onClick}>
+              {item.label}
+            </a>
+          </li>
+        {/each}
+      </ul>
+    {/if}
+  </div>
+</div>

svelte/src/lib/multi-dim-table/models.ts

@@ -0,0 +1,35 @@
+export interface Payload {
+  workflow: Workflow;
+  annotations: Annotation[];
+  result: Axis[];
+}
+
+export interface Workflow {
+  url: string;
+}
+
+export interface Annotation {
+  axis: string;
+  key: string;
+  type: string;
+}
+
+export interface Axis {
+  type: 'axis';
+  value: string;
+  children: AxisValue[];
+}
+
+export type AxisValue = Axis | ImgResult;
+
+export interface ImgResult {
+  type: 'img';
+  uuid: string;
+  src: string;
+}
+
+export interface AxisScore {
+  type: 'axis';
+  score: number;
+  children?: AxisScore[];
+}

svelte/src/lib/multi-dim-table/score.svelte

@@ -0,0 +1,7 @@
+<script lang="ts">
+  export let score: number;
+</script>
+
+<span class="text-accent">
+  ({score})
+</span>

svelte/src/lib/multi-dim-table/store.ts

@@ -0,0 +1,19 @@
+import { writable } from 'svelte/store';
+import PubSub from 'pubsub-js';
+
+export const imageWidth = writable(50);
+export const comfyUrl = writable('');
+
+export enum TableMode {
+  Score,
+  View,
+}
+export const mode = writable(TableMode.View);
+
+export function createRefetchStatisticPublisher() {
+  return () => PubSub.publish('refetch-statistics');
+}
+
+export function createRefetchStatisticSubscriber(fn: () => void) {
+  return PubSub.subscribe('refetch-statistics', fn);
+}

svelte/src/lib/multi-dim-table/table-axis.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+  import Score from './score.svelte';
+  import type { Axis, AxisScore } from './models';
+  import TableHolder from './table-holder.svelte';
+  import { zip } from './utils';
+  export let axis: Axis;
+  export let score: AxisScore | undefined;
+</script>
+
+<tr class="p-0 even:bg-stone-800 odd:bg-base-100">
+  <!-- prompts -->
+  <th class="z-10 p-0 max-w-44 bg-inherit">
+    {#if score}
+      <Score score={score.score} />
+    {/if}
+    {axis.value}
+  </th>
+  {#if score && score.children}
+    {#each zip(axis.children, score.children) as [dim2, score2]}
+      {#if dim2.type === 'axis' && score2.children}
+        <td class="p-0">
+          {#each zip(dim2.children, score2.children) as [dim3, score3]}
+            <TableHolder value={dim3} score={score3}></TableHolder>
+          {/each}
+        </td>
+      {/if}
+    {/each}
+  {:else}
+    {#each axis.children as dim2}
+      {#if dim2.type === 'axis'}
+        <td class="p-0">
+          {#each dim2.children as dim3}
+            <TableHolder value={dim3} score={undefined}></TableHolder>
+          {/each}
+        </td>
+      {/if}
+    {/each}
+  {/if}
+</tr>

svelte/src/lib/multi-dim-table/table-cell-axis.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">
+  import type { Axis, AxisScore } from './models';
+  import Score from './score.svelte';
+  import TableHolder from './table-holder.svelte';
+  export let value: Axis;
+  export let score: AxisScore | undefined;
+</script>
+
+<div class="border box-border inline-block">
+  <div class="text-center font-bold">
+    {#if score}
+      <Score score={score.score} />
+    {/if}
+    {value.value}
+  </div>
+  <div class="flex justify-around">
+    {#each value.children as item}
+      <TableHolder value={item} {score} />
+    {/each}
+  </div>
+</div>

svelte/src/lib/multi-dim-table/table-cell-img.svelte

@@ -0,0 +1,120 @@
+<script lang="ts">
+  import type { ImgResult } from './models';
+  import { TableMode, comfyUrl, imageWidth, mode } from './store';
+  import { db, getScore, getUser, updateScore, type User } from '$lib/db';
+  export let value: ImgResult;
+  export let width = 100;
+  import { createRefetchStatisticPublisher } from './store';
+  let refetch = createRefetchStatisticPublisher();
+  let api = '';
+  comfyUrl.subscribe((d) => (api = d));
+
+  let like = false;
+  let _mode = TableMode.View;
+  imageWidth.subscribe((d) => {
+    width = d;
+  });
+
+  mode.subscribe((v) => {
+    _mode = v;
+    if (v === TableMode.Score && value.uuid)
+      db.scoreboard
+        .where('uuid')
+        .equals(value.uuid)
+        .toArray()
+        .then((arr) => {
+          if (arr.length > 0 && arr[0].score > 0) {
+            like = true;
+          } else {
+            like = false;
+          }
+        });
+  });
+
+  function updateSelfScore(score: number) {
+    return updateScore(value.uuid, { score });
+  }
+
+  async function onLike() {
+    const { score } = (await getScore(value.uuid)) ?? {};
+    if (score === undefined) {
+      await db.scoreboard.add({
+        uuid: value.uuid,
+        score: 1,
+        link: value.src,
+        ctime: Date.now(),
+        mtime: Date.now(),
+      });
+    } else if (score === 1) {
+      return;
+    } else {
+      await updateSelfScore(1);
+    }
+    return apiUpdateScore(1)
+      .then(async (res) => {
+        if (res && res.ok) {
+          like = true;
+          refetch();
+        } else await updateSelfScore(0);
+      })
+      .catch(() => {
+        updateSelfScore(0);
+      });
+  }
+
+  async function onDislike() {
+    const { score } = (await getScore(value.uuid)) ?? {};
+    if (score === undefined || score === 0) {
+      return;
+    }
+    await updateSelfScore(0);
+    return apiUpdateScore(0)
+      .then(async (res) => {
+        if (res && res.ok) {
+          like = false;
+          refetch();
+        } else await updateSelfScore(1);
+      })
+      .catch(() => {
+        updateSelfScore(1);
+      });
+  }
+
+  async function apiUpdateScore(score: number) {
+    const user = await getUser();
+    if (!user) return;
+    return fetch(api + '/browser/xyz_plot/score', {
+      method: 'PUT',
+      body: JSON.stringify({
+        user: user.name,
+        source: value.uuid,
+        score,
+      }),
+    });
+  }
+</script>
+
+<div class="px-0.5 box-border inline-block relative" style={`width:${width}px`}>
+  <a href={value.src} target="_blank">
+    <img
+      class="w-full"
+      src={value.src}
+      alt={value.uuid}
+      style={`width:${width}px`}
+    />
+  </a>
+  {#if _mode === TableMode.Score}
+    <button
+      class="absolute w-full h-full top-0 left-0 flex justify-end items-end p-1"
+      tabindex="0"
+      on:click={like ? onDislike : onLike}
+    >
+      <svg class="inline-block w-1/4" viewBox="0 0 1024 1024">
+        <path
+          d="M725.333333 192c-89.6 0-168.533333 44.8-213.333333 115.2C467.2 236.8 388.266667 192 298.666667 192 157.866667 192 42.666667 307.2 42.666667 448c0 253.866667 469.333333 512 469.333333 512s469.333333-256 469.333333-512c0-140.8-115.2-256-256-256z"
+          fill={like ? '#F44336' : 'grey'}
+        />
+      </svg>
+    </button>
+  {/if}
+</div>

svelte/src/lib/multi-dim-table/table-holder.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+  import type { AxisScore, AxisValue } from './models';
+  import TableCellAxis from './table-cell-axis.svelte';
+  import TableCellImg from './table-cell-img.svelte';
+
+  export let value: AxisValue;
+  export let score: AxisScore | undefined;
+</script>
+
+{#if value.type === 'img'}
+  <TableCellImg {value} />
+{:else if value.type === 'axis'}
+  <TableCellAxis {value} bind:score />
+{/if}

svelte/src/lib/multi-dim-table/table.svelte

@@ -0,0 +1,71 @@
+<script lang="ts">
+  import { el } from '@faker-js/faker';
+  import type { AxisScore, Payload } from './models';
+  import Score from './score.svelte';
+  import TableAxis from './table-axis.svelte';
+  import { zip } from './utils';
+  export let height: number = 0;
+  export let payload: Payload;
+  export let scores: AxisScore[] | undefined = undefined;
+
+  let headScore: AxisScore[] | undefined = undefined;
+  $: headScore = scores
+    ? scores[0]
+        .children!.map(
+          (d) =>
+            JSON.parse(
+              JSON.stringify({ ...d, children: undefined }),
+            ) as AxisScore,
+        )
+        .map((axis, idx) => ({
+          ...axis,
+          score:
+            scores
+              ?.map((axis) => axis.children![idx].score)
+              .reduce((a, b) => a + b) ?? 0,
+        }))
+    : undefined;
+</script>
+
+<div
+  class="overflow-x-auto max-w-full inline-block"
+  style={`max-height: ${height}px`}
+>
+  <table class="table table-sm table-pin-rows table-pin-cols">
+    <thead>
+      <tr class="p-0">
+        <th></th>
+        {#if headScore}
+          {#each zip(payload.result[0].children, headScore) as [axis, score]}
+            {#if axis.type === 'axis'}
+              <td class="p-0">
+                <p class="max-h-16 text-wrap overflow-auto hover:overflow-y-scroll">
+                  <Score score={score.score} />{axis.value}
+                </p>
+              </td>
+            {/if}
+          {/each}
+        {:else}
+          {#each payload.result[0].children as axis}
+            {#if axis.type === 'axis'}
+              <td class="p-0">
+                <p class="max-h-12 text-wrap overflow-auto hover:overflow-y-scroll">{axis.value}</p>
+              </td>
+            {/if}
+          {/each}
+        {/if}
+      </tr>
+    </thead>
+    <tbody>
+      {#if scores}
+        {#each zip(payload.result, scores) as [axis, score]}
+          <TableAxis {axis} {score} />
+        {/each}
+      {:else}
+        {#each payload.result as axis}
+          <TableAxis {axis} score={undefined} />
+        {/each}
+      {/if}
+    </tbody>
+  </table>
+</div>

svelte/src/lib/multi-dim-table/utils.ts

@@ -0,0 +1,3 @@
+export function zip<T = unknown, U = unknown>(arr1: T[], arr2: U[]): [T, U][] {
+  return Array.from({ length: arr1.length }).map((_, i) => [arr1[i], arr2[i]]);
+}

svelte/src/lib/random.ts

@@ -0,0 +1,7 @@
+import { faker } from '@faker-js/faker';
+
+export function fakeUsername() {
+  const now = Date.now();
+  const suf = now.toString(32);
+  return `${faker.person.lastName()}_${suf}`;
+}

svelte/src/routes/+layout.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import "../app.css";
+  import '../app.sass';
 </script>
 
 <slot />

svelte/src/routes/CollectionsTab.svelte

@@ -311,6 +311,14 @@
   {/each}
 </ul>
 
+<div class="flex justify-center">
+  {#if files.length > showCursor}
+    <button on:click={() => showCursor += 10} class="btn btn-neutral btn-outline">Load more</button>
+  {:else}
+    <p class="text-neutral-content">No more content.</p>
+  {/if}
+</div>
+
 {#if files.length === 0}
   <div class="w-full h-full flex items-center justify-center">
     <span class="font-bold text-4xl">

svelte/src/routes/FilesList.svelte

@@ -184,6 +184,14 @@
   {/each}
 </div>
 
+<div class="flex justify-center">
+  {#if files.length > showCursor}
+    <button on:click={() => showCursor += 10} class="btn btn-neutral btn-outline">Load more</button>
+  {:else}
+    <p class="text-neutral-content">No more content.</p>
+  {/if}
+</div>
+
 {#if files.length === 0}
   <div class="w-full h-full flex items-center justify-center">
     <span class="font-bold text-4xl">

svelte/src/routes/xyz_plot/+layout.ts

@@ -0,0 +1,14 @@
+import { waitLocale } from 'svelte-i18n';
+
+/** @type {import('./$types').PageLoad} */
+export async function load({ url }) {
+  await waitLocale();
+
+  if (typeof process === 'undefined') {
+    const path = url.searchParams.get('path');
+    return {
+      path,
+    };
+  }
+  return {};
+}

svelte/src/routes/xyz_plot/+page.svelte

@@ -0,0 +1,119 @@
+<script>
+  import { onMount } from 'svelte';
+  import MultiDimTableLayout from '$lib/multi-dim-table/layout.svelte';
+  import AnalyzeTable from '$lib/multi-dim-table/table.svelte';
+  import {
+    comfyUrl,
+    createRefetchStatisticPublisher,
+  } from '$lib/multi-dim-table/store';
+  import InfoIcon from '$lib/icons/info.svelte';
+  import { db, getUser } from '$lib/db';
+  import { v1 as uuid } from 'uuid';
+  import { fakeUsername } from '$lib/random';
+  import { createRefetchStatisticSubscriber } from '$lib/multi-dim-table/store';
+
+  /** @type {import('./$types').PageData} */
+  export let data;
+
+  /** @type {string | null} */
+  export let path;
+
+  /** @type {import('$lib/multi-dim-table/models').AxisScore[]} */
+  let scores;
+
+  $: ({ path } = data);
+  $: comfyUrl.set(data.comfyUrl);
+
+  let mounted = false;
+
+  /** @type {import("$lib/multi-dim-table/models").Payload}*/
+  let payload;
+  let loading = false;
+
+  /**@type {HTMLElement | undefined}*/
+  let tableContainerRef;
+
+  createRefetchStatisticSubscriber(() => {
+    fetch(data.comfyUrl + '/browser/xyz_plot/statistic?path=' + data.path)
+      .then(async (d) => {
+        if (d.ok) {
+          scores = await d.json().then((d) => d.result);
+        }
+      })
+      .catch(() => {});
+  });
+  const refetch = createRefetchStatisticPublisher();
+
+  $: {
+    if (mounted && path) {
+      loading = true;
+      fetch(path)
+        .then((d) => d.json())
+        .then((d) => (payload = d))
+        .finally(() => {
+          loading = false;
+        });
+    }
+  }
+
+  $: {
+    if (mounted && path) {
+      refetch();
+    }
+  }
+
+  onMount(async () => {
+    mounted = true;
+    const user = await getUser();
+    if (!user) {
+      db.user.add({
+        uuid: uuid(),
+        name: fakeUsername(),
+        ctime: Date.now(),
+        mtime: Date.now(),
+      });
+    }
+  });
+</script>
+
+{#if typeof data.path === 'string' && data.path.length > 0}
+  {#if loading}
+    <div class="flex flex-col w-screen h-screen justify-center items-center">
+      <span class="loading loading-dots loading-lg"></span>
+    </div>
+  {:else if !payload}
+    null
+  {:else}
+    <MultiDimTableLayout
+      extraItems={[
+        {
+          label: 'Open Workflow',
+          onClick: () => {
+            open(payload.workflow.url);
+          },
+        },
+      ]}
+    >
+      <div slot="title">
+        XYZ Plot
+        <div
+          class="tooltip before:pl-20 before:text-left before:max-w-96 tooltip-bottom z-40 before:whitespace-pre-wrap"
+          data-tip={payload.annotations
+            .map((d) => `${d.axis}: ${d.key} - ${d.type}`)
+            .join('\n')}
+        >
+          <InfoIcon />
+        </div>
+      </div>
+      <div class="w-full h-full" bind:this={tableContainerRef}>
+        <AnalyzeTable
+          bind:payload
+          bind:scores
+          height={tableContainerRef?.clientHeight ?? 0}
+        />
+      </div>
+    </MultiDimTableLayout>
+  {/if}
+{:else}
+  Invalid Path
+{/if}

utils.py

@@ -1,27 +1,22 @@
+import functools
 import json
-from os import path, scandir, mkdir
+from os import path, scandir, makedirs
 import subprocess
 import time
 from typing import TypedDict, List
+import requests
+from requests.adapters import HTTPAdapter, Retry
 
 import folder_paths
 from comfy.cli_args import args
 
 SERVER_BASE_URL = f'http://{args.listen}:{args.port}'
+# To support IPv6
+if ':' in args.listen:
+    SERVER_BASE_URL = f'http://[{args.listen}]:{args.port}'
 
 browser_path = path.dirname(__file__)
-collections_path = path.join(browser_path, 'collections')
 config_path = path.join(browser_path, 'config.json')
-sources_path = path.join(browser_path, 'sources')
-download_logs_path = path.join(browser_path, 'download_logs')
-outputs_path = folder_paths.get_output_directory()
-if args.output_directory:
-    outputs_path = path.abspath(args.output_directory)
-
-for dir in [collections_path, sources_path, download_logs_path, outputs_path]:
-    if not path.exists(dir):
-        mkdir(dir)
-
 
 image_extensions = ['.jpg', '.jpeg', '.png', '.gif', '.webp']
 video_extensions = ['.mp4', '.mov', '.avi', '.webm', '.mkv']
@@ -31,6 +26,48 @@ info_file_suffix = '.info'
 
 git_remote_name = 'origin'
 
+def http_client():
+    adapter = HTTPAdapter(max_retries=Retry(3, backoff_factor=0.1))
+    http = requests.session()
+    http.mount('http://', adapter)
+    http.mount('https://', adapter)
+
+    return http
+
+
+@functools.cache
+def get_config():
+    return {
+        "collections": path.join(browser_path, 'collections'),
+        "download_logs": path.join(browser_path, 'download_logs'),
+        "outputs": output_directory_from_comfyui(),
+        "sources": path.join(browser_path, 'sources'),
+    } | load_config()
+
+def load_config():
+    if not path.exists(config_path):
+        return {}
+    else:
+        with open(config_path, 'r') as f:
+            return json.load(f)
+
+@functools.cache
+def collections_path():
+    return get_config()['collections']
+
+@functools.cache
+def download_logs_path():
+    return get_config()['download_logs']
+
+@functools.cache
+def outputs_path():
+    return get_config()['outputs']
+
+@functools.cache
+def sources_path():
+    return get_config()['sources']
+
+
 class FileInfoDict(TypedDict):
     type: str
     name: str
@@ -67,12 +104,12 @@ def run_cmd(cmd, run_path, log_cmd=True, log_code=True, log_message=True):
 # folder_type = 'outputs', 'collections', 'sources'
 def get_parent_path(folder_type: str):
     if folder_type == 'collections':
-        return collections_path
+        return collections_path()
     if folder_type == 'sources':
-        return sources_path
+        return sources_path()
 
     # outputs
-    return outputs_path
+    return outputs_path()
 
 # folder_type = 'outputs', 'collections', 'sources'
 def get_target_folder_files(folder_path: str, folder_type: str = 'outputs'):
@@ -135,29 +172,36 @@ def add_uuid_to_filename(filename):
     name, ext = path.splitext(filename)
     return f'{name}_{int(time.time())}{ext}'
 
-def get_config():
-    if not path.exists(config_path):
-        return {}
+def output_directory_from_comfyui():
+   if args.output_directory:
+       return path.abspath(args.output_directory)
+   else:
+       return folder_paths.get_output_directory()
 
-    with open(config_path, 'r') as f:
-        return json.load(f)
+def git_init():
+    if not path.exists(path.join(collections_path(), '.git')):
+        run_cmd('git init', collections_path())
 
-def git_init(run_path = collections_path):
-    if not path.exists(path.join(run_path, '.git')):
-        run_cmd('git init', collections_path)
-
-    ret = run_cmd('git config user.name', collections_path,
+    ret = run_cmd('git config user.name', collections_path(),
                   log_cmd=False, log_code=False, log_message=False)
     if len(ret.stdout) == 0:
-        ret = run_cmd('whoami', collections_path,
+        ret = run_cmd('whoami', collections_path(),
                       log_cmd=False, log_code=False, log_message=False)
         username = ret.stdout.rstrip("\n")
-        run_cmd(f'git config user.name "{username}"', collections_path)
+        run_cmd(f'git config user.name "{username}"', collections_path())
 
-    ret = run_cmd('git config user.email', collections_path,
+    ret = run_cmd('git config user.email', collections_path(),
                   log_cmd=False, log_code=False, log_message=False)
     if len(ret.stdout) == 0:
-        ret = run_cmd('hostname', collections_path,
+        ret = run_cmd('hostname', collections_path(),
                       log_cmd=False, log_code=False, log_message=False)
         hostname = ret.stdout.rstrip("\n")
-        run_cmd(f'git config user.email "{hostname}"', collections_path)
+        run_cmd(f'git config user.email "{hostname}"', collections_path())
+
+for dir in [
+    collections_path(),
+    sources_path(),
+    download_logs_path(),
+    outputs_path(),
+]:
+    makedirs(dir, exist_ok=True)

web/build/_app/immutable/chunks/_commonjsHelpers.Cpj98o6Y.js

@@ -0,0 +1 @@
+var o=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{};function l(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}export{o as c,l as g};

web/build/_app/immutable/chunks/each.-gASlQSi.js

@@ -0,0 +1 @@
+function e(n){return n?.length!==void 0?n:Array.from(n)}export{e};

web/build/_app/immutable/chunks/index.BlOrB6Vx.js

@@ -1 +1 @@
-import{n as f,k as w,r as m,s as q,l as x}from"./scheduler.3IkOjBO1.js";const a=[];function z(e,i){return{subscribe:A(e,i).subscribe}}function A(e,i=f){let r;const n=new Set;function u(t){if(q(e,t)&&(e=t,r)){const o=!a.length;for(const s of n)s[1](),a.push(s,e);if(o){for(let s=0;s<a.length;s+=2)a[s][0](a[s+1]);a.length=0}}}function l(t){u(t(e))}function b(t,o=f){const s=[t,o];return n.add(s),n.size===1&&(r=i(u,l)||f),t(e),()=>{n.delete(s),n.size===0&&r&&(r(),r=null)}}return{set:u,update:l,subscribe:b}}function B(e,i,r){const n=!Array.isArray(e),u=n?[e]:e;if(!u.every(Boolean))throw new Error("derived() expects stores as input, got a falsy value");const l=i.length<2;return z(r,(b,t)=>{let o=!1;const s=[];let d=0,p=f;const h=()=>{if(d)return;p();const c=i(n?s[0]:s,b,t);l?b(c):p=x(c)?c:f},y=u.map((c,g)=>w(c,_=>{s[g]=_,d&=~(1<<g),o&&h()},()=>{d|=1<<g}));return o=!0,h(),function(){m(y),p(),o=!1}})}export{B as d,A as w};
+import{n as f,l as w,r as m,s as q,k as x}from"./scheduler.DD_VFgMU.js";const a=[];function z(e,i){return{subscribe:A(e,i).subscribe}}function A(e,i=f){let r;const n=new Set;function u(t){if(q(e,t)&&(e=t,r)){const o=!a.length;for(const s of n)s[1](),a.push(s,e);if(o){for(let s=0;s<a.length;s+=2)a[s][0](a[s+1]);a.length=0}}}function l(t){u(t(e))}function b(t,o=f){const s=[t,o];return n.add(s),n.size===1&&(r=i(u,l)||f),t(e),()=>{n.delete(s),n.size===0&&r&&(r(),r=null)}}return{set:u,update:l,subscribe:b}}function B(e,i,r){const n=!Array.isArray(e),u=n?[e]:e;if(!u.every(Boolean))throw new Error("derived() expects stores as input, got a falsy value");const l=i.length<2;return z(r,(b,t)=>{let o=!1;const s=[];let d=0,p=f;const h=()=>{if(d)return;p();const c=i(n?s[0]:s,b,t);l?b(c):p=x(c)?c:f},y=u.map((c,g)=>w(c,_=>{s[g]=_,d&=~(1<<g),o&&h()},()=>{d|=1<<g}));return o=!0,h(),function(){m(y),p(),o=!1}})}export{B as d,A as w};

web/build/_app/immutable/chunks/preload-helper.0HuHagjb.js

@@ -1 +0,0 @@
-const d="modulepreload",m=function(a,l){return new URL(a,l).href},f={},E=function(l,i,c){let u=Promise.resolve();if(i&&i.length>0){const n=document.getElementsByTagName("link");u=Promise.all(i.map(e=>{if(e=m(e,c),e in f)return;f[e]=!0;const r=e.endsWith(".css"),h=r?'[rel="stylesheet"]':"";if(!!c)for(let s=n.length-1;s>=0;s--){const o=n[s];if(o.href===e&&(!r||o.rel==="stylesheet"))return}else if(document.querySelector(`link[href="${e}"]${h}`))return;const t=document.createElement("link");if(t.rel=r?"stylesheet":d,r||(t.as="script",t.crossOrigin=""),t.href=e,document.head.appendChild(t),r)return new Promise((s,o)=>{t.addEventListener("load",s),t.addEventListener("error",()=>o(new Error(`Unable to preload CSS for ${e}`)))})}))}return u.then(()=>l()).catch(n=>{const e=new Event("vite:preloadError",{cancelable:!0});if(e.payload=n,window.dispatchEvent(e),!e.defaultPrevented)throw n})};export{E as _};

web/build/_app/immutable/chunks/preload-helper.Dch09mLN.js

@@ -0,0 +1 @@
+const v="modulepreload",y=function(a,i){return new URL(a,i).href},d={},p=function(i,l,u){let f=Promise.resolve();if(l&&l.length>0){const r=document.getElementsByTagName("link"),n=document.querySelector("meta[property=csp-nonce]"),h=n?.nonce||n?.getAttribute("nonce");f=Promise.all(l.map(e=>{if(e=y(e,u),e in d)return;d[e]=!0;const s=e.endsWith(".css"),m=s?'[rel="stylesheet"]':"";if(!!u)for(let o=r.length-1;o>=0;o--){const c=r[o];if(c.href===e&&(!s||c.rel==="stylesheet"))return}else if(document.querySelector(`link[href="${e}"]${m}`))return;const t=document.createElement("link");if(t.rel=s?"stylesheet":v,s||(t.as="script",t.crossOrigin=""),t.href=e,h&&t.setAttribute("nonce",h),document.head.appendChild(t),s)return new Promise((o,c)=>{t.addEventListener("load",o),t.addEventListener("error",()=>c(new Error(`Unable to preload CSS for ${e}`)))})}))}return f.then(()=>i()).catch(r=>{const n=new Event("vite:preloadError",{cancelable:!0});if(n.payload=r,window.dispatchEvent(n),!n.defaultPrevented)throw r})};export{p as _};

web/build/_app/immutable/chunks/scheduler.DD_VFgMU.js

@@ -1 +1 @@
-function x(){}function w(t,n){for(const e in n)t[e]=n[e];return t}function j(t){return t()}function A(){return Object.create(null)}function E(t){t.forEach(j)}function D(t){return typeof t=="function"}function F(t,n){return t!=t?n==n:t!==n||t&&typeof t=="object"||typeof t=="function"}let i;function P(t,n){return t===n?!0:(i||(i=document.createElement("a")),i.href=n,t===i.href)}function S(t){return Object.keys(t).length===0}function q(t,...n){if(t==null){for(const r of n)r(void 0);return x}const e=t.subscribe(...n);return e.unsubscribe?()=>e.unsubscribe():e}function U(t,n,e){t.$$.on_destroy.push(q(n,e))}function B(t,n,e,r){if(t){const o=m(t,n,e,r);return t[0](o)}}function m(t,n,e,r){return t[1]&&r?w(e.ctx.slice(),t[1](r(n))):e.ctx}function C(t,n,e,r){if(t[2]&&r){const o=t[2](r(e));if(n.dirty===void 0)return o;if(typeof o=="object"){const l=[],_=Math.max(n.dirty.length,o.length);for(let s=0;s<_;s+=1)l[s]=n.dirty[s]|o[s];return l}return n.dirty|o}return n.dirty}function G(t,n,e,r,o,l){if(o){const _=m(n,e,r,l);t.p(_,o)}}function H(t){if(t.ctx.length>32){const n=[],e=t.ctx.length/32;for(let r=0;r<e;r++)n[r]=-1;return n}return-1}let f;function h(t){f=t}function g(){if(!f)throw new Error("Function called outside component initialization");return f}function I(t){g().$$.on_mount.push(t)}function J(t){g().$$.after_update.push(t)}function K(t){g().$$.on_destroy.push(t)}const a=[],y=[];let u=[];const p=[],k=Promise.resolve();let b=!1;function v(){b||(b=!0,k.then(z))}function L(){return v(),k}function O(t){u.push(t)}function N(t){p.push(t)}const d=new Set;let c=0;function z(){if(c!==0)return;const t=f;do{try{for(;c<a.length;){const n=a[c];c++,h(n),M(n.$$)}}catch(n){throw a.length=0,c=0,n}for(h(null),a.length=0,c=0;y.length;)y.pop()();for(let n=0;n<u.length;n+=1){const e=u[n];d.has(e)||(d.add(e),e())}u.length=0}while(a.length);for(;p.length;)p.pop()();b=!1,d.clear(),h(t)}function M(t){if(t.fragment!==null){t.update(),E(t.before_update);const n=t.dirty;t.dirty=[-1],t.fragment&&t.fragment.p(t.ctx,n),t.after_update.forEach(O)}}function Q(t){const n=[],e=[];u.forEach(r=>t.indexOf(r)===-1?n.push(r):e.push(r)),e.forEach(r=>r()),u=n}export{v as A,J as a,y as b,B as c,C as d,U as e,P as f,H as g,N as h,K as i,O as j,q as k,D as l,A as m,x as n,I as o,z as p,S as q,E as r,F as s,L as t,G as u,Q as v,f as w,h as x,j as y,a as z};
+function x(){}function w(t,n){for(const e in n)t[e]=n[e];return t}function j(t){return t()}function A(){return Object.create(null)}function E(t){t.forEach(j)}function D(t){return typeof t=="function"}function F(t,n){return t!=t?n==n:t!==n||t&&typeof t=="object"||typeof t=="function"}let i;function P(t,n){return t===n?!0:(i||(i=document.createElement("a")),i.href=n,t===i.href)}function S(t){return Object.keys(t).length===0}function q(t,...n){if(t==null){for(const r of n)r(void 0);return x}const e=t.subscribe(...n);return e.unsubscribe?()=>e.unsubscribe():e}function U(t,n,e){t.$$.on_destroy.push(q(n,e))}function B(t,n,e,r){if(t){const o=m(t,n,e,r);return t[0](o)}}function m(t,n,e,r){return t[1]&&r?w(e.ctx.slice(),t[1](r(n))):e.ctx}function C(t,n,e,r){if(t[2]&&r){const o=t[2](r(e));if(n.dirty===void 0)return o;if(typeof o=="object"){const l=[],_=Math.max(n.dirty.length,o.length);for(let s=0;s<_;s+=1)l[s]=n.dirty[s]|o[s];return l}return n.dirty|o}return n.dirty}function G(t,n,e,r,o,l){if(o){const _=m(n,e,r,l);t.p(_,o)}}function H(t){if(t.ctx.length>32){const n=[],e=t.ctx.length/32;for(let r=0;r<e;r++)n[r]=-1;return n}return-1}let f;function h(t){f=t}function g(){if(!f)throw new Error("Function called outside component initialization");return f}function I(t){g().$$.on_mount.push(t)}function J(t){g().$$.after_update.push(t)}function K(t){g().$$.on_destroy.push(t)}const a=[],y=[];let u=[];const p=[],k=Promise.resolve();let b=!1;function v(){b||(b=!0,k.then(z))}function L(){return v(),k}function O(t){u.push(t)}function N(t){p.push(t)}const d=new Set;let c=0;function z(){if(c!==0)return;const t=f;do{try{for(;c<a.length;){const n=a[c];c++,h(n),M(n.$$)}}catch(n){throw a.length=0,c=0,n}for(h(null),a.length=0,c=0;y.length;)y.pop()();for(let n=0;n<u.length;n+=1){const e=u[n];d.has(e)||(d.add(e),e())}u.length=0}while(a.length);for(;p.length;)p.pop()();b=!1,d.clear(),h(t)}function M(t){if(t.fragment!==null){t.update(),E(t.before_update);const n=t.dirty;t.dirty=[-1],t.fragment&&t.fragment.p(t.ctx,n),t.after_update.forEach(O)}}function Q(t){const n=[],e=[];u.forEach(r=>t.indexOf(r)===-1?n.push(r):e.push(r)),e.forEach(r=>r()),u=n}export{v as A,J as a,y as b,B as c,C as d,U as e,P as f,H as g,N as h,K as i,O as j,D as k,q as l,A as m,x as n,I as o,z as p,S as q,E as r,F as s,L as t,G as u,Q as v,f as w,h as x,j as y,a as z};

web/build/_app/immutable/chunks/singletons.Bc_UULDX.js

@@ -1 +1 @@
-import{w as u}from"./index.KGH7dGZH.js";const b=globalThis.__sveltekit_vb5m50?.base??"",v=globalThis.__sveltekit_vb5m50?.assets??b,k="1705164974856",R="sveltekit:snapshot",T="sveltekit:scroll",w="sveltekit:states",I="sveltekit:pageurl",S="sveltekit:history",y="sveltekit:navigation",f={tap:1,hover:2,viewport:3,eager:4,off:-1,false:-1},_=location.origin;function N(e){if(e instanceof URL)return e;let t=document.baseURI;if(!t){const n=document.getElementsByTagName("base");t=n.length?n[0].href:document.URL}return new URL(e,t)}function U(){return{x:pageXOffset,y:pageYOffset}}function c(e,t){return e.getAttribute(`data-sveltekit-${t}`)}const d={...f,"":f.hover};function g(e){let t=e.assignedSlot??e.parentNode;return t?.nodeType===11&&(t=t.host),t}function L(e,t){for(;e&&e!==t;){if(e.nodeName.toUpperCase()==="A"&&e.hasAttribute("href"))return e;e=g(e)}}function O(e,t){let n;try{n=new URL(e instanceof SVGAElement?e.href.baseVal:e.href,document.baseURI)}catch{}const a=e instanceof SVGAElement?e.target.baseVal:e.target,r=!n||!!a||E(n,t)||(e.getAttribute("rel")||"").split(/\s+/).includes("external"),l=n?.origin===_&&e.hasAttribute("download");return{url:n,external:r,target:a,download:l}}function Y(e){let t=null,n=null,a=null,r=null,l=null,o=null,s=e;for(;s&&s!==document.documentElement;)a===null&&(a=c(s,"preload-code")),r===null&&(r=c(s,"preload-data")),t===null&&(t=c(s,"keepfocus")),n===null&&(n=c(s,"noscroll")),l===null&&(l=c(s,"reload")),o===null&&(o=c(s,"replacestate")),s=g(s);function i(h){switch(h){case"":case"true":return!0;case"off":case"false":return!1;default:return}}return{preload_code:d[a??"off"],preload_data:d[r??"off"],keepfocus:i(t),noscroll:i(n),reload:i(l),replace_state:i(o)}}function p(e){const t=u(e);let n=!0;function a(){n=!0,t.update(o=>o)}function r(o){n=!1,t.set(o)}function l(o){let s;return t.subscribe(i=>{(s===void 0||n&&i!==s)&&o(s=i)})}return{notify:a,set:r,subscribe:l}}function m(){const{set:e,subscribe:t}=u(!1);let n;async function a(){clearTimeout(n);try{const r=await fetch(`${v}/_app/version.json`,{headers:{pragma:"no-cache","cache-control":"no-cache"}});if(!r.ok)return!1;const o=(await r.json()).version!==k;return o&&(e(!0),clearTimeout(n)),o}catch{return!1}}return{subscribe:t,check:a}}function E(e,t){return e.origin!==_||!e.pathname.startsWith(t)}function x(e){e.client}const P={url:p({}),page:p({}),navigating:u(null),updated:m()};export{S as H,y as N,I as P,T as S,w as a,R as b,Y as c,P as d,b as e,L as f,O as g,f as h,E as i,x as j,_ as o,N as r,U as s};
+import{w as u}from"./index.BlOrB6Vx.js";const b=globalThis.__sveltekit_sim1g4?.base??"",v=globalThis.__sveltekit_sim1g4?.assets??b,k="1714203421307",R="sveltekit:snapshot",T="sveltekit:scroll",w="sveltekit:states",I="sveltekit:pageurl",S="sveltekit:history",y="sveltekit:navigation",f={tap:1,hover:2,viewport:3,eager:4,off:-1,false:-1},_=location.origin;function N(e){if(e instanceof URL)return e;let t=document.baseURI;if(!t){const n=document.getElementsByTagName("base");t=n.length?n[0].href:document.URL}return new URL(e,t)}function U(){return{x:pageXOffset,y:pageYOffset}}function c(e,t){return e.getAttribute(`data-sveltekit-${t}`)}const d={...f,"":f.hover};function g(e){let t=e.assignedSlot??e.parentNode;return t?.nodeType===11&&(t=t.host),t}function L(e,t){for(;e&&e!==t;){if(e.nodeName.toUpperCase()==="A"&&e.hasAttribute("href"))return e;e=g(e)}}function O(e,t){let n;try{n=new URL(e instanceof SVGAElement?e.href.baseVal:e.href,document.baseURI)}catch{}const a=e instanceof SVGAElement?e.target.baseVal:e.target,r=!n||!!a||E(n,t)||(e.getAttribute("rel")||"").split(/\s+/).includes("external"),l=n?.origin===_&&e.hasAttribute("download");return{url:n,external:r,target:a,download:l}}function Y(e){let t=null,n=null,a=null,r=null,l=null,o=null,s=e;for(;s&&s!==document.documentElement;)a===null&&(a=c(s,"preload-code")),r===null&&(r=c(s,"preload-data")),t===null&&(t=c(s,"keepfocus")),n===null&&(n=c(s,"noscroll")),l===null&&(l=c(s,"reload")),o===null&&(o=c(s,"replacestate")),s=g(s);function i(h){switch(h){case"":case"true":return!0;case"off":case"false":return!1;default:return}}return{preload_code:d[a??"off"],preload_data:d[r??"off"],keepfocus:i(t),noscroll:i(n),reload:i(l),replace_state:i(o)}}function p(e){const t=u(e);let n=!0;function a(){n=!0,t.update(o=>o)}function r(o){n=!1,t.set(o)}function l(o){let s;return t.subscribe(i=>{(s===void 0||n&&i!==s)&&o(s=i)})}return{notify:a,set:r,subscribe:l}}function m(){const{set:e,subscribe:t}=u(!1);let n;async function a(){clearTimeout(n);try{const r=await fetch(`${v}/_app/version.json`,{headers:{pragma:"no-cache","cache-control":"no-cache"}});if(!r.ok)return!1;const o=(await r.json()).version!==k;return o&&(e(!0),clearTimeout(n)),o}catch{return!1}}return{subscribe:t,check:a}}function E(e,t){return e.origin!==_||!e.pathname.startsWith(t)}function x(e){e.client}const P={url:p({}),page:p({}),navigating:u(null),updated:m()};export{S as H,y as N,I as P,T as S,w as a,R as b,Y as c,P as d,b as e,L as f,O as g,f as h,E as i,x as j,_ as o,N as r,U as s};

web/build/_app/immutable/entry/app.bKNUjLue.js

@@ -1,7 +0,0 @@
-import{_ as I}from"../chunks/preload-helper.0HuHagjb.js";import{s as S,a as j,o as C,t as M,b as P}from"../chunks/scheduler.3IkOjBO1.js";import{S as U,i as z,s as B,e as p,c as F,a as w,t as d,b as N,d as h,f as g,g as G,h as H,j as J,k as R,l as m,m as K,n as Q,o as W,p as D,q as k,r as v,u as V,v as E,w as y}from"../chunks/index.b4_itZyM.js";const ie={};function X(r){let e,n,i;var s=r[1][0];function _(t,o){return{props:{data:t[3],form:t[2]}}}return s&&(e=k(s,_(r)),r[12](e)),{c(){e&&v(e.$$.fragment),n=p()},l(t){e&&V(e.$$.fragment,t),n=p()},m(t,o){e&&E(e,t,o),w(t,n,o),i=!0},p(t,o){if(o&2&&s!==(s=t[1][0])){if(e){D();const a=e;d(a.$$.fragment,1,0,()=>{y(a,1)}),N()}s?(e=k(s,_(t)),t[12](e),v(e.$$.fragment),h(e.$$.fragment,1),E(e,n.parentNode,n)):e=null}else if(s){const a={};o&8&&(a.data=t[3]),o&4&&(a.form=t[2]),e.$set(a)}},i(t){i||(e&&h(e.$$.fragment,t),i=!0)},o(t){e&&d(e.$$.fragment,t),i=!1},d(t){t&&g(n),r[12](null),e&&y(e,t)}}}function Y(r){let e,n,i;var s=r[1][0];function _(t,o){return{props:{data:t[3],$$slots:{default:[Z]},$$scope:{ctx:t}}}}return s&&(e=k(s,_(r)),r[11](e)),{c(){e&&v(e.$$.fragment),n=p()},l(t){e&&V(e.$$.fragment,t),n=p()},m(t,o){e&&E(e,t,o),w(t,n,o),i=!0},p(t,o){if(o&2&&s!==(s=t[1][0])){if(e){D();const a=e;d(a.$$.fragment,1,0,()=>{y(a,1)}),N()}s?(e=k(s,_(t)),t[11](e),v(e.$$.fragment),h(e.$$.fragment,1),E(e,n.parentNode,n)):e=null}else if(s){const a={};o&8&&(a.data=t[3]),o&8215&&(a.$$scope={dirty:o,ctx:t}),e.$set(a)}},i(t){i||(e&&h(e.$$.fragment,t),i=!0)},o(t){e&&d(e.$$.fragment,t),i=!1},d(t){t&&g(n),r[11](null),e&&y(e,t)}}}function Z(r){let e,n,i;var s=r[1][1];function _(t,o){return{props:{data:t[4],form:t[2]}}}return s&&(e=k(s,_(r)),r[10](e)),{c(){e&&v(e.$$.fragment),n=p()},l(t){e&&V(e.$$.fragment,t),n=p()},m(t,o){e&&E(e,t,o),w(t,n,o),i=!0},p(t,o){if(o&2&&s!==(s=t[1][1])){if(e){D();const a=e;d(a.$$.fragment,1,0,()=>{y(a,1)}),N()}s?(e=k(s,_(t)),t[10](e),v(e.$$.fragment),h(e.$$.fragment,1),E(e,n.parentNode,n)):e=null}else if(s){const a={};o&16&&(a.data=t[4]),o&4&&(a.form=t[2]),e.$set(a)}},i(t){i||(e&&h(e.$$.fragment,t),i=!0)},o(t){e&&d(e.$$.fragment,t),i=!1},d(t){t&&g(n),r[10](null),e&&y(e,t)}}}function A(r){let e,n=r[6]&&L(r);return{c(){e=G("div"),n&&n.c(),this.h()},l(i){e=H(i,"DIV",{id:!0,"aria-live":!0,"aria-atomic":!0,style:!0});var s=J(e);n&&n.l(s),s.forEach(g),this.h()},h(){R(e,"id","svelte-announcer"),R(e,"aria-live","assertive"),R(e,"aria-atomic","true"),m(e,"position","absolute"),m(e,"left","0"),m(e,"top","0"),m(e,"clip","rect(0 0 0 0)"),m(e,"clip-path","inset(50%)"),m(e,"overflow","hidden"),m(e,"white-space","nowrap"),m(e,"width","1px"),m(e,"height","1px")},m(i,s){w(i,e,s),n&&n.m(e,null)},p(i,s){i[6]?n?n.p(i,s):(n=L(i),n.c(),n.m(e,null)):n&&(n.d(1),n=null)},d(i){i&&g(e),n&&n.d()}}}function L(r){let e;return{c(){e=K(r[7])},l(n){e=Q(n,r[7])},m(n,i){w(n,e,i)},p(n,i){i&128&&W(e,n[7])},d(n){n&&g(e)}}}function $(r){let e,n,i,s,_;const t=[Y,X],o=[];function a(f,u){return f[1][1]?0:1}e=a(r),n=o[e]=t[e](r);let c=r[5]&&A(r);return{c(){n.c(),i=B(),c&&c.c(),s=p()},l(f){n.l(f),i=F(f),c&&c.l(f),s=p()},m(f,u){o[e].m(f,u),w(f,i,u),c&&c.m(f,u),w(f,s,u),_=!0},p(f,[u]){let b=e;e=a(f),e===b?o[e].p(f,u):(D(),d(o[b],1,1,()=>{o[b]=null}),N(),n=o[e],n?n.p(f,u):(n=o[e]=t[e](f),n.c()),h(n,1),n.m(i.parentNode,i)),f[5]?c?c.p(f,u):(c=A(f),c.c(),c.m(s.parentNode,s)):c&&(c.d(1),c=null)},i(f){_||(h(n),_=!0)},o(f){d(n),_=!1},d(f){f&&(g(i),g(s)),o[e].d(f),c&&c.d(f)}}}function x(r,e,n){let{stores:i}=e,{page:s}=e,{constructors:_}=e,{components:t=[]}=e,{form:o}=e,{data_0:a=null}=e,{data_1:c=null}=e;j(i.page.notify);let f=!1,u=!1,b=null;C(()=>{const l=i.page.subscribe(()=>{f&&(n(6,u=!0),M().then(()=>{n(7,b=document.title||"untitled page")}))});return n(5,f=!0),l});function O(l){P[l?"unshift":"push"](()=>{t[1]=l,n(0,t)})}function T(l){P[l?"unshift":"push"](()=>{t[0]=l,n(0,t)})}function q(l){P[l?"unshift":"push"](()=>{t[0]=l,n(0,t)})}return r.$$set=l=>{"stores"in l&&n(8,i=l.stores),"page"in l&&n(9,s=l.page),"constructors"in l&&n(1,_=l.constructors),"components"in l&&n(0,t=l.components),"form"in l&&n(2,o=l.form),"data_0"in l&&n(3,a=l.data_0),"data_1"in l&&n(4,c=l.data_1)},r.$$.update=()=>{r.$$.dirty&768&&i.page.set(s)},[t,_,o,a,c,f,u,b,i,s,O,T,q]}class se extends U{constructor(e){super(),z(this,e,x,$,S,{stores:8,page:9,constructors:1,components:0,form:2,data_0:3,data_1:4})}}const oe=[()=>I(()=>import("../nodes/0.z_vse_tt.js"),__vite__mapDeps([0,1,2,3,4,5,6]),import.meta.url),()=>I(()=>import("../nodes/1.2vGAU644.js"),__vite__mapDeps([7,4,5,8,3]),import.meta.url),()=>I(()=>import("../nodes/2.g-1vMRVf.js"),__vite__mapDeps([9,4,5,2,3]),import.meta.url)],re=[],ae={"/":[2]},fe={handleError:({error:r})=>{console.error(r)}};export{ae as dictionary,fe as hooks,ie as matchers,oe as nodes,se as root,re as server_loads};
-function __vite__mapDeps(indexes) {
-  if (!__vite__mapDeps.viteFileDeps) {
-    __vite__mapDeps.viteFileDeps = ["../nodes/0.z_vse_tt.js","../chunks/preload-helper.0HuHagjb.js","../chunks/runtime.-hGPaMd1.js","../chunks/index.KGH7dGZH.js","../chunks/scheduler.3IkOjBO1.js","../chunks/index.b4_itZyM.js","../assets/0.S8gUIXi-.css","../nodes/1.2vGAU644.js","../chunks/singletons.SrwXqy11.js","../nodes/2.g-1vMRVf.js"]
-  }
-  return indexes.map((i) => __vite__mapDeps.viteFileDeps[i])
-}

web/build/_app/immutable/nodes/0.BLschTxR.js

@@ -0,0 +1 @@
+import{_ as c}from"../chunks/preload-helper.Dch09mLN.js";import{r as u,g as n,i as _,$ as f,w as m}from"../chunks/runtime.CA0Siqq1.js";import{s as p,c as g,u as d,g as $,d as L}from"../chunks/scheduler.DD_VFgMU.js";import{S as y,i as S,d as v,t as b}from"../chunks/index.m7aY60kV.js";u("en-US",()=>c(()=>import("../chunks/en-US.3ZgkfkIk.js"),[],import.meta.url));u("zh-CN",()=>c(()=>import("../chunks/zh-CN.BEOSgdra.js"),[],import.meta.url));const r="lang",h="en-US";let i=window.navigator.language;n()&&(i=n());localStorage.getItem(r)&&(i=localStorage.getItem(r));_({fallbackLocale:h,initialLocale:i,handleMissingMessage:o=>o.id.split(".").pop()});f.subscribe(o=>{localStorage.setItem(r,o)});const w=!0;async function I({url:o}){await m();let a="";return typeof process>"u"&&(a=o.searchParams.get("comfyUrl")||""),{comfyUrl:a}}const j=Object.freeze(Object.defineProperty({__proto__:null,load:I,prerender:w},Symbol.toStringTag,{value:"Module"}));function P(o){let a;const s=o[1].default,t=g(s,o,o[0],null);return{c(){t&&t.c()},l(e){t&&t.l(e)},m(e,l){t&&t.m(e,l),a=!0},p(e,[l]){t&&t.p&&(!a||l&1)&&d(t,s,e,e[0],a?L(s,e[0],l,null):$(e[0]),null)},i(e){a||(v(t,e),a=!0)},o(e){b(t,e),a=!1},d(e){t&&t.d(e)}}}function E(o,a,s){let{$$slots:t={},$$scope:e}=a;return o.$$set=l=>{"$$scope"in l&&s(0,e=l.$$scope)},[e,t]}class z extends y{constructor(a){super(),S(this,a,E,P,p,{})}}export{z as component,j as universal};

web/build/_app/immutable/nodes/0.z_vse_tt.js

@@ -1,7 +0,0 @@
-import{_ as c}from"../chunks/preload-helper.0HuHagjb.js";import{r as u,g as n,i as _,$ as f,w as m}from"../chunks/runtime.-hGPaMd1.js";import{s as p,c as g,u as d,g as $,d as L}from"../chunks/scheduler.3IkOjBO1.js";import{S as y,i as S,d as v,t as b}from"../chunks/index.b4_itZyM.js";u("en-US",()=>c(()=>import("../chunks/en-US.JAQIzv30.js"),__vite__mapDeps([]),import.meta.url));u("zh-CN",()=>c(()=>import("../chunks/zh-CN.giVTFcLQ.js"),__vite__mapDeps([]),import.meta.url));const r="lang",h="en-US";let i=window.navigator.language;n()&&(i=n());localStorage.getItem(r)&&(i=localStorage.getItem(r));_({fallbackLocale:h,initialLocale:i,handleMissingMessage:o=>o.id.split(".").pop()});f.subscribe(o=>{localStorage.setItem(r,o)});const w=!0;async function I({url:o}){await m();let a="";return typeof process>"u"&&(a=o.searchParams.get("comfyUrl")||""),{comfyUrl:a}}const j=Object.freeze(Object.defineProperty({__proto__:null,load:I,prerender:w},Symbol.toStringTag,{value:"Module"}));function P(o){let a;const s=o[1].default,t=g(s,o,o[0],null);return{c(){t&&t.c()},l(e){t&&t.l(e)},m(e,l){t&&t.m(e,l),a=!0},p(e,[l]){t&&t.p&&(!a||l&1)&&d(t,s,e,e[0],a?L(s,e[0],l,null):$(e[0]),null)},i(e){a||(v(t,e),a=!0)},o(e){b(t,e),a=!1},d(e){t&&t.d(e)}}}function E(o,a,s){let{$$slots:t={},$$scope:e}=a;return o.$$set=l=>{"$$scope"in l&&s(0,e=l.$$scope)},[e,t]}class z extends y{constructor(a){super(),S(this,a,E,P,p,{})}}export{z as component,j as universal};
-function __vite__mapDeps(indexes) {
-  if (!__vite__mapDeps.viteFileDeps) {
-    __vite__mapDeps.viteFileDeps = []
-  }
-  return indexes.map((i) => __vite__mapDeps.viteFileDeps[i])
-}

web/build/_app/immutable/nodes/1.E1uHrSfC.js

@@ -1 +1 @@
-import{s as E,n as b,e as x}from"../chunks/scheduler.3IkOjBO1.js";import{S,i as j,g as _,m as f,s as q,h as d,j as g,n as h,f as p,c as y,a as l,x as v,o as $}from"../chunks/index.b4_itZyM.js";import{d as C}from"../chunks/singletons.SrwXqy11.js";const H=()=>{const s=C;return{page:{subscribe:s.page.subscribe},navigating:{subscribe:s.navigating.subscribe},updated:s.updated}},P={subscribe(s){return H().page.subscribe(s)}};function k(s){let t,r=s[0].status+"",o,n,i,c=s[0].error?.message+"",u;return{c(){t=_("h1"),o=f(r),n=q(),i=_("p"),u=f(c)},l(e){t=d(e,"H1",{});var a=g(t);o=h(a,r),a.forEach(p),n=y(e),i=d(e,"P",{});var m=g(i);u=h(m,c),m.forEach(p)},m(e,a){l(e,t,a),v(t,o),l(e,n,a),l(e,i,a),v(i,u)},p(e,[a]){a&1&&r!==(r=e[0].status+"")&&$(o,r),a&1&&c!==(c=e[0].error?.message+"")&&$(u,c)},i:b,o:b,d(e){e&&(p(t),p(n),p(i))}}}function w(s,t,r){let o;return x(s,P,n=>r(0,o=n)),[o]}let D=class extends S{constructor(t){super(),j(this,t,w,k,E,{})}};export{D as component};
+import{s as E,n as b,e as x}from"../chunks/scheduler.DD_VFgMU.js";import{S,i as j,g as _,m as f,s as q,h as d,j as g,n as h,f as p,c as y,a as l,x as v,o as $}from"../chunks/index.m7aY60kV.js";import{d as C}from"../chunks/singletons.Bc_UULDX.js";const H=()=>{const s=C;return{page:{subscribe:s.page.subscribe},navigating:{subscribe:s.navigating.subscribe},updated:s.updated}},P={subscribe(s){return H().page.subscribe(s)}};function k(s){let t,r=s[0].status+"",o,n,i,c=s[0].error?.message+"",u;return{c(){t=_("h1"),o=f(r),n=q(),i=_("p"),u=f(c)},l(e){t=d(e,"H1",{});var a=g(t);o=h(a,r),a.forEach(p),n=y(e),i=d(e,"P",{});var m=g(i);u=h(m,c),m.forEach(p)},m(e,a){l(e,t,a),v(t,o),l(e,n,a),l(e,i,a),v(i,u)},p(e,[a]){a&1&&r!==(r=e[0].status+"")&&$(o,r),a&1&&c!==(c=e[0].error?.message+"")&&$(u,c)},i:b,o:b,d(e){e&&(p(t),p(n),p(i))}}}function w(s,t,r){let o;return x(s,P,n=>r(0,o=n)),[o]}let D=class extends S{constructor(t){super(),j(this,t,w,k,E,{})}};export{D as component};

web/build/_app/immutable/nodes/2.-Y4AVwMq.js

@@ -0,0 +1 @@
+import{w as r}from"../chunks/runtime.CA0Siqq1.js";import{s as l,c as i,u,g as f,d as c}from"../chunks/scheduler.DD_VFgMU.js";import{S as _,i as p,d as m,t as d}from"../chunks/index.m7aY60kV.js";async function g({url:o}){return await r(),typeof process>"u"?{path:o.searchParams.get("path")}:{}}const v=Object.freeze(Object.defineProperty({__proto__:null,load:g},Symbol.toStringTag,{value:"Module"}));function $(o){let s;const n=o[1].default,e=i(n,o,o[0],null);return{c(){e&&e.c()},l(t){e&&e.l(t)},m(t,a){e&&e.m(t,a),s=!0},p(t,[a]){e&&e.p&&(!s||a&1)&&u(e,n,t,t[0],s?c(n,t[0],a,null):f(t[0]),null)},i(t){s||(m(e,t),s=!0)},o(t){d(e,t),s=!1},d(t){e&&e.d(t)}}}function h(o,s,n){let{$$slots:e={},$$scope:t}=s;return o.$$set=a=>{"$$scope"in a&&n(0,t=a.$$scope)},[t,e]}class w extends _{constructor(s){super(),p(this,s,h,$,l,{})}}export{w as component,v as universal};

web/build/_app/version.json

@@ -1 +1 @@
-{"version":"1705164974856"}
+{"version":"1714203421307"}

web/build/xyz_plot.html

@@ -0,0 +1,52 @@
+<!doctype html>
+<html lang="en" data-theme="forest">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" href="./favicon.png" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		
+		<link href="./_app/immutable/assets/0.yjAznyz0.css" rel="stylesheet">
+		<link rel="modulepreload" href="./_app/immutable/entry/start.BUrJroT3.js">
+		<link rel="modulepreload" href="./_app/immutable/chunks/scheduler.DD_VFgMU.js">
+		<link rel="modulepreload" href="./_app/immutable/chunks/singletons.Bc_UULDX.js">
+		<link rel="modulepreload" href="./_app/immutable/chunks/index.BlOrB6Vx.js">
+		<link rel="modulepreload" href="./_app/immutable/entry/app.D5ml1A7d.js">
+		<link rel="modulepreload" href="./_app/immutable/chunks/preload-helper.Dch09mLN.js">
+		<link rel="modulepreload" href="./_app/immutable/chunks/index.m7aY60kV.js">
+		<link rel="modulepreload" href="./_app/immutable/nodes/0.BLschTxR.js">
+		<link rel="modulepreload" href="./_app/immutable/chunks/runtime.CA0Siqq1.js">
+		<link rel="modulepreload" href="./_app/immutable/chunks/_commonjsHelpers.Cpj98o6Y.js">
+		<link rel="modulepreload" href="./_app/immutable/nodes/2.-Y4AVwMq.js">
+		<link rel="modulepreload" href="./_app/immutable/nodes/4.DteQa3LM.js">
+		<link rel="modulepreload" href="./_app/immutable/chunks/each.-gASlQSi.js">
+	</head>
+	<body data-sveltekit-preload-data="hover">
+		<div style="display: contents">  Invalid Path 
+			
+			<script>
+				{
+					__sveltekit_sim1g4 = {
+						base: new URL(".", location).pathname.slice(0, -1),
+						env: null
+					};
+
+					const element = document.currentScript.parentElement;
+
+					const data = [null,null,null];
+
+					Promise.all([
+						import("./_app/immutable/entry/start.BUrJroT3.js"),
+						import("./_app/immutable/entry/app.D5ml1A7d.js")
+					]).then(([kit, app]) => {
+						kit.start(app, element, {
+							node_ids: [0, 2, 4],
+							data,
+							form: null,
+							error: null
+						});
+					});
+				}
+			</script>
+		</div>
+	</body>
+</html>

web/index.js

@@ -224,7 +224,13 @@ app.registerExtension({
         event.preventDefault();
       }
     });
-
+ //  add event listener for ctrl+i
+    document.addEventListener('keydown', (event) => {
+      if (event.ctrlKey && event.key === 'i') {
+        browserDialog.toggle();
+        event.preventDefault();
+      }
+    })
     app.ui.menuContainer.appendChild(
       $el("div.comfy-list", {
         style: {
@@ -295,5 +301,73 @@ app.registerExtension({
         }),
       ])
     );
+
+    try{
+      // new menu based features
+      // browser and save to collection button into new style menu
+      let cbGroup = new (await import("../../scripts/ui/components/buttonGroup.js")).ComfyButtonGroup(
+        new(await import("../../scripts/ui/components/button.js")).ComfyButton({
+          action: () => {
+            if(browserDialog)
+              browserDialog.show();
+          },
+          tooltip: "Browse and manage your outputs and collections",
+          content: "📚",
+          // content: "🪟",
+          // content: "Browser",
+          // icon: "table",// cloud, folder, folder-open, table, database, server
+					// classList: "comfyui-button comfyui-menu-mobile-collapse primary"
+					classList: "comfyui-button comfyui-menu-mobile-collapse "
+        }).element,
+        new(await import("../../scripts/ui/components/button.js")).ComfyButton({
+          action: (e) => {
+            const saveBtn = e.target;
+            const originBtnStyle = saveBtn.style.cssText;
+
+            let filename = "workflow.json";
+            const promptFilename = app.ui.settings.getSettingValue(
+              "Comfy.PromptFilename",
+              true,
+            );
+            if (promptFilename) {
+              filename = prompt("Collect workflow as:", filename);
+              if (!filename) return;
+              if (!filename.toLowerCase().endsWith(".json")) {
+                filename += ".json";
+              }
+            }
+            app.graphToPrompt().then(async p => {
+              const json = JSON.stringify(p.workflow, null, 2); // convert the data to a JSON string
+              const res = await api.fetchApi("/browser/collections/workflows", {
+                method: "POST",
+                body: JSON.stringify({
+                  filename: filename,
+                  content: json,
+                }),
+              });
+              if (res.ok) {
+                saveBtn.style = originBtnStyle + "border-color: green;";
+                showToast(
+                  'Saved. Click me to open.',
+                  () => { browserDialog.show() },
+                );
+              } else {
+                saveBtn.style = originBtnStyle + "border-color: red;";
+              }
+              setTimeout(() => {
+                saveBtn.style = originBtnStyle;
+              }, 1000);
+            });
+          },
+          tooltip: "Save workflow to collections",
+          content: "💾",
+          classList: "comfyui-button comfyui-menu-mobile-collapse "
+        }).element
+      );
+      app.menu?.settingsGroup.element.before(cbGroup.element);
+
+    }catch(exception){
+      console.log('ComfyUI-Browser could not load new menu based features.');
+    }
   },
 });

web/nodes/selectInputs.js

@@ -32,14 +32,21 @@ function refreshPreview(node) {
 
 function refreshInputs(node, app) {
   const inputs = getGraphInputs(app.graph);
-  node.widgets.forEach(w => {
+
+  let index = -1;
+  for (const w of node.widgets) {
+    index += 1;
     if (w.type != 'combo') {
       return;
     }
 
     w.options.values = inputs;
-    w.value = inputs[0];
-  });
+    if (node.widgets_values) {
+      w.value = node.widgets_values[index]
+    } else {
+      w.value = inputs[0];
+    }
+  }
   const size = node.computeSize();
   node.setSize([size[0] * 1.5, size[1]]);