Select to view content in your preferred language

Map click event not firing on android when using dojox.mobile.View

5816
13
Jump to solution
09-24-2015 10:22 AM
BillDaigle
Frequent Contributor

I am trying to use the dojox.mobile framework to build a mobile friendly app.  However, as soon as I add a require for "dojox/mobile/View", the map stops registering click events reliably on Android devices.  It seems like it is an API issue, because if I roll back to API 3.10, it works fine.

Here is a jsFiddle that demonstrates the problem: http://jsfiddle.net/f1wt0yjq/

In order to see the problem on a desktop, you will need to view it in Android device using Chromes developer tools.  When you click the map using an IOS device or windows, you get a "map clicked" in the console.  The same is not when using an android device.

0 Kudos
13 Replies
ChrisSmith7
Honored Contributor

Bill,

I got it to work setting my own event:

Edit fiddle - JSFiddle

BillDaigle
Frequent Contributor

I like the concept, but it seems like a slippery slope when it comes to implementation.  I need it to behave like a map or feature layer click event. I would need to fetch the underlying graphics and code for the difference between a short click, long click, pan, etc.  Doable, but a potential maintenance nightmare.  I'm curious why this stopped working at version 3.11.  There was a move to Dojo 1.10 at this point.  I doesn't look like there is any functional difference between the the 1.9 and 1.10 version of dojo.mobile.View, so I suspect the issue is in the Javascript API.

I guess I'm leaning towards rolling back to version JSAPI 3.10 or trying a different mobile framework.  

0 Kudos
BillDaigle
Frequent Contributor

Ok, I think I tracked it down to the root of the problem.  It appears to be caused by the following lines of code in "dojox/mobile/common", which is called by "dojox/mobile/View".

    // tell dojo/touch to generate synthetic clicks immediately
    // and regardless of preventDefault() calls on touch events
    win.doc.dojoClick = true;
    /// ... but let user disable this by removing dojoClick from the document
    if(has("touch")){
        // Do we need to send synthetic clicks when preventDefault() is called on touch events?
        // This is normally true on anything except Android 4.1+ and IE10+, but users reported
        // exceptions like Galaxy Note 2. So let's use a has("clicks-prevented") flag, and let
        // applications override it through data-dojo-config="has:{'clicks-prevented':true}" if needed.
        has.add("clicks-prevented", !(has("android") >= 4.1 || (has("ie") === 10) || (!has("ie") && has("trident") > 6)));
        if(has("clicks-prevented")){
            dm._sendClick = function(target, e){
                // dojo/touch will send a click if dojoClick is set, so don't do it again.
                for(var node = target; node; node = node.parentNode){
                    if(node.dojoClick){
                        return;
                    }
                }
                var ev = win.doc.createEvent("MouseEvents"); 
                ev.initMouseEvent("click", true, true, win.global, 1, e.screenX, e.screenY, e.clientX, e.clientY); 
                target.dispatchEvent(ev);
            };
        }
    }

Looks like I might be able to override it for the map or feature layer.  Or maybe the whole page.  Not sure.

0 Kudos
BillDaigle
Frequent Contributor

Alright.  Finally got it working.  The key is setting window.document.dojoClick to false.

Here is a jsfiddle that seems to work on all emulated devices.

http://jsfiddle.net/8m8y6gea/8/

0 Kudos