Map Loading..
![Map Loading...](" + MEDIA_URL + "img/icons/map_loader.gif){kind=icon}
";
});
}
});
/*The most basic GoogleMapConfiguration */
var BaseGoogleMap = new Class({
elem: null,
map: null,
initialize: function(container, height, marker_list, opts) {
if(typeof(marker_list) == 'undefined') marker_list = [];
if(typeof(opts) == 'undefined') opts = {};
$extend(this, opts);
this.marker_list = marker_list;
this.elem = container;
this.elem.empty();
this.elem.setStyles({'visibility':'visible', 'display':'block', 'height': height, 'overflow':'hidden'});
this.init_map();
this.plot_points(this.get_marker_list());
},
init_map: function(){
if (GBrowserIsCompatible()) {
this.map = new GMap2(this.elem);
this.map.addControl(new GSmallMapControl());
this.map.setCenter(new GLatLng(56.2752, -3.1244), 11);
}
},
get_marker_list: function(){
return this.marker_list;
},
plot_points: function(marker_list) {
var bounds = new GLatLngBounds();
marker_list.each(function(e, i){
var point = new GLatLng(e['latitude'], e['longitude']);
bounds.extend(point);
var marker = new GMarker(point, {icon: e['icon']});
if (e['url'] != null) {
marker.text = new Element('a', {'href':e['url']}).setHTML(e['text']);
} else {
marker.text = e['text']
}
GEvent.addListener(marker, "click", function() {
this.openInfoWindow(this.text);
});
this.map.addOverlay(marker)
}.bind(this));
if (!bounds.isEmpty()) {
this.map.setCenter(bounds.getCenter(), Math.min(15, this.map.getBoundsZoomLevel(bounds)));
}
}
});
/*A map that handles the homepage News and Events plotting*/
var EventsNewsGoogleMap = BaseGoogleMap.extend({
get_marker_list: function(){
var events = [];
$$('.vevent').each(function(e) {
events[events.length] = this.import_data(e, {
'icon':SFGIcons.eventIcon
});
}.bind(this));
$$('.vnews').each(function(e) {
events[events.length] = this.import_data(e, {
'icon':SFGIcons.newsIcon
});
}.bind(this));
var non_empties = [];
for(var i = 0; i < events.length; ++i){
if(events[i].latitude && events[i].longitude){
non_empties[non_empties.length] = events[i];
}
}
return non_empties;
},
import_data: function(e, obj){
obj.text = null;
obj.longitude = null;
obj.latitude = null;
obj.url = null;
if(e.getElementsBySelector('.summary')[0] && e.getElementsBySelector('.dtstart')[0]) obj.text = e.getElementsBySelector('.summary')[0].getText() + "" + e.getElementsBySelector('.dtstart')[0].getText(); if(e.getElementsBySelector('.geo .latitude')[0]) obj.latitude = parseFloat(e.getElementsBySelector('.geo .latitude')[0].getText()); if(e.getElementsBySelector('.geo .longitude')[0]) obj.longitude = parseFloat(e.getElementsBySelector('.geo .longitude')[0].getText()); if(e.getElementsBySelector('.url')[0]) obj.url = e.getElementsBySelector('.url')[0].href; return obj; } }); /*A clustering Google Map*/ var ClusteringGoogleMap = BaseGoogleMap.extend({ clusterer: null, get_marker_list: function(){ if(this.marker_list.length){ return this.cluster_marker_list(this.marker_list); }else{ return this.cluster_marker_list(this.get_clusterable_marker_list()); } }, get_clusterable_marker_list: function(){ return []; }, cluster_marker_list: function(marker_list){ var bounds = new GLatLngBounds(); var cluster_markers = []; marker_list.each(function(e, i){ var point = new GLatLng(e['latitude'], e['longitude']); bounds.extend(point); var marker = new GMarker(point, {icon: e['icon']}); if (e['url'] != null) { marker.text = new Element('a', {'href':e['url']}).setHTML(e['text']); } else { marker.text = new Element('a', {'href':'#'}).setHTML(e['text']); } GEvent.addListener(marker, 'click', function(){window.location=marker.text.href}); cluster_markers[i] = marker; }.bind(this)); if (!bounds.isEmpty()) { this.map.setCenter(bounds.getCenter(), Math.min(15, this.map.getBoundsZoomLevel(bounds))); } return cluster_markers; }, plot_points: function(cluster_marker_list){ this.clusterer = new ClusterMarker(this.map, {clusterMarkerIcon: SFGIcons.newsIcon}); this.clusterer.addMarkers(cluster_marker_list); } }); /*The Main communities map*/ var CommunityGoogleMap = ClusteringGoogleMap.extend({ hideTimer: null, get_marker_list: function(){ var marker_points = new Json.Remote(APIUrls.communities, {onComplete: function(data){ data.each(function(e){ e.icon = SFGIcons.communityIcon; }); cluster_marker_list = this.cluster_marker_list(data); this.clusterer = new ClusterMarker(this.map, {clusterMarkerIcon: SFGIcons.multiCommunityIcon}); this.clusterer.clusterMarkerTitle = ''; this.clusterer.addMarkers(cluster_marker_list); this.clusterer.fitMapToMarkers(); GEvent.addListener(this.map, 'movestart', function(){this.clear_existing_counts();this.clear_existing_info();}.bind(this)); GEvent.addListener(this.map, 'zoomstart', function(){this.clear_existing_counts();this.clear_existing_info();}.bind(this)); GEvent.addListener(this.map, 'zoomend', this.update_cluster_points.bind(this)); GEvent.addListener(this.map, 'moveend', this.update_cluster_points.bind(this)); this.update_cluster_points(); }.bind(this)}).send({'restrict_area_id':this.area_list.value}); }, initialize: function(container, height, marker_list, extra){ this.area_list = $('id_area'); this.area_list.addEvent('change', function(){ this.clusterer.removeMarkers(); this.get_marker_list(); }.bind(this)); this.parent(container, height, marker_list, extra); this.map_type = this.map.getCurrentMapType(); this.projection = this.map_type.getProjection(); }, clear_existing_counts: function(){ $$('.scf_count_overlay').each(function(e){ e.remove(); }); }, clear_existing_info: function(){ $$('.scf_info_overlay').each(function(e){ e.remove(); }); }, update_cluster_points: function() { this.clear_existing_counts(); this.clear_existing_info(); $A(this.clusterer._clusterMarkers).each(function(m) { var count = m._childIndexes.length; var point = this.map.fromLatLngToContainerPixel(m.getLatLng()); if(!m.isHidden()) this.create_count(count, point, m); }.bind(this)); $A(this.clusterer._mapMarkers).each(function(m) { if(!m.isHidden() && m._isVisible){ var point = this.map.fromLatLngToContainerPixel(m.getLatLng()); this.create_count(' ', point, m); } }.bind(this)); }, create_count: function(count_value, point, marker){ if(!marker) return; var count = new Element('div').setText(count_value); var relative_position_x = point.x - marker.getIcon().iconAnchor.x; var relative_position_y = point.y - marker.getIcon().iconAnchor.y; var absolute_position_x = relative_position_x + this.elem.getPosition().x; var absolute_position_y = relative_position_y + this.elem.getPosition().y; count.setStyles({ 'display':'block', 'background': 'url(/media/img/icons/transparent.gif) top left', 'color':'#fff', 'position':'absolute', 'padding': '10px 0px', 'text-align': 'center', 'text-indent': '-10px', 'height': (marker.getIcon().iconSize.height - 20) + 'px', 'width': marker.getIcon().iconSize.width + 'px', 'cursor': 'pointer', 'top': relative_position_y + 'px', 'left':relative_position_x + 'px', 'z-index': 100 }); count.addClass('scf_count_overlay'); count.addEvent('click', function(marker){ GEvent.trigger(marker, 'click'); }.bind(this, marker)); count.addEvent('mouseover', function(event, count){ $clear(this.hideTimeout); this.clear_existing_info(); var info = new Element('div'); var arrow = new Element('img', {'src':'/media/img/icons/info_arrow.png'}); arrow.setStyles({'position':'absolute','visibility':'hidden'}); info.setStyles({ 'visibility':'hidden', 'display':'block', 'background': '#fff', 'border': '2px solid #B1B1B1', 'position':'absolute', 'padding':'10px', 'min-width': '200px', 'max-width': '300px', 'max-height': '200px', 'overflow': 'auto', 'left': (absolute_position_x + marker.getIcon().iconSize.width + 5) + 'px' }); if(window.ie6) info.setStyles({'width':'200px'}); info.addClass('scf_info_overlay'); arrow.addClass('scf_info_overlay'); if(count._cluster){ $A(count._cluster).each(function(e){ var elem = $(this.clusterer._mapMarkers[e].text).clone(); if(elem.getText()){ elem.setHTML('- ' + elem.innerHTML); info.adopt(elem); } info.adopt(new Element('br')); }.bind(this)); }else{ var elem = $(marker.text).clone(); info.adopt(elem); } info.addEvent('mouseover', function() { $clear(this.hideTimeout); }.bind(this)); info.addEvent('mouseout', function(){ $clear(this.hideTimeout); this.hideTimeout = this.clear_existing_info.delay(100); }.bind(this)); info.injectInside($('body')); arrow.injectInside($('body')); if(window.ie6){ info.setStyles({ 'top': absolute_position_y + 'px', 'visibility':'visible' }); }else{ info.setStyles({ 'top': absolute_position_y - (info.getSize().size.y/2) + (marker.getIcon().iconSize.height/2) + 'px', 'visibility':'visible' }); } arrow.setStyles({ 'top': absolute_position_y - 7 + (marker.getIcon().iconSize.height/2) + 'px', 'left': info.getPosition().x - 7 + 'px', 'z-index': 10, 'visibility':'visible' }); }.bindWithEvent(this, count)); count.addEvent('mouseout', function(count){ $clear(this.hideTimeout); this.hideTimeout = this.clear_existing_info.delay(100); }.bind(this, count)); if(marker._childIndexes) count._cluster = marker._childIndexes; count.injectInside(this.elem); }, plot_points: function(){ /*Override this because we're using an ajax view*/ } }); /*Draw a route ona google map */ var RouteEditGoogleMap = BaseGoogleMap.extend({ initialize: function(container, height, markers, opts){ this.parent(container, height, markers, opts); this.map.addMapType(G_PHYSICAL_MAP); var map_type_control = new GMapTypeControl(true); var map_tpe_control_pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(50, 7)) this.map.addControl(map_type_control, map_tpe_control_pos); this.add_route(); this.add_controls(); }, add_controls: function(){ this.control_container = new Element('div'); this.second_control_container = new Element('div'); this.search_container = new Element('div'); this.elem.appendChild(this.control_container); this.elem.appendChild(this.second_control_container); this.elem.appendChild(this.search_container); var pickPOIs = new PickPOIControl(this.map, { 'container':this.control_container, 'position':[G_ANCHOR_TOP_RIGHT, new GSize(7, 7)], 'task_name':'Link points of interest', 'googleControlStyle': 'Poi', 'googleSearchControlStyle':'SearchPoiInput', 'googleSearchControlText': 'Enter point of interest name.', 'overlayIcon': 'POIIcon', 'selectedOverlayIcon': 'POISelectedIcon', 'saveInput': this.poi_input }); var editRoute = new PerformMapTaskControl(this.map, { 'container':this.control_container, 'position':[G_ANCHOR_TOP_RIGHT, new GSize(7, 7)], 'task_name':'Edit', 'task_func':function(){this.edit_route();}.bind(this), 'googleControlStyle':'Edit' }); var pickListings = new PickListingsControl(this.map, { 'container':this.second_control_container, 'position':[G_ANCHOR_TOP_RIGHT, new GSize(7, 28)], 'task_name':'Link businesses', 'googleControlStyle':'Business', 'googleSearchControlStyle':'SearchBusinessInput', 'googleSearchControlText': 'Enter directory listing name.', 'overlayIcon': 'BusinessIcon', 'selectedOverlayIcon': 'BusinessSelectedIcon', 'saveInput': this.business_input }); var clearRoute = new PerformMapTaskControl(this.map, { 'container':this.second_control_container, 'position':[G_ANCHOR_TOP_RIGHT, new GSize(7, 28)], 'task_name':'Clear', 'task_func': function(){ var confirmed = confirm("Are you sure you wish to erase the current route?"); if(confirmed){this.clear_route();}}.bind(this), 'googleControlStyle':'Clear' }); /*Add the map controls */ this._controls = Array( pickPOIs, editRoute, pickListings, clearRoute ); this.map.addControl(pickPOIs.get_control()); this.map.addControl(editRoute.get_control()); this.map.addControl(pickListings.get_control()); this.map.addControl(clearRoute.get_control()); }, load_route: function(json_points){ var latlng_list = Json.evaluate(json_points); glatlngs = [] latlng_list.each(function(e, i){ glatlngs[i] = new GLatLng(e[0], e[1]); }); this.clear_route(); this.polyline = new GPolyline(glatlngs,'#4C083B', 4, 0.9); bounds = this.polyline.getBounds(); zoom = this.map.getBoundsZoomLevel(bounds); this.map.setCenter(bounds.getCenter(), zoom); this.map.addOverlay(this.polyline); this.edit_route(); if(typeof(this.route_load_callback)!='undefined'){ this.route_load_callback(); } }, ready: function(){ /*report ready state when there's nothing to load*/ if(typeof(this.route_load_callback)!='undefined'){ this.route_load_callback(); } }, add_route: function(){ GEvent.addListener(this.map, 'click', function(overlay, latlng){ if(!this.polyline){ this.polyline = new GPolyline([latlng],'#4C083B', 4, 0.9); this.map.addOverlay(this.polyline); this.polyline.enableDrawing(); GEvent.addListener(this.polyline, 'endline', function(){ this.encode_route_to_input(); this._controls.each(function(e){ e.enable(); }); }.bind(this)); } }.bind(this)); }, edit_route: function(){ if(this.polyline){ this.polyline.enableEditing(); this._controls.each(function(e){ e.enable(); }); this.encode_route_to_input(); GEvent.addListener(this.polyline, 'lineupdated', function(){ this.encode_route_to_input(); }.bind(this)) } }, clear_route: function(){ if(this.polyline){ this.polyline.disableEditing(); this.map.removeOverlay(this.polyline); } this._controls.each(function(e){ e.disable(); }); this.polyline = false; this.save_to_input.value = ''; this.distance_input.value = ''; this.longitude_input.value = ''; this.latitude_input.value = ''; }, encode_route_to_input: function(){ if(this.polyline){ line_points = []; for(i=0; i
'))); text.adopt(new Element('div').setHTML('Suitability: ' + desc['route_suitability'].replace(/\n/, '
'))); return text; }, BusinessIcon_text: function(desc){ var text = new Element('div').setStyles({'width':'200px'});; text.adopt(new Element('a', {'href': desc['url'], 'target':'_blank', 'style':'font-size: 1.2em'}).setHTML(desc['name'])); text.adopt(new Element('br')); text.adopt(new Element('div').setHTML(desc['text'])); return text; }, POIIcon_text: function(desc){ var text = new Element('div').setStyles({'width':'200px'});; text.adopt(new Element('a', {'href': desc['url'], 'target':'_blank', 'style':'font-size: 1.2em'}).setHTML(desc['name'])); text.adopt(new Element('br')); text.adopt(new Element('div').setHTML(desc['text'])); for(var i=0; i