resources/halcyon.html

   1 <html>
   2
   3 <!-- Halcyon example embed script -->
   4
   5 <head>
   6 <title>Halcyon</title>
   7 <script type="text/javascript" src="swfobject.js"></script>
   8 </head>
   9
  10 <body>
  11
  12 <div id="map" style="width:800px; height: 600px; border: 1px solid black; float:left; margin-right: 10px">
  13 </div>
  14
  15 <script>
  16
  17         function respond(event,object,id,attr) {
  18                 alert (event+": "+object+" "+id+", highway="+attr['highway']);
  19         }
  20
  21         var fo = new SWFObject("halcyon_viewer.swf?d="+Math.round(Math.random()*1000), "mapswf", "100%", "100%", "9", "#FFFFFF");
  22         fo.addVariable("lat",51.875);
  23         fo.addVariable("lon",-1.482);
  24         fo.addVariable("zoom",14);
  25         fo.addVariable("api","http://www.openstreetmap.org/api/0.6/");
  26         fo.addVariable("policy","http://www.openstreetmap.org/api/crossdomain.xml");
  27         fo.addVariable("connection","AMF");
  28         fo.addVariable("responder","respond");
  29         fo.addVariable("tileurl","http://npe.openstreetmap.org/$z/$x/$y.png");
  30         fo.addVariable("style","test.css?d="+Math.round(Math.random()*1000));
  31         fo.addVariable("show_debug","false");
  32         fo.write("map");
  33
  34         function refreshCSS() {
  35                 if (document.getElementById("mapswf")) {
  36                         document.getElementById("mapswf").refreshCSS(document.getElementById("mapcss").value);
  37                 }
  38         }
  39
  40         function jumpTo() {
  41                 if (document.getElementById("mapswf")) {
  42                         document.getElementById("mapswf").jumpTo(document.getElementById("lat").value,document.getElementById("lon").value);
  43                 }
  44         }
  45
  46 </script>
  47
  48 <div id="ui">
  49 <p>Lat: <input id='lat' value='51.875' size='6'> Lon: <input id='lon' value='-1.482' size='6'>
  50 <input type='button' onClick='javascript:jumpTo();' value=" Go ">
  51 <p>
  52 <input type='button' onClick='javascript:refreshCSS();' value=" Refresh CSS ">
  53 <textarea cols=40 rows=40 id='mapcss'>
  54 /* Type MapCSS here */
  55 </textarea>
  56 </p>
  57 </div>
  58
  59 </body>
  60 </html>