I’ve been using the same touch input controller for a long time - almost a year, I think. It goes like this:
// add start drag to specific element, and use flags to handle later events
entity.element.on(pc.EVENT_TOUCHSTART, this._startDrag, this);
// add this globally, controlled by touch start flag, also I subscibe to
// other touch events, but does not matter in this concrete case
this.app.touch.on(pc.EVENT_TOUCHMOVE, this._moveDrag, this);
// later
TouchInput.prototype._startDrag = function(e) {
if (this.dragging) return
this.anchorTouch = e.touches[0]
e.event.preventDefault()
this.dragging = true
var touch = e.touches[0]
this.pointer.set(touch.x, touch.y)
}
TouchInput.prototype._moveDrag = function(e) {
if (!this.dragging) return;
e.event.preventDefault()
var touch = e.touches[0]
this.pointer.set(touch.x, touch.y)
}
I’ve been away from my pet project for a week, returned, and encountered 2 issues.
I can’t do preventDefault on EVENT_TOUCHSTART any more - there is an error Unable to preventDefault inside passive event listener invocation.
Event objects in TOUCHSTART and TOUCHMOVE now have different interfaces
In TOUCHSTART I’m having object ElementTouchEvent:
which does not have {x,y} in touch object
In TOUCHMOVE I’m having object TouchEvent:
which has {x,y} in touch object, and also a touch object like in TOUCHSTART event
something changed in PC? will future or similar changes/bugs can affect app that’s already released?
something changed in chrome? those events was the same before, I’m sure of it, I use to work with touch events and object interface was like in TOUCHMOVE case.
I think the preventDefault part could arise from the fact that I actually have some new event object with TOUCHSTART event, so that could be some another event?
My biggest question is what happend to event objects and why they are different now.
swiping on the image (on mobile) you should see in your log console that the event types coming in handlers are different (though I use TOUCHSTART on element, but other touch events on the app itself, maybe it counts. but it used to be the same)
I just tested the pc.ElementDragHelper on Chrome and Firefox mobile, and it appears to still work. You might want to give it a try in the meantime.
I just put this._handleDragHelper = new pc.ElementDragHelper(this.entity.element); in my initialize function and then use event callbacks for any logic other than the drag.
