From d0f59edf09dbeb67b2bc6726e4d34899dc0f2957 Mon Sep 17 00:00:00 2001
From: Cohee <18619528+Cohee1207@users.noreply.github.com>
Date: Tue, 25 Jun 2024 21:24:03 +0300
Subject: [PATCH] Update forbid media and field extend to new popup

---
 public/index.html                         | 27 +----------------------
 public/scripts/chats.js                   |  8 +++----
 public/scripts/templates/forbidMedia.html | 24 ++++++++++++++++++++
 3 files changed, 29 insertions(+), 30 deletions(-)
 create mode 100644 public/scripts/templates/forbidMedia.html

diff --git a/public/index.html b/public/index.html
index 49ae1ec10..15ae9a976 100644
--- a/public/index.html
+++ b/public/index.html
@@ -5908,32 +5908,7 @@
             <textarea name="alternate_greetings" data-i18n="[placeholder](This will be the first message from the character that starts every chat)" placeholder="(This will be the first message from the character that starts every chat)" class="text_pole textarea_compact alternate_greeting_text" maxlength="50000" value="" autocomplete="off" rows="16"></textarea>
         </div>
     </div>
-    <div id="forbid_media_override_template" class="template_element">
-        <div class="forbid_media_override flex-container flexFlowColumn">
-            <h4 data-i18n="Forbid Media Override explanation" class="margin0">
-                Ability of the current character/group to use external media in chats.
-            </h4>
-            <small data-i18n="Forbid Media Override subtitle" class="marginBot5">
-                Media: images, videos, audio. External: not hosted on the local server.
-            </small>
-            <label class="checkbox_label" for="forbid_media_override_global">
-                <input type="radio" id="forbid_media_override_global" name="forbid_media_override" />
-                <span>
-                    <span data-i18n="Use global setting">Use global setting</span>
-                    <b class="forbid_media_global_state_forbidden">(forbidden)</b>
-                    <b class="forbid_media_global_state_allowed">(allowed)</b>
-                </span>
-            </label>
-            <label class="checkbox_label" for="forbid_media_override_forbidden">
-                <input type="radio" id="forbid_media_override_forbidden" name="forbid_media_override" />
-                <span data-i18n="Always forbidden">Always forbidden</span>
-            </label>
-            <label class="checkbox_label" for="forbid_media_override_allowed">
-                <input type="radio" id="forbid_media_override_allowed" name="forbid_media_override" />
-                <span data-i18n="Always allowed">Always allowed</span>
-            </label>
-        </div>
-    </div>
+
     <!-- chat and input bar -->
     <div id="typing_indicator_template" class="template_element">
         <div class="typing_indicator"><span class="typing_indicator_name">CHAR</span> is typing</div>
diff --git a/public/scripts/chats.js b/public/scripts/chats.js
index 83069aaab..2402dd2db 100644
--- a/public/scripts/chats.js
+++ b/public/scripts/chats.js
@@ -4,7 +4,6 @@ import css from '../lib/css-parser.mjs';
 import {
     addCopyToCodeBlocks,
     appendMediaToMessage,
-    callPopup,
     characters,
     chat,
     eventSource,
@@ -38,6 +37,7 @@ import { extension_settings, renderExtensionTemplateAsync, saveMetadataDebounced
 import { POPUP_RESULT, POPUP_TYPE, Popup, callGenericPopup } from './popup.js';
 import { ScraperManager } from './scrapers.js';
 import { DragAndDropHandler } from './dragdrop.js';
+import { renderTemplateAsync } from './templates.js';
 
 /**
  * @typedef {Object} FileAttachment
@@ -524,7 +524,7 @@ async function openExternalMediaOverridesDialog() {
         return;
     }
 
-    const template = $('#forbid_media_override_template > .forbid_media_override').clone();
+    const template = $(await renderTemplateAsync('forbidMedia'));
     template.find('.forbid_media_global_state_forbidden').toggle(power_user.forbid_external_media);
     template.find('.forbid_media_global_state_allowed').toggle(!power_user.forbid_external_media);
 
@@ -538,7 +538,7 @@ async function openExternalMediaOverridesDialog() {
         template.find('#forbid_media_override_global').prop('checked', true);
     }
 
-    callPopup(template, 'text', '', { wide: false, large: false });
+    callGenericPopup(template, POPUP_TYPE.TEXT, '', { wide: false, large: false });
 }
 
 export function getCurrentEntityId() {
@@ -1465,7 +1465,7 @@ jQuery(function () {
             });
         }
 
-        callPopup(wrapper, 'text', '', { wide: true, large: true });
+        callGenericPopup(wrapper, POPUP_TYPE.TEXT, '', { wide: true, large: true });
     });
 
     $(document).on('click', 'body.documentstyle .mes .mes_text', function () {
diff --git a/public/scripts/templates/forbidMedia.html b/public/scripts/templates/forbidMedia.html
new file mode 100644
index 000000000..9d2be6834
--- /dev/null
+++ b/public/scripts/templates/forbidMedia.html
@@ -0,0 +1,24 @@
+<div class="forbid_media_override flex-container flexFlowColumn">
+    <h4 data-i18n="Forbid Media Override explanation" class="margin0">
+        Ability of the current character/group to use external media in chats.
+    </h4>
+    <small data-i18n="Forbid Media Override subtitle" class="marginBot5">
+        Media: images, videos, audio. External: not hosted on the local server.
+    </small>
+    <label class="checkbox_label" for="forbid_media_override_global">
+        <input type="radio" id="forbid_media_override_global" name="forbid_media_override" />
+        <span>
+            <span data-i18n="Use global setting">Use global setting</span>
+            <b class="forbid_media_global_state_forbidden">(forbidden)</b>
+            <b class="forbid_media_global_state_allowed">(allowed)</b>
+        </span>
+    </label>
+    <label class="checkbox_label" for="forbid_media_override_forbidden">
+        <input type="radio" id="forbid_media_override_forbidden" name="forbid_media_override" />
+        <span data-i18n="Always forbidden">Always forbidden</span>
+    </label>
+    <label class="checkbox_label" for="forbid_media_override_allowed">
+        <input type="radio" id="forbid_media_override_allowed" name="forbid_media_override" />
+        <span data-i18n="Always allowed">Always allowed</span>
+    </label>
+</div>