Source: test.js

/**
	* @namespace
	* @property {string} type -Définit le layer et peut etre "Google Street", "Google Hybrid", "Google Satellite", "Google Terrain", "IGN Route", "IGN Satellite" ou "IGN Terrain" ("Google Street" par default).
	* @property {integer} top -Régler l'ecart en px entre le bord supérieur de la carte et le bord supérieur de son élément contenant ( 10px par default).
	* @property {integer} left Régler l'ecart en px entre le bord gauche de la carte et le bord gauche de son élément contenant ( 10px par default).
	* @property {integer} height Définir le longueur en px de la carte ( 400px par default).
	* @property {integer} width Définir la largeur en px de la carte ( 600px par default).
	* @property {string} color Définir le couleur de l'entête s'il existe (#3366CC par defaut).
	* @property {string} border Définir le couleur, l'eppaisseur et le type de la bordure. Par default "#3366CC 2px solid".
	{@link http://www.w3schools.com/css/css_border.asp|CSS Border} pour voir les types de bordure.
	* @property {string} name Définir le nom de la carte ("Map Displayer" par defaut).
	* @property {string} icon Définir l'icon de la carte sous forme d'un URL.
	* @property {float} latitude Definir la latitude du point central initial de la carte(entre -90° et 90°).
	* @property {float} longitude Definir la longitude du point central initial de la carte(entre -180° et 180°).
	* @property {integer} zoom Definir le zoom initial de la carte(entre 0 et 21).
	* @property {boolean} draggable
	* @property {boolean} resizable
	* @property {boolean} header
	* @property {boolean} removable
	* @property {boolean} configurable
	* @property {boolean} zoomable
	* @property {boolean} pannable
	* @property {boolean} showscale
	* @property {boolean} showposition
	* @property {boolean} showlocation
	* @property {boolean} showitinerary
	* @property {boolean} showtoolbar
	*/
	WIND.Map = function(iddiv, options) {
	this.type = "map";
	this.top = 10;
	this.left = 10;
	this.width = 600;
	this.height = 400;
	this.color = "#3366CC";
	this.border = "#3366CC 2px solid";
	this.name = "Map Displayer";
	this.icon = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windapi/images/mvizicon.png";
	
	// Admin action configuration for the designer
	this.draggable = false;
	this.resizable = false;
	this.header = false;
	this.removable = false;
	this.configurable = false;
	
	// Action given for users
	this.zoomable = true;
	this.pannable = true;
	this.showscale = true;
	this.showposition = true;
	this.showlocation = false;
	this.showitinerary = false;
	this.showtoolbar = false;
	
	// Action given for users
	this.tool = new Array();
	
	if (options) {
		if (options.draggable == true) this.draggable = options.draggable;
		if (options.resizable == true) this.resizable = options.resizable;
		if (options.header == true) this.header = options.header;
		if (options.removable == true) this.removable = options.removable;
		if (options.configurable == true) this.configurable = options.configurable;
		if (this.draggable == true || this.removable == true || this.configurable == true) this.header = true;
	
		if (options.zoomable == false) this.zoomable = false;
		if (options.pannable == false) this.pannable = false;
	
		if (options.type) {this.baseLayer = options.type;}
		if (options.longitude) {this.longitude = options.longitude;}
		if (options.latitude) {this.latitude = options.latitude;}
		if (options.zoom || options.zoom == 0) {this.zoom = options.zoom;}
	}
	
	var outerDiv = document.createElement("div");
	outerDiv.id = iddiv + "Outer";
	outerDiv.style.position = "absolute";
	
	if (options.top) this.top = options.top;
	outerDiv.style.top = this.top + "px";
	
	if (options.left) this.left = options.left;
	outerDiv.style.left = this.left + "px";
	
	if (options.width) this.width = options.width;
	outerDiv.style.width = this.width + "px";
	
	if (options.height) this.height = options.height;
	outerDiv.style.height = this.height + "px";
	
	if (options.color) this.color = options.color;
	if (options.border) this.border = options.border;
	outerDiv.style.border = this.border;
	
	if (options.parentEl) this.parentEl = options.parentEl;
	if (options.name) this.name = options.name;
	if (options.icon) this.icon = options.icon;
	
	var mapDiv;
	if (document.getElementById(iddiv))
		mapDiv = document.getElementById(iddiv);
	else { 
		mapDiv = document.createElement("div");
		mapDiv.id = iddiv;
	}
	mapDiv.style.position = "absolute";
	mapDiv.style.top = "0px";
	mapDiv.style.width = "100%";
	mapDiv.style.height = "100%";
	outerDiv.appendChild(mapDiv);
	//document.body.appendChild(outerDiv);
	if (options.parentEl) {
		this.parentEl = options.parentEl;
		document.getElementById(options.parentEl).appendChild(outerDiv);
	}
	else document.body.appendChild(outerDiv);
	
	if (this.header) {
		var headerDiv = document.createElement("div");
		headerDiv.id = iddiv + "Handle";
		headerDiv.style.position = "absolute";
		headerDiv.style.width = "100%";
		headerDiv.style.height = "20px";
		headerDiv.style.backgroundColor = this.color;
		if (this.draggable) headerDiv.style.cursor = "move";
		headerDiv.style.zIndex = 2;
		
		var iconSpan = document.createElement("img");
		iconSpan.src = this.icon;
		iconSpan.alt = "[ ]";
		iconSpan.title = "MapDisplayer";
		iconSpan.style.cssFloat = "left";
		headerDiv.appendChild(iconSpan);
		
		var nameNode = document.createElement("span");
		nameNode.style.color = "#FFFFFF";
		nameNode.style.paddingLeft = "3px";
		nameNode.appendChild(document.createTextNode(this.name));
		headerDiv.appendChild(nameNode);
		
		var configDiv = document.createElement("div");
		configDiv.id = iddiv + "Configuration";
		configDiv.style.position = "absolute";
		configDiv.style.width = "100%";
		//configDiv.style.height = "100px";
		configDiv.style.marginTop = "20px";
		configDiv.style.backgroundColor = "#E4E4E4";
		configDiv.style.zIndex = 11;
		configDiv.style.display = "none";
		outerDiv.appendChild(configDiv);
		
		var that = this;
		
		// Name of displayer
		var label1 = document.createElement("span");
		label1.appendChild(document.createTextNode("Name: "));
		configDiv.appendChild(label1);
		//configDiv.appendChild(document.createElement("br"));
		var input1 = document.createElement("input");
		input1.type = "text";
		input1.id = iddiv + "Configuration_Name";
		input1.name = iddiv + "Configuration_Name";
		input1.size = "30";
		input1.value = this.name;
		configDiv.appendChild(input1);
		input1.onblur = function() {
			var nomafficheur = document.getElementById(iddiv + "Configuration_Name").value;
			if ((nomafficheur != null) && (nomafficheur != '')) {
				that.name = nomafficheur;
				nameNode.removeChild(nameNode.firstChild);
				nameNode.appendChild(document.createTextNode(that.name));
			}
			that.eventConfigured.fire(that);
		};
		/*
		var nameButton = document.createElement("input");
		nameButton.type = "button";
		nameButton.id = iddiv + "Configuration_Name_OK";
		nameButton.name = iddiv + "Configuration_Name_OK";
		nameButton.value = "OK";
		configDiv.appendChild(nameButton);
		nameButton.onclick = function() {
			var nomafficheur = document.getElementById(iddiv + "Configuration_Name").value;
			if ((nomafficheur != null) && (nomafficheur != '')) {
				that.name = nomafficheur;
				nameNode.removeChild(nameNode.firstChild);
				nameNode.appendChild(document.createTextNode(that.name));
			}
			that.eventConfigured.fire(that);
		};
		*/
		configDiv.appendChild(document.createElement("br"));
		// Color of displayer
		var label2 = document.createElement("span");
		label2.appendChild(document.createTextNode("Color: "));
		configDiv.appendChild(label2);
		var input2 = document.createElement("select");
		input2.id = iddiv + "Configuration_Color";
		input2.name = iddiv + "Configuration_Color";
		configDiv.appendChild(input2);
		input2.style.background = this.color;
		var colorTab=["#00248E","#0033CC","#809FFE","#BFCFFE","#12127D","#1919B3","#9191FE","#C8C8FE","#24006B","#330099","#AA80FE","#D4BFFE","#2D006B","#400099","#B580FE","#DABFFE","#47006B","#660099","#D580FE","#EABFFE","#6B006B","#990099","#FF80FE","#FFBFFE","#8E006B","#CC0099","#FE80DF","#FEBFEF","#A10048","#E60066","#FE80B9","#FEBFDC","#B20000","#FF0000","#FE8080","#FEBFBF","#B22400","#FF3300","#FE9980","#FECCBF","#B24700","#FF6600","#FEB380","#FED9BF","#B25900","#FF8000","#FEBF80","#FEDFBF","#B26B00","#FF9900","#FECC80","#FEE6BF","#B27D00","#FFB200","#FED980","#FEECBF","#B28F00","#FFCC00","#FEE680","#FEF2BF","#B2A100","#FFE500","#FEF280","#FEF9BF","#B2B300","#FFFF00","#FEFF80","#FEFFBF","#8FB200","#CCFF00","#E6FE80","#F2FEBF","#6BB200","#99FF00","#CCFE80","#E6FEBF","#24B200","#33FF00","#99FE80","#CCFEBF","#008E00","#00CC00","#80FE80","#BFFEBF","#007D47","#00B366","#80FEC8","#BFFEE3","#006B6B","#009999","#80FFFE","#BFFFFE","#00477D","#0066B3","#80C8FE","#BFE3FE"];
		for (var i=0; i<colorTab.length; i++) {
			var opt = new Option(colorTab[i], colorTab[i]);
			opt.style.background = colorTab[i];
			opt.style.position = "absolute";
			opt.style.width = "100px";
			opt.style.height = "30px";
			if (colorTab[i] == this.color) opt.selected = true;
			input2.add(opt);
		}
		input2.onchange = function() {
			input2.style.background = this.options[this.selectedIndex].value;
			that.color = this.options[this.selectedIndex].value;
			that.border = this.options[this.selectedIndex].value + " 2px solid";
			document.getElementById(iddiv + "Handle").style.backgroundColor = that.color;
			document.getElementById(iddiv + "Outer").style.border = that.border;
		}; 
		
		configDiv.appendChild(document.createElement("br"));
		// Zoomable
		var label3 = document.createElement("span");
		label3.appendChild(document.createTextNode("Zoomable: "));
		configDiv.appendChild(label3);
		var input31 = document.createElement("input");
		input31.type = "radio";
		input31.id = iddiv + "Configuration_Zoomable_Yes";
		input31.name = iddiv + "Configuration_Zoomable";
		if (this.zoomable == true) input31.checked = "checked";
		configDiv.appendChild(input31);
		var labelInput31 = document.createElement("label");
		//labelInput31.for = iddiv + "Configuration_Zoomable";
		labelInput31.appendChild(document.createTextNode("Yes "));
		configDiv.appendChild(labelInput31);
		var input32 = document.createElement("input");
		input32.type = "radio";
		input32.id = iddiv + "Configuration_Zoomable_No";
		input32.name = iddiv + "Configuration_Zoomable";
		if (this.zoomable == false) input32.checked = "checked";
		configDiv.appendChild(input32);
		var labelInput32 = document.createElement("label");
		//labelInput32.for = iddiv + "Configuration_Zoomable";
		labelInput32.appendChild(document.createTextNode("No "));
		configDiv.appendChild(labelInput32);
		input31.onclick = function() {
			that.zoomable = true;
			if (that.pannable)
				that.setMouseControl({'zoomWheelEnabled': true, 'zoomBoxEnabled': true, 'zoomDbClickEnabled': true, 'panEnabled': true});
			else 
				that.setMouseControl({'zoomWheelEnabled': true, 'zoomBoxEnabled': true, 'zoomDbClickEnabled': true, 'panEnabled': false});
			that.addZoomControl();
		};
		input32.onclick = function() {
			that.zoomable = false;
			if (that.pannable)
				that.setMouseControl({'zoomWheelEnabled': false, 'zoomBoxEnabled': false, 'zoomDbClickEnabled': false, 'panEnabled': true});
			else 
				that.setMouseControl({'zoomWheelEnabled': false, 'zoomBoxEnabled': false, 'zoomDbClickEnabled': false, 'panEnabled': false});
			that.removeZoomControl();
		};
		
		configDiv.appendChild(document.createElement("br"));
		// Pannable
		var label4 = document.createElement("span");
		label4.appendChild(document.createTextNode("Pannable: "));
		configDiv.appendChild(label4);
		var input41 = document.createElement("input");
		input41.type = "radio";
		input41.id = iddiv + "Configuration_Pannable_Yes";
		input41.name = iddiv + "Configuration_Pannable";
		if (this.pannable == true) input41.checked = "checked";
		configDiv.appendChild(input41);
		var labelInput41 = document.createElement("label");
		//labelInput41.for = iddiv + "Configuration_Pannable";
		labelInput41.appendChild(document.createTextNode("Yes "));
		configDiv.appendChild(labelInput41);
		var input42 = document.createElement("input");
		input42.type = "radio";
		input42.id = iddiv + "Configuration_Pannable_No";
		input42.name = iddiv + "Configuration_Pannable";
		if (this.pannable == false) input42.checked = "checked";
		configDiv.appendChild(input42);
		var labelInput42 = document.createElement("label");
		//labelInput42.for = iddiv + "Configuration_Pannable";
		labelInput42.appendChild(document.createTextNode("No "));
		configDiv.appendChild(labelInput42);
		input41.onclick = function() {
			that.pannable = true;
			if (that.zoomable)
				that.setMouseControl({'zoomWheelEnabled': true, 'zoomBoxEnabled': true, 'zoomDbClickEnabled': true, 'panEnabled': true});
			else 
				that.setMouseControl({'zoomWheelEnabled': false, 'zoomBoxEnabled': false, 'zoomDbClickEnabled': false, 'panEnabled': true});
		};
		input42.onclick = function() {
			that.pannable = false;
			if (that.zoomable)
				that.setMouseControl({'zoomWheelEnabled': true, 'zoomBoxEnabled': true, 'zoomDbClickEnabled': true, 'panEnabled': false});
			else 
				that.setMouseControl({'zoomWheelEnabled': false, 'zoomBoxEnabled': false, 'zoomDbClickEnabled': false, 'panEnabled': false});
		};
		
		configDiv.appendChild(document.createElement("br"));
		// Show Scale
		var label5 = document.createElement("span");
		label5.appendChild(document.createTextNode("Show scale: "));
		configDiv.appendChild(label5);
		var input51 = document.createElement("input");
		input51.type = "radio";
		input51.id = iddiv + "Configuration_Showscale_Yes";
		input51.name = iddiv + "Configuration_Showscale";
		if (this.showscale == true) input51.checked = "checked";
		configDiv.appendChild(input51);
		var labelInput51 = document.createElement("label");
		//labelInput51.for = iddiv + "Configuration_Showscale";
		labelInput51.appendChild(document.createTextNode("Yes "));
		configDiv.appendChild(labelInput51);
		var input52 = document.createElement("input");
		input52.type = "radio";
		input52.id = iddiv + "Configuration_Showscale_No";
		input52.name = iddiv + "Configuration_Showscale";
		if (this.showscale == false) input52.checked = "checked";
		configDiv.appendChild(input52);
		var labelInput52 = document.createElement("label");
		//labelInput52.for = iddiv + "Configuration_Showscale";
		labelInput52.appendChild(document.createTextNode("No "));
		configDiv.appendChild(labelInput52);
		input51.onclick = function() {
			that.showscale = true;
			that.scaleControl = new OpenLayers.Control.Scale();
			that.olMap.addControl(that.scaleControl);
		};
		input52.onclick = function() {
			that.showscale = false;
			that.olMap.removeControl(that.scaleControl);
		};
		
		configDiv.appendChild(document.createElement("br"));
		// Show Position
		var label6 = document.createElement("span");
		label6.appendChild(document.createTextNode("Show position: "));
		configDiv.appendChild(label6);
		var input61 = document.createElement("input");
		input61.type = "radio";
		input61.id = iddiv + "Configuration_Showposition_Yes";
		input61.name = iddiv + "Configuration_Showposition";
		if (this.showposition == true) input61.checked = "checked";
		configDiv.appendChild(input61);
		var labelInput61 = document.createElement("label");
		//labelInput61.for = iddiv + "Configuration_Showposition";
		labelInput61.appendChild(document.createTextNode("Yes "));
		configDiv.appendChild(labelInput61);
		var input62 = document.createElement("input");
		input62.type = "radio";
		input62.id = iddiv + "Configuration_Showposition_No";
		input62.name = iddiv + "Configuration_Showposition";
		if (this.showposition == false) input62.checked = "checked";
		configDiv.appendChild(input62);
		var labelInput62 = document.createElement("label");
		//labelInput62.for = iddiv + "Configuration_Showposition";
		labelInput62.appendChild(document.createTextNode("No "));
		configDiv.appendChild(labelInput62);
		input61.onclick = function() {
			that.showposition = true;
			that.positionControl = new OpenLayers.Control.MousePosition();
			that.olMap.addControl(that.positionControl);
		};
		input62.onclick = function() {
			that.showposition = false;
			that.olMap.removeControl(that.positionControl);
		};
		
		configDiv.appendChild(document.createElement("br"));
		// Layers
		var label7 = document.createElement("span");
		label7.appendChild(document.createTextNode("Layers: "));
		configDiv.appendChild(label7);
		for (var i=0; i<WIND.Map.Type.length; i++) {
			var layerChoice = document.createElement("input");
			layerChoice.type = "checkbox";
			layerChoice.id = iddiv + "Configuration_Layer" + i;
			layerChoice.name = iddiv + "Configuration_Layer" + i;
			configDiv.appendChild(layerChoice);
			var layerChoiceLabel = document.createElement("label");
			//layerChoiceLabel.for = iddiv + "Configuration_Layer" + i;
			layerChoiceLabel.appendChild(document.createTextNode(WIND.Map.Type[i] + " "));
			configDiv.appendChild(layerChoiceLabel);
			if (WIND.Map.Type[i] == this.baseLayer) {
				layerChoice.checked = true;
				layerChoice.disabled = true;
			}
			layerChoice.onclick = function(e) {
				var layerName = this.id;
				var layerNum = layerName.substring(layerName.length-1, layerName.length);
				if (this.checked)
					that.addLayer(WIND.Map.Type[Number(layerNum)], false);
				else that.removeLayer(WIND.Map.Type[Number(layerNum)]);
			};
		}
		
		configDiv.appendChild(document.createElement("br"));
		// Toolbar
		var label8 = document.createElement("span");
		label8.appendChild(document.createTextNode("Toolbar: "));
		configDiv.appendChild(label8);
		var input81 = document.createElement("input");
		input81.type = "radio";
		input81.id = iddiv + "Configuration_Showtoolbar_Yes";
		input81.name = iddiv + "Configuration_Showtoolbar";
		if (this.showtoolbar == true) input81.checked = "checked";
		configDiv.appendChild(input81);
		var labelInput81 = document.createElement("label");
		//labelInput81.for = iddiv + "Configuration_Showtoolbar";
		labelInput81.appendChild(document.createTextNode("Yes "));
		configDiv.appendChild(labelInput81);
		var input82 = document.createElement("input");
		input82.type = "radio";
		input82.id = iddiv + "Configuration_Showtoolbar_No";
		input82.name = iddiv + "Configuration_Showtoolbar";
		if (this.showtoolbar == false) input82.checked = "checked";
		configDiv.appendChild(input82);
		var labelInput82 = document.createElement("label");
		//labelInput82.for = iddiv + "Configuration_Showtoolbar";
		labelInput82.appendChild(document.createTextNode("No "));
		configDiv.appendChild(labelInput82);
		input81.onclick = function() {
			that.showtoolbar = true;
			pointChoice.disabled = false;
			pointChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_point_on.png";
			lineChoice.disabled = false;
			lineChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_line_on.png";
			polygonChoice.disabled = false;
			polygonChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_polygon_on.png";
			that.addToolBarLite();
		};
		input82.onclick = function() {
			that.showtoolbar = false;
			pointChoice.disabled = true;
			pointChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_point_off.png";
			lineChoice.disabled = true;
			lineChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_line_off.png";
			polygonChoice.disabled = true;
			polygonChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_polygon_off.png";
			that.removeToolBar();
		};
		
		configDiv.appendChild(document.createElement("br"));
		
		// Elements de la barre d'outil
		var pointChoiceIcon = document.createElement("img");
		if (this.showtoolbar == true) {
			pointChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_point_on.png";
		}
		else {
			pointChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_point_off.png";
		}
		pointChoiceIcon.alt = "Point";
		pointChoiceIcon.title = "Point";
		configDiv.appendChild(pointChoiceIcon);
		var pointChoice = document.createElement("input");
		pointChoice.type = "checkbox";
		pointChoice.id = iddiv + "Configuration_Toolbar_PointChoice";
		pointChoice.name = iddiv + "Configuration_Toolbar_PointChoice";
		configDiv.appendChild(pointChoice);
		if (this.showtoolbar == false) {
			pointChoice.disabled = true;
		}
		if (this.showtoolbar == true) {
			pointChoice.disabled = false;
		}
		var that = this;
		pointChoice.onclick = function(e) {
			if (this.checked) {
				that.addDrawing2ToolBar("point");
			}
		};
		
		var lineChoiceIcon = document.createElement("img");
		if (this.showtoolbar == true) {
			lineChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_line_on.png";
		}
		else {
			lineChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_line_off.png";
		}
		lineChoiceIcon.alt = "Line";
		lineChoiceIcon.title = "Line";
		configDiv.appendChild(lineChoiceIcon);
		var lineChoice = document.createElement("input");
		lineChoice.type = "checkbox";
		lineChoice.id = iddiv + "Configuration_Toolbar_LineChoice";
		lineChoice.name = iddiv + "Configuration_Toolbar_LineChoice";
		configDiv.appendChild(lineChoice);
		if (this.showtoolbar == false) {
			lineChoice.disabled = true;
		}
		if (this.showtoolbar == true) {
			lineChoice.disabled = false;
		}
		lineChoice.onclick = function(e) {
			if (this.checked) {
				that.addDrawing2ToolBar("line");
			}
		};
			
		var polygonChoiceIcon = document.createElement("img");
		if (this.showtoolbar == true) {
			polygonChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_polygon_on.png";
		}
		else {
			polygonChoiceIcon.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windmash/css/images/draw_polygon_off.png";
		}
		polygonChoiceIcon.alt = "Polygon";
		polygonChoiceIcon.title = "Polygon";
		configDiv.appendChild(polygonChoiceIcon);
		var polygonChoice = document.createElement("input");
		polygonChoice.type = "checkbox";
		polygonChoice.id = iddiv + "Configuration_Toolbar_PolygonChoice";
		polygonChoice.name = iddiv + "Configuration_Toolbar_PolygonChoice";
		configDiv.appendChild(polygonChoice);
		if (this.showtoolbar == false) {
			polygonChoice.disabled = true;
		}
		if (this.showtoolbar == true) {
			polygonChoice.disabled = false;
		}
		polygonChoice.onclick = function(e) {
			if (this.checked) {
				that.addDrawing2ToolBar("polygon");
			}
		};
		
		/* Show Location
		var label9 = document.createElement("span");
		label9.appendChild(document.createTextNode("Show location bar: "));
		configDiv.appendChild(label9);
		var input91 = document.createElement("input");
		input91.type = "radio";
		input91.id = iddiv + "Configuration_Showlocation_Yes";
		input91.name = iddiv + "Configuration_Showlocation";
		if (this.showlocation == true) input91.checked = "checked";
		configDiv.appendChild(input91);
		var labelInput91 = document.createElement("label");
		//labelInput91.for = iddiv + "Configuration_Showlocation";
		labelInput91.appendChild(document.createTextNode("Yes "));
		configDiv.appendChild(labelInput91);
		var input92 = document.createElement("input");
		input92.type = "radio";
		input92.id = iddiv + "Configuration_Showlocation_No";
		input92.name = iddiv + "Configuration_Showlocation";
		if (this.showlocation == false) input92.checked = "checked";
		configDiv.appendChild(input92);
		var labelInput92 = document.createElement("label");
		//labelInput92.for = iddiv + "Configuration_Showlocation";
		labelInput92.appendChild(document.createTextNode("No "));
		configDiv.appendChild(labelInput92);
		input91.onclick = function() {
			that.showlocation = true;
			that.addLocationBar();
		};
		input92.onclick = function() {
			that.showlocation = false;
			that.removeLocationBar();
		};
		
		configDiv.appendChild(document.createElement("br"));
		// Show Itinerary
		var label10 = document.createElement("span");
		label10.appendChild(document.createTextNode("Show itinerary bar: "));
		configDiv.appendChild(label10);
		var input101 = document.createElement("input");
		input101.type = "radio";
		input101.id = iddiv + "Configuration_Showitinerary_Yes";
		input101.name = iddiv + "Configuration_Showitinerary";
		if (this.showitinerary == true) input101.checked = "checked";
		configDiv.appendChild(input101);
		var labelInput101 = document.createElement("label");
		//labelInput101.for = iddiv + "Configuration_Showitinerary";
		labelInput101.appendChild(document.createTextNode("Yes "));
		configDiv.appendChild(labelInput101);
		var input102 = document.createElement("input");
		input102.type = "radio";
		input102.id = iddiv + "Configuration_Showitinerary_No";
		input102.name = iddiv + "Configuration_Showitinerary";
		if (this.showitinerary == false) input102.checked = "checked";
		configDiv.appendChild(input102);
		var labelInput102 = document.createElement("label");
		//labelInput102.for = iddiv + "Configuration_Showitinerary";
		labelInput102.appendChild(document.createTextNode("No "));
		configDiv.appendChild(labelInput102);
		input101.onclick = function() {
			that.showitinerary = true;
			that.addItineraryBar();
		};
		input102.onclick = function() {
			that.showitinerary = false;
			that.removeItineraryBar();
		};
		*/
		configDiv.appendChild(document.createElement("br"));
		configDiv.appendChild(document.createElement("br"));
		/*var button1 = document.createElement("input");
		button1.type = "button";
		button1.id = iddiv + "Configuration_OK";
		button1.name = iddiv + "Configuration_OK";
		button1.value = "OK";
		configDiv.appendChild(button1);
		*/
		this.eventConfigured = new YAHOO.util.CustomEvent("eventConfigured");
		
		/*
		button1.onclick = function() {
			var nomafficheur = document.getElementById(iddiv + "Configuration_Name").value;
			if ((nomafficheur != null) && (nomafficheur != '')) {
				that.name = nomafficheur;
				nameNode.removeChild(nameNode.firstChild);
				nameNode.appendChild(document.createTextNode(that.name));
			}
			configDiv.style.display = "none";
			that.eventConfigured.fire(that);
			//zoom
			if (document.getElementById(iddiv + "Configuration_Zoomable_Yes").checked) {
				that.zoomable = true;
			}
			else if (document.getElementById(iddiv + "Configuration_Zoomable_No").checked) {
				that.zoomable = false;
			}
			
			if (document.getElementById(iddiv + "Configuration_Pannable_Yes").checked) {
				that.pannable = true;
			}
			else if (document.getElementById(iddiv + "Configuration_Pannable_No").checked) {
				that.pannable = false;
			}
			
			if (that.zoomable == true && that.pannable == true) {
				that.setMouseControl({'zoomWheelEnabled': true, 'zoomBoxEnabled': true, 'zoomDbClickEnabled': true, 'panEnabled': true});
				that.addZoomControl();
			}
			else if (that.zoomable == false && that.pannable == true) {
				that.setMouseControl({'zoomWheelEnabled': false, 'zoomBoxEnabled': false, 'zoomDbClickEnabled': false, 'panEnabled': true});
				that.removeZoomControl();
			}
			else if (that.zoomable == true && that.pannable == false) {
				that.setMouseControl({'zoomWheelEnabled': true, 'zoomBoxEnabled': true, 'zoomDbClickEnabled': true, 'panEnabled': false});
				that.addZoomControl();
			}
			else if (that.zoomable == false && that.pannable == false) {
				that.setMouseControl({'zoomWheelEnabled': false, 'zoomBoxEnabled': false, 'zoomDbClickEnabled': false, 'panEnabled': false});
				that.removeZoomControl();
			}
			that.eventConfigured.fire(that);
		};
		*/
		this.eventConfigured.subscribe(this.onConfigure, this, true);
		
		var button2 = document.createElement("input");
		button2.type = "button";
		button2.id = iddiv + "Configuration_Cancel";
		button2.name = iddiv + "Configuration_Cancel";
		button2.value = "Close";
		configDiv.appendChild(button2);
		button2.onclick = function() {
			configDiv.style.display = "none";
		};
		
		if (this.removable) {
			this.eventRemoved = new YAHOO.util.CustomEvent("eventRemoved");
			
			var removeSpan = document.createElement("img");
			removeSpan.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windapi/images/close.png";
			removeSpan.alt = "X";
			removeSpan.title = "Click to delete";
			removeSpan.style.backgroundColor = "#EFEFEF";
			removeSpan.style.cssFloat = "right";
			removeSpan.style.cursor = "pointer";
			headerDiv.appendChild(removeSpan);
			//var that = this;
			removeSpan.onclick = function(){
				if (confirm("Do you really want to delete it?")) {
					that.destroy();
					that.eventRemoved.fire(that);
				}
			};
			this.eventRemoved.subscribe(this.onRemove, this, true);
		}
		
		if (this.configurable) {
			var configureSpan = document.createElement("img");
			configureSpan.src = "http://erozate.iutbayonne.univ-pau.fr/Nhan/windapi/images/gear.png";
			configureSpan.alt = "*";
			configureSpan.title = "Click to configure";
			//configureSpan.style.backgroundColor = "#EFEFEF";
			configureSpan.style.cssFloat = "right";
			configureSpan.style.marginRight = "10px";
			configureSpan.style.cursor = "pointer";
			headerDiv.appendChild(configureSpan);
			configureSpan.onclick = function(){
				configDiv.style.display = "block";
			};
		}
		
		outerDiv.appendChild(headerDiv);
		
		if (this.draggable) {	
			var dd = new YAHOO.util.DD(iddiv + "Outer"); 
			dd.setHandleElId(iddiv + "Handle");
			this.eventDragged = new YAHOO.util.CustomEvent("eventDragged");
			dd.on('endDragEvent', function(ev) {
				this.eventDragged.fire(this);
			}, this, true);
			
			this.eventDragged.subscribe(this.onDrag, this, true);
			if (options.parentEl) {
				var region = document.getElementById(options.parentEl);
				//Set left to x minus left 
				var left = outerDiv.offsetLeft - region.offsetLeft; 
				//Set right to right minus x minus width 
				//var right = region.offsetLeft + region.offsetWidth - outerDiv.offsetLeft - outerDiv.offsetWidth; 
				//Set top to y minus top 
				var top = outerDiv.offsetTop - region.offsetTop; 
				//Set bottom to bottom minus y minus height 
				var bottom = region.offsetTop + region.offsetHeight - outerDiv.offsetTop - outerDiv.offsetHeight; 
				//Set the constraints based on the above calculations 
				dd.setXConstraint(left); 
				dd.setYConstraint(top);
			}
			else {
				var left = outerDiv.offsetLeft; 
				var top = outerDiv.offsetTop; 
				dd.setXConstraint(left); 
				dd.setYConstraint(top);
			}
		}
	}
	if (this.resizable) {
		var newdiv = document.createElement("div");
		newdiv.id = "yui-gen0";
		newdiv.className = "yui-resize-handle yui-resize-handle-r";
		var newindiv = document.createElement("div");
		newindiv.className = "yui-resize-handle-inner-r";
		newdiv.appendChild(newindiv);
		outerDiv.appendChild(newdiv);
		
		var newdiv = document.createElement("div");
		newdiv.id = "yui-gen1";
		newdiv.className = "yui-resize-handle yui-resize-handle-b";
		var newindiv = document.createElement("div");
		newindiv.className = "yui-resize-handle-inner-b";
		newdiv.appendChild(newindiv);
		outerDiv.appendChild(newdiv);
		
		var newdiv = document.createElement("div");
		newdiv.id = "yui-gen2";
		newdiv.className = "yui-resize-handle yui-resize-handle-br";
		var newindiv = document.createElement("div");
		newindiv.className = "yui-resize-handle-inner-br";
		newdiv.appendChild(newindiv);
		outerDiv.appendChild(newdiv);
		
		var dd2 = new YAHOO.util.Resize(iddiv + "Outer", {'minWidth': 160, 'minHeight':160, 'maxWidth': 1200, 'maxHeight':800});
		this.eventResized = new YAHOO.util.CustomEvent("eventResized");
		dd2.on('endResize', function(ev) {
			this.eventResized.fire(this);
		}, this, true);
		this.eventResized.subscribe(this.onResize, this, true);
	}

	this.container = iddiv;
	this.parentDocument = null;
	this.olMap = null;
	
	this.scaleControl = null;
	this.positionControl = null;
	this.mouseControl = null;
	this.keyboardControl = null;
	
	this.zoomControl = null;
	this.switcher = null;
	this.toolbar = null;
	this.locationbar = null;
	this.itinerarybar = null;
	
	if (!this.baseLayer) { 
		this.baseLayer = "Google Street";
	}
	this.typeList = [];
	
	// List of sensible parts
	this.parts = [];
	this.vectorLayer = null;
	this.annotations = [];
	this.itineraries = [];
	
	// List of interactions -- feature v1.0.5 (16/4/2009)
	this.interactionList = [];
	
	var typesupport = false;
	for (var i=0; i<WIND.Map.Type.length; i++) {
		if (this.baseLayer == WIND.Map.Type[i]) {
			typesupport = true;
			break;
		}
	}
	if (typesupport) {
		this.render();
	} 
	else {
		document.getElementById(this.container).innerHTML = "Don't support map type " + this.baseLayer;
	}
};