Update quick edit textareas when prompt manager re-renders
This commit is contained in:
maver
parent
8f830a0928
commit
2bb8fa5ea1
|
|
@ -1350,22 +1350,9 @@
|
|||
<div class="fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
|
||||
</div>
|
||||
<div class="inline-drawer-content">
|
||||
<div class="range-block m-t-1">
|
||||
<div class="justifyLeft" data-i18n="Main">Main</div>
|
||||
<div class="wide100p">
|
||||
<textarea id="main_prompt_quick_edit_textarea" class="text_pole textarea_compact" name="main_prompt" rows="6" placeholder=""></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block m-t-1">
|
||||
<div class="justifyLeft" data-i18n="NSFW">NSFW</div>
|
||||
<div class="wide100p">
|
||||
<textarea id="nsfw_prompt_quick_edit_textarea" class="text_pole textarea_compact" name="nsfw_prompt" rows="6" placeholder=""></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block m-t-1">
|
||||
<div class="justifyLeft" data-i18n="Jailbreak">Jailbreak</div>
|
||||
<div class="wide100p">
|
||||
<textarea id="jailbreak_prompt_quick_edit_textarea" class="text_pole textarea_compact" name="jailbreak_prompt" rows="6" placeholder=""></textarea>
|
||||
<div id="quick-edit-container">
|
||||
<div class="range-block">
|
||||
<span data-i18n="Select a character to show quick edit options.">Select a character to show quick edit options.</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="range-block" data-source="claude">
|
||||
|
|
|
|||
|
|
@ -1,8 +1,23 @@
|
|||
import {callPopup, event_types, eventSource, is_send_press, main_api, saveSettingsDebounced, substituteParams} from "../script.js";
|
||||
import {callPopup, event_types, eventSource, is_send_press, main_api, substituteParams} from "../script.js";
|
||||
import {TokenHandler} from "./openai.js";
|
||||
import {power_user} from "./power-user.js";
|
||||
import { debounce, waitUntilCondition } from "./utils.js";
|
||||
|
||||
function debouncePromise(func, delay) {
|
||||
let timeoutId;
|
||||
|
||||
return (...args) => {
|
||||
clearTimeout(timeoutId);
|
||||
|
||||
return new Promise((resolve) => {
|
||||
timeoutId = setTimeout(() => {
|
||||
const result = func(...args);
|
||||
resolve(result);
|
||||
}, delay);
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Register migrations for the prompt manager when settings are loaded or an Open AI preset is loaded.
|
||||
*/
|
||||
|
|
@ -158,11 +173,6 @@ function PromptManagerModule() {
|
|||
nsfw: '',
|
||||
jailbreak: '',
|
||||
enhanceDefinitions: ''
|
||||
},
|
||||
quickEdit: {
|
||||
main: '',
|
||||
nsfw: '',
|
||||
jailbreak: ''
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -307,41 +317,6 @@ PromptManagerModule.prototype.init = function (moduleConfiguration, serviceSetti
|
|||
this.saveServiceSettings().then(() => this.render());
|
||||
};
|
||||
|
||||
// Factory function for creating quick edit elements
|
||||
const createQuickEdit = function() {
|
||||
return {
|
||||
element: null,
|
||||
prompt: null,
|
||||
|
||||
from(element, prompt) {
|
||||
this.element = element;
|
||||
element.value = prompt.content ?? '';
|
||||
element.addEventListener('input', () => {
|
||||
prompt.content = element.value;
|
||||
saveSettingsDebounced()
|
||||
});
|
||||
|
||||
return this;
|
||||
},
|
||||
|
||||
update(value) {
|
||||
this.element.value = value;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const mainPrompt = this.getPromptById('main');
|
||||
const mainPromptTextarea = document.getElementById(this.configuration.quickEdit.main);
|
||||
const mainQuickEdit = createQuickEdit().from(mainPromptTextarea, mainPrompt);
|
||||
|
||||
const nsfwPrompt = this.getPromptById('nsfw');
|
||||
const nsfwPromptTextarea = document.getElementById(this.configuration.quickEdit.nsfw);
|
||||
const nsfwQuickEdit = createQuickEdit().from(nsfwPromptTextarea, nsfwPrompt);
|
||||
|
||||
const jailbreakPrompt = this.getPromptById('jailbreak');
|
||||
const jailbreakPromptTextarea = document.getElementById(this.configuration.quickEdit.jailbreak);
|
||||
const jailbreakQuickEdit = createQuickEdit().from(jailbreakPromptTextarea, jailbreakPrompt);
|
||||
|
||||
// Save prompt edit form to settings and close form.
|
||||
this.handleSavePrompt = (event) => {
|
||||
const promptId = event.target.dataset.pmPrompt;
|
||||
|
|
@ -355,9 +330,9 @@ PromptManagerModule.prototype.init = function (moduleConfiguration, serviceSetti
|
|||
this.updatePromptWithPromptEditForm(prompt);
|
||||
}
|
||||
|
||||
if ('main' === promptId) mainQuickEdit.update(prompt.content);
|
||||
if ('nsfw' === promptId) nsfwQuickEdit.update(prompt.content);
|
||||
if ('jailbreak' === promptId) jailbreakQuickEdit.update(prompt.content);
|
||||
if ('main' === promptId) this.updateQuickEdit('main', prompt);
|
||||
if ('nsfw' === promptId) this.updateQuickEdit('nsfw', prompt);
|
||||
if ('jailbreak' === promptId) this.updateQuickEdit('jailbreak', prompt);
|
||||
|
||||
this.log('Saved prompt: ' + promptId);
|
||||
|
||||
|
|
@ -952,6 +927,42 @@ PromptManagerModule.prototype.preparePrompt = function (prompt, original = null)
|
|||
return preparedPrompt;
|
||||
}
|
||||
|
||||
/**
|
||||
* Factory function for creating a QuickEdit object associated with a prompt element.
|
||||
*
|
||||
* The QuickEdit object provides methods to synchronize an input element's value with a prompt's content
|
||||
* and handle input events to update the prompt content.
|
||||
*
|
||||
*/
|
||||
PromptManagerModule.prototype.createQuickEdit = function(identifier, title) {
|
||||
const prompt = this.getPromptById(identifier);
|
||||
const textareaIdentifier = `${identifier}_prompt_quick_edit_textarea`;
|
||||
const html = `<div class="range-block m-t-1">
|
||||
<div class="justifyLeft" data-i18n="${title}">${title}</div>
|
||||
<div class="wide100p">
|
||||
<textarea id="${textareaIdentifier}" class="text_pole textarea_compact" rows="6" placeholder="">${prompt.content}</textarea>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
const quickEditContainer = document.getElementById('quick-edit-container');
|
||||
quickEditContainer.insertAdjacentHTML('afterbegin', html);
|
||||
|
||||
const debouncedSaveServiceSettings = debouncePromise(() => this.saveServiceSettings(), 300);
|
||||
|
||||
const textarea = document.getElementById(textareaIdentifier);
|
||||
textarea.addEventListener('blur', () => {
|
||||
prompt.content = textarea.value;
|
||||
this.updatePromptByIdentifier(identifier, prompt);
|
||||
debouncedSaveServiceSettings().then(() => this.render());
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
PromptManagerModule.prototype.updateQuickEdit = function(identifier, prompt) {
|
||||
const textarea = document.getElementById(`${identifier}_prompt_quick_edit_textarea`);
|
||||
textarea.value = prompt.content;
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks if a given name is accepted by OpenAi API
|
||||
* @link https://platform.openai.com/docs/api-reference/chat/create
|
||||
|
|
@ -1241,6 +1252,13 @@ PromptManagerModule.prototype.renderPromptManager = function () {
|
|||
footerDiv.querySelector('#prompt-manager-export').addEventListener('click', showExportSelection);
|
||||
rangeBlockDiv.querySelector('.export-promptmanager-prompts-full').addEventListener('click', this.handleFullExport);
|
||||
rangeBlockDiv.querySelector('.export-promptmanager-prompts-character').addEventListener('click', this.handleCharacterExport);
|
||||
|
||||
const quickEditContainer = document.getElementById('quick-edit-container');
|
||||
quickEditContainer.innerHTML = '';
|
||||
|
||||
this.createQuickEdit('jailbreak', 'Jailbreak');
|
||||
this.createQuickEdit('nsfw', 'NSFW');
|
||||
this.createQuickEdit('main', 'Main');
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -347,11 +347,6 @@ function setupChatCompletionPromptManager(openAiSettings) {
|
|||
nsfw: default_nsfw_prompt,
|
||||
jailbreak: default_jailbreak_prompt,
|
||||
enhanceDefinitions: default_enhance_definitions_prompt
|
||||
},
|
||||
quickEdit: {
|
||||
main: 'main_prompt_quick_edit_textarea',
|
||||
nsfw: 'nsfw_prompt_quick_edit_textarea',
|
||||
jailbreak: 'jailbreak_prompt_quick_edit_textarea'
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue