page.replace_html :sidebar_title, 'Browse' page.replace_html :sidebar_content, :partial => 'start' page << < 0.25) { $("status").innerHTML = "Unable to load: Bounding box size of " + size + " is too large. (Must be smaller than 0.25)
"; return; } var url = "/api/0.5/map?bbox="+bounds.toBBOX(); $("status").innerHTML = "Loading..."; if (!gml) { var def = OpenLayers.Feature.Vector.style['default']; var style = new OpenLayers.Style(); style.addRules([new OpenLayers.Rule( {'symbolizer': {"Polygon": {'fillColor': '#ff0000', 'strokeColor': '#ff0000'}, "Line": {'fillColor': '#ffff00', 'strokeColor': '#000000', strokeOpacity: '0.4'}, "Point": {'fillColor': '#00ff00', 'strokeColor': '#00ff00'}} } )]); gml = new OpenLayers.Layer.GML("Data",url, {format: OpenLayers.Format.OSM, formatOptions: {checkTags: true}, maxFeatures: 100, requestSuccess: customDataLoader, styleMap: new OpenLayers.StyleMap({'default': style, 'select': {'strokeColor': '#0000ff'}}) } ); gml.events.register("loadend", gml, dataLoaded ); map.addLayer(gml); sf = new OpenLayers.Control.SelectFeature(gml, {'onSelect': onFeatureSelect}); sf.handler.stopDown = false; sf.handler.stopUp = false; map.addControl(sf); sf.activate(); } else { gml.setUrl(url); } currentFeature = null; } function dataLoaded() { $("status").innerHTML = "Loaded " + this.features.length + " features. (API)"; objList = document.createElement("ul"); for (var i = 0; i < this.features.length; i++) { var feature = this.features[i]; // Type, for linking var type ="way"; if (feature.geometry.CLASS_NAME == "OpenLayers.Geometry.Point") { type = "node"; } var nice_name = type.substr(0,1).toUpperCase() + type.substr(1,type.length); var li = document.createElement("li"); li.appendChild(document.createTextNode(nice_name + " ")); // Link, for viewing in the tab var link = document.createElement("a"); link.href = "/browse/" + type + "/" + feature.osm_id; var name = feature.attributes.name || feature.osm_id; link.appendChild(document.createTextNode(name)); link.feature = feature; link.onclick = OpenLayers.Function.bind(viewFeatureLink, link); li.appendChild(link); objList.appendChild(li); } $("object").innerHTML = ""; $("object").appendChild(objList); } function viewFeatureLink() { var layer = this.feature.layer; for (var i = 0; i < layer.selectedFeatures.length; i++) { var f = layer.selectedFeatures[i]; layer.drawFeature(f, layer.styleMap.createSymbolizer(f, "default")); } onFeatureSelect(this.feature); map.setCenter(this.feature.geometry.getBounds().getCenterLonLat()); return false; } function loadObjList() { $("object").innerHTML=""; $("object").appendChild(objList); return false; } function onFeatureSelect(feature) { // Unselect previously selected feature if (currentFeature) { currentFeature.layer.drawFeature( currentFeature, currentFeature.layer.styleMap.createSymbolizer(currentFeature, "default") ); } // Redraw in selected style feature.layer.drawFeature( feature, feature.layer.styleMap.createSymbolizer(feature, "select") ); // If the current object is the list, don't innerHTML="", since that could clar it. if ($("object").firstChild == objList) { $("object").removeChild(objList); } else { $("object").innerHTML = ""; } // Create a link back to the object list var div = document.createElement("div"); var link = document.createElement("a"); link.href="#"; link.onclick = loadObjList; link.appendChild(document.createTextNode("Back to Object List")); div.appendChild(link) $("object").appendChild(div); // Now the list of attributes var ul = document.createElement("ul"); var type = "way"; if (feature.geometry.CLASS_NAME == "OpenLayers.Geometry.Point") { type = "node"; } var li = document.createElement("li"); var link = document.createElement("a"); link.href = "/browse/"+type+"/"+feature.osm_id; link.appendChild(document.createTextNode(feature.osm_id)); li.appendChild(link); ul.appendChild(li); for (var key in feature.attributes) { var li = document.createElement("li"); var b = document.createElement("b"); b.appendChild(document.createTextNode(key)); li.appendChild(b); li.appendChild(document.createTextNode(": " + feature.attributes[key])); ul.appendChild(li); } $("object").appendChild(ul); // Stash the currently drawn feature currentFeature = feature; } function setBounds(bounds) { var epsg4326 = new OpenLayers.Projection("EPSG:4326"); var decimals = Math.pow(10, Math.floor(map.getZoom() / 3)); bounds = bounds.clone().transform(map.getProjectionObject(), epsg4326); $("minlon").innerHTML = Math.round(bounds.left * decimals) / decimals; $("minlat").innerHTML = Math.round(bounds.bottom * decimals) / decimals; $("maxlon").innerHTML = Math.round(bounds.right * decimals) / decimals; $("maxlat").innerHTML = Math.round(bounds.top * decimals) / decimals; } function validateLinks() { var bounds = this.getExtent(); bounds = bounds.clone().transform(map.getProjectionObject(), epsg4326); if (bounds.getWidth() * bounds.getHeight() > 0.25) { $("use_map").style.display = "none"; } else { $("use_map").style.display = "inline"; } } start(); EOJ