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

addtags textarea has now autocomplete for placeholders. see #183

Browse source
This commit is contained in:
mic 2024-12-15 20:50:18 +01:00
parent e67b3a1526
commit 76aaa87bef
3 changed files with 78 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

76
pages/addtags/mzta-add-tags.css
View file

@ -1,15 +1,3 @@
@media (prefers-color-scheme: dark) {
body {
background-color: #1C1B22;
color: rgb(251, 251, 254);
}
a:link { color: #409EFF; }
a:visited { color: #409EFF; }
a:hover { color: #66B1FF; }
a:active { color: #66B1FF; }
}
#addtags_prompt_container{
width: 90%;
margin: 20px auto;
@ -40,4 +28,68 @@
#addtags_info_limit_num{
display: none;
}
.autocomplete-container {
position: relative;
}
.autocomplete-list {
position: absolute;
top: 100%;
left: 0;
right: 0;
background-color: white;
border: 1px solid #ccc;
z-index: 1000;
max-height: 200px;
overflow-y: auto;
padding: 0;
margin: 0;
list-style: none;
font-size: small;
}
.autocomplete-list li {
padding: 8px;
cursor: pointer;
}
.autocomplete-list li:hover {
background-color: #f0f0f0;
}
.autocomplete-list li.active {
background-color: #ddd;
}
.hidden {
display: none;
}
@media (prefers-color-scheme: dark) {
body {
background-color: #1C1B22;
color: rgb(251, 251, 254);
}
a:link { color: #409EFF; }
a:visited { color: #409EFF; }
a:hover { color: #66B1FF; }
a:active { color: #66B1FF; }
a:active { color: #66B1FF; }
.autocomplete-list {
background-color: #2E2F36;
border: 1px solid #2E2F36;
}
.autocomplete-list li:hover {
background-color: #4c4e58;
}
.autocomplete-list li.active {
background-color: #4c4e58;
}
}

6
pages/addtags/mzta-add-tags.html
View file

@ -14,7 +14,11 @@
<div id="addtags_prompt_container">
__MSG_AddTags_prompt_text_title__
<br><span class="infoline">__MSG_prefs_OptionText_btnManagePrompts_infoline__ <a href="https://micz.it/thunderbird-addon-thunderai/data-placeholders/">__MSG_customPrompts_managePrompts_help__</a></span>
<br><textarea id="addtags_prompt_text" rows="15"></textarea>
<br>
<div class="autocomplete-container">
<textarea id="addtags_prompt_text" rows="15"></textarea>
<ul class="autocomplete-list hidden"></ul>
</div>
<div id="addtags_info_limit_num"></div>
<div class="btn_div"><button id="btn_save_prompt" disabled>__MSG_save__</button></div>
</div>

10
pages/addtags/mzta-add-tags.js
View file

@ -17,13 +17,18 @@
*/
import { getSpecialPrompts, setSpecialPrompts } from "../../js/mzta-prompts.js";
import { getPlaceholders } from "../../js/mzta-placeholders.js";
import { textareaAutocomplete } from "../../js/mzta-placeholders-autocomplete.js";
let autocompleteSuggestions = [];
document.addEventListener('DOMContentLoaded', async () => {
let specialPrompts = await getSpecialPrompts();
let addtags_prompt = specialPrompts.find(prompt => prompt.id === 'prompt_add_tags');
let addtags_textarea = document.getElementById('addtags_prompt_text');
addtags_prompt.text = browser.i18n.getMessage(addtags_prompt.text);
document.getElementById('addtags_prompt_text').value = addtags_prompt.text;
addtags_textarea.value = addtags_prompt.text;
let prefs_maxt = await browser.storage.sync.get({add_tags_maxnum: 3});
if(prefs_maxt.add_tags_maxnum > 0){
@ -32,5 +37,8 @@ document.addEventListener('DOMContentLoaded', async () => {
el_tag_limit.style.display = 'block';
}
autocompleteSuggestions = (await getPlaceholders(true)).filter(p => !(p.id === 'selected_text' || p.id === 'additional_text')).map(p => ({command: '{%'+p.id+'%}', type: p.type}));
textareaAutocomplete(addtags_textarea, autocompleteSuggestions, 1); // type_value = 1, only when reading an email
i18n.updateDocument();
});