Queuing from mobile UI

src/lib/components/ComfyApp.ts

@@ -77,6 +77,14 @@ export default class ComfyApp {
     shiftDown: boolean = false;
     selectedGroupMoving: boolean = false;
 
+    private static _instance: ComfyApp;
+
+    static get instance(): ComfyApp {
+        if (!ComfyApp._instance)
+            ComfyApp._instance = new ComfyApp()
+        return ComfyApp._instance
+    }
+
     private queueItems: QueueItem[] = [];
     private processingQueue: boolean = false;
 
@@ -125,7 +133,7 @@ export default class ComfyApp {
         }
 
         // Save current workflow automatically
-        setInterval(this.requestAutosave.bind(this), 1000);
+        setInterval(this.requestAutosave.bind(this), 15000);
 
         this.addApiUpdateHandlers();
         this.addDropHandler();

src/lib/components/ComfyPane.svelte

@@ -3,9 +3,6 @@
  import { get } from "svelte/store"
  import { Block, BlockTitle } from "@gradio/atoms";
  import { Move } from 'radix-icons-svelte';
- import ComboWidget from "$lib/widgets/ComboWidget.svelte";
- import RangeWidget from "$lib/widgets/RangeWidget.svelte";
- import TextWidget from "$lib/widgets/TextWidget.svelte";
  import widgetState, { type WidgetDrawState, type WidgetUIState } from "$lib/stores/widgetState";
  import queueState from "$lib/stores/queueState";
  import nodeState from "$lib/stores/nodeState";
@@ -20,6 +17,7 @@
  import ComfyApp from "./ComfyApp";
  import type { LGraphNode } from "@litegraph-ts/core";
  import type { DragItem } from "./ComfyUIPane";
+ import { getComponentForWidgetState } from "$lib/utils"
 
  export let dragItems: DragItem[] = [];
  let dragDisabled = true;
@@ -62,28 +60,6 @@
      dragItems = dragItems;
  }
 
- function getComponentForWidgetState(item: WidgetUIState): any {
-     let ctor: any = null;
-
-     // custom widgets with TypeScript sources
-     let override = ComfyApp.widget_type_overrides[item.widget.type]
-     if (override) {
-         return override;
-     }
-
-     // litegraph.ts built-in widgets
-     switch (item.widget.type) {
-         case "combo":
-             return ComboWidget;
-         case "number":
-             return RangeWidget;
-         case "text":
-             return TextWidget;
-     }
-
-     return null;
- }
-
  function updateNodeName(node: LGraphNode, value: string) {
      nodeState.nodeStateChanged(node);
  }

src/lib/utils.ts

@@ -1,3 +1,9 @@
+import ComfyApp from "./components/ComfyApp";
+import ComboWidget from "$lib/widgets/ComboWidget.svelte";
+import RangeWidget from "$lib/widgets/RangeWidget.svelte";
+import TextWidget from "$lib/widgets/TextWidget.svelte";
+ import widgetState, { type WidgetDrawState, type WidgetUIState } from "$lib/stores/widgetState";
+
 export function download(filename: string, text: string, type: string = "text/plain") {
     const blob = new Blob([text], { type: type });
     const url = URL.createObjectURL(blob);
@@ -11,3 +17,25 @@ export function download(filename: string, text: string, type: string = "text/pl
         window.URL.revokeObjectURL(url);
     }, 0);
 }
+
+export function getComponentForWidgetState(item: WidgetUIState): any {
+    let ctor: any = null;
+
+    // custom widgets with TypeScript sources
+    let override = ComfyApp.widget_type_overrides[item.widget.type]
+    if (override) {
+        return override;
+    }
+
+    // litegraph.ts built-in widgets
+    switch (item.widget.type) {
+        case "combo":
+            return ComboWidget;
+        case "number":
+            return RangeWidget;
+        case "text":
+            return TextWidget;
+    }
+
+    return null;
+}