diff --git a/front/css/app.css b/front/css/app.css index 5fa97460..c1764674 100755 --- a/front/css/app.css +++ b/front/css/app.css @@ -875,24 +875,24 @@ input[readonly] { cursor: not-allowed; } - .removable-option:hover::before { + .interactable-option:hover::before { opacity: 1; } - .removable-option::before { - content: 'Double-click to ❌'; + .interactable-option::before { + content: 'Click 📝 | 2x❌'; position: absolute; right: 0; top: 0; color: white; - background-color: rgb(255, 87, 87); + background-color: rgb(255, 188, 87); padding: 3px; transition: opacity 0.5s; opacity: 0; border-radius: 3px; } -.removable-option:hover { +.interactable-option:hover { transition: background-color 2s; cursor: pointer; } diff --git a/front/js/common.js b/front/js/common.js index c4c2df42..794ab085 100755 --- a/front/js/common.js +++ b/front/js/common.js @@ -366,6 +366,28 @@ function showModalInput (title, message, btnCancel=getString('Gen_Cancel'), btnO $('#modal-input').modal('show'); } +// ----------------------------------------------------------------------------- +function showModalFieldInput (title, message, btnCancel=getString('Gen_Cancel'), btnOK=getString('Gen_Okay'), curValue="", callbackFunction=null) { + // set captions + prefix = 'modal-field-input' + + $(`#${prefix}-title`).html (title); + $(`#${prefix}-message`).html (message); + $(`#${prefix}-cancel`).html (btnCancel); + $(`#${prefix}-OK`).html (btnOK); + + if ( callbackFunction != null) + { + modalCallbackFunction = callbackFunction; + } + + $(`#modal-field-input-field`).val(curValue) + + + // Show modal + $(`#${prefix}`).modal('show'); +} + // ----------------------------------------------------------------------------- function modalDefaultOK () { // Hide modal diff --git a/front/js/settings_utils.js b/front/js/settings_utils.js index dc4d3ddf..28640a85 100755 --- a/front/js/settings_utils.js +++ b/front/js/settings_utils.js @@ -185,11 +185,42 @@ // ------------------------------------------------------------------- // Function to initialize remove functionality on select options -function initRemoveBtnOptn(selectorId) { + +let isDoubleClick = false; + +function initListInteractionOptions(selectorId) { + + $(`#${selectorId} option`).addClass('interactable-option') + // Attach double-click event listeners to "Remove" - $(`#${selectorId} option`).addClass('removable-option').on('dblclick', function() { - const $option = $(this); - removeOptionItem($option); + $(`#${selectorId} option`).on('dblclick', function() { + isDoubleClick = true; + const $option = $(this); + removeOptionItem($option); + }); + + $(`#${selectorId} option`).on('click', function() { + const $option = $(this); + + // Reset the flag after a short delay + setTimeout(() => { + console.log(isDoubleClick); + if (!isDoubleClick) { + // Single-click action + showModalFieldInput ( + ` ${getString('DevDetail_button_AddIcon')}`, + getString('DevDetail_button_AddIcon_Help'), + getString('Gen_Cancel'), + getString('Gen_Okay'), + $option.html(), + function() { + alert('aaa'); + }); + + isDoubleClick = false; + } + + }, 300); // Adjust this delay as needed }); } @@ -198,3 +229,9 @@ function initRemoveBtnOptn(selectorId) { + + + + + + diff --git a/front/php/templates/notification.php b/front/php/templates/notification.php index 2bf69f1a..92b46c9b 100755 --- a/front/php/templates/notification.php +++ b/front/php/templates/notification.php @@ -94,7 +94,7 @@ - +