refactoring van de cmap structuren bijna compleet

2026-09-03 16:21:21 +02:00
parent 1abc84489f
commit bd1ef6bed0
75 changed files with 2547 additions and 1967 deletions
@@ -0,0 +1,87 @@
+"use strict";
+
+/** Own map-context layouts and apply them to the rendered editor records. */
+export class CmapLayoutController {
+  constructor(editor) {
+    this.editor = editor;
+  }
+
+  itemLayout(record) {
+    return {
+      x: Number(record.node.attr("x")),
+      y: Number(record.node.attr("y")),
+      width: Number(record.node.attr("width")),
+      height: Number(record.node.attr("height")),
+      backgroundColor: record.backgroundColor,
+      borderColor: record.borderColor,
+      textColor: record.textColor,
+      fontFamily: record.fontFamily,
+      fontSize: record.fontSize,
+      fontWeight: record.fontWeight,
+      fontStyle: record.fontStyle,
+      synopsisTextColor: record.synopsisTextColor,
+      synopsisFontFamily: record.synopsisFontFamily,
+      synopsisFontSize: record.synopsisFontSize,
+      synopsisFontWeight: record.synopsisFontWeight,
+      synopsisFontStyle: record.synopsisFontStyle
+    };
+  }
+
+  saveCurrentContextLayout() {
+    const context = this.editor.mapContextKey();
+    for (const record of this.editor.items.filter((item) => this.editor.isEffectiveItemVisible(item))) {
+      record.layouts[context] = this.itemLayout(record);
+    }
+  }
+
+  applyCurrentContextLayout() {
+    const context = this.editor.mapContextKey();
+    const visible = this.editor.items.filter((record) => this.editor.isEffectiveItemVisible(record));
+    let offset = { x: 0, y: 0 };
+    if (this.editor.activeMapRoot && !this.editor.activeMapRoot.layouts[context]) {
+      const rootLayout = this.itemLayout(this.editor.activeMapRoot);
+      offset = { x: 80 - rootLayout.x, y: 80 - rootLayout.y };
+    }
+
+    for (const record of visible) {
+      if (!record.layouts[context]) {
+        const current = this.itemLayout(record);
+        record.layouts[context] = { ...current, x: current.x + offset.x, y: current.y + offset.y };
+      }
+      const layout = record.layouts[context];
+      record.width = layout.width;
+      record.height = layout.height;
+      record.backgroundColor = layout.backgroundColor || record.backgroundColor;
+      record.borderColor = layout.borderColor || record.borderColor;
+      record.textColor = layout.textColor || record.textColor;
+      record.fontFamily = layout.fontFamily || record.fontFamily;
+      record.fontSize = layout.fontSize || record.fontSize;
+      record.fontWeight = layout.fontWeight || record.fontWeight;
+      record.fontStyle = layout.fontStyle || record.fontStyle;
+      record.synopsisTextColor = layout.synopsisTextColor || layout.textColor || record.synopsisTextColor;
+      record.synopsisFontFamily = layout.synopsisFontFamily || layout.fontFamily || record.synopsisFontFamily;
+      record.synopsisFontSize = layout.synopsisFontSize || record.synopsisFontSize;
+      record.synopsisFontWeight = layout.synopsisFontWeight || layout.fontWeight || record.synopsisFontWeight;
+      record.synopsisFontStyle = layout.synopsisFontStyle || layout.fontStyle || record.synopsisFontStyle;
+      record.node.attr({
+        x: layout.x,
+        y: layout.y,
+        width: layout.width,
+        height: layout.height,
+        content: this.editor.itemHtml(record),
+        backgroundColor: record.backgroundColor,
+        borderColor: record.borderColor,
+        textColor: record.textColor
+      });
+      record.node.redraw();
+    }
+    this.editor.refreshSubmapVisibility();
+    this.editor.refreshConnectorGeometry();
+    window.requestAnimationFrame(() => {
+      if (!this.editor.destroyed && this.editor.canvas.isConnected) {
+        this.editor.refreshSubmapVisibility();
+        this.editor.refreshConnectorGeometry();
+      }
+    });
+  }
+}