Remove the noname layer and add the transport and MapQuest layers
[rails.git] / app / assets / javascripts / map.js.erb
1 var epsg4326 = new OpenLayers.Projection("EPSG:4326");
2 var map;
3 var markers;
4 var vectors;
5 var popup;
6
7 function createMap(divName, options) {
8    options = options || {};
9
10    map = new OpenLayers.Map(divName, {
11       controls: options.controls || [
12          new OpenLayers.Control.ArgParser(),
13          new OpenLayers.Control.Attribution(),
14          new OpenLayers.Control.LayerSwitcher(),
15          new OpenLayers.Control.Navigation(),
16          new OpenLayers.Control.PanZoom(),
17          new OpenLayers.Control.PanZoomBar(),
18          new OpenLayers.Control.ScaleLine({geodesic: true})
19       ],
20       units: "m",
21       maxResolution: 156543.0339,
22       numZoomLevels: 20,
23       displayProjection: new OpenLayers.Projection("EPSG:4326")
24    });
25
26    var mapnik = new OpenLayers.Layer.OSM.Mapnik(i18n("javascripts.map.base.mapnik"), {
27       keyid: "mapnik",
28       displayOutsideMaxExtent: true,
29       wrapDateLine: true,
30       layerCode: "M"
31    });
32    map.addLayer(mapnik);
33
34    var osmarender = new OpenLayers.Layer.OSM.Osmarender(i18n("javascripts.map.base.osmarender"), {
35       keyid: "osmarender",
36       displayOutsideMaxExtent: true,
37       wrapDateLine: true,
38       layerCode: "O"
39    });
40    map.addLayer(osmarender);
41
42    var cyclemap = new OpenLayers.Layer.OSM.CycleMap(i18n("javascripts.map.base.cycle_map"), {
43       keyid: "cyclemap",
44       displayOutsideMaxExtent: true,
45       wrapDateLine: true,
46       layerCode: "C"
47    });
48    map.addLayer(cyclemap);
49
50    var transportmap = new OpenLayers.Layer.OSM.TransportMap(i18n("javascripts.map.base.transport_map"), {
51       keyid: "transportmap",
52       displayOutsideMaxExtent: true,
53       wrapDateLine: true,
54       layerCode: "T"
55    });
56    map.addLayer(transportmap);
57
58    var mapquest = new OpenLayers.Layer.OSM(i18n("javascripts.map.base.mapquest"), [
59       "http://otile1.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png",
60       "http://otile2.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png",
61       "http://otile3.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png",
62       "http://otile4.mqcdn.com/tiles/1.0.0/osm/${z}/${x}/${y}.png"
63    ], {
64       keyid: "mapquest",
65       displayOutsideMaxExtent: true,
66       wrapDateLine: true,
67       numZoomLevels: 19,
68       layerCode: "Q"
69    });
70    map.addLayer(mapquest);
71
72    var numZoomLevels = Math.max(mapnik.numZoomLevels, osmarender.numZoomLevels);
73
74    markers = new OpenLayers.Layer.Markers("Markers", {
75       displayInLayerSwitcher: false,
76       numZoomLevels: numZoomLevels,
77       maxExtent: new OpenLayers.Bounds(-20037508,-20037508,20037508,20037508),
78       maxResolution: 156543,
79       units: "m",
80       projection: "EPSG:900913"
81    });
82    map.addLayer(markers);
83
84    return map;
85 }
86
87 function getArrowIcon() {
88    var size = new OpenLayers.Size(25, 22);
89    var offset = new OpenLayers.Pixel(-30, -27);
90    var icon = new OpenLayers.Icon("<%= asset_path 'arrow.png' %>", size, offset);
91
92    return icon;
93 }
94
95 function addMarkerToMap(position, icon, description) {
96    var marker = new OpenLayers.Marker(position.clone().transform(epsg4326, map.getProjectionObject()), icon);
97
98    markers.addMarker(marker);
99
100    if (description) {
101       marker.events.register("mouseover", marker, function() { openMapPopup(marker, description) });
102    }
103
104    return marker;
105 }
106
107 function addObjectToMap(url, zoom, callback) {
108    var layer = new OpenLayers.Layer.GML("Objects", url, {
109       format: OpenLayers.Format.OSM,
110       style: {
111           strokeColor: "blue",
112           strokeWidth: 3,
113           strokeOpacity: 0.5,
114           fillOpacity: 0.2,
115           fillColor: "lightblue",
116           pointRadius: 6
117       },
118       projection: new OpenLayers.Projection("EPSG:4326"),
119       displayInLayerSwitcher: false
120    });
121
122    layer.events.register("loadend", layer, function() {
123       var extent;
124
125       if (this.features.length) {
126          extent = this.features[0].geometry.getBounds();
127
128          for (var i = 1; i < this.features.length; i++) {
129             extent.extend(this.features[i].geometry.getBounds());
130          }
131
132          if (zoom) {
133             if (extent) {
134                this.map.zoomToExtent(extent);
135             } else {
136                this.map.zoomToMaxExtent();
137             }
138          }
139       }
140
141       if (callback) {
142          callback(extent);
143       }
144    });
145
146    map.addLayer(layer);
147
148    layer.loadGML();
149 }
150
151 function addBoxToMap(boxbounds, id, outline) {
152    if (!vectors) {
153      // Be aware that IE requires Vector layers be initialised on page load, and not under deferred script conditions
154      vectors = new OpenLayers.Layer.Vector("Boxes", {
155         displayInLayerSwitcher: false
156      });
157      map.addLayer(vectors);
158    }
159    var geometry;
160    if (outline) {
161      vertices = boxbounds.toGeometry().getVertices();
162      vertices.push(new OpenLayers.Geometry.Point(vertices[0].x, vertices[0].y));
163      geometry = new OpenLayers.Geometry.LineString(vertices).transform(epsg4326, map.getProjectionObject());
164    } else {
165      geometry = boxbounds.toGeometry().transform(epsg4326, map.getProjectionObject());
166    }
167    var box = new OpenLayers.Feature.Vector(geometry, {}, {
168       strokeWidth: 2,
169       strokeColor: '#ee9900',
170       fillOpacity: 0
171    });
172    box.fid = id;
173
174    vectors.addFeatures(box);
175
176    return box;
177 }
178
179 function openMapPopup(marker, description) {
180    closeMapPopup();
181
182    popup = new OpenLayers.Popup.FramedCloud("popup", marker.lonlat, null,
183                                             description, marker.icon, true);
184    popup.setBackgroundColor("#E3FFC5");
185    map.addPopup(popup);
186
187    return popup;
188 }
189
190 function closeMapPopup() {
191    if (popup) {
192       map.removePopup(popup);
193       delete popup;
194    }
195 }
196
197 function removeMarkerFromMap(marker){
198    markers.removeMarker(marker);
199 }
200
201 function removeBoxFromMap(box){
202    vectors.removeFeature(box);
203 }
204
205 function getMapCenter() {
206    return map.getCenter().clone().transform(map.getProjectionObject(), epsg4326);
207 }
208
209 function setMapCenter(center, zoom) {
210    zoom = parseInt(zoom);
211    var numzoom = map.getNumZoomLevels();
212    if (zoom >= numzoom) zoom = numzoom - 1;
213    map.setCenter(center.clone().transform(epsg4326, map.getProjectionObject()), zoom);
214 }
215
216 function setMapExtent(extent) {
217    map.zoomToExtent(extent.clone().transform(epsg4326, map.getProjectionObject()));
218 }
219
220 function getMapExtent() {
221    return map.getExtent().clone().transform(map.getProjectionObject(), epsg4326);
222 }
223
224 function getMapZoom() {
225    return map.getZoom();
226 }
227
228 function getEventPosition(event) {
229    return map.getLonLatFromViewPortPx(event.xy).clone().transform(map.getProjectionObject(), epsg4326);
230 }
231
232 function getMapLayers() {
233    var layerConfig = "";
234
235    for (var i = 0; i < map.layers.length; i++) {
236       if (map.layers[i].layerCode && map.layers[i].getVisibility()) {
237          layerConfig += map.layers[i].layerCode;
238       }
239    }
240
241    return layerConfig;
242 }
243
244 function setMapLayers(layerConfig) {
245    if (layerConfig.charAt(0) == "B" || layerConfig.charAt(0) == "0") {
246       var l = 0;
247
248       for (var layers = map.getLayersBy("isBaseLayer", true), i = 0; i < layers.length; i++) {
249          var c = layerConfig.charAt(l++);
250
251          if (c == "B") {
252             map.setBaseLayer(layers[i]);
253          } else {
254             map.layers[i].setVisibility(false);
255          }
256       }
257    } else {
258       for (var i = 0; i < map.layers.length; i++) {
259          if (map.layers[i].layerCode) {
260             if (layerConfig.indexOf(map.layers[i].layerCode) >= 0) {
261                if (map.layers[i].isBaseLayer) {
262                   map.setBaseLayer(map.layers[i]);
263                } else {
264                   map.layers[i].setVisibility(true);
265                }
266             } else {
267                map.layers[i].setVisibility(false);
268             }
269          }
270       }
271    }
272 }
273
274 function scaleToZoom(scale) {
275    return Math.log(360.0/(scale * 512.0)) / Math.log(2.0);
276 }