diff options
-rw-r--r-- | IkiWiki/Plugin/osm.pm | 136 | ||||
-rw-r--r-- | underlays/osm/ikiwiki/javascript/osm.js | 128 |
2 files changed, 131 insertions, 133 deletions
diff --git a/IkiWiki/Plugin/osm.pm b/IkiWiki/Plugin/osm.pm index 0fd7ca400..e85d4be62 100644 --- a/IkiWiki/Plugin/osm.pm +++ b/IkiWiki/Plugin/osm.pm @@ -561,139 +561,9 @@ sub cgi($) { } sub embed_map_code() { - return <<EOF; -<script src="http://www.openlayers.org/api/OpenLayers.js"></script> -<script> -// taken from http://stackoverflow.com/questions/901115/get-query-string-values-in-javascript -var urlParams = {}; -(function () { - var e, - a = /\\+/g, // Regex for replacing addition symbol with a space - r = /([^&=]+)=?([^&]*)/g, - d = function (s) { return decodeURIComponent(s.replace(a, " ")); }, - q = window.location.search.substring(1); - - while (e = r.exec(q)) - urlParams[d(e[1])] = d(e[2]); -})(); - -function mapsetup(divname, options) { - div = document.getElementById(divname); - if (options.fullscreen) { - permalink = 'permalink'; - div.style.top = 0; - div.style.left = 0; - div.style.position = 'absolute'; - div.style.width = '100%'; - div.style.height = '100%'; - } - else { - div.style.height = options.height; - div.style.width = options.width; - div.style.float = options.float; - permalink = {base: options.href, title: "View larger map"}; - } - map = new OpenLayers.Map(divname, { - controls: [ - new OpenLayers.Control.Navigation(), - new OpenLayers.Control.ScaleLine(), - new OpenLayers.Control.Permalink(permalink) - ], - displayProjection: new OpenLayers.Projection("EPSG:4326"), - numZoomLevels: 18 - }); - - - map.addLayer(new OpenLayers.Layer.OSM()); - if (options.format == 'CSV') { - pois = new OpenLayers.Layer.Text( "CSV", - { location:"/" + options.map + "/pois.txt", - projection: map.displayProjection - }); - } else if (options.format == 'GeoJSON') { - pois = new OpenLayers.Layer.Vector("GeoJSON", { - protocol: new OpenLayers.Protocol.HTTP({ - url: "/" + options.map + "/pois.json", - format: new OpenLayers.Format.GeoJSON() - }), - strategies: [new OpenLayers.Strategy.Fixed()] - }); - } else { - pois = new OpenLayers.Layer.Vector("KML", { - protocol: new OpenLayers.Protocol.HTTP({ - url: "/" + options.map + "/pois.kml", - format: new OpenLayers.Format.KML({ - extractStyles: true, - extractAttributes: true - }) - }), - strategies: [new OpenLayers.Strategy.Fixed()]}); - } - map.addLayer(pois); - select = new OpenLayers.Control.SelectFeature(pois); - map.addControl(select); - select.activate(); - - pois.events.on({ - "featureselected": function (event) { - var feature = event.feature; - var content = '<h2><a href="' + feature.attributes.href + '">' +feature.attributes.name + "</a></h2>" + feature.attributes.description; - popup = new OpenLayers.Popup.FramedCloud("chicken", - feature.geometry.getBounds().getCenterLonLat(), - new OpenLayers.Size(100,100), - content, - null, true, function () {select.unselectAll()}); - feature.popup = popup; - map.addPopup(popup); - }, - "featureunselected": function (event) { - var feature = event.feature; - if (feature.popup) { - map.removePopup(feature.popup); - feature.popup.destroy(); - delete feature.popup; - } - } - }); - - if (options.editable) { - vlayer = new OpenLayers.Layer.Vector( "Editable" ); - map.addControl(new OpenLayers.Control.EditingToolbar(vlayer)); - map.addLayer(vlayer); - } - - if (options.fullscreen) { - map.addControl(new OpenLayers.Control.PanZoomBar()); - map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false})); - map.addControl(new OpenLayers.Control.MousePosition()); - map.addControl(new OpenLayers.Control.KeyboardDefaults()); - } else { - map.addControl(new OpenLayers.Control.ZoomPanel()); - } - - //Set start centrepoint and zoom - if (!options.lat || !options.lon) { - options.lat = urlParams['lat']; - options.lon = urlParams['lon']; - } - if (!options.zoom) { - options.zoom = urlParams['zoom']; - } - if (options.lat && options.lon) { - var lat = options.lat; - var lon = options.lon; - var zoom= options.zoom || 10; - center = new OpenLayers.LonLat( lon, lat ).transform( - new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984 - map.getProjectionObject() // to Spherical Mercator Projection - ); - map.setCenter (center, zoom); - } else { - pois.events.register("loadend", this, function () { map.zoomToExtent(pois.getDataExtent()); }); - } -} -</script> -EOF + return '<script src="http://www.openlayers.org/api/OpenLayers.js" type="text/javascript" charset="utf-8"></script>'. + '<script src="'.urlto("ikiwiki/osm.js", $from). + '" type="text/javascript" charset="utf-8"></script>'."\n"; } 1; diff --git a/underlays/osm/ikiwiki/javascript/osm.js b/underlays/osm/ikiwiki/javascript/osm.js new file mode 100644 index 000000000..7994c62fc --- /dev/null +++ b/underlays/osm/ikiwiki/javascript/osm.js @@ -0,0 +1,128 @@ +// taken from http://stackoverflow.com/questions/901115/get-query-string-values-in-javascript +var urlParams = {}; +(function () { + var e, + a = /\\+/g, // Regex for replacing addition symbol with a space + r = /([^&=]+)=?([^&]*)/g, + d = function (s) { return decodeURIComponent(s.replace(a, " ")); }, + q = window.location.search.substring(1); + + while (e = r.exec(q)) + urlParams[d(e[1])] = d(e[2]); +})(); + +function mapsetup(divname, options) { + div = document.getElementById(divname); + if (options.fullscreen) { + permalink = 'permalink'; + div.style.top = 0; + div.style.left = 0; + div.style.position = 'absolute'; + div.style.width = '100%'; + div.style.height = '100%'; + } + else { + div.style.height = options.height; + div.style.width = options.width; + div.style.float = options.float; + permalink = {base: options.href, title: "View larger map"}; + } + map = new OpenLayers.Map(divname, { + controls: [ + new OpenLayers.Control.Navigation(), + new OpenLayers.Control.ScaleLine(), + new OpenLayers.Control.Permalink(permalink) + ], + displayProjection: new OpenLayers.Projection("EPSG:4326"), + numZoomLevels: 18 + }); + + + map.addLayer(new OpenLayers.Layer.OSM()); + if (options.format == 'CSV') { + pois = new OpenLayers.Layer.Text( "CSV", + { location:"/" + options.map + "/pois.txt", + projection: map.displayProjection + }); + } else if (options.format == 'GeoJSON') { + pois = new OpenLayers.Layer.Vector("GeoJSON", { + protocol: new OpenLayers.Protocol.HTTP({ + url: "/" + options.map + "/pois.json", + format: new OpenLayers.Format.GeoJSON() + }), + strategies: [new OpenLayers.Strategy.Fixed()] + }); + } else { + pois = new OpenLayers.Layer.Vector("KML", { + protocol: new OpenLayers.Protocol.HTTP({ + url: "/" + options.map + "/pois.kml", + format: new OpenLayers.Format.KML({ + extractStyles: true, + extractAttributes: true + }) + }), + strategies: [new OpenLayers.Strategy.Fixed()]}); + } + map.addLayer(pois); + select = new OpenLayers.Control.SelectFeature(pois); + map.addControl(select); + select.activate(); + + pois.events.on({ + "featureselected": function (event) { + var feature = event.feature; + var content = '<h2><a href="' + feature.attributes.href + '">' +feature.attributes.name + "</a></h2>" + feature.attributes.description; + popup = new OpenLayers.Popup.FramedCloud("chicken", + feature.geometry.getBounds().getCenterLonLat(), + new OpenLayers.Size(100,100), + content, + null, true, function () {select.unselectAll()}); + feature.popup = popup; + map.addPopup(popup); + }, + "featureunselected": function (event) { + var feature = event.feature; + if (feature.popup) { + map.removePopup(feature.popup); + feature.popup.destroy(); + delete feature.popup; + } + } + }); + + if (options.editable) { + vlayer = new OpenLayers.Layer.Vector( "Editable" ); + map.addControl(new OpenLayers.Control.EditingToolbar(vlayer)); + map.addLayer(vlayer); + } + + if (options.fullscreen) { + map.addControl(new OpenLayers.Control.PanZoomBar()); + map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false})); + map.addControl(new OpenLayers.Control.MousePosition()); + map.addControl(new OpenLayers.Control.KeyboardDefaults()); + } else { + map.addControl(new OpenLayers.Control.ZoomPanel()); + } + + //Set start centrepoint and zoom + if (!options.lat || !options.lon) { + options.lat = urlParams['lat']; + options.lon = urlParams['lon']; + } + if (!options.zoom) { + options.zoom = urlParams['zoom']; + } + if (options.lat && options.lon) { + var lat = options.lat; + var lon = options.lon; + var zoom= options.zoom || 10; + center = new OpenLayers.LonLat( lon, lat ).transform( + new OpenLayers.Projection("EPSG:4326"), // transform from WGS 1984 + map.getProjectionObject() // to Spherical Mercator Projection + ); + map.setCenter (center, zoom); + } else { + pois.events.register("loadend", this, function () { map.zoomToExtent(pois.getDataExtent()); }); + } +} |