englishread-front/uni_modules/yingbing-ReadPage/components/scroller/pulldown.wxs

var max = 200
var refreshHeight = 80
function touchstart(event, ins) {
	console.log('touchstart');
	var state = ins.getState()
	if ( state.refresh ) return
	var touch = event.touches[0] || event.changedTouches[0]
	state.startX = touch.pageX
	state.startY = touch.pageY
}
function touchmove(event, ins) {
	console.log('touchmove');
	var state = ins.getState()
	if ( state.refresh ) return
	if ( state.startY > 0) {
		var touch = event.touches[0] || event.changedTouches[0]
		if ((Math.abs(touch.pageY - state.startY) > Math.abs(touch.pageX - state.startX)) && Math.abs(touch.pageY - state.startY) > 20) {
			var pageY = touch.pageY
			var rate = max / (max + Math.abs(pageY - state.startY))
			state.threshold = rate * (pageY - state.startY)
			if ( state.threshold > 0 && !state.pulldownable ) return
			if ( state.threshold < 0 && !state.pullupable ) return
			if ( state.threshold > max ) {
				state.threshold = max
			}
			if ( state.threshold < -max ) {
				state.threshold = -max
			}
			ins.selectComponent('.yingbing-scroller-wrapper').setStyle({
				transform: 'translateY(' + state.threshold + 'px)',
				transition: ''
			})
			if ( state.threshold > 0 ) {
				ins.callMethod('pullingdown', state.threshold)
			} else {
				ins.callMethod('pullingup', Math.abs(state.threshold))
			}
		}
	}
}
function touchend(event, ins) {
	touchaction(event, ins)
}
function touchcancel(event, ins) {
	touchaction(event, ins)
}
function touchaction (event, ins) {
	var state = ins.getState()
	if ( state.refresh ) return
	if ( state.threshold > 0 && state.pulldownable ) {//下拉
		if ( state.threshold > refreshHeight ) {//满足下拉条件
			ins.selectComponent('.yingbing-scroller-wrapper').setStyle({
				transform: 'translateY(' + refreshHeight + 'px)',
				transition: 'transform .1s'
			})
			ins.callMethod('pulldown')
			state.refresh = true
		} else {//不满足下拉条件恢复样式
			stop(ins)
		}
	}
	if ( state.threshold < 0 && state.pullupable ) {//上拉
		if ( Math.abs(state.threshold) > refreshHeight ) {//满足上拉条件
			ins.selectComponent('.yingbing-scroller-wrapper').setStyle({
				transform: 'translateY(-' + refreshHeight + 'px)',
				transition: 'transform .1s'
			})
			ins.callMethod('pullup')
			state.refresh = true
		} else {//不满足上拉条件恢复样式
			stop(ins)
		}
	}
}
function stop (ins) {
	var state = ins.getState()
	ins.selectComponent('.yingbing-scroller-wrapper').setStyle({
		transform: 'translateY(0)',
		transition: 'transform .1s'
	})
	state.threshold = 0
	state.startY = 0
	state.refresh = false
}
function refreshStateWatcher (newVal, oldVal, ins) {
	if ( newVal == 'pulldown' ) {
		var state = ins.getState()
		state.threshold = refreshHeight + 1
		state.refresh = false
		touchaction(null, ins)
	}
	if ( newVal == 'pullup' ) {
		var state = ins.getState()
		state.threshold = -(refreshHeight + 1)
		state.refresh = false
		touchaction(null, ins)
	}
	if ( newVal == 'stop' ) stop(ins)
}
function pulldownableWatcher (newVal, oldVal, ins) {
	var state = ins.getState()
	if ( state ) state.pulldownable = newVal
}
function pullupableWatcher (newVal, oldVal, ins) {
	var state = ins.getState()
	if ( state ) state.pullupable = newVal
}
module.exports = {
	refreshStateWatcher: refreshStateWatcher,
	pulldownableWatcher: pulldownableWatcher,
	pullupableWatcher: pullupableWatcher,
	touchstart: touchstart,
	touchmove: touchmove,
	touchend: touchend,
	touchcancel: touchcancel
}