]> git.openstreetmap.org Git - rails.git/blobdiff - app/views/browse/start.rjs
change layout: now a link, no longer a tab
[rails.git] / app / views / browse / start.rjs
index 963f1c25bf0e57911d89b68a26925ae9b9c0fd6c..2c48c70ff9f1df7bafd0472fb7303b9825348bd6 100644 (file)
@@ -22,6 +22,11 @@ page << <<EOJ
         map.addControl(box);
         map.events.register("moveend", map, validateLinks);
         map.events.triggerEvent("moveend");
+        if (map.getZoom() >= 16) {
+            useMap();
+        } else {
+            $("status").innerHTML = "Zoom in or Select an area of the map to view.";
+        }    
     }
     
     function stopBrowse() {
@@ -49,7 +54,6 @@ page << <<EOJ
     
     function useMap() {
         var bounds = map.getExtent();
-        setBounds(bounds);
         getData(bounds);
         return false;
     }
@@ -57,13 +61,13 @@ page << <<EOJ
     
     function endDrag(bbox) {
         var bounds = bbox.getBounds();
-        setBounds(bounds);
         box.deactivate();
         getData(bounds);
         $("drag_box").innerHTML = "Manually select a different area";
     }
     
     function displayFeatureWarning() {
+        $("status").innerHTML = "";
         var div = document.createElement("div");
         var p = document.createElement("p");
         p.appendChild(document.createTextNode("You have loaded an area which contains " + featureList.length + " features. In general, some browsers may not cope well with displaying this quantity of data. Generally, browsers work best at displaying less than 100 features at a time: doing anything else may make your browser slow/unresponsive. If you are sure you want to display this data, you may do so by clicking the button below.")); 
@@ -80,6 +84,7 @@ page << <<EOJ
     function loadFeatureList() {
         gml.addFeatures(featureList);
         gml.events.triggerEvent("loadend");
+        return false;
     }    
 
     function customDataLoader(request) { 
@@ -114,15 +119,17 @@ page << <<EOJ
         bounds.transform(new OpenLayers.Projection("EPSG:900913"), new OpenLayers.Projection("EPSG:4326"));
         var size = bounds.getWidth() * bounds.getHeight(); 
         if (size > 0.25) {
-            $("status").innerHTML = "Unable to load: Bounding box size of " + size + " is too large. (Must be smaller than 0.25)"; 
+            $("status").innerHTML = "Unable to load: Bounding box size of " + size + " is too large. (Must be smaller than 0.25)<br />"; 
             return;
         }
 
         var url = "/api/0.5/map?bbox="+bounds.toBBOX();
         
+        loadGML(url);
+    }
+    function loadGML(url) {
         $("status").innerHTML = "Loading...";
         if (!gml) {
-            var def = OpenLayers.Feature.Vector.style['default'];
             var style = new OpenLayers.Style();
             style.addRules([new OpenLayers.Rule( 
               {'symbolizer': 
@@ -134,7 +141,7 @@ page << <<EOJ
             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'}})
+                     styleMap: new OpenLayers.StyleMap({'default': style, 'select': {'strokeColor': '#0000ff', strokeWidth: 8}})
                     }
             );
             gml.events.register("loadend", gml, dataLoaded );
@@ -152,7 +159,6 @@ page << <<EOJ
 
         currentFeature = null;
     }
-    
     function dataLoaded() { 
         $("status").innerHTML = "Loaded " + this.features.length + " features. (<a href='"+ this.url+"'>API</a>)";
         
@@ -256,17 +262,6 @@ page << <<EOJ
         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);