
/*
* 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 { __extends } from "tslib";
import ComponentView from "../../view/Component.js";
import { each } from "tvrender/lib/core/util.js";
import * as graphic from "../../util/graphic.js";
import { getIsLightColor } from '../../util/color.js';
var getRectFill = function (color) {
  if (typeof color !== 'string') {
    return '#000';
  }
  return getIsLightColor(color) ? '#fff' : '#000';
};
var r = 15;
var optimizeX = function (x, lineWidth) {
  return lineWidth % 2 === 0 ? x : Math.floor(x) + 0.5;
};
var EventsView = /** @class */function (_super) {
  __extends(EventsView, _super);
  function EventsView() {
    var _this = _super !== null && _super.apply(this, arguments) || this;
    _this.type = EventsView.type;
    _this._lastPoint = {
      x: 0,
      y: 0
    };
    return _this;
  }
  EventsView.prototype.init = function (ecModel, api) {
    this._api = api;
    // api.getZr().on('mousemove', this._eventClick, this);
  };

  EventsView.prototype.render = function (eventsModel, ecModel, api) {
    this.group.removeAll();
    if (!eventsModel.get("show")) {
      return;
    }
    var group = this.group;
    var data = eventsModel.get("data");
    var xAxisModal = ecModel.getComponent("xAxis", 0);
    if (!xAxisModal) {
      return;
    }
    var scale = xAxisModal.axis.scale;
    var ordinalMeta = scale.getOrdinalMeta();
    var _a = scale.getExtent(),
      startIndex = _a[0],
      endIndex = _a[1];
    var rect;
    // const offset = scale.barSpace / 2;
    var gird = ecModel.getComponent("grid", 0);
    if (gird && gird.coordinateSystem) {
      rect = gird.coordinateSystem.getRect();
    }
    if (!rect) {
      return;
    }
    // const width = api.getWidth();
    // const height = api.getHeight();
    var lineVisible = eventsModel.get('lineVisible');
    var lineStyle = eventsModel.get('lineStyle');
    var z = eventsModel.get('z');
    var selectedEventViewId = eventsModel.get('selectedEventViewId');
    var backgroundColor = ecModel.get('backgroundColor') || '#fff';
    var hoverEventId = this.hoverEventId;
    var lastPoint = this._lastPoint;
    var mouseMove = this._mouseMove.bind(this);
    var borderWidth = 2;
    var _loop_1 = function (index) {
      var _b = data[index],
        time = _b.time,
        list = _b.list;
      var idx = ordinalMeta.parseAndExtra(time);
      if (idx < startIndex) {
        return "continue";
      }
      if (idx > endIndex) {
        return "break";
      }
      var x = xAxisModal.axis.dataToCoord(idx) - 15;
      var y = rect.height - rect.x - 20;
      var z2 = data.length - index;
      each(list, function (item, i) {
        var _this = this;
        var yGap = 4 * (i + 1);
        var imgY = y - yGap;
        var id = time + "_" + item.id;
        var isSelected = selectedEventViewId === id;
        var renderZ = isSelected ? z + 1 : z;
        var imgGroup = new graphic.Group();
        var img = new graphic.Image({
          style: {
            image: item.url,
            x: x + 5,
            y: imgY,
            width: 20,
            height: 20
          },
          z2: z2,
          z: renderZ
        });
        var clipPath = new graphic.Rect({
          shape: {
            x: x + 6,
            y: imgY + 1,
            width: 18,
            height: 18,
            r: r
          }
        });
        img.setClipPath(clipPath);
        var rect = new graphic.Rect({
          shape: {
            x: x + 5 - borderWidth / 2,
            y: imgY - borderWidth / 2,
            width: 20 + borderWidth,
            height: 20 + borderWidth,
            r: r
          },
          style: {
            stroke: "#ED544F",
            fill: getRectFill(backgroundColor),
            lineWidth: borderWidth
          },
          z2: z2,
          z: renderZ
        });
        if (hoverEventId === id || isSelected) {
          if (isSelected || rect.contain(lastPoint.x, lastPoint.y)) {
            rect.style.stroke = "#296bef";
          } else {
            this.hoverEventId = '';
          }
        }
        imgGroup.add(rect);
        imgGroup.add(img);
        if (i !== list.length - 1) {
          y = y - 24;
        }
        var mouseout = function () {
          _this.hoverEventId = '';
          !isSelected && rect.attr('style', {
            stroke: '#ED544F'
          });
        };
        var mouseover = function () {
          _this.hoverEventId = id;
          rect.attr('style', {
            stroke: '#296bef'
          });
          api.dispatchAction({
            type: 'updateAxisPointer',
            currTrigger: 'globalout'
          });
        };
        var click = function (e) {
          e.preventAxisPointer = true;
          api.trigger('events', {
            time: time,
            id: item.id,
            selectedEventViewId: id,
            position: {
              x: rect.shape.x,
              y: rect.shape.y,
              rect: api.getDom().getBoundingClientRect()
            }
          });
        };
        imgGroup.onmouseout = mouseout;
        imgGroup.onmousemove = mouseMove;
        imgGroup.onmouseover = mouseover;
        imgGroup.onmouseup = click;
        group.add(imgGroup);
        // rect.onmouseout = mouseout;
        // rect.onmousemove = mouseMove;
        // rect.onmouseover = mouseover;
        // rect.onclick = click;
      }, this_1);
      if (lineVisible && list.length) {
        var linex = optimizeX(x + 15, lineStyle.width);
        var line = new graphic.Line({
          shape: {
            x1: linex,
            y1: 0,
            x2: linex,
            y2: y
          },
          silent: true,
          style: {
            stroke: lineStyle.color,
            lineWidth: lineStyle.width,
            lineDash: lineStyle.type
          },
          z2: 0,
          z: z
        });
        group.add(line);
      }
    };
    var this_1 = this;
    for (var index = 0; index < data.length; index++) {
      var state_1 = _loop_1(index);
      if (state_1 === "break") break;
    }
  };
  // _eventClick(e: any){
  // }
  EventsView.prototype._mouseMove = function (e) {
    this._lastPoint = {
      x: e.offsetX,
      y: e.offsetY
    };
    e.preventAxisPointer = true;
  };
  EventsView.prototype.dispose = function () {
    this._lastPoint = {
      x: 0,
      y: 0
    };
    // this._api && this._api.getZr()?.off('mousemove', this._eventClick);
  };

  EventsView.type = "events";
  return EventsView;
}(ComponentView);
export { EventsView };