"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const tslib_es6 = require("../../../node_modules/tslib/tslib.es6.js");
const states = require("../../util/states.js");
const Chart = require("../../view/Chart.js");
const labelGuideHelper = require("../../label/labelGuideHelper.js");
const labelStyle = require("../../label/labelStyle.js");
const basicTransition = require("../../animation/basicTransition.js");
const Polyline = require("../../../../../../zrender@5.4.4/node_modules/zrender/lib/graphic/shape/Polyline.js");
const Text = require("../../../../../../zrender@5.4.4/node_modules/zrender/lib/graphic/Text.js");
const Point = require("../../../../../../zrender@5.4.4/node_modules/zrender/lib/core/Point.js");
const Polygon = require("../../../../../../zrender@5.4.4/node_modules/zrender/lib/graphic/shape/Polygon.js");
var opacityAccessPath = ["itemStyle", "opacity"];
var FunnelPiece = (
  /** @class */
  function(_super) {
    tslib_es6.__extends(FunnelPiece2, _super);
    function FunnelPiece2(data, idx) {
      var _this = _super.call(this) || this;
      var polygon = _this;
      var labelLine = new Polyline.default();
      var text = new Text.default();
      polygon.setTextContent(text);
      _this.setTextGuideLine(labelLine);
      _this.updateData(data, idx, true);
      return _this;
    }
    FunnelPiece2.prototype.updateData = function(data, idx, firstCreate) {
      var polygon = this;
      var seriesModel = data.hostModel;
      var itemModel = data.getItemModel(idx);
      var layout = data.getItemLayout(idx);
      var emphasisModel = itemModel.getModel("emphasis");
      var opacity = itemModel.get(opacityAccessPath);
      opacity = opacity == null ? 1 : opacity;
      if (!firstCreate) {
        basicTransition.saveOldStyle(polygon);
      }
      polygon.useStyle(data.getItemVisual(idx, "style"));
      polygon.style.lineJoin = "round";
      if (firstCreate) {
        polygon.setShape({
          points: layout.points
        });
        polygon.style.opacity = 0;
        basicTransition.initProps(polygon, {
          style: {
            opacity
          }
        }, seriesModel, idx);
      } else {
        basicTransition.updateProps(polygon, {
          style: {
            opacity
          },
          shape: {
            points: layout.points
          }
        }, seriesModel, idx);
      }
      states.setStatesStylesFromModel(polygon, itemModel);
      this._updateLabel(data, idx);
      states.toggleHoverEmphasis(this, emphasisModel.get("focus"), emphasisModel.get("blurScope"), emphasisModel.get("disabled"));
    };
    FunnelPiece2.prototype._updateLabel = function(data, idx) {
      var polygon = this;
      var labelLine = this.getTextGuideLine();
      var labelText = polygon.getTextContent();
      var seriesModel = data.hostModel;
      var itemModel = data.getItemModel(idx);
      var layout = data.getItemLayout(idx);
      var labelLayout = layout.label;
      var style = data.getItemVisual(idx, "style");
      var visualColor = style.fill;
      labelStyle.setLabelStyle(
        // position will not be used in setLabelStyle
        labelText,
        labelStyle.getLabelStatesModels(itemModel),
        {
          labelFetcher: data.hostModel,
          labelDataIndex: idx,
          defaultOpacity: style.opacity,
          defaultText: data.getName(idx)
        },
        {
          normal: {
            align: labelLayout.textAlign,
            verticalAlign: labelLayout.verticalAlign
          }
        }
      );
      polygon.setTextConfig({
        local: true,
        inside: !!labelLayout.inside,
        insideStroke: visualColor,
        // insideFill: 'auto',
        outsideFill: visualColor
      });
      var linePoints = labelLayout.linePoints;
      labelLine.setShape({
        points: linePoints
      });
      polygon.textGuideLineConfig = {
        anchor: linePoints ? new Point.default(linePoints[0][0], linePoints[0][1]) : null
      };
      basicTransition.updateProps(labelText, {
        style: {
          x: labelLayout.x,
          y: labelLayout.y
        }
      }, seriesModel, idx);
      labelText.attr({
        rotation: labelLayout.rotation,
        originX: labelLayout.x,
        originY: labelLayout.y,
        z2: 10
      });
      labelGuideHelper.setLabelLineStyle(polygon, labelGuideHelper.getLabelLineStatesModels(itemModel), {
        // Default use item visual color
        stroke: visualColor
      });
    };
    return FunnelPiece2;
  }(Polygon.default)
);
var FunnelView = (
  /** @class */
  function(_super) {
    tslib_es6.__extends(FunnelView2, _super);
    function FunnelView2() {
      var _this = _super !== null && _super.apply(this, arguments) || this;
      _this.type = FunnelView2.type;
      _this.ignoreLabelLineUpdate = true;
      return _this;
    }
    FunnelView2.prototype.render = function(seriesModel, ecModel, api) {
      var data = seriesModel.getData();
      var oldData = this._data;
      var group = this.group;
      data.diff(oldData).add(function(idx) {
        var funnelPiece = new FunnelPiece(data, idx);
        data.setItemGraphicEl(idx, funnelPiece);
        group.add(funnelPiece);
      }).update(function(newIdx, oldIdx) {
        var piece = oldData.getItemGraphicEl(oldIdx);
        piece.updateData(data, newIdx);
        group.add(piece);
        data.setItemGraphicEl(newIdx, piece);
      }).remove(function(idx) {
        var piece = oldData.getItemGraphicEl(idx);
        basicTransition.removeElementWithFadeOut(piece, seriesModel, idx);
      }).execute();
      this._data = data;
    };
    FunnelView2.prototype.remove = function() {
      this.group.removeAll();
      this._data = null;
    };
    FunnelView2.prototype.dispose = function() {
    };
    FunnelView2.type = "funnel";
    return FunnelView2;
  }(Chart.default)
);
const FunnelView$1 = FunnelView;
exports.default = FunnelView$1;
