function populateDiv() {
	var contentHtml = '<form id="tcCov-form" class="search-page" name="tcCovoiturageRechercheForm" method="post" action="http://www.co-voiturage-gresivaudan.fr/tc-covoiturage-recherche.do" onsubmit="return submitSearchForm()">';
	contentHtml += '<div class="fieldset-wrapper" style="float: left;width: 95%;">';
	contentHtml += '<fieldset>';
	contentHtml += '<legend>D&eacute;part</legend>';
	contentHtml += '<div class="input">';
	contentHtml += '<input class="reset-index" type="text" id="inputDepartAdresse" name="departAdresse" style="color:gray;" value="Adresse (N&#176, rue, ville)" />';
	contentHtml += '</div>';
	contentHtml += '</fieldset>';
	contentHtml += '<fieldset>';
	contentHtml += '<legend>Arriv&eacute;e</legend>';
	contentHtml += '<div class="input">';
	contentHtml += '<input class="reset-index" type="text" id="inputArriveeAdresse" name="arriveeAdresse"  style="color:gray;" value="Adresse (N&#176, rue, ville)"/>';
	contentHtml += '</div>';
	contentHtml += '</fieldset>';
	contentHtml += '</div>';
	contentHtml += '<div class="fieldset-wrapper" style="clear: left; float: left; width: 95%">';
	contentHtml += '<fieldset id="search-options" style="float:none; width: 100%;">';
	contentHtml += '<legend><span>Je souhaite :</span></legend>';
	contentHtml += '<div class="radio" style="margin-top: 5px;">';
	contentHtml += '<input type="radio" name="horairetype" value="Leave" id="horairetype-Forward" checked/>';
	contentHtml += '<label for="horairetype-Forward">Partir</label>';
	contentHtml += '</div>';
	contentHtml += '<div class="radio" style="margin-top: 5px;">';
	contentHtml += '<input type="radio" name="horairetype" value="Arrive" id="horairetype-Arrive"/>';
	contentHtml += '<label for="horairetype-Arrive">Arriver</label>';
	contentHtml += '</div>';
	contentHtml += '<div id="departure-date" class="input auto-date" style="margin-right: 30px; margin-left: 30px;">';
	contentHtml += '<span>le</span>';
	contentHtml += '<input type="text" id="dateDepartAccueil" name="dateDepart" value="" />';
	contentHtml += '<img src="http://www.co-voiturage-gresivaudan.fr/common/img/miniCalendar.gif" id="imgAller" style="display: inline;"/>';
	contentHtml += '</div>';
	contentHtml += '<div class="input time auto-time">';
	contentHtml += '<label>&agrave;</label>';
	contentHtml += '<input type="text" name="hour" id="hour" class="hours" value="" />';
	contentHtml += '<span>h</span>';
	contentHtml += '<input type="text" name="minutes" id="minutes" class="minutes" value="" />';
	contentHtml += '<span>min</span>';
	contentHtml += '</div>';
	contentHtml += '<div style="margin-top: 5px; margin-left: 20px;">';
	contentHtml += '<input type="checkbox" name="flexibility" id="flexibility"/>';
	contentHtml += '<label for="flexibility">+/- 30 minutes</label>';
	contentHtml += '</div>';
	contentHtml += '</fieldset>';
	contentHtml += '</div>';
	contentHtml += '<div class="form-actions">';
	contentHtml += '<input id="searchButton" type="image" height="29" border="0" align="middle" width="118" src="http://www.co-voiturage-gresivaudan.fr/gresivaudan/img/logo/bouton-rechercher.jpg" name="champ_image"/>';
	contentHtml += '</div>';
	var lrvDiv = document.getElementById('formulaireRecherche');
	lrvDiv.innerHTML = contentHtml;

	loadCalendarCss();
	loadFormCss();	

	// utility for date computing
	Date.prototype.isSameDay = function(date) {
		return ((this.getFullYear() == date.getFullYear()) &&
			(this.getMonth() == date.getMonth()) &&
			(this.getDate() == date.getDate()));
	};
	
	loadAllJs();
}
function submitSearchForm() {
	var msg = '';
	if (isInputEmpty(document.getElementById('inputDepartAdresse'))) {
		msg += 'Veuillez entrer une adresse de d\351part\n';
	}
	if (isInputEmpty(document.getElementById('inputArriveeAdresse'))) {
		msg += "Veuillez entrer une adresse d'arriv\351e\n";
	}
	
	if (msg != "") {
		alert(msg);
		return false;
	}
	return true;
}

function isInputEmpty(input) {
	return (input.value == input.title || input.value == "");
}

function attachCalendar() {
	var dateInputElem = document.getElementById('dateDepartAccueil');
	calendarSetup(dateInputElem);
	var time = new Date();
	initDate(dateInputElem, time);
	initHour(document.getElementById('hour'),time);
	initMinute(document.getElementById('minutes'),time)
	initAutoClear(document.getElementById('inputDepartAdresse'));
	initAutoClear(document.getElementById('inputArriveeAdresse'));
}

function calendarSetup(element) {
		// setting up calendar
		Calendar.setup({
			inputField     :    element.id,     // id of the input field
			ifFormat       :    "%d/%m/%Y",      // format of the input field
			singleClick    :    true,
			button         :    "imgAller",
			weekNumbers : false,
			firstDay : 1,
			dateStatusFunc : function (date) {
				return date < new Date() && !date.isSameDay(new Date());
			}
		});
}
function loadCss(path) {
	var headElem = document.getElementsByTagName("head")[0];
	var cssNode = document.createElement('link');
	cssNode.type = 'text/css';
	cssNode.rel = 'stylesheet';
	cssNode.href = 'http://www.co-voiturage-gresivaudan.fr'+path;
	cssNode.media = 'screen';
	if (headElem.hasChildNodes()) {
		headElem.insertBefore(cssNode, headElem.childNodes[0]);
	} else {         
		headElem.appendChild(cssNode);
	}
}

function loadFormCss() {
	loadCss('/modules/gresivaudan/widgetForm.css');
}

function loadCalendarCss() {
	loadCss('/style/calendar-green.css')
}

function loadJs(url, scriptLoaded, scriptNotLoaded) {
	var headID = document.getElementsByTagName("head")[0];         
	var newScript = document.createElement('script');
	newScript.type = 'text/javascript';
	
    var browserName=navigator.appName;
	
    if (scriptLoaded) {
        if(browserName == "Netscape") {
        	newScript.onload = scriptLoaded;
        } else if(browserName == "Microsoft Internet Explorer") {
	         // IE 6 & 7
	         newScript.onreadystatechange = function() {
		         if (this.readyState == 'loaded' || this.readyState == 'complete') {
		        	 newScript.onreadystatechange=null;
		        	 newScript.onload=null;
		        	 scriptLoaded();
		         }
	         }
	    }
	}		 
	
	if (scriptNotLoaded) {
		newScript.onerror = scriptNotLoaded;
	}
	newScript.src = 'http://www.laroueverte.com'+url;
	headID.appendChild(newScript);
}

function loadCalendarFrJs() {
	loadJs('/common/javascript/calendar-fr.js', attachCalendar);
}

function loadCalendarSetupJs() {
	loadJs('/common/javascript/calendar-setup.js', loadCalendarFrJs);
}

function loadAllJs() {
	loadJs('/common/javascript/calendar.js', loadCalendarSetupJs);
}

function get2DigitsNumber(date) {
	if (date < 10) {
		return "0" + date;
	}
	return date;
}

function initDate(element, time) {
	if (element.value == "") {
		element.value = get2DigitsNumber(time.getDate()) + "/" + (time.getMonth() + 1) + "/" + time.getFullYear();
	}

}

function initHour(element, time) {
	if (element.value == "") {
		element.value = get2DigitsNumber(time.getHours());
	}
}

function initMinute(element, time) {
	if (element.value == "") {
		element.value = get2DigitsNumber(time.getMinutes());
	}
}

function toggleText(){
	if (this.value == this.title) {
		this.value = "";
		this.style.color = '';
	} else if (this.value == "") {
		this.value = this.title;
		this.style.color = 'gray';
	}
}

function initAutoClear(input) {
	input.title = input.value;
	input.onblur = toggleText;
	input.onfocus = toggleText;
}

function addLoadEvent(func) {
	var oldonload = window.onload;
	if (typeof window.onload != 'function') {
		window.onload = func;
	} else {
		window.onload = function() {
			if (oldonload) {
				oldonload();
			}
			func();
		}
	} 
} 
addLoadEvent(populateDiv);