update mouse events example

This commit is contained in:
rolux 2013-12-04 23:44:32 +01:00
parent 56c5998668
commit f166ddc01c

View file

@ -7,7 +7,7 @@ Ox.load('UI', function() {
var $target = Ox.Element() var $target = Ox.Element()
.addClass('OxMonospace') .addClass('OxMonospace')
.attr({id: 'target'}) .attr({id: 'target'})
.html('click/hold/drag') .html('click/hold/drag/scroll/swipe')
.appendTo(Ox.$body), .appendTo(Ox.$body),
$log = Ox.Element() $log = Ox.Element()
.attr({id: 'log'}) .attr({id: 'log'})
@ -22,7 +22,8 @@ Ox.load('UI', function() {
.appendTo(Ox.$body); .appendTo(Ox.$body);
[ [
'anyclick', 'singleclick', 'doubleclick', 'mousedown', 'mouserepeat', 'anyclick', 'singleclick', 'doubleclick', 'mousedown', 'mouserepeat',
'dragstart', 'drag', 'dragenter', 'dragleave', 'dragpause', 'dragend' 'dragstart', 'drag', 'dragenter', 'dragleave', 'dragpause', 'dragend',
'mousewheel'
].forEach(function(event) { ].forEach(function(event) {
$target.bindEvent(event, function(e) { $target.bindEvent(event, function(e) {
var date = new Date(); var date = new Date();
@ -33,12 +34,16 @@ Ox.load('UI', function() {
+ '.' + (Ox.pad(date % 1000, 3)) + '.' + (Ox.pad(date % 1000, 3))
+ ' <span style="font-weight: bold">' + event + '</span> ' + ' <span style="font-weight: bold">' + event + '</span> '
+ JSON.stringify( + JSON.stringify(
Ox.extend(e.clientX ? { Ox.extend('clientX' in e ? {
clientX: e.clientX, clientX: e.clientX,
clientY: e.clientY, clientY: e.clientY,
} : {}, e.clientDX ? { } : {}, 'clientDX' in e ? {
clientDX: e.clientDX, clientDX: e.clientDX,
clientDY: e.clientDY clientDY: e.clientDY
} : {}, 'deltaX' in e ? {
deltaX: e.deltaX,
deltaY: e.deltaY,
deltaFactor: e.deltaFactor
} : {}) } : {})
) )
.replace(/"/g, '') .replace(/"/g, '')