"use strict";

var _tslib = require("tslib");
var _util = require("@antv/util");
var _g6Core = require("@antv/g6-core");
(0, _g6Core.registerNode)('modelRect', {
  // 自定义节点时的配置
  options: {
    size: [185, 70],
    style: {
      radius: 5,
      stroke: '#69c0ff',
      fill: '#ffffff',
      lineWidth: _g6Core.BaseGlobal.defaultNode.style.lineWidth,
      fillOpacity: 1
    },
    // 文本样式配置
    labelCfg: {
      style: {
        fill: '#595959',
        fontSize: 14,
        fontFamily: _g6Core.BaseGlobal.windowFontFamily
      },
      offset: 30 // 距离左侧的 offset，没有设置 y 轴上移动的配置
    },
    descriptionCfg: {
      style: {
        fontSize: 12,
        fill: '#bfbfbf',
        fontFamily: _g6Core.BaseGlobal.windowFontFamily
      },
      paddingTop: 0
    },
    preRect: {
      show: true,
      width: 4,
      fill: '#40a9ff',
      radius: 2
    },
    // 节点上左右上下四个方向上的链接circle配置
    linkPoints: {
      top: false,
      right: false,
      bottom: false,
      left: false,
      // circle的大小
      size: 10,
      lineWidth: 1,
      fill: '#72CC4A',
      stroke: '#72CC4A'
    },
    // 节点中icon配置
    logoIcon: {
      // 是否显示icon，值为 false 则不渲染icon
      show: true,
      x: 0,
      y: 0,
      // icon的地址，字符串类型
      img: 'https://gw.alipayobjects.com/zos/basement_prod/4f81893c-1806-4de4-aff3-9a6b266bc8a2.svg',
      width: 16,
      height: 16,
      // 用于调整图标的左右位置
      offset: 0
    },
    // 节点中表示状态的icon配置
    stateIcon: {
      // 是否显示icon，值为 false 则不渲染icon
      show: true,
      x: 0,
      y: 0,
      // icon的地址，字符串类型
      img: 'https://gw.alipayobjects.com/zos/basement_prod/300a2523-67e0-4cbf-9d4a-67c077b40395.svg',
      width: 16,
      height: 16,
      // 用于调整图标的左右位置
      offset: -5
    },
    // 连接点，默认为左右
    // anchorPoints: [{ x: 0, y: 0.5 }, { x: 1, y: 0.5 }]
    anchorPoints: [[0, 0.5], [1, 0.5]]
  },
  shapeType: 'modelRect',
  drawShape: function drawShape(cfg, group) {
    var _a = (this.mergeStyle || this.getOptions(cfg)).preRect,
      preRect = _a === void 0 ? {} : _a;
    var style = this.getShapeStyle(cfg);
    var size = this.getSize(cfg);
    var width = size[0];
    var height = size[1];
    var keyShape = group.addShape('rect', {
      attrs: style,
      className: "".concat(this.type, "-keyShape"),
      name: "".concat(this.type, "-keyShape"),
      draggable: true
    });
    group['shapeMap']["".concat(this.type, "-keyShape")] = keyShape;
    var preRectShow = preRect.show,
      preRectStyle = (0, _tslib.__rest)(preRect, ["show"]);
    if (preRectShow) {
      group['shapeMap']['pre-rect'] = group.addShape('rect', {
        attrs: (0, _tslib.__assign)({
          x: -width / 2,
          y: -height / 2,
          height: height
        }, preRectStyle),
        className: 'pre-rect',
        name: 'pre-rect',
        draggable: true
      });
    }
    this.drawLogoIcon(cfg, group);
    this.drawStateIcon(cfg, group);
    this.drawLinkPoints(cfg, group);
    return keyShape;
  },
  /**
   * 绘制模型矩形左边的logo图标
   * @param {Object} cfg 数据配置项
   * @param {Group} group Group实例
   */
  drawLogoIcon: function drawLogoIcon(cfg, group) {
    var _a = (this.mergeStyle || this.getOptions(cfg)).logoIcon,
      logoIcon = _a === void 0 ? {} : _a;
    var size = this.getSize(cfg);
    var width = size[0];
    if (logoIcon.show) {
      var w = logoIcon.width,
        h = logoIcon.height,
        x = logoIcon.x,
        y = logoIcon.y,
        offset = logoIcon.offset,
        text = logoIcon.text,
        logoIconStyle = (0, _tslib.__rest)(logoIcon, ["width", "height", "x", "y", "offset", "text"]);
      if (text) {
        group['shapeMap']['rect-logo-icon'] = group.addShape('text', {
          attrs: (0, _tslib.__assign)({
            x: 0,
            y: 0,
            fontSize: 12,
            fill: '#000',
            stroke: '#000',
            textBaseline: 'middle',
            textAlign: 'center'
          }, logoIconStyle),
          className: 'rect-logo-icon',
          name: 'rect-logo-icon',
          draggable: true
        });
      } else {
        group['shapeMap']['rect-logo-icon'] = group.addShape('image', {
          attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, logoIconStyle), {
            x: x || -width / 2 + w + offset,
            y: y || -h / 2,
            width: w,
            height: h
          }),
          className: 'rect-logo-icon',
          name: 'rect-logo-icon',
          draggable: true
        });
      }
    }
  },
  /**
   * 绘制模型矩形右边的状态图标
   * @param {Object} cfg 数据配置项
   * @param {Group} group Group实例
   */
  drawStateIcon: function drawStateIcon(cfg, group) {
    var _a = (this.mergeStyle || this.getOptions(cfg)).stateIcon,
      stateIcon = _a === void 0 ? {} : _a;
    var size = this.getSize(cfg);
    var width = size[0];
    if (stateIcon.show) {
      var w = stateIcon.width,
        h = stateIcon.height,
        x = stateIcon.x,
        y = stateIcon.y,
        offset = stateIcon.offset,
        text = stateIcon.text,
        iconStyle = (0, _tslib.__rest)(stateIcon, ["width", "height", "x", "y", "offset", "text"]);
      if (text) {
        group['shapeMap']['rect-state-icon'] = group.addShape('text', {
          attrs: (0, _tslib.__assign)({
            x: 0,
            y: 0,
            fontSize: 12,
            fill: '#000',
            stroke: '#000',
            textBaseline: 'middle',
            textAlign: 'center'
          }, iconStyle),
          className: 'rect-state-icon',
          name: 'rect-state-icon',
          draggable: true
        });
      } else {
        group['shapeMap']['rect-state-icon'] = group.addShape('image', {
          attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, iconStyle), {
            x: x || width / 2 - w + offset,
            y: y || -h / 2,
            width: w,
            height: h
          }),
          className: 'rect-state-icon',
          name: 'rect-state-icon',
          draggable: true
        });
      }
    }
  },
  /**
   * 绘制节点上的LinkPoints
   * @param {Object} cfg data数据配置项
   * @param {Group} group Group实例
   */
  drawLinkPoints: function drawLinkPoints(cfg, group) {
    var _a = (this.mergeStyle || this.getOptions(cfg)).linkPoints,
      linkPoints = _a === void 0 ? {} : _a;
    var top = linkPoints.top,
      left = linkPoints.left,
      right = linkPoints.right,
      bottom = linkPoints.bottom,
      markSize = linkPoints.size,
      markR = linkPoints.r,
      markStyle = (0, _tslib.__rest)(linkPoints, ["top", "left", "right", "bottom", "size", "r"]);
    var size = this.getSize(cfg);
    var width = size[0];
    var height = size[1];
    if (left) {
      // left circle
      group['shapeMap']['link-point-left'] = group.addShape('circle', {
        attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, markStyle), {
          x: -width / 2,
          y: 0,
          r: markSize / 2 || markR || 5
        }),
        className: 'link-point-left',
        name: 'link-point-left',
        isAnchorPoint: true
      });
    }
    if (right) {
      // right circle
      group['shapeMap']['link-point-right'] = group.addShape('circle', {
        attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, markStyle), {
          x: width / 2,
          y: 0,
          r: markSize / 2 || markR || 5
        }),
        className: 'link-point-right',
        name: 'link-point-right',
        isAnchorPoint: true
      });
    }
    if (top) {
      // top circle
      group['shapeMap']['link-point-top'] = group.addShape('circle', {
        attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, markStyle), {
          x: 0,
          y: -height / 2,
          r: markSize / 2 || markR || 5
        }),
        className: 'link-point-top',
        name: 'link-point-top',
        isAnchorPoint: true
      });
    }
    if (bottom) {
      // bottom circle
      group['shapeMap']['link-point-bottom'] = group.addShape('circle', {
        attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, markStyle), {
          x: 0,
          y: height / 2,
          r: markSize / 2 || markR || 5
        }),
        className: 'link-point-bottom',
        name: 'link-point-bottom',
        isAnchorPoint: true
      });
    }
  },
  drawLabel: function drawLabel(cfg, group) {
    var _a = this.getOptions(cfg),
      _b = _a.labelCfg,
      labelCfg = _b === void 0 ? {} : _b,
      _c = _a.logoIcon,
      logoIcon = _c === void 0 ? {} : _c,
      _d = _a.descriptionCfg,
      descriptionCfg = _d === void 0 ? {} : _d;
    var size = this.getSize(cfg);
    var width = size[0];
    var label = null;
    var show = logoIcon.show,
      w = logoIcon.width;
    var offsetX = -width / 2 + labelCfg.offset;
    if (show) {
      offsetX = -width / 2 + w + labelCfg.offset;
    }
    var fontStyle = labelCfg.style;
    var descriptionStyle = descriptionCfg.style,
      descriptionPaddingTop = descriptionCfg.paddingTop;
    if ((0, _util.isString)(cfg.description)) {
      label = group.addShape('text', {
        attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, fontStyle), {
          x: offsetX,
          y: -5,
          text: cfg.label
        }),
        className: 'text-shape',
        name: 'text-shape',
        draggable: true,
        labelRelated: true
      });
      group['shapeMap']['text-shape'] = label;
      group['shapeMap']['rect-description'] = group.addShape('text', {
        attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, descriptionStyle), {
          x: offsetX,
          y: 17 + (descriptionPaddingTop || 0),
          text: cfg.description
        }),
        className: 'rect-description',
        name: 'rect-description',
        draggable: true,
        labelRelated: true
      });
    } else {
      label = group.addShape('text', {
        attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, fontStyle), {
          x: offsetX,
          y: 7,
          text: cfg.label
        }),
        className: 'text-shape',
        name: 'text-shape',
        draggable: true,
        labelRelated: true
      });
      group['shapeMap']['text-shape'] = label;
    }
    return label;
  },
  /**
   * 获取节点的样式，供基于该节点自定义时使用
   * @param {Object} cfg 节点数据模型
   * @return {Object} 节点的样式
   */
  getShapeStyle: function getShapeStyle(cfg) {
    var defaultStyle = (this.mergeStyle || this.getOptions(cfg)).style;
    var strokeStyle = {
      stroke: cfg.color
    };
    // 如果设置了color，则覆盖默认的stroke属性
    var style = (0, _util.mix)({}, defaultStyle, strokeStyle);
    var size = this.getSize(cfg);
    var width = style.width || size[0];
    var height = style.height || size[1];
    var styles = (0, _tslib.__assign)({
      x: -width / 2,
      y: -height / 2,
      width: width,
      height: height
    }, style);
    return styles;
  },
  update: function update(cfg, item) {
    var _a = this.mergeStyle || this.getOptions(cfg),
      _b = _a.style,
      style = _b === void 0 ? {} : _b,
      _c = _a.labelCfg,
      labelCfg = _c === void 0 ? {} : _c,
      _d = _a.descriptionCfg,
      descriptionCfg = _d === void 0 ? {} : _d;
    var size = this.getSize(cfg);
    var width = size[0];
    var height = size[1];
    var keyShape = item.get('keyShape');
    keyShape.attr((0, _tslib.__assign)((0, _tslib.__assign)({}, style), {
      x: -width / 2,
      y: -height / 2,
      width: width,
      height: height
    }));
    var group = item.getContainer();
    var logoIconShape = group['shapeMap']['rect-logo-icon'] || group.find(function (element) {
      return element.get('className') === 'rect-logo-icon';
    });
    var currentLogoIconAttr = logoIconShape ? logoIconShape.attr() : {};
    var logoIcon = (0, _util.mix)({}, currentLogoIconAttr, cfg.logoIcon);
    var w = logoIcon.width;
    if (w === undefined) {
      w = this.options.logoIcon.width;
    }
    var show = cfg.logoIcon ? cfg.logoIcon.show : undefined;
    var offset = labelCfg.offset;
    var offsetX = -width / 2 + w + offset;
    if (!show && show !== undefined) {
      offsetX = -width / 2 + offset;
    }
    var label = group['shapeMap']['node-label'] || group.find(function (element) {
      return element.get('className') === 'node-label';
    });
    var description = group['shapeMap']['rect-description'] || group.find(function (element) {
      return element.get('className') === 'rect-description';
    });
    if (cfg.label) {
      if (!label) {
        group['shapeMap']['node-label'] = group.addShape('text', {
          attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, labelCfg.style), {
            x: offsetX,
            y: cfg.description ? -5 : 7,
            text: cfg.label
          }),
          className: 'node-label',
          name: 'node-label',
          draggable: true,
          labelRelated: true
        });
      } else {
        var cfgStyle = cfg.labelCfg ? cfg.labelCfg.style : {};
        var labelStyle = (0, _util.mix)({}, label.attr(), cfgStyle);
        if (cfg.label) labelStyle.text = cfg.label;
        labelStyle.x = offsetX;
        if ((0, _util.isString)(cfg.description)) labelStyle.y = -5;
        if (description) {
          description.resetMatrix();
          description.attr({
            x: offsetX
          });
        }
        label.resetMatrix();
        label.attr(labelStyle);
      }
    }
    if ((0, _util.isString)(cfg.description)) {
      var paddingTop = descriptionCfg.paddingTop;
      if (!description) {
        group['shapeMap']['rect-description'] = group.addShape('text', {
          attrs: (0, _tslib.__assign)((0, _tslib.__assign)({}, descriptionCfg.style), {
            x: offsetX,
            y: 17 + (paddingTop || 0),
            text: cfg.description
          }),
          className: 'rect-description',
          name: 'rect-description',
          draggable: true,
          labelRelated: true
        });
      } else {
        var cfgStyle = cfg.descriptionCfg ? cfg.descriptionCfg.style : {};
        var descriptionStyle = (0, _util.mix)({}, description.attr(), cfgStyle);
        if ((0, _util.isString)(cfg.description)) descriptionStyle.text = cfg.description;
        descriptionStyle.x = offsetX;
        description.resetMatrix();
        description.attr((0, _tslib.__assign)((0, _tslib.__assign)({}, descriptionStyle), {
          y: 17 + (paddingTop || 0)
        }));
      }
    }
    var preRectShape = group['shapeMap']['pre-rect'] || group.find(function (element) {
      return element.get('className') === 'pre-rect';
    });
    if (preRectShape && !preRectShape.destroyed) {
      var preRect = (0, _util.mix)({}, preRectShape.attr(), cfg.preRect);
      preRectShape.attr((0, _tslib.__assign)((0, _tslib.__assign)({}, preRect), {
        x: -width / 2,
        y: -height / 2,
        height: height
      }));
    }
    if (logoIconShape && !logoIconShape.destroyed) {
      if (!show && show !== undefined) {
        logoIconShape.remove();
        delete group['shapeMap']['pre-rect'];
      } else {
        var logoW = logoIcon.width,
          h = logoIcon.height,
          x = logoIcon.x,
          y = logoIcon.y,
          logoOffset = logoIcon.offset,
          logoIconStyle = (0, _tslib.__rest)(logoIcon, ["width", "height", "x", "y", "offset"]);
        logoIconShape.attr((0, _tslib.__assign)((0, _tslib.__assign)({}, logoIconStyle), {
          x: x || -width / 2 + logoW + logoOffset,
          y: y || -h / 2,
          width: logoW,
          height: h
        }));
      }
    } else if (show) {
      this.drawLogoIcon(cfg, group);
    }
    var stateIconShape = group['shapeMap']['rect-state-icon'] || group.find(function (element) {
      return element.get('className') === 'rect-state-icon';
    });
    var currentStateIconAttr = stateIconShape ? stateIconShape.attr() : {};
    var stateIcon = (0, _util.mix)({}, currentStateIconAttr, cfg.stateIcon);
    if (stateIconShape) {
      if (!stateIcon.show && stateIcon.show !== undefined) {
        stateIconShape.remove();
        delete group['shapeMap']['rect-state-icon'];
      }
      var stateW = stateIcon.width,
        h = stateIcon.height,
        x = stateIcon.x,
        y = stateIcon.y,
        stateOffset = stateIcon.offset,
        stateIconStyle = (0, _tslib.__rest)(stateIcon, ["width", "height", "x", "y", "offset"]);
      stateIconShape.attr((0, _tslib.__assign)((0, _tslib.__assign)({}, stateIconStyle), {
        x: x || width / 2 - stateW + stateOffset,
        y: y || -h / 2,
        width: stateW,
        height: h
      }));
    } else if (stateIcon.show) {
      this.drawStateIcon(cfg, group);
    }
    this.updateLinkPoints(cfg, group);
  },
  getOptions: function getOptions(cfg, updateType) {
    if (updateType === 'move') return cfg;
    // different from baseShape, the config should be mixed when the updateType is not 'move'
    return (0, _util.deepMix)({}, this.options, this.getCustomConfig(cfg) || {}, cfg);
  }
}, 'single-node');