--- /dev/null
+/* Copyright (c) 2006 MetaCarta, Inc., published under the BSD license.
+ * See http://svn.openlayers.org/trunk/openlayers/license.txt for the full
+ * text of the license. */
+// @require: OpenLayers/Control.js
+OpenLayers.Control.MouseToolbar = Class.create();
+OpenLayers.Control.MouseToolbar.X = 6;
+OpenLayers.Control.MouseToolbar.Y = 300;
+OpenLayers.Control.MouseToolbar.prototype =
+ Object.extend( new OpenLayers.Control(), {
+
+ mode: null,
+
+ buttons: null,
+
+ direction: "vertical",
+
+ initialize: function(position, direction) {
+ OpenLayers.Control.prototype.initialize.apply(this, arguments);
+ this.position = new OpenLayers.Pixel(OpenLayers.Control.MouseToolbar.X,
+ OpenLayers.Control.MouseToolbar.Y);
+ if (position) {
+ this.position = position;
+ }
+ if (direction) {
+ this.direction = direction;
+ }
+ this.measureDivs = [];
+ },
+
+ draw: function() {
+ OpenLayers.Control.prototype.draw.apply(this, arguments);
+ this.buttons = new Object();
+ this.map.events.register( "dblclick", this, this.defaultDblClick );
+ this.map.events.register( "mousedown", this, this.defaultMouseDown );
+ this.map.events.register( "mouseup", this, this.defaultMouseUp );
+ this.map.events.register( "mousemove", this, this.defaultMouseMove );
+ this.map.events.register( "mouseout", this, this.defaultMouseOut );
+ var sz = new OpenLayers.Size(28,28);
+ var centered = this.position;
+ this._addButton("zoombox", "drag-rectangle-off.png", "drag-rectangle-on.png", centered, sz, "Shift->Drag to zoom to area");
+ centered = centered.add((this.direction == "vertical" ? 0 : sz.w), (this.direction == "vertical" ? sz.h : 0));
+ this._addButton("pan", "panning-hand-off.png", "panning-hand-on.png", centered, sz, "Drag the map to pan.");
+ centered = centered.add((this.direction == "vertical" ? 0 : sz.w), (this.direction == "vertical" ? sz.h : 0));
+ this._addButton("measure", "measuring-stick-off.png", "measuring-stick-on.png", centered, sz, "Hold alt when clicking to show distance between selected points");
+ this.switchModeTo("pan");
+ this.map.events.register("zoomend", this, function() { this.switchModeTo("pan"); });
+ return this.div;
+
+ },
+
+ _addButton:function(id, img, activeImg, xy, sz, title) {
+ var imgLocation = OpenLayers.Util.getImagesLocation() + img;
+ var activeImgLocation = OpenLayers.Util.getImagesLocation() + activeImg;
+ // var btn = new ol.AlphaImage("_"+id, imgLocation, xy, sz);
+ var btn = OpenLayers.Util.createAlphaImageDiv(
+ "OpenLayers_Control_MouseToolbar_" + id,
+ xy, sz, imgLocation, "absolute");
+
+ //we want to add the outer div
+ this.div.appendChild(btn);
+ btn.imgLocation = imgLocation;
+ btn.activeImgLocation = activeImgLocation;
+
+ btn.events = new OpenLayers.Events(this, btn);
+ btn.events.register("mousedown", this, this.buttonClick);
+ btn.events.register("mouseup", this, Event.stop);
+ btn.action = id;
+ btn.title = title;
+ btn.alt = title;
+ btn.map = this.map;
+
+ //we want to remember/reference the outer div
+ this.buttons[id] = btn;
+ return btn;
+ },
+
+ buttonClick: function(evt) {
+ if (!Event.isLeftClick(evt)) return;
+ this.switchModeTo(evt.div.action);
+ Event.stop(evt);
+ },
+
+ /**
+ * @param {Event} evt
+ */
+ defaultDblClick: function (evt) {
+ this.switchModeTo("pan");
+ var newCenter = this.map.getLonLatFromViewPortPx( evt.xy );
+ this.map.setCenter(newCenter, this.map.zoom + 2);
+ },
+
+ /**
+ * @param {Event} evt
+ */
+ defaultMouseDown: function (evt) {
+ if (!Event.isLeftClick(evt)) return;
+ this.mouseDragStart = evt.xy.copyOf();
+ if (evt.shiftKey && this.mode !="zoombox") {
+ this.switchModeTo("zoombox");
+ } else if (evt.altKey && this.mode !="measure") {
+ this.switchModeTo("measure");
+ } else if (!this.mode) {
+ this.switchModeTo("pan");
+ }
+
+ switch (this.mode) {
+ case "zoombox":
+ this.map.div.style.cursor = "crosshair";
+ this.zoomBox = OpenLayers.Util.createDiv('zoomBox',
+ this.mouseDragStart,
+ null,
+ null,
+ "absolute",
+ "2px solid red");
+ this.zoomBox.style.backgroundColor = "white";
+ this.zoomBox.style.filter = "alpha(opacity=50)"; // IE
+ this.zoomBox.style.opacity = "0.50";
+ this.zoomBox.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
+ this.map.viewPortDiv.appendChild(this.zoomBox);
+ break;
+ case "measure":
+ var distance = "";
+ if (this.measureStart) {
+ measureEnd = this.map.getLonLatFromViewPortPx(this.mouseDragStart);
+ distance = OpenLayers.Util.distVincenty(this.measureStart, measureEnd);
+ distance = Math.round(distance * 100) / 100;
+ distance = distance + "km";
+ this.measureStartBox = this.measureBox;
+ }
+ this.measureStart = this.map.getLonLatFromViewPortPx(this.mouseDragStart);;
+ this.measureBox = OpenLayers.Util.createDiv(null,
+ this.mouseDragStart.add(
+ -2-parseInt(this.map.layerContainerDiv.style.left),
+ -2-parseInt(this.map.layerContainerDiv.style.top)),
+ null,
+ null,
+ "absolute");
+ this.measureBox.style.width="4px";
+ this.measureBox.style.height="4px";
+ this.measureBox.style.backgroundColor="red";
+ this.measureBox.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
+ this.map.layerContainerDiv.appendChild(this.measureBox);
+ if (distance) {
+ this.measureBoxDistance = OpenLayers.Util.createDiv(null,
+ this.mouseDragStart.add(
+ -2-parseInt(this.map.layerContainerDiv.style.left),
+ 2-parseInt(this.map.layerContainerDiv.style.top)),
+ null,
+ null,
+ "absolute");
+
+ this.measureBoxDistance.innerHTML = distance;
+ this.measureBoxDistance.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
+ this.map.layerContainerDiv.appendChild(this.measureBoxDistance);
+ this.measureDivs.append(this.measureBoxDistance);
+ }
+ this.measureBox.style.zIndex = this.map.Z_INDEX_BASE["Popup"] - 1;
+ this.map.layerContainerDiv.appendChild(this.measureBox);
+ this.measureDivs.append(this.measureBox);
+ break;
+ default:
+ this.map.div.style.cursor = "move";
+ break;
+ }
+ document.onselectstart = function() { return false; }
+ Event.stop(evt);
+ },
+
+ switchModeTo: function(mode) {
+ if (mode != this.mode) {
+ if (this.mode) {
+ OpenLayers.Util.modifyAlphaImageDiv(this.buttons[this.mode], null, null, null, this.buttons[this.mode].imgLocation);
+ }
+ if (this.mode == "measure" && mode != "measure") {
+ for(var i = 0; i < this.measureDivs.length; i++) {
+ if (this.measureDivs[i]) {
+ this.map.layerContainerDiv.removeChild(this.measureDivs[i]);
+ }
+ }
+ this.measureDivs = [];
+ this.measureStart = null;
+ }
+ this.mode = mode;
+ OpenLayers.Util.modifyAlphaImageDiv(this.buttons[mode], null, null, null, this.buttons[mode].activeImgLocation);
+ }
+ },
+
+ leaveMode: function() {
+ this.switchModeTo("pan");
+ },
+
+ /**
+ * @param {Event} evt
+ */
+ defaultMouseMove: function (evt) {
+ if (this.mouseDragStart != null) {
+ switch (this.mode) {
+ case "zoombox":
+ var deltaX = Math.abs(this.mouseDragStart.x - evt.xy.x);
+ var deltaY = Math.abs(this.mouseDragStart.y - evt.xy.y);
+ this.zoomBox.style.width = deltaX+"px";
+ this.zoomBox.style.height = deltaY+"px";
+ if (evt.xy.x < this.mouseDragStart.x) {
+ this.zoomBox.style.left = evt.xy.x+"px";
+ }
+ if (evt.xy.y < this.mouseDragStart.y) {
+ this.zoomBox.style.top = evt.xy.y+"px";
+ }
+ break;
+ default:
+ var deltaX = this.mouseDragStart.x - evt.xy.x;
+ var deltaY = this.mouseDragStart.y - evt.xy.y;
+ var size = this.map.getSize();
+ var newXY = new OpenLayers.Pixel(size.w / 2 + deltaX,
+ size.h / 2 + deltaY);
+ var newCenter = this.map.getLonLatFromViewPortPx( newXY );
+ this.map.setCenter(newCenter, null, true);
+ this.mouseDragStart = evt.xy.copyOf();
+ }
+ }
+ },
+
+ /**
+ * @param {Event} evt
+ */
+ defaultMouseUp: function (evt) {
+ if (!Event.isLeftClick(evt)) return;
+ switch (this.mode) {
+ case "zoombox":
+ var start = this.map.getLonLatFromViewPortPx( this.mouseDragStart );
+ var end = this.map.getLonLatFromViewPortPx( evt.xy );
+ var top = Math.max(start.lat, end.lat);
+ var bottom = Math.min(start.lat, end.lat);
+ var left = Math.min(start.lon, end.lon);
+ var right = Math.max(start.lon, end.lon);
+ var bounds = new OpenLayers.Bounds(left, bottom, right, top);
+ var zoom = this.map.getZoomForExtent(bounds);
+ this.map.setCenter(new OpenLayers.LonLat(
+ (start.lon + end.lon) / 2,
+ (start.lat + end.lat) / 2
+ ), zoom);
+ this.map.viewPortDiv.removeChild(document.getElementById("zoomBox"));
+ this.zoomBox = null;
+ this.leaveMode();
+ break;
+ case "pan":
+ this.map.setCenter(this.map.center);
+
+ }
+ document.onselectstart = null;
+ this.mouseDragStart = null;
+ this.map.div.style.cursor = "default";
+ },
+
+ defaultMouseOut: function (evt) {
+ if (this.mouseDragStart != null
+ && OpenLayers.Util.mouseLeft(evt, this.map.div)) {
+ this.defaultMouseUp(evt);
+ }
+ }
+});
+
projects / rails.git / blobdiff