Add list of requests to bottom of page

app.rb

@@ -9,6 +9,7 @@
 class App < Sinatra::Base
   set :raise_errors, false
   set :show_exceptions, false
+  set :logging, true
 
   configure :development do
     require "sinatra/reloader"
@@ -178,14 +179,17 @@ def number_to_human_size(number, precision = 2)
 
             next unless key_value_pairs.all?{ |pair| pair.size == 2}
 
+
             data = Hash[ key_value_pairs ]
+            # logger.info "#{data['dyno']}: #{data['path']} #{data['service']}" unless data['path'].nil?
             parsed_line = {}
 
             if ps == "router"
               parsed_line = {
-                "requests" => 1,
-                "response_time" => data["service"].to_i,
-                "status" => "#{data["status"][0]}xx"
+                "requests"        => 1,
+                "response_time"   => data["service"].to_i,
+                "status"          => "#{data["status"][0]}xx",
+                "request"         => [data['dyno'], data['path'], data['service']]
               }
               parsed_line["error"] = data["code"] if data["code"]
             elsif ps == "web" && data.key?("sample#memory_total")

public/app.js

@@ -65,6 +65,10 @@ function updateValues() {
 // Measurements
 ///////////////////////////////////////////
 
+function table(items, elem) {
+  setTable(elem, items)
+}
+
 function sum(items, elem) {
   var value = items.length;
   setText(elem, value);
@@ -134,6 +138,21 @@ function showDefault(elem) {
   $(".data", elem).empty().text("No data")
 }
 
+function setTable(elem, value) {
+  $(".data", elem).empty()
+  var html = "<table class='request_table'>"
+  for (var i = 0, len = value.length; i < len; ++i) {
+      html += '<tr>';
+      for (var j = 0, rowLen = value[i].length; j < rowLen; ++j ) {
+          html += '<td>' + value[i][j] + '</td>';
+      }
+      html += "</tr>";
+  }
+  html += '</table>';
+
+  $(html).appendTo($(".data", elem));
+}
+
 function setText(elem, value) {
   $(".data", elem).text(value + $(elem).data("label"))
 }

views/app.slim

@@ -60,3 +60,10 @@ h1.page-title= params[:id]
   .activity
     h3.value.data
   p.dynos #{@web_processes} web #{pluralize(@web_processes, "process", "processes")} (#{@ps} #{pluralize(@ps, "dyno", "dynos")} x #{@concurrency} #{pluralize(@concurrency, "process", "processes")} per dyno)
+
+.metric*data(display:"table",type:"request",label:"")
+  h2
+    | Requests
+    == tooltip "A list of requests in the last minute"
+  .activity
+    h3.value.data

views/stylesheets/_config_light.scss

@@ -0,0 +1,5 @@
+$text_color: #131313;
+$link_color: #00afed;
+$background_color: #fff;
+
+$site_width: 980px;

views/stylesheets/_metrics.scss

@@ -59,3 +59,8 @@
     }
   }
 }
+
+table.request_table {
+  width: 90%;
+  font-size: 12px;
+}