'use strict';

exports.__esModule = true;
exports.default = undefined;

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _class, _temp;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _Notice = require('./../Notice');

var _Notice2 = _interopRequireDefault(_Notice);

var _instance = require('./instance.js');

var _instance2 = _interopRequireDefault(_instance);

var _ImgLazy = require('./../ImgLazy');

var _ImgLazy2 = _interopRequireDefault(_ImgLazy);

var _instance3 = require('../Context/instance.js');

var _instance4 = _interopRequireDefault(_instance3);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var Dragrefresh = (_temp = _class = function (_Component) {
  _inherits(Dragrefresh, _Component);

  function Dragrefresh(props, context) {
    _classCallCheck(this, Dragrefresh);

    var _this = _possibleConstructorReturn(this, _Component.call(this, props, context));

    _this.componentDidUpdate = function (prevProps) {
      if (prevProps.hasMore === _this.props.hasMore) return;
      // 刷新完成则设置刷新
      _this.setPagination(prevProps.hasMore, _this.props.hasMore);
    };

    _this.init = function () {
      // 全局配置
      var locale = _this.context.locale;

      if (!locale) locale = function locale(remark) {
        return remark || '';
      };
      var onScroll = _this.props.onScroll;

      var instance = new _instance2.default({
        threshold: _this.props.threshold,
        end: _this.props.end,
        endRefresh: _this.props.endRefresh,
        moveTimeout: _this.props.moveTimeout,
        container: _this.$el,
        onScroll: onScroll,
        onTopRefresh: _this.onTopRefresh, // 头部刷新,加载第一页
        onBottomRefresh: _this.onBottomRefresh, // 底部刷新,加载下一页
        // 构建实体
        topContainer: _this.$elTopBox,
        // 实体交互
        duration: 150,
        onPull: function onPull(e) {
          var topContainer = e.topContainer;
          topContainer.style.height = e.touches.currentPosY + 'px';
          var topIcon = topContainer.querySelector('.df-pull-icon');
          var topCaption = topContainer.querySelector('.df-pull-caption');
          if (!e.isLoading) {
            if (e.touches.currentPosY >= e.params.threshold) {
              if (topIcon) topIcon.classList.add('df-pull-icon-down');
              if (topCaption) topCaption.innerHTML = locale('释放立即刷新', 'release');
            } else {
              if (topIcon) topIcon.classList.remove('df-pull-icon-down');
              if (topCaption) topCaption.innerHTML = locale('下拉可以刷新', 'pull_down');
            }
          }
        },
        onShowTop: function onShowTop(e) {
          var topContainer = e.topContainer;
          var topIcon = topContainer.querySelector('.df-pull-icon');
          var topCaption = topContainer.querySelector('.df-pull-caption');
          topContainer.style.height = e.params.threshold + 'px';
          if (topIcon) topIcon.classList.remove('df-pull-icon-down');
          if (topIcon) topIcon.classList.add('df-pull-icon-loading');
          if (topCaption) topCaption.innerHTML = locale('正在刷新...', 'refreshing');
        },
        onHideTop: function onHideTop(e) {
          var topContainer = e.topContainer;
          topContainer.style.height = '0';
        },
        onTopHid: function onTopHid(e) {
          var topContainer = e.topContainer;
          var topIcon = topContainer.querySelector('.df-pull-icon');
          if (topIcon) topIcon.classList.remove('df-pull-icon-down');
          if (topIcon) topIcon.classList.remove('df-pull-icon-loading');
        }
      });
      _this.instance = instance;
    };

    _this.onTopRefresh = function () {
      _this.props.onTopRefresh();
    };

    _this.onBottomRefresh = function () {
      if (!_this.props.onBottomRefresh) return;
      var hasMore = _this.props.hasMore;

      if (hasMore !== 0 && hasMore !== -1 && hasMore !== 404) {
        _this.props.onBottomRefresh();
      } else {
        if (_this.instance) _this.instance.isLoading = false; // 暂无数据时, 设置为可刷新
      }
    };

    _this.lazyLoad = function () {
      if (!_this.$el) return;
      if (_this.timeout) window.clearTimeout(_this.timeout);
      _this.timeout = setTimeout(function () {
        if (_this.lazy) {
          _this.lazy.load();
        } else {
          _this.lazy = new _ImgLazy2.default({
            overflowContainer: _this.$el
          });
          _this.lazy.load();
        }
      }, 500);
    };

    _this.setPagination = function (prevHasMore, hasMore) {
      // 如果还没有初始化完成,则会再轮询调用一下
      if (!_this.instance) {
        setTimeout(function () {
          _this.setPagination(prevHasMore, hasMore);
        }, 100);
        return;
      }
      console.log('hasMore: \u7531' + prevHasMore + '\u53D8\u6210' + hasMore);
      // 无数据时不允许触发刷新
      if (_this.props.showNotice && hasMore === 404) {
        _this.instance.detach();
      } else if (_this.props.showNotice && prevHasMore === 404 && hasMore !== 404) {
        _this.instance.attach();
      }
      // 刷新完成, 需收起头
      if (hasMore !== -2) {
        _this.instance.hideTop();
      }
      // 设置为可刷新
      _this.instance.isLoading = false;
      // 刷新完成, 还有数据
      if (hasMore === 1) {
        // 如果还有数据，并且如果没有滚动条，则继续加载
        if (!_this.instance.hasScroll()) {
          console.log('还有数据,但没有滚动条,继续加载...');
          _this.instance.bottomRefresh();
        }
      }
      // 懒加载
      if (_this.props.lazyLoad) _this.lazyLoad();
    };

    return _this;
  }

  Dragrefresh.prototype.componentDidMount = function componentDidMount() {
    this.init();
    this.setPagination(undefined, this.props.hasMore);
  };
  // 实例化

  // 头部刷新

  // 底部刷新

  // 懒人加载

  // 控制刷新


  Dragrefresh.prototype.render = function render() {
    var _this2 = this;

    // 全局配置
    var locale = this.context.locale;

    if (!locale) locale = function locale(remark) {
      return remark || '';
    };

    var _props = this.props,
        threshold = _props.threshold,
        end = _props.end,
        endRefresh = _props.endRefresh,
        moveTimeout = _props.moveTimeout,
        onTopRefresh = _props.onTopRefresh,
        onTopComplete = _props.onTopComplete,
        onBottomRefresh = _props.onBottomRefresh,
        onBottomComplete = _props.onBottomComplete,
        children = _props.children,
        hasMore = _props.hasMore,
        showNotice = _props.showNotice,
        noticeProps = _props.noticeProps,
        lazyLoad = _props.lazyLoad,
        onScroll = _props.onScroll,
        _props$bottomLoadingC = _props.bottomLoadingCaption,
        bottomLoadingCaption = _props$bottomLoadingC === undefined ? locale('正在加载...', 'loading') : _props$bottomLoadingC,
        _props$bottomNoDataCa = _props.bottomNoDataCaption,
        bottomNoDataCaption = _props$bottomNoDataCa === undefined ? locale('没有更多数据了', 'no_more_data') : _props$bottomNoDataCa,
        _props$bottomErrorCap = _props.bottomErrorCaption,
        bottomErrorCaption = _props$bottomErrorCap === undefined ? locale('加载失败, 请稍后再试', 'refreshing_failed') : _props$bottomErrorCap,
        onClickBottomError = _props.onClickBottomError,
        others = _objectWithoutProperties(_props, ['threshold', 'end', 'endRefresh', 'moveTimeout', 'onTopRefresh', 'onTopComplete', 'onBottomRefresh', 'onBottomComplete', 'children', 'hasMore', 'showNotice', 'noticeProps', 'lazyLoad', 'onScroll', 'bottomLoadingCaption', 'bottomNoDataCaption', 'bottomErrorCaption', 'onClickBottomError']);

    return _react2.default.createElement(
      'div',
      _extends({ ref: function ref(el) {
          _this2.$el = el;
        } }, others, { className: 'container' + (others.className ? ' ' + others.className : '') }),
      onTopRefresh && _react2.default.createElement(
        'div',
        { ref: function ref(el) {
            _this2.$elTopBox = el;
          }, className: 'SID-Dragrefresh-TopContainer df-pull' },
        _react2.default.createElement(
          'div',
          { className: 'df-pull-box' },
          _react2.default.createElement('div', { className: 'df-pull-icon' }),
          _react2.default.createElement(
            'div',
            { className: 'df-pull-caption' },
            locale('下拉可以刷新', 'pull_down')
          )
        )
      ),
      this.props.children,
      onBottomRefresh && (hasMore === 1 || hasMore === -2) && _react2.default.createElement(
        'div',
        { className: 'SID-Dragrefresh-BottomContainer df-pull', style: { height: '50px' } },
        _react2.default.createElement(
          'div',
          { className: 'df-pull-box' },
          _react2.default.createElement('div', { className: 'df-pull-icon df-pull-icon-loading' }),
          _react2.default.createElement(
            'div',
            { className: 'df-pull-caption' },
            bottomLoadingCaption
          )
        )
      ),
      onBottomRefresh && hasMore === 0 && _react2.default.createElement(
        'div',
        { className: 'SID-Dragrefresh-NoDataContainer df-pull', style: { height: '50px' } },
        _react2.default.createElement(
          'div',
          { className: 'df-pull-box' },
          _react2.default.createElement(
            'div',
            { className: 'df-pull-caption' },
            bottomNoDataCaption
          )
        )
      ),
      onBottomRefresh && hasMore === -1 && _react2.default.createElement(
        'div',
        { className: 'SID-Dragrefresh-ErrorContainer df-pull', style: { height: '50px' }, onClick: onClickBottomError },
        _react2.default.createElement(
          'div',
          { className: 'df-pull-box' },
          _react2.default.createElement(
            'div',
            { className: 'df-pull-caption' },
            bottomErrorCaption
          )
        )
      ),
      hasMore === 404 && showNotice && _react2.default.createElement(_Notice2.default, _extends({ caption: '暂无数据' }, noticeProps))
    );
  };

  return Dragrefresh;
}(_react.Component), _class.contextType = _instance4.default, _class.defaultProps = {
  showNotice: true
}, _temp);
exports.default = Dragrefresh;
Dragrefresh.propTypes = process.env.NODE_ENV !== "production" ? {
  threshold: _propTypes2.default.number, // 头部下拉的触发位置
  end: _propTypes2.default.number, // 头部下拉的结束位置
  endRefresh: _propTypes2.default.bool, // 滑动到指位置后自动刷新
  moveTimeout: _propTypes2.default.number, // 滑动超时, 解决ios手指滑动到原生tabbar上, 不触发onTouchEnd
  onTopRefresh: _propTypes2.default.func,
  onTopComplete: _propTypes2.default.func,
  onBottomRefresh: _propTypes2.default.func,
  onBottomComplete: _propTypes2.default.func,

  children: _propTypes2.default.node,
  hasMore: _propTypes2.default.number, // hasMore: 0.无更多数据 1.数据加载完成 404.一条数据都没有 -1. 加载错误 -2. 重置状态,为了后面可以更新DOM

  showNotice: _propTypes2.default.bool, // 是否允许暂无数据
  noticeProps: _propTypes2.default.object,

  lazyLoad: _propTypes2.default.bool,

  onScroll: _propTypes2.default.func, // 滚动事件

  // 底部加载中
  bottomLoadingCaption: _propTypes2.default.string,
  // 底部加载完成
  bottomNoDataCaption: _propTypes2.default.string,
  // 底部加载错误
  bottomErrorCaption: _propTypes2.default.string,
  onClickBottomError: _propTypes2.default.func
} : {};
module.exports = exports['default'];