From 7019bb0241b7ba30eb32aa0b188140a2113eeb52 Mon Sep 17 00:00:00 2001 From: Olivier <16240457+TiTidom-RC@users.noreply.github.com> Date: Thu, 8 Jan 2026 20:23:50 +0100 Subject: [PATCH 1/7] Fix SSH host select initialization timing Updated the SSH host select initialization in Monitoring.js to ensure event listeners are attached only after options are loaded asynchronously. Bumped plugin version to 3.4.3. --- desktop/js/Monitoring.js | 19 +++++++++++-------- plugin_info/info.json | 2 +- 2 files changed, 12 insertions(+), 9 deletions(-) diff --git a/desktop/js/Monitoring.js b/desktop/js/Monitoring.js index 88b4f41b..46d0186f 100644 --- a/desktop/js/Monitoring.js +++ b/desktop/js/Monitoring.js @@ -396,14 +396,17 @@ function printEqLogic(_eqLogic) { } } - buildSelectHost(_eqLogic.configuration.SSHHostId) - - // Toggle add/edit button based on SSH host selection - const sshHostSelect = document.querySelector('.sshmanagerHelper[data-helper="list"]') - if (sshHostSelect) { - sshHostSelect.addEventListener('change', toggleSSHButtons) - // Initialize button display - toggleSSHButtons({ currentTarget: sshHostSelect }) + // Build SSH host select and attach listener after options are loaded + const buildPromise = buildSelectHost(_eqLogic.configuration.SSHHostId) + if (buildPromise && buildPromise.then) { + buildPromise.then(() => { + const sshHostSelect = document.querySelector('.sshmanagerHelper[data-helper="list"]') + if (sshHostSelect) { + sshHostSelect.addEventListener('change', toggleSSHButtons) + // Initialize button display + toggleSSHButtons({ currentTarget: sshHostSelect }) + } + }) } } diff --git a/plugin_info/info.json b/plugin_info/info.json index f68d7c2d..202af5de 100644 --- a/plugin_info/info.json +++ b/plugin_info/info.json @@ -1,7 +1,7 @@ { "id": "Monitoring", "name": "Monitoring", - "pluginVersion": "3.4.2", + "pluginVersion": "3.4.3", "description": { "fr_FR": "Plugin permettant le monitoring des équipements locaux et distants (via SSH). Le plugin affichera les informations systèmes d'équipements sous Linux ou Synology (Distribution, CPU, Mémoire, Disques, Swap).", "en_US": "Plugin to monitor local and remote equipments (through SSH). The plugin will display system informations from Linux or Synology (Distribution, CPU, Memory, Disks, Swap).", From e271727114fe5c6de54acec99df9a769bfcec6e8 Mon Sep 17 00:00:00 2001 From: Olivier <16240457+TiTidom-RC@users.noreply.github.com> Date: Thu, 8 Jan 2026 20:29:20 +0100 Subject: [PATCH 2/7] Refactor SSH host select event handling in Monitoring.js Improved the logic for attaching the change event listener to the SSH host select element by ensuring any existing listener is removed before adding a new one. Also, ensured the toggleSSHButtons function is called after the select is populated, handling both promise and non-promise cases from buildSelectHost. --- desktop/js/Monitoring.js | 27 ++++++++++++++++++--------- 1 file changed, 18 insertions(+), 9 deletions(-) diff --git a/desktop/js/Monitoring.js b/desktop/js/Monitoring.js index 46d0186f..354fb74c 100644 --- a/desktop/js/Monitoring.js +++ b/desktop/js/Monitoring.js @@ -396,17 +396,26 @@ function printEqLogic(_eqLogic) { } } - // Build SSH host select and attach listener after options are loaded + // Build SSH host select const buildPromise = buildSelectHost(_eqLogic.configuration.SSHHostId) - if (buildPromise && buildPromise.then) { - buildPromise.then(() => { - const sshHostSelect = document.querySelector('.sshmanagerHelper[data-helper="list"]') - if (sshHostSelect) { - sshHostSelect.addEventListener('change', toggleSSHButtons) - // Initialize button display + + // Toggle add/edit button based on SSH host selection + const sshHostSelect = document.querySelector('.sshmanagerHelper[data-helper="list"]') + if (sshHostSelect) { + // Remove existing listener to avoid duplicates + sshHostSelect.removeEventListener('change', toggleSSHButtons) + // Attach listener + sshHostSelect.addEventListener('change', toggleSSHButtons) + + // Initialize button display after select is populated + if (buildPromise && buildPromise.then) { + buildPromise.then(() => { toggleSSHButtons({ currentTarget: sshHostSelect }) - } - }) + }) + } else { + // Fallback if buildSelectHost didn't return a promise + toggleSSHButtons({ currentTarget: sshHostSelect }) + } } } From 607fe51a23db03e0cec3194ceac9384f6a2607e5 Mon Sep 17 00:00:00 2001 From: Olivier <16240457+TiTidom-RC@users.noreply.github.com> Date: Thu, 8 Jan 2026 20:35:36 +0100 Subject: [PATCH 3/7] Replace unseen/seen with style.display for SSH buttons Refactored toggleSSHButtons to use direct style.display assignments instead of unseen/seen methods for showing and hiding the add and edit buttons. --- desktop/js/Monitoring.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/desktop/js/Monitoring.js b/desktop/js/Monitoring.js index 354fb74c..e137312f 100644 --- a/desktop/js/Monitoring.js +++ b/desktop/js/Monitoring.js @@ -429,12 +429,12 @@ function toggleSSHButtons(event) { if (selectedValue && selectedValue !== '') { // Host selected → show edit, hide add - addBtn?.unseen() - editBtn?.seen() + if (addBtn) addBtn.style.display = 'none' + if (editBtn) editBtn.style.display = 'block' } else { // No host selected → show add, hide edit - addBtn?.seen() - editBtn?.unseen() + if (addBtn) addBtn.style.display = 'block' + if (editBtn) editBtn.style.display = 'none' } } From a0f1035354d82200605447fda761706100fa16ec Mon Sep 17 00:00:00 2001 From: Olivier <16240457+TiTidom-RC@users.noreply.github.com> Date: Thu, 8 Jan 2026 20:38:11 +0100 Subject: [PATCH 4/7] Improve robustness of toggleSSHButtons event handling Updated the toggleSSHButtons function to more reliably extract the selected value from the event object, improving compatibility with different event sources. --- desktop/js/Monitoring.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/desktop/js/Monitoring.js b/desktop/js/Monitoring.js index e137312f..fa605892 100644 --- a/desktop/js/Monitoring.js +++ b/desktop/js/Monitoring.js @@ -423,7 +423,7 @@ function printEqLogic(_eqLogic) { * Toggle between add and edit SSH buttons based on selection */ function toggleSSHButtons(event) { - const selectedValue = event.currentTarget.value + const selectedValue = event.target?.value ?? event.currentTarget?.value ?? event.value const addBtn = document.querySelector('.sshmanagerHelper[data-helper="add"]') const editBtn = document.querySelector('.sshmanagerHelper[data-helper="edit"]') From 94bf678b1ea487b70417abf1afc5989efa970e80 Mon Sep 17 00:00:00 2001 From: Olivier <16240457+TiTidom-RC@users.noreply.github.com> Date: Thu, 8 Jan 2026 20:55:22 +0100 Subject: [PATCH 5/7] Improve SSH button toggle logic in Monitoring.js Refactored the toggleSSHButtons function to accept either an event or a direct SSHHostId value, improving initialization and event handling. This ensures correct button display when the SSH host select is populated asynchronously or synchronously. --- desktop/js/Monitoring.js | 26 +++++++++++++++++++++----- 1 file changed, 21 insertions(+), 5 deletions(-) diff --git a/desktop/js/Monitoring.js b/desktop/js/Monitoring.js index fa605892..0e64252e 100644 --- a/desktop/js/Monitoring.js +++ b/desktop/js/Monitoring.js @@ -407,23 +407,39 @@ function printEqLogic(_eqLogic) { // Attach listener sshHostSelect.addEventListener('change', toggleSSHButtons) - // Initialize button display after select is populated + // Initialize button display - pass the value directly instead of waiting if (buildPromise && buildPromise.then) { buildPromise.then(() => { - toggleSSHButtons({ currentTarget: sshHostSelect }) + toggleSSHButtons(_eqLogic.configuration.SSHHostId) }) } else { // Fallback if buildSelectHost didn't return a promise - toggleSSHButtons({ currentTarget: sshHostSelect }) + toggleSSHButtons(_eqLogic.configuration.SSHHostId) } } } /** * Toggle between add and edit SSH buttons based on selection + * @param {Event|string|number} eventOrValue - Either a change event or a direct value (SSHHostId) */ -function toggleSSHButtons(event) { - const selectedValue = event.target?.value ?? event.currentTarget?.value ?? event.value +function toggleSSHButtons(eventOrValue) { + let selectedValue + + // Check if it's a direct value (string/number) or an event object + if (typeof eventOrValue === 'string' || typeof eventOrValue === 'number') { + selectedValue = eventOrValue + } else if (eventOrValue?.target || eventOrValue?.currentTarget) { + // It's an event, extract value from it + selectedValue = eventOrValue.target?.value ?? eventOrValue.currentTarget?.value ?? eventOrValue.value + } + + // If still no value, read directly from the select element as fallback + if (!selectedValue) { + const sshHostSelect = document.querySelector('.sshmanagerHelper[data-helper="list"]') + selectedValue = sshHostSelect?.value + } + const addBtn = document.querySelector('.sshmanagerHelper[data-helper="add"]') const editBtn = document.querySelector('.sshmanagerHelper[data-helper="edit"]') From 3c1bc7d9ff0c0525a2d83f5c2ba63c6cc2b7f017 Mon Sep 17 00:00:00 2001 From: Olivier <16240457+TiTidom-RC@users.noreply.github.com> Date: Thu, 8 Jan 2026 22:15:23 +0100 Subject: [PATCH 6/7] Use single quotes in tendance icon HTML output Replaces double quotes with single quotes in the HTML string for the tendance icon to ensure consistency and avoid potential conflicts in attribute quoting. --- core/class/Monitoring.class.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/core/class/Monitoring.class.php b/core/class/Monitoring.class.php index 9909f35e..9eadd93a 100644 --- a/core/class/Monitoring.class.php +++ b/core/class/Monitoring.class.php @@ -2627,7 +2627,7 @@ public function getCmdReplace(string $cmdName, array $cmdOptions, &$replace) { $replace[$cmdNamePrefix . '_averageHistory#'] = $isCmdObject ? $cmd->getConfiguration($cmdName . '_averageHistory') : '-'; $replace[$cmdNamePrefix . '_minHistory#'] = $isCmdObject ? $cmd->getConfiguration($cmdName . '_minHistory') : '-'; $replace[$cmdNamePrefix . '_maxHistory#'] = $isCmdObject ? $cmd->getConfiguration($cmdName . '_maxHistory') : '-'; - $replace[$cmdNamePrefix . '_tendance#'] = ($isCmdObject && $cmd->getConfiguration($cmdName . '_tendance', '') !== '') ? ' ' : ''; + $replace[$cmdNamePrefix . '_tendance#'] = ($isCmdObject && $cmd->getConfiguration($cmdName . '_tendance', '') !== '') ? ' getConfiguration($cmdName . '_tendance') . '\'>' : ''; } ]; From 822b538d73b2e2492af6644dab5320c3592d0e64 Mon Sep 17 00:00:00 2001 From: Olivier <16240457+TiTidom-RC@users.noreply.github.com> Date: Thu, 8 Jan 2026 22:29:44 +0100 Subject: [PATCH 7/7] Escape HTML attributes in tendance icon output Updated the tendance icon HTML generation to use escaped double quotes for attribute values, preventing conflicts with surrounding quotes and improving HTML safety. --- core/class/Monitoring.class.php | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/core/class/Monitoring.class.php b/core/class/Monitoring.class.php index 9eadd93a..3d3f2ef7 100644 --- a/core/class/Monitoring.class.php +++ b/core/class/Monitoring.class.php @@ -2627,7 +2627,11 @@ public function getCmdReplace(string $cmdName, array $cmdOptions, &$replace) { $replace[$cmdNamePrefix . '_averageHistory#'] = $isCmdObject ? $cmd->getConfiguration($cmdName . '_averageHistory') : '-'; $replace[$cmdNamePrefix . '_minHistory#'] = $isCmdObject ? $cmd->getConfiguration($cmdName . '_minHistory') : '-'; $replace[$cmdNamePrefix . '_maxHistory#'] = $isCmdObject ? $cmd->getConfiguration($cmdName . '_maxHistory') : '-'; - $replace[$cmdNamePrefix . '_tendance#'] = ($isCmdObject && $cmd->getConfiguration($cmdName . '_tendance', '') !== '') ? ' getConfiguration($cmdName . '_tendance') . '\'>' : ''; + // Utiliser htmlspecialchars pour échapper les attributs HTML afin d'éviter les conflits avec les guillemets + $tendanceIcon = ($isCmdObject && $cmd->getConfiguration($cmdName . '_tendance', '') !== '') + ? ' getConfiguration($cmdName . '_tendance') . '">' + : ''; + $replace[$cmdNamePrefix . '_tendance#'] = $tendanceIcon; } ];