Merge pull request #1341 from SillyTavern/staging

Staging

.github/ISSUE_TEMPLATE/bug-report.yml

@@ -0,0 +1,90 @@
+name: Bug Report 🐛
+description: Report something that's not working the intended way. Support requests for external programs (reverse proxies, 3rd party servers, other peoples' forks) will be refused!
+title: '[BUG] <title>'
+labels: ['bug']
+body:
+  - type: dropdown
+    id: environment
+    attributes:
+      label: Environment
+      description: Where are you running SillyTavern?
+      options:
+        - Self-Hosted (Bare Metal)      
+        - Self-Hosted (Docker)
+        - Android (Termux)
+        - Cloud Service (Static)
+        - Other (Specify below)
+    validations:
+      required: true
+
+  - type: input
+    id: system
+    attributes:
+      label: System
+      description: >-
+        For deployment issues, specify your [distro or OS](https://whatsmyos.com/) and/ or Docker version.
+        For client-side issues, include your [browser version](https://www.whatsmybrowser.org/)
+      placeholder: e.g. Firefox 101, Manjaro Linux 21.3.0, Docker 20.10.16
+    validations:
+      required: true
+
+  - type: input
+    id: version
+    attributes:
+      label: Version
+      description: What version of SillyTavern are you running?
+      placeholder: (check User Settings to see the version)
+    validations:
+      required: true
+
+  - type: textarea
+    id: desktop
+    attributes:
+      label: Desktop Information
+      description: Please provide details about your desktop environment.
+      placeholder: |
+        - Node.js version (if applicable): [run `node --version` in cmd]
+        - Generation API [e.g. KoboldAI, OpenAI]
+        - Branch [staging, release]
+        - Model [e.g. Pygmalion 6b, LLaMa 13b]
+    validations:
+      required: false
+
+  - type: textarea
+    id: repro
+    attributes:
+      label: Describe the problem
+      description: Please describe exactly what is not working, include the steps to reproduce, actual result and expected result
+      placeholder: When doing ABC then DEF, I expect to see XYZ, but I actually see ZYX
+    validations:
+      required: true
+
+  - type: textarea
+    id: logs
+    attributes:
+      label: Additional info
+      description: Logs? Screenshots? Yes, please.
+      placeholder: If the issue happens during build-time, include terminal logs. For run-time errors, include browser logs which you can view in the Dev Tools (F12), under the Console tab. Take care to blank out any personal info.
+    validations:
+      required: false
+
+  - type: checkboxes
+    id: idiot-check
+    attributes:
+      label: Please tick the boxes
+      description: Before submitting, please ensure that
+      options:
+        - label: You have explained the issue clearly, and included all relevant info
+          required: true
+        - label: You've checked that this [issue hasn't already been raised](https://github.com/SillyTavern/SillyTavern/issues?q=is%3Aissue)
+          required: true
+        - label: You've checked the [docs](https://docs.sillytavern.app/) ![important](https://img.shields.io/badge/Important!-F6094E)
+          required: true
+
+  - type: markdown
+    attributes:
+      value: |-
+        ## Thanks 🙏
+        Thank you for raising this ticket - in doing so you are helping to make SillyTavern better for everyone.
+    validations:
+      required: false

.github/ISSUE_TEMPLATE/bug_report.md

@@ -1,45 +0,0 @@
----
-name: Bug report
-about: "Create a report to help us improve. PAY ATTENTION: Support requests for external programs (reverse proxies, 3rd party servers, other peoples' forks) will be refused!"
-title: "[BUG]"
-labels: ''
-assignees: ''
-
----
-
-> **Warning**. Complete **all** the fields below. Otherwise, your bug report will be **ignored**!
-
-**Have you searched for similar [bugs](https://github.com/SillyTavern/SillyTavern/issues?q=)?**
-Yes/No
-
-**Describe the bug**
-A clear and concise description of what the bug is.
-
-**To Reproduce**
-Steps to reproduce the behavior:
-1. Go to '...'
-2. Click on '....'
-3. Scroll down to '....'
-4. See error
-
-**Expected behavior**
-A clear and concise description of what you expected to happen.
-
-**Screenshots**
-If applicable, add screenshots to help explain your problem.
-
-**Logs**
-
-Providing the logs from the browser DevTools console (opened by pressing the F12 key) or SillyTavern command line window will be highly appreciated.
-
-**Desktop (please complete the following information):**
- - OS/Device: [e.g. Windows 11]
- - Environment: [cloud, local]
- - Node.js version (if applicable): [run `node --version` in cmd]
- - Browser [e.g. chrome, safari]
- - Generation API [e.g. KoboldAI, OpenAI]
- - Branch [staging, release]
- - Model [e.g. Pygmalion 6b, LLaMa 13b]
-
-**Additional context**
-Add any other context about the problem here.

.github/ISSUE_TEMPLATE/feature-request.yml

@@ -0,0 +1,91 @@
+name: Feature Request ✨
+description: Suggest an idea for future development of this project
+title: '[FEATURE_REQUEST] <title>'
+labels: ['enhancement']
+
+body:
+
+  # Field 1 - Did the user searched for similar requests
+  - type: dropdown
+    id: similarRequest
+    attributes:
+      label: Have you searched for similar requests?
+      description:
+      options:
+        - 'No'
+        - 'Yes'
+    validations:
+      required: false
+
+  # Field 2 - Is it bug-related
+  - type: textarea
+    id: issue
+    attributes:
+      label: Is your feature request related to a problem? If so, please describe.
+      description:
+      placeholder: A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
+    validations:
+      required: false
+
+  # Field 3 - Describe feature
+  - type: textarea
+    id: solution
+    attributes:
+      label: Describe the solution you'd like
+      placeholder: An outline of how you would like this to be implemented, include as much details as possible 
+    validations:
+      required: true
+
+  # Field 4 - Describe alternatives
+  - type: textarea
+    id: alternatives
+    attributes:
+      label: Describe alternatives you've considered
+      placeholder: A clear and concise description of any alternative solutions or features you've considered.
+    validations:
+      required: false
+
+  # Field 5 - Additional context
+  - type: textarea
+    id: addcontext
+    attributes:
+      label: Additional context
+      placeholder: Add any other context or screenshots about the feature request here.
+    validations:
+      required: false
+
+  # Field 6 - Priority
+  - type: dropdown
+    id: priority
+    attributes:
+      label: Priority
+      description: How urgent is the development of this feature
+      options:
+        - Low (Nice-to-have)
+        - Medium (Would be very useful)
+        - High (The app does not function without it)
+    validations:
+      required: true
+
+  # Field 7 - Can the user implement
+  - type: dropdown
+    id: canImplement
+    attributes:
+      label: Is this something you would be keen to implement?
+      description: Are you raising this ticket in order to get an issue number for your PR?
+      options:
+        - 'No'
+        - 'Maybe'
+        - 'Yes!'
+    validations:
+      required: false
+
+  # Final text
+  - type: markdown
+    attributes:
+      value: |-
+        ## Thanks 🙏
+        Thank you for your feature suggestion.
+        Please note that there is no guarantee that your idea will be implemented.
+    validations:
+      required: false

.github/ISSUE_TEMPLATE/feature_request.md

@@ -1,23 +0,0 @@
----
-name: Feature request
-about: Suggest an idea for this project
-title: "[Feature Request] "
-labels: ''
-assignees: ''
-
----
-
-**Have you searched for similar [requests](https://github.com/SillyTavern/SillyTavern/issues?q=)?**
-Yes/No
-
-**Is your feature request related to a problem? Please describe.**
-A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
-
-**Describe the solution you'd like**
-A clear and concise description of what you want to happen.
-
-**Describe alternatives you've considered**
-A clear and concise description of any alternative solutions or features you've considered.
-
-**Additional context**
-Add any other context or screenshots about the feature request here.

.github/readme-zh_cn.md

@@ -1,8 +1,8 @@
 [English](readme.md) | 中文
 
-![image](https://github.com/SillyTavern/SillyTavern/assets/18619528/8c41a061-7f72-4d2b-9d54-e6d058209e7b)
+![image](https://github.com/SillyTavern/SillyTavern/assets/18619528/c2be4c3f-aada-4f64-87a3-ae35a68b61a4)
 
-移动设备界面友好，多种人工智能服务或模型支持（KoboldAI/CPP, Horde, NovelAI, Ooba, OpenAI, OpenRouter, Claude, Scale），类似 Galgame 的 老 婆 模 式，Horde SD，文本系统语音生成，世界信息（Lorebooks），可定制的界面，自动翻译，和比你所需要的更多的 Prompt。附带扩展服务，支持文本绘画生成与语音生成和基于向量数据库 ChromaDB 的聊天信息总结。
+移动设备界面友好，多种人工智能服务或模型支持（KoboldAI/CPP, Horde, NovelAI, Ooba, OpenAI, OpenRouter, Claude, Scale），类似 Galgame 的 老 婆 模 式，Horde SD，文本系统语音生成，世界信息（Lorebooks），可定制的界面，自动翻译，和比你所需要的更多的 Prompt。附带扩展服务，支持文本绘画生成与语音生成和基于向量数据库 的聊天信息总结。
 
 基于 TavernAI 1.2.8 的分叉版本
 
@@ -41,8 +41,6 @@ SillyTavern 本身并无用处，因为它只是一个用户聊天界面。你
 
 <https://rentry.org/STAI-Termux>
 
-Termux 不支持**.Webp 字符卡的导入/导出。请使用 JSON 或 PNG 格式**。
-
 ## 有问题或建议？
 
 ### 我们现在有了 Discord 社区
@@ -83,7 +81,6 @@ SillyTavern 支持扩展服务，一些额外的人工智能模块可通过 [Sil
 * 在聊天窗口发送图片，并由人工智能解释图片内容
 * 文本图像生成（5 预设，以及 "自由模式"）
 * 聊天信息的文字转语音（通过 ElevenLabs、Silero 或操作系统的语音生成）
-* ChromaDB 向量数据库，用于更智能的聊天 Prompt
 
 扩展服务的完整功能介绍和使用教程，请参阅 [Docs](https://docs.sillytavern.app/extras/extensions/)。
 

.github/readme.md

@@ -1,15 +1,19 @@
 English | [中文](readme-zh_cn.md)
 
-![image](https://github.com/SillyTavern/SillyTavern/assets/18619528/8c41a061-7f72-4d2b-9d54-e6d058209e7b)
+![SillyTavern-Banner](https://github.com/SillyTavern/SillyTavern/assets/18619528/c2be4c3f-aada-4f64-87a3-ae35a68b61a4)
 
-Mobile-friendly, Multi-API (KoboldAI/CPP, Horde, NovelAI, Ooba, OpenAI, OpenRouter, Claude, Scale), VN-like Waifu Mode, Horde SD, System TTS, WorldInfo (lorebooks), customizable UI, auto-translate, and more prompt options than you'd ever want or need. Optional Extras server for more SD/TTS options + ChromaDB/Summarize.
+Mobile-friendly layout, Multi-API (KoboldAI/CPP, Horde, NovelAI, Ooba, OpenAI, OpenRouter, Claude, Scale), VN-like Waifu Mode, Stable Diffusion, TTS, WorldInfo (lorebooks), customizable UI, auto-translate, and more prompt options than you'd ever want or need + ability to install third-party extensions.
 
-Based on a fork of TavernAI 1.2.8
+Based on a fork of [TavernAI](https://github.com/TavernAI/TavernAI) 1.2.8
+
+## Important news!
+
+1. We have created a [Documentation website](https://docs.sillytavern.app/) to answer most of your questions and help you get started.
+
+2. Missing extensions after the update? Since the 1.10.6 release version, most of the previously built-in extensions have been converted to downloadable add-ons. You can download them via the built-in "Download Extensions and Assets" menu in the extensions panel (stacked blocks icon in the top bar).
 
 ### Brought to you by Cohee, RossAscends, and the SillyTavern community
 
-NOTE: We have created a [Documentation website](https://docs.sillytavern.app/) to answer most of your questions and help you get started.
-
 ### What is SillyTavern or TavernAI?
 
 SillyTavern is a user interface you can install on your computer (and Android phones) that allows you to interact with text generation AIs and chat/roleplay with characters you or the community create.
@@ -41,8 +45,6 @@ Since Tavern is only a user interface, it has tiny hardware requirements, it wil
 
 <https://rentry.org/STAI-Termux>
 
-**.webp character cards import/export is not supported in Termux. Use either JSON or PNG formats instead.**
-
 ## Questions or suggestions?
 
 ### We now have a community Discord server
@@ -71,7 +73,6 @@ Get in touch with the developers directly:
 * [Oobabooga's TextGen WebUI](https://github.com/oobabooga/text-generation-webui) API connection
 * [AI Horde](https://horde.koboldai.net/) connection
 * Prompt generation formatting tweaking
-* webp character card interoperability (PNG is still an internal format)
 
 ## Extensions
 
@@ -83,7 +84,6 @@ SillyTavern has extensibility support, with some additional AI modules hosted vi
 * Sending images to chat, and the AI interpreting the content
 * Stable Diffusion image generation (5 chat-related presets plus 'free mode')
 * Text-to-speech for AI response messages (via ElevenLabs, Silero, or the OS's System TTS)
-* ChromaDB vector storage for smarter chat prompt formatting
 
 A full list of included extensions and tutorials on how to use them can be found in the [Docs](https://docs.sillytavern.app/extras/extensions/).
 
@@ -295,6 +295,7 @@ GNU Affero General Public License for more details.**
 * RossAscends' additions: AGPL v3
 * Portions of CncAnon's TavernAITurbo mod: Unknown license
 * kingbri's various commits and suggestions (<https://github.com/bdashore3>)
+* city_unit's extensions and various QoL features (<https://github.com/city-unit>)
 * StefanDanielSchwarz's various commits and bug reports (<https://github.com/StefanDanielSchwarz>)
 * Waifu mode inspired by the work of PepperTaco (<https://github.com/peppertaco/Tavern/>)
 * Thanks Pygmalion University for being awesome testers and suggesting cool features!

.github/workflows/docker-publish.yml

@@ -0,0 +1,45 @@
+# This workflow will publish a docker image for every full release to the GitHub package repository
+
+name: Create Docker Image on Release
+
+on:
+  release:
+    # Only runs on full releases not pre releases
+    types: [released]
+
+env:
+  # This should allow creation of docker images even in forked repositories
+  # Image name may not contain uppercase characters, so we can not use the repository name
+  # Creates a string like: ghcr.io/SillyTavern/sillytavern
+  image_name: ghcr.io/sillytavern/sillytavern
+
+jobs:
+
+  build:
+
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      # Build docker image using dockerfile and tag it with branch name
+      # Assumes branch name is the version number
+      - name: Build the Docker image
+        run: |
+          docker build . --file Dockerfile --tag $image_name:${{ github.ref_name }}
+
+      # Login into package repository as the person who created the release
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@v1
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      # Assumes release is the latest and marks image as such
+      - name: Docker Tag and Push
+        run: |
+          docker tag $image_name:${{ github.ref_name }} $image_name:latest
+          docker push $image_name:${{ github.ref_name }}
+          docker push $image_name:latest

.gitignore

@@ -26,6 +26,7 @@ public/settings.json
 /thumbnails
 whitelist.txt
 .vscode
+.idea/
 secrets.json
 /dist
 /backups/
@@ -35,3 +36,6 @@ content.log
 cloudflared.exe
 public/assets/
 access.log
+/vectors/
+/cache/
+public/css/user.css

Dockerfile

@@ -13,7 +13,7 @@ ENTRYPOINT [ "tini", "--" ]
 WORKDIR ${APP_HOME}
 
 # Install app dependencies
-COPY package*.json ./
+COPY package*.json post-install.js ./
 RUN \
   echo "*** Install npm packages ***" && \
   npm install && npm cache clean --force
@@ -23,7 +23,7 @@ COPY . ./
 
 # Copy default chats, characters and user avatars to <folder>.default folder
 RUN \
-  IFS="," RESOURCES="characters,chats,groups,group chats,User Avatars,worlds" && \
+  IFS="," RESOURCES="characters,chats,groups,group chats,User Avatars,worlds,OpenAI Settings,NovelAI Settings,KoboldAI Settings,TextGen Settings" && \
   \
   echo "*** Store default $RESOURCES in <folder>.default ***" && \
   for R in $RESOURCES; do mv "public/$R" "public/$R.default"; done && \

colab/GPU.ipynb

@@ -70,9 +70,10 @@
         "#@markdown * ckpt/sd15 - base SD 1.5\n",
         "#@markdown * stabilityai/stable-diffusion-2-1-base - base SD 2.1\n",
         "extras_enable_chromadb = True #@param {type:\"boolean\"}\n",
-        "#@markdown Enables ChromaDB for Infinity Context plugin\n",
+        "#@markdown Enables ChromaDB module\n",
         "\n",
         "import subprocess\n",
+        "import secrets\n",
         "\n",
         "# ---\n",
         "# SillyTavern extras\n",
@@ -115,7 +116,8 @@
         "!git clone https://github.com/Cohee1207/tts_samples\n",
         "!npm install -g localtunnel\n",
         "!pip install -r requirements-complete.txt\n",
-        "!pip install tensorflow==2.12\n",
+        "!pip install tensorflow==2.14\n",
+        "!pip install colorama\n",
         "!pip install Flask-Cors\n",
         "!pip install Flask-Compress\n",
         "!pip install transformers\n",
@@ -130,6 +132,13 @@
         "!wget https://github.com/cloudflare/cloudflared/releases/download/2023.5.0/cloudflared-linux-amd64 -O /tmp/cloudflared-linux-amd64\n",
         "!chmod +x /tmp/cloudflared-linux-amd64\n",
         "\n",
+        "# Generate a random API key\n",
+        "api_key = secrets.token_hex(5)\n",
+        "\n",
+        "# Write the API key to api_key.txt\n",
+        "with open('./api_key.txt', 'w') as f:\n",
+        "    f.write(api_key)\n",
+        "print(f\"API Key generated: {api_key}\")\n",
         "\n",
         "cmd = f\"python server.py {' '.join(params)}\"\n",
         "print(cmd)\n",

default/config.conf

@@ -9,13 +9,31 @@ const enableExtensions = true; //Enables support for TavernAI-extras project
 const listen = true; // If true, Can be access from other device or PC. otherwise can be access only from hosting machine.
 const allowKeysExposure = false; // If true, private API keys could be fetched to the frontend.
 const skipContentCheck = false; // If true, no new default content will be delivered to you.
-
+const thumbnailsQuality = 95; // Quality of thumbnails. 0-100
+const disableChatBackup = false; // Disables the backup of chat logs to the /backups folder
 
 // If true, Allows insecure settings for listen, whitelist, and authentication.
 // Change this setting only on "trusted networks". Do not change this value unless you are aware of the issues that can arise from changing this setting and configuring a insecure setting.
 const securityOverride = false;
 
+// Additional settings for extra modules / extensions
+const extras = {
+    // Disables auto-download of models from the HuggingFace Hub.
+    // You will need to manually download the models and put them into the /cache folder.
+    disableAutoDownload: false,
+    // Text classification model for sentiment analysis. HuggingFace ID of a model in ONNX format.
+    classificationModel: 'Cohee/distilbert-base-uncased-go-emotions-onnx',
+    // Image captioning model. HuggingFace ID of a model in ONNX format.
+    captioningModel: 'Xenova/vit-gpt2-image-captioning',
+    // Feature extraction model. HuggingFace ID of a model in ONNX format.
+    embeddingModel: 'Xenova/all-mpnet-base-v2',
+    // GPT-2 text generation model. HuggingFace ID of a model in ONNX format.
+    promptExpansionModel: 'Cohee/fooocus_expansion-onnx',
+};
+
 // Request overrides for additional headers
+// Format is an array of objects:
+// { hosts: [ "<url>" ], headers: { <header>: "<value>" } }
 const requestOverrides = [];
 
 module.exports = {
@@ -32,4 +50,7 @@ module.exports = {
     securityOverride,
     skipContentCheck,
     requestOverrides,
+    thumbnailsQuality,
+    extras,
+    disableChatBackup,
 };

default/settings.json

@@ -49,7 +49,6 @@
         "ban_eos_token": false,
         "skip_special_tokens": true,
         "streaming": false,
-        "streaming_url": "ws://127.0.0.1:5005/api/v1/stream",
         "mirostat_mode": 0,
         "mirostat_tau": 5,
         "mirostat_eta": 0.1,
@@ -75,9 +74,6 @@
         "always_force_name2": true,
         "user_prompt_bias": "",
         "show_user_prompt_bias": true,
-        "multigen": false,
-        "multigen_first_chunk": 50,
-        "multigen_next_chunks": 30,
         "markdown_escape_strings": "",
         "fast_ui_mode": false,
         "avatar_style": 0,
@@ -167,7 +163,8 @@
         "custom_stopping_strings_macro": true,
         "fuzzy_search": true,
         "encode_tags": false,
-        "lazy_load": 100,
+        "enableLabMode": false,
+        "enableZenSliders": false,
         "ui_mode": 1
     },
     "extension_settings": {
@@ -409,8 +406,6 @@
         "typical": 1,
         "tfs": 1,
         "rep_pen_slope": 0,
-        "single_line": false,
-        "use_stop_sequence": false,
         "streaming_kobold": false,
         "sampler_order": [
             6,
@@ -420,7 +415,12 @@
             3,
             4,
             5
-        ]
+        ],
+        "mirostat": 0,
+        "mirostat_tau": 5,
+        "mirostat_eta": 0.1,
+        "use_default_badwordsids": false,
+        "grammar": ""
     },
     "oai_settings": {
         "preset_settings_openai": "Default",

default/user.css

@@ -0,0 +1 @@
+/* Put custom styles here. */

docker/docker-compose.yml

@@ -9,4 +9,5 @@ services:
       - "8000:8000"
     volumes:
       - "./config:/home/node/app/config"
+      - "./user:/home/node/app/public/user"
     restart: unless-stopped

docker/docker-entrypoint.sh

@@ -1,7 +1,7 @@
 #!/bin/sh
 
 # Initialize missing user files
-IFS="," RESOURCES="characters,groups,group chats,chats,User Avatars,worlds"
+IFS="," RESOURCES="characters,chats,groups,group chats,User Avatars,worlds,OpenAI Settings,NovelAI Settings,KoboldAI Settings,TextGen Settings"
 for R in $RESOURCES; do
   if [ ! -e "config/$R" ]; then
     echo "Resource not found, copying from defaults: $R"

package.json

@@ -9,29 +9,27 @@
         "cors": "^2.8.5",
         "csrf-csrf": "^2.2.3",
         "device-detector-js": "^3.0.3",
-        "exifreader": "^4.12.0",
         "express": "^4.18.2",
         "google-translate-api-browser": "^3.0.1",
+        "bing-translate-api": "^2.9.1",
         "gpt3-tokenizer": "^1.1.5",
         "ip-matching": "^2.1.2",
         "ipaddr.js": "^2.0.1",
-        "jimp": "^0.22.7",
-        "jquery": "^3.6.4",
+        "jimp": "^0.22.10",
         "json5": "^2.2.3",
         "lodash": "^4.17.21",
         "mime-types": "^2.1.35",
         "multer": "^1.4.5-lts.1",
         "node-fetch": "^2.6.11",
         "open": "^8.4.2",
-        "piexifjs": "^1.0.6",
         "png-chunk-text": "^1.0.0",
         "png-chunks-encode": "^1.0.0",
         "png-chunks-extract": "^1.0.0",
         "response-time": "^2.3.2",
         "sanitize-filename": "^1.6.3",
+        "sillytavern-transformers": "^2.7.3",
         "simple-git": "^3.19.1",
-        "uniqolor": "^1.1.0",
-        "webp-converter": "2.3.2",
+        "vectra": "^0.2.2",
         "write-file-atomic": "^5.0.1",
         "ws": "^8.13.0",
         "yargs": "^17.7.1",
@@ -40,6 +38,9 @@
     "overrides": {
         "parse-bmfont-xml": {
             "xml2js": "^0.5.0"
+        },
+        "vectra": {
+            "openai": "^4.17.0"
         }
     },
     "name": "sillytavern",
@@ -49,11 +50,12 @@
         "type": "git",
         "url": "https://github.com/SillyTavern/SillyTavern.git"
     },
-    "version": "1.10.2",
+    "version": "1.10.8",
     "scripts": {
         "start": "node server.js",
         "start-multi": "node server.js --disableCsrf",
-        "pkg": "pkg --compress Gzip --no-bytecode --public ."
+        "pkg": "pkg --compress Gzip --no-bytecode --public .",
+        "postinstall": "node post-install.js"
     },
     "bin": {
         "sillytavern": "./server.js"
@@ -78,6 +80,7 @@
         ]
     },
     "devDependencies": {
+        "jquery": "^3.6.4",
         "pkg": "^5.8.1",
         "pkg-fetch": "^3.5.2"
     }

post-install.js

@@ -0,0 +1,82 @@
+/**
+ * Scripts to be done before starting the server for the first time.
+ */
+const fs = require('fs');
+const path = require('path');
+const crypto = require('crypto');
+
+/**
+ * Creates the default config files if they don't exist yet.
+ */
+function createDefaultFiles() {
+    const files = {
+        settings: './public/settings.json',
+        bg_load: './public/css/bg_load.css',
+        config: './config.conf',
+        user: './public/css/user.css',
+    };
+
+    for (const file of Object.values(files)) {
+        try {
+            if (!fs.existsSync(file)) {
+                const defaultFilePath = path.join('./default', path.parse(file).base);
+                fs.copyFileSync(defaultFilePath, file);
+                console.log(`Created default file: ${file}`);
+            }
+        } catch (error) {
+            console.error(`FATAL: Could not write default file: ${file}`, error);
+        }
+    }
+}
+
+/**
+ * Returns the MD5 hash of the given data.
+ * @param {Buffer} data Input data
+ * @returns {string} MD5 hash of the input data
+ */
+function getMd5Hash(data) {
+    return crypto
+        .createHash('md5')
+        .update(data)
+        .digest('hex');
+}
+
+/**
+ * Copies the WASM binaries from the sillytavern-transformers package to the dist folder.
+ */
+function copyWasmFiles() {
+    if (!fs.existsSync('./dist')) {
+        fs.mkdirSync('./dist');
+    }
+
+    const listDir = fs.readdirSync('./node_modules/sillytavern-transformers/dist');
+
+    for (const file of listDir) {
+        if (file.endsWith('.wasm')) {
+            const sourcePath = `./node_modules/sillytavern-transformers/dist/${file}`;
+            const targetPath = `./dist/${file}`;
+
+            // Don't copy if the file already exists and is the same checksum
+            if (fs.existsSync(targetPath)) {
+                const sourceChecksum = getMd5Hash(fs.readFileSync(sourcePath));
+                const targetChecksum = getMd5Hash(fs.readFileSync(targetPath));
+
+                if (sourceChecksum === targetChecksum) {
+                    continue;
+                }
+            }
+
+            fs.copyFileSync(sourcePath, targetPath);
+            console.log(`${file} successfully copied to ./dist/${file}`);
+        }
+    }
+}
+
+try {
+    // 1. Create default config files
+    createDefaultFiles();
+    // 2. Copy transformers WASM binaries from node_modules
+    copyWasmFiles();
+} catch (error) {
+    console.error(error);
+}

public/KoboldAI Settings/Ace of Spades.settings

@@ -1,12 +1,12 @@
 {
     "temp": 1.15,
-    "top_k": 0,
-    "top_p": 0.95,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 0.8,
     "rep_pen": 1.05,
     "rep_pen_range": 2048,
+    "top_p": 0.95,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 0.8,
     "rep_pen_slope": 7,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         5,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Basic Coherence.settings

@@ -1,12 +1,12 @@
 {
     "temp": 0.59,
-    "top_k": 0,
-    "top_p": 1,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 0.87,
     "rep_pen": 1.1,
     "rep_pen_range": 2048,
+    "top_p": 1,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 0.87,
     "rep_pen_slope": 0.3,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         3,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Best Guess.settings

@@ -1,12 +1,12 @@
 {
     "temp": 0.8,
-    "top_k": 100,
-    "top_p": 0.9,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 1,
     "rep_pen": 1.15,
     "rep_pen_range": 2048,
+    "top_p": 0.9,
+    "top_a": 0,
+    "top_k": 100,
+    "typical": 1,
+    "tfs": 1,
     "rep_pen_slope": 3.4,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         3,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Coherent Creativity.settings

@@ -1,12 +1,12 @@
 {
     "temp": 0.51,
-    "top_p": 1,
-    "top_k": 0,
-    "tfs": 0.99,
-    "top_a": 0,
-    "typical": 1,
     "rep_pen": 1.2,
     "rep_pen_range": 2048,
+    "top_p": 1,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 0.99,
     "rep_pen_slope": 0,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         3,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Deterministic.settings

@@ -8,7 +8,6 @@
     "typical": 1,
     "tfs": 1,
     "rep_pen_slope": 0,
-    "single_line": false,
     "sampler_order": [
         6,
         0,
@@ -17,5 +16,9 @@
         4,
         2,
         5
-    ]
-}
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
+}

public/KoboldAI Settings/Genesis.settings

@@ -1,12 +1,12 @@
 {
     "temp": 0.63,
-    "top_k": 0,
-    "top_p": 0.98,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 0.98,
     "rep_pen": 1.05,
     "rep_pen_range": 2048,
+    "top_p": 0.98,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 0.98,
     "rep_pen_slope": 0.1,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         5,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Godlike.settings

@@ -1,12 +1,12 @@
 {
     "temp": 0.7,
-    "top_k": 0,
-    "top_p": 0.5,
-    "top_a": 0.75,
-    "typical": 0.19,
-    "tfs": 0.97,
     "rep_pen": 1.1,
     "rep_pen_range": 1024,
+    "top_p": 0.5,
+    "top_a": 0.75,
+    "top_k": 0,
+    "typical": 0.19,
+    "tfs": 0.97,
     "rep_pen_slope": 0.7,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         2,
         1,
         0
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Good Winds.settings

@@ -1,12 +1,12 @@
 {
     "temp": 0.7,
-    "top_k": 0,
-    "top_p": 1,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 0.9,
     "rep_pen": 1.1,
     "rep_pen_range": 1024,
+    "top_p": 1,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 0.9,
     "rep_pen_slope": 0.7,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         3,
         4,
         5
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Liminal Drift.settings

@@ -1,12 +1,12 @@
 {
     "temp": 0.66,
-    "top_k": 0,
-    "top_p": 1,
-    "top_a": 0.96,
-    "typical": 0.6,
-    "tfs": 1,
     "rep_pen": 1.1,
     "rep_pen_range": 1024,
+    "top_p": 1,
+    "top_a": 0.96,
+    "top_k": 0,
+    "typical": 0.6,
+    "tfs": 1,
     "rep_pen_slope": 0.7,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         0,
         2,
         3
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Low Rider.settings

@@ -1,12 +1,12 @@
 {
     "temp": 0.94,
-    "top_k": 12,
-    "top_p": 1,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 0.94,
     "rep_pen": 1.05,
     "rep_pen_range": 2048,
+    "top_p": 1,
+    "top_a": 0,
+    "top_k": 12,
+    "typical": 1,
+    "tfs": 0.94,
     "rep_pen_slope": 0.2,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         3,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Luna Moth.settings

@@ -1,12 +1,12 @@
 {
     "temp": 1.5,
-    "top_k": 85,
-    "top_p": 0.24,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 1,
     "rep_pen": 1.1,
     "rep_pen_range": 2048,
+    "top_p": 0.24,
+    "top_a": 0,
+    "top_k": 85,
+    "typical": 1,
+    "tfs": 1,
     "rep_pen_slope": 0,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         3,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Mayday.settings

@@ -1,12 +1,12 @@
 {
     "temp": 1.05,
-    "top_k": 0,
-    "top_p": 0.95,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 1,
     "rep_pen": 1.1,
     "rep_pen_range": 1024,
+    "top_p": 0.95,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 1,
     "rep_pen_slope": 0.7,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         3,
         4,
         5
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Miro Bronze.settings

@@ -0,0 +1,24 @@
+{
+    "temp": 1.06,
+    "rep_pen": 1,
+    "rep_pen_range": 0,
+    "top_p": 1,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 1,
+    "rep_pen_slope": 0.9,
+    "sampler_order": [
+        6,
+        0,
+        1,
+        3,
+        4,
+        2,
+        5
+    ],
+    "mirostat": 2,
+    "mirostat_tau": 9.61,
+    "mirostat_eta": 1,
+    "grammar": ""
+}

public/KoboldAI Settings/Miro Gold.settings

@@ -0,0 +1,24 @@
+{
+    "temp": 1.17,
+    "rep_pen": 1,
+    "rep_pen_range": 0,
+    "top_p": 1,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 1,
+    "rep_pen_slope": 0.9,
+    "sampler_order": [
+        6,
+        0,
+        1,
+        3,
+        4,
+        2,
+        5
+    ],
+    "mirostat": 2,
+    "mirostat_tau": 9.91,
+    "mirostat_eta": 1,
+    "grammar": ""
+}

public/KoboldAI Settings/Miro Silver.settings

@@ -0,0 +1,24 @@
+{
+    "temp": 1.17,
+    "rep_pen": 1,
+    "rep_pen_range": 0,
+    "top_p": 1,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 1,
+    "rep_pen_slope": 0.9,
+    "sampler_order": [
+        6,
+        0,
+        1,
+        3,
+        4,
+        2,
+        5
+    ],
+    "mirostat": 2,
+    "mirostat_tau": 9.62,
+    "mirostat_eta": 1,
+    "grammar": ""
+}

public/KoboldAI Settings/Ouroboros.settings

@@ -1,12 +1,12 @@
 {
     "temp": 1.07,
-    "top_k": 100,
-    "top_p": 1,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 0.93,
     "rep_pen": 1.05,
     "rep_pen_range": 404,
+    "top_p": 1,
+    "top_a": 0,
+    "top_k": 100,
+    "typical": 1,
+    "tfs": 0.93,
     "rep_pen_slope": 0.8,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         2,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Pleasing Results.settings

@@ -1,12 +1,12 @@
 {
     "temp": 0.44,
-    "top_k": 0,
-    "top_p": 1,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 0.9,
     "rep_pen": 1.15,
     "rep_pen_range": 2048,
+    "top_p": 1,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 0.9,
     "rep_pen_slope": 6.8,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         3,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/Pro Writer.settings

@@ -1,12 +1,12 @@
 {
     "temp": 1.35,
-    "top_k": 0,
-    "top_p": 1,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 0.69,
     "rep_pen": 1.15,
     "rep_pen_range": 2048,
+    "top_p": 1,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 0.69,
     "rep_pen_slope": 0.1,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         0,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/RecoveredRuins.settings

@@ -1,12 +1,12 @@
 {
     "temp": 1,
-    "top_k": 0,
-    "top_p": 0.95,
-    "top_a": 0,
-    "typical": 1,
-    "tfs": 1,
     "rep_pen": 1.1,
     "rep_pen_range": 600,
+    "top_p": 0.95,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 1,
     "rep_pen_slope": 0,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         3,
         4,
         5
-    ]
-}
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
+}

public/KoboldAI Settings/Space Alien.settings

@@ -8,7 +8,6 @@
     "typical": 1,
     "tfs": 1,
     "rep_pen_slope": 0,
-    "single_line": false,
     "sampler_order": [
         6,
         0,
@@ -17,5 +16,9 @@
         4,
         2,
         5
-    ]
-}
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
+}

public/KoboldAI Settings/Storywriter.settings

@@ -1,12 +1,12 @@
 {
     "temp": 0.72,
-    "tfs": 1,
-    "top_a": 0,
-    "top_k": 0,
-    "top_p": 0.73,
-    "typical": 1,
     "rep_pen": 1.1,
     "rep_pen_range": 2048,
+    "top_p": 0.73,
+    "top_a": 0,
+    "top_k": 0,
+    "typical": 1,
+    "tfs": 1,
     "rep_pen_slope": 0.2,
     "sampler_order": [
         6,
@@ -16,5 +16,9 @@
         3,
         1,
         4
-    ]
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
 }

public/KoboldAI Settings/TFS-with-Top-A.settings

@@ -8,7 +8,6 @@
     "typical": 1,
     "tfs": 0.95,
     "rep_pen_slope": 0,
-    "single_line": false,
     "sampler_order": [
         6,
         0,
@@ -17,5 +16,9 @@
         4,
         2,
         5
-    ]
-}
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
+}

public/KoboldAI Settings/Titanic.settings

@@ -8,7 +8,6 @@
     "typical": 1,
     "tfs": 1,
     "rep_pen_slope": 0,
-    "single_line": false,
     "sampler_order": [
         6,
         0,
@@ -17,5 +16,9 @@
         4,
         2,
         5
-    ]
-}
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
+}

public/KoboldAI Settings/simple-proxy-for-tavern.settings

@@ -8,7 +8,6 @@
     "typical": 1,
     "tfs": 1,
     "rep_pen_slope": 0,
-    "single_line": false,
     "sampler_order": [
         6,
         0,
@@ -17,5 +16,9 @@
         4,
         2,
         5
-    ]
-}
+    ],
+    "mirostat": 0,
+    "mirostat_tau": 5,
+    "mirostat_eta": 0.1,
+    "grammar": ""
+}

public/TextGen Settings/Miro Bronze.settings

@@ -0,0 +1,24 @@
+{
+    "temp": 1.06,
+    "top_p": 1,
+    "top_k": 0,
+    "typical_p": 1,
+    "top_a": 0,
+    "tfs": 1,
+    "epsilon_cutoff": 0,
+    "eta_cutoff": 0,
+    "rep_pen": 1,
+    "rep_pen_range": 0,
+    "no_repeat_ngram_size": 0,
+    "penalty_alpha": 0,
+    "num_beams": 1,
+    "length_penalty": 1,
+    "min_length": 0,
+    "encoder_rep_pen": 1,
+    "do_sample": true,
+    "early_stopping": false,
+    "mirostat_mode": 2,
+    "mirostat_tau": 9.61,
+    "mirostat_eta": 1,
+    "rep_pen_size": 0
+}

public/TextGen Settings/Miro Gold.settings

@@ -0,0 +1,24 @@
+{
+    "temp": 1.17,
+    "top_p": 1,
+    "top_k": 0,
+    "typical_p": 1,
+    "top_a": 0,
+    "tfs": 1,
+    "epsilon_cutoff": 0,
+    "eta_cutoff": 0,
+    "rep_pen": 1,
+    "rep_pen_range": 0,
+    "no_repeat_ngram_size": 0,
+    "penalty_alpha": 0,
+    "num_beams": 1,
+    "length_penalty": 1,
+    "min_length": 0,
+    "encoder_rep_pen": 1,
+    "do_sample": true,
+    "early_stopping": false,
+    "mirostat_mode": 2,
+    "mirostat_tau": 9.91,
+    "mirostat_eta": 1,
+    "rep_pen_size": 0
+}

public/TextGen Settings/Miro Silver.settings

@@ -0,0 +1,24 @@
+{
+    "temp": 1.17,
+    "top_p": 1,
+    "top_k": 0,
+    "typical_p": 1,
+    "top_a": 0,
+    "tfs": 1,
+    "epsilon_cutoff": 0,
+    "eta_cutoff": 0,
+    "rep_pen": 1,
+    "rep_pen_range": 0,
+    "no_repeat_ngram_size": 0,
+    "penalty_alpha": 0,
+    "num_beams": 1,
+    "length_penalty": 1,
+    "min_length": 0,
+    "encoder_rep_pen": 1,
+    "do_sample": true,
+    "early_stopping": false,
+    "mirostat_mode": 2,
+    "mirostat_tau": 9.62,
+    "mirostat_eta": 1,
+    "rep_pen_size": 0
+}

public/assets/blip/.placeholder

@@ -0,0 +1 @@
+Put blip audio files here

public/assets/live2d/.placeholder

@@ -0,0 +1 @@
+Put live2d model folders here

public/context/Adventure.json

@@ -0,0 +1,10 @@
+{
+    "story_string": "{{#if system}}{{system}}\n{{/if}}{{#if wiBefore}}{{wiBefore}}\n{{/if}}{{#if description}}{{description}}\n{{/if}}{{#if personality}}{{personality}}\n{{/if}}{{#if scenario}}{{scenario}}\n{{/if}}{{#if wiAfter}}{{wiAfter}}\n{{/if}}{{#if persona}}{{persona}}\n{{/if}}",
+    "example_separator": "",
+    "chat_start": "",
+    "always_force_name2": false,
+    "trim_sentences": false,
+    "include_newline": false,
+    "single_line": true,
+    "name": "Adventure"
+}

public/context/ChatML.json

@@ -0,0 +1,6 @@
+{
+    "story_string": "<|im_start|>system\n{{#if system}}{{system}}\n{{/if}}{{#if wiBefore}}{{wiBefore}}\n{{/if}}{{#if description}}{{description}}\n{{/if}}{{#if personality}}{{char}}'s personality: {{personality}}\n{{/if}}{{#if scenario}}Scenario: {{scenario}}\n{{/if}}{{#if wiAfter}}{{wiAfter}}\n{{/if}}{{#if persona}}{{persona}}\n{{/if}}<|im_end|>",
+    "chat_start": "",
+    "example_separator": "",
+    "name": "ChatML"
+}

public/context/Libra-32B.json

@@ -0,0 +1,6 @@
+{
+    "story_string": "### Instruction:\nWrite {{char}}'s next reply in this roleplay with {{user}}. Use the provided character sheet and example dialogue for formatting direction and character speech patterns.\n\n{{#if system}}{{system}}\n\n{{/if}}### Character Sheet:\n{{#if wiBefore}}{{wiBefore}}\n{{/if}}{{#if description}}{{description}}\n{{/if}}{{#if personality}}{{char}}'s personality: {{personality}}\n{{/if}}{{#if scenario}}Scenario: {{scenario}}\n{{/if}}{{#if wiAfter}}{{wiAfter}}\n{{/if}}{{#if persona}}{{persona}}\n{{/if}}",
+    "chat_start": "### START ROLEPLAY:",
+    "example_separator": "### Example:",
+    "name": "Libra-32B"
+}

public/context/Lightning 1.1.json

@@ -0,0 +1,6 @@
+{
+    "story_string": "{{system}}\n{{#if wiBefore}}{{wiBefore}}\n{{/if}}{{#if description}}{{char}}'s description:{{description}}\n{{/if}}{{#if personality}}{{char}}'s personality:{{personality}}\n{{/if}}{{#if scenario}}Scenario: {{scenario}}\n{{/if}}{{#if wiAfter}}{{wiAfter}}\n{{/if}}{{#if persona}}{{user}}'s persona: {{persona}}\n{{/if}}",
+    "chat_start": "This is the history of the roleplay:",
+    "example_separator": "Example of an interaction:",
+    "name": "Lightning 1.1"
+}

public/context/Mistral.json

@@ -0,0 +1,6 @@
+{
+    "story_string": "[INST] {{#if system}}{{system}}\n{{/if}}{{#if wiBefore}}{{wiBefore}}\n{{/if}}{{#if description}}{{description}}\n{{/if}}{{#if personality}}{{char}}'s personality: {{personality}}\n{{/if}}{{#if scenario}}Scenario: {{scenario}}\n{{/if}}{{#if wiAfter}}{{wiAfter}}\n{{/if}}{{#if persona}}{{persona}}\n{{/if}}[/INST]",
+    "chat_start": "",
+    "example_separator": "Examples:",
+    "name": "Mistral"
+}

public/context/OldDefault.json

@@ -0,0 +1,6 @@
+{
+    "story_string": "{{#if system}}{{system}}\n{{/if}}{{#if wiBefore}}{{wiBefore}}\n{{/if}}{{#if description}}{{description}}\n{{/if}}{{#if personality}}{{char}}'s personality: {{personality}}\n{{/if}}{{#if scenario}}Circumstances and context of the dialogue: {{scenario}}\n{{/if}}{{#if wiAfter}}{{wiAfter}}\n{{/if}}{{#if persona}}{{persona}}\n{{/if}}",
+    "chat_start": "\nThen the roleplay chat between {{user}} and {{char}} begins.\n",
+    "example_separator": "This is how {{char}} should talk",
+    "name": "OldDefault"
+}

public/context/Pygmalion.json

@@ -1,6 +1,6 @@
 {
     "name": "Pygmalion",
-    "story_string": "{{#if system}}{{system}}\n{{/if}}{{#if wiBefore}}{{wiBefore}}\n{{/if}}{{#if description}}{{{char}}}'s Persona: {{description}}\n{{/if}}{{#if personality}}Personality: {{personality}}\n{{/if}}{{#if scenario}}Scenario: {{scenario}}\n{{/if}}{{#if wiAfter}}{{wiAfter}}\n{{/if}}{{#if persona}}{{persona}}\n{{/if}}",
-    "chat_start": "<START>",
-    "example_separator": "<START>"
+    "story_string": "{{#if system}}{{system}}\n{{/if}}{{#if wiBefore}}{{wiBefore}}\n{{/if}}{{#if description}}{{description}}\n{{/if}}{{#if personality}}{{char}}'s personality: {{personality}}\n{{/if}}{{#if scenario}}Scenario: {{scenario}}\n{{/if}}{{#if wiAfter}}{{wiAfter}}\n{{/if}}{{#if persona}}{{persona}}\n{{/if}}",
+    "chat_start": "",
+    "example_separator": ""
 }

public/context/Story.json

@@ -0,0 +1,6 @@
+{
+    "story_string": "{{#if system}}{{system}}\n{{/if}}{{#if wiBefore}}{{wiBefore}}\n{{/if}}{{#if description}}{{description}}\n{{/if}}{{#if personality}}{{personality}}\n{{/if}}{{#if scenario}}{{scenario}}\n{{/if}}{{#if wiAfter}}{{wiAfter}}\n{{/if}}{{#if persona}}{{persona}}\n{{/if}}",
+    "chat_start": "",
+    "example_separator": "",
+    "name": "Story"
+}

public/css/character-group-overlay.css

@@ -0,0 +1,105 @@
+
+#rm_print_characters_block.group_overlay_mode_select .character_select {
+    transition: background-color 0.4s ease;
+    margin-bottom: 1px;
+    background-color: rgba(170, 170, 170, 0.15);
+}
+
+#rm_print_characters_block.group_overlay_mode_select .bogus_folder_select,
+#rm_print_characters_block.group_overlay_mode_select .group_select {
+    cursor: auto;
+    filter: saturate(0.3);
+}
+
+#rm_print_characters_block.group_overlay_mode_select .bogus_folder_select:hover,
+#rm_print_characters_block.group_overlay_mode_select .group_select:hover {
+    background: none;
+}
+
+#rm_print_characters_block.group_overlay_mode_select .character_select input.bulk_select_checkbox {
+    display: none !important;
+}
+
+#rm_print_characters_block.group_overlay_mode_select .character_select.character_selected {
+    background-color: var(--SmartThemeQuoteColor);
+}
+
+#rm_print_characters_block.group_overlay_mode_select .character_select .bulk_select_checkbox {
+    visibility: hidden;
+    height: 0 !important;
+}
+
+#character_context_menu.hidden { display: none; }
+#character_context_menu {
+    position: absolute;
+    padding: 3px;
+    z-index: 9998;
+    background-color: var(--black90a);
+    border: 1px solid var(--black90a);
+    border-radius: 10px;
+}
+
+#character_context_menu ul li button {
+    border: 0;
+    border-bottom-color: currentcolor;
+    color: var(--SmartThemeQuoteColor);
+    background-color: transparent;
+    font-weight: bold;
+    font-size: 1em;
+    padding: 0.5em;
+    border-bottom: 1px dotted var(--SmartThemeQuoteColor);
+    width: 100%;
+    cursor: pointer;
+}
+
+#character_context_menu ul li button:hover {
+    background-color: var(--SmartThemeBlurTintColor);
+}
+
+#character_context_menu ul li:last-child button {
+    border-bottom: 0;
+}
+
+#character_context_menu ul li #character_context_menu_delete {
+    color: var(--fullred);
+}
+
+#character_context_menu ul {
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+}
+
+#character_context_menu .character_context_menu_separator {
+    height: 1px;
+    background-color: var(--SmartThemeBotMesBlurTintColor);
+}
+
+#character_context_menu li:hover {
+    background-color: var(--SmartThemeBotMesBlurTintColor);
+}
+
+#bulkEditButton.bulk_edit_overlay_active {
+    color: var(--golden);
+}
+
+#bulk_tag_shadow_popup {
+    backdrop-filter: blur(calc(var(--SmartThemeBlurStrength) * 2));
+    -webkit-backdrop-filter: blur(calc(var(--SmartThemeBlurStrength) * 2));
+    background-color: var(--black30a);
+    position: absolute;
+    width: 100%;
+    height: 100vh;
+    height: 100svh;
+    z-index: 9998;
+    top: 0;
+}
+
+#bulk_tag_shadow_popup #bulk_tag_popup {
+    padding: 1em;
+}
+
+#bulk_tag_shadow_popup #bulk_tag_popup #dialogue_popup_controls .menu_button {
+    width: 100px;
+    padding: 0.25em;
+}

public/css/extensions-panel.css

@@ -3,11 +3,6 @@
     display: block;
 }
 
-#extensions_status {
-    /* margin-bottom: 10px; */
-    font-weight: 700;
-}
-
 .extensions_block input[type="submit"]:hover {
     background-color: green;
 }
@@ -93,4 +88,119 @@ input.extension_missing[type="checkbox"] {
 .update-button {
     margin-right: 10px;
     display: inline-flex;
-}
+}
+
+/* Fixes order of settings for extensions */
+#extensions_settings,
+#extensions_settings2 {
+    display: flex;
+    flex-direction: column;
+}
+
+/** LEFT COLUMN **/
+/* Must be always on top */
+#extensions_settings>#assets_ui {
+    order: -1;
+}
+
+#extensions_settings>.expression_settings {
+    order: 2;
+}
+
+#extensions_settings>.background_settings {
+    order: 3;
+}
+
+#extensions_settings>.sd_settings {
+    order: 4;
+}
+
+#extensions_settings>#tts_settings {
+    order: 5;
+}
+
+#extensions_settings>#rvc_settings {
+    order: 6;
+}
+
+#extensions_settings>.objective-settings {
+    order: 7;
+}
+
+#extensions_settings>#speech_recognition_settings {
+    order: 8;
+}
+
+#extensions_settings>#audio_settings {
+    order: 9;
+}
+
+/** RIGHT COLUMN **/
+#extensions_settings2>.translation_settings {
+    order: 1;
+}
+
+#extensions_settings2>.caption_settings {
+    order: 2;
+}
+
+#extensions_settings2>.quickReplySettings {
+    order: 3;
+}
+
+#extensions_settings2>.idle-settings {
+    order: 4;
+}
+
+#extensions_settings2>#memory_settings {
+    order: 5;
+}
+
+#extensions_settings2>.hypebot_settings {
+    order: 6;
+}
+
+#extensions_settings2>.regex_settings {
+    order: 7;
+}
+
+#extensions_settings2>.vectors_settings {
+    order: 8;
+}
+
+#extensions_settings2>.chromadb_settings {
+    order: 9;
+}
+
+#extensions_settings2>.randomizer_settings {
+    order: 10;
+}
+
+/** WAND MENU **/
+#extensionsMenu>#ttsExtensionMenuItem {
+    order: 1;
+}
+
+#extensionsMenu>#sd_gen {
+    order: 2;
+}
+
+#extensionsMenu>#send_picture {
+    order: 3;
+}
+
+#extensionsMenu>#token_counter {
+    order: 4;
+}
+
+#extensionsMenu>#objective-task-manual-check-menu-item {
+    order: 5;
+}
+
+#extensionsMenu>#roll_dice {
+    order: 6;
+}
+
+#extensionsMenu>#translate_chat {
+    order: 7;
+}

public/css/loader.css

@@ -0,0 +1,25 @@
+#loader {
+    position: fixed;
+    margin: 0;
+    padding: 0;
+    top: 0;
+    left: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 999999;
+    width: 100vw;
+    height: 100vh;
+    width: 100svw;
+    height: 100svh;
+    background-color: var(--SmartThemeBlurTintColor);
+    /*for some reason the full screen blur does not work on iOS*/
+    backdrop-filter: blur(30px);
+    color: var(--SmartThemeBodyColor);
+    opacity: 1;
+}
+
+#load-spinner {
+    transition: all 300ms ease-out;
+    opacity: 1;
+}

public/css/mobile-styles.css

@@ -35,7 +35,7 @@
         max-width: 90svw;
     }
 
-    .world_entry_thin_controls,
+    /* .world_entry_thin_controls, */
     #persona-management-block,
     #character_popup .flex-container {
         flex-direction: column;
@@ -63,6 +63,15 @@
         display: none;
     }
 
+    .world_entry .inline-drawer-toggle {
+        padding-bottom: 5px;
+    }
+
+    #worldInfoScanningCheckboxes {
+        flex-flow: row;
+        flex-wrap: wrap;
+    }
+
     body {
         touch-action: none;
         overflow: hidden;
@@ -70,6 +79,10 @@
 
     }
 
+    .world_entry_form_control {
+        /* width: 100%; */
+    }
+
     .drawer-content {
         min-width: unset;
         width: 100%;
@@ -78,7 +91,7 @@
         position: fixed;
         left: 0;
         top: 5px;
-        border: 1px solid var(--grey30);
+        border: 1px solid var(--SmartThemeBorderColor);
     }
 
     #select_chat_popup {
@@ -91,7 +104,6 @@
     #top-settings-holder,
     #top-bar {
         position: fixed;
-        padding-top: 3px;
         width: 100vw;
         width: 100svw;
     }
@@ -114,18 +126,32 @@
     /* ,
     #world_popup  */
         {
-        max-height: calc(100vh - 36px);
-        max-height: calc(100svh - 36px);
+        /*max-height: calc(100vh - 36px);
+        max-height: calc(100svh - 36px);*/
         width: 100% !important;
         margin: 0 auto;
         max-width: 100%;
         left: 0 !important;
         resize: none !important;
-        top: 36px;
+        top: var(--topBarBlockSize);
     }
 
     .wi-settings {
         flex-direction: column;
+        gap: 5px !important;
+    }
+
+    .WIEntryTitleAndStatus,
+    .WIEntryHeaderControls {
+        width: 100%;
+    }
+
+    #WIEntryHeaderTitlesPC {
+        display: none;
+    }
+
+    .WIEntryHeaderTitleMobile {
+        display: block !important;
     }
 
     #character_popup,
@@ -135,15 +161,15 @@
 
     #character_popup,
     #send_form {
-        border: 1px solid var(--grey30);
+        border: 1px solid var(--SmartThemeBorderColor);
         backdrop-filter: blur(calc(var(--SmartThemeBlurStrength) * 2));
         max-width: 100dvw;
     }
 
     #chat {
-        border-left: 1px solid var(--grey30);
-        border-right: 1px solid var(--grey30);
-        border-bottom: 1px solid var(--grey30);
+        border-left: 1px solid var(--SmartThemeBorderColor);
+        border-right: 1px solid var(--SmartThemeBorderColor);
+        border-bottom: 1px solid var(--SmartThemeBorderColor);
         align-items: start;
         align-content: start;
         overflow-y: auto;
@@ -161,7 +187,9 @@
     }
 
     #showRawPrompt,
-    #groupCurrentMemberPopoutButton {
+    #copyPromptToClipboard,
+    #groupCurrentMemberPopoutButton,
+    #summaryExtensionPopoutButton {
         display: none;
     }
 
@@ -175,11 +203,11 @@
         width: 100% !important;
         max-width: 100% !important;
         overflow-y: hidden;
-        border-left: 1px solid var(--grey30);
-        border-right: 1px solid var(--grey30);
-        border-bottom: 1px solid var(--grey30);
+        border-left: 1px solid var(--SmartThemeBorderColor);
+        border-right: 1px solid var(--SmartThemeBorderColor);
+        border-bottom: 1px solid var(--SmartThemeBorderColor);
         border-radius: 0 0 20px 20px;
-        top: 36px !important;
+        top: var(--topBarBlockSize) !important;
         left: 0 !important;
         backdrop-filter: blur(calc(var(--SmartThemeBlurStrength) * 2));
     }
@@ -265,12 +293,13 @@
         display: none;
     }
 
-    #bg_menu_content {
+    .bg_list {
         width: unset;
     }
 }
 
 @media screen and (min-width: 1001px) {
+
     #PygOverrides,
     #ContextFormatting,
     #UI-Theme-Block,
@@ -310,8 +339,7 @@
         min-width: 100px;
         min-height: 100px;
         max-height: 50vh;
-        max-width: 50vh;
-        width: 50vw;
+        max-width: 90vw;
         position: absolute;
         padding: 0;
         filter: drop-shadow(2px 2px 2px #51515199);

public/css/promptmanager.css

@@ -13,7 +13,7 @@
     grid-column-end: 4;
     width: 100%;
     margin: 0.5em 0;
-    background-image: linear-gradient(90deg, var(--transparent), var(--white30a), var(--transparent));
+    background-image: linear-gradient(90deg, var(--transparent), var(--SmartThemeBorderColor), var(--transparent));
     min-height: 1px;
 }
 
@@ -54,7 +54,7 @@
 #completion_prompt_manager #completion_prompt_manager_list li.completion_prompt_manager_prompt {
     align-items: center;
     padding: 0.5em;
-    border: 1px solid var(--white30a);
+    border: 1px solid var(--SmartThemeBorderColor);
 }
 
 #completion_prompt_manager #completion_prompt_manager_list li.completion_prompt_manager_prompt .prompt_manager_prompt_controls {
@@ -109,7 +109,7 @@
 #completion_prompt_manager_popup .completion_prompt_manager_prompt {
     margin: 1em 0;
     padding: 0.5em;
-    border: 1px solid var(--white30a);
+    border: 1px solid var(--SmartThemeBorderColor);
 }
 
 #completion_prompt_manager_popup .completion_prompt_manager_popup_header {
@@ -265,7 +265,7 @@
     top: var(--topBarBlockSize);
     box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
     padding: 1em;
-    border: 1px solid #333333;
+    border: 1px solid var(--SmartThemeBorderColor);
     flex-direction: column;
     z-index: 3010 !important;
     border-radius: 0 0 20px 20px;

public/css/rm-groups.css

@@ -14,7 +14,8 @@
     margin-top: auto;
     margin-bottom: auto;
     color: rgb(188, 193, 200, 1);
-    border: 1px solid #333;
+    border: 1px solid var(--SmartThemeBorderColor);
+    ;
     background-color: rgba(0, 0, 0, 0.3);
     padding: 6px;
     border-radius: 10px;
@@ -61,7 +62,8 @@
 #rm_group_add_members {
     margin-top: 0.25rem;
     margin-bottom: 0.5rem;
-    border: 1px solid grey;
+    border: 1px solid var(--SmartThemeBorderColor);
+    ;
     border-radius: 10px;
     background-color: var(--black30a);
 }
@@ -76,6 +78,7 @@
 
 #rm_group_members:empty {
     width: 100%;
+    padding: 0.5em 0;
 }
 
 #rm_group_members:empty::before {
@@ -224,4 +227,5 @@
 
 .group_member .avatar {
     flex-shrink: 0;
-}
+    flex-basis: auto;
+}

public/css/select2-overrides.css

@@ -6,7 +6,7 @@
 /* Customize the dropdown */
 .select2-dropdown {
     background-color: var(--SmartThemeBlurTintColor);
-    border: 1px solid var(--white30a) !important;
+    border: 1px solid var(--SmartThemeBorderColor) !important;
     border-radius: 10px;
     box-shadow: 0 0 5px black;
     text-shadow: 0px 0px calc(var(--shadowWidth) * 1px) var(--SmartThemeShadowColor);
@@ -19,11 +19,24 @@
     color: var(--SmartThemeBodyColor);
 }
 
+.select2-container .select2-search__field {
+    opacity: 0.8;
+}
+
+.select2-container .select2-selection--single .select2-selection__rendered {
+    color: var(--SmartThemeBodyColor);
+    line-height: revert;
+    padding-left: unset;
+}
+
+.select2-container .select2-results>.select2-results__options {
+    max-height: 300px;
+}
+
 .select2-container .select2-selection--multiple .select2-selection__choice__remove {
     padding: revert;
-    border-right: 1px solid var(--white30a);
+    border-right: 1px solid var(--SmartThemeBorderColor);
     font-size: 1.1em;
-
 }
 
 .select2-container .select2-selection--multiple .select2-selection__choice__display {
@@ -34,7 +47,7 @@
 .select2-search__field {
     background-color: var(--black30a);
     color: var(--SmartThemeBodyColor);
-    border: 1px solid var(--white30a);
+    border: 1px solid var(--SmartThemeBorderColor);
     border-radius: 7px;
     font-family: "Noto Sans", "Noto Color Emoji", sans-serif;
     padding: 3px 5px;
@@ -58,27 +71,30 @@
     background-color: var(--SmartThemeBodyColor);
 }
 
-.select2-container .select2-selection--multiple {
+.select2-container .select2-selection--multiple,
+.select2-container .select2-selection--single {
     background-color: var(--black30a);
     color: var(--SmartThemeBodyColor);
-    border: 1px solid var(--white30a);
+    border: 1px solid var(--SmartThemeBorderColor);
     border-radius: 7px;
     font-family: "Noto Sans", "Noto Color Emoji", sans-serif;
     padding: 3px 5px;
 }
 
-.select2-container.select2-container--focus .select2-selection--multiple {
-    border: 1px solid var(--white30a);
+.select2-container.select2-container--focus .select2-selection--multiple,
+.select2-container.select2-container--focus .select2-selection--single {
+    border: 1px solid var(--SmartThemeBorderColor);
 }
 
-.select2-container .select2-selection--multiple .select2-selection__choice {
+.select2-container .select2-selection--multiple .select2-selection__choice,
+.select2-container .select2-selection--single .select2-selection__choice {
     border-radius: 5px;
     border-style: solid;
     border-width: 1px;
     box-sizing: border-box;
     color: var(--SmartThemeBodyColor);
     background-color: var(--black30a);
-    border-color: var(--white30a);
+    border-color: var(--SmartThemeBorderColor);
     font-size: calc(var(--mainFontSize) - 5%);
     text-shadow: none !important;
 }
@@ -114,12 +130,13 @@
     margin-top: -7px;
     width: 14px;
     height: 14px;
-    border: 1px solid var(--white30a);
+    border: 1px solid var(--SmartThemeBorderColor);
     background-color: var(--SmartThemeBlurTintColor);
     border-radius: 2px;
 }
 
-.select2-container .select2-selection--multiple .select2-selection__choice__remove {
+.select2-container .select2-selection--multiple .select2-selection__choice__remove,
+.select2-container .select2-selection--single .select2-selection__choice__remove {
     color: var(--SmartThemeBodyColor);
 }
 

public/css/st-tailwind.css

@@ -6,6 +6,16 @@
     color: var(--fullred);
 }
 
+.highlighted {
+    color: black;
+    background-color: yellow;
+    text-shadow: none !important;
+}
+
+.m-t-0 {
+    margin-top: 0;
+}
+
 .m-t-1 {
     margin-top: 1em;
 }
@@ -52,23 +62,24 @@
 
 .margin-bot-10px,
 .marginBot10 {
-    margin-bottom: 10px;
+    margin-bottom: 10px !important;
 }
 
 .marginTop10 {
-    margin-top: 10px;
+    margin-top: 10px !important;
 }
 
 .marginBot5 {
-    margin-bottom: 5px;
+    margin-bottom: 5px !important;
 }
 
 .marginTop5 {
-    margin-top: 5px;
+    margin-top: 5px !important;
 }
 
 .marginTopBot5 {
-    margin: 5px 0;
+    margin-top: 5px !important;
+    margin-bottom: 5px !important;
 }
 
 .margin5 {
@@ -95,10 +106,22 @@
     align-items: flex-end !important;
 }
 
+.alignItemsBaseline {
+    align-items: baseline !important;
+}
+
 .alignSelfStart {
     align-self: start;
 }
 
+.gap0 {
+    gap: 0 !important;
+}
+
+.gap3px {
+    gap: 3px !important;
+}
+
 .gap5px {
     gap: 5px !important;
 }
@@ -107,6 +130,14 @@
     gap: 10px !important;
 }
 
+.gap10h20v {
+    gap: 10px 20px !important;
+}
+
+.gap10h5v {
+    gap: 5px 10px !important;
+}
+
 .wide10pMinFit {
     width: 10%;
     min-width: fit-content;
@@ -120,6 +151,10 @@
     max-width: 100px;
 }
 
+.width100px {
+    width: 100px;
+}
+
 .widthUnset {
     width: unset;
 }
@@ -132,6 +167,10 @@
     box-shadow: none !important;
 }
 
+.height100p {
+    height: 100%;
+}
+
 .height100pSpaceEvenly {
     align-content: space-evenly;
     height: 100%;
@@ -147,6 +186,10 @@
     font-weight: 600;
 }
 
+.textAlignCenter {
+    text-align: center;
+}
+
 .margin-right-10px {
     margin-right: 10px;
 }
@@ -186,6 +229,22 @@
     display: flex;
 }
 
+.flexBasis50p {
+    flex-basis: 50%
+}
+
+.flexBasis25p {
+    flex-basis: 25%
+}
+
+.flexBasis200px {
+    flex-basis: 200px
+}
+
+.flexBasis48p {
+    flex-basis: 48%
+}
+
 .flex-container {
     display: flex;
     gap: 5px;
@@ -200,6 +259,10 @@
     flex-grow: 1;
 }
 
+.flexShrink {
+    flex-shrink: 1
+}
+
 .flexnowrap {
     flex-wrap: nowrap;
 }
@@ -230,6 +293,10 @@
     overflow: hidden;
 }
 
+.padding0 {
+    padding: 0;
+}
+
 .padding5 {
     padding: 5px;
 }
@@ -262,6 +329,10 @@
     flex-flow: column;
 }
 
+.flexFlowRow {
+    flex-flow: row;
+}
+
 .wideMinContent {
     width: min-content;
 }
@@ -270,10 +341,6 @@
     flex: 50%;
 }
 
-.wide50p {
-    width: 50% !important;
-}
-
 .wide25p {
     width: 25%;
 }
@@ -357,11 +424,20 @@
     display: none;
 }
 
+.hoverglow {
+    transition: opacity 200ms;
+}
+
 .hoverglow:hover {
     opacity: 1 !important;
     cursor: pointer;
 }
 
+input:disabled,
+textarea:disabled {
+    cursor: not-allowed;
+}
+
 .debug-red {
     border: 1px solid red !important;
 }
@@ -382,6 +458,10 @@
     border: 1px solid purple !important;
 }
 
+.fontsize120p {
+    font-size: calc(var(--mainFontSize) * 1.2) !important;
+}
+
 .fontsize80p {
     font-size: calc(var(--mainFontSize) * 0.8) !important;
 }
@@ -390,6 +470,11 @@
     font-size: calc(var(--mainFontSize) * 0.6) !important;
 }
 
+.paddingBottom5px {
+    padding: unset;
+    padding-bottom: 5px;
+}
+
 .paddingTopBot5 {
     padding: 5px 0;
 }
@@ -415,6 +500,22 @@
     gap: 10px;
 }
 
+.opacity50p {
+    opacity: 0.5
+}
+
 .opacity1 {
     opacity: 1 !important;
-}
+}
+
+.circleborder30px {
+    right: 30px;
+    top: 10px;
+    position: absolute;
+    border: 1px solid var(--SmartThemeBodyColor);
+    border-radius: 100%;
+    aspect-ratio: 1 / 1;
+    height: 30px;
+    text-align: center;
+    padding: 5px;
+}

public/css/tags.css

@@ -1,3 +1,4 @@
+#bulk_tags_div,
 #tags_div {
     min-width: 0;
 }
@@ -12,7 +13,7 @@
 .tag_view_item {
     display: flex;
     flex-direction: row;
-    align-items: baseline;
+    align-items: center;
     gap: 10px;
     margin-bottom: 5px;
 }
@@ -86,10 +87,12 @@
     align-items: flex-end;
 }
 
+#bulkTagsList,
 #tagList.tags {
     margin: 5px 0;
 }
 
+#bulkTagsList,
 #tagList .tag {
     opacity: 0.6;
 }
@@ -109,6 +112,7 @@
     overflow: hidden;
     text-align: left;
     white-space: nowrap;
+    text-shadow: none !important;
 }
 
 .tags_inline .tag {
@@ -128,10 +132,16 @@
     cursor: pointer;
     opacity: 0.6;
     filter: brightness(0.8);
+    transition: opacity 200ms;
 }
 
-.tags_view,
-.open_alternate_greetings {
+.rm_tag_filter .tag:hover {
+
+    opacity: 1;
+    filter: brightness(1);
+}
+
+.tags_view {
     margin: 0;
     aspect-ratio: 1 / 1;
 }

public/css/toggle-dependent.css

@@ -28,6 +28,7 @@ body.charListGrid #rm_print_characters_block {
     align-content: flex-start;
 }
 
+body.charListGrid #rm_print_characters_block .bogus_folder_select,
 body.charListGrid #rm_print_characters_block .character_select {
     width: 30%;
     align-items: flex-start;
@@ -37,6 +38,7 @@ body.charListGrid #rm_print_characters_block .character_select {
     max-width: 100px;
 }
 
+body.charListGrid #rm_print_characters_block .bogus_folder_select .ch_name,
 body.charListGrid #rm_print_characters_block .character_select .ch_name,
 body.charListGrid #rm_print_characters_block .group_select .ch_name {
     width: 100%;
@@ -45,10 +47,12 @@ body.charListGrid #rm_print_characters_block .group_select .ch_name {
     font-size: calc(var(--mainFontSize) * .8);
 }
 
+body.charListGrid #rm_print_characters_block .bogus_folder_select .character_name_block,
 body.charListGrid #rm_print_characters_block .character_select .character_name_block {
     width: 100%;
 }
 
+body.charListGrid #rm_print_characters_block .bogus_folder_select .character_select_container,
 body.charListGrid #rm_print_characters_block .character_select .character_select_container {
     width: 100%;
     justify-content: center;
@@ -68,6 +72,7 @@ body.charListGrid #rm_print_characters_block .group_select .group_name_block {
     width: 100%;
 }
 
+body.charListGrid #rm_print_characters_block .bogus_folder_counter_block,
 body.charListGrid #rm_print_characters_block .ch_description,
 body.charListGrid #rm_print_characters_block .tags_inline,
 body.charListGrid #rm_print_characters_block .character_version,
@@ -117,7 +122,7 @@ body.big-avatars .avatar img {
     height: 90px;
     object-fit: cover;
     object-position: center;
-    border: 1px solid var(--black30a);
+    border: 1px solid var(--SmartThemeBorderColor);
     border-radius: 10px;
 }
 
@@ -191,7 +196,7 @@ body.bubblechat .mes {
     border-radius: 10px;
     background-color: var(--SmartThemeBotMesBlurTintColor);
     margin-bottom: 5px;
-    border: 1px solid var(--white30a);
+    border: 1px solid var(--SmartThemeBorderColor);
 }
 
 body.bubblechat .mes[is_user="true"] {
@@ -257,31 +262,16 @@ body.no-blur #bg_custom {
 
 }
 
-body:not(.bubblechat).no-blur #chat,
 body.no-blur #top-bar,
 body.no-blur #send_form {
     background-color: var(--SmartThemeBlurTintColor) !important;
 }
 
-body.no-blur #options,
-body.no-blur .ui-widget-content,
-body.no-blur #floatingPrompt,
-body.no-blur #extensionsMenu,
-body.no-blur .list-group,
-body.no-blur #character_popup,
-body.no-blur #world_popup,
-body.no-blur #dialogue_popup,
-body.no-blur #select_chat_popup,
-body.no-blur .drawer-content,
-body.no-blur .select2-results__options {
-    background-color: black !important;
-}
-
 /* wAIfu mode*/
 
 body.waifuMode #top-bar {
     border-radius: 0 0 20px 20px;
-    border: 1px solid var(--grey30a);
+    border: 1px solid var(--SmartThemeBorderColor);
 }
 
 body.waifuMode #sheld {
@@ -292,7 +282,7 @@ body.waifuMode #sheld {
 }
 
 body.waifuMode #chat {
-    border-top: 1px solid var(--grey30a);
+    border-top: 1px solid var(--SmartThemeBorderColor);
     border-radius: 20px 20px 0 0;
 }
 
@@ -343,8 +333,7 @@ body.movingUI .drawer-content,
 body.movingUI #expression-holder,
 body.movingUI .zoomed_avatar,
 body.movingUI .draggable,
-body.movingUI #floatingPrompt,
-body.movingUI #groupMemberListPopout {
+body.movingUI #floatingPrompt {
     resize: both;
 }
 
@@ -353,6 +342,7 @@ body.movingUI #groupMemberListPopout {
     height: 120px;
     margin-top: 0;
     top: 50px;
+    justify-content: center;
 }
 
 /*No Text Shadows Mode*/
@@ -360,3 +350,11 @@ body.movingUI #groupMemberListPopout {
 body.noShadows * {
     text-shadow: none !important;
 }
+
+body.expandMessageActions .mes .mes_buttons .extraMesButtons {
+    display: inherit !important;
+}
+
+body.expandMessageActions .mes .mes_buttons .extraMesButtonsHint {
+    display: none !important;
+}

public/css/world-info.css

@@ -101,7 +101,7 @@
     height: auto;
     margin-top: 0;
     margin-bottom: 0;
-    min-height: 32px;
+    min-height: calc(var(--mainFontSize) + 13px);
 }
 
 .delete_entry_button {
@@ -157,6 +157,37 @@
     width: 10em;
 }
 
-#world_info_search {
-    width: 10em;
+#world_info_search,
+#world_info_sort_order {
+    width: 7em;
+}
+
+.wi-card-entry {
+    border: 1px solid;
+    border-color: var(--SmartThemeBorderColor);
+    border-radius: 10px;
+    padding: 0 5px;
+    margin-bottom: 1px;
+}
+
+.world_entry {
+    transition: opacity 500ms;
+}
+
+.disabledWIEntry {
+    opacity: 0.4;
+    filter: grayscale(1);
+}
+
+.disabledWIEntry:not(input):hover {
+    opacity: 1;
+    filter: grayscale(0.5);
+}
+
+.height32px {
+    height: 32px;
+}
+
+.WIEntryHeaderTitleMobile {
+    display: none;
 }

public/img/aphrodite.svg

@@ -0,0 +1,71 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   viewBox="0 0 500 500"
+   version="1.1"
+   id="svg6"
+   sodipodi:docname="aphrodite.svg"
+   inkscape:version="1.3 (0e150ed, 2023-07-21)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs6" />
+  <sodipodi:namedview
+     id="namedview6"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:zoom="0.472"
+     inkscape:cx="251.05932"
+     inkscape:cy="250"
+     inkscape:window-width="1280"
+     inkscape:window-height="449"
+     inkscape:window-x="0"
+     inkscape:window-y="25"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg6" />
+  <g
+     transform="matrix(1.3637143,0,0,1.2306337,286.98714,309.0439)"
+     id="b08450db-4034-4e8d-9232-9d086fc10fd0" />
+  <g
+     transform="matrix(1.3637143,0,0,1.2306337,286.98714,309.0439)"
+     id="54daa6c1-4b17-4e19-b0bb-42d1bcbfe659" />
+  <g
+     transform="matrix(1.3637143,0,0,1.2306337,186.0314,431.30731)"
+     id="g2" />
+  <g
+     transform="matrix(1.3637143,0,0,1.2306337,288.29633,320.27957)"
+     id="g3" />
+  <g
+     transform="matrix(1.686936,0,0,1.507445,388.05263,106.65182)"
+     id="g6"
+     style="">
+    <g
+       id="g5"
+       style="">
+      <path
+         style="opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;"
+         vector-effect="non-scaling-stroke"
+         d="m -189.927,161.041 32.809,-32.022 47.368,38.876 -32.619,43.738 -87.665,49.304 z"
+         stroke-linecap="round"
+         id="path3" />
+      <path
+         style="opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;"
+         vector-effect="non-scaling-stroke"
+         d="m -64.913,42.392 32.651,28.068 -77.49,97.438 -47.367,-38.878 91.346,-87.359 z"
+         stroke-linecap="round"
+         id="path4" />
+      <path
+         style="opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;"
+         vector-effect="non-scaling-stroke"
+         d="m 46.895,-67.722 -2.202,2.004 -110.467,107.379 33.512,28.799 95.769,-121.944 0.023,-0.025 c 2.011,-2.328 2.952,-5.03 2.819,-8.105 -0.131,-3.074 -1.3,-5.686 -3.502,-7.834 -2.205,-2.148 -4.846,-3.248 -7.922,-3.3 -3.077,-0.054 -5.754,0.955 -8.03,3.026 z"
+         stroke-linecap="round"
+         id="path5" />
+    </g>
+  </g>
+</svg>

public/img/mancer.svg

@@ -0,0 +1,3 @@
+<svg width="128" height="128" viewBox="0 0 128 128" style="enable-background:new 0 0 128 128;" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path d="M115.36,61.84L70.22,50.49L114.45,2.4c0.41-0.45,0.43-1.13,0.05-1.6c-0.39-0.48-1.07-0.59-1.59-0.27 L12.3,61.98c-0.41,0.25-0.64,0.72-0.57,1.2c0.06,0.48,0.4,0.87,0.87,1.01l45.07,13.25L13.38,125.6c-0.42,0.46-0.44,1.15-0.04,1.61 c0.24,0.29,0.58,0.44,0.94,0.44c0.22,0,0.45-0.06,0.65-0.19l100.78-63.41c0.42-0.26,0.64-0.75,0.56-1.22 C116.19,62.34,115.84,61.95,115.36,61.84z" />
+</svg>

public/img/novel.svg

@@ -1,3 +1,3 @@
-<svg width="33" height="41" viewBox="0 0 33 41" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M5.89418 31.9285C4.51814 29.6818 2.83212 27.8112 0.836131 26.521C0.26793 26.1537 0.124452 25.3382 0.540438 24.8047C4.15593 20.1672 9.79294 8.01868 12.7415 1.40215C13.181 0.416062 14.6883 0.738582 14.6883 1.81816V19.44C13.1242 20.1331 12.0332 21.6992 12.0332 23.5201C12.0332 24.1851 12.1787 24.8161 12.4397 25.383L5.89418 31.9285ZM7.34675 34.6814C8.03773 36.2042 8.61427 37.8368 9.07635 39.5334C9.19588 39.9722 9.59101 40.2824 10.0459 40.2824H16.4937H22.9416C23.3964 40.2824 23.7916 39.9722 23.9111 39.5334C24.3732 37.8368 24.9497 36.2042 25.6407 34.6814L22.211 31.2516L19.3551 34.1075C19.4281 34.3655 19.4672 34.6378 19.4672 34.9192C19.4672 36.5615 18.1358 37.8928 16.4935 37.8928C14.8512 37.8928 13.5198 36.5615 13.5198 34.9192C13.5198 33.2768 14.8512 31.9455 16.4935 31.9455C16.7448 31.9455 16.9888 31.9766 17.2219 32.0353L20.1083 29.1489L18.4762 27.5169C17.879 27.8137 17.2058 27.9806 16.4937 27.9806C15.7816 27.9806 15.1084 27.8137 14.5112 27.5169L7.34675 34.6814ZM27.0933 31.9285C28.4693 29.6818 30.1553 27.8112 32.1513 26.521C32.7195 26.1537 32.863 25.3382 32.447 24.8047C28.8315 20.1672 23.1945 8.01868 20.2459 1.40215C19.8065 0.416062 18.2992 0.738582 18.2992 1.81816V19.44C19.8632 20.1332 20.9542 21.6992 20.9542 23.5201C20.9542 24.1851 20.8087 24.8161 20.5478 25.383L27.0933 31.9285Z" fill="white"/>
+<svg width="33" height="41" viewBox="0 0 33 41" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M5.89418 31.9285C4.51814 29.6818 2.83212 27.8112 0.836131 26.521C0.26793 26.1537 0.124452 25.3382 0.540438 24.8047C4.15593 20.1672 9.79294 8.01868 12.7415 1.40215C13.181 0.416062 14.6883 0.738582 14.6883 1.81816V19.44C13.1242 20.1331 12.0332 21.6992 12.0332 23.5201C12.0332 24.1851 12.1787 24.8161 12.4397 25.383L5.89418 31.9285ZM7.34675 34.6814C8.03773 36.2042 8.61427 37.8368 9.07635 39.5334C9.19588 39.9722 9.59101 40.2824 10.0459 40.2824H16.4937H22.9416C23.3964 40.2824 23.7916 39.9722 23.9111 39.5334C24.3732 37.8368 24.9497 36.2042 25.6407 34.6814L22.211 31.2516L19.3551 34.1075C19.4281 34.3655 19.4672 34.6378 19.4672 34.9192C19.4672 36.5615 18.1358 37.8928 16.4935 37.8928C14.8512 37.8928 13.5198 36.5615 13.5198 34.9192C13.5198 33.2768 14.8512 31.9455 16.4935 31.9455C16.7448 31.9455 16.9888 31.9766 17.2219 32.0353L20.1083 29.1489L18.4762 27.5169C17.879 27.8137 17.2058 27.9806 16.4937 27.9806C15.7816 27.9806 15.1084 27.8137 14.5112 27.5169L7.34675 34.6814ZM27.0933 31.9285C28.4693 29.6818 30.1553 27.8112 32.1513 26.521C32.7195 26.1537 32.863 25.3382 32.447 24.8047C28.8315 20.1672 23.1945 8.01868 20.2459 1.40215C19.8065 0.416062 18.2992 0.738582 18.2992 1.81816V19.44C19.8632 20.1332 20.9542 21.6992 20.9542 23.5201C20.9542 24.1851 20.8087 24.8161 20.5478 25.383L27.0933 31.9285Z" />
 </svg>

public/img/palm.svg

@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 27.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Standard_product_icon__x28_1:1_x29_"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="192px" height="192px" viewBox="0 0 192 192" enable-background="new 0 0 192 192" xml:space="preserve">
+    <symbol id="material_x5F_product_x5F_standard_x5F_icon_x5F_keylines_00000077318920148093339210000006245950728745084294_" viewBox="-96 -96 192 192">
+        <g opacity="0.4">
+            <defs>
+                <path id="SVGID_1_" opacity="0.4" d="M-96,96V-96H96V96H-96z"/>
+            </defs>
+            <clipPath id="SVGID_00000071517564283228984050000017848131202901217410_">
+                <use xlink:href="#SVGID_1_" overflow="visible"/>
+            </clipPath>
+            <g clip-path="url(#SVGID_00000071517564283228984050000017848131202901217410_)">
+                <g>
+                    <path d="M95.75,95.75v-191.5h-191.5v191.5H95.75 M96,96H-96V-96H96V96L96,96z"/>
+                </g>
+                <circle fill="none" stroke="#000000" stroke-width="0.25" stroke-miterlimit="10" cx="0" cy="0" r="64"/>
+            </g>
+
+            <circle clip-path="url(#SVGID_00000071517564283228984050000017848131202901217410_)" fill="none" stroke="#000000" stroke-width="0.25" stroke-miterlimit="10" cx="0" cy="0" r="88"/>
+
+            <path clip-path="url(#SVGID_00000071517564283228984050000017848131202901217410_)" fill="none" stroke="#000000" stroke-width="0.25" stroke-miterlimit="10" d="
+			M64,76H-64c-6.6,0-12-5.4-12-12V-64c0-6.6,5.4-12,12-12H64c6.6,0,12,5.4,12,12V64C76,70.6,70.6,76,64,76z"/>
+
+            <path clip-path="url(#SVGID_00000071517564283228984050000017848131202901217410_)" fill="none" stroke="#000000" stroke-width="0.25" stroke-miterlimit="10" d="
+			M52,88H-52c-6.6,0-12-5.4-12-12V-76c0-6.6,5.4-12,12-12H52c6.6,0,12,5.4,12,12V76C64,82.6,58.6,88,52,88z"/>
+
+            <path clip-path="url(#SVGID_00000071517564283228984050000017848131202901217410_)" fill="none" stroke="#000000" stroke-width="0.25" stroke-miterlimit="10" d="
+			M76,64H-76c-6.6,0-12-5.4-12-12V-52c0-6.6,5.4-12,12-12H76c6.6,0,12,5.4,12,12V52C88,58.6,82.6,64,76,64z"/>
+        </g>
+    </symbol>
+    <rect id="bounding_box_1_" display="none" fill="none" width="192" height="192"/>
+    <g id="art_layer">
+        <g>
+            <path d="M96,181.92L96,181.92c6.63,0,12-5.37,12-12v-104H84v104C84,176.55,89.37,181.92,96,181.92z"/>
+            <g>
+                <path d="M143.81,103.87C130.87,90.94,111.54,88.32,96,96l51.37,51.37c2.12,2.12,5.77,1.28,6.67-1.57
+				C158.56,131.49,155.15,115.22,143.81,103.87z"/>
+            </g>
+            <g>
+                <path d="M48.19,103.87C61.13,90.94,80.46,88.32,96,96l-51.37,51.37c-2.12,2.12-5.77,1.28-6.67-1.57
+				C33.44,131.49,36.85,115.22,48.19,103.87z"/>
+            </g>
+            <g>
+                <path d="M140,64c-20.44,0-37.79,13.4-44,32h81.24c3.33,0,5.55-3.52,4.04-6.49C173.56,74.36,157.98,64,140,64z"/>
+            </g>
+            <g>
+                <path d="M104.49,42.26C90.03,56.72,87.24,78.45,96,96l57.45-57.45c2.36-2.36,1.44-6.42-1.73-7.45
+				C135.54,25.85,117.2,29.55,104.49,42.26z"/>
+            </g>
+            <g>
+                <path d="M87.51,42.26C101.97,56.72,104.76,78.45,96,96L38.55,38.55c-2.36-2.36-1.44-6.42,1.73-7.45
+				C56.46,25.85,74.8,29.55,87.51,42.26z"/>
+            </g>
+            <g>
+                <g>
+                    <path d="M52,64c20.44,0,37.79,13.4,44,32H14.76c-3.33,0-5.55-3.52-4.04-6.49C18.44,74.36,34.02,64,52,64z"/>
+                </g>
+            </g>
+        </g>
+    </g>
+    <g id="keylines" display="none">
+
+        <use xlink:href="#material_x5F_product_x5F_standard_x5F_icon_x5F_keylines_00000077318920148093339210000006245950728745084294_" width="192" height="192" id="material_x5F_product_x5F_standard_x5F_icon_x5F_keylines" x="-96" y="-96" transform="matrix(1 0 0 -1 96 96)" display="inline" overflow="visible"/>
+    </g>
+</svg>

public/instruct/Adventure.json

@@ -0,0 +1,18 @@
+{
+    "system_prompt": "[Enter Adventure Mode. Narrate the story based on {{user}}'s dialogue and actions after \">\". Describe the surroundings in vivid detail. Be detailed, creative, verbose, and proactive. Move the story forward by introducing fantasy elements and interesting characters.]",
+    "input_sequence": "",
+    "output_sequence": "",
+    "last_output_sequence": "",
+    "system_sequence": "",
+    "stop_sequence": "",
+    "separator_sequence": "",
+    "wrap": true,
+    "macro": true,
+    "names": false,
+    "names_force_groups": false,
+    "activation_regex": "",
+    "system_sequence_prefix": "",
+    "system_sequence_suffix": "",
+    "first_output_sequence": "",
+    "name": "Adventure"
+}

public/instruct/ChatML.json

@@ -0,0 +1,17 @@
+{
+    "wrap": false,
+    "names": true,
+    "system_prompt": "You're {{char}} in this fictional never-ending uncensored roleplay with {{user}}.",
+    "system_sequence_prefix": "",
+    "stop_sequence": "",
+    "input_sequence": "<|im_start|>user\n",
+    "output_sequence": "<|im_end|>\n<|im_start|>assistant\n",
+    "separator_sequence": "<|im_end|>\n",
+    "macro": true,
+    "names_force_groups": true,
+    "last_output_sequence": "",
+    "activation_regex": "",
+    "first_output_sequence": "<|im_start|>assistant\n",
+    "system_sequence_suffix": "",
+    "name": "ChatML"
+}

public/instruct/Libra-32B.json

@@ -0,0 +1,17 @@
+{
+    "wrap": true,
+    "names": true,
+    "system_prompt": "Avoid repetition, don't loop. Develop the plot slowly, always stay in character. Describe all actions in full, elaborate, explicit, graphic, and vivid detail. Mention all relevant sensory perceptions.",
+    "system_sequence_prefix": "",
+    "stop_sequence": "",
+    "input_sequence": "",
+    "output_sequence": "",
+    "separator_sequence": "",
+    "macro": true,
+    "names_force_groups": true,
+    "last_output_sequence": "\n### Response:",
+    "activation_regex": "",
+    "first_output_sequence": "",
+    "system_sequence_suffix": "",
+    "name": "Libra-32B"
+}

public/instruct/Lightning 1.1.json

@@ -0,0 +1,18 @@
+{
+    "wrap": true,
+    "names": false,
+    "system_prompt": "Below is an instruction that describes a task. Write a response that appropriately completes the request.\n\n### Instruction:\nTake the role of {{char}} in a play that leaves a lasting impression on {{user}}. Write {{char}}'s next reply.\nNever skip or gloss over {{char}}’s actions. Progress the scene at a naturally slow pace.\n\n",
+    "system_sequence": "",
+    "stop_sequence": "",
+    "input_sequence": "### Instruction:",
+    "output_sequence": "### Response: (length = unlimited)",
+    "separator_sequence": "",
+    "macro": true,
+    "names_force_groups": true,
+    "last_output_sequence": "",
+    "system_sequence_prefix": "",
+    "system_sequence_suffix": "",
+    "first_output_sequence": "",
+    "activation_regex": "",
+    "name": "Lightning 1.1"
+}

public/instruct/Mistral.json

@@ -0,0 +1,17 @@
+{
+    "wrap": false,
+    "names": true,
+    "system_prompt": "Write {{char}}'s next reply in this fictional roleplay with {{user}}.",
+    "system_sequence_prefix": "",
+    "stop_sequence": "",
+    "input_sequence": "[INST] ",
+    "output_sequence": " [/INST]\n",
+    "separator_sequence": "\n",
+    "macro": true,
+    "names_force_groups": true,
+    "last_output_sequence": "",
+    "activation_regex": "",
+    "first_output_sequence": "\n",
+    "system_sequence_suffix": "",
+    "name": "Mistral"
+}

public/instruct/Pygmalion.json

@@ -0,0 +1,17 @@
+{
+    "name": "Pygmalion",
+    "system_prompt": "Enter RP mode. You shall reply to {{user}} while staying in character. Your responses must be detailed, creative, immersive, and drive the scenario forward. You will follow {{char}}'s persona.",
+    "input_sequence": "<|user|>",
+    "output_sequence": "<|model|>",
+    "first_output_sequence": "",
+    "last_output_sequence": "",
+    "system_sequence_prefix": "<|system|>",
+    "system_sequence_suffix": "",
+    "stop_sequence": "<|user|>",
+    "separator_sequence": "",
+    "wrap": false,
+    "macro": true,
+    "names": true,
+    "names_force_groups": true,
+    "activation_regex": ""
+}

public/instruct/Story.json

@@ -0,0 +1,18 @@
+{
+    "system_prompt": "",
+    "input_sequence": "",
+    "output_sequence": "",
+    "last_output_sequence": "",
+    "system_sequence": "",
+    "stop_sequence": "",
+    "separator_sequence": "",
+    "wrap": true,
+    "macro": true,
+    "names": false,
+    "names_force_groups": false,
+    "activation_regex": "",
+    "system_sequence_prefix": "",
+    "system_sequence_suffix": "",
+    "first_output_sequence": "",
+    "name": "Story"
+}

public/instruct/Synthia.json

@@ -0,0 +1,17 @@
+{
+    "wrap": false,
+    "names": false,
+    "system_prompt": "Elaborate on the topic using a Tree of Thoughts and backtrack when necessary to construct a clear, cohesive Chain of Thought reasoning. Always answer without hesitation.",
+    "system_sequence_prefix": "SYSTEM: ",
+    "stop_sequence": "",
+    "input_sequence": "USER: ",
+    "output_sequence": "\nASSISTANT: ",
+    "separator_sequence": "\n",
+    "macro": true,
+    "names_force_groups": true,
+    "last_output_sequence": "",
+    "activation_regex": "",
+    "first_output_sequence": "ASSISTANT: ",
+    "system_sequence_suffix": "",
+    "name": "Synthia"
+}

public/lib/select2-search-placeholder.js

@@ -0,0 +1,25 @@
+(function($) {
+
+    var Defaults = $.fn.select2.amd.require('select2/defaults');
+
+    $.extend(Defaults.defaults, {
+        searchInputPlaceholder: '',
+        searchInputCssClass: '',
+    });
+
+    var SearchDropdown = $.fn.select2.amd.require('select2/dropdown/search');
+
+    var _renderSearchDropdown = SearchDropdown.prototype.render;
+
+    SearchDropdown.prototype.render = function(decorated) {
+
+        // invoke parent method
+        var $rendered = _renderSearchDropdown.apply(this, Array.prototype.slice.apply(arguments));
+
+        this.$search.attr('placeholder', this.options.get('searchInputPlaceholder'));
+        this.$search.addClass(this.options.get('searchInputCssClass'));
+
+        return $rendered;
+    };
+
+})(window.jQuery);

public/scripts/BulkEditOverlay.js

@@ -0,0 +1,648 @@
+"use strict";
+
+import {
+    callPopup,
+    characters,
+    deleteCharacter,
+    event_types,
+    eventSource,
+    getCharacters,
+    getRequestHeaders,
+    printCharacters,
+    this_chid
+} from "../script.js";
+
+import { favsToHotswap } from "./RossAscends-mods.js";
+import { convertCharacterToPersona } from "./personas.js";
+import { createTagInput, getTagKeyForCharacter, tag_map } from "./tags.js";
+
+// Utility object for popup messages.
+const popupMessage = {
+    deleteChat(characterCount) {
+        return `<h3>Delete ${characterCount} characters?</h3>
+                <b>THIS IS PERMANENT!<br><br>
+                <label for="del_char_checkbox" class="checkbox_label justifyCenter">
+                    <input type="checkbox" id="del_char_checkbox" />
+                    <span>Also delete the chat files</span>
+                </label><br></b>`;
+    },
+}
+
+/**
+ * Static object representing the actions of the
+ * character context menu override.
+ */
+class CharacterContextMenu {
+    /**
+     * Tag one or more characters,
+     * opens a popup.
+     *
+     * @param selectedCharacters
+     */
+    static tag = (selectedCharacters) => {
+        BulkTagPopupHandler.show(selectedCharacters);
+    }
+
+    /**
+     * Duplicate one or more characters
+     *
+     * @param characterId
+     * @returns {Promise<Response>}
+     */
+    static duplicate = async (characterId) => {
+        const character = CharacterContextMenu.#getCharacter(characterId);
+
+        return fetch('/dupecharacter', {
+            method: 'POST',
+            headers: getRequestHeaders(),
+            body: JSON.stringify({ avatar_url: character.avatar }),
+        });
+    }
+
+    /**
+     * Favorite a character
+     * and highlight it.
+     *
+     * @param characterId
+     * @returns {Promise<void>}
+     */
+    static favorite = async (characterId) => {
+        const character = CharacterContextMenu.#getCharacter(characterId);
+
+        // Only set fav for V2 spec
+        const data = {
+            name: character.name,
+            avatar: character.avatar,
+            data: {
+                extensions: {
+                    fav: !character.data.extensions.fav
+                }
+            }
+        };
+
+        return fetch('/v2/editcharacterattribute', {
+            method: "POST",
+            headers: getRequestHeaders(),
+            body: JSON.stringify(data),
+        }).then((response) => {
+            if (response.ok) {
+                const element = document.getElementById(`CharID${characterId}`);
+                element.classList.toggle('is_fav');
+            } else {
+                response.json().then(json => toastr.error('Character not saved. Error: ' + json.message + '. Field: ' + json.error));
+            }
+        });
+    }
+
+    /**
+     * Convert one or more characters to persona,
+     * may open a popup for one or more characters.
+     *
+     * @param characterId
+     * @returns {Promise<void>}
+     */
+    static persona = async (characterId) => await convertCharacterToPersona(characterId);
+
+    /**
+     * Delete one or more characters,
+     * opens a popup.
+     *
+     * @param characterId
+     * @param deleteChats
+     * @returns {Promise<void>}
+     */
+    static delete = async (characterId, deleteChats = false) => {
+        const character = CharacterContextMenu.#getCharacter(characterId);
+
+        return fetch('/deletecharacter', {
+            method: 'POST',
+            headers: getRequestHeaders(),
+            body: JSON.stringify({ avatar_url: character.avatar, delete_chats: deleteChats }),
+            cache: 'no-cache',
+        }).then(response => {
+            if (response.ok) {
+                deleteCharacter(character.name, character.avatar).then(() => {
+                    if (deleteChats) {
+                        fetch("/getallchatsofcharacter", {
+                            method: 'POST',
+                            body: JSON.stringify({ avatar_url: character.avatar }),
+                            headers: getRequestHeaders(),
+                        }).then((response) => {
+                            let data = response.json();
+                            data = Object.values(data);
+                            const pastChats = data.sort((a, b) => a["file_name"].localeCompare(b["file_name"])).reverse();
+
+                            for (const chat of pastChats) {
+                                const name = chat.file_name.replace('.jsonl', '');
+                                eventSource.emit(event_types.CHAT_DELETED, name);
+                            }
+                        });
+                    }
+                })
+            }
+
+            eventSource.emit('characterDeleted', { id: this_chid, character: characters[this_chid] });
+        });
+    }
+
+    static #getCharacter = (characterId) => characters[characterId] ?? null;
+
+    /**
+     * Show the context menu at the given position
+     *
+     * @param positionX
+     * @param positionY
+     */
+    static show = (positionX, positionY) => {
+        let contextMenu = document.getElementById(BulkEditOverlay.contextMenuId);
+        contextMenu.style.left = `${positionX}px`;
+        contextMenu.style.top = `${positionY}px`;
+
+        document.getElementById(BulkEditOverlay.contextMenuId).classList.remove('hidden');
+
+        // Adjust position if context menu is outside of viewport
+        const boundingRect = contextMenu.getBoundingClientRect();
+        if (boundingRect.right > window.innerWidth) {
+            contextMenu.style.left = `${positionX - (boundingRect.right - window.innerWidth)}px`;
+        }
+        if (boundingRect.bottom > window.innerHeight) {
+            contextMenu.style.top = `${positionY - (boundingRect.bottom - window.innerHeight)}px`;
+        }
+    }
+
+    /**
+     * Hide the context menu
+     */
+    static hide = () => document.getElementById(BulkEditOverlay.contextMenuId).classList.add('hidden');
+
+    /**
+     * Sets up the context menu for the given overlay
+     *
+     * @param characterGroupOverlay
+     */
+    constructor(characterGroupOverlay) {
+        const contextMenuItems = [
+            { id: 'character_context_menu_favorite', callback: characterGroupOverlay.handleContextMenuFavorite },
+            { id: 'character_context_menu_duplicate', callback: characterGroupOverlay.handleContextMenuDuplicate },
+            { id: 'character_context_menu_delete', callback: characterGroupOverlay.handleContextMenuDelete },
+            { id: 'character_context_menu_persona', callback: characterGroupOverlay.handleContextMenuPersona },
+            { id: 'character_context_menu_tag', callback: characterGroupOverlay.handleContextMenuTag }
+        ];
+
+        contextMenuItems.forEach(contextMenuItem => document.getElementById(contextMenuItem.id).addEventListener('click', contextMenuItem.callback))
+    }
+}
+
+/**
+ * Represents a tag control not bound to a single character
+ */
+class BulkTagPopupHandler {
+    static #getHtml = (characterIds) => {
+        const characterData = JSON.stringify({ characterIds: characterIds });
+        return `<div id="bulk_tag_shadow_popup">
+            <div id="bulk_tag_popup">
+                <div id="bulk_tag_popup_holder">
+                <h3 class="m-b-1">Add tags to ${characterIds.length} characters</h3>
+                <br>
+                    <div id="bulk_tags_div" class="marginBot5" data-characters='${characterData}'>
+                        <div class="tag_controls">
+                            <input id="bulkTagInput" class="text_pole tag_input wide100p margin0" data-i18n="[placeholder]Search / Create Tags" placeholder="Search / Create tags" maxlength="25" />
+                            <div class="tags_view menu_button fa-solid fa-tags" title="View all tags" data-i18n="[title]View all tags"></div>
+                        </div>
+                        <div id="bulkTagList" class="m-t-1 tags"></div>
+                    </div>
+                    <div id="dialogue_popup_controls" class="m-t-1">
+                        <div id="bulk_tag_popup_cancel" class="menu_button" data-i18n="Cancel">Close</div>
+                        <div id="bulk_tag_popup_reset" class="menu_button" data-i18n="Cancel">Remove all</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    `
+    };
+
+    /**
+     * Append and show the tag control
+     *
+     * @param characters - The characters assigned to this control
+     */
+    static show(characters) {
+        document.body.insertAdjacentHTML('beforeend', this.#getHtml(characters));
+        createTagInput('#bulkTagInput', '#bulkTagList');
+        document.querySelector('#bulk_tag_popup_cancel').addEventListener('click', this.hide.bind(this));
+        document.querySelector('#bulk_tag_popup_reset').addEventListener('click', this.resetTags.bind(this, characters));
+    }
+
+    /**
+     * Hide and remove the tag control
+     */
+    static hide() {
+        let popupElement = document.querySelector('#bulk_tag_shadow_popup');
+        if (popupElement) {
+            document.body.removeChild(popupElement);
+        }
+
+        printCharacters(true);
+    }
+
+    /**
+     * Empty the tag map for the given characters
+     *
+     * @param characterIds
+     */
+    static resetTags(characterIds) {
+        characterIds.forEach((characterId) => {
+            const key = getTagKeyForCharacter(characterId);
+            if (key) tag_map[key] = [];
+        });
+
+        printCharacters(true);
+    }
+}
+
+class BulkEditOverlayState {
+    /**
+     *
+     * @type {number}
+     */
+    static browse = 0;
+
+    /**
+     *
+     * @type {number}
+     */
+    static select = 1;
+}
+
+/**
+ * Implement a SingletonPattern, allowing access to the group overlay instance
+ * from everywhere via (new CharacterGroupOverlay())
+ *
+ * @type BulkEditOverlay
+ */
+let bulkEditOverlayInstance = null;
+
+class BulkEditOverlay {
+    static containerId = 'rm_print_characters_block';
+    static contextMenuId = 'character_context_menu';
+    static characterClass = 'character_select';
+    static groupClass = 'group_select';
+    static bogusFolderClass = 'bogus_folder_select';
+    static selectModeClass = 'group_overlay_mode_select';
+    static selectedClass = 'character_selected';
+    static legacySelectedClass = 'bulk_select_checkbox';
+
+    static longPressDelay = 2500;
+
+    #state = BulkEditOverlayState.browse;
+    #longPress = false;
+    #stateChangeCallbacks = [];
+    #selectedCharacters = [];
+
+    /**
+     * Locks other pointer actions when the context menu is open
+     *
+     * @type {boolean}
+     */
+    #contextMenuOpen = false;
+
+    /**
+     * Whether the next character select should be skipped
+     *
+     * @type {boolean}
+     */
+    #cancelNextToggle = false;
+
+    /**
+     * @type HTMLElement
+     */
+    container = null;
+
+    get state() {
+        return this.#state;
+    }
+
+    set state(newState) {
+        if (this.#state === newState) return;
+
+        eventSource.emit(event_types.CHARACTER_GROUP_OVERLAY_STATE_CHANGE_BEFORE, newState)
+            .then(() => {
+                this.#state = newState;
+                eventSource.emit(event_types.CHARACTER_GROUP_OVERLAY_STATE_CHANGE_AFTER, this.state)
+            });
+    }
+
+    get isLongPress() {
+        return this.#longPress;
+    }
+
+    set isLongPress(longPress) {
+        this.#longPress = longPress;
+    }
+
+    get stateChangeCallbacks() {
+        return this.#stateChangeCallbacks;
+    }
+
+    /**
+     *
+     * @returns {*[]}
+     */
+    get selectedCharacters() {
+        return this.#selectedCharacters;
+    }
+
+    constructor() {
+        if (bulkEditOverlayInstance instanceof BulkEditOverlay)
+            return bulkEditOverlayInstance
+
+        this.container = document.getElementById(BulkEditOverlay.containerId);
+
+        eventSource.on(event_types.CHARACTER_GROUP_OVERLAY_STATE_CHANGE_AFTER, this.handleStateChange);
+        bulkEditOverlayInstance = Object.freeze(this);
+    }
+
+    /**
+     * Set the overlay to browse mode
+     */
+    browseState = () => this.state = BulkEditOverlayState.browse;
+
+    /**
+     * Set the overlay to select mode
+     */
+    selectState = () => this.state = BulkEditOverlayState.select;
+
+    /**
+     * Set up a Sortable grid for the loaded page
+     */
+    onPageLoad = () => {
+        this.browseState();
+
+        const elements = this.#getEnabledElements();
+        elements.forEach(element => element.addEventListener('touchstart', this.handleHold));
+        elements.forEach(element => element.addEventListener('mousedown', this.handleHold));
+        elements.forEach(element => element.addEventListener('contextmenu', this.handleDefaultContextMenu));
+
+        elements.forEach(element => element.addEventListener('touchend', this.handleLongPressEnd));
+        elements.forEach(element => element.addEventListener('mouseup', this.handleLongPressEnd));
+        elements.forEach(element => element.addEventListener('dragend', this.handleLongPressEnd));
+        elements.forEach(element => element.addEventListener('touchmove', this.handleLongPressEnd));
+
+        // Cohee: It only triggers when clicking on a margin between the elements?
+        // Feel free to fix or remove this, I'm not sure how to.
+        //this.container.addEventListener('click', this.handleCancelClick);
+    }
+
+    /**
+     * Handle state changes
+     *
+     *
+     */
+    handleStateChange = () => {
+        switch (this.state) {
+            case BulkEditOverlayState.browse:
+                this.container.classList.remove(BulkEditOverlay.selectModeClass);
+                this.#contextMenuOpen = false;
+                this.#enableClickEventsForCharacters();
+                this.#enableClickEventsForGroups();
+                this.clearSelectedCharacters();
+                this.disableContextMenu();
+                this.#disableBulkEditButtonHighlight();
+                CharacterContextMenu.hide();
+                break;
+            case BulkEditOverlayState.select:
+                this.container.classList.add(BulkEditOverlay.selectModeClass);
+                this.#disableClickEventsForCharacters();
+                this.#disableClickEventsForGroups();
+                this.enableContextMenu();
+                this.#enableBulkEditButtonHighlight();
+                break;
+        }
+
+        this.stateChangeCallbacks.forEach(callback => callback(this.state));
+    }
+
+    /**
+     * Block the browsers native context menu and
+     * set a click event to hide the custom context menu.
+     */
+    enableContextMenu = () => {
+        this.container.addEventListener('contextmenu', this.handleContextMenuShow);
+        document.addEventListener('click', this.handleContextMenuHide);
+    }
+
+    /**
+     * Remove event listeners, allowing the native browser context
+     * menu to be opened.
+     */
+    disableContextMenu = () => {
+        this.container.removeEventListener('contextmenu', this.handleContextMenuShow);
+        document.removeEventListener('click', this.handleContextMenuHide);
+    }
+
+    handleDefaultContextMenu = (event) => {
+        if (this.isLongPress) {
+            event.preventDefault();
+            event.stopPropagation();
+            return false;
+        }
+    }
+
+    /**
+     * Opens menu on long-press.
+     *
+     * @param event - Pointer event
+     */
+    handleHold = (event) => {
+        if (0 !== event.button && event.type !== 'touchstart') return;
+        if (this.#contextMenuOpen) {
+            this.#contextMenuOpen = false;
+            this.#cancelNextToggle = true;
+            CharacterContextMenu.hide();
+            return;
+        }
+
+        let cancel = false;
+
+        const cancelHold = (event) => cancel = true;
+        this.container.addEventListener('mouseup', cancelHold);
+        this.container.addEventListener('touchend', cancelHold);
+
+        this.isLongPress = true;
+
+        setTimeout(() => {
+                if (this.isLongPress && !cancel) {
+                    if (this.state === BulkEditOverlayState.browse) {
+                        this.selectState();
+                    } else if (this.state === BulkEditOverlayState.select) {
+                        this.#contextMenuOpen = true;
+                        CharacterContextMenu.show(...this.#getContextMenuPosition(event));
+                    }
+                }
+
+                this.container.removeEventListener('mouseup', cancelHold);
+                this.container.removeEventListener('touchend', cancelHold);
+            },
+            BulkEditOverlay.longPressDelay);
+    }
+
+    handleLongPressEnd = (event) => {
+        this.isLongPress = false;
+        if (this.#contextMenuOpen) event.stopPropagation();
+    }
+
+    handleCancelClick = () => {
+        if (false === this.#contextMenuOpen) this.state = BulkEditOverlayState.browse;
+        this.#contextMenuOpen = false;
+    }
+
+    /**
+     * Returns the position of the mouse/touch location
+     *
+     * @param event
+     * @returns {(boolean|number|*)[]}
+     */
+    #getContextMenuPosition = (event) => [
+        event.clientX || event.touches[0].clientX,
+        event.clientY || event.touches[0].clientY,
+    ];
+
+    #stopEventPropagation = (event) => {
+        if (this.#contextMenuOpen) {
+            this.handleContextMenuHide(event);
+        }
+        event.stopPropagation();
+    }
+
+    #enableClickEventsForGroups = () => this.#getDisabledElements().forEach((element) => element.removeEventListener('click', this.#stopEventPropagation));
+
+    #disableClickEventsForGroups = () => this.#getDisabledElements().forEach((element) => element.addEventListener('click', this.#stopEventPropagation));
+
+    #enableClickEventsForCharacters = () => this.#getEnabledElements().forEach(element => element.removeEventListener('click', this.toggleCharacterSelected));
+
+    #disableClickEventsForCharacters = () => this.#getEnabledElements().forEach(element => element.addEventListener('click', this.toggleCharacterSelected));
+
+    #enableBulkEditButtonHighlight = () => document.getElementById('bulkEditButton').classList.add('bulk_edit_overlay_active');
+
+    #disableBulkEditButtonHighlight = () => document.getElementById('bulkEditButton').classList.remove('bulk_edit_overlay_active');
+
+    #getEnabledElements = () => [...this.container.getElementsByClassName(BulkEditOverlay.characterClass)];
+
+    #getDisabledElements = () =>[...this.container.getElementsByClassName(BulkEditOverlay.groupClass), ...this.container.getElementsByClassName(BulkEditOverlay.bogusFolderClass)];
+
+    toggleCharacterSelected = event => {
+        event.stopPropagation();
+
+        const character = event.currentTarget;
+        const characterId = character.getAttribute('chid');
+
+        const alreadySelected = this.selectedCharacters.includes(characterId)
+
+        const legacyBulkEditCheckbox = character.querySelector('.' + BulkEditOverlay.legacySelectedClass);
+
+        // Only toggle when context menu is closed and wasn't just closed.
+        if (!this.#contextMenuOpen && !this.#cancelNextToggle)
+            if (alreadySelected) {
+                character.classList.remove(BulkEditOverlay.selectedClass);
+                if (legacyBulkEditCheckbox) legacyBulkEditCheckbox.checked = false;
+                this.dismissCharacter(characterId);
+            } else {
+                character.classList.add(BulkEditOverlay.selectedClass)
+                if (legacyBulkEditCheckbox) legacyBulkEditCheckbox.checked = true;
+                this.selectCharacter(characterId);
+            }
+
+        this.#cancelNextToggle = false;
+    }
+
+    handleContextMenuShow = (event) => {
+        event.preventDefault();
+        CharacterContextMenu.show(...this.#getContextMenuPosition(event));
+        this.#contextMenuOpen = true;
+    }
+
+    handleContextMenuHide = (event) => {
+        let contextMenu = document.getElementById(BulkEditOverlay.contextMenuId);
+        if (false === contextMenu.contains(event.target)) {
+            CharacterContextMenu.hide();
+        }
+    }
+
+    /**
+     * Concurrently handle character favorite requests.
+     *
+     * @returns {Promise<number>}
+     */
+    handleContextMenuFavorite = () => Promise.all(this.selectedCharacters.map(async characterId => CharacterContextMenu.favorite(characterId)))
+        .then(() => getCharacters())
+        .then(() => favsToHotswap())
+        .then(() => this.browseState())
+
+    /**
+     * Concurrently handle character duplicate requests.
+     *
+     * @returns {Promise<number>}
+     */
+    handleContextMenuDuplicate = () => Promise.all(this.selectedCharacters.map(async characterId => CharacterContextMenu.duplicate(characterId)))
+        .then(() => getCharacters())
+        .then(() => this.browseState())
+
+    /**
+     * Sequentially handle all character-to-persona conversions.
+     *
+     * @returns {Promise<void>}
+     */
+    handleContextMenuPersona = async () => {
+        for (const characterId of this.selectedCharacters) {
+            await CharacterContextMenu.persona(characterId)
+        }
+
+        this.browseState();
+    }
+
+    /**
+     * Request user input before concurrently handle deletion
+     * requests.
+     *
+     * @returns {Promise<number>}
+     */
+    handleContextMenuDelete = () => {
+        callPopup(
+            popupMessage.deleteChat(this.selectedCharacters.length), null)
+            .then((accept) => {
+                if (true !== accept) return;
+
+                const deleteChats = document.getElementById('del_char_checkbox').checked ?? false;
+
+                Promise.all(this.selectedCharacters.map(async characterId => CharacterContextMenu.delete(characterId, deleteChats)))
+                    .then(() => getCharacters())
+                    .then(() => this.browseState())
+            }
+            );
+    }
+
+    /**
+     * Attaches and opens the tag menu
+     */
+    handleContextMenuTag = () => {
+        CharacterContextMenu.tag(this.selectedCharacters);
+    }
+
+    addStateChangeCallback = callback => this.stateChangeCallbacks.push(callback);
+
+    selectCharacter = characterId => this.selectedCharacters.push(String(characterId));
+
+    dismissCharacter = characterId => this.#selectedCharacters = this.selectedCharacters.filter(item => String(characterId) !== item);
+
+    /**
+     * Clears internal character storage and
+     * removes visual highlight.
+     */
+    clearSelectedCharacters = () => {
+        document.querySelectorAll('#' + BulkEditOverlay.containerId + ' .' + BulkEditOverlay.selectedClass)
+            .forEach(element => element.classList.remove(BulkEditOverlay.selectedClass));
+        this.selectedCharacters.length = 0;
+    }
+}
+
+export { BulkEditOverlayState, CharacterContextMenu, BulkEditOverlay };

public/scripts/PromptManager.js

@@ -2,7 +2,7 @@
 
 import { callPopup, event_types, eventSource, is_send_press, main_api, substituteParams } from "../script.js";
 import { is_group_generating } from "./group-chats.js";
-import { TokenHandler } from "./openai.js";
+import { Message, TokenHandler } from "./openai.js";
 import { power_user } from "./power-user.js";
 import { debounce, waitUntilCondition, escapeHtml } from "./utils.js";
 
@@ -21,6 +21,16 @@ function debouncePromise(func, delay) {
     };
 }
 
+const DEFAULT_DEPTH = 4;
+
+/**
+ * @enum {number}
+ */
+export const INJECTION_POSITION = {
+    RELATIVE: 0,
+    ABSOLUTE: 1,
+}
+
 /**
  * Register migrations for the prompt manager when settings are loaded or an Open AI preset is loaded.
  */
@@ -60,7 +70,7 @@ const registerPromptManagerMigration = () => {
  * Represents a prompt.
  */
 class Prompt {
-    identifier; role; content; name; system_prompt;
+    identifier; role; content; name; system_prompt; position; injection_position; injection_depth;
 
     /**
      * Create a new Prompt instance.
@@ -71,13 +81,19 @@ class Prompt {
      * @param {string} param0.content - The content of the prompt.
      * @param {string} param0.name - The name of the prompt.
      * @param {boolean} param0.system_prompt - Indicates if the prompt is a system prompt.
+     * @param {string} param0.position - The position of the prompt in the prompt list.
+     * @param {number} param0.injection_position - The insert position of the prompt.
+     * @param {number} param0.injection_depth - The depth of the prompt in the chat.
      */
-    constructor({ identifier, role, content, name, system_prompt } = {}) {
+    constructor({ identifier, role, content, name, system_prompt, position, injection_depth, injection_position } = {}) {
         this.identifier = identifier;
         this.role = role;
         this.content = content;
         this.name = name;
         this.system_prompt = system_prompt;
+        this.position = position;
+        this.injection_depth = injection_depth;
+        this.injection_position = injection_position;
     }
 }
 
@@ -273,7 +289,7 @@ PromptManagerModule.prototype.init = function (moduleConfiguration, serviceSetti
     this.serviceSettings = serviceSettings;
     this.containerElement = document.getElementById(this.configuration.containerIdentifier);
 
-    if ('global' === this.configuration.promptOrder.strategy) this.activeCharacter = {id: this.configuration.promptOrder.dummyId};
+    if ('global' === this.configuration.promptOrder.strategy) this.activeCharacter = { id: this.configuration.promptOrder.dummyId };
 
     this.sanitizeServiceSettings();
 
@@ -379,6 +395,9 @@ PromptManagerModule.prototype.init = function (moduleConfiguration, serviceSetti
         document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_name').value = prompt.name;
         document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_role').value = 'system';
         document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_prompt').value = prompt.content;
+        document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_injection_position').value = prompt.injection_position ?? 0;
+        document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_injection_depth').value = prompt.injection_depth ?? DEFAULT_DEPTH;
+        document.getElementById(this.configuration.prefix + 'prompt_manager_depth_block').style.visibility = prompt.injection_position === INJECTION_POSITION.ABSOLUTE ? 'visible' : 'hidden';
     }
 
     // Append prompt to selected character
@@ -671,6 +690,8 @@ PromptManagerModule.prototype.updatePromptWithPromptEditForm = function (prompt)
     prompt.name = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_name').value;
     prompt.role = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_role').value;
     prompt.content = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_prompt').value;
+    prompt.injection_position = Number(document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_injection_position').value);
+    prompt.injection_depth = Number(document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_injection_depth').value);
 }
 
 /**
@@ -1083,10 +1104,16 @@ PromptManagerModule.prototype.loadPromptIntoEditForm = function (prompt) {
     const nameField = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_name');
     const roleField = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_role');
     const promptField = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_prompt');
+    const injectionPositionField = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_injection_position');
+    const injectionDepthField = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_injection_depth');
+    const injectionDepthBlock = document.getElementById(this.configuration.prefix + 'prompt_manager_depth_block');
 
     nameField.value = prompt.name ?? '';
     roleField.value = prompt.role ?? '';
     promptField.value = prompt.content ?? '';
+    injectionPositionField.value = prompt.injection_position ?? INJECTION_POSITION.RELATIVE;
+    injectionDepthField.value = prompt.injection_depth ?? DEFAULT_DEPTH;
+    injectionDepthBlock.style.visibility = prompt.injection_position === INJECTION_POSITION.ABSOLUTE ? 'visible' : 'hidden';
 
     const resetPromptButton = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_reset');
     if (true === prompt.system_prompt) {
@@ -1096,10 +1123,23 @@ PromptManagerModule.prototype.loadPromptIntoEditForm = function (prompt) {
         resetPromptButton.style.display = 'none';
     }
 
+    injectionPositionField.removeEventListener('change', (e) => this.handleInjectionPositionChange(e));
+    injectionPositionField.addEventListener('change', (e) => this.handleInjectionPositionChange(e));
+
     const savePromptButton = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_save');
     savePromptButton.dataset.pmPrompt = prompt.identifier;
 }
 
+PromptManagerModule.prototype.handleInjectionPositionChange = function (event) {
+    const injectionDepthBlock = document.getElementById(this.configuration.prefix + 'prompt_manager_depth_block');
+    const injectionPosition = Number(event.target.value);
+    if (injectionPosition === INJECTION_POSITION.ABSOLUTE) {
+        injectionDepthBlock.style.visibility = 'visible';
+    } else {
+        injectionDepthBlock.style.visibility = 'hidden';
+    }
+}
+
 /**
  * Loads a given prompt into the inspect form
  * @param {MessageCollection} messages - Prompt object with properties 'name', 'role', 'content', and 'system_prompt'
@@ -1117,12 +1157,10 @@ PromptManagerModule.prototype.loadMessagesIntoInspectForm = function (messages)
         let drawerHTML = `
     <div class="inline-drawer ${this.configuration.prefix}prompt_manager_prompt">
         <div class="inline-drawer-toggle inline-drawer-header">
-            <span>Name: ${title}, Role: ${role}, Tokens: ${tokens}</span>
+            <span>Name: ${escapeHtml(title)}, Role: ${role}, Tokens: ${tokens}</span>
             <div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
         </div>
-        <div class="inline-drawer-content">
-            ${content}
-        </div>
+        <div class="inline-drawer-content" style="white-space: pre-wrap;">${escapeHtml(content)}</div>
     </div>
     `;
 
@@ -1133,9 +1171,11 @@ PromptManagerModule.prototype.loadMessagesIntoInspectForm = function (messages)
 
     const messageList = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_inspect_list');
 
-    if (0 === messages.getCollection().length) messageList.innerHTML = `<span>This marker does not contain any prompts.</span>`;
+    const messagesCollection = messages instanceof Message ? [messages] : messages.getCollection();
 
-    messages.getCollection().forEach(message => {
+    if (0 === messagesCollection.length) messageList.innerHTML = `<span>This marker does not contain any prompts.</span>`;
+
+    messagesCollection.forEach(message => {
         messageList.append(createInlineDrawer(message));
     });
 }
@@ -1150,10 +1190,16 @@ PromptManagerModule.prototype.clearEditForm = function () {
     const nameField = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_name');
     const roleField = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_role');
     const promptField = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_prompt');
+    const injectionPositionField = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_injection_position');
+    const injectionDepthField = document.getElementById(this.configuration.prefix + 'prompt_manager_popup_entry_form_injection_depth');
+    const injectionDepthBlock = document.getElementById(this.configuration.prefix + 'prompt_manager_depth_block');
 
     nameField.value = '';
     roleField.selectedIndex = 0;
     promptField.value = '';
+    injectionPositionField.selectedIndex = 0;
+    injectionDepthField.value = DEFAULT_DEPTH;
+    injectionDepthBlock.style.visibility = 'unset';
 
     roleField.disabled = false;
 }
@@ -1433,13 +1479,18 @@ PromptManagerModule.prototype.renderPromptManagerListItems = function () {
         }
 
         const encodedName = escapeHtml(prompt.name);
+        const isSystemPrompt = !prompt.marker && prompt.system_prompt && prompt.injection_position !== INJECTION_POSITION.ABSOLUTE;
+        const isUserPrompt = !prompt.marker && !prompt.system_prompt && prompt.injection_position !== INJECTION_POSITION.ABSOLUTE;
+        const isInjectionPrompt = !prompt.marker && prompt.injection_position === INJECTION_POSITION.ABSOLUTE;
         listItemHtml += `
             <li class="${prefix}prompt_manager_prompt ${draggableClass} ${enabledClass} ${markerClass}" data-pm-identifier="${prompt.identifier}">
                 <span class="${prefix}prompt_manager_prompt_name" data-pm-name="${encodedName}">
                     ${prompt.marker ? '<span class="fa-solid fa-thumb-tack" title="Marker"></span>' : ''}
-                    ${!prompt.marker && prompt.system_prompt ? '<span class="fa-solid fa-square-poll-horizontal" title="Global Prompt"></span>' : ''}
-                    ${!prompt.marker && !prompt.system_prompt ? '<span class="fa-solid fa-user" title="User Prompt"></span>' : ''}
+                    ${isSystemPrompt ? '<span class="fa-solid fa-square-poll-horizontal" title="Global Prompt"></span>' : ''}
+                    ${isUserPrompt ? '<span class="fa-solid fa-user" title="User Prompt"></span>' : ''}
+                    ${isInjectionPrompt ? `<span class="fa-solid fa-syringe" title="In-Chat Injection"></span>` : ''}
                     ${this.isPromptInspectionAllowed(prompt) ? `<a class="prompt-manager-inspect-action">${encodedName}</a>` : encodedName}
+                    ${isInjectionPrompt ? `<small class="prompt-manager-injection-depth">@ ${prompt.injection_depth}</small>` : ''}
                 </span>
                 <span>
                         <span class="prompt_manager_prompt_controls">

public/scripts/RossAscends-mods.js

@@ -18,6 +18,8 @@ import {
     getThumbnailUrl,
     selectCharacterById,
     eventSource,
+    menu_type,
+    substituteParams,
 } from "../script.js";
 
 import {
@@ -31,9 +33,10 @@ import {
     SECRET_KEYS,
     secret_state,
 } from "./secrets.js";
-import { debounce, delay, getStringHash, waitUntilCondition } from "./utils.js";
+import { debounce, delay, getStringHash, isValidUrl, waitUntilCondition } from "./utils.js";
 import { chat_completion_sources, oai_settings } from "./openai.js";
 import { getTokenCount } from "./tokenizers.js";
+import { isMancer } from "./textgen-settings.js";
 
 
 var RPanelPin = document.getElementById("rm_button_panel_pin");
@@ -57,9 +60,7 @@ const countTokensDebounced = debounce(RA_CountCharTokens, 1000);
 
 const observer = new MutationObserver(function (mutations) {
     mutations.forEach(function (mutation) {
-        if (mutation.target.id === "online_status_text2" ||
-            mutation.target.id === "online_status_text3" ||
-            mutation.target.classList.contains("online_status_text4")) {
+        if (mutation.target.classList.contains("online_status_text")) {
             RA_checkOnlineStatus();
         } else if (mutation.target.parentNode === SelectedCharacterTab) {
             setTimeout(RA_CountCharTokens, 200);
@@ -171,7 +172,7 @@ export function humanizedDateTime() {
     let humanMillisecond =
         (baseDate.getMilliseconds() < 10 ? "0" : "") + baseDate.getMilliseconds();
     let HumanizedDateTime =
-        humanYear + "-" + humanMonth + "-" + humanDate + " @" + humanHour + "h " + humanMinute + "m " + humanSecond + "s " + humanMillisecond + "ms";
+        humanYear + "-" + humanMonth + "-" + humanDate + "@" + humanHour + "h" + humanMinute + "m" + humanSecond + "s";
     return HumanizedDateTime;
 }
 
@@ -210,10 +211,12 @@ $("#character_popup").on("input", function () { countTokensDebounced(); });
 //function:
 export function RA_CountCharTokens() {
     let total_tokens = 0;
+    let permanent_tokens = 0;
 
     $('[data-token-counter]').each(function () {
         const counter = $(this);
         const input = $(document.getElementById(counter.data('token-counter')));
+        const isPermanent = counter.data('token-permanent') === true;
         const value = String(input.val());
 
         if (input.length === 0) {
@@ -230,10 +233,14 @@ export function RA_CountCharTokens() {
 
         if (input.data('last-value-hash') === valueHash) {
             total_tokens += Number(counter.text());
+            permanent_tokens += isPermanent ? Number(counter.text()) : 0;
         } else {
-            const tokens = getTokenCount(value);
+            // We substitute macro for existing characters, but not for the character being created
+            const valueToCount = menu_type === 'create' ? value : substituteParams(value);
+            const tokens = getTokenCount(valueToCount);
             counter.text(tokens);
             total_tokens += tokens;
+            permanent_tokens += isPermanent ? tokens : 0;
             input.data('last-value-hash', valueHash);
         }
     });
@@ -242,6 +249,7 @@ export function RA_CountCharTokens() {
     const tokenLimit = Math.max(((main_api !== 'openai' ? max_context : oai_settings.openai_max_context) / 2), 1024);
     const showWarning = (total_tokens > tokenLimit);
     $('#result_info_total_tokens').text(total_tokens);
+    $('#result_info_permanent_tokens').text(permanent_tokens);
     $('#result_info_text').toggleClass('neutral_warning', showWarning);
     $('#chartokenwarning').toggle(showWarning);
 }
@@ -259,11 +267,11 @@ async function RA_autoloadchat() {
         let active_character_id = Object.keys(characters).find(key => characters[key].avatar === active_character);
 
         if (active_character_id !== null) {
-            selectCharacterById(String(active_character_id));
+            await selectCharacterById(String(active_character_id));
         }
 
         if (active_group != null) {
-            openGroupById(String(active_group));
+            await openGroupById(String(active_group));
         }
 
         // if the character list hadn't been loaded yet, try again.
@@ -274,10 +282,16 @@ export async function favsToHotswap() {
     const entities = getEntitiesList({ doFilter: false });
     const container = $('#right-nav-panel .hotswap');
     const template = $('#hotswap_template .hotswapAvatar');
-    container.empty();
-    const maxCount = 6;
+    const DEFAULT_COUNT = 6;
+    const WIDTH_PER_ITEM = 60; // 50px + 5px gap + 5px padding
+    const containerWidth = container.outerWidth();
+    const maxCount = containerWidth > 0 ? Math.floor(containerWidth / WIDTH_PER_ITEM) : DEFAULT_COUNT;
     let count = 0;
 
+    const promises = [];
+    const newContainer = container.clone();
+    newContainer.empty();
+
     for (const entity of entities) {
         if (count >= maxCount) {
             break;
@@ -310,23 +324,39 @@ export async function favsToHotswap() {
         }
 
         if (isCharacter) {
-            const avatarUrl = getThumbnailUrl('avatar', entity.item.avatar);
-            $(slot).find('img').attr('src', avatarUrl);
-            $(slot).attr('title', entity.item.avatar);
+            const imgLoadPromise = new Promise((resolve) => {
+                const avatarUrl = getThumbnailUrl('avatar', entity.item.avatar);
+                $(slot).find('img').attr('src', avatarUrl).on('load', resolve);
+                $(slot).attr('title', entity.item.avatar);
+            });
+
+            // if the image doesn't load in 500ms, resolve the promise anyway
+            promises.push(Promise.race([imgLoadPromise, delay(500)]));
         }
 
         $(slot).css('cursor', 'pointer');
-        container.append(slot);
+        newContainer.append(slot);
         count++;
     }
 
-    // there are 6 slots in total,
-    if (count < maxCount) { //if any are left over
+    // don't fill leftover spaces with avatar placeholders
+    // just evenly space the selected avatars instead
+    /*
+   if (count < maxCount) { //if any space is left over
         let leftOverSlots = maxCount - count;
         for (let i = 1; i <= leftOverSlots; i++) {
-            container.append(template.clone());
+            newContainer.append(template.clone());
         }
     }
+    */
+
+    await Promise.allSettled(promises);
+    //helpful instruction message if no characters are favorited
+    if (count === 0) { container.html(`<small><span><i class="fa-solid fa-star"></i> Favorite characters to add them to HotSwaps</span></small>`) }
+    //otherwise replace with fav'd characters
+    if (count > 0) {
+        container.replaceWith(newContainer);
+    }
 }
 
 //changes input bar and send button display depending on connection status
@@ -341,7 +371,7 @@ function RA_checkOnlineStatus() {
         connection_made = false;
     } else {
         if (online_status !== undefined && online_status !== "no_connection") {
-            $("#send_textarea").attr("placeholder", `Type a message, or /? for command list`); //on connect, placeholder tells user to type message
+            $("#send_textarea").attr("placeholder", `Type a message, or /? for help`); //on connect, placeholder tells user to type message
             $('#send_form').removeClass("no-connection");
             $("#API-status-top").removeClass("fa-plug-circle-exclamation redOverlayGlow");
             $("#API-status-top").addClass("fa-plug");
@@ -367,18 +397,21 @@ function RA_autoconnect(PrevApi) {
     if (online_status === "no_connection" && LoadLocalBool('AutoConnectEnabled')) {
         switch (main_api) {
             case 'kobold':
-                if (api_server && isUrlOrAPIKey(api_server)) {
-                    $("#api_button").click();
+                if (api_server && isValidUrl(api_server)) {
+                    $("#api_button").trigger('click');
                 }
                 break;
             case 'novel':
                 if (secret_state[SECRET_KEYS.NOVEL]) {
-                    $("#api_button_novel").click();
+                    $("#api_button_novel").trigger('click');
                 }
                 break;
             case 'textgenerationwebui':
-                if (api_server_textgenerationwebui && isUrlOrAPIKey(api_server_textgenerationwebui)) {
-                    $("#api_button_textgenerationwebui").click();
+                if (isMancer() && secret_state[SECRET_KEYS.MANCER]) {
+                    $("#api_button_textgenerationwebui").trigger('click');
+                }
+                else if (api_server_textgenerationwebui && isValidUrl(api_server_textgenerationwebui)) {
+                    $("#api_button_textgenerationwebui").trigger('click');
                 }
                 break;
             case 'openai':
@@ -388,8 +421,9 @@ function RA_autoconnect(PrevApi) {
                     || (oai_settings.chat_completion_source == chat_completion_sources.WINDOWAI)
                     || (secret_state[SECRET_KEYS.OPENROUTER] && oai_settings.chat_completion_source == chat_completion_sources.OPENROUTER)
                     || (secret_state[SECRET_KEYS.AI21] && oai_settings.chat_completion_source == chat_completion_sources.AI21)
+                    || (secret_state[SECRET_KEYS.PALM] && oai_settings.chat_completion_source == chat_completion_sources.PALM)
                 ) {
-                    $("#api_button_openai").click();
+                    $("#api_button_openai").trigger('click');
                 }
                 break;
         }
@@ -397,21 +431,12 @@ function RA_autoconnect(PrevApi) {
         if (!connection_made) {
             RA_AC_retries++;
             retry_delay = Math.min(retry_delay * 2, 30000); // double retry delay up to to 30 secs
-            //console.log('connection attempts: ' + RA_AC_retries + ' delay: ' + (retry_delay / 1000) + 's');
-            setTimeout(RA_autoconnect, retry_delay);
+            // console.log('connection attempts: ' + RA_AC_retries + ' delay: ' + (retry_delay / 1000) + 's');
+            // setTimeout(RA_autoconnect, retry_delay);
         }
     }
 }
 
-function isUrlOrAPIKey(string) {
-    try {
-        new URL(string);
-        return true;
-    } catch (_) {
-        //          return pattern.test(string);
-    }
-}
-
 function OpenNavPanels() {
     const deviceInfo = getDeviceInfo();
     if (deviceInfo && deviceInfo.device.type === 'desktop') {
@@ -867,13 +892,23 @@ export function initRossMods() {
 
     //this makes the chat input text area resize vertically to match the text size (limited by CSS at 50% window height)
     $('#send_textarea').on('input', function () {
+        const chatBlock = $('#chat');
+        const originalScrollBottom = chatBlock[0].scrollHeight - (chatBlock.scrollTop() + chatBlock.outerHeight());
         this.style.height = window.getComputedStyle(this).getPropertyValue('min-height');
         this.style.height = (this.scrollHeight) + 'px';
+        const newScrollTop = Math.round(chatBlock[0].scrollHeight - (chatBlock.outerHeight() + originalScrollBottom));
+        chatBlock.scrollTop(newScrollTop);
     });
 
     //Regenerate if user swipes on the last mesage in chat
 
     document.addEventListener('swiped-left', function (e) {
+        if (power_user.gestures === false) {
+            return
+        }
+        if ($(".mes_edit_buttons, #character_popup, #dialogue_popup, #WorldInfo").is(":visible")) {
+            return
+        }
         var SwipeButR = $('.swipe_right:last');
         var SwipeTargetMesClassParent = $(e.target).closest('.last_mes');
         if (SwipeTargetMesClassParent !== null) {
@@ -883,6 +918,12 @@ export function initRossMods() {
         }
     });
     document.addEventListener('swiped-right', function (e) {
+        if (power_user.gestures === false) {
+            return
+        }
+        if ($(".mes_edit_buttons, #character_popup, #dialogue_popup, #WorldInfo").is(":visible")) {
+            return
+        }
         var SwipeButL = $('.swipe_left:last');
         var SwipeTargetMesClassParent = $(e.target).closest('.last_mes');
         if (SwipeTargetMesClassParent !== null) {
@@ -906,10 +947,13 @@ export function initRossMods() {
     }
 
     $(document).on('keydown', function (event) {
-        processHotkeys(event);
+        processHotkeys(event.originalEvent);
     });
 
     //Additional hotkeys CTRL+ENTER and CTRL+UPARROW
+    /**
+     * @param {KeyboardEvent} event
+     */
     function processHotkeys(event) {
         //Enter to send when send_textarea in focus
         if ($(':focus').attr('id') === 'send_textarea') {
@@ -943,6 +987,14 @@ export function initRossMods() {
             }, 300);
         }
 
+        // Alt+Enter or AltGr+Enter to Continue
+        if ((event.altKey || (event.altKey && event.ctrlKey)) && event.key == "Enter") {
+            if (is_send_press == false) {
+                console.debug("Continuing with Alt+Enter");
+                $('#option_continue').trigger('click');
+            }
+        }
+
         // Ctrl+Enter for Regeneration Last Response. If editing, accept the edits instead
         if (event.ctrlKey && event.key == "Enter") {
             const editMesDone = $(".mes_edit_done:visible");
@@ -958,14 +1010,6 @@ export function initRossMods() {
             }
         }
 
-        // Alt+Enter to Continue
-        if (event.altKey && event.key == "Enter") {
-            if (is_send_press == false) {
-                console.debug("Continuing with Alt+Enter");
-                $('#option_continue').trigger('click');
-            }
-        }
-
         // Helper function to check if nanogallery2's lightbox is active
         function isNanogallery2LightboxActive() {
             // Check if the body has the 'nGY2On' class, adjust this based on actual behavior
@@ -1097,13 +1141,14 @@ export function initRossMods() {
                 $("#rightNavDrawerIcon").trigger('click');
                 return
             }
+            if ($(".draggable").is(":visible")) {
+                // Remove the first matched element
+                $('.draggable:first').remove();
+                return;
+            }
         }
 
-        if ($(".draggable").is(":visible")) {
-            // Remove the first matched element
-            $('.draggable:first').remove();
-            return;
-        }
+
 
 
         if (event.ctrlKey && /^[1-9]$/.test(event.key)) {

public/scripts/authors-note.js

@@ -235,6 +235,7 @@ function loadSettings() {
     chat_metadata[metadata_keys.depth] = chat_metadata[metadata_keys.depth] ?? extension_settings.note.defaultDepth ?? DEFAULT_DEPTH;
     $('#extension_floating_prompt').val(chat_metadata[metadata_keys.prompt]);
     $('#extension_floating_interval').val(chat_metadata[metadata_keys.interval]);
+    $('#extension_floating_allow_wi_scan').prop('checked', extension_settings.note.allowWIScan ?? false);
     $('#extension_floating_depth').val(chat_metadata[metadata_keys.depth]);
     $(`input[name="extension_floating_position"][value="${chat_metadata[metadata_keys.position]}"]`).prop('checked', true);
 
@@ -389,6 +390,11 @@ function onChatChanged() {
     $('#extension_floating_default_token_counter').text(tokenCounter3);
 }
 
+function onAllowWIScanCheckboxChanged() {
+    extension_settings.note.allowWIScan = !!$(this).prop('checked');
+    updateSettings();
+}
+
 /**
  * Inject author's note options and setup event listeners.
  */
@@ -402,6 +408,7 @@ export function initAuthorsNote() {
     $('#extension_floating_default').on('input', onExtensionFloatingDefaultInput);
     $('#extension_default_depth').on('input', onDefaultDepthInput);
     $('#extension_default_interval').on('input', onDefaultIntervalInput);
+    $('#extension_floating_allow_wi_scan').on('input', onAllowWIScanCheckboxChanged);
     $('input[name="extension_floating_position"]').on('change', onExtensionFloatingPositionInput);
     $('input[name="extension_default_position"]').on('change', onDefaultPositionInput);
     $('input[name="extension_floating_char_position"]').on('change', onExtensionFloatingCharPositionInput);

public/scripts/backgrounds.js

@@ -0,0 +1,488 @@
+import { callPopup, chat_metadata, eventSource, event_types, generateQuietPrompt, getCurrentChatId, getRequestHeaders, getThumbnailUrl } from "../script.js";
+import { saveMetadataDebounced } from "./extensions.js";
+import { registerSlashCommand } from "./slash-commands.js";
+import { stringFormat } from "./utils.js";
+
+const BG_METADATA_KEY = 'custom_background';
+const LIST_METADATA_KEY = 'chat_backgrounds';
+
+/**
+ * Sets the background for the current chat and adds it to the list of custom backgrounds.
+ * @param {{url: string, path:string}} backgroundInfo
+ */
+function forceSetBackground(backgroundInfo) {
+    saveBackgroundMetadata(backgroundInfo.url);
+    setCustomBackground();
+
+    const list = chat_metadata[LIST_METADATA_KEY] || [];
+    const bg = backgroundInfo.path;
+    list.push(bg);
+    chat_metadata[LIST_METADATA_KEY] = list;
+    saveMetadataDebounced();
+    getChatBackgroundsList();
+    highlightNewBackground(bg);
+    highlightLockedBackground();
+}
+
+async function onChatChanged() {
+    if (hasCustomBackground()) {
+        setCustomBackground();
+    }
+    else {
+        unsetCustomBackground();
+    }
+
+    getChatBackgroundsList();
+    highlightLockedBackground();
+}
+
+function getChatBackgroundsList() {
+    const list = chat_metadata[LIST_METADATA_KEY];
+    const listEmpty = !Array.isArray(list) || list.length === 0;
+
+    $('#bg_custom_content').empty();
+    $('#bg_chat_hint').toggle(listEmpty);
+
+    if (listEmpty) {
+        return;
+    }
+
+    for (const bg of list) {
+        const template = getBackgroundFromTemplate(bg, true);
+        $('#bg_custom_content').append(template);
+    }
+}
+
+function getBackgroundPath(fileUrl) {
+    return `backgrounds/${fileUrl}`;
+}
+
+function highlightLockedBackground() {
+    $('.bg_example').removeClass('locked');
+
+    const lockedBackground = chat_metadata[BG_METADATA_KEY];
+
+    if (!lockedBackground) {
+        return;
+    }
+
+    $(`.bg_example`).each(function () {
+        const url = $(this).data('url');
+        if (url === lockedBackground) {
+            $(this).addClass('locked');
+        }
+    });
+}
+
+function onLockBackgroundClick(e) {
+    e.stopPropagation();
+
+    const chatName = getCurrentChatId();
+
+    if (!chatName) {
+        toastr.warning('Select a chat to lock the background for it');
+        return;
+    }
+
+    const relativeBgImage = getUrlParameter(this);
+
+    saveBackgroundMetadata(relativeBgImage);
+    setCustomBackground();
+    highlightLockedBackground();
+}
+
+function onUnlockBackgroundClick(e) {
+    e.stopPropagation();
+    removeBackgroundMetadata();
+    unsetCustomBackground();
+    highlightLockedBackground();
+}
+
+function hasCustomBackground() {
+    return chat_metadata[BG_METADATA_KEY];
+}
+
+function saveBackgroundMetadata(file) {
+    chat_metadata[BG_METADATA_KEY] = file;
+    saveMetadataDebounced();
+}
+
+function removeBackgroundMetadata() {
+    delete chat_metadata[BG_METADATA_KEY];
+    saveMetadataDebounced();
+}
+
+function setCustomBackground() {
+    const file = chat_metadata[BG_METADATA_KEY];
+
+    // bg already set
+    if (document.getElementById("bg_custom").style.backgroundImage == file) {
+        return;
+    }
+
+    $("#bg_custom").css("background-image", file);
+}
+
+function unsetCustomBackground() {
+    $("#bg_custom").css("background-image", 'none');
+}
+
+function onSelectBackgroundClick() {
+    const isCustom = $(this).attr('custom') === 'true';
+    const relativeBgImage = getUrlParameter(this);
+
+    // if clicked on upload button
+    if (!relativeBgImage) {
+        return;
+    }
+
+    // Automatically lock the background if it's custom or other background is locked
+    if (hasCustomBackground() || isCustom) {
+        saveBackgroundMetadata(relativeBgImage);
+        setCustomBackground();
+        highlightLockedBackground();
+    } else {
+        highlightLockedBackground();
+    }
+
+    const customBg = window.getComputedStyle(document.getElementById('bg_custom')).backgroundImage;
+
+    // Custom background is set. Do not override the layer below
+    if (customBg !== 'none') {
+        return;
+    }
+
+    const bgFile = $(this).attr("bgfile");
+    const backgroundUrl = getBackgroundPath(bgFile);
+
+    // Fetching to browser memory to reduce flicker
+    fetch(backgroundUrl).then(() => {
+        $("#bg1").css("background-image", relativeBgImage);
+        setBackground(bgFile);
+    }).catch(() => {
+        console.log('Background could not be set: ' + backgroundUrl);
+    });
+}
+
+async function onCopyToSystemBackgroundClick(e) {
+    e.stopPropagation();
+    const bgNames = await getNewBackgroundName(this);
+
+    if (!bgNames) {
+        return;
+    }
+
+    const bgFile = await fetch(bgNames.oldBg);
+
+    if (!bgFile.ok) {
+        toastr.warning('Failed to copy background');
+        return;
+    }
+
+    const blob = await bgFile.blob();
+    const file = new File([blob], bgNames.newBg);
+    const formData = new FormData();
+    formData.set('avatar', file);
+
+    uploadBackground(formData);
+
+    const list = chat_metadata[LIST_METADATA_KEY] || [];
+    const index = list.indexOf(bgNames.oldBg);
+    list.splice(index, 1);
+    saveMetadataDebounced();
+    getChatBackgroundsList();
+}
+
+/**
+ * Gets the new background name from the user.
+ * @param {Element} referenceElement
+ * @returns {Promise<{oldBg: string, newBg: string}>}
+ * */
+async function getNewBackgroundName(referenceElement) {
+    const exampleBlock = $(referenceElement).closest('.bg_example');
+    const isCustom = exampleBlock.attr('custom') === 'true';
+    const oldBg = exampleBlock.attr('bgfile');
+
+    if (!oldBg) {
+        console.debug('no bgfile');
+        return;
+    }
+
+    const fileExtension = oldBg.split('.').pop();
+    const fileNameBase = isCustom ? oldBg.split('/').pop() : oldBg;
+    const oldBgExtensionless = fileNameBase.replace(`.${fileExtension}`, '');
+    const newBgExtensionless = await callPopup('<h3>Enter new background name:</h3>', 'input', oldBgExtensionless);
+
+    if (!newBgExtensionless) {
+        console.debug('no new_bg_extensionless');
+        return;
+    }
+
+    const newBg = `${newBgExtensionless}.${fileExtension}`;
+
+    if (oldBgExtensionless === newBgExtensionless) {
+        console.debug('new_bg === old_bg');
+        return;
+    }
+
+    return { oldBg, newBg };
+}
+
+async function onRenameBackgroundClick(e) {
+    e.stopPropagation();
+
+    const bgNames = await getNewBackgroundName(this);
+
+    if (!bgNames) {
+        return;
+    }
+
+    const data = { old_bg: bgNames.oldBg, new_bg: bgNames.newBg };
+    const response = await fetch('/renamebackground', {
+        method: 'POST',
+        headers: getRequestHeaders(),
+        body: JSON.stringify(data),
+        cache: 'no-cache',
+    });
+
+    if (response.ok) {
+        await getBackgrounds();
+        highlightNewBackground(bgNames.newBg);
+    } else {
+        toastr.warning('Failed to rename background');
+    }
+}
+
+async function onDeleteBackgroundClick(e) {
+    e.stopPropagation();
+    const bgToDelete = $(this).closest('.bg_example');
+    const url = bgToDelete.data('url');
+    const isCustom = bgToDelete.attr('custom') === 'true';
+    const confirm = await callPopup("<h3>Delete the background?</h3>", 'confirm');
+    const bg = bgToDelete.attr('bgfile');
+
+    if (confirm) {
+        // If it's not custom, it's a built-in background. Delete it from the server
+        if (!isCustom) {
+            delBackground(bg);
+        } else {
+            const list = chat_metadata[LIST_METADATA_KEY] || [];
+            const index = list.indexOf(bg);
+            list.splice(index, 1);
+        }
+
+        const siblingSelector = '.bg_example:not(#form_bg_download)';
+        const nextBg = bgToDelete.next(siblingSelector);
+        const prevBg = bgToDelete.prev(siblingSelector);
+        const anyBg = $(siblingSelector);
+
+        if (nextBg.length > 0) {
+            nextBg.trigger('click');
+        } else if (prevBg.length > 0) {
+            prevBg.trigger('click');
+        } else {
+            $(anyBg[Math.floor(Math.random() * anyBg.length)]).trigger('click');
+        }
+
+        bgToDelete.remove();
+
+        if (url === chat_metadata[BG_METADATA_KEY]) {
+            removeBackgroundMetadata();
+            unsetCustomBackground();
+            highlightLockedBackground();
+        }
+
+        if (isCustom) {
+            getChatBackgroundsList();
+            saveMetadataDebounced();
+        }
+    }
+}
+
+const autoBgPrompt = `Pause your roleplay and choose a location ONLY from the provided list that is the most suitable for the current scene. Do not output any other text:\n{0}`;
+
+async function autoBackgroundCommand() {
+    /** @type {HTMLElement[]} */
+    const bgTitles = Array.from(document.querySelectorAll('#bg_menu_content .BGSampleTitle'));
+    const options = bgTitles.map(x => ({ element: x, text: x.innerText.trim() })).filter(x => x.text.length > 0);
+    if (options.length == 0) {
+        toastr.warning('No backgrounds to choose from. Please upload some images to the "backgrounds" folder.');
+        return;
+    }
+
+    const list = options.map(option => `- ${option.text}`).join('\n');
+    const prompt = stringFormat(autoBgPrompt, list);
+    const reply = await generateQuietPrompt(prompt, false, false);
+    const fuse = new Fuse(options, { keys: ['text'] });
+    const bestMatch = fuse.search(reply, { limit: 1 });
+
+    if (bestMatch.length == 0) {
+        toastr.warning('No match found. Please try again.');
+        return;
+    }
+
+    console.debug('Automatically choosing background:', bestMatch);
+    bestMatch[0].item.element.click();
+}
+
+export async function getBackgrounds() {
+    const response = await fetch("/getbackgrounds", {
+        method: "POST",
+        headers: getRequestHeaders(),
+        body: JSON.stringify({
+            "": "",
+        }),
+    });
+    if (response.ok === true) {
+        const getData = await response.json();
+        //background = getData;
+        //console.log(getData.length);
+        $("#bg_menu_content").children('div').remove();
+        for (const bg of getData) {
+            const template = getBackgroundFromTemplate(bg, false);
+            $("#bg_menu_content").append(template);
+        }
+    }
+}
+
+/**
+ * Gets the URL of the background
+ * @param {Element} block
+ * @returns {string} URL of the background
+ */
+function getUrlParameter(block) {
+    return $(block).closest(".bg_example").data("url");
+}
+
+/**
+ * Instantiates a background template
+ * @param {string} bg Path to background
+ * @param {boolean} isCustom Whether the background is custom
+ * @returns {JQuery<HTMLElement>} Background template
+ */
+function getBackgroundFromTemplate(bg, isCustom) {
+    const template = $('#background_template .bg_example').clone();
+    const thumbPath = isCustom ? bg : getThumbnailUrl('bg', bg);
+    const url = isCustom ? `url("${encodeURI(bg)}")` : `url("${getBackgroundPath(bg)}")`;
+    const title = isCustom ? bg.split('/').pop() : bg;
+    const friendlyTitle = title.slice(0, title.lastIndexOf('.'));
+    template.attr('title', title);
+    template.attr('bgfile', bg);
+    template.attr('custom', String(isCustom));
+    template.data('url', url);
+    template.css('background-image', `url('${thumbPath}')`);
+    template.find('.BGSampleTitle').text(friendlyTitle);
+    return template;
+}
+
+async function setBackground(bg) {
+    jQuery.ajax({
+        type: "POST", //
+        url: "/setbackground", //
+        data: JSON.stringify({
+            bg: bg,
+        }),
+        beforeSend: function () {
+
+        },
+        cache: false,
+        dataType: "json",
+        contentType: "application/json",
+        //processData: false,
+        success: function (html) { },
+        error: function (jqXHR, exception) {
+            console.log(exception);
+            console.log(jqXHR);
+        },
+    });
+}
+
+async function delBackground(bg) {
+    const response = await fetch("/delbackground", {
+        method: "POST",
+        headers: getRequestHeaders(),
+        body: JSON.stringify({
+            bg: bg,
+        }),
+    });
+}
+
+function onBackgroundUploadSelected() {
+    const form = $("#form_bg_download").get(0);
+
+    if (!(form instanceof HTMLFormElement)) {
+        console.error('form_bg_download is not a form');
+        return;
+    }
+
+    const formData = new FormData(form);
+    uploadBackground(formData);
+    form.reset();
+}
+
+/**
+ * Uploads a background to the server
+ * @param {FormData} formData
+ */
+function uploadBackground(formData) {
+    jQuery.ajax({
+        type: "POST",
+        url: "/downloadbackground",
+        data: formData,
+        beforeSend: function () {
+        },
+        cache: false,
+        contentType: false,
+        processData: false,
+        success: async function (bg) {
+            setBackground(bg);
+            $("#bg1").css("background-image", `url("${getBackgroundPath(bg)}"`);
+            await getBackgrounds();
+            highlightNewBackground(bg);
+        },
+        error: function (jqXHR, exception) {
+            console.log(exception);
+            console.log(jqXHR);
+        },
+    });
+}
+
+/**
+ * @param {string} bg
+ */
+function highlightNewBackground(bg) {
+    const newBg = $(`.bg_example[bgfile="${bg}"]`);
+    const scrollOffset = newBg.offset().top - newBg.parent().offset().top;
+    $('#Backgrounds').scrollTop(scrollOffset);
+    newBg.addClass('flash animated');
+    setTimeout(() => newBg.removeClass('flash animated'), 2000);
+}
+
+function onBackgroundFilterInput() {
+    const filterValue = String($(this).val()).toLowerCase();
+    $("#bg_menu_content > div").each(function () {
+        const $bgContent = $(this);
+        if ($bgContent.attr("title").toLowerCase().includes(filterValue)) {
+            $bgContent.show();
+        } else {
+            $bgContent.hide();
+        }
+    });
+}
+
+export function initBackgrounds() {
+    eventSource.on(event_types.CHAT_CHANGED, onChatChanged);
+    eventSource.on(event_types.FORCE_SET_BACKGROUND, forceSetBackground);
+    $(document).on("click", '.bg_example', onSelectBackgroundClick);
+    $(document).on('click', '.bg_example_lock', onLockBackgroundClick);
+    $(document).on('click', '.bg_example_unlock', onUnlockBackgroundClick);
+    $(document).on('click', '.bg_example_edit', onRenameBackgroundClick);
+    $(document).on("click", '.bg_example_cross', onDeleteBackgroundClick);
+    $(document).on("click", '.bg_example_copy', onCopyToSystemBackgroundClick);
+    $('#auto_background').on("click", autoBackgroundCommand);
+    $("#add_bg_button").on('change', onBackgroundUploadSelected);
+    $("#bg-filter").on("input", onBackgroundFilterInput);
+    registerSlashCommand('lockbg', onLockBackgroundClick, ['bglock'], "– locks a background for the currently selected chat", true, true);
+    registerSlashCommand('unlockbg', onUnlockBackgroundClick, ['bgunlock'], '– unlocks a background for the currently selected chat', true, true);
+    registerSlashCommand('autobg', autoBackgroundCommand, ['bgauto'], '– automatically changes the background based on the chat context using the AI request prompt', true, true);
+}

public/scripts/bookmarks.js

@@ -133,6 +133,39 @@ async function saveBookmarkMenu() {
     return createNewBookmark(chat.length - 1);
 }
 
+export async function createBranch(mesId) {
+    if (!chat.length) {
+        toastr.warning('The chat is empty.', 'Branch creation failed');
+        return;
+    }
+
+    if (mesId < 0 || mesId >= chat.length) {
+        toastr.warning('Invalid message ID.', 'Branch creation failed');
+        return;
+    }
+
+    const lastMes = chat[mesId];
+    const mainChat = selected_group ? groups?.find(x => x.id == selected_group)?.chat_id : characters[this_chid].chat;
+    const newMetadata = { main_chat: mainChat };
+    let name = `Branch #${mesId} - ${humanizedDateTime()}`
+
+    if (selected_group) {
+        await saveGroupBookmarkChat(selected_group, name, newMetadata, mesId);
+    } else {
+        await saveChat(name, newMetadata, mesId);
+    }
+    // append to branches list if it exists
+    // otherwise create it
+    if (typeof lastMes.extra !== 'object') {
+        lastMes.extra = {};
+    }
+    if (typeof lastMes.extra['branches'] !== 'object') {
+        lastMes.extra['branches'] = [];
+    }
+    lastMes.extra['branches'].push(name);
+    return name;
+}
+
 async function createNewBookmark(mesId) {
     if (!chat.length) {
         toastr.warning('The chat is empty.', 'Bookmark creation failed');
@@ -280,7 +313,6 @@ async function convertSoloToGroupChat() {
         message.name = character.name;
         message.original_avatar = character.avatar;
         message.force_avatar = getThumbnailUrl('avatar', character.avatar);
-        message.is_name = true;
 
         // Allow regens of a single message in group
         if (typeof message.extra !== 'object') {

public/scripts/bulk-edit.js

@@ -1,24 +1,44 @@
-import { characters, getCharacters, handleDeleteCharacter, callPopup } from "../../../script.js";
+import { characters, getCharacters, handleDeleteCharacter, callPopup } from "../script.js";
+import {BulkEditOverlay, BulkEditOverlayState} from "./BulkEditOverlay.js";
+
 
 let is_bulk_edit = false;
 
+const enableBulkEdit = () => {
+    enableBulkSelect();
+    (new BulkEditOverlay()).selectState();
+    // show the delete button
+    $("#bulkDeleteButton").show();
+    is_bulk_edit = true;
+}
+
+const disableBulkEdit = () => {
+    disableBulkSelect();
+    (new BulkEditOverlay()).browseState();
+    // hide the delete button
+    $("#bulkDeleteButton").hide();
+    is_bulk_edit = false;
+}
+
+const toggleBulkEditMode = (isBulkEdit) => {
+    if (isBulkEdit) {
+        disableBulkEdit();
+    } else {
+        enableBulkEdit();
+    }
+}
+
+(new BulkEditOverlay()).addStateChangeCallback((state) => {
+    if (state === BulkEditOverlayState.select) enableBulkEdit();
+    if (state === BulkEditOverlayState.browse) disableBulkEdit();
+});
+
 /**
  * Toggles bulk edit mode on/off when the edit button is clicked.
  */
 function onEditButtonClick() {
     console.log("Edit button clicked");
-    // toggle bulk edit mode
-    if (is_bulk_edit) {
-        disableBulkSelect();
-        // hide the delete button
-        $("#bulkDeleteButton").hide();
-        is_bulk_edit = false;
-    } else {
-        enableBulkSelect();
-        // show the delete button
-        $("#bulkDeleteButton").show();
-        is_bulk_edit = true;
-    }
+    toggleBulkEditMode(is_bulk_edit);
 }
 
 /**
@@ -64,23 +84,6 @@ async function onDeleteButtonClick() {
     }
 }
 
-/**
- * Adds the bulk edit and delete buttons to the UI.
- */
-function addButtons() {
-    const editButton = $(
-        "<i id='bulkEditButton' class='fa-solid fa-edit menu_button bulkEditButton' title='Bulk edit characters'></i>"
-    );
-    const deleteButton = $(
-        "<i id='bulkDeleteButton' class='fa-solid fa-trash menu_button bulkDeleteButton' title='Bulk delete characters' style='display: none;'></i>"
-    );
-
-    $("#charListGridToggle").after(editButton, deleteButton);
-
-    $("#bulkEditButton").on("click", onEditButtonClick);
-    $("#bulkDeleteButton").on("click", onDeleteButtonClick);
-}
-
 /**
  * Enables bulk selection by adding a checkbox next to each character.
  */
@@ -111,7 +114,7 @@ function disableBulkSelect() {
 /**
  * Entry point that runs on page load.
  */
-jQuery(async () => {
-    addButtons();
-    // loadSettings();
+jQuery(() => {
+    $("#bulkEditButton").on("click", onEditButtonClick);
+    $("#bulkDeleteButton").on("click", onDeleteButtonClick);
 });

public/scripts/cfg-scale.js

@@ -1,19 +1,17 @@
 import {
     chat_metadata,
+    substituteParams,
+    this_chid,
     eventSource,
     event_types,
     saveSettingsDebounced,
-    this_chid,
-} from "../../../script.js";
-import { selected_group } from "../../group-chats.js";
-import { extension_settings, saveMetadataDebounced } from "../../extensions.js";
-import { getCharaFilename, delay } from "../../utils.js";
-import { power_user } from "../../power-user.js";
-import { metadataKeys } from "./util.js";
+} from "../script.js";
+import { extension_settings, saveMetadataDebounced } from "./extensions.js"
+import { selected_group } from "./group-chats.js";
+import { getCharaFilename, delay } from "./utils.js";
+import { power_user } from "./power-user.js";
 
-// Keep track of where your extension is located, name should match repo name
-const extensionName = "cfg";
-const extensionFolderPath = `scripts/extensions/${extensionName}`;
+const extensionName = 'cfg';
 const defaultSettings = {
     global: {
         "guidance_scale": 1,
@@ -180,7 +178,7 @@ async function modifyCharaHtml() {
 function loadSettings() {
     // Set chat CFG if it exists
     $('#chat_cfg_guidance_scale').val(chat_metadata[metadataKeys.guidance_scale] ?? 1.0.toFixed(2));
-    $('#chat_cfg_guidance_scale_counter').text(chat_metadata[metadataKeys.guidance_scale]?.toFixed(2) ?? 1.0.toFixed(2));
+    $('#chat_cfg_guidance_scale_counter').val(chat_metadata[metadataKeys.guidance_scale]?.toFixed(2) ?? 1.0.toFixed(2));
     $('#chat_cfg_negative_prompt').val(chat_metadata[metadataKeys.negative_prompt] ?? '');
     $('#chat_cfg_positive_prompt').val(chat_metadata[metadataKeys.positive_prompt] ?? '');
     $('#groupchat_cfg_use_chara').prop('checked', chat_metadata[metadataKeys.groupchat_individual_chars] ?? false);
@@ -199,7 +197,7 @@ function loadSettings() {
         if (!promptSeparator.startsWith(`"`)) {
             promptSeparatorDisplay.unshift(`"`);
         }
-    
+
         if (!promptSeparator.endsWith(`"`)) {
             promptSeparatorDisplay.push(`"`);
         }
@@ -213,7 +211,7 @@ function loadSettings() {
     if (!selected_group) {
         const charaCfg = extension_settings.cfg.chara.find((e) => e.name === getCharaFilename());
         $('#chara_cfg_guidance_scale').val(charaCfg?.guidance_scale ?? 1.00);
-        $('#chara_cfg_guidance_scale_counter').text(charaCfg?.guidance_scale?.toFixed(2) ?? 1.0.toFixed(2));
+        $('#chara_cfg_guidance_scale_counter').val(charaCfg?.guidance_scale?.toFixed(2) ?? 1.0.toFixed(2));
         $('#chara_cfg_negative_prompt').val(charaCfg?.negative_prompt ?? '');
         $('#chara_cfg_positive_prompt').val(charaCfg?.positive_prompt ?? '');
     }
@@ -230,7 +228,7 @@ async function initialLoadSettings() {
 
     // Set global CFG values on load
     $('#global_cfg_guidance_scale').val(extension_settings.cfg.global.guidance_scale);
-    $('#global_cfg_guidance_scale_counter').text(extension_settings.cfg.global.guidance_scale.toFixed(2));
+    $('#global_cfg_guidance_scale_counter').val(extension_settings.cfg.global.guidance_scale.toFixed(2));
     $('#global_cfg_negative_prompt').val(extension_settings.cfg.global.negative_prompt);
     $('#global_cfg_positive_prompt').val(extension_settings.cfg.global.positive_prompt);
 }
@@ -279,14 +277,8 @@ function migrateSettings() {
 }
 
 // This function is called when the extension is loaded
-jQuery(async () => {
-    // This is an example of loading HTML from a file
-    const windowHtml = $(await $.get(`${extensionFolderPath}/window.html`));
-
-    // Append settingsHtml to extensions_settings
-    // extension_settings and extensions_settings2 are the left and right columns of the settings menu
-    // Left should be extensions that deal with system functions and right should be visual/UI related 
-    windowHtml.find('#CFGClose').on('click', function () {
+export function initCfg() {
+    $('#CFGClose').on('click', function () {
         $("#cfgConfig").transition({
             opacity: 0,
             duration: 200,
@@ -295,58 +287,58 @@ jQuery(async () => {
         setTimeout(function () { $('#cfgConfig').hide() }, 200);
     });
 
-    windowHtml.find('#chat_cfg_guidance_scale').on('input', function() {
+    $('#chat_cfg_guidance_scale').on('input', function() {
         const numberValue = Number($(this).val());
         const success = setChatCfg(numberValue, settingType.guidance_scale);
         if (success) {
-            $('#chat_cfg_guidance_scale_counter').text(numberValue.toFixed(2));
+            $('#chat_cfg_guidance_scale_counter').val(numberValue.toFixed(2));
         }
     });
 
-    windowHtml.find('#chat_cfg_negative_prompt').on('input', function() {
+    $('#chat_cfg_negative_prompt').on('input', function() {
         setChatCfg($(this).val(), settingType.negative_prompt);
     });
 
-    windowHtml.find('#chat_cfg_positive_prompt').on('input', function() {
+    $('#chat_cfg_positive_prompt').on('input', function() {
         setChatCfg($(this).val(), settingType.positive_prompt);
     });
 
-    windowHtml.find('#chara_cfg_guidance_scale').on('input', function() {
+    $('#chara_cfg_guidance_scale').on('input', function() {
         const value = $(this).val();
         const success = setCharCfg(value, settingType.guidance_scale);
         if (success) {
-            $('#chara_cfg_guidance_scale_counter').text(Number(value).toFixed(2));
+            $('#chara_cfg_guidance_scale_counter').val(Number(value).toFixed(2));
         }
     });
 
-    windowHtml.find('#chara_cfg_negative_prompt').on('input', function() {
+    $('#chara_cfg_negative_prompt').on('input', function() {
         setCharCfg($(this).val(), settingType.negative_prompt);
     });
 
-    windowHtml.find('#chara_cfg_positive_prompt').on('input', function() {
+    $('#chara_cfg_positive_prompt').on('input', function() {
         setCharCfg($(this).val(), settingType.positive_prompt);
     });
 
-    windowHtml.find('#global_cfg_guidance_scale').on('input', function() {
+    $('#global_cfg_guidance_scale').on('input', function() {
         extension_settings.cfg.global.guidance_scale = Number($(this).val());
-        $('#global_cfg_guidance_scale_counter').text(extension_settings.cfg.global.guidance_scale.toFixed(2));
+        $('#global_cfg_guidance_scale_counter').val(extension_settings.cfg.global.guidance_scale.toFixed(2));
         saveSettingsDebounced();
     });
 
-    windowHtml.find('#global_cfg_negative_prompt').on('input', function() {
+    $('#global_cfg_negative_prompt').on('input', function() {
         extension_settings.cfg.global.negative_prompt = $(this).val();
         saveSettingsDebounced();
     });
 
-    windowHtml.find('#global_cfg_positive_prompt').on('input', function() {
+    $('#global_cfg_positive_prompt').on('input', function() {
         extension_settings.cfg.global.positive_prompt = $(this).val();
         saveSettingsDebounced();
     });
 
-    windowHtml.find(`input[name="cfg_prompt_combine"]`).on('input', function() {
-        const values = windowHtml.find(`input[name="cfg_prompt_combine"]`)
+    $(`input[name="cfg_prompt_combine"]`).on('input', function() {
+        const values = $('#cfgConfig').find(`input[name="cfg_prompt_combine"]`)
             .filter(":checked")
-            .map(function() { return parseInt($(this).val()) })
+            .map(function() { return Number($(this).val()) })
             .get()
             .filter((e) => !Number.isNaN(e)) || [];
 
@@ -354,17 +346,17 @@ jQuery(async () => {
         saveMetadataDebounced();
     });
 
-    windowHtml.find(`#cfg_prompt_insertion_depth`).on('input', function() {
+    $(`#cfg_prompt_insertion_depth`).on('input', function() {
         chat_metadata[metadataKeys.prompt_insertion_depth] = Number($(this).val());
         saveMetadataDebounced();
     });
 
-    windowHtml.find(`#cfg_prompt_separator`).on('input', function() {
+    $(`#cfg_prompt_separator`).on('input', function() {
         chat_metadata[metadataKeys.prompt_separator] = $(this).val();
         saveMetadataDebounced();
     });
 
-    windowHtml.find('#groupchat_cfg_use_chara').on('input', function() {
+    $('#groupchat_cfg_use_chara').on('input', function() {
         const checked = !!$(this).prop('checked');
         chat_metadata[metadataKeys.groupchat_individual_chars] = checked
 
@@ -375,20 +367,126 @@ jQuery(async () => {
         saveMetadataDebounced();
     });
 
-    $("#movingDivs").append(windowHtml);
-
     initialLoadSettings();
 
     if (extension_settings.cfg) {
         migrateSettings();
     }
 
-    const buttonHtml = $(await $.get(`${extensionFolderPath}/menuButton.html`));
-    buttonHtml.on('click', onCfgMenuItemClick)
-    buttonHtml.appendTo("#options_advanced");
+    $('#option_toggle_CFG').on('click', onCfgMenuItemClick);
 
     // Hook events
     eventSource.on(event_types.CHAT_CHANGED, async () => {
         await onChatChanged();
     });
-});
+}
+
+export const cfgType = {
+    chat: 0,
+    chara: 1,
+    global: 2
+}
+
+export const metadataKeys = {
+    guidance_scale: "cfg_guidance_scale",
+    negative_prompt: "cfg_negative_prompt",
+    positive_prompt: "cfg_positive_prompt",
+    prompt_combine: "cfg_prompt_combine",
+    groupchat_individual_chars: "cfg_groupchat_individual_chars",
+    prompt_insertion_depth: "cfg_prompt_insertion_depth",
+    prompt_separator: "cfg_prompt_separator"
+}
+
+// Gets the CFG guidance scale
+// If the guidance scale is 1, ignore the CFG prompt(s) since it won't be used anyways
+export function getGuidanceScale() {
+    if (!extension_settings.cfg) {
+        console.warn("CFG extension is not enabled. Skipping CFG guidance.");
+        return;
+    }
+
+    const charaCfg = extension_settings.cfg.chara?.find((e) => e.name === getCharaFilename(this_chid));
+    const chatGuidanceScale = chat_metadata[metadataKeys.guidance_scale];
+    const groupchatCharOverride = chat_metadata[metadataKeys.groupchat_individual_chars] ?? false;
+
+    if (chatGuidanceScale && chatGuidanceScale !== 1 && !groupchatCharOverride) {
+        return {
+            type: cfgType.chat,
+            value: chatGuidanceScale
+        };
+    }
+
+    if ((!selected_group && charaCfg || groupchatCharOverride) && charaCfg?.guidance_scale !== 1) {
+        return {
+            type: cfgType.chara,
+            value: charaCfg.guidance_scale
+        };
+    }
+
+    if (extension_settings.cfg.global && extension_settings.cfg.global?.guidance_scale !== 1) {
+        return {
+            type: cfgType.global,
+            value: extension_settings.cfg.global.guidance_scale
+        };
+    }
+}
+
+/**
+ * Gets the CFG prompt separator.
+ * @returns {string} The CFG prompt separator
+ */
+function getCustomSeparator() {
+    const defaultSeparator = "\n";
+
+    try {
+        if (chat_metadata[metadataKeys.prompt_separator]) {
+            return JSON.parse(chat_metadata[metadataKeys.prompt_separator]);
+        }
+
+        return defaultSeparator;
+    } catch {
+        console.warn("Invalid JSON detected for prompt separator. Using default separator.");
+        return defaultSeparator;
+    }
+}
+
+// Gets the CFG prompt
+export function getCfgPrompt(guidanceScale, isNegative) {
+    let splitCfgPrompt = [];
+
+    const cfgPromptCombine = chat_metadata[metadataKeys.prompt_combine] ?? [];
+    if (guidanceScale.type === cfgType.chat || cfgPromptCombine.includes(cfgType.chat)) {
+        splitCfgPrompt.unshift(
+            substituteParams(
+                chat_metadata[isNegative ? metadataKeys.negative_prompt : metadataKeys.positive_prompt]
+            )
+        );
+    }
+
+    const charaCfg = extension_settings.cfg.chara?.find((e) => e.name === getCharaFilename(this_chid));
+    if (guidanceScale.type === cfgType.chara || cfgPromptCombine.includes(cfgType.chara)) {
+        splitCfgPrompt.unshift(
+            substituteParams(
+                isNegative ? charaCfg.negative_prompt : charaCfg.positive_prompt
+            )
+        );
+    }
+
+    if (guidanceScale.type === cfgType.global || cfgPromptCombine.includes(cfgType.global)) {
+        splitCfgPrompt.unshift(
+            substituteParams(
+                isNegative ? extension_settings.cfg.global.negative_prompt : extension_settings.cfg.global.positive_prompt
+            )
+        );
+    }
+
+    const customSeparator = getCustomSeparator();
+    const combinedCfgPrompt = splitCfgPrompt.filter((e) => e.length > 0).join(customSeparator);
+    const insertionDepth = chat_metadata[metadataKeys.prompt_insertion_depth] ?? 1;
+    console.log(`Setting CFG with guidance scale: ${guidanceScale.value}, negatives: ${combinedCfgPrompt}`);
+
+    return {
+        value: combinedCfgPrompt,
+        depth: insertionDepth
+    };
+}

public/scripts/chats.js

@@ -0,0 +1,73 @@
+// Move chat functions here from script.js (eventually)
+
+import {
+    chat,
+    getCurrentChatId,
+    hideSwipeButtons,
+    saveChatConditional,
+    showSwipeButtons,
+} from "../script.js";
+
+/**
+ * Mark message as hidden (system message).
+ * @param {number} messageId Message ID
+ * @param {JQuery<Element>} messageBlock Message UI element
+ * @returns
+ */
+export async function hideChatMessage(messageId, messageBlock) {
+    const chatId = getCurrentChatId();
+
+    if (!chatId || isNaN(messageId)) return;
+
+    const message = chat[messageId];
+
+    if (!message) return;
+
+    message.is_system = true;
+    messageBlock.attr('is_system', String(true));
+
+    // Reload swipes. Useful when a last message is hidden.
+    hideSwipeButtons();
+    showSwipeButtons();
+
+    await saveChatConditional();
+}
+
+/**
+ * Mark message as visible (non-system message).
+ * @param {number} messageId Message ID
+ * @param {JQuery<Element>} messageBlock Message UI element
+ * @returns
+ */
+export async function unhideChatMessage(messageId, messageBlock) {
+    const chatId = getCurrentChatId();
+
+    if (!chatId || isNaN(messageId)) return;
+
+    const message = chat[messageId];
+
+    if (!message) return;
+
+    message.is_system = false;
+    messageBlock.attr('is_system', String(false));
+
+    // Reload swipes. Useful when a last message is hidden.
+    hideSwipeButtons();
+    showSwipeButtons();
+
+    await saveChatConditional();
+}
+
+jQuery(function() {
+    $(document).on('click', '.mes_hide', async function() {
+        const messageBlock = $(this).closest('.mes');
+        const messageId = Number(messageBlock.attr('mesid'));
+        await hideChatMessage(messageId, messageBlock);
+    });
+
+    $(document).on('click', '.mes_unhide', async function() {
+        const messageBlock = $(this).closest('.mes');
+        const messageId = Number(messageBlock.attr('mesid'));
+        await unhideChatMessage(messageId, messageBlock);
+    });
+})

public/scripts/extensions.js

@@ -1,4 +1,5 @@
 import { callPopup, eventSource, event_types, saveSettings, saveSettingsDebounced, getRequestHeaders, substituteParams, renderTemplate } from "../script.js";
+import { hideLoader, showLoader } from "./loader.js";
 import { isSubsetOf } from "./utils.js";
 export {
     getContext,
@@ -11,7 +12,7 @@ export {
     ModuleWorkerWrapper,
 };
 
-let extensionNames = [];
+export let extensionNames = [];
 let manifests = {};
 const defaultUrl = "http://localhost:5100";
 
@@ -123,6 +124,7 @@ const extension_settings = {
     apiUrl: defaultUrl,
     apiKey: '',
     autoConnect: false,
+    notifyUpdates: false,
     disabledExtensions: [],
     expressionOverrides: [],
     memory: {},
@@ -134,7 +136,10 @@ const extension_settings = {
     caption: {
         refine_mode: false,
     },
-    expressions: {},
+    expressions: {
+        /** @type {string[]} */
+        custom: [],
+    },
     dice: {},
     regex: [],
     tts: {},
@@ -153,6 +158,11 @@ const extension_settings = {
     },
     speech_recognition: {},
     rvc: {},
+    hypebot: {},
+    vectors: {},
+    variables: {
+        global: {},
+    },
 };
 
 let modules = [];
@@ -192,7 +202,6 @@ async function doExtrasFetch(endpoint, args) {
     }
     Object.assign(args.headers, {
         'Authorization': `Bearer ${extension_settings.apiKey}`,
-        'Bypass-Tunnel-Reminder': 'bypass'
     });
 
     const response = await fetch(endpoint, args);
@@ -201,7 +210,7 @@ async function doExtrasFetch(endpoint, args) {
 
 async function discoverExtensions() {
     try {
-        const response = await fetch('/discover_extensions');
+        const response = await fetch('/api/extensions/discover');
 
         if (response.ok) {
             const extensions = await response.json();
@@ -363,6 +372,15 @@ function addExtensionsButtonAndMenu() {
     });
 }
 
+function notifyUpdatesInputHandler() {
+    extension_settings.notifyUpdates = !!$('#extensions_notify_updates').prop('checked');
+    saveSettingsDebounced();
+
+    if (extension_settings.notifyUpdates) {
+        checkForExtensionUpdates(true);
+    }
+}
+
 /*     $(document).on('click', function (e) {
         const target = $(e.target);
         if (target.is(dropdown)) return;
@@ -565,7 +583,7 @@ async function getExtensionData(extension) {
 function getModuleInformation() {
     let moduleInfo = modules.length ? `<p>${DOMPurify.sanitize(modules.join(', '))}</p>` : '<p class="failure">Not connected to the API!</p>';
     return `
-        <h3>Modules provided by your Extensions API:</h3>
+        <h3>Modules provided by your Extras API:</h3>
         ${moduleInfo}
     `;
 }
@@ -574,26 +592,43 @@ function getModuleInformation() {
  * Generates the HTML strings for all extensions and displays them in a popup.
  */
 async function showExtensionsDetails() {
-    let htmlDefault = '<h3>Default Extensions:</h3>';
-    let htmlExternal = '<h3>External Extensions:</h3>';
+    try{
+        showLoader();
+        let htmlDefault = '<h3>Built-in Extensions:</h3>';
+        let htmlExternal = '<h3>Installed Extensions:</h3>';
 
-    const extensions = Object.entries(manifests).sort((a, b) => a[1].loading_order - b[1].loading_order);
+        const extensions = Object.entries(manifests).sort((a, b) => a[1].loading_order - b[1].loading_order);
+        const promises = [];
 
-    for (const extension of extensions) {
-        const { isExternal, extensionHtml } = await getExtensionData(extension);
-        if (isExternal) {
-            htmlExternal += extensionHtml;
-        } else {
-            htmlDefault += extensionHtml;
+        for (const extension of extensions) {
+            promises.push(getExtensionData(extension));
         }
-    }
 
-    const html = `
-        ${getModuleInformation()}
-        ${htmlDefault}
-        ${htmlExternal}
-    `;
-    callPopup(`<div class="extensions_info">${html}</div>`, 'text');
+        const settledPromises = await Promise.allSettled(promises);
+
+        settledPromises.forEach(promise => {
+            if (promise.status === 'fulfilled') {
+                const { isExternal, extensionHtml } = promise.value;
+                if (isExternal) {
+                    htmlExternal += extensionHtml;
+                } else {
+                    htmlDefault += extensionHtml;
+                }
+            }
+        });
+
+        const html = `
+            ${getModuleInformation()}
+            ${htmlDefault}
+            ${htmlExternal}
+        `;
+        callPopup(`<div class="extensions_info">${html}</div>`, 'text');
+    } catch (error) {
+        toastr.error('Error loading extensions. See browser console for details.');
+        console.error(error);
+    } finally {
+        hideLoader();
+    }
 }
 
 
@@ -605,8 +640,17 @@ async function showExtensionsDetails() {
  */
 async function onUpdateClick() {
     const extensionName = $(this).data('name');
+    await updateExtension(extensionName, false);
+}
+
+/**
+ * Updates a third-party extension via the API.
+ * @param {string} extensionName Extension folder name
+ * @param {boolean} quiet If true, don't show a success message
+ */
+async function updateExtension(extensionName, quiet) {
     try {
-        const response = await fetch('/update_extension', {
+        const response = await fetch('/api/extensions/update', {
             method: 'POST',
             headers: getRequestHeaders(),
             body: JSON.stringify({ extensionName })
@@ -614,19 +658,24 @@ async function onUpdateClick() {
 
         const data = await response.json();
         if (data.isUpToDate) {
-            toastr.success('Extension is already up to date');
+            if (!quiet) {
+                toastr.success('Extension is already up to date');
+            }
         } else {
-            toastr.success(`Extension updated to ${data.shortCommitHash}`);
+            toastr.success(`Extension ${extensionName} updated to ${data.shortCommitHash}`);
+        }
+
+        if (!quiet) {
+            showExtensionsDetails();
         }
-        showExtensionsDetails();
     } catch (error) {
         console.error('Error:', error);
     }
-};
+}
 
 /**
  * Handles the click event for the delete button of an extension.
- * This function makes a POST request to '/delete_extension' with the extension's name.
+ * This function makes a POST request to '/api/extensions/delete' with the extension's name.
  * If the extension is deleted, it displays a success message.
  * Creates a popup for the user to confirm before delete.
  */
@@ -635,23 +684,26 @@ async function onDeleteClick() {
     // use callPopup to create a popup for the user to confirm before delete
     const confirmation = await callPopup(`Are you sure you want to delete ${extensionName}?`, 'delete_extension');
     if (confirmation) {
-        try {
-            const response = await fetch('/delete_extension', {
-                method: 'POST',
-                headers: getRequestHeaders(),
-                body: JSON.stringify({ extensionName })
-            });
-        } catch (error) {
-            console.error('Error:', error);
-        }
-        toastr.success(`Extension ${extensionName} deleted`);
-        showExtensionsDetails();
-        // reload the page to remove the extension from the list
-        location.reload();
+        await deleteExtension(extensionName);
     }
 };
 
+export async function deleteExtension(extensionName) {
+    try {
+        const response = await fetch('/api/extensions/delete', {
+            method: 'POST',
+            headers: getRequestHeaders(),
+            body: JSON.stringify({ extensionName })
+        });
+    } catch (error) {
+        console.error('Error:', error);
+    }
 
+    toastr.success(`Extension ${extensionName} deleted`);
+    showExtensionsDetails();
+    // reload the page to remove the extension from the list
+    location.reload();
+}
 
 /**
  * Fetches the version details of a specific extension.
@@ -663,7 +715,7 @@ async function onDeleteClick() {
  */
 async function getExtensionVersion(extensionName) {
     try {
-        const response = await fetch('/get_extension_version', {
+        const response = await fetch('/api/extensions/version', {
             method: 'POST',
             headers: getRequestHeaders(),
             body: JSON.stringify({ extensionName })
@@ -676,9 +728,42 @@ async function getExtensionVersion(extensionName) {
     }
 }
 
+/**
+ * Installs a third-party extension via the API.
+ * @param {string} url Extension repository URL
+ * @returns {Promise<void>}
+ */
+export async function installExtension(url) {
+    console.debug('Extension installation started', url);
 
+    toastr.info('Please wait...', 'Installing extension');
 
-async function loadExtensionSettings(settings) {
+    const request = await fetch('/api/extensions/install', {
+        method: 'POST',
+        headers: getRequestHeaders(),
+        body: JSON.stringify({ url }),
+    });
+
+    if (!request.ok) {
+        const text = await request.text();
+        toastr.warning(text || request.statusText, 'Extension installation failed', { timeOut: 5000 });
+        console.error('Extension installation failed', request.status, request.statusText, text);
+        return;
+    }
+
+    const response = await request.json();
+    toastr.success(`Extension "${response.display_name}" by ${response.author} (version ${response.version}) has been installed successfully!`, 'Extension installation successful');
+    console.debug(`Extension "${response.display_name}" has been installed successfully at ${response.extensionPath}`);
+    await loadExtensionSettings({}, false);
+    eventSource.emit(event_types.EXTENSION_SETTINGS_LOADED);
+}
+
+/**
+ * Loads extension settings from the app settings.
+ * @param {object} settings App Settings
+ * @param {boolean} versionChanged Is this a version change?
+ */
+async function loadExtensionSettings(settings, versionChanged) {
     if (settings.extension_settings) {
         Object.assign(extension_settings, settings.extension_settings);
     }
@@ -686,28 +771,117 @@ async function loadExtensionSettings(settings) {
     $("#extensions_url").val(extension_settings.apiUrl);
     $("#extensions_api_key").val(extension_settings.apiKey);
     $("#extensions_autoconnect").prop('checked', extension_settings.autoConnect);
+    $("#extensions_notify_updates").prop('checked', extension_settings.notifyUpdates);
 
     // Activate offline extensions
     eventSource.emit(event_types.EXTENSIONS_FIRST_LOAD);
     extensionNames = await discoverExtensions();
     manifests = await getManifests(extensionNames)
+
+    if (versionChanged) {
+        await autoUpdateExtensions();
+    }
+
     await activateExtensions();
     if (extension_settings.autoConnect && extension_settings.apiUrl) {
         connectToApi(extension_settings.apiUrl);
     }
 }
 
+export function doDailyExtensionUpdatesCheck() {
+    setTimeout(() => {
+        if (extension_settings.notifyUpdates) {
+            checkForExtensionUpdates(false);
+        }
+    }, 1);
+}
+
+/**
+ * Checks if there are updates available for 3rd-party extensions.
+ * @param {boolean} force Skip nag check
+ * @returns {Promise<any>}
+ */
+async function checkForExtensionUpdates(force) {
+    if (!force) {
+        const STORAGE_NAG_KEY = 'extension_update_nag';
+        const currentDate = new Date().toDateString();
+
+        // Don't nag more than once a day
+        if (localStorage.getItem(STORAGE_NAG_KEY) === currentDate) {
+            return;
+        }
+
+        localStorage.setItem(STORAGE_NAG_KEY, currentDate);
+    }
+
+    const updatesAvailable = [];
+    const promises = [];
+
+    for (const [id, manifest] of Object.entries(manifests)) {
+        if (manifest.auto_update && id.startsWith('third-party')) {
+            const promise = new Promise(async (resolve, reject) => {
+                try {
+                    const data = await getExtensionVersion(id.replace('third-party', ''));
+                    if (data.isUpToDate === false) {
+                        updatesAvailable.push(manifest.display_name);
+                    }
+                    resolve();
+                } catch (error) {
+                    console.error('Error checking for extension updates', error);
+                    reject();
+                }
+            });
+            promises.push(promise);
+        }
+    }
+
+    await Promise.allSettled(promises);
+
+    if (updatesAvailable.length > 0) {
+        toastr.info(`${updatesAvailable.map(x => `• ${x}`).join('\n')}`, 'Extension updates available');
+    }
+}
+
+async function autoUpdateExtensions() {
+    for (const [id, manifest] of Object.entries(manifests)) {
+        if (manifest.auto_update && id.startsWith('third-party')) {
+            console.debug(`Auto-updating 3rd-party extension: ${manifest.display_name} (${id})`);
+            await updateExtension(id.replace('third-party', ''), true);
+        }
+    }
+}
+
+/**
+ * Runs the generate interceptors for all extensions.
+ * @param {any[]} chat Chat array
+ * @param {number} contextSize Context size
+ * @returns {Promise<boolean>} True if generation should be aborted
+ */
 async function runGenerationInterceptors(chat, contextSize) {
+    let aborted = false;
+    let exitImmediately = false;
+
+    const abort = (/** @type {boolean} */ immediately) => {
+        aborted = true;
+        exitImmediately = immediately;
+    };
+
     for (const manifest of Object.values(manifests)) {
         const interceptorKey = manifest.generate_interceptor;
         if (typeof window[interceptorKey] === 'function') {
             try {
-                await window[interceptorKey](chat, contextSize);
+                await window[interceptorKey](chat, contextSize, abort);
             } catch (e) {
                 console.error(`Failed running interceptor for ${manifest.display_name}`, e);
             }
         }
+
+        if (exitImmediately) {
+            break;
+        }
     }
+
+    return aborted;
 }
 
 jQuery(function () {
@@ -717,8 +891,36 @@ jQuery(function () {
     $("#extensions_connect").on('click', connectClickHandler);
     $("#extensions_autoconnect").on('input', autoConnectInputHandler);
     $("#extensions_details").on('click', showExtensionsDetails);
+    $("#extensions_notify_updates").on('input', notifyUpdatesInputHandler);
     $(document).on('click', '.toggle_disable', onDisableExtensionClick);
     $(document).on('click', '.toggle_enable', onEnableExtensionClick);
     $(document).on('click', '.btn_update', onUpdateClick);
     $(document).on('click', '.btn_delete', onDeleteClick);
+
+    /**
+     * Handles the click event for the third-party extension import button.
+     * Prompts the user to enter the Git URL of the extension to import.
+     * After obtaining the Git URL, makes a POST request to '/api/extensions/install' to import the extension.
+     * If the extension is imported successfully, a success message is displayed.
+     * If the extension import fails, an error message is displayed and the error is logged to the console.
+     * After successfully importing the extension, the extension settings are reloaded and a 'EXTENSION_SETTINGS_LOADED' event is emitted.
+     *
+     * @listens #third_party_extension_button#click - The click event of the '#third_party_extension_button' element.
+     */
+    $('#third_party_extension_button').on('click', async () => {
+        const html = `<h3>Enter the Git URL of the extension to install</h3>
+    <br>
+    <p><b>Disclaimer:</b> Please be aware that using external extensions can have unintended side effects and may pose security risks. Always make sure you trust the source before importing an extension. We are not responsible for any damage caused by third-party extensions.</p>
+    <br>
+    <p>Example: <tt> https://github.com/author/extension-name </tt></p>`
+        const input = await callPopup(html, 'input');
+
+        if (!input) {
+            console.debug('Extension install cancelled');
+            return;
+        }
+
+        const url = input.trim();
+        await installExtension(url);
+    });
 });

public/scripts/extensions/assets/confirm.html

@@ -0,0 +1,9 @@
+<div class="m-b-1">
+    Are you sure you want to connect to '{{url}}'?
+</div>
+<div class="flex-container justifyCenter">
+    <label class="checkbox_label" for="assets-remember">
+        <input type="checkbox" id="assets-remember">
+        Don't ask again for this URL
+    </label>
+</div>

public/scripts/extensions/assets/index.js

@@ -1,14 +1,16 @@
 /*
 TODO:
- - Check failed install file (0kb size ?)
 */
-//const DEBUG_TONY_SAMA_FORK_MODE = false
+//const DEBUG_TONY_SAMA_FORK_MODE = true
 
 import { getRequestHeaders, callPopup } from "../../../script.js";
+import { deleteExtension, extensionNames, installExtension, renderExtensionTemplate } from "../../extensions.js";
+import { getStringHash, isValidUrl } from "../../utils.js";
 export { MODULE_NAME };
 
-const MODULE_NAME = 'Assets';
+const MODULE_NAME = 'assets';
 const DEBUG_PREFIX = "<Assets module> ";
+let previewAudio = null;
 let ASSETS_JSON_URL = "https://raw.githubusercontent.com/SillyTavern/SillyTavern-Content/main/index.json"
 
 const extensionName = "assets";
@@ -29,7 +31,7 @@ const defaultSettings = {
 
 function downloadAssetsList(url) {
     updateCurrentAssets().then(function () {
-        fetch(url)
+        fetch(url, { cache: "no-cache" })
             .then(response => response.json())
             .then(json => {
 
@@ -47,10 +49,20 @@ function downloadAssetsList(url) {
                 }
 
                 console.debug(DEBUG_PREFIX, "Updated available assets to", availableAssets);
+                // First extensions, then everything else
+                const assetTypes = Object.keys(availableAssets).sort((a, b) => (a === 'extension') ? -1 : (b === 'extension') ? 1 : 0);
 
-                for (const assetType in availableAssets) {
+                for (const assetType of assetTypes) {
                     let assetTypeMenu = $('<div />', { id: "assets_audio_ambient_div", class: "assets-list-div" });
                     assetTypeMenu.append(`<h3>${assetType}</h3>`)
+
+                    if (assetType == 'extension') {
+                        assetTypeMenu.append(`
+                        <div class="assets-list-git">
+                            To download extensions from this page, you need to have <a href="https://git-scm.com/downloads" target="_blank">Git</a> installed.
+                        </div>`);
+                    }
+
                     for (const i in availableAssets[assetType]) {
                         const asset = availableAssets[assetType][i];
                         const elemId = `assets_install_${assetType}_${i}`;
@@ -59,7 +71,7 @@ function downloadAssetsList(url) {
                         element.append(label);
 
                         //if (DEBUG_TONY_SAMA_FORK_MODE)
-                        //    assetUrl = assetUrl.replace("https://github.com/SillyTavern/","https://github.com/Tony-sama/"); // DBG
+                        //    asset["url"] = asset["url"].replace("https://github.com/SillyTavern/","https://github.com/Tony-sama/"); // DBG
 
                         console.debug(DEBUG_PREFIX, "Checking asset", asset["id"], asset["url"]);
 
@@ -71,18 +83,18 @@ function downloadAssetsList(url) {
                             label.addClass("fa-check");
                             this.classList.remove('asset-download-button-loading');
                             element.on("click", assetDelete);
-                            element.on("mouseenter", function(){
+                            element.on("mouseenter", function () {
                                 label.removeClass("fa-check");
                                 label.addClass("fa-trash");
                                 label.addClass("redOverlayGlow");
-                            }).on("mouseleave", function(){
+                            }).on("mouseleave", function () {
                                 label.addClass("fa-check");
                                 label.removeClass("fa-trash");
                                 label.removeClass("redOverlayGlow");
                             });
                         };
 
-                        const assetDelete = async function() {
+                        const assetDelete = async function () {
                             element.off("click");
                             await deleteAsset(assetType, asset["id"]);
                             label.removeClass("fa-check");
@@ -98,11 +110,11 @@ function downloadAssetsList(url) {
                             label.toggleClass("fa-download");
                             label.toggleClass("fa-check");
                             element.on("click", assetDelete);
-                            element.on("mouseenter", function(){
+                            element.on("mouseenter", function () {
                                 label.removeClass("fa-check");
                                 label.addClass("fa-trash");
                                 label.addClass("redOverlayGlow");
-                            }).on("mouseleave", function(){
+                            }).on("mouseleave", function () {
                                 label.addClass("fa-check");
                                 label.removeClass("fa-trash");
                                 label.removeClass("redOverlayGlow");
@@ -114,14 +126,28 @@ function downloadAssetsList(url) {
                             element.on("click", assetInstall);
                         }
 
-                        console.debug(DEBUG_PREFIX, "Created element for BGM", asset["id"])
+                        console.debug(DEBUG_PREFIX, "Created element for ", asset["id"])
+
+                        const displayName = DOMPurify.sanitize(asset["name"] || asset["id"]);
+                        const description = DOMPurify.sanitize(asset["description"] || "");
+                        const url = isValidUrl(asset["url"]) ? asset["url"] : "";
+                        const previewIcon = assetType == 'extension' ? 'fa-arrow-up-right-from-square' : 'fa-headphones-simple';
 
                         $(`<i></i>`)
                             .append(element)
-                            .append(`<span>${asset["id"]}</span>`)
+                            .append(`<div class="flex-container flexFlowColumn">
+                                        <span class="flex-container alignitemscenter">
+                                            <b>${displayName}</b>
+                                            <a class="asset_preview" href="${url}" target="_blank" title="Preview in browser">
+                                                <i class="fa-solid fa-sm ${previewIcon}"></i>
+                                            </a>
+                                        </span>
+                                        <span>${description}</span>
+                                     </div>`)
                             .appendTo(assetTypeMenu);
                     }
                     assetTypeMenu.appendTo("#assets_menu");
+                    assetTypeMenu.on('click', 'a.asset_preview', previewAsset);
                 }
 
                 $("#assets_menu").show();
@@ -135,8 +161,37 @@ function downloadAssetsList(url) {
     });
 }
 
+function previewAsset(e) {
+    const href = $(this).attr('href');
+    const audioExtensions = ['.mp3', '.ogg', '.wav'];
+
+    if (audioExtensions.some(ext => href.endsWith(ext))) {
+        e.preventDefault();
+
+        if (previewAudio) {
+            previewAudio.pause();
+
+            if (previewAudio.src === href) {
+                previewAudio = null;
+                return;
+            }
+        }
+
+        previewAudio = new Audio(href);
+        previewAudio.play();
+        return;
+    }
+}
+
 function isAssetInstalled(assetType, filename) {
-    for (const i of currentAssets[assetType]) {
+    let assetList = currentAssets[assetType];
+
+    if (assetType == 'extension') {
+        const thirdPartyMarker = "third-party/";
+        assetList = extensionNames.filter(x => x.startsWith(thirdPartyMarker)).map(x => x.replace(thirdPartyMarker, ''));
+    }
+
+    for (const i of assetList) {
         //console.debug(DEBUG_PREFIX,i,filename)
         if (i.includes(filename))
             return true;
@@ -149,8 +204,15 @@ async function installAsset(url, assetType, filename) {
     console.debug(DEBUG_PREFIX, "Downloading ", url);
     const category = assetType;
     try {
+        if (category === 'extension') {
+            console.debug(DEBUG_PREFIX, "Installing extension ", url)
+            await installExtension(url);
+            console.debug(DEBUG_PREFIX, "Extension installed.")
+            return;
+        }
+
         const body = { url, category, filename };
-        const result = await fetch('/asset_download', {
+        const result = await fetch('/api/assets/download', {
             method: 'POST',
             headers: getRequestHeaders(),
             body: JSON.stringify(body),
@@ -170,8 +232,14 @@ async function deleteAsset(assetType, filename) {
     console.debug(DEBUG_PREFIX, "Deleting ", assetType, filename);
     const category = assetType;
     try {
+        if (category === 'extension') {
+            console.debug(DEBUG_PREFIX, "Deleting extension ", filename)
+            await deleteExtension(filename);
+            console.debug(DEBUG_PREFIX, "Extension deleted.")
+        }
+
         const body = { category, filename };
-        const result = await fetch('/asset_delete', {
+        const result = await fetch('/api/assets/delete', {
             method: 'POST',
             headers: getRequestHeaders(),
             body: JSON.stringify(body),
@@ -194,7 +262,7 @@ async function deleteAsset(assetType, filename) {
 async function updateCurrentAssets() {
     console.debug(DEBUG_PREFIX, "Checking installed assets...")
     try {
-        const result = await fetch(`/get_assets`, {
+        const result = await fetch(`/api/assets/get`, {
             method: 'POST',
             headers: getRequestHeaders(),
         });
@@ -214,24 +282,35 @@ async function updateCurrentAssets() {
 // This function is called when the extension is loaded
 jQuery(async () => {
     // This is an example of loading HTML from a file
-    const windowHtml = $(await $.get(`${extensionFolderPath}/window.html`));
+    const windowHtml = $(renderExtensionTemplate(MODULE_NAME, 'window', {}));
 
     const assetsJsonUrl = windowHtml.find('#assets-json-url-field');
     assetsJsonUrl.val(ASSETS_JSON_URL);
 
     const connectButton = windowHtml.find('#assets-connect-button');
     connectButton.on("click", async function () {
-        const confirmation = await callPopup(`Are you sure you want to connect to '${assetsJsonUrl.val()}'?`, 'confirm')
+        const url = String(assetsJsonUrl.val());
+        const rememberKey = `Assets_SkipConfirm_${getStringHash(url)}`;
+        const skipConfirm = localStorage.getItem(rememberKey) === 'true';
+
+        const template = renderExtensionTemplate(MODULE_NAME, 'confirm', { url });
+        const confirmation = skipConfirm || await callPopup(template, 'confirm');
+
         if (confirmation) {
             try {
+                if (!skipConfirm) {
+                    const rememberValue = Boolean($('#assets-remember').prop('checked'));
+                    localStorage.setItem(rememberKey, String(rememberValue));
+                }
+
                 console.debug(DEBUG_PREFIX, "Confimation, loading assets...");
-                downloadAssetsList(assetsJsonUrl.val());
+                downloadAssetsList(url);
                 connectButton.removeClass("fa-plug-circle-exclamation");
                 connectButton.removeClass("redOverlayGlow");
                 connectButton.addClass("fa-plug-circle-check");
             } catch (error) {
                 console.error('Error:', error);
-                toastr.error(`Cannot get assets list from ${assetsJsonUrl.val()}`);
+                toastr.error(`Cannot get assets list from ${url}`);
                 connectButton.removeClass("fa-plug-circle-check");
                 connectButton.addClass("fa-plug-circle-exclamation");
                 connectButton.removeClass("redOverlayGlow");

public/scripts/extensions/assets/style.css

@@ -13,18 +13,37 @@
     padding: 5px;
 }
 
+.assets-list-git {
+    font-size: calc(var(--mainFontSize) * 0.8);
+    opacity: 0.8;
+    margin-bottom: 1em;
+}
+
+.assets-list-div h3 {
+    text-transform: capitalize;
+}
+
+.assets-list-div i a {
+    color: inherit;
+}
+
 .assets-list-div i {
     display: flex;
     flex-direction: row;
     align-items: center;
     justify-content: left;
     padding: 5px;
+    font-style: normal;
 }
 
-.assets-list-div i span{
+.assets-list-div i span {
     margin-left: 10px;
 }
 
+.assets-list-div i span:first-of-type {
+    font-weight: bold;
+}
+
 .asset-download-button {
     position: relative;
     width: 50px;
@@ -33,8 +52,8 @@
     outline: none;
     border-radius: 2px;
     cursor: pointer;
-  }
-  
+}
+
 .asset-download-button:active {
     background: #007a63;
 }
@@ -67,13 +86,11 @@
 }
 
 @keyframes asset-download-button-loading-spinner {
-from {
-    transform: rotate(0turn);
-}
+    from {
+        transform: rotate(0turn);
+    }
 
-to {
-    transform: rotate(1turn);
+    to {
+        transform: rotate(1turn);
+    }
 }
-}
-  
-  

public/scripts/extensions/assets/window.html

@@ -1,7 +1,7 @@
 <div id="assets_ui">
     <div class="inline-drawer">
         <div class="inline-drawer-toggle inline-drawer-header">
-            <b>Assets</b>
+            <b>Download Extensions & Assets</b>
             <div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
         </div>
         <div class="inline-drawer-content">

public/scripts/extensions/audio/index.js

@@ -1,593 +0,0 @@
-/*
-Ideas:
- - cross fading between bgm / start a different time
- - Background based ambient sounds
-    - import option on background UI ?
- - Allow background music edition using background menu
-    - https://fontawesome.com/icons/music?f=classic&s=solid
-    - https://codepen.io/noirsociety/pen/rNQxQwm
-    - https://codepen.io/xrocker/pen/abdKVGy
-*/
-
-import { saveSettingsDebounced, getRequestHeaders } from "../../../script.js";
-import { getContext, extension_settings, ModuleWorkerWrapper } from "../../extensions.js";
-import { isDataURL } from "../../utils.js";
-export { MODULE_NAME };
-
-const extensionName = "audio";
-const extensionFolderPath = `scripts/extensions/${extensionName}`;
-
-const MODULE_NAME = 'Audio';
-const DEBUG_PREFIX = "<Audio module> ";
-const UPDATE_INTERVAL = 1000;
-
-const ASSETS_BGM_FOLDER = "bgm";
-const ASSETS_AMBIENT_FOLDER = "ambient";
-const CHARACTER_BGM_FOLDER = "bgm"
-
-const FALLBACK_EXPRESSION = "neutral";
-const DEFAULT_EXPRESSIONS = [
-    //"talkinghead",
-    "admiration",
-    "amusement",
-    "anger",
-    "annoyance",
-    "approval",
-    "caring",
-    "confusion",
-    "curiosity",
-    "desire",
-    "disappointment",
-    "disapproval",
-    "disgust",
-    "embarrassment",
-    "excitement",
-    "fear",
-    "gratitude",
-    "grief",
-    "joy",
-    "love",
-    "nervousness",
-    "optimism",
-    "pride",
-    "realization",
-    "relief",
-    "remorse",
-    "sadness",
-    "surprise",
-    "neutral"
-];
-const SPRITE_DOM_ID = "#expression-image";
-
-let fallback_BGMS = null; // Initialized only once with module workers
-let ambients = null; // Initialized only once with module workers
-let characterMusics = {}; // Updated with module workers
-
-let currentCharacterBGM = null;
-let currentExpressionBGM = null;
-let currentBackground = null;
-
-let cooldownBGM = 0;
-
-//#############################//
-//  Extension UI and Settings  //
-//#############################//
-
-const defaultSettings = {
-    enabled: false,
-    bgm_muted: true,
-    ambient_muted: true,
-    bgm_volume: 50,
-    ambient_volume: 50,
-    bgm_cooldown: 30
-}
-
-function loadSettings() {
-    if (extension_settings.audio === undefined)
-        extension_settings.audio = {};
-
-    if (Object.keys(extension_settings.audio).length === 0) {
-        Object.assign(extension_settings.audio, defaultSettings)
-    }
-    $("#audio_enabled").prop('checked', extension_settings.audio.enabled);
-
-    $("#audio_bgm_volume").text(extension_settings.audio.bgm_volume);
-    $("#audio_ambient_volume").text(extension_settings.audio.ambient_volume);
-
-    $("#audio_bgm_volume_slider").val(extension_settings.audio.bgm_volume);
-    $("#audio_ambient_volume_slider").val(extension_settings.audio.ambient_volume);
-
-    if (extension_settings.audio.bgm_muted) {
-        $("#audio_bgm_mute_icon").removeClass("fa-volume-high");
-        $("#audio_bgm_mute_icon").addClass("fa-volume-mute");
-        $("#audio_bgm_mute").addClass("redOverlayGlow");
-        $("#audio_bgm").prop("muted", true);
-    }
-    else{
-        $("#audio_bgm_mute_icon").addClass("fa-volume-high");
-        $("#audio_bgm_mute_icon").removeClass("fa-volume-mute");
-        $("#audio_bgm_mute").removeClass("redOverlayGlow");
-        $("#audio_bgm").prop("muted", false);
-    }
-
-    if (extension_settings.audio.ambient_muted) {
-        $("#audio_ambient_mute_icon").removeClass("fa-volume-high");
-        $("#audio_ambient_mute_icon").addClass("fa-volume-mute");
-        $("#audio_ambient_mute").addClass("redOverlayGlow");
-        $("#audio_ambient").prop("muted", true);
-    }
-    else{
-        $("#audio_ambient_mute_icon").addClass("fa-volume-high");
-        $("#audio_ambient_mute_icon").removeClass("fa-volume-mute");
-        $("#audio_ambient_mute").removeClass("redOverlayGlow");
-        $("#audio_ambient").prop("muted", false);
-    }
-
-    $("#audio_bgm_cooldown").val(extension_settings.audio.bgm_cooldown);
-
-    $("#audio_debug_div").hide(); // DBG
-}
-
-async function onEnabledClick() {
-    extension_settings.audio.enabled = $('#audio_enabled').is(':checked');
-    if (extension_settings.audio.enabled) {
-        if ($("#audio_bgm").attr("src") != "")
-            $("#audio_bgm")[0].play();
-        if ($("#audio_ambient").attr("src") != "")
-            $("#audio_ambient")[0].play();
-    } else {
-        $("#audio_bgm")[0].pause();
-        $("#audio_ambient")[0].pause();
-    }
-    saveSettingsDebounced();
-}
-
-async function onBGMMuteClick() {
-    extension_settings.audio.bgm_muted = !extension_settings.audio.bgm_muted;
-    $("#audio_bgm_mute_icon").toggleClass("fa-volume-high");
-    $("#audio_bgm_mute_icon").toggleClass("fa-volume-mute");
-    $("#audio_bgm").prop("muted", !$("#audio_bgm").prop("muted"));
-    $("#audio_bgm_mute").toggleClass("redOverlayGlow");
-    saveSettingsDebounced();
-}
-
-async function onAmbientMuteClick() {
-    extension_settings.audio.ambient_muted = !extension_settings.audio.ambient_muted;
-    $("#audio_ambient_mute_icon").toggleClass("fa-volume-high");
-    $("#audio_ambient_mute_icon").toggleClass("fa-volume-mute");
-    $("#audio_ambient").prop("muted", !$("#audio_ambient").prop("muted"));
-    $("#audio_ambient_mute").toggleClass("redOverlayGlow");
-    saveSettingsDebounced();
-}
-
-async function onBGMVolumeChange() {
-    extension_settings.audio.bgm_volume = ~~($("#audio_bgm_volume_slider").val());
-    $("#audio_bgm").prop("volume", extension_settings.audio.bgm_volume * 0.01);
-    $("#audio_bgm_volume").text(extension_settings.audio.bgm_volume);
-    saveSettingsDebounced();
-    //console.debug(DEBUG_PREFIX,"UPDATED BGM MAX TO",extension_settings.audio.bgm_volume);
-}
-
-async function onAmbientVolumeChange() {
-    extension_settings.audio.ambient_volume = ~~($("#audio_ambient_volume_slider").val());
-    $("#audio_ambient").prop("volume", extension_settings.audio.ambient_volume * 0.01);
-    $("#audio_ambient_volume").text(extension_settings.audio.ambient_volume);
-    saveSettingsDebounced();
-    //console.debug(DEBUG_PREFIX,"UPDATED Ambient MAX TO",extension_settings.audio.ambient_volume);
-}
-
-async function onBGMCooldownInput() {
-    extension_settings.audio.bgm_cooldown = ~~($("#audio_bgm_cooldown").val());
-    cooldownBGM = extension_settings.audio.bgm_cooldown * 1000;
-    saveSettingsDebounced();
-    console.debug(DEBUG_PREFIX, "UPDATED BGM cooldown to", extension_settings.audio.bgm_cooldown);
-}
-
-//#############################//
-//  API Calls                  //
-//#############################//
-
-async function getAssetsList(type) {
-    console.debug(DEBUG_PREFIX, "getting assets of type", type);
-
-    try {
-        const result = await fetch(`/get_assets`, {
-            method: 'POST',
-            headers: getRequestHeaders(),
-        });
-        const assets = result.ok ? (await result.json()) : { type: [] };
-        console.debug(DEBUG_PREFIX, "Found assets:", assets);
-        return assets[type];
-    }
-    catch (err) {
-        console.log(err);
-        return [];
-    }
-}
-
-async function getCharacterBgmList(name) {
-    console.debug(DEBUG_PREFIX, "getting bgm list for", name);
-
-    try {
-        const result = await fetch(`/get_character_assets_list?name=${encodeURIComponent(name)}&category=${CHARACTER_BGM_FOLDER}`, {
-            method: 'POST',
-            headers: getRequestHeaders(),
-        });
-        let musics = result.ok ? (await result.json()) : [];
-        return musics;
-    }
-    catch (err) {
-        console.log(err);
-        return [];
-    }
-}
-
-
-//#############################//
-//  Module Worker              //
-//#############################//
-
-/*
-    - Update ambient sound
-    - Update character BGM
-        - Solo dynamique expression
-        - Group only neutral bgm
-*/
-async function moduleWorker() {
-    const moduleEnabled = extension_settings.audio.enabled;
-
-    if (moduleEnabled) {
-
-        if (cooldownBGM > 0)
-            cooldownBGM -= UPDATE_INTERVAL;
-
-        if (fallback_BGMS == null) {
-            console.debug(DEBUG_PREFIX, "Updating audio bgm assets...");
-            fallback_BGMS = await getAssetsList(ASSETS_BGM_FOLDER);
-            fallback_BGMS = fallback_BGMS.filter((filename) => filename != ".placeholder")
-            console.debug(DEBUG_PREFIX, "Detected assets:", fallback_BGMS);
-        }
-
-        if (ambients == null) {
-            console.debug(DEBUG_PREFIX, "Updating audio ambient assets...");
-            ambients = await getAssetsList(ASSETS_AMBIENT_FOLDER);
-            ambients = ambients.filter((filename) => filename != ".placeholder")
-            console.debug(DEBUG_PREFIX, "Detected assets:", ambients);
-        }
-
-        // 1) Update ambient audio
-        // ---------------------------
-        let newBackground = $("#bg1").css("background-image");
-        const custom_background = getContext()["chatMetadata"]["custom_background"];
-
-        if (custom_background !== undefined)
-            newBackground = custom_background
-
-        if (!isDataURL(newBackground)) {
-            newBackground = newBackground.substring(newBackground.lastIndexOf("/") + 1).replace(/\.[^/.]+$/, "").replaceAll("%20", "-").replaceAll(" ", "-"); // remove path and spaces
-
-            //console.debug(DEBUG_PREFIX,"Current backgroung:",newBackground);
-
-            if (currentBackground !== newBackground) {
-                currentBackground = newBackground;
-
-                console.debug(DEBUG_PREFIX, "Changing ambient audio for", currentBackground);
-                updateAmbient();
-            }
-        }
-
-        const context = getContext();
-        //console.debug(DEBUG_PREFIX,context);
-
-        if (context.chat.length == 0)
-            return;
-
-        let chatIsGroup = context.chat[0].is_group;
-        let newCharacter = null;
-
-        // 1) Update BGM (single chat)
-        // -----------------------------
-        if (!chatIsGroup) {
-            newCharacter = context.name2;
-
-            //console.log(DEBUG_PREFIX,"SOLO CHAT MODE"); // DBG
-
-            // 1.1) First time loading chat
-            if (characterMusics[newCharacter] === undefined) {
-                await loadCharacterBGM(newCharacter);
-                currentExpressionBGM = FALLBACK_EXPRESSION;
-                //currentCharacterBGM = newCharacter;
-
-                //updateBGM();
-                //cooldownBGM = BGM_UPDATE_COOLDOWN;
-                return;
-            }
-
-            // 1.2) Switched chat
-            if (currentCharacterBGM !== newCharacter) {
-                currentCharacterBGM = newCharacter;
-                try {
-                    await updateBGM();
-                    cooldownBGM = extension_settings.audio.bgm_cooldown * 1000;
-                }
-                catch (error) {
-                    console.debug(DEBUG_PREFIX, "Error while trying to update BGM character, will try again");
-                    currentCharacterBGM = null
-                }
-                return;
-            }
-
-            const newExpression = getNewExpression();
-
-            // 1.3) Same character but different expression
-            if (currentExpressionBGM !== newExpression) {
-
-                // Check cooldown
-                if (cooldownBGM > 0) {
-                    //console.debug(DEBUG_PREFIX,"(SOLO) BGM switch on cooldown:",cooldownBGM);
-                    return;
-                }
-
-                try {
-                    await updateBGM();
-                    cooldownBGM = extension_settings.audio.bgm_cooldown * 1000;
-                    currentExpressionBGM = newExpression;
-                    console.debug(DEBUG_PREFIX, "(SOLO) Updated current character expression to", currentExpressionBGM, "cooldown", cooldownBGM);
-                }
-                catch (error) {
-                    console.debug(DEBUG_PREFIX, "Error while trying to update BGM expression, will try again");
-                    currentCharacterBGM = null
-                }
-                return;
-            }
-
-            return;
-        }
-
-        // 2) Update BGM (group chat)
-        // -----------------------------
-        newCharacter = context.chat[context.chat.length - 1].name;
-        const userName = context.name1;
-
-        if (newCharacter !== undefined && newCharacter != userName) {
-
-            //console.log(DEBUG_PREFIX,"GROUP CHAT MODE"); // DBG
-
-            // 2.1) First time character appear
-            if (characterMusics[newCharacter] === undefined) {
-                await loadCharacterBGM(newCharacter);
-                return;
-            }
-
-            // 2.2) Switched chat
-            if (currentCharacterBGM !== newCharacter) {
-                // Check cooldown
-                if (cooldownBGM > 0) {
-                    //console.debug(DEBUG_PREFIX,"(GROUP) BGM switch on cooldown:",cooldownBGM);
-                    return;
-                }
-
-                try {
-                    currentCharacterBGM = newCharacter;
-                    await updateBGM();
-                    cooldownBGM = extension_settings.audio.bgm_cooldown * 1000;
-                    currentCharacterBGM = newCharacter;
-                    currentExpressionBGM = FALLBACK_EXPRESSION;
-                    console.debug(DEBUG_PREFIX, "(GROUP) Updated current character BGM to", currentExpressionBGM, "cooldown", cooldownBGM);
-                }
-                catch (error) {
-                    console.debug(DEBUG_PREFIX, "Error while trying to update BGM group, will try again");
-                    currentCharacterBGM = null
-                }
-                return;
-            }
-
-            /*
-            const newExpression = getNewExpression();
-
-            // 1.3) Same character but different expression
-            if (currentExpressionBGM !== newExpression) {
-
-                // Check cooldown
-                if (cooldownBGM > 0) {
-                    console.debug(DEBUG_PREFIX,"BGM switch on cooldown:",cooldownBGM);
-                    return;
-                }
-
-                cooldownBGM = BGM_UPDATE_COOLDOWN;
-                currentExpressionBGM = newExpression;
-                console.debug(DEBUG_PREFIX,"Updated current character expression to",currentExpressionBGM);
-                updateBGM();
-                return;
-            }
-
-            return;*/
-
-        }
-
-        // Case 3: Same character/expression or BGM switch on cooldown keep playing same BGM
-        //console.debug(DEBUG_PREFIX,"Nothing to do for",currentCharacterBGM, newCharacter, currentExpressionBGM, cooldownBGM);
-    }
-}
-
-async function loadCharacterBGM(newCharacter) {
-    console.debug(DEBUG_PREFIX, "New character detected, loading BGM folder of", newCharacter);
-
-    // 1.1) First time character appear, load its music folder
-    const audio_file_paths = await getCharacterBgmList(newCharacter);
-    //console.debug(DEBUG_PREFIX, "Recieved", audio_file_paths);
-
-    // Initialise expression/files mapping
-    characterMusics[newCharacter] = {};
-    for (const e of DEFAULT_EXPRESSIONS)
-        characterMusics[newCharacter][e] = [];
-
-    for (const i of audio_file_paths) {
-        //console.debug(DEBUG_PREFIX,"File found:",i);
-        for (const e of DEFAULT_EXPRESSIONS)
-            if (i.includes(e))
-                characterMusics[newCharacter][e].push(i);
-    }
-    console.debug(DEBUG_PREFIX, "Updated BGM map of", newCharacter, "to", characterMusics[newCharacter]);
-}
-
-function getNewExpression() {
-    let newExpression;
-
-    // HACK: use sprite file name as expression detection
-    if (!$(SPRITE_DOM_ID).length) {
-        console.error(DEBUG_PREFIX, "ERROR: expression sprite does not exist, cannot extract expression from ", SPRITE_DOM_ID)
-        return FALLBACK_EXPRESSION;
-    }
-
-    const spriteFile = $("#expression-image").attr("src");
-    newExpression = spriteFile.substring(spriteFile.lastIndexOf("/") + 1).replace(/\.[^/.]+$/, "");
-    //
-
-    // No sprite to detect expression
-    if (newExpression == "") {
-        //console.info(DEBUG_PREFIX,"Warning: no expression extracted from sprite, switch to",FALLBACK_EXPRESSION);
-        newExpression = FALLBACK_EXPRESSION;
-    }
-
-    if (!DEFAULT_EXPRESSIONS.includes(newExpression)) {
-        console.info(DEBUG_PREFIX, "Warning:", newExpression, " is not a handled expression, expected one of", FALLBACK_EXPRESSION);
-        return FALLBACK_EXPRESSION;
-    }
-
-    return newExpression;
-}
-
-async function updateBGM() {
-    let audio_files = characterMusics[currentCharacterBGM][currentExpressionBGM];// Try char expression BGM
-
-    if (audio_files === undefined || audio_files.length == 0) {
-        console.debug(DEBUG_PREFIX, "No BGM for", currentCharacterBGM, currentExpressionBGM);
-        audio_files = characterMusics[currentCharacterBGM][FALLBACK_EXPRESSION]; // Try char FALLBACK BGM
-        if (audio_files === undefined || audio_files.length == 0) {
-            console.debug(DEBUG_PREFIX, "No default BGM for", currentCharacterBGM, FALLBACK_EXPRESSION, "switch to ST BGM");
-            audio_files = fallback_BGMS; // ST FALLBACK BGM
-
-            if (audio_files.length == 0) {
-                console.debug(DEBUG_PREFIX, "No default BGM file found, bgm folder may be empty.");
-                return;
-            }
-        }
-    }
-
-    const audio_file_path = audio_files[Math.floor(Math.random() * audio_files.length)];
-    console.log(DEBUG_PREFIX, "Updating BGM");
-    console.log(DEBUG_PREFIX, "Checking file", audio_file_path);
-    try {
-        const response = await fetch(audio_file_path);
-
-        if (!response.ok) {
-            console.log(DEBUG_PREFIX, "File not found!")
-        }
-        else {
-            console.log(DEBUG_PREFIX, "Switching BGM to", currentExpressionBGM)
-            const audio = $("#audio_bgm");
-
-            if (audio.attr("src") == audio_file_path) {
-                console.log(DEBUG_PREFIX, "Already playing, ignored");
-                return;
-            }
-
-            audio.animate({ volume: 0.0 }, 2000, function () {
-                audio.attr("src", audio_file_path);
-                audio[0].play();
-                audio.volume = extension_settings.audio.bgm_volume * 0.01;
-                audio.animate({ volume: extension_settings.audio.bgm_volume * 0.01 }, 2000);
-            })
-        }
-
-    } catch (error) {
-        console.log(DEBUG_PREFIX, "Error while trying to fetch", audio_file_path, ":", error);
-    }
-}
-
-async function updateAmbient() {
-    let audio_file_path = null;
-    for (const i of ambients) {
-        console.debug(i)
-        if (i.includes(currentBackground)) {
-            audio_file_path = i;
-            break;
-        }
-    }
-
-    if (audio_file_path === null) {
-        console.debug(DEBUG_PREFIX, "No ambient file found for background", currentBackground);
-        const audio = $("#audio_ambient");
-        audio.attr("src", "");
-        audio[0].pause();
-        return;
-    }
-
-    //const audio_file_path = AMBIENT_FOLDER+currentBackground+".mp3";
-    console.log(DEBUG_PREFIX, "Updating ambient");
-    console.log(DEBUG_PREFIX, "Checking file", audio_file_path);
-
-    const audio = $("#audio_ambient");
-    audio.animate({ volume: 0.0 }, 2000, function () {
-        audio.attr("src", audio_file_path);
-        audio[0].play();
-        audio.volume = extension_settings.audio.ambient_volume * 0.01;
-        audio.animate({ volume: extension_settings.audio.ambient_volume * 0.01 }, 2000);
-    });
-}
-
-//#############################//
-//  Extension load             //
-//#############################//
-
-// This function is called when the extension is loaded
-jQuery(async () => {
-    // This is an example of loading HTML from a file
-    const windowHtml = $(await $.get(`${extensionFolderPath}/window.html`));
-
-    $('#extensions_settings').append(windowHtml);
-    loadSettings();
-
-    $("#audio_bgm").attr("loop", true);
-    $("#audio_ambient").attr("loop", true);
-
-    $("#audio_bgm").hide();
-    $("#audio_ambient").hide();
-    $("#audio_bgm_mute").on("click", onBGMMuteClick);
-    $("#audio_ambient_mute").on("click", onAmbientMuteClick);
-
-    $("#audio_enabled").on("click", onEnabledClick);
-    $("#audio_bgm_volume_slider").on("input", onBGMVolumeChange);
-    $("#audio_ambient_volume_slider").on("input", onAmbientVolumeChange);
-
-    $("#audio_bgm_cooldown").on("input", onBGMCooldownInput);
-
-    // Reset assets container, will be redected like if ST restarted
-    $("#audio_refresh_assets").on("click", function(){
-        console.debug(DEBUG_PREFIX,"Refreshing audio assets");
-        fallback_BGMS = null;
-        ambients = null;
-        characterMusics = {};
-        currentCharacterBGM = null;
-        currentExpressionBGM = null;
-        currentBackground = null;
-    })
-
-    // DBG
-    $("#audio_debug").on("click", function () {
-        if ($("#audio_debug").is(':checked')) {
-            $("#audio_bgm").show();
-            $("#audio_ambient").show();
-        }
-        else {
-            $("#audio_bgm").hide();
-            $("#audio_ambient").hide();
-        }
-    });
-    //
-
-    const wrapper = new ModuleWorkerWrapper(moduleWorker);
-    setInterval(wrapper.update.bind(wrapper), UPDATE_INTERVAL);
-    moduleWorker();
-});

public/scripts/extensions/audio/manifest.json

@@ -1,11 +0,0 @@
-{
-    "display_name": "Dynamic Audio",
-    "loading_order": 14,
-    "requires": [],
-    "optional": ["classify"],
-    "js": "index.js",
-    "css": "style.css",
-    "author": "Keij#6799 and Deffcolony",
-    "version": "0.1.0",
-    "homePage": "https://github.com/SillyTavern/SillyTavern"
-}

public/scripts/extensions/audio/style.css

@@ -1,22 +0,0 @@
-.mixer-div {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    justify-content: center;
-    padding: 5px;
-}
-
-.audio-mute-button {
-    padding: 5px;
-    width: 50px;
-    height: 30px;
-}
-
-.audio-mute-button-muted {
-    color: red;
-}
-
-#audio_refresh_assets {
-    width: 50px;
-    height: 30px;
-}

public/scripts/extensions/audio/window.html

@@ -1,66 +0,0 @@
-<div id="audio_settings">
-    <div class="inline-drawer">
-        <div class="inline-drawer-toggle inline-drawer-header">
-            <b>Dynamic Audio</b>
-            <div class="inline-drawer-icon fa-solid fa-circle-chevron-down down"></div>
-        </div>
-        <div class="inline-drawer-content">
-            <div>
-                <label class="checkbox_label" for="audio_enabled">
-                    <input type="checkbox" id="audio_enabled" name="audio_enabled">
-                    <small>Enabled</small>
-                </label>
-                <div id="audio_debug_div">
-                    <label class="checkbox_label" for="audio_debug">
-                        <input type="checkbox" id="audio_debug" name="audio_debug">
-                        <small>Debug</small>
-                    </label>
-                </div>
-                <div>
-                    <label for="audio_refresh_assets">Refresh assets</label>
-                    <div id="audio_refresh_assets" class="menu_button">
-                        <i class="fa-solid fa-refresh fa-lg"></i>
-                    </div>
-                </div>
-            </div>
-            <div>
-                <div>
-                    <label for="audio_bgm_volume_slider">Music <span id="audio_bgm_volume"></span></label>
-                    <div class="mixer-div">
-                        <div id="audio_bgm_mute" class="menu_button audio-mute-button">
-                            <i class="fa-solid fa-volume-high fa-lg" id="audio_bgm_mute_icon"></i>
-                        </div>
-                        <input type="range" class ="slider" id ="audio_bgm_volume_slider" value = "0" maxlength ="100">
-                    </div>
-                    <audio id="audio_bgm" controls src="">
-                </div>
-                <div>
-                    <label for="audio_ambient_volume_slider">Ambient <span id="audio_ambient_volume"></span></label>
-                    <div class="mixer-div">
-                        <div id="audio_ambient_mute" class="menu_button audio-mute-button">
-                            <i class="fa-solid fa-volume-high fa-lg" id="audio_ambient_mute_icon"></i>
-                        </div>
-                        <input type="range" class ="slider" id ="audio_ambient_volume_slider" value = "0" maxlength ="100">
-                    </div>
-                    <audio id="audio_ambient" controls src="">
-                </div>
-                <div>
-                    <label for="audio_bgm_cooldown">Music update cooldown (in seconds)</label>
-                    <input id="audio_bgm_cooldown" class="text_pole wide30p">
-                </div>
-            </div>
-            <div>
-                <b>Hint:</b>
-                <i>
-                    Create new folder in the
-                    <b>public/characters/</b>
-                    folder and name it as the name of the character.
-                    Create a folder name <b>bgm</b> inside of it.
-                    Put bgm music with expressions there. File names should follow the pattern:
-                    <it>[expression_label]_[number].mp3</it>
-                    By default one of the <it>neutral_[number].mp3</it> will play if classify module is not active. 
-                </i>
-            </div>
-        </div>
-    </div>
-</div>