dashboard: unique list/graph view buttons

circle/dashboard/static/dashboard/dashboard.js

@@ -15,22 +15,24 @@ $(function () {
     });
     });
     return false;
     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();
     e.stopImmediatePropagation();
     return false;
     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();
     e.stopImmediatePropagation();
     return false;
     return false;
-  }).addClass('disabled');
+  });
   $('[title]').tooltip();
   $('[title]').tooltip();
   $(':input[title]').tooltip({trigger: 'focus', placement: 'auto right'});
   $(':input[title]').tooltip({trigger: 'focus', placement: 'auto right'});
   $(".knob").knob();
   $(".knob").knob();

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

@@ -3,8 +3,8 @@
   <div class="panel-heading">
   <div class="panel-heading">
     <div class="pull-right toolbar">
     <div class="pull-right toolbar">
       <div class="btn-group">
       <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>
       </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>
       <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>
     </div>