javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(scroll): Allow scrolling when touchstart target is an input, #1078

Browse Source
This commit is contained in:
Adam Bradley
2014-04-08 14:28:11 -05:00
parent d00aaa5945
commit 8af018b1fa
3 changed files with 105 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
js/ext/angular/test/service/ionicTap.unit.js
View File

@@ -290,4 +290,99 @@ describe('Ionic Tap', function() {
expect( ionic.tap.ignoreTapInspect(e) ).toEqual(false);
});
it('Should not prevent scrolling', function() {
var target = document.createElement('div');
var e = {
target: target
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(false);
});
it('Should prevent scrolling because the event has defaultedPrevented', function() {
var target = document.createElement('div');
var e = {
target: target,
defaultPrevented: true
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(true);
});
it('Should not prevent scrolling if the target was an input or textarea', function() {
var target = document.createElement('input');
var e = {
target: target
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(false);
});
it('Should prevent scrolling if the target was an input or textarea, and the target is the same as the active element', function() {
var target = document.createElement('input');
ionic.tap.activeElement(target);
var e = {
target: target
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(true);
});
it('Should not prevent scrolling if the target isContentEditable', function() {
var target = document.createElement('div');
target.isContentEditable = true;
var e = {
target: target
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(false);
});
it('Should prevent scrolling if the target has dataset.preventScroll', function() {
var target = document.createElement('div');
target.setAttribute('data-prevent-scroll', 'true');
var e = {
target: target
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(true);
target = document.createElement('div');
target.dataset.preventScroll = true;
e = {
target: target
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(true);
target = document.createElement('div');
target.dataset.preventScroll = 'true';
e = {
target: target
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(true);
});
it('Should prevent scrolling if the browser doesnt support dataset but target has data-prevent-default attribute', function() {
var target = {
tagName: 'div',
getAttribute: function(val) {
if(val === 'data-prevent-default') {
return 'true';
}
}
}
var e = {
target: target
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(true);
});
it('Should prevent scrolling if the target is an object or embed', function() {
var target = document.createElement('object');
var e = {
target: target
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(true);
target = document.createElement('embed');
e = {
target: target
};
expect( ionic.tap.ignoreScrollStart(e) ).toEqual(true);
});
});

8
js/utils/tap.js
View File

@@ -263,6 +263,14 @@
reset: function() {
tapCoordinates = {};
startCoordinates = {};
},
ignoreScrollStart: function(e) {
return (e.defaultPrevented) || // defaultPrevented has been assigned by another component handling the event
(e.target.tagName.match(/input|textarea/i) && ionic.tap.activeElement() === e.target) || // target is the active element, so its a second tap to select input text
(e.target.isContentEditable) ||
(e.target.dataset ? e.target.dataset.preventScroll : e.target.getAttribute('data-prevent-default')) == 'true' || // manually set within an elements attributes
(!!e.target.tagName.match(/object|embed/i)); // flash/movie/object touches should not try to scroll
}
};

10
js/views/scrollView.js
View File

@@ -616,16 +616,10 @@ ionic.views.Scroll = ionic.views.View.inherit({
e.stopPropagation();
});
function shouldIgnorePress(e) {
return e.target.tagName.match(/input|textarea|select|object|embed/i) ||
e.target.isContentEditable ||
(e.target.dataset ? e.target.dataset.preventScroll : e.target.getAttribute('data-prevent-default') == 'true');
}
if ('ontouchstart' in window) {
container.addEventListener("touchstart", function(e) {
if (e.defaultPrevented || shouldIgnorePress(e)) {
if ( ionic.tap.ignoreScrollStart(e) ) {
return;
}
self.doTouchStart(e.touches, e.timeStamp);
@@ -648,7 +642,7 @@ ionic.views.Scroll = ionic.views.View.inherit({
var mousedown = false;
container.addEventListener("mousedown", function(e) {
if (e.defaultPrevented || shouldIgnorePress(e)) {
if ( ionic.tap.ignoreScrollStart(e) ) {
return;
}
self.doTouchStart([{