source: trunk/npemap.org.uk/static/index.html @ 284

Last change on this file since 284 was 284, checked in by David Sheldon, 13 years ago

Reword link.

File size: 4.2 KB
Line 
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
2<html>
3  <head>
4    <title>New Popular Edition Maps</title>
5    <link rel="stylesheet" type="text/css" href="default.css">
6  </head>
7  <body>
8<script src="tiles/yahoo.js" type="text/javascript"></script> 
9<script src="tiles/dom.js" type="text/javascript"></script> 
10<script src="tiles/event.js" type="text/javascript"></script> 
11<script src="tiles/jsr_class.js" type="text/javascript"></script> 
12<script src="tiles/jscoord-1.1.1.js" type="text/javascript"></script> 
13<div id='theTitle'>
14<h1>New Popular Mapping<sup>beta</sup></h1>
15</div>
16<div id="body">
17
18<div class="left-col"> 
19<ul>
20<li>Want to keep updated? <a href="news/">News</a> <a href="news/index.rss" class="feed">RSS</a></li>
21<li>Questions? <a href="FAQ.html">FAQ</a></li>
22<li>Problems? <a href="reportBug.html">Tell us</a></li>
23<li>Scotland? Northern Ireland? <a href="scotlandAndNI.html">Be informed</a></li>
24<li>Worried about your data? <a href="privacy.html">Privacy policy</a></li>
25<li>Interested in our maps? <a href="tileLicence.html">Licence</a></li>
26</ul>
27
28<ul>
29<li><a href="data/">Download postcode data</a></li>
30<li><a href="postcodeine/">Show postcodes on map</a></li>
31</ul>
32
33<!--#include virtual="stats.html" -->
34
35</div>
36<div class="mid-col"> 
37
38<p> Have a look round what the country looked like in the 1940s. Click on the
39map to the right to start, you can then scroll around and zoom in.  </p>
40
41<p> Whilst looking around, you can tell us about the postcode of where you are
42looking. We want to collect information about where postcodes are now by
43finding them on old maps.</p>
44<p>All you need to do is click on the the point in the map and fill in the
45postcode. Why not add your house, your place of work, and those of your
46friends and family, to help us build a free postcode database?
47There is more detail about why we want to do this in
48the <a href="FAQ.html">FAQ</a>.</p>
49
50</div>
51<div class="right-col">
52<p>
53Click on the map to zoom in and get on with it.
54</p>
55<a href="#" id="link">
56<img src="thumbnail.jpg" alt="Click this map to zoom"/>
57</a>
58
59<form onsubmit="return find()" action="">
60<p><label for="where">Place:</label>
61<input id="where" name="where" />
62<input type="submit" name="Zoom To" value="Go" /></p>
63</form>
64      <span class="terms">Functionality by <a href="http://www.geonames.org/">Geonames</a>.</span>
65</div>
66
67<script type="text/javascript">
68var ROOTURL = ".";
69
70var xOffset = 62;
71
72function find() {
73   request = 'http://ws.geonames.org/searchJSON?name=' +  encodeURIComponent(document.getElementById('where').value)  + '&maxRows=1&callback=getLocation&country=GB&fclass=P&style=SHORT';
74  aObj = new JSONscriptRequest(request);
75  // Build the script tag
76  aObj.buildScriptTag();
77  // Execute (add) the script tag
78  aObj.addScriptTag();
79  return false;
80}
81
82// this function will be called by our JSON callback
83function getLocation(jData) {
84  if (jData == null) {
85    // There was a problem parsing search results
86    return;
87  }
88
89  var geonames = jData.geonames;
90  if (geonames.length > 0) {
91    var name = geonames[0];
92    var ll = new LatLng(name.lat,name.lng);
93    ll.WGS84ToOSGB36();
94    var en = ll.toOSRef();
95    var easting = Math.round(en.easting/1000);
96    var northing = Math.round(en.northing/1000);
97    location.href = urlFor(easting, northing, 1);
98  }
99  else {
100    alert("Sorry, can't find that location"); 
101  }
102}
103
104
105
106function click(e) {
107       
108  e = YAHOO.util.Event.getEvent(e);
109  var img = YAHOO.util.Event.getTarget(e);
110  var imgPos = YAHOO.util.Dom.getXY(img);
111
112        var x = (xOffset + YAHOO.util.Event.getPageX(e) - imgPos[0]) * 2;
113        var y = (img.height-(YAHOO.util.Event.getPageY(e) - imgPos[1])) * 2;
114
115        location.href=(urlFor(x, y, 3));
116
117        YAHOO.util.Event.stopEvent(e);
118}
119
120YAHOO.util.Event.addListener("link", "click", click);
121
122var zooms = new Array(1);
123zooms[1] = 1;
124zooms[2] = 3;
125zooms[3] = 6;
126
127function urlFor(easting, northing, zoom) {
128  var x= Math.round(easting / zooms[zoom]); 
129  var y= Math.round(northing/ zooms[zoom]); 
130  return ROOTURL + "/tiles/map.html#" +  x + "," + y +","+zoom;
131}
132
133</script>
134
135</div>
136<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
137</script>
138<script type="text/javascript">
139_uacct = "UA-732621-2";
140if (typeof urchinTracker == 'function') urchinTracker();
141</script>
142  </body>
143</html>
Note: See TracBrowser for help on using the repository browser.