diff --git a/front/css/app.css b/front/css/app.css index bc8485b3..fd31ed46 100755 --- a/front/css/app.css +++ b/front/css/app.css @@ -1116,7 +1116,7 @@ input[readonly] { /* Devices page */ /* ----------------------------------------------------------------- */ -#txtIconFA { +.iconPreview { min-width: 40px; } diff --git a/front/deviceDetails.php b/front/deviceDetails.php index 0669e778..6aa28f39 100755 --- a/front/deviceDetails.php +++ b/front/deviceDetails.php @@ -197,8 +197,8 @@
- - + + '> '>
@@ -755,7 +755,7 @@ function main () { // Show device icon as it changes $('#txtIcon').on('change input', function() { - updateIconPreview('#txtIcon') + updateIconPreview(this) }); @@ -1136,7 +1136,7 @@ function initializeCalendar () { showSpinner() } else { setTimeout(() => { - updateIconPreview('#txtIcon') + updateIconPreview($('#txtIcon')) }, 500); hideSpinner() @@ -1667,7 +1667,7 @@ function addAsBase64 () { $('#txtIcon').val(iconHtmlBase64); - updateIconPreview('#txtIcon') + updateIconPreview($('#txtIcon')) } diff --git a/front/js/settings_utils.js b/front/js/settings_utils.js index cc832160..3399ba0a 100755 --- a/front/js/settings_utils.js +++ b/front/js/settings_utils.js @@ -667,7 +667,11 @@ const handleElementOptions = (codeName, elementOptions, transformers, val) => { let valRes = val; let sourceIds = []; let getStringKey = ""; - let onClick = "alert('Not implemented');"; + let onClick = "console.log('onClick - Not implemented');"; + let onChange = "console.log('onChange - Not implemented');"; + let customParams = ""; + let customId = ""; + elementOptions.forEach((option) => { if (option.prefillValue) { @@ -711,6 +715,15 @@ const handleElementOptions = (codeName, elementOptions, transformers, val) => { if (option.onClick) { onClick = option.onClick; } + if (option.onChange) { + onChange = option.onChange; + } + if (option.customParams) { + customParams = option.customParams; + } + if (option.customId) { + customId = option.customId; + } }); if (transformers.includes("sha256")) { @@ -731,6 +744,9 @@ const handleElementOptions = (codeName, elementOptions, transformers, val) => { valRes, getStringKey, onClick, + onChange, + customParams, + customId }; }; diff --git a/front/js/ui_components.js b/front/js/ui_components.js index df9e6da9..087fe2d3 100755 --- a/front/js/ui_components.js +++ b/front/js/ui_components.js @@ -68,23 +68,66 @@ function initDeviceSelectors(devicesListAll_JSON) { } -// ----------------------------------------------------------------------------- +// ---------------------------------------------- // Updates the icon preview -function updateIconPreview (inputId) { - // update icon - iconInput = $(inputId) +function updateIconPreview(elem) { + // Retrieve and parse custom parameters from the element + let params = $(elem).attr("my-customparams")?.split(',').map(param => param.trim()); - value = iconInput.val() + // console.log(params); - iconInput.on('change input', function() { - $('#txtIconFA').html(atob(value)) - }); + if (params && params.length >= 2) { + var inputElementID = params[0]; + var targetElementID = params[1]; + } else { + console.error("Invalid parameters passed to updateIconPreview function"); + return; + } - $('#txtIconFA').html(atob(value)) - + // Get the input element using the inputElementID + let iconInput = $("#" + inputElementID); + + if (iconInput.length === 0) { + console.error("Icon input element not found"); + return; + } + + // Get the initial value and update the target element + let value = iconInput.val(); + if (!value) { + console.error("Input value is empty or not defined"); + return; + } + + if (!targetElementID) { + targetElementID = "txtIcon"; + } + + // Check if the target element exists, if not find an element with matching custom attribute + let targetElement = $('#' + targetElementID); + if (targetElement.length === 0) { + // Look for an element with my-custom-id attribute equal to targetElementID + targetElement = $('[my-customid="' + targetElementID + '"]'); + if (targetElement.length === 0) { + console.error("Neither target element with ID nor element with custom attribute found"); + return; + } + } + + // Update the target element with decoded base64 value + targetElement.html(atob(value)); + + // Add event listener to update the icon on input change + iconInput.on('change input', function () { + let newValue = $(this).val(); + $('#' + targetElementID).html(atob(newValue)); + }); } + + + // ----------------------------------------------------------------------------- // Generic function to copy text to clipboard function copyToClipboard(buttonElement) { diff --git a/front/multiEditCore.php b/front/multiEditCore.php index c901c30d..df1a4cb0 100755 --- a/front/multiEditCore.php +++ b/front/multiEditCore.php @@ -101,19 +101,20 @@ for (let j = i * elementsPerColumn; j < Math.min((i + 1) * elementsPerColumn, columns.length); j++) { const setTypeObject = JSON.parse(columns[j].Type.replace(/'/g, '"')); - // console.log(setTypeObject); 🔽 - // const lastElementObj = setTypeObject.elements[setTypeObject.elements.length - 1] // get the element with the input value(s) - let elementsWithInputValue = setTypeObject.elements.filter(element => element.elementHasInputValue === 1); + let elements = setTypeObject.elements.filter(element => element.elementHasInputValue === 1); // if none found, take last - if(elementsWithInputValue.length == 0) + if(elements.length == 0) { - elementsWithInputValue = setTypeObject.elements[setTypeObject.elements.length - 1] + elementWithInputValue = setTypeObject.elements[setTypeObject.elements.length - 1] + } else + { + elementWithInputValue = elements[0] } - const { elementType, elementOptions = [], transformers = [] } = elementsWithInputValue; + const { elementType, elementOptions = [], transformers = [] } = elementWithInputValue; const { inputType, readOnly, @@ -127,26 +128,28 @@ editable, valRes, getStringKey, - onClick + onClick, + onChange, + customParams, + customId } = handleElementOptions('none', elementOptions, transformers, val = ""); - // console.log(setTypeObject); - // console.log(inputType); - // render based on element type - if (elementsWithInputValue.elementType === 'select') { + if (elementType === 'select') { targetLocation = columns[j].Code_Name + "_generateSetOptions" generateOptionsOrSetOptions(columns[j].Code_Name, [], targetLocation, generateOptions) - // Handle Icons as tehy need a preview + console.log(columns[j].Code_Name) + // Handle Icons as they need a preview if(columns[j].Code_Name == 'NEWDEV_dev_Icon') { input = ` - + ` diff --git a/front/php/templates/language/cs_cz.json b/front/php/templates/language/cs_cz.json index 149f2583..08b74361 100755 --- a/front/php/templates/language/cs_cz.json +++ b/front/php/templates/language/cs_cz.json @@ -295,6 +295,7 @@ "Gen_Save": "", "Gen_Saved": "", "Gen_Search": "", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "", "Gen_Switch": "", "Gen_Upd": "", diff --git a/front/php/templates/language/de_de.json b/front/php/templates/language/de_de.json index 0894abc5..04706b6e 100755 --- a/front/php/templates/language/de_de.json +++ b/front/php/templates/language/de_de.json @@ -307,6 +307,7 @@ "Gen_Save": "Speichern", "Gen_Saved": "Gespeichert", "Gen_Search": "Suchen", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "Ausgewählte Geräte:", "Gen_Switch": "Umschalten", "Gen_Upd": "Aktualisierung erfolgreich", diff --git a/front/php/templates/language/en_us.json b/front/php/templates/language/en_us.json index e6b4473a..f0cb674d 100755 --- a/front/php/templates/language/en_us.json +++ b/front/php/templates/language/en_us.json @@ -295,6 +295,7 @@ "Gen_Save": "Save", "Gen_Saved": "Saved", "Gen_Search": "Search", + "Gen_SelectToPreview": "Select to preview", "Gen_Selected_Devices": "Selected Devices:", "Gen_Switch": "Switch", "Gen_Upd": "Updated successfully", diff --git a/front/php/templates/language/es_es.json b/front/php/templates/language/es_es.json index 9ea1a865..def437fb 100755 --- a/front/php/templates/language/es_es.json +++ b/front/php/templates/language/es_es.json @@ -305,6 +305,7 @@ "Gen_Save": "Guardar", "Gen_Saved": "Guardado", "Gen_Search": "Buscar", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "Dispositivos seleccionados:", "Gen_Switch": "Cambiar", "Gen_Upd": "Actualizado correctamente", diff --git a/front/php/templates/language/fr_fr.json b/front/php/templates/language/fr_fr.json index a507c247..032b7a13 100755 --- a/front/php/templates/language/fr_fr.json +++ b/front/php/templates/language/fr_fr.json @@ -295,6 +295,7 @@ "Gen_Save": "Enregistrer", "Gen_Saved": "Enregistré", "Gen_Search": "Recherche", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "Appareils sélectionnés :", "Gen_Switch": "Basculer", "Gen_Upd": "Mise à jour réussie", diff --git a/front/php/templates/language/it_it.json b/front/php/templates/language/it_it.json index 9c6a1570..33582d4f 100755 --- a/front/php/templates/language/it_it.json +++ b/front/php/templates/language/it_it.json @@ -295,6 +295,7 @@ "Gen_Save": "Salva", "Gen_Saved": "Salvato", "Gen_Search": "Cerca", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "Dispositivi selezionati:", "Gen_Switch": "Cambia", "Gen_Upd": "Aggiornato correttamente", diff --git a/front/php/templates/language/nb_no.json b/front/php/templates/language/nb_no.json index 6f4493e8..4e681bf8 100755 --- a/front/php/templates/language/nb_no.json +++ b/front/php/templates/language/nb_no.json @@ -295,6 +295,7 @@ "Gen_Save": "Lagre", "Gen_Saved": "Lagret", "Gen_Search": "Søk", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "Valgte Enheter:", "Gen_Switch": "Bytt", "Gen_Upd": "Oppdatering vellykket", diff --git a/front/php/templates/language/pl_pl.json b/front/php/templates/language/pl_pl.json index 2405799d..d0dd59e5 100755 --- a/front/php/templates/language/pl_pl.json +++ b/front/php/templates/language/pl_pl.json @@ -295,6 +295,7 @@ "Gen_Save": "Zapisz", "Gen_Saved": "Zapisano", "Gen_Search": "Szukaj", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "Wybierz Urządzenia:", "Gen_Switch": "Switch", "Gen_Upd": "Zaktualizowane poprawnie", diff --git a/front/php/templates/language/pt_br.json b/front/php/templates/language/pt_br.json index 96f497a3..08c76a75 100755 --- a/front/php/templates/language/pt_br.json +++ b/front/php/templates/language/pt_br.json @@ -295,6 +295,7 @@ "Gen_Save": "Salvar", "Gen_Saved": "Salvo", "Gen_Search": "Procurar", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "Dispositivos selecionados:", "Gen_Switch": "Trocar", "Gen_Upd": "Atualizado com sucesso", diff --git a/front/php/templates/language/ru_ru.json b/front/php/templates/language/ru_ru.json index 716a3493..d142ac9f 100755 --- a/front/php/templates/language/ru_ru.json +++ b/front/php/templates/language/ru_ru.json @@ -295,6 +295,7 @@ "Gen_Save": "Сохранить", "Gen_Saved": "Сохранено", "Gen_Search": "Поиск", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "Выбранные устройства:", "Gen_Switch": "Переключить", "Gen_Upd": "Успешное обновление", diff --git a/front/php/templates/language/tr_tr.json b/front/php/templates/language/tr_tr.json index 02d35a5f..ef93255b 100755 --- a/front/php/templates/language/tr_tr.json +++ b/front/php/templates/language/tr_tr.json @@ -295,6 +295,7 @@ "Gen_Save": "Kaydet", "Gen_Saved": "Kaydedildi", "Gen_Search": "", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "Seçilmiş Cihazlar:", "Gen_Switch": "", "Gen_Upd": "Başarılı bir şekilde güncellendi", diff --git a/front/php/templates/language/zh_cn.json b/front/php/templates/language/zh_cn.json index ec16b547..f0e55b41 100755 --- a/front/php/templates/language/zh_cn.json +++ b/front/php/templates/language/zh_cn.json @@ -295,6 +295,7 @@ "Gen_Save": "保存", "Gen_Saved": "已保存", "Gen_Search": "搜索", + "Gen_SelectToPreview": "", "Gen_Selected_Devices": "选定的设备：", "Gen_Switch": "交换", "Gen_Upd": "已成功更新", diff --git a/front/plugins/newdev_template/config.json b/front/plugins/newdev_template/config.json index c61653e3..3c8fc2da 100755 --- a/front/plugins/newdev_template/config.json +++ b/front/plugins/newdev_template/config.json @@ -198,7 +198,7 @@ "elementOptions": [ { "sourceSuffixes": ["_in"] }, { "separator": "" }, - { "cssClasses": "col-sm-2" }, + { "cssClasses": "col-xs-12" }, { "onClick": "addList(this, false)" }, { "getStringKey": "Gen_Add" } ], @@ -219,7 +219,7 @@ "elementOptions": [ { "sourceSuffixes": [] }, { "separator": "" }, - { "cssClasses": "col-sm-3" }, + { "cssClasses": "col-xs-6" }, { "onClick": "removeFromList(this)" }, { "getStringKey": "Gen_Remove_Last" } ], @@ -230,7 +230,7 @@ "elementOptions": [ { "sourceSuffixes": [] }, { "separator": "" }, - { "cssClasses": "col-sm-3" }, + { "cssClasses": "col-xs-6" }, { "onClick": "removeAllOptions(this)" }, { "getStringKey": "Gen_Remove_All" } ], @@ -977,7 +977,27 @@ "type": { "dataType": "string", "elements": [ - { "elementType": "select", "elementOptions": [], "transformers": [] } + { + "elementType": "span", + "elementOptions": [ + { "cssClasses": "input-group-addon iconPreview" }, + { "getStringKey": "Gen_SelectToPreview" }, + { "customId": "NEWDEV_dev_Icon_preview" } + ], + "transformers": [] + }, + { + "elementType": "select", + "elementHasInputValue": 1, + "elementOptions": [ + { "cssClasses": "col-xs-12" }, + { + "onChange": "updateIconPreview(this)" + }, + { "customParams": "NEWDEV_dev_Icon,NEWDEV_dev_Icon_preview" } + ], + "transformers": [] + } ] }, "default_value": "", diff --git a/front/settings.php b/front/settings.php index b5857221..1b05f826 100755 --- a/front/settings.php +++ b/front/settings.php @@ -416,7 +416,7 @@ $settingsJSON_DB = json_encode($settings, JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX
${getString(codeName + '_description', set['Description'])}
-
+
`; // OVERRIDE @@ -485,7 +485,10 @@ $settingsJSON_DB = json_encode($settings, JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX editable, valRes, getStringKey, - onClick + onClick, + onChange, + customParams, + customId } = handleElementOptions(codeName, elementOptions, transformers, valIn); // override @@ -498,7 +501,15 @@ $settingsJSON_DB = json_encode($settings, JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX let addCss = isOrdeable ? "select2 select2-hidden-accessible" : ""; - inputHtml += ` `; @@ -513,8 +524,10 @@ $settingsJSON_DB = json_encode($settings, JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX inputHtml += ` @@ -539,12 +554,25 @@ $settingsJSON_DB = json_encode($settings, JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX inputHtml += ` `; break; + case 'span': + inputHtml += ` + + ${getString(getStringKey)} + `; + break; default: console.warn(`🟥Unknown element type: ${elementType}`); @@ -640,17 +668,21 @@ $settingsJSON_DB = json_encode($settings, JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX // console.log(setTypeObject); const dataType = setTypeObject.dataType; + // get the element with the input value(s) - let elementsWithInputValue = setTypeObject.elements.filter(element => element.elementHasInputValue === 1); + let elements = setTypeObject.elements.filter(element => element.elementHasInputValue === 1); // if none found, take last - if(elementsWithInputValue.length == 0) + if(elements.length == 0) { - elementsWithInputValue = setTypeObject.elements[setTypeObject.elements.length - 1] + elementWithInputValue = setTypeObject.elements[setTypeObject.elements.length - 1] + } else + { + elementWithInputValue = elements[0] } - const { elementType, elementOptions = [], transformers = [] } = elementsWithInputValue; + const { elementType, elementOptions = [], transformers = [] } = elementWithInputValue; const { inputType, readOnly, @@ -664,7 +696,10 @@ $settingsJSON_DB = json_encode($settings, JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX editable, valRes, getStringKey, - onClick + onClick, + onChange, + customParams, + customId } = handleElementOptions('none', elementOptions, transformers, val = ""); let value;