diff --git a/examples/mobile-scroll.html b/examples/mobile-scroll.html new file mode 100644 index 0000000000..b209532fd6 --- /dev/null +++ b/examples/mobile-scroll.html @@ -0,0 +1,55 @@ + + + + OpenLayers Mobile + + + + + + + + + +

Scroll down to the map

+
+ mobile +
+

+ A basic full-screen map for mobile devices. +

+
+ + + diff --git a/examples/mobile-scroll.js b/examples/mobile-scroll.js new file mode 100644 index 0000000000..7e711f7c1a --- /dev/null +++ b/examples/mobile-scroll.js @@ -0,0 +1,40 @@ +// initialize map when page ready +var map; + +var init = function () { + // create map + console.log("Initialize MAP!!!"); + map = new OpenLayers.Map({ + div: "map", + theme: null, + controls: [ + new OpenLayers.Control.Attribution(), + new OpenLayers.Control.TouchNavigation({ + dragPanOptions: { + enableKinetic: true + }, + defaultClick: addPin + }), + new OpenLayers.Control.Zoom() + ], + layers: [ + new OpenLayers.Layer.OSM("OpenStreetMap", null, { + transitionEffect: 'resize' + }) + ], + center: new OpenLayers.LonLat(742000, 5861000), + zoom: 3 + }); + var markers = new OpenLayers.Layer.Markers( "Markers" ); + map.addLayer(markers); + + var size = new OpenLayers.Size(21,25); + var offset = new OpenLayers.Pixel(-(size.w/2), -size.h); + var icon = new OpenLayers.Icon('http://www.openlayers.org/dev/img/marker.png',size,offset); + + + function addPin(e) { + var pointMapProj = map.getLonLatFromViewPortPx(e.xy); + markers.addMarker(new OpenLayers.Marker(pointMapProj,icon)); + } +}; diff --git a/lib/OpenLayers/Events.js b/lib/OpenLayers/Events.js index fa6b8da7f8..b055965e84 100644 --- a/lib/OpenLayers/Events.js +++ b/lib/OpenLayers/Events.js @@ -903,7 +903,7 @@ OpenLayers.Events = OpenLayers.Class({ var num = touches.length; var touch; for (var i=0; i Math.floor(evt.pageY) || + evt.pageX === 0 && Math.floor(x) > Math.floor(evt.pageX)) { + // iOS4 include scroll offset in clientX/Y + x = x - winPageX; + y = y - winPageY; + } else if (y < (evt.pageY - winPageY) || x < (evt.pageX - winPageX) ) { + // Some Android browsers have totally bogus values for clientX/Y + // when scrolling/zooming a page + x = evt.pageX - winPageX; + y = evt.pageY - winPageY; + } + + evt.olClientX = x; + evt.olClientY = y; + + return { + clientX: x, + clientY: y + }; + }, + /** * APIMethod: clearMouseCache * Clear cached data about the mouse position. This should be called any @@ -925,17 +965,7 @@ OpenLayers.Events = OpenLayers.Class({ clearMouseCache: function() { this.element.scrolls = null; this.element.lefttop = null; - // OpenLayers.Util.pagePosition needs to use - // element.getBoundingClientRect to correctly calculate the offsets - // for the iPhone, but once the page is scrolled, getBoundingClientRect - // returns incorrect offsets. So our best bet is to not invalidate the - // offsets once we have them, and hope that the page was not scrolled - // when we did the initial calculation. - var body = document.body; - if (body && !((body.scrollTop != 0 || body.scrollLeft != 0) && - navigator.userAgent.match(/iPhone/i))) { - this.element.offsets = null; - } + this.element.offsets = null; }, /** @@ -959,8 +989,8 @@ OpenLayers.Events = OpenLayers.Class({ if (!this.element.scrolls) { var viewportElement = OpenLayers.Util.getViewportElement(); this.element.scrolls = [ - viewportElement.scrollLeft, - viewportElement.scrollTop + window.pageXOffset || viewportElement.scrollLeft, + window.pageYOffset || viewportElement.scrollTop ]; } diff --git a/lib/OpenLayers/Handler/Click.js b/lib/OpenLayers/Handler/Click.js index 37d15c67a4..ca6b6b45f4 100644 --- a/lib/OpenLayers/Handler/Click.js +++ b/lib/OpenLayers/Handler/Click.js @@ -495,8 +495,8 @@ OpenLayers.Handler.Click = OpenLayers.Class(OpenLayers.Handler, { for (var i=0; i +