Experimenting with nested ddictionaries with date as key. This supports a date picker for filtering.

Author: geekshe

server_functions.py

@@ -135,24 +135,47 @@ def get_call_name(call_id):
 
 
 def create_call_row(env_filter):
+    """ Returns data in this format:
+    {date: [call_name: {call_id: 3}, call_name: {call_id: 3}, call_name: {call_id: 3}]}
+    """
 
     env_filter = env_filter
 
     env_total = get_env_total(env_filter)
 
     # Object containing individual agg_requests
-    env_calls = get_agg_request(env_filter)
+    all_dates = get_agg_request(env_filter)
+    group_by_date = {}
 
-    call_rows = []
+    calls = []
+    call = {}
+    call_values = {}
 
-    for obj in env_calls:
-        row = {}
-        row['call_id'] = obj.call_id
-        # TODO: If call_id has already been used, use the same call name, and add the success count
-        row['call_name'] = get_call_name(obj.call_id)
-        row['percent_volume'] = round(obj.success_count / env_total, 2)
-        row['call_latency'] = obj.avg_response_time
-        row['date'] = obj.date
-        call_rows.append(row)
+    for obj in all_dates:
+        group_by_date = {}
+        date_val = []
+        # group_by_date['date'] = date_val
+        call_name = {}
+        values = {}
 
-    return call_rows
+        # get_call_name(obj.call_id)
+
+        # values['call_id'] = obj.call_id
+        # # TODO: If call_id has already been used, use the same call name, and add the success count
+        # # values['call_name'] = get_call_name(obj.call_id)
+        # values['percent_volume'] = round(obj.success_count / env_total, 2)
+        # values['call_latency'] = obj.avg_response_time
+        # # values['date'] = obj.date
+
+        # group_by_date[get_call_name(obj.call_id)] = values
+        # date_val.append(group_by_date)
+
+
+        # if obj.date in by_date:
+
+        # by_date[obj.date] = row
+
+        # call_rows.append(by_date)
+
+
+    return group_by_date

templates/env.html

@@ -2,46 +2,59 @@
 {% block content %}
 
   <!-- jQuery -->
-  <script src="https://code.jquery.com/jquery.js"></script>
+  <link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
+  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
+
+  <script>
+  $( function() {
+    $( "#datepicker" ).datepicker();
+    $( "#anim" ).on( "change", function() {
+      $( "#datepicker" ).datepicker( "option", "showAnim", $( this ).val() );
+    });
+  } );
+  </script>
+
 
   <!-- Google Charts API -->
   <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
 
-<!-- /.col-lg-4 -->
-<div class="col-lg-4">
-    <div class="panel panel-default">
-        <div class="panel-heading">
-            Donut Chart Example
-        </div>
-        <!-- /.panel-heading -->
-        <div class="panel-body">
-            <div id="morris-donut-chart"></div>
-
-                <script type="text/javascript">
-                    $(function() {
-
-                      // Donut Chart
-                      Morris.Donut({
-                          element: 'morris-donut-chart',
-                          data: [
-                          {% for call in prod_calls %}
-                            {
-                              label: "{{ call['call_name'] }}",
-                              value: {{ call['percent_volume'] }}
-                            },
-                          {% endfor %}
-                          ],
-                          resize: true
+<div class="row">
+  <!-- /.col-lg-4 -->
+  <div class="col-lg-4">
+      <div class="panel panel-default">
+          <div class="panel-heading">
+              API Calls by Volume (morris)
+          </div>
+          <!-- /.panel-heading -->
+          <div class="panel-body">
+            <p>Date: <input type="text" id="datepicker" size="30"></p>
+              <div id="morris-donut-prod"></div>
+                  <script type="text/javascript">
+                      $(function() {
+
+                        // Donut Chart
+                        Morris.Donut({
+                            element: 'morris-donut-prod',
+                            data: [
+                            {% for call in prod_calls %}
+                              {
+                                label: "{{ call['call_name'] }}",
+                                value: {{ call['percent_volume'] }}
+                              },
+                            {% endfor %}
+                            ],
+                            resize: true
+                        });
                       });
-                    });
-                </script>
-        </div>
-        <!-- /.panel-body -->
-    </div>
-    <!-- /.panel -->
+                  </script>
+          </div>
+          <!-- /.panel-body -->
+      </div>
+      <!-- /.panel -->
+  </div>
 </div>
 
-
   <h1>API Calls by Volume</h1>
 
   <!-- Identify where the chart should be drawn. -->