Adding bar chart

har.py

@@ -22,7 +22,8 @@ def harmony_open_file(data):
 harmony = harmony_open_file(demo_path)
 print harmony.createDoughnut()
 # print harmony._creator
-# # print harmony._entries[1].request.url
+print harmony._entries[3].request.url
+print harmony._entries[3].response.body_size
 # # print harmony._entries[1].start, harmony._entries[1].timings, harmony._entries[1].time
 # print harmony._entries[2].request.url
 # # print harmony._entries[2].request.query

model.py

@@ -42,7 +42,7 @@ def __init__(self, res_dict):
         self.comment = res_dict.get('comment')
         self.cookies = res_dict.get('cookies')
         self.content = res_dict.get('content')
-        self.body_size = res_dict.get('bodySize')
+        self.body_size = res_dict.get('bodySize', 0)
         self.header_size = res_dict.get('headersSize')
 
 
@@ -74,11 +74,6 @@ def __init__(self, harfile):
         self._version = self._log.get('version', '')
         self._creator = self._log.get('creator', {})
 
-    # @staticmethod
-    # def generate_random_color(self):
-    #     r = lambda: random.randint(0, 255)
-    #     return '#%02X%02X%02X' % (r(), r(), r())
-
     def createDoughnut(self):
         """Create doughnut chart of content types"""
 
@@ -102,3 +97,25 @@ def createDoughnut(self):
                     existing_i = data["labels"].index(desired)
                     data["datasets"][0]["data"][existing_i] += 1
         return data
+
+    def createBar(self):
+        """Create bar chart of requests"""
+
+        data = {"labels": [],
+                "datasets": [{
+                    # "label": "Requests by size in uncompressed bytes",
+                    "data": [],
+                    "backgroundColor":[],
+                    "borderColor": [],
+                    "borderWidth": 1,
+                    }]
+                }
+        for entry in self._entries:
+            if entry.request.url and entry.response.body_size > 5000:
+                print "found entry.request.url"
+                print entry.response.body_size
+                data["labels"].append(entry.request.url[:11])
+                data["datasets"][0]["data"].append(entry.response.body_size)
+        print data
+        return data
+

server.py

@@ -31,6 +31,15 @@ def serve_donut_json():
     return jsonify(res)
 
 
+@app.route('/bar.json')
+def serve_bar_json():
+    """Serve data for donut chart"""
+
+    res = session.get('bar', {})
+
+    return jsonify(res)
+
+
 @app.route('/results')
 def show_charts():
     """Display charts of HAR data"""
@@ -60,6 +69,7 @@ def upload_file():
             session['har'] = harpath
             current = Harmony(harpath)
             session['donut'] = current.createDoughnut()
+            session['bar'] = current.createBar()
             return redirect("/results")
 
 if __name__ == "__main__":

templates/results.html

@@ -8,9 +8,15 @@ <h1>Results</h1>
 
 <p>Too many requests for images, especially large images like SVG and JPEGs, can slow down a webpage.</p>
 
+<canvas id="HarBar" class="harchart" width="500" height="500" style="display:block;width:500px;height:500px; margin:auto;"></canvas>
+
+<p>Consider trimming down large requests that could be slowing down your site.</p>
+
 <script>
 var HARDonutChart = document.getElementById("HarDoughnut");
 var donutData = $.get('/donut.json');
+var HARBarChart = document.getElementById("HarBar");
+var barData = $.get('/bar.json');
 
 $.get( '/donut.json', function( donutData ) {
   console.log(donutData);
@@ -29,6 +35,24 @@ <h1>Results</h1>
     }
 });
 
+});
+$.get( '/bar.json', function( barData ) {
+  console.log(barData);
+  var HarBar = new Chart(HARBarChart, {
+    type: 'bar',
+    data: barData,
+    options: {
+        animation:{
+            animateScale:true
+        },
+        title: {
+            display: true,
+            text: 'Requests By Size'
+        },
+        responsive: false,
+    }
+});
+
 });
 </script>