FOR DEMO PURPOSES: Zoom and pan to regions when navigating
Change-Id: I3fa5f3900059d9cdf94929af669a79a1e25c3a90
diff --git a/web/gui/src/main/webapp/app/fw/svg/zoom.js b/web/gui/src/main/webapp/app/fw/svg/zoom.js
index 587c78d..cebe8c7 100644
--- a/web/gui/src/main/webapp/app/fw/svg/zoom.js
+++ b/web/gui/src/main/webapp/app/fw/svg/zoom.js
@@ -91,16 +91,21 @@
}
}
- function adjustZoomLayer(translate, scale) {
- settings.zoomLayer.attr('transform',
- 'translate(' + translate + ')scale(' + scale + ')');
+ function adjustZoomLayer(translate, scale, transition) {
+
+ settings.zoomLayer.transition()
+ .duration(transition || 0)
+ .attr("transform",
+ 'translate(' + translate + ')scale(' + scale + ')');
+
settings.zoomCallback(translate, scale);
}
zoomer = {
- panZoom: function (translate, scale) {
+ panZoom: function (translate, scale, transition) {
+
zoom.translate(translate).scale(scale);
- adjustZoomLayer(translate, scale);
+ adjustZoomLayer(translate, scale, transition);
},
reset: function () {
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2.js b/web/gui/src/main/webapp/app/view/topo2/topo2.js
index 48f06d0..79762cb 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2.js
@@ -199,7 +199,6 @@
t2fs.init(svg, forceG, uplink, dim);
t2bcs.init();
t2kcs.init(t2fs);
-
t2is.initInst({ showMastership: t2fs.showMastership });
// === ORIGINAL CODE ===
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2Region.js b/web/gui/src/main/webapp/app/view/topo2/topo2Region.js
index c3acff9..29a7e68 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2Region.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2Region.js
@@ -23,7 +23,7 @@
'use strict';
// Injected Services
- var $log, t2sr, t2ds, t2hs, t2ls;
+ var $log, t2sr, t2ds, t2hs, t2ls, t2zs;
var Model;
// Internal
@@ -54,6 +54,33 @@
link.createLink();
});
+ console.log(region.get('id'));
+
+ // TEMP Map Zoom
+ var regionPanZooms = {
+ "(root)": {
+ scale: 0.8,
+ translate: [-384.5881010374517, -512.2527728775849]
+ },
+ rBrg: {
+ scale: 2.75,
+ translate: [-2929.288248714413, -3498.849169115524]
+ },
+ rLon: {
+ scale: 2.75,
+ translate: [-2873.682762707102, -3320.483337006704]
+ },
+ rTha: {
+ scale: 7.5,
+ translate: [-8751.376289753565, -9950.962850877779]
+ }
+ };
+
+ setTimeout(function () {
+ var reigionPZ = regionPanZooms[region.get('id')];
+ t2zs.panAndZoom(reigionPZ.translate, reigionPZ.scale);
+ }, 10);
+
$log.debug('Region: ', region);
}
@@ -94,9 +121,9 @@
.factory('Topo2RegionService',
['$log', 'Topo2Model',
'Topo2SubRegionService', 'Topo2DeviceService',
- 'Topo2HostService', 'Topo2LinkService',
+ 'Topo2HostService', 'Topo2LinkService', 'Topo2ZoomService',
- function (_$log_, _Model_, _t2sr_, _t2ds_, _t2hs_, _t2ls_) {
+ function (_$log_, _Model_, _t2sr_, _t2ds_, _t2hs_, _t2ls_, _t2zs_) {
$log = _$log_;
Model = _Model_;
@@ -104,6 +131,7 @@
t2ds = _t2ds_;
t2hs = _t2hs_;
t2ls = _t2ls_;
+ t2zs = _t2zs_;
return {
init: init,
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2Zoom.js b/web/gui/src/main/webapp/app/view/topo2/topo2Zoom.js
index 772699a..89e7428 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2Zoom.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2Zoom.js
@@ -24,8 +24,9 @@
'use strict';
var zs, ps;
- var zoomer;
- var zoomEventListeners = [];
+
+ var zoomer,
+ zoomEventListeners = [];
function createZoomer(options) {
var settings = angular.extend({}, options, {
@@ -72,6 +73,10 @@
return zoomer.scale();
}
+ function panAndZoom(translate, scale) {
+ zoomer.panZoom(translate, scale, 1000);
+ }
+
angular.module('ovTopo2')
.factory('Topo2ZoomService',
['ZoomService', 'PrefsService',
@@ -85,7 +90,8 @@
addZoomEventListener: addZoomEventListener,
removeZoomEventListener: removeZoomEventListener,
- scale: scale
+ scale: scale,
+ panAndZoom: panAndZoom
};
}]);
})();