$(document).ready(function(){
	var fastrac = {
		type:"checkbox",
		label:"Fastrac",
		id:"PlotFastrac",
		class:"MapControl",
		callback: plotProduct,
		enabled: false,
		options:{product:"Fastrac"}
		};
	
	var virtua = {
		type:"checkbox",
		label:"Virtua",
		id:"PlotVirtua",
		class:"MapControl",
		callback: plotProduct,
		enabled: false,
		options:{product:"Virtua"}
		};
	
	var visualizer = {
		type:"checkbox",
		label:"Visualizer",
		id:"PlotVisualizer",
		class:"MapControl",
		callback: plotProduct,
		enabled: false,
		options:{product:"Visualizer"}
		};

	var vital = {
		type:"checkbox",
		label:"VITAL",
		id:"PlotVITAL",
		class:"MapControl",
		callback: plotProduct,
		enabled: true,
		options:{product:"VITAL"}
		};
	$("#MapControls")
		.addToggleControl(fastrac)
		.addToggleControl(virtua)
		.addToggleControl(visualizer)
		.addToggleControl(vital);
	
	$("#MapControls").append('<br /><div class="MapControl"><a id="zoomAll" href="#">Zoom All</a></div>');
	$("#zoomAll").click( function(){
			map.setCenter(new GLatLng(0, 0), 1);
		});
	

});






/**
 * Options
 * container = the selector for the container which control should be placed
 * type = the type of control to be placed
 * label = the label of the control
 * id = the id of the element
 * callback = the name of the function which to use on action
 * options = an object with options to be used in the callback
 */
jQuery.fn.addToggleControl = function(options){
	var enabled = '';
	if( !options.enabled )
	{
		enabled = "Disabled";
	}
	var temp = '<input type="'+options.type+'" id="'+options.id+'" class="'+options.class+'" '+enabled+'/><label for="'+options.id+'">'+options.label+'</label><br/>';
	//if( options.bgcolor )
	//{
		temp = '<div id="'+options.id+'_wrapper" class="'+options.class+'" >' + temp + '</div>';
	//}
	this.append(temp);
	$("#"+options.id).click( function() {
		this.checked != this.checked;
		options.callback(this.checked, options.options);
		return this;
	});
	return this;
};