Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Handle tap touch actions. #730

Merged
merged 4 commits into from
Aug 10, 2017
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 20 additions & 1 deletion src/mapInteractor.js
Original file line number Diff line number Diff line change
Expand Up @@ -553,7 +553,7 @@ var mapInteractor = function (args) {
return;
}
}
var evtType = /^(.*)(start|end|move)$/.exec(evt.type);
var evtType = /^(.*)(start|end|move|tap)$/.exec(evt.type);
if (!evtType || evtType.length !== 3) {
endIfBound = true;
}
Expand Down Expand Up @@ -603,6 +603,14 @@ var mapInteractor = function (args) {
}
m_touchHandler.lastEvent = null;
}
/* tap events are represented as a mouse left button down and up. */
if (evtType[2] === 'tap' && !m_state.boundDocumentHandlers) {
evt.which = 1;
m_touchHandler.lastEventType = null;
m_this._handleMouseDown(evt);
m_this._handleMouseUp(evt);
m_touchHandler.lastEventType = evtType[2];
}
};

/**
Expand Down Expand Up @@ -681,12 +689,17 @@ var mapInteractor = function (args) {
recog.push([Hammer.Pan, {direction: Hammer.DIRECTION_ALL}]);
touchEvents = touchEvents.concat(['panstart', 'panend', 'panmove']);
}
/* Always handle tap events. Reject double taps. */
recog.push([Hammer.Tap, {event: 'doubletap', taps: 2}]);
recog.push([Hammer.Tap, {event: 'singletap'}, undefined, ['doubletap']]);
touchEvents = touchEvents.concat(['singletap']);
var hammerParams = {recognizers: recog, preventDefault: true};
m_touchHandler = {
manager: new Hammer.Manager($node[0], hammerParams),
touchSupport: m_this.hasTouchSupport(),
lastTime: 0
};
m_touchHandler.manager.get('doubletap').recognizeWith('singletap');
touchEvents.forEach(function (touchEvent) {
m_touchHandler.manager.on(touchEvent, m_this._handleTouch);
});
Expand Down Expand Up @@ -923,6 +936,12 @@ var mapInteractor = function (args) {
if (m_paused) {
return;
}
/* In some scenarios, we get both a tap event and then, somewhat later, a
* set of mousedown/mouseup events. Ignore the spurious down/up set if we
* just handled a tap. */
if (m_touchHandler && m_touchHandler.lastEventType === 'tap' && (new Date()).valueOf() - m_touchHandler.lastTime < 1000) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

worth wrapping this long line? May be we could have a test for long lines - if makes sense we could allow devs to have length of 79/80 or 120 or not :)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't like having a hard limit on line length. It makes it a pain to put things like reference urls in comments. In this case, I'll wrap the line.

return;
}

m_this._getMousePosition(evt);
m_this._getMouseButton(evt);
Expand Down
21 changes: 20 additions & 1 deletion tests/cases/mapInteractor.js
Original file line number Diff line number Diff line change
Expand Up @@ -1694,7 +1694,8 @@ describe('mapInteractor', function () {

it('Test touch interactions', function () {
var map = mockedMap('#mapNode1'),
interactor = geo.mapInteractor({map: map});
interactor = geo.mapInteractor({map: map}),
clickTriggered = 0;

expect(interactor.hasTouchSupport()).toBe(true);

Expand Down Expand Up @@ -1817,6 +1818,24 @@ describe('mapInteractor', function () {
interactor.simulateEvent(
'rotateend', {touch: true, center: {x: 20, y: 20}, scale: 1.3});
expect(map.info.zoom).toBe(2);

// test tap
map.geoOn(geo.event.mouseclick, function () {
clickTriggered += 1;
});
interactor.simulateEvent(
'singletap', {touch: true, center: {x: 20, y: 20}});
expect(clickTriggered).toBe(1);
// don't get a second click event from a non-tap.
interactor.simulateEvent(
'mousedown', {map: {x: 20, y: 20}, button: 'left'});
interactor.simulateEvent(
'mouseup', {map: {x: 20, y: 20}, button: 'left'});
expect(clickTriggered).toBe(1);
// but another tap will trigger another event
interactor.simulateEvent(
'singletap', {touch: true, center: {x: 20, y: 20}});
expect(clickTriggered).toBe(2);
});
});
describe('Optional Dependencies', function () {
Expand Down