Fix pointer detection in scrollable container. Thanks @kwicher. Closes #730

This commit is contained in:
kangax 2013-07-07 22:32:03 +02:00
parent 21f87bb63a
commit 3eb00518f8
5 changed files with 38 additions and 20 deletions

View file

@ -12,7 +12,7 @@ Using Fabric.js, you can create and populate objects on canvas; objects like sim
### Goals
- Unit tested (1660+ tests at the moment)
- Unit tested (1700+ tests at the moment)
- Modular (~60 small "classes", modules, mixins)
- Cross-browser
- [Fast](https://github.com/kangax/fabric.js/wiki/Focus-on-speed)

23
dist/all.js vendored
View file

@ -3284,13 +3284,18 @@ fabric.util.string = {
while (element && element.parentNode && !firstFixedAncestor) {
element = element.parentNode;
if (element !== fabric.document && fabric.util.getElementStyle(element, 'position') === 'fixed') firstFixedAncestor = element;
if (element !== fabric.document &&
fabric.util.getElementStyle(element, 'position') === 'fixed') {
firstFixedAncestor = element;
}
if (element !== fabric.document && orgElement !== upperCanvasEl && fabric.util.getElementStyle(element, 'position') === 'absolute') {
if (element !== fabric.document &&
orgElement !== upperCanvasEl &&
fabric.util.getElementStyle(element, 'position') === 'absolute') {
scrollLeft = 0;
scrollTop = 0;
}
else if (element === fabric.document && orgElement !== upperCanvasEl) {
else if (element === fabric.document) {
scrollLeft = body.scrollLeft || docElement.scrollLeft || 0;
scrollTop = body.scrollTop || docElement.scrollTop || 0;
}
@ -3320,15 +3325,19 @@ fabric.util.string = {
if (fabric.isTouchSupported) {
pointerX = function(event) {
if (event.type !== 'touchend') {
return (event.touches && event.touches[0] ? (event.touches[0].pageX - (event.touches[0].pageX - event.touches[0].clientX)) || event.clientX : event.clientX);
return (event.touches && event.touches[0] ?
(event.touches[0].pageX - (event.touches[0].pageX - event.touches[0].clientX)) || event.clientX : event.clientX);
}
return (event.changedTouches && event.changedTouches[0] ? (event.changedTouches[0].pageX - (event.changedTouches[0].pageX - event.changedTouches[0].clientX)) || event.clientX : event.clientX);
return (event.changedTouches && event.changedTouches[0]
? (event.changedTouches[0].pageX - (event.changedTouches[0].pageX - event.changedTouches[0].clientX)) || event.clientX : event.clientX);
};
pointerY = function(event) {
if (event.type !== 'touchend') {
return (event.touches && event.touches[0] ? (event.touches[0].pageY - (event.touches[0].pageY - event.touches[0].clientY)) || event.clientY : event.clientY);
return (event.touches && event.touches[0]
? (event.touches[0].pageY - (event.touches[0].pageY - event.touches[0].clientY)) || event.clientY : event.clientY);
}
return (event.changedTouches && event.changedTouches[0] ? (event.changedTouches[0].pageY - (event.changedTouches[0].pageY - event.changedTouches[0].clientY)) || event.clientY : event.clientY);
return (event.changedTouches && event.changedTouches[0]
? (event.changedTouches[0].pageY - (event.changedTouches[0].pageY - event.changedTouches[0].clientY)) || event.clientY : event.clientY);
};
}

10
dist/all.min.js vendored

File diff suppressed because one or more lines are too long

BIN
dist/all.min.js.gz vendored

Binary file not shown.

View file

@ -187,13 +187,18 @@
while (element && element.parentNode && !firstFixedAncestor) {
element = element.parentNode;
if (element !== fabric.document && fabric.util.getElementStyle(element, 'position') === 'fixed') firstFixedAncestor = element;
if (element !== fabric.document &&
fabric.util.getElementStyle(element, 'position') === 'fixed') {
firstFixedAncestor = element;
}
if (element !== fabric.document && orgElement !== upperCanvasEl && fabric.util.getElementStyle(element, 'position') === 'absolute') {
if (element !== fabric.document &&
orgElement !== upperCanvasEl &&
fabric.util.getElementStyle(element, 'position') === 'absolute') {
scrollLeft = 0;
scrollTop = 0;
}
else if (element === fabric.document && orgElement !== upperCanvasEl) {
else if (element === fabric.document) {
scrollLeft = body.scrollLeft || docElement.scrollLeft || 0;
scrollTop = body.scrollTop || docElement.scrollTop || 0;
}
@ -223,15 +228,19 @@
if (fabric.isTouchSupported) {
pointerX = function(event) {
if (event.type !== 'touchend') {
return (event.touches && event.touches[0] ? (event.touches[0].pageX - (event.touches[0].pageX - event.touches[0].clientX)) || event.clientX : event.clientX);
return (event.touches && event.touches[0] ?
(event.touches[0].pageX - (event.touches[0].pageX - event.touches[0].clientX)) || event.clientX : event.clientX);
}
return (event.changedTouches && event.changedTouches[0] ? (event.changedTouches[0].pageX - (event.changedTouches[0].pageX - event.changedTouches[0].clientX)) || event.clientX : event.clientX);
return (event.changedTouches && event.changedTouches[0]
? (event.changedTouches[0].pageX - (event.changedTouches[0].pageX - event.changedTouches[0].clientX)) || event.clientX : event.clientX);
};
pointerY = function(event) {
if (event.type !== 'touchend') {
return (event.touches && event.touches[0] ? (event.touches[0].pageY - (event.touches[0].pageY - event.touches[0].clientY)) || event.clientY : event.clientY);
return (event.touches && event.touches[0]
? (event.touches[0].pageY - (event.touches[0].pageY - event.touches[0].clientY)) || event.clientY : event.clientY);
}
return (event.changedTouches && event.changedTouches[0] ? (event.changedTouches[0].pageY - (event.changedTouches[0].pageY - event.changedTouches[0].clientY)) || event.clientY : event.clientY);
return (event.changedTouches && event.changedTouches[0]
? (event.changedTouches[0].pageY - (event.changedTouches[0].pageY - event.changedTouches[0].clientY)) || event.clientY : event.clientY);
};
}