/**
 *	Social.gmap js file
 *	
 *	frontend google maps module
 *	communication between google maps api (V3!) and engine based location (single and multiple)
 *
 *	
 * 	google maps options
 *	
 *	maptype		[roadmap, hybrid, terrain, satellite]
 *	zoom		[0->21]
 *	icon		
 *	mapcontrol	[LargeMapControl]
 */

//	LOAD EXTERNAL JS (location: Google)

add_header_element ( "script", { "type":"text/javascript", "src":"http://maps.google.com/maps/api/js?sensor=false" } );


//	DOM Element class (prototypejs sugared)
//	Creates an extended HTML element.

var SocialGmap = function ( vars ) {
	
	Object.extend( obj = new Element("div", { 'class':"map" }), SocialGmap_proto );
	obj.options = obj.extend_options( vars );
	obj.submit  = obj.select( '.submit')[0];
	
	return obj;

}


SocialGmap_proto = {

	// default options
	default_options	: {
		
		maptype			: "ROADMAP",
		zoom			: 8,
		mapTypeControl	: false
	
	},
	
	// extend/overwrite default options with custom options
	extend_options	: function( vars ) {
	
		Object.extend( this.default_options, vars );
		return this.default_options;
	
	},

	// initiate, build map object	
	init			: function() {

		if( this.options.box && this.options.box[0] ) this.setStyle({ width: this.options.box[0] + "px" });
		if( this.options.box && this.options.box[1] ) this.setStyle({ height: this.options.box[1] + "px" });

		this.latlng = new google.maps.LatLng( this.options.latlng[0], this.options.latlng[1] );
		this.options.mapTypeId = google.maps.MapTypeId[ this.options.maptype ];
		this.options.center = this.latlng;
	
		this.map = new google.maps.Map( this, this.options );
		
		return this;
		
	},
	
	// check for markers and possibility to add pinpoints
	filter_markers	: function() {
			
		if ( this.options.connect ) {
			google.maps.event.addListener( this.map, 'click', this.connect.bind( this ));
		}
		
		if( this.options.markers ) for( n = 0; n < this.options.markers.length; n++ ) {
			this.add_marker( this.options.markers[ n ] );
		}
		
		return this; 
	},
	
	// connect external module
	connect			: function( event ) {
	
		if ( !this.hold ) {
		
			this.hold	= true;
		
			this.position	= event.latLng;
			this.pos		= event.latLng.b + ',' + event.latLng.c;
			this.icon		= init.theme + this.options.pinpoint.icon;
			this.visible	= true;
			this.draggable 	= true;
			
			var marker		= new google.maps.Marker( this );
			
			if ( this.pos && this.options.objectid ) {
			
				xhttp.construct({ 
					id: this.options.connect, 
					vars: { children: { 
						ll: { type: 'hidden', class: 'wide req hide', value: 'll', defined: this.pos },
						objid: { type: 'hidden', class: 'wide req hide', value: 'objid', defined: this.options.objectid }
					}}
				}, this.up(1));
				
			}
			
			google.maps.event.addListener( marker, "dragend", function() { 
				
				var ll	= new String( marker.getPosition());
				var ll 	= new String( ll.substr(1,ll.length-2));
				var ll 	= ll.replace( ' ', '' );
				
				if( $( 'll' )) {
					$( 'll' ).value = ll;
				}
			
			});
		
			var instance = this;
			window.setInterval( function(){instance.blogger( marker )}, 1000 );
	
		}
		
	},
	
	blogger			: function( obj ) {
	
		if( $( 'cancel' ))
			$( 'cancel' ).observe( 'click', this.remove.bind( this, obj ));
				
	},
	
	remove			: function( e, obj ) {
		
		e.visible	= false;
	
	},
	
//	ADD MARKER
	add_marker		: function( obj ) {
		
		obj.position	= new google.maps.LatLng( obj.ll[ 0 ], obj.ll[ 1 ] );
		obj.map			= this.map;
		
		if( obj.icon ) {
			obj.icon	= init.theme + obj.icon;
		}
		
		obj.title		= obj.title;
		obj.iconSize	= [ obj.map.isize[ 0 ], obj.map.isize[ 1 ] ];
		obj.iconAnchor	= [ obj.point[ 0 ], obj.point[ 1 ] ];

		var marker = new google.maps.Marker( obj );
		
		if ( obj.uri) {
			google.maps.event.addListener(marker, 'click', function() {
				window.location = obj.uri;
			});
		}
						
		return marker;
	}	
}