html.js

一个页面界面的邮件程序

/*
 * GContact / PAUL Grégory
 *
 * In this file are general functions to update the view (html)
 */

/*
 * Debug information
 * If true and on big xml response (= lot of results), the browser can spend a lot of time to parse the xml !
 */
var debug = false;

/*
 * Used several times...
 */  
var personForm = '<label for="idgroup">'+ lbl_group +' :&nbsp;</label>' +
				'<select name="idgroup" id="idgroup">' +
				'</select>' +
				'<br/>' +
				'<label for="title">'+ lbl_person_title +' :&nbsp;</label>' +
				'<input type="text" id="title" name="title" value="'+ lbl_titleDefaultValue +'" maxlength="10" /><br/>' +
				'<label for="firstname">'+ lbl_firstname +' :&nbsp;</label>' +
				'<input type="text" id="firstname" name="name" value="" maxlength="255" /><br/>' +
				'<label for="lastname">'+ lbl_lastname +' :&nbsp;</label>' +
				'<input type="text" id="lastname" name="forname" value="" maxlength="255" />&nbsp;*<br/>' +
				'<label for="birthdate">'+ lbl_birthday +' :&nbsp;</label>' +
				'<input type="text" id="birthdate" name="birthdate" value="" maxlength="10" />&nbsp;'+ lbl_date_format +'<br/>' +
				'<label for="note">'+ lbl_notes +' :&nbsp;</label>' +
				'<textarea name="note" id="note" cols="50" rows="4"></textarea><br/>';

var nbResultBeforeShowResultsOpened = 5;
 
// Variable in wich we can find the types available for the user (email, tel, etc)
var typesAvailable;
// Variable in wich we can find the addresses titles available for the user (Home, office, etc)
var AddrTitlesAvailable;

/*
 * Show results by a list of persons, with expandables details (contacts and addresses) for each person
 * @param List of persons (with contacts and addresses), formated in XML
 */
function showResult(resultXML) {
	var content = document.getElementById("content");
	content.innerHTML = "";

	var div = document.createElement("div");
	div.id = "searchResult";
	content.appendChild(div);

	if (resultXML) {
		var elements = resultXML.getElementsByTagName("element");

		if (elements.length == 0) {
			content.innerHTML = msgNoResult;
		} else {	

			var showResultsOpen = ((elements.length >= nbResultBeforeShowResultsOpened) ? false : true);
			
			for (var i = 0 ; i < elements.length ; i++) {
		
				// XML
				var element = elements[i];
				var idUser = element.getAttribute("id");
				var title = element.getAttribute("title");
				var firstname = element.getAttribute("firstname");
				var lastname = element.getAttribute("lastname");
				var birthdate = element.getAttribute("birthdate");
				var age = element.getAttribute("age");
				var canBeDeleted = (element.getAttribute("canBeDeleted") == 'true') ? true : false;
				var note = element.getAttribute("note");
				var group = element.getElementsByTagName("group")[0];
	
				// Div User
				var divUser = document.createElement("div");
				divUser.className = "user";
				divUser.id = "user" + idUser;
				divUser.name = "someuser";
				div.appendChild(divUser);
	
				// Span Nom
				var spanNom = document.createElement("span");
				spanNom.className = "name";
				divUser.appendChild(spanNom);
				var actionInfos = document.createElement("a");
				actionInfos.href = "#";
				actionInfos.name = idUser;
				actionInfos.onclick = getPersonToModify;
				actionInfos.appendChild(document.createTextNode(title + " " + firstname + " " + lastname));
				spanNom.appendChild(actionInfos);
	
				// Span group
				var spanGroupe = document.createElement("span");
				spanGroupe.className = "groupe";
				divUser.appendChild(spanGroupe);
				spanGroupe.appendChild(document.createTextNode(group.getAttribute("name")));
	
				// Span date
				var spanDates = document.createElement("span");
				spanDates.className = "dates";
				divUser.appendChild(spanDates);
				var txtAge = birthdate;
				if (age > 0) txtAge += ", " + age + " " + ((age > 1) ? lbl_years : lbl_year);
				spanDates.appendChild(document.createTextNode(txtAge));
				
				// Span Actions
				var spanActions = document.createElement("span");
				spanActions.className = "actions";
				divUser.appendChild(spanActions);

				// Show / Hide
				var actionShowHide = document.createElement("a");
				actionShowHide.href = "#";
				actionShowHide.name = idUser;
				actionShowHide.onclick = showUserInfos;
				actionShowHide.appendChild(document.createTextNode(( (showResultsOpen) ? msgHide : msgShow )));
				spanActions.appendChild(actionShowHide);
				spanActions.appendChild(document.createTextNode(" - "));
				
				// Supprimer
				if (canBeDeleted) {
					var actionDel = document.createElement("a");
					actionDel.href = "#";
					actionDel.name = idUser;
					actionDel.onclick = delUser;
					actionDel.appendChild(document.createTextNode(action_delete_short));
					spanActions.appendChild(actionDel);
					// separateur
					spanActions.appendChild(document.createTextNode(" - "));
				}
				// Modifier
				var actionMod = document.createElement("a");
				actionMod.href = "#";
				actionMod.name = idUser;
				actionMod.onclick = getPersonToModify;
				actionMod.appendChild(document.createTextNode(action_update_short));
				spanActions.appendChild(actionMod);

				// Details	
				var divInfos = document.createElement("div");
				divInfos.className = "infos";
				divInfos.id = "userInfo" + idUser;
				divInfos.style.display = (showResultsOpen) ? 'block' : 'none';
				divInfos.name = "userInfo";
				if (note) {
					var preNote = document.createElement("pre");
					preNote.appendChild(document.createTextNode(note));
					divInfos.appendChild(preNote);
				}
				divUser.appendChild(divInfos);
	
				var divAddCt = document.createElement("div");
				divAddCt.className = "divGlobalAddressesAndContacts";
				divInfos.appendChild(divAddCt);
	
				// Contacts
				var spanContacts = document.createElement("span");
				spanContacts.className = "contacts";
				var ulContacts = document.createElement("ul");
				spanContacts.appendChild(ulContacts);
				var contacts = elements[i].getElementsByTagName("contact");
				for(var iContact = 0; iContact < contacts.length; iContact++) {
					// Contact
					var liContact = document.createElement("li");
					var type = contacts[iContact].getAttribute("type");
					var value = contacts[iContact].getAttribute("value");
					var note = contacts[iContact].getAttribute("note");
					var contactToAdd = null;
					if (value.indexOf('http://') != -1) {
						contactToAdd = document.createElement("a");
						contactToAdd.href = value;
						contactToAdd.appendChild(document.createTextNode(type + " : " + value));
					}else if (value.indexOf('www') != -1) {
						contactToAdd = document.createElement("a");
						contactToAdd.href = "http://" + value;
						contactToAdd.appendChild(document.createTextNode(type + " : " + value));
					}else if (value.indexOf('@') != -1) {
						contactToAdd = document.createElement("a");
						contactToAdd.href = 'mailto:' + value;
						contactToAdd.appendChild(document.createTextNode(type + " : " + value));
					} else {
						contactToAdd = document.createTextNode(type + " : " + value);
					}
					liContact.appendChild(contactToAdd);

					if (note) {
						var preNote = document.createElement("pre");
						preNote.appendChild(document.createTextNode(note));
						liContact.appendChild(preNote);
					}
					ulContacts.appendChild(liContact);
				}
				divAddCt.appendChild(spanContacts);
	
				// Addresses
				var spanAddresses = document.createElement("span");
				spanAddresses.className = "addresses";
				var ulAddresses = document.createElement("ul");
				spanAddresses.appendChild(ulAddresses);
				var addresses = elements[i].getElementsByTagName("address");
				for(var iAddr = 0; iAddr < addresses.length; iAddr++) {
					// Addresse
					var liAddress = document.createElement("li");
					var title = addresses[iAddr].getAttribute("title");
					var street = addresses[iAddr].getAttribute("street");
					var street_next = addresses[iAddr].getAttribute("street_next");
					var zipcode = addresses[iAddr].getAttribute("zipcode");
					var town = addresses[iAddr].getAttribute("town");
					var country = addresses[iAddr].getAttribute("country");
					var note = addresses[iAddr].getAttribute("note");
					var titleBold = document.createElement("strong");
					titleBold.appendChild(document.createTextNode(title));
					liAddress.appendChild(titleBold);
					liAddress.appendChild(document.createTextNode(" : " + street));
					liAddress.appendChild(document.createElement("br"));
					liAddress.appendChild(document.createTextNode(street_next));
					liAddress.appendChild(document.createElement("br"));
					liAddress.appendChild(document.createTextNode(zipcode + " " + town + " " + country));
	
					if (note) {
						var preNote = document.createElement("pre");
						preNote.appendChild(document.createTextNode(note));
						liAddress.appendChild(preNote);
					}
					
					ulAddresses.appendChild(liAddress);
				}
				divAddCt.appendChild(spanAddresses);
	
				// Spacer
				var divSpacer = document.createElement("div");
				divSpacer.className = "spacer";
				divUser.appendChild(divSpacer);
			}
			
			if (elements.length > 1) {
				var nbResultats = document.createElement("pre");
				nbResultats.innerHTML = (elements.length + " " + lbl_results_found);
				div.appendChild(nbResultats);
			}
		}
	} else
		content.innerHTML = problemXmlResult;
	return true;
}




/*
 * Update the group list zone (called after a person has been updated)
 * @param Groups list, formated in XML
 */
function updateGroupList(resultXML) {
	var listeGroupes = document.getElementById("listeGroupes");

	if (resultXML) {
		listeGroupes.innerHTML = "";