var THRESHOLD = 0.3
var MIN_DISTANCE = 10
var owner
var state
var getState = function (ownerInstance) {
owner = ownerInstance
state = owner.getState()
}
var initWidth = function (newVal, oldVal, ownerInstance) {
getState(ownerInstance)
state.screen = newVal
}
var _restTouchStatus = function () {
state.direction = undefined
state.deltaX = 0
state.deltaY = 0
state.offsetX = 0
state.offsetY = 0
}
var _getDirection = function (x, y) {
if (x > y && x > MIN_DISTANCE) {
return 'horizontal'
}
if (y > x && y > MIN_DISTANCE) {
return 'vertical'
}
return undefined
}
var _range = function (num, min, max) {
return Math.min(Math.max(num, min), max)
}
var _throttle = function (fn, gapTime) {
if (gapTime == null || gapTime == undefined) {
gapTime = 1500
}
var _lastTime = null
// 返回新的函数
return function () {
var _nowTime = getDate()
if (_nowTime - _lastTime > gapTime || !_lastTime) {
fn(arguments[0]) //将this和参数传给原函数
_lastTime = _nowTime
}
}
}
var _swipeMove = function (_offset = 0, sec = 0.6) {
state.offset = _range(
_offset,
state.screen - state.wrapx,
0,
)
var transform = 'translate3d(' + state.offset + 'px, 0, 0)'
var transition = state.dragging
? 'none'
: ('transform ' + sec + 's cubic-bezier(0.18, 0.89, 0.32, 1)')
owner.selectComponent('#wrapper').setStyle({
'-webkit-transform': transform,
'-webkit-transition': transition,
'transform': transform,
'transition': transition
})
}
var onStartDrag = function (event, ownerInstance) {
getState(ownerInstance)
_restTouchStatus()
var wrapper = owner.selectComponent('#wrapper')
var rect = wrapper.getBoundingClientRect()
// state.rect = rect
state.wrapx = rect.width
state.startOffset = state.offset || 0
var touchPoint = event.touches[0]
state.startX = touchPoint.clientX
state.startY = touchPoint.clientY
}
var onDrag = function (event, ownerInstance) {
getState(ownerInstance)
var touchPoint = event.touches[0]
state.deltaX = touchPoint.clientX - state.startX
state.deltaY = touchPoint.clientY - state.startY
state.offsetX = Math.abs(state.deltaX)
state.offsetY = Math.abs(state.deltaY)
state.direction = state.direction || _getDirection(state.offsetX, state.offsetY)
if (state.direction !== 'horizontal') {
return
}
state.isDragging = true
_swipeMove(state.startOffset + state.deltaX, 0.2)
}
var onEndDrag = function (event, ownerInstance) {
getState(ownerInstance)
state.isDragging = false
var SCREEN = state.screen
var therwidth = SCREEN * THRESHOLD
var idx = 0
if (Math.abs(state.deltaX) >= therwidth) {
if (state.deltaX >= 0) {
idx = Math.floor(state.offset / SCREEN) + 1
} else if (state.deltaX < 0) {
idx = Math.floor(state.offset / SCREEN)
}
} else {
if (state.deltaX >= 0) {
idx = Math.floor(state.offset / SCREEN)
} else if (state.deltaX < 0) {
idx = Math.floor(state.offset / SCREEN) + 1
}
}
_swipeMove(idx * SCREEN)
ownerInstance.callMethod("changedIndex", { idx: Math.abs(idx) })
//console.log(JSON.stringify(ownerInstance), ownerInstance.triggerEvent)
//ownerInstance("changedIndex", { idx })
}
module.exports = {
onDrag: onDrag,
onStartDrag: onStartDrag,
onEndDrag: onEndDrag,
initWidth: initWidth
}