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