Added extra networks support

javascript/state.core.js

@@ -38,6 +38,10 @@ state.core = (function () {
         'styles': 'styles'
     };
 
+    const TOGGLE_BUTTONS = {
+        'extra_networks': 'extra_networks',
+    };
+
     let store = null;
 
     function hasSetting(id, tab) {
@@ -59,6 +63,16 @@ state.core = (function () {
             .catch(error => console.error('[state]: Error getting JSON file:', error));
     }
 
+    function forEachElement(list, config, action) {
+        for (const [settingId, element] of Object.entries(list)) {
+            TABS.forEach(tab => {
+                if (config.hasSetting(settingId, tab)) {
+                    action(element, tab);
+                }
+            });
+        }
+    }
+
     function load(config) {
 
         store = new state.Store();
@@ -66,37 +80,25 @@ state.core = (function () {
         loadUI();
         restoreTabs(config);
 
-        for (const [settingId, element] of Object.entries(ELEMENTS)) {
+        forEachElement(ELEMENTS, config, (element, tab) => {
-            TABS.forEach(tab => {
+            handleSavedInput(`${tab}_${element}`);
-                if (config.hasSetting(settingId, tab)) {
+        });
-                    handleSavedInput(`${tab}_${element}`);
-                }
-            });
-        }
 
-        for (const [settingId, element] of Object.entries(ELEMENTS_WITHOUT_PREFIX)) {
+        forEachElement(ELEMENTS_WITHOUT_PREFIX, config, (element, tab) => {
-            TABS.forEach(tab => {
+            handleSavedInput(`${element}`);
-                if (config.hasSetting(settingId, tab)) {
+        });
-                    handleSavedInput(`${element}`);
-                }
-            });
-        }
 
-        for (const [settingId, element] of Object.entries(SELECTS)) {
+        forEachElement(SELECTS, config, (element, tab) => {
-            TABS.forEach(tab => {
+            handleSavedSelects(`${tab}_${element}`);
-                if (config.hasSetting(settingId, tab)) {
+        });
-                    handleSavedSelects(`${tab}_${element}`);
-                }
-            });
-        }
 
-        for (const [settingId, element] of Object.entries(MULTI_SELECTS)) {
+        forEachElement(MULTI_SELECTS, config, (element, tab) => {
-            TABS.forEach(tab => {
+            handleSavedMultiSelects(`${tab}_${element}`);
-                if (config.hasSetting(settingId, tab)) {
+        });
-                    handleSavedMultiSelects(`${tab}_${element}`);
+
-                }
+        forEachElement(TOGGLE_BUTTONS, config, (element, tab) => {
-            });
+            handleToggleButton(`${tab}_${element}`);
-        }
+        });
 
         handleExtensions(config);
         handleSettingsPage();
@@ -208,6 +210,17 @@ state.core = (function () {
         state.utils.handleMultipleSelect(select, id, store);
     }
 
+    function handleToggleButton(id) {
+        const btn = gradioApp().querySelector(`button#${id}`);
+        if (! btn) { return; }
+        if (store.get(id) === 'true') {
+            state.utils.triggerMouseEvent(btn);
+        }
+        btn.addEventListener('click', function () {
+           store.set(id, Array.from(this.classList).indexOf('secondary-down') === -1);
+        });
+    }
+
     function handleExtensions(config) {
         if (config['state_extensions']) {
             config['state_extensions'].forEach(function (ext) {

scripts/state_settings.py

@@ -17,6 +17,7 @@ def on_ui_settings():
         "choices": [
             "prompt",
             "negative_prompt",
+            "extra_networks",
             "styles",
             "sampling",
             "sampling_steps",
@@ -42,6 +43,7 @@ def on_ui_settings():
         "choices": [
             "prompt",
             "negative_prompt",
+            "extra_networks",
             "styles",
             "sampling",
             "resize_mode",