"use strict";

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

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

var _regenerator = _interopRequireDefault(require("@babel/runtime-corejs2/regenerator"));

require("regenerator-runtime/runtime");

var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime-corejs2/helpers/asyncToGenerator"));

require("./index.css");

var _from = _interopRequireDefault(require("@babel/runtime-corejs2/core-js/array/from"));

var _promise = _interopRequireDefault(require("@babel/runtime-corejs2/core-js/promise"));

var _component = require("../_utils/component.js");

var _Waterfall = _interopRequireDefault(require("./Waterfall.js"));

var _Item = _interopRequireDefault(require("./Item"));

var _vueNormalizeComponent = _interopRequireDefault(require("../_utils/vue-normalize-component.js"));

/* script */
//
//
//
//
//
//
//
//
var __vue_script__ = {
  name: (0, _component.createComponentName)('waterfall'),
  Item: _Item.default,

  provide() {
    return {
      waterfail: this
    };
  },

  mixins: [_component.componentMixin],
  props: {
    transition: {
      type: String,
      default: 'waterfall-fade'
    },
    grid: {
      type: Number,
      default: 1
    },
    getKey: {
      type: Function,
      default: undefined
    },
    margin: {
      type: Number,
      default: 10
    }
  },
  watch: {
    margin() {
      var _this = this;

      this.$nextTick(function () {
        _this.update();
      });
    }

  },

  mounted() {
    window.addEventListener('resize', this.update);
  },

  methods: {
    resize() {
      this.update();
    },

    update() {
      var _this2 = this;

      return (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee() {
        return _regenerator.default.wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                if (!_this2.$update) {
                  _context.next = 4;
                  break;
                }

                _context.next = 3;
                return _this2.$update;

              case 3:
                return _context.abrupt("return");

              case 4:
                ;
                _this2.$update = new _promise.default(function (resolve) {
                  setTimeout(function () {
                    _this2.waterfail = new _Waterfall.default({
                      width: _this2.$el.clientWidth,
                      margin: _this2.margin,
                      grid: _this2.grid
                    });
                    _this2.lastClientWidth = _this2.$el.clientWidth;
                    var children = (0, _from.default)(_this2.$el.children).filter(function (n) {
                      return n.getAttribute('class').indexOf('leave') === -1;
                    });
                    var maxHeight = 0;

                    for (var index = 0; index < children.length; index++) {
                      var el = children[index];

                      var _this2$waterfail$getP = _this2.waterfail.getPostion(el.clientWidth, el.clientHeight),
                          left = _this2$waterfail$getP.left,
                          top = _this2$waterfail$getP.top;

                      el.style.left = left + 'px';
                      el.style.top = top + 'px';
                      var height = top + el.clientHeight;

                      if (height > maxHeight) {
                        maxHeight = height;
                      }
                    }

                    _this2.$el.style.height = maxHeight + 'px';
                    resolve();
                    _this2.$update = undefined;
                  }, 200);
                });
                _context.next = 8;
                return _this2.$update;

              case 8:
              case "end":
                return _context.stop();
            }
          }
        }, _callee, this);
      }))();
    }

  }
};
/* template */

var __vue_render__ = function __vue_render__() {
  var _vm = this;

  var _h = _vm.$createElement;

  var _c = _vm._self._c || _h;

  return _c("div", {
    class: _vm.bem()
  }, [_vm._t("default")], 2);
};

var __vue_staticRenderFns__ = [];
__vue_render__._withStripped = true;
/* style */

var __vue_inject_styles__ = undefined;
/* scoped */

var __vue_scope_id__ = undefined;
/* module identifier */

var __vue_module_identifier__ = undefined;
/* functional template */

var __vue_is_functional_template__ = false;
/* component normalizer */

/* style inject */

/* style inject SSR */
var _default = (0, _vueNormalizeComponent.default)({
  render: __vue_render__,
  staticRenderFns: __vue_staticRenderFns__
}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, undefined, undefined);

exports.default = _default;