'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});

var _icon = require('../icon');

var _icon2 = _interopRequireDefault(_icon);

var _touch = require('../mixins/touch');

var _mouse = require('../mixins/mouse');

require('./index.less');

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

// 刷新距离
var DISTANCE = 50;

var PullToRefresh = {
    name: 'SnPullToRefresh',

    mixins: [_touch.TouchMixin, _mouse.MouseMixin],

    props: {
        value: Boolean,
        // 激活刷新文字
        activateText: {
            type: String,
            'default': '下拉刷新'
        },
        // 激活后刷新文字
        deactivateText: {
            type: String,
            'default': '松手更新'
        },
        // 松开后文字
        releaseText: {
            type: String,
            'default': '加载中...'
        },
        finishText: {
            type: String,
            'default': '更新完成'
        },
        finishDuration: {
            type: [String, Number],
            'default': 300
        },
        disabled: Boolean,
        indicatorHeight: {
            type: [Number, String],
            'default': 70
        }
    },

    data: function data() {
        return {
            refreshing: false,
            offset: 0,
            dragging: false,
            mouseSign: false
        };
    },


    computed: {
        computedIndicatorHeight: function computedIndicatorHeight() {
            return parseInt(this.indicatorHeight) || this.getHeightByRef('indicatorRef');
        }
    },

    watch: {
        value: function value(newVal, oldVal) {
            var _this = this;

            if (oldVal && !newVal) {
                this.refreshing = false;

                setTimeout(function () {
                    _this.swipeMove(0);
                }, this.finishDuration);
            }
        }
    },

    mounted: function mounted() {
        // console.log('computedIndicatorHeight == ', this.computedIndicatorHeight);
    },


    methods: {
        getHeightByRef: function getHeightByRef(ref) {
            if (this.$refs[ref]) {
                var rect = this.$refs[ref].getBoundingClientRect();
                return rect.height;
            }

            return 0;
        },
        close: function close() {
            this.offset = 0;
        },
        resetSwipeStatus: function resetSwipeStatus() {
            this.swiping = false;
        },
        swipeMove: function swipeMove() {
            var offset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;

            if (this.refreshing || offset < 0) {
                return;
            }

            var computedIndicatorHeight = this.computedIndicatorHeight;

            if (offset < computedIndicatorHeight) {
                this.offset = offset;
            } else {
                if (offset < computedIndicatorHeight * 2) {
                    this.offset = computedIndicatorHeight + (offset - computedIndicatorHeight) / 2;
                } else {
                    this.offset = computedIndicatorHeight * 1.5 + (offset - computedIndicatorHeight * 2) / 4;
                }
            }

            if (this.offset) {
                this.swiping = true;
            }
        },
        swipeLeaveTransition: function swipeLeaveTransition() {
            if (this.refreshing) {
                this.offset = this.computedIndicatorHeight;
                this.$emit('refresh');
            } else {
                this.offset = 0;
                this.swipeMove(0);
            }
        },
        onTouchStart: function onTouchStart(event) {
            if (this.disabled || this.refreshing) {
                return;
            }

            this.dragging = true;
            this.touchStart(event);
        },
        onMouseStart: function onMouseStart(event) {
            if (this.disabled || this.refreshing) {
                return;
            }

            this.dragging = true;
            this.mouseStart(event);
        },
        onTouchMove: function onTouchMove(event) {
            if (this.disabled) {
                return;
            }

            this.touchMove(event);

            if (this.direction === 'vertical') {
                this.swipeMove(this.deltaY);
            }
        },
        onMouseMove: function onMouseMove(event) {
            if (this.disabled || !this.dragging) {
                return;
            }

            this.mouseMove(event);

            if (this.direction === 'vertical') {
                this.swipeMove(this.deltaY);
            }
        },
        onTouchEnd: function onTouchEnd() {
            if (this.disabled) {
                return;
            }

            this.dragging = false;

            if (this.deltaY >= DISTANCE) {
                this.refreshing = true;
                this.$emit('input', true);
            }

            if (this.swiping) {
                this.swipeLeaveTransition();
            }
        },
        onMouseEnd: function onMouseEnd() {
            if (this.disabled || !this.dragging) {
                return;
            }

            this.dragging = false;

            if (this.deltaY >= DISTANCE) {
                this.refreshing = true;
                this.$emit('input', true);
            }

            if (this.swiping) {
                this.swipeLeaveTransition();
            }
        },
        renderIndicator: function renderIndicator() {
            var h = this.$createElement;

            var indicatorText = '';

            if (this.dragging) {
                if (this.offset > DISTANCE) {
                    indicatorText = this.deactivateText;
                } else {
                    indicatorText = this.activateText;
                }
            } else {
                if (this.refreshing) {
                    indicatorText = this.releaseText;
                } else {
                    indicatorText = this.finishText;
                }
            }

            return h(
                'div',
                {
                    'class': 'sn-pull-to-refresh-indicator',
                    ref: 'indicatorRef',
                    style: { height: this.computedIndicatorHeight + 'px' }
                },
                [h(
                    'div',
                    { 'class': 'loading' },
                    [this.dragging || this.refreshing ? h(_icon2['default'], {
                        attrs: { type: 'loading' }
                    }) : null, h('span', [indicatorText])]
                )]
            );
        }
    },

    render: function render() {
        var _this2 = this;

        var h = arguments[0];
        var $slots = this.$slots;


        var trackStyle = {
            transform: 'translate3d(0, ' + this.offset + 'px, 0)',
            transitionDuration: this.dragging ? '0s' : '.6s'
        };

        return h(
            'div',
            {
                'class': 'sn-pull-to-refresh',
                on: {
                    'touchstart': this.onTouchStart,
                    'mousedown': this.onMouseStart,
                    'touchmove': this.onTouchMove,
                    'mousemove': this.onMouseMove,
                    'touchend': this.onTouchEnd,
                    'mouseup': this.onMouseEnd,
                    'touchcancel': this.onTouchEnd
                }
            },
            [h(
                'div',
                {
                    'class': 'sn-pull-to-refresh-track',
                    style: trackStyle,
                    on: {
                        'transitionend': function transitionend() {
                            _this2.swiping = false;
                            // 清除子节点因防止滑动冒泡处理的overflow为hidden，导致初次无法变更的问题
                            if ($slots['default']) {
                                var VNode = $slots['default'][0];
                                var elm = VNode.elm;
                                elm.style['overflow'] = '';
                            }
                        }
                    }
                },
                [this.renderIndicator(), $slots['default']]
            )]
        );
    }
};

PullToRefresh.install = function (Vue) {
    Vue.component(PullToRefresh.name, PullToRefresh);
};

exports['default'] = PullToRefresh;
module.exports = exports.default;