commit 0616e80e01c472c7cd8e91968d7527b7d1b7c942
author Steven Burrows <sburrows@villa-technologies.com> Thu Oct 06 21:45:07 2016 -0500
committer Gerrit Code Review <gerrit@onlab.us> Tue Oct 11 21:30:29 2016 +0000
tree 1f9c4126b6f42432d7c3af5cc3f4e4dc19064a3e
parent 5ece00f435a74377cb145cdd536332610cff2e46

Topo2: Scale links when zooming in and out
Topo2: Limit icon scaling

Change-Id: I9b203183ebfe25ae9993a9ee8813608969867849

web/gui/src/main/webapp/app/view/topo2/topo2NodeModel.js

diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2NodeModel.js b/web/gui/src/main/webapp/app/view/topo2/topo2NodeModel.js
index 09e6ef0..109a694 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2NodeModel.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2NodeModel.js
@@ -29,6 +29,8 @@
     var nearDist = 15;
 
     var devIconDim = 36,
+        devIconDimMin = 20,
+        devIconDimMax = 40,
         labelPad = 5,
         textPad = 5,
         halfDevIcon = devIconDim / 2;
@@ -143,9 +145,9 @@
     .factory('Topo2NodeModel',
         ['Topo2Model', 'FnService', 'RandomService', 'Topo2PrefsService',
         'SvgUtilService', 'IconService', 'ThemeService',
-        'Topo2MapConfigService',
+        'Topo2MapConfigService', 'Topo2ZoomService',
         function (Model, _fn_, _RandomService_, _ps_, _sus_, _is_, _ts_,
-            _t2mcs_) {
+            _t2mcs_, zoomService) {
 
             randomService = _RandomService_;
             ts = _ts_;
@@ -268,6 +270,20 @@
                     this.el = d3.select(el);
                     this.render();
                 },
+                setScale: function () {
+
+                    var dim = devIconDim,
+                        multipler = 1;
+
+                    if (dim * zoomService.scale() < devIconDimMin) {
+                        multipler = devIconDimMin / (dim * zoomService.scale());
+                    } else if (dim * zoomService.scale() > devIconDimMax) {
+                        multipler = devIconDimMax / (dim * zoomService.scale());
+                    }
+
+
+                    this.el.selectAll('*').style('transform', 'scale(' + multipler + ')');
+                },
                 render: function () {
                     var node = this.el,
                         glyphId = this.icon(this.get('type')),
@@ -289,6 +305,8 @@
                     if (this.events) {
                         this.setUpEvents();
                     }
+
+                    this.setScale();
                 }
             });
         }]