Changeset 172 for trunk/npemap.org.uk
- Timestamp:
- Oct 25, 2006, 4:20:41 PM (14 years ago)
- Location:
- trunk/npemap.org.uk/static/tiles
- Files:
-
- 2 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/npemap.org.uk/static/tiles/map.html
r164 r172 66 66 </div> 67 67 </div> 68 </div>69 <div id="map_container" style="float:left">70 <div id="marker">71 <img src='../images/yellow-marker.gif' alt="Your location"/>72 </div>73 68 <div id="postcode_form"> 74 69 <form method="post" action="../../cgi/submit.fcgi"> … … 88 83 <span class="terms">By clicking submit you agree to release this information into the public domain.</span> 89 84 </div> 85 </div> 86 <div id="map_container" style="float:left"> 87 <div id="marker"> 88 <img src='../images/yellow-marker.gif' alt="Your location"/> 89 </div> 90 90 <!-- 91 91 <div id="postcodeinfo"> -
trunk/npemap.org.uk/static/tiles/mapTiles.js
r171 r172 20 20 21 21 var prefixes = new Array(1); 22 var root = "http:// tile.npemap.org.uk/";22 var root = "http://ustile.npemap.org.uk/"; 23 23 24 24 prefixes[1] = root + "scaled1/"; … … 32 32 jumpIn[2] = 3; 33 33 jumpIn[3] = 2; 34 35 var zooms = new Array(1); 36 zooms[1] = 1; 37 zooms[2] = 3; 38 zooms[3] = 6; 34 39 35 40 var prefix; … … 48 53 var spinnerElement; 49 54 55 56 // From prototype 57 function $() { 58 var results = [], element; 59 for (var i = 0; i < arguments.length; i++) { 60 element = arguments[i]; 61 if (typeof element == 'string') 62 element = document.getElementById(element); 63 results.push(element); 64 } 65 return results.length < 2 ? results[0] : results; 66 } 67 50 68 function box1Keypress(e) { 51 69 var event = YAHOO.util.Event.getEvent(e); 52 70 var key = String.fromCharCode(YAHOO.util.Event.getCharCode(event)); 53 71 if (key == ' ') { 54 document.getElementById('postcode2').focus();72 $('postcode2').focus(); 55 73 return false; 56 74 } else if (key >= '0' && key <= '9' && this.value.length == 3) { 57 75 this.value = this.value + key; 58 document.getElementById('postcode2').focus();76 $('postcode2').focus(); 59 77 YAHOO.util.Event.preventDefault(event); 60 78 } … … 81 99 if (zoomLevel != 1) { 82 100 // Zoom in. 83 84 offsetGridX = Math.round((baseEasting -0 + tileXratio) * jumpIn[zoomLevel]); 85 offsetGridY = Math.round((baseNorthing -0 + tileYratio) * jumpIn[zoomLevel]); 86 87 zoomLevel = zoomLevel - 1; 88 fixZoomButton(); 89 refreshGrid(); 101 gotoLocation(Math.round((baseEasting -0 + tileXratio) * zooms[zoomLevel]), 102 Math.round((baseNorthing -0 + tileYratio) * zooms[zoomLevel]), 103 zoomLevel - 1); 90 104 } else { 91 105 … … 95 109 YAHOO.util.Dom.setXY(markerElement, [(x-markerXOffset), (y-markerYOffset)]); 96 110 markerElement.style.visibility = 'visible'; 97 111 98 112 postcodeFormElement.style.display = 'block'; 99 113 YAHOO.util.Dom.setXY(postcodeFormElement, [Math.max(0, (x-50)), (y-180) < 0 ? (y+10):(y-180)]); 100 locationElement.innerHTML = easting + ', ' + northing ; 101 document.getElementById('easting').value = easting; 102 document.getElementById('northing').value = northing; 103 document.getElementById('returnX').value = offsetGridX; 104 document.getElementById('returnY').value = offsetGridY; 105 106 document.getElementById('postcode1').value = ""; 107 document.getElementById('postcode2').value = ""; 108 document.getElementById('postcode1').focus(); 114 fixIE(postcodeFormElement); 115 locationElement.innerHTML = easting + ', ' + northing ; 116 $('easting').value = easting; 117 $('northing').value = northing; 118 $('returnX').value = offsetGridX; 119 $('returnY').value = offsetGridY; 120 121 $('postcode1').value = ""; 122 $('postcode2').value = ""; 123 $('postcode1').focus(); 109 124 } 110 125 } … … 124 139 } 125 140 removeMarkers(); 126 127 offsetGridX = Math.round(offsetGridX / jumpOut[zoomLevel]); 128 offsetGridY = Math.round(offsetGridY / jumpOut[zoomLevel]); 129 130 zoomLevel = zoomLevel + 1; 131 fixZoomButton(); 132 133 refreshGrid(); 141 closePostcodeWindow(); 142 143 gotoLocation(offsetGridX * zooms[zoomLevel], offsetGridY * zooms[zoomLevel], zoomLevel + 1); 134 144 } 135 145 … … 139 149 } 140 150 141 offsetGridX = (offsetGridX * jumpIn[zoomLevel]); 142 offsetGridY = (offsetGridY * jumpIn[zoomLevel]); 143 144 zoomLevel = zoomLevel - 1; 145 146 fixZoomButton(); 147 refreshGrid(); 151 gotoLocation(offsetGridX * zooms[zoomLevel], offsetGridY * zooms[zoomLevel], zoomLevel - 1); 148 152 } 149 153 … … 151 155 prefix = prefixes[zoomLevel]; 152 156 if(zoomLevel == 1) { 153 document.getElementById('zoomin_enabled').style.visibility = 'hidden';154 document.getElementById('zoomin_disabled').style.visibility = 'visible';157 $('zoomin_enabled').style.visibility = 'hidden'; 158 $('zoomin_disabled').style.visibility = 'visible'; 155 159 } else { 156 document.getElementById('zoomin_enabled').style.visibility = 'visible';157 document.getElementById('zoomin_disabled').style.visibility = 'hidden';160 $('zoomin_enabled').style.visibility = 'visible'; 161 $('zoomin_disabled').style.visibility = 'hidden'; 158 162 } 159 163 } … … 169 173 sizeGridX = Math.round((screenWidth / tileWidth)-2) 170 174 sizeGridY = Math.round((screenHeight / tileHeight)-1) 171 mapElement = document.getElementById('map');175 mapElement = $('map'); 172 176 173 177 page = '' … … 183 187 184 188 189 function fixIE(hoverDiv) { 190 if (document.all) 191 { 192 hoverDiv.zIndex = 10; 193 } 194 } 195 185 196 186 197 function initializePage() { 187 mapElement = document.getElementById('map');188 mapContainerElement = document.getElementById('map_container');189 markerElement = document.getElementById('marker');190 postcodeFormElement = document.getElementById('postcode_form');191 locationElement = document.getElementById('location');192 mainPageElement = document.getElementById('main_page');193 spinnerElement = document.getElementById('spinner');198 mapElement = $('map'); 199 mapContainerElement = $('map_container'); 200 markerElement = $('marker'); 201 postcodeFormElement = $('postcode_form'); 202 locationElement = $('location'); 203 mainPageElement = $('main_page'); 204 spinnerElement = $('spinner'); 194 205 size = 1000; 195 206 … … 223 234 224 235 function gotoLocation(easting, northing, zoom) { 225 offsetGridX = easting;226 offsetGridY = northing;236 offsetGridX = Math.round(easting / zooms[zoom]); 237 offsetGridY = Math.round(northing/ zooms[zoom]); 227 238 zoomLevel = zoom; 228 239 fixZoomButton(); … … 249 260 tileX = trimNumber(x+offsetGridX-Math.round(sizeGridX/2)); 250 261 tileY = trimNumber(y+offsetGridY-Math.round(sizeGridY/2)); 251 document.getElementById('element' + x + '.' + y).src = prefix+tileX+'/'+ tileY + '.jpg';262 $('element' + x + '.' + y).src = prefix+tileX+'/'+ tileY + '.jpg'; 252 263 } 253 264 } … … 272 283 removeMarkers(); 273 284 spinnerElement.className = 'loading'; 274 spinnerElement.innerH tml= 'Loading...';285 spinnerElement.innerHTML = 'Loading...'; 275 286 findMarkerOffsets(); 276 287 … … 304 315 // Don't do anything 305 316 spinnerElement.className = 'error'; 306 spinnerElement.innerH tml= 'Problem showing existing data.';317 spinnerElement.innerHTML = 'Problem showing existing data.'; 307 318 } 308 319 … … 311 322 312 323 function removeMarkers() { 313 var pageElement = document.getElementById('main_page');324 var pageElement = $('main_page'); 314 325 for(var i=0; i<nextMarker; i=i+1) { 315 326 markers[i].style.visibility = 'hidden'; … … 356 367 357 368 function updatePermalink() { 358 document.getElementById("permalink").href = "#" + getLink();369 $("permalink").href = "#" + getLink(); 359 370 location.href = '#'+getLink(); 360 371 } … … 365 376 366 377 function updateGrid(theDirection) { 367 markerElement.style.visibility = 'hidden';378 closePostcodeWindow(); 368 379 if ( theDirection == 'right' ) { 369 380 if ( offsetGridX < size-sizeGridX ) … … 389 400 390 401 function find() { 391 request = 'http://ws.geonames.org/searchJSON?name=' + encodeURIComponent( document.getElementById('where').value) + '&maxRows=1&callback=getLocation&country=GB&fclass=P&style=SHORT';402 request = 'http://ws.geonames.org/searchJSON?name=' + encodeURIComponent($('where').value) + '&maxRows=1&callback=getLocation&country=GB&fclass=P&style=SHORT'; 392 403 aObj = new JSONscriptRequest(request); 393 404 // Build the script tag … … 414 425 gotoLocation(easting, northing, 1); 415 426 416 document.getElementById('where').value = '';427 $('where').value = ''; 417 428 } 418 429 else {
Note: See TracChangeset
for help on using the changeset viewer.