From 932ee11c915989db2bb8a9255be83c3c251b10e9 Mon Sep 17 00:00:00 2001 From: JeLuF Date: Thu, 16 Feb 2023 01:19:36 +0100 Subject: [PATCH 001/200] Use yaml instead of json for the config file --- build.bat | 1 + build.sh | 1 + scripts/config.yaml.sample | 24 +++++++++++++ scripts/on_sd_start.bat | 17 +++++++++ ui/easydiffusion/app.py | 70 ++++++++++++++++++++++++-------------- 5 files changed, 88 insertions(+), 25 deletions(-) create mode 100644 scripts/config.yaml.sample diff --git a/build.bat b/build.bat index 6e3f3f81..b9c6b9ab 100644 --- a/build.bat +++ b/build.bat @@ -15,6 +15,7 @@ mkdir dist\win\stable-diffusion-ui\scripts copy scripts\on_env_start.bat dist\win\stable-diffusion-ui\scripts\ copy scripts\bootstrap.bat dist\win\stable-diffusion-ui\scripts\ +copy scripts\config.yaml.sample dist\win\stable-diffusion-ui\scripts\config.yaml copy "scripts\Start Stable Diffusion UI.cmd" dist\win\stable-diffusion-ui\ copy LICENSE dist\win\stable-diffusion-ui\ copy "CreativeML Open RAIL-M License" dist\win\stable-diffusion-ui\ diff --git a/build.sh b/build.sh index f4538e5c..a7ed152c 100755 --- a/build.sh +++ b/build.sh @@ -29,6 +29,7 @@ mkdir -p dist/linux-mac/stable-diffusion-ui/scripts cp scripts/on_env_start.sh dist/linux-mac/stable-diffusion-ui/scripts/ cp scripts/bootstrap.sh dist/linux-mac/stable-diffusion-ui/scripts/ cp scripts/functions.sh dist/linux-mac/stable-diffusion-ui/scripts/ +cp scripts/config.yaml.sample dist/linux-mac/stable-diffusion-ui/scripts/config.yaml cp scripts/start.sh dist/linux-mac/stable-diffusion-ui/ cp LICENSE dist/linux-mac/stable-diffusion-ui/ cp "CreativeML Open RAIL-M License" dist/linux-mac/stable-diffusion-ui/ diff --git a/scripts/config.yaml.sample b/scripts/config.yaml.sample new file mode 100644 index 00000000..9c2cc4a6 --- /dev/null +++ b/scripts/config.yaml.sample @@ -0,0 +1,24 @@ +# Change listen_port if port 9000 is already in use on your system +# Set listen_to_network to true to make Easy Diffusion accessibble on your local network +net: + listen_port: 9000 + listen_to_network: false + +# Multi GPU setup +render_devices: auto + +# Set open_browser_on_start to false to disable opening a new browser tab on each restart +ui: + open_browser_on_start: true + +# set update_branch to main to use the stable version, or to beta to use the experimental +# beta version. +update_branch: main + +# Set force_save_path to enforce an auto save path. Clients will not be able to change or +# disable auto save when this option is set. Please adapt the path in the examples to your +# needs. +# Windows: +# force_save_path: C:\\Easy Diffusion Images\\ +# Linux: +# force_save_path: /data/easy-diffusion-images/ diff --git a/scripts/on_sd_start.bat b/scripts/on_sd_start.bat index 821e24aa..fe6f20aa 100644 --- a/scripts/on_sd_start.bat +++ b/scripts/on_sd_start.bat @@ -135,6 +135,23 @@ if "%ERRORLEVEL%" EQU "0" ( ) ) +@rem install ruamel.yaml +call python ..\scripts\check_modules.py ruamel.yaml +if "%ERRORLEVEL%" EQU "0" ( + echo "ruamel.yaml has already been installed." +) else ( + echo "Installing ruamel.yaml.." + + set PYTHONNOUSERSITE=1 + set PYTHONPATH=%INSTALL_ENV_DIR%\lib\site-packages + + call python -m pip install ruamel.yaml==0.17.21 || ( + echo "Error installing ruamel.yaml. Sorry about that, please try to:" & echo " 1. Run this installer again." & echo " 2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/cmdr2/stable-diffusion-ui/wiki/Troubleshooting" & echo " 3. If those steps don't help, please copy *all* the error messages in this window, and ask the community at https://discord.com/invite/u9yhsFmEkB" & echo " 4. If that doesn't solve the problem, please file an issue at https://github.com/cmdr2/stable-diffusion-ui/issues" & echo "Thanks!" + pause + exit /b + ) +) + set PATH=C:\Windows\System32;%PATH% call python ..\scripts\check_modules.py uvicorn fastapi diff --git a/ui/easydiffusion/app.py b/ui/easydiffusion/app.py index 4369a488..92d2d596 100644 --- a/ui/easydiffusion/app.py +++ b/ui/easydiffusion/app.py @@ -5,6 +5,9 @@ import json import traceback import logging import shlex +from ruamel.yaml import YAML +yaml = YAML() + from rich.logging import RichHandler from sdkit.utils import log as sdkit_log # hack, so we can overwrite the log config @@ -54,33 +57,50 @@ def init(): update_render_threads() def getConfig(default_val=APP_CONFIG_DEFAULTS): - try: - config_json_path = os.path.join(CONFIG_DIR, 'config.json') - if not os.path.exists(config_json_path): - config = default_val - else: - with open(config_json_path, 'r', encoding='utf-8') as f: - config = json.load(f) - if 'net' not in config: - config['net'] = {} - if os.getenv('SD_UI_BIND_PORT') is not None: - config['net']['listen_port'] = int(os.getenv('SD_UI_BIND_PORT')) - else: - config['net']['listen_port'] = 9000 - if os.getenv('SD_UI_BIND_IP') is not None: - config['net']['listen_to_network'] = (os.getenv('SD_UI_BIND_IP') == '0.0.0.0') - else: - config['net']['listen_to_network'] = True - return config - except Exception as e: - log.warn(traceback.format_exc()) - return default_val + config_yaml_path = os.path.join(CONFIG_DIR, 'config.yaml') + if os.path.isfile(config_yaml_path): + try: + log.info('Loading config.yaml') + with open(config_yaml_path, 'r', encoding='utf-8') as f: + config = yaml.load(f) + if 'net' not in config: + config['net'] = {} + if os.getenv('SD_UI_BIND_PORT') is not None: + config['net']['listen_port'] = int(os.getenv('SD_UI_BIND_PORT')) + else: + config['net']['listen_port'] = 9000 + if os.getenv('SD_UI_BIND_IP') is not None: + config['net']['listen_to_network'] = (os.getenv('SD_UI_BIND_IP') == '0.0.0.0') + else: + config['net']['listen_to_network'] = True + return config + except Exception as e: + log.warn(traceback.format_exc()) + return default_val + else: + try: + config_json_path = os.path.join(CONFIG_DIR, 'config.json') + if not os.path.exists(config_json_path): + return default_val + else: + log.info('Converting old json config file to yaml') + with open(config_json_path, 'r', encoding='utf-8') as f: + config = json.load(f) + # Save config in new format + setConfig(config) + os.rename(config_json_path, config_json_path + '.bak') + log.info('Saved old config.json as config.json.bak') + return getConfig(default_val) + except Exception as e: + log.warn(traceback.format_exc()) + return default_val def setConfig(config): - try: # config.json - config_json_path = os.path.join(CONFIG_DIR, 'config.json') - with open(config_json_path, 'w', encoding='utf-8') as f: - json.dump(config, f) + try: # config.yaml + config_yaml_path = os.path.join(CONFIG_DIR, 'config.yaml') + yaml.indent(mapping=2, sequence=4, offset=2) + with open(config_yaml_path, 'w', encoding='utf-8') as f: + yaml.dump(config, f) except: log.error(traceback.format_exc()) From 8149f97388010d59e6a21e7796cecae48af668b3 Mon Sep 17 00:00:00 2001 From: JeLuF Date: Wed, 29 Mar 2023 15:28:05 +0200 Subject: [PATCH 002/200] Linux ruamel.yaml installation --- scripts/on_sd_start.sh | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/scripts/on_sd_start.sh b/scripts/on_sd_start.sh index 3afb19ba..e7f701b2 100755 --- a/scripts/on_sd_start.sh +++ b/scripts/on_sd_start.sh @@ -118,6 +118,22 @@ else fi fi +# install ruamel +if python ../scripts/check_modules.py ruamel.yaml; then + echo "ruamel.yaml has already been installed." +else + echo "Installing ruamel.yaml.." + + export PYTHONNOUSERSITE=1 + export PYTHONPATH="$INSTALL_ENV_DIR/lib/python3.8/site-packages" + + if python -m pip install ruamel.yaml==0.17.21 ; then + echo "Installed." + else + fail "Install failed for rich" + fi +fi + if python ../scripts/check_modules.py uvicorn fastapi ; then echo "Packages necessary for Easy Diffusion were already installed" else From 991f9cda4223519354a03b66745a9fcdca51f837 Mon Sep 17 00:00:00 2001 From: JeLuF Date: Sat, 22 Apr 2023 11:42:22 +0200 Subject: [PATCH 003/200] Add splash screen for testDiffusers users The splash screen will only be shown once. The splash screen version number can be used to roll out a new splash screen, which will also be shown only once. Clicking on the EasyAndroidLady icon shows the splash screen again. --- ui/index.html | 49 ++++++++++++++++++++++++++++++++++++++++++- ui/media/css/main.css | 18 ++++++++++++++++ ui/media/js/main.js | 15 +++++++++++++ 3 files changed, 81 insertions(+), 1 deletion(-) diff --git a/ui/index.html b/ui/index.html index 404d88af..0f163af0 100644 --- a/ui/index.html +++ b/ui/index.html @@ -30,7 +30,7 @@

Easy Diffusion - v2.5.33 + v2.5.33

@@ -399,6 +399,52 @@
+ diff --git a/ui/media/css/main.css b/ui/media/css/main.css index d2b1fc55..7d45c3ca 100644 --- a/ui/media/css/main.css +++ b/ui/media/css/main.css @@ -1310,6 +1310,31 @@ body.wait-pause { border-radius: 5px; } +#splash-screen li { + margin-bottom: 6px; +} + +#splash-screen a +{ + color: #ccf; + text-decoration: none; + font-weight: bold; +} + +#splash-screen a[href^="http"]::after, +#splash-screen a[href^="https://"]::after +{ + content: ""; + width: 11px; + height: 11px; + margin-left: 4px; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='lightblue' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E"); + background-position: center; + background-repeat: no-repeat; + background-size: contain; + display: inline-block; +} + .jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-title-c { color: var(--button-text-color); } From 99c99ee9e37b31b67576bfdfe1af77e2d9b0b312 Mon Sep 17 00:00:00 2001 From: patriceac <48073125+patriceac@users.noreply.github.com> Date: Thu, 25 May 2023 00:31:17 -0700 Subject: [PATCH 005/200] Plugin Manager An easy-to-use UI plugin manager. Pulls plugins from multiple repos, installs and updates plugins seamlessly, gives precedence to locally installed plugins (based on file names). Hope this one works for you. If you want to test-drive it before merging, you can download the below as a plugin here: https://github.com/patriceac/Easy-Diffusion-Plugins/blob/main/plugin-manager.plugin.js The URLs at the top of plugins.js might need to be updated. --- ui/index.html | 4 +- ui/media/css/plugins.css | 288 ++++++++++++ ui/media/js/plugins.js | 950 +++++++++++++++++++++++++++++++++++++++ ui/media/js/utils.js | 128 ++++++ 4 files changed, 1369 insertions(+), 1 deletion(-) create mode 100644 ui/media/css/plugins.css diff --git a/ui/index.html b/ui/index.html index be522689..412e92bb 100644 --- a/ui/index.html +++ b/ui/index.html @@ -16,6 +16,7 @@ + @@ -493,13 +494,13 @@ - + @@ -512,6 +513,7 @@ async function init() { await loadUIPlugins() await loadModifiers() await getSystemInfo() + await initPlugins() SD.init({ events: { diff --git a/ui/media/css/plugins.css b/ui/media/css/plugins.css new file mode 100644 index 00000000..2b8bf370 --- /dev/null +++ b/ui/media/css/plugins.css @@ -0,0 +1,288 @@ +.plugins-table { + display: flex; + flex-direction: column; + gap: 1px; +} + +.plugins-table > div { + background: var(--background-color2); + display: flex; + padding: 0px 4px; +} + +.plugins-table > div > div { + padding: 10px; + display: flex; + align-items: center; + justify-content: center; +} + +.plugins-table small { + color: rgb(153, 153, 153); +} + +.plugins-table > div > div:nth-child(1) { + font-size: 20px; + width: 45px; +} + +.plugins-table > div > div:nth-child(2) { + flex: 1; + flex-direction: column; + text-align: left; + justify-content: center; + align-items: start; + gap: 4px; +} + +.plugins-table > div > div:nth-child(3) { + text-align: right; +} + +.plugins-table > div:first-child { + border-radius: 12px 12px 0px 0px; +} + +.plugins-table > div:last-child { + border-radius: 0px 0px 12px 12px; +} + +.notifications-table { + display: flex; + flex-direction: column; + gap: 1px; +} + +.notifications-table > div { + background: var(--background-color2); + display: flex; + padding: 0px 4px; +} + +.notifications-table > div > div { + padding: 10px; + display: flex; + align-items: center; + justify-content: center; +} + +.notifications-table small { + color: rgb(153, 153, 153); +} + +.notifications-table > div > div:nth-child(1) { + flex: 1; + flex-direction: column; + text-align: left; + justify-content: center; + align-items: start; + gap: 4px; +} + +.notifications-table > div > div:nth-child(2) { + width: auto; +} + +.notifications-table > div:first-child { + border-radius: 12px 12px 0px 0px; +} + +.notifications-table > div:last-child { + border-radius: 0px 0px 12px 12px; +} + +.notification-error { + color: red; +} + +DIV.no-notification { + padding-top: 16px; + font-style: italic; +} + +.plugin-manager-intro { + margin: 0 0 16px 0; +} + +#plugin-filter { + box-sizing: border-box; + width: 100%; + margin: 4px 0 6px 0; + padding: 10px; +} + +#refresh-plugins { + box-sizing: border-box; + width: 100%; + padding: 0px; +} + +#refresh-plugins a { + cursor: pointer; +} + +#refresh-plugins a:active { + transition-duration: 0.1s; + position: relative; + top: 1px; + left: 1px; +} + +.plugin-installed-locally { + font-style: italic; + font-size: small; +} + +.plugin-source { + font-size: x-small; +} + +.plugin-warning { + color: orange; + font-size: smaller; +} + +.plugin-warning.hide { + display: none; +} + +.plugin-warning ul { + list-style: square; + margin: 0 0 8px 16px; + padding: 0; +} + +.plugin-warning li { + margin-left: 8px; + padding: 0; +} + +/* MODAL DIALOG */ +#pluginDialog-input-dialog { + position: fixed; + z-index: 1000; + top: 0; + left: 0; + width: 100%; + height: 100%; + display: none; +} + +.pluginDialog-dialog-overlay { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(32, 33, 36, 50%); +} + +.pluginDialog-dialog-box { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 80%; + max-width: 600px; + background: var(--background-color2); + border: solid 1px var(--background-color3); + border-radius: 6px; + box-shadow: 0px 0px 30px black; +} + +.pluginDialog-dialog-header { + display: flex; + align-items: center; + justify-content: space-between; + padding: 16px; +} + +.pluginDialog-dialog-header h2 { + margin: 0; +} + +.pluginDialog-dialog-close-button { + font-size: 24px; + font-weight: bold; + line-height: 1; + border: none; + background-color: transparent; + cursor: pointer; +} + +.pluginDialog-dialog-close-button:hover { + color: #555; +} + +.pluginDialog-dialog-content { + padding: 0 16px 0 16px; +} + +.pluginDialog-dialog-content textarea { + width: 100%; + height: 300px; + border-radius: var(--input-border-radius); + padding: 4px; + accent-color: var(--accent-color); + background: var(--input-background-color); + border: var(--input-border-size) solid var(--input-border-color); + color: var(--input-text-color); + font-size: 9pt; + resize: none; +} + +.pluginDialog-dialog-buttons { + display: flex; + justify-content: flex-end; + padding: 16px; +} + +.pluginDialog-dialog-buttons button { + margin-left: 8px; + padding: 8px 16px; + font-size: 16px; + border-radius: 4px; + /*background: var(--accent-color);*/ + /*border: var(--primary-button-border);*/ + /*color: rgb(255, 221, 255);*/ + background-color: #3071a9; + border: none; + cursor: pointer; +} + +.pluginDialog-dialog-buttons button:hover { + /*background: hsl(var(--accent-hue), 100%, 50%);*/ + background-color: #428bca; +} + +/* NOTIFICATION CENTER */ +#plugin-notification-button { + float: right; + margin-top: 30px; +} + +#plugin-notification-button:hover { + background: unset; +} + +#plugin-notification-button:active { + transition-duration: 0.1s; + position: relative; + top: 1px; + left: 1px; +} + +.plugin-notification-pill { + background-color: red; + border-radius: 50%; + color: white; + font-size: 10px; + font-weight: bold; + height: 12px; + line-height: 12px; + position: relative; + right: -8px; + text-align: center; + top: -20px; + width: 12px; +} diff --git a/ui/media/js/plugins.js b/ui/media/js/plugins.js index 85cc48d4..ef9c9f33 100644 --- a/ui/media/js/plugins.js +++ b/ui/media/js/plugins.js @@ -1,5 +1,8 @@ const PLUGIN_API_VERSION = "1.0" +const PLUGIN_CATALOG = 'https://raw.githubusercontent.com/patriceac/Easy-Diffusion-Plugins/main/plugins.json' +const PLUGIN_CATALOG_GITHUB = 'https://github.com/patriceac/Easy-Diffusion-Plugins/blob/main/plugins.json' + const PLUGINS = { /** * Register new buttons to show on each output image. @@ -78,3 +81,950 @@ async function loadUIPlugins() { console.log("error fetching plugin paths", e) } } + + +/* PLUGIN MANAGER */ +/* plugin tab */ +document.querySelector('.tab-container')?.insertAdjacentHTML('beforeend', ` + + Plugins + +`) + +document.querySelector('#tab-content-wrapper')?.insertAdjacentHTML('beforeend', ` +
+
+ Loading... +
+
+`) + +const tabPlugin = document.querySelector('#tab-plugin') +if (tabPlugin) { + linkTabContents(tabPlugin) +} + +const plugin = document.querySelector('#plugin') +plugin.innerHTML = ` +
+ + + + +
+

Plugin Manager

+
Changes take effect after reloading the page
+
+
+
` +const pluginsTable = document.querySelector("#plugin-manager-section .plugins-table") +const pluginNotificationTable = document.querySelector("#plugin-notification-list .notifications-table") +const pluginNoNotification = document.querySelector("#plugin-notification-list .no-notification") + +/* notification center */ +const pluginNotificationButton = document.getElementById("plugin-notification-button"); +const pluginNotificationList = document.getElementById("plugin-notification-list"); +const notificationPill = document.getElementById("notification-pill"); +const pluginManagerSection = document.getElementById("plugin-manager-section"); +let pluginNotifications; + +// Add event listener to show/hide the action center +pluginNotificationButton.addEventListener("click", function () { + // Hide the notification pill when the action center is opened + notificationPill.style.display = "none" + pluginNotifications.lastUpdated = Date.now() + + // save the notifications + setStorageData('notifications', JSON.stringify(pluginNotifications)) + + renderPluginNotifications() + + if (pluginNotificationList.style.display === "none") { + pluginNotificationList.style.display = "block" + pluginManagerSection.style.display = "none" + } else { + pluginNotificationList.style.display = "none" + pluginManagerSection.style.display = "block" + } +}) + +document.addEventListener("tabClick", (e) => { + if (e.detail.name == 'plugin') { + pluginNotificationList.style.display = "none" + pluginManagerSection.style.display = "block" + } +}) + +async function addPluginNotification(pluginNotifications, messageText, error) { + const now = Date.now() + pluginNotifications.entries.unshift({ date: now, text: messageText, error: error }); // add new entry to the beginning of the array + if (pluginNotifications.entries.length > 50) { + pluginNotifications.entries.length = 50 // limit array length to 50 entries + } + pluginNotifications.lastUpdated = now + notificationPill.style.display = "block" + // save the notifications + await setStorageData('notifications', JSON.stringify(pluginNotifications)) +} + +function timeAgo(inputDate) { + const now = new Date(); + const date = new Date(inputDate); + const diffInSeconds = Math.floor((now - date) / 1000); + const units = [ + { name: 'year', seconds: 31536000 }, + { name: 'month', seconds: 2592000 }, + { name: 'week', seconds: 604800 }, + { name: 'day', seconds: 86400 }, + { name: 'hour', seconds: 3600 }, + { name: 'minute', seconds: 60 }, + { name: 'second', seconds: 1 } + ]; + + for (const unit of units) { + const unitValue = Math.floor(diffInSeconds / unit.seconds); + if (unitValue > 0) { + return `${unitValue} ${unit.name}${unitValue > 1 ? 's' : ''} ago`; + } + } + + return 'just now'; +} + +function convertSeconds(seconds) { + const hours = Math.floor(seconds / 3600); + const minutes = Math.floor((seconds % 3600) / 60); + const remainingSeconds = seconds % 60; + + let timeParts = []; + if (hours === 1) { + timeParts.push(`${hours} hour`); + } else if (hours > 1) { + timeParts.push(`${hours} hours`); + } + if (minutes === 1) { + timeParts.push(`${minutes} minute`); + } else if (minutes > 1) { + timeParts.push(`${minutes} minutes`); + } + if (remainingSeconds === 1) { + timeParts.push(`${remainingSeconds} second`); + } else if (remainingSeconds > 1) { + timeParts.push(`${remainingSeconds} seconds`); + } + + return timeParts.join(', and '); +} + +function renderPluginNotifications() { + pluginNotificationTable.innerHTML = '' + + if (pluginNotifications.entries?.length > 0) { + pluginNoNotification.style.display = "none" + pluginNotificationTable.style.display = "block" + } + else { + pluginNoNotification.style.display = "block" + pluginNotificationTable.style.display = "none" + } + for (let i = 0; i < pluginNotifications.entries?.length; i++) { + const date = pluginNotifications.entries[i].date + const text = pluginNotifications.entries[i].text + const error = pluginNotifications.entries[i].error + const newRow = document.createElement('div') + + newRow.innerHTML = ` + ${text} +
${timeAgo(date)}
+ `; + pluginNotificationTable.appendChild(newRow) + } +} + +/* search box */ +function filterPlugins() { + let search = pluginFilter.value.toLowerCase(); + let searchTerms = search.split(' '); + let labels = pluginsTable.querySelectorAll("label.plugin-name"); + + for (let i = 0; i < labels.length; i++) { + let label = labels[i].innerText.toLowerCase(); + let match = true; + + for (let j = 0; j < searchTerms.length; j++) { + let term = searchTerms[j].trim(); + if (term && label.indexOf(term) === -1) { + match = false; + break; + } + } + + if (match) { + labels[i].closest('.plugin-container').style.display = "flex"; + } else { + labels[i].closest('.plugin-container').style.display = "none"; + } + } +} + +// Call debounce function on filterImageModifierList function with 200ms wait time. Thanks JeLuf! +const debouncedFilterPlugins = debounce(filterPlugins, 200); + +// add the searchbox +pluginsTable.insertAdjacentHTML('beforebegin', ``) +const pluginFilter = document.getElementById("plugin-filter") // search box + +// Add the debounced function to the keyup event listener +pluginFilter.addEventListener('keyup', debouncedFilterPlugins); + +// select the text on focus +pluginFilter.addEventListener('focus', function (event) { + pluginFilter.select() +}); + +// empty the searchbox on escape +pluginFilter.addEventListener('keydown', function (event) { + if (event.key === 'Escape') { + pluginFilter.value = ''; + filterPlugins(); + } +}); + +// focus on the search box upon tab selection +document.addEventListener("tabClick", (e) => { + if (e.detail.name == 'plugin') { + pluginFilter.focus() + } +}) + +// refresh link +pluginsTable.insertAdjacentHTML('afterend', `

Refresh plugins

+

(Plugin developers, add your plugins to plugins.json)

`) +const refreshPlugins = document.getElementById("refresh-plugins") +refreshPlugins.addEventListener("click", async function (event) { + event.preventDefault() + await initPlugins(true) +}) + +function showPluginToast(message, duration = 5000, error = false, addNotification = true) { + if (addNotification === true) { + addPluginNotification(pluginNotifications, message, error) + } + try { + showToast(message, duration, error) + } catch (error) { + console.error('Error while trying to show toast:', error); + } +} + +function matchPluginFileNames(fileName1, fileName2) { + const regex = /^(.+?)(?:-\d+(\.\d+)*)?\.plugin\.js$/; + const match1 = fileName1.match(regex); + const match2 = fileName2.match(regex); + + if (match1 && match2 && match1[1] === match2[1]) { + return true; // the two file names match + } else { + return false; // the two file names do not match + } +} + +function extractFilename(filepath) { + // Normalize the path separators to forward slashes and make the file names lowercase + const normalizedFilePath = filepath.replace(/\\/g, "/").toLowerCase(); + + // Strip off the path from the file name + const fileName = normalizedFilePath.substring(normalizedFilePath.lastIndexOf("/") + 1); + + return fileName +} + +function checkFileNameInArray(paths, filePath) { + // Strip off the path from the file name + const fileName = extractFilename(filePath); + + // Check if the file name exists in the array of paths + return paths.some(path => { + // Strip off the path from the file name + const baseName = extractFilename(path); + + // Check if the file names match and return the result as a boolean + return matchPluginFileNames(fileName, baseName); + }); +} + +function isGitHub(url) { + return url.startsWith("https://raw.githubusercontent.com/") === true +} + +/* fill in the plugins table */ +function getIncompatiblePlugins(pluginId) { + const enabledPlugins = plugins.filter(plugin => plugin.enabled && plugin.id !== pluginId); + const incompatiblePlugins = enabledPlugins.filter(plugin => plugin.compatIssueIds?.includes(pluginId)); + const pluginNames = incompatiblePlugins.map(plugin => plugin.name); + if (pluginNames.length === 0) { + return null; + } + const pluginNamesList = pluginNames.map(name => `
  • ${name}
    • `).join(''); + return `
      ${pluginNamesList}
    `; +} + +async function initPluginTable(plugins) { + pluginsTable.innerHTML = '' + plugins.sort((a, b) => a.name.localeCompare(b.name, undefined, { sensitivity: 'base' })) + plugins.forEach(plugin => { + const name = plugin.name + const author = plugin.author ? ', by ' + plugin.author : '' + const version = plugin.version ? ' (version: ' + plugin.version + ')' : '' + const warning = getIncompatiblePlugins(plugin.id) ? `This plugin might conflict with:${getIncompatiblePlugins(plugin.id)}` : '' + const note = plugin.description ? `${plugin.description.replaceAll('\n', '
    ')}    ` : `No description`; + const icon = plugin.icon ? `` : ''; + const newRow = document.createElement('div') + const localPluginFound = checkFileNameInArray(localPlugins, plugin.url) + + newRow.innerHTML = ` +
    ${icon}
    +
    ${warning}${note}Source: ${extractFilename(plugin.url)}
    +
    + ${localPluginFound ? "Installed locally" : + (plugin.localInstallOnly ? 'Download and
    install manually    ' : + (isGitHub(plugin.url) ? + '' : + '' + ) + ) + } +
    `; + newRow.classList.add('plugin-container') + //console.log(plugin.id, plugin.localInstallOnly) + pluginsTable.appendChild(newRow) + const pluginManualInstall = pluginsTable.querySelector('#plugin-' + plugin.id + '-install') + updateManualInstallButtonCaption() + + // checkbox event handler + const pluginToggle = pluginsTable.querySelector('#plugin-' + plugin.id) + if (pluginToggle !== null) { + pluginToggle.checked = plugin.enabled // set initial state of checkbox + pluginToggle.addEventListener('change', async () => { + const container = pluginToggle.closest(".plugin-container"); + const warningElement = container.querySelector(".plugin-warning"); + + // if the plugin got enabled, download the plugin's code + plugin.enabled = pluginToggle.checked + if (plugin.enabled) { + const pluginSource = await getDocument(plugin.url); + if (pluginSource !== null) { + // Store the current scroll position before navigating away + const currentPosition = window.pageYOffset; + initPluginTable(plugins) + // When returning to the page, set the scroll position to the stored value + window.scrollTo(0, currentPosition); + warningElement?.classList.remove("hide"); + plugin.code = pluginSource + loadPlugins([plugin]) + console.log(`Plugin ${plugin.name} installed`); + showPluginToast("Plugin " + plugin.name + " installed"); + } + else { + plugin.enabled = false + pluginToggle.checked = false + console.error(`Couldn't download plugin ${plugin.name}`); + showPluginToast("Failed to install " + plugin.name + " (Couldn't fetch " + extractFilename(plugin.url) + ")", 5000, true); + } + } else { + warningElement?.classList.add("hide"); + // Store the current scroll position before navigating away + const currentPosition = window.pageYOffset; + initPluginTable(plugins) + // When returning to the page, set the scroll position to the stored value + window.scrollTo(0, currentPosition); + console.log(`Plugin ${plugin.name} uninstalled`); + showPluginToast("Plugin " + plugin.name + " uninstalled"); + } + await setStorageData('plugins', JSON.stringify(plugins)) + }) + } + + // manual install event handler + if (pluginManualInstall !== null) { + pluginManualInstall.addEventListener('click', async () => { + pluginDialogOpenDialog(inputOK, inputCancel) + pluginDialogTextarea.value = plugin.code ? plugin.code : '' + pluginDialogTextarea.select() + pluginDialogTextarea.focus() + }) + } + // Dialog OK + async function inputOK() { + let pluginSource = pluginDialogTextarea.value + // remove empty lines and trim existing lines + plugin.code = pluginSource + if (pluginSource.trim() !== '') { + plugin.enabled = true + console.log(`Plugin ${plugin.name} installed`); + showPluginToast("Plugin " + plugin.name + " installed"); + } + else { + plugin.enabled = false + console.log(`No code provided for plugin ${plugin.name}, disabling the plugin`); + showPluginToast("No code provided for plugin " + plugin.name + ", disabling the plugin"); + } + updateManualInstallButtonCaption() + await setStorageData('plugins', JSON.stringify(plugins)) + } + // Dialog Cancel + async function inputCancel() { + plugin.enabled = false + console.log(`Installation of plugin ${plugin.name} cancelled`); + showPluginToast("Cancelled installation of " + plugin.name); + } + // update button caption + function updateManualInstallButtonCaption() { + if (pluginManualInstall !== null) { + pluginManualInstall.innerHTML = plugin.code === undefined || plugin.code.trim() === '' ? 'Install' : 'Edit' + } + } + }) + prettifyInputs(pluginsTable) + filterPlugins() +} + +/* version management. Thanks Madrang! */ +const parseVersion = function (versionString, options = {}) { + if (typeof versionString === "undefined") { + throw new Error("versionString is undefined."); + } + if (typeof versionString !== "string") { + throw new Error("versionString is not a string."); + } + const lexicographical = options && options.lexicographical; + const zeroExtend = options && options.zeroExtend; + let versionParts = versionString.split('.'); + function isValidPart(x) { + const re = (lexicographical ? /^\d+[A-Za-z]*$/ : /^\d+$/); + return re.test(x); + } + + if (!versionParts.every(isValidPart)) { + throw new Error("Version string is invalid."); + } + + if (zeroExtend) { + while (versionParts.length < 4) { + versionParts.push("0"); + } + } + if (!lexicographical) { + versionParts = versionParts.map(Number); + } + return versionParts; +}; + +const versionCompare = function (v1, v2, options = {}) { + if (typeof v1 == "undefined") { + throw new Error("vi is undefined."); + } + if (typeof v2 === "undefined") { + throw new Error("v2 is undefined."); + } + + let v1parts; + if (typeof v1 === "string") { + v1parts = parseVersion(v1, options); + } else if (Array.isArray(v1)) { + v1parts = [...v1]; + if (!v1parts.every(p => typeof p === "number" && p !== NaN)) { + throw new Error("v1 part array does not only contains numbers."); + } + } else { + throw new Error("v1 is of an unexpected type: " + typeof v1); + } + + let v2parts; + if (typeof v2 === "string") { + v2parts = parseVersion(v2, options); + } else if (Array.isArray(v2)) { + v2parts = [...v2]; + if (!v2parts.every(p => typeof p === "number" && p !== NaN)) { + throw new Error("v2 part array does not only contains numbers."); + } + } else { + throw new Error("v2 is of an unexpected type: " + typeof v2); + } + + while (v1parts.length < v2parts.length) { + v1parts.push("0"); + } + while (v2parts.length < v1parts.length) { + v2parts.push("0"); + } + + for (let i = 0; i < v1parts.length; ++i) { + if (v2parts.length == i) { + return 1; + } + if (v1parts[i] == v2parts[i]) { + continue; + } else if (v1parts[i] > v2parts[i]) { + return 1; + } else { + return -1; + } + } + return 0; +}; + +function filterPluginsByMinEDVersion(plugins, EDVersion) { + const filteredPlugins = plugins.filter(plugin => { + if (plugin.minEDVersion) { + return versionCompare(plugin.minEDVersion, EDVersion) <= 0; + } + return true; + }); + + return filteredPlugins; +} + +function extractVersionNumber(elem) { + const versionStr = elem.innerHTML; + const regex = /v(\d+\.\d+\.\d+)/; + const matches = regex.exec(versionStr); + if (matches && matches.length > 1) { + return matches[1]; + } else { + return null; + } +} +const EasyDiffusionVersion = extractVersionNumber(document.querySelector('#top-nav > #logo')) + +/* PLUGIN MANAGEMENT */ +let plugins +let localPlugins +let initPluginsInProgress = false + +async function initPlugins(refreshPlugins = false) { + let pluginsLoaded + if (initPluginsInProgress === true) { + return + } + initPluginsInProgress = true + + const res = await fetch('/get/ui_plugins') + if (!res.ok) { + console.error(`Error HTTP${res.status} while loading plugins list. - ${res.statusText}`) + } + else { + localPlugins = await res.json() + } + + if (refreshPlugins === false) { + // load the notifications + pluginNotifications = await getStorageData('notifications') + if (typeof pluginNotifications === "string") { + try { + pluginNotifications = JSON.parse(pluginNotifications) + } catch (e) { + console.error("Failed to parse pluginNotifications", e); + pluginNotifications = {}; + pluginNotifications.entries = []; + } + } + if (pluginNotifications !== undefined) { + if (pluginNotifications.entries && pluginNotifications.entries.length > 0 && pluginNotifications.entries[0].date && pluginNotifications.lastUpdated <= pluginNotifications.entries[0].date) { + notificationPill.style.display = "block"; + } + } else { + pluginNotifications = {}; + pluginNotifications.entries = []; + } + + // try and load plugins from local cache + plugins = await getStorageData('plugins') + if (plugins !== undefined) { + plugins = JSON.parse(plugins) + + // remove duplicate entries if any (should not happen) + plugins = deduplicatePluginsById(plugins) + + // remove plugins that don't meet the min ED version requirement + plugins = filterPluginsByMinEDVersion(plugins, EasyDiffusionVersion) + + // remove from plugins the entries that don't have mandatory fields (id, name, url) + plugins = plugins.filter((plugin) => { return plugin.id !== '' && plugin.name !== '' && plugin.url !== ''; }); + + // populate the table + initPluginTable(plugins) + await loadPlugins(plugins) + pluginsLoaded = true + } + else { + plugins = [] + pluginsLoaded = false + } + } + + // update plugins asynchronously (updated versions will be available next time the UI is loaded) + if (refreshAllowed()) { + let pluginCatalog = await getDocument(PLUGIN_CATALOG) + if (pluginCatalog !== null) { + let parseError = false; + try { + pluginCatalog = JSON.parse(pluginCatalog); + console.log('Plugin catalog successfully downloaded'); + } catch (error) { + console.error('Error parsing plugin catalog:', error); + parseError = true; + } + + if (!parseError) { + await downloadPlugins(pluginCatalog, plugins, refreshPlugins) + + // update compatIssueIds + updateCompatIssueIds() + + // remove plugins that don't meet the min ED version requirement + plugins = filterPluginsByMinEDVersion(plugins, EasyDiffusionVersion) + + // remove from plugins the entries that don't have mandatory fields (id, name, url) + plugins = plugins.filter((plugin) => { return plugin.id !== '' && plugin.name !== '' && plugin.url !== ''; }); + + // remove from plugins the entries that no longer exist in the catalog + plugins = plugins.filter((plugin) => { return pluginCatalog.some((p) => p.id === plugin.id) }); + + if (pluginCatalog.length > plugins.length) { + const newPlugins = pluginCatalog.filter((plugin) => { + return !plugins.some((p) => p.id === plugin.id); + }); + + newPlugins.forEach((plugin, index) => { + setTimeout(() => { + showPluginToast(`New plugin "${plugin.name}" is available.`); + }, (index + 1) * 1000); + }); + } + + let pluginsJson; + try { + pluginsJson = JSON.stringify(plugins); // attempt to parse plugins to JSON + } catch (error) { + console.error('Error converting plugins to JSON:', error); + } + + if (pluginsJson) { // only store the data if pluginsJson is not null or undefined + await setStorageData('plugins', pluginsJson) + } + + // refresh the display of the plugins table + initPluginTable(plugins) + if (pluginsLoaded && pluginsLoaded === false) { + loadPlugins(plugins) + } + } + } + } + else { + if (refreshPlugins) { + showPluginToast('Plugins have been refreshed recently, refresh will be available in ' + convertSeconds(getTimeUntilNextRefresh()), 5000, true, false) + } + } + initPluginsInProgress = false +} + +function updateMetaTagPlugins(plugin) { + // Update the meta tag with the list of loaded plugins + let metaTag = document.querySelector('meta[name="plugins"]'); + if (metaTag === null) { + metaTag = document.createElement('meta'); + metaTag.name = 'plugins'; + document.head.appendChild(metaTag); + } + const pluginArray = [...(metaTag.content ? metaTag.content.split(',') : []), plugin.id]; + metaTag.content = pluginArray.join(','); +} + +function updateCompatIssueIds() { + // Loop through each plugin + plugins.forEach(plugin => { + // Check if the plugin has `compatIssueIds` property + if (plugin.compatIssueIds !== undefined) { + // Loop through each of the `compatIssueIds` + plugin.compatIssueIds.forEach(issueId => { + // Find the plugin with the corresponding `issueId` + const issuePlugin = plugins.find(p => p.id === issueId); + // If the corresponding plugin is found, initialize its `compatIssueIds` property with an empty array if it's undefined + if (issuePlugin) { + if (issuePlugin.compatIssueIds === undefined) { + issuePlugin.compatIssueIds = []; + } + // If the current plugin's ID is not already in the `compatIssueIds` array, add it + if (!issuePlugin.compatIssueIds.includes(plugin.id)) { + issuePlugin.compatIssueIds.push(plugin.id); + } + } + }); + } else { + // If the plugin doesn't have `compatIssueIds` property, initialize it with an empty array + plugin.compatIssueIds = []; + } + }); +} + +function deduplicatePluginsById(plugins) { + const seenIds = new Set(); + const deduplicatedPlugins = []; + + for (const plugin of plugins) { + if (!seenIds.has(plugin.id)) { + seenIds.add(plugin.id); + deduplicatedPlugins.push(plugin); + } else { + // favor dupes that have enabled == true + const index = deduplicatedPlugins.findIndex(p => p.id === plugin.id); + if (index >= 0) { + if (plugin.enabled) { + deduplicatedPlugins[index] = plugin; + } + } + } + } + + return deduplicatedPlugins; +} + +async function loadPlugins(plugins) { + for (let i = 0; i < plugins.length; i++) { + const plugin = plugins[i]; + if (plugin.enabled === true && plugin.localInstallOnly !== true) { + const localPluginFound = checkFileNameInArray(localPlugins, plugin.url); + if (!localPluginFound) { + try { + // Indirect eval to work around sloppy plugin implementations + const indirectEval = { eval }; + console.log("Loading plugin " + plugin.name); + indirectEval.eval(plugin.code); + console.log("Plugin " + plugin.name + " loaded"); + await updateMetaTagPlugins(plugin); // add plugin to the meta tag + } catch (err) { + showPluginToast("Error loading plugin " + plugin.name + " (" + err.message + ")", null, true); + console.error("Error loading plugin " + plugin.name + ": " + err.message); + } + } else { + console.log("Skipping plugin " + plugin.name + " (installed locally)"); + } + } + } +} + +async function getFileHash(url) { + const regex = /^https:\/\/raw\.githubusercontent\.com\/(?[^/]+)\/(?[^/]+)\/(?[^/]+)\/(?.+)$/; + const match = url.match(regex); + if (!match) { + console.error('Invalid GitHub repository URL.'); + return Promise.resolve(null); + } + const owner = match.groups.owner; + const repo = match.groups.repo; + const branch = match.groups.branch; + const filePath = match.groups.filePath; + const apiUrl = `https://api.github.com/repos/${owner}/${repo}/contents/${filePath}?ref=${branch}`; + + try { + const response = await fetch(apiUrl); + if (!response.ok) { + throw new Error(`HTTP error! status: ${response.status}, url: ${apiUrl}`); + } + const data = await response.json(); + return data.sha; + } catch (error) { + console.error('Error fetching data from url:', apiUrl, 'Error:', error); + return null; + } +} + +// only allow two refresh per hour +function getTimeUntilNextRefresh() { + const lastRuns = JSON.parse(localStorage.getItem('lastRuns') || '[]'); + const currentTime = new Date().getTime(); + const numRunsLast60Min = lastRuns.filter(run => currentTime - run <= 60 * 60 * 1000).length; + + if (numRunsLast60Min >= 2) { + return 3600 - Math.round((currentTime - lastRuns[lastRuns.length - 1]) / 1000); + } + + return 0; +} + +function refreshAllowed() { + const timeUntilNextRefresh = getTimeUntilNextRefresh(); + + if (timeUntilNextRefresh > 0) { + console.log(`Next refresh available in ${timeUntilNextRefresh} seconds`); + return false; + } + + const lastRuns = JSON.parse(localStorage.getItem('lastRuns') || '[]'); + const currentTime = new Date().getTime(); + lastRuns.push(currentTime); + localStorage.setItem('lastRuns', JSON.stringify(lastRuns)); + return true; +} + +async function downloadPlugins(pluginCatalog, plugins, refreshPlugins) { + // download the plugins as needed + for (const plugin of pluginCatalog) { + //console.log(plugin.id, plugin.url) + const existingPlugin = plugins.find(p => p.id === plugin.id); + // get the file hash in the GitHub repo + let sha + if (isGitHub(plugin.url) && existingPlugin?.enabled === true) { + sha = await getFileHash(plugin.url) + } + if (plugin.localInstallOnly !== true && isGitHub(plugin.url) && existingPlugin?.enabled === true && (refreshPlugins || (existingPlugin.sha !== undefined && existingPlugin.sha !== null && existingPlugin.sha !== sha) || existingPlugin?.code === undefined)) { + const pluginSource = await getDocument(plugin.url); + if (pluginSource !== null && pluginSource !== existingPlugin.code) { + console.log(`Plugin ${plugin.name} updated`); + showPluginToast("Plugin " + plugin.name + " updated", 5000); + // Update the corresponding plugin + const updatedPlugin = { + ...existingPlugin, + icon: plugin.icon ? plugin.icon : "fa-puzzle-piece", + id: plugin.id, + name: plugin.name, + description: plugin.description, + url: plugin.url, + localInstallOnly: Boolean(plugin.localInstallOnly), + version: plugin.version, + code: pluginSource, + author: plugin.author, + sha: sha, + compatIssueIds: plugin.compatIssueIds + }; + // Replace the old plugin in the plugins array + const pluginIndex = plugins.indexOf(existingPlugin); + if (pluginIndex >= 0) { + plugins.splice(pluginIndex, 1, updatedPlugin); + } else { + plugins.push(updatedPlugin); + } + } + } + else if (existingPlugin !== undefined) { + // Update the corresponding plugin's metadata + const updatedPlugin = { + ...existingPlugin, + icon: plugin.icon ? plugin.icon : "fa-puzzle-piece", + id: plugin.id, + name: plugin.name, + description: plugin.description, + url: plugin.url, + localInstallOnly: Boolean(plugin.localInstallOnly), + version: plugin.version, + author: plugin.author, + compatIssueIds: plugin.compatIssueIds + }; + // Replace the old plugin in the plugins array + const pluginIndex = plugins.indexOf(existingPlugin); + plugins.splice(pluginIndex, 1, updatedPlugin); + } + else { + plugins.push(plugin); + } + } +} + +async function getDocument(url) { + try { + let response = await fetch(url === PLUGIN_CATALOG ? PLUGIN_CATALOG : url, { cache: "no-cache" }); + if (!response.ok) { + throw new Error(`Response error: ${response.status} ${response.statusText}`); + } + let document = await response.text(); + return document; + } catch (error) { + showPluginToast("Couldn't fetch " + extractFilename(url) + " (" + error + ")", null, true); + console.error(error); + return null; + } +} + +/* MODAL DIALOG */ +const pluginDialogDialog = document.createElement("div"); +pluginDialogDialog.id = "pluginDialog-input-dialog"; +pluginDialogDialog.style.display = "none"; + +pluginDialogDialog.innerHTML = ` +
    +
    +
    +

    Paste the plugin's code here

    + +
    +
    + +
    +
    + + +
    +
    +`; + +document.body.appendChild(pluginDialogDialog); + +const pluginDialogOverlay = document.querySelector(".pluginDialog-dialog-overlay"); +const pluginDialogOkButton = document.getElementById("pluginDialog-input-ok"); +const pluginDialogCancelButton = document.getElementById("pluginDialog-input-cancel"); +const pluginDialogCloseButton = document.querySelector(".pluginDialog-dialog-close-button"); +const pluginDialogTextarea = document.getElementById("pluginDialog-input-textarea"); +let callbackOK +let callbackCancel + +function pluginDialogOpenDialog(inputOK, inputCancel) { + pluginDialogDialog.style.display = "block"; + callbackOK = inputOK + callbackCancel = inputCancel +} + +function pluginDialogCloseDialog() { + pluginDialogDialog.style.display = "none"; +} + +function pluginDialogHandleOkClick() { + const userInput = pluginDialogTextarea.value; + // Do something with the user input + callbackOK() + pluginDialogCloseDialog(); +} + +function pluginDialogHandleCancelClick() { + callbackCancel() + pluginDialogCloseDialog(); +} + +function pluginDialogHandleOverlayClick(event) { + if (event.target === pluginDialogOverlay) { + pluginDialogCloseDialog(); + } +} + +function pluginDialogHandleKeyDown(event) { + if ((event.key === "Enter" && event.ctrlKey) || event.key === "Escape") { + event.preventDefault(); + if (event.key === "Enter" && event.ctrlKey) { + pluginDialogHandleOkClick(); + } else { + pluginDialogCloseDialog(); + } + } +} + +pluginDialogTextarea.addEventListener("keydown", pluginDialogHandleKeyDown); +pluginDialogOkButton.addEventListener("click", pluginDialogHandleOkClick); +pluginDialogCancelButton.addEventListener("click", pluginDialogHandleCancelClick); +pluginDialogCloseButton.addEventListener("click", pluginDialogCloseDialog); +pluginDialogOverlay.addEventListener("click", pluginDialogHandleOverlayClick); diff --git a/ui/media/js/utils.js b/ui/media/js/utils.js index d1578d8e..324600f2 100644 --- a/ui/media/js/utils.js +++ b/ui/media/js/utils.js @@ -841,6 +841,7 @@ function createTab(request) { }) } + /* TOAST NOTIFICATIONS */ function showToast(message, duration = 5000, error = false) { const toast = document.createElement("div"); @@ -897,3 +898,130 @@ function showToast(message, duration = 5000, error = false) { // Remove the toast after specified duration setTimeout(removeToast, duration); } + + +/* STORAGE MANAGEMENT */ +// Request persistent storage +async function requestPersistentStorage() { + if (navigator.storage && navigator.storage.persist) { + const isPersisted = await navigator.storage.persist(); + console.log(`Persisted storage granted: ${isPersisted}`); + } +} +requestPersistentStorage() + +// Open a database +async function openDB() { + return new Promise((resolve, reject) => { + let request = indexedDB.open("EasyDiffusionSettingsDatabase", 1); + request.addEventListener("upgradeneeded", function () { + let db = request.result; + db.createObjectStore("EasyDiffusionSettings", { keyPath: "id" }); + }); + request.addEventListener("success", function () { + resolve(request.result); + }); + request.addEventListener("error", function () { + reject(request.error); + }); + }); +} + +// Function to write data to the object store +async function setStorageData(key, value) { + return openDB().then(db => { + let tx = db.transaction("EasyDiffusionSettings", "readwrite"); + let store = tx.objectStore("EasyDiffusionSettings"); + let data = { id: key, value: value }; + return new Promise((resolve, reject) => { + let request = store.put(data); + request.addEventListener("success", function () { + resolve(request.result); + }); + request.addEventListener("error", function () { + reject(request.error); + }); + }); + }); +} + +// Function to retrieve data from the object store +async function getStorageData(key) { + return openDB().then(db => { + let tx = db.transaction("EasyDiffusionSettings", "readonly"); + let store = tx.objectStore("EasyDiffusionSettings"); + return new Promise((resolve, reject) => { + let request = store.get(key); + request.addEventListener("success", function () { + if (request.result) { + resolve(request.result.value); + } else { + // entry not found + resolve(); + } + }); + request.addEventListener("error", function () { + reject(request.error); + }); + }); + }); +} + +// indexedDB debug functions +async function getAllKeys() { + return openDB().then(db => { + let tx = db.transaction("EasyDiffusionSettings", "readonly"); + let store = tx.objectStore("EasyDiffusionSettings"); + let keys = []; + return new Promise((resolve, reject) => { + store.openCursor().onsuccess = function (event) { + let cursor = event.target.result; + if (cursor) { + keys.push(cursor.key); + cursor.continue(); + } else { + resolve(keys); + } + }; + }); + }); +} + +async function logAllStorageKeys() { + try { + let keys = await getAllKeys(); + console.log("All keys:", keys); + for (const k of keys) { + console.log(k, await getStorageData(k)) + } + } catch (error) { + console.error("Error retrieving keys:", error); + } +} + +// USE WITH CARE - THIS MAY DELETE ALL ENTRIES +async function deleteKeys(keyToDelete) { + let confirmationMessage = keyToDelete + ? `This will delete the template with key "${keyToDelete}". Continue?` + : "This will delete ALL templates. Continue?"; + if (confirm(confirmationMessage)) { + return openDB().then(db => { + let tx = db.transaction("EasyDiffusionSettings", "readwrite"); + let store = tx.objectStore("EasyDiffusionSettings"); + return new Promise((resolve, reject) => { + store.openCursor().onsuccess = function (event) { + let cursor = event.target.result; + if (cursor) { + if (!keyToDelete || cursor.key === keyToDelete) { + cursor.delete(); + } + cursor.continue(); + } else { + // refresh the dropdown and resolve + resolve(); + } + }; + }); + }); + } +} From a548c026b1fa01822ae9518d0de10a0d811003bf Mon Sep 17 00:00:00 2001 From: patriceac <48073125+patriceac@users.noreply.github.com> Date: Thu, 25 May 2023 00:32:48 -0700 Subject: [PATCH 006/200] Revert "Fix face restoration model selection" This reverts commit a5a1d3358918626e2860db1effcabea3787fee2b. --- ui/easydiffusion/model_manager.py | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/ui/easydiffusion/model_manager.py b/ui/easydiffusion/model_manager.py index a0b2489a..2bb4852d 100644 --- a/ui/easydiffusion/model_manager.py +++ b/ui/easydiffusion/model_manager.py @@ -107,18 +107,12 @@ def resolve_model_to_use(model_name: str = None, model_type: str = None): def reload_models_if_necessary(context: Context, task_data: TaskData): - if hasattr(task_data, 'use_face_correction') and task_data.use_face_correction: - face_correction_model = "codeformer" if "codeformer" in task_data.use_face_correction.lower() else "gfpgan" - face_correction_value = task_data.use_face_correction - else: - face_correction_model = "gfpgan" - face_correction_value = None - + face_correction_model = "codeformer" if "codeformer" in task_data.use_face_correction.lower() else "gfpgan" model_paths_in_req = { "stable-diffusion": task_data.use_stable_diffusion_model, "vae": task_data.use_vae_model, "hypernetwork": task_data.use_hypernetwork_model, - face_correction_model: face_correction_value, + face_correction_model: task_data.use_face_correction, "realesrgan": task_data.use_upscale, "nsfw_checker": True if task_data.block_nsfw else None, "lora": task_data.use_lora_model, From 3a059bb919b63b77fbddf383d9124d492bdc7fec Mon Sep 17 00:00:00 2001 From: patriceac <48073125+patriceac@users.noreply.github.com> Date: Thu, 25 May 2023 00:32:57 -0700 Subject: [PATCH 007/200] Revert "Support for CodeFormer" This reverts commit a25364732b3f74dbfd5083cc4d7a0f84ccc5d9d5. --- ui/easydiffusion/model_manager.py | 3 +-- ui/easydiffusion/renderer.py | 4 +--- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/ui/easydiffusion/model_manager.py b/ui/easydiffusion/model_manager.py index 2bb4852d..7bf56575 100644 --- a/ui/easydiffusion/model_manager.py +++ b/ui/easydiffusion/model_manager.py @@ -107,12 +107,11 @@ def resolve_model_to_use(model_name: str = None, model_type: str = None): def reload_models_if_necessary(context: Context, task_data: TaskData): - face_correction_model = "codeformer" if "codeformer" in task_data.use_face_correction.lower() else "gfpgan" model_paths_in_req = { "stable-diffusion": task_data.use_stable_diffusion_model, "vae": task_data.use_vae_model, "hypernetwork": task_data.use_hypernetwork_model, - face_correction_model: task_data.use_face_correction, + "gfpgan": task_data.use_face_correction, "realesrgan": task_data.use_upscale, "nsfw_checker": True if task_data.block_nsfw else None, "lora": task_data.use_lora_model, diff --git a/ui/easydiffusion/renderer.py b/ui/easydiffusion/renderer.py index e1176c8b..f685d038 100644 --- a/ui/easydiffusion/renderer.py +++ b/ui/easydiffusion/renderer.py @@ -158,9 +158,7 @@ def filter_images(task_data: TaskData, images: list, user_stopped): filters_to_apply = [] if task_data.block_nsfw: filters_to_apply.append("nsfw_checker") - if task_data.use_face_correction and "codeformer" in task_data.use_face_correction.lower(): - filters_to_apply.append("codeformer") - elif task_data.use_face_correction and "gfpgan" in task_data.use_face_correction.lower(): + if task_data.use_face_correction and "gfpgan" in task_data.use_face_correction.lower(): filters_to_apply.append("gfpgan") if task_data.use_upscale and "realesrgan" in task_data.use_upscale.lower(): filters_to_apply.append("realesrgan") From e213f6cb9559a16fa69a227363924cc19ce586a6 Mon Sep 17 00:00:00 2001 From: ManInDark <61268856+ManInDark@users.noreply.github.com> Date: Mon, 12 Jun 2023 12:48:52 +0200 Subject: [PATCH 008/200] Added calculation as to how many images will be generated with given prompts. --- ui/media/js/main.js | 65 ++++++++++++++++++++++++++++++++++++++++++-- ui/media/js/utils.js | 4 +++ 2 files changed, 67 insertions(+), 2 deletions(-) diff --git a/ui/media/js/main.js b/ui/media/js/main.js index b44af102..cb516a37 100644 --- a/ui/media/js/main.js +++ b/ui/media/js/main.js @@ -1327,6 +1327,43 @@ function getPrompts(prompts) { return promptsToMake } +function getPromptsNumber(prompts) { + if (typeof prompts === "undefined") { + prompts = promptField.value + } + if (prompts.trim() === "" && activeTags.length === 0) { + return [""] + } + + let promptsToMake = [] + let numberOfPrompts = 0 + if (prompts.trim() !== "") { // this needs to stay sort of the same, as the prompts have to be passed through to the other functions + prompts = prompts.split("\n") + prompts = prompts.map((prompt) => prompt.trim()) + prompts = prompts.filter((prompt) => prompt !== "") + + promptsToMake = applySetOperator(prompts) // switched those around as Set grows in a linear fashion and permute in 2^n, and one has to be computed for the other to be calculated + numberOfPrompts = applyPermuteOperatorNumber(promptsToMake) + } + const newTags = activeTags.filter((tag) => tag.inactive === undefined || tag.inactive === false) + if (newTags.length > 0) { + const promptTags = newTags.map((x) => x.name).join(", ") + if (numberOfPrompts > 0) { + // promptsToMake = promptsToMake.map((prompt) => `${prompt}, ${promptTags}`) + // nothing changes, as all prompts just get modified + } else { + // promptsToMake.push(promptTags) + numberOfPrompts = 1 + } + } + + // Why is this applied twice? It does not do anything here, as everything should have already been done earlier + // promptsToMake = applyPermuteOperator(promptsToMake) + // promptsToMake = applySetOperator(promptsToMake) + + return numberOfPrompts +} + function applySetOperator(prompts) { let promptsToMake = [] let braceExpander = new BraceExpander() @@ -1338,7 +1375,7 @@ function applySetOperator(prompts) { return promptsToMake } -function applyPermuteOperator(prompts) { +function applyPermuteOperator(prompts) { // prompts is array of input, trimmed, filtered and split by \n let promptsToMake = [] prompts.forEach((prompt) => { let promptMatrix = prompt.split("|") @@ -1357,6 +1394,26 @@ function applyPermuteOperator(prompts) { return promptsToMake } +// returns how many prompts would have to be made with the given prompts +function applyPermuteOperatorNumber(prompts) { // prompts is array of input, trimmed, filtered and split by \n + let numberOfPrompts = 0 + prompts.forEach((prompt) => { + let promptCounter = 1 + let promptMatrix = prompt.split("|") + promptMatrix.shift() + + promptMatrix = promptMatrix.map((p) => p.trim()) + promptMatrix = promptMatrix.filter((p) => p !== "") + + if (promptMatrix.length > 0) { + promptCounter *= permutePromptsNumber(promptMatrix) + } + numberOfPrompts += promptCounter + }) + + return numberOfPrompts +} + function permutePrompts(promptBase, promptMatrix) { let prompts = [] let permutations = permute(promptMatrix) @@ -1378,6 +1435,10 @@ function permutePrompts(promptBase, promptMatrix) { return prompts } +function permutePromptsNumber(promptMatrix) { // this should calculate how many different prompts can be made with the prompt matrix + return permuteNumber(promptMatrix) +} + // create a file name with embedded prompt and metadata // for easier cateloging and comparison function createFileName(prompt, seed, steps, guidance, outputFormat) { @@ -1546,7 +1607,7 @@ heightField.addEventListener("change", onDimensionChange) function renameMakeImageButton() { let totalImages = - Math.max(parseInt(numOutputsTotalField.value), parseInt(numOutputsParallelField.value)) * getPrompts().length + Math.max(parseInt(numOutputsTotalField.value), parseInt(numOutputsParallelField.value)) * getPromptsNumber() let imageLabel = "Image" if (totalImages > 1) { imageLabel = totalImages + " Images" diff --git a/ui/media/js/utils.js b/ui/media/js/utils.js index 871ba714..111a12e1 100644 --- a/ui/media/js/utils.js +++ b/ui/media/js/utils.js @@ -153,6 +153,10 @@ function permute(arr) { return permutations } +function permuteNumber(arr) { + return Math.pow(2, arr.length) +} + // https://stackoverflow.com/a/8212878 function millisecondsToStr(milliseconds) { function numberEnding(number) { From 3e34cdc8845fa91fd16018bf70a94569d97db7bb Mon Sep 17 00:00:00 2001 From: ManInDark <61268856+ManInDark@users.noreply.github.com> Date: Mon, 12 Jun 2023 13:25:12 +0200 Subject: [PATCH 009/200] Added sets to the readme --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 6a629e57..5366772f 100644 --- a/README.md +++ b/README.md @@ -70,6 +70,7 @@ Just delete the `EasyDiffusion` folder to uninstall all the downloaded packages. - **Attention/Emphasis**: () in the prompt increases the model's attention to enclosed words, and [] decreases it. - **Weighted Prompts**: Use weights for specific words in your prompt to change their importance, e.g. `red:2.4 dragon:1.2`. - **Prompt Matrix**: Quickly create multiple variations of your prompt, e.g. `a photograph of an astronaut riding a horse | illustration | cinematic lighting`. +- **Prompt Set**: Quickly create multiple variations of your prompt, e.g. `a photograph of an astronaut on the {moon,earth}` - **1-click Upscale/Face Correction**: Upscale or correct an image after it has been generated. - **Make Similar Images**: Click to generate multiple variations of a generated image. - **NSFW Setting**: A setting in the UI to control *NSFW content*. From 6ae4314b798efe7d3e952e111fd9fc1b6d73c4f4 Mon Sep 17 00:00:00 2001 From: ManInDark <61268856+ManInDark@users.noreply.github.com> Date: Tue, 13 Jun 2023 16:09:54 +0200 Subject: [PATCH 010/200] Incorporated proposal by @JeLuF in #1324 --- ui/media/js/main.js | 20 ++++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) diff --git a/ui/media/js/main.js b/ui/media/js/main.js index cb516a37..a7cccc55 100644 --- a/ui/media/js/main.js +++ b/ui/media/js/main.js @@ -1342,6 +1342,16 @@ function getPromptsNumber(prompts) { prompts = prompts.map((prompt) => prompt.trim()) prompts = prompts.filter((prompt) => prompt !== "") + // estimate number of prompts + let estimatedNumberOfPrompts = 0 + prompts.forEach((prompt) => { + estimatedNumberOfPrompts += (prompt.match(/{[^}]*}/g) || []).map((e) => e.match(/,/g).length + 1).reduce( (p,a) => p*a, 1) * (2**(prompt.match(/\|/g) || []).length) + }) + + if (estimatedNumberOfPrompts >= 10000) { + return 10000 + } + promptsToMake = applySetOperator(prompts) // switched those around as Set grows in a linear fashion and permute in 2^n, and one has to be computed for the other to be calculated numberOfPrompts = applyPermuteOperatorNumber(promptsToMake) } @@ -1613,9 +1623,15 @@ function renameMakeImageButton() { imageLabel = totalImages + " Images" } if (SD.activeTasks.size == 0) { - makeImageBtn.innerText = "Make " + imageLabel + if (totalImages >= 10000) + makeImageBtn.innerText = "Make tens of thousands of images" + else + makeImageBtn.innerText = "Make " + imageLabel } else { - makeImageBtn.innerText = "Enqueue Next " + imageLabel + if (totalImages >= 10000) + makeImageBtn.innerText = "Enqueue tens of thousands of images" + else + makeImageBtn.innerText = "Enqueue Next " + imageLabel } } numOutputsTotalField.addEventListener("change", renameMakeImageButton) From ed59972b032b49e497e57985be92926659dc6441 Mon Sep 17 00:00:00 2001 From: ManInDark <61268856+ManInDark@users.noreply.github.com> Date: Wed, 14 Jun 2023 11:57:06 +0200 Subject: [PATCH 011/200] Changed all links as mentioned in #1339 --- CHANGES.md | 12 ++++----- CONTRIBUTING.md | 4 +-- How to install and run.txt | 6 ++--- PRIVACY.md | 2 +- README BEFORE YOU RUN THIS.txt | 2 +- README.md | 14 +++++------ build.bat | 2 +- build.sh | 2 +- scripts/bootstrap.bat | 2 +- scripts/check_modules.py | 4 +-- scripts/functions.sh | 4 +-- scripts/on_env_start.bat | 4 +-- scripts/on_env_start.sh | 2 +- scripts/on_sd_start.bat | 4 +-- ui/easydiffusion/app.py | 2 +- ui/index.html | 36 +++++++++++++-------------- ui/plugins/ui/release-notes.plugin.js | 4 +-- 17 files changed, 53 insertions(+), 53 deletions(-) diff --git a/CHANGES.md b/CHANGES.md index b53ac141..d222d795 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -8,13 +8,13 @@ - **Full support for Stable Diffusion 2.1 (including CPU)** - supports loading v1.4 or v2.0 or v2.1 models seamlessly. No need to enable "Test SD2", and no need to add `sd2_` to your SD 2.0 model file names. Works on CPU as well. - **Memory optimized Stable Diffusion 2.1** - you can now use Stable Diffusion 2.1 models, with the same low VRAM optimizations that we've always had for SD 1.4. Please note, the SD 2.0 and 2.1 models require more GPU and System RAM, as compared to the SD 1.4 and 1.5 models. - **11 new samplers!** - explore the new samplers, some of which can generate great images in less than 10 inference steps! We've added the Karras and UniPC samplers. Thanks @Schorny for the UniPC samplers. -- **Model Merging** - You can now merge two models (`.ckpt` or `.safetensors`) and output `.ckpt` or `.safetensors` models, optionally in `fp16` precision. Details: https://github.com/cmdr2/stable-diffusion-ui/wiki/Model-Merging . Thanks @JeLuf. +- **Model Merging** - You can now merge two models (`.ckpt` or `.safetensors`) and output `.ckpt` or `.safetensors` models, optionally in `fp16` precision. Details: https://github.com/easydiffusion/easydiffusion/wiki/Model-Merging . Thanks @JeLuf. - **Fast loading/unloading of VAEs** - No longer needs to reload the entire Stable Diffusion model, each time you change the VAE - **Database of known models** - automatically picks the right configuration for known models. E.g. we automatically detect and apply "v" parameterization (required for some SD 2.0 models), and "fp32" attention precision (required for some SD 2.1 models). - **Color correction for img2img** - an option to preserve the color profile (histogram) of the initial image. This is especially useful if you're getting red-tinted images after inpainting/masking. - **Three GPU Memory Usage Settings** - `High` (fastest, maximum VRAM usage), `Balanced` (default - almost as fast, significantly lower VRAM usage), `Low` (slowest, very low VRAM usage). The `Low` setting is applied automatically for GPUs with less than 4 GB of VRAM. - **Find models in sub-folders** - This allows you to organize your models into sub-folders inside `models/stable-diffusion`, instead of keeping them all in a single folder. Thanks @patriceac and @ogmaresca. -- **Custom Modifier Categories** - Ability to create custom modifiers with thumbnails, and custom categories (and hierarchy of categories). Details: https://github.com/cmdr2/stable-diffusion-ui/wiki/Custom-Modifiers . Thanks @ogmaresca. +- **Custom Modifier Categories** - Ability to create custom modifiers with thumbnails, and custom categories (and hierarchy of categories). Details: https://github.com/easydiffusion/easydiffusion/wiki/Custom-Modifiers . Thanks @ogmaresca. - **Embed metadata, or save as TXT/JSON** - You can now embed the metadata directly into the images, or save them as text or json files (choose in the Settings tab). Thanks @patriceac. - **Major rewrite of the code** - Most of the codebase has been reorganized and rewritten, to make it more manageable and easier for new developers to contribute features. We've separated our core engine into a new project called `sdkit`, which allows anyone to easily integrate Stable Diffusion (and related modules like GFPGAN etc) into their programming projects (via a simple `pip install sdkit`): https://github.com/easydiffusion/sdkit/ - **Name change** - Last, and probably the least, the UI is now called "Easy Diffusion". It indicates the focus of this project - an easy way for people to play with Stable Diffusion. @@ -67,7 +67,7 @@ Our focus continues to remain on an easy installation experience, and an easy us * 2.5.24 - 11 Mar 2023 - Button to load an image mask from a file. * 2.5.24 - 10 Mar 2023 - Logo change. Image credit: @lazlo_vii. * 2.5.23 - 8 Mar 2023 - Experimental support for Mac M1/M2. Thanks @michaelgallacher, @JeLuf and vishae! -* 2.5.23 - 8 Mar 2023 - Ability to create custom modifiers with thumbnails, and custom categories (and hierarchy of categories). More details - https://github.com/cmdr2/stable-diffusion-ui/wiki/Custom-Modifiers . Thanks @ogmaresca. +* 2.5.23 - 8 Mar 2023 - Ability to create custom modifiers with thumbnails, and custom categories (and hierarchy of categories). More details - https://github.com/easydiffusion/easydiffusion/wiki/Custom-Modifiers . Thanks @ogmaresca. * 2.5.22 - 28 Feb 2023 - Minor styling changes to UI buttons, and the models dropdown. * 2.5.22 - 28 Feb 2023 - Lots of UI-related bug fixes. Thanks @patriceac. * 2.5.21 - 22 Feb 2023 - An option to control the size of the image thumbnails. You can use the `Display options` in the top-right corner to change this. Thanks @JeLuf. @@ -92,7 +92,7 @@ Our focus continues to remain on an easy installation experience, and an easy us * 2.5.14 - 3 Feb 2023 - Fix the 'Make Similar Images' button, which was producing incorrect images (weren't very similar). * 2.5.13 - 1 Feb 2023 - Fix the remaining GPU memory leaks, including a better fix (more comprehensive) for the change in 2.5.12 (27 Jan). * 2.5.12 - 27 Jan 2023 - Fix a memory leak, which made the UI unresponsive after an out-of-memory error. The allocated memory is now freed-up after an error. -* 2.5.11 - 25 Jan 2023 - UI for Merging Models. Thanks @JeLuf. More info: https://github.com/cmdr2/stable-diffusion-ui/wiki/Model-Merging +* 2.5.11 - 25 Jan 2023 - UI for Merging Models. Thanks @JeLuf. More info: https://github.com/easydiffusion/easydiffusion/wiki/Model-Merging * 2.5.10 - 24 Jan 2023 - Reduce the VRAM usage for img2img in 'balanced' mode (without reducing the rendering speed), to make it similar to v2.4 of this UI. * 2.5.9 - 23 Jan 2023 - Fix a bug where img2img would produce poorer-quality images for the same settings, as compared to version 2.4 of this UI. * 2.5.9 - 23 Jan 2023 - Reduce the VRAM usage for 'balanced' mode (without reducing the rendering speed), to make it similar to v2.4 of the UI. @@ -121,8 +121,8 @@ Our focus continues to remain on an easy installation experience, and an easy us - **Automatic scanning for malicious model files** - using `picklescan`, and support for `safetensor` model format. Thanks @JeLuf - **Image Editor** - for drawing simple images for guiding the AI. Thanks @mdiller - **Use pre-trained hypernetworks** - for improving the quality of images. Thanks @C0bra5 -- **Support for custom VAE models**. You can place your VAE files in the `models/vae` folder, and refresh the browser page to use them. More info: https://github.com/cmdr2/stable-diffusion-ui/wiki/VAE-Variational-Auto-Encoder -- **Experimental support for multiple GPUs!** It should work automatically. Just open one browser tab per GPU, and spread your tasks across your GPUs. For e.g. open our UI in two browser tabs if you have two GPUs. You can customize which GPUs it should use in the "Settings" tab, otherwise let it automatically pick the best GPUs. Thanks @madrang . More info: https://github.com/cmdr2/stable-diffusion-ui/wiki/Run-on-Multiple-GPUs +- **Support for custom VAE models**. You can place your VAE files in the `models/vae` folder, and refresh the browser page to use them. More info: https://github.com/easydiffusion/easydiffusion/wiki/VAE-Variational-Auto-Encoder +- **Experimental support for multiple GPUs!** It should work automatically. Just open one browser tab per GPU, and spread your tasks across your GPUs. For e.g. open our UI in two browser tabs if you have two GPUs. You can customize which GPUs it should use in the "Settings" tab, otherwise let it automatically pick the best GPUs. Thanks @madrang . More info: https://github.com/easydiffusion/easydiffusion/wiki/Run-on-Multiple-GPUs - **Cleaner UI design** - Show settings and help in new tabs, instead of dropdown popups (which were buggy). Thanks @mdiller - **Progress bar.** Thanks @mdiller - **Custom Image Modifiers** - You can now save your custom image modifiers! Your saved modifiers can include special characters like `{}, (), [], |` diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index c01d489a..bb6408c8 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,6 +1,6 @@ Hi there, these instructions are meant for the developers of this project. -If you only want to use the Stable Diffusion UI, you've downloaded the wrong file. In that case, please download and follow the instructions at https://github.com/cmdr2/stable-diffusion-ui#installation +If you only want to use the Stable Diffusion UI, you've downloaded the wrong file. In that case, please download and follow the instructions at https://github.com/easydiffusion/easydiffusion#installation Thanks @@ -13,7 +13,7 @@ If you would like to contribute to this project, there is a discord for discussi This is in-flux, but one way to get a development environment running for editing the UI of this project is: (swap `.sh` or `.bat` in instructions depending on your environment, and be sure to adjust any paths to match where you're working) -1) Install the project to a new location using the [usual installation process](https://github.com/cmdr2/stable-diffusion-ui#installation), e.g. to `/projects/stable-diffusion-ui-archive` +1) Install the project to a new location using the [usual installation process](https://github.com/easydiffusion/easydiffusion#installation), e.g. to `/projects/stable-diffusion-ui-archive` 2) Start the newly installed project, and check that you can view and generate images on `localhost:9000` 3) Next, please clone the project repository using `git clone` (e.g. to `/projects/stable-diffusion-ui-repo`) 4) Close the server (started in step 2), and edit `/projects/stable-diffusion-ui-archive/scripts/on_env_start.sh` (or `on_env_start.bat`) diff --git a/How to install and run.txt b/How to install and run.txt index e48d217c..af783b64 100644 --- a/How to install and run.txt +++ b/How to install and run.txt @@ -1,6 +1,6 @@ Congrats on downloading Stable Diffusion UI, version 2! -If you haven't downloaded Stable Diffusion UI yet, please download from https://github.com/cmdr2/stable-diffusion-ui#installation +If you haven't downloaded Stable Diffusion UI yet, please download from https://github.com/easydiffusion/easydiffusion#installation After downloading, to install please follow these instructions: @@ -16,9 +16,9 @@ To start the UI in the future, please run the same command mentioned above. If you have any problems, please: -1. Try the troubleshooting steps at https://github.com/cmdr2/stable-diffusion-ui/wiki/Troubleshooting +1. Try the troubleshooting steps at https://github.com/easydiffusion/easydiffusion/wiki/Troubleshooting 2. Or, seek help from the community at https://discord.com/invite/u9yhsFmEkB -3. Or, file an issue at https://github.com/cmdr2/stable-diffusion-ui/issues +3. Or, file an issue at https://github.com/easydiffusion/easydiffusion/issues Thanks cmdr2 (and contributors to the project) \ No newline at end of file diff --git a/PRIVACY.md b/PRIVACY.md index 6c997997..543a167d 100644 --- a/PRIVACY.md +++ b/PRIVACY.md @@ -3,7 +3,7 @@ This is a summary of whether Easy Diffusion uses your data or tracks you: * The short answer is - Easy Diffusion does *not* use your data, and does *not* track you. * Easy Diffusion does not send your prompts or usage or analytics to anyone. There is no tracking. We don't even know how many people use Easy Diffusion, let alone their prompts. -* Easy Diffusion fetches updates to the code whenever it starts up. It does this by contacting GitHub directly, via SSL (secure connection). Only your computer and GitHub and [this repository](https://github.com/cmdr2/stable-diffusion-ui) are involved, and no third party is involved. Some countries intercepts SSL connections, that's not something we can do much about. GitHub does *not* share statistics (even with me) about how many people fetched code updates. +* Easy Diffusion fetches updates to the code whenever it starts up. It does this by contacting GitHub directly, via SSL (secure connection). Only your computer and GitHub and [this repository](https://github.com/easydiffusion/easydiffusion) are involved, and no third party is involved. Some countries intercepts SSL connections, that's not something we can do much about. GitHub does *not* share statistics (even with me) about how many people fetched code updates. * Easy Diffusion fetches the models from huggingface.co and github.com, if they don't exist on your PC. For e.g. if the safety checker (NSFW) model doesn't exist, it'll try to download it. * Easy Diffusion fetches code packages from pypi.org, which is the standard hosting service for all Python projects. That's where packages installed via `pip install` are stored. * Occasionally, antivirus software are known to *incorrectly* flag and delete some model files, which will result in Easy Diffusion re-downloading `pytorch_model.bin`. This *incorrect deletion* affects other Stable Diffusion UIs as well, like Invoke AI - https://itch.io/post/7509488 diff --git a/README BEFORE YOU RUN THIS.txt b/README BEFORE YOU RUN THIS.txt index e9f81544..a989b835 100644 --- a/README BEFORE YOU RUN THIS.txt +++ b/README BEFORE YOU RUN THIS.txt @@ -3,6 +3,6 @@ Hi there, What you have downloaded is meant for the developers of this project, not for users. If you only want to use the Stable Diffusion UI, you've downloaded the wrong file. -Please download and follow the instructions at https://github.com/cmdr2/stable-diffusion-ui#installation +Please download and follow the instructions at https://github.com/easydiffusion/easydiffusion#installation Thanks \ No newline at end of file diff --git a/README.md b/README.md index 5366772f..b97c35d1 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@ Does not require technical knowledge, does not require pre-installed software. 1-click install, powerful features, friendly community. -[Installation guide](#installation) | [Troubleshooting guide](https://github.com/cmdr2/stable-diffusion-ui/wiki/Troubleshooting) | [![Discord Server](https://img.shields.io/discord/1014774730907209781?label=Discord)](https://discord.com/invite/u9yhsFmEkB) (for support queries, and development discussions) +[Installation guide](#installation) | [Troubleshooting guide](https://github.com/easydiffusion/easydiffusion/wiki/Troubleshooting) | [![Discord Server](https://img.shields.io/discord/1014774730907209781?label=Discord)](https://discord.com/invite/u9yhsFmEkB) (for support queries, and development discussions) ![t2i](https://raw.githubusercontent.com/Stability-AI/stablediffusion/main/assets/stable-samples/txt2img/768/merged-0006.png) @@ -11,9 +11,9 @@ Does not require technical knowledge, does not require pre-installed software. 1 Click the download button for your operating system:

    - - - + + +

    **Hardware requirements:** @@ -83,7 +83,7 @@ Just delete the `EasyDiffusion` folder to uninstall all the downloaded packages. - **Use custom VAE models** - **Use pre-trained Hypernetworks** - **Use custom GFPGAN models** -- **UI Plugins**: Choose from a growing list of [community-generated UI plugins](https://github.com/cmdr2/stable-diffusion-ui/wiki/UI-Plugins), or write your own plugin to add features to the project! +- **UI Plugins**: Choose from a growing list of [community-generated UI plugins](https://github.com/easydiffusion/easydiffusion/wiki/UI-Plugins), or write your own plugin to add features to the project! ### Performance and security - **Fast**: Creates a 512x512 image with euler_a in 5 seconds, on an NVIDIA 3060 12GB. @@ -119,10 +119,10 @@ Useful for judging (and stopping) an image quickly, without waiting for it to fi ---- # How to use? -Please refer to our [guide](https://github.com/cmdr2/stable-diffusion-ui/wiki/How-to-Use) to understand how to use the features in this UI. +Please refer to our [guide](https://github.com/easydiffusion/easydiffusion/wiki/How-to-Use) to understand how to use the features in this UI. # Bugs reports and code contributions welcome -If there are any problems or suggestions, please feel free to ask on the [discord server](https://discord.com/invite/u9yhsFmEkB) or [file an issue](https://github.com/cmdr2/stable-diffusion-ui/issues). +If there are any problems or suggestions, please feel free to ask on the [discord server](https://discord.com/invite/u9yhsFmEkB) or [file an issue](https://github.com/easydiffusion/easydiffusion/issues). We could really use help on these aspects (click to view tasks that need your help): * [User Interface](https://github.com/users/cmdr2/projects/1/views/1) diff --git a/build.bat b/build.bat index 6e3f3f81..dc9e622f 100644 --- a/build.bat +++ b/build.bat @@ -2,7 +2,7 @@ @echo "Hi there, what you are running is meant for the developers of this project, not for users." & echo. @echo "If you only want to use the Stable Diffusion UI, you've downloaded the wrong file." -@echo "Please download and follow the instructions at https://github.com/cmdr2/stable-diffusion-ui#installation" & echo. +@echo "Please download and follow the instructions at https://github.com/easydiffusion/easydiffusion#installation" & echo. @echo "If you are actually a developer of this project, please type Y and press enter" & echo. set /p answer=Are you a developer of this project (Y/N)? diff --git a/build.sh b/build.sh index f4538e5c..bddf3c49 100755 --- a/build.sh +++ b/build.sh @@ -2,7 +2,7 @@ printf "Hi there, what you are running is meant for the developers of this project, not for users.\n\n" printf "If you only want to use the Stable Diffusion UI, you've downloaded the wrong file.\n" -printf "Please download and follow the instructions at https://github.com/cmdr2/stable-diffusion-ui#installation\n\n" +printf "Please download and follow the instructions at https://github.com/easydiffusion/easydiffusion#installation \n\n" printf "If you are actually a developer of this project, please type Y and press enter\n\n" read -p "Are you a developer of this project (Y/N) " yn diff --git a/scripts/bootstrap.bat b/scripts/bootstrap.bat index d3cdd19f..8c1069c8 100644 --- a/scripts/bootstrap.bat +++ b/scripts/bootstrap.bat @@ -11,7 +11,7 @@ setlocal enabledelayedexpansion set MAMBA_ROOT_PREFIX=%cd%\installer_files\mamba set INSTALL_ENV_DIR=%cd%\installer_files\env set LEGACY_INSTALL_ENV_DIR=%cd%\installer -set MICROMAMBA_DOWNLOAD_URL=https://github.com/cmdr2/stable-diffusion-ui/releases/download/v1.1/micromamba.exe +set MICROMAMBA_DOWNLOAD_URL=https://github.com/easydiffusion/easydiffusion/releases/download/v1.1/micromamba.exe set umamba_exists=F set OLD_APPDATA=%APPDATA% diff --git a/scripts/check_modules.py b/scripts/check_modules.py index 6275de45..5f1a9bb8 100644 --- a/scripts/check_modules.py +++ b/scripts/check_modules.py @@ -148,9 +148,9 @@ def fail(module_name): print( f"""Error installing {module_name}. Sorry about that, please try to: 1. Run this installer again. -2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/cmdr2/stable-diffusion-ui/wiki/Troubleshooting +2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/easydiffusion/easydiffusion/wiki/Troubleshooting 3. If those steps don't help, please copy *all* the error messages in this window, and ask the community at https://discord.com/invite/u9yhsFmEkB -4. If that doesn't solve the problem, please file an issue at https://github.com/cmdr2/stable-diffusion-ui/issues +4. If that doesn't solve the problem, please file an issue at https://github.com/easydiffusion/easydiffusion/issues Thanks!""" ) exit(1) diff --git a/scripts/functions.sh b/scripts/functions.sh index 495e9950..477b7743 100644 --- a/scripts/functions.sh +++ b/scripts/functions.sh @@ -15,9 +15,9 @@ fail() { Error downloading Stable Diffusion UI. Sorry about that, please try to: 1. Run this installer again. - 2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/cmdr2/stable-diffusion-ui/wiki/Troubleshooting + 2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/easydiffusion/easydiffusion/wiki/Troubleshooting 3. If those steps don't help, please copy *all* the error messages in this window, and ask the community at https://discord.com/invite/u9yhsFmEkB - 4. If that doesn't solve the problem, please file an issue at https://github.com/cmdr2/stable-diffusion-ui/issues + 4. If that doesn't solve the problem, please file an issue at https://github.com/easydiffusion/easydiffusion/issues Thanks! diff --git a/scripts/on_env_start.bat b/scripts/on_env_start.bat index bc92d0e9..0871973f 100644 --- a/scripts/on_env_start.bat +++ b/scripts/on_env_start.bat @@ -55,10 +55,10 @@ if "%update_branch%"=="" ( @echo. & echo "Downloading Easy Diffusion..." & echo. @echo "Using the %update_branch% channel" & echo. - @call git clone -b "%update_branch%" https://github.com/cmdr2/stable-diffusion-ui.git sd-ui-files && ( + @call git clone -b "%update_branch%" https://github.com/easydiffusion/easydiffusion.git sd-ui-files && ( @echo sd_ui_git_cloned >> scripts\install_status.txt ) || ( - @echo "Error downloading Easy Diffusion. Sorry about that, please try to:" & echo " 1. Run this installer again." & echo " 2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/cmdr2/stable-diffusion-ui/wiki/Troubleshooting" & echo " 3. If those steps don't help, please copy *all* the error messages in this window, and ask the community at https://discord.com/invite/u9yhsFmEkB" & echo " 4. If that doesn't solve the problem, please file an issue at https://github.com/cmdr2/stable-diffusion-ui/issues" & echo "Thanks!" + @echo "Error downloading Easy Diffusion. Sorry about that, please try to:" & echo " 1. Run this installer again." & echo " 2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/easydiffusion/easydiffusion/wiki/Troubleshooting" & echo " 3. If those steps don't help, please copy *all* the error messages in this window, and ask the community at https://discord.com/invite/u9yhsFmEkB" & echo " 4. If that doesn't solve the problem, please file an issue at https://github.com/easydiffusion/easydiffusion/issues" & echo "Thanks!" pause @exit /b ) diff --git a/scripts/on_env_start.sh b/scripts/on_env_start.sh index 366b5dd1..d936924e 100755 --- a/scripts/on_env_start.sh +++ b/scripts/on_env_start.sh @@ -38,7 +38,7 @@ else printf "\n\nDownloading Easy Diffusion..\n\n" printf "Using the $update_branch channel\n\n" - if git clone -b "$update_branch" https://github.com/cmdr2/stable-diffusion-ui.git sd-ui-files ; then + if git clone -b "$update_branch" https://github.com/easydiffusion/easydiffusion.git sd-ui-files ; then echo sd_ui_git_cloned >> scripts/install_status.txt else fail "git clone failed" diff --git a/scripts/on_sd_start.bat b/scripts/on_sd_start.bat index f92b9f6f..860361d4 100644 --- a/scripts/on_sd_start.bat +++ b/scripts/on_sd_start.bat @@ -26,7 +26,7 @@ if exist "%cd%\stable-diffusion\env" ( @rem activate the installer env call conda activate @if "%ERRORLEVEL%" NEQ "0" ( - @echo. & echo "Error activating conda for Easy Diffusion. Sorry about that, please try to:" & echo " 1. Run this installer again." & echo " 2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/cmdr2/stable-diffusion-ui/wiki/Troubleshooting" & echo " 3. If those steps don't help, please copy *all* the error messages in this window, and ask the community at https://discord.com/invite/u9yhsFmEkB" & echo " 4. If that doesn't solve the problem, please file an issue at https://github.com/cmdr2/stable-diffusion-ui/issues" & echo "Thanks!" & echo. + @echo. & echo "Error activating conda for Easy Diffusion. Sorry about that, please try to:" & echo " 1. Run this installer again." & echo " 2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/easydiffusion/easydiffusion/wiki/Troubleshooting" & echo " 3. If those steps don't help, please copy *all* the error messages in this window, and ask the community at https://discord.com/invite/u9yhsFmEkB" & echo " 4. If that doesn't solve the problem, please file an issue at https://github.com/easydiffusion/easydiffusion/issues" & echo "Thanks!" & echo. pause exit /b ) @@ -68,7 +68,7 @@ if "%ERRORLEVEL%" NEQ "0" ( call WHERE uvicorn > .tmp @>nul findstr /m "uvicorn" .tmp @if "%ERRORLEVEL%" NEQ "0" ( - @echo. & echo "UI packages not found! Sorry about that, please try to:" & echo " 1. Run this installer again." & echo " 2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/cmdr2/stable-diffusion-ui/wiki/Troubleshooting" & echo " 3. If those steps don't help, please copy *all* the error messages in this window, and ask the community at https://discord.com/invite/u9yhsFmEkB" & echo " 4. If that doesn't solve the problem, please file an issue at https://github.com/cmdr2/stable-diffusion-ui/issues" & echo "Thanks!" & echo. + @echo. & echo "UI packages not found! Sorry about that, please try to:" & echo " 1. Run this installer again." & echo " 2. If that doesn't fix it, please try the common troubleshooting steps at https://github.com/easydiffusion/easydiffusion/wiki/Troubleshooting" & echo " 3. If those steps don't help, please copy *all* the error messages in this window, and ask the community at https://discord.com/invite/u9yhsFmEkB" & echo " 4. If that doesn't solve the problem, please file an issue at https://github.com/easydiffusion/easydiffusion/issues" & echo "Thanks!" & echo. pause exit /b ) diff --git a/ui/easydiffusion/app.py b/ui/easydiffusion/app.py index 38e3392c..99810e75 100644 --- a/ui/easydiffusion/app.py +++ b/ui/easydiffusion/app.py @@ -237,7 +237,7 @@ def fail_and_die(fail_type: str, data: str): suggestions = [ "Run this installer again.", "If those steps don't help, please copy *all* the error messages in this window, and ask the community at https://discord.com/invite/u9yhsFmEkB", - "If that doesn't solve the problem, please file an issue at https://github.com/cmdr2/stable-diffusion-ui/issues", + "If that doesn't solve the problem, please file an issue at https://github.com/easydiffusion/easydiffusion/issues", ] if fail_type == "model_download": diff --git a/ui/index.html b/ui/index.html index 0c4386de..2afdfd84 100644 --- a/ui/index.html +++ b/ui/index.html @@ -60,7 +60,7 @@
    @@ -133,18 +133,18 @@ - Click to learn more about custom models + Click to learn more about custom models - Click to learn more about Clip Skip + Click to learn more about Clip Skip - Click to learn more about VAEs + Click to learn more about VAEs - Click to learn more about samplers + Click to learn more about samplers - Click to learn more about Seamless Tiling + Click to learn more about Seamless Tiling
    +
    +
    +
    +

    Image Modifiers

    + (drawing style, camera, etc.) +
    +
    + + + Add Custom Modifiers + + + + +
    +
    +
    +
    + + + Expand Categories + +
    +
    +
    +
    @@ -102,7 +132,7 @@
    - +
    @@ -293,29 +323,6 @@ - -
    -

    - Image Modifiers (art styles, tags etc) - - - Add Custom Modifiers - - -

    -
    -
    - - -   - - -
    -
    -
    @@ -475,6 +482,16 @@

    Set your custom modifiers (one per line)

    Tip: You can include special characters like {} () [] and |. You can also put multiple comma-separated phrases in a single line, to make a single modifier that combines all of those.

    +
    + + +   + + +
    diff --git a/ui/media/css/main.css b/ui/media/css/main.css index 9df38f9a..af4c152e 100644 --- a/ui/media/css/main.css +++ b/ui/media/css/main.css @@ -211,10 +211,6 @@ code { #makeImage { border-radius: 6px; } -#editor-modifiers h5 { - padding: 5pt 0; - margin: 0; -} #makeImage { flex: 0 0 70px; background: var(--accent-color); @@ -284,14 +280,193 @@ button#resume { .collapsible:not(.active) ~ .collapsible-content { display: none !important; } +#image-modifier-dropdown { + margin-left: 1em; + position: relative; + cursor: pointer; +} +#image-modifier-dropdown[data-active="true"]::before { + content: "âž–"; +} +#image-modifier-dropdown[data-active="false"]::before { + content: "âž•"; +} #editor-modifiers { - overflow-y: auto; + max-width: 75vw; + min-width: 50vw; + max-height: fit-content; + overflow-y: hidden; overflow-x: hidden; + display: none; + background: var(--background-color1); + border: solid 1px var(--background-color3); + z-index: 999; + border-radius: 6px; + box-shadow: 0px 0px 30px black; + border: 2px solid rgb(255 255 255 / 10%); +} +#editor-modifiers.active { + display: flex; + flex-direction: column; + position: absolute; + left: 5vw; +} +.modifiers-maximized { + position: fixed !important; + top: 0 !important; + bottom: 0px !important; + left: 0px !important; + right: 0px !important; + max-width: unset !important; + max-height: unset !important; + border: 0px !important; + border-radius: 0px !important; +} +.modifiers-maximized #editor-modifiers-entries { + max-height: 100%; + flex: 1; +} +#editor-modifiers-header { + background-color: var(--background-color4); + padding: 0.5em; + border-bottom: 1px solid rgb(255 255 255 / 10%); + display: flex; + justify-content: space-between; + align-items: center; + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; +} +#editor-modifiers-subheader { + background-color: var(--background-color4); + padding: 0.5em; + border-bottom: 1px solid rgb(255 255 255 / 10%); + display: flex; + align-items: center; + grid-gap: 0.8em; + flex-direction: row; + position: relative; + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + transition: all 0.1s ease; +} +#editor-modifiers-subheader::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(255, 255, 255, 0.02); + opacity: 1; + pointer-events: none; +} +#modifiers-header-left { + display: flex; + flex-direction: column; + grid-gap: 0.1em; +} +#modifiers-header-left span { + font-size: 0.8em; + color: rgb(127 127 127); + font-weight: 200; +} +#modifiers-header-right { + display: flex; + align-items: center; + align-content: center; + justify-content: center; + grid-gap: 0.8em; + margin-right: 0.3em; +} + +#editor-modifiers-subheader i, +#modifiers-header-right i { + cursor: pointer; + margin: 0; + padding: 0; +} +#modifiers-header-right .section-button, +#editor-modifiers-subheader .section-button { + margin-top: 0.3em; +} +#modifiers-action-collapsibles-btn { + display: flex; + grid-gap: 0.5em; + cursor: pointer; +} +.modifiers-action-text { + font-size: 0.8em; + color: rgb(192 192 192); +} +#modifiers-expand-btn { + z-index: 2; +} +#modifiers-expand-btn .simple-tooltip { + background-color: var(--background-color3); + border-radius: 50px; +} +.modifier-category .collapsible { + position: relative; +} +.modifier-category .collapsible::after { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(255, 255, 255, 0.1); + opacity: 0; + transition: opacity 0.1s ease; + pointer-events: none; +} +.modifier-category:hover .collapsible::after { + opacity: 1; + pointer-events: none; +} +#editor-modifiers-entries { + overflow: auto scroll; + max-height: 50vh; + height: fit-content; + margin-bottom: 0.1em; + padding-left: 0px; +} +#editor-modifiers-entries .collapsible { + transition: opacity 0.1s ease; + padding-left: 0.5em; +} +#editor-modifiers-entries .modifier-category:nth-child(odd) .collapsible::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(255, 255, 255, 0.02); + opacity: 1; + pointer-events: none; } #editor-modifiers .editor-modifiers-leaf { padding-top: 10pt; padding-bottom: 10pt; } +#editor-modifiers h5 { + padding: 5pt 0; + margin: 0; + position: sticky; + top: -2px; + z-index: 10; + background-color: var(--background-color3); + border-bottom: 1px solid rgb(255 255 255 / 4%); + user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; +} img { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.15), 0 6px 20px 0 rgba(0, 0, 0, 0.15); } @@ -310,6 +485,9 @@ div.img-preview img { margin-top: 5pt; display: none; } +#editor-inputs-tags-list { + max-height: 30em; +} #server-status { position: absolute; right: 16px; @@ -779,7 +957,6 @@ input::file-selector-button { height: 19px; } - .input-toggle { display: inline-block; position: relative; @@ -1083,6 +1260,7 @@ input::file-selector-button { /* POPUPS */ .popup:not(.active) { visibility: hidden; + overflow-x: hidden; /* fix overflow from body */ opacity: 0; } diff --git a/ui/media/css/modifier-thumbnails.css b/ui/media/css/modifier-thumbnails.css index c6fb8107..02b91fce 100644 --- a/ui/media/css/modifier-thumbnails.css +++ b/ui/media/css/modifier-thumbnails.css @@ -1,14 +1,16 @@ .modifier-card { + position: relative; + box-sizing: content-box; /* fixes border misalignment */ box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); transition: 0.1s; border-radius: 7px; margin: 3pt 3pt; float: left; - width: 8em; - height: 11.5em; + width: 6em; + height: 9.5em; display: grid; grid-template-columns: 1fr; - grid-template-rows: 8em 3.5em; + grid-template-rows: 6em 3.5em; gap: 0px 0px; grid-auto-flow: row; grid-template-areas: @@ -16,82 +18,71 @@ "modifier-card-container"; border: 2px solid rgba(255, 255, 255, .05); cursor: pointer; -} -.modifier-card-size_5 { - width: 18em; - grid-template-rows: 18em 3.5em; - height: 21.5em; -} -.modifier-card-size_5 .modifier-card-image-overlay { - font-size: 8em; -} -.modifier-card-size_4 { - width: 14em; - grid-template-rows: 14em 3.5em; - height: 17.5em; -} -.modifier-card-size_4 .modifier-card-image-overlay { - font-size: 7em; + z-index: 2; } .modifier-card-size_3 { - width: 11em; - grid-template-rows: 11em 3.5em; - height: 14.5em; -} -.modifier-card-size_3 .modifier-card-image-overlay { - font-size: 6em; -} -.modifier-card-size_2 { width: 10em; grid-template-rows: 10em 3.5em; height: 13.5em; } -.modifier-card-size_2 .modifier-card-image-overlay { +.modifier-card-size_3 .modifier-card-image-overlay { font-size: 6em; } -.modifier-card-size_1 { +.modifier-card-size_3 .modifier-card-label { + font-size: 1.2em; +} +.modifier-card-size_2 { width: 9em; grid-template-rows: 9em 3.5em; height: 12.5em; } -.modifier-card-size_1 .modifier-card-image-overlay { +.modifier-card-size_2 .modifier-card-image-overlay { font-size: 5em; } -.modifier-card-size_-1 { +.modifier-card-size_2 .modifier-card-label { + font-size: 1.1em; +} +.modifier-card-size_1 { width: 7em; grid-template-rows: 7em 3.5em; height: 10.5em; } -.modifier-card-size_-1 .modifier-card-image-overlay { +.modifier-card-size_1 .modifier-card-image-overlay { font-size: 4em; } -.modifier-card-size_-2 { - width: 6em; - grid-template-rows: 6em 3.5em; - height: 9.5em; -} -.modifier-card-size_-2 .modifier-card-image-overlay { - font-size: 3em; -} -.modifier-card-size_-3 { +.modifier-card-size_-1 { width: 5em; grid-template-rows: 5em 3.5em; height: 8.5em; } -.modifier-card-size_-3 .modifier-card-image-overlay { +.modifier-card-size_-1 .modifier-card-image-overlay { font-size: 3em; } -.modifier-card-size_-3 .modifier-card-label { - font-size: 0.8em; +.modifier-card-size_-1 .modifier-card-label { + font-size: 0.9em; +} +.modifier-card-size_-2 { + width: 4em; + grid-template-rows: 3.5em 3em; + height: 6.5em; +} +.modifier-card-size_-2 .modifier-card-image-overlay { + font-size: 2em; +} +.modifier-card-size_-2 .modifier-card-label { + font-size: 0.7em; } .modifier-card-tiny { - width: 6em; - height: 9.5em; - grid-template-rows: 6em 3.5em; + width: 5em; + grid-template-rows: 5em 3.5em; + height: 8.5em; } .modifier-card-tiny .modifier-card-image-overlay { font-size: 4em; } +.modifier-card-tiny .modifier-card-label { + font-size: 0.9em; +} .modifier-card:hover { transform: scale(1.05); box-shadow: 0 5px 16px 5px rgba(0, 0, 0, 0.25); @@ -115,6 +106,7 @@ } .modifier-card-image-container * { position: absolute; + text-align: center; } .modifier-card-container { text-align: center; @@ -131,6 +123,7 @@ .modifier-card-label { padding: 4px; word-break: break-word; + text-transform: capitalize; } .modifier-card-image-overlay { width: inherit; @@ -140,7 +133,7 @@ position: absolute; border-radius: 5px 5px 0 0; opacity: 0; - font-size: 5em; + font-size: 4em; font-weight: 900; color: rgb(255 255 255 / 50%); display: flex; @@ -153,9 +146,8 @@ position: absolute; z-index: 3; } -.modifier-card-overlay:hover ~ .modifier-card-container .modifier-card-label.tooltip .tooltip-text { - visibility: visible; - opacity: 1; +.modifier-card-active .modifier-card-overlay { + background-color: rgb(169 78 241 / 40%); } .modifier-card:hover > .modifier-card-image-container .modifier-card-image-overlay { opacity: 1; @@ -175,53 +167,24 @@ border: 2px solid rgb(179 82 255 / 94%); box-shadow: 0 0px 10px 0 rgb(170 0 229 / 58%); } -.tooltip { - position: relative; - display: inline-block; -} -.tooltip .tooltip-text { - visibility: hidden; - width: 120px; - background: rgb(101,97,181); - background: linear-gradient(180deg, rgba(101,97,181,1) 0%, rgba(47,45,85,1) 100%); - color: #fff; - text-align: center; - border-radius: 6px; - padding: 5px; - position: absolute; - z-index: 1; - top: 105%; - left: 39%; - margin-left: -60px; - opacity: 0; - transition: opacity 0.3s; - border: 2px solid rgb(90 100 177 / 94%); - box-shadow: 0px 10px 20px 5px rgb(11 0 58 / 55%); - width: 10em; -} -.tooltip .tooltip-text::after { - content: ""; - position: absolute; - top: -0.9em; - left: 50%; - margin-left: -5px; - border-width: 5px; - border-style: solid; - border-color: transparent transparent rgb(90 100 177 / 94%) transparent; -} -.tooltip:hover .tooltip-text { - visibility: visible; - opacity: 1; -} #modifier-card-size-slider { width: 6em; margin-bottom: 0.5em; vertical-align: middle; } -#modifier-settings-btn { - float: right; -} #modifier-settings-config textarea { width: 90%; height: 150px; } +.modifier-card .hidden { + display: none; +} +.support-long-label .modifier-card-overlay:hover ~ .modifier-card-container .modifier-card-label { + font-size: 0.7em; +} +.support-long-label .modifier-card-overlay:hover ~ .modifier-card-container .long-label { + display: block; +} +.support-long-label .modifier-card-overlay:hover ~ .modifier-card-container .regular-label { + display: none; +} \ No newline at end of file diff --git a/ui/media/js/image-modifiers.js b/ui/media/js/image-modifiers.js index 69f31ab1..5f3a9014 100644 --- a/ui/media/js/image-modifiers.js +++ b/ui/media/js/image-modifiers.js @@ -1,14 +1,21 @@ let activeTags = [] let modifiers = [] let customModifiersGroupElement = undefined -let customModifiersInitialContent +let customModifiersInitialContent = "" +let modifierPanelFreezed = false +let modifiersMainContainer = document.querySelector("#editor-modifiers") +let modifierDropdown = document.querySelector("#image-modifier-dropdown") +let editorModifiersContainer = document.querySelector("#editor-modifiers") let editorModifierEntries = document.querySelector("#editor-modifiers-entries") let editorModifierTagsList = document.querySelector("#editor-inputs-tags-list") let editorTagsContainer = document.querySelector("#editor-inputs-tags-container") let modifierCardSizeSlider = document.querySelector("#modifier-card-size-slider") let previewImageField = document.querySelector("#preview-image") let modifierSettingsBtn = document.querySelector("#modifier-settings-btn") +let modifiersContainerSizeBtn = document.querySelector("#modifiers-container-size-btn") +let modifiersCloseBtn = document.querySelector("#modifiers-close-button") +let modifiersCollapsiblesBtn = document.querySelector("#modifiers-action-collapsibles-btn") let modifierSettingsOverlay = document.querySelector("#modifier-settings-config") let customModifiersTextBox = document.querySelector("#custom-modifiers-input") let customModifierEntriesToolbar = document.querySelector("#editor-modifiers-entries-toolbar") @@ -18,31 +25,31 @@ const activeCardClass = "modifier-card-active" const CUSTOM_MODIFIERS_KEY = "customModifiers" function createModifierCard(name, previews, removeBy) { - const modifierCard = document.createElement("div") - let style = previewImageField.value - let styleIndex = style == "portrait" ? 0 : 1 + let cardPreviewImageType = previewImageField.value + const modifierCard = document.createElement("div") modifierCard.className = "modifier-card" modifierCard.innerHTML = `
    +
    -

    +

    No Image

    Modifier Image
    -

    +
    + +

    +
    ` const image = modifierCard.querySelector(".modifier-card-image") - const errorText = modifierCard.querySelector(".modifier-card-error-label") - const label = modifierCard.querySelector(".modifier-card-label") - - errorText.innerText = "No Image" + const longLabel = modifierCard.querySelector(".modifier-card-label span.long-label") + const regularLabel = modifierCard.querySelector(".modifier-card-label p.regular-label") if (typeof previews == "object") { - image.src = previews[styleIndex] // portrait - image.setAttribute("preview-type", style) + image.src = previews[cardPreviewImageType == "portrait" ? 0 : 1] // 0 index is portrait, 1 landscape + image.setAttribute("preview-type", cardPreviewImageType) } else { image.remove() } @@ -50,24 +57,32 @@ function createModifierCard(name, previews, removeBy) { const maxLabelLength = 30 const cardLabel = removeBy ? name.replace("by ", "") : name - if (cardLabel.length <= maxLabelLength) { - label.querySelector("p").innerText = cardLabel - } else { - const tooltipText = document.createElement("span") - tooltipText.className = "tooltip-text" - tooltipText.innerText = name - - label.classList.add("tooltip") - label.appendChild(tooltipText) - - label.querySelector("p").innerText = cardLabel.substring(0, maxLabelLength) + "..." + function getFormattedLabel(length) { + if (cardLabel?.length <= length) { + return cardLabel + } else { + return cardLabel.substring(0, length) + "..." + } } - label.querySelector("p").dataset.fullName = name // preserve the full name + modifierCard.dataset.fullName = name // preserve the full name + regularLabel.dataset.fullName = name // preserve the full name, legacy support for older plugins + + longLabel.innerText = getFormattedLabel(maxLabelLength * 2) + regularLabel.innerText = getFormattedLabel(maxLabelLength) + + if (cardLabel.length > maxLabelLength) { + modifierCard.classList.add("support-long-label") + + if (cardLabel.length > maxLabelLength * 2) { + modifierCard.title = `"${name}"` + } + } + return modifierCard } -function createModifierGroup(modifierGroup, initiallyExpanded, removeBy) { +function createModifierGroup(modifierGroup, isInitiallyOpen, removeBy) { const title = modifierGroup.category const modifiers = modifierGroup.modifiers @@ -78,8 +93,8 @@ function createModifierGroup(modifierGroup, initiallyExpanded, removeBy) { const modifiersEl = document.createElement("div") modifiersEl.classList.add("collapsible-content", "editor-modifiers-leaf") - if (initiallyExpanded === true) { - titleEl.className += " active" + if (isInitiallyOpen === true) { + titleEl.classList.add("active") } modifiers.forEach((modObj) => { @@ -126,7 +141,7 @@ function createModifierGroup(modifierGroup, initiallyExpanded, removeBy) { e.appendChild(titleEl) e.appendChild(modifiersEl) - editorModifierEntries.insertBefore(e, customModifierEntriesToolbar.nextSibling) + editorModifierEntries.prepend(e) return e } @@ -149,7 +164,10 @@ async function loadModifiers() { res.reverse() res.forEach((modifierGroup, idx) => { - createModifierGroup(modifierGroup, idx === res.length - 1, modifierGroup === "Artist" ? true : false) // only remove "By " for artists + const isInitiallyOpen = false // idx === res.length - 1 + const removeBy = modifierGroup === "Artist" ? true : false // only remove "By " for artists + + createModifierGroup(modifierGroup, isInitiallyOpen, removeBy) }) createCollapsibles(editorModifierEntries) @@ -169,7 +187,7 @@ function refreshModifiersState(newTags, inactiveTags) { .querySelector("#editor-modifiers") .querySelectorAll(".modifier-card") .forEach((modifierCard) => { - const modifierName = modifierCard.querySelector(".modifier-card-label p").dataset.fullName // pick the full modifier name + const modifierName = modifierCard.dataset.fullName // pick the full modifier name if (activeTags.map((x) => x.name).includes(modifierName)) { modifierCard.classList.remove(activeCardClass) modifierCard.querySelector(".modifier-card-image-overlay").innerText = "+" @@ -184,8 +202,9 @@ function refreshModifiersState(newTags, inactiveTags) { .querySelector("#editor-modifiers") .querySelectorAll(".modifier-card") .forEach((modifierCard) => { - const modifierName = modifierCard.querySelector(".modifier-card-label p").dataset.fullName + const modifierName = modifierCard.dataset.fullName const shortModifierName = modifierCard.querySelector(".modifier-card-label p").innerText + if (trimModifiers(tag) == trimModifiers(modifierName)) { // add modifier to active array if (!activeTags.map((x) => x.name).includes(tag)) { @@ -242,10 +261,10 @@ function refreshInactiveTags(inactiveTags) { } // update cards - let overlays = document.querySelector("#editor-inputs-tags-list").querySelectorAll(".modifier-card-overlay") + let overlays = editorModifierTagsList.querySelectorAll(".modifier-card-overlay") overlays.forEach((i) => { - let modifierName = i.parentElement.getElementsByClassName("modifier-card-label")[0].getElementsByTagName("p")[0] - .dataset.fullName + let modifierName = i.parentElement.dataset.fullName + if (inactiveTags?.find((element) => trimModifiers(element) === modifierName) !== undefined) { i.parentElement.classList.add("modifier-toggle-inactive") } @@ -262,6 +281,12 @@ function refreshTagsList(inactiveTags) { editorTagsContainer.style.display = "block" } + if(activeTags.length > 15) { + editorModifierTagsList.style["overflow-y"] = "auto" + } else { + editorModifierTagsList.style["overflow-y"] = "unset" + } + activeTags.forEach((tag, index) => { tag.element.querySelector(".modifier-card-image-overlay").innerText = "-" tag.element.classList.add("modifier-card-tiny") @@ -285,48 +310,42 @@ function refreshTagsList(inactiveTags) { let brk = document.createElement("br") brk.style.clear = "both" + editorModifierTagsList.appendChild(brk) + refreshInactiveTags(inactiveTags) + document.dispatchEvent(new Event("refreshImageModifiers")) // notify plugins that the image tags have been refreshed } function toggleCardState(modifierName, makeActive) { - document - .querySelector("#editor-modifiers") - .querySelectorAll(".modifier-card") - .forEach((card) => { - const name = card.querySelector(".modifier-card-label").innerText - if ( - trimModifiers(modifierName) == trimModifiers(name) || - trimModifiers(modifierName) == "by " + trimModifiers(name) - ) { - if (makeActive) { - card.classList.add(activeCardClass) - card.querySelector(".modifier-card-image-overlay").innerText = "-" - } else { - card.classList.remove(activeCardClass) - card.querySelector(".modifier-card-image-overlay").innerText = "+" - } - } - }) + const cards = [...document.querySelectorAll("#editor-modifiers .modifier-card")] + .filter(cardElem => trimModifiers(cardElem.dataset.fullName) == trimModifiers(modifierName)) + + const cardExists = typeof cards == "object" && cards?.length > 0 + + if (cardExists) { + const card = cards[0] + + if (makeActive) { + card.classList.add(activeCardClass) + card.querySelector(".modifier-card-image-overlay").innerText = "-" + } else { + card.classList.remove(activeCardClass) + card.querySelector(".modifier-card-image-overlay").innerText = "+" + } + } } function changePreviewImages(val) { const previewImages = document.querySelectorAll(".modifier-card-image-container img") - let previewArr = [] - - modifiers.map((x) => x.modifiers).forEach((x) => previewArr.push(...x.map((m) => m.previews))) - - previewArr = previewArr.map((x) => { - let obj = {} - - x.forEach((preview) => { + const previewArr = modifiers.flatMap((x) => x.modifiers.map((m) => m.previews)) + .map((x) => x.reduce((obj, preview) => { obj[preview.name] = preview.path - }) - return obj - }) + return obj + }, {})) previewImages.forEach((previewImage) => { const currentPreviewType = previewImage.getAttribute("preview-type") @@ -369,17 +388,70 @@ function resizeModifierCards(val) { }) } +function saveCustomModifiers() { + localStorage.setItem(CUSTOM_MODIFIERS_KEY, customModifiersTextBox.value.trim()) + + loadCustomModifiers() +} + +function loadCustomModifiers() { + PLUGINS["MODIFIERS_LOAD"].forEach((fn) => fn.loader.call()) +} + +function showModifierContainer() { + document.addEventListener("click", checkIfClickedOutsideDropdownElem) + + modifierDropdown.dataset.active = true + editorModifiersContainer.classList.add("active") +} + +function hideModifierContainer() { + document.removeEventListener("click", checkIfClickedOutsideDropdownElem) + + modifierDropdown.dataset.active = false + editorModifiersContainer.classList.remove("active") +} + +function checkIfClickedOutsideDropdownElem(e) { + const clickedElement = e.target + + const clickedInsideSpecificElems = [modifierDropdown, editorModifiersContainer, modifierSettingsOverlay].some((div) => + div && (div.contains(clickedElement) || div === clickedElement)) + + if (!clickedInsideSpecificElems && !modifierPanelFreezed) { + hideModifierContainer() + } +} + +function collapseAllModifierCategory() { + const collapsibleElems = editorModifierEntries.querySelectorAll(".modifier-category .collapsible"); // needs to have ";" + + [...collapsibleElems].forEach((elem) => { + const isActive = elem.classList.contains("active") + + if(isActive) { + elem?.click() + } + }) +} + +function expandAllModifierCategory() { + const collapsibleElems = editorModifierEntries.querySelectorAll(".modifier-category .collapsible"); // needs to have ";" + + [...collapsibleElems].forEach((elem) => { + const isActive = elem.classList.contains("active") + + if (!isActive) { + elem?.click() + } + }) +} + +customModifiersTextBox.addEventListener("change", saveCustomModifiers) + modifierCardSizeSlider.onchange = () => resizeModifierCards(modifierCardSizeSlider.value) previewImageField.onchange = () => changePreviewImages(previewImageField.value) -modifierSettingsBtn.addEventListener("click", function(e) { - modifierSettingsOverlay.classList.add("active") - customModifiersTextBox.setSelectionRange(0, 0) - customModifiersTextBox.focus() - customModifiersInitialContent = customModifiersTextBox.value // preserve the initial content - e.stopPropagation() -}) - modifierSettingsOverlay.addEventListener("keydown", function(e) { switch (e.key) { case "Escape": // Escape to cancel @@ -397,14 +469,93 @@ modifierSettingsOverlay.addEventListener("keydown", function(e) { } }) -function saveCustomModifiers() { - localStorage.setItem(CUSTOM_MODIFIERS_KEY, customModifiersTextBox.value.trim()) +modifierDropdown.addEventListener("click", e => { + const targetElem = e.target + const isDropdownActive = targetElem.dataset.active == "true" ? true : false - loadCustomModifiers() -} + if (!isDropdownActive) + showModifierContainer() + else + hideModifierContainer() +}) -function loadCustomModifiers() { - PLUGINS["MODIFIERS_LOAD"].forEach((fn) => fn.loader.call()) -} +let collapsiblesBtnState = false -customModifiersTextBox.addEventListener("change", saveCustomModifiers) +modifiersCollapsiblesBtn.addEventListener("click", (e) => { + const btnElem = modifiersCollapsiblesBtn + + const collapseText = "Collapse Categories" + const expandText = "Expand Categories" + + const collapseIconClasses = ["fa-solid", "fa-square-minus"] + const expandIconClasses = ["fa-solid", "fa-square-plus"] + + const iconElem = btnElem.querySelector(".modifiers-action-icon") + const textElem = btnElem.querySelector(".modifiers-action-text") + + if (collapsiblesBtnState) { + collapseAllModifierCategory() + + collapsiblesBtnState = false + + collapseIconClasses.forEach((c) => iconElem.classList.remove(c)) + expandIconClasses.forEach((c) => iconElem.classList.add(c)) + + textElem.innerText = expandText + } else { + expandAllModifierCategory() + + collapsiblesBtnState = true + + expandIconClasses.forEach((c) => iconElem.classList.remove(c)) + collapseIconClasses.forEach((c) => iconElem.classList.add(c)) + + textElem.innerText = collapseText + } +}) + +let containerSizeBtnState = false + +modifiersContainerSizeBtn.addEventListener("click", (e) => { + const btnElem = modifiersContainerSizeBtn + + const maximizeIconClasses = ["fa-solid", "fa-expand"] + const revertIconClasses = ["fa-solid", "fa-compress"] + + modifiersMainContainer.classList.toggle("modifiers-maximized") + + if(containerSizeBtnState) { + revertIconClasses.forEach((c) => btnElem.classList.remove(c)) + maximizeIconClasses.forEach((c) => btnElem.classList.add(c)) + + containerSizeBtnState = false + } else { + maximizeIconClasses.forEach((c) => btnElem.classList.remove(c)) + revertIconClasses.forEach((c) => btnElem.classList.add(c)) + + containerSizeBtnState = true + } +}) + +modifierSettingsBtn.addEventListener("click", (e) => { + modifierSettingsOverlay.classList.add("active") + customModifiersTextBox.setSelectionRange(0, 0) + customModifiersTextBox.focus() + customModifiersInitialContent = customModifiersTextBox.value // preserve the initial content + e.stopPropagation() +}) + +modifiersCloseBtn.addEventListener("click", (e) => { + hideModifierContainer() +}) + +// prevents the modifier panel closing at the same time as the settings overlay +new MutationObserver(() => { + const isActive = modifierSettingsOverlay.classList.contains("active") + + if (!isActive) { + modifierPanelFreezed = true + + setTimeout(() => modifierPanelFreezed = false, 25) + } +}).observe(modifierSettingsOverlay, { attributes: true }) \ No newline at end of file From 7811929b5bf7d5b4860607b309b91630aa427681 Mon Sep 17 00:00:00 2001 From: JeLuF Date: Thu, 22 Jun 2023 01:15:07 +0200 Subject: [PATCH 014/200] Run dev console in ED directory --- scripts/Developer Console.cmd | 2 ++ 1 file changed, 2 insertions(+) diff --git a/scripts/Developer Console.cmd b/scripts/Developer Console.cmd index 921a9dca..256cd682 100644 --- a/scripts/Developer Console.cmd +++ b/scripts/Developer Console.cmd @@ -2,6 +2,8 @@ echo "Opening Stable Diffusion UI - Developer Console.." & echo. +cd %cd% + set PATH=C:\Windows\System32;%PATH% @rem set legacy and new installer's PATH, if they exist From 3dc62a88574f0f40a0400368fc934a7b4574c995 Mon Sep 17 00:00:00 2001 From: JeLuF Date: Thu, 22 Jun 2023 23:48:55 +0200 Subject: [PATCH 015/200] Basic embeddings support --- ui/easydiffusion/model_manager.py | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/ui/easydiffusion/model_manager.py b/ui/easydiffusion/model_manager.py index de2c10ac..a9b42594 100644 --- a/ui/easydiffusion/model_manager.py +++ b/ui/easydiffusion/model_manager.py @@ -27,6 +27,7 @@ MODEL_EXTENSIONS = { "realesrgan": [".pth"], "lora": [".ckpt", ".safetensors"], "codeformer": [".pth"], + "embeddings": [".pt", ".bin", ".safetensors"], } DEFAULT_MODELS = { "stable-diffusion": [ @@ -58,6 +59,9 @@ def init(): def load_default_models(context: Context): set_vram_optimizations(context) + config = app.getConfig() + context.embeddings_path = os.path.join(app.MODELS_DIR, "embeddings") + # init default model paths for model_type in MODELS_TO_LOAD_ON_START: context.model_paths[model_type] = resolve_model_to_use(model_type=model_type, fail_if_not_found=False) @@ -318,6 +322,7 @@ def getModels(): "hypernetwork": [], "lora": [], "codeformer": ["codeformer"], + "embeddings": [], }, } @@ -374,6 +379,7 @@ def getModels(): listModels(model_type="hypernetwork") listModels(model_type="gfpgan") listModels(model_type="lora") + listModels(model_type="embeddings") if models_scanned > 0: log.info(f"[green]Scanned {models_scanned} models. Nothing infected[/]") From a5898aaf3b57170ac8c88b327ecf10673d7c9f22 Mon Sep 17 00:00:00 2001 From: JeLuF Date: Thu, 22 Jun 2023 23:54:45 +0200 Subject: [PATCH 016/200] Show COMSPEC variable in logs --- scripts/Developer Console.cmd | 2 ++ scripts/Start Stable Diffusion UI.cmd | 3 ++- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/scripts/Developer Console.cmd b/scripts/Developer Console.cmd index 921a9dca..232cb6a1 100644 --- a/scripts/Developer Console.cmd +++ b/scripts/Developer Console.cmd @@ -21,6 +21,8 @@ call git --version call where conda call conda --version +echo. +echo COMSPEC=%COMSPEC% echo. @rem activate the legacy environment (if present) and set PYTHONPATH diff --git a/scripts/Start Stable Diffusion UI.cmd b/scripts/Start Stable Diffusion UI.cmd index 4f8555ea..9a4a6303 100644 --- a/scripts/Start Stable Diffusion UI.cmd +++ b/scripts/Start Stable Diffusion UI.cmd @@ -36,8 +36,9 @@ call git --version call where conda call conda --version +echo . +echo COMSPEC=%COMSPEC% @rem Download the rest of the installer and UI call scripts\on_env_start.bat - @pause From c9a5ad9c3a25bc1578f3e920475cef4c053d3bfc Mon Sep 17 00:00:00 2001 From: JeLuF Date: Mon, 26 Jun 2023 12:20:34 +0200 Subject: [PATCH 017/200] Update Developer Console.cmd --- scripts/Developer Console.cmd | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/scripts/Developer Console.cmd b/scripts/Developer Console.cmd index 256cd682..3a91725a 100644 --- a/scripts/Developer Console.cmd +++ b/scripts/Developer Console.cmd @@ -2,7 +2,7 @@ echo "Opening Stable Diffusion UI - Developer Console.." & echo. -cd %cd% +cd /d %~dp0 set PATH=C:\Windows\System32;%PATH% From e1e2a2a249ed414d5e83c4db019b48e2e507204c Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 16:00:55 +0530 Subject: [PATCH 018/200] Update index.html --- ui/index.html | 1 - 1 file changed, 1 deletion(-) diff --git a/ui/index.html b/ui/index.html index a78a6f06..6f771e62 100644 --- a/ui/index.html +++ b/ui/index.html @@ -450,7 +450,6 @@
  • Some custom inpainting models don't work
  • These samplers don't work yet: Unipc SNR, Unipc TQ, Unipc SNR2, DPM++ 2s Ancestral, DPM++ SDE, DPM Fast, DPM Adaptive, DPM2
  • Hypernetwork doesn't work
    • -
  • Multi GPU - cuda:1 and cuda:0 conflict
  • The time remaining in browser differs from the one in the console
    • From 848ff35e85736466200b5119baead5f05685cbd3 Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 16:04:18 +0530 Subject: [PATCH 019/200] Update index.html --- ui/index.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/ui/index.html b/ui/index.html index 15b44daf..ffe91f37 100644 --- a/ui/index.html +++ b/ui/index.html @@ -461,7 +461,8 @@
  • More choices for img2img samplers
    • -
  • Support for inpainting models
    • +
  • Support for official inpainting models
    • +
  • Generate images that tile seamlessly
  • Clip Skip support allows to skip the last CLIP layer (recommended by some LORA models)
  • New samplers: DDPM and DEIS
  • Memory optimizations that allow the use of 2GB GPUs
    • From df416a6a177044450d28e1e0941dd7087583bc23 Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 16:11:10 +0530 Subject: [PATCH 020/200] link --- ui/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/index.html b/ui/index.html index ffe91f37..555cb691 100644 --- a/ui/index.html +++ b/ui/index.html @@ -438,7 +438,7 @@

    Diffusers Tech Preview

    The Diffusers Tech Preview allows early access to the new features based on Diffusers.

    -

    The Preview is under active development. It is experimental! It does still have bugs and missing features!

    +

    This is under active development, and is missing a few features. It is experimental! Please report any bugs to the #beta channel in our Discord server!

    New upcoming features in our new engine

    • LORA support - Place LORA files in the models/lora folder.
      • From f6bd05bcf1895dcf1b83e0493c1bedb945ed391f Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 16:35:31 +0530 Subject: [PATCH 021/200] Link to ED-hosted community repo, to provide a stable and continuous home incase a community owner is no longer active --- ui/media/js/plugins.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ui/media/js/plugins.js b/ui/media/js/plugins.js index ef9c9f33..fb3e8b07 100644 --- a/ui/media/js/plugins.js +++ b/ui/media/js/plugins.js @@ -1,7 +1,7 @@ const PLUGIN_API_VERSION = "1.0" -const PLUGIN_CATALOG = 'https://raw.githubusercontent.com/patriceac/Easy-Diffusion-Plugins/main/plugins.json' -const PLUGIN_CATALOG_GITHUB = 'https://github.com/patriceac/Easy-Diffusion-Plugins/blob/main/plugins.json' +const PLUGIN_CATALOG = 'https://raw.githubusercontent.com/easydiffusion/easydiffusion-plugins/main/plugins.json' +const PLUGIN_CATALOG_GITHUB = 'https://github.com/easydiffusion/easydiffusion-plugins/blob/main/plugins.json' const PLUGINS = { /** From 95768cdb05c42f7848be4abb3706124d40475d03 Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 16:57:51 +0530 Subject: [PATCH 022/200] Bump version --- ui/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/index.html b/ui/index.html index 555cb691..6b92a963 100644 --- a/ui/index.html +++ b/ui/index.html @@ -30,7 +30,7 @@

      Easy Diffusion - v2.5.41 + v2.5.42

      From 913550295c01bdc2e41f408be8e18b30ca67acba Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 17:01:01 +0530 Subject: [PATCH 023/200] Install ruamel.yaml 0.17.21 --- scripts/check_modules.py | 1 + 1 file changed, 1 insertion(+) diff --git a/scripts/check_modules.py b/scripts/check_modules.py index 4634adb3..d6a26424 100644 --- a/scripts/check_modules.py +++ b/scripts/check_modules.py @@ -24,6 +24,7 @@ modules_to_check = { "uvicorn": "0.19.0", "fastapi": "0.85.1", "pycloudflared": "0.2.0", + "ruamel.yaml": "0.17.21", # "xformers": "0.0.16", } modules_to_log = ["torch", "torchvision", "sdkit", "stable-diffusion-sdkit"] From ab0d08b7a3d28e1d1eea26e1e214d94137dcf6fc Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 17:08:28 +0530 Subject: [PATCH 024/200] debug log --- ui/easydiffusion/app.py | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/ui/easydiffusion/app.py b/ui/easydiffusion/app.py index d50ee5d1..7e478655 100644 --- a/ui/easydiffusion/app.py +++ b/ui/easydiffusion/app.py @@ -106,7 +106,6 @@ def getConfig(default_val=APP_CONFIG_DEFAULTS): config_yaml_path = os.path.join(CONFIG_DIR, "config.yaml") if os.path.isfile(config_yaml_path): try: - log.info("Loading config.yaml") with open(config_yaml_path, "r", encoding="utf-8") as f: config = yaml.load(f) if "net" not in config: @@ -114,7 +113,7 @@ def getConfig(default_val=APP_CONFIG_DEFAULTS): if os.getenv("SD_UI_BIND_PORT") is not None: config["net"]["listen_port"] = int(os.getenv("SD_UI_BIND_PORT")) else: - config['net']['listen_port'] = 9000 + config["net"]["listen_port"] = 9000 if os.getenv("SD_UI_BIND_IP") is not None: config["net"]["listen_to_network"] = os.getenv("SD_UI_BIND_IP") == "0.0.0.0" else: @@ -143,10 +142,10 @@ def getConfig(default_val=APP_CONFIG_DEFAULTS): def setConfig(config): - try: # config.yaml - config_yaml_path = os.path.join(CONFIG_DIR, 'config.yaml') + try: # config.yaml + config_yaml_path = os.path.join(CONFIG_DIR, "config.yaml") yaml.indent(mapping=2, sequence=4, offset=2) - with open(config_yaml_path, 'w', encoding='utf-8') as f: + with open(config_yaml_path, "w", encoding="utf-8") as f: yaml.dump(config, f) except: log.error(traceback.format_exc()) From aa53b868fca001539c337bfe981d826a0655ec5e Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 17:08:46 +0530 Subject: [PATCH 025/200] Temporarily disable plugins manager until the runtime error is figured out --- ui/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/index.html b/ui/index.html index 5e7eb585..2cfbdcc8 100644 --- a/ui/index.html +++ b/ui/index.html @@ -610,7 +610,7 @@ async function init() { await loadUIPlugins() await loadModifiers() await getSystemInfo() - await initPlugins() + // await initPlugins() SD.init({ events: { From 19b42c91c04de4d043355e0a6a402c2cd94d6211 Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 17:17:28 +0530 Subject: [PATCH 026/200] temporarily disable plugins tab --- ui/media/js/plugins.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/media/js/plugins.js b/ui/media/js/plugins.js index fb3e8b07..d0511ab7 100644 --- a/ui/media/js/plugins.js +++ b/ui/media/js/plugins.js @@ -86,7 +86,7 @@ async function loadUIPlugins() { /* PLUGIN MANAGER */ /* plugin tab */ document.querySelector('.tab-container')?.insertAdjacentHTML('beforeend', ` - + `) From 417daa264f660647b828707d783a9df581821969 Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 20:07:15 +0530 Subject: [PATCH 027/200] Temporarily comment out the plugin manager code, which seems to be conflicting with the plugin manager plugin --- ui/media/js/plugins.js | 1886 ++++++++++++++++++++-------------------- 1 file changed, 943 insertions(+), 943 deletions(-) diff --git a/ui/media/js/plugins.js b/ui/media/js/plugins.js index d0511ab7..972f0d7b 100644 --- a/ui/media/js/plugins.js +++ b/ui/media/js/plugins.js @@ -85,946 +85,946 @@ async function loadUIPlugins() { /* PLUGIN MANAGER */ /* plugin tab */ -document.querySelector('.tab-container')?.insertAdjacentHTML('beforeend', ` - -`) - -document.querySelector('#tab-content-wrapper')?.insertAdjacentHTML('beforeend', ` -
      -
      - Loading... -
      -
      -`) - -const tabPlugin = document.querySelector('#tab-plugin') -if (tabPlugin) { - linkTabContents(tabPlugin) -} - -const plugin = document.querySelector('#plugin') -plugin.innerHTML = ` -
      - - - - -
      -

      Plugin Manager

      -
      Changes take effect after reloading the page
      -
      -
      -
      ` -const pluginsTable = document.querySelector("#plugin-manager-section .plugins-table") -const pluginNotificationTable = document.querySelector("#plugin-notification-list .notifications-table") -const pluginNoNotification = document.querySelector("#plugin-notification-list .no-notification") - -/* notification center */ -const pluginNotificationButton = document.getElementById("plugin-notification-button"); -const pluginNotificationList = document.getElementById("plugin-notification-list"); -const notificationPill = document.getElementById("notification-pill"); -const pluginManagerSection = document.getElementById("plugin-manager-section"); -let pluginNotifications; - -// Add event listener to show/hide the action center -pluginNotificationButton.addEventListener("click", function () { - // Hide the notification pill when the action center is opened - notificationPill.style.display = "none" - pluginNotifications.lastUpdated = Date.now() - - // save the notifications - setStorageData('notifications', JSON.stringify(pluginNotifications)) - - renderPluginNotifications() - - if (pluginNotificationList.style.display === "none") { - pluginNotificationList.style.display = "block" - pluginManagerSection.style.display = "none" - } else { - pluginNotificationList.style.display = "none" - pluginManagerSection.style.display = "block" - } -}) - -document.addEventListener("tabClick", (e) => { - if (e.detail.name == 'plugin') { - pluginNotificationList.style.display = "none" - pluginManagerSection.style.display = "block" - } -}) - -async function addPluginNotification(pluginNotifications, messageText, error) { - const now = Date.now() - pluginNotifications.entries.unshift({ date: now, text: messageText, error: error }); // add new entry to the beginning of the array - if (pluginNotifications.entries.length > 50) { - pluginNotifications.entries.length = 50 // limit array length to 50 entries - } - pluginNotifications.lastUpdated = now - notificationPill.style.display = "block" - // save the notifications - await setStorageData('notifications', JSON.stringify(pluginNotifications)) -} - -function timeAgo(inputDate) { - const now = new Date(); - const date = new Date(inputDate); - const diffInSeconds = Math.floor((now - date) / 1000); - const units = [ - { name: 'year', seconds: 31536000 }, - { name: 'month', seconds: 2592000 }, - { name: 'week', seconds: 604800 }, - { name: 'day', seconds: 86400 }, - { name: 'hour', seconds: 3600 }, - { name: 'minute', seconds: 60 }, - { name: 'second', seconds: 1 } - ]; - - for (const unit of units) { - const unitValue = Math.floor(diffInSeconds / unit.seconds); - if (unitValue > 0) { - return `${unitValue} ${unit.name}${unitValue > 1 ? 's' : ''} ago`; - } - } - - return 'just now'; -} - -function convertSeconds(seconds) { - const hours = Math.floor(seconds / 3600); - const minutes = Math.floor((seconds % 3600) / 60); - const remainingSeconds = seconds % 60; - - let timeParts = []; - if (hours === 1) { - timeParts.push(`${hours} hour`); - } else if (hours > 1) { - timeParts.push(`${hours} hours`); - } - if (minutes === 1) { - timeParts.push(`${minutes} minute`); - } else if (minutes > 1) { - timeParts.push(`${minutes} minutes`); - } - if (remainingSeconds === 1) { - timeParts.push(`${remainingSeconds} second`); - } else if (remainingSeconds > 1) { - timeParts.push(`${remainingSeconds} seconds`); - } - - return timeParts.join(', and '); -} - -function renderPluginNotifications() { - pluginNotificationTable.innerHTML = '' - - if (pluginNotifications.entries?.length > 0) { - pluginNoNotification.style.display = "none" - pluginNotificationTable.style.display = "block" - } - else { - pluginNoNotification.style.display = "block" - pluginNotificationTable.style.display = "none" - } - for (let i = 0; i < pluginNotifications.entries?.length; i++) { - const date = pluginNotifications.entries[i].date - const text = pluginNotifications.entries[i].text - const error = pluginNotifications.entries[i].error - const newRow = document.createElement('div') - - newRow.innerHTML = ` - ${text}
      -
      ${timeAgo(date)}
      - `; - pluginNotificationTable.appendChild(newRow) - } -} - -/* search box */ -function filterPlugins() { - let search = pluginFilter.value.toLowerCase(); - let searchTerms = search.split(' '); - let labels = pluginsTable.querySelectorAll("label.plugin-name"); - - for (let i = 0; i < labels.length; i++) { - let label = labels[i].innerText.toLowerCase(); - let match = true; - - for (let j = 0; j < searchTerms.length; j++) { - let term = searchTerms[j].trim(); - if (term && label.indexOf(term) === -1) { - match = false; - break; - } - } - - if (match) { - labels[i].closest('.plugin-container').style.display = "flex"; - } else { - labels[i].closest('.plugin-container').style.display = "none"; - } - } -} - -// Call debounce function on filterImageModifierList function with 200ms wait time. Thanks JeLuf! -const debouncedFilterPlugins = debounce(filterPlugins, 200); - -// add the searchbox -pluginsTable.insertAdjacentHTML('beforebegin', ``) -const pluginFilter = document.getElementById("plugin-filter") // search box - -// Add the debounced function to the keyup event listener -pluginFilter.addEventListener('keyup', debouncedFilterPlugins); - -// select the text on focus -pluginFilter.addEventListener('focus', function (event) { - pluginFilter.select() -}); - -// empty the searchbox on escape -pluginFilter.addEventListener('keydown', function (event) { - if (event.key === 'Escape') { - pluginFilter.value = ''; - filterPlugins(); - } -}); - -// focus on the search box upon tab selection -document.addEventListener("tabClick", (e) => { - if (e.detail.name == 'plugin') { - pluginFilter.focus() - } -}) - -// refresh link -pluginsTable.insertAdjacentHTML('afterend', `

      Refresh plugins

      -

      (Plugin developers, add your plugins to plugins.json)

      `) -const refreshPlugins = document.getElementById("refresh-plugins") -refreshPlugins.addEventListener("click", async function (event) { - event.preventDefault() - await initPlugins(true) -}) - -function showPluginToast(message, duration = 5000, error = false, addNotification = true) { - if (addNotification === true) { - addPluginNotification(pluginNotifications, message, error) - } - try { - showToast(message, duration, error) - } catch (error) { - console.error('Error while trying to show toast:', error); - } -} - -function matchPluginFileNames(fileName1, fileName2) { - const regex = /^(.+?)(?:-\d+(\.\d+)*)?\.plugin\.js$/; - const match1 = fileName1.match(regex); - const match2 = fileName2.match(regex); - - if (match1 && match2 && match1[1] === match2[1]) { - return true; // the two file names match - } else { - return false; // the two file names do not match - } -} - -function extractFilename(filepath) { - // Normalize the path separators to forward slashes and make the file names lowercase - const normalizedFilePath = filepath.replace(/\\/g, "/").toLowerCase(); - - // Strip off the path from the file name - const fileName = normalizedFilePath.substring(normalizedFilePath.lastIndexOf("/") + 1); - - return fileName -} - -function checkFileNameInArray(paths, filePath) { - // Strip off the path from the file name - const fileName = extractFilename(filePath); - - // Check if the file name exists in the array of paths - return paths.some(path => { - // Strip off the path from the file name - const baseName = extractFilename(path); - - // Check if the file names match and return the result as a boolean - return matchPluginFileNames(fileName, baseName); - }); -} - -function isGitHub(url) { - return url.startsWith("https://raw.githubusercontent.com/") === true -} - -/* fill in the plugins table */ -function getIncompatiblePlugins(pluginId) { - const enabledPlugins = plugins.filter(plugin => plugin.enabled && plugin.id !== pluginId); - const incompatiblePlugins = enabledPlugins.filter(plugin => plugin.compatIssueIds?.includes(pluginId)); - const pluginNames = incompatiblePlugins.map(plugin => plugin.name); - if (pluginNames.length === 0) { - return null; - } - const pluginNamesList = pluginNames.map(name => `
    • ${name}
      • `).join(''); - return `
        ${pluginNamesList}
      `; -} - -async function initPluginTable(plugins) { - pluginsTable.innerHTML = '' - plugins.sort((a, b) => a.name.localeCompare(b.name, undefined, { sensitivity: 'base' })) - plugins.forEach(plugin => { - const name = plugin.name - const author = plugin.author ? ', by ' + plugin.author : '' - const version = plugin.version ? ' (version: ' + plugin.version + ')' : '' - const warning = getIncompatiblePlugins(plugin.id) ? `This plugin might conflict with:${getIncompatiblePlugins(plugin.id)}` : '' - const note = plugin.description ? `${plugin.description.replaceAll('\n', '
      ')}      ` : `No description`; - const icon = plugin.icon ? `` : ''; - const newRow = document.createElement('div') - const localPluginFound = checkFileNameInArray(localPlugins, plugin.url) - - newRow.innerHTML = ` -
      ${icon}
      -
      ${warning}${note}Source: ${extractFilename(plugin.url)}
      -
      - ${localPluginFound ? "Installed locally" : - (plugin.localInstallOnly ? 'Download and
      install manually      ' : - (isGitHub(plugin.url) ? - '' : - '' - ) - ) - } -
      `; - newRow.classList.add('plugin-container') - //console.log(plugin.id, plugin.localInstallOnly) - pluginsTable.appendChild(newRow) - const pluginManualInstall = pluginsTable.querySelector('#plugin-' + plugin.id + '-install') - updateManualInstallButtonCaption() - - // checkbox event handler - const pluginToggle = pluginsTable.querySelector('#plugin-' + plugin.id) - if (pluginToggle !== null) { - pluginToggle.checked = plugin.enabled // set initial state of checkbox - pluginToggle.addEventListener('change', async () => { - const container = pluginToggle.closest(".plugin-container"); - const warningElement = container.querySelector(".plugin-warning"); - - // if the plugin got enabled, download the plugin's code - plugin.enabled = pluginToggle.checked - if (plugin.enabled) { - const pluginSource = await getDocument(plugin.url); - if (pluginSource !== null) { - // Store the current scroll position before navigating away - const currentPosition = window.pageYOffset; - initPluginTable(plugins) - // When returning to the page, set the scroll position to the stored value - window.scrollTo(0, currentPosition); - warningElement?.classList.remove("hide"); - plugin.code = pluginSource - loadPlugins([plugin]) - console.log(`Plugin ${plugin.name} installed`); - showPluginToast("Plugin " + plugin.name + " installed"); - } - else { - plugin.enabled = false - pluginToggle.checked = false - console.error(`Couldn't download plugin ${plugin.name}`); - showPluginToast("Failed to install " + plugin.name + " (Couldn't fetch " + extractFilename(plugin.url) + ")", 5000, true); - } - } else { - warningElement?.classList.add("hide"); - // Store the current scroll position before navigating away - const currentPosition = window.pageYOffset; - initPluginTable(plugins) - // When returning to the page, set the scroll position to the stored value - window.scrollTo(0, currentPosition); - console.log(`Plugin ${plugin.name} uninstalled`); - showPluginToast("Plugin " + plugin.name + " uninstalled"); - } - await setStorageData('plugins', JSON.stringify(plugins)) - }) - } - - // manual install event handler - if (pluginManualInstall !== null) { - pluginManualInstall.addEventListener('click', async () => { - pluginDialogOpenDialog(inputOK, inputCancel) - pluginDialogTextarea.value = plugin.code ? plugin.code : '' - pluginDialogTextarea.select() - pluginDialogTextarea.focus() - }) - } - // Dialog OK - async function inputOK() { - let pluginSource = pluginDialogTextarea.value - // remove empty lines and trim existing lines - plugin.code = pluginSource - if (pluginSource.trim() !== '') { - plugin.enabled = true - console.log(`Plugin ${plugin.name} installed`); - showPluginToast("Plugin " + plugin.name + " installed"); - } - else { - plugin.enabled = false - console.log(`No code provided for plugin ${plugin.name}, disabling the plugin`); - showPluginToast("No code provided for plugin " + plugin.name + ", disabling the plugin"); - } - updateManualInstallButtonCaption() - await setStorageData('plugins', JSON.stringify(plugins)) - } - // Dialog Cancel - async function inputCancel() { - plugin.enabled = false - console.log(`Installation of plugin ${plugin.name} cancelled`); - showPluginToast("Cancelled installation of " + plugin.name); - } - // update button caption - function updateManualInstallButtonCaption() { - if (pluginManualInstall !== null) { - pluginManualInstall.innerHTML = plugin.code === undefined || plugin.code.trim() === '' ? 'Install' : 'Edit' - } - } - }) - prettifyInputs(pluginsTable) - filterPlugins() -} - -/* version management. Thanks Madrang! */ -const parseVersion = function (versionString, options = {}) { - if (typeof versionString === "undefined") { - throw new Error("versionString is undefined."); - } - if (typeof versionString !== "string") { - throw new Error("versionString is not a string."); - } - const lexicographical = options && options.lexicographical; - const zeroExtend = options && options.zeroExtend; - let versionParts = versionString.split('.'); - function isValidPart(x) { - const re = (lexicographical ? /^\d+[A-Za-z]*$/ : /^\d+$/); - return re.test(x); - } - - if (!versionParts.every(isValidPart)) { - throw new Error("Version string is invalid."); - } - - if (zeroExtend) { - while (versionParts.length < 4) { - versionParts.push("0"); - } - } - if (!lexicographical) { - versionParts = versionParts.map(Number); - } - return versionParts; -}; - -const versionCompare = function (v1, v2, options = {}) { - if (typeof v1 == "undefined") { - throw new Error("vi is undefined."); - } - if (typeof v2 === "undefined") { - throw new Error("v2 is undefined."); - } - - let v1parts; - if (typeof v1 === "string") { - v1parts = parseVersion(v1, options); - } else if (Array.isArray(v1)) { - v1parts = [...v1]; - if (!v1parts.every(p => typeof p === "number" && p !== NaN)) { - throw new Error("v1 part array does not only contains numbers."); - } - } else { - throw new Error("v1 is of an unexpected type: " + typeof v1); - } - - let v2parts; - if (typeof v2 === "string") { - v2parts = parseVersion(v2, options); - } else if (Array.isArray(v2)) { - v2parts = [...v2]; - if (!v2parts.every(p => typeof p === "number" && p !== NaN)) { - throw new Error("v2 part array does not only contains numbers."); - } - } else { - throw new Error("v2 is of an unexpected type: " + typeof v2); - } - - while (v1parts.length < v2parts.length) { - v1parts.push("0"); - } - while (v2parts.length < v1parts.length) { - v2parts.push("0"); - } - - for (let i = 0; i < v1parts.length; ++i) { - if (v2parts.length == i) { - return 1; - } - if (v1parts[i] == v2parts[i]) { - continue; - } else if (v1parts[i] > v2parts[i]) { - return 1; - } else { - return -1; - } - } - return 0; -}; - -function filterPluginsByMinEDVersion(plugins, EDVersion) { - const filteredPlugins = plugins.filter(plugin => { - if (plugin.minEDVersion) { - return versionCompare(plugin.minEDVersion, EDVersion) <= 0; - } - return true; - }); - - return filteredPlugins; -} - -function extractVersionNumber(elem) { - const versionStr = elem.innerHTML; - const regex = /v(\d+\.\d+\.\d+)/; - const matches = regex.exec(versionStr); - if (matches && matches.length > 1) { - return matches[1]; - } else { - return null; - } -} -const EasyDiffusionVersion = extractVersionNumber(document.querySelector('#top-nav > #logo')) - -/* PLUGIN MANAGEMENT */ -let plugins -let localPlugins -let initPluginsInProgress = false - -async function initPlugins(refreshPlugins = false) { - let pluginsLoaded - if (initPluginsInProgress === true) { - return - } - initPluginsInProgress = true - - const res = await fetch('/get/ui_plugins') - if (!res.ok) { - console.error(`Error HTTP${res.status} while loading plugins list. - ${res.statusText}`) - } - else { - localPlugins = await res.json() - } - - if (refreshPlugins === false) { - // load the notifications - pluginNotifications = await getStorageData('notifications') - if (typeof pluginNotifications === "string") { - try { - pluginNotifications = JSON.parse(pluginNotifications) - } catch (e) { - console.error("Failed to parse pluginNotifications", e); - pluginNotifications = {}; - pluginNotifications.entries = []; - } - } - if (pluginNotifications !== undefined) { - if (pluginNotifications.entries && pluginNotifications.entries.length > 0 && pluginNotifications.entries[0].date && pluginNotifications.lastUpdated <= pluginNotifications.entries[0].date) { - notificationPill.style.display = "block"; - } - } else { - pluginNotifications = {}; - pluginNotifications.entries = []; - } - - // try and load plugins from local cache - plugins = await getStorageData('plugins') - if (plugins !== undefined) { - plugins = JSON.parse(plugins) - - // remove duplicate entries if any (should not happen) - plugins = deduplicatePluginsById(plugins) - - // remove plugins that don't meet the min ED version requirement - plugins = filterPluginsByMinEDVersion(plugins, EasyDiffusionVersion) - - // remove from plugins the entries that don't have mandatory fields (id, name, url) - plugins = plugins.filter((plugin) => { return plugin.id !== '' && plugin.name !== '' && plugin.url !== ''; }); - - // populate the table - initPluginTable(plugins) - await loadPlugins(plugins) - pluginsLoaded = true - } - else { - plugins = [] - pluginsLoaded = false - } - } - - // update plugins asynchronously (updated versions will be available next time the UI is loaded) - if (refreshAllowed()) { - let pluginCatalog = await getDocument(PLUGIN_CATALOG) - if (pluginCatalog !== null) { - let parseError = false; - try { - pluginCatalog = JSON.parse(pluginCatalog); - console.log('Plugin catalog successfully downloaded'); - } catch (error) { - console.error('Error parsing plugin catalog:', error); - parseError = true; - } - - if (!parseError) { - await downloadPlugins(pluginCatalog, plugins, refreshPlugins) - - // update compatIssueIds - updateCompatIssueIds() - - // remove plugins that don't meet the min ED version requirement - plugins = filterPluginsByMinEDVersion(plugins, EasyDiffusionVersion) - - // remove from plugins the entries that don't have mandatory fields (id, name, url) - plugins = plugins.filter((plugin) => { return plugin.id !== '' && plugin.name !== '' && plugin.url !== ''; }); - - // remove from plugins the entries that no longer exist in the catalog - plugins = plugins.filter((plugin) => { return pluginCatalog.some((p) => p.id === plugin.id) }); - - if (pluginCatalog.length > plugins.length) { - const newPlugins = pluginCatalog.filter((plugin) => { - return !plugins.some((p) => p.id === plugin.id); - }); - - newPlugins.forEach((plugin, index) => { - setTimeout(() => { - showPluginToast(`New plugin "${plugin.name}" is available.`); - }, (index + 1) * 1000); - }); - } - - let pluginsJson; - try { - pluginsJson = JSON.stringify(plugins); // attempt to parse plugins to JSON - } catch (error) { - console.error('Error converting plugins to JSON:', error); - } - - if (pluginsJson) { // only store the data if pluginsJson is not null or undefined - await setStorageData('plugins', pluginsJson) - } - - // refresh the display of the plugins table - initPluginTable(plugins) - if (pluginsLoaded && pluginsLoaded === false) { - loadPlugins(plugins) - } - } - } - } - else { - if (refreshPlugins) { - showPluginToast('Plugins have been refreshed recently, refresh will be available in ' + convertSeconds(getTimeUntilNextRefresh()), 5000, true, false) - } - } - initPluginsInProgress = false -} - -function updateMetaTagPlugins(plugin) { - // Update the meta tag with the list of loaded plugins - let metaTag = document.querySelector('meta[name="plugins"]'); - if (metaTag === null) { - metaTag = document.createElement('meta'); - metaTag.name = 'plugins'; - document.head.appendChild(metaTag); - } - const pluginArray = [...(metaTag.content ? metaTag.content.split(',') : []), plugin.id]; - metaTag.content = pluginArray.join(','); -} - -function updateCompatIssueIds() { - // Loop through each plugin - plugins.forEach(plugin => { - // Check if the plugin has `compatIssueIds` property - if (plugin.compatIssueIds !== undefined) { - // Loop through each of the `compatIssueIds` - plugin.compatIssueIds.forEach(issueId => { - // Find the plugin with the corresponding `issueId` - const issuePlugin = plugins.find(p => p.id === issueId); - // If the corresponding plugin is found, initialize its `compatIssueIds` property with an empty array if it's undefined - if (issuePlugin) { - if (issuePlugin.compatIssueIds === undefined) { - issuePlugin.compatIssueIds = []; - } - // If the current plugin's ID is not already in the `compatIssueIds` array, add it - if (!issuePlugin.compatIssueIds.includes(plugin.id)) { - issuePlugin.compatIssueIds.push(plugin.id); - } - } - }); - } else { - // If the plugin doesn't have `compatIssueIds` property, initialize it with an empty array - plugin.compatIssueIds = []; - } - }); -} - -function deduplicatePluginsById(plugins) { - const seenIds = new Set(); - const deduplicatedPlugins = []; - - for (const plugin of plugins) { - if (!seenIds.has(plugin.id)) { - seenIds.add(plugin.id); - deduplicatedPlugins.push(plugin); - } else { - // favor dupes that have enabled == true - const index = deduplicatedPlugins.findIndex(p => p.id === plugin.id); - if (index >= 0) { - if (plugin.enabled) { - deduplicatedPlugins[index] = plugin; - } - } - } - } - - return deduplicatedPlugins; -} - -async function loadPlugins(plugins) { - for (let i = 0; i < plugins.length; i++) { - const plugin = plugins[i]; - if (plugin.enabled === true && plugin.localInstallOnly !== true) { - const localPluginFound = checkFileNameInArray(localPlugins, plugin.url); - if (!localPluginFound) { - try { - // Indirect eval to work around sloppy plugin implementations - const indirectEval = { eval }; - console.log("Loading plugin " + plugin.name); - indirectEval.eval(plugin.code); - console.log("Plugin " + plugin.name + " loaded"); - await updateMetaTagPlugins(plugin); // add plugin to the meta tag - } catch (err) { - showPluginToast("Error loading plugin " + plugin.name + " (" + err.message + ")", null, true); - console.error("Error loading plugin " + plugin.name + ": " + err.message); - } - } else { - console.log("Skipping plugin " + plugin.name + " (installed locally)"); - } - } - } -} - -async function getFileHash(url) { - const regex = /^https:\/\/raw\.githubusercontent\.com\/(?[^/]+)\/(?[^/]+)\/(?[^/]+)\/(?.+)$/; - const match = url.match(regex); - if (!match) { - console.error('Invalid GitHub repository URL.'); - return Promise.resolve(null); - } - const owner = match.groups.owner; - const repo = match.groups.repo; - const branch = match.groups.branch; - const filePath = match.groups.filePath; - const apiUrl = `https://api.github.com/repos/${owner}/${repo}/contents/${filePath}?ref=${branch}`; - - try { - const response = await fetch(apiUrl); - if (!response.ok) { - throw new Error(`HTTP error! status: ${response.status}, url: ${apiUrl}`); - } - const data = await response.json(); - return data.sha; - } catch (error) { - console.error('Error fetching data from url:', apiUrl, 'Error:', error); - return null; - } -} - -// only allow two refresh per hour -function getTimeUntilNextRefresh() { - const lastRuns = JSON.parse(localStorage.getItem('lastRuns') || '[]'); - const currentTime = new Date().getTime(); - const numRunsLast60Min = lastRuns.filter(run => currentTime - run <= 60 * 60 * 1000).length; - - if (numRunsLast60Min >= 2) { - return 3600 - Math.round((currentTime - lastRuns[lastRuns.length - 1]) / 1000); - } - - return 0; -} - -function refreshAllowed() { - const timeUntilNextRefresh = getTimeUntilNextRefresh(); - - if (timeUntilNextRefresh > 0) { - console.log(`Next refresh available in ${timeUntilNextRefresh} seconds`); - return false; - } - - const lastRuns = JSON.parse(localStorage.getItem('lastRuns') || '[]'); - const currentTime = new Date().getTime(); - lastRuns.push(currentTime); - localStorage.setItem('lastRuns', JSON.stringify(lastRuns)); - return true; -} - -async function downloadPlugins(pluginCatalog, plugins, refreshPlugins) { - // download the plugins as needed - for (const plugin of pluginCatalog) { - //console.log(plugin.id, plugin.url) - const existingPlugin = plugins.find(p => p.id === plugin.id); - // get the file hash in the GitHub repo - let sha - if (isGitHub(plugin.url) && existingPlugin?.enabled === true) { - sha = await getFileHash(plugin.url) - } - if (plugin.localInstallOnly !== true && isGitHub(plugin.url) && existingPlugin?.enabled === true && (refreshPlugins || (existingPlugin.sha !== undefined && existingPlugin.sha !== null && existingPlugin.sha !== sha) || existingPlugin?.code === undefined)) { - const pluginSource = await getDocument(plugin.url); - if (pluginSource !== null && pluginSource !== existingPlugin.code) { - console.log(`Plugin ${plugin.name} updated`); - showPluginToast("Plugin " + plugin.name + " updated", 5000); - // Update the corresponding plugin - const updatedPlugin = { - ...existingPlugin, - icon: plugin.icon ? plugin.icon : "fa-puzzle-piece", - id: plugin.id, - name: plugin.name, - description: plugin.description, - url: plugin.url, - localInstallOnly: Boolean(plugin.localInstallOnly), - version: plugin.version, - code: pluginSource, - author: plugin.author, - sha: sha, - compatIssueIds: plugin.compatIssueIds - }; - // Replace the old plugin in the plugins array - const pluginIndex = plugins.indexOf(existingPlugin); - if (pluginIndex >= 0) { - plugins.splice(pluginIndex, 1, updatedPlugin); - } else { - plugins.push(updatedPlugin); - } - } - } - else if (existingPlugin !== undefined) { - // Update the corresponding plugin's metadata - const updatedPlugin = { - ...existingPlugin, - icon: plugin.icon ? plugin.icon : "fa-puzzle-piece", - id: plugin.id, - name: plugin.name, - description: plugin.description, - url: plugin.url, - localInstallOnly: Boolean(plugin.localInstallOnly), - version: plugin.version, - author: plugin.author, - compatIssueIds: plugin.compatIssueIds - }; - // Replace the old plugin in the plugins array - const pluginIndex = plugins.indexOf(existingPlugin); - plugins.splice(pluginIndex, 1, updatedPlugin); - } - else { - plugins.push(plugin); - } - } -} - -async function getDocument(url) { - try { - let response = await fetch(url === PLUGIN_CATALOG ? PLUGIN_CATALOG : url, { cache: "no-cache" }); - if (!response.ok) { - throw new Error(`Response error: ${response.status} ${response.statusText}`); - } - let document = await response.text(); - return document; - } catch (error) { - showPluginToast("Couldn't fetch " + extractFilename(url) + " (" + error + ")", null, true); - console.error(error); - return null; - } -} - -/* MODAL DIALOG */ -const pluginDialogDialog = document.createElement("div"); -pluginDialogDialog.id = "pluginDialog-input-dialog"; -pluginDialogDialog.style.display = "none"; - -pluginDialogDialog.innerHTML = ` -
      -
      -
      -

      Paste the plugin's code here

      - -
      -
      - -
      -
      - - -
      -
      -`; - -document.body.appendChild(pluginDialogDialog); - -const pluginDialogOverlay = document.querySelector(".pluginDialog-dialog-overlay"); -const pluginDialogOkButton = document.getElementById("pluginDialog-input-ok"); -const pluginDialogCancelButton = document.getElementById("pluginDialog-input-cancel"); -const pluginDialogCloseButton = document.querySelector(".pluginDialog-dialog-close-button"); -const pluginDialogTextarea = document.getElementById("pluginDialog-input-textarea"); -let callbackOK -let callbackCancel - -function pluginDialogOpenDialog(inputOK, inputCancel) { - pluginDialogDialog.style.display = "block"; - callbackOK = inputOK - callbackCancel = inputCancel -} - -function pluginDialogCloseDialog() { - pluginDialogDialog.style.display = "none"; -} - -function pluginDialogHandleOkClick() { - const userInput = pluginDialogTextarea.value; - // Do something with the user input - callbackOK() - pluginDialogCloseDialog(); -} - -function pluginDialogHandleCancelClick() { - callbackCancel() - pluginDialogCloseDialog(); -} - -function pluginDialogHandleOverlayClick(event) { - if (event.target === pluginDialogOverlay) { - pluginDialogCloseDialog(); - } -} - -function pluginDialogHandleKeyDown(event) { - if ((event.key === "Enter" && event.ctrlKey) || event.key === "Escape") { - event.preventDefault(); - if (event.key === "Enter" && event.ctrlKey) { - pluginDialogHandleOkClick(); - } else { - pluginDialogCloseDialog(); - } - } -} - -pluginDialogTextarea.addEventListener("keydown", pluginDialogHandleKeyDown); -pluginDialogOkButton.addEventListener("click", pluginDialogHandleOkClick); -pluginDialogCancelButton.addEventListener("click", pluginDialogHandleCancelClick); -pluginDialogCloseButton.addEventListener("click", pluginDialogCloseDialog); -pluginDialogOverlay.addEventListener("click", pluginDialogHandleOverlayClick); +// document.querySelector('.tab-container')?.insertAdjacentHTML('beforeend', ` +// +// `) + +// document.querySelector('#tab-content-wrapper')?.insertAdjacentHTML('beforeend', ` +//
      +//
      +// Loading... +//
      +//
      +// `) + +// const tabPlugin = document.querySelector('#tab-plugin') +// if (tabPlugin) { +// linkTabContents(tabPlugin) +// } + +// const plugin = document.querySelector('#plugin') +// plugin.innerHTML = ` +//
      +// +// +// +// +//
      +//

      Plugin Manager

      +//
      Changes take effect after reloading the page
      +//
      +//
      +//
      ` +// const pluginsTable = document.querySelector("#plugin-manager-section .plugins-table") +// const pluginNotificationTable = document.querySelector("#plugin-notification-list .notifications-table") +// const pluginNoNotification = document.querySelector("#plugin-notification-list .no-notification") + +// /* notification center */ +// const pluginNotificationButton = document.getElementById("plugin-notification-button"); +// const pluginNotificationList = document.getElementById("plugin-notification-list"); +// const notificationPill = document.getElementById("notification-pill"); +// const pluginManagerSection = document.getElementById("plugin-manager-section"); +// let pluginNotifications; + +// // Add event listener to show/hide the action center +// pluginNotificationButton.addEventListener("click", function () { +// // Hide the notification pill when the action center is opened +// notificationPill.style.display = "none" +// pluginNotifications.lastUpdated = Date.now() + +// // save the notifications +// setStorageData('notifications', JSON.stringify(pluginNotifications)) + +// renderPluginNotifications() + +// if (pluginNotificationList.style.display === "none") { +// pluginNotificationList.style.display = "block" +// pluginManagerSection.style.display = "none" +// } else { +// pluginNotificationList.style.display = "none" +// pluginManagerSection.style.display = "block" +// } +// }) + +// document.addEventListener("tabClick", (e) => { +// if (e.detail.name == 'plugin') { +// pluginNotificationList.style.display = "none" +// pluginManagerSection.style.display = "block" +// } +// }) + +// async function addPluginNotification(pluginNotifications, messageText, error) { +// const now = Date.now() +// pluginNotifications.entries.unshift({ date: now, text: messageText, error: error }); // add new entry to the beginning of the array +// if (pluginNotifications.entries.length > 50) { +// pluginNotifications.entries.length = 50 // limit array length to 50 entries +// } +// pluginNotifications.lastUpdated = now +// notificationPill.style.display = "block" +// // save the notifications +// await setStorageData('notifications', JSON.stringify(pluginNotifications)) +// } + +// function timeAgo(inputDate) { +// const now = new Date(); +// const date = new Date(inputDate); +// const diffInSeconds = Math.floor((now - date) / 1000); +// const units = [ +// { name: 'year', seconds: 31536000 }, +// { name: 'month', seconds: 2592000 }, +// { name: 'week', seconds: 604800 }, +// { name: 'day', seconds: 86400 }, +// { name: 'hour', seconds: 3600 }, +// { name: 'minute', seconds: 60 }, +// { name: 'second', seconds: 1 } +// ]; + +// for (const unit of units) { +// const unitValue = Math.floor(diffInSeconds / unit.seconds); +// if (unitValue > 0) { +// return `${unitValue} ${unit.name}${unitValue > 1 ? 's' : ''} ago`; +// } +// } + +// return 'just now'; +// } + +// function convertSeconds(seconds) { +// const hours = Math.floor(seconds / 3600); +// const minutes = Math.floor((seconds % 3600) / 60); +// const remainingSeconds = seconds % 60; + +// let timeParts = []; +// if (hours === 1) { +// timeParts.push(`${hours} hour`); +// } else if (hours > 1) { +// timeParts.push(`${hours} hours`); +// } +// if (minutes === 1) { +// timeParts.push(`${minutes} minute`); +// } else if (minutes > 1) { +// timeParts.push(`${minutes} minutes`); +// } +// if (remainingSeconds === 1) { +// timeParts.push(`${remainingSeconds} second`); +// } else if (remainingSeconds > 1) { +// timeParts.push(`${remainingSeconds} seconds`); +// } + +// return timeParts.join(', and '); +// } + +// function renderPluginNotifications() { +// pluginNotificationTable.innerHTML = '' + +// if (pluginNotifications.entries?.length > 0) { +// pluginNoNotification.style.display = "none" +// pluginNotificationTable.style.display = "block" +// } +// else { +// pluginNoNotification.style.display = "block" +// pluginNotificationTable.style.display = "none" +// } +// for (let i = 0; i < pluginNotifications.entries?.length; i++) { +// const date = pluginNotifications.entries[i].date +// const text = pluginNotifications.entries[i].text +// const error = pluginNotifications.entries[i].error +// const newRow = document.createElement('div') + +// newRow.innerHTML = ` +// ${text} +//
      ${timeAgo(date)}
      +// `; +// pluginNotificationTable.appendChild(newRow) +// } +// } + +// /* search box */ +// function filterPlugins() { +// let search = pluginFilter.value.toLowerCase(); +// let searchTerms = search.split(' '); +// let labels = pluginsTable.querySelectorAll("label.plugin-name"); + +// for (let i = 0; i < labels.length; i++) { +// let label = labels[i].innerText.toLowerCase(); +// let match = true; + +// for (let j = 0; j < searchTerms.length; j++) { +// let term = searchTerms[j].trim(); +// if (term && label.indexOf(term) === -1) { +// match = false; +// break; +// } +// } + +// if (match) { +// labels[i].closest('.plugin-container').style.display = "flex"; +// } else { +// labels[i].closest('.plugin-container').style.display = "none"; +// } +// } +// } + +// // Call debounce function on filterImageModifierList function with 200ms wait time. Thanks JeLuf! +// const debouncedFilterPlugins = debounce(filterPlugins, 200); + +// // add the searchbox +// pluginsTable.insertAdjacentHTML('beforebegin', ``) +// const pluginFilter = document.getElementById("plugin-filter") // search box + +// // Add the debounced function to the keyup event listener +// pluginFilter.addEventListener('keyup', debouncedFilterPlugins); + +// // select the text on focus +// pluginFilter.addEventListener('focus', function (event) { +// pluginFilter.select() +// }); + +// // empty the searchbox on escape +// pluginFilter.addEventListener('keydown', function (event) { +// if (event.key === 'Escape') { +// pluginFilter.value = ''; +// filterPlugins(); +// } +// }); + +// // focus on the search box upon tab selection +// document.addEventListener("tabClick", (e) => { +// if (e.detail.name == 'plugin') { +// pluginFilter.focus() +// } +// }) + +// // refresh link +// pluginsTable.insertAdjacentHTML('afterend', `

      Refresh plugins

      +//

      (Plugin developers, add your plugins to plugins.json)

      `) +// const refreshPlugins = document.getElementById("refresh-plugins") +// refreshPlugins.addEventListener("click", async function (event) { +// event.preventDefault() +// await initPlugins(true) +// }) + +// function showPluginToast(message, duration = 5000, error = false, addNotification = true) { +// if (addNotification === true) { +// addPluginNotification(pluginNotifications, message, error) +// } +// try { +// showToast(message, duration, error) +// } catch (error) { +// console.error('Error while trying to show toast:', error); +// } +// } + +// function matchPluginFileNames(fileName1, fileName2) { +// const regex = /^(.+?)(?:-\d+(\.\d+)*)?\.plugin\.js$/; +// const match1 = fileName1.match(regex); +// const match2 = fileName2.match(regex); + +// if (match1 && match2 && match1[1] === match2[1]) { +// return true; // the two file names match +// } else { +// return false; // the two file names do not match +// } +// } + +// function extractFilename(filepath) { +// // Normalize the path separators to forward slashes and make the file names lowercase +// const normalizedFilePath = filepath.replace(/\\/g, "/").toLowerCase(); + +// // Strip off the path from the file name +// const fileName = normalizedFilePath.substring(normalizedFilePath.lastIndexOf("/") + 1); + +// return fileName +// } + +// function checkFileNameInArray(paths, filePath) { +// // Strip off the path from the file name +// const fileName = extractFilename(filePath); + +// // Check if the file name exists in the array of paths +// return paths.some(path => { +// // Strip off the path from the file name +// const baseName = extractFilename(path); + +// // Check if the file names match and return the result as a boolean +// return matchPluginFileNames(fileName, baseName); +// }); +// } + +// function isGitHub(url) { +// return url.startsWith("https://raw.githubusercontent.com/") === true +// } + +// /* fill in the plugins table */ +// function getIncompatiblePlugins(pluginId) { +// const enabledPlugins = plugins.filter(plugin => plugin.enabled && plugin.id !== pluginId); +// const incompatiblePlugins = enabledPlugins.filter(plugin => plugin.compatIssueIds?.includes(pluginId)); +// const pluginNames = incompatiblePlugins.map(plugin => plugin.name); +// if (pluginNames.length === 0) { +// return null; +// } +// const pluginNamesList = pluginNames.map(name => `
    • ${name}
      • `).join(''); +// return `
        ${pluginNamesList}
      `; +// } + +// async function initPluginTable(plugins) { +// pluginsTable.innerHTML = '' +// plugins.sort((a, b) => a.name.localeCompare(b.name, undefined, { sensitivity: 'base' })) +// plugins.forEach(plugin => { +// const name = plugin.name +// const author = plugin.author ? ', by ' + plugin.author : '' +// const version = plugin.version ? ' (version: ' + plugin.version + ')' : '' +// const warning = getIncompatiblePlugins(plugin.id) ? `This plugin might conflict with:${getIncompatiblePlugins(plugin.id)}` : '' +// const note = plugin.description ? `${plugin.description.replaceAll('\n', '
      ')}      ` : `No description`; +// const icon = plugin.icon ? `` : ''; +// const newRow = document.createElement('div') +// const localPluginFound = checkFileNameInArray(localPlugins, plugin.url) + +// newRow.innerHTML = ` +//
      ${icon}
      +//
      ${warning}${note}Source: ${extractFilename(plugin.url)}
      +//
      +// ${localPluginFound ? "Installed locally" : +// (plugin.localInstallOnly ? 'Download and
      install manually      ' : +// (isGitHub(plugin.url) ? +// '' : +// '' +// ) +// ) +// } +//
      `; +// newRow.classList.add('plugin-container') +// //console.log(plugin.id, plugin.localInstallOnly) +// pluginsTable.appendChild(newRow) +// const pluginManualInstall = pluginsTable.querySelector('#plugin-' + plugin.id + '-install') +// updateManualInstallButtonCaption() + +// // checkbox event handler +// const pluginToggle = pluginsTable.querySelector('#plugin-' + plugin.id) +// if (pluginToggle !== null) { +// pluginToggle.checked = plugin.enabled // set initial state of checkbox +// pluginToggle.addEventListener('change', async () => { +// const container = pluginToggle.closest(".plugin-container"); +// const warningElement = container.querySelector(".plugin-warning"); + +// // if the plugin got enabled, download the plugin's code +// plugin.enabled = pluginToggle.checked +// if (plugin.enabled) { +// const pluginSource = await getDocument(plugin.url); +// if (pluginSource !== null) { +// // Store the current scroll position before navigating away +// const currentPosition = window.pageYOffset; +// initPluginTable(plugins) +// // When returning to the page, set the scroll position to the stored value +// window.scrollTo(0, currentPosition); +// warningElement?.classList.remove("hide"); +// plugin.code = pluginSource +// loadPlugins([plugin]) +// console.log(`Plugin ${plugin.name} installed`); +// showPluginToast("Plugin " + plugin.name + " installed"); +// } +// else { +// plugin.enabled = false +// pluginToggle.checked = false +// console.error(`Couldn't download plugin ${plugin.name}`); +// showPluginToast("Failed to install " + plugin.name + " (Couldn't fetch " + extractFilename(plugin.url) + ")", 5000, true); +// } +// } else { +// warningElement?.classList.add("hide"); +// // Store the current scroll position before navigating away +// const currentPosition = window.pageYOffset; +// initPluginTable(plugins) +// // When returning to the page, set the scroll position to the stored value +// window.scrollTo(0, currentPosition); +// console.log(`Plugin ${plugin.name} uninstalled`); +// showPluginToast("Plugin " + plugin.name + " uninstalled"); +// } +// await setStorageData('plugins', JSON.stringify(plugins)) +// }) +// } + +// // manual install event handler +// if (pluginManualInstall !== null) { +// pluginManualInstall.addEventListener('click', async () => { +// pluginDialogOpenDialog(inputOK, inputCancel) +// pluginDialogTextarea.value = plugin.code ? plugin.code : '' +// pluginDialogTextarea.select() +// pluginDialogTextarea.focus() +// }) +// } +// // Dialog OK +// async function inputOK() { +// let pluginSource = pluginDialogTextarea.value +// // remove empty lines and trim existing lines +// plugin.code = pluginSource +// if (pluginSource.trim() !== '') { +// plugin.enabled = true +// console.log(`Plugin ${plugin.name} installed`); +// showPluginToast("Plugin " + plugin.name + " installed"); +// } +// else { +// plugin.enabled = false +// console.log(`No code provided for plugin ${plugin.name}, disabling the plugin`); +// showPluginToast("No code provided for plugin " + plugin.name + ", disabling the plugin"); +// } +// updateManualInstallButtonCaption() +// await setStorageData('plugins', JSON.stringify(plugins)) +// } +// // Dialog Cancel +// async function inputCancel() { +// plugin.enabled = false +// console.log(`Installation of plugin ${plugin.name} cancelled`); +// showPluginToast("Cancelled installation of " + plugin.name); +// } +// // update button caption +// function updateManualInstallButtonCaption() { +// if (pluginManualInstall !== null) { +// pluginManualInstall.innerHTML = plugin.code === undefined || plugin.code.trim() === '' ? 'Install' : 'Edit' +// } +// } +// }) +// prettifyInputs(pluginsTable) +// filterPlugins() +// } + +// /* version management. Thanks Madrang! */ +// const parseVersion = function (versionString, options = {}) { +// if (typeof versionString === "undefined") { +// throw new Error("versionString is undefined."); +// } +// if (typeof versionString !== "string") { +// throw new Error("versionString is not a string."); +// } +// const lexicographical = options && options.lexicographical; +// const zeroExtend = options && options.zeroExtend; +// let versionParts = versionString.split('.'); +// function isValidPart(x) { +// const re = (lexicographical ? /^\d+[A-Za-z]*$/ : /^\d+$/); +// return re.test(x); +// } + +// if (!versionParts.every(isValidPart)) { +// throw new Error("Version string is invalid."); +// } + +// if (zeroExtend) { +// while (versionParts.length < 4) { +// versionParts.push("0"); +// } +// } +// if (!lexicographical) { +// versionParts = versionParts.map(Number); +// } +// return versionParts; +// }; + +// const versionCompare = function (v1, v2, options = {}) { +// if (typeof v1 == "undefined") { +// throw new Error("vi is undefined."); +// } +// if (typeof v2 === "undefined") { +// throw new Error("v2 is undefined."); +// } + +// let v1parts; +// if (typeof v1 === "string") { +// v1parts = parseVersion(v1, options); +// } else if (Array.isArray(v1)) { +// v1parts = [...v1]; +// if (!v1parts.every(p => typeof p === "number" && p !== NaN)) { +// throw new Error("v1 part array does not only contains numbers."); +// } +// } else { +// throw new Error("v1 is of an unexpected type: " + typeof v1); +// } + +// let v2parts; +// if (typeof v2 === "string") { +// v2parts = parseVersion(v2, options); +// } else if (Array.isArray(v2)) { +// v2parts = [...v2]; +// if (!v2parts.every(p => typeof p === "number" && p !== NaN)) { +// throw new Error("v2 part array does not only contains numbers."); +// } +// } else { +// throw new Error("v2 is of an unexpected type: " + typeof v2); +// } + +// while (v1parts.length < v2parts.length) { +// v1parts.push("0"); +// } +// while (v2parts.length < v1parts.length) { +// v2parts.push("0"); +// } + +// for (let i = 0; i < v1parts.length; ++i) { +// if (v2parts.length == i) { +// return 1; +// } +// if (v1parts[i] == v2parts[i]) { +// continue; +// } else if (v1parts[i] > v2parts[i]) { +// return 1; +// } else { +// return -1; +// } +// } +// return 0; +// }; + +// function filterPluginsByMinEDVersion(plugins, EDVersion) { +// const filteredPlugins = plugins.filter(plugin => { +// if (plugin.minEDVersion) { +// return versionCompare(plugin.minEDVersion, EDVersion) <= 0; +// } +// return true; +// }); + +// return filteredPlugins; +// } + +// function extractVersionNumber(elem) { +// const versionStr = elem.innerHTML; +// const regex = /v(\d+\.\d+\.\d+)/; +// const matches = regex.exec(versionStr); +// if (matches && matches.length > 1) { +// return matches[1]; +// } else { +// return null; +// } +// } +// const EasyDiffusionVersion = extractVersionNumber(document.querySelector('#top-nav > #logo')) + +// /* PLUGIN MANAGEMENT */ +// let plugins +// let localPlugins +// let initPluginsInProgress = false + +// async function initPlugins(refreshPlugins = false) { +// let pluginsLoaded +// if (initPluginsInProgress === true) { +// return +// } +// initPluginsInProgress = true + +// const res = await fetch('/get/ui_plugins') +// if (!res.ok) { +// console.error(`Error HTTP${res.status} while loading plugins list. - ${res.statusText}`) +// } +// else { +// localPlugins = await res.json() +// } + +// if (refreshPlugins === false) { +// // load the notifications +// pluginNotifications = await getStorageData('notifications') +// if (typeof pluginNotifications === "string") { +// try { +// pluginNotifications = JSON.parse(pluginNotifications) +// } catch (e) { +// console.error("Failed to parse pluginNotifications", e); +// pluginNotifications = {}; +// pluginNotifications.entries = []; +// } +// } +// if (pluginNotifications !== undefined) { +// if (pluginNotifications.entries && pluginNotifications.entries.length > 0 && pluginNotifications.entries[0].date && pluginNotifications.lastUpdated <= pluginNotifications.entries[0].date) { +// notificationPill.style.display = "block"; +// } +// } else { +// pluginNotifications = {}; +// pluginNotifications.entries = []; +// } + +// // try and load plugins from local cache +// plugins = await getStorageData('plugins') +// if (plugins !== undefined) { +// plugins = JSON.parse(plugins) + +// // remove duplicate entries if any (should not happen) +// plugins = deduplicatePluginsById(plugins) + +// // remove plugins that don't meet the min ED version requirement +// plugins = filterPluginsByMinEDVersion(plugins, EasyDiffusionVersion) + +// // remove from plugins the entries that don't have mandatory fields (id, name, url) +// plugins = plugins.filter((plugin) => { return plugin.id !== '' && plugin.name !== '' && plugin.url !== ''; }); + +// // populate the table +// initPluginTable(plugins) +// await loadPlugins(plugins) +// pluginsLoaded = true +// } +// else { +// plugins = [] +// pluginsLoaded = false +// } +// } + +// // update plugins asynchronously (updated versions will be available next time the UI is loaded) +// if (refreshAllowed()) { +// let pluginCatalog = await getDocument(PLUGIN_CATALOG) +// if (pluginCatalog !== null) { +// let parseError = false; +// try { +// pluginCatalog = JSON.parse(pluginCatalog); +// console.log('Plugin catalog successfully downloaded'); +// } catch (error) { +// console.error('Error parsing plugin catalog:', error); +// parseError = true; +// } + +// if (!parseError) { +// await downloadPlugins(pluginCatalog, plugins, refreshPlugins) + +// // update compatIssueIds +// updateCompatIssueIds() + +// // remove plugins that don't meet the min ED version requirement +// plugins = filterPluginsByMinEDVersion(plugins, EasyDiffusionVersion) + +// // remove from plugins the entries that don't have mandatory fields (id, name, url) +// plugins = plugins.filter((plugin) => { return plugin.id !== '' && plugin.name !== '' && plugin.url !== ''; }); + +// // remove from plugins the entries that no longer exist in the catalog +// plugins = plugins.filter((plugin) => { return pluginCatalog.some((p) => p.id === plugin.id) }); + +// if (pluginCatalog.length > plugins.length) { +// const newPlugins = pluginCatalog.filter((plugin) => { +// return !plugins.some((p) => p.id === plugin.id); +// }); + +// newPlugins.forEach((plugin, index) => { +// setTimeout(() => { +// showPluginToast(`New plugin "${plugin.name}" is available.`); +// }, (index + 1) * 1000); +// }); +// } + +// let pluginsJson; +// try { +// pluginsJson = JSON.stringify(plugins); // attempt to parse plugins to JSON +// } catch (error) { +// console.error('Error converting plugins to JSON:', error); +// } + +// if (pluginsJson) { // only store the data if pluginsJson is not null or undefined +// await setStorageData('plugins', pluginsJson) +// } + +// // refresh the display of the plugins table +// initPluginTable(plugins) +// if (pluginsLoaded && pluginsLoaded === false) { +// loadPlugins(plugins) +// } +// } +// } +// } +// else { +// if (refreshPlugins) { +// showPluginToast('Plugins have been refreshed recently, refresh will be available in ' + convertSeconds(getTimeUntilNextRefresh()), 5000, true, false) +// } +// } +// initPluginsInProgress = false +// } + +// function updateMetaTagPlugins(plugin) { +// // Update the meta tag with the list of loaded plugins +// let metaTag = document.querySelector('meta[name="plugins"]'); +// if (metaTag === null) { +// metaTag = document.createElement('meta'); +// metaTag.name = 'plugins'; +// document.head.appendChild(metaTag); +// } +// const pluginArray = [...(metaTag.content ? metaTag.content.split(',') : []), plugin.id]; +// metaTag.content = pluginArray.join(','); +// } + +// function updateCompatIssueIds() { +// // Loop through each plugin +// plugins.forEach(plugin => { +// // Check if the plugin has `compatIssueIds` property +// if (plugin.compatIssueIds !== undefined) { +// // Loop through each of the `compatIssueIds` +// plugin.compatIssueIds.forEach(issueId => { +// // Find the plugin with the corresponding `issueId` +// const issuePlugin = plugins.find(p => p.id === issueId); +// // If the corresponding plugin is found, initialize its `compatIssueIds` property with an empty array if it's undefined +// if (issuePlugin) { +// if (issuePlugin.compatIssueIds === undefined) { +// issuePlugin.compatIssueIds = []; +// } +// // If the current plugin's ID is not already in the `compatIssueIds` array, add it +// if (!issuePlugin.compatIssueIds.includes(plugin.id)) { +// issuePlugin.compatIssueIds.push(plugin.id); +// } +// } +// }); +// } else { +// // If the plugin doesn't have `compatIssueIds` property, initialize it with an empty array +// plugin.compatIssueIds = []; +// } +// }); +// } + +// function deduplicatePluginsById(plugins) { +// const seenIds = new Set(); +// const deduplicatedPlugins = []; + +// for (const plugin of plugins) { +// if (!seenIds.has(plugin.id)) { +// seenIds.add(plugin.id); +// deduplicatedPlugins.push(plugin); +// } else { +// // favor dupes that have enabled == true +// const index = deduplicatedPlugins.findIndex(p => p.id === plugin.id); +// if (index >= 0) { +// if (plugin.enabled) { +// deduplicatedPlugins[index] = plugin; +// } +// } +// } +// } + +// return deduplicatedPlugins; +// } + +// async function loadPlugins(plugins) { +// for (let i = 0; i < plugins.length; i++) { +// const plugin = plugins[i]; +// if (plugin.enabled === true && plugin.localInstallOnly !== true) { +// const localPluginFound = checkFileNameInArray(localPlugins, plugin.url); +// if (!localPluginFound) { +// try { +// // Indirect eval to work around sloppy plugin implementations +// const indirectEval = { eval }; +// console.log("Loading plugin " + plugin.name); +// indirectEval.eval(plugin.code); +// console.log("Plugin " + plugin.name + " loaded"); +// await updateMetaTagPlugins(plugin); // add plugin to the meta tag +// } catch (err) { +// showPluginToast("Error loading plugin " + plugin.name + " (" + err.message + ")", null, true); +// console.error("Error loading plugin " + plugin.name + ": " + err.message); +// } +// } else { +// console.log("Skipping plugin " + plugin.name + " (installed locally)"); +// } +// } +// } +// } + +// async function getFileHash(url) { +// const regex = /^https:\/\/raw\.githubusercontent\.com\/(?[^/]+)\/(?[^/]+)\/(?[^/]+)\/(?.+)$/; +// const match = url.match(regex); +// if (!match) { +// console.error('Invalid GitHub repository URL.'); +// return Promise.resolve(null); +// } +// const owner = match.groups.owner; +// const repo = match.groups.repo; +// const branch = match.groups.branch; +// const filePath = match.groups.filePath; +// const apiUrl = `https://api.github.com/repos/${owner}/${repo}/contents/${filePath}?ref=${branch}`; + +// try { +// const response = await fetch(apiUrl); +// if (!response.ok) { +// throw new Error(`HTTP error! status: ${response.status}, url: ${apiUrl}`); +// } +// const data = await response.json(); +// return data.sha; +// } catch (error) { +// console.error('Error fetching data from url:', apiUrl, 'Error:', error); +// return null; +// } +// } + +// // only allow two refresh per hour +// function getTimeUntilNextRefresh() { +// const lastRuns = JSON.parse(localStorage.getItem('lastRuns') || '[]'); +// const currentTime = new Date().getTime(); +// const numRunsLast60Min = lastRuns.filter(run => currentTime - run <= 60 * 60 * 1000).length; + +// if (numRunsLast60Min >= 2) { +// return 3600 - Math.round((currentTime - lastRuns[lastRuns.length - 1]) / 1000); +// } + +// return 0; +// } + +// function refreshAllowed() { +// const timeUntilNextRefresh = getTimeUntilNextRefresh(); + +// if (timeUntilNextRefresh > 0) { +// console.log(`Next refresh available in ${timeUntilNextRefresh} seconds`); +// return false; +// } + +// const lastRuns = JSON.parse(localStorage.getItem('lastRuns') || '[]'); +// const currentTime = new Date().getTime(); +// lastRuns.push(currentTime); +// localStorage.setItem('lastRuns', JSON.stringify(lastRuns)); +// return true; +// } + +// async function downloadPlugins(pluginCatalog, plugins, refreshPlugins) { +// // download the plugins as needed +// for (const plugin of pluginCatalog) { +// //console.log(plugin.id, plugin.url) +// const existingPlugin = plugins.find(p => p.id === plugin.id); +// // get the file hash in the GitHub repo +// let sha +// if (isGitHub(plugin.url) && existingPlugin?.enabled === true) { +// sha = await getFileHash(plugin.url) +// } +// if (plugin.localInstallOnly !== true && isGitHub(plugin.url) && existingPlugin?.enabled === true && (refreshPlugins || (existingPlugin.sha !== undefined && existingPlugin.sha !== null && existingPlugin.sha !== sha) || existingPlugin?.code === undefined)) { +// const pluginSource = await getDocument(plugin.url); +// if (pluginSource !== null && pluginSource !== existingPlugin.code) { +// console.log(`Plugin ${plugin.name} updated`); +// showPluginToast("Plugin " + plugin.name + " updated", 5000); +// // Update the corresponding plugin +// const updatedPlugin = { +// ...existingPlugin, +// icon: plugin.icon ? plugin.icon : "fa-puzzle-piece", +// id: plugin.id, +// name: plugin.name, +// description: plugin.description, +// url: plugin.url, +// localInstallOnly: Boolean(plugin.localInstallOnly), +// version: plugin.version, +// code: pluginSource, +// author: plugin.author, +// sha: sha, +// compatIssueIds: plugin.compatIssueIds +// }; +// // Replace the old plugin in the plugins array +// const pluginIndex = plugins.indexOf(existingPlugin); +// if (pluginIndex >= 0) { +// plugins.splice(pluginIndex, 1, updatedPlugin); +// } else { +// plugins.push(updatedPlugin); +// } +// } +// } +// else if (existingPlugin !== undefined) { +// // Update the corresponding plugin's metadata +// const updatedPlugin = { +// ...existingPlugin, +// icon: plugin.icon ? plugin.icon : "fa-puzzle-piece", +// id: plugin.id, +// name: plugin.name, +// description: plugin.description, +// url: plugin.url, +// localInstallOnly: Boolean(plugin.localInstallOnly), +// version: plugin.version, +// author: plugin.author, +// compatIssueIds: plugin.compatIssueIds +// }; +// // Replace the old plugin in the plugins array +// const pluginIndex = plugins.indexOf(existingPlugin); +// plugins.splice(pluginIndex, 1, updatedPlugin); +// } +// else { +// plugins.push(plugin); +// } +// } +// } + +// async function getDocument(url) { +// try { +// let response = await fetch(url === PLUGIN_CATALOG ? PLUGIN_CATALOG : url, { cache: "no-cache" }); +// if (!response.ok) { +// throw new Error(`Response error: ${response.status} ${response.statusText}`); +// } +// let document = await response.text(); +// return document; +// } catch (error) { +// showPluginToast("Couldn't fetch " + extractFilename(url) + " (" + error + ")", null, true); +// console.error(error); +// return null; +// } +// } + +// /* MODAL DIALOG */ +// const pluginDialogDialog = document.createElement("div"); +// pluginDialogDialog.id = "pluginDialog-input-dialog"; +// pluginDialogDialog.style.display = "none"; + +// pluginDialogDialog.innerHTML = ` +//
      +//
      +//
      +//

      Paste the plugin's code here

      +// +//
      +//
      +// +//
      +//
      +// +// +//
      +//
      +// `; + +// document.body.appendChild(pluginDialogDialog); + +// const pluginDialogOverlay = document.querySelector(".pluginDialog-dialog-overlay"); +// const pluginDialogOkButton = document.getElementById("pluginDialog-input-ok"); +// const pluginDialogCancelButton = document.getElementById("pluginDialog-input-cancel"); +// const pluginDialogCloseButton = document.querySelector(".pluginDialog-dialog-close-button"); +// const pluginDialogTextarea = document.getElementById("pluginDialog-input-textarea"); +// let callbackOK +// let callbackCancel + +// function pluginDialogOpenDialog(inputOK, inputCancel) { +// pluginDialogDialog.style.display = "block"; +// callbackOK = inputOK +// callbackCancel = inputCancel +// } + +// function pluginDialogCloseDialog() { +// pluginDialogDialog.style.display = "none"; +// } + +// function pluginDialogHandleOkClick() { +// const userInput = pluginDialogTextarea.value; +// // Do something with the user input +// callbackOK() +// pluginDialogCloseDialog(); +// } + +// function pluginDialogHandleCancelClick() { +// callbackCancel() +// pluginDialogCloseDialog(); +// } + +// function pluginDialogHandleOverlayClick(event) { +// if (event.target === pluginDialogOverlay) { +// pluginDialogCloseDialog(); +// } +// } + +// function pluginDialogHandleKeyDown(event) { +// if ((event.key === "Enter" && event.ctrlKey) || event.key === "Escape") { +// event.preventDefault(); +// if (event.key === "Enter" && event.ctrlKey) { +// pluginDialogHandleOkClick(); +// } else { +// pluginDialogCloseDialog(); +// } +// } +// } + +// pluginDialogTextarea.addEventListener("keydown", pluginDialogHandleKeyDown); +// pluginDialogOkButton.addEventListener("click", pluginDialogHandleOkClick); +// pluginDialogCancelButton.addEventListener("click", pluginDialogHandleCancelClick); +// pluginDialogCloseButton.addEventListener("click", pluginDialogCloseDialog); +// pluginDialogOverlay.addEventListener("click", pluginDialogHandleOverlayClick); From ae930f399372d53029eeb25cdcce864874ec25aa Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 20:23:27 +0530 Subject: [PATCH 028/200] note about modifiers placement --- ui/index.html | 2 ++ 1 file changed, 2 insertions(+) diff --git a/ui/index.html b/ui/index.html index 2cfbdcc8..affa8dbc 100644 --- a/ui/index.html +++ b/ui/index.html @@ -324,6 +324,8 @@
    + +
    From 800f275e914056f577d99e032251f47174661df9 Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 20:30:57 +0530 Subject: [PATCH 029/200] Fix for plugin: make-image-button-always-visible.plugin.js --- ui/media/css/main.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/media/css/main.css b/ui/media/css/main.css index 771169b3..a84dbf81 100644 --- a/ui/media/css/main.css +++ b/ui/media/css/main.css @@ -300,7 +300,7 @@ button#resume { display: none; background: var(--background-color1); border: solid 1px var(--background-color3); - z-index: 999; + z-index: 1999; border-radius: 6px; box-shadow: 0px 0px 30px black; border: 2px solid rgb(255 255 255 / 10%); From 3a7281df3c554ab93917a4077630623c45dea685 Mon Sep 17 00:00:00 2001 From: cmdr2 Date: Mon, 26 Jun 2023 20:36:59 +0530 Subject: [PATCH 030/200] Fix for prompt number calculation with empty or single-element set --- ui/media/js/main.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/media/js/main.js b/ui/media/js/main.js index fda0493c..20299b10 100644 --- a/ui/media/js/main.js +++ b/ui/media/js/main.js @@ -1347,7 +1347,7 @@ function getPromptsNumber(prompts) { // estimate number of prompts let estimatedNumberOfPrompts = 0 prompts.forEach((prompt) => { - estimatedNumberOfPrompts += (prompt.match(/{[^}]*}/g) || []).map((e) => e.match(/,/g).length + 1).reduce( (p,a) => p*a, 1) * (2**(prompt.match(/\|/g) || []).length) + estimatedNumberOfPrompts += (prompt.match(/{[^}]*}/g) || []).map((e) => (e.match(/,/g) || []).length + 1).reduce( (p,a) => p*a, 1) * (2**(prompt.match(/\|/g) || []).length) }) if (estimatedNumberOfPrompts >= 10000) { From 4bbb4b5e1e703ceea6d2ba8cebdbd8301a831cd2 Mon Sep 17 00:00:00 2001 From: JeLuF Date: Tue, 27 Jun 2023 00:00:27 +0200 Subject: [PATCH 031/200] Modifier settings dialog improvements - Use for the Modifier settings (solves z-order issues) - Harmonize dialog design. Use similar header style for modifier settings and tiled image download dialogs --- ui/index.html | 47 ++++++++++++-------- ui/media/css/main.css | 24 ++++++++-- ui/media/css/modifier-thumbnails.css | 4 +- ui/media/js/image-modifiers.js | 31 +++++++++---- ui/plugins/ui/tiled-image-download.plugin.js | 23 +++++----- 5 files changed, 85 insertions(+), 44 deletions(-) diff --git a/ui/index.html b/ui/index.html index affa8dbc..b53909f0 100644 --- a/ui/index.html +++ b/ui/index.html @@ -72,8 +72,8 @@
    -
    -
    +
    +

    Image Modifiers

    (drawing style, camera, etc.)
    @@ -525,25 +525,34 @@
    -