Configurable defaults per workflow and reset

src/lib/components/ComfyApp.ts

@@ -23,7 +23,7 @@ import { ComfyComboNode } from "$lib/nodes/widgets";
 import notify from "$lib/notify";
 import parseA1111, { type A1111ParsedInfotext } from "$lib/parseA1111";
 import configState, { type ConfigState } from "$lib/stores/configState";
-import layoutStates, { defaultWorkflowAttributes, type SerializedLayoutState } from "$lib/stores/layoutStates";
+import layoutStates, { defaultWorkflowAttributes, isComfyWidgetNode, type SerializedLayoutState } from "$lib/stores/layoutStates";
 import modalState from "$lib/stores/modalState";
 import queueState from "$lib/stores/queueState";
 import selectionState from "$lib/stores/selectionState";
@@ -272,6 +272,9 @@ export default class ComfyApp {
     }
 
     resizeCanvas() {
+        if (!this.canvasEl)
+            return;
+
         this.canvasEl.width = this.canvasEl.parentElement.offsetWidth;
         this.canvasEl.height = this.canvasEl.parentElement.offsetHeight;
         this.canvasEl.style.width = ""
@@ -482,13 +485,17 @@ export default class ComfyApp {
                 } catch (error) { }
             }
 
-            if (workflow && typeof workflow.createdBy === "string") {
+            if (workflow == null)
+                return;
+
+            if (typeof workflow === "object") {
+                if (typeof workflow.createdBy === "string")
                     this.openWorkflow(workflow);
-            }
                 else {
                     // TODO handle vanilla workflows
                     throw new Error("Workflow was not in ComfyBox format!")
                 }
+            }
         });
     }
 
@@ -784,6 +791,30 @@ export default class ComfyApp {
         await this.openWorkflow(state, options)
     }
 
+    saveWorkflowStateAsDefault(workflow: ComfyBoxWorkflow | null) {
+        workflow ||= workflowState.getActiveWorkflow();
+        if (workflow == null)
+            return;
+
+        for (const node of workflow.graph.iterateNodesInOrderRecursive()) {
+            if (isComfyWidgetNode(node)) {
+                node.properties.defaultValue = node.getValue();
+            }
+        }
+    }
+
+    resetCurrentWorkflow() {
+        const workflow = workflowState.getActiveWorkflow();
+        if (workflow == null)
+            return;
+
+        for (const node of workflow.graph.iterateNodesInOrderRecursive()) {
+            if (isComfyWidgetNode(node)) {
+                node.setValue(node.properties.defaultValue);
+            }
+        }
+    }
+
     clear() {
         this.clean();
 
@@ -821,6 +852,8 @@ export default class ComfyApp {
             return;
         }
 
+        this.saveWorkflowStateAsDefault(workflow);
+
         const promptFilename = get(configState).promptForWorkflowName;
 
         const title = workflow.attrs.title.trim() || "workflow"

src/lib/components/ComfyBoxWorkflowsView.svelte

@@ -151,6 +151,13 @@
      }
  }
 
+ async function doReset() {
+     var confirmed = confirm("Are you sure you want to reset this workflow to its default state?");
+     if (confirmed) {
+         app.resetCurrentWorkflow();
+     }
+ }
+
  function createNewWorkflow() {
      app.createNewWorkflow();
  }
@@ -273,28 +280,31 @@
                 <Button variant="secondary" disabled={loading} on:click={doLoadDefault}>
                     Load Default
                 </Button>
+                <Button variant="secondary" disabled={loading} on:click={doReset}>
+                    Reset
+                </Button>
                 <Button variant="secondary" disabled={loading} on:click={doRefreshCombos}>
                     🔄
                 </Button>
                 <!-- <Checkbox label="Lock Nodes" bind:value={$uiState.nodesLocked}/>
                      <Checkbox label="Disable Interaction" bind:value={$uiState.graphLocked}/> -->
-                <span style="display: inline-flex !important">
+                <span style="display: inline-flex !important; padding: 0 0.75rem;">
                     <Checkbox label="Auto-Add UI" bind:value={$uiState.autoAddUI}/>
                 </span>
-                <span class="label" for="ui-edit-mode">
+                <!-- <span class="label" for="ui-edit-mode">
                      <BlockTitle>UI Edit mode</BlockTitle>
                      <select id="ui-edit-mode" name="ui-edit-mode" bind:value={$uiState.uiEditMode}>
                      <option value="widgets">Widgets</option>
                      </select>
-                </span>
-                <span class="label" for="ui-theme">
+                     </span> -->
+                <!-- <span class="label" for="ui-theme">
                      <BlockTitle>Theme</BlockTitle>
                      <select id="ui-theme" name="ui-theme" bind:value={uiTheme}>
                      <option value="gradio-dark">Gradio Dark</option>
                      <option value="gradio-light">Gradio Light</option>
                      <option value="anapnoe">Anapnoe</option>
                      </select>
-                </span>
+                     </span> -->
             </div>
             <div class="right">
                 <ComfyUnlockUIButton bind:toggled={$uiState.uiUnlocked} />

src/lib/nodes/widgets/ComfyComboNode.ts

@@ -162,6 +162,8 @@ export default class ComfyComboNode extends ComfyWidgetNode<string> {
     override stripUserState(o: SerializedLGraphNode) {
         super.stripUserState(o);
         o.properties.values = []
+        o.properties.defaultValue = null;
+        (o as any).comfyValue = null
     }
 }
 

src/lib/nodes/widgets/ComfyWidgetNode.ts

@@ -355,7 +355,6 @@ export default abstract class ComfyWidgetNode<T = any> extends ComfyGraphNode {
 
     override stripUserState(o: SerializedLGraphNode) {
         super.stripUserState(o);
-        (o as any).comfyValue = this.defaultValue;
-        o.properties.defaultValue = null;
+        (o as any).comfyValue = this.properties.defaultValue;
     }
 }

src/lib/stores/layoutStates.ts

@@ -525,7 +525,37 @@ const ALL_ATTRIBUTES: AttributesSpecList = [
                 canShow: (di: IDragItem) => di.type === "container"
             },
 
+            // Combo
+            {
+                name: "defaultValue",
+                type: "string",
+                location: "nodeProps",
+                editable: true,
+                defaultValue: "A",
+                validNodeTypes: ["ui/combo"],
+            },
+
+            // Checkbox
+            {
+                name: "defaultValue",
+                type: "boolean",
+                location: "nodeProps",
+                editable: true,
+                defaultValue: true,
+                validNodeTypes: ["ui/checkbox"],
+            },
+
             // Range
+            {
+                name: "defaultValue",
+                type: "number",
+                location: "nodeProps",
+                editable: true,
+                defaultValue: 0,
+                min: -2 ^ 16,
+                max: 2 ^ 16,
+                validNodeTypes: ["ui/number"],
+            },
             {
                 name: "min",
                 type: "number",
@@ -587,6 +617,14 @@ const ALL_ATTRIBUTES: AttributesSpecList = [
             },
 
             // Radio
+            {
+                name: "defaultValue",
+                type: "string",
+                location: "nodeProps",
+                editable: true,
+                defaultValue: "Choice A",
+                validNodeTypes: ["ui/radio"],
+            },
             {
                 name: "choices",
                 type: "string",
@@ -598,6 +636,16 @@ const ALL_ATTRIBUTES: AttributesSpecList = [
                 deserialize: deserializeStringArray,
             },
 
+            // Text
+            {
+                name: "defaultValue",
+                type: "string",
+                location: "nodeProps",
+                editable: true,
+                defaultValue: "",
+                validNodeTypes: ["ui/text"],
+            },
+
             // Workflow
             {
                 name: "title",