jason/ThunderAI
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

interaction with the prompts selector improved

Browse source
This commit is contained in:
mic 2024-09-14 22:19:08 +02:00
parent edf78fffdc
commit 189e11e987
1 changed files with 73 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

112
js/mzta-compose-script.js
View file

@ -64,7 +64,7 @@ switch (message.command) {
break; break;
case 'searchPrompt': case 'searchPrompt':
searchPrompt(message._prompts_data, message.tab_type); searchPrompt(message._prompts_data, message.tabId, message._tab_type);
break; break;
default: default:
@ -74,7 +74,7 @@ switch (message.command) {
}); });
async function searchPrompt(allPrompts, tabType){ async function searchPrompt(allPrompts, tabId, tabType){
console.log(">>>>>>>>>>>>>> allPrompts: " + JSON.stringify(allPrompts)); console.log(">>>>>>>>>>>>>> allPrompts: " + JSON.stringify(allPrompts));
console.log(">>>>>>>>>>>>>>> tabType: " + tabType); console.log(">>>>>>>>>>>>>>> tabType: " + tabType);
const banner = document.createElement('div'); const banner = document.createElement('div');
@ -128,6 +128,16 @@ async function searchPrompt(allPrompts, tabType){
return; return;
} }
// Prepend numbers to the first 10 items
Array.from(filteredData).slice(0, 10).forEach((item, index) => {
const number = (index < 9) ? (index + 1).toString() : '0';
// Check if the number is already prepended to avoid duplication
if (!item.numberPrepended) {
item.label = `${number}. ${item.label}`;
item.numberPrepended = 'true'; // Mark as prepended
}
});
// Create a div for each filtered result // Create a div for each filtered result
filteredData.forEach(item => { filteredData.forEach(item => {
const itemDiv = document.createElement('div'); const itemDiv = document.createElement('div');
@ -152,44 +162,66 @@ async function searchPrompt(allPrompts, tabType){
// Add a keydown event listener to handle arrow navigation and selection // Add a keydown event listener to handle arrow navigation and selection
input.addEventListener('keydown', function (e) { input.addEventListener('keydown', function (e) {
const items = autocompleteList.getElementsByClassName('mzta_autocomplete-item'); // Handle Escape key to remove the banner
if ((autocompleteList.style.display === 'none' || items.length === 0) && (e.key !== 'Enter')) { if (e.key === 'Escape') {
return; // Do nothing if the autocomplete list is not visible e.preventDefault(); // Prevent any default behavior
} banner.remove(); // Remove the banner
return; // Exit the handler
}
const items = autocompleteList.getElementsByClassName('mzta_autocomplete-item');
if ((autocompleteList.style.display === 'none' || items.length === 0)
&& (e.key !== 'Enter')
&& !['1','2','3','4','5','6','7','8','9','0'].includes(e.key))
{
return; // Do nothing if the autocomplete list is not visible
}
if (e.key === 'ArrowDown') { // Handle number key presses (1-9,0) to select the corresponding item directly
// Navigate down the list if (['1','2','3','4','5','6','7','8','9','0'].includes(e.key)) {
currentFocus++; // Map '1' to index 0, '2' to 1, ..., '9' to 8, '0' to 9
if (currentFocus >= items.length) currentFocus = 0; // Wrap to the first item const numIndex = (e.key === '0') ? 9 : parseInt(e.key, 10) - 1;
addActive(items); if (items[numIndex]) {
e.preventDefault(); // Prevent cursor from moving to the end e.preventDefault(); // Prevent any default behavior
} else if (e.key === 'ArrowUp') { // Dispatch a mousedown event to simulate a click/select action
// Navigate up the list items[numIndex].dispatchEvent(new Event('mousedown'));
currentFocus--; return; // Exit after handling the number key
if (currentFocus < 0) currentFocus = items.length - 1; // Wrap to the last item }
addActive(items); }
e.preventDefault(); // Prevent cursor from moving to the start
} else if (e.key === 'Enter') { if (e.key === 'ArrowDown') {
console.log(">>>>>>>>>>>>>> keydown == enter selectedId: " + selectedId); // Navigate down the list
if (selectedId) { currentFocus++;
// If an item is already selected, call sendPrompt with the selected ID if (currentFocus >= items.length) currentFocus = 0; // Wrap to the first item
e.preventDefault(); addActive(items);
sendPrompt(selectedId); // Call your sendPrompt function e.preventDefault(); // Prevent cursor from moving to the end
banner.remove(); // Optionally remove the banner after sending the prompt } else if (e.key === 'ArrowUp') {
} else { // Navigate up the list
// If no item is selected yet, select the highlighted item currentFocus--;
// Select the highlighted item, or the first item if none is highlighted if (currentFocus < 0) currentFocus = items.length - 1; // Wrap to the last item
e.preventDefault(); // Prevent form submission if inside a form addActive(items);
if (currentFocus > -1) { e.preventDefault(); // Prevent cursor from moving to the start
if (items[currentFocus]) { } else if (e.key === 'Enter') {
items[currentFocus].dispatchEvent(new Event('mousedown')); // Trigger the mousedown event console.log(">>>>>>>>>>>>>> keydown == enter selectedId: " + selectedId);
} if (selectedId) {
} else if (items.length > 0) { // If an item is already selected, call sendPrompt with the selected ID
// If no item is highlighted, select the first item e.preventDefault();
items[0].dispatchEvent(new Event('mousedown')); sendPrompt(selectedId, tabId); // Call your sendPrompt function
} banner.remove(); // Optionally remove the banner after sending the prompt
} else {
// If no item is selected yet, select the highlighted item
// Select the highlighted item, or the first item if none is highlighted
e.preventDefault(); // Prevent form submission if inside a form
if (currentFocus > -1) {
if (items[currentFocus]) {
items[currentFocus].dispatchEvent(new Event('mousedown')); // Trigger the mousedown event
}
} else if (items.length > 0) {
// If no item is highlighted, select the first item
items[0].dispatchEvent(new Event('mousedown'));
} }
} }
}
}); });
// Function to add the "active" class to the current item // Function to add the "active" class to the current item
@ -217,11 +249,13 @@ async function searchPrompt(allPrompts, tabType){
document.body.insertBefore(banner, document.body.firstChild); document.body.insertBefore(banner, document.body.firstChild);
setTimeout(() => { setTimeout(() => {
input.focus();
input.dispatchEvent(new InputEvent('input', { bubbles: true })); input.dispatchEvent(new InputEvent('input', { bubbles: true }));
input.focus();
}, 100); }, 100);
} }
function sendPrompt(prompt_id){
function sendPrompt(prompt_id, tabId){
console.log(">>>>>>>>>>>>> [ThunderAI] sendPrompt: " + prompt_id); console.log(">>>>>>>>>>>>> [ThunderAI] sendPrompt: " + prompt_id);
browser.runtime.sendMessage({command: "shortcut_do_prompt", tabId: tabId, promptId: prompt_id});
} }