From c5ba5b0456a711d157e317f220e9c739226e7f50 Mon Sep 17 00:00:00 2001 From: Joar Wandborg Date: Tue, 10 Jan 2012 01:54:37 +0100 Subject: Installed leaflet in extlib --- extlib/leaflet/src/handler/DoubleClickZoom.js | 21 +++++++ extlib/leaflet/src/handler/Handler.js | 13 ++++ extlib/leaflet/src/handler/MapDrag.js | 44 ++++++++++++++ extlib/leaflet/src/handler/MarkerDrag.js | 54 +++++++++++++++++ extlib/leaflet/src/handler/ScrollWheelZoom.js | 50 +++++++++++++++ extlib/leaflet/src/handler/ShiftDragZoom.js | 79 ++++++++++++++++++++++++ extlib/leaflet/src/handler/TouchZoom.js | 87 +++++++++++++++++++++++++++ 7 files changed, 348 insertions(+) create mode 100644 extlib/leaflet/src/handler/DoubleClickZoom.js create mode 100644 extlib/leaflet/src/handler/Handler.js create mode 100644 extlib/leaflet/src/handler/MapDrag.js create mode 100644 extlib/leaflet/src/handler/MarkerDrag.js create mode 100644 extlib/leaflet/src/handler/ScrollWheelZoom.js create mode 100644 extlib/leaflet/src/handler/ShiftDragZoom.js create mode 100644 extlib/leaflet/src/handler/TouchZoom.js (limited to 'extlib/leaflet/src/handler') diff --git a/extlib/leaflet/src/handler/DoubleClickZoom.js b/extlib/leaflet/src/handler/DoubleClickZoom.js new file mode 100644 index 00000000..121a5e20 --- /dev/null +++ b/extlib/leaflet/src/handler/DoubleClickZoom.js @@ -0,0 +1,21 @@ +/* + * L.Handler.DoubleClickZoom is used internally by L.Map to add double-click zooming. + */ + +L.Handler.DoubleClickZoom = L.Handler.extend({ + enable: function() { + if (this._enabled) { return; } + this._map.on('dblclick', this._onDoubleClick, this._map); + this._enabled = true; + }, + + disable: function() { + if (!this._enabled) { return; } + this._map.off('dblclick', this._onDoubleClick, this._map); + this._enabled = false; + }, + + _onDoubleClick: function(e) { + this.setView(e.latlng, this._zoom + 1); + } +}); \ No newline at end of file diff --git a/extlib/leaflet/src/handler/Handler.js b/extlib/leaflet/src/handler/Handler.js new file mode 100644 index 00000000..c38a6b6a --- /dev/null +++ b/extlib/leaflet/src/handler/Handler.js @@ -0,0 +1,13 @@ +/* + * L.Handler classes are used internally to inject interaction features to classes like Map and Marker. + */ + +L.Handler = L.Class.extend({ + initialize: function(map) { + this._map = map; + }, + + enabled: function() { + return !!this._enabled; + } +}); \ No newline at end of file diff --git a/extlib/leaflet/src/handler/MapDrag.js b/extlib/leaflet/src/handler/MapDrag.js new file mode 100644 index 00000000..1c407269 --- /dev/null +++ b/extlib/leaflet/src/handler/MapDrag.js @@ -0,0 +1,44 @@ +/* + * L.Handler.MapDrag is used internally by L.Map to make the map draggable. + */ + +L.Handler.MapDrag = L.Handler.extend({ + + enable: function() { + if (this._enabled) { return; } + if (!this._draggable) { + this._draggable = new L.Draggable(this._map._mapPane, this._map._container); + + this._draggable.on('dragstart', this._onDragStart, this); + this._draggable.on('drag', this._onDrag, this); + this._draggable.on('dragend', this._onDragEnd, this); + } + this._draggable.enable(); + this._enabled = true; + }, + + disable: function() { + if (!this._enabled) { return; } + this._draggable.disable(); + this._enabled = false; + }, + + moved: function() { + return this._draggable._moved; + }, + + _onDragStart: function() { + this._map.fire('movestart'); + this._map.fire('dragstart'); + }, + + _onDrag: function() { + this._map.fire('move'); + this._map.fire('drag'); + }, + + _onDragEnd: function() { + this._map.fire('moveend'); + this._map.fire('dragend'); + } +}); diff --git a/extlib/leaflet/src/handler/MarkerDrag.js b/extlib/leaflet/src/handler/MarkerDrag.js new file mode 100644 index 00000000..8e884d50 --- /dev/null +++ b/extlib/leaflet/src/handler/MarkerDrag.js @@ -0,0 +1,54 @@ +/* + * L.Handler.MarkerDrag is used internally by L.Marker to make the markers draggable. + */ + +L.Handler.MarkerDrag = L.Handler.extend({ + initialize: function(marker) { + this._marker = marker; + }, + + enable: function() { + if (this._enabled) { return; } + if (!this._draggable) { + this._draggable = new L.Draggable(this._marker._icon, this._marker._icon); + this._draggable.on('dragstart', this._onDragStart, this); + this._draggable.on('drag', this._onDrag, this); + this._draggable.on('dragend', this._onDragEnd, this); + } + this._draggable.enable(); + this._enabled = true; + }, + + disable: function() { + if (!this._enabled) { return; } + this._draggable.disable(); + this._enabled = false; + }, + + moved: function() { + return this._draggable && this._draggable._moved; + }, + + _onDragStart: function(e) { + this._marker.closePopup(); + + this._marker.fire('movestart'); + this._marker.fire('dragstart'); + }, + + _onDrag: function(e) { + // update shadow position + var iconPos = L.DomUtil.getPosition(this._marker._icon); + L.DomUtil.setPosition(this._marker._shadow, iconPos); + + this._marker._latlng = this._marker._map.layerPointToLatLng(iconPos); + + this._marker.fire('move'); + this._marker.fire('drag'); + }, + + _onDragEnd: function() { + this._marker.fire('moveend'); + this._marker.fire('dragend'); + } +}); diff --git a/extlib/leaflet/src/handler/ScrollWheelZoom.js b/extlib/leaflet/src/handler/ScrollWheelZoom.js new file mode 100644 index 00000000..dc877e17 --- /dev/null +++ b/extlib/leaflet/src/handler/ScrollWheelZoom.js @@ -0,0 +1,50 @@ +/* + * L.Handler.ScrollWheelZoom is used internally by L.Map to enable mouse scroll wheel zooming on the map. + */ + +L.Handler.ScrollWheelZoom = L.Handler.extend({ + enable: function() { + if (this._enabled) { return; } + L.DomEvent.addListener(this._map._container, 'mousewheel', this._onWheelScroll, this); + this._delta = 0; + this._enabled = true; + }, + + disable: function() { + if (!this._enabled) { return; } + L.DomEvent.removeListener(this._map._container, 'mousewheel', this._onWheelScroll); + this._enabled = false; + }, + + _onWheelScroll: function(e) { + this._delta += L.DomEvent.getWheelDelta(e); + this._lastMousePos = this._map.mouseEventToContainerPoint(e); + + clearTimeout(this._timer); + this._timer = setTimeout(L.Util.bind(this._performZoom, this), 50); + + L.DomEvent.preventDefault(e); + }, + + _performZoom: function() { + var delta = Math.round(this._delta); + this._delta = 0; + + if (!delta) { return; } + + var center = this._getCenterForScrollWheelZoom(this._lastMousePos, delta), + zoom = this._map.getZoom() + delta; + + if (this._map._limitZoom(zoom) == this._map._zoom) { return; } + + this._map.setView(center, zoom); + }, + + _getCenterForScrollWheelZoom: function(mousePos, delta) { + var centerPoint = this._map.getPixelBounds().getCenter(), + viewHalf = this._map.getSize().divideBy(2), + centerOffset = mousePos.subtract(viewHalf).multiplyBy(1 - Math.pow(2, -delta)), + newCenterPoint = centerPoint.add(centerOffset); + return this._map.unproject(newCenterPoint, this._map._zoom, true); + } +}); \ No newline at end of file diff --git a/extlib/leaflet/src/handler/ShiftDragZoom.js b/extlib/leaflet/src/handler/ShiftDragZoom.js new file mode 100644 index 00000000..ba216109 --- /dev/null +++ b/extlib/leaflet/src/handler/ShiftDragZoom.js @@ -0,0 +1,79 @@ +/* + * L.Handler.ShiftDragZoom is used internally by L.Map to add shift-drag zoom (zoom to a selected bounding box). + */ + +L.Handler.ShiftDragZoom = L.Handler.extend({ + initialize: function(map) { + this._map = map; + this._container = map._container; + this._pane = map._panes.overlayPane; + }, + + enable: function() { + if (this._enabled) { return; } + + L.DomEvent.addListener(this._container, 'mousedown', this._onMouseDown, this); + + this._enabled = true; + }, + + disable: function() { + if (!this._enabled) { return; } + + L.DomEvent.removeListener(this._container, 'mousedown', this._onMouseDown); + + this._enabled = false; + }, + + _onMouseDown: function(e) { + if (!e.shiftKey || ((e.which != 1) && (e.button != 1))) { return false; } + + L.DomUtil.disableTextSelection(); + + this._startLayerPoint = this._map.mouseEventToLayerPoint(e); + + this._box = L.DomUtil.create('div', 'leaflet-zoom-box', this._pane); + L.DomUtil.setPosition(this._box, this._startLayerPoint); + + //TODO move cursor to styles + this._container.style.cursor = 'crosshair'; + + L.DomEvent.addListener(document, 'mousemove', this._onMouseMove, this); + L.DomEvent.addListener(document, 'mouseup', this._onMouseUp, this); + + L.DomEvent.preventDefault(e); + }, + + _onMouseMove: function(e) { + var layerPoint = this._map.mouseEventToLayerPoint(e), + dx = layerPoint.x - this._startLayerPoint.x, + dy = layerPoint.y - this._startLayerPoint.y; + + var newX = Math.min(layerPoint.x, this._startLayerPoint.x), + newY = Math.min(layerPoint.y, this._startLayerPoint.y), + newPos = new L.Point(newX, newY); + + L.DomUtil.setPosition(this._box, newPos); + + this._box.style.width = (Math.abs(dx) - 4) + 'px'; + this._box.style.height = (Math.abs(dy) - 4) + 'px'; + }, + + _onMouseUp: function(e) { + this._pane.removeChild(this._box); + this._container.style.cursor = ''; + + L.DomUtil.enableTextSelection(); + + L.DomEvent.removeListener(document, 'mousemove', this._onMouseMove); + L.DomEvent.removeListener(document, 'mouseup', this._onMouseUp); + + var layerPoint = this._map.mouseEventToLayerPoint(e); + + var bounds = new L.LatLngBounds( + this._map.layerPointToLatLng(this._startLayerPoint), + this._map.layerPointToLatLng(layerPoint)); + + this._map.fitBounds(bounds); + } +}); \ No newline at end of file diff --git a/extlib/leaflet/src/handler/TouchZoom.js b/extlib/leaflet/src/handler/TouchZoom.js new file mode 100644 index 00000000..cc2ec73f --- /dev/null +++ b/extlib/leaflet/src/handler/TouchZoom.js @@ -0,0 +1,87 @@ +/* + * L.Handler.TouchZoom is used internally by L.Map to add touch-zooming on Webkit-powered mobile browsers. + */ + +L.Handler.TouchZoom = L.Handler.extend({ + enable: function() { + if (!L.Browser.mobileWebkit || this._enabled) { return; } + L.DomEvent.addListener(this._map._container, 'touchstart', this._onTouchStart, this); + this._enabled = true; + }, + + disable: function() { + if (!this._enabled) { return; } + L.DomEvent.removeListener(this._map._container, 'touchstart', this._onTouchStart, this); + this._enabled = false; + }, + + _onTouchStart: function(e) { + if (!e.touches || e.touches.length != 2 || this._map._animatingZoom) { return; } + + var p1 = this._map.mouseEventToLayerPoint(e.touches[0]), + p2 = this._map.mouseEventToLayerPoint(e.touches[1]), + viewCenter = this._map.containerPointToLayerPoint(this._map.getSize().divideBy(2)); + + this._startCenter = p1.add(p2).divideBy(2, true); + this._startDist = p1.distanceTo(p2); + //this._startTransform = this._map._mapPane.style.webkitTransform; + + this._moved = false; + this._zooming = true; + + this._centerOffset = viewCenter.subtract(this._startCenter); + + L.DomEvent.addListener(document, 'touchmove', this._onTouchMove, this); + L.DomEvent.addListener(document, 'touchend', this._onTouchEnd, this); + + L.DomEvent.preventDefault(e); + }, + + _onTouchMove: function(e) { + if (!e.touches || e.touches.length != 2) { return; } + + if (!this._moved) { + this._map._mapPane.className += ' leaflet-zoom-anim'; + this._map._prepareTileBg(); + this._moved = true; + } + + var p1 = this._map.mouseEventToLayerPoint(e.touches[0]), + p2 = this._map.mouseEventToLayerPoint(e.touches[1]); + + this._scale = p1.distanceTo(p2) / this._startDist; + this._delta = p1.add(p2).divideBy(2, true).subtract(this._startCenter); + + /* + * Used 2 translates instead of transform-origin because of a very strange bug - + * it didn't count the origin on the first touch-zoom but worked correctly afterwards + */ + this._map._tileBg.style.webkitTransform = [ + L.DomUtil.getTranslateString(this._delta), + L.DomUtil.getScaleString(this._scale, this._startCenter) + ].join(" "); + + L.DomEvent.preventDefault(e); + }, + + _onTouchEnd: function(e) { + if (!this._moved || !this._zooming) { return; } + this._zooming = false; + + var oldZoom = this._map.getZoom(), + floatZoomDelta = Math.log(this._scale)/Math.LN2, + roundZoomDelta = (floatZoomDelta > 0 ? Math.ceil(floatZoomDelta) : Math.floor(floatZoomDelta)), + zoom = this._map._limitZoom(oldZoom + roundZoomDelta), + zoomDelta = zoom - oldZoom, + centerOffset = this._centerOffset.subtract(this._delta).divideBy(this._scale), + centerPoint = this._map.getPixelOrigin().add(this._startCenter).add(centerOffset), + center = this._map.unproject(centerPoint); + + L.DomEvent.removeListener(document, 'touchmove', this._onTouchMove); + L.DomEvent.removeListener(document, 'touchend', this._onTouchEnd); + + var finalScale = Math.pow(2, zoomDelta); + + this._map._runAnimation(center, zoom, finalScale / this._scale, this._startCenter.add(centerOffset)); + } +}); \ No newline at end of file -- cgit v1.2.3