Merge pull request #2550 from SillyTavern/enable-autoselect-inputs Enable auto-select of input field on popups + Add "auto-select" utility class

08e83c3ae896fd8b37407d68bdfea8724dc8eb33

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

Signed
3 files changed, +22 -1Ignore whitespace
public/index.html+5 -1
@@ -4098,6 +4098,10 @@
40984098 <input id="world_import_dialog" type="checkbox" />
40994099 <small data-i18n="Lorebook Import Dialog">Lorebook Import Dialog</small>
41004100 </label>
4101+ <label data-newbie-hidden class="checkbox_label" for="enable_auto_select_input" title="Enable auto-select of input text in some text fields when clicking/selecting them. Applies to popup input textboxes, and possible other custom input fields." data-i18n="[title]Enable auto-select of input text in some text fields when clicking/selecting them. Applies to popup input textboxes, and possible other custom input fields.">
4102+ <input id="enable_auto_select_input" type="checkbox" />
4103+ <small data-i18n="Auto-select Input Text">Auto-select Input Text</small>
4104+ </label>
41014105 <label class="checkbox_label" for="restore_user_input" title="Restore unsaved user input on page refresh." data-i18n="[title]Restore unsaved user input on page refresh">
41024106 <input id="restore_user_input" type="checkbox" />
41034107 <small data-i18n="Restore User Input">Restore User Input</small>
@@ -4985,7 +4989,7 @@
49854989 <div class="popup-crop-wrap">
49864990 <img class="popup-crop-image" src="">
49874991 </div>
49884992 <textarea class="popup-input text_pole result-control auto-select" rows="1" data-result="1" data-result-event="submit"></textarea>
49894993 <div class="popup-inputs"></div>
49904994 <div class="popup-controls">
49914995 <div class="popup-button-ok menu_button result-control" data-result="1" data-i18n="Delete">Delete</div>
public/script.js+9 -0
@@ -10657,6 +10657,15 @@ jQuery(async function () {
1065710657 $(document).on('click', '.open_alternate_greetings', openAlternateGreetings);
1065810658 /* $('#set_character_world').on('click', openCharacterWorldPopup); */
1065910659
10660+ $(document).on('focus', 'input.auto-select, textarea.auto-select', function () {
10661+ if (!power_user.enable_auto_select_input) return;
10662+ const control = $(this)[0];
10663+ if (control instanceof HTMLInputElement || control instanceof HTMLTextAreaElement) {
10664+ control.select();
10665+ console.debug('Auto-selecting content of input control', control);
10666+ }
10667+ });
10668+
1066010669 $(document).keyup(function (e) {
1066110670 if (e.key === 'Escape') {
1066210671 const isEditVisible = $('#curEditTextarea').is(':visible');
public/scripts/power-user.js+8 -0
@@ -202,6 +202,7 @@ let power_user = {
202202 trim_spaces: true,
203203 relaxed_api_urls: false,
204204 world_import_dialog: true,
205+ enable_auto_select_input: false,
205206 tag_import_setting: tag_import_setting.ASK,
206207 disable_group_trimming: false,
207208 single_line: false,
@@ -1596,6 +1597,7 @@ async function loadPowerUserSettings(settings, data) {
15961597 $('#single_line').prop('checked', power_user.single_line);
15971598 $('#relaxed_api_urls').prop('checked', power_user.relaxed_api_urls);
15981599 $('#world_import_dialog').prop('checked', power_user.world_import_dialog);
1600+ $('#enable_auto_select_input').prop('checked', power_user.enable_auto_select_input);
15991601 $('#trim_spaces').prop('checked', power_user.trim_spaces);
16001602 $('#continue_on_send').prop('checked', power_user.continue_on_send);
16011603 $('#quick_continue').prop('checked', power_user.quick_continue);
@@ -3773,6 +3775,12 @@ $(document).ready(() => {
37733775 saveSettingsDebounced();
37743776 });
37753777
3778+ $('#enable_auto_select_input').on('input', function () {
3779+ const value = !!$(this).prop('checked');
3780+ power_user.enable_auto_select_input = value;
3781+ saveSettingsDebounced();
3782+ });
3783+
37763784 $('#spoiler_free_mode').on('input', function () {
37773785 power_user.spoiler_free_mode = !!$(this).prop('checked');
37783786 switchSpoilerMode();