Changeset 16


Ignore:
Timestamp:
Oct 11, 2006, 2:30:36 PM (13 years ago)
Author:
David Sheldon
Message:

Some more work on getting the entry box working.

Location:
trunk/npemap.org.uk/static/tiles
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • trunk/npemap.org.uk/static/tiles/grid.css

    r9 r16  
    1313      background-color: blue;
    1414      visibility: hidden;
     15                        z-index: 1
    1516    }
    1617    #postcode_form {
     
    2324      width: 300px;
    2425      height: 100px;
     26                        z-index: 1
    2527    }
    2628
  • trunk/npemap.org.uk/static/tiles/map.html

    r9 r16  
    4646  <div id="postcode_form">
    4747    <div style="text-align: right;"><a href="javascript:closePostcodeWindow()" title="close">X</a></div>
     48                <div><span id="location"></span></div>
    4849    <div><label for="postcode">Enter the postcode...</label></div>
    4950    <div><input type="text" id="postcode" /></div>
  • trunk/npemap.org.uk/static/tiles/mapTiles.js

    r9 r16  
    1212
    1313
    14 var offsetGridX = 425;
    15 var offsetGridY = 297;
     14var offsetGridX = 450;
     15var offsetGridY = 207;
    1616
    1717var zoomLevel = 1;
  • trunk/npemap.org.uk/static/tiles/postcode.js

    r9 r16  
    1010      markerElement = document.getElementById('marker');
    1111      postcodeFormElement = document.getElementById('postcode_form');
     12      locationElement = document.getElementById('location');
    1213      mapElement.onclick = function(e) {
    1314        var x = e.pageX - mapContainerElement.offsetLeft;
    1415        var y = e.pageY - mapContainerElement.offsetTop;
     16                                var img = e.target;
     17                                var tileX = e.pageX - img.offsetLeft;
     18                                var tileY = e.pageY - img.offsetTop;
     19                                // Tiles are eee/nnn.jpg
     20                                var tile = img.src.substring( img.src.lastIndexOf("/") - 3 );
     21                                var baseEasting = tile.substring(0, tile.indexOf("/"));
     22                                var baseNorthing = tile.substring(tile.indexOf("/") + 1, tile.indexOf("."));
     23                               
     24                                var easting = baseEasting + ('000' + Math.round((tileX/img.offsetWidth)*1000)).substr(-3)
     25                                var northing = baseNorthing + ('000' + Math.round(((tileY/img.offsetHeight))*1000)).substr(-3)
     26
     27                               
    1528        markerElement.style.left = (x-2) + 'px';
    1629        markerElement.style.top = (y-2) + 'px';
     
    1932        postcodeFormElement.style.top = (y-180) + 'px';
    2033        postcodeFormElement.style.display = 'block';
     34                                locationElement.innerHTML = easting + ', ' + northing
    2135        document.getElementById('postcode').focus();
    2236      }
Note: See TracChangeset for help on using the changeset viewer.