From 3f4e2ae4b894c1fe3d31bab1c4533e95897e75d2 Mon Sep 17 00:00:00 2001
From: mokaddem <sami.mokaddem@circl.lu>
Date: Tue, 7 Sep 2021 09:59:36 +0200
Subject: [PATCH] chg: [home] Added link to index for each panels

---
 plugins/Tags/config/routes.php                |  2 +-
 templates/Instance/home.php                   | 16 +++-
 templates/element/charts/bar.php              | 79 +++++++++----------
 templates/element/widgets/highlight-panel.php |  3 +-
 webroot/css/main.css                          |  4 +
 5 files changed, 57 insertions(+), 47 deletions(-)

diff --git a/plugins/Tags/config/routes.php b/plugins/Tags/config/routes.php
index 3fab36a..93223e1 100644
--- a/plugins/Tags/config/routes.php
+++ b/plugins/Tags/config/routes.php
@@ -13,7 +13,7 @@ $routes->plugin(
             ['controller' => 'Tags']
         );
 
-        // $routes->get('/', ['controller' => 'Tags']);
+        $routes->get('/', ['controller' => 'Tags', 'action' => 'index']);
         // $routes->get('/{id}', ['controller' => 'Tags', 'action' => 'view']);
         // $routes->put('/{id}', ['controller' => 'Tags', 'action' => 'edit']);
     }
diff --git a/templates/Instance/home.php b/templates/Instance/home.php
index 20e3460..b9c41a4 100644
--- a/templates/Instance/home.php
+++ b/templates/Instance/home.php
@@ -1,17 +1,25 @@
 <?php
 // $Parsedown = new Parsedown();
 // echo $Parsedown->text($md);
-
 ?>
 
+<h2><?= __('Home') ?></h2>
 <div class="row">
     <?php foreach ($statistics as $modelName => $statistics): ?>
         <div class="col-sm-6 col-md-4 col-l-3 col-xl-2 mb-2">
             <?php
-                $modelName = explode('.', $modelName);
-                $modelName = $modelName[count($modelName)-1];
+                $exploded = explode('.', $modelName);
+                $modelForDisplay = $exploded[count($exploded)-1];
+                $panelTitle = $this->Html->link(
+                    h($modelForDisplay),
+                    $this->Url->build([
+                        'controller' => $modelForDisplay,
+                        'action' => 'index',
+                    ]),
+                    ['class' => 'text-white']
+                );
                 echo $this->element('widgets/highlight-panel', [
-                    'title' => $modelName,
+                    'titleHtml' => $panelTitle,
                     'number' => $statistics['amount'],
                     'variation' => $statistics['variation'] ?? '',
                     'chartData' => $statistics['timeline'] ?? []
diff --git a/templates/element/charts/bar.php b/templates/element/charts/bar.php
index b53a44d..ea3f56a 100644
--- a/templates/element/charts/bar.php
+++ b/templates/element/charts/bar.php
@@ -14,51 +14,48 @@ foreach ($chartData as $i => $entry) {
 
 <div id="<?= $chartId ?>"></div>
 
-
-<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
 <script>
-(function() {
-    const passedOptions = <?= json_encode($chartOptions) ?>;
-    const defaultOptions = {
-        chart: {
-            id: '<?= $chartId ?>',
-            type: 'bar',
-            sparkline: {
-                enabled: true
+    $(document).ready(function() {
+        const passedOptions = <?= json_encode($chartOptions) ?>;
+        const defaultOptions = {
+            chart: {
+                id: '<?= $chartId ?>',
+                type: 'bar',
+                sparkline: {
+                    enabled: true
+                },
+                dropShadow: {
+                    enabled: true,
+                    top: 1,
+                    left: 1,
+                    blur: 2,
+                    opacity: 0.2,
+                },
+                animations: {
+                    enabled: false
+                },
             },
-            dropShadow: {
-                enabled: true,
-                top: 1,
-                left: 1,
-                blur: 2,
-                opacity: 0.2,
-            },
-            animations: {
-                enabled: false
-            },
-        },
-        series: [{
-            data: <?= json_encode($data) ?>,
-        }],
-        colors: ['var(--success)'],
-        tooltip: {
-            x: {
-                show: false
-            },
-            y: {
-                title: {
-                    formatter: function formatter(val) {
-                    return '';
+            series: [{
+                data: <?= json_encode($data) ?>,
+            }],
+            colors: ['var(--success)'],
+            tooltip: {
+                x: {
+                    show: false
+                },
+                y: {
+                    title: {
+                        formatter: function formatter(val) {
+                        return '';
+                        }
                     }
-                }
+                },
+                theme: '<?= !empty($darkMode) ? 'dark' : 'light' ?>'
             },
-            theme: '<?= !empty($darkMode) ? 'dark' : 'light' ?>'
-        },
-    }
-    const chartOptions = Object.assign({}, defaultOptions, passedOptions)
-    new ApexCharts(document.querySelector('#<?= $chartId ?>'), chartOptions).render();
-
-})()
+        }
+        const chartOptions = Object.assign({}, defaultOptions, passedOptions)
+        new ApexCharts(document.querySelector('#<?= $chartId ?>'), chartOptions).render();
+    })
 </script>
 
 <style>
diff --git a/templates/element/widgets/highlight-panel.php b/templates/element/widgets/highlight-panel.php
index 6747620..5e5f68a 100644
--- a/templates/element/widgets/highlight-panel.php
+++ b/templates/element/widgets/highlight-panel.php
@@ -17,8 +17,9 @@ $variationHtml = sprintf('<div class="%s"><span class="%s mr-2"></span>%s</div>'
     !empty($variation) ? h($variation) : ''
 );
 
+$titleHtml = isset($title) ? h($title) : ($titleHtml ?? '');
 $leftContent = sprintf('<div class="">%s</div><h2 class="my-2">%s</h2>%s',
-    h($title ?? ''),
+    $titleHtml,
     h($number ?? ''),
     $variationHtml
 );
diff --git a/webroot/css/main.css b/webroot/css/main.css
index 9466306..d4a8fce 100644
--- a/webroot/css/main.css
+++ b/webroot/css/main.css
@@ -1,3 +1,7 @@
+:root {
+    --cerebrate: #924da6;
+}
+
 .pagination li.page-item > a.page-link > .ellipsis {
     line-height: 12px;
     vertical-align: top;