8b2170706f91741dc4985aee96c7545e8cf3244a
[ikiwiki.git] / underlays / osm / ikiwiki / osm.js
1 // taken from http://stackoverflow.com/questions/901115/get-query-string-values-in-javascript
2 var urlParams = {};
3 (function () {
4         var e,
5         a = /\\+/g,  // Regex for replacing addition symbol with a space
6         r = /([^&=]+)=?([^&]*)/g,
7         d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
8         q = window.location.search.substring(1);
9
10         while (e = r.exec(q))
11         urlParams[d(e[1])] = d(e[2]);
12 })();
13
14 function mapsetup(divname, options) {
15         div = document.getElementById(divname);
16         if (options.fullscreen) {
17                 permalink = 'permalink';
18                 div.style.top = 0;
19                 div.style.left = 0;
20                 div.style.position = 'absolute';
21                 div.style.width = '100%';
22                 div.style.height = '100%';
23         }
24         else {
25                 div.style.height = options.height;
26                 div.style.width = options.width;
27                 div.style.float = options.float;
28                 permalink = {base: options.href, title: "View larger map"};
29         }
30         map = new OpenLayers.Map(divname, {
31                 controls: [
32                         new OpenLayers.Control.Navigation(),
33                         new OpenLayers.Control.ScaleLine(),
34                         new OpenLayers.Control.Permalink(permalink)
35                 ],
36                 displayProjection: new OpenLayers.Projection("EPSG:4326"),
37                 maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
38                 projection: "EPSG:900913",
39                 units: "m",
40                 maxResolution: 156543.0339,
41                 numZoomLevels: 19
42         });
43
44         for (x in options.layers_order) {
45                 layer = options.layers_order[x];
46                 console.log("setting up layer: " + layer + " with argument : " + options.layers[layer]);
47                 if (layer.indexOf("Google") >= 0) {
48                         if (options.google_apikey && options.google_apikey != 'null') {
49                                 var gtype = G_NORMAL_MAP;
50                                 var gtext = "";
51                                 if (options.layers[layer] == "Satellite") {
52                                         gtype = G_SATELLITE_MAP;
53                                 } else if (options.layers[layer] == "Hybrid") {
54                                         gtype = G_HYBRID_MAP // the normal map overlaying the satellite photographs
55                                 } else if (options.layers[layer] == "Physical") {
56                                         gtype = G_PHYSICAL_MAP // terrain information
57                                 }
58                                 // this nightmare is possible through http://docs.openlayers.org/library/spherical_mercator.html
59                                 googleLayer = new OpenLayers.Layer.Google(
60                                         "Google (" + options.layers[layer] + ")",
61                                         {type: gtype,
62                                          'sphericalMercator': true,
63                                          'maxExtent': new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
64                                          projection: new OpenLayers.Projection("EPSG:3857")}
65                                 );
66                                 map.addLayer(googleLayer);
67                         } else {
68                                 console.log("no API key defined for Google layer, skipping");
69                         }
70                 } else { // OSM
71                         if (options.layers[layer] != 1) {
72                                 l = options.layers[layer];
73                                 fqdn = l.split("/")[2].split(".");
74                                 text = fqdn[fqdn.length-2] + "." + fqdn[fqdn.length-1];
75                                 map.addLayer(new OpenLayers.Layer.OSM(layer + " (" + text + ")", l));
76                         } else {
77                                 map.addLayer(new OpenLayers.Layer.OSM(layer + " (Mapnik)"));
78                         }
79                 }
80         }
81
82         if (options.format == 'CSV') {
83                 pois = new OpenLayers.Layer.Text( "CSV",
84                         { location: options.csvurl,
85                           projection: new OpenLayers.Projection("EPSG:4326")
86                         });
87         } else if (options.format == 'GeoJSON') {
88                 pois = new OpenLayers.Layer.Vector("GeoJSON", {
89                         protocol: new OpenLayers.Protocol.HTTP({
90                                 url: options.jsonurl,
91                                 format: new OpenLayers.Format.GeoJSON()
92                         }),
93                         strategies: [new OpenLayers.Strategy.Fixed()],
94                         projection: new OpenLayers.Projection("EPSG:4326")
95                 });
96         } else {
97                 pois = new OpenLayers.Layer.Vector("KML", {
98                         protocol: new OpenLayers.Protocol.HTTP({
99                                 url: options.kmlurl,
100                                 format: new OpenLayers.Format.KML({
101                                         extractStyles: true,
102                                         extractAttributes: true
103                                 })
104                         }),
105                         strategies: [new OpenLayers.Strategy.Fixed()],
106                         projection: new OpenLayers.Projection("EPSG:4326")
107                 });
108         }
109         map.addLayer(pois);
110         select = new OpenLayers.Control.SelectFeature(pois);
111         map.addControl(select);
112         select.activate();
113
114         pois.events.on({
115                 "featureselected": function (event) {
116                         var feature = event.feature;
117                         var content = '<h2><a href="' + feature.attributes.href + '">' +feature.attributes.name + "</a></h2>" + feature.attributes.description;
118                         popup = new OpenLayers.Popup.FramedCloud("chicken",
119                                 feature.geometry.getBounds().getCenterLonLat(),
120                                 new OpenLayers.Size(100,100),
121                                 content,
122                                 null, true, function () {select.unselectAll()});
123                         feature.popup = popup;
124                         map.addPopup(popup);
125                 },
126                 "featureunselected": function (event) {
127                         var feature = event.feature;
128                         if (feature.popup) {
129                                 map.removePopup(feature.popup);
130                                 feature.popup.destroy();
131                                 delete feature.popup;
132                         }
133                 }
134         });
135
136         if (options.editable) {
137                 vlayer = new OpenLayers.Layer.Vector( "Editable" );
138                 map.addControl(new OpenLayers.Control.EditingToolbar(vlayer));
139                 map.addLayer(vlayer);
140         }
141
142         if (options.fullscreen) {
143                 map.addControl(new OpenLayers.Control.PanZoomBar());
144                 map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false}));
145                 map.addControl(new OpenLayers.Control.MousePosition());
146                 map.addControl(new OpenLayers.Control.KeyboardDefaults());
147         } else {
148                 map.addControl(new OpenLayers.Control.ZoomPanel());
149         }
150
151         //Set start centrepoint and zoom    
152         if (!options.lat || !options.lon) {
153                 options.lat = urlParams['lat'];
154                 options.lon = urlParams['lon'];
155         }
156         if (!options.zoom) {
157                 options.zoom = urlParams['zoom'];
158         }
159         if (options.lat && options.lon) {
160                 var lat = options.lat;
161                 var lon = options.lon;
162                 var zoom= options.zoom || 10;
163                 center = new OpenLayers.LonLat( lon, lat ).transform(
164                         new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984
165                         map.getProjectionObject() // to Spherical Mercator Projection
166                 );
167                 map.setCenter (center, zoom);
168         } else {
169                 pois.events.register("loadend", this, function () { map.zoomToExtent(pois.getDataExtent()); });
170         }
171 }