Making it so controls that register for mousedown and mouseup work in touch environments. r=crschmidt (closes #3075)

git-svn-id: http://svn.openlayers.org/trunk/openlayers@11207 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
Tim Schaub
2011-02-21 17:31:19 +00:00
parent 3066b50956
commit 849426f845
3 changed files with 36 additions and 14 deletions

View File

@@ -72,6 +72,12 @@ OpenLayers.Control.PanZoomBar = OpenLayers.Class(OpenLayers.Control.PanZoom, {
*/
mouseDragStart: null,
/**
* Property: deltaY
* {Number} The cumulative vertical pixel offset during a zoom bar drag.
*/
deltaY: null,
/**
* Property: zoomStart
* {<OpenLayers.Pixel>}
@@ -186,6 +192,9 @@ OpenLayers.Control.PanZoomBar = OpenLayers.Class(OpenLayers.Control.PanZoom, {
this.sliderEvents = new OpenLayers.Events(this, slider, null, true,
{includeXY: true});
this.sliderEvents.on({
"touchstart": this.zoomBarDown,
"touchmove": this.zoomBarDrag,
"touchend": this.zoomBarUp,
"mousedown": this.zoomBarDown,
"mousemove": this.zoomBarDrag,
"mouseup": this.zoomBarUp,
@@ -219,6 +228,7 @@ OpenLayers.Control.PanZoomBar = OpenLayers.Class(OpenLayers.Control.PanZoom, {
this.divEvents = new OpenLayers.Events(this, div, null, true,
{includeXY: true});
this.divEvents.on({
"touchmove": this.passEventToSlider,
"mousedown": this.divClick,
"mousemove": this.passEventToSlider,
"dblclick": this.doubleClick,
@@ -242,6 +252,7 @@ OpenLayers.Control.PanZoomBar = OpenLayers.Class(OpenLayers.Control.PanZoom, {
*/
_removeZoomBar: function() {
this.sliderEvents.un({
"touchmove": this.zoomBarDrag,
"mousedown": this.zoomBarDown,
"mousemove": this.zoomBarDrag,
"mouseup": this.zoomBarUp,
@@ -251,6 +262,7 @@ OpenLayers.Control.PanZoomBar = OpenLayers.Class(OpenLayers.Control.PanZoom, {
this.sliderEvents.destroy();
this.divEvents.un({
"touchmove": this.passEventToSlider,
"mousedown": this.divClick,
"mousemove": this.passEventToSlider,
"dblclick": this.doubleClick,
@@ -305,10 +317,11 @@ OpenLayers.Control.PanZoomBar = OpenLayers.Class(OpenLayers.Control.PanZoom, {
* evt - {<OpenLayers.Event>}
*/
zoomBarDown:function(evt) {
if (!OpenLayers.Event.isLeftClick(evt)) {
if (!OpenLayers.Event.isLeftClick(evt) && !OpenLayers.Event.isSingleTouch(evt)) {
return;
}
this.map.events.on({
"touchmove": this.passEventToSlider,
"mousemove": this.passEventToSlider,
"mouseup": this.passEventToSlider,
scope: this
@@ -341,6 +354,8 @@ OpenLayers.Control.PanZoomBar = OpenLayers.Class(OpenLayers.Control.PanZoom, {
this.slider.style.top = newTop+"px";
this.mouseDragStart = evt.xy.clone();
}
// set cumulative displacement
this.deltaY = this.zoomStart.y - evt.xy.y;
OpenLayers.Event.stop(evt);
}
},
@@ -354,28 +369,29 @@ OpenLayers.Control.PanZoomBar = OpenLayers.Class(OpenLayers.Control.PanZoom, {
* evt - {<OpenLayers.Event>}
*/
zoomBarUp:function(evt) {
if (!OpenLayers.Event.isLeftClick(evt)) {
if (!OpenLayers.Event.isLeftClick(evt) && evt.type !== "touchend") {
return;
}
if (this.mouseDragStart) {
this.div.style.cursor="";
this.map.events.un({
"touchmove": this.passEventToSlider,
"mouseup": this.passEventToSlider,
"mousemove": this.passEventToSlider,
scope: this
});
var deltaY = this.zoomStart.y - evt.xy.y;
var zoomLevel = this.map.zoom;
if (!this.forceFixedZoomLevel && this.map.fractionalZoom) {
zoomLevel += deltaY/this.zoomStopHeight;
zoomLevel += this.deltaY/this.zoomStopHeight;
zoomLevel = Math.min(Math.max(zoomLevel, 0),
this.map.getNumZoomLevels() - 1);
} else {
zoomLevel += Math.round(deltaY/this.zoomStopHeight);
zoomLevel += Math.round(this.deltaY/this.zoomStopHeight);
}
this.map.zoomTo(zoomLevel);
this.mouseDragStart = null;
this.zoomStart = null;
this.deltaY = 0;
OpenLayers.Event.stop(evt);
}
},