1 <div class="yangVisualizer ">
2 <div class="topLine col-md-12">
4 <div class="col-md-2">{{ 'YANGVISUALIZER_MODEL' | translate }} :</div>
6 <select ng-model="currentTopologyNode" ng-change="updateTopologyData(null, true)" ng-options="node.label for node in filteredNodes | orderBy:'label'">
7 <option value="">-</option>
13 <div class="col-md-2">{{ 'YANGVISUALIZER_SET_LVL' | translate }} :</div>
14 <div class="col-md-4 slider">
15 <input ng-model="sliderValue" type="text" id="mySlider1" slider ng-change="updateTopologyData(null)" options="sliderSettings" />
22 <div class="sigma col-md-12">
24 <ul class="navWrapper">
25 <li>{{ 'YANGVISUALIZER_LABEL_VIEW' | translate }} : </li>
27 <li><span class="active" ng-click="setColorScheme($event,'default')">{{ 'YANGVISUALIZER_SHOW_DEFAULT' | translate }}</span></li>
28 <li><span ng-click="setColorScheme($event,'type')">{{ 'YANGVISUALIZER_SHOW_TYPES' | translate }}</span></li>
29 <li><span ng-click="setColorScheme($event,'module')">{{ 'YANGVISUALIZER_SHOW_MODULES' | translate }}</span></li>
30 <li><span ng-click="setColorScheme($event,'namespace')">{{ 'YANGVISUALIZER_SHOW_NAMESPACES' | translate }}</span></li>
32 <div class="clear"></div>
33 <div class="legend" ng-show="legend">
34 <ul ng-init="showText = true">
35 <li><span>{{ 'YANGVISUALIZER_LABEL_LEGEND' | translate }} : </span></li>
36 <li><span>{{ 'YANGVISUALIZER_SHOW_ALL' | translate }}</span><input class="showChckbx" type="checkbox" ng-model="showText"></li>
37 <li ng-repeat="(key, value) in legend">
38 <div class="itemWrapper left">
39 <div class="color left" style="background: {{value}};"></div>
40 <div class="left text" ng-hide="!showText">{{key}}</div>
41 <div class="clear"></div>
43 <div class="clear"></div>
48 <sigma-topology drag-nodes="true" topology-data="topologyData" trigger-resize-sigma="triggerResizeSigma" panel="panel" topology-custfunc="topologyCustfunc"></sigma-toppology>
52 <div class="rightPanel {{ panel.show ? 'panel-show' : 'panel-hide' }} col-md-6">
53 <div class="topButtons">
54 <div style="position: absolute; right: 40px;">
55 <!-- <button class="btn add-row btn-orange btn-slim ng-scope" ng-click="expandAllNodes()">
56 {{ expandedNodes ? 'YANGVISUALIZER_HIDE_NODES' : 'YANGVISUALIZER_SHOW_NODES' | translate }}
59 <div style="position: absolute; right: 10px;">
60 <button class="btn btn-show add-row btn-orange ng-scope btn-slim btn-show-custom" tooltip="show/hide panel" ng-click='triggerExpanded(panel, triggerResize)'>
61 <i class="icon-caret-right" ng-show="panel.show"></i>
62 <i class="icon-caret-left" ng-show="!panel.show"></i>
66 <label>{{ 'YANGVISUALIZER_LABEL_SEL_NODE' | translate }} :</label>
70 <th>{{ 'YANGVISUALIZER_TD_ID' | translate }}</th>
71 <th class="bigger">{{ 'YANGVISUALIZER_TD_NAME' | translate }}</th>
72 <th>{{ 'YANGVISUALIZER_TD_TYPE' | translate }}</th>
73 <th class="bigger">{{ 'YANGVISUALIZER_TD_MODULE' | translate }}</th>
78 <td>{{ selectedNode.id }}</td>
79 <td>{{ selectedNode.label.length > 30 ? selectedNode.label.substring(0,26) + '...' : selectedNode.label }}</td>
80 <td>{{ selectedNode.type }}</td>
81 <td>{{ selectedNode.module.length > 30 ? selectedNode.module.substring(0,26) + '...' : selectedNode.module }}</td>
86 <label>{{ 'YANGVISUALIZER_LABEL_PAR_NODE' | translate }} :</label>
90 <th>{{ 'YANGVISUALIZER_TD_ID' | translate }}</th>
91 <th class="bigger">{{ 'YANGVISUALIZER_TD_NAME' | translate }}</th>
92 <th>{{ 'YANGVISUALIZER_TD_TYPE' | translate }}</th>
93 <th class="bigger">{{ 'YANGVISUALIZER_TD_MODULE' | translate }}</th>
97 <tr ng-repeat="node in parentNodes.list track by $index">
98 <td><span class="link" ng-click="zoomToNode(node.graphId)">{{ node.id }}</span></td>
99 <td>{{ node.label.length > 30 ? node.label.substring(0,26) + '...' : node.label }}</td>
100 <td>{{ node.type }}</td>
101 <td>{{ node.module.length > 30 ? node.module.substring(0,26) + '...' : node.module }}</td>
106 <label>{{ 'YANGVISUALIZER_LABEL_CHILD_NODE' | translate }} :</label>
110 <th>{{ 'YANGVISUALIZER_TD_ID' | translate }}</th>
111 <th class="bigger">{{ 'YANGVISUALIZER_TD_NAME' | translate }}</th>
112 <th>{{ 'YANGVISUALIZER_TD_TYPE' | translate }}</th>
113 <th class="bigger">{{ 'YANGVISUALIZER_TD_MODULE' | translate }}</th>
117 <tr ng-repeat="node in childrenNodes.list track by $index">
118 <td><span class="link" ng-click="zoomToNode(node.graphId)">{{ node.id }}</span></td>
119 <td>{{ node.label.length > 30 ? node.label.substring(0,26) + '...' : node.label }}</td>
120 <td>{{ node.type }}</td>
121 <td>{{ node.module.length > 30 ? node.module.substring(0,26) + '...' : node.module }}</td>
127 <div class="clear"></div>