diff options
Diffstat (limited to 'web/js/map-OpenLayers.js')
| -rw-r--r-- | web/js/map-OpenLayers.js | 178 |
1 files changed, 146 insertions, 32 deletions
diff --git a/web/js/map-OpenLayers.js b/web/js/map-OpenLayers.js index ed3ca4653..d00079517 100644 --- a/web/js/map-OpenLayers.js +++ b/web/js/map-OpenLayers.js @@ -1,6 +1,4 @@ -YAHOO.util.Event.onContentReady('map', function() { - - fixmystreet.ZOOM_OFFSET = 14; +$(function(){ var perm = new OpenLayers.Control.Permalink(); set_map_config(perm); @@ -11,9 +9,9 @@ YAHOO.util.Event.onContentReady('map', function() { }); fixmystreet.layer_options = OpenLayers.Util.extend({ - zoomOffset: fixmystreet.ZOOM_OFFSET, + zoomOffset: fixmystreet.zoomOffset, transitionEffect: 'resize', - numZoomLevels: 4 + numZoomLevels: fixmystreet.numZoomLevels }, fixmystreet.layer_options); var layer = new fixmystreet.map_type("", fixmystreet.layer_options); fixmystreet.map.addLayer(layer); @@ -24,7 +22,7 @@ YAHOO.util.Event.onContentReady('map', function() { new OpenLayers.Projection("EPSG:4326"), fixmystreet.map.getProjectionObject() ); - fixmystreet.map.setCenter(centre, fixmystreet.zoom || 2); + fixmystreet.map.setCenter(centre, fixmystreet.zoom || 3); } if (document.getElementById('mapForm')) { @@ -43,35 +41,97 @@ YAHOO.util.Event.onContentReady('map', function() { return false; }); - fixmystreet.markers = new OpenLayers.Layer.Markers("Markers"); - var cols = { 'red':'R', 'green':'G', 'blue':'B', 'purple':'P' }; - for (var i=0; i<fixmystreet.pins.length; i++) { - var pin = fixmystreet.pins[i]; - var src = '/i/pin' + cols[pin[2]] + '.gif'; - var size = new OpenLayers.Size(32, 59); - var offset = new OpenLayers.Pixel(-3, -size.h-2); - var icon = new OpenLayers.Icon(src, size, offset); - var loc = new OpenLayers.LonLat(pin[1], pin[0]); - loc.transform( - new OpenLayers.Projection("EPSG:4326"), - fixmystreet.map.getProjectionObject() - ); - var marker = new OpenLayers.Marker(loc, icon); - if (pin[3]) { - marker.id = pin[3]; - marker.events.register('click', marker, function(evt) { - window.location = '/report/' + this.id; - OpenLayers.Event.stop(evt); - }); - } - fixmystreet.markers.addMarker(marker); + // Vector layers must be added onload as IE sucks + if ($.browser.msie) { + $(window).load(fixmystreet_onload); + } else { + fixmystreet_onload(); + } +}); + +function fixmystreet_onload() { + if ( fixmystreet.area ) { + var area = new OpenLayers.Layer.Vector("KML", { + strategies: [ new OpenLayers.Strategy.Fixed() ], + protocol: new OpenLayers.Protocol.HTTP({ + url: "/mapit/area/" + fixmystreet.area + ".kml?simplify_tolerance=0.0001", + format: new OpenLayers.Format.KML() + }) + }); + fixmystreet.map.addLayer(area); + area.events.register('loadend', null, function(a,b,c) { + var bounds = area.getDataExtent(); + if (bounds) { fixmystreet.map.zoomToExtent( bounds ); } + }); + } + + var pin_layer_options = { + styleMap: new OpenLayers.StyleMap({ + 'default': new OpenLayers.Style({ + externalGraphic: "/i/pin${type}.gif", + graphicTitle: "${title}", + graphicWidth: 32, + graphicHeight: 59, + graphicOpacity: 1, + graphicXOffset: -2, + graphicYOffset: -59 + }) + }) + }; + if (fixmystreet.page == 'around') { + pin_layer_options.strategies = [ new OpenLayers.Strategy.BBOX() ]; + pin_layer_options.protocol = new OpenLayers.Protocol.HTTP({ + url: '/ajax', + params: fixmystreet.all_pins ? { all_pins: 1 } : { }, + format: new OpenLayers.Format.FixMyStreet() + }); + } + fixmystreet.markers = new OpenLayers.Layer.Vector("Pins", pin_layer_options); + + var markers = fms_markers_list( fixmystreet.pins, true ); + fixmystreet.markers.addFeatures( markers ); + if (fixmystreet.page == 'around' || fixmystreet.page == 'reports' || fixmystreet.page == 'my') { + fixmystreet.markers.events.register( 'featureselected', fixmystreet.markers, function(evt) { + window.location = '/report/' + evt.feature.attributes.id; + OpenLayers.Event.stop(evt); + }); + var select = new OpenLayers.Control.SelectFeature( fixmystreet.markers ); + fixmystreet.map.addControl( select ); + select.activate(); } fixmystreet.map.addLayer(fixmystreet.markers); -}); + if ( fixmystreet.zoomToBounds ) { + var bounds = fixmystreet.markers.getDataExtent(); + if (bounds) { fixmystreet.map.zoomToExtent( bounds ); } + } +} -YAHOO.util.Event.addListener('hide_pins_link', 'click', function(e) { - YAHOO.util.Event.preventDefault(e); +function fms_markers_list(pins, transform) { + var cols = { 'red':'R', 'green':'G', 'blue':'B', 'purple':'P' }; + var markers = []; + for (var i=0; i<pins.length; i++) { + var pin = pins[i]; + var loc = new OpenLayers.Geometry.Point(pin[1], pin[0]); + if (transform) { + // The Strategy does this for us, so don't do it in that case. + loc.transform( + new OpenLayers.Projection("EPSG:4326"), + fixmystreet.map.getProjectionObject() + ); + } + var marker = new OpenLayers.Feature.Vector(loc, { + type: cols[pin[2]], + id: pin[3], + title: pin[4] + }); + markers.push( marker ); + } + return markers; +} + +$('#hide_pins_link').click(function(e) { + e.preventDefault(); var showhide = [ 'Show pins', 'Hide pins', 'Dangos pinnau', 'Cuddio pinnau', @@ -88,6 +148,35 @@ YAHOO.util.Event.addListener('hide_pins_link', 'click', function(e) { } }); +$('#all_pins_link').click(function(e) { + e.preventDefault(); + fixmystreet.markers.setVisibility(true); + var welsh = 0; + var texts = [ + 'en', 'Include stale reports', 'Hide stale reports', + 'cy', 'Cynnwys hen adroddiadau', 'Cuddio hen adroddiadau' + ]; + for (var i=0; i<texts.length; i+=3) { + if (this.innerHTML == texts[i+1]) { + this.innerHTML = texts[i+2]; + fixmystreet.markers.protocol.options.params = { all_pins: 1 }; + fixmystreet.markers.refresh( { force: true } ); + lang = texts[i]; + } else if (this.innerHTML == texts[i+2]) { + this.innerHTML = texts[i+1]; + fixmystreet.markers.protocol.options.params = { }; + fixmystreet.markers.refresh( { force: true } ); + lang = texts[i]; + } + } + if (lang == 'cy') { + document.getElementById('hide_pins_link').innerHTML = 'Cuddio pinnau'; + } else { + document.getElementById('hide_pins_link').innerHTML = 'Hide pins'; + } +}); + + /* Overridding the buttonDown function of PanZoom so that it does zoomTo(0) rather than zoomToMaxExtent() */ @@ -134,7 +223,8 @@ OpenLayers.Control.PermalinkFMS = OpenLayers.Class(OpenLayers.Control.Permalink, href = href.substring( 0, href.indexOf(separator) ); } - href += separator + OpenLayers.Util.getParameterString(this.createParams(null, this.map.getZoom()+fixmystreet.ZOOM_OFFSET)); + href += separator + OpenLayers.Util.getParameterString(this.createParams(null, this.map.getZoom()+fixmystreet.zoomOffset)); + // Could use mlat/mlon here as well if we are on a page with a marker if (this.anchor && !this.element) { window.location.href = href; } @@ -144,6 +234,24 @@ OpenLayers.Control.PermalinkFMS = OpenLayers.Class(OpenLayers.Control.Permalink, } }); +/* Pan data handler */ +OpenLayers.Format.FixMyStreet = OpenLayers.Class(OpenLayers.Format.JSON, { + read: function(json, filter) { + if (typeof json == 'string') { + obj = OpenLayers.Format.JSON.prototype.read.apply(this, [json, filter]); + } else { + obj = json; + } + if (typeof(obj.current) != 'undefined') + document.getElementById('current').innerHTML = obj.current; + if (typeof(obj.current_near) != 'undefined') + document.getElementById('current_near').innerHTML = obj.current_near; + var markers = fms_markers_list( obj.pins, false ); + return markers; + }, + CLASS_NAME: "OpenLayers.Format.FixMyStreet" +}); + /* Click handler */ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, { defaultHandlerOptions: { @@ -170,12 +278,18 @@ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, { trigger: function(e) { var lonlat = fixmystreet.map.getLonLatFromViewPortPx(e.xy); + if (fixmystreet.page == 'new') { + fixmystreet.markers.features[0].move(lonlat); + } lonlat.transform( fixmystreet.map.getProjectionObject(), new OpenLayers.Projection("EPSG:4326") ); document.getElementById('fixmystreet.latitude').value = lonlat.lat; document.getElementById('fixmystreet.longitude').value = lonlat.lon; + if (fixmystreet.page == 'new') { + return; + } document.getElementById('mapForm').submit(); } }); |