diff options
| author |   CNlucius <lukai1@huawei.com> | 2016-09-13 11:40:12 +0800 |
|---|---|---|
| committer | CNlucius <lukai1@huawei.com> | 2016-09-13 11:41:53 +0800 |
| commit | b731e2f1dd0972409b136aebc7b463dd72c9cfad (patch) | |
| tree | 5107d7d80c19ad8076c2c97c2b5ef8d1cf3ab903 /framework/src/onos/web/gui/src/main/webapp/app | |
| parent | ee93993458266114c29271a481ef9ce7ce621b2a (diff) | |
ONOSFW-171
O/S-SFC-ONOS scenario documentation
Change-Id: I51ae1cf736ea24ab6680f8edca1b2bf5dd598365
Signed-off-by: CNlucius <lukai1@huawei.com>
Diffstat (limited to 'framework/src/onos/web/gui/src/main/webapp/app')
106 files changed, 0 insertions, 16454 deletions
diff --git a/framework/src/onos/web/gui/src/main/webapp/app/README.txt b/framework/src/onos/web/gui/src/main/webapp/app/README.txt deleted file mode 100644 index d5f94d87..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/README.txt +++ /dev/null @@ -1,7 +0,0 @@ -# Main Application - -index.html is the main launch point for the application. - -fw/ contains framework related code - -view/ contains view related code
\ No newline at end of file diff --git a/framework/src/onos/web/gui/src/main/webapp/app/common.css b/framework/src/onos/web/gui/src/main/webapp/app/common.css deleted file mode 100644 index 3a181afc..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/common.css +++ /dev/null @@ -1,31 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- common -- CSS file - */ - -#view h2 { - margin: 0; - /* separated out so that other padding doesn't get clobbered */ - padding-top: 20px; - padding-bottom: 20px; -} - -.clickable { - cursor: pointer; -} - diff --git a/framework/src/onos/web/gui/src/main/webapp/app/directives.js b/framework/src/onos/web/gui/src/main/webapp/app/directives.js deleted file mode 100644 index 0b4f4957..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/directives.js +++ /dev/null @@ -1,72 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- General Purpose Angular directives defined here. - */ - -(function () { - 'use strict'; - - angular.module('onosApp') - - // Create a resize directive, that we can apply to elements - // so that they can respond to window resize events. - .directive('resize', ['$window', 'FnService', function ($window, fs) { - return { - scope: { - offsetHeight: '@', - offsetWidth: '@', - notifier: '&' - }, - link: function (scope, element) { - var elem = d3.select(element[0]); - scope.$watchCollection(function () { - return { - h: $window.innerHeight, - w: $window.innerWidth - }; - }, function () { - var offH = scope.offsetHeight || 0, - offW = scope.offsetWidth || 0, - wsz = fs.windowSize(offH, offW); - - elem.style({ - height: wsz.height + 'px', - width: wsz.width + 'px' - }); - - if (fs.isF(scope.notifier)) { - scope.notifier(); - } - }); - - angular.element($window).bind('resize', function () { - scope.$apply(); - }); - } - }; - }]) - - .directive('ngRepeatComplete', [function () { - return function (scope) { - if (scope.$last) { - scope.$emit('ngRepeatComplete'); - scope.$broadcast('ngRepeatComplete'); - } - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/README.txt b/framework/src/onos/web/gui/src/main/webapp/app/fw/README.txt deleted file mode 100644 index 626547b2..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/README.txt +++ /dev/null @@ -1,44 +0,0 @@ -# Framework related code - -- layer - - Flash Service (transient messages) - - Panel Service (floating panels) - - Quick Help Service (key bindings, mouse gestures) - - Veil Service (loss of server connection) - -- mast - - Masthead Service - -- nav - - Navigation Service (navigation menu) - -- remote - - REST Service - - URL functin Service - - Web Socket Service - - Web Socket Event Service - - Web Socket encapsulation - - - (Login Service) << planned - -- svg - - GeoData Service (TopoJSON map functions) - - Glyph Service - - Icon Service - - Map Service - - SVG Utilities Service - - Zoom Service - -- util - - General Functions - - Key Handler - - User Preference Service - - Randomization Service - - Theme Service - -- widget - - Button Service - - Table Service (table styling directives) - - Table Builder Service - - Toolbar Service - - Tooltip Service diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/flash.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/flash.css deleted file mode 100644 index 02064625..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/flash.css +++ /dev/null @@ -1,49 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Flash Service -- CSS file - */ - -#flash { - z-index: 1400; -} - -#flash svg { - position: absolute; - bottom: 0; - opacity: 0.8; -} - -.light #flash svg g.flashItem rect { - fill: #ccc; -} -.dark #flash svg g.flashItem rect { - fill: #555; -} - -#flash svg g.flashItem text { - stroke: none; - text-anchor: middle; - alignment-baseline: middle; - font-size: 16pt; -} -.light #flash svg g.flashItem text { - fill: #333; -} -.dark #flash svg g.flashItem text { - fill: #999; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/flash.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/flash.js deleted file mode 100644 index 0d95b774..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/flash.js +++ /dev/null @@ -1,165 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Layer -- Flash Service - - Provides a mechanism to flash short informational messages to the screen - to alert the user of something, e.g. "Hosts visible" or "Hosts hidden". - */ -(function () { - 'use strict'; - - // injected references - var $log, $timeout; - - // configuration - var defaultSettings = { - fade: 200, - showFor: 1200 - }, - w = '100%', - h = 200, - xpad = 20, - ypad = 10, - rx = 10, - vbox = '-200 -' + (h/2) + ' 400 ' + h; - - // internal state - var settings, - timer = null, - data = [], - enabled; - - // DOM elements - var flashDiv, svg; - - - function computeBox(el) { - var text = el.select('text'), - box = text.node().getBBox(); - - // center - box.x = -box.width / 2; - box.y = -box.height / 2; - - // add some padding - box.x -= xpad; - box.width += xpad * 2; - box.y -= ypad; - box.height += ypad * 2; - - return box; - } - - function updateFlash() { - if (!svg) { - svg = flashDiv.append('svg').attr({ - width: w, - height: h, - viewBox: vbox - }); - } - - var items = svg.selectAll('.flashItem') - .data(data); - - // this is when there is an existing item - items.each(function (msg) { - var el = d3.select(this), - box; - - el.select('text').text(msg); - box = computeBox(el); - el.select('rect').attr(box); - }); - - - // this is when there is no existing item - var entering = items.enter() - .append('g') - .attr({ - class: 'flashItem', - opacity: 0 - }) - .transition() - .duration(settings.fade) - .attr('opacity', 1); - - entering.each(function (msg) { - var el = d3.select(this), - box; - - el.append('rect').attr('rx', rx); - el.append('text').text(msg); - box = computeBox(el); - el.select('rect').attr(box); - }); - - items.exit() - .transition() - .duration(settings.fade) - .attr('opacity', 0) - .remove(); - - if (svg && data.length === 0) { - svg.transition() - .delay(settings.fade + 10) - .remove(); - svg = null; - } - } - - function flash(msg) { - if (!enabled) return; - - if (timer) { - $timeout.cancel(timer); - } - - timer = $timeout(function () { - data = []; - updateFlash(); - }, settings.showFor); - - data = [msg]; - updateFlash(); - } - - function enable(b) { - enabled = !!b; - } - - angular.module('onosLayer') - .factory('FlashService', ['$log', '$timeout', - function (_$log_, _$timeout_) { - $log = _$log_; - $timeout = _$timeout_; - - function initFlash(opts) { - settings = angular.extend({}, defaultSettings, opts); - flashDiv = d3.select('#flash'); - enabled = true; - } - - return { - initFlash: initFlash, - flash: flash, - enable: enable - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/layer.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/layer.js deleted file mode 100644 index a47f53e0..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/layer.js +++ /dev/null @@ -1,25 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Layers Module - */ -(function () { - 'use strict'; - - angular.module('onosLayer', ['onosUtil']); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/panel.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/panel.css deleted file mode 100644 index ded05cf1..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/panel.css +++ /dev/null @@ -1,54 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Panel Service -- CSS file - */ - -.floatpanel { - position: absolute; - z-index: 100; - display: block; - top: 64px; - width: 200px; - right: -220px; - opacity: 0; - - padding: 10px; - font-size: 10pt; - - -moz-border-radius: 6px; - border-radius: 6px; -} - -.floatpanel.dialog { - top: 180px; -} - -html[data-platform='iPad'] .floatpanel { - top: 80px; -} - -.light .floatpanel { - background-color: rgba(255,255,255,0.8); - color: black; - box-shadow: 0 2px 12px #777; -} -.dark .floatpanel { - background-color: rgba(50,50,50,0.8); - color: #ccc; - box-shadow: 0 2px 12px #000; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/panel.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/panel.js deleted file mode 100644 index 10f04813..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/panel.js +++ /dev/null @@ -1,216 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Layer -- Panel Service - */ -(function () { - 'use strict'; - - var $log, fs; - - var defaultSettings = { - edge: 'right', - width: 200, - margin: 20, - hideMargin: 20, - xtnTime: 750, - fade: true - }; - - var panels, - panelLayer; - - - function init() { - panelLayer = d3.select('#floatpanels'); - panelLayer.html(''); - panels = {}; - } - - // helpers for panel - function noop() {} - - function margin(p) { - return p.settings.margin; - } - function hideMargin(p) { - return p.settings.hideMargin; - } - function noPx(p, what) { - return Number(p.el.style(what).replace(/px$/, '')); - } - function widthVal(p) { - return noPx(p, 'width'); - } - function heightVal(p) { - return noPx(p, 'height'); - } - function pxShow(p) { - return margin(p) + 'px'; - } - function pxHide(p) { - return (-hideMargin(p) - widthVal(p) - (noPx(p, 'padding') * 2)) + 'px'; - } - - function makePanel(id, settings) { - var p = { - id: id, - settings: settings, - on: false, - el: null - }, - api = { - show: showPanel, - hide: hidePanel, - toggle: togglePanel, - empty: emptyPanel, - append: appendPanel, - width: panelWidth, - height: panelHeight, - isVisible: panelIsVisible, - classed: classed, - el: panelEl - }; - - p.el = panelLayer.append('div') - .attr('id', id) - .attr('class', 'floatpanel') - .style('opacity', 0); - - // has to be called after el is set - p.el.style(p.settings.edge, pxHide(p)); - panelWidth(p.settings.width); - if (p.settings.height) { - panelHeight(p.settings.height); - } - - panels[id] = p; - - function showPanel(cb) { - var endCb = fs.isF(cb) || noop; - p.on = true; - p.el.transition().duration(p.settings.xtnTime) - .each('end', endCb) - .style(p.settings.edge, pxShow(p)) - .style('opacity', 1); - } - - function hidePanel(cb) { - var endCb = fs.isF(cb) || noop, - endOpacity = p.settings.fade ? 0 : 1; - p.on = false; - p.el.transition().duration(p.settings.xtnTime) - .each('end', endCb) - .style(p.settings.edge, pxHide(p)) - .style('opacity', endOpacity); - } - - function togglePanel(cb) { - if (p.on) { - hidePanel(cb); - } else { - showPanel(cb); - } - return p.on; - } - - function emptyPanel() { - return p.el.html(''); - } - - function appendPanel(what) { - return p.el.append(what); - } - - function panelWidth(w) { - if (w === undefined) { - return widthVal(p); - } - p.el.style('width', w + 'px'); - } - - function panelHeight(h) { - if (h === undefined) { - return heightVal(p); - } - p.el.style('height', h + 'px'); - } - - function panelIsVisible() { - return p.on; - } - - function classed(cls, bool) { - return p.el.classed(cls, bool); - } - - function panelEl() { - return p.el; - } - - return api; - } - - function removePanel(id) { - panelLayer.select('#' + id).remove(); - delete panels[id]; - } - - angular.module('onosLayer') - .factory('PanelService', - ['$log', '$window', 'FnService', - - function (_$log_, _$window_, _fs_) { - $log = _$log_; - fs = _fs_; - - function createPanel(id, opts) { - var settings = angular.extend({}, defaultSettings, opts); - if (!id) { - $log.warn('createPanel: no ID given'); - return null; - } - if (panels[id]) { - $log.warn('Panel with ID "' + id + '" already exists'); - return null; - } - if (fs.debugOn('widget')) { - $log.debug('creating panel:', id, settings); - } - return makePanel(id, settings); - } - - function destroyPanel(id) { - if (panels[id]) { - if (fs.debugOn('widget')) { - $log.debug('destroying panel:', id); - } - removePanel(id); - } else { - if (fs.debugOn('widget')) { - $log.debug('no panel to destroy:', id); - } - } - } - - return { - init: init, - createPanel: createPanel, - destroyPanel: destroyPanel - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/quickhelp.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/quickhelp.css deleted file mode 100644 index bb806d8a..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/quickhelp.css +++ /dev/null @@ -1,64 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Quick Help Service -- CSS file - */ - -#quickhelp { - z-index: 1300; -} - -#quickhelp svg { - position: absolute; - top: 180px; - opacity: 1; -} - -#quickhelp svg g.help rect { - fill: black; - opacity: 0.7; -} - -#quickhelp svg text.title { - font-size: 10pt; - font-style: italic; - text-anchor: middle; - fill: #999; -} - -#quickhelp svg g.keyItem { - fill: white; -} - -#quickhelp svg g line.qhrowsep { - stroke: #888; - stroke-dasharray: 2 2; -} - -#quickhelp svg text { - font-size: 7pt; - alignment-baseline: middle; -} - -#quickhelp svg text.key { - fill: #add; -} - -#quickhelp svg text.desc { - fill: #ddd; -} - diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/quickhelp.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/quickhelp.js deleted file mode 100644 index a25cf68d..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/quickhelp.js +++ /dev/null @@ -1,387 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Layer -- Quick Help Service - - Provides a mechanism to display key bindings and mouse gesture notes. - */ -(function () { - 'use strict'; - - // injected references - var $log, fs, sus; - - // configuration - var defaultSettings = { - fade: 500 - }, - w = '100%', - h = '80%', - vbox = '-200 0 400 400', - pad = 10, - offy = 45, - sepYDelta = 20, - colXDelta = 16, - yTextSpc = 12, - offDesc = 8; - - // internal state - var settings, - data = [], - yCount; - - // DOM elements - var qhdiv, svg, pane, rect, items; - - // key-logical-name to key-display lookup.. - var keyDisp = { - equals: '=', - slash: '/', - backSlash: '\\', - backQuote: '`', - leftArrow: 'L-arrow', - upArrow: 'U-arrow', - rightArrow: 'R-arrow', - downArrow: 'D-arrow' - }; - - // list of needed bindings to use in aggregateData - var neededBindings = [ - 'globalKeys', 'globalFormat', 'viewKeys', 'viewGestures' - ]; - - // =========================================== - // === Function Definitions === - - function mkKeyDisp(id) { - var v = keyDisp[id] || id; - return fs.cap(v); - } - - function addSeparator(el, i) { - var y = sepYDelta/2 - 5; - el.append('line') - .attr({ 'class': 'qhrowsep', x1: 0, y1: y, x2: 0, y2: y }); - } - - function addContent(el, data, ri) { - var xCount = 0, - clsPfx = 'qh-r' + ri + '-c'; - - function addColumn(el, c, i) { - var cls = clsPfx + i, - oy = 0, - aggKey = el.append('g').attr('visibility', 'hidden'), - gcol = el.append('g').attr({ - 'class': cls, - transform: sus.translate(xCount, 0) - }); - - c.forEach(function (j) { - var k = j[0], - v = j[1]; - - if (k !== '-') { - aggKey.append('text').text(k); - - gcol.append('text').text(k) - .attr({ - 'class': 'key', - y: oy - }); - gcol.append('text').text(v) - .attr({ - 'class': 'desc', - y: oy - }); - } - - oy += yTextSpc; - }); - - // adjust position of descriptions, based on widest key - var kbox = aggKey.node().getBBox(), - ox = kbox.width + offDesc; - gcol.selectAll('.desc').attr('x', ox); - aggKey.remove(); - - // now update x-offset for next column - var bbox = gcol.node().getBBox(); - xCount += bbox.width + colXDelta; - } - - data.forEach(function (d, i) { - addColumn(el, d, i); - }); - - // finally, return the height of the row.. - return el.node().getBBox().height; - } - - function updateKeyItems() { - var rows = items.selectAll('.qhRow').data(data); - - yCount = offy; - - var entering = rows.enter() - .append('g') - .attr({ - 'class': 'qhrow' - }); - - entering.each(function (r, i) { - var el = d3.select(this), - sep = r.type === 'sep', - dy; - - el.attr('transform', sus.translate(0, yCount)); - - if (sep) { - addSeparator(el, i); - yCount += sepYDelta; - } else { - dy = addContent(el, r.data, i); - yCount += dy; - } - }); - - // size the backing rectangle - var ibox = items.node().getBBox(), - paneW = ibox.width + pad * 2, - paneH = ibox.height + offy; - - items.selectAll('.qhrowsep').attr('x2', ibox.width); - items.attr('transform', sus.translate(-paneW/2, -pad)); - rect.attr({ - width: paneW, - height: paneH, - transform: sus.translate(-paneW/2-pad, 0) - }); - - } - - function checkFmt(fmt) { - // should be a single array of keys, - // or array of arrays of keys (one per column). - // return null if there is a problem. - var a = fs.isA(fmt), - n = a && a.length, - ns = 0, - na = 0; - - if (n) { - // it is an array which has some content - a.forEach(function (d) { - fs.isA(d) && na++; - fs.isS(d) && ns++; - }); - if (na === n || ns === n) { - // all arrays or all strings... - return a; - } - } - return null; - } - - function buildBlock(map, fmt) { - var b = []; - fmt.forEach(function (k) { - var v = map.get(k), - a = fs.isA(v), - d = (a && a[1]); - - // '-' marks a separator; d is the description - if (k === '-' || d) { - b.push([mkKeyDisp(k), d]); - } - }); - return b; - } - - function emptyRow() { - return { type: 'row', data: [] }; - } - - function mkArrRow(fmt) { - var d = emptyRow(); - d.data.push(fmt); - return d; - } - - function mkColumnarRow(map, fmt) { - var d = emptyRow(); - fmt.forEach(function (a) { - d.data.push(buildBlock(map, a)); - }); - return d; - } - - function mkMapRow(map, fmt) { - var d = emptyRow(); - d.data.push(buildBlock(map, fmt)); - return d; - } - - function addRow(row) { - var d = row || { type: 'sep' }; - data.push(d); - } - - function aggregateData(bindings) { - var hf = '_helpFormat', - gmap = d3.map(bindings.globalKeys), - gfmt = bindings.globalFormat, - vmap = d3.map(bindings.viewKeys), - vgest = bindings.viewGestures, - vfmt, vkeys; - - // filter out help format entry - vfmt = checkFmt(vmap.get(hf)); - vmap.remove(hf); - - // if bad (or no) format, fallback to sorted keys - if (!vfmt) { - vkeys = vmap.keys(); - vfmt = vkeys.sort(); - } - - data = []; - - addRow(mkMapRow(gmap, gfmt)); - addRow(); - addRow(fs.isA(vfmt[0]) ? mkColumnarRow(vmap, vfmt) : mkMapRow(vmap, vfmt)); - addRow(); - addRow(mkArrRow(vgest)); - } - - - function popBind(bindings) { - pane = svg.append('g') - .attr({ - class: 'help', - opacity: 0 - }); - - rect = pane.append('rect') - .attr('rx', 8); - - pane.append('text') - .text('Quick Help') - .attr({ - class: 'title', - dy: '1.2em', - transform: sus.translate(-pad,0) - }); - - items = pane.append('g'); - aggregateData(bindings); - updateKeyItems(); - - _fade(1); - } - - function fadeBindings() { - _fade(0); - } - - function _fade(o) { - svg.selectAll('g.help') - .transition() - .duration(settings.fade) - .attr('opacity', o); - } - - function addSvg() { - svg = qhdiv.append('svg') - .attr({ - width: w, - height: h, - viewBox: vbox - }); - } - - function removeSvg() { - svg.transition() - .delay(settings.fade + 20) - .remove(); - } - - function goodBindings(bindings) { - var warnPrefix = 'Quickhelp Service: showQuickHelp(), '; - if (!bindings || !fs.isO(bindings) || fs.isEmptyObject(bindings)) { - $log.warn(warnPrefix + 'invalid bindings object'); - return false; - } - if (!(neededBindings.every(function (key) { return key in bindings; }))) { - $log.warn( - warnPrefix + - 'needed bindings for help panel not provided:', - neededBindings - ); - return false - } - return true; - } - - // =========================================== - // === Module Definition === - - angular.module('onosLayer') - .factory('QuickHelpService', - ['$log', 'FnService', 'SvgUtilService', - - function (_$log_, _fs_, _sus_) { - $log = _$log_; - fs = _fs_; - sus = _sus_; - - function initQuickHelp(opts) { - settings = angular.extend({}, defaultSettings, fs.isO(opts)); - qhdiv = d3.select('#quickhelp'); - } - - function showQuickHelp(bindings) { - svg = qhdiv.select('svg'); - if (!goodBindings(bindings)) { - return null; - } - if (svg.empty()) { - addSvg(); - popBind(bindings); - } else { - hideQuickHelp(); - } - } - - function hideQuickHelp() { - svg = qhdiv.select('svg'); - if (!svg.empty()) { - fadeBindings(); - removeSvg(); - return true; - } - return false; - } - - return { - initQuickHelp: initQuickHelp, - showQuickHelp: showQuickHelp, - hideQuickHelp: hideQuickHelp - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/veil.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/veil.css deleted file mode 100644 index afef94ac..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/veil.css +++ /dev/null @@ -1,50 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Veil Service -- CSS file - */ - -#veil { - z-index: 5000; - display: none; - position: absolute; - top: 0; - left: 0; -} - -.light #veil { - background-color: rgba(0,0,0,0.75); -} -.dark #veil { - background-color: rgba(64,64,64,0.75); -} - -#veil .msg { - position: absolute; - padding: 60px; -} - -#veil .msg p { - display: block; - font-size: 14pt; - font-style: italic; - color: #ddd; -} - -#veil svg .glyph { - fill: #222; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/veil.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/veil.js deleted file mode 100644 index fc0530af..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/layer/veil.js +++ /dev/null @@ -1,99 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Layer -- Veil Service - - Provides a mechanism to display an overlaying div with information. - Used mainly for web socket connection interruption. - */ -(function () { - 'use strict'; - - // injected references - var $log, $route, fs, ks, gs; - - var veil; - - function init() { - var wSize = fs.windowSize(), - ww = wSize.width, - wh = wSize.height, - shrink = wh * 0.3, - birdDim = wh - shrink, - birdCenter = (ww - birdDim) / 2, - svg; - - veil = d3.select('#veil'); - - svg = veil.select('svg').attr({ - width: ww, - height: wh - }).style('opacity', 0.2); - - gs.addGlyph(svg, 'bird', birdDim, false, [birdCenter, shrink/2]); - } - - // msg should be an array of strings - function show(msg) { - var msgs = fs.isA(msg) || [msg], - pdiv = veil.select('.msg'); - pdiv.selectAll('p').remove(); - - msgs.forEach(function (line) { - pdiv.append('p').text(line); - }); - - veil.style('display', 'block'); - ks.enableKeys(false); - } - - function hide() { - veil.style('display', 'none'); - ks.enableKeys(true); - } - - // function that only invokes the veil if the caller is the current view - // TODO: review - is this deprecated ? - function lostServer(ctrlName, msg) { - if ($route.current.$$route.controller === ctrlName) { - $log.debug('VEIL-service: ', ctrlName); - show(msg) - } else { - $log.debug('VEIL-service: IGNORING ', ctrlName); - } - } - - angular.module('onosLayer') - .factory('VeilService', - ['$log', '$route', 'FnService', 'KeyService', 'GlyphService', - - function (_$log_, _$route_, _fs_, _ks_, _gs_) { - $log = _$log_; - $route = _$route_; - fs = _fs_; - ks = _ks_; - gs = _gs_; - - return { - init: init, - show: show, - hide: hide, - lostServer: lostServer - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/mast/mast.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/mast/mast.css deleted file mode 100644 index 2e86e86d..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/mast/mast.css +++ /dev/null @@ -1,102 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Masthead -- CSS file - */ - -#mast { - height: 36px; - padding: 4px; - vertical-align: baseline; -} - -html[data-platform='iPad'] #mast { - padding-top: 16px; -} - -.light #mast { - background-color: #bbb; - box-shadow: 0 2px 8px #777; -} -.dark #mast { - background-color: #444; - box-shadow: 0 2px 8px #222; -} - -#mast .nav-menu-button { - width: 30px; - height: 30px; - margin-left: 8px; - margin-bottom: 4px; - cursor: pointer; -} -.light #mast .nav-menu-button:hover { - background-color: #ddd; -} -.dark #mast .nav-menu-button:hover { - background-color: #777; -} - -#mast img.logo { - height: 38px; - padding-left: 8px; - padding-right: 8px; -} - -#mast img.logo:hover { - /* need something better */ - /*background-color: #888;*/ -} - -#mast .title { - font-size: 14pt; - font-style: italic; - vertical-align: 12px; -} - -.light #mast .title { - color: #369; -} -.dark #mast .title { - color: #eee; -} - -#mast-right { - display: inline-block; - padding-top: 8px; - padding-right: 16px; - float: right; - /*border: 1px solid red;*/ -} - -#mast-right a { - font-size: 12pt; - font-style: normal; - font-weight: bold; - text-decoration: none; -} - -.light #mast-right a { - color: #369; -} -.dark #mast-right a { - color: #eee; -} - -#mast-right a:hover { - color: #CE5650; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/mast/mast.html b/framework/src/onos/web/gui/src/main/webapp/app/fw/mast/mast.html deleted file mode 100644 index 5bb488a8..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/mast/mast.html +++ /dev/null @@ -1,6 +0,0 @@ -<!-- Masthead partial HTML --> -<img class="nav-menu-button" src="data/img/nav-menu.png" - ng-click="mastCtrl.toggleNav()"></div> -<img class="logo" src="data/img/onos-logo.png"> -<span class="title">Open Network Operating System</span> -<div id="mast-right"><a href="rs/logout">logout</a></div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/mast/mast.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/mast/mast.js deleted file mode 100644 index 1cde58c7..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/mast/mast.js +++ /dev/null @@ -1,56 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Masthead Module - */ -(function () { - 'use strict'; - - // injected services - var $log; - - // configuration - var mastHeight = 36, - padMobile = 16; - - angular.module('onosMast', ['onosNav']) - .controller('MastCtrl', ['$log', 'NavService', function (_$log_, ns) { - var self = this; - - $log = _$log_; - - // initialize mast controller here... - self.radio = null; - - // delegate to NavService - self.toggleNav = function () { - ns.toggleNav(); - }; - - $log.log('MastCtrl has been created'); - }]) - - // also define a service to allow lookup of mast height. - .factory('MastService', ['FnService', function (fs) { - return { - mastHeight: function () { - return fs.isMobile() ? mastHeight + padMobile : mastHeight; - } - } - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/nav/nav.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/nav/nav.css deleted file mode 100644 index 4d2c4e91..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/nav/nav.css +++ /dev/null @@ -1,90 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Navigation -- CSS file - */ - -#nav { - position: absolute; - top: 45px; - left: 1px; - padding: 0; - z-index: 3000; - visibility: hidden; -} - -html[data-platform='iPad'] #nav { - top: 57px; -} - -.light #nav { - background-color: #bbb; - box-shadow: 0 2px 8px #777; -} -.dark #nav { - background-color: #444; - box-shadow: 0 2px 8px #111; -} - -#nav .nav-hdr { - font-style: italic; - padding: 6px 8px 6px 8px; -} - -.light #nav .nav-hdr { - color: #ddd; - border-bottom: solid 1px #999; - background-color: #aaa; -} -.dark #nav .nav-hdr { - color: #888; - border-bottom: solid 1px #444; - background-color: #555; -} - -#nav a { - text-decoration: none; - font-size: 14pt; - display: block; - padding: 8px 16px 6px 12px; -} - -.light #nav a { - color: #369; - border-bottom: solid #ccc 1px; -} -.dark #nav a { - color: #eee; - border-bottom: solid #333 1px; -} - -.light #nav a:hover { - background-color: #ddd; -} -.dark #nav a:hover { - background-color: #777; -} - -#nav a div { - display: inline-block; - vertical-align: middle; - padding-right: 4px; -} - -#nav a div svg.embeddedIcon g.icon .glyph { - fill: #c66; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/nav/nav.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/nav/nav.js deleted file mode 100644 index 36ef599e..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/nav/nav.js +++ /dev/null @@ -1,103 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Navigation Module - */ -(function () { - 'use strict'; - - // injected dependencies - var $log, $location, $window, fs; - - // internal state - var navShown = false; - - function updatePane() { - var vis = navShown ? 'visible' : 'hidden'; - d3.select('#nav').style('visibility', vis); - } - - - function showNav() { - navShown = true; - updatePane(); - } - function hideNav() { - navShown = false; - updatePane(); - } - function toggleNav() { - navShown = !navShown; - updatePane(); - } - function hideIfShown() { - if (navShown) { - hideNav(); - return true; - } - return false; - } - - function navTo(path, params) { - var url; - if (!path) { - $log.warn('Not a valid navigation path'); - return null; - } - $location.url('/' + path); - - if (fs.isO(params)) { - $location.search(params); - } else if (params !== undefined) { - $log.warn('Query params not an object', params); - } - - url = $location.absUrl(); - $log.log('Navigating to ', url); - $window.location.href = url; - } - - angular.module('onosNav', []) - .controller('NavCtrl', ['$log', - - function (_$log_) { - var self = this; - $log = _$log_; - - self.hideNav = hideNav; - $log.log('NavCtrl has been created'); - } - ]) - .factory('NavService', - ['$log', '$location', '$window', 'FnService', - - function (_$log_, _$location_, _$window_, _fs_) { - $log = _$log_; - $location = _$location_; - $window = _$window_; - fs = _fs_; - - return { - showNav: showNav, - hideNav: hideNav, - toggleNav: toggleNav, - hideIfShown: hideIfShown, - navTo: navTo - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/remote.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/remote.js deleted file mode 100644 index 453d08f9..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/remote.js +++ /dev/null @@ -1,25 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Remote Communications Module - */ -(function () { - 'use strict'; - - angular.module('onosRemote', ['onosUtil']); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/rest.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/rest.js deleted file mode 100644 index 04b9fe02..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/rest.js +++ /dev/null @@ -1,72 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Remote Communications Module -- REST Service - */ -(function () { - 'use strict'; - - var $log; - - angular.module('onosRemote') - .factory('RestService', - ['$log', '$http', 'FnService', 'UrlFnService', - - function (_$log_, $http, fs, ufs) { - $log = _$log_; - - function get(url, callback, errorCb) { - var fullUrl = ufs.rsUrl(url); - - $http.get(fullUrl).then(function (response) { - // success - callback(response.data); - }, function (response) { - // error - var emsg = 'Failed to retrieve JSON data: ' + fullUrl; - $log.warn(emsg, response.status, response.data); - if (errorCb) { - errorCb(emsg); - } - }); - } - - // TODO: test this - function post(url, data, callbacks) { - var fullUrl = ufs.rsUrl(url); - $http.post(fullUrl, data).then(function (response) { - // success - if (callbacks && fs.isF(callbacks.success)) { - callbacks.success(response.data); - } - }, function (response) { - // error - var msg = 'Problem with $http post request: ' + fullUrl; - $log.warn(msg, response.status, response.data); - - if (callbacks && fs.isF(callbacks.error)) { - callbacks.error(msg); - } - }); - } - - return { - get: get, - post: post - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/urlfn.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/urlfn.js deleted file mode 100644 index 6ec01b41..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/urlfn.js +++ /dev/null @@ -1,63 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Remote -- General Purpose Functions - */ -(function () { - 'use strict'; - - var uiContext = '/onos/ui/', - rsSuffix = uiContext + 'rs/', - wsSuffix = uiContext + 'websock/'; - - angular.module('onosRemote') - .factory('UrlFnService', ['$location', function ($loc) { - - function matchSecure(protocol) { - var p = $loc.protocol(), - secure = (p === 'https' || p === 'wss'); - return secure ? protocol + 's' : protocol; - } - - function urlBase(protocol, port, host) { - return matchSecure(protocol) + '://' + - (host || $loc.host()) + ':' + (port || $loc.port()); - } - - function httpPrefix(suffix) { - return urlBase('http') + suffix; - } - - function wsPrefix(suffix, wsport, host) { - return urlBase('ws', wsport, host) + suffix; - } - - function rsUrl(path) { - return httpPrefix(rsSuffix) + path; - } - - function wsUrl(path, wsport, host) { - return wsPrefix(wsSuffix, wsport, host) + path; - } - - return { - rsUrl: rsUrl, - wsUrl: wsUrl - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/websocket.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/websocket.js deleted file mode 100644 index 1c03d6fd..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/websocket.js +++ /dev/null @@ -1,329 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Remote -- Web Socket Service - */ -(function () { - 'use strict'; - - // injected refs - var $log, $loc, fs, ufs, wsock, vs; - - // internal state - var webSockOpts, // web socket options - ws = null, // web socket reference - wsUp = false, // web socket is good to go - sid = 0, // event sequence identifier - handlers = {}, // event handler bindings - pendingEvents = [], // events TX'd while socket not up - host, // web socket host - url, // web socket URL - clusterNodes = [], // ONOS instances data for failover - clusterIndex = -1, // the instance to which we are connected - connectRetries = 0, // limit our attempts at reconnecting - openListeners = {}, // registered listeners for websocket open() - nextListenerId = 1; // internal ID for open listeners - - // ======================= - // === Bootstrap Handler - - var builtinHandlers = { - bootstrap: function (data) { - clusterNodes = data.clusterNodes; - clusterNodes.forEach(function (d, i) { - if (d.uiAttached) { - clusterIndex = i; - $log.info('Connected to cluster node ' + d.ip); - // TODO: add connect info to masthead somewhere - } - }); - } - }; - - // ========================== - // === Web socket callbacks - - function handleOpen() { - $log.info('Web socket open - ', url); - vs.hide(); - - if (fs.debugOn('txrx')) { - $log.debug('Sending ' + pendingEvents.length + ' pending event(s)...'); - } - pendingEvents.forEach(function (ev) { - _send(ev); - }); - pendingEvents = []; - - connectRetries = 0; - wsUp = true; - informListeners(host, url); - } - - // Handles the specified (incoming) message using handler bindings. - function handleMessage(msgEvent) { - var ev, h; - - try { - ev = JSON.parse(msgEvent.data); - } catch (e) { - $log.error('Message.data is not valid JSON', msgEvent.data, e); - return null; - } - if (fs.debugOn('txrx')) { - $log.debug(' << *Rx* ', ev.event, ev.payload); - } - - if (h = handlers[ev.event]) { - try { - h(ev.payload); - } catch (e) { - $log.error('Problem handling event:', ev, e); - return null; - } - } else { - $log.warn('Unhandled event:', ev); - } - - } - - function handleClose() { - var gsucc; - - $log.info('Web socket closed'); - wsUp = false; - - if (gsucc = findGuiSuccessor()) { - createWebSocket(webSockOpts, gsucc); - } else { - // If no controllers left to contact, show the Veil... - vs.show([ - 'Oops!', - 'Web-socket connection to server closed...', - 'Try refreshing the page.' - ]); - } - } - - - // ============================== - // === Private Helper Functions - - function findGuiSuccessor() { - var ncn = clusterNodes.length, - ip, node; - - while (connectRetries < ncn && !ip) { - connectRetries++; - clusterIndex = (clusterIndex + 1) % ncn; - node = clusterNodes[clusterIndex]; - ip = node && node.ip; - } - - return ip; - } - - function informListeners(host, url) { - angular.forEach(openListeners, function (lsnr) { - lsnr.cb(host, url); - }); - } - - function _send(ev) { - if (fs.debugOn('txrx')) { - $log.debug(' *Tx* >> ', ev.event, ev.payload); - } - ws.send(JSON.stringify(ev)); - } - - function noHandlersWarn(handlers, caller) { - if (!handlers || fs.isEmptyObject(handlers)) { - $log.warn('WSS.' + caller + '(): no event handlers'); - return true; - } - return false; - } - - // =================== - // === API Functions - - // Required for unit tests to set to known state - function resetSid() { - sid = 0; - } - function resetState() { - webSockOpts = undefined; - ws = null; - wsUp = false; - host = undefined; - url = undefined; - pendingEvents = []; - handlers = {}; - sid = 0; - clusterNodes = []; - clusterIndex = -1; - connectRetries = 0; - openListeners = {}; - nextListenerId = 1; - } - - // Currently supported opts: - // wsport: web socket port (other than default 8181) - // host: if defined, is the host address to use - function createWebSocket(opts, _host_) { - var wsport = (opts && opts.wsport) || null; - - webSockOpts = opts; // preserved for future calls - - host = _host_ || $loc.host(); - url = ufs.wsUrl('core', wsport, _host_); - - $log.debug('Attempting to open websocket to: ' + url); - ws = wsock.newWebSocket(url); - if (ws) { - ws.onopen = handleOpen; - ws.onmessage = handleMessage; - ws.onclose = handleClose; - } - // Note: Wsock logs an error if the new WebSocket call fails - return url; - } - - // Binds the message handlers to their message type (event type) as - // specified in the given map. Note that keys are the event IDs; values - // are either: - // * the event handler function, or - // * an API object which has an event handler for the key - // - function bindHandlers(handlerMap) { - var m, - dups = []; - - if (noHandlersWarn(handlerMap, 'bindHandlers')) { - return null; - } - m = d3.map(handlerMap); - - m.forEach(function (eventId, api) { - var fn = fs.isF(api) || fs.isF(api[eventId]); - if (!fn) { - $log.warn(eventId + ' handler not a function'); - return; - } - - if (handlers[eventId]) { - dups.push(eventId); - } else { - handlers[eventId] = fn; - } - }); - if (dups.length) { - $log.warn('duplicate bindings ignored:', dups); - } - } - - // Unbinds the specified message handlers. - // Expected that the same map will be used, but we only care about keys - function unbindHandlers(handlerMap) { - var m; - - if (noHandlersWarn(handlerMap, 'unbindHandlers')) { - return null; - } - m = d3.map(handlerMap); - - m.forEach(function (eventId) { - delete handlers[eventId]; - }); - } - - function addOpenListener(callback) { - var id = nextListenerId++, - cb = fs.isF(callback), - o = { id: id, cb: cb }; - - if (cb) { - openListeners[id] = o; - } else { - $log.error('WSS.addOpenListener(): callback not a function'); - o.error = 'No callback defined'; - } - return o; - } - - function removeOpenListener(lsnr) { - var id = fs.isO(lsnr) && lsnr.id, - o; - if (!id) { - $log.warn('WSS.removeOpenListener(): invalid listener', lsnr); - return null; - } - o = openListeners[id]; - - if (o) { - delete openListeners[id]; - } - } - - // Formulates an event message and sends it via the web-socket. - // If the websocket is not up yet, we store it in a pending list. - function sendEvent(evType, payload) { - var ev = { - event: evType, - sid: ++sid, - payload: payload || {} - }; - - if (wsUp) { - _send(ev); - } else { - pendingEvents.push(ev); - } - } - - - // ============================ - // ===== Definition of module - angular.module('onosRemote') - .factory('WebSocketService', - ['$log', '$location', 'FnService', 'UrlFnService', 'WSock', - 'VeilService', - - function (_$log_, _$loc_, _fs_, _ufs_, _wsock_, _vs_) { - $log = _$log_; - $loc = _$loc_; - fs = _fs_; - ufs = _ufs_; - wsock = _wsock_; - vs = _vs_; - - bindHandlers(builtinHandlers); - - return { - resetSid: resetSid, - resetState: resetState, - createWebSocket: createWebSocket, - bindHandlers: bindHandlers, - unbindHandlers: unbindHandlers, - addOpenListener: addOpenListener, - removeOpenListener: removeOpenListener, - sendEvent: sendEvent - }; - } - ]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/wsevent.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/wsevent.js deleted file mode 100644 index 02d71b52..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/wsevent.js +++ /dev/null @@ -1,49 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - DEPRECATED: to be deleted - ONOS GUI -- Remote -- Web Socket Event Service - */ -(function () { - 'use strict'; - - var sid = 0; - - angular.module('onosRemote') - .factory('WsEventService', [function () { - - function sendEvent(ws, evType, payload) { - var p = payload || {}; - - ws.send({ - event: evType, - sid: ++sid, - payload: p - }); - } - - function resetSid() { - sid = 0; - } - - return { - sendEvent: sendEvent, - resetSid: resetSid - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/wsock.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/wsock.js deleted file mode 100644 index 0c58a798..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/remote/wsock.js +++ /dev/null @@ -1,42 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Remote -- Web Socket Wrapper Service - - This service provided specifically so that it can be mocked in unit tests. - */ -(function () { - 'use strict'; - - angular.module('onosRemote') - .factory('WSock', ['$log', function ($log) { - - function newWebSocket(url) { - var ws = null; - try { - ws = new WebSocket(url); - } catch (e) { - $log.error('Unable to create web socket:', e); - } - return ws; - } - - return { - newWebSocket: newWebSocket - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/geodata.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/geodata.js deleted file mode 100644 index 6c54bb45..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/geodata.js +++ /dev/null @@ -1,186 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- SVG -- GeoData Service - */ - -/* - The GeoData Service facilitates the fetching and caching of TopoJSON data - from the server, as well as providing a way of creating a path generator - for that data, to be used to render the map in an SVG layer. - - A TopoData object can be fetched by ID. IDs that start with an asterisk - identify maps bundled with the GUI. IDs that do not start with an - asterisk are assumed to be URLs to externally provided data. - - var topodata = GeoDataService.fetchTopoData('*continental-us'); - - The path generator can then be created for that data-set: - - var gen = GeoDataService.createPathGenerator(topodata, opts); - - opts is an optional argument that allows the override of default settings: - { - objectTag: 'states', - projection: d3.geo.mercator(), - logicalSize: 1000, - mapFillScale: .95 - }; - - The returned object (gen) comprises transformed data (TopoJSON -> GeoJSON), - the D3 path generator function, and the settings used ... - - { - geodata: { ... }, - pathgen: function (...) { ... }, - settings: { ... } - } - */ - -(function () { - 'use strict'; - - // injected references - var $log, $http, fs; - - // internal state - var cache = d3.map(), - bundledUrlPrefix = 'data/map/'; - - function getUrl(id) { - if (id[0] === '*') { - return bundledUrlPrefix + id.slice(1) + '.topojson'; - } - return id + '.topojson'; - } - - - // start afresh... - function clearCache() { - cache = d3.map(); - } - - // returns a promise decorated with: - // .meta -- id, url, and whether the data was cached - // .topodata -- TopoJSON data (on response from server) - - function fetchTopoData(id) { - if (!fs.isS(id)) { - return null; - } - var url = getUrl(id), - promise = cache.get(id); - - if (!promise) { - // need to fetch the data, build the object, - // cache it, and return it. - promise = $http.get(url); - - promise.meta = { - id: id, - url: url, - wasCached: false - }; - - promise.then(function (response) { - // success - promise.topodata = response.data; - }, function (response) { - // error - $log.warn('Failed to retrieve map TopoJSON data: ' + url, - response.status, response.data); - }); - - cache.set(id, promise); - - } else { - promise.meta.wasCached = true; - } - - return promise; - } - - var defaultGenSettings = { - objectTag: 'states', - projection: d3.geo.mercator(), - logicalSize: 1000, - mapFillScale: .95 - }; - - // converts given TopoJSON-format data into corresponding GeoJSON - // data, and creates a path generator for that data. - function createPathGenerator(topoData, opts) { - var settings = angular.extend({}, defaultGenSettings, opts), - topoObject = topoData.objects[settings.objectTag], - geoData = topojson.feature(topoData, topoObject), - proj = settings.projection, - dim = settings.logicalSize, - mfs = settings.mapFillScale, - path = d3.geo.path().projection(proj); - - rescaleProjection(proj, mfs, dim, path, geoData); - - // return the results - return { - geodata: geoData, - pathgen: path, - settings: settings - }; - } - - function rescaleProjection(proj, mfs, dim, path, geoData) { - // adjust projection scale and translation to fill the view - // with the map - - // start with unit scale, no translation.. - proj.scale(1).translate([0, 0]); - - // figure out dimensions of map data.. - var b = path.bounds(geoData), - x1 = b[0][0], - y1 = b[0][1], - x2 = b[1][0], - y2 = b[1][1], - dx = x2 - x1, - dy = y2 - y1, - x = (x1 + x2) / 2, - y = (y1 + y2) / 2; - - // size map to 95% of minimum dimension to fill space.. - var s = mfs / Math.min(dx / dim, dy / dim), - t = [dim / 2 - s * x, dim / 2 - s * y]; - - // set new scale, translation on the projection.. - proj.scale(s).translate(t); - } - - angular.module('onosSvg') - .factory('GeoDataService', ['$log', '$http', 'FnService', - function (_$log_, _$http_, _fs_) { - $log = _$log_; - $http = _$http_; - fs = _fs_; - - - return { - clearCache: clearCache, - fetchTopoData: fetchTopoData, - createPathGenerator: createPathGenerator, - rescaleProjection: rescaleProjection - }; - }]); -}());
\ No newline at end of file diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/glyph.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/glyph.css deleted file mode 100644 index 82910654..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/glyph.css +++ /dev/null @@ -1,34 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Glyph Service -- CSS file - */ - -svg .glyph { - stroke: none; - fill-rule: evenodd; -} - -.light svg .glyph, -.dark svg .glyph.overlay { - fill: black; -} - -.dark svg .glyph, -.light svg .glyph.overlay { - fill: white; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/glyph.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/glyph.js deleted file mode 100644 index d8dce362..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/glyph.js +++ /dev/null @@ -1,678 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- SVG -- Glyph Service - */ -(function () { - 'use strict'; - - // injected references - var $log, fs, sus; - - // internal state - var glyphs = d3.map(); - - // ---------------------------------------------------------------------- - // Base set of Glyphs... - - var birdData = { - _bird: "352 224 113 112", - bird: "M427.7,300.4 c-6.9,0.6-13.1,5-19.2,7.1c-18.1,6.2-33.9," + - "9.1-56.5,4.7c24.6,17.2,36.6,13,63.7,0.1c-0.5,0.6-0.7,1.3-1.3," + - "1.9c1.4-0.4,2.4-1.7,3.4-2.2c-0.4,0.7-0.9,1.5-1.4,1.9c2.2-0.6," + - "3.7-2.3,5.9-3.9c-2.4,2.1-4.2,5-6,8c-1.5,2.5-3.1,4.8-5.1,6.9c-1," + - "1-1.9,1.9-2.9,2.9c-1.4,1.3-2.9,2.5-5.1,2.9c1.7,0.1,3.6-0.3,6.5" + - "-1.9c-1.6,2.4-7.1,6.2-9.9,7.2c10.5-2.6,19.2-15.9,25.7-18c18.3" + - "-5.9,13.8-3.4,27-14.2c1.6-1.3,3-1,5.1-0.8c1.1,0.1,2.1,0.3,3.2," + - "0.5c0.8,0.2,1.4,0.4,2.2,0.8l1.8,0.9c-1.9-4.5-2.3-4.1-5.9-6c-2.3" + - "-1.3-3.3-3.8-6.2-4.9c-7.1-2.6-11.9,11.7-11.7-5c0.1-8,4.2-14.4," + - "6.4-22c1.1-3.8,2.3-7.6,2.4-11.5c0.1-2.3,0-4.7-0.4-7c-2-11.2-8.4" + - "-21.5-19.7-24.8c-1-0.3-1.1-0.3-0.9,0c9.6,17.1,7.2,38.3,3.1,54.2" + - "C429.9,285.5,426.7,293.2,427.7,300.4z" - }, - - // TODO: ONOS-2566 glyphs for device types: - // otn, roadm_otn, firewall, balancer, ips, ids, - // controller, virtual, fiber_switch, other - - // NOTE: when adding glyphs, please also update TopoConstants.Glyphs class. - - glyphDataSet = { - _viewbox: "0 0 110 110", - - unknown: "M35,40a5,5,0,0,1,5-5h30a5,5,0,0,1,5,5v30a5,5,0,0,1-5,5" + - "h-30a5,5,0,0,1-5-5z", - - query: "M51.4,69.9c0-0.9,0-1.6,0-2.1c0-2.7,0.4-5.1,1.2-7.1" + - "c0.6-1.5,1.5-3,2.8-4.5c0.9-1.1,2.6-2.7,5.1-4.8c2.4-2.1,4-3.8," + - "4.8-5.1 c0.7-1.3,1.1-2.6,1.1-4.1c0-2.7-1.1-5.1-3.2-7.1c-2.1-2" + - "-4.8-3.1-7.9-3.1c-3,0-5.5,0.9-7.5,2.8c-2,1.9-3.3,4.8-4,8.7l-7.2" + - "-0.8 c0.7-5.3,2.6-9.3,5.8-12.1c3.2-2.8,7.5-4.2,12.8-4.2c5.6,0," + - "10.1,1.5,13.4,4.5c3.3,3,5,6.7,5,10.9c0,2.5-0.6,4.8-1.8,6.8 " + - "s-3.5,4.6-6.9,7.6c-2.3,2-3.8,3.5-4.5,4.4c-0.7,1-1.2,2-1.6,3.3" + - "c-0.3,1.2-0.5,3.2-0.6,6H51.4z M51,83.8v-7.9h8v7.9H51z", - - node: "M15,100a5,5,0,0,1-5-5v-65a5,5,0,0,1,5-5h80a5,5,0,0,1,5,5" + - "v65a5,5,0,0,1-5,5zM14,22.5l11-11a10,3,0,0,1,10-2h40a10,3,0,0,1," + - "10,2l11,11zM16,35a5,5,0,0,1,10,0a5,5,0,0,1-10,0z", - - switch: "M10,20a10,10,0,0,1,10-10h70a10,10,0,0,1,10,10v70a10,10," + - "0,0,1-10,10h-70a10,10,0,0,1-10-10zM60,26l12,0,0-8,18,13-18,13,0" + - "-8-12,0zM60,60l12,0,0-8,18,13-18,13,0-8-12,0zM50,40l-12,0,0-8" + - "-18,13,18,13,0-8,12,0zM50,74l-12,0,0-8-18,13,18,13,0-8,12,0z", - - roadm: "M10,35l25-25h40l25,25v40l-25,25h-40l-25-25zM58,26l12,0,0" + - "-8,18,13-18,13,0-8-12,0zM58,60l12,0,0-8,18,13-18,13,0-8-12,0z" + - "M52,40l-12,0,0-8-18,13,18,13,0-8,12,0zM52,74l-12,0,0-8-18,13," + - "18,13,0-8,12,0z", - - endstation: "M10,15a5,5,0,0,1,5-5h65a5,5,0,0,1,5,5v80a5,5,0,0,1" + - "-5,5h-65a5,5,0,0,1-5-5zM87.5,14l11,11a3,10,0,0,1,2,10v40a3,10," + - "0,0,1,-2,10l-11,11zM17,19a2,2,0,0,1,2-2h56a2,2,0,0,1,2,2v26a2," + - "2,0,0,1-2,2h-56a2,2,0,0,1-2-2zM20,20h54v10h-54zM20,33h54v10h" + - "-54zM42,70a5,5,0,0,1,10,0a5,5,0,0,1-10,0z", - - router: "M10,55A45,45,0,0,1,100,55A45,45,0,0,1,10,55M20,50l12,0," + - "0-8,18,13-18,13,0-8-12,0zM90,50l-12,0,0-8-18,13,18,13,0-8,12,0z" + - "M50,47l0-12-8,0,13-18,13,18-8,0,0,12zM50,63l0,12-8,0,13,18,13" + - "-18-8,0,0-12z", - - bgpSpeaker: "M10,40a45,35,0,0,1,90,0Q100,77,55,100Q10,77,10,40z" + - "M50,29l12,0,0-8,18,13-18,13,0-8-12,0zM60,57l-12,0,0-8-18,13," + - "18,13,0-8,12,0z", - - microwave: "M85,71.2c-8.9,10.5-29.6,8.7-45.3-3.5C23.9,55.4,19.8," + - "37,28.6,26.5C29.9,38.6,71.5,69.9,85,71.2z M92.7,76.2M16.2,15 " + - "M69.5,100.7v-4c0-1.4-1.2-2.2-2.6-2.2H19.3c-1.4,0-2.8,0.7-2.8,2.2" + - "v3.9c0,0.7,0.8,1,1.5,1h50.3C69,101.5,69.5,101.3,69.5,100.7z " + - "M77.3,7.5l0,3.7c9,0.1,16.3,7.1,16.2,15.7l3.9,0C97.5,16.3,88.5," + - "7.6,77.3,7.5z M77.6,14.7l0,2.5c5.3,0,9.7,4.2,9.6,9.3l2.6,0C89.9" + - ",20,84.4,14.7,77.6,14.7z M82.3,22.2c-1.3-1.2-2.9-1.9-4.7-1.9" + - "l0,1.2c1.4,0,2.8,0.6,3.8,1.5c1,1,1.6,2.3,1.6,3.7l1.3,0C84.3,25.1," + - "83.6,23.4,82.3,22.2z M38.9,69.5l-5.1,23h16.5l-2.5-17.2C44.1,73.3," + - "38.9,69.5,38.9,69.5zM58.1,54.1c13.7,10.1,26.5,16.8,29.2,13.7" + - "c2.7-3.1-5.6-13-19.3-24.4 M62.9,34.2 M62,37.9C47.7,27.3,33.7,20," + - "31,23.1c-2.7,3.2,7,14.2,20.6,26 M73.9,25.7c-2.9,0.1-5.2,2.3-5.1," + - "4.8c0,0.7,0.2,1.4,0.6,2l0,0L53.8,49.7l3.3,2.5L72.7,35l-0.4-0.3" + - "c0.6,0.2,1.3,0.3,1.9,0.3c2.9-0.1,5.2-2.3,5.1-4.9C79.3,27.6,76.8," + - "25.6,73.9,25.7z", - - chain: "M60.4,77.6c-4.9,5.2-9.6,11.3-15.3,16.3c-8.6,7.5-20.4,6.8" + - "-28-0.8c-7.7-7.7-8.4-19.6-0.8-28.4c6.5-7.4,13.5-14.4,20.9-20.9" + - "c7.5-6.7,19.2-6.7,26.5-0.8c3.5,2.8,4.4,6.1,2.2,8.7c-2.7,3.1" + - "-5.5,2.5-8.5,0.3c-4.7-3.4-9.7-3.2-14,0.9C37.1,58.7,31,64.8," + - "25.2,71c-4.2,4.4-4.2,10.6-0.6,14.3c3.7,3.7,9.7,3.7,14.3-0.4" + - "c2.9-2.5,5.3-5.5,8.3-8c1-0.9,3-1.1,4.4-0.9C54.8,76.3,57.9,77.1," + - "60.4,77.6zM49.2,32.2c5-5.2,9.7-10.9,15.2-15.7c12.8-11,31.2" + - "-4.9,34.3,11.2C100,34.2,98.3,40.2,94,45c-6.7,7.4-13.7,14.6" + - "-21.2,21.2C65.1,73,53.2,72.7,46,66.5c-3.2-2.8-3.9-5.8-1.6-8.4" + - "c2.6-2.9,5.3-2.4,8.2-0.3c5.2,3.7,10,3.3,14.7-1.1c5.8-5.6,11.6" + - "-11.3,17.2-17.2c4.6-4.8,4.9-11.1,0.9-15c-3.9-3.9-10.1-3.4-15," + - "1.2c-3.1,2.9-5.7,7.4-9.3,8.5C57.6,35.3,53,33,49.2,32.2z", - - crown: "M99.5,21.6c0,3-2.3,5.4-5.1,5.4c-0.3,0-0.7,0-1-0.1c-1.8," + - "4-4.8,10-7.2,17.3c-3.4,10.6-0.9,26.2,2.7,27.3C90.4,72,91.3," + - "75,88,75H22.7c-3.3,0-2.4-3-0.9-3.5c3.6-1.1,6.1-16.7,2.7-27.3" + - "c-2.4-7.4-5.4-13.5-7.2-17.5c-0.5,0.2-1,0.3-1.6,0.3c-2.8,0" + - "-5.1-2.4-5.1-5.4c0-3,2.3-5.4,5.1-5.4c2.8,0,5.1,2.4,5.1,5.4c0," + - "1-0.2,1.9-0.7,2.7c0.7,0.8,1.4,1.6,2.4,2.6c8.8,8.9,11.9,12.7," + - "18.1,11.7c6.5-1,11-8.2,13.3-14.1c-2-0.8-3.3-2.7-3.3-5.1c0-3," + - "2.3-5.4,5.1-5.4c2.8,0,5.1,2.4,5.1,5.4c0,2.5-1.6,4.5-3.7,5.2" + - "c2.3,5.9,6.8,13,13.2,14c6.2,1,9.3-2.7,18.1-11.7c0.7-0.7,1.4" + - "-1.5,2-2.1c-0.6-0.9-1-2-1-3.1c0-3,2.3-5.4,5.1-5.4C97.2,16.2," + - "99.5,18.6,99.5,21.6zM92,87.9c0,2.2-1.7,4.1-3.8,4.1H22.4c" + - "-2.1,0-4.4-1.9-4.4-4.1v-3.3c0-2.2,2.3-4.5,4.4-4.5h65.8c2.1," + - "0,3.8,2.3,3.8,4.5V87.9z", - - lock: "M79.4,48.6h-2.7c0.2-5.7-0.2-20.4-7.9-28.8c-3.6-3.9-8.3" + - "-5.9-13.7-5.9c-5.4,0-10.2,2-13.8,5.9c-7.8,8.4-8.3,23.2-8.1,28.8" + - "h-2.7c-4.4,0-8,2.6-8,5.9v35.7c0,3.3,3.6,5.9,8,5.9h48.9c4.4,0," + - "8-2.6,8-5.9V54.5C87.5,51.3,83.9,48.6,79.4,48.6z M48.1,26.1c1.9" + - "-2,4.1-2.9,7-2.9c2.9,0,5.1,0.9,6.9,2.9c5,5.4,5.6,17.1,5.4,22.6" + - "h-25C42.3,43.1,43.1,31.5,48.1,26.1z", - - topo: 'M97.2,76.3H86.6l-7.7-21.9H82c1,0,1.9-0.8,1.9-1.9V35.7c' + - '0-1-0.8-1.9-1.9-1.9H65.2c-1,0-1.9,0.8-1.9,1.9v2.6L33.4,26.1v-11' + - 'c0-1-0.8-1.9-1.9-1.9H14.7c-1,0-1.9,0.8-1.9,1.9v16.8c0,1,0.8,' + - '1.9,1.9,1.9h16.8c1,0,1.9-0.8,1.9-1.9v-2.6l29.9,12.2v9L30.5,76.9' + - 'c-0.3-0.3-0.8-0.5-1.3-0.5H12.4c-1,0-1.9,0.8-1.9,1.9V95c0,1,0.8,' + - '1.9,1.9,1.9h16.8c1,0,1.9-0.8,1.9-1.9v-6.9h47.4V95c0,1,0.8,1.9,' + - '1.9,1.9h16.8c1,0,1.9-0.8,1.9-1.9V78.2C99.1,77.2,98.2,76.3,97.2,' + - '76.3z M31.1,85.1v-4.9l32.8-26.4c0.3,0.3,0.8,0.5,1.3,0.5h10.5l' + - '7.7,21.9h-3c-1,0-1.9,0.8-1.9,1.9v6.9H31.1z', - - refresh: 'M102.6,40.8L88.4,70.5L69.8,43.4L80,42.6c-0.7-2.3-1.7-' + - '5.1-3.4-7.8C71.8,27,64,23.1,53.5,23.1c-19.5,0-24.8,11.2-24.8,' + - '11.3l-10.1-4.3c0.3-0.7,7.9-18,35-18c24.8,0,35,17.3,37.7,29.6L' + - '102.6,40.8z M81.5,74.5c-0.2,0.5-5.5,11.4-24.9,11.4c-10.5,0-18.3' + - '-3.9-23.1-11.7c-1.7-2.8-2.8-5.6-3.4-7.8l10.2-0.8L21.7,38.5L7.5,' + - '68.2l11.4-0.9c2.7,12.3,12.9,29.6,37.7,29.6c26.9,0,34.6-17.2,34.9' + - '-18L81.5,74.5z', - - garbage: 'M94.6,20.2c0,2.7-2.1,4.8-4.8,4.8H19.2c-2.7,0-4.8-2.1-' + - '4.8-4.8s2.1-4.8,4.8-4.8h27.6c-0.8-0.7-1.4-1.7-1.4-2.9c0-2.1,1.7-' + - '3.9,3.9-3.9h10.4c2.1,0,3.9,1.7,3.9,3.9c0,1.2-0.5,2.2-1.4,2.9h' + - '27.6C92.5,15.4,94.6,17.6,94.6,20.2z M91,33.4v64.8c0,2-1.7,3.6-' + - '3.8,3.6h-65c-2.1,0-3.8-1.6-3.8-3.6V33.4c0-2,1.7-3.6,3.8-3.6h65C' + - '89.3,29.8,91,31.4,91,33.4z M31.5,37.7c0-2.1-1.2-3.8-2.7-3.8h-0.7' + - 'c-1.5,0-2.7,1.7-2.7,3.8v55.9c0,2.1,1.2,3.8,2.7,3.8h0.7c1.5,0,2.7' + - '-1.7,2.7-3.8V37.7z M58.5,37.7c0-2.1-1.8-3.8-4-3.8h-1c-2.2,0-4,' + - '1.7-4,3.8v55.9c0,2.1,1.8,3.8,4,3.8h1c2.2,0,4-1.7,4-3.8V37.7z M' + - '83.5,37.7c0-2.1-1.2-3.8-2.7-3.8h-0.7c-1.5,0-2.7,1.7-2.7,3.8v55.9' + - 'c0,2.1,1.2,3.8,2.7,3.8h0.7c1.5,0,2.7-1.7,2.7-3.8V37.7z', - - loading: 'M103.1,53.1c0,0,0,0.2,0,0.5c0,0.2,0,0.4,0,0.7c0,0.3,0,0' + - '.6,0,0.9c-0.1,1.3-0.2,3-0.5,4.8c-0.5,3.4-1.6,6.8-1.6,6.8l-9.2-2.' + - '7c0,0,0.8-2.7,1.1-5.5c0.2-1.4,0.3-2.8,0.3-3.8c0-0.3,0-0.5,0-0.7c' + - '0-0.2,0-0.4,0-0.6c0-0.3,0-0.5,0-0.5L103.1,53.1z M87.3,74.3c0,0-0' + - '.1,0.2-0.3,0.5c-0.2,0.3-0.4,0.6-0.7,1.1c-0.6,0.9-1.4,2-2.3,3.1c-' + - '1.8,2.2-3.9,4.1-3.9,4.1l5.7,6.5c0,0,0.7-0.5,1.6-1.4c1-0.9,2.2-2.' + - '1,3.3-3.4c1.1-1.3,2.2-2.6,3-3.7c0.4-0.5,0.7-1,0.9-1.3c0.2-0.3,0.' + - '3-0.4,0.3-0.4L87.3,74.3z M70.8,89.2c0,0-0.2,0.1-0.5,0.2c-0.3,0.2' + - '-0.6,0.3-1.2,0.5c-1,0.4-2.3,0.9-3.7,1.4c-2.7,0.9-5.5,1.3-5.5,1.3' + - 'l1.1,7.6c0,0,0.8-0.1,2.1-0.3c1.3-0.2,2.9-0.6,4.6-1c1.6-0.5,3.3-1' + - ',4.5-1.5c0.6-0.2,1.2-0.5,1.5-0.6c0.3-0.1,0.5-0.2,0.5-0.2L70.8,89' + - '.2z M48.6,92.9c0,0-0.2,0-0.5-0.1c-0.4,0-0.7-0.1-1.3-0.2c-1.1-0.2' + - '-2.5-0.5-3.9-0.8c-2.8-0.7-5.4-1.9-5.4-1.9L34.6,96c0,0,3,1.5,6.3,' + - '2.5c1.6,0.5,3.3,0.9,4.5,1.2c0.6,0.1,1.2,0.2,1.5,0.3c0.3,0.1,0.5,' + - '0.1,0.5,0.1L48.6,92.9z M27.6,83.8c0,0-0.1-0.1-0.4-0.3c-0.3-0.2-0' + - '.6-0.5-1-0.9c-0.8-0.7-1.8-1.8-2.8-2.8c-2-2.2-3.6-4.6-3.6-4.6l-5,' + - '3.2c0,0,0.4,0.7,1.1,1.7c0.7,1,1.7,2.4,2.8,3.7c1.1,1.3,2.2,2.5,3.' + - '1,3.4c0.4,0.4,0.9,0.8,1.1,1.1c0.3,0.2,0.4,0.4,0.4,0.4L27.6,83.8z' + - 'M14.8,64.7c0,0-0.1-0.2-0.2-0.5c-0.1-0.3-0.2-0.7-0.4-1.3c-0.3-1.1' + - '-0.6-2.5-0.8-4c-0.5-2.9-0.5-5.9-0.5-5.9l-5,0c0,0,0,0.8,0,2.1c0,1' + - '.2,0.1,2.9,0.3,4.5c0.2,1.6,0.5,3.3,0.8,4.5c0.1,0.6,0.3,1.2,0.4,1' + - '.5c0.1,0.3,0.1,0.5,0.1,0.5L14.8,64.7z M14.3,41.4c0,0,0.1-0.2,0.1' + - '-0.5c0.1-0.3,0.2-0.7,0.4-1.3c0.3-1.1,0.8-2.5,1.4-3.8c1.2-2.7,2.8' + - '-5.3,2.8-5.3l-3.4-2.2c0,0-1.8,2.7-3.2,5.7c-0.7,1.5-1.3,3-1.7,4.2' + - 'c-0.2,0.6-0.4,1.1-0.5,1.4C10,39.9,10,40.1,10,40.1L14.3,41.4z M26' + - '.7,21.3c0,0,0.1-0.1,0.4-0.4c0.3-0.2,0.6-0.5,1-0.9c0.9-0.7,2.1-1.' + - '6,3.3-2.5c1.2-0.8,2.5-1.6,3.5-2.1c1-0.5,1.7-0.9,1.7-0.9l-1.3-2.9' + - 'c0,0-0.7,0.3-1.8,0.9c-1.1,0.5-2.5,1.3-3.9,2.2c-1.4,0.9-2.7,1.8-3' + - '.7,2.5c-0.5,0.4-0.9,0.7-1.2,0.9c-0.3,0.2-0.4,0.3-0.4,0.3L26.7,21' + - '.3z M48.2,11c0,0,0.2,0,0.5-0.1c0.3,0,0.8-0.1,1.4-0.2c1.1-0.1,2.6' + - '-0.3,4.2-0.3c3-0.1,6.1,0.3,6.1,0.3l0.3-2.3c0,0-0.8-0.1-2-0.3C57.' + - '4,8.1,55.8,8,54.2,8c-1.6,0-3.2,0-4.4,0.1c-0.6,0-1.1,0.1-1.5,0.1c' + - '-0.3,0-0.5,0.1-0.5,0.1L48.2,11z M72,14c0,0,0.7,0.3,1.7,0.8c1,0.5' + - ',2.4,1.2,3.7,2c2.6,1.6,5,3.6,5,3.6l0.9-1c0,0-2.4-2.1-5-3.9c-1.3-' + - '0.9-2.7-1.7-3.8-2.3c-1.1-0.6-1.8-0.9-1.8-0.9L72,14zM90.7,29.6c0,' + - '0,0.4,0.6,1,1.6c0.6,1,1.4,2.3,2,3.7c0.7,1.4,1.3,2.8,1.7,3.9c0.4,' + - '1.1,0.6,1.8,0.6,1.8l0.4-0.1c0,0-0.2-0.8-0.6-1.9c-0.4-1.1-0.9-2.6' + - '-1.5-4c-0.6-1.4-1.3-2.9-1.9-3.9c-0.6-1-1-1.7-1-1.7L90.7,29.6z', - - // --- Navigation glyphs ------------------------------------ - - flowTable: 'M15.9,19.1h-8v-13h8V19.1z M90.5,6.1H75.6v13h14.9V6.1z' + - ' M71.9,6.1H56.9v13h14.9V6.1z M53.2,6.1H38.3v13h14.9V6.1z M34.5,' + - '6.1H19.6v13h14.9V6.1z M102.2,6.1h-8v13h8V6.1z M102.2,23.6H7.9v' + - '78.5h94.4V23.6z M86,63.2c0,3.3-2.7,6-6,6c-2.8,0-5.1-1.9-5.8-' + - '4.5H63.3v5.1c0,0.9-0.7,1.5-1.5,1.5h-5.2v10.6c2.6,0.7,4.5,3,4.5,' + - '5.8c0,3.3-2.7,6-6,6c-3.3,0-6-2.7-6-6c0-2.8,1.9-5.1,4.4-5.8V71.3' + - 'H48c-0.9,0-1.5-0.7-1.5-1.5v-5.1H36c-0.7,2.6-3,4.4-5.8,4.4c-3.3,' + - '0-6-2.7-6-6s2.7-6,6-6c2.8,0,5.2,1.9,5.8,4.5h10.5V56c0-0.9,0.7-' + - '1.5,1.5-1.5h5.5V43.8c-2.6-0.7-4.5-3-4.5-5.8c0-3.3,2.7-6,6-6s6,' + - '2.7,6,6c0,2.8-1.9,5.1-4.5,5.8v10.6h5.2c0.9,0,1.5,0.7,1.5,1.5v' + - '5.6h10.8c0.7-2.6,3-4.5,5.8-4.5C83.3,57.1,86,59.8,86,63.2z M55.1,' + - '42.3c2.3,0,4.3-1.9,4.3-4.3c0-2.3-1.9-4.3-4.3-4.3s-4.3,1.9-4.3,' + - '4.3C50.8,40.4,52.7,42.3,55.1,42.3z M34.4,63.1c0-2.3-1.9-4.3-4.3' + - '-4.3s-4.3,1.9-4.3,4.3s1.9,4.3,4.3,4.3S34.4,65.5,34.4,63.1z ' + - 'M55.1,83.5c-2.3,0-4.3,1.9-4.3,4.3s1.9,4.3,4.3,4.3s4.3-1.9,4.3-' + - '4.3S57.5,83.5,55.1,83.5zM84.2,63.2c0-2.3-1.9-4.3-4.3-4.3s-4.3,' + - '1.9-4.3,4.3s1.9,4.3,4.3,4.3S84.2,65.5,84.2,63.2z', - - portTable: 'M15.9,19.1h-8v-13h8V19.1z M90.5,6.1H75.6v13h14.9V6.1' + - 'z M71.9,6.1H56.9v13h14.9V6.1z M53.2,6.1H38.3v13h14.9V6.1z M34.5,' + - '6.1H19.6v13h14.9V6.1z M102.2,6.1h-8v13h8V6.1z M102.6,23.6v78.5H' + - '8.2V23.6H102.6z M85.5,37.7c0-0.7-0.4-1.3-0.9-1.3H26.2c-0.5,0-' + - '0.9,0.6-0.9,1.3v34.6c0,0.7,0.4,1.3,0.9,1.3h11v9.6c0,1.1,0.5,2,' + - '1.2,2h9.1c0,0.2,0,0.3,0,0.5v3c0,1.1,0.5,2,1.2,2h13.5c0.6,0,1.2-' + - '0.9,1.2-2v-3c0-0.2,0-0.3,0-0.5h9.1c0.6,0,1.2-0.9,1.2-2v-9.6h11' + - 'c0.5,0,0.9-0.6,0.9-1.3V37.7z M30.2,40h-1v8h1V40zM75.2,40h-2.1v8' + - 'h2.1V40z M67.7,40h-2.1v8h2.1V40z M60.2,40h-2.1v8h2.1V40z M52.7,' + - '40h-2.1v8h2.1V40z M45.2,40h-2.1v8h2.1V40zM37.7,40h-2.1v8h2.1V40' + - 'z M81.6,40h-1v8h1V40z', - - groupTable: 'M16,19.1H8v-13h8V19.1z M90.6,6.1H75.7v13h14.9V6.1z ' + - 'M71.9,6.1H57v13h14.9V6.1z M53.3,6.1H38.4v13h14.9V6.1z M34.6,6.1' + - 'H19.7v13h14.9V6.1z M102.3,6.1h-8v13h8V6.1z M45.7,52.7c0.2-5.6,' + - '2.6-10.7,6.2-14.4c-2.6-1.5-5.7-2.5-8.9-2.5c-9.8,0-17.7,7.9-17.7,' + - '17.7c0,6.3,3.3,11.9,8.3,15C34.8,61.5,39.4,55.6,45.7,52.7z M51.9,' + - '68.8c-3.1-3.1-5.2-7.2-6-11.7c-4.7,2.8-7.9,7.6-8.6,13.2c1.8,0.6,' + - '3.6,0.9,5.6,0.9C46.2,71.2,49.3,70.3,51.9,68.8z M55.2,71.5c-3.5,' + - '2.4-7.7,3.7-12.2,3.7c-1.9,0-3.8-0.3-5.6-0.7C38.5,83.2,45.9,90,' + - '54.9,90c9,0,16.4-6.7,17.5-15.4c-1.6,0.4-3.4,0.6-5.1,0.6C62.8,' + - '75.2,58.6,73.8,55.2,71.5z M54.9,50.6c1.9,0,3.8,0.3,5.6,0.7c-0.5' + - '-4.1-2.5-7.9-5.4-10.6c-2.9,2.7-4.8,6.4-5.3,10.5C51.5,50.8,53.2,' + - '50.6,54.9,50.6z M49.7,55.4c0.5,4.3,2.4,8.1,5.4,10.9c2.9-2.8,4.9' + - '-6.6,5.4-10.8c-1.8-0.6-3.6-0.9-5.6-0.9C53.1,54.6,51.4,54.9,49.7,' + - '55.4z M102.3,23.6v78.5H8V23.6H102.3z M89,53.5c0-12-9.7-21.7-' + - '21.7-21.7c-4.5,0-8.7,1.4-12.2,3.7c-3.5-2.4-7.7-3.7-12.2-3.7c-12,' + - '0-21.7,9.7-21.7,21.7c0,8.5,4.9,15.9,12,19.4C33.6,84.6,43.2,94,' + - '54.9,94c11.7,0,21.2-9.3,21.7-20.9C84,69.7,89,62.2,89,53.5z M' + - '64.3,57.3c-0.8,4.4-2.9,8.4-5.9,11.5c2.6,1.5,5.7,2.5,8.9,2.5c1.8,' + - '0,3.6-0.3,5.2-0.8C72,64.9,68.8,60.1,64.3,57.3z M67.3,35.8c-3.3,0' + - '-6.3,0.9-8.9,2.5c3.7,3.8,6.1,8.9,6.2,14.6c6.1,3.1,10.6,8.9,11.7,' + - '15.8C81.5,65.6,85,60,85,53.5C85,43.8,77.1,35.8,67.3,35.8z', - - // --- Topology toolbar specific glyphs ---------------------- - - summary: "M95.8,9.2H14.2c-2.8,0-5,2.2-5,5v81.5c0,2.8,2.2,5,5," + - "5h81.5c2.8,0,5-2.2,5-5V14.2C100.8,11.5,98.5,9.2,95.8,9.2z " + - "M16.7,22.2c0-1.1,0.9-2,2-2h20.1c1.1,0,2,0.9,2,2v20.1c0,1.1-0.9," + - "2-2,2H18.7c-1.1,0-2-0.9-2-2V22.2z M93,87c0,1.1-0.9,2-2,2H18.9" + - "c-1.1,0-2-0.9-2-2v-7c0-1.1,0.9-2,2-2H91c1.1,0,2,0.9,2,2V87z " + - "M93,65c0,1.1-0.9,2-2,2H18.9c-1.1,0-2-0.9-2-2v-7c0-1.1,0.9-2," + - "2-2H91c1.1,0,2,0.9,2,2V65z", - - details: "M95.8,9.2H14.2c-2.8,0-5,2.2-5,5v81.5c0,2.8,2.2,5,5," + - "5h81.5c2.8,0,5-2.2,5-5V14.2C100.8,11.5,98.5,9.2,95.8,9.2z M16.9," + - "22.2c0-1.1,0.9-2,2-2H91c1.1,0,2,0.9,2,2v7c0,1.1-0.9,2-2,2H18.9c" + - "-1.1,0-2-0.9-2-2V22.2z M93,87.8c0,1.1-0.9,2-2,2H18.9c-1.1," + - "0-2-0.9-2-2v-7c0-1.1,0.9-2,2-2H91c1.1,0,2,0.9,2,2V87.8z M93,68.2" + - "c0,1.1-0.9,2-2,2H18.9c-1.1,0-2-0.9-2-2v-7c0-1.1,0.9-2,2-2H91" + - "c1.1,0,2,0.9,2,2V68.2z M93,48.8c0,1.1-0.9,2-2,2H19c-1.1,0-2-" + - "0.9-2-2v-7c0-1.1,0.9-2,2-2H91c1.1,0,2,0.9,2,2V48.8z", - - ports: "M98,9.2H79.6c-1.1,0-2.1,0.9-2.1,2.1v17.6l-5.4,5.4c-1.7" + - "-1.1-3.8-1.8-6-1.8c-6,0-10.9,4.9-10.9,10.9c0,2.2,0.7,4.3,1.8,6" + - "l-7.5,7.5c-1.8-1.2-3.9-1.9-6.2-1.9c-6,0-10.9,4.9-10.9,10.9c0," + - "2.3,0.7,4.4,1.9,6.2l-6.2,6.2H11.3c-1.1,0-2.1,0.9-2.1,2.1v18.4" + - "c0,1.1,0.9,2.1,2.1,2.1h18.4c1.1,0,2.1-0.9,2.1-2.1v-16l7-6.9" + - "c1.4,0.7,3,1.1,4.7,1.1c6,0,10.9-4.9,10.9-10.9c0-1.7-0.4-3.3-" + - "1.1-4.7l8-8c1.5,0.7,3.1,1.1,4.8,1.1c6,0,10.9-4.9,10.9-10.9c0" + - "-1.7-0.4-3.4-1.1-4.8l6.9-6.9H98c1.1,0,2.1-0.9,2.1-2.1V11.3" + - "C100.1,10.2,99.2,9.2,98,9.2z M43.4,72c-3.3,0-6-2.7-6-6s2.7-6," + - "6-6s6,2.7,6,6S46.7,72,43.4,72z M66.1,49.5c-3.3,0-6-2.7-6-6" + - "c0-3.3,2.7-6,6-6s6,2.7,6,6C72.2,46.8,69.5,49.5,66.1,49.5z", - - map: "M95.8,9.2H14.2c-2.8,0-5,2.2-5,5v66c0.3-1.4,0.7-2.8," + - "1.1-4.1l1.6,0.5c-0.9,2.4-1.6,4.8-2.2,7.3l-0.5-0.1v12c0,2.8,2.2," + - "5,5,5h81.5c2.8,0,5-2.2,5-5V14.2C100.8,11.5,98.5,9.2,95.8,9.2z " + - "M16.5,67.5c-0.4,0.5-0.7,1-1,1.5c-0.3,0.5-0.6,1-0.9,1.6l-1.9-0.9" + - "c0.3-0.6,0.6-1.2,0.9-1.8c0.3-0.6,0.6-1.2,1-1.7c0.7-1.1,1.5-2.2," + - "2.5-3.2l1.8,1.8C18,65.6,17.2,66.5,16.5,67.5z M29.7,64.1" + - "c-0.4-0.4-0.8-0.8-1.2-1.1c-0.1-0.1-0.2-0.1-0.2-0.1c0,0-0.1," + - "0-0.1-0.1l-0.1,0l0,0l-0.1,0c-0.3-0.1-0.5-0.2-0.8-0.2c-0.5-0.1" + - "-1.1-0.2-1.6-0.3c-0.6,0-1.1,0-1.6,0l-0.4-2.8c0.7-0.1,1.5-0.2,2.2" + - "-0.1c0.7,0,1.4,0.1,2.2,0.3c0.4,0.1,0.7,0.2,1,0.3l0.1,0l0,0l0.1," + - "0l0.1,0c0.1,0,0.1,0,0.3,0.1c0.3,0.1,0.5,0.2,0.7,0.4c0.7,0.5," + - "1.2,0.9,1.7,1.4L29.7,64.1z M39.4,74.7c-1.8-1.8-3.6-3.8-5.3-5.7" + - "l2.6-2.4c0.9,0.9,1.8,1.8,2.7,2.7c0.9,0.9,1.8,1.7,2.7,2.6L39.4," + - "74.7z M50.8,84.2c-1.1-0.7-2.2-1.5-3.3-2.3c-0.5-0.4-1.1-0.8-1.6" + - "-1.2c-0.5-0.4-1-0.8-1.5-1.2l2.7-3.4c0.5,0.4,1,0.8,1.5,1.1c0.5," + - "0.3,1,0.7,1.5,1c1,0.7,2.1,1.3,3.1,1.9L50.8,84.2z M61.3," + - "88.7c-0.7-0.1-1.4-0.3-2.1-0.5c-0.7-0.2-1.4-0.5-2-0.7l1.8" + - "-4.8c0.6,0.2,1.1,0.4,1.6,0.5c0.5,0.2,1.1,0.3,1.6,0.4c1,0.2,2.1," + - "0.2,3,0.1l0.7,5.1C64.3,89.1,62.7,88.9,61.3,88.7z M75.1,80.4c" + - "-0.2,0.7-0.5,1.4-0.9,2c-0.2,0.3-0.3,0.7-0.5,1l-0.3,0.5l-0.3," + - "0.4l-3.9-2.8l0.3-0.4l0.2-0.3c0.1-0.2,0.3-0.4,0.4-0.7c0.3-0.5," + - "0.5-0.9,0.7-1.5c0.4-1,0.8-2.1,1.1-3.3l4.2,0.9C75.9,77.7,75.6," + - "79,75.1,80.4z M73,69.2l0.2-1.9l0.1-1.9c0.1-1.2,0.1-2.5,0.1-" + - "3.8l2.5-0.2c0.2,1.3,0.4,2.6,0.5,3.9l0.1,2l0.1,2L73,69.2z " + - "M73,51l0.5-0.1c0.4,1.3,0.8,2.6,1.1,3.9L73.2,55C73.1,53.7,73.1," + - "52.3,73,51z M91.9,20.4c-0.7,1.4-3.6,3.6-4.2,3.9c-1.5,0.8-5," + - "2.8-10.1,7.7c3,2.9,5.8,5.4,7.3,6.4c2.6,1.8,3.4,4.3,3.6,6.1c0.1," + - "1.1-0.1,2.5-0.4,3c-0.5,0.9-1.6,2-3,1.4c-2-0.8-11.5-9.6-13-11c" + - "-3.5,3.9-7.4,8.9-11.7,15.1c0,0-3.1,3.4-5.2,0.9C52.9,51.5,61," + - "39.3,61,39.3s2.2-3.1,5.6-7c-2.9-3-5.9-6.3-6.6-7.3c0,0-3.7-5-1.3" + - "-6.6c3.2-2.1,6.3,0.8,6.3,0.8s3.1,3.3,7,7.2c4.7-4.7,10.1-9.2," + - "14.7-10c0,0,3.3-1,5.2,1.7C92.5,18.8,92.4,19.6,91.9,20.4z", - - cycleLabels: "M72.5,33.9c0,0.6-0.2,1-0.5,1H40c-0.3,0-0.5-0.4" + - "-0.5-1V20.7c0-0.6,0.2-1,0.5-1h32c0.3,0,0.5,0.4,0.5,1V33.9z " + - "M41.2,61.8c0-0.6-0.2-1-0.5-1h-32c-0.3,0-0.5,0.4-0.5,1V75c0,0.6," + - "0.2,1,0.5,1h32c0.3,0,0.5-0.4,0.5-1V61.8z M101.8,61.8c0-0.6-0.2" + - "-1-0.5-1h-32c-0.3,0-0.5,0.4-0.5,1V75c0,0.6,0.2,1,0.5,1h32c0.3," + - "0,0.5-0.4,0.5-1V61.8z M17.2,52.9c0-0.1-0.3-7.1,4.6-13.6l-2.4-1.8" + - "c-5.4,7.3-5.2,15.2-5.1,15.5L17.2,52.9z M12.7,36.8l7.4,2.5l1.5," + - "7.6L29.5,31L12.7,36.8z M94.2,42.3c-2.1-8.9-8.3-13.7-8.6-13.9l" + - "-1.8,2.4c0.1,0,5.6,4.3,7.5,12.2L94.2,42.3z M99,37.8l-6.6,4.1l" + - "-6.8-3.7l7.1,16.2L99,37.8z M69,90.2l-1.2-2.8c-0.1,0-6.6,2.8" + - "-14.3,0.6l-0.8,2.9c2.5,0.7,4.9,1,7,1C65,91.8,68.7,90.2,69,90.2z " + - "M54.3,97.3L54,89.5l6.6-4.1l-17.6-1.7L54.3,97.3z", - - oblique: "M80.9,30.2h4.3l15-16.9H24.8l-15,16.9h19v48.5h-4l-15," + - "16.9h75.3l15-16.9H80.9V30.2z M78.6,78.7H56.1V30.2h22.5V78.7z" + - "M79.7,17.4c2.4,0,4.3,1.9,4.3,4.3c0,2.4-1.9,4.3-4.3,4.3s-4.3" + - "-1.9-4.3-4.3C75.4,19.3,77.4,17.4,79.7,17.4z M55,17.4c2.4,0," + - "4.3,1.9,4.3,4.3c0,2.4-1.9,4.3-4.3,4.3s-4.3-1.9-4.3-4.3C50.7," + - "19.3,52.6,17.4,55,17.4z M26.1,21.7c0-2.4,1.9-4.3,4.3-4.3c2.4," + - "0,4.3,1.9,4.3,4.3c0,2.4-1.9,4.3-4.3,4.3C28,26,26.1,24.1,26.1," + - "21.7z M31.1,30.2h22.6v48.5H31.1V30.2z M30.3,91.4c-2.4,0-4.3" + - "-1.9-4.3-4.3c0-2.4,1.9-4.3,4.3-4.3c2.4,0,4.3,1.9,4.3,4.3C34.6," + - "89.5,32.7,91.4,30.3,91.4z M54.9,91.4c-2.4,0-4.3-1.9-4.3-4.3c0" + - "-2.4,1.9-4.3,4.3-4.3c2.4,0,4.3,1.9,4.3,4.3C59.2,89.5,57.3," + - "91.4,54.9,91.4z M84,87.1c0,2.4-1.9,4.3-4.3,4.3c-2.4,0-4.3-1.9" + - "-4.3-4.3c0-2.4,1.9-4.3,4.3-4.3C82.1,82.8,84,84.7,84,87.1z", - - filters: "M24.8,13.3L9.8,40.5h75.3l15.0-27.2H24.8z M72.8,32.1l-" + - "9.7-8.9l-19.3,8.9l-6.0-7.4L24.1,30.9l-1.2-2.7l15.7-7.1l6.0,7.4" + - "l19.0-8.8l9.7,8.8l11.5-5.6l1.3,2.7L72.8,32.1zM24.3,68.3L9.3," + - "95.5h75.3l15.0-27.2H24.3z M84.3,85.9L70.7,79.8l-6.0,7.4l-19.3" + - "-8.9l-9.7,8.9l-13.3-6.5l1.3-2.7l11.5,5.6l9.7-8.8l19.0,8.8l6.0" + - "-7.4l15.7,7.1L84.3,85.9z M15.3,57h-6v-4h6V57zM88.1,57H76.0v-4h" + - "12.1V57z M69.9,57H57.8v-4h12.1V57z M51.7,57H39.6v-4H51.7V57z " + - "M33.5,57H21.4v-4h12.1V57zM100.2,57h-6v-4h6V57z", - - resetZoom: "M86,79.8L61.7,54.3c1.8-2.9,2.8-6.3,2.9-10c0.3-11.2" + - "-8.6-20.5-19.8-20.8C33.7,23.2,24.3,32,24.1,43.2c-0.3,11.2,8.6," + - "20.5,19.8,20.8c4,0.1,8.9-0.8,11.9-3.6l23.7,25c1.5,1.6,4,2.3," + - "5.3,1l1.6-1.6C87.7,83.7,87.5,81.4,86,79.8z M31.4,43.4c0.2-7.1," + - "6.1-12.8,13.2-12.6C51.8,31,57.5,37,57.3,44.1c-0.2,7.1-6.1,12.8" + - "-13.2,12.6C36.9,56.5,31.3,50.6,31.4,43.4zM22.6,104H6V86.4c0" + - "-1.7,1.4-3.1,3.1-3.1s3.1,1.4,3.1,3.1v11.4h10.4c1.7,0,3.1,1.4," + - "3.1,3.1S24.3,104,22.6,104z M25.7,9.1c0,1.7-1.4,3.1-3.1,3.1" + - "H12.2v11.4c0,1.7-1.4,3.1-3.1,3.1S6,25.3,6,23.6V6h16.6C24.3,6," + - "25.7,7.4,25.7,9.1z M84.3,100.9c0-1.7,1.4-3.1,3.1-3.1h10.4V86.4" + - "c0-1.7,1.4-3.1,3.1-3.1s3.1,1.4,3.1,3.1V104H87.4C85.7,104,84.3," + - "102.6,84.3,100.9z M87.4,6H104v17.6c0,1.7-1.4,3.1-3.1,3.1s-3.1" + - "-1.4-3.1-3.1V12.2H87.4c-1.7,0-3.1-1.4-3.1-3.1S85.7,6,87.4,6z", - - relatedIntents: "M99.9,43.7v22.6c0,1.9-1.5,3.4-3.4,3.4H73.9c" + - "-1.9,0-3.4-1.5-3.4-3.4V43.7c0-1.9,1.5-3.4,3.4-3.4h22.6C98.4," + - "40.3,99.9,41.8,99.9,43.7z M48.4,46.3l6.2,6.7h-4.6L38.5,38v9.7" + - "l4.7,5.3H10.1V57h33.2l-4.8,5.3v9.5L49.8,57h5.1v0l-6.5,7v11.5" + - "L64.1,55L48.4,34.4V46.3z", - - nextIntent: "M88.1,55.7L34.6,13.1c0,0-1.6-0.5-2.1-0.2c-1.9,1.2" + - "-6.5,13.8-3.1,17.2c7,6.9,30.6,24.5,32.4,25.9c-1.8,1.4-25.4,19" + - "-32.4,25.9c-3.4,3.4,1.2,16,3.1,17.2c0.6,0.4,2.1-0.2,2.1-0.2" + - "s53.1-42.4,53.5-42.7C88.5,56,88.1,55.7,88.1,55.7z", - - prevIntent: "M22.5,55.6L76,12.9c0,0,1.6-0.5,2.2-0.2c1.9,1.2," + - "6.5,13.8,3.1,17.2c-7,6.9-30.6,24.5-32.4,25.9c1.8,1.4,25.4,19," + - "32.4,25.9c3.4,3.4-1.2,16-3.1,17.2c-0.6,0.4-2.2-0.2-2.2-0.2" + - "S22.9,56.3,22.5,56C22.2,55.8,22.5,55.6,22.5,55.6z", - - intentTraffic: "M14.7,71.5h-6v-33h6V71.5z M88.5,38.5H76.9v33" + - "h11.7V38.5z M70.1,38.5H58.4v33h11.7V38.5z M51.6,38.5H39.9v33" + - "h11.7V38.5z M33.1,38.5H21.5v33h11.7V38.5z M101.3,38.5h-6v33h6" + - "V38.5z", - - allTraffic: "M15.7,64.5h-7v-19h7V64.5z M78.6,45.5H62.9v19h15.7" + - "V45.5z M47.1,45.5H31.4v19h15.7V45.5z M101.3,45.5h-7v19h7V45.5z" + - "M14.7,14.1h-6v19h6V14.1z M88.5,14.1H76.9v19h11.7V14.1z M70.1," + - "14.1H58.4v19h11.7V14.1z M51.6,14.1H39.9v19h11.7V14.1z M33.1,14.1" + - "H21.5v19h11.7V14.1z M101.3,14.1h-6v19h6V14.1z M14.7,76.9h-6v19" + - "h6V76.9z M88.5,76.9H76.9v19h11.7V76.9z M70.1,76.9H58.4v19h11.7" + - "V76.9z M51.6,76.9H39.9v19h11.7V76.9z M33.1,76.9H21.5v19h11.7" + - "V76.9z M101.3,76.9h-6v19h6V76.9z", - - flows: "M93.8,46.1c-4.3,0-8,3-9,7H67.9v-8.8c0-1.3-1.1-2.4-2.4" + - "-2.4h-8.1V25.3c4-1,7-4.7,7-9.1c0-5.2-4.2-9.4-9.4-9.4c-5.2,0" + - "-9.4,4.2-9.4,9.4c0,4.3,3,8,7,9v16.5H44c-1.3,0-2.4,1.1-2.4,2.4" + - "v8.8H25.3c-1-4.1-4.7-7.1-9.1-7.1c-5.2,0-9.4,4.2-9.4,9.4s4.2," + - "9.4,9.4,9.4c4.3,0,8-2.9,9-6.9h16.4v7.9c0,1.3,1.1,2.4,2.4,2.4" + - "h8.6v16.6c-4,1.1-6.9,4.7-6.9,9c0,5.2,4.2,9.4,9.4,9.4c5.2,0," + - "9.4-4.2,9.4-9.4c0-4.4-3-8-7.1-9.1V68.2h8.1c1.3,0,2.4-1.1,2.4" + - "-2.4v-7.9h16.8c1.1,4,4.7,7,9,7c5.2,0,9.4-4.2,9.4-9.4S99,46.1," + - "93.8,46.1z M48.7,16.3c0-3.5,2.9-6.4,6.4-6.4c3.5,0,6.4,2.9,6.4," + - "6.4s-2.9,6.4-6.4,6.4C51.5,22.6,48.7,19.8,48.7,16.3zM16.2,61.7c" + - "-3.5,0-6.4-2.9-6.4-6.4c0-3.5,2.9-6.4,6.4-6.4s6.4,2.9,6.4,6.4" + - "C22.6,58.9,19.7,61.7,16.2,61.7z M61.4,93.7c0,3.5-2.9,6.4-6.4," + - "6.4c-3.5,0-6.4-2.9-6.4-6.4c0-3.5,2.9-6.4,6.4-6.4C58.6,87.4," + - "61.4,90.2,61.4,93.7z M93.8,61.8c-3.5,0-6.4-2.9-6.4-6.4c0-3.5," + - "2.9-6.4,6.4-6.4s6.4,2.9,6.4,6.4C100.1,58.9,97.3,61.8,93.8,61.8z", - - eqMaster: "M100.1,46.9l-10.8-25h0.2c0.5,0,0.8-0.5,0.8-1.1v-3.2" + - "c0-0.6-0.4-1.1-0.8-1.1H59.2v-5.1c0-0.5-0.8-1-1.7-1h-5.1c-0.9,0" + - "-1.7,0.4-1.7,1v5.1l-30.2,0c-0.5,0-0.8,0.5-0.8,1.1v3.2c0,0.6," + - "0.4,1.1,0.8,1.1h0.1l-10.8,25C9,47.3,8.4,48,8.4,48.8v1.6l0,0h0" + - "v6.4c0,1.3,1.4,2.3,3.2,2.3h21.7c1.8,0,3.2-1,3.2-2.3v-8c0-0.9" + - "-0.7-1.6-1.7-2L22.9,21.9h27.9v59.6l-29,15.9c0,1.2,1.8,2.2,4.1," + - "2.2h58.3c2.3,0,4.1-1,4.1-2.2l-29-15.9V21.9h27.8L75.2,46.8c-1," + - "0.4-1.7,1.1-1.7,2v8c0,1.3,1.4,2.3,3.2,2.3h21.7c1.8,0,3.2-1,3.2" + - "-2.3v-8C101.6,48,101,47.3,100.1,46.9z M22,23.7l10.8,22.8H12.1" + - "L22,23.7z M97.9,46.5H77.2L88,23.7L97.9,46.5z" - }, - - badgeDataSet = { - _viewbox: "0 0 10 10", - - uiAttached: "M2,2.5a.5,.5,0,0,1,.5-.5h5a.5,.5,0,0,1,.5,.5v3" + - "a.5,.5,0,0,1-.5,.5h-5a.5,.5,0,0,1-.5-.5zM2.5,2.8a.3,.3,0,0,1," + - ".3-.3h4.4a.3,.3,0,0,1,.3,.3v2.4a.3,.3,0,0,1-.3,.3h-4.4" + - "a.3,.3,0,0,1-.3-.3zM2,6.55h6l1,1.45h-8z", - - checkMark: "M2.6,4.5c0,0,0.7-0.4,1.2,0.3l1.0," + - "1.8c0,0,2.7-5.4,2.8-5.7c0,0,0.5-0.9,1.4-0.1c0," + - "0,0.5,0.5,0,1.3S6.8,7.3,5.6,9.2c0,0-0.4," + - "0.5-1.2,0.1S2.2,5.4,2.2,5.4S2.2,4.7,2.6,4.5z", - - xMark: "M9.0,7.2C8.2,6.9,7.4,6.1,6.7,5.2c0.4-0.5," + - "0.7-0.8,0.8-1.0C7.8,3.5,9.4,1.6,8.1,1.1" + - "C6.8,0.6,6.6,1.7,6.6,1.7C6.4,2.1,6.0,2.7,5.4," + - "3.4C4.9,2.5,4.5,1.9,4.5,1.9" + - "S3.8,0.2,2.9,0.7C1.9,1.1,2.3,2.3,2.3,2.3c0.3,1.1,0.8,2.1,1.4,2.9" + - "C2.5,6.4,1.3,7.4,1.3,7.4S0.8,7.8,0.8,8.1C0.9,8.3,0.9,9.6,2.4,9.1" + - "C3.1,8.8,4.1,7.9,5.1,7.0c1.3,1.3,2.5,1.9,2.5,1.9s0.5,0.5,1.4-0.2" + - "C9.8,7.9,9.0,7.2,9.0,7.2z", - - triangleUp: "M0.5,6.2c0,0,3.8-3.8,4.2-4.2C5,1.7,5.3,2,5.3,2l4.3," + - "4.3c0,0,0.4,0.4-0.1,0.4c-1.7,0-8.2,0-8.8,0C0,6.6,0.5,6.2,0.5,6.2z", - - triangleDown: "M9.5,4.2c0,0-3.8,3.8-4.2,4.2c-0.3,0.3-0.5,0-0.5," + - "0L0.5,4.2c0,0-0.4-0.4,0.1-0.4c1.7,0,8.2,0,8.8,0C10,3.8,9.5,4.2," + - "9.5,4.2z", - - plus: "M4,2h2v2h2v2h-2v2h-2v-2h-2v-2h2z", - - minus: "M2,4h6v2h-6z", - - play: "M2.5,2l5.5,3l-5.5,3z", - - stop: "M2.5,2.5h5v5h-5z" - }, - - spriteData = { - _cloud: '0 0 110 110', - cloud: "M37.6,79.5c-6.9,8.7-20.4,8.6-22.2-2.7" + - "M16.3,41.2c-0.8-13.9,19.4-19.2,23.5-7.8" + - "M38.9,30.9c5.1-9.4,15.1-8.5,16.9-1.3" + - "M54.4,32.9c4-12.9,14.8-9.6,18.6-3.8" + - "M95.8,58.5c10-4.1,11.7-17.8-0.9-19.8" + - "M18.1,76.4C5.6,80.3,3.8,66,13.8,61.5" + - "M16.2,62.4C2.1,58.4,3.5,36,16.8,36.6" + - "M93.6,74.7c10.2-2,10.7-14,5.8-18.3" + - "M71.1,79.3c11.2,7.6,24.6,6.4,22.1-11.7" + - "M36.4,76.8c3.4,13.3,35.4,11.6,36.1-1.4" + - "M70.4,31c11.8-10.4,26.2-5.2,24.7,10.1" - }; - - // ---------------------------------------------------------------------- - // === Constants - - var msgGS = 'GlyphService.', - rg = "registerGlyphs(): ", - rgs = "registerGlyphSet(): "; - - // ---------------------------------------------------------------------- - - function warn(msg) { - $log.warn(msgGS + msg); - } - - function addToMap(key, value, vbox, overwrite, dups) { - if (!overwrite && glyphs.get(key)) { - dups.push(key); - } else { - glyphs.set(key, {id: key, vb: vbox, d: value}); - } - } - - function reportDups(dups, which) { - var ok = (dups.length == 0), - msg = 'ID collision: '; - - if (!ok) { - dups.forEach(function (id) { - warn(which + msg + '"' + id + '"'); - }); - } - return ok; - } - - function reportMissVb(missing, which) { - var ok = (missing.length == 0), - msg = 'Missing viewbox property: '; - - if (!ok) { - missing.forEach(function (vbk) { - warn(which + msg + '"' + vbk + '"'); - }); - } - return ok; - } - - // ---------------------------------------------------------------------- - // === API functions === - - function clear() { - // start with a fresh map - glyphs = d3.map(); - } - - function init() { - registerGlyphs(birdData); - registerGlyphSet(glyphDataSet); - registerGlyphSet(badgeDataSet); - registerGlyphs(spriteData); - } - - function registerGlyphs(data, overwrite) { - var dups = [], - missvb = []; - - angular.forEach(data, function (value, key) { - var vbk = '_' + key, - vb = data[vbk]; - - if (key[0] !== '_') { - if (!vb) { - missvb.push(vbk); - return; - } - addToMap(key, value, vb, overwrite, dups); - } - }); - return reportDups(dups, rg) && reportMissVb(missvb, rg); - } - - function registerGlyphSet(data, overwrite) { - var dups = [], - vb = data._viewbox; - - if (!vb) { - warn(rgs + 'no "_viewbox" property found'); - return false; - } - - angular.forEach(data, function (value, key) { - if (key[0] !== '_') { - addToMap(key, value, vb, overwrite, dups); - } - }); - return reportDups(dups, rgs); - } - - function ids() { - return glyphs.keys(); - } - - function glyph(id) { - return glyphs.get(id); - } - - function glyphDefined(id) { - return glyphs.has(id); - } - - // Note: defs should be a D3 selection of a single <defs> element - function loadDefs(defs, glyphIds, noClear) { - var list = fs.isA(glyphIds) || ids(), - clearCache = !noClear; - - if (clearCache) { - // remove all existing content - defs.html(null); - } - - // load up the requested glyphs - list.forEach(function (id) { - var g = glyph(id); - if (g) { - if (noClear) { - // quick exit if symbol is already present - if (defs.select('symbol#' + g.id).size() > 0) { - return; - } - } - defs.append('symbol') - .attr({ id: g.id, viewBox: g.vb }) - .append('path').attr('d', g.d); - } - }); - } - - // trans can specify translation [x,y] - function addGlyph(elem, glyphId, size, overlay, trans) { - var sz = size || 40, - ovr = !!overlay, - xns = fs.isA(trans), - atr = { - width: sz, - height: sz, - 'class': 'glyph', - 'xlink:href': '#' + glyphId - }; - - if (xns) { - atr.transform = sus.translate(trans); - } - return elem.append('use').attr(atr).classed('overlay', ovr); - } - - // ---------------------------------------------------------------------- - - angular.module('onosSvg') - .factory('GlyphService', - ['$log', 'FnService', 'SvgUtilService', - - function (_$log_, _fs_, _sus_) { - $log = _$log_; - fs = _fs_; - sus = _sus_; - - return { - clear: clear, - init: init, - registerGlyphs: registerGlyphs, - registerGlyphSet: registerGlyphSet, - ids: ids, - glyph: glyph, - glyphDefined: glyphDefined, - loadDefs: loadDefs, - addGlyph: addGlyph - }; - }] - ) - .run(['$log', function ($log) { - $log.debug('Clearing glyph cache'); - clear(); - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/icon.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/icon.css deleted file mode 100644 index 6ade7c7e..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/icon.css +++ /dev/null @@ -1,92 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Icon Service -- CSS file - */ - -svg#IconLibDefs { - display: none; -} - -svg .svgIcon { - fill-rule: evenodd; -} - -svg.embeddedIcon g.icon { - fill: none; -} - -svg.embeddedIcon g.icon rect { - stroke: none; - fill: none; -} - -svg.embeddedIcon g.icon .glyph { - stroke: none; - fill: white; - fill-rule: evenodd; -} - - -/* Sortable table headers */ -.light div.tableColSort svg.embeddedIcon .icon .glyph { - fill: black; -} -.dark div.tableColSort svg.embeddedIcon .icon .glyph { - fill: #ccc; -} - - -/* color schemes for specific icon classes */ - -svg.embeddedIcon .icon.appInactive .glyph { - fill: none; -} - -.light svg.embeddedIcon .icon.active .glyph { - fill: green; -} -.dark svg.embeddedIcon .icon.active .glyph { - fill: #308C10; -} - - -.light table svg.embeddedIcon { - fill: #ccc; -} -.dark table svg.embeddedIcon { - fill: #222; -} -.light table svg.embeddedIcon .glyph { - fill: #333; -} -.dark table svg.embeddedIcon .glyph { - fill: #ccc; -} - -.light svg.embeddedIcon .icon.active .glyph { - fill: green; -} -.light svg.embeddedIcon .icon.inactive .glyph { - fill: darkred; -} -.dark svg.embeddedIcon .icon.active .glyph { - fill: #308C10; -} -.dark svg.embeddedIcon .icon.inactive .glyph { - fill: #AD2D2D; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/icon.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/icon.js deleted file mode 100644 index d6a517fc..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/icon.js +++ /dev/null @@ -1,274 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- SVG -- Icon Service - */ -(function () { - 'use strict'; - - var $log, fs, gs, sus; - - var vboxSize = 50, - cornerSize = vboxSize / 10, - viewBox = '0 0 ' + vboxSize + ' ' + vboxSize; - - // Maps icon ID to the glyph ID it uses. - // NOTE: icon ID maps to a CSS class for styling that icon - var glyphMapping = { - active: 'checkMark', - inactive: 'xMark', - - plus: 'plus', - minus: 'minus', - play: 'play', - stop: 'stop', - - topo: 'topo', - - refresh: 'refresh', - garbage: 'garbage', - - upArrow: 'triangleUp', - downArrow: 'triangleDown', - - loading: 'loading', - - appInactive: 'unknown', - - devIcon_SWITCH: 'switch', - devIcon_ROADM: 'roadm', - deviceTable: 'switch', - flowTable: 'flowTable', - portTable: 'portTable', - groupTable: 'groupTable', - - hostIcon_endstation: 'endstation', - hostIcon_router: 'router', - hostIcon_bgpSpeaker: 'bgpSpeaker', - - nav_apps: 'bird', - nav_settings: 'chain', - nav_cluster: 'node', - nav_topo: 'topo', - nav_devs: 'switch', - nav_links: 'ports', - nav_hosts: 'endstation', - nav_intents: 'relatedIntents', - nav_processors: 'allTraffic' - }; - - function ensureIconLibDefs() { - var body = d3.select('body'), - svg = body.select('svg#IconLibDefs'), - defs; - - if (svg.empty()) { - svg = body.append('svg').attr('id', 'IconLibDefs'); - defs = svg.append('defs'); - } - return svg.select('defs'); - } - - // div is a D3 selection of the <DIV> element into which icon should load - // glyphId identifies the glyph to use - // size is dimension of icon in pixels. Defaults to 20. - // installGlyph, if truthy, will cause the glyph to be added to - // well-known defs element. Defaults to false. - // svgClass is the CSS class used to identify the SVG layer. - // Defaults to 'embeddedIcon'. - function loadIcon(div, glyphId, size, installGlyph, svgClass) { - var dim = size || 20, - svgCls = svgClass || 'embeddedIcon', - gid = glyphId || 'unknown', - svg, g; - - if (installGlyph) { - gs.loadDefs(ensureIconLibDefs(), [gid], true); - } - - svg = div.append('svg').attr({ - 'class': svgCls, - width: dim, - height: dim, - viewBox: viewBox - }); - - g = svg.append('g').attr({ - 'class': 'icon' - }); - - g.append('rect').attr({ - width: vboxSize, - height: vboxSize, - rx: cornerSize - }); - - g.append('use').attr({ - width: vboxSize, - height: vboxSize, - 'class': 'glyph', - 'xlink:href': '#' + gid - }); - } - - // div is a D3 selection of the <DIV> element into which icon should load - // iconCls is the CSS class used to identify the icon - // size is dimension of icon in pixels. Defaults to 20. - // installGlyph, if truthy, will cause the glyph to be added to - // well-known defs element. Defaults to false. - // svgClass is the CSS class used to identify the SVG layer. - // Defaults to 'embeddedIcon'. - function loadIconByClass(div, iconCls, size, installGlyph, svgClass) { - loadIcon(div, glyphMapping[iconCls], size, installGlyph, svgClass); - div.select('svg g').classed(iconCls, true); - } - - function loadEmbeddedIcon(div, iconCls, size) { - loadIconByClass(div, iconCls, size, true); - } - - - // configuration for device and host icons in the topology view - var config = { - device: { - dim: 36, - rx: 4 - }, - host: { - badge: { - dx: 14, - dy: -14 - }, - radius: { - noGlyph: 9, - withGlyph: 14 - }, - glyphed: { - endstation: 1, - bgpSpeaker: 1, - router: 1 - } - } - }; - - - // Adds a device icon to the specified element, using the given glyph. - // Returns the D3 selection of the icon. - function addDeviceIcon(elem, glyphId) { - var cfg = config.device, - gid = gs.glyphDefined(glyphId) ? glyphId : 'query', - g = elem.append('g') - .attr('class', 'svgIcon deviceIcon'); - - g.append('rect').attr({ - x: 0, - y: 0, - rx: cfg.rx, - width: cfg.dim, - height: cfg.dim - }); - - g.append('use').attr({ - 'xlink:href': '#' + gid, - width: cfg.dim, - height: cfg.dim - }); - - g.dim = cfg.dim; - return g; - } - - function addHostIcon(elem, radius, glyphId) { - var dim = radius * 1.5, - xlate = -dim / 2, - g = elem.append('g') - .attr('class', 'svgIcon hostIcon'); - - g.append('circle').attr('r', radius); - - g.append('use').attr({ - 'xlink:href': '#' + glyphId, - width: dim, - height: dim, - transform: sus.translate(xlate,xlate) - }); - return g; - } - - function sortIcons() { - function sortAsc(div) { - div.style('display', 'inline-block'); - loadEmbeddedIcon(div, 'upArrow', 10); - div.classed('tableColSort', true); - } - - function sortDesc(div) { - div.style('display', 'inline-block'); - loadEmbeddedIcon(div, 'downArrow', 10); - div.classed('tableColSort', true); - } - - function sortNone(div) { - div.remove(); - } - - return { - sortAsc: sortAsc, - sortDesc: sortDesc, - sortNone: sortNone - }; - } - - - // ========================= - // === DEFINE THE MODULE - - angular.module('onosSvg') - .directive('icon', ['IconService', function (is) { - return { - restrict: 'A', - link: function (scope, element, attrs) { - attrs.$observe('iconId', function () { - var div = d3.select(element[0]); - div.selectAll('*').remove(); - is.loadEmbeddedIcon(div, attrs.iconId, attrs.iconSize); - }); - } - }; - }]) - - .factory('IconService', ['$log', 'FnService', 'GlyphService', - 'SvgUtilService', - - function (_$log_, _fs_, _gs_, _sus_) { - $log = _$log_; - fs = _fs_; - gs = _gs_; - sus = _sus_; - - return { - loadIcon: loadIcon, - loadIconByClass: loadIconByClass, - loadEmbeddedIcon: loadEmbeddedIcon, - addDeviceIcon: addDeviceIcon, - addHostIcon: addHostIcon, - iconConfig: function () { return config; }, - sortIcons: sortIcons - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/map.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/map.js deleted file mode 100644 index f8d40f9c..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/map.js +++ /dev/null @@ -1,129 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- SVG -- Map Service - */ - -/* - The Map Service provides a simple API for loading geographical maps into - an SVG layer. For example, as a background to the Topology View. - - e.g. var promise = MapService.loadMapInto(svgLayer, '*continental-us'); - - The Map Service makes use of the GeoDataService to load the required data - from the server and to create the appropriate geographical projection. - - A promise is returned to the caller, which is resolved with the - map projection once created. -*/ - -(function () { - 'use strict'; - - // injected references - var $log, $q, fs, gds; - - // NOTE: This method assumes the datafile has exactly the map data - // that you want to load; for example id="*continental_us" - // mapping to ~/data/map/continental_us.topojson contains - // exactly the paths for the continental US. - - function loadMapInto(mapLayer, id, opts) { - var promise = gds.fetchTopoData(id), - deferredProjection = $q.defer(); - - if (!promise) { - $log.warn('Failed to load map: ' + id); - return false; - } - - promise.then(function () { - var gen = gds.createPathGenerator(promise.topodata, opts); - - deferredProjection.resolve(gen.settings.projection); - - mapLayer.selectAll('path') - .data(gen.geodata.features) - .enter() - .append('path') - .attr('d', gen.pathgen); - }); - return deferredProjection.promise; - } - - // --- - - // NOTE: This method uses the countries.topojson data file, and then - // filters the results based on the supplied options. - // Usage: - // promise = loadMapRegionInto(svgGroup, { - // countryFilter: function (country) { - // return country.properties.continent === 'South America'; - // } - // }); - - function loadMapRegionInto(mapLayer, filterOpts) { - var promise = gds.fetchTopoData("*countries"), - deferredProjection = $q.defer(); - - if (!promise) { - $log.warn('Failed to load countries TopoJSON data'); - return false; - } - - promise.then(function () { - var width = 1000, - height = 1000, - proj = d3.geo.mercator().translate([width/2, height/2]), - pathGen = d3.geo.path().projection(proj), - data = promise.topodata, - features = topojson.feature(data, data.objects.countries).features, - country = features.filter(filterOpts.countryFilter), - countryFeature = { - type: 'FeatureCollection', - features: country - }, - path = d3.geo.path().projection(proj); - - gds.rescaleProjection(proj, 0.95, 1000, path, countryFeature); - - deferredProjection.resolve(proj); - - mapLayer.selectAll('path.country') - .data([countryFeature]) - .enter() - .append('path').classed('country', true) - .attr('d', pathGen); - }); - return deferredProjection.promise; - } - - angular.module('onosSvg') - .factory('MapService', ['$log', '$q', 'FnService', 'GeoDataService', - function (_$log_, _$q_, _fs_, _gds_) { - $log = _$log_; - $q = _$q_; - fs = _fs_; - gds = _gds_; - - return { - loadMapRegionInto: loadMapRegionInto, - loadMapInto: loadMapInto - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/svg.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/svg.js deleted file mode 100644 index 8fd441fe..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/svg.js +++ /dev/null @@ -1,25 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Scalable Vector Graphics Module - */ -(function () { - 'use strict'; - - angular.module('onosSvg', ['onosUtil']); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/svgUtil.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/svgUtil.js deleted file mode 100644 index cb67ae83..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/svgUtil.js +++ /dev/null @@ -1,311 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- SVG -- Util Service - */ - -/* - The SVG Util Service provides a miscellany of utility functions. - */ - -(function () { - 'use strict'; - - // injected references - var $log, fs; - - angular.module('onosSvg') - .factory('SvgUtilService', ['$log', 'FnService', - function (_$log_, _fs_) { - $log = _$log_; - fs = _fs_; - - // TODO: change 'force' ref to be 'force.alpha' ref. - function createDragBehavior(force, selectCb, atDragEnd, - dragEnabled, clickEnabled) { - var draggedThreshold = d3.scale.linear() - .domain([0, 0.1]) - .range([5, 20]) - .clamp(true), - drag, - fSel = fs.isF(selectCb), - fEnd = fs.isF(atDragEnd), - fDEn = fs.isF(dragEnabled), - fCEn = fs.isF(clickEnabled), - bad = []; - - function naf(what) { - return 'SvgUtilService: createDragBehavior(): ' + what + - ' is not a function'; - } - - if (!force) { - bad.push('SvgUtilService: createDragBehavior(): ' + - 'Bad force reference'); - } - if (!fSel) { - bad.push(naf('selectCb')); - } - if (!fEnd) { - bad.push(naf('atDragEnd')); - } - if (!fDEn) { - bad.push(naf('dragEnabled')); - } - if (!fCEn) { - bad.push(naf('clickEnabled')); - } - - if (bad.length) { - $log.error(bad.join('\n')); - return null; - } - - function dragged(d) { - var threshold = draggedThreshold(force.alpha()), - dx = d.oldX - d.px, - dy = d.oldY - d.py; - if (Math.abs(dx) >= threshold || Math.abs(dy) >= threshold) { - d.dragged = true; - } - return d.dragged; - } - - drag = d3.behavior.drag() - .origin(function(d) { return d; }) - .on('dragstart', function(d) { - if (clickEnabled() || dragEnabled()) { - d3.event.sourceEvent.stopPropagation(); - - d.oldX = d.x; - d.oldY = d.y; - d.dragged = false; - d.fixed |= 2; - d.dragStarted = true; - } - }) - .on('drag', function(d) { - if (dragEnabled()) { - d.px = d3.event.x; - d.py = d3.event.y; - if (dragged(d)) { - if (!force.alpha()) { - force.alpha(.025); - } - } - } - }) - .on('dragend', function(d) { - if (d.dragStarted) { - d.dragStarted = false; - if (!dragged(d)) { - // consider this the same as a 'click' - // (selection of a node) - if (clickEnabled()) { - selectCb.call(this, d); - } - } - d.fixed &= ~6; - - // hook at the end of a drag gesture - if (dragEnabled()) { - atDragEnd.call(this, d); - } - } - }); - - return drag; - } - - - function loadGlow(defs, r, g, b, id) { - var glow = defs.append('filter') - .attr('x', '-50%') - .attr('y', '-50%') - .attr('width', '200%') - .attr('height', '200%') - .attr('id', id); - - glow.append('feColorMatrix') - .attr('type', 'matrix') - .attr('values', - '0 0 0 0 ' + r + ' ' + - '0 0 0 0 ' + g + ' ' + - '0 0 0 0 ' + b + ' ' + - '0 0 0 1 0 '); - - glow.append('feGaussianBlur') - .attr('stdDeviation', 3) - .attr('result', 'coloredBlur'); - - glow.append('feMerge').selectAll('feMergeNode') - .data(['coloredBlur', 'SourceGraphic']) - .enter().append('feMergeNode') - .attr('in', String); - } - - function loadGlowDefs(defs) { - loadGlow(defs, 0.0, 0.0, 0.7, 'blue-glow'); - loadGlow(defs, 1.0, 1.0, 0.3, 'yellow-glow'); - } - - // --- Ordinal scales for 7 values. - - // blue brown brick red sea green purple dark teal lime - var lightNorm = ['#3E5780', '#78533B', '#CB4D28', '#018D61', '#8A2979', '#006D73', '#56AF00'], - lightMute = ['#A8B8CC', '#CCB3A8', '#FFC2BD', '#96D6BF', '#D19FCE', '#8FCCCA', '#CAEAA4'], - - darkNorm = ['#304860', '#664631', '#A8391B', '#00754B', '#77206D', '#005959', '#428700'], - darkMute = ['#304860', '#664631', '#A8391B', '#00754B', '#77206D', '#005959', '#428700']; - - var colors= { - light: { - norm: d3.scale.ordinal().range(lightNorm), - mute: d3.scale.ordinal().range(lightMute) - }, - dark: { - norm: d3.scale.ordinal().range(darkNorm), - mute: d3.scale.ordinal().range(darkMute) - } - }; - - function cat7() { - var tcid = 'd3utilTestCard'; - - function getColor(id, muted, theme) { - // NOTE: since we are lazily assigning domain ids, we need to - // get the color from all 4 scales, to keep the domains - // in sync. - var ln = colors.light.norm(id), - lm = colors.light.mute(id), - dn = colors.dark.norm(id), - dm = colors.dark.mute(id); - if (theme === 'dark') { - return muted ? dm : dn; - } else { - return muted ? lm : ln; - } - } - - function testCard(svg) { - var g = svg.select('g#' + tcid), - dom = d3.range(7), - k, muted, theme, what; - - if (!g.empty()) { - g.remove(); - - } else { - g = svg.append('g') - .attr('id', tcid) - .attr('transform', 'scale(4)translate(20,20)'); - - for (k=0; k<4; k++) { - muted = k%2; - what = muted ? ' muted' : ' normal'; - theme = k < 2 ? 'light' : 'dark'; - dom.forEach(function (id, i) { - var x = i * 20, - y = k * 20, - f = get(id, muted, theme); - g.append('circle').attr({ - cx: x, - cy: y, - r: 5, - fill: f - }); - }); - g.append('rect').attr({ - x: 140, - y: k * 20 - 5, - width: 32, - height: 10, - rx: 2, - fill: '#888' - }); - g.append('text').text(theme + what) - .attr({ - x: 142, - y: k * 20 + 2, - fill: 'white' - }) - .style('font-size', '4pt'); - } - } - } - - return { - testCard: testCard, - getColor: getColor - }; - } - - function translate(x, y) { - if (fs.isA(x) && x.length === 2 && !y) { - return 'translate(' + x[0] + ',' + x[1] + ')'; - } - return 'translate(' + x + ',' + y + ')'; - } - - function scale(x, y) { - return 'scale(' + x + ',' + y + ')'; - } - - function skewX(x) { - return 'skewX(' + x + ')'; - } - - function rotate(deg) { - return 'rotate(' + deg + ')'; - } - - function stripPx(s) { - return s.replace(/px$/,''); - } - - function safeId(s) { - return s.replace(/[^a-z0-9]/gi, '-'); - } - - function makeVisible(el, b) { - el.style('visibility', (b ? 'visible' : 'hidden')); - } - - function isVisible(el) { - return el.style('visibility') === 'visible'; - } - - return { - createDragBehavior: createDragBehavior, - loadGlowDefs: loadGlowDefs, - cat7: cat7, - translate: translate, - scale: scale, - skewX: skewX, - rotate: rotate, - stripPx: stripPx, - safeId: safeId, - visible: function (el, x) { - if (x === undefined) { - return isVisible(el); - } else { - makeVisible(el, x); - } - } - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/zoom.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/zoom.js deleted file mode 100644 index 6acab794..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/zoom.js +++ /dev/null @@ -1,132 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- SVG -- Zoom Service - */ -(function () { - 'use strict'; - - // configuration - var defaultSettings = { - zoomMin: 0.05, - zoomMax: 10, - zoomEnabled: function (ev) { return true; }, - zoomCallback: function () {} - }; - - // injected references to services - var $log; - - angular.module('onosSvg') - .factory('ZoomService', ['$log', - - function (_$log_) { - $log = _$log_; - -/* - NOTE: opts is an object: - { - svg: svg, D3 selection of <svg> element - zoomLayer: zoomLayer, D3 selection of <g> element - zoomEnabled: function (ev) { ... }, - zoomCallback: function () { ... } - } - - where: - * svg and zoomLayer should be D3 selections of DOM elements. - * zoomLayer <g> is a child of <svg> element. - * zoomEnabled is an optional predicate based on D3 event. - * default is always enabled. - * zoomCallback is an optional callback invoked each time we pan/zoom. - * default is do nothing. - - Optionally, zoomMin and zoomMax also can be defined. - These default to 0.25 and 10 respectively. -*/ - function createZoomer(opts) { - var cz = 'ZoomService.createZoomer(): ', - d3s = ' (D3 selection) property defined', - settings = angular.extend({}, defaultSettings, opts), - zoom = d3.behavior.zoom() - .translate([0, 0]) - .scale(1) - .scaleExtent([settings.zoomMin, settings.zoomMax]) - .on('zoom', zoomed), - fail = false, - zoomer; - - if (!settings.svg) { - $log.error(cz + 'No "svg" (svg tag)' + d3s); - fail = true; - } - if (!settings.zoomLayer) { - $log.error(cz + 'No "zoomLayer" (g tag)' + d3s); - fail = true; - } - - if (fail) { - return null; - } - - // zoom events from mouse gestures... - function zoomed() { - var ev = d3.event.sourceEvent; - if (settings.zoomEnabled(ev)) { - adjustZoomLayer(d3.event.translate, d3.event.scale); - } - } - - function adjustZoomLayer(translate, scale) { - settings.zoomLayer.attr('transform', - 'translate(' + translate + ')scale(' + scale + ')'); - settings.zoomCallback(); - } - - zoomer = { - panZoom: function (translate, scale) { - zoom.translate(translate).scale(scale); - adjustZoomLayer(translate, scale); - }, - - reset: function () { - zoomer.panZoom([0,0], 1); - }, - - translate: function () { - return zoom.translate(); - }, - - scale: function () { - return zoom.scale(); - }, - - scaleExtent: function () { - return zoom.scaleExtent(); - } - }; - - // apply the zoom behavior to the SVG element - settings.svg && settings.svg.call(zoom); - return zoomer; - } - - return { - createZoomer: createZoomer - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/fn.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/util/fn.js deleted file mode 100644 index defb8458..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/fn.js +++ /dev/null @@ -1,292 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Util -- General Purpose Functions - */ -(function () { - 'use strict'; - - // injected services - var $window, $log; - - // internal state - var debugFlags = {}; - - - function _parseDebugFlags(dbgstr) { - var bits = dbgstr ? dbgstr.split(",") : []; - bits.forEach(function (key) { - debugFlags[key] = true; - }); - $log.debug('Debug flags:', dbgstr); - } - - function isF(f) { - return typeof f === 'function' ? f : null; - } - - function isA(a) { - // NOTE: Array.isArray() is part of EMCAScript 5.1 - return Array.isArray(a) ? a : null; - } - - function isS(s) { - return typeof s === 'string' ? s : null; - } - - function isO(o) { - return (o && typeof o === 'object' && o.constructor === Object) ? o : null; - } - - function contains(a, x) { - return isA(a) && a.indexOf(x) > -1; - } - - // Returns true if all names in the array are defined as functions - // on the given api object; false otherwise. - // Also returns false if there are properties on the api that are NOT - // listed in the array of names. - function areFunctions(api, fnNames) { - var fnLookup = {}, - extraFound = false; - - if (!isA(fnNames)) { - return false; - } - var n = fnNames.length, - i, name; - for (i=0; i<n; i++) { - name = fnNames[i]; - if (!isF(api[name])) { - return false; - } - fnLookup[name] = true; - } - - // check for properties on the API that are not listed in the array, - angular.forEach(api, function (value, key) { - if (!fnLookup[key]) { - extraFound = true; - } - }); - return !extraFound; - } - - // Returns true if all names in the array are defined as functions - // on the given api object; false otherwise. This is a non-strict version - // that does not care about other properties on the api. - function areFunctionsNonStrict(api, fnNames) { - if (!isA(fnNames)) { - return false; - } - var n = fnNames.length, - i, name; - for (i=0; i<n; i++) { - name = fnNames[i]; - if (!isF(api[name])) { - return false; - } - } - return true; - } - - // Returns width and height of window inner dimensions. - // offH, offW : offset width/height are subtracted, if present - function windowSize(offH, offW) { - var oh = offH || 0, - ow = offW || 0; - return { - height: $window.innerHeight - oh, - width: $window.innerWidth - ow - }; - } - - // Returns true if current browser determined to be a mobile device - function isMobile() { - var ua = $window.navigator.userAgent, - patt = /iPhone|iPod|iPad|Silk|Android|BlackBerry|Opera Mini|IEMobile/; - return patt.test(ua); - } - - // Returns true if the current browser determined to be Chrome - function isChrome() { - var isChromium = $window.chrome, - vendorName = $window.navigator.vendor, - isOpera = $window.navigator.userAgent.indexOf("OPR") > -1; - return (isChromium !== null && - isChromium !== undefined && - vendorName === "Google Inc." && - isOpera == false); - } - - // Returns true if the current browser determined to be Safari - function isSafari() { - return ($window.navigator.userAgent.indexOf('Safari') !== -1 && - $window.navigator.userAgent.indexOf('Chrome') === -1); - } - - // Returns true if the current browser determined to be Firefox - function isFirefox() { - return typeof InstallTrigger !== 'undefined'; - } - - // search through an array of objects, looking for the one with the - // tagged property matching the given key. tag defaults to 'id'. - // returns the index of the matching object, or -1 for no match. - function find(key, array, tag) { - var _tag = tag || 'id', - idx, n, d; - for (idx = 0, n = array.length; idx < n; idx++) { - d = array[idx]; - if (d[_tag] === key) { - return idx; - } - } - return -1; - } - - // search through array to find (the first occurrence of) item, - // returning its index if found; otherwise returning -1. - function inArray(item, array) { - var i; - if (isA(array)) { - for (i=0; i<array.length; i++) { - if (array[i] === item) { - return i; - } - } - } - return -1; - } - - // remove (the first occurrence of) the specified item from the given - // array, if any. Return true if the removal was made; false otherwise. - function removeFromArray(item, array) { - var found = false, - i = inArray(item, array); - if (i >= 0) { - array.splice(i, 1); - found = true; - } - return found; - } - - // return true if the object is empty, return false otherwise - function isEmptyObject(obj) { - var key; - for (key in obj) { - return false; - } - return true; - } - - // returns true if the two objects have all the same properties - function sameObjProps(obj1, obj2) { - var key; - for (key in obj1) { - if (obj1.hasOwnProperty(key)) { - if (!(obj1[key] === obj2[key])) { - return false; - } - } - } - return true; - } - - // returns true if the array contains the object - // does NOT use strict object reference equality, - // instead checks each property individually for equality - function containsObj(arr, obj) { - var i, - len = arr.length; - for (i = 0; i < len; i++) { - if (sameObjProps(arr[i], obj)) { - return true; - } - } - return false; - } - - // return the given string with the first character capitalized. - function cap(s) { - return s.toLowerCase().replace(/^[a-z]/, function (m) { - return m.toUpperCase(); - }); - } - - // return the parameter without a px suffix - function noPx(num) { - return Number(num.replace(/px$/, '')); - } - - // return an element's given style property without px suffix - function noPxStyle(elem, prop) { - return Number(elem.style(prop).replace(/px$/, '')); - } - - function endsWith(str, suffix) { - return str.indexOf(suffix, str.length - suffix.length) !== -1; - } - - function parseBitRate(str) { - return Number(str.replace(/,/, '') - .replace(/\s+.bps/i, '') - .replace(/\.\d*/, '')); - } - - // return true if the given debug flag was specified in the query params - function debugOn(tag) { - return debugFlags[tag]; - } - - angular.module('onosUtil') - .factory('FnService', - ['$window', '$location', '$log', function (_$window_, $loc, _$log_) { - $window = _$window_; - $log = _$log_; - - _parseDebugFlags($loc.search().debug); - - return { - isF: isF, - isA: isA, - isS: isS, - isO: isO, - contains: contains, - areFunctions: areFunctions, - areFunctionsNonStrict: areFunctionsNonStrict, - windowSize: windowSize, - isMobile: isMobile, - isChrome: isChrome, - isSafari: isSafari, - isFirefox: isFirefox, - debugOn: debugOn, - find: find, - inArray: inArray, - removeFromArray: removeFromArray, - isEmptyObject: isEmptyObject, - sameObjProps: sameObjProps, - containsObj: containsObj, - cap: cap, - noPx: noPx, - noPxStyle: noPxStyle, - endsWith: endsWith, - parseBitRate: parseBitRate - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/keys.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/util/keys.js deleted file mode 100644 index 5ff4f7f4..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/keys.js +++ /dev/null @@ -1,243 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Util -- Key Handler Service - */ -(function () { - 'use strict'; - - // references to injected services - var $log, fs, ts, ns, qhs; - - // internal state - var enabled = true, - globalEnabled = true, - keyHandler = { - globalKeys: {}, - maskedKeys: {}, - viewKeys: {}, - viewFn: null, - viewGestures: [] - }; - - function whatKey(code) { - switch (code) { - case 13: return 'enter'; - case 16: return 'shift'; - case 17: return 'ctrl'; - case 18: return 'alt'; - case 27: return 'esc'; - case 32: return 'space'; - case 37: return 'leftArrow'; - case 38: return 'upArrow'; - case 39: return 'rightArrow'; - case 40: return 'downArrow'; - case 91: return 'cmdLeft'; - case 93: return 'cmdRight'; - case 187: return 'equals'; - case 188: return 'comma'; - case 189: return 'dash'; - case 190: return 'dot'; - case 191: return 'slash'; - case 192: return 'backQuote'; - case 220: return 'backSlash'; - default: - if ((code >= 48 && code <= 57) || - (code >= 65 && code <= 90)) { - return String.fromCharCode(code); - } else if (code >= 112 && code <= 123) { - return 'F' + (code - 111); - } - return '.'; - } - } - - function keyIn() { - var event = d3.event, - keyCode = event.keyCode, - key = whatKey(keyCode), - kh = keyHandler, - gk = kh.globalKeys[key], - gcb = fs.isF(gk) || (fs.isA(gk) && fs.isF(gk[0])), - vk = kh.viewKeys[key], - kl = fs.isF(kh.viewKeys._keyListener), - vcb = fs.isF(vk) || (fs.isA(vk) && fs.isF(vk[0])) || fs.isF(kh.viewFn), - token = 'keyev'; // indicate this was a key-pressed event - - d3.event.stopPropagation(); - - if (enabled) { - // global callback? - if (gcb && gcb(token, key, keyCode, event)) { - // if the event was 'handled', we are done - return; - } - // otherwise, let the view callback have a shot - if (vcb) { - vcb(token, key, keyCode, event); - } - if (kl) { - kl(key); - } - } - } - - function setupGlobalKeys() { - angular.extend(keyHandler, { - globalKeys: { - backSlash: [quickHelp, 'Show / hide Quick Help'], - slash: [quickHelp, 'Show / hide Quick Help'], - esc: [escapeKey, 'Dismiss dialog or cancel selections'], - T: [toggleTheme, "Toggle theme"] - }, - globalFormat: ['backSlash', 'slash', 'esc', 'T'], - - // Masked keys are global key handlers that always return true. - // That is, the view will never see the event for that key. - maskedKeys: { - slash: true, - backSlash: true, - T: true - } - }); - } - - function quickHelp(view, key, code, ev) { - if (!globalEnabled) { - return false; - } - qhs.showQuickHelp(keyHandler); - return true; - } - - // returns true if we 'consumed' the ESC keypress, false otherwise - function escapeKey(view, key, code, ev) { - return ns.hideIfShown() || qhs.hideQuickHelp(); - } - - function toggleTheme(view, key, code, ev) { - if (!globalEnabled) { - return false; - } - ts.toggleTheme(); - return true; - } - - function setKeyBindings(keyArg) { - var viewKeys, - masked = []; - - if (fs.isF(keyArg)) { - // set general key handler callback - keyHandler.viewFn = keyArg; - } else { - // set specific key filter map - viewKeys = d3.map(keyArg).keys(); - viewKeys.forEach(function (key) { - if (keyHandler.maskedKeys[key]) { - masked.push('setKeyBindings(): Key "' + key + '" is reserved'); - } - }); - - if (masked.length) { - $log.warn(masked.join('\n')); - } - keyHandler.viewKeys = keyArg; - } - } - - function getKeyBindings() { - var gkeys = d3.map(keyHandler.globalKeys).keys(), - masked = d3.map(keyHandler.maskedKeys).keys(), - vkeys = d3.map(keyHandler.viewKeys).keys(), - vfn = !!fs.isF(keyHandler.viewFn); - - return { - globalKeys: gkeys, - maskedKeys: masked, - viewKeys: vkeys, - viewFunction: vfn - }; - } - - function unbindKeys() { - keyHandler.viewKeys = {}; - keyHandler.viewFn = null; - keyHandler.viewGestures = []; - } - - function checkNotGlobal(o) { - var oops = []; - if (fs.isO(o)) { - angular.forEach(o, function (val, key) { - if (keyHandler.globalKeys[key]) { - oops.push(key); - } - }); - if (oops.length) { - $log.warn('Ignoring reserved global key(s):', oops.join(',')); - oops.forEach(function (key) { - delete o[key]; - }); - } - } - } - - angular.module('onosUtil') - .factory('KeyService', - ['$log', 'FnService', 'ThemeService', 'NavService', - - function (_$log_, _fs_, _ts_, _ns_) { - $log = _$log_; - fs = _fs_; - ts = _ts_; - ns = _ns_; - - return { - bindQhs: function (_qhs_) { - qhs = _qhs_; - }, - installOn: function (elem) { - elem.on('keydown', keyIn); - setupGlobalKeys(); - }, - keyBindings: function (x) { - if (x === undefined) { - return getKeyBindings(); - } else { - setKeyBindings(x); - } - }, - unbindKeys: unbindKeys, - gestureNotes: function (g) { - if (g === undefined) { - return keyHandler.viewGestures; - } else { - keyHandler.viewGestures = fs.isA(g) || []; - } - }, - enableKeys: function (b) { - enabled = b; - }, - enableGlobalKeys: function (b) { - globalEnabled = b; - }, - checkNotGlobal: checkNotGlobal - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/prefs.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/util/prefs.js deleted file mode 100644 index 02a23909..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/prefs.js +++ /dev/null @@ -1,128 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Util -- User Preference Service - */ -(function () { - 'use strict'; - - // injected refs - var $log, $cookies, fs; - - // internal state - var cache = {}; - - // NOTE: in Angular 1.3.5, $cookies is just a simple object, and - // cookie values are just strings. From the 1.3.5 docs: - // - // "Only a simple Object is exposed and by adding or removing - // properties to/from this object, new cookies are created/deleted - // at the end of current $eval. The object's properties can only - // be strings." - // - // We may want to upgrade the version of Angular sometime soon - // since later version support objects as cookie values. - - // NOTE: prefs represented as simple name/value pairs - // => a temporary restriction while we are encoding into cookies - /* - { - foo: 1, - bar: 0, - goo: 2 - } - - stored as "foo:1,bar:0,goo:2" - */ - - // reads cookie with given name and returns an object rep of its value - // or null if no such cookie is set - function getPrefs(name) { - var cook = $cookies[name], - bits, - obj = {}; - - if (cook) { - bits = cook.split(','); - bits.forEach(function (value) { - var x = value.split(':'); - obj[x[0]] = x[1]; - }); - - // update the cache - cache[name] = obj; - return obj; - } - // perhaps we have a cached copy.. - return cache[name]; - } - - // converts string values to numbers for selected (or all) keys - function asNumbers(obj, keys) { - if (!obj) return null; - - if (!keys) { - // do them all - angular.forEach(obj, function (v, k) { - obj[k] = Number(obj[k]); - }); - } else { - keys.forEach(function (k) { - obj[k] = Number(obj[k]); - }); - } - return obj; - } - - function setPrefs(name, obj) { - var bits = [], - str; - - angular.forEach(obj, function (value, key) { - bits.push(key + ':' + value); - }); - str = bits.join(','); - - // keep a cached copy of the object - cache[name] = obj; - - // The angular way of doing this... - // $cookies[name] = str; - // ...but it appears that this gets delayed, and doesn't 'stick' ?? - - // FORCE cookie to be set by writing directly to document.cookie... - document.cookie = name + '=' + encodeURIComponent(str); - if (fs.debugOn('prefs')) { - $log.debug('<<>> Wrote cookie <'+name+'>:', str); - } - } - - angular.module('onosUtil') - .factory('PrefsService', ['$log', '$cookies', 'FnService', - function (_$log_, _$cookies_, _fs_) { - $log = _$log_; - $cookies = _$cookies_; - fs = _fs_; - - return { - getPrefs: getPrefs, - asNumbers: asNumbers, - setPrefs: setPrefs - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/random.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/util/random.js deleted file mode 100644 index 2298a944..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/random.js +++ /dev/null @@ -1,51 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Random -- Encapsulated randomness - */ -(function () { - 'use strict'; - - var $log, fs; - - var halfRoot2 = 0.7071; - - // given some value, s, returns an integer between -s/2 and s/2 - // e.g. s = 100; result in the range [-50..50) - function spread(s) { - return Math.floor((Math.random() * s) - s / 2); - } - - // for a given dimension, d, choose a random value somewhere between - // 0 and d where the value is within (d / (2 * sqrt(2))) of d/2. - function randDim(d) { - return d / 2 + spread(d * halfRoot2); - } - - angular.module('onosUtil') - .factory('RandomService', ['$log', 'FnService', - - function (_$log_, _fs_) { - $log = _$log_; - fs = _fs_; - - return { - spread: spread, - randDim: randDim - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/theme.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/util/theme.js deleted file mode 100644 index 0e0ee649..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/theme.js +++ /dev/null @@ -1,121 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Util -- Theme Service - */ -(function () { - 'use strict'; - - var $log, fs; - - var themes = ['light', 'dark'], - themeStr = themes.join(' '), - thidx, - listeners = {}, - nextListenerId = 1; - - function init() { - thidx = 0; - updateBodyClass(); - } - - function getTheme() { - return themes[thidx]; - } - - function setTheme(t) { - var idx = themes.indexOf(t); - if (idx > -1 && idx !== thidx) { - thidx = idx; - updateBodyClass(); - themeEvent('set'); - } - } - - function toggleTheme() { - var i = thidx + 1; - thidx = (i===themes.length) ? 0 : i; - updateBodyClass(); - themeEvent('toggle'); - return getTheme(); - } - - function updateBodyClass() { - var body = d3.select('body'); - body.classed(themeStr, false); - body.classed(getTheme(), true); - } - - function themeEvent(w) { - var t = getTheme(), - m = 'Theme-Change-('+w+'): ' + t; - $log.debug(m); - angular.forEach(listeners, function(value) { - value.cb( - { - event: 'themeChange', - value: t - } - ); - }); - } - - function addListener(callback) { - var id = nextListenerId++, - cb = fs.isF(callback), - o = { id: id, cb: cb }; - - if (cb) { - listeners[id] = o; - } else { - $log.error('ThemeService.addListener(): callback not a function'); - o.error = 'No callback defined'; - } - return o; - } - - function removeListener(lsnr) { - var id = lsnr && lsnr.id, - o = listeners[id]; - if (o) { - delete listeners[id]; - } - } - - angular.module('onosUtil') - .factory('ThemeService', ['$log', 'FnService', - function (_$log_, _fs_) { - $log = _$log_; - fs = _fs_; - thidx = 0; - - return { - init: init, - theme: function (x) { - if (x === undefined) { - return getTheme(); - } else { - setTheme(x); - } - }, - toggleTheme: toggleTheme, - addListener: addListener, - removeListener: removeListener - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/util.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/util/util.js deleted file mode 100644 index dc3b09c2..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/util/util.js +++ /dev/null @@ -1,25 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Utilities Module - */ -(function () { - 'use strict'; - - angular.module('onosUtil', []); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/button.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/button.css deleted file mode 100644 index 9ae03595..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/button.css +++ /dev/null @@ -1,120 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Button Service -- CSS file - */ - -.button, -.toggleButton, -.radioSet { - display: inline-block; - padding: 0 4px; -} -.radioButton { - display: inline-block; - padding: 0 2px; -} - -.button svg.embeddedIcon, -.toggleButton svg.embeddedIcon, -.radioButton svg.embeddedIcon { - cursor: pointer; -} -.button svg.embeddedIcon .icon rect, -.toggleButton svg.embeddedIcon .icon rect, -.radioButton svg.embeddedIcon .icon rect{ - stroke: none; -} - -/* Selected button color */ -.light .button svg.embeddedIcon .icon rect, -.light .toggleButton.selected svg.embeddedIcon .icon rect, -.light .radioButton.selected svg.embeddedIcon .icon rect { - fill: #838383; -} - -.light .button:hover svg.embeddedIcon .icon rect, -.light .toggleButton.selected:hover svg.embeddedIcon .icon rect -/* NOTE: selected radio button should NOT have hover highlight */ -{ - fill: #444444; -} - -.light .button svg.embeddedIcon .glyph, -.light .toggleButton.selected svg.embeddedIcon .glyph, -.light .radioButton.selected svg.embeddedIcon .glyph { - fill: white; -} - -.dark .button svg.embeddedIcon .icon rect, -.dark .toggleButton.selected svg.embeddedIcon .icon rect, -.dark .radioButton.selected svg.embeddedIcon .icon rect { - fill: #151515; -} - -.dark .button:hover svg.embeddedIcon .icon rect, -.dark .toggleButton.selected:hover svg.embeddedIcon .icon rect -/* NOTE: selected radio button should NOT have hover highlight */ -{ - fill: #444; -} - -.dark .button svg.embeddedIcon .glyph, -.dark .toggleButton.selected svg.embeddedIcon .glyph, -.dark .radioButton.selected svg.embeddedIcon .glyph { - fill: #B2B2B2; -} - -/* Unselected button color */ -.light .toggleButton svg.embeddedIcon .icon rect, -.light .radioButton svg.embeddedIcon .icon rect { - fill: #eee; -} - -.light .toggleButton:hover svg.embeddedIcon .icon rect, -.light .radioButton:hover:not(.selected) svg.embeddedIcon .icon rect { - fill: #ccc; -} - -.light .toggleButton svg.embeddedIcon .glyph, -.light .radioButton svg.embeddedIcon .glyph { - fill: #bbb; -} -.light .toggleButton:hover:not(.selected) svg.embeddedIcon .glyph, -.light .radioButton:hover:not(.selected) svg.embeddedIcon .glyph { - fill: #999; -} - -.dark .toggleButton svg.embeddedIcon .icon rect, -.dark .radioButton svg.embeddedIcon .icon rect { - fill: #303030; -} - -.dark .toggleButton:hover:not(.selected) svg.embeddedIcon .icon rect, -.dark .radioButton:hover:not(.selected) svg.embeddedIcon .icon rect { - fill: #555; -} - -.dark .toggleButton svg.embeddedIcon .glyph, -.dark .radioButton svg.embeddedIcon .glyph { - fill: #565656; -} - -.dark .toggleButton:hover:not(.selected) svg.embeddedIcon .glyph, -.dark .radioButton:hover:not(.selected) svg.embeddedIcon .glyph { - fill: #777; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/button.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/button.js deleted file mode 100644 index 2ef5b4b0..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/button.js +++ /dev/null @@ -1,265 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Widget -- Button Service - */ -(function () { - 'use strict'; - - // injected refs - var $log, fs, is, tts; - - // configuration - var btnSize = 25, - btnPadding = 4; - - - // === Helper Functions - - function divExists(div, msg) { - if (!div) { - $log.warn('div undefined (' + msg + ')'); - } - return !!div; - } - - function createDiv(div, cls, id) { - return div.append('div') - .classed(cls, true) - .attr('id', id); - } - - function noop() {} - - function buttonWidth() { - return btnSize + 2 * btnPadding; - } - - // === BUTTON ================================================= - - // div is where to put the button (d3.selection of a DIV element) - // id should be globally unique - // gid is glyph ID (from Glyph Service) - // cb is callback function on click - // tooltip is text for tooltip - function button(div, id, gid, cb, tooltip) { - if (!divExists(div, 'button')) return null; - - var btnDiv = createDiv(div, 'button', id), - cbFnc = fs.isF(cb) || noop; - - is.loadIcon(btnDiv, gid, btnSize, true); - if (tooltip) { tts.addTooltip(btnDiv, tooltip); } - - btnDiv.on('click', cbFnc); - - return { - id: id, - width: buttonWidth - } - } - - - // === TOGGLE BUTTON ========================================== - - // div is where to put the button (d3.selection of a DIV element) - // id should be globally unique - // gid is glyph ID (from Glyph Service) - // initState is whether the toggle is on or not to begin - // cb is callback function on click - // tooltip is text for tooltip - function toggle(div, id, gid, initState, cb, tooltip) { - if (!divExists(div, 'toggle button')) return null; - - var sel = !!initState, - togDiv = createDiv(div, 'toggleButton', id), - cbFnc = fs.isF(cb) || noop; - - is.loadIcon(togDiv, gid, btnSize, true); - togDiv.classed('selected', sel); - if (tooltip) { tts.addTooltip(togDiv, tooltip); } - - function _toggle(b, nocb) { - sel = (b === undefined) ? !sel : !!b; - togDiv.classed('selected', sel); - nocb || cbFnc(sel); - } - - // toggle the button state without invoking the callback - function toggleNoCb() { - _toggle(undefined, true); - } - - togDiv.on('click', _toggle); - - return { - id: id, - width: buttonWidth, - selected: function () { return sel; }, - toggle: _toggle, - toggleNoCb: toggleNoCb - } - } - - - // === RADIO BUTTON SET ======================================= - - - // div is where to put the button (d3.selection of a DIV element) - // id should be globally unique - // rset is an array of button descriptors of the following form: - // { - // gid: glyphId, - // tooltip: tooltipText, - // cb: callbackFunction - // } - function radioSet(div, id, rset) { - if (!divExists(div, 'radio button set')) return null; - - if (!fs.isA(rset) || !rset.length) { - $log.warn('invalid array (radio button set)'); - return null; - } - - var rDiv = createDiv(div, 'radioSet', id), - rads = [], - idxByKey = {}, - currIdx = 0; - - function rsetWidth() { - return ((btnSize + btnPadding) * rads.length) + btnPadding; - } - - function rbclick() { - var id = d3.select(this).attr('id'), - m = /^.*-(\d+)$/.exec(id), - idx = Number(m[1]); - - if (idx !== currIdx) { - rads[currIdx].el.classed('selected', false); - currIdx = idx; - rads[currIdx].el.classed('selected', true); - invokeCurrent(); - } - } - - // { - // gid: gid, - // tooltip: ..., (optional) - // key: ..., (optional) - // cb: cb - // id: ... (added by us) - // index: ... (added by us) - // } - - rset.forEach(function (btn, index) { - - if (!fs.isO(btn)) { - $log.warn('radio button descriptor at index ' + index + - ' not an object'); - return; - } - - var rid = id + '-' + index, - initSel = (index === 0), - rbdiv = createDiv(rDiv, 'radioButton', rid); - - rbdiv.classed('selected', initSel); - rbdiv.on('click', rbclick); - is.loadIcon(rbdiv, btn.gid, btnSize, true); - if (btn.tooltip) { tts.addTooltip(rbdiv, btn.tooltip); } - angular.extend(btn, { - el: rbdiv, - id: rid, - cb: fs.isF(btn.cb) || noop, - index: index - }); - - if (btn.key) { - idxByKey[btn.key] = index; - } - - rads.push(btn); - }); - - - function invokeCurrent() { - var curr = rads[currIdx]; - curr.cb(curr.index, curr.key); - } - - function selected(x) { - var curr = rads[currIdx], - idx; - - if (x === undefined) { - return curr.key || curr.index; - } else { - idx = idxByKey[x]; - if (idx === undefined) { - $log.warn('no radio button with key:', x); - } else { - selectedIndex(idx); - } - } - } - - function selectedIndex(x) { - if (x === undefined) { - return currIdx; - } else { - if (x >= 0 && x < rads.length) { - if (currIdx !== x) { - rads[currIdx].el.classed('selected', false); - currIdx = x; - rads[currIdx].el.classed('selected', true); - invokeCurrent(); - } else { - $log.warn('current index already selected:', x); - } - } else { - $log.warn('invalid radio button index:', x); - } - } - } - - return { - width: rsetWidth, - selected: selected, - selectedIndex: selectedIndex - } - } - - - angular.module('onosWidget') - .factory('ButtonService', - ['$log', 'FnService', 'IconService', 'TooltipService', - - function (_$log_, _fs_, _is_, _tts_) { - $log = _$log_; - fs = _fs_; - is = _is_; - tts = _tts_; - - return { - button: button, - toggle: toggle, - radioSet: radioSet - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/table.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/table.css deleted file mode 100644 index 356ac0f7..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/table.css +++ /dev/null @@ -1,215 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* ------ for summary-list tables ------ */ - -div.summary-list { - margin: 0 20px 16px 10px; - font-size: 10pt; - border-spacing: 0; -} - -div.loading-wheel { - display: inline-block; - position: absolute; - margin-top: 40px; - left: 47%; - animation: spin reverse 2s ease infinite; - z-index: 1000; -} - -@keyframes spin { - to { - transform: rotate(360deg); - } -} - -div.loading-wheel svg.embeddedIcon g.icon .glyph { - opacity: .8; -} -.light div.loading-wheel svg.embeddedIcon g.icon .glyph { - fill: #964949; -} -.dark div.loading-wheel svg.embeddedIcon g.icon .glyph { - fill: whitesmoke; -} - -div.summary-list table { - border-collapse: collapse; - table-layout: fixed; - empty-cells: show; - margin: 0; -} - -div.summary-list div.table-body { - overflow-y: scroll; -} - -div.summary-list div.table-body::-webkit-scrollbar { - display: none; -} - -div.summary-list tr.no-data td { - text-align: center; - font-style: italic; -} - -.light div.summary-list tr:nth-child(even) { - background-color: #ddd; -} -.light div.summary-list tr:nth-child(odd) { - background-color: #eee; -} -.dark div.summary-list tr:nth-child(even) { - background-color: #333; -} -.dark div.summary-list tr:nth-child(odd) { - background-color: #444; -} - -.light div.summary-list tr.selected { - background-color: deepskyblue !important; -} - -.dark div.summary-list tr.selected { - background-color: #304860; -} - -/* highlighting */ -div.summary-list tr { - transition: background-color 500ms; -} -.light div.summary-list tr.data-change { - background-color: #FDFFDC; -} -.dark div.summary-list tr.data-change { - background-color: #5A5600; -} - -div.summary-list td { - padding: 6px; - text-align: left; - word-wrap: break-word; -} - -div.summary-list .table-header td { - letter-spacing: 0.02em; - cursor: pointer; - font-weight: bold; -} -div.summary-list .table-header td:first-child { - border-radius: 8px 0 0 0; -} -div.summary-list .table-header td:last-child { - border-radius: 0 8px 0 0; -} - -.light div.summary-list .table-header td { - background-color: #bbb; -} -.dark div.summary-list .table-header td { - background-color: #222; - color: #ccc; -} - -/* rows are selectable */ -div.summary-list .table-body td { - cursor: pointer; -} - -.dark div.summary-list td { - color: #ccc; -} - -/* Tabular view upper right control buttons */ - -div.ctrl-btns { - display: inline-block; - float: right; - height: 44px; - margin-right: 24px; - margin-top: 7px; -} - - -div.ctrl-btns div { - display: inline-block; - padding: 4px; - cursor: pointer; -} - -div.ctrl-btns div.separator { - cursor: auto; - width: 24px; - border: none; -} - -/* Inactive */ -.light .ctrl-btns div g.icon rect, -.light .ctrl-btns div:hover g.icon rect { - fill: #eee; -} -.dark .ctrl-btns div g.icon rect, -.dark .ctrl-btns div:hover g.icon rect { - fill: #222; -} - -.light .ctrl-btns div g.icon use { - fill: #ddd; -} -.dark .ctrl-btns div g.icon use { - fill: #333; -} - -/* Active hover */ -.light .ctrl-btns div.active:hover g.icon rect { - fill: #800; -} - -.dark .ctrl-btns div.active:hover g.icon rect { - fill: #CE5650; -} - -/* Active */ -.light .ctrl-btns div.active g.icon use { - fill: #fff; -} -.dark .ctrl-btns div.active g.icon use { - fill: #eee; -} - -.light .ctrl-btns div.active g.icon rect { - fill: #bbb; -} -.dark .ctrl-btns div.active g.icon rect { - fill: #444; -} - -/* Refresh button specific */ -.light .ctrl-btns div.refresh.active g.icon rect { - fill: #964949; -} - -.dark .ctrl-btns div.refresh.active g.icon rect { - fill: #9B4641; -} -.light .ctrl-btns div.refresh:hover g.icon rect { - fill: #964949; -} - -.dark .ctrl-btns div.refresh:hover g.icon rect { - fill: #9B4641; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/table.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/table.js deleted file mode 100644 index 327aedb9..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/table.js +++ /dev/null @@ -1,272 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Widget -- Table Service - */ -(function () { - 'use strict'; - - // injected refs - var $log, $window, fs, mast, is; - - // constants - var tableIconTdSize = 33, - pdg = 22, - flashTime = 1500, - colWidth = 'col-width', - tableIcon = 'table-icon', - asc = 'asc', - desc = 'desc', - none = 'none'; - - // internal state - var currCol = {}, - prevCol = {}, - cstmWidths = {}, - sortIconAPI; - - // Functions for resizing a tabular view to the window - - function _width(elem, width) { - elem.style('width', width); - } - - function findCstmWidths(table) { - var headers = table.select('.table-header').selectAll('td'); - - headers.each(function (d, i) { - var h = d3.select(this), - index = i.toString(); - if (h.classed(tableIcon)) { - cstmWidths[index] = tableIconTdSize + 'px'; - } - if (h.attr(colWidth)) { - cstmWidths[index] = h.attr(colWidth); - } - }); - if (fs.debugOn('widget')) { - $log.debug('Headers with custom widths: ', cstmWidths); - } - } - - function setTdWidths(elem, width) { - var tds = elem.select('tr:first-child').selectAll('td'); - _width(elem, width + 'px'); - - tds.each(function (d, i) { - var td = d3.select(this), - index = i.toString(); - if (cstmWidths.hasOwnProperty(index)) { - _width(td, cstmWidths[index]); - } - }); - } - - function setHeight(thead, body, height) { - var h = height - (mast.mastHeight() + - fs.noPxStyle(d3.select('.tabular-header'), 'height') + - fs.noPxStyle(thead, 'height') + pdg); - body.style('height', h + 'px'); - } - - function adjustTable(haveItems, tableElems, width, height) { - if (haveItems) { - setTdWidths(tableElems.thead, width); - setTdWidths(tableElems.tbody, width); - setHeight(tableElems.thead, tableElems.table.select('.table-body'), height); - } else { - setTdWidths(tableElems.thead, width); - _width(tableElems.tbody, width + 'px'); - } - } - - // Functions for sorting table rows by header - - function updateSortDirection(thElem) { - sortIconAPI.sortNone(thElem.select('div')); - currCol.div = thElem.append('div'); - currCol.colId = thElem.attr('colId'); - - if (currCol.colId === prevCol.colId) { - (currCol.dir === desc) ? currCol.dir = asc : currCol.dir = desc; - prevCol.dir = currCol.dir; - } else { - currCol.dir = asc; - prevCol.dir = none; - } - (currCol.dir === asc) ? - sortIconAPI.sortAsc(currCol.div) : sortIconAPI.sortDesc(currCol.div); - - if (prevCol.colId && prevCol.dir === none) { - sortIconAPI.sortNone(prevCol.div); - } - - prevCol.colId = currCol.colId; - prevCol.div = currCol.div; - } - - function sortRequestParams() { - return { - sortCol: currCol.colId, - sortDir: currCol.dir - }; - } - - function resetSort() { - if (currCol.div) { - sortIconAPI.sortNone(currCol.div); - } - if (prevCol.div) { - sortIconAPI.sortNone(prevCol.div); - } - currCol = {}; - prevCol = {}; - } - - angular.module('onosWidget') - .directive('onosTableResize', ['$log','$window', - 'FnService', 'MastService', - - function (_$log_, _$window_, _fs_, _mast_) { - return function (scope, element) { - $log = _$log_; - $window = _$window_; - fs = _fs_; - mast = _mast_; - - var table = d3.select(element[0]), - tableElems = { - table: table, - thead: table.select('.table-header').select('table'), - tbody: table.select('.table-body').select('table') - }, - wsz; - - findCstmWidths(table); - - // adjust table on window resize - scope.$watchCollection(function () { - return { - h: $window.innerHeight, - w: $window.innerWidth - }; - }, function () { - wsz = fs.windowSize(0, 30); - adjustTable( - scope.tableData.length, - tableElems, - wsz.width, wsz.height - ); - }); - - // adjust table when data changes - scope.$watchCollection('tableData', function () { - adjustTable( - scope.tableData.length, - tableElems, - wsz.width, wsz.height - ); - }); - - scope.$on('$destroy', function () { - cstmWidths = {}; - }); - }; - }]) - - .directive('onosSortableHeader', ['$log', 'IconService', - function (_$log_, _is_) { - return function (scope, element) { - $log = _$log_; - is = _is_; - var header = d3.select(element[0]); - sortIconAPI = is.sortIcons(); - - header.selectAll('td').on('click', function () { - var col = d3.select(this); - - if (col.attr('sortable') === '') { - updateSortDirection(col); - scope.sortParams = sortRequestParams(); - scope.sortCallback(scope.sortParams); - } - }); - - scope.$on('$destroy', function () { - resetSort(); - }); - }; - }]) - - .directive('onosFlashChanges', - ['$log', '$parse', '$timeout', 'FnService', - function ($log, $parse, $timeout, fs) { - - return function (scope, element, attrs) { - var idProp = attrs.idProp, - table = d3.select(element[0]), - trs, promise; - - function highlightRows() { - var changedRows = []; - function classRows(b) { - if (changedRows.length) { - angular.forEach(changedRows, function (tr) { - tr.classed('data-change', b); - }); - } - } - // timeout because 'row-id' was the un-interpolated value - // "{{link.one}}" for example, instead of link.one evaluated - // timeout executes on the next digest -- after evaluation - $timeout(function () { - if (scope.tableData.length) { - trs = table.selectAll('tr'); - } - - if (trs && !trs.empty()) { - trs.each(function () { - var tr = d3.select(this); - if (fs.find(tr.attr('row-id'), - scope.changedData, - idProp) > -1) { - changedRows.push(tr); - } - }); - classRows(true); - promise = $timeout(function () { - classRows(false); - }, flashTime); - trs = undefined; - } - }); - } - - // new items added: - scope.$on('ngRepeatComplete', highlightRows); - // items changed in existing set: - scope.$watchCollection('changedData', highlightRows); - - scope.$on('$destroy', function () { - if (promise) { - $timeout.cancel(promise); - } - }); - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js deleted file mode 100644 index 6a5ffb1f..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/tableBuilder.js +++ /dev/null @@ -1,167 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Widget -- Table Service - */ -(function () { - 'use strict'; - - // injected refs - var $log, $interval, $timeout, fs, wss; - - // constants - var refreshInterval = 2000, - loadingWait = 500; - - // example params to buildTable: - // { - // scope: $scope, <- controller scope - // tag: 'device', <- table identifier - // selCb: selCb, <- row selection callback (optional) - // respCb: respCb, <- websocket response callback (optional) - // query: params <- query parameters in URL (optional) - // } - // Note: selCb() is passed the row data model of the selected row, - // or null when no row is selected. - // Note: query is always an object (empty or containing properties) - // it comes from $location.search() - - function buildTable(o) { - var handlers = {}, - root = o.tag + 's', - req = o.tag + 'DataRequest', - resp = o.tag + 'DataResponse', - onSel = fs.isF(o.selCb), - onResp = fs.isF(o.respCb), - idKey = o.idKey || 'id', - oldTableData = [], - loaded = false, - refreshPromise, loadingPromise; - - o.scope.tableData = []; - o.scope.changedData = []; - o.scope.sortParams = {}; - o.scope.loading = true; - o.scope.autoRefresh = true; - o.scope.autoRefreshTip = 'Toggle auto refresh'; - - // === websocket functions -------------------- - // response - function respCb(data) { - loaded = true; - o.scope.loading = false; - o.scope.tableData = data[root]; - onResp && onResp(); - - // checks if data changed for row flashing - if (!angular.equals(o.scope.tableData, oldTableData)) { - o.scope.changedData = []; - // only flash the row if the data already exists - if (oldTableData.length) { - angular.forEach(o.scope.tableData, function (item) { - if (!fs.containsObj(oldTableData, item)) { - o.scope.changedData.push(item); - } - }); - } - angular.copy(o.scope.tableData, oldTableData); - } - o.scope.$apply(); - } - handlers[resp] = respCb; - wss.bindHandlers(handlers); - - // request - function sortCb(params) { - var p = angular.extend({}, params, o.query); - wss.sendEvent(req, p); - stillLoading(); - } - o.scope.sortCallback = sortCb; - - // show loading wheel if it's taking a while for the server to respond - function stillLoading() { - loaded = false; - loadingPromise = $timeout(function () { - if (!loaded) { - o.scope.loading = true; - } - }, loadingWait); - } - - // === selecting a row functions ---------------- - function selCb($event, selRow) { - var selId = selRow[idKey]; - o.scope.selId = (o.scope.selId === selId) ? null : selId; - onSel && onSel($event, selRow); - } - o.scope.selectCallback = selCb; - - // === autoRefresh functions ------------------ - function startRefresh() { - refreshPromise = $interval(function () { - if (fs.debugOn('widget')) { - $log.debug('Refreshing ' + root + ' page'); - } - sortCb(o.scope.sortParams); - }, refreshInterval); - } - - function stopRefresh() { - if (angular.isDefined(refreshPromise)) { - $interval.cancel(refreshPromise); - refreshPromise = undefined; - } - } - - function toggleRefresh() { - o.scope.autoRefresh = !o.scope.autoRefresh; - o.scope.autoRefresh ? startRefresh() : stopRefresh(); - } - o.scope.toggleRefresh = toggleRefresh; - - // === Cleanup on destroyed scope ----------------- - o.scope.$on('$destroy', function () { - wss.unbindHandlers(handlers); - stopRefresh(); - if (angular.isDefined(loadingPromise)) { - $timeout.cancel(loadingPromise); - loadingPromise = undefined; - } - }); - - sortCb(); - startRefresh(); - } - - angular.module('onosWidget') - .factory('TableBuilderService', - ['$log', '$interval', '$timeout', 'FnService', 'WebSocketService', - - function (_$log_, _$interval_, _$timeout_, _fs_, _wss_) { - $log = _$log_; - $interval = _$interval_; - $timeout = _$timeout_; - fs = _fs_; - wss = _wss_; - - return { - buildTable: buildTable - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/toolbar.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/toolbar.css deleted file mode 100644 index 36a5971b..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/toolbar.css +++ /dev/null @@ -1,77 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Toolbar Service -- CSS file - */ - -.light .tbar-arrow svg.embeddedIcon .icon .glyph { - fill: #838383; -} -.dark .tbar-arrow svg.embeddedIcon .icon .glyph { - fill: #B2B2B2; -} - - -div.tbar-arrow { - position: absolute; - top: 53%; - left: 96%; - margin-right: -4%; - transform: translate(-50%, -50%); - cursor: pointer; -} -.safari div.tbar-arrow { - top: 46%; -} -.firefox div.tbar-arrow { - left: 97%; - margin-right: -3%; -} - -.tbar-arrow svg.embeddedIcon .icon rect { - stroke: none; -} -.light .tbar-arrow svg.embeddedIcon .icon rect { - fill: none; -} -.dark .tbar-arrow svg.embeddedIcon .icon rect { - fill: none; -} - - -.toolbar { - line-height: 125%; -} -.tbar-row { - display: inline-block; -} - - - -.separator { - border: 1px solid; - margin: 0 4px 0 4px; - display: inline-block; - height: 23px; - width: 0; -} -.light .separator { - border-color: #ddd; -} -.dark .separator { - border-color: #1A1A1A; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/toolbar.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/toolbar.js deleted file mode 100644 index 050afd0f..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/toolbar.js +++ /dev/null @@ -1,268 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Widget -- Toolbar Service - */ -// TODO: Augment service to allow toolbars to exist on right edge of screen -// TODO: also - make toolbar more object aware (rows etc.) - - -(function () { - 'use strict'; - - // injected refs - var $log, fs, ps, bns, is; - - // configuration - var arrowSize = 10, - sepWidth = 6, - defaultSettings = { - edge: 'left', - width: 20, - margin: 0, - hideMargin: -20, - top: 'auto', - bottom: '10px', - fade: false, - shown: false - }; - - // internal state - var tbars = {}; - - - // === Helper functions -------------------------------------- - - // translate uses 50 because the svg viewbox is 50 - function rotateArrowLeft(adiv) { - adiv.select('g') - .attr('transform', 'translate(0 50) rotate(-90)'); - } - function rotateArrowRight(adiv) { - adiv.select('g') - .attr('transform', 'translate(50 0) rotate(90)'); - } - - function createArrow(panel) { - var arrowDiv = panel.append('div') - .classed('tbar-arrow', true); - is.loadIcon(arrowDiv, 'triangleUp', arrowSize, true); - return arrowDiv; - } - - function warn(msg, id) { - $log.warn('createToolbar: ' + msg + ': [' + id + ']'); - return null; - } - - // ================================== - - function createToolbar(id, opts) { - if (!id) return warn('no ID given'); - if (tbars[id]) return warn('duplicate ID given', id); - - var settings = angular.extend({}, defaultSettings, fs.isO(opts)), - items = {}, - tbid = 'toolbar-' + id, - panel = ps.createPanel(tbid, settings), - arrowDiv = createArrow(panel), - currentRow = panel.append('div').classed('tbar-row', true), - rowButtonIds = [], // for removable buttons - tbWidth = arrowSize + 2, // empty toolbar width - maxWidth = panel.width(); - - arrowDiv.on('click', toggle); - - // add a descriptor for this toolbar - tbars[id] = { - settings: settings, - items: items, - panel: panel, - panelId: tbid - }; - - panel.classed('toolbar', true) - .style('top', settings.top) - .style('bottom', settings.bottom); - - // Helper functions - - function dupId(id, caller) { - if (items[id]) { - $log.warn(caller + ': duplicate ID:', id); - return true; - } - return false; - } - - function adjustWidth(btnWidth) { - if (fs.noPxStyle(currentRow, 'width') >= maxWidth) { - tbWidth += btnWidth; - maxWidth = tbWidth; - } - panel.width(tbWidth); - } - - // API functions - - function addButton(id, gid, cb, tooltip) { - if (dupId(id, 'addButton')) return null; - - var bid = tbid + '-' + id, - btn = bns.button(currentRow, bid, gid, cb, tooltip); - - items[id] = btn; - adjustWidth(btn.width()); - return btn; - } - - function addToggle(id, gid, initState, cb, tooltip) { - if (dupId(id, 'addToggle')) return null; - - var tid = tbid + '-' + id, - tog = bns.toggle(currentRow, tid, gid, initState, cb, tooltip); - - items[id] = tog; - adjustWidth(tog.width()); - return tog; - } - - function addRadioSet(id, rset) { - if (dupId(id, 'addRadioSet')) return null; - - var rid = tbid + '-' + id, - rad = bns.radioSet(currentRow, rid, rset); - - items[id] = rad; - adjustWidth(rad.width()); - return rad; - } - - function addSeparator() { - currentRow.append('div') - .classed('separator', true); - tbWidth += sepWidth; - } - - function addRow() { - if (currentRow.select('div').empty()) { - return null; - } else { - panel.append('br'); - currentRow = panel.append('div').classed('tbar-row', true); - - // return API to allow caller more access to the row - return { - clear: rowClear, - setText: rowSetText, - addButton: rowAddButton, - classed: rowClassed - }; - } - } - - function rowClear() { - currentRow.selectAll('*').remove(); - rowButtonIds.forEach(function (bid) { - delete items[bid]; - }); - rowButtonIds = []; - } - - // installs a div with text into the button row - function rowSetText(text) { - rowClear(); - currentRow.append('div').classed('tbar-row-text', true) - .html(text); - } - - function rowAddButton(id, gid, cb, tooltip) { - var b = addButton(id, gid, cb, tooltip); - if (b) { - rowButtonIds.push(id); - } - } - - function rowClassed(classes, bool) { - currentRow.classed(classes, bool); - } - - function show(cb) { - rotateArrowLeft(arrowDiv); - panel.show(cb); - } - - function hide(cb) { - rotateArrowRight(arrowDiv); - panel.hide(cb); - } - - function toggle(cb) { - if (panel.isVisible()) { - hide(cb); - } else { - show(cb); - } - } - - return { - addButton: addButton, - addToggle: addToggle, - addRadioSet: addRadioSet, - addSeparator: addSeparator, - addRow: addRow, - - show: show, - hide: hide, - toggle: toggle - }; - } - - function destroyToolbar(id) { - var tb = tbars[id]; - delete tbars[id]; - - if (tb) { - ps.destroyPanel(tb.panelId); - } - } - - // === Module Definition === - - angular.module('onosWidget') - .factory('ToolbarService', - ['$log', 'FnService', 'PanelService', 'ButtonService', 'IconService', - - function (_$log_, _fs_, _ps_, _bns_, _is_) { - $log = _$log_; - fs = _fs_; - ps = _ps_; - bns = _bns_; - is = _is_; - - // this function is only used in testing - function init() { - tbars = {}; - } - - return { - init: init, - createToolbar: createToolbar, - destroyToolbar: destroyToolbar - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/tooltip.css b/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/tooltip.css deleted file mode 100644 index f967793c..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/tooltip.css +++ /dev/null @@ -1,44 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Tooltip Service -- CSS file - */ - -#tooltip { - text-align: center; - font-size: 80%; - border: 1px solid; - padding: 5px; - position: absolute; - z-index: 5000; - display: none; - pointer-events: none; -} - -/* colors subject to change */ - -.light #tooltip { - background-color: #ddd; - color: #444; - border-color: #ccc; -} - -.dark #tooltip { - background-color: #151515; - color: #B2B2B2; - border-color: #252525; -}
\ No newline at end of file diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/tooltip.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/tooltip.js deleted file mode 100644 index dd8a6950..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/tooltip.js +++ /dev/null @@ -1,146 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Widget -- Tooltip Service - */ - -(function () { - 'use strict'; - - // injected references - var $log, $rootScope, fs; - - // constants - var hoverHeight = 35, - hoverDelay = 150, - exitDelay = 150; - - // internal state - var tooltip, currElemId; - - // === Helper functions --------------------------------------------- - - function init() { - tooltip = d3.select('#tooltip'); - tooltip.html(''); - } - - function tipStyle(mouseX, mouseY) { - var winWidth = fs.windowSize().width, - winHeight = fs.windowSize().height, - style = { - display: 'inline-block', - left: 'auto', - right: 'auto' - }; - - if (mouseX <= (winWidth / 2)) { - style.left = mouseX + 'px'; - } else { - style.right = (winWidth - mouseX) + 'px'; - } - - if (mouseY <= (winHeight / 2)) { - style.top = (mouseY + (hoverHeight - 10)) + 'px'; - } else { - style.top = (mouseY - hoverHeight) + 'px'; - } - - return style; - } - - // === API functions ------------------------------------------------ - - function addTooltip(elem, tooltip) { - elem.on('mouseover', function () { showTooltip(this, tooltip); }); - elem.on('mouseout', function () { cancelTooltip(this); }); - $rootScope.$on('$routeChangeStart', function () { - cancelTooltip(elem.node()); - }); - } - - function showTooltip(el, msg) { - // tooltips don't make sense on mobile devices - if (!el || !msg || fs.isMobile()) { - return; - } - - var elem = d3.select(el), - mouseX = d3.event.pageX, - mouseY = d3.event.pageY, - style = tipStyle(mouseX, mouseY); - currElemId = elem.attr('id'); - - tooltip.transition() - .delay(hoverDelay) - .each('start', function () { - d3.select(this).style('display', 'none'); - }) - .each('end', function () { - d3.select(this).style(style) - .text(msg); - }); - } - - function cancelTooltip(el) { - if (!el) { - return; - } - var elem = d3.select(el); - - if (elem.attr('id') === currElemId) { - tooltip.transition() - .delay(exitDelay) - .style({ - display: 'none' - }) - .text(''); - } - } - - angular.module('onosWidget') - - .directive('tooltip', ['$rootScope', 'FnService', - function (_$rootScope_, _fs_) { - $rootScope = _$rootScope_; - fs = _fs_; - - init(); - - return { - restrict: 'A', - link: function (scope, elem, attrs) { - addTooltip(d3.select(elem[0]), scope[attrs.ttMsg]); - } - }; - }]) - - .factory('TooltipService', ['$log', '$rootScope', 'FnService', - function (_$log_, _$rootScope_, _fs_) { - $log = _$log_; - $rootScope = _$rootScope_; - fs = _fs_; - - init(); - - return { - addTooltip: addTooltip, - showTooltip: showTooltip, - cancelTooltip: cancelTooltip - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/widget.js b/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/widget.js deleted file mode 100644 index d11c8287..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/fw/widget/widget.js +++ /dev/null @@ -1,25 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Widgets Module - */ -(function () { - 'use strict'; - - angular.module('onosWidget', []); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/onos.css b/framework/src/onos/web/gui/src/main/webapp/app/onos.css deleted file mode 100644 index b42af35e..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/onos.css +++ /dev/null @@ -1,60 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- core -- CSS file - */ - -html { - font-family: sans-serif; - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100%; - height: 100%; -} - -/* - overflow hidden is to ensure that the body does not expand to account - for any flyout panes, that are positioned "off screen". - */ -body { - height: 100%; - margin: 0; - overflow: hidden; -} - -body.light { - background-color: white; -} -body.dark { - background-color: #2b2b2b; -} - -#view { - padding: 6px; - width: 100%; - height: 100%; -} - -#view h2 { - padding-left: 12px; -} - -.light #view h2 { - color: #800; -} -.dark #view h2 { - color: #CE5650; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/app/app.css b/framework/src/onos/web/gui/src/main/webapp/app/view/app/app.css deleted file mode 100644 index 9413369a..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/app/app.css +++ /dev/null @@ -1,32 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Host View -- CSS file - */ - -#ov-app h2 { - display: inline-block; -} - -#ov-app div.ctrl-btns { - width: 290px; -} - -#ov-app form#inputFileForm, -#ov-app input#uploadFile { - display: none; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/app/app.html b/framework/src/onos/web/gui/src/main/webapp/app/view/app/app.html deleted file mode 100644 index 85b044fb..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/app/app.html +++ /dev/null @@ -1,80 +0,0 @@ -<!-- app partial HTML --> -<div id="ov-app"> - <div class="tabular-header"> - <h2>Applications ({{tableData.length}} total)</h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - <div class="separator"></div> - - <form id="inputFileForm"> - <input id="uploadFile" - type="file" size="50" accept=".oar" - file-model="appFile"> - </form> - <div icon icon-size="36" icon-id="plus" - class="active" trigger-form - tooltip tt-msg="uploadTip"> - </div> - <div icon icon-size="36" icon-id="play" - ng-click="appAction('activate')" - tooltip tt-msg="activateTip" - ng-class="{active: ctrlBtnState.installed}"> - </div> - <div icon icon-size="36" icon-id="stop" - ng-click="appAction('deactivate')" - tooltip tt-msg="deactivateTip" - ng-class="{active: ctrlBtnState.active}"> - </div> - <div icon icon-size="36" icon-id="garbage" - ng-click="appAction('uninstall')" - tooltip tt-msg="uninstallTip" - ng-class="{active: ctrlBtnState.selection}"> - </div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="state" class="table-icon" sortable></td> - <td colId="id" sortable>App ID </td> - <td colId="version" sortable>Version </td> - <td colId="origin" sortable>Origin </td> - <td colId="desc" col-width="475px">Description </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="id"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="5"> - No Applications found - </td> - </tr> - - <tr ng-repeat="app in tableData track by $index" - ng-click="selectCallback($event, app)" - ng-class="{selected: app.id === selId}" - ng-repeat-complete row-id="{{app.id}}"> - <td class="table-icon"> - <div icon icon-id="{{app._iconid_state}}"></div> - </td> - <td>{{app.id}}</td> - <td>{{app.version}}</td> - <td>{{app.origin}}</td> - <td>{{app.desc}}</td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/app/app.js b/framework/src/onos/web/gui/src/main/webapp/app/view/app/app.js deleted file mode 100644 index 7cc081cb..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/app/app.js +++ /dev/null @@ -1,148 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the 'License'); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an 'AS IS' BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- App View Module - */ - -(function () { - 'use strict'; - - // constants - var INSTALLED = 'INSTALLED', - ACTIVE = 'ACTIVE', - APP_MGMENT_REQ = 'appManagementRequest', - FILE_UPLOAD_URL = 'applications/upload'; - - angular.module('ovApp', []) - .controller('OvAppCtrl', - ['$log', '$scope', '$http', - 'FnService', 'TableBuilderService', 'WebSocketService', 'UrlFnService', - 'KeyService', - - function ($log, $scope, $http, fs, tbs, wss, ufs, ks) { - $scope.ctrlBtnState = {}; - $scope.uploadTip = 'Upload an application (.oar file)'; - $scope.activateTip = 'Activate selected application'; - $scope.deactivateTip = 'Deactivate selected application'; - $scope.uninstallTip = 'Uninstall selected application'; - - function selCb($event, row) { - // selId comes from tableBuilder - $scope.ctrlBtnState.selection = !!$scope.selId; - refreshCtrls(); - } - - function refreshCtrls() { - var row, rowIdx; - if ($scope.ctrlBtnState.selection) { - rowIdx = fs.find($scope.selId, $scope.tableData); - row = rowIdx >= 0 ? $scope.tableData[rowIdx] : null; - - $scope.ctrlBtnState.installed = row && row.state === INSTALLED; - $scope.ctrlBtnState.active = row && row.state === ACTIVE; - } else { - $scope.ctrlBtnState.installed = false; - $scope.ctrlBtnState.active = false; - } - } - - tbs.buildTable({ - scope: $scope, - tag: 'app', - selCb: selCb, - respCb: refreshCtrls - }); - - // TODO: reexamine where keybindings should be - directive or controller? - ks.keyBindings({ - esc: [$scope.selectCallback, 'Deselect app'], - _helpFormat: ['esc'] - }); - ks.gestureNotes([ - ['click row', 'Select / deselect app'], - ['scroll down', 'See more apps'] - ]); - - $scope.appAction = function (action) { - if ($scope.ctrlBtnState.selection) { - $log.debug('Initiating ' + action + ' of ' + $scope.selId); - wss.sendEvent(APP_MGMENT_REQ, { - action: action, - name: $scope.selId, - sortCol: $scope.sortParams.sortCol, - sortDir: $scope.sortParams.sortDir - }); - } - }; - - $scope.$on('FileChanged', function () { - var formData = new FormData(); - if ($scope.appFile) { - formData.append('file', $scope.appFile); - $http.post(ufs.rsUrl(FILE_UPLOAD_URL), formData, { - transformRequest: angular.identity, - headers: { - 'Content-Type': undefined - } - }) - .finally(function () { - $scope.sortCallback($scope.sortParams); - document.getElementById('inputFileForm').reset(); - }); - } - }); - - $scope.$on('$destroy', function () { - ks.unbindKeys(); - }); - - $log.log('OvAppCtrl has been created'); - }]) - - // triggers the input form to appear when button is clicked - .directive('triggerForm', function () { - return { - restrict: 'A', - link: function (scope, elem) { - elem.bind('click', function () { - document.getElementById('uploadFile') - .dispatchEvent(new MouseEvent('click')); - }); - } - }; - }) - - // binds the model file to the scope in scope.appFile - // sends upload request to the server - .directive('fileModel', ['$parse', - function ($parse) { - return { - restrict: 'A', - link: function (scope, elem, attrs) { - var model = $parse(attrs.fileModel), - modelSetter = model.assign; - - elem.bind('change', function () { - scope.$apply(function () { - modelSetter(scope, elem[0].files[0]); - }); - scope.$emit('FileChanged'); - }); - } - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/cluster/cluster.css b/framework/src/onos/web/gui/src/main/webapp/app/view/cluster/cluster.css deleted file mode 100644 index 83ba8d87..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/cluster/cluster.css +++ /dev/null @@ -1,27 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Cluster View -- CSS file - */ - -#ov-cluster h2 { - display: inline-block; -} - -#ov-cluster div.ctrl-btns { - width: 45px; -}
\ No newline at end of file diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/cluster/cluster.html b/framework/src/onos/web/gui/src/main/webapp/app/view/cluster/cluster.html deleted file mode 100644 index c5048884..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/cluster/cluster.html +++ /dev/null @@ -1,68 +0,0 @@ -<!-- - ~ Copyright 2015 Open Networking Laboratory - ~ - ~ Licensed under the Apache License, Version 2.0 (the "License"); - ~ you may not use this file except in compliance with the License. - ~ You may obtain a copy of the License at - ~ - ~ http://www.apache.org/licenses/LICENSE-2.0 - ~ - ~ Unless required by applicable law or agreed to in writing, software - ~ distributed under the License is distributed on an "AS IS" BASIS, - ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - ~ See the License for the specific language governing permissions and - ~ limitations under the License. - --> - -<!-- Cluster partial HTML --> -<div id="ov-cluster"> - <div class="tabular-header"> - <h2>Cluster Nodes ({{tableData.length}} total)</h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="_iconid_state" class="table-icon" sortable></td> - <td colId="id" sortable>ID </td> - <td colId="ip" sortable>IP Address </td> - <td colId="tcp" sortable>TCP Port </td> - <td colId="updated" sortable>Last Updated </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="id"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="5"> - No Cluster Nodes found - </td> - </tr> - - <tr ng-repeat="node in tableData track by $index" - ng-repeat-complete row-id="{{node.id}}"> - <td class="table-icon"> - <div icon icon-id="{{node._iconid_state}}"></div> - </td> - <td>{{node.id}}</td> - <td>{{node.ip}}</td> - <td>{{node.tcp}}</td> - <td>{{node.updated}}</td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/cluster/cluster.js b/framework/src/onos/web/gui/src/main/webapp/app/view/cluster/cluster.js deleted file mode 100644 index 006808c0..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/cluster/cluster.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Cluster View Module - */ - -(function () { - 'use strict'; - - angular.module('ovCluster', []) - .controller('OvClusterCtrl', - ['$log', '$scope', 'TableBuilderService', - - function ($log, $scope, tbs) { - tbs.buildTable({ - scope: $scope, - tag: 'cluster' - }); - - $log.log('OvClusterCtrl has been created'); - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/device/device.css b/framework/src/onos/web/gui/src/main/webapp/app/view/device/device.css deleted file mode 100644 index 8d8a582b..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/device/device.css +++ /dev/null @@ -1,166 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Device View -- CSS file - */ - -#ov-device h2 { - display: inline-block; -} - -#ov-device div.ctrl-btns { -} - -.light #ov-device .current-view use { - fill: white; -} -.dark #ov-device .current-view use { - fill: #304860; -} - -.light #ov-device .current-view rect { - fill: deepskyblue; -} -.dark #ov-device .current-view rect { - fill: #eee; -} - -/* More in generic panel.css */ - -#device-details-panel.floatpanel { - -moz-border-radius: 0; - border-radius: 0; - z-index: 0; -} - -.light #device-details-panel.floatpanel { - background-color: rgb(229, 234, 237); -} -.dark #device-details-panel.floatpanel { - background-color: #3A4042; -} - -#device-details-panel .container { - padding: 0 12px; -} - -#device-details-panel .close-btn { - position: absolute; - right: 10px; - top: 0; - cursor: pointer; -} -.light .close-btn svg.embeddedIcon .icon.plus .glyph { - fill: #aaa; -} -.dark .close-btn svg.embeddedIcon .icon.plus .glyph { - fill: #ccc; -} - -#device-details-panel .dev-icon { - display: inline-block; - padding: 0 6px 0 0; - vertical-align: middle; -} -.light .dev-icon svg.embeddedIcon .glyph { - fill: rgb(0, 172, 229); -} -.dark .dev-icon svg.embeddedIcon .glyph { - fill: #486D91; -} - -#device-details-panel h2 { - display: inline-block; - margin: 8px 0; -} - -#device-details-panel .editable { - cursor: pointer; - border-bottom: 1px dashed darkgreen; -} - -#device-details-panel h2 input { - font-size: 1.0em; -} - -#device-details-panel .top div.left { - float: left; - padding: 0 18px 0 0; -} -#device-details-panel .top div.right { - display: inline-block; -} - -#device-details-panel td.label { - font-style: italic; - padding-right: 12px; - /* works for both light and dark themes ... */ - color: #777; -} - -#device-details-panel .actionBtns div { - padding: 12px 6px; -} - -#device-details-panel .top hr { - width: 95%; - margin: 0 auto; -} - -.light #device-details-panel hr { - opacity: .5; - border-color: #FFF; -} -.dark #device-details-panel hr { - border-color: #666; -} - -#device-details-panel .bottom table { - border-spacing: 0; -} - -#device-details-panel .bottom th { - letter-spacing: 0.02em; -} - -.light #device-details-panel .bottom th { - background-color: #CCC; - /* default text color */ -} -.dark #device-details-panel .bottom th { - background-color: #131313; - color: #ccc; -} - -#device-details-panel .bottom th, -#device-details-panel .bottom td { - padding: 6px 12px; - text-align: center; -} - -.light #device-details-panel .bottom tr:nth-child(odd) { - background-color: #f9f9f9; -} -.light #device-details-panel .bottom tr:nth-child(even) { - background-color: #EBEDF2; -} -.dark #device-details-panel .bottom tr:nth-child(odd) { - background-color: #333; -} -.dark #device-details-panel .bottom tr:nth-child(even) { - background-color: #555; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/device/device.html b/framework/src/onos/web/gui/src/main/webapp/app/view/device/device.html deleted file mode 100644 index 6f1813a0..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/device/device.html +++ /dev/null @@ -1,87 +0,0 @@ -<!-- Device partial HTML --> -<div id="ov-device"> - <div class="tabular-header"> - <h2>Devices ({{tableData.length}} total)</h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-id="refresh" icon-size="36" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - <div class="separator"></div> - - <div ng-class="{'current-view': !!selId}" - icon icon-id="deviceTable" icon-size="36"></div> - - <div ng-class="{active: !!selId}" - icon icon-id="flowTable" icon-size="36" - tooltip tt-msg="flowTip" - ng-click="nav('flow')"></div> - - <div ng-class="{active: !!selId}" - icon icon-id="portTable" icon-size="36" - tooltip tt-msg="portTip" - ng-click="nav('port')"></div> - - <div ng-class="{active: !!selId}" - icon icon-id="groupTable" icon-size="36" - tooltip tt-msg="groupTip" - ng-click="nav('group')"></div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="available" class="table-icon" sortable></td> - <td colId="type" class="table-icon" sortable></td> - <td colId="name" sortable>Friendly Name </td> - <td colId="id" sortable>Device ID </td> - <td colId="masterid" sortable>Master Instance </td> - <td colId="num_ports" col-width="60px" sortable>Ports </td> - <td colId="mfr" sortable>Vendor </td> - <td colId="hw" sortable>H/W Version </td> - <td colId="sw" sortable>S/W Version </td> - <td colId="protocol" col-width="80px" sortable>Protocol </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="id"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="9"> - No Devices found - </td> - </tr> - - <tr ng-repeat="dev in tableData track by $index" - ng-click="selectCallback($event, dev)" - ng-class="{selected: dev.id === selId}" - ng-repeat-complete row-id="{{dev.id}}"> - <td class="table-icon"> - <div icon icon-id="{{dev._iconid_available}}"></div> - </td> - <td class="table-icon"> - <div icon icon-id="{{dev._iconid_type}}"></div> - </td> - <td>{{dev.name}}</td> - <td>{{dev.id}}</td> - <td>{{dev.masterid}}</td> - <td>{{dev.num_ports}}</td> - <td>{{dev.mfr}}</td> - <td>{{dev.hw}}</td> - <td>{{dev.sw}}</td> - <td>{{dev.protocol}}</td> - </tr> - </table> - </div> - - </div> - - <device-details-panel></device-details-panel> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/device/device.js b/framework/src/onos/web/gui/src/main/webapp/app/view/device/device.js deleted file mode 100644 index 5b7120fd..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/device/device.js +++ /dev/null @@ -1,403 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Device View Module - */ - -(function () { - 'use strict'; - - // injected refs - var $log, $scope, $loc, fs, mast, ps, wss, is, ns, ks; - - // internal state - var detailsPanel, - pStartY, - pHeight, - top, - bottom, - iconDiv, - wSize, - editingName = false; - - // constants - var topPdg = 13, - ctnrPdg = 24, - scrollSize = 17, - portsTblPdg = 50, - - pName = 'device-details-panel', - detailsReq = 'deviceDetailsRequest', - detailsResp = 'deviceDetailsResponse', - nameChangeReq = 'deviceNameChangeRequest', - nameChangeResp = 'deviceNameChangeResponse', - - propOrder = [ - 'id', 'type', 'masterid', 'chassisid', - 'mfr', 'hw', 'sw', 'protocol', 'serial' - ], - friendlyProps = [ - 'URI', 'Type', 'Master ID', 'Chassis ID', - 'Vendor', 'H/W Version', 'S/W Version', 'Protocol', 'Serial #' - ], - portCols = [ - 'enabled', 'id', 'speed', 'type', 'elinks_dest', 'name' - ], - friendlyPortCols = [ - 'Enabled', 'ID', 'Speed', 'Type', 'Egress Links', 'Name' - ]; - - function closePanel() { - if (detailsPanel.isVisible()) { - $scope.selId = null; - detailsPanel.hide(); - return true; - } - return false; - } - - function addCloseBtn(div) { - is.loadEmbeddedIcon(div, 'plus', 30); - div.select('g').attr('transform', 'translate(25, 0) rotate(45)'); - div.on('click', closePanel); - } - - function exitEditMode(nameH2, name) { - nameH2.html(name); - nameH2.classed('editable', true); - editingName = false; - ks.enableGlobalKeys(true); - } - - function editNameSave() { - var nameH2 = top.select('h2'), - id = $scope.panelData.id, - val, - newVal; - - if (editingName) { - val = nameH2.select('input').property('value').trim(); - newVal = val || id; - - exitEditMode(nameH2, newVal); - $scope.panelData.name = newVal; - wss.sendEvent(nameChangeReq, { id: id, name: val }); - } - } - - function editNameCancel() { - if (editingName) { - exitEditMode(top.select('h2'), $scope.panelData.name); - return true; - } - return false; - } - - function editName() { - var nameH2 = top.select('h2'), - tf, el; - - if (!editingName) { - nameH2.classed('editable', false); - nameH2.html(''); - tf = nameH2.append('input').classed('name-input', true) - .attr('type', 'text') - .attr('value', $scope.panelData.name); - el = tf[0][0]; - el.focus(); - el.select(); - editingName = true; - ks.enableGlobalKeys(false); - } - } - - function handleEscape() { - return editNameCancel() || closePanel(); - } - - function setUpPanel() { - var container, closeBtn, tblDiv; - detailsPanel.empty(); - - container = detailsPanel.append('div').classed('container', true); - - top = container.append('div').classed('top', true); - closeBtn = top.append('div').classed('close-btn', true); - addCloseBtn(closeBtn); - iconDiv = top.append('div').classed('dev-icon', true); - top.append('h2').classed('editable', true).on('click', editName); - - tblDiv = top.append('div').classed('top-tables', true); - tblDiv.append('div').classed('left', true).append('table'); - tblDiv.append('div').classed('right', true).append('table'); - - top.append('hr'); - - bottom = container.append('div').classed('bottom', true); - bottom.append('h2').classed('ports-title', true).html('Ports'); - bottom.append('table'); - } - - function addProp(tbody, index, value) { - var tr = tbody.append('tr'); - - function addCell(cls, txt) { - tr.append('td').attr('class', cls).html(txt); - } - addCell('label', friendlyProps[index] + ' :'); - addCell('value', value); - } - - function populateTop(tblDiv, details) { - var leftTbl = tblDiv.select('.left') - .select('table') - .append('tbody'), - rightTbl = tblDiv.select('.right') - .select('table') - .append('tbody'); - - is.loadEmbeddedIcon(iconDiv, details._iconid_type, 40); - top.select('h2').html(details.name); - - propOrder.forEach(function (prop, i) { - // properties are split into two tables - addProp(i < 4 ? leftTbl : rightTbl, i, details[prop]); - }); - } - - function addPortRow(tbody, port) { - var tr = tbody.append('tr'); - - portCols.forEach(function (col) { - tr.append('td').html(port[col]); - }); - } - - function populateBottom(table, ports) { - var theader = table.append('thead').append('tr'), - tbody = table.append('tbody'), - tbWidth, tbHeight; - - friendlyPortCols.forEach(function (col) { - theader.append('th').html(col); - }); - ports.forEach(function (port) { - addPortRow(tbody, port); - }); - - tbWidth = fs.noPxStyle(tbody, 'width') + scrollSize; - tbHeight = pHeight - - (fs.noPxStyle(detailsPanel.el() - .select('.top'), 'height') - + fs.noPxStyle(detailsPanel.el() - .select('.ports-title'), 'height') - + portsTblPdg); - - table.style({ - height: tbHeight + 'px', - width: tbWidth + 'px', - overflow: 'auto', - display: 'block' - }); - - detailsPanel.width(tbWidth + ctnrPdg); - } - - function populateName(div, name) { - var lab = div.select('.label'), - val = div.select('.value'); - lab.html('Friendly Name:'); - val.html(name); - } - - function populateDetails(details) { - var nameDiv, topTbs, btmTbl, ports; - setUpPanel(); - - nameDiv = top.select('.name-div'); - topTbs = top.select('.top-tables'); - btmTbl = bottom.select('table'); - ports = details.ports; - - populateName(nameDiv, details.name); - populateTop(topTbs, details); - populateBottom(btmTbl, ports); - - detailsPanel.height(pHeight); - } - - function respDetailsCb(data) { - $scope.panelData = data.details; - $scope.$apply(); - } - - function respNameCb(data) { - if (data.warn) { - $log.warn(data.warn, data.id); - top.select('h2').html(data.id); - } - } - - function createDetailsPane() { - detailsPanel = ps.createPanel(pName, { - width: wSize.width, - margin: 0, - hideMargin: 0 - }); - detailsPanel.el().style({ - position: 'absolute', - top: pStartY + 'px' - }); - $scope.hidePanel = function () { detailsPanel.hide(); }; - detailsPanel.hide(); - } - - angular.module('ovDevice', []) - .controller('OvDeviceCtrl', - ['$log', '$scope', '$location', 'TableBuilderService', 'FnService', - 'MastService', 'PanelService', 'WebSocketService', 'IconService', - 'NavService', 'KeyService', - - function (_$log_, _$scope_, _$location_, - tbs, _fs_, _mast_, _ps_, _wss_, _is_, _ns_, _ks_) { - var params, - handlers = {}; - - $log = _$log_; - $scope = _$scope_; - $loc = _$location_; - fs = _fs_; - mast = _mast_; - ps = _ps_; - wss = _wss_; - is = _is_; - ns = _ns_; - ks = _ks_; - - params = $loc.search(); - - $scope.panelData = {}; - $scope.flowTip = 'Show flow view for selected device'; - $scope.portTip = 'Show port view for selected device'; - $scope.groupTip = 'Show group view for selected device'; - - // details panel handlers - handlers[detailsResp] = respDetailsCb; - handlers[nameChangeResp] = respNameCb; - wss.bindHandlers(handlers); - - // query for if a certain device needs to be highlighted - if (params.hasOwnProperty('devId')) { - $scope.selId = params['devId']; - wss.sendEvent(detailsReq, { id: $scope.selId }); - } - - function selCb($event, row) { - if ($scope.selId) { - wss.sendEvent(detailsReq, { id: row.id }); - } else { - $scope.hidePanel(); - } - $log.debug('Got a click on:', row); - } - - tbs.buildTable({ - scope: $scope, - tag: 'device', - selCb: selCb - }); - - $scope.nav = function (path) { - if ($scope.selId) { - ns.navTo(path, { devId: $scope.selId }); - } - }; - - $scope.$on('$destroy', function () { - wss.unbindHandlers(handlers); - }); - - $log.log('OvDeviceCtrl has been created'); - }]) - - .directive('deviceDetailsPanel', - ['$rootScope', '$window', '$timeout', 'KeyService', - function ($rootScope, $window, $timeout, ks) { - return function (scope) { - var unbindWatch; - - function heightCalc() { - pStartY = fs.noPxStyle(d3.select('.tabular-header'), 'height') - + mast.mastHeight() + topPdg; - wSize = fs.windowSize(pStartY); - pHeight = wSize.height; - } - - function initPanel() { - heightCalc(); - createDetailsPane(); - } - - // Safari has a bug where it renders the fixed-layout table wrong - // if you ask for the window's size too early - if (scope.onos.browser === 'safari') { - $timeout(initPanel); - } else { - initPanel(); - } - // create key bindings to handle panel - ks.keyBindings({ - enter: editNameSave, - esc: [handleEscape, 'Close the details panel'], - _helpFormat: ['esc'] - }); - ks.gestureNotes([ - ['click', 'Select a row to show device details'], - ['scroll down', 'See more devices'] - ]); - - // if the panelData changes - scope.$watch('panelData', function () { - if (!fs.isEmptyObject(scope.panelData)) { - populateDetails(scope.panelData); - detailsPanel.show(); - } - }); - - // if the window size changes - unbindWatch = $rootScope.$watchCollection( - function () { - return { - h: $window.innerHeight, - w: $window.innerWidth - }; - }, function () { - if (!fs.isEmptyObject(scope.panelData)) { - heightCalc(); - populateDetails(scope.panelData); - } - } - ); - - scope.$on('$destroy', function () { - unbindWatch(); - ks.unbindKeys(); - ps.destroyPanel(pName); - }); - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/flow/flow.css b/framework/src/onos/web/gui/src/main/webapp/app/view/flow/flow.css deleted file mode 100644 index 30226222..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/flow/flow.css +++ /dev/null @@ -1,85 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Flow View -- CSS file - */ - -#ov-flow h2 { - display: inline-block; -} - -#ov-flow div.ctrl-btns { -} - -.light #ov-flow .current-view use { - fill: white; -} -.dark #ov-flow .current-view use { - fill: #304860; -} - -.light #ov-flow .current-view rect { - fill: deepskyblue; -} -.dark #ov-flow .current-view rect { - fill: #eee; -} - -.light #ov-flow tr:nth-child(6n + 1), -.light #ov-flow tr:nth-child(6n + 2), -.light #ov-flow tr:nth-child(6n + 3) { - background-color: #eee; -} -.light #ov-flow tr:nth-child(6n + 4), -.light #ov-flow tr:nth-child(6n + 5), -.light #ov-flow tr:nth-child(6n) { - background-color: #ddd; -} -.dark #ov-flow tr:nth-child(6n + 1), -.dark #ov-flow tr:nth-child(6n + 2), -.dark #ov-flow tr:nth-child(6n + 3) { - background-color: #444; -} -.dark #ov-flow tr:nth-child(6n + 4), -.dark #ov-flow tr:nth-child(6n + 5), -.dark #ov-flow tr:nth-child(6n) { - background-color: #333; -} - -/* highlighted color */ -.light #ov-flow tr:nth-child(6n + 1).data-change, -.light #ov-flow tr:nth-child(6n + 2).data-change, -.light #ov-flow tr:nth-child(6n + 3).data-change, -.light #ov-flow tr:nth-child(6n + 4).data-change, -.light #ov-flow tr:nth-child(6n + 5).data-change, -.light #ov-flow tr:nth-child(6n).data-change { - background-color: #FDFFDC; -} -.dark #ov-flow tr:nth-child(6n + 1).data-change, -.dark #ov-flow tr:nth-child(6n + 2).data-change, -.dark #ov-flow tr:nth-child(6n + 3).data-change, -.dark #ov-flow tr:nth-child(6n + 4).data-change, -.dark #ov-flow tr:nth-child(6n + 5).data-change, -.dark #ov-flow tr:nth-child(6n).data-change { - background-color: #5A5600; -} - -#ov-flow td.selector, -#ov-flow td.treatment { - padding-left: 36px; - opacity: 0.65; -}
\ No newline at end of file diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/flow/flow.html b/framework/src/onos/web/gui/src/main/webapp/app/view/flow/flow.html deleted file mode 100644 index 8fc1839e..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/flow/flow.html +++ /dev/null @@ -1,89 +0,0 @@ -<!-- Flow partial HTML --> -<div id="ov-flow"> - <div class="tabular-header"> - <h2> - Flows for Device {{devId || "(No device selected)"}} - ({{tableData.length}} total) - </h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - - <div class="separator"></div> - - <div class="active" - icon icon-id="deviceTable" icon-size="36" - tooltip tt-msg="deviceTip" - ng-click="nav('device')"></div> - - <div class="current-view" - icon icon-id="flowTable" icon-size="36"></div> - - <div class="active" - icon icon-id="portTable" icon-size="36" - tooltip tt-msg="portTip" - ng-click="nav('port')"></div> - - <div class="active" - icon icon-id="groupTable" icon-size="36" - tooltip tt-msg="groupTip" - ng-click="nav('group')"></div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="id" col-width="180px" sortable>Flow ID </td> - <td colId="appId" sortable>App ID </td> - <td colId="groupId" sortable>Group ID </td> - <td colId="tableId" sortable>Table ID </td> - <td colId="priority" sortable>Priority </td> - <td colId="timeout" sortable>Timeout </td> - <td colId="permanent" sortable>Permanent </td> - <td colId="state" sortable>State </td> - <td colId="packets" sortable>Packets </td> - <td colId="bytes" sortable>Bytes </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="id"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="10"> - No Flows found - </td> - </tr> - - <tr ng-repeat-start="flow in tableData track by $index" - ng-repeat-complete row-id="{{flow.id}}"> - <td>{{flow.id}}</td> - <td>{{flow.appId}}</td> - <td>{{flow.groupId}}</td> - <td>{{flow.tableId}}</td> - <td>{{flow.priority}}</td> - <td>{{flow.timeout}}</td> - <td>{{flow.permanent}}</td> - <td>{{flow.state}}</td> - <td>{{flow.packets}}</td> - <td>{{flow.bytes}}</td> - </tr> - <tr row-id="{{flow.id}}"> - <td class="selector" colspan="10">{{flow.selector}}</td> - </tr> - <tr row-id="{{flow.id}}" ng-repeat-end> - <td class="treatment" colspan="10">{{flow.treatment}}</td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/flow/flow.js b/framework/src/onos/web/gui/src/main/webapp/app/view/flow/flow.js deleted file mode 100644 index 7bb988a2..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/flow/flow.js +++ /dev/null @@ -1,63 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Flow View Module - */ - -(function () { - 'use strict'; - - // injected references - var $log, $scope, $location, fs, tbs, ns; - - angular.module('ovFlow', []) - .controller('OvFlowCtrl', - ['$log', '$scope', '$location', - 'FnService', 'TableBuilderService', 'NavService', - - function (_$log_, _$scope_, _$location_, _fs_, _tbs_, _ns_) { - var params; - $log = _$log_; - $scope = _$scope_; - $location = _$location_; - fs = _fs_; - tbs = _tbs_; - ns = _ns_; - $scope.deviceTip = 'Show device table'; - $scope.portTip = 'Show port view for this device'; - $scope.groupTip = 'Show group view for this device'; - - params = $location.search(); - if (params.hasOwnProperty('devId')) { - $scope.devId = params['devId']; - } - - tbs.buildTable({ - scope: $scope, - tag: 'flow', - query: params - }); - - $scope.nav = function (path) { - if ($scope.devId) { - ns.navTo(path, { devId: $scope.devId }); - } - }; - - $log.log('OvFlowCtrl has been created'); - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/group/group.css b/framework/src/onos/web/gui/src/main/webapp/app/view/group/group.css deleted file mode 100644 index 6773aa83..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/group/group.css +++ /dev/null @@ -1,76 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Group View -- CSS file - */ - -#ov-group h2 { - display: inline-block; -} - -#ov-group div.ctrl-btns { -} - -.light #ov-group .current-view use { - fill: white; -} -.dark #ov-group .current-view use { - fill: #304860; -} - -.light #ov-group .current-view rect { - fill: deepskyblue; -} -.dark #ov-group .current-view rect { - fill: #eee; -} - -.light #ov-group tr:nth-child(4n + 1), -.light #ov-group tr:nth-child(4n + 2) { - background-color: #eee; -} -.light #ov-group tr:nth-child(4n + 3), -.light #ov-group tr:nth-child(4n) { - background-color: #ddd; -} -.dark #ov-group tr:nth-child(4n + 1), -.dark #ov-group tr:nth-child(4n + 2) { - background-color: #444; -} -.dark #ov-group tr:nth-child(4n + 3), -.dark #ov-group tr:nth-child(4n) { - background-color: #333; -} - -/* highlighted color */ -.light #ov-group tr:nth-child(4n + 1).data-change, -.light #ov-group tr:nth-child(4n + 2).data-change, -.light #ov-group tr:nth-child(4n + 3).data-change, -.light #ov-group tr:nth-child(4n).data-change { - background-color: #FDFFDC; -} -.dark #ov-group tr:nth-child(4n + 1).data-change, -.dark #ov-group tr:nth-child(4n + 2).data-change, -.dark #ov-group tr:nth-child(4n + 3).data-change, -.dark #ov-group tr:nth-child(4n).data-change { - background-color: #5A5600; -} - -#ov-group td.buckets { - padding-left: 36px; - opacity: 0.65; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/group/group.html b/framework/src/onos/web/gui/src/main/webapp/app/view/group/group.html deleted file mode 100644 index 93484dc8..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/group/group.html +++ /dev/null @@ -1,95 +0,0 @@ -<!-- - ~ Copyright 2015 Open Networking Laboratory - ~ - ~ Licensed under the Apache License, Version 2.0 (the "License"); - ~ you may not use this file except in compliance with the License. - ~ You may obtain a copy of the License at - ~ - ~ http://www.apache.org/licenses/LICENSE-2.0 - ~ - ~ Unless required by applicable law or agreed to in writing, software - ~ distributed under the License is distributed on an "AS IS" BASIS, - ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - ~ See the License for the specific language governing permissions and - ~ limitations under the License. - --> - -<!-- Group partial HTML --> -<div id="ov-group"> - <div class="tabular-header"> - <h2> - Groups for Device {{devId || "(No device selected)"}} - ({{tableData.length}} total) - </h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - - <div class="separator"></div> - - <div class="active" - icon icon-id="deviceTable" icon-size="36" - tooltip tt-msg="deviceTip" - ng-click="nav('device')"></div> - - <div class="active" - icon icon-id="flowTable" icon-size="36" - tooltip tt-msg="flowTip" - ng-click="nav('flow')"></div> - - <div class="active" - icon icon-id="portTable" icon-size="36" - tooltip tt-msg="portTip" - ng-click="nav('port')"></div> - - <div class="current-view" - icon icon-id="groupTable" icon-size="36"></div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="id" sortable>Group ID </td> - <td colId="app_id" sortable>App ID </td> - <td colId="state" sortable>State </td> - <td colId="type" sortable>Type </td> - <td colId="packets" sortable>Packets </td> - <td colId="bytes" sortable>Bytes </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="id"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="6"> - No Groups found - </td> - </tr> - - <tr ng-repeat-start="group in tableData track by $index" - ng-repeat-complete row-id="{{group.id}}"> - <td>{{group.id}}</td> - <td>{{group.app_id}}</td> - <td>{{group.state}}</td> - <td>{{group.type}}</td> - <td>{{group.packets}}</td> - <td>{{group.bytes}}</td> - </tr> - <tr row-id="{{group.id}}" ng-repeat-end> - <td class="buckets" colspan="6" - ng-bind-html="group.buckets"></td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/group/group.js b/framework/src/onos/web/gui/src/main/webapp/app/view/group/group.js deleted file mode 100644 index 2cb1f0c4..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/group/group.js +++ /dev/null @@ -1,71 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Group View Module - */ - -(function () { - 'use strict'; - - // injected references - var $log, $scope, $location, fs, tbs, ns; - - angular.module('ovGroup', []) - .controller('OvGroupCtrl', - ['$log', '$scope', '$location', '$sce', - 'FnService', 'TableBuilderService', 'NavService', - - function (_$log_, _$scope_, _$location_, $sce, _fs_, _tbs_, _ns_) { - var params; - $log = _$log_; - $scope = _$scope_; - $location = _$location_; - fs = _fs_; - tbs = _tbs_; - ns = _ns_; - $scope.deviceTip = 'Show device table'; - $scope.flowTip = 'Show flow view for this device'; - $scope.portTip = 'Show port view for this device'; - - params = $location.search(); - if (params.hasOwnProperty('devId')) { - $scope.devId = params['devId']; - } - - tbs.buildTable({ - scope: $scope, - tag: 'group', - query: params - }); - - $scope.$watch('tableData', function () { - if (!fs.isEmptyObject($scope.tableData)) { - $scope.tableData.forEach(function (group) { - group.buckets = $sce.trustAsHtml(group.buckets); - }); - } - }); - - $scope.nav = function (path) { - if ($scope.devId) { - ns.navTo(path, { devId: $scope.devId }); - } - }; - - $log.log('OvGroupCtrl has been created'); - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/host/host.css b/framework/src/onos/web/gui/src/main/webapp/app/view/host/host.css deleted file mode 100644 index 60672759..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/host/host.css +++ /dev/null @@ -1,27 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Host View -- CSS file - */ - -#ov-host h2 { - display: inline-block; -} - -#ov-host div.ctrl-btns { - width: 45px; -}
\ No newline at end of file diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/host/host.html b/framework/src/onos/web/gui/src/main/webapp/app/view/host/host.html deleted file mode 100644 index 19a7ee1d..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/host/host.html +++ /dev/null @@ -1,54 +0,0 @@ -<!-- Host partial HTML --> -<div id="ov-host"> - <div class="tabular-header"> - <h2>Hosts ({{tableData.length}} total)</h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="type" class="table-icon" sortable></td> - <td colId="id" sortable>Host ID </td> - <td colId="mac" sortable>MAC Address </td> - <td colId="vlan" sortable>VLAN ID </td> - <td colId="ips" sortable>IP Addresses </td> - <td colId="location" sortable>Location </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="id"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="6"> - No Hosts found - </td> - </tr> - - <tr ng-repeat="host in tableData track by $index" - ng-repeat-complete row-id="{{host.id}}"> - <td class="table-icon"> - <div icon icon-id="{{host._iconid_type}}"></div> - </td> - <td>{{host.id}}</td> - <td>{{host.mac}}</td> - <td>{{host.vlan}}</td> - <td>{{host.ips}}</td> - <td>{{host.location}}</td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/host/host.js b/framework/src/onos/web/gui/src/main/webapp/app/view/host/host.js deleted file mode 100644 index 1ccca401..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/host/host.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Host View Module - */ - -(function () { - 'use strict'; - - angular.module('ovHost', []) - .controller('OvHostCtrl', - ['$log', '$scope', 'TableBuilderService', - - function ($log, $scope, tbs) { - tbs.buildTable({ - scope: $scope, - tag: 'host' - }); - - $log.log('OvHostCtrl has been created'); - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/intent/intent.css b/framework/src/onos/web/gui/src/main/webapp/app/view/intent/intent.css deleted file mode 100644 index dfa50c37..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/intent/intent.css +++ /dev/null @@ -1,70 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Intent View -- CSS file - */ - -#ov-intent h2 { - display: inline-block; -} - -#ov-intent div.ctrl-btns { -} - -.light #ov-intent tr:nth-child(6n + 1), -.light #ov-intent tr:nth-child(6n + 2), -.light #ov-intent tr:nth-child(6n + 3) { - background-color: #eee; -} -.light #ov-intent tr:nth-child(6n + 4), -.light #ov-intent tr:nth-child(6n + 5), -.light #ov-intent tr:nth-child(6n) { - background-color: #ddd; -} -.dark #ov-intent tr:nth-child(6n + 1), -.dark #ov-intent tr:nth-child(6n + 2), -.dark #ov-intent tr:nth-child(6n + 3) { - background-color: #444; -} -.dark #ov-intent tr:nth-child(6n + 4), -.dark #ov-intent tr:nth-child(6n + 5), -.dark #ov-intent tr:nth-child(6n) { - background-color: #333; -} - -.light #ov-intent tr:nth-child(6n + 1).data-change, -.light #ov-intent tr:nth-child(6n + 2).data-change, -.light #ov-intent tr:nth-child(6n + 3).data-change, -.light #ov-intent tr:nth-child(6n + 4).data-change, -.light #ov-intent tr:nth-child(6n + 5).data-change, -.light #ov-intent tr:nth-child(6n).data-change { - background-color: #FDFFDC; -} -.dark #ov-intent tr:nth-child(6n + 1).data-change, -.dark #ov-intent tr:nth-child(6n + 2).data-change, -.dark #ov-intent tr:nth-child(6n + 3).data-change, -.dark #ov-intent tr:nth-child(6n + 4).data-change, -.dark #ov-intent tr:nth-child(6n + 5).data-change, -.dark #ov-intent tr:nth-child(6n).data-change { - background-color: #5A5600; -} - -#ov-intent td.resources, -#ov-intent td.details { - padding-left: 36px; - opacity: 0.65; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/intent/intent.html b/framework/src/onos/web/gui/src/main/webapp/app/view/intent/intent.html deleted file mode 100644 index 98aa5659..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/intent/intent.html +++ /dev/null @@ -1,67 +0,0 @@ -<!-- Intent partial HTML --> -<div id="ov-intent"> - <div class="tabular-header"> - <h2>Intents ({{tableData.length}} total)</h2> - <div class="ctrl-btns"> - <div ng-class="{active: !!selId}" - icon icon-id="topo" icon-size="36" - tooltip tt-msg="topoTip" - ng-click="showIntent()"></div> - <div class="separator"></div> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="appId" sortable>Application ID </td> - <td colId="key" sortable>Key </td> - <td colId="type" sortable>Type </td> - <td colId="priority" sortable>Priority </td> - <td colId="state" sortable>State </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="key"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="5"> - No Intents found - </td> - </tr> - - <tr ng-repeat-start="intent in tableData track by $index" - ng-click="selectCallback($event, intent)" - ng-class="{selected: intent.key === selId}" - ng-repeat-complete row-id="{{intent.key}}"> - <td>{{intent.appId}}</td> - <td>{{intent.key}}</td> - <td>{{intent.type}}</td> - <td>{{intent.priority}}</td> - <td>{{intent.state}}</td> - </tr> - <tr ng-click="selectCallback($event, intent)" - ng-class="{selected: intent.key === selId}" - row-id="{{intent.key}}"> - <td class="resources" colspan="5">{{intent.resources}}</td> - </tr> - <tr ng-click="selectCallback($event, intent)" - ng-class="{selected: intent.key === selId}" - row-id="{{intent.key}}" ng-repeat-end> - <td class="details" colspan="5">{{intent.details}}</td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/intent/intent.js b/framework/src/onos/web/gui/src/main/webapp/app/view/intent/intent.js deleted file mode 100644 index 19f2c076..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/intent/intent.js +++ /dev/null @@ -1,59 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Intent View Module - */ - -(function () { - 'use strict'; - - angular.module('ovIntent', []) - .controller('OvIntentCtrl', - ['$log', '$scope', 'TableBuilderService', 'NavService', - - function ($log, $scope, tbs, ns) { - - function selCb($event, row) { - $log.debug('Got a click on:', row); - var m = /(\d+)\s:\s(.*)/.exec(row.appId), - id = m ? m[1] : null, - name = m ? m[2] : null; - - $scope.intentData = ($scope.selId && m) ? { - intentAppId: id, - intentAppName: name, - intentKey: row.key - } : null; - } - - tbs.buildTable({ - scope: $scope, - tag: 'intent', - selCb: selCb, - idKey: 'key' - }); - - $scope.topoTip = 'Show selected intent on topology view'; - - $scope.showIntent = function () { - var d = $scope.intentData; - d && ns.navTo('topo', d); - }; - - $log.log('OvIntentCtrl has been created'); - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/link/link.css b/framework/src/onos/web/gui/src/main/webapp/app/view/link/link.css deleted file mode 100644 index 4f049cdb..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/link/link.css +++ /dev/null @@ -1,27 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Link View -- CSS file - */ - -#ov-link h2 { - display: inline-block; -} - -#ov-link div.ctrl-btns { - width: 45px; -}
\ No newline at end of file diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/link/link.html b/framework/src/onos/web/gui/src/main/webapp/app/view/link/link.html deleted file mode 100644 index 371d6b13..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/link/link.html +++ /dev/null @@ -1,70 +0,0 @@ -<!-- - ~ Copyright 2015 Open Networking Laboratory - ~ - ~ Licensed under the Apache License, Version 2.0 (the "License"); - ~ you may not use this file except in compliance with the License. - ~ You may obtain a copy of the License at - ~ - ~ http://www.apache.org/licenses/LICENSE-2.0 - ~ - ~ Unless required by applicable law or agreed to in writing, software - ~ distributed under the License is distributed on an "AS IS" BASIS, - ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - ~ See the License for the specific language governing permissions and - ~ limitations under the License. - --> - -<!-- Link partial HTML --> -<div id="ov-link"> - <div class="tabular-header"> - <h2>Links ({{tableData.length}} total)</h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="_iconid_state" class="table-icon" sortable></td> - <td colId="one" sortable>Port 1 </td> - <td colId="two" sortable>Port 2 </td> - <td colId="type" sortable>Type </td> - <td colId="direction" sortable>Direction </td> - <td colId="durable" sortable>Durable </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="one"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="6"> - No Links found - </td> - </tr> - - <tr ng-repeat="link in tableData track by $index" - ng-repeat-complete row-id="{{link.one}}"> - <td class="table-icon"> - <div icon icon-id="{{link._iconid_state}}"></div> - </td> - <td>{{link.one}}</td> - <td>{{link.two}}</td> - <td>{{link.type}}</td> - <td ng-bind-html="link.direction"></td> - <td>{{link.durable}}</td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/link/link.js b/framework/src/onos/web/gui/src/main/webapp/app/view/link/link.js deleted file mode 100644 index fcf2a83e..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/link/link.js +++ /dev/null @@ -1,44 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Host View Module - */ - -(function () { - 'use strict'; - - angular.module('ovLink', []) - .controller('OvLinkCtrl', - ['$log', '$scope', '$sce', 'FnService', 'TableBuilderService', - - function ($log, $scope, $sce, fs, tbs) { - tbs.buildTable({ - scope: $scope, - tag: 'link' - }); - - $scope.$watch('tableData', function () { - if (!fs.isEmptyObject($scope.tableData)) { - $scope.tableData.forEach(function (link) { - link.direction = $sce.trustAsHtml(link.direction); - }); - } - }); - - $log.log('OvLinkCtrl has been created'); - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/port/port.css b/framework/src/onos/web/gui/src/main/webapp/app/view/port/port.css deleted file mode 100644 index 2aaacfce..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/port/port.css +++ /dev/null @@ -1,48 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Port View -- CSS file - */ - -#ov-port h2 { - display: inline-block; -} - -#ov-port div.ctrl-btns { -} - -.light #ov-port .current-view use { - fill: white; -} -.dark #ov-port .current-view use { - fill: #304860; -} - -.light #ov-port .current-view rect { - fill: deepskyblue; -} -.dark #ov-port .current-view rect { - fill: #eee; -} - -#ov-port td { - text-align: right; -} - -#ov-port tr.no-data td { - text-align: center; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/port/port.html b/framework/src/onos/web/gui/src/main/webapp/app/view/port/port.html deleted file mode 100644 index fa79e5ea..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/port/port.html +++ /dev/null @@ -1,95 +0,0 @@ -<!-- - ~ Copyright 2015 Open Networking Laboratory - ~ - ~ Licensed under the Apache License, Version 2.0 (the "License"); - ~ you may not use this file except in compliance with the License. - ~ You may obtain a copy of the License at - ~ - ~ http://www.apache.org/licenses/LICENSE-2.0 - ~ - ~ Unless required by applicable law or agreed to in writing, software - ~ distributed under the License is distributed on an "AS IS" BASIS, - ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - ~ See the License for the specific language governing permissions and - ~ limitations under the License. - --> - -<!-- Port partial HTML --> -<div id="ov-port"> - <div class="tabular-header"> - <h2> - Port Statistics for Device {{devId || "(No device selected)"}} - ({{tableData.length}} Ports total) - </h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - - <div class="separator"></div> - - <div class="active" - icon icon-id="deviceTable" icon-size="36" - tooltip tt-msg="deviceTip" - ng-click="nav('device')"></div> - - <div class="active" - icon icon-id="flowTable" icon-size="36" - tooltip tt-msg="flowTip" - ng-click="nav('flow')"></div> - - <div class="current-view" - icon icon-id="portTable" icon-size="36"></div> - - <div class="active" - icon icon-id="groupTable" icon-size="36" - tooltip tt-msg="groupTip" - ng-click="nav('group')"></div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="id" col-width="60px" sortable>Port ID </td> - <td colId="pkt_rx" sortable>Pkts Received </td> - <td colId="pkt_tx" sortable>Pkts Sent </td> - <td colId="bytes_rx" sortable>Bytes Received </td> - <td colId="bytes_tx" sortable>Bytes Sent </td> - <td colId="pkt_rx_drp" sortable>Pkts Received Dropped </td> - <td colId="pkt_tx_drp" sortable>Pkts Sent Dropped </td> - <td colId="duration" sortable>Duration (sec) </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="id"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="8"> - No Ports found - </td> - </tr> - - <tr ng-repeat="port in tableData track by $index" - ng-repeat-complete row-id="{{port.id}}"> - <td>{{port.id}}</td> - <td>{{port.pkt_rx}}</td> - <td>{{port.pkt_tx}}</td> - <td>{{port.bytes_rx}}</td> - <td>{{port.bytes_tx}}</td> - <td>{{port.pkt_rx_drp}}</td> - <td>{{port.pkt_tx_drp}}</td> - <td>{{port.duration}}</td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/port/port.js b/framework/src/onos/web/gui/src/main/webapp/app/view/port/port.js deleted file mode 100644 index 1e8585dd..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/port/port.js +++ /dev/null @@ -1,63 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Port View Module - */ - -(function () { - 'use strict'; - - // injected references - var $log, $scope, $location, fs, tbs, ns; - - angular.module('ovPort', []) - .controller('OvPortCtrl', - ['$log', '$scope', '$location', - 'FnService', 'TableBuilderService', 'NavService', - - function (_$log_, _$scope_, _$location_, _fs_, _tbs_, _ns_) { - var params; - $log = _$log_; - $scope = _$scope_; - $location = _$location_; - fs = _fs_; - tbs = _tbs_; - ns = _ns_; - $scope.deviceTip = 'Show device table'; - $scope.flowTip = 'Show flow view for this device'; - $scope.groupTip = 'Show group view for this device'; - - params = $location.search(); - if (params.hasOwnProperty('devId')) { - $scope.devId = params['devId']; - } - - tbs.buildTable({ - scope: $scope, - tag: 'port', - query: params - }); - - $scope.nav = function (path) { - if ($scope.devId) { - ns.navTo(path, { devId: $scope.devId }); - } - }; - - $log.log('OvPortCtrl has been created'); - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/processor/processor.css b/framework/src/onos/web/gui/src/main/webapp/app/view/processor/processor.css deleted file mode 100644 index 12cf6377..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/processor/processor.css +++ /dev/null @@ -1,49 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Processor View -- CSS file - */ - -#ov-processor h2 { - display: inline-block; -} - -#ov-processor div.ctrl-btns { - width: 40px; -} - -.light #ov-processor .current-view use { - fill: white; -} -.dark #ov-processor .current-view use { - fill: #304860; -} - -.light #ov-processor .current-view rect { - fill: deepskyblue; -} -.dark #ov-processor .current-view rect { - fill: #eee; -} - -#ov-processor td.number { - text-align: right; -} - -#ov-processor tr.no-data td { - text-align: center; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/processor/processor.html b/framework/src/onos/web/gui/src/main/webapp/app/view/processor/processor.html deleted file mode 100644 index 1c615041..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/processor/processor.html +++ /dev/null @@ -1,63 +0,0 @@ -<!-- processor partial HTML --> -<div id="ov-processor"> - <div class="tabular-header"> - <h2> - Packet Processors ({{tableData.length}} Processors total) - </h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - <!-- - <div class="separator"></div> - - <div class="current-view" - icon icon-id="processorTable" icon-size="36"></div> - - <div class="active" - icon icon-id="requestTable" icon-size="36"git sta - tooltip tt-msg="requestTip" - ng-click="nav('request')"></div> - --> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td class="number" colId="priority" sortable col-width="80px">Priority </td> - <td colId="type" sortable col-width="80px">Type </td> - <td colId="processor" sortable col-width="500px">Class </td> - <td class="number" colId="packets" sortable col-width="100px">Packets </td> - <td class="number" colId="avgMillis" sortable col-width="100px">Average (ms) </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="id"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="5"> - No Processors found - </td> - </tr> - - <tr ng-repeat="processor in tableData track by $index" - ng-repeat-complete row-id="{{processor.id}}"> - <td class="number">{{processor.priority}}</td> - <td>{{processor.type}}</td> - <td>{{processor.processor}}</td> - <td class="number">{{processor.packets}}</td> - <td class="number">{{processor.avgMillis}}</td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/processor/processor.js b/framework/src/onos/web/gui/src/main/webapp/app/view/processor/processor.js deleted file mode 100644 index 89d717b6..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/processor/processor.js +++ /dev/null @@ -1,58 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Packet Processor View Module - */ - -(function () { - 'use strict'; - - // injected references - var $log, $scope, $location, fs, tbs, ns; - - angular.module('ovProcessor', []) - .controller('OvProcessorCtrl', - ['$log', '$scope', '$location', - 'FnService', 'TableBuilderService', 'NavService', - - function (_$log_, _$scope_, _$location_, _fs_, _tbs_, _ns_) { - var params; - $log = _$log_; - $scope = _$scope_; - $location = _$location_; - fs = _fs_; - tbs = _tbs_; - ns = _ns_; - $scope.requestTip = 'Show packet requests'; - - params = $location.search(); - - tbs.buildTable({ - scope: $scope, - tag: 'processor', - query: params - }); - - $scope.nav = function (path) { - if ($scope.devId) { - ns.navTo(path); - } - }; - - $log.log('OvProcessorCtrl has been created'); - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/settings/settings.css b/framework/src/onos/web/gui/src/main/webapp/app/view/settings/settings.css deleted file mode 100644 index e748c5ac..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/settings/settings.css +++ /dev/null @@ -1,27 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Settings View -- CSS file - */ - -#ov-settings h2 { - display: inline-block; -} - -#ov-settings div.ctrl-btns { - width: 45px; -} diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/settings/settings.html b/framework/src/onos/web/gui/src/main/webapp/app/view/settings/settings.html deleted file mode 100644 index 61081017..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/settings/settings.html +++ /dev/null @@ -1,52 +0,0 @@ -<!-- settings partial HTML --> -<div id="ov-settings"> - <div class="tabular-header"> - <h2>Component Settings ({{tableData.length}} total)</h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="component" sortable col-width="300px">Component </td> - <td colId="id" sortable>Property </td> - <td colId="type" sortable col-width="70px">Type </td> - <td colId="value" sortable>Value </td> - <td colId="defValue" sortable>Default </td> - <td colId="desc" col-width="400px">Description </td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="id"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="6"> - No Settings found - </td> - </tr> - - <tr ng-repeat="prop in tableData track by $index" - ng-repeat-complete row-id="{{prop.id}}"> - <td>{{prop.component}}</td> - <td>{{prop.id}}</td> - <td>{{prop.type}}</td> - <td>{{prop.value}}</td> - <td>{{prop.defValue}}</td> - <td>{{prop.desc}}</td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/settings/settings.js b/framework/src/onos/web/gui/src/main/webapp/app/view/settings/settings.js deleted file mode 100644 index cec0e70e..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/settings/settings.js +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Component Settings View Module - */ - -(function () { - 'use strict'; - - angular.module('ovSettings', []) - .controller('OvSettingsCtrl', - ['$log', '$scope', 'TableBuilderService', - - function ($log, $scope, tbs) { - tbs.buildTable({ - scope: $scope, - tag: 'setting' - }); - - $log.log('OvSettingsCtrl has been created'); - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/README.txt b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/README.txt deleted file mode 100644 index 61089bf6..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/README.txt +++ /dev/null @@ -1,3 +0,0 @@ -# ONOS Topology View - -Code and resources for implementing the client-side for the Topology View. diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.css b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.css deleted file mode 100644 index 0319b9b7..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.css +++ /dev/null @@ -1,780 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology View -- CSS file - */ - -/* --- Base SVG Layer --- */ - -#ov-topo svg { - /* prevents the little cut/copy/paste square that would appear on iPad */ - -webkit-user-select: none; -} -.light #ov-topo svg { - background-color: #fff; -} -.dark #ov-topo svg { - background-color: #2b2b2b; -} - - -/* --- "No Devices" Layer --- */ - -#ov-topo svg #topo-noDevsLayer { - visibility: hidden; -} - -.light #ov-topo svg .noDevsBird { - fill: #ecd; -} -.dark #ov-topo svg .noDevsBird { - fill: #683434; -} - -#ov-topo svg #topo-noDevsLayer text { - font-size: 60pt; - font-style: italic; -} -.light #ov-topo svg #topo-noDevsLayer text { - fill: #dde; -} -.dark #ov-topo svg #topo-noDevsLayer text { - fill: #3b3b4f; -} - - -/* --- Topo Map --- */ - -#ov-topo svg #topo-map { - stroke-width: 2px; - fill: transparent; -} - -.light #ov-topo svg #topo-map { - stroke: #ddd; -} -.dark #ov-topo svg #topo-map { - stroke: #444; -} - - -/* --- Topo Summary Panel --- */ - -#topo-p-summary { - /* Base css from panel.css */ -} - -/* --- Topo Detail Panel --- */ - -#topo-p-detail { - /* Base css from panel.css */ - top: 338px; -} -html[data-platform='iPad'] #topo-p-detail { - top: 354px; -} - -#topo-p-detail .actionBtns .actionBtn { - display: inline-block; -} -#topo-p-detail .actionBtns .actionBtn svg { - width: 30px; - height: 30px; -} - -/* --- Topo Dialog Panel --- */ - -#topo-p-dialog .dialog-button { - display: inline-block; - cursor: pointer; - height: 20px; - padding: 2px 6px; - margin: 4px; - float: right; -} - -.light #topo-p-dialog .dialog-button { - background-color: #fec; -} -.dark #topo-p-dialog .dialog-button { - background-color: #369; -} - -/* --- general topo-panel styling --- */ - -.topo-p div.header div.icon { - vertical-align: middle; - display: inline-block; -} -.topo-p div.body { - overflow-y: scroll; -} - -.topo-p div.body::-webkit-scrollbar { - display: none; -} - -.topo-p svg { - display: inline-block; - width: 42px; - height: 42px; -} - -.light .topo-p svg .glyph { - fill: #222; -} - -.dark .topo-p svg .glyph.overlay { - fill: #222; -} - -.dark .topo-p svg .glyph { - fill: #ddd; -} -.light .topo-p svg .glyph.overlay { - fill: #fff; -} - - -.topo-p h2 { - padding: 0 4px; - margin: 0; - word-wrap: break-word; - display: inline-block; - width: 210px; - vertical-align: middle; -} -.light .topo-p h2 { - color: black; -} -.dark .topo-p h2 { - color: #ddd; -} - -.topo-p h3 { - padding: 0 4px; - margin: 0; - word-wrap: break-word; - top: 20px; - left: 50px; -} -.light .topo-p h3 { - color: black; -} -.dark .topo-p h3 { - color: #ddd; -} - -.topo-p p, table { - padding: 4px; - margin: 0; -} - -.topo-p td { - word-wrap: break-word; -} -.topo-p td.label { - font-style: italic; - padding-right: 12px; - /* works for both light and dark themes ... */ - color: #777; -} -.topo-p td.value { -} - -.topo-p hr { - height: 1px; - border: 0; -} -.light .topo-p hr { - background-color: #ccc; - color: #ccc; -} -.dark .topo-p hr { - background-color: #888; - color: #888; -} - -/* --- Topo Instance Panel --- */ - -#topo-p-instance { - height: 100px; -} - -#topo-p-instance div.onosInst { - display: inline-block; - width: 170px; - height: 85px; - cursor: pointer; -} - -#topo-p-instance svg rect { - stroke-width: 3.5; -} -#topo-p-instance .online svg rect { - opacity: 1; -} -.light #topo-p-instance svg rect { - fill: #ccc; - stroke: #aaa; -} -.light #topo-p-instance .online svg rect { - fill: #9cf; - stroke: #555; -} -.dark #topo-p-instance svg rect { - fill: #666; - stroke: #222; -} -.dark #topo-p-instance .online svg rect { - fill: #9cf; - stroke: #999; -} - - -#topo-p-instance svg .glyph { - fill: #888; - fill-rule: evenodd; -} -#topo-p-instance .online svg .glyph { - fill: #000; -} - -#topo-p-instance svg .badgeIcon { - fill-rule: evenodd; - opacity: 0.4; -} -.light #topo-p-instance svg .badgeIcon { - fill: #777; -} -.dark #topo-p-instance svg .badgeIcon { - fill: #555; -} - -#topo-p-instance .online svg .badgeIcon { - opacity: 1.0; -} -.light #topo-p-instance .online svg .badgeIcon { - fill: #fff; -} -.dark #topo-p-instance .online svg .badgeIcon { - fill: #fff; -} - -#topo-p-instance svg text { - text-anchor: middle; - opacity: 0.3; -} -#topo-p-instance .online svg text { - opacity: 1.0; -} -.light #topo-p-instance svg text { - fill: #444; -} -.light #topo-p-instance .online svg text { - fill: #eee; -} -.dark #topo-p-instance svg text { - fill: #aaa; -} -.dark #topo-p-instance .online svg text { - fill: #ccc; -} - -#topo-p-instance svg text.instTitle { - font-size: 11pt; - font-weight: bold; -} -#topo-p-instance svg text.instLabel { - font-size: 9pt; - font-style: italic; -} - -#topo-p-instance .onosInst.mastership { - opacity: 0.3; -} -#topo-p-instance .onosInst.mastership.affinity { - opacity: 1.0; -} -.light #topo-p-instance .onosInst.mastership.affinity svg rect { - filter: url(#blue-glow); -} -.dark #topo-p-instance .onosInst.mastership.affinity svg rect { - filter: url(#yellow-glow); -} -.light.firefox #topo-p-instance .onosInst.mastership.affinity svg rect { - filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"blue-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.7 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#blue-glow"); -} -.dark.firefox #topo-p-instance .onosInst.mastership.affinity svg rect { - filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"yellow-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 1.0 0 0 0 0 1.0 0 0 0 0 0.3 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#yellow-glow"); -} - - -/* --- Toolbar --- */ - -#toolbar-topo-tbar .tbar-row.right { - width: 100%; -} - -#toolbar-topo-tbar .tbar-row-text { - height: 21px; - text-align: right; - padding: 8px 60px 0 0; - font-style: italic; -} - - -/* --- Topo Nodes --- */ - -#ov-topo svg .suppressed { - opacity: 0.5 !important; -} - -#ov-topo svg .suppressedmax { - opacity: 0.2 !important; -} - -#ov-topo svg .node { - cursor: pointer; -} - -.light #ov-topo svg .node.selected rect, -.light #ov-topo svg .node.selected circle { - fill: #f90; - filter: url(#blue-glow); -} -.dark #ov-topo svg .node.selected rect, -.dark #ov-topo svg .node.selected circle { - fill: #f90; - filter: url(#yellow-glow); -} -.light.firefox #ov-topo svg .node.selected rect, -.light.firefox #ov-topo svg .node.selected circle { - filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"blue-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.7 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#blue-glow"); -} -.dark.firefox #ov-topo svg .node.selected rect, -.dark.firefox #ov-topo svg .node.selected circle { - filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"yellow-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 1.0 0 0 0 0 1.0 0 0 0 0 0.3 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#yellow-glow"); -} - -#ov-topo svg .node text { - pointer-events: none; -} - -/* Device Nodes */ - -#ov-topo svg .node.device { -} - -#ov-topo svg .node.device rect { - stroke-width: 1.5; -} - -#ov-topo svg .node.device.fixed rect { - stroke-width: 1.5; -} -.light #ov-topo svg .node.device.fixed rect { - stroke: #aaa; -} -.dark #ov-topo svg .node.device.fixed rect { - stroke: #999; -} - -/* note: device is offline without the 'online' class */ -.light #ov-topo svg .node.device { - fill: #777; -} -.dark #ov-topo svg .node.device { - fill: #555; -} - -.light #ov-topo svg .node.device rect { - stroke: #666; -} -.light #ov-topo svg .node.device rect { - stroke: #999; -} - -.light #ov-topo svg .node.device.online { - fill: #6e7fa3; -} -.dark #ov-topo svg .node.device.online { - fill: #4E5C7F; -} - -/* note: device is offline without the 'online' class */ -#ov-topo svg .node.device text { - fill: #bbb; - font: 10pt sans-serif; -} - -#ov-topo svg .node.device.online text { - fill: white; -} - -#ov-topo svg .node.device .svgIcon rect { - fill: #aaa; -} -#ov-topo svg .node.device .svgIcon use { - fill: #777; -} -#ov-topo svg .node.device.selected .svgIcon rect { - fill: #f90; -} -#ov-topo svg .node.device.online .svgIcon rect { - fill: #ccc; -} -#ov-topo svg .node.device.online .svgIcon use { - fill: #000; -} -#ov-topo svg .node.device.online.selected .svgIcon rect { - fill: #f90; -} - -/* Badges */ -/* (... works for both light and dark themes...) */ -#ov-topo svg .node .badge circle { - stroke: #aaa; -} - -#ov-topo svg .node .badge.badgeInfo circle { - fill: #99d; -} - -#ov-topo svg .node .badge.badgeWarn circle { - fill: #da2; -} - -#ov-topo svg .node .badge.badgeError circle { - fill: #e44; -} - -#ov-topo svg .node .badge use { - fill: white !important; -} - -#ov-topo svg .node .badge.badgeInfo use { - fill: #448; -} - -#ov-topo svg .node .badge text { - fill: white !important; -} - -#ov-topo svg .node .badge.badgeInfo text { - fill: #448; -} - -/* Host Nodes */ - -#ov-topo svg .node.host { -} - -#ov-topo svg .node.host text { - stroke: none; - font: 9pt sans-serif; -} -.light #ov-topo svg .node.host text { - fill: #846; -} -.dark #ov-topo svg .node.host text { - fill: #BB809D; -} - -.light svg .node.host circle { - stroke: #000; - fill: #edb; -} -.dark svg .node.host circle { - stroke: #eee; - fill: #B2A180; -} - -.light svg .node.host .svgIcon { - fill: #444; -} -.dark svg .node.host .svgIcon { - fill: #222; -} - -/* --- Topo Links --- */ - -#ov-topo svg .link { - opacity: .9; -} - -#ov-topo svg .link.selected, -#ov-topo svg .link.enhanced { - stroke-width: 4.5px; -} -.light #ov-topo svg .link.selected, -.light #ov-topo svg .link.enhanced { - filter: url(#blue-glow); -} -.dark #ov-topo svg .link.selected, -.dark #ov-topo svg .link.enhanced { - filter: url(#yellow-glow); -} -.light.firefox #ov-topo svg .link.selected, -.light.firefox #ov-topo svg .link.enhanced { - filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"blue-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.7 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#blue-glow"); -} -.dark.firefox #ov-topo svg .link.selected, -.dark.firefox #ov-topo svg .link.enhanced { - filter: url("data:image/svg+xml;utf8, <svg xmlns = \'http://www.w3.org/2000/svg\'><filter x=\"-50%\" y=\"-50%\" width=\"200%\" height=\"200%\" id=\"yellow-glow\"><feColorMatrix type=\"matrix\" values=\"0 0 0 0 1.0 0 0 0 0 1.0 0 0 0 0 0.3 0 0 0 1 0 \"></feColorMatrix><feGaussianBlur stdDeviation=\"3\" result=\"coloredBlur\"></feGaussianBlur><feMerge><feMergeNode in=\"coloredBlur\"></feMergeNode><feMergeNode in=\"SourceGraphic\"></feMergeNode></feMerge></filter></svg>#yellow-glow"); - -} - -#ov-topo svg .link.inactive { - opacity: .5; - stroke-dasharray: 8 4; -} - -#ov-topo svg .link.secondary { - stroke-width: 3px; -} -.light #ov-topo svg .link.secondary { - stroke: rgba(0,153,51,0.5); -} -.dark #ov-topo svg .link.secondary { - stroke: rgba(121,231,158,0.5); -} - -/* Port traffic color visualization for Kbps, Mbps, and Gbps */ - -.light #ov-topo svg .link.secondary.port-traffic-Kbps { - stroke: rgb(0,153,51); - stroke-width: 5.0; -} -.dark #ov-topo svg .link.secondary.port-traffic-Kbps { - stroke: rgb(98, 153, 118); - stroke-width: 5.0; -} - -.light #ov-topo svg .link.secondary.port-traffic-Mbps { - stroke: rgb(128,145,27); - stroke-width: 6.5; -} -.dark #ov-topo svg .link.secondary.port-traffic-Mbps { - stroke: rgb(91, 109, 54); - stroke-width: 6.5; -} - -.light #ov-topo svg .link.secondary.port-traffic-Gbps { - stroke: rgb(255, 137, 3); - stroke-width: 8.0; -} -.dark #ov-topo svg .link.secondary.port-traffic-Gbps { - stroke: rgb(174, 119, 55); - stroke-width: 8.0; -} - -.light #ov-topo svg .link.secondary.port-traffic-Gbps-choked { - stroke: rgb(183, 30, 21); - stroke-width: 8.0; -} -.dark #ov-topo svg .link.secondary.port-traffic-Gbps-choked { - stroke: rgb(127, 40, 39); - stroke-width: 8.0; -} - - -#ov-topo svg .link.animated { - stroke-dasharray: 8 5; - animation: ants 5s infinite linear; - /* below line will be added via Javascript based on path */ - /*animation-direction: reverse;*/ -} -@keyframes ants { - from { - stroke-dashoffset: 0; - } - to { - stroke-dashoffset: 400; - } -} - -#ov-topo svg .link.primary { - stroke-width: 4px; -} -.light #ov-topo svg .link.primary { - stroke: #ffA300; -} -.dark #ov-topo svg .link.primary { - stroke: #D58E0F; -} - -#ov-topo svg .link.secondary.optical { - stroke-width: 4px; -} -.light #ov-topo svg .link.secondary.optical { - stroke: rgba(128,64,255,0.5); -} -.dark #ov-topo svg .link.secondary.optical { - stroke: rgba(164,139,215,0.5); -} - -#ov-topo svg .link.primary.optical { - stroke-width: 6px; -} -.light #ov-topo svg .link.primary.optical { - stroke: #74f; -} -.dark #ov-topo svg .link.primary.optical { - stroke: #7352CD; -} - -/* Link Labels */ - -#ov-topo svg .linkLabel rect { - stroke: none; -} -.light #ov-topo svg .linkLabel rect { - fill: #eee; -} -.dark #ov-topo svg .linkLabel rect { - fill: #555; -} - -#ov-topo svg .linkLabel text { - text-anchor: middle; - stroke-width: 0.1; - font-size: 9pt; -} -.light #ov-topo svg .linkLabel text { - fill: #444; -} -.dark #ov-topo svg .linkLabel text { - fill: #eee; -} - -/* Port Labels */ - -#ov-topo svg .portLabel rect { - stroke: none; -} -.light #ov-topo svg .portLabel rect { - fill: #eee; -} -.dark #ov-topo svg .portLabel rect { - fill: #222; -} - -#ov-topo svg .portLabel text { - text-anchor: middle; - stroke-width: 0.1; - font-size: 11pt; -} -.light #ov-topo svg .portLabel text { - fill: #444; -} -.dark #ov-topo svg .portLabel text { - fill: #eee; -} - -/* Number of Links Labels */ -#ov-topo line.numLinkHash { - stroke-width: 3; -} - -#ov-topo text.numLinkText { - font-size: 15pt; -} - -#ov-topo text.numLinkText { - text-anchor: middle; -} - -.light #ov-topo text.numLinkText { - fill: #444; -} -.dark #ov-topo text.numLinkText { - fill: #eee; -} - -/* ------------------------------------------------- */ -/* Sprite Layer */ - -#ov-topo svg #topo-sprites use { - stroke-width: 2; -} -#ov-topo svg #topo-sprites text { - text-anchor: middle; - font-size: 20pt; - font-style: italic; -} - -.light #ov-topo svg #topo-sprites .gold1 use { - stroke: #fda; - fill: none; -} -.dark #ov-topo svg #topo-sprites .gold1 use { - stroke: #541; - fill: none; -} -.light #ov-topo svg #topo-sprites .gold1 text { - fill: #eda; -} -.dark #ov-topo svg #topo-sprites .gold1 text { - fill: #543; -} - -.light #ov-topo svg #topo-sprites .blue1 use { - stroke: #bbd; - fill: none; -} -.dark #ov-topo svg #topo-sprites .blue1 use { - stroke: #445; - fill: none; -} -.light #ov-topo svg #topo-sprites .blue1 text { - fill: #cce; -} -.dark #ov-topo svg #topo-sprites .blue1 text { - fill: #446; -} - -.light #ov-topo svg #topo-sprites .gray1 use { - stroke: #ccc; - fill: none; -} -.dark #ov-topo svg #topo-sprites .gray1 use { - stroke: #333; - fill: none; -} -.light #ov-topo svg #topo-sprites .gray1 text { - fill: #ddd; -} -.dark #ov-topo svg #topo-sprites .gray1 text { - fill: #444; -} - -/* fills */ -.light #ov-topo svg #topo-sprites use.fill-gray2 { - fill: #eee; -} -.dark #ov-topo svg #topo-sprites use.fill-gray2 { - fill: #444; -} - -.light #ov-topo svg #topo-sprites use.fill-blue2 { - fill: #bce; -} -.dark #ov-topo svg #topo-sprites use.fill-blue2 { - fill: #447; -} - diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.html b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.html deleted file mode 100644 index 8a64abb5..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.html +++ /dev/null @@ -1,7 +0,0 @@ -<!-- Topology View partial HTML --> -<div id="ov-topo"> - <svg viewBox="0 0 1000 1000" - resize offset-height="56" offset-width="12" - notifier="notifyResize()"> - </svg> -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.js deleted file mode 100644 index 3564eb33..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topo.js +++ /dev/null @@ -1,557 +0,0 @@ -/* - * Copyright 2014,2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology View Module - */ - -(function () { - 'use strict'; - - var moduleDependencies = [ - 'ngCookies', - 'onosUtil', - 'onosSvg', - 'onosRemote' - ]; - - // references to injected services etc. - var $scope, $log, $cookies, fs, ks, zs, gs, ms, sus, flash, wss, ps, - tds, tes, tfs, tps, tis, tss, tls, tts, tos, fltr, ttbs, ttip, tov; - - // DOM elements - var ovtopo, svg, defs, zoomLayer, mapG, spriteG, forceG, noDevsLayer; - - // Internal state - var zoomer, actionMap; - - // --- Short Cut Keys ------------------------------------------------ - - function setUpKeys(overlayKeys) { - // key bindings need to be made after the services have been injected - // thus, deferred to here... - actionMap = { - I: [toggleInstances, 'Toggle ONOS instances panel'], - O: [toggleSummary, 'Toggle ONOS summary panel'], - D: [toggleUseDetailsFlag, 'Disable / enable details panel'], - - H: [toggleHosts, 'Toggle host visibility'], - M: [toggleOffline, 'Toggle offline visibility'], - P: [togglePorts, 'Toggle Port Highlighting'], - dash: [tfs.showBadLinks, 'Show bad links'], - B: [toggleMap, 'Toggle background map'], - S: [toggleSprites, 'Toggle sprite layer'], - - //X: [toggleNodeLock, 'Lock / unlock node positions'], - Z: [tos.toggleOblique, 'Toggle oblique view (Experimental)'], - N: [fltr.clickAction, 'Cycle node layers'], - L: [tfs.cycleDeviceLabels, 'Cycle device labels'], - U: [tfs.unpin, 'Unpin node (hover mouse over)'], - R: [resetZoom, 'Reset pan / zoom'], - dot: [ttbs.toggleToolbar, 'Toggle Toolbar'], - - E: [equalizeMasters, 'Equalize mastership roles'], - - esc: handleEscape, - - _keyListener: ttbs.keyListener, - - _helpFormat: [ - ['I', 'O', 'D', 'H', 'M', 'P', 'dash', 'B', 'S' ], - ['X', 'Z', 'N', 'L', 'U', 'R', '-', 'E', '-', 'dot'], - [] // this column reserved for overlay actions - ] - }; - - if (fs.isO(overlayKeys)) { - mergeKeys(overlayKeys); - } - - ks.keyBindings(actionMap); - - ks.gestureNotes([ - ['click', 'Select the item and show details'], - ['shift-click', 'Toggle selection state'], - ['drag', 'Reposition (and pin) device / host'], - ['cmd-scroll', 'Zoom in / out'], - ['cmd-drag', 'Pan'] - ]); - } - - // when a topology overlay is activated, we need to bind their keystrokes - // and include them in the quick-help panel - function mergeKeys(extra) { - var _hf = actionMap._helpFormat[2]; - - ks.checkNotGlobal(extra); - - extra._keyOrder.forEach(function (k) { - var d = extra[k], - cb = d && d.cb, - tt = d && d.tt; - // NOTE: ignore keys that are already defined - if (d && !actionMap[k]) { - actionMap[k] = [cb, tt]; - _hf.push(k); - } - }); - } - - // --- Keystroke functions ------------------------------------------- - - function toggleInstances(x) { - updatePrefsState('insts', tis.toggle(x)); - tfs.updateDeviceColors(); - } - - function toggleSummary(x) { - updatePrefsState('summary', tps.toggleSummary(x)); - } - - function toggleUseDetailsFlag(x) { - updatePrefsState('detail', tps.toggleUseDetailsFlag(x)); - } - - function toggleHosts(x) { - updatePrefsState('hosts', tfs.toggleHosts(x)); - } - - function toggleOffline(x) { - updatePrefsState('offdev', tfs.toggleOffline(x)); - } - - function togglePorts(x) { - updatePrefsState('porthl', tfs.togglePorts(x)); - } - - function _togSvgLayer(x, G, tag, what) { - var on = (x === 'keyev') ? !sus.visible(G) : !!x, - verb = on ? 'Show' : 'Hide'; - sus.visible(G, on); - updatePrefsState(tag, on); - flash.flash(verb + ' ' + what); - } - - function toggleMap(x) { - _togSvgLayer(x, mapG, 'bg', 'background map'); - } - - function toggleSprites(x) { - _togSvgLayer(x, spriteG, 'spr', 'sprite layer'); - } - - function resetZoom() { - zoomer.reset(); - flash.flash('Pan and zoom reset'); - } - - function equalizeMasters() { - wss.sendEvent('equalizeMasters'); - flash.flash('Equalizing master roles'); - } - - function handleEscape() { - if (tis.showMaster()) { - // if an instance is selected, cancel the affinity mapping - tis.cancelAffinity() - - } else if (tov.hooks.escape()) { - // else if the overlay consumed the ESC event... - // (work already done) - - } else if (tss.deselectAll()) { - // else if we have node selections, deselect them all - // (work already done) - - } else if (tls.deselectLink()) { - // else if we have a link selected, deselect it - // (work already done) - - } else if (tis.isVisible()) { - // else if the Instance Panel is visible, hide it - tis.hide(); - tfs.updateDeviceColors(); - - } else if (tps.summaryVisible()) { - // else if the Summary Panel is visible, hide it - tps.hideSummaryPanel(); - } - } - - // --- Toolbar Functions --------------------------------------------- - - function notValid(what) { - $log.warn('topo.js getActionEntry(): Not a valid ' + what); - } - - function getActionEntry(key) { - var entry; - - if (!key) { - notValid('key'); - return null; - } - - entry = actionMap[key]; - - if (!entry) { - notValid('actionMap entry'); - return null; - } - return fs.isA(entry) || [entry, '']; - } - - function setUpToolbar() { - ttbs.init({ - getActionEntry: getActionEntry, - setUpKeys: setUpKeys - }); - ttbs.createToolbar(); - } - - // --- Glyphs, Icons, and the like ----------------------------------- - - function setUpDefs() { - defs = svg.append('defs'); - gs.loadDefs(defs); - sus.loadGlowDefs(defs); - } - - - // --- Pan and Zoom -------------------------------------------------- - - // zoom enabled predicate. ev is a D3 source event. - function zoomEnabled(ev) { - return fs.isMobile() || (ev.metaKey || ev.altKey); - } - - function zoomCallback() { - var sc = zoomer.scale(), - tr = zoomer.translate(); - - ps.setPrefs('topo_zoom', {tx:tr[0], ty:tr[1], sc:sc}); - - // keep the map lines constant width while zooming - mapG.style('stroke-width', (2.0 / sc) + 'px'); - } - - function setUpZoom() { - zoomLayer = svg.append('g').attr('id', 'topo-zoomlayer'); - zoomer = zs.createZoomer({ - svg: svg, - zoomLayer: zoomLayer, - zoomEnabled: zoomEnabled, - zoomCallback: zoomCallback - }); - } - - - // callback invoked when the SVG view has been resized.. - function svgResized(s) { - tfs.newDim([s.width, s.height]); - } - - // --- Background Map ------------------------------------------------ - - function setUpNoDevs() { - var g, box; - noDevsLayer = svg.append('g').attr({ - id: 'topo-noDevsLayer', - transform: sus.translate(500,500) - }); - // Note, SVG viewbox is '0 0 1000 1000', defined in topo.html. - // We are translating this layer to have its origin at the center - - g = noDevsLayer.append('g'); - gs.addGlyph(g, 'bird', 100).attr('class', 'noDevsBird'); - g.append('text').text('No devices are connected') - .attr({ x: 120, y: 80}); - - box = g.node().getBBox(); - box.x -= box.width/2; - box.y -= box.height/2; - g.attr('transform', sus.translate(box.x, box.y)); - - showNoDevs(true); - } - - function showNoDevs(b) { - sus.visible(noDevsLayer, b); - } - - - var countryFilters = { - world: function (c) { - return c.properties.continent !== 'Antarctica'; - }, - - // NOTE: for "usa" we are using our hand-crafted topojson file - - s_america: function (c) { - return c.properties.continent === 'South America'; - }, - - ns_america: function (c) { - return c.properties.custom === 'US-cont' || - c.properties.subregion === 'Central America' || - c.properties.continent === 'South America'; - }, - - japan: function (c) { - return c.properties.geounit === 'Japan'; - }, - - europe: function (c) { - return c.properties.continent === 'Europe'; - }, - - italy: function (c) { - return c.properties.geounit === 'Italy'; - }, - - uk: function (c) { - // technically, Ireland is not part of the United Kingdom, - // but the map looks weird without it showing. - return c.properties.adm0_a3 === 'GBR' || - c.properties.adm0_a3 === 'IRL'; - }, - - s_korea: function (c) { - return c.properties.adm0_a3 === 'KOR'; - }, - - australia: function (c) { - return c.properties.adm0_a3 === 'AUS'; - } - }; - - - function setUpMap($loc) { - var s1 = $loc.search().mapid, - s2 = ps.getPrefs('topo_mapid'), - mapId = s1 || (s2 && s2.id) || 'usa', - promise, - cfilter, - opts; - - mapG = zoomLayer.append('g').attr('id', 'topo-map'); - if (mapId === 'usa') { - promise = ms.loadMapInto(mapG, '*continental_us'); - } else { - ps.setPrefs('topo_mapid', {id:mapId}); - cfilter = countryFilters[mapId] || countryFilters.world; - opts = { countryFilter: cfilter }; - promise = ms.loadMapRegionInto(mapG, opts); - } - return promise; - } - - function opacifyMap(b) { - mapG.transition() - .duration(1000) - .attr('opacity', b ? 1 : 0); - } - - function setUpSprites($loc, tspr) { - var s1 = $loc.search().sprites, - s2 = ps.getPrefs('topo_sprites'), - sprId = s1 || (s2 && s2.id); - - spriteG = zoomLayer.append ('g').attr('id', 'topo-sprites'); - if (sprId) { - ps.setPrefs('topo_sprites', {id:sprId}); - tspr.loadSprites(spriteG, defs, sprId); - } - } - - // --- User Preferemces ---------------------------------------------- - - var prefsState = {}; - - function updatePrefsState(what, b) { - prefsState[what] = b ? 1 : 0; - ps.setPrefs('topo_prefs', prefsState); - } - - - function restoreConfigFromPrefs() { - // NOTE: toolbar will have set this for us.. - prefsState = ps.asNumbers(ps.getPrefs('topo_prefs')); - - $log.debug('TOPO- Prefs State:', prefsState); - - flash.enable(false); - toggleInstances(prefsState.insts); - toggleSummary(prefsState.summary); - toggleUseDetailsFlag(prefsState.detail); - toggleHosts(prefsState.hosts); - toggleOffline(prefsState.offdev); - togglePorts(prefsState.porthl); - toggleMap(prefsState.bg); - toggleSprites(prefsState.spr); - flash.enable(true); - } - - - // somewhat hackish, because summary update cannot happen until we - // have opened the websocket to the server; hence this extra function - // invoked after tes.start() - function restoreSummaryFromPrefs() { - prefsState = ps.asNumbers(ps.getPrefs('topo_prefs')); - $log.debug('TOPO- Prefs SUMMARY State:', prefsState.summary); - - flash.enable(false); - toggleSummary(prefsState.summary); - flash.enable(true); - } - - function topoStartDone() { - var d = $scope.intentData; - if (d) { - tts.selectIntent(d); - } - } - - // --- Controller Definition ----------------------------------------- - - angular.module('ovTopo', moduleDependencies) - .controller('OvTopoCtrl', ['$scope', '$log', '$location', '$timeout', - '$cookies', 'FnService', 'MastService', 'KeyService', 'ZoomService', - 'GlyphService', 'MapService', 'SvgUtilService', 'FlashService', - 'WebSocketService', 'PrefsService', 'TopoDialogService', - 'TopoEventService', 'TopoForceService', 'TopoPanelService', - 'TopoInstService', 'TopoSelectService', 'TopoLinkService', - 'TopoTrafficService', 'TopoObliqueService', 'TopoFilterService', - 'TopoToolbarService', 'TopoSpriteService', 'TooltipService', - 'TopoOverlayService', - - function (_$scope_, _$log_, $loc, $timeout, _$cookies_, _fs_, mast, _ks_, - _zs_, _gs_, _ms_, _sus_, _flash_, _wss_, _ps_, _tds_, _tes_, - _tfs_, _tps_, _tis_, _tss_, _tls_, _tts_, _tos_, _fltr_, - _ttbs_, tspr, _ttip_, _tov_) { - var params = $loc.search(), - projection, - dim, - uplink = { - // provides function calls back into this space - showNoDevs: showNoDevs, - projection: function () { return projection; }, - zoomLayer: function () { return zoomLayer; }, - zoomer: function () { return zoomer; }, - opacifyMap: opacifyMap, - topoStartDone: topoStartDone - }; - - $scope = _$scope_; - $log = _$log_; - $cookies = _$cookies_; - fs = _fs_; - ks = _ks_; - zs = _zs_; - gs = _gs_; - ms = _ms_; - sus = _sus_; - flash = _flash_; - wss = _wss_; - ps = _ps_; - tds = _tds_; - tes = _tes_; - tfs = _tfs_; - // TODO: consider funnelling actions through TopoForceService... - // rather than injecting references to these 'sub-modules', - // just so we can invoke functions on them. - tps = _tps_; - tis = _tis_; - tss = _tss_; - tls = _tls_; - tts = _tts_; - tos = _tos_; - fltr = _fltr_; - ttbs = _ttbs_; - ttip = _ttip_; - tov = _tov_; - - if (params.intentKey && params.intentAppId && params.intentAppName) { - $scope.intentData = { - key: params.intentKey, - appId: params.intentAppId, - appName: params.intentAppName - }; - } - - $scope.notifyResize = function () { - svgResized(fs.windowSize(mast.mastHeight())); - }; - - // Cleanup on destroyed scope.. - $scope.$on('$destroy', function () { - $log.log('OvTopoCtrl is saying Buh-Bye!'); - tes.stop(); - ks.unbindKeys(); - tps.destroyPanels(); - tds.closeDialog(); - tis.destroyInst(); - tfs.destroyForce(); - ttbs.destroyToolbar(); - }); - - // svg layer and initialization of components - ovtopo = d3.select('#ov-topo'); - svg = ovtopo.select('svg'); - // set the svg size to match that of the window, less the masthead - svg.attr(fs.windowSize(mast.mastHeight())); - dim = [svg.attr('width'), svg.attr('height')]; - - setUpKeys(); - setUpToolbar(); - setUpDefs(); - setUpZoom(); - setUpNoDevs(); - setUpMap($loc).then( - function (proj) { - var z = ps.getPrefs('topo_zoom') || {tx:0, ty:0, sc:1}; - zoomer.panZoom([z.tx, z.ty], z.sc); - $log.debug('** Zoom restored:', z); - - projection = proj; - $log.debug('** We installed the projection:', proj); - flash.enable(false); - toggleMap(prefsState.bg); - flash.enable(true); - - // now we have the map projection, we are ready for - // the server to send us device/host data... - tes.start(); - // need to do the following so we immediately get - // the summary panel data back from the server - restoreSummaryFromPrefs(); - } - ); - setUpSprites($loc, tspr); - - forceG = zoomLayer.append('g').attr('id', 'topo-force'); - tfs.initForce(svg, forceG, uplink, dim); - tis.initInst({ showMastership: tfs.showMastership }); - tps.initPanels(); - - // temporary solution for persisting user settings - restoreConfigFromPrefs(); - ttbs.setDefaultOverlay(); - - $log.debug('registered overlays...', tov.list()); - $log.log('OvTopoCtrl has been created'); - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoD3.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoD3.js deleted file mode 100644 index 5bf2eb4f..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoD3.js +++ /dev/null @@ -1,641 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology D3 Module. - Functions for manipulating the D3 visualizations of the Topology - */ - -(function () { - 'use strict'; - - // injected refs - var $log, fs, sus, is, ts; - - // api to topoForce - var api; - /* - node() // get ref to D3 selection of nodes - link() // get ref to D3 selection of links - linkLabel() // get ref to D3 selection of link labels - instVisible() // true if instances panel is visible - posNode() // position node - showHosts() // true if hosts are to be shown - restyleLinkElement() // update link styles based on backing data - updateLinkLabelModel() // update backing data for link labels - */ - - // configuration - var devCfg = { - xoff: -20, - yoff: -18 - }, - labelConfig = { - imgPad: 16, - padLR: 4, - padTB: 3, - marginLR: 3, - marginTB: 2, - port: { - gap: 3, - width: 18, - height: 14 - } - }, - badgeConfig = { - radius: 12, - yoff: 5, - gdelta: 10 - }, - icfg; - - var status = { - i: 'badgeInfo', - w: 'badgeWarn', - e: 'badgeError' - }; - - function badgeStatus(badge) { - return status[badge.status] || status.i; - } - - // internal state - var deviceLabelIndex = 0, - hostLabelIndex = 0; - - - var dCol = { - black: '#000', - paleblue: '#acf', - offwhite: '#ddd', - darkgrey: '#444', - midgrey: '#888', - lightgrey: '#bbb', - orange: '#f90' - }; - - // note: these are the device icon colors without affinity - var dColTheme = { - light: { - rfill: dCol.offwhite, - online: { - glyph: dCol.darkgrey, - rect: dCol.paleblue - }, - offline: { - glyph: dCol.midgrey, - rect: dCol.lightgrey - } - }, - dark: { - rfill: dCol.midgrey, - online: { - glyph: dCol.darkgrey, - rect: dCol.paleblue - }, - offline: { - glyph: dCol.midgrey, - rect: dCol.darkgrey - } - } - }; - - function devBaseColor(d) { - var o = d.online ? 'online' : 'offline'; - return dColTheme[ts.theme()][o]; - } - - function setDeviceColor(d) { - var o = d.online, - s = d.el.classed('selected'), - c = devBaseColor(d), - a = instColor(d.master, o), - icon = d.el.select('g.deviceIcon'), - g, r; - - if (s) { - g = c.glyph; - r = dCol.orange; - } else if (api.instVisible()) { - g = o ? a : c.glyph; - r = o ? c.rfill : a; - } else { - g = c.glyph; - r = c.rect; - } - - icon.select('use').style('fill', g); - icon.select('rect').style('fill', r); - } - - function instColor(id, online) { - return sus.cat7().getColor(id, !online, ts.theme()); - } - - // ==== - - function incDevLabIndex() { - deviceLabelIndex = (deviceLabelIndex+1) % 3; - switch(deviceLabelIndex) { - case 0: return 'Hide device labels'; - case 1: return 'Show friendly device labels'; - case 2: return 'Show device ID labels'; - } - } - - // Returns the newly computed bounding box of the rectangle - function adjustRectToFitText(n) { - var text = n.select('text'), - box = text.node().getBBox(), - lab = labelConfig; - - text.attr('text-anchor', 'middle') - .attr('y', '-0.8em') - .attr('x', lab.imgPad/2); - - // translate the bbox so that it is centered on [x,y] - box.x = -box.width / 2; - box.y = -box.height / 2; - - // add padding - box.x -= (lab.padLR + lab.imgPad/2); - box.width += lab.padLR * 2 + lab.imgPad; - box.y -= lab.padTB; - box.height += lab.padTB * 2; - - return box; - } - - function hostLabel(d) { - var idx = (hostLabelIndex < d.labels.length) ? hostLabelIndex : 0; - return d.labels[idx]; - } - function deviceLabel(d) { - var idx = (deviceLabelIndex < d.labels.length) ? deviceLabelIndex : 0; - return d.labels[idx]; - } - function trimLabel(label) { - return (label && label.trim()) || ''; - } - - function emptyBox() { - return { - x: -2, - y: -2, - width: 4, - height: 4 - }; - } - - function updateDeviceRendering(d) { - var label = trimLabel(deviceLabel(d)), - noLabel = !label, - node = d.el, - dim = icfg.device.dim, - box, dx, dy, bsel, - bdg = d.badge, - bcr = badgeConfig.radius, - bcgd = badgeConfig.gdelta; - - node.select('text') - .text(label) - .style('opacity', 0) - .transition() - .style('opacity', 1); - - if (noLabel) { - box = emptyBox(); - dx = -dim/2; - dy = -dim/2; - } else { - box = adjustRectToFitText(node); - dx = box.x + devCfg.xoff; - dy = box.y + devCfg.yoff; - } - - node.select('rect') - .transition() - .attr(box); - - node.select('g.deviceIcon') - .transition() - .attr('transform', sus.translate(dx, dy)); - - // handle badge, if defined - if (bdg) { - renderBadge(node, bdg, { dx: dx + dim, dy: dy }); - } - } - - function updateHostRendering(d) { - var node = d.el, - bdg = d.badge; - - updateHostLabel(d); - - // handle badge, if defined - if (bdg) { - renderBadge(node, bdg, icfg.host.badge); - } - } - - function renderBadge(node, bdg, boff) { - var bsel, - bcr = badgeConfig.radius, - bcgd = badgeConfig.gdelta; - - node.select('g.badge').remove(); - - bsel = node.append('g') - .classed('badge', true) - .classed(badgeStatus(bdg), true) - .attr('transform', sus.translate(boff.dx, boff.dy)); - - bsel.append('circle') - .attr('r', bcr); - - if (bdg.txt) { - bsel.append('text') - .attr('dy', badgeConfig.yoff) - .attr('text-anchor', 'middle') - .text(bdg.txt); - } else if (bdg.gid) { - bsel.append('use') - .attr({ - width: bcgd * 2, - height: bcgd * 2, - transform: sus.translate(-bcgd, -bcgd), - 'xlink:href': '#' + bdg.gid - }); - } - } - - function updateHostLabel(d) { - var label = trimLabel(hostLabel(d)); - d.el.select('text').text(label); - } - - function updateDeviceColors(d) { - if (d) { - setDeviceColor(d); - } else { - api.node().filter('.device').each(function (d) { - setDeviceColor(d); - }); - } - } - - - // ========================== - // updateNodes - subfunctions - - function deviceExisting(d) { - var node = d.el; - node.classed('online', d.online); - updateDeviceRendering(d); - api.posNode(d, true); - } - - function hostExisting(d) { - updateHostRendering(d); - api.posNode(d, true); - } - - function deviceEnter(d) { - var node = d3.select(this), - glyphId = d.type || 'unknown', - label = trimLabel(deviceLabel(d)), - //devCfg = deviceIconConfig, - noLabel = !label, - box, dx, dy, icon; - - d.el = node; - - node.append('rect').attr({ rx: 5, ry: 5 }); - node.append('text').text(label).attr('dy', '1.1em'); - box = adjustRectToFitText(node); - node.select('rect').attr(box); - - icon = is.addDeviceIcon(node, glyphId); - - if (noLabel) { - dx = -icon.dim/2; - dy = -icon.dim/2; - } else { - box = adjustRectToFitText(node); - dx = box.x + devCfg.xoff; - dy = box.y + devCfg.yoff; - } - - icon.attr('transform', sus.translate(dx, dy)); - } - - function hostEnter(d) { - var node = d3.select(this), - gid = d.type || 'unknown', - rad = icfg.host.radius, - r = d.type ? rad.withGlyph : rad.noGlyph, - textDy = r + 10; - - d.el = node; - sus.visible(node, api.showHosts()); - - is.addHostIcon(node, r, gid); - - node.append('text') - .text(hostLabel) - .attr('dy', textDy) - .attr('text-anchor', 'middle'); - } - - function hostExit(d) { - var node = d.el; - node.select('use') - .style('opacity', 0.5) - .transition() - .duration(800) - .style('opacity', 0); - - node.select('text') - .style('opacity', 0.5) - .transition() - .duration(800) - .style('opacity', 0); - - node.select('circle') - .style('stroke-fill', '#555') - .style('fill', '#888') - .style('opacity', 0.5) - .transition() - .duration(1500) - .attr('r', 0); - } - - function deviceExit(d) { - var node = d.el; - node.select('use') - .style('opacity', 0.5) - .transition() - .duration(800) - .style('opacity', 0); - - node.selectAll('rect') - .style('stroke-fill', '#555') - .style('fill', '#888') - .style('opacity', 0.5); - } - - - // ========================== - // updateLinks - subfunctions - - function linkEntering(d) { - var link = d3.select(this); - d.el = link; - api.restyleLinkElement(d); - if (d.type() === 'hostLink') { - sus.visible(link, api.showHosts()); - } - } - - var linkLabelOffset = '0.3em'; - - function applyLinkLabels() { - var entering; - - api.updateLinkLabelModel(); - - // for elements already existing, we need to update the text - // and adjust the rectangle size to fit - api.linkLabel().each(function (d) { - var el = d3.select(this), - rect = el.select('rect'), - text = el.select('text'); - text.text(d.label); - rect.attr(rectAroundText(el)); - }); - - entering = api.linkLabel().enter().append('g') - .classed('linkLabel', true) - .attr('id', function (d) { return d.id; }); - - entering.each(function (d) { - var el = d3.select(this), - rect, - text; - - if (d.ldata.type() === 'hostLink') { - el.classed('hostLinkLabel', true); - sus.visible(el, api.showHosts()); - } - - d.el = el; - rect = el.append('rect'); - text = el.append('text').text(d.label); - rect.attr(rectAroundText(el)); - text.attr('dy', linkLabelOffset); - - el.attr('transform', transformLabel(d.ldata.position)); - }); - - // Remove any labels that are no longer required. - api.linkLabel().exit().remove(); - } - - function rectAroundText(el) { - var text = el.select('text'), - box = text.node().getBBox(); - - // translate the bbox so that it is centered on [x,y] - box.x = -box.width / 2; - box.y = -box.height / 2; - - // add padding - box.x -= 1; - box.width += 2; - return box; - } - - function transformLabel(p) { - var dx = p.x2 - p.x1, - dy = p.y2 - p.y1, - xMid = dx/2 + p.x1, - yMid = dy/2 + p.y1; - return sus.translate(xMid, yMid); - } - - function applyPortLabels(data, portLabelG) { - var entering = portLabelG.selectAll('.portLabel') - .data(data).enter().append('g') - .classed('portLabel', true) - .attr('id', function (d) { return d.id; }); - - entering.each(function (d) { - var el = d3.select(this), - rect = el.append('rect'), - text = el.append('text').text(d.num); - - rect.attr(rectAroundText(el)); - text.attr('dy', linkLabelOffset); - el.attr('transform', sus.translate(d.x, d.y)); - }); - } - - function labelPoint(linkPos) { - var lengthUpLine = 1 / 3, - dx = linkPos.x2 - linkPos.x1, - dy = linkPos.y2 - linkPos.y1, - movedX = dx * lengthUpLine, - movedY = dy * lengthUpLine; - - return { - x: movedX, - y: movedY - }; - } - - function calcGroupPos(linkPos) { - var moved = labelPoint(linkPos); - return sus.translate(linkPos.x1 + moved.x, linkPos.y1 + moved.y); - } - - // calculates where on the link that the hash line for 5+ label appears - function hashAttrs(linkPos) { - var hashLength = 25, - halfLength = hashLength / 2, - dx = linkPos.x2 - linkPos.x1, - dy = linkPos.y2 - linkPos.y1, - length = Math.sqrt((dx * dx) + (dy * dy)), - moveAmtX = (dx / length) * halfLength, - moveAmtY = (dy / length) * halfLength, - mid = labelPoint(linkPos), - angle = Math.atan(dy / dx) + 45; - - return { - x1: mid.x - moveAmtX, - y1: mid.y - moveAmtY, - x2: mid.x + moveAmtX, - y2: mid.y + moveAmtY, - stroke: api.linkConfig()[ts.theme()].baseColor, - transform: 'rotate(' + angle + ',' + mid.x + ',' + mid.y + ')' - }; - } - - function textLabelPos(linkPos) { - var point = labelPoint(linkPos), - dist = 20; - return { - x: point.x + dist, - y: point.y + dist - }; - } - - function applyNumLinkLabels(data, lblsG) { - var labels = lblsG.selectAll('g.numLinkLabel') - .data(data, function (d) { return 'pair-' + d.id; }), - entering; - - // update existing labels - labels.each(function (d) { - var el = d3.select(this); - - el.attr({ - transform: function (d) { return calcGroupPos(d.linkCoords); } - }); - el.select('line') - .attr(hashAttrs(d.linkCoords)); - el.select('text') - .attr(textLabelPos(d.linkCoords)) - .text(d.num); - }); - - // add new labels - entering = labels - .enter() - .append('g') - .attr({ - transform: function (d) { return calcGroupPos(d.linkCoords); }, - id: function (d) { return 'pair-' + d.id; } - }) - .classed('numLinkLabel', true); - - entering.each(function (d) { - var el = d3.select(this); - - el.append('line') - .classed('numLinkHash', true) - .attr(hashAttrs(d.linkCoords)); - el.append('text') - .classed('numLinkText', true) - .attr(textLabelPos(d.linkCoords)) - .text(d.num); - }); - - // remove old labels - labels.exit().remove(); - } - - // ========================== - // Module definition - - angular.module('ovTopo') - .factory('TopoD3Service', - ['$log', 'FnService', 'SvgUtilService', 'IconService', 'ThemeService', - - function (_$log_, _fs_, _sus_, _is_, _ts_) { - $log = _$log_; - fs = _fs_; - sus = _sus_; - is = _is_; - ts = _ts_; - - icfg = is.iconConfig(); - - function initD3(_api_) { - api = _api_; - } - - function destroyD3() { } - - return { - initD3: initD3, - destroyD3: destroyD3, - - incDevLabIndex: incDevLabIndex, - adjustRectToFitText: adjustRectToFitText, - hostLabel: hostLabel, - deviceLabel: deviceLabel, - trimLabel: trimLabel, - - updateDeviceLabel: updateDeviceRendering, - updateHostLabel: updateHostLabel, - updateDeviceColors: updateDeviceColors, - - deviceExisting: deviceExisting, - hostExisting: hostExisting, - deviceEnter: deviceEnter, - hostEnter: hostEnter, - hostExit: hostExit, - deviceExit: deviceExit, - - linkEntering: linkEntering, - applyLinkLabels: applyLinkLabels, - transformLabel: transformLabel, - applyPortLabels: applyPortLabels, - applyNumLinkLabels: applyNumLinkLabels - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoDialog.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoDialog.js deleted file mode 100644 index 0c47511b..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoDialog.js +++ /dev/null @@ -1,190 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Dialog Module. - Defines functions for manipulating a dialog box. - */ - -(function () { - 'use strict'; - - // injected refs - var $log, $window, $rootScope, fs, ps, bns; - - // constants - var pCls = 'topo-p dialog', - idDialog = 'topo-p-dialog', - panelOpts = { - width: 300, - edge: 'left' - }; - - // internal state - var pApi, panel, dApi; - - // TODO: ESC key invokes Cancel callback - // TODO: Enter invokes OK callback - - // create the dialog; return its API - function createDialog() { - var header, body, footer, - p = ps.createPanel(idDialog, panelOpts); - p.classed(pCls, true); - panel = p; - - function reset() { - p.empty(); - p.append('div').classed('header', true); - p.append('div').classed('body', true); - p.append('div').classed('footer', true); - - header = p.el().select('.header'); - body = p.el().select('.body'); - footer = p.el().select('.footer'); - } - - function hAppend(x) { - if (typeof x === 'string') { - return header.append(x); - } - header.node().appendChild(x.node()); - return header; - } - - function bAppend(x) { - if (typeof x === 'string') { - return body.append(x); - } - body.node().appendChild(x.node()); - return body; - } - - function fAppend(x) { - if (typeof x === 'string') { - return footer.append(x); - } - footer.node().appendChild(x.node()); - return footer; - } - - function destroy() { - ps.destroyPanel(idDialog); - } - - return { - reset: reset, - appendHeader: hAppend, - appendBody: bAppend, - appendFooter: fAppend, - destroy: destroy - }; - } - - function makeButton(text, callback) { - var cb = fs.isF(callback); - - function invoke() { - cb && cb(); - panel.hide(); - } - return createDiv('dialog-button') - .text(text) - .on('click', invoke); - } - - function setTitle(title) { - if (pApi) { - pApi.appendHeader('h2').text(title); - } - return dApi; - } - - function addContent(content) { - if (pApi) { - pApi.appendBody(content); - } - return dApi; - } - - function addButton(text, cb) { - if (pApi) { - pApi.appendFooter(makeButton(text, cb)); - } - return dApi; - } - - // opens the dialog (creates if necessary) - function openDialog() { - $log.debug('Open DIALOG'); - if (!pApi) { - pApi = createDialog(); - } - pApi.reset(); - panel.show(); - - // return the dialog object API - dApi = { - setTitle: setTitle, - addContent: addContent, - addButton: addButton - }; - return dApi; - } - - // closes the dialog (destroying panel) - function closeDialog() { - $log.debug('Close DIALOG'); - if (pApi) { - panel.hide(); - pApi.destroy(); - pApi = null; - dApi = null; - } - } - - // creates a detached div, returning D3 selection - // optional CSS class may be provided - function createDiv(cls) { - var div = d3.select(document.createElement('div')); - if (cls) { - div.classed(cls, true); - } - return div; - } - - // ========================== - - angular.module('ovTopo') - .factory('TopoDialogService', - ['$log', '$window', '$rootScope', 'FnService', 'PanelService', 'ButtonService', - - function (_$log_, _$window_, _$rootScope_, - _fs_, _ps_, _bns_) { - $log = _$log_; - $window = _$window_; - $rootScope = _$rootScope_; - fs = _fs_; - ps = _ps_; - bns = _bns_; - - return { - openDialog: openDialog, - closeDialog: closeDialog, - createDiv: createDiv - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoEvent.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoEvent.js deleted file mode 100644 index 9b07f878..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoEvent.js +++ /dev/null @@ -1,134 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Event Module. - - Defines the conduit between the client and the server: - - provides a clean API for sending events to the server - - dispatches incoming events from the server to the appropriate sub-module - - */ - -(function () { - 'use strict'; - - // injected refs - var $log, $interval, wss, tps, tis, tfs, tss, tov, tspr; - - // internal state - var handlerMap, - openListener, - heartbeatTimer; - - var heartbeatPeriod = 9000; // 9 seconds - - // ========================== - - function createHandlerMap() { - handlerMap = { - showSummary: tps, - - showDetails: tss, - - showHighlights: tov, - - addInstance: tis, - updateInstance: tis, - removeInstance: tis, - - addDevice: tfs, - updateDevice: tfs, - removeDevice: tfs, - addHost: tfs, - updateHost: tfs, - moveHost: tfs, - removeHost: tfs, - addLink: tfs, - updateLink: tfs, - removeLink: tfs, - - topoStartDone: tfs, - - spriteListResponse: tspr, - spriteDataResponse: tspr - }; - } - - function wsOpen(host, url) { - $log.debug('TOPO: web socket open - cluster node:', host, 'URL:', url); - // Request batch of initial data from the new server - wss.sendEvent('topoStart'); - } - - function cancelHeartbeat() { - if (heartbeatTimer) { - $interval.cancel(heartbeatTimer); - } - heartbeatTimer = null; - } - - function scheduleHeartbeat() { - cancelHeartbeat(); - heartbeatTimer = $interval(function () { - wss.sendEvent('topoHeartbeat'); - }, heartbeatPeriod); - } - - - angular.module('ovTopo') - .factory('TopoEventService', - ['$log', '$interval', 'WebSocketService', - 'TopoPanelService', 'TopoInstService', 'TopoForceService', - 'TopoSelectService', 'TopoOverlayService', 'TopoSpriteService', - - function (_$log_, _$interval_, _wss_, - _tps_, _tis_, _tfs_, _tss_, _tov_, _tspr_) { - $log = _$log_; - $interval = _$interval_; - wss = _wss_; - tps = _tps_; - tis = _tis_; - tfs = _tfs_; - tss = _tss_; - tov = _tov_; - tspr = _tspr_; - - createHandlerMap(); - - function start() { - openListener = wss.addOpenListener(wsOpen); - wss.bindHandlers(handlerMap); - wss.sendEvent('topoStart'); - scheduleHeartbeat(); - $log.debug('topo comms started'); - } - - function stop() { - cancelHeartbeat(); - wss.sendEvent('topoStop'); - wss.unbindHandlers(handlerMap); - wss.removeOpenListener(openListener); - openListener = null; - $log.debug('topo comms stopped'); - } - - return { - start: start, - stop: stop - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoFilter.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoFilter.js deleted file mode 100644 index f9b96ae8..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoFilter.js +++ /dev/null @@ -1,149 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology layer filtering Module. - Provides functionality to visually differentiate between the packet and - optical layers of the topology. - */ - -(function () { - 'use strict'; - - // injected refs - var $log, fs, flash, tps, tts; - - // api to topoForce - var api; - /* - node() // get ref to D3 selection of nodes - link() // get ref to D3 selection of links - */ - - var smax = 'suppressedmax'; - - // which "layer" a particular item "belongs to" - var layerLookup = { - host: { - endstation: 'pkt', // default, if host event does not define type - router: 'pkt', - bgpSpeaker: 'pkt' - }, - device: { - switch: 'pkt', - roadm: 'opt' - }, - link: { - hostLink: 'pkt', - direct: 'pkt', - indirect: '', - tunnel: '', - optical: 'opt' - } - }, - // order of layer cycling in button - dispatch = [ - { - type: 'all', - action: function () { suppressLayers(false); }, - msg: 'All Layers Shown' - }, - { - type: 'pkt', - action: function () { showLayer('pkt'); }, - msg: 'Packet Layer Shown' - }, - { - type: 'opt', - action: function () { showLayer('opt'); }, - msg: 'Optical Layer Shown' - } - ], - layer = 0; - - function clickAction() { - layer = (layer + 1) % dispatch.length; - dispatch[layer].action(); - flash.flash(dispatch[layer].msg); - } - - function selected() { - return dispatch[layer].type; - } - - function inLayer(d, layer) { - var type = d.class === 'link' ? d.type() : d.type, - look = layerLookup[d.class], - lyr = look && look[type]; - return lyr === layer; - } - - function unsuppressLayer(which) { - api.node().each(function (d) { - var node = d.el; - if (inLayer(d, which)) { - node.classed(smax, false); - } - }); - - api.link().each(function (d) { - var link = d.el; - if (inLayer(d, which)) { - link.classed(smax, false); - } - }); - } - - function suppressLayers(b) { - api.node().classed(smax, b); - api.link().classed(smax, b); - } - - function showLayer(which) { - suppressLayers(true); - unsuppressLayer(which); - } - - // === ----------------------------------------------------- - // === MODULE DEFINITION === - - angular.module('ovTopo') - .factory('TopoFilterService', - ['$log', 'FnService', - 'FlashService', - 'TopoPanelService', - 'TopoTrafficService', - - function (_$log_, _fs_, _flash_, _tps_, _tts_) { - $log = _$log_; - fs = _fs_; - flash = _flash_; - tps = _tps_; - tts = _tts_; - - function initFilter(_api_) { - api = _api_; - } - - return { - initFilter: initFilter, - - clickAction: clickAction, - selected: selected, - inLayer: inLayer - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoForce.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoForce.js deleted file mode 100644 index 175ee796..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoForce.js +++ /dev/null @@ -1,1182 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Force Module. - Visualization of the topology in an SVG layer, using a D3 Force Layout. - */ - -(function () { - 'use strict'; - - // injected refs - var $log, $timeout, fs, sus, ts, flash, wss, tov, - tis, tms, td3, tss, tts, tos, fltr, tls, uplink, svg; - - // configuration - var linkConfig = { - light: { - baseColor: '#666', - inColor: '#66f', - outColor: '#f00' - }, - dark: { - baseColor: '#aaa', - inColor: '#66f', - outColor: '#f66' - }, - inWidth: 12, - outWidth: 10 - }; - - // internal state - var settings, // merged default settings and options - force, // force layout object - drag, // drag behavior handler - network = { - nodes: [], - links: [], - linksByDevice: {}, - lookup: {}, - revLinkToKey: {} - }, - lu, // shorthand for lookup - rlk, // shorthand for revLinktoKey - showHosts = false, // whether hosts are displayed - showOffline = true, // whether offline devices are displayed - nodeLock = false, // whether nodes can be dragged or not (locked) - fTimer, // timer for delayed force layout - fNodesTimer, // timer for delayed nodes update - fLinksTimer, // timer for delayed links update - dim, // the dimensions of the force layout [w,h] - linkNums = []; // array of link number labels - - // SVG elements; - var linkG, linkLabelG, numLinkLblsG, portLabelG, nodeG; - - // D3 selections; - var link, linkLabel, node; - - // default settings for force layout - var defaultSettings = { - gravity: 0.4, - friction: 0.7, - charge: { - // note: key is node.class - device: -8000, - host: -5000, - _def_: -12000 - }, - linkDistance: { - // note: key is link.type - direct: 100, - optical: 120, - hostLink: 3, - _def_: 50 - }, - linkStrength: { - // note: key is link.type - // range: {0.0 ... 1.0} - //direct: 1.0, - //optical: 1.0, - //hostLink: 1.0, - _def_: 1.0 - } - }; - - - // ========================== - // === EVENT HANDLERS - - function addDevice(data) { - var id = data.id, - d; - - uplink.showNoDevs(false); - - // although this is an add device event, if we already have the - // device, treat it as an update instead.. - if (lu[id]) { - updateDevice(data); - return; - } - - d = tms.createDeviceNode(data); - network.nodes.push(d); - lu[id] = d; - updateNodes(); - fStart(); - } - - function updateDevice(data) { - var id = data.id, - d = lu[id], - wasOnline; - - if (d) { - wasOnline = d.online; - angular.extend(d, data); - if (tms.positionNode(d, true)) { - sendUpdateMeta(d); - } - updateNodes(); - if (wasOnline !== d.online) { - tms.findAttachedLinks(d.id).forEach(restyleLinkElement); - updateOfflineVisibility(d); - } - } - } - - function removeDevice(data) { - var id = data.id, - d = lu[id]; - if (d) { - removeDeviceElement(d); - } - } - - function addHost(data) { - var id = data.id, - d, lnk; - - // although this is an add host event, if we already have the - // host, treat it as an update instead.. - if (lu[id]) { - updateHost(data); - return; - } - - d = tms.createHostNode(data); - network.nodes.push(d); - lu[id] = d; - updateNodes(); - - lnk = tms.createHostLink(data); - if (lnk) { - d.linkData = lnk; // cache ref on its host - network.links.push(lnk); - lu[d.ingress] = lnk; - lu[d.egress] = lnk; - updateLinks(); - } - fStart(); - } - - function updateHost(data) { - var id = data.id, - d = lu[id]; - if (d) { - angular.extend(d, data); - if (tms.positionNode(d, true)) { - sendUpdateMeta(d); - } - updateNodes(); - } - } - - function moveHost(data) { - var id = data.id, - d = lu[id], - lnk; - if (d) { - // first remove the old host link - removeLinkElement(d.linkData); - - // merge new data - angular.extend(d, data); - if (tms.positionNode(d, true)) { - sendUpdateMeta(d); - } - - // now create a new host link - lnk = tms.createHostLink(data); - if (lnk) { - d.linkData = lnk; - network.links.push(lnk); - lu[d.ingress] = lnk; - lu[d.egress] = lnk; - } - - updateNodes(); - updateLinks(); - fResume(); - } - } - - function removeHost(data) { - var id = data.id, - d = lu[id]; - if (d) { - removeHostElement(d, true); - } - } - - function addLink(data) { - var result = tms.findLink(data, 'add'), - bad = result.badLogic, - d = result.ldata; - - if (bad) { - //logicError(bad + ': ' + link.id); - return; - } - - if (d) { - // we already have a backing store link for src/dst nodes - addLinkUpdate(d, data); - return; - } - - // no backing store link yet - d = tms.createLink(data); - if (d) { - network.links.push(d); - aggregateLink(d, data); - lu[d.key] = d; - updateLinks(); - fStart(); - } - } - - function updateLink(data) { - var result = tms.findLink(data, 'update'), - bad = result.badLogic; - if (bad) { - //logicError(bad + ': ' + link.id); - return; - } - result.updateWith(link); - } - - function removeLink(data) { - var result = tms.findLink(data, 'remove'); - - if (!result.badLogic) { - result.removeRawLink(); - } - } - - function topoStartDone(data) { - // called when the initial barrage of data has been sent from server - uplink.topoStartDone(); - } - - // ======================== - - function nodeById(id) { - return lu[id]; - } - - function makeNodeKey(node1, node2) { - return node1 + '-' + node2; - } - - function findNodePair(key, keyRev) { - if (network.linksByDevice[key]) { - return key; - } else if (network.linksByDevice[keyRev]) { - return keyRev; - } else { - return false; - } - } - - function aggregateLink(ldata, link) { - var key = makeNodeKey(link.src, link.dst), - keyRev = makeNodeKey(link.dst, link.src), - found = findNodePair(key, keyRev); - - if (found) { - network.linksByDevice[found].push(ldata); - ldata.devicePair = found; - } else { - network.linksByDevice[key] = [ ldata ]; - ldata.devicePair = key; - } - } - - function addLinkUpdate(ldata, link) { - // add link event, but we already have the reverse link installed - ldata.fromTarget = link; - rlk[link.id] = ldata.key; - // possible solution to el being undefined in restyleLinkElement: - //_updateLinks(); - restyleLinkElement(ldata); - } - - - var widthRatio = 1.4, - linkScale = d3.scale.linear() - .domain([1, 12]) - .range([widthRatio, 12 * widthRatio]) - .clamp(true), - allLinkTypes = 'direct indirect optical tunnel'; - - function restyleLinkElement(ldata, immediate) { - // this fn's job is to look at raw links and decide what svg classes - // need to be applied to the line element in the DOM - var th = ts.theme(), - el = ldata.el, - type = ldata.type(), - lw = ldata.linkWidth(), - online = ldata.online(), - delay = immediate ? 0 : 1000; - - // FIXME: understand why el is sometimes undefined on addLink events... - // Investigated: - // el is undefined when it's a reverse link that is being added. - // updateLinks (which sets ldata.el) isn't called before this is called. - // Calling _updateLinks in addLinkUpdate fixes it, but there might be - // a more efficient way to fix it. - if (el && !el.empty()) { - el.classed('link', true); - el.classed('inactive', !online); - el.classed(allLinkTypes, false); - if (type) { - el.classed(type, true); - } - el.transition() - .duration(delay) - .attr('stroke-width', linkScale(lw)) - .attr('stroke', linkConfig[th].baseColor); - } - } - - function removeLinkElement(d) { - var idx = fs.find(d.key, network.links, 'key'), - removed; - if (idx >=0) { - // remove from links array - removed = network.links.splice(idx, 1); - // remove from lookup cache - delete lu[removed[0].key]; - updateLinks(); - fResume(); - } - } - - function removeHostElement(d, upd) { - // first, remove associated hostLink... - removeLinkElement(d.linkData); - - // remove hostLink bindings - delete lu[d.ingress]; - delete lu[d.egress]; - - // remove from lookup cache - delete lu[d.id]; - // remove from nodes array - var idx = fs.find(d.id, network.nodes); - network.nodes.splice(idx, 1); - - // remove from SVG - // NOTE: upd is false if we were called from removeDeviceElement() - if (upd) { - updateNodes(); - fResume(); - } - } - - function removeDeviceElement(d) { - var id = d.id, - idx; - // first, remove associated hosts and links.. - tms.findAttachedHosts(id).forEach(removeHostElement); - tms.findAttachedLinks(id).forEach(removeLinkElement); - - // remove from lookup cache - delete lu[id]; - // remove from nodes array - idx = fs.find(id, network.nodes); - if (idx > -1) { - network.nodes.splice(idx, 1); - } - - if (!network.nodes.length) { - uplink.showNoDevs(true); - } - - // remove from SVG - updateNodes(); - fResume(); - } - - function updateHostVisibility() { - sus.visible(nodeG.selectAll('.host'), showHosts); - sus.visible(linkG.selectAll('.hostLink'), showHosts); - sus.visible(linkLabelG.selectAll('.hostLinkLabel'), showHosts); - } - - function updateOfflineVisibility(dev) { - function updDev(d, show) { - var b; - sus.visible(d.el, show); - - tms.findAttachedLinks(d.id).forEach(function (link) { - b = show && ((link.type() !== 'hostLink') || showHosts); - sus.visible(link.el, b); - }); - tms.findAttachedHosts(d.id).forEach(function (host) { - b = show && showHosts; - sus.visible(host.el, b); - }); - } - - if (dev) { - // updating a specific device that just toggled off/on-line - updDev(dev, dev.online || showOffline); - } else { - // updating all offline devices - tms.findDevices(true).forEach(function (d) { - updDev(d, showOffline); - }); - } - } - - - function sendUpdateMeta(d, clearPos) { - var metaUi = {}, - ll; - - // if we are not clearing the position data (unpinning), - // attach the x, y, longitude, latitude... - if (!clearPos) { - ll = tms.lngLatFromCoord([d.x, d.y]); - metaUi = {x: d.x, y: d.y, lng: ll[0], lat: ll[1]}; - } - d.metaUi = metaUi; - wss.sendEvent('updateMeta', { - id: d.id, - class: d.class, - memento: metaUi - }); - } - - - function mkSvgClass(d) { - return d.fixed ? d.svgClass + ' fixed' : d.svgClass; - } - - function vis(b) { - return b ? 'visible' : 'hidden'; - } - - function toggleHosts(x) { - var kev = (x === 'keyev'), - on = kev ? !showHosts : !!x; - - showHosts = on; - updateHostVisibility(); - flash.flash('Hosts ' + vis(on)); - return on; - } - - function toggleOffline(x) { - var kev = (x === 'keyev'), - on = kev ? !showOffline : !!x; - - showOffline = on; - updateOfflineVisibility(); - flash.flash('Offline devices ' + vis(on)); - return on; - } - - function cycleDeviceLabels() { - flash.flash(td3.incDevLabIndex()); - tms.findDevices().forEach(function (d) { - td3.updateDeviceLabel(d); - }); - } - - function unpin() { - var hov = tss.hovered(); - if (hov) { - sendUpdateMeta(hov, true); - hov.fixed = false; - hov.el.classed('fixed', false); - fResume(); - } - } - - function showMastership(masterId) { - if (!masterId) { - restoreLayerState(); - } else { - showMastershipFor(masterId); - } - } - - function restoreLayerState() { - // NOTE: this level of indirection required, for when we have - // the layer filter functionality re-implemented - suppressLayers(false); - } - - function showMastershipFor(id) { - suppressLayers(true); - node.each(function (n) { - if (n.master === id) { - n.el.classed('suppressedmax', false); - } - }); - } - - function supAmt(less) { - return less ? "suppressed" : "suppressedmax"; - } - - function suppressLayers(b, less) { - var cls = supAmt(less); - node.classed(cls, b); - link.classed(cls, b); - } - - function unsuppressNode(id, less) { - var cls = supAmt(less); - node.each(function (n) { - if (n.id === id) { - n.el.classed(cls, false); - } - }); - } - - function unsuppressLink(key, less) { - var cls = supAmt(less); - link.each(function (n) { - if (n.key === key) { - n.el.classed(cls, false); - } - }); - } - - function showBadLinks() { - var badLinks = tms.findBadLinks(); - flash.flash('Bad Links: ' + badLinks.length); - $log.debug('Bad Link List (' + badLinks.length + '):'); - badLinks.forEach(function (d) { - $log.debug('bad link: (' + d.bad + ') ' + d.key, d); - if (d.el) { - d.el.attr('stroke-width', linkScale(2.8)) - .attr('stroke', 'red'); - } - }); - // back to normal after 2 seconds... - $timeout(updateLinks, 2000); - } - - // ========================================== - - function updateNodes() { - if (fNodesTimer) { - $timeout.cancel(fNodesTimer); - } - fNodesTimer = $timeout(_updateNodes, 150); - } - - // IMPLEMENTATION NOTE: _updateNodes() should NOT stop, start, or resume - // the force layout; that needs to be determined and implemented elsewhere - function _updateNodes() { - // select all the nodes in the layout: - node = nodeG.selectAll('.node') - .data(network.nodes, function (d) { return d.id; }); - - // operate on existing nodes: - node.filter('.device').each(td3.deviceExisting); - node.filter('.host').each(td3.hostExisting); - - // operate on entering nodes: - var entering = node.enter() - .append('g') - .attr({ - id: function (d) { return sus.safeId(d.id); }, - class: mkSvgClass, - transform: function (d) { - // Need to guard against NaN here ?? - return sus.translate(d.x, d.y); - }, - opacity: 0 - }) - .call(drag) - .on('mouseover', tss.nodeMouseOver) - .on('mouseout', tss.nodeMouseOut) - .transition() - .attr('opacity', 1); - - // augment entering nodes: - entering.filter('.device').each(td3.deviceEnter); - entering.filter('.host').each(td3.hostEnter); - - // operate on both existing and new nodes: - td3.updateDeviceColors(); - - // operate on exiting nodes: - // Note that the node is removed after 2 seconds. - // Sub element animations should be shorter than 2 seconds. - var exiting = node.exit() - .transition() - .duration(2000) - .style('opacity', 0) - .remove(); - - // exiting node specifics: - exiting.filter('.host').each(td3.hostExit); - exiting.filter('.device').each(td3.deviceExit); - } - - // ========================== - - function getDefaultPos(link) { - return { - x1: link.source.x, - y1: link.source.y, - x2: link.target.x, - y2: link.target.y - }; - } - - // returns amount of adjustment along the normal for given link - function amt(numLinks, linkIdx) { - var gap = 6; - return (linkIdx - ((numLinks - 1) / 2)) * gap; - } - - function calcMovement(d, amt, flipped) { - var pos = getDefaultPos(d), - mult = flipped ? -amt : amt, - dx = pos.x2 - pos.x1, - dy = pos.y2 - pos.y1, - length = Math.sqrt((dx * dx) + (dy * dy)); - - return { - x1: pos.x1 + (mult * dy / length), - y1: pos.y1 + (mult * -dx / length), - x2: pos.x2 + (mult * dy / length), - y2: pos.y2 + (mult * -dx / length) - }; - } - - function calcPosition() { - var lines = this, - linkSrcId; - linkNums = []; - lines.each(function (d) { - if (d.type() === 'hostLink') { - d.position = getDefaultPos(d); - } - }); - - function normalizeLinkSrc(link) { - // ensure source device is consistent across set of links - // temporary measure until link modeling is refactored - if (!linkSrcId) { - linkSrcId = link.source.id; - return false; - } - - return link.source.id !== linkSrcId; - } - - angular.forEach(network.linksByDevice, function (linkArr, key) { - var numLinks = linkArr.length, - link; - - if (numLinks === 1) { - link = linkArr[0]; - link.position = getDefaultPos(link); - link.position.multiLink = false; - } else if (numLinks >= 5) { - // this code is inefficient, in the future the way links - // are modeled will be changed - angular.forEach(linkArr, function (link) { - link.position = getDefaultPos(link); - link.position.multiLink = true; - }); - linkNums.push({ - id: key, - num: numLinks, - linkCoords: linkArr[0].position - }); - } else { - linkSrcId = null; - angular.forEach(linkArr, function (link, index) { - var offsetAmt = amt(numLinks, index), - needToFlip = normalizeLinkSrc(link); - link.position = calcMovement(link, offsetAmt, needToFlip); - link.position.multiLink = false; - }); - } - }); - } - - function updateLinks() { - if (fLinksTimer) { - $timeout.cancel(fLinksTimer); - } - fLinksTimer = $timeout(_updateLinks, 150); - } - - // IMPLEMENTATION NOTE: _updateLinks() should NOT stop, start, or resume - // the force layout; that needs to be determined and implemented elsewhere - function _updateLinks() { - var th = ts.theme(); - - link = linkG.selectAll('.link') - .data(network.links, function (d) { return d.key; }); - - // operate on existing links: - link.each(function (d) { - // this is supposed to be an existing link, but we have observed - // occasions (where links are deleted and added rapidly?) where - // the DOM element has not been defined. So protect against that... - if (d.el) { - restyleLinkElement(d, true); - } - }); - - // operate on entering links: - var entering = link.enter() - .append('line') - .call(calcPosition) - .attr({ - x1: function (d) { return d.position.x1; }, - y1: function (d) { return d.position.y1; }, - x2: function (d) { return d.position.x2; }, - y2: function (d) { return d.position.y2; }, - stroke: linkConfig[th].inColor, - 'stroke-width': linkConfig.inWidth - }); - - // augment links - entering.each(td3.linkEntering); - - // operate on both existing and new links: - //link.each(...) - - // add labels for how many links are in a thick line - td3.applyNumLinkLabels(linkNums, numLinkLblsG); - - // apply or remove labels - td3.applyLinkLabels(); - - // operate on exiting links: - link.exit() - .attr('stroke-dasharray', '3 3') - .attr('stroke', linkConfig[th].outColor) - .style('opacity', 0.5) - .transition() - .duration(1500) - .attr({ - 'stroke-dasharray': '3 12', - 'stroke-width': linkConfig.outWidth - }) - .style('opacity', 0.0) - .remove(); - } - - - // ========================== - // force layout tick function - - function fResume() { - if (!tos.isOblique()) { - force.resume(); - } - } - - function fStart() { - if (!tos.isOblique()) { - if (fTimer) { - $timeout.cancel(fTimer); - } - fTimer = $timeout(function () { - $log.debug("Starting force-layout"); - force.start(); - }, 200); - } - } - - var tickStuff = { - nodeAttr: { - transform: function (d) { - var dx = isNaN(d.x) ? 0 : d.x, - dy = isNaN(d.y) ? 0 : d.y; - return sus.translate(dx, dy); - } - }, - linkAttr: { - x1: function (d) { return d.position.x1; }, - y1: function (d) { return d.position.y1; }, - x2: function (d) { return d.position.x2; }, - y2: function (d) { return d.position.y2; } - }, - linkLabelAttr: { - transform: function (d) { - var lnk = tms.findLinkById(d.key); - if (lnk) { - return td3.transformLabel(lnk.position); - } - } - } - }; - - function tick() { - // guard against null (which can happen when our view pages out)... - if (node && node.size()) { - node.attr(tickStuff.nodeAttr); - } - if (link && link.size()) { - link.call(calcPosition) - .attr(tickStuff.linkAttr); - td3.applyNumLinkLabels(linkNums, numLinkLblsG); - } - if (linkLabel && linkLabel.size()) { - linkLabel.attr(tickStuff.linkLabelAttr); - } - } - - - // ========================== - // === MOUSE GESTURE HANDLERS - - function zoomingOrPanning(ev) { - return ev.metaKey || ev.altKey; - } - - function atDragEnd(d) { - // once we've finished moving, pin the node in position - d.fixed = true; - d3.select(this).classed('fixed', true); - sendUpdateMeta(d); - tss.clickConsumed(true); - } - - // predicate that indicates when dragging is active - function dragEnabled() { - var ev = d3.event.sourceEvent; - // nodeLock means we aren't allowing nodes to be dragged... - return !nodeLock && !zoomingOrPanning(ev); - } - - // predicate that indicates when clicking is active - function clickEnabled() { - return true; - } - - // ============================================= - // function entry points for overlay module - - // TODO: find an automatic way of tracking via the "showHighlights" events - var allTrafficClasses = 'primary secondary optical animated ' + - 'port-traffic-Kbps port-traffic-Mbps port-traffic-Gbps ' + - 'port-traffic-Gbps-choked'; - - function clearLinkTrafficStyle() { - link.style('stroke-width', null) - .classed(allTrafficClasses, false); - } - - function removeLinkLabels() { - network.links.forEach(function (d) { - d.label = ''; - }); - } - - function clearNodeDeco() { - node.selectAll('g.badge').remove(); - } - - function removeNodeBadges() { - network.nodes.forEach(function (d) { - d.badge = null; - }); - } - - function updateLinkLabelModel() { - // create the backing data for showing labels.. - var data = []; - link.each(function (d) { - if (d.label) { - data.push({ - id: 'lab-' + d.key, - key: d.key, - label: d.label, - ldata: d - }); - } - }); - - linkLabel = linkLabelG.selectAll('.linkLabel') - .data(data, function (d) { return d.id; }); - } - - // ========================== - // Module definition - - function mkModelApi(uplink) { - return { - projection: uplink.projection, - network: network, - restyleLinkElement: restyleLinkElement, - removeLinkElement: removeLinkElement - }; - } - - function mkD3Api() { - return { - node: function () { return node; }, - link: function () { return link; }, - linkLabel: function () { return linkLabel; }, - instVisible: function () { return tis.isVisible(); }, - posNode: tms.positionNode, - showHosts: function () { return showHosts; }, - restyleLinkElement: restyleLinkElement, - updateLinkLabelModel: updateLinkLabelModel, - linkConfig: function () { return linkConfig; } - }; - } - - function mkSelectApi() { - return { - node: function () { return node; }, - zoomingOrPanning: zoomingOrPanning, - updateDeviceColors: td3.updateDeviceColors, - deselectLink: tls.deselectLink - }; - } - - function mkTrafficApi() { - return { - hovered: tss.hovered, - somethingSelected: tss.somethingSelected, - selectOrder: tss.selectOrder - }; - } - - function mkOverlayApi() { - return { - clearNodeDeco: clearNodeDeco, - removeNodeBadges: removeNodeBadges, - clearLinkTrafficStyle: clearLinkTrafficStyle, - removeLinkLabels: removeLinkLabels, - findLinkById: tms.findLinkById, - findNodeById: nodeById, - updateLinks: updateLinks, - updateNodes: updateNodes, - supLayers: suppressLayers, - unsupNode: unsuppressNode, - unsupLink: unsuppressLink - }; - } - - function mkObliqueApi(uplink, fltr) { - return { - force: function() { return force; }, - zoomLayer: uplink.zoomLayer, - nodeGBBox: function() { return nodeG.node().getBBox(); }, - node: function () { return node; }, - link: function () { return link; }, - linkLabel: function () { return linkLabel; }, - nodes: function () { return network.nodes; }, - tickStuff: tickStuff, - nodeLock: function (b) { - var old = nodeLock; - nodeLock = b; - return old; - }, - opacifyMap: uplink.opacifyMap, - inLayer: fltr.inLayer, - calcLinkPos: calcPosition, - applyNumLinkLabels: function () { - td3.applyNumLinkLabels(linkNums, numLinkLblsG); - } - }; - } - - function mkFilterApi() { - return { - node: function () { return node; }, - link: function () { return link; } - }; - } - - function mkLinkApi(svg, uplink) { - return { - svg: svg, - zoomer: uplink.zoomer(), - network: network, - portLabelG: function () { return portLabelG; }, - showHosts: function () { return showHosts; } - }; - } - - angular.module('ovTopo') - .factory('TopoForceService', - ['$log', '$timeout', 'FnService', 'SvgUtilService', - 'ThemeService', 'FlashService', 'WebSocketService', - 'TopoOverlayService', 'TopoInstService', 'TopoModelService', - 'TopoD3Service', 'TopoSelectService', 'TopoTrafficService', - 'TopoObliqueService', 'TopoFilterService', 'TopoLinkService', - - function (_$log_, _$timeout_, _fs_, _sus_, _ts_, _flash_, _wss_, _tov_, - _tis_, _tms_, _td3_, _tss_, _tts_, _tos_, _fltr_, _tls_) { - $log = _$log_; - $timeout = _$timeout_; - fs = _fs_; - sus = _sus_; - ts = _ts_; - flash = _flash_; - wss = _wss_; - tov = _tov_; - tis = _tis_; - tms = _tms_; - td3 = _td3_; - tss = _tss_; - tts = _tts_; - tos = _tos_; - fltr = _fltr_; - tls = _tls_; - - var themeListener = ts.addListener(function () { - updateLinks(); - updateNodes(); - }); - - // forceG is the SVG group to display the force layout in - // uplink is the api from the main topo source file - // dim is the initial dimensions of the SVG as [w,h] - // opts are, well, optional :) - function initForce(_svg_, forceG, _uplink_, _dim_, opts) { - uplink = _uplink_; - dim = _dim_; - svg = _svg_; - - lu = network.lookup; - rlk = network.revLinkToKey; - - $log.debug('initForce().. dim = ' + dim); - - tov.setApi(mkOverlayApi(), tss); - tms.initModel(mkModelApi(uplink), dim); - td3.initD3(mkD3Api()); - tss.initSelect(mkSelectApi()); - tts.initTraffic(mkTrafficApi()); - tos.initOblique(mkObliqueApi(uplink, fltr)); - fltr.initFilter(mkFilterApi()); - tls.initLink(mkLinkApi(svg, uplink), td3); - - settings = angular.extend({}, defaultSettings, opts); - - linkG = forceG.append('g').attr('id', 'topo-links'); - linkLabelG = forceG.append('g').attr('id', 'topo-linkLabels'); - numLinkLblsG = forceG.append('g').attr('id', 'topo-numLinkLabels'); - nodeG = forceG.append('g').attr('id', 'topo-nodes'); - portLabelG = forceG.append('g').attr('id', 'topo-portLabels'); - - link = linkG.selectAll('.link'); - linkLabel = linkLabelG.selectAll('.linkLabel'); - node = nodeG.selectAll('.node'); - - force = d3.layout.force() - .size(dim) - .nodes(network.nodes) - .links(network.links) - .gravity(settings.gravity) - .friction(settings.friction) - .charge(settings.charge._def_) - .linkDistance(settings.linkDistance._def_) - .linkStrength(settings.linkStrength._def_) - .on('tick', tick); - - drag = sus.createDragBehavior(force, - tss.selectObject, atDragEnd, dragEnabled, clickEnabled); - } - - function newDim(_dim_) { - dim = _dim_; - force.size(dim); - tms.newDim(dim); - } - - function destroyForce() { - force.stop(); - - tls.destroyLink(); - tos.destroyOblique(); - tts.destroyTraffic(); - tss.destroySelect(); - td3.destroyD3(); - tms.destroyModel(); - // note: no need to destroy overlay service - ts.removeListener(themeListener); - themeListener = null; - - // clean up the DOM - svg.selectAll('g').remove(); - svg.selectAll('defs').remove(); - - // clean up internal state - network.nodes = []; - network.links = []; - network.linksByDevice = {}; - network.lookup = {}; - network.revLinkToKey = {}; - - linkNums = []; - - linkG = linkLabelG = numLinkLblsG = nodeG = portLabelG = null; - link = linkLabel = node = null; - force = drag = null; - - // clean up $timeout promises - if (fTimer) { - $timeout.cancel(fTimer); - } - if (fNodesTimer) { - $timeout.cancel(fNodesTimer); - } - if (fLinksTimer) { - $timeout.cancel(fLinksTimer); - } - } - - return { - initForce: initForce, - newDim: newDim, - destroyForce: destroyForce, - - updateDeviceColors: td3.updateDeviceColors, - toggleHosts: toggleHosts, - togglePorts: tls.togglePorts, - toggleOffline: toggleOffline, - cycleDeviceLabels: cycleDeviceLabels, - unpin: unpin, - showMastership: showMastership, - showBadLinks: showBadLinks, - - addDevice: addDevice, - updateDevice: updateDevice, - removeDevice: removeDevice, - addHost: addHost, - updateHost: updateHost, - moveHost: moveHost, - removeHost: removeHost, - addLink: addLink, - updateLink: updateLink, - removeLink: removeLink, - topoStartDone: topoStartDone - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoInst.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoInst.js deleted file mode 100644 index 7e929977..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoInst.js +++ /dev/null @@ -1,373 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Instances Module. - Defines modeling of ONOS instances. - */ - -(function () { - 'use strict'; - - // injected refs - var $log, ps, sus, gs, ts, fs, flash; - - // api from topo - var api; - /* - showMastership( id ) - */ - - // configuration - var instCfg = { - rectPad: 8, - nodeOx: 9, - nodeOy: 9, - nodeDim: 40, - birdOx: 19, - birdOy: 21, - birdDim: 21, - uiDy: 45, - titleDy: 30, - textYOff: 20, - textYSpc: 15 - }, - showLogicErrors = true, - idIns = 'topo-p-instance', - instOpts = { - edge: 'left', - width: 20 - }; - - // internal state - var onosInstances, - onosOrder, - oiShowMaster, - oiBox, - themeListener; - - - // ========================== - - function addInstance(data) { - var id = data.id; - - if (onosInstances[id]) { - updateInstance(data); - return; - } - onosInstances[id] = data; - onosOrder.push(data); - updateInstances(); - } - - function updateInstance(data) { - var id = data.id, - d = onosInstances[id]; - if (d) { - angular.extend(d, data); - updateInstances(); - } else { - logicError('updateInstance: lookup fail: ID = "' + id + '"'); - } - } - - function removeInstance(data) { - var id = data.id, - d = onosInstances[id]; - if (d) { - var idx = fs.find(id, onosOrder); - if (idx >= 0) { - onosOrder.splice(idx, 1); - } - delete onosInstances[id]; - updateInstances(); - } else { - logicError('removeInstance lookup fail. ID = "' + id + '"'); - } - } - - // ========================== - - function computeDim(self) { - var css = window.getComputedStyle(self); - return { - w: sus.stripPx(css.width), - h: sus.stripPx(css.height) - }; - } - - function clickInst(d) { - var el = d3.select(this), - aff = el.classed('affinity'); - if (!aff) { - setAffinity(el, d); - } else { - cancelAffinity(); - } - } - - function setAffinity(el, d) { - d3.selectAll('.onosInst') - .classed('mastership', true) - .classed('affinity', false); - el.classed('affinity', true); - - // suppress all elements except nodes whose master is this instance - api.showMastership(d.id); - oiShowMaster = true; - } - - function cancelAffinity() { - d3.selectAll('.onosInst') - .classed('mastership affinity', false); - - api.showMastership(null); - oiShowMaster = false; - } - - function instRectAttr(dim) { - var pad = instCfg.rectPad; - return { - x: pad, - y: pad, - width: dim.w - pad*2, - height: dim.h - pad*2, - rx: 6 - }; - } - - function viewBox(dim) { - return '0 0 ' + dim.w + ' ' + dim.h; - } - - function attachUiBadge(svg) { - gs.addGlyph(svg, 'uiAttached', 30, true, [12, instCfg.uiDy]) - .classed('badgeIcon uiBadge', true); - } - - function instColor(id, online) { - return sus.cat7().getColor(id, !online, ts.theme()); - } - - // ============================== - - function updateInstances() { - var onoses = oiBox.el().selectAll('.onosInst') - .data(onosOrder, function (d) { return d.id; }), - instDim = {w:0,h:0}, - c = instCfg; - - function nSw(n) { - return '# Switches: ' + n; - } - - // operate on existing onos instances if necessary - onoses.each(function (d) { - var el = d3.select(this), - svg = el.select('svg'); - instDim = computeDim(this); - - // update online state - el.classed('online', d.online); - - // update ui-attached state - svg.select('use.uiBadge').remove(); - if (d.uiAttached) { - attachUiBadge(svg); - } - - function updAttr(id, value) { - svg.select('text.instLabel.'+id).text(value); - } - - updAttr('ip', d.ip); - updAttr('ns', nSw(d.switches)); - }); - - - // operate on new onos instances - var entering = onoses.enter() - .append('div') - .attr('class', 'onosInst') - .classed('online', function (d) { return d.online; }) - .on('click', clickInst); - - entering.each(function (d) { - var el = d3.select(this), - rectAttr, - svg; - instDim = computeDim(this); - rectAttr = instRectAttr(instDim); - - svg = el.append('svg').attr({ - width: instDim.w, - height: instDim.h, - viewBox: viewBox(instDim) - }); - - svg.append('rect').attr(rectAttr); - - gs.addGlyph(svg, 'bird', 28, true, [14, 14]) - .classed('badgeIcon', true); - - if (d.uiAttached) { - attachUiBadge(svg); - } - - var left = c.nodeOx + c.nodeDim, - len = rectAttr.width - left, - hlen = len / 2, - midline = hlen + left; - - // title - svg.append('text') - .attr({ - class: 'instTitle', - x: midline, - y: c.titleDy - }) - .text(d.id); - - // a couple of attributes - var ty = c.titleDy + c.textYOff; - - function addAttr(id, label) { - svg.append('text').attr({ - class: 'instLabel ' + id, - x: midline, - y: ty - }).text(label); - ty += c.textYSpc; - } - - addAttr('ip', d.ip); - addAttr('ns', nSw(d.switches)); - }); - - // operate on existing + new onoses here - // set the affinity colors... - onoses.each(function (d) { - var el = d3.select(this), - rect = el.select('svg').select('rect'), - col = instColor(d.id, d.online); - rect.style('fill', col); - }); - - // adjust the panel size appropriately... - oiBox.width(instDim.w * onosOrder.length); - oiBox.height(instDim.h); - - // remove any outgoing instances - onoses.exit().remove(); - } - - - // ========================== - - function logicError(msg) { - if (showLogicErrors) { - $log.warn('TopoInstService: ' + msg); - } - } - - function initInst(_api_) { - api = _api_; - oiBox = ps.createPanel(idIns, instOpts); - oiBox.show(); - - onosInstances = {}; - onosOrder = []; - oiShowMaster = false; - - // we want to update the instances, each time the theme changes - themeListener = ts.addListener(updateInstances); - } - - function destroyInst() { - ts.removeListener(themeListener); - themeListener = null; - - ps.destroyPanel(idIns); - oiBox = null; - - onosInstances = {}; - onosOrder = []; - oiShowMaster = false; - } - - function showInsts() { - oiBox.show(); - } - - function hideInsts() { - oiBox.hide(); - } - - function toggleInsts(x) { - var kev = (x === 'keyev'), - on, - verb; - - if (kev) { - on = oiBox.toggle(); - } else { - on = !!x; - if (on) { - showInsts(); - } else { - hideInsts(); - } - } - verb = on ? 'Show' : 'Hide'; - flash.flash(verb + ' instances panel'); - return on; - } - - // ========================== - - angular.module('ovTopo') - .factory('TopoInstService', - ['$log', 'PanelService', 'SvgUtilService', 'GlyphService', - 'ThemeService', 'FnService', 'FlashService', - - function (_$log_, _ps_, _sus_, _gs_, _ts_, _fs_, _flash_) { - $log = _$log_; - ps = _ps_; - sus = _sus_; - gs = _gs_; - ts = _ts_; - fs = _fs_; - flash = _flash_; - - return { - initInst: initInst, - destroyInst: destroyInst, - - addInstance: addInstance, - updateInstance: updateInstance, - removeInstance: removeInstance, - - cancelAffinity: cancelAffinity, - - isVisible: function () { return oiBox.isVisible(); }, - show: showInsts, - hide: hideInsts, - toggle: toggleInsts, - showMaster: function () { return oiShowMaster; } - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoLink.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoLink.js deleted file mode 100644 index 38f3a6c3..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoLink.js +++ /dev/null @@ -1,338 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Link Module. - Functions for highlighting/selecting links - */ - -(function () { - 'use strict'; - - // injected refs - var $log, fs, sus, ts, flash, tss, tps; - - // internal state - var api, - td3, - network, - showPorts = true, // enable port highlighting by default - enhancedLink = null, // the link over which the mouse is hovering - selectedLink = null; // the link which is currently selected - - // SVG elements; - var svg; - - - // ======== ALGORITHM TO FIND LINK CLOSEST TO MOUSE ======== - - function getLogicalMousePosition(container) { - var m = d3.mouse(container), - sc = api.zoomer.scale(), - tr = api.zoomer.translate(), - mx = (m[0] - tr[0]) / sc, - my = (m[1] - tr[1]) / sc; - return {x: mx, y: my}; - } - - - function sq(x) { return x * x; } - - function mdist(p, m) { - return Math.sqrt(sq(p.x - m.x) + sq(p.y - m.y)); - } - - function prox(dist) { - return dist / api.zoomer.scale(); - } - - function computeNearestNode(mouse) { - var proximity = prox(30), - nearest = null, - minDist; - - if (network.nodes.length) { - minDist = proximity * 2; - - network.nodes.forEach(function (d) { - var dist; - - if (!api.showHosts() && d.class === 'host') { - return; // skip hidden hosts - } - - dist = mdist({x: d.x, y: d.y}, mouse); - if (dist < minDist && dist < proximity) { - minDist = dist; - nearest = d; - } - }); - } - return nearest; - } - - - function computeNearestLink(mouse) { - var proximity = prox(30), - nearest = null, - minDist; - - function pdrop(line, mouse) { - var x1 = line.x1, - y1 = line.y1, - x2 = line.x2, - y2 = line.y2, - x3 = mouse.x, - y3 = mouse.y, - k = ((y2-y1) * (x3-x1) - (x2-x1) * (y3-y1)) / - (sq(y2-y1) + sq(x2-x1)), - x4 = x3 - k * (y2-y1), - y4 = y3 + k * (x2-x1); - return {x:x4, y:y4}; - } - - function lineHit(line, p, m) { - if (p.x < line.x1 && p.x < line.x2) return false; - if (p.x > line.x1 && p.x > line.x2) return false; - if (p.y < line.y1 && p.y < line.y2) return false; - if (p.y > line.y1 && p.y > line.y2) return false; - // line intersects, but are we close enough? - return mdist(p, m) <= proximity; - } - - if (network.links.length) { - minDist = proximity * 2; - - network.links.forEach(function (d) { - if (!api.showHosts() && d.type() === 'hostLink') { - return; // skip hidden host links - } - - var line = d.position, - point = pdrop(line, mouse), - hit = lineHit(line, point, mouse), - dist; - - if (hit) { - dist = mdist(point, mouse); - if (dist < minDist) { - minDist = dist; - nearest = d; - } - } - }); - } - return nearest; - } - - function enhanceLink(ldata) { - // if the new link is same as old link, do nothing - if (enhancedLink && ldata && enhancedLink.key === ldata.key) return; - - // first, unenhance the currently enhanced link - if (enhancedLink) { - unenhance(enhancedLink); - } - enhancedLink = ldata; - if (enhancedLink) { - enhance(enhancedLink); - } - } - - function unenhance(d) { - // guard against link element not set - if (d.el) { - d.el.classed('enhanced', false); - } - api.portLabelG().selectAll('.portLabel').remove(); - } - - function enhance(d) { - var data = [], - point; - - // guard against link element not set - if (!d.el) return; - - d.el.classed('enhanced', true); - - // Define port label data objects. - // NOTE: src port is absent in the case of host-links. - - point = locatePortLabel(d); - angular.extend(point, { - id: 'topo-port-tgt', - num: d.tgtPort - }); - data.push(point); - - if (d.srcPort) { - point = locatePortLabel(d, 1); - angular.extend(point, { - id: 'topo-port-src', - num: d.srcPort - }); - data.push(point); - } - - td3.applyPortLabels(data, api.portLabelG()); - } - - function locatePortLabel(link, src) { - var offset = 32, - pos = link.position, - nearX = src ? pos.x1 : pos.x2, - nearY = src ? pos.y1 : pos.y2, - farX = src ? pos.x2 : pos.x1, - farY = src ? pos.y2 : pos.y1; - - function dist(x, y) { return Math.sqrt(x*x + y*y); } - - var dx = farX - nearX, - dy = farY - nearY, - k = offset / dist(dx, dy); - - return {x: k * dx + nearX, y: k * dy + nearY}; - } - - function selectLink(ldata) { - // if the new link is same as old link, do nothing - if (selectedLink && ldata && selectedLink.key === ldata.key) return; - - // make sure no nodes are selected - tss.deselectAll(); - - // first, unenhance the currently enhanced link - if (selectedLink) { - unselLink(selectedLink); - } - selectedLink = ldata; - if (selectedLink) { - selLink(selectedLink); - } - } - - function unselLink(d) { - // guard against link element not set - if (d.el) { - d.el.classed('selected', false); - } - } - - function selLink(d) { - // guard against link element not set - if (!d.el) return; - - d.el.classed('selected', true); - - tps.displayLink(d); - tps.displaySomething(); - } - - // ====== MOUSE EVENT HANDLERS ====== - - function mouseMoveHandler() { - var mp = getLogicalMousePosition(this), - link = computeNearestLink(mp); - enhanceLink(link); - } - - function mouseClickHandler() { - var mp, link, node; - - if (!tss.clickConsumed()) { - mp = getLogicalMousePosition(this); - node = computeNearestNode(mp); - if (node) { - $log.debug('found nearest node:', node.labels[1]); - tss.selectObject(node); - } else { - link = computeNearestLink(mp); - selectLink(link); - } - } - } - - - // ====================== - - function togglePorts(x) { - var kev = (x === 'keyev'), - on = kev ? !showPorts : !!x, - what = on ? 'Enable' : 'Disable', - handler = on ? mouseMoveHandler : null; - - showPorts = on; - - if (!on) { - enhanceLink(null); - } - svg.on('mousemove', handler); - flash.flash(what + ' port highlighting'); - return on; - } - - function deselectLink() { - if (selectedLink) { - unselLink(selectedLink); - selectedLink = null; - return true; - } - return false; - } - - // ========================== - // Module definition - - angular.module('ovTopo') - .factory('TopoLinkService', - ['$log', 'FnService', 'SvgUtilService', 'ThemeService', 'FlashService', - 'TopoSelectService', 'TopoPanelService', - - function (_$log_, _fs_, _sus_, _ts_, _flash_, _tss_, _tps_) { - $log = _$log_; - fs = _fs_; - sus = _sus_; - ts = _ts_; - flash = _flash_; - tss = _tss_; - tps = _tps_; - - function initLink(_api_, _td3_) { - api = _api_; - td3 = _td3_; - svg = api.svg; - network = api.network; - if (showPorts && !fs.isMobile()) { - svg.on('mousemove', mouseMoveHandler); - } - svg.on('click', mouseClickHandler); - } - - function destroyLink() { - // unconditionally remove any event handlers - svg.on('mousemove', null); - svg.on('click', null); - } - - return { - initLink: initLink, - destroyLink: destroyLink, - togglePorts: togglePorts, - deselectLink: deselectLink - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoModel.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoModel.js deleted file mode 100644 index fb98fc2b..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoModel.js +++ /dev/null @@ -1,439 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Model Module. - Auxiliary functions for the model of the topology; that is, our internal - representations of devices, hosts, links, etc. - */ - -(function () { - 'use strict'; - - // injected refs - var $log, fs, rnd; - - // api to topoForce - var api; - /* - projection() - network {...} - restyleLinkElement( ldata ) - removeLinkElement( ldata ) - */ - - // shorthand - var lu, rlk, nodes, links, linksByDevice; - - var dim; // dimensions of layout [w,h] - - // configuration 'constants' - var defaultLinkType = 'direct', - nearDist = 15; - - - function coordFromLngLat(loc) { - var p = api.projection(); - // suspected cause of ONOS-2109 - return p ? p([loc.lng, loc.lat]) : [0, 0]; - } - - function lngLatFromCoord(coord) { - var p = api.projection(); - return p ? p.invert(coord) : [0, 0]; - } - - function positionNode(node, forUpdate) { - var meta = node.metaUi, - x = meta && meta.x, - y = meta && meta.y, - xy; - - // If we have [x,y] already, use that... - if (x && y) { - node.fixed = true; - node.px = node.x = x; - node.py = node.y = y; - return; - } - - var location = node.location, - coord; - - if (location && location.type === 'latlng') { - coord = coordFromLngLat(location); - node.fixed = true; - node.px = node.x = coord[0]; - node.py = node.y = coord[1]; - return true; - } - - // if this is a node update (not a node add).. skip randomizer - if (forUpdate) { - return; - } - - // Note: Placing incoming unpinned nodes at exactly the same point - // (center of the view) causes them to explode outwards when - // the force layout kicks in. So, we spread them out a bit - // initially, to provide a more serene layout convergence. - // Additionally, if the node is a host, we place it near - // the device it is connected to. - - function rand() { - return { - x: rnd.randDim(dim[0]), - y: rnd.randDim(dim[1]) - }; - } - - function near(node) { - return { - x: node.x + nearDist + rnd.spread(nearDist), - y: node.y + nearDist + rnd.spread(nearDist) - }; - } - - function getDevice(cp) { - var d = lu[cp.device]; - return d || rand(); - } - - xy = (node.class === 'host') ? near(getDevice(node.cp)) : rand(); - angular.extend(node, xy); - } - - function mkSvgCls(dh, t, on) { - var ndh = 'node ' + dh, - ndht = t ? ndh + ' ' + t : ndh; - return on ? ndht + ' online' : ndht; - } - - function createDeviceNode(device) { - var node = device; - - // Augment as needed... - node.class = 'device'; - node.svgClass = mkSvgCls('device', device.type, device.online); - positionNode(node); - return node; - } - - function createHostNode(host) { - var node = host; - - // Augment as needed... - node.class = 'host'; - if (!node.type) { - node.type = 'endstation'; - } - node.svgClass = mkSvgCls('host', node.type); - positionNode(node); - return node; - } - - function createHostLink(host) { - var src = host.id, - dst = host.cp.device, - id = host.ingress, - lnk = linkEndPoints(src, dst); - - if (!lnk) { - return null; - } - - // Synthesize link ... - angular.extend(lnk, { - key: id, - class: 'link', - // NOTE: srcPort left undefined (host end of the link) - tgtPort: host.cp.port, - - type: function () { return 'hostLink'; }, - online: function () { - // hostlink target is edge switch - return lnk.target.online; - }, - linkWidth: function () { return 1; } - }); - return lnk; - } - - function createLink(link) { - var lnk = linkEndPoints(link.src, link.dst); - - if (!lnk) { - return null; - } - - angular.extend(lnk, { - key: link.id, - class: 'link', - fromSource: link, - srcPort: link.srcPort, - tgtPort: link.dstPort, - position: { - x1: 0, - y1: 0, - x2: 0, - y2: 0 - }, - - // functions to aggregate dual link state - type: function () { - var s = lnk.fromSource, - t = lnk.fromTarget; - return (s && s.type) || (t && t.type) || defaultLinkType; - }, - online: function () { - var s = lnk.fromSource, - t = lnk.fromTarget, - both = lnk.source.online && lnk.target.online; - return both && ((s && s.online) || (t && t.online)); - }, - linkWidth: function () { - var s = lnk.fromSource, - t = lnk.fromTarget, - ws = (s && s.linkWidth) || 0, - wt = (t && t.linkWidth) || 0; - return lnk.position.multiLink ? 5 : Math.max(ws, wt); - } - }); - return lnk; - } - - - function linkEndPoints(srcId, dstId) { - var srcNode = lu[srcId], - dstNode = lu[dstId], - sMiss = !srcNode ? missMsg('src', srcId) : '', - dMiss = !dstNode ? missMsg('dst', dstId) : ''; - - if (sMiss || dMiss) { - $log.error('Node(s) not on map for link:' + sMiss + dMiss); - //logicError('Node(s) not on map for link:\n' + sMiss + dMiss); - return null; - } - return { - source: srcNode, - target: dstNode - }; - } - - function missMsg(what, id) { - return '\n[' + what + '] "' + id + '" missing'; - } - - - function makeNodeKey(d, what) { - var port = what + 'Port'; - return d[what] + '/' + d[port]; - } - - function makeLinkKey(d, flipped) { - var one = flipped ? makeNodeKey(d, 'dst') : makeNodeKey(d, 'src'), - two = flipped ? makeNodeKey(d, 'src') : makeNodeKey(d, 'dst'); - return one + '-' + two; - } - - function findLinkById(id) { - // check to see if this is a reverse lookup, else default to given id - var key = rlk[id] || id; - return key && lu[key]; - } - - function findLink(linkData, op) { - var key = makeLinkKey(linkData), - keyrev = makeLinkKey(linkData, 1), - link = lu[key], - linkRev = lu[keyrev], - result = {}, - ldata = link || linkRev, - rawLink; - - if (op === 'add') { - if (link) { - // trying to add a link that we already know about - result.ldata = link; - result.badLogic = 'addLink: link already added'; - - } else if (linkRev) { - // we found the reverse of the link to be added - result.ldata = linkRev; - if (linkRev.fromTarget) { - result.badLogic = 'addLink: link already added'; - } - } - } else if (op === 'update') { - if (!ldata) { - result.badLogic = 'updateLink: link not found'; - } else { - rawLink = link ? ldata.fromSource : ldata.fromTarget; - result.updateWith = function (data) { - angular.extend(rawLink, data); - api.restyleLinkElement(ldata); - } - } - } else if (op === 'remove') { - if (!ldata) { - result.badLogic = 'removeLink: link not found'; - } else { - rawLink = link ? ldata.fromSource : ldata.fromTarget; - - if (!rawLink) { - result.badLogic = 'removeLink: link not found'; - - } else { - result.removeRawLink = function () { - // remove link out of aggregate linksByDevice list - var linksForDevPair = linksByDevice[ldata.devicePair], - rmvIdx = fs.find(ldata.key, linksForDevPair, 'key'); - if (rmvIdx >= 0) { - linksForDevPair.splice(rmvIdx, 1); - } - ldata.position.multilink = linksForDevPair.length >= 5; - - if (link) { - // remove fromSource - ldata.fromSource = null; - if (ldata.fromTarget) { - // promote target into source position - ldata.fromSource = ldata.fromTarget; - ldata.fromTarget = null; - ldata.key = keyrev; - delete lu[key]; - lu[keyrev] = ldata; - delete rlk[keyrev]; - } - } else { - // remove fromTarget - ldata.fromTarget = null; - delete rlk[keyrev]; - } - if (ldata.fromSource) { - api.restyleLinkElement(ldata); - } else { - api.removeLinkElement(ldata); - } - } - } - } - } - return result; - } - - function findDevices(offlineOnly) { - var a = []; - nodes.forEach(function (d) { - if (d.class === 'device' && !(offlineOnly && d.online)) { - a.push(d); - } - }); - return a; - } - - function findAttachedHosts(devId) { - var hosts = []; - nodes.forEach(function (d) { - if (d.class === 'host' && d.cp.device === devId) { - hosts.push(d); - } - }); - return hosts; - } - - function findAttachedLinks(devId) { - var lnks = []; - links.forEach(function (d) { - if (d.source.id === devId || d.target.id === devId) { - lnks.push(d); - } - }); - return lnks; - } - - // returns one-way links or where the internal link types differ - function findBadLinks() { - var lnks = [], - src, tgt; - links.forEach(function (d) { - // NOTE: skip edge links, which are synthesized - if (d.type() !== 'hostLink') { - delete d.bad; - src = d.fromSource; - tgt = d.fromTarget; - if (src && !tgt) { - d.bad = 'missing link'; - } else if (src.type !== tgt.type) { - d.bad = 'type mismatch'; - } - if (d.bad) { - lnks.push(d); - } - } - }); - return lnks; - } - - // ========================== - // Module definition - - angular.module('ovTopo') - .factory('TopoModelService', - ['$log', 'FnService', 'RandomService', - - function (_$log_, _fs_, _rnd_) { - $log = _$log_; - fs = _fs_; - rnd = _rnd_; - - function initModel(_api_, _dim_) { - api = _api_; - dim = _dim_; - lu = api.network.lookup; - rlk = api.network.revLinkToKey; - nodes = api.network.nodes; - links = api.network.links; - linksByDevice = api.network.linksByDevice; - } - - function newDim(_dim_) { - dim = _dim_; - } - - function destroyModel() { } - - return { - initModel: initModel, - newDim: newDim, - destroyModel: destroyModel, - - positionNode: positionNode, - createDeviceNode: createDeviceNode, - createHostNode: createHostNode, - createHostLink: createHostLink, - createLink: createLink, - coordFromLngLat: coordFromLngLat, - lngLatFromCoord: lngLatFromCoord, - findLink: findLink, - findLinkById: findLinkById, - findDevices: findDevices, - findAttachedHosts: findAttachedHosts, - findAttachedLinks: findAttachedLinks, - findBadLinks: findBadLinks - } - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoOblique.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoOblique.js deleted file mode 100644 index e84b1173..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoOblique.js +++ /dev/null @@ -1,257 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Oblique View Module. - Provides functionality to view the topology as two planes (packet & optical) - from an oblique (side-on) perspective. - */ - -(function () { - 'use strict'; - - // injected refs - var $log, fs, sus, flash; - - // api to topoForce - var api; - /* - force() // get ref to force layout object - zoomLayer() // get ref to zoom layer - nodeGBBox() // get bounding box of node group layer - node() // get ref to D3 selection of nodes - link() // get ref to D3 selection of links - nodes() // get ref to network nodes array - tickStuff // ref to tick functions - nodeLock(b) // test-and-set nodeLock state - opacifyMap(b) // show or hide map layer - inLayer(d, layer) // return true if d in layer {'pkt'|'opt'} - calcLinkPos() // recomputes link pos based on node data - */ - - // configuration - var xsky = -.7, // x skew y factor - xsk = -35, // x skew angle - ysc = .5, // y scale - pad = 50, - time = 1500, - fill = { - pkt: 'rgba(130,130,170,0.3)', // blue-ish - opt: 'rgba(170,130,170,0.3)' // magenta-ish - }; - - // internal state - var oblique = false, - xffn = null, - plane = {}, - oldNodeLock; - - - function planeId(tag) { - return 'topo-obview-' + tag + 'Plane'; - } - - function ytfn(h, dir) { - return h * ysc * dir * 1.1; - } - - function obXform(h, dir) { - var yt = ytfn(h, dir); - return sus.scale(1, ysc) + sus.translate(0, yt) + sus.skewX(xsk); - } - - function noXform() { - return sus.skewX(0) + sus.translate(0,0) + sus.scale(1,1); - } - - function padBox(box, p) { - box.x -= p; - box.y -= p; - box.width += p*2; - box.height += p*2; - } - - function toObliqueView() { - var box = api.nodeGBBox(), - ox, oy; - - padBox(box, pad); - - ox = box.x + box.width / 2; - oy = box.y + box.height / 2; - - // remember node lock state, then lock the nodes down - oldNodeLock = api.nodeLock(true); - api.opacifyMap(false); - - insertPlanes(ox, oy); - - xffn = function (xy, dir) { - var yt = ytfn(box.height, dir), - ax = xy.x - ox, - ay = xy.y - oy, - x = ax + ay * xsky, - y = (ay + yt) * ysc; - return {x: ox + x, y: oy + y}; - }; - - showPlane('pkt', box, -1); - showPlane('opt', box, 1); - obTransitionNodes(); - } - - function toNormalView() { - xffn = null; - - hidePlane('pkt'); - hidePlane('opt'); - obTransitionNodes(); - - removePlanes(); - - // restore node lock state - api.nodeLock(oldNodeLock); - api.opacifyMap(true); - } - - function obTransitionNodes() { - // return the direction for the node - // -1 for pkt layer, 1 for optical layer - function dir(d) { - return api.inLayer(d, 'pkt') ? -1 : 1; - } - - if (xffn) { - api.nodes().forEach(function (d) { - var oldxy = {x: d.x, y: d.y}, - coords = xffn(oldxy, dir(d)); - d.oldxy = oldxy; - d.px = d.x = coords.x; - d.py = d.y = coords.y; - }); - } else { - api.nodes().forEach(function (d) { - var old = d.oldxy || {x: d.x, y: d.y}; - d.px = d.x = old.x; - d.py = d.y = old.y; - delete d.oldxy; - }); - } - - api.node().transition() - .duration(time) - .attr(api.tickStuff.nodeAttr); - api.link().transition() - .duration(time) - .call(api.calcLinkPos) - .attr(api.tickStuff.linkAttr) - .call(api.applyNumLinkLabels); - api.linkLabel().transition() - .duration(time) - .attr(api.tickStuff.linkLabelAttr); - } - - function showPlane(tag, box, dir) { - // set box origin at center.. - box.x = -box.width/2; - box.y = -box.height/2; - - plane[tag].select('rect') - .attr(box) - .attr('opacity', 0) - .transition() - .duration(time) - .attr('opacity', 1) - .attr('transform', obXform(box.height, dir)); - } - - function hidePlane(tag) { - plane[tag].select('rect') - .transition() - .duration(time) - .attr('opacity', 0) - .attr('transform', noXform()); - } - - function insertPlanes(ox, oy) { - function ins(tag) { - var id = planeId(tag), - g = api.zoomLayer().insert('g', '#topo-G') - .attr('id', id) - .attr('transform', sus.translate(ox,oy)); - g.append('rect') - .attr('fill', fill[tag]) - .attr('opacity', 0); - plane[tag] = g; - } - ins('opt'); - ins('pkt'); - } - - function removePlanes() { - function rem(tag) { - var id = planeId(tag); - api.zoomLayer().select('#'+id) - .transition() - .duration(time + 50) - .remove(); - delete plane[tag]; - } - rem('opt'); - rem('pkt'); - } - - -// === ----------------------------------------------------- -// === MODULE DEFINITION === - -angular.module('ovTopo') - .factory('TopoObliqueService', - ['$log', 'FnService', 'SvgUtilService', 'FlashService', - - function (_$log_, _fs_, _sus_, _flash_) { - $log = _$log_; - fs = _fs_; - sus = _sus_; - flash = _flash_; - - function initOblique(_api_) { - api = _api_; - } - - function destroyOblique() { } - - function toggleOblique() { - oblique = !oblique; - if (oblique) { - api.force().stop(); - flash.flash('Oblique view'); - toObliqueView(); - } else { - flash.flash('Normal view'); - toNormalView(); - } - } - - return { - initOblique: initOblique, - destroyOblique: destroyOblique, - - isOblique: function () { return oblique; }, - toggleOblique: toggleOblique - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoOverlay.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoOverlay.js deleted file mode 100644 index fb7921ad..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoOverlay.js +++ /dev/null @@ -1,412 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * - */ - -/* - ONOS GUI -- Topology Overlay Module. - - Provides overlay capabilities, allowing ONOS apps to provide additional - custom data/behavior for the topology view. - - */ - -(function () { - 'use strict'; - - // constants - var tos = 'TopoOverlayService: '; - - // injected refs - var $log, fs, gs, wss, ns, tss, tps, api; - - // internal state - var overlays = {}, - current = null, - reset = true; - - function error(fn, msg) { - $log.error(tos + fn + '(): ' + msg); - } - - function warn(fn, msg) { - $log.warn(tos + fn + '(): ' + msg); - } - - function mkGlyphId(oid, gid) { - return (gid[0] === '*') ? oid + '-' + gid.slice(1) : gid; - } - - function handleGlyphs(o) { - var gdata = fs.isO(o.glyphs), - oid = o.overlayId, - gid = o.glyphId || 'unknown', - data = {}, - note = []; - - o._glyphId = mkGlyphId(oid, gid); - - o.mkGid = function (g) { - return mkGlyphId(oid, g); - }; - o.mkId = function (s) { - return oid + '-' + s; - }; - - // process glyphs if defined - if (gdata) { - angular.forEach(gdata, function (value, key) { - var fullkey = oid + '-' + key; - data['_' + fullkey] = value.vb; - data[fullkey] = value.d; - note.push('*' + key); - }); - gs.registerGlyphs(data); - $log.debug('registered overlay glyphs:', oid, note); - } - } - - function register(overlay) { - var r = 'register', - over = fs.isO(overlay), - kb = over ? fs.isO(overlay.keyBindings) : null, - id = over ? over.overlayId : ''; - - if (!id) { - return error(r, 'not a recognized overlay'); - } - if (overlays[id]) { - return warn(r, 'already registered: "' + id + '"'); - } - overlays[id] = overlay; - handleGlyphs(overlay); - - if (kb) { - if (!fs.isA(kb._keyOrder)) { - warn(r, 'no _keyOrder array defined on keyBindings'); - } else { - kb._keyOrder.forEach(function (k) { - if (k !== '-' && !kb[k]) { - warn(r, 'no "' + k + '" property defined on keyBindings'); - } - }); - } - } - - $log.debug(tos + 'registered overlay: ' + id, overlay); - } - - // returns the list of overlay identifiers - function list() { - return d3.map(overlays).keys(); - } - - // add a radio button for each registered overlay - // return an overlay id to index map - function augmentRbset(rset, switchFn) { - var map = {}, - idx = 1; - - angular.forEach(overlays, function (ov) { - rset.push({ - gid: ov._glyphId, - tooltip: (ov.tooltip || '(no tooltip)'), - cb: function () { - tbSelection(ov.overlayId, switchFn); - } - }); - map[ov.overlayId] = idx++; - }); - return map; - } - - // an overlay was selected via toolbar radio button press from user - function tbSelection(id, switchFn) { - var same = current && current.overlayId === id, - payload = {}, - actions; - - function doop(op) { - var oid = current.overlayId; - $log.debug('Overlay:', op, oid); - current[op](); - payload[op] = oid; - } - - if (reset || !same) { - reset = false; - current && doop('deactivate'); - current = overlays[id]; - current && doop('activate'); - actions = current && fs.isO(current.keyBindings); - switchFn(id, actions); - - wss.sendEvent('topoSelectOverlay', payload); - - // Ensure summary and details panels are updated immediately.. - wss.sendEvent('requestSummary'); - tss.updateDetail(); - } - } - - var coreButtons = { - showDeviceView: { - gid: 'switch', - tt: 'Show Device View', - path: 'device' - }, - showFlowView: { - gid: 'flowTable', - tt: 'Show Flow View for this Device', - path: 'flow' - }, - showPortView: { - gid: 'portTable', - tt: 'Show Port View for this Device', - path: 'port' - }, - showGroupView: { - gid: 'groupTable', - tt: 'Show Group View for this Device', - path: 'group' - } - }; - - // retrieves a button definition from the current overlay and generates - // a button descriptor to be added to the panel, with the data baked in - function _getButtonDef(id, data) { - var btns = current && current.buttons, - b = btns && btns[id], - cb = fs.isF(b.cb), - f = cb ? function () { cb(data); } : function () {}; - - return b ? { - id: current.mkId(id), - gid: current.mkGid(b.gid), - tt: b.tt, - cb: f - } : null; - } - - // install core buttons, and include any additional from the current overlay - function installButtons(buttons, data, devId) { - buttons.forEach(function (id) { - var btn = coreButtons[id], - gid = btn && btn.gid, - tt = btn && btn.tt, - path = btn && btn.path; - - if (btn) { - tps.addAction({ - id: 'core-' + id, - gid: gid, - tt: tt, - cb: function () { ns.navTo(path, {devId: devId }); } - }); - } else if (btn = _getButtonDef(id, data)) { - tps.addAction(btn); - } - }); - } - - function addDetailButton(id) { - var b = _getButtonDef(id); - if (b) { - tps.addAction({ - id: current.mkId(id), - gid: current.mkGid(b.gid), - cb: b.cb, - tt: b.tt - }); - } - } - - - // === ----------------------------------------------------- - // Hooks for overlays - - function _hook(x) { - var h = current && current.hooks; - return h && fs.isF(h[x]); - } - - function escapeHook() { - var eh = _hook('escape'); - return eh ? eh() : false; - } - - function emptySelectHook() { - var cb = _hook('empty'); - cb && cb(); - } - - function singleSelectHook(data) { - var cb = _hook('single'); - cb && cb(data); - } - - function multiSelectHook(selectOrder) { - var cb = _hook('multi'); - cb && cb(selectOrder); - } - - function mouseOverHook(what) { - var cb = _hook('mouseover'); - cb && cb(what); - } - - function mouseOutHook() { - var cb = _hook('mouseout'); - cb && cb(); - } - - // === ----------------------------------------------------- - // Event (from server) Handlers - - function setApi(_api_, _tss_) { - api = _api_; - tss = _tss_; - } - - function showHighlights(data) { - var less; - - /* - API to topoForce - clearLinkTrafficStyle() - removeLinkLabels() - findLinkById( id ) - findNodeById( id ) - updateLinks() - updateNodes() - supLayers( bool, [less] ) - unsupNode( id, [less] ) - unsupLink( key, [less] ) - */ - - api.clearNodeDeco(); - api.removeNodeBadges(); - api.clearLinkTrafficStyle(); - api.removeLinkLabels(); - - // handle element suppression - if (data.subdue) { - less = data.subdue === 'min'; - api.supLayers(true, less); - - } else { - api.supLayers(false); - api.supLayers(false, true); - } - - data.hosts.forEach(function (host) { - var hdata = api.findNodeById(host.id), - badgeData = host.badge || null; - - if (hdata && !hdata.el.empty()) { - hdata.badge = badgeData; - if (!host.subdue) { - api.unsupNode(hdata.id, less); - } - // TODO: further highlighting? - } - }); - - data.devices.forEach(function (device) { - var ddata = api.findNodeById(device.id), - badgeData = device.badge || null; - - if (ddata && !ddata.el.empty()) { - ddata.badge = badgeData; - if (!device.subdue) { - api.unsupNode(ddata.id, less); - } - // TODO: further highlighting? - } - }); - - data.links.forEach(function (link) { - var ldata = api.findLinkById(link.id), - lab = link.label, - units, portcls, magnitude; - - if (ldata && !ldata.el.empty()) { - if (!link.subdue) { - api.unsupLink(ldata.key, less); - } - ldata.el.classed(link.css, true); - ldata.label = lab; - - // TODO: this needs to be pulled out into traffic overlay - // inject additional styling for port-based traffic - if (fs.endsWith(lab, 'bps')) { - units = lab.substring(lab.length-4); - portcls = 'port-traffic-' + units; - - // for GBps - if (units.substring(0,1) === 'G') { - magnitude = fs.parseBitRate(lab); - if (magnitude >= 9) { - portcls += '-choked' - } - } - ldata.el.classed(portcls, true); - } - } - }); - - api.updateNodes(); - api.updateLinks(); - } - - // ======================================================================== - - angular.module('ovTopo') - .factory('TopoOverlayService', - ['$log', 'FnService', 'GlyphService', 'WebSocketService', 'NavService', - 'TopoPanelService', - - function (_$log_, _fs_, _gs_, _wss_, _ns_, _tps_) { - $log = _$log_; - fs = _fs_; - gs = _gs_; - wss = _wss_; - ns = _ns_; - tps = _tps_; - - return { - register: register, - setApi: setApi, - list: list, - augmentRbset: augmentRbset, - mkGlyphId: mkGlyphId, - tbSelection: tbSelection, - installButtons: installButtons, - addDetailButton: addDetailButton, - resetOnToolbarDestroy: function () { reset = true; }, - hooks: { - escape: escapeHook, - emptySelect: emptySelectHook, - singleSelect: singleSelectHook, - multiSelect: multiSelectHook, - mouseOver: mouseOverHook, - mouseOut: mouseOutHook - }, - - showHighlights: showHighlights - } - }]); - -}());
\ No newline at end of file diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoPanel.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoPanel.js deleted file mode 100644 index 1b8c2192..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoPanel.js +++ /dev/null @@ -1,539 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Panel Module. - Defines functions for manipulating the summary, detail, and instance panels. - */ - -(function () { - 'use strict'; - - // injected refs - var $log, $window, $rootScope, fs, ps, gs, flash, wss, bns, mast, ns; - - // constants - var pCls = 'topo-p', - idSum = 'topo-p-summary', - idDet = 'topo-p-detail', - panelOpts = { - width: 260 - }, - sumMax = 262, - padTop = 20, - devPath = 'device'; - - // internal state - var useDetails = true, // should we show details if we have 'em? - haveDetails = false, // do we have details that we could show? - sumFromTop, // summary panel distance from top of screen - unbindWatch; - - // panels - var summary, detail; - - // === ----------------------------------------------------- - // Panel API - function createTopoPanel(id, opts) { - var p = ps.createPanel(id, opts), - pid = id, - header, body, footer; - p.classed(pCls, true); - - function panel() { - return p; - } - - function hAppend(x) { - return header.append(x); - } - - function bAppend(x) { - return body.append(x); - } - - function fAppend(x) { - return footer.append(x); - } - - function setup() { - p.empty(); - - p.append('div').classed('header', true); - p.append('div').classed('body', true); - p.append('div').classed('footer', true); - - header = p.el().select('.header'); - body = p.el().select('.body'); - footer = p.el().select('.footer'); - } - - function destroy() { - ps.destroyPanel(pid); - } - - // fromTop is how many pixels from the top of the page the panel is - // max is the max height of the panel in pixels - // only adjusts if the body content would be 10px or larger - function adjustHeight(fromTop, max) { - var totalPHeight, avSpace, - overflow = 0, - pdg = 30; - - if (!fromTop) { - $log.warn('adjustHeight: height from top of page not given'); - return null; - } else if (!body || !p) { - $log.warn('adjustHeight: panel contents are not defined'); - return null; - } - - p.el().style('height', null); - body.style('height', null); - - totalPHeight = fromTop + p.height(); - avSpace = fs.windowSize(pdg).height; - - if (totalPHeight >= avSpace) { - overflow = totalPHeight - avSpace; - } - - function _adjustBody(height) { - if (height < 10) { - return false; - } else { - body.style('height', height + 'px'); - } - return true; - } - - if (!_adjustBody(fs.noPxStyle(body, 'height') - overflow)) { - return; - } - - if (max && p.height() > max) { - _adjustBody(fs.noPxStyle(body, 'height') - (p.height() - max)); - } - } - - return { - panel: panel, - setup: setup, - destroy: destroy, - appendHeader: hAppend, - appendBody: bAppend, - appendFooter: fAppend, - adjustHeight: adjustHeight - }; - } - - // === ----------------------------------------------------- - // Utility functions - - function addSep(tbody) { - tbody.append('tr').append('td').attr('colspan', 2).append('hr'); - } - - function addBtnFooter() { - detail.appendFooter('hr'); - detail.appendFooter('div').classed('actionBtns', true); - } - - function addProp(tbody, label, value) { - var tr = tbody.append('tr'), - lab; - if (typeof label === 'string') { - lab = label.replace(/_/g, ' '); - } else { - lab = label; - } - - function addCell(cls, txt) { - tr.append('td').attr('class', cls).html(txt); - } - addCell('label', lab + ' :'); - addCell('value', value); - } - - function listProps(tbody, data) { - data.propOrder.forEach(function (p) { - if (p === '-') { - addSep(tbody); - } else { - addProp(tbody, p, data.props[p]); - } - }); - } - - function watchWindow() { - unbindWatch = $rootScope.$watchCollection( - function () { - return { - h: $window.innerHeight, - w: $window.innerWidth - }; - }, function () { - summary.adjustHeight(sumFromTop, sumMax); - detail.adjustHeight(detail.ypos.current); - } - ); - } - - // === ----------------------------------------------------- - // Functions for populating the summary panel - - function populateSummary(data) { - summary.setup(); - - var svg = summary.appendHeader('div') - .classed('icon', true) - .append('svg'), - title = summary.appendHeader('h2'), - table = summary.appendBody('table'), - tbody = table.append('tbody'), - glyphId = data.type || 'node'; - - gs.addGlyph(svg, glyphId, 40); - - if (glyphId === 'node') { - gs.addGlyph(svg, 'bird', 24, true, [8,12]); - } - - title.text(data.title); - listProps(tbody, data); - } - - // === ----------------------------------------------------- - // Functions for populating the detail panel - - var isDevice = { - switch: 1, - roadm: 1 - }; - - function displaySingle(data) { - detail.setup(); - - var svg = detail.appendHeader('div') - .classed('icon clickable', true) - .append('svg'), - title = detail.appendHeader('h2') - .classed('clickable', true), - table = detail.appendBody('table'), - tbody = table.append('tbody'), - navFn; - - gs.addGlyph(svg, (data.type || 'unknown'), 40); - title.text(data.title); - - // only add navigation when displaying a device - if (isDevice[data.type]) { - navFn = function () { - ns.navTo(devPath, { devId: data.id }); - }; - - svg.on('click', navFn); - title.on('click', navFn); - } - - listProps(tbody, data); - addBtnFooter(); - } - - function displayMulti(ids) { - detail.setup(); - - var title = detail.appendHeader('h3'), - table = detail.appendBody('table'), - tbody = table.append('tbody'); - - title.text('Selected Nodes'); - ids.forEach(function (d, i) { - addProp(tbody, i+1, d); - }); - addBtnFooter(); - } - - function addAction(o) { - var btnDiv = d3.select('#' + idDet) - .select('.actionBtns') - .append('div') - .classed('actionBtn', true); - bns.button(btnDiv, idDet + '-' + o.id, o.gid, o.cb, o.tt); - } - - var friendlyIndex = { - device: 1, - host: 0 - }; - - function friendly(d) { - var i = friendlyIndex[d.class] || 0; - return (d.labels && d.labels[i]) || ''; - } - - function linkSummary(d) { - var o = d && d.online ? 'online' : 'offline'; - return d ? d.type + ' / ' + o : '-'; - } - - // provided to change presentation of internal type name - var linkTypePres = { - hostLink: 'edge link' - }; - - function linkType(d) { - return linkTypePres[d.type()] || d.type(); - } - - var coreOrder = [ - 'Type', '-', - 'A_type', 'A_id', 'A_label', 'A_port', '-', - 'B_type', 'B_id', 'B_label', 'B_port', '-' - ], - edgeOrder = [ - 'Type', '-', - 'A_type', 'A_id', 'A_label', '-', - 'B_type', 'B_id', 'B_label', 'B_port' - ]; - - function displayLink(data) { - detail.setup(); - - var svg = detail.appendHeader('div') - .classed('icon', true) - .append('svg'), - title = detail.appendHeader('h2'), - table = detail.appendBody('table'), - tbody = table.append('tbody'), - edgeLink = data.type() === 'hostLink', - order = edgeLink ? edgeOrder : coreOrder; - - gs.addGlyph(svg, 'ports', 40); - title.text('Link'); - - - listProps(tbody, { - propOrder: order, - props: { - Type: linkType(data), - - A_type: data.source.class, - A_id: data.source.id, - A_label: friendly(data.source), - A_port: data.srcPort, - - B_type: data.target.class, - B_id: data.target.id, - B_label: friendly(data.target), - B_port: data.tgtPort - } - }); - - if (!edgeLink) { - addProp(tbody, 'A → B', linkSummary(data.fromSource)); - addProp(tbody, 'B → A', linkSummary(data.fromTarget)); - } - } - - function displayNothing() { - haveDetails = false; - hideDetailPanel(); - } - - function displaySomething() { - haveDetails = true; - if (useDetails) { - showDetailPanel(); - } - } - - // === ----------------------------------------------------- - // Event Handlers - - function showSummary(data) { - populateSummary(data); - showSummaryPanel(); - } - - function toggleSummary(x) { - var kev = (x === 'keyev'), - on = kev ? !summary.panel().isVisible() : !!x, - verb = on ? 'Show' : 'Hide'; - - if (on) { - // ask server to start sending summary data. - wss.sendEvent('requestSummary'); - // note: the summary panel will appear, once data arrives - } else { - hideSummaryPanel(); - } - flash.flash(verb + ' summary panel'); - return on; - } - - // === ----------------------------------------------------- - // === LOGIC For showing/hiding summary and detail panels... - - function showSummaryPanel() { - function _show() { - summary.panel().show(); - summary.adjustHeight(sumFromTop, sumMax); - } - if (detail.panel().isVisible()) { - detail.down(_show); - } else { - _show(); - } - } - - function hideSummaryPanel() { - // instruct server to stop sending summary data - wss.sendEvent("cancelSummary"); - summary.panel().hide(detail.up); - } - - function showDetailPanel() { - if (summary.panel().isVisible()) { - detail.down(detail.panel().show); - } else { - detail.up(detail.panel().show); - } - } - - function hideDetailPanel() { - detail.panel().hide(); - } - - // ========================== - - function augmentDetailPanel() { - var d = detail, - downPos = sumFromTop + sumMax + 20; - d.ypos = { up: sumFromTop, down: downPos, current: downPos}; - - d._move = function (y, cb) { - var yp = d.ypos, - endCb; - - if (fs.isF(cb)) { - endCb = function () { - cb(); - d.adjustHeight(d.ypos.current); - } - } else { - endCb = function () { - d.adjustHeight(d.ypos.current); - } - } - if (yp.current !== y) { - yp.current = y; - d.panel().el().transition().duration(300) - .each('end', endCb) - .style('top', yp.current + 'px'); - } else { - endCb(); - } - }; - - d.down = function (cb) { d._move(d.ypos.down, cb); }; - d.up = function (cb) { d._move(d.ypos.up, cb); }; - } - - function toggleUseDetailsFlag(x) { - var kev = (x === 'keyev'), - verb; - - useDetails = kev ? !useDetails : !!x; - verb = useDetails ? 'Enable' : 'Disable'; - - if (useDetails) { - if (haveDetails) { - showDetailPanel(); - } - } else { - hideDetailPanel(); - } - flash.flash(verb + ' details panel'); - return useDetails; - } - - // ========================== - - function initPanels() { - sumFromTop = mast.mastHeight() + padTop; - summary = createTopoPanel(idSum, panelOpts); - detail = createTopoPanel(idDet, panelOpts); - - augmentDetailPanel(); - watchWindow(); - } - - function destroyPanels() { - summary.destroy(); - summary = null; - - detail.destroy(); - detail = null; - haveDetails = false; - unbindWatch(); - } - - // ========================== - - angular.module('ovTopo') - .factory('TopoPanelService', - ['$log', '$window', '$rootScope', 'FnService', 'PanelService', 'GlyphService', - 'FlashService', 'WebSocketService', 'ButtonService', 'MastService', - 'NavService', - - function (_$log_, _$window_, _$rootScope_, - _fs_, _ps_, _gs_, _flash_, _wss_, _bns_, _mast_, _ns_) { - $log = _$log_; - $window = _$window_; - $rootScope = _$rootScope_; - fs = _fs_; - ps = _ps_; - gs = _gs_; - flash = _flash_; - wss = _wss_; - bns = _bns_; - mast = _mast_; - ns = _ns_; - - return { - initPanels: initPanels, - destroyPanels: destroyPanels, - createTopoPanel: createTopoPanel, - - showSummary: showSummary, - toggleSummary: toggleSummary, - - toggleUseDetailsFlag: toggleUseDetailsFlag, - displaySingle: displaySingle, - displayMulti: displayMulti, - displayLink: displayLink, - displayNothing: displayNothing, - displaySomething: displaySomething, - addAction: addAction, - - hideSummaryPanel: hideSummaryPanel, - - detailVisible: function () { return detail.panel().isVisible(); }, - summaryVisible: function () { return summary.panel().isVisible(); } - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoSelect.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoSelect.js deleted file mode 100644 index 4ad76903..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoSelect.js +++ /dev/null @@ -1,314 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Selection Module. - Defines behavior when selecting nodes. - */ - -(function () { - 'use strict'; - - // injected refs - var $log, fs, wss, tov, tps, tts, ns; - - // api to topoForce - var api; - /* - node() // get ref to D3 selection of nodes - zoomingOrPanning( ev ) - updateDeviceColors( [dev] ) - deselectLink() - */ - - // internal state - var hovered, // the node over which the mouse is hovering - selections = {}, // currently selected nodes (by id) - selectOrder = [], // the order in which we made selections - consumeClick = false; // used to coordinate with SVG click handler - - // ========================== - - function nSel() { - return selectOrder.length; - } - function getSel(idx) { - return selections[selectOrder[idx]]; - } - function allSelectionsClass(cls) { - for (var i=0, n=nSel(); i<n; i++) { - if (getSel(i).obj.class !== cls) { - return false; - } - } - return true; - } - - // ========================== - - function nodeMouseOver(m) { - if (!m.dragStarted) { - if (hovered != m) { - hovered = m; - tov.hooks.mouseOver({ - id: m.id, - class: m.class, - type: m.type - }); - } - } - } - - function nodeMouseOut(m) { - if (!m.dragStarted) { - if (hovered) { - hovered = null; - tov.hooks.mouseOut(); - } - } - } - - // ========================== - - function selectObject(obj) { - var el = this, - nodeEv = el && el.tagName === 'g', - ev = d3.event.sourceEvent || {}, - n; - - if (api.zoomingOrPanning(ev)) { - return; - } - - if (nodeEv) { - n = d3.select(el); - } else { - api.node().each(function (d) { - if (d == obj) { - n = d3.select(el = this); - } - }); - } - if (!n) return; - - if (nodeEv) { - consumeClick = true; - } - api.deselectLink(); - - if (ev.shiftKey && n.classed('selected')) { - deselectObject(obj.id); - updateDetail(); - return; - } - - if (!ev.shiftKey) { - deselectAll(true); - } - - selections[obj.id] = { obj: obj, el: el }; - selectOrder.push(obj.id); - - n.classed('selected', true); - api.updateDeviceColors(obj); - updateDetail(); - } - - function deselectObject(id) { - var obj = selections[id]; - if (obj) { - d3.select(obj.el).classed('selected', false); - delete selections[id]; - fs.removeFromArray(id, selectOrder); - api.updateDeviceColors(obj.obj); - } - } - - function deselectAll(skipUpdate) { - var something = (selectOrder.length > 0); - - // deselect all nodes in the network... - api.node().classed('selected', false); - selections = {}; - selectOrder = []; - api.updateDeviceColors(); - if (!skipUpdate) { - updateDetail(); - } - - // return true if something was selected - return something; - } - - // === ----------------------------------------------------- - - function requestDetails(data) { - wss.sendEvent('requestDetails', { - id: data.id, - class: data.class - }); - } - - // === ----------------------------------------------------- - - function updateDetail() { - var nSel = selectOrder.length; - if (!nSel) { - emptySelect(); - } else if (nSel === 1) { - singleSelect(); - } else { - multiSelect(); - } - } - - function emptySelect() { - tov.hooks.emptySelect(); - tps.displayNothing(); - } - - function singleSelect() { - var data = getSel(0).obj; - requestDetails(data); - // NOTE: detail panel is shown as a response to receiving - // a 'showDetails' event from the server. See 'showDetails' - // callback function below... - } - - function multiSelect() { - // display the selected nodes in the detail panel - tps.displayMulti(selectOrder); - addHostSelectionActions(); - tov.hooks.multiSelect(selectOrder); - tps.displaySomething(); - } - - function addHostSelectionActions() { - if (allSelectionsClass('host')) { - if (nSel() === 2) { - tps.addAction({ - id: 'host-flow-btn', - gid: 'endstation', - cb: tts.addHostIntent, - tt: 'Create Host-to-Host Flow' - }); - } else if (nSel() >= 2) { - tps.addAction({ - id: 'mult-src-flow-btn', - gid: 'flows', - cb: tts.addMultiSourceIntent, - tt: 'Create Multi-Source Flow' - }); - } - } - } - - - // === ----------------------------------------------------- - // Event Handlers - - // display the data for the single selected node - function showDetails(data) { - var buttons = fs.isA(data.buttons) || []; - tps.displaySingle(data); - tov.installButtons(buttons, data, data.props['URI']); - tov.hooks.singleSelect(data); - tps.displaySomething(); - } - - // returns true if one or more nodes are selected. - function somethingSelected() { - return nSel(); - } - - function clickConsumed(x) { - var cc = consumeClick; - consumeClick = !!x; - return cc; - } - - // returns a selection context, providing info about what is selected - function selectionContext() { - var devices = [], - hosts = [], - types = {}; - - angular.forEach(selections, function (d) { - var o = d.obj, - c = o.class; - - if (c === 'device') { - devices.push(o.id); - types[o.id] = o.type; - } - if (c === 'host') { - hosts.push(o.id); - types[o.id] = o.type; - } - }); - - return { - devices: devices, - hosts: hosts, - types: types - }; - } - - // === ----------------------------------------------------- - // === MODULE DEFINITION === - - angular.module('ovTopo') - .factory('TopoSelectService', - ['$log', 'FnService', 'WebSocketService', 'TopoOverlayService', - 'TopoPanelService', 'TopoTrafficService', 'NavService', - - function (_$log_, _fs_, _wss_, _tov_, _tps_, _tts_, _ns_) { - $log = _$log_; - fs = _fs_; - wss = _wss_; - tov = _tov_; - tps = _tps_; - tts = _tts_; - ns = _ns_; - - function initSelect(_api_) { - api = _api_; - } - - function destroySelect() { } - - return { - initSelect: initSelect, - destroySelect: destroySelect, - - showDetails: showDetails, - - nodeMouseOver: nodeMouseOver, - nodeMouseOut: nodeMouseOut, - selectObject: selectObject, - deselectObject: deselectObject, - deselectAll: deselectAll, - updateDetail: updateDetail, - - hovered: function () { return hovered; }, - selectOrder: function () { return selectOrder; }, - somethingSelected: somethingSelected, - - clickConsumed: clickConsumed, - selectionContext: selectionContext - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoSprite.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoSprite.js deleted file mode 100644 index 1c957412..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoSprite.js +++ /dev/null @@ -1,262 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Sprite Module. - Defines behavior for loading sprites into the sprite layer. - */ - -(function () { - 'use strict'; - - // injected refs - var $log, $http, fs, gs, sus, wss; - - // constants - var tssid = 'TopoSpriteService: ', - fontsize = 20; // default font size 20pt. - - // internal state - var spriteLayer, defsElement; - - - function registerPathsAsGlyphs(paths) { - var custom = {}, - ids = []; - - function mkd(d) { - return fs.isA(d) ? d.join('') : d; - } - - paths.forEach(function (path) { - var tag = 'spr_' + path.tag; - - if (path.glyph) { - // assumption is that we are using a built-in glyph - return; - } - - custom['_' + tag] = path.viewbox || '0 0 1000 1000'; - custom[tag] = mkd(path.d); - ids.push(tag); - }); - - gs.registerGlyphs(custom); - gs.loadDefs(defsElement, ids, true); - } - - function applyStrokeStyle(s, use) { - var style; - if (s) { - style = {}; - angular.forEach(s, function (value, key) { - style['stroke-' + key] = value; - }); - use.style(style); - } - } - - function applyFillClass(f, use) { - use.classed('fill-' + f, true); - } - - function doSprite(spr, def, pathmeta) { - var pmeta = pathmeta[def.path], - c = spr.class || 'gray1', - p = spr.pos || [0,0], - lab = spr.label, - dim = def.dim || [40,40], - w = dim[0], - h = dim[1], - dy = def.labelyoff || 1, - sc = def.scale, - xfm = sus.translate(p), - g, attr, use; - - if (sc) { - xfm += sus.scale(sc, sc); - } - - g = spriteLayer.append('g') - .classed(c, true) - .attr('transform', xfm); - - attr = { - width: w, - height: h, - 'xlink:href': '#' + pmeta.u - }; - - use = g.append('use').attr(attr); - applyStrokeStyle(pmeta.s, use); - applyFillClass(def.fill, use); - - - // add subpaths if they have been defined - if (fs.isA(def.subpaths)) { - def.subpaths.forEach(function (v) { - pmeta = pathmeta[v.path]; - attr = { - width: w, - height: h, - 'xlink:href': '#' + pmeta.u, - transform: sus.translate(v.pos) - }; - use = g.append('use').attr(attr); - applyStrokeStyle(pmeta.s, use); - applyFillClass(def.subpathfill, use); - }); - } - - if (lab) { - g.append('text') - .text(lab) - .attr({ x: w / 2, y: h * dy }); - } - } - - function doLabel(label) { - var c = label.class || 'gray1', - p = label.pos || [0,0], - sz = label.size || 1.0, - g = spriteLayer.append('g') - .classed(c, true) - .attr('transform', sus.translate(p)) - .append('text') - .text(label.text) - .style('font-size', (fontsize * sz)+'pt'); - } - - - // ========================== - // event handlers - - // Handles response from 'spriteListRequest' which lists all the - // registered sprite definitions on the server. - // (see onos-upload-sprites) - function inList(payload) { - $log.debug(tssid + 'Registered sprite definitions:', payload.names); - // Some day, we will make this list available to the user in - // a dropdown selection box... - } - - // Handles response from 'spriteDataRequest' which provides the - // data for the requested sprite definition. - function inData(payload) { - var data = payload.data, - name, desc, pfx, sprites, labels, alpha, - paths, defn, load, - pathmeta = {}, - defs = {}, - warn = []; - - if (!data) { - $log.warn(tssid + 'No sprite data loaded.'); - return; - } - name = data.defn_name; - desc = data.defn_desc; - paths = data.paths; - defn = data.defn; - load = data.load; - pfx = tssid + '[' + name + ']: '; - - $log.debug("Loading sprites...[" + name + "]", desc); - - function no(what) { - warn.push(pfx + 'No ' + what + ' property defined'); - } - - if (!paths) no('paths'); - if (!defn) no('defn'); - if (!load) no('load'); - - if (warn.length) { - $log.error(warn.join('\n')); - return; - } - - // any custom paths need to be added to the glyph DB, and imported - registerPathsAsGlyphs(paths); - - paths.forEach(function (p) { - pathmeta[p.tag] = { - s: p.stroke, - u: p.glyph || 'spr_' + p.tag - }; - }); - - defn.forEach(function (d) { - defs[d.id] = d; - }); - - // sprites, labels and alpha are each optional components of the load - sprites = load.sprites; - labels = load.labels; - alpha = load.alpha; - - if (alpha) { - spriteLayer.style('opacity', alpha); - } - - if (sprites) { - sprites.forEach(function (spr) { - var def = defs[spr.id]; - doSprite(spr, def, pathmeta); - }); - } - - if (labels) { - labels.forEach(doLabel); - } - } - - - function loadSprites(layer, defsElem, defname) { - var name = defname || 'sprites'; - spriteLayer = layer; - defsElement = defsElem; - - $log.info(tssid + 'Requesting sprite definition ['+name+']...'); - - wss.sendEvent('spriteListRequest'); - wss.sendEvent('spriteDataRequest', {name: name}); - } - - // === ----------------------------------------------------- - // === MODULE DEFINITION === - - angular.module('ovTopo') - .factory('TopoSpriteService', - ['$log', '$http', 'FnService', 'GlyphService', - 'SvgUtilService', 'WebSocketService', - - function (_$log_, _$http_, _fs_, _gs_, _sus_, _wss_) { - $log = _$log_; - $http = _$http_; - fs = _fs_; - gs = _gs_; - sus = _sus_; - wss = _wss_; - - return { - loadSprites: loadSprites, - spriteListResponse: inList, - spriteDataResponse: inData - }; - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoToolbar.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoToolbar.js deleted file mode 100644 index fbcdaf6d..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoToolbar.js +++ /dev/null @@ -1,295 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Toolbar Module. - Functions for creating and interacting with the toolbar. - */ - -(function () { - 'use strict'; - - // injected references - var $log, fs, tbs, ps, tov, tds, api; - - // API: - // getActionEntry - // setUpKeys - - // internal state - var toolbar, keyData, cachedState, thirdRow, ovRset, ovIndex; - - // constants - var name = 'topo-tbar', - cooktag = 'topo_prefs', - soa = 'switchOverlayActions: ', - selOver = 'Select overlay here ⇧', - defaultOverlay = 'traffic'; - - - // key to button mapping data - var k2b = { - O: { id: 'summary-tog', gid: 'summary', isel: true}, - I: { id: 'instance-tog', gid: 'uiAttached', isel: true }, - D: { id: 'details-tog', gid: 'details', isel: true }, - H: { id: 'hosts-tog', gid: 'endstation', isel: false }, - M: { id: 'offline-tog', gid: 'switch', isel: true }, - P: { id: 'ports-tog', gid: 'ports', isel: true }, - B: { id: 'bkgrnd-tog', gid: 'map', isel: false }, - S: { id: 'sprite-tog', gid: 'cloud', isel: false }, - - //X: { id: 'nodelock-tog', gid: 'lock', isel: false }, - Z: { id: 'oblique-tog', gid: 'oblique', isel: false }, - N: { id: 'filters-btn', gid: 'filters' }, - L: { id: 'cycleLabels-btn', gid: 'cycleLabels' }, - R: { id: 'resetZoom-btn', gid: 'resetZoom' }, - - E: { id: 'eqMaster-btn', gid: 'eqMaster' } - }; - - var prohibited = [ - 'T', 'backSlash', 'slash', - 'X' // needed until we re-instate X above. - ]; - prohibited = prohibited.concat(d3.map(k2b).keys()); - - - // initial toggle state: default settings and tag to key mapping - var defaultPrefsState = { - summary: 1, - insts: 1, - detail: 1, - hosts: 0, - offdev: 1, - porthl: 1, - bg: 0, - spr: 0, - toolbar: 0 - }, - prefsMap = { - summary: 'O', - insts: 'I', - detail: 'D', - hosts: 'H', - offdev: 'M', - porthl: 'P', - bg: 'B', - spr: 'S' - // NOTE: toolbar state is handled separately - }; - - function init(_api_) { - api = _api_; - - // retrieve initial toggle button settings from user prefs - setInitToggleState(); - } - - function topoDefPrefs() { - return angular.extend({}, defaultPrefsState); - } - - function setInitToggleState() { - cachedState = ps.asNumbers(ps.getPrefs(cooktag)); - $log.debug('TOOLBAR---- read prefs state:', cachedState); - - if (!cachedState) { - cachedState = topoDefPrefs(); - ps.setPrefs(cooktag, cachedState); - $log.debug('TOOLBAR---- Set default prefs state:', cachedState); - } - - angular.forEach(prefsMap, function (v, k) { - var cfg = k2b[v]; - cfg && (cfg.isel = !!cachedState[k]); - }); - } - - function initKeyData() { - // TODO: use angular forEach instead of d3.map - keyData = d3.map(k2b); - keyData.forEach(function(key, value) { - var data = api.getActionEntry(key); - value.cb = data[0]; // on-click callback - value.tt = data[1] + ' (' + key + ')'; // tooltip - }); - } - - function addButton(key) { - var v = keyData.get(key); - v.btn = toolbar.addButton(v.id, v.gid, v.cb, v.tt); - } - - function addToggle(key, suppressIfMobile) { - var v = keyData.get(key); - if (suppressIfMobile && fs.isMobile()) { return; } - v.tog = toolbar.addToggle(v.id, v.gid, v.isel, v.cb, v.tt); - } - - function addFirstRow() { - addToggle('I'); - addToggle('O'); - addToggle('D'); - toolbar.addSeparator(); - - addToggle('H'); - addToggle('M'); - addToggle('P', true); - addToggle('B'); - addToggle('S', true); - } - - function addSecondRow() { - //addToggle('X'); - addToggle('Z'); - addButton('N'); - addButton('L'); - addButton('R'); - toolbar.addSeparator(); - addButton('E'); - } - - function addOverlays() { - toolbar.addSeparator(); - - // generate radio button set for overlays; start with 'none' - var rset = [{ - gid: 'unknown', - tooltip: 'No Overlay', - cb: function () { - tov.tbSelection(null, switchOverlayActions); - } - }]; - ovIndex = tov.augmentRbset(rset, switchOverlayActions); - ovRset = toolbar.addRadioSet('topo-overlays', rset); - } - - // invoked by overlay service to switch out old buttons and switch in new - function switchOverlayActions(oid, keyBindings) { - var prohibits = [], - kb = fs.isO(keyBindings) || {}, - order = fs.isA(kb._keyOrder) || []; - - if (keyBindings && !keyBindings._keyOrder) { - $log.warn(soa + 'no _keyOrder property defined'); - } else { - // sanity removal of reserved property names - ['esc', '_keyListener', '_helpFormat'].forEach(function (k) { - fs.removeFromArray(k, order); - }); - } - - // ensure dialog has closed (if opened by outgoing overlay) - tds.closeDialog(); - thirdRow.clear(); - - if (!order.length) { - thirdRow.setText(selOver); - thirdRow.classed('right', true); - api.setUpKeys(); // clear previous overlay key bindings - - } else { - thirdRow.classed('right', false); - angular.forEach(order, function (key) { - var value, bid, gid, tt; - - if (prohibited.indexOf(key) > -1) { - prohibits.push(key); - - } else { - value = keyBindings[key]; - bid = oid + '-' + key; - gid = tov.mkGlyphId(oid, value.gid); - tt = value.tt + ' (' + key + ')'; - thirdRow.addButton(bid, gid, value.cb, tt); - } - }); - api.setUpKeys(keyBindings); // add overlay key bindings - } - - if (prohibits.length) { - $log.warn(soa + 'Prohibited key bindings ignored:', prohibits); - } - } - - function createToolbar() { - initKeyData(); - toolbar = tbs.createToolbar(name); - addFirstRow(); - toolbar.addRow(); - addSecondRow(); - addOverlays(); - thirdRow = toolbar.addRow(); - thirdRow.setText(selOver); - thirdRow.classed('right', true); - - if (cachedState.toolbar) { - toolbar.show(); - } else { - toolbar.hide(); - } - } - - function destroyToolbar() { - tbs.destroyToolbar(name); - tov.resetOnToolbarDestroy(); - } - - // allows us to ensure the button states track key strokes - function keyListener(key) { - var v = keyData.get(key); - - if (v) { - // we have a valid button mapping - if (v.tog) { - // it's a toggle button - v.tog.toggleNoCb(); - } - } - } - - function toggleToolbar() { - toolbar.toggle(); - } - - function setDefaultOverlay() { - var idx = ovIndex[defaultOverlay] || 0; - ovRset.selectedIndex(idx); - } - - angular.module('ovTopo') - .factory('TopoToolbarService', - ['$log', 'FnService', 'ToolbarService', 'PrefsService', - 'TopoOverlayService', 'TopoDialogService', - - function (_$log_, _fs_, _tbs_, _ps_, _tov_, _tds_) { - $log = _$log_; - fs = _fs_; - tbs = _tbs_; - ps = _ps_; - tov = _tov_; - tds = _tds_; - - return { - init: init, - createToolbar: createToolbar, - destroyToolbar: destroyToolbar, - keyListener: keyListener, - toggleToolbar: toggleToolbar, - setDefaultOverlay: setDefaultOverlay - }; - }]); -}());
\ No newline at end of file diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoTraffic.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoTraffic.js deleted file mode 100644 index ff690c49..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoTraffic.js +++ /dev/null @@ -1,229 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Topology Traffic Module. - Defines behavior for viewing different traffic modes. - */ - -(function () { - 'use strict'; - - // injected refs - var $log, fs, flash, wss, api; - - /* - API to topoForce - hovered() - somethingSelected() - selectOrder() - */ - - // internal state - var trafficMode = null, - hoverMode = null; - - - // === ----------------------------------------------------- - // Helper functions - - // invoked in response to change in selection and/or mouseover/out: - function requestTrafficForMode(mouse) { - if (trafficMode === 'flows') { - requestDeviceLinkFlows(); - } else if (trafficMode === 'intents') { - if (!mouse || hoverMode === 'intents') { - requestRelatedIntents(); - } - } else { - // do nothing - } - } - - function requestDeviceLinkFlows() { - // generates payload based on current hover-state - var hov = api.hovered(); - - function hoverValid() { - return hoverMode === 'flows' && - hov && (hov.class === 'device'); - } - - if (api.somethingSelected()) { - wss.sendEvent('requestDeviceLinkFlows', { - ids: api.selectOrder(), - hover: hoverValid() ? hov.id : '' - }); - } - } - - function requestRelatedIntents() { - // generates payload based on current hover-state - var hov = api.hovered(); - - function hoverValid() { - return hoverMode === 'intents' && - hov && (hov.class === 'host' || hov.class === 'device'); - } - - if (api.somethingSelected()) { - wss.sendEvent('requestRelatedIntents', { - ids: api.selectOrder(), - hover: hoverValid() ? hov.id : '' - }); - } - } - - - // === ------------------------------------------------------------- - // Traffic requests invoked from keystrokes or toolbar buttons... - - function cancelTraffic(forced) { - if (!trafficMode || (!forced && trafficMode === 'allFlowPort')) { - return false; - } - - trafficMode = hoverMode = null; - wss.sendEvent('cancelTraffic'); - flash.flash('Traffic monitoring canceled'); - return true; - } - - function showAllFlowTraffic() { - trafficMode = 'allFlowPort'; - hoverMode = null; - wss.sendEvent('requestAllFlowTraffic'); - flash.flash('All Flow Traffic'); - } - - function showAllPortTraffic() { - trafficMode = 'allFlowPort'; - hoverMode = null; - wss.sendEvent('requestAllPortTraffic'); - flash.flash('All Port Traffic'); - } - - function showDeviceLinkFlows () { - trafficMode = hoverMode = 'flows'; - requestDeviceLinkFlows(); - flash.flash('Device Flows'); - } - - function showRelatedIntents () { - trafficMode = hoverMode = 'intents'; - requestRelatedIntents(); - flash.flash('Related Paths'); - } - - function showPrevIntent() { - if (trafficMode === 'intents') { - hoverMode = null; - wss.sendEvent('requestPrevRelatedIntent'); - flash.flash('Previous related intent'); - } - } - - function showNextIntent() { - if (trafficMode === 'intents') { - hoverMode = null; - wss.sendEvent('requestNextRelatedIntent'); - flash.flash('Next related intent'); - } - } - - function showSelectedIntentTraffic() { - if (trafficMode === 'intents') { - hoverMode = null; - wss.sendEvent('requestSelectedIntentTraffic'); - flash.flash('Traffic on Selected Path'); - } - } - - // force the system to create a single intent selection - function selectIntent(data) { - trafficMode = 'intents'; - hoverMode = null; - wss.sendEvent('selectIntent', data); - flash.flash('Selecting Intent ' + data.key); - } - - - // === ------------------------------------------------------ - // action buttons on detail panel (multiple selection) - - function addHostIntent () { - var so = api.selectOrder(); - wss.sendEvent('addHostIntent', { - one: so[0], - two: so[1], - ids: so - }); - trafficMode = 'intents'; - hoverMode = null; - flash.flash('Host-to-Host flow added'); - } - - function addMultiSourceIntent () { - var so = api.selectOrder(); - wss.sendEvent('addMultiSourceIntent', { - src: so.slice(0, so.length - 1), - dst: so[so.length - 1], - ids: so - }); - trafficMode = 'intents'; - hoverMode = null; - flash.flash('Multi-Source flow added'); - } - - - // === ----------------------------------------------------- - // === MODULE DEFINITION === - - angular.module('ovTopo') - .factory('TopoTrafficService', - ['$log', 'FnService', 'FlashService', 'WebSocketService', - - function (_$log_, _fs_, _flash_, _wss_) { - $log = _$log_; - fs = _fs_; - flash = _flash_; - wss = _wss_; - - return { - initTraffic: function (_api_) { api = _api_; }, - destroyTraffic: function () { }, - - // invoked from toolbar overlay buttons or keystrokes - cancelTraffic: cancelTraffic, - showAllFlowTraffic: showAllFlowTraffic, - showAllPortTraffic: showAllPortTraffic, - showDeviceLinkFlows: showDeviceLinkFlows, - showRelatedIntents: showRelatedIntents, - showPrevIntent: showPrevIntent, - showNextIntent: showNextIntent, - showSelectedIntentTraffic: showSelectedIntentTraffic, - selectIntent: selectIntent, - - // invoked from mouseover/mouseout and selection change - requestTrafficForMode: requestTrafficForMode, - - // TODO: these should move to new UI demo app - // invoked from buttons on detail (multi-select) panel - addHostIntent: addHostIntent, - addMultiSourceIntent: addMultiSourceIntent - }; - }]); -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoTrafficNew.js b/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoTrafficNew.js deleted file mode 100644 index cb4bc49a..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/topo/topoTrafficNew.js +++ /dev/null @@ -1,159 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * - */ - -/* - ONOS GUI -- Topology Traffic Overlay Module. - Defines behavior for viewing different traffic modes. - Installed as a Topology Overlay. - */ -(function () { - 'use strict'; - - // injected refs - var $log, tov, tts; - - // NOTE: no internal state here -- see TopoTrafficService for that - - // NOTE: providing button disabling requires too big a refactoring of - // the button factory etc. Will have to be done another time. - - - // traffic overlay definition - var overlay = { - overlayId: 'traffic', - glyphId: 'allTraffic', - tooltip: 'Traffic Overlay', - - // NOTE: Traffic glyphs already installed as part of the base ONOS set. - - activate: function () { - $log.debug("Traffic overlay ACTIVATED"); - }, - - deactivate: function () { - tts.cancelTraffic(true); - $log.debug("Traffic overlay DEACTIVATED"); - }, - - // detail panel button definitions - // (keys match button identifiers, also defined in TrafficOverlay.java) - buttons: { - showDeviceFlows: { - gid: 'flows', - tt: 'Show Device Flows', - cb: function (data) { tts.showDeviceLinkFlows(); } - }, - - showRelatedTraffic: { - gid: 'relatedIntents', - tt: 'Show Related Traffic', - cb: function (data) { tts.showRelatedIntents(); } - } - }, - - // key bindings for traffic overlay toolbar buttons - // NOTE: fully qual. button ID is derived from overlay-id and key-name - keyBindings: { - 0: { - cb: function () { tts.cancelTraffic(true); }, - tt: 'Cancel traffic monitoring', - gid: 'xMark' - }, - - A: { - cb: function () { tts.showAllFlowTraffic(); }, - tt: 'Monitor all traffic using flow stats', - gid: 'allTraffic' - }, - Q: { - cb: function () { tts.showAllPortTraffic(); }, - tt: 'Monitor all traffic using port stats', - gid: 'allTraffic' - }, - F: { - cb: function () { tts.showDeviceLinkFlows(); }, - tt: 'Show device link flows', - gid: 'flows' - }, - V: { - cb: function () { tts.showRelatedIntents(); }, - tt: 'Show all related intents', - gid: 'relatedIntents' - }, - leftArrow: { - cb: function () { tts.showPrevIntent(); }, - tt: 'Show previous related intent', - gid: 'prevIntent' - }, - rightArrow: { - cb: function () { tts.showNextIntent(); }, - tt: 'Show next related intent', - gid: 'nextIntent' - }, - W: { - cb: function () { tts.showSelectedIntentTraffic(); }, - tt: 'Monitor traffic of selected intent', - gid: 'intentTraffic' - }, - - _keyOrder: [ - '0', 'A', 'Q', 'F', 'V', 'leftArrow', 'rightArrow', 'W' - ] - }, - - hooks: { - // hook for handling escape key - escape: function () { - // Must return true to consume ESC, false otherwise. - return tts.cancelTraffic(true); - }, - - // hooks for when the selection changes... - empty: function () { - tts.cancelTraffic(); - }, - single: function (data) { - tts.requestTrafficForMode(); - }, - multi: function (selectOrder) { - tts.requestTrafficForMode(); - tov.addDetailButton('showRelatedTraffic'); - }, - - // mouse hooks - mouseover: function (m) { - // m has id, class, and type properties - tts.requestTrafficForMode(true); - }, - mouseout: function () { - tts.requestTrafficForMode(true); - } - } - }; - - // invoke code to register with the overlay service - angular.module('ovTopo') - .run(['$log', 'TopoOverlayService', 'TopoTrafficService', - - function (_$log_, _tov_, _tts_) { - $log = _$log_; - tov = _tov_; - tts = _tts_; - tov.register(overlay); - }]); - -}()); diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/tunnel/tunnel.css b/framework/src/onos/web/gui/src/main/webapp/app/view/tunnel/tunnel.css deleted file mode 100644 index da7d06da..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/tunnel/tunnel.css +++ /dev/null @@ -1,27 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Link View -- CSS file - */ - -#ov-tunnel h2 { - display: inline-block; -} - -#ov-tunnel div.ctrl-btns { - width: 45px; -}
\ No newline at end of file diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/tunnel/tunnel.html b/framework/src/onos/web/gui/src/main/webapp/app/view/tunnel/tunnel.html deleted file mode 100644 index 4909cc0e..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/tunnel/tunnel.html +++ /dev/null @@ -1,72 +0,0 @@ -<!-- - ~ Copyright 2015 Open Networking Laboratory - ~ - ~ Licensed under the Apache License, Version 2.0 (the "License"); - ~ you may not use this file except in compliance with the License. - ~ You may obtain a copy of the License at - ~ - ~ http://www.apache.org/licenses/LICENSE-2.0 - ~ - ~ Unless required by applicable law or agreed to in writing, software - ~ distributed under the License is distributed on an "AS IS" BASIS, - ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - ~ See the License for the specific language governing permissions and - ~ limitations under the License. - --> - -<!-- Tunnel partial HTML --> -<div id="ov-tunnel"> - <div class="tabular-header"> - <h2>Tunnels ({{tableData.length}} total)</h2> - <div class="ctrl-btns"> - <div class="refresh" ng-class="{active: autoRefresh}" - icon icon-size="36" icon-id="refresh" - tooltip tt-msg="autoRefreshTip" - ng-click="toggleRefresh()"></div> - </div> - </div> - - <div class="summary-list" onos-table-resize> - <div ng-show="loading" class="loading-wheel" - icon icon-id="loading" icon-size="75"></div> - - <div class="table-header" onos-sortable-header> - <table> - <tr> - <td colId="id" sortable>ID </td> - <td colId="name" sortable>Name</td> - <td colId="one" sortable>Port 1 </td> - <td colId="two" sortable>Port 2 </td> - <td colId="type" sortable>Type </td> - <td colId="group_id" sortable>Group Id</td> - <td colId="bandwidth" sortable>Bandwidth</td> - <td colId="path" sortable>Path</td> - </tr> - </table> - </div> - - <div class="table-body"> - <table onos-flash-changes id-prop="one"> - <tr ng-if="!tableData.length" class="no-data"> - <td colspan="6"> - No tunnels found - </td> - </tr> - - <tr ng-repeat="tunnel in tableData track by $index" - ng-repeat-complete row-id="{{tunnel.id}}"> - <td>{{tunnel.id}}</td> - <td>{{tunnel.name}}</td> - <td>{{tunnel.one}}</td> - <td>{{tunnel.two}}</td> - <td>{{tunnel.type}}</td> - <td>{{tunnel.group_id}}</td> - <td>{{tunnel.bandwidth}}</td> - <td>{{tunnel.path}}</td> - </tr> - </table> - </div> - - </div> - -</div> diff --git a/framework/src/onos/web/gui/src/main/webapp/app/view/tunnel/tunnel.js b/framework/src/onos/web/gui/src/main/webapp/app/view/tunnel/tunnel.js deleted file mode 100644 index 5cde0457..00000000 --- a/framework/src/onos/web/gui/src/main/webapp/app/view/tunnel/tunnel.js +++ /dev/null @@ -1,44 +0,0 @@ -/* - * Copyright 2015 Open Networking Laboratory - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ - -/* - ONOS GUI -- Host View Module - */ - -(function () { - 'use strict'; - - angular.module('ovTunnel', []) - .controller('OvTunnelCtrl', - ['$log', '$scope', '$sce', 'FnService', 'TableBuilderService', - - function ($log, $scope, $sce, fs, tbs) { - tbs.buildTable({ - scope: $scope, - tag: 'tunnel' - }); - - $scope.$watch('tableData', function () { - if (!fs.isEmptyObject($scope.tableData)) { - $scope.tableData.forEach(function (tunnel) { - //tunnel.direction = $sce.trustAsHtml(tunnel.direction); - }); - } - }); - - $log.log('OvTunnelCtrl has been created'); - }]); -}()); |