WI: Prob%, Memo to header, Keywords to main

This commit is contained in:
RossAscends
2023-10-06 03:02:43 +09:00
parent 30e5a31591
commit 5307ee5d17
3 changed files with 152 additions and 66 deletions

View File

@ -101,7 +101,7 @@
height: auto; height: auto;
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
min-height: var(--mainFontSize); min-height: calc(var(--mainFontSize) + 13px);
} }
.delete_entry_button { .delete_entry_button {
@ -178,7 +178,7 @@
filter: grayscale(1); filter: grayscale(1);
} }
.disabledWIEntry:hover { .disabledWIEntry:not(input):hover {
opacity: 1; opacity: 1;
filter: grayscale(0.5); filter: grayscale(0.5);
} }

View File

@ -3930,41 +3930,46 @@
<form class="world_entry_form wi-card-entry"> <form class="world_entry_form wi-card-entry">
<div class="inline-drawer wide100p"> <div class="inline-drawer wide100p">
<div class="inline-drawer-toggle inline-drawer-header gap5px"> <div class="inline-drawer-toggle inline-drawer-header gap5px">
<span class="drag-handle">&#9776;</span> <!-- <span class="drag-handle">&#9776;</span> -->
<div class="gap5px world_entry_thin_controls wide100p alignitemscenter"> <div class="gap5px world_entry_thin_controls wide100p alignitemscenter">
<small> <div class="fa-fw fa-solid fa-circle-chevron-down inline-drawer-icon down"></div>
<span class="flex-container alignitemscenter"> <span class="flex-container alignitemscenter wide100p">
<!-- <span class="world_entry_form_position_value"></span> --> <!-- <span class="world_entry_form_position_value"></span> -->
<div name="PositionBlock" class="world_entry_form_control world_entry_form_radios wi-enter-footer-text"> <select title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" name="entryStateSelector" class="widthNatural margin0">
<!-- <label for="position" data-i18n="Position:">Position:</label> --> <option title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" value="constant">🔵</option>
<option title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" value="normal">🟢</option>
<select name="position" class="widthNatural margin0" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;"> <option title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" value="disabled"></option>
<option value="0" data-i18n="Before Char Defs" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↑Char</option> </select>
<option value="1" data-i18n="After Char Defs" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↓Char</option> <div name="PositionBlock" class="world_entry_form_control world_entry_form_radios wi-enter-footer-text">
<option value="2" data-i18n="Before AN" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↑AN</option> <!-- <label for="position" data-i18n="Position:">Position:</label> -->
<option value="3" data-i18n="After AN" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↓AN</option> <select name="position" class="widthNatural margin0" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">
<option value="4" data-i18n="at Depth" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">@D</option> <option value="0" data-i18n="Before Char Defs" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↑Char</option>
</select> <option value="1" data-i18n="After Char Defs" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↓Char</option>
<option value="2" data-i18n="Before AN" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↑AN</option>
</div> <option value="3" data-i18n="After AN" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">↓AN</option>
<option value="4" data-i18n="at Depth" title="↑Char: Before Character Definitions&#13;↓Char: After Character Definitions&#13;↑AN: Before Author's Note&#13;↓AN: After Author's Note&#13;@D: at Depth&#13;">@D</option>
<div class="world_entry_form_control wi-enter-footer-text flex-container flexNoGap">
<!-- <label for="depth" data-i18n="Depth:">Depth:</label> -->
<input title="Depth" class="text_pole wideMax100px margin0" type="number" name="depth" placeholder="" min="0" max="999" />
</div>
<div class="world_entry_form_control wi-enter-footer-text flex-container flexNoGap">
<!-- <label for="order" data-i18n="Order:">Order:</label> -->
<input title="Order" class="text_pole wideMax100px margin0" type="number" name="order" placeholder="" min="0" max="999" />
</div>
<select title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" name="entryStateSelector" class="widthNatural margin0">
<option title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" value="constant">🔵</option>
<option title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" value="normal">🟢</option>
<option title="WI Entry Status:&#13;🔵 Constant&#13;🟢 Normal&#13;❌ Disabled" value="disabled"></option>
</select> </select>
</span> </div>
</small>
<div class="world_entry_form_control flex1"> <div class="world_entry_form_control wi-enter-footer-text flex-container flexNoGap">
<!-- <label for="depth" data-i18n="Depth:">Depth:</label> -->
<input title="Depth" class="text_pole wideMax100px margin0" type="number" name="depth" placeholder="" min="0" max="999" />
</div>
<div class="world_entry_form_control wi-enter-footer-text flex-container flexNoGap">
<!-- <label for="order" data-i18n="Order:">Order:</label> -->
<input title="Order" class="text_pole wideMax100px margin0" type="number" name="order" placeholder="" min="0" max="999" />
</div>
<div class="world_entry_form_control wi-enter-footer-text flex-container flexNoGap probabilityContainer">
<input title="Probability" class="text_pole wideMax100px margin0" type="number" name="probability" placeholder="" min="0" max="100" />
</div>
<div class="flex-container flex1">
<textarea class="text_pole" name="comment" maxlength="2000" data-i18n="[placeholder]Entry Title/Memo" placeholder="Entry Title/Memo"></textarea>
</div>
</span>
<!-- <div class="world_entry_form_control flex1">
<small class="displayNone"> <small class="displayNone">
<span data-i18n="Comma separated (required)"> <span data-i18n="Comma separated (required)">
Comma separated (required) Comma separated (required)
@ -3989,21 +3994,67 @@
<textarea class="text_pole keysecondarytextpole" name="keysecondary" rows="1" data-i18n="[placeholder]Comma separated (ignored if empty)" placeholder="Comma separated list" maxlength="1000"></textarea> <textarea class="text_pole keysecondarytextpole" name="keysecondary" rows="1" data-i18n="[placeholder]Comma separated (ignored if empty)" placeholder="Comma separated list" maxlength="1000"></textarea>
<i class="menu_button delete_entry_button fa-solid fa-trash-can" type="submit" data-i18n="" value="" /></i> <i class="menu_button delete_entry_button fa-solid fa-trash-can" type="submit" data-i18n="" value="" /></i>
</div> </div>
</div> </div> -->
</div> </div>
<div class="fa-fw fa-solid fa-circle-chevron-down inline-drawer-icon down"></div> <i class="menu_button delete_entry_button fa-solid fa-trash-can" type="submit" data-i18n="" value="" /></i>
</div> </div>
<div class="inline-drawer-content flex-container paddingBottom5px"> <div class="inline-drawer-content flex-container paddingBottom5px wide100p">
<div class="WIEntryContentAndMemo flex-container"> <div class="flex-container wide100p alignitemscenter">
<div class="world_entry_thin_controls flex2"> <div name="keywordsAndLogicBlock" class="flex-container wide100p alignitemscenter">
<div class="world_entry_form_control flex1">
<small class="displayNone">
<span data-i18n="Comma separated (required)">
Comma separated (required)
</span>
</small>
<small class="textAlignCenter">Primary Keywords</small>
<textarea class="text_pole keyprimarytextpole" name="key" rows="1" data-i18n="[placeholder]Comma separated (required)" placeholder="Comma separated (required)" maxlength="1000"></textarea>
</div>
<div class="world_entry_form_control">
<small class="textAlignCenter">Logic</small>
<select name="entryLogicType" class="widthFitContent margin0">
<option value="0">AND</option>
<option value="1">NOT</option>
</select>
</div>
<div class="world_entry_form_control keysecondary flex1">
<small class="displayNone">
<span data-i18n="(ignored if empty)">
(ignored if empty)
</span>
</small>
<small class="textAlignCenter">Optional Filter Keywords</small>
<div class="flex-container flexFlowRow alignitemscenter">
<textarea class="text_pole keysecondarytextpole" name="keysecondary" rows="1" data-i18n="[placeholder]Comma separated (ignored if empty)" placeholder="Comma separated list" maxlength="1000"></textarea>
</div>
</div>
</div>
<div name="contentAndCharFilterBlock" class="world_entry_thin_controls flex2">
<div class="world_entry_form_control flex1"> <div class="world_entry_form_control flex1">
<label for="content "> <label for="content ">
<small> <small>
<span data-i18n="Content"> <span data-i18n="Content" class="alignitemscenter flex-container flexnowrap wide100p justifySpaceBetween">
Content
<span>(Tokens:&nbsp; <span class="world_entry_form_token_counter" data-first-run="true">counting...</span>) <span class="alignitemscenter flex-container flexNoGap">
Content
</span>
<span>
(Tokens:&nbsp; <span class="world_entry_form_token_counter" data-first-run="true">counting...</span>)&nbsp;
<span class="world_entry_form_uid_value" data-first-run="true"></span> <span class="world_entry_form_uid_value" data-first-run="true"></span>
</span> </span>
<div>
<label class="checkbox flex-container alignitemscenter flexNoGap">
<input type="checkbox" name="exclude_recursion" />
<span data-i18n="Exclude from recursion">
Non-recursable
</span>
</label>
</div>
</span> </span>
</small> </small>
<small class="displayNone"> <small class="displayNone">
@ -4014,9 +4065,10 @@
</label> </label>
<textarea class="text_pole" name="content" rows="4" data-i18n="[placeholder]What this keyword should mean to the AI, sent verbatim" placeholder="What this keyword should mean to the AI, sent verbatim"></textarea> <textarea class="text_pole" name="content" rows="4" data-i18n="[placeholder]What this keyword should mean to the AI, sent verbatim" placeholder="What this keyword should mean to the AI, sent verbatim"></textarea>
</div> </div>
</div> </div>
<div class="world_entry_thin_controls commentContainer"> <div class="world_entry_thin_controls commentContainer">
<div class="world_entry_form_control flex1"> <!-- <div class="world_entry_form_control flex1">
<label for="comment"> <label for="comment">
<small> <small>
<span data-i18n="Memo/Note"> <span data-i18n="Memo/Note">
@ -4030,13 +4082,37 @@
</small> </small>
</label> </label>
<textarea class="text_pole" rows="4" name="comment" maxlength="2000" data-i18n="[placeholder]Not sent to the AI" placeholder="Not sent to AI"></textarea> <textarea class="text_pole" rows="4" name="comment" maxlength="2000" data-i18n="[placeholder]Not sent to the AI" placeholder="Not sent to AI"></textarea>
</div> </div> -->
</div> </div>
</div> </div>
<div class="flex-container flexFlowColumn flexNoGap wide100p"> <div class="flex-container flexFlowColumn flexNoGap wide100p">
<label for="characterFilter" class="range-block-title justifyLeft"> <div class="flex-container justifySpaceBetween">
<small data-i18n="Filter to Character(s)">Filter to Character(s)</small> <label for="characterFilter" class="">
</label> <small data-i18n="Filter to Character(s)">Filter to Character(s)</small>
</label>
<label class="checkbox flex-container alignitemscenter">
<input type="checkbox" name="character_exclusion" />
<span data-i18n="Character Exclusion">
<small>Character Exclusion</small>
</span>
</label>
</div>
<!-- PLACEHOLDER HTML FOR CHAR FILTER EXCLUDE CONVERSION TO SELECT INSTEAD OF CHECKBOX-->
<!--
<div name="WICharFilterLabel" class="flex-container alignitemscenter marginBot5">
<small data-i18n="Filter Entry">Filter Entry</small>
<div>
<select name="character_exclusion" class="widthFitContent margin0">
<option value="only">to Only</option>
<option value="except">to Exclude</option>
</select>
</div>
<small>the following Characters:</small>
</div>
-->
<div class="range-block-range"> <div class="range-block-range">
<select name="characterFilter" multiple> <select name="characterFilter" multiple>
<option value=""> <option value="">
@ -4069,18 +4145,18 @@
<input type="checkbox" name="addMemo"> <input type="checkbox" name="addMemo">
<span data-i18n="Add Memo">Add Memo</span> <span data-i18n="Add Memo">Add Memo</span>
</label> </label>
<label class="checkbox flex-container alignitemscenter"> <!-- <label class="checkbox flex-container alignitemscenter">
<input type="checkbox" name="exclude_recursion" /> <input type="checkbox" name="exclude_recursion" />
<span data-i18n="Exclude from recursion"> <span data-i18n="Exclude from recursion">
Non-recursable Non-recursable
</span> </span>
</label> </label> -->
<label class="checkbox flex-container alignitemscenter"> <!-- <label class="checkbox flex-container alignitemscenter">
<input type="checkbox" name="character_exclusion" /> <input type="checkbox" name="character_exclusion" />
<span data-i18n="Character Exclusion"> <span data-i18n="Character Exclusion">
Character Exclusion Character Exclusion
</span> </span>
</label> </label> -->
</div> </div>
<!-- <!--
@ -4121,10 +4197,10 @@
<div class="world_entry_form_control wi-enter-footer-text flex-container flexNoGap probabilityContainer"> <!-- <div class="world_entry_form_control wi-enter-footer-text flex-container flexNoGap probabilityContainer">
<label for="probability" data-i18n="Probability:"></label>Probability:</label> <label for="probability" data-i18n="Probability:"></label>Probability:</label>
<input class="text_pole wideMax100px margin0" type="number" name="probability" placeholder="" min="0" max="100" /> <input class="text_pole wideMax100px margin0" type="number" name="probability" placeholder="" min="0" max="100" />
</div> </div> -->
</div> </div>

View File

@ -291,7 +291,10 @@ function displayWorldEntries(name, data, navigation = navigation_option.none) {
callback: function (page) { callback: function (page) {
$("#world_popup_entries_list").empty(); $("#world_popup_entries_list").empty();
const keywordHeaders = ` const keywordHeaders = `
<div class="flex-container wide100p spaceBetween justifyCenter textAlignCenter" style="padding-left:25px; padding-right:45px;"> <div class="flex-container wide100p spaceBetween justifyCenter textAlignCenter" style="padding:0 2.5em;">
<small style="width:${InputWidthReference.width() + 5 + 'px'}">
Status
</small>
<small style="width:${InputWidthReference.width() + 20 + 'px'}"> <small style="width:${InputWidthReference.width() + 20 + 'px'}">
Position Position
</small> </small>
@ -301,17 +304,11 @@ function displayWorldEntries(name, data, navigation = navigation_option.none) {
<small style="width:${InputWidthReference.width() + 15 + 'px'}"> <small style="width:${InputWidthReference.width() + 15 + 'px'}">
Order Order
</small> </small>
<small style="width:${InputWidthReference.width() + 5 + 'px'}">
Status
</small>
<small class="flex1">
Keywords
</small>
<small style="width:${InputWidthReference.width() + 15 + 'px'}"> <small style="width:${InputWidthReference.width() + 15 + 'px'}">
Logic Trigger %
</small> </small>
<small class="flex1"> <small class="flex1">
Optional Filter Title/Memo
</small> </small>
</div>` </div>`
const blocks = page.map(entry => getWorldEntry(name, data, entry)); const blocks = page.map(entry => getWorldEntry(name, data, entry));
@ -462,7 +459,7 @@ function getWorldEntry(name, data, entry) {
saveWorldInfo(name, data); saveWorldInfo(name, data);
}); });
keyInput.val(entry.key.join(",")).trigger("input"); keyInput.val(entry.key.join(",")).trigger("input");
initScrollHeight(keyInput); //initScrollHeight(keyInput);
// logic AND/NOT // logic AND/NOT
const selectiveLogicDropdown = template.find('select[name="entryLogicType"]'); const selectiveLogicDropdown = template.find('select[name="entryLogicType"]');
@ -592,6 +589,7 @@ function getWorldEntry(name, data, entry) {
commentInput.on("input", function () { commentInput.on("input", function () {
const uid = $(this).data("uid"); const uid = $(this).data("uid");
const value = $(this).val(); const value = $(this).val();
resetScrollHeight(this);
data.entries[uid].comment = value; data.entries[uid].comment = value;
setOriginalDataValue(data, uid, "comment", data.entries[uid].comment); setOriginalDataValue(data, uid, "comment", data.entries[uid].comment);
@ -611,6 +609,7 @@ function getWorldEntry(name, data, entry) {
}); });
commentInput.val(entry.comment).trigger("input"); commentInput.val(entry.comment).trigger("input");
initScrollHeight(commentInput);
commentToggle.prop("checked", true /* entry.addMemo */).trigger("input"); commentToggle.prop("checked", true /* entry.addMemo */).trigger("input");
commentToggle.parent().hide() commentToggle.parent().hide()
@ -719,6 +718,7 @@ function getWorldEntry(name, data, entry) {
// depth // depth
const depthInput = template.find('input[name="depth"]'); const depthInput = template.find('input[name="depth"]');
depthInput.data("uid", entry.uid); depthInput.data("uid", entry.uid);
depthInput.on("input", function () { depthInput.on("input", function () {
const uid = $(this).data("uid"); const uid = $(this).data("uid");
const value = Number($(this).val()); const value = Number($(this).val());
@ -757,6 +757,7 @@ function getWorldEntry(name, data, entry) {
saveWorldInfo(name, data); saveWorldInfo(name, data);
}); });
probabilityInput.val(entry.probability).trigger("input"); probabilityInput.val(entry.probability).trigger("input");
probabilityInput.width(InputWidthReference.width() + 15 + 'px')
// probability toggle // probability toggle
if (entry.useProbability === undefined) { if (entry.useProbability === undefined) {
@ -797,17 +798,21 @@ function getWorldEntry(name, data, entry) {
const positionInput = template.find('select[name="position"]'); const positionInput = template.find('select[name="position"]');
initScrollHeight(positionInput); initScrollHeight(positionInput);
positionInput.data("uid", entry.uid); positionInput.data("uid", entry.uid);
positionInput.on("click", function (event) {
// Prevent closing the drawer on clicking the input
event.stopPropagation();
});
positionInput.on("input", function () { positionInput.on("input", function () {
const uid = $(this).data("uid"); const uid = $(this).data("uid");
const value = Number($(this).val()); const value = Number($(this).val());
data.entries[uid].position = !isNaN(value) ? value : 0; data.entries[uid].position = !isNaN(value) ? value : 0;
if (value === world_info_position.atDepth) { if (value === world_info_position.atDepth) {
depthInput.prop('disabled', false); depthInput.prop('disabled', false);
depthInput.removeClass('disabledWIEntry') depthInput.css('visibility', 'visible')
//depthInput.parent().show(); //depthInput.parent().show();
} else { } else {
depthInput.prop('disabled', true); depthInput.prop('disabled', true);
depthInput.addClass('disabledWIEntry') depthInput.css('visibility', 'hidden')
//depthInput.parent().hide(); //depthInput.parent().hide();
} }
updatePosOrdDisplay(uid) updatePosOrdDisplay(uid)
@ -851,6 +856,7 @@ function getWorldEntry(name, data, entry) {
entryStateSelector.on("input", function () { entryStateSelector.on("input", function () {
const uid = entry.uid; const uid = entry.uid;
const value = $(this).val(); const value = $(this).val();
const probabilityInput = template.find('input[name="probability"]')
switch (value) { switch (value) {
case "constant": case "constant":
data.entries[uid].constant = true; data.entries[uid].constant = true;
@ -859,6 +865,8 @@ function getWorldEntry(name, data, entry) {
setOriginalDataValue(data, uid, "constant", true); setOriginalDataValue(data, uid, "constant", true);
template.removeClass('disabledWIEntry'); template.removeClass('disabledWIEntry');
console.debug("set to constant") console.debug("set to constant")
probabilityInput.css('visibility', 'hidden')
probabilityInput.prop('disabled', true)
break break
case "normal": case "normal":
data.entries[uid].constant = false; data.entries[uid].constant = false;
@ -866,6 +874,8 @@ function getWorldEntry(name, data, entry) {
setOriginalDataValue(data, uid, "enabled", true); setOriginalDataValue(data, uid, "enabled", true);
setOriginalDataValue(data, uid, "constant", false); setOriginalDataValue(data, uid, "constant", false);
template.removeClass('disabledWIEntry'); template.removeClass('disabledWIEntry');
probabilityInput.css('visibility', 'visible')
probabilityInput.prop('disabled', false)
console.debug("set to normal") console.debug("set to normal")
break break
case "disabled": case "disabled":