From 53a503c37ef3a525e7341ac6ca1391a069f5aa3e Mon Sep 17 00:00:00 2001 From: Sinisa Vrhovac Date: Wed, 23 Oct 2024 23:58:09 +0200 Subject: [PATCH] Adding an option to store coonfiguration in modx system settings and load then in refresh processor. Added 4 new settings to the SiteDash widget, which control rendering of the 4 blocks in the widget. * 'display_lighthouse' => 'yes', * 'display_config' => 'yes', * 'display_security' => 'yes', * 'display_checks' => 'yes', --- assets/components/dashbored/css/mgr.css | 20 +++--- .../components/dashbored/sitedash/sitedash.js | 67 +++++++++++-------- .../elements/widgets/abstract.class.php | 20 ++++-- .../elements/widgets/sitedash.class.php | 15 ++++- .../processors/mgr/sitedash/refresh.class.php | 19 ++++-- 5 files changed, 90 insertions(+), 51 deletions(-) diff --git a/assets/components/dashbored/css/mgr.css b/assets/components/dashbored/css/mgr.css index a15240f..45c4027 100644 --- a/assets/components/dashbored/css/mgr.css +++ b/assets/components/dashbored/css/mgr.css @@ -68,10 +68,10 @@ } .dashbored-bg { - position: absolute; - object-fit: cover; - width: 100%; - height: 100%; + position: absolute; + object-fit: cover; + width: 100%; + height: 100%; margin: -10px; overflow: hidden; border-radius: 0 0 3px 3px; @@ -145,7 +145,7 @@ display: flex; justify-content: end; gap: 6px; -} +} .dashbored-weather-widget .current { text-align: center; height: 100px; @@ -202,8 +202,8 @@ display: flex; flex-direction: column; justify-content: center; - position: relative; - z-index: 2; + position: relative; + z-index: 2; pointer-events: none; } .dashbored-quotes-mask { @@ -301,8 +301,8 @@ } .dashbored-sitedash-panel { display: flex; + justify-content: center; flex-direction: column; - justify-content: space-between; align-items: center; width: 100%; height: 100%; @@ -566,7 +566,7 @@ height: 100%; } .dashbored-settings-about-panel { - width: 100%; + width: 100%; height: 300px; display: flex; } @@ -629,4 +629,4 @@ .db-settings-about-content p { margin-bottom: 10px; line-height: 1.5; -} \ No newline at end of file +} diff --git a/assets/components/dashbored/sitedash/sitedash.js b/assets/components/dashbored/sitedash/sitedash.js index d1bd97e..50a2a59 100644 --- a/assets/components/dashbored/sitedash/sitedash.js +++ b/assets/components/dashbored/sitedash/sitedash.js @@ -7,23 +7,23 @@ function DashboredSiteDash(widgetId) { this.window = {}; this.widgetEl = document.querySelector('#dashboard-block-' + widgetId); this.containerEl = this.widgetEl.querySelector('#dashbored' + widgetId + '-sitedash'); - + this.panel = this.containerEl.querySelector('.dashbored-sitedash-panel'); this.topPanel = this.panel.querySelector('.dashbored-sitedash-top'); this.auditPanel = this.topPanel.querySelector('.dashbored-sitedash-audit'); - + this.middlePanel = this.panel.querySelector('.dashbored-sitedash-middle'); this.firstCol = this.middlePanel.querySelector('.first-col'); this.secondCol = this.middlePanel.querySelector('.second-col'); this.thirdCol = this.middlePanel.querySelector('.third-col'); - + this.updatedAt = this.widgetEl.querySelector('.dashbored-sitedash-updated-at'); - + this.footer = document.querySelector('.dashbored-sitedash-footer'); this.sitedashBtn = this.footer.querySelector('.open-sitedash-btn'); this.sitedashLink = 'https://sitedash.app'; this.messagePanel = this.widgetEl.querySelector('.dashbored-msg'); - + this.record = { id: this.containerEl.dataset.id }; @@ -68,7 +68,7 @@ DashboredSiteDash.prototype = { loadData: function(ignoreCache = false) { let that = this; - + Dashbored.hideMessage(this.messagePanel); this.enableSpinner(); @@ -110,28 +110,31 @@ DashboredSiteDash.prototype = { else { this.renderAPIData(data); } - + Dashbored.renderBackground(this, data); this.disableSpinner(); }, - + renderAPIData: function(data) { this.auditPanel.innerHTML = null; this.containerEl.querySelectorAll('.dashbored-error-msg').forEach((msg) => { msg.remove(); }); - this.containerEl.querySelector('.dashbored-sitedash-top .dashbored-sitedash-audit-updated-at').textContent + this.containerEl.querySelector('.dashbored-sitedash-top .dashbored-sitedash-audit-updated-at').textContent = Dashbored.renderTimestamp(data.lighthouse.updated_at); - for (const score in data.lighthouse.scores) { - this.renderLighthouseScore(score, data.lighthouse.scores[score]); + + if (this.record.display_lighthouse === 'yes') { + for (const score in data.lighthouse.scores) { + this.renderLighthouseScore(score, data.lighthouse.scores[score]); + } } - + this.renderColumns(data); this.updatedAt.textContent = _('dashbored.sitedash.updated_at', {at: Dashbored.renderTimestamp(data.updated_at)}); this.widgetEl.querySelector('.sitedash-site-url').textContent = data.site_url; this.sitedashLink = data.sitedash_link }, - + renderLighthouseScore: function(type, score) { const outerDiv = document.createElement('div'), metricDiv = document.createElement('div'), @@ -141,16 +144,16 @@ DashboredSiteDash.prototype = { ns = 'http://www.w3.org/2000/svg', svg = document.createElementNS(ns,'svg'), svgPath = document.createElementNS(ns,'path'); - + // Set classes, values and attributes outerDiv.classList.add('audit-' + type); metricDiv.classList.add('audit-metric'); scoreDiv.classList.add('audit-score'); - + nameDiv.classList.add('audit-metric-name'); nameDiv.textContent = _('dashbored.sitedash.' + type); span.textContent = score; - + svg.classList.add('audit-metric-circle'); svg.setAttribute('viewBox', '0 0 36 36'); svgPath.setAttribute('d', `M18 2.0845 @@ -160,7 +163,7 @@ DashboredSiteDash.prototype = { svgPath.setAttribute('stroke', '#ffe168'); svgPath.setAttribute('stroke-width', '3'); svgPath.setAttribute('stroke-dasharray', score + ', 100'); - + // Append svg.appendChild(svgPath); scoreDiv.appendChild(span); @@ -168,23 +171,29 @@ DashboredSiteDash.prototype = { metricDiv.appendChild(svg); outerDiv.appendChild(metricDiv); outerDiv.appendChild(nameDiv); - + this.auditPanel.appendChild(outerDiv); }, - + renderColumns: function(data) { - this.renderConfigColumn(data.config); - this.renderSecurityColumn(data.security); - this.renderChecksColumn(data.checks); + if (this.record.display_config === 'yes') { + this.renderConfigColumn(data.config); + } + if (this.record.display_security === 'yes') { + this.renderSecurityColumn(data.security); + } + if (this.record.display_checks === 'yes') { + this.renderChecksColumn(data.checks); + } }, - + renderColumnTitle: function(type) { let title = document.createElement('h3'); title.classList.add('section-title'); title.textContent = _('dashbored.sitedash.' + type); return title; }, - + renderConfigColumn: function(rows) { this.firstCol.innerHTML = ''; this.firstCol.appendChild(this.renderColumnTitle('config')); @@ -193,11 +202,11 @@ DashboredSiteDash.prototype = { tag = document.createElement('span'), dots = document.createElement('div'), value = document.createElement('span'); - + tag.classList.add('tag'); dots.classList.add('dots'); value.classList.add('sd-value'); - + switch (item) { case 'database_version': case 'modx_upgrade_available': @@ -220,12 +229,12 @@ DashboredSiteDash.prototype = { value.textContent = rows['database_version'] || ''; break; } - + row.appendChild(tag); row.appendChild(dots); row.appendChild(value); this.firstCol.appendChild(row); - + } }, @@ -312,7 +321,7 @@ DashboredSiteDash.prototype = { } }, - + disableSpinner: function() { this.widgetEl.querySelector('.dashbored-loading-mask').style.visibility = 'hidden'; }, diff --git a/core/components/dashbored/elements/widgets/abstract.class.php b/core/components/dashbored/elements/widgets/abstract.class.php index 0a305f4..f2cf13f 100644 --- a/core/components/dashbored/elements/widgets/abstract.class.php +++ b/core/components/dashbored/elements/widgets/abstract.class.php @@ -8,7 +8,7 @@ abstract class DashboredAbstractDashboardWidget extends modDashboardWidgetInterface { public static $initialized = false; - + /** * @var Dashbored */ @@ -17,7 +17,7 @@ abstract class DashboredAbstractDashboardWidget extends modDashboardWidgetInterf * @var mixed */ protected $assetsUrl; - + public function initialize(): void { $this->dashbored = new Dashbored($this->modx); @@ -48,7 +48,7 @@ public function initialize(): void HTML ); } - + public function getWidgetTitleBar($type): string { return << HTML; - } /** @@ -101,5 +100,16 @@ public static function getUserSetting(modX $modx, string $key, int $userId) return $userSetting->get('value'); } + + /** + * @param modX $modx + * @param string $key + * @param mixed $default + * @return array|bool|float|mixed + */ + public static function getSystemSetting(modX $modx, string $key, mixed $default): mixed + { + return $modx->getOption($key, null, $default, true); + } } -return 'DashboredAbstractDashboardWidget'; \ No newline at end of file +return 'DashboredAbstractDashboardWidget'; diff --git a/core/components/dashbored/elements/widgets/sitedash.class.php b/core/components/dashbored/elements/widgets/sitedash.class.php index 80e59be..a42665a 100644 --- a/core/components/dashbored/elements/widgets/sitedash.class.php +++ b/core/components/dashbored/elements/widgets/sitedash.class.php @@ -11,6 +11,16 @@ class DashboredSiteDashDashboardWidget extends DashboredAbstractDashboardWidget 'bg_image' => '', 'bg_video' => '', ]; + public const SYSTEM_SETTINGS = [ + 'display_lighthouse' => 'yes', + 'display_config' => 'no', + 'display_security' => 'no', + 'display_checks' => 'no', + ]; + public function showMiddle(): bool + { + return false; + } public function render(): string { @@ -22,7 +32,7 @@ public function render(): string $props = []; foreach (self::ACCEPTED_FIELDS as $field => $default) { $props[$field] = self::getUserSetting($this->modx, 'dashbored.sitedash.' . $field, - $this->modx->user->get('id')) ?? $default; + $this->modx->user->get('id')) ?? $default; } $this->controller->addHtml(<<
-
@@ -86,4 +95,4 @@ public function render(): string HTML; } } -return 'DashboredSiteDashDashboardWidget'; \ No newline at end of file +return 'DashboredSiteDashDashboardWidget'; diff --git a/core/components/dashbored/processors/mgr/sitedash/refresh.class.php b/core/components/dashbored/processors/mgr/sitedash/refresh.class.php index f3d5999..079eae5 100644 --- a/core/components/dashbored/processors/mgr/sitedash/refresh.class.php +++ b/core/components/dashbored/processors/mgr/sitedash/refresh.class.php @@ -3,13 +3,24 @@ require_once dirname(__DIR__) . '/dashbored/sitedash.class.php'; require_once dirname(__DIR__, 3) . '/elements/widgets/sitedash.class.php'; -class DashboredSiteDashRefreshProcessor extends DashboredSiteDashAbstractProcessor { +class DashboredSiteDashRefreshProcessor extends DashboredSiteDashAbstractProcessor +{ protected function loadSettingFields() { foreach (DashboredSiteDashDashboardWidget::ACCEPTED_FIELDS as $field => $default) { - $this->fields[$field] = DashboredSiteDashDashboardWidget::getUserSetting($this->modx, - 'dashbored.sitedash.' . $field, $this->modx->user->get('id')) ?? $default; + $this->fields[$field] = DashboredSiteDashDashboardWidget::getUserSetting( + $this->modx, + 'dashbored.sitedash.' . $field, + $this->modx->user->get('id') + ) ?? $default; + } + foreach (DashboredSiteDashDashboardWidget::SYSTEM_SETTINGS as $field => $default) { + $this->fields[$field] = DashboredSiteDashDashboardWidget::getSystemSetting( + $this->modx, + 'dashbored.sitedash.' . $field, + $default + ); } } @@ -28,4 +39,4 @@ protected function getData(): array return $data ?? []; } } -return 'DashboredSiteDashRefreshProcessor'; \ No newline at end of file +return 'DashboredSiteDashRefreshProcessor';