Sean Condon | f4f54a1 | 2018-10-10 23:25:46 +0100 | [diff] [blame] | 1 | <!-- |
Sean Condon | 9148182 | 2019-01-01 13:56:14 +0000 | [diff] [blame] | 2 | ~ Copyright 2019-present Open Networking Foundation |
Sean Condon | f4f54a1 | 2018-10-10 23:25:46 +0100 | [diff] [blame] | 3 | ~ |
| 4 | ~ Licensed under the Apache License, Version 2.0 (the "License"); |
| 5 | ~ you may not use this file except in compliance with the License. |
| 6 | ~ You may obtain a copy of the License at |
| 7 | ~ |
| 8 | ~ http://www.apache.org/licenses/LICENSE-2.0 |
| 9 | ~ |
| 10 | ~ Unless required by applicable law or agreed to in writing, software |
| 11 | ~ distributed under the License is distributed on an "AS IS" BASIS, |
| 12 | ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| 13 | ~ See the License for the specific language governing permissions and |
| 14 | ~ limitations under the License. |
| 15 | --> |
Sean Condon | 9148182 | 2019-01-01 13:56:14 +0000 | [diff] [blame] | 16 | <!-- Template explaination - Add in the flash message component - and link it to |
| 17 | the local variable - this is used to display messages when keyboard shortcuts are pressed |
| 18 | --> |
Sean Condon | f4f54a1 | 2018-10-10 23:25:46 +0100 | [diff] [blame] | 19 | <onos-flash id="topoMsgFlash" message="{{ flashMsg }}" (closed)="flashMsg = ''"></onos-flash> |
| 20 | |
Sean Condon | 9148182 | 2019-01-01 13:56:14 +0000 | [diff] [blame] | 21 | <!-- Template explanation - Add in the Panel components for the Topology view |
| 22 | These are referenced inside the typescript by @ViewChild and their label |
| 23 | --> |
Sean Condon | aa4366d | 2018-11-02 14:29:01 +0000 | [diff] [blame] | 24 | <onos-instance #instance [divTopPx]="80" (mastershipEvent)="force.onosInstMastership = $event"></onos-instance> |
Sean Condon | f4f54a1 | 2018-10-10 23:25:46 +0100 | [diff] [blame] | 25 | <onos-summary #summary></onos-summary> |
Sean Condon | 9148182 | 2019-01-01 13:56:14 +0000 | [diff] [blame] | 26 | <onos-toolbar #toolbar (buttonEvent)="toolbarButtonClicked($event)"></onos-toolbar> |
Sean Condon | f4f54a1 | 2018-10-10 23:25:46 +0100 | [diff] [blame] | 27 | <onos-details #details></onos-details> |
| 28 | |
| 29 | <div id="ov-topo2"> |
Sean Condon | 9148182 | 2019-01-01 13:56:14 +0000 | [diff] [blame] | 30 | <!-- Template explanation - |
| 31 | Line 0) This is the root of the whole SVG canvas of the Topology View - all |
| 32 | components beneath it are SVG components only (no HTML) |
| 33 | line 1) the No Devices Connected banner is shown if the force component |
| 34 | (from line 4) does not contain any devices |
| 35 | line 2) Create an SVG Grouping and apply the onosZoomableOf directive to it, |
| 36 | passing in the whole SVG canvas (#svgZoom) |
| 37 | line 3) Add in the Background Svg Component (if showBackground is true - toggled |
| 38 | by toolbar and by keyboard shortcut 'B' |
| 39 | line 4) Add in the layer of the Force Svg Component. If any item is selected on it, pass |
| 40 | to the details view and deselect all others. This is node and line graph |
| 41 | whose contents are supplied through the Topology Service, and whose positions |
| 42 | are driven by the d3.force engine |
| 43 | --> |
Sean Condon | 0c577f6 | 2018-11-18 22:40:05 +0000 | [diff] [blame] | 44 | <svg:svg #svgZoom xmlns:svg="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000" id="topo2"> |
Sean Condon | 9148182 | 2019-01-01 13:56:14 +0000 | [diff] [blame] | 45 | <svg:desc>The main SVG canvas of the Topology View</svg:desc> |
| 46 | <svg:g *ngIf="force.regionData?.devices[0].length + |
| 47 | force.regionData?.devices[1].length + |
| 48 | force.regionData?.devices[2].length=== 0" |
| 49 | onos-nodeviceconnected /> |
Sean Condon | 0c577f6 | 2018-11-18 22:40:05 +0000 | [diff] [blame] | 50 | <svg:g id="topo-zoomlayer" onosZoomableOf [zoomableOf]="svgZoom"> |
Sean Condon | 9148182 | 2019-01-01 13:56:14 +0000 | [diff] [blame] | 51 | <svg:desc>A logical layer that allows the main SVG canvas to be zoomed and panned</svg:desc> |
Sean Condon | 50855cf | 2018-12-23 15:37:42 +0000 | [diff] [blame] | 52 | <svg:g *ngIf="showBackground" onos-backgroundsvg/> |
Sean Condon | 0c577f6 | 2018-11-18 22:40:05 +0000 | [diff] [blame] | 53 | <svg:g #force onos-forcesvg (selectedNodeEvent)="nodeSelected($event)"/> |
Sean Condon | 55c3053 | 2018-10-29 12:26:57 +0000 | [diff] [blame] | 54 | </svg:g> |
Sean Condon | 0c577f6 | 2018-11-18 22:40:05 +0000 | [diff] [blame] | 55 | </svg:svg> |
Sean Condon | f4f54a1 | 2018-10-10 23:25:46 +0100 | [diff] [blame] | 56 | </div> |
| 57 | |
| 58 | <div id="breadcrumbs"></div> |