Work for ControlNet

src/lib/components/ComfyApp.svelte

@@ -127,16 +127,9 @@
          return;
 
      app.saveStateToLocalStorage();
-     notify("Saved to local storage.")
-     console.debug(jsonToJsObject(JSON.stringify(app.serialize(), null, 2)))
-     //
-     //      const date = new Date();
-     //      const formattedDate = date.toISOString().replace(/:/g, '-').replace(/\.\d{3}/g, '').replace('T', '_').replace("Z", "");
-     //
-     //      download(`workflow-${formattedDate}.json`, JSON.stringify(app.serialize()), "application/json")
  }
 
- async function doLoadDefault(): void {
+ async function doLoadDefault() {
      var confirmed = confirm("Are you sure you want to clear the current workflow and load the default graph?");
      if (confirmed) {
          await app.deserialize(defaultGraph)

src/lib/components/ComfyApp.ts

@@ -28,8 +28,9 @@ import ComfyGraph from "$lib/ComfyGraph";
 import { ComfyBackendNode } from "$lib/nodes/ComfyBackendNode";
 import { get } from "svelte/store";
 import uiState from "$lib/stores/uiState";
-import { download, promptToGraphVis, workflowToGraphVis } from "$lib/utils";
+import { download, jsonToJsObject, promptToGraphVis, workflowToGraphVis } from "$lib/utils";
 import notify from "$lib/notify";
+import configState from "$lib/stores/configState";
 
 export const COMFYBOX_SERIAL_VERSION = 1;
 
@@ -189,9 +190,19 @@ export default class ComfyApp {
     }
 
     saveStateToLocalStorage() {
-        const savedWorkflow = this.serialize();
+        try {
-        const json = JSON.stringify(savedWorkflow);
+            uiState.update(s => { s.isSavingToLocalStorage = true; return s; })
-        localStorage.setItem("workflow", json)
+            const savedWorkflow = this.serialize();
+            const json = JSON.stringify(savedWorkflow);
+            localStorage.setItem("workflow", json)
+            notify("Saved to local storage.")
+        }
+        catch (err) {
+            notify(`Failed saving to local storage:\n${err}`, { type: "error" })
+        }
+        finally {
+            uiState.update(s => { s.isSavingToLocalStorage = false; return s; })
+        }
     }
 
     static node_type_overrides: Record<string, typeof ComfyBackendNode> = {}
@@ -473,7 +484,7 @@ export default class ComfyApp {
     }
 
     querySave() {
-        const promptFilename = true; // TODO
+        const promptFilename = get(configState).promptForWorkflowName;
 
         let filename = "workflow.json";
         if (promptFilename) {
@@ -493,6 +504,8 @@ export default class ComfyApp {
         const json = JSON.stringify(this.serialize(), null, indent)
 
         download(filename, json, "application/json")
+
+        console.debug(jsonToJsObject(json))
     }
 
     /**

src/lib/nodes/ComfyGraphNode.ts

@@ -7,6 +7,7 @@ import type { ComfyWidgetNode } from "./ComfyWidgetNodes";
 import type IComfyInputSlot from "$lib/IComfyInputSlot";
 import uiState from "$lib/stores/uiState";
 import { get } from "svelte/store";
+import configState from "$lib/stores/configState";
 
 export type DefaultWidgetSpec = {
     defaultWidgetNode: new (name?: string) => ComfyWidgetNode,
@@ -291,7 +292,7 @@ export default class ComfyGraphNode extends LGraphNode {
         }
 
         (o as any).saveUserState = this.saveUserState
-        if (!this.saveUserState) {
+        if (!this.saveUserState && (!get(uiState).isSavingToLocalStorage || get(configState).alwaysStripUserState)) {
             this.stripUserState(o)
             console.warn("[ComfyGraphNode] stripUserState", this, o)
         }

src/lib/stores/configState.ts

@@ -0,0 +1,27 @@
+import { debounce } from '$lib/utils';
+import { get, writable } from 'svelte/store';
+import type { Writable } from 'svelte/store';
+
+export type ConfigState = {
+    /** Strip user state even if saving to local storage */
+    alwaysStripUserState: boolean,
+
+    /** When saving, always prompt for a name to save the workflow as */
+    promptForWorkflowName: boolean,
+}
+
+type ConfigStateOps = {
+}
+
+export type WritableConfigStateStore = Writable<ConfigState> & ConfigStateOps;
+const store: Writable<ConfigState> = writable(
+    {
+        alwaysStripUserState: false,
+        promptForWorkflowName: false
+    })
+
+const configStateStore: WritableConfigStateStore =
+{
+    ...store
+}
+export default configStateStore;

src/lib/stores/uiState.ts

@@ -9,6 +9,8 @@ export type UIState = {
     autoAddUI: boolean,
     uiUnlocked: boolean,
     uiEditMode: UIEditMode,
+
+    isSavingToLocalStorage: boolean
 }
 
 export type WritableUIStateStore = Writable<UIState>;
@@ -18,7 +20,9 @@ const store: WritableUIStateStore = writable(
         nodesLocked: false,
         autoAddUI: true,
         uiUnlocked: false,
-        uiEditMode: "widgets"
+        uiEditMode: "widgets",
+
+        isSavingToLocalStorage: false
     })
 
 const uiStateStore: WritableUIStateStore =

src/lib/widgets/ImageUploadWidget.svelte

@@ -52,16 +52,13 @@
  }
 
  function onChange() {
-     console.warn("CHANGED", _value)
      $nodeValue = _value || []
  }
 
  function onUpload() {
-     console.warn("UPLOADED", _value)
  }
 
  function onClear() {
-     console.warn("CLEARED", _value)
  }
 
  interface GradioUploadResponse {
@@ -70,7 +67,7 @@
  }
 
  async function upload_files(root: string, files: Array<File>): Promise<GradioUploadResponse> {
-     console.warn("UPLOADILFES", root, files);
+     console.debug("UPLOADILFES", root, files);
 
      const url = `http://${location.hostname}:8188` // TODO make configurable
 
@@ -113,7 +110,6 @@
          pending_upload = true;
 
          old_value = _value;
-         console.warn(_value)
 
          if (_value == null)
              _value = []
@@ -182,7 +178,6 @@
 
  function getImageUrl(image: GradioFileData) {
      const baseUrl = `http://${location.hostname}:8188` // TODO make configurable
-     console.warn(image)
      const params = new URLSearchParams({ filename: image.name, subfolder: "", type: "input" })
      return `${baseUrl}/view?${params}`
  }

src/mobile/GenToolbar.svelte

@@ -53,7 +53,6 @@
 
      navigator.vibrate(20)
      app.saveStateToLocalStorage();
-     notify("Saved to local storage.")
  }
 </script>