var specialCharacters = [
	['À', 'à', 'Á', 'á', 'Â', 'â', 'Ã', 'ã', 'Ä', 'ä', 'Å', 'å'],
	['È', 'è', 'É', 'é', 'Ê', 'ê', 'Ë', 'é'],
	['Ì', 'ì', 'Í', 'í', 'Î', 'î', 'Ï', 'ï'],
	['Ò', 'ò', 'Ó', 'ó', 'Ô', 'ô', 'Õ', 'õ', 'Ö', 'ö'],
	['Ù', 'ù', 'Ú', 'ú', 'Û', 'û', 'Ü', 'ü'],
	['ß', 'Ç', 'Ñ', 'ñ', 'ý', 'ÿ', '¿', '¡', 'ç']
];

function pasteCharacter(obj, textBoxId)
{
	var transtext = document.getElementById(textBoxId);
	var character = obj.innerHTML;
	
	transtext.value += character;
	
	transtext.focus();
}


function showSpecialCharactersPage(page, txtBoxId, containerId)
{
	var code = '';

	if (page < 1) {

		code += '<img style="display: block; float: left;" src="media\/img\/arrow_left_disabled.gif" width="25" height="24" alt="Nothing to scroll" \/>';
	}
	
	else {

		code += '<a href="#left" class="arrow" onclick="showSpecialCharactersPage(' + (page - 1); 
		code += ",'" + txtBoxId + "'";
		code += ",'" + containerId + "'";
		code += '); return false;">';
		code += '<img style="display: block; float: left;" src="media\/img\/arrow_left.gif" width="25" height="24" alt="Show Previous" \/>';
		code += '<\/a>';
	}

	var character = null;

	for (iterator = 0; iterator < 12; iterator ++) {

		if (typeof(specialCharacters[page][iterator]) != 'undefined') {

			character = specialCharacters[page][iterator];

			code += '<a href="#letter" onclick="pasteCharacter(this,';
			code += "'" + txtBoxId + "'";
			code += '); return false;" class="letter"';
			code += '>' + character + '<\/a>';

		} else {

			code += '<span style="border: 1px solid #fff; color: #000; display: block; float: left; font: normal 14px tahoma; height: 17px; line-height: 17px; text-align: center; text-decoration: none; width: 18px; "';
			code += '>&nbsp;<\/span>';
		}
	}

	if (page >= specialCharacters.length - 1) {

		code += '<img style="display: block; float: left;" src="media\/img\/arrow_right_disabled.gif" width="25" height="24" alt="Nothing to scroll" \/>';

	} else {

		code += '<a href="#right" class="arrow" onclick="showSpecialCharactersPage(' + (page + 1);
		code += ",'" + txtBoxId + "'";
		code += ",'" + containerId + "'";
		code += '); return false;">';
		code += '<img style="display: block; float: left;" src="media\/img\/arrow_right.gif" width="25" height="24" alt="Scroll Right" \/>';
		code += '<\/a>';
	}

	document.getElementById(containerId).innerHTML = code;
}