[OpenLayers-Dev] iPhone javascript events

christopher.schmidt at nokia.com christopher.schmidt at nokia.com
Thu Jul 15 11:25:40 EDT 2010


On Jul 15, 2010, at 11:22 AM, ext Andrew Marks wrote:

> From your comment that I shouldn't modify handlers, controls, or
> Events.js, I am taking that to mean the proper way to go about this
> would be to implement a new handler which handles the touch events
> instead of modifying Drag.js?

I think his comment indicated "It is unfortunate that the design of 
OpenLayers requires you to do this"; I don't think it was a suggestion
that you need to change your approach.

However:

> I'll start then by making a new Handler, MobileDrag, which does
> basically the same thing as drag but using touch events instead of mouse
> events.  I'll probably need a new Control that uses that handler as well?

To me, personally, this sounds like something similar to the right direction.
But I haven't looked at this at all.

-- Chris

> -Andrew
> 
> On 07/14/10 07:51, Tim Schaub wrote:
>> Hey Andrew-
>> 
>> Your efforts on this front are appreciated.  I'd encourage you to work 
>> with a sandbox that is a copy of the trunk.  If you keep your sandbox up 
>> to date with changes from the trunk, it will be easier to eventually 
>> create patches for the trunk.
>> 
>> See the FAQ for details on creating and using a sandbox [1].
>> 
>> What you are experimenting with is very similar to how others have 
>> gotten OpenLayers working on the iPhone.  For inspiration, it may help 
>> to poke around the iOL library:
>> 
>> http://projects.opengeo.org/mobile/browser/IOL/trunk/lib
>> 
>> For OpenLayers 3.0, we'd like to be able to support more (browser) 
>> environments at a deeper level.  In the end, you shouldn't have to 
>> modify handlers, controls, or (especially) Events.js.
>> 
>> Keep us posted on your efforts,
>> Tim
>> 
>> [1] 
>> http://trac.openlayers.org/wiki/FrequentlyAskedQuestions#HowdoIcreatemyownsandboxintheSVNrepository
>> 
>> On 7/13/10 6:01 PM, Andrew Marks wrote:
>> 
>>> Hello,
>>> 
>>>     I would like to start a discussion about the proper inclusion of
>>> special iphone-safari javascript events into OpenLayers.  I am
>>> attempting to add touch pan and zoom support to OpenLayers and while I
>>> am doing it, I might as well do it in a way that is correct and can be
>>> used by others.  I'll talk about what I have done what I plan to do.  I
>>> am working with 2.9.1 (maybe I should work with trunk?)
>>> 
>>> What I have done: (Made touch map panning work)
>>> 
>>> First I added "touchstart", "touchend", "touchmove" to BROWSER_EVENTS in
>>> Events.js
>>> I then had to modify OpenLayers.Events.getMousePosition because the
>>> position information in the touch events is in a different location,
>>> specifically under "targetTouches" or "changedTouches" in the event.
>>> Here is the code, added just before original return statement of
>>> getMousePosition:
>>> 
>>>         if (evt.type.match(/touch/)) {
>>>             var touches = evt.targetTouches;
>>>             if (touches.length<  1) {
>>>                 touches = evt.changedTouches;
>>>             }
>>>             return new OpenLayers.Pixel(
>>>             (touches[0].pageX + this.element.scrolls[0]) -
>>> this.element.offsets[0]
>>>                          - this.element.lefttop[0],
>>>             (touches[0].pageY + this.element.scrolls[1]) -
>>> this.element.offsets[1]
>>>                          - this.element.lefttop[1]
>>>             );
>>>         }
>>>         return new ...
>>> 
>>> I then added three methods to OpenLayers.Handler.Drag:
>>>     touchstart: function (evt) {
>>>         evt.button = 1; //Pretend to be a left click.
>>>         return this.mousedown(evt);
>>>     },
>>> 
>>>     touchmove: function(evt) {
>>>         return this.mousemove(evt);
>>>     },
>>> 
>>>     touchend: function(evt) {
>>>         return this.mouseup(evt);
>>>     },
>>> 
>>> And now touch panning is working.
>>> 
>>> What I plan to do next is look at gesture events, specifically pinching
>>> to zoom in and out.
>>> 
>>> I welcome all feedback to ensure this is done correctly.  If I am going
>>> about it incorrectly, let me know.
>>> 
>>> Thanks for your time,
>>>     Andrew Marks
>>> 
>>> _______________________________________________
>>> Dev mailing list
>>> Dev at openlayers.org
>>> http://openlayers.org/mailman/listinfo/dev
>>> 
>> 
>> 
> 
> _______________________________________________
> Dev mailing list
> Dev at openlayers.org
> http://openlayers.org/mailman/listinfo/dev

Regards,
-- 
Christopher Schmidt
Nokia




More information about the Dev mailing list