
/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements.  See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership.  The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License.  You may obtain a copy of the License at
*
*   http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied.  See the License for the
* specific language governing permissions and limitations
* under the License.
*/


/**
 * AUTO-GENERATED FILE. DO NOT MODIFY.
 */

/*
* Licensed to the Apache Software Foundation (ASF) under one
* or more contributor license agreements.  See the NOTICE file
* distributed with this work for additional information
* regarding copyright ownership.  The ASF licenses this file
* to you under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance
* with the License.  You may obtain a copy of the License at
*
*   http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied.  See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import { __assign, __extends } from "tslib";
import * as zrUtil from 'tvrender/lib/core/util.js';
import ChartView from '../../view/Chart.js';
import { createClipPath } from '../helper/createClipPathFromCoordSys.js';
import NormalBoxPath from '../candlePlot/NormalBoxPath.js';
import WickPath from '../candlePlot/WickPath.js';
import RectPath from './RectPath.js';
import LinePath from './LinePath.js';
import MarkPath from './MarkPath.js';
import { getECData } from '../../util/innerStore.js';
import * as graphic from '../../util/graphic.js';
import { toggleHoverEmphasis } from '../../util/states.js';
import { findFontSize } from "../boxes/util.js";
import { getWidth } from 'tvrender/lib/contain/text.js';
import { DefaultFamily } from '../../data/Constant.js';
// const SKIP_PROPS = ['color', 'borderColor'] as const;
var lightShadowColor = 'rgba(0,0,0,0.1)';
var darkShadowColor = 'rgba(255,255,255,0.1)';
var VolPathView = /** @class */function (_super) {
  __extends(VolPathView, _super);
  function VolPathView() {
    var _this = _super !== null && _super.apply(this, arguments) || this;
    _this.type = VolPathView.type;
    return _this;
  }
  VolPathView.prototype.render = function (seriesModel, ecModel, api) {
    // If there is clipPath created in large mode. Remove it.
    // this.group.removeClipPath();
    // Clear previously rendered progressive elements.
    this._progressiveEls = null;
    // this._updateDrawMode(seriesModel);
    this._renderNormal(seriesModel);
  };
  // eachRendered(cb: (el: Element) => boolean | void) {
  //     graphic.traverseElements(this._progressiveEls || this.group, cb);
  // }
  VolPathView.prototype._renderNormal = function (seriesModel) {
    var data = seriesModel.getData();
    // const oldData = this._data;
    var group = this.group;
    group.removeAll();
    var emphasisState = seriesModel.get('emphasis').emphasisState;
    var info = seriesModel.get('info');
    var groupId = seriesModel.get('groupId');
    // const emphasisStyle = emphasis.itemStyle || {};
    var isSimpleBox = data.getLayout('isSimpleBox');
    var bodyPointsByColor = data.getLayout('bodyPointsByColor');
    var wickPointsByColor = data.getLayout('wickPointsByColor');
    var isMobile = seriesModel.get('isMobile');
    zrUtil.each(wickPointsByColor, function (points, key) {
      var stroke = key.split(':')[0];
      var el = new WickPath({
        shape: {
          points: points,
          isMobile: isMobile,
          stroke: stroke !== 'none' ? stroke : ''
        },
        style: {
          stroke: stroke
        }
      });
      el.states.emphasis = emphasisState;
      el.info = info;
      group.add(el);
    });
    zrUtil.each(bodyPointsByColor, function (points, key) {
      var _a = key.split(':'),
        fill = _a[0],
        stroke = _a[1];
      var el = new NormalBoxPath({
        shape: {
          points: points,
          isSimpleBox: isSimpleBox,
          fill: fill !== 'none' ? fill : '',
          isMobile: isMobile,
          // stroke: !isSimpleBox || stroke === 'none' ? '' : stroke,
          stroke: stroke === 'none' ? '' : stroke
        },
        style: {
          fill: isSimpleBox ? 'none' : fill,
          // stroke: 'none',
          stroke: stroke
        }
      });
      group.add(el);
      el.states.emphasis = emphasisState;
      el.info = info;
    });
    this._renderRect(seriesModel);
    this._renderUnBlRect(seriesModel);
    this._renderVaLine(seriesModel);
    // const coordSys = seriesModel.coordinateSystem;
    var clipPath = seriesModel.get('clip', true) ? createClipPath(seriesModel.coordinateSystem, false, seriesModel) : null;
    if (clipPath) {
      this.group.setClipPath(clipPath);
    } else {
      this.group.removeClipPath();
    }
    toggleHoverEmphasis(this.group, null, null, false, false);
    getECData(this.group).groupId = groupId;
  };
  VolPathView.prototype._renderRect = function (seriesModel) {
    var data = seriesModel.getData();
    // const oldData = this._data;
    var group = this.group;
    var emphasisState = seriesModel.get('emphasis').emphasisState;
    var rectPointsByColor = data.getLayout('rectPointsByColor');
    var textPointsByColor = data.getLayout('textPointsByColor');
    var textRectWidth = data.getLayout('textRectWidth');
    var rectHeight = data.getLayout('rectHeight');
    var isBuyAndSellLadder = data.getLayout('isBuyAndSellLadder');
    var theme = seriesModel.get('theme');
    var isDark = theme === 'dark';
    var textFill = isDark ? "#fff" : "#000";
    var isOverview = data.getLayout('isOverview');
    var maxSumVol = data.getLayout('maxSumVol');
    rectPointsByColor.forEach(function (rectPoints, key) {
      var el = new RectPath({
        shape: {
          typeArray: rectPoints
        },
        style: {
          fill: key,
          stroke: 'none'
        }
      });
      group.add(el);
      el.states.emphasis = emphasisState;
    });
    var textWidth = !isBuyAndSellLadder ? textRectWidth * 2 : textRectWidth;
    var fontSize = findFontSize(getMaxFormatVol(maxSumVol), textWidth * 0.8, void 0, 2, rectHeight * 0.8, 50);
    var textOffset = Math.floor(textWidth * 0.1);
    var clipPathRectY = rectHeight / 2;
    textPointsByColor.forEach(function (textPoint, key) {
      var list = textPoint.buffer();
      var size = textPoint.length();
      for (var i = 0; i < size;) {
        var x = list[i++];
        var y = list[i++];
        var text = list[i++];
        var alignNum = list[i++];
        var align = 'center';
        var offset = 0;
        if (alignNum === 1) {
          align = 'left';
          offset = textOffset;
        } else if (alignNum === -1) {
          align = 'right';
          offset = -textOffset;
        }
        var clipPath = undefined;
        var formatText = getFormatVol(text);
        if (isOverview) {
          var width = list[i++];
          clipPath = new graphic.Rect({
            shape: {
              x: x,
              y: y - clipPathRectY,
              width: width,
              height: rectHeight
            }
          });
          var el1 = new graphic.Text({
            style: {
              text: formatText,
              fill: textFill,
              verticalAlign: 'middle',
              align: align,
              fontSize: fontSize,
              x: x + offset,
              y: y
            }
          });
          group.add(el1);
          el1.states.emphasis = emphasisState;
        }
        var el = new graphic.Text(__assign({
          style: {
            text: formatText,
            fill: key,
            verticalAlign: 'middle',
            align: align,
            fontSize: fontSize,
            x: x + offset,
            y: y
          }
        }, clipPath ? {
          clipPath: clipPath
        } : {}));
        // if (clipPath) {
        //     el.setClipPath(clipPath)
        // }
        group.add(el);
        el.states.emphasis = emphasisState;
      }
    });
    var totalPointsByColor = data.getLayout('totalPointsByColor');
    var totalTextBg = isDark ? 'rgba(0, 0, 0, 0.1)' : 'rgba(255, 255, 255, 0.1)';
    var top = Math.floor(fontSize * 0.2);
    totalPointsByColor.forEach(function (textPoint, key) {
      var list = textPoint.buffer();
      var size = textPoint.length();
      for (var i = 0; i < size;) {
        var x = list[i++];
        var y = list[i++];
        var text = list[i++];
        var el = new graphic.Text({
          style: {
            text: getFormatVol(text),
            fill: key,
            // verticalAlign: 'middle',
            align: 'center',
            fontSize: fontSize,
            width: textRectWidth,
            backgroundColor: totalTextBg,
            padding: [top, 0, top, 0]
          },
          x: x,
          y: y + 1
        });
        group.add(el);
        el.states.emphasis = emphasisState;
      }
    });
    var sumPoints = data.getLayout('sumPoints');
    var totalWidth = data.getLayout('totalWidth');
    var rectFill = isDark ? "#000" : "#fff";
    var computerTotalWidth = totalWidth * 0.7 - 10;
    var sumFontSize = findFontSize("" + (isBuyAndSellLadder ? "Delta" : "总买入") + getFormatVol(maxSumVol), computerTotalWidth, void 0, 2, rectHeight * 0.8, 50);
    var shadowColor = isDark ? darkShadowColor : lightShadowColor;
    if (isBuyAndSellLadder) {
      var marginTop = fontSize + top * 2;
      var deltaWidth = getWidth('Delta', sumFontSize + "px " + DefaultFamily) + 10;
      var list = sumPoints.buffer();
      var size = sumPoints.length();
      var padding = Math.floor(sumFontSize * 0.2);
      var height = sumFontSize * 2 + Math.max(padding, 12);
      for (var i = 0; i < size;) {
        var x1 = list[i++];
        var y = list[i++];
        var deltaNum = list[i++];
        var delta = getFormatVol(deltaNum);
        var total = getFormatVol(list[i++]);
        var rectEl = new graphic.Rect({
          shape: {
            x: x1,
            y: y + marginTop,
            width: totalWidth,
            height: height,
            r: 4
          },
          style: {
            fill: rectFill,
            shadowBlur: 15,
            shadowColor: shadowColor,
            // shadowOffsetX: 8,        // 向右偏移
            shadowOffsetY: 6
          }
        });
        var deltaPlaceholder = deltaNum > 0 ? 'up' : 'down';
        var textEl = new graphic.Text({
          style: {
            text: ["{title|Delta}{" + deltaPlaceholder + "|" + delta + "}", "{title|\u603B\u8BA1}{normal|" + total + "}"].join('\n'),
            fill: textFill,
            fontSize: sumFontSize,
            verticalAlign: 'middle',
            align: 'center',
            rich: {
              title: {
                width: deltaWidth,
                align: 'left'
              },
              up: {
                fill: '#089981',
                // align: 'center',
                align: 'left'
              },
              down: {
                fill: '#f23645',
                align: 'left'
              },
              normal: {
                align: 'left'
              }
            }
          },
          x: x1 + totalWidth / 2,
          y: y + marginTop + height / 2
        });
        group.add(rectEl);
        group.add(textEl);
        rectEl.states.emphasis = emphasisState;
        textEl.states.emphasis = emphasisState;
      }
    } else {
      var deltaWidth = getWidth('总买入', sumFontSize + "px " + DefaultFamily) + 10;
      var list = sumPoints.buffer();
      var size = sumPoints.length();
      var padding = Math.floor(sumFontSize * 0.2);
      var height = sumFontSize * 4 + Math.max(padding, 12);
      var marginTop = 8;
      for (var i = 0; i < size;) {
        var x1 = list[i++];
        var y = list[i++];
        var deltaNum = list[i++];
        var delta = getFormatVol(deltaNum);
        var total = getFormatVol(list[i++]);
        var buy = getFormatVol(list[i++]);
        var sell = getFormatVol(list[i++]);
        var rectEl = new graphic.Rect({
          shape: {
            x: x1,
            y: y + marginTop,
            width: totalWidth,
            height: height,
            r: 4
          },
          style: {
            fill: rectFill,
            shadowBlur: 15,
            shadowColor: shadowColor,
            // shadowOffsetX: 8,        // 向右偏移
            shadowOffsetY: 6
          }
        });
        var deltaPlaceholder = deltaNum > 0 ? 'up' : 'down';
        var textEl = new graphic.Text({
          style: {
            text: ["{title|Delta}{" + deltaPlaceholder + "|" + delta + "}", "{title|\u603B\u8BA1}{normal|" + total + "}", "{title|\u603B\u4E70\u5165}{up|" + buy + "}", "{title|\u603B\u5356\u51FA}{down|" + sell + "}"].join('\n'),
            fill: textFill,
            fontSize: sumFontSize,
            verticalAlign: 'middle',
            align: 'center',
            rich: {
              title: {
                width: deltaWidth,
                align: 'left'
              },
              up: {
                fill: '#089981',
                // align: 'center',
                align: 'left'
              },
              down: {
                fill: '#f23645',
                align: 'left'
              },
              normal: {
                align: 'left'
              }
            }
          },
          x: x1 + totalWidth / 2,
          y: y + marginTop + height / 2
        });
        group.add(rectEl);
        group.add(textEl);
        rectEl.states.emphasis = emphasisState;
        textEl.states.emphasis = emphasisState;
      }
    }
  };
  VolPathView.prototype._renderUnBlRect = function (seriesModel) {
    var data = seriesModel.getData();
    // const oldData = this._data;
    var group = this.group;
    var emphasisState = seriesModel.get('emphasis').emphasisState;
    var unbalancedPoints = data.getLayout('unbalancedPointsByColor');
    unbalancedPoints.forEach(function (rectPoints, key) {
      var el = new RectPath({
        shape: {
          typeArray: rectPoints
        },
        style: {
          fill: key,
          stroke: 'none'
        }
      });
      group.add(el);
      el.states.emphasis = emphasisState;
    });
  };
  VolPathView.prototype._renderVaLine = function (seriesModel) {
    var data = seriesModel.getData();
    // const oldData = this._data;
    var group = this.group;
    var emphasisState = seriesModel.get('emphasis').emphasisState;
    var vaPoints = data.getLayout('vaPoints');
    var theme = seriesModel.get('theme');
    var isDark = theme === 'dark';
    var lineColor = isDark ? "#fff" : "#000";
    var el = new LinePath({
      shape: {
        typeArray: vaPoints
      },
      style: {
        stroke: lineColor,
        lineWidth: 1,
        lineDash: 'dashed',
        fill: "none"
      }
    });
    group.add(el);
    el.states.emphasis = emphasisState;
    var markEl = new MarkPath({
      shape: {
        typeArray: vaPoints
      },
      style: {
        stroke: "none",
        // lineWidth: 1,
        // lineDash: 'dashed',
        fill: lineColor
      }
    });
    group.add(markEl);
    markEl.states.emphasis = emphasisState;
    var bandWidth = data.getLayout('bandWidth');
    if (bandWidth > 300) {
      var list = vaPoints.buffer();
      var size = vaPoints.length();
      for (var i = 0; i < size;) {
        var x1 = list[i++];
        var x2 = list[i++];
        var y1 = list[i++];
        var y2 = list[i++];
        var textEl = new graphic.Text({
          style: {
            fill: lineColor,
            fontSize: 10,
            text: 'VAL',
            verticalAlign: 'middle',
            align: 'right'
          },
          x: x1 - 6,
          y: y1 + 1
        });
        var text2El = new graphic.Text({
          style: {
            fill: lineColor,
            fontSize: 12,
            text: 'VAH',
            verticalAlign: 'middle',
            align: 'right'
          },
          x: x1 - 6,
          y: y2 + 1
        });
        group.add(textEl);
        group.add(text2El);
        textEl.states.emphasis = emphasisState;
        text2El.states.emphasis = emphasisState;
      }
    }
  };
  VolPathView.prototype.remove = function (ecModel) {
    this._clear();
  };
  VolPathView.prototype._clear = function () {
    this.group.removeAll();
    // this._data = null;
  };

  VolPathView.type = 'volPath';
  return VolPathView;
}(ChartView);
function getMaxFormatVol(vol) {
  if (vol === void 0) {
    vol = 0;
  }
  if (vol > 1000000) {
    return (vol / 1000000).toFixed(2) + "M";
  } else if (vol > 1000) {
    return (vol / 1000).toFixed(2) + "K";
  }
  return vol.toFixed(0);
}
export function getFormatVol(vol) {
  if (vol === void 0) {
    vol = 0;
  }
  if (vol > 1000000) {
    return (vol / 1000000).toLocaleString(undefined, {
      minimumFractionDigits: 0,
      maximumFractionDigits: 2
    }) + "M";
  } else if (vol > 1000) {
    return (vol / 1000).toLocaleString(undefined, {
      minimumFractionDigits: 0,
      maximumFractionDigits: 2
    }) + "K";
  }
  return vol.toFixed(0);
}
export default VolPathView;