From 13d05bc8458758ee39cb829098241e89616717ee Mon Sep 17 00:00:00 2001 From: Ashlee Young Date: Wed, 9 Sep 2015 22:15:21 -0700 Subject: ONOS checkin based on commit tag e796610b1f721d02f9b0e213cf6f7790c10ecd60 Change-Id: Ife8810491034fe7becdba75dda20de4267bd15cd --- .../web/gui/src/main/webapp/app/fw/svg/zoom.js | 132 +++++++++++++++++++++ 1 file changed, 132 insertions(+) create mode 100644 framework/src/onos/web/gui/src/main/webapp/app/fw/svg/zoom.js (limited to 'framework/src/onos/web/gui/src/main/webapp/app/fw/svg/zoom.js') 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 new file mode 100644 index 00000000..6acab794 --- /dev/null +++ b/framework/src/onos/web/gui/src/main/webapp/app/fw/svg/zoom.js @@ -0,0 +1,132 @@ +/* + * 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 element + zoomLayer: zoomLayer, D3 selection of element + zoomEnabled: function (ev) { ... }, + zoomCallback: function () { ... } + } + + where: + * svg and zoomLayer should be D3 selections of DOM elements. + * zoomLayer is a child of 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 + }; + }]); + +}()); -- cgit 1.2.3-korg