- Use a table output instead of a html list.

lib/logstash/web/public/js/logstash.js

@@ -104,8 +104,8 @@
       return false;
     });
 
-    $("ul.results li.event").live("click", function() {
-      var data = eval($(this).data("full"));
+    $("table.results tr.event").live("click", function() {
+      var data = eval($("td.message", this).data("full"));
 
       /* Apply template to the dialog */
       var query = $("#query").val().replace(/^\s+|\s+$/g, "")

lib/logstash/web/views/search/ajax.haml

@@ -22,11 +22,16 @@
       - if @next_href
         %a.pager{ :href => @next_href }
           next
-  %ul.results
+  %table.results
+    %tr
+      %th timestamp
+      %th event
     - @hits.reverse.each do |hit|
-      %li.event{ :"data-full" => hit.to_json }&= hit["_source"]["@message"]
-    - if @hits.length == 0 
-      - if !params[:q]
-        No query given. How about <a href="?q=*" class="querychanger">this?</a>
-      - else
-        No results for query '#{params[:q]}' 
+      %tr.event
+        %td.timestamp&= hit["_source"]["@timestamp"]
+        %td.message{ :"data-full" => hit.to_json }&= hit["_source"]["@message"]
+  - if @hits.length == 0 
+    - if !params[:q]
+      No query given. How about <a href="?q=*" class="querychanger">this?</a>
+    - else
+      No results for query '#{params[:q]}' 

lib/logstash/web/views/style.sass

@@ -20,18 +20,22 @@ body
   margin-left: 2em
   margin-right: 2em
   margin-top: 1em
-#content ul.results
+#content table.results
   font-family: monospace
-#content li.event
+#content td.event
   padding-bottom: 3px
   white-space: pre-wrap
-#content li.selected
+#content td.timestamp
+  white-space: nowrap
+  font-size: 85%
+  text-align: top
+#content tr.selected
   background-color: #FCE69D !important
-#content li.event:nth-child(2n)
+#content tr.event:nth-child(2n)
   background-color: #E3F6CE
-#content li.event:nth-child(2n+1)
+#content tr.event:nth-child(2n+1)
   background-color: #F5FBEF
-#content li.event:hover
+#content tr.event:hover
   background-color: lightgreen
 #error
   background-color: pink