[OpenLayers-Commits] r11829 - in trunk/openlayers: examples
lib/OpenLayers/Handler tests/Handler
commits-20090109 at openlayers.org
commits-20090109 at openlayers.org
Thu Mar 31 05:45:52 EDT 2011
Author: sbrunner
Date: 2011-03-31 02:45:50 -0700 (Thu, 31 Mar 2011)
New Revision: 11829
Modified:
trunk/openlayers/examples/mobile.html
trunk/openlayers/examples/mobile.js
trunk/openlayers/lib/OpenLayers/Handler/Feature.js
trunk/openlayers/lib/OpenLayers/Handler/Path.js
trunk/openlayers/tests/Handler/Feature.html
Log:
fix Don't let the browser to zoom or select the map on feature selection, r=erilem (closes #3212)
Modified: trunk/openlayers/examples/mobile.html
===================================================================
--- trunk/openlayers/examples/mobile.html 2011-03-31 09:06:33 UTC (rev 11828)
+++ trunk/openlayers/examples/mobile.html 2011-03-31 09:45:50 UTC (rev 11829)
@@ -7,6 +7,10 @@
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="stylesheet" href="style.mobile.css" type="text/css">
<script src="../lib/OpenLayers.js?mobile"></script>
+ <script src="http://192.168.1.49:8124/debug.js?ns=OpenLayers.Console"></script>
+ <script>
+ OpenLayers.Console.log("start");
+ </script>
<script src="mobile.js"></script>
<style>
html, body {
Modified: trunk/openlayers/examples/mobile.js
===================================================================
--- trunk/openlayers/examples/mobile.js 2011-03-31 09:06:33 UTC (rev 11828)
+++ trunk/openlayers/examples/mobile.js 2011-03-31 09:45:50 UTC (rev 11829)
@@ -1,34 +1,14 @@
// initialize map when page ready
var map;
-// Get rid of address bar on iphone/ipod
-var fixSize = function() {
- window.scrollTo(0,0);
- document.body.style.height = '100%';
- if (!(/(iphone|ipod)/.test(navigator.userAgent.toLowerCase()))) {
- if (document.body.parentNode) {
- document.body.parentNode.style.height = '100%';
- }
- }
-};
-setTimeout(fixSize, 700);
-setTimeout(fixSize, 1500);
+
var init = function () {
// create map
map = new OpenLayers.Map({
div: "map",
theme: null,
- controls: [
- new OpenLayers.Control.Attribution(),
- new OpenLayers.Control.TouchNavigation({
- dragPanOptions: {
- interval: 100,
- enableKinetic: true
- }
- }),
- new OpenLayers.Control.ZoomPanel()
- ],
+ controls: [],
layers: [
new OpenLayers.Layer.OSM("OpenStreetMap", null, {
transitionEffect: 'resize'
Modified: trunk/openlayers/lib/OpenLayers/Handler/Feature.js
===================================================================
--- trunk/openlayers/lib/OpenLayers/Handler/Feature.js 2011-03-31 09:06:33 UTC (rev 11828)
+++ trunk/openlayers/lib/OpenLayers/Handler/Feature.js 2011-03-31 09:45:50 UTC (rev 11829)
@@ -56,6 +56,13 @@
* {<OpenLayers.Pixel>} The location of the last mouseup.
*/
up: null,
+
+ /**
+ * Property: touch
+ * {Boolean} When a touchstart event is fired, touch will be true and all
+ * mouse related listeners will do nothing.
+ */
+ touch: false,
/**
* Property: clickTolerance
@@ -129,10 +136,34 @@
* {Boolean} Let the event propagate.
*/
touchstart: function(evt) {
+ if(!this.touch) {
+ this.touch = true;
+ this.map.events.un({
+ mousedown: this.mousedown,
+ mouseup: this.mouseup,
+ mousemove: this.mousemove,
+ click: this.click,
+ dblclick: this.dblclick,
+ scope: this
+ });
+ }
return this.mousedown(evt);
},
/**
+ * Method: touchmove
+ * Handle touchmove events. We just prevent the browser default behavior,
+ * for Android Webkit not to select text when moving the finger after
+ * selecting a feature.
+ *
+ * Parameters:
+ * evt - {Event}
+ */
+ touchmove: function(evt) {
+ OpenLayers.Event.stop(evt);
+ },
+
+ /**
* Method: mousedown
* Handle mouse down. Stop propagation if a feature is targeted by this
* event (stops map dragging during feature selection).
@@ -251,6 +282,11 @@
this.lastFeature = null;
}
if(this.feature) {
+ if(evt.type === "touchstart") {
+ // stop the event to prevent Android Webkit from
+ // "flashing" the map div
+ OpenLayers.Event.stop(evt);
+ }
var inNew = (this.feature != this.lastFeature);
if(this.geometryTypeMatches(this.feature)) {
// in to a feature
@@ -349,6 +385,7 @@
this.lastFeature = null;
this.down = null;
this.up = null;
+ this.touch = false;
this.map.events.un({
"removelayer": this.handleMapEvents,
"changelayer": this.handleMapEvents,
Modified: trunk/openlayers/lib/OpenLayers/Handler/Path.js
===================================================================
--- trunk/openlayers/lib/OpenLayers/Handler/Path.js 2011-03-31 09:06:33 UTC (rev 11828)
+++ trunk/openlayers/lib/OpenLayers/Handler/Path.js 2011-03-31 09:45:50 UTC (rev 11829)
@@ -60,6 +60,12 @@
timerId: null,
/**
+ * Propery: stopTouchEnd
+ * {Boolean} Stop event propagation of the next touch up.
+ */
+ stopTouchEnd: false,
+
+ /**
* Constructor: OpenLayers.Handler.Path
* Create a new path hander
*
@@ -244,6 +250,8 @@
// double-tap, finalize the geometry
this.lastTouchPx = evt.xy; // for up() to detect dblclick and do nothing
this.finishGeometry();
+ this.stopTouchEnd = true;
+ OpenLayers.Event.stop(evt);
window.clearTimeout(this.timerId);
this.timerId = null;
return false;
@@ -259,6 +267,27 @@
return OpenLayers.Handler.Point.prototype.touchstart.call(this, evt);
}
},
+
+ /**
+ * Method: touchend
+ * Handle touchend.
+ *
+ * Parameters:
+ * evt - {Event} The browser event
+ *
+ * Returns:
+ * {Boolean} Allow event propagation
+ */
+ touchend: function(evt) {
+ evt.xy = this.lastTouchPx;
+ if (this.stopTouchEnd) {
+ // don't zoom on the page at feature end
+ OpenLayers.Event.stop(evt);
+ this.stopTouchEnd = false;
+ return false;
+ }
+ return this.up(evt);
+ },
/**
* Method: mousedown
@@ -330,6 +359,8 @@
} else {
if (this.passesTolerance(this.lastDown, evt.xy, this.pixelTolerance)) {
if (this.touch) {
+ // don't allow the browser to zoom
+ OpenLayers.Event.stop(evt);
this.modifyFeature(evt.xy);
}
if(this.lastUp == null && this.persist) {
@@ -370,6 +401,9 @@
* {Boolean} Allow event propagation
*/
dblclick: function(evt) {
+ if (this.touch) {
+ return;
+ }
if(!this.freehandMode(evt)) {
this.finishGeometry();
}
Modified: trunk/openlayers/tests/Handler/Feature.html
===================================================================
--- trunk/openlayers/tests/Handler/Feature.html 2011-03-31 09:06:33 UTC (rev 11828)
+++ trunk/openlayers/tests/Handler/Feature.html 2011-03-31 09:45:50 UTC (rev 11829)
@@ -53,7 +53,7 @@
}
function test_events(t) {
- t.plan(30);
+ t.plan(35);
var map = new OpenLayers.Map('map');
var control = new OpenLayers.Control();
@@ -64,8 +64,8 @@
// list below events that should be handled (events) and those
// that should not be handled (nonevents) by the handler
- var events = ["mousedown", "mouseup", "mousemove", "click", "dblclick", "touchstart"];
- var nonevents = ["mouseout", "resize", "focus", "blur"];
+ var events = ["mousedown", "mouseup", "mousemove", "click", "dblclick", "touchstart", "touchmove"];
+ var nonevents = ["mouseout", "resize", "focus", "blur", "touchend"];
map.events.registerPriority = function(type, obj, func) {
var output = func();
// Don't listen for setEvent handlers (#902)
@@ -255,6 +255,82 @@
map.events.triggerEvent('touchstart', evtPx);
}
+ function test_touchstart(t) {
+ // a test to verify that the touchstart function does
+ // unregister the mouse listeners when it's called the
+ // first time
+
+ t.plan(4);
+
+ // set up
+
+ var map = new OpenLayers.Map('map', {controls: []});
+ var control = new OpenLayers.Control();
+ map.addControl(control);
+ var layer = new OpenLayers.Layer();
+ map.addLayer(layer);
+
+ var handler = new OpenLayers.Handler.Feature(control, layer, {});
+ handler.mousedown = function() {}; // mock mousedown
+ handler.activate();
+
+ function allRegistered() {
+ var eventTypes = ['mousedown', 'mouseup', 'mousemove', 'click', 'dblclick'],
+ eventType,
+ listeners,
+ listener,
+ flag;
+ for(var i=0, ilen=eventTypes.length; i<ilen; i++) {
+ flag = false;
+ eventType = eventTypes[i];
+ listeners = map.events.listeners[eventType];
+ for(var j=0, jlen=listeners.length; j<jlen; j++) {
+ listener = listeners[j];
+ if(listener.func === handler[eventType] && listener.obj === handler) {
+ flag = true;
+ break;
+ }
+ }
+ if(!flag) {
+ return false;
+ }
+ }
+ return true;
+ }
+
+ function noneRegistered() {
+ var eventTypes = ['mousedown', 'mouseup', 'mousemove', 'click', 'dblclick'],
+ eventType,
+ listeners,
+ listener;
+ for(var i=0, ilen=eventTypes.length; i<ilen; i++) {
+ eventType = eventTypes[i];
+ listeners = map.events.listeners[eventType];
+ for(var j=0, jlen=listeners.length; j<jlen; j++) {
+ listener = listeners[j];
+ if(listener.func === handler[eventType] && listener.obj === handler) {
+ return false;
+ }
+ }
+ }
+ return true;
+ }
+
+ // test
+
+ t.ok(allRegistered(), 'mouse listeners are registered');
+ handler.touchstart({xy: new OpenLayers.Pixel(0, 0)});
+ t.ok(noneRegistered(), 'mouse listeners are unregistered');
+ t.ok(handler.touch, 'handler.touch is set');
+
+ handler.deactivate();
+ t.ok(!handler.touch, 'handler.touch is not set');
+
+ // tear down
+
+ map.destroy();
+ }
+
function test_deactivate(t) {
t.plan(3);
var map = new OpenLayers.Map('map');
More information about the Commits
mailing list