/*
*	app constants
*/
var CONSTANTS = {
	BUTTON_REFRESH_MAP_CLICKED : 0,
	BUTTON_ENLARGE_MAP_CLICKED : 1,
	BUTTON_MINIMIZE_MAP_CLICKED : 2,
	BUTTON_SELECTALL_CLICKED : 3,
	SELECT_TOWN_CHANGED : 4,	
	RES_IMAGE_PATH : "images/red.png",
	COM_IMAGE_PATH : "images/both.png",
	RES_ALT_TEXT :  "residential drop off locations",
	COM_ALT_TEXT :  "commercial and residential drop off locations"	
};

/*
*	call method load() when the page loads
*/
window.onload = load;

/*
*	the main application object
*/
var app;

/*
*	method load
*	create a new application
*/
function load()
{

	var app = new Map_App();
	
	initImages();
	
	//set event handlers
	for (var i in app.VIEW.buttons)	
		switch(app.VIEW.buttons[i].name)
		{
			case "map_refresh":	
				app.VIEW.buttons[i].el.onclick = function(){ app.VIEW.notifyObservers(CONSTANTS.BUTTON_REFRESH_MAP_CLICKED); };	break;
			case "map_enlarge":	
				app.VIEW.buttons[i].el.onclick = function(){ app.VIEW.notifyObservers(CONSTANTS.BUTTON_ENLARGE_MAP_CLICKED); };	break;
			case "map_minimize":	
				app.VIEW.buttons[i].el.onclick = function(){ app.VIEW.notifyObservers(CONSTANTS.BUTTON_MINIMIZE_MAP_CLICKED); }; break;
			case "selectAllCheckboxes":	
				app.VIEW.buttons[i].el.onclick = function(){ app.VIEW.notifyObservers(CONSTANTS.BUTTON_SELECTALL_CLICKED); };	break;
		}
		
	for(var i in app.VIEW.selects){
		switch(app.VIEW.selects[i].name)
		{
			case "sel_towns":	
				app.VIEW.selects[i].el.onchange = function(){ app.VIEW.notifyObservers(CONSTANTS.SELECT_TOWN_CHANGED); };	break;
		}
	}	
}

/*
*	Add images to header
*/
function initImages()
{
	var el = document.createElement('img');
	el.src = CONSTANTS.COM_IMAGE_PATH;
	el.alt = CONSTANTS.COM_ALT_TEXT;
	el.style.width = 15;
	el.style.height= 15;	
	document.getElementById('img_com_and_res_marker').appendChild(el);
	
	var el2 = document.createElement('img');
	el2.src = CONSTANTS.RES_IMAGE_PATH;
	el2.alt = CONSTANTS.RES_ALT_TEXT;
	el2.style.width = 15;
	el2.style.height= 15;	
	document.getElementById('img_res_marker').appendChild(el2);
}

/*
*	@class: Map_App
*	Map_App is a model view controller app that displays a GMap
*/
function Map_App()
{
	/*
	*	@properties:
	*	@property: Map_App.MODEL.The application's Model object
	*	@property: Map_App.VIEW.The application's View object
	*	@property: Map_App.CONTROLLER.The application's Controller object
	*/
	this.MODEL = new Model(json);
	this.MODEL.loadData();
	this.VIEW = new View();
	this.CONTROLLER = new Controller(this.MODEL, this.VIEW, CONSTANTS);			
	this.VIEW.addObserver(this.CONTROLLER);
	this.CONTROLLER.init();
}