// jshint esversion: 6
'use strict';

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.TiledGrid = void 0;

var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _Row = _interopRequireDefault(require("react-bootstrap/lib/Row"));

var _Banner = require("./Banner");

var INDEX_NOT_SET = -1;
var PROPERTY_NOT_SET = null;

var TiledGrid =
/*#__PURE__*/
function (_React$Component) {
  (0, _inheritsLoose2.default)(TiledGrid, _React$Component);

  function TiledGrid(props, context) {
    var _this;

    _this = _React$Component.call(this, props, context) || this;
    var initialIndex = INDEX_NOT_SET;

    if (props.currentItemIndex !== PROPERTY_NOT_SET) {
      initialIndex = props.currentItemIndex;
    }

    _this.state = {
      currentItemIndex: initialIndex
    };
    return _this;
  }

  var _proto = TiledGrid.prototype;

  _proto.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
    if (nextProps.hasOwnProperty('currentItemIndex') && nextProps.currentItemIndex !== PROPERTY_NOT_SET) {
      this.setCurrentItemIndex(nextProps.currentItemIndex);
    }
  };

  _proto.setCurrentItemIndex = function setCurrentItemIndex(index) {
    if (this.state.currentItemIndex !== index) {
      this.setState({
        currentItemIndex: index
      });

      if (this.props.onChange) {
        this.props.onChange(index);
      }
    }
  };

  _proto.getColSize = function getColSize() {
    var cols = this.props.cols;
    var GRID_CAPACITY = 12;
    var colSize = null;

    if (GRID_CAPACITY % cols === 0) {
      colSize = GRID_CAPACITY / cols;
    } else {
      throw new RangeError('Invalid cols parameter. Cols must be 1, 2, 3, 4, 6, 12');
    }

    return colSize;
  };

  _proto.getRowNumbers = function getRowNumbers() {
    var items = this.props.items;
    var cols = this.props.cols;
    return Math.ceil(items.length / cols);
  };

  _proto.getActiveRow = function getActiveRow() {
    var cols = this.props.cols;
    var currentItemIndex = this.state.currentItemIndex;

    if (currentItemIndex === INDEX_NOT_SET) {
      return null;
    }

    return Math.ceil((currentItemIndex + 1) / cols);
  };

  _proto.onCloseButtonClick = function onCloseButtonClick() {
    this.setCurrentItemIndex(INDEX_NOT_SET);
  };

  _proto.renderItem = function renderItem(item, index) {
    return null;
  };

  _proto.renderItemDetails = function renderItemDetails(item) {
    return null;
  };

  _proto.renderItems = function renderItems() {
    var _this$props = this.props,
        cols = _this$props.cols,
        items = _this$props.items,
        testAutomationId = _this$props.testAutomationId,
        dataTestAutomationId = _this$props['data-test-automation-id'];
    var renderedItems = items.map(this.renderItem.bind(this));
    var gridItems = [];

    for (var i = 1; i <= this.getRowNumbers(); i++) {
      var rowItems = [];

      for (var j = 0; j < cols; j++) {
        rowItems.push(renderedItems.shift());
      }

      gridItems.push(_react.default.createElement(_Row.default, {
        key: "row-0-" + i
      }, rowItems));

      if (this.getActiveRow() === i) {
        gridItems.push(_react.default.createElement(_Row.default, {
          className: "active",
          key: "row-1-" + i
        }, _react.default.createElement(_Banner.Banner, {
          closable: this.props.closable,
          closeLabel: this.props.closeLabel,
          onClose: this.onCloseButtonClick.bind(this),
          arrowColsOffset: this.state.currentItemIndex % cols * this.getColSize(),
          additionalOffset: this.props.bannerAdditionalOffset
        }, this.renderItemDetails(items[this.state.currentItemIndex]))));
      }
    }

    return _react.default.createElement("div", {
      className: "rc-tiled-grid",
      "data-test-automation-id": testAutomationId || dataTestAutomationId
    }, gridItems);
  };

  _proto.render = function render() {
    return this.renderItems();
  };

  return TiledGrid;
}(_react.default.Component);

exports.TiledGrid = TiledGrid;
(0, _defineProperty2.default)(TiledGrid, "propTypes", {
  testAutomationId: _propTypes.default.string,
  currentItemIndex: _propTypes.default.number,
  cols: _propTypes.default.number,
  items: _propTypes.default.array.isRequired,
  bannerAdditionalOffset: _propTypes.default.number,
  closable: _propTypes.default.bool,
  closeLabel: _propTypes.default.string,
  onChange: _propTypes.default.func
});
(0, _defineProperty2.default)(TiledGrid, "defaultProps", {
  cols: 2,
  bannerAdditionalOffset: 48,
  currentItemIndex: PROPERTY_NOT_SET,
  closable: true,
  closeLabel: 'TRANSLATE:CLOSE',
  testAutomationId: 'tiledGrid',
  onChange: null
});