helpdesk: Fix css and html for IP queries

snf-cyclades-app/synnefo/helpdesk/static/css/extra.css

@@ -192,3 +192,12 @@ h3.info							{ cursor:default; color:#2956B2; text-align:center; font-size:16px
 .vm-action form { margin-bottom: 0px; }
 .vm-action.inactive form input { background-color: #2956B2; color: #ffffff;}
 .vm-action form input { background-color: #F81A23; color: #ffffff;}
+
+.table-sorted th:hover 				{ color:#2956B2; cursor:pointer; }
+.table-sorted th span				{ padding-right:20px; }
+.table-sorted th:hover span				{ background:url(../img/arrow-down.png) no-repeat right center; }
+.table-sorted th.headerSortDown span,
+.table-sorted th.headerSortDown:hover span		{ background:url(../img/arrow-up.png) no-repeat right center; }
+
+.table-sorted th.headerSortUp span,
+.table-sorted th.headerSortUp:hover span		{ background:url(../img/arrow-down.png) no-repeat right center; }

snf-cyclades-app/synnefo/helpdesk/static/js/common.js

@@ -2,7 +2,14 @@ $(document).ready(function(){ $("input").focus(); })
 
 $(document).ready(function(){
 
-	
+ // table sorting
+
+ $('.table-sorted').tablesorter({
+    sortList : [[2,0]],
+});
+
+
+
  // fix sub nav on scroll
   var $win = $(window)
     , $nav = $('.subnav')

snf-cyclades-app/synnefo/helpdesk/templates/helpdesk/base.html

@@ -19,7 +19,7 @@
             </div>
             <div class="span5">
                 <form class="form-horizontal account-form" method="get" action=".">
-                  <input type="text" class="input-medium search-query" name="account" autocomplete="off">
+                  <input type="text" class="input-medium search-query" name="account">
                   <button type="submit" class="btn">View account</button>
               </form>
           </div>
@@ -41,7 +41,7 @@
     </div>
     <script src="{{ MEDIA_URL }}helpdesk/js/jquery.js"></script>
     <script src="{{ MEDIA_URL }}helpdesk/js/bootstrap.js"></script>
-    <script src="{{ MEDIA_URL }}helpdesk/js/common.js"></script>
-   
+    <script src="{{ MEDIA_URL }}helpdesk/js/jquery.tablesorter.js"></script>
+    <script src="{{ MEDIA_URL }}helpdesk/js/common.js"></script> 
   </body>
 </html>

snf-cyclades-app/synnefo/helpdesk/templates/helpdesk/ip.html

 {% extends "helpdesk/base.html" %}
 
 {% block extraheader %}
-<small>/ {{ account_name }}</small>
+<small>/ {{ search_query }}</small>
 {% endblock %}
 
 {% block content %}
-
 {% if ip_exists %}
-<table border 1>
-  <tr>
-    IP Address {{ search_query }}
-  </tr>
+<h3>IP Address {{ search_query }}</h3>
+<table class="table table-striped table-sorted table-ip">
+<thead>
   <tr>
-          <td> Server  </td>
-          <td> Network  </td>
-          <td> Allocated  </td>
-          <td> Released  </td>
-          <td> Account  </td>
+          <th><span> Server</span></th>
+          <th><span> Network </span></th>
+          <th><span> Allocated </span></th>
+          <th><span> Released </span></th>
+          <th><span> Account  </span></th>
   </tr>
+</thead>
+<tbody>
 {% for ip in ips %}
   <tr>
           <td>
@@ -39,9 +39,10 @@
           <td><a href="{{ ip.account }}">{{ ip.account }}</a></td>
   </tr>
 {% endfor %}
+</tbody>
 </table>
 {% else %}
 
-<p> IP Address {{ search_query }} has never been allocated to any server. </p>
+<p> IP Address <em>{{ search_query }}</em> has never been allocated to any server. </p>
 {% endif %}
 {% endblock %}