/***********************************************************************************************************************
 * JavaScript for customer sites
 * created:     2008-02-21
 * Author:      Mario Diaz
 *
 **********************************************************************************************************************/
// navi images stuff **** 
if (!nav_imgs) {
	var img_path = "upload/zimages/";
	var nav_imgs = new Array();
	var nav_imgs_over = new Array();
}

nav_imgs['home'] = new Image();
nav_imgs['home'].src = img_path + "home_icon.gif";
nav_imgs_over['home'] = new Image();
nav_imgs_over['home'].src = img_path + "home_icon_over.gif";

nav_imgs['legal_notice'] = new Image();
nav_imgs['legal_notice'].src = img_path + "impressum_icon.gif";
nav_imgs_over['legal_notice'] = new Image();
nav_imgs_over['legal_notice'].src = img_path + "impressum_icon_over.gif";

nav_imgs['icon_minus'] = new Image();
nav_imgs['icon_minus'].src = img_path + "v4_icon_minus.gif";
nav_imgs['icon_plus'] = new Image();
nav_imgs['icon_plus'].src = img_path + "v4_icon_plus.gif";

function changeImage(sImg, bStatus){
	if (bStatus == 0) {
		eval("document." + sImg + ".src = nav_imgs_over['" + sImg + "'].src;");
	}
	else {
		eval("document." + sImg + ".src = nav_imgs['" + sImg + "'].src;");
	}
}





// header state changing: ***


/**
 * reads cookie value
 * @param string sName
 * @return string sValue
 */
function readCookie(sName){
	var cookies = document.cookie;
	// Declare variable to set the name sValue.
	var start = cookies.indexOf(sName + "=");
	// Get the index if the cookie name is found.
	if (start != -1) {
		;
	}
	// Get the first character of the cookie.
	start = cookies.indexOf("=", start) + 1;
	// Read to the end of the cookie.
	var end = cookies.indexOf(";", start);
	if (end == -1) {
		end = cookies.length;
	}
	// Get the cookie sValue, reversing the escaped format by
	// using the unescape method.
	var sValue = unescape(cookies.substring(start, end));
	if (sValue == null) {
		return "";
	}
	else {
		return sValue;
	}
}


/**
 * changes display of header
 * @return void
 */
function changeHeader(){
	var oHeader = document.getElementById("customer_header").style;
	if (sStateHeader == "open") {
		oHeader.display = "none";
		sStateHeader = "closed";
		document.getElementById('icon_expand_header').src = nav_imgs['icon_plus'].src;
	}
	else {
		oHeader.display = "block";
		sStateHeader = "open";
		document.getElementById('icon_expand_header').src = nav_imgs['icon_minus'].src;
	}
	var date = new Date();
	date.setTime(date.getTime() + (20 * 24 * 60 * 60 * 1000));
	if (!bIsMsie) 
		var expires = "; expires=" + date.toGMTString();
	else 
		var expires = "; expires=" + date.toUTCString();
	document.cookie = "stateHeader=" + sStateHeader + expires + "; path=/";
	// alert(date.toGMTString());
}



// msie
var bIsMsie = (document.all) ? true : false;


// opened or not:
var sStateHeader;


sStateHeader = readCookie("stateHeader");
if (sStateHeader == "") {
	sStateHeader = "open";
}





/* *** admin stuff ************************************************************************************************** */

/**
 * gets param from small search field on admin start site and calls site with get param
 * @return void
 */
function searchParticipant(){
	sUrl = document.getElementById('a_part_bookings').href;
	sUrl += "&searchname=" + document.getElementById('search_user').value;
	location.href = sUrl;
}


/* *** user information functions *** */
/**
 * selects all checkboxes
 * @return void
 */
function selectAllUsers(){
	iN = document.forms['bookings_participants_form'].elements.length;
	for (i = 0; i < iN; i++) {
		if (document.forms['bookings_participants_form'].elements[i].type == 'checkbox') {
			document.forms['bookings_participants_form'].elements[i].checked = true;
		}
	}
}


/**
 * inverts user selections
 * @return void
 */
function invertUsersSelection(){
	iN = document.forms['bookings_participants_form'].elements.length;
	for (i = 0; i < iN; i++) {
		if (document.forms['bookings_participants_form'].elements[i].type == 'checkbox') {
			document.forms['bookings_participants_form'].elements[i].checked = !document.forms['bookings_participants_form'].elements[i].checked;
		}
	}
}


/**
 * checks if user has selected something: If not then alert error text else submit form
 * @return void
 */
function checkUsersSelection(){
	bOk = false;
	iN = document.forms['bookings_participants_form'].elements.length;
	for (i = 0; i < iN; i++) {
		if (document.forms['bookings_participants_form'].elements[i].type == 'checkbox') {
			if (document.forms['bookings_participants_form'].elements[i].checked) {
				bOk = true;
				break;
			}
		}
	}
	if (!bOk) {
		alert(sTextNothingSelected);
	}
	else {
		document.forms['bookings_participants_form'].submit();
	}
}


/**
 * checks if user has entered something into textarea
 * if yes then submit else alert error message
 * @return void
 */
function checkUsersInfoMessage(){
	if (document.getElementById('message').value != "") {
		document.forms['info_textform'].submit();
	}
	else {
		alert(sTextNothingEntered);
	}
}


/**
 * shows error form and fills its fields
 * @param string sError
 * @param int iMID
 * @param string sEmail
 * @param string sWholename
 * @return void
 */
function createErrorSendForm(sError, iMID, iBookingStep){
	document.getElementById('error_send_form_layer').style.display = 'inline';
	document.getElementById('error_send_form_layer_bg').style.display = 'inline';
	document.getElementById('error_message_in_form').innerHTML = sError;
	document.forms['error_send_form'].error_message.value = escape(sError);
	document.forms['error_send_form'].mid.value = iMID;
	document.forms['error_send_form'].booking_step.value = iBookingStep;
}


/**
 * closes Error Form layer
 * @return void
 */
function closeErrorSendForm(){
	document.getElementById('error_send_form_layer').style.display = 'none';
	document.getElementById('error_send_form_layer_bg').style.display = 'none';
}


/**
 * prints details of booking
 * @return void
 * @deprecated this function was implemented two times and the current version is implementet in tradefairs.js!
 */
/*
function printDetails(){
	
}*/


/** 
 * finds position of element
 * @return array
 */
function findPos(obj){
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft
		curtop = obj.offsetTop
		while (obj = obj.offsetParent) {
			curleft += obj.offsetLeft
			curtop += obj.offsetTop
		}
	}
	return [curleft, curtop];
}


var bEnterEmailLayerVis = false;
/**
 * for sending details of booking to own email address
 * @return void
 */
function sendDataPerEmail(){
	oEnterEmailLayer = document.getElementById('email_enter_layer');
	if (!bEnterEmailLayerVis) {
		oLayerPos = document.getElementById('icon_mail');
		aTmp = findPos(oLayerPos);
		iX = aTmp[0] - oEnterEmailLayer.offsetWidth + oLayerPos.offsetWidth + 10;
		iY = aTmp[1] + oLayerPos.offsetHeight + 2;
		oEnterEmailLayer.style.top = iY + "px";
		oEnterEmailLayer.style.left = iX + "px";
		oEnterEmailLayer.style.visibility = "visible";
		bEnterEmailLayerVis = true;
	}
	else {
		oEnterEmailLayer.style.visibility = "hidden";
		bEnterEmailLayerVis = false;
	}
}


/**
 * final sending details of booking to own or custom email address
 * @return void
 */
function sendDataPerEmailFinal(){
	bOk = true;
	// if user has entered custom email address then use this:
	if (document.getElementById('which_email_custom').checked) {
		sEmail = document.getElementById('custom_email_address').value;
		if (trimAll(sEmail) == "") {
			alert(sNoEmailGiven);
			document.getElementById('custom_email_address').focus();
			bOk = false;
		}
		else {
			document.forms['send_per_email_form'].email_address.value = sEmail;
		}
	}
	if (bOk) {
		window.open('', "send_email_win", 'top=0,left=0,width=30,height=20');
		document.forms['send_per_email_form'].data.value = escape(document.getElementById('print_area').innerHTML);
		document.forms['send_per_email_form'].submit();
	}
}


/**
 * alerts message after sending email (success or not) and closes that win)
 * @var string sMessage
 * @return void
 */
function alertSendDataPerEmailMessage(sMessage){
	alert(sMessage);
	window.self.close();
}


/**
 * trim function for javascript
 * @param string sString
 * @return string sString
 */
function trimAll(sString){
	while (sString.substring(0, 1) == ' ') {
		sString = sString.substring(1, sString.length);
	}
	while (sString.substring(sString.length - 1, sString.length) == ' ') {
		sString = sString.substring(0, sString.length - 1);
	}
	return sString;
}


/**
 * handles complete printing
 * @return void
 */
function printContent(){
	document.getElementById('print_button_layer').style.display = 'none'; // don't print "print button"
	sBaseHref = document.getElementsByTagName('base')[0].href;
	newwin = window.open("", "details_win", "width=550, height=600, top=0, left=0, resizable=1, scrollbars=1");
	newwin.document.write("<html>");
	newwin.document.write("<head>");
	newwin.document.write("<base href='" + sBaseHref + "' /><title>PRINT_CONTENT</title>");
	newwin.document.write("<link rel='stylesheet' type='text/css' href='css/customer_sites.css' />");
	newwin.document.write("</head>");
	newwin.document.write("<body style='margin: 0; padding: 0; background-image: none;' onload='window.self.print();'>");
	// header img:
	sImg = document.getElementById('customer_header').style.backgroundImage;
	sImg = sImg.replace(/url\(/g, "");
	sImg = sImg.replace(/\)/g, "");
	// alert(sImg);
	newwin.document.write("<div><img src='" + sImg + "' alt='' /></div>");
	newwin.document.write("<div style='width: 510px;'>");
	newwin.document.write(document.getElementById('left_content').innerHTML);
	newwin.document.write("</div>");
	newwin.document.write("</body></html>");
	newwin.document.close();
	document.getElementById('print_button_layer').style.display = 'block'; // display print button again
}


/**
 * changes display of row to insert new block name (if not a new block then hide it)
 * @return void
 */
function changeDisplayNewBlockName(){
	if (document.getElementById('block_target').selectedIndex != 0) {
		document.getElementById('block_name_target').style.display = 'none';
	}
	else {
		document.getElementById('block_name_target').style.display = 'inline';
	}
}


/**
 * gets value from select field
 * @param object oSelect
 * @return string
 */
function selectValue(oSelect){
	with (oSelect) {
		return options[selectedIndex].value;
	}
}


/**
 * Returns the value of the selected radio button in the radio group, false if
 * none are selected
 *
 * @param {radio Object} or {radio id} el
 */
function getRadioValue(oRadioObject){
	for (i = 0; i < oRadioObject.length; i++) 
		if (oRadioObject[i].checked) 
			return oRadioObject[i].value;
	return false;
}


/**
 * checks user form input of view first step
 * @return void
 */
function checkViewFirstStepInput(){
	aErrors = new Array();
	if (trimAll(document.getElementById('view_name').value) == '') {
		aErrors.push(sErrorNoName);
	}
	// checkboxes:
	oForm = document.forms['form_view_edit_step_one'];
	bAnythingChecked = false;
	for (i = 0; i < oForm.elements.length; i++) {
		if (oForm.elements[i].type == 'checkbox') {
			if (oForm.elements[i].checked) {
				bAnythingChecked = true;
				break;
			}
		}
	}
	if (!bAnythingChecked) {
		aErrors.push(sErrorNothingChosen);
	}
	if (aErrors.length > 0) {
		alert(aErrors.join('\n'));
	}
	else {
		oForm.submit();
	}
}



/**
 * selects all checkboxes of form
 * @param string sFormId
 * @param string sCheckboxFirst
 * @return void
 */
function selectAllCheckboxes(sFormId, sCheckboxFirst){
	oForm = document.forms[sFormId];
	sLengthCheckboxFirst = sCheckboxFirst.length;
	for (i = 0; i < oForm.elements.length; i++) {
		if (oForm.elements[i].type == 'checkbox') {
			if (oForm.elements[i].name.substr(0, sLengthCheckboxFirst) == sCheckboxFirst) {
				oForm.elements[i].checked = true;
			}
		}
	}
}


/**
 * inverts selection (checkboxes) of form
 * @param string sFormId
 * @param string sCheckboxFirst
 * @return void
 */
function invertSelectionCheckboxes(sFormId, sCheckboxFirst){
	oForm = document.forms[sFormId];
	sLengthCheckboxFirst = sCheckboxFirst.length;
	for (i = 0; i < oForm.elements.length; i++) {
		if (oForm.elements[i].type == 'checkbox') {
			if (oForm.elements[i].name.substr(0, sLengthCheckboxFirst) == sCheckboxFirst) {
				oForm.elements[i].checked = !oForm.elements[i].checked;
			}
		}
	}
}


/**
 * checks if view is selected and if yes then go to edit view
 * @param string sHref
 * @param string sErrorMessage (nothing selected)
 * @return void
 */
function goToEditView(sHref, sNoViewSelected){
	if (document.getElementById('select_view').selectedIndex < 1) {
		alert(sNoViewSelected);
	}
	else {
		location.href = sHref + selectValue(document.getElementById('select_view'));
	}
}


/**
 * goes to export
 * if view is selected then add view id to href
 * @param string sHref
 * @return void
 */
function goToExport(sHref){
	if (document.getElementById('select_view').selectedIndex > 0) {
		sHref += '&set_id=' + selectValue(document.getElementById('select_view'));
	}
	location.href = sHref;
}


/**
 * checks if view is selected and if yes then go to show view
 * @param string sHref
 * @param string sErrorMessage (nothing selected)
 * @return void
 */
function goToShowView(sHref, sNoViewSelected){
	if (document.getElementById('select_view').selectedIndex < 1) {
		alert(sNoViewSelected);
	}
	else {
		location.href = sHref + selectValue(document.getElementById('select_view'));
	}
}


/**
 * href with confirm
 * @param string sHref
 * @param string sConfirmText
 */
function confirmLink(sHref, sConfirmText){
	if (confirm(sConfirmText)) {
		location.href = sHref;
	}
}


/**
 * shows and positions layer for change block name
 * @param object oCaller
 * @param int iBlockId
 * @return void
 */
function handleChangeNameLayer(oCaller, iBlockId){
	oNameLayer = document.getElementById('block_rename');
	aTmp = findPos(oCaller);
	oNameLayer.style.left = aTmp[0] + 'px';
	oNameLayer.style.top = aTmp[1] + 'px';
	oNameLayer.style.visibility = 'visible';
	document.getElementById('rename_block_text').focus();
	document.forms['rename_block_form'].block_id.value = iBlockId;
}


/**
 * block rename: check if name is given
 * @param string sErrorEmpty
 * @return void
 */
function checkBlockRename(sErrorEmpty){
	if (trimAll(document.getElementById('rename_block_text').value) == '') {
		alert(sErrorEmpty);
		document.getElementById('rename_block_text').focus();
	}
	else {
		document.forms['rename_block_form'].submit();
	}
}


/**
 * opens popup in large view
 * @param string sHref
 * @return void
 */
function showLargeView(sHref){
	bDirectly = (window.XMLHttpRequest); // mozilla, opera, msie >=7 etc
	if (bDirectly) {
		oLargeWin = window.open(sHref, 'large_win', ',type=fullWindow,fullscreen=yes,scrollbars=yes,resizable=yes');
	}
	else { // msie6 and 5
		sSettings = 'height=' + (screen.availHeight - 50);
		sSettings += ',width=' + (screen.availWidth - 16);
		sSettings += ',top=' + 0;
		sSettings += ',left=' + 0;
		sSettings += ',menubar=no';
		sSettings += ',toolbar=no';
		sSettings += ',location=no';
		sSettings += ',directories=no';
		sSettings += ',status=yes';
		sSettings += ',scrollbars=yes';
		sSettings += ',resizable=yes';
		oLargeWin = window.open(sHref, 'large_win', sSettings);
		win.focus()
	}
}


/**
 * checks if email field exists and if so then it checks if email is valid (only '@' char checked!!!)
 * if everything is ok then it submits
 * @return void
 */
function checkAttendeeForm(){
	bOk = true;
	if (sIdEmailField && sErrorEmail) {
		if (document.getElementById(sIdEmailField)) {
			sValue = document.getElementById(sIdEmailField).value;
			if (sValue.indexOf('@') == -1) {
				alert(sErrorEmail);
				bOk = false;
			}
		}
	}
	
	// numeric fields:
	checkNumericFields('attendee_form');
	
	aMissings = checkFormComplete('attendee_form');
	
	// now check for activation of target fields:
	if (aActivateTextField.length > 0) {
	
		for (iTarget in aSubActive) {
			if (aSubActive[iTarget]) {
				eTargetField = document.getElementById('FIELD_' + iTarget);
				if (eTargetField.type == 'text') {
					if (trimAll(eTargetField.value) == '') {
						aMissings.push(aActivateTextFieldLabels[iTarget]);
					}
				}
			}
		}
	}
	
	if (aMissings.length > 0) {
		alert(sErrorMissing + "\n" + aMissings.join("\n"));
		bOk = false;
	}
	
	
	if (bOk) {
		document.forms['attendee_form'].submit();
	}
}


/**
 * handles datatype 581 (attendee form)
 * @param string sId
 * @return void
 */
function handle581(sId){
	if (document.getElementById(sId).checked) {
		for (i = 0; i < aFF581.length; i++) {
			if (aFF581[i] == sId) {
				continue;
			}
			document.getElementById(aFF581[i]).checked = false;
		}
	}
}


// *** activation of text field depending on certain selection *********************************************************
var aSubActive = new Array();


/**
 * handles activation of text field depending on certain selection (directly after displaying form)
 * @return void
 */
function handleActivateTextField(){
	if (aActivateTextField.length > 0) {
		for (iSrc in aActivateTextField) {
			iTarget = aActivateTextField[iSrc];
			if (document.getElementById('FIELD_' + iSrc).selectedIndex != document.getElementById('FIELD_' + iSrc).options.length - 1) {
				document.getElementById('FIELD_' + iTarget).disabled = true;
				document.getElementById('FIELD_' + iTarget).style.backgroundColor = '#D4D0C8';
				aSubActive[iTarget] = false;
			}
			else {
				aSubActive[iTarget] = true;
			}
		}
	}
}


/**
 * if user changes value of src->target select field then this function is called
 * @return void
 */
function checkActivateTextField(iSrc, iTarget){
	aSubActive[iTarget] = (document.getElementById('FIELD_' + iSrc).selectedIndex == document.getElementById('FIELD_' + iSrc).options.length - 1);
	if (!aSubActive[iTarget]) { // reset value
		document.getElementById('FIELD_' + iTarget).style.backgroundColor = '#D4D0C8';
		if (document.getElementById('FIELD_' + iTarget).type == 'text') {
			document.getElementById('FIELD_' + iTarget).value = '';
		}
	}
	else {
		document.getElementById('FIELD_' + iTarget).style.backgroundColor = '#FFF';
		document.getElementById('FIELD_' + iTarget).disabled = false;
		document.getElementById('FIELD_' + iTarget).focus();
	}
}


// *** if user got right for infos on event site ******************************************************************** */
/**
 * activates editing of info field
 * @return void
 */
function activateInfoEdit(iId){
	document.getElementById('info_caller_' + iId).style.display = 'none';
	document.getElementById('info_display_' + iId).style.display = 'none';
	document.getElementById('info_edit_' + iId).style.display = 'inline';
	document.getElementById('t_infos_' + iId).readOnly = false;
	document.getElementById('info_cancel_' + iId).style.display = 'inline';
	document.getElementById('info_save_' + iId).style.display = 'inline';
	document.getElementById('t_infos_' + iId).focus();
}


/**
 * deactivates editing of info field
 * @return void
 */
function deactivateInfoEdit(iId){
	document.getElementById('info_caller_' + iId).style.display = 'inline';
	document.getElementById('info_display_' + iId).style.display = 'inline';
	document.getElementById('info_edit_' + iId).style.display = 'none';
	document.getElementById('t_infos_' + iId).readOnly = true;
	document.getElementById('info_cancel_' + iId).style.display = 'none';
	document.getElementById('info_save_' + iId).style.display = 'none';
	document.getElementById('info_display_' + iId).focus();
}


/**
 * checks if user form is complete
 * @return array (missing items)
 */
function checkFormComplete(sFormId){

	aMissings = new Array();
	for (i = 0; i < aFieldsReq.length; i++) {
		// if element id doesn't exist then it might be radio:
		if (document.getElementById(aFieldsReq[i][0])) {
			oElem = document.getElementById(aFieldsReq[i][0]);
			sType = oElem.type;
			switch (sType) {
				case 'textarea':
				case 'text':
					if (trimAll(oElem.value) == '') {
						aMissings.push(aFieldsReq[i][1]);
					}
					break;
					
				case 'select-one':
					sValue = selectValue(oElem);
					if (sValue == '0' || sValue == '' || sValue == '-1') {
						aMissings.push(aFieldsReq[i][1]);
					}
					break;
					
				case 'select-multiple':
					if (multiSelectValue(oElem, '&') == "") {
						aMissings.push(aFieldsReq[i][1]);
					}
					
				default:
					break;
			}
		}
		else { // radio
			iKeep = i;
			eval("sValue = radioValue(document.forms['" + sFormId + "']." + aFieldsReq[i][0] + ");");
			i = iKeep;
			if (sValue == "") {
				bComplete = false;
				aMissings.push(aFieldsReq[i][1]);
			}
		}
	}
	return aMissings;
}


/**
 * checks if date fields are valid (user input)
 * @return bool
 */
function checkDateFields(){
	bOkDate = true;
	for (i = 0; i < aDateFields.length; i++) {
		bOkDateCurr = true;
		if (document.getElementById(aDateFields[i])) {
			oElement = document.getElementById(aDateFields[i]);
			sTmp = trimAll(oElement.value);
			if (sTmp.length > 0) {
				aTmp = sTmp.split('.');
				if (aTmp.length != 3) {
					bOkDateCurr = false;
				}
				else {
					sTmp = aTmp[0];
					iTmp = parseIntReal(sTmp);
					if (sTmp.length != 2 || isNaN(sTmp) || iTmp < 1 || iTmp > 31) {
						bOkDateCurr = false;
					}
					else {
						sTmp = aTmp[1];
						iTmp = parseIntReal(sTmp);
						if (sTmp.length != 2 || isNaN(sTmp) || iTmp < 1 || iTmp > 12) {
							bOkDateCurr = false;
						}
						else {
							sTmp = aTmp[2];
							if (sTmp.length != 4 || isNaN(sTmp)) {
								bOkDateCurr = false;
							}
						}
					}
				}
				if (!bOkDateCurr) {
					bOkDate = false;
					oElement.style.borderColor = '#F00';
				}
				else {
					oElement.style.borderColor = '#8C8C8C';
				}
			}
		}
	}
	if (!bOkDate) {
		alert(sErrorDateField);
	}
	return bOkDate;
}


/**
 * parses integer without zero at first place
 * @param string sString
 * @return int
 */
function parseIntReal(sString){
	return (parseInt(sString * 1));
}


/**
 * checks numeric fields: eliminate non-numeric values.
 * @return array (not need so far, but maybe in future)
 */
function checkNumericFields(sFormId){
	aWrong = new Array();
	for (i = 0; i < aFieldsNumeric.length; i++) {
		oElem = document.getElementById(aFieldsNumeric[i][0]);
		sValue = trimAll(oElem.value);
		iLength = sValue.length;
		sNewValue = '';
		for (j = 0; j < iLength; j++) {
			sChar = sValue.charAt(j);
			if (sChar == ' ') {
				// ignore: we don't complain about that
			}
			else 
				if (isNaN(sChar)) {
					aWrong.push(aFieldsNumeric[i][1]);
				}
				else {
					sNewValue += sChar;
				}
		}
		oElem.value = sNewValue;
	}
	return aWrong;
}


/**
 * gets radio value
 * @param object oRadio
 * @return string sValue
 */
function radioValue(oRadio){
	if (oRadio != undefined) {
		for (i = 0; i < oRadio.length; i++) {
			if (oRadio[i].checked) {
				return oRadio[i].value;
			}
		}
		return "";
	}
	return false;
}


/**
 * gets values of multi select
 * @param object oObj
 * @param string sDiv
 * @return string
 */
function multiSelectValue(oObj, sDiv){
	var rVal = '';
	for (var i = 0; i < oObj.options.length; i++) 
		with (oObj.options[i]) 
if (selected) 
			rVal += sDiv + value;
	return rVal.substring(sDiv.length);
}


/**
 * draws js graphics statistic pie
 * @param array aValues
 * @param array aColors
 * @param string sHtmlId
 * @param int iAll
 * @return void
 */
function drawPieChart(aValues, aColors, sHtmlId, iAll){
	iWidth = 160;
	iHeight = 100;
	
	aTmp = findPos(document.getElementById(sHtmlId));
	
	// first draw bg (bottom grey)
	oJg.setColor("#AAA");
	oJg.fillArc(aTmp[0] + 10, aTmp[1] + 10, iWidth, iHeight, 0, 360);
	oJg.paint();
	
	if (iAll > 0) {
		// now draw pieces
		iAngleCurr = 0;
		for (i = 0; i < aValues.length; i++) {
			if (aValues[i] > 0) {
				oJg.setColor(aColors[i]);
				iAngleTmp = Math.round(360 * aValues[i] / iAll);
				//alert(aValues[i] + ": " + iAngleTmp);
				
				oJg.fillArc(aTmp[0] + 10, aTmp[1], iWidth, iHeight, iAngleCurr, iAngleCurr + iAngleTmp);
				oJg.paint();
				iAngleCurr += iAngleTmp;
			}
		}
	}
}