From cd87afc8d73b87383fa151be5f297842e636e733 Mon Sep 17 00:00:00 2001
From: Joakim Hamren <joakim.hamren@gmail.com>
Date: Tue, 23 Sep 2014 23:09:47 +0200
Subject: [PATCH] Fixed search highlighting bug. Some minor UI changes as well.

---
 psdash/static/css/psdash.css |  2 +-
 psdash/static/js/psdash.js   | 10 +++++--
 psdash/templates/disks.html  |  2 +-
 psdash/templates/index.html  | 58 ++++++++++++++++++------------------
 4 files changed, 39 insertions(+), 33 deletions(-)

diff --git a/psdash/static/css/psdash.css b/psdash/static/css/psdash.css
index be7d1f9..2639172 100644
--- a/psdash/static/css/psdash.css
+++ b/psdash/static/css/psdash.css
@@ -174,7 +174,7 @@ a:hover {
 }
 
 #dashboard div.box.swap {
-    min-width: 300px;
+    min-width: 350px;
 }
 
 #dashboard div.box.memory {
diff --git a/psdash/static/js/psdash.js b/psdash/static/js/psdash.js
index 8a2e424..0933806 100644
--- a/psdash/static/js/psdash.js
+++ b/psdash/static/js/psdash.js
@@ -75,15 +75,21 @@ function init_log() {
             if(resp.position == -1) {
                 $status.text("EOF Reached.");
             } else {
+                // split up the content on found pos.
+                var content_before = resp.content.slice(0, resp.buffer_pos);
+                var content_after = resp.content.slice(resp.buffer_pos + params["text"].length);
+
+                // escape html in log content
                 resp.content = $('<div/>').text(resp.content).html();
+
+                // highlight matches
                 var matched_text = '<span class="matching-text">' + params['text'] + '</span>';
                 var found_text = '<span class="found-text">' + params["text"] + '</span>';
-                var content_before = resp.content.slice(0, resp.buffer_pos);
-                var content_after = resp.content.slice(resp.buffer_pos + params["text"].length);
                 content_before = replace_all(params["text"], matched_text, content_before);
                 content_after = replace_all(params["text"], matched_text, content_after);
                 resp.content = content_before + found_text + content_after;
                 $el.html(resp.content);
+
                 $status.text("Position " + resp.position + " of " + resp.filesize + ".");
             }
 
diff --git a/psdash/templates/disks.html b/psdash/templates/disks.html
index 824e8af..f6f1253 100644
--- a/psdash/templates/disks.html
+++ b/psdash/templates/disks.html
@@ -6,7 +6,7 @@
                 <span>Disks</span>
             </div>
             <div class="box-content">
-                <table id="processes" class="table">
+                <table id="processes" class="table table-condensed">
                     <thead>
                         <tr>
                             <th>Device</th>
diff --git a/psdash/templates/index.html b/psdash/templates/index.html
index 81f262e..a1334f5 100644
--- a/psdash/templates/index.html
+++ b/psdash/templates/index.html
@@ -63,35 +63,6 @@
                 </table>
             </div>
         </div>
-        <div class="box swap">
-            <div class="box-header">
-                <span>Swap</span>
-            </div>
-            <div class="box-content">
-                <table class="table">
-                    <tr>
-                        <td class="label-col">Total</td>
-                        <td class="total">{{ swap.total|filesizeformat }}</td>
-                    </tr>
-                    <tr>
-                        <td class="label-col">Used</td>
-                        <td class="used">{{ swap.used|filesizeformat }} ({{ swap.percent }} %)</td>
-                    </tr>
-                    <tr>
-                        <td class="label-col">Free</td>
-                        <td class="free">{{ swap.free|filesizeformat }}</td>
-                    </tr>
-                    <tr>
-                        <td class="label-col">Swapped in</td>
-                        <td class="swapped-in">{{ swap.swapped_in|filesizeformat }}</td>
-                    </tr>
-                    <tr>
-                        <td class="label-col">Swapped out</td>
-                        <td class="swapped-out">{{ swap.swapped_out|filesizeformat }}</td>
-                    </tr>
-                </table>
-            </div>
-        </div>
         <div class="box network">
             <div class="box-header">
                 <span>Network</span>
@@ -148,6 +119,35 @@
                 </table>
             </div>
         </div>
+        <div class="box swap">
+            <div class="box-header">
+                <span>Swap</span>
+            </div>
+            <div class="box-content">
+                <table class="table">
+                    <tr>
+                        <td class="label-col">Total</td>
+                        <td class="total">{{ swap.total|filesizeformat }}</td>
+                    </tr>
+                    <tr>
+                        <td class="label-col">Used</td>
+                        <td class="used">{{ swap.used|filesizeformat }} ({{ swap.percent }} %)</td>
+                    </tr>
+                    <tr>
+                        <td class="label-col">Free</td>
+                        <td class="free">{{ swap.free|filesizeformat }}</td>
+                    </tr>
+                    <tr>
+                        <td class="label-col">Swapped in</td>
+                        <td class="swapped-in">{{ swap.swapped_in|filesizeformat }}</td>
+                    </tr>
+                    <tr>
+                        <td class="label-col">Swapped out</td>
+                        <td class="swapped-out">{{ swap.swapped_out|filesizeformat }}</td>
+                    </tr>
+                </table>
+            </div>
+        </div>
         <div class="box users">
             <div class="box-header">
                 <span>Users</span>