faster, smarter handling of options menu

This commit is contained in:
RossAscends
2023-06-05 05:04:15 +09:00
parent b530572f1f
commit 5b8db25a14
2 changed files with 48 additions and 46 deletions

View File

@ -260,7 +260,7 @@ export let CLIENT_VERSION = 'SillyTavern:UNKNOWN:Cohee#1207'; // For Horde heade
let is_colab = false;
let is_checked_colab = false;
let is_mes_reload_avatar = false;
let optionsPopper = Popper.createPopper(document.getElementById('send_form'), document.getElementById('options'), {
let optionsPopper = Popper.createPopper(document.getElementById('options_button'), document.getElementById('options'), {
placement: 'top-start'
});
let exportPopper = Popper.createPopper(document.getElementById('export_button'), document.getElementById('export_format_popup'), {
@ -5784,22 +5784,22 @@ $(document).ready(function () {
});
const elementsToUpdate = {
'#description_textarea': function() { create_save_description = $("#description_textarea").val(); },
'#creator_notes_textarea': function() { create_save_creator_notes = $("#creator_notes_textarea").val(); },
'#character_version_textarea': function() { create_save_character_version = $("#character_version_textarea").val(); },
'#system_prompt_textarea': function() { create_save_system_prompt = $("#system_prompt_textarea").val(); },
'#post_history_instructions_textarea': function() { create_save_post_history_instructions = $("#post_history_instructions_textarea").val(); },
'#creator_textarea': function() { create_save_creator = $("#creator_textarea").val(); },
'#tags_textarea': function() { create_save_tags = $("#tags_textarea").val(); },
'#personality_textarea': function() { create_save_personality = $("#personality_textarea").val(); },
'#scenario_pole': function() { create_save_scenario = $("#scenario_pole").val(); },
'#mes_example_textarea': function() { create_save_mes_example = $("#mes_example_textarea").val(); },
'#firstmessage_textarea': function() { create_save_first_message = $("#firstmessage_textarea").val(); },
'#talkativeness_slider': function() { create_save_talkativeness = $("#talkativeness_slider").val(); },
'#description_textarea': function () { create_save_description = $("#description_textarea").val(); },
'#creator_notes_textarea': function () { create_save_creator_notes = $("#creator_notes_textarea").val(); },
'#character_version_textarea': function () { create_save_character_version = $("#character_version_textarea").val(); },
'#system_prompt_textarea': function () { create_save_system_prompt = $("#system_prompt_textarea").val(); },
'#post_history_instructions_textarea': function () { create_save_post_history_instructions = $("#post_history_instructions_textarea").val(); },
'#creator_textarea': function () { create_save_creator = $("#creator_textarea").val(); },
'#tags_textarea': function () { create_save_tags = $("#tags_textarea").val(); },
'#personality_textarea': function () { create_save_personality = $("#personality_textarea").val(); },
'#scenario_pole': function () { create_save_scenario = $("#scenario_pole").val(); },
'#mes_example_textarea': function () { create_save_mes_example = $("#mes_example_textarea").val(); },
'#firstmessage_textarea': function () { create_save_first_message = $("#firstmessage_textarea").val(); },
'#talkativeness_slider': function () { create_save_talkativeness = $("#talkativeness_slider").val(); },
};
Object.keys(elementsToUpdate).forEach(function(id) {
$(id).on("input", function() {
Object.keys(elementsToUpdate).forEach(function (id) {
$(id).on("input", function () {
if (menu_type == "create") {
elementsToUpdate[id]();
} else {
@ -5966,34 +5966,37 @@ $(document).ready(function () {
}
});
$("body").click(function () {
if ($("#options").css("opacity") == 1.0) {
$("#options").transition({
opacity: 0.0,
duration: 100, //animation_duration,
easing: animation_easing,
complete: function () {
$("#options").css("display", "none");
},
});
}
});
let hideOptionsTimeout;
$("#options_button").click(function () {
// this is the options button click function, shows the options menu if closed
if (
$("#options").css("display") === "none" &&
$("#options").css("opacity") == 0.0
) {
optionsPopper.update();
showBookmarksButtons();
$("#options").css("display", "block");
$("#options").transition({
opacity: 1.0, // the manual setting of CSS via JS is what allows the click-away feature to work
duration: 100,
easing: animation_easing,
complete: function () { optionsPopper.update(); },
});
function showOptions() {
showBookmarksButtons();
optionsPopper.update();
const optionsDiv = $("#options");
const optionsButtonDiv = $("#options_button");
const hideOptions = () => {
if (!optionsDiv.is(':hover') && !optionsButtonDiv.is(':hover')) {
optionsDiv.hide(200);
}
};
optionsDiv.on('mouseenter touchstart', () => clearTimeout(hideOptionsTimeout));
optionsButtonDiv.on('mouseenter touchstart', () => clearTimeout(hideOptionsTimeout));
optionsDiv.on('mouseleave', () => hideOptionsTimeout = setTimeout(hideOptions, 500));
optionsButtonDiv.on('mouseleave', () => hideOptionsTimeout = setTimeout(hideOptions, 500));
optionsDiv.show(200);
}
$("#options_button").on('mouseenter click touchstart', showOptions);
$(document).on('click touchend', (e) => {
const target = e.target;
const optionsDiv = $("#options");
const optionsButtonDiv = $("#options_button");
if (!$(target).closest(optionsDiv).length && !$(target).closest(optionsButtonDiv).length &&
target !== optionsDiv[0] && target !== optionsButtonDiv[0] &&
!optionsDiv.is(':hover') &&
!optionsButtonDiv.is(':hover')) {
optionsDiv.hide(200);
}
});