Read layout parameters from metadata in network area diagram viewer

src/components/network-area-diagram-viewer/diagram-utils.ts

@@ -484,3 +484,23 @@ export function getTextNodeMoves(
         { xOrig: connXOrig, yOrig: connYOrig, xNew: connXNew, yNew: connYNew },
     ];
 }
+
+// get number parameter from metadata element
+export function getNumberParameter(
+    parametersMetadataElement: SVGGraphicsElement | null,
+    parameterName: string,
+    parameterDefault: number
+): number {
+    const parameter = parametersMetadataElement?.getAttribute(parameterName);
+    return parameter !== undefined && parameter !== null ? +parameter : parameterDefault;
+}
+
+// get boolean parameter from metadata element
+export function getBooleanParameter(
+    parametersMetadataElement: SVGGraphicsElement | null,
+    parameterName: string,
+    parameterDefault: boolean
+): boolean {
+    const parameter = parametersMetadataElement?.getAttribute(parameterName);
+    return parameter !== undefined && parameter !== null ? parameter === 'true' : parameterDefault;
+}

src/components/network-area-diagram-viewer/layout-parameters.ts

@@ -0,0 +1,28 @@
+/**
+ * Copyright (c) 2024, RTE (http://www.rte-france.com)
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+import { getNumberParameter } from './diagram-utils';
+
+export class LayoutParameters {
+    static readonly TEXT_NODE_EDGE_CONNECTION_Y_SHIFT_PARAMETER_NAME = 'textnodeedgeconnectionyshift';
+
+    static readonly TEXT_NODE_EDGE_CONNECTION_Y_SHIFT_DEFAULT = 25.0;
+
+    textNodeEdgeConnectionYShift: number;
+
+    constructor(layoutParametersElement: SVGGraphicsElement | null) {
+        this.textNodeEdgeConnectionYShift = getNumberParameter(
+            layoutParametersElement,
+            LayoutParameters.TEXT_NODE_EDGE_CONNECTION_Y_SHIFT_PARAMETER_NAME,
+            LayoutParameters.TEXT_NODE_EDGE_CONNECTION_Y_SHIFT_DEFAULT
+        );
+    }
+
+    public getTextNodeEdgeConnectionYShift(): number {
+        return this.textNodeEdgeConnectionYShift;
+    }
+}

src/components/network-area-diagram-viewer/network-area-diagram-viewer.ts

@@ -9,6 +9,7 @@ import { Point, SVG, ViewBoxLike, Svg } from '@svgdotjs/svg.js';
 import '@svgdotjs/svg.panzoom.js';
 import * as DiagramUtils from './diagram-utils';
 import { SvgParameters } from './svg-parameters';
+import { LayoutParameters } from './layout-parameters';
 
 type DIMENSIONS = { width: number; height: number; viewbox: VIEWBOX };
 type VIEWBOX = { x: number; y: number; width: number; height: number };
@@ -52,6 +53,7 @@ export class NetworkAreaDiagramViewer {
     ctm: DOMMatrix | null | undefined = null;
     initialPosition: Point = new Point(0, 0);
     svgParameters: SvgParameters;
+    layoutParameters: LayoutParameters;
     edgeAngles: Map<string, number> = new Map<string, number>();
     textNodeSelected: boolean = false;
     endTextEdge: Point = new Point(0, 0);
@@ -80,6 +82,7 @@ export class NetworkAreaDiagramViewer {
         this.originalHeight = 0;
         this.init(minWidth, minHeight, maxWidth, maxHeight, enableNodeMoving);
         this.svgParameters = this.getSvgParameters();
+        this.layoutParameters = this.getLayoutParameters();
         this.onMoveNodeCallback = onMoveNodeCallback;
         this.onMoveTextNodeCallback = onMoveTextNodeCallback;
         this.onSelectNodeCallback = onSelectNodeCallback;
@@ -262,6 +265,12 @@ export class NetworkAreaDiagramViewer {
         return new SvgParameters(svgParametersElement);
     }
 
+    private getLayoutParameters(): LayoutParameters {
+        const layoutParametersElement: SVGGraphicsElement | null =
+            this.container.querySelector('nad\\:layoutparameters');
+        return new LayoutParameters(layoutParametersElement);
+    }
+
     private startDrag(event: Event) {
         const draggableElem = DiagramUtils.getDraggableFrom(event.target as SVGElement);
         if (!draggableElem) {
@@ -429,7 +438,7 @@ export class NetworkAreaDiagramViewer {
             this.endTextEdge = DiagramUtils.getTextEdgeEnd(
                 textNodePosition,
                 vlNodePosition,
-                this.svgParameters.getDetailedTextNodeYShift(),
+                this.layoutParameters.getTextNodeEdgeConnectionYShift(),
                 textHeight,
                 textWidth
             );