Skip to content

Commit

Permalink
Annotate settings.ts (#134)
Browse files Browse the repository at this point in the history
* Annotate settings.ts

* nit
  • Loading branch information
huchenlei authored Jul 16, 2024
1 parent e216fa8 commit 13cda7d
Show file tree
Hide file tree
Showing 4 changed files with 53 additions and 41 deletions.
4 changes: 2 additions & 2 deletions src/scripts/app.ts
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ import {
LGraphNode,
LiteGraph,
} from "@comfyorg/litegraph";
import { StorageLocation } from "@/types/settingTypes";

// CSS imports. style.css must be imported later as it overwrites some litegraph styles.
import "@comfyorg/litegraph/css/litegraph.css";
Expand Down Expand Up @@ -104,8 +105,7 @@ export class ComfyApp {
progress: { value: number; max: number } | null;
configuringGraph: boolean;
isNewUserSession: boolean;
// Are there any other options than "server"?
storageLocation: string;
storageLocation: StorageLocation;
multiUserServer: boolean;
ctx: CanvasRenderingContext2D;
widgets: Record<string, ComfyWidgetConstructor>;
Expand Down
5 changes: 4 additions & 1 deletion src/scripts/ui/menu/workflows.ts
Original file line number Diff line number Diff line change
Expand Up @@ -233,7 +233,10 @@ export class ComfyWorkflowsMenu {
) {
const r = getExtraMenuOptions?.apply?.(this, arguments);
if (
app.ui.settings.getSettingValue("Comfy.UseNewMenu", false) === true
app.ui.settings.getSettingValue<boolean>(
"Comfy.UseNewMenu",
false
) === true
) {
const t = this;
let img;
Expand Down
46 changes: 8 additions & 38 deletions src/scripts/ui/settings.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,44 +2,14 @@ import { $el } from "../ui";
import { api } from "../api";
import { ComfyDialog } from "./dialog";
import type { ComfyApp } from "../app";

/* The Setting entry stored in `ComfySettingsDialog` */
interface Setting {
id: string;
onChange?: (value: any, oldValue?: any) => void;
name: string;
render: () => HTMLElement;
}

interface SettingOption {
text: string;
value?: string;
}

interface SettingParams {
id: string;
name: string;
type:
| string
| ((
name: string,
setter: (v: any) => void,
value: any,
attrs: any
) => HTMLElement);
defaultValue: any;
onChange?: (newValue: any, oldValue?: any) => void;
attrs?: any;
tooltip?: string;
options?: Array<string | SettingOption> | ((value: any) => SettingOption[]);
}
import type { Setting, SettingParams } from "@/types/settingTypes";

export class ComfySettingsDialog extends ComfyDialog<HTMLDialogElement> {
app: ComfyApp;
settingsValues: any;
settingsLookup: Record<string, Setting>;

constructor(app) {
constructor(app: ComfyApp) {
super();
this.app = app;
this.settingsValues = {};
Expand Down Expand Up @@ -83,7 +53,7 @@ export class ComfySettingsDialog extends ComfyDialog<HTMLDialogElement> {
return Object.values(this.settingsLookup);
}

#dispatchChange(id, value, oldValue?) {
#dispatchChange<T>(id: string, value: T, oldValue?: T) {
this.dispatchEvent(
new CustomEvent(id + ".change", {
detail: {
Expand All @@ -109,26 +79,26 @@ export class ComfySettingsDialog extends ComfyDialog<HTMLDialogElement> {
}
}

getId(id) {
getId(id: string) {
if (this.app.storageLocation === "browser") {
id = "Comfy.Settings." + id;
}
return id;
}

getSettingValue(id, defaultValue?) {
getSettingValue<T>(id: string, defaultValue?: T): T {
let value = this.settingsValues[this.getId(id)];
if (value != null) {
if (this.app.storageLocation === "browser") {
try {
value = JSON.parse(value);
value = JSON.parse(value) as T;
} catch (error) {}
}
}
return value ?? defaultValue;
}

async setSettingValueAsync(id, value) {
async setSettingValueAsync(id: string, value: any) {
const json = JSON.stringify(value);
localStorage["Comfy.Settings." + id] = json; // backwards compatibility for extensions keep setting in storage

Expand All @@ -143,7 +113,7 @@ export class ComfySettingsDialog extends ComfyDialog<HTMLDialogElement> {
await api.storeSetting(id, value);
}

setSettingValue(id, value) {
setSettingValue(id: string, value: any) {
this.setSettingValueAsync(id, value).catch((err) => {
alert(`Error saving setting '${id}'`);
console.error(err);
Expand Down
39 changes: 39 additions & 0 deletions src/types/settingTypes.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
export type StorageLocation = "browser" | "server";

export type SettingInputType =
| "boolean"
| "number"
| "slider"
| "combo"
| "text"
| "hidden";

export type SettingCustomRenderer = (
name: string,
setter: (v: any) => void,
value: any,
attrs: any
) => HTMLElement;

export interface SettingOption {
text: string;
value?: string;
}

export interface Setting {
id: string;
onChange?: (value: any, oldValue?: any) => void;
name: string;
render: () => HTMLElement;
}

export interface SettingParams {
id: string;
name: string;
type: SettingInputType | SettingCustomRenderer;
defaultValue: any;
onChange?: (newValue: any, oldValue?: any) => void;
attrs?: any;
tooltip?: string;
options?: Array<string | SettingOption> | ((value: any) => SettingOption[]);
}

0 comments on commit 13cda7d

Please sign in to comment.