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

correctly togglin the item row editor

Browse source
This commit is contained in:
mic 2024-05-13 21:04:53 +02:00
parent 3e2c31d9e9
commit 3aa770c664
2 changed files with 60 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
customprompts/mzta-custom-prompts.css
View file

@ -83,3 +83,8 @@ table td.properties{
#formNew{ #formNew{
display: none; display: none;
} }
.text_output{
width: 100%;
height: 9em;
}

75
customprompts/mzta-custom-prompts.js
View file

@ -27,60 +27,60 @@ var idnumMax = 0;
document.addEventListener('DOMContentLoaded', async () => { document.addEventListener('DOMContentLoaded', async () => {
let options = { let options = {
valueNames: [ { data: ['idnum'] }, 'is_default', 'id', 'name', 'text', 'type', 'action', 'position_compose', 'position_display', { name: 'need_selected', attr: 'checked_val'}, { name: 'need_signature', attr: 'checked_val'}, { name: 'need_custom_text', attr: 'checked_val'}, { name: 'enabled', attr: 'checked_val'} ], valueNames: [ { data: ['idnum'] }, 'is_default', 'id', 'name', 'text', 'type', 'action', 'position_compose', 'position_display', { name: 'need_selected', attr: 'checked_val'}, { name: 'need_signature', attr: 'checked_val'}, { name: 'need_custom_text', attr: 'checked_val'}, { name: 'enabled', attr: 'checked_val'} ],
item: function(values) { //TODO: manage ACTION edit with the select item: function(values) {
let type_output = ''; let type_output = '';
switch(String(values.type)){ switch(String(values.type)){
case "0": case "0":
type_output = `<span>__MSG_customPrompts_add_to_menu_always__</span>`; type_output = `__MSG_customPrompts_add_to_menu_always__`;
break; break;
case "1": case "1":
type_output = `<span>__MSG_customPrompts_add_to_menu_reading__</span>`; type_output = `__MSG_customPrompts_add_to_menu_reading__`;
break; break;
case "2": case "2":
type_output = `<span>__MSG_customPrompts_add_to_menu_composing__</span>`; type_output = `__MSG_customPrompts_add_to_menu_composing__`;
break; break;
} }
let action_output = ''; let action_output = '';
switch(String(values.action)){ switch(String(values.action)){
case "0": case "0":
action_output = `<span>__MSG_customPrompts_close_button__</span>`; action_output = `__MSG_customPrompts_close_button__`;
break; break;
case "1": case "1":
action_output = `<span>__MSG_customPrompts_save_button__</span>`; action_output = `__MSG_customPrompts_save_button__`;
break; break;
case "2": case "2":
action_output = `<span>__MSG_customPrompts_do_reply__</span>`; action_output = `__MSG_customPrompts_do_reply__`;
break; break;
} }
//console.log('>>>>>>>>>>>>> action_output: ' + JSON.stringify(action_output)); //console.log('>>>>>>>>>>>>> action_output: ' + JSON.stringify(action_output));
let output = `<tr ` + ((values.is_default == 1) ? 'class="is_default"':'') + `> let output = `<tr ` + ((values.is_default == 1) ? 'class="is_default"':'') + `>
<td><span class="id"></span></td> <td><span class="id id_show"></span><input type="text" class="input_mod hiddendata id_output" value="` + values.id + `" /></td>
<td><span class="name"></span></td> <td><span class="name name_show"></span><input type="text" class="input_mod hiddendata name_output" value="` + values.name + `" /></td>
<td><span class="text"></span></td> <td><span class="text text_show"></span><textarea class="input_mod hiddendata text_output">` + values.text + `</textarea></td>
<td>` + ((values.is_default == 1) ? type_output : <td><span class="type_show">` + type_output + `</span>
`<select class="input_mod type_output"> <select class="input_mod type_output hiddendata">
<option value="0"` + ((values.type == 0) ? ' selected':'') + `>__MSG_customPrompts_add_to_menu_always__</option> <option value="0"` + ((values.type == 0) ? ' selected':'') + `>__MSG_customPrompts_add_to_menu_always__</option>
<option value="1"` + ((values.type == 1) ? ' selected':'') + `>__MSG_customPrompts_add_to_menu_reading__</option> <option value="1"` + ((values.type == 1) ? ' selected':'') + `>__MSG_customPrompts_add_to_menu_reading__</option>
<option value="2"` + ((values.type == 2) ? ' selected':'') + `>__MSG_customPrompts_add_to_menu_composing__</option> <option value="2"` + ((values.type == 2) ? ' selected':'') + `>__MSG_customPrompts_add_to_menu_composing__</option>
</select>`) + </select>` +
`<span class="type hiddendata"></span> `<span class="type hiddendata"></span>
</td> </td>
<td> <td>
Action: ` + ((values.is_default == 1) ? action_output : Action: <span class="action_show">` + action_output + `</span>
`<select class="input_mod type_action"> <select class="input_mod action_output hiddendata">
<option value="0"` + ((values.action == 0) ? ' selected':'') + `>__MSG_customPrompts_close_button__</option> <option value="0"` + ((values.action == 0) ? ' selected':'') + `>__MSG_customPrompts_close_button__</option>
<option value="1"` + ((values.action == 1) ? ' selected':'') + `>__MSG_customPrompts_do_reply__</option> <option value="1"` + ((values.action == 1) ? ' selected':'') + `>__MSG_customPrompts_do_reply__</option>
<option value="2"` + ((values.action == 2) ? ' selected':'') + `>__MSG_customPrompts_substitute_text__</option> <option value="2"` + ((values.action == 2) ? ' selected':'') + `>__MSG_customPrompts_substitute_text__</option>
</select>`) + </select>` +
`<span class="action hiddendata"></span> `<span class="action hiddendata"></span>
<br> <br>
<input type="checkbox" class="need_selected input_mod"` + ((values.is_default == 1) ? ' disabled':'') + `> Need Select <input type="checkbox" class="need_selected input_mod" disabled> Need Select
<br> <br>
<input type="checkbox" class="need_signature input_mod" ` + ((values.is_default == 1) ? ' disabled':'') + `> Need Signature <input type="checkbox" class="need_signature input_mod" disabled> Need Signature
<br> <br>
<input type="checkbox" class="need_custom_text input_mod"` + ((values.is_default == 1) ? ' disabled':'') + `> Need Custom Text <input type="checkbox" class="need_custom_text input_mod" disabled> Need Custom Text
<br> <br>
<input type="checkbox" class="enabled input_mod"> Enabled <input type="checkbox" class="enabled input_mod"> Enabled
<span class="is_default hiddendata"></span> <span class="is_default hiddendata"></span>
@ -151,7 +151,7 @@ document.addEventListener('DOMContentLoaded', async () => {
}); });
// Log data ID number from item row and prepare for edit action // Log data ID number from item row and prepare for edit action
function handleEditClick(e) { //TODO function handleEditClick(e) {
e.preventDefault(); e.preventDefault();
const tr = e.target.parentNode.parentNode; const tr = e.target.parentNode.parentNode;
//console.log('>>>>>>>> tr: ' + tr.getAttribute('data-idnum')); //console.log('>>>>>>>> tr: ' + tr.getAttribute('data-idnum'));
@ -160,12 +160,46 @@ document.addEventListener('DOMContentLoaded', async () => {
tr.querySelector('.btnCancelItem').style.display = 'inline'; // Cancel btn tr.querySelector('.btnCancelItem').style.display = 'inline'; // Cancel btn
// tr.querySelector('.btnEditItem').style.display = 'none'; // Edit btn // tr.querySelector('.btnEditItem').style.display = 'none'; // Edit btn
tr.querySelector('.btnDeleteItem').style.display = 'none'; // Delete btn tr.querySelector('.btnDeleteItem').style.display = 'none'; // Delete btn
showItemRowEditor(tr);
} }
let btnEditItem_elements = document.querySelectorAll(".btnEditItem"); let btnEditItem_elements = document.querySelectorAll(".btnEditItem");
btnEditItem_elements.forEach(element => { btnEditItem_elements.forEach(element => {
element.addEventListener('click', handleEditClick); element.addEventListener('click', handleEditClick);
}); });
function showItemRowEditor(tr) {
tr.querySelector('.id_output').style.display = 'inline';
tr.querySelector('.id_show').style.display = 'none';
tr.querySelector('.name_output').style.display = 'inline';
tr.querySelector('.name_show').style.display = 'none';
tr.querySelector('.text_output').style.display = 'inline';
tr.querySelector('.text_show').style.display = 'none';
tr.querySelector('.type_output').style.display = 'inline';
tr.querySelector('.type_show').style.display = 'none';
tr.querySelector('.action_output').style.display = 'inline';
tr.querySelector('.action_show').style.display = 'none';
tr.querySelector('input.need_selected').disabled = false;
tr.querySelector('input.need_signature').disabled = false;
tr.querySelector('input.need_custom_text').disabled = false;
}
function hideItemRowEditor(tr) {
tr.querySelector('.id_output').style.display = 'none';
tr.querySelector('.id_show').style.display = 'inline';
tr.querySelector('.name_output').style.display = 'none';
tr.querySelector('.name_show').style.display = 'inline';
tr.querySelector('.text_output').style.display = 'none';
tr.querySelector('.text_show').style.display = 'inline';
tr.querySelector('.type_output').style.display = 'none';
tr.querySelector('.type_show').style.display = 'inline';
tr.querySelector('.action_output').style.display = 'none';
tr.querySelector('.action_show').style.display = 'inline';
tr.querySelector('input.need_selected').disabled = true;
tr.querySelector('input.need_signature').disabled = true;
tr.querySelector('input.need_custom_text').disabled = true;
}
// Confirm and log deletion action // Confirm and log deletion action
function handleDeleteClick(e) { function handleDeleteClick(e) {
e.preventDefault(); e.preventDefault();
@ -191,6 +225,7 @@ document.addEventListener('DOMContentLoaded', async () => {
// tr.querySelector('.btnCancelItem').style.display = 'none'; // Cancel btn // tr.querySelector('.btnCancelItem').style.display = 'none'; // Cancel btn
tr.querySelector('.btnEditItem').style.display = 'inline'; // Edit btn tr.querySelector('.btnEditItem').style.display = 'inline'; // Edit btn
tr.querySelector('.btnDeleteItem').style.display = 'inline'; // Delete btn tr.querySelector('.btnDeleteItem').style.display = 'inline'; // Delete btn
hideItemRowEditor(tr);
} }
let btnCancelItem_elements = document.querySelectorAll(".btnCancelItem"); let btnCancelItem_elements = document.querySelectorAll(".btnCancelItem");
btnCancelItem_elements.forEach(element => { btnCancelItem_elements.forEach(element => {