Multiple load

hugo082 · May 28, 2017 · 5b37150 · 5b37150
1 parent b435a0b
commit 5b37150
Show file tree

Hide file tree

Showing 4 changed files with 75 additions and 30 deletions.
diff --git a/Controller/DataController.php b/Controller/DataController.php
@@ -43,27 +43,39 @@ public function multipleAction(Request $request)
         /** @var GraphManager $graphManager */
         $graphManager = $this->get('db.statistic.manager');
 
+        $statusCode = 200;
         $graphs = array();
         foreach ($request->query->all() as $key => $value) {
             if (substr( $key, 0, 2 ) !== "id")
                 continue;
-            $graph = $graphManager->getGraphWithID($value, array());
-            $graphs[$key] = $graph->encode();
+            try {
+                $graphs[$key] = array(
+                    "status" => array(
+                        'code' => 200,
+                        'graph_id' => $value
+                    ),
+                    "graph" => $graphManager->getGraphWithID($value, $request->query->all())->encode()
+                );
+            } catch (ApiException $e) {
+                $statusCode = 201;
+                $e->setGraphID($value);
+                $graphs[$key] = array(
+                    "status" => $e->encode(),
+                    "graph" => null
+                );
+            }
         }
 
 
         $dataResponse = array(
-            'response' => array(
-                'status' => 'Displayed',
-                'statusCode' => 200,
+            'status' => array(
+                'code' => $statusCode
             ),
             'graphs' => $graphs
         );
 
         $response->setData($dataResponse);
-        $response->setStatusCode(404);
         $response->setEncodingOptions($response->getEncodingOptions() | JSON_PRETTY_PRINT);
-        return new JsonResponse(array('message' => ''), 419);
         return $response;
     }
 }
diff --git a/DBStatisticBundle.php b/DBStatisticBundle.php
@@ -7,7 +7,6 @@
 /**
  * {@inheritDoc}
  * TODO : URL Load Data
- * TODO : Multi Graph in 1 link
  * TODO : Graph de type stat basique (ex: Nombre d'utilisateur : 234)
  * TODO : Multi echelle support (day/month/year...)
  */

diff --git a/Resources/public/js/statcore.js b/Resources/public/js/statcore.js
@@ -2,28 +2,41 @@
  * Created by hugofouquet on 26/03/2017.
  */
 
-function loadGraph(gID) {
+function loadGraph(response) {
+    var container = $("div[data-id='" + response.status.graph_id + "']");
+    if (response.status.code === 200) {
+        var elementID =  "elm_" + response.graph.informations.id;
+        $('<canvas>').attr({
+            id: elementID
+        }).appendTo(container);
+        insertActions(response.graph, container);
+        showGraph(response.graph, elementID);
+    } else {
+        container.append("<h3 class='graph-error graph-error-title'>Error Loading Graph</h3>");
+        container.append("<p class='graph-error graph-error-desc'>" + response.status.title + "</p>");
+        console.error(response.status.message);
+    }
+}
+
+function multipleRequestGraph(ids) {
     $.ajax({
-        url: "/statistic/data/" + gID,
-        data: null,
+        url: "/statistic/data/multiple",
+        data: ids,
         success: function( response ) {
-            var container = $("div[data-id='" + gID + "']");
-            if (response.status.code === 200) {
-                var elementID =  "elm_" + response.graph.informations.id;
-                $('<canvas>').attr({
-                    id: elementID
-                }).appendTo(container);
-                insertActions(response.graph, container);
-                showGraph(response.graph, elementID);
-            } else {
-                container.append("<h3 class='graph-error graph-error-title'>Error Loading Graph</h3>");
-                container.append("<p class='graph-error graph-error-desc'>" + response.status.title + "</p>");
-                console.error(response.status.message);
-            }
+            for (var graph in response.graphs)
+                loadGraph(response.graphs[graph]);
         }
     });
 }
 
+function requestGraph(gID) {
+    $.ajax({
+        url: "/statistic/data/" + gID,
+        data: null,
+        success: loadGraph
+    });
+}
+
 function showGraph(graph, elemId){
     window["graphs"][graph.informations.id] = new Chart(elemId, {
         type: graph.informations.type,
@@ -66,11 +79,22 @@ function insertActions(graph, parent) {
             .click(function () {
                 var data = $(this).data();
                 updateGraph(data.id, data.action);
-        });
+            });
     }
 }
 
 var graphs = $("div[data-type='graph']");
-graphs.each(function() {
-    loadGraph($(this).data("id"));
-});
+var multiple = {};
+graphs.each(function(index) {
+    var multipleData = $(this).data("multiple");
+    if (typeof multipleData !== "undefined") {
+        if (typeof multiple[multipleData] === "undefined")
+            multiple[multipleData] = {};
+        multiple[$(this).data("multiple")]["id" + index] = $(this).data("id");
+    } else
+        requestGraph($(this).data("id"));
+});
+
+for (var graphSet in multiple){
+    multipleRequestGraph(multiple[graphSet]);
+}
diff --git a/Resources/views/Default/index.html.twig b/Resources/views/Default/index.html.twig
@@ -1,18 +1,28 @@
 <style>
     div[data-type=graph] {
         max-width: 400px;
-        max-height: 200px;
+        max-height: 420px;
         display: inline-block;
-        background-color: #cdcdcd;
+        background-color: #fafafa;
+        vertical-align: middle;
     }
     div[data-type=graph] div.actions-container {
         text-align: center;
     }
+    div[data-type=graph] canvas {
+        max-width: 400px;
+        max-height: 400px;
+        display: block;
+    }
 
 </style>
 
 
+<div data-type="graph" data-id="g74" data-multiple="first"></div>
+<div data-type="graph" data-id="g75" data-multiple="first"></div>
 <div data-type="graph" data-id="g76"></div>
+<div data-type="graph" data-id="g77" data-multiple="second"></div>
+<div data-type="graph" data-id="g78" data-multiple="third"></div>