diff options
Diffstat (limited to 'media/js/natparks.js')
| -rw-r--r-- | media/js/natparks.js | 143 |
1 files changed, 143 insertions, 0 deletions
diff --git a/media/js/natparks.js b/media/js/natparks.js new file mode 100644 index 0000000..1a94e16 --- /dev/null +++ b/media/js/natparks.js @@ -0,0 +1,143 @@ +//Utility functions for map info window +function mapit(lat,lon,zoom,id) { + var map; + //create a new map + var centerCoord = new google.maps.LatLng(lat, lon); + var mapOptions = { + zoom: zoom, + center: centerCoord, + mapTypeId: google.maps.MapTypeId.TERRAIN, + disableDefaultUI: true, + navigationControl: true, + navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL}, + }; + map = new google.maps.Map(document.getElementById('map-wrapper-'+id), mapOptions); + //get the geojson for this map + $.ajax({ + url: "/projects/data/"+id+"/", + dataType: "json", + success: function(data, text, request) { draw_poly(data); } + //complete: function(xhr, status) {console.log(status); return false; }, + }); + //draw the polygon + function draw_poly(data) { + var poly = createPolygons(data.features[0].geometry); + for (i=0;i<=poly.length-1;i++) { + poly[i].setMap(map); + } + + } +} + +// utility functions to create/remove map container +function create_map(obj) { + //break up the variable passed from the map link's title element + var lat = parseFloat(obj.title.split(',')[0]); + var lon = parseFloat(obj.title.split(',')[1]); + var zoom= parseInt(obj.title.split(',')[2]); + var id= obj.title.split(',')[3]; + + //create container divs + $(obj).parents().eq(3).append('<div class="map-container" id="map-container-'+id+'">'); + $('#map-container-'+id).append('<div class="map-wrapper" id="map-wrapper-'+id+'">'); + + + //deal with the variable height of div.legend + //$('#map-container').css({ + // bottom: function(index, value) { + // return parseFloat($(obj).parent().parent().css("height"))-2; + // } + // }); + + mapit(lat,lon,zoom,id); +} +function remove_map(id) { + $(id).remove(); +} + +//function to parse and render polygons for GMaps +//# taken from http://friism.com/drawing-geojson-based-polygons-on-google-maps +function createPolygons(areajson, bounds){ + var coords = areajson.coordinates; + var polygons = _(coords).reduce([], function(memo_n, n) { + var polygonpaths = _(n).reduce(new google.maps.MVCArray(), function(memo_o, o) { + var polygoncords = _(o).reduce(new google.maps.MVCArray(), function(memo_p, p) { + var mylatlng = new google.maps.LatLng(p[1], p[0]); + if(bounds){ + bounds.extend(mylatlng); + } + memo_p.push(mylatlng); + return memo_p; + }); + memo_o.push(polygoncords); + return memo_o; + }); + var polygon = new google.maps.Polygon({ + paths: polygonpaths, + strokeColor: "#201a11", + strokeOpacity: 0.8, + strokeWeight: 2, + fillColor: "#201a11", + fillOpacity: 0.35 + }); + memo_n.push(polygon); + return memo_n; + }); + return polygons; +} + +//functions to handle the "more" link +// utility functions to create/remove camera info container +function get_exif(obj,id) { + //$(obj).parents().eq(2).append('<div id="exif-container">'); + $(obj).parents().eq(3).append('<div class="more-container" id="'+id+'">'); $(obj).parents().eq(2).children('.meta').clone().appendTo('#'+id).css('visibility', 'visible'); + + + + //deal with the variable height of div.legend + $('#exif-container').css({ + bottom: function(index, value) { + return parseFloat($(obj).parent().parent().css("height"))-14; + } + }); +} +function remove_exif(id) { + $('#'+id).remove(); +} + + + + +$(document).ready(function(){ +//set up click events for map button + $('.map-link').click( function() { + var more_id = 'more-container-'+$(this).parent().next().children('.more-link').attr('id').split('-')[1]; + var id = '#map-container-'+this.title.split(',')[3]; + if ($('#'+more_id).is(":visible")){ + remove_exif(more_id); + } + if ($(id).is(":visible")) { + remove_map(id); + } else { + create_map(this); + } + return false; + + }); + + //set up click events for more info button + $('.more-link').click( function() { + var map_id = '#map-container-'+$(this).parent().prev().children('.map-link').attr('title').split(',')[3]; + var id = 'more-container-'+this.id.split('-')[1]; + if ($(map_id).is(":visible")){ + remove_map(map_id); + } + if ($('#'+id).is(":visible")) { + remove_exif(id); + } else { + get_exif(this, id); + } + return false; + }); + +});
\ No newline at end of file |