Update prompt itemization to new popup

This commit is contained in:
Wolfsblvt
2024-06-26 04:49:07 +02:00
parent c8411b6dfb
commit c55452d0ea
5 changed files with 49 additions and 57 deletions

View File

@@ -6400,9 +6400,6 @@
</div> </div>
</div> </div>
</template> </template>
<div id="rawPromptPopup" class="list-group">
<div id="rawPromptWrapper" class="tokenItemizingSubclass"></div>
</div>
<div id="user_avatar_template" class="template_element"> <div id="user_avatar_template" class="template_element">
<div class="avatar-container"> <div class="avatar-container">
<div imgfile="" class="avatar"> <div imgfile="" class="avatar">

View File

@@ -513,9 +513,6 @@ let optionsPopper = Popper.createPopper(document.getElementById('options_button'
let exportPopper = Popper.createPopper(document.getElementById('export_button'), document.getElementById('export_format_popup'), { let exportPopper = Popper.createPopper(document.getElementById('export_button'), document.getElementById('export_format_popup'), {
placement: 'left', placement: 'left',
}); });
let rawPromptPopper = Popper.createPopper(document.getElementById('dialogue_popup'), document.getElementById('rawPromptPopup'), {
placement: 'right',
});
// Saved here for performance reasons // Saved here for performance reasons
const messageTemplate = $('#message_template .mes'); const messageTemplate = $('#message_template .mes');
@@ -4890,14 +4887,44 @@ async function promptItemize(itemizedPrompts, requestedMesId) {
const params = await itemizedParams(itemizedPrompts, thisPromptSet); const params = await itemizedParams(itemizedPrompts, thisPromptSet);
if (params.this_main_api == 'openai') { const template = params.this_main_api == 'openai'
const template = await renderTemplateAsync('itemizationChat', params); ? await renderTemplateAsync('itemizationChat', params)
callPopup(template, 'text'); : await renderTemplateAsync('itemizationText', params);
} else { const popup = new Popup(template, POPUP_TYPE.TEXT);
const template = await renderTemplateAsync('itemizationText', params);
callPopup(template, 'text'); popup.dlg.querySelector('#copyPromptToClipboard').addEventListener('click', function () {
let rawPrompt = itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt;
let rawPromptValues = rawPrompt;
if (Array.isArray(rawPrompt)) {
rawPromptValues = rawPrompt.map(x => x.content).join('\n');
} }
navigator.clipboard.writeText(rawPromptValues);
toastr.info('Copied!');
});
popup.dlg.querySelector('#showRawPrompt').addEventListener('click', function () {
//console.log(itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt);
console.log(PromptArrayItemForRawPromptDisplay);
console.log(itemizedPrompts);
console.log(itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt);
let rawPrompt = itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt;
let rawPromptValues = rawPrompt;
if (Array.isArray(rawPrompt)) {
rawPromptValues = rawPrompt.map(x => x.content).join('\n');
}
//let DisplayStringifiedPrompt = JSON.stringify(itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt).replace(/\n+/g, '<br>');
const rawPromptWrapper = document.getElementById('rawPromptWrapper');
rawPromptWrapper.innerText = rawPromptValues;
$('#rawPromptPopup').slideToggle();
});
await popup.show();
} }
function setInContextMessages(lastmsg, type) { function setInContextMessages(lastmsg, type) {
@@ -9223,9 +9250,6 @@ jQuery(async function () {
} }
} }
rawPromptPopper.update();
$('#rawPromptPopup').hide();
if (dialogueResolve) { if (dialogueResolve) {
if (popup_type == 'input') { if (popup_type == 'input') {
dialogueResolve($('#dialogue_popup_input').val()); dialogueResolve($('#dialogue_popup_input').val());
@@ -9816,45 +9840,14 @@ jQuery(async function () {
}); });
} }
$(document).on('pointerup', '.mes_prompt', function () { $(document).on('pointerup', '.mes_prompt', async function () {
let mesIdForItemization = $(this).closest('.mes').attr('mesId'); let mesIdForItemization = $(this).closest('.mes').attr('mesId');
console.log(`looking for mesID: ${mesIdForItemization}`); console.log(`looking for mesID: ${mesIdForItemization}`);
if (itemizedPrompts.length !== undefined && itemizedPrompts.length !== 0) { if (itemizedPrompts.length !== undefined && itemizedPrompts.length !== 0) {
promptItemize(itemizedPrompts, mesIdForItemization); await promptItemize(itemizedPrompts, mesIdForItemization);
} }
}); });
$(document).on('pointerup', '#copyPromptToClipboard', function () {
let rawPrompt = itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt;
let rawPromptValues = rawPrompt;
if (Array.isArray(rawPrompt)) {
rawPromptValues = rawPrompt.map(x => x.content).join('\n');
}
navigator.clipboard.writeText(rawPromptValues);
toastr.info('Copied!', '', { timeOut: 2000 });
});
$(document).on('pointerup', '#showRawPrompt', function () {
//console.log(itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt);
console.log(PromptArrayItemForRawPromptDisplay);
console.log(itemizedPrompts);
console.log(itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt);
let rawPrompt = itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt;
let rawPromptValues = rawPrompt;
if (Array.isArray(rawPrompt)) {
rawPromptValues = rawPrompt.map(x => x.content).join('\n');
}
//let DisplayStringifiedPrompt = JSON.stringify(itemizedPrompts[PromptArrayItemForRawPromptDisplay].rawPrompt).replace(/\n+/g, '<br>');
$('#rawPromptWrapper').text(rawPromptValues);
rawPromptPopper.update();
$('#rawPromptPopup').toggle();
});
//******************** //********************
//***Message Editor*** //***Message Editor***
$(document).on('click', '.mes_edit', async function () { $(document).on('click', '.mes_edit', async function () {

View File

@@ -127,3 +127,6 @@ API Used: {{this_main_api}}<br>
</div> </div>
</div> </div>
<hr> <hr>
<div id="rawPromptPopup" class="list-group">
<div id="rawPromptWrapper" class="tokenItemizingSubclass"></div>
</div>

View File

@@ -107,3 +107,6 @@ API Used: {{this_main_api}}<br>
</div> </div>
</div> </div>
<hr> <hr>
<div id="rawPromptPopup" class="list-group">
<div id="rawPromptWrapper" class="tokenItemizingSubclass"></div>
</div>

View File

@@ -256,10 +256,6 @@ input[type='checkbox']:focus-visible {
color: var(--SmartThemeEmColor); color: var(--SmartThemeEmColor);
} }
#rawPromptWrapper {
white-space: pre-wrap;
}
.tokenGraph { .tokenGraph {
border-radius: 10px; border-radius: 10px;
border: 1px solid var(--SmartThemeBorderColor); border: 1px solid var(--SmartThemeBorderColor);
@@ -4367,8 +4363,7 @@ a {
text-decoration: none; text-decoration: none;
} }
#export_format_popup, #export_format_popup {
#rawPromptPopup {
display: none; display: none;
z-index: 9999; z-index: 9999;
} }
@@ -4376,7 +4371,7 @@ a {
#rawPromptPopup { #rawPromptPopup {
inset: 0px auto auto 0px; inset: 0px auto auto 0px;
margin: 0px; margin: 0px;
transform: translate(909px, 47px); transform: translate(500px, 0px);
display: block; display: block;
overflow-wrap: break-word; overflow-wrap: break-word;
white-space: normal; white-space: normal;
@@ -4395,7 +4390,8 @@ a {
display: none; display: none;
} }
#rawPopupWrapper { #rawPromptWrapper {
white-space: pre-wrap;
word-wrap: break-word; word-wrap: break-word;
width: 100%; width: 100%;
text-align: start; text-align: start;