Use components to render charts

7 files changed, 61 insertions, 53 deletions

diff --git a/app/Template/analytic/avg_time_columns.php b/app/Template/analytic/avg_time_columns.php
index 91c269fc..a1690c2a 100644
--- a/app/Template/analytic/avg_time_columns.php
+++ b/app/Template/analytic/avg_time_columns.php
@@ -5,25 +5,25 @@
 <?php if (empty($metrics)): ?>
     <p class="alert"><?= t('Not enough data to show the graph.') ?></p>
 <?php else: ?>
-    <section id="analytic-avg-time-column">
+    <?= $this->app->component('chart-avg-time-column', array(
+        'metrics' => $metrics,
+        'label' => t('Average time spent'),
+    )) ?>
 
-        <div id="chart" data-metrics='<?= json_encode($metrics, JSON_HEX_APOS) ?>' data-label="<?= t('Average time spent') ?>"></div>
+    <table class="table-striped">
+    <tr>
+        <th><?= t('Column') ?></th>
+        <th><?= t('Average time spent') ?></th>
+    </tr>
+    <?php foreach ($metrics as $column): ?>
+    <tr>
+        <td><?= $this->text->e($column['title']) ?></td>
+        <td><?= $this->dt->duration($column['average']) ?></td>
+    </tr>
+    <?php endforeach ?>
+    </table>
 
-        <table class="table-striped">
-        <tr>
-            <th><?= t('Column') ?></th>
-            <th><?= t('Average time spent') ?></th>
-        </tr>
-        <?php foreach ($metrics as $column): ?>
-        <tr>
-            <td><?= $this->text->e($column['title']) ?></td>
-            <td><?= $this->dt->duration($column['average']) ?></td>
-        </tr>
-        <?php endforeach ?>
-        </table>
-
-        <p class="alert alert-info">
-            <?= t('This chart show the average time spent into each column for the last %d tasks.', 1000) ?>
-        </p>
-    </section>
+    <p class="alert alert-info">
+        <?= t('This chart show the average time spent into each column for the last %d tasks.', 1000) ?>
+    </p>
 <?php endif ?>
diff --git a/app/Template/analytic/burndown.php b/app/Template/analytic/burndown.php
index dfd77604..1a3dd2cc 100644
--- a/app/Template/analytic/burndown.php
+++ b/app/Template/analytic/burndown.php
@@ -5,9 +5,11 @@
 <?php if (! $display_graph): ?>
     <p class="alert"><?= t('You need at least 2 days of data to show the chart.') ?></p>
 <?php else: ?>
-    <section id="analytic-burndown">
-        <div id="chart" data-metrics='<?= json_encode($metrics, JSON_HEX_APOS) ?>' data-date-format="<?= e('%%Y-%%m-%%d') ?>" data-label-total="<?= t('Total for all columns') ?>"></div>
-    </section>
+    <?= $this->app->component('chart-burndown', array(
+        'metrics' => $metrics,
+        'labelTotal' => t('Total for all columns'),
+        'dateFormat' => e('%%Y-%%m-%%d'),
+    )) ?>
 <?php endif ?>
 
 <hr/>
diff --git a/app/Template/analytic/cfd.php b/app/Template/analytic/cfd.php
index 89ded3ad..d562a64d 100644
--- a/app/Template/analytic/cfd.php
+++ b/app/Template/analytic/cfd.php
@@ -5,9 +5,10 @@
 <?php if (! $display_graph): ?>
     <p class="alert"><?= t('You need at least 2 days of data to show the chart.') ?></p>
 <?php else: ?>
-    <section id="analytic-cfd">
-        <div id="chart" data-metrics='<?= json_encode($metrics, JSON_HEX_APOS) ?>' data-date-format="<?= e('%%Y-%%m-%%d') ?>"></div>
-    </section>
+    <?= $this->app->component('chart-cumulative-flow', array(
+        'metrics' => $metrics,
+        'dateFormat' => e('%%Y-%%m-%%d'),
+    )) ?>
 <?php endif ?>
 
 <hr/>
diff --git a/app/Template/analytic/lead_cycle_time.php b/app/Template/analytic/lead_cycle_time.php
index ef595b79..eeb2c219 100644
--- a/app/Template/analytic/lead_cycle_time.php
+++ b/app/Template/analytic/lead_cycle_time.php
@@ -12,29 +12,30 @@
 <?php if (empty($metrics)): ?>
     <p class="alert"><?= t('Not enough data to show the graph.') ?></p>
 <?php else: ?>
-    <section id="analytic-lead-cycle-time">
+    <?= $this->app->component('chart-lead-cycle-time', array(
+        'metrics' => $metrics,
+        'labelCycle' => t('Cycle Time'),
+        'labelTime' => t('Lead Time'),
+    )) ?>
 
-        <div id="chart" data-metrics='<?= json_encode($metrics, JSON_HEX_APOS) ?>' data-label-cycle="<?= t('Cycle Time') ?>" data-label-lead="<?= t('Lead Time') ?>"></div>
+    <form method="post" class="form-inline" action="<?= $this->url->href('AnalyticController', 'leadAndCycleTime', array('project_id' => $project['id'])) ?>" autocomplete="off">
 
-        <form method="post" class="form-inline" action="<?= $this->url->href('AnalyticController', 'leadAndCycleTime', array('project_id' => $project['id'])) ?>" autocomplete="off">
+        <?= $this->form->csrf() ?>
 
-            <?= $this->form->csrf() ?>
+        <div class="form-inline-group">
+            <?= $this->form->date(t('Start date'), 'from', $values) ?>
+        </div>
 
-            <div class="form-inline-group">
-                <?= $this->form->date(t('Start date'), 'from', $values) ?>
-            </div>
+        <div class="form-inline-group">
+            <?= $this->form->date(t('End date'), 'to', $values) ?>
+        </div>
 
-            <div class="form-inline-group">
-                <?= $this->form->date(t('End date'), 'to', $values) ?>
-            </div>
+        <div class="form-inline-group">
+            <button type="submit" class="btn btn-blue"><?= t('Execute') ?></button>
+        </div>
+    </form>
 
-            <div class="form-inline-group">
-                <button type="submit" class="btn btn-blue"><?= t('Execute') ?></button>
-            </div>
-        </form>
-
-        <p class="alert alert-info">
-            <?= t('This chart show the average lead and cycle time for the last %d tasks over the time.', 1000) ?>
-        </p>
-    </section>
+    <p class="alert alert-info">
+        <?= t('This chart show the average lead and cycle time for the last %d tasks over the time.', 1000) ?>
+    </p>
 <?php endif ?>
diff --git a/app/Template/analytic/task_distribution.php b/app/Template/analytic/task_distribution.php
index 311e8c65..1231856e 100644
--- a/app/Template/analytic/task_distribution.php
+++ b/app/Template/analytic/task_distribution.php
@@ -5,7 +5,9 @@
 <?php if (empty($metrics)): ?>
     <p class="alert"><?= t('Not enough data to show the graph.') ?></p>
 <?php else: ?>
-    <chart-project-task-distribution :metrics='<?= json_encode($metrics, JSON_HEX_APOS) ?>'></chart-project-task-distribution>
+    <?= $this->app->component('chart-project-task-distribution', array(
+        'metrics' => $metrics,
+    )) ?>
 
     <table class="table-striped">
         <tr>
diff --git a/app/Template/analytic/time_comparison.php b/app/Template/analytic/time_comparison.php
index ee0ee4b6..31d0f53b 100644
--- a/app/Template/analytic/time_comparison.php
+++ b/app/Template/analytic/time_comparison.php
@@ -15,13 +15,13 @@
     <?php if ($paginator->isEmpty()): ?>
         <p class="alert"><?= t('No tasks found.') ?></p>
     <?php elseif (! $paginator->isEmpty()): ?>
-        <chart-project-time-comparison
-            :metrics='<?= json_encode($metrics, JSON_HEX_APOS)?>'
-            label-spent="<?= t('Hours Spent') ?>"
-            label-estimated="<?= t('Hours Estimated') ?>"
-            label-closed="<?= t('Closed') ?>"
-            label-open="<?= t('Open') ?>">
-        </chart-project-time-comparison>
+        <?= $this->app->component('chart-project-time-comparison', array(
+            'metrics' => $metrics,
+            'labelSpent' => t('Hours Spent'),
+            'labelEstimated' => t('Hours Estimated'),
+            'labelClosed' => t('Closed'),
+            'labelOpen' => t('Open'),
+        )) ?>
 
         <table class="table-fixed table-small table-scrolling">
             <tr>
diff --git a/app/Template/analytic/user_distribution.php b/app/Template/analytic/user_distribution.php
index c3cf4961..76ac945c 100644
--- a/app/Template/analytic/user_distribution.php
+++ b/app/Template/analytic/user_distribution.php
@@ -5,7 +5,9 @@
 <?php if (empty($metrics)): ?>
     <p class="alert"><?= t('Not enough data to show the graph.') ?></p>
 <?php else: ?>
-    <chart-project-user-distribution :metrics='<?= json_encode($metrics, JSON_HEX_APOS) ?>'></chart-project-user-distribution>
+    <?= $this->app->component('chart-project-user-distribution', array(
+        'metrics' => $metrics,
+    )) ?>
 
     <table class="table-striped">
         <tr>