new layerswitcher, improved google layer, boxes layer, grid fix

git-svn-id: http://svn.openlayers.org/trunk/openlayers@1096 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
euzuro
2006-08-08 18:20:24 +00:00
parent 138d22af3f
commit f3a072b151
38 changed files with 1474 additions and 353 deletions
+335 -164
View File
@@ -1,225 +1,396 @@
/* 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
/**
* @class
*/
OpenLayers.Control.LayerSwitcher = Class.create();
/** color used in the UI to show a layer is active/displayed
*
* @final
* @type String
*/
OpenLayers.Control.LayerSwitcher.ACTIVE_COLOR = "darkblue";
/** color used in the UI to show a layer is deactivated/hidden
*
* @final
* @type String
*/
OpenLayers.Control.LayerSwitcher.NONACTIVE_COLOR = "lightblue";
OpenLayers.Control.LayerSwitcher.prototype =
Object.extend( new OpenLayers.Control(), {
/** @type String */
activeColor: "",
activeColor: "darkblue",
/** @type String */
nonActiveColor: "",
/** @type String */
mode: "checkbox",
// DOM Elements
/** @type DOMElement */
layersDiv: null,
/** @type DOMElement */
baseLayersDiv: null,
/** @type Array */
baseLayerInputs: null,
/** @type DOMElement */
dataLayersDiv: null,
/** @type Array */
dataLayerInputs: null,
/** @type DOMElement */
minimizeDiv: null,
/** @type DOMElement */
maximizeDiv: null,
/**
* @constructor
*/
initialize: function(options) {
this.activeColor = OpenLayers.Control.LayerSwitcher.ACTIVE_COLOR;
this.nonActiveColor = OpenLayers.Control.LayerSwitcher.NONACTIVE_COLOR;
this.backdrops = [];
OpenLayers.Control.prototype.initialize.apply(this, arguments);
},
/**
* @param {OpenLayers.Map} map
*/
setMap: function(map) {
OpenLayers.Control.prototype.setMap.apply(this, arguments);
this.map.events.register("addlayer", this, this.redraw);
this.map.events.register("changelayer", this, this.redraw);
this.map.events.register("removelayer", this, this.redraw);
this.map.events.register("changebaselayer", this, this.redraw);
},
/**
* @returns A reference to the DIV DOMElement containing the switcher tabs
* @type DOMElement
*/
draw: function() {
// initialize our internal div
OpenLayers.Control.prototype.draw.apply(this);
// create layout divs
this.loadContents();
// set mode to minimize
this.minimizeControl();
// populate div with current info
this.redraw();
return this.div;
},
/** Goes through and takes the current state of the Map and rebuilds the
* control to display that state. Groups base layers into a radio-button
* group and lists each data layer with a checkbox.
*
* @returns A reference to the DIV DOMElement containing the control
* @type DOMElement
*/
redraw: function() {
//clear out previous layers
this.baseLayersDiv.innerHTML = "";
this.baseLayerInputs = new Array();
this.dataLayersDiv.innerHTML = "";
this.dataLayerInputs = new Array();
for( var i = 0; i < this.map.layers.length; i++) {
var layer = this.map.layers[i];
var baseLayer = layer.isBaseLayer;
// only check a baselayer if it is *the* baselayer, check data
// layers if they are visible
var checked = (baseLayer) ? (layer == this.map.baseLayer)
: layer.getVisibility();
// create input element
var inputElem = document.createElement("input");
inputElem.id = "input_" + layer.name;
inputElem.name = (baseLayer) ? "baseLayers" : layer.name;
inputElem.type = (baseLayer) ? "radio" : "checkbox";
inputElem.value = layer.name;
inputElem.checked = checked;
inputElem.layer = layer;
// create span
var labelSpan = document.createElement("span");
labelSpan.innerHTML = layer.name;
labelSpan.style.verticalAlign = (baseLayer) ? "bottom" : "auto";
Event.observe(labelSpan,
"click",
this.onLabelClick.bindAsEventListener(inputElem));
// create line break
var br = document.createElement("br");
var groupArray = (baseLayer) ? this.baseLayerInputs
: this.dataLayerInputs;
groupArray.push(inputElem);
var groupDiv = (baseLayer) ? this.baseLayersDiv
: this.dataLayersDiv;
groupDiv.appendChild(inputElem);
groupDiv.appendChild(labelSpan);
groupDiv.appendChild(br);
}
return this.div;
},
/** A label has been clicked, check or uncheck its corresponding input
*
* @private
*
* @param {Event} e
*/
onLabelClick: function(e) {
this.checked = !this.checked;
},
/** Need to update the map accordingly whenever user clicks in either of
* the layers.
*
* @private
*
* @param {Event} e
*/
onLayerClick: function(e) {
this.updateMap();
},
/** Cycles through the loaded data and base layer input arrays and makes
* the necessary calls to the Map object such that that the map's
* visual state corresponds to what the user has selected in the control
*
* @private
*/
updateMap: function() {
// set the newly selected base layer
for(var i=0; i < this.baseLayerInputs.length; i++) {
var input = this.baseLayerInputs[i];
if (input.checked) {
this.map.setBaseLayer(input.layer, true);
}
}
// set the correct visibilities for the overlays
for(var i=0; i < this.dataLayerInputs.length; i++) {
var input = this.dataLayerInputs[i];
input.layer.setVisibility(input.checked, true);
}
},
/** Set up the labels and divs for the control
*
* @param {Event} e
*/
maximizeControl: function(e) {
//HACK HACK HACK - find a way to auto-size this layerswitcher
this.div.style.width = "20em";
this.div.style.height = "";
this.showControls(false);
if (e != null) {
Event.stop(e);
}
},
/** Hide all the contents of the control, shrink the size,
* add the maximize icon
*
* @param {Event} e
*/
minimizeControl: function(e) {
this.div.style.width = "0px";
this.div.style.height = "0px";
// this.div.style.backgroundColor = "transparent";
this.showControls(true);
if (e != null) {
Event.stop(e);
}
},
/** Hide/Show all LayerSwitcher controls depending on whether we are
* minimized or not
*
* @private
*
* @param {Boolean} minimize
*/
showControls: function(minimize) {
this.maximizeDiv.style.display = minimize ? "" : "none";
this.minimizeDiv.style.display = minimize ? "none" : "";
this.layersDiv.style.display = minimize ? "none" : "";
},
/** Set up the labels and divs for the control
*
*/
loadContents: function() {
//configure main div
this.div.style.position = "absolute";
this.div.style.top = "10px";
this.div.style.right = "0px";
this.div.style.left = "";
this.div.style.fontFamily = "sans-serif";
this.div.style.color = "white";
this.div.style.fontWeight = "bold";
this.div.style.marginTop = "3px";
this.div.style.marginLeft = "3px";
this.div.style.marginBottom = "3px";
this.div.style.fontSize="smaller";
this.div.style.width = "10em";
this.map.events.register("addlayer", this, this.redraw);
this.map.events.register("removelayer", this, this.redraw);
this.map.events.register("changelayer", this, this.redraw);
return this.redraw();
},
/**
* @returns A reference to the DIV DOMElement containing the switcher tabs
* @type DOMElement
*/
redraw: function() {
//clear out previous incarnation of LayerSwitcher tabs
this.div.innerHTML = "";
var visible = false;
for( var i = 0; i < this.map.layers.length; i++) {
if (visible && this.mode == "radio") {
this.map.layers[i].setVisibility(false);
} else {
visible = this.map.layers[i].getVisibility();
}
this.addTab(this.map.layers[i]);
}
return this.div;
},
this.div.style.fontSize = "smaller";
this.div.style.color = "white";
this.div.style.backgroundColor = "transparent";
/**
* @param {event} evt
*/
singleClick: function(evt) {
var div = Event.element(evt);
Event.observe(this.div, "mouseup",
this.mouseUp.bindAsEventListener(this));
Event.observe(this.div, "mousedown",
this.mouseDown.bindAsEventListener(this));
Event.observe(this.div, "dblclick", this.ignoreEvent);
// See comment about OL #57 fix below.
// If the click occurred on the corner spans we need
// to make sure we act on the actual label tab instead.
div = div.labelElement || div;
var layer = div.layer;
if (this.mode == "radio") {
for(var i=0; i < this.backdrops.length; i++) {
this.setTabActivation(this.backdrops[i], false);
this.backdrops[i].layer.setVisibility(false);
}
this.setTabActivation(div, true);
layer.setVisibility(true);
} else {
var visible = layer.getVisibility();
this.setTabActivation(div, !visible);
layer.setVisibility(!visible);
}
Event.stop(evt);
},
/**
* @private
*
* @param {event} evt
*/
ignoreEvent: function(evt) {
Event.stop(evt);
return false;
},
// layers list div
this.layersDiv = document.createElement("div");
this.layersDiv.id = "layersDiv";
this.layersDiv.style.paddingTop = "5px";
this.layersDiv.style.paddingLeft = "10px";
this.layersDiv.style.paddingBottom = "5px";
this.layersDiv.style.paddingRight = "75px";
this.layersDiv.style.backgroundColor = this.activeColor;
/**
* @private
*
* @param {OpenLayers.Layer} layer
*/
addTab: function(layer) {
// Outer DIV - for Rico Corners
// had to set width/height to get transparency in IE to work.
// thanks -- http://jszen.blogspot.com/2005/04/ie6-opacity-filter-caveat.html
//
var backdropLabelOuter = document.createElement('div');
backdropLabelOuter.id = "LayerSwitcher_" + layer.name + "_Tab";
backdropLabelOuter.style.marginTop = "4px";
backdropLabelOuter.style.marginBottom = "4px";
this._setEventHandlers(backdropLabelOuter);
this.layersDiv.style.width = "100%";
this.layersDiv.style.height = "100%";
// Inner Label - for Rico Corners
//
var backdropLabel = document.createElement('p');
backdropLabel.innerHTML = layer.name;
backdropLabel.style.marginTop = "0px";
backdropLabel.style.marginBottom = "0px";
backdropLabel.style.paddingLeft = "10px";
backdropLabel.style.paddingRight = "10px";
// add reference to layer onto the div for use in event handlers
backdropLabel.layer = layer;
// set event handlers
this._setEventHandlers(backdropLabel);
// add label to div
backdropLabelOuter.appendChild(backdropLabel);
var baseLbl = document.createElement("div");
baseLbl.innerHTML = "<u>Base Layer</u>";
baseLbl.style.marginTop = "3px";
baseLbl.style.marginLeft = "3px";
baseLbl.style.marginBottom = "3px";
this.layersDiv.appendChild(baseLbl);
this.backdrops.append(backdropLabel);
// add div to main LayerSwitcher Div
this.div.appendChild(backdropLabelOuter);
this.baseLayersDiv = document.createElement("div");
this.baseLayersDiv.style.paddingLeft = "10px";
Event.observe(this.baseLayersDiv, "click",
this.onLayerClick.bindAsEventListener(this));
this.layersDiv.appendChild(this.baseLayersDiv);
Rico.Corner.round(backdropLabelOuter, {corners: "tl bl",
var dataLbl = document.createElement("div");
dataLbl.innerHTML = "<u>Overlays</u>";
dataLbl.style.marginTop = "3px";
dataLbl.style.marginLeft = "3px";
dataLbl.style.marginBottom = "3px";
this.layersDiv.appendChild(dataLbl);
this.dataLayersDiv = document.createElement("div");
this.dataLayersDiv.style.paddingLeft = "10px";
Event.observe(this.dataLayersDiv, "click",
this.onLayerClick.bindAsEventListener(this));
this.layersDiv.appendChild(this.dataLayersDiv);
this.div.appendChild(this.layersDiv);
Rico.Corner.round(this.div, {corners: "tl bl",
bgColor: "transparent",
color: "white",
color: this.activeColor,
blend: false});
// extend the event handlers to operate on the
// rounded corners as well. (Fixes OL #57.)
var spanElements=backdropLabel.parentNode.getElementsByTagName("span");
Rico.Corner.changeOpacity(this.layersDiv, 0.75);
var imgLocation = OpenLayers.Util.getImagesLocation();
var sz = new OpenLayers.Size(18,18);
// maximize button div
var img = imgLocation + 'layer-switcher-maximize.png';
this.maximizeDiv = OpenLayers.Util.createAlphaImageDiv(
"OpenLayers_Control_ResizeDiv",
null,
sz,
img,
"absolute");
this.maximizeDiv.style.top = "5px";
this.maximizeDiv.style.right = "0px";
this.maximizeDiv.style.left = "";
this.maximizeDiv.style.display = "none";
Event.observe(this.maximizeDiv,
"click",
this.maximizeControl.bindAsEventListener(this));
for (var currIdx = 0; currIdx < spanElements.length; currIdx++) {
this._setEventHandlers(spanElements[currIdx], backdropLabel);
}
this.div.appendChild(this.maximizeDiv);
this.setTabActivation(backdropLabel, layer.getVisibility());
// minimize button div
var img = imgLocation + 'layer-switcher-minimize.png';
var sz = new OpenLayers.Size(18,18);
this.minimizeDiv = OpenLayers.Util.createAlphaImageDiv(
"OpenLayers_Control_ResizeDiv",
null,
sz,
img,
"absolute");
this.minimizeDiv.style.top = "5px";
this.minimizeDiv.style.right = "0px";
this.minimizeDiv.style.left = "";
this.minimizeDiv.style.display = "none";
Event.observe(this.minimizeDiv,
"click",
this.minimizeControl.bindAsEventListener(this));
this.div.appendChild(this.minimizeDiv);
},
/*
@private
@param {DOMElement} div
@param {Boolean} activate
*/
_setEventHandlers : function(element, labelDiv) {
/**
* @private
*
* @param {Event} evt
*/
ignoreEvent: function(evt) {
Event.stop(evt);
},
// We only want to respond to a mousedown event.
element.onclick = this.singleClick.bindAsEventListener(this);
element.ondblclick = this.singleClick.bindAsEventListener(this);
element.onmouseup = this.ignoreEvent.bindAsEventListener(this);
element.onmousedown = this.ignoreEvent.bindAsEventListener(this);
/** Register a local 'mouseDown' flag so that we'll know whether or not
* to ignore a mouseUp event
*
* @private
*
* @param {Event} evt
*/
mouseDown: function(evt) {
this.mouseDown = true;
this.ignoreEvent(evt);
},
// If we are operating on a corner span we need to store a
// reference to the actual tab. (See comment about OL #57 fix above.)
if (labelDiv) {
element.labelElement = labelDiv;
/** If the 'mouseDown' flag has been set, that means that the drag was
* started from within the LayerSwitcher control, and thus we can
* ignore the mouseup. Otherwise, let the Event continue.
*
* @private
*
* @param {Event} evt
*/
mouseUp: function(evt) {
if (this.mouseDown) {
this.mouseDown = false;
this.ignoreEvent(evt);
}
},
/**
* @private
*
* @param {DOMElement} div
* @param {Boolean} activate
*/
setTabActivation:function(div, activate) {
var color = (activate) ? this.activeColor : this.nonActiveColor;
Rico.Corner.changeColor(div, color);
},
/** @final @type String */
CLASS_NAME: "OpenLayers.Control.LayerSwitcher"
});
+224
View File
@@ -0,0 +1,224 @@
/* 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
/**
* @class
*/
OpenLayers.Control.LayerTabs = Class.create();
/** color used in the UI to show a layer is active/displayed
*
* @final
* @type String
*/
OpenLayers.Control.LayerTabs.ACTIVE_COLOR = "darkblue";
/** color used in the UI to show a layer is deactivated/hidden
*
* @final
* @type String
*/
OpenLayers.Control.LayerTabs.NONACTIVE_COLOR = "lightblue";
OpenLayers.Control.LayerTabs.prototype =
Object.extend( new OpenLayers.Control(), {
/** @type String */
activeColor: "",
/** @type String */
nonActiveColor: "",
/** @type String */
mode: "checkbox",
/**
* @constructor
*/
initialize: function(options) {
this.activeColor = OpenLayers.Control.LayerTabs.ACTIVE_COLOR;
this.nonActiveColor = OpenLayers.Control.LayerTabs.NONACTIVE_COLOR;
this.backdrops = [];
OpenLayers.Control.prototype.initialize.apply(this, arguments);
},
/**
* @returns A reference to the DIV DOMElement containing the switcher tabs
* @type DOMElement
*/
draw: function() {
// initialize our internal div
OpenLayers.Control.prototype.draw.apply(this);
this.div.style.position = "absolute";
this.div.style.top = "10px";
this.div.style.right = "0px";
this.div.style.left = "";
this.div.style.fontFamily = "sans-serif";
this.div.style.color = "white";
this.div.style.fontWeight = "bold";
this.div.style.marginTop = "3px";
this.div.style.marginLeft = "3px";
this.div.style.marginBottom = "3px";
this.div.style.fontSize="smaller";
this.div.style.width = "10em";
this.map.events.register("addlayer", this, this.redraw);
this.map.events.register("removelayer", this, this.redraw);
return this.redraw();
},
/**
* @returns A reference to the DIV DOMElement containing the switcher tabs
* @type DOMElement
*/
redraw: function() {
//clear out previous incarnation of LayerTabs tabs
this.div.innerHTML = "";
var visible = false;
for( var i = 0; i < this.map.layers.length; i++) {
if (visible && this.mode == "radio") {
this.map.layers[i].setVisibility(false);
} else {
visible = this.map.layers[i].getVisibility();
}
this.addTab(this.map.layers[i]);
}
return this.div;
},
/**
* @param {event} evt
*/
singleClick: function(evt) {
var div = Event.element(evt);
// See comment about OL #57 fix below.
// If the click occurred on the corner spans we need
// to make sure we act on the actual label tab instead.
div = div.labelElement || div;
var layer = div.layer;
if (this.mode == "radio") {
for(var i=0; i < this.backdrops.length; i++) {
this.setTabActivation(this.backdrops[i], false);
this.backdrops[i].layer.setVisibility(false);
}
this.setTabActivation(div, true);
layer.setVisibility(true);
} else {
var visible = layer.getVisibility();
this.setTabActivation(div, !visible);
layer.setVisibility(!visible);
}
Event.stop(evt);
},
/**
* @private
*
* @param {event} evt
*/
ignoreEvent: function(evt) {
Event.stop(evt);
return false;
},
/**
* @private
*
* @param {OpenLayers.Layer} layer
*/
addTab: function(layer) {
// Outer DIV - for Rico Corners
//
var backdropLabelOuter = document.createElement('div');
backdropLabelOuter.id = "LayerTabs_" + layer.name + "_Tab";
backdropLabelOuter.style.marginTop = "4px";
backdropLabelOuter.style.marginBottom = "4px";
this._setEventHandlers(backdropLabelOuter);
// Inner Label - for Rico Corners
//
var backdropLabel = document.createElement('p');
backdropLabel.innerHTML = layer.name;
backdropLabel.style.marginTop = "0px";
backdropLabel.style.marginBottom = "0px";
backdropLabel.style.paddingLeft = "10px";
backdropLabel.style.paddingRight = "10px";
// add reference to layer onto the div for use in event handlers
backdropLabel.layer = layer;
// set event handlers
this._setEventHandlers(backdropLabel);
// add label to div
backdropLabelOuter.appendChild(backdropLabel);
this.backdrops.append(backdropLabel);
// add div to main LayerTabs Div
this.div.appendChild(backdropLabelOuter);
Rico.Corner.round(backdropLabelOuter, {corners: "tl bl",
bgColor: "transparent",
color: "white",
blend: false});
// extend the event handlers to operate on the
// rounded corners as well. (Fixes OL #57.)
var spanElements=backdropLabel.parentNode.getElementsByTagName("span");
for (var currIdx = 0; currIdx < spanElements.length; currIdx++) {
this._setEventHandlers(spanElements[currIdx], backdropLabel);
}
this.setTabActivation(backdropLabel, layer.getVisibility());
},
/*
@private
@param {DOMElement} div
@param {Boolean} activate
*/
_setEventHandlers : function(element, labelDiv) {
// We only want to respond to a mousedown event.
element.onclick = this.singleClick.bindAsEventListener(this);
element.ondblclick = this.singleClick.bindAsEventListener(this);
element.onmouseup = this.ignoreEvent.bindAsEventListener(this);
element.onmousedown = this.ignoreEvent.bindAsEventListener(this);
// If we are operating on a corner span we need to store a
// reference to the actual tab. (See comment about OL #57 fix above.)
if (labelDiv) {
element.labelElement = labelDiv;
}
},
/**
* @private
*
* @param {DOMElement} div
* @param {Boolean} activate
*/
setTabActivation:function(div, activate) {
var color = (activate) ? this.activeColor : this.nonActiveColor;
Rico.Corner.changeColor(div, color);
},
/** @final @type String */
CLASS_NAME: "OpenLayers.Control.LayerTabs"
});
+6 -2
View File
@@ -85,6 +85,7 @@ OpenLayers.Control.MouseToolbar.prototype =
*/
defaultDblClick: function (evt) {
this.switchModeTo("pan");
this.performedDrag = false;
var newCenter = this.map.getLonLatFromViewPortPx( evt.xy );
this.map.setCenter(newCenter, this.map.zoom + 2);
},
@@ -95,6 +96,7 @@ OpenLayers.Control.MouseToolbar.prototype =
defaultMouseDown: function (evt) {
if (!Event.isLeftClick(evt)) return;
this.mouseDragStart = evt.xy.clone();
this.performedDrag = false;
if (evt.shiftKey && this.mode !="zoombox") {
this.switchModeTo("zoombox");
} else if (evt.altKey && this.mode !="measure") {
@@ -217,6 +219,7 @@ OpenLayers.Control.MouseToolbar.prototype =
this.map.setCenter(newCenter, null, true);
this.mouseDragStart = evt.xy.clone();
}
this.performedDrag = true;
}
},
@@ -244,8 +247,9 @@ OpenLayers.Control.MouseToolbar.prototype =
this.leaveMode();
break;
case "pan":
this.map.setCenter(this.map.center);
if (this.performedDrag) {
this.map.setCenter(this.map.center);
}
}
document.onselectstart = null;
this.mouseDragStart = null;
+18 -5
View File
@@ -95,15 +95,28 @@ OpenLayers.Icon.prototype = {
this.px = px;
}
if ((this.px != null) && (this.imageDiv != null)) {
if (this.calculateOffset) {
this.offset = this.calculateOffset(this.size);
if (this.imageDiv != null) {
if (this.px == null) {
this.display(false);
} else {
if (this.calculateOffset) {
this.offset = this.calculateOffset(this.size);
}
var offsetPx = this.px.offset(this.offset);
OpenLayers.Util.modifyAlphaImageDiv(this.imageDiv, null, offsetPx);
this.display(true);
}
var offsetPx = this.px.offset(this.offset);
OpenLayers.Util.modifyAlphaImageDiv(this.imageDiv, null, offsetPx);
}
},
/** Hide or show the icon
*
* @param {Boolean} display
*/
display: function(display) {
this.imageDiv.style.display = (display) ? "" : "none";
},
/** @final @type String */
CLASS_NAME: "OpenLayers.Icon"
};
+25 -20
View File
@@ -22,7 +22,14 @@ OpenLayers.Layer.prototype = {
* @type OpenLayers.Map */
map: null,
/** Whether or not the layer is a base layer. This should be set
* individually by all subclasses.
* Default is false
*
* @type Boolean
*/
isBaseLayer: false,
// OPTIONS
/** @type Array */
@@ -135,6 +142,12 @@ OpenLayers.Layer.prototype = {
moveTo:function(bounds, zoomChanged, minor) {
//this function can be implemented by subclasses.
},
/**
*/
reproject:function() {
//this function can be implemented by subclasses.
},
/** Set the map property for the layer. This is done through an accessor
* so that subclasses can override this and take special action once
@@ -146,16 +159,6 @@ OpenLayers.Layer.prototype = {
this.map = map;
},
/**
* @returns Whether or not the layer is a base layer. This should be
* determined individually by all subclasses. Default is false
* @type Boolean
*/
isBaseLayer: function() {
//this function should be implemented by all subclasses.
return false;
},
/**
* @returns Whether or not the layer is visible
* @type Boolean
@@ -165,18 +168,20 @@ OpenLayers.Layer.prototype = {
},
/**
* @param {bool} visible
*/
setVisibility: function(visible) {
* @param {Boolean} visible
* @param {Boolean} noEvent
*/
setVisibility: function(visible, noEvent) {
if (visible != this.getVisibility()) {
this.div.style.display = (visible) ? "block" : "none";
if (this.map != null) {
if (visible) {
var extent = this.map.getExtent();
if (extent != null) {
this.moveTo(this.map.getExtent());
}
if ((visible) && (this.map != null)) {
var extent = this.map.getExtent();
if (extent != null) {
this.moveTo(this.map.getExtent());
}
}
if ((this.map != null) &&
((noEvent == null) || (noEvent == false))) {
this.map.events.triggerEvent("changelayer");
}
}
+45
View File
@@ -0,0 +1,45 @@
/* 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/Layer.js
// @require: OpenLayers/Layer/Markers.js
/**
* @class
*/
OpenLayers.Layer.Boxes = Class.create();
OpenLayers.Layer.Boxes.prototype =
Object.extend( new OpenLayers.Layer.Markers(), {
initialize: function () {
OpenLayers.Layer.Markers.prototype.initialize.apply(this, arguments);
},
/** Calculate the pixel location for the marker, create it, and
* add it to the layer's div
*
* @private
*
* @param {OpenLayers.Marker.Box} marker
*/
drawMarker: function(marker) {
var bounds = marker.bounds;
var topleft = this.map.getLayerPxFromLonLat(
new OpenLayers.LonLat(bounds.left, bounds.top));
var botright = this.map.getLayerPxFromLonLat(
new OpenLayers.LonLat(bounds.right, bounds.bottom));
if (botright == null || topleft == null) {
marker.display(false);
} else {
var sz = new OpenLayers.Size(
botright.x - topleft.x, botright.y - topleft.y);
var markerDiv = marker.draw(topleft, sz);
if (!marker.drawn) {
this.div.appendChild(markerDiv);
marker.drawn = true;
}
}
},
/** @final @type String */
CLASS_NAME: "OpenLayers.Layer.Boxes"
});
+6 -9
View File
@@ -10,6 +10,11 @@ OpenLayers.Layer.GeoRSS = Class.create();
OpenLayers.Layer.GeoRSS.prototype =
Object.extend( new OpenLayers.Layer.Markers(), {
/** GeoRSS layer is never a base layer.
* @type Boolean
*/
isBaseLayer: false,
/** store url of text file
* @type str */
location:null,
@@ -41,15 +46,7 @@ OpenLayers.Layer.GeoRSS.prototype =
this.features = null;
OpenLayers.Layer.Markers.prototype.destroy.apply(this, arguments);
},
/** WFS layer is never a base class.
* @type Boolean
*/
isBaseLayer: function() {
return false;
},
/**
* @param {?} ajaxRequest
*/
+42 -24
View File
@@ -37,14 +37,27 @@ if (typeof GMap2 != "undefined") {
OpenLayers.Layer.Google = Class.create();
OpenLayers.Layer.Google.prototype = Object.extend( new OpenLayers.Layer(), {
/** Google layer is always base layer
*
* @type Boolean
*/
isBaseLayer: true,
/** @type Boolean */
isFixed: true,
/** @type GMap2 gmap stores the Google Map element */
gmap:null,
/** @type GMapType */
type: null,
/** @type Boolean */
dragging:false,
/** @type Boolean */
dontListen:false,
// OPTIONS
@@ -82,19 +95,13 @@ OpenLayers.Layer.Google.prototype = Object.extend( new OpenLayers.Layer(), {
setMap:function(map) {
OpenLayers.Layer.prototype.setMap.apply(this, arguments);
// once our layer has been added to the map, we can create the vemap
this.map.events.register("addlayer", this, this.loadGMap);
// once our layer has been added to the map, we can load it
this.loadGMap();
},
/** Google layer is a base class if the GMap loaded correctly.
* @type Boolean
*/
isBaseLayer: function() {
return (this.gmap != null);
},
/** Assuming we are not dragging (in which case GMaps moving itself)
* we need to move the gmap to the new center/zoom
/** Assuming we are not dragging (in which case GMaps is moving itself,
* and the dragging flag is set) we need to move the gmap to the
* new center/zoom
*
* @param {OpenLayers.Bounds} bounds
* @param {Boolean} zoomChanged
@@ -117,9 +124,16 @@ OpenLayers.Layer.Google.prototype = Object.extend( new OpenLayers.Layer(), {
if ( (!newCenter.equals(currentCenter)) ||
(newZoom != currentZoom) ) {
this.dontListen = true;
this.gmap.setCenter(this.getGLatLngFromOLLonLat(newCenter),
this.getGZoomFromOLZoom(newZoom));
if (this.type != null) {
this.gmap.setMapType(this.type);
this.type = null;
}
this.dontListen = false;
}
}
}
@@ -136,11 +150,12 @@ OpenLayers.Layer.Google.prototype = Object.extend( new OpenLayers.Layer(), {
//has gmaps library has been loaded?
try {
// create GMap, hide nav controls
this.gmap = new GMap2(this.div);
this.gmap = new GMap2(this.div );
// this causes the GMap to set itself to Map's center/zoom
this.moveTo();
// catch pans and zooms from GMap
GEvent.addListener(this.gmap,
"moveend",
@@ -240,14 +255,17 @@ OpenLayers.Layer.Google.prototype = Object.extend( new OpenLayers.Layer(), {
* @param {event} e
*/
catchPanZoom: function(e) {
if (!this.dontListen) {
var gCenter = this.gmap.getCenter();
var gZoom = this.gmap.getZoom();
var olCenter = this.getOLLonLatFromGLatLng(gCenter);
var olZoom = this.getOLZoomFromGZoom(gZoom);
this.map.setCenter(olCenter, olZoom);
var gCenter = this.gmap.getCenter();
var gZoom = this.gmap.getZoom();
var olCenter = this.getOLLonLatFromGLatLng(gCenter);
var olZoom = this.getOLZoomFromGZoom(gZoom);
this.map.setCenter(olCenter, olZoom, this.dragging);
}
},
@@ -338,7 +356,7 @@ OpenLayers.Layer.Google.prototype = Object.extend( new OpenLayers.Layer(), {
getOLZoomFromGZoom: function(gZoom) {
var zoom = null;
if (gZoom != null) {
zoom = gZoom - 1;
zoom = gZoom;
}
return zoom;
},
@@ -353,7 +371,7 @@ OpenLayers.Layer.Google.prototype = Object.extend( new OpenLayers.Layer(), {
getGZoomFromOLZoom: function(olZoom) {
var zoom = null;
if (olZoom != null) {
zoom = olZoom + 1;
zoom = olZoom;
}
return zoom;
},
+1 -1
View File
@@ -136,7 +136,7 @@ OpenLayers.Layer.Grid.prototype =
*/
moveTo:function(bounds, zoomChanged, minor) {
if (bounds == null) {
bounds = this.map.getBounds();
bounds = this.map.getExtent();
}
if (bounds != null) {
if (!this.getVisibility()) {
+8 -4
View File
@@ -10,7 +10,13 @@ OpenLayers.Layer.KaMap = Class.create();
OpenLayers.Layer.KaMap.prototype =
Object.extend( new OpenLayers.Layer.Grid(), {
/** KaMap Layer is always a base layer
*
* @type Boolean
*/
isBaseLayer: true,
units: 'degrees',
scales: {inches: 1, feet: 12, miles: 63360.0, meters: 39.3701, kilometers: 39370.1, degrees: 4374754},
@@ -118,9 +124,7 @@ OpenLayers.Layer.KaMap.prototype =
} while(tileoffsetlat > bounds.bottom - tilelat)
},
isBaseLayer: function() {
return true;
},
/** @final @type String */
CLASS_NAME: "OpenLayers.Layer.KaMap"
});
+20 -11
View File
@@ -9,6 +9,12 @@ OpenLayers.Layer.Markers = Class.create();
OpenLayers.Layer.Markers.prototype =
Object.extend( new OpenLayers.Layer(), {
/** Markers layer is never a base layer.
*
* @type Boolean
*/
isBaseLayer: false,
/** internal marker list
* @type Array(OpenLayers.Marker) */
markers: null,
@@ -44,17 +50,18 @@ OpenLayers.Layer.Markers.prototype =
this.redraw();
}
},
/** WFS layer is never a base class.
* @type Boolean
*/
isBaseLayer: function() {
return false;
},
/**
* @param {OpenLayers.Marker} marker
*/
*/
reproject:function() {
this.redraw();
},
/**
* @param {OpenLayers.Marker} marker
*/
addMarker: function(marker) {
this.markers.append(marker);
if (this.map && this.map.getExtent()) {
@@ -103,7 +110,9 @@ OpenLayers.Layer.Markers.prototype =
*/
drawMarker: function(marker) {
var px = this.map.getLayerPxFromLonLat(marker.lonlat);
if (px != null) {
if (px == null) {
marker.display(false);
} else {
var markerImg = marker.draw(px);
if (!marker.drawn) {
this.div.appendChild(markerImg);
+6 -7
View File
@@ -10,6 +10,12 @@ OpenLayers.Layer.Text = Class.create();
OpenLayers.Layer.Text.prototype =
Object.extend( new OpenLayers.Layer.Markers(), {
/** Text layer is never a base layer.
*
* @type Boolean
*/
isBaseLayer: false,
/** store url of text file - this should be specified in the "options" hash
* @type str */
location:null,
@@ -44,13 +50,6 @@ OpenLayers.Layer.Text.prototype =
OpenLayers.Layer.Markers.prototype.destroy.apply(this, arguments);
},
/** Text layer is never a base class.
* @type Boolean
*/
isBaseLayer: function() {
return false;
},
/**
* @param {?} ajaxRequest
+10 -11
View File
@@ -11,6 +11,12 @@ OpenLayers.Layer.VirtualEarth = Class.create();
OpenLayers.Layer.VirtualEarth.prototype =
Object.extend( new OpenLayers.Layer(), {
/** Virtual Earth layer is always a base layer.
*
* @type Boolean
*/
isBaseLayer: true,
/** @type Boolean */
isFixed: true,
@@ -32,15 +38,8 @@ OpenLayers.Layer.VirtualEarth.prototype =
setMap:function(map) {
OpenLayers.Layer.prototype.setMap.apply(this, arguments);
// once our layer has been added to the map, we can create the vemap
this.map.events.register("addlayer", this, this.loadVEMap);
},
/** Virtual Earth layer is always a base class.
* @type Boolean
*/
isBaseLayer: function() {
return true;
// once our layer has been added to the map, we can load the vemap
this.loadVEMap();
},
/**
@@ -257,7 +256,7 @@ OpenLayers.Layer.VirtualEarth.prototype =
getOLZoomFromVEZoom: function(veZoom) {
var zoom = null;
if (veZoom != null) {
zoom = veZoom - 1;
zoom = veZoom;
}
return zoom;
},
@@ -272,7 +271,7 @@ OpenLayers.Layer.VirtualEarth.prototype =
getVEZoomFromOLZoom: function(olZoom) {
var zoom = null;
if (olZoom != null) {
zoom = olZoom + 1;
zoom = olZoom;
}
return zoom;
},
+13 -8
View File
@@ -11,6 +11,12 @@ OpenLayers.Layer.WFS.prototype =
Object.extend(new OpenLayers.Layer.Grid(),
Object.extend(new OpenLayers.Layer.Markers(), {
/** WFS layer is never a base layer.
*
* @type Boolean
*/
isBaseLayer: false,
/** Allow the user to specify special classes for features and tiles.
*
* This allows for easy-definition of behaviour. The defaults are
@@ -47,6 +53,12 @@ OpenLayers.Layer.WFS.prototype =
newArguments.push(name, url, params, options);
}
OpenLayers.Layer.Grid.prototype.initialize.apply(this, newArguments);
var newArguments = new Array();
if (arguments.length > 0) {
//uppercase params
newArguments.push(name, options);
}
OpenLayers.Layer.Markers.prototype.initialize.apply(this, newArguments);
if (arguments.length > 0) {
@@ -83,14 +95,7 @@ OpenLayers.Layer.WFS.prototype =
OpenLayers.Layer.Grid.prototype.moveTo.apply(this, arguments);
OpenLayers.Layer.Markers.prototype.moveTo.apply(this, arguments);
},
/** WFS layer is never a base class.
* @type Boolean
*/
isBaseLayer: function() {
return false;
},
/**
* @param {Object} obj
*
+9 -9
View File
@@ -18,6 +18,14 @@ OpenLayers.Layer.WMS.prototype =
format: "image/jpeg"
},
/** WMS layer by default is a base layer.
* If the user wishes to use a WMS as a datalayer, s/he needs only
* set this property to false.
*
* @type Boolean
*/
isBaseLayer: true,
/**
* @constructor
*
@@ -74,15 +82,7 @@ OpenLayers.Layer.WMS.prototype =
return obj;
},
/** WMS layer is never a base class.
* @type Boolean
*/
isBaseLayer: function() {
return (this.params.TRANSPARENT != 'true');
},
/**
* addTile creates a tile, initializes it, and
* adds it to the layer div.
+6 -8
View File
@@ -20,6 +20,12 @@ OpenLayers.Layer.WMS.Untiled.prototype =
format: "image/jpeg"
},
/** WMS.Untiled layer is never a base layer.
* @type Boolean
*/
isBaseLayer: false,
/** @type DOMElement */
imgDiv: null,
@@ -81,14 +87,6 @@ OpenLayers.Layer.WMS.Untiled.prototype =
},
/** WFS layer is never a base class.
* @type Boolean
*/
isBaseLayer: function() {
return false; //(this.params.TRANSPARENT != true);
},
/** Once HTTPRequest has set the map, we can load the image div
*
* @param {OpenLayers.Map} map
+7 -3
View File
@@ -12,6 +12,12 @@ OpenLayers.Layer.WorldWind.prototype =
DEFAULT_PARAMS: {
},
/** WorldWind layer is always a base layer
*
* @type Boolean
*/
isBaseLayer: true,
// LevelZeroTileSizeDegrees
lzd: null,
@@ -55,9 +61,7 @@ OpenLayers.Layer.WorldWind.prototype =
return tile;
}
},
isBaseLayer: function() {
return true;
},
/** @final @type String */
CLASS_NAME: "OpenLayers.Layer.WorldWind"
});
+6 -7
View File
@@ -12,6 +12,12 @@ document.write("<script src='http://api.maps.yahoo.com/ajaxymap?v=3.0&appid=euzu
OpenLayers.Layer.Yahoo = Class.create();
OpenLayers.Layer.Yahoo.prototype = Object.extend( new OpenLayers.Layer(), {
/** Yahoo layer is always a base layer.
*
* @type Boolean
*/
isBaseLayer: true,
/** @type Boolean */
isFixed: true,
@@ -40,13 +46,6 @@ OpenLayers.Layer.Yahoo.prototype = Object.extend( new OpenLayers.Layer(), {
this.map.events.register("addlayer", this, this.loadYMap);
},
/** Yahoo layer is always a base class.
* @type Boolean
*/
isBaseLayer: function() {
return true;
},
/**
* @param {OpenLayers.Bounds} bounds
* @param {Boolean} zoomChanged
+69 -19
View File
@@ -23,7 +23,7 @@ OpenLayers.Map.prototype = {
* @type Array */
EVENT_TYPES: [
"addlayer", "removelayer", "changelayer", "movestart", "move",
"moveend", "zoomend", "layerchanged", "popupopen", "popupclose",
"moveend", "zoomend", "popupopen", "popupclose",
"addmarker", "removemarker", "clearmarkers", "mouseover",
"mouseout", "mousemove", "dragstart", "drag", "dragend",
"changebaselayer"],
@@ -258,7 +258,6 @@ OpenLayers.Map.prototype = {
* @param {OpenLayers.Layer} layer
*/
addLayer: function (layer) {
layer.setMap(this);
layer.div.style.overflow = "";
layer.div.style.zIndex = this.Z_INDEX_BASE['Layer'] + this.layers.length;
@@ -268,6 +267,7 @@ OpenLayers.Map.prototype = {
this.layerContainerDiv.appendChild(layer.div);
}
this.layers.push(layer);
layer.setMap(this);
this.events.triggerEvent("addlayer");
@@ -277,15 +277,14 @@ OpenLayers.Map.prototype = {
layer.moveTo(bounds, true);
}
// hack hack hack - until we add a more robust layer switcher,
// which is able to determine which layers are base layers and
// which are not (and put baselayers in a radiobutton group and
// other layers in checkboxes) this seems to be the most straight-
// forward way of dealing with this.
//
if ( (this.baseLayer == null) && (layer.isBaseLayer()) ) {
this.baseLayer = layer;
this.events.triggerEvent("changebaselayer");
if (layer.isBaseLayer) {
// set the first baselaye we add as the baselayer
if (this.baseLayer == null) {
this.setBaseLayer(layer);
this.events.triggerEvent("changebaselayer");
} else {
layer.setVisibility(false);
}
}
},
@@ -329,19 +328,60 @@ OpenLayers.Map.prototype = {
} else {
this.layerContainerDiv.removeChild(layer.div);
}
layer.map = null;
this.layers.remove(layer);
// if we removed the base layer, need to set a new one
if (this.baseLayer == layer) {
this.baseLayer = null;
for(i=0; i < this.layers.length; i++) {
if ( (this.baseLayer == null) && (this.layers[i].isBaseLayer()) ) {
this.baseLayer = this.layers[i];
continue;
var iLayer = this.layers[i];
if (iLayer.isBaseLayer) {
this.setBaseLayer(iLayer);
break;
}
}
}
layer.map = null;
this.events.triggerEvent("removelayer");
},
/** Allows user to specify one of the currently-loaded layers as the Map's
* new base layer.
*
* @param {OpenLayers.Layer} newBaseLayer
* @param {Boolean} noEvent
*/
setBaseLayer: function(newBaseLayer, noEvent) {
if (newBaseLayer != this.baseLayer) {
// is newBaseLayer an already loaded layer?
var foundLayer = (this.layers.indexOf(newBaseLayer) != -1);
if (foundLayer) {
// make the old base layer invisible
if (this.baseLayer != null) {
this.baseLayer.setVisibility(false, noEvent);
}
// set new baselayer
this.baseLayer = newBaseLayer;
// make the new one visible
this.baseLayer.setVisibility(true, noEvent);
// now go back and reproject
for(var i=0; i < this.layers.length; i++) {
this.layers[i].reproject();
}
if ((noEvent == null) || (noEvent == false)) {
this.events.triggerEvent("changebaselayer");
}
}
}
},
/**
* @param {OpenLayers.Control} control
@@ -912,8 +952,13 @@ OpenLayers.Map.prototype = {
* @type OpenLayers.Pixel
*/
getViewPortPxFromLayerPx:function(layerPx) {
return layerPx.add(parseInt(this.layerContainerDiv.style.left),
parseInt(this.layerContainerDiv.style.top) );
var viewPortPx = null;
if (layerPx != null) {
var dX = parseInt(this.layerContainerDiv.style.left);
var dY = parseInt(this.layerContainerDiv.style.top);
viewPortPx = layerPx.add(dX, dY);
}
return viewPortPx;
},
/**
@@ -925,8 +970,13 @@ OpenLayers.Map.prototype = {
* @type OpenLayers.Pixel
*/
getLayerPxFromViewPortPx:function(viewPortPx) {
return viewPortPx.add(-parseInt(this.layerContainerDiv.style.left),
-parseInt(this.layerContainerDiv.style.top));
var layerPx = null;
if (viewPortPx != null) {
var dX = -parseInt(this.layerContainerDiv.style.left);
var dY = -parseInt(this.layerContainerDiv.style.top);
layerPx = viewPortPx.add(dX, dY);
}
return layerPx;
},
//
+13 -4
View File
@@ -27,10 +27,11 @@ OpenLayers.Marker.prototype = {
* @param {OpenLayers.LonLat lonlat
*/
initialize: function(lonlat, icon) {
this.lonlat = lonlat;
this.icon = (icon) ? icon : OpenLayers.Marker.defaultIcon();
this.events = new OpenLayers.Events(this, this.icon.imageDiv, null);
if (arguments.length > 0) {
this.lonlat = lonlat;
this.icon = (icon) ? icon : OpenLayers.Marker.defaultIcon();
this.events = new OpenLayers.Events(this, this.icon.imageDiv, null);
}
},
destroy: function() {
@@ -87,6 +88,14 @@ OpenLayers.Marker.prototype = {
}
},
/** Hide or show the icon
*
* @param {Boolean} display
*/
display: function(display) {
this.icon.display(display);
},
/** @final @type String */
CLASS_NAME: "OpenLayers.Marker"
};
+72
View File
@@ -0,0 +1,72 @@
/* 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/Marker.js
/**
* @class
*/
OpenLayers.Marker.Box = Class.create();
OpenLayers.Marker.Box.prototype = Object.extend( new OpenLayers.Marker(), {
/** @type OpenLayers.LonLat */
bounds: null,
div: null,
/**
* @constructor
*
* @param {OpenLayers.Icon} icon
* @param {OpenLayers.LonLat lonlat
*/
initialize: function(bounds, borderColor, borderWidth) {
if (arguments.length > 0) {
this.bounds = bounds;
this.div = OpenLayers.Util.createDiv();
this.events = new OpenLayers.Events(this, this.div, null);
this.setBorder(borderColor, borderWidth);
}
},
setBorder: function (color, width) {
if (!color) color = "red";
if (!width) width = 2;
this.div.style.border = width + "px solid " + color;
},
/**
* @param {OpenLayers.Pixel} px
*
* @return A new DOM Image with this marker´s icon set at the
* location passed-in
* @type DOMElement
*/
draw: function(px, sz) {
OpenLayers.Util.modifyDOMElement(this.div, null, px, sz);
return this.div;
},
/**
* @returns Whether or not the marker is currently visible on screen.
* @type Boolean
*/
onScreen:function() {
var onScreen = false;
if (this.map) {
var screenBounds = this.map.getExtent();
onScreen = screenBounds.containsBounds(this.bounds, true, true);
}
return onScreen;
},
/** Hide or show the icon
*
* @param {Boolean} display
*/
display: function(display) {
this.div.style.display = (display) ? "" : "none";
},
/** @final @type String */
CLASS_NAME: "OpenLayers.Marker.Box"
});