update channels index page

app/assets/javascripts/application.js

@@ -8,6 +8,7 @@
 //= require ./updateChart.js
 //= require ./timeago.min.js
 //= require ./jquery.shorten.min.js
+//= require ./tablesorter.js
 //= require ./nested_form.js
 //= require ./noapi.js
 //= require ./rest.js

app/assets/stylesheets/custom.css.erb

@@ -4,6 +4,11 @@ code                    { word-wrap: break-word; white-space: normal; }
 .breadcrumb             { margin-top: 10px; margin-bottom: 20px; } /* margins to make sure breadcrumb and h4.breadcrumb line up properly */
 .table td               { word-break: break-word; }
 
+/* table sorting */
+.tablesorter thead      { cursor: pointer; background-color: #f0f0f0; }
+.tablesorter thead i    { float: right; margin-top: 2px; visibility: hidden; }
+.tablesorter thead tr th:hover i { visibility: visible; }
+
 /* homepage */
 #home-motto             { font-size: 2em; padding-top: 100px; }
 #home-motto h1          { font-size: 2em; color: #fff; }

app/views/channels/index.html.erb

@@ -7,53 +7,48 @@
 
       <% if @channels.length > 0 %>
 
-        <table class="nicetable-borderless">
-
-          <% @channels.each do |channel| %>
-            <% if !channel.social %>
+        <table class="table table-striped table-bordered tablesorter">
+          <thead>
+            <tr>
+              <th><%= t(:channel_name) %> <i class="fa fa-unsorted"></i></th>
+              <th><%= t(:created) %> <i class="fa fa-unsorted"></i></td>
+            </tr>
+          </thead>
+          <tbody>
+            <% @channels.where(:social => false).each do |channel| %>
               <tr>
                 <td>
-        <h3 class="signed_in_channel_header" ><%= link_to channel.name, channel_path(channel.id), :id => "showsite_#{channel.id}" %></h3>
-        <div class="public_private_icon">
-          <%= channel.public_flag ? image_tag('icons/Unlocked.png', :title=> t(:public_true)) : image_tag('icons/Locked.png', :title=> t(:channel_not_public))  %>
-        </div>
 
+                  <a href="/channels/<%= channel.id %>">
+                    <i class="fa fa-<%= 'un' if channel.public_flag == true %>lock fa-fw"></i>
+                    <%= channel.name %>
+                  </a>
+                  <br>
+                  <%= link_to t(:private_link), channel_path(channel.id, :anchor => 'privateview') %>  |
+                  <%= link_to t(:public_link), channel_path(channel.id, :anchor => 'publicview') %> |
+                  <%= link_to t(:settings_link), channel_path(channel.id, :anchor => 'channelsettings') %>  |
+                  <%= link_to t(:api_key_link), channel_path(channel.id, :anchor => 'apikeys') %>  |
+                  <%= link_to t(:data_import_link), channel_path(channel.id, :anchor => 'dataimport') %>
 
-          </td>
+                </td>
+                <td><%= channel.created_at.strftime("%Y-%m-%d") %></td>
               </tr>
-    <tr><td><p><%= link_to t(:private_link), channel_path(channel.id, :anchor => 'privateview') %>  |
-          <%= link_to t(:public_link), channel_path(channel.id, :anchor => 'publicview') %> |
-          <%= link_to t(:settings_link), channel_path(channel.id, :anchor => 'channelsettings') %>  |
-          <%= link_to t(:api_key_link), channel_path(channel.id, :anchor => 'apikeys') %>  |
-          <%= link_to t(:data_import_link), channel_path(channel.id, :anchor => 'dataimport') %> </p></td></tr>
-    <tr><td><p><%= channel.description %></p></td></tr>
             <% end %>
-          <% end %>
-
+          </tbody>
         </table>
-
-        <br>
-
       <% end %>
 
-      <%= form_for :channel do |d| %>
-        <input name='userlogin' class='userlogin' />
-        <%= d.submit t(:channel_create), :class => 'btn btn-primary' %>
-      <% end %>
+      <%= button_to t(:channel_create), channels_path, :method => :post, :class => 'btn btn-primary' %>
 
       <% if current_admin_user.present? %>
-
         <br><br><br>
-
         <% @channels.each do |c| %>
           <% if c.social %>
             <%= t(:social_channel) %>: <%= link_to c.name, (Rails.env == 'production') ? "http://www.socialsensornetwork.com/#{c.slug}" : "/s/#{c.slug}" %>
             <br>
           <% end %>
         <% end %>
-
         <br>
-
         <%= link_to t(:social_channel_create), :controller => 'channels', :action => 'social_new' %>
       <% end %>
 
@@ -77,3 +72,9 @@
 
 </div>
 
+<script>
+  $(document).ready(function() {
+    $('.tablesorter').tablesorter();
+  });
+</script>
+