[CORD-2719] Refactoring the service graph to use a proper state machine
Change-Id: I5d92aa876c9769701c93b2f5e7d47bdc311b6eb1
diff --git a/src/app/service-graph/components/graph/graph.component.html b/src/app/service-graph/components/graph/graph.component.html
index 6510a9f..ad3d0da 100644
--- a/src/app/service-graph/components/graph/graph.component.html
+++ b/src/app/service-graph/components/graph/graph.component.html
@@ -22,4 +22,26 @@
</div>
<a ng-click="vm.closeFullscreen()" class="close-btn"><i class="fa fa-times"></i></a>
<svg></svg>
+ <div class="row">
+ <div class="col-md-3">
+ <a ng-click="vm.toggleModel('services')" ng-class="{active: vm.currentState >= 0}" class="btn btn-block btn-accent">
+ <span>Services</span>
+ </a>
+ </div>
+ <div class="col-md-3">
+ <a ng-click="vm.toggleModel('serviceinstances')" ng-class="{active: vm.currentState >= 1}" class="btn btn-block btn-accent">
+ <span>Service Instances</span>
+ </a>
+ </div>
+ <div class="col-md-3">
+ <a ng-click="vm.toggleModel('instances')" ng-class="{active: vm.currentState >= 2}" class="btn btn-block btn-accent">
+ <span>Instances</span>
+ </a>
+ </div>
+ <div class="col-md-3">
+ <a ng-click="vm.toggleModel('networks')" ng-class="{active: vm.currentState >= 3}" class="btn btn-block btn-accent">
+ <span>Networks</span>
+ </a>
+ </div>
+ </div>
</div>