Changeset 661 for trunk


Ignore:
Timestamp:
Sep 16, 2008, 3:35:03 PM (11 years ago)
Author:
Nick Burch
Message:

Maps for friends

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/gpx.npemap.org.uk/favourite_postcode.xml

    r660 r661  
    1111  var geocoder = "http://www.npemap.org.uk/cgi/geocoder.fcgi?format=js&postcode=";
    1212  var persistentTag = "favourite_postcode";
    13   var lastLookedForPC = null;
    1413
    1514  function startApp() {
     
    2524  }
    2625  function loadedFriends(data) {
    27         var html = "<ul>";
     26        var html = "<ul style='vertical-align: middle'>";
    2827
    2928        var fd = data.get("pc").getData();
     29        var postcodes = {};
    3030
    3131        var friends = data.get("viewerFriends").getData();
    3232        friends.each(function(person) {
    3333                var postcode = "(not set)";
     34                var mapDiv = "<span id='" + person.getId() + "'></span>";
     35
    3436                var theirData = fd[person.getId()]
    3537                if(theirData && theirData[persistentTag]) {
    3638                        postcode = theirData[persistentTag];
     39                        postcodes[person.getId()] = postcode;
    3740                }
    38                 html += "<li>" + person.getDisplayName() + " " + postcode + "</li>";
     41                html += "<li style='vertical-align: middle'>" +
     42                        person.getDisplayName() + " " + postcode + mapDiv +
     43                        "</li>";
    3944        });
    4045        html += "</ul>";
    4146
     47        // Put the HTML live
    4248        document.getElementById("friends").innerHTML = html;
     49
     50        // Find their maps
     51        for(var user in postcodes) {
     52                fetchMapForPostcode(user, postcodes[user], false);
     53        }
    4354  }
    4455
     
    8394
    8495  function startShowMap(postcode) {
    85         lastLookedForPC = postcode;
    8696        document.getElementById("pc").value = postcode;
    8797
     98        fetchMapForPostcode("yourmap", postcode, true);
     99  }
     100  function fetchMapForPostcode(parentId, postcode, fullsize) {
    88101        // Ditch any spaces
    89102        postcode = postcode.replace(" ","");
     
    93106        var params = {};
    94107        params[gadgets.io.RequestParameters.CONTENT_TYPE] = gadgets.io.ContentType.JSON;
    95         gadgets.io.makeRequest(url, doShowMap, params);
     108        gadgets.io.makeRequest(url,
     109                function(obj) {
     110                        doShowMap(parentId, postcode, fullsize, obj);
     111                }, params
     112        );
    96113  }
    97   function doShowMap(obj) {
     114
     115  function doShowMap(parentId, searchPC, fullsize, obj) {
    98116        // Zap old
    99         var map = document.getElementById("yourmap");
     117        var map = document.getElementById(parentId);
    100118        while(map.hasChildNodes()) {
    101119                map.removeChild(map.firstChild);
     
    114132                var tile = "http://tile.npemap.org.uk/osgb/scaled1/" + tile_e + "/" + tile_n + ".jpg";
    115133
    116                 map.innerHTML = "<img src='" + tile + "' alt='Map of "+ json["pc"] +"' />";
     134                var js = "";
     135                if(! fullsize) {
     136                        js = " width='62' height='62' onmouseover='makeBig(this)' onmouseout='makeNormal(this)' ";
     137                }
     138
     139                map.innerHTML = "<img src='" + tile + "' alt='Map of " +
     140                        json["pc"] + "' " + js + " style='vertical-align: middle' />";
    117141        } else {
    118                 map.innerHTML = "No map found for postcode " + lastLookedForPC + ", sorry";
     142                map.innerHTML = "No map found for postcode " + searchPC + ", sorry";
    119143        }
     144  }
     145  function makeBig(obj) {
     146        obj.width = 125;
     147        obj.height = 125;
     148  }
     149  function makeNormal(obj) {
     150        obj.width = 62;
     151        obj.height = 62;
    120152  }
    121153</script>
     
    127159   <input type="button" value="Change" onclick="pickPC()" />
    128160 </div>
     161 <br />
    129162 <div>Your friends:</div>
    130163 <div id="friends"></div>
Note: See TracChangeset for help on using the changeset viewer.