1
0
Fork 0
forked from 0x2620/oxjs

add some touch support

- fire touch(start|move|end) events after adding clinetX/Y
- use touch events in video and timeline widgets
- use touchstart to select item in ArrayEditable
This commit is contained in:
j 2016-07-27 21:13:09 +02:00
commit f043242640
7 changed files with 81 additions and 6 deletions

View file

@ -83,6 +83,15 @@
singleclicks and doubleclicks, since it will not fire for
doubleclicks)
* <*> Original event properties
touchend <!> tochend
normalized version of touchend event
* <*> Original event properties
touchmove <!> tochmove
normalized version of touchmove event
* <*> Original event properties
touchstart <!> touchstart
normalized version of touchstart event
* <*> Original event properties
*/
Ox.Element = function Element(options, self) {
@ -118,7 +127,10 @@
.data({oxid: that.oxid})
.on({
mousedown: onMousedown,
mousewheel: onMousewheel
mousewheel: onMousewheel,
touchend: onTouchend,
touchmove: onTouchmove,
touchstart: onTouchstart
});
that[0] = that.$element[0];
that.length = 1;
@ -166,6 +178,18 @@
}
}
function getTouchData(e) {
var data = {};
if (e.changedTouches && e.changedTouches.length) {
data.clientX = e.changedTouches[0].clientX;
data.clientY = e.changedTouches[0].clientY;
} else {
data.clientX = e.pageX;
data.clientY = e.pageY;
}
return data;
}
function onMousedown(e) {
/*
better mouse events
@ -325,6 +349,21 @@
}
}
function onTouchend(e) {
var data = getTouchData(e.originalEvent);
that.triggerEvent('touchend', Ox.extend(e, data));
}
function onTouchmove(e) {
var data = getTouchData(e.originalEvent);
that.triggerEvent('touchmove', Ox.extend(e, data));
}
function onTouchstart(e) {
var data = getTouchData(e.originalEvent);
that.triggerEvent('touchstart', Ox.extend(e, data));
}
// TODO: in other widgets, use this,
// rather than some self.$tooltip that
// will not get garbage collected