Steven Burrows | 57e24e9 | 2016-08-04 18:38:24 +0100 | [diff] [blame] | 1 | /* |
Brian O'Connor | a09fe5b | 2017-08-03 21:12:30 -0700 | [diff] [blame] | 2 | * Copyright 2016-present Open Networking Foundation |
Steven Burrows | 57e24e9 | 2016-08-04 18:38:24 +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 | */ |
| 16 | |
| 17 | /* |
| 18 | ONOS GUI -- Topology Links Module. |
| 19 | Module that holds the links for a region |
| 20 | */ |
| 21 | |
| 22 | (function () { |
| 23 | 'use strict'; |
| 24 | |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 25 | var $log, Collection, Model, ts, sus, t2zs, t2vs, t2lps, |
| 26 | fn, ps, t2mss, t2ts; |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 27 | |
| 28 | var linkLabelOffset = '0.35em'; |
Steven Burrows | 57e24e9 | 2016-08-04 18:38:24 +0100 | [diff] [blame] | 29 | |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 30 | var widthRatio = 1.4, |
| 31 | linkScale = d3.scale.linear() |
| 32 | .domain([1, 12]) |
| 33 | .range([widthRatio, 12 * widthRatio]) |
| 34 | .clamp(true), |
Steven Burrows | a3fca81 | 2016-10-14 15:11:04 -0500 | [diff] [blame] | 35 | labelDim = 30; |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 36 | |
| 37 | // configuration |
| 38 | var linkConfig = { |
| 39 | light: { |
| 40 | baseColor: '#939598', |
| 41 | inColor: '#66f', |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 42 | outColor: '#f00', |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 43 | }, |
| 44 | dark: { |
| 45 | // TODO : theme |
| 46 | baseColor: '#939598', |
| 47 | inColor: '#66f', |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 48 | outColor: '#f00', |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 49 | }, |
| 50 | inWidth: 12, |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 51 | outWidth: 10, |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 52 | }; |
| 53 | |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 54 | function createLink() { |
| 55 | |
| 56 | var linkPoints = this.linkEndPoints(this.get('epA'), this.get('epB')); |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 57 | |
| 58 | var attrs = angular.extend({}, linkPoints, { |
| 59 | key: this.get('id'), |
| 60 | class: 'link', |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 61 | position: { |
| 62 | x1: 0, |
| 63 | y1: 0, |
| 64 | x2: 0, |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 65 | y2: 0, |
| 66 | }, |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 67 | // functions to aggregate dual link state |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 68 | // extra: link.extra |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 69 | }); |
| 70 | |
| 71 | this.set(attrs); |
| 72 | } |
| 73 | |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 74 | function rectAroundText(el) { |
| 75 | var text = el.select('text'), |
| 76 | box = text.node().getBBox(); |
| 77 | |
| 78 | // translate the bbox so that it is centered on [x,y] |
| 79 | box.x = -box.width / 2; |
| 80 | box.y = -box.height / 2; |
| 81 | |
| 82 | // add padding |
| 83 | box.x -= 4; |
| 84 | box.width += 8; |
| 85 | return box; |
| 86 | } |
| 87 | |
Steven Burrows | dfa52b0 | 2016-09-02 13:50:43 +0100 | [diff] [blame] | 88 | function isLinkOnline(node) { |
| 89 | return (node.get('nodeType') === 'region') ? true : node.get('online'); |
| 90 | } |
| 91 | |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 92 | function linkEndPoints(srcId, dstId) { |
| 93 | |
Steven Burrows | af96a21 | 2016-12-28 12:57:02 +0000 | [diff] [blame] | 94 | var findNodeById = this.region.model.findNodeById.bind(this.region), |
| 95 | allNodes = this.region.model.nodes(), |
| 96 | sourceNode = findNodeById(this, srcId), |
| 97 | targetNode = findNodeById(this, dstId); |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 98 | |
Steven Burrows | 6deb4ce | 2016-08-26 16:06:23 +0100 | [diff] [blame] | 99 | if (!sourceNode || !targetNode) { |
Steven Burrows | 8f45ce2 | 2016-10-27 20:04:14 -0500 | [diff] [blame] | 100 | $log.error('Node(s) not on map for link:' + srcId + '~' + dstId); |
Steven Burrows | dfa52b0 | 2016-09-02 13:50:43 +0100 | [diff] [blame] | 101 | // logicError('Node(s) not on map for link:\n' + sMiss + dMiss); |
Steven Burrows | 6deb4ce | 2016-08-26 16:06:23 +0100 | [diff] [blame] | 102 | return null; |
| 103 | } |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 104 | |
Steven Burrows | a3fca81 | 2016-10-14 15:11:04 -0500 | [diff] [blame] | 105 | this.source = allNodes.indexOf(sourceNode); |
| 106 | this.target = allNodes.indexOf(targetNode); |
| 107 | this.sourceNode = sourceNode; |
| 108 | this.targetNode = targetNode; |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 109 | |
| 110 | return { |
| 111 | source: sourceNode, |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 112 | target: targetNode, |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 113 | }; |
| 114 | } |
| 115 | |
| 116 | function createLinkCollection(data, _region) { |
| 117 | |
| 118 | var LinkModel = Model.extend({ |
Steven Burrows | 68d6f95 | 2017-03-10 13:53:35 +0000 | [diff] [blame] | 119 | initialize: function () { |
| 120 | this.super = this.constructor.__super__; |
| 121 | this.super.initialize.apply(this, arguments); |
| 122 | this.createLink(); |
| 123 | }, |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 124 | region: _region, |
| 125 | createLink: createLink, |
| 126 | linkEndPoints: linkEndPoints, |
| 127 | type: function () { |
| 128 | return this.get('type'); |
| 129 | }, |
Steven Burrows | 86af435 | 2016-11-16 18:19:12 -0600 | [diff] [blame] | 130 | svgClassName: function () { |
| 131 | return fn.classNames('link', |
| 132 | this.nodeType, |
| 133 | this.get('type'), |
| 134 | { |
| 135 | enhanced: this.get('enhanced'), |
Steven Burrows | c515e60 | 2017-04-13 11:17:40 -0700 | [diff] [blame] | 136 | selected: this.get('selected'), |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 137 | suppressedmax: this.get('mastership'), |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 138 | }, |
| 139 | (this.linkLabel) ? this.linkLabel.linkLabelCSSClass() : null |
Steven Burrows | 86af435 | 2016-11-16 18:19:12 -0600 | [diff] [blame] | 140 | ); |
| 141 | }, |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 142 | expected: function () { |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 143 | // TODO: original code is: (s && s.expected) && (t && t.expected); |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 144 | return true; |
| 145 | }, |
| 146 | online: function () { |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 147 | |
Steven Burrows | dfa52b0 | 2016-09-02 13:50:43 +0100 | [diff] [blame] | 148 | var source = this.get('source'), |
| 149 | target = this.get('target'), |
| 150 | sourceOnline = isLinkOnline(source), |
| 151 | targetOnline = isLinkOnline(target); |
| 152 | |
| 153 | return (sourceOnline) && (targetOnline); |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 154 | }, |
Steven Burrows | 86af435 | 2016-11-16 18:19:12 -0600 | [diff] [blame] | 155 | onChange: function () { |
| 156 | // Update class names when the model changes |
| 157 | if (this.el) { |
| 158 | this.el.attr('class', this.svgClassName()); |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 159 | this.setScale(); |
Steven Burrows | 86af435 | 2016-11-16 18:19:12 -0600 | [diff] [blame] | 160 | } |
| 161 | }, |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 162 | enhance: function () { |
| 163 | var data = [], |
| 164 | point; |
| 165 | |
Steven Burrows | 42d7a6c | 2017-11-01 15:54:57 +0000 | [diff] [blame] | 166 | var hostsVisible = ps.getPrefs('topo2_prefs')['hosts']; |
| 167 | if (!hostsVisible && this.get('type') === 'UiEdgeLink') { |
| 168 | return; |
| 169 | } |
| 170 | |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 171 | if (showPort()) { |
Steven Burrows | af96a21 | 2016-12-28 12:57:02 +0000 | [diff] [blame] | 172 | this.set('enhanced', true); |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 173 | point = this.locatePortLabel(); |
Steven Burrows | dfa52b0 | 2016-09-02 13:50:43 +0100 | [diff] [blame] | 174 | angular.extend(point, { |
Simon Hunt | 95f4b42 | 2017-03-03 13:49:05 -0800 | [diff] [blame] | 175 | id: 'topo2-port-tgt', |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 176 | num: this.get('portB'), |
Steven Burrows | dfa52b0 | 2016-09-02 13:50:43 +0100 | [diff] [blame] | 177 | }); |
| 178 | data.push(point); |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 179 | |
| 180 | if (this.get('portA')) { |
| 181 | point = this.locatePortLabel(1); |
| 182 | angular.extend(point, { |
Simon Hunt | 95f4b42 | 2017-03-03 13:49:05 -0800 | [diff] [blame] | 183 | id: 'topo2-port-src', |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 184 | num: this.get('portA'), |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 185 | }); |
| 186 | data.push(point); |
| 187 | } |
| 188 | |
Steven Burrows | bd40284 | 2017-03-08 21:30:38 +0000 | [diff] [blame] | 189 | var entering = d3.select('.topo2-portLabels') |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 190 | .selectAll('.portLabel') |
Steven Burrows | a3fca81 | 2016-10-14 15:11:04 -0500 | [diff] [blame] | 191 | .data(data) |
| 192 | .enter().append('g') |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 193 | .classed('portLabel', true) |
Steven Burrows | af96a21 | 2016-12-28 12:57:02 +0000 | [diff] [blame] | 194 | .attr('id', function (d) { return d.id; }); |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 195 | |
| 196 | entering.each(function (d) { |
| 197 | var el = d3.select(this), |
| 198 | rect = el.append('rect'), |
| 199 | text = el.append('text').text(d.num); |
| 200 | |
| 201 | var rectSize = rectAroundText(el); |
| 202 | |
| 203 | rect.attr(rectSize) |
| 204 | .attr('rx', 2) |
| 205 | .attr('ry', 2); |
| 206 | |
| 207 | text.attr('dy', linkLabelOffset) |
| 208 | .attr('text-anchor', 'middle'); |
| 209 | |
| 210 | el.attr('transform', sus.translate(d.x, d.y)); |
Steven Burrows | a3fca81 | 2016-10-14 15:11:04 -0500 | [diff] [blame] | 211 | |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 212 | }); |
Steven Burrows | a3fca81 | 2016-10-14 15:11:04 -0500 | [diff] [blame] | 213 | |
| 214 | this.setScale(); |
Steven Burrows | dfa52b0 | 2016-09-02 13:50:43 +0100 | [diff] [blame] | 215 | } |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 216 | }, |
| 217 | unenhance: function () { |
Steven Burrows | 86af435 | 2016-11-16 18:19:12 -0600 | [diff] [blame] | 218 | this.set('enhanced', false); |
Steven Burrows | bd40284 | 2017-03-08 21:30:38 +0000 | [diff] [blame] | 219 | d3.select('.topo2-portLabels').selectAll('.portLabel').remove(); |
Steven Burrows | 0bc6665 | 2017-04-20 13:04:10 -0400 | [diff] [blame] | 220 | this.setScale(); |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 221 | }, |
Steven Burrows | 32ce1d9 | 2017-04-13 13:18:44 -0700 | [diff] [blame] | 222 | amt: function (numLinks, index) { |
Steven Burrows | 9ce0e40 | 2017-04-20 16:39:17 -0400 | [diff] [blame] | 223 | var bbox = this.get('source').el.node().getBBox(), |
| 224 | gap = bbox.width / 4; |
Steven Burrows | 32ce1d9 | 2017-04-13 13:18:44 -0700 | [diff] [blame] | 225 | return (index - ((numLinks - 1) / 2)) * gap; |
| 226 | }, |
| 227 | defaultPosition: function () { |
| 228 | return { |
| 229 | x1: this.get('source').x, |
| 230 | y1: this.get('source').y, |
| 231 | x2: this.get('target').x, |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 232 | y2: this.get('target').y, |
| 233 | }; |
Steven Burrows | 32ce1d9 | 2017-04-13 13:18:44 -0700 | [diff] [blame] | 234 | }, |
| 235 | calcMovement: function (amt, flipped) { |
| 236 | var pos = this.defaultPosition(), |
| 237 | mult = flipped ? -amt : amt, |
| 238 | dx = pos.x2 - pos.x1, |
| 239 | dy = pos.y2 - pos.y1, |
| 240 | length = Math.sqrt((dx * dx) + (dy * dy)); |
| 241 | |
| 242 | return { |
| 243 | x1: pos.x1 + (mult * dy / length), |
| 244 | y1: pos.y1 + (mult * -dx / length), |
| 245 | x2: pos.x2 + (mult * dy / length), |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 246 | y2: pos.y2 + (mult * -dx / length), |
Steven Burrows | 32ce1d9 | 2017-04-13 13:18:44 -0700 | [diff] [blame] | 247 | }; |
| 248 | }, |
Steven Burrows | a31c5b0 | 2017-04-12 10:45:08 -0700 | [diff] [blame] | 249 | setPosition: function () { |
Steven Burrows | 32ce1d9 | 2017-04-13 13:18:44 -0700 | [diff] [blame] | 250 | var multiline = this.get('multiline'); |
| 251 | if (multiline) { |
| 252 | var offsetAmt = this.amt(multiline.deviceLinks, multiline.index); |
| 253 | this.set('position', this.calcMovement(offsetAmt)); |
| 254 | } else { |
| 255 | this.set('position', this.defaultPosition()); |
| 256 | } |
Steven Burrows | a31c5b0 | 2017-04-12 10:45:08 -0700 | [diff] [blame] | 257 | |
| 258 | if (this.get('enhanced')) { |
| 259 | this.updatePortPosition(); |
| 260 | } |
Steven Burrows | 9ce0e40 | 2017-04-20 16:39:17 -0400 | [diff] [blame] | 261 | |
| 262 | if (this.el) { |
| 263 | this.el.attr(this.get('position')); |
| 264 | } |
| 265 | |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 266 | if (this.linkLabel) { |
| 267 | this.linkLabel.setPosition(); |
| 268 | } |
Steven Burrows | a31c5b0 | 2017-04-12 10:45:08 -0700 | [diff] [blame] | 269 | }, |
| 270 | updatePortPosition: function () { |
| 271 | var sourcePos = this.locatePortLabel(1), |
| 272 | targetPos = this.locatePortLabel(); |
| 273 | d3.select('#topo2-port-src') |
| 274 | .attr('transform', sus.translate(sourcePos.x, sourcePos.y)); |
| 275 | d3.select('#topo2-port-tgt') |
| 276 | .attr('transform', sus.translate(targetPos.x, targetPos.y)); |
| 277 | }, |
Steven Burrows | 1aa4f58 | 2016-12-13 15:05:41 -0500 | [diff] [blame] | 278 | getSelected: function () { |
| 279 | return this.collection.filter(function (m) { |
| 280 | return m.get('selected'); |
| 281 | }); |
| 282 | }, |
Steven Burrows | 86af435 | 2016-11-16 18:19:12 -0600 | [diff] [blame] | 283 | select: function () { |
Steven Burrows | 5fa057e | 2017-03-15 17:07:56 +0000 | [diff] [blame] | 284 | this.set({ 'selected': true }); |
Steven Burrows | 1aa4f58 | 2016-12-13 15:05:41 -0500 | [diff] [blame] | 285 | return this.getSelected(); |
| 286 | }, |
| 287 | deselect: function () { |
Steven Burrows | 5fa057e | 2017-03-15 17:07:56 +0000 | [diff] [blame] | 288 | this.set({ |
| 289 | 'selected': false, |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 290 | 'enhanced': false, |
Steven Burrows | 5fa057e | 2017-03-15 17:07:56 +0000 | [diff] [blame] | 291 | }); |
Steven Burrows | 86af435 | 2016-11-16 18:19:12 -0600 | [diff] [blame] | 292 | }, |
| 293 | showDetails: function () { |
Steven Burrows | 1aa4f58 | 2016-12-13 15:05:41 -0500 | [diff] [blame] | 294 | var selected = this.getSelected(); |
Steven Burrows | 86af435 | 2016-11-16 18:19:12 -0600 | [diff] [blame] | 295 | |
| 296 | if (selected) { |
| 297 | t2lps.displayLink(this); |
| 298 | } else { |
| 299 | t2lps.hide(); |
| 300 | } |
| 301 | }, |
Steven Burrows | dfa52b0 | 2016-09-02 13:50:43 +0100 | [diff] [blame] | 302 | locatePortLabel: function (src) { |
Steven Burrows | a3fca81 | 2016-10-14 15:11:04 -0500 | [diff] [blame] | 303 | var offset = 32 / (labelDim * t2zs.scale()), |
| 304 | sourceX = this.get('position').x1, |
| 305 | sourceY = this.get('position').y1, |
| 306 | targetX = this.get('position').x2, |
| 307 | targetY = this.get('position').y2, |
| 308 | nearX = src ? sourceX : targetX, |
| 309 | nearY = src ? sourceY : targetY, |
| 310 | farX = src ? targetX : sourceX, |
| 311 | farY = src ? targetY : sourceY; |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 312 | |
Steven Burrows | dfa52b0 | 2016-09-02 13:50:43 +0100 | [diff] [blame] | 313 | function dist(x, y) { |
| 314 | return Math.sqrt(x * x + y * y); |
| 315 | } |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 316 | |
| 317 | var dx = farX - nearX, |
| 318 | dy = farY - nearY, |
Steven Burrows | 0bc6665 | 2017-04-20 13:04:10 -0400 | [diff] [blame] | 319 | k = (32 * offset) / dist(dx, dy); |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 320 | |
Steven Burrows | dfa52b0 | 2016-09-02 13:50:43 +0100 | [diff] [blame] | 321 | return { x: k * dx + nearX, y: k * dy + nearY }; |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 322 | }, |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 323 | onEnter: function (el) { |
Steven Burrows | 448468c | 2017-04-13 16:09:30 -0700 | [diff] [blame] | 324 | var link = d3.select(el), |
| 325 | th = ts.theme(), |
| 326 | delay = 1000; |
Steven Burrows | 9edc7e0 | 2016-08-29 11:52:07 +0100 | [diff] [blame] | 327 | |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 328 | this.el = link; |
Steven Burrows | 448468c | 2017-04-13 16:09:30 -0700 | [diff] [blame] | 329 | |
| 330 | link.transition() |
| 331 | .duration(delay) |
| 332 | .attr('stroke', linkConfig[th].baseColor); |
| 333 | |
Steven Burrows | aea509d | 2017-04-12 14:17:47 -0700 | [diff] [blame] | 334 | this.setVisibility(); |
Steven Burrows | 448468c | 2017-04-13 16:09:30 -0700 | [diff] [blame] | 335 | this.setScale(); |
Steven Burrows | 0616e80 | 2016-10-06 21:45:07 -0500 | [diff] [blame] | 336 | }, |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 337 | linkWidth: function () { |
| 338 | var width = widthRatio; |
| 339 | if (this.get('enhanced')) { width = 3.5; } |
| 340 | if (this.linkLabel) { |
| 341 | var scale = d3.scale.ordinal() |
| 342 | .rangeRoundPoints([4, 8]), |
| 343 | label = this.linkLabel.get('label').split(' '); |
| 344 | |
| 345 | switch (t2ts.selectedTrafficOverlay()) { |
| 346 | case 'flowStatsBytes': |
| 347 | scale.domain(['KB', 'MB', 'GB']); |
| 348 | width = scale(label[1]); |
| 349 | break; |
| 350 | case 'portStatsBitSec': |
Steven Burrows | 2b29ca4 | 2017-05-12 10:58:05 -0400 | [diff] [blame] | 351 | scale.domain(['Kbps', 'Mbps', 'Gbps']); |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 352 | width = scale(label[1]); |
| 353 | break; |
| 354 | case 'portStatsPktSec': |
| 355 | scale = d3.scale.linear() |
| 356 | .domain([1, 10, 100, 1000, 10000]) |
| 357 | .range(d3.range(3.5, 9)) |
| 358 | .clamp(true); |
| 359 | width = scale(parseInt(label[0])); |
| 360 | } |
| 361 | } |
| 362 | |
| 363 | return width; |
| 364 | }, |
Steven Burrows | 0616e80 | 2016-10-06 21:45:07 -0500 | [diff] [blame] | 365 | setScale: function () { |
Steven Burrows | e8a455a | 2017-03-16 16:58:59 +0000 | [diff] [blame] | 366 | |
| 367 | if (!this.el) return; |
| 368 | |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 369 | var linkWidthRatio = this.linkWidth(); |
Steven Burrows | 0bc6665 | 2017-04-20 13:04:10 -0400 | [diff] [blame] | 370 | |
| 371 | var width = linkScale(linkWidthRatio) / t2zs.scale(); |
Steven Burrows | 448468c | 2017-04-13 16:09:30 -0700 | [diff] [blame] | 372 | this.el.attr('stroke-width', width + 'px'); |
Steven Burrows | a3fca81 | 2016-10-14 15:11:04 -0500 | [diff] [blame] | 373 | |
| 374 | var labelScale = labelDim / (labelDim * t2zs.scale()); |
| 375 | |
Steven Burrows | 8909c5c | 2017-04-10 09:56:52 -0700 | [diff] [blame] | 376 | d3.select('.topo2-portLabels') |
Steven Burrows | a3fca81 | 2016-10-14 15:11:04 -0500 | [diff] [blame] | 377 | .selectAll('.portLabel') |
| 378 | .selectAll('*') |
| 379 | .style('transform', 'scale(' + labelScale + ')'); |
| 380 | |
Steven Burrows | 9ce0e40 | 2017-04-20 16:39:17 -0400 | [diff] [blame] | 381 | this.setPosition(); |
| 382 | |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 383 | if (this.linkLabel) { |
| 384 | this.linkLabel.setScale(); |
| 385 | } |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 386 | }, |
| 387 | update: function () { |
Steven Burrows | 86af435 | 2016-11-16 18:19:12 -0600 | [diff] [blame] | 388 | if (this.get('enhanced')) { |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 389 | this.enhance(); |
| 390 | } |
Steven Burrows | b15a394 | 2017-01-17 17:25:04 +0000 | [diff] [blame] | 391 | }, |
Steven Burrows | aea509d | 2017-04-12 14:17:47 -0700 | [diff] [blame] | 392 | setVisibility: function () { |
| 393 | |
| 394 | if (this.get('type') !== 'UiEdgeLink') { |
| 395 | return; |
| 396 | } |
| 397 | |
| 398 | var visible = ps.getPrefs('topo2_prefs')['hosts']; |
| 399 | this.el.style('visibility', visible ? 'visible' : 'hidden'); |
| 400 | }, |
Steven Burrows | c515e60 | 2017-04-13 11:17:40 -0700 | [diff] [blame] | 401 | displayMastership: function () { |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 402 | this.set({ mastership: t2mss.mastership() !== null }); |
Steven Burrows | c515e60 | 2017-04-13 11:17:40 -0700 | [diff] [blame] | 403 | }, |
Steven Burrows | b15a394 | 2017-01-17 17:25:04 +0000 | [diff] [blame] | 404 | remove: function () { |
| 405 | |
| 406 | var width = linkScale(widthRatio) / t2zs.scale(); |
| 407 | |
| 408 | this.el.transition() |
| 409 | .duration(300) |
| 410 | .attr('stroke', '#ff0000') |
| 411 | .style('stroke-width', width * 4) |
| 412 | .transition() |
| 413 | .delay(1000) |
| 414 | .style('opacity', 0); |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 415 | }, |
Steven Burrows | ec1f45c | 2016-08-08 16:14:41 +0100 | [diff] [blame] | 416 | }); |
Steven Burrows | 57e24e9 | 2016-08-04 18:38:24 +0100 | [diff] [blame] | 417 | |
| 418 | var LinkCollection = Collection.extend({ |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 419 | model: LinkModel, |
Steven Burrows | 57e24e9 | 2016-08-04 18:38:24 +0100 | [diff] [blame] | 420 | }); |
| 421 | |
| 422 | return new LinkCollection(data); |
| 423 | } |
| 424 | |
Steven Burrows | 1c5c861 | 2016-10-05 13:45:13 -0500 | [diff] [blame] | 425 | function showPort() { |
| 426 | return t2vs.getPortHighlighting(); |
| 427 | } |
| 428 | |
Steven Burrows | 57e24e9 | 2016-08-04 18:38:24 +0100 | [diff] [blame] | 429 | angular.module('ovTopo2') |
Steven Burrows | af96a21 | 2016-12-28 12:57:02 +0000 | [diff] [blame] | 430 | .factory('Topo2LinkService', [ |
| 431 | '$log', 'Topo2Collection', 'Topo2Model', |
Steven Burrows | 0616e80 | 2016-10-06 21:45:07 -0500 | [diff] [blame] | 432 | 'ThemeService', 'SvgUtilService', 'Topo2ZoomService', |
Steven Burrows | aea509d | 2017-04-12 14:17:47 -0700 | [diff] [blame] | 433 | 'Topo2ViewService', 'Topo2LinkPanelService', 'FnService', 'PrefsService', |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 434 | 'Topo2MastershipService', 'Topo2TrafficService', |
Steven Burrows | af96a21 | 2016-12-28 12:57:02 +0000 | [diff] [blame] | 435 | function (_$log_, _c_, _Model_, _ts_, _sus_, |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 436 | _t2zs_, _t2vs_, _t2lps_, _fn_, _ps_, _t2mss_, _t2ts_) { |
Steven Burrows | 57e24e9 | 2016-08-04 18:38:24 +0100 | [diff] [blame] | 437 | |
Steven Burrows | af96a21 | 2016-12-28 12:57:02 +0000 | [diff] [blame] | 438 | $log = _$log_; |
| 439 | ts = _ts_; |
| 440 | sus = _sus_; |
| 441 | t2zs = _t2zs_; |
| 442 | t2vs = _t2vs_; |
| 443 | Collection = _c_; |
| 444 | Model = _Model_; |
| 445 | t2lps = _t2lps_; |
| 446 | fn = _fn_; |
Steven Burrows | aea509d | 2017-04-12 14:17:47 -0700 | [diff] [blame] | 447 | ps = _ps_; |
Steven Burrows | c515e60 | 2017-04-13 11:17:40 -0700 | [diff] [blame] | 448 | t2mss = _t2mss_; |
Steven Burrows | ca1a39c | 2017-05-08 17:31:08 -0400 | [diff] [blame] | 449 | t2ts = _t2ts_; |
Steven Burrows | 57e24e9 | 2016-08-04 18:38:24 +0100 | [diff] [blame] | 450 | |
Steven Burrows | af96a21 | 2016-12-28 12:57:02 +0000 | [diff] [blame] | 451 | return { |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 452 | createLinkCollection: createLinkCollection, |
Steven Burrows | af96a21 | 2016-12-28 12:57:02 +0000 | [diff] [blame] | 453 | }; |
Steven Burrows | 1c2a968 | 2017-07-14 16:52:46 +0100 | [diff] [blame] | 454 | }, |
Steven Burrows | af96a21 | 2016-12-28 12:57:02 +0000 | [diff] [blame] | 455 | ]); |
Steven Burrows | 57e24e9 | 2016-08-04 18:38:24 +0100 | [diff] [blame] | 456 | })(); |