Merge pull request #2983 from SillyTavern/rename-presets Add ability to rename TC presets

8f965aeec6dc42dc397944c23892cd372c3e3f64

Cohee <18619528+Cohee1207@users.noreply.github.com>

Signed
Parents: e3e22ea095017f0b4dd3a4b6ed821df555ee82ba a025331118f82cddcdbdbc02b94d9f9f205dc12f
3 files changed, +128 -81Ignore whitespace
public/index.html+120 -69
@@ -7,6 +7,7 @@
77 <meta charset="utf-8">
88 <meta name="viewport" content="width=device-width, viewport-fit=cover, initial-scale=1, maximum-scale=1.0, user-scalable=no, interactive-widget=resizes-content">
99 <meta name="apple-mobile-web-app-capable" content="yes">
10+ <meta name="mobile-web-app-capable" content="yes">
1011 <meta name="darkreader-lock">
1112 <meta name="robots" content="noindex, nofollow" />
1213 <style>
@@ -87,99 +88,136 @@
8788 <div class="flex-container flexNoGap" id="ai_response_configuration">
8889 <div id="respective-presets-block" class="width100p">
8990 <div id="kobold_api-presets">
90- <h4 class="margin0"><span data-i18n="kobldpresets">Kobold Presets</span>
91+ <div class="margin0 title_restorable standoutHeader">
91- <a href="https://docs.sillytavern.app/usage/api-connections/koboldai/" class="notes-link" target="_blank">
92+ <strong>
9293 <span classdata-i18n="fa-solid fa-circle-question note-link-spankobldpresets">Kobold Presets</span>
93- </a>
94+ <a href="https://docs.sillytavern.app/usage/api-connections/koboldai/" class="notes-link" target="_blank">
94- </h4>
95+ <span class="fa-solid fa-circle-question note-link-span"></span>
96+ </a>
97+ </strong>
98+
99+ <div class="flex-container gap3px">
100+ <div data-preset-manager-import="kobold" class="margin0 menu_button_icon menu_button" title="Import preset" data-i18n="[title]Import preset">
101+ <i class="fa-fw fa-solid fa-file-import"></i>
102+ </div>
103+ <div data-preset-manager-export="kobold" class="margin0 menu_button_icon menu_button" title="Export preset" data-i18n="[title]Export preset">
104+ <i class="fa-fw fa-solid fa-file-export"></i>
105+ </div>
106+ <div data-preset-manager-delete="kobold" class="margin0 menu_button_icon menu_button" title="Delete the preset" data-i18n="[title]Delete the preset">
107+ <i class="fa-fw fa-solid fa-trash-can"></i>
108+ </div>
109+ </div>
110+ </div>
95111 <div class="flex-container flexNoGap">
96112 <select id="settings_preset" data-preset-manager-for="kobold" class="flex1 text_pole">
97113 <option value="gui" data-i18n="guikoboldaisettings">GUI KoboldAI Settings</option>
98114 </select>
99115 <div class="flex-container marginLeft5 gap3px">
100116 <input type="file" hidden data-preset-manager-file="kobold" accept=".json, .settings">
101117 <i data-preset-manager-update="kobold" class="menu_button fa-fw fa-solid fa-save" title="Update current preset" data-i18n="[title]Update current preset"></i>
102118 <i data-preset-manager-newrename="kobold" class="menu_button fa-solidfw fa-file-circlepencil fa-plussolid" title="SaveRename presetcurrent aspreset" data-i18n="[title]SaveRename presetcurrent aspreset"></i>
103119 <i data-preset-manager-importnew="kobold" class="menu_button fa-fw fa-solid fa-file-importcircle-plus" title="ImportSave preset as" data-i18n="[title]ImportSave preset as"></i>
104120 <i data-preset-manager-exportrestore="kobold" class="menu_button fa-solidfw fa-filesolid fa-exportrecycle" title="ExportRestore current preset" data-i18n="[title]ExportRestore current preset"></i>
105- <i data-preset-manager-restore="kobold" class="menu_button fa-solid fa-recycle" title="Restore current preset" data-i18n="[title]Restore current preset"></i>
106- <i data-preset-manager-delete="kobold" class="menu_button fa-solid fa-trash-can" title="Delete the preset" data-i18n="[title]Delete the preset"></i>
107121 </div>
108122 </div>
109123 </div>
110124 <div id="novel_api-presets">
111125 <h4div class="margin0 title_restorable standoutHeader">
112- <span data-i18n="novelaipresets">NovelAI Presets</span>
126+ <strong>
113- <a href="https://docs.sillytavern.app/usage/api-connections/novelai/" class="notes-link" target="_blank">
127+ <span data-i18n="novelaipresets">NovelAI Presets</span>
114- <span class="fa-solid fa-circle-question note-link-span"></span>
128+ <a href="https://docs.sillytavern.app/usage/api-connections/novelai/" class="notes-link" target="_blank">
115- </a>
129+ <span class="fa-solid fa-circle-question note-link-span"></span>
116130 </h4a>
131+ </strong>
132+
133+ <div class="flex-container gap3px">
134+ <div data-preset-manager-import="novel" class="margin0 menu_button_icon menu_button" title="Import preset" data-i18n="[title]Import preset">
135+ <i class="fa-fw fa-solid fa-file-import"></i>
136+ </div>
137+ <div data-preset-manager-export="novel" class="margin0 menu_button_icon menu_button" title="Export preset" data-i18n="[title]Export preset">
138+ <i class="fa-fw fa-solid fa-file-export"></i>
139+ </div>
140+ <div data-preset-manager-delete="novel" class="margin0 menu_button_icon menu_button" title="Delete the preset" data-i18n="[title]Delete the preset">
141+ <i class="fa-fw fa-solid fa-trash-can"></i>
142+ </div>
143+ </div>
144+ </div>
117145 <div class="flex-container flexNoGap">
118146 <select id="settings_preset_novel" class="flex1 text_pole" data-preset-manager-for="novel">
119147 <option value="gui" data-i18n="Default">Default</option>
120148 </select>
121149 <div class="flex-container marginLeft5 gap3px">
122150 <input type="file" hidden data-preset-manager-file="novel" accept=".json, .settings, .preset">
123151 <i data-preset-manager-update="novel" class="menu_button fa-fw fa-solid fa-save" title="Update current preset" data-i18n="[title]Update current preset"></i>
124152 <i data-preset-manager-newrename="novel" class="menu_button fa-solidfw fa-file-circlepencil fa-plussolid" title="SaveRename presetcurrent aspreset" data-i18n="[title]SaveRename presetcurrent aspreset"></i>
125153 <i data-preset-manager-importnew="novel" class="menu_button fa-fw fa-solid fa-file-importcircle-plus" title="ImportSave preset as" data-i18n="[title]ImportSave preset as"></i>
126154 <i data-preset-manager-exportrestore="novel" class="menu_button fa-solidfw fa-filesolid fa-exportrecycle" title="ExportRestore current preset" data-i18n="[title]ExportRestore current preset"></i>
127- <i data-preset-manager-restore="novel" class="menu_button fa-solid fa-recycle" title="Restore current preset" data-i18n="[title]Restore current preset"></i>
128- <i data-preset-manager-delete="novel" class="menu_button fa-solid fa-trash-can" title="Delete the preset" data-i18n="[title]Delete the preset"></i>
129155 </div>
130156 </div>
131157 </div>
132158 <div id="openai_api-presets">
133159 <div>
134- <h4 class="margin0"><span data-i18n="openaipresets">Chat Completion Presets</span></h4>
160+ <div class="margin0 title_restorable standoutHeader">
161+ <strong>
162+ <span data-i18n="openaipresets">Chat Completion Presets</span>
163+ </strong>
164+
165+ <div class="flex-container gap3px">
166+ <div id="import_oai_preset" class="margin0 menu_button menu_button_icon" title="Import preset" data-i18n="[title]Import preset">
167+ <i class="fa-fw fa-solid fa-file-import"></i>
168+ </div>
169+ <div id="export_oai_preset" class="margin0 menu_button menu_button_icon" title="Export preset" data-i18n="[title]Export preset">
170+ <i class="fa-fw fa-solid fa-file-export"></i>
171+ </div>
172+ <div id="delete_oai_preset" class="margin0 menu_button menu_button_icon" title="Delete the preset" data-i18n="[title]Delete the preset">
173+ <i class="fa-fw fa-solid fa-trash-can"></i>
174+ </div>
175+ </div>
176+ </div>
177+
135178 <div class="flex-container flexNoGap">
136179 <select id="settings_preset_openai" class="flex1 text_pole" data-preset-manager-for="openai">
137180 <option value="gui" data-i18n="Default">Default</option>
138181 </select>
139182 <div class="flex-container marginLeft5 gap3px">
140183 <input id="openai_preset_import_file" type="file" accept=".json,.settings" hidden />
141184 <i id="update_oai_preset" class="menu_button fa-fw fa-solid fa-save" title="Update current preset" data-i18n="[title]Update current preset"></i>
142185 <i id="new_oai_preset" class="menu_button fa-fw fa-solid fa-file-circle-plus" title="Save preset as" data-i18n="[title]Save preset as"></i>
143- <i id="import_oai_preset" class="menu_button fa-solid fa-file-import" title="Import preset" data-i18n="[title]Import preset"></i>
144- <i id="export_oai_preset" class="menu_button fa-solid fa-file-export" title="Export preset" data-i18n="[title]Export preset"></i>
145- <i id="delete_oai_preset" class="menu_button fa-solid fa-trash-can" title="Delete the preset" data-i18n="[title]Delete the preset"></i>
146186 </div>
147187 </div>
148188 </div>
149189 </div>
150190 <div id="textgenerationwebui_api-presets">
151- <h4 class="margin0"><span data-i18n="Text Completion presets">Text Completion presets</span></h4>
191+ <div class="margin0 title_restorable standoutHeader">
192+ <strong>
193+ <span data-i18n="Text Completion presets">Text Completion presets</span>
194+ </strong>
195+
196+ <div class="flex-container gap3px">
197+ <div data-preset-manager-import="textgenerationwebui" class="margin0 menu_button_icon menu_button" title="Import preset" data-i18n="[title]Import preset">
198+ <i class="fa-fw fa-solid fa-file-import"></i>
199+ </div>
200+ <div data-preset-manager-export="textgenerationwebui" class="margin0 menu_button_icon menu_button" title="Export preset" data-i18n="[title]Export preset">
201+ <i class="fa-fw fa-solid fa-file-export"></i>
202+ </div>
203+ <div data-preset-manager-delete="textgenerationwebui" class="margin0 menu_button_icon menu_button" title="Delete the preset" data-i18n="[title]Delete the preset">
204+ <i class="fa-fw fa-solid fa-trash-can"></i>
205+ </div>
206+ </div>
207+ </div>
152208 <div class="flex-container flexNoGap">
153209 <select id="settings_preset_textgenerationwebui" class="flex1 text_pole" data-preset-manager-for="textgenerationwebui">
154210 </select>
155211 <div class="flex-container marginLeft5 gap3px">
156212 <input type="file" hidden data-preset-manager-file="textgenerationwebui" accept=".json, .settings">
157213 <i data-preset-manager-update="textgenerationwebui" class="menu_button fa-fw fa-solid fa-save" title="Update current preset" data-i18n="[title]Update current preset"></i>
158214 <i data-preset-manager-newrename="textgenerationwebui" class="menu_button fa-solidfw fa-file-circlepencil fa-plussolid" title="SaveRename presetcurrent aspreset" data-i18n="[title]SaveRename presetcurrent aspreset"></i>
159215 <i data-preset-manager-importnew="textgenerationwebui" class="menu_button fa-fw fa-solid fa-file-importcircle-plus" title="ImportSave preset as" data-i18n="[title]ImportSave preset as"></i>
160216 <i data-preset-manager-exportrestore="textgenerationwebui" class="menu_button fa-solidfw fa-filesolid fa-exportrecycle" title="ExportRestore current preset" data-i18n="[title]ExportRestore current preset"></i>
161- <i data-preset-manager-restore="textgenerationwebui" class="menu_button fa-solid fa-recycle" title="Restore current preset" data-i18n="[title]Restore current preset"></i>
162- <i data-preset-manager-delete="textgenerationwebui" class="menu_button fa-solid fa-trash-can" title="Delete the preset" data-i18n="[title]Delete the preset"></i>
163217 </div>
164218 </div>
165219 </div>
166220 </div>
167- <div id="ai_module_block_novel" class="width100p">
168- <div class="range-block">
169- <div class="range-block-title justifyLeft" data-i18n="AI Module">
170- AI Module
171- </div>
172- <div class="toggle-description justifyLeft" data-i18n="Changes the style of the generated text.">
173- Changes the style of the generated text.
174- </div>
175- <select id="nai_prefix">
176- <option value="vanilla" data-i18n="No Module">No Module</option>
177- <option value="special_instruct" data-i18n="Instruct">Instruct</option>
178- <option value="special_proseaugmenter" data-i18n="Prose Augmenter">Prose Augmenter</option>
179- <option value="theme_textadventure" data-i18n="Text Adventure">Text Adventure</option>
180- </select>
181- </div>
182- </div>
183221 <div id="common-gen-settings-block" class="width100p">
184222 <div id="pro-settings-block" class="flex-container gap10h5v justifyCenter">
185223 <div id="amount_gen_block" class="alignitemscenter flex-container marginBot5 flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
@@ -204,6 +242,14 @@
204242 </small>
205243 </label>
206244 </div>
245+ <div id="streaming_novel_block" class="flex-container alignitemscenter justifyCenter marginTop5">
246+ <label class="checkbox_label" for="streaming_novel">
247+ <input type="checkbox" id="streaming_novel" />
248+ <small><span data-i18n="Streaming">Streaming</span>
249+ <div class="margin5 fa-solid fa-circle-info opacity50p" data-i18n="[title]Streaming_desc" title="Display the response bit by bit as it is generated.&#13;When this is off, responses will be displayed all at once when they are complete."></div>
250+ </small>
251+ </label>
252+ </div>
207253 </div>
208254 <div id="max_context_block" class="alignitemscenter flex-container marginBot5 flexFlowColumn flexBasis48p flexGrow flexShrink gap0">
209255 <small data-i18n="context size(tokens)">Context (tokens)</small>
@@ -224,6 +270,22 @@
224270 <span data-i18n="Max prompt cost:">Max prompt cost:</span> <span id="or_prompt_cost">&ndash;</span>
225271 </small>
226272 </div>
273+ <div id="ai_module_block_novel" class="width100p">
274+ <div class="range-block">
275+ <div class="range-block-title justifyLeft" data-i18n="AI Module">
276+ AI Module
277+ </div>
278+ <div class="toggle-description justifyLeft" data-i18n="Changes the style of the generated text.">
279+ Changes the style of the generated text.
280+ </div>
281+ <select id="nai_prefix">
282+ <option value="vanilla" data-i18n="No Module">No Module</option>
283+ <option value="special_instruct" data-i18n="Instruct">Instruct</option>
284+ <option value="special_proseaugmenter" data-i18n="Prose Augmenter">Prose Augmenter</option>
285+ <option value="theme_textadventure" data-i18n="Text Adventure">Text Adventure</option>
286+ </select>
287+ </div>
288+ </div>
227289 <hr>
228290 </div>
229291 <div id="respective-ranges-and-temps" class="width100p">
@@ -233,19 +295,6 @@
233295 -->
234296 <div id="range_block_novel">
235297 <div class="range-block">
236- <label class="checkbox_label widthFreeExpand">
237- <input id="streaming_novel" type="checkbox" />
238- <span data-i18n="Streaming">Streaming</span>
239- </label>
240- <div class="toggle-description justifyLeft">
241- <span data-i18n="Display the response bit by bit as it is generated.">
242- Display the response bit by bit as it is generated.</span><br>
243- <span data-i18n="When this is off, responses will be displayed all at once when they are complete.">
244- When this is off, responses will be displayed all at once when they are complete.
245- </span>
246- </div>
247- </div>
248- <div class="range-block">
249298 <div class="range-block-title" data-i18n="Temperature">
250299 Temperature
251300 </div>
@@ -5106,6 +5155,8 @@
51065155 </div>
51075156 <!-- various fullscreen popups -->
51085157 <div name="templatesAndPopupsWrapper"> <!--this div is just for IDE sanity for quick collapsing-->
5158+ <!-- Point to this element when you need a no-op selector -->
5159+ <template id="NULL_SELECTOR" class="displayNone"></template>
51095160 <div id="export_format_popup" class="list-group">
51105161 <div class="export_format list-group-item" data-format="png">PNG</div>
51115162 <div class="export_format list-group-item" data-format="json">JSON</div>
public/script.js+7 -11
@@ -6360,6 +6360,7 @@ export function changeMainAPI() {
63606360 //console.log(selectedVal);
63616361 const apiElements = {
63626362 'koboldhorde': {
6363+ apiStreaming: $('#NULL_SELECTOR'),
63636364 apiSettings: $('#kobold_api-settings'),
63646365 apiConnector: $('#kobold_horde'),
63656366 apiPresets: $('#kobold_api-presets'),
@@ -6368,6 +6369,7 @@ export function changeMainAPI() {
63686369 amountGenElem: $('#amount_gen_block'),
63696370 },
63706371 'kobold': {
6372+ apiStreaming: $('#streaming_kobold_block'),
63716373 apiSettings: $('#kobold_api-settings'),
63726374 apiConnector: $('#kobold_api'),
63736375 apiPresets: $('#kobold_api-presets'),
@@ -6376,6 +6378,7 @@ export function changeMainAPI() {
63766378 amountGenElem: $('#amount_gen_block'),
63776379 },
63786380 'textgenerationwebui': {
6381+ apiStreaming: $('#streaming_textgenerationwebui_block'),
63796382 apiSettings: $('#textgenerationwebui_api-settings'),
63806383 apiConnector: $('#textgenerationwebui_api'),
63816384 apiPresets: $('#textgenerationwebui_api-presets'),
@@ -6384,6 +6387,7 @@ export function changeMainAPI() {
63846387 amountGenElem: $('#amount_gen_block'),
63856388 },
63866389 'novel': {
6390+ apiStreaming: $('#streaming_novel_block'),
63876391 apiSettings: $('#novel_api-settings'),
63886392 apiConnector: $('#novel_api'),
63896393 apiPresets: $('#novel_api-presets'),
@@ -6392,6 +6396,7 @@ export function changeMainAPI() {
63926396 amountGenElem: $('#amount_gen_block'),
63936397 },
63946398 'openai': {
6399+ apiStreaming: $('#NULL_SELECTOR'),
63956400 apiSettings: $('#openai_settings'),
63966401 apiConnector: $('#openai_api'),
63976402 apiPresets: $('#openai_api-presets'),
@@ -6414,12 +6419,14 @@ export function changeMainAPI() {
64146419 apiObj.apiConnector.css('display', 'none');
64156420 apiObj.apiRanges.css('display', 'none');
64166421 apiObj.apiPresets.css('display', 'none');
6422+ apiObj.apiStreaming.css('display', 'none');
64176423 }
64186424
64196425 //then, find and enable the active item.
64206426 //This is split out of the loop so that different apis can share settings divs
64216427 let activeItem = apiElements[selectedVal];
64226428
6429+ activeItem.apiStreaming.css('display', 'block');
64236430 activeItem.apiSettings.css('display', 'block');
64246431 activeItem.apiConnector.css('display', 'block');
64256432 activeItem.apiRanges.css('display', 'block');
@@ -6436,17 +6443,6 @@ export function changeMainAPI() {
64366443 }
64376444
64386445 //custom because streaming has been moved up under response tokens, which exists inside common settings block
6439- if (selectedVal === 'textgenerationwebui') {
6440- $('#streaming_textgenerationwebui_block').css('display', 'block');
6441- } else {
6442- $('#streaming_textgenerationwebui_block').css('display', 'none');
6443- }
6444- if (selectedVal === 'kobold') {
6445- $('#streaming_kobold_block').css('display', 'block');
6446- } else {
6447- $('#streaming_kobold_block').css('display', 'none');
6448- }
6449-
64506446 if (selectedVal === 'novel') {
64516447 $('#ai_module_block_novel').css('display', 'block');
64526448 } else {
public/style.css+1 -1
@@ -5046,7 +5046,7 @@ body:not(.movingUI) .drawer-content.maximized {
50465046}
50475047
50485048.fillLeft .scrollableInner {
50495049 padding: 0.5em 1em0.75em 0.5em 0.5em
50505050}
50515051
50525052.drawer-content select {