[OpenLayers-Dev] iPhone javascript events

Andrew Marks atm at amrx.net
Thu Jul 15 11:22:13 EDT 2010


>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'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?

-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
>>     
>
>   




More information about the Dev mailing list