dashboard: unique list/graph view buttons

circle/dashboard/static/dashboard/dashboard.js

@@ -15,22 +15,24 @@ $(function () {
     });
     return false;
   });
-  $('[href=#vm-graph-view]').click(function (e) {
-    $('#vm-list-view').hide();
-    $('#vm-graph-view').show();
-    $('[href=#vm-list-view]').removeClass('disabled');
-    $('[href=#vm-graph-view]').addClass('disabled');
+  $('[href=#index-graph-view]').click(function (e) {
+    var box = $(this).data('index-box');
+    $("#" + box + "-list-view").hide();
+    $("#" + box + "-graph-view").show();
+    $(this).next('a').removeClass('disabled');
+    $(this).addClass('disabled');
     e.stopImmediatePropagation();
     return false;
   });
-  $('[href=#vm-list-view]').click(function (e) {
-    $('#vm-graph-view').hide();
-    $('#vm-list-view').show();
-    $('[href=#vm-list-view]').addClass('disabled');
-    $('[href=#vm-graph-view]').removeClass('disabled');
+  $('[href=#index-list-view]').click(function (e) {
+    var box = $(this).data('index-box');
+    $('#' + box + '-graph-view').hide();
+    $('#' + box + '-list-view').show();
+    $(this).addClass('disabled');
+    $(this).prev("a").removeClass('disabled');
     e.stopImmediatePropagation();
     return false;
-  }).addClass('disabled');
+  });
   $('[title]').tooltip();
   $(':input[title]').tooltip({trigger: 'focus', placement: 'auto right'});
   $(".knob").knob();

circle/dashboard/templates/dashboard/index-vm.html

@@ -3,8 +3,8 @@
   <div class="panel-heading">
     <div class="pull-right toolbar">
       <div class="btn-group">
-        <a href="#vm-graph-view" class="btn btn-default btn-xs"><i class="icon-dashboard"></i></a>
-        <a href="#vm-list-view" class="btn btn-default btn-xs"><i class="icon-list"></i></a>
+        <a href="#index-graph-view" data-index-box="vm" class="btn btn-default btn-xs"><i class="icon-dashboard"></i></a>
+        <a href="#index-list-view" data-index-box="vm" class="btn btn-default btn-xs disabled"><i class="icon-list"></i></a>
       </div>
       <span class="btn btn-default btn-xs infobtn" title="Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.  "><i class="icon-info-sign"></i></span>
     </div>