Canvas size detector

src/app/cartography/cartography.module.ts

@@ -15,6 +15,7 @@ import { LayersManager } from './managers/layers-manager';
 import { MapChangeDetectorRef } from './services/map-change-detector-ref';
 import { Context } from './models/context';
 import { D3_MAP_IMPORTS } from './d3-map.imports';
+import { CanvasSizeDetector } from './helpers/canvas-size-detector';
 
 
 @NgModule({
@@ -36,6 +37,7 @@ import { D3_MAP_IMPORTS } from './d3-map.imports';
     QtDasharrayFixer,
     LayersManager,
     MapChangeDetectorRef,
+    CanvasSizeDetector,
     Context,
     ...D3_MAP_IMPORTS
   ],

src/app/cartography/components/map/map.component.ts

@@ -19,6 +19,7 @@ import { LinksWidget } from '../../widgets/links';
 import { MapChangeDetectorRef } from '../../services/map-change-detector-ref';
 import { NodeDragging, NodeDragged } from '../../events/nodes';
 import { LinkCreated } from '../../events/links';
+import { CanvasSizeDetector } from '../../helpers/canvas-size-detector';
 
 
 @Component({
@@ -51,6 +52,7 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
   constructor(
     private context: Context,
     private mapChangeDetectorRef: MapChangeDetectorRef,
+    private canvasSizeDetector: CanvasSizeDetector,
     protected element: ElementRef,
     protected nodesWidget: NodesWidget,
     protected linksWidget: LinksWidget,
@@ -121,7 +123,7 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
     this.context.size = this.getSize();
 
     this.onNodeDraggingSubscription = this.nodesWidget.onNodeDragging.subscribe((eventNode: NodeDragging) => {
-      const links = this.links.filter((link) => link.target.node_id === eventNode.node.node_id || link.source.node_id === eventNode.node.node_id)
+      const links = this.links.filter((link) => link.target.node_id === eventNode.node.node_id || link.source.node_id === eventNode.node.node_id);
 
       links.forEach((link) => {
         this.linksWidget.redrawLink(this.svg, link);
@@ -144,15 +146,7 @@ export class MapComponent implements OnInit, OnChanges, OnDestroy {
   }
 
   public getSize(): Size {
-    let width = document.documentElement.clientWidth;
+    return this.canvasSizeDetector.getOptimalSize(this.width, this.height);
-    let height = document.documentElement.clientHeight;
-    if (this.width > width) {
-      width = this.width;
-    }
-    if (this.height > height) {
-      height = this.height;
-    }
-    return new Size(width, height);
   }
 
   protected linkCreated(evt) {

src/app/cartography/helpers/canvas-size-detector.ts

@@ -0,0 +1,18 @@
+import { Injectable } from "@angular/core";
+import { Size } from "../models/size";
+
+
+@Injectable()
+export class CanvasSizeDetector {
+    public getOptimalSize(minWidth: number, minHeight: number) {
+        let width = document.documentElement.clientWidth;
+        let height = document.documentElement.clientHeight;
+        if (minWidth > width) {
+          width = minWidth;
+        }
+        if (minHeight > height) {
+          height = minHeight;
+        }
+        return new Size(width, height);
+    }
+}