Add static embed-friendly html page.
[rails.git] / public / export / embed.html
1 <html xmlns="http://www.w3.org/1999/xhtml">
2   <head>
3     <style type="text/css">
4         #map {
5             width: 100%;
6             height: 100%;
7         }
8         .olControlAttribution {
9             bottom: 3px!important; 
10         }    
11     </style>
12     <script src="http://openstreetmap.org/openlayers/OpenLayers.js"></script>
13     <script src="http://openstreetmap.org/openlayers/OpenStreetMap.js"></script>
14     <script type="text/javascript">
15         var map, layer;
16         function localUpdateLink() {
17             var center = this.map.getCenter();
18             
19             // Map not initialized yet. Break out of this function.
20             if (!center) { 
21                 return; 
22             }
23
24             var params = OpenLayers.Util.getParameters(this.base);
25             
26             params.zoom = this.map.getZoom(); 
27             var lat = center.lat;
28             var lon = center.lon;
29             
30             if (this.displayProjection) {
31                 var mapPosition = OpenLayers.Projection.transform(
32                   { x: lon, y: lat }, 
33                   this.map.getProjectionObject(), 
34                   this.displayProjection );
35                 lon = mapPosition.x;  
36                 lat = mapPosition.y;  
37             }
38             
39             if (this.map.marker) {
40                 params.lat = Math.round(lat*100000)/100000;
41                 params.lon = Math.round(lon*100000)/100000;
42             } else {
43                 params.mlat = Math.round(lat*100000)/100000;
44                 params.mlon = Math.round(lon*100000)/100000;
45             }
46
47             var href = this.base;
48             if( href.indexOf('?') != -1 ){
49                 href = href.substring( 0, href.indexOf('?') );
50             }
51
52             href += '?' + OpenLayers.Util.getParameterString(params);
53             this.element.href = href;
54         }
55
56         function init(){
57             OpenLayers.Lang.en.permalink = "Larger Map";
58             map = new OpenLayers.Map ("map", {
59               controls:[
60                   new OpenLayers.Control.Attribution(),
61                   new OpenLayers.Control.ArgParser(),
62                   new OpenLayers.Control.Navigation(), 
63                   new OpenLayers.Control.Permalink(null, "http://openstreetmap.org/", {updateLink:localUpdateLink})],
64               maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,
65                                                20037508.34,20037508.34),
66               numZoomLevels:20, 
67               maxResolution:156543.0339,
68               displayProjection: new OpenLayers.Projection("EPSG:4326"),
69               units:'m', 
70               projection: new OpenLayers.Projection("EPSG:900913")
71             } );          
72             var mapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik", {
73                displayOutsideMaxExtent: true,
74                wrapDateLine: true,
75                attribution: '<a target="_parent" href="http://www.openstreetmap.org">OpenStreetMap</a>'
76             });
77             map.addLayer(mapnik);
78
79             var osmarender = new OpenLayers.Layer.OSM.Osmarender("Osmarender", {
80                displayOutsideMaxExtent: true,
81                wrapDateLine: true,
82                attribution: '<a target="_parent" href="http://www.openstreetmap.org">OpenStreetMap</a>'
83             });
84             map.addLayer(osmarender); 
85             var args = OpenLayers.Util.getParameters();
86             if (args.marker && map.getCenter()) {
87                 var markers = new OpenLayers.Layer.Markers();
88                 map.addLayer(markers);
89                 markers.addMarker( new OpenLayers.Marker(map.getCenter()));
90                 map.marker = true;
91             }    
92             if (!map.getCenter()) { map.zoomToMaxExtent(); }
93             var size = map.getSize();
94             if (size.h > 320) { 
95                 map.addControl(new OpenLayers.Control.PanZoomBar());
96             } else {
97                 map.addControl(new OpenLayers.Control.PanZoom());
98             }   
99         }
100     </script>
101   </head>
102   <body onload="init()">
103     <div id="map"></div>
104   </body>
105 </html>