Touch events in Meteor

Question

The first thing I started to do with Meteor was start writing a touch-based web application for mobile/tablets. Here's how you reproduce the problem:

First step: create a blank project

meteor create touch_example
cd touch_example
meteor

Second, add these things to the .js file This first bit spits out an alert for touch devices and because they have no console.

Meteor.log = function(input){
    if (typeof console !== 'undefined' && typeof Touch !== "object")
        console.log(input);
    else
        alert(input);
}

And here's the culprit.

Template.touchbox.events = {
    'touchmove' : function (e){
        e.preventDefault();
        Meteor.log('touchy');
    }
};

Last step, change the template around so there's at least one "touchbox" div on the page. IN theory, it should be taking the events. You'll notice that if you change 'touchmove' to 'click' that it works just fine. If you change it to dblclick it will also work fine. Touch events don't do anything.

Some further insight from the meteor docs reveal that event handlers are "wired up with jQuery". So perhaps looking in to a jQuery plugin that recognizes touch while we wait for meteor to be less dependent on jQuery? — Wray Bowling, Apr 13 '12 at 01:01
FYI, iOS has a console which can be enabled in Preferences > Safari > Developer - http://maisonbisson.com/blog/post/14447/step-by-step-turn-on-the-iphone-ipads-web-debugging-console/ — rmarscher, Apr 22 '12 at 19:58

score 3 · Answer 1 · answered Feb 17 '16 at 08:58

This may help. I was looking for a long time to get the click working on mobile for my meteor app. I discovered you can add a comma after your click, and add touchstart

Template.red.events({
'click, touchstart .red': function(event){
            // add function
}

score 2 · Accepted Answer · edited May 23 '17 at 12:22

2

Looks like jQuery as standard doesn't handle these, try using jquery-mobile: http://jquerymobile.com/demos/1.1.0/docs/api/events.html

To add it as a package you might want to look at my other answer here: jQuery-Mobile Meteor sample integration and/or integration guidelines

I found some other help regarding binding touches the same as mouse events however this uses bind and I doubt that will hook up with the live-ui meteor stuff: http://xavi.co/articles/trouble-with-touch-events-jquery

edited May 23 '17 at 12:22

Community

1
1

answered Apr 13 '12 at 18:38

jonathanKingston

1,418
10
16

2

[jQuery Fingers](http://github.com/chetan51/jquery.fingers) is a lightweight jQuery plugin you can use instead of jQuery Mobile that will enable you to listen for touch events, if that's all you really need. – Chetan Apr 15 '12 at 01:53

Touch events in Meteor

2 Answers2

Linked