From 09fc42a787b4d8597f35f4a5b1ba8bd203827201 Mon Sep 17 00:00:00 2001
From: Cohee <18619528+Cohee1207@users.noreply.github.com>
Date: Wed, 13 Sep 2023 01:40:01 +0300
Subject: [PATCH] Lock extensions display order in top and context menus

---
 public/css/extensions-panel.css               | 81 ++++++++++++++++++-
 public/script.js                              |  3 +-
 public/scripts/extensions/caption/index.js    |  4 +-
 public/scripts/extensions/caption/style.css   | 10 ++-
 public/scripts/extensions/dice/style.css      |  1 +
 public/scripts/extensions/objective/style.css |  4 +
 public/scripts/extensions/randomize/index.js  |  2 +-
 .../extensions/stable-diffusion/style.css     |  1 +
 .../extensions/token-counter/style.css        |  3 +
 public/scripts/extensions/translate/style.css |  4 +
 public/scripts/extensions/tts/style.css       |  1 +
 11 files changed, 105 insertions(+), 9 deletions(-)

diff --git a/public/css/extensions-panel.css b/public/css/extensions-panel.css
index 1179292b2..5e8e9a49d 100644
--- a/public/css/extensions-panel.css
+++ b/public/css/extensions-panel.css
@@ -93,4 +93,83 @@ input.extension_missing[type="checkbox"] {
 .update-button {
     margin-right: 10px;
     display: inline-flex;
-}
\ No newline at end of file
+}
+
+/* Fixes order of settings for extensions */
+#extensions_settings,
+#extensions_settings2 {
+    display: flex;
+    flex-direction: column;
+}
+
+#extensions_settings>.expression_settings {
+    order: 1;
+}
+
+#extensions_settings>.background_settings {
+    order: 2;
+}
+
+#extensions_settings>.sd_settings {
+    order: 3;
+}
+
+#extensions_settings>#tts_settings {
+    order: 4;
+}
+
+#extensions_settings>#rvc_settings {
+    order: 5;
+}
+
+#extensions_settings>.objective-settings {
+    order: 6;
+}
+
+#extensions_settings>#speech_recognition_settings {
+    order: 7;
+}
+
+#extensions_settings>#audio_settings {
+    order: 8;
+}
+
+#extensions_settings>#assets_ui {
+    order: 9;
+}
+
+#extensions_settings2>.translation_settings {
+    order: 1;
+}
+
+#extensions_settings2>.caption_settings {
+    order: 2;
+}
+
+#extensions_settings2>.quickReplySettings {
+    order: 3;
+}
+
+#extensions_settings2>#memory_settings {
+    order: 4;
+}
+
+#extensions_settings2>.hypebot_settings {
+    order: 5;
+}
+
+#extensions_settings2>.regex_settings {
+    order: 6;
+}
+
+#extensions_settings2>.vectors_settings {
+    order: 7;
+}
+
+#extensions_settings2>.chromadb_settings {
+    order: 8;
+}
+
+#extensions_settings2>.randomizer_settings {
+    order: 9;
+}
diff --git a/public/script.js b/public/script.js
index cdc790ada..ad9f7e9f2 100644
--- a/public/script.js
+++ b/public/script.js
@@ -6053,8 +6053,7 @@ function enlargeMessageImage() {
     const img = document.createElement('img');
     img.classList.add('img_enlarged');
     img.src = imgSrc;
-    $('#dialogue_popup').addClass('wide_dialogue_popup');
-    callPopup(img.outerHTML, 'text');
+    callPopup(img.outerHTML, 'text', '', { wide: true, large: true });
 }
 
 function updateAlternateGreetingsHintVisibility(root) {
diff --git a/public/scripts/extensions/caption/index.js b/public/scripts/extensions/caption/index.js
index 5e8f9a64a..c199c3c2a 100644
--- a/public/scripts/extensions/caption/index.js
+++ b/public/scripts/extensions/caption/index.js
@@ -144,7 +144,7 @@ jQuery(function () {
         const sendButton = $(`
         <div id="send_picture" class="list-group-item flex-container flexGap5">
             <div class="fa-solid fa-image extensionsMenuExtensionButton"></div>
-            Send a picture
+            Send a Picture
         </div>`);
 
         $('#extensionsMenu').prepend(sendButton);
@@ -171,7 +171,7 @@ jQuery(function () {
     }
     function addSettings() {
         const html = `
-        <div class="background_settings">
+        <div class="caption_settings">
             <div class="inline-drawer">
                 <div class="inline-drawer-toggle inline-drawer-header">
                     <b>Image Captioning</b>
diff --git a/public/scripts/extensions/caption/style.css b/public/scripts/extensions/caption/style.css
index 58f93eb55..9af403ba7 100644
--- a/public/scripts/extensions/caption/style.css
+++ b/public/scripts/extensions/caption/style.css
@@ -1,3 +1,7 @@
-#img_form {
-    display: none;
-}
+#img_form {
+    display: none;
+}
+
+#send_picture {
+    order: 4;
+}
diff --git a/public/scripts/extensions/dice/style.css b/public/scripts/extensions/dice/style.css
index 2e9cfc42e..89b9262e7 100644
--- a/public/scripts/extensions/dice/style.css
+++ b/public/scripts/extensions/dice/style.css
@@ -11,6 +11,7 @@
     opacity: 0.7;
     display: flex;
     align-items: center;
+    order: 4;
     /* justify-content: center; */
 
 }
diff --git a/public/scripts/extensions/objective/style.css b/public/scripts/extensions/objective/style.css
index cc20b1769..86cc30013 100644
--- a/public/scripts/extensions/objective/style.css
+++ b/public/scripts/extensions/objective/style.css
@@ -50,3 +50,7 @@
     margin: unset;
     margin-bottom: 5px !important;
 }
+
+#objective-task-manual-check-menu-item {
+    order: 3;
+}
diff --git a/public/scripts/extensions/randomize/index.js b/public/scripts/extensions/randomize/index.js
index c0950788f..e86567907 100644
--- a/public/scripts/extensions/randomize/index.js
+++ b/public/scripts/extensions/randomize/index.js
@@ -136,7 +136,7 @@ jQuery(() => {
         </div>
     </div>`;
 
-    $('#extensions_settings').append(html);
+    $('#extensions_settings2').append(html);
     $('#ai_response_configuration .range-block-counter').each(addRandomizeButton);
     $('#randomizer_enabled').on('input', onRandomizerEnabled);
     $('#randomizer_enabled').prop('checked', extension_settings.randomizer.enabled).trigger('input');
diff --git a/public/scripts/extensions/stable-diffusion/style.css b/public/scripts/extensions/stable-diffusion/style.css
index abba77a81..50b682d52 100644
--- a/public/scripts/extensions/stable-diffusion/style.css
+++ b/public/scripts/extensions/stable-diffusion/style.css
@@ -15,6 +15,7 @@
     opacity: 0.7;
     display: flex;
     align-items: center;
+    order: 6;
     /* justify-content: center; */
 }
 
diff --git a/public/scripts/extensions/token-counter/style.css b/public/scripts/extensions/token-counter/style.css
index e69de29bb..fc88faee4 100644
--- a/public/scripts/extensions/token-counter/style.css
+++ b/public/scripts/extensions/token-counter/style.css
@@ -0,0 +1,3 @@
+#token_counter {
+    order: 2;
+}
diff --git a/public/scripts/extensions/translate/style.css b/public/scripts/extensions/translate/style.css
index d040065ae..482dcd82d 100644
--- a/public/scripts/extensions/translate/style.css
+++ b/public/scripts/extensions/translate/style.css
@@ -4,3 +4,7 @@
     gap: 10px;
     flex-direction: row;
 }
+
+#translate_chat {
+    order: 7;
+}
diff --git a/public/scripts/extensions/tts/style.css b/public/scripts/extensions/tts/style.css
index 0f4a2c70c..3c5cff8cc 100644
--- a/public/scripts/extensions/tts/style.css
+++ b/public/scripts/extensions/tts/style.css
@@ -16,6 +16,7 @@
 }
 
 #ttsExtensionMenuItem {
+    order: 1;
     transition: 0.3s;
     opacity: 0.7;
 }