FOR DEMO PURPOSES: Zoom and pan to regions when navigating

Change-Id: I3fa5f3900059d9cdf94929af669a79a1e25c3a90

web/gui/src/main/webapp/app/fw/svg/zoom.js

@@ -91,16 +91,21 @@
                     }
                 }
 
-                function adjustZoomLayer(translate, scale) {
+                function adjustZoomLayer(translate, scale, transition) {
-                    settings.zoomLayer.attr('transform',
+
-                        'translate(' + translate + ')scale(' + scale + ')');
+                    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 () {

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 ===

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,

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
             };
         }]);
 })();