From 541bb378ddece2eab135a8066a16994e94436dea Mon Sep 17 00:00:00 2001
From: Giulio Cesare Solaroli <giulio.cesare@solaroli.it>
Date: Mon, 03 Oct 2011 16:04:12 +0000
Subject: Merge pull request #1 from gcsolaroli/master

First version of the restructured repository
---
(limited to 'frontend/beta/js')

diff --git a/frontend/beta/js/Bookmarklet.js b/frontend/beta/js/Bookmarklet.js
new file mode 100644
index 0000000..b8a0c0e
--- a/dev/null
+++ b/frontend/beta/js/Bookmarklet.js
@@ -0,0 +1,400 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+_cble = null;
+
+//-----------------------------------------------------------------------------
+
+isLoginForm = function(aForm) {
+	var inputFields;
+	var passwordFieldsFound;
+	var i,c;
+
+//console.log('is login form: ' + aForm.name + ' (' + aForm.id + ')');
+	passwordFieldsFound = 0;
+	inputFields = aForm.elements;
+	c = inputFields.length;
+	for (i=0; i<c; i++) {
+		if (inputFields[i].type == 'password') {
+			passwordFieldsFound ++;
+		}
+    }
+//console.log('number of password fields found: ' + passwordFieldsFound);
+	return (passwordFieldsFound == 1);
+};
+
+//-----------------------------------------------------------------------------
+
+findLoginForm = function(aDocument, aLevel) {
+	var	result;
+	var	documentForms;
+	var i,c;
+
+	result = null;
+
+	try {
+		documentForms = aDocument.getElementsByTagName('form');
+
+		c = documentForms.length;
+		for (i=0; (i<c) && (result == null); i++) {
+			if (isLoginForm(documentForms[i])) {
+				result = documentForms[i];
+			}
+		}
+
+		if ((result == null) && (aLevel == 0)) {
+			var iFrames;
+		
+			iFrames = aDocument.getElementsByTagName('iframe');
+			c = iFrames.length;
+			for (i=0; (i<c) && (result == null); i++) {
+				result = findLoginForm(iFrames[i].contentDocument, (aLevel + 1));
+			}
+		}
+	} catch (e) {
+		_cble = e;
+	}
+	
+	return result;
+};
+
+//-----------------------------------------------------------------------------
+
+inputElementValues = function(anInputElement) {
+	var	result;
+
+//	if ((anInputElement instanceof HTMLInputElement) && (anInputElement.getAttribute('name') != null)) {
+	if ((anInputElement.tagName.toLowerCase() == 'input') && (anInputElement.getAttribute('name') != null)) {
+		result = {};
+		result.type = anInputElement.getAttribute('type') || 'text';
+		result.name = anInputElement.getAttribute('name');
+//		result.value = anInputElement.getAttribute('value');
+		result.value = anInputElement.value;
+		if (anInputElement.type.toLowerCase() == 'radio') {
+			result.checked = anInputElement.checked;
+		}
+//	} else if ((anInputElement instanceof HTMLSelectElement) && (anInputElement.getAttribute('name') != null)) {
+	} else if ((anInputElement.tagName.toLowerCase() == 'select') && (anInputElement.getAttribute('name') != null)) {
+		var	options;
+		var c,i;
+		
+//console.log('input element values: %o', anInputElement);
+		result = {};
+		result.type = 'select';
+		result.name = anInputElement.getAttribute('name');
+
+		result.options = [];
+		options = anInputElement.options;
+		c = options.length;
+		for (i=0; i<c; i++) {
+			var	option;
+			
+			option = {};
+			option.selected = options[i].selected;
+			option.label = options[i].label || options[i].innerHTML;
+			option.value = options[i].value;
+			result.options.push(option);
+		}
+	} else {
+		result = null;
+	}
+
+	return result;
+};
+
+//-----------------------------------------------------------------------------
+
+formParameters = function(aLoginForm) {
+	var	result;
+	var	i, c;
+	var	action;
+
+	if (aLoginForm == null) {
+		result = null;
+	} else {
+		var	radioValues;
+		var	radioValueName;
+		
+		result = {};
+		radioValues = {};
+		
+		action = aLoginForm.action;
+		if (action.constructor != String) {
+			action = aLoginForm.getAttribute('action');
+		}
+
+		if (/^https?\:\/\/.*/.test(action)) {
+			action = action;
+		} else if (/^\/.*/.test(action)) {
+			action = window.location.protocol + '/' + '/' + window.location.hostname + action;
+		} else {
+			action = window.location.href.replace(/\/[^\/]*$/, '/' + action);
+		}
+
+		result.attributes = {};
+		result.attributes.action = action;
+		result.attributes.method = aLoginForm.getAttribute('method');
+
+		result.inputs = [];
+		c = aLoginForm.elements.length;
+		for (i=0; i<c; i++) {
+			var	inputElement;
+			var	elementValues;
+		
+			inputElement = aLoginForm.elements[i];
+			elementValues = inputElementValues(inputElement);
+			if (elementValues != null) {
+				if (elementValues.type != 'radio') {
+					result.inputs.push(elementValues);
+				} else {
+					var	radioValue;
+					var	values;
+					
+					radioValue = radioValues[elementValues.name];
+					if (radioValue == null) {
+						radioValue = {};
+						radioValue.name = elementValues.name;
+						radioValue.type = 'radio';
+						radioValue.options = [];
+
+						radioValues[elementValues.name] = radioValue;
+					}
+					
+					values = {};
+					values.value = elementValues.value;
+					values.checked = elementValues.checked;
+					
+					radioValue.options.push(values);
+				}
+			}
+		}
+		
+		for (radioValueName in radioValues) {
+			if (typeof(radioValues[radioValueName]) != 'function') {
+				result.inputs.push(radioValues[radioValueName]);
+			}
+		}
+	}
+	
+	return result;
+};
+
+//-----------------------------------------------------------------------------
+
+pageParameters = function() {
+	var result;
+	
+	result = {};
+	result['title'] = document.title;
+//<link rel='icon' href='http://example.com/favicon.ico' type='image/x-icon'>
+
+	return result;
+};
+
+//-----------------------------------------------------------------------------
+
+reprString = function (o) { 
+ 	return ('\'' +	o.replace(/(["\\])/g, '\\$1') + '\''
+					).replace(/[\f]/g, '\\f'
+					).replace(/[\b]/g, '\\b'
+					).replace(/[\n]/g, '\\n'
+					).replace(/[\t]/g, '\\t'
+					).replace(/[\r]/g, '\\r');
+};
+
+//-----------------------------------------------------------------------------
+
+serializeJSON = function (o) {
+	var objtype = typeof(o);
+	if (objtype == 'number' || objtype == 'boolean') {
+		return o + '';
+	} else if (o === null) {
+		return 'null';
+	}
+
+//	var m = MochiKit.Base;
+//	var reprString = m.reprString;
+	if (objtype == 'string') {
+		return reprString(o);
+	}
+
+	//	recurse
+	var me = arguments.callee;
+	//	array
+	if (objtype != 'function' && typeof(o.length) == 'number') {
+		var res = [];
+		for (var i = 0; i < o.length; i++) {
+			var val = me(o[i]);
+			if (typeof(val) != 'string') {
+				val = 'undefined';
+			}
+			res.push(val);
+		}
+		return '[' + res.join(',\n') + ']';
+	}
+
+	//	undefined is outside of the spec
+	if (objtype == 'undefined') {
+//		throw new TypeError('undefined can not be serialized as JSON');
+		throw new TypeError('error');
+	}
+
+	//	generic object code path
+	res = [];
+	for (var k in o) {
+		if (typeof(o[k]) != 'function') {
+			var useKey;
+			if (typeof(k) == 'number') {
+				useKey = '\'' + k + '\'';
+			} else if (typeof(k) == 'string') {
+				useKey = reprString(k);
+			} else {
+				//	skip non-string or number keys
+				continue;
+			}
+
+			val = me(o[k]);
+			if (typeof(val) != 'string') {
+				//	skip non-serializable values
+				continue;
+			}
+			res.push(useKey + ':' + ' ' + val);
+		}
+	}
+
+	return '{' + res.join(',\n') + '}';
+};
+
+//-----------------------------------------------------------------------------
+
+closeBookmarklet = function() {
+	var	bookmarkletDiv;
+
+	bookmarkletDiv = document.getElementById('clipperz_bookmarklet');
+	bookmarkletDiv.parentNode.removeChild(bookmarkletDiv);
+};
+
+//-----------------------------------------------------------------------------
+
+logFormParameters = function(someParameters, anException) {
+	var	newDiv;
+	var base_url;
+	var	help_url;
+//	var	base_image_url;
+	var	logo_image_url;
+	var	background_image_url;
+	var	close_image_url;
+	var	bookmarklet_textarea;
+	var innerHTML;
+
+//
+//	Obsolete: image -> base64 encoding done here: http://www.motobit.com/util/base64-decoder-encoder.asp
+//	conversion done using the Filemark Maker application: http://www.insanelygreattees.com/news/?p=51
+//
+	
+	base_url = 'http://www.clipperz.com/';
+	help_url = base_url + 'help/bookmarklet';
+//	base_image_url = base_url + 'files/clipperz.com/bookmarklet/';
+//	logo_image_url = base_image_url + 'logo.png';
+	logo_image_url = 'data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAAAXCAYAAABOMABkAAAACXBIWXMAAAsTAAALEwEAmpwYAAANJ2lDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjardd5NJRv2AfwaxbGMmbGGHsY2Xcle/YtkWzZUpKdYSYmScqSlDVLKNoo2oQWEonqR5YkyZKtyJKlFLJkmfcPqd7feZfznvNefzzneu7nj/t+7nM+3/vcAHgNdxqNggSAwCB6sK2ZIdnJ2YWM6QQM4IAXsCDi7hFCM7C2toT/uhAA852AAABoV3Cn0SjwfytcsJOzCwBCHgBIPuu9PgCQDq739gBAOkKn0QEQvgBA8vB19wRARACAfLC9rREA4iYA4HzW+woAwB1c7xsAABfq4UMHQHQDMBODPP2CADBTAMy6nl4hHgA4eQDw9AzxCATApQKAVWAg1RMA9xEApD1owXQAPAsAKDg5u5DXl7w3AWAbPwCLxZ+xI5kAZXkA0rv+jIk9AuBxB8hP/jM2awsIAEDwtIZ4q2xd30GsIQDTAIMxKwmASQdYTWMwlvMZjNVrAKg+gFqKx+Hg0I39RrQA/G/v6//8q1AIACQAQhxRiAxHRaAjmE4wR2FiWE6yGrPWsZ1mP4ON50jClRN8OdOIaVzppHPcmTyZvNl8dQJUwdxNuUKXhBvIh0XzN18Ta5U4Jlko1SZzQvaOXKdCjOJdpZ4tp7feV/mgmqRWrj6omaJVqT2qk6H7VG/CIMvwudFXkxzTerMZ8ys7myzmd+Vbvd79xvqNTZvtiv3tPR0OnY5dTt0u6L33XPv29e8fcPtw4ONBrMdjz2GvEe9RnzHfz37jAdyUZ4Ffgr5Sp2nfDn0PngmZo88d/hE6f2QhbPHoUvjPYysRK8dXI2WiOmIQJ5GxqFPoOKbTzGcw8SwJrIlsSezJ2BSOs7hUfBohnTODeI4rk5TFnc1znvcCXw5/rsBFwUubLgtdEb4qkkfOF722+bpYgXihxA2pm1K3pG/L3JG9M1lEuStfrFCiVKp8b8v9LQ+2PtxWplquVj7/KLRC/bFGpVaV9pPt1duf6jxdq4ms1Xum/9zgheE/RnXouth6k5emDWaN5k3mzWzNia8sWixfW7XiWs++sW6zeWvbTmxPf2fXYd+5p4unK7vb8b1Tj0uvQG9un2u/68C+D8Ifrnx0GzwwJDqU/+ngsMeI56jEaOGY92efcd8JmYnbk/5TAV8oXxW+Fk8HfaN+p81smbk/GzwX8oM+rzpfvhC6GLZ09OfRZa3lqpVjqxFrOmtPGQwAhBgSh/yGakbfYcpgjsD4sNizGrFtY5fCSnHw4XjxfAQ+Tm6iJJc0SYPbkmc/bwhfCn+JQLPguBCXsJqID/m86EsxhLiOxCHJe1LTMtKyFLkqBZSigVKa8uBWGZW4bV1qsuo0jTotXu2w7a90efSo+s8NxY2OGbeZCpuF7ag2X7LYYum1K9OqzRpnY2YbZldg/86BzVHf6ZDzJZf6vdP7RPbvdgs/kO9ed3Dck9tLz9vJ54TvVb9a//6ApUCuIDmqMc33UERwakg+vexwQ2jvkYmw+XDUMc4I8nH5E6qR+lEW0btj9p48EOt1ihJHPx18Jio+KuFkYnxSenJiSs7ZC6nZaWnpFzPSz2Vlns+6mX3jfPGFmzl3cksuPrn05HLdlVdX2/La89uvtV/vLRguHLsxdHPk1vTt73emi77enSmeLpksnbo3dn/wwdDDnrK28sZHtRWPHpdUXqxKfxJVHfh0b41F7fZnss+Jz5defPynqe5hfcbL4Aa7RrUmwSZGc8+rhy0Jr11axVpH3zxoO/7WpB3X3v/uaod/p0rnaldLd8b7fT0yPbO9lX0x/RYDpIGBD7c+hgxqD6GHmj6dG94/IjUyNVo5Fv155zj3eP/E9UnKlOrU2pfGr+nTe7+Jf5v6/mAmYtZsjjjX/aNgnrqguYhafLmU9nPvstjyl5Xy1ag1cwYPgwEAJxFhyHCUNqoSfZxJj6mGORpzisWUpY41ju00ewJ2J7aZIxmXjE8h7Ca0cqYS07kySBnc9tzveLJ4s/jO8+cI5Armbroo5CrUL3xF5Co5TzRvc57YNfHrEgWShVI3pG/K3JL1k52Quy1fpHBXsVipRLl0y72t91UebHuoWq5Wrl6uEaaxqFmpValdtf2JTrXuCd01vRr9WoNnhs+NXhjHmqBN6kzrzV7uaDBv3NlkkWiJtXy1q8Xq9e5W61Qbgk2b7Vu7dvt3ezodshx5HLucup3fu/TszXUVdO3b17//g9vHAx/d8w6KHhzy+OQ57DXiXegjuZ4g/hMBdyjylKn/lCKzv1Ok4qjG0aXwn8eWI1aOr55Yi2REQwzyd5JgzmDiWeIbE3Ymsidhk7EpHGfxqYQ0zt9ZwpPNe57vV5Zs+jtL8oeueVwXKxAvlLwhuZEmRfJ3FYoV/8oSlbJt5aqP1CvUH2tUalZpP9Gu3v5Ut0b3rxwxqTd9adpg1rijybzZ4lXo682tVm+s26zf2rQf75DtdOhy7I7pUep16YsbUPkQP6g6lDTsOao9ljbuN+n/hTJN/Z4w5zJ/dilx1ZbBAFg/+wAAmNUAsuQAHHIA7PIB4uQApNwAeG4CWHMA2GsCkkkYkDo0QOzU2Tg/AAEEEAJFMARnCIFUKIVFBBlhgQhD3ES8Rowh8UgzZDSyGrmC0kFFo+pRK2hRtDO6EP2DyZTpFFMJ0zSzGXMe8yiGG+OKqWbBsGiyxLJMsmqxUllr2RTYotgq2HHs0ezvsSRsEPYzhwnHSY5BnDvuOR6F98ZPEWwIWYRVznjOGaIWsYBLnauAa5rkRlrg9uMu55HjecnrzYfhu80vwX+Ef07gkqCZ4Oymq0LiQhHCCOEyEX+yKLlH9NzmzZujxPBireJpEnskBSSHpO5IG0nfkjGU5ZQdlHsgf1rBVVFFCas0pvzPlvytMSqe28xU5dW41FbURzWyNXGatVql2nnbz+mc0Y3UO6J/yIBi6Gfka+xrEmAaZEbfccw8dudZi1zLW7sqrBp391l/t8XYCdtr7LFzoDmmOBU7v3GZdeXbp7vf2y31QJX7Zw9eTzOvo95Ffnz+1gEJlLogJNWAFn3oRQgz3eJwepj4UWr4kwi24y4niiIZ0faxyFOucY/OcMUfSmhLzkxZSnVLq89QOpeTHXL+U45dbt3l4qsSeZeu8RYSbqTcwt0+eze7RKj0+n2FMuPytgr3x9+reZ8W1Rq+oNfh64sadjYntCi8bnsT2l7fQesS7G7ok+zv/pAwqDdcNOr5WWS854vDNM+3rpmcObeFqaWy5UgGH4MBAEhgA16QAT1wgsOQCRUwgMAglBFuiBREDWIWKYt0Q+Yg36HwqF2oJFQLmgO9G52J7mUiM/kxlTItMhsxn2V+j5HAHMa8YCGyeLJUsLKzurIWs6HZ9rM9ZGdj92CvwXJjadgWDlmOZI4pnCWuBM+Bp+I7CfqE65w4zlDOXqIp8R4XmSuda40UQvrC7c89wUPhmeGl887zhfMj+JMEBARuC2oK1m9y2DQuFCXML1wuYiMyQY4TlRRt2Bwkxiv2VNxDAivxTDJISkTqrXS8jKHMqmyVXIS8jvyCQo3iGSV7ZVHl6S01W9NU/LcZqwqrLqt1qD/WuKQZreWj7bhdR0dJV1SPqI82QBnMGH43mjaeNBk1nTWb3PFjJ9KCZMm7a4uV7u7d1rY2AbZH7XLt7+955dDruOJMclHaa+V6aN+F/XVuY+6sB5U9fD1zvGq8v/nK+Hn5Zwd0BAoG7aHm0j4HS4eE0htDhY6EhDWFix1LiZg44RzZEK0WUxBLPJVymngmK4EvMTdZNeV1qlfaz4zkTPWskfOXc/wv7rksc5Upb+ra84KyGxduxd3xuOtaYnpP48G2MsVHCo+lqySqpWuUn+m92FFn85LSeKg5reVq65O2gXZGp0i3To9nX+JA5cepT/wjhmNR4zcnh78KfPOeuTw3uiC9FLRcvoZgMACAGQggBIbgDKlQCm837G+4X1ePxqOd0T+YTJlyfnlfw7iyiLDEskyy2rPWsimwXWTHsUezL2CDsJ85PHHuuE94b/wUIYSwyhlP5CEWcKlzNZHcSAvcqb9NW/HP/fJsLYwQLvtl2WZd8i/HoTKGfxv+I/iX37eatVqlf+z+kfvfu/2f1PoM+vH5W/9bbWjPv93G3P5bbtLWP3KzmDfsXtLc0Hs9Y8NvEXFD8IOKDcNVJ9cVP+vZcNw43pzw6p+WrNdtb0LfCrXXd9A6S7viuht6Qvsk+wMGjD8kDOoNnf50cLhoZH60/bPIeMCE+aT0FOaLw9fC6bhvPt93zMjOss9+nXvz48F81oL9wtRi7JLhT6mfo8uRK3wrl1c5V2NXF9auMxIZDID1+xIAALAZUSnUYLKlkTH8/1Yg5fDGHEgAwHoF7bEDACIASPvRze0BgAQAWmAEVKAAFYKBDJZgBMa/nmTw+P3FD2D9LgcAwEwAuOgIAFCzeCzq3/PSvcLoAABGVNrRYD8fXzrZgEajeJGNqIG0w3SvYHmyeZCHojx5q7KyKgDAfwBYjP/gNJJdnQAAAARnQU1BAADY6/UcFKoAAAAgY0hSTQAAbZgAAHOOAADeVAAAgmQAAHjTAADDvAAAMucAABx04zkiNwAACnFJREFUeNrsnHts1FUWxz+/32/enemL0sLQ0kIfUh5ioQiCQGtFRNmCWElFWFwDEohgQNmwJVAx+pcEWERJLFZFDQ93eSgiAtsl8iyV1LYLpaWtpVBK2Q6lj5npvH6zf7QMjFOUxXUTy++bTGZy55x7z9w53zn3nHMzgtfr9aJAgYJuofo1yuXldaxZ8zEej0zv3qGsXbsQg0HL9u0F7NjxTwDS01NYsmSGstMK7j+CtLfbKSmpRpZloqN74/HIANTXN3Hy5FkkSSQmJkrZZQX3J0FEUUCrVSPLXtTqW1PFxvYhLe0hRFEiObm/sssK7k+C3AlZWRPIypqg7K6CnkmQ8vI6jhz5gZqaBjwemX79evHww4MYM2YIarX0i5NWV1+hqqoeALM5gmHDBgBQUlJNWVkNXi+MHp1MbGwUu3cfpbi4GpfLTXx8X6ZMGc3AgX395jt1qpyqqssApKWlEBxsYM+eo5SV1QKQmNiPp54aQ3R0RLf2uFweTp06y4kTZ6mvtxAcbGDo0DgefzyViIhgP9mqqnqf7QMHmklKiubs2Vr27j1Oc3M7K/+STWhHIdhugCB2vwFeGdRGiJkEolrxsp5CEJfLw7p1O9m27R+0t9vxeGQ8HhmNRkV+/n5GjnyAN998ibi47vMKQeh8/vLL46xduwNJkpg+fTwbN74CwOHDZ1i//gtEUWT+/KnU1l7l0KHvAdBoVEiSyNat37J8eTZZWRN98+7efYzPPz+IWq1iyZIZFBaWc+LE2QC93Ny5TJqU6mdTXd01cnM/5tSpszidLlwuD5IkIkkieXn7eOONFxk//kGf/J49x9iw4W8AvPbaTMrLzeTmfkR7ux2tXseSRZMJPf4qNJyH238rhK4HgAcINcPsMtCGK17WUwjyzjvbyc/fT1CQjtBQI6mpgzAYdBQXV2CxtFFYeI6lSzexdWsOJpP+jpNqNGqCgw2AgF6vvW1chcmkJyhIz969x7Ba7aSlPURUVDjl5bVcvHiVjg4na9Z8TEREKGlpwwHQ6dSYTAaMRh2ffnoQh8PFpEmphIQYKSur5upVC62tNlas+ICIiFBSUhIAaGpqZdGi9Vy4cBmNRsWgQfEkJfWnoaGJ0tJqrl69ztKl7/Hhh39m+PB4n+0mkx6tVsOZMxfYvr2gkxxaNSqpixHGEDAZQKXrSsYk8AKO64AIHhdIkuJdPYkgJSXV7NhRgNGoRxQF3n57HpMnjwKgtraR+fPfoa6ukaKi8+za9R1z507+VQvb7U4WL36WRYumAWCzOVi27H2OHy9Flr1s2fK1jyA3Icte3G6ZlSvnMGtWBgDXr7fxyisbKSurwmZz8dFHB0hJ6YxYmzfv9ZFjxoyJrF79RySp81i0adNuNm/ei9XawaZNe8jLe81vLbVaorS0Go1GxUsvPcUjjwxGlr2E946EJ/eBx9EZMgSh8xh1+EX48evOqOIGBk5TokcPgO8QfeDAaTo6nLhcbjIyUn3kAIiLi2LhwmlkZIwkM3OcX8XqXuB0uhk8OJZ58572jRkMWl599VkMBh1qtYqKiotUV1/5iZ6LUaMG+cgBEB5uYvHiZxBFEa1Www8/VHL9ehs2m4MjR4rRaFSEhZlYsOAPPnIAzJ07mZiYSFQqkeLiSl/ecTsZvV6ZnJzZ5OS8QHp6ChkZIwgyGkAXAUH9IMgMhr5QtrmLHBI4PDDoGZiwQfGunhRBzp+/hEolIcteRo16IEBwxozxzJgx/n+yqMvlZtiwAWg0/kRLSOiH2RxBVdVlXC43dXWNxMebfe+73R5GjEgMmG/w4FgiI8O4dq2ZlhYrjY3NSJKAxdKKWq3C7fbw1lufBujZbB1IkoTV2kFFxSUSEvr55WOxsX2YMuXhn/8wJX+FE6tBJYLTA3ETYdJW/BMUBb9rgng8MnZ7B6IoIIoCvXoF/8bLejGZDAGjarVEUJDeR4bWVluATHBwUMBYUJAOrVbti052uwNBEHA4XBiNOhwOFwcPFvHTWzU6nRZRhI4OJ42NzX7veTweoqMj/XKoAFTthGPLOsnhliFqKEzeBiqj4lk9iSCSJKLRqJFlkGUZi6U1QLClxUp9fVNnjmrU079/5K9YVuDGDWu35Vir1d5pmErCYAh0zhs32gLGrNYOHA5XF8lUaLVq37PT6SYiIoS1axd2fUbZp6fValCpJJxON9HRvbstNtwRlwvg8J/g5nwhMTDli84jl4Ked8RKSDBTWHgOlUqiqKiCmTPT/ATz8/fzwQf7AC+zZk1i1ao597yoWq2itLQam83hR4Iff2zgypUmJElCq5WIje3jb2yXbV6vF+FmTRmoqLiExdKCIAiYTHqiosLR6dT06hXMtWvN2O0OBgwwB5Sna2oasFhakSQxoB/ys7CUwLfZ4LJ1lnZ14fD0bggdpHhUT03Sp04di0ajQq1WUVBwhq++OukTKiqqYPfuo77k/Pa+wb1Ao1FRWXmJd9/dhdvt8VWj1q37AputA5fLTVJSf5KSov30tFoNxcWV5OV97Ru7csXChg1/x+Vy43A4efDBeCIigjEa9UycOByn001bm42NG3fR1mb36R05UsLs2W8xc+Yb5OTkIct3eanZWg/7n4P2f3cm5YIIo9+EsEFgvXLbox7cVsXDekoEGTEikdmznyAvbx8Gg47c3Hy2bStApRKpqKjDbndis3WQmfloQPn1XmA06snP38/Ro6VERYVTW9vAtWvNiKIIyLz88tRu9QwGHevX7+SbbwoJDw/mwoVLNDe3IQgiBoOa+fNv6S1YkElhYTlVVfUcOnSasrJq+vePwmq1U1l5CbvdiU6nYdmy57o9znV/tPoOLBdAowZkECT4/m0oXP2TUl0bpL0Pg+cpXtYTCAKwfHk2JpOBzz47iMXSysmT/+JmjmI06snOzmDFiudvS2RlX8fdZgvyJcFOp4vWVhuSJGG3OwIWdTicTJ06DoNByyefHKC0tMbXEe/VK5jXX8/uloQOh5Pnn3+clhYbO3cW4PHI6PUaAMzmXqxcOcfXJASIigrjvfeWsmbNJ5w+fY6amltXYDQaFVFRYSxZ8ixTpoy+5ddOF21tdkRR9OVD/umTt7NT7nTd3AXoaAiUcwIuJYL0KIKIosCiRdPIzBzHsWOlXLzYCECfPuGkpj7AkCFxfsqJidFs3ry0qyKk8VV8MjPHkZwciyAImM2B96Pcbhm9Xs2qVXPIyBhBYeE57HYnMTGRpKen3PFOldvtISQkiJycF3jyyVTOnKnE6XQzcGBfHntsBJGRoQE6cXFRbNnyOkVFFZSWVtPU1IJGoyIxMZqxY4fSu3eIn/z06Y8ydOgABEEgMjIs0AjzeJi24873sHy/Hk7oM1rxsJ5EkJuIjo4gO/uxX1QOCzMG3H0CiI83+/UvuvUfT2e0GTt2CGPHDrlrg29WodLTU0hPT7krHUkSGTMmmTFjkn9RNiGhn18/JPBsGAMJMYrn3G9JugIFCu4ygvxWcDrdWK0O3+v/Tq/jv9ZToOB3RZAnnhhFTEwkoigwYMDdN9SysiYwcmQisuwlOTlW+dYU/N8gKP9qokDBnfGfAQA9nOAwz2UemwAAAABJRU5ErkJgggo=';
+//	background_image_url = base_image_url + 'background.png';
+	background_image_url = 'data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAGlCAYAAABAwstlAAANMWlDQ1BJQ0MgUHJvZmlsZQAAeJyV13k0lG0fB/DfLIxlzDDGHkb2XWQPWSJL9mwpMXbDTAyplCUpRJZQtKBoU5RIJKqHLAnJklBUZCmFSJZ5/5Dqfc553ue81x/3+d2/+9znuu77nM/3OhcAXsuTRqMgASA4hB5qb2ZEcnF1I2F6AAM44AMsiHqSw2iGtrZW8I9jvgcQAABdip40GiUc3ZFJftCtapBvLz7n36D0z+8BAAAu1MXVDQChAABEv7V6KwAQvdZqRwAg7qfT6AAIfwAgkv09vQEQUQCgEOpobwyAuAoAOL+1ugoAcF5rdRMA4CLIfnQARB8AMyHEOyAEADMFwKzv7RNGBsApAIC3dxg5GACXBgDWwcFUbwDcWwCQIdNC6QB4FgBQdHF1I60teVcSwGYBABbL3739WQAVBQAyO373xO8B8HoCFKb87s3aAwIAELztYb5qqgAAgMAaATANMRizUgCYDICVdAZjqZDBWLkEgBoAqKeQw0Mjfv4vBKIN4N/u177550AhAJAACAlEMfIgKgodxXSEOQYTx3KU1YS1ge04+wlsIsdJXCWnP1c6IZ07g3iaJ4s3iy+Hv0GQKpS3IU/4vEgTKVyscOMl8XbJQ1LF0p2yR+RuyPcoxindVO7fdFz1jtob9ZMalZrD2qk61bqjepn6Dw0mDLONHht/3pZr2mg2Y37RosVyfkeh9XObDtsOu077ZcfrO7udepx7Xfrc0Ltuuw/sHtwz5PFm71svLPm+93ufD76jfmP+HwPGg3goj4I/hXymTtO+7PsaOhM2R58L/xYxv38h8vuBxYM/Di1HLR9eiZaN6Y5DHEXGo46hE5iOM5/AJLIksSaznWRPwaZynMKl4dM5M7gyCae5s4jZPDm8Z/jO8ucK5AmeEzq/4YLwRZF80QJSodiljZfFiySKJa9IX5W+JnNd9obcjckSyk2FW4qlymUqtzfd2VSuendzhXqlRuX8vYgqzfta1To1ug+21G55qPdwtS663uDR1seGT4z+Mm5AN8Q3bntq2mTWbN5i3srWmvzMss3quXU7rv1Uh22n3Qv7LkJXxkuHbseenb28vTl9zq9c+t1eC77OG3AfdB/a/UbkzcW3HsN7R8RGCt95vSd/8B6VHC0e8/3oN+4/ITtxfTJwKugT5bPi51vTIV+oX2kzm2buzIbOhX2jz6vPVy5EfI9cPPDjwJLOUs3yoZWoVb3VhwwGAEIciUN+QbWibzBlMkdh/FgcWY3ZNrNLY6U5+HF8eH5Ofi4eghS3DFGLx4p3D18Yf6pAqWCr0Lgwt4iGqB/pjNhTcYSEnuQ+qdvS07IychT5GkWUkqFyusqwqqxawuZeDTlNmlaDDp9u5JZn+rwG1K2PjSSMD5l0moqYRW6vNV+03GTlsyPLutMWZ2dmH+lQ5PjSic15q8s+1/Nujbumd4vusfE4uLfQs8Fr3JvHx8DXxe+If35AfeBg0GIwd4g81YTmvy8qNC2skF4R3hTxev9E5PxB1CGuKNJhhSPq0VtjLGNt4nYd3Rvvc4ySQD8eeiImMSbpaHLiyYyU5NTcU2fTctLTM85lZpzOzjqTfTXnyplbZ6/m3sgrPffg/IMLDRef5XcWdBV2Xeq6/LroffHYlZGrH65NX/96Y7rk882ZW9Olk2VTt8fuDJeP3O2v6Kxsvldfde9+afW5mowHMbXBD3fVWdZveST3mPB48cnbv1oa7jZmPg1tcmjWaBFqYbT2P7vblvTcrV28fbSjvPPwi21duK7Bl/ndgT1qPSu9bX2Zr3b3y/bPvq4eiBu0HCIODb259jZsWHcEPdLy7vT7PR+kP0yNVo/FfrQY5xkfnLg8SZlSn1r91Pw5Y3rXF4kvU1/LZ6JmzeYIc33fiuapC9rfUd+fLqb/2LUkvvRpuXIlZtWcwctgAMBRRCTyIEoXVY0+zGTAVMcciznGYsrSwJrAdpw9CWuBbeVIwaXgUzltONu50ggZ3JnETB5Hnpe82XzZ/GcEcgXzhPI2nBN2Fx4UuSiaTyoQK9hYIH5J4rJkkVSx9BWZq7LX5ALkJuSvK5Qo3lS6pVyqUrbptuodtfLNd9UrNSo1K7Uitb5rV+tU69ZseaBXq39Ef9Wgbmu94SOjx8ZPTOK3obc1mDaaPd3eZN5s0WKZbIW1erajzfq5Tbttmh2nXaf9C4cux5c7e5yynXmde136XF+59e/KcxdyH9g9uOeNx9u9bz0LvMS8RsjvvN/7fPAt9pNaS5DAiaAbFAXK1H+lyOyvFKk6oHVg8eCPQ0tRy4dXjqxGM2IhDvkrSTAnMIksic1JFsnsJ7Ep2FSOU/g0znSuX1nCm8N3hv9nlmz4M0sKRy6RL4sXSRRLXZFaT5MShZuKt5T+yBK1is2V6vc0qzTva1Vr1+g+0K3d8lC/Tv+PHNnWaPrUtMmseXuLeavls4jnG9utO2w7bV/YdR3ulutx6nXui+tXfu02kDCk9iZxWH3k5HvvUd2x9PGAycBPlGnq16Q5t/lTi8kr9gwGwNreBwDArAGQLQ/glAvgUAiQIA8g7QHAexXAlgPAURuQTCKA1KMBwkJvff8ABHCCMCiBEbhCGKRBGXxHkBCWiEjEVcRzxBgSjzRDxiJrkcsoPVQsqhG1jBZDu6KL0d+YTJmOMZUyTTObMRcwj2J4MO6YWhYMizZLPMskqw4rlbWeTZEthq2KHccey/4KS8SGYD9ybOM4yjGM88Q9xqPwvvgpTjvObM4VrkSuGYIOoYhbk7uIe5roQVzgCeCp5JXnfcrny4/hvy4gKbBfYE7wvJCZ0OyGfGEJ4SgRhEiFaCBJjNQvdnrjxo0x4njxdol0yZ1SglIj0jdkjGWuyRrJcckNy5crHFd0V1JTxiqPqfy1qVA1Ts17s5m6gga3xrLmqFaONk67XqdMt2DLab0T+tEG+7fuM6QYBRj7m/hvCzINMaNvP2Qeb3HKMs/q2o4q62abAduv9hgHEUetnQ5ONOdUl1uuHW6z7vy79ff4eqTtrfH8SObzNvM54FsSwB9oG5REaQhBUg1psfuehDHTLcMzIiUOUA8+iGI77HakJJoR6xiPPOaecO8Ed+K+pM6UrNTFNI/0xkzl07k5YWfe5TrkNVy4lS9ZcP4SXzHnldRruOunbuaUCpddvqNYYVLZWeV5/2st38OSeqMn9AZ8Y0mTRWtSm+Lzzo6IrsZuWq9QX9OA1GDfm6Rhg/clo94fRcf7PzlN837pncmd81iYWqxYimbwMxgAgAQ24ANZMAAXCIcsqIIhBAahgvBApCLqELNIOaQHMhf5EoVH7UCdRLWhOdA26Cz0ayYSUwBTGdN3ZmPmU8yvMJKYcMwTFgKLN0sVKzurO+stNjTbHra77GzsZPY6LA+Whm3jkONI4ZjCWeFK8Rx4Kr6HcyvnZS4cVwTXa4Ip4TY3iTuDe5UYRvzEE8gzwUvhneGj883zHxRACJwUFBS8LqQt1LjBacO4cIyIgEilqJ3oBClBTEqsaWOIOJ/4QwmyJFbykVSItKj0C5lEWSPZFbka+SgFPYUFxTqlE8qOKmIq05vqVNPVAjebqIuoL2l0a97XOq8dq+On67xFT09ZX8yAsBVtiDKcMfpqPG0yuW3UdNZscvs3C6Ql0YpvxyZrfRsbW3u7IPsDDnmOd3Y+c3rtvOxKdFPeZe2+b/fZPQ0eY56sXipkf+9cnzrfL/6yAT6BOUHdwUIhO6l5tI+hMmER9OYI4f1hkS0HxQ+lRk0ccY1uitWIK4onHEs9TjiRncSfnJeinvo8zSf9R2ZKlmb2hzMXcgPP7bwgm89UMHXpcVHFlbPXEm6Qb7qXmt7WKt9coXRP8b5MjWStTJ3KI4Mn2xvsnlKa97Wmt+W3P+gc6mL0iPbp9XsPJA9Vv516J/DBaCxm/Ork+8+CX3xnLsyNLsgshixVriIYDABgBk4QBiNwhTQogxfr9tfdr6lH49Gu6G9Mpky5P72vYtxZRFniWSZZHVnr2RTZzrHj2GPZF7Ah2I8c3jhP3Du8L36KM4xzhSuRwEso4tbkbiF6EBd40n6ZthaY++nZVgQhUvHTst2a5J+OI2SN/jT8W/BPvy+063XKftv9Lfef3f4vtX7DAfyBtn9XG9H/d7dx1/+Ue1L1t9xs5nW757XX9V7OXPdbQlgXXF61brjm6JriR/3rjpvHW5Oe/dWW/byzI+KFcFdjN62nrDehr6k/YkBqMGjI5E3SsMHI8Xde70s+zI92fRQdD5own5SZwnxy+lw8nfDF7+v2GblZ9tnPcx3fyuezFxwXpr7HLxr9kP4xuhS9zL98YYVrJX5lYfUyI5nBAFg7LwEAAJsxlUINJVkZm/zL4e7/HcGU8PU5kACA9QnZ6QAABACQCaCbOwIAEQB0wBioQAEqhAIJrMAYTH5eSUD+9SQAYO0sBwDAzAlwzhkAoO77oZi/z0v3iaQDABhTaQdCA/z86SRDGo3iQzKmBtPC6T6hCiTzELKSAklVRUUdAOA/67wHk5DqTvYAAA7ISURBVHic7d1NjNz3Xcfx78w+2Y7tJo5rjEOVh6YoNaWAcqgSIiFURYVWEEJIT9wRF4SK4AZCQoJLIwWJCxcuHCo1TaJIqE3CgyrIg+K2qKVpm0DzUMWpHSdO4ti7ftjdGQ6zf+9//95N7Zm1vZ/k9ZL+mp3Z2ZnxYd/6/n7z33EVAAAAAAAAAAAAAABsJb0P2fMCm2d4pZ/wSoSj+xy9DW7f6P7A1deN00bXL2vELlccuo/bX7mtHavu9cv5eoDJDda5Pqy1sepe31SbHYj247Uj1V/nst/6md4GjwFsDetFqTkGrWO9729auKY364HqwumpX1VTtRqnqc71dtDWm7aAq2/Y+bq53o7Ucufr5noTs+7jjG2zgtVEph2n5uuZqpo6cOCOj+39yK2fn5nZ8dler39Tr9ff1+v1rtmk5weukOFwOD8cDo4NB4OfnFta+Pe33n3x8SNHDh2uUagWazVayzVqQzdeY9uMaaY9ITWxml45Zm644c4b9u05+Bcz03NfrOpNbcLzAVvKcHlx8czXjh7//pePHDn0eo2itdQ6lmvt0nFskwarvYxrh2q6quYO3vrFz+/c+dG/r15v54TPA2xxw+Fw/uTJo1964aWHH6+qszUKV3O0l41jLw8nmXg2itVMVW3/9ME//KPt26//cq/Xm5vgOYAQvV5vdnZ21xf2XPfx08feev75zrc3ZQ9rkgmrvQxsQjVTVdtu+/h9X9i1a/8/9nq9NY9/8y37655776zP3HFb7d+/p3bs0DJIs7Bwto4efbuee/aFeuzRZ+qVl4+u+f5wWIMTJ177k/995bFvVNWZGk1bZ2t1edhMW5ds3GB196xmaxSruX37fu2mGw/c+a/tDfXp6an60z/7/brv/ruq3++v/4hAnMFgUA8/9FQ9+MAjtbS0fP724XA4//Jr3/zd48d/8GqNonWmqs7V6r7WWPtZ4y4Jm2A1pyrM1Cha2z9x02//1fT07K82d5yenqoH/+GP6+7P3V6dgQsI1+v16pc+dWN9+lduricf/04NBsPm9tkd266/9o03v/eftbpv1d58rxpjmThJsJpTF2aqaq6q5vbu/eWb9u659e+qeufHqC/9+R/U3Z+7fcynARLccMPe2r17Rz3z9A/P3zY9PfuJhbMnvnHmzPH3au27hGOf4jDO+qx7GkOz2T67b89tv9U+deHmW/bXffffNc7rAsLcd/9ddfMt+1u39Kb2XX/w7qraXqvbRu1zNC95yTXJhlL77PWZqpqdm939G+073HPvnfas4EOi3+/XPffeuea27XPX/XqNVmCztTrcTNWFf5J3cc8x5mtb7x3CuX5/+hfad/rMHbeN+fBAou7vfH9q5kBVbatRsGZr7YR1ycYNVvtPcM4vCfv9qb3tO+3fv2fMhwcSdX/np3pT19dowmpOe2omrO4nuFyUcfewmssmXNNVNdPr9be37+g8K/hw6f7O9/pTzXTV7F+NHauqyZaE7T2sZsoC6Gomq+a4Ypvu3Y+D6XcOgK7uR0t1+3HRJt10735CA0BX+93Bsaerqsmmom4lncYOrGe9yeqKB6vqwkkLoGviUDUmnbAAfpaN3hG8ome6t1+ICQvYyHr/W9ZVWRIC/CybthoTLCDGJKc1AIzrii4Ju2tRAQPez0a9uGJ/Swhwsd6vGxfdFHtYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEECwghmABMQQLiCFYQAzBAmIIFhBDsIAYggXEmCRYw84BsJFN6cU4wRIo4FJ1mzF8n+9taNwJS7CAzXBJLbGHBcTYzGCZuoD1bFobNnXCGg6Wz7SvLyyc3cyHB7a47u/8YLB8trZQsAY1ejGDqhouD5beaX/z6NG3J3x4IEn3d355sHhi5cvmzbpBTfDG3STBGrReSFXVcHn53BvtOzz37AsTPDyQpvs7v7R05q26MFLdy4u2GUvCwcqxPL9w7L/b33js0WdqMBis/1PAB8pgMKjHHn1mzW2n5o8+X1XLreOKnofVPflr0D6OvvU/h4bD4flCvfLy0Xr4oafGfW1AkIcfeqpeefno+evD4XBw7Pj3v1udTrSOS47XJOdhtZ94qaqWTp16/Y35hWNPt+/44AOP1LcOvTjm0wAJvnXoxXrwgUfW3HZq/si35+ffOFYrfajVKasdrEsyNebr61fV9MrPz6wcs1U1d/rsu0f2XveLv9nr9aerqgaDYT35+Hdq9+4d9cmDH6terzfmUwJbzWAwqK999b/qr//yn2tpabl1+/LZH7/6xD8tLs6/XVWnqmqhqs5U1dmqOldVi7Uar4s2TrB6K0d/5ZiqUbxmq2rm3LmTg15v+p1dOw/c3utVb/Tih/XM0z+s//i379bi4nJds3Nbzc3N1szM9BhPD1xNCwtn67XX3qzHv/7t+tu/+Up9/V8O1WCwOiwNh8Ph60cOfeWdd//vxaqabx1nVo52sC5pyhpn3OnV6mQ1W1XbqmpnVe2qqo9U1bVVteeWGz/7O9dfd9vv9YxU8KExHA6Hbx7/wROvvvbNJ6vqnap6d+XyRFW9V6NJ63SNJq1mmXjR0Rp3wqoaTVdNvJpjujneOfHK4RrU8Z07f/6TzfIQ+OAaDJbOHf7pcw8fPvLsszVaBp6q1emqvSRcrFGsmr2sizbuHlbV6rKwuZyq1YD1q6p/cv6nx989+ZPnt81du3N2dtfPmbbgg2c4HA7eO3n4+R+/+sRX3z3x0ks1CtXJ1uXCytGOVROsSzJuQJowNRPVtqrasXLsWjl2ty6v2b597/6P7jn4qd07D9w6PbP9uumpuWv6/emZMZ8fuEoGg6XFpeWz84uLp0+cPHX45Tff/tGPTp8+/maNlnpNqN5rHfMrtzVLwXO19rysizZJsLob7ttWjmtqtKe1s1ZitfL19pVjbuX+zbuMzZRW5dMjYCtqn5nenNK0XKNpabFGETpTq0u/9nTVLAtP1yhUzZQ11qkN4+4tNS+613rh7eVhr/WPa8a/syvHbK0Ga7rzc1XjRxS4fAaty2Y6WqrR736zN7VQq9NU83V7qmqfyjDWeViTboZ3a9trHe1gnavRP+p0rR+s9pQlWLD1dKerQY1+55upqZmymv2qM63Lc7X6juBYoWpMEqzmxW/0vabCzT/qdI2WjLM1OiWiWU62gyVWsDW1/ySv2TBvJqxmgmomrTO19iTRJljt0xjGitZmTVhVo9gsdm5vV3i2RtGaqbXTVfPuYjtW9rLg6lvv0xWaCamJTxOi9v5Uc9nEqrnfRB8tUzV5sKounLQWa+3oOFOre1hNrJrztjaarkxacPWtF5b23xA3IWoum32q9qkL7VhNtBys2pxgNdqbcu1gNWNjO1TN0d5sb09VggVbR3sqan7P25vn3T9ubp9n1XSgasJYVW1+GLonk645kbTWn6zaobIUhK2ne1pD1doYtb9u9qgm+hiZjVyOSaZ7TlW/Llz6rffOoKkKtrbup4a2V1ODdW6rWrtdNLHLGYn1YtTdrxIqyNKelNofk77esemuVCy6z7NRqMQLtq71/vfmsf4H53FttUBstdcD+D9HAQAAAAAAAAAAAAAAIN3/A/PNWgCA/F3MAAAAAElFTkSuQmCCCg==';
+//	close_image_url = base_image_url + 'close.png';
+	close_image_url = 'data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAIAAAC0D9CtAAAABGdBTUEAANbY1E9YMgAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAGiSURBVHjaYvz//z8DiYAFU+jhg5cXLtx9/+4LLy+nlpa8hpYsIyMjTj03rj/u71l74fxdZEEFRfG8wkBrG224CCPcbfv2XKivWfjr1x+s7snM8U1IcoOwmeA24NEABNOnbN698yyKHqCTIBrcPU2WrKiIjHYEsh2c9BctK0tMcYeomdC37sePXyAW0G0P7r8wM8yBoFs3n/wHgwP7L/79+xfI+Pnzl6VpHkR27+7zQBGQPcie3rr5JIRh76DHxASS3bHtzN8//yCCF87fgbrt/fsvcD3Ll+4/eOASnPvg/suO1hVwLjACoHqA8QAXBfrB1k4HOaDjEl3hXF4+LqgeYMTBRZNS3CFOAtoAEUlIdGNmgQaVlrYcVA8wpoHmQUT377v469fvTRuOR4W1zZi25cf3X6DAAPuHi4vd1l4XEadHj1wtypsB0QY0Fe5pZHZOvn9svAsifoBJAxjTEDZcETLbw8s0Js4ZPe0AATCmgRH35vUn5BQAdFJSqgdQAzylMqLlBWBMHztyDRgPoHTNxwX0NNAP/PzcyGoYycg/AAEGABYVzxqE3YcJAAAAAElFTkSuQmCCCg==';
+	
+//	newDiv.parentNode.removeChild(newDiv);
+	newDiv = document.createElement('div');
+	newDiv.setAttribute('id', 'clipperz_bookmarklet');
+//	newDiv.setAttribute('style', 'width:270px; height:400px; padding:20px 0px 0px 20px; margin:0px; border:0px; background-color:transparent; background-repeat:no-repeat; position:absolute; z-index:20000; top:40px; left:40px; background-image:url(' + background_image_url + ');');
+
+	innerHTML = '';
+	innerHTML +=	'<style>div#ClipperzBackgroundDIV { width:290px; height:420px; padding:20px 0px 0px 20px; margin:0px; border:0px; background-color:transparent; background-repeat:no-repeat; position:absolute; z-index:20000; top:40px; left:40px; background-image:url(' + background_image_url + ') }</style>';
+	innerHTML +=	'<div style="border:0px; margin:0px; padding:0px; padding-left:10px;">' +
+						'<img  style="padding-top:5px;" src="' + logo_image_url + '">' +
+						'<a href="javascript:closeBookmarklet();">' + 
+							'<img style="padding-left:28px; padding-bottom:10px;" border=0 src="' + close_image_url + '">' +
+						'</a>' +
+					'</div>';
+						
+	if ((someParameters != null) && (anException == null)) {
+		innerHTML +=	'<div style="width:255px; border-top:1px dotted #336;">' +
+							'<div style="line-height:10pt; margin-right:10px; margin-top:5px; padding:5px 10px; color:#666; text-align:left; font-family:sans-serif;">' +
+								'<p style="margin:0px; font-weight:bold; font-size:10pt; font-family:sans-serif;">How to add a new card or a direct login to an existing card for this website:</p>' +
+								'<ol style="padding:0px 0px 0px 20px; font-size:9pt; font-family:sans-serif;">' +
+									'<li>Copy the content of the text area below (Ctrl-C)</li>' +
+									'<li>Go to your Clipperz account</li>' +
+									'<li>Click "Add new card" or select the related card</li>' +
+									'<li>Paste the direct login configuration (Ctrl-V)</li>' +
+									'<li>Complete and review the details, then click "Save"</li>' +
+								'</ol>' +
+							'</div>' +
+						'</div>';
+		innerHTML +=	'<textarea id="bookmarklet_textarea" style="border:2px solid #333366; font-family:sans-serif; font-size:8pt; color:#336; width:240px; height:135px; padding:4px; background-color:white; margin:0px 10px;">' +
+							serializeJSON(someParameters) +
+						'</textarea>';
+	} else if ((someParameters == null) && (anException == null)) {
+		innerHTML += '<div>No login form has been found on the page</div><div>Get some help <a href="#">here</a></div>';
+	} else {
+		innerHTML += '<div>An error happened while processing the page</div><div>Get some help <a href="#">here</a></div><div>' + anException.name + ' - ' + anException.message + '</div>';
+	}
+	
+//	newDiv.innerHTML = '<div style="width:290px; height:420px; padding:20px 0px 0px 20px; margin:0px; border:0px; background-color:transparent; background-repeat:no-repeat; position:absolute; z-index:20000; top:40px; left:40px; background-image:url(' + background_image_url + ')">' + innerHTML + '</div>';
+	newDiv.innerHTML = '<div id="ClipperzBackgroundDIV">' + innerHTML + '</div>';
+	
+	document.body.appendChild(newDiv);
+	
+	if ((someParameters != null) && (anException == null)) {
+		bookmarklet_textarea = document.getElementById('bookmarklet_textarea');
+		bookmarklet_textarea.focus();
+		bookmarklet_textarea.select();
+	}
+};
+
+//-----------------------------------------------------------------------------
+
+getLoginFormConfiguration = function() {
+	var	parameters;
+
+	try {
+		parameters = {};
+		parameters.page = pageParameters();
+		parameters.form = formParameters(findLoginForm(document, 0));
+		parameters.version = '0.2.3';
+		logFormParameters(parameters, _cble);
+	} catch (e) {
+	//	parameters = 'No login form has been found'
+		logFormParameters(parameters, e);
+	}
+};
+
+//-----------------------------------------------------------------------------
+
+getLoginFormConfiguration();
+
+
+
diff --git a/frontend/beta/js/BookmarkletHash.js b/frontend/beta/js/BookmarkletHash.js
new file mode 100644
index 0000000..19e49b7
--- a/dev/null
+++ b/frontend/beta/js/BookmarkletHash.js
@@ -0,0 +1,47 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+//	18f820faffcdb5e847d4c5d5c4a1de6743baa1a0
+//	9b30434c73fb009b15fecaa904b44f9ced807577
+//	9b30434c73fb009b15fecaa904b44f9ced807577
+var	xh;
+var	documentText;
+
+try {
+	xh=new XMLHttpRequest();
+} catch(e) {
+	xh=new ActiveXObject("Msxml2.XMLHTTP");
+}
+
+xh.open("GET", window.location, false);
+xh.send(null);
+	
+documentText = "#####" + xh.responseText + "####";
+//documentText = document.body.innerHTML;
+
+console.log(documentText);
\ No newline at end of file
diff --git a/frontend/beta/js/Bookmarklet_IE.js b/frontend/beta/js/Bookmarklet_IE.js
new file mode 100644
index 0000000..f372d14
--- a/dev/null
+++ b/frontend/beta/js/Bookmarklet_IE.js
@@ -0,0 +1,23 @@
+//
+//	IE limit: 508 characters!!!!!
+//
+
+loadClipperzBookmarklet = function() {
+	var	headNode;
+	var clipperzScriptNode;
+	
+	clipperzScriptNode = document.getElementById('clipperzScript');
+	headNode = document.getElementsByTagName('head').item(0);
+
+	if (clipperzScriptNode) {
+		headNode.removeChild(clipperzScriptNode);
+	}
+
+	clipperzScriptNode = document.createElement('script');
+	clipperzScriptNode.setAttribute('src', 'http%3a%2f%2fclipperz.com%2ffiles%2fclipperz.com%2fbookmarklet%2fBookmarklet.js');
+	clipperzScriptNode.setAttribute('type', 'text/javascript');
+	clipperzScriptNode.setAttribute('defer', true);
+	headNode.appendChild(clipperzScriptNode);
+};
+
+loadClipperzBookmarklet();
diff --git a/frontend/beta/js/Clipperz/Base.js b/frontend/beta/js/Clipperz/Base.js
new file mode 100644
index 0000000..5bd972b
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Base.js
@@ -0,0 +1,308 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.Base) == 'undefined') { Clipperz.Base = {}; }
+
+Clipperz.Base.VERSION = "0.1";
+Clipperz.Base.NAME = "Clipperz.Base";
+
+MochiKit.Base.update(Clipperz.Base, {
+
+	//-------------------------------------------------------------------------
+
+	'__repr__': function () {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'trim': function (aValue) {
+		return aValue.replace(/^\s+|\s+$/g, "");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'stringToByteArray': function (aValue) {
+		var	result;
+		var i, c;
+
+		result = [];
+		
+		c = aValue.length;
+		for (i=0; i<c; i++) {
+			result[i] = aValue.charCodeAt(i);
+		}
+		
+		return result;
+	},
+	
+	//.........................................................................
+	
+	'byteArrayToString': function (anArrayOfBytes) {
+		var	result;
+		var i, c;
+
+		result = "";
+
+		c = anArrayOfBytes.length;
+		for (i=0; i<c; i++) {
+			result += String.fromCharCode(anArrayOfBytes[i]);
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'getValueForKeyInFormContent': function (aFormContent, aKey) {
+		return aFormContent[1][MochiKit.Base.find(aFormContent[0], aKey)];
+	},
+
+	//-------------------------------------------------------------------------
+
+	'indexOfObjectInArray': function(anObject, anArray) {
+		var	result;
+		var	i, c;
+		
+		result = -1;
+
+		c = anArray.length;
+		for (i=0; ((i<c) && (result < 0)); i++) {
+			if (anArray[i] === anObject) {
+				result = i;
+			}
+		}
+
+		return result;
+	},
+
+	'removeObjectAtIndexFromArray': function(anIndex, anArray) {
+		anArray.splice(anIndex, 1);
+	},
+	
+	'removeObjectFromArray': function(anObject, anArray) {
+		var	objectIndex;
+		
+		objectIndex = Clipperz.Base.indexOfObjectInArray(anObject, anArray);
+		if (objectIndex > -1) {
+			Clipperz.Base.removeObjectAtIndexFromArray(objectIndex, anArray);
+		} else {
+//			jslog.error("Trying to remove an object not present in the array");
+			//	TODO: raise an exception
+		}
+	},
+	
+	'removeFromArray': function(anArray, anObject) {
+		return Clipperz.Base.removeObjectFromArray(anObject, anArray);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'splitStringAtFixedTokenSize': function(aString, aTokenSize) {
+		var result;
+		var	stringToProcess;
+		
+		stringToProcess = aString;
+		result = [];
+		if (stringToProcess != null) {
+			while (stringToProcess.length > aTokenSize) {
+				result.push(stringToProcess.substring(0, aTokenSize));
+				stringToProcess = stringToProcess.substring(aTokenSize);
+			}
+			
+			result.push(stringToProcess);
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'objectType': function(anObject) {
+		var result;
+
+		if (anObject == null) {
+			result = null;
+		} else {
+			result = typeof(anObject);
+			
+			if (result == "object") {
+				if (anObject instanceof Array) {
+					result = 'array'
+				} else if (anObject.constructor == Boolean) {
+					result = 'boolean'
+				} else if (anObject instanceof Date) {
+					result = 'date'
+				} else if (anObject instanceof Error) {
+					result = 'error'
+				} else if (anObject instanceof Function) {
+					result = 'function'
+				} else if (anObject.constructor == Number) {
+					result = 'number'
+				} else if (anObject.constructor == String) {
+					result = 'string'
+				} else if (anObject instanceof Object) {
+					result = 'object'
+				} else {
+					throw Clipperz.Base.exception.UnknownType;
+				}
+			}
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'escapeHTML': function(aValue) {
+		var result;
+
+		result = aValue;
+		result = result.replace(/</g, "&lt;");
+		result = result.replace(/>/g, "&gt;");
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'deepClone': function(anObject) {
+		var result;
+		
+		result = Clipperz.Base.evalJSON(Clipperz.Base.serializeJSON(anObject));
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'evalJSON': function(aString) {
+/*
+		var result;
+		
+		//	check for XSS injection
+		if (/<script>/.test(aString)) {
+			throw "error";
+		}
+
+		if (/<iframe>/.test(aString)) {
+			throw "error";
+		}
+
+		result = MochiKit.Base.evalJSON(aString);
+		
+		return result;
+*/
+
+//		return MochiKit.Base.evalJSON(aString);
+		return JSON2.parse(aString);
+	},
+	
+	'serializeJSON': function(anObject) {
+//		return MochiKit.Base.serializeJSON(anObject);
+		return JSON2.stringify(anObject);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'sanitizeString': function(aValue) {
+		var result;
+		
+		if (Clipperz.Base.objectType(aValue) == 'string') {
+			result = aValue;
+			result = result.replace(/</img,"&lt;");
+			result = result.replace(/>/img,"&gt;");
+		} else {
+			result = aValue;
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'exception': {
+		'AbstractMethod': 		new MochiKit.Base.NamedError("Clipperz.Base.exception.AbstractMethod"),
+		'UnknownType':    		new MochiKit.Base.NamedError("Clipperz.Base.exception.UnknownType"),
+		'VulnerabilityIssue':	new MochiKit.Base.NamedError("Clipperz.Base.exception.VulnerabilityIssue") 
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
+
+
+MochiKit.Base.registerComparator('Object dummy comparator',
+	function(a, b) {
+		return ((a.constructor == Object) && (b.constructor == Object));
+	},
+	function(a, b) {
+		var result;
+		var aKeys;
+		var bKeys;
+		
+//MochiKit.Logging.logDebug(">>> comparator");
+//MochiKit.Logging.logDebug("- a: " + Clipperz.Base.serializeJSON(a));
+//MochiKit.Logging.logDebug("- b: " + Clipperz.Base.serializeJSON(a));
+		aKeys = MochiKit.Base.keys(a).sort();
+		bKeys = MochiKit.Base.keys(b).sort();
+		
+		result = MochiKit.Base.compare(aKeys, bKeys);
+//if (result != 0) {
+//	MochiKit.Logging.logDebug("- comparator 'keys':");
+//	MochiKit.Logging.logDebug("- comparator aKeys: " + Clipperz.Base.serializeJSON(aKeys));
+//	MochiKit.Logging.logDebug("- comparator bKeys: " + Clipperz.Base.serializeJSON(bKeys));
+//}
+		if (result == 0) {
+			var	i, c;
+			
+			c = aKeys.length;
+			for (i=0; (i<c) && (result == 0); i++) {
+				result = MochiKit.Base.compare(a[aKeys[i]], b[bKeys[i]]);
+//if (result != 0) {
+//	MochiKit.Logging.logDebug("- comparator 'values':");
+//	MochiKit.Logging.logDebug("- comparator a[aKeys[i]]: " + Clipperz.Base.serializeJSON(a[aKeys[i]]));
+//	MochiKit.Logging.logDebug("- comparator b[bKeys[i]]: " + Clipperz.Base.serializeJSON(b[bKeys[i]]));
+//}
+			}
+		}		
+		
+//MochiKit.Logging.logDebug("<<< comparator - result: " + result);
+		return result;
+	},
+	true
+);
diff --git a/frontend/beta/js/Clipperz/ByteArray.js b/frontend/beta/js/Clipperz/ByteArray.js
new file mode 100644
index 0000000..2275087
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/ByteArray.js
@@ -0,0 +1,1426 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+
+//=============================================================================
+
+Clipperz.ByteArray_abstract = function(args) {
+	return this;
+}
+
+Clipperz.ByteArray_abstract.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+
+	'toString': function() {
+		return "Clipperz.ByteArray_abstract";
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'equals': function(aValue) {
+		return (this.compare(aValue) == 0);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'compare': function(aValue) {
+		var result;
+		var i;
+		
+		result = MochiKit.Base.compare(this.length(), aValue.length());
+		i = this.length();
+		
+		while ((result == 0) && (i>0)) {
+			i--;
+			result = MochiKit.Base.compare(this.byteAtIndex(i), aValue.byteAtIndex(i));
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'clone': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'newInstance': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'reset': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'length': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'checkValue': function(aValue) {
+		if ((aValue & 0xff) != aValue) {
+			MochiKit.Logging.logError("Clipperz.ByteArray.appendByte: the provided value (0x" + aValue.toString(16) + ") is not a byte value.");
+			throw Clipperz.ByteArray.exception.InvalidValue;
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'xorMergeWithBlock': function(aBlock, anAllignment, paddingMode) {
+		var result;
+		var a, b;
+		var aLength;
+		var bLength;			
+		var i, c;
+		
+		if (this.length() > aBlock.length()) {
+			a = this;
+			b = aBlock;
+		} else {
+			a = aBlock;
+			b = this;
+		}
+
+		aLength = a.length();
+		bLength = b.length();
+
+		if (aLength != bLength) {
+			if (paddingMode == 'truncate') {
+				if (anAllignment == 'left') {
+					a = a.split(0, bLength);
+				} else {
+					a = a.split(aLength - bLength);
+				}
+			} else {
+				var ii, cc;
+				var padding;
+				
+//				padding = new Clipperz.ByteArray();
+				padding = this.newInstance();
+				cc = aLength - bLength;
+				for (ii=0; ii<cc; ii++) {
+					padding.appendByte(0);
+				}
+				
+				if (anAllignment == 'left') {
+					b = b.appendBlock(padding);
+				} else {
+					b = padding.appendBlock(b);
+				}
+			}
+		}
+
+
+//		result = new Clipperz.ByteArray();
+		result = this.newInstance();
+		c = a.length();
+		for (i=0; i<c; i++) {
+			result.appendByte(a.byteAtIndex(i) ^ b.byteAtIndex(i));
+		}
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+/*
+	'shiftLeft': function(aNumberOfBitsToShift) {
+		var result;
+
+		result = this.clone();	//	???????????
+		
+		return result;
+	},
+*/	
+	//-------------------------------------------------------------------------
+
+	'appendBlock': function(aBlock) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'appendByte': function(aValue) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	'appendBytes': function(args) {
+		var	values;
+		var	i,c;
+
+		if (args.constructor == Array) {
+			values = args;
+		} else {
+			values = arguments;
+		}
+
+		c = values.length;
+		for (i=0; i<c; i++) {
+			this.appendByte(values[i]);
+		}
+		
+		return this;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'appendWord': function(aValue, isLittleEndian) {
+		var result;
+		var processAsLittleEndian;
+		
+		processAsLittleEndian = isLittleEndian === true ? true : false;
+		
+		if (processAsLittleEndian) {
+			result = this.appendBytes(	(aValue) & 0xff, (aValue >> 8) & 0xff, (aValue >> 16) & 0xff, (aValue >> 24) & 0xff	);	//	little endian
+		} else {
+			result = this.appendBytes(	(aValue >> 24) & 0xff, (aValue >> 16) & 0xff, (aValue >> 8) & 0xff, (aValue) & 0xff	);	//	big endian - DEFAULT
+		}
+		
+		return result;
+	},
+
+	'appendWords': function(args) {
+		var	values;
+		var	i,c;
+
+		if (args.constructor == Array) {
+			values = args;
+		} else {
+			values = arguments;
+		}
+
+		c = values.length;
+		for (i=0; i<c; i++) {
+			this.appendWord(values[i], false);
+		}
+		
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'appendBigEndianWords': function(args) {
+		var	values;
+		var	i,c;
+
+		if (args.constructor == Array) {
+			values = args;
+		} else {
+			values = arguments;
+		}
+
+		c = values.length;
+		for (i=0; i<c; i++) {
+			this.appendWord(values[i], true);
+		}
+		
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'byteAtIndex': function(anIndex) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+	
+	'setByteAtIndex': function(aValue, anIndex) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'bitAtIndex': function(aBitPosition) {
+		var result;
+		var	bytePosition;
+		var bitPositionInSelectedByte;
+		var selectedByte;
+		var selectedByteMask;
+		
+		bytePosition = this.length() - Math.ceil((aBitPosition + 1)/ 8);
+		bitPositionInSelectedByte = aBitPosition % 8;
+		selectedByte = this.byteAtIndex(bytePosition);
+
+		if (bitPositionInSelectedByte > 0) {
+			selectedByteMask = (1 << bitPositionInSelectedByte);
+		} else {
+			selectedByteMask = 1;
+		}
+		result = selectedByte & selectedByteMask ? 1 : 0;
+//console.log("aBitPosition: " + aBitPosition + ", length: " + this.length() + ", bytePosition: " + bytePosition + ", bitPositionInSelectedByte: " + bitPositionInSelectedByte + ", selectedByteMask: " + selectedByteMask);
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'bitBlockAtIndexWithSize': function(aBitPosition, aSize) {
+		var result;
+		var bitValue;
+		var i,c;
+		
+		result = 0;
+		c = aSize;
+		for (i=0; i<c; i++) {
+			bitValue = this.bitAtIndex(aBitPosition + i);
+			result = result | bitValue << i;
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'asString': function() {
+		var	result;
+		var	length;
+		var	i;
+
+//var startTime = new Date();
+
+//#		result = "";
+		result = [];
+		
+		i = 0;
+		length = this.length();
+		
+		while (i < length) {
+			var	currentCharacter;
+			var	currentByte;
+			var	unicode;
+			
+			currentByte = this.byteAtIndex(i);
+			
+			if ((currentByte & 0x80) == 0x00 ) {		//	0xxxxxxx
+				unicode = currentByte;
+				currentCharacter = String.fromCharCode(unicode);
+			} else if ((currentByte & 0xe0) == 0xc0 ) {	//	110xxxxx 10xxxxxx
+				unicode = (currentByte & 0x1f) << 6;
+				i++; currentByte = this.byteAtIndex(i);
+				unicode = unicode | (currentByte & 0x3f);
+
+				currentCharacter = String.fromCharCode(unicode);
+			} else if ((currentByte & 0xf0) == 0xe0 ) {	//	1110xxxx 10xxxxxx 10xxxxxx
+				unicode = (currentByte & 0x0f) << (6+6);
+				i++; currentByte = this.byteAtIndex(i);
+				unicode = unicode | ((currentByte & 0x3f) << 6);
+				i++; currentByte = this.byteAtIndex(i);
+				unicode = unicode | (currentByte & 0x3f);
+				
+				currentCharacter = String.fromCharCode(unicode);
+			} else {									//	11110xxx 10xxxxxx 10xxxxxx 10xxxxxx
+				unicode = (currentByte & 0x07) << (6+6+6);
+				i++; currentByte = this.byteAtIndex(i);
+				unicode = unicode | ((currentByte & 0x3f) << (6+6));
+				i++; currentByte = this.byteAtIndex(i);
+				unicode = unicode | ((currentByte & 0x3f) << 6);
+				i++; currentByte = this.byteAtIndex(i);
+				unicode = unicode | (currentByte & 0x3f);
+				
+				currentCharacter = String.fromCharCode(unicode);
+			}
+			
+//			result += currentCharacter;
+			result.push(currentCharacter);
+			i++;
+		}
+
+//MochiKit.Logging.logDebug("[" + (new Date() - startTime) + "] ByteArray.asString");
+
+//		return result;
+		return result.join("");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toHexString': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'base64map': "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/",
+	'base64mapIndex': "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/".split(''),
+//	'base64mapInvertedIndex': {
+//		'A':  0, 'B':  1, 'C':  2, 'D':  3, 'E':  4, 'F':  5, 'G':  6, 'H':  7, 'I':  8, 'J':  9,
+//		'K': 10, 'L': 11, 'M': 12, 'N': 13, 'O': 14, 'P': 15, 'Q': 16, 'R': 17, 'S': 18, 'T': 19,
+//		'U': 20, 'V': 21, 'W': 22, 'X': 23, 'Y': 24, 'Z': 25, 'a': 26, 'b': 27, 'c': 28, 'd': 29,
+//		'e': 30, 'f': 31, 'g': 32, 'h': 33, 'i': 34, 'j': 35, 'k': 36, 'l': 37, 'm': 38, 'n': 39,
+//		'o': 40, 'p': 41, 'q': 42, 'r': 43, 's': 44, 't': 45, 'u': 46, 'v': 47, 'w': 48, 'x': 49,
+//		'y': 50, 'z': 51, '0': 52, '1': 53, '2': 54, '3': 55, '4': 56, '5': 57, '6': 58, '7': 59,
+//		'8': 60, '9': 61, '+': 62, '/': 63,
+//		"=": -1},
+
+	//-------------------------------------------------------------------------
+	
+	'appendBase64String': function(aValue) {
+		var i;
+		var length;
+
+		length = aValue.length;
+		
+		if ((length % 4) != 0) {
+			MochiKit.Logging.logError("the value passed to the 'ByteArray.setBase64Value' is not correct");
+			throw Clipperz.ByteArray.exception.InvalidValue;
+		}
+
+		i = 0;
+		while (i<length) {
+			var value1, value2, value3, value4;
+			var byte1, byte2, byte3;
+			
+			value1 = this.base64map.indexOf(aValue.charAt(i));
+			value2 = this.base64map.indexOf(aValue.charAt(i+1));
+			value3 = this.base64map.indexOf(aValue.charAt(i+2));
+			value4 = this.base64map.indexOf(aValue.charAt(i+3));
+
+//			value1 = this.base64mapInvertedIndex[aValue.charAt(i)];
+//			value2 = this.base64mapInvertedIndex[aValue.charAt(i+1)];
+//			value3 = this.base64mapInvertedIndex[aValue.charAt(i+2)];
+//			value4 = this.base64mapInvertedIndex[aValue.charAt(i+3)];
+
+			byte1 = (value1 << 2) | ((value2 & 0x30) >> 4);
+			if (value3 != -1) {
+				byte2 = ((value2 & 0x0f) << 4) | ((value3 & 0x3c) >> 2);
+
+				if (value4 != -1) {
+					byte3 = ((value3 & 0x03) << 6) | (value4);
+				} else {
+					byte3 = null;
+				}
+			} else {
+				byte2 = null;
+				byte3 = null;
+			}
+
+			this.appendByte(byte1);
+			this.appendByte(byte2);
+			this.appendByte(byte3);
+
+			i += 4;
+		}
+		
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'toBase64String': function() {
+		var result;
+		var length;
+		var i;
+		var byte1, byte2, byte3;
+		var char1, char2, char3, char4;
+		
+		i = 0;
+		length = this.length();
+		result = new Array(Math.ceil(length/3));
+		
+		while (i < length) {
+			byte1 = this.byteAtIndex(i);
+			if ((i+2) < length) {
+				byte2 = this.byteAtIndex(i+1);
+				byte3 = this.byteAtIndex(i+2);
+			} else if ((i+2) == length) {
+				byte2 = this.byteAtIndex(i+1);
+				byte3 = null;
+			} else {
+				byte2 = null;
+				byte3 = null;
+			}
+			
+			char1 = this.base64mapIndex[byte1 >> 2];
+			if (byte2 != null) {
+				char2 = this.base64mapIndex[((byte1 & 0x03) << 4) | ((byte2 & 0xf0) >> 4)];
+				if (byte3 != null) {
+					char3 = this.base64mapIndex[((byte2 & 0x0f) << 2) | ((byte3 & 0xc0) >> 6)];
+					char4 = this.base64mapIndex[(byte3 & 0x3f)];
+				} else {
+					char3 = this.base64mapIndex[(byte2 & 0x0f) << 2];
+					char4 = "=";
+				}
+			} else {
+				char2 = this.base64mapIndex[(byte1 & 0x03) << 4];
+				char3 = "=";
+				char4 = "=";
+			}
+
+			result.push(char1 + char2 + char3 + char4);
+			
+			i += 3;
+		}
+
+		return result.join("");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'base32map': "0123456789abcdefghjkmnpqrstvwxyz",
+	'base32mapIndex': "0123456789abcdefghjkmnpqrstvwxyz".split(''),
+
+	//-------------------------------------------------------------------------
+	
+	'appendBase32String': function(aValue) {
+		var value;
+		var i;
+		var length;
+		var value1, value2, value3, value4, value5, value6, value7, value8;
+		var byte1, byte2, byte3, byte4, byte5;
+
+		value = aValue.toLowerCase();
+		value = value.replace(/[\s\-]/g, '');
+		value = value.replace(/[0o]/g, '0');
+		value = value.replace(/[1il]/g, '1');
+
+		length = value.length;
+		
+		if ((length % 8) != 0) {
+			MochiKit.Logging.logError("the value passed to the 'ByteArray.setBase32Value' is not correct");
+			throw Clipperz.ByteArray.exception.InvalidValue;
+		}
+
+		i = 0;
+		while (i<length) {
+			value1 = this.base32map.indexOf(value.charAt(i));
+			value2 = this.base32map.indexOf(value.charAt(i+1));
+			value3 = this.base32map.indexOf(value.charAt(i+2));
+			value4 = this.base32map.indexOf(value.charAt(i+3));
+			value5 = this.base32map.indexOf(value.charAt(i+4));
+			value6 = this.base32map.indexOf(value.charAt(i+5));
+			value7 = this.base32map.indexOf(value.charAt(i+6));
+			value8 = this.base32map.indexOf(value.charAt(i+7));
+
+			byte1 = byte2 = byte3 = byte4 = byte5 = null;
+			
+			byte1 = (value1 << 3) | ((value2 & 0x1c) >> 2);
+			if (value3 != -1) {
+				byte2 = ((value2 & 0x03) << 6) | (value3 << 1) | ((value4 & 0x10) >> 4);
+				if (value5 != -1) {
+					byte3 = ((value4 & 0x0f) << 4) | ((value5 & 0x1e) >> 1);
+					if (value6 != -1) {
+						byte4 = ((value5 & 0x01) << 7) | (value6 << 2) | ((value7 & 0x18) >> 3);
+						if (value8 != -1) {
+							byte5 = ((value7 & 0x07) << 5) | (value8);
+						}
+					}
+				}
+			}
+
+			this.appendByte(byte1);
+			this.appendByte(byte2);
+			this.appendByte(byte3);
+			this.appendByte(byte4);
+			this.appendByte(byte5);
+
+			i += 8;
+		}
+
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toBase32String': function() {
+		var result;
+		var length;
+		var i;
+		var byte1, byte2, byte3, byte4, byte5;
+		var char1, char2, char3, char4, char5, char6, char7, char8;
+		
+		i = 0;
+		length = this.length();
+		result = new Array(Math.ceil(length/5));
+		
+		while (i < length) {
+			byte1 = this.byteAtIndex(i);
+			
+			if ((i+4) < length) {
+				byte2 = this.byteAtIndex(i+1);
+				byte3 = this.byteAtIndex(i+2);
+				byte4 = this.byteAtIndex(i+3);
+				byte5 = this.byteAtIndex(i+4);
+			} else if ((i+4) == length) {
+				byte2 = this.byteAtIndex(i+1);
+				byte3 = this.byteAtIndex(i+2);
+				byte4 = this.byteAtIndex(i+3);
+				byte5 = null;
+			} else if ((i+3) == length) {
+				byte2 = this.byteAtIndex(i+1);
+				byte3 = this.byteAtIndex(i+2);
+				byte4 = null;
+				byte5 = null;
+			} else if ((i+2) == length) {
+				byte2 = this.byteAtIndex(i+1);
+				byte3 = null;
+				byte4 = null;
+				byte5 = null;
+			} else {
+				byte2 = null;
+				byte3 = null;
+				byte4 = null;
+				byte5 = null;
+			}
+
+			
+			char1 = this.base32mapIndex[byte1 >> 3];
+			char2 = char3 = char4 = char5 = char6 = char7 = char8 = "=";
+			
+			if (byte2 != null) {
+				char2 = this.base32mapIndex[((byte1 & 0x07) << 2) | ((byte2 & 0xc0) >> 6)];
+				char3 = this.base32mapIndex[((byte2 & 0x3e) >> 1)];
+				if (byte3 != null) {
+					char4 = this.base32mapIndex[((byte2 & 0x01) << 4) | ((byte3 & 0xf0) >> 4)];
+					if (byte4 != null) {
+						char5 = this.base32mapIndex[((byte3 & 0x0f) << 1) | ((byte4 & 0x80) >> 7)];
+						char6 = this.base32mapIndex[(byte4 & 0x7c) >> 2];
+						if (byte5 != null) {
+							char7 = this.base32mapIndex[((byte4 & 0x03) << 3) | ((byte5 & 0xe0) >> 5)];
+							char8 = this.base32mapIndex[(byte5 & 0x1f)];
+						} else {
+							char7 = this.base32mapIndex[(byte4 & 0x03) << 3];
+						}
+					} else {
+						char5 = this.base32mapIndex[(byte3 & 0x0f) << 1];
+					}
+
+				} else {
+					char4 = this.base32mapIndex[(byte2 & 0x01) << 4];
+				}
+			} else {
+				char2 = this.base32mapIndex[(byte1 & 0x07) << 2];
+			}
+
+			result.push(char1 + char2 + char3 + char4 + char5 + char6 + char7 + char8);
+			i += 5;
+		}
+
+		return result.join("");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'split': function(aStartingIndex, anEndingIndex) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'increment': function() {
+		var i;
+		var done;
+		
+		done = false;
+		i = this.length() - 1;
+		
+		while ((i>=0) && (done == false)) {
+			var currentByteValue;
+			
+			currentByteValue = this.byteAtIndex(i);
+			
+			if (currentByteValue == 0xff) {
+				this.setByteAtIndex(0, i);
+				if (i>= 0) {
+					i --;
+				} else {
+					done = true;
+				}
+			} else {
+				this.setByteAtIndex(currentByteValue + 1, i);
+				done = true;
+			}
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'arrayValues': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
+//=============================================================================
+//
+//	Clipperz.ByteArray_hex
+//
+//=============================================================================
+Clipperz.ByteArray_hex = function (args) {
+	this._value = "";
+
+	if (typeof(args) != 'undefined') {
+		if (args.constructor == Array) {
+			this.appendBytes(args);
+		} else if (args.constructor == String) {
+			if (args.indexOf("0x") == 0) {
+				var	value;
+			
+				value = args.substring(2).toLowerCase();
+				if (/[0123456789abcdef]*/.test(value)) {
+					if ((value.length % 2) == 0) {
+						this._value = value;
+					} else {
+						this._value = "0" + value;
+					}
+				} else {
+MochiKit.Logging.logError("Clipperz.ByteArray should be inizialized with an hex string.");
+					throw Clipperz.ByteArray.exception.InvalidValue;
+				}
+			} else {
+				var	value;
+				var	i,c;
+
+				c = args.length;
+				value = new Array(c);
+				for (i=0; i<c; i++) {
+					value.push(Clipperz.ByteArray.unicodeToUtf8HexString(args.charCodeAt(i)));
+				}
+
+				this._value = value.join("");
+			}
+		} else {
+			this.appendBytes(MochiKit.Base.extend(null, arguments));
+		}
+	}
+	return this;
+}
+
+Clipperz.ByteArray_hex.prototype = MochiKit.Base.update(new Clipperz.ByteArray_abstract(), {
+
+	//-------------------------------------------------------------------------
+
+	'toString': function() {
+		return "Clipperz.ByteArray_hex";
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'clone': function() {
+		var result;
+		
+		result = this.newInstance();
+		result._value = this._value;
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'newInstance': function() {
+		return new Clipperz.ByteArray_hex();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'reset': function() {
+		this._value = "";
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'length': function() {
+		return (this._value.length / 2);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'appendBlock': function(aBlock) {
+		this._value = this._value += aBlock.toHexString().substring(2);
+
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'appendByte': function(aValue) {
+		if (aValue != null) {
+			this.checkValue(aValue);
+			this._value += Clipperz.ByteArray.byteToHex(aValue);
+		}
+		
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'byteAtIndex': function(anIndex) {
+		return parseInt(this._value.substr(anIndex*2, 2), 16);
+	},
+	
+	'setByteAtIndex': function(aValue, anIndex) {
+		var	missingBytes;
+		
+		this.checkValue(aValue);
+
+		missingBytes = anIndex - this.length();
+		
+		if (missingBytes < 0) {
+			var	currentValue;
+			var	firstCutIndex;
+			var secondCutIndex;
+
+			firstCutIndex = anIndex * 2;
+			secondCutIndex = firstCutIndex + 2;
+			currentValue = this._value;
+			this._value =	currentValue.substring(0, firstCutIndex) +
+							Clipperz.ByteArray.byteToHex(aValue) +
+							currentValue.substring(secondCutIndex);
+		} else if (missingBytes == 0) {
+			this.appendByte(aValue);
+		} else {
+			var i,c;
+			
+			c = missingBytes;
+			for (i=0; i<c; i++) {
+				this.appendByte(0);
+			}
+			
+			this.appendByte(aValue);
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toHexString': function() {
+		return "0x" + this._value;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'split': function(aStartingIndex, anEndingIndex) {
+		var result;
+		var	startingIndex;
+		var endingIndex;
+
+		result = this.newInstance();
+
+		startingIndex = aStartingIndex * 2;
+		if (typeof(anEndingIndex) != 'undefined') {
+			endingIndex = anEndingIndex * 2;
+			result._value = this._value.substring(startingIndex, endingIndex);
+		} else {
+			result._value = this._value.substring(startingIndex);
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'arrayValues': function() {
+		var result;
+		var i,c;
+		
+		c = this.length();
+
+		result = new Array(c);
+		for (i=0; i<c; i++) {
+			result[i] = this.byteAtIndex(i);
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//=============================================================================
+//
+//	Clipperz.ByteArray_array
+//
+//=============================================================================
+
+Clipperz.ByteArray_array = function (args) {
+	if (typeof(args) != 'undefined') {
+		if (args.constructor == Array) {
+			this._value = args.slice(0);
+		} else if (args.constructor == String) {
+			var result;
+			var	value;
+			var i, c;
+			
+			if (args.indexOf("0x") == 0) {
+			
+				value = args.substring(2).toLowerCase();
+				if (/[0123456789abcdef]*/.test(value)) {
+					if ((value.length % 2) != 0) {
+						value = "0" + value;
+					}
+				} else {
+MochiKit.Logging.logError("Clipperz.ByteArray should be inizialized with an hex string.");
+					throw Clipperz.ByteArray.exception.InvalidValue;
+				}
+
+				c = value.length / 2
+				result = new Array(c);
+				for (i=0; i<c; i++) {
+					result[i] = parseInt(value.substr(i*2, 2), 16);
+				}
+
+			} else {
+				var unicode;
+				result = [];
+				c = args.length;
+				for (i=0; i<c; i++) {
+//					Clipperz.ByteArray.pushUtf8BytesOfUnicodeChar(result, args.charCodeAt(i));
+
+					unicode = args.charCodeAt(i);
+					if (unicode <= 0x7f) {										//	0x00000000 - 0x0000007f -> 0xxxxxxx
+						result.push(unicode);
+				//	} else if ((unicode >= 0x80) && (unicode <= 0x7ff)) {		//	0x00000080 - 0x000007ff -> 110xxxxx 10xxxxxx
+					} else if (unicode <= 0x7ff) {		//	0x00000080 - 0x000007ff -> 110xxxxx 10xxxxxx
+						result.push((unicode >> 6) | 0xc0);
+						result.push((unicode & 0x3F) | 0x80);
+				//	} else if ((unicode >= 0x0800) && (unicode <= 0xffff)) {	//	0x00000800 - 0x0000ffff -> 1110xxxx 10xxxxxx 10xxxxxx
+					} else if (unicode <= 0xffff) {	//	0x00000800 - 0x0000ffff -> 1110xxxx 10xxxxxx 10xxxxxx
+						result.push((unicode >> 12) | 0xe0);
+						result.push(((unicode >> 6) & 0x3f) | 0x80);
+						result.push((unicode & 0x3f) | 0x80);
+					} else {													//	0x00010000 - 0x001fffff -> 11110xxx 10xxxxxx 10xxxxxx 10xxxxxx
+						result.push((unicode >> 18) | 0xf0);
+						result.push(((unicode >> 12) & 0x3f) | 0x80);
+						result.push(((unicode >> 6) & 0x3f) | 0x80);
+						result.push((unicode & 0x3f) | 0x80);
+					}
+				}
+			}
+			
+		
+			this._value = result;
+		} else {
+			this._value = [];
+			this.appendBytes(MochiKit.Base.extend(null, arguments));
+		}
+	} else {
+		this._value = [];
+	}
+	
+	return this;
+}
+
+Clipperz.ByteArray_array.prototype = MochiKit.Base.update(new Clipperz.ByteArray_abstract(), {
+
+	//-------------------------------------------------------------------------
+
+	'toString': function() {
+		return "Clipperz.ByteArray_array";
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'clone': function() {
+		var result;
+		
+		result = this.newInstance();
+		result.appendBytes(this._value);
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'newInstance': function() {
+		return new Clipperz.ByteArray_array();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'reset': function() {
+		this._value = [];
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'length': function() {
+		return (this._value.length);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'appendBlock': function(aBlock) {
+		MochiKit.Base.extend(this._value, aBlock._value);
+		
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'appendByte': function(aValue) {
+		if (aValue != null) {
+			this.checkValue(aValue);
+			this._value.push(aValue);
+		}
+		
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'byteAtIndex': function(anIndex) {
+		return this._value[anIndex];
+	},
+	
+	'setByteAtIndex': function(aValue, anIndex) {
+		var	missingBytes;
+		
+		this.checkValue(aValue);
+
+		missingBytes = anIndex - this.length();
+		
+		if (missingBytes < 0) {
+			this._value[anIndex] = aValue;
+		} else if (missingBytes == 0) {
+			this._value.push(aValue);
+		} else {
+			var i,c;
+			
+			c = missingBytes;
+			for (i=0; i<c; i++) {
+				this._value.push(0);
+			}
+			
+			this._value.push(aValue);
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toHexString': function() {
+		var result;
+		var i, c;
+		
+		result = "0x";
+		c = this.length();
+		for (i=0; i<c; i++) {
+			result += Clipperz.ByteArray.byteToHex(this._value[i]);
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'split': function(aStartingIndex, anEndingIndex) {
+		var result;
+		
+		result = this.newInstance();
+		result._value = this._value.slice(aStartingIndex, anEndingIndex ? anEndingIndex : this.length());
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'arrayValues': function() {
+		return this._value.slice(0);
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+
+
+
+
+//=============================================================================
+//
+//	Clipperz.ByteArray_string
+//
+//=============================================================================
+
+Clipperz.ByteArray_string = function (args) {
+	this._value = "";
+
+	if (typeof(args) != 'undefined') {
+		if (args.constructor == Array) {
+			this.appendBytes(args);
+		} else if (args.constructor == String) {
+			var result;
+			var	value;
+			var i, c;
+			
+			if (args.indexOf("0x") == 0) {
+			
+				value = args.substring(2).toLowerCase();
+				if (/[0123456789abcdef]*/.test(value)) {
+					if ((value.length % 2) != 0) {
+						value = "0" + value;
+					}
+				} else {
+MochiKit.Logging.logError("Clipperz.ByteArray should be inizialized with an hex string.");
+					throw Clipperz.ByteArray.exception.InvalidValue;
+				}
+			} else {
+				value = "";
+				c = args.length;
+				for (i=0; i<c; i++) {
+					value += Clipperz.ByteArray.unicodeToUtf8HexString(args.charCodeAt(i));
+				}
+			}
+			
+			c = value.length / 2
+			for (i=0; i<c; i++) {
+				this.appendByte(parseInt(value.substr(i*2, 2), 16));
+			}
+		} else {
+			this.appendBytes(MochiKit.Base.extend(null, arguments));
+		}
+	}
+	
+	return this;
+}
+
+Clipperz.ByteArray_string.prototype = MochiKit.Base.update(new Clipperz.ByteArray_abstract(), {
+
+	//-------------------------------------------------------------------------
+
+	'toString': function() {
+		return "Clipperz.ByteArray_string";
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'clone': function() {
+		var result;
+		
+		result = this.newInstance();
+		result._value = this._value;
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'newInstance': function() {
+		return new Clipperz.ByteArray_string();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'reset': function() {
+		this._value = "";
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'length': function() {
+		return (this._value.length);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'appendBlock': function(aBlock) {
+		this._value += aBlock._value;
+		
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'appendByte': function(aValue) {
+		if (aValue != null) {
+			this.checkValue(aValue);
+			this._value += String.fromCharCode(aValue);
+		}
+		
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'byteAtIndex': function(anIndex) {
+		return this._value.charCodeAt(anIndex);
+	},
+	
+	'setByteAtIndex': function(aValue, anIndex) {
+		var	missingBytes;
+		
+		this.checkValue(aValue);
+
+		missingBytes = anIndex - this.length();
+		
+		if (missingBytes < 0) {
+			this._value = this._value.substring(0, anIndex) + String.fromCharCode(aValue) + this._value.substring(anIndex + 1);
+		} else if (missingBytes == 0) {
+			this.appendByte(aValue);
+		} else {
+			var i,c;
+			
+			c = missingBytes;
+			for (i=0; i<c; i++) {
+				this.appendByte(0);
+			}
+			
+			this.appendByte(aValue);
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toHexString': function() {
+		var result;
+		var i, c;
+		
+		result = "0x";
+		c = this.length();
+		for (i=0; i<c; i++) {
+			result += Clipperz.ByteArray.byteToHex(this.byteAtIndex(i));
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'split': function(aStartingIndex, anEndingIndex) {
+		var result;
+		result = this.newInstance();
+		result._value = this._value.substring(aStartingIndex, anEndingIndex ? anEndingIndex : this.length());
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'arrayValues': function() {
+		var result;
+		var i,c;
+		
+		c = this.length();
+
+		result = new Array(c);
+		for (i=0; i<c; i++) {
+			result[i] = this.byteAtIndex(i);
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+
+//=============================================================================
+//
+//	Clipperz.ByteArray
+//
+//=============================================================================
+
+Clipperz.ByteArray = Clipperz.ByteArray_array;
+//Clipperz.ByteArray = Clipperz.ByteArray_string;
+//Clipperz.ByteArray = Clipperz.ByteArray_hex;
+
+//#############################################################################
+
+Clipperz.ByteArray.byteToHex = function(aByte) {
+	return ((aByte < 16) ? "0" : "") + aByte.toString(16);
+}
+
+
+Clipperz.ByteArray.unicodeToUtf8HexString = function(aUnicode) {
+	var result;
+	var	self;
+	
+	self = Clipperz.ByteArray;
+	
+	if (aUnicode <= 0x7f) {										//	0x00000000 - 0x0000007f -> 0xxxxxxx
+		result = self.byteToHex(aUnicode);
+//	} else if ((aUnicode >= 0x80) && (aUnicode <= 0x7ff)) {		//	0x00000080 - 0x000007ff -> 110xxxxx 10xxxxxx
+	} else if (aUnicode <= 0x7ff) {		//	0x00000080 - 0x000007ff -> 110xxxxx 10xxxxxx
+		result = self.byteToHex((aUnicode >> 6) | 0xc0);
+		result += self.byteToHex((aUnicode & 0x3F) | 0x80);
+//	} else if ((aUnicode >= 0x0800) && (aUnicode <= 0xffff)) {	//	0x00000800 - 0x0000ffff -> 1110xxxx 10xxxxxx 10xxxxxx
+	} else if (aUnicode <= 0xffff) {	//	0x00000800 - 0x0000ffff -> 1110xxxx 10xxxxxx 10xxxxxx
+		result = self.byteToHex((aUnicode >> 12) | 0xe0);
+		result += self.byteToHex(((aUnicode >> 6) & 0x3f) | 0x80);
+		result += self.byteToHex((aUnicode & 0x3f) | 0x80);
+	} else {													//	0x00010000 - 0x001fffff -> 11110xxx 10xxxxxx 10xxxxxx 10xxxxxx
+		result = self.byteToHex((aUnicode >> 18) | 0xf0);
+		result += self.byteToHex(((aUnicode >> 12) & 0x3f) | 0x80);
+		result += self.byteToHex(((aUnicode >> 6) & 0x3f) | 0x80);
+		result += self.byteToHex((aUnicode & 0x3f) | 0x80);
+	}
+
+	return result;
+}
+
+Clipperz.ByteArray.pushUtf8BytesOfUnicodeChar = function(anArray, aUnicode) {
+	var	self;
+	
+	self = Clipperz.ByteArray;
+	
+	if (aUnicode <= 0x7f) {										//	0x00000000 - 0x0000007f -> 0xxxxxxx
+		anArray.push(aUnicode);
+//	} else if ((aUnicode >= 0x80) && (aUnicode <= 0x7ff)) {		//	0x00000080 - 0x000007ff -> 110xxxxx 10xxxxxx
+	} else if (aUnicode <= 0x7ff) {		//	0x00000080 - 0x000007ff -> 110xxxxx 10xxxxxx
+		anArray.push((aUnicode >> 6) | 0xc0);
+		anArray.push((aUnicode & 0x3F) | 0x80);
+//	} else if ((aUnicode >= 0x0800) && (aUnicode <= 0xffff)) {	//	0x00000800 - 0x0000ffff -> 1110xxxx 10xxxxxx 10xxxxxx
+	} else if (aUnicode <= 0xffff) {	//	0x00000800 - 0x0000ffff -> 1110xxxx 10xxxxxx 10xxxxxx
+		anArray.push((aUnicode >> 12) | 0xe0);
+		anArray.push(((aUnicode >> 6) & 0x3f) | 0x80);
+		anArray.push((aUnicode & 0x3f) | 0x80);
+	} else {													//	0x00010000 - 0x001fffff -> 11110xxx 10xxxxxx 10xxxxxx 10xxxxxx
+		anArray.push((aUnicode >> 18) | 0xf0);
+		anArray.push(((aUnicode >> 12) & 0x3f) | 0x80);
+		anArray.push(((aUnicode >> 6) & 0x3f) | 0x80);
+		anArray.push((aUnicode & 0x3f) | 0x80);
+	}
+}
+
+Clipperz.ByteArray.exception = {
+	InvalidValue: new MochiKit.Base.NamedError("Clipperz.ByteArray.exception.InvalidValue")
+};
+
+//#############################################################################
+
+Clipperz.ByteArrayIterator = function(args) {
+	args = args || {};
+
+	this._byteArray = args.byteArray;
+	this._blockSize = args.blockSize;
+	this._finalPadding = args.finalPadding || false;
+	
+	this._currentPosition = 0;
+	
+	return this;
+}
+
+Clipperz.ByteArrayIterator.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+
+	'toString': function() {
+		return "Clipperz.ByteArrayIterator";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'blockSize': function() {
+		var result;
+		
+		result = this._blockSize;
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'currentPosition': function() {
+		var result;
+		
+		result = this._currentPosition;
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'byteArray': function() {
+		var result;
+		
+		result = this._byteArray;
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'finalPadding': function() {
+		var result;
+		
+		result = this._finalPadding;
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+		
+	'nextBlock': function() {
+		var result;
+		var currentPosition;
+		var	byteArrayLength;
+		
+		currentPosition = this._currentPosition;
+		byteArrayLength = this.byteArray().length();
+		
+		if (currentPosition < byteArrayLength) {
+			var i,c;
+
+			c = this.blockSize();
+			result = new Array(c);
+			for (i=0; i<c; i++) {
+				if (currentPosition < byteArrayLength) {
+					result[i] = this.byteArray().byteAtIndex(currentPosition);
+					currentPosition++;
+				} else if (this.finalPadding() == true) {
+					result[i] = 0;
+				}
+			}
+			
+			this._currentPosition = currentPosition;
+		} else {
+			result = null;
+		}
+		
+		return result;
+	},	
+
+	//-------------------------------------------------------------------------
+
+	'nextBlockArray': function() {
+		var result;
+		var nextBlock;
+
+		nextBlock = this.nextBlock();
+		
+		if (nextBlock != null) {
+			result = new Clipperz.ByteArray(nextBlock);
+		} else {
+			result = null;
+		}
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
diff --git a/frontend/beta/js/Clipperz/CSVProcessor.js b/frontend/beta/js/Clipperz/CSVProcessor.js
new file mode 100644
index 0000000..164b02e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/CSVProcessor.js
@@ -0,0 +1,348 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+
+
+Clipperz.CSVProcessor = function(args) {
+	args = args || {};
+
+//	this._status		= undefined;
+//	this._error_input	= undefined;
+//	this._string		= undefined;
+//	this._fields		= undefined;
+
+	this._quoteChar		= args['quoteChar'] 	||	"\042";
+	this._eol			= args['eol']			||	"";
+	this._escapeChar	= args['escapeChar']	||	"\042";
+	this._separatorChar	= args['separatorChar']	||	",";
+	this._binary		= args['binary']		||	false;
+	this._alwaysQuote	= args['alwaysQuote']	||	false;
+
+	return this;
+}
+
+//=============================================================================
+
+Clipperz.CSVProcessor.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+	
+	'quoteChar': function() {
+		return this._quoteChar;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'eol': function() {
+		return this._eol;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'escapeChar': function() {
+		return this._escapeChar;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'separatorChar': function() {
+		return this._separatorChar;
+	},
+	
+	'setSeparatorChar': function(aValue) {
+		this._separatorChar = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'binary': function() {
+		return this._binary;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'alwaysQuote': function() {
+		return this._alwaysQuote;
+	},
+	
+	//-------------------------------------------------------------------------
+/*
+	'parse': function(aValue) {
+		var result;
+		var lines;
+		var parameter;
+		
+//MochiKit.Logging.logDebug(">>> CSVProcessor.parse");
+		result = [];
+		
+		lines = aValue.replace(/\r?\n/g, "\n").replace(/^\n*                    /g, "").replace(/\n$/g, "");;
+		parameter = {
+			line: lines
+		}
+
+		do {
+			var fields;
+			
+			fields = this.parseLine(parameter);
+			
+			if (fields != null) {
+				result.push(fields);
+			}
+			
+			parameter.line = parameter.line.replace(/^\n*                        /g, "").replace(/\n$/g, "");
+
+//MochiKit.Logging.logDebug("line: '" + parameter.line + "'");
+		} while (parameter.line != "");
+//MochiKit.Logging.logDebug("--- CSVProcessor.parse - result: " + Clipperz.Base.serializeJSON(result));
+//MochiKit.Logging.logDebug("<<< CSVProcessor.parse");
+
+		return result;
+	},
+*/
+	//-------------------------------------------------------------------------
+
+	'deferredParse_core': function(aContext) {
+		var deferredResult;
+		
+		if (aContext.line == "") {
+			deferredResult = MochiKit.Async.succeed(aContext.result);
+		} else {
+			var fields;
+			
+			fields = this.parseLine(aContext);
+			if (fields != null) {
+				aContext.result.push(fields);
+			}
+
+			aContext.line = aContext.line.replace(/^\n*/g, "").replace(/\n$/g, "");
+			
+			deferredResult = new MochiKit.Async.Deferred();
+			deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'importProcessorProgressUpdate', {status:'processing', size:aContext.size, progress:(aContext.size - aContext.line.length)});
+			deferredResult.addCallback(MochiKit.Async.wait, 0.2);
+			deferredResult.addCallback(MochiKit.Base.method(this, 'deferredParse_core'))
+			deferredResult.callback(aContext);
+		}
+		
+		return deferredResult;
+	},
+	
+	//.........................................................................
+	
+	'deferredParse': function(aValue) {
+		var deferredResult;
+		var lines;
+		var context;
+
+		lines = aValue.replace(/\r?\n/g, "\n").replace(/^\n*/g, "").replace(/\n$/g, "");
+
+		context = {
+			line: lines,
+			size: lines.length,
+			result: []
+		}
+
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(this, 'deferredParse_core'));
+		deferredResult.callback(context);
+
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'parseLine': function(aParameter) {
+		var result;
+		var palatable;
+		var line;
+		var processedField;
+		
+		result = [];
+
+		do {
+			processedField = this.parseField(aParameter);
+			if (processedField != null) {
+				result.push(processedField)
+			};
+		} while (processedField != null);
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'parseField': function(aParameter) {
+		var result;
+		
+		var inQuotes;
+		var validRegExp;
+		var singleQuoteBeginRegexp;
+		var escapedQuoteBeginRegexp;
+		var singleQuoteCommaEndRegexp;
+		var singleQuoteNewLineEndRegexp;
+		var commaBeginRegexp;
+		var newlineRegexp;
+		
+		
+		singleQuoteBeginRegexp		= new RegExp("^" + '\\' + this.quoteChar());
+		escapedQuoteBeginRegexp		= new RegExp("^" + '\\' + this.escapeChar() + '\\' + this.quoteChar());
+		singleQuoteCommaEndRegexp	= new RegExp("^" + '\\' + this.quoteChar() + '\\' + this.separatorChar());
+		singleQuoteNewLineEndRegexp	= new RegExp("^" + '\\' + this.quoteChar() + "\n");
+		commaBeginRegexp			= new RegExp("^" + '\\' + this.separatorChar());
+		newlineRegexp				= new RegExp("^\n");
+
+		inQuotes = false;
+		
+//MochiKit.Logging.logDebug("#################################### '" + aParameter.line + "'");
+		if (aParameter.line == "") {
+			if (aParameter.isThereAnEmptyFinalField == true) {
+				aParameter.isThereAnEmptyFinalField = false;
+				result = "";
+			} else {
+				result = null;
+			}
+		} else {
+			if (this.binary()) {
+				validRegexp = /^./;
+//				validRegexp = /^[^\\]/;
+			} else {
+				validRegexp = /^[\t\040-\176]/;
+			}
+		
+			try {
+				var done;
+			
+				done = false;
+				result = "";
+			
+				while (!done) {
+					if (aParameter.line.length < 1) {
+//MochiKit.Logging.logDebug("---> 1: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+						if (inQuotes == true) {
+//MochiKit.Logging.logDebug("---> 1.1: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+							throw new Error("CSV Parsing error; end of string, missing closing double-quote...");
+						} else {
+//MochiKit.Logging.logDebug("---> 1.2: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+							done = true;
+						}
+					} else if (escapedQuoteBeginRegexp.test(aParameter.line)) {
+//MochiKit.Logging.logDebug("---> 2.1: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+						result += this.quoteChar();
+						aParameter.line = aParameter.line.substr(2, aParameter.line.length - 1);
+//MochiKit.Logging.logDebug("<--- 2.2: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+					} else if (singleQuoteBeginRegexp.test(aParameter.line)) {
+//MochiKit.Logging.logDebug("---> 3: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+						if (inQuotes == true) {
+							if (aParameter.line.length == 1) {
+//MochiKit.Logging.logDebug("---> 3.1: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+								aParameter.line = '';
+								done = true;
+							} else if (singleQuoteCommaEndRegexp.test(aParameter.line)) {
+//MochiKit.Logging.logDebug("---> 3.3: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+								aParameter.line = aParameter.line.substr(2, aParameter.line.length - 1);
+								done = true;
+//MochiKit.Logging.logDebug("<--- 3.3: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+							} else if (singleQuoteNewLineEndRegexp.test(aParameter.line)) {
+								aParameter.line = aParameter.line.substr(1, aParameter.line.length - 1);
+								done = true;
+							} else {
+								throw new Error("CSV Parsing error; double-quote, followed by undesirable character (bad character sequence)... " + aParameter.line);
+							}
+						} else {
+//MochiKit.Logging.logDebug("---> 4: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+							if (result == "") {
+//MochiKit.Logging.logDebug("---> 4.1: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+								inQuotes = true;
+								aParameter.line = aParameter.line.substr(1, aParameter.line.length - 1);
+//MochiKit.Logging.logDebug("<--- 4.1: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+							} else {
+								throw new Error("CSV Parsing error; double-quote, outside of double-quotes (bad character sequence)...");
+							}
+						}
+					} else if (commaBeginRegexp.test(aParameter.line)) {
+//MochiKit.Logging.logDebug("---> 5: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+						if (inQuotes) {
+//MochiKit.Logging.logDebug("---> 5.1: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+							result += aParameter.line.substr(0 ,1);
+							aParameter.line = aParameter.line.substr(1, aParameter.line.length - 1);
+//MochiKit.Logging.logDebug("<--- 5.1: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+						} else {
+//MochiKit.Logging.logDebug("---> 5.2: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+							aParameter.line = aParameter.line.substr(1, aParameter.line.length - 1);
+							if (newlineRegexp.test(aParameter.line) || aParameter.line == "") {
+//MochiKit.Logging.logDebug("######");
+								aParameter.isThereAnEmptyFinalField = true;
+							};
+							done = true;
+//MochiKit.Logging.logDebug("<--- 5.2: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+						}
+					} else if (validRegexp.test(aParameter.line)) {
+//MochiKit.Logging.logDebug("---> 6: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+						result += aParameter.line.substr(0, 1);
+						aParameter.line = aParameter.line.substr(1, aParameter.line.length - 1);
+//MochiKit.Logging.logDebug("<--- 6: '" + aParameter.line.replace(/\n/g, "\\n") + "'");
+					} else if (newlineRegexp.test(aParameter.line)) {
+						if (inQuotes == true) {
+							result += aParameter.line.substr(0 ,1);
+							aParameter.line = aParameter.line.substr(1, aParameter.line.length - 1);
+						} else {
+							if (result == "") {
+								if (aParameter.isThereAnEmptyFinalField == true) {
+									aParameter.isThereAnEmptyFinalField = false;
+								} else {
+									result = null;
+								}
+							}
+							
+							done = true;
+						}
+					} else { 
+						throw new Error("CSV Parsing error; an undesirable character... '" + aParameter.line.substr(0,1) + "'");
+					}
+				}
+			} catch(exception) {
+				MochiKit.Logging.logError(exception.message);
+//				result = null;
+				throw exception;
+			}
+		}
+
+//if (result != null) {
+//	MochiKit.Logging.logDebug("<=== result: '" + result.replace(/\n/g, "\\n") + "'");
+//} else {
+//	MochiKit.Logging.logDebug("<=== result: NULL");
+//}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+
diff --git a/frontend/beta/js/Clipperz/Crypto/AES.js b/frontend/beta/js/Clipperz/Crypto/AES.js
new file mode 100644
index 0000000..a60df5c
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/AES.js
@@ -0,0 +1,836 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.ByteArray) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.AES depends on Clipperz.ByteArray!";
+}  
+
+//	Dependency commented to avoid a circular reference
+//try { if (typeof(Clipperz.Crypto.PRNG) == 'undefined') { throw ""; }} catch (e) {
+//	throw "Clipperz.Crypto.AES depends on Clipperz.Crypto.PRNG!";
+//}  
+
+if (typeof(Clipperz.Crypto.AES) == 'undefined') { Clipperz.Crypto.AES = {}; }
+
+//#############################################################################
+
+Clipperz.Crypto.AES.DeferredExecutionContext = function(args) {
+	args = args || {};
+
+	this._key = args.key;
+	this._message = args.message;
+	this._result = args.message.clone();
+	this._nonce = args.nonce;
+	this._messageLength = this._message.length();
+	
+	this._messageArray = this._message.arrayValues();
+	this._resultArray = this._result.arrayValues();
+	this._nonceArray = this._nonce.arrayValues();
+	
+	this._executionStep = 0;
+	
+	return this;
+}
+
+Clipperz.Crypto.AES.DeferredExecutionContext.prototype = MochiKit.Base.update(null, {
+
+	'key': function() {
+		return this._key;
+	},
+	
+	'message': function() {
+		return this._message;
+	},
+	
+	'messageLength': function() {
+		return this._messageLength;
+	},
+	
+	'result': function() {
+		return new Clipperz.ByteArray(this.resultArray());
+	},
+	
+	'nonce': function() {
+		return this._nonce;
+	},
+
+	'messageArray': function() {
+		return this._messageArray;
+	},
+	
+	'resultArray': function() {
+		return this._resultArray;
+	},
+	
+	'nonceArray': function() {
+		return this._nonceArray;
+	},
+
+	'elaborationChunkSize': function() {
+		return Clipperz.Crypto.AES.DeferredExecution.chunkSize;
+	},
+	
+	'executionStep': function() {
+		return this._executionStep;
+	},
+	
+	'setExecutionStep': function(aValue) {
+		this._executionStep = aValue;
+	},
+	
+	'pause': function(aValue) {
+		return MochiKit.Async.wait(Clipperz.Crypto.AES.DeferredExecution.pauseTime, aValue);
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
+//#############################################################################
+
+Clipperz.Crypto.AES.Key = function(args) {
+	args = args || {};
+
+	this._key = args.key;
+	this._keySize = args.keySize || this.key().length();
+	
+	if (this.keySize() == 128/8) {
+		this._b = 176;
+		this._numberOfRounds = 10;
+ 	} else if (this.keySize() == 256/8) {
+		this._b = 240;
+		this._numberOfRounds = 14;
+	} else {
+		MochiKit.Logging.logError("AES unsupported key size: " + (this.keySize() * 8) + " bits");
+		throw Clipperz.Crypto.AES.exception.UnsupportedKeySize;
+	}
+	
+	this._stretchedKey = null;
+	
+	return this;
+}
+
+Clipperz.Crypto.AES.Key.prototype = MochiKit.Base.update(null, {
+
+	'asString': function() {
+		return "Clipperz.Crypto.AES.Key (" + this.key().toHexString() + ")";
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'key': function() {
+		return this._key;
+	},
+
+	'keySize': function() {
+		return this._keySize;
+	},
+	
+	'b': function() {
+		return this._b;
+	},
+	
+	'numberOfRounds': function() {
+		return this._numberOfRounds;
+	},
+	//=========================================================================
+
+	'keyScheduleCore': function(aWord, aRoundConstantsIndex) {
+		var	result;
+		var sbox;
+
+		sbox = Clipperz.Crypto.AES.sbox();
+
+		result = [	sbox[aWord[1]] ^ Clipperz.Crypto.AES.roundConstants()[aRoundConstantsIndex],
+					sbox[aWord[2]],
+					sbox[aWord[3]],
+					sbox[aWord[0]]	];
+
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'xorWithPreviousStretchValues': function(aKey, aWord, aPreviousWordIndex) {
+		var	result;
+		var i,c;
+		
+		result = [];
+		c = 4;
+		for (i=0; i<c; i++) {
+			result[i] = aWord[i] ^ aKey.byteAtIndex(aPreviousWordIndex + i);
+		}
+		
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'sboxShakeup': function(aWord) {
+		var result;
+		var sbox;
+		var i,c;
+		
+		result = [];
+		sbox = Clipperz.Crypto.AES.sbox();
+		c =4;
+		for (i=0; i<c; i++) {
+			result[i] = sbox[aWord[i]];
+		}
+		
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'stretchKey': function(aKey) {
+		var	currentWord;
+		var	keyLength;
+		var	previousStretchIndex;
+		var i,c;
+		
+		keyLength = aKey.length();
+		previousStretchIndex = keyLength - this.keySize();
+
+		currentWord = [	aKey.byteAtIndex(keyLength - 4),
+						aKey.byteAtIndex(keyLength - 3),
+						aKey.byteAtIndex(keyLength - 2),
+						aKey.byteAtIndex(keyLength - 1)	];
+		currentWord = this.keyScheduleCore(currentWord, keyLength / this.keySize());
+
+		if (this.keySize() == 256/8) {
+			c = 8;
+		} else if (this.keySize() == 128/8){
+			c = 4;
+		}
+		
+		for (i=0; i<c; i++) {
+			if (i == 4) {
+				//	fifth streatch word
+				currentWord = this.sboxShakeup(currentWord);
+			}
+
+			currentWord = this.xorWithPreviousStretchValues(aKey, currentWord, previousStretchIndex + (i*4));
+			aKey.appendBytes(currentWord);
+		}
+
+		return aKey;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'stretchedKey': function() {
+		if (this._stretchedKey == null) {
+			var stretchedKey;
+			
+			stretchedKey = this.key().clone();
+
+			while (stretchedKey.length() < this.keySize()) {
+				stretchedKey.appendByte(0);
+			}
+
+			while (stretchedKey.length() < this.b()) {
+				stretchedKey = this.stretchKey(stretchedKey);
+			}
+			
+			this._stretchedKey = stretchedKey.split(0, this.b());
+		}
+		
+		return this._stretchedKey;
+	},
+
+	//=========================================================================
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
+Clipperz.Crypto.AES.State = function(args) {
+	args = args || {};
+
+	this._data = args.block;
+	this._key = args.key;
+	
+	return this;
+}
+
+Clipperz.Crypto.AES.State.prototype = MochiKit.Base.update(null, {
+
+	'key': function() {
+		return this._key;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'data': function() {
+		return this._data;
+	},
+
+	'setData': function(aValue) {
+		this._data = aValue;
+	},
+
+	//=========================================================================
+
+	'addRoundKey': function(aRoundNumber) {
+	 	//	each byte of the state is combined with the round key; each round key is derived from the cipher key using a key schedule.
+		var	data;
+		var	stretchedKey;
+		var	firstStretchedKeyIndex;
+		var i,c;
+
+		data = this.data();
+		stretchedKey = this.key().stretchedKey();
+		firstStretchedKeyIndex = aRoundNumber * (128/8);
+		c = 128/8;
+		for (i=0; i<c; i++) {
+			data[i] = data[i] ^ stretchedKey.byteAtIndex(firstStretchedKeyIndex + i);
+		}
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'subBytes': function() {
+		//	 a non-linear substitution step where each byte is replaced with another according to a lookup table.
+		var i,c;
+		var	data;
+		var sbox;
+		
+		data = this.data();
+		sbox = Clipperz.Crypto.AES.sbox();
+		
+		c = 16;
+		for (i=0; i<c; i++) {
+			data[i] = sbox[data[i]];
+		}
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'shiftRows': function() {
+		//	a transposition step where each row of the state is shifted cyclically a certain number of steps.
+		var	newValue;
+		var	data;
+		var	shiftMapping;
+		var	i,c;
+		
+		newValue = new Array(16);
+		data = this.data();
+		shiftMapping = Clipperz.Crypto.AES.shiftRowMapping();
+//		[0, 5, 10, 15, 4, 9, 14, 3, 8, 13, 2, 7, 12, 1, 6, 11];
+		c = 16;
+		for (i=0; i<c; i++) {
+			newValue[i] = data[shiftMapping[i]];
+		}
+		for (i=0; i<c; i++) {
+			data[i] = newValue[i];
+		}
+	},
+
+	//-----------------------------------------------------------------------------
+/*
+	'mixColumnsWithValues': function(someValues) {
+		var	result;
+		var	a;
+		var i,c;
+		
+		c = 4;
+		result = [];
+		a = [];
+		for (i=0; i<c; i++) {
+			a[i] = [];
+			a[i][1] = someValues[i]
+			if ((a[i][1] & 0x80) == 0x80) {
+				a[i][2] = (a[i][1] << 1) ^ 0x11b;
+			} else {
+				a[i][2] = a[i][1] << 1;
+			}
+			
+			a[i][3] = a[i][2] ^ a[i][1];
+		}
+	
+		for (i=0; i<c; i++) {
+			var	x;
+
+			x = Clipperz.Crypto.AES.mixColumnsMatrix()[i];
+			result[i] = a[0][x[0]] ^ a[1][x[1]] ^ a[2][x[2]] ^ a[3][x[3]];
+		}
+
+		return result;
+	},
+	
+	'mixColumns': function() {
+		//	a mixing operation which operates on the columns of the state, combining the four bytes in each column using a linear transformation.
+		var data;
+		var i, c;
+		
+		data = this.data();
+		c = 4;
+		for(i=0; i<c; i++) {
+			var	blockIndex;
+			var mixedValues;
+			
+			blockIndex = i * 4;
+			mixedValues = this.mixColumnsWithValues([	data[blockIndex + 0],
+														data[blockIndex + 1],
+														data[blockIndex + 2],
+														data[blockIndex + 3]]);
+			data[blockIndex + 0] = mixedValues[0];
+			data[blockIndex + 1] = mixedValues[1];
+			data[blockIndex + 2] = mixedValues[2];
+			data[blockIndex + 3] = mixedValues[3];
+		}
+	},
+*/
+
+	'mixColumns': function() {
+		//	a mixing operation which operates on the columns of the state, combining the four bytes in each column using a linear transformation.
+		var data;
+		var i, c;
+		var a_1;
+		var a_2;
+
+		a_1 = new Array(4);
+		a_2 = new Array(4);
+		
+		data = this.data();
+		c = 4;
+		for(i=0; i<c; i++) {
+			var	blockIndex;
+			var ii, cc;
+			
+			blockIndex = i * 4;
+
+			cc = 4;
+			for (ii=0; ii<cc; ii++) {
+				var value;
+				
+				value = data[blockIndex + ii];
+				a_1[ii] = value;
+				a_2[ii] = (value & 0x80) ? ((value << 1) ^ 0x011b) : (value << 1);
+			}
+
+			data[blockIndex + 0] = a_2[0] ^ a_1[1] ^ a_2[1] ^ a_1[2] ^ a_1[3];
+			data[blockIndex + 1] = a_1[0] ^ a_2[1] ^ a_1[2] ^ a_2[2] ^ a_1[3];
+			data[blockIndex + 2] = a_1[0] ^ a_1[1] ^ a_2[2] ^ a_1[3] ^ a_2[3];
+			data[blockIndex + 3] = a_1[0] ^ a_2[0] ^ a_1[1] ^ a_1[2] ^ a_2[3];
+		}
+	},
+
+	//=========================================================================
+	
+	'spinRound': function(aRoundNumber) {
+		this.addRoundKey(aRoundNumber);
+		this.subBytes();
+		this.shiftRows();
+		this.mixColumns();
+	},
+
+	'spinLastRound': function() {
+		this.addRoundKey(this.key().numberOfRounds() - 1);
+		this.subBytes();
+		this.shiftRows();
+		this.addRoundKey(this.key().numberOfRounds());
+	},
+
+	//=========================================================================
+
+	'encrypt': function() {
+		var	i,c;
+
+		c = this.key().numberOfRounds() - 1;
+		for (i=0; i<c; i++) {
+			this.spinRound(i);
+		}
+
+		this.spinLastRound();
+	},
+	
+	//=========================================================================
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
+Clipperz.Crypto.AES.VERSION = "0.1";
+Clipperz.Crypto.AES.NAME = "Clipperz.Crypto.AES";
+
+MochiKit.Base.update(Clipperz.Crypto.AES, {
+
+//	http://www.cs.eku.edu/faculty/styer/460/Encrypt/JS-AES.html
+//	http://en.wikipedia.org/wiki/Advanced_Encryption_Standard
+//	http://en.wikipedia.org/wiki/Rijndael_key_schedule 
+//	http://en.wikipedia.org/wiki/Rijndael_S-box
+		
+	'__repr__': function () {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//=============================================================================
+	
+	'_sbox': null,
+	'sbox': function() {
+		if (Clipperz.Crypto.AES._sbox == null) {
+			Clipperz.Crypto.AES._sbox = [
+0x63, 0x7c, 0x77, 0x7b, 0xf2, 0x6b, 0x6f, 0xc5, 0x30, 0x01, 0x67, 0x2b, 0xfe, 0xd7, 0xab, 0x76,
+0xca, 0x82, 0xc9, 0x7d, 0xfa, 0x59, 0x47, 0xf0, 0xad, 0xd4, 0xa2, 0xaf, 0x9c, 0xa4, 0x72, 0xc0,
+0xb7, 0xfd, 0x93, 0x26, 0x36, 0x3f, 0xf7, 0xcc, 0x34, 0xa5, 0xe5, 0xf1, 0x71, 0xd8, 0x31, 0x15,
+0x04, 0xc7, 0x23, 0xc3, 0x18, 0x96, 0x05, 0x9a, 0x07, 0x12, 0x80, 0xe2, 0xeb, 0x27, 0xb2, 0x75,
+0x09, 0x83, 0x2c, 0x1a, 0x1b, 0x6e, 0x5a, 0xa0, 0x52, 0x3b, 0xd6, 0xb3, 0x29, 0xe3, 0x2f, 0x84,
+0x53, 0xd1, 0x00, 0xed, 0x20, 0xfc, 0xb1, 0x5b, 0x6a, 0xcb, 0xbe, 0x39, 0x4a, 0x4c, 0x58, 0xcf,
+0xd0, 0xef, 0xaa, 0xfb, 0x43, 0x4d, 0x33, 0x85, 0x45, 0xf9, 0x02, 0x7f, 0x50, 0x3c, 0x9f, 0xa8,
+0x51, 0xa3, 0x40, 0x8f, 0x92, 0x9d, 0x38, 0xf5, 0xbc, 0xb6, 0xda, 0x21, 0x10, 0xff, 0xf3, 0xd2,
+0xcd, 0x0c, 0x13, 0xec, 0x5f, 0x97, 0x44, 0x17, 0xc4, 0xa7, 0x7e, 0x3d, 0x64, 0x5d, 0x19, 0x73,
+0x60, 0x81, 0x4f, 0xdc, 0x22, 0x2a, 0x90, 0x88, 0x46, 0xee, 0xb8, 0x14, 0xde, 0x5e, 0x0b, 0xdb,
+0xe0, 0x32, 0x3a, 0x0a, 0x49, 0x06, 0x24, 0x5c, 0xc2, 0xd3, 0xac, 0x62, 0x91, 0x95, 0xe4, 0x79,
+0xe7, 0xc8, 0x37, 0x6d, 0x8d, 0xd5, 0x4e, 0xa9, 0x6c, 0x56, 0xf4, 0xea, 0x65, 0x7a, 0xae, 0x08,
+0xba, 0x78, 0x25, 0x2e, 0x1c, 0xa6, 0xb4, 0xc6, 0xe8, 0xdd, 0x74, 0x1f, 0x4b, 0xbd, 0x8b, 0x8a,
+0x70, 0x3e, 0xb5, 0x66, 0x48, 0x03, 0xf6, 0x0e, 0x61, 0x35, 0x57, 0xb9, 0x86, 0xc1, 0x1d, 0x9e,
+0xe1, 0xf8, 0x98, 0x11, 0x69, 0xd9, 0x8e, 0x94, 0x9b, 0x1e, 0x87, 0xe9, 0xce, 0x55, 0x28, 0xdf,
+0x8c, 0xa1, 0x89, 0x0d, 0xbf, 0xe6, 0x42, 0x68, 0x41, 0x99, 0x2d, 0x0f, 0xb0, 0x54, 0xbb, 0x16
+			];
+		}
+		
+		return Clipperz.Crypto.AES._sbox;
+	},
+
+	//-----------------------------------------------------------------------------
+	//
+	//		0	4	8	12				0	4	8	12
+	//		1	5	9	13		=>		5	9	13	1
+	//		2	6	10	14				10	14	2	6
+	//		3	7	11	15				15	3	7	11
+	//
+	'_shiftRowMapping': null,
+	'shiftRowMapping': function() {
+		if (Clipperz.Crypto.AES._shiftRowMapping == null) {
+			Clipperz.Crypto.AES._shiftRowMapping = [0, 5, 10, 15, 4, 9, 14, 3, 8, 13, 2, 7, 12, 1, 6, 11];
+		}
+		
+		return Clipperz.Crypto.AES._shiftRowMapping;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'_mixColumnsMatrix': null,
+	'mixColumnsMatrix': function() {
+		if (Clipperz.Crypto.AES._mixColumnsMatrix == null) {
+			Clipperz.Crypto.AES._mixColumnsMatrix = [	[2, 3, 1 ,1],
+														[1, 2, 3, 1],
+														[1, 1, 2, 3],
+														[3, 1, 1, 2]   ];
+		}
+		
+		return Clipperz.Crypto.AES._mixColumnsMatrix;
+	},
+
+	'_roundConstants': null,
+	'roundConstants': function() {
+		if (Clipperz.Crypto.AES._roundConstants == null) {
+			Clipperz.Crypto.AES._roundConstants = [ , 1, 2, 4, 8, 16, 32, 64, 128, 27, 54, 108, 216, 171, 77, 154];
+//			Clipperz.Crypto.AES._roundConstants = [ , 0x01, 0x02, 0x04, 0x08, 0x10, 0x20, 0x40, 0x80, 0x1b, 0x36, 0x6c, 0xd8, 0xab, 0x4d, 0x9a];
+		}
+		
+		return Clipperz.Crypto.AES._roundConstants;
+	},
+	
+	//=============================================================================
+
+	'incrementNonce': function(aNonce) {
+//Clipperz.Profile.start("Clipperz.Crypto.AES.incrementNonce");
+		var i;
+		var done;
+		
+		done = false;
+		i = aNonce.length - 1;
+		
+		while ((i>=0) && (done == false)) {
+			var currentByteValue;
+			
+			currentByteValue = aNonce[i];
+			
+			if (currentByteValue == 0xff) {
+				aNonce[i] = 0;
+				if (i>= 0) {
+					i --;
+				} else {
+					done = true;
+				}
+			} else {
+				aNonce[i] = currentByteValue + 1;
+				done = true;
+			}
+		}
+//Clipperz.Profile.stop("Clipperz.Crypto.AES.incrementNonce");
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'encryptBlock': function(aKey, aBlock) {
+		var	result;
+		var	state;
+
+		state = new Clipperz.Crypto.AES.State({block:aBlock, key:aKey});
+//is(state.data(), 'before');
+		state.encrypt();
+		result = state.data(); 
+		
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'encryptBlocks': function(aKey, aMessage, aNonce) {
+		var	result;
+		var nonce;
+		var self;
+		var	messageIndex;
+		var	messageLength;
+		var blockSize;		
+		
+		self = Clipperz.Crypto.AES;
+		blockSize = 128/8;
+		messageLength = aMessage.length;
+		nonce = aNonce;
+
+		result = aMessage;
+		messageIndex = 0;
+		while (messageIndex < messageLength) {
+			var encryptedBlock;
+			var i,c;
+			
+			self.incrementNonce(nonce);
+			encryptedBlock = self.encryptBlock(aKey, nonce);
+			
+			if ((messageLength - messageIndex) > blockSize) {
+				c = blockSize;
+			} else {
+				c = messageLength - messageIndex;
+			}
+			
+			for (i=0; i<c; i++) {
+				result[messageIndex + i] = result[messageIndex + i] ^ encryptedBlock[i];
+			}
+			
+			messageIndex += blockSize;
+		}
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'encrypt': function(aKey, someData, aNonce) {
+		var result;
+		var nonce;
+		var	encryptedData;
+		var key;
+
+		key = new Clipperz.Crypto.AES.Key({key:aKey});
+		nonce = aNonce ? aNonce.clone() : Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(128/8);
+
+		encryptedData = Clipperz.Crypto.AES.encryptBlocks(key, someData.arrayValues(), nonce.arrayValues());
+
+		result = nonce.appendBytes(encryptedData);
+		
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'decrypt': function(aKey, someData) {
+		var result;
+		var nonce;
+		var encryptedData;
+		var decryptedData;
+		var	dataIterator;
+		var key;
+
+		key = new Clipperz.Crypto.AES.Key({key:aKey});
+
+		encryptedData = someData.arrayValues();
+		nonce = encryptedData.slice(0, (128/8));
+		encryptedData = encryptedData.slice(128/8);
+		decryptedData = Clipperz.Crypto.AES.encryptBlocks(key, encryptedData, nonce);
+
+		result = new Clipperz.ByteArray(decryptedData);
+		
+		return result;
+	},
+	
+	//=============================================================================
+
+	'deferredEncryptExecutionChunk': function(anExecutionContext) {
+		var	result;
+		var nonce;
+		var self;
+		var	messageIndex;
+		var	messageLength;
+		var blockSize;	
+		var executionLimit;
+
+		self = Clipperz.Crypto.AES;
+		blockSize = 128/8;
+		messageLength = anExecutionContext.messageArray().length;
+		nonce = anExecutionContext.nonceArray();
+		result = anExecutionContext.resultArray();
+
+		messageIndex = anExecutionContext.executionStep();
+		executionLimit = messageIndex + anExecutionContext.elaborationChunkSize();
+		executionLimit = Math.min(executionLimit, messageLength);
+		
+		while (messageIndex < executionLimit) {
+			var encryptedBlock;
+			var i,c;
+			
+			self.incrementNonce(nonce);
+			encryptedBlock = self.encryptBlock(anExecutionContext.key(), nonce);
+			
+			if ((executionLimit - messageIndex) > blockSize) {
+				c = blockSize;
+			} else {
+				c = executionLimit - messageIndex;
+			}
+			
+			for (i=0; i<c; i++) {
+				result[messageIndex + i] = result[messageIndex + i] ^ encryptedBlock[i];
+			}
+			
+			messageIndex += blockSize;
+		}
+		anExecutionContext.setExecutionStep(messageIndex);
+		
+		return anExecutionContext;
+	},
+
+	//-----------------------------------------------------------------------------
+	
+	'deferredEncryptBlocks': function(anExecutionContext) {
+		var	deferredResult;
+		var	messageSize;
+		var i,c;
+		var now;
+		
+		messageSize = anExecutionContext.messageLength();		
+		
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.Crypto.AES.deferredEncryptBlocks - START: " + res); return res;});
+//		deferredResult.addCallback(MochiKit.Base.method(anExecutionContext, 'pause'));
+
+		c = Math.ceil(messageSize / anExecutionContext.elaborationChunkSize());
+		for (i=0; i<c; i++) {
+//deferredResult.addBoth(function(res) {now = new Date(); return res;});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.Crypto.AES.deferredEncryptBlocks - : (" + i + ") - " + res); return res;});
+			deferredResult.addCallback(Clipperz.Crypto.AES.deferredEncryptExecutionChunk);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + (new Date() - now) + "]Clipperz.Crypto.AES.deferredEncryptBlocks"); return res;});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.Crypto.AES.deferredEncryptBlocks - : (" + i + ") -- " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(anExecutionContext, 'pause'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.Crypto.AES.deferredEncryptBlocks - : (" + i + ") --- " + res); return res;});
+		}
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.Crypto.AES.deferredEncryptBlocks - END: " + res); return res;});
+		
+		deferredResult.callback(anExecutionContext);
+		
+		return deferredResult;
+	},
+
+	//-----------------------------------------------------------------------------
+	
+	'deferredEncrypt': function(aKey, someData, aNonce) {
+		var deferredResult;
+		var	executionContext;
+		var result;
+		var nonce;
+		var key;
+
+		key = new Clipperz.Crypto.AES.Key({key:aKey});
+		nonce = aNonce ? aNonce.clone() : Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(128/8);
+
+		executionContext = new Clipperz.Crypto.AES.DeferredExecutionContext({key:key, message:someData, nonce:nonce});
+
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.Crypto.AES.deferredEncrypt - 1: " + res); return res;});
+		deferredResult.addCallback(Clipperz.Crypto.AES.deferredEncryptBlocks);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.Crypto.AES.deferredEncrypt - 2: " + res); return res;});
+		deferredResult.addCallback(function(anExecutionContext) {
+			var result;
+			
+			result = anExecutionContext.nonce().clone();
+			result.appendBytes(anExecutionContext.resultArray());
+
+			return result;
+		});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.Crypto.AES.deferredEncrypt - 3: " + res); return res;});
+		deferredResult.callback(executionContext)
+
+		return deferredResult;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'deferredDecrypt': function(aKey, someData) {
+		var deferredResult
+		var nonce;
+		var message;
+		var key;
+
+		key = new Clipperz.Crypto.AES.Key({key:aKey});
+		nonce = someData.split(0, (128/8));
+		message = someData.split(128/8);
+		executionContext = new Clipperz.Crypto.AES.DeferredExecutionContext({key:key, message:message, nonce:nonce});
+
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(Clipperz.Crypto.AES.deferredEncryptBlocks);
+		deferredResult.addCallback(function(anExecutionContext) {
+			return anExecutionContext.result();
+		});
+		deferredResult.callback(executionContext);
+
+		return deferredResult;
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
+//#############################################################################
+
+Clipperz.Crypto.AES.DeferredExecution = {
+	'chunkSize': 4096,	//	1024	4096	8192	16384	32768;
+	'pauseTime': 0.2
+}
+
+Clipperz.Crypto.AES.exception = {
+	'UnsupportedKeySize':    new MochiKit.Base.NamedError("Clipperz.Crypto.AES.exception.UnsupportedKeySize") 
+};
diff --git a/frontend/beta/js/Clipperz/Crypto/Base.js b/frontend/beta/js/Clipperz/Crypto/Base.js
new file mode 100644
index 0000000..b69dcc8
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/Base.js
@@ -0,0 +1,1852 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.Base) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.Base depends on Clipperz.Base!";
+}  
+
+if (typeof(Clipperz.Crypto) == 'undefined') { Clipperz.Crypto = {}; }
+if (typeof(Clipperz.Crypto.Base) == 'undefined') { Clipperz.Crypto.Base = {}; }
+
+Clipperz.Crypto.Base.VERSION = "0.1";
+Clipperz.Crypto.Base.NAME = "Clipperz.Crypto.Base";
+
+//#############################################################################
+//	Downloaded on March 30, 2006 from http://anmar.eu.org/projects/jssha2/files/jssha2-0.3.zip (jsSha2/sha256.js)
+//#############################################################################
+
+/* A JavaScript implementation of the Secure Hash Algorithm, SHA-256
+ * Version 0.3 Copyright Angel Marin 2003-2004 - http://anmar.eu.org/
+ * Distributed under the BSD License
+ * Some bits taken from Paul Johnston's SHA-1 implementation
+ */
+var chrsz = 8;  /* bits per input character. 8 - ASCII; 16 - Unicode  */
+function safe_add (x, y) {
+  var lsw = (x & 0xFFFF) + (y & 0xFFFF);
+  var msw = (x >> 16) + (y >> 16) + (lsw >> 16);
+  return (msw << 16) | (lsw & 0xFFFF);
+}
+function S (X, n) {return ( X >>> n ) | (X << (32 - n));}
+function R (X, n) {return ( X >>> n );}
+function Ch(x, y, z) {return ((x & y) ^ ((~x) & z));}
+function Maj(x, y, z) {return ((x & y) ^ (x & z) ^ (y & z));}
+function Sigma0256(x) {return (S(x, 2) ^ S(x, 13) ^ S(x, 22));}
+function Sigma1256(x) {return (S(x, 6) ^ S(x, 11) ^ S(x, 25));}
+function Gamma0256(x) {return (S(x, 7) ^ S(x, 18) ^ R(x, 3));}
+function Gamma1256(x) {return (S(x, 17) ^ S(x, 19) ^ R(x, 10));}
+function core_sha256 (m, l) {
+    var K = new Array(0x428A2F98,0x71374491,0xB5C0FBCF,0xE9B5DBA5,0x3956C25B,0x59F111F1,0x923F82A4,0xAB1C5ED5,0xD807AA98,0x12835B01,0x243185BE,0x550C7DC3,0x72BE5D74,0x80DEB1FE,0x9BDC06A7,0xC19BF174,0xE49B69C1,0xEFBE4786,0xFC19DC6,0x240CA1CC,0x2DE92C6F,0x4A7484AA,0x5CB0A9DC,0x76F988DA,0x983E5152,0xA831C66D,0xB00327C8,0xBF597FC7,0xC6E00BF3,0xD5A79147,0x6CA6351,0x14292967,0x27B70A85,0x2E1B2138,0x4D2C6DFC,0x53380D13,0x650A7354,0x766A0ABB,0x81C2C92E,0x92722C85,0xA2BFE8A1,0xA81A664B,0xC24B8B70,0xC76C51A3,0xD192E819,0xD6990624,0xF40E3585,0x106AA070,0x19A4C116,0x1E376C08,0x2748774C,0x34B0BCB5,0x391C0CB3,0x4ED8AA4A,0x5B9CCA4F,0x682E6FF3,0x748F82EE,0x78A5636F,0x84C87814,0x8CC70208,0x90BEFFFA,0xA4506CEB,0xBEF9A3F7,0xC67178F2);
+    var HASH = new Array(0x6A09E667, 0xBB67AE85, 0x3C6EF372, 0xA54FF53A, 0x510E527F, 0x9B05688C, 0x1F83D9AB, 0x5BE0CD19);
+    var W = new Array(64);
+    var a, b, c, d, e, f, g, h, i, j;
+    var T1, T2;
+    /* append padding */
+    m[l >> 5] |= 0x80 << (24 - l % 32);
+    m[((l + 64 >> 9) << 4) + 15] = l;
+    for ( var i = 0; i<m.length; i+=16 ) {
+        a = HASH[0]; b = HASH[1]; c = HASH[2]; d = HASH[3]; e = HASH[4]; f = HASH[5]; g = HASH[6]; h = HASH[7];
+        for ( var j = 0; j<64; j++) {
+            if (j < 16) W[j] = m[j + i];
+            else W[j] = safe_add(safe_add(safe_add(Gamma1256(W[j - 2]), W[j - 7]), Gamma0256(W[j - 15])), W[j - 16]);
+            T1 = safe_add(safe_add(safe_add(safe_add(h, Sigma1256(e)), Ch(e, f, g)), K[j]), W[j]);
+            T2 = safe_add(Sigma0256(a), Maj(a, b, c));
+            h = g; g = f; f = e; e = safe_add(d, T1); d = c; c = b; b = a; a = safe_add(T1, T2);
+        }
+        HASH[0] = safe_add(a, HASH[0]); HASH[1] = safe_add(b, HASH[1]); HASH[2] = safe_add(c, HASH[2]); HASH[3] = safe_add(d, HASH[3]); HASH[4] = safe_add(e, HASH[4]); HASH[5] = safe_add(f, HASH[5]); HASH[6] = safe_add(g, HASH[6]); HASH[7] = safe_add(h, HASH[7]);
+    }
+    return HASH;
+}
+function str2binb (str) {
+  var bin = Array();
+  var mask = (1 << chrsz) - 1;
+  for(var i = 0; i < str.length * chrsz; i += chrsz)
+    bin[i>>5] |= (str.charCodeAt(i / chrsz) & mask) << (24 - i%32);
+  return bin;
+}
+function binb2hex (binarray) {
+  var hexcase = 0; /* hex output format. 0 - lowercase; 1 - uppercase */
+  var hex_tab = hexcase ? "0123456789ABCDEF" : "0123456789abcdef";
+  var str = "";
+  for (var i = 0; i < binarray.length * 4; i++) {
+    str += hex_tab.charAt((binarray[i>>2] >> ((3 - i%4)*8+4)) & 0xF) + hex_tab.charAt((binarray[i>>2] >> ((3 - i%4)*8  )) & 0xF);
+  }
+  return str;
+}
+function hex_sha256(s){return binb2hex(core_sha256(str2binb(s),s.length * chrsz));}
+
+
+
+//#############################################################################
+//	Downloaded on March 30, 2006 from http://www.fourmilab.ch/javascrypt/javascrypt.zip (entropy.js)
+//#############################################################################
+
+    //  Entropy collection utilities
+
+    /*	Start by declaring static storage and initialise
+    	the entropy vector from the time we come through
+    	here. */
+	
+    var entropyData = new Array();   	    // Collected entropy data
+    var edlen = 0;  	    	    	    // Keyboard array data length
+ 
+    addEntropyTime();	    	    	    // Start entropy collection with page load time
+    ce();   	    	    	    	    // Roll milliseconds into initial entropy
+
+    //	Add a byte to the entropy vector
+    
+    function addEntropyByte(b) {
+    	entropyData[edlen++] = b;
+    }
+            
+    /*	Capture entropy.  When the user presses a key or performs
+	various other events for which we can request
+	notification, add the time in 255ths of a second to the
+	entropyData array.  The name of the function is short
+	so it doesn't bloat the form object declarations in
+	which it appears in various "onXXX" events.  */
+    
+    function ce() {
+    	addEntropyByte(Math.floor((((new Date).getMilliseconds()) * 255) / 999));
+    }
+    
+    //	Add a 32 bit quantity to the entropy vector
+    
+    function addEntropy32(w) {
+    	var i;
+	
+	for (i = 0; i < 4; i++) {
+	    addEntropyByte(w & 0xFF);
+	    w >>= 8;
+    	}
+    }
+    
+    /*	Add the current time and date (milliseconds since the epoch,
+    	truncated to 32 bits) to the entropy vector.  */
+	
+    function addEntropyTime() {
+    	addEntropy32((new Date()).getTime());
+    }
+
+    /*  Start collection of entropy from mouse movements. The
+	argument specifies the  number of entropy items to be
+	obtained from mouse motion, after which mouse motion
+	will be ignored.  Note that you can re-enable mouse
+	motion collection at any time if not already underway.  */
+	
+    var mouseMotionCollect = 0;
+    var oldMoveHandler;     	    // For saving and restoring mouse move handler in IE4
+	
+    function mouseMotionEntropy(maxsamp) {
+    	if (mouseMotionCollect <= 0) {
+	    mouseMotionCollect = maxsamp;
+    	    if ((document.implementation.hasFeature("Events", "2.0")) &&
+	    	document.addEventListener) {
+    	    	//  Browser supports Document Object Model (DOM) 2 events
+		document.addEventListener("mousemove", mouseMoveEntropy, false);
+	    } else {
+		if (document.attachEvent) {
+	    	    //  Internet Explorer 5 and above event model
+		    document.attachEvent("onmousemove", mouseMoveEntropy);
+		} else {
+		    //	Internet Explorer 4 event model
+	    	    oldMoveHandler = document.onmousemove;
+		    document.onmousemove = mouseMoveEntropy;
+		}
+	    }
+//dump("Mouse enable", mouseMotionCollect);
+	}
+    }
+    
+    /*	Collect entropy from mouse motion events.  Note that
+    	this is craftily coded to work with either DOM2 or Internet
+	Explorer style events.  Note that we don't use every successive
+	mouse movement event.  Instead, we XOR the three bytes collected
+	from the mouse and use that to determine how many subsequent
+	mouse movements we ignore before capturing the next one.  */
+	
+    var mouseEntropyTime = 0;	    // Delay counter for mouse entropy collection
+	
+    function mouseMoveEntropy(e) {
+    	if (!e) {
+	    e = window.event;	    // Internet Explorer event model
+	}
+	if (mouseMotionCollect > 0) {
+	    if (mouseEntropyTime-- <= 0) {
+	    	addEntropyByte(e.screenX & 0xFF);
+	    	addEntropyByte(e.screenY & 0xFF);
+	    	ce();
+	    	mouseMotionCollect--;
+	    	mouseEntropyTime = (entropyData[edlen - 3] ^ entropyData[edlen - 2] ^
+		    	    	    entropyData[edlen - 1]) % 19;
+//dump("Mouse Move", byteArrayToHex(entropyData.slice(-3)));
+    	    }
+	    if (mouseMotionCollect <= 0) {
+	    	if (document.removeEventListener) {
+		    document.removeEventListener("mousemove", mouseMoveEntropy, false);
+		} else if (document.detachEvent) {
+		    document.detachEvent("onmousemove", mouseMoveEntropy);
+		} else {
+		    document.onmousemove = oldMoveHandler;
+		}
+//dump("Spung!", 0);
+	    }
+	}
+    }    
+    
+    /*	Compute a 32 byte key value from the entropy vector.
+    	We compute the value by taking the MD5 sum of the even
+	and odd bytes respectively of the entropy vector, then
+	concatenating the two MD5 sums.  */
+    
+    function keyFromEntropy() {
+	var i, k = new Array(32);
+	
+	if (edlen == 0) {
+	    alert("Blooie!  Entropy vector void at call to keyFromEntropy.");
+	}
+//dump("Entropy bytes", edlen);
+
+	md5_init();
+	for (i = 0; i < edlen; i += 2) {
+	    md5_update(entropyData[i]);
+	}
+	md5_finish();
+    	for (i = 0; i < 16; i++) {
+	    k[i] = digestBits[i];
+	}
+
+	md5_init();
+	for (i = 1; i < edlen; i += 2) {
+	    md5_update(entropyData[i]);
+	}
+	md5_finish();
+    	for (i = 0; i < 16; i++) {
+	    k[i + 16] = digestBits[i];
+	}
+	
+//dump("keyFromEntropy", byteArrayToHex(k));
+	return k;
+    }
+
+//#############################################################################
+//	Downloaded on March 30, 2006 from http://www.fourmilab.ch/javascrypt/javascrypt.zip (aesprng.js)
+//#############################################################################
+
+
+    //  AES based pseudorandom number generator
+
+    /*  Constructor.  Called with an array of 32 byte (0-255) values
+	containing the initial seed.  */
+
+    function AESprng(seed) {
+	this.key = new Array();
+	this.key = seed;
+	this.itext = hexToByteArray("9F489613248148F9C27945C6AE62EECA3E3367BB14064E4E6DC67A9F28AB3BD1");
+	this.nbytes = 0;    	    // Bytes left in buffer
+	
+	this.next = AESprng_next;
+	this.nextbits = AESprng_nextbits;
+	this.nextInt = AESprng_nextInt;
+	this.round = AESprng_round;
+	
+	/*  Encrypt the initial text with the seed key
+	    three times, feeding the output of the encryption
+	    back into the key for the next round.  */
+	
+	bsb = blockSizeInBits;
+	blockSizeInBits = 256;    
+	var i, ct;
+    	for (i = 0; i < 3; i++) {
+	    this.key = rijndaelEncrypt(this.itext, this.key, "ECB");
+	}
+	
+	/*  Now make between one and four additional
+	    key-feedback rounds, with the number determined
+	    by bits from the result of the first three
+	    rounds.  */
+	
+	var n = 1 + (this.key[3] & 2) + (this.key[9] & 1);    
+    	for (i = 0; i < n; i++) {
+	    this.key = rijndaelEncrypt(this.itext, this.key, "ECB");
+	}
+    	blockSizeInBits = bsb;
+    }
+    
+    function AESprng_round() {
+	bsb = blockSizeInBits;
+	blockSizeInBits = 256;    
+    	this.key = rijndaelEncrypt(this.itext, this.key, "ECB");
+	this.nbytes = 32;
+    	blockSizeInBits = bsb;
+    }
+    
+    //	Return next byte from the generator
+
+    function AESprng_next() {
+    	if (this.nbytes <= 0) {
+	    this.round();
+	}
+	return(this.key[--this.nbytes]);
+    }
+    
+    //	Return n bit integer value (up to maximum integer size)
+    
+    function AESprng_nextbits(n) {
+    	var i, w = 0, nbytes = Math.floor((n + 7) / 8);
+
+	for (i = 0; i < nbytes; i++) {
+	    w = (w << 8) | this.next();
+	}
+	return w & ((1 << n) - 1);
+    }
+
+    //  Return integer between 0 and n inclusive
+    
+    function AESprng_nextInt(n) {
+    	var p = 1, nb = 0;
+	
+	//  Determine smallest p,  2^p > n
+	//  nb = log_2 p
+	
+	while (n >= p) {
+	    p <<= 1;
+	    nb++;
+	}
+	p--;
+	
+	/*  Generate values from 0 through n by first generating
+	    values v from 0 to (2^p)-1, then discarding any results v > n.
+	    For the rationale behind this (and why taking
+	    values mod (n + 1) is biased toward smaller values, see
+	    Ferguson and Schneier, "Practical Cryptography",
+	    ISBN 0-471-22357-3, section 10.8).  */
+
+	while (true) {
+    	    var v = this.nextbits(nb) & p;
+	    
+	    if (v <= n) {
+	    	return v;
+	    }
+	}
+    }
+
+//#############################################################################
+//	Downloaded on March 30, 2006 from http://www.fourmilab.ch/javascrypt/javascrypt.zip (md5.js)
+//#############################################################################
+
+/*
+ *  md5.jvs 1.0b 27/06/96
+ *
+ * Javascript implementation of the RSA Data Security, Inc. MD5
+ * Message-Digest Algorithm.
+ *
+ * Copyright (c) 1996 Henri Torgemane. All Rights Reserved.
+ *
+ * Permission to use, copy, modify, and distribute this software
+ * and its documentation for any purposes and without
+ * fee is hereby granted provided that this copyright notice
+ * appears in all copies. 
+ *
+ * Of course, this soft is provided "as is" without express or implied
+ * warranty of any kind.
+
+    This version contains some trivial reformatting modifications
+    by John Walker.
+
+ */
+
+function array(n) {
+    for (i = 0; i < n; i++) {
+        this[i] = 0;
+    }
+    this.length = n;
+}
+
+/* Some basic logical functions had to be rewritten because of a bug in
+ * Javascript.. Just try to compute 0xffffffff >> 4 with it..
+ * Of course, these functions are slower than the original would be, but
+ * at least, they work!
+ */
+
+function integer(n) {
+    return n % (0xffffffff + 1);
+}
+
+function shr(a, b) {
+    a = integer(a);
+    b = integer(b);
+    if (a - 0x80000000 >= 0) {
+        a = a % 0x80000000;
+        a >>= b;
+        a += 0x40000000 >> (b - 1);
+    } else {
+        a >>= b;
+    }
+    return a;
+}
+
+function shl1(a) {
+    a = a % 0x80000000;
+    if (a & 0x40000000 == 0x40000000) {
+        a -= 0x40000000;  
+        a *= 2;
+        a += 0x80000000;
+    } else {
+        a *= 2;
+    }
+    return a;
+}
+
+function shl(a, b) {
+    a = integer(a);
+    b = integer(b);
+    for (var i = 0; i < b; i++) {
+        a = shl1(a);
+    }
+    return a;
+}
+
+function and(a, b) {
+    a = integer(a);
+    b = integer(b);
+    var t1 = a - 0x80000000;
+    var t2 = b - 0x80000000;
+    if (t1 >= 0) {
+        if (t2 >= 0) {
+            return ((t1 & t2) + 0x80000000);
+        } else {
+            return (t1 & b);
+        }
+    } else {
+        if (t2 >= 0) {
+            return (a & t2);
+        } else {
+            return (a & b);  
+        }
+    }
+}
+
+function or(a, b) {
+    a = integer(a);
+    b = integer(b);
+    var t1 = a - 0x80000000;
+    var t2 = b - 0x80000000;
+    if (t1 >= 0) {
+        if (t2 >= 0) {
+            return ((t1 | t2) + 0x80000000);
+        } else {
+            return ((t1 | b) + 0x80000000);
+        }
+    } else {
+        if (t2 >= 0) {
+            return ((a | t2) + 0x80000000);
+        } else {
+            return (a | b);  
+        }
+    }
+}
+
+function xor(a, b) {
+    a = integer(a);
+    b = integer(b);
+    var t1 = a - 0x80000000;
+    var t2 = b - 0x80000000;
+    if (t1 >= 0) {
+        if (t2 >= 0) {
+            return (t1 ^ t2);
+        } else {
+            return ((t1 ^ b) + 0x80000000);
+        }
+    } else {
+        if (t2 >= 0) {
+            return ((a ^ t2) + 0x80000000);
+        } else {
+            return (a ^ b);  
+        }
+    }
+}
+
+function not(a) {
+    a = integer(a);
+    return 0xffffffff - a;
+}
+
+/* Here begin the real algorithm */
+
+var state = new array(4); 
+var count = new array(2);
+    count[0] = 0;
+    count[1] = 0;                     
+var buffer = new array(64); 
+var transformBuffer = new array(16); 
+var digestBits = new array(16);
+
+var S11 = 7;
+var S12 = 12;
+var S13 = 17;
+var S14 = 22;
+var S21 = 5;
+var S22 = 9;
+var S23 = 14;
+var S24 = 20;
+var S31 = 4;
+var S32 = 11;
+var S33 = 16;
+var S34 = 23;
+var S41 = 6;
+var S42 = 10;
+var S43 = 15;
+var S44 = 21;
+
+function F(x, y, z) {
+    return or(and(x, y), and(not(x), z));
+}
+
+function G(x, y, z) {
+    return or(and(x, z), and(y, not(z)));
+}
+
+function H(x, y, z) {
+    return xor(xor(x, y), z);
+}
+
+function I(x, y, z) {
+    return xor(y ,or(x , not(z)));
+}
+
+function rotateLeft(a, n) {
+    return or(shl(a, n), (shr(a, (32 - n))));
+}
+
+function FF(a, b, c, d, x, s, ac) {
+    a = a + F(b, c, d) + x + ac;
+    a = rotateLeft(a, s);
+    a = a + b;
+    return a;
+}
+
+function GG(a, b, c, d, x, s, ac) {
+    a = a + G(b, c, d) + x + ac;
+    a = rotateLeft(a, s);
+    a = a + b;
+    return a;
+}
+
+function HH(a, b, c, d, x, s, ac) {
+    a = a + H(b, c, d) + x + ac;
+    a = rotateLeft(a, s);
+    a = a + b;
+    return a;
+}
+
+function II(a, b, c, d, x, s, ac) {
+    a = a + I(b, c, d) + x + ac;
+    a = rotateLeft(a, s);
+    a = a + b;
+    return a;
+}
+
+function transform(buf, offset) { 
+    var a = 0, b = 0, c = 0, d = 0; 
+    var x = transformBuffer;
+    
+    a = state[0];
+    b = state[1];
+    c = state[2];
+    d = state[3];
+    
+    for (i = 0; i < 16; i++) {
+        x[i] = and(buf[i * 4 + offset], 0xFF);
+        for (j = 1; j < 4; j++) {
+            x[i] += shl(and(buf[i * 4 + j + offset] ,0xFF), j * 8);
+        }
+    }
+
+    /* Round 1 */
+    a = FF( a, b, c, d, x[ 0], S11, 0xd76aa478); /* 1 */
+    d = FF( d, a, b, c, x[ 1], S12, 0xe8c7b756); /* 2 */
+    c = FF( c, d, a, b, x[ 2], S13, 0x242070db); /* 3 */
+    b = FF( b, c, d, a, x[ 3], S14, 0xc1bdceee); /* 4 */
+    a = FF( a, b, c, d, x[ 4], S11, 0xf57c0faf); /* 5 */
+    d = FF( d, a, b, c, x[ 5], S12, 0x4787c62a); /* 6 */
+    c = FF( c, d, a, b, x[ 6], S13, 0xa8304613); /* 7 */
+    b = FF( b, c, d, a, x[ 7], S14, 0xfd469501); /* 8 */
+    a = FF( a, b, c, d, x[ 8], S11, 0x698098d8); /* 9 */
+    d = FF( d, a, b, c, x[ 9], S12, 0x8b44f7af); /* 10 */
+    c = FF( c, d, a, b, x[10], S13, 0xffff5bb1); /* 11 */
+    b = FF( b, c, d, a, x[11], S14, 0x895cd7be); /* 12 */
+    a = FF( a, b, c, d, x[12], S11, 0x6b901122); /* 13 */
+    d = FF( d, a, b, c, x[13], S12, 0xfd987193); /* 14 */
+    c = FF( c, d, a, b, x[14], S13, 0xa679438e); /* 15 */
+    b = FF( b, c, d, a, x[15], S14, 0x49b40821); /* 16 */
+
+    /* Round 2 */
+    a = GG( a, b, c, d, x[ 1], S21, 0xf61e2562); /* 17 */
+    d = GG( d, a, b, c, x[ 6], S22, 0xc040b340); /* 18 */
+    c = GG( c, d, a, b, x[11], S23, 0x265e5a51); /* 19 */
+    b = GG( b, c, d, a, x[ 0], S24, 0xe9b6c7aa); /* 20 */
+    a = GG( a, b, c, d, x[ 5], S21, 0xd62f105d); /* 21 */
+    d = GG( d, a, b, c, x[10], S22,  0x2441453); /* 22 */
+    c = GG( c, d, a, b, x[15], S23, 0xd8a1e681); /* 23 */
+    b = GG( b, c, d, a, x[ 4], S24, 0xe7d3fbc8); /* 24 */
+    a = GG( a, b, c, d, x[ 9], S21, 0x21e1cde6); /* 25 */
+    d = GG( d, a, b, c, x[14], S22, 0xc33707d6); /* 26 */
+    c = GG( c, d, a, b, x[ 3], S23, 0xf4d50d87); /* 27 */
+    b = GG( b, c, d, a, x[ 8], S24, 0x455a14ed); /* 28 */
+    a = GG( a, b, c, d, x[13], S21, 0xa9e3e905); /* 29 */
+    d = GG( d, a, b, c, x[ 2], S22, 0xfcefa3f8); /* 30 */
+    c = GG( c, d, a, b, x[ 7], S23, 0x676f02d9); /* 31 */
+    b = GG( b, c, d, a, x[12], S24, 0x8d2a4c8a); /* 32 */
+
+    /* Round 3 */
+    a = HH( a, b, c, d, x[ 5], S31, 0xfffa3942); /* 33 */
+    d = HH( d, a, b, c, x[ 8], S32, 0x8771f681); /* 34 */
+    c = HH( c, d, a, b, x[11], S33, 0x6d9d6122); /* 35 */
+    b = HH( b, c, d, a, x[14], S34, 0xfde5380c); /* 36 */
+    a = HH( a, b, c, d, x[ 1], S31, 0xa4beea44); /* 37 */
+    d = HH( d, a, b, c, x[ 4], S32, 0x4bdecfa9); /* 38 */
+    c = HH( c, d, a, b, x[ 7], S33, 0xf6bb4b60); /* 39 */
+    b = HH( b, c, d, a, x[10], S34, 0xbebfbc70); /* 40 */
+    a = HH( a, b, c, d, x[13], S31, 0x289b7ec6); /* 41 */
+    d = HH( d, a, b, c, x[ 0], S32, 0xeaa127fa); /* 42 */
+    c = HH( c, d, a, b, x[ 3], S33, 0xd4ef3085); /* 43 */
+    b = HH( b, c, d, a, x[ 6], S34,  0x4881d05); /* 44 */
+    a = HH( a, b, c, d, x[ 9], S31, 0xd9d4d039); /* 45 */
+    d = HH( d, a, b, c, x[12], S32, 0xe6db99e5); /* 46 */
+    c = HH( c, d, a, b, x[15], S33, 0x1fa27cf8); /* 47 */
+    b = HH( b, c, d, a, x[ 2], S34, 0xc4ac5665); /* 48 */
+
+    /* Round 4 */
+    a = II( a, b, c, d, x[ 0], S41, 0xf4292244); /* 49 */
+    d = II( d, a, b, c, x[ 7], S42, 0x432aff97); /* 50 */
+    c = II( c, d, a, b, x[14], S43, 0xab9423a7); /* 51 */
+    b = II( b, c, d, a, x[ 5], S44, 0xfc93a039); /* 52 */
+    a = II( a, b, c, d, x[12], S41, 0x655b59c3); /* 53 */
+    d = II( d, a, b, c, x[ 3], S42, 0x8f0ccc92); /* 54 */
+    c = II( c, d, a, b, x[10], S43, 0xffeff47d); /* 55 */
+    b = II( b, c, d, a, x[ 1], S44, 0x85845dd1); /* 56 */
+    a = II( a, b, c, d, x[ 8], S41, 0x6fa87e4f); /* 57 */
+    d = II( d, a, b, c, x[15], S42, 0xfe2ce6e0); /* 58 */
+    c = II( c, d, a, b, x[ 6], S43, 0xa3014314); /* 59 */
+    b = II( b, c, d, a, x[13], S44, 0x4e0811a1); /* 60 */
+    a = II( a, b, c, d, x[ 4], S41, 0xf7537e82); /* 61 */
+    d = II( d, a, b, c, x[11], S42, 0xbd3af235); /* 62 */
+    c = II( c, d, a, b, x[ 2], S43, 0x2ad7d2bb); /* 63 */
+    b = II( b, c, d, a, x[ 9], S44, 0xeb86d391); /* 64 */
+
+    state[0] += a;
+    state[1] += b;
+    state[2] += c;
+    state[3] += d;
+
+}
+
+function md5_init() {
+    count[0] = count[1] = 0;
+    state[0] = 0x67452301;
+    state[1] = 0xefcdab89;
+    state[2] = 0x98badcfe;
+    state[3] = 0x10325476;
+    for (i = 0; i < digestBits.length; i++) {
+        digestBits[i] = 0;
+    }
+}
+
+function md5_update(b) { 
+    var index, i;
+    
+    index = and(shr(count[0],3) , 0x3F);
+    if (count[0] < 0xFFFFFFFF - 7) {
+      count[0] += 8;
+    } else {
+      count[1]++;
+      count[0] -= 0xFFFFFFFF + 1;
+      count[0] += 8;
+    }
+    buffer[index] = and(b, 0xff);
+    if (index  >= 63) {
+        transform(buffer, 0);
+    }
+}
+
+function md5_finish() {
+    var bits = new array(8);
+    var padding; 
+    var i = 0, index = 0, padLen = 0;
+
+    for (i = 0; i < 4; i++) {
+        bits[i] = and(shr(count[0], (i * 8)), 0xFF);
+    }
+    for (i = 0; i < 4; i++) {
+        bits[i + 4] = and(shr(count[1], (i * 8)), 0xFF);
+    }
+    index = and(shr(count[0], 3), 0x3F);
+    padLen = (index < 56) ? (56 - index) : (120 - index);
+    padding = new array(64); 
+    padding[0] = 0x80;
+    for (i = 0; i < padLen; i++) {
+      md5_update(padding[i]);
+    }
+    for (i = 0; i < 8; i++) {
+      md5_update(bits[i]);
+    }
+
+    for (i = 0; i < 4; i++) {
+        for (j = 0; j < 4; j++) {
+            digestBits[i * 4 + j] = and(shr(state[i], (j * 8)) , 0xFF);
+        }
+    } 
+}
+
+/* End of the MD5 algorithm */
+
+//#############################################################################
+//	Downloaded on March 30, 2006 from http://www.fourmilab.ch/javascrypt/javascrypt.zip (aes.js)
+//#############################################################################
+
+
+/* rijndael.js      Rijndael Reference Implementation
+
+    This is a modified version of the software described below,
+    produced in September 2003 by John Walker for use in the
+    JavsScrypt browser-based encryption package.  The principal
+    changes are replacing the original getRandomBytes function with
+    one which calls our pseudorandom generator (which must
+    be instantiated and seeded before the first call on getRandomBytes),
+    and changing keySizeInBits to 256.  Some code not required by the
+    JavsScrypt application has been commented out.  Please see
+    http://www.fourmilab.ch/javascrypt/ for further information on
+    JavaScrypt.
+    
+    The following is the original copyright and application
+    information.
+
+   Copyright (c) 2001 Fritz Schneider
+ 
+ This software is provided as-is, without express or implied warranty.  
+ Permission to use, copy, modify, distribute or sell this software, with or
+ without fee, for any purpose and by any individual or organization, is hereby
+ granted, provided that the above copyright notice and this paragraph appear 
+ in all copies. Distribution as a part of an application or binary must
+ include the above copyright notice in the documentation and/or other materials
+ provided with the application or distribution.
+
+   As the above disclaimer notes, you are free to use this code however you
+   want. However, I would request that you send me an email 
+   (fritz /at/ cs /dot/ ucsd /dot/ edu) to say hi if you find this code useful
+   or instructional. Seeing that people are using the code acts as 
+   encouragement for me to continue development. If you *really* want to thank
+   me you can buy the book I wrote with Thomas Powell, _JavaScript:
+   _The_Complete_Reference_ :)
+
+   This code is an UNOPTIMIZED REFERENCE implementation of Rijndael. 
+   If there is sufficient interest I can write an optimized (word-based, 
+   table-driven) version, although you might want to consider using a 
+   compiled language if speed is critical to your application. As it stands,
+   one run of the monte carlo test (10,000 encryptions) can take up to 
+   several minutes, depending upon your processor. You shouldn't expect more
+   than a few kilobytes per second in throughput.
+
+   Also note that there is very little error checking in these functions. 
+   Doing proper error checking is always a good idea, but the ideal 
+   implementation (using the instanceof operator and exceptions) requires
+   IE5+/NS6+, and I've chosen to implement this code so that it is compatible
+   with IE4/NS4. 
+
+   And finally, because JavaScript doesn't have an explicit byte/char data 
+   type (although JavaScript 2.0 most likely will), when I refer to "byte" 
+   in this code I generally mean "32 bit integer with value in the interval 
+   [0,255]" which I treat as a byte.
+
+   See http://www-cse.ucsd.edu/~fritz/rijndael.html for more documentation
+   of the (very simple) API provided by this code.
+
+                                               Fritz Schneider
+                                               fritz at cs.ucsd.edu
+ 
+*/
+
+
+// Rijndael parameters --  Valid values are 128, 192, or 256
+
+var keySizeInBits = 256;
+var blockSizeInBits = 128;
+
+//
+// Note: in the following code the two dimensional arrays are indexed as
+//       you would probably expect, as array[row][column]. The state arrays
+//       are 2d arrays of the form state[4][Nb].
+
+
+// The number of rounds for the cipher, indexed by [Nk][Nb]
+var roundsArray = [ ,,,,[,,,,10,, 12,, 14],, 
+                        [,,,,12,, 12,, 14],, 
+                        [,,,,14,, 14,, 14] ];
+
+// The number of bytes to shift by in shiftRow, indexed by [Nb][row]
+var shiftOffsets = [ ,,,,[,1, 2, 3],,[,1, 2, 3],,[,1, 3, 4] ];
+
+// The round constants used in subkey expansion
+var Rcon = [ 
+0x01, 0x02, 0x04, 0x08, 0x10, 0x20, 
+0x40, 0x80, 0x1b, 0x36, 0x6c, 0xd8, 
+0xab, 0x4d, 0x9a, 0x2f, 0x5e, 0xbc, 
+0x63, 0xc6, 0x97, 0x35, 0x6a, 0xd4, 
+0xb3, 0x7d, 0xfa, 0xef, 0xc5, 0x91 ];
+
+// Precomputed lookup table for the SBox
+var SBox = [
+ 99, 124, 119, 123, 242, 107, 111, 197,  48,   1, 103,  43, 254, 215, 171, 
+118, 202, 130, 201, 125, 250,  89,  71, 240, 173, 212, 162, 175, 156, 164, 
+114, 192, 183, 253, 147,  38,  54,  63, 247, 204,  52, 165, 229, 241, 113, 
+216,  49,  21,   4, 199,  35, 195,  24, 150,   5, 154,   7,  18, 128, 226, 
+235,  39, 178, 117,   9, 131,  44,  26,  27, 110,  90, 160,  82,  59, 214, 
+179,  41, 227,  47, 132,  83, 209,   0, 237,  32, 252, 177,  91, 106, 203, 
+190,  57,  74,  76,  88, 207, 208, 239, 170, 251,  67,  77,  51, 133,  69, 
+249,   2, 127,  80,  60, 159, 168,  81, 163,  64, 143, 146, 157,  56, 245, 
+188, 182, 218,  33,  16, 255, 243, 210, 205,  12,  19, 236,  95, 151,  68,  
+23,  196, 167, 126,  61, 100,  93,  25, 115,  96, 129,  79, 220,  34,  42, 
+144, 136,  70, 238, 184,  20, 222,  94,  11, 219, 224,  50,  58,  10,  73,
+  6,  36,  92, 194, 211, 172,  98, 145, 149, 228, 121, 231, 200,  55, 109, 
+141, 213,  78, 169, 108,  86, 244, 234, 101, 122, 174,   8, 186, 120,  37,  
+ 46,  28, 166, 180, 198, 232, 221, 116,  31,  75, 189, 139, 138, 112,  62, 
+181, 102,  72,   3, 246,  14,  97,  53,  87, 185, 134, 193,  29, 158, 225,
+248, 152,  17, 105, 217, 142, 148, 155,  30, 135, 233, 206,  85,  40, 223,
+140, 161, 137,  13, 191, 230,  66, 104,  65, 153,  45,  15, 176,  84, 187,  
+ 22 ];
+
+// Precomputed lookup table for the inverse SBox
+var SBoxInverse = [
+ 82,   9, 106, 213,  48,  54, 165,  56, 191,  64, 163, 158, 129, 243, 215, 
+251, 124, 227,  57, 130, 155,  47, 255, 135,  52, 142,  67,  68, 196, 222, 
+233, 203,  84, 123, 148,  50, 166, 194,  35,  61, 238,  76, 149,  11,  66, 
+250, 195,  78,   8,  46, 161, 102,  40, 217,  36, 178, 118,  91, 162,  73, 
+109, 139, 209,  37, 114, 248, 246, 100, 134, 104, 152,  22, 212, 164,  92, 
+204,  93, 101, 182, 146, 108, 112,  72,  80, 253, 237, 185, 218,  94,  21,  
+ 70,  87, 167, 141, 157, 132, 144, 216, 171,   0, 140, 188, 211,  10, 247, 
+228,  88,   5, 184, 179,  69,   6, 208,  44,  30, 143, 202,  63,  15,   2, 
+193, 175, 189,   3,   1,  19, 138, 107,  58, 145,  17,  65,  79, 103, 220, 
+234, 151, 242, 207, 206, 240, 180, 230, 115, 150, 172, 116,  34, 231, 173,
+ 53, 133, 226, 249,  55, 232,  28, 117, 223, 110,  71, 241,  26, 113,  29, 
+ 41, 197, 137, 111, 183,  98,  14, 170,  24, 190,  27, 252,  86,  62,  75, 
+198, 210, 121,  32, 154, 219, 192, 254, 120, 205,  90, 244,  31, 221, 168,
+ 51, 136,   7, 199,  49, 177,  18,  16,  89,  39, 128, 236,  95,  96,  81,
+127, 169,  25, 181,  74,  13,  45, 229, 122, 159, 147, 201, 156, 239, 160,
+224,  59,  77, 174,  42, 245, 176, 200, 235, 187,  60, 131,  83, 153,  97, 
+ 23,  43,   4, 126, 186, 119, 214,  38, 225, 105,  20,  99,  85,  33,  12,
+125 ];
+
+// This method circularly shifts the array left by the number of elements
+// given in its parameter. It returns the resulting array and is used for 
+// the ShiftRow step. Note that shift() and push() could be used for a more 
+// elegant solution, but they require IE5.5+, so I chose to do it manually. 
+
+function cyclicShiftLeft(theArray, positions) {
+  var temp = theArray.slice(0, positions);
+  theArray = theArray.slice(positions).concat(temp);
+  return theArray;
+}
+
+// Cipher parameters ... do not change these
+var Nk = keySizeInBits / 32;                   
+var Nb = blockSizeInBits / 32;
+var Nr = roundsArray[Nk][Nb];
+
+// Multiplies the element "poly" of GF(2^8) by x. See the Rijndael spec.
+
+function xtime(poly) {
+  poly <<= 1;
+  return ((poly & 0x100) ? (poly ^ 0x11B) : (poly));
+}
+
+// Multiplies the two elements of GF(2^8) together and returns the result.
+// See the Rijndael spec, but should be straightforward: for each power of
+// the indeterminant that has a 1 coefficient in x, add y times that power
+// to the result. x and y should be bytes representing elements of GF(2^8)
+
+function mult_GF256(x, y) {
+  var bit, result = 0;
+  
+  for (bit = 1; bit < 256; bit *= 2, y = xtime(y)) {
+    if (x & bit) 
+      result ^= y;
+  }
+  return result;
+}
+
+// Performs the substitution step of the cipher.  State is the 2d array of
+// state information (see spec) and direction is string indicating whether
+// we are performing the forward substitution ("encrypt") or inverse 
+// substitution (anything else)
+
+function byteSub(state, direction) {
+  var S;
+  if (direction == "encrypt")           // Point S to the SBox we're using
+    S = SBox;
+  else
+    S = SBoxInverse;
+  for (var i = 0; i < 4; i++)           // Substitute for every byte in state
+    for (var j = 0; j < Nb; j++)
+       state[i][j] = S[state[i][j]];
+}
+
+// Performs the row shifting step of the cipher.
+
+function shiftRow(state, direction) {
+  for (var i=1; i<4; i++)               // Row 0 never shifts
+    if (direction == "encrypt")
+       state[i] = cyclicShiftLeft(state[i], shiftOffsets[Nb][i]);
+    else
+       state[i] = cyclicShiftLeft(state[i], Nb - shiftOffsets[Nb][i]);
+
+}
+
+// Performs the column mixing step of the cipher. Most of these steps can
+// be combined into table lookups on 32bit values (at least for encryption)
+// to greatly increase the speed. 
+
+function mixColumn(state, direction) {
+  var b = [];                            // Result of matrix multiplications
+  for (var j = 0; j < Nb; j++) {         // Go through each column...
+    for (var i = 0; i < 4; i++) {        // and for each row in the column...
+      if (direction == "encrypt")
+        b[i] = mult_GF256(state[i][j], 2) ^          // perform mixing
+               mult_GF256(state[(i+1)%4][j], 3) ^ 
+               state[(i+2)%4][j] ^ 
+               state[(i+3)%4][j];
+      else 
+        b[i] = mult_GF256(state[i][j], 0xE) ^ 
+               mult_GF256(state[(i+1)%4][j], 0xB) ^
+               mult_GF256(state[(i+2)%4][j], 0xD) ^
+               mult_GF256(state[(i+3)%4][j], 9);
+    }
+    for (var i = 0; i < 4; i++)          // Place result back into column
+      state[i][j] = b[i];
+  }
+}
+
+// Adds the current round key to the state information. Straightforward.
+
+function addRoundKey(state, roundKey) {
+  for (var j = 0; j < Nb; j++) {                 // Step through columns...
+    state[0][j] ^= (roundKey[j] & 0xFF);         // and XOR
+    state[1][j] ^= ((roundKey[j]>>8) & 0xFF);
+    state[2][j] ^= ((roundKey[j]>>16) & 0xFF);
+    state[3][j] ^= ((roundKey[j]>>24) & 0xFF);
+  }
+}
+
+// This function creates the expanded key from the input (128/192/256-bit)
+// key. The parameter key is an array of bytes holding the value of the key.
+// The returned value is an array whose elements are the 32-bit words that 
+// make up the expanded key.
+
+function keyExpansion(key) {
+  var expandedKey = new Array();
+  var temp;
+
+  // in case the key size or parameters were changed...
+  Nk = keySizeInBits / 32;                   
+  Nb = blockSizeInBits / 32;
+  Nr = roundsArray[Nk][Nb];
+
+  for (var j=0; j < Nk; j++)     // Fill in input key first
+    expandedKey[j] = 
+      (key[4*j]) | (key[4*j+1]<<8) | (key[4*j+2]<<16) | (key[4*j+3]<<24);
+
+  // Now walk down the rest of the array filling in expanded key bytes as
+  // per Rijndael's spec
+  for (j = Nk; j < Nb * (Nr + 1); j++) {    // For each word of expanded key
+    temp = expandedKey[j - 1];
+    if (j % Nk == 0) 
+      temp = ( (SBox[(temp>>8) & 0xFF]) |
+               (SBox[(temp>>16) & 0xFF]<<8) |
+               (SBox[(temp>>24) & 0xFF]<<16) |
+               (SBox[temp & 0xFF]<<24) ) ^ Rcon[Math.floor(j / Nk) - 1];
+    else if (Nk > 6 && j % Nk == 4)
+      temp = (SBox[(temp>>24) & 0xFF]<<24) |
+             (SBox[(temp>>16) & 0xFF]<<16) |
+             (SBox[(temp>>8) & 0xFF]<<8) |
+             (SBox[temp & 0xFF]);
+    expandedKey[j] = expandedKey[j-Nk] ^ temp;
+  }
+  return expandedKey;
+}
+
+// Rijndael's round functions... 
+
+function Round(state, roundKey) {
+  byteSub(state, "encrypt");
+  shiftRow(state, "encrypt");
+  mixColumn(state, "encrypt");
+  addRoundKey(state, roundKey);
+}
+
+function InverseRound(state, roundKey) {
+  addRoundKey(state, roundKey);
+  mixColumn(state, "decrypt");
+  shiftRow(state, "decrypt");
+  byteSub(state, "decrypt");
+}
+
+function FinalRound(state, roundKey) {
+  byteSub(state, "encrypt");
+  shiftRow(state, "encrypt");
+  addRoundKey(state, roundKey);
+}
+
+function InverseFinalRound(state, roundKey){
+  addRoundKey(state, roundKey);
+  shiftRow(state, "decrypt");
+  byteSub(state, "decrypt");  
+}
+
+// encrypt is the basic encryption function. It takes parameters
+// block, an array of bytes representing a plaintext block, and expandedKey,
+// an array of words representing the expanded key previously returned by
+// keyExpansion(). The ciphertext block is returned as an array of bytes.
+
+function encrypt(block, expandedKey) {
+  var i;  
+  if (!block || block.length*8 != blockSizeInBits)
+     return; 
+  if (!expandedKey)
+     return;
+
+  block = packBytes(block);
+  addRoundKey(block, expandedKey);
+  for (i=1; i<Nr; i++) 
+    Round(block, expandedKey.slice(Nb*i, Nb*(i+1)));
+  FinalRound(block, expandedKey.slice(Nb*Nr)); 
+  return unpackBytes(block);
+}
+
+// decrypt is the basic decryption function. It takes parameters
+// block, an array of bytes representing a ciphertext block, and expandedKey,
+// an array of words representing the expanded key previously returned by
+// keyExpansion(). The decrypted block is returned as an array of bytes.
+
+function decrypt(block, expandedKey) {
+  var i;
+  if (!block || block.length*8 != blockSizeInBits)
+     return;
+  if (!expandedKey)
+     return;
+
+  block = packBytes(block);
+  InverseFinalRound(block, expandedKey.slice(Nb*Nr)); 
+  for (i = Nr - 1; i>0; i--) 
+    InverseRound(block, expandedKey.slice(Nb*i, Nb*(i+1)));
+  addRoundKey(block, expandedKey);
+  return unpackBytes(block);
+}
+
+/* !NEEDED
+// This method takes a byte array (byteArray) and converts it to a string by
+// applying String.fromCharCode() to each value and concatenating the result.
+// The resulting string is returned. Note that this function SKIPS zero bytes
+// under the assumption that they are padding added in formatPlaintext().
+// Obviously, do not invoke this method on raw data that can contain zero
+// bytes. It is really only appropriate for printable ASCII/Latin-1 
+// values. Roll your own function for more robust functionality :)
+
+function byteArrayToString(byteArray) {
+  var result = "";
+  for(var i=0; i<byteArray.length; i++)
+    if (byteArray[i] != 0) 
+      result += String.fromCharCode(byteArray[i]);
+  return result;
+}
+*/
+
+// This function takes an array of bytes (byteArray) and converts them
+// to a hexadecimal string. Array element 0 is found at the beginning of 
+// the resulting string, high nibble first. Consecutive elements follow
+// similarly, for example [16, 255] --> "10ff". The function returns a 
+// string.
+
+function byteArrayToHex(byteArray) {
+  var result = "";
+  if (!byteArray)
+    return;
+  for (var i=0; i<byteArray.length; i++)
+    result += ((byteArray[i]<16) ? "0" : "") + byteArray[i].toString(16);
+
+  return result;
+}
+
+// This function converts a string containing hexadecimal digits to an 
+// array of bytes. The resulting byte array is filled in the order the
+// values occur in the string, for example "10FF" --> [16, 255]. This
+// function returns an array. 
+
+function hexToByteArray(hexString) {
+  var byteArray = [];
+  if (hexString.length % 2)             // must have even length
+    return;
+  if (hexString.indexOf("0x") == 0 || hexString.indexOf("0X") == 0)
+    hexString = hexString.substring(2);
+  for (var i = 0; i<hexString.length; i += 2) 
+    byteArray[Math.floor(i/2)] = parseInt(hexString.slice(i, i+2), 16);
+  return byteArray;
+}
+
+// This function packs an array of bytes into the four row form defined by
+// Rijndael. It assumes the length of the array of bytes is divisible by
+// four. Bytes are filled in according to the Rijndael spec (starting with
+// column 0, row 0 to 3). This function returns a 2d array.
+
+function packBytes(octets) {
+  var state = new Array();
+  if (!octets || octets.length % 4)
+    return;
+
+  state[0] = new Array();  state[1] = new Array(); 
+  state[2] = new Array();  state[3] = new Array();
+  for (var j=0; j<octets.length; j+= 4) {
+     state[0][j/4] = octets[j];
+     state[1][j/4] = octets[j+1];
+     state[2][j/4] = octets[j+2];
+     state[3][j/4] = octets[j+3];
+  }
+  return state;  
+}
+
+// This function unpacks an array of bytes from the four row format preferred
+// by Rijndael into a single 1d array of bytes. It assumes the input "packed"
+// is a packed array. Bytes are filled in according to the Rijndael spec. 
+// This function returns a 1d array of bytes.
+
+function unpackBytes(packed) {
+  var result = new Array();
+  for (var j=0; j<packed[0].length; j++) {
+    result[result.length] = packed[0][j];
+    result[result.length] = packed[1][j];
+    result[result.length] = packed[2][j];
+    result[result.length] = packed[3][j];
+  }
+  return result;
+}
+
+// This function takes a prospective plaintext (string or array of bytes)
+// and pads it with pseudorandom bytes if its length is not a multiple of the block 
+// size. If plaintext is a string, it is converted to an array of bytes
+// in the process. The type checking can be made much nicer using the 
+// instanceof operator, but this operator is not available until IE5.0 so I 
+// chose to use the heuristic below. 
+
+function formatPlaintext(plaintext) {
+	var bpb = blockSizeInBits / 8;               // bytes per block
+	var fillWithRandomBits;
+	var i;
+
+	// if primitive string or String instance
+	if ((!((typeof plaintext == "object") &&
+		((typeof (plaintext[0])) == "number"))) &&
+		((typeof plaintext == "string") || plaintext.indexOf))
+	{
+		plaintext = plaintext.split("");
+		// Unicode issues here (ignoring high byte)
+		for (i=0; i<plaintext.length; i++) {
+			plaintext[i] = plaintext[i].charCodeAt(0) & 0xFF;
+		}
+	} 
+
+	i = plaintext.length % bpb;
+	if (i > 0) {
+//alert("adding " + (bpb - 1) + " bytes");
+//		plaintext = plaintext.concat(getRandomBytes(bpb - i));
+		{
+			var	paddingBytes;
+			var ii,cc;
+			
+			paddingBytes = new Array();
+			cc = bpb - i;
+			for (ii=0; ii<cc; ii++) {
+				paddingBytes[ii] = cc;
+			}
+
+//is("cc", cc);
+//is(getRandomBytes(bpb - i) + "", paddingBytes + "");
+			plaintext = plaintext.concat(paddingBytes);
+		}
+	}
+  
+	return plaintext;
+}
+
+// Returns an array containing "howMany" random bytes.
+
+function getRandomBytes(howMany) {
+    var i, bytes = new Array();
+
+//alert("getting some random bytes");
+    for (i = 0; i < howMany; i++) {
+    	bytes[i] = prng.nextInt(255);
+    }
+    return bytes;
+}
+
+// rijndaelEncrypt(plaintext, key, mode)
+// Encrypts the plaintext using the given key and in the given mode. 
+// The parameter "plaintext" can either be a string or an array of bytes. 
+// The parameter "key" must be an array of key bytes. If you have a hex 
+// string representing the key, invoke hexToByteArray() on it to convert it 
+// to an array of bytes. The third parameter "mode" is a string indicating
+// the encryption mode to use, either "ECB" or "CBC". If the parameter is
+// omitted, ECB is assumed.
+// 
+// An array of bytes representing the cihpertext is returned. To convert 
+// this array to hex, invoke byteArrayToHex() on it.
+
+function rijndaelEncrypt(plaintext, key, mode) {
+  var expandedKey, i, aBlock;
+  var bpb = blockSizeInBits / 8;          // bytes per block
+  var ct;                                 // ciphertext
+
+  if (!plaintext || !key)
+    return;
+  if (key.length*8 != keySizeInBits)
+    return; 
+  if (mode == "CBC") {
+    ct = getRandomBytes(bpb);             // get IV
+//dump("IV", byteArrayToHex(ct));
+  } else {
+    mode = "ECB";
+    ct = new Array();
+  }
+
+  // convert plaintext to byte array and pad with zeros if necessary. 
+  plaintext = formatPlaintext(plaintext);
+
+  expandedKey = keyExpansion(key);
+  
+  for (var block = 0; block < plaintext.length / bpb; block++) {
+    aBlock = plaintext.slice(block * bpb, (block + 1) * bpb);
+    if (mode == "CBC") {
+      for (var i = 0; i < bpb; i++) {
+        aBlock[i] ^= ct[(block * bpb) + i];
+      }
+    }
+    ct = ct.concat(encrypt(aBlock, expandedKey));
+  }
+
+  return ct;
+}
+
+// rijndaelDecrypt(ciphertext, key, mode)
+// Decrypts the using the given key and mode. The parameter "ciphertext" 
+// must be an array of bytes. The parameter "key" must be an array of key 
+// bytes. If you have a hex string representing the ciphertext or key, 
+// invoke hexToByteArray() on it to convert it to an array of bytes. The
+// parameter "mode" is a string, either "CBC" or "ECB".
+// 
+// An array of bytes representing the plaintext is returned. To convert 
+// this array to a hex string, invoke byteArrayToHex() on it. To convert it 
+// to a string of characters, you can use byteArrayToString().
+
+function rijndaelDecrypt(ciphertext, key, mode) {
+  var expandedKey;
+  var bpb = blockSizeInBits / 8;          // bytes per block
+  var pt = new Array();                   // plaintext array
+  var aBlock;                             // a decrypted block
+  var block;                              // current block number
+
+  if (!ciphertext || !key || typeof ciphertext == "string")
+    return;
+  if (key.length*8 != keySizeInBits)
+    return; 
+  if (!mode) {
+    mode = "ECB";                         // assume ECB if mode omitted
+  }
+
+  expandedKey = keyExpansion(key);
+ 
+  // work backwards to accomodate CBC mode 
+  for (block=(ciphertext.length / bpb)-1; block>0; block--) {
+    aBlock = 
+     decrypt(ciphertext.slice(block*bpb,(block+1)*bpb), expandedKey);
+    if (mode == "CBC") 
+      for (var i=0; i<bpb; i++) 
+        pt[(block-1)*bpb + i] = aBlock[i] ^ ciphertext[(block-1)*bpb + i];
+    else 
+      pt = aBlock.concat(pt);
+  }
+
+  // do last block if ECB (skips the IV in CBC)
+  if (mode == "ECB")
+    pt = decrypt(ciphertext.slice(0, bpb), expandedKey).concat(pt);
+
+  return pt;
+}
+
+//#############################################################################
+//	Downloaded on March 30, 2006 from http://www.fourmilab.ch/javascrypt/javascrypt.zip (utf-8.js)
+//#############################################################################
+
+
+    /*	Encoding and decoding of Unicode character strings as
+    	UTF-8 byte streams.  */
+	
+    //	UNICODE_TO_UTF8  --  Encode Unicode argument string as UTF-8 return value
+
+    function unicode_to_utf8(s) {
+	var utf8 = "";
+	
+	for (var n = 0; n < s.length; n++) {
+            var c = s.charCodeAt(n);
+
+            if (c <= 0x7F) {
+	    	//  0x00 - 0x7F:  Emit as single byte, unchanged
+        	utf8 += String.fromCharCode(c);
+            } else if ((c >= 0x80) && (c <= 0x7FF)) {
+	    	//  0x80 - 0x7FF:  Output as two byte code, 0xC0 in first byte
+		//  	    	    	    	    	    0x80 in second byte
+        	utf8 += String.fromCharCode((c >> 6) | 0xC0);
+        	utf8 += String.fromCharCode((c & 0x3F) | 0x80);
+            } else {
+	    	// 0x800 - 0xFFFF:  Output as three bytes, 0xE0 in first byte
+		//  	    	    	    	    	   0x80 in second byte
+		//  	    	    	    	    	   0x80 in third byte
+        	utf8 += String.fromCharCode((c >> 12) | 0xE0);
+        	utf8 += String.fromCharCode(((c >> 6) & 0x3F) | 0x80);
+        	utf8 += String.fromCharCode((c & 0x3F) | 0x80);
+            }
+	}
+	return utf8;
+    }
+
+    //	UTF8_TO_UNICODE  --  Decode UTF-8 argument into Unicode string return value
+
+    function utf8_to_unicode(utf8) {
+	var s = "", i = 0, b1, b2, b2;
+
+	while (i < utf8.length) {
+            b1 = utf8.charCodeAt(i);
+            if (b1 < 0x80) {	    // One byte code: 0x00 0x7F
+        	s += String.fromCharCode(b1);
+        	i++;
+            } else if((b1 >= 0xC0) && (b1 < 0xE0)) {	// Two byte code: 0x80 - 0x7FF
+        	b2 = utf8.charCodeAt(i + 1);
+        	s += String.fromCharCode(((b1 & 0x1F) << 6) | (b2 & 0x3F));
+        	i += 2;
+            } else {	    	    // Three byte code: 0x800 - 0xFFFF
+        	b2 = utf8.charCodeAt(i + 1);
+		b3 = utf8.charCodeAt(i + 2);
+        	s += String.fromCharCode(((b1 & 0xF) << 12) |
+		    	    	    	 ((b2 & 0x3F) << 6) |
+					 (b3 & 0x3F));
+        	i += 3;
+            }
+	}
+	return s;
+    }
+
+    /*	ENCODE_UTF8  --  Encode string as UTF8 only if it contains
+			 a character of 0x9D (Unicode OPERATING
+			 SYSTEM COMMAND) or a character greater
+			 than 0xFF.  This permits all strings
+			 consisting exclusively of 8 bit
+			 graphic characters to be encoded as
+			 themselves.  We choose 0x9D as the sentinel
+			 character as opposed to one of the more
+			 logical PRIVATE USE characters because 0x9D
+			 is not overloaded by the regrettable
+			 "Windows-1252" character set.  Now such characters
+			 don't belong in JavaScript strings, but you never
+			 know what somebody is going to paste into a
+			 text box, so this choice keeps Windows-encoded
+			 strings from bloating to UTF-8 encoding.  */
+			 
+    function encode_utf8(s) {
+    	var i, necessary = false;
+	
+	for (i = 0; i < s.length; i++) {
+	    if ((s.charCodeAt(i) == 0x9D) ||
+	    	(s.charCodeAt(i) > 0xFF)) {
+	    	necessary = true;
+		break;
+	    }
+	}
+	if (!necessary) {
+	    return s;
+	}
+	return String.fromCharCode(0x9D) + unicode_to_utf8(s);
+    }
+    
+    /*  DECODE_UTF8  --  Decode a string encoded with encode_utf8
+			 above.  If the string begins with the
+			 sentinel character 0x9D (OPERATING
+			 SYSTEM COMMAND), then we decode the
+			 balance as a UTF-8 stream.  Otherwise,
+			 the string is output unchanged, as
+			 it's guaranteed to contain only 8 bit
+			 characters excluding 0x9D.  */
+			 
+    function decode_utf8(s) {
+    	if ((s.length > 0) && (s.charCodeAt(0) == 0x9D)) {
+	    return utf8_to_unicode(s.substring(1));
+	}
+	return s;
+    }
+
+
+//#############################################################################
+//	Downloaded on April 26, 2006 from http://pajhome.org.uk/crypt/md5/md5.js
+//#############################################################################
+
+/*
+ * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message
+ * Digest Algorithm, as defined in RFC 1321.
+ * Version 2.1 Copyright (C) Paul Johnston 1999 - 2002.
+ * Other contributors: Greg Holt, Andrew Kepert, Ydnar, Lostinet
+ * Distributed under the BSD License
+ * See http://pajhome.org.uk/crypt/md5 for more info.
+ */
+
+/*
+ * Configurable variables. You may need to tweak these to be compatible with
+ * the server-side, but the defaults work in most cases.
+ */
+var hexcase = 0;  /* hex output format. 0 - lowercase; 1 - uppercase        */
+var b64pad  = ""; /* base-64 pad character. "=" for strict RFC compliance   */
+var chrsz   = 8;  /* bits per input character. 8 - ASCII; 16 - Unicode      */
+
+/*
+ * These are the functions you'll usually want to call
+ * They take string arguments and return either hex or base-64 encoded strings
+ */
+function hex_md5(s){ return binl2hex(core_md5(str2binl(s), s.length * chrsz));}
+function b64_md5(s){ return binl2b64(core_md5(str2binl(s), s.length * chrsz));}
+function str_md5(s){ return binl2str(core_md5(str2binl(s), s.length * chrsz));}
+function hex_hmac_md5(key, data) { return binl2hex(core_hmac_md5(key, data)); }
+function b64_hmac_md5(key, data) { return binl2b64(core_hmac_md5(key, data)); }
+function str_hmac_md5(key, data) { return binl2str(core_hmac_md5(key, data)); }
+
+/*
+ * Perform a simple self-test to see if the VM is working
+ */
+function md5_vm_test()
+{
+  return hex_md5("abc") == "900150983cd24fb0d6963f7d28e17f72";
+}
+
+/*
+ * Calculate the MD5 of an array of little-endian words, and a bit length
+ */
+function core_md5(x, len)
+{
+  /* append padding */
+  x[len >> 5] |= 0x80 << ((len) % 32);
+  x[(((len + 64) >>> 9) << 4) + 14] = len;
+
+  var a =  1732584193;
+  var b = -271733879;
+  var c = -1732584194;
+  var d =  271733878;
+
+  for(var i = 0; i < x.length; i += 16)
+  {
+    var olda = a;
+    var oldb = b;
+    var oldc = c;
+    var oldd = d;
+
+    a = md5_ff(a, b, c, d, x[i+ 0], 7 , -680876936);
+    d = md5_ff(d, a, b, c, x[i+ 1], 12, -389564586);
+    c = md5_ff(c, d, a, b, x[i+ 2], 17,  606105819);
+    b = md5_ff(b, c, d, a, x[i+ 3], 22, -1044525330);
+    a = md5_ff(a, b, c, d, x[i+ 4], 7 , -176418897);
+    d = md5_ff(d, a, b, c, x[i+ 5], 12,  1200080426);
+    c = md5_ff(c, d, a, b, x[i+ 6], 17, -1473231341);
+    b = md5_ff(b, c, d, a, x[i+ 7], 22, -45705983);
+    a = md5_ff(a, b, c, d, x[i+ 8], 7 ,  1770035416);
+    d = md5_ff(d, a, b, c, x[i+ 9], 12, -1958414417);
+    c = md5_ff(c, d, a, b, x[i+10], 17, -42063);
+    b = md5_ff(b, c, d, a, x[i+11], 22, -1990404162);
+    a = md5_ff(a, b, c, d, x[i+12], 7 ,  1804603682);
+    d = md5_ff(d, a, b, c, x[i+13], 12, -40341101);
+    c = md5_ff(c, d, a, b, x[i+14], 17, -1502002290);
+    b = md5_ff(b, c, d, a, x[i+15], 22,  1236535329);
+
+    a = md5_gg(a, b, c, d, x[i+ 1], 5 , -165796510);
+    d = md5_gg(d, a, b, c, x[i+ 6], 9 , -1069501632);
+    c = md5_gg(c, d, a, b, x[i+11], 14,  643717713);
+    b = md5_gg(b, c, d, a, x[i+ 0], 20, -373897302);
+    a = md5_gg(a, b, c, d, x[i+ 5], 5 , -701558691);
+    d = md5_gg(d, a, b, c, x[i+10], 9 ,  38016083);
+    c = md5_gg(c, d, a, b, x[i+15], 14, -660478335);
+    b = md5_gg(b, c, d, a, x[i+ 4], 20, -405537848);
+    a = md5_gg(a, b, c, d, x[i+ 9], 5 ,  568446438);
+    d = md5_gg(d, a, b, c, x[i+14], 9 , -1019803690);
+    c = md5_gg(c, d, a, b, x[i+ 3], 14, -187363961);
+    b = md5_gg(b, c, d, a, x[i+ 8], 20,  1163531501);
+    a = md5_gg(a, b, c, d, x[i+13], 5 , -1444681467);
+    d = md5_gg(d, a, b, c, x[i+ 2], 9 , -51403784);
+    c = md5_gg(c, d, a, b, x[i+ 7], 14,  1735328473);
+    b = md5_gg(b, c, d, a, x[i+12], 20, -1926607734);
+
+    a = md5_hh(a, b, c, d, x[i+ 5], 4 , -378558);
+    d = md5_hh(d, a, b, c, x[i+ 8], 11, -2022574463);
+    c = md5_hh(c, d, a, b, x[i+11], 16,  1839030562);
+    b = md5_hh(b, c, d, a, x[i+14], 23, -35309556);
+    a = md5_hh(a, b, c, d, x[i+ 1], 4 , -1530992060);
+    d = md5_hh(d, a, b, c, x[i+ 4], 11,  1272893353);
+    c = md5_hh(c, d, a, b, x[i+ 7], 16, -155497632);
+    b = md5_hh(b, c, d, a, x[i+10], 23, -1094730640);
+    a = md5_hh(a, b, c, d, x[i+13], 4 ,  681279174);
+    d = md5_hh(d, a, b, c, x[i+ 0], 11, -358537222);
+    c = md5_hh(c, d, a, b, x[i+ 3], 16, -722521979);
+    b = md5_hh(b, c, d, a, x[i+ 6], 23,  76029189);
+    a = md5_hh(a, b, c, d, x[i+ 9], 4 , -640364487);
+    d = md5_hh(d, a, b, c, x[i+12], 11, -421815835);
+    c = md5_hh(c, d, a, b, x[i+15], 16,  530742520);
+    b = md5_hh(b, c, d, a, x[i+ 2], 23, -995338651);
+
+    a = md5_ii(a, b, c, d, x[i+ 0], 6 , -198630844);
+    d = md5_ii(d, a, b, c, x[i+ 7], 10,  1126891415);
+    c = md5_ii(c, d, a, b, x[i+14], 15, -1416354905);
+    b = md5_ii(b, c, d, a, x[i+ 5], 21, -57434055);
+    a = md5_ii(a, b, c, d, x[i+12], 6 ,  1700485571);
+    d = md5_ii(d, a, b, c, x[i+ 3], 10, -1894986606);
+    c = md5_ii(c, d, a, b, x[i+10], 15, -1051523);
+    b = md5_ii(b, c, d, a, x[i+ 1], 21, -2054922799);
+    a = md5_ii(a, b, c, d, x[i+ 8], 6 ,  1873313359);
+    d = md5_ii(d, a, b, c, x[i+15], 10, -30611744);
+    c = md5_ii(c, d, a, b, x[i+ 6], 15, -1560198380);
+    b = md5_ii(b, c, d, a, x[i+13], 21,  1309151649);
+    a = md5_ii(a, b, c, d, x[i+ 4], 6 , -145523070);
+    d = md5_ii(d, a, b, c, x[i+11], 10, -1120210379);
+    c = md5_ii(c, d, a, b, x[i+ 2], 15,  718787259);
+    b = md5_ii(b, c, d, a, x[i+ 9], 21, -343485551);
+
+    a = safe_add(a, olda);
+    b = safe_add(b, oldb);
+    c = safe_add(c, oldc);
+    d = safe_add(d, oldd);
+  }
+  return Array(a, b, c, d);
+
+}
+
+/*
+ * These functions implement the four basic operations the algorithm uses.
+ */
+function md5_cmn(q, a, b, x, s, t)
+{
+  return safe_add(bit_rol(safe_add(safe_add(a, q), safe_add(x, t)), s),b);
+}
+function md5_ff(a, b, c, d, x, s, t)
+{
+  return md5_cmn((b & c) | ((~b) & d), a, b, x, s, t);
+}
+function md5_gg(a, b, c, d, x, s, t)
+{
+  return md5_cmn((b & d) | (c & (~d)), a, b, x, s, t);
+}
+function md5_hh(a, b, c, d, x, s, t)
+{
+  return md5_cmn(b ^ c ^ d, a, b, x, s, t);
+}
+function md5_ii(a, b, c, d, x, s, t)
+{
+  return md5_cmn(c ^ (b | (~d)), a, b, x, s, t);
+}
+
+/*
+ * Calculate the HMAC-MD5, of a key and some data
+ */
+function core_hmac_md5(key, data)
+{
+  var bkey = str2binl(key);
+  if(bkey.length > 16) bkey = core_md5(bkey, key.length * chrsz);
+
+  var ipad = Array(16), opad = Array(16);
+  for(var i = 0; i < 16; i++)
+  {
+    ipad[i] = bkey[i] ^ 0x36363636;
+    opad[i] = bkey[i] ^ 0x5C5C5C5C;
+  }
+
+  var hash = core_md5(ipad.concat(str2binl(data)), 512 + data.length * chrsz);
+  return core_md5(opad.concat(hash), 512 + 128);
+}
+
+/*
+ * Add integers, wrapping at 2^32. This uses 16-bit operations internally
+ * to work around bugs in some JS interpreters.
+ */
+function safe_add(x, y)
+{
+  var lsw = (x & 0xFFFF) + (y & 0xFFFF);
+  var msw = (x >> 16) + (y >> 16) + (lsw >> 16);
+  return (msw << 16) | (lsw & 0xFFFF);
+}
+
+/*
+ * Bitwise rotate a 32-bit number to the left.
+ */
+function bit_rol(num, cnt)
+{
+  return (num << cnt) | (num >>> (32 - cnt));
+}
+
+/*
+ * Convert a string to an array of little-endian words
+ * If chrsz is ASCII, characters >255 have their hi-byte silently ignored.
+ */
+function str2binl(str)
+{
+  var bin = Array();
+  var mask = (1 << chrsz) - 1;
+  for(var i = 0; i < str.length * chrsz; i += chrsz)
+    bin[i>>5] |= (str.charCodeAt(i / chrsz) & mask) << (i%32);
+  return bin;
+}
+
+/*
+ * Convert an array of little-endian words to a string
+ */
+function binl2str(bin)
+{
+  var str = "";
+  var mask = (1 << chrsz) - 1;
+  for(var i = 0; i < bin.length * 32; i += chrsz)
+    str += String.fromCharCode((bin[i>>5] >>> (i % 32)) & mask);
+  return str;
+}
+
+/*
+ * Convert an array of little-endian words to a hex string.
+ */
+function binl2hex(binarray)
+{
+  var hex_tab = hexcase ? "0123456789ABCDEF" : "0123456789abcdef";
+  var str = "";
+  for(var i = 0; i < binarray.length * 4; i++)
+  {
+    str += hex_tab.charAt((binarray[i>>2] >> ((i%4)*8+4)) & 0xF) +
+           hex_tab.charAt((binarray[i>>2] >> ((i%4)*8  )) & 0xF);
+  }
+  return str;
+}
+
+/*
+ * Convert an array of little-endian words to a base-64 string
+ */
+function binl2b64(binarray)
+{
+  var tab = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
+  var str = "";
+  for(var i = 0; i < binarray.length * 4; i += 3)
+  {
+    var triplet = (((binarray[i   >> 2] >> 8 * ( i   %4)) & 0xFF) << 16)
+                | (((binarray[i+1 >> 2] >> 8 * ((i+1)%4)) & 0xFF) << 8 )
+                |  ((binarray[i+2 >> 2] >> 8 * ((i+2)%4)) & 0xFF);
+    for(var j = 0; j < 4; j++)
+    {
+      if(i * 8 + j * 6 > binarray.length * 32) str += b64pad;
+      else str += tab.charAt((triplet >> 6*(3-j)) & 0x3F);
+    }
+  }
+  return str;
+}
+
+
+//#############################################################################
+//#############################################################################
+//#############################################################################
+
+
+
+MochiKit.Base.update(Clipperz.Crypto.Base, {
+
+	'__repr__': function () {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'encryptUsingSecretKey': function (aKey, aMessage) {
+//Clipperz.Profile.start("Clipperz.Crypto.Base.encryptUsingSecretKey");
+		var result;
+		var plaintext;
+		var	header;
+		var	key;
+		
+		key = hexToByteArray(Clipperz.Crypto.Base.computeHashValue(aKey));
+
+		addEntropyTime();
+    	prng = new AESprng(keyFromEntropy());
+
+		plaintext = encode_utf8(aMessage);
+
+		header = Clipperz.Base.byteArrayToString(hexToByteArray(Clipperz.Crypto.Base.computeMD5HashValue(plaintext)));
+		
+		//  Add message length in bytes to header
+		i = plaintext.length;
+		header += String.fromCharCode(i >>> 24);
+		header += String.fromCharCode(i >>> 16);
+		header += String.fromCharCode(i >>> 8);
+		header += String.fromCharCode(i & 0xFF);
+
+    	//	The format of the actual message passed to rijndaelEncrypt
+	    //	is:
+	    //
+	    //	    Bytes   	Content
+		//		 0-15   	MD5 signature of plaintext
+		//		16-19   	Length of plaintext, big-endian order
+		//		20-end  	Plaintext
+		//    
+	    //	Note that this message will be padded with zero bytes
+	    //	to an integral number of AES blocks (blockSizeInBits / 8).
+	    //	This does not include the initial vector for CBC
+	    //	encryption, which is added internally by rijndaelEncrypt.
+		result = byteArrayToHex(rijndaelEncrypt(header + plaintext, key, "CBC"));
+
+    	delete prng;
+
+//Clipperz.Profile.stop("Clipperz.Crypto.Base.encryptUsingSecretKey");
+		return result;
+	},
+
+	//.............................................................................
+
+	'decryptUsingSecretKey': function (aKey, aMessage) {
+//Clipperz.Profile.start("Clipperz.Crypto.Base.decryptUsingSecretKey");
+		var	key;
+		var decryptedText;
+		var	textLength;
+		var	header;
+		var	headerDigest;
+		var plaintext;
+		var i;
+		
+		key = hexToByteArray(Clipperz.Crypto.Base.computeHashValue(aKey));
+
+		decryptedText = rijndaelDecrypt(hexToByteArray(aMessage), key, "CBC");
+
+		header = decryptedText.slice(0, 20);
+		decryptedText = decryptedText.slice(20);
+
+		headerDigest = byteArrayToHex(header.slice(0,16));
+		textLength = (header[16] << 24) | (header[17] << 16) | (header[18] << 8) | header[19];
+
+		if ((textLength < 0) || (textLength > decryptedText.length)) {
+//			jslog.warning("Message (length " + decryptedText.length + ") truncated.  " + textLength + " characters expected.");
+			//	Try to sauve qui peut by setting length to entire message
+			textLength = decryptedText.length;
+		}
+
+		plainText = "";
+
+		for (i=0; i<textLength; i++) {
+			plainText += String.fromCharCode(decryptedText[i]);
+		}
+
+		if (Clipperz.Crypto.Base.computeMD5HashValue(plainText) != headerDigest) {
+//			jslog.warning("Message corrupted.  Checksum of decrypted message does not match.");
+			throw Clipperz.Crypto.Base.exception.CorruptedMessage;
+//			throw new Error("Message corrupted.  Checksum of decrypted message does not match. Parsed result: " + decode_utf8(plainText));
+		}
+
+		//  That's it; plug plaintext into the result field
+
+		result = decode_utf8(plainText);
+		
+//Clipperz.Profile.stop("Clipperz.Crypto.Base.decryptUsingSecretKey");
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'computeHashValue': function (aMessage) {
+//Clipperz.Profile.start("Clipperz.Crypto.Base.computeHashValue");
+		var	result;
+
+		result = hex_sha256(aMessage);
+//Clipperz.Profile.stop("Clipperz.Crypto.Base.computeHashValue");
+
+		return result;
+	},
+
+	//.........................................................................
+	
+	'computeMD5HashValue': function (aMessage) {
+		var	result;
+//Clipperz.Profile.start("Clipperz.Crypto.Base.computeMD5HashValue");
+		result = hex_md5(aMessage);
+//Clipperz.Profile.stop("Clipperz.Crypto.Base.computeMD5HashValue");
+
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'generateRandomSeed': function () {
+//Clipperz.Profile.start("Clipperz.Crypto.Base.generateRandomSeed");
+		var	result;
+		var seed;
+		var prng;
+		var charA;
+		var i;
+
+		addEntropyTime();
+
+		seed = keyFromEntropy();
+		prng = new AESprng(seed);
+
+		result = "";
+		charA = ("A").charCodeAt(0);
+
+		for (i = 0; i < 64; i++) {
+			result += String.fromCharCode(charA + prng.nextInt(25));
+		}
+		
+		delete prng;
+		
+		result = Clipperz.Crypto.Base.computeHashValue(result);
+		
+//Clipperz.Profile.stop("Clipperz.Crypto.Base.generateRandomSeed");
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'exception': {
+		'CorruptedMessage': new MochiKit.Base.NamedError("Clipperz.Crypto.Base.exception.CorruptedMessage") 
+	},
+
+	//.........................................................................
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/Crypto/BigInt.js b/frontend/beta/js/Clipperz/Crypto/BigInt.js
new file mode 100644
index 0000000..d4d05d2
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/BigInt.js
@@ -0,0 +1,1760 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.Crypto) == 'undefined') { Clipperz.Crypto = {}; }
+
+//#############################################################################
+//	Downloaded on March 05, 2007 from http://www.leemon.com/crypto/BigInt.js
+//#############################################################################
+
+
+////////////////////////////////////////////////////////////////////////////////////////
+// Big Integer Library v. 5.0
+// Created 2000, last modified 2006
+// Leemon Baird
+// www.leemon.com
+//
+// This file is public domain.   You can use it for any purpose without restriction.
+// I do not guarantee that it is correct, so use it at your own risk.  If you use 
+// it for something interesting, I'd appreciate hearing about it.  If you find 
+// any bugs or make any improvements, I'd appreciate hearing about those too.
+// It would also be nice if my name and address were left in the comments.
+// But none of that is required.
+//
+// This code defines a bigInt library for arbitrary-precision integers.
+// A bigInt is an array of integers storing the value in chunks of bpe bits, 
+// little endian (buff[0] is the least significant word).
+// Negative bigInts are stored two's complement.
+// Some functions assume their parameters have at least one leading zero element.
+// Functions with an underscore at the end of the name have unpredictable behavior in case of overflow, 
+// so the caller must make sure overflow won't happen.
+// For each function where a parameter is modified, that same 
+// variable must not be used as another argument too.
+// So, you cannot square x by doing multMod_(x,x,n).  
+// You must use squareMod_(x,n) instead, or do y=dup(x); multMod_(x,y,n).
+//
+// These functions are designed to avoid frequent dynamic memory allocation in the inner loop.
+// For most functions, if it needs a BigInt as a local variable it will actually use
+// a global, and will only allocate to it when it's not the right size.  This ensures
+// that when a function is called repeatedly with same-sized parameters, it only allocates
+// memory on the first call.
+//
+// Note that for cryptographic purposes, the calls to Math.random() must 
+// be replaced with calls to a better pseudorandom number generator.
+//
+// In the following, "bigInt" means a bigInt with at least one leading zero element,
+// and "integer" means a nonnegative integer less than radix.  In some cases, integer 
+// can be negative.  Negative bigInts are 2s complement.
+// 
+// The following functions do not modify their inputs, but dynamically allocate memory every time they are called:
+// 
+// function bigInt2str(x,base)     //convert a bigInt into a string in a given base, from base 2 up to base 95
+// function dup(x)                 //returns a copy of bigInt x
+// function findPrimes(n)          //return array of all primes less than integer n
+// function int2bigInt(t,n,m)      //convert integer t to a bigInt with at least n bits and m array elements
+// function int2bigInt(s,b,n,m)    //convert string s in base b to a bigInt with at least n bits and m array elements
+// function trim(x,k)              //return a copy of x with exactly k leading zero elements
+//
+// The following functions do not modify their inputs, so there is never a problem with the result being too big:
+//
+// function bitSize(x)             //returns how many bits long the bigInt x is, not counting leading zeros
+// function equals(x,y)            //is the bigInt x equal to the bigint y?
+// function equalsInt(x,y)         //is bigint x equal to integer y?
+// function greater(x,y)           //is x>y?  (x and y are nonnegative bigInts)
+// function greaterShift(x,y,shift)//is (x <<(shift*bpe)) > y?
+// function isZero(x)              //is the bigInt x equal to zero?
+// function millerRabin(x,b)       //does one round of Miller-Rabin base integer b say that bigInt x is possibly prime (as opposed to definitely composite)?
+// function modInt(x,n)            //return x mod n for bigInt x and integer n.
+// function negative(x)            //is bigInt x negative?
+//
+// The following functions do not modify their inputs, but allocate memory and call functions with underscores
+//
+// function add(x,y)                //return (x+y) for bigInts x and y.  
+// function addInt(x,n)             //return (x+n) where x is a bigInt and n is an integer.
+// function expand(x,n)             //return a copy of x with at least n elements, adding leading zeros if needed
+// function inverseMod(x,n)         //return (x**(-1) mod n) for bigInts x and n.  If no inverse exists, it returns null
+// function mod(x,n)                //return a new bigInt equal to (x mod n) for bigInts x and n.
+// function mult(x,y)               //return x*y for bigInts x and y. This is faster when y<x.
+// function multMod(x,y,n)          //return (x*y mod n) for bigInts x,y,n.  For greater speed, let y<x.
+// function powMod(x,y,n)           //return (x**y mod n) where x,y,n are bigInts and ** is exponentiation.  0**0=1. Faster for odd n.
+// function randTruePrime(k)        //return a new, random, k-bit, true prime using Maurer's algorithm.
+// function sub(x,y)                //return (x-y) for bigInts x and y.  Negative answers will be 2s complement
+//
+// The following functions write a bigInt result to one of the parameters, but
+// the result is never bigger than the original, so there can't be overflow problems:
+//
+// function divInt_(x,n)            //do x=floor(x/n) for bigInt x and integer n, and return the remainder
+// function GCD_(x,y)               //set x to the greatest common divisor of bigInts x and y, (y is destroyed).
+// function halve_(x)               //do x=floor(|x|/2)*sgn(x) for bigInt x in 2's complement
+// function mod_(x,n)               //do x=x mod n for bigInts x and n.
+// function rightShift_(x,n)        //right shift bigInt x by n bits.  0 <= n < bpe.
+//
+// The following functions write a bigInt result to one of the parameters.  The caller is responsible for
+// ensuring it is large enough to hold the result.
+// 
+// function addInt_(x,n)            //do x=x+n where x is a bigInt and n is an integer
+// function add_(x,y)               //do x=x+y for bigInts x and y
+// function addShift_(x,y,ys)       //do x=x+(y<<(ys*bpe))
+// function copy_(x,y)              //do x=y on bigInts x and y
+// function copyInt_(x,n)           //do x=n on bigInt x and integer n
+// function carry_(x)               //do carries and borrows so each element of the bigInt x fits in bpe bits.
+// function divide_(x,y,q,r)        //divide_ x by y giving quotient q and remainder r
+// function eGCD_(x,y,d,a,b)        //sets a,b,d to positive big integers such that d = GCD_(x,y) = a*x-b*y
+// function inverseMod_(x,n)        //do x=x**(-1) mod n, for bigInts x and n. Returns 1 (0) if inverse does (doesn't) exist
+// function inverseModInt_(x,n)     //return x**(-1) mod n, for integers x and n.  Return 0 if there is no inverse
+// function leftShift_(x,n)         //left shift bigInt x by n bits.  n<bpe.
+// function linComb_(x,y,a,b)       //do x=a*x+b*y for bigInts x and y and integers a and b
+// function linCombShift_(x,y,b,ys) //do x=x+b*(y<<(ys*bpe)) for bigInts x and y, and integers b and ys
+// function mont_(x,y,n,np)         //Montgomery multiplication (see comments where the function is defined)
+// function mult_(x,y)              //do x=x*y for bigInts x and y.
+// function multInt_(x,n)           //do x=x*n where x is a bigInt and n is an integer.
+// function multMod_(x,y,n)         //do x=x*y  mod n for bigInts x,y,n.
+// function powMod_(x,y,n)          //do x=x**y mod n, where x,y,n are bigInts (n is odd) and ** is exponentiation.  0**0=1.
+// function randBigInt_(b,n,s)      //do b = an n-bit random BigInt. if s=1, then nth bit (most significant bit) is set to 1. n>=1.
+// function randTruePrime_(ans,k)   //do ans = a random k-bit true random prime (not just probable prime) with 1 in the msb.
+// function squareMod_(x,n)         //do x=x*x  mod n for bigInts x,n
+// function sub_(x,y)               //do x=x-y for bigInts x and y. Negative answers will be 2s complement.
+// function subShift_(x,y,ys)       //do x=x-(y<<(ys*bpe)). Negative answers will be 2s complement.
+//
+// The following functions are based on algorithms from the _Handbook of Applied Cryptography_
+//    powMod_()           = algorithm 14.94, Montgomery exponentiation
+//    eGCD_,inverseMod_() = algorithm 14.61, Binary extended GCD_
+//    GCD_()              = algorothm 14.57, Lehmer's algorithm
+//    mont_()             = algorithm 14.36, Montgomery multiplication
+//    divide_()           = algorithm 14.20  Multiple-precision division
+//    squareMod_()        = algorithm 14.16  Multiple-precision squaring
+//    randTruePrime_()    = algorithm  4.62, Maurer's algorithm
+//    millerRabin()       = algorithm  4.24, Miller-Rabin algorithm
+//
+// Profiling shows:
+//     randTruePrime_() spends:
+//         10% of its time in calls to powMod_()
+//         85% of its time in calls to millerRabin()
+//     millerRabin() spends:
+//         99% of its time in calls to powMod_()   (always with a base of 2)
+//     powMod_() spends:
+//         94% of its time in calls to mont_()  (almost always with x==y)
+//
+// This suggests there are several ways to speed up this library slightly:
+//     - convert powMod_ to use a Montgomery form of k-ary window (or maybe a Montgomery form of sliding window)
+//         -- this should especially focus on being fast when raising 2 to a power mod n
+//     - convert randTruePrime_() to use a minimum r of 1/3 instead of 1/2 with the appropriate change to the test
+//     - tune the parameters in randTruePrime_(), including c, m, and recLimit
+//     - speed up the single loop in mont_() that takes 95% of the runtime, perhaps by reducing checking
+//       within the loop when all the parameters are the same length.
+//
+// There are several ideas that look like they wouldn't help much at all:
+//     - replacing trial division in randTruePrime_() with a sieve (that speeds up something taking almost no time anyway)
+//     - increase bpe from 15 to 30 (that would help if we had a 32*32->64 multiplier, but not with JavaScript's 32*32->32)
+//     - speeding up mont_(x,y,n,np) when x==y by doing a non-modular, non-Montgomery square
+//       followed by a Montgomery reduction.  The intermediate answer will be twice as long as x, so that
+//       method would be slower.  This is unfortunate because the code currently spends almost all of its time
+//       doing mont_(x,x,...), both for randTruePrime_() and powMod_().  A faster method for Montgomery squaring
+//       would have a large impact on the speed of randTruePrime_() and powMod_().  HAC has a couple of poorly-worded
+//       sentences that seem to imply it's faster to do a non-modular square followed by a single
+//       Montgomery reduction, but that's obviously wrong.
+////////////////////////////////////////////////////////////////////////////////////////
+
+//globals
+bpe=0;         //bits stored per array element
+mask=0;        //AND this with an array element to chop it down to bpe bits
+radix=mask+1;  //equals 2^bpe.  A single 1 bit to the left of the last bit of mask.
+
+//the digits for converting to different bases
+digitsStr='0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz_=!@#$%^&*()[]{}|;:,.<>/?`~ \\\'\"+-';
+
+//initialize the global variables
+for (bpe=0; (1<<(bpe+1)) > (1<<bpe); bpe++);  //bpe=number of bits in the mantissa on this platform
+bpe>>=1;                   //bpe=number of bits in one element of the array representing the bigInt
+mask=(1<<bpe)-1;           //AND the mask with an integer to get its bpe least significant bits
+radix=mask+1;              //2^bpe.  a single 1 bit to the left of the first bit of mask
+one=int2bigInt(1,1,1);     //constant used in powMod_()
+
+//the following global variables are scratchpad memory to 
+//reduce dynamic memory allocation in the inner loop
+t=new Array(0);
+ss=t;       //used in mult_()
+s0=t;       //used in multMod_(), squareMod_() 
+s1=t;       //used in powMod_(), multMod_(), squareMod_() 
+s2=t;       //used in powMod_(), multMod_()
+s3=t;       //used in powMod_()
+s4=t; s5=t; //used in mod_()
+s6=t;       //used in bigInt2str()
+s7=t;       //used in powMod_()
+T=t;        //used in GCD_()
+sa=t;       //used in mont_()
+mr_x1=t; mr_r=t; mr_a=t;                                      //used in millerRabin()
+eg_v=t; eg_u=t; eg_A=t; eg_B=t; eg_C=t; eg_D=t;               //used in eGCD_(), inverseMod_()
+md_q1=t; md_q2=t; md_q3=t; md_r=t; md_r1=t; md_r2=t; md_tt=t; //used in mod_()
+
+primes=t; pows=t; s_i=t; s_i2=t; s_R=t; s_rm=t; s_q=t; s_n1=t; 
+  s_a=t; s_r2=t; s_n=t; s_b=t; s_d=t; s_x1=t; s_x2=t, s_aa=t; //used in randTruePrime_()
+
+////////////////////////////////////////////////////////////////////////////////////////
+
+//return array of all primes less than integer n
+function findPrimes(n) {
+  var i,s,p,ans;
+  s=new Array(n);
+  for (i=0;i<n;i++)
+    s[i]=0;
+  s[0]=2;
+  p=0;    //first p elements of s are primes, the rest are a sieve
+  for(;s[p]<n;) {                  //s[p] is the pth prime
+    for(i=s[p]*s[p]; i<n; i+=s[p]) //mark multiples of s[p]
+      s[i]=1;
+    p++;
+    s[p]=s[p-1]+1;
+    for(; s[p]<n && s[s[p]]; s[p]++); //find next prime (where s[p]==0)
+  }
+  ans=new Array(p);
+  for(i=0;i<p;i++)
+    ans[i]=s[i];
+  return ans;
+}
+
+//does a single round of Miller-Rabin base b consider x to be a possible prime?
+//x is a bigInt, and b is an integer
+function millerRabin(x,b) {
+  var i,j,k,s;
+
+  if (mr_x1.length!=x.length) {
+    mr_x1=dup(x);
+    mr_r=dup(x);
+    mr_a=dup(x);
+  }
+
+  copyInt_(mr_a,b);
+  copy_(mr_r,x);
+  copy_(mr_x1,x);
+
+  addInt_(mr_r,-1);
+  addInt_(mr_x1,-1);
+
+  //s=the highest power of two that divides mr_r
+  k=0;
+  for (i=0;i<mr_r.length;i++)
+    for (j=1;j<mask;j<<=1)
+      if (x[i] & j) {
+        s=(k<mr_r.length+bpe ? k : 0); 
+         i=mr_r.length;
+         j=mask;
+      } else
+        k++;
+
+  if (s)                
+    rightShift_(mr_r,s);
+
+  powMod_(mr_a,mr_r,x);
+
+  if (!equalsInt(mr_a,1) && !equals(mr_a,mr_x1)) {
+    j=1;
+    while (j<=s-1 && !equals(mr_a,mr_x1)) {
+      squareMod_(mr_a,x);
+      if (equalsInt(mr_a,1)) {
+        return 0;
+      }
+      j++;
+    }
+    if (!equals(mr_a,mr_x1)) {
+      return 0;
+    }
+  }
+  return 1;  
+}
+
+//returns how many bits long the bigInt is, not counting leading zeros.
+function bitSize(x) {
+  var j,z,w;
+  for (j=x.length-1; (x[j]==0) && (j>0); j--);
+  for (z=0,w=x[j]; w; (w>>=1),z++);
+  z+=bpe*j;
+  return z;
+}
+
+//return a copy of x with at least n elements, adding leading zeros if needed
+function expand(x,n) {
+  var ans=int2bigInt(0,(x.length>n ? x.length : n)*bpe,0);
+  copy_(ans,x);
+  return ans;
+}
+
+//return a k-bit true random prime using Maurer's algorithm.
+function randTruePrime(k) {
+  var ans=int2bigInt(0,k,0);
+  randTruePrime_(ans,k);
+  return trim(ans,1);
+}
+
+//return a new bigInt equal to (x mod n) for bigInts x and n.
+function mod(x,n) {
+  var ans=dup(x);
+  mod_(ans,n);
+  return trim(ans,1);
+}
+
+//return (x+n) where x is a bigInt and n is an integer.
+function addInt(x,n) {
+  var ans=expand(x,x.length+1);
+  addInt_(ans,n);
+  return trim(ans,1);
+}
+
+//return x*y for bigInts x and y. This is faster when y<x.
+function mult(x,y) {
+  var ans=expand(x,x.length+y.length);
+  mult_(ans,y);
+  return trim(ans,1);
+}
+
+//return (x**y mod n) where x,y,n are bigInts and ** is exponentiation.  0**0=1. Faster for odd n.
+function powMod(x,y,n) {
+  var ans=expand(x,n.length);  
+  powMod_(ans,trim(y,2),trim(n,2),0);  //this should work without the trim, but doesn't
+  return trim(ans,1);
+}
+
+//return (x-y) for bigInts x and y.  Negative answers will be 2s complement
+function sub(x,y) {
+  var ans=expand(x,(x.length>y.length ? x.length+1 : y.length+1)); 
+  sub_(ans,y);
+  return trim(ans,1);
+}
+
+//return (x+y) for bigInts x and y.  
+function add(x,y) {
+  var ans=expand(x,(x.length>y.length ? x.length+1 : y.length+1)); 
+  add_(ans,y);
+  return trim(ans,1);
+}
+
+//return (x**(-1) mod n) for bigInts x and n.  If no inverse exists, it returns null
+function inverseMod(x,n) {
+  var ans=expand(x,n.length); 
+  var s;
+  s=inverseMod_(ans,n);
+  return s ? trim(ans,1) : null;
+}
+
+//return (x*y mod n) for bigInts x,y,n.  For greater speed, let y<x.
+function multMod(x,y,n) {
+  var ans=expand(x,n.length);
+  multMod_(ans,y,n);
+  return trim(ans,1);
+}
+
+//generate a k-bit true random prime using Maurer's algorithm,
+//and put it into ans.  The bigInt ans must be large enough to hold it.
+function randTruePrime_(ans,k) {
+  var c,m,pm,dd,j,r,B,divisible,z,zz,recSize;
+
+  if (primes.length==0)
+    primes=findPrimes(30000);  //check for divisibility by primes <=30000
+
+  if (pows.length==0) {
+    pows=new Array(512);
+    for (j=0;j<512;j++) {
+      pows[j]=Math.pow(2,j/511.-1.);
+    }
+  }
+
+  //c and m should be tuned for a particular machine and value of k, to maximize speed
+  //this was:   c=primes[primes.length-1]/k/k;  //check using all the small primes.  (c=0.1 in HAC)
+  c=0.1;  
+  m=20;   //generate this k-bit number by first recursively generating a number that has between k/2 and k-m bits
+  recLimit=20; /*must be at least 2 (was 29)*/   //stop recursion when k <=recLimit
+
+  if (s_i2.length!=ans.length) {
+    s_i2=dup(ans);
+    s_R =dup(ans);
+    s_n1=dup(ans);
+    s_r2=dup(ans);
+    s_d =dup(ans);
+    s_x1=dup(ans);
+    s_x2=dup(ans);
+    s_b =dup(ans);
+    s_n =dup(ans);
+    s_i =dup(ans);
+    s_rm=dup(ans);
+    s_q =dup(ans);
+    s_a =dup(ans);
+    s_aa=dup(ans);
+  }
+
+  if (k <= recLimit) {  //generate small random primes by trial division up to its square root
+    pm=(1<<((k+2)>>1))-1; //pm is binary number with all ones, just over sqrt(2^k)
+    copyInt_(ans,0);
+    for (dd=1;dd;) {
+      dd=0;
+      ans[0]= 1 | (1<<(k-1)) | Math.floor(Math.random()*(1<<k));  //random, k-bit, odd integer, with msb 1
+      for (j=1;(j<primes.length) && ((primes[j]&pm)==primes[j]);j++) { //trial division by all primes 3...sqrt(2^k)
+        if (0==(ans[0]%primes[j])) {
+          dd=1;
+          break;
+        }
+      }
+    }
+    carry_(ans);
+    return;
+  }
+
+  B=c*k*k;    //try small primes up to B (or all the primes[] array if the largest is less than B).
+  if (k>2*m)  //generate this k-bit number by first recursively generating a number that has between k/2 and k-m bits
+    for (r=1; k-k*r<=m; )
+      r=pows[Math.floor(Math.random()*512)];   //r=Math.pow(2,Math.random()-1);
+  else
+    r=.5;
+
+  //simulation suggests the more complex algorithm using r=.333 is only slightly faster.
+
+  recSize=Math.floor(r*k)+1;
+
+  randTruePrime_(s_q,recSize);
+  copyInt_(s_i2,0);
+  s_i2[Math.floor((k-2)/bpe)] |= (1<<((k-2)%bpe));   //s_i2=2^(k-2)
+  divide_(s_i2,s_q,s_i,s_rm);                         //s_i=floor((2^(k-1))/(2q))
+
+  z=bitSize(s_i);
+
+  for (;;) {
+    for (;;) {  //generate z-bit numbers until one falls in the range [0,s_i-1]
+      randBigInt_(s_R,z,0);
+      if (greater(s_i,s_R))
+        break;
+    }               //now s_R is in the range [0,s_i-1]
+    addInt_(s_R,1);  //now s_R is in the range [1,s_i]
+    add_(s_R,s_i);   //now s_R is in the range [s_i+1,2*s_i]
+
+    copy_(s_n,s_q);
+    mult_(s_n,s_R); 
+    multInt_(s_n,2);
+    addInt_(s_n,1);    //s_n=2*s_R*s_q+1
+    
+    copy_(s_r2,s_R);
+    multInt_(s_r2,2);  //s_r2=2*s_R
+
+    //check s_n for divisibility by small primes up to B
+    for (divisible=0,j=0; (j<primes.length) && (primes[j]<B); j++)
+      if (modInt(s_n,primes[j])==0) {
+        divisible=1;
+        break;
+      }      
+
+    if (!divisible)    //if it passes small primes check, then try a single Miller-Rabin base 2
+      if (!millerRabin(s_n,2)) //this line represents 75% of the total runtime for randTruePrime_ 
+        divisible=1;
+
+    if (!divisible) {  //if it passes that test, continue checking s_n
+      addInt_(s_n,-3);
+      for (j=s_n.length-1;(s_n[j]==0) && (j>0); j--);  //strip leading zeros
+      for (zz=0,w=s_n[j]; w; (w>>=1),zz++);
+      zz+=bpe*j;                             //zz=number of bits in s_n, ignoring leading zeros
+      for (;;) {  //generate z-bit numbers until one falls in the range [0,s_n-1]
+        randBigInt_(s_a,zz,0);
+        if (greater(s_n,s_a))
+          break;
+      }               //now s_a is in the range [0,s_n-1]
+      addInt_(s_n,3);  //now s_a is in the range [0,s_n-4]
+      addInt_(s_a,2);  //now s_a is in the range [2,s_n-2]
+      copy_(s_b,s_a);
+      copy_(s_n1,s_n);
+      addInt_(s_n1,-1);
+      powMod_(s_b,s_n1,s_n);   //s_b=s_a^(s_n-1) modulo s_n
+      addInt_(s_b,-1);
+      if (isZero(s_b)) {
+        copy_(s_b,s_a);
+        powMod_(s_b,s_r2,s_n);
+        addInt_(s_b,-1);
+        copy_(s_aa,s_n);
+        copy_(s_d,s_b);
+        GCD_(s_d,s_n);  //if s_b and s_n are relatively prime, then s_n is a prime
+        if (equalsInt(s_d,1)) {
+          copy_(ans,s_aa);
+          return;     //if we've made it this far, then s_n is absolutely guaranteed to be prime
+        }
+      }
+    }
+  }
+}
+
+//set b to an n-bit random BigInt.  If s=1, then nth bit (most significant bit) is set to 1.
+//array b must be big enough to hold the result. Must have n>=1
+function randBigInt_(b,n,s) {
+  var i,a;
+  for (i=0;i<b.length;i++)
+    b[i]=0;
+  a=Math.floor((n-1)/bpe)+1; //# array elements to hold the BigInt
+  for (i=0;i<a;i++) {
+    b[i]=Math.floor(Math.random()*(1<<(bpe-1)));
+  }
+  b[a-1] &= (2<<((n-1)%bpe))-1;
+  if (s)
+    b[a-1] |= (1<<((n-1)%bpe));
+}
+
+//set x to the greatest common divisor of x and y.
+//x,y are bigInts with the same number of elements.  y is destroyed.
+function GCD_(x,y) {
+  var i,xp,yp,A,B,C,D,q,sing;
+  if (T.length!=x.length)
+    T=dup(x);
+
+  sing=1;
+  while (sing) { //while y has nonzero elements other than y[0]
+    sing=0;
+    for (i=1;i<y.length;i++) //check if y has nonzero elements other than 0
+      if (y[i]) {
+        sing=1;
+        break;
+      }
+    if (!sing) break; //quit when y all zero elements except possibly y[0]
+
+    for (i=x.length;!x[i] && i>=0;i--);  //find most significant element of x
+    xp=x[i];
+    yp=y[i];
+    A=1; B=0; C=0; D=1;
+    while ((yp+C) && (yp+D)) {
+      q =Math.floor((xp+A)/(yp+C));
+      qp=Math.floor((xp+B)/(yp+D));
+      if (q!=qp)
+        break;
+      t= A-q*C;   A=C;   C=t;    //  do (A,B,xp, C,D,yp) = (C,D,yp, A,B,xp) - q*(0,0,0, C,D,yp)      
+      t= B-q*D;   B=D;   D=t;
+      t=xp-q*yp; xp=yp; yp=t;
+    }
+    if (B) {
+      copy_(T,x);
+      linComb_(x,y,A,B); //x=A*x+B*y
+      linComb_(y,T,D,C); //y=D*y+C*T
+    } else {
+      mod_(x,y);
+      copy_(T,x);
+      copy_(x,y);
+      copy_(y,T);
+    } 
+  }
+  if (y[0]==0)
+    return;
+  t=modInt(x,y[0]);
+  copyInt_(x,y[0]);
+  y[0]=t;
+  while (y[0]) {
+    x[0]%=y[0];
+    t=x[0]; x[0]=y[0]; y[0]=t;
+  }
+}
+
+//do x=x**(-1) mod n, for bigInts x and n.
+//If no inverse exists, it sets x to zero and returns 0, else it returns 1.
+//The x array must be at least as large as the n array.
+function inverseMod_(x,n) {
+  var k=1+2*Math.max(x.length,n.length);
+
+  if(!(x[0]&1)  && !(n[0]&1)) {  //if both inputs are even, then inverse doesn't exist
+    copyInt_(x,0);
+    return 0;
+  }
+
+  if (eg_u.length!=k) {
+    eg_u=new Array(k);
+    eg_v=new Array(k);
+    eg_A=new Array(k);
+    eg_B=new Array(k);
+    eg_C=new Array(k);
+    eg_D=new Array(k);
+  }
+
+  copy_(eg_u,x);
+  copy_(eg_v,n);
+  copyInt_(eg_A,1);
+  copyInt_(eg_B,0);
+  copyInt_(eg_C,0);
+  copyInt_(eg_D,1);
+  for (;;) {
+    while(!(eg_u[0]&1)) {  //while eg_u is even
+      halve_(eg_u);
+      if (!(eg_A[0]&1) && !(eg_B[0]&1)) { //if eg_A==eg_B==0 mod 2
+        halve_(eg_A);
+        halve_(eg_B);      
+      } else {
+        add_(eg_A,n);  halve_(eg_A);
+        sub_(eg_B,x);  halve_(eg_B);
+      }
+    }
+
+    while (!(eg_v[0]&1)) {  //while eg_v is even
+      halve_(eg_v);
+      if (!(eg_C[0]&1) && !(eg_D[0]&1)) { //if eg_C==eg_D==0 mod 2
+        halve_(eg_C);
+        halve_(eg_D);      
+      } else {
+        add_(eg_C,n);  halve_(eg_C);
+        sub_(eg_D,x);  halve_(eg_D);
+      }
+    }
+
+    if (!greater(eg_v,eg_u)) { //eg_v <= eg_u
+      sub_(eg_u,eg_v);
+      sub_(eg_A,eg_C);
+      sub_(eg_B,eg_D);
+    } else {                   //eg_v > eg_u
+      sub_(eg_v,eg_u);
+      sub_(eg_C,eg_A);
+      sub_(eg_D,eg_B);
+    }
+  
+    if (equalsInt(eg_u,0)) {
+      if (negative(eg_C)) //make sure answer is nonnegative
+        add_(eg_C,n);
+      copy_(x,eg_C);
+
+      if (!equalsInt(eg_v,1)) { //if GCD_(x,n)!=1, then there is no inverse
+        copyInt_(x,0);
+        return 0;
+      }
+      return 1;
+    }
+  }
+}
+
+//return x**(-1) mod n, for integers x and n.  Return 0 if there is no inverse
+function inverseModInt_(x,n) {
+  var a=1,b=0,t;
+  for (;;) {
+    if (x==1) return a;
+    if (x==0) return 0;
+    b-=a*Math.floor(n/x);
+    n%=x;
+
+    if (n==1) return b; //to avoid negatives, change this b to n-b, and each -= to +=
+    if (n==0) return 0;
+    a-=b*Math.floor(x/n);
+    x%=n;
+  }
+}
+
+//Given positive bigInts x and y, change the bigints v, a, and b to positive bigInts such that:
+//     v = GCD_(x,y) = a*x-b*y
+//The bigInts v, a, b, must have exactly as many elements as the larger of x and y.
+function eGCD_(x,y,v,a,b) {
+  var g=0;
+  var k=Math.max(x.length,y.length);
+  if (eg_u.length!=k) {
+    eg_u=new Array(k);
+    eg_A=new Array(k);
+    eg_B=new Array(k);
+    eg_C=new Array(k);
+    eg_D=new Array(k);
+  }
+  while(!(x[0]&1)  && !(y[0]&1)) {  //while x and y both even
+    halve_(x);
+    halve_(y);
+    g++;
+  }
+  copy_(eg_u,x);
+  copy_(v,y);
+  copyInt_(eg_A,1);
+  copyInt_(eg_B,0);
+  copyInt_(eg_C,0);
+  copyInt_(eg_D,1);
+  for (;;) {
+    while(!(eg_u[0]&1)) {  //while u is even
+      halve_(eg_u);
+      if (!(eg_A[0]&1) && !(eg_B[0]&1)) { //if A==B==0 mod 2
+        halve_(eg_A);
+        halve_(eg_B);      
+      } else {
+        add_(eg_A,y);  halve_(eg_A);
+        sub_(eg_B,x);  halve_(eg_B);
+      }
+    }
+
+    while (!(v[0]&1)) {  //while v is even
+      halve_(v);
+      if (!(eg_C[0]&1) && !(eg_D[0]&1)) { //if C==D==0 mod 2
+        halve_(eg_C);
+        halve_(eg_D);      
+      } else {
+        add_(eg_C,y);  halve_(eg_C);
+        sub_(eg_D,x);  halve_(eg_D);
+      }
+    }
+
+    if (!greater(v,eg_u)) { //v<=u
+      sub_(eg_u,v);
+      sub_(eg_A,eg_C);
+      sub_(eg_B,eg_D);
+    } else {                //v>u
+      sub_(v,eg_u);
+      sub_(eg_C,eg_A);
+      sub_(eg_D,eg_B);
+    }
+    if (equalsInt(eg_u,0)) {
+      if (negative(eg_C)) {   //make sure a (C)is nonnegative
+        add_(eg_C,y);
+        sub_(eg_D,x);
+      }
+      multInt_(eg_D,-1);  ///make sure b (D) is nonnegative
+      copy_(a,eg_C);
+      copy_(b,eg_D);
+      leftShift_(v,g);
+      return;
+    }
+  }
+}
+
+
+//is bigInt x negative?
+function negative(x) {
+  return ((x[x.length-1]>>(bpe-1))&1);
+}
+
+
+//is (x << (shift*bpe)) > y?
+//x and y are nonnegative bigInts
+//shift is a nonnegative integer
+function greaterShift(x,y,shift) {
+  var kx=x.length, ky=y.length;
+  k=((kx+shift)<ky) ? (kx+shift) : ky;
+  for (i=ky-1-shift; i<kx && i>=0; i++) 
+    if (x[i]>0)
+      return 1; //if there are nonzeros in x to the left of the first column of y, then x is bigger
+  for (i=kx-1+shift; i<ky; i++)
+    if (y[i]>0)
+      return 0; //if there are nonzeros in y to the left of the first column of x, then x is not bigger
+  for (i=k-1; i>=shift; i--)
+    if      (x[i-shift]>y[i]) return 1;
+    else if (x[i-shift]<y[i]) return 0;
+  return 0;
+}
+
+//is x > y? (x and y both nonnegative)
+function greater(x,y) {
+  var i;
+  var k=(x.length<y.length) ? x.length : y.length;
+
+  for (i=x.length;i<y.length;i++)
+    if (y[i])
+      return 0;  //y has more digits
+
+  for (i=y.length;i<x.length;i++)
+    if (x[i])
+      return 1;  //x has more digits
+
+  for (i=k-1;i>=0;i--)
+    if (x[i]>y[i])
+      return 1;
+    else if (x[i]<y[i])
+      return 0;
+  return 0;
+}
+
+//divide_ x by y giving quotient q and remainder r.  (q=floor(x/y),  r=x mod y).  All 4 are bigints.
+//x must have at least one leading zero element.
+//y must be nonzero.
+//q and r must be arrays that are exactly the same length as x.
+//the x array must have at least as many elements as y.
+function divide_(x,y,q,r) {
+  var kx, ky;
+  var i,j,y1,y2,c,a,b;
+  copy_(r,x);
+  for (ky=y.length;y[ky-1]==0;ky--); //kx,ky is number of elements in x,y, not including leading zeros
+  for (kx=r.length;r[kx-1]==0 && kx>ky;kx--);
+
+  //normalize: ensure the most significant element of y has its highest bit set  
+  b=y[ky-1];
+  for (a=0; b; a++)
+    b>>=1;  
+  a=bpe-a;  //a is how many bits to shift so that the high order bit of y is leftmost in its array element
+  leftShift_(y,a);  //multiply both by 1<<a now, then divide_ both by that at the end
+  leftShift_(r,a);
+
+  copyInt_(q,0);                // q=0
+  while (!greaterShift(y,r,kx-ky)) {  // while (leftShift_(y,kx-ky) <= r) {
+    subShift_(r,y,kx-ky);      //   r=r-leftShift_(y,kx-ky)
+    q[kx-ky]++;                  //   q[kx-ky]++;
+  }                              // }
+
+  for (i=kx-1; i>=ky; i--) {
+    if (r[i]==y[ky-1])
+      q[i-ky]=mask;
+    else
+      q[i-ky]=Math.floor((r[i]*radix+r[i-1])/y[ky-1]);	
+
+    //The following for(;;) loop is equivalent to the commented while loop, 
+    //except that the uncommented version avoids overflow.
+    //The commented loop comes from HAC, which assumes r[-1]==y[-1]==0
+    //  while (q[i-ky]*(y[ky-1]*radix+y[ky-2]) > r[i]*radix*radix+r[i-1]*radix+r[i-2])
+    //    q[i-ky]--;    
+    for (;;) {
+      y2=(ky>1 ? y[ky-2] : 0)*q[i-ky];
+      c=y2>>bpe;
+      y2=y2 & mask;
+      y1=c+q[i-ky]*y[ky-1];
+      c=y1>>bpe;
+      y1=y1 & mask;
+
+      if (c==r[i] ? y1==r[i-1] ? y2>(i>1 ? r[i-2] : 0) : y1>r[i-1] : c>r[i]) 
+        q[i-ky]--;
+      else
+        break;
+    }
+
+    linCombShift_(r,y,-q[i-ky],i-ky);    //r=r-q[i-ky]*leftShift_(y,i-ky)
+    if (negative(r)) {
+      addShift_(r,y,i-ky);         //r=r+leftShift_(y,i-ky)
+      q[i-ky]--;
+    }
+  }
+
+  rightShift_(y,a);  //undo the normalization step
+  rightShift_(r,a);  //undo the normalization step
+}
+
+//do carries and borrows so each element of the bigInt x fits in bpe bits.
+function carry_(x) {
+  var i,k,c,b;
+  k=x.length;
+  c=0;
+  for (i=0;i<k;i++) {
+    c+=x[i];
+    b=0;
+    if (c<0) {
+      b=-(c>>bpe);
+      c+=b*radix;
+    }
+    x[i]=c & mask;
+    c=(c>>bpe)-b;
+  }
+}
+
+//return x mod n for bigInt x and integer n.
+function modInt(x,n) {
+  var i,c=0;
+  for (i=x.length-1; i>=0; i--)
+    c=(c*radix+x[i])%n;
+  return c;
+}
+
+//convert the integer t into a bigInt with at least the given number of bits.
+//the returned array stores the bigInt in bpe-bit chunks, little endian (buff[0] is least significant word)
+//Pad the array with leading zeros so that it has at least minSize elements.
+//There will always be at least one leading 0 element.
+function int2bigInt(t,bits,minSize) {   
+  var i,k;
+  k=Math.ceil(bits/bpe)+1;
+  k=minSize>k ? minSize : k;
+  buff=new Array(k);
+  copyInt_(buff,t);
+  return buff;
+}
+
+//return the bigInt given a string representation in a given base.  
+//Pad the array with leading zeros so that it has at least minSize elements.
+//If base=-1, then it reads in a space-separated list of array elements in decimal.
+//The array will always have at least one leading zero, unless base=-1.
+function str2bigInt(s,base,minSize) {
+  var d, i, j, x, y, kk;
+  var k=s.length;
+  if (base==-1) { //comma-separated list of array elements in decimal
+    x=new Array(0);
+    for (;;) {
+      y=new Array(x.length+1);
+      for (i=0;i<x.length;i++)
+        y[i+1]=x[i];
+      y[0]=parseInt(s,10);
+      x=y;
+      d=s.indexOf(',',0);
+      if (d<1) 
+        break;
+      s=s.substring(d+1);
+      if (s.length==0)
+        break;
+    }
+    if (x.length<minSize) {
+      y=new Array(minSize);
+      copy_(y,x);
+      return y;
+    }
+    return x;
+  }
+
+  x=int2bigInt(0,base*k,0);
+  for (i=0;i<k;i++) {
+    d=digitsStr.indexOf(s.substring(i,i+1),0);
+    if (base<=36 && d>=36)  //convert lowercase to uppercase if base<=36
+      d-=26;
+    if (d<base && d>=0) {   //ignore illegal characters
+      multInt_(x,base);
+      addInt_(x,d);
+    }
+  }
+
+  for (k=x.length;k>0 && !x[k-1];k--); //strip off leading zeros
+  k=minSize>k+1 ? minSize : k+1;
+  y=new Array(k);
+  kk=k<x.length ? k : x.length;
+  for (i=0;i<kk;i++)
+    y[i]=x[i];
+  for (;i<k;i++)
+    y[i]=0;
+  return y;
+}
+
+//is bigint x equal to integer y?
+//y must have less than bpe bits
+function equalsInt(x,y) {
+  var i;
+  if (x[0]!=y)
+    return 0;
+  for (i=1;i<x.length;i++)
+    if (x[i])
+      return 0;
+  return 1;
+}
+
+//are bigints x and y equal?
+//this works even if x and y are different lengths and have arbitrarily many leading zeros
+function equals(x,y) {
+  var i;
+  var k=x.length<y.length ? x.length : y.length;
+  for (i=0;i<k;i++)
+    if (x[i]!=y[i])
+      return 0;
+  if (x.length>y.length) {
+    for (;i<x.length;i++)
+      if (x[i])
+        return 0;
+  } else {
+    for (;i<y.length;i++)
+      if (y[i])
+        return 0;
+  }
+  return 1;
+}
+
+//is the bigInt x equal to zero?
+function isZero(x) {
+  var i;
+  for (i=0;i<x.length;i++)
+    if (x[i])
+      return 0;
+  return 1;
+}
+
+//convert a bigInt into a string in a given base, from base 2 up to base 95.
+//Base -1 prints the contents of the array representing the number.
+function bigInt2str(x,base) {
+  var i,t,s="";
+
+  if (s6.length!=x.length) 
+    s6=dup(x);
+  else
+    copy_(s6,x);
+
+  if (base==-1) { //return the list of array contents
+    for (i=x.length-1;i>0;i--)
+      s+=x[i]+',';
+    s+=x[0];
+  }
+  else { //return it in the given base
+    while (!isZero(s6)) {
+      t=divInt_(s6,base);  //t=s6 % base; s6=floor(s6/base);
+      s=digitsStr.substring(t,t+1)+s;
+    }
+  }
+  if (s.length==0)
+    s="0";
+  return s;
+}
+
+//returns a duplicate of bigInt x
+function dup(x) {
+  var i;
+  buff=new Array(x.length);
+  copy_(buff,x);
+  return buff;
+}
+
+//do x=y on bigInts x and y.  x must be an array at least as big as y (not counting the leading zeros in y).
+function copy_(x,y) {
+  var i;
+  var k=x.length<y.length ? x.length : y.length;
+  for (i=0;i<k;i++)
+    x[i]=y[i];
+  for (i=k;i<x.length;i++)
+    x[i]=0;
+}
+
+//do x=y on bigInt x and integer y.  
+function copyInt_(x,n) {
+  var i,c;
+  for (c=n,i=0;i<x.length;i++) {
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x+n where x is a bigInt and n is an integer.
+//x must be large enough to hold the result.
+function addInt_(x,n) {
+  var i,k,c,b;
+  x[0]+=n;
+  k=x.length;
+  c=0;
+  for (i=0;i<k;i++) {
+    c+=x[i];
+    b=0;
+    if (c<0) {
+      b=-(c>>bpe);
+      c+=b*radix;
+    }
+    x[i]=c & mask;
+    c=(c>>bpe)-b;
+    if (!c) return; //stop carrying as soon as the carry_ is zero
+  }
+}
+
+//right shift bigInt x by n bits.  0 <= n < bpe.
+function rightShift_(x,n) {
+  var i;
+  var k=Math.floor(n/bpe);
+  if (k) {
+    for (i=0;i<x.length-k;i++) //right shift x by k elements
+      x[i]=x[i+k];
+    for (;i<x.length;i++)
+      x[i]=0;
+    n%=bpe;
+  }
+  for (i=0;i<x.length-1;i++) {
+    x[i]=mask & ((x[i+1]<<(bpe-n)) | (x[i]>>n));
+  }
+  x[i]>>=n;
+}
+
+//do x=floor(|x|/2)*sgn(x) for bigInt x in 2's complement
+function halve_(x) {
+  var i;
+  for (i=0;i<x.length-1;i++) {
+    x[i]=mask & ((x[i+1]<<(bpe-1)) | (x[i]>>1));
+  }
+  x[i]=(x[i]>>1) | (x[i] & (radix>>1));  //most significant bit stays the same
+}
+
+//left shift bigInt x by n bits.
+function leftShift_(x,n) {
+  var i;
+  var k=Math.floor(n/bpe);
+  if (k) {
+    for (i=x.length; i>=k; i--) //left shift x by k elements
+      x[i]=x[i-k];
+    for (;i>=0;i--)
+      x[i]=0;  
+    n%=bpe;
+  }
+  if (!n)
+    return;
+  for (i=x.length-1;i>0;i--) {
+    x[i]=mask & ((x[i]<<n) | (x[i-1]>>(bpe-n)));
+  }
+  x[i]=mask & (x[i]<<n);
+}
+
+//do x=x*n where x is a bigInt and n is an integer.
+//x must be large enough to hold the result.
+function multInt_(x,n) {
+  var i,k,c,b;
+  if (!n)
+    return;
+  k=x.length;
+  c=0;
+  for (i=0;i<k;i++) {
+    c+=x[i]*n;
+    b=0;
+    if (c<0) {
+      b=-(c>>bpe);
+      c+=b*radix;
+    }
+    x[i]=c & mask;
+    c=(c>>bpe)-b;
+  }
+}
+
+//do x=floor(x/n) for bigInt x and integer n, and return the remainder
+function divInt_(x,n) {
+  var i,r=0,s;
+  for (i=x.length-1;i>=0;i--) {
+    s=r*radix+x[i];
+    x[i]=Math.floor(s/n);
+    r=s%n;
+  }
+  return r;
+}
+
+//do the linear combination x=a*x+b*y for bigInts x and y, and integers a and b.
+//x must be large enough to hold the answer.
+function linComb_(x,y,a,b) {
+  var i,c,k,kk;
+  k=x.length<y.length ? x.length : y.length;
+  kk=x.length;
+  for (c=0,i=0;i<k;i++) {
+    c+=a*x[i]+b*y[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;i<kk;i++) {
+    c+=a*x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do the linear combination x=a*x+b*(y<<(ys*bpe)) for bigInts x and y, and integers a, b and ys.
+//x must be large enough to hold the answer.
+function linCombShift_(x,y,b,ys) {
+  var i,c,k,kk;
+  k=x.length<ys+y.length ? x.length : ys+y.length;
+  kk=x.length;
+  for (c=0,i=ys;i<k;i++) {
+    c+=x[i]+b*y[i-ys];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;c && i<kk;i++) {
+    c+=x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x+(y<<(ys*bpe)) for bigInts x and y, and integers a,b and ys.
+//x must be large enough to hold the answer.
+function addShift_(x,y,ys) {
+  var i,c,k,kk;
+  k=x.length<ys+y.length ? x.length : ys+y.length;
+  kk=x.length;
+  for (c=0,i=ys;i<k;i++) {
+    c+=x[i]+y[i-ys];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;c && i<kk;i++) {
+    c+=x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x-(y<<(ys*bpe)) for bigInts x and y, and integers a,b and ys.
+//x must be large enough to hold the answer.
+function subShift_(x,y,ys) {
+  var i,c,k,kk;
+  k=x.length<ys+y.length ? x.length : ys+y.length;
+  kk=x.length;
+  for (c=0,i=ys;i<k;i++) {
+    c+=x[i]-y[i-ys];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;c && i<kk;i++) {
+    c+=x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x-y for bigInts x and y.
+//x must be large enough to hold the answer.
+//negative answers will be 2s complement
+function sub_(x,y) {
+  var i,c,k,kk;
+  k=x.length<y.length ? x.length : y.length;
+  for (c=0,i=0;i<k;i++) {
+    c+=x[i]-y[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;c && i<x.length;i++) {
+    c+=x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x+y for bigInts x and y.
+//x must be large enough to hold the answer.
+function add_(x,y) {
+  var i,c,k,kk;
+  k=x.length<y.length ? x.length : y.length;
+  for (c=0,i=0;i<k;i++) {
+    c+=x[i]+y[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;c && i<x.length;i++) {
+    c+=x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x*y for bigInts x and y.  This is faster when y<x.
+function mult_(x,y) {
+  var i;
+  if (ss.length!=2*x.length)
+    ss=new Array(2*x.length);
+  copyInt_(ss,0);
+  for (i=0;i<y.length;i++)
+    if (y[i])
+      linCombShift_(ss,x,y[i],i);   //ss=1*ss+y[i]*(x<<(i*bpe))
+  copy_(x,ss);
+}
+
+//do x=x mod n for bigInts x and n.
+function mod_(x,n) {
+  if (s4.length!=x.length)
+    s4=dup(x);
+  else
+    copy_(s4,x);
+  if (s5.length!=x.length)
+    s5=dup(x);  
+  divide_(s4,n,s5,x);  //x = remainder of s4 / n
+}
+
+//do x=x*y mod n for bigInts x,y,n.
+//for greater speed, let y<x.
+function multMod_(x,y,n) {
+  var i;
+  if (s0.length!=2*x.length)
+    s0=new Array(2*x.length);
+  copyInt_(s0,0);
+  for (i=0;i<y.length;i++)
+    if (y[i])
+      linCombShift_(s0,x,y[i],i);   //s0=1*s0+y[i]*(x<<(i*bpe))
+  mod_(s0,n);
+  copy_(x,s0);
+}
+
+//do x=x*x mod n for bigInts x,n.
+function squareMod_(x,n) {
+  var i,j,d,c,kx,kn,k;
+  for (kx=x.length; kx>0 && !x[kx-1]; kx--);  //ignore leading zeros in x
+  k=kx>n.length ? 2*kx : 2*n.length; //k=# elements in the product, which is twice the elements in the larger of x and n
+  if (s0.length!=k) 
+    s0=new Array(k);
+  copyInt_(s0,0);
+  for (i=0;i<kx;i++) {
+    c=s0[2*i]+x[i]*x[i];
+    s0[2*i]=c & mask;
+    c>>=bpe;
+    for (j=i+1;j<kx;j++) {
+      c=s0[i+j]+2*x[i]*x[j]+c;
+      s0[i+j]=(c & mask);
+      c>>=bpe;
+    }
+    s0[i+kx]=c;
+  }
+  mod_(s0,n);
+  copy_(x,s0);
+}
+
+//return x with exactly k leading zero elements
+function trim(x,k) {
+  var i,y;
+  for (i=x.length; i>0 && !x[i-1]; i--);
+  y=new Array(i+k);
+  copy_(y,x);
+  return y;
+}
+
+//do x=x**y mod n, where x,y,n are bigInts and ** is exponentiation.  0**0=1.
+//this is faster when n is odd.  x usually needs to have as many elements as n.
+function powMod_(x,y,n) {
+  var k1,k2,kn,np;
+  if(s7.length!=n.length)
+    s7=dup(n);
+
+  //for even modulus, use a simple square-and-multiply algorithm,
+  //rather than using the more complex Montgomery algorithm.
+  if ((n[0]&1)==0) {
+    copy_(s7,x);
+    copyInt_(x,1);
+    while(!equalsInt(y,0)) {
+      if (y[0]&1)
+        multMod_(x,s7,n);
+      divInt_(y,2);
+      squareMod_(s7,n); 
+    }
+    return;
+  }
+
+  //calculate np from n for the Montgomery multiplications
+  copyInt_(s7,0);
+  for (kn=n.length;kn>0 && !n[kn-1];kn--);
+  np=radix-inverseModInt_(modInt(n,radix),radix);
+  s7[kn]=1;
+  multMod_(x ,s7,n);   // x = x * 2**(kn*bp) mod n
+
+  if (s3.length!=x.length)
+    s3=dup(x);
+  else
+    copy_(s3,x);
+
+  for (k1=y.length-1;k1>0 & !y[k1]; k1--);  //k1=first nonzero element of y
+  if (y[k1]==0) {  //anything to the 0th power is 1
+    copyInt_(x,1);
+    return;
+  }
+  for (k2=1<<(bpe-1);k2 && !(y[k1] & k2); k2>>=1);  //k2=position of first 1 bit in y[k1]
+  for (;;) {
+    if (!(k2>>=1)) {  //look at next bit of y
+      k1--;
+      if (k1<0) {
+        mont_(x,one,n,np);
+        return;
+      }
+      k2=1<<(bpe-1);
+    }    
+    mont_(x,x,n,np);
+
+    if (k2 & y[k1]) //if next bit is a 1
+      mont_(x,s3,n,np);
+  }
+}    
+
+//do x=x*y*Ri mod n for bigInts x,y,n, 
+//  where Ri = 2**(-kn*bpe) mod n, and kn is the 
+//  number of elements in the n array, not 
+//  counting leading zeros.  
+//x must be large enough to hold the answer.
+//It's OK if x and y are the same variable.
+//must have:
+//  x,y < n
+//  n is odd
+//  np = -(n^(-1)) mod radix
+function mont_(x,y,n,np) {
+  var i,j,c,ui,t;
+  var kn=n.length;
+  var ky=y.length;
+
+  if (sa.length!=kn)
+    sa=new Array(kn);
+
+  for (;kn>0 && n[kn-1]==0;kn--); //ignore leading zeros of n
+  //this function sometimes gives wrong answers when the next line is uncommented
+  //for (;ky>0 && y[ky-1]==0;ky--); //ignore leading zeros of y
+
+  copyInt_(sa,0);
+
+  //the following loop consumes 95% of the runtime for randTruePrime_() and powMod_() for large keys
+  for (i=0; i<kn; i++) {
+    t=sa[0]+x[i]*y[0];
+    ui=((t & mask) * np) & mask;  //the inner "& mask" is needed on Macintosh MSIE, but not windows MSIE
+    c=(t+ui*n[0]) >> bpe;
+    t=x[i];
+
+    //do sa=(sa+x[i]*y+ui*n)/b   where b=2**bpe
+    for (j=1;j<ky;j++) { 
+      c+=sa[j]+t*y[j]+ui*n[j];
+      sa[j-1]=c & mask;
+      c>>=bpe;
+    }    
+    for (;j<kn;j++) { 
+      c+=sa[j]+ui*n[j];
+      sa[j-1]=c & mask;
+      c>>=bpe;
+    }    
+    sa[j-1]=c & mask;
+  }
+
+  if (!greater(n,sa))
+    sub_(sa,n);
+  copy_(x,sa);
+}
+
+
+
+
+//#############################################################################
+//#############################################################################
+//#############################################################################
+//#############################################################################
+//#############################################################################
+//#############################################################################
+//#############################################################################
+
+
+
+
+
+//#############################################################################
+
+Clipperz.Crypto.BigInt = function (aValue, aBase) {
+	var	base;
+	var	value;
+	
+	if (typeof(aValue) == 'object') {
+		this._internalValue = aValue;
+	} else {
+		if (typeof(aValue) == 'undefined') {
+			value = "0";
+		} else {
+			value = aValue + "";
+		}
+	
+		if (typeof(aBase) == 'undefined') {
+			base = 10;
+		} else {
+			base = aBase;
+		}
+
+		this._internalValue = str2bigInt(value, base, 1, 1);
+	}
+	
+	return this;
+}
+
+//=============================================================================
+
+MochiKit.Base.update(Clipperz.Crypto.BigInt.prototype, {
+
+	'clone': function() {
+		return new Clipperz.Crypto.BigInt(this.internalValue());
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'internalValue': function () {
+		return this._internalValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'isBigInt': true,
+	
+	//-------------------------------------------------------------------------
+
+	'toString': function(aBase) {
+		return this.asString(aBase);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'asString': function (aBase, minimumLength) {
+		var	result;
+		var	base;
+
+		if (typeof(aBase) == 'undefined') {
+			base = 10;
+		} else {
+			base = aBase;
+		}
+		
+		result = bigInt2str(this.internalValue(), base).toLowerCase();
+
+		if ((typeof(minimumLength) != 'undefined') && (result.length < minimumLength)) {
+			var i, c;
+//MochiKit.Logging.logDebug(">>> FIXING BigInt.asString length issue")			
+			c = (minimumLength - result.length);
+			for (i=0; i<c; i++) {
+				result = '0' + result;
+			}
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'asByteArray': function() {
+		return new Clipperz.ByteArray("0x" + this.asString(16), 16);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'equals': function (aValue) {
+		var result;
+		
+		if (aValue.isBigInt) {
+		 	result = equals(this.internalValue(), aValue.internalValue());
+		} else if (typeof(aValue) == "number") {
+			result = equalsInt(this.internalValue(), aValue);
+		} else {
+			throw Clipperz.Crypt.BigInt.exception.UnknownType;
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'compare': function(aValue) {
+/*
+		var result;
+		var thisAsString;
+		var aValueAsString;
+		
+		thisAsString = this.asString(10);
+		aValueAsString = aValue.asString(10);
+		
+		result = MochiKit.Base.compare(thisAsString.length, aValueAsString.length);
+		if (result == 0) {
+			result = MochiKit.Base.compare(thisAsString, aValueAsString);
+		}
+		
+		return result;
+*/
+		var result;
+		
+		if (equals(this.internalValue(), aValue.internalValue())) {
+			result = 0;
+		} else if (greater(this.internalValue(), aValue.internalValue())) {
+			result = 1;
+		} else {
+			result = -1;
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'add': function (aValue) {
+		var result;
+
+		if (aValue.isBigInt) {
+		 	result = add(this.internalValue(), aValue.internalValue());
+		} else {
+			result = addInt(this.internalValue(), aValue);
+		}
+		
+		return new Clipperz.Crypto.BigInt(result);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'subtract': function (aValue) {
+		var result;
+		var value;
+
+		if (aValue.isBigInt) {
+			value = aValue;
+		} else {
+			value = new Clipperz.Crypto.BigInt(aValue);
+		}
+
+	 	result = sub(this.internalValue(), value.internalValue());
+
+		return new Clipperz.Crypto.BigInt(result);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'multiply': function (aValue, aModule) {
+		var result;
+		var value;
+
+		if (aValue.isBigInt) {
+			value = aValue;
+		} else {
+			value = new Clipperz.Crypto.BigInt(aValue);
+		}
+			
+		if (typeof(aModule) == 'undefined') {
+	 		result = mult(this.internalValue(), value.internalValue());
+		} else {
+			if (greater(this.internalValue(), value.internalValue())) {
+				result = multMod(this.internalValue(), value.internalValue(), aModule);
+			} else {
+				result = multMod(value.internalValue(), this.internalValue(), aModule);
+			}
+		}
+		
+		return new Clipperz.Crypto.BigInt(result);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'module': function (aModule) {
+		var	result;
+		var module;
+		
+		if (aModule.isBigInt) {
+			module = aModule;
+		} else {
+			module = new Clipperz.Crypto.BigInt(aModule);
+		}
+
+		result = mod(this.internalValue(), module.internalValue());
+		
+		return new Clipperz.Crypto.BigInt(result);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'powerModule': function(aValue, aModule) {
+		var	result;
+		var	value;
+		var module;
+		
+		if (aValue.isBigInt) {
+			value = aValue;
+		} else {
+			value = new Clipperz.Crypto.BigInt(aValue);
+		}
+
+		if (aModule.isBigInt) {
+			module = aModule;
+		} else {
+			module = new Clipperz.Crypto.BigInt(aModule);
+		}
+
+		if (aValue == -1) {
+			result = inverseMod(this.internalValue(), module.internalValue());
+		} else {
+			result = powMod(this.internalValue(), value.internalValue(), module.internalValue());
+		}
+		
+		return new Clipperz.Crypto.BigInt(result);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'xor': function(aValue) {
+		var result;
+		var	thisByteArray;
+		var aValueByteArray;
+		var xorArray;
+		
+		thisByteArray = new Clipperz.ByteArray("0x" + this.asString(16), 16);
+		aValueByteArray = new Clipperz.ByteArray("0x" + aValue.asString(16), 16);
+		xorArray = thisByteArray.xorMergeWithBlock(aValueByteArray, 'right');
+		result = new Clipperz.Crypto.BigInt(xorArray.toHexString(), 16);
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'shiftLeft': function(aNumberOfBitsToShift) {
+		var result;
+		var internalResult;
+		var wholeByteToShift;
+		var bitsLeftToShift;
+		
+		wholeByteToShift = Math.floor(aNumberOfBitsToShift / 8);
+		bitsLeftToShift = aNumberOfBitsToShift % 8;
+
+		if (wholeByteToShift == 0) {
+			internalResult = this.internalValue();
+		} else {
+			var hexValue;
+			var i,c;
+			
+			hexValue = this.asString(16);
+			c = wholeByteToShift;
+			for (i=0; i<c; i++) {
+				hexValue += "00";
+			}
+			internalResult = str2bigInt(hexValue, 16, 1, 1);
+		}
+
+		if (bitsLeftToShift > 0) {
+			leftShift_(internalResult, bitsLeftToShift);
+		}
+		result = new Clipperz.Crypto.BigInt(internalResult);
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'bitSize': function() {
+		return bitSize(this.internalValue());
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isBitSet': function(aBitPosition) {
+		var result;
+		
+		if (this.asByteArray().bitAtIndex(aBitPosition) == 0) {
+			result = false;
+		} else {
+			result = true;
+		};
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
+//#############################################################################
+
+Clipperz.Crypto.BigInt.randomPrime = function(aBitSize) {
+	return new Clipperz.Crypto.BigInt(randTruePrime(aBitSize));
+}
+
+//#############################################################################
+//#############################################################################
+
+Clipperz.Crypto.BigInt.ZERO = new Clipperz.Crypto.BigInt(0);
+
+//#############################################################################
+
+Clipperz.Crypto.BigInt.equals = function(a, b) {
+	return a.equals(b);
+}
+
+Clipperz.Crypto.BigInt.add = function(a, b) {
+	return a.add(b);
+}
+
+Clipperz.Crypto.BigInt.subtract = function(a, b) {
+	return a.subtract(b);
+}
+
+Clipperz.Crypto.BigInt.multiply = function(a, b, module) {
+	return a.multiply(b, module);
+}
+
+Clipperz.Crypto.BigInt.module = function(a, module) {
+	return a.module(module);
+}
+
+Clipperz.Crypto.BigInt.powerModule = function(a, b, module) {
+	return a.powerModule(b, module);
+}
+
+Clipperz.Crypto.BigInt.exception = {
+	UnknownType: new MochiKit.Base.NamedError("Clipperz.Crypto.BigInt.exception.UnknownType") 
+}
diff --git a/frontend/beta/js/Clipperz/Crypto/BigInt_scoped.js b/frontend/beta/js/Clipperz/Crypto/BigInt_scoped.js
new file mode 100644
index 0000000..e91e823
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/BigInt_scoped.js
@@ -0,0 +1,1649 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.Crypto) == 'undefined') { Clipperz.Crypto = {}; }
+
+if (typeof(Leemon) == 'undefined') { Leemon = {}; }
+if (typeof(Baird.Crypto) == 'undefined') { Baird.Crypto = {}; }
+if (typeof(Baird.Crypto.BigInt) == 'undefined') { Baird.Crypto.BigInt = {}; }
+
+
+//#############################################################################
+//	Downloaded on March 05, 2007 from http://www.leemon.com/crypto/BigInt.js
+//#############################################################################
+
+////////////////////////////////////////////////////////////////////////////////////////
+// Big Integer Library v. 5.0
+// Created 2000, last modified 2006
+// Leemon Baird
+// www.leemon.com
+//
+// This file is public domain.   You can use it for any purpose without restriction.
+// I do not guarantee that it is correct, so use it at your own risk.  If you use 
+// it for something interesting, I'd appreciate hearing about it.  If you find 
+// any bugs or make any improvements, I'd appreciate hearing about those too.
+// It would also be nice if my name and address were left in the comments.
+// But none of that is required.
+//
+// This code defines a bigInt library for arbitrary-precision integers.
+// A bigInt is an array of integers storing the value in chunks of bpe bits, 
+// little endian (buff[0] is the least significant word).
+// Negative bigInts are stored two's complement.
+// Some functions assume their parameters have at least one leading zero element.
+// Functions with an underscore at the end of the name have unpredictable behavior in case of overflow, 
+// so the caller must make sure overflow won't happen.
+// For each function where a parameter is modified, that same 
+// variable must not be used as another argument too.
+// So, you cannot square x by doing multMod_(x,x,n).  
+// You must use squareMod_(x,n) instead, or do y=dup(x); multMod_(x,y,n).
+//
+// These functions are designed to avoid frequent dynamic memory allocation in the inner loop.
+// For most functions, if it needs a BigInt as a local variable it will actually use
+// a global, and will only allocate to it when it's not the right size.  This ensures
+// that when a function is called repeatedly with same-sized parameters, it only allocates
+// memory on the first call.
+//
+// Note that for cryptographic purposes, the calls to Math.random() must 
+// be replaced with calls to a better pseudorandom number generator.
+//
+// In the following, "bigInt" means a bigInt with at least one leading zero element,
+// and "integer" means a nonnegative integer less than radix.  In some cases, integer 
+// can be negative.  Negative bigInts are 2s complement.
+// 
+// The following functions do not modify their inputs, but dynamically allocate memory every time they are called:
+// 
+// function bigInt2str(x,base)     //convert a bigInt into a string in a given base, from base 2 up to base 95
+// function dup(x)                 //returns a copy of bigInt x
+// function findPrimes(n)          //return array of all primes less than integer n
+// function int2bigInt(t,n,m)      //convert integer t to a bigInt with at least n bits and m array elements
+// function str2bigInt(s,b,n,m)    //convert string s in base b to a bigInt with at least n bits and m array elements
+// function trim(x,k)              //return a copy of x with exactly k leading zero elements
+//
+// The following functions do not modify their inputs, so there is never a problem with the result being too big:
+//
+// function bitSize(x)             //returns how many bits long the bigInt x is, not counting leading zeros
+// function equals(x,y)            //is the bigInt x equal to the bigint y?
+// function equalsInt(x,y)         //is bigint x equal to integer y?
+// function greater(x,y)           //is x>y?  (x and y are nonnegative bigInts)
+// function greaterShift(x,y,shift)//is (x <<(shift*bpe)) > y?
+// function isZero(x)              //is the bigInt x equal to zero?
+// function millerRabin(x,b)       //does one round of Miller-Rabin base integer b say that bigInt x is possibly prime (as opposed to definitely composite)?
+// function modInt(x,n)            //return x mod n for bigInt x and integer n.
+// function negative(x)            //is bigInt x negative?
+//
+// The following functions do not modify their inputs, but allocate memory and call functions with underscores
+//
+// function add(x,y)                //return (x+y) for bigInts x and y.  
+// function addInt(x,n)             //return (x+n) where x is a bigInt and n is an integer.
+// function expand(x,n)             //return a copy of x with at least n elements, adding leading zeros if needed
+// function inverseMod(x,n)         //return (x**(-1) mod n) for bigInts x and n.  If no inverse exists, it returns null
+// function mod(x,n)                //return a new bigInt equal to (x mod n) for bigInts x and n.
+// function mult(x,y)               //return x*y for bigInts x and y. This is faster when y<x.
+// function multMod(x,y,n)          //return (x*y mod n) for bigInts x,y,n.  For greater speed, let y<x.
+// function powMod(x,y,n)           //return (x**y mod n) where x,y,n are bigInts and ** is exponentiation.  0**0=1. Faster for odd n.
+// function randTruePrime(k)        //return a new, random, k-bit, true prime using Maurer's algorithm.
+// function sub(x,y)                //return (x-y) for bigInts x and y.  Negative answers will be 2s complement
+//
+// The following functions write a bigInt result to one of the parameters, but
+// the result is never bigger than the original, so there can't be overflow problems:
+//
+// function divInt_(x,n)            //do x=floor(x/n) for bigInt x and integer n, and return the remainder
+// function GCD_(x,y)               //set x to the greatest common divisor of bigInts x and y, (y is destroyed).
+// function halve_(x)               //do x=floor(|x|/2)*sgn(x) for bigInt x in 2's complement
+// function mod_(x,n)               //do x=x mod n for bigInts x and n.
+// function rightShift_(x,n)        //right shift bigInt x by n bits.  0 <= n < bpe.
+//
+// The following functions write a bigInt result to one of the parameters.  The caller is responsible for
+// ensuring it is large enough to hold the result.
+// 
+// function addInt_(x,n)            //do x=x+n where x is a bigInt and n is an integer
+// function add_(x,y)               //do x=x+y for bigInts x and y
+// function addShift_(x,y,ys)       //do x=x+(y<<(ys*bpe))
+// function copy_(x,y)              //do x=y on bigInts x and y
+// function copyInt_(x,n)           //do x=n on bigInt x and integer n
+// function carry_(x)               //do carries and borrows so each element of the bigInt x fits in bpe bits.
+// function divide_(x,y,q,r)        //divide_ x by y giving quotient q and remainder r
+// function eGCD_(x,y,d,a,b)        //sets a,b,d to positive big integers such that d = GCD_(x,y) = a*x-b*y
+// function inverseMod_(x,n)        //do x=x**(-1) mod n, for bigInts x and n. Returns 1 (0) if inverse does (doesn't) exist
+// function inverseModInt_(x,n)     //return x**(-1) mod n, for integers x and n.  Return 0 if there is no inverse
+// function leftShift_(x,n)         //left shift bigInt x by n bits.  n<bpe.
+// function linComb_(x,y,a,b)       //do x=a*x+b*y for bigInts x and y and integers a and b
+// function linCombShift_(x,y,b,ys) //do x=x+b*(y<<(ys*bpe)) for bigInts x and y, and integers b and ys
+// function mont_(x,y,n,np)         //Montgomery multiplication (see comments where the function is defined)
+// function mult_(x,y)              //do x=x*y for bigInts x and y.
+// function multInt_(x,n)           //do x=x*n where x is a bigInt and n is an integer.
+// function multMod_(x,y,n)         //do x=x*y  mod n for bigInts x,y,n.
+// function powMod_(x,y,n)          //do x=x**y mod n, where x,y,n are bigInts (n is odd) and ** is exponentiation.  0**0=1.
+// function randBigInt_(b,n,s)      //do b = an n-bit random BigInt. if s=1, then nth bit (most significant bit) is set to 1. n>=1.
+// function randTruePrime_(ans,k)   //do ans = a random k-bit true random prime (not just probable prime) with 1 in the msb.
+// function squareMod_(x,n)         //do x=x*x  mod n for bigInts x,n
+// function sub_(x,y)               //do x=x-y for bigInts x and y. Negative answers will be 2s complement.
+// function subShift_(x,y,ys)       //do x=x-(y<<(ys*bpe)). Negative answers will be 2s complement.
+//
+// The following functions are based on algorithms from the _Handbook of Applied Cryptography_
+//    powMod_()           = algorithm 14.94, Montgomery exponentiation
+//    eGCD_,inverseMod_() = algorithm 14.61, Binary extended GCD_
+//    GCD_()              = algorothm 14.57, Lehmer's algorithm
+//    mont_()             = algorithm 14.36, Montgomery multiplication
+//    divide_()           = algorithm 14.20  Multiple-precision division
+//    squareMod_()        = algorithm 14.16  Multiple-precision squaring
+//    randTruePrime_()    = algorithm  4.62, Maurer's algorithm
+//    millerRabin()       = algorithm  4.24, Miller-Rabin algorithm
+//
+// Profiling shows:
+//     randTruePrime_() spends:
+//         10% of its time in calls to powMod_()
+//         85% of its time in calls to millerRabin()
+//     millerRabin() spends:
+//         99% of its time in calls to powMod_()   (always with a base of 2)
+//     powMod_() spends:
+//         94% of its time in calls to mont_()  (almost always with x==y)
+//
+// This suggests there are several ways to speed up this library slightly:
+//     - convert powMod_ to use a Montgomery form of k-ary window (or maybe a Montgomery form of sliding window)
+//         -- this should especially focus on being fast when raising 2 to a power mod n
+//     - convert randTruePrime_() to use a minimum r of 1/3 instead of 1/2 with the appropriate change to the test
+//     - tune the parameters in randTruePrime_(), including c, m, and recLimit
+//     - speed up the single loop in mont_() that takes 95% of the runtime, perhaps by reducing checking
+//       within the loop when all the parameters are the same length.
+//
+// There are several ideas that look like they wouldn't help much at all:
+//     - replacing trial division in randTruePrime_() with a sieve (that speeds up something taking almost no time anyway)
+//     - increase bpe from 15 to 30 (that would help if we had a 32*32->64 multiplier, but not with JavaScript's 32*32->32)
+//     - speeding up mont_(x,y,n,np) when x==y by doing a non-modular, non-Montgomery square
+//       followed by a Montgomery reduction.  The intermediate answer will be twice as long as x, so that
+//       method would be slower.  This is unfortunate because the code currently spends almost all of its time
+//       doing mont_(x,x,...), both for randTruePrime_() and powMod_().  A faster method for Montgomery squaring
+//       would have a large impact on the speed of randTruePrime_() and powMod_().  HAC has a couple of poorly-worded
+//       sentences that seem to imply it's faster to do a non-modular square followed by a single
+//       Montgomery reduction, but that's obviously wrong.
+////////////////////////////////////////////////////////////////////////////////////////
+
+//
+//	The whole library has been moved into the Baird.Crypto.BigInt scope by Giulio Cesare Solaroli <giulio.cesare@clipperz.com>
+//
+Baird.Crypto.BigInt.VERSION = "5.0";
+Baird.Crypto.BigInt.NAME = "Baird.Crypto.BigInt";
+
+MochiKit.Base.update(Baird.Crypto.BigInt, {
+	//globals
+	'bpe': 0,								//bits stored per array element
+	'mask': 0,								//AND this with an array element to chop it down to bpe bits
+	'radix': Baird.Crypto.BigInt.mask + 1,	//equals 2^bpe.  A single 1 bit to the left of the last bit of mask.
+
+	//the digits for converting to different bases
+	'digitsStr': '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz_=!@#$%^&*()[]{}|;:,.<>/?`~ \\\'\"+-',
+
+//initialize the global variables
+for (bpe=0; (1<<(bpe+1)) > (1<<bpe); bpe++);  //bpe=number of bits in the mantissa on this platform
+bpe>>=1;                   //bpe=number of bits in one element of the array representing the bigInt
+mask=(1<<bpe)-1;           //AND the mask with an integer to get its bpe least significant bits
+radix=mask+1;              //2^bpe.  a single 1 bit to the left of the first bit of mask
+one=int2bigInt(1,1,1);     //constant used in powMod_()
+
+//the following global variables are scratchpad memory to 
+//reduce dynamic memory allocation in the inner loop
+t=new Array(0);
+ss=t;       //used in mult_()
+s0=t;       //used in multMod_(), squareMod_() 
+s1=t;       //used in powMod_(), multMod_(), squareMod_() 
+s2=t;       //used in powMod_(), multMod_()
+s3=t;       //used in powMod_()
+s4=t; s5=t; //used in mod_()
+s6=t;       //used in bigInt2str()
+s7=t;       //used in powMod_()
+T=t;        //used in GCD_()
+sa=t;       //used in mont_()
+mr_x1=t; mr_r=t; mr_a=t;                                      //used in millerRabin()
+eg_v=t; eg_u=t; eg_A=t; eg_B=t; eg_C=t; eg_D=t;               //used in eGCD_(), inverseMod_()
+md_q1=t; md_q2=t; md_q3=t; md_r=t; md_r1=t; md_r2=t; md_tt=t; //used in mod_()
+
+primes=t; pows=t; s_i=t; s_i2=t; s_R=t; s_rm=t; s_q=t; s_n1=t; 
+  s_a=t; s_r2=t; s_n=t; s_b=t; s_d=t; s_x1=t; s_x2=t, s_aa=t; //used in randTruePrime_()
+
+////////////////////////////////////////////////////////////////////////////////////////
+
+	//return array of all primes less than integer n
+	'findPrimes': function(n) {
+		var i,s,p,ans;
+		s=new Array(n);
+		for (i=0;i<n;i++)
+			s[i]=0;
+		s[0]=2;
+		p=0;    //first p elements of s are primes, the rest are a sieve
+		for(;s[p]<n;) {                  //s[p] is the pth prime
+			for(i=s[p]*s[p]; i<n; i+=s[p]) //mark multiples of s[p]
+				s[i]=1;
+			p++;
+			s[p]=s[p-1]+1;
+			for(; s[p]<n && s[s[p]]; s[p]++); //find next prime (where s[p]==0)
+		}
+		ans=new Array(p);
+		for(i=0;i<p;i++)
+			ans[i]=s[i];
+		return ans;
+	},
+
+	//does a single round of Miller-Rabin base b consider x to be a possible prime?
+	//x is a bigInt, and b is an integer
+	'millerRabin': function(x,b) {
+		var i,j,k,s;
+
+		if (mr_x1.length!=x.length) {
+			mr_x1=dup(x);
+			mr_r=dup(x);
+			mr_a=dup(x);
+		}
+
+		copyInt_(mr_a,b);
+		copy_(mr_r,x);
+		copy_(mr_x1,x);
+
+		addInt_(mr_r,-1);
+		addInt_(mr_x1,-1);
+
+		//s=the highest power of two that divides mr_r
+		k=0;
+		for (i=0;i<mr_r.length;i++)
+			for (j=1;j<mask;j<<=1)
+				if (x[i] & j) {
+					s=(k<mr_r.length+bpe ? k : 0); 
+					i=mr_r.length;
+					j=mask;
+				} else
+					k++;
+
+		if (s)                
+			rightShift_(mr_r,s);
+
+		powMod_(mr_a,mr_r,x);
+
+		if (!equalsInt(mr_a,1) && !equals(mr_a,mr_x1)) {
+			j=1;
+			while (j<=s-1 && !equals(mr_a,mr_x1)) {
+				squareMod_(mr_a,x);
+				if (equalsInt(mr_a,1)) {
+					return 0;
+				}
+				j++;
+			}
+			if (!equals(mr_a,mr_x1)) {
+				return 0;
+			}
+		}
+
+		return 1;  
+	},
+
+	//returns how many bits long the bigInt is, not counting leading zeros.
+	'bitSize': function(x) {
+		var j,z,w;
+		for (j=x.length-1; (x[j]==0) && (j>0); j--);
+		for (z=0,w=x[j]; w; (w>>=1),z++);
+		z+=bpe*j;
+		return z;
+	},
+
+	//return a copy of x with at least n elements, adding leading zeros if needed
+	'expand': function(x,n) {
+		var ans=int2bigInt(0,(x.length>n ? x.length : n)*bpe,0);
+		copy_(ans,x);
+		return ans;
+	},
+
+	//return a k-bit true random prime using Maurer's algorithm.
+	'randTruePrime': function(k) {
+		var ans=int2bigInt(0,k,0);
+		randTruePrime_(ans,k);
+		return trim(ans,1);
+	},
+
+	//return a new bigInt equal to (x mod n) for bigInts x and n.
+	'mod': function(x,n) {
+		var ans=dup(x);
+		mod_(ans,n);
+		return trim(ans,1);
+	},
+
+	//return (x+n) where x is a bigInt and n is an integer.
+	'addInt': function(x,n) {
+		var ans=expand(x,x.length+1);
+		addInt_(ans,n);
+		return trim(ans,1);
+	},
+
+	//return x*y for bigInts x and y. This is faster when y<x.
+	'mult': function(x,y) {
+		var ans=expand(x,x.length+y.length);
+		mult_(ans,y);
+		return trim(ans,1);
+	},
+
+	//return (x**y mod n) where x,y,n are bigInts and ** is exponentiation.  0**0=1. Faster for odd n.
+	'powMod': function(x,y,n) {
+		var ans=expand(x,n.length);  
+		powMod_(ans,trim(y,2),trim(n,2),0);  //this should work without the trim, but doesn't
+		return trim(ans,1);
+	},
+
+	//return (x-y) for bigInts x and y.  Negative answers will be 2s complement
+	'sub': function(x,y) {
+		var ans=expand(x,(x.length>y.length ? x.length+1 : y.length+1)); 
+		sub_(ans,y);
+		return trim(ans,1);
+	},
+
+	//return (x+y) for bigInts x and y.  
+	'add': function(x,y) {
+		var ans=expand(x,(x.length>y.length ? x.length+1 : y.length+1)); 
+		add_(ans,y);
+		return trim(ans,1);
+	},
+
+	//return (x**(-1) mod n) for bigInts x and n.  If no inverse exists, it returns null
+	'inverseMod': function(x,n) {
+		var ans=expand(x,n.length); 
+		var s;
+		s=inverseMod_(ans,n);
+		return s ? trim(ans,1) : null;
+	},
+
+	//return (x*y mod n) for bigInts x,y,n.  For greater speed, let y<x.
+	'multMod': function(x,y,n) {
+		var ans=expand(x,n.length);
+		multMod_(ans,y,n);
+		return trim(ans,1);
+	},
+
+	//generate a k-bit true random prime using Maurer's algorithm,
+	//and put it into ans.  The bigInt ans must be large enough to hold it.
+	'randTruePrime_': function(ans,k) {
+		var c,m,pm,dd,j,r,B,divisible,z,zz,recSize;
+
+		if (primes.length==0)
+			primes=findPrimes(30000);  //check for divisibility by primes <=30000
+
+		if (pows.length==0) {
+			pows=new Array(512);
+			for (j=0;j<512;j++) {
+				pows[j]=Math.pow(2,j/511.-1.);
+			}
+		}
+
+		//c and m should be tuned for a particular machine and value of k, to maximize speed
+		//this was:   c=primes[primes.length-1]/k/k;  //check using all the small primes.  (c=0.1 in HAC)
+		c=0.1;  
+		m=20;   //generate this k-bit number by first recursively generating a number that has between k/2 and k-m bits
+		recLimit=20; /*must be at least 2 (was 29)*/   //stop recursion when k <=recLimit
+
+		if (s_i2.length!=ans.length) {
+			s_i2=dup(ans);
+			s_R =dup(ans);
+			s_n1=dup(ans);
+			s_r2=dup(ans);
+			s_d =dup(ans);
+			s_x1=dup(ans);
+			s_x2=dup(ans);
+			s_b =dup(ans);
+			s_n =dup(ans);
+			s_i =dup(ans);
+			s_rm=dup(ans);
+			s_q =dup(ans);
+			s_a =dup(ans);
+			s_aa=dup(ans);
+		}
+
+		if (k <= recLimit) {  //generate small random primes by trial division up to its square root
+			pm=(1<<((k+2)>>1))-1; //pm is binary number with all ones, just over sqrt(2^k)
+			copyInt_(ans,0);
+			for (dd=1;dd;) {
+				dd=0;
+				ans[0]= 1 | (1<<(k-1)) | Math.floor(Math.random()*(1<<k));  //random, k-bit, odd integer, with msb 1
+				for (j=1;(j<primes.length) && ((primes[j]&pm)==primes[j]);j++) { //trial division by all primes 3...sqrt(2^k)
+					if (0==(ans[0]%primes[j])) {
+						dd=1;
+						break;
+					}
+				}
+			}
+			carry_(ans);
+			return;
+		}
+
+		B=c*k*k;    //try small primes up to B (or all the primes[] array if the largest is less than B).
+		if (k>2*m)  //generate this k-bit number by first recursively generating a number that has between k/2 and k-m bits
+			for (r=1; k-k*r<=m; )
+				r=pows[Math.floor(Math.random()*512)];   //r=Math.pow(2,Math.random()-1);
+		else
+			r=.5;
+
+		//simulation suggests the more complex algorithm using r=.333 is only slightly faster.
+
+		recSize=Math.floor(r*k)+1;
+
+		randTruePrime_(s_q,recSize);
+		copyInt_(s_i2,0);
+		s_i2[Math.floor((k-2)/bpe)] |= (1<<((k-2)%bpe));   //s_i2=2^(k-2)
+		divide_(s_i2,s_q,s_i,s_rm);                         //s_i=floor((2^(k-1))/(2q))
+
+		z=bitSize(s_i);
+
+		for (;;) {
+			for (;;) {  //generate z-bit numbers until one falls in the range [0,s_i-1]
+				randBigInt_(s_R,z,0);
+				if (greater(s_i,s_R))
+					break;
+			}               //now s_R is in the range [0,s_i-1]
+			addInt_(s_R,1);  //now s_R is in the range [1,s_i]
+			add_(s_R,s_i);   //now s_R is in the range [s_i+1,2*s_i]
+
+			copy_(s_n,s_q);
+			mult_(s_n,s_R); 
+			multInt_(s_n,2);
+			addInt_(s_n,1);    //s_n=2*s_R*s_q+1
+
+			copy_(s_r2,s_R);
+			multInt_(s_r2,2);  //s_r2=2*s_R
+
+			//check s_n for divisibility by small primes up to B
+			for (divisible=0,j=0; (j<primes.length) && (primes[j]<B); j++)
+				if (modInt(s_n,primes[j])==0) {
+					divisible=1;
+					break;
+				}      
+
+			if (!divisible)    //if it passes small primes check, then try a single Miller-Rabin base 2
+				if (!millerRabin(s_n,2)) //this line represents 75% of the total runtime for randTruePrime_ 
+					divisible=1;
+
+			if (!divisible) {  //if it passes that test, continue checking s_n
+				addInt_(s_n,-3);
+				for (j=s_n.length-1;(s_n[j]==0) && (j>0); j--);  //strip leading zeros
+				for (zz=0,w=s_n[j]; w; (w>>=1),zz++);
+				zz+=bpe*j;                             //zz=number of bits in s_n, ignoring leading zeros
+				for (;;) {  //generate z-bit numbers until one falls in the range [0,s_n-1]
+					randBigInt_(s_a,zz,0);
+					if (greater(s_n,s_a))
+						break;
+				}               //now s_a is in the range [0,s_n-1]
+				addInt_(s_n,3);  //now s_a is in the range [0,s_n-4]
+				addInt_(s_a,2);  //now s_a is in the range [2,s_n-2]
+				copy_(s_b,s_a);
+				copy_(s_n1,s_n);
+				addInt_(s_n1,-1);
+				powMod_(s_b,s_n1,s_n);   //s_b=s_a^(s_n-1) modulo s_n
+				addInt_(s_b,-1);
+				if (isZero(s_b)) {
+					copy_(s_b,s_a);
+					powMod_(s_b,s_r2,s_n);
+					addInt_(s_b,-1);
+					copy_(s_aa,s_n);
+					copy_(s_d,s_b);
+					GCD_(s_d,s_n);  //if s_b and s_n are relatively prime, then s_n is a prime
+					if (equalsInt(s_d,1)) {
+						copy_(ans,s_aa);
+						return;     //if we've made it this far, then s_n is absolutely guaranteed to be prime
+					}
+				}
+			}
+		}
+	},
+
+	//set b to an n-bit random BigInt.  If s=1, then nth bit (most significant bit) is set to 1.
+	//array b must be big enough to hold the result. Must have n>=1
+	'randBigInt_': function(b,n,s) {
+		var i,a;
+		for (i=0;i<b.length;i++)
+			b[i]=0;
+		a=Math.floor((n-1)/bpe)+1; //# array elements to hold the BigInt
+		for (i=0;i<a;i++) {
+			b[i]=Math.floor(Math.random()*(1<<(bpe-1)));
+		}
+		b[a-1] &= (2<<((n-1)%bpe))-1;
+		if (s)
+			b[a-1] |= (1<<((n-1)%bpe));
+	},
+
+	//set x to the greatest common divisor of x and y.
+	//x,y are bigInts with the same number of elements.  y is destroyed.
+	'GCD_': function(x,y) {
+		var i,xp,yp,A,B,C,D,q,sing;
+		if (T.length!=x.length)
+			T=dup(x);
+
+		sing=1;
+		while (sing) { //while y has nonzero elements other than y[0]
+			sing=0;
+			for (i=1;i<y.length;i++) //check if y has nonzero elements other than 0
+				if (y[i]) {
+					sing=1;
+					break;
+				}
+			if (!sing) break; //quit when y all zero elements except possibly y[0]
+
+			for (i=x.length;!x[i] && i>=0;i--);  //find most significant element of x
+			xp=x[i];
+			yp=y[i];
+			A=1; B=0; C=0; D=1;
+			while ((yp+C) && (yp+D)) {
+				q =Math.floor((xp+A)/(yp+C));
+				qp=Math.floor((xp+B)/(yp+D));
+				if (q!=qp)
+					break;
+				t= A-q*C;   A=C;   C=t;    //  do (A,B,xp, C,D,yp) = (C,D,yp, A,B,xp) - q*(0,0,0, C,D,yp)      
+				t= B-q*D;   B=D;   D=t;
+				t=xp-q*yp; xp=yp; yp=t;
+			}
+			if (B) {
+				copy_(T,x);
+				linComb_(x,y,A,B); //x=A*x+B*y
+				linComb_(y,T,D,C); //y=D*y+C*T
+			} else {
+				mod_(x,y);
+				copy_(T,x);
+				copy_(x,y);
+				copy_(y,T);
+			} 
+		}
+		if (y[0]==0)
+			return;
+		t=modInt(x,y[0]);
+		copyInt_(x,y[0]);
+		y[0]=t;
+		while (y[0]) {
+			x[0]%=y[0];
+			t=x[0]; x[0]=y[0]; y[0]=t;
+		}
+	},
+
+//do x=x**(-1) mod n, for bigInts x and n.
+//If no inverse exists, it sets x to zero and returns 0, else it returns 1.
+//The x array must be at least as large as the n array.
+function inverseMod_(x,n) {
+  var k=1+2*Math.max(x.length,n.length);
+
+  if(!(x[0]&1)  && !(n[0]&1)) {  //if both inputs are even, then inverse doesn't exist
+    copyInt_(x,0);
+    return 0;
+  }
+
+  if (eg_u.length!=k) {
+    eg_u=new Array(k);
+    eg_v=new Array(k);
+    eg_A=new Array(k);
+    eg_B=new Array(k);
+    eg_C=new Array(k);
+    eg_D=new Array(k);
+  }
+
+  copy_(eg_u,x);
+  copy_(eg_v,n);
+  copyInt_(eg_A,1);
+  copyInt_(eg_B,0);
+  copyInt_(eg_C,0);
+  copyInt_(eg_D,1);
+  for (;;) {
+    while(!(eg_u[0]&1)) {  //while eg_u is even
+      halve_(eg_u);
+      if (!(eg_A[0]&1) && !(eg_B[0]&1)) { //if eg_A==eg_B==0 mod 2
+        halve_(eg_A);
+        halve_(eg_B);      
+      } else {
+        add_(eg_A,n);  halve_(eg_A);
+        sub_(eg_B,x);  halve_(eg_B);
+      }
+    }
+
+    while (!(eg_v[0]&1)) {  //while eg_v is even
+      halve_(eg_v);
+      if (!(eg_C[0]&1) && !(eg_D[0]&1)) { //if eg_C==eg_D==0 mod 2
+        halve_(eg_C);
+        halve_(eg_D);      
+      } else {
+        add_(eg_C,n);  halve_(eg_C);
+        sub_(eg_D,x);  halve_(eg_D);
+      }
+    }
+
+    if (!greater(eg_v,eg_u)) { //eg_v <= eg_u
+      sub_(eg_u,eg_v);
+      sub_(eg_A,eg_C);
+      sub_(eg_B,eg_D);
+    } else {                   //eg_v > eg_u
+      sub_(eg_v,eg_u);
+      sub_(eg_C,eg_A);
+      sub_(eg_D,eg_B);
+    }
+  
+    if (equalsInt(eg_u,0)) {
+      if (negative(eg_C)) //make sure answer is nonnegative
+        add_(eg_C,n);
+      copy_(x,eg_C);
+
+      if (!equalsInt(eg_v,1)) { //if GCD_(x,n)!=1, then there is no inverse
+        copyInt_(x,0);
+        return 0;
+      }
+      return 1;
+    }
+  }
+}
+
+//return x**(-1) mod n, for integers x and n.  Return 0 if there is no inverse
+function inverseModInt_(x,n) {
+  var a=1,b=0,t;
+  for (;;) {
+    if (x==1) return a;
+    if (x==0) return 0;
+    b-=a*Math.floor(n/x);
+    n%=x;
+
+    if (n==1) return b; //to avoid negatives, change this b to n-b, and each -= to +=
+    if (n==0) return 0;
+    a-=b*Math.floor(x/n);
+    x%=n;
+  }
+}
+
+//Given positive bigInts x and y, change the bigints v, a, and b to positive bigInts such that:
+//     v = GCD_(x,y) = a*x-b*y
+//The bigInts v, a, b, must have exactly as many elements as the larger of x and y.
+function eGCD_(x,y,v,a,b) {
+  var g=0;
+  var k=Math.max(x.length,y.length);
+  if (eg_u.length!=k) {
+    eg_u=new Array(k);
+    eg_A=new Array(k);
+    eg_B=new Array(k);
+    eg_C=new Array(k);
+    eg_D=new Array(k);
+  }
+  while(!(x[0]&1)  && !(y[0]&1)) {  //while x and y both even
+    halve_(x);
+    halve_(y);
+    g++;
+  }
+  copy_(eg_u,x);
+  copy_(v,y);
+  copyInt_(eg_A,1);
+  copyInt_(eg_B,0);
+  copyInt_(eg_C,0);
+  copyInt_(eg_D,1);
+  for (;;) {
+    while(!(eg_u[0]&1)) {  //while u is even
+      halve_(eg_u);
+      if (!(eg_A[0]&1) && !(eg_B[0]&1)) { //if A==B==0 mod 2
+        halve_(eg_A);
+        halve_(eg_B);      
+      } else {
+        add_(eg_A,y);  halve_(eg_A);
+        sub_(eg_B,x);  halve_(eg_B);
+      }
+    }
+
+    while (!(v[0]&1)) {  //while v is even
+      halve_(v);
+      if (!(eg_C[0]&1) && !(eg_D[0]&1)) { //if C==D==0 mod 2
+        halve_(eg_C);
+        halve_(eg_D);      
+      } else {
+        add_(eg_C,y);  halve_(eg_C);
+        sub_(eg_D,x);  halve_(eg_D);
+      }
+    }
+
+    if (!greater(v,eg_u)) { //v<=u
+      sub_(eg_u,v);
+      sub_(eg_A,eg_C);
+      sub_(eg_B,eg_D);
+    } else {                //v>u
+      sub_(v,eg_u);
+      sub_(eg_C,eg_A);
+      sub_(eg_D,eg_B);
+    }
+    if (equalsInt(eg_u,0)) {
+      if (negative(eg_C)) {   //make sure a (C)is nonnegative
+        add_(eg_C,y);
+        sub_(eg_D,x);
+      }
+      multInt_(eg_D,-1);  ///make sure b (D) is nonnegative
+      copy_(a,eg_C);
+      copy_(b,eg_D);
+      leftShift_(v,g);
+      return;
+    }
+  }
+}
+
+
+//is bigInt x negative?
+function negative(x) {
+  return ((x[x.length-1]>>(bpe-1))&1);
+}
+
+
+//is (x << (shift*bpe)) > y?
+//x and y are nonnegative bigInts
+//shift is a nonnegative integer
+function greaterShift(x,y,shift) {
+  var kx=x.length, ky=y.length;
+  k=((kx+shift)<ky) ? (kx+shift) : ky;
+  for (i=ky-1-shift; i<kx && i>=0; i++) 
+    if (x[i]>0)
+      return 1; //if there are nonzeros in x to the left of the first column of y, then x is bigger
+  for (i=kx-1+shift; i<ky; i++)
+    if (y[i]>0)
+      return 0; //if there are nonzeros in y to the left of the first column of x, then x is not bigger
+  for (i=k-1; i>=shift; i--)
+    if      (x[i-shift]>y[i]) return 1;
+    else if (x[i-shift]<y[i]) return 0;
+  return 0;
+}
+
+//is x > y? (x and y both nonnegative)
+function greater(x,y) {
+  var i;
+  var k=(x.length<y.length) ? x.length : y.length;
+
+  for (i=x.length;i<y.length;i++)
+    if (y[i])
+      return 0;  //y has more digits
+
+  for (i=y.length;i<x.length;i++)
+    if (x[i])
+      return 1;  //x has more digits
+
+  for (i=k-1;i>=0;i--)
+    if (x[i]>y[i])
+      return 1;
+    else if (x[i]<y[i])
+      return 0;
+  return 0;
+}
+
+//divide_ x by y giving quotient q and remainder r.  (q=floor(x/y),  r=x mod y).  All 4 are bigints.
+//x must have at least one leading zero element.
+//y must be nonzero.
+//q and r must be arrays that are exactly the same length as x.
+//the x array must have at least as many elements as y.
+function divide_(x,y,q,r) {
+  var kx, ky;
+  var i,j,y1,y2,c,a,b;
+  copy_(r,x);
+  for (ky=y.length;y[ky-1]==0;ky--); //kx,ky is number of elements in x,y, not including leading zeros
+  for (kx=r.length;r[kx-1]==0 && kx>ky;kx--);
+
+  //normalize: ensure the most significant element of y has its highest bit set  
+  b=y[ky-1];
+  for (a=0; b; a++)
+    b>>=1;  
+  a=bpe-a;  //a is how many bits to shift so that the high order bit of y is leftmost in its array element
+  leftShift_(y,a);  //multiply both by 1<<a now, then divide_ both by that at the end
+  leftShift_(r,a);
+
+  copyInt_(q,0);                // q=0
+  while (!greaterShift(y,r,kx-ky)) {  // while (leftShift_(y,kx-ky) <= r) {
+    subShift_(r,y,kx-ky);      //   r=r-leftShift_(y,kx-ky)
+    q[kx-ky]++;                  //   q[kx-ky]++;
+  }                              // }
+
+  for (i=kx-1; i>=ky; i--) {
+    if (r[i]==y[ky-1])
+      q[i-ky]=mask;
+    else
+      q[i-ky]=Math.floor((r[i]*radix+r[i-1])/y[ky-1]);	
+
+    //The following for(;;) loop is equivalent to the commented while loop, 
+    //except that the uncommented version avoids overflow.
+    //The commented loop comes from HAC, which assumes r[-1]==y[-1]==0
+    //  while (q[i-ky]*(y[ky-1]*radix+y[ky-2]) > r[i]*radix*radix+r[i-1]*radix+r[i-2])
+    //    q[i-ky]--;    
+    for (;;) {
+      y2=(ky>1 ? y[ky-2] : 0)*q[i-ky];
+      c=y2>>bpe;
+      y2=y2 & mask;
+      y1=c+q[i-ky]*y[ky-1];
+      c=y1>>bpe;
+      y1=y1 & mask;
+
+      if (c==r[i] ? y1==r[i-1] ? y2>(i>1 ? r[i-2] : 0) : y1>r[i-1] : c>r[i]) 
+        q[i-ky]--;
+      else
+        break;
+    }
+
+    linCombShift_(r,y,-q[i-ky],i-ky);    //r=r-q[i-ky]*leftShift_(y,i-ky)
+    if (negative(r)) {
+      addShift_(r,y,i-ky);         //r=r+leftShift_(y,i-ky)
+      q[i-ky]--;
+    }
+  }
+
+  rightShift_(y,a);  //undo the normalization step
+  rightShift_(r,a);  //undo the normalization step
+}
+
+//do carries and borrows so each element of the bigInt x fits in bpe bits.
+function carry_(x) {
+  var i,k,c,b;
+  k=x.length;
+  c=0;
+  for (i=0;i<k;i++) {
+    c+=x[i];
+    b=0;
+    if (c<0) {
+      b=-(c>>bpe);
+      c+=b*radix;
+    }
+    x[i]=c & mask;
+    c=(c>>bpe)-b;
+  }
+}
+
+//return x mod n for bigInt x and integer n.
+function modInt(x,n) {
+  var i,c=0;
+  for (i=x.length-1; i>=0; i--)
+    c=(c*radix+x[i])%n;
+  return c;
+}
+
+//convert the integer t into a bigInt with at least the given number of bits.
+//the returned array stores the bigInt in bpe-bit chunks, little endian (buff[0] is least significant word)
+//Pad the array with leading zeros so that it has at least minSize elements.
+//There will always be at least one leading 0 element.
+function int2bigInt(t,bits,minSize) {   
+  var i,k;
+  k=Math.ceil(bits/bpe)+1;
+  k=minSize>k ? minSize : k;
+  buff=new Array(k);
+  copyInt_(buff,t);
+  return buff;
+}
+
+//return the bigInt given a string representation in a given base.  
+//Pad the array with leading zeros so that it has at least minSize elements.
+//If base=-1, then it reads in a space-separated list of array elements in decimal.
+//The array will always have at least one leading zero, unless base=-1.
+function str2bigInt(s,base,minSize) {
+  var d, i, j, x, y, kk;
+  var k=s.length;
+  if (base==-1) { //comma-separated list of array elements in decimal
+    x=new Array(0);
+    for (;;) {
+      y=new Array(x.length+1);
+      for (i=0;i<x.length;i++)
+        y[i+1]=x[i];
+      y[0]=parseInt(s,10);
+      x=y;
+      d=s.indexOf(',',0);
+      if (d<1) 
+        break;
+      s=s.substring(d+1);
+      if (s.length==0)
+        break;
+    }
+    if (x.length<minSize) {
+      y=new Array(minSize);
+      copy_(y,x);
+      return y;
+    }
+    return x;
+  }
+
+  x=int2bigInt(0,base*k,0);
+  for (i=0;i<k;i++) {
+    d=digitsStr.indexOf(s.substring(i,i+1),0);
+    if (base<=36 && d>=36)  //convert lowercase to uppercase if base<=36
+      d-=26;
+    if (d<base && d>=0) {   //ignore illegal characters
+      multInt_(x,base);
+      addInt_(x,d);
+    }
+  }
+
+  for (k=x.length;k>0 && !x[k-1];k--); //strip off leading zeros
+  k=minSize>k+1 ? minSize : k+1;
+  y=new Array(k);
+  kk=k<x.length ? k : x.length;
+  for (i=0;i<kk;i++)
+    y[i]=x[i];
+  for (;i<k;i++)
+    y[i]=0;
+  return y;
+}
+
+//is bigint x equal to integer y?
+//y must have less than bpe bits
+function equalsInt(x,y) {
+  var i;
+  if (x[0]!=y)
+    return 0;
+  for (i=1;i<x.length;i++)
+    if (x[i])
+      return 0;
+  return 1;
+}
+
+//are bigints x and y equal?
+//this works even if x and y are different lengths and have arbitrarily many leading zeros
+function equals(x,y) {
+  var i;
+  var k=x.length<y.length ? x.length : y.length;
+  for (i=0;i<k;i++)
+    if (x[i]!=y[i])
+      return 0;
+  if (x.length>y.length) {
+    for (;i<x.length;i++)
+      if (x[i])
+        return 0;
+  } else {
+    for (;i<y.length;i++)
+      if (y[i])
+        return 0;
+  }
+  return 1;
+}
+
+//is the bigInt x equal to zero?
+function isZero(x) {
+  var i;
+  for (i=0;i<x.length;i++)
+    if (x[i])
+      return 0;
+  return 1;
+}
+
+//convert a bigInt into a string in a given base, from base 2 up to base 95.
+//Base -1 prints the contents of the array representing the number.
+function bigInt2str(x,base) {
+  var i,t,s="";
+
+  if (s6.length!=x.length) 
+    s6=dup(x);
+  else
+    copy_(s6,x);
+
+  if (base==-1) { //return the list of array contents
+    for (i=x.length-1;i>0;i--)
+      s+=x[i]+',';
+    s+=x[0];
+  }
+  else { //return it in the given base
+    while (!isZero(s6)) {
+      t=divInt_(s6,base);  //t=s6 % base; s6=floor(s6/base);
+      s=digitsStr.substring(t,t+1)+s;
+    }
+  }
+  if (s.length==0)
+    s="0";
+  return s;
+}
+
+//returns a duplicate of bigInt x
+function dup(x) {
+  var i;
+  buff=new Array(x.length);
+  copy_(buff,x);
+  return buff;
+}
+
+//do x=y on bigInts x and y.  x must be an array at least as big as y (not counting the leading zeros in y).
+function copy_(x,y) {
+  var i;
+  var k=x.length<y.length ? x.length : y.length;
+  for (i=0;i<k;i++)
+    x[i]=y[i];
+  for (i=k;i<x.length;i++)
+    x[i]=0;
+}
+
+//do x=y on bigInt x and integer y.  
+function copyInt_(x,n) {
+  var i,c;
+  for (c=n,i=0;i<x.length;i++) {
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x+n where x is a bigInt and n is an integer.
+//x must be large enough to hold the result.
+function addInt_(x,n) {
+  var i,k,c,b;
+  x[0]+=n;
+  k=x.length;
+  c=0;
+  for (i=0;i<k;i++) {
+    c+=x[i];
+    b=0;
+    if (c<0) {
+      b=-(c>>bpe);
+      c+=b*radix;
+    }
+    x[i]=c & mask;
+    c=(c>>bpe)-b;
+    if (!c) return; //stop carrying as soon as the carry_ is zero
+  }
+}
+
+//right shift bigInt x by n bits.  0 <= n < bpe.
+function rightShift_(x,n) {
+  var i;
+  var k=Math.floor(n/bpe);
+  if (k) {
+    for (i=0;i<x.length-k;i++) //right shift x by k elements
+      x[i]=x[i+k];
+    for (;i<x.length;i++)
+      x[i]=0;
+    n%=bpe;
+  }
+  for (i=0;i<x.length-1;i++) {
+    x[i]=mask & ((x[i+1]<<(bpe-n)) | (x[i]>>n));
+  }
+  x[i]>>=n;
+}
+
+//do x=floor(|x|/2)*sgn(x) for bigInt x in 2's complement
+function halve_(x) {
+  var i;
+  for (i=0;i<x.length-1;i++) {
+    x[i]=mask & ((x[i+1]<<(bpe-1)) | (x[i]>>1));
+  }
+  x[i]=(x[i]>>1) | (x[i] & (radix>>1));  //most significant bit stays the same
+}
+
+//left shift bigInt x by n bits.
+function leftShift_(x,n) {
+  var i;
+  var k=Math.floor(n/bpe);
+  if (k) {
+    for (i=x.length; i>=k; i--) //left shift x by k elements
+      x[i]=x[i-k];
+    for (;i>=0;i--)
+      x[i]=0;  
+    n%=bpe;
+  }
+  if (!n)
+    return;
+  for (i=x.length-1;i>0;i--) {
+    x[i]=mask & ((x[i]<<n) | (x[i-1]>>(bpe-n)));
+  }
+  x[i]=mask & (x[i]<<n);
+}
+
+//do x=x*n where x is a bigInt and n is an integer.
+//x must be large enough to hold the result.
+function multInt_(x,n) {
+  var i,k,c,b;
+  if (!n)
+    return;
+  k=x.length;
+  c=0;
+  for (i=0;i<k;i++) {
+    c+=x[i]*n;
+    b=0;
+    if (c<0) {
+      b=-(c>>bpe);
+      c+=b*radix;
+    }
+    x[i]=c & mask;
+    c=(c>>bpe)-b;
+  }
+}
+
+//do x=floor(x/n) for bigInt x and integer n, and return the remainder
+function divInt_(x,n) {
+  var i,r=0,s;
+  for (i=x.length-1;i>=0;i--) {
+    s=r*radix+x[i];
+    x[i]=Math.floor(s/n);
+    r=s%n;
+  }
+  return r;
+}
+
+//do the linear combination x=a*x+b*y for bigInts x and y, and integers a and b.
+//x must be large enough to hold the answer.
+function linComb_(x,y,a,b) {
+  var i,c,k,kk;
+  k=x.length<y.length ? x.length : y.length;
+  kk=x.length;
+  for (c=0,i=0;i<k;i++) {
+    c+=a*x[i]+b*y[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;i<kk;i++) {
+    c+=a*x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do the linear combination x=a*x+b*(y<<(ys*bpe)) for bigInts x and y, and integers a, b and ys.
+//x must be large enough to hold the answer.
+function linCombShift_(x,y,b,ys) {
+  var i,c,k,kk;
+  k=x.length<ys+y.length ? x.length : ys+y.length;
+  kk=x.length;
+  for (c=0,i=ys;i<k;i++) {
+    c+=x[i]+b*y[i-ys];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;c && i<kk;i++) {
+    c+=x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x+(y<<(ys*bpe)) for bigInts x and y, and integers a,b and ys.
+//x must be large enough to hold the answer.
+function addShift_(x,y,ys) {
+  var i,c,k,kk;
+  k=x.length<ys+y.length ? x.length : ys+y.length;
+  kk=x.length;
+  for (c=0,i=ys;i<k;i++) {
+    c+=x[i]+y[i-ys];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;c && i<kk;i++) {
+    c+=x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x-(y<<(ys*bpe)) for bigInts x and y, and integers a,b and ys.
+//x must be large enough to hold the answer.
+function subShift_(x,y,ys) {
+  var i,c,k,kk;
+  k=x.length<ys+y.length ? x.length : ys+y.length;
+  kk=x.length;
+  for (c=0,i=ys;i<k;i++) {
+    c+=x[i]-y[i-ys];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;c && i<kk;i++) {
+    c+=x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x-y for bigInts x and y.
+//x must be large enough to hold the answer.
+//negative answers will be 2s complement
+function sub_(x,y) {
+  var i,c,k,kk;
+  k=x.length<y.length ? x.length : y.length;
+  for (c=0,i=0;i<k;i++) {
+    c+=x[i]-y[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;c && i<x.length;i++) {
+    c+=x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x+y for bigInts x and y.
+//x must be large enough to hold the answer.
+function add_(x,y) {
+  var i,c,k,kk;
+  k=x.length<y.length ? x.length : y.length;
+  for (c=0,i=0;i<k;i++) {
+    c+=x[i]+y[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+  for (i=k;c && i<x.length;i++) {
+    c+=x[i];
+    x[i]=c & mask;
+    c>>=bpe;
+  }
+}
+
+//do x=x*y for bigInts x and y.  This is faster when y<x.
+function mult_(x,y) {
+  var i;
+  if (ss.length!=2*x.length)
+    ss=new Array(2*x.length);
+  copyInt_(ss,0);
+  for (i=0;i<y.length;i++)
+    if (y[i])
+      linCombShift_(ss,x,y[i],i);   //ss=1*ss+y[i]*(x<<(i*bpe))
+  copy_(x,ss);
+}
+
+//do x=x mod n for bigInts x and n.
+function mod_(x,n) {
+  if (s4.length!=x.length)
+    s4=dup(x);
+  else
+    copy_(s4,x);
+  if (s5.length!=x.length)
+    s5=dup(x);  
+  divide_(s4,n,s5,x);  //x = remainder of s4 / n
+}
+
+//do x=x*y mod n for bigInts x,y,n.
+//for greater speed, let y<x.
+function multMod_(x,y,n) {
+  var i;
+  if (s0.length!=2*x.length)
+    s0=new Array(2*x.length);
+  copyInt_(s0,0);
+  for (i=0;i<y.length;i++)
+    if (y[i])
+      linCombShift_(s0,x,y[i],i);   //s0=1*s0+y[i]*(x<<(i*bpe))
+  mod_(s0,n);
+  copy_(x,s0);
+}
+
+//do x=x*x mod n for bigInts x,n.
+function squareMod_(x,n) {
+  var i,j,d,c,kx,kn,k;
+  for (kx=x.length; kx>0 && !x[kx-1]; kx--);  //ignore leading zeros in x
+  k=kx>n.length ? 2*kx : 2*n.length; //k=# elements in the product, which is twice the elements in the larger of x and n
+  if (s0.length!=k) 
+    s0=new Array(k);
+  copyInt_(s0,0);
+  for (i=0;i<kx;i++) {
+    c=s0[2*i]+x[i]*x[i];
+    s0[2*i]=c & mask;
+    c>>=bpe;
+    for (j=i+1;j<kx;j++) {
+      c=s0[i+j]+2*x[i]*x[j]+c;
+      s0[i+j]=(c & mask);
+      c>>=bpe;
+    }
+    s0[i+kx]=c;
+  }
+  mod_(s0,n);
+  copy_(x,s0);
+}
+
+//return x with exactly k leading zero elements
+function trim(x,k) {
+  var i,y;
+  for (i=x.length; i>0 && !x[i-1]; i--);
+  y=new Array(i+k);
+  copy_(y,x);
+  return y;
+}
+
+//do x=x**y mod n, where x,y,n are bigInts and ** is exponentiation.  0**0=1.
+//this is faster when n is odd.  x usually needs to have as many elements as n.
+function powMod_(x,y,n) {
+  var k1,k2,kn,np;
+  if(s7.length!=n.length)
+    s7=dup(n);
+
+  //for even modulus, use a simple square-and-multiply algorithm,
+  //rather than using the more complex Montgomery algorithm.
+  if ((n[0]&1)==0) {
+    copy_(s7,x);
+    copyInt_(x,1);
+    while(!equalsInt(y,0)) {
+      if (y[0]&1)
+        multMod_(x,s7,n);
+      divInt_(y,2);
+      squareMod_(s7,n); 
+    }
+    return;
+  }
+
+  //calculate np from n for the Montgomery multiplications
+  copyInt_(s7,0);
+  for (kn=n.length;kn>0 && !n[kn-1];kn--);
+  np=radix-inverseModInt_(modInt(n,radix),radix);
+  s7[kn]=1;
+  multMod_(x ,s7,n);   // x = x * 2**(kn*bp) mod n
+
+  if (s3.length!=x.length)
+    s3=dup(x);
+  else
+    copy_(s3,x);
+
+  for (k1=y.length-1;k1>0 & !y[k1]; k1--);  //k1=first nonzero element of y
+  if (y[k1]==0) {  //anything to the 0th power is 1
+    copyInt_(x,1);
+    return;
+  }
+  for (k2=1<<(bpe-1);k2 && !(y[k1] & k2); k2>>=1);  //k2=position of first 1 bit in y[k1]
+  for (;;) {
+    if (!(k2>>=1)) {  //look at next bit of y
+      k1--;
+      if (k1<0) {
+        mont_(x,one,n,np);
+        return;
+      }
+      k2=1<<(bpe-1);
+    }    
+    mont_(x,x,n,np);
+
+    if (k2 & y[k1]) //if next bit is a 1
+      mont_(x,s3,n,np);
+  }
+}    
+
+//do x=x*y*Ri mod n for bigInts x,y,n, 
+//  where Ri = 2**(-kn*bpe) mod n, and kn is the 
+//  number of elements in the n array, not 
+//  counting leading zeros.  
+//x must be large enough to hold the answer.
+//It's OK if x and y are the same variable.
+//must have:
+//  x,y < n
+//  n is odd
+//  np = -(n^(-1)) mod radix
+function mont_(x,y,n,np) {
+  var i,j,c,ui,t;
+  var kn=n.length;
+  var ky=y.length;
+
+  if (sa.length!=kn)
+    sa=new Array(kn);
+
+  for (;kn>0 && n[kn-1]==0;kn--); //ignore leading zeros of n
+  //this function sometimes gives wrong answers when the next line is uncommented
+  //for (;ky>0 && y[ky-1]==0;ky--); //ignore leading zeros of y
+
+  copyInt_(sa,0);
+
+  //the following loop consumes 95% of the runtime for randTruePrime_() and powMod_() for large keys
+  for (i=0; i<kn; i++) {
+    t=sa[0]+x[i]*y[0];
+    ui=((t & mask) * np) & mask;  //the inner "& mask" is needed on Macintosh MSIE, but not windows MSIE
+    c=(t+ui*n[0]) >> bpe;
+    t=x[i];
+
+    //do sa=(sa+x[i]*y+ui*n)/b   where b=2**bpe
+    for (j=1;j<ky;j++) { 
+      c+=sa[j]+t*y[j]+ui*n[j];
+      sa[j-1]=c & mask;
+      c>>=bpe;
+    }    
+    for (;j<kn;j++) { 
+      c+=sa[j]+ui*n[j];
+      sa[j-1]=c & mask;
+      c>>=bpe;
+    }    
+    sa[j-1]=c & mask;
+  }
+
+  if (!greater(n,sa))
+    sub_(sa,n);
+  copy_(x,sa);
+}
+
+
+
+
+//#############################################################################
+//#############################################################################
+//#############################################################################
+//#############################################################################
+//#############################################################################
+//#############################################################################
+//#############################################################################
+
+
+
+
+
+//#############################################################################
+
+Clipperz.Crypto.BigInt = function (aValue, aBase) {
+	var	base;
+	var	value;
+	
+	if (typeof(aValue) == 'object') {
+		this._internalValue = aValue;
+	} else {
+		if (typeof(aValue) == 'undefined') {
+			value = "0";
+		} else {
+			value = aValue + "";
+		}
+	
+		if (typeof(aBase) == 'undefined') {
+			base = 10;
+		} else {
+			base = aBase;
+		}
+
+		this._internalValue = str2bigInt(value, base, 1, 1);
+	}
+	
+	return this;
+}
+
+//=============================================================================
+
+MochiKit.Base.update(Clipperz.Crypto.BigInt.prototype, {
+
+	//-------------------------------------------------------------------------
+
+	'internalValue': function () {
+		return this._internalValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'isBigInt': true,
+	
+	//-------------------------------------------------------------------------
+
+	'toString': function(aBase) {
+		return this.asString(aBase);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'asString': function (aBase) {
+		var	base;
+
+		if (typeof(aBase) == 'undefined') {
+			base = 10;
+		} else {
+			base = aBase;
+		}
+		
+		return bigInt2str(this.internalValue(), base).toLowerCase();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'equals': function (aValue) {
+		var result;
+		
+		if (aValue.isBigInt) {
+		 	result = equals(this.internalValue(), aValue.internalValue());
+		} else if (typeof(aValue) == "number") {
+			result = equalsInt(this.internalValue(), aValue);
+		} else {
+			throw Clipperz.Crypt.BigInt.exception.UnknownType;
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'add': function (aValue) {
+		var result;
+
+		if (aValue.isBigInt) {
+		 	result = add(this.internalValue(), aValue.internalValue());
+		} else {
+			result = addInt(this.internalValue(), aValue);
+		}
+		
+		return new Clipperz.Crypto.BigInt(result);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'subtract': function (aValue) {
+		var result;
+		var value;
+
+		if (aValue.isBigInt) {
+			value = aValue;
+		} else {
+			value = new Clipperz.Crypto.BigInt(aValue);
+		}
+
+	 	result = sub(this.internalValue(), value.internalValue());
+
+		return new Clipperz.Crypto.BigInt(result);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'multiply': function (aValue, aModule) {
+		var result;
+		var value;
+
+		if (aValue.isBigInt) {
+			value = aValue;
+		} else {
+			value = new Clipperz.Crypto.BigInt(aValue);
+		}
+			
+		if (typeof(aModule) == 'undefined') {
+	 		result = mult(this.internalValue(), value.internalValue());
+		} else {
+			result = multMod(this.internalValue(), value.internalValue(), aModule);
+		}
+		
+		return new Clipperz.Crypto.BigInt(result);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'module': function (aModule) {
+		var	result;
+		var module;
+		
+		if (aModule.isBigInt) {
+			module = aModule;
+		} else {
+			module = new Clipperz.Crypto.BigInt(aModule);
+		}
+
+		result = mod(this.internalValue(), module.internalValue());
+		
+		return new Clipperz.Crypto.BigInt(result);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'powerModule': function(aValue, aModule) {
+		var	result;
+		var	value;
+		var module;
+		
+		if (aValue.isBigInt) {
+			value = aValue;
+		} else {
+			value = new Clipperz.Crypto.BigInt(aValue);
+		}
+
+		if (aModule.isBigInt) {
+			module = aModule;
+		} else {
+			module = new Clipperz.Crypto.BigInt(aModule);
+		}
+
+		if (aValue == -1) {
+			result = inverseMod(this.internalValue(), module.internalValue());
+		} else {
+			result = powMod(this.internalValue(), value.internalValue(), module.internalValue());
+		}
+		
+		return new Clipperz.Crypto.BigInt(result);
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'bitSize': function() {
+		return bitSize(this.internalValue());
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
+//#############################################################################
+
+Clipperz.Crypto.BigInt.randomPrime = function(aBitSize) {
+	return new Clipperz.Crypto.BigInt(randTruePrime(aBitSize));
+}
+
+//#############################################################################
+//#############################################################################
+//#############################################################################
+
+Clipperz.Crypto.BigInt.equals = function(a, b) {
+	return a.equals(b);
+}
+
+Clipperz.Crypto.BigInt.add = function(a, b) {
+	return a.add(b);
+}
+
+Clipperz.Crypto.BigInt.subtract = function(a, b) {
+	return a.subtract(b);
+}
+
+Clipperz.Crypto.BigInt.multiply = function(a, b, module) {
+	return a.multiply(b, module);
+}
+
+Clipperz.Crypto.BigInt.module = function(a, module) {
+	return a.module(module);
+}
+
+Clipperz.Crypto.BigInt.powerModule = function(a, b, module) {
+	return a.powerModule(b, module);
+}
+
+Clipperz.Crypto.BigInt.exception = {
+	UnknownType: new MochiKit.Base.NamedError("Clipperz.Crypto.BigInt.exception.UnknownType") 
+}
diff --git a/frontend/beta/js/Clipperz/Crypto/ECC.js b/frontend/beta/js/Clipperz/Crypto/ECC.js
new file mode 100644
index 0000000..c3dcec3
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/ECC.js
@@ -0,0 +1,960 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+/*
+try { if (typeof(Clipperz.ByteArray) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.ECC depends on Clipperz.ByteArray!";
+}  
+
+if (typeof(Clipperz.Crypto.ECC) == 'undefined') { Clipperz.Crypto.ECC = {}; }
+
+
+//#############################################################################
+
+Clipperz.Crypto.ECC.BinaryField = {};
+
+//#############################################################################
+
+Clipperz.Crypto.ECC.BinaryField.AbstractValue = function(aValue, aBase) {
+	return this;
+}
+
+Clipperz.Crypto.ECC.BinaryField.AbstractValue.prototype = MochiKit.Base.update(null, {
+
+	'asString': function(aBase) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	'isZero': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	'shiftLeft': function(aNumberOfBitsToShift) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	'bitSize': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	'isBitSet': function(aBitPosition) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	'xor': function(aValue) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	'compare': function(aValue) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//*****************************************************************************
+/ *
+Clipperz.Crypto.ECC.BinaryField.BigIntValue = function(aValue, aBase) {
+	this._value = new Clipperz.Crypto.BigInt(aValue, aBase);
+	return this;
+}
+
+Clipperz.Crypto.ECC.BinaryField.BigIntValue.prototype = MochiKit.Base.update(new Clipperz.Crypto.ECC.BinaryField.AbstractValue(), {
+
+	'value': function() {
+		return this._value;
+	},
+
+	//-----------------------------------------------------------------------------
+	
+	'isZero': function() {
+		return (this.value().compare(Clipperz.Crypto.ECC.BinaryField.BigIntValue.O) == 0);
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'asString': function(aBase) {
+		return this.value().asString(aBase);
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'shiftLeft': function(aNumberOfBitsToShift) {
+		return new Clipperz.Crypto.ECC.BinaryField.BigIntValue(this.value().shiftLeft(aNumberOfBitsToShift));
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'bitSize': function() {
+		return this.value().bitSize();
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'isBitSet': function(aBitPosition) {
+		return this.value().isBitSet(aBitPosition);
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'xor': function(aValue) {
+		return new Clipperz.Crypto.ECC.BinaryField.BigIntValue(this.value().xor(aValue.value()));
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'compare': function(aValue) {
+		return this.value().compare(aValue.value());
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+Clipperz.Crypto.ECC.BinaryField.BigIntValue.O =  new Clipperz.Crypto.BigInt(0);
+Clipperz.Crypto.ECC.BinaryField.BigIntValue.I =  new Clipperz.Crypto.BigInt(1);
+* /
+//*****************************************************************************
+
+Clipperz.Crypto.ECC.BinaryField.WordArrayValue = function(aValue, aBase) {
+	if (aValue.constructor == String) {
+		var	value;
+		var	stringLength;
+		var numberOfWords;
+		var	i,c;
+	
+		if (aBase != 16) {
+			throw Clipperz.Crypto.ECC.BinaryField.WordArrayValue.exception.UnsupportedBase;
+		}
+
+		value = aValue.replace(/ /g, '');
+		stringLength = value.length;
+		numberOfWords = Math.ceil(stringLength / 8);
+		this._value = new Array(numberOfWords);
+	
+		c = numberOfWords;
+		for (i=0; i<c; i++) {
+			var	word;
+		
+			if (i < (c-1)) {
+				word = parseInt(value.substr(stringLength-((i+1)*8), 8), 16);
+			} else {
+				word = parseInt(value.substr(0, stringLength-(i*8)), 16);
+			}
+			
+			this._value[i] = word;
+		}
+	} else if (aValue.constructor == Array) {
+		var itemsToCopy;
+
+		itemsToCopy = aValue.length;
+		while (aValue[itemsToCopy - 1] == 0) {
+			itemsToCopy --;
+		}
+
+		this._value = aValue.slice(0, itemsToCopy);
+	} else if (aValue.constructor == Number) {
+		this._value = [aValue];
+	} else {
+//		throw Clipperz.Crypto.ECC.BinaryField.WordArrayValue.exception.UnsupportedConstructorValueType;
+	}
+	
+	return this;
+}
+
+Clipperz.Crypto.ECC.BinaryField.WordArrayValue.prototype = MochiKit.Base.update(new Clipperz.Crypto.ECC.BinaryField.AbstractValue(), {
+
+	'value': function() {
+		return this._value;
+	},
+
+	//-----------------------------------------------------------------------------
+	
+	'wordSize': function() {
+		return this._value.length
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'clone': function() {
+		return new Clipperz.Crypto.ECC.BinaryField.WordArrayValue(this._value.slice(0));
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'isZero': function() {
+		return (this.compare(Clipperz.Crypto.ECC.BinaryField.WordArrayValue.O) == 0);
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'asString': function(aBase) {
+		var	result;
+		var i,c;
+		
+		if (aBase != 16) {
+			throw Clipperz.Crypto.ECC.BinaryField.WordArrayValue.exception.UnsupportedBase;
+		}
+		
+		result = "";
+		c = this.wordSize();
+		for (i=0; i<c; i++) {
+			var	wordAsString;
+			
+//			wordAsString = ("00000000" + this.value()[i].toString(16));
+			wordAsString = ("00000000" + this._value[i].toString(16));
+			wordAsString = wordAsString.substring(wordAsString.length - 8);
+			result = wordAsString + result;
+		}
+		
+		result = result.replace(/^(00)* SPACEs THAT SHOULD BE REMOVED TO FIX THIS REGEX /, "");
+		
+		if (result == "") {
+			result = "0";
+		}
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'shiftLeft': function(aNumberOfBitsToShift) {
+		return new Clipperz.Crypto.ECC.BinaryField.WordArrayValue(Clipperz.Crypto.ECC.BinaryField.WordArrayValue.shiftLeft(this._value, aNumberOfBitsToShift));
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'bitSize': function() {
+		return Clipperz.Crypto.ECC.BinaryField.WordArrayValue.bitSize(this._value);
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'isBitSet': function(aBitPosition) {
+		return Clipperz.Crypto.ECC.BinaryField.WordArrayValue.isBitSet(this._value, aBitPosition);
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'xor': function(aValue) {
+		return new Clipperz.Crypto.ECC.BinaryField.WordArrayValue(Clipperz.Crypto.ECC.BinaryField.WordArrayValue.xor(this._value, aValue._value));
+	}, 
+
+	//-----------------------------------------------------------------------------
+
+	'compare': function(aValue) {
+		return Clipperz.Crypto.ECC.BinaryField.WordArrayValue.compare(this._value, aValue._value);
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+Clipperz.Crypto.ECC.BinaryField.WordArrayValue.O = new Clipperz.Crypto.ECC.BinaryField.WordArrayValue('0', 16);
+Clipperz.Crypto.ECC.BinaryField.WordArrayValue.I = new Clipperz.Crypto.ECC.BinaryField.WordArrayValue('1', 16);
+
+Clipperz.Crypto.ECC.BinaryField.WordArrayValue.xor = function(a, b) {
+	var result;
+	var resultSize;
+	var i,c;
+	
+	resultSize = Math.max(a.length, b.length);
+	
+	result = new Array(resultSize);
+	c = resultSize;
+	for (i=0; i<c; i++) {
+//		resultValue[i] = (((this.value()[i] || 0) ^ (aValue.value()[i] || 0)) >>> 0);
+		result[i] = (((a[i] || 0) ^ (b[i] || 0)) >>> 0);
+	}
+	
+	return result;
+};
+
+Clipperz.Crypto.ECC.BinaryField.WordArrayValue.shiftLeft = function(aWordArray, aNumberOfBitsToShift) {
+	var numberOfWordsToShift;
+	var	numberOfBitsToShift;
+	var result;
+	var	overflowValue;
+	var	i,c;
+
+	numberOfWordsToShift = Math.floor(aNumberOfBitsToShift / 32);
+	numberOfBitsToShift = aNumberOfBitsToShift % 32;
+
+	result = new Array(aWordArray.length + numberOfWordsToShift);
+	
+	c = numberOfWordsToShift;
+	for (i=0; i<c; i++) {
+		result[i] = 0;
+	}
+	
+	overflowValue = 0;
+	nextOverflowValue = 0;
+	
+	c = aWordArray.length;
+	for (i=0; i<c; i++) {
+		var	value;
+		var	resultWord;
+
+//		value = this.value()[i];
+		value = aWordArray[i];
+
+		if (numberOfBitsToShift > 0) {
+			var nextOverflowValue;
+		
+			nextOverflowValue = (value >>> (32 - numberOfBitsToShift));
+			value = value & (0xffffffff >>> numberOfBitsToShift);
+			resultWord = (((value << numberOfBitsToShift) | overflowValue) >>> 0);
+		} else {
+			resultWord = value;
+		}
+		
+		result[i+numberOfWordsToShift] = resultWord;
+		overflowValue = nextOverflowValue;
+	}
+
+	if (overflowValue != 0) {
+		result[aWordArray.length + numberOfWordsToShift] = overflowValue;
+	}
+
+	return result;
+};
+
+Clipperz.Crypto.ECC.BinaryField.WordArrayValue.bitSize = function(aWordArray) {
+	var	result;
+	var	notNullElements;
+	var mostValuableWord;
+	var matchingBitsInMostImportantWord;
+	var mask;
+	var i,c;
+
+	notNullElements = aWordArray.length;
+	
+	if ((aWordArray.length == 1) && (aWordArray[0] == 0)) {
+		result = 0;
+	} else {
+		while((aWordArray[notNullElements - 1] == 0) && (notNullElements > 0)) {
+			notNullElements --;
+		}
+	
+		result = (notNullElements - 1) * 32;
+		mostValuableWord = aWordArray[notNullElements - 1];
+
+		matchingBits = 32;
+		mask = 0x80000000;
+	
+		while ((matchingBits > 0) && ((mostValuableWord & mask) == 0)) {
+			matchingBits --;
+			mask >>>= 1;
+		}
+	
+		result += matchingBits;
+	}
+	
+	return result;
+};
+
+Clipperz.Crypto.ECC.BinaryField.WordArrayValue.isBitSet = function(aWordArray, aBitPosition) {
+	var result;
+	var	byteIndex;
+	var bitIndexInSelectedByte;
+
+	byteIndex = Math.floor(aBitPosition / 32);
+	bitIndexInSelectedByte = aBitPosition % 32;
+	
+	if (byteIndex <= aWordArray.length) {
+		result = ((aWordArray[byteIndex] & (1 << bitIndexInSelectedByte)) != 0);
+	} else {
+		result = false;
+	}
+
+	return result;
+};
+
+Clipperz.Crypto.ECC.BinaryField.WordArrayValue.compare = function(a,b) {
+	var	result;
+	var i,c;
+	
+	result = MochiKit.Base.compare(a.length, b.length);
+
+	c = a.length;
+	for (i=0; (i<c) && (result==0); i++) {
+//console.log("compare[" + c + " - " + i + " - 1] " + this.value()[c-i-1] + ", " + aValue.value()[c-i-1]);
+//		result = MochiKit.Base.compare(this.value()[c-i-1], aValue.value()[c-i-1]);
+		result = MochiKit.Base.compare(a[c-i-1], b[c-i-1]);
+	}
+	
+	return result;
+};
+
+
+Clipperz.Crypto.ECC.BinaryField.WordArrayValue['exception']= {
+	'UnsupportedBase':					new MochiKit.Base.NamedError("Clipperz.Crypto.ECC.BinaryField.WordArrayValue.exception.UnsupportedBase"),
+	'UnsupportedConstructorValueType':	new MochiKit.Base.NamedError("Clipperz.Crypto.ECC.BinaryField.WordArrayValue.exception.UnsupportedConstructorValueType")
+};
+
+//*****************************************************************************
+
+//Clipperz.Crypto.ECC.BinaryField.Value	=	Clipperz.Crypto.ECC.BinaryField.BigIntValue;
+Clipperz.Crypto.ECC.BinaryField.Value	=	Clipperz.Crypto.ECC.BinaryField.WordArrayValue;
+
+//#############################################################################
+
+Clipperz.Crypto.ECC.BinaryField.Point = function(args) {
+	args = args || {};
+	this._x = args.x;
+	this._y = args.y;
+	
+	return this;
+}
+
+Clipperz.Crypto.ECC.BinaryField.Point.prototype = MochiKit.Base.update(null, {
+
+	'asString': function() {
+		return "Clipperz.Crypto.ECC.BinaryField.Point (" + this.x() + ", " + this.y() + ")";
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'x': function() {
+		return this._x;
+	},
+	
+	'y': function() {
+		return this._y;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'isZero': function() {
+		return (this.x().isZero() && this.y().isZero())
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
+Clipperz.Crypto.ECC.BinaryField.FiniteField = function(args) {
+	args = args || {};
+	this._modulus = args.modulus;
+
+	return this;
+}
+
+Clipperz.Crypto.ECC.BinaryField.FiniteField.prototype = MochiKit.Base.update(null, {
+
+	'asString': function() {
+		return "Clipperz.Crypto.ECC.BinaryField.FiniteField (" + this.modulus().asString() + ")";
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'modulus': function() {
+		return this._modulus;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'_module': function(aValue) {
+		var	result;
+		var modulusComparison;
+//console.log(">>> binaryField.finiteField.(standard)module");
+		
+		modulusComparison = Clipperz.Crypto.ECC.BinaryField.WordArrayValue.compare(aValue, this.modulus()._value);
+
+		if (modulusComparison < 0) {
+			result = aValue;
+		} else if (modulusComparison == 0) {
+			result = [0];
+		} else {
+			var modulusBitSize;
+			var resultBitSize;
+			
+			result = aValue;
+
+			modulusBitSize = this.modulus().bitSize();
+			resultBitSize = Clipperz.Crypto.ECC.BinaryField.WordArrayValue.bitSize(result);
+			while (resultBitSize >= modulusBitSize) {
+				result = Clipperz.Crypto.ECC.BinaryField.WordArrayValue.xor(result, Clipperz.Crypto.ECC.BinaryField.WordArrayValue.shiftLeft(this.modulus()._value, resultBitSize - modulusBitSize));
+				resultBitSize = Clipperz.Crypto.ECC.BinaryField.WordArrayValue.bitSize(result);
+			}
+		}
+//console.log("<<< binaryField.finiteField.(standard)module");
+		
+		return result;
+	},
+	
+	'module': function(aValue) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(this._module(aValue._value));
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'_add': function(a, b) {
+		return Clipperz.Crypto.ECC.BinaryField.WordArrayValue.xor(a, b);
+	},
+	
+	'add': function(a, b) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(this._add(a._value, b._value));
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'negate': function(aValue) {
+		return aValue.clone();
+	},
+
+	//-----------------------------------------------------------------------------
+/ *
+	'multiply': function(a, b) {
+		var result;
+		var valueToXor;
+		var i,c;
+
+		result = Clipperz.Crypto.ECC.BinaryField.Value.O;
+		valueToXor = b;
+		c = a.bitSize();
+		for (i=0; i<c; i++) {
+			if (a.isBitSet(i) === true) {
+				result = result.xor(valueToXor);
+			}
+			valueToXor = valueToXor.shiftLeft(1);
+		}
+		result = this.module(result);
+
+		return result;
+	},
+* /
+
+	'_multiply': function(a, b) {
+		var result;
+		var valueToXor;
+		var i,c;
+
+		result = [0];
+		valueToXor = b;
+		c = Clipperz.Crypto.ECC.BinaryField.WordArrayValue.bitSize(a);
+		for (i=0; i<c; i++) {
+			if (Clipperz.Crypto.ECC.BinaryField.WordArrayValue.isBitSet(a, i) === true) {
+				result = Clipperz.Crypto.ECC.BinaryField.WordArrayValue.xor(result, valueToXor);
+			}
+			valueToXor = Clipperz.Crypto.ECC.BinaryField.WordArrayValue.shiftLeft(valueToXor, 1);
+		}
+		result = this._module(result);
+
+		return result;
+	},
+
+	'multiply': function(a, b) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(this._multiply(a._value, b._value));
+	},
+	
+	//-----------------------------------------------------------------------------
+	//
+	//	Guide to Elliptic Curve Cryptography
+	//	Darrel Hankerson, Alfred Menezes, Scott Vanstone
+	//	- Pag: 49, Alorithm 2.34
+	//	
+	//-----------------------------------------------------------------------------
+/ *
+	'square': function(aValue) {
+		var	result;
+		var	t;
+		var i,c;
+		
+		result = [0];
+		t = Math.max(a)
+		c = 32;
+		for (i=0; i<c; i++) {
+			var ii, cc;
+			
+			cc = 
+		}
+		
+		
+		
+		
+		return result;
+	},
+* /	
+	//-----------------------------------------------------------------------------
+
+	'inverse': function(aValue) {
+		var	result;
+		var b, c;
+		var u, v;
+		
+		b = Clipperz.Crypto.ECC.BinaryField.Value.I;
+		c = Clipperz.Crypto.ECC.BinaryField.Value.O;
+		u = this.module(aValue);
+		v = this.modulus();
+		
+		while (u.bitSize() > 1) {
+			var	bitDifferenceSize;
+			
+			bitDifferenceSize = u.bitSize() - v.bitSize();
+			if (bitDifferenceSize < 0) {
+				var swap;
+				
+				swap = u;
+				u = v;
+				v = swap;
+				
+				swap = c;
+				c = b;
+				b = swap;
+				
+				bitDifferenceSize = -bitDifferenceSize;
+			}
+
+			u = this.add(u, v.shiftLeft(bitDifferenceSize));
+			b = this.add(b, c.shiftLeft(bitDifferenceSize))
+		}
+
+		result = this.module(b);
+		
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
+Clipperz.Crypto.ECC.BinaryField.Curve = function(args) {
+	args = args || {};
+
+	this._modulus = args.modulus;
+	
+	this._a = args.a;
+	this._b = args.b;
+	this._G = args.G;
+	this._r = args.r;
+	this._h = args.h;
+
+	this._finiteField = null;
+	
+	return this;
+}
+
+Clipperz.Crypto.ECC.BinaryField.Curve.prototype = MochiKit.Base.update(null, {
+
+	'asString': function() {
+		return "Clipperz.Crypto.ECC.BinaryField.Curve";
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'modulus': function() {
+		return this._modulus;
+	},
+	
+	'a': function() {
+		return this._a;
+	},
+	
+	'b': function() {
+		return this._b;
+	},
+	
+	'G': function() {
+		return this._G;
+	},
+	
+	'r': function() {
+		return this._r;
+	},
+	
+	'h': function() {
+		return this._h;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'finiteField': function() {
+		if (this._finiteField == null) {
+			this._finiteField = new Clipperz.Crypto.ECC.BinaryField.FiniteField({modulus:this.modulus()})
+		}
+		
+		return this._finiteField;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'negate': function(aPointA) {
+		var result;
+
+		result = new Clipperz.Crypto.ECC.Point({x:aPointA.x(), y:this.finiteField().add(aPointA.y(), aPointA.x())})
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'add': function(aPointA, aPointB) {
+		var result;
+
+//console.log(">>> ECC.BinaryField.Curve.add");
+		if (aPointA.isZero()) {
+//console.log("--- pointA == zero");
+			result = aPointB;
+		} else if (aPointB.isZero()) {
+//console.log("--- pointB == zero");
+			result = aPointA;
+		} else if (	(aPointA.x().compare(aPointB.x()) == 0) &&
+					((aPointA.y().compare(aPointB.y()) != 0) || aPointB.x().isZero()))
+		{
+//console.log("compare A.x - B.x: ", aPointA.x().compare(aPointB.x()));
+//console.log("compare A.y - B.y: ", (aPointA.y().compare(aPointB.y()) != 0));
+//console.log("compare B.x.isZero(): ", aPointB.x().isZero());
+
+//console.log("--- result = zero");
+			result = new Clipperz.Crypto.ECC.BinaryField.Point({x:Clipperz.Crypto.ECC.BinaryField.Value.O, y:Clipperz.Crypto.ECC.BinaryField.Value.O});
+		} else {
+//console.log("--- result = ELSE");
+			var	f2m;
+			var x, y;
+			var lambda;
+
+			f2m = this.finiteField();
+			
+			if (aPointA.x().compare(aPointB.x()) != 0) {
+//console.log(" a.x != b.x");
+				lambda =	f2m.multiply(
+								f2m.add(aPointA.y(), aPointB.y()),
+								f2m.inverse(f2m.add(aPointA.x(), aPointB.x()))
+							);
+				x = f2m.add(this.a(), f2m.multiply(lambda, lambda));
+				x = f2m.add(x, lambda);
+				x = f2m.add(x, aPointA.x());
+				x = f2m.add(x, aPointB.x());
+			} else {
+//console.log(" a.x == b.x");
+				lambda = f2m.add(aPointB.x(), f2m.multiply(aPointB.y(), f2m.inverse(aPointB.x())));
+//console.log(" lambda: " + lambda.asString(16));
+				x = f2m.add(this.a(), f2m.multiply(lambda, lambda));
+//console.log(" x (step 1): " + x.asString(16));
+				x = f2m.add(x, lambda);
+//console.log(" x (step 2): " + x.asString(16));
+			}
+			
+			y = f2m.multiply(f2m.add(aPointB.x(), x), lambda);
+//console.log(" y (step 1): " + y.asString(16));
+			y = f2m.add(y, x);
+//console.log(" y (step 2): " + y.asString(16));
+			y = f2m.add(y, aPointB.y());
+//console.log(" y (step 3): " + y.asString(16));
+
+			result = new Clipperz.Crypto.ECC.BinaryField.Point({x:x, y:y})
+		}
+//console.log("<<< ECC.BinaryField.Curve.add");
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'multiply': function(aValue, aPoint) {
+		var result;
+
+console.profile();
+		result = new Clipperz.Crypto.ECC.BinaryField.Point({x:Clipperz.Crypto.ECC.BinaryField.Value.O, y:Clipperz.Crypto.ECC.BinaryField.Value.O});
+		
+		if (aValue.isZero() == false) {
+			var k, Q;
+			var i;
+			var countIndex; countIndex = 0;
+			
+			if (aValue.compare(Clipperz.Crypto.ECC.BinaryField.WordArrayValue.O) > 0) {
+				k = aValue;
+				Q = aPoint;
+			} else {
+MochiKit.Logging.logError("The Clipperz.Crypto.ECC.BinaryFields.Value does not work with negative values!!!!");
+				k = aValue.negate();
+				Q = this.negate(aPoint);
+			}
+
+//console.log("k: " + k.toString(16));
+//console.log("k.bitSize: " + k.bitSize());
+			for (i=k.bitSize()-1; i>=0; i--) {
+				result = this.add(result, result);
+				if (k.isBitSet(i)) {
+					result = this.add(result, Q);
+				}
+				
+//				if (countIndex==100) {console.log("multiply.break"); break;} else countIndex++;
+			}
+		}
+console.profileEnd();
+		
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
+//#############################################################################
+/ *
+Clipperz.Crypto.ECC.Key = function(args) {
+	args = args || {};
+
+	return this;
+}
+
+Clipperz.Crypto.ECC.Key.prototype = MochiKit.Base.update(null, {
+
+	'asString': function() {
+		return "Clipperz.Crypto.ECC.Key";
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+* /
+//#############################################################################
+
+
+//#############################################################################
+
+Clipperz.Crypto.ECC.StandardCurves = {};
+
+MochiKit.Base.update(Clipperz.Crypto.ECC.StandardCurves, {
+/ *
+	'_K571': null,
+	'K571': function() {
+		if (Clipperz.Crypto.ECC.StandardCurves._K571 == null) {
+			Clipperz.Crypto.ECC.StandardCurves._K571 = new Clipperz.Crypto.ECC.Curve.Koblitz({
+				exadecimalForm: '80000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000425',
+				a: new Clipperz.Crypto.BigInt(0),
+				G: new Clipperz.Crypto.ECC.Point({
+					x: new Clipperz.Crypto.BigInt('26eb7a859923fbc82189631f8103fe4ac9ca2970012d5d46024804801841ca44370958493b205e647da304db4ceb08cbbd1ba39494776fb988b47174dca88c7e2945283a01c8972', 16),
+					y: new Clipperz.Crypto.BigInt('349dc807f4fbf374f4aeade3bca95314dd58cec9f307a54ffc61efc006d8a2c9d4979c0ac44aea74fbebbb9f772aedcb620b01a7ba7af1b320430c8591984f601cd4c143ef1c7a3', 16)
+				}),
+				n: new Clipperz.Crypto.BigInt('1932268761508629172347675945465993672149463664853217499328617625725759571144780212268133978522706711834706712800825351461273674974066617311929682421617092503555733685276673', 16),
+				h: new Clipperz.Crypto.BigInt(4)
+			});
+		}
+		
+		return Clipperz.Crypto.ECC.StandardCurves._K571;
+	},
+* /
+	//-----------------------------------------------------------------------------
+
+	'_B571': null,
+	'B571': function() {	//	f(z) = z^571 + z^10 + z^5 + z^2 + 1
+		if (Clipperz.Crypto.ECC.StandardCurves._B571 == null) {
+			Clipperz.Crypto.ECC.StandardCurves._B571 = new Clipperz.Crypto.ECC.BinaryField.Curve({
+				modulus: new Clipperz.Crypto.ECC.BinaryField.Value('80000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000425', 16),
+				a: new Clipperz.Crypto.ECC.BinaryField.Value('1', 16),
+				b: new Clipperz.Crypto.ECC.BinaryField.Value('02f40e7e2221f295de297117b7f3d62f5c6a97ffcb8ceff1cd6ba8ce4a9a18ad84ffabbd8efa59332be7ad6756a66e294afd185a78ff12aa520e4de739baca0c7ffeff7f2955727a', 16),
+				G: new Clipperz.Crypto.ECC.BinaryField.Point({
+					x: new Clipperz.Crypto.ECC.BinaryField.Value('0303001d34b856296c16c0d40d3cd7750a93d1d2955fa80aa5f40fc8db7b2abdbde53950f4c0d293cdd711a35b67fb1499ae60038614f1394abfa3b4c850d927e1e7769c8eec2d19', 16),
+					y: new Clipperz.Crypto.ECC.BinaryField.Value('037bf27342da639b6dccfffeb73d69d78c6c27a6009cbbca1980f8533921e8a684423e43bab08a576291af8f461bb2a8b3531d2f0485c19b16e2f1516e23dd3c1a4827af1b8ac15b', 16)
+				}),
+//				r: new Clipperz.Crypto.ECC.BinaryField.Value('3864537523017258344695351890931987344298927329706434998657235251451519142289560424536143999389415773083133881121926944486246872462816813070234528288303332411393191105285703', 10),
+				r: new Clipperz.Crypto.ECC.BinaryField.Value('03ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffe661ce18ff55987308059b186823851ec7dd9ca1161de93d5174d66e8382e9bb2fe84e47', 16),
+				h: new Clipperz.Crypto.ECC.BinaryField.Value('2', 16)
+
+//				S: new Clipperz.Crypto.ECC.BinaryField.Value('2aa058f73a0e33ab486b0f610410c53a7f132310', 10),
+//				n: new Clipperz.Crypto.ECC.BinaryField.Value('03ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffe661ce18ff55987308059b186823851ec7dd9ca1161de93d5174d66e8382e9bb2fe84e47', 16),
+			});
+			
+			//-----------------------------------------------------------------------------
+			//
+			//	Guide to Elliptic Curve Cryptography
+			//	Darrel Hankerson, Alfred Menezes, Scott Vanstone
+			//	- Pag: 56, Alorithm 2.45 (with a typo!!!)
+			//	
+			//-----------------------------------------------------------------------------
+			//
+			//		http://www.milw0rm.com/papers/136
+			//
+			//		-------------------------------------------------------------------------
+			//		  Polynomial Reduction Algorithm Modulo f571 
+			//		-------------------------------------------------------------------------
+			//		
+			//		  Input:  Polynomial p(x) of degree 1140 or less, stored as 
+			//		          an array of 2T machinewords.
+			//		  Output: p(x) mod f571(x)
+			//		
+			//		  FOR i = T-1, ..., 0 DO
+			//		      SET X  := P[i+T]
+			//		      P[i]   := P[i]   ^ (X<<5) ^ (X<<7) ^ (X<<10) ^ (X<<15)
+			//		      P[i+1] := P[i+1] ^ (X>>17) ^ (X>>22) ^ (X>>25) ^ (X>>27)
+			//		
+			//		  SET X  := P[T-1] >> 27
+			//		  P[0]   := P[0] ^ X ^ (X<<2) ^ (X<<5) ^ (X<<10)
+			//		  P[T-1] := P[T-1] & 0x07ffffff
+			//		
+			//		  RETURN P[T-1],...,P[0]
+			//		
+			//		-------------------------------------------------------------------------
+			//		
+			Clipperz.Crypto.ECC.StandardCurves._B571.finiteField().module = function(aValue) {
+				var	result;
+				var	C, T;
+				var i;
+		
+//console.log(">>> binaryField.finiteField.(improved)module");
+//				C = aValue.value().slice(0);
+				C = aValue._value.slice(0);
+				for (i=35; i>=18; i--) {
+					T = C[i];
+					C[i-18] = (((C[i-18] ^ (T<<5) ^ (T<<7) ^ (T<<10) ^ (T<<15)) & 0xffffffff) >>> 0);
+					C[i-17] = ((C[i-17] ^ (T>>>27) ^ (T>>>25) ^ (T>>>22) ^ (T>>>17)) >>> 0);
+				}
+				T = (C[17] >>> 27);
+				C[0] = ((C[0] ^ T ^ ((T<<2) ^ (T<<5) ^ (T<<10)) & 0xffffffff) >>> 0);
+				C[17] = (C[17] & 0x07ffffff);
+
+				for(i=18; i<=35; i++) {
+					C[i] = 0;
+				}
+				
+				result = new Clipperz.Crypto.ECC.BinaryField.WordArrayValue(C);
+//console.log("<<< binaryField.finiteField.(improved)module");
+
+				return result;
+			};
+		}
+		
+		return Clipperz.Crypto.ECC.StandardCurves._B571;
+	},
+
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+*/
diff --git a/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/Curve.js b/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/Curve.js
new file mode 100644
index 0000000..042ca6c
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/Curve.js
@@ -0,0 +1,461 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.ByteArray) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.ECC depends on Clipperz.ByteArray!";
+}  
+if (typeof(Clipperz.Crypto.ECC) == 'undefined') { Clipperz.Crypto.ECC = {}; }
+if (typeof(Clipperz.Crypto.ECC.BinaryField) == 'undefined') { Clipperz.Crypto.ECC.BinaryField = {}; }
+
+Clipperz.Crypto.ECC.BinaryField.Curve = function(args) {
+	args = args || {};
+
+	this._modulus = args.modulus;
+	
+	this._a = args.a;
+	this._b = args.b;
+	this._G = args.G;
+	this._r = args.r;
+	this._h = args.h;
+
+	this._finiteField = null;
+	
+	return this;
+}
+
+Clipperz.Crypto.ECC.BinaryField.Curve.prototype = MochiKit.Base.update(null, {
+
+	'asString': function() {
+		return "Clipperz.Crypto.ECC.BinaryField.Curve";
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'modulus': function() {
+		return this._modulus;
+	},
+	
+	'a': function() {
+		return this._a;
+	},
+	
+	'b': function() {
+		return this._b;
+	},
+	
+	'G': function() {
+		return this._G;
+	},
+	
+	'r': function() {
+		return this._r;
+	},
+	
+	'h': function() {
+		return this._h;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'finiteField': function() {
+		if (this._finiteField == null) {
+			this._finiteField = new Clipperz.Crypto.ECC.BinaryField.FiniteField({modulus:this.modulus()})
+		}
+		
+		return this._finiteField;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'negate': function(aPointA) {
+		var result;
+
+		result = new Clipperz.Crypto.ECC.Point({x:aPointA.x(), y:this.finiteField().add(aPointA.y(), aPointA.x())})
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'add': function(aPointA, aPointB) {
+		var result;
+
+//console.log(">>> ECC.BinaryField.Curve.add");
+		if (aPointA.isZero()) {
+//console.log("--- pointA == zero");
+			result = aPointB;
+		} else if (aPointB.isZero()) {
+//console.log("--- pointB == zero");
+			result = aPointA;
+		} else if (	(aPointA.x().compare(aPointB.x()) == 0) && ((aPointA.y().compare(aPointB.y()) != 0) || aPointB.x().isZero())) {
+//console.log("compare A.x - B.x: ", aPointA.x().compare(aPointB.x()));
+//console.log("compare A.y - B.y: ", (aPointA.y().compare(aPointB.y()) != 0));
+//console.log("compare B.x.isZero(): ", aPointB.x().isZero());
+
+//console.log("--- result = zero");
+			result = new Clipperz.Crypto.ECC.BinaryField.Point({x:Clipperz.Crypto.ECC.BinaryField.Value.O, y:Clipperz.Crypto.ECC.BinaryField.Value.O});
+		} else {
+//console.log("--- result = ELSE");
+			var	f2m;
+			var x, y;
+			var lambda;
+			var aX, aY, bX, bY;
+		
+			aX = aPointA.x()._value;
+			aY = aPointA.y()._value;
+			bX = aPointB.x()._value;
+			bY = aPointB.y()._value;
+
+			f2m = this.finiteField();
+			
+			if (aPointA.x().compare(aPointB.x()) != 0) {
+//console.log(" a.x != b.x");
+				lambda =	f2m._fastMultiply(
+								f2m._add(aY, bY),
+								f2m._inverse(f2m._add(aX, bX))
+							);
+				x = f2m._add(this.a()._value, f2m._square(lambda));
+				f2m._overwriteAdd(x, lambda);
+				f2m._overwriteAdd(x, aX);
+				f2m._overwriteAdd(x, bX);
+			} else {
+//console.log(" a.x == b.x");
+				lambda = f2m._add(bX, f2m._fastMultiply(bY, f2m._inverse(bX)));
+//console.log(" lambda: " + lambda.asString(16));
+				x = f2m._add(this.a()._value, f2m._square(lambda));
+//console.log(" x (step 1): " + x.asString(16));
+				f2m._overwriteAdd(x, lambda);
+//console.log(" x (step 2): " + x.asString(16));
+			}
+			
+			y = f2m._fastMultiply(f2m._add(bX, x), lambda);
+//console.log(" y (step 1): " + y.asString(16));
+			f2m._overwriteAdd(y, x);
+//console.log(" y (step 2): " + y.asString(16));
+			f2m._overwriteAdd(y, bY);
+//console.log(" y (step 3): " + y.asString(16));
+
+			result = new Clipperz.Crypto.ECC.BinaryField.Point({x:new Clipperz.Crypto.ECC.BinaryField.Value(x), y:new Clipperz.Crypto.ECC.BinaryField.Value(y)})
+		}
+//console.log("<<< ECC.BinaryField.Curve.add");
+		
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'overwriteAdd': function(aPointA, aPointB) {
+		if (aPointA.isZero()) {
+//			result = aPointB;
+			aPointA._x._value = aPointB._x._value;
+			aPointA._y._value = aPointB._y._value;
+		} else if (aPointB.isZero()) {
+//			result = aPointA;
+		} else if (	(aPointA.x().compare(aPointB.x()) == 0) && ((aPointA.y().compare(aPointB.y()) != 0) || aPointB.x().isZero())) {
+//			result = new Clipperz.Crypto.ECC.BinaryField.Point({x:Clipperz.Crypto.ECC.BinaryField.Value.O, y:Clipperz.Crypto.ECC.BinaryField.Value.O});
+			aPointA._x = Clipperz.Crypto.ECC.BinaryField.Value.O;
+			aPointA._y = Clipperz.Crypto.ECC.BinaryField.Value.O;
+		} else {
+			var	f2m;
+			var x, y;
+			var lambda;
+			var aX, aY, bX, bY;
+		
+			aX = aPointA.x()._value;
+			aY = aPointA.y()._value;
+			bX = aPointB.x()._value;
+			bY = aPointB.y()._value;
+
+			f2m = this.finiteField();
+			
+			if (aPointA.x().compare(aPointB.x()) != 0) {
+//console.log(" a.x != b.x");
+				lambda =	f2m._fastMultiply(
+								f2m._add(aY, bY),
+								f2m._inverse(f2m._add(aX, bX))
+							);
+				x = f2m._add(this.a()._value, f2m._square(lambda));
+				f2m._overwriteAdd(x, lambda);
+				f2m._overwriteAdd(x, aX);
+				f2m._overwriteAdd(x, bX);
+			} else {
+//console.log(" a.x == b.x");
+				lambda = f2m._add(bX, f2m._fastMultiply(bY, f2m._inverse(bX)));
+//console.log(" lambda: " + lambda.asString(16));
+				x = f2m._add(this.a()._value, f2m._square(lambda));
+//console.log(" x (step 1): " + x.asString(16));
+				f2m._overwriteAdd(x, lambda);
+//console.log(" x (step 2): " + x.asString(16));
+			}
+			
+			y = f2m._fastMultiply(f2m._add(bX, x), lambda);
+//console.log(" y (step 1): " + y.asString(16));
+			f2m._overwriteAdd(y, x);
+//console.log(" y (step 2): " + y.asString(16));
+			f2m._overwriteAdd(y, bY);
+//console.log(" y (step 3): " + y.asString(16));
+
+//			result = new Clipperz.Crypto.ECC.BinaryField.Point({x:new Clipperz.Crypto.ECC.BinaryField.Value(x), y:new Clipperz.Crypto.ECC.BinaryField.Value(y)})
+			aPointA._x._value = x;
+			aPointA._y._value = y;
+
+		}
+//console.log("<<< ECC.BinaryField.Curve.add");
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'multiply': function(aValue, aPoint) {
+		var result;
+
+//console.profile();
+		result = new Clipperz.Crypto.ECC.BinaryField.Point({x:Clipperz.Crypto.ECC.BinaryField.Value.O, y:Clipperz.Crypto.ECC.BinaryField.Value.O});
+		
+		if (aValue.isZero() == false) {
+			var k, Q;
+			var i;
+			var countIndex; countIndex = 0;
+			
+			if (aValue.compare(Clipperz.Crypto.ECC.BinaryField.Value.O) > 0) {
+				k = aValue;
+				Q = aPoint;
+			} else {
+MochiKit.Logging.logError("The Clipperz.Crypto.ECC.BinaryFields.Value does not work with negative values!!!!");
+				k = aValue.negate();
+				Q = this.negate(aPoint);
+			}
+
+//console.log("k: " + k.toString(16));
+//console.log("k.bitSize: " + k.bitSize());
+			for (i=k.bitSize()-1; i>=0; i--) {
+				result = this.add(result, result);
+//				this.overwriteAdd(result, result);
+				if (k.isBitSet(i)) {
+					result = this.add(result, Q);
+//					this.overwriteAdd(result, Q);
+				}
+				
+//				if (countIndex==100) {console.log("multiply.break"); break;} else countIndex++;
+			}
+		}
+//console.profileEnd();
+		
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+
+//#############################################################################
+
+Clipperz.Crypto.ECC.StandardCurves = {};
+
+MochiKit.Base.update(Clipperz.Crypto.ECC.StandardCurves, {
+/*
+	'_K571': null,
+	'K571': function() {
+		if (Clipperz.Crypto.ECC.StandardCurves._K571 == null) {
+			Clipperz.Crypto.ECC.StandardCurves._K571 = new Clipperz.Crypto.ECC.Curve.Koblitz({
+				exadecimalForm: '80000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000425',
+				a: new Clipperz.Crypto.BigInt(0),
+				G: new Clipperz.Crypto.ECC.Point({
+					x: new Clipperz.Crypto.BigInt('26eb7a859923fbc82189631f8103fe4ac9ca2970012d5d46024804801841ca44370958493b205e647da304db4ceb08cbbd1ba39494776fb988b47174dca88c7e2945283a01c8972', 16),
+					y: new Clipperz.Crypto.BigInt('349dc807f4fbf374f4aeade3bca95314dd58cec9f307a54ffc61efc006d8a2c9d4979c0ac44aea74fbebbb9f772aedcb620b01a7ba7af1b320430c8591984f601cd4c143ef1c7a3', 16)
+				}),
+				n: new Clipperz.Crypto.BigInt('1932268761508629172347675945465993672149463664853217499328617625725759571144780212268133978522706711834706712800825351461273674974066617311929682421617092503555733685276673', 16),
+				h: new Clipperz.Crypto.BigInt(4)
+			});
+		}
+		
+		return Clipperz.Crypto.ECC.StandardCurves._K571;
+	},
+*/
+	//-----------------------------------------------------------------------------
+
+	'_B571': null,
+	'B571': function() {	//	f(z) = z^571 + z^10 + z^5 + z^2 + 1
+		if (Clipperz.Crypto.ECC.StandardCurves._B571 == null) {
+			Clipperz.Crypto.ECC.StandardCurves._B571 = new Clipperz.Crypto.ECC.BinaryField.Curve({
+				modulus: new Clipperz.Crypto.ECC.BinaryField.Value('80000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000425', 16),
+				a: new Clipperz.Crypto.ECC.BinaryField.Value('1', 16),
+				b: new Clipperz.Crypto.ECC.BinaryField.Value('02f40e7e2221f295de297117b7f3d62f5c6a97ffcb8ceff1cd6ba8ce4a9a18ad84ffabbd8efa59332be7ad6756a66e294afd185a78ff12aa520e4de739baca0c7ffeff7f2955727a', 16),
+				G: new Clipperz.Crypto.ECC.BinaryField.Point({
+					x: new Clipperz.Crypto.ECC.BinaryField.Value('0303001d 34b85629 6c16c0d4 0d3cd775 0a93d1d2 955fa80a a5f40fc8 db7b2abd bde53950 f4c0d293 cdd711a3 5b67fb14 99ae6003 8614f139 4abfa3b4 c850d927 e1e7769c 8eec2d19', 16),
+					y: new Clipperz.Crypto.ECC.BinaryField.Value('037bf273 42da639b 6dccfffe b73d69d7 8c6c27a6 009cbbca 1980f853 3921e8a6 84423e43 bab08a57 6291af8f 461bb2a8 b3531d2f 0485c19b 16e2f151 6e23dd3c 1a4827af 1b8ac15b', 16)
+				}),
+				r: new Clipperz.Crypto.ECC.BinaryField.Value('03ffffff ffffffff ffffffff ffffffff ffffffff ffffffff ffffffff ffffffff ffffffff e661ce18 ff559873 08059b18 6823851e c7dd9ca1 161de93d 5174d66e 8382e9bb 2fe84e47', 16),
+				h: new Clipperz.Crypto.ECC.BinaryField.Value('2', 16)
+
+//				S: new Clipperz.Crypto.ECC.BinaryField.Value('2aa058f73a0e33ab486b0f610410c53a7f132310', 10),
+//				n: new Clipperz.Crypto.ECC.BinaryField.Value('03ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffe661ce18ff55987308059b186823851ec7dd9ca1161de93d5174d66e8382e9bb2fe84e47', 16),
+			});
+			
+			//-----------------------------------------------------------------------------
+			//
+			//	Guide to Elliptic Curve Cryptography
+			//	Darrel Hankerson, Alfred Menezes, Scott Vanstone
+			//	- Pag: 56, Alorithm 2.45 (with a typo!!!)
+			//	
+			//-----------------------------------------------------------------------------
+			//
+			//		http://www.milw0rm.com/papers/136
+			//
+			//		-------------------------------------------------------------------------
+			//		  Polynomial Reduction Algorithm Modulo f571 
+			//		-------------------------------------------------------------------------
+			//		
+			//		  Input:  Polynomial p(x) of degree 1140 or less, stored as 
+			//		          an array of 2T machinewords.
+			//		  Output: p(x) mod f571(x)
+			//		
+			//		  FOR i = T-1, ..., 0 DO
+			//		      SET X  := P[i+T]
+			//		      P[i]   := P[i]   ^ (X<<5) ^ (X<<7) ^ (X<<10) ^ (X<<15)
+			//		      P[i+1] := P[i+1] ^ (X>>17) ^ (X>>22) ^ (X>>25) ^ (X>>27)
+			//		
+			//		  SET X  := P[T-1] >> 27
+			//		  P[0]   := P[0] ^ X ^ (X<<2) ^ (X<<5) ^ (X<<10)
+			//		  P[T-1] := P[T-1] & 0x07ffffff
+			//		
+			//		  RETURN P[T-1],...,P[0]
+			//		
+			//		-------------------------------------------------------------------------
+			//		
+			Clipperz.Crypto.ECC.StandardCurves._B571.finiteField().slowModule = Clipperz.Crypto.ECC.StandardCurves._B571.finiteField().module;
+			Clipperz.Crypto.ECC.StandardCurves._B571.finiteField().module = function(aValue) {
+				var	result;
+				
+				if (aValue.bitSize() > 1140) {
+					MochiKit.Logging.logWarning("ECC.StandarCurves.B571.finiteField().module: falling back to default implementation");
+					result = Clipperz.Crypto.ECC.StandardCurves._B571.finiteField().slowModule(aValue);
+				} else {
+					var	C, T;
+					var i;
+		
+//console.log(">>> binaryField.finiteField.(improved)module");
+//					C = aValue.value().slice(0);
+					C = aValue._value.slice(0);
+					for (i=35; i>=18; i--) {
+						T = C[i];
+						C[i-18] = (((C[i-18] ^ (T<<5) ^ (T<<7) ^ (T<<10) ^ (T<<15)) & 0xffffffff) >>> 0);
+						C[i-17] = ((C[i-17] ^ (T>>>27) ^ (T>>>25) ^ (T>>>22) ^ (T>>>17)) >>> 0);
+					}
+					T = (C[17] >>> 27);
+					C[0] = ((C[0] ^ T ^ ((T<<2) ^ (T<<5) ^ (T<<10)) & 0xffffffff) >>> 0);
+					C[17] = (C[17] & 0x07ffffff);
+
+					for(i=18; i<=35; i++) {
+						C[i] = 0;
+					}
+				
+					result = new Clipperz.Crypto.ECC.BinaryField.Value(C);
+//console.log("<<< binaryField.finiteField.(improved)module");
+				}
+			
+				return result;
+			};
+		}
+		
+		return Clipperz.Crypto.ECC.StandardCurves._B571;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'_B283': null,
+	'B283': function() {	//	f(z) = z^283 + z^12 + z^7 + z^5 + 1
+		if (Clipperz.Crypto.ECC.StandardCurves._B283 == null) {
+			Clipperz.Crypto.ECC.StandardCurves._B283 = new Clipperz.Crypto.ECC.BinaryField.Curve({
+//				modulus: new Clipperz.Crypto.ECC.BinaryField.Value('10000000 00000000 00000000 00000000 00000000 00000000 00000000 00000000 000010a1', 16),
+				modulus: new Clipperz.Crypto.ECC.BinaryField.Value('08000000 00000000 00000000 00000000 00000000 00000000 00000000 00000000 000010a1', 16),
+				a: new Clipperz.Crypto.ECC.BinaryField.Value('1', 16),
+				b: new Clipperz.Crypto.ECC.BinaryField.Value('027b680a c8b8596d a5a4af8a 19a0303f ca97fd76 45309fa2 a581485a f6263e31 3b79a2f5', 16),
+				G: new Clipperz.Crypto.ECC.BinaryField.Point({
+					x: new Clipperz.Crypto.ECC.BinaryField.Value('05f93925 8db7dd90 e1934f8c 70b0dfec 2eed25b8 557eac9c 80e2e198 f8cdbecd 86b12053', 16),
+					y: new Clipperz.Crypto.ECC.BinaryField.Value('03676854 fe24141c b98fe6d4 b20d02b4 516ff702 350eddb0 826779c8 13f0df45 be8112f4', 16)
+				}),
+				r: new Clipperz.Crypto.ECC.BinaryField.Value('03ffffff ffffffff ffffffff ffffffff ffffef90 399660fc 938a9016 5b042a7c efadb307', 16),
+				h: new Clipperz.Crypto.ECC.BinaryField.Value('2', 16)
+
+//				S: new Clipperz.Crypto.ECC.BinaryField.Value('2aa058f73a0e33ab486b0f610410c53a7f132310', 10),
+//				n: new Clipperz.Crypto.ECC.BinaryField.Value('03ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffe661ce18ff55987308059b186823851ec7dd9ca1161de93d5174d66e8382e9bb2fe84e47', 16),
+			});
+			
+			//-----------------------------------------------------------------------------
+			//
+			//	Guide to Elliptic Curve Cryptography
+			//	Darrel Hankerson, Alfred Menezes, Scott Vanstone
+			//	- Pag: 56, Alorithm 2.43
+			//	
+			//-----------------------------------------------------------------------------
+			Clipperz.Crypto.ECC.StandardCurves._B283.finiteField().slowModule = Clipperz.Crypto.ECC.StandardCurves._B283.finiteField().module;
+			Clipperz.Crypto.ECC.StandardCurves._B283.finiteField().module = function(aValue) {
+				var	result;
+
+				if (aValue.bitSize() > 564) {
+					MochiKit.Logging.logWarning("ECC.StandarCurves.B283.finiteField().module: falling back to default implementation");
+					result = Clipperz.Crypto.ECC.StandardCurves._B283.finiteField().slowModule(aValue);
+				} else {
+					var	C, T;
+					var i;
+					
+//console.log(">>> binaryField.finiteField.(improved)module");
+					C = aValue._value.slice(0);
+					for (i=17; i>=9; i--) {
+						T = C[i];
+						C[i-9] = (((C[i-9] ^ (T<<5) ^ (T<<10) ^ (T<<12) ^ (T<<17)) & 0xffffffff) >>> 0);
+						C[i-8] = ((C[i-8] ^ (T>>>27) ^ (T>>>22) ^ (T>>>20) ^ (T>>>15)) >>> 0);
+					}
+					T = (C[8] >>> 27);
+					C[0] = ((C[0] ^ T ^ ((T<<5) ^ (T<<7) ^ (T<<12)) & 0xffffffff) >>> 0);
+					C[8] = (C[8] & 0x07ffffff);
+
+					for(i=9; i<=17; i++) {
+						C[i] = 0;
+					}
+				
+					result = new Clipperz.Crypto.ECC.BinaryField.Value(C);
+//console.log("<<< binaryField.finiteField.(improved)module");
+				}
+				
+				return result;
+			};
+		}
+		
+		return Clipperz.Crypto.ECC.StandardCurves._B283;
+	},
+
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
diff --git a/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/FiniteField.js b/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/FiniteField.js
new file mode 100644
index 0000000..3ddf2ec
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/FiniteField.js
@@ -0,0 +1,526 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.ByteArray) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.ECC depends on Clipperz.ByteArray!";
+}  
+if (typeof(Clipperz.Crypto.ECC) == 'undefined') { Clipperz.Crypto.ECC = {}; }
+if (typeof(Clipperz.Crypto.ECC.BinaryField) == 'undefined') { Clipperz.Crypto.ECC.BinaryField = {}; }
+
+Clipperz.Crypto.ECC.BinaryField.FiniteField = function(args) {
+	args = args || {};
+	this._modulus = args.modulus;
+
+	return this;
+}
+
+Clipperz.Crypto.ECC.BinaryField.FiniteField.prototype = MochiKit.Base.update(null, {
+
+	'asString': function() {
+		return "Clipperz.Crypto.ECC.BinaryField.FiniteField (" + this.modulus().asString() + ")";
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'modulus': function() {
+		return this._modulus;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'_module': function(aValue) {
+		var	result;
+		var modulusComparison;
+//console.log(">>> binaryField.finiteField.(standard)module");
+		
+		modulusComparison = Clipperz.Crypto.ECC.BinaryField.Value._compare(aValue, this.modulus()._value);
+
+		if (modulusComparison < 0) {
+			result = aValue;
+		} else if (modulusComparison == 0) {
+			result = [0];
+		} else {
+			var modulusBitSize;
+			var resultBitSize;
+			
+			result = aValue;
+
+			modulusBitSize = this.modulus().bitSize();
+			resultBitSize = Clipperz.Crypto.ECC.BinaryField.Value._bitSize(result);
+			while (resultBitSize >= modulusBitSize) {
+				Clipperz.Crypto.ECC.BinaryField.Value._overwriteXor(result, Clipperz.Crypto.ECC.BinaryField.Value._shiftLeft(this.modulus()._value, resultBitSize - modulusBitSize));
+				resultBitSize = Clipperz.Crypto.ECC.BinaryField.Value._bitSize(result);
+			}
+		}
+//console.log("<<< binaryField.finiteField.(standard)module");
+		
+		return result;
+	},
+	
+	'module': function(aValue) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(this._module(aValue._value.slice(0)));
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'_add': function(a, b) {
+		return Clipperz.Crypto.ECC.BinaryField.Value._xor(a, b);
+	},
+
+	'_overwriteAdd': function(a, b) {
+		Clipperz.Crypto.ECC.BinaryField.Value._overwriteXor(a, b);
+	},
+	
+	'add': function(a, b) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(this._add(a._value, b._value));
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'negate': function(aValue) {
+		return aValue.clone();
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'_multiply': function(a, b) {
+		var result;
+		var valueToXor;
+		var i,c;
+
+		result = [0];
+		valueToXor = b;
+		c = Clipperz.Crypto.ECC.BinaryField.Value._bitSize(a);
+		for (i=0; i<c; i++) {
+			if (Clipperz.Crypto.ECC.BinaryField.Value._isBitSet(a, i) === true) {
+				Clipperz.Crypto.ECC.BinaryField.Value._overwriteXor(result, valueToXor);
+			}
+			valueToXor = Clipperz.Crypto.ECC.BinaryField.Value._overwriteShiftLeft(valueToXor, 1);
+		}
+		result = this._module(result);
+
+		return result;
+	},
+
+	'multiply': function(a, b) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(this._multiply(a._value, b._value));
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'_fastMultiply': function(a, b) {
+		var result;
+		var B;
+		var i,c;
+		
+		result = [0];
+		B = b.slice(0);	//	Is this array copy avoidable?
+		c = 32;
+		for (i=0; i<c; i++) {
+			var ii, cc;
+			
+			cc = a.length;
+			for (ii=0; ii<cc; ii++) {
+				if (((a[ii] >>> i) & 0x01) == 1) {
+					Clipperz.Crypto.ECC.BinaryField.Value._overwriteXor(result, B, ii);
+				}
+			}
+			
+			if (i < (c-1)) {
+				B = Clipperz.Crypto.ECC.BinaryField.Value._overwriteShiftLeft(B, 1);
+			}
+		}
+		result = this._module(result);
+		
+		return result;
+	},
+	
+	'fastMultiply': function(a, b) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(this._fastMultiply(a._value, b._value));
+	},
+	
+	//-----------------------------------------------------------------------------
+	//
+	//	Guide to Elliptic Curve Cryptography
+	//	Darrel Hankerson, Alfred Menezes, Scott Vanstone
+	//	- Pag: 49, Alorithm 2.34
+	//	
+	//-----------------------------------------------------------------------------
+
+	'_square': function(aValue) {
+		var result;
+		var value;
+		var c,i;
+		var precomputedValues;
+		
+		value = aValue;
+		result = new Array(value.length * 2);
+		precomputedValues = Clipperz.Crypto.ECC.BinaryField.FiniteField.squarePrecomputedBytes;
+		
+		c = value.length;
+		for (i=0; i<c; i++) {
+			result[i*2]  = precomputedValues[(value[i] & 0x000000ff)];
+			result[i*2] |= ((precomputedValues[(value[i] & 0x0000ff00) >>> 8]) << 16);
+
+			result[i*2 + 1]  = precomputedValues[(value[i] & 0x00ff0000) >>> 16];
+			result[i*2 + 1] |= ((precomputedValues[(value[i] & 0xff000000) >>> 24]) << 16);
+		}
+
+		return this._module(result);
+	},
+	
+	'square': function(aValue) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(this._square(aValue._value));
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'_inverse': function(aValue) {
+		var	result;
+		var b, c;
+		var u, v;
+		
+//		b = Clipperz.Crypto.ECC.BinaryField.Value.I._value;
+		b = [1];
+//		c = Clipperz.Crypto.ECC.BinaryField.Value.O._value;
+		c = [0];
+		u = this._module(aValue);
+		v = this.modulus()._value.slice(0);
+		
+		while (Clipperz.Crypto.ECC.BinaryField.Value._bitSize(u) > 1) {
+			var	bitDifferenceSize;
+			
+			bitDifferenceSize = Clipperz.Crypto.ECC.BinaryField.Value._bitSize(u) - Clipperz.Crypto.ECC.BinaryField.Value._bitSize(v);
+			if (bitDifferenceSize < 0) {
+				var swap;
+				
+				swap = u;
+				u = v;
+				v = swap;
+				
+				swap = c;
+				c = b;
+				b = swap;
+				
+				bitDifferenceSize = -bitDifferenceSize;
+			}
+
+			u = this._add(u, Clipperz.Crypto.ECC.BinaryField.Value._shiftLeft(v, bitDifferenceSize));
+			b = this._add(b, Clipperz.Crypto.ECC.BinaryField.Value._shiftLeft(c, bitDifferenceSize));
+//			this._overwriteAdd(u, Clipperz.Crypto.ECC.BinaryField.Value._shiftLeft(v, bitDifferenceSize));
+//			this._overwriteAdd(b, Clipperz.Crypto.ECC.BinaryField.Value._shiftLeft(c, bitDifferenceSize));
+		}
+
+		result = this._module(b);
+		
+		return result;
+	},
+	
+	'inverse': function(aValue) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(this._inverse(aValue._value));
+	},
+
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+
+Clipperz.Crypto.ECC.BinaryField.FiniteField.squarePrecomputedBytes = [
+	0x0000,	//	  0 = 0000 0000 -> 0000 0000 0000 0000
+	0x0001,	//	  1 = 0000 0001 -> 0000 0000 0000 0001
+	0x0004,	//	  2 = 0000 0010 -> 0000 0000 0000 0100
+	0x0005,	//	  3 = 0000 0011 -> 0000 0000 0000 0101
+	0x0010,	//	  4 = 0000 0100 -> 0000 0000 0001 0000
+	0x0011,	//	  5 = 0000 0101 -> 0000 0000 0001 0001
+	0x0014,	//	  6 = 0000 0110 -> 0000 0000 0001 0100
+	0x0015,	//	  7 = 0000 0111 -> 0000 0000 0001 0101
+	0x0040,	//	  8 = 0000 1000 -> 0000 0000 0100 0000
+	0x0041,	//	  9 = 0000 1001 -> 0000 0000 0100 0001
+	0x0044,	//	 10 = 0000 1010 -> 0000 0000 0100 0100
+	0x0045,	//	 11 = 0000 1011 -> 0000 0000 0100 0101
+	0x0050,	//	 12 = 0000 1100 -> 0000 0000 0101 0000
+	0x0051,	//	 13 = 0000 1101 -> 0000 0000 0101 0001
+	0x0054,	//	 14 = 0000 1110 -> 0000 0000 0101 0100
+	0x0055,	//	 15 = 0000 1111 -> 0000 0000 0101 0101
+
+	0x0100,	//	 16 = 0001 0000 -> 0000 0001 0000 0000
+	0x0101,	//	 17 = 0001 0001 -> 0000 0001 0000 0001
+	0x0104,	//	 18 = 0001 0010 -> 0000 0001 0000 0100
+	0x0105,	//	 19 = 0001 0011 -> 0000 0001 0000 0101
+	0x0110,	//	 20 = 0001 0100 -> 0000 0001 0001 0000
+	0x0111,	//	 21 = 0001 0101 -> 0000 0001 0001 0001
+	0x0114,	//	 22 = 0001 0110 -> 0000 0001 0001 0100
+	0x0115,	//	 23 = 0001 0111 -> 0000 0001 0001 0101
+	0x0140,	//	 24 = 0001 1000 -> 0000 0001 0100 0000
+	0x0141,	//	 25 = 0001 1001 -> 0000 0001 0100 0001
+	0x0144,	//	 26 = 0001 1010 -> 0000 0001 0100 0100
+	0x0145,	//	 27 = 0001 1011 -> 0000 0001 0100 0101
+	0x0150,	//	 28 = 0001 1100 -> 0000 0001 0101 0000
+	0x0151,	//	 28 = 0001 1101 -> 0000 0001 0101 0001
+	0x0154,	//	 30 = 0001 1110 -> 0000 0001 0101 0100
+	0x0155,	//	 31 = 0001 1111 -> 0000 0001 0101 0101
+
+	0x0400,	//	 32 = 0010 0000 -> 0000 0100 0000 0000
+	0x0401,	//	 33 = 0010 0001 -> 0000 0100 0000 0001
+	0x0404,	//	 34 = 0010 0010 -> 0000 0100 0000 0100
+	0x0405,	//	 35 = 0010 0011 -> 0000 0100 0000 0101
+	0x0410,	//	 36 = 0010 0100 -> 0000 0100 0001 0000
+	0x0411,	//	 37 = 0010 0101 -> 0000 0100 0001 0001
+	0x0414,	//	 38 = 0010 0110 -> 0000 0100 0001 0100
+	0x0415,	//	 39 = 0010 0111 -> 0000 0100 0001 0101
+	0x0440,	//	 40 = 0010 1000 -> 0000 0100 0100 0000
+	0x0441,	//	 41 = 0010 1001 -> 0000 0100 0100 0001
+	0x0444,	//	 42 = 0010 1010 -> 0000 0100 0100 0100
+	0x0445,	//	 43 = 0010 1011 -> 0000 0100 0100 0101
+	0x0450,	//	 44 = 0010 1100 -> 0000 0100 0101 0000
+	0x0451,	//	 45 = 0010 1101 -> 0000 0100 0101 0001
+	0x0454,	//	 46 = 0010 1110 -> 0000 0100 0101 0100
+	0x0455,	//	 47 = 0010 1111 -> 0000 0100 0101 0101
+
+	0x0500,	//	 48 = 0011 0000 -> 0000 0101 0000 0000
+	0x0501,	//	 49 = 0011 0001 -> 0000 0101 0000 0001
+	0x0504,	//	 50 = 0011 0010 -> 0000 0101 0000 0100
+	0x0505,	//	 51 = 0011 0011 -> 0000 0101 0000 0101
+	0x0510,	//	 52 = 0011 0100 -> 0000 0101 0001 0000
+	0x0511,	//	 53 = 0011 0101 -> 0000 0101 0001 0001
+	0x0514,	//	 54 = 0011 0110 -> 0000 0101 0001 0100
+	0x0515,	//	 55 = 0011 0111 -> 0000 0101 0001 0101
+	0x0540,	//	 56 = 0011 1000 -> 0000 0101 0100 0000
+	0x0541,	//	 57 = 0011 1001 -> 0000 0101 0100 0001
+	0x0544,	//	 58 = 0011 1010 -> 0000 0101 0100 0100
+	0x0545,	//	 59 = 0011 1011 -> 0000 0101 0100 0101
+	0x0550,	//	 60 = 0011 1100 -> 0000 0101 0101 0000
+	0x0551,	//	 61 = 0011 1101 -> 0000 0101 0101 0001
+	0x0554,	//	 62 = 0011 1110 -> 0000 0101 0101 0100
+	0x0555,	//	 63 = 0011 1111 -> 0000 0101 0101 0101
+
+	0x1000,	//	 64 = 0100 0000 -> 0001 0000 0000 0000
+	0x1001,	//	 65 = 0100 0001 -> 0001 0000 0000 0001
+	0x1004,	//	 66 = 0100 0010 -> 0001 0000 0000 0100
+	0x1005,	//	 67 = 0100 0011 -> 0001 0000 0000 0101
+	0x1010,	//	 68 = 0100 0100 -> 0001 0000 0001 0000
+	0x1011,	//	 69 = 0100 0101 -> 0001 0000 0001 0001
+	0x1014,	//	 70 = 0100 0110 -> 0001 0000 0001 0100
+	0x1015,	//	 71 = 0100 0111 -> 0001 0000 0001 0101
+	0x1040,	//	 72 = 0100 1000 -> 0001 0000 0100 0000
+	0x1041,	//	 73 = 0100 1001 -> 0001 0000 0100 0001
+	0x1044,	//	 74 = 0100 1010 -> 0001 0000 0100 0100
+	0x1045,	//	 75 = 0100 1011 -> 0001 0000 0100 0101
+	0x1050,	//	 76 = 0100 1100 -> 0001 0000 0101 0000
+	0x1051,	//	 77 = 0100 1101 -> 0001 0000 0101 0001
+	0x1054,	//	 78 = 0100 1110 -> 0001 0000 0101 0100
+	0x1055,	//	 79 = 0100 1111 -> 0001 0000 0101 0101
+
+	0x1100,	//	 80 = 0101 0000 -> 0001 0001 0000 0000
+	0x1101,	//	 81 = 0101 0001 -> 0001 0001 0000 0001
+	0x1104,	//	 82 = 0101 0010 -> 0001 0001 0000 0100
+	0x1105,	//	 83 = 0101 0011 -> 0001 0001 0000 0101
+	0x1110,	//	 84 = 0101 0100 -> 0001 0001 0001 0000
+	0x1111,	//	 85 = 0101 0101 -> 0001 0001 0001 0001
+	0x1114,	//	 86 = 0101 0110 -> 0001 0001 0001 0100
+	0x1115,	//	 87 = 0101 0111 -> 0001 0001 0001 0101
+	0x1140,	//	 88 = 0101 1000 -> 0001 0001 0100 0000
+	0x1141,	//	 89 = 0101 1001 -> 0001 0001 0100 0001
+	0x1144,	//	 90 = 0101 1010 -> 0001 0001 0100 0100
+	0x1145,	//	 91 = 0101 1011 -> 0001 0001 0100 0101
+	0x1150,	//	 92 = 0101 1100 -> 0001 0001 0101 0000
+	0x1151,	//	 93 = 0101 1101 -> 0001 0001 0101 0001
+	0x1154,	//	 94 = 0101 1110 -> 0001 0001 0101 0100
+	0x1155,	//	 95 = 0101 1111 -> 0001 0001 0101 0101
+                                           
+	0x1400,	//	 96 = 0110 0000 -> 0001 0100 0000 0000
+	0x1401,	//	 97 = 0110 0001 -> 0001 0100 0000 0001
+	0x1404,	//	 98 = 0110 0010 -> 0001 0100 0000 0100
+	0x1405,	//	 99 = 0110 0011 -> 0001 0100 0000 0101
+	0x1410,	//	100 = 0110 0100 -> 0001 0100 0001 0000
+	0x1411,	//	101 = 0110 0101 -> 0001 0100 0001 0001
+	0x1414,	//	102 = 0110 0110 -> 0001 0100 0001 0100
+	0x1415,	//	103 = 0110 0111 -> 0001 0100 0001 0101
+	0x1440,	//	104 = 0110 1000 -> 0001 0100 0100 0000
+	0x1441,	//	105 = 0110 1001 -> 0001 0100 0100 0001
+	0x1444,	//	106 = 0110 1010 -> 0001 0100 0100 0100
+	0x1445,	//	107 = 0110 1011 -> 0001 0100 0100 0101
+	0x1450,	//	108 = 0110 1100 -> 0001 0100 0101 0000
+	0x1451,	//	109 = 0110 1101 -> 0001 0100 0101 0001
+	0x1454,	//	110 = 0110 1110 -> 0001 0100 0101 0100
+	0x1455,	//	111 = 0110 1111 -> 0001 0100 0101 0101
+
+	0x1500,	//	112 = 0111 0000 -> 0001 0101 0000 0000
+	0x1501,	//	113 = 0111 0001 -> 0001 0101 0000 0001
+	0x1504,	//	114 = 0111 0010 -> 0001 0101 0000 0100
+	0x1505,	//	115 = 0111 0011 -> 0001 0101 0000 0101
+	0x1510,	//	116 = 0111 0100 -> 0001 0101 0001 0000
+	0x1511,	//	117 = 0111 0101 -> 0001 0101 0001 0001
+	0x1514,	//	118 = 0111 0110 -> 0001 0101 0001 0100
+	0x1515,	//	119 = 0111 0111 -> 0001 0101 0001 0101
+	0x1540,	//	120 = 0111 1000 -> 0001 0101 0100 0000
+	0x1541,	//	121 = 0111 1001 -> 0001 0101 0100 0001
+	0x1544,	//	122 = 0111 1010 -> 0001 0101 0100 0100
+	0x1545,	//	123 = 0111 1011 -> 0001 0101 0100 0101
+	0x1550,	//	124 = 0111 1100 -> 0001 0101 0101 0000
+	0x1551,	//	125 = 0111 1101 -> 0001 0101 0101 0001
+	0x1554,	//	126 = 0111 1110 -> 0001 0101 0101 0100
+	0x1555,	//	127 = 0111 1111 -> 0001 0101 0101 0101
+
+	0x4000,	//	128 = 1000 0000 -> 0100 0000 0000 0000
+	0x4001,	//	129 = 1000 0001 -> 0100 0000 0000 0001
+	0x4004,	//	130 = 1000 0010 -> 0100 0000 0000 0100
+	0x4005,	//	131 = 1000 0011 -> 0100 0000 0000 0101
+	0x4010,	//	132 = 1000 0100 -> 0100 0000 0001 0000
+	0x4011,	//	133 = 1000 0101 -> 0100 0000 0001 0001
+	0x4014,	//	134 = 1000 0110 -> 0100 0000 0001 0100
+	0x4015,	//	135 = 1000 0111 -> 0100 0000 0001 0101
+	0x4040,	//	136 = 1000 1000 -> 0100 0000 0100 0000
+	0x4041,	//	137 = 1000 1001 -> 0100 0000 0100 0001
+	0x4044,	//	138 = 1000 1010 -> 0100 0000 0100 0100
+	0x4045,	//	139 = 1000 1011 -> 0100 0000 0100 0101
+	0x4050,	//	140 = 1000 1100 -> 0100 0000 0101 0000
+	0x4051,	//	141 = 1000 1101 -> 0100 0000 0101 0001
+	0x4054,	//	142 = 1000 1110 -> 0100 0000 0101 0100
+	0x4055,	//	143 = 1000 1111 -> 0100 0000 0101 0101
+
+	0x4100,	//	144 = 1001 0000 -> 0100 0001 0000 0000
+	0x4101,	//	145 = 1001 0001 -> 0100 0001 0000 0001
+	0x4104,	//	146 = 1001 0010 -> 0100 0001 0000 0100
+	0x4105,	//	147 = 1001 0011 -> 0100 0001 0000 0101
+	0x4110,	//	148 = 1001 0100 -> 0100 0001 0001 0000
+	0x4111,	//	149 = 1001 0101 -> 0100 0001 0001 0001
+	0x4114,	//	150 = 1001 0110 -> 0100 0001 0001 0100
+	0x4115,	//	151 = 1001 0111 -> 0100 0001 0001 0101
+	0x4140,	//	152 = 1001 1000 -> 0100 0001 0100 0000
+	0x4141,	//	153 = 1001 1001 -> 0100 0001 0100 0001
+	0x4144,	//	154 = 1001 1010 -> 0100 0001 0100 0100
+	0x4145,	//	155 = 1001 1011 -> 0100 0001 0100 0101
+	0x4150,	//	156 = 1001 1100 -> 0100 0001 0101 0000
+	0x4151,	//	157 = 1001 1101 -> 0100 0001 0101 0001
+	0x4154,	//	158 = 1001 1110 -> 0100 0001 0101 0100
+	0x4155,	//	159 = 1001 1111 -> 0100 0001 0101 0101
+
+	0x4400,	//	160 = 1010 0000 -> 0100 0100 0000 0000
+	0x4401,	//	161 = 1010 0001 -> 0100 0100 0000 0001
+	0x4404,	//	162 = 1010 0010 -> 0100 0100 0000 0100
+	0x4405,	//	163 = 1010 0011 -> 0100 0100 0000 0101
+	0x4410,	//	164 = 1010 0100 -> 0100 0100 0001 0000
+	0x4411,	//	165 = 1010 0101 -> 0100 0100 0001 0001
+	0x4414,	//	166 = 1010 0110 -> 0100 0100 0001 0100
+	0x4415,	//	167 = 1010 0111 -> 0100 0100 0001 0101
+	0x4440,	//	168 = 1010 1000 -> 0100 0100 0100 0000
+	0x4441,	//	169 = 1010 1001 -> 0100 0100 0100 0001
+	0x4444,	//	170 = 1010 1010 -> 0100 0100 0100 0100
+	0x4445,	//	171 = 1010 1011 -> 0100 0100 0100 0101
+	0x4450,	//	172 = 1010 1100 -> 0100 0100 0101 0000
+	0x4451,	//	173 = 1010 1101 -> 0100 0100 0101 0001
+	0x4454,	//	174 = 1010 1110 -> 0100 0100 0101 0100
+	0x4455,	//	175 = 1010 1111 -> 0100 0100 0101 0101
+
+	0x4500,	//	176 = 1011 0000 -> 0100 0101 0000 0000
+	0x4501,	//	177 = 1011 0001 -> 0100 0101 0000 0001
+	0x4504,	//	178 = 1011 0010 -> 0100 0101 0000 0100
+	0x4505,	//	179 = 1011 0011 -> 0100 0101 0000 0101
+	0x4510,	//	180 = 1011 0100 -> 0100 0101 0001 0000
+	0x4511,	//	181 = 1011 0101 -> 0100 0101 0001 0001
+	0x4514,	//	182 = 1011 0110 -> 0100 0101 0001 0100
+	0x4515,	//	183 = 1011 0111 -> 0100 0101 0001 0101
+	0x4540,	//	184 = 1011 1000 -> 0100 0101 0100 0000
+	0x4541,	//	185 = 1011 1001 -> 0100 0101 0100 0001
+	0x4544,	//	186 = 1011 1010 -> 0100 0101 0100 0100
+	0x4545,	//	187 = 1011 1011 -> 0100 0101 0100 0101
+	0x4550,	//	188 = 1011 1100 -> 0100 0101 0101 0000
+	0x4551,	//	189 = 1011 1101 -> 0100 0101 0101 0001
+	0x4554,	//	190 = 1011 1110 -> 0100 0101 0101 0100
+	0x4555,	//	191 = 1011 1111 -> 0100 0101 0101 0101
+
+	0x5000,	//	192 = 1100 0000 -> 0101 0000 0000 0000
+	0x5001,	//	193 = 1100 0001 -> 0101 0000 0000 0001
+	0x5004,	//	194 = 1100 0010 -> 0101 0000 0000 0100
+	0x5005,	//	195 = 1100 0011 -> 0101 0000 0000 0101
+	0x5010,	//	196 = 1100 0100 -> 0101 0000 0001 0000
+	0x5011,	//	197 = 1100 0101 -> 0101 0000 0001 0001
+	0x5014,	//	198 = 1100 0110 -> 0101 0000 0001 0100
+	0x5015,	//	199 = 1100 0111 -> 0101 0000 0001 0101
+	0x5040,	//	200 = 1100 1000 -> 0101 0000 0100 0000
+	0x5041,	//	201 = 1100 1001 -> 0101 0000 0100 0001
+	0x5044,	//	202 = 1100 1010 -> 0101 0000 0100 0100
+	0x5045,	//	203 = 1100 1011 -> 0101 0000 0100 0101
+	0x5050,	//	204 = 1100 1100 -> 0101 0000 0101 0000
+	0x5051,	//	205 = 1100 1101 -> 0101 0000 0101 0001
+	0x5054,	//	206 = 1100 1110 -> 0101 0000 0101 0100
+	0x5055,	//	207 = 1100 1111 -> 0101 0000 0101 0101
+
+	0x5100,	//	208 = 1101 0000 -> 0101 0001 0000 0000
+	0x5101,	//	209 = 1101 0001 -> 0101 0001 0000 0001
+	0x5104,	//	210 = 1101 0010 -> 0101 0001 0000 0100
+	0x5105,	//	211 = 1101 0011 -> 0101 0001 0000 0101
+	0x5110,	//	212 = 1101 0100 -> 0101 0001 0001 0000
+	0x5111,	//	213 = 1101 0101 -> 0101 0001 0001 0001
+	0x5114,	//	214 = 1101 0110 -> 0101 0001 0001 0100
+	0x5115,	//	215 = 1101 0111 -> 0101 0001 0001 0101
+	0x5140,	//	216 = 1101 1000 -> 0101 0001 0100 0000
+	0x5141,	//	217 = 1101 1001 -> 0101 0001 0100 0001
+	0x5144,	//	218 = 1101 1010 -> 0101 0001 0100 0100
+	0x5145,	//	219 = 1101 1011 -> 0101 0001 0100 0101
+	0x5150,	//	220 = 1101 1100 -> 0101 0001 0101 0000
+	0x5151,	//	221 = 1101 1101 -> 0101 0001 0101 0001
+	0x5154,	//	222 = 1101 1110 -> 0101 0001 0101 0100
+	0x5155,	//	223 = 1101 1111 -> 0101 0001 0101 0101
+
+	0x5400,	//	224 = 1110 0000 -> 0101 0100 0000 0000
+	0x5401,	//	225 = 1110 0001 -> 0101 0100 0000 0001
+	0x5404,	//	226 = 1110 0010 -> 0101 0100 0000 0100
+	0x5405,	//	227 = 1110 0011 -> 0101 0100 0000 0101
+	0x5410,	//	228 = 1110 0100 -> 0101 0100 0001 0000
+	0x5411,	//	229 = 1110 0101 -> 0101 0100 0001 0001
+	0x5414,	//	230 = 1110 0110 -> 0101 0100 0001 0100
+	0x5415,	//	231 = 1110 0111 -> 0101 0100 0001 0101
+	0x5440,	//	232 = 1110 1000 -> 0101 0100 0100 0000
+	0x5441,	//	233 = 1110 1001 -> 0101 0100 0100 0001
+	0x5444,	//	234 = 1110 1010 -> 0101 0100 0100 0100
+	0x5445,	//	235 = 1110 1011 -> 0101 0100 0100 0101
+	0x5450,	//	236 = 1110 1100 -> 0101 0100 0101 0000
+	0x5451,	//	237 = 1110 1101 -> 0101 0100 0101 0001
+	0x5454,	//	238 = 1110 1110 -> 0101 0100 0101 0100
+	0x5455,	//	239 = 1110 1111 -> 0101 0100 0101 0101
+
+	0x5500,	//	240 = 1111 0000 -> 0101 0101 0000 0000
+	0x5501,	//	241 = 1111 0001 -> 0101 0101 0000 0001
+	0x5504,	//	242 = 1111 0010 -> 0101 0101 0000 0100
+	0x5505,	//	243 = 1111 0011 -> 0101 0101 0000 0101
+	0x5510,	//	244 = 1111 0100 -> 0101 0101 0001 0000
+	0x5511,	//	245 = 1111 0101 -> 0101 0101 0001 0001
+	0x5514,	//	246 = 1111 0110 -> 0101 0101 0001 0100
+	0x5515,	//	247 = 1111 0111 -> 0101 0101 0001 0101
+	0x5540,	//	248 = 1111 1000 -> 0101 0101 0100 0000
+	0x5541,	//	249 = 1111 1001 -> 0101 0101 0100 0001
+	0x5544,	//	250 = 1111 1010 -> 0101 0101 0100 0100
+	0x5545,	//	251 = 1111 1011 -> 0101 0101 0100 0101
+	0x5550,	//	252 = 1111 1100 -> 0101 0101 0101 0000
+	0x5551,	//	253 = 1111 1101 -> 0101 0101 0101 0001
+	0x5554,	//	254 = 1111 1110 -> 0101 0101 0101 0100
+	0x5555	//	255 = 1111 1111 -> 0101 0101 0101 0101
+	
+]
diff --git a/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/Point.js b/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/Point.js
new file mode 100644
index 0000000..f0739bc
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/Point.js
@@ -0,0 +1,67 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.ByteArray) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.ECC depends on Clipperz.ByteArray!";
+}  
+if (typeof(Clipperz.Crypto.ECC) == 'undefined') { Clipperz.Crypto.ECC = {}; }
+if (typeof(Clipperz.Crypto.ECC.BinaryField) == 'undefined') { Clipperz.Crypto.ECC.BinaryField = {}; }
+
+Clipperz.Crypto.ECC.BinaryField.Point = function(args) {
+	args = args || {};
+	this._x = args.x;
+	this._y = args.y;
+	
+	return this;
+}
+
+Clipperz.Crypto.ECC.BinaryField.Point.prototype = MochiKit.Base.update(null, {
+
+	'asString': function() {
+		return "Clipperz.Crypto.ECC.BinaryField.Point (" + this.x() + ", " + this.y() + ")";
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'x': function() {
+		return this._x;
+	},
+	
+	'y': function() {
+		return this._y;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'isZero': function() {
+		return (this.x().isZero() && this.y().isZero())
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/Value.js b/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/Value.js
new file mode 100644
index 0000000..10d055e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/ECC/BinaryField/Value.js
@@ -0,0 +1,377 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.ByteArray) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.ECC depends on Clipperz.ByteArray!";
+}  
+if (typeof(Clipperz.Crypto.ECC) == 'undefined') { Clipperz.Crypto.ECC = {}; }
+if (typeof(Clipperz.Crypto.ECC.BinaryField) == 'undefined') { Clipperz.Crypto.ECC.BinaryField = {}; }
+
+Clipperz.Crypto.ECC.BinaryField.Value = function(aValue, aBase) {
+	if (aValue.constructor == String) {
+		var	value;
+		var	stringLength;
+		var numberOfWords;
+		var	i,c;
+	
+		if (aBase != 16) {
+			throw Clipperz.Crypto.ECC.BinaryField.Value.exception.UnsupportedBase;
+		}
+
+		value = aValue.replace(/ /g, '');
+		stringLength = value.length;
+		numberOfWords = Math.ceil(stringLength / 8);
+		this._value = new Array(numberOfWords);
+	
+		c = numberOfWords;
+		for (i=0; i<c; i++) {
+			var	word;
+		
+			if (i < (c-1)) {
+				word = parseInt(value.substr(stringLength-((i+1)*8), 8), 16);
+			} else {
+				word = parseInt(value.substr(0, stringLength-(i*8)), 16);
+			}
+			
+			this._value[i] = word;
+		}
+	} else if (aValue.constructor == Array) {
+		var itemsToCopy;
+
+		itemsToCopy = aValue.length;
+		while (aValue[itemsToCopy - 1] == 0) {
+			itemsToCopy --;
+		}
+
+		this._value = aValue.slice(0, itemsToCopy);
+	} else if (aValue.constructor == Number) {
+		this._value = [aValue];
+	} else {
+//		throw Clipperz.Crypto.ECC.BinaryField.Value.exception.UnsupportedConstructorValueType;
+	}
+	
+	return this;
+}
+
+Clipperz.Crypto.ECC.BinaryField.Value.prototype = MochiKit.Base.update(null, {
+
+	'value': function() {
+		return this._value;
+	},
+
+	//-----------------------------------------------------------------------------
+	
+	'wordSize': function() {
+		return this._value.length
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'clone': function() {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(this._value.slice(0));
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'isZero': function() {
+		return (this.compare(Clipperz.Crypto.ECC.BinaryField.Value.O) == 0);
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'asString': function(aBase) {
+		var	result;
+		var i,c;
+		
+		if (aBase != 16) {
+			throw Clipperz.Crypto.ECC.BinaryField.Value.exception.UnsupportedBase;
+		}
+		
+		result = "";
+		c = this.wordSize();
+		for (i=0; i<c; i++) {
+			var	wordAsString;
+			
+//			wordAsString = ("00000000" + this.value()[i].toString(16));
+			wordAsString = ("00000000" + this._value[i].toString(16));
+			wordAsString = wordAsString.substring(wordAsString.length - 8);
+			result = wordAsString + result;
+		}
+		
+		result = result.replace(/^(00)*/, "");
+		
+		if (result == "") {
+			result = "0";
+		}
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'shiftLeft': function(aNumberOfBitsToShift) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(Clipperz.Crypto.ECC.BinaryField.Value._shiftLeft(this._value, aNumberOfBitsToShift));
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'bitSize': function() {
+		return Clipperz.Crypto.ECC.BinaryField.Value._bitSize(this._value);
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'isBitSet': function(aBitPosition) {
+		return Clipperz.Crypto.ECC.BinaryField.Value._isBitSet(this._value, aBitPosition);
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'xor': function(aValue) {
+		return new Clipperz.Crypto.ECC.BinaryField.Value(Clipperz.Crypto.ECC.BinaryField.Value._xor(this._value, aValue._value));
+	}, 
+
+	//-----------------------------------------------------------------------------
+
+	'compare': function(aValue) {
+		return Clipperz.Crypto.ECC.BinaryField.Value._compare(this._value, aValue._value);
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+Clipperz.Crypto.ECC.BinaryField.Value.O = new Clipperz.Crypto.ECC.BinaryField.Value('0', 16);
+Clipperz.Crypto.ECC.BinaryField.Value.I = new Clipperz.Crypto.ECC.BinaryField.Value('1', 16);
+
+Clipperz.Crypto.ECC.BinaryField.Value._xor = function(a, b, aFirstItemOffset) {
+	var result;
+	var resultSize;
+	var i,c;
+	var firstItemOffset;
+	
+	firstItemOffset = aFirstItemOffset || 0;
+	resultSize = Math.max((a.length - firstItemOffset), b.length) + firstItemOffset;
+
+	result = new Array(resultSize);
+	
+	c = firstItemOffset;
+	for (i=0; i<c; i++) {
+		result[i] = a[i];
+	}
+
+	c = resultSize;
+	for (i=firstItemOffset; i<c; i++) {
+		result[i] = (((a[i] || 0) ^ (b[i - firstItemOffset] || 0)) >>> 0);
+	}
+	
+	return result;
+};
+
+Clipperz.Crypto.ECC.BinaryField.Value._overwriteXor = function(a, b, aFirstItemOffset) {
+	var i,c;
+	var firstItemOffset;
+	
+	firstItemOffset = aFirstItemOffset || 0;
+
+	c = Math.max((a.length - firstItemOffset), b.length) + firstItemOffset;
+	for (i=firstItemOffset; i<c; i++) {
+		a[i] = (((a[i] || 0) ^ (b[i - firstItemOffset] || 0)) >>> 0);
+	}
+};
+
+Clipperz.Crypto.ECC.BinaryField.Value._shiftLeft = function(aWordArray, aNumberOfBitsToShift) {
+	var numberOfWordsToShift;
+	var	numberOfBitsToShift;
+	var result;
+	var	overflowValue;
+	var	i,c;
+
+	numberOfWordsToShift = Math.floor(aNumberOfBitsToShift / 32);
+	numberOfBitsToShift = aNumberOfBitsToShift % 32;
+
+	result = new Array(aWordArray.length + numberOfWordsToShift);
+	
+	c = numberOfWordsToShift;
+	for (i=0; i<c; i++) {
+		result[i] = 0;
+	}
+	
+	overflowValue = 0;
+	nextOverflowValue = 0;
+	
+	c = aWordArray.length;
+	for (i=0; i<c; i++) {
+		var	value;
+		var	resultWord;
+
+//		value = this.value()[i];
+		value = aWordArray[i];
+
+		if (numberOfBitsToShift > 0) {
+			var nextOverflowValue;
+		
+			nextOverflowValue = (value >>> (32 - numberOfBitsToShift));
+			value = value & (0xffffffff >>> numberOfBitsToShift);
+			resultWord = (((value << numberOfBitsToShift) | overflowValue) >>> 0);
+		} else {
+			resultWord = value;
+		}
+		
+		result[i+numberOfWordsToShift] = resultWord;
+		overflowValue = nextOverflowValue;
+	}
+
+	if (overflowValue != 0) {
+		result[aWordArray.length + numberOfWordsToShift] = overflowValue;
+	}
+
+	return result;
+};
+
+Clipperz.Crypto.ECC.BinaryField.Value._overwriteShiftLeft = function(aWordArray, aNumberOfBitsToShift) {
+	var numberOfWordsToShift;
+	var	numberOfBitsToShift;
+	var result;
+	var	overflowValue;
+	var	i,c;
+
+	numberOfWordsToShift = Math.floor(aNumberOfBitsToShift / 32);
+	numberOfBitsToShift = aNumberOfBitsToShift % 32;
+
+	result = new Array(aWordArray.length + numberOfWordsToShift);
+	
+	c = numberOfWordsToShift;
+	for (i=0; i<c; i++) {
+		result[i] = 0;
+	}
+	
+	overflowValue = 0;
+	nextOverflowValue = 0;
+	
+	c = aWordArray.length;
+	for (i=0; i<c; i++) {
+		var	value;
+		var	resultWord;
+
+//		value = this.value()[i];
+		value = aWordArray[i];
+
+		if (numberOfBitsToShift > 0) {
+			var nextOverflowValue;
+		
+			nextOverflowValue = (value >>> (32 - numberOfBitsToShift));
+			value = value & (0xffffffff >>> numberOfBitsToShift);
+			resultWord = (((value << numberOfBitsToShift) | overflowValue) >>> 0);
+		} else {
+			resultWord = value;
+		}
+		
+		result[i+numberOfWordsToShift] = resultWord;
+		overflowValue = nextOverflowValue;
+	}
+
+	if (overflowValue != 0) {
+		result[aWordArray.length + numberOfWordsToShift] = overflowValue;
+	}
+
+	return result;
+};
+
+Clipperz.Crypto.ECC.BinaryField.Value._bitSize = function(aWordArray) {
+	var	result;
+	var	notNullElements;
+	var mostValuableWord;
+	var matchingBitsInMostImportantWord;
+	var mask;
+	var i,c;
+
+	notNullElements = aWordArray.length;
+	
+	if ((aWordArray.length == 1) && (aWordArray[0] == 0)) {
+		result = 0;
+	} else {
+		while((aWordArray[notNullElements - 1] == 0) && (notNullElements > 0)) {
+			notNullElements --;
+		}
+	
+		result = (notNullElements - 1) * 32;
+		mostValuableWord = aWordArray[notNullElements - 1];
+
+		matchingBits = 32;
+		mask = 0x80000000;
+	
+		while ((matchingBits > 0) && ((mostValuableWord & mask) == 0)) {
+			matchingBits --;
+			mask >>>= 1;
+		}
+	
+		result += matchingBits;
+	}
+	
+	return result;
+};
+
+Clipperz.Crypto.ECC.BinaryField.Value._isBitSet = function(aWordArray, aBitPosition) {
+	var result;
+	var	byteIndex;
+	var bitIndexInSelectedByte;
+
+	byteIndex = Math.floor(aBitPosition / 32);
+	bitIndexInSelectedByte = aBitPosition % 32;
+	
+	if (byteIndex <= aWordArray.length) {
+		result = ((aWordArray[byteIndex] & (1 << bitIndexInSelectedByte)) != 0);
+	} else {
+		result = false;
+	}
+
+	return result;
+};
+
+Clipperz.Crypto.ECC.BinaryField.Value._compare = function(a,b) {
+	var	result;
+	var i,c;
+	
+	result = MochiKit.Base.compare(a.length, b.length);
+
+	c = a.length;
+	for (i=0; (i<c) && (result==0); i++) {
+//console.log("compare[" + c + " - " + i + " - 1] " + this.value()[c-i-1] + ", " + aValue.value()[c-i-1]);
+//		result = MochiKit.Base.compare(this.value()[c-i-1], aValue.value()[c-i-1]);
+		result = MochiKit.Base.compare(a[c-i-1], b[c-i-1]);
+	}
+	
+	return result;
+};
+
+
+Clipperz.Crypto.ECC.BinaryField.Value['exception']= {
+	'UnsupportedBase':					new MochiKit.Base.NamedError("Clipperz.Crypto.ECC.BinaryField.Value.exception.UnsupportedBase"),
+	'UnsupportedConstructorValueType':	new MochiKit.Base.NamedError("Clipperz.Crypto.ECC.BinaryField.Value.exception.UnsupportedConstructorValueType")
+};
diff --git a/frontend/beta/js/Clipperz/Crypto/PRNG.js b/frontend/beta/js/Clipperz/Crypto/PRNG.js
new file mode 100644
index 0000000..770ceb1
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/PRNG.js
@@ -0,0 +1,854 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.ByteArray) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.PRNG depends on Clipperz.ByteArray!";
+}  
+
+try { if (typeof(Clipperz.Crypto.SHA) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.PRNG depends on Clipperz.Crypto.SHA!";
+}  
+
+try { if (typeof(Clipperz.Crypto.AES) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.PRNG depends on Clipperz.Crypto.AES!";
+}  
+
+if (typeof(Clipperz.Crypto.PRNG) == 'undefined') { Clipperz.Crypto.PRNG = {}; }
+
+//#############################################################################
+
+Clipperz.Crypto.PRNG.EntropyAccumulator = function(args) {
+	args = args || {};
+//	MochiKit.Base.bindMethods(this);
+
+	this._stack = new Clipperz.ByteArray();
+	this._maxStackLengthBeforeHashing = args.maxStackLengthBeforeHashing || 256;
+	return this;
+}
+
+Clipperz.Crypto.PRNG.EntropyAccumulator.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "Clipperz.Crypto.PRNG.EntropyAccumulator";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'stack': function() {
+		return this._stack;
+	},
+	
+	'setStack': function(aValue) {
+		this._stack = aValue;
+	},
+
+	'resetStack': function() {
+		this.stack().reset();
+	},
+	
+	'maxStackLengthBeforeHashing': function() {
+		return this._maxStackLengthBeforeHashing;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'addRandomByte': function(aValue) {
+		this.stack().appendByte(aValue);
+				
+		if (this.stack().length() > this.maxStackLengthBeforeHashing()) {
+			this.setStack(Clipperz.Crypto.SHA.sha_d256(this.stack()));
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
+Clipperz.Crypto.PRNG.RandomnessSource = function(args) {
+	args = args || {};
+	MochiKit.Base.bindMethods(this);
+
+	this._generator = args.generator || null;
+	this._sourceId = args.sourceId || null;
+	this._boostMode = args.boostMode || false;
+	
+	this._nextPoolIndex = 0;
+	
+	return this;
+}
+
+Clipperz.Crypto.PRNG.RandomnessSource.prototype = MochiKit.Base.update(null, {
+
+	'generator': function() {
+		return this._generator;
+	},
+
+	'setGenerator': function(aValue) {
+		this._generator = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'boostMode': function() {
+		return this._boostMode;
+	},
+	
+	'setBoostMode': function(aValue) {
+		this._boostMode = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'sourceId': function() {
+		return this._sourceId;
+	},
+
+	'setSourceId': function(aValue) {
+		this._sourceId = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'nextPoolIndex': function() {
+		return this._nextPoolIndex;
+	},
+	
+	'incrementNextPoolIndex': function() {
+		this._nextPoolIndex = ((this._nextPoolIndex + 1) % this.generator().numberOfEntropyAccumulators());
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'updateGeneratorWithValue': function(aRandomValue) {
+		if (this.generator() != null) {
+			this.generator().addRandomByte(this.sourceId(), this.nextPoolIndex(), aRandomValue);
+			this.incrementNextPoolIndex();
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+	
+Clipperz.Crypto.PRNG.TimeRandomnessSource = function(args) {
+	args = args || {};
+//	MochiKit.Base.bindMethods(this);
+
+	this._intervalTime = args.intervalTime || 1000;
+	
+	Clipperz.Crypto.PRNG.RandomnessSource.call(this, args);
+
+	this.collectEntropy();
+	return this;
+}
+
+Clipperz.Crypto.PRNG.TimeRandomnessSource.prototype = MochiKit.Base.update(new Clipperz.Crypto.PRNG.RandomnessSource, {
+
+	'intervalTime': function() {
+		return this._intervalTime;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'collectEntropy': function() {
+		var	now;
+		var	entropyByte;
+		var intervalTime;
+		now = new Date();
+		entropyByte = (now.getTime() & 0xff);
+		
+		intervalTime = this.intervalTime();
+		if (this.boostMode() == true) {
+			intervalTime = intervalTime / 9;
+		}
+		
+		this.updateGeneratorWithValue(entropyByte);
+		setTimeout(this.collectEntropy, intervalTime);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'numberOfRandomBits': function() {
+		return 5;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'pollingFrequency': function() {
+		return 10;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//*****************************************************************************
+
+Clipperz.Crypto.PRNG.MouseRandomnessSource = function(args) {
+	args = args || {};
+
+	Clipperz.Crypto.PRNG.RandomnessSource.call(this, args);
+
+	this._numberOfBitsToCollectAtEachEvent = 4;
+	this._randomBitsCollector = 0;
+	this._numberOfRandomBitsCollected = 0;
+	
+	MochiKit.Signal.connect(document, 'onmousemove', this, 'collectEntropy');
+
+	return this;
+}
+
+Clipperz.Crypto.PRNG.MouseRandomnessSource.prototype = MochiKit.Base.update(new Clipperz.Crypto.PRNG.RandomnessSource, {
+
+	//-------------------------------------------------------------------------
+
+	'numberOfBitsToCollectAtEachEvent': function() {
+		return this._numberOfBitsToCollectAtEachEvent;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'randomBitsCollector': function() {
+		return this._randomBitsCollector;
+	},
+
+	'setRandomBitsCollector': function(aValue) {
+		this._randomBitsCollector = aValue;
+	},
+
+	'appendRandomBitsToRandomBitsCollector': function(aValue) {
+		var collectedBits;
+		var numberOfRandomBitsCollected;
+		
+		numberOfRandomBitsCollected = this.numberOfRandomBitsCollected();
+		collectetBits = this.randomBitsCollector() | (aValue << numberOfRandomBitsCollected);
+		this.setRandomBitsCollector(collectetBits);
+		numberOfRandomBitsCollected += this.numberOfBitsToCollectAtEachEvent();
+		
+		if (numberOfRandomBitsCollected == 8) {
+			this.updateGeneratorWithValue(collectetBits);
+			numberOfRandomBitsCollected = 0;
+			this.setRandomBitsCollector(0);
+		}
+		
+		this.setNumberOfRandomBitsCollected(numberOfRandomBitsCollected)
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'numberOfRandomBitsCollected': function() {
+		return this._numberOfRandomBitsCollected;
+	},
+
+	'setNumberOfRandomBitsCollected': function(aValue) {
+		this._numberOfRandomBitsCollected = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'collectEntropy': function(anEvent) {
+		var mouseLocation;
+		var randomBit;
+		var mask;
+		
+		mask = 0xffffffff >>> (32 - this.numberOfBitsToCollectAtEachEvent());
+		
+		mouseLocation = anEvent.mouse().client;
+		randomBit = ((mouseLocation.x ^ mouseLocation.y) & mask);
+		this.appendRandomBitsToRandomBitsCollector(randomBit)
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'numberOfRandomBits': function() {
+		return 1;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'pollingFrequency': function() {
+		return 10;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//*****************************************************************************
+
+Clipperz.Crypto.PRNG.KeyboardRandomnessSource = function(args) {
+	args = args || {};
+	Clipperz.Crypto.PRNG.RandomnessSource.call(this, args);
+
+	this._randomBitsCollector = 0;
+	this._numberOfRandomBitsCollected = 0;
+	
+	MochiKit.Signal.connect(document, 'onkeypress', this, 'collectEntropy');
+
+	return this;
+}
+
+Clipperz.Crypto.PRNG.KeyboardRandomnessSource.prototype = MochiKit.Base.update(new Clipperz.Crypto.PRNG.RandomnessSource, {
+
+	//-------------------------------------------------------------------------
+
+	'randomBitsCollector': function() {
+		return this._randomBitsCollector;
+	},
+
+	'setRandomBitsCollector': function(aValue) {
+		this._randomBitsCollector = aValue;
+	},
+
+	'appendRandomBitToRandomBitsCollector': function(aValue) {
+		var collectedBits;
+		var numberOfRandomBitsCollected;
+		
+		numberOfRandomBitsCollected = this.numberOfRandomBitsCollected();
+		collectetBits = this.randomBitsCollector() | (aValue << numberOfRandomBitsCollected);
+		this.setRandomBitsCollector(collectetBits);
+		numberOfRandomBitsCollected ++;
+		
+		if (numberOfRandomBitsCollected == 8) {
+			this.updateGeneratorWithValue(collectetBits);
+			numberOfRandomBitsCollected = 0;
+			this.setRandomBitsCollector(0);
+		}
+		
+		this.setNumberOfRandomBitsCollected(numberOfRandomBitsCollected)
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'numberOfRandomBitsCollected': function() {
+		return this._numberOfRandomBitsCollected;
+	},
+
+	'setNumberOfRandomBitsCollected': function(aValue) {
+		this._numberOfRandomBitsCollected = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'collectEntropy': function(anEvent) {
+/*
+		var mouseLocation;
+		var randomBit;
+		
+		mouseLocation = anEvent.mouse().client;
+			
+		randomBit = ((mouseLocation.x ^ mouseLocation.y) & 0x1);
+		this.appendRandomBitToRandomBitsCollector(randomBit);
+*/
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'numberOfRandomBits': function() {
+		return 1;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'pollingFrequency': function() {
+		return 10;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
+Clipperz.Crypto.PRNG.Fortuna = function(args) {
+	var	i,c;
+	
+	args = args || {};
+
+	this._key = args.seed || null;
+	if (this._key == null) {
+		this._counter = 0;
+		this._key = new Clipperz.ByteArray();
+	} else {
+		this._counter = 1;
+	}
+	
+	this._aesKey = null;
+	
+	this._firstPoolReseedLevel = args.firstPoolReseedLevel || 32 || 64;
+	this._numberOfEntropyAccumulators = args.numberOfEntropyAccumulators || 32;
+	
+	this._accumulators = [];
+	c = this.numberOfEntropyAccumulators();
+	for (i=0; i<c; i++) {
+		this._accumulators.push(new Clipperz.Crypto.PRNG.EntropyAccumulator());
+	}
+
+	this._randomnessSources = [];
+	this._reseedCounter = 0;
+	
+	return this;
+}
+
+Clipperz.Crypto.PRNG.Fortuna.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "Clipperz.Crypto.PRNG.Fortuna";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'key': function() {
+		return this._key;
+	},
+
+	'setKey': function(aValue) {
+		this._key = aValue;
+		this._aesKey = null;
+	},
+	
+	'aesKey': function() {
+		if (this._aesKey == null) {
+			this._aesKey = new Clipperz.Crypto.AES.Key({key:this.key()});
+		}
+		
+		return this._aesKey;
+	},
+	
+	'accumulators': function() {
+		return this._accumulators;
+	},
+	
+	'firstPoolReseedLevel': function() {
+		return this._firstPoolReseedLevel;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'reseedCounter': function() {
+		return this._reseedCounter;
+	},
+
+	'incrementReseedCounter': function() {
+		this._reseedCounter = this._reseedCounter +1;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'reseed': function() {
+		var	newKeySeed;
+		var reseedCounter;
+		var	reseedCounterMask;
+		var i, c;
+		
+		newKeySeed = this.key();
+		this.incrementReseedCounter();
+		reseedCounter = this.reseedCounter();
+		
+		c = this.numberOfEntropyAccumulators();
+		reseedCounterMask = 0xffffffff >>> (32 - c);
+		for (i=0; i<c; i++) {
+			if ((i == 0) || ((reseedCounter & (reseedCounterMask >>> (c - i))) == 0)) {
+				newKeySeed.appendBlock(this.accumulators()[i].stack());
+				this.accumulators()[i].resetStack();
+			} 
+		}
+		
+		if (reseedCounter == 1) {
+			c = this.randomnessSources().length;
+			for (i=0; i<c; i++) {
+				this.randomnessSources()[i].setBoostMode(false);
+			}
+		}
+		
+		this.setKey(Clipperz.Crypto.SHA.sha_d256(newKeySeed));
+		if (reseedCounter == 1) {
+MochiKit.Logging.logDebug("### PRNG.readyToGenerateRandomBytes");
+			MochiKit.Signal.signal(this, 'readyToGenerateRandomBytes');
+		}
+		MochiKit.Signal.signal(this, 'reseeded');
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'isReadyToGenerateRandomValues': function() {
+		return this.reseedCounter() != 0;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'entropyLevel': function() {
+		return this.accumulators()[0].stack().length() + (this.reseedCounter() * this.firstPoolReseedLevel());
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'counter': function() {
+		return this._counter;
+	},
+	
+	'incrementCounter': function() {
+		this._counter += 1;
+	},
+	
+	'counterBlock': function() {
+		var result;
+
+		result = new Clipperz.ByteArray().appendWords(this.counter(), 0, 0, 0);
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'getRandomBlock': function() {
+		var result;
+
+		result = new Clipperz.ByteArray(Clipperz.Crypto.AES.encryptBlock(this.aesKey(), this.counterBlock().arrayValues()));
+		this.incrementCounter();
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'getRandomBytes': function(aSize) {
+		var result;
+
+		if (this.isReadyToGenerateRandomValues()) {
+			var i,c;
+			var newKey;
+			
+			result = new Clipperz.ByteArray();
+		
+			c = Math.ceil(aSize / (128 / 8));
+			for (i=0; i<c; i++) {
+				result.appendBlock(this.getRandomBlock());
+			}
+
+			if (result.length() != aSize) {
+				result = result.split(0, aSize);
+			}
+			
+			newKey = this.getRandomBlock().appendBlock(this.getRandomBlock());
+			this.setKey(newKey);
+		} else {
+MochiKit.Logging.logWarning("Fortuna generator has not enough entropy, yet!");
+			throw Clipperz.Crypto.PRNG.exception.NotEnoughEntropy;
+		}
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'addRandomByte': function(aSourceId, aPoolId, aRandomValue) {
+		var	selectedAccumulator;
+
+		selectedAccumulator = this.accumulators()[aPoolId];
+		selectedAccumulator.addRandomByte(aRandomValue);
+
+		if (aPoolId == 0) {
+			MochiKit.Signal.signal(this, 'addedRandomByte')
+			if (selectedAccumulator.stack().length() > this.firstPoolReseedLevel()) {
+				this.reseed();
+			}
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'numberOfEntropyAccumulators': function() {
+		return this._numberOfEntropyAccumulators;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'randomnessSources': function() {
+		return this._randomnessSources;
+	},
+	
+	'addRandomnessSource': function(aRandomnessSource) {
+		aRandomnessSource.setGenerator(this);
+		aRandomnessSource.setSourceId(this.randomnessSources().length);
+		this.randomnessSources().push(aRandomnessSource);
+		
+		if (this.isReadyToGenerateRandomValues() == false) {
+			aRandomnessSource.setBoostMode(true);
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'deferredEntropyCollection': function(aValue) {
+		var result;
+
+//MochiKit.Logging.logDebug(">>> PRNG.deferredEntropyCollection");
+
+		if (this.isReadyToGenerateRandomValues()) {
+//MochiKit.Logging.logDebug("--- PRNG.deferredEntropyCollection - 1");
+			result = aValue;
+		} else {
+//MochiKit.Logging.logDebug("--- PRNG.deferredEntropyCollection - 2");
+			var deferredResult;
+
+			Clipperz.NotificationCenter.notify(this, 'updatedProgressState', 'collectingEntropy', true);
+
+			deferredResult = new MochiKit.Async.Deferred();
+//			deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.1 - PRNG.deferredEntropyCollection - 1: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.partial(MochiKit.Async.succeed, aValue));
+//			deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.2 - PRNG.deferredEntropyCollection - 2: " + res); return res;});
+			MochiKit.Signal.connect(this,
+									'readyToGenerateRandomBytes',
+									deferredResult,
+									'callback');
+									
+			result = deferredResult;
+		}
+//MochiKit.Logging.logDebug("<<< PRNG.deferredEntropyCollection - result: " + result);
+
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'fastEntropyAccumulationForTestingPurpose': function() {
+		while (! this.isReadyToGenerateRandomValues()) {
+			this.addRandomByte(Math.floor(Math.random() * 32), Math.floor(Math.random() * 32), Math.floor(Math.random() * 256));
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'dump': function(appendToDoc) {
+		var tbl;
+		var i,c;
+		
+		tbl = document.createElement("table");
+		tbl.border = 0;
+		with (tbl.style) {
+			border = "1px solid lightgrey";
+			fontFamily = 'Helvetica, Arial, sans-serif';
+			fontSize = '8pt';
+			//borderCollapse = "collapse";
+		}
+		var hdr = tbl.createTHead();
+		var hdrtr = hdr.insertRow(0);
+		// document.createElement("tr");
+		{
+			var ntd;
+			
+			ntd = hdrtr.insertCell(0);
+			ntd.style.borderBottom = "1px solid lightgrey";
+			ntd.style.borderRight = "1px solid lightgrey";
+			ntd.appendChild(document.createTextNode("#"));
+
+			ntd = hdrtr.insertCell(1);
+			ntd.style.borderBottom = "1px solid lightgrey";
+			ntd.style.borderRight = "1px solid lightgrey";
+			ntd.appendChild(document.createTextNode("s"));
+
+			ntd = hdrtr.insertCell(2);
+			ntd.colSpan = this.firstPoolReseedLevel();
+			ntd.style.borderBottom = "1px solid lightgrey";
+			ntd.style.borderRight = "1px solid lightgrey";
+			ntd.appendChild(document.createTextNode("base values"));
+			
+			ntd = hdrtr.insertCell(3);
+			ntd.colSpan = 20;
+			ntd.style.borderBottom = "1px solid lightgrey";
+			ntd.appendChild(document.createTextNode("extra values"));
+
+		}
+
+		c = this.accumulators().length;
+		for (i=0; i<c ; i++) {
+			var	currentAccumulator;
+			var bdytr;
+			var bdytd;
+			var ii, cc;
+
+			currentAccumulator = this.accumulators()[i]
+			
+			bdytr = tbl.insertRow(true);
+			
+			bdytd = bdytr.insertCell(0);
+			bdytd.style.borderRight = "1px solid lightgrey";
+			bdytd.style.color = "lightgrey";
+			bdytd.appendChild(document.createTextNode("" + i));
+
+			bdytd = bdytr.insertCell(1);
+			bdytd.style.borderRight = "1px solid lightgrey";
+			bdytd.style.color = "gray";
+			bdytd.appendChild(document.createTextNode("" + currentAccumulator.stack().length()));
+
+
+			cc = Math.max(currentAccumulator.stack().length(), this.firstPoolReseedLevel());
+			for (ii=0; ii<cc; ii++) {
+				var cellText;
+				
+				bdytd = bdytr.insertCell(ii + 2);
+				
+				if (ii < currentAccumulator.stack().length()) {
+					cellText = Clipperz.ByteArray.byteToHex(currentAccumulator.stack().byteAtIndex(ii));
+				} else {
+					cellText = "_";
+				}
+				
+				if (ii == (this.firstPoolReseedLevel() - 1)) {
+					bdytd.style.borderRight = "1px solid lightgrey";
+				}
+				
+				bdytd.appendChild(document.createTextNode(cellText));
+			}
+			
+		}
+		
+
+		if (appendToDoc) {
+			var ne = document.createElement("div");
+			ne.id = "entropyGeneratorStatus";
+			with (ne.style) {
+				fontFamily = "Courier New, monospace";
+				fontSize = "12px";
+				lineHeight = "16px";
+				borderTop = "1px solid black";
+				padding = "10px";
+			}
+			if (document.getElementById(ne.id)) {
+				MochiKit.DOM.swapDOM(ne.id, ne);
+			} else {
+				document.body.appendChild(ne);
+			}
+			ne.appendChild(tbl);
+		}
+
+		return tbl;
+	},
+
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
+Clipperz.Crypto.PRNG.Random = function(args) {
+	args = args || {};
+//	MochiKit.Base.bindMethods(this);
+
+	return this;
+}
+
+Clipperz.Crypto.PRNG.Random.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "Clipperz.Crypto.PRNG.Random";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'getRandomBytes': function(aSize) {
+//Clipperz.Profile.start("Clipperz.Crypto.PRNG.Random.getRandomBytes");
+		var	result;
+		var i,c;
+		
+		result = new Clipperz.ByteArray()
+		c = aSize || 1;
+		for (i=0; i<c; i++) {
+			result.appendByte((Math.random()*255) & 0xff);
+		}
+		
+//Clipperz.Profile.stop("Clipperz.Crypto.PRNG.Random.getRandomBytes");
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
+_clipperz_crypt_prng_defaultPRNG = null;
+
+Clipperz.Crypto.PRNG.defaultRandomGenerator = function() {
+	if (_clipperz_crypt_prng_defaultPRNG == null) {
+		_clipperz_crypt_prng_defaultPRNG = new Clipperz.Crypto.PRNG.Fortuna();
+
+		//.............................................................
+		//
+		//		TimeRandomnessSource
+		//
+		//.............................................................
+		{
+			var newRandomnessSource;
+		
+			newRandomnessSource = new Clipperz.Crypto.PRNG.TimeRandomnessSource({intervalTime:111});
+			_clipperz_crypt_prng_defaultPRNG.addRandomnessSource(newRandomnessSource);
+		}
+
+		//.............................................................
+		//
+		//		MouseRandomnessSource
+		//
+		//.............................................................
+		{
+			var	newRandomnessSource;
+			
+			newRandomnessSource = new Clipperz.Crypto.PRNG.MouseRandomnessSource();
+			_clipperz_crypt_prng_defaultPRNG.addRandomnessSource(newRandomnessSource);
+		}
+
+		//.............................................................
+		//
+		//		KeyboardRandomnessSource
+		//
+		//.............................................................
+		{
+			var	newRandomnessSource;
+			
+			newRandomnessSource = new Clipperz.Crypto.PRNG.KeyboardRandomnessSource();
+			_clipperz_crypt_prng_defaultPRNG.addRandomnessSource(newRandomnessSource);
+		}
+
+	}
+
+	return _clipperz_crypt_prng_defaultPRNG;
+};
+
+//#############################################################################
+
+Clipperz.Crypto.PRNG.exception =  {
+	NotEnoughEntropy: new MochiKit.Base.NamedError("Clipperz.Crypto.PRNG.exception.NotEnoughEntropy") 
+};
+
+
+MochiKit.DOM.addLoadEvent(Clipperz.Crypto.PRNG.defaultRandomGenerator);
diff --git a/frontend/beta/js/Clipperz/Crypto/RSA.js b/frontend/beta/js/Clipperz/Crypto/RSA.js
new file mode 100644
index 0000000..4dad8f7
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/RSA.js
@@ -0,0 +1,151 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.Crypto.BigInt) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.RSA depends on Clipperz.Crypto.BigInt!";
+}  
+
+if (typeof(Clipperz.Crypto.RSA) == 'undefined') { Clipperz.Crypto.RSA = {}; }
+
+Clipperz.Crypto.RSA.VERSION = "0.1";
+Clipperz.Crypto.RSA.NAME = "Clipperz.RSA";
+
+//#############################################################################
+
+MochiKit.Base.update(Clipperz.Crypto.RSA, {
+
+	//-------------------------------------------------------------------------
+
+	'publicKeyWithValues': function (e, d, n) {
+		var	result;
+		
+		result = {};
+
+		if (e.isBigInt) {
+			result.e = e;
+		} else {
+			result.e = new Clipperz.Crypto.BigInt(e, 16);
+		}
+		
+		if (d.isBigInt) {
+			result.d = d;
+		} else {
+			result.d = new Clipperz.Crypto.BigInt(d, 16);
+		}
+		
+		if (n.isBigInt) {
+			result.n = n;
+		} else {
+			result.n = new Clipperz.Crypto.BigInt(n, 16);
+		}
+		
+		return result;
+	},
+
+	'privateKeyWithValues': function(e, d, n) {
+		return Clipperz.Crypto.RSA.publicKeyWithValues(e, d, n);
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'encryptUsingPublicKey': function (aKey, aMessage) {
+		var	messageValue;
+		var	result;
+		
+		messageValue = new Clipperz.Crypto.BigInt(aMessage, 16);
+		result = messageValue.powerModule(aKey.e, aKey.n);
+		
+		return result.asString(16);
+	},
+
+	//.............................................................................
+
+	'decryptUsingPublicKey': function (aKey, aMessage) {
+		return Clipperz.Crypto.RSA.encryptUsingPublicKey(aKey, aMessage);
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'encryptUsingPrivateKey': function (aKey, aMessage) {
+		var	messageValue;
+		var	result;
+		
+		messageValue = new Clipperz.Crypto.BigInt(aMessage, 16);
+		result = messageValue.powerModule(aKey.d, aKey.n);
+		
+		return result.asString(16);
+	},
+
+	//.............................................................................
+
+	'decryptUsingPrivateKey': function (aKey, aMessage) {
+		return Clipperz.Crypto.RSA.encryptUsingPrivateKey(aKey, aMessage);
+	},
+
+	//-----------------------------------------------------------------------------
+	
+	'generatePublicKey': function(aNumberOfBits) {
+		var	result;
+		var	e;
+		var	d;
+		var	n;
+		
+		e = new Clipperz.Crypto.BigInt("10001", 16);
+
+		{
+			var p, q;
+			var	phi;
+
+			do {
+				p = Clipperz.Crypto.BigInt.randomPrime(aNumberOfBits);
+			} while (p.module(e).equals(1));
+			
+			do {
+				q = Clipperz.Crypto.BigInt.randomPrime(aNumberOfBits);
+			} while ((q.equals(p)) || (q.module(e).equals(1)));
+
+			n = p.multiply(q);
+			phi = (p.subtract(1).multiply(q.subtract(1)));
+			d = e.powerModule(-1, phi);
+		}
+		
+		result = Clipperz.Crypto.RSA.publicKeyWithValues(e, d, n);
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	__syntaxFix__: "syntax fix"
+	
+	//-------------------------------------------------------------------------
+
+});
+
+//#############################################################################
+
diff --git a/frontend/beta/js/Clipperz/Crypto/SHA.js b/frontend/beta/js/Clipperz/Crypto/SHA.js
new file mode 100644
index 0000000..bb50b4f
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/SHA.js
@@ -0,0 +1,296 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.ByteArray) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.PRNG depends on Clipperz.ByteArray!";
+}  
+
+if (typeof(Clipperz.Crypto) == 'undefined') { Clipperz.Crypto = {}; }
+if (typeof(Clipperz.Crypto.SHA) == 'undefined') { Clipperz.Crypto.SHA = {}; }
+
+Clipperz.Crypto.SHA.VERSION = "0.3";
+Clipperz.Crypto.SHA.NAME = "Clipperz.Crypto.SHA";
+
+MochiKit.Base.update(Clipperz.Crypto.SHA, {
+
+	'__repr__': function () {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'rotateRight': function(aValue, aNumberOfBits) {
+//Clipperz.Profile.start("Clipperz.Crypto.SHA.rotateRight");
+		var result;
+		
+		result = (aValue >>> aNumberOfBits) | (aValue << (32 - aNumberOfBits));
+		
+//Clipperz.Profile.stop("Clipperz.Crypto.SHA.rotateRight");
+		return result;
+	},
+
+	'shiftRight': function(aValue, aNumberOfBits) {
+//Clipperz.Profile.start("Clipperz.Crypto.SHA.shiftRight");
+		var result;
+		
+		result = aValue >>> aNumberOfBits;
+		
+//Clipperz.Profile.stop("Clipperz.Crypto.SHA.shiftRight");
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'safeAdd': function() {
+//Clipperz.Profile.start("Clipperz.Crypto.SHA.safeAdd");
+		var	result;
+		var	i, c;
+		
+		result = arguments[0];
+		c = arguments.length;
+		for (i=1; i<c; i++) {
+			var	lowerBytesSum;
+
+			lowerBytesSum = (result & 0xffff) + (arguments[i] & 0xffff);
+			result = (((result >> 16) + (arguments[i] >> 16) + (lowerBytesSum >> 16)) << 16) | (lowerBytesSum & 0xffff);
+		}
+		
+//Clipperz.Profile.stop("Clipperz.Crypto.SHA.safeAdd");
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'sha256_array': function(aValue) {
+//Clipperz.Profile.start("Clipperz.Crypto.SHA.sha256_array");
+		var	result;
+		var	message;
+		var h0, h1, h2, h3, h4, h5, h6, h7;
+		var	k;
+		var	messageLength;
+		var	messageLengthInBits;
+		var	_i, _c;
+		var charBits;
+		var rotateRight;
+		var shiftRight;
+		var safeAdd;
+		var	bytesPerBlock;
+		var currentMessageIndex;
+
+		bytesPerBlock = 512/8;
+		rotateRight = Clipperz.Crypto.SHA.rotateRight;
+		shiftRight = Clipperz.Crypto.SHA.shiftRight;
+		safeAdd = Clipperz.Crypto.SHA.safeAdd;
+		
+		charBits = 8;
+		
+		h0 = 0x6a09e667;
+		h1 = 0xbb67ae85;
+		h2 = 0x3c6ef372;
+		h3 = 0xa54ff53a;
+		h4 = 0x510e527f;
+		h5 = 0x9b05688c;
+		h6 = 0x1f83d9ab;
+		h7 = 0x5be0cd19;
+
+		k = [	0x428a2f98, 0x71374491, 0xb5c0fbcf, 0xe9b5dba5, 0x3956c25b, 0x59f111f1, 0x923f82a4, 0xab1c5ed5,
+				0xd807aa98, 0x12835b01, 0x243185be, 0x550c7dc3, 0x72be5d74, 0x80deb1fe, 0x9bdc06a7, 0xc19bf174,
+				0xe49b69c1, 0xefbe4786, 0x0fc19dc6, 0x240ca1cc, 0x2de92c6f, 0x4a7484aa, 0x5cb0a9dc, 0x76f988da,
+				0x983e5152, 0xa831c66d, 0xb00327c8, 0xbf597fc7, 0xc6e00bf3, 0xd5a79147, 0x06ca6351, 0x14292967,
+				0x27b70a85, 0x2e1b2138, 0x4d2c6dfc, 0x53380d13, 0x650a7354, 0x766a0abb, 0x81c2c92e, 0x92722c85,
+				0xa2bfe8a1, 0xa81a664b, 0xc24b8b70, 0xc76c51a3, 0xd192e819, 0xd6990624, 0xf40e3585, 0x106aa070,
+				0x19a4c116, 0x1e376c08, 0x2748774c, 0x34b0bcb5, 0x391c0cb3, 0x4ed8aa4a, 0x5b9cca4f, 0x682e6ff3,
+				0x748f82ee, 0x78a5636f, 0x84c87814, 0x8cc70208, 0x90befffa, 0xa4506ceb, 0xbef9a3f7, 0xc67178f2];
+
+		message = aValue;
+		messageLength = message.length;
+
+		//Pre-processing:
+		message.push(0x80);	//	append a single "1" bit to  message
+
+		_c = (512 - (((messageLength + 1) * charBits) % 512) - 64) / charBits;
+		for (_i=0; _i<_c; _i++) {
+			message.push(0x00);			//	append "0" bits until message length ≡ 448 ≡ -64 (mod 512)
+		}
+		messageLengthInBits = messageLength * charBits;
+		message.push(0x00);	//	the 4 most high byte are alway 0 as message length is represented with a 32bit value;
+		message.push(0x00);
+		message.push(0x00);
+		message.push(0x00);
+		message.push((messageLengthInBits >> 24)	& 0xff);
+		message.push((messageLengthInBits >> 16)	& 0xff);
+		message.push((messageLengthInBits >> 8)		& 0xff);
+		message.push( messageLengthInBits			& 0xff);
+
+		currentMessageIndex = 0;
+		while(currentMessageIndex < message.length) {
+			var	w;
+			var	a, b, c, d, e, f, g, h;
+
+			w = Array(64);
+
+			_c = 16;
+			for (_i=0; _i<_c; _i++) {
+				var _j;
+				
+				_j = currentMessageIndex + _i*4;
+				w[_i] = (message[_j] << 24) | (message[_j + 1] << 16) | (message[_j + 2] << 8) | (message[_j + 3] << 0);
+			}
+
+			_c = 64;
+			for (_i=16; _i<_c; _i++) {
+				var	s0, s1;
+				
+				s0 = (rotateRight(w[_i-15], 7)) ^ (rotateRight(w[_i-15], 18)) ^ (shiftRight(w[_i-15], 3));
+				s1 = (rotateRight(w[_i-2], 17)) ^ (rotateRight(w[_i-2], 19)) ^ (shiftRight(w[_i-2], 10));
+				w[_i] = safeAdd(w[_i-16], s0, w[_i-7], s1);
+			}
+
+			a=h0; b=h1; c=h2; d=h3; e=h4; f=h5; g=h6; h=h7;
+
+			_c = 64;
+			for (_i=0; _i<_c; _i++) {
+				var s0, s1, ch, maj, t1, t2;
+				
+				s0  = (rotateRight(a, 2)) ^ (rotateRight(a, 13)) ^ (rotateRight(a, 22));
+				maj = (a & b) ^ (a & c) ^ (b & c);
+				t2  = safeAdd(s0, maj);
+				s1  = (rotateRight(e, 6)) ^ (rotateRight(e, 11)) ^ (rotateRight(e, 25));
+				ch  = (e & f) ^ ((~e) & g);
+				t1  = safeAdd(h, s1, ch, k[_i], w[_i]);
+
+				h = g;
+				g = f;
+				f = e;
+				e = safeAdd(d, t1);
+				d = c;
+				c = b;
+				b = a;
+				a = safeAdd(t1, t2);
+			}
+
+		    h0 = safeAdd(h0, a);
+		    h1 = safeAdd(h1, b);
+		    h2 = safeAdd(h2, c);
+		    h3 = safeAdd(h3, d);
+		    h4 = safeAdd(h4, e);
+		    h5 = safeAdd(h5, f);
+		    h6 = safeAdd(h6, g);
+		    h7 = safeAdd(h7, h);
+			
+			currentMessageIndex += bytesPerBlock;
+		}
+
+		result = new Array(256/8);
+		result[0]  = (h0 >> 24)	& 0xff;
+		result[1]  = (h0 >> 16)	& 0xff;
+		result[2]  = (h0 >> 8)	& 0xff;
+		result[3]  =  h0		& 0xff;
+
+		result[4]  = (h1 >> 24)	& 0xff;
+		result[5]  = (h1 >> 16)	& 0xff;
+		result[6]  = (h1 >> 8)	& 0xff;
+		result[7]  =  h1		& 0xff;
+
+		result[8]  = (h2 >> 24)	& 0xff;
+		result[9]  = (h2 >> 16)	& 0xff;
+		result[10] = (h2 >> 8)	& 0xff;
+		result[11] =  h2		& 0xff;
+		
+		result[12] = (h3 >> 24)	& 0xff;
+		result[13] = (h3 >> 16)	& 0xff;
+		result[14] = (h3 >> 8)	& 0xff;
+		result[15] =  h3		& 0xff;
+
+		result[16] = (h4 >> 24)	& 0xff;
+		result[17] = (h4 >> 16)	& 0xff;
+		result[18] = (h4 >> 8)	& 0xff;
+		result[19] =  h4		& 0xff;
+
+		result[20] = (h5 >> 24)	& 0xff;
+		result[21] = (h5 >> 16)	& 0xff;
+		result[22] = (h5 >> 8)	& 0xff;
+		result[23] =  h5	 	& 0xff;
+
+		result[24] = (h6 >> 24)	& 0xff;
+		result[25] = (h6 >> 16)	& 0xff;
+		result[26] = (h6 >> 8)	& 0xff;
+		result[27] =  h6		& 0xff;
+			
+		result[28] = (h7 >> 24)	& 0xff;
+		result[29] = (h7 >> 16)	& 0xff;
+		result[30] = (h7 >> 8)	& 0xff;
+		result[31] =  h7		& 0xff;
+		
+//Clipperz.Profile.stop("Clipperz.Crypto.SHA.sha256_array");
+		return result;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'sha256': function(aValue) {
+//Clipperz.Profile.start("Clipperz.Crypto.SHA.sha256");
+		var result;
+		var resultArray;
+		var	valueArray;
+		
+		valueArray = aValue.arrayValues();
+		resultArray = Clipperz.Crypto.SHA.sha256_array(valueArray);
+		
+		result = new Clipperz.ByteArray(resultArray);
+		
+//Clipperz.Profile.stop("Clipperz.Crypto.SHA.sha256");
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'sha_d256': function(aValue) {
+//Clipperz.Profile.start("Clipperz.Crypto.SHA.sha_d256");
+		var result;
+		var resultArray;
+		var	valueArray;
+		
+		valueArray = aValue.arrayValues();
+		resultArray = Clipperz.Crypto.SHA.sha256_array(valueArray);
+		resultArray = Clipperz.Crypto.SHA.sha256_array(resultArray);
+		
+		result = new Clipperz.ByteArray(resultArray);
+		
+//Clipperz.Profile.stop("Clipperz.Crypto.SHA.sha256");
+		return result;
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
diff --git a/frontend/beta/js/Clipperz/Crypto/SRP.js b/frontend/beta/js/Clipperz/Crypto/SRP.js
new file mode 100644
index 0000000..0eef6ec
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Crypto/SRP.js
@@ -0,0 +1,331 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.ByteArray) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.PRNG depends on Clipperz.ByteArray!";
+}  
+
+try { if (typeof(Clipperz.Crypto.BigInt) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.SRP depends on Clipperz.Crypto.BigInt!";
+}  
+
+try { if (typeof(Clipperz.Crypto.PRNG) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.Crypto.SRP depends on Clipperz.Crypto.PRNG!";
+}  
+
+if (typeof(Clipperz.Crypto.SRP) == 'undefined') { Clipperz.Crypto.SRP = {}; }
+
+Clipperz.Crypto.SRP.VERSION = "0.1";
+Clipperz.Crypto.SRP.NAME = "Clipperz.Crypto.SRP";
+
+//#############################################################################
+
+MochiKit.Base.update(Clipperz.Crypto.SRP, {
+
+	'_n': null,
+	'_g': null,
+	//-------------------------------------------------------------------------
+
+	'n': function() {
+		if (Clipperz.Crypto.SRP._n == null) {
+		 	Clipperz.Crypto.SRP._n = new Clipperz.Crypto.BigInt("115b8b692e0e045692cf280b436735c77a5a9e8a9e7ed56c965f87db5b2a2ece3", 16);
+		}
+		
+		return Clipperz.Crypto.SRP._n;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'g': function() {
+		if (Clipperz.Crypto.SRP._g == null) {
+			Clipperz.Crypto.SRP._g = new Clipperz.Crypto.BigInt(2);	//	eventually 5 (as suggested on the Diffi-Helmann documentation)
+		}
+		
+		return Clipperz.Crypto.SRP._g;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'exception': {
+		'InvalidValue': new MochiKit.Base.NamedError("Clipperz.Crypto.SRP.exception.InvalidValue") 
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
+//#############################################################################
+//
+//		S R P   C o n n e c t i o n     version 1.0
+//
+//=============================================================================
+Clipperz.Crypto.SRP.Connection = function (args) {
+	args = args || {};
+
+	this._C = args.C;
+	this._P = args.P;
+	this.hash = args.hash;
+
+	this._a = null;
+	this._A = null;
+	
+	this._s = null;
+	this._B = null;
+
+	this._x = null;
+	
+	this._u = null;
+	this._K = null;
+	this._M1 = null;
+	this._M2 = null;
+	
+	this._sessionKey = null;
+
+	return this;
+}
+
+Clipperz.Crypto.SRP.Connection.prototype = MochiKit.Base.update(null, {
+
+	'toString': function () {
+		return "Clipperz.Crypto.SRP.Connection (username: " + this.username() + "). Status: " + this.statusDescription();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'C': function () {
+		return this._C;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'P': function () {
+		return this._P;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'a': function () {
+		if (this._a == null) {
+			this._a = new Clipperz.Crypto.BigInt(Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(32).toHexString().substring(2), 16);
+//			this._a = new Clipperz.Crypto.BigInt("37532428169486597638072888476611365392249575518156687476805936694442691012367", 10);
+//MochiKit.Logging.logDebug("SRP a: " + this._a);
+		}
+		
+		return this._a;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'A': function () {
+		if (this._A == null) {
+			//	Warning: this value should be strictly greater than zero: how should we perform this check?
+			this._A = Clipperz.Crypto.SRP.g().powerModule(this.a(), Clipperz.Crypto.SRP.n());
+			
+			if (this._A.equals(0)) {
+MochiKit.Logging.logError("Clipperz.Crypto.SRP.Connection: trying to set 'A' to 0.");
+				throw Clipperz.Crypto.SRP.exception.InvalidValue;
+			}
+//MochiKit.Logging.logDebug("SRP A: " + this._A);
+		}
+		
+		return this._A;
+	},
+
+	//-------------------------------------------------------------------------
+
+	's': function () {
+		return this._s;
+//MochiKit.Logging.logDebug("SRP s: " + this._S);
+	},
+
+	'set_s': function(aValue) {
+		this._s = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'B': function () {
+		return this._B;
+	},
+
+	'set_B': function(aValue) {
+		//	Warning: this value should be strictly greater than zero: how should we perform this check?
+		if (! aValue.equals(0)) {
+			this._B = aValue;
+//MochiKit.Logging.logDebug("SRP B: " + this._B);
+		} else {
+MochiKit.Logging.logError("Clipperz.Crypto.SRP.Connection: trying to set 'B' to 0.");
+			throw Clipperz.Crypto.SRP.exception.InvalidValue;
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'x': function () {
+		if (this._x == null) {
+			this._x = new Clipperz.Crypto.BigInt(this.stringHash(this.s().asString(16, 64) + this.P()), 16);
+//MochiKit.Logging.logDebug("SRP x: " + this._x);
+		}
+		
+		return this._x;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'u': function () {
+		if (this._u == null) {
+			this._u = new Clipperz.Crypto.BigInt(this.stringHash(this.B().asString()), 16);
+//MochiKit.Logging.logDebug("SRP u: " + this._u);
+		}
+		
+		return this._u;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'S': function () {
+		if (this._S == null) {
+			var bigint;
+			var	srp;
+
+			bigint = Clipperz.Crypto.BigInt;
+			srp = 	 Clipperz.Crypto.SRP;
+
+			this._S =	bigint.powerModule(
+								bigint.subtract(this.B(), bigint.powerModule(srp.g(), this.x(), srp.n())),
+								bigint.add(this.a(), bigint.multiply(this.u(), this.x())),
+								srp.n()
+						)
+//MochiKit.Logging.logDebug("SRP S: " + this._S);
+		}
+		
+		return this._S;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'K': function () {
+		if (this._K == null) {
+			this._K = this.stringHash(this.S().asString());
+//MochiKit.Logging.logDebug("SRP K: " + this._K);
+		}
+		
+		return this._K;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'M1': function () {
+		if (this._M1 == null) {
+			this._M1 = this.stringHash(this.A().asString(10) + this.B().asString(10) + this.K());
+//MochiKit.Logging.logDebug("SRP M1: " + this._M1);
+		}
+		
+		return this._M1;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'M2': function () {
+		if (this._M2 == null) {
+			this._M2 = this.stringHash(this.A().asString(10) + this.M1() + this.K());
+//MochiKit.Logging.logDebug("SRP M2: " + this._M2);
+		}
+		
+		return this._M2;
+	},
+
+	//=========================================================================
+
+	'serverSideCredentialsWithSalt': function(aSalt) {
+		var result;
+		var s, x, v;
+		
+		s = aSalt;
+		x = this.stringHash(s + this.P());
+		v = Clipperz.Crypto.SRP.g().powerModule(new Clipperz.Crypto.BigInt(x, 16), Clipperz.Crypto.SRP.n());
+
+		result = {};
+		result['C'] = this.C();
+		result['s'] = s;
+		result['v'] = v.asString(16);
+		
+		return result;
+	},
+	
+	'serverSideCredentials': function() {
+		var result;
+		var s;
+		
+		s = Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(32).toHexString().substring(2);
+
+		result = this.serverSideCredentialsWithSalt(s);
+		
+		return result;
+	},
+	
+	//=========================================================================
+/*
+	'computeServerSide_S': function(b) {
+		var result;
+		var v;
+		var bigint;
+		var	srp;
+
+		bigint = Clipperz.Crypto.BigInt;
+		srp = 	 Clipperz.Crypto.SRP;
+
+		v = new Clipperz.Crypto.BigInt(srpConnection.serverSideCredentialsWithSalt(this.s().asString(16, 64)).v, 16);
+//		_S =  (this.A().multiply(this.v().modPow(this.u(), this.n()))).modPow(this.b(), this.n());
+		result = bigint.powerModule(
+					bigint.multiply(
+						this.A(),
+						bigint.powerModule(v, this.u(), srp.n())
+					), new Clipperz.Crypto.BigInt(b, 10), srp.n()
+				);
+
+		return result;
+	},
+*/
+	//=========================================================================
+
+	'stringHash': function(aValue) {
+		var	result;
+
+		result = this.hash(new Clipperz.ByteArray(aValue)).toHexString().substring(2);
+		
+		return result;
+	},
+	
+	//=========================================================================
+	__syntaxFix__: "syntax fix"
+	
+});
+
+//#############################################################################
diff --git a/frontend/beta/js/Clipperz/DOM.js b/frontend/beta/js/Clipperz/DOM.js
new file mode 100644
index 0000000..7c27359
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/DOM.js
@@ -0,0 +1,131 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.DOM) == 'undefined') { Clipperz.DOM = {}; }
+
+Clipperz.DOM.VERSION = "0.1";
+Clipperz.DOM.NAME = "Clipperz.DOM";
+
+MochiKit.Base.update(Clipperz.DOM, {
+
+	//-------------------------------------------------------------------------
+
+	'__repr__': function () {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'selectOptionMatchingValue': function (aSelectElement, aValue, shouldUseCaseInsensitiveTest) {
+		var selectedOptionIndex;
+		var i, c;
+		
+		selectedOptionIndex = -1;
+		
+		c = aSelectElement.options.length;
+		for (i=0; (i<c) && (selectedOptionIndex == -1); i++) {
+			if (shouldUseCaseInsensitiveTest == true) {
+				if (aSelectElement.options[i].value.toLowerCase() == aValue.toLowerCase()) {
+					selectedOptionIndex = i;
+				}
+			} else {
+				if (aSelectElement.options[i].value == aValue) {
+					selectedOptionIndex = i;
+				}
+			}
+		}
+		
+		if (selectedOptionIndex != -1) {
+			aSelectElement.selectedIndex = selectedOptionIndex;
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'setFormContents': function(aNode, someValues) {
+		var node;
+		var values;
+		var i, c;
+		
+		values = {};
+		c = someValues[0].length;
+		for (i=0; i<c; i++) {
+			values[someValues[0][i]] = someValues[1][i];
+		}
+		
+//		var m = MochiKit.Base;
+//		var self = MochiKit.DOM;
+		if (typeof(aNode) == "undefined" || aNode === null) {
+			node = MochiKit.DOM._document.body;
+		} else {
+			node = MochiKit.DOM.getElement(aNode);
+		}
+
+		MochiKit.Base.nodeWalk(node, function(aNode) {
+			var result;
+			var name;
+
+			result = null;
+			name = aNode.name;
+			if (MochiKit.Base.isNotEmpty(name) && (typeof(values[name]) != 'undefined')) {
+				var tagName;
+
+				tagName = aNode.tagName.toUpperCase();
+				if (tagName === "INPUT" && (aNode.type == "radio" || aNode.type == "checkbox")) {
+					aNode.checked = values[name];
+				} else if (tagName === "SELECT") {
+					if (aNode.type == "select-one") {
+						Clipperz.DOM.selectOptionMatchingValue(aNode, values[name]);
+					} else { //	aNode.type == "select-multiple"
+MochiKit.Logging.logWarning("### unhandled Select.type = 'select-multiple' condition");
+					}
+				} else if (tagName === "FORM" || tagName === "P" || tagName === "SPAN" || tagName === "DIV") {
+					result = aNode.childNodes;
+				} else {
+					aNode.value = values[name]
+				}
+			} else {
+				result = aNode.childNodes;
+			}
+
+			return result;
+		});
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
diff --git a/frontend/beta/js/Clipperz/Date.js b/frontend/beta/js/Clipperz/Date.js
new file mode 100644
index 0000000..4103b88
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Date.js
@@ -0,0 +1,305 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.Date) == 'undefined') { Clipperz.Date = {}; }
+
+Clipperz.Date.VERSION = "0.1";
+Clipperz.Date.NAME = "Clipperz.Date";
+
+MochiKit.Base.update(Clipperz.Date, {
+
+	//-------------------------------------------------------------------------
+
+	'__repr__': function () {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'daysInMonth': [31,28,31,30,31,30,31,31,30,31,30,31],
+
+	//-------------------------------------------------------------------------
+
+	'englishOrdinalDaySuffixForDate': function(aDate) {
+		var result;
+		
+		switch (aDate.getDate()) {
+			case 1:
+			case 21:
+			case 31:
+				result =  "st";
+				break;
+			case 2:
+			case 22:
+				result = "nd";
+				break;
+			case 3:
+			case 23:
+				result = "rd";
+				break;
+			default:
+				result = "th";
+				break;
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isLeapYear': function(aDate) {
+		var year;
+		var result;
+		
+		year = aDate.getFullYear();
+		result = ((year & 0x03) == 0 && (year % 100 || (year % 400 == 0 && year)));
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'getDaysInMonth': function(aDate) {
+		var result;
+		
+		if (aDate.getMonth() == 1) {
+			Clipperz.Date.isLeapYear(aDate)
+			result += Clipperz.Date.isLeapYear(aDate) ? 29 : 28;
+		} else {
+			result = Clipperz.Date.daysInMonth[aDate.getMonth()];
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'getTimezone': function(aDate) {
+		var result;
+
+		result = aDate.toString();
+		result = result.replace(/([A-Z]{3}) [0-9]{4}/, '$1');
+		result = result.replace(/^.*?\(([A-Z])[a-z]+ ([A-Z])[a-z]+ ([A-Z])[a-z]+\)$/, "$1$2$3");
+		
+		return result;
+	},
+
+	'getGMTOffset': function(aDate) {
+		return (aDate.getTimezoneOffset() > 0 ? "-" : "+")	+ MochiKit.Format.numberFormatter('00')(Math.floor(this.getTimezoneOffset() / 60))
+															+ MochiKit.Format.numberFormatter('00')(this.getTimezoneOffset() % 60);
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'dayOfYear': function(aDate) {
+		var result;
+		var i,c;
+		
+		result = 0;
+		c = aDate.getMonth();
+		for (i=0; i<c; i++) {
+			if (i == 1) {
+				result += Clipperz.Date.isLeapYear(aDate) ? 29 : 28;
+			} else {
+				result += Clipperz.Date.daysInMonth[i];
+			}
+		}
+		return num + this.getDate() - 1;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'getPHPLikeFormatCode': function(aCharacter) {
+		var result;
+
+		switch (aCharacter) {
+			case "d":
+				result = " + MochiKit.Format.numberFormatter('00')(aDate.getDate())";
+				break;
+			case "D":
+				result = " + aLocale['shortDays'][aDate.getDay()]";
+				break;
+			case "j":
+				result = " + aDate.getDate()";
+				break;
+			case "l":
+				result = " + aLocale['days'][aDate.getDay()]";
+				break;
+			case "S":
+				result = " + Clipperz.Date.englishOrdinalDaySuffixForDate(aDate)";
+				break;
+			case "w":
+				result = " + aDate.getDay()";
+				break;
+			case "z":
+				result = " + aDate.getDayOfYear()";
+				break;
+			case "W":
+				result = " + aDate.getWeekOfYear()";
+				break;
+			case "F":
+				result = " + aLocale['months'][aDate.getMonth()]";
+				break;
+			case "m":
+				result = " + MochiKit.Format.numberFormatter('00')(aDate.getMonth() + 1)";
+				break;
+			case "M":
+				result = " + aLocale['shortMonths'][aDate.getMonth()]";
+				break;
+			case "n":
+				result = " + (aDate.getMonth() + 1)";
+				break;
+			case "t":
+				result = " + Clipperz.Date.getDaysInMonth(aDate)";
+				break;
+			case "L":
+				result = " + (Clipperz.Date.isLeapYear(aDate) ? 1 : 0)";
+				break;
+			case "Y":
+				result = " + aDate.getFullYear()";
+				break;
+			case "y":
+				result = " + ('' + aDate.getFullYear()).substring(2, 4)";
+				break;
+			case "a":
+				result = " + (aDate.getHours() < 12 ? aLocale['amDesignation'] : aLocale['pmDesignation'])";
+				break;
+			case "A":
+				result = " + (aDate.getHours() < 12 ? aLocale['amDesignation'].toUpperCase() : aLocale['pmDesignation'].toUpperCase())";
+				break;
+			case "g":
+				result = " + ((aDate.getHours() %12) ? aDate.getHours() % 12 : 12)";
+				break;
+			case "G":
+				result = " + aDate.getHours()";
+				break;
+			case "h":
+				result = " + MochiKit.Format.numberFormatter('00')((aDate.getHours() %12) ? aDate.getHours() % 12 : 12)";
+				break;
+			case "H":
+				result = " + MochiKit.Format.numberFormatter('00')(aDate.getHours())";
+				break;
+			case "i":
+				result = " + MochiKit.Format.numberFormatter('00')(aDate.getMinutes())";
+				break;
+			case "s":
+				result = " + MochiKit.Format.numberFormatter('00')(aDate.getSeconds())";
+				break;
+			case "O":
+				result = " + aDate.getGMTOffset()";
+				break;
+			case "T":
+				result = " + Clipperz.Date.getTimezone(aDate)";
+				break;
+			case "Z":
+				result = " + ( + aDate.getTimezoneOffset() * -60)";
+				break;
+			default:
+				result = " + '" + aCharacter + "'";
+				break;
+		};
+		
+		return result;
+	},
+
+	//=========================================================================
+
+	'formatDateWithPHPLikeTemplateAndLocale': function(aDate, aFormat, aLocale) {
+		var result;
+		var formatterCode;
+		var formatter;
+		var i,c;
+		
+//MochiKit.Logging.logDebug(">>> Clipperz.Date.formatDateWithPHPLikeTemplateAndLocale");
+		formatterCode = "Clipperz.Date.__scratchFormatter = function(aDate, aLocale){return ''";
+
+		c = aFormat.length;
+		i = 0;
+		
+		while (i<c) {
+	    	var character;
+	
+	        character = aFormat.charAt(i);
+			if (character == "\\") {
+				i++;
+				character = aFormat.charAt(i);
+				formatterCode += " + '" + character + "'"
+			} else {
+	            formatterCode += Clipperz.Date.getPHPLikeFormatCode(character);
+			}
+			
+			i++;
+		}
+		
+		formatterCode += ";}";
+//MochiKit.Logging.logDebug("--- Clipperz.Date.formatDateWithPHPLikeTemplateAndLocale - formatterCode: " + formatterCode);
+		eval(formatterCode);
+		
+		result = Clipperz.Date.__scratchFormatter.call(this, aDate, aLocale);
+		delete Clipperz.Date.__scratchFormatter;
+//MochiKit.Logging.logDebug("<<< Clipperz.Date.formatDateWithPHPLikeTemplateAndLocale");
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'parseDateWithPHPLikeTemplateAndLocale': function(aString, aFormat, aLocale) {
+		return new Date();
+	},
+
+	//=========================================================================
+	
+	'formatDateWithUTCFormatAndLocale': function(aDate, aLocale) {
+//		return Clipperz.Date.formatWithJavaLikeTemplateAndLocale(aDate, "EEE, dd MMMM yyyy HH:mm:ss zzz", aLocale);
+		return aDate.toString();
+	},
+	
+	'parseDateWithUTCFormatAndLocale': function(aValue, aLocale) {
+		return new Date(Date.parse(aValue));
+	},
+
+	//=========================================================================
+	
+	'exception': {
+//		'AbstractMethod': new MochiKit.Base.NamedError("Clipperz.Base.exception.AbstractMethod"),
+//		'UnknownType':    new MochiKit.Base.NamedError("Clipperz.Base.exception.UnknownType") 
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
diff --git a/frontend/beta/js/Clipperz/KeePassExportProcessor.js b/frontend/beta/js/Clipperz/KeePassExportProcessor.js
new file mode 100644
index 0000000..ba56b8e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/KeePassExportProcessor.js
@@ -0,0 +1,251 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+
+
+Clipperz.KeePassExportProcessor = function(args) {
+	args = args || {};
+
+	return this;
+}
+
+//=============================================================================
+
+Clipperz.KeePassExportProcessor.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+/*
+	'parse': function(aValue) {
+		var result;
+
+//MochiKit.Logging.logDebug(">>> KeePassExportProcessor.parse");
+		result = [];
+//MochiKit.Logging.logDebug("--- KeePassExportProcessor.parse - result: " + Clipperz.Base.serializeJSON(result));
+//MochiKit.Logging.logDebug("<<< KeePassExportProcessor.parse");
+
+		return result;
+	},
+*/
+	//-------------------------------------------------------------------------
+
+	'deferredParse_core': function(aContext) {
+		var deferredResult;
+
+//MochiKit.Logging.logDebug(">>> KeePassExportProcessor.deferredParse_core");		
+//MochiKit.Logging.logDebug("--- KeePassExportProcessor.deferredParse_core - (1) aContext.line: " + aContext.line.replace(/\n/g, "\\n").substring(0,50));		
+//MochiKit.Logging.logDebug("--- KeePassExportProcessor.deferredParse_core - aContext: " + Clipperz.Base.serializeJSON(aContext).substring(0,50));		
+//MochiKit.Logging.logDebug("--- KeePassExportProcessor.deferredParse_core - (2) aContext.line: " + aContext.line.replace(/\n/g, "\\n").substring(0,50));		
+//console.log("deferredParse_core - aContext", aContext);
+//MochiKit.Logging.logDebug("--- KeePassExportProcessor.deferredParse_core - (3) aContext.line: " + aContext.line.replace(/\n/g, "\\n").substring(0,50));		
+		if (aContext.line == "") {
+			deferredResult = MochiKit.Async.succeed(aContext.result);
+		} else {
+			var record;
+			
+			record = this.parseRecord(aContext);
+			if (record != null) {
+				aContext.result.push(record);
+			}
+
+//MochiKit.Logging.logDebug("--> KeePassExportProcessor.deferredParse_core - aContext.line: " + aContext.line.replace(/\n/g, "\\n").substring(0,50));		
+			aContext.line = aContext.line.replace(/^\n*/g, "").replace(/\n$/g, "");
+//MochiKit.Logging.logDebug("<-- KeePassExportProcessor.deferredParse_core - aContext.line: " + aContext.line.replace(/\n/g, "\\n").substring(0,50));		
+			
+			deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassExportProcessor.deferredParse_core - 1.1 " + res); return res;});
+			deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'importProcessorProgressUpdate', {status:'processing', size:aContext.size, progress:(aContext.size - aContext.line.length)});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassExportProcessor.deferredParse_core - 1.2 " + res); return res;});
+			deferredResult.addCallback(MochiKit.Async.wait, 0.2);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassExportProcessor.deferredParse_core - 1.3 " + res); return res;});
+//deferredResult.addBoth(function(res) {console.log("KeePassExportProcessor.deferredParse_core - 1.3 ", res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'deferredParse_core'))
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassExportProcessor.deferredParse_core - 1.4 " + res); return res;});
+			deferredResult.callback(aContext);
+		}
+//MochiKit.Logging.logDebug("<<< KeePassExportProcessor.deferredParse_core");		
+		
+		return deferredResult;
+	},
+	
+	//.........................................................................
+	
+	'deferredParse': function(aValue) {
+		var deferredResult;
+		var lines;
+		var context;
+
+//MochiKit.Logging.logDebug(">>> KeePassExportProcessor.deferredParse");
+//MochiKit.Logging.logDebug("--- KeePassExportProcessor.deferredParse - aValue: " + aValue.length);
+		lines = aValue.replace(/\r?\n/g, "\n");
+//MochiKit.Logging.logDebug("--- KeePassExportProcessor.deferredParse - lines: " + lines.length);
+		context = {
+			line: lines,
+			size: lines.length,
+			result: []
+		}
+//MochiKit.Logging.logDebug("--- KeePassExportProcessor.deferredParse - context: " + Clipperz.Base.serializeJSON(context).substring(0,50));
+//console.log("--- KeePassExportProcessor.deferredParse - context: ", context);
+
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassExportProcessor.deferredParse - 1 " + res); return res;});
+//deferredResult.addBoth(function(res) {console.log("KeePassExportProcessor.deferredParse - 1 ", res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'deferredParse_core'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassExportProcessor.deferredParse - 2 " + res); return res;});
+		deferredResult.callback(context);
+//MochiKit.Logging.logDebug("<<< KeePassExportProcessor.deferredParse");
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'parseRecord': function(aContext) {
+		var result;
+		var recordLabelRegexp;
+		var	fieldLabelRegexp;
+		var fieldValueRegexp;
+		var fullLineRegexp;
+/*
+[Record name]
+Group Tree: 
+UserName: 
+URL: 
+Password: 
+Notes: test
+UUID: 525f62430079bae48b79ed2961924b05
+Icon: 0
+Creation Time: 2007-06-26 17:56:03
+Last Access: 2007-10-25 16:23:51
+Last Modification: 2007-10-25 16:23:51
+Expires: 2999-12-28 23:59:59
+
+[Record name]								==> Title
+Group: General								==> Group
+Group Tree: 								==> Group Tree
+UserName: 									==> UserName
+URL: 										==>	URL
+Password: 									==>	Password
+Notes: test									==>	Notes
+UUID: 525f62430079bae48b79ed2961924b05		==>	UUID
+Icon: 0										==>	Icon
+Creation Time: 2007-06-26 17:56:03			==>	Creation Time
+Last Access: 2007-10-25 16:23:51			==>	Last Access
+Last Modification: 2007-10-25 16:23:51		==>	Last Modification
+Expires: 2999-12-28 23:59:59				==> Expires
+Attachment Description:						==> Attachment Description
+Attachment:									==> Attachment
+*/
+		recordLabelRegexp = new RegExp("^\\[(.*)\\]\\n");
+//		recordLabelRegexp = new RegExp("^\\[(.*)\\]$", "m");
+		fieldLabelRegexp = new RegExp("^(Group|Group Tree|UserName|URL|Password|Notes|UUID|Icon|Creation Time|Last Access|Last Modification|Expires|Attachment Description|Attachment|Valid until): ");
+		fieldValueRegexp = new RegExp("(.*)(\\n|$)");
+		fullLineRegexp = new RegExp("^(.*\\n)");
+
+
+		if (recordLabelRegexp.test(aContext.line) == true) {
+			var line;
+			
+//MochiKit.Logging.logDebug("1.0");
+			line = aContext.line;
+//MochiKit.Logging.logDebug("0 - line: " + line.replace(/\n/g, "\\n").substring(0,50));
+			
+			result = {};
+			result['Title'] = line.match(recordLabelRegexp)[1];
+//MochiKit.Logging.logDebug("1 - title: " + result['Title']);
+			line = line.replace(/^.*\n/, "");
+//MochiKit.Logging.logDebug("2 - line: " + line.replace(/\n/g, "\\n").substring(0,50));
+//MochiKit.Logging.logDebug("=======================================");
+			while (fieldLabelRegexp.test(line) == true) {
+				var fieldName;
+				var fieldValue;
+				
+				fieldName = RegExp.$1;
+//MochiKit.Logging.logDebug("3 - fieldName: " + fieldName);
+				line = RegExp.rightContext;
+//MochiKit.Logging.logDebug("4 - line: " + line.replace(/\n/g, "\\n").substring(0,50));
+				
+				fieldValue = line.match(fieldValueRegexp)[1];
+//MochiKit.Logging.logDebug("5 - fieldValue: " + fieldValue);
+				line = RegExp.rightContext;
+//MochiKit.Logging.logDebug("6 - line: " + line.replace(/\n/g, "\\n").substring(0,50));
+
+				if (fieldName == 'Notes') {
+					var isMultiline;
+					
+					isMultiline = false;
+					
+//MochiKit.Logging.logDebug("7 - fieldLabelRegexp.test(line): " + fieldLabelRegexp.test(line) + " - recordLabelRegexp.test(line): " + recordLabelRegexp.test(line));
+					if ((line != "") && (fieldLabelRegexp.test(line) == false) && (recordLabelRegexp.test(line) == false)) {
+						fieldValue += '\n';
+					}
+					
+					while ((line != "") && (fieldLabelRegexp.test(line) == false) && (recordLabelRegexp.test(line) == false)) {
+						var newLineValue;
+						
+						newLineValue = line.match(fullLineRegexp)[1];
+						if (newLineValue != "\n") {
+							isMultiline = true;
+						}
+						fieldValue += newLineValue;
+//MochiKit.Logging.logDebug("8 - fieldValue: " + fieldValue);
+						line = RegExp.rightContext;
+//MochiKit.Logging.logDebug("9 - line: " + line.replace(/\n/g, "\\n").substring(0,50));
+//MochiKit.Logging.logDebug("10 - fieldLabelRegexp.test(line): " + fieldLabelRegexp.test(line) + " - recordLabelRegexp.test(line): " + recordLabelRegexp.test(line));
+					}
+
+					if (isMultiline) {
+						fieldValue = fieldValue.replace(/\n$/g, "");
+					} else {
+						fieldValue = fieldValue.replace(/\n\n$/g, "");
+					}
+					
+					line = line.replace(/^\n/, '');
+				}
+//MochiKit.Logging.logDebug("5 - fieldValue: " + fieldValue);
+				
+				result[fieldName] = fieldValue;
+//MochiKit.Logging.logDebug("6 - line: " + line.replace(/\n/g, "\\n").substring(0,50));
+//MochiKit.Logging.logDebug("---------------------------------------");
+			}
+		} else {
+//MochiKit.Logging.logDebug("2.0");
+			result = null;
+		}
+		
+		aContext.line = line;
+//MochiKit.Logging.logDebug("#######################################");
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+
diff --git a/frontend/beta/js/Clipperz/NotificationCenter.js b/frontend/beta/js/Clipperz/NotificationCenter.js
new file mode 100644
index 0000000..815d4fd
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/NotificationCenter.js
@@ -0,0 +1,325 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.NotificationCenter) == 'undefined') { Clipperz.NotificationCenter = {}; }
+
+
+//#############################################################################
+
+Clipperz.NotificationCenterEvent = function(args) {
+	args = args || {};
+//	MochiKit.Base.bindMethods(this);
+
+	this._source = args.source || null;
+	this._event = args.event || null;
+	this._parameters = args.parameters || null;
+	this._isSynchronous = args.isSynchronous || false;
+	
+	return this;
+}
+
+//=============================================================================
+
+Clipperz.NotificationCenterEvent.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+
+	'toString': function() {
+		return "Clipperz.NotificationCenterEvent";
+		//return "Clipperz.NotificationCenterEvent {source: " + this.source() + ", event: " + this.event() + ", parameters: " + this.parameters() + "}";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'source': function() {
+		return this._source;
+	},
+	
+	'setSource': function(aValue) {
+		this._source = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'event': function() {
+		return this._event;
+	},
+	
+	'setEvent': function(aValue) {
+		this._event = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'parameters': function() {
+		return this._parameters;
+	},
+	
+	'setParameters': function(aValue) {
+		this._parameters = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'isSynchronous': function() {
+		return this._isSynchronous;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+
+//#############################################################################
+//#############################################################################
+
+Clipperz.NotificationCenter = function(args) {
+	args = args || {};
+//	MochiKit.Base.bindMethods(this);
+
+	this._listeners = {};
+	this._useSynchronousListenerInvocation = args.useSynchronousListenerInvocation || false;
+	this._timeoutDelay = args.timeoutDelay || 0.1;
+
+	return this;
+}
+
+//=============================================================================
+
+Clipperz.NotificationCenter.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+
+	'toString': function() {
+		return "Clipperz.NotificationCenter";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'useSynchronousListenerInvocation': function() {
+		return this._useSynchronousListenerInvocation;
+	},
+	
+	'setUseSynchronousListenerInvocation': function(aValue) {
+		this._useSynchronousListenerInvocation = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'timeoutDelay': function() {
+		return this._timeoutDelay;
+	},
+	
+	'setTimeoutDelay': function(aValue) {
+		this._timeoutDelay = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'listeners': function() {
+		return this._listeners;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'register': function(aSource, anEvent, aListener, aMethod) {
+		var	eventListeners;
+		var	listenerInfo;
+		var	eventKey;
+
+		if (anEvent != null) {
+			eventKey = anEvent;
+		} else {
+			eventKey = '_notificationCenter_matchAnyEvent_key_';
+		}
+		
+		eventListeners = this.listeners()[eventKey];
+		
+		if (eventListeners == null) {
+			eventListeners = [];
+			this.listeners()[eventKey] = eventListeners;
+		}
+
+		listenerInfo = {};
+		if (aSource != null) {
+			listenerInfo['source'] = aSource;
+		} else {
+			listenerInfo['source'] = 'any';
+		}
+		
+		listenerInfo['listener'] = aListener;
+		listenerInfo['method'] = aMethod;
+
+		eventListeners.push(listenerInfo);
+
+		return listenerInfo;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'removeListenerInfoFromListeners': function(aListener, someListeners) {
+		var	listenerIndex;
+		var	i,c;
+		
+		if (someListeners != null) {
+			listenerIndex = -1;
+			c = someListeners.length;
+			for (i=0; i<c; i++) {
+				var	listenerInfo;
+			
+				listenerInfo = someListeners[i];
+				if (listenerInfo['listener'] === aListener) {
+					listenerIndex = i;
+				}
+			}
+
+			if (listenerIndex != -1) {
+				Clipperz.Base.removeObjectAtIndexFromArray(listenerIndex, someListeners);
+			}
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'unregister': function(aListener, anEvent) {
+		if (anEvent == null) {
+			var	allListenerList;
+			var	i, c;
+			
+//			allListenerList = Clipperz.Base.values(this.listeners());
+			allListenerList = MochiKit.Base.values(this.listeners());
+			c = allListenerList.length;
+			for (i=0; i<c; i++) {
+				this.removeListenerInfoFromListeners(aListener, allListenerList[i]);
+			}
+		} else {
+			this.removeListenerInfoFromListeners(aListener, this.listeners()[anEvent]);
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'asysnchronousListenerNotification': function(anEventInfo, aMethod, aListener) {
+		MochiKit.Async.callLater(this.timeoutDelay(), MochiKit.Base.partial(MochiKit.Base.methodcaller(aMethod, anEventInfo), aListener));
+//		setTimeout(MochiKit.Base.partial(MochiKit.Base.methodcaller(aMethod, anEventInfo), aListener), this.timeoutDelay());
+	},
+
+	//-------------------------------------------------------------------------
+
+	'processListenerInfo': function(anEventInfo, aListenerInfo) {
+		var	shouldInvokeListenerMethod;
+
+		if (aListenerInfo['source'] == 'any') {
+			shouldInvokeListenerMethod = true;
+		} else {
+			if (aListenerInfo['source'] === anEventInfo.source()) {
+				shouldInvokeListenerMethod = true;
+			} else {
+				shouldInvokeListenerMethod = false;
+			}
+		}
+
+		if (shouldInvokeListenerMethod) {
+			if (this.useSynchronousListenerInvocation() || anEventInfo.isSynchronous()) {
+//MochiKit.Logging.logDebug("syncrhronous listener invocation");
+				try {
+//					MochiKit.Base.map(MochiKit.Base.methodcaller(aListenerInfo['method'], anEventInfo), [aListenerInfo['listener']]);
+//console.log("notification: ", aListenerInfo['listener'], aListenerInfo['method'], anEventInfo);
+					MochiKit.Base.method(aListenerInfo['listener'], aListenerInfo['method'], anEventInfo)();
+				} catch(exception) {
+					MochiKit.Logging.logError('NotificationCenter ERROR: unable to invoke method \'' + aListenerInfo['method'] + '\' on object ' + aListenerInfo['listener']);
+				}
+			} else {
+				var asyncMethod;
+				
+//MochiKit.Logging.logDebug("asyncrhronous listener invocation");
+				asyncMethod = MochiKit.Base.bind(this.asysnchronousListenerNotification, this)
+				MochiKit.Base.map(MochiKit.Base.partial(asyncMethod, anEventInfo, aListenerInfo['method']), [aListenerInfo['listener']]);
+			}
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'notify': function(aSource, anEvent, someEventParameters, isSynchronous) {
+		var	eventInfo;
+		var processInfoMethod;
+
+//MochiKit.Logging.logDebug(">>> NotificationCenter.notify");
+		eventInfo = new Clipperz.NotificationCenterEvent({source:aSource, event:anEvent, parameters:someEventParameters, isSynchronous:isSynchronous});
+//MochiKit.Logging.logDebug("--- NotificationCenter.notify - 1");
+		processInfoMethod = MochiKit.Base.bind(this.processListenerInfo, this);
+//MochiKit.Logging.logDebug("--- NotificationCenter.notify - 2");
+
+		MochiKit.Base.map(MochiKit.Base.partial(processInfoMethod, eventInfo), this.listeners()[anEvent] || []);
+//MochiKit.Logging.logDebug("--- NotificationCenter.notify - 3");
+		MochiKit.Base.map(MochiKit.Base.partial(processInfoMethod, eventInfo), this.listeners()['_notificationCenter_matchAnyEvent_key_'] || []);
+//MochiKit.Logging.logDebug("<<< NotificationCenter.notify");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'deferredNotification': function(aSource, anEvent, someEventParameters, aDeferredResult) {
+		
+		this.notify(aSource, anEvent, someEventParameters, true);
+		
+		return aDeferredResult;
+//		return MochiKit.Async.wait(1, aDeferredResult);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'resetStatus': function() {
+		this._listeners = {};
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
+//#############################################################################
+
+Clipperz.NotificationCenter.defaultNotificationCenter = new Clipperz.NotificationCenter();
+
+Clipperz.NotificationCenter.notify = MochiKit.Base.method(Clipperz.NotificationCenter.defaultNotificationCenter, 'notify');
+Clipperz.NotificationCenter.register = MochiKit.Base.method(Clipperz.NotificationCenter.defaultNotificationCenter, 'register');
+Clipperz.NotificationCenter.unregister = MochiKit.Base.method(Clipperz.NotificationCenter.defaultNotificationCenter, 'unregister');
+Clipperz.NotificationCenter.deferredNotification = MochiKit.Base.method(Clipperz.NotificationCenter.defaultNotificationCenter, 'deferredNotification');
+/*
+_clipperz_notificationCenter_defaultNotificationCenter = null;
+
+Clipperz.NotificationCenter.defaultNotificationCenter = function() {
+	if (_clipperz_notificationCenter_defaultNotificationCenter == null) {
+		_clipperz_notificationCenter_defaultNotificationCenter = new Clipperz.NotificationCenter();
+	}
+
+	return _clipperz_notificationCenter_defaultNotificationCenter;
+};
+*/
diff --git a/frontend/beta/js/Clipperz/PM/BookmarkletProcessor.js b/frontend/beta/js/Clipperz/PM/BookmarkletProcessor.js
new file mode 100644
index 0000000..4dfdd8e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/BookmarkletProcessor.js
@@ -0,0 +1,288 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+//if (typeof(Clipperz.PM.BookmarkletProcessor) == 'undefined') { Clipperz.PM.BookmarkletProcessor = {}; }
+//if (typeof(Clipperz.PM.BookmarkletProcessor.versions) == 'undefined') { Clipperz.PM.BookmarkletProcessor.versions = {}; }
+
+/*
+Clipperz.PM.BookmarkletProcessor.versions['abstract'] = function(anUser, aConfiguration) {
+	this._user = anUser;
+	this._configuration = aConfiguration;
+	
+	this._recordTitle = null;
+	this._record = null;
+	this._editableFields = null;
+	
+	return this;
+}
+
+
+Clipperz.PM.BookmarkletProcessor.versions['abstract'].prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "BookmarkletProcessor - " + this.user();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'configuration': function() {
+		return this._configuration;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'record': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+*/
+
+Clipperz.PM.BookmarkletProcessor = function(anUser, aConfiguration) {
+	this._user = anUser;
+	this._configuration = aConfiguration;
+	
+	this._recordTitle = null;
+	this._record = null;
+	this._editableFields = null;
+	this._favicon = null;
+	
+	return this;
+}
+
+Clipperz.PM.BookmarkletProcessor.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "BookmarkletProcessor - " + this.user();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'configuration': function() {
+		return this._configuration;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'recordTitle': function() {
+		if (this._recordTitle == null) {
+			this._recordTitle = this.configuration().page.title;
+		}
+		
+		return this._recordTitle;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'fields': function() {
+		return this.configuration().form.inputs;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'editableFields': function() {
+		if (this._editableFields == null) {
+			this._editableFields = MochiKit.Base.filter(function(aField) {
+				var result;
+				var type;
+		
+				type = aField['type'].toLowerCase();
+				result = ((type != 'hidden') && (type != 'submit') && (type != 'checkbox') && (type != 'radio') && (type != 'select'));
+		
+				return result;
+			}, this.fields())
+		}
+		
+		return this._editableFields;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'hostname': function() {
+		if (this._hostname == null) {
+			var actionUrl;
+			
+			actionUrl = this.configuration()['form']['attributes']['action'];
+//MochiKit.Logging.logDebug("+++ actionUrl: " + actionUrl);
+			this._hostname = actionUrl.replace(/^https?:\/\/([^\/]*)\/.*/, '$1');
+		}
+		
+		return this._hostname;
+	},
+	
+	'favicon': function() {
+		if (this._favicon == null) {
+			this._favicon = "http://" + this.hostname() + "/favicon.ico";
+//MochiKit.Logging.logDebug("+++ favicon: " + this._favicon);
+		}
+		
+		return this._favicon;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'record': function() {
+		if (this._record == null) {
+			var record;
+			var recordVersion;
+			var directLogin;
+			var bindings;
+			var i,c;
+			
+			record = new Clipperz.PM.DataModel.Record({
+								label:this.recordTitle(),
+								notes:"",
+								user:this.user()
+			});
+			recordVersion = new Clipperz.PM.DataModel.RecordVersion(record, {})
+			record.setCurrentVersion(recordVersion);
+			
+			bindings = {};
+			
+			c = this.editableFields().length;
+			for (i=0; i<c; i++) {
+				var formField;
+				var recordField;
+
+//MochiKit.Logging.logDebug(">>> adding a field");
+				formField = this.editableFields()[i];
+				recordField = new Clipperz.PM.DataModel.RecordField({
+									recordVersion:recordVersion,
+									label:formField['name'],
+									value:formField['value'],
+									type:Clipperz.PM.Strings.inputTypeToRecordFieldType[formField['type']],
+									hidden:false
+				});
+				recordVersion.addField(recordField);
+				
+				bindings[formField['name']] = recordField.key();
+//MochiKit.Logging.logDebug("<<< adding a field");
+			}
+
+			directLogin = new Clipperz.PM.DataModel.DirectLogin({
+								record:record,
+								label:this.recordTitle() + Clipperz.PM.Strings['newDirectLoginLabelSuffix'],
+//								bookmarkletVersion:this.version(),
+								bookmarkletVersion:'0.2',
+								favicon:this.favicon(),
+								formData:this.configuration()['form'],
+								bindingData:bindings
+			});
+			record.addDirectLogin(directLogin);
+
+			this.user().addRecord(record);
+			
+			this._record = record;
+		}
+		
+		return this._record;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//#############################################################################
+
+Clipperz.PM.BookmarkletProcessor.createRecordFromBookmarkletConfiguration = function(anUser, aConfiguration) {
+	var processor;
+
+	processor = new Clipperz.PM.BookmarkletProcessor(anUser, aConfiguration);
+	
+	return processor.record();
+};
+
+//-----------------------------------------------------------------------------
+
+Clipperz.PM.BookmarkletProcessor.sanitizeBookmarkletConfiguration = function(aConfiguration) {
+	var result;
+	
+//	throw "XSS Bookmarklet attempt";
+
+	result = aConfiguration;
+	
+	return result;
+};
+
+//-----------------------------------------------------------------------------
+
+Clipperz.PM.BookmarkletProcessor.checkBookmarkletConfiguration = function(aConfiguration, aButton, aCallback) {
+	var result;
+	
+	try {
+		result = Clipperz.Base.evalJSON(aConfiguration);
+		result = Clipperz.PM.BookmarkletProcessor.sanitizeBookmarkletConfiguration(result);
+		
+		if (result['version'] != '0.2.3') {
+			throw "WrongBookmarkletVersion";
+		}
+	} catch (exception) {
+		var title;
+		var message;
+
+		if (exception == "WrongBookmarkletVersion") {
+			title = Clipperz.PM.Strings['newRecordPanelWrongBookmarkletVersionExceptionTitle'];
+			message = Clipperz.PM.Strings['newRecordPanelWrongBookmarkletVersionExceptionMessage'];
+		} else {
+			title = Clipperz.PM.Strings['newRecordPanelGeneralExceptionTitle'];
+			message = Clipperz.PM.Strings['newRecordPanelGeneralExceptionMessage'];
+		}
+		Clipperz.PM.Components.MessageBox().show({
+			title:title,
+			text:message,
+			width:240,
+			fn:aCallback,
+			closable:false,
+			showProgressBar:false,
+			showCloseButton:false,
+			buttons:{'ok':Clipperz.PM.Strings['newRecordPanelExceptionPanelCloseButtonLabel']}
+		}, aButton);
+
+		throw exception;
+	}
+	
+	return result;
+};
+
+//-----------------------------------------------------------------------------
diff --git a/frontend/beta/js/Clipperz/PM/Components/BaseComponent.js b/frontend/beta/js/Clipperz/PM/Components/BaseComponent.js
new file mode 100644
index 0000000..67e257b
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/BaseComponent.js
@@ -0,0 +1,124 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+
+//#############################################################################
+
+var _Clipperz_PM_Components_Panels_base_id_ = 0;
+
+//#############################################################################
+
+Clipperz.PM.Components.BaseComponent = function(anElement, args) {
+	args = args || {};
+//	MochiKit.Base.bindMethods(this);
+//	Clipperz.PM.Components.BaseComponent.superclass.constructor.call(this, args);
+
+	this._element = anElement;
+	this._ids = {};
+	
+	return this;
+}
+
+//=============================================================================
+
+//MochiKit.Base.update(Clipperz.PM.Components.BaseComponent.prototype, {
+YAHOO.extendX(Clipperz.PM.Components.BaseComponent, YAHOO.ext.util.Observable, {
+
+	'isClipperzPMComponent': true,
+	
+	//-------------------------------------------------------------------------
+
+	'toString': function () {
+		return "Clipperz.PM.Components.BaseComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'domHelper': function() {
+		return Clipperz.YUI.DomHelper;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'element': function() {
+//MochiKit.Logging.logDebug(">>> BaseComponent.element");
+		return this._element;
+	},
+	
+	'setElement': function(aValue) {
+		this._element = aValue;
+	},
+
+	//-----------------------------------------------------
+
+	'remove': function() {
+//MochiKit.Logging.logDebug(">>> BaseComponent.remove");
+		Clipperz.NotificationCenter.unregister(this);
+		MochiKit.Signal.disconnectAllTo(this);
+//MochiKit.Logging.logDebug("<<< BaseComponent.remove");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'getId': function(aValue) {
+		var	result;
+		
+		result = this._ids[aValue];
+		
+		if (typeof(result) == 'undefined') {
+			_Clipperz_PM_Components_Panels_base_id_ ++;
+			
+			result = "Clipperz_PM_Components_Panels_" + aValue + "_" + _Clipperz_PM_Components_Panels_base_id_;
+			this._ids[aValue] = result;
+//MochiKit.Logging.logDebug(">>> getId(" + aValue + ") = " + result);
+		} else {
+//MochiKit.Logging.logDebug("<<< getId(" + aValue + ") = " + result);
+		}
+	
+		return result;
+	},
+
+	'getDom': function(aValue) {
+		return YAHOO.util.Dom.get(this.getId(aValue));
+	},
+	
+	'getElement': function(aValue) {
+		return YAHOO.ext.Element.get(this.getId(aValue));
+	},
+	
+	'getActor': function(aValue, anAnimator) {
+ 		return new YAHOO.ext.Actor(this.getDom(aValue), anAnimator);
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
diff --git a/frontend/beta/js/Clipperz/PM/Components/Compact/CompactHeader.js b/frontend/beta/js/Clipperz/PM/Components/Compact/CompactHeader.js
new file mode 100644
index 0000000..e51b56f
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Compact/CompactHeader.js
@@ -0,0 +1,86 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Compact) == 'undefined') { Clipperz.PM.Components.Compact = {}; }
+
+Clipperz.PM.Components.Compact.CompactHeader = function(anElement, args) {
+
+    Clipperz.PM.Components.Compact.CompactHeader.superclass.constructor.call(this, anElement, args);
+
+	this.render();
+	
+	return this;
+};
+
+YAHOO.extendX(Clipperz.PM.Components.Compact.CompactHeader, Clipperz.PM.Components.BaseComponent, {
+	
+	'toString': function() {
+		return "Clipperz.PM.Components.Compact.CompactHeader";
+	},
+
+	//-----------------------------------------------------
+	
+	'render': function() {
+		this.element().update("");
+
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', children:[
+			{tag:'img', src:'./images/logo.gif'},
+			{tag:'div', id:'lockBlock', children:[
+				{tag:'input', type:'checkbox', id:'autolock'},
+				{tag:'span', html:'auto'},
+				{tag:'a', href:'#', htmlString:Clipperz.PM.Strings['lockMenuLabel'], id:'lock'}
+			]}
+		]});
+		
+		Clipperz.YUI.DomHelper.append(this.element().dom, 
+			{tag:'div', id:'compactMiscLinks', children:[
+				{tag:'a', id:'donateHeaderIconLink', target:'_blank', href:Clipperz.PM.Strings['donateHeaderLinkUrl'], children:[
+					{tag:'img', id:'donateHeaderLinkIcon', src:'./images/smiles_small.gif'}
+				]},
+				{tag:'ul', children:[
+					{tag:'li', children:[{tag:'a', id:'donateHeaderLink', html:'donate', target:'_blank'}]},
+					{tag:'li', children:[{tag:'a', id:'creditsHeaderLink', html:'credits', target:'_blank'}]},
+					{tag:'li', children:[{tag:'a', id:'feedbackHeaderLink', html:'feedback', target:'_blank'}]},
+					{tag:'li', children:[{tag:'a', id:'helpHeaderLink', html:'help', target:'_blank'}]},
+					{tag:'li', children:[{tag:'a', id:'forumHeaderLink', html:'forum', target:'_blank'}]}
+				]}
+			]}
+		);
+
+		YAHOO.ext.Element.get('lockBlock').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		Clipperz.NotificationCenter.notify(this, 'switchLanguage');
+	},
+
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
+
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Compact/CompactInterface.js b/frontend/beta/js/Clipperz/PM/Components/Compact/CompactInterface.js
new file mode 100644
index 0000000..492f815
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Compact/CompactInterface.js
@@ -0,0 +1,312 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Compact) == 'undefined') { Clipperz.PM.Components.Compact = {}; }
+
+Clipperz.PM.Components.Compact.CompactInterface = function(anElement, args) {
+
+    Clipperz.PM.Components.Compact.CompactInterface.superclass.constructor.call(this, anElement, args);
+
+	this._directLoginItemTemplate = null;
+	this._user = args.user;
+	this._autoLockTimer = null;
+	
+	Clipperz.NotificationCenter.register(null, 'updatedProgressState', this, 'userNotificationHandler')
+	Clipperz.NotificationCenter.register(null, 'directLoginAdded', this, 'directLoginAddedHandler');
+	
+	this.render();
+	
+	return this;
+};
+
+YAHOO.extendX(Clipperz.PM.Components.Compact.CompactInterface, Clipperz.PM.Components.BaseComponent, {
+	
+	'toString': function() {
+		return "Clipperz.PM.Components.Compact.CompactInterface";
+	},
+
+	//-----------------------------------------------------
+	
+	'render': function() {
+		var result;
+		var	layout;
+		var registerButton;
+		
+//MochiKit.Logging.logDebug(">>> CompactInterface.render");
+		this.element().update("");
+		
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', children:[
+			{tag:'div', id:this.getId('cantentPanel'), children:[
+				{tag:'h4', id:this.getId('message')},
+				{tag:'ul', id:'directLogins', children:[]}
+			]},
+			{tag:'div', id:this.getId('lockPanel'), cls:'lockPanel', children:[
+				{tag:'div', htmlString:Clipperz.PM.Strings['lockDescription']},
+				{tag:'form', id:'lockDialogForm', children:[
+					{tag:'input', type:'password', id:this.getId('lockPassphrase')}
+				]},
+				{tag:'div', id:this.getId('unlock')}
+			]}
+		]});
+
+		this.getElement('lockPanel').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+
+		YAHOO.ext.Element.get('lockBlock').show();
+		MochiKit.Signal.connect(YAHOO.ext.Element.get('lock').dom, 'onclick', this, 'doLockEventHandler');
+		new YAHOO.ext.Button(this.getId('unlock'), {text:Clipperz.PM.Strings['unlockButtonLabel'], handler:this.doUnlockEventHandler, scope:this, minWidth:0});
+		this.getElement('unlock').swallowEvent('click', true);
+		new Clipperz.PM.Components.PasswordEntropyDisplay(this.getElement('lockPassphrase'));
+		MochiKit.Signal.connect('lockDialogForm', 'onsubmit', this, 'doUnlockEventHandler');
+
+		this.getElement('cantentPanel').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+//MochiKit.Logging.logDebug("<<< CompactInterface.render");
+
+		return result;
+	},
+
+	//-----------------------------------------------------
+
+	'directLoginAddedHandler': function(anEvent) {
+		this.redrawDirectLoginItems();
+	},
+
+	//-----------------------------------------------------
+
+	'compareDirectLogins': function(a, b) {
+		return MochiKit.Base.compare(a.label().toLowerCase(), b.label().toLowerCase());
+	},
+
+	//-----------------------------------------------------
+
+	'redrawDirectLoginItems': function() {
+		var template;
+		var allDirectLogins;
+
+		this.getElement('message').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+//MochiKit.Logging.logDebug(">>> CompactInterface.redrawDirectLoginItems");
+//MochiKit.Logging.logDebug("--- CompactInterface.redrawDirectLoginItems - 0");
+		MochiKit.Iter.forEach(YAHOO.ext.Element.get('directLogins').getChildrenByTagName('li'), function(aDirectLoginElement) {
+			MochiKit.Signal.disconnectAll(aDirectLoginElement.dom);
+//MochiKit.Logging.logDebug("disconnecting IMG " + aDirectLoginElement.getChildrenByTagName('img')[0].dom.src);
+			MochiKit.Signal.disconnectAll(aDirectLoginElement.getChildrenByTagName('img')[0].dom);
+		})
+//MochiKit.Logging.logDebug("--- CompactInterface.redrawDirectLoginItems - 1");
+		YAHOO.ext.Element.get('directLogins').update("");
+//MochiKit.Logging.logDebug("--- CompactInterface.redrawDirectLoginItems - 2");
+		allDirectLogins = MochiKit.Base.values(this.user().directLoginReferences());
+//MochiKit.Logging.logDebug("--- CompactInterface.redrawDirectLoginItems - 3");
+		allDirectLogins.sort(this.compareDirectLogins);
+
+//MochiKit.Logging.logDebug("--- CompactInterface.redrawDirectLoginItems - 4");
+		template = this.directLoginItemTemplate();
+//MochiKit.Logging.logDebug("--- CompactInterface.redrawDirectLoginItems - 5");
+		MochiKit.Iter.forEach(allDirectLogins, MochiKit.Base.bind(function(aDirectLogin) {
+			var	directLoginElement;
+			var	faviconImageElementID;
+			
+			faviconImageElementID = aDirectLogin.reference() + "_faviconIMG";
+			directLoginElement = template.append('directLogins', {
+				elementID:faviconImageElementID,
+				faviconUrl:aDirectLogin.fixedFavicon(), 
+				directLoginTitle:aDirectLogin.label(),
+				directLoginReference:aDirectLogin.reference()
+			}, true);
+//MochiKit.Logging.logDebug("--- CompactInterface.redrawDirectLoginItems - 6: " + recordElement.dom);
+			directLoginElement.addClassOnOver("hover");
+			MochiKit.Signal.connect(directLoginElement.dom, 'onclick', this, 'handleDirectLoginClick');
+
+			MochiKit.Signal.connect(faviconImageElementID, 'onload', this, 'handleLoadedFaviconImage');
+			MochiKit.Signal.connect(faviconImageElementID, 'onerror', aDirectLogin, 'handleMissingFaviconImage');
+			MochiKit.Signal.connect(faviconImageElementID, 'onabort', aDirectLogin, 'handleMissingFaviconImage');
+			
+//			YAHOO.ext.Element.get(faviconImageElementID).dom.src = aDirectLogin.fixedFavicon();
+		}, this));
+		
+		this.resetAutoLockTimer();
+//MochiKit.Logging.logDebug("<<< CompactInterface.redrawDirectLoginItems");
+	},
+
+	//-----------------------------------------------------
+
+	'directLoginItemTemplate': function() {
+		if (this._directLoginItemTemplate == null) {
+			this._directLoginItemTemplate = Clipperz.YUI.DomHelper.createTemplate({tag:'li', id:'{directLoginReference}', children:[
+				{tag:'table', border:'0', cellpadding:'0', cellspacing:'0', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', width:'20', align:'center', valign:'top', children:[
+								{tag:'img', id:'{elementID}', src:'{faviconUrl}'}
+							]},
+							{tag:'td', valign:'top', children:[
+								{tag:'a', cls:'directLoginItemTitle', html:'{directLoginTitle}'}
+							]}
+						]}
+					]}
+				]}
+			]});
+			this._directLoginItemTemplate.compile();
+		}
+		
+		return this._directLoginItemTemplate;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handleDirectLoginClick': function(anEvent) {
+		var	directLoginReference;
+//MochiKit.Logging.logDebug(">>> MainPanel.handleDirectLoginClick !!!");
+
+		directLoginReference = this.user().directLoginReferences()[anEvent.src().id];
+		this.openDirectLogin(directLoginReference);
+		this.resetAutoLockTimer();
+//MochiKit.Logging.logDebug("<<< MainPanel.handleDirectLoginClick");		
+	},
+
+	//-----------------------------------------------------
+
+	'openDirectLogin': function(aDirectLoginReference) {
+		var	deferredResult;
+		var	newWindow;
+				
+//MochiKit.Logging.logDebug(">>> MainPanel.openDirectLogin - " + aDirectLoginReference.label());
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.openDirectLogin - 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(aDirectLoginReference, 'setupJumpPageWindow'));
+		deferredResult.addCallback(MochiKit.Base.method(aDirectLoginReference, 'deferredDirectLogin'));
+		deferredResult.addCallback(function(aDirectLogin) {
+			aDirectLogin.runDirectLogin(newWindow);
+		});
+
+		newWindow = window.open(Clipperz.PM.Strings['directLoginJumpPageUrl'], "");
+//		MochiKit.Signal.connect(newWindow, 'onload', MochiKit.Base.method(deferredResult, 'callback', newWindow))
+//		MochiKit.Signal.connect(newWindow, 'onload', MochiKit.Base.partial(alert, "done"));
+		deferredResult.callback(newWindow);
+//MochiKit.Logging.logDebug("<<< MainPanel.openDirectLogin");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handleLoadedFaviconImage': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> MainPanel.handleLoadedFaviconImage");
+		MochiKit.Signal.disconnectAll(anEvent.src())
+//MochiKit.Logging.logDebug("<<< MainPanel.handleLoadedFaviconImage");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'doLockEventHandler': function(anEvent) {
+		anEvent.stop();
+		this.lock();
+	},
+
+	'doUnlockEventHandler': function(anEvent) {
+		if (typeof(anEvent.stop) != 'undefined') {
+			anEvent.stop();
+		}
+		this.unlock();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'autolock': function() {
+		var	shouldAutoLock;
+		
+		shouldAutoLock = YAHOO.ext.Element.get('autolock').dom.checked;
+		
+		if (shouldAutoLock) {
+			this.lock();
+		} else {
+			this.resetAutoLockTimer();
+		}
+	},
+	
+	'lock': function() {
+//MochiKit.Logging.logDebug(">>> lock");
+		this.getDom('lockPassphrase').value = "";
+		this.getElement('lockPanel').show();
+		this.getElement('cantentPanel').hide();
+		YAHOO.ext.Element.get('lockBlock').hide();
+		//this.getElement('lockPassphrase').focus();
+//MochiKit.Logging.logDebug("<<< lock");
+	},
+	
+	'unlock': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> unlock");
+		if (this.getDom('lockPassphrase').value == this.user().passphrase()) {
+			this.getElement('lockPanel').hide();
+			this.getElement('cantentPanel').show();
+			YAHOO.ext.Element.get('lockBlock').show();
+			this.resetAutoLockTimer();
+		} else {
+			this.getDom('lockPassphrase').value = "";
+			this.getElement('lockPassphrase').focus();
+		}
+//MochiKit.Logging.logDebug("<<< unlock");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	//-----------------------------------------------------
+
+	'autoLockTimer': function() {
+		if (this._autoLockTimer == null) {
+//MochiKit.Logging.logDebug("--- timer started - 1");
+			this._autoLockTimer = MochiKit.Async.callLater(60, MochiKit.Base.method(this, 'autolock'));
+//MochiKit.Logging.logDebug("--- timer started - 2");
+		}
+		
+		return this._autoLockTimer;
+	},
+
+	'resetAutoLockTimer': function() {
+//MochiKit.Logging.logDebug(">>> timer resetted");
+		this.autoLockTimer().cancel();
+		this._autoLockTimer = null;
+//MochiKit.Logging.logDebug("--- timer resetted - 1");
+		this.autoLockTimer();
+//MochiKit.Logging.logDebug("<<< timer resetted");
+	},
+
+	//-----------------------------------------------------
+	
+	'userNotificationHandler': function(anEvent) {
+		this.getElement('message').update(anEvent.parameters().text);
+	},
+	
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
+
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Compact/LoginForm.js b/frontend/beta/js/Clipperz/PM/Components/Compact/LoginForm.js
new file mode 100644
index 0000000..d708464
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Compact/LoginForm.js
@@ -0,0 +1,189 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Compact) == 'undefined') { Clipperz.PM.Components.Compact = {}; }
+
+Clipperz.PM.Components.Compact.LoginForm = function(anElement, args) {
+
+    Clipperz.PM.Components.Compact.LoginForm.superclass.constructor.call(this, anElement, args);
+
+	this.render();
+	Clipperz.NotificationCenter.register(null, 'updatedProgressState', this, 'userNotificationHandler')
+	
+	return this;
+};
+
+YAHOO.extendX(Clipperz.PM.Components.Compact.LoginForm, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Compact.LoginForm";
+	},
+
+	//-----------------------------------------------------
+	
+	'render': function() {
+		var result;
+		var	layout;
+		
+		MochiKit.Signal.disconnectAllTo(this);
+		this.element().update("");
+		
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', id:this.getId('baseDiv'), cls:'LoginPanel', children:[
+			{tag:'div', id:'compactHeader'},
+			{tag:'div', id:'compactBody', children:[
+				{tag:'form', id:this.getId('loginForm_form'), children:[
+					{tag:'dl', children:[
+						{tag:'dt', htmlString:Clipperz.PM.Strings['loginFormUsernameLabel']},
+						{tag:'dd', children:[
+							{tag:'input', id:this.getId('login_username'), type:'text', size:'30', name:'username'}
+						]},
+						{tag:'dt', htmlString:Clipperz.PM.Strings['loginFormPassphraseLabel']},
+						{tag:'dd', children:[
+							{tag:'input', id:this.getId('login_passphrase'), type:'password', size:'30', name:'passphrase'}
+						]}
+					]},
+					{tag:'div', id:this.getId('login_submit')}
+				]},
+				{tag:'h4', id:this.getId('message')}
+			]}
+		]});
+
+		new Clipperz.PM.Components.Compact.CompactHeader(YAHOO.ext.Element.get('compactHeader'));
+
+		MochiKit.Signal.connect(this.getId('loginForm_form'), 'onsubmit', this, 'stopFormSubmit');
+		new YAHOO.ext.Button(this.getId('login_submit'), {text:Clipperz.PM.Strings['loginFormButtonLabel'], handler:this.doLogin, scope:this, minWidth:0});
+		this.getElement('login_submit').swallowEvent('click', true);
+		
+		MochiKit.Signal.connect(this.getId('loginForm_form'), 'onkeydown', this, 'onkeydown');
+
+		new Clipperz.PM.Components.PasswordEntropyDisplay(this.getElement('login_passphrase'));
+		this.getElement('login_username').focus();
+
+		return result;
+	},
+
+	//-----------------------------------------------------
+	
+	'doLogin': function(e) {
+//MochiKit.Logging.logDebug(">>> compact.LoginForm.doLogin");
+		if (this.checkLoginForm()) {
+			this.doLoginWithUsernameAndPassphrase(this.getDom('login_username').value, this.getDom('login_passphrase').value);
+		}
+//MochiKit.Logging.logDebug("<<< compact.LoginForm.doLogin");
+	},
+
+	//.........................................................................
+
+	'doLoginWithUsernameAndPassphrase': function(anUsername, aPassphrase) {
+		var deferredResult;
+		var user;
+
+//MochiKit.Logging.logDebug(">>> compact.LoginForm.doLoginWithUsernameAndPassphrase");
+		user = new Clipperz.PM.DataModel.User({username:anUsername, passphrase:aPassphrase});
+
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(user, 'connect'));
+		deferredResult.addCallback(MochiKit.Base.method(user, 'loadPreferences'));
+		deferredResult.addCallback(MochiKit.Base.method(user, 'loadRecords'));
+		deferredResult.addCallback(MochiKit.Base.method(user, 'loadDirectLogins'));
+		deferredResult.addErrback(MochiKit.Base.bind(function() {
+			this.getElement('loginForm_form').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show();
+			this.getElement('message').update(Clipperz.PM.Strings['loginMessagePanelFailureText']);
+			this.getDom('login_passphrase').value = "";
+			this.getElement('login_passphrase').focus();
+		}, this))
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("compact.LoginForm.doLogin - 6: " + res); return res;});
+		deferredResult.callback("token");
+//MochiKit.Logging.logDebug("<<< compact.LoginForm.doLoginWithUsernameAndPassphrase");
+		
+		return deferredResult;
+	},
+	
+	//.........................................................................
+
+	'checkLoginForm': function() {
+		var result;
+		var username
+		var	passphrase;
+
+//MochiKit.Logging.logDebug(">>> checkLoginForm");
+		username = this.getDom('login_username').value;
+		passphrase = this.getDom('login_passphrase').value;
+		
+		if ((username != "") && (passphrase != "")) {
+			result = true;
+		} else {
+			if (username == "") {
+				this.getElement('login_username').focus();
+			} else if (passphrase == "") {
+				this.getElement('login_passphrase').focus();
+			}
+			
+			result = false;
+		}
+//MochiKit.Logging.logDebug("<<< checkLoginForm - " + result);
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'stopFormSubmit': function(anEvent) {
+		anEvent.stop();
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'onkeydown': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> onkeydown - " + anEvent.src().id);
+		if (anEvent.key().code == 13) {
+			this.doLogin();
+			anEvent.stop();
+		}
+	},
+
+	//-----------------------------------------------------
+
+	'userNotificationHandler': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> compact.LoginForm.userNotificationHandler");
+//MochiKit.Logging.logDebug("userNotificationHandler - event: " + anEvent.event());
+		this.getElement('loginForm_form').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		if (this.getDom('message') != null) {
+			this.getElement('message').update(Clipperz.PM.Strings.messagePanelConfigurations[anEvent.parameters()]()['text']);
+		}
+//MochiKit.Logging.logDebug("<<< compact.LoginForm.userNotificationHandler");
+	},
+
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
+
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportColumns.js b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportColumns.js
new file mode 100644
index 0000000..18b36da
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportColumns.js
@@ -0,0 +1,174 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+if (typeof(Clipperz.PM.Components.Import.CSVImport) == 'undefined') { Clipperz.PM.Components.Import.CSVImport = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.CSVImport.CSVImportColumns = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Import.CSVImport.CSVImportColumns.superclass.constructor.call(this, anElement, args);
+	this._mainComponent = args.mainComponent;
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.CSVImport.CSVImportColumns, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.CSVImport.CSVImportColumns component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'mainComponent': function() {
+		return this._mainComponent;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		var i,c;
+		var columnSelectorCheckboxCells;
+		var checkboxes;
+		var data;
+
+//MochiKit.Logging.logDebug(">>> CSVImportColumns.render");
+		Clipperz.NotificationCenter.unregister(this);
+		MochiKit.Signal.disconnectAllTo(this);
+
+		this.element().update("");
+
+		data = this.mainComponent().parsedValues();
+		columnSelectorCheckboxCells = [];
+		
+		c =	data[0].length;
+		for (i=0; i<c; i++) {
+			columnSelectorCheckboxCells.push({tag:'th', valign:'top', cls:(this.mainComponent().isColumnSelected(i) ? 'selectedColumn': 'skippedColumn'), children:[
+				{tag:'input', type:'checkbox', id:this.getId('columnCheckbox_' + i), value:i}
+			]})
+		}
+		
+		this.domHelper().append(this.element(), {tag:'div', children:[
+			{tag:'div', cls:'importStepDescription', htmlString:Clipperz.PM.Strings['CSV_ImportWizard_Columns']},
+			{tag:'div', id:this.getId('dataDiv'), cls:'csvImportPreview', children:[
+				{tag:'table', id:this.getId('previewDada'), cls:'csvImportPreview columns', cellspacing:'0', children:[
+					{tag:'thead', id:this.getId('previewData_thead'), children:[
+						{tag:'tr', children:columnSelectorCheckboxCells}
+					]},
+					{tag:'tbody', id:this.getId('previewData_tbody'), children:[]}
+				]}
+			]}
+		]});
+
+		c =	data[0].length;
+		for (i=0; i<c; i++) {
+			if (this.mainComponent().isColumnSelected(i)) {
+				this.getDom('columnCheckbox_' + i).checked = true;
+			}
+		}
+		
+		this.renderData(this.getElement('previewData_tbody'), data);
+
+		checkboxes = MochiKit.DOM.getElementsByTagAndClassName('input', null, this.getDom('previewData_thead'));
+		c = checkboxes.length;
+		for (i=0; i<c; i++) {
+			MochiKit.Signal.connect(checkboxes[i], 'onclick', this, 'renderDataHandler');
+		}
+//MochiKit.Logging.logDebug("<<< CSVImportColumns.render");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'renderData': function(anElement, someData) {
+		var config;
+		var i,c;
+		
+//MochiKit.Logging.logDebug(">>> CSVImportColumns.renderData");
+//		anElement.update("");
+		MochiKit.DOM.replaceChildNodes(anElement.dom);
+
+		config = MochiKit.Base.map(MochiKit.Base.bind(function(aRowData) {
+			var result;
+			var i,c;
+			
+			result = {tag:'tr', children:[]};
+			c = aRowData.length;
+			for (i=0; i<c; i++) {
+				var field;
+				
+				field = aRowData[i];
+				result.children.push({tag:'td', valign:'top', cls:(this.mainComponent().isColumnSelected(i) ? 'selectedColumn': 'skippedColumn'), html:(MochiKit.Base.isNotEmpty(field) ? field.replace(/\n/g, '<br>') : '&nbsp;')});
+			}
+			
+			return result;
+		}, this), someData);
+		
+		MochiKit.Base.map(function(aRowConfig) {Clipperz.YUI.DomHelper.append(anElement, aRowConfig);}, config);
+
+		Clipperz.Style.applyZebraStylesToTable(this.getId('previewDada'));
+//MochiKit.Logging.logDebug("<<< CSVImportColumns.renderData");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderDataHandler': function(anEvent) {
+		var thElement;
+		
+		thElement = YAHOO.ext.Element.get(anEvent.src().parentNode);
+
+		if (anEvent.src().checked == true) {
+			this.mainComponent().skippedColumns().remove(anEvent.src().value);
+			thElement.addClass('selectedColumn');
+			thElement.removeClass('skippedColumn');
+		} else {
+			this.mainComponent().skippedColumns().add(anEvent.src().value);
+			thElement.removeClass('selectedColumn');
+			thElement.addClass('skippedColumn');
+		}
+
+		if (this.mainComponent().skippedColumns().allItems().length == this.mainComponent().parsedValues()[0].length) {
+			this.mainComponent().nextButton().disable();
+		} else {
+			this.mainComponent().nextButton().enable();
+		}
+		
+		this.renderData(this.getElement('previewData_tbody'), this.mainComponent().parsedValues());
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportFields.js b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportFields.js
new file mode 100644
index 0000000..a368747
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportFields.js
@@ -0,0 +1,247 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+if (typeof(Clipperz.PM.Components.Import.CSVImport) == 'undefined') { Clipperz.PM.Components.Import.CSVImport = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.CSVImport.CSVImportFields = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Import.CSVImport.CSVImportFields.superclass.constructor.call(this, anElement, args);
+	this._mainComponent = args.mainComponent;
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.CSVImport.CSVImportFields, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.CSVImport.CSVImportFields component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'mainComponent': function() {
+		return this._mainComponent;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		var	fieldsHeaderCells;
+		var titleColumnIndex;
+		var notesColumnIndex;
+		var i,c;
+
+		Clipperz.NotificationCenter.unregister(this);
+		MochiKit.Signal.disconnectAllTo(this);
+
+		this.element().update("");
+
+		titleColumnIndex = this.mainComponent().titleColumnIndex()
+		notesColumnIndex = this.mainComponent().notesColumnIndex()
+
+		fieldsHeaderCells = [];
+		fieldsHeaderCells.push({tag:'td', valign:'top', cls:'title', html:this.mainComponent().labelForColumn(titleColumnIndex)});
+		
+		c =	this.mainComponent().parsedValues()[0].length;
+		for (i=0; i<c; i++) {
+			if ((i != titleColumnIndex) && (i != notesColumnIndex) && (this.mainComponent().isColumnSelected(i))) {
+				var trimmedLabel;
+				
+				trimmedLabel = Clipperz.Base.trim(this.mainComponent().labelForColumn(i));
+				fieldsHeaderCells.push({tag:'td', valign:'top', id:this.getId('fieldHeaderTD_' + i), cls:((trimmedLabel == "") ? 'missingLabelWarning' : (this.isColumnSetup(i) ? 'configuredColumn': 'unconfiguredColumn')), children:[
+					{tag:'span', html:((trimmedLabel == "") ? Clipperz.PM.Strings['CSV_ImportWizard_Fields_MissingLabelWarning'] : trimmedLabel)/*, cls:((trimmedLabel == "") ? 'missingLabelWarning' : '')*/},
+					{tag:'select', id:this.getId('select_' + i), name:i, children:[
+						{tag:'option', value:'UNDEFINED', html:"select data type", cls:'disabledOption'},
+						{tag:'option', value:'TXT', htmlString:Clipperz.PM.Strings['recordFieldTypologies']['TXT']['shortDescription']},
+						{tag:'option', value:'PWD', htmlString:Clipperz.PM.Strings['recordFieldTypologies']['PWD']['shortDescription']},
+						{tag:'option', value:'URL', htmlString:Clipperz.PM.Strings['recordFieldTypologies']['URL']['shortDescription']},
+						{tag:'option', value:'DATE', htmlString:Clipperz.PM.Strings['recordFieldTypologies']['DATE']['shortDescription']},
+						{tag:'option', value:'ADDR', htmlString:Clipperz.PM.Strings['recordFieldTypologies']['ADDR']['shortDescription']}
+					]}
+				]})
+			}
+		}
+
+		if (notesColumnIndex != -1) {
+			fieldsHeaderCells.push({tag:'td', valign:'top', cls:'notes', html:this.mainComponent().labelForColumn(notesColumnIndex)});
+		}
+
+		this.domHelper().append(this.element(), {tag:'div', children:[
+			{tag:'div', cls:'importStepDescription', htmlString:Clipperz.PM.Strings['CSV_ImportWizard_Fields']},
+			{tag:'div', id:this.getId('dataDiv'), children:[
+				{tag:'div', children:[
+				]},
+				{tag:'div', cls:'csvImportPreview', children:[
+					{tag:'table', id:this.getId('previewDada'), cls:'csvImportPreview', cellspacing:'0', children:[
+						{tag:'thead', id:this.getId('previewData_thead'), children:[
+							{tag:'tr', cls:'CSV_previewData_header', children:fieldsHeaderCells}
+						]},
+						{tag:'tbody', id:this.getId('previewData_tbody'), children:[]}
+					]}
+				]}
+			]}
+		]});
+		
+		for (i=0; i<c; i++) {
+			if ((i != titleColumnIndex) && (i != notesColumnIndex) && (this.mainComponent().isColumnSelected(i))) {
+				Clipperz.DOM.selectOptionMatchingValue(this.getDom('select_' + i), this.mainComponent().typeForColumn(i));
+				MochiKit.Signal.connect(this.getDom('select_' + i), 'onchange', this, 'renderDataRowsHandler');
+			}
+		}
+		
+		this.renderDataRows(this.getElement('previewData_tbody'));
+//		Clipperz.NotificationCenter.register(null, 'updatedCSVImportColumnHeader', this, 'renderDataRowsHandler');
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isColumnSetup': function(aColumnIndex) {
+		return ((Clipperz.Base.trim(this.mainComponent().labelForColumn(aColumnIndex)) != "") && (this.mainComponent().typeForColumn(aColumnIndex) != 'UNDEFINED'));
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderDataRowsHandler': function(anEvent) {
+		var columnIndex;
+		var tdElement;
+
+//MochiKit.Logging.logDebug(">>> renderDataRowsHandler")
+		columnIndex = anEvent.src().name;
+		this.mainComponent().setTypeForColumn(anEvent.src().value, columnIndex);
+		
+		tdElement = this.getElement('fieldHeaderTD_' + columnIndex);
+		
+		if (this.isColumnSetup(columnIndex)) {
+			tdElement.removeClass('unconfiguredColumn');
+			tdElement.addClass('configuredColumn');
+		} else {
+			tdElement.addClass('unconfiguredColumn');
+			tdElement.removeClass('configuredColumn');
+		}
+		
+		this.renderDataRows(this.getElement('previewData_tbody'));
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'renderDataRows': function(anElement) {
+		var titleColumnIndex;
+		var notesColumnIndex;
+		var data
+		var i,c;
+
+//MochiKit.Logging.logDebug("#### >> renderDataRows");
+//		anElement.update("");
+		MochiKit.DOM.replaceChildNodes(anElement.dom);
+
+		if (this.mainComponent().isFirstRowHeader()) {
+			data = this.mainComponent().parsedValues().slice(1);
+		} else {
+			data = this.mainComponent().parsedValues();
+		}
+		
+		
+		titleColumnIndex = this.mainComponent().titleColumnIndex();
+		notesColumnIndex = this.mainComponent().notesColumnIndex();
+		
+		c = data.length;
+		for (i=0; i<c; i++) {
+			var rowData;
+			var rowConfig;
+			var ii, cc;
+			
+			rowData = data[i];
+			
+			rowConfig = {tag:'tr', children:[
+				{tag:'td', valign:'top', cls:'title', html:(MochiKit.Base.isNotEmpty(rowData[titleColumnIndex]) ? rowData[titleColumnIndex].replace(/\n/g, '<br>') : '&nbsp;')}
+			]};
+
+			cc = rowData.length;
+			for (ii=0; ii<cc; ii++) {
+//				if ((ii != titleColumnIndex) && (ii != notesColumnIndex)) {
+				if ((ii != titleColumnIndex) && (ii != notesColumnIndex) && (this.mainComponent().isColumnSelected(ii))) {
+					rowConfig.children.push({
+						tag:'td',
+						valign:'top',
+						cls:(this.isColumnSetup(ii) ? 'configuredColumn' : 'unconfiguredColumn'),
+						html:(MochiKit.Base.isNotEmpty(rowData[ii]) ? rowData[ii].replace(/\n/g, '<br>') : '&nbsp;')
+					});
+				}
+			}
+			if (notesColumnIndex != -1) {
+				rowConfig.children.push({tag:'td', valign:'top', cls:'notes', html:(MochiKit.Base.isNotEmpty(rowData[notesColumnIndex]) ? rowData[notesColumnIndex].replace(/\n/g, '<br>') : '&nbsp;')});
+			}
+			
+			this.domHelper().append(anElement, rowConfig);
+		}
+
+		Clipperz.Style.applyZebraStylesToTable(this.getId('previewDada'));
+
+		this.checkWetherToEnableNextButton();
+//MochiKit.Logging.logDebug("#### << renderDataRows");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'checkWetherToEnableNextButton': function() {
+		var result;
+		var titleColumnIndex;
+		var notesColumnIndex;
+		var i,c;
+
+		titleColumnIndex = this.mainComponent().titleColumnIndex()
+		notesColumnIndex = this.mainComponent().notesColumnIndex()
+
+		result = true;
+		c =	this.mainComponent().parsedValues()[0].length;
+		for (i=0; i<c; i++) {
+			if ((i != titleColumnIndex) && (i != notesColumnIndex) && (this.mainComponent().isColumnSelected(i))) {
+				result = result && this.isColumnSetup(i);
+			}
+		}
+		
+		if (result) {
+			this.mainComponent().nextButton().enable();
+		} else {
+			this.mainComponent().nextButton().disable();
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportHeader.js b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportHeader.js
new file mode 100644
index 0000000..ebd243a
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportHeader.js
@@ -0,0 +1,240 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+if (typeof(Clipperz.PM.Components.Import.CSVImport) == 'undefined') { Clipperz.PM.Components.Import.CSVImport = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.CSVImport.CSVImportHeader = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Import.CSVImport.CSVImportHeader.superclass.constructor.call(this, anElement, args);
+	this._mainComponent = args.mainComponent;
+
+	this._pendingDeferredLabelFieldHandlerEvents = 0;
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.CSVImport.CSVImportHeader, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.CSVImport.CSVImportHeader component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'mainComponent': function() {
+		return this._mainComponent;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		var thConfigs;
+		var i,c;
+		
+//MochiKit.Logging.logDebug(">>> CSVImportHeader.render");
+		Clipperz.NotificationCenter.unregister(this);
+		MochiKit.Signal.disconnectAllTo(this);
+
+		thConfigs = [];
+		c = this.mainComponent().parsedValues()[0].length;
+		for (i=0; i<c; i++) {
+			if (this.mainComponent().isColumnSelected(i)) {
+//				thConfigs.push({tag:'th', children:[{tag:'input', type:'text', id:this.getId('headerTextField_' + i), value:this.mainComponent().labelForColumn(i)}]});
+				thConfigs.push({tag:'th', children:[{tag:'input', type:'text', id:this.getId('headerTextField_' + i), value:""}]});
+			}
+		}
+		
+		this.element().update("");
+		this.domHelper().append(this.element(), {tag:'div', children:[
+			{tag:'div', cls:'importStepDescription', htmlString:Clipperz.PM.Strings['CSV_ImportWizard_Header']},
+			{tag:'div', cls:'importStepParameters', children:[
+				{tag:'input', type:'checkbox', name:'isFistRowHeader', id:this.getId('isFirstRowHeader_checkbox')},
+				{tag:'span', id:this.getId('isFirstRowHeader_span'), cls:'clickableSpan', htmlString:Clipperz.PM.Strings['CSV_ImportWizard_Header_Settings_firstRowHeaderLabel']}
+			]},
+			{tag:'div', id:this.getId('dataDiv'), children:[
+				{tag:'div', cls:'csvImportPreview', children:[
+					{tag:'table', id:this.getId('previewDada'), cls:'csvImportPreview header', cellspacing:'0', children:[
+						{tag:'thead', children:[{tag:'tr', children:thConfigs}]},
+						{tag:'tbody', id:this.getId('previewData_tbody')}
+					]}
+				]}
+			]}
+		]});
+
+		for (i=0; i<c; i++) {
+			if (this.mainComponent().isColumnSelected(i)) {
+				this.getElement('headerTextField_' + i).dom.value = this.mainComponent().labelForColumn(i);
+			}
+		}
+		
+		this.renderData(this.getElement('previewData_tbody'), this.mainComponent().parsedValues());
+
+		if (this.mainComponent().isFirstRowHeader()) {
+			this.getDom('isFirstRowHeader_checkbox').click();
+		}
+
+		c = this.mainComponent().parsedValues()[0].length;
+		for (i=0; i<c; i++) {
+			if (this.mainComponent().isColumnSelected(i)) {
+				MochiKit.Signal.connect(this.getDom('headerTextField_' + i), 'onchange',   MochiKit.Base.partial(MochiKit.Base.method(this, 'labelFieldHandler'), i));
+				MochiKit.Signal.connect(this.getDom('headerTextField_' + i), 'onkeypress', MochiKit.Base.partial(MochiKit.Base.method(this, 'deferredLabelFieldHandler'), i));
+			}
+		}
+
+		MochiKit.Signal.connect(this.getDom('isFirstRowHeader_checkbox'), 'onclick', this, 'toggleFirstRowHeaderCheckboxHandler');
+		if (Clipperz_IEisBroken != true) {
+			MochiKit.Signal.connect(this.getDom('isFirstRowHeader_span'), 'onclick', this.getDom('isFirstRowHeader_checkbox'), 'click');
+		}
+//MochiKit.Logging.logDebug("<<< CSVImportHeader.render");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'renderData': function(anElement, someData) {
+		var trConfigs;
+		var data;
+		var i,c;
+		
+//		anElement.update("");
+		MochiKit.DOM.replaceChildNodes(anElement.dom);
+
+		if (this.mainComponent().isFirstRowHeader()) {
+			data = someData.slice(1);
+		} else {
+			data = someData;
+		}
+		
+		trConfigs = MochiKit.Base.map(MochiKit.Base.bind(function(aRowData) {
+			var result;
+			var i,c;
+			
+			result = {tag:'tr', children:[]};
+			c = aRowData.length;
+			for (i=0; i<c; i++) {
+				if (this.mainComponent().isColumnSelected(i)) {
+					result.children.push({tag:'td', valign:'top', html:(MochiKit.Base.isNotEmpty(aRowData[i]) ? aRowData[i].replace(/\n/g, '<br>') : '&nbsp;')});
+				}
+			}
+			
+			return result;
+		}, this), data);
+		
+		MochiKit.Base.map(function(aRowConfig) {Clipperz.YUI.DomHelper.append(anElement, aRowConfig);}, trConfigs);
+
+		Clipperz.Style.applyZebraStylesToTable(this.getId('previewDada'));
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toggleFirstRowHeaderCheckboxHandler': function() {
+		var firstRowData;
+		var i,c;
+
+//MochiKit.Logging.logDebug(">>> toggleFirstRowHeaderCheckboxHandler");
+		this.mainComponent().setIsFirstRowHeader(this.getDom('isFirstRowHeader_checkbox').checked);
+
+		firstRowData = this.mainComponent().parsedValues()[0];
+		
+		c = firstRowData.length;
+		for (i=0; i<c; i++) {
+			if (this.mainComponent().isColumnSelected(i)) {
+				var label;
+				
+				if (this.mainComponent().isFirstRowHeader()) {
+					label = firstRowData[i];
+				} else {
+					label = null;
+				}
+
+				this.mainComponent().setLabelForColumn(label, i);
+			}
+		};
+
+		this.updateInputFieldValues();
+		this.renderData(this.getElement('previewData_tbody'), this.mainComponent().parsedValues());
+//MochiKit.Logging.logDebug("<<< toggleFirstRowHeaderCheckboxHandler");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'updateInputFieldValues': function() {
+		var i,c;
+
+//MochiKit.Logging.logDebug(">>> updateInputFieldValues");
+		c = this.mainComponent().parsedValues()[0].length;
+		for (i=0; i<c; i++) {
+			if (this.mainComponent().isColumnSelected(i)) {
+				this.getDom('headerTextField_' + i).value = this.mainComponent().labelForColumn(i);
+			}
+		}
+//console.log('[1] fieldSettings', fieldSettings);
+//MochiKit.Logging.logDebug("<<< updateInputFieldValues");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'labelFieldHandler': function(aColumnIndex, anEvent) {
+		var inputField;
+		
+//MochiKit.Logging.logDebug(">>> labelFieldHandler");
+		inputField = anEvent.src();
+		
+		this.mainComponent().setLabelForColumn(inputField.value, aColumnIndex);
+//MochiKit.Logging.logDebug("##### [" + anEvent.src().id + "] -> label[" + aColumnIndex + "]: '" + inputField.value + "'");
+//MochiKit.Logging.logDebug("<<< labelFieldHandler");
+	},
+	
+	'deferredLabelFieldHandler': function(aColumnIndex, anEvent) {
+//MochiKit.Logging.logDebug(">>> deferredLabelFieldHandler");
+		this._pendingDeferredLabelFieldHandlerEvents ++;
+		MochiKit.Async.callLater(1, MochiKit.Base.partial(MochiKit.Base.method(this, 'deferredLabelFieldHandlerCatcher'), aColumnIndex, anEvent));
+//MochiKit.Logging.logDebug("<<< deferredLabelFieldHandler");
+	},
+
+	'deferredLabelFieldHandlerCatcher': function(aColumnIndex, anEvent) {
+//MochiKit.Logging.logDebug(">>> deferredLabelFieldHandlerCatcher");
+		this._pendingDeferredLabelFieldHandlerEvents --;
+		if (this._pendingDeferredLabelFieldHandlerEvents == 0) {
+			this.labelFieldHandler(aColumnIndex, anEvent);
+		}
+//MochiKit.Logging.logDebug("<<< deferredLabelFieldHandlerCatcher");
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportNotes.js b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportNotes.js
new file mode 100644
index 0000000..a53c531
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportNotes.js
@@ -0,0 +1,212 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+if (typeof(Clipperz.PM.Components.Import.CSVImport) == 'undefined') { Clipperz.PM.Components.Import.CSVImport = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.CSVImport.CSVImportNotes = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Import.CSVImport.CSVImportNotes.superclass.constructor.call(this, anElement, args);
+	this._mainComponent = args.mainComponent;
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.CSVImport.CSVImportNotes, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.CSVImport.CSVImportNotes component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'mainComponent': function() {
+		return this._mainComponent;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		var	notesSelectorCheckboxCells;
+		var totalNumberOfColumns;
+		var titleColumnIndex;
+		var notesColumnIndex;
+		var i,c;
+
+		Clipperz.NotificationCenter.unregister(this);
+		MochiKit.Signal.disconnectAllTo(this);
+
+		this.element().update("");
+
+		titleColumnIndex = this.mainComponent().titleColumnIndex()
+		notesColumnIndex = this.mainComponent().notesColumnIndex()
+
+		totalNumberOfColumns = this.mainComponent().parsedValues()[0].length;
+		
+		notesSelectorCheckboxCells = [{tag:'th', cls:'title', html:this.mainComponent().labelForColumn(titleColumnIndex)}];
+		c =	totalNumberOfColumns;
+		for (i=0; i<c; i++) {
+			if ((i != titleColumnIndex) && (this.mainComponent().isColumnSelected(i))) {
+				notesSelectorCheckboxCells.push({tag:'th', id:this.getId('th_' + i), valign:'top', children:[
+					{tag:'input', type:'radio', id:this.getId('radio_' + i), name:'CSVImportNotesColumn', value:i},
+					{tag:'span', cls:'clickableSpan', id:this.getId('columnLabel_' + i), html:this.mainComponent().labelForColumn(i)}
+				]})
+			}
+		}
+
+		this.domHelper().append(this.element(), {tag:'div', children:[
+			{tag:'div', cls:'importStepDescription', htmlString:Clipperz.PM.Strings['CSV_ImportWizard_Notes']},
+			{tag:'div', id:this.getId('dataDiv'), children:[
+				{tag:'div', cls:'importStepParameters', children:[
+					{tag:'input', id:this.getId('doNotSetNotes_radio'), type:'radio', name:'CSVImportNotesColumn', value:-1},
+					{tag:'span', id:this.getId('doNotSetNotes_span'), cls:'clickableSpan', htmlString:Clipperz.PM.Strings['CSV_ImportWizard_Notes_Settings_noSelectionLabel']}
+				]},
+				{tag:'div', cls:'csvImportPreview', children:[
+					{tag:'table', id:this.getId('previewDada'), cls:'csvImportPreview', cellspacing:'0', children:[
+						{tag:'thead', id:this.getId('previewData_thead'), children:[
+							{tag:'tr', children:notesSelectorCheckboxCells}
+						]},
+						{tag:'tbody', id:this.getId('previewData_tbody'), children:[]}
+					]}
+				]}
+			]}
+		]});
+		
+		this.renderData(this.getElement('previewData_tbody'), this.mainComponent().parsedValues());
+
+		if ((notesColumnIndex >= totalNumberOfColumns) || (notesColumnIndex == titleColumnIndex) || !(this.mainComponent().isColumnSelected(notesColumnIndex))) {
+			this.mainComponent().setNotesColumnIndex(-1);
+			notesColumnIndex = -1;
+		}
+		
+		c =	totalNumberOfColumns;
+		for (i=0; i<c; i++) {
+			if ((i != titleColumnIndex) && (this.mainComponent().isColumnSelected(i))) {
+				MochiKit.Signal.connect(this.getDom('radio_' + i), 'onclick', this, 'renderDataHandler');
+				if (Clipperz_IEisBroken != true) {
+					MochiKit.Signal.connect(this.getDom('columnLabel_' + i), 'onclick', this.getDom('radio_' + i), 'click');
+				}
+			}
+		}
+
+		MochiKit.Signal.connect(this.getDom('doNotSetNotes_radio'), 'onclick', this, 'renderDataHandler');
+		if (Clipperz_IEisBroken != true) {
+			MochiKit.Signal.connect(this.getDom('doNotSetNotes_span'), 'onclick', this.getDom('doNotSetNotes_radio'), 'click');
+		}
+
+		if (notesColumnIndex == -1) {
+			this.getDom('doNotSetNotes_radio').click();
+		} else {
+			this.getDom('radio_' + notesColumnIndex).click();
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'renderData': function(anElement, someData) {
+		var data;
+		var config;
+		var titleColumnIndex;
+		var notesColumnIndex;
+		var i,c;
+		
+//		anElement.update("");
+		MochiKit.DOM.replaceChildNodes(anElement.dom);
+
+		titleColumnIndex = this.mainComponent().titleColumnIndex();
+		notesColumnIndex = this.mainComponent().notesColumnIndex();
+		
+		if (this.mainComponent().isFirstRowHeader()) {
+			data = someData.slice(1);
+		} else {
+			data = someData;
+		}
+
+		
+//		config = [{tag:'tr', cls:'CSV_previewData_header', children:[{tag:'td', valign:'top', html:header[titleColumnIndex], cls:'title'}]}];
+//		c = header.length;
+//		for (i=0; i<c; i++) {
+//			if (i != titleColumnIndex) {
+//				config[0].children.push({tag:'td', valign:'top', html:header[i], cls:((notesColumnIndex == i) ? 'notesColumn': '')})
+//			}
+//		}
+		
+		config = MochiKit.Base.map(MochiKit.Base.bind(function(aTitleColumnIndex, aRowData) {
+			var result;
+			var i,c;
+			
+			result = {tag:'tr', children:[{tag:'td', valign:'top', cls:'title', html:(MochiKit.Base.isNotEmpty(aRowData[aTitleColumnIndex]) ? aRowData[aTitleColumnIndex].replace(/\n/g, '<br>') : '&nbsp;')}]};
+			c = aRowData.length;
+			for (i=0; i<c; i++) {
+				if ((i != titleColumnIndex) && (this.mainComponent().isColumnSelected(i))) {
+					result.children.push({tag:'td', valign:'top', cls:((notesColumnIndex == i) ? 'notesColumn': ''), html:(MochiKit.Base.isNotEmpty(aRowData[i]) ? aRowData[i].replace(/\n/g, '<br>') : '&nbsp;')});
+				}
+			}
+			
+			return result;
+		}, this, titleColumnIndex), data);
+		
+		MochiKit.Base.map(function(aRowConfig) {Clipperz.YUI.DomHelper.append(anElement, aRowConfig);}, config);
+
+		Clipperz.Style.applyZebraStylesToTable(this.getId('previewDada'));
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderDataHandler': function(anEvent) {
+		var titleColumnIndex;
+		var i,c;
+		
+		this.mainComponent().setNotesColumnIndex(anEvent.src().value);
+		titleColumnIndex = this.mainComponent().titleColumnIndex();
+
+		c = this.mainComponent().parsedValues()[0].length;
+		for (i=0; i<c; i++) {
+			if ((i != titleColumnIndex) && (this.mainComponent().isColumnSelected(i))) {
+				this.getElement('th_' + i).removeClass('notesColumn');
+			}
+		}
+		if (anEvent.src().value != -1) {
+			this.getElement('th_' + anEvent.src().value).addClass('notesColumn');
+		}
+
+		this.renderData(this.getElement('previewData_tbody'), this.mainComponent().parsedValues());
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportTitle.js b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportTitle.js
new file mode 100644
index 0000000..9162867
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImport/CSVImportTitle.js
@@ -0,0 +1,189 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+if (typeof(Clipperz.PM.Components.Import.CSVImport) == 'undefined') { Clipperz.PM.Components.Import.CSVImport = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.CSVImport.CSVImportTitle = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Import.CSVImport.CSVImportTitle.superclass.constructor.call(this, anElement, args);
+	this._mainComponent = args.mainComponent;
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.CSVImport.CSVImportTitle, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.CSVImport.CSVImportTitle component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'mainComponent': function() {
+		return this._mainComponent;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		var	titleSelectorCheckboxCells;
+		var titleColumnIndex;
+		var i,c;
+		
+		Clipperz.NotificationCenter.unregister(this);
+		MochiKit.Signal.disconnectAllTo(this);
+
+		this.element().update("");
+
+		titleColumnIndex = this.mainComponent().titleColumnIndex()
+		titleSelectorCheckboxCells = [];
+		c =	this.mainComponent().parsedValues()[0].length;
+		for (i=0; i<c; i++) {
+			if (this.mainComponent().isColumnSelected(i)) {
+				titleSelectorCheckboxCells.push({tag:'th', valign:'top', id:this.getId('th_' + i), children:[
+					{tag:'input', type:'radio', id:this.getId('radio_' + i), name:'CSVImportTitleColumn', value:i},
+					{tag:'span', cls:'clickableSpan', id:this.getId('columnLabel_' + i), html:this.mainComponent().labelForColumn(i)}
+				]})
+			}
+		}
+		
+		if (titleColumnIndex >= titleSelectorCheckboxCells.length) {
+			this.mainComponent().setTitleColumnIndex(-1);
+		}
+		
+		this.domHelper().append(this.element(), {tag:'div', children:[
+			{tag:'div', cls:'importStepDescription', htmlString:Clipperz.PM.Strings['CSV_ImportWizard_Title']},
+			{tag:'div', id:this.getId('dataDiv'), cls:'csvImportPreview', children:[
+				{tag:'table', id:this.getId('previewDada'), cls:'csvImportPreview', cellspacing:'0', children:[
+					{tag:'thead', id:this.getId('previewData_thead'), children:[
+						{tag:'tr', children:titleSelectorCheckboxCells}
+					]},
+					{tag:'tbody', id:this.getId('previewData_tbody'), children:[]}
+				]}
+			]}
+		]});
+		
+		this.renderData(this.getElement('previewData_tbody'), this.mainComponent().parsedValues());
+
+		c =	this.mainComponent().parsedValues()[0].length;
+		for (i=0; i<c; i++) {
+			if (this.mainComponent().isColumnSelected(i)) {
+				MochiKit.Signal.connect(this.getDom('radio_' + i), 'onclick', this, 'renderDataHandler');
+				if (Clipperz_IEisBroken != true) {
+					MochiKit.Signal.connect(this.getDom('columnLabel_' + i), 'onclick', this.getDom('radio_' + i), 'click');
+				}
+			}
+		}
+		
+		if (titleColumnIndex != -1) {
+			this.getDom('radio_' + titleColumnIndex).click();
+		} else {
+			this.mainComponent().nextButton().disable();
+		}
+		
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'renderData': function(anElement, someData) {
+		var data;
+		var config;
+		var titleColumnIndex;
+		var i,c;
+		
+//		anElement.update("");
+		MochiKit.DOM.replaceChildNodes(anElement.dom);
+
+		titleColumnIndex = this.mainComponent().titleColumnIndex()
+		
+		if (this.mainComponent().isFirstRowHeader()) {
+			data = someData.slice(1);
+		} else {
+			data = someData;
+		}
+
+		config = MochiKit.Base.map(MochiKit.Base.bind(function(aRowData) {
+			var result;
+			var i,c;
+			
+			result = {tag:'tr', children:[]};
+			c = aRowData.length;
+			for (i=0; i<c; i++) {
+				if (this.mainComponent().isColumnSelected(i)) {
+					var field;
+				
+					field = aRowData[i];
+					result.children.push({tag:'td', valign:'top', cls:((titleColumnIndex == i) ? 'titleColumn': ''), html:(MochiKit.Base.isNotEmpty(field) ? field.replace(/\n/g, '<br>') : '&nbsp;')});
+				}
+			}
+			
+			return result;
+		}, this), data);
+		
+		MochiKit.Base.map(function(aRowConfig) {Clipperz.YUI.DomHelper.append(anElement, aRowConfig);}, config);
+
+		Clipperz.Style.applyZebraStylesToTable(this.getId('previewDada'));
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderDataHandler': function(anEvent) {
+		var i,c;
+		
+		this.mainComponent().setTitleColumnIndex(anEvent.src().value);
+
+		c = this.mainComponent().parsedValues()[0].length;
+		for (i=0; i<c; i++) {
+			if (this.mainComponent().isColumnSelected(i)) {
+				this.getElement('th_' + i).removeClass('titleColumn');
+			}
+		}
+		this.getElement('th_' + anEvent.src().value).addClass('titleColumn');
+		
+		if (anEvent.src().value != -1) {
+			this.mainComponent().nextButton().enable();
+		} else {
+			this.mainComponent().nextButton().disable();
+		}
+		
+		this.renderData(this.getElement('previewData_tbody'), this.mainComponent().parsedValues());
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/CSVImportComponent.js b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImportComponent.js
new file mode 100644
index 0000000..707a3d2
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/CSVImportComponent.js
@@ -0,0 +1,548 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.CSVImportComponent = function(anElement, args) {
+	args = args || {};
+
+	this._steps = this._steps || ['CSV_EDIT', 'CSV_COLUMNS', 'CSV_HEADER', 'CSV_TITLE', 'CSV_NOTES', 'CSV_FIELDS', 'PREVIEW', 'IMPORT'];
+
+    Clipperz.PM.Components.Import.CSVImportComponent.superclass.constructor.call(this, anElement, args);
+
+	this._step1Component = null;
+	this._step2Component = null;
+	this._step3Component = null;
+	this._step4Component = null;
+	this._step5Component = null;
+
+	this._isFirstRowHeader = false;
+	this._titleColumnIndex = -1;
+	this._notesColumnIndex = -1;
+	this._fieldSettings = {};
+	this._skippedColumns = new Clipperz.Set();
+
+	this.render();
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.CSVImportComponent, Clipperz.PM.Components.Import.GenericImportComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.CSVImportComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		this.domHelper().append(this.element(), {tag:'div', cls:'csvImportWizard', children:[
+			{tag:'h3', htmlString:Clipperz.PM.Strings['CSV_ImportWizard_Title']},
+			{tag:'div', cls:'importSteps', id:this.getId('importSteps')},
+			{tag:'div', cls:'importStepBlocks', children:[
+				{tag:'div', cls:'step_0', id:this.getId('step_0'), children:[
+					{tag:'div', children:[
+						{tag:'div', cls:'importOptionsDescription', htmlString:Clipperz.PM.Strings['importOptions_csv_description']},
+						{tag:'div', cls:'importOptionsParameters', children:[
+							{tag:'div', cls:'CSVImportOptionsParameters', children:[
+								{tag:'ul', children:[
+									{tag:'li', children:[
+										{tag:'label', 'for':this.getId('CSV_inputOptions_separator'), html:"separator"},
+										{tag:'select', name:this.getId('CSV_inputOptions_separator'), id:this.getId('CSV_inputOptions_separator'), children:[
+											{tag:'option', name:'comma', value:',', html:"comma (,)", selected:true},
+											{tag:'option', name:'tab', value:'\t', html:"tab"}
+										]}
+									]},
+
+									{tag:'li', children:[
+										{tag:'label', 'for':this.getId('CSV_inputOptions_quote'), html:"quote"},
+										{tag:'select', name:this.getId('CSV_inputOptions_quote'), id:this.getId('CSV_inputOptions_quote'), children:[
+											{tag:'option', name:'doubleQuote', value:'\"', html:"double quote (\")", selected:true},
+											{tag:'option', name:'singleQuote', value:'\'', html:"single quote (\')"}
+										]}
+									]},
+
+									{tag:'li', children:[
+										{tag:'label', 'for':this.getId('CSV_inputOptions_escape'), html:"escape"},
+										{tag:'select', name:this.getId('CSV_inputOptions_escape'), id:this.getId('CSV_inputOptions_escape'), children:[
+											{tag:'option', name:'doubleQuote', value:'\"', html:"double quote (\")", selected:true},
+											{tag:'option', name:'slash', value:'\/', html:"slash (\/)"},
+											{tag:'option', name:'backslash', value:'\\', html:"backslash (\\)"}
+										]}
+									]}
+								]}
+							]}
+						]},
+						this.textAreaConfig()
+					]}
+				]},
+				{tag:'div', cls:'step_1', id:this.getId('step_1'), children:[]},
+				{tag:'div', cls:'step_2', id:this.getId('step_2'), children:[]},
+				{tag:'div', cls:'step_3', id:this.getId('step_3'), children:[]},
+				{tag:'div', cls:'step_4', id:this.getId('step_4'), children:[]},
+				{tag:'div', cls:'step_5', id:this.getId('step_5'), children:[]},
+				{tag:'div', cls:'step_6', id:this.getId('step_6'), children:[
+					{tag:'div', children:[
+						{tag:'div', id:this.getId('previewDiv'), html:"preview"}
+					]}
+				]},
+				{tag:'div', cls:'step_7', id:this.getId('step_7'), children:[
+					{tag:'div', children:[
+						{tag:'h4', html:"done"}
+					]}
+				]}
+			]},
+			{tag:'div', cls:'importOptionsButtons', children:[
+				{tag:'table', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('backActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('nextActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'}
+						]}
+					]}
+				]}
+			]}
+		]});
+		
+		this.setBackButton(new YAHOO.ext.Button(this.getDom('backActionButton'), {text:"back", handler:this.backAction, scope:this}));
+		this.setNextButton(new YAHOO.ext.Button(this.getDom('nextActionButton'), {text:"next", handler:this.nextAction, scope:this}));
+
+		this.updateSteps();
+		
+		this.getElement('step_0').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show()
+		this.getElement('step_1').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_2').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_3').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_4').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_5').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_6').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_7').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		
+//		this.backButton().disable();
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'nextAction': function() {
+		switch (this.currentStep()) {
+			case 0:	//	-> 1
+				Clipperz.PM.Components.MessageBox.showProgressPanel(
+					MochiKit.Base.method(this, 'deferredParseValues'),
+					MochiKit.Base.method(this, 'handleParseError'),
+					this.getDom('nextActionButton')
+				);
+				break;
+			case 1:	//	-> 2
+				this.getElement('step_1').hide();
+				this.step2Component().render();
+				this.setCurrentStep(2);
+				this.getElement('step_2').show();
+				break;
+			case 2:	//	-> 3
+				this.getElement('step_2').hide();
+				this.step3Component().render();
+				this.setCurrentStep(3);
+				this.getElement('step_3').show();
+				break;
+			case 3:	//	-> 4
+				this.getElement('step_3').hide();
+				this.step4Component().render();
+				this.setCurrentStep(4);
+				this.getElement('step_4').show();
+				break;
+			case 4:	//	-> 5
+				this.getElement('step_4').hide();
+				this.step5Component().render();
+				this.setCurrentStep(5);
+				this.getElement('step_5').show();
+				break;
+			case 5:	//	-> 6
+				this.previewValues();
+				break;
+			case 6:	//	-> 7
+				this.importValues();
+				break;
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'deferredParseValues': function() {
+		var deferredResult;
+
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("CSVImportComponent.deferredParseValues - 1 " + res.substring(0,50)); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'parseImportData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("CSVImportComponent.deferredParseValues - 2 " + res.substring(0,50)); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.startProcessing();
+			
+			return res;
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("CSVImportComponent.deferredParseValues - 3 " + res.substring(0,50)); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'parseCSVValues'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("CSVImportComponent.deferredParseValues - 4 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setParsedValues'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("CSVImportComponent.deferredParseValues - 5 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.step1Component(), 'render'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("CSVImportComponent.deferredParseValues - 6 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.processingDone();
+			this.getElement('step_0').hide();
+			this.getElement('step_1').show();
+			this.backButton().enable();
+			
+			return res;
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("CSVImportComponent.deferredParseValues - 7 " + res); return res;});
+		deferredResult.callback(this.textAreaContent());		
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'deferredPreviewValues': function() {
+		var deferredResult;
+
+//MochiKit.Logging.logDebug(">>> CSVImportComponent.deferredPreviewValues");
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 1 " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'previewImportData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 2 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.startProcessing();
+			
+			return res;
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 3 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'processCSVParsedValues'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 4 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setProcessedValues'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 5 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'previewRecordValues'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 6 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.processingDone();
+			this.getElement('step_5').hide();
+			this.getElement('step_6').show();
+			this.backButton().enable();
+			
+			return res;
+		}, this));
+		deferredResult.callback(this.parsedValues());		
+//MochiKit.Logging.logDebug("<<< CSVImportComponent.deferredPreviewValues");
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'csvProcessor': function() {
+		return new Clipperz.CSVProcessor({
+			quoteChar:		this.getDom('CSV_inputOptions_quote').value,
+			escapeChar:		this.getDom('CSV_inputOptions_escape').value,
+			separatorChar:	this.getDom('CSV_inputOptions_separator').value,
+			binary:true
+		});
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'parseCSVValues': function(someData) {
+		var deferredResult;
+		var csvProcessor;
+
+		csvProcessor = this.csvProcessor();		
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.parseKeePassValues - 1 " + res.substring(0,50)); return res;});
+		deferredResult.addCallback(function(res) {
+			return Clipperz.NotificationCenter.deferredNotification(this, 'updatedProgressState', {steps:(res.length)}, res);
+		})
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.parseKeePassValues - 2 " + res.substring(0,50)); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(csvProcessor, 'deferredParse'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.parseKeePassValues - 3 " + res); return res;});
+		deferredResult.callback(someData);
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'processCSVParsedValues': function (someValues) {
+		var deferredResult;
+		var records;
+		var titleColumnIndex;
+		var notesColumnIndex;
+		var i,c;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+		records = [];
+
+		titleColumnIndex = this.titleColumnIndex();
+		notesColumnIndex = this.notesColumnIndex();
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', {steps:(someValues.length)});
+		
+		c = someValues.length;
+		if (this.isFirstRowHeader()) {
+			i = 1;
+		} else {
+			i = 0;
+		}
+		
+		for(  ; i<c; i++) {
+			deferredResult.addCallback(MochiKit.Async.wait, 0.2);
+			deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', {});
+			deferredResult.addCallback(MochiKit.Base.bind(function(someRecords, someData) {
+				var record;
+				var recordVersion;
+				var ii;
+
+				record = new Clipperz.PM.DataModel.Record({user:this.user()});
+				record.setLabel(someData[titleColumnIndex]);
+				if (notesColumnIndex != -1) {
+					record.setNotes(someData[notesColumnIndex]);
+				}
+				recordVersion = record.currentVersion()
+
+				for (ii in someData) {
+//					if ((ii != titleColumnIndex) && (ii != notesColumnIndex) && (typeof(this.fieldSettings()[ii]) != 'undefined')) {
+					if ((ii != titleColumnIndex) && (ii != notesColumnIndex) && (this.isColumnSelected(ii))) {
+						var recordField;
+
+						recordField = new Clipperz.PM.DataModel.RecordField({
+							recordVersion:	recordVersion,
+							label:			this.labelForColumn(ii),
+							value:			someData[ii],
+							type:			this.typeForColumn(ii)
+						});
+						recordVersion.addField(recordField);
+					}
+				}
+			
+				someRecords.push(record);
+			
+				return someRecords;
+			}, this), records, someValues[i]);
+		}
+		deferredResult.addCallback(MochiKit.Async.succeed, records);
+		deferredResult.callback();
+		
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'step1Component': function() {
+		if (this._step1Component == null) {
+			this._step1Component = new Clipperz.PM.Components.Import.CSVImport.CSVImportColumns(this.getElement('step_1'), {mainComponent:this});
+		}
+		
+		return this._step1Component;
+	},
+
+	'step2Component': function() {
+		if (this._step2Component == null) {
+			this._step2Component = new Clipperz.PM.Components.Import.CSVImport.CSVImportHeader(this.getElement('step_2'), {mainComponent:this});
+		}
+		
+		return this._step2Component;
+	},
+
+	'step3Component': function() {
+		if (this._step3Component == null) {
+			this._step3Component = new Clipperz.PM.Components.Import.CSVImport.CSVImportTitle(this.getElement('step_3'), {mainComponent:this});
+		}
+		
+		return this._step3Component;
+	},
+
+	'step4Component': function() {
+		if (this._step4Component == null) {
+			this._step4Component = new Clipperz.PM.Components.Import.CSVImport.CSVImportNotes(this.getElement('step_4'), {mainComponent:this});
+		}
+		
+		return this._step4Component;
+	},
+
+	'step5Component': function() {
+		if (this._step5Component == null) {
+			this._step5Component = new Clipperz.PM.Components.Import.CSVImport.CSVImportFields(this.getElement('step_5'), {mainComponent:this});
+		}
+		
+		return this._step5Component;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isFirstRowHeader': function() {
+		return this._isFirstRowHeader;
+	},
+	
+	'setIsFirstRowHeader': function(aValue) {
+		this._isFirstRowHeader = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'titleColumnIndex': function() {
+		return this._titleColumnIndex;
+	},
+	
+	'setTitleColumnIndex': function(aValue) {
+		this._titleColumnIndex = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'notesColumnIndex': function() {
+		return this._notesColumnIndex;
+	},
+	
+	'setNotesColumnIndex': function(aValue) {
+		this._notesColumnIndex = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'fieldSettings': function() {
+		return this._fieldSettings;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'skippedColumns': function() {
+		return this._skippedColumns;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'isColumnSelected': function(aColumnIndex) {
+		return !this.skippedColumns().contains("" + aColumnIndex);
+	},
+
+	//=========================================================================
+	
+	'labelForColumn': function(aColumnIndex) {
+		var result;
+		
+		if ((typeof(this.fieldSettings()) != 'undefined') && (typeof(this.fieldSettings()[aColumnIndex]) != 'undefined')) {
+			if (this.isFirstRowHeader()) {
+				result = this.fieldSettings()[aColumnIndex]['_firstRowLabel'];
+//MochiKit.Logging.logDebug("--- updateInputFieldValues - [" + aColumnIndex + "] _firstRowLabel: " + label);
+			} else {
+				result = this.fieldSettings()[aColumnIndex]['_emptyLabel'];
+//MochiKit.Logging.logDebug("--- updateInputFieldValues - [" + aColumnIndex + "] _emptyLabel: " + label);
+			}
+		} else {
+			result = "";
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'setLabelForColumn': function(aLabel, aColumnIndex) {
+		var fieldSettings;
+
+//MochiKit.Logging.logDebug(">>> setLabelForColumn[" + aColumnIndex + "]: " + aLabel);
+		fieldSettings = this.fieldSettings();
+
+		if (typeof(fieldSettings[aColumnIndex]) == 'undefined') {
+			fieldSettings[aColumnIndex] = {}
+		}
+	
+		if (this.isFirstRowHeader()) {
+//MochiKit.Logging.logDebug("--- setLabelForColumn -> _firstRowLabel");
+			fieldSettings[aColumnIndex]['_firstRowLabel'] = aLabel;
+		} else {
+			if (typeof(fieldSettings[aColumnIndex]['_emptyLabel']) == 'undefined') {
+				if (aLabel == null) {
+//MochiKit.Logging.logDebug("--- setLabelForColumn -> _emptyLabel = \"\"");
+					fieldSettings[aColumnIndex]['_emptyLabel'] = "";
+				} else {
+					fieldSettings[aColumnIndex]['_emptyLabel'] = aLabel;
+				}
+			} else {
+//MochiKit.Logging.logDebug("--- setLabelForColumn -> _emptyLabel = " + aLabel);
+				if (aLabel != null) {
+					fieldSettings[aColumnIndex]['_emptyLabel'] = aLabel;
+				}
+			}
+		}
+//MochiKit.Logging.logDebug("<<< setLabelForColumn[" + aColumnIndex + "]: " + aLabel);
+	},
+	
+	//=========================================================================
+	
+	'typeForColumn': function(aColumnIndex) {
+		var result;
+		
+		if ((typeof(this.fieldSettings()) != 'undefined') && (typeof(this.fieldSettings()[aColumnIndex]) != 'undefined') && (typeof(this.fieldSettings()[aColumnIndex]['type']) != 'undefined')) {
+			result = this.fieldSettings()[aColumnIndex]['type'];
+		} else {
+			result = 'UNDEFINED';
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'setTypeForColumn': function(aType, aColumnIndex) {
+		var fieldSettings;
+
+		fieldSettings = this.fieldSettings();
+
+		if (typeof(fieldSettings[aColumnIndex]) == 'undefined') {
+			fieldSettings[aColumnIndex] = {}
+		}
+	
+		fieldSettings[aColumnIndex]['type'] = aType;
+	},
+	
+	//=========================================================================
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/ClipperzImportComponent.js b/frontend/beta/js/Clipperz/PM/Components/Import/ClipperzImportComponent.js
new file mode 100644
index 0000000..50dcb93
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/ClipperzImportComponent.js
@@ -0,0 +1,212 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.ClipperzImportComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Import.ClipperzImportComponent.superclass.constructor.call(this, anElement, args);
+
+	this.render();
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.ClipperzImportComponent, Clipperz.PM.Components.Import.GenericImportComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.ClipperzImportComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> Import.ClipperzImportComponent.render");
+		this.domHelper().append(this.element(), {tag:'div', cls:'clipperzImportWizard', children:[
+			{tag:'h3', htmlString:Clipperz.PM.Strings['Clipperz_ImportWizard_Title']},
+			{tag:'div', cls:'importSteps', id:this.getId('importSteps')},
+			{tag:'div', cls:'importStepBlocks', children:[
+				{tag:'div', cls:'step_0', id:this.getId('step_0'), children:[
+					{tag:'div', children:[
+						{tag:'div', cls:'importOptionsDescription', htmlString:Clipperz.PM.Strings['importOptions_clipperz_description']},
+						{tag:'div', cls:'importOptionsParameters', children:[]},
+						this.textAreaConfig()
+					]}
+				]},
+				{tag:'div', cls:'step_1', id:this.getId('step_1'), children:[
+					{tag:'div', children:[
+						{tag:'div', id:this.getId('previewDiv'), html:"preview"}
+					]}
+				]},
+				{tag:'div', cls:'step_2', id:this.getId('step_2'), children:[
+					{tag:'div', children:[
+						{tag:'h4', html:"done"}
+					]}
+				]}
+			]},
+			{tag:'div', cls:'importOptionsButtons', children:[
+				{tag:'table', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('backActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('nextActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'}
+						]}
+					]}
+				]}
+			]}
+		]});
+		
+		this.updateSteps();
+		
+		this.setBackButton(new YAHOO.ext.Button(this.getDom('backActionButton'), {text:"back", handler:this.backAction, scope:this}));
+		this.setNextButton(new YAHOO.ext.Button(this.getDom('nextActionButton'), {text:"next", handler:this.nextAction, scope:this}));
+		
+		this.getElement('step_0').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show()
+		this.getElement('step_1').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_2').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+//MochiKit.Logging.logDebug("<<< Import.ClipperzImportComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'nextAction': function() {
+		switch (this.currentStep()) {
+			case 0:	//	-> 1
+				this.previewValues();
+				break;
+			case 1:	//	-> 2
+				this.importValues();
+				break;
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'deferredPreviewValues': function() {
+		var deferredResult;
+
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.startProcessing();
+			
+			return res;
+		}, this));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'processClipperzValues'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setProcessedValues'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'previewRecordValues'));
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.processingDone();
+			this.getElement('step_0').hide();
+			this.getElement('step_1').show();
+			this.backButton().enable();
+			
+			return res;
+		}, this));
+//		deferredResult.addErrback(MochiKit.Base.bind(function() {
+//			this.processingAborted();
+//		}, this))
+		deferredResult.callback(this.textAreaContent());		
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'processClipperzValues': function(someData) {
+		var deferredResult;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.processClipperzValues - 1: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'parseImportData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.processClipperzValues - 2: " + res); return res;});
+		deferredResult.addCallback(Clipperz.Base.evalJSON);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.processClipperzValues - 3: " + res); return res;});
+		deferredResult.addCallback(function(res) {
+			return Clipperz.NotificationCenter.deferredNotification(this, 'updatedProgressState', {steps:(res.length)}, res);
+		})
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.processClipperzValues - 4: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'previewImportData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.processClipperzValues - 5: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(someClipperzValues) {
+			var innerDeferredResult;
+			var records;
+			var i,c;
+			
+			innerDeferredResult = new MochiKit.Async.Deferred();
+			records = [];
+			
+			c = someClipperzValues.length;
+			for(i=0; i<c; i++) {
+				innerDeferredResult.addCallback(MochiKit.Async.wait, 0.2);
+				innerDeferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', {});
+				innerDeferredResult.addCallback(MochiKit.Base.bind(function(someRecords, someData) {
+					var record;
+					var recordVersion;
+
+//MochiKit.Logging.logDebug("=== someData: " + Clipperz.Base.serializeJSON(someData));
+					record = new Clipperz.PM.DataModel.Record({user:this.user()});
+					record.setLabel(someData['label']);
+					record.setShouldProcessData(true);
+					record.processData(someData);
+
+					someRecords.push(record);
+
+					return someRecords;
+				}, this), records, someClipperzValues[i]);
+			}
+			innerDeferredResult.addCallback(MochiKit.Async.succeed, records);
+			innerDeferredResult.callback();
+			
+			return innerDeferredResult;
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.processClipperzValues - 6: " + res); return res;});
+		deferredResult.callback(someData);
+
+		return deferredResult;
+	},
+
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/ExcelImportComponent.js b/frontend/beta/js/Clipperz/PM/Components/Import/ExcelImportComponent.js
new file mode 100644
index 0000000..ecdf509
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/ExcelImportComponent.js
@@ -0,0 +1,134 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.ExcelImportComponent = function(anElement, args) {
+	args = args || {};
+
+	this._steps = ['EXCEL_EDIT', 'CSV_COLUMNS', 'CSV_HEADER', 'CSV_TITLE', 'CSV_NOTES', 'CSV_FIELDS', 'PREVIEW', 'IMPORT'];
+
+    Clipperz.PM.Components.Import.ExcelImportComponent.superclass.constructor.call(this, anElement, args);
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.ExcelImportComponent, Clipperz.PM.Components.Import.CSVImportComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.ExcelImportComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> Import.ExcelImportComponent.render");
+		this.domHelper().append(this.element(), {tag:'div', cls:'excelImportWizard', children:[
+			{tag:'h3', htmlString:Clipperz.PM.Strings['Excel_ImportWizard_Title']},
+			{tag:'div', cls:'importSteps', id:this.getId('importSteps')},
+			{tag:'div', cls:'importStepBlocks', children:[
+				{tag:'div', cls:'step_0', id:this.getId('step_0'), children:[
+					{tag:'div', children:[
+						{tag:'div', cls:'importOptionsDescription', htmlString:Clipperz.PM.Strings['importOptions_excel_description']},
+						{tag:'div', cls:'importOptionsParameters', children:[]},
+						this.textAreaConfig()
+					]}
+				]},
+				{tag:'div', cls:'step_1', id:this.getId('step_1'), children:[]},
+				{tag:'div', cls:'step_2', id:this.getId('step_2'), children:[]},
+				{tag:'div', cls:'step_3', id:this.getId('step_3'), children:[]},
+				{tag:'div', cls:'step_4', id:this.getId('step_4'), children:[]},
+				{tag:'div', cls:'step_5', id:this.getId('step_5'), children:[]},
+				{tag:'div', cls:'step_6', id:this.getId('step_6'), children:[
+					{tag:'div', children:[
+						{tag:'div', id:this.getId('previewDiv'), html:"preview"}
+					]}
+				]},
+				{tag:'div', cls:'step_7', id:this.getId('step_7'), children:[
+					{tag:'div', children:[
+						{tag:'h4', html:"done"}
+					]}
+				]}
+			]},
+			{tag:'div', cls:'importOptionsButtons', children:[
+				{tag:'table', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('backActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('nextActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'}
+						]}
+					]}
+				]}
+			]}
+		]});
+		
+		this.updateSteps();
+		
+		this.setBackButton(new YAHOO.ext.Button(this.getDom('backActionButton'), {text:"back", handler:this.backAction, scope:this}));
+		this.setNextButton(new YAHOO.ext.Button(this.getDom('nextActionButton'), {text:"next", handler:this.nextAction, scope:this}));
+		
+		this.getElement('step_0').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show()
+		this.getElement('step_1').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_2').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_3').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_4').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_5').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_6').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_7').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+//MochiKit.Logging.logDebug("<<< Import.ExcelImportComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'csvProcessor': function() {
+		return new Clipperz.CSVProcessor({
+//			quoteChar:		this.getDom('CSV_inputOptions_quote').value,
+//			escapeChar:		this.getDom('CSV_inputOptions_escape').value,
+			separatorChar:	'\t',
+			binary:true
+		});
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/GenericImportComponent.js b/frontend/beta/js/Clipperz/PM/Components/Import/GenericImportComponent.js
new file mode 100644
index 0000000..4f6b1e4
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/GenericImportComponent.js
@@ -0,0 +1,523 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.GenericImportComponent = function(anElement, args) {
+	args = args || {};
+
+	this._steps = this._steps || ['EDIT', 'PREVIEW', 'IMPORT'];
+
+    Clipperz.PM.Components.Import.GenericImportComponent.superclass.constructor.call(this, anElement, args);
+
+	this._user = args['user'];
+	
+	this._currentStep = 0;
+	this._currentStatus = 'IDLE'; //	'PROCESSING'
+
+	this._parsedValues = null;
+	this._processedValues = null;
+
+	this._backButton = null;
+	this._nextButton = null;
+
+	Clipperz.NotificationCenter.register(null, 'importProcessorProgressUpdate', this, 'updateProgressDialogStatus');
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.GenericImportComponent, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.GenericImportComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'textAreaConfig': function() {
+		return {tag:'textarea', name:this.getId('importTextArea'), cls:'importTextArea', id:this.getId('importTextArea'), cols:60, rows:15, html:""};
+	},
+
+	'textAreaContent': function() {
+		return this.getDom('importTextArea').value
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'steps': function() {
+		return this._steps;
+	},
+	
+	'currentStep': function() {
+		return this._currentStep;
+	},
+	
+	'setCurrentStep': function(aValue) {
+		this._currentStep = aValue;
+		this.updateSteps();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'currentStatus': function() {
+		return this._currentStatus;
+	},
+
+	'startProcessing': function() {
+		this._currentStatus = 'PROCESSING';
+		this.updateSteps();
+	},
+	
+	'processingDone': function() {
+		this._currentStatus = 'IDLE';
+		this.setCurrentStep(this.currentStep() + 1);
+	},
+	
+	'processingAborted': function() {
+		this._currentStatus = 'IDLE';
+		this.updateSteps();
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'stepsConfig': function() {
+		var result;
+		var i,c;
+		
+		result = [];
+		c = this.steps().length;
+		for (i=0; i<c; i++) {
+			var cls;
+			
+			if (this.currentStep() == i) {
+				if (this.currentStatus() == 'IDLE') {
+					cls = 'current';
+				} else {
+					cls = 'currentProcessing';
+				}
+			} else {
+				cls = "";
+			}
+			
+			result.push({tag:'td', cls:cls, children:[
+				{tag:'div', children:[{tag:'span', htmlString:Clipperz.PM.Strings['ImportWizard'][this.steps()[i]]}]}
+			]})
+			if (i < (c-1)) {
+				if ((this.currentStep() == i) && (this.currentStatus() == 'PROCESSING')) {
+					cls = 'stepSeparatorProcessing';
+				} else {
+					cls = 'stepSeparator';
+				}
+				
+				result.push({tag:'td', cls:cls, children:[
+					{tag:'div', children:[{tag:'span', html:">"}]}
+				]});
+			}
+		}
+		
+		result = [{tag:'div', cls:'importWizardStepsBox', children:[
+			{tag:'div', cls:'importWizardStepsInnerBox', children:[
+				{tag:'table', cls:'importWizardSteps', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:result}
+					]}
+				]}
+			]},
+			{tag:'div', cls:'importWizardStepsBoxFooter'}
+		]}];
+		
+		return result;
+	},
+	
+	'updateSteps': function() {
+		this.getElement('importSteps').update("");
+		Clipperz.YUI.DomHelper.append(this.getDom('importSteps'), {tag:'div', children:this.stepsConfig()});
+	},
+
+	//-------------------------------------------------------------------------
+
+	'backAction': function() {
+//MochiKit.Logging.logDebug(">>> backAction");
+		if (this.currentStep() == 0) {
+			Clipperz.NotificationCenter.notify(this, 'importCancelled');
+		} else {
+			this.getElement('step_' + this.currentStep()).hide();
+			this.setCurrentStep(this.currentStep() - 1);
+			this.getElement('step_' + this.currentStep()).show();
+		
+			this.nextButton().enable();
+		}
+//MochiKit.Logging.logDebug("<<< backAction");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'backButton': function() {
+		return this._backButton;
+	},
+
+	'setBackButton': function(aValue) {
+		this._backButton = aValue;
+	},
+	
+	'nextButton': function() {
+		return this._nextButton;
+	},
+	
+	'setNextButton': function(aValue) {
+		this._nextButton = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> Import.GenericImportComponent.render");
+		this.domHelper().append(this.element(), {tag:'div', children:[
+			{tag:'h2', html:this.toString()}
+		]});
+//MochiKit.Logging.logDebug("<<< Import.GenericImportComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'previewValues': function() {
+		Clipperz.PM.Components.MessageBox.showProgressPanel(
+			MochiKit.Base.method(this, 'deferredPreviewValues'),
+			MochiKit.Base.method(this, 'handlePreviewError'),
+			this.getDom('nextActionButton')
+		);
+	},
+
+	'deferredPreviewValues': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+	
+	'handlePreviewError': function(anError) {
+console.log("anError", anError);
+		MochiKit.Logging.logError("An error occurred while previewing the data: " + anError);
+		alert("An error occurred while previewing the data");
+		Clipperz.PM.Components.MessageBox().hide();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'previewRecordValues': function(someProcessedRecords) {
+//MochiKit.Logging.logDebug(">>> previewRecordValues");
+		this.getElement('previewDiv').update("");
+//MochiKit.Logging.logDebug("--- previewRecordValues - 1");
+		this.domHelper().append(this.getElement('previewDiv'), {tag:'div', cls:'importPreviewDiv', children:[{tag:'table', id:'importPreview', cellspacing:'0', children:[
+			{tag:'tbody', children:
+				MochiKit.Base.map(MochiKit.Base.bind(function(aRecord) {
+					var result;
+//MochiKit.Logging.logDebug("--- previewRecordValues - 1.1");
+//console.log("fields", aRecord.currentVersion().fields());
+					result = {tag:'tr', children:[{tag:'td', children:[
+						{tag:'table', cls:'importPreview_record', children:[
+							{tag:'tbody', children:[
+								{tag:'tr', children:[
+									{tag:'td', rowspan:'2', valign:'top', children:[
+										{tag:'input', type:'checkbox', id:this.getId(aRecord.reference()), value:"aRecord.reference()", checked:true}
+									]},
+									{tag:'td', colspan:'2', children:[
+										{tag:'span', cls:'importPreview_title', html:aRecord.label()}
+									]}
+								]},
+								{tag:'tr', children:[
+									{tag:'td', valign:'top', children:[
+										{tag:'span', cls:'importPreview_notes', html:(MochiKit.Base.isNotEmpty(aRecord.notes()) ? aRecord.notes().replace(/\n/g, '<br>') : '&nbsp;')}
+									]},
+									{tag:'td', valign:'top', cls:'importPreview_fieds', children:[
+										{tag:'table', cls:'importPreview_fields', children:[
+											{tag:'tbody', children:MochiKit.Base.map(function(aField) {
+												var result;
+//MochiKit.Logging.logDebug("--- previewRecordValues - 1.1.1");
+												result = {tag:'tr', children:[
+													{tag:'td', valign:'top', children:[
+														{tag:'span', cls:'importPreview_fields_label', html:aField.label()}
+													]},
+													{tag:'td', valign:'top', children:[
+														{tag:'span', cls:'importPreview_fields_value', html:aField.value()}
+													]}
+												]};
+//MochiKit.Logging.logDebug("--- previewRecordValues - 1.1.2");
+												return result;
+											}, MochiKit.Base.values(aRecord.currentVersion().fields()))}
+										]}
+									]}
+								]}
+							]}
+						]}
+					]}]};
+//MochiKit.Logging.logDebug("--- previewRecordValues - 1.2");
+					return result;
+				}, this), someProcessedRecords)
+			}
+		]}]});
+//MochiKit.Logging.logDebug("--- previewRecordValues - 2");
+
+		MochiKit.Base.map(MochiKit.Base.bind(function(aRecord) {
+			this.getElement(aRecord.reference()).dom.value = aRecord.reference();
+		}, this), someProcessedRecords);
+		
+		Clipperz.Style.applyZebraStylesToTable('importPreview');
+//MochiKit.Logging.logDebug("<<< previewRecordValues");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'updateProgressDialogStatus': function(anEvent) {
+		Clipperz.PM.Components.MessageBox().update({step:anEvent.parameters().progress});
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'parsedValues': function() {
+		return this._parsedValues;
+	},
+	
+	'setParsedValues': function(aValue) {
+		this._parsedValues = aValue;
+
+		return this._parsedValues;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'processedValues': function() {
+		return this._processedValues;
+	},
+
+	'setProcessedValues': function(aValue) {
+		this._processedValues = aValue;
+		return this._processedValues;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'importValues': function() {
+		var deferredResult;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+		
+		deferredResult.addCallback(MochiKit.Base.bind(function() {
+			this.nextButton().disable();
+			this.startProcessing();
+		},this));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'importProcessedValues'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'processingDone'));
+		deferredResult.addErrback (MochiKit.Base.method(this, 'processingAborted'));
+		deferredResult.callback();
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'importProcessedValues': function() {
+		var deferredResult;
+		var processedValues;
+		var selectedRecords;
+		var i,c;
+
+//MochiKit.Logging.logDebug(">>> GenericImportComponent.importProcessedValues");
+		processedValues = this.processedValues();
+		selectedRecords = [];
+		
+		c = processedValues.length;
+		for (i=0; i<c; i++) {
+			var currentRecord;
+			
+			currentRecord = processedValues[i];
+			if (this.getDom(currentRecord.reference()).checked == true) {
+				selectedRecords.push(currentRecord);
+			}
+		}
+
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("GenericImportComponent - 1: " + res); return res;});
+		deferredResult.addCallback(function(someRecords) {
+			var innerDeferredResult;
+			var text;
+			
+			text = Clipperz.PM.Strings['importData_importConfirmation_text'];
+			text = text.replace(/__numberOfRecords__/, someRecords.length);
+			
+			innerDeferredResult = new MochiKit.Async.Deferred();
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("GenericImportComponent - 1.1: " + res); return res;});
+			innerDeferredResult.addCallback(MochiKit.Async.succeed, someRecords);
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("GenericImportComponent - 1.2: " + res); return res;});
+
+			Clipperz.PM.Components.MessageBox().deferredShow({
+				title:Clipperz.PM.Strings['importData_importConfirmation_title'],
+				text:text,
+				width:240,
+				showProgressBar:false,
+				showCloseButton:false,
+				buttons:{
+					'yes':"yes",			//	Clipperz.PM.Strings['mainPanelDeleteRecordPanelConfirmButtonLabel'],
+					'no':"no"				//	Clipperz.PM.Strings['mainPanelDeleteRecordPanelDenyButtonLabel']
+				},
+				fn:MochiKit.Base.partial(function(aDeferred, aResult) {
+					if (aResult == 'yes') {
+						aDeferred.callback(aResult);
+					} else {
+						aDeferred.errback(aResult);
+					}
+				}, innerDeferredResult)
+			}/*, this.getId('nextActionButton')*/);
+			
+			return innerDeferredResult;
+		});
+
+//-------------------
+//		deferredResult.addCallback(MochiKit.Base.bind(function(someRecords) {
+//			Clipperz.PM.Components.MessageBox.showProgressPanel(
+//				MochiKit.Base.method(this, 'importProcessedValues_core', someRecords),
+//				MochiKit.Base.method(this, 'handleProcessError'),
+//				this.getDom('mainDiv')
+//			);
+//		}, this));
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("GenericImportComponent - 2: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'deferredShow'),
+			{
+//				title:Clipperz.PM.Strings['accountPanelDeletingAccountPanelProgressTitle'],
+//				text:Clipperz.PM.Strings['accountPanelDeletingAccountPanelProgressText'],
+				width:240,
+				showProgressBar:true,
+				showCloseButton:false
+			}
+		);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("GenericImportComponent - 3: " + res); return res;});
+		
+		deferredResult.addCallback(MochiKit.Base.bind(function(someRecords) {
+			var innerDeferredResult;
+
+//MochiKit.Logging.logDebug(">>> inner deferred");
+			innerDeferredResult = new MochiKit.Async.Deferred();
+			
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("GenericImportComponent - 3.1: " + res); return res;});
+			innerDeferredResult.addCallback(MochiKit.Base.method(this, 'importProcessedValues_core', someRecords));
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("GenericImportComponent - 3.2: " + res); return res;});
+			innerDeferredResult.addErrback(MochiKit.Base.method(this, 'handleProcessError'));
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("GenericImportComponent - 3.3: " + res); return res;});
+			innerDeferredResult.callback(someRecords);
+//MochiKit.Logging.logDebug("<<< inner deferred");
+			
+			return innerDeferredResult;
+		}, this), selectedRecords);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("GenericImportComponent - 4: " + res); return res;});
+
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'hide'), 'mainDiv');
+		
+		deferredResult.addErrback(MochiKit.Base.bind(function() {
+			this.nextButton().enable();
+			this.setCurrentStep(this.currentStep() -1);
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("GenericImportComponent - 5: " + res); return res;});
+
+		deferredResult.callback(selectedRecords);
+//MochiKit.Logging.logDebug("<<< GenericImportComponent.importProcessedValues");
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'importProcessedValues_core': function(someRecords) {
+		var deferredResult;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'processingImportData');
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', {steps:(someRecords.length + 6 + 1)});
+		deferredResult.addCallback(MochiKit.Async.wait, 0.5);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("importProcessedValues_core - 3: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(someRecords) {
+			var i,c;
+			
+			c = someRecords.length;
+			for (i=0; i<c; i++) {
+				this.user().addRecord(someRecords[i], true);
+			}
+			
+			return someRecords;
+		}, this));
+		deferredResult.addCallback(MochiKit.Async.wait, 0.5);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("importProcessedValues_core - 4: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'recordAdded', null);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("importProcessedValues_core - 5: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.user(), 'saveRecords'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("importProcessedValues_core - 6: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'selectTab', 'mainTabPanel.recordsTab');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("importProcessedValues_core - 7: " + res); return res;});
+		
+		if (this.user().preferences().shouldShowDonationPanel()) {
+			deferredResult.addCallback(Clipperz.PM.showDonationSplashScreen, this.user(), 'mainDiv');
+		}
+		
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'importCompleted', null);
+
+		deferredResult.callback(someRecords);
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'handleParseError': function(res) {
+		this.processingAborted();
+		MochiKit.Logging.logError("An error occurred while parsing the values: " + res);
+		alert("An error occurred while parsing the values: " + res);
+		Clipperz.PM.Components.MessageBox().hide();
+	},
+
+	'handleProcessError': function(res) {
+		this.processingAborted();
+		MochiKit.Logging.logError("An error occurred while processing the values: " + res);
+		alert("An error occurred while processing the values: " + res);
+		Clipperz.PM.Components.MessageBox().hide();
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/KeePassImportComponent.js b/frontend/beta/js/Clipperz/PM/Components/Import/KeePassImportComponent.js
new file mode 100644
index 0000000..0657520
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/KeePassImportComponent.js
@@ -0,0 +1,450 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.KeePassImportComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Import.KeePassImportComponent.superclass.constructor.call(this, anElement, args);
+
+	this._steps = ['EDIT', 'KEEPASS_SETTINGS', 'PREVIEW', 'IMPORT'];
+	this._definedFields = ['Group', 'Group Tree', 'UserName', 'URL', 'Password', 'Notes', 'UUID', 'Icon', 'Creation Time', 'Last Access', 'Last Modification', 'Expires', 'Attachment Description', 'Attachment'];
+
+	this.render();
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.KeePassImportComponent, Clipperz.PM.Components.Import.GenericImportComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.KeePassImportComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> Import.KeePassImportComponent.render");
+		this.domHelper().append(this.element(), {tag:'div', cls:'keePassImportWizard', children:[
+			{tag:'h3', htmlString:Clipperz.PM.Strings['KeePass_ImportWizard_Title']},
+			{tag:'div', cls:'importSteps', id:this.getId('importSteps')},
+			{tag:'div', cls:'importStepBlocks', children:[
+				{tag:'div', cls:'step_0', id:this.getId('step_0'), children:[
+					{tag:'div', children:[
+						{tag:'div', cls:'importOptionsDescription', htmlString:Clipperz.PM.Strings['importOptions_keePass_description']},
+						{tag:'div', cls:'importOptionsParameters', children:[]},
+						this.textAreaConfig()
+					]}
+				]},
+				{tag:'div', cls:'step_1', id:this.getId('step_1'), children:[
+					{tag:'div', children:[
+						{tag:'div', id:this.getId('settingsDiv'), children:[
+							{tag:'table', id:'KeePassSettings', children:[
+								{tag:'tbody', children:[
+									{tag:'tr', children:[
+										{tag:'td', width:'50%', valign:'top', children:[
+											{tag:'table', children:[
+												{tag:'tbody', children:[
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Group_checkbox'), name:'Group'/*, checked:true*/}]},
+														{tag:'td', width:'150', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Group_label'), html:"Group"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Group Tree_checkbox'), name:'Group Tree'/*, checked:true*/}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Group Tree_label'), html:"Group Tree"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('UserName_checkbox'), name:'UserName', checked:true}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('UserName_label'), html:"UserName"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('URL_checkbox'), name:'URL', checked:true}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('URL_label'), html:"URL"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Password_checkbox'), name:'Password', checked:true}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Password_label'), html:"Password"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Notes_checkbox'), name:'Notes', checked:true}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Notes_label'), html:"Notes"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('UUID_checkbox'), name:'UUID'/*, checked:true*/}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('UUID_label'), html:"UUID"}]}
+													]}
+												]}
+											]}
+										]},
+										{tag:'td', width:'50%', valign:'top', children:[
+											{tag:'table', children:[
+												{tag:'tbody', children:[
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Icon_checkbox'), name:'Icon'/*, checked:true*/}]},
+														{tag:'td', width:'150', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Icon_label'), html:"Icon"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Creation Time_checkbox'), name:'Creation Time'/*, checked:true*/}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Creation Time_label'), html:"Creation Time"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Last Access_checkbox'), name:'Last Access'/*, checked:true*/}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Last Access_label'), html:"Last Access"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Last Modification_checkbox'), name:'Last Modification'/*, checked:true*/}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Last Modification_label'), html:"Last Modification"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Expires_checkbox'), name:'Expires'/*, checked:true*/}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Expires_label'), html:"Expires"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Attachment Description_checkbox'), name:'Attachment Description', checked:true}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Attachment Description_label'), html:"Attachment Description"}]}
+													]},
+													{tag:'tr', children:[
+														{tag:'td', valign:'top', children:[{tag:'input', type:'checkbox', id:this.getId('Attachment_checkbox'), name:'Attachment', checked:true}]},
+														{tag:'td', valign:'top', children:[{tag:'span', cls:'keePassFieldLabel', id:this.getId('Attachment_label'), html:"Attachment"}]}
+													]}
+												]}
+											]}
+										]}
+									]}
+								]}
+							]}
+						]}
+					]}
+				]},
+				{tag:'div', cls:'step_2', id:this.getId('step_2'), children:[
+					{tag:'div', children:[
+						{tag:'div', id:this.getId('previewDiv'), html:"preview"}
+					]}
+				]},
+				{tag:'div', cls:'step_3', id:this.getId('step_3'), children:[
+					{tag:'div', children:[
+						{tag:'h4', html:"done"}
+					]}
+				]}
+			]},
+			{tag:'div', cls:'importOptionsButtons', children:[
+				{tag:'table', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('backActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('nextActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'}
+						]}
+					]}
+				]}
+			]}
+		]});
+		
+		this.updateSteps();
+		
+		this.setBackButton(new YAHOO.ext.Button(this.getDom('backActionButton'), {text:"back", handler:this.backAction, scope:this}));
+		this.setNextButton(new YAHOO.ext.Button(this.getDom('nextActionButton'), {text:"next", handler:this.nextAction, scope:this}));
+		
+		this.getElement('step_0').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show()
+		this.getElement('step_1').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_2').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_3').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+//MochiKit.Logging.logDebug("<<< Import.KeePassImportComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'nextAction': function() {
+		switch (this.currentStep()) {
+			case 0:	//	-> 1
+				Clipperz.PM.Components.MessageBox.showProgressPanel(
+					MochiKit.Base.method(this, 'deferredParseValues'),
+					MochiKit.Base.method(this, 'handleParseError'),
+					this.getDom('nextActionButton')
+				);
+				break;
+			case 1:	//	-> 2
+				this.previewValues();
+				break;
+			case 2:	//	-> 3
+				this.importValues();
+				break;
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'deferredParseValues': function() {
+		var deferredResult;
+
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredParseValues - 1 " + res.substring(0,50)); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'parseImportData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredParseValues - 2 " + res.substring(0,50)); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.startProcessing();
+			
+			return res;
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredParseValues - 3 " + res.substring(0,50)); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'parseKeePassValues'));	//	processPasswordPlusValues
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredParseValues - 4 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setParsedValues'));		//	setProcessedValues
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredParseValues - 5 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'showSettings'));			//	previewRecordValues
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredParseValues - 6 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.processingDone();
+			this.getElement('step_0').hide();
+			this.getElement('step_1').show();
+			this.backButton().enable();
+			
+			return res;
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredParseValues - 7 " + res); return res;});
+		deferredResult.callback(this.textAreaContent());		
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'deferredPreviewValues': function() {
+		var deferredResult;
+
+//MochiKit.Logging.logDebug(">>> KeePassImportComonent.deferredPreviewValues");
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 1 " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'previewImportData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 2 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.startProcessing();
+			
+			return res;
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 3 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'processKeePassParsedValues'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 4 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setProcessedValues'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 5 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'previewRecordValues'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 6 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.processingDone();
+			this.getElement('step_1').hide();
+			this.getElement('step_2').show();
+			this.backButton().enable();
+			
+			return res;
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 7 " + res); return res;});
+//		deferredResult.addErrback(MochiKit.Base.bind(function() {
+//			this.processingAborted();
+//		}, this))
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.deferredPreviewValues - 8 " + res); return res;});
+		deferredResult.callback(this.parsedValues());		
+//MochiKit.Logging.logDebug("<<< KeePassImportComonent.deferredPreviewValues");
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'definedFields': function() {
+		return this._definedFields;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'parseKeePassValues': function(someData) {
+		var deferredResult;
+		var keePassProcessor;
+
+		keePassProcessor = new Clipperz.KeePassExportProcessor();
+		
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.parseKeePassValues - 1 " + res.substring(0,50)); return res;});
+		deferredResult.addCallback(function(res) {
+			return Clipperz.NotificationCenter.deferredNotification(this, 'updatedProgressState', {steps:(res.length)}, res);
+		})
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.parseKeePassValues - 2 " + res.substring(0,50)); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(keePassProcessor, 'deferredParse'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("KeePassImportComponent.parseKeePassValues - 3 " + res); return res;});
+		deferredResult.callback(someData);
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'showSettings': function(someValues) {
+		var availableFields;
+		var i,c;
+
+//MochiKit.Logging.logDebug(">>> KeePassImportCOmponent.showSettings");
+		availableFields = new Clipperz.Set();
+		c = this.parsedValues().length;
+		for (i=0; i<c; i++) {
+			var fieldLabel;
+
+			for (fieldLabel in this.parsedValues()[i]) {
+				availableFields.add(fieldLabel);
+			}
+		}
+		
+		c = this.definedFields().length;
+		for (i=0; i<c; i++) {
+			var definedField;
+			
+			definedField = this.definedFields()[i];
+			if (availableFields.contains(definedField)) {
+//MochiKit.Logging.logDebug("enabling field " + definedField);
+				this.getDom(definedField + '_checkbox').disabled = false;
+				this.getElement(definedField + '_label').removeClass('disabled');
+			} else {
+//MochiKit.Logging.logDebug("disabling field " + definedField);
+				this.getDom(definedField + '_checkbox').disabled = true;
+				this.getDom(definedField + '_checkbox').checked = false;	//	????
+				this.getElement(definedField + '_label').addClass('disabled');
+			}
+		}
+//MochiKit.Logging.logDebug("<<< KeePassImportCOmponent.showSettings");
+		
+		return MochiKit.Async.succeed(someValues);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'shouldImportField': function(aFieldName) {
+		var fieldCheckbox;
+		var result;
+
+//MochiKit.Logging.logDebug(">>> shouldImportField: " + aFieldName);
+//		fieldCheckbox = this.getDom(aFieldName + '_checkbox');
+		fieldCheckbox = MochiKit.DOM.getElement(this.getId(aFieldName + '_checkbox'));
+		if (fieldCheckbox != null) {
+			result = fieldCheckbox.checked;
+		} else {
+			result = false;
+		}
+//MochiKit.Logging.logDebug("<<< shouldImportField: " + result);
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'processKeePassParsedValues': function(someValues) {
+		var deferredResult;
+		var records;
+		var i,c;
+		
+//MochiKit.Logging.logDebug(">>> processKeePassParsedValues");
+		deferredResult = new MochiKit.Async.Deferred();
+		records = [];
+		
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("processKeePassParsedValues - 1: " + res); return res;});
+		c = someValues.length;
+		deferredResult.addCallback(function(res) {
+			return Clipperz.NotificationCenter.deferredNotification(this, 'updatedProgressState', {steps:c}, res);
+		})
+		for(i=0; i<c; i++) {
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + i + "] processKeePassParsedValues - 1.1: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Async.wait, 0.2);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + i + "] processKeePassParsedValues - 1.2: " + res); return res;});
+			deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', {});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + i + "] processKeePassParsedValues - 1.3: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.bind(function(someRecords, someData) {
+				var record;
+				var recordVersion;
+				var ii;
+
+				record = new Clipperz.PM.DataModel.Record({user:this.user()});
+				record.setLabel(someData['Title']);
+				if (this.shouldImportField('Notes')) {
+					record.setNotes(someData['Notes']);
+				}
+				recordVersion = record.currentVersion()
+
+				for (ii in someData) {
+					if ((ii != 'Title') && (ii != 'Notes') && (typeof(someData[ii]) != "undefined") && (this.shouldImportField(ii))) {
+						var recordField;
+						var recordFieldType;
+						
+						recordFieldType = 'TXT';
+						if (ii == 'Password') {
+							recordFieldType = 'PWD';
+						} else if (ii == 'URL') {
+							recordFieldType = 'URL';
+						} else if ((ii == 'Creation Time') || (ii == 'Last Access') || (ii == 'Last Modification') || (ii == 'Expires')) {
+							recordFieldType = 'Date';
+						}
+					
+						recordField = new Clipperz.PM.DataModel.RecordField({
+							recordVersion:	recordVersion,
+							label:			ii,
+							value:			someData[ii],
+							type:			recordFieldType
+						});
+						recordVersion.addField(recordField);
+					}
+				}
+			
+				someRecords.push(record);
+			
+				return someRecords;
+			}, this), records, someValues[i]);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + i + "] processKeePassParsedValues - 1.4: " + res); return res;});
+		}
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("processKeePassParsedValues - 2: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Async.succeed, records);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("processKeePassParsedValues - 3: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< processKeePassParsedValues");
+		
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/MainComponent.js b/frontend/beta/js/Clipperz/PM/Components/Import/MainComponent.js
new file mode 100644
index 0000000..54813bc
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/MainComponent.js
@@ -0,0 +1,332 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.MainComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Import.MainComponent.superclass.constructor.call(this, anElement, args);
+
+	this._user = args.user;
+	this._wizardComponent = null;
+
+	this._backButton = null;
+	this._nextButton = null;
+
+	this._selectedComponent = null;
+	
+	this.render();
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.MainComponent, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.MainComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'wizardComponent': function() {
+		return this._wizardComponent;
+	},
+	
+	'setWizardComponent': function(aValue) {
+		if (this._wizardComponent != null) {
+			this._wizardComponent.remove();
+		}
+		
+		if (aValue != null) {
+			this.getElement('importCover').hide();
+			this.getElement('importWizard').show();
+		}
+		this._wizardComponent = aValue;
+	},
+
+	'resetImportComponent': function() {
+//MochiKit.Logging.logDebug(">>> resetImportComponent");
+		this.setWizardComponent(null);
+		this.getElement('wizardComponent').update("");
+
+		this.getElement('importCover').show();
+		this.getElement('importWizard').hide();
+//MochiKit.Logging.logDebug("<<< resetImportComponent");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'backButton': function() {
+		return this._backButton;
+	},
+
+	'setBackButton': function(aValue) {
+		this._backButton = aValue;
+	},
+	
+	'nextButton': function() {
+		return this._nextButton;
+	},
+	
+	'setNextButton': function(aValue) {
+		this._nextButton = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> Import.MainComponent.render");
+		Clipperz.NotificationCenter.unregister(this);
+		MochiKit.Signal.disconnectAllTo(this);
+
+		this.element().update("");
+		this.domHelper().append(this.element(), {tag:'div', id:this.getId('mainDiv'), children:[
+			{tag:'div', id:this.getId('importCover'), children:[
+				{tag:'h5', htmlString:Clipperz.PM.Strings['importTabTitle']},
+				{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['importTabDescription']},
+				{tag:'div', cls:'importFormats', children:[
+					{tag:'ul', cls:'radioList', children:[
+						{tag:'li', children:[
+							{tag:'table', children:[{tag:'tbody', children:[{tag:'tr', children:[
+								{tag:'td', valign:'top', children:[
+									{tag:'input', id:this.getId('CSV_radio'), type:'radio', name:'importFormat', value:'CSV'}
+								]},
+								{tag:'td', valign:'top', children:[
+									{tag:'h4', id:this.getId('CSV_title'), htmlString:Clipperz.PM.Strings['importFormats']['CSV']['label']},
+									{tag:'div', cls:'templateDescription', htmlString:Clipperz.PM.Strings['importFormats']['CSV']['description']}
+								]}
+							]}]}]}
+						]},
+						{tag:'li', children:[
+							{tag:'table', children:[{tag:'tbody', children:[{tag:'tr', children:[
+								{tag:'td', valign:'top', children:[
+									{tag:'input', id:this.getId('Excel_radio'), type:'radio', name:'importFormat', value:'EXCEL'}
+								]},
+								{tag:'td', valign:'top', children:[
+									{tag:'h4', id:this.getId('Excel_title'), htmlString:Clipperz.PM.Strings['importFormats']['Excel']['label']},
+									{tag:'div', cls:'templateDescription', htmlString:Clipperz.PM.Strings['importFormats']['Excel']['description']}
+								]}
+							]}]}]}
+						]},
+						{tag:'li', children:[
+							{tag:'table', children:[{tag:'tbody', children:[{tag:'tr', children:[
+								{tag:'td', valign:'top', children:[
+									{tag:'input', id:this.getId('KeePass_radio'), type:'radio', name:'importFormat', value:'KEEPASS'}
+								]},
+								{tag:'td', valign:'top', children:[
+									{tag:'h4', id:this.getId('KeePass_title'), htmlString:Clipperz.PM.Strings['importFormats']['KeePass']['label']},
+									{tag:'div', cls:'templateDescription', htmlString:Clipperz.PM.Strings['importFormats']['KeePass']['description']}
+								]}
+							]}]}]}
+						]},
+						{tag:'li', children:[
+							{tag:'table', children:[{tag:'tbody', children:[{tag:'tr', children:[
+								{tag:'td', valign:'top', children:[
+									{tag:'input', id:this.getId('Roboform_radio'), type:'radio', name:'importFormat', value:'ROBOFORM'}
+								]},
+								{tag:'td', valign:'top', children:[
+									{tag:'h4', id:this.getId('Roboform_title'), htmlString:Clipperz.PM.Strings['importFormats']['Roboform']['label']},
+									{tag:'div', cls:'templateDescription', htmlString:Clipperz.PM.Strings['importFormats']['Roboform']['description']}
+								]}
+							]}]}]}
+						]},
+						{tag:'li', children:[
+							{tag:'table', children:[{tag:'tbody', children:[{tag:'tr', children:[
+								{tag:'td', valign:'top', children:[
+									{tag:'input', id:this.getId('PasswordPlus_radio'), type:'radio', name:'importFormat', value:'PASSWORD_PLUS'}
+								]},
+								{tag:'td', valign:'top', children:[
+									{tag:'h4', id:this.getId('PasswordPlus_title'), htmlString:Clipperz.PM.Strings['importFormats']['PasswordPlus']['label']},
+									{tag:'div', cls:'templateDescription', htmlString:Clipperz.PM.Strings['importFormats']['PasswordPlus']['description']}
+								]}
+							]}]}]}
+						]},
+						{tag:'li', children:[
+							{tag:'table', children:[{tag:'tbody', children:[{tag:'tr', children:[
+								{tag:'td', valign:'top', children:[
+									{tag:'input', id:this.getId('ClipperzExport_radio'), type:'radio', name:'importFormat', value:'CLIPPERZ_EXPORT'}
+								]},
+								{tag:'td', valign:'top', children:[
+									{tag:'h4', id:this.getId('ClipperzExport_title'), htmlString:Clipperz.PM.Strings['importFormats']['ClipperzExport']['label']},
+									{tag:'div', cls:'templateDescription', htmlString:Clipperz.PM.Strings['importFormats']['ClipperzExport']['description']}
+								]}
+							]}]}]}
+						]}
+					]},
+
+					{tag:'div', cls:'importOptionsButtons', children:[
+						{tag:'table', children:[
+							{tag:'tbody', children:[
+								{tag:'tr', children:[
+									{tag:'td', html:'&nbsp;'},
+									{tag:'td', children:[
+										{tag:'div', id:this.getId('backActionButton')}
+									]},
+									{tag:'td', html:'&nbsp;'},
+									{tag:'td', children:[
+										{tag:'div', id:this.getId('nextActionButton')}
+									]},
+									{tag:'td', html:'&nbsp;'}
+								]}
+							]}
+						]}
+					]}
+				]}
+			]},
+			{tag:'div', id:this.getId('importWizard'), children:[
+				{tag:'form', id:this.getId('importWizardForm'), children:[
+					{tag:'div', cls:'wizardComponent', id:this.getId('wizardComponent'), children:[]}
+				]}
+			]}
+		]});
+
+		this.setBackButton(new YAHOO.ext.Button(this.getDom('backActionButton'), {text:"back", handler:this.backAction, scope:this}));
+		this.setNextButton(new YAHOO.ext.Button(this.getDom('nextActionButton'), {text:"next", handler:this.nextAction, scope:this}));
+
+		this.backButton().disable();
+		this.nextButton().disable();
+		
+		this.getElement('importCover').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show();
+		this.getElement('importWizard').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+			this.getElement('mainDiv').addClass('read-only');
+
+			this.getDom('ClipperzExport_radio').disabled = true;
+			this.getDom('CSV_radio').disabled = true;
+			this.getDom('Excel_radio').disabled = true;
+			this.getDom('PasswordPlus_radio').disabled = true;
+			this.getDom('Roboform_radio').disabled = true;
+			this.getDom('KeePass_radio').disabled = true;
+		} else {
+			MochiKit.Signal.connect(this.getId('ClipperzExport_radio'), 'onclick', MochiKit.Base.method(this, 'selectComponent'));
+			MochiKit.Signal.connect(this.getId('CSV_radio'), 'onclick', MochiKit.Base.method(this, 'selectComponent'));
+			MochiKit.Signal.connect(this.getId('Excel_radio'), 'onclick', MochiKit.Base.method(this, 'selectComponent'));
+			MochiKit.Signal.connect(this.getId('PasswordPlus_radio'), 'onclick', MochiKit.Base.method(this, 'selectComponent'));
+			MochiKit.Signal.connect(this.getId('Roboform_radio'), 'onclick', MochiKit.Base.method(this, 'selectComponent'));
+			MochiKit.Signal.connect(this.getId('KeePass_radio'), 'onclick', MochiKit.Base.method(this, 'selectComponent'));
+
+			if (Clipperz_IEisBroken != true) {
+				MochiKit.Signal.connect(this.getId('ClipperzExport_title'), 'onclick', this.getDom('ClipperzExport_radio'), 'click');
+				MochiKit.Signal.connect(this.getId('CSV_title'), 'onclick', this.getDom('CSV_radio'), 'click');
+				MochiKit.Signal.connect(this.getId('Excel_title'), 'onclick', this.getDom('Excel_radio'), 'click');
+				MochiKit.Signal.connect(this.getId('PasswordPlus_title'), 'onclick', this.getDom('PasswordPlus_radio'), 'click');
+				MochiKit.Signal.connect(this.getId('Roboform_title'), 'onclick', this.getDom('Roboform_radio'), 'click');
+				MochiKit.Signal.connect(this.getId('KeePass_title'), 'onclick', this.getDom('KeePass_radio'), 'click');
+			}
+
+			Clipperz.NotificationCenter.register(null, 'importCompleted', this, 'resetImportComponent');
+			Clipperz.NotificationCenter.register(null, 'importCancelled', this, 'resetImportComponent');
+		}
+
+//MochiKit.Logging.logDebug("<<< Import.MainComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+/*
+	'selectedFormat': function() {
+		return this.getDom('importSelectionOptions').value;
+	},
+*/
+	//-------------------------------------------------------------------------
+
+	'updateSelectedImportWizardComponent': function(aComponent) {
+		var newWizardComponent;
+
+//MochiKit.Logging.logDebug(">>> Import.MainComponent.updateSelectedImportWizardComponent");
+		this.getElement('wizardComponent').update("");
+		
+		switch(aComponent) {
+			case 'CLIPPERZ_EXPORT':
+				newWizardComponent = new Clipperz.PM.Components.Import.ClipperzImportComponent(this.getElement('wizardComponent'), {user:this.user()});
+				break;
+			case 'CSV':
+				newWizardComponent = new Clipperz.PM.Components.Import.CSVImportComponent(this.getElement('wizardComponent'), {user:this.user()});
+				break;
+			case 'EXCEL':
+				newWizardComponent = new Clipperz.PM.Components.Import.ExcelImportComponent(this.getElement('wizardComponent'), {user:this.user()});
+				break;
+			case 'PASSWORD_PLUS':
+				newWizardComponent = new Clipperz.PM.Components.Import.PasswordPlusImportComponent(this.getElement('wizardComponent'), {user:this.user()});
+				break;
+			case 'ROBOFORM':
+				newWizardComponent = new Clipperz.PM.Components.Import.RoboFormImportComponent(this.getElement('wizardComponent'), {user:this.user()});;
+				break;
+			case 'KEEPASS':
+				newWizardComponent = new Clipperz.PM.Components.Import.KeePassImportComponent(this.getElement('wizardComponent'), {user:this.user()});
+				break;
+		}
+		
+		this.setWizardComponent(newWizardComponent);
+//MochiKit.Logging.logDebug("<<< Import.MainComponent.updateSelectedWizardComponent");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'selectComponent': function(anEvent) {
+		this.setSelectedComponent(anEvent.src().value);
+		this.nextButton().enable();
+	},
+
+	'selectedComponent': function() {
+		return this._selectedComponent;
+	},
+	
+	'setSelectedComponent': function(aValue) {
+		this._selectedComponent = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'backAction': function() {
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'nextAction': function() {
+		this.updateSelectedImportWizardComponent(this.selectedComponent());
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/PasswordPlusImportComponent.js b/frontend/beta/js/Clipperz/PM/Components/Import/PasswordPlusImportComponent.js
new file mode 100644
index 0000000..f476ac2
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/PasswordPlusImportComponent.js
@@ -0,0 +1,315 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.PasswordPlusImportComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Import.PasswordPlusImportComponent.superclass.constructor.call(this, anElement, args);
+
+	this.render();
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.PasswordPlusImportComponent, Clipperz.PM.Components.Import.GenericImportComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.PasswordPlusImportComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> Import.PasswordPlusImportComponent.render");
+		this.domHelper().append(this.element(), {tag:'div', cls:'passwordPlusImportWizard', children:[
+			{tag:'h3', htmlString:Clipperz.PM.Strings['PasswordPlus_ImportWizard_Title']},
+			{tag:'div', cls:'importSteps', id:this.getId('importSteps')},
+			{tag:'div', cls:'importStepBlocks', children:[
+				{tag:'div', cls:'step_0', id:this.getId('step_0'), children:[
+					{tag:'div', children:[
+						{tag:'div', cls:'importOptionsDescription', htmlString:Clipperz.PM.Strings['importOptions_passwordPlus_description']},
+						{tag:'div', cls:'importOptionsParameters', children:[]},
+						this.textAreaConfig()
+					]}
+				]},
+				{tag:'div', cls:'step_1', id:this.getId('step_1'), children:[
+					{tag:'div', children:[
+						{tag:'div', id:this.getId('previewDiv'), html:"preview"}
+					]}
+				]},
+				{tag:'div', cls:'step_2', id:this.getId('step_2'), children:[
+					{tag:'div', children:[
+						{tag:'h4', html:"done"}
+					]}
+				]}
+			]},
+			{tag:'div', cls:'importOptionsButtons', children:[
+				{tag:'table', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('backActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('nextActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'}
+						]}
+					]}
+				]}
+			]}
+		]});
+		
+		this.updateSteps();
+		
+		this.setBackButton(new YAHOO.ext.Button(this.getDom('backActionButton'), {text:"back", handler:this.backAction, scope:this}));
+		this.setNextButton(new YAHOO.ext.Button(this.getDom('nextActionButton'), {text:"next", handler:this.nextAction, scope:this}));
+		
+		this.getElement('step_0').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show()
+		this.getElement('step_1').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_2').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+//MochiKit.Logging.logDebug("<<< Import.PasswordPlusImportComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+/*
+	'backAction': function() {
+		switch (this.currentStep()) {
+			case 1:	//	-> 0
+				this.backButton().disable();
+				this.getElement('step_1').hide();
+				this.setCurrentStep(0);
+				this.getElement('step_0').show();
+				break;
+		}
+	},
+*/
+	//-------------------------------------------------------------------------
+	
+	'nextAction': function() {
+		switch (this.currentStep()) {
+			case 0:	//	-> 1
+				this.previewValues();
+				break;
+			case 1:	//	-> 2
+				this.importValues();
+				break;
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'deferredPreviewValues': function() {
+		var deferredResult;
+
+//		this.setFormValues(MochiKit.DOM.formContents(this.getDom('dataForm')));
+
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.startProcessing();
+			
+			return res;
+		}, this));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'processPasswordPlusValues'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setProcessedValues'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'previewRecordValues'));
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.processingDone();
+			this.getElement('step_0').hide();
+			this.getElement('step_1').show();
+			this.backButton().enable();
+			
+			return res;
+		}, this));
+//		deferredResult.addErrback(MochiKit.Base.bind(function() {
+//			this.processingAborted();
+//		}, this))
+		deferredResult.callback(this.textAreaContent());		
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'processPasswordPlusValues': function(someData) {
+		var deferredResult;
+		var csvProcessor;
+
+		csvProcessor = new Clipperz.CSVProcessor({binary:true});
+		
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'parseImportData');
+		deferredResult.addCallback(function(res) {
+			return Clipperz.NotificationCenter.deferredNotification(this, 'updatedProgressState', {steps:(res.length * 2)}, res);
+		})
+		deferredResult.addCallback(MochiKit.Base.method(csvProcessor, 'deferredParse'));
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'previewImportData');
+		deferredResult.addCallback(function(res) {
+			return Clipperz.NotificationCenter.deferredNotification(this, 'updatedProgressState', {steps:(res.length * 2), step:res.length}, res);
+		})
+		deferredResult.addCallback(MochiKit.Base.bind(function(someCSVValues) {
+			var innerDeferredResult;
+			var records;
+			var i,c;
+			
+			innerDeferredResult = new MochiKit.Async.Deferred();
+			records = [];
+			
+			c = someCSVValues.length;
+			i=0;
+			i++;	//	Dataviz Passwords Plus Export, Version,1, Minimum Version To Read,1
+			i++;	//	Is Template,Title,Category,Field 1 Label,Field 1 Value,Field 1 Hidden,Field 2 Label,Field 2 Value,Field 2 Hidden,Field 3 Label,Field 3 Value,Field 3 Hidden,Field 4 Label,Field 4 Value,Field 4 Hidden,Field 5 Label,Field 5 Value,Field 5 Hidden,Field 6 Label,Field 6 Value,Field 6 Hidden,Field 7 Label,Field 7 Value,Field 7 Hidden,Field 8 Label,Field 8 Value,Field 8 Hidden,Field 9 Label,Field 9 Value,Field 9 Hidden,Field 10 Label,Field 10 Value,Field 10 Hidden,Note
+
+			for(    ; i<c; i++) {
+				innerDeferredResult.addCallback(MochiKit.Async.wait, 0.2);
+				innerDeferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', {});
+				innerDeferredResult.addCallback(MochiKit.Base.bind(function(someRecords, someData) {
+					if (someData[0] == '0') {
+						var record;
+						var recordVersion;
+						var ii, cc;
+					
+						record = new Clipperz.PM.DataModel.Record({user:this.user()});
+						if (someData[1] != "") {
+							record.setLabel(someData[1]);
+						} else {
+							record.setLabel("imported record [" + (i+1) + "]");
+						}
+						record.setNotes(someData[33]);
+						recordVersion = record.currentVersion()
+
+						cc = 10;
+						for (ii=0; ii<cc; ii++) {
+							var currentFieldValueIndex;
+							var currentType;
+				
+							currentFieldValueIndex = (ii * 3) + 4;
+						
+							if (someData[currentFieldValueIndex] != "") {
+								var recordField;
+								var recordFieldType;
+								
+								recordFieldType = 'TXT';
+								if (someData[currentFieldValueIndex + 1] == 1) {
+									recordFieldType = 'PWD';
+								} else if (/^http/.test(someData[currentFieldValueIndex])) {
+									recordFieldType = 'URL';
+								}
+							
+								recordField = new Clipperz.PM.DataModel.RecordField({
+									recordVersion:	recordVersion,
+									label:			someData[currentFieldValueIndex - 1],
+									value:			someData[currentFieldValueIndex],
+									type:			recordFieldType
+								});
+								recordVersion.addField(recordField);
+							}
+						}
+
+	//					this.user().addRecord(record, true);
+					
+						someRecords.push(record);
+					}
+				
+					return someRecords;
+				}, this), records, someCSVValues[i]);
+			}
+			innerDeferredResult.addCallback(MochiKit.Async.succeed, records);
+			innerDeferredResult.callback();
+			
+			return innerDeferredResult;
+		}, this));
+		deferredResult.callback(someData);
+
+		return deferredResult;
+
+/*
+0	Is Template
+1	Title
+2	Category
+
+3	Field 1 Label
+4	Field 1 Value
+5	Field 1 Hidden
+
+6	Field 2 Label
+7	Field 2 Value
+8	Field 2 Hidden
+
+9	Field 3 Label
+10	Field 3 Value
+11	Field 3 Hidden
+
+12	Field 4 Label
+13	Field 4 Value
+14	Field 4 Hidden
+
+15	Field 5 Label
+16	Field 5 Value
+17	Field 5 Hidden
+
+18	Field 6 Label
+19	Field 6 Value
+20	Field 6 Hidden
+
+21	Field 7 Label
+22	Field 7 Value
+23	Field 7 Hidden
+
+24	Field 8 Label
+25	Field 8 Value
+26	Field 8 Hidden
+
+27	Field 9 Label
+28	Field 9 Value
+29	Field 9 Hidden
+
+30	Field 10 Label
+31	Field 10 Value
+32	Field 10 Hidden
+
+33	Note
+*/
+	},
+
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Import/RoboFormImportComponent.js b/frontend/beta/js/Clipperz/PM/Components/Import/RoboFormImportComponent.js
new file mode 100644
index 0000000..d35bdc6
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Import/RoboFormImportComponent.js
@@ -0,0 +1,392 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Import) == 'undefined') { Clipperz.PM.Components.Import = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Import.RoboFormImportComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Import.RoboFormImportComponent.superclass.constructor.call(this, anElement, args);
+
+	this.render();
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Import.RoboFormImportComponent, Clipperz.PM.Components.Import.GenericImportComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Import.RoboFormImportComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> Import.RoboFormImportComponent.render");
+		this.domHelper().append(this.element(), {tag:'div', cls:'roboFormImportWizard', children:[
+			{tag:'h3', htmlString:Clipperz.PM.Strings['RoboForm_ImportWizard_Title']},
+			{tag:'div', cls:'importSteps', id:this.getId('importSteps')},
+			{tag:'div', cls:'importStepBlocks', children:[
+				{tag:'div', cls:'step_0', id:this.getId('step_0'), children:[
+					{tag:'div', children:[
+						{tag:'div', cls:'importOptionsDescription', htmlString:Clipperz.PM.Strings['importOptions_roboForm_description']},
+						{tag:'div', cls:'importOptionsParameters', children:[]},
+						this.textAreaConfig()
+					]}
+				]},
+				{tag:'div', cls:'step_1', id:this.getId('step_1'), children:[
+					{tag:'div', children:[
+						{tag:'div', id:this.getId('previewDiv'), html:"preview"}
+					]}
+				]},
+				{tag:'div', cls:'step_2', id:this.getId('step_2'), children:[
+					{tag:'div', children:[
+						{tag:'h4', html:"done"}
+					]}
+				]}
+			]},
+			{tag:'div', cls:'importOptionsButtons', children:[
+				{tag:'table', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('backActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'},
+							{tag:'td', children:[
+								{tag:'div', id:this.getId('nextActionButton')}
+							]},
+							{tag:'td', html:'&nbsp;'}
+						]}
+					]}
+				]}
+			]}
+		]});
+		
+		this.updateSteps();
+		
+		this.setBackButton(new YAHOO.ext.Button(this.getDom('backActionButton'), {text:"back", handler:this.backAction, scope:this}));
+		this.setNextButton(new YAHOO.ext.Button(this.getDom('nextActionButton'), {text:"next", handler:this.nextAction, scope:this}));
+		
+		this.getElement('step_0').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show()
+		this.getElement('step_1').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.getElement('step_2').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+//MochiKit.Logging.logDebug("<<< Import.RoboFormImportComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'nextAction': function() {
+		switch (this.currentStep()) {
+			case 0:	//	-> 1
+				this.previewValues();
+				break;
+			case 1:	//	-> 2
+				this.importValues();
+				break;
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'deferredPreviewValues': function() {
+		var deferredResult;
+
+//		this.setFormValues(MochiKit.DOM.formContents(this.getDom('dataForm')));
+
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.startProcessing();
+			
+			return res;
+		}, this));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'processRoboFormValues'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setProcessedValues'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'previewRecordValues'));
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.processingDone();
+			this.getElement('step_0').hide();
+			this.getElement('step_1').show();
+			this.backButton().enable();
+			
+			return res;
+		}, this));
+//		deferredResult.addErrback(MochiKit.Base.bind(function() {
+//			this.processingAborted();
+//		}, this))
+		deferredResult.callback(this.textAreaContent());		
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'processRoboFormValues': function(someData) {
+		var result;
+		
+		if (someData.match(/^\<HTML\>\<HEAD\>\<TITLE\>RoboForm Passcards List /g)) {
+			result = this.processRoboFormPasscardsValues(someData);
+		} else if (someData.match(/\<HTML\>\<HEAD\>\<TITLE\>RoboForm Safenotes List /g)) {
+			result = this.processRoboFormSafenotesValues(someData);
+		}
+
+		return result;
+	},
+
+	//.........................................................................
+
+	'processRoboFormPasscardsValues': function(someData) {
+		var deferredResult;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues - 1: "/* + res*/); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'parseImportData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues - 2: "/* + res*/); return res;});
+		deferredResult.addCallback(function(someData) {
+			var result;
+			var data;
+			
+			data = someData.replace(/\r?\n/g, "");
+			result = data.match(/\<TABLE width\=\"100\%\"\>.*?\<\/TABLE\>/g);
+
+			return result;
+		});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues - 3: "/* + res*/); return res;});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues - 3.1: " + res.length); return res;});
+		deferredResult.addCallback(function(res) {
+			return Clipperz.NotificationCenter.deferredNotification(this, 'updatedProgressState', {steps:(res.length)}, res);
+		})
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues - 4: "/* + res*/); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(someRecordValues) {
+			var innerDeferredResult;
+			var records;
+			var i,c;
+
+			innerDeferredResult = new MochiKit.Async.Deferred();
+			records = [];
+			
+			c = someRecordValues.length;
+			for(i=0; i<c; i++) {
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues __inner loop__ - 1: " + res); return res;});
+				innerDeferredResult.addCallback(MochiKit.Async.wait, 0.2);
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues __inner loop__ - 2: " + res); return res;});
+				innerDeferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', {});
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues __inner loop__ - 3: " + res); return res;});
+				innerDeferredResult.addCallback(MochiKit.Base.bind(function(someRecords, someData) {
+					var data;
+					var record;
+					var recordVersion;
+					var fields;
+					var ii, cc;
+					var hasNotes;
+
+					var caption;
+					var subcaption;
+
+//MochiKit.Logging.logDebug("data: " + someData);
+					data = someData.replace(/\<WBR\>/g, "");
+					hasNotes = false;
+					
+					/\<TD class\=caption colSpan\=3\>(.*?)\<\/TD\>/.test(data);		//	<TD class=caption colSpan=3>110mb</TD>
+					caption = RegExp.$1;
+//MochiKit.Logging.logDebug("caption: " + caption);
+					
+					/\<TD class\=subcaption colSpan\=3\>(.*?)\<\/TD\>/.test(data);		//	<TD class=subcaption colSpan=3>110<WBR>mb.com</TD>
+					subcaption = RegExp.$1;
+//MochiKit.Logging.logDebug("subcaption: " + subcaption);
+					
+					record = new Clipperz.PM.DataModel.Record({user:this.user()});
+					recordVersion = record.currentVersion()
+
+					record.setLabel(caption);
+//					record.setNotes(subcaption);
+					if (subcaption != null) {
+						var recordField;
+						
+						recordField = new Clipperz.PM.DataModel.RecordField({
+							recordVersion:	recordVersion,
+							label:			"url",
+							value:			subcaption,
+							type:			'URL'
+						});
+						recordVersion.addField(recordField);
+					}
+
+					fields = data.match(/\<TR\>.*?\<\/TR\>/g) || [];
+					cc = fields.length;
+//MochiKit.Logging.logDebug("fields.length: " + cc);
+					for (ii=0; ii<cc; ii++) {
+						var recordField;
+						var fieldString;
+						var fieldName;
+						var fieldValue;
+
+//MochiKit.Logging.logDebug("fieldString: " + fields[ii]);
+						fieldString = fields[ii];
+//MochiKit.Logging.logDebug("fieldString (cleaned): " + fieldString);
+						/\<TD class\=field vAlign\=top align\=left width\=\"40\%\"\>(.*?)\<\/TD\>/.test(fieldString);
+						fieldName = RegExp.$1;
+						
+						/\<TD class\=wordbreakfield vAlign\=top align\=left width\=\"55\%\"\>(.*?)\<\/TD\>/.test(fieldString);
+						fieldValue = RegExp.$1;
+
+						if (fieldName == "Note$") {
+							record.setNotes(fieldValue);
+							hasNotes = true;
+						} else {
+							var fieldType;
+
+							if (((ii == 1) && (hasNotes == false)) || ((ii == 2) && (hasNotes == true))) {
+								fieldType = 'PWD';
+							} else {
+								fieldType = 'TXT';
+							}
+							
+							recordField = new Clipperz.PM.DataModel.RecordField({
+								recordVersion:	recordVersion,
+								label:			fieldName,
+								value:			fieldValue,
+								type:			fieldType
+							});
+							recordVersion.addField(recordField);
+						}
+					}
+					
+					someRecords.push(record);
+				
+					return someRecords;
+				}, this), records, someRecordValues[i]);
+			}
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues __inner loop__ - 4: " + res); return res;});
+			innerDeferredResult.addCallback(MochiKit.Async.succeed, records);
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues __inner loop__ - 5: " + res); return res;});
+			innerDeferredResult.callback();
+			
+			return innerDeferredResult;
+		}, this));
+		deferredResult.callback(someData);
+
+		return deferredResult;
+	},
+
+
+	//.........................................................................
+
+	'processRoboFormSafenotesValues': function(someData) {
+		var deferredResult;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues - 1: "/* + res*/); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'parseImportData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues - 2: "/* + res*/); return res;});
+		deferredResult.addCallback(function(someData) {
+			var result;
+			var data;
+			
+			data = someData.replace(/\r?\n/g, "");
+			result = data.match(/\<TABLE width\=\"100\%\"\>.*?\<\/TABLE\>/g);
+
+			return result;
+		});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues - 3: "/* + res*/); return res;});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues - 3.1: " + res.length); return res;});
+		deferredResult.addCallback(function(res) {
+			return Clipperz.NotificationCenter.deferredNotification(this, 'updatedProgressState', {steps:(res.length)}, res);
+		})
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues - 4: "/* + res*/); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(someRecordValues) {
+			var innerDeferredResult;
+			var records;
+			var i,c;
+
+			innerDeferredResult = new MochiKit.Async.Deferred();
+			records = [];
+			
+			c = someRecordValues.length;
+			for(i=0; i<c; i++) {
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues __inner loop__ - 1: " + res); return res;});
+				innerDeferredResult.addCallback(MochiKit.Async.wait, 0.2);
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues __inner loop__ - 2: " + res); return res;});
+				innerDeferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', {});
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues __inner loop__ - 3: " + res); return res;});
+				innerDeferredResult.addCallback(MochiKit.Base.bind(function(someRecords, someData) {
+					var data;
+					var record;
+					var recordVersion;
+
+					var caption;
+					var wordbreakfield;
+
+//MochiKit.Logging.logDebug("data: " + someData);
+					data = someData.replace(/\<WBR\>/g, "");
+					hasNotes = false;
+					
+					/\<TD class\=caption colSpan\=3\>(.*?)\<\/TD\>/.test(data);		//	<TD class=caption colSpan=3>110mb</TD>
+					caption = RegExp.$1;
+//MochiKit.Logging.logDebug("caption: " + caption);
+					
+					/\<TD class\=wordbreakfield vAlign=top align\=left width\=\"\1\0\0\%\"\>(.*?)\<\/TD\>/.test(data);		//	<TD class=wordbreakfield vAlign=top align=left width="100%">7759500</TD>
+					wordbreakfield = RegExp.$1;
+//MochiKit.Logging.logDebug("subcaption: " + subcaption);
+					
+					record = new Clipperz.PM.DataModel.Record({user:this.user()});
+					recordVersion = record.currentVersion()
+
+					record.setLabel(caption);
+					record.setNotes(wordbreakfield);
+					
+					someRecords.push(record);
+				
+					return someRecords;
+				}, this), records, someRecordValues[i]);
+			}
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues __inner loop__ - 4: " + res); return res;});
+			innerDeferredResult.addCallback(MochiKit.Async.succeed, records);
+//innerDeferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RoboFormImportComponent.processRoboFormValues __inner loop__ - 5: " + res); return res;});
+			innerDeferredResult.callback();
+			
+			return innerDeferredResult;
+		}, this));
+		deferredResult.callback(someData);
+
+		return deferredResult;
+	},
+
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/MessageBox.js b/frontend/beta/js/Clipperz/PM/Components/MessageBox.js
new file mode 100644
index 0000000..d2bc09a
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/MessageBox.js
@@ -0,0 +1,224 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+
+
+
+Clipperz.PM.Components.MessageBoxImplementation = function() {
+	this._step = 0;
+	this._steps = 0;
+	
+	return this;
+};
+
+//YAHOO.extendX(Clipperz.PM.Components.MessageBoxImplementation, Clipperz.PM.Components.BaseComponent, {
+Clipperz.PM.Components.MessageBoxImplementation.prototype = MochiKit.Base.update(null, {
+	
+	'toString': function() {
+		return "Clipperz.PM.Components.MessageBox";
+	},
+
+	//-----------------------------------------------------
+
+	'step': function() {
+		return this._step;
+	},
+	
+	'setStep': function(aValue) {
+		if (aValue == 'next') {
+			this._step = this._step + 1;
+		} else {
+			this._step = aValue;
+		}
+		
+		if (this._step > this.steps()) {
+//MochiKit.Logging.logDebug("overstepping: " + this._step + " (" + this.steps() + ")");
+			this._step = this.steps();
+		}
+	},
+	
+	//-----------------------------------------------------
+
+	'steps': function() {
+		return this._steps;
+	},
+	
+	'setSteps': function(aValue) {
+		if (aValue.constructor == String) {
+			if (aValue.charAt(0) == '+') {
+				this._steps += aValue.substring(1)*1;
+			} else if (aValue.charAt(0) == '-') {
+				this._steps -= aValue.substring(1)*1;
+			} else {
+				this._steps = aValue.substring(1)*1;
+			}
+		} else {
+			this._steps = aValue;
+		}
+	},
+	
+	//-----------------------------------------------------
+
+	'deferredShow': function(aConfiguration, anAnimationTargetElement, aValue) {
+		this.show(aConfiguration, anAnimationTargetElement);
+		
+		return aValue;
+	},
+	
+	'show': function(aConfiguration, anAnimationTargetElement) {
+		var	messageBoxConfiguration;
+		
+		messageBoxConfiguration = MochiKit.Base.clone(aConfiguration);
+		messageBoxConfiguration.msg = messageBoxConfiguration.text;
+		messageBoxConfiguration.animEl = anAnimationTargetElement;
+		messageBoxConfiguration.progress = messageBoxConfiguration.showProgressBar;
+		messageBoxConfiguration.closable = messageBoxConfiguration.showCloseButton;
+		this.setSteps(aConfiguration.steps || 0);
+		this.setStep(aConfiguration.step || 0);
+		delete messageBoxConfiguration.buttons;
+		
+		Clipperz.YUI.MessageBox.show(messageBoxConfiguration);
+	},
+
+	//-----------------------------------------------------
+
+	'update': function(someValues) {
+//MochiKit.Logging.logDebug(">>> MessageBox.update");
+		if (someValues.title) {
+			Clipperz.YUI.MessageBox.getDialog().setTitle(someValues.title);
+		};
+
+		if (someValues.text) {
+			Clipperz.YUI.MessageBox.updateText(someValues.text);
+		};
+		
+		if (typeof(someValues.showProgressBar) != 'undefined') {
+            Clipperz.YUI.MessageBox.progressElement().setDisplayed(someValues.showProgressBar);
+            Clipperz.YUI.MessageBox.updateProgress(0);
+		};
+
+		if (typeof(someValues.steps) != 'undefined') {
+			this.setSteps(someValues.steps);
+		};
+
+		if (typeof(someValues.step) != 'undefined') {
+			this.setStep(someValues.step);
+		} else {
+			this.setStep('next');
+		}
+		Clipperz.YUI.MessageBox.updateProgress(this.step() / this.steps());
+		
+
+		if (typeof(someValues.fn) != 'undefined') {
+            Clipperz.YUI.MessageBox.opt().fn = someValues.fn;
+		};
+
+		if (typeof(someValues.scope) != 'undefined') {
+            Clipperz.YUI.MessageBox.opt().scope = someValues.scope;
+		};
+		
+		if (someValues.buttons) {
+			Clipperz.YUI.MessageBox.updateButtons(someValues.buttons);
+		};
+		
+//		if (someValues.title) {
+//			Clipperz.YUI.MessageBox.getDialog().setTitle(someValues.title + " [" + this.step() + " / " + this.steps() + "]");
+//		};
+		
+//MochiKit.Logging.logDebug("--- MessageBox.update - step: " + this.step() + " / " + this.steps() + " - " + someValues.text);
+//MochiKit.Logging.logDebug("<<< MessageBox.update");
+	},
+
+	//-----------------------------------------------------
+	
+	'hide': function(anAnimationTargetElement) {
+		if (anAnimationTargetElement) {
+			Clipperz.YUI.MessageBox.getDialog().animateTarget = anAnimationTargetElement;
+		}
+		
+		Clipperz.YUI.MessageBox.hide();
+	},
+	
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
+
+
+//##########################################################
+
+_clipperz_pm_components_messageBox = null;
+
+Clipperz.PM.Components.MessageBox = function() {
+	if (_clipperz_pm_components_messageBox == null) {
+		_clipperz_pm_components_messageBox = new Clipperz.PM.Components.MessageBoxImplementation();
+	}
+	
+	return _clipperz_pm_components_messageBox;
+}
+
+//---------------------------------------------------------
+
+Clipperz.PM.Components.MessageBox.showProgressPanel = function(aCallback, anErrback, anActivationItem) {
+	var deferredResult;
+
+	deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.PM.Components.MessageBox.showProgressPanel - 0: " + res); return res;});
+	deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'deferredShow'),
+		{
+			title: "",
+			text: "",
+			width:240,
+			showProgressBar:true,
+			showCloseButton:false,
+			fn:MochiKit.Base.method(deferredResult, 'cancel'),
+			scope:this,
+			buttons:{
+			//	'ok':Clipperz.PM.Strings['loginMessagePanelInitialButtonLabel']
+			}
+		},
+		anActivationItem
+	);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.PM.Components.MessageBox.showProgressPanel - 1: " + res); return res;});
+	deferredResult.addCallback(aCallback);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.PM.Components.MessageBox.showProgressPanel - 2: " + res); return res;});
+	deferredResult.addCallback(MochiKit.Async.wait, 0.5);
+	deferredResult.addCallback(function(res) {
+		Clipperz.PM.Components.MessageBox().hide(YAHOO.ext.Element.get(anActivationItem));
+		return res;
+	});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.PM.Components.MessageBox.showProgressPanel - 3: " + res); return res;});
+	deferredResult.addErrback(anErrback);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.PM.Components.MessageBox.showProgressPanel - 4: " + res); return res;});
+	deferredResult.callback();
+	
+	return deferredResult;
+};
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/OTP/MainComponent.js b/frontend/beta/js/Clipperz/PM/Components/OTP/MainComponent.js
new file mode 100644
index 0000000..9d191f6
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/OTP/MainComponent.js
@@ -0,0 +1,490 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.OTP) == 'undefined') { Clipperz.PM.Components.OTP = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.OTP.MainComponent = function(anElement, args) {
+	args = args || {};
+
+//MochiKit.Logging.logDebug("new OTP.MainComponent");
+    Clipperz.PM.Components.OTP.MainComponent.superclass.constructor.call(this, anElement, args);
+
+	this._user = args.user;
+	this._shouldRender = true;
+
+	this._deleteButton = null;
+	this._printButton = null;
+
+	Clipperz.NotificationCenter.register(null, 'tabSelected', this, 'tabSelectedHandler');
+//	Clipperz.NotificationCenter.register(null, 'oneTimePasswordAdded', this, 'render');
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.OTP.MainComponent, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.OTP.MainComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug("### OTP.MainComponent.render");
+		Clipperz.NotificationCenter.unregister(this);
+		MochiKit.Signal.disconnectAllTo(this);
+
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+			this.element().update("");
+			this.domHelper().append(this.element(), {tag:'div', cls:'oneTimePasswordReadOnlyMessage', htmlString:Clipperz.PM.Strings['oneTimePasswordReadOnlyMessage']});
+		} else {
+			var deferredResult;
+
+			deferredResult = new MochiKit.Async.Deferred();
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OTP.MainComponent.render - 1: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.bind(function() {
+				this.element().update("");
+				Clipperz.YUI.DomHelper.append(this.element(), {tag:'div', htmlString:Clipperz.PM.Strings['oneTimePasswordLoadingMessage']});
+			}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OTP.MainComponent.render - 2: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this.user(), 'loadOneTimePasswords'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OTP.MainComponent.render - 3: " + res); return res;});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OTP.MainComponent.render - 3.1: " + Clipperz.Base.serializeJSON(res.serializedData())); return res;});
+			deferredResult.addCallback(MochiKit.Base.bind(function(aResult) {
+				var	tbodyElement;
+				var	oneTimePasswordReferenceKeys;
+				var imageExtension;
+				var isThereAnyActiveOneTimePassword;
+
+				isThereAnyActiveOneTimePassword = false;
+				
+				this.element().update("");
+				Clipperz.YUI.DomHelper.append(this.element(), {tag:'div', id:'oneTimePasswordList', children:[
+					{tag:'div', id:'oneTimePasswords_header', children:[
+						{tag:'table', width:'100%', children:[
+							{tag:'tbody', children:[
+								{tag:'tr', children:[
+									{tag:'td', width:'10%', children:[
+										{tag:'div', id:this.getId('createNewOneTimePasswordButton')}
+									]},
+									{tag:'td', width:'40%', children:[
+										{tag:'div', id:this.getId('deleteSelectedOneTimePasswordButton')}
+									]},
+									{tag:'td', width:'50%', align:'right', children:[
+										{tag:'div', id:this.getId('printOneTimePasswordButton')}
+									]}
+								]}
+							]}
+						]},
+						{tag:'div', children:[
+							{tag:'ul', children:[
+								{tag:'li', children:[
+									{tag:'span', htmlString:Clipperz.PM.Strings['oneTimePasswordSelectionLink_selectLabel']}
+								]},
+								{tag:'li', children:[
+									{tag:'a', href:'#', id:this.getId('selectAllOneTimePasswords_link'), htmlString:Clipperz.PM.Strings['oneTimePasswordSelectionLink_all']}
+								]},
+								{tag:'li', children:[
+									{tag:'a', href:'#', id:this.getId('selectNoneOneTimePasswords_link'), htmlString:Clipperz.PM.Strings['oneTimePasswordSelectionLink_none']}
+								]},
+								{tag:'li', children:[
+									{tag:'a', href:'#', id:this.getId('selectUsedOneTimePasswords_link'), htmlString:Clipperz.PM.Strings['oneTimePasswordSelectionLink_used']}
+								]},
+								{tag:'li', children:[
+									{tag:'a', href:'#', id:this.getId('selectUnusedOneTimePasswords_link'), htmlString:Clipperz.PM.Strings['oneTimePasswordSelectionLink_unused']}
+								]}
+							]}
+						]}
+					]},
+					{tag:'form', id:this.getId('oneTimePasswords_form'), children:[
+						{tag:'table', cls:'oneTimePassword', cellspacing:'0', cellpadding:'2', children:[
+							{tag:'tbody', id:this.getId('oneTimePasswords_tbody'), children:[
+							]}
+						]}
+					]}
+				]});
+
+				imageExtension = (Clipperz_IEisBroken == true) ? 'gif': 'png';
+
+				tbodyElement = this.getElement('oneTimePasswords_tbody');
+				oneTimePasswordReferenceKeys = MochiKit.Base.keys(this.user().oneTimePasswordManager().oneTimePasswords()).reverse();
+				c = oneTimePasswordReferenceKeys.length;
+				if (c>0) {
+					for (i=0; i<c; i++) {
+						var otpReference;
+						var currentOTP;
+						var loginSessionInfoConfig;
+
+						imageExtension = (Clipperz_IEisBroken == true) ? 'gif': 'png';
+
+						otpReference = oneTimePasswordReferenceKeys[i];
+						currentOTP = this.user().oneTimePasswordManager().oneTimePasswords()[otpReference];
+
+						switch (currentOTP.status()) {
+							case 'USED':
+								var loginSessionInfo;
+
+								loginSessionInfo = currentOTP.connectionInfo();
+								try {
+									var ip;
+
+									ip = (currentOTP.connectionInfo()['ip'].match(/^\d{1,3}(.\d{1,3}){3}$/)) ? currentOTP.connectionInfo()['ip'] : Clipperz.PM.Strings['unknown_ip'];
+
+									loginSessionInfoConfig = [
+										{tag:'div', cls:'oneTimePassword_usageDateDescription', children:[
+											{tag:'span', cls:'value', html:Clipperz.PM.Date.getElapsedTimeDescription(currentOTP.usageDate())}
+										]},
+										{tag:'div', cls:'oneTimePassword_usageDetails', children:[
+											{tag:'img', cls:'flag', title:Clipperz.PM.Strings['countries'][ loginSessionInfo['country']], src:Clipperz.PM.Strings['icons_baseUrl'] + "/flags/" + loginSessionInfo['country'].toLowerCase() + "." +  imageExtension, width:'32', height:'32'},
+											{tag:'img', cls:'browser', title:Clipperz.PM.Strings['browsers'][ loginSessionInfo['browser']], src:Clipperz.PM.Strings['icons_baseUrl'] + "/browsers/" + loginSessionInfo['browser'].toLowerCase() + "." + imageExtension, width:'32', height:'32'},
+											{tag:'img', cls:'operatingSystem', title:Clipperz.PM.Strings['operatingSystems'][loginSessionInfo['operatingSystem']], src:Clipperz.PM.Strings['icons_baseUrl'] + "/operatingSystems/" + loginSessionInfo['operatingSystem'].toLowerCase() + "." + imageExtension, width:'32', height:'32'}
+										]},
+										{tag:'div', cls:'oneTimePassword_usageDate', html:Clipperz.PM.Date.formatDateWithTemplate(currentOTP.usageDate(), Clipperz.PM.Strings['fullDate_format'])},
+										{tag:'div', cls:'oneTimePassword_IP', children:[
+											{tag:'span', cls:'oneTimePassword_IPLabel', htmlString:Clipperz.PM.Strings['loginHistoryIPLabel']},
+											{tag:'span', cls:'oneTimePassword_IPValue', html:ip}
+										]}
+									];
+								} catch(exception) {
+									MochiKit.Logging.logWarning("an error occured while showing the One Time Password session details");
+									loginSessionInfoConfig = [];
+								}
+								break;
+							case 'DISABLED':
+								loginSessionInfoConfig = [
+									{tag:'span', cls:'disabledOneTimePassword', htmlString:Clipperz.PM.Strings['disabledOneTimePassword_warning']}
+								];
+								break;
+							case 'ACTIVE':
+							default:
+								loginSessionInfoConfig = [];
+								break;
+						}
+
+
+						if (currentOTP.isExpired() == false) {
+							isThereAnyActiveOneTimePassword = true;
+						};
+
+						
+						this.domHelper().append(tbodyElement, {tag:'tr', cls:(currentOTP.isExpired() ? 'oneTimePassword_used': 'oneTimePassword_new'), children:[
+							{tag:'td', valign:'top', children:[
+								{tag:'input', type:'checkbox', cls:'otpCheckbox', name:currentOTP.reference()}
+							]},
+							{tag:'td', valign:'top', children:[
+								{tag:'span', cls:'oneTimePassword_value', html:currentOTP.password()}
+							]},
+							{tag:'td', valign:'top', children:[
+								{tag:'div', cls:'oneTimePassword_usageStats', children:loginSessionInfoConfig}
+							]}
+						]});
+					}
+				} else {
+					this.domHelper().append(tbodyElement, {tag:'tr', children:[
+						{tag:'td', children:[
+							{tag:'div', cls:'oneTimePassword_noPasswordPresent', htmlString:Clipperz.PM.Strings['oneTimePasswordNoPasswordAvailable']}
+						]}
+					]});
+				}
+
+				new YAHOO.ext.Button(this.getDom('createNewOneTimePasswordButton'), {text:Clipperz.PM.Strings['createNewOTPButtonLabel'], handler:this.createNewOneTimePassword, scope:this});
+				this.setDeleteButton(new YAHOO.ext.Button(this.getDom('deleteSelectedOneTimePasswordButton'), {text:Clipperz.PM.Strings['deleteOTPButtonLabel'], handler:this.deleteSelectedOneTimePasswords, scope:this}));
+				this.setPrintButton(new YAHOO.ext.Button(this.getDom('printOneTimePasswordButton'), {text:Clipperz.PM.Strings['printOTPButtonLabel'], handler:this.printOneTimePasswords, scope:this}));
+
+				MochiKit.Signal.connect(this.getId('selectAllOneTimePasswords_link'),	'onclick', this, 'selectAllOneTimePasswords');
+				MochiKit.Signal.connect(this.getId('selectNoneOneTimePasswords_link'),	'onclick', this, 'selectNoneOneTimePasswords');
+				MochiKit.Signal.connect(this.getId('selectUsedOneTimePasswords_link'),	'onclick', this, 'selectUsedOneTimePasswords');
+				MochiKit.Signal.connect(this.getId('selectUnusedOneTimePasswords_link'),'onclick', this, 'selectUnusedOneTimePasswords');
+
+				MochiKit.Base.map(MochiKit.Base.bind(function(aCheckbox) {
+					MochiKit.Signal.connect(aCheckbox, 'onclick', this, 'handleCheckboxClick');
+				}, this), this.oneTimePasswordCheckboxes());
+
+				this.updateDeleteButtonStatus();
+
+				if (isThereAnyActiveOneTimePassword == true) {
+					this.printButton().enable();
+				} else {
+					this.printButton().disable();
+				}
+				
+//				Clipperz.NotificationCenter.register(null, 'oneTimePasswordAdded', this, 'render');
+				Clipperz.NotificationCenter.register(null, 'oneTimePassword_saveChanges_done', this, 'render');
+
+			}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OTP.MainComponent.render - 4: " + res); return res;});
+
+			deferredResult.callback();
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'printOneTimePasswords': function() {
+		var newWindow;
+		var activeOneTimePasswords;
+
+//MochiKit.Logging.logDebug(">>> printAllData");
+		newWindow = window.open("", "");
+		newWindow.document.write(
+"<html>" +
+"<header>" +
+"	<title>Clipperz One Time Password</title>" +
+"<style>" +
+"div.oneTimePassword_print h2 {" +
+"	font-family: monospace;" +
+"	font-weight: normal;" +
+"	padding: 10px 20px;" +
+"}" +
+"</style>" +
+"" +
+"<!--[if IE]>" +
+"<style>" +
+"</style>" +
+"<![endif]-->" +
+"" +
+"</header>" +
+"<body>" +
+"</body>" +
+"</html>"
+		);
+
+		activeOneTimePasswords = MochiKit.Base.filter(function(aOneTimePassword) {return (aOneTimePassword.isExpired() == false)}, MochiKit.Base.values(this.user().oneTimePasswordManager().oneTimePasswords()).reverse());
+
+		MochiKit.Iter.forEach(activeOneTimePasswords, MochiKit.Base.partial(function(aWindow, aOneTimePassword) {
+			MochiKit.DOM.withWindow(aWindow, MochiKit.Base.partial(function(aOneTimePassword) {
+				var newBlock;
+
+				newBlock = MochiKit.DOM.DIV({'class': 'oneTimePassword_print'},
+					MochiKit.DOM.H2(null, aOneTimePassword.password())
+				);
+				MochiKit.DOM.appendChildNodes(MochiKit.DOM.currentDocument().body, newBlock);
+			
+			}, aOneTimePassword));
+		}, newWindow));
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'generateRandomBase32OTPValue': function(aButton) {
+		var randomValue;
+		var	result;
+
+		randomValue = Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(160/8);
+		result = randomValue.toBase32String();
+		result = result.replace(/.{4}\B/g, '$&' + ' ');
+		result = result.replace(/(.{4} ){2}/g, '$&' + '- ');
+
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'createNewOneTimePassword': function() {
+		var newOneTimePassword;
+		var password;
+		
+		password = this.generateRandomBase32OTPValue();
+		newOneTimePassword = new Clipperz.PM.DataModel.OneTimePassword({
+									user:this.user(),
+									password:password
+		});
+		this.user().oneTimePasswordManager().addOneTimePassword(newOneTimePassword);
+		Clipperz.PM.Components.MessageBox.showProgressPanel(MochiKit.Base.method(newOneTimePassword, 'saveChanges'), null, this.getDom('createNewOneTimePasswordButton'));
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'oneTimePasswordCheckboxes': function() {
+		return MochiKit.DOM.getElementsByTagAndClassName('input', 'otpCheckbox', this.getId('oneTimePasswords_tbody'));
+	},
+
+	'checkedOneTimePasswordCheckboxes': function() {
+		return MochiKit.Base.filter(function(aCheckbox) {return (aCheckbox.checked == true)}, this.oneTimePasswordCheckboxes());
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'selectAllOneTimePasswords': function(anEvent) {
+		var checkboxes;
+		var i,c;
+
+		anEvent.stop();
+		checkboxes = this.oneTimePasswordCheckboxes();
+		c = checkboxes.length;
+		for (i=0; i<c; i++) {
+			checkboxes[i].checked = true;
+		}
+
+		this.updateDeleteButtonStatus();
+	},
+	
+	'selectNoneOneTimePasswords': function(anEvent) {
+		var checkboxes;
+		var i,c;
+		
+		anEvent.stop();
+		checkboxes = this.oneTimePasswordCheckboxes();
+		c = checkboxes.length;
+		for (i=0; i<c; i++) {
+			checkboxes[i].checked = false;
+		}
+
+		this.updateDeleteButtonStatus();
+	},
+
+	'selectUsedOneTimePasswords': function(anEvent) {
+		var checkboxes;
+		var oneTimePasswordManager;
+		var i,c;
+		
+		anEvent.stop();
+		oneTimePasswordManager = this.user().oneTimePasswordManager();
+		checkboxes = this.oneTimePasswordCheckboxes();
+		c = checkboxes.length;
+		for (i=0; i<c; i++) {
+			var matchingOneTimePassword;
+
+			matchingOneTimePassword = oneTimePasswordManager.oneTimePasswordWithReference(checkboxes[i].name);
+			checkboxes[i].checked = matchingOneTimePassword.isExpired();
+		}
+
+		this.updateDeleteButtonStatus();
+	},
+
+	'selectUnusedOneTimePasswords': function(anEvent) {
+		var checkboxes;
+		var oneTimePasswordManager;
+		var i,c;
+		
+		anEvent.stop();
+		oneTimePasswordManager = this.user().oneTimePasswordManager();
+		checkboxes = this.oneTimePasswordCheckboxes();
+		c = checkboxes.length;
+		for (i=0; i<c; i++) {
+			var matchingOneTimePassword;
+
+			matchingOneTimePassword = oneTimePasswordManager.oneTimePasswordWithReference(checkboxes[i].name);
+			checkboxes[i].checked = !matchingOneTimePassword.isExpired();
+		}
+
+		this.updateDeleteButtonStatus();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handleCheckboxClick': function(anEvent) {
+		this.updateDeleteButtonStatus();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'deleteSelectedOneTimePasswords': function() {
+		var deferredResult;
+		var otpToDelete;
+		var i,c;
+		
+		otpToDelete = this.checkedOneTimePasswordCheckboxes();
+		c = otpToDelete.length;
+		for (i=0; i<c; i++) {
+//MochiKit.Logging.logDebug("otp to delete: " + otpToDelete[i].name);
+			this.user().oneTimePasswordManager().deleteOneTimePasswordWithReference(otpToDelete[i].name);
+		};
+
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("ActiveOTPPanel.deleteSelectedOneTimePasswords - 0: " + res); return res;});
+		deferredResult.addCallback(Clipperz.PM.Components.MessageBox.showProgressPanel, MochiKit.Base.method(this.user().oneTimePasswordManager(), 'saveChanges'), null, null);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("ActiveOTPPanel.deleteSelectedOneTimePasswords - 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'render'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("ActiveOTPPanel.deleteSelectedOneTimePasswords - 2: " + res); return res;});
+		deferredResult.callback();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'shouldRender': function() {
+		return this._shouldRender;
+	},
+	
+	'setShouldRender': function(aValue) {
+		this._shouldRender = aValue;
+	},
+	
+	'tabSelectedHandler': function(anEvent) {
+		if ((this.shouldRender()) && (anEvent.source().selectedTab() == 'manageOTPTab')) {
+			this.render();
+			this.setShouldRender(false);
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'deleteButton': function() {
+		return this._deleteButton;
+	},
+	
+	'setDeleteButton': function(aValue) {
+		this._deleteButton = aValue;
+	},
+
+	'updateDeleteButtonStatus': function() {
+		if (this.checkedOneTimePasswordCheckboxes().length > 0) {
+			this.deleteButton().enable();
+		} else {
+			this.deleteButton().disable();
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'printButton': function() {
+		return this._printButton;
+	},
+	
+	'setPrintButton': function(aValue) {
+		this._printButton = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Panels/AccountPanel.js b/frontend/beta/js/Clipperz/PM/Components/Panels/AccountPanel.js
new file mode 100644
index 0000000..6b467d0
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Panels/AccountPanel.js
@@ -0,0 +1,784 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Panels) == 'undefined') { Clipperz.PM.Components.Panels = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Panels.AccountPanel = function(anElement, args) {
+//MochiKit.Logging.logDebug(">>> new AccountPanel");
+	args = args || {};
+
+    Clipperz.PM.Components.Panels.AccountPanel.superclass.constructor.call(this, anElement, args);
+
+	Clipperz.NotificationCenter.register(null, 'setupDone', this, 'render');
+
+	this._shouldLoadLoginHistory = true;
+	
+//	this.render();
+//MochiKit.Logging.logDebug("<<< new AccountPanel");
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Panels.AccountPanel, Clipperz.PM.Components.Panels.BasePanel, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.AccountPanel component";
+	},
+
+	//-------------------------------------------------------------------------
+ 
+	'render': function() {
+		var errorMessageActor;
+		var	changePasswordButton;
+		var deleteAccountButton;
+
+try {
+//MochiKit.Logging.logDebug(">>> AccountPanel.render");
+		Clipperz.NotificationCenter.unregister(this);
+		MochiKit.Signal.disconnectAllTo(this);
+
+		this.element().update("");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'table', border:'0', cellspacing:'0', cellpadding:'0', children:[
+			{tag:'tbody', children:[
+				{tag:'tr', children:[
+					{tag:'td', valign:'top', width:'200', children:[
+						{tag:'ul', id:"accountSubMenu", cls:'subMenu', children:[
+							{tag:'li', id:'changePassphraseTab', htmlString:Clipperz.PM.Strings['changePasswordTabLabel']},
+							{tag:'li', id:'manageOTPTab', htmlString:Clipperz.PM.Strings['manageOTPTabLabel']},
+							{tag:'li', id:'accountPreferencesTab', htmlString:Clipperz.PM.Strings['accountPreferencesLabel']},
+							{tag:'li', id:'loginHistoryTab', htmlString:Clipperz.PM.Strings['accountLoginHistoryLabel']},
+							{tag:'li', id:'deleteAccountTab', htmlString:Clipperz.PM.Strings['deleteAccountTabLabel']}
+//							{tag:'li', id:'paidAccountTab'), htmlString:Clipperz.PM.Strings['paidAccountTabLabel']}
+						]}
+					]},
+					{tag:'td', valign:'top', children:[
+						{tag:'ul', cls:'clipperzTabPanels', children:[
+							{tag:'li', id:this.getId('changePassphrasePanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['changePasswordTabTitle']},
+									{tag:'div', cls:'panelBody', id:'changePassphraseBlock', children:[
+										{tag:'form', id:this.getId('changePassphraseForm'), children:[
+											{tag:'h5', cls:'errorMessage', id:this.getId('changePassphrase_errorMessage')},
+											{tag:'table', cls:'panelBody', children:[
+												{tag:'tr', children:[
+													{tag:'td', children:[
+														{tag:'span', cls:'formLabel', htmlString:Clipperz.PM.Strings['changePasswordFormUsernameLabel']}
+													]},
+													{tag:'td', children:[
+														{tag:'input', type:'text', name:'username', id:this.getId('changePassphrase_username')}
+													]}
+												]},
+												{tag:'tr', children:[
+													{tag:'td', children:[
+														{tag:'span', cls:'formLabel', htmlString:Clipperz.PM.Strings['changePasswordFormOldPassphraseLabel']}
+													]},
+													{tag:'td', children:[
+														{tag:'input', type:'password', name:'oldPassphrase', id:this.getId('changePassphrase_oldPassphrase')}
+													]}
+												]},
+												{tag:'tr', children:[
+													{tag:'td', children:[
+														{tag:'span', cls:'formLabel', htmlString:Clipperz.PM.Strings['changePasswordFormNewPassphraseLabel']}
+													]},
+													{tag:'td', children:[
+														{tag:'input', type:'password', name:'newPassphrase', id:this.getId('changePassphrase_newPassphrase')}
+													]}
+												]},
+												{tag:'tr', children:[
+													{tag:'td', children:[
+														{tag:'span', cls:'formLabel', htmlString:Clipperz.PM.Strings['changePasswordFormRetypePassphraseLabel']}
+													]},
+													{tag:'td', children:[
+														{tag:'input', type:'password', name:'renewPassphrase', id:this.getId('changePassphrase_renewPassphrase')}
+													]}
+												]},
+												{tag:'tr', children:[
+													{tag:'td', align:'right', children:[
+														{tag:'input', type:'checkbox', id:this.getId('changePassphrase_safetyCheck')}
+													]},
+													{tag:'td', children:[
+														{tag:'span', htmlString:Clipperz.PM.Strings['changePasswordFormSafetyCheckboxLabel']}
+													]}
+												]}
+											]},
+											{tag:'div', cls:'clipperzSubPanelButtonBox', children:[
+												{tag:'div', id:this.getId('changePassphraseButton')}
+											]}
+										]}
+									]}
+								]}
+							]},
+							{tag:'li', id:this.getId('manageOTPPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['manageOTPTabTitle']},
+									{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['manageOTPTabDescription']},
+									{tag:'div', id:'OTPComponent'}
+								]}
+							]},
+							{tag:'li', id:this.getId('accountPreferencesPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['accountPreferencesTabTitle']},
+									{tag:'div', cls:'panelBody', id:this.getId('preferencesPanelBody')}
+								]}
+							]},
+							{tag:'li', id:this.getId('loginHistoryAccountPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['loginHistoryTabTitle']},
+									{tag:'div', cls:'panelBody', id:'loginHistoryAccountBlock'}
+								]}
+							]},
+							{tag:'li', id:this.getId('deleteAccountPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['deleteAccountTabTitle']},
+
+									{tag:'div', cls:'panelBody', id:'deleteAccountBlock', children:[
+										{tag:'form', id:this.getId('deleteAccountForm'), children:[
+											{tag:'h5', cls:'errorMessage', id:this.getId('deleteAccount_errorMessage')},
+											{tag:'table', cls:'panelBody', children:[
+												{tag:'tr', children:[
+													{tag:'td', children:[
+														{tag:'span', cls:'formLabel', htmlString:Clipperz.PM.Strings['deleteAccountFormUsernameLabel']}
+													]},
+													{tag:'td', children:[
+														{tag:'input', type:'text', name:'username', id:this.getId('deleteAccount_username')}
+													]}
+												]},
+												{tag:'tr', children:[
+													{tag:'td', children:[
+														{tag:'span', cls:'formLabel', htmlString:Clipperz.PM.Strings['deleteAccountFormPassphraseLabel']}
+													]},
+													{tag:'td', children:[
+														{tag:'input', type:'password', name:'passphrase', id:this.getId('deleteAccount_passphrase')}
+													]}
+												]},
+												{tag:'tr', children:[
+													{tag:'td', align:'right', children:[
+														{tag:'input', type:'checkbox', id:this.getId('deleteAccount_safetyCheck')}
+													]},
+													{tag:'td', children:[
+														{tag:'span', htmlString:Clipperz.PM.Strings['deleteAccountFormSafetyCheckboxLabel']}
+													]}
+												]}
+											]},
+											{tag:'div', cls:'clipperzSubPanelButtonBox', children:[
+												{tag:'div', id:this.getId('deleteAccountButton')}
+											]}
+										]}
+									]}
+								]}
+							]}
+/*							
+							{tag:'li', id:this.getId('paidAccountPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['upgradeAccountTabTitle']},
+									{tag:'div', htmlString:Clipperz.PM.Strings['comingSoon']}
+								]}
+							]}
+*/
+						]}
+					]}
+				]}
+			]}
+		]});
+		
+//MochiKit.Logging.logDebug("--- AccountPanel.render - 1");
+		MochiKit.Signal.connect(this.getId('changePassphraseForm'), 'onkeydown', this, 'onkeydown');
+		errorMessageActor = this.getActor('changePassphrase_errorMessage');
+		errorMessageActor.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+		errorMessageActor.update("---");
+		errorMessageActor.hide();
+		changePasswordButton = new YAHOO.ext.Button(this.getDom('changePassphraseButton'), {text:Clipperz.PM.Strings['changePasswordFormSubmitLabel'], handler:this.doChangePassphrase, scope:this});
+
+//MochiKit.Logging.logDebug("--- AccountPanel.render - 2");
+		
+		MochiKit.Signal.connect(this.getId('deleteAccountForm'), 'onkeydown', this, 'onkeydown');
+		errorMessageActor = this.getActor('deleteAccount_errorMessage');
+		errorMessageActor.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+		errorMessageActor.update(Clipperz.PM.Strings['deleteAccountFormEmptyErrorMessage']);
+		errorMessageActor.hide();
+		deleteAccountButton = new YAHOO.ext.Button(this.getDom('deleteAccountButton'), {text:Clipperz.PM.Strings['deleteAccountFormSubmitLabel'], handler:this.doDeleteAccount, scope:this});
+//MochiKit.Logging.logDebug("--- AccountPanel.render - 5");
+
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+			this.getElement('changePassphraseForm').addClass('read-only');
+//			this.getElement('accountPreferencesForm').addClass('read-only');
+			this.getElement('deleteAccountForm').addClass('read-only');
+			changePasswordButton.disable();
+			deleteAccountButton.disable();
+		}
+//MochiKit.Logging.logDebug("--- AccountPanel.render - 6");
+
+		new Clipperz.PM.Components.PasswordEntropyDisplay(this.getElement('changePassphrase_oldPassphrase'));
+		new Clipperz.PM.Components.PasswordEntropyDisplay(this.getElement('changePassphrase_newPassphrase'));
+		
+		new Clipperz.PM.Components.OTP.MainComponent(YAHOO.ext.Element.get('OTPComponent'), {user:this.user()});
+		
+		this.tabPanelController().setUp();
+		Clipperz.NotificationCenter.register(null, 'tabSelected', this, 'tabSelectedHandler');
+		Clipperz.NotificationCenter.register(null, 'updatedPreferences', this, 'renderPreferences');
+		Clipperz.NotificationCenter.register(null, 'switchLanguage', this, 'switchLanguageHandler');
+//MochiKit.Logging.logDebug("<<< AccountPanel.render");
+
+} catch(exception) {
+	MochiKit.Logging.logError("### " + exception);
+	throw exception;
+}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'tabPanelController': function() {
+		if (this._tabPanelController == null) {
+			var tabPanelControllerConfig;
+			
+			tabPanelControllerConfig = {}
+			tabPanelControllerConfig['changePassphraseTab'] = this.getId('changePassphrasePanel');
+			tabPanelControllerConfig['manageOTPTab'] = this.getId('manageOTPPanel');
+			tabPanelControllerConfig['accountPreferencesTab'] = this.getId('accountPreferencesPanel');
+			tabPanelControllerConfig['loginHistoryTab'] = this.getId('loginHistoryAccountPanel');
+			tabPanelControllerConfig['deleteAccountTab'] = this.getId('deleteAccountPanel');
+//			tabPanelControllerConfig['paidAccountTab'] = this.getId('paidAccountPanel');
+
+			this._tabPanelController = new Clipperz.PM.Components.TabPanel.TabPanelController({
+												name:'accountTabPanel',
+												config:tabPanelControllerConfig,
+												selectedTab:'changePassphraseTab'
+			});
+		}
+		
+		return this._tabPanelController;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'doChangePassphrase': function() {
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly() == false) {
+			var	username;
+			var	oldPassphrase;
+			var newPassphrase;
+			var renewPassphrase;
+			var safetyCheck;
+			var	areThereAnyErrors;
+			var errorMessageActor;
+
+			errorMessageActor = this.getActor('changePassphrase_errorMessage');
+
+			areThereAnyErrors = false;
+			username = this.getDom('changePassphrase_username').value;
+			oldPassphrase= this.getDom('changePassphrase_oldPassphrase').value;
+			newPassphrase= this.getDom('changePassphrase_newPassphrase').value;
+			renewPassphrase= this.getDom('changePassphrase_renewPassphrase').value;
+			safetyCheck = this.getDom('changePassphrase_safetyCheck').checked;
+
+			if (this.user().username() != username) {
+				this.showFormErrorMessageAnimation(errorMessageActor, Clipperz.PM.Strings['changePasswordFormWrongUsernameWarning']);
+				this.getElement('changePassphrase_username').focus().dom.select();
+				areThereAnyErrors = true;
+			} else if (this.user().passphrase() != oldPassphrase) {
+				this.showFormErrorMessageAnimation(errorMessageActor, Clipperz.PM.Strings['changePasswordFormWrongPassphraseWarning']);
+				this.getElement('changePassphrase_oldPassphrase').focus().dom.select();
+				areThereAnyErrors = true;
+			} else if (newPassphrase != renewPassphrase) {
+				this.showFormErrorMessageAnimation(errorMessageActor, Clipperz.PM.Strings['changePasswordFormWrongRetypePassphraseWarning']);
+				this.getElement('changePassphrase_renewPassphrase').focus().dom.select();
+				areThereAnyErrors = true;
+			} else if (safetyCheck != true) {
+				this.showFormErrorMessageAnimation(errorMessageActor, Clipperz.PM.Strings['changePasswordFormSafetyCheckWarning']);
+				this.getElement('changePassphrase_safetyCheck').focus();
+				areThereAnyErrors = true;
+			}
+
+			if (areThereAnyErrors == false) {
+				errorMessageActor.hide();
+				this.doChangePassphraseWithUsernameAndPassphrase(username, newPassphrase);
+			}
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'doChangePassphraseWithUsernameAndPassphrase': function(anUsername, aPassphrase) {
+		var deferredResult;
+
+//MochiKit.Logging.logDebug(">>> AccountPanel.doChangePassphraseWithUsernameAndPassphrase - this.user: " + this.user());
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug(" AccountPanel.doChangePassphraseWithUsernameAndPassphrase 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'deferredShow'),
+			{
+				title:Clipperz.PM.Strings['changePasswordFormProgressDialogTitle'],
+				text:Clipperz.PM.Strings['changePasswordFormProgressDialogEmptyText'],
+				width:240,
+				showProgressBar:true,
+				showCloseButton:false,
+				steps:4
+			},
+			this.getDom('changePassphraseButton')
+		);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug(" AccountPanel.doChangePassphraseWithUsernameAndPassphrase 2: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.user(), 'changeCredentials'), anUsername, aPassphrase);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug(" AccountPanel.doChangePassphraseWithUsernameAndPassphrase 3: " + res); return res;});
+		deferredResult.addCallback(function() {
+			Clipperz.PM.Components.MessageBox().update({
+				title:Clipperz.PM.Strings['changePasswordFormProgressDialogConnectedMessageTitle'],
+				text:Clipperz.PM.Strings['changePasswordFormProgressDialogConnectedMessageText'],
+				/*showProgressBar:false,*/
+				step:'next'
+			});
+		});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug(" AccountPanel.doChangePassphraseWithUsernameAndPassphrase 4: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Async.wait, 1);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug(" AccountPanel.doChangePassphraseWithUsernameAndPassphrase 5: " + res); return res;});
+		deferredResult.addCallback(function(anAccountPanel, res) {
+			Clipperz.PM.Components.MessageBox().hide(YAHOO.ext.Element.get('main'));
+			
+			anAccountPanel.getDom('changePassphrase_username').value = "";
+			anAccountPanel.getDom('changePassphrase_oldPassphrase').value = "";
+			anAccountPanel.getElement('changePassphrase_oldPassphrase').focus();
+			anAccountPanel.getDom('changePassphrase_newPassphrase').value = "";
+			anAccountPanel.getElement('changePassphrase_newPassphrase').focus();
+			anAccountPanel.getDom('changePassphrase_renewPassphrase').value = "";
+			anAccountPanel.getDom('changePassphrase_safetyCheck').checked = false;
+
+			anAccountPanel.getElement('changePassphrase_username').focus();
+			return res;
+		}, this);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug(" AccountPanel.doChangePassphraseWithUsernameAndPassphrase 6: " + res); return res;});
+		deferredResult.addErrback(function() {
+			Clipperz.PM.Components.MessageBox().update({
+				title:Clipperz.PM.Strings['changePasswordFormProgressDialogErrorMessageTitle'],
+				text:Clipperz.PM.Strings['changePasswordFormProgressDialogErrorMessageText'],
+				buttons:{'ok':"close"}
+			});
+		});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug(" AccountPanel.doChangePassphraseWithUsernameAndPassphrase 7: " + res); return res;});
+		deferredResult.callback();
+
+//MochiKit.Logging.logDebug("<<< AccountPanel.doChangePassphraseWithUsernameAndPassphrase");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'doDeleteAccount': function() {
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly() == false) {
+			var	username;
+			var	passphrase;
+			var safetyCheck;
+			var	areThereAnyErrors;
+			var errorMessageActor;
+		
+			errorMessageActor = this.getActor('deleteAccount_errorMessage');
+
+			areThereAnyErrors = false;
+			username = this.getDom('deleteAccount_username').value;
+			passphrase= this.getDom('deleteAccount_passphrase').value;
+			safetyCheck = this.getDom('deleteAccount_safetyCheck').checked;
+
+			if (this.user().username() != username) {
+				this.showFormErrorMessageAnimation(errorMessageActor, Clipperz.PM.Strings['deleteAccountFormWrongUsernameWarning']);
+				this.getElement('deleteAccount_username').focus().dom.select();
+				areThereAnyErrors = true;
+			} else if (this.user().passphrase() != passphrase) {
+				this.showFormErrorMessageAnimation(errorMessageActor, Clipperz.PM.Strings['deleteAccountFormWrongPassphraseWarning']);
+				this.getElement('deleteAccount_passphrase').focus().dom.select();
+				areThereAnyErrors = true;
+			} else if (safetyCheck != true) {
+				this.showFormErrorMessageAnimation(errorMessageActor, Clipperz.PM.Strings['deleteAccountFormSafetyCheckWarning']);
+				this.getElement('deleteAccount_safetyCheck').focus();
+				areThereAnyErrors = true;
+			}
+
+			if (areThereAnyErrors == false) {
+				var deferred;
+			
+				deferred = new MochiKit.Async.Deferred();
+				errorMessageActor.hide();
+
+				deferred.addCallback(function() {
+					var deferredResult;
+
+					//	TODO: if the form is submitted with the return key, the confirmation dialog is skipped!?
+					deferredResult = new MochiKit.Async.Deferred();
+					Clipperz.PM.Components.MessageBox().deferredShow({
+						title:Clipperz.PM.Strings['accountPanelDeletingAccountPanelConfirmationTitle'],
+						text:Clipperz.PM.Strings['accountPanelDeleteAccountPanelConfirmationText'],
+						width:240,
+						showProgressBar:false,
+						showCloseButton:false,
+						buttons:{
+							'yes':Clipperz.PM.Strings['accountPanelDeleteAccountPanelConfirmButtonLabel'],
+							'no':Clipperz.PM.Strings['accountPanelDeleteAccountPanelDenyButtonLabel']
+	 					},
+						fn:MochiKit.Base.partial(function(aDeferred, aResult) {
+							if (aResult == 'yes') {
+								aDeferred.callback(aResult);
+							} else {
+								aDeferred.errback(aResult);
+							}
+						}, deferredResult)
+					});
+				
+					return deferredResult;
+				});
+				deferred.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'deferredShow'),
+					{
+						title:Clipperz.PM.Strings['accountPanelDeletingAccountPanelProgressTitle'],
+						text:Clipperz.PM.Strings['accountPanelDeletingAccountPanelProgressText'],
+						width:240,
+						showProgressBar:true,
+						showCloseButton:false
+					}
+				);
+				deferred.addCallback(MochiKit.Base.method(this.user(), 'deleteAccountAction'));
+				deferred.addCallback(Clipperz.PM.exit, 'accountDeleted.html');
+				deferred.addErrback(function(res) {
+					alert(res);
+				})
+				deferred.callback();
+			}
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'showFormErrorMessageAnimation': function(anActor, anErrorMessage, aCallback) {
+		anActor.update(anErrorMessage);
+		anActor.show(true);
+		anActor.play(aCallback);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'onkeydown': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> onkeydown - " + anEvent.src().id);
+		if (anEvent.key().code == 13) {
+			anEvent.stop();
+
+			if (anEvent.src() == this.getDom('changePassphraseForm')) {
+				this.doChangePassphrase();
+			} else if (anEvent.src() == this.getDom('deleteAccountForm')) {
+				this.doDeleteAccount();
+			} else {
+			}
+			
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'selectSelectedLanguageOption': function() {
+		var	userSelectedLanguage;
+
+		userSelectedLanguage = this.user().preferences().preferredLanguage() || "default";
+		MochiKit.Base.filter(function(anOption) {return (anOption.value == userSelectedLanguage)}, this.getDom('languageSelector').childNodes)[0].selected = true;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'doSaveUserPreferences': function() {
+		var selectedLanguage;
+		var showDonationReminderDialog;
+//		var disableUnsecureFaviconLoadingForIE;
+		
+//MochiKit.Logging.logDebug(">>> AccountPanel.doSaveUserPreferences");
+		selectedLanguage = this.getDom('languageSelector').value;
+		if (selectedLanguage == "default") {
+			selectedLanguage = null;
+		}
+		this.user().preferences().setPreferredLanguage(selectedLanguage);
+
+		showDonationReminderDialog = this.getDom('showDonationReminderCheckbox').checked;
+		this.user().preferences().setShouldShowDonationPanel(showDonationReminderDialog);
+
+//		disableUnsecureFaviconLoadingForIE = this.getDom('disableFaviconForIECheckbox').checked;
+//		this.user().preferences().setDisableUnsecureFaviconLoadingForIE(disableUnsecureFaviconLoadingForIE);
+		
+		this.user().preferences().saveChanges(this.getDom('saveUserPreferences'));
+	},
+	
+	'doCancelUserPreferences': function() {
+		this.renderPreferences();
+	},
+
+//	'switchLanguage': function(anEvent) {
+//		Clipperz.PM.Strings.Languages.setSelectedLanguage(anEvent.src().value);
+//	},
+
+	//-------------------------------------------------------------------------
+
+	'renderLoginHistory': function() {
+		var element;
+		
+//MochiKit.Logging.logDebug(">>> AccountPanel.renderLoginHistory");
+		element = YAHOO.ext.Element.get('loginHistoryAccountBlock');
+
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+			element.update("");
+			this.domHelper().append(element, {tag:'div', cls:'loginHistoryReadOnlyMessage', htmlString:Clipperz.PM.Strings['loginHistoryReadOnlyMessage']});
+		} else {
+			var deferredResult;
+			
+			deferredResult = new MochiKit.Async.Deferred();
+			deferredResult.addCallback(MochiKit.Base.bind(function(anElement) {
+				anElement.update("");
+				Clipperz.YUI.DomHelper.append(anElement, {tag:'div', cls:'loadingMessage', htmlString:Clipperz.PM.Strings['loginHistoryLoadingMessage']});
+			}, this), element);
+			deferredResult.addCallback(MochiKit.Base.method(this.user(), 'loadLoginHistory'));
+			deferredResult.addCallback(MochiKit.Base.bind(function(anElement, aResult) {
+				var loginListItems;
+				var tBodyElement;
+				var imageExtension;
+				var now;
+				var i, c;
+
+				loginListItems = aResult;
+//MochiKit.Logging.logDebug("=== loginListItems: " + Clipperz.Base.serializeJSON(loginListItems));
+				imageExtension = (Clipperz_IEisBroken == true) ? 'gif': 'png';
+
+				now = new Date();
+				anElement.update("");
+				Clipperz.YUI.DomHelper.append(anElement, {tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['loginHistoryLoadedMessage']});
+				Clipperz.YUI.DomHelper.append(anElement, {tag:'table', id:'loginHistoryTable', cellspacing:'0', cellpadding:'2', border:'0', children:[
+					{tag:'tbody', id:this.getId('loginHistoryTBody'), children:[]}
+				]});
+//#				Clipperz.YUI.DomHelper.append(anElement, {tag:'div', id:'loginHistoryFooter', children:[
+				Clipperz.YUI.DomHelper.append(anElement, {tag:'div', cls:'clipperzSubPanelButtonBox', children:[
+					{tag:'div', id:this.getId('reloadHistoryButton')}
+				]});
+				
+				new YAHOO.ext.Button(this.getDom('reloadHistoryButton'), {text:Clipperz.PM.Strings['loginHistoryReloadButtonLabel'], handler:this.reloadHistory, scope:this});
+				
+				tBodyElement = this.getElement('loginHistoryTBody');
+				c = loginListItems.length;
+				for (i=0; i<c; i++) {
+					var ip;
+					var date;
+					var mainText;
+
+					date = Clipperz.PM.Date.parseDateWithUTCFormat(loginListItems[i]['date']);
+
+					if (loginListItems[i]['isCurrent'] === true) {
+						mainText ={tag:'div', cls:'currentSession', htmlString:Clipperz.PM.Strings['loginHistoryCurrentSessionText']}
+					} else {
+						mainText = {tag:'div', cls:'elapsedTime', html:Clipperz.PM.Date.getElapsedTimeDescription(date)}
+					}
+					
+					if (loginListItems[i]['connectionType'] == "ONE_TIME_PASSPHRASE") {
+						optionalInfo = [
+							{tag:'span', html:"OTP"}
+						];
+					} else {
+						optionalInfo = [];
+					}
+					
+					ip = (loginListItems[i]['ip'].match(/^\d{1,3}(.\d{1,3}){3}$/)) ? loginListItems[i]['ip'] : Clipperz.PM.Strings['unknown_ip'];
+					Clipperz.YUI.DomHelper.append(tBodyElement, {tag:'tr', children:[
+						{tag:'td', cls:'loginHistoryValues', valign:'top', children:[
+							mainText,
+							{tag:'div', cls:'fullDate', html:Clipperz.PM.Date.formatDateWithTemplate(date, Clipperz.PM.Strings['fullDate_format'])},
+							{tag:'div', cls:'loginHistoryIP', children:[
+								{tag:'span', cls:'loginHistoryIPLabel', htmlString:Clipperz.PM.Strings['loginHistoryIPLabel']},
+								{tag:'span', cls:'loginHistoryIPValue', html:ip}
+							]}
+						]},
+						{tag:'td', cls:'loginHistoryCountry', valign:'top', children:optionalInfo},
+						{tag:'td', cls:'loginHistoryCountry', valign:'top', align:'center', children:[
+							{tag:'img', title:Clipperz.PM.Strings['countries'][loginListItems[i]['country']], cls:'flag', src:Clipperz.PM.Strings['icons_baseUrl'] + "/flags/" + loginListItems[i]['country'].toLowerCase() + "." +  imageExtension, width:'32', height:'32'}
+//							{tag:'span', cls:'label', htmlString:Clipperz.PM.Strings['countries'][loginListItems[i]['country']]}
+						]},
+						{tag:'td', cls:'loginHistoryBrowser', valign:'top', align:'center', children:[
+							{tag:'img', title:Clipperz.PM.Strings['browsers'][loginListItems[i]['browser']], cls:'browser', src:Clipperz.PM.Strings['icons_baseUrl'] + "/browsers/" + loginListItems[i]['browser'].toLowerCase() + "." + imageExtension, width:'32', height:'32'}
+//							{tag:'span', cls:'label', htmlString:Clipperz.PM.Strings['browsers'][loginListItems[i]['browser']]}
+						]},
+						{tag:'td', cls:'loginHistoryOperatingSystem', valign:'top', align:'center', children:[
+							{tag:'img', title:Clipperz.PM.Strings['operatingSystems'][loginListItems[i]['operatingSystem']], cls:'operatingSystem', src:Clipperz.PM.Strings['icons_baseUrl'] + "/operatingSystems/" + loginListItems[i]['operatingSystem'].toLowerCase() + "." + imageExtension, width:'32', height:'32'}
+//							{tag:'span', cls:'label', htmlString:Clipperz.PM.Strings['operatingSystems'][loginListItems[i]['operatingSystem']]}
+						]}
+					]});
+				}
+
+				Clipperz.Style.applyZebraStylesToTable('loginHistoryTable');
+			}, this), element);
+			
+			deferredResult.callback();
+		}
+//MochiKit.Logging.logDebug("<<< AccountPanel.renderLoginHistory");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderPreferences': function() {
+		var saveUserPreferencesButton;
+		var cancelUserPreferencesButton;
+		var preferencedPanelBodyElement;
+		
+		preferencedPanelBodyElement = this.getElement('preferencesPanelBody');
+		
+		preferencedPanelBodyElement.update("");
+		Clipperz.YUI.DomHelper.append(preferencedPanelBodyElement,
+			{tag:'form', id:this.getId('accountPreferencesForm'), children:[
+				{tag:'table', cls:'panelBody', children:[
+					{tag:'tr', cls:'openPreferenceBlock', children:[
+						{tag:'td', children:[
+							{tag:'div', cls:'preferenceBlockTitle', htmlString:Clipperz.PM.Strings['accountPreferencesLanguageTitle']},
+							{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['accountPreferencesLanguageDescription']},
+							{tag:'div', cls:'panelDescription', children:[
+								{tag:'select',
+								 	id:this.getId('languageSelector'),
+									children:MochiKit.Base.concat([{tag:'option', value:"default", html:"---"}], Clipperz.PM.Strings['loginPanelSwitchLanguageSelectOptions'])
+								}
+							]}
+						]}
+					]},
+					{tag:'tr', cls:'openPreferenceBlock', children:[
+						{tag:'td', children:[
+							{tag:'div', cls:'preferenceBlockTitle', htmlString:Clipperz.PM.Strings['showDonationReminderPanelTitle']},
+							{tag:'table', cellpadding:'0', cellspacing:'0', children:[
+								{tag:'tbody', children:[
+									{tag:'tr', children:[
+										{tag:'td', valign:'top', children:[
+											{tag:'div', cls:'panelDescription', children:[
+												{tag:'input', type:'checkbox', id:this.getId('showDonationReminderCheckbox')}
+											]}
+										]},
+										{tag:'td', valign:'top', children:[
+											{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['showDonationReminderPanelDescription']}
+										]}
+									]}
+								]}
+							]}
+						]}
+					]}	//,
+/*
+					{tag:'tr', cls:'openPreferenceBlock', children:[
+						{tag:'td', children:[
+							{tag:'div', cls:'preferenceBlockTitle', htmlString:Clipperz.PM.Strings['disableFaviconForIETitle']},
+							{tag:'table', cellpadding:'0', cellspacing:'0', children:[
+								{tag:'tbody', children:[
+									{tag:'tr', children:[
+										{tag:'td', valign:'top', children:[
+											{tag:'div', cls:'panelDescription', children:[
+												{tag:'input', type:'checkbox', id:this.getId('disableFaviconForIECheckbox')}
+											]}
+										]},
+										{tag:'td', valign:'top', children:[
+											{tag:'div', cls:'panelDescription', children:Clipperz.PM.Strings['disableFaviconForIEDescriptionConfig']}
+										]}
+									]}
+								]}
+							]}
+						]}
+					]},
+*/
+			//		{tag:'tr', cls:'openPreferenceBlock', children:[
+			//			{tag:'td', children:[
+			//				{tag:'div', cls:'preferenceBlockTitle', htmlString:Clipperz.PM.Strings['accountPreferencesInterfaceTitle']},
+			//				{tag:'div', cls:'panelDescription', children:Clipperz.PM.Strings['accountPreferencesInterfaceDescriptionConfig']}
+			//			]}
+			//		]}
+				]},
+				{tag:'div', cls:'clipperzSubPanelButtonBox', children:[
+					{tag:'table', border:'0', cellspacing:'0', cellpadding:'0', children:[
+						{tag:'tbody', children:[
+							{tag:'tr', children:[
+								{tag:'td', width:'100', align:'right', cls:'newRecordPanelButtonTD', children:[
+									{tag:'div', id:this.getId('saveUserPreferences')}
+								]},
+								{tag:'td', width:'10', html:"&nbsp;"},
+								{tag:'td', cls:'newRecordPanelButtonTD', children:[
+									{tag:'div', id:this.getId('cancelUserPreferences')}
+								]}
+							]}
+						]}
+					]}
+				]}
+			]}		
+		);
+
+		this.selectSelectedLanguageOption();
+		if (this.user().preferences().shouldShowDonationPanel()) {
+			this.getDom('showDonationReminderCheckbox').checked = true;
+		}
+//		if (this.user().preferences().disableUnsecureFaviconLoadingForIE()) {
+//			this.getDom('disableFaviconForIECheckbox').checked = true;
+//		}
+		
+//MochiKit.Logging.logDebug("--- AccountPanel.render - 3");
+//#		saveUserPreferencesButton = new YAHOO.ext.Button(this.getDom('saveUserPreferences'), {text:Clipperz.PM.Strings['saveUserPreferencesFormSubmitLabel'], handler:this.doSaveUserPreferences, scope:this});
+		saveUserPreferencesButton = new YAHOO.ext.Button(this.getDom('saveUserPreferences'), {text:'-----------------', handler:this.doSaveUserPreferences, scope:this});
+		saveUserPreferencesButton.setText(Clipperz.PM.Strings['saveUserPreferencesFormSubmitLabel']);
+//#		cancelUserPreferencesButton = new YAHOO.ext.Button(this.getDom('cancelUserPreferences'), {text:Clipperz.PM.Strings['cancelUserPreferencesFormSubmitLabel'], handler:this.doCancelUserPreferences, scope:this});
+		cancelUserPreferencesButton = new YAHOO.ext.Button(this.getDom('cancelUserPreferences'), {text:'-----------------', handler:this.doCancelUserPreferences, scope:this});
+		cancelUserPreferencesButton.setText(Clipperz.PM.Strings['cancelUserPreferencesFormSubmitLabel']);
+//MochiKit.Logging.logDebug("--- AccountPanel.render - 4");
+
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+			this.getElement('accountPreferencesForm').addClass('read-only');
+			saveUserPreferencesButton.disable();
+			cancelUserPreferencesButton.disable();
+		}
+
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'reloadHistory': function() {
+		this.setShouldLoadLoginHistory(true);
+		this.renderLoginHistory();
+	},
+	
+	'shouldLoadLoginHistory': function() {
+		return this._shouldLoadLoginHistory;
+	},
+	
+	'setShouldLoadLoginHistory': function(aValue) {
+		this._shouldLoadLoginHistory = aValue;
+	},
+	
+	'tabSelectedHandler': function(anEvent) {
+		if (anEvent.parameters() == 'accountPreferencesTab') {
+			this.renderPreferences();
+		}
+
+		if ((this.shouldLoadLoginHistory()) && (anEvent.parameters() == 'loginHistoryTab')) {
+			this.renderLoginHistory();
+			this.setShouldLoadLoginHistory(false);
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+	
diff --git a/frontend/beta/js/Clipperz/PM/Components/Panels/BasePanel.js b/frontend/beta/js/Clipperz/PM/Components/Panels/BasePanel.js
new file mode 100644
index 0000000..bf60f45
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Panels/BasePanel.js
@@ -0,0 +1,96 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Panels) == 'undefined') { Clipperz.PM.Components.Panels = {}; }
+
+//var _Clipperz_PM_Components_Panels_base_id_ = 0;
+
+//#############################################################################
+
+Clipperz.PM.Components.Panels.BasePanel = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Panels.BasePanel.superclass.constructor.call(this, anElement, args);
+	
+	this._user = args.user || null;
+	this._delegate = args.delegate || null;
+	this._tabPanelController = null;
+//	Clipperz.NotificationCenter.register(null, 'switchLanguage', this, 'switchLanguageHandler');
+
+//	this._ids = {};
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Panels.BasePanel, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Panels.BasePanel component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	'setUser': function(aValue) {
+		this._user = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'delegate': function() {
+		return this._delegate;
+	},
+	
+	'setDelegate': function(aValue) {
+		this._delegate = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'tabPanelController': function() {
+		return this._tabPanelController;
+	},
+	
+	'switchLanguageHandler': function() {
+//MochiKit.Logging.logDebug(">>> BasePanel.switchLanguageHandler [" + this.toString() + "]");
+		this.render();
+//MochiKit.Logging.logDebug("<<< BasePanel.switchLanguageHandler [" + this.toString() + "]");
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
diff --git a/frontend/beta/js/Clipperz/PM/Components/Panels/ContactsPanel.js b/frontend/beta/js/Clipperz/PM/Components/Panels/ContactsPanel.js
new file mode 100644
index 0000000..f0eb9c8
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Panels/ContactsPanel.js
@@ -0,0 +1,105 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Panels) == 'undefined') { Clipperz.PM.Components.Panels = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Panels.ContactsPanel = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Panels.ContactsPanel.superclass.constructor.call(this, anElement, args);
+
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Panels.ContactsPanel, Clipperz.PM.Components.Panels.BasePanel, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.ContactsPanel component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//		var tabPanelControllerConfig;
+
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'table', border:'0', cellspacing:'0', cellpadding:'0', children:[
+			{tag:'tbody', children:[
+				{tag:'tr', children:[
+					{tag:'td', valign:'top', width:'200', children:[
+						{tag:'ul', id:"dataSubMenu", cls:'subMenu', children:[
+							{tag:'li', id:this.getId('contacts'), htmlString:Clipperz.PM.Strings['contactsTabLabel']},
+						]}
+					]},
+					{tag:'td', valign:'top', children:[
+						{tag:'ul', cls:'clipperzTabPanels', children:[
+							{tag:'li', id:this.getId('contactsPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['contactsTabTitle']},
+									{tag:'div', htmlString:Clipperz.PM.Strings['comingSoon']}
+								]}
+							]}
+						]}
+					]}
+				]}
+			]}
+		]});
+
+//		tabPanelControllerConfig = {}
+//		tabPanelControllerConfig[this.getId('contacts')] = this.getId('contactsPanel');
+//		new Clipperz.PM.Components.TabPanel.TabPanelController({ config:tabPanelControllerConfig, selectedTab:this.getId('contacts') });
+		this.tabPanelController().setUp();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'tabPanelController': function() {
+		if (this._tabPanelController == null) {
+			var tabPanelControllerConfig;
+			
+			tabPanelControllerConfig = {}
+			tabPanelControllerConfig[this.getId('contacts')] = this.getId('contactsPanel');
+			this._tabPanelController = new Clipperz.PM.Components.TabPanel.TabPanelController({ config:tabPanelControllerConfig, selectedTab:this.getId('contacts') });
+		}
+		
+		return this._tabPanelController;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+	
diff --git a/frontend/beta/js/Clipperz/PM/Components/Panels/DataPanel.js b/frontend/beta/js/Clipperz/PM/Components/Panels/DataPanel.js
new file mode 100644
index 0000000..759903f
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Panels/DataPanel.js
@@ -0,0 +1,486 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Panels) == 'undefined') { Clipperz.PM.Components.Panels = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Panels.DataPanel = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Panels.DataPanel.superclass.constructor.call(this, anElement, args);
+
+	this._progressWidth = 400;
+
+
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Panels.DataPanel, Clipperz.PM.Components.Panels.BasePanel, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.DataPanel component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		MochiKit.Signal.disconnectAllTo(this);
+		Clipperz.NotificationCenter.unregister(this);
+		this.element().update("");
+
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'table', border:'0', cellspacing:'0', cellpadding:'0', children:[
+			{tag:'tbody', children:[
+				{tag:'tr', children:[
+					{tag:'td', valign:'top', width:'200', children:[
+						{tag:'ul', id:"dataSubMenu", cls:'subMenu', children:[
+							{tag:'li', id:'offlineCopyTab', htmlString:Clipperz.PM.Strings['offlineCopyTabLabel']},
+							{tag:'li', id:'sharingTab', htmlString:Clipperz.PM.Strings['sharingTabLabel']},
+							{tag:'li', id:'importTab', htmlString:Clipperz.PM.Strings['importTabLabel']},
+							{tag:'li', id:'printingTab', htmlString:Clipperz.PM.Strings['printingTabLabel']}
+						]}
+					]},
+					{tag:'td', valign:'top', children:[
+						{tag:'ul', cls:'clipperzTabPanels', children:[
+							{tag:'li', id:this.getId('offlineCopyPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['offlineCopyTabTitle']},
+									{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['offlineCopyTabDescription']},
+									{tag:'div', id:this.getId('offlineCopyLinkBox'), children:[
+										{tag:'a', id:'offlineCopyLink', href:'#', htmlString:Clipperz.PM.Strings['offlineCopyDownloadLinkLabel']}
+									]},
+									{tag:'div', id:this.getId('offlineCopyLinkBox_read-only'), children:[
+										{tag:'span', cls:'read-only', htmlString:Clipperz.PM.Strings['offlineCopyDownloadLinkLabel']}
+									]}
+								]}
+							]},
+							{tag:'li', id:this.getId('sharingPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['sharingTabTitle']},
+									{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['sharingTabDescription']}
+								]}
+							]},
+							{tag:'li', id:this.getId('importPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'div', id:this.getId('importPanelMainComponent')}
+								]}
+							]},
+							{tag:'li', id:this.getId('printingPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['printingTabTitle']},
+
+									{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['printingTabDescription']},
+									{tag:'div', id:this.getId('printingLinkBox'), children:[
+										{tag:'a', id:'printingLink', href:'#', htmlString:Clipperz.PM.Strings['printingLinkLabel']}
+									]},
+
+									{tag:'hr'},
+
+									{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['exportTabDescription']},
+									{tag:'div', id:this.getId('exportLinkBox'), children:[
+										{tag:'a', id:'exportLink', href:'#', htmlString:Clipperz.PM.Strings['exportLinkLabel']}
+									]}
+								]}
+							]}
+						]}
+					]}
+				]}
+			]}
+		]});
+
+		this.tabPanelController().setUp();
+
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+			this.getElement('offlineCopyLinkBox').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		} else {
+			this.getElement('offlineCopyLinkBox_read-only').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+			MochiKit.Signal.connect('offlineCopyLink', 'onclick', this, 'downloadOfflineCopy');
+		}
+
+		new Clipperz.PM.Components.Import.MainComponent(this.getElement('importPanelMainComponent'), {user:this.user()});
+		
+		MochiKit.Signal.connect('printingLink', 'onclick', this, 'printAllData');
+		MochiKit.Signal.connect('exportLink', 'onclick', this, 'exportAllData');
+
+		Clipperz.NotificationCenter.register(null, 'switchLanguage', this, 'switchLanguageHandler');
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'tabPanelController': function() {
+		if (this._tabPanelController == null) {
+			var tabPanelControllerConfig;
+			
+			tabPanelControllerConfig = {}
+			tabPanelControllerConfig['offlineCopyTab'] = this.getId('offlineCopyPanel');
+			tabPanelControllerConfig['sharingTab'] = this.getId('sharingPanel');
+			tabPanelControllerConfig['importTab'] = this.getId('importPanel');
+			tabPanelControllerConfig['printingTab'] = this.getId('printingPanel');
+			this._tabPanelController = new Clipperz.PM.Components.TabPanel.TabPanelController({
+												name: 'dataTabPanel',
+												config:tabPanelControllerConfig,
+												selectedTab:'offlineCopyTab'
+			});
+		}
+		
+		return this._tabPanelController;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'downloadOfflineCopy': function(anEvent) {
+		var downloadHref;
+		
+		downloadHref = window.location.href.replace(/\/[^\/]*$/,'') + Clipperz_dumpUrl;
+
+		if (Clipperz_IEisBroken == true) {
+			window.open(downloadHref, "");
+		} else {
+			var	deferredResult;
+			var newWindow;
+
+			newWindow = window.open("", "");
+
+			anEvent.preventDefault();
+
+			deferredResult = new MochiKit.Async.Deferred();
+			deferredResult.addCallback(MochiKit.Base.method(this.user().connection(), 'message'), 'echo', {'echo':"echo"});
+			deferredResult.addCallback(function(aWindow) {
+				aWindow.location.href = downloadHref;
+			}, newWindow);
+			deferredResult.callback();
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'compareRecords': function(a, b) {
+		return MochiKit.Base.compare(a.label().toLowerCase(), b.label().toLowerCase());
+	},
+
+	'logo': function() {
+		var result;
+	
+		if (Clipperz_IEisBroken == true) {
+			if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+				result = "<span><span class=\"clipperzLogoSpan\">clipper</span><span class=\"clipperzLoggoZSpan\">z</span></span>";
+			} else {
+				result = "<img src=\"./images/exportLogo.png\" />";
+			}
+		} else {
+			result = "<img src=\"data:image/png;charset=utf-8;base64,iVBORw0KGgoAAAANSUhEUgAAANYAAABOCAIAAADTtH9XAAANIWlDQ1BJQ0MgUHJvZmlsZQAAeJyV13k0lG8bB/BrFsYyZhhjDyO77LKHLJFItmwp2bdhJiZRypIUIkso2iiSFC0kEtWPLCHJkq2oyJI9kmXeP6R6f+f9ve95rz+ecz3385xz389zzud7nxsAr+FKpZKRABAQSAuyNjEgOTg6kTBdgAJewAEzaLi6B1P1LS3N4R9roRMQAADtcq5UKvmf3/uPhQtycHQCQMgCANF7vd8OAES39d4WAIhHaFQaAMIHAIjuPq4eAIhwAJANsrU2BEAUAADOe70vBwCc23pfDwC4EHdvGgCiG4CREOjhGwiAmQBg1PXwDHYHwMkCgIdHsHsAAC4ZACwCAigeALgPACDlTg2iAeCZAEDOwdGJtL7kffEAW/kAmMx+jx1JByjNAZDa/XtM9BEAtytAbuLvsTlrQAAAgrs12EtFGQAAEFgDAIYBOn1OAgCTCrCaQqcv59Lpq9cBUH0ANWT3w0EhP/8XAtEM8L/u17/5Z6EQAEgAhBgiH3kUFY4OZzjBGImJZjrJbMRcy3Ka9Qw2ju0srozdhyOFkMKZSjzPlc6dzpPJW8tPEcjelC14WaiedFgkd/N10VbxYxL5km3SJ2Rub+mUi5a/o9CjdFr5vsp71bNqZeqDmklaFdrDOmm6T/XG9DMMnhtO7sgyrjOZNb26q9FsYXeuRcue15avrdqsV2wL93bYddp3OXQ7offdc+7b339gwOX9wQ9uWPfHHp88P3sNe4/4fPEd9eciPwv4GjhJmaJOH5oJmg2ep80f/haycGQx9HvY0tEfx1bCV46vRkhHdkQjTiJjUKfQsQynGc9g4pjimRNYzrImYpPYzuGS8SnsqRxphPOc6cQMrkzuCzwXebP4svkvCVzedEXwqtA14RxSrsj1zTdE88TyxW9KFkjekiqUvi1ze7yIfEf2rlyxQoniPaX7Sg+UH24tVS1TK1t4FFKu/lijQqtS+8m2qm1PdZ6uVUfU6D3b/lz/hcFfhrXo2pi6HS+N600aTBtNm1iaEl6ZNZu3WLTiWs+9tmyzemPdTmhPfWvTYdu5t4u7K7Pb/p1Dj1Mvf292n3O/88D+90Lvr35wGTw4JDKU+9Htk/tnj2Hx4fwRry/eoz5j0mOF434T/l/Jk3KTd6cCpykz1Fml2ftzQfPB32gLqgtliyHfQ5fCfoQtay1XrhxbDV/TWXtKpwMgRJE45DSqCX2bIY0xHOPNZMtsyLKVVRIrycaL48HzsvNycBEkOKWIGlzm3Ad4gnmT+Ir5mwRGBTmF1IS9SRdEXooixHTED0nck5ySlpIhb6mUQ8nrK6QoDipLq8Ru7VKTUadq1GrxaIdue6XLrUfZ/txAzPCYUZuxkEnozirTJTMlc8/d6RZtljgrE+tQmzzbt3Ys9tsdDjledqrbN7Vf+MAel6MHc11r3UY9uDz1vBy8T/hc863x6/dfCuAM3EIxovocCg9KDs6llR6uD+k9Mha6cBR1jCOcdFz2hGrE9kizqD3R+04ejPE8RY6lnQ46ExkXGX8yIe5samJCUta5i8mZKSmpl9JSz2ekX8goyLx54e7Fgqzb2cWXnlx+cqX26qtrbTntue3X22/05n3KH7k5VPD51lThzO2posk7s3enisdLJu6N3B98MPSwp7StrOFRTfmjx8UVlypTn0RWBTzdV21Ws+2ZzHPC86UXH/5qrH1Yl/YyqN6mQa1RoJHe1PPqYXN8i1OraOvw6wdtx9/saMe197+91uHXqdK52tXcnfZuf490z1xvRV90v9kAcWDg/a0PwYPaQ+ihxo/nPx34LPl5YrhiJOrLrlGu0f6xG+PkCdWJta8Nk6lT+6bFpidmHsyGz5nME+a7v+UtUBY1v6O+v1xK+bFvWXT560rZauSaKZ2bTgeAk4hQ5FGUNqoCfZxBj6GaMQpzismYqZY5luU0azx2F7aJLRGXiE9i38PeypFMSOVMI6Zx2XK95c7gyeC9wJfFny2QvemSoLNgv9BV4WukHJGczTmi18VuiOdJ5EvelCqQviXjKzO2pVC2SO6O/F2FYsUSpXvK91UebH2oWqZWpl6mEarxXbNCq0K7ctsTnSrdE7pretXba/SfGTw3fGEUswO9o9a4zuTlznrThl2NZgnmWPNXu5stWva0WiZbsVu1Wb+xabd9u7fTLsOe277LodvxnVPPvmxnAee+/f0H3rt8OPjBNcdNxG3I/aPHJ8/PXvneEusJ4jfmf5ssS574txSZ+5Ui5WEaYUtHfxxbDl85vnpiLYIeBdHIX0mCOYOJY4priN+VwHoWm4hNYjuHT2ZP4fiVJdyZPBd4f2bJpj+zJHfouvsN0TyxfImbEhtpUiR7R+6u/B9ZolK6tUz1kXq5+mONCs1K7SfaVdue6lbr/pEjO+qMXxrXmzTsbDRtMnsV0rK51eK1ZZvlG6v24x0ynXZd9t3RPQq9Tn2xAyrv4wZVh85+8hjWHkkZ9R33+0qeoszEzzstnFtKWLWm0wHW9z4AAEY1gIwtAHZZADa5ALFbACRdALgLACzZAGw1AckgBEgdKiB26WzsH4AAdhAEeTAARwiGZCiB7wgSwgwRiihAtCBGkHikCTIKWYVcQemgolB1qBW0CNoRnY/+xmDMcIqhmGGK0YQxh3EYw4VxxlQxYZg0mWKYxpm1mCnMNSxyLJEs5aw41ijWd1giNhD7hW0H20m2QZwr7jkehffCT7BbsWewr3LEccwStAh5nOqceZxTRBfiIpcvVxn3Fu6XPF68GN5CPnG+I3zz/JcFTATmNl0TFBMMF0IIlQr7kURIPSLnN2/eHCmKF20VSxHfK8EvMSR5W8pQ6pa0gQyHzOCWB7Kn5ZzlVRSwCiOKfynlKkereGw1UZVV41RbUR/WyNTEadZolWjnbDuvc0Y3Qu/I9kP6ZANfQx8jnx3+xoEmtJ3HTGN2nTPLNr+1u9yiYU+f5Yw1xkbIVmOvjR3VPsnhruNrpzln3v26B7xckg9Wun5x5/Ew8QzzKvLl9bP0jyfXBiIp+tSoQy+CGWlmh1NDxcIoR5+Esxx3OlEUQY+yjUGeco59dIYz7lB8W2J60lKyS0pdmsL5rMzgCx+zbLJrr9y9Jp5z+TpPPvvNpFu4wnN3MosFS27clys1Kmsrd308U8XztKjG4AWtFl9XVL+rKb5ZrqXtdUh7XQe1S6C7vk+iv/t9/KDep6Jhjy/Coz1f7aa4p7tms+ZdFieWSpcj6Lx0OgAggQV4QBr0wAEOQzqUwwACg1BEuCCSENWIOaQM0gWZhXyLwqN2o86imtFs6D3odHQvA4nBl6GE4TujIeM5xncYccxhzAsmApMHUzkzK7Mz810WNMsBloesLKzurNVYLiwV28wmw5bINoEzxxXj2fAUfCf7dvYbHDiOEI5egjHhHieJM5VzjRhM/MrlxzXGTeae5aHxLPAe5UPwneXn5y8U0BSo22S3aVQwUohPqEzYSniMFCsiIVK/OVCUR/SpmLs4VvyZRKCksOQbqThpA+lVmcot4bI6soty1fJnFGwVRRSnlKqVU1T8thqpCqkuq3WoP9a4rBml5a1tv01HR0FXRI+wHa2P0p81mDGcMhrfMWw8ZzK+89supBnRnGe3koXunj2W1lb+1mE22bb3976y67VfcSQ6KeyzcD60/+KBWpcRV2Y3RXcfjyzPaq9pH2lfT79M/44AgcC9lGzqlyCp4BBaQ4jgkeDQxqOix5LCx044RtRHqUXnxRBOJZ0mnMmI503ITlRNakn2TPmRlpiunvH5wpUsv0t7r0hfY8iZuP48r/TmxVuxt93vOBcb39N4sLVU/pHcY6lK8SqpasVnei921lq9JDccakppvtb6pG2gnd4p3K3T49GXMFDxYeIj32eDkcjRgvFPk/zTXrNX5ocXpZYCl8vWEHQ6ADACOwiCAThCMpTAmw37G+7X1aPxaEf0NwZjhqyf3tcwzkzCTDFM48y2zDUsciyXWHGsUayL2EDsFzYPnCvuI94LP8EezL7KEUfgJuRxqnM2El2Ii1zJv0xb8M3/9GwphBAq/WnZal3yT8ch0gZ/Gv4t+KffN5o1WiW/7f6W+89u/5ta70FfXj/Lv6sN6fm72+jCP+WeVf4tN4Nxw+5lzQ29N9I2/BYRNgQ/KN8wXHlyXfGzng3HDaNN8a/+as5oaXsd8kawva6D2lnSFdtd3xPSJ9HvP2D0Pn5Qb+j0R7dPRZ8Xhtu/CI/6j5mOS01gvtpN5k/FTnvP7JyVmWOdm5x//e3BQsai7eLE95glgx+SP4aXI1Z4V66scqzGrC6u3aAn0OkA6+clAABgMaSQKUEkc0Oj//Ow978qgHx4Yw4kAGA9A/faAAABAKR8aaa2AEAEAC0wBAqQgQJBQAJzMASjn1cSuP964guwfpYDAGBkB7hkDwBQ/f1Y5N/npXmG0gAADCnUsCBfbx8aSZ9KJXuSDCkB1MM0zyBZkmmgu7wsSVlRURUA4F93RgACxGzQPQAAAAlwSFlzAAALEwAACxMBAJqcGAAAC25JREFUeJztnHlUE9cex38JYY2JGhQ14Hae1BSXKoK4C0UtbtRqRUWlomi1NK5Y6tKKQpG2qK0pWo8oPp+ix+rRFlCPyxEVV9TXpx7klOdxKQFERQ1CWMLM+wMfDZk7k5nJMsHez8k/+d3f/d1fJt+5d+6SiEiSBAxGOMRCJ4D5u4MliBEYLEGMwGAJYgQGSxAjMFiCGIHBEsQIDJYgRmCwBDECgyWIERgsQYzAYAliBAZLECMwWIIYgcESxAgMliBGYLAEMQKDJYgRGCxBjMBgCWIEBksQIzASoRN4w+93X25YpWkl8zCyifr37bDsy5mcfDAtDkeRYFFRmVZbbmKsrixeBjM5+WBaHI4yEJNg/ufMbHwwLQ5HkSDmb0uLl6BM1kroFDAW0ZIkqNfXU43FJU/snwnGijjKdIQNUTP6hoelmhjdXEWCJIOxFi1JgiIRtFW4Cp0Fxsq0pIEY81ZitV5QV0nmZOUfz877o/CBkZlQqbpMmDB0TJh/a4UHbWV2NBBQ/PiFi4uzkU3k7ka2UTSbkehr4GnZC2cjt/q6ui7d2gKIAOB5heHg/tyjR85W6l43JRkYqPpkTlhAUA+RmHZYt1FYJNoS/bEjl86culqi/etJVy53DwsLipg+onO39szVmVMFgCfl9ds0x07kXGh8HxTos3VHPAmkqP4uiC0YZ5ze4VFJZPn/CxaX1EVFrqv669LTYUhPX9HHvwey7NDRe5sSt5kYO3s7H87a3PT2n5m3t6XuNPGRy+tO5+4wtiDdzp5Z79FW8WF4crm2lCHFz2PHzZ43Fllko7AmXLqiXRqbYm5sMqSlqQMG+9EVI1PNyV7bTtmhpg6mTjHNtvE6G8iHkp+6s0mSFnUDj3HV0oE4OeXklAkrWOgPACQxMT9GRyYBSfBry93dmWr0UXZg4/bgYfWAAWpmoQDAT2nHRwerkRnaKGwTBgImTkxebl5/ACCJjd2++FPTmRlzqq1kHroqGDGINlsnEaKWHbBIgtMjt/56KIdTlYLCJ0EDFvBWIZXKSjbqh5iYb13YBdTpYHTIEpatWytsTR0MCjAvZWOu5T/6eOIXrN2JoiJd8HC1Ay4f8Jfg0hUHHxQW8arqHj3za97t2gGdDhZ/utFuYQkShg5SO3EP+KdWv3rFD+x8xTExKcL0cubgKcF7RdVXzl2iKw0J6bciLnLs+BF0DgWFr67k3uDXtOXI5a5zosctip3aybsTnc+1/JJnHBe9eYddHneQblYYGKj6LHby8rjZdDHPnrtfdPc+pzzpaCARK/92gOeMeMa0eOTEKXx8/zUb5v5/4gXrEqfuz7ylSc2gen6dsOt0bgC/1i3AkJX9jZdS0fhmzrwRryrh/ZFq5FVYGafJyEyyddjyCkDezEGBXX9IWyaWvOkcp0UOLC6p/2jCcmqfMSsq8dqtPezybIa3dzsSxFptuUzmAQASUTdQmx5EMkICUA0aH8aQfHo0PhJ8XNKA1F9oiO+axLnGFhHArEj/1/r6jLR9Js46HQkkASJ7LkwaLl3eLHFzNza1lsG1G5qgAIRcCgpfNNTVObmYfdizKOyqVbuoEUNDfJM3LTYx+iidcy9rQoZQn+dkL8sr2ngpzOX5hs7erXfsivf0kqEKmZZ7nh+f5MlQrK5imYAJfBSwadMvKHNt8iY10j9qdhBq4cf55dOXPFrnzfa0hSZCaUQihqPZW1A1xKdy8mwattYAd/J/pzjUJ6d+jmxL6gbhEROo9j27s8zm2Uj4+D6Hs5Jo9MeELi/S8/4F2mJ1OQDPdV8+EryIGjji46Y0rXya4OECfQPfk8ulMqMXAOHqbs/dtlr/wX3pyrooJa5yxImbQ7/k2jTsvUId9ZLFRAczDA6fxX5ANR44dAlYHKaUyw1rEheYdaNSdS9B/u8DtMULbzN3n8xwHoiratB1RocFMdRK3xHDtSHrEhriR3eHNKJe8klqYpqdw2ZlX6Ea0zMudvTp+bxCh6pB3ClATpKcSEODSGLm20zfGc/sgISoyJKeWU9bPPM3cO7DI2wTnCX4SkeiLnm9rK3ckjxszfBhtH1VIyNHqlITTY0FhcUAJIPILAx75dJNVCVxUuJu5rAUJM/Kn7enrNI3R9/VtyvHsAD1d8T7w2lLx34HiomcYzaH80AskSC/DwOIHHDV0xh+8x4XMLOBaVFYpRnRcMBZYmbVz0/VkbnDpkKCFn6mv8f6z4AeKzkFRML5Crq7Ih46eHw8O+PX27LdT9uElbZCzGNsRGVlNSd/EqprGZZglO/BsExLcwIAHhKsrEIMxAWF5WwehwXkZn6BA4YtK31mrUwMBjMLy5EzRrOPRgDxTCN1oyt2bwNTqBN5nljrsJYYSNLhx2ImDAa02cIPxSNsUKDyx+2rDAYOtzRBgCutXvhQlu6pZCiOeW7FtjhLsJUUee2cn5U+bUf/ZLNFc/FgxiETY0rytJCwYVwT4EfmgbOTI5mOS2VlXaca/VRK5gcMC8OGhAZlUPbZgwa+KxKDs4tg9/OTI/2UevolW3WVdU86c44llwKyx9+39yRDrb0U/QFAn76+XFvnzZ9aPVFXx+Dwc9q/UGYzJ3osDDsqtB+1bGvaMeZGCQJqa0jjV4PBaiePKvIiO5T8h7ZYXcx7CZoOPnL+YHwo1Xjg0HVDjR7pX1IOqE0ug6dXGx6t80WckriHruzClTLkNtyCBZNsGrZbF1eUdmSPih4xNBkQoB4xZLHxK2zUInN5sqL6v98rGJag5+cDeFulIWP4SHDZMuQXIx46ZBF1UlJvgAlhiI27zt5SkcSuv0X6NefOiaPnqfbScmJl7DeoGobBIxC9lBXDSsQQirqfI6al6GkmsEtXZFJXXzYkzDebp1mIiiyPE/QHEOdeBDebHCvhMx3xUkA3le9DxGFBWZD/or171/Ts1RlEQBCQe+HhquWbkAtW69cLsF+SkHj4+MmbSRsXNv6QpaYG9u2/vDMNfd+HhviCmNX1sSTsV2smncs5S/GSBI+Mnxs9Jnr+OBc3JwAgCLh6rXhJ7LeoPqN28Eh/NnkyQAJZtT+caef48RmoRD5UNGfgDvM+zeE5I965c/Ho4chDCc5RUd+ZrS6XG3r5q/g1bSHX8x+MGcVqn2rdhoV2CCt1g+nRHx/MOEz13J1xanfGKWMLcsxKSZ5jlQNH6Ll7Ewx7dMYM3M51aOWZulwKSZt5r4wTJ05uNu8lKAlfTXGVWvm5my7sMvVI5GkGNvip2oaEDbE4LyHhf/eMDu6SmraaR8Xs7ATk6SYbw2HOOCNi4NiPgu0Z9nzuxvb0Z63pkMshI5Nd5+TAWNSBDx/cKfvM1gbW/n6qDpevbm6vRB7sYbMMxn+pLCV5RvYZDRvPL+I+XPrlbDuHFQFkZ62eH8vhjxInju9/OldjxX1Rof5Yw9JniPYK0Y1bmm3pazt6M+24v6vq9Fv2+ozMtU4u6N30jh0RCzQmu/hsfOh4UVHZXgF51zWTI8LofAID/3Hu/PdTIkexCWiLsDHzBuVe1syKnsS8MTItYnje5S1rmx9QN8YddRATaTTGzLMgWzjfElb4KXsTBAFlZdVFf2hfvdC5uruVasu9vT1VKh+fLgp7ns9H/io+Pm5c0zYGSUJpafWd2w9q9TXV+jpPhZRNkjYKS0dVFfnwwVNt8dMafTUJkhq9vnt3r3d6erdRuDn4iRCuWLP3FYtBqfRQKpv2PHpZMbgVEYka87RyetYNK5WKevX26tXbyyrRHBn8t0YYgcESxAgMliBGYLAEMQKDJYgRmLdQgno90wE+RwuLaUn/Nc2S4UN8n0a8LzXain1dVeMf2Nsxw2KsuTSNwfDgLRyIMS0LLEGMwGAJYgQGSxAjMFiCGIHBEsQIDJYgRmCwBDECgyWIERgsQYzAYAliBOZ/jys2NWyvP3gAAAAASUVORK5CYIIK\" />";
+		}
+
+		return result;
+	},
+
+	'progressWidth': function() {
+		return this._progressWidth;
+	},
+
+	'updateProgress': function(aProgressComponent, aPercentage) {
+		
+		
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'printAllData': function(anEvent) {
+		var newWindow;
+		var allRecords;
+
+//MochiKit.Logging.logDebug(">>> printAllData");
+		newWindow = window.open("", "");
+		newWindow.document.write(
+"<html>" +
+"<header>" +
+"	<title>Clipperz export data</title>" +
+"<style>" +
+"#exportedData {" +
+"	width: 600px;"	+
+"}" +
+".ext-mb-progress-wrap {" +
+"	border:1px solid #6593cf;" +
+"	margin-bottom: 10px;" +
+"	width: " + this.progressWidth() + "px;" +
+"}" +
+".ext-mb-progress {" +
+"	height:18px;" +
+"	background:transparent url(./images/default/basic-dialog/progress2.gif) repeat-x 1px 1px;" +
+"}" +
+".ext-mb-progress-bar {" +
+"	height:18px;" +
+"	overflow:hidden;" +
+"	width:0;" +
+"	background:#8bb8f3;" +
+"}" +
+"body {" +
+"	font-family: sans-serif;" +
+"}" +
+"div#logo {" +
+"	border-bottom: 1px dotted #aaaaaa;" +
+"	margin-bottom: 15px;" +
+"}" +
+"div.recordBlock h2 {" +
+"	font-size: 14pt;" +
+"	margin: 0px;" +
+"	padding: 0px;" +
+"	border: 0px;" +
+"	color: #666666;" +
+"}" +
+"div.recordBlock div.recordNotes p {" +
+"	margin: 0px;" +
+"	padding: 0px;" +
+"	border: 0px;" +
+"	color: #aaaaaa;" +
+"	font-size: 10pt;" +
+"	line-height: 18pt;" +
+"	border-left: 1px solid #aaaaaa;" +
+"	padding-left: 10px;" +
+"}" +
+"div.recordBlock dl {" +
+"	margin: 0px;" +
+"	padding: 0px;" +
+"	border: 0px;" +
+"	color: #999999;" +
+"	padding-bottom: 10px;" +
+"	border-bottom: 1px dotted #aaaaaa;" +
+"	margin-top: 10px;" +
+"	margin-bottom: 15px;" +
+"}" +
+"div.recordBlock dl dt {" +
+"	display: block;" +
+"	float: left;" +
+"	min-width: 100px;" +
+"	white-space: nowrap;" +
+"	overflow: hidden;" +
+"	margin-right: 10px;" +
+"	font-size: 10pt;" +
+"	line-height: 18pt;" +
+"}" +
+"div.recordBlock dl dd {" +
+"	color: #666666;" +
+"	font-size: 10pt;" +
+"	line-height: 18pt;" +
+"}" +
+"" +
+"</style>" +
+"" +
+"<!--[if IE]>" +
+"<style>" +
+"div.recordBlock dl dt {" +
+"	width: 100px;" +
+"}" +
+"</style>" +
+"<![endif]-->" +
+"" +
+"</header>" +
+"<body>" +
+"	<div id=\"logo\">" + this.logo() +
+"	<div id=\"progressWrapper\"><div class=\"ext-mb-progress-wrap\"><div class=\"ext-mb-progress\"><div id=\"progress\" class=\"ext-mb-progress-bar\">&#160;</div></div></div></div>" +
+"   </div>" +
+"</body>" +
+"</html>"
+		);
+
+		anEvent.preventDefault();
+
+		allRecords = MochiKit.Base.values(this.user().records());
+		allRecords.sort(this.compareRecords);
+		
+/*
+		deferredResult = new MochiKit.Async.Deferred();
+		MochiKit.Iter.forEach(allRecords, MochiKit.Base.partial(function(aDeferredResult, aWindow, aRecord) {
+			var printerRecord;
+			
+			printerRecord = new Clipperz.PM.Components.Printing.Record({record:aRecord});
+			aDeferredResult.addCallback(MochiKit.Base.method(printerRecord, 'deferredDrawToWindow', aWindow));
+		}, deferredResult, newWindow));
+		deferredResult.callback();
+
+		return deferredResult;
+*/		
+
+		MochiKit.DOM.withWindow(newWindow, MochiKit.Base.bind(function(someRecords) {
+			var currentWindow;
+			var	deferredResult;
+			var progressBar;
+			var progressWrapper;
+			var i, c;
+
+			currentWindow = MochiKit.DOM.currentWindow();
+			progressBar = MochiKit.DOM.getElement('progress');
+			progressWrapper = MochiKit.DOM.getElement('progressWrapper');
+			
+			deferredResult = new MochiKit.Async.Deferred();
+			c = someRecords.length;
+			for (i=0; i<c; i++) {
+				deferredResult.addCallback(function(aWindow, aRecord) {
+					var printerRecord;
+			
+					printerRecord = new Clipperz.PM.Components.Printing.Record({record:aRecord});
+					return printerRecord.deferredDrawToWindow(aWindow);
+				}, currentWindow, someRecords[i])
+				deferredResult.addCallback(MochiKit.Base.bind(function(aProgressBar, aProgress) {
+					MochiKit.Style.setElementDimensions(aProgressBar, {w:aProgress * this.progressWidth()});
+				}, this, progressBar, ((i+1)/c)));
+				deferredResult.addCallback(MochiKit.Async.wait, 0.2);
+			}
+
+			deferredResult.addCallback(function(aWindow, aProgressWrapper) {
+				MochiKit.DOM.replaceChildNodes(aProgressWrapper);
+				MochiKit.Style.hideElement(aProgressWrapper);
+				aWindow.stop();
+			}, currentWindow, progressWrapper);
+
+
+			deferredResult.callback();
+		}, this, allRecords));
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'exportAllData': function(anEvent) {
+//		var	deferredResult;
+		var newWindow;
+		var allRecords;
+
+//MochiKit.Logging.logDebug(">>> printAllData");
+		newWindow = window.open("", "");
+		newWindow.document.write(
+"<html>" +
+"<header>" +
+"	<title>Clipperz export data</title>" +
+"<style>" +
+"#exportedData {" +
+"	width: 600px;"	+
+"}" +
+".ext-mb-progress-wrap {" +
+"	margin-top:4px;" +
+"	margin-bottom: 10px;" +
+"	border:1px solid #6593cf;" +
+"	width: " + this.progressWidth() + "px;" +
+"}" +
+".ext-mb-progress {" +
+"	height:18px;" +
+"	background:transparent url(./images/default/basic-dialog/progress2.gif) repeat-x 1px 1px;" +
+"}" +
+".ext-mb-progress-bar {" +
+"	height:18px;" +
+"	overflow:hidden;" +
+"	width:0;" +
+"	background:#8bb8f3;" +
+"}" +
+"</style>" +
+"" +
+"<!--[if IE]>" +
+"<style>" +
+"</style>" +
+"<![endif]-->" +
+"" +
+"</header>" +
+"<body>" +
+"	<div id=\"logo\">" + this.logo() + "</div>" +
+"	<div id=\"progressWrapper\">" +
+"		<div class=\"description\">" + Clipperz.PM.Strings['exportDataInProgressDescription'] + "</div>" +
+"		<div class=\"ext-mb-progress-wrap\"><div class=\"ext-mb-progress\"><div id=\"progress\" class=\"ext-mb-progress-bar\">&#160;</div></div></div>" +
+"	</div>" +
+"	<div id=\"textareaWrapper\">" +
+"		<div class=\"description\">" + Clipperz.PM.Strings['exportDataDescription'] + "</div>" +
+"		<textarea id=\"exportedData\" cols=\"80\" rows=\"20\">[</textarea>" +
+"	</div>" +
+"</body>" +
+"</html>"
+		);
+
+		anEvent.preventDefault();
+
+		allRecords = MochiKit.Base.values(this.user().records());
+		allRecords.sort(this.compareRecords);
+
+		MochiKit.DOM.withWindow(newWindow, MochiKit.Base.bind(function(someRecords) {
+			var currentWindow;
+			var	deferredResult;
+			var textareaWrapper;
+			var	textarea;
+			var progressBar;
+			var progressWrapper;
+			var i, c;
+
+			currentWindow = MochiKit.DOM.currentWindow();
+			textarea = MochiKit.DOM.getElement('exportedData');
+			textareaWrapper = MochiKit.DOM.getElement('textareaWrapper');
+			MochiKit.Style.hideElement(textareaWrapper);
+			progressBar = MochiKit.DOM.getElement('progress');
+			progressWrapper = MochiKit.DOM.getElement('progressWrapper');
+			
+			deferredResult = new MochiKit.Async.Deferred();
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("exportAllData - 1: " + res); return res;});
+			c = someRecords.length;
+			for (i=0; i<c; i++) {
+				deferredResult.addCallback(MochiKit.Base.method(someRecords[i], 'deferredData'));
+				deferredResult.addCallback(MochiKit.Base.method(someRecords[i], 'exportedData'));
+				deferredResult.addCallback(MochiKit.Base.bind(function(aTextarea, aProgressBar, aProgress, someRecordExportedData) {
+					aTextarea.value = aTextarea.value + "\n" + someRecordExportedData + ",";
+					MochiKit.Style.setElementDimensions(aProgressBar, {w:aProgress * this.progressWidth()});
+				}, this, textarea, progressBar, ((i+1)/c)));
+				deferredResult.addCallback(MochiKit.Async.wait, 0.2);
+			}
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("exportAllData - 2: " + res); return res;});
+			deferredResult.addCallback(function(aTextareaWrapper, aTextarea, aProgressWrapper) {
+				aTextarea.value = aTextarea.value.slice(0, -1) + "\n]";
+//				MochiKit.DOM.replaceChildNodes(aProgressWrapper);
+				MochiKit.Style.hideElement(aProgressWrapper);
+				MochiKit.Style.showElement(aTextareaWrapper);
+				aTextarea.focus();
+				aTextarea.select();
+			}, textareaWrapper, textarea, progressWrapper);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("exportAllData - 3: " + res); return res;});
+			deferredResult.addBoth(function(aWindow) {
+				aWindow.stop();
+			}, currentWindow);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("exportAllData - 4: " + res); return res;});
+			
+			deferredResult.callback();
+		}, this, allRecords));
+	},
+
+	//-------------------------------------------------------------------------
+
+	__syntaxFix__: "syntax fix"
+	
+});
+	
diff --git a/frontend/beta/js/Clipperz/PM/Components/Panels/LoginPanel.js b/frontend/beta/js/Clipperz/PM/Components/Panels/LoginPanel.js
new file mode 100644
index 0000000..84b2475
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Panels/LoginPanel.js
@@ -0,0 +1,1114 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Panels) == 'undefined') { Clipperz.PM.Components.Panels = {}; }
+
+
+Clipperz.PM.Components.Panels.LoginPanel = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Panels.LoginPanel.superclass.constructor.call(this, anElement, args);
+
+	this._showLoginFormAnimator = null;
+	this._showRegistrationFormAnimator = null;
+	this._shouldShowRegistrationAlert = true;
+	
+	this._visibleForm = null;
+//	this._isPassphraseVisible = true;
+
+	Clipperz.NotificationCenter.register(null, 'switchLanguage', this, 'switchLanguageHandler');
+	
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+//MochiKit.Base.update(Clipperz.PM.Components.Panels.LoginPanel.prototype, {
+YAHOO.extendX(Clipperz.PM.Components.Panels.LoginPanel, Clipperz.PM.Components.Panels.BasePanel, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.LoginPanel component";
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		var result;
+		var	layout;
+		var registerButton;
+		
+		MochiKit.Signal.disconnectAllTo(this);
+		this.element().update("");
+		
+//MochiKit.Logging.logDebug(">>> LoginPanel.initPanel");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', id:this.getId('baseDiv'), cls:'LoginPanel', children:[
+			{tag:'table', children:[
+				{tag:'thead'},
+				{tag:'tbody', children:[
+					{tag:'tr', children:[
+						{tag:'td', valign:'top', children:[
+							{tag:'div', cls:'clipperzServiceDescription', htmlString:Clipperz.PM.Strings['clipperzServiceDescription']}
+						]},
+						{tag:'td', valign:'top', align:'right', children:[
+{tag:'div', id:this.getId('forms'), cls:'clipperzLoginForm', children:[
+	{tag:'div', id:this.getId('loginForm'), cls:'loginForm', children:[
+		{tag:'div', cls:'loginFormHeaderBox', children:[{tag:'h3', htmlString:Clipperz.PM.Strings['loginFormTitle']}]},
+		{tag:'form', id:this.getId('loginForm_form'), autocomplete:'off', children:[
+
+			{tag:'table', cls:'formLayout', children:[
+				{tag:'thead'},
+				{tag:'tbody', children:[
+					{tag:'tr', cls:'formFieldTR', children:[
+						{tag:'td', width:'90', htmlString:Clipperz.PM.Strings['loginFormUsernameLabel']},
+						{tag:'td', children:[
+							{tag:'input', id:this.getId('login_username'), cls:'loginFormField', type:'text', name:'username'}
+						]}
+					]},
+					{tag:'tr', cls:'formFieldTR', children:[
+						{tag:'td', htmlString:Clipperz.PM.Strings['loginFormPassphraseLabel']},
+						{tag:'td', children:[
+							{tag:'div', id:this.getId('passphraseDIV'), children:[
+								{tag:'input', id:this.getId('login_passphrase'), cls:'loginFormField', type:'password', name:'passphrase'}
+							]},
+							{tag:'div', cls:'oneTimePassword', id:this.getId('oneTimePasswordDIV'), children:[
+								{tag:'input', type:'text', id:this.getId('oneTimePassword_1'), name:'passphrase'},
+								{tag:'span', html:'-'},
+								{tag:'input', type:'text', id:this.getId('oneTimePassword_2'), name:'passphrase'},
+								{tag:'span', html:'-'},
+								{tag:'input', type:'text', id:this.getId('oneTimePassword_3'), name:'passphrase'},
+								{tag:'span', html:'-'},
+								{tag:'input', type:'text', id:this.getId('oneTimePassword_4'), name:'passphrase'}
+							]}
+						]}
+					]},
+					{tag:'tr', cls:'formFieldTR', id:this.getId('passwordTypeChooserTR'), children:[
+						{tag:'td', valign:'top', align:'right', children:[
+							{tag:'input', type:'checkbox', cls:'passwordTypeCheckbox', id:this.getId('useOneTimePasswordCheckbox')}
+						]},
+						{tag:'td', children:[
+							{tag:'div', cls:'passwordTypeChooser', children:[
+								{tag:'h4', htmlString:Clipperz.PM.Strings['loginFormOneTimePasswordCheckboxLabel']},
+								{tag:'span', htmlString:Clipperz.PM.Strings['loginFormOneTimePasswordCheckboxDescription']}
+							]}
+						]}
+					]},
+					{tag:'tr', children:[
+						{tag:'td'},
+						{tag:'td', children:[
+							{tag:'div', id:this.getId('login_submit')}
+						]}
+					]}
+				]},
+				{tag:'tfoot'}
+			]}
+		]},
+
+		{tag:'div', cls:'loginFormFooterBox', children:[
+			{tag:'ul', children:[
+				{tag:'li', id:this.getId('showRegistrationLI'), children:[
+					{tag:'span', htmlString:Clipperz.PM.Strings['loginFormDontHaveAnAccountLabel']},
+					{tag:'a', href:'.', id:this.getId('showRegistration'), cls:'clipperzActionLink', htmlString:Clipperz.PM.Strings['loginFormCreateOneLabel']}
+				]},
+				{tag:'li', children:[
+					{tag:'span', htmlString:Clipperz.PM.Strings['loginFormForgotYourCredentialsLabel']},
+					{tag:'a', href:Clipperz.PM.Strings['loginFormAarghThatsBadUrl'], target:'Clipperz_Help', htmlString:Clipperz.PM.Strings['loginFormAarghThatsBadLabel']}
+				]},
+				{tag:'li', children:[
+					{tag:'span', htmlString:Clipperz.PM.Strings['loginFormAfraidOfMaliciousScriptsLabel']},
+					{tag:'a', href:Clipperz.PM.Strings['loginFormVerifyTheCodeUrl'], target:'Clipperz_Help', htmlString:Clipperz.PM.Strings['loginFormVerifyTheCodeLabel']}
+				]}
+			]}
+		]}
+	]},
+
+
+
+	{tag:'div', id:this.getId('registrationForm'), cls:'registrationForm', children:[
+		{tag:'div', cls:'loginFormHeaderBox', children:[{tag:'h3', htmlString:Clipperz.PM.Strings['registrationFormTitle']}]},
+		{tag:'form', id:this.getId('registrationForm_form'), children:[
+			{tag:'h5', cls:'errorMessage', id:this.getId('registration_errorMessage')},
+			{tag:'table', cls:'formLayout', children:[
+				{tag:'thead'},
+				{tag:'tbody', children:[
+					{tag:'tr', cls:'formFieldTR', children:[
+						{tag:'td', width:'90', htmlString:Clipperz.PM.Strings['registrationFormUsernameLabel']},
+						{tag:'td', children:[
+							{tag:'input', id:this.getId('registration_username'), cls:'loginFormField', type:'text', name:'username'}
+						]}
+					]},
+					{tag:'tr', cls:'formFieldTR', children:[
+						{tag:'td', htmlString:Clipperz.PM.Strings['registrationFormPassphraseLabel']},
+						{tag:'td', children:[
+							{tag:'input', id:this.getId('registration_passphrase'), cls:'loginFormField', type:'password', name:'passphrase'}
+						]}
+					]},
+					{tag:'tr', cls:'formFieldTR', children:[
+						{tag:'td', htmlString:Clipperz.PM.Strings['registrationFormRetypePassphraseLabel']},
+						{tag:'td', children:[
+							{tag:'input', id:this.getId('registration_repassphrase'), cls:'loginFormField', type:'password', name:'repeat-passphrase'}
+						]}
+					]},
+					{tag:'tr', cls:'formFieldTR', children:[
+						{tag:'td', align:'right', valign:'top', children:[
+							{tag:'input', id:this.getId('registration_check'), type:'checkbox', name:'safetyCheck'}
+						]},
+						{tag:'td', children:[
+							{tag:'span', htmlString:Clipperz.PM.Strings['registrationFormSafetyCheckLabel']}
+						]}
+					]},
+					{tag:'tr', cls:'formFieldTR', children:[
+						{tag:'td', align:'right', valign:'top', children:[
+							{tag:'input', id:this.getId('registration_termsOfServiceCheck'), type:'checkbox', name:'termsOfServiceCheck'}
+						]},
+						{tag:'td', children:[
+							{tag:'span', htmlString:Clipperz.PM.Strings['registrationFormTermsOfServiceCheckLabel']}
+						]}
+					]},
+//					{tag:'tr', cls:'formFieldTR', children:[
+//						{tag:'td', htmlString:Clipperz.PM.Strings['registrationFormInvitationCodeLabel']},
+//						{tag:'td', children:[
+//							{tag:'input', id:this.getId('registration_invitationCode'), type:'text', size:'30', name:'invitationCode'}
+//						]}
+//					]},
+					{tag:'tr', children:[
+						{tag:'td'},
+						{tag:'td', children:[
+							{tag:'div', id:this.getId('registration_submit')}
+						]}
+					]}
+				]},
+				{tag:'tfoot'}
+			]}
+		]},
+		{tag:'div', cls:'loginFormFooterBox', children:[
+			{tag:'ul', children:[
+				{tag:'li', children:[
+					{tag:'span', htmlString:Clipperz.PM.Strings['registrationFormDoYouAlreadyHaveAnAccountLabel']},
+					{tag:'a', href:'.', id:this.getId('showLogin'), cls:'clipperzActionLink', htmlString:Clipperz.PM.Strings['registrationFormSimplyLoginLabel']}
+				]}
+			]}
+		]}
+	]}
+]},
+							{tag:'div', cls:'loginPanelSwitchLanguageBox', children:[
+								{tag:'div', cls:'loginPanelSwitchLanguageDescription', htmlString:Clipperz.PM.Strings['loginPanelSwithLanguageDescription']},
+								{tag:'div', cls:'loginPanelSwitchLanguageSelect', children:[
+									{tag:'select', id:this.getId('languageSelector'), children:Clipperz.PM.Strings['loginPanelSwitchLanguageSelectOptions']}
+								]}
+							]},
+							{tag:'div', cls:'browserCompatibilityBox', htmlString:Clipperz.PM.Strings['browserCompatibilityDescription']}
+						]}
+					]}
+				]}
+			]}
+		]});
+
+		MochiKit.Signal.connect(this.getId('loginForm_form'), 'onsubmit', function(e){e.stop();});
+		MochiKit.Signal.connect(this.getId('registrationForm_form'), 'onsubmit', function(e){e.stop();});
+
+		MochiKit.Signal.connect(this.getId('showRegistration'), 'onclick', this, 'showRegistrationFormEventHandler');
+		MochiKit.Signal.connect(this.getId('showLogin'), 'onclick', this, 'showLoginFormEventHandler');
+
+		new YAHOO.ext.Button(this.getId('login_submit'), {text:Clipperz.PM.Strings['loginFormButtonLabel'], handler:this.doLogin, scope:this, minWidth:0});
+		registerButton = new YAHOO.ext.Button(this.getId('registration_submit'), {text:Clipperz.PM.Strings['registrationFormButtonLabel'], handler:this.doRegister, scope:this, minWidth:0})
+
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+//			this.getElement('showRegistrationLI').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+			this.getElement('registrationForm_form').addClass('read-only');
+			registerButton.disable();
+			this.getElement('passwordTypeChooserTR').addClass('read-only');
+			this.getDom('useOneTimePasswordCheckbox').disabled = true;
+		}
+		
+		MochiKit.Signal.connect(this.getId('loginForm'), 'onkeydown', this, 'onkeydown');
+		MochiKit.Signal.connect(this.getId('registrationForm'), 'onkeydown', this, 'onkeydown');
+//		MochiKit.Signal.connect(this.getId('useOneTimePasswordCheckbox'), 'onchange', this, 'renderPasswordField');
+		MochiKit.Signal.connect(this.getId('useOneTimePasswordCheckbox'), 'onclick', this, 'renderPasswordField');
+		this.renderPasswordField();
+
+		this.selectSelectedLanguageOption();
+		MochiKit.Signal.connect(this.getId('languageSelector'), 'onchange', this, 'switchLanguage');
+
+		MochiKit.Signal.connect(this.getId('oneTimePassword_1'), 'onkeypress', this, 'handleOneTimePasswordFieldKeyPress');
+		MochiKit.Signal.connect(this.getId('oneTimePassword_2'), 'onkeypress', this, 'handleOneTimePasswordFieldKeyPress');
+		MochiKit.Signal.connect(this.getId('oneTimePassword_3'), 'onkeypress', this, 'handleOneTimePasswordFieldKeyPress');
+		MochiKit.Signal.connect(this.getId('oneTimePassword_4'), 'onkeypress', this, 'handleOneTimePasswordFieldKeyPress');
+
+		MochiKit.Signal.connect(this.getId('oneTimePassword_1'), 'onkeyup', this, 'handleOneTimePasswordFieldKeyUp');
+		MochiKit.Signal.connect(this.getId('oneTimePassword_2'), 'onkeyup', this, 'handleOneTimePasswordFieldKeyUp');
+		MochiKit.Signal.connect(this.getId('oneTimePassword_3'), 'onkeyup', this, 'handleOneTimePasswordFieldKeyUp');
+		MochiKit.Signal.connect(this.getId('oneTimePassword_4'), 'onkeyup', this, 'handleOneTimePasswordFieldKeyUp');
+
+		new Clipperz.PM.Components.PasswordEntropyDisplay(this.getElement('login_passphrase'));
+		new Clipperz.PM.Components.PasswordEntropyDisplay(this.getElement('registration_passphrase'));
+//MochiKit.Logging.logDebug("<<< LoginPanel.initPanel");
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderPasswordField': function() {
+		if (this.getDom('useOneTimePasswordCheckbox').checked == false) {
+			this.getElement('oneTimePasswordDIV').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide(false);
+			this.getElement('passphraseDIV').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show(false);
+			this.getElement('login_passphrase').focus();
+		} else {
+			this.getElement('passphraseDIV').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+			this.getElement('oneTimePasswordDIV').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show();
+			this.getElement('oneTimePassword_1').focus();
+		}
+
+	},
+	
+	//.........................................................................
+
+	'handleOneTimePasswordFieldKeyPress': function(anEvent) {
+		if (anEvent.key().string == '-') {
+			switch (anEvent.src().id) {
+				case this.getId('oneTimePassword_1'):
+					this.getElement('oneTimePassword_2').focus();
+					break;
+				case this.getId('oneTimePassword_2'):
+					this.getElement('oneTimePassword_3').focus();
+					break;
+				case this.getId('oneTimePassword_3'):
+					this.getElement('oneTimePassword_4').focus();
+					break;
+			}
+			
+			anEvent.stop();
+		}
+	},
+
+/*
+  var ctrl = document.getElementById("txtTargetText");
+  var saveText = ctrl.value;
+  ctrl.focus();
+
+  var range = document.selection.createRange();
+  var specialchar = String.fromCharCode(1);
+  range.text = specialchar;
+  var pos = ctrl.value.indexOf(specialchar);
+  ctrl.value = saveText;
+  range = ctrl.createTextRange();
+  range.move('character', pos);
+  range.select();
+  range.text = 
+ document.getElementById("txtSourceText").value;
+  document.getElementById("txtTargetText").focus();
+  window.event.returnValue = false;
+*/
+
+	'handleOneTimePasswordFieldKeyUp': function(anEvent) {
+		var	field;
+		var	fieldValue;
+		var key;
+		
+//console.log("keyUp", anEvent);
+		field = anEvent.src();
+		fieldValue = field.value;
+		key = anEvent.key();
+
+//			&&	(key.string != 'KEY_TAB')
+//			&&	(key.string != 'KEY_SHIFT')
+//			&&	(key.string != 'KEY_BACKSPACE')
+//			&&	(key.string != 'KEY_DELETE')
+//			&&	(key.string.indexOf('KEY_ARROW') != 0)
+		
+
+		if ((fieldValue.replace(/\s/g, '').length == 8) && (key.string == 'KEY_SPACEBAR')) {
+//			field.value = Clipperz.Base.trim(fieldValue).replace(/.{4}/g, '$&' + ' ');
+			
+			switch (field.id) {
+				case this.getId('oneTimePassword_1'):
+					this.getElement('oneTimePassword_2').focus();
+					break;
+				case this.getId('oneTimePassword_2'):
+					this.getElement('oneTimePassword_3').focus();
+					break;
+				case this.getId('oneTimePassword_3'):
+					this.getElement('oneTimePassword_4').focus();
+					break;
+			}
+//		} else if (fieldValue.replace(/\s/g, '').length > 8) {
+		}
+		
+//MochiKit.Logging.logDebug("-- fieldValue: " + fieldValue);
+	},
+	
+	//.........................................................................
+	
+	'doLogin': function() {
+//MochiKit.Logging.logDebug(">>> LoginPanel.doLogin");
+		if (this.checkLoginForm()) {
+			if (this.getDom('useOneTimePasswordCheckbox').checked == false) {
+				this.doLoginWithUsernameAndPassphrase(this.getDom('login_username').value, this.getDom('login_passphrase').value);
+			} else {
+				var	oneTimePasswordValue;
+				
+				oneTimePasswordValue = this.getDom('oneTimePassword_1').value + this.getDom('oneTimePassword_2').value + this.getDom('oneTimePassword_3').value + this.getDom('oneTimePassword_4').value;
+				this.doLoginWithUsernameAndOneTimePassword(this.getDom('login_username').value, oneTimePasswordValue);
+			}
+		}
+//MochiKit.Logging.logDebug("<<< LoginPanel.doLogin");
+	},
+
+	//.........................................................................
+
+	'doLoginWithUsernameAndPassphrase': function(anUsername, aPassphrase) {
+		var deferredResult;
+		var user;
+		var loginPanel;
+
+//MochiKit.Logging.logDebug(">>> LoginPanel.doLoginWithUsernameAndPassphrase");
+		user = new Clipperz.PM.DataModel.User({username:anUsername, passphrase:aPassphrase});
+		loginPanel = this;
+
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("0 - LoginPanel.doLogin - 0: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'deferredShow'),
+			{
+				title: "",
+				text: "",
+				width:240,
+				showProgressBar:true,
+				showCloseButton:false,
+				fn:MochiKit.Base.method(deferredResult, 'cancel'),
+				scope:this
+			},
+			this.getDom('login_submit')
+		);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1 - LoginPanel.doLogin - 1: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'login_start');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("2 - LoginPanel.doLogin - 2: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(user, 'connect'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("3 - LoginPanel.doLogin - 3: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'connection_done');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("4 - LoginPanel.doLogin - 4: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'connection_loadingUserData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("5 - LoginPanel.doLogin - 5: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(user, 'loadPreferences'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("6 - LoginPanel.doLogin - 6: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(user, 'loadRecords'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("7 - LoginPanel.doLogin - 7: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(user, 'loadDirectLogins'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("8 - LoginPanel.doLogin - 8: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'login_connected');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("9 - LoginPanel.doLogin - 9: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, user, 'setupDone', null);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("10 - LoginPanel.doLogin - 10: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+
+		deferredResult.addCallback(MochiKit.Async.wait, 0.5);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("11 - LoginPanel.doLogin - 11: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+
+		deferredResult.addCallback(function(res) {
+			Clipperz.PM.Components.MessageBox().hide(YAHOO.ext.Element.get('main'));
+			return res;
+		});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("12 - LoginPanel.doLogin - 12: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+
+		deferredResult.addErrback(MochiKit.Base.bind(function() {
+			Clipperz.PM.Components.MessageBox().update({
+				title:Clipperz.PM.Strings['loginMessagePanelFailureTitle'],
+				text:Clipperz.PM.Strings['loginMessagePanelFailureText'],
+				showProgressBar:false,
+				buttons:{'ok':Clipperz.PM.Strings['loginMessagePanelFailureButtonLabel']},
+				fn:MochiKit.Base.bind(function() {
+					this.getElement('login_passphrase').focus();
+					this.getElement('login_passphrase').dom.select();
+				}, this),
+				scope:this
+			});
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("13 - LoginPanel.doLogin - 13: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		
+		deferredResult.callback("token");
+//MochiKit.Logging.logDebug("<<< LoginPanel.doLoginWithUsernameAndPassphrase");
+		
+		return deferredResult;
+	},
+
+	//.........................................................................
+
+	'doLoginWithUsernameAndOneTimePassword': function(anUsername, aOneTimePassword) {
+		var deferredResult;
+		var loginPanel;
+		var oneTimePassword;
+		
+		oneTimePassword = Clipperz.PM.DataModel.OneTimePassword.normalizedOneTimePassword(aOneTimePassword);
+
+//MochiKit.Logging.logDebug(">>> LoginPanel.doLoginWithUsernameAndPassphrase");
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'deferredShow'),
+			{
+				title: "",
+				text: "",
+				width:240,
+				showProgressBar:true,
+				showCloseButton:false,
+				fn:MochiKit.Base.method(deferredResult, 'cancel'),
+				scope:this,
+				steps:7,
+				buttons:{
+				//	'ok':Clipperz.PM.Strings['loginMessagePanelInitialButtonLabel']
+				}
+			},
+			this.getDom('login_submit')
+		);
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'OTP_login_start');
+		deferredResult.addCallback(function(anUsername, aOneTimePassword) {
+			var args;
+			
+			args = {
+				'message': 'oneTimePassword',
+				'version': Clipperz.PM.Crypto.communicationProtocol.currentVersion,
+				'parameters': {
+					'oneTimePasswordKey': Clipperz.PM.DataModel.OneTimePassword.computeKeyWithUsernameAndPassword(anUsername, aOneTimePassword),
+					'oneTimePasswordKeyChecksum': Clipperz.PM.DataModel.OneTimePassword.computeKeyChecksumWithUsernameAndPassword(anUsername, aOneTimePassword)
+				}
+			}
+			
+			return args;
+		}, anUsername, oneTimePassword);
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'OTP_login_loadingOTP');
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Proxy.defaultProxy, 'handshake'));
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'OTP_login_extractingPassphrase');
+		deferredResult.addCallback(function(aResult) {
+			return Clipperz.PM.Crypto.deferredDecrypt(oneTimePassword, aResult['data'], aResult['version']);
+		});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.otpLogin - 4: " + res); return res;});
+		deferredResult.addCallback(function(aResult) {
+//MochiKit.Logging.logDebug("aResult")			
+			return (new Clipperz.ByteArray().appendBase64String(aResult['passphrase'])).asString();
+		});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.otpLogin - 5: " + res); return res;});
+		deferredResult.addCallbacks(
+			MochiKit.Base.method(this, 'doLoginWithUsernameAndPassphrase', anUsername),
+			MochiKit.Base.bind(function(aLoginPanel) {
+				Clipperz.PM.Components.MessageBox().update({
+					title:Clipperz.PM.Strings['loginMessagePanelFailureTitle'],
+					text:Clipperz.PM.Strings['loginMessagePanelFailureText'],
+					showProgressBar:false,
+					buttons:{'ok':Clipperz.PM.Strings['loginMessagePanelFailureButtonLabel']},
+					fn:MochiKit.Base.bind(function() {
+						this.getElement('oneTimePassword_1').focus();
+					}, this),
+					scope:aLoginPanel
+				});
+			}, this)
+		);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.otpLogin - 6: " + res); return res;});
+		deferredResult.callback("token");
+//MochiKit.Logging.logDebug("<<< LoginPanel.doLoginWithUsernameAndPassphrase");
+		
+		return deferredResult;
+	},
+	
+	//.........................................................................
+
+	'checkLoginForm': function() {
+		var result;
+		var username
+
+		result = true;
+		
+//MochiKit.Logging.logDebug(">>> checkLoginForm");
+		username = Clipperz.Base.trim(this.getDom('login_username').value);
+		if (username == "") {
+			this.getElement('login_username').focus();
+			result = false;
+		} else {
+			if (this.getDom('useOneTimePasswordCheckbox').checked == false) {
+				var	passphrase;
+			
+				passphrase = Clipperz.Base.trim(this.getDom('login_passphrase').value);
+
+				if (passphrase == "") {
+					this.getElement('login_passphrase').focus();
+					result = false;
+				}
+			} else {
+				if (Clipperz.Base.trim(this.getDom('oneTimePassword_1').value) == "") {
+					this.getElement('oneTimePassword_1').focus();
+					result = false;
+				} else  if (Clipperz.Base.trim(this.getDom('oneTimePassword_2').value) == "") {
+					this.getElement('oneTimePassword_2').focus();
+					result = false;
+				} else if (Clipperz.Base.trim(this.getDom('oneTimePassword_3').value) == "") {
+					this.getElement('oneTimePassword_3').focus();
+					result = false;
+				} else if (Clipperz.Base.trim(this.getDom('oneTimePassword_4').value) == "") {
+					this.getElement('oneTimePassword_4').focus();
+					result = false;
+				}
+			}
+		}
+//MochiKit.Logging.logDebug("<<< checkLoginForm - " + result);
+		
+		return result;
+	},
+
+	//.........................................................................
+
+	'doRegister': function(anEvent) {
+		if ((Clipperz.PM.Proxy.defaultProxy.isReadOnly() == false) && (this.checkRegistrationForm())) {
+			this.doRegistrationWithUsernameAndPassphrase(this.getDom('registration_username').value, this.getDom('registration_passphrase').value /*, this.getDom('registration_invitationCode').value*/);
+		}
+	},
+
+	//.........................................................................
+
+	'checkRegistrationForm': function() {
+		var result;
+		var username
+		var	passphrase;
+		var	rePassphrase;
+		var	safetyCheck;
+		var	termsOfServiceCheck;
+//		var	invitationCode;
+		
+		username = this.getDom('registration_username').value;
+		passphrase = this.getDom('registration_passphrase').value;
+		rePassphrase = this.getDom('registration_repassphrase').value;
+		safetyCheck = this.getDom('registration_check').checked;
+		termsOfServiceCheck = this.getDom('registration_termsOfServiceCheck').checked;
+//		invitationCode = this.getDom('registration_invitationCode').value;
+		
+		if ((username != "") && (passphrase != "") && (rePassphrase != "") /*&& (invitationCode != "")*/) {
+			if (passphrase != rePassphrase) {
+				//	show alert that the passphrase and rePassphrase should be equal
+//MochiKit.Logging.logDebug("WARNING: passphrase != rePassphrase");
+				this.showRegistrationFormErrorMessageAnimation(Clipperz.PM.Strings['registrationFormWarningMessageNotMatchingPassphrases']);
+				this.getElement('registration_repassphrase').focus().dom.select();
+//				this.getElement('registration_repassphrase').select();
+				result = false;
+			} else if (safetyCheck != true) {
+				//	show alert that the safetyCheck should be checed
+//MochiKit.Logging.logDebug("WARNING: safetyCheck not checked");
+				this.showRegistrationFormErrorMessageAnimation(Clipperz.PM.Strings['registrationFormWarningMessageSafetyCheckNotSelected']);
+				this.getElement('registration_check').focus();
+				result = false;
+			} else if (termsOfServiceCheck != true) {
+				this.showRegistrationFormErrorMessageAnimation(Clipperz.PM.Strings['registrationFormWarningMessageTermsOfServiceCheckNotSelected']);
+				this.getElement('registration_termsOfServiceCheck').focus();
+			} else {
+				result = true;
+			}
+		} else {
+			if (username == "") {
+				this.getElement('registration_username').focus();
+			} else if (passphrase == "") {
+				this.getElement('registration_passphrase').focus();
+			} else if (rePassphrase == "") {
+				this.getElement('registration_repassphrase').focus();
+//			} else if (invitationCode == "") {
+//				this.showRegistrationFormErrorMessageAnimation(Clipperz.PM.Strings['registrationFormWarningMessageInvitationCodeMissing']);
+//				this.getElement('registration_invitationCode').focus();
+			}
+			
+			result = false;
+		}
+		
+		if (result === true) {
+			this.getActor('registration_errorMessage').hide();
+		}
+		
+		return result;
+	},
+
+	//.........................................................................
+
+	'showRegistrationFormErrorMessageAnimation': function(anErrorMessage, aCallback) {
+		var	errorMessageActor;
+		
+		errorMessageActor = this.getActor('registration_errorMessage');
+		errorMessageActor.update(anErrorMessage);
+		errorMessageActor.show(true);
+		errorMessageActor.play(aCallback);
+	},
+
+	//.........................................................................
+	
+	'doRegistrationWithUsernameAndPassphrase': function(anUsername, aPassphrase /*, anInvitationCode */) {
+		var deferredResult;
+		var user;
+		var loginPanel;
+
+//MochiKit.Logging.logDebug(">>> LoginPanel.doRegistrationWithUsernameAndPassphrase");
+		user = new Clipperz.PM.DataModel.User({username:anUsername, passphrase:aPassphrase});
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 1");
+		loginPanel = this;
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 2");
+
+		deferredResult = new MochiKit.Async.Deferred();
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 3");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.doRegistrationWithUsernameAndPassphrase - 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'deferredShow'),
+			{
+				title:Clipperz.PM.Strings['registrationMessagePanelInitialTitle'],
+				text: Clipperz.PM.Strings['registrationMessagePanelInitialText'],
+				width:240,
+				showProgressBar:true,
+				showCloseButton:false,
+				fn:MochiKit.Base.method(deferredResult, 'cancel'),
+				scope:this,
+				steps:9,
+				buttons:{
+					'ok':Clipperz.PM.Strings['registrationMessagePanelInitialButtonLabel']
+				}
+			},
+			this.getDom('registration_submit')
+		);
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 4");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.doRegistrationWithUsernameAndPassphrase - 2: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(user, 'register'), /*anInvitationCode*/ "VeryBraveBetaTester");
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 5");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.doRegistrationWithUsernameAndPassphrase - 3: " + res); return res;});
+		deferredResult.addCallback(function(res) {
+			Clipperz.PM.Components.MessageBox().update({
+				title:Clipperz.PM.Strings['registrationMessagePanelRegistrationDoneTitle'],
+				text:Clipperz.PM.Strings['registrationMessagePanelRegistrationDoneText'],
+				step:'next'
+			});
+			return res;
+		});
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 6");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.doRegistrationWithUsernameAndPassphrase - 5: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Async.wait, 1);
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 7");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.doRegistrationWithUsernameAndPassphrase - 6: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(user, 'connect'));
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 8");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.doRegistrationWithUsernameAndPassphrase - 7: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Async.wait, 1);
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 9");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.doRegistrationWithUsernameAndPassphrase - 8: " + res); return res;});
+		deferredResult.addCallback(function(res) {
+			Clipperz.PM.Components.MessageBox().hide(YAHOO.ext.Element.get('main'));
+			return res;
+		});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'showRegistrationSplashScreen'), user);
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 10");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.doRegistrationWithUsernameAndPassphrase - 9: " + res); return res;});
+		deferredResult.addErrback(function(anError) {
+			Clipperz.PM.Components.MessageBox().update({
+				title:Clipperz.PM.Strings['registrationMessagePanelFailureTitle'],
+				text:anError.message,
+				showProgressBar:false,
+				buttons:{'ok':Clipperz.PM.Strings['registrationMessagePanelFailureButtonLabel']}});
+			return anError;
+		});
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 11");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("LoginPanel.doRegistrationWithUsernameAndPassphrase - 10: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, user, 'setupDone', null);
+		deferredResult.callback("token");
+//MochiKit.Logging.logDebug("--- LoginPanel.doRegistrationWithUsernameAndPassphrase - 12");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'showRegistrationSplashScreen': function(anUser) {
+		var deferredResult;
+		var alertElement;
+		var	alertDialog;
+		var closeButton;
+		var closeFunction;
+
+		deferredResult = new MochiKit.Async.Deferred();
+
+//MochiKit.Logging.logDebug(">>> Main.showRegistrationSplashScreen");
+		alertElement = Clipperz.YUI.DomHelper.append(document.body, {tag:'div', id:'registrationSplash', children:[
+			{tag:'div', cls:'ydlg-hd', htmlString:Clipperz.PM.Strings['registrationSplashPanelTitle']},
+			{tag:'div', cls:'ydlg-bd', children:[
+				{tag:'div', cls:'alert-message', id:'splashMessage', children:[
+					{tag:'div', htmlString:Clipperz.PM.Strings['registrationSplashPanelDescription']},
+					{tag:'table', border:'0', cellpadding:'5', children:[
+						{tag:'tbody', children:[
+							{tag:'tr', children:[
+								{tag:'td', valign:'top', children:[
+									{tag:'span', cls:'label', htmlString:Clipperz.PM.Strings['registrationSplashPanelUsernameLabel']}
+								]},
+								{tag:'td', valign:'top', children:[
+									{tag:'span', cls:'value', html:Clipperz.Base.escapeHTML(anUser.username())}
+								]}
+							]},
+							{tag:'tr', children:[
+								{tag:'td', valign:'top', children:[
+									{tag:'span', cls:'label', htmlString:Clipperz.PM.Strings['registrationSplashPanelPassphraseLabel']}
+								]},
+								{tag:'td', valign:'top', children:[
+									{tag:'div', id:this.getId('showPassphraseDiv'), children:[
+										{tag:'span', cls:'value', html:Clipperz.Base.escapeHTML(anUser.passphrase())}
+									]},
+									{tag:'div', id:this.getId('hidePassphraseDiv'), cls:'Clipperz_recordFieldData', children:[
+										{tag:'input', id:this.getId('passwordField'), type:'text', cls:'scrambledField', title:Clipperz.PM.Strings['recordDetailPasswordFieldTooltipLabel'], value:"anUser.passphrase()"}
+									]}
+								]}
+							]},
+							{tag:'tr', children:[
+								{tag:'td'},
+								{tag:'td', valign:'top', children:[
+//									{tag:'a', href:"#", id:this.getId('togglePassphraseVisibility'), htmlString:Clipperz.PM.Strings['registrationSplashPanelShowPassphraseButtonLabel']} 
+									{tag:'input', type:'checkbox', id:this.getId('showPassphraseCheckbox')},
+									{tag:'span', cls:'activeText', id:this.getId('showPassphraseText'), htmlString:Clipperz.PM.Strings['registrationSplashPanelShowPassphraseButtonLabel']}
+								]}
+							]}
+						]}
+					]}
+				]}
+			]},
+			{tag:'div', cls:'ydlg-ft'}
+		]}, true);
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 1");
+
+		this.getElement('passwordField').dom.value = anUser.passphrase();
+		this.getElement('passwordField').wrap({tag:'div', cls:'passwordBackground'}).setStyle('background-position', "0px -" + Math.min(128, Clipperz.PM.Crypto.passwordEntropy(anUser.passphrase())) + "px").setStyle('width', '71px');
+		MochiKit.Signal.connect(this.getId('showPassphraseCheckbox'), 'onclick', this, 'togglePassphraseVisibility');
+		MochiKit.Signal.connect(this.getId('showPassphraseText'), 'onclick', this, 'togglePassphraseCheckbox');
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 1.1");
+
+		this.getElement('showPassphraseDiv').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+		this.getElement('hidePassphraseDiv').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 1.1.1");
+		this.togglePassphraseVisibility();
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 1.2");
+		
+		alertDialog = new YAHOO.ext.BasicDialog(
+			alertElement, { 
+				closable:false,
+				modal:true,
+				autoTabs:false,
+				resizable:false,
+				fixedcenter:true,
+				constraintoviewport:false,
+				width:450,
+				height:220,
+				shadow:true,
+				minWidth:300,
+				minHeight:300
+			}
+		);
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 2");
+	
+		closeFunction = deferredResult.callback;
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 3");
+		alertDialog.addKeyListener(27, closeFunction);
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 4");
+		closeButton = alertDialog.addButton(Clipperz.PM.Strings['splashAlertCloseButtonLabel'], closeFunction, deferredResult);
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 5");
+		alertDialog.setDefaultButton(closeButton);
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 6");
+		alertDialog.show('main');
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 7");
+
+		deferredResult.addBoth(MochiKit.Base.method(alertDialog, 'hide'));
+		deferredResult.addCallback(MochiKit.Signal.disconnectAllTo, this)
+//MochiKit.Logging.logDebug("--- Main.showRegistrationSplashScreen - 8");
+		deferredResult.addCallback(MochiKit.Async.succeed);
+//MochiKit.Logging.logDebug("<<< Main.showRegistrationSplashScreen");
+		
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'showLoginFormEventHandler': function(anEvent) {
+		anEvent.stop();
+		this.showLoginForm(true);
+	},
+	
+	'showLoginForm': function(shouldAnimate) {
+		if (shouldAnimate) {
+			this.showLoginFormAnimator().play();
+		} else {
+			this.hideRegistrationForm(false);
+			this.getActor('loginForm').show(false);
+			this.getElement('login_username').focus();
+		}
+		this.setVisibleForm('login');
+	},
+
+	'showLoginFormAnimator': function() {
+		if (this._showLoginFormAnimator == null) {
+			var animator;
+			var	loginFormActor;
+			var registrationFormActor;
+			var usernameFieldActor;
+			
+			animator = new YAHOO.ext.Animator();
+			loginFormActor = this.getActor('loginForm', animator);
+			loginFormActor.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+			registrationFormActor = this.getActor('registrationForm', animator);
+			registrationFormActor.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+			usernameFieldActor = this.getActor('login_username', animator);
+			
+			animator.startCapture();
+			registrationFormActor.hide(true);
+			loginFormActor.show(true);
+			usernameFieldActor.focus();
+			animator.stopCapture();
+
+			this._showLoginFormAnimator = animator;
+		}
+		
+		return this._showLoginFormAnimator;
+	},
+
+	
+	'hideLoginForm': function(shouldAnimate) {
+		var loginFormActor;
+
+		loginFormActor = this.getActor('loginForm');
+		loginFormActor.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+		loginFormActor.hide(shouldAnimate);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'showRegistrationFormEventHandler': function(anEvent) {
+		anEvent.stop();
+		this.showRegistrationForm(true);
+	},
+	
+	'showRegistrationForm': function(shouldAnimate) {
+		if (shouldAnimate) {
+			this.showRegistrationFormAnimator().play(MochiKit.Base.bind(this.showRegistrationAlert, this));
+		} else {
+			var	errorMessageActor;
+			
+			this.hideLoginForm(shouldAnimate)
+			this.getActor('registrationForm').show(false);
+			this.getElement('registration_username').focus();
+
+			errorMessageActor = this.getActor('registration_errorMessage');
+			errorMessageActor.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+			errorMessageActor.update("---");
+			errorMessageActor.hide();
+			
+			this.showRegistrationAlert();
+		}
+		this.setVisibleForm('registration');
+	},
+
+	'showRegistrationFormAnimator': function() {
+		if (this._showRegistrationFormAnimator == null) {
+			var animator;
+			var	loginFormActor;
+			var registrationFormActor;
+			var usernameFieldActor;
+			var	errorMessageActor;
+			
+			animator = new YAHOO.ext.Animator();
+			loginFormActor = this.getActor('loginForm', animator);
+			loginFormActor.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+			registrationFormActor = this.getActor('registrationForm', animator);
+			registrationFormActor.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+			usernameFieldActor = this.getActor('registration_username', animator);
+			errorMessageActor = this.getActor('registration_errorMessage', animator);
+			errorMessageActor.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+			
+			animator.startCapture();
+			loginFormActor.hide(true);
+			errorMessageActor.update("---");
+			errorMessageActor.hide();
+			registrationFormActor.show(true);
+			usernameFieldActor.focus();
+			animator.stopCapture();
+
+			this._showRegistrationFormAnimator = animator;
+		}
+		
+		return this._showRegistrationFormAnimator;
+	},
+	
+	'hideRegistrationForm': function(shouldAnimate) {
+		var registrationFormActor;
+
+		registrationFormActor = this.getActor('registrationForm');
+		registrationFormActor.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+		registrationFormActor.hide(shouldAnimate);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'shouldShowRegistrationAlert': function() {
+		return this._shouldShowRegistrationAlert;
+	},
+	
+	'showRegistrationAlert': function() {
+		if ((this.shouldShowRegistrationAlert()) && (Clipperz.PM.Proxy.defaultProxy.isReadOnly() == false)) {
+			var alertElement;
+			var	alertDialog;
+			var closeButton;
+			var closeFunction;
+
+			alertElement = Clipperz.YUI.DomHelper.append(document.body, {tag:'div', id:'alert', children:[
+				{tag:'div', cls:'ydlg-hd', htmlString:Clipperz.PM.Strings['splashAlertTitle']},
+				{tag:'div', cls:'ydlg-bd', children:[
+					{tag:'div', cls:'alert-message', id:'splashMessage', htmlString:Clipperz.PM.Strings['splashAlertText']}
+				]},
+				{tag:'div', cls:'ydlg-ft'}
+			]}, true);
+
+			alertDialog = new YAHOO.ext.BasicDialog(
+				alertElement, { 
+					closable:false,
+					modal:true,
+					autoTabs:false,
+					resizable:false,
+					fixedcenter:true,
+					constraintoviewport:false,
+					width:450,
+					height:320,
+					shadow:true,
+					minWidth:300,
+					minHeight:300
+				}
+			);
+		
+			closeFunction = MochiKit.Base.partial(MochiKit.Base.bind(this.closeResigrationAlert, this), alertDialog);
+			alertDialog.addKeyListener(27, closeFunction);
+			closeButton = alertDialog.addButton(Clipperz.PM.Strings['splashAlertCloseButtonLabel'], closeFunction, this);
+			alertDialog.setDefaultButton(closeButton);
+			alertDialog.show('main');
+			
+			this._shouldShowRegistrationAlert = false;
+		}
+	},
+
+	'closeResigrationAlert': function(anAlertDialog) {
+		anAlertDialog.hide(MochiKit.Base.bind(function() {anAlertDialog.destroy(true); this.focusOnVisibleForm();}, this));
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'onkeydown': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> onkeydown - " + anEvent.src().id);
+		if (anEvent.key().code == 13) {
+			if (anEvent.src() == this.getDom('loginForm')) {
+				this.doLogin();
+			} else if (anEvent.src() == this.getDom('registrationForm')) {
+				this.doRegister();
+			} else {
+			}
+			
+			anEvent.stop();
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'visibleForm': function() {
+		return this._visibleForm;
+	},
+
+	'setVisibleForm': function(aValue) {
+		this._visibleForm = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'focusOnVisibleForm': function() {
+		if (this.visibleForm() == 'registration') {
+			this.getElement('registration_username').focus();
+		} else {
+			this.getElement('login_username').focus();
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'show': function() {
+		if (this.visibleForm() == 'registration') {
+			this.showRegistrationForm(false);
+		} else {
+			this.showLoginForm(false);
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'switchLanguage': function(anEvent) {
+		Clipperz.PM.Strings.Languages.setSelectedLanguage(anEvent.src().value);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'selectSelectedLanguageOption': function() {
+		Clipperz.DOM.selectOptionMatchingValue(this.getDom('languageSelector'), Clipperz.PM.Strings.selectedLanguage, true);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'switchLanguageHandler': function() {
+		this.render();
+		this.show();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'togglePassphraseCheckbox': function(anEvent) {
+		this.getDom('showPassphraseCheckbox').click();
+	},
+	
+	'togglePassphraseVisibility': function(anEvent) {
+		if (this.getDom('showPassphraseCheckbox').checked == true) {
+			this.getElement('showPassphraseDiv').show();
+			this.getElement('hidePassphraseDiv').hide();
+		} else {
+			this.getElement('showPassphraseDiv').hide();
+			this.getElement('hidePassphraseDiv').show();
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
diff --git a/frontend/beta/js/Clipperz/PM/Components/Panels/LogoutPanel.js b/frontend/beta/js/Clipperz/PM/Components/Panels/LogoutPanel.js
new file mode 100644
index 0000000..d7abfd6
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Panels/LogoutPanel.js
@@ -0,0 +1,73 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Panels) == 'undefined') { Clipperz.PM.Components.Panels = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Panels.LogoutPanel = function(args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Panels.LogoutPanel.superclass.constructor.call(this, args);
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Panels.LogoutPanel, Clipperz.PM.Components.Panels.BasePanel, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.LogoutPanel component";
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'initPanel': function() {
+		var result;
+		var	layout;
+			
+		result = new YAHOO.ext.ContentPanel(this.getId('panel'), {title:'logout', closable:false, autoCreate:true});
+
+		Clipperz.YUI.DomHelper.append(result.getEl().dom,
+			{tag:'div', children:[
+				{tag:'h2', html:'Logout panel'}
+			]}
+		);
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+	
diff --git a/frontend/beta/js/Clipperz/PM/Components/Panels/MainPanel.js b/frontend/beta/js/Clipperz/PM/Components/Panels/MainPanel.js
new file mode 100644
index 0000000..e2036d0
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Panels/MainPanel.js
@@ -0,0 +1,906 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Panels) == 'undefined') { Clipperz.PM.Components.Panels = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Panels.MainPanel = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Panels.MainPanel.superclass.constructor.call(this, anElement, args);
+
+	this._recordListDataModel = null;
+	this._selectedRecord = null;
+	this._recordDetailComponent = null;
+	this._recordListGrid = null;
+
+	this._directLinkItemTemplate = null;
+	this._recordItemTemplate = null;
+	
+	this._addNewRecordButton = null;
+	this._deleteRecordButton = null;
+
+	this._creationWizard = null;
+
+	Clipperz.NotificationCenter.register(null, 'selectAndEnterEditMode', this, 'selectRecordAndEnterEditModeHandler');
+
+	Clipperz.NotificationCenter.register(null, 'recordAdded', this, 'recordAddedHandler');
+	Clipperz.NotificationCenter.register(null, 'recordUpdated', this, 'recordUpdatedHandler');
+	Clipperz.NotificationCenter.register(null, 'recordRemoved', this, 'recordRemovedHandler');
+
+	Clipperz.NotificationCenter.register(null, 'directLoginAdded', this, 'directLoginAddedHandler');
+	Clipperz.NotificationCenter.register(null, 'directLoginUpdated', this, 'directLoginUpdatedHandler');
+	Clipperz.NotificationCenter.register(null, 'directLoginRemoved', this, 'directLoginRemovedHandler');
+
+	Clipperz.NotificationCenter.register(null, 'accountLocked', this, 'accountLockedHandler');
+
+	MochiKit.Signal.connect(MochiKit.DOM.currentWindow(), 'onresize', this, 'resizeModalMask');
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Panels.MainPanel, Clipperz.PM.Components.Panels.BasePanel, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Panels.MainPanel component";
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		this.element().update("");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'table', id:'mainPanelTABLE', border:'0', cellspacing:'0', cellpadding:'0', children:[
+			{tag:'tbody', children:[
+				{tag:'tr', children:[
+					{tag:'td', width:'15', children:[
+						{tag:'div', cls:'mainPanelMinHeightDiv'}
+					]},
+					{tag:'td', valign:'top', id:'directLoginsTD', width:'200', children:[
+						{tag:'div', id:'directLoginsBlock', children:[
+							{tag:'div', cls:'directLoginsBlockHeaderBox', children:[{tag:'h3', id:'directLoginTitle', htmlString:Clipperz.PM.Strings['mainPanelDirectLoginBlockLabel']}]},
+							{tag:'div', id:'directLoginsDescription', htmlString:Clipperz.PM.Strings['mainPanelDirectLoginBlockDescription']},
+							{tag:'ul', id:'directLogins'}
+						]}
+					]},
+					{tag:'td', width:'15', children:[
+						{tag:'div', cls:'mainPanelMinHeightDiv'}
+					]},
+					{tag:'td', valign:'top', children:[
+						{tag:'div', id:'mainContent', children:[
+							{tag:'div', id:'recordListBlockHeader'},
+							{tag:'div', id:'recordListAndDetailBlock', children:[
+								{tag:'table', id:'recordListAndDetailBlockTABLE', border:'0', cellspacing:'0', cellpadding:'0', children:[
+									{tag:'tbody', children:[
+										{tag:'tr', children:[
+											{tag:'td', valign:'top', width:'250', children:[
+												{tag:'div', id:'recordListBlock', children:[
+													{tag:'div', id:'recordListFilterHeader'},
+													{tag:'ul', id:'records'}
+												]}
+											]},
+											{tag:'td', id:'recordDetailSeparatorTD', rowspan:'2', valign:'top', bgcolor:'#ddddff', html:'&nbsp;'},
+											{tag:'td', valign:'top', children:[
+												{tag:'div', id:'recordDetailMainBlock', children:[
+													{tag:'div', id:'recordTitleTopBlock'},
+													{tag:'div', id:'recordDetailBlock', children:[
+														{tag:'div', id:'recordDetail'}
+													]}
+												]},
+												{tag:'div', id:'recordCreationWizardMainBlock', children:[
+													{tag:'div', id:'recordCreationWizard', html:"WIZARD"}
+												]}
+											]}
+										]},
+										{tag:'tr', children:[
+											{tag:'td', id:'cardBoxLowerLeftTD', html:'&nbsp;'},
+											{tag:'td', id:'cardBoxLowerRightTD', html:'&nbsp;'}
+										]}
+									]}
+								]}
+							]}
+						]}
+					]},
+					{tag:'td', width:'15', html:"&nbsp;"}
+				]}
+			]}
+		]});
+
+		this.renderRecordListBlockHeader();
+//		this.renderRecordListFilterHeader();
+
+		YAHOO.ext.Element.get('directLogins').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+
+		this.recordDetailComponent();
+
+		YAHOO.ext.Element.get('recordDetailMainBlock').setVisibilityMode(YAHOO.ext.Element.DISPLAY).show();
+		YAHOO.ext.Element.get('recordCreationWizardMainBlock').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'addNewRecordButton': function() {
+		return this._addNewRecordButton;
+	},
+	
+	'setAddNewRecordButton': function(aValue) {
+		this._addNewRecordButton = aValue;
+	},
+	
+	'deleteRecordButton': function() {
+		return this._deleteRecordButton;
+	},
+	
+	'setDeleteRecordButton': function(aValue) {
+		this._deleteRecordButton = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'addNewRecord': function(anEvent) {
+		var deferredResult;
+//		var currentNumberOfRecords;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+		
+//		currentNumberOfRecords = MochiKit.Base.keys(this.user().records()).length;
+/*
+//		if ((this.user().preferences().shouldShowDonationPanel()) && (currentNumberOfRecords > 0) && ((currentNumberOfRecords%10) == 0)) {
+//		if (true) {
+		if ((this.user().preferences().shouldShowDonationPanel()) && (currentNumberOfRecords >= 5)) {
+			deferredResult.addCallback(Clipperz.PM.showDonationSplashScreen, this.user(), 'recordListAddRecordButton');
+		}
+*/
+		deferredResult.addCallback(MochiKit.Base.bind(function() {
+			var currentlySelectedRecord;
+			
+			currentlySelecedRecord = this.selectedRecord();
+			this.setSelectedRecord(null);
+		
+			YAHOO.ext.Element.get('recordDetailMainBlock').hide();
+			YAHOO.ext.Element.get('recordCreationWizardMainBlock').show();
+			this.setCreationWizard(new Clipperz.PM.Components.RecordDetail.CreationWizard(YAHOO.ext.Element.get('recordCreationWizardMainBlock'), {previouslySelectedRecord:currentlySelecedRecord, mainComponent:this}));
+		
+			this.enterModalView();
+		}, this));
+
+		deferredResult.callback();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'creationWizard': function() {
+		return this._creationWizard;
+	},
+	
+	'setCreationWizard': function(aValue) {
+		this._creationWizard = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'exitWizard': function(aSelectedRecord, shouldEnterEditMode) {
+//MochiKit.Logging.logDebug(">>> MainPanel.exitWizard - " + aSelectedRecord)
+		YAHOO.ext.Element.get('recordCreationWizardMainBlock').hide();
+		YAHOO.ext.Element.get('recordDetailMainBlock').show();
+
+		if (shouldEnterEditMode == true) {
+			this.selectRecordAndEnterEditMode(aSelectedRecord);
+		} else {
+			this.setSelectedRecord(aSelectedRecord);
+			this.exitModalView();
+		}
+		
+		this.creationWizard().remove();
+		this.setCreationWizard(null);
+//MochiKit.Logging.logDebug("<<< MainPanel.exitWizard");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'selectRecordAndEnterEditMode': function(aRecord) {
+		this.setSelectedRecord(aRecord);
+		this.recordDetailComponent().setEditMode('EDIT');
+	},
+
+	'selectRecordAndEnterEditModeHandler': function(anEvent) {
+		this.selectRecordAndEnterEditMode(anEvent.source());
+	},
+
+	//-------------------------------------------------------------------------
+
+	'resizeModalMask': function() {
+//MochiKit.Logging.logDebug(">>> MainPanel.resizeModalMask");
+		MochiKit.Style.setElementDimensions('recordDetailEditModeHeaderMask', {w:MochiKit.Style.getElementDimensions('mainDiv').w, h:119});
+
+		MochiKit.Style.setElementDimensions('recordDetailEditModeVerticalMask', {w:511, h:MochiKit.Style.getElementDimensions('mainDiv').h - 119});
+//MochiKit.Logging.logDebug("<<< MainPanel.resizeModalMask");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'enterModalView': function() {
+		if (this.user().preferences().useSafeEditMode()) {
+			var headerMaskElement;
+			var verticalMaskElement;
+
+			this.resizeModalMask();
+
+			headerMaskElement = YAHOO.ext.Element.get('recordDetailEditModeHeaderMask');
+			headerMaskElement.show();
+			headerMaskElement.mask();
+
+			verticalMaskElement = YAHOO.ext.Element.get('recordDetailEditModeVerticalMask');
+			verticalMaskElement.show();
+			verticalMaskElement.mask();
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'exitModalView': function() {
+		if (this.user().preferences().useSafeEditMode()) {
+			var headerMaskElement;
+			var verticalMaskElement;
+			
+			headerMaskElement = YAHOO.ext.Element.get('recordDetailEditModeHeaderMask');
+			headerMaskElement.unmask();
+			headerMaskElement.hide();
+
+			verticalMaskElement = YAHOO.ext.Element.get('recordDetailEditModeVerticalMask');
+			verticalMaskElement.unmask();
+			verticalMaskElement.hide();
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'removeSelectedRecord': function() {
+		var selectedRecordReferences;
+
+//MochiKit.Logging.logDebug(">>> MainPanel.removeSelectedRecord");
+		if (this.selectedRecord() != null) {
+			selectedRecordReferences = [this.selectedRecord().reference()];
+		} else {
+			selectedRecordReferences = [];
+		}
+
+		if (selectedRecordReferences.length > 0 ) {
+			var	recordReference;
+			var	records;
+			var deferred;
+			
+			records = [];
+			for (recordReference in selectedRecordReferences) {
+				var record;
+		
+//MochiKit.Logging.logDebug("### MainPanel.removeSelectedRecord - recordReference: " + selectedRecordReferences[recordReference]);
+				record = this.user().records()[selectedRecordReferences[recordReference]];
+//MochiKit.Logging.logDebug("### MainPanel.removeSelectedRecord - record: " + record);
+				records.push(record);
+			}
+//MochiKit.Logging.logDebug("### MainPanel.removeSelectedRecord - records.length: " + records.length);
+
+			deferred = new MochiKit.Async.Deferred();
+//MochiKit.Logging.logDebug("--- MainPanel.removeSelectedRecord - 1:");
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.removeSelectedRecord - 1: " + res); return res;});
+//MochiKit.Logging.logDebug("--- MainPanel.removeSelectedRecord - 2:");
+			deferred.addCallback(function() {
+				var deferredResult;
+				
+				deferredResult = new MochiKit.Async.Deferred();
+				Clipperz.PM.Components.MessageBox().deferredShow({
+					title:Clipperz.PM.Strings['mainPanelDeletingRecordPanelConfirmationTitle'],
+					text:Clipperz.PM.Strings['mainPanelDeleteRecordPanelConfirmationText'],
+					width:240,
+					showProgressBar:false,
+					showCloseButton:false,
+					buttons:{
+						'yes':Clipperz.PM.Strings['mainPanelDeleteRecordPanelConfirmButtonLabel'],
+						'no':Clipperz.PM.Strings['mainPanelDeleteRecordPanelDenyButtonLabel']
+ 					},
+					fn:MochiKit.Base.partial(function(aDeferred, aResult) {
+						if (aResult == 'yes') {
+							aDeferred.callback(aResult);
+						} else {
+							aDeferred.errback(aResult);
+						}
+					}, deferredResult)
+				}, 'recordListRemoveRecordButton');
+				
+				return deferredResult;
+			});
+//MochiKit.Logging.logDebug("--- MainPanel.removeSelectedRecord - 3:");
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.removeSelectedRecord - 2: " + res); return res;});
+//MochiKit.Logging.logDebug("--- MainPanel.removeSelectedRecord - 4:");
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.removeSelectedRecord - 3: " + res); return res;});
+			deferred.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'deferredShow'),
+				{
+					title:Clipperz.PM.Strings['mainPanelDeletingRecordPanelInitialTitle'],
+					text:Clipperz.PM.Strings['mainPanelDeletingRecordPanelInitialText'],
+					width:240,
+					showProgressBar:true,
+					showCloseButton:false,
+					steps:5
+				}
+			);
+//MochiKit.Logging.logDebug("--- MainPanel.removeSelectedRecord - 5:");
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.removeSelectedRecord - 4: " + res); return res;});
+			deferred.addCallback(MochiKit.Base.method(this.user(), 'deleteRecordsAction'), records);
+//MochiKit.Logging.logDebug("--- MainPanel.removeSelectedRecord - 6:");
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.removeSelectedRecord - 5: " + res); return res;});
+//MochiKit.Logging.logDebug("--- MainPanel.removeSelectedRecord - 7:");
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.removeSelectedRecord - 6: " + res); return res;});
+			deferred.addCallback(function() {
+				Clipperz.PM.Components.MessageBox().update({
+					title:null,
+					text:Clipperz.PM.Strings['mainPanelDeletingRecordPanelCompletedText'],
+					step:'next',
+					buttons:{}
+				});
+			});
+//MochiKit.Logging.logDebug("--- MainPanel.removeSelectedRecord - 8:");
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.removeSelectedRecord - 7: " + res); return res;});
+			deferred.addCallback(MochiKit.Async.wait, 1);
+//MochiKit.Logging.logDebug("--- MainPanel.removeSelectedRecord - 9:");
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.removeSelectedRecord - 8: " + res); return res;});
+			deferred.addCallback(function(res) {
+				Clipperz.PM.Components.MessageBox().hide(YAHOO.ext.Element.get('main'));
+				return res;
+			});
+//MochiKit.Logging.logDebug("--- MainPanel.removeSelectedRecord - 10:");
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.removeSelectedRecord - 9: " + res); return res;});
+			deferred.callback();
+		} else {
+//MochiKit.Logging.logDebug("+++ MainPanel.removeSelectedRecord - nothing selected");
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'recordDetailComponent': function() {
+//MochiKit.Logging.logDebug(">>> MainPanel.recordDetailComponent");
+		if (this._recordDetailComponent == null) {
+//MochiKit.Logging.logDebug("--- MainPanel.recordDetailComponent - 1");
+//MochiKit.Logging.logDebug("--- MainPanel.recordDetailComponent - 1 - user: " + this.user());
+			this._recordDetailComponent = new Clipperz.PM.Components.RecordDetail.MainComponent(
+				YAHOO.ext.Element.get('recordDetail'),
+				{user:this.user(), mainPanel:this}
+			);
+		}
+
+//MochiKit.Logging.logDebug("<<< MainPanel.recordDetailComponent");
+		
+		return this._recordDetailComponent;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'selectedRecord': function() {
+		return this._selectedRecord;
+	},
+	
+	'setSelectedRecord': function(aValue) {
+//		this.hideNewRecordPanel();
+//MochiKit.Logging.logDebug(">>> MainPanel.setSelectedRecord");
+		if (aValue != this._selectedRecord) {
+//MochiKit.Logging.logDebug("--- MainPanel.setSelectedRecord - 1");
+			this._selectedRecord = aValue;
+//MochiKit.Logging.logDebug("--- MainPanel.setSelectedRecord - 2");
+			this.redrawRecordItems();
+//MochiKit.Logging.logDebug("--- MainPanel.setSelectedRecord - 3");
+			this.recordDetailComponent().setRecord(aValue);
+//MochiKit.Logging.logDebug("--- MainPanel.setSelectedRecord - 4");
+		}
+		
+		if ((aValue == null) || (Clipperz.PM.Proxy.defaultProxy.isReadOnly())) {
+			this.deleteRecordButton().disable();
+		} else {
+			this.deleteRecordButton().enable();
+		}
+//MochiKit.Logging.logDebug("<<< MainPanel.setSelectedRecord");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'recordAddedHandler': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> MainPanel.recordAddedHandler");
+		this.recordDetailComponent();
+		this.redrawRecordItems();
+//MochiKit.Logging.logDebug("<<< MainPanel.recordAddedHandler");
+	},
+	
+	'recordUpdatedHandler': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> MainPanel.recordUpdatedHandler");
+		this.redrawRecordItems();
+//MochiKit.Logging.logDebug("<<< MainPanel.recordUpdatedHandler");
+	},
+
+	'recordRemovedHandler': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> MainPanel.recordRemovedHandler");
+		this.setSelectedRecord(null);
+//MochiKit.Logging.logDebug("--- MainPanel.recordRemovedHandler - 1");
+		this.redrawRecordItems();
+//MochiKit.Logging.logDebug("<<< MainPanel.recordRemovedHandler");
+	},
+	
+	'compareRecords': function(a, b) {
+//MochiKit.Logging.logDebug("=== compareRecords: " + a.toString() + " - " + b.toString());
+		return MochiKit.Base.compare(a.label().toLowerCase(), b.label().toLowerCase());
+	},
+	
+	'redrawRecordItems': function() {
+		var template;
+		var allRecords;
+
+//MochiKit.Logging.logDebug(">>> MainPanel.redrawRecordItems");
+		MochiKit.Iter.forEach(YAHOO.ext.Element.get('records').getChildrenByTagName('li'), function(aRecordElement) {
+			MochiKit.Signal.disconnectAll(aRecordElement.dom);
+		})
+//MochiKit.Logging.logDebug("--- MainPanel.redrawRecordItems - 1");
+		YAHOO.ext.Element.get('records').update("");
+//MochiKit.Logging.logDebug("--- MainPanel.redrawRecordItems - 2");
+		allRecords = MochiKit.Base.values(this.user().records());
+//MochiKit.Logging.logDebug("--- MainPanel.redrawRecordItems - 3");
+		allRecords.sort(this.compareRecords);
+//MochiKit.Logging.logDebug("--- MainPanel.redrawRecordItems - 4");
+		template = this.recordItemTemplate();
+//MochiKit.Logging.logDebug("--- MainPanel.redrawRecordItems - 5");
+		MochiKit.Iter.forEach(allRecords, MochiKit.Base.bind(function(aRecord) {
+			var	recordElement;
+			recordElement = template.append('records', {
+				recordTitle:aRecord.label(),
+				recordReference:aRecord.reference(),
+				cls:((aRecord == this.selectedRecord()) ? 'selected': '')
+			}, true);
+//MochiKit.Logging.logDebug("--- MainPanel.redrawRecordItems - 6: " + recordElement.dom);
+			recordElement.addClassOnOver('hover');
+			MochiKit.Signal.connect(recordElement.dom, 'onclick', this, 'selectRecord');
+		}, this));
+//MochiKit.Logging.logDebug("<<< MainPanel.redrawRecordItems");
+	},
+
+	'selectRecord': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> MainPanel.selectRecord");
+//MochiKit.Logging.logDebug("--- MainPanel.selectRecord !!! - ", this.user().records()[anEvent.src().id].label());
+		this.setSelectedRecord(this.user().records()[anEvent.src().id]);
+//MochiKit.Logging.logDebug("<<< MainPanel.selectRecord");		
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'directLoginAddedHandler': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> MainPanel.recordRemovedHandler");
+		this.redrawDirectLoginItems();
+//MochiKit.Logging.logDebug("<<< MainPanel.recordRemovedHandler");
+	},
+	
+	'directLoginUpdatedHandler': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> MainPanel.directLoginUpdatedHandler");
+		this.redrawDirectLoginItems();
+//MochiKit.Logging.logDebug("<<< MainPanel.directLoginUpdatedHandler");
+	},
+	
+	'directLoginRemovedHandler': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> MainPanel.directLoginRemovedHandler");
+		this.redrawDirectLoginItems();
+//MochiKit.Logging.logDebug("<<< MainPanel.directLoginRemovedHandler");
+	},
+
+	'compareDirectLogins': function(a, b) {
+		return MochiKit.Base.compare(a.label().toLowerCase(), b.label().toLowerCase());
+	},
+	
+	'redrawDirectLoginItems': function() {
+		var template;
+		var allDirectLogins;
+
+//MochiKit.Logging.logDebug(">>> MainPanel.redrawDirectLoginItems");
+		MochiKit.Iter.forEach(YAHOO.ext.Element.get('directLogins').getChildrenByTagName('li'), function(aDirectLoginElement) {
+			MochiKit.Signal.disconnectAll(aDirectLoginElement.dom);
+//MochiKit.Logging.logDebug("disconnecting IMG " + aDirectLoginElement.getChildrenByTagName('img')[0].dom.src);
+			MochiKit.Signal.disconnectAll(aDirectLoginElement.getChildrenByTagName('img')[0].dom);
+		})
+//MochiKit.Logging.logDebug("--- MainPanel.redrawDirectLoginItems - 1");
+		YAHOO.ext.Element.get('directLogins').update("");
+//MochiKit.Logging.logDebug("--- MainPanel.redrawDirectLoginItems - 2");
+		allDirectLogins = MochiKit.Base.values(this.user().directLoginReferences());
+//MochiKit.Logging.logDebug("--- MainPanel.redrawDirectLoginItems - 3");
+		allDirectLogins.sort(this.compareDirectLogins);
+
+		if (allDirectLogins.length == 0) {
+			YAHOO.ext.Element.get('directLoginsDescription').show();
+			YAHOO.ext.Element.get('directLogins').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		} else {
+			YAHOO.ext.Element.get('directLoginsDescription').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+			YAHOO.ext.Element.get('directLogins').show();
+		}
+//MochiKit.Logging.logDebug("--- MainPanel.redrawDirectLoginItems - 4");
+		template = this.directLoginItemTemplate();
+//MochiKit.Logging.logDebug("--- MainPanel.redrawDirectLoginItems - 5");
+		MochiKit.Iter.forEach(allDirectLogins, MochiKit.Base.bind(function(aDirectLogin) {
+			var	directLoginElement;
+			var	faviconImageElementID;
+			
+			faviconImageElementID = aDirectLogin.reference() + "_faviconIMG";
+			directLoginElement = template.append('directLogins', {
+				elementID:faviconImageElementID,
+				faviconUrl:aDirectLogin.fixedFavicon(), 
+				directLoginTitle:aDirectLogin.label(),
+				directLoginReference:aDirectLogin.reference()
+			}, true);
+//MochiKit.Logging.logDebug("--- MainPanel.redrawDirectLoginItems - 6: " + recordElement.dom);
+			directLoginElement.addClassOnOver("hover");
+			MochiKit.Signal.connect(directLoginElement.dom, 'onclick', this, 'handleDirectLoginClick');
+
+			MochiKit.Signal.connect(faviconImageElementID, 'onload', this, 'handleLoadedFaviconImage');
+			MochiKit.Signal.connect(faviconImageElementID, 'onerror', aDirectLogin, 'handleMissingFaviconImage');
+			MochiKit.Signal.connect(faviconImageElementID, 'onabort', aDirectLogin, 'handleMissingFaviconImage');
+			
+//			YAHOO.ext.Element.get(faviconImageElementID).dom.src = aDirectLogin.fixedFavicon();
+		}, this));
+//MochiKit.Logging.logDebug("<<< MainPanel.redrawDirectLoginItems");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handleDirectLoginClick': function(anEvent) {
+		var	directLoginReference;
+//MochiKit.Logging.logDebug(">>> MainPanel.handleDirectLoginClick !!!");
+
+		directLoginReference = this.user().directLoginReferences()[anEvent.src().id];
+		if (anEvent.target().className == 'directLoginItemEditButton') {
+			this.editDirectLogin(directLoginReference);
+		} else {
+			this.openDirectLogin(directLoginReference);
+		}
+//MochiKit.Logging.logDebug("<<< MainPanel.handleDirectLoginClick");		
+	},
+
+	'editDirectLogin': function(aDirectLoginReference) {
+//MochiKit.Logging.logDebug("=== MainPanel.editDirectLogin - " + aDirectLoginReference.label());
+		this.setSelectedRecord(aDirectLoginReference.record());
+	},
+	
+	'openDirectLogin': function(aDirectLoginReference) {
+		var	deferredResult;
+		var	newWindow;
+				
+//MochiKit.Logging.logDebug(">>> MainPanel.openDirectLogin - " + aDirectLoginReference.label());
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("MainPanel.openDirectLogin - 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(aDirectLoginReference, 'setupJumpPageWindow'));
+		deferredResult.addCallback(MochiKit.Base.method(aDirectLoginReference, 'deferredDirectLogin'));
+		deferredResult.addCallback(function(aDirectLogin) {
+			aDirectLogin.runDirectLogin(newWindow);
+		});
+
+		newWindow = window.open(Clipperz.PM.Strings['directLoginJumpPageUrl'], "");
+//		MochiKit.Signal.connect(newWindow, 'onload', MochiKit.Base.method(deferredResult, 'callback', newWindow))
+//		MochiKit.Signal.connect(newWindow, 'onload', MochiKit.Base.partial(alert, "done"));
+		deferredResult.callback(newWindow);
+//MochiKit.Logging.logDebug("<<< MainPanel.openDirectLogin");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handleLoadedFaviconImage': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> MainPanel.handleLoadedFaviconImage");
+		MochiKit.Signal.disconnectAll(anEvent.src())
+//MochiKit.Logging.logDebug("<<< MainPanel.handleLoadedFaviconImage");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'recordItemTemplate': function() {
+		if (this._recordItemTemplate == null) {
+			this._recordItemTemplate = Clipperz.YUI.DomHelper.createTemplate({tag:'li', cls:'{cls}', id:'{recordReference}', children:[
+				{tag:'span', html:'{recordTitle}'}
+			]});
+			this._recordItemTemplate.compile();
+		}
+		
+		return this._recordItemTemplate;
+	},
+	
+	'directLoginItemTemplate': function() {
+		if (this._directLoginItemTemplate == null) {
+			this._directLoginItemTemplate = Clipperz.YUI.DomHelper.createTemplate({tag:'li', id:'{directLoginReference}', children:[
+				{tag:'table', border:'0', cellpadding:'0', cellspacing:'0', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', width:'20', align:'center', valign:'top', children:[
+								{tag:'img', id:'{elementID}', src:'{faviconUrl}'}
+							]},
+							{tag:'td', valign:'top', children:[
+								{tag:'a', cls:'directLoginItemTitle', html:'{directLoginTitle}'}
+							]},
+							{tag:'td', valign:'top', align:'right', children:[
+//								{tag:'span', cls:'directLoginItemEditButton', htmlString:Clipperz.PM.Strings['directLinkReferenceShowButtonLabel']}
+								{tag:'a', cls:'directLoginItemEditButton', htmlString:Clipperz.PM.Strings['directLinkReferenceShowButtonLabel']}
+							]}
+						]}
+					]}
+				]}
+			]});
+			this._directLoginItemTemplate.compile();
+		}
+		
+		return this._directLoginItemTemplate;
+	},
+	
+	//-------------------------------------------------------------------------
+/*
+	'newRecordButton': function() {
+		return this._newRecordButton;
+	},
+
+	'setNewRecordButton': function(aValue) {
+		this._newRecordButton = aValue;
+	},
+	
+	'newRecordCancelButton': function() {
+		return this._newRecordCancelButton;
+	},
+	
+	'setNewRecordCancelButton': function(aValue) {
+		this._newRecordCancelButton = aValue;
+	},
+*/	
+	//-------------------------------------------------------------------------
+
+	'onkeydown': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> onkeydown - " + anEvent.src().id + ": " + anEvent.key().code);
+		switch (anEvent.src().id) {
+/*
+			case this.getId('newRecordForm'):
+				if (anEvent.key().code == 13) {
+					this.newRecordButton().focus();
+//					this.addNewRecord();
+				} else if (anEvent.key().code == 27) {
+					this.newRecordCancelButton().focus();
+					this.hideNewRecordPanel(true);
+				}
+				break;
+*/
+			case "recordFilterSearchForm":
+				if (anEvent.key().code == 13) {
+//MochiKit.Logging.logDebug("SEARCH");
+					this.filterCardsWithName(YAHOO.ext.Element.get('recordFilterSearchValue').dom.value);
+					anEvent.event().stopPropagation();
+					YAHOO.ext.Element.get('recordFilterSearchValue').focus();
+				} else if (anEvent.key().code == 27) {
+					this.hideRecordFilterSearchPanel(true);
+					this.showRecordFilterAllPanel();
+				}
+				break;
+		}
+
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderRecordListBlockHeader': function(){
+		var recordListBlockHeaderElement;
+		
+		recordListBlockHeaderElement = YAHOO.ext.Element.get('recordListBlockHeader');
+		recordListBlockHeaderElement.update("");
+		Clipperz.YUI.DomHelper.append(recordListBlockHeaderElement.dom, 		
+			{tag:'table', cls:'recordListBlockHeaderTABLE', border:'0', cellspacing:'0', cellpadding:'0', children:[
+				{tag:'tbody', children:[
+					{tag:'tr', children:[
+						{tag:'td', /*width:'50%',*/ cls:'recordBlockTitleTD', children:[
+							{tag:'h3', id:'recordBlockTitle', htmlString:Clipperz.PM.Strings['mainPanelRecordsBlockLabel']}
+						]},
+						{tag:'td', align:'right', children:[
+							{tag:'table', id:'recordListButtonsTABLE', border:'0', cellspacing:'0', cellpadding:'0', children:[
+								{tag:'tbody', children:[
+									{tag:'tr', children:[
+										{tag:'td', cls:'recordButtonTD', align:'right', children:[
+											{tag:'div', cls:'recordButton', id:'recordListAddRecordButton'}
+										]},
+										{tag:'td', cls:'recordButtonTD', align:'left', children:[
+											{tag:'div', cls:'recordButton', id:'recordListRemoveRecordButton'}
+										]}
+									]}
+								]}
+							]}
+						]},
+						{tag:'td', width:'15', html:"&nbsp;"}
+					]}
+				]}
+			]}
+		);
+		
+		this.setAddNewRecordButton(new YAHOO.ext.Button('recordListAddRecordButton', {text:Clipperz.PM.Strings['mainPanelAddRecordButtonLabel'], handler:this.addNewRecord, scope:this}));
+//		this.setAddNewRecordButton(new YAHOO.ext.Button('recordListAddRecordButton', {text:Clipperz.PM.Strings['mainPanelAddRecordButtonLabel'], handler:this.showNewRecordPanel, scope:this}));
+		this.setDeleteRecordButton(new YAHOO.ext.Button('recordListRemoveRecordButton', {text:Clipperz.PM.Strings['mainPanelRemoveRecordButtonLabel'], handler:this.removeSelectedRecord, scope:this}));
+
+
+		if ((Clipperz.PM.Proxy.defaultProxy.isReadOnly()) || (this.selectedRecord() == null)) {
+			this.deleteRecordButton().disable();
+		}
+		
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+			this.addNewRecordButton().disable();
+		}
+
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderRecordListFilterHeader': function(){
+		var recordListFilterHeaderElement;
+		
+		recordListFilterHeaderElement = YAHOO.ext.Element.get('recordListFilterHeader');
+		recordListFilterHeaderElement.update("");
+		Clipperz.YUI.DomHelper.append(recordListFilterHeaderElement.dom, 		
+			{tag:'div', id:'recordFiltersDIV', children:[
+				{tag:'div', id:'recordFiltersTableWrapper', children:[
+					{tag:'table', id:'recordFiltersTABLE', border:'0', cellspacing:'0', cellpadding:'0', children:[
+						{tag:'tbody', children:[
+							{tag:'tr', children:[
+								{tag:'td', id:'recordFilterAllTD', children:[{tag:'div', children:[{tag:'a', id:'recordFilterAll', htmlString:Clipperz.PM.Strings['mainPanelRecordFilterBlockAllLabel']}]}]},
+								{tag:'td', id:'recordFilterTagsTD', children:[{tag:'div', children:[{tag:'a', id:'recordFilterTags', htmlString:Clipperz.PM.Strings['mainPanelRecordFilterBlockTagsLabel']}]}]},
+								{tag:'td', id:'recordFilterSearchTD', children:[{tag:'div', children:[{tag:'a', id:'recordFilterSearch', htmlString:Clipperz.PM.Strings['mainPanelRecordFilterBlockSearchLabel']}]}]}
+							]}
+						]}
+					]}
+				]},
+				{tag:'div', id:'recordFiltersTagsPanel'},
+				{tag:'div', id:'recordFiltersSearchPanel', children:[{tag:'div', id:'recordFiltersSearchInnerPanel', children:[{tag:'div', id:'recordFiltersSearchInnerInnerPanel', children:[
+					{tag:'form', id:'recordFilterSearchForm', children:[
+						{tag:'input', type:'text', name:'search', id:'recordFilterSearchValue'}
+					]}
+				]}]}]}
+			]}
+		);
+		
+///		YAHOO.ext.Element.get('recordFiltersSearchPanel').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide();
+		this.showRecordFilterAllPanel(false);
+
+		MochiKit.Signal.connect('recordFilterSearchForm', 'onkeydown', this, 'onkeydown');
+		MochiKit.Signal.connect('recordFilterSearchForm', 'onsubmit', this, 'onkeydown');
+		
+		MochiKit.Signal.connect('recordFilterAll', 'onclick', this, 'showRecordFilterAllPanel');
+		MochiKit.Signal.connect('recordFilterTags', 'onclick', this, 'showRecordFilterTagsPanel');
+		MochiKit.Signal.connect('recordFilterSearch', 'onclick', this, 'showRecordFilterSearchPanel');
+	},
+
+	//-------------------------------------------------------------------------
+
+	'showRecordFilterAllPanel': function(shouldSlide) {
+		this.hideRecordFilterTagsPanel(shouldSlide);
+		this.hideRecordFilterSearchPanel(shouldSlide);
+		YAHOO.ext.Element.get('recordFilterAllTD').addClass('selectedTab');
+	},
+	
+	'hideRecordFilterAllPanel': function(shouldSlide) {
+		YAHOO.ext.Element.get('recordFilterAllTD').removeClass('selectedTab');
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'showRecordFilterTagsPanel': function(shouldSlide) {
+		this.hideRecordFilterAllPanel(shouldSlide);
+		this.hideRecordFilterSearchPanel(shouldSlide);
+		YAHOO.ext.Element.get('recordFilterTagsTD').addClass('selectedTab');
+	},
+
+	'hideRecordFilterTagsPanel': function(shouldSlide) {
+		YAHOO.ext.Element.get('recordFilterTagsTD').removeClass('selectedTab');
+	},
+
+	//-------------------------------------------------------------------------
+
+	'showRecordFilterSearchPanel': function(shouldSlide) {
+		var searchPanelActor;
+		
+		this.hideRecordFilterAllPanel(shouldSlide);
+		this.hideRecordFilterTagsPanel(shouldSlide);
+		YAHOO.ext.Element.get('recordFilterSearchTD').addClass('selectedTab');
+		YAHOO.ext.Element.get('recordFilterSearchValue').dom.value = "";
+		
+		searchPanelActor = new YAHOO.ext.Actor('recordFiltersSearchPanel');
+
+		searchPanelActor.startCapture(true);
+		searchPanelActor.slideShow('top', 54);
+		searchPanelActor.play(MochiKit.Base.bind(function() {
+			YAHOO.ext.Element.get('recordFilterSearchValue').focus();
+		}, this));
+	},
+
+	'hideRecordFilterSearchPanel': function(shouldSlide) {
+		var searchPanelActor;
+		var	callback;
+		
+		YAHOO.ext.Element.get('recordFilterSearchTD').removeClass('selectedTab');
+
+		searchPanelActor = new YAHOO.ext.Actor('recordFiltersSearchPanel');
+
+		searchPanelActor.startCapture(true)
+		if (shouldSlide === false) {
+			searchPanelActor.hide();
+			searchPanelActor.slideHide('top');
+			searchPanelActor.show();
+		} else {
+			searchPanelActor.slideHide('top');
+		}
+		
+		callback = MochiKit.Base.bind(function() {
+		}, this);
+		
+		searchPanelActor.play(callback);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'filterCardsWithName': function(aValue) {
+MochiKit.Logging.logDebug(">>> filterCardsWithName: " + aValue);
+		
+MochiKit.Logging.logDebug("<<< filterCardsWithName");
+	},
+
+	'accountLockedHandler': function() {
+		this.setSelectedRecord(null);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'switchLanguageHandler': function() {
+		YAHOO.ext.Element.get('directLoginTitle').update(Clipperz.PM.Strings['mainPanelDirectLoginBlockLabel']);
+		YAHOO.ext.Element.get('directLoginsDescription').update("");
+		MochiKit.Iter.forEach(Clipperz.PM.Strings['mainPanelDirectLoginBlockDescriptionConfig'], function(aConfigItem) {
+			Clipperz.YUI.DomHelper.append(YAHOO.ext.Element.get('directLoginsDescription').dom, aConfigItem);
+		});
+		YAHOO.ext.Element.get('recordBlockTitle').update(Clipperz.PM.Strings['mainPanelRecordsBlockLabel']);
+		this.renderRecordListBlockHeader();
+//		this.renderRecordListFilterHeader();
+
+//		YAHOO.ext.Element.get('newRecordPanelTitleH2').update(Clipperz.PM.Strings['mainPanelNewRecordPanelTitle']);
+//		YAHOO.ext.Element.get('newRecordPanelTitleLabel').update(Clipperz.PM.Strings['mainPanelNewRecordPanelRecordTitleLabel']);
+//		YAHOO.ext.Element.get('newRecordPanelConfigLabel').update("");
+//		MochiKit.Iter.forEach(Clipperz.PM.Strings['mainPanelNewRecordPanelRecordConfigConfig'], function(aConfigItem) {
+//			Clipperz.YUI.DomHelper.append(YAHOO.ext.Element.get('newRecordPanelConfigLabel').dom, aConfigItem);
+//		});
+//		this.newRecordButton().setText(Clipperz.PM.Strings['mainPanelNewRecordPanelCreateButtonLabel']);
+//		this.newRecordCancelButton().setText(Clipperz.PM.Strings['mainPanelNewRecordPanelCancelButtonLabel']);
+		
+		this.recordDetailComponent().render();
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
diff --git a/frontend/beta/js/Clipperz/PM/Components/Panels/ToolsPanel.js b/frontend/beta/js/Clipperz/PM/Components/Panels/ToolsPanel.js
new file mode 100644
index 0000000..abd2621
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Panels/ToolsPanel.js
@@ -0,0 +1,305 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Panels) == 'undefined') { Clipperz.PM.Components.Panels = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.Panels.ToolsPanel = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.Panels.ToolsPanel.superclass.constructor.call(this, anElement, args);
+
+	this._generateButtonElement = null;
+	this._needsRenderingUponTabSwitch = false;
+	
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.Panels.ToolsPanel, Clipperz.PM.Components.Panels.BasePanel, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.Panels.ToolsPanel component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		var bookmarkletUrl;
+
+//MochiKit.Logging.logDebug(">>> ToolsPanel.render");
+		Clipperz.NotificationCenter.unregister(this);
+		MochiKit.Signal.disconnectAllTo(this);
+		
+		if (Clipperz_IEisBroken == true) {
+			bookmarkletUrl = bookmarklet_ie;
+		} else {
+			bookmarkletUrl = bookmarklet;
+		}
+		
+		this.element().update("");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'table', border:'0', cellspacing:'0', cellpadding:'0', children:[
+			{tag:'tbody', children:[
+				{tag:'tr', children:[
+					{tag:'td', valign:'top', width:'200', children:[
+						{tag:'ul', id:"dataSubMenu", cls:'subMenu', children:[
+							{tag:'li', id:this.getId('passwordGenerator'), htmlString:Clipperz.PM.Strings['passwordGeneratorTabLabel']},
+							{tag:'li', id:this.getId('bookmarklet'), htmlString:Clipperz.PM.Strings['bookmarkletTabLabel']},
+							{tag:'li', id:this.getId('compact'), htmlString:Clipperz.PM.Strings['compactTabLabel']},
+							{tag:'li', id:this.getId('httpAuth'), htmlString:Clipperz.PM.Strings['httpAuthTabLabel']}
+						]}
+					]},
+					{tag:'td', valign:'top', children:[
+						{tag:'ul', cls:'clipperzTabPanels', children:[
+							{tag:'li', id:this.getId('passwordGeneratorPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['passwordGeneratorTabTitle']},
+									{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['paswordGeneratorTabDescription']},
+									
+									//---------------------------------------------------
+									{tag:'div', children:[
+										{tag:'form', id:this.getId('passwordGeneratorForm'), cls:'passwordGenerator', children:[
+											{tag:'input', type:'text', cls:'clipperz_passwordGenerator_password', id:this.getId('passwordField')},
+											{tag:'table', children:[
+												{tag:'tbody', children:[
+													{tag:'tr', children:[
+														{tag:'td', width:'20%', children:[
+															{tag:'input', type:'checkbox', name:'lowercase', id:this.getId('lowercase'), checked:true},
+															{tag:'span', htmlString:Clipperz.PM.Strings['passwordGeneratorLowercaseLabel']}
+														]},
+														{tag:'td', width:'20%', children:[
+															{tag:'input', type:'checkbox', name:'uppercase', id:this.getId('uppercase'), checked:true},
+															{tag:'span', htmlString:Clipperz.PM.Strings['passwordGeneratorUppercaseLabel']}
+														]},
+														{tag:'td', width:'20%', children:[
+															{tag:'input', type:'checkbox', name:'numbers', id:this.getId('numbers'), checked:true},
+															{tag:'span', htmlString:Clipperz.PM.Strings['passwordGeneratorNumberLabel']}
+														]},
+														{tag:'td', width:'20%', children:[
+															{tag:'input', type:'checkbox', name:'symbols', id:this.getId('symbols'), checked:true},
+															{tag:'span', htmlString:Clipperz.PM.Strings['passwordGeneratorSymbolLabel']}
+														]},
+														{tag:'td', width:'20%', children:[
+															{tag:'span', cls:'passwordGeneratorLength', children:[
+																{tag:'span', htmlString:Clipperz.PM.Strings['passwordGeneratorLengthLabel']},
+																{tag:'span', id:this.getId('passwordLength'), cls:'passwordGeneratorLengthValue', html:'0'}
+															]}
+														]}
+													]}
+												]}
+											]}
+										]},
+										{tag:'div', id:this.getId('generateRandomPassword')}
+									]}
+									//---------------------------------------------------
+									
+								]}
+							]},
+							{tag:'li', id:this.getId('bookmarkletPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['bookmarkletTabTitle']},
+									{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['bookmarkletTabDescription']},
+									{tag:'a', href:bookmarkletUrl, cls:'bookmarkletLink', htmlString:Clipperz.PM.Strings['bookmarkletTabBookmarkletTitle']},
+									{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['bookmarkletTabInstructions']}
+								]}
+							]},
+							{tag:'li', id:this.getId('compactPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['compactTabTitle']},
+									{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['compactTabDescription']}
+								]}
+							]},
+							{tag:'li', id:this.getId('httpAuthPanel'), children:[
+								{tag:'div', cls:'clipperzSubPanel', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['httpAuthTabTitle']},
+									{tag:'div', cls:'panelDescription', htmlString:Clipperz.PM.Strings['httpAuthTabDescription']},
+									{tag:'div', cls:'bookmarkletConfiguration', children:[Clipperz.PM.Strings['httpAuthBookmarkletConfiguration']]}
+								]}
+							]}
+						]}
+					]}
+				]}
+			]}
+		]});
+
+		new Clipperz.PM.Components.PasswordEntropyDisplay(this.getElement('passwordField'));
+
+		MochiKit.Signal.connect(this.getId('lowercase'), 'onclick', this, 'updatePasswordValue');
+		MochiKit.Signal.connect(this.getId('uppercase'), 'onclick', this, 'updatePasswordValue');
+		MochiKit.Signal.connect(this.getId('numbers'),   'onclick', this, 'updatePasswordValue');
+		MochiKit.Signal.connect(this.getId('symbols'),   'onclick', this, 'updatePasswordValue');
+
+		MochiKit.Signal.connect(this.getDom('passwordField'), 'onkeyup',  this, 'updatePasswordLengthLabel');
+		MochiKit.Signal.connect(this.getDom('passwordField'), 'onchange', this, 'updatePasswordLengthLabel');
+		MochiKit.Signal.connect(this.getDom('passwordField'), 'onblur',   this, 'updatePasswordLengthLabel');
+
+		this.setGenerateButtonElement(new YAHOO.ext.Button(this.getDom('generateRandomPassword'), {text:Clipperz.PM.Strings['passwordGeneratorTabButtonLabel'], handler:this.updatePasswordValue, scope:this}));
+
+		this.setNeedsRenderingUponTabSwitch(false);
+		this.tabPanelController().setUp();
+		Clipperz.NotificationCenter.register(null, 'tabSelected', this, 'tabSelectedHandler');
+		Clipperz.NotificationCenter.register(null, 'switchLanguage', this, 'switchLanguageHandler');
+//MochiKit.Logging.logDebug("<<< ToolsPanel.render");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'needsRenderingUponTabSwitch': function() {
+		return this._needsRenderingUponTabSwitch;
+	},
+	
+	'setNeedsRenderingUponTabSwitch': function(aValue) {
+		this._needsRenderingUponTabSwitch = aValue;
+	},
+	
+	'tabSelectedHandler': function(anEvent) {
+		if (this.needsRenderingUponTabSwitch()) {
+			this.render();
+		}
+
+		if (anEvent.parameters() == this.getId('httpAuth')) {
+			var textarea;
+
+			textarea = document.getElementById("httpAuthDefaultConfiguration");
+			textarea.focus();
+			textarea.select();
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'tabPanelController': function() {
+		if (this._tabPanelController == null) {
+			var tabPanelControllerConfig;
+			
+			tabPanelControllerConfig = {}
+			tabPanelControllerConfig[this.getId('passwordGenerator')] = this.getId('passwordGeneratorPanel');
+			tabPanelControllerConfig[this.getId('bookmarklet')] = this.getId('bookmarkletPanel');
+			tabPanelControllerConfig[this.getId('compact')] = this.getId('compactPanel');
+			tabPanelControllerConfig[this.getId('httpAuth')] = this.getId('httpAuthPanel');
+			this._tabPanelController = new Clipperz.PM.Components.TabPanel.TabPanelController({ config:tabPanelControllerConfig, selectedTab:this.getId('passwordGenerator') });
+		}
+		
+		return this._tabPanelController;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'generateButtonElement': function() {
+		return this._generateButtonElement;
+	},
+	
+	'setGenerateButtonElement': function(aValue) {
+		this._generateButtonElement = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'updatePasswordValue': function(anEvent) {
+		var	randomBytes;
+		var	randomValue;
+		var charset;
+		var charsetBitSize;
+		var stringValue;
+		var	blockIndex;
+
+//MochiKit.Logging.logDebug(">>> updatePasswordValue");
+		randomBytes = Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(50);
+		stringValue = "";
+		blockIndex = 0;
+
+		charset = "";
+		if (this.getDom('lowercase').checked) {
+			charset += Clipperz.PM.Strings['passwordGeneratorLowercaseCharset'];
+		}
+		if (this.getDom('uppercase').checked) {
+			charset += Clipperz.PM.Strings['passwordGeneratorUppercaseCharset'];
+		}
+		if (this.getDom('numbers').checked) {
+			charset += Clipperz.PM.Strings['passwordGeneratorNumberCharset'];
+		}
+		if (this.getDom('symbols').checked) {
+			charset += Clipperz.PM.Strings['passwordGeneratorSymbolCharset'];
+		}
+
+		charsetBitSize = 0;
+		while (Math.pow(2, charsetBitSize) < charset.length) {
+			charsetBitSize ++;
+		}
+
+		if (charsetBitSize > 0) {
+			while (Clipperz.PM.Crypto.passwordEntropy(stringValue) < 128) {
+				if (((blockIndex + 1)*charsetBitSize) > (randomBytes.length() * 8)) {
+					randomBytes = Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(50);
+					blockIndex = 0;
+				}
+				randomValue = randomBytes.bitBlockAtIndexWithSize(blockIndex*charsetBitSize, charsetBitSize);
+				if (randomValue < charset.length) {
+					stringValue += charset.charAt(randomValue);
+				}
+			
+				blockIndex ++;
+			}
+		} else {
+			stringValue = "";
+		}
+		
+		this.getElement('passwordField').dom.focus()
+		this.getElement('passwordField').dom.value = stringValue;
+
+		
+		if (anEvent.src) {
+			anEvent.src().focus();
+		} else {
+			this.generateButtonElement().el.focus();
+		}
+		
+		this.setNeedsRenderingUponTabSwitch(true);
+		
+		return false;
+//MochiKit.Logging.logDebug("<<< updatePasswordValue");
+	},
+	
+	//-----------------------------------------------------
+
+	'updatePasswordLengthLabel': function() {
+		this.getElement('passwordLength').update(this.getDom('passwordField').value.length);
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+	
diff --git a/frontend/beta/js/Clipperz/PM/Components/PasswordEntropyDisplay.js b/frontend/beta/js/Clipperz/PM/Components/PasswordEntropyDisplay.js
new file mode 100644
index 0000000..530d2cb
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/PasswordEntropyDisplay.js
@@ -0,0 +1,118 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+
+Clipperz.PM.Components.PasswordEntropyDisplay = function(anElement, args) {
+	args = args || {};
+
+//MochiKit.Logging.logDebug(">>> new TextFormField");
+	Clipperz.PM.Components.PasswordEntropyDisplay.superclass.constructor.call(this, anElement, args);
+
+	this._wrapperElement = null;
+	this._entropyElement = null;
+
+	this.render();
+//MochiKit.Logging.logDebug("<<< new TextFormField");
+	
+	return this;
+};
+
+YAHOO.extendX(Clipperz.PM.Components.PasswordEntropyDisplay, Clipperz.PM.Components.BaseComponent, {
+	
+	'toString': function() {
+		return "Clipperz.PM.Components.PasswordEntropyDisplay";
+	},
+
+	//-----------------------------------------------------
+
+	'wrapperElement': function() {
+		return this._wrapperElement;
+	},
+	
+	'setWrapperElement': function(aValue) {
+		this._wrapperElement = aValue;
+	},
+	
+	//-----------------------------------------------------
+
+	'passwordElement': function() {
+		return this.element();
+	},
+	
+	//-----------------------------------------------------
+
+	'entropyElement': function() {
+		return this._entropyElement;
+	},
+	
+	'setEntropyElement': function(aValue) {
+		this._entropyElement = aValue;
+	},
+
+	//-----------------------------------------------------
+
+	'render': function() {
+		MochiKit.Signal.disconnectAllTo(this);
+
+		this.setWrapperElement(this.element().wrap({tag:'div'}));
+		this.setEntropyElement(Clipperz.YUI.DomHelper.append(this.wrapperElement().dom, {tag:'div', cls:'passwordEntropy', html:"&nbsp;"}, true));
+
+//		this.entropyElement().setWidth(this.passwordElement().getWidth());
+		this.updateEntropyElement();
+		
+		MochiKit.Signal.connect(this.element().dom, 'onkeyup', this, 'updateEntropyElement');
+		MochiKit.Signal.connect(this.element().dom, 'onchange', this, 'updateEntropyElement');
+		MochiKit.Signal.connect(this.element().dom, 'onblur', this, 'updateEntropyElement');
+	},
+
+	//-----------------------------------------------------
+
+	'computeEntropyForString': function(aValue) {
+		return Clipperz.PM.Crypto.passwordEntropy(aValue);
+	},
+
+	//-----------------------------------------------------
+
+	'updateEntropyElement': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> PasswordEntropyDisplay.updateEntropyElement");
+		var	maxExtent;
+		var	entropy;
+		
+		entropy = Math.min(128, this.computeEntropyForString(this.passwordElement().dom.value));
+//MochiKit.Logging.logDebug("--- PasswordEntropyDisplay.updateEntropyElement - entropy: " + entropy);
+		this.entropyElement().setStyle('background-position', "0px " + -entropy + "px");
+		this.entropyElement().setWidth(this.passwordElement().getWidth() * (entropy/128));
+//MochiKit.Logging.logDebug("<<< PasswordEntropyDisplay.updateEntropyElement");
+	},
+	
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
diff --git a/frontend/beta/js/Clipperz/PM/Components/PasswordGenerator.js b/frontend/beta/js/Clipperz/PM/Components/PasswordGenerator.js
new file mode 100644
index 0000000..8195f2e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/PasswordGenerator.js
@@ -0,0 +1,285 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+
+Clipperz.PM.Components.PasswordGenerator = function(anElement, aFieldValueComponent, args) {
+	args = args || {};
+
+//MochiKit.Logging.logDebug(">>> new TextFormField");
+	Clipperz.PM.Components.PasswordGenerator.superclass.constructor.call(this, anElement, args);
+
+	this._fieldValueComponent = aFieldValueComponent;
+	this._panelButton = null;
+	this.render();
+//MochiKit.Logging.logDebug("<<< new TextFormField");
+	
+	return this;
+};
+
+YAHOO.extendX(Clipperz.PM.Components.PasswordGenerator, Clipperz.PM.Components.BaseComponent, {
+	
+	'toString': function() {
+		return "Clipperz.PM.Components.PasswordGenerator";
+	},
+
+	//-----------------------------------------------------
+
+	'fieldValueComponent': function() {
+		return this._fieldValueComponent;
+	},
+	
+	//-----------------------------------------------------
+
+	'render': function() {
+		MochiKit.Signal.disconnectAllTo(this);
+		
+//		this._panelButton = new YAHOO.ext.Button(this.element().dom, {text:Clipperz.PM.Strings['passwordGeneratorButtonLabel'], handler:this.openPasswordPanel, scope:this});
+		MochiKit.Signal.connect(this.element().dom, 'onmouseenter', this, 'onMouseEnter');
+		MochiKit.Signal.connect(this.element().dom, 'onmouseleave', this, 'onMouseLeave');
+		MochiKit.Signal.connect(this.element().dom, 'onclick', this, 'openPasswordPanel');
+	},
+
+	//-----------------------------------------------------
+
+	'onMouseEnter': function() {
+		this.element().addClass('hover');
+	},
+	
+	'onMouseLeave': function() {
+		this.element().removeClass('hover');
+	},
+
+	//-----------------------------------------------------
+
+	'panelButton': function() {
+		return this._panelButton;
+	},
+
+	//-----------------------------------------------------
+	
+	'openPasswordPanel': function() {
+		var passwordGeneratorElement;
+		var passwordGeneratorDialog;
+		var cancelButton;
+		var okButton;
+		var cancelFunction;
+		var okFunction;
+		
+//MochiKit.Logging.logDebug(">>> PasswordGenerator.openPasswordPanel");
+		passwordGeneratorElement = Clipperz.YUI.DomHelper.append(document.body, {tag:'div', id:'passwordGenerator', children:[
+			{tag:'div', cls:'ydlg-hd', htmlString:Clipperz.PM.Strings['passwordGeneratorPanelTitle']},
+			{tag:'div', cls:'ydlg-bd', children:[
+				{tag:'form', id:this.getId('passwordGeneratorForm'), cls:'passwordGenerator', children:[
+					{tag:'input', type:'text', cls:'clipperz_passwordGenerator_password', id:this.getId('passwordField')},
+					{tag:'table', children:[
+						{tag:'tbody', children:[
+							{tag:'tr', children:[
+								{tag:'td', width:'20%', children:[
+									{tag:'input', type:'checkbox', name:'lowercase', id:this.getId('lowercase'), checked:true},
+									{tag:'span', htmlString:Clipperz.PM.Strings['passwordGeneratorLowercaseLabel']}
+								]},
+								{tag:'td', width:'20%', children:[
+									{tag:'input', type:'checkbox', name:'uppercase', id:this.getId('uppercase'), checked:true},
+									{tag:'span', htmlString:Clipperz.PM.Strings['passwordGeneratorUppercaseLabel']}
+								]},
+								{tag:'td', width:'20%', children:[
+									{tag:'input', type:'checkbox', name:'numbers', id:this.getId('numbers'), checked:true},
+									{tag:'span', htmlString:Clipperz.PM.Strings['passwordGeneratorNumberLabel']}
+								]},
+								{tag:'td', width:'20%', children:[
+									{tag:'input', type:'checkbox', name:'symbols', id:this.getId('symbols'), checked:true},
+									{tag:'span', htmlString:Clipperz.PM.Strings['passwordGeneratorSymbolLabel']}
+								]},
+								{tag:'td', width:'20%', children:[
+									{tag:'span', cls:'passwordGeneratorLength', children:[
+										{tag:'span', htmlString:Clipperz.PM.Strings['passwordGeneratorLengthLabel']},
+										{tag:'span', id:this.getId('passwordLength'), cls:'passwordGeneratorLengthValue', html:'0'}
+									]}
+								]}
+							]}
+						]}
+					]}
+				]}
+			]},
+			{tag:'div', cls:'ydlg-ft'}
+		]}, true);
+
+		new Clipperz.PM.Components.PasswordEntropyDisplay(this.getElement('passwordField'));
+
+		MochiKit.Signal.connect(this.getId('lowercase'), 'onclick', this, 'updatePasswordValue');
+		MochiKit.Signal.connect(this.getId('uppercase'), 'onclick', this, 'updatePasswordValue');
+		MochiKit.Signal.connect(this.getId('numbers'),   'onclick', this, 'updatePasswordValue');
+		MochiKit.Signal.connect(this.getId('symbols'),   'onclick', this, 'updatePasswordValue');
+
+		MochiKit.Signal.connect(this.getDom('passwordField'), 'onkeyup',  this, 'updatePasswordLengthLabel');
+		MochiKit.Signal.connect(this.getDom('passwordField'), 'onchange', this, 'updatePasswordLengthLabel');
+		MochiKit.Signal.connect(this.getDom('passwordField'), 'onblur',   this, 'updatePasswordLengthLabel');
+
+		this.updatePasswordValue();
+		
+		passwordGeneratorDialog = new YAHOO.ext.BasicDialog(
+			passwordGeneratorElement, { 
+				autoCreate:false,
+				closable:false,
+				modal:true,
+				autoTabs:false,
+				resizable:false,
+				fixedcenter:true,
+				constraintoviewport:false,
+				width:320,
+				height:130,
+				shadow:true,
+				minWidth:200,
+				minHeight:100
+			}
+		);
+
+		cancelFunction = MochiKit.Base.partial(MochiKit.Base.bind(this.cancelPasswordPanel, this), passwordGeneratorDialog);
+		passwordGeneratorDialog.addKeyListener(27, cancelFunction);
+		cancelButton = passwordGeneratorDialog.addButton(Clipperz.PM.Strings['passwordGeneratorPanelCancelLabel'], cancelFunction, this);
+
+		okFunction = MochiKit.Base.partial(MochiKit.Base.bind(this.okPasswordPanel, this), passwordGeneratorDialog);
+		passwordGeneratorDialog.addKeyListener([10, 13], okFunction);
+		okButton = passwordGeneratorDialog.addButton(Clipperz.PM.Strings['passwordGeneratorPanelOkLabel'], okFunction, this);
+
+		MochiKit.Signal.connect(this.getId('passwordGeneratorForm'), 'onsubmit', okFunction);
+
+		passwordGeneratorDialog.setDefaultButton(okButton);
+
+		this.fieldValueComponent().mainComponent().mainPanel().exitModalView();
+		this.fieldValueComponent().mainComponent().scrollToTop();
+
+//		passwordGeneratorDialog.show(this.panelButton().getEl());
+		passwordGeneratorDialog.show(this.element());
+		this.onMouseLeave();
+	},
+	
+	//-----------------------------------------------------
+
+	'cancelPasswordPanel': function(aPasswordGeneratorPanel) {
+		this.fieldValueComponent().mainComponent().mainPanel().enterModalView();
+		aPasswordGeneratorPanel.hide(MochiKit.Base.bind(function() {
+			aPasswordGeneratorPanel.destroy(true);
+			MochiKit.Signal.disconnectAllTo(this);
+		}, this));
+	},
+
+	//-----------------------------------------------------
+
+	'updatePasswordLengthLabel': function() {
+		this.getElement('passwordLength').update(this.getDom('passwordField').value.length);
+	},
+	
+	//-----------------------------------------------------
+
+	'okPasswordPanel': function(aPasswordGeneratorPanel, anEvent) {
+//MochiKit.Logging.logDebug(">>> PasswordGenerator.okPasswordPanel");
+
+		if (anEvent.stop) {
+			anEvent.stop();
+		}
+		
+		this.fieldValueComponent().inputElement().dom.focus();
+		this.fieldValueComponent().inputElement().dom.value = this.getElement('passwordField').dom.value;
+		this.getElement('passwordField').dom.focus();
+		this.cancelPasswordPanel(aPasswordGeneratorPanel);
+		
+		return false;
+	},
+
+	//-----------------------------------------------------
+
+	'updatePasswordValue': function(anEvent) {
+		var	randomBytes;
+		var	randomValue;
+		var charset;
+		var charsetBitSize;
+		var stringValue;
+		var	blockIndex;
+
+//MochiKit.Logging.logDebug(">>> updatePasswordValue");
+		randomBytes = Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(50);
+		stringValue = "";
+		blockIndex = 0;
+
+		charset = "";
+		if (this.getDom('lowercase').checked) {
+			charset += Clipperz.PM.Strings['passwordGeneratorLowercaseCharset'];
+		}
+		if (this.getDom('uppercase').checked) {
+			charset += Clipperz.PM.Strings['passwordGeneratorUppercaseCharset'];
+		}
+		if (this.getDom('numbers').checked) {
+			charset += Clipperz.PM.Strings['passwordGeneratorNumberCharset'];
+		}
+		if (this.getDom('symbols').checked) {
+			charset += Clipperz.PM.Strings['passwordGeneratorSymbolCharset'];
+		}
+
+		charsetBitSize = 0;
+		while (Math.pow(2, charsetBitSize) < charset.length) {
+			charsetBitSize ++;
+		}
+
+		if (charsetBitSize > 0) {
+			while (Clipperz.PM.Crypto.passwordEntropy(stringValue) < 128) {
+				if (((blockIndex + 1)*charsetBitSize) > (randomBytes.length() * 8)) {
+					randomBytes = Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(50);
+					blockIndex = 0;
+				}
+				randomValue = randomBytes.bitBlockAtIndexWithSize(blockIndex*charsetBitSize, charsetBitSize);
+				if (randomValue < charset.length) {
+					stringValue += charset.charAt(randomValue);
+				}
+			
+				blockIndex ++;
+			}
+		} else {
+			stringValue = "";
+		}
+		
+		this.getElement('passwordField').dom.focus()
+		this.getElement('passwordField').dom.value = stringValue;
+
+		
+		if (anEvent) {
+			anEvent.src().focus();
+		} else {
+			this.element().focus();
+		}
+		
+		return false;
+//MochiKit.Logging.logDebug("<<< updatePasswordValue");
+	},
+	
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
diff --git a/frontend/beta/js/Clipperz/PM/Components/Printing/Footer.js b/frontend/beta/js/Clipperz/PM/Components/Printing/Footer.js
new file mode 100644
index 0000000..6bede3e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Printing/Footer.js
@@ -0,0 +1,28 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Printing/Header.js b/frontend/beta/js/Clipperz/PM/Components/Printing/Header.js
new file mode 100644
index 0000000..6bede3e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Printing/Header.js
@@ -0,0 +1,28 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/Printing/Record.js b/frontend/beta/js/Clipperz/PM/Components/Printing/Record.js
new file mode 100644
index 0000000..910d4b1
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/Printing/Record.js
@@ -0,0 +1,95 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.Printing) == 'undefined') { Clipperz.PM.Components.Printing = {}; }
+
+Clipperz.PM.Components.Printing.Record = function(args) {
+	args = args || {};
+
+	this._record = args['record'];
+
+	return this;
+}
+
+MochiKit.Base.update(Clipperz.PM.Components.Printing.Record.prototype, {
+
+	'record': function() {
+		return this._record;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'deferredDrawToWindow': function(aWindow) {
+		var	deferredResult;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(this.record(), 'deferredData'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'appendToWindow', aWindow));
+		deferredResult.callback();
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'appendToWindow': function(aWindow) {
+		MochiKit.DOM.withWindow(aWindow, MochiKit.Base.bind(function() {
+			var newBlock;
+			var fields;
+			
+			fields = MochiKit.Base.concat(
+				MochiKit.Base.map(MochiKit.Base.bind(function(aField) {
+					var result;
+					var dt, dd;
+					var label, value;
+					
+					label = aField.label();
+					value = aField.value();
+					dt = MochiKit.DOM.createDOM('DT', null, label);
+					dd = MochiKit.DOM.createDOM('DD', null, value)
+					result = [dt, dd];
+
+					return result
+				}, this), MochiKit.Base.values(this.record().currentVersion().fields()))
+			);
+
+			newBlock = MochiKit.DOM.DIV({'class': 'recordBlock'},
+				MochiKit.DOM.H2(null, this.record().label()),
+				MochiKit.DOM.DIV({'class': 'recordNotes'}, MochiKit.Base.map(MochiKit.Base.partial(MochiKit.DOM.P, null), this.record().notes().split("\n"))),
+				MochiKit.DOM.createDOM('DL', null, fields)
+			);
+			MochiKit.DOM.appendChildNodes(MochiKit.DOM.currentDocument().body, newBlock);
+			
+		}, this));
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/AbstractComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/AbstractComponent.js
new file mode 100644
index 0000000..840d555
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/AbstractComponent.js
@@ -0,0 +1,105 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.AbstractComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.AbstractComponent.superclass.constructor.call(this, args);
+
+	this._element = anElement;
+	this._mainComponent = args.mainComponent;
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.AbstractComponent, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.AbstractComponent";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'mainComponent': function() {
+		return this._mainComponent;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'record': function() {
+		return this.mainComponent().record();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'editMode': function() {
+		return this.mainComponent().editMode();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		this.element().update("");
+		this.update();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'update': function(anEvent) {
+		if (this.editMode() == 'EDIT') {
+			this.updateEditMode();
+		} else if (this.editMode() == 'VIEW') {
+			this.updateViewMode();
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {},
+	'updateEditMode': function() {},
+	'synchronizeComponentValues': function() {},
+	
+	//-------------------------------------------------------------------------
+
+	'destroy': function() {
+		this.element().remove();
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/AbstractFieldSubComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/AbstractFieldSubComponent.js
new file mode 100644
index 0000000..7596184
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/AbstractFieldSubComponent.js
@@ -0,0 +1,77 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.AbstractFieldSubComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.AbstractFieldSubComponent.superclass.constructor.call(this, anElement, args);
+
+	this._fieldComponent = args.fieldComponent || null;
+	
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.AbstractFieldSubComponent, Clipperz.PM.Components.RecordDetail.AbstractComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.AbstractFieldSubComponent";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'fieldComponent': function() {
+		return this._fieldComponent;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'mainComponent': function() {
+		return this.fieldComponent().mainComponent();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'recordField': function() {
+		return this.fieldComponent().recordField();
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/CreationWizard.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/CreationWizard.js
new file mode 100644
index 0000000..a92285f
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/CreationWizard.js
@@ -0,0 +1,317 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.CreationWizard = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.CreationWizard.superclass.constructor.call(this, anElement, args);
+
+	this._mainComponent = args.mainComponent;
+	this._previouslySelectedRecord = args.previouslySelectedRecord;
+//MochiKit.Logging.logDebug("--- new CreationWizard - previouslySelectedRecord: " + args.previouslySelectedRecord);
+	this._createButton_header = null;
+	this._createButton_footer = null;
+
+	this._cancelButton_header = null;
+	this._cancelButton_footer = null;
+	
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.CreationWizard, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.CreationWizard component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'previouslySelectedRecord': function() {
+		return this._previouslySelectedRecord;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		var	templateListElement;
+		var	templates;
+		
+		this.element().update("");
+		
+		Clipperz.YUI.DomHelper.append(this.element().dom,
+			{tag:'form', cls:'recordDataFORM', id:this.getId('form'), children:[
+				{tag:'div', id:'recordDetailDataBox', cls:'recordDetailDataBox', children:[
+					{tag:'div', id:this.getId('wizardBox'), cls:'recordCreationWizard', children:[
+						{tag:'div', id:this.getId('recordCreationWizardTitleBox'), cls:'recordCreationWizardTitleBox', htmlString:Clipperz.PM.Strings['newRecordWizardTitleBox']},
+						{tag:'ul', id:this.getId('templateList'), cls:'radioList'}
+					]}
+				]}
+			]}
+		);
+
+		Clipperz.YUI.DomHelper.append(this.getDom('recordCreationWizardTitleBox'), {tag:'div', cls:'newRecordWizardHeader', children:[
+			{tag:'table', width:'100%', cellpadding:'5', children:[
+				{tag:'tbody', children:[
+					{tag:'tr', children:[
+						{tag:'td', width:'49%', align:'right', children:[
+							{tag:'div', id:this.getId('cancelButton_header')}
+						]},
+						{tag:'td', width:'10', html:'&nbsp;'},
+						{tag:'td', width:'49%', align:'left', children:[
+							{tag:'div', id:this.getId('createButton_header')}
+						]}
+					]}
+				]}
+			]}
+		]});
+
+		templateListElement = this.getElement('templateList');
+		templates = Clipperz.PM.Strings['recordTemplates'];
+		MochiKit.Iter.forEach(MochiKit.Base.keys(templates), MochiKit.Base.bind(function(aTemplateKey) {
+			Clipperz.YUI.DomHelper.append(templateListElement.dom, {tag:'li', children:[
+				{tag:'table', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', valign:'top', children:[
+								{tag:'input', id:this.getId(aTemplateKey+"_radio"), type:'radio', name:'recordTemplate', value:"aTemplateKey"}
+							]},
+							{tag:'td', valign:'top', children:[
+								{tag:'h4', id:this.getId(aTemplateKey+"_title"), html:templates[aTemplateKey]['title']},
+								{tag:'div', cls:'templateDescription', htmlString:templates[aTemplateKey]['description']}
+							]}
+						]}
+					]}
+				]}
+			]});
+			this.getElement(aTemplateKey+"_radio").dom.value = aTemplateKey;
+			MochiKit.Signal.connect(this.getDom(aTemplateKey+"_title"), 'onclick', MochiKit.Base.partial(function(aRadioButton) {aRadioButton.click();}, this.getDom(aTemplateKey+"_radio")));
+		}, this));
+
+		Clipperz.YUI.DomHelper.append(templateListElement.dom, {tag:'li', children:[
+			{tag:'table', children:[
+				{tag:'tbody', children:[
+					{tag:'tr', children:[
+						{tag:'td', valign:'top', children:[
+							{tag:'input', type:'radio', name:'recordTemplate', id:this.getId('bookmarkletRadioButton'), value:'BookmarkletConfigurationTemplate'}
+						]},
+						{tag:'td', valign:'top', children:[
+							{tag:'h4', htmlString:Clipperz.PM.Strings['newRecordWizardBookmarkletConfigurationTitle']},
+							{tag:'div', cls:'templateDescription', htmlString:Clipperz.PM.Strings['newRecordWizardBookmarkletConfigurationDescription']},
+							{tag:'div', cls:'bookmarkletConfiguration', children:[
+//								{tag:'span', htmlString:Clipperz.PM.Strings['newRecordWizardBookmarkletConfigurationLabel']},
+								{tag:'div', htmlString:Clipperz.PM.Strings['recordDetailNewDirectLoginDescription']},
+								{tag:'textarea', id:this.getId('bookmarkletConfiguration')}
+							]}
+						]}
+					]}
+				]}
+			]}
+		]});
+
+		Clipperz.YUI.DomHelper.append(this.getDom('wizardBox'), {tag:'div', cls:'newRecordWizardFooter', children:[
+			{tag:'table', width:'100%', cellpadding:'5', children:[
+				{tag:'tbody', children:[
+					{tag:'tr', children:[
+						{tag:'td', width:'49%', align:'right', children:[
+							{tag:'div', id:this.getId('cancelButton_footer')}
+						]},
+						{tag:'td', width:'10', html:'&nbsp;'},
+						{tag:'td', width:'49%', align:'left', children:[
+							{tag:'div', id:this.getId('createButton_footer')}
+						]}
+					]}
+				]}
+			]}
+		]});
+		
+		this.setCreateButton_header(new YAHOO.ext.Button(this.getDom('createButton_header'), {text:Clipperz.PM.Strings['newRecordWizardCreateButtonLabel'], handler:this.createRecord, scope:this}));
+		this.setCreateButton_footer(new YAHOO.ext.Button(this.getDom('createButton_footer'), {text:Clipperz.PM.Strings['newRecordWizardCreateButtonLabel'], handler:this.createRecord, scope:this}));
+
+		this.setCancelButton_header(new YAHOO.ext.Button(this.getDom('cancelButton_header'), {text:Clipperz.PM.Strings['newRecordWizardCancelButtonLabel'], handler:this.exitWizard, scope:this}));
+		this.setCancelButton_footer(new YAHOO.ext.Button(this.getDom('cancelButton_footer'), {text:Clipperz.PM.Strings['newRecordWizardCancelButtonLabel'], handler:this.exitWizard, scope:this}));
+
+		this.createButton_header().disable();
+		this.createButton_footer().disable();
+		
+		MochiKit.Iter.forEach(this.getElement('form').getChildrenByTagName('input'), MochiKit.Base.bind(function(anInput) {
+//			MochiKit.Signal.connect(anInput.dom, 'onchange', this, 'enableCreateButton');
+			MochiKit.Signal.connect(anInput.dom, 'onclick', this, 'enableCreateButton');	//	for Safari
+		},this));
+
+		MochiKit.Signal.connect(this.getDom('bookmarkletConfiguration'), 'onkeyup', this, 'enableCreateButton');
+		MochiKit.Signal.connect(this.getDom('bookmarkletConfiguration'), 'onkeydown', this, 'enableCreateButton');	//	for Safari
+	},
+
+	//-------------------------------------------------------------------------
+
+	'createButton_header': function() {
+		return this._createButton_header;
+	},
+	
+	'setCreateButton_header': function(aValue) {
+		this._createButton_header = aValue;
+	},
+
+	//.........................................................................
+
+	'createButton_footer': function() {
+		return this._createButton_footer;
+	},
+	
+	'setCreateButton_footer': function(aValue) {
+		this._createButton_footer = aValue;
+	},
+
+
+	//-------------------------------------------------------------------------
+
+	'cancelButton_header': function() {
+		return this._cancelButton_header;
+	},
+	
+	'setCancelButton_header': function(aValue) {
+		this._cancelButton_header = aValue;
+	},
+
+	//.........................................................................
+	
+	'cancelButton_footer': function() {
+		return this._cancelButton_footer;
+	},
+	
+	'setCancelButton_footer': function(aValue) {
+		this._cancelButton_footer = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'enableCreateButton': function(anEvent, skipKeyDownCheck) {
+//MochiKit.Logging.logDebug(">>> CreationWizard.enableCreateButton (" + anEvent.type() + ")");
+		if ((anEvent.type() == "keydown") && (skipKeyDownCheck != true)) {
+//MochiKit.Logging.logDebug("--- CreationWizard.enableCreateButton - handling 'keydown' event with a postponed execution of the check");
+			MochiKit.Async.callLater(0.3, MochiKit.Base.method(this, 'enableCreateButton', anEvent, true));
+		} else {
+			var shouldEnableCreateButton;
+			var isBookmarkletConfigurationEmpty;
+
+//MochiKit.Logging.logDebug("--- CreationWizard.enableCreateButton - common execution");
+
+			shouldEnableCreateButton = true;
+			
+			isBookmarkletConfigurationEmpty = !/[^ \n]/.test(this.getDom('bookmarkletConfiguration').value);
+//MochiKit.Logging.logDebug("--- CreationWizard.enableCreateButton - isBookmarkletConfigurationEmpty: " + isBookmarkletConfigurationEmpty);
+
+			if ((anEvent.src() == this.getDom('bookmarkletConfiguration')) && !isBookmarkletConfigurationEmpty) {
+				this.getDom('bookmarkletRadioButton').checked = true;
+			}
+
+			if ((this.getDom('bookmarkletRadioButton').checked) && isBookmarkletConfigurationEmpty) {
+				shouldEnableCreateButton = false;
+			}
+		
+			if (shouldEnableCreateButton) {
+//MochiKit.Logging.logDebug("--- CreationWizard.enableCreateButton - enabling button");
+				this.createButton_header().enable();
+				this.createButton_footer().enable();
+			} else {
+//MochiKit.Logging.logDebug("--- CreationWizard.enableCreateButton - disabling button");
+				this.createButton_header().disable();
+				this.createButton_footer().disable();
+			}
+		}
+//MochiKit.Logging.logDebug("<<< CreationWizard.enableCreateButton");
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'createRecord': function() {
+		var	selectedTemplateKey;
+		var	newRecord;
+		
+		selectedTemplateKey = MochiKit.Base.filter(function(aCheckBoxElement) {
+			return aCheckBoxElement.dom.checked;
+		},this.getElement('form').getChildrenByTagName('input'))[0].dom.value;
+
+//MochiKit.Logging.logDebug("--- CreationWizard.createRecord - selectedTemplateKey: " + selectedTemplateKey);
+		if (selectedTemplateKey == 'BookmarkletConfigurationTemplate') {
+			var bookmarkletConfiguration;
+
+			this.mainComponent().exitModalView();
+			bookmarkletConfiguration = Clipperz.PM.BookmarkletProcessor.checkBookmarkletConfiguration(this.getDom('bookmarkletConfiguration').value, this.getDom('createButton'), MochiKit.Base.method(this.mainComponent(), 'enterModalView'));
+			this.mainComponent().enterModalView();
+			newRecord = Clipperz.PM.BookmarkletProcessor.createRecordFromBookmarkletConfiguration(this.mainComponent().user(), bookmarkletConfiguration);
+		} else {
+			var	fieldsConfigurations;
+
+			newRecord = this.mainComponent().user().addNewRecord();
+			newRecord.setLabel(Clipperz.PM.Strings['recordTemplates'][selectedTemplateKey]['title']);
+			
+			fieldsConfigurations = Clipperz.PM.Strings['recordTemplates'][selectedTemplateKey]['fields'];
+		
+			MochiKit.Iter.forEach(fieldsConfigurations, MochiKit.Base.partial(function(aRecord, aFieldConfiguration) {
+				var newField;
+			
+				newField = new Clipperz.PM.DataModel.RecordField({recordVersion:aRecord.currentVersion()});
+				newField.setLabel(aFieldConfiguration['label']);
+				newField.setType(aFieldConfiguration['type']);
+				aRecord.currentVersion().addField(newField);
+			}, newRecord));
+		}
+		
+		this.mainComponent().exitWizard(newRecord, true);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'exitWizard': function() {
+//MochiKit.Logging.logDebug(">>> CreationWizard.exitWizard - " + this.previouslySelectedRecord());
+		this.mainComponent().exitWizard(this.previouslySelectedRecord());
+//MochiKit.Logging.logDebug("<<< CreationWizard.exitWizard");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'mainComponent': function() {
+		return this._mainComponent;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginBindingComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginBindingComponent.js
new file mode 100644
index 0000000..6171a4e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginBindingComponent.js
@@ -0,0 +1,174 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.DirectLoginBindingComponent = function(anElement, args) {
+//MochiKit.Logging.logDebug(">>> new DirectLoginBindingComponent");
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.DirectLoginBindingComponent.superclass.constructor.call(this, anElement, args);
+
+	this._directLoginBinding = args.directLoginBinding || null;
+	this.render();
+
+	Clipperz.NotificationCenter.register(this.record(), 'addNewRecordField',	this, 'syncAndUpdateEditMode');
+	Clipperz.NotificationCenter.register(this.record(), 'removedField',		this, 'syncAndUpdateEditMode');
+	Clipperz.NotificationCenter.register(this.record(), 'updatedFieldLabel',	this, 'syncAndUpdateEditMode');
+//MochiKit.Logging.logDebug("<<< new DirectLoginBindingComponent");
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.DirectLoginBindingComponent, Clipperz.PM.Components.RecordDetail.AbstractComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.DirectLoginBindingComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'directLoginBinding': function() {
+		return this._directLoginBinding;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'span', style:'font-weight:bold;', html:this.directLoginBinding().key()})
+//		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'span', html:this.directLoginBinding().value()})
+//MochiKit.Logging.logDebug(">>> DirectLoginBindingComponent.render");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td', cls:'directLoginBindingLabelTD', children:[
+			{tag:'span', html:this.directLoginBinding().key()}
+		]});
+//MochiKit.Logging.logDebug("--- DirectLoginBindingComponent.render - 1");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td', cls:'directLoginBindingValueTD', children:[
+			{tag:'div', id:this.getId('editModeBox'), children:[
+				{tag:'select', id:this.getId('select'), children:this.recordFieldOptions()}
+			]},
+			{tag:'div', id:this.getId('viewModeBox'), children:[
+				{tag:'span', id:this.getId('viewValue'), html:""}
+			]}
+		]});
+//MochiKit.Logging.logDebug("--- DirectLoginBindingComponent.render - 2");
+		this.getElement('editModeBox').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+		this.getElement('viewModeBox').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+
+		this.update();
+//MochiKit.Logging.logDebug("<<< DirectLoginBindingComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'recordFieldOptions': function() {
+		var	result;
+		var option;
+		var	recordFieldKey;
+		var	recordFields;
+
+//MochiKit.Logging.logDebug(">>> DirectLoginBindingComponent.recordFieldOptions");
+		recordFields = this.directLoginBinding().directLogin().record().currentVersion().fields();
+		result = [];
+		option = {tag:'option', value:null, html:'---'};
+		result.push(option);
+		for (recordFieldKey in recordFields) {
+//	TODO: remove the value: field and replace it with element.dom.value = <some value>
+			option = {tag:'option', value:recordFieldKey, html:recordFields[recordFieldKey].label()}
+			if (recordFieldKey == this.directLoginBinding().fieldKey()) {
+				option['selected'] = true;
+			}
+			result.push(option);
+		}
+//MochiKit.Logging.logDebug("<<< DirectLoginBindingComponent.recordFieldOptions");
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'syncAndUpdateEditMode': function() {
+		this.synchronizeComponentValues();
+		this.updateEditMode();
+	},
+	
+	'updateEditMode': function() {
+		var	selectElementBox;
+
+//MochiKit.Logging.logDebug(">>> DirectLoginBindingComponent.updateEditMode");
+		this.getElement('viewModeBox').hide();
+
+		selectElementBox = this.getElement('editModeBox');
+		selectElementBox.update("");
+
+		Clipperz.YUI.DomHelper.append(selectElementBox.dom, {tag:'select', id:this.getId('select'), children:this.recordFieldOptions()});
+
+/*
+		selectElement = this.getElement('select');
+		
+		selectElement.update("");
+		MochiKit.Iter.forEach(this.recordFieldOptions(), function(anOption) {
+			Clipperz.YUI.DomHelper.append(selectElement.dom, anOption);
+		});
+*/
+
+
+		this.getElement('editModeBox').show();
+//MochiKit.Logging.logDebug("<<< DirectLoginBindingComponent.updateEditMode");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginBindingComponent.updateViewMode");
+		this.getElement('editModeBox').hide();
+		this.getElement('viewModeBox').show();
+
+		this.getElement('viewValue').update(this.directLoginBinding().field().label());
+//MochiKit.Logging.logDebug("<<< DirectLoginBindingComponent.updateViewMode");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'synchronizeComponentValues': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginBindingComponent.synchronizeComponentValues")
+//MochiKit.Logging.logDebug("--- DirectLoginBindingComponent.synchronizeComponentValues - 1 - " + this.getId('select'));
+		this.directLoginBinding().setFieldKey(this.getDom('select').value);
+//MochiKit.Logging.logDebug("<<< DirectLoginBindingComponent.synchronizeComponentValues");
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginComponent.js
new file mode 100644
index 0000000..7638f00
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginComponent.js
@@ -0,0 +1,362 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.DirectLoginComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.DirectLoginComponent.superclass.constructor.call(this, anElement, args);
+
+	this._directLogin = args.directLogin || null;
+//	this._titleElement = null;
+	this._structureElement = null;
+	this._removeButton = null;
+	this._directLoginBindingComponents = null;
+	this._collapser = null;
+	
+	this.mainComponent().addEditComponent(this);
+	this.render();
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.DirectLoginComponent, Clipperz.PM.Components.RecordDetail.AbstractComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.DirectLoginComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'directLogin': function() {
+		return this._directLogin;
+	},
+
+	'directLoginBindingComponents': function() {
+		return this._directLoginBindingComponents;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'removeDirectLogin': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginComponent.removeDirectLogin");
+		this.mainComponent().synchronizeComponentValues();
+		this.directLogin().remove();
+		this.mainComponent().removeEditComponent(this);
+		this.mainComponent().render();
+//MochiKit.Logging.logDebug("<<< DirectLoginComponent.removeDirectLogin");
+	},
+
+	//-------------------------------------------------------------------------
+/*
+	'formDataValue': function() {
+		return Clipperz.Base.serializeJSON(this.directLogin().formData());
+	},
+	
+	'setFormDataValue': function(aValue) {
+		
+	},
+*/	
+	//-------------------------------------------------------------------------
+
+	'removeButton': function() {
+		return this._removeButton;
+	},
+	
+	'setRemoveButton': function(aValue) {
+		this._removeButton = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+/*
+	'titleElement': function() {
+		return this._titleElement;
+	},
+	
+	'setTitleElement': function(aValue) {
+		this._titleElement = aValue;
+	},
+*/	
+	//-------------------------------------------------------------------------
+
+	'structureElement': function() {
+		return this._structureElement;
+	},
+	
+	'setStructureElement': function(aValue) {
+		this._structureElement = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginComponent.render");
+		try {
+			this.element().update("");
+			Clipperz.YUI.DomHelper.append(this.element().dom,
+				{tag:'li', children:[
+					{tag:'table', width:'100%', border:'0', cellpadding:'0', cellspacing:'0', children:[
+						{tag:'tbody', children:[
+							{tag:'tr', children:[
+								{tag:'td', rowspan:'2', width:'30', valign:'top', html:'&#160', children:[
+									{tag:'div', id:this.getId('removeDirectLogin'), children:[
+										{tag:'div', id:this.getId('removeDirectLoginButton')}
+									]},
+									{tag:'div', id:this.getId('collapseLink'), cls:'directLoginCollapseLink'}
+								]},
+								{tag:'td', valign:'top', children:[
+									{tag:'table', width:'100%', border:'0', cellpadding:'0', cellspacing:'0', children:[
+										{tag:'tbody', children:[
+											{tag:'tr', children:[
+												{tag:'td', width:'20', valign:'top', children:[
+													{tag:'a', href:'#', id:this.getId('directLogin'), children:[
+														{tag:'img', id:this.getId('faviconImage'), width:'16', height:'16', src:this.directLogin().fixedFavicon()}
+													]}
+												]},
+												{tag:'td', valign:'top', children:[
+													{tag:'div', cls:'directLoginDetailTitle', children:[
+														{tag:'div', id:this.getId('titleViewBox'), children:[
+															{tag:'a', href:'#', id:this.getId('titleLink')}
+														]},
+														{tag:'div', id:this.getId('titleEditBox'), children:[
+															{tag:'input', type:'text', id:this.getId('titleInput')}
+														]}
+													]}
+												]}
+											]}
+										]}
+									]}
+								]}
+							]},
+							{tag:'tr', children:[
+								{tag:'td', /*colspan:'2',*/ children:[
+									{tag:'div', id:this.getId('details'), children:[
+										{tag:'table', cls:'directLoginBindings', border:'0', cellpadding:'0', cellspacing:'0', children:[
+											{tag:'tbody', id:this.getId('tbodyBindings'), children:[]}
+										]}
+									]}
+								]}
+							]}
+						]}
+					]}
+				]}
+			);
+
+			MochiKit.Signal.connect(this.getId('faviconImage'), 'onload', this, 'handleLoadedFaviconImage');
+			MochiKit.Signal.connect(this.getId('faviconImage'), 'onerror', this.directLogin(), 'handleMissingFaviconImage');
+			MochiKit.Signal.connect(this.getId('faviconImage'), 'onabort', this.directLogin(), 'handleMissingFaviconImage');
+
+			this.getElement('removeDirectLogin').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 1");
+			this.getElement('collapseLink').addClassOnOver('hover');
+			this._collapser = new Clipperz.YUI.Collapser(this.getElement('collapseLink'), this.getElement('details'), true);
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 2");
+			MochiKit.Signal.connect(this.getId('directLogin'), 'onclick', this, 'runDirectLogin');
+//			this.getElement('directLogin').on('click', this.runDirectLogin, this, false);
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 3");
+//			this.setTitleElement(new Clipperz.PM.Components.TextFormField(this.getElement('title'), {
+//														editMode:this.editMode(),
+//														value:this.directLogin().label()
+//			}));
+			this.getElement('titleViewBox').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+			this.getElement('titleEditBox').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+//-			this.getElement('titleLink').on('click', this.runDirectLogin, this, false);
+			MochiKit.Signal.connect(this.getId('titleLink'), 'onclick', this, 'runDirectLogin');
+
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 4");
+//-			this.setStructureElement(new Clipperz.PM.Components.TextFormField(this.getElement('formStructure'), {
+//-														editMode:this.editMode(),
+//-														value:this.formDataValue(), multiline:true
+//-			}));
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 5");
+			{
+				var	bindingKey;
+				var valueName;
+				var inputsRequiringAdditionalValues;
+				var bindingsElement;
+				var i,c;
+			
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 6");
+				this._directLoginBindingComponents = [];
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 7");
+				bindingsElement = this.getElement('tbodyBindings');
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 8");
+				for (bindingKey in this.directLogin().bindings()) {
+					try {
+						var directLoginBindingElement;
+						var directLoginBindingComponent;
+				
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 9");
+						directLoginBindingElement = Clipperz.YUI.DomHelper.append(bindingsElement.dom, {tag:'tr'}, true);
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 10");
+						directLoginBindingComponent =	new Clipperz.PM.Components.RecordDetail.DirectLoginBindingComponent(directLoginBindingElement, {
+																mainComponent:this,
+																directLoginBinding:this.directLogin().bindings()[bindingKey]
+															});
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 11");
+						this._directLoginBindingComponents.push(directLoginBindingComponent);
+					} catch (e) {
+						MochiKit.Logging.logError("Error while rendering a DirectLoginBindingComponent - " + e);
+					}
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 12");
+				}
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 13");
+
+				inputsRequiringAdditionalValues = this.directLogin().inputsRequiringAdditionalValues();
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 13.1");
+				for (valueName in inputsRequiringAdditionalValues) {
+//-					Clipperz.YUI.DomHelper.append(bindingsElement.dom, {tag:'tr', children:[
+//-						{tag:'td', html:valueName},
+//-						{tag:'td', children:inputsRequiringAdditionalValues[valueName].inputElementConfiguration()}
+//-					]}, true)
+					var directLoginValueElement;
+					var directLoginValueComponent;
+				
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 13.2");
+					directLoginValueElement = Clipperz.YUI.DomHelper.append(bindingsElement.dom, {tag:'tr'}, true);
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 13.3");
+					directLoginValueComponent =	new Clipperz.PM.Components.RecordDetail.DirectLoginValueComponent(directLoginValueElement, {
+															mainComponent:this,
+															directLoginInputValue:inputsRequiringAdditionalValues[valueName]
+														});
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 13.4");
+					this._directLoginBindingComponents.push(directLoginValueComponent);
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 13.5");
+				}
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 13.6");
+			}
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 14");
+			this.setRemoveButton(new YAHOO.ext.Button(this.getDom('removeDirectLoginButton'), {text:Clipperz.PM.Strings['recordDetailDeleteDirectLoginButtonLabel'], handler:this.removeDirectLogin, scope:this}));
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.render - 15");
+			this.update();
+		} catch (e) {
+			MochiKit.Logging.logError("Error while rendering a DirectLoginComponent - " + e);
+		}
+//MochiKit.Logging.logDebug("<<< DirectLoginComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'collapser': function() {
+		return this._collapser;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'handleLoadedFaviconImage': function(anEvent) {
+		MochiKit.Signal.disconnectAll(anEvent.src())
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'update': function() {
+		var i,c;
+		var bindingComponents;
+
+//MochiKit.Logging.logDebug(">>> DirectLoginComponent.update");
+		bindingComponents = this.directLoginBindingComponents();
+		c = bindingComponents.length;
+		for (i=0; i<c; i++) {
+			bindingComponents[i].update();
+		}
+		
+    	Clipperz.PM.Components.RecordDetail.DirectLoginComponent.superclass.update.call(this);
+//MochiKit.Logging.logDebug("<<< DirectLoginComponent.update");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'updateEditMode': function() {
+//		this.element().update("");
+//		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', style:'border:4px solid red; padding:10px;', children:[
+//			{tag:'div', style:'font-weight:bold;', html:this.directLogin().label()},
+//			{tag:'div', style:'border:1px solid #aaaaaa;', html:Clipperz.Base.serializeJSON(this.directLogin().formData())},
+//			{tag:'div', style:'border:1px solid #aaaaaa;', html:Clipperz.Base.serializeJSON(this.directLogin().bindings())}
+//		]});
+		
+		this.getElement('titleEditBox').show();
+		this.getElement('titleViewBox').hide();
+		
+		this.getDom('titleInput').value = this.directLogin().label();
+		
+//MochiKit.Logging.logDebug(">>> DirectLoginComponent.updateEditMode");
+		this.collapser().expand();
+		this.getElement('collapseLink').hide();
+		this.getElement('removeDirectLogin').show();
+//		this.removeButton().show();
+//MochiKit.Logging.logDebug("<<< DirectLoginComponent.updateEditMode");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginComponent.updateViewMode");
+		this.getElement('titleEditBox').hide();
+		this.getElement('titleViewBox').show();
+		this.getElement('titleLink').update(this.directLogin().label());
+
+		this.getElement('collapseLink').show();
+		this.getElement('removeDirectLogin').hide();
+//		this.removeButton().hide();
+//MochiKit.Logging.logDebug("<<< DirectLoginComponent.updateViewMode");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'synchronizeComponentValues': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginComponent.syncronizeComponentValues");
+		this.directLogin().setLabel(this.getDom('titleInput').value);
+//		this.setFormDataValue(this.structureElement().value());
+		
+		MochiKit.Iter.forEach(this.directLoginBindingComponents(), MochiKit.Base.methodcaller('synchronizeComponentValues'));
+//MochiKit.Logging.logDebug("<<< DirectLoginComponent.syncronizeComponentValues");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'runDirectLogin': function(anEvent) {
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.runDirectLogin - 1");
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.runDirectLogin - 1 anEvent: " + anEvent);
+		anEvent.stop();
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.runDirectLogin - 2");
+		this.directLogin().runDirectLogin();
+//MochiKit.Logging.logDebug("--- DirectLoginComponent.runDirectLogin - 3");
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginValueComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginValueComponent.js
new file mode 100644
index 0000000..e70229b
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginValueComponent.js
@@ -0,0 +1,257 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.DirectLoginValueComponent = function(anElement, args) {
+//MochiKit.Logging.logDebug(">>> new DirectLoginValueComponent");
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.DirectLoginValueComponent.superclass.constructor.call(this, anElement, args);
+
+	this._directLoginInputValue = args.directLoginInputValue || null;
+	this._value = this.directLoginInputValue().directLogin().formValues()[this.directLoginInputValue().name()];
+	
+	this.render();
+//MochiKit.Logging.logDebug("<<< new DirectLoginValueComponent - record: " + this.record());
+
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.DirectLoginValueComponent, Clipperz.PM.Components.RecordDetail.AbstractComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.DirectLoginValueComponent component - " + this.directLoginInputValue().name();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'directLoginInputValue': function() {
+		return this._directLoginInputValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginValueComponent.render");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td', cls:'directLoginDataLabelTD', children:[
+			{tag:'span', html:this.directLoginInputValue().name()}
+		]});
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.render - 1");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td', cls:'directLoginDataValueTD', children:[
+			{tag:'span', id:this.getId('inputElement')}
+		]});
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.render - 2");
+		this.update();
+//MochiKit.Logging.logDebug("<<< DirectLoginValueComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'inputElementConfiguration': function() {
+		var result;
+		var currentValue;
+
+//MochiKit.Logging.logDebug(">>> DirectLoginValueComponent.inputElementConfiguration - " + this.directLoginInputValue().name());
+		result = [];
+		currentValue = this.value();
+		
+		switch (this.directLoginInputValue().type()) {
+			case 'checkbox':
+				var checkbox;
+//{"type":"checkbox", "name":"rememberUsernameChk", "value":"checkbox"}
+				checkbox = {tag:'input', id:this.getId('checkbox'), type:'checkbox'}
+				if (currentValue == true) {
+					checkbox.checked = true;
+				}
+				result.push(checkbox);
+				break;
+				
+			case 'select':
+				var input;
+//{"type":"select", "name":"DOMAIN", "options":[{"selected":true, "label":"@tin.it", "value":"tin.it"}, {"selected":false, "label":"@virgilio.it", "value":"virgilio.it"}]}
+				input = {tag:'select', id:this.getId('select'), name:this.directLoginInputValue().name(), children:[]};
+				input.children.push({tag:'option', value:null, html:"---"});
+				MochiKit.Iter.forEach(this.directLoginInputValue().args()['options'], function(anOption) {
+					var option;
+					
+//	TODO: remove the value: field and replace it with element.dom.value = <some value>
+					option = {tag:'option', value:anOption['value'], html:anOption['label']}
+					if (currentValue == anOption['value']) {
+						option.selected = true;
+					}
+					input.children.push(option);
+				})
+				result.push(input);
+				break;
+				
+			case 'radio':
+				var name;
+				var radioBox;
+				
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.inputElementConfiguration - 3");
+				name = this.getId(this.directLoginInputValue().name());
+				radioBox = {tag:'div', id:this.getId('radioBox'), children:[]};
+				result.push(radioBox);
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.inputElementConfiguration - 3.1 - options.length: " + this.directLoginInputValue().args()['options'].length);
+//{"name":"dominio", "type":"radio", "options":[{"value":"@alice.it", "checked":true}, {"value":"@tin.it", "checked":false}, {"value":"@virgilio.it", "checked":false}, {"value":"@tim.it", "checked":false}]}
+
+				MochiKit.Iter.forEach(this.directLoginInputValue().args()['options'], function(anOption) {
+					var	radio;
+					
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.inputElementConfiguration - 3.1.1");
+//	TODO: remove the value: field and replace it with element.dom.value = <some value>
+					radio = {tag:'input', type:'radio', name:name, value:anOption['value']};
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.inputElementConfiguration - 3.1.2");
+					if (currentValue == anOption['value']) {
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.inputElementConfiguration - 3.1.3");
+						radio.checked = true;
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.inputElementConfiguration - 3.1.4");
+					}
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.inputElementConfiguration - 3.1.5");
+					radioBox.children.push({tag:'div', children:[ radio, {tag:'span', html:anOption['value']} ]})
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.inputElementConfiguration - 3.1.6");
+				})
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.inputElementConfiguration - 3.2");
+				break;
+		}
+//MochiKit.Logging.logDebug("<<< DirectLoginValueComponent.inputElementConfiguration");
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'inputValue': function() {
+		var result;
+		
+		switch (this.directLoginInputValue().type()) {
+			case 'checkbox':
+				result = this.getDom('checkbox').checked;
+				break;
+			case 'select':
+				result = this.getDom('select').value;
+				break;
+			case 'radio':
+				var checkedRadioButtons;
+				
+				checkedRadioButtons = MochiKit.Base.filter(	function(aRadioButton) { return aRadioButton.dom.checked },
+															this.getElement('radioBox').getChildrenByTagName('input'));
+				
+				if (checkedRadioButtons.length == 0) {
+					result = null;
+				} else {
+					result = checkedRadioButtons[0].dom.value;
+				}
+				break;
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'value': function() {
+		return this._value;
+	},
+	
+	'setValue': function(aValue) {
+		this._value = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'updateEditMode': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginValueComponent.updateEditMode - " + this);
+		this.getElement('inputElement').update("");
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.updateEditMode - 1");
+		Clipperz.YUI.DomHelper.append(this.getDom('inputElement'), {tag:'div', children:this.inputElementConfiguration()});
+//MochiKit.Logging.logDebug("<<< DirectLoginValueComponent.updateEditMode");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginValueComponent.updateViewMode");
+//		this.getElement('inputElement').update(this.directLoginInputValue().value());
+
+		this.getElement('inputElement').update("");
+		
+		switch (this.directLoginInputValue().type()) {
+			case 'checkbox':
+				if (this.value() == true) {
+					this.getElement('inputElement').update(Clipperz.PM.Strings['directLoginConfigurationCheckBoxFieldSelectedValue']);
+				} else {
+					this.getElement('inputElement').update(Clipperz.PM.Strings['directLoginConfigurationCheckBoxFieldNotSelectedValue'])
+				}
+				break;
+			case 'select':
+				var displayedValue;
+				var selectedOptions;
+				var currentValue;
+				
+				currentValue = this.value();
+				selectedOptions = MochiKit.Base.filter(	function(anOption) { return (anOption['value'] == currentValue); },
+														this.directLoginInputValue().args()['options']);
+				if (selectedOptions.length == 0) {
+					displayedValue = "---";
+				} else {
+//MochiKit.Logging.logDebug("+++ " + Clipperz.Base.serializeJSON(selectedOptions));
+//MochiKit.Logging.logDebug("*** " + Clipperz.Base.serializeJSON(selectedOptions[0]));
+					displayedValue = selectedOptions[0]['label'];
+				}
+				this.getElement('inputElement').update(displayedValue);
+				break;
+			case 'radio':
+				this.getElement('inputElement').update(this.value());
+				break;
+		}
+//MochiKit.Logging.logDebug("<<< DirectLoginValueComponent.updateViewMode");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'synchronizeComponentValues': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginValueComponent.synchronizeComponentValues");
+//MochiKit.Logging.logDebug("--- DirectLoginValueComponent.synchronizeComponentValues - 1; value: " + this.inputValue());
+		this.setValue(this.inputValue());
+		this.directLoginInputValue().directLogin().formValues()[this.directLoginInputValue().name()] = this.value();
+//MochiKit.Logging.logDebug("<<< DirectLoginValueComponent.synchronizeComponentValues");
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginsComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginsComponent.js
new file mode 100644
index 0000000..3292a95
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/DirectLoginsComponent.js
@@ -0,0 +1,199 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.DirectLoginsComponent = function(anElement, args) {
+//MochiKit.Logging.logDebug(">>> new Clipperz.PM.Components.RecordDetail.DirectLoginsComponent");
+	args = args || {};
+
+//MochiKit.Logging.logDebug("--- new Clipperz.PM.Components.RecordDetail.DirectLoginsComponent - 0");
+    Clipperz.PM.Components.RecordDetail.DirectLoginsComponent.superclass.constructor.call(this, anElement, args);
+//MochiKit.Logging.logDebug("--- new Clipperz.PM.Components.RecordDetail.DirectLoginsComponent - 1");
+
+	this._addDirectLoginButton = null;
+	
+//MochiKit.Logging.logDebug("--- new Clipperz.PM.Components.RecordDetail.DirectLoginsComponent - 2");
+	this.mainComponent().addEditComponent(this);
+//MochiKit.Logging.logDebug("--- new Clipperz.PM.Components.RecordDetail.DirectLoginsComponent - 3");
+	this.render();
+//MochiKit.Logging.logDebug("<<< new Clipperz.PM.Components.RecordDetail.DirectLoginsComponent");
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.DirectLoginsComponent, Clipperz.PM.Components.RecordDetail.AbstractComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.DirectLoginsComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'addDirectLoginButton': function() {
+		return this._addDirectLoginButton;
+	},
+
+	'setAddDirectLoginButton': function(aValue) {
+		this._addDirectLoginButton = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		this.element().update("");
+
+		Clipperz.YUI.DomHelper.append(this.element().dom,
+			{tag:'div', cls:'directLoginsRecordBox', children:[
+				{tag:'h3', htmlString:Clipperz.PM.Strings['recordDetailDirectLoginBlockTitle']},
+				{tag:'ul', id:this.getId('directLogins')},
+
+				{tag:'div', cls:'addDirectLoginBox', id:this.getId('addDirectLogin'), children:[
+					{tag:'div', cls:'addDirectLoginBoxContent', children:[
+						{tag:'div', cls:'bookmarkletConfiguration', children:[
+//							{tag:'span', htmlString:Clipperz.PM.Strings['newRecordWizardBookmarkletConfigurationLabel']},
+							{tag:'div', htmlString:Clipperz.PM.Strings['recordDetailNewDirectLoginDescription']},
+							{tag:'textarea', id:this.getId('addDirectLoginTextarea')}
+						]},
+						{tag:'div', id:this.getId('addDirectLoginButton')}
+					]}
+				]}
+			]}
+		);
+
+		if (MochiKit.Base.keys(this.record().directLogins()).length == 0) {
+//MochiKit.Logging.logDebug("--- DirectLoginsComponent.render - 3");
+			Clipperz.YUI.DomHelper.append(this.getElement('directLogins'),
+				{tag:'li', children:[
+//					{tag:'span', htmlString:Clipperz.PM.Strings['recordDetailDirectLoginBlockNoDirectLoginConfiguredLabel']}
+					{tag:'div', cls:'recordDetailNoDirectLoginDescriptionBox', htmlString:Clipperz.PM.Strings['recordDetailDirectLoginBlockNoDirectLoginConfiguredDescription']}
+				]}
+			);
+//MochiKit.Logging.logDebug("--- DirectLoginsComponent.render - 4");
+		} else {
+//MochiKit.Logging.logDebug("--- DirectLoginsComponent.render - 5");
+			for (directLoginReference in this.record().directLogins()) {
+//MochiKit.Logging.logDebug("--- DirectLoginsComponent.render - 6");
+				this.addDirectLogin(this.record().directLogins()[directLoginReference]);
+//MochiKit.Logging.logDebug("--- DirectLoginsComponent.render - 7");
+			}
+//MochiKit.Logging.logDebug("--- DirectLoginsComponent.render - 8");
+		}
+//MochiKit.Logging.logDebug("--- DirectLoginsComponent.render - 9");
+
+		this.setAddDirectLoginButton(new YAHOO.ext.Button(this.getDom('addDirectLoginButton'), {
+						text:Clipperz.PM.Strings['recordDetailAddNewDirectLoginButtonLabel'],
+						handler:this.addNewDirectLogin,
+						scope:this
+		}));
+		MochiKit.Signal.connect(this.getId('addDirectLoginTextarea'), 'onkeydown', this, 'onkeydown');
+//MochiKit.Logging.logDebug("--- DirectLoginsComponent.render - 11");
+
+		this.update();
+//MochiKit.Logging.logDebug("<<< DirectLoginsComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'addDirectLogin': function(aDirectLogin) {
+//MochiKit.Logging.logDebug(">>> DirectLoginsComponent.addDirectLogin");
+		new Clipperz.PM.Components.RecordDetail.DirectLoginComponent(
+				Clipperz.YUI.DomHelper.append(this.getDom('directLogins'), {tag:'div'}, true),
+				{
+					mainComponent:this.mainComponent(),
+					directLogin:aDirectLogin
+				}
+		);
+//MochiKit.Logging.logDebug("<<< DirectLoginsComponent.addDirectLogin");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'addNewDirectLogin': function() {
+		var	newDirectLogin;
+		var	configuration;
+
+//MochiKit.Logging.logDebug(">>> DirectLoginsComponent.addNewDirectLogin");
+		if (MochiKit.Base.keys(this.record().directLogins()).length == 0) {
+			this.getElement('directLogins').update("");
+		}
+		
+		this.mainComponent().synchronizeComponentValues();
+		
+		this.mainComponent().exitModalView();
+		configuration = Clipperz.PM.BookmarkletProcessor.checkBookmarkletConfiguration(
+								this.getDom('addDirectLoginTextarea').value,
+								this.getDom('addDirectLoginButton'),
+								MochiKit.Base.method(this.mainComponent(), 'enterModalView')
+		);
+		this.mainComponent().enterModalView();
+		
+		newDirectLogin = new Clipperz.PM.DataModel.DirectLogin({record:this.record(),
+																label:configuration['page']['title'],
+																bookmarkletVersion:'0.2',
+//																bookmarkletVersion:configuration['version'],
+																formData:configuration['form']});
+		this.record().addDirectLogin(newDirectLogin);
+		this.addDirectLogin(newDirectLogin);
+		this.getDom('addDirectLoginTextarea').value = "";
+//MochiKit.Logging.logDebug("<<< DirectLoginsComponent.addNewDirectLogin");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {
+		this.getElement('addDirectLogin').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+		this.getElement('addDirectLogin').hide();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'updateEditMode': function() {
+		this.getElement('addDirectLogin').show();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'onkeydown': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> onkeydown - " + anEvent.src().id + ": " + anEvent.key().code);
+		if (anEvent.key().code == 13) {
+			this.addNewDirectLogin();
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldButtonComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldButtonComponent.js
new file mode 100644
index 0000000..9e1d56a
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldButtonComponent.js
@@ -0,0 +1,117 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.FieldButtonComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.FieldButtonComponent.superclass.constructor.call(this, anElement, args);
+
+	this._button = null;
+
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.FieldButtonComponent, Clipperz.PM.Components.RecordDetail.AbstractFieldSubComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.FieldButtonComponent";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'buttonText': function() {
+		var	result;
+
+		if (this.recordField() == null) {
+			//	TODO: this is never used. It is just an obsolete legacy chunk of code
+			result = Clipperz.PM.Strings['recordDetailAddFieldButtonLabel'];
+		} else {
+			result = Clipperz.PM.Strings['recordDetailRemoveFieldButtonLabel'];
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'button': function() {
+		return this._button;
+	},
+	
+	'setButton': function(aValue) {
+		this._button = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		this.element().update("");
+		
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', id:this.getId('button')})
+		this.setButton(new YAHOO.ext.Button(this.getDom('button'), {text:this.buttonText(), handler:this.handleButtonClick, scope:this}));
+
+		this.update();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handleButtonClick': function() {
+		if (this.recordField() == null) {
+			this.mainComponent().addNewField();
+		} else {
+			this.mainComponent().removeField(this.fieldComponent());
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'updateEditMode': function() {
+		this.button().show();
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'updateViewMode': function() {
+		this.button().hide();
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldComponent.js
new file mode 100644
index 0000000..c2d947e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldComponent.js
@@ -0,0 +1,189 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.FieldComponent = function(anElement, args) {
+//MochiKit.Logging.logDebug(">>> new FieldComponent");
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.FieldComponent.superclass.constructor.call(this, anElement, args);
+
+	this._element = anElement;
+	this._recordField = args.recordField || null;
+
+	this._buttonComponent = null;
+	this._labelComponent = null;
+	this._dragHandler = null;
+	this._valueComponent = null;
+	this._typeComponent = null;
+
+	this.mainComponent().addEditComponent(this);
+
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.FieldComponent, Clipperz.PM.Components.RecordDetail.AbstractComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.FieldComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'recordField': function() {
+		return this._recordField;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'buttonComponent': function() {
+		return this._buttonComponent;
+	},
+	
+	'setButtonComponent': function(aValue) {
+		this._buttonComponent = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'labelComponent': function() {
+		return this._labelComponent;
+	},
+	
+	'setLabelComponent': function(aValue) {
+		this._labelComponent = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'dragHandler': function() {
+		return this._dragHandler;
+	},
+	
+	'setDragHandler': function(aValue) {
+		this._dragHandler = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'valueComponent': function() {
+		return this._valueComponent;
+	},
+	
+	'setValueComponent': function(aValue) {
+		this._valueComponent = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'typeComponent': function() {
+		return this._typeComponent;
+	},
+	
+	'setTypeComponent': function(aValue) {
+		this._typeComponent = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> RecordDetail.FieldComponent.render");
+ 		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td',/* width:'32',*/ height:'24', cls:'removeFieldButton', align:'left', valign:'top', id:this.getId('button')});
+ 		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td',/* width:'25%',*/ valign:'top', id:this.getId('label')});
+ 		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td',/* width:'3',*/ valign:'top', id:this.getId('dragHandler')});
+ 		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td',/* width:'50%',*/ valign:'top', children:[
+			{tag:'div', cls:'Clipperz_recordFieldData', id:this.getId('value')}
+		]});
+		
+		
+		this.setButtonComponent(new Clipperz.PM.Components.RecordDetail.FieldButtonComponent(this.getElement('button'), {fieldComponent:this}));
+		this.setLabelComponent(new Clipperz.PM.Components.RecordDetail.FieldLabelComponent(this.getElement('label'), {fieldComponent:this}));
+		this.setDragHandler(new Clipperz.PM.Components.RecordDetail.FieldDragHandler(this.getElement('dragHandler'), {fieldComponent:this}));
+		this.setValueComponent(new Clipperz.PM.Components.RecordDetail.FieldValueComponent(this.getElement('value'), {fieldComponent:this}));
+
+		if (this.editMode() == 'EDIT') {
+ 			Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td',/* width:'60',*/ align:'left', cls:'fieldTypeTD', valign:'top', id:this.getId('type')});
+			this.setTypeComponent(new Clipperz.PM.Components.RecordDetail.FieldTypeComponent(this.getElement('type'), {fieldComponent:this}));
+		}
+		
+		this.update();
+//MochiKit.Logging.logDebug("<<< RecordDetail.FieldComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handleButtonClick': function() {
+		this.mainComponent().record().removeField(this.recordField());
+
+//		if (this.recordField() == null) {
+//			this.mainComponent().record().addNewField();
+//		} else {
+//			this.mainComponent().record().removeField(this.recordField());
+//		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'update': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> RecordDetail.FieldComponent.update");
+		this.buttonComponent().update();
+		this.labelComponent().update();
+		this.dragHandler().update();
+		this.valueComponent().update();
+		if (this.editMode() == 'EDIT') {
+			this.typeComponent().update();
+		}
+//MochiKit.Logging.logDebug("<<< RecordDetail.FieldComponent.update");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'synchronizeComponentValues': function() {
+//MochiKit.Logging.logDebug(">>> FieldComponent.synchronizeComponentValues");
+		this.labelComponent().synchronizeComponentValues();
+		this.valueComponent().synchronizeComponentValues();
+		if (this.editMode() == 'EDIT') {
+			this.typeComponent().synchronizeComponentValues();
+		}
+//MochiKit.Logging.logDebug("<<< FieldComponent.synchronizeComponentValues");
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldDragHandler.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldDragHandler.js
new file mode 100644
index 0000000..13a08fc
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldDragHandler.js
@@ -0,0 +1,59 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.FieldDragHandler = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.FieldDragHandler.superclass.constructor.call(this, anElement, args);
+
+	this._element = anElement;
+	
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.FieldDragHandler, Clipperz.PM.Components.RecordDetail.AbstractFieldSubComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.FieldDragHandler component";
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldLabelComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldLabelComponent.js
new file mode 100644
index 0000000..3bbcd1d
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldLabelComponent.js
@@ -0,0 +1,141 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.FieldLabelComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.FieldLabelComponent.superclass.constructor.call(this, anElement, args);
+
+	this._inputElement = null;
+	
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.FieldLabelComponent, Clipperz.PM.Components.RecordDetail.AbstractFieldSubComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.FieldLabelComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'value': function() {
+		return this.recordField().label();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'inputElement': function() {
+		return this._inputElement;
+	},
+	
+	'setInputElement': function(aValue) {
+		this._inputElement = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		var	newTextFormField;
+		this.element().update("");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', cls:'Clipperz_recordFieldLabel', id:this.getId('label')});
+//		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', style:'font-size:8pt;', html:this.recordField().key()});
+
+//		this.setInputElement(new Clipperz.PM.Components.TextFormField(this.getElement('label'), {editMode:this.editMode(), value:this.value()}));
+		newTextFormField = new Clipperz.PM.Components.TextFormField(this.getElement('label'), {editMode:this.editMode(), value:this.value()});
+//		newTextFormField.inputElement().setStyle({border:'3px solid cyan;'});
+		newTextFormField.on('change', this.notifyChanges, this, true)
+//		this.inputElement().on('change', function() {alert("CHANGE");});
+//		this.inputElement().getElement('editComponent_input').on('change', function() {alert("CHANGE");})
+//		this.inputElement().on('blur', this.notifyChanges, this, true);
+		
+		this.setInputElement(newTextFormField);
+		this.update();
+	},
+
+	'notifyChanges': function() {
+//MochiKit.Logging.logDebug(">>> FieldLabelComponent.notifyChanges - " + this);
+		this.synchronizeComponentValues();
+		Clipperz.NotificationCenter.notify(this.recordField().recordVersion().record(), 'updatedFieldLabel');
+//MochiKit.Logging.logDebug("<<< FieldLabelComponent.notifyChanges");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'update': function() {
+//MochiKit.Logging.logDebug(">>> FieldLabelComponent.update");
+		this.inputElement().update({editMode:this.editMode(), value:this.value()});
+//MochiKit.Logging.logDebug("<<< FieldLabelComponent.update");
+	},
+	
+	//-------------------------------------------------------------------------
+/*
+	'updateViewMode': function() {
+		var	width;
+		var	element;
+		
+		this.element().update("");
+		width = this.element().getWidth();
+		element = Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', html:this.value()}, true);
+		element.setWidth(width-1);
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'updateEditMode': function() {
+		var	width;
+
+		this.element().update("");
+		width = this.element().getWidth(true);
+		this.setInputElement(Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'input', type:'text', value:this.value()}, true));
+		this.inputElement().setWidth(width-1);
+	},
+*/
+	//-------------------------------------------------------------------------
+
+	'synchronizeComponentValues': function() {
+		if (this.inputElement() != null) {
+			this.recordField().setLabel(this.inputElement().value());
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldTypeComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldTypeComponent.js
new file mode 100644
index 0000000..3bdd093
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldTypeComponent.js
@@ -0,0 +1,157 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.FieldTypeComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.FieldTypeComponent.superclass.constructor.call(this, anElement, args);
+
+	this._inputElement = null;
+	
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.FieldTypeComponent, Clipperz.PM.Components.RecordDetail.AbstractFieldSubComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.FieldTypeComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'inputElement': function() {
+		return this._inputElement;
+	},
+	
+	'setInputElement': function(aValue) {
+		this._inputElement = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'value': function() {
+		return this.recordField().type();
+	},
+
+	'canChangeType': function() {
+		var value;
+		var result;
+		
+		value = this.value();
+		result = ((value == 'TXT') || (value == 'PWD') || (value == 'URL') || (value == 'DATE') || (value == 'ADDR'));
+		
+		return result
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {
+		this.element().update("");
+		if (this.canChangeType()) {
+			var	width;
+			var element;
+
+			width = this.element().getWidth(true);
+			element = Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', html:this.recordField().typeShortDescription()}, true);
+			element.setWidth(width-1);
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'updateEditMode': function() {
+		this.element().update("");
+		
+		if (this.canChangeType()) {
+			var	width;
+
+			width = this.element().getWidth(true);
+			this.setInputElement(Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'select', children:[
+				{tag:'option', value:'TXT', htmlString:Clipperz.PM.Strings['recordFieldTypologies']['TXT']['shortDescription']},
+				{tag:'option', value:'PWD', htmlString:Clipperz.PM.Strings['recordFieldTypologies']['PWD']['shortDescription']},
+				{tag:'option', value:'URL', htmlString:Clipperz.PM.Strings['recordFieldTypologies']['URL']['shortDescription']},
+				{tag:'option', value:'DATE', htmlString:Clipperz.PM.Strings['recordFieldTypologies']['DATE']['shortDescription']},
+				{tag:'option', value:'ADDR', htmlString:Clipperz.PM.Strings['recordFieldTypologies']['ADDR']['shortDescription']}
+			
+//				{tag:'option', value:'CHECK', html:Clipperz.PM.DataModel.RecordField.TypeDescriptions['CHECK']['shortDescription']},
+//				{tag:'option', value:'RADIO', html:Clipperz.PM.DataModel.RecordField.TypeDescriptions['RADIO']['shortDescription']},
+//				{tag:'option', value:'CHECK', html:Clipperz.PM.DataModel.RecordField.TypeDescriptions['SELECT']['shortDescription']}
+//				{tag:'option', value:'NOTE', html:Clipperz.PM.DataModel.RecordField.TypeDescriptions['NOTE']['shortDescription']}
+			]}, true));
+			this.inputElement().setWidth(width-1);
+			this.inputElement().addHandler('change', true, this.onChange, this, true);
+//			this.selectCorrectOption();
+			Clipperz.DOM.selectOptionMatchingValue(this.inputElement().dom, this.value());
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'onChange': function() {
+		this.synchronizeComponentValues();
+		this.fieldComponent().valueComponent().handleTypeChange();
+	},
+
+	//-------------------------------------------------------------------------
+/*
+	'selectCorrectOption': function() {
+		var	options;
+		var i,c;
+		
+		options = this.inputElement().getChildrenByTagName('option');
+		c = options.length;
+		for (i=0; i<c; i++) {
+			if (options[i].dom.value == this.value()) {
+				options[i].dom.selected = true;
+			}
+		}
+	},
+*/	
+	//-------------------------------------------------------------------------
+
+	'synchronizeComponentValues': function() {
+		if (this.inputElement() != null) {
+			this.recordField().setType(this.inputElement().dom.value);
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldValueComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldValueComponent.js
new file mode 100644
index 0000000..a30992a
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/FieldValueComponent.js
@@ -0,0 +1,275 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.FieldValueComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.FieldValueComponent.superclass.constructor.call(this, anElement, args);
+
+	this._inputElement = null;
+	this._scrambledStatus = 'SCRAMBLED'; //	'UNSCRAMBLED'
+	
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.FieldValueComponent, Clipperz.PM.Components.RecordDetail.AbstractFieldSubComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.FieldValueComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'value': function() {
+		return this.recordField().value();
+	},
+
+	'setValue': function(aValue) {
+		this.recordField().setValue(aValue);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'inputElement': function() {
+		return this._inputElement;
+	},
+	
+	'setInputElement': function(aValue) {
+		this._inputElement = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'scrambledStatus': function() {
+		return this._scrambledStatus;
+	},
+	
+	'setScrambledStatus': function(aValue) {
+		this._scrambledStatus = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'handleTypeChange': function() {
+//MochiKit.Logging.logDebug(">>> handling type change - " + this.recordField().type());
+		this.synchronizeComponentValues();
+		this.update();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'addrUrl': function() {
+		var result;
+		
+		result = "http://maps.google.com/maps?q=" + this.value().split(' ').join('+');
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {
+		var scarmbledStatus;
+		
+		scrambledStatus = this.scrambledStatus() || 'SCRAMBLED';
+
+		this.element().update("");
+		if (this.recordField().hidden() == false) {
+			switch(this.recordField().type()) {
+				case 'TXT':
+				case 'PWD':
+					Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'span', html:this.value()});
+					break;
+				case 'URL':
+					var	urlLocation;
+					
+					urlLocation = Clipperz.Base.sanitizeString(this.value());
+					if (! (/^(https?|ftp|svn):\/\//.test(urlLocation))) {
+						urlLocation = 'http://' + urlLocation;
+					}
+					Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'a', href:urlLocation, html:this.value(), target:'_blank'});
+					break;
+				case 'DATE':
+					Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'span', html:this.value()});
+					break;
+				case 'ADDR':
+					Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'a', href:this.addrUrl(), html:this.value(), target:'_blank'});
+					break;
+			}
+		} else {
+			var tableElement;
+			var tdElement;
+			var inputElement;
+			var passwordElementConfiguration;
+
+			if (scrambledStatus == 'SCRAMBLED') {
+				var	scrambledInputElement;
+
+				if ((Clipperz_IEisBroken === true) && (Clipperz.PM.Proxy.defaultProxy.isReadOnly())) {
+					scrambledInputElement = {tag:'input', type:'password', value:"this.value()"};
+				} else {
+					scrambledInputElement = {tag:'input', type:'text', cls:'scrambledField', title:Clipperz.PM.Strings['recordDetailPasswordFieldTooltipLabel'], value:"this.value()"};
+				}
+
+				passwordElementConfiguration = 
+					{tag:'table', border:'0', cellspacing:'2', cellpadding:'0', children:[
+						{tag:'tbody', children:[
+							{tag:'tr', children:[
+								{tag:'td', valign:'top', children:[
+									scrambledInputElement,
+									{tag:'a', cls:'scrambleLink', id:this.getId('scrambleLink'), href:'#', htmlString:Clipperz.PM.Strings['recordDetailPasswordFieldUnscrambleLabel']}
+								]},
+								{tag:'td', valign:'top', children:[
+									{tag:'span', cls:'scrambledFieldLabel', htmlString:Clipperz.PM.Strings['recordDetailPasswordFieldHelpLabel']}
+								]}
+							]}
+						]}
+					]};
+			} else {
+				passwordElementConfiguration =
+					{tag:'div', children:[
+						{tag:'input', type:'text', cls:'unscrambledField', value:"this.value()"},
+						{tag:'a', cls:'scrambleLink', id:this.getId('scrambleLink'), href:'#', htmlString:Clipperz.PM.Strings['recordDetailPasswordFieldScrambleLabel']}
+					]};
+			}
+			
+			tableElement = Clipperz.YUI.DomHelper.append(this.element().dom, passwordElementConfiguration, true);
+
+			inputElement = tableElement.getChildrenByTagName('input')[0];
+			inputElement.dom.value = this.value();
+			inputElement.wrap({tag:'div', cls:'passwordBackground'}).setStyle('background-position', "0px -" + Math.min(128, Clipperz.PM.Crypto.passwordEntropy(this.value())) + "px");
+
+			MochiKit.Signal.connect(inputElement.dom, 'onfocus', this, 'selectHiddenFieldOnFocus');
+			MochiKit.Signal.connect(this.getDom('scrambleLink'), 'onclick', this, 'toggleScramble');
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'updateEditMode': function() {
+		var inputElement;
+		var scarmbledStatus;
+		
+		scrambledStatus = this.scrambledStatus() || 'SCRAMBLED';
+		
+		this.element().update("");
+		switch(this.recordField().type()) {
+			case 'TXT':
+			case 'URL':
+			case 'ADDR':
+				inputElement = Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'input', type:'text', value:"this.value()"}, true);
+				inputElement.dom.value = this.value();
+				break;
+			case 'PWD':
+				Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'table', width:'100%', cellpadding:'0', cellspacing:'0', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', valign:'top', children:[
+								{tag:'input', type:((scrambledStatus == 'SCRAMBLED') ? 'password' : 'text'), id:this.getId('passwordInputElement'), value:"this.value()"},
+								{tag:'a', cls:'scrambleLink', id:this.getId('scrambleLink'), href:'#', html:(scrambledStatus == 'SCRAMBLED' ? Clipperz.PM.Strings['recordDetailPasswordFieldUnscrambleLabel'] : Clipperz.PM.Strings['recordDetailPasswordFieldScrambleLabel'])}
+							]},
+							{tag:'td', valign:'top', children:[
+								{tag:'div', id:this.getId('passwordGenerator'), cls:'Clipperz_PasswordGenerator_button', html:'&nbsp;'}
+							]}
+						]}
+					]}
+				]})
+				inputElement = this.getElement('passwordInputElement');
+				inputElement.dom.value = this.value();
+				new Clipperz.PM.Components.PasswordEntropyDisplay(this.getElement('passwordInputElement'));
+				new Clipperz.PM.Components.PasswordGenerator(this.getElement('passwordGenerator'), this);
+				MochiKit.Signal.connect(this.getDom('scrambleLink'), 'onclick', this, 'toggleScramble');
+				break;
+//			case 'NOTE':
+//				inputElement = Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'textarea', rows:'5', html:this.value()}, true);
+//				break
+			case 'DATE':
+				inputElement = Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'input', type:'text', value:"this.value()"}, true);
+				inputElement.dom.value = this.value();
+				break;
+		}
+
+		this.setInputElement(inputElement);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'synchronizeComponentValues': function() {
+//MochiKit.Logging.logDebug(">>> FieldValueComponent.synchronizeComponentValues");
+		if (this.inputElement() != null) {
+			var value;
+			
+			switch(this.recordField().type()) {
+				case 'TXT':
+				case 'URL':
+				case 'ADDR':
+				case 'PWD':
+				case 'DATE':
+					value = this.inputElement().dom.value;
+					break;
+			}
+			this.setValue(value);
+		}
+//MochiKit.Logging.logDebug("<<< FieldValueComponent.synchronizeComponentValues");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'selectHiddenFieldOnFocus': function(anEvent) {
+		anEvent.src().select();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toggleScramble': function(anEvent) {
+		this.synchronizeComponentValues();
+		
+		if (this.scrambledStatus() == 'SCRAMBLED') {
+			this.setScrambledStatus('UNSCRAMBLED');
+		} else {
+			this.setScrambledStatus('SCRAMBLED');
+		};
+		
+		this.update();
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/HeaderComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/HeaderComponent.js
new file mode 100644
index 0000000..7aaca3e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/HeaderComponent.js
@@ -0,0 +1,165 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.HeaderComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.HeaderComponent.superclass.constructor.call(this, anElement, args);
+	this.mainComponent().addEditComponent(this);
+	
+	this._saveButton = null;
+	
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.HeaderComponent, Clipperz.PM.Components.RecordDetail.AbstractComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.HeaderComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+		var editButton;
+		
+//MochiKit.Logging.logDebug(">>> RecordDetail.HeaderComponent.appendTo");
+ 		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', cls:'recordDetailButtonsBox', children:[
+			{tag:'div', id:this.getId('editButtonBox'), children:[
+				{tag:'table', cls:'recordDetailButtonsTABLE', border:'0', cellpadding:'0', cellspacing:'0', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', align:'center', children:[
+								{tag:'div', id:this.getId('editButton')}
+							]}
+						]}
+					]}
+				]}
+			]},
+			{tag:'div', id:this.getId('saveCancelButtonBox'), children:[
+				{tag:'table', cls:'recordDetailButtonsTABLE', border:'0', cellpadding:'0', cellspacing:'0', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', width:'49%', align:'right', children:[
+								{tag:'div', id:this.getId('saveButton')}
+							]},
+							{tag:'td', html:'&nbsp'},
+							{tag:'td', width:'49%', align:'left', children:[
+								{tag:'div', id:this.getId('cancelButton')}
+							]}
+						]}
+					]}
+				]}
+			]}
+		]});
+
+		this.getElement('editButtonBox').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+		this.getElement('saveCancelButtonBox').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+
+		editButton = new YAHOO.ext.Button(this.getDom('editButton'), {text:Clipperz.PM.Strings['recordDetailEditButtonLabel'], handler:this.editButtonHandler, scope:this});
+		this.setSaveButton(new YAHOO.ext.Button(this.getDom('saveButton'), {text:Clipperz.PM.Strings['recordDetailSaveButtonLabel'], handler:this.saveButtonHandler, scope:this}));
+		new YAHOO.ext.Button(this.getDom('cancelButton'), {text:Clipperz.PM.Strings['recordDetailCancelButtonLabel'], handler:this.cancelButtonHandler, scope:this});
+
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+			editButton.disable();
+		}
+		
+		this.update();
+//MochiKit.Logging.logDebug("<<< RecordDetail.HeaderComponent.appendTo");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {
+//MochiKit.Logging.logDebug(">>> HeaderComponent.updateViewMode");
+		this.getElement('editButtonBox').show();
+		this.getElement('saveCancelButtonBox').hide();
+//MochiKit.Logging.logDebug("<<< HeaderComponent.updateViewMode");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'updateEditMode': function() {
+		this.getElement('editButtonBox').hide();
+		this.getElement('saveCancelButtonBox').show();
+		if (this.mainComponent().enableSaveButton() == true) {
+//MochiKit.Logging.logDebug("--- HeaderComponent.updateViewMode - ENABLE");
+			this.saveButton().enable();
+		} else {
+			this.saveButton().disable();
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'saveButton': function() {
+		return this._saveButton;
+	},
+	
+	'setSaveButton': function(aValue) {
+		this._saveButton = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'editButtonHandler': function(anEvent) {
+		this.mainComponent().setEditMode('EDIT');
+	},
+
+	//-------------------------------------------------------------------------
+
+	'saveButtonHandler': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> RecordDetail.HeaderComponent.saveButtonHandler");
+		this.mainComponent().setEditMode('VIEW', this.getElement('saveButton'));
+//MochiKit.Logging.logDebug("<<< RecordDetail.HeaderComponent.saveButtonHandler");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'cancelButtonHandler': function(anEvent) {
+		this.record().cancelChanges();
+//MochiKit.Logging.logDebug("--- HeaderComponent.cancelButtonHandler - " + Clipperz.Base.serializeJSON(this.record().currentDataSnapshot()));
+		this.mainComponent().setEditMode('VIEW', null, true);
+	},
+
+	//-------------------------------------------------------------------------
+
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/MainComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/MainComponent.js
new file mode 100644
index 0000000..53bf9c5
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/MainComponent.js
@@ -0,0 +1,758 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.MainComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.MainComponent.superclass.constructor.call(this, anElement, args);
+
+//	this._element = args.element;
+	this._user = args.user;
+	this._editMode = args.editMode || 'VIEW';	//	[ 'VIEW' | 'EDIT' ]
+	this._mainPanel = args.mainPanel;
+	
+	this._record = null;
+	this._editComponents = [];
+	this._addFieldButton = null;
+
+	this._enableSaveButton = true;
+	this._shouldShowLoginInfo = (Clipperz.PM.Proxy.defaultProxy.isReadOnly() ? false : true);
+	
+//	this._mainLayoutManager = null;
+//	this._layoutRegion = null;
+	
+	Clipperz.NotificationCenter.register(null, 'loadingRecordData', this, 'render');
+	Clipperz.NotificationCenter.register(null, 'decryptingRecordData', this, 'render');
+	Clipperz.NotificationCenter.register(null, 'loadingRecordVersionData', this, 'render');
+	Clipperz.NotificationCenter.register(null, 'decryptingRecordVersionData', this, 'render');
+	Clipperz.NotificationCenter.register(null, 'setupDone', this, 'render');
+	Clipperz.NotificationCenter.register(null, 'switchLanguage', this, 'render');
+	
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.MainComponent, Clipperz.PM.Components.BaseComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.MainComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'editMode': function() {
+		return this._editMode;
+	},
+
+	'setEditMode': function(aValue, aButtonElement, shouldSkipComponentSynchronization) {
+//MochiKit.Logging.logDebug(">>> MainComponent.setEditingMode");
+		this.scrollToTop();
+		
+		if (aValue == 'VIEW') {
+			if (shouldSkipComponentSynchronization == true) {
+				this.exitModalView();
+			} else {
+				this.synchronizeComponentValues();
+				if (this.record().hasPendingChanges()) {
+					if (this.record().isBrandNew()) {
+						this.record().removeEmptyFields();
+					}
+					this.saveCurrentRecordChanges(aButtonElement);
+				} else {
+					if (this.record().isBrandNew()) {
+						this.record().user().removeRecord(this.record());
+					}
+					this.exitModalView();
+				}
+			}
+		} else if (aValue == 'EDIT') {
+			this.enterModalView();
+		} else {
+			//	????
+		}
+
+		this._editMode = aValue;
+		this.render();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'mainPanel': function() {
+		return this._mainPanel;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> RecordDetail.MainComponent.render");
+		this.setEnableSaveButton(true);
+		this.element().update("");
+
+		if (this.record() == null) {
+			if (MochiKit.Base.keys(this.user().records()).length == 0) {
+				this.renderWithNoRecordAtAll();
+			} else {
+				this.renderWithNoSelectedRecord();
+			}
+		} else {
+			this.renderWithSelectedRecord();
+		}
+//MochiKit.Logging.logDebug("<<< RecordDetail.MainComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderWithNoRecordAtAll': function() {
+//MochiKit.Logging.logDebug(">>> RecordDetail.MainComponent.renderWithNoRecordAtAll");
+		Clipperz.YUI.DomHelper.append(this.element().dom,
+			{tag:'form', cls:'noRecordAtAllFORM', children:[
+				{tag:'div', cls:'recordTitleBlock', children:[
+					{tag:'h2', id:'recordTitle', htmlString:Clipperz.PM.Strings['recordDetailNoRecordAtAllTitle']}
+				]},
+				{tag:'table', border:'0', cellspacing:'0', cellpadding:'0', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', colspan:'5', children:[
+								{tag:'div', cls:'recordDetailDescriptionBox', htmlString:Clipperz.PM.Strings['recordDetailNoRecordAtAllDescription']}
+							]}
+						]}
+					]}
+				]}
+			]}
+		);
+//MochiKit.Logging.logDebug("<<< RecordDetail.MainComponent.renderWithNoRecordAtAll");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'renderWithNoSelectedRecord': function() {
+//MochiKit.Logging.logDebug(">>> RecordDetail.MainComponent.renderWithNoSelectedRecord");
+		Clipperz.YUI.DomHelper.append(this.element().dom,
+			{tag:'form', cls:'noRecordSelectedFORM', children:[
+				{tag:'div', cls:'recordTitleBlock', children:[
+					{tag:'h2', id:'recordTitle', htmlString:Clipperz.PM.Strings['recordDetailNoRecordSelectedTitle']}
+				]},
+				{tag:'table', border:'0', cellspacing:'0', cellpadding:'0', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', children:[
+							{tag:'td', colspan:'5', children:[
+								{tag:'div', cls:'recordDetailDescriptionBox', htmlString:Clipperz.PM.Strings['recordDetailNoRecordSelectedDescription']}
+							]}
+						]},
+						{tag:'tr', colspan:'5', children:[
+							{tag:'td', colspan:'5', children:this.loginInfo()}
+						]}
+					]}
+				]}
+			]}
+		);
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithNoSelectedRecord - 1");
+
+		if (MochiKit.DOM.getElement('fullLoginHistoryLink') != null) {
+			MochiKit.Signal.connect('fullLoginHistoryLink', 'onclick', this, 'showLoginHistoryPanel');
+		}
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithNoSelectedRecord - 2");
+		
+		if (MochiKit.DOM.getElement('offlineCopyDownloadWarningLink') != null) {
+			MochiKit.Signal.connect('offlineCopyDownloadWarningLink', 'onclick', this, 'showDownloadOfflineCopyPanel');
+		}
+//MochiKit.Logging.logDebug("<<< RecordDetail.MainComponent.renderWithNoSelectedRecord");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderWithSelectedRecord': function() {
+//MochiKit.Logging.logDebug(">>> RecordDetail.MainComponent.renderWithSelectedRecord");
+		if (this.record().shouldLoadData() === true) {
+//			this.renderWithSelectedRecordLoading();
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecord - 1.1");
+			this.renderWhileProcessingWithMessage(Clipperz.PM.Strings['recordDetailLoadingRecordMessage']);
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecord - 1.2");
+		} else if (this.record().shouldDecryptData() === true) {
+//			this.renderWithSelectedRecordDecrypting();
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecord - 2.1");
+			this.renderWhileProcessingWithMessage(Clipperz.PM.Strings['recordDetailDecryptingRecordMessage']);
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecord - 2.2");
+		} else if (this.record().currentVersion().shouldLoadData() === true) {
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecord - 3.1");
+			this.renderWhileProcessingWithMessage(Clipperz.PM.Strings['recordDetailLoadingRecordVersionMessage']);
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecord - 3.2");
+		} else if (this.record().currentVersion().shouldDecryptData() === true) {
+//			this.renderWithSelectedRecordCurrentVersionDecrypting();
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecord - 4.1");
+			this.renderWhileProcessingWithMessage(Clipperz.PM.Strings['recordDetailDecryptingRecordVersionMessage']);
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecord - 4.2");
+		} else {
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecord - 5.1");
+			this.renderWithSelectedRecordData();
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecord - 5.2");
+		}
+//MochiKit.Logging.logDebug("<<< RecordDetail.MainComponent.renderWithSelectedRecord");
+	},
+
+	//.........................................................................
+
+	'renderWhileProcessingWithMessage': function(aMessage) {
+//MochiKit.Logging.logDebug(">>> RecordDetail.MainComponent.renderWhileProcessingWithMessage");
+		Clipperz.YUI.DomHelper.append(this.element().dom,
+			{tag:'form', cls:'processingRecordFORM', children:[
+				{tag:'div', cls:'recordTitleBlock', children:[
+					{tag:'h2', id:'recordTitle', html:this.record().label()}
+				]},
+				{tag:'table', border:'0', cellspacing:'0', cellpadding:'0', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', cls:'recordTR', children:[
+							{tag:'td', colspan:'5', children:[
+								{tag:'div', cls:'recordDetailDescriptionBox', children:[
+									{tag:'h5', cls:'recordLoadingMessage', html:aMessage}
+								]}
+							]}
+						]}
+					]}
+				]}
+			]}
+		);
+//MochiKit.Logging.logDebug("<<< RecordDetail.MainComponent.renderWhileProcessingWithMessage");
+	},
+
+	//.........................................................................
+/*
+	'renderWithSelectedRecordLoading': function() {
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', cls:'', style:'border:1px solid red; padding: 20px;', children:[
+			{tag:'div', cls:'Clipprez_RecordDetailTitle', children:[
+				{tag:'h3', html:this.record().label()},
+				{tag:'h3', html:"loading"}
+			]}
+		]});
+	},
+
+	//.........................................................................
+
+	'renderWithSelectedRecordDecrypting': function() {
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', cls:'', style:'border:1px solid red; padding: 20px;', children:[
+			{tag:'div', cls:'Clipprez_RecordDetailTitle', children:[
+				{tag:'h3', html:this.record().label()},
+				{tag:'h3', html:"decrypting ... "}
+			]}
+		]});
+	},
+
+	//.........................................................................
+
+	'renderWithSelectedRecordCurrentVersionDecrypting': function() {
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', cls:'', style:'border:1px solid red; padding: 20px;', children:[
+			{tag:'div', cls:'Clipprez_RecordDetailTitle', children:[
+				{tag:'h3', html:this.record().label()},
+				{tag:'h3', html:"decrypting version ... "}
+			]}
+		]});
+	},
+*/
+	//-------------------------------------------------------------------------
+
+	'renderWithErrorMessage': function(anErrorMessage) {
+//MochiKit.Logging.logDebug(">>> RecordDetail.MainComponent.renderWithErrorMessage");
+		this.element().update("");
+		
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithErrorMessage - 1");
+		Clipperz.YUI.DomHelper.append(this.element().dom,
+			{tag:'form', cls:'errorMessageFORM', children:[
+				{tag:'div', cls:'recordTitleBlock', children:[
+					{tag:'h2', id:'recordTitle', html:this.record().label()}
+				]},
+				{tag:'table', border:'0', cellspacing:'0', cellpadding:'0', children:[
+					{tag:'tbody', children:[
+						{tag:'tr', cls:'recordTR', children:[
+							{tag:'td', colspan:'5', children:[
+								{tag:'div', cls:'recordDetailDescriptionBox loadingError', children:[
+									{tag:'h5', htmlString:Clipperz.PM.Strings['recordDetailLoadingErrorMessageTitle']},
+									{tag:'p', html:anErrorMessage.message}
+								]}
+							]}
+						]}
+					]}
+				]}
+			]}
+		);
+//MochiKit.Logging.logDebug("<<< RecordDetail.MainComponent.renderWithErrorMessage");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'renderWithSelectedRecordData': function() {
+		var	columns;
+		
+		this.resetEditComponents();
+
+		columns = [
+			{tag:'td', width:'25', html:'&#160'},
+			{tag:'td', width:'25%', htmlString:Clipperz.PM.Strings['recordDetailLabelFieldColumnLabel']},
+			{tag:'td', width:'3', html:'&#160'},
+			{tag:'td', /*width:'80%',*/ htmlString:Clipperz.PM.Strings['recordDetailDataFieldColumnLabel']}
+		];
+
+		if (this.editMode() == 'EDIT') {
+			columns.push({tag:'td', /*width:'55',*/ htmlString:Clipperz.PM.Strings['recordDetailTypeFieldColumnLabel']})
+		}
+		
+//MochiKit.Logging.logDebug(">>> RecordDetail.MainComponent.renderWithSelectedRecordData");
+		Clipperz.YUI.DomHelper.append(this.element().dom,
+			{tag:'form', cls:'recordDataFORM', children:[
+				{tag:'div', cls:'recordTitleBlock', id:this.getId('title')},
+				{tag:'div', id:'recordDetailDataBox', cls:'recordDetailDataBox', children:[
+
+{tag:'table', width:'100%', border:'0', cellspacing:'0', cellpadding:'0', children:[
+	{tag:'tbody', children:[
+		{tag:'tr', children:[
+			{tag:'td', width:'5', html:"&nbsp;"},
+			{tag:'td', children:[
+
+					{tag:'table', cls:'recordDetailDataBoxTABLE', border:'0', cellspacing:'0', cellpadding:'0', children:[
+						{tag:'tbody', id:this.getId('tbody'), children:[
+							{tag:'tr', /*cls:'recordNoteTR',*/ children:[
+								{tag:'td', colspan:'5', id:this.getId('notes')}
+							]},
+							{tag:'tr', cls:'recordFieldsTR', children:columns /*	[
+								{tag:'td', width:'25', html:'&#160'},
+								{tag:'td', width:'25%', htmlString:Clipperz.PM.Strings['recordDetailLabelFieldColumnLabel']},
+								{tag:'td', width:'3', html:'&#160'},
+								{tag:'td', / *width:'80%',* / htmlString:Clipperz.PM.Strings['recordDetailDataFieldColumnLabel']},
+								{tag:'td', / *width:'55',* / htmlString:Clipperz.PM.Strings['recordDetailTypeFieldColumnLabel']}
+							] */	}
+						]}
+					]},
+					{tag:'div', cls:'addFieldButton', id:this.getId('addField'), children:[
+						{tag:'div', id:this.getId('addFieldButton')}
+					]},
+					{tag:'div', id:this.getId('directLogins')},
+					{tag:'div', id:this.getId('footer')}
+				
+			]}
+		]}
+	]}
+]}
+
+				]}
+			]}
+		);
+		
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecordData - 1");
+
+		new Clipperz.PM.Components.RecordDetail.TitleComponent(this.getElement('title'), {mainComponent:this});
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecordData - 2");
+		new Clipperz.PM.Components.RecordDetail.NotesComponent(this.getElement('notes'), {mainComponent:this});
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecordData - 3");
+		new Clipperz.PM.Components.RecordDetail.DirectLoginsComponent(this.getElement('directLogins'), {mainComponent:this});
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecordData - 4");
+		new Clipperz.PM.Components.RecordDetail.HeaderComponent(this.getElement('footer'), {mainComponent:this});
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecordData - 5");
+		MochiKit.Iter.forEach(MochiKit.Base.values(this.record().currentVersion().fields()), this.appendFieldComponent, this);
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecordData - 6");
+		this.setAddFieldButton(new YAHOO.ext.Button(this.getDom('addFieldButton'), {text:Clipperz.PM.Strings['recordDetailAddFieldButtonLabel'], handler:this.addNewRecordField, scope:this}));
+//MochiKit.Logging.logDebug("--- RecordDetail.MainComponent.renderWithSelectedRecordData - 7");
+
+		this.update();
+
+//MochiKit.Logging.logDebug("<<< RecordDetail.MainComponent.renderWithSelectedRecordData");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'editComponents': function() {
+		return this._editComponents;
+	},
+	
+	'resetEditComponents': function() {
+		this._editComponents = [];
+	},
+	
+	'addEditComponent': function(aValue) {
+		this.editComponents().push(aValue);
+	},
+	
+	'removeEditComponent': function(aValue) {
+		Clipperz.Base.removeFromArray(this.editComponents(), aValue);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'record': function() {
+		return this._record;
+	},
+	
+	'setRecord': function(aValue) {
+		var	result;
+		
+//MochiKit.Logging.logDebug(">>> MainComponent.setRecord")
+		if (this._record != aValue) {
+			var	deferredResult;
+			
+			deferredResult = new MochiKit.Async.Deferred();
+			
+			if ((this._record != null) && (this.editMode() == 'EDIT')) {
+				this.synchronizeComponentValues();
+				deferredResult.addCallback(MochiKit.Base.method(this._record, 'saveChanges'));
+			}
+			
+			this._record = aValue;
+			
+			if (aValue != null) {
+				this.setShouldShowLoginInfo(false);
+				deferredResult.addCallback(MochiKit.Base.method(this._record, 'deferredData'));
+			}
+			deferredResult.addCallbacks(
+				MochiKit.Base.method(this, 'render'),
+				MochiKit.Base.method(this, 'renderWithErrorMessage')
+			);
+			deferredResult.callback();
+			this.scrollToTop();
+			
+			result = deferredResult;
+		} else {
+			result = MochiKit.Async.success();
+		}
+//MochiKit.Logging.logDebug("<<< MainComponent.setRecord")
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'saveCurrentRecordChanges': function(aButtonElement) {
+		var deferred;
+		var currentNumberOfRecords;
+		
+		deferred = new MochiKit.Async.Deferred();
+		deferred.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'deferredShow'),
+			{
+				title:Clipperz.PM.Strings['recordDetailSavingChangesMessagePanelInitialTitle'],
+				text:Clipperz.PM.Strings['recordDetailSavingChangesMessagePanelInitialText'],
+				width:240,
+				showProgressBar:true,
+				showCloseButton:false,
+				steps:6
+			},
+			aButtonElement.dom
+		);
+		deferred.addCallback(MochiKit.Base.method(this, 'exitModalView'));
+		deferred.addCallback(MochiKit.Base.method(this.record(), 'saveChanges'));
+		deferred.addCallback(Clipperz.NotificationCenter.deferredNotification, this.record(), 'recordUpdated');
+		deferred.addCallback(function(res) {
+			Clipperz.PM.Components.MessageBox().hide(YAHOO.ext.Element.get('main'));
+			return res;
+		});
+
+		currentNumberOfRecords = MochiKit.Base.keys(this.user().records()).length;
+		if ((this.record().isBrandNew()) && (this.user().preferences().shouldShowDonationPanel()) && (currentNumberOfRecords >= 5)) {
+			deferred.addCallback(Clipperz.PM.showDonationSplashScreen, this.user(), 'recordListAddRecordButton');
+		}
+
+		deferred.callback();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'update': function(anEvent) {
+		if (this.editMode() == 'EDIT') {
+			this.updateEditMode();
+		} else if (this.editMode() == 'VIEW') {
+			this.updateViewMode();
+		}
+
+		MochiKit.Iter.forEach(this.editComponents(), MochiKit.Base.methodcaller('update'));
+	},
+
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {
+		this.addFieldButton().hide();
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'updateEditMode': function() {
+		this.addFieldButton().show();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'appendFieldComponent': function(aRecordField) {
+//MochiKit.Logging.logDebug(">>> MainComponent.appendFieldComponent");
+		new Clipperz.PM.Components.RecordDetail.FieldComponent(
+			Clipperz.YUI.DomHelper.append(this.getDom('tbody'), {tag:'tr'}, true),
+			{recordField:aRecordField, mainComponent:this}
+		);
+//MochiKit.Logging.logDebug("<<< MainComponent.appendFieldComponent");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'removeField': function(aFieldComponent) {
+		var	recordField;
+		
+//MochiKit.Logging.logDebug(">>> MainComponent.removeField")		
+		recordField = aFieldComponent.recordField();
+		this.removeEditComponent(aFieldComponent);
+		aFieldComponent.destroy();
+		this.record().removeField(recordField);
+
+		Clipperz.NotificationCenter.notify(this.record(), 'removedField');
+//MochiKit.Logging.logDebug("<<< MainComponent.removeField")		
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'synchronizeComponentValues': function() {
+		MochiKit.Iter.forEach(this.editComponents(), MochiKit.Base.methodcaller('synchronizeComponentValues'));
+	},
+
+	//=========================================================================
+
+	'addFieldButton': function() {
+		return this._addFieldButton;
+	},
+	
+	'setAddFieldButton': function(aValue) {
+		this._addFieldButton = aValue;
+	},
+	
+	'addNewRecordField': function() {
+		var	newField;
+		
+		newField = this.record().addNewField();
+		this.appendFieldComponent(newField);
+
+		Clipperz.NotificationCenter.notify(this.record(), 'addNewRecordField');
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'enterModalView': function() {
+/*
+		if (this.user().preferences().useSafeEditMode()) {
+			var headerMaskElement;
+			var verticalMaskElement;
+
+			headerMaskElement = YAHOO.ext.Element.get('recordDetailEditModeHeaderMask');
+			headerMaskElement.show().mask();
+
+			verticalMaskElement = YAHOO.ext.Element.get('recordDetailEditModeVerticalMask');
+			verticalMaskElement.show().mask();
+		}
+*/
+		this.mainPanel().enterModalView();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'exitModalView': function() {
+/*
+		if (this.user().preferences().useSafeEditMode()) {
+			var headerMaskElement;
+			var verticalMaskElement;
+			
+			headerMaskElement = YAHOO.ext.Element.get('recordDetailEditModeHeaderMask');
+			headerMaskElement.unmask();
+			headerMaskElement.hide();
+
+			verticalMaskElement = YAHOO.ext.Element.get('recordDetailEditModeVerticalMask');
+			verticalMaskElement.unmask();
+			verticalMaskElement.hide();
+		}
+*/
+		this.mainPanel().exitModalView();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'enableSaveButton': function() {
+		return this._enableSaveButton;
+	},
+	
+	'setEnableSaveButton': function(aValue) {
+		this._enableSaveButton = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'scrollToTop': function() {
+		YAHOO.ext.Element.get('recordTitleTopBlock').scrollIntoView(document.body);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'loginInfo': function() {
+		var	result;
+
+		if (this.shouldShowLoginInfo() == true) {
+//			 && (typeof(this.user().loginInfo()['latest']) != 'undefined')) {
+			var	imageExtension;
+			var currentConnectionText;
+			var currentIP;
+			var contentChildren;
+			
+			result = [];
+			contentChildren = [];
+			
+			imageExtension = (Clipperz_IEisBroken == true) ? 'gif': 'png';
+
+			contentChildren.push({tag:'h4', valign:'top', htmlString:Clipperz.PM.Strings['WELCOME_BACK']});
+
+			currentIP = (this.user().loginInfo()['current']['ip'].match(/^\d{1,3}(.\d{1,3}){3}$/)) ? this.user().loginInfo()['current']['ip'] : Clipperz.PM.Strings['unknown_ip'];
+			currentConnectionText = Clipperz.PM.Strings['currentConnectionText'];
+			currentConnectionText = currentConnectionText.replace(/__ip__/, "<b>" + Clipperz.Base.sanitizeString(this.user().loginInfo()['current']['ip']) + "</b>");
+			currentConnectionText = currentConnectionText.replace(/__country__/, "<b>" + Clipperz.PM.Strings['countries'][Clipperz.Base.sanitizeString(this.user().loginInfo()['current']['country'])] + "</b>");
+			currentConnectionText = currentConnectionText.replace(/__browser__/, "<b>" + Clipperz.PM.Strings['browsers'][Clipperz.Base.sanitizeString(this.user().loginInfo()['current']['browser'])] + "</b>");
+			currentConnectionText = currentConnectionText.replace(/__operatingSystem__/, "<b>" + Clipperz.PM.Strings['operatingSystems'][Clipperz.Base.sanitizeString(this.user().loginInfo()['current']['operatingSystem'])] + "</b>");
+
+			contentChildren.push(
+				{tag:'div', cls:'loginInfo_now', children:[
+					{tag:'div', cls:'text', htmlString:currentConnectionText},
+					{tag:'div', cls:'icons', children:[
+						{tag:'img', title:Clipperz.PM.Strings['countries'][Clipperz.Base.sanitizeString(this.user().loginInfo()['current']['country'])], cls:'flag', src:Clipperz.PM.Strings['icons_baseUrl'] + "/flags/" + Clipperz.Base.sanitizeString(this.user().loginInfo()['current']['country']).toLowerCase() + "." +  imageExtension, width:'32', height:'32'},
+						{tag:'img', title:Clipperz.PM.Strings['browsers'][Clipperz.Base.sanitizeString(this.user().loginInfo()['current']['browser'])], src:Clipperz.PM.Strings['icons_baseUrl'] + "/browsers/" + Clipperz.Base.sanitizeString(this.user().loginInfo()['current']['browser']).toLowerCase() + "." + imageExtension, width:'32', height:'32'},
+						{tag:'img', title:Clipperz.PM.Strings['operatingSystems'][Clipperz.Base.sanitizeString(this.user().loginInfo()['current']['operatingSystem'])], src:Clipperz.PM.Strings['icons_baseUrl'] + "/operatingSystems/" + Clipperz.Base.sanitizeString(this.user().loginInfo()['current']['operatingSystem']).toLowerCase() + "." + imageExtension, width:'32', height:'32'}
+					]}
+				]}
+			);
+			
+			if (typeof(this.user().loginInfo()['latest']) != 'undefined') {
+				var latestLoginDate;
+				var elapsedTimeDescription;
+				var latestIP;
+				var latestConnectionText;
+
+				latestLoginDate = Clipperz.PM.Date.parseDateWithUTCFormat(Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['date']));
+			
+				elapsedTimeDescription = Clipperz.PM.Date.getElapsedTimeDescription(latestLoginDate);
+				latestIP =  (this.user().loginInfo()['latest']['ip'].match(/^\d{1,3}(.\d{1,3}){3}$/)) ? this.user().loginInfo()['latest']['ip'] : Clipperz.PM.Strings['unknown_ip'];
+
+				latestConnectionText = Clipperz.PM.Strings['latestConnectionText'];
+				latestConnectionText = latestConnectionText.replace(/__elapsedTimeDescription__/, "<b>" + elapsedTimeDescription + "</b>");
+				latestConnectionText = latestConnectionText.replace(/__time__/, Clipperz.PM.Date.formatDateWithTemplate(latestLoginDate, Clipperz.PM.Strings['fullDate_format']));
+				latestConnectionText = latestConnectionText.replace(/__ip__/, "<b>" + Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['ip']) + "</b>");
+				latestConnectionText = latestConnectionText.replace(/__country__/, "<b>" + Clipperz.PM.Strings['countries'][Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['country'])] + "</b>");
+				latestConnectionText = latestConnectionText.replace(/__browser__/, "<b>" + Clipperz.PM.Strings['browsers'][Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['browser'])] + "</b>");
+				latestConnectionText = latestConnectionText.replace(/__operatingSystem__/, "<b>" + Clipperz.PM.Strings['operatingSystems'][Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['operatingSystem'])] + "</b>");
+
+
+				contentChildren.push(
+					{tag:'div', cls:'loginInfo_latest', children:[
+						{tag:'div', cls:'inner_header', html:'&nbsp;'},
+						{tag:'div', cls:'content', children:[
+							{tag:'div', cls:'text', htmlString:latestConnectionText},
+							{tag:'div', cls:'icons', children:[
+								{tag:'img', title:Clipperz.PM.Strings['countries'][Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['country'])], cls:'flag', src:Clipperz.PM.Strings['icons_baseUrl'] + "/flags/" + Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['country']).toLowerCase() + "." +  imageExtension, width:'32', height:'32'},
+								{tag:'img', title:Clipperz.PM.Strings['browsers'][Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['browser'])], src:Clipperz.PM.Strings['icons_baseUrl'] + "/browsers/" + Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['browser']).toLowerCase() + "." + imageExtension, width:'32', height:'32'},
+								{tag:'img', title:Clipperz.PM.Strings['operatingSystems'][Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['operatingSystem'])], src:Clipperz.PM.Strings['icons_baseUrl'] + "/operatingSystems/" + Clipperz.Base.sanitizeString(this.user().loginInfo()['latest']['operatingSystem']).toLowerCase() + "." + imageExtension, width:'32', height:'32'}
+							]}
+						]},
+						{tag:'div', children:[
+							{tag:'a', href:'#', id:'fullLoginHistoryLink', htmlString:Clipperz.PM.Strings['fullLoginHistoryLinkLabel']}
+						]},
+						{tag:'div', cls:'inner_footer', html:'&nbsp;'}
+					]}
+				);
+			}
+			
+			contentChildren.push(
+				{tag:'table', id:'shouldDownloadOfflineCopyWarningBox', children:[
+					{tag:'tbody', width:'100%', children:[
+						{tag:'tr', children:[
+							{tag:'td', cls:'offlineCopyDownloadWarningIconTD', valign:'top', align:'center', width:'50', children:(this.user().shouldDownloadOfflineCopy() ? [{tag:'img', src:Clipperz.PM.Strings['icons_baseUrl'] + "/misc/offlineCopyWarning.png" , width:'32', height:'32'}]: [])},
+							{tag:'td', children:[
+								{tag:'div', cls:'offlineCopyDownloadWarning', htmlString:(this.user().shouldDownloadOfflineCopy() ? Clipperz.PM.Strings['offlineCopyDownloadWarning']: Clipperz.PM.Strings['offlineCopyDownloadOk'])}
+							]}
+						]}
+					]}
+				]}
+			);
+
+
+			result = [{tag:'div', id:'loginInfoWrapper', children:[{tag:'div', id:'loginInfo', children:[
+				{tag:'div', cls:'header', html:'&nbsp;'},
+				{tag:'div', cls:'content', children:contentChildren},
+				{tag:'div', cls:'footer', html:'&nbsp;'}
+			]}]}];
+
+//			this.setShouldShowLoginInfo(false);
+		} else {
+			resut = [];
+		}
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'shouldShowLoginInfo': function() {
+		return this._shouldShowLoginInfo;
+	},
+	
+	'setShouldShowLoginInfo': function(aValue) {
+		this._shouldShowLoginInfo = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'showLoginHistoryPanel': function(anEvent) {
+		anEvent.stop();
+		
+		Clipperz.NotificationCenter.notify(this, 'selectTab', 'mainTabPanel.accountTab', true);
+		Clipperz.NotificationCenter.notify(this, 'selectTab', 'accountTabPanel.loginHistoryTab', true);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'showDownloadOfflineCopyPanel': function(anEvent) {
+		anEvent.stop();
+		
+		Clipperz.NotificationCenter.notify(this, 'selectTab', 'mainTabPanel.dataTab', true);
+		Clipperz.NotificationCenter.notify(this, 'selectTab', 'dataTabPanel.offlineCopyTab', true);
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/NotesComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/NotesComponent.js
new file mode 100644
index 0000000..6f454fc
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/NotesComponent.js
@@ -0,0 +1,240 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+
+
+Clipperz.PM.Components.RecordDetail.NotesComponent = function(anElement, args) {
+//MochiKit.Logging.logDebug(">>> new NotesComponent");
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.NotesComponent.superclass.constructor.call(this, anElement, args);
+
+	this.mainComponent().addEditComponent(this);
+
+	this._staticOffset = null;
+	this._componentHeight = 50;
+	this._mouseMoveIdentifier = null;
+	this._mouseUpIdentifier = null;
+	
+	this.element().setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+	
+	this.render();
+//MochiKit.Logging.logDebug("<<< new NotesComponent");
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.NotesComponent, Clipperz.PM.Components.RecordDetail.AbstractComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.NotesComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'value': function() {
+		return this.record().notes();
+	},
+
+	'setValue': function(aValue) {
+		this.record().setNotes(aValue);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//MochiKit.Logging.logDebug(">>> NotesComponent.render");
+/*
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td', colspan:'5', children:[
+			{tag:'span', cls:'noteFieldLabel', htmlString:Clipperz.PM.Strings['recordDetailNotesLabel']},
+			{tag:'div', cls:'noteFieldContent', id:this.getId('notes')}
+		]});
+*/		
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'span', cls:'noteFieldLabel', htmlString:Clipperz.PM.Strings['recordDetailNotesLabel']});
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', cls:'noteFieldContent', id:this.getId('notes'), children:[
+			{tag:'div', id:this.getId('resizableDiv'), cls:'resizable-textarea', children:[
+				{tag:'div', id:this.getId('contentView'), cls:'viewMode', html:""},
+				{tag:'div', id:this.getId('contentEdit'), children:[
+					{tag:'span', children:[
+						{tag:'textarea', id:this.getId('textarea'), html:""}
+					]}
+				]},
+				{tag:'div', id:this.getId('grippie'), cls:'grippie'}
+			]}
+		]});
+
+		this.getElement('contentView').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+		this.getElement('contentEdit').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+
+		MochiKit.Signal.connect(this.getId('grippie'), 'onmousedown', this, 'startResize');
+		
+		this.update();
+//MochiKit.Logging.logDebug("<<< NotesComponent.render");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {
+//MochiKit.Logging.logDebug(">>> NotesComponent.updateViewMode");
+//		this.getElement('notes').update(this.value().replace(/\n/g, '<br>'));
+
+		this.getElement('contentView').update(Clipperz.Base.sanitizeString(this.value()).replace(/\n/g, '<br>'));
+
+		if (this.isNoteEmpty()) {
+			this.element().hide();
+		} else {
+			this.getElement('contentView').show();
+			this.getElement('contentView').setHeight(this.componentHeight());
+		}
+		this.getElement('contentEdit').hide();
+
+//MochiKit.Logging.logDebug("<<< NotesComponent.updateViewMode");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'updateEditMode': function() {
+//MochiKit.Logging.logDebug(">>> NotesComponent.updateEditMode");
+		this.getDom('textarea').value = this.value().replace(/\n/g, Clipperz_normalizedNewLine);
+
+		this.getElement('contentView').hide();
+		this.getElement('contentEdit').show();
+		
+		this.getElement('textarea').setHeight(this.componentHeight());
+//MochiKit.Logging.logDebug("<<< NotesComponent.updateEditMode");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'synchronizeComponentValues': function() {
+//MochiKit.Logging.logDebug(">>> NotesComponent.synchronizeComponentValues");
+		if (this.getElement('textarea') != null) {
+			this.setValue(this.getDom('textarea').value.replace(/(\x0a\x0d|\x0d\x0a)/g,'\n'));
+		}
+//MochiKit.Logging.logDebug("<<< NotesComponent.synchronizeComponentValues");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'componentHeight': function() {
+		return this._componentHeight;
+	},
+	
+	'setComponentHeight': function(aValue) {
+		this._componentHeight = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isNoteEmpty': function() {
+		return !/[^ \n]/.test(this.value());
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'staticOffset': function() {
+		return this._staticOffset;
+	},
+	
+	'setStaticOffset': function(aValue) {
+		this._staticOffset = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'startResize': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> startResize");
+		if (this.editMode() == 'VIEW') {
+			this.setStaticOffset(this.getElement('contentView').getHeight() - anEvent.mouse().page['y'])
+		} else {
+			this.setStaticOffset(this.getElement('textarea').getHeight() - anEvent.mouse().page['y'])
+//			this.getElement('textarea').setStyle('opacity', 0.25);
+		}
+		this.setMouseMoveIdentifier(MochiKit.Signal.connect(MochiKit.DOM.currentDocument(), 'onmousemove', this, 'whileResizing'));
+		this.setMouseUpIdentifier(MochiKit.Signal.connect(MochiKit.DOM.currentDocument(), 'onmouseup', this, 'endResize'));
+		anEvent.stop();
+//MochiKit.Logging.logDebug("<<< startResize");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'whileResizing': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> whileResizing");
+		this.getElement('textarea').setHeight(Math.max(32, this.staticOffset() + anEvent.mouse().page['y']) + 'px');
+		this.getElement('contentView').setHeight(Math.max(32, this.staticOffset() + anEvent.mouse().page['y']) + 'px');
+		anEvent.stop();
+//MochiKit.Logging.logDebug("<<< whileResizing");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'endResize': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> endResize");
+		MochiKit.Signal.disconnect(this.mouseMoveIdentifier());
+		this.setMouseMoveIdentifier(null);
+		MochiKit.Signal.disconnect(this.mouseUpIdentifier());
+		this.setMouseUpIdentifier(null);
+//		this.getElement('textarea').setStyle('opacity', 1);
+
+		this.setComponentHeight(this.getElement('textarea').getHeight());
+//MochiKit.Logging.logDebug("<<< endResize");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'mouseMoveIdentifier': function() {
+		return this._mouseMoveIdentifier;
+	},
+	
+	'setMouseMoveIdentifier': function(aValue) {
+		this._mouseMoveIdentifier = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'mouseUpIdentifier': function() {
+		return this._mouseUpIdentifier;
+	},
+	
+	'setMouseUpIdentifier': function(aValue) {
+		this._mouseUpIdentifier = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/RecordDetail/TitleComponent.js b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/TitleComponent.js
new file mode 100644
index 0000000..52e718c
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/RecordDetail/TitleComponent.js
@@ -0,0 +1,137 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.RecordDetail) == 'undefined') { Clipperz.PM.Components.RecordDetail = {}; }
+
+//#############################################################################
+
+Clipperz.PM.Components.RecordDetail.TitleComponent = function(anElement, args) {
+	args = args || {};
+
+    Clipperz.PM.Components.RecordDetail.TitleComponent.superclass.constructor.call(this, anElement, args);
+
+//	this._inputElement = null;
+
+	this.mainComponent().addEditComponent(this);
+
+	this.render();
+	
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.RecordDetail.TitleComponent, Clipperz.PM.Components.RecordDetail.AbstractComponent, {
+
+	'toString': function() {
+		return "Clipperz.PM.Components.RecordDetail.TitleComponent component";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'value': function() {
+		return this.record().label();
+	},
+
+	'setValue': function(aValue) {
+		this.record().setLabel(aValue);
+	},
+	
+	//-------------------------------------------------------------------------
+/*
+	'inputElement': function() {
+		return this._inputElement;
+	},
+	
+	'setInputElement': function(aValue) {
+		this._inputElement = aValue;
+	},
+*/
+	//-------------------------------------------------------------------------
+
+	'render': function() {
+//		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td', html:'&#160'});
+//		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td', colspan:"3", html:'&#160', children:[
+//			{tag:'div', /*style:'border: 1px solid green;',*/ id:this.getId('title')}
+//		]});
+//		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'td', html:'&#160'});
+//		
+//		this.setInputElement(new Clipperz.PM.Components.TextFormField(this.getElement('title'), {editMode:this.editMode(), value:this.value()}));
+		
+		this.update();
+	},
+
+	//-------------------------------------------------------------------------
+/*
+	'update': function() {
+		this.inputElement().update({value:this.value(), editMode:this.editMode()});
+	},
+*/	
+	//-------------------------------------------------------------------------
+
+	'updateViewMode': function() {
+		this.element().update("");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'h2', html:this.value()});
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'updateEditMode': function() {
+//MochiKit.Logging.logDebug(">>> TitleComponent.updateEditMode");
+//		this.getElement('title').update("");
+//		Clipperz.YUI.DomHelper.append(this.getDom('title'), {tag:'div', id:this.getId('title_input')});
+//		this.setInputElement(Clipperz.YUI.DomHelper.append(this.getDom('title_input'), {tag:'input', type:'text', value:this.value()}, true));
+		
+		this.element().update("");
+		Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'input', id:this.getId('titleField'), type:'text', value:"this.value()"});
+		this.getElement('titleField').dom.value = this.value();
+		
+//MochiKit.Logging.logDebug("<<< TitleComponent.updateEditMode");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'synchronizeComponentValues': function() {
+		var inputElement;
+		
+//MochiKit.Logging.logDebug(">>> TitleComponent.synchronizeComponentValues");
+		inputElement = this.element().getChildrenByTagName('input')[0];
+		
+		if (inputElement != null) {
+			this.setValue(inputElement.dom.value);
+		}
+//MochiKit.Logging.logDebug("<<< TitleComponent.synchronizeComponentValues");
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Components/TabPanel/TabPanelController.js b/frontend/beta/js/Clipperz/PM/Components/TabPanel/TabPanelController.js
new file mode 100644
index 0000000..c872462
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/TabPanel/TabPanelController.js
@@ -0,0 +1,158 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+if (typeof(Clipperz.PM.Components.TabPanel) == 'undefined') { Clipperz.PM.Components.TabPanel = {}; }
+
+Clipperz.PM.Components.TabPanel.TabPanelController = function(args) {
+	args = args || {};
+
+    Clipperz.PM.Components.TabPanel.TabPanelController.superclass.constructor.call(this);
+
+	this._name = args.name || 'undefined';
+	this._config = args.config;
+	this._selectedTab = args.selectedTab || ((MochiKit.Base.keys(args.config).length > 0) ? MochiKit.Base.keys(args.config)[0] : null);
+	
+	this._tabs = {};
+	this._panels = {};
+
+	Clipperz.NotificationCenter.register(null, 'selectTab', this, 'handleSelectTabNotification');
+	return this;
+}
+
+//=============================================================================
+
+YAHOO.extendX(Clipperz.PM.Components.TabPanel.TabPanelController, YAHOO.ext.util.Observable, {
+
+	//-------------------------------------------------------------------------
+
+	'name': function() {
+		return this._name;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'tabs': function() {
+		return this._tabs;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'panels': function() {
+		return this._panels;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'config': function() {
+		return this._config;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'selectedTab': function() {
+		return this._selectedTab;
+	},
+	
+	'setSelectedTab': function(aValue) {
+		this._selectedTab = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'setUp': function() {
+		var	tabId;
+		
+//MochiKit.Logging.logDebug(">>> TabPanelController.setUp - config: " + Clipperz.Base.serializeJSON(this.config()));
+		for (tabId in this.config()) {
+			var	tabElement;
+			var	panelElement;
+
+//MochiKit.Logging.logDebug("--- TabPanelController.setUp - tabId: " + tabId);
+//MochiKit.Logging.logDebug("--- TabPanelController.setUp - panelId: " + this.config()[tabId]);
+			tabElement = YAHOO.ext.Element.get(tabId);
+			tabElement.addClassOnOver("hover");
+			MochiKit.Signal.connect(tabId, 'onclick', this, 'selectTabHandler');
+
+			panelElement = YAHOO.ext.Element.get(this.config()[tabId]);
+			
+			this._tabs[tabId] = tabElement;
+			this._panels[tabId] = panelElement;
+			
+			if (tabId == this.selectedTab()) {
+				tabElement.addClass('selectedTab');
+				panelElement.addClass('selectedPanel');
+			} else {
+				panelElement.addClass('hiddenPanel');
+			}
+		}
+//MochiKit.Logging.logDebug("<<< TabPanelController.setUp");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'selectTab': function(aTab) {
+		if (aTab != this.selectedTab()) {
+			this.tabs()[this.selectedTab()].removeClass('selectedTab');
+			this.panels()[this.selectedTab()].removeClass('selectedPanel').addClass('hiddenPanel');
+		
+			this.tabs()[aTab].addClass('selectedTab');
+			this.panels()[aTab].addClass('selectedPanel').removeClass('hiddenPanel');
+			
+			this.setSelectedTab(aTab);
+			
+			Clipperz.NotificationCenter.notify(this, 'tabSelected', aTab);
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'selectTabHandler': function(anEvent) {
+		this.selectTab(anEvent.src().id);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handleSelectTabNotification': function(aNotificationEvent) {
+		var parameters;
+		var splittedParamters;
+		var	targetTabPanel;
+
+		parameters = aNotificationEvent.parameters();
+		splittedParamters = parameters.split('.');
+		targetTabPanel = splittedParamters[0];
+		if (targetTabPanel == this.name()) {
+			this.selectTab(splittedParamters[1])
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/PM/Components/TextFormField.js b/frontend/beta/js/Clipperz/PM/Components/TextFormField.js
new file mode 100644
index 0000000..cb4f06a
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Components/TextFormField.js
@@ -0,0 +1,310 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Components) == 'undefined') { Clipperz.PM.Components = {}; }
+
+Clipperz.PM.Components.TextFormField = function(anElement, args) {
+	args = args || {};
+
+//MochiKit.Logging.logDebug(">>> new TextFormField");
+	Clipperz.PM.Components.TextFormField.superclass.constructor.call(this, args);
+	
+	this._element = anElement;
+	this._editMode = args.editMode || 'VIEW';
+	this._value = args.value || "";
+	this._inputElement = null;
+	this._wrapper = null;
+	this._multiline = args.multiline || false;
+	
+//	this.multiline = args.multiline || true;
+//	this.editing = true;
+//	this.completeOnBlur = true;
+//	this.autoSizeTask = new YAHOO.ext.util.DelayedTask(this.autoSize, this);
+//	this.textSizeEl = Clipperz.YUI.DomHelper.append(document.body, {
+//		tag: 'div',
+//		cls: 'yinline-editor-sizer ' + (this.cls || '')
+//	});
+	
+	this.render();
+//MochiKit.Logging.logDebug("<<< new TextFormField");
+	
+	return this;
+};
+
+YAHOO.extendX(Clipperz.PM.Components.TextFormField, Clipperz.PM.Components.BaseComponent, {
+	
+	'toString': function() {
+		return "Clipperz.PM.Components.TextFormField";
+	},
+	
+	//-----------------------------------------------------
+
+	'value': function() {
+		if (this.inputElement() != null) {
+			this._value = this.inputElement().dom.value;
+		}
+		
+		return this._value;
+//		return this.inlineEditor().getValue();
+	},
+	
+	'setValue': function(aValue) {
+		this._value = aValue;
+//		this.getElement('viewComponent_Content').update(aValue);
+//		this.inlineEditor().setValue(aValue);
+	},
+
+	//-----------------------------------------------------
+
+	'multiline': function() {
+		return this._multiline;
+	},
+	
+	//-----------------------------------------------------
+
+	'editMode': function() {
+		return this._editMode;
+	},
+	
+	'setEditMode': function(aValue) {
+		this._editMode = aValue;
+	},
+
+	//-----------------------------------------------------
+
+	'inputElement': function() {
+		return this._inputElement;
+	},
+
+	'setInputElement': function(aValue) {
+		this._inputElement = aValue;
+	},
+
+	//-----------------------------------------------------
+
+	'on': function(anEventName, anHandler, aScope, shouldOverride) {
+//MochiKit.Logging.logDebug(">>> TextFormField.on - inputElement: " + this.inputElement());
+		return this.inputElement().on(anEventName, anHandler, aScope, shouldOverride);
+//MochiKit.Logging.logDebug("<<< TextFormField.on - inputElement: " + this.inputElement());
+	},
+
+	//-----------------------------------------------------
+	
+	'wrapper': function() {
+		return this._wrapper;
+	},
+	
+	//-----------------------------------------------------
+
+	'render': function() {
+		var editModeConfiguration;
+		var viewModeConfiguration;
+
+		editModeConfiguration = {tag:'div', id:this.getId('editComponent'), children:[]};
+		if (this.multiline() == false) {
+			editModeConfiguration.children.push({tag:'input', type:'text', id:this.getId('editComponent_input'), value:"this.value(1)"});
+		} else {
+			editModeConfiguration.children.push({tag:'textarea', id:this.getId('editComponent_input'), html:"this.value(2)"});
+		}
+
+		viewModeConfiguration = {tag:'div', id:this.getId('viewComponent'), /*style:'border: 1px solid blue;',*/ children:[
+			{tag:'span', id:this.getId('viewComponent_Content'), html:this.value()}
+		]}
+
+//MochiKit.Logging.logDebug(">>> TextFormField.render");
+		this._wrapper = Clipperz.YUI.DomHelper.append(this.element().dom, {tag:'div', id:this.getId('wrapper'), children:[
+			{tag:'div', id:this.getId('editModeBox'), children:[editModeConfiguration]},
+			{tag:'div', id:this.getId('viewModeBox'), children:[viewModeConfiguration]}
+		]}, true);
+		
+		this.getElement('editModeBox').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+		this.getElement('viewModeBox').setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+
+		this.getElement('editComponent_input').dom.value = this.value();
+		this.setInputElement(this.getElement('editComponent_input'));
+		
+		this.update();
+//MochiKit.Logging.logDebug("<<< TextFormField.render");
+	},
+
+	//-----------------------------------------------------
+
+	'update': function(args) {
+		args = args || {};
+		
+//MochiKit.Logging.logDebug(">>> TextFormField.update");
+		if (typeof(args.value) != 'undefined') {
+			this.setValue(args.value);
+		}
+		if (typeof(args.editMode) != 'undefined') {
+			this.setEditMode(args.editMode)
+		}
+		
+		if (this.editMode() == 'VIEW') {
+			this.updateViewMode();
+		} else if (this.editMode() == 'EDIT') {
+			this.updateEditMode();
+		} else {
+			//	?????
+		}
+//MochiKit.Logging.logDebug("<<< TextFormField.update");
+	},
+
+	//-----------------------------------------------------
+
+	'updateEditMode': function() {
+//MochiKit.Logging.logDebug(">>> TextFormField.updateEditMode");
+		this.getElement('viewModeBox').hide();
+		this.getElement('editModeBox').show();
+
+		if (this.multiline() == false) {
+			this.getElement('editComponent_input').dom.value = this.value();
+		} else {
+			this.getElement('editComponent_input').update(Clipperz.Base.sanitizeString(this.value()));
+		}
+//MochiKit.Logging.logDebug("<<< TextFormField.updateEditMode");
+	},
+
+	//-----------------------------------------------------
+
+	'updateViewMode': function() {
+//MochiKit.Logging.logDebug(">>> TextFormField.updateViewMode");
+		this.getElement('editModeBox').hide();
+		this.getElement('viewModeBox').show();
+
+		this.getElement('viewComponent_Content').update(Clipperz.Base.sanitizeString(this.value()));
+//MochiKit.Logging.logDebug("<<< TextFormField.updateViewMode");
+	},
+    
+	//#####################################################
+	//#####################################################
+	//#####################################################
+	//#####################################################
+/*	
+	'onEnter': function(k, e) {
+MochiKit.Logging.logDebug(">>> TextFormField.onEnter");
+		if (this.multiline && (e.ctrlKey || e.shiftKey)) {
+			return;
+		} else {
+			this.completeEdit();
+			e.stopEvent();
+		}
+MochiKit.Logging.logDebug("<<< TextFormField.onEnter");
+	},
+
+	//-----------------------------------------------------
+
+	'onEsc': function() {
+MochiKit.Logging.logDebug(">>> TextFormField.onEsc");
+//		if (this.ignoreNoChange) {
+//			this.revert(true);
+//		} else {
+			this.revert(false);
+			this.completeEdit();
+//		}
+MochiKit.Logging.logDebug("<<< TextFormField.onEsc");
+	},
+
+	//-----------------------------------------------------
+
+	onBlur : function(){
+MochiKit.Logging.logDebug(">>> TextFormField.onBlur");
+		if (this.editing && this.completeOnBlur !== false) {
+			this.completeEdit();
+		}
+MochiKit.Logging.logDebug("<<< TextFormField.onBlur");
+	},
+
+	//-----------------------------------------------------
+
+	'onKeyUp': function(e) {
+		var k = e.getKey();
+		if (this.editing && (k < 33 || k > 40) && k != 27) {
+			this.autoSizeTask.delay(50);
+		}
+	},
+
+	//-----------------------------------------------------
+
+	'autoSize': function() {
+		var el = this.inputElement();
+		var wrap = this.getElement('editComponent');
+		var v = el.dom.value;
+		var ts = this.textSizeEl;
+
+		if (v.length < 1) {
+			ts.innerHTML = "&#160;&#160;";
+		} else {
+			v = v.replace(/[<> ]/g, '&#160;');
+			if (this.multiline) {
+				v = v.replace(/\n/g, '<br />&#160;');
+			}
+			ts.innerHTML = v;
+		}
+		
+		var ww = wrap.dom.offsetWidth;
+		var wh = wrap.dom.offsetHeight;
+		var w = ts.offsetWidth;
+		var h = ts.offsetHeight;
+		// lots of magic numbers in this block - wtf?
+		// the logic is to prevent the scrollbars from flashing
+		// in firefox. Updates the right element first
+		// so there's never overflow.
+		if (ww > w+4) {
+			el.setWidth(w+4);
+			wrap.setWidth(w+8);
+		} else {
+			wrap.setWidth(w+8);
+			el.setWidth(w+4);
+		}
+		if (wh > h+4) {
+			el.setHeight(h);
+			wrap.setHeight(h+4);
+		} else {
+			wrap.setHeight(h+4);
+			el.setHeight(h);
+		}
+	},
+
+	//-----------------------------------------------------
+
+	'completeEdit': function() {
+MochiKit.Logging.logDebug(">>> TextFormField.completeEdit");
+		
+	},
+
+	'revert': function() {
+MochiKit.Logging.logDebug(">>> TextFormField.revert");
+		
+	},
+*/	
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
diff --git a/frontend/beta/js/Clipperz/PM/Connection.js b/frontend/beta/js/Clipperz/PM/Connection.js
new file mode 100644
index 0000000..cf37ccc
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Connection.js
@@ -0,0 +1,584 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+
+//-----------------------------------------------------------------------------
+//
+//		Abstract   C O N N E C T I O N   class
+//
+//-----------------------------------------------------------------------------
+
+Clipperz.PM.Connection = function (args) {
+	args = args || {};
+
+	this._user = args.user;
+	this._clipperz_pm_crypto_version = null;
+	this._connectionId = null;
+	this._oneTimePassword = null;
+	
+	return this;
+}
+
+Clipperz.PM.Connection.prototype = MochiKit.Base.update(null, {
+
+	'user': function() {
+		return this._user;
+	},
+	
+	'toString': function() {
+		return "Connection [" + this.version() + "] - user: " + this.user();
+	},
+	
+	//=========================================================================
+
+	'version': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+	
+	'clipperz_pm_crypto_version': function() {
+		if (this._clipperz_pm_crypto_version == null) {
+			var connectionVersions;
+			var	versions;
+			var	version;
+			var i, c;
+
+			version = null;
+			connectionVersions = Clipperz.PM.Crypto.communicationProtocol.versions;
+			versions = MochiKit.Base.keys(connectionVersions);
+			c = versions.length;
+			for (i=0; i<c; i++) {
+				if (! (versions[i] == 'current')) {
+					if (this instanceof connectionVersions[versions[i]]) {
+						version = versions[i];
+					};
+				}
+			}
+			
+			this._clipperz_pm_crypto_version = version;
+		}
+		
+		return this._clipperz_pm_crypto_version;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'defaultErrorHandler': function(anErrorString, anException) {
+MochiKit.Logging.logError("### Connection.defaultErrorHandler: " + anErrorString + " (" + anException + ")");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'login': function(someArguments, aCallback) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'message': function(someArguments, aCallback) {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'sharedSecret': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	'serverSideUserCredentials': function() {
+		throw Clipperz.Base.exception.AbstractMethod;
+	},
+
+	//=========================================================================
+
+	'connectionId': function() {
+		return this._connectionId;
+	},
+	
+	'setConnectionId': function(aValue) {
+		this._connectionId = aValue;
+	},
+
+	//=========================================================================
+
+	'oneTimePassword': function() {
+		return this._oneTimePassword;
+	},
+	
+	'setOneTimePassword': function(aValue) {
+		this._oneTimePassword = aValue;
+	},
+	
+	//=========================================================================
+	__syntaxFix__: "syntax fix"
+
+}
+);
+
+
+if (typeof(Clipperz.PM.Connection.SRP) == 'undefined') { Clipperz.PM.Connection.SRP = {}; }
+//-----------------------------------------------------------------------------
+//
+//		S R P [ 1 . 0 ]    C O N N E C T I O N   class
+//
+//-----------------------------------------------------------------------------
+
+Clipperz.PM.Connection.SRP['1.0'] = function (args) {
+	args = args || {};
+	Clipperz.PM.Connection.call(this, args);
+	
+	this._C = null;
+	this._P = null;
+	this._srpConnection = null;
+	
+	return this;
+}
+
+Clipperz.PM.Connection.SRP['1.0'].prototype = MochiKit.Base.update(new Clipperz.PM.Connection(), {
+
+	'version': function() {
+		return '1.0';
+	},
+
+	//=========================================================================
+	
+	'register': function(anInvitationCode) {
+		var deferredResult;
+		var	parameters;
+
+//MochiKit.Logging.logError(">>> Connection.register: " + this);
+		parameters = {};
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.register - 1: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'registration_verify');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.register - 2: " + res); return res;});
+		deferredResult.addCallback(function(aConnection, anInvitationCode) {
+			var args;
+			
+			args = {};
+			args.message = 'register';
+			args.version = aConnection.clipperz_pm_crypto_version();
+			args.invitationCode = anInvitationCode;
+			
+			return args;
+		}, this);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.register - 3: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'registration_sendingCredentials');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.register - 4: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.user(), 'encryptedData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.register - 5: " + res); return res;});
+		deferredResult.addCallback(function(someParameters, anUser, anEncryptedData) {
+			var currentVersionConnection;
+			var args;
+
+			currentVersionConnection = new Clipperz.PM.Crypto.communicationProtocol.versions['current']({user:anUser});
+			
+			args = someParameters
+			args.credentials = currentVersionConnection.serverSideUserCredentials();
+			args.user = anEncryptedData;
+			args.version = args.credentials.version;
+			args.message = "completeRegistration";
+
+			return args;
+		}, parameters, this.user());
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.register - 6: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Proxy.defaultProxy, 'registration'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.register - 7: " + Clipperz.Base.serializeJSON(res)); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			this.user().setLock(res['lock']);
+
+			return res;
+		}, this));
+		deferredResult.callback(anInvitationCode);
+//MochiKit.Logging.logError("<<< Connection.register");
+		
+		return deferredResult;
+	},
+
+	//=========================================================================
+
+	'login': function(isReconnecting) {
+		var	deferredResult;
+		
+//MochiKit.Logging.logDebug(">>> Connection.login: "/* + this*/);
+//MochiKit.Logging.logDebug("--- Connection.login - isReconnecting: " + (isReconnecting == true));
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.3.1 - Connection.login - 1: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'connection_sendingCredentials');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.3.2 - Connection.login - 2: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(function(aConnection) {
+			var args;
+			
+			args = {};
+			args.message = 'connect';
+			args.version = aConnection.clipperz_pm_crypto_version();
+			args.parameters = {};
+//MochiKit.Logging.logDebug("=== Connection.login - username: " + aConnection.srpConnection().C());
+			args.parameters['C'] = aConnection.srpConnection().C();
+			args.parameters['A'] = aConnection.srpConnection().A().asString(16);
+			
+			if (isReconnecting == true) {
+//MochiKit.Logging.logDebug("--- Connection.login - reconnecting");
+//#				args.parameters['reconnecting'] = "yes";
+				args.parameters['reconnecting'] = aConnection.connectionId();
+			}
+//MochiKit.Logging.logDebug("--- Connection.login - args: " + Clipperz.Base.serializeJSON(args));
+//MochiKit.Logging.logDebug("--- Connection.login - srp.a: " + aConnection.srpConnection().a().asString(16));
+
+			return args;
+		});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.3.3 - Connection.login - 3: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Proxy.defaultProxy, 'handshake'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.3.4 - Connection.login - 4: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'connection_credentialVerification');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.3.5 - Connection.login - 5: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+deferredResult.addErrback(MochiKit.Base.bind(function(res) {MochiKit.Logging.logDebug("ERROR - c: " + this.srpConnection().C() + " # version: " + this.clipperz_pm_crypto_version()); return res;}, this));
+		deferredResult.addCallback(MochiKit.Base.bind(function(someParameters) {
+			var args;
+
+			this.srpConnection().set_s(new Clipperz.Crypto.BigInt(someParameters['s'], 16));
+			this.srpConnection().set_B(new Clipperz.Crypto.BigInt(someParameters['B'], 16));
+
+			if (typeof(someParameters['oneTimePassword']) != 'undefined') {
+				this.setOneTimePassword(someParameters['oneTimePassword']);
+			}
+			
+			args = {};
+			args.message = 'credentialCheck';
+			args.version = this.clipperz_pm_crypto_version();
+			args.parameters = {};
+			args.parameters['M1'] = this.srpConnection().M1();
+
+			return args;
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.3.6 - Connection.login - 6: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Proxy.defaultProxy, 'handshake'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.3.7 - Connection.login - 7: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+//#		deferredResult.addCallback(MochiKit.Base.method(this, 'loginDone'));
+		deferredResult.addCallback(MochiKit.Base.bind(function(someParameters) {
+			var result;
+		
+//MochiKit.Logging.logDebug(">>> Connection.loginDone: " + this + " (M2: " + this.srpConnection().M2() + ")");
+			if (someParameters['M2'] == this.srpConnection().M2()) {
+				result = new MochiKit.Async.Deferred();
+				
+//MochiKit.Logging.logDebug("--- Connection.loginDone - someParameters: " + Clipperz.Base.serializeJSON(someParameters));
+				this.setConnectionId(someParameters['connectionId']);
+				this.user().setLoginInfo(someParameters['loginInfo']);
+				this.user().setShouldDownloadOfflineCopy(someParameters['offlineCopyNeeded']);
+				this.user().setLock(someParameters['lock']);
+			
+				if (this.oneTimePassword() != null) {
+					result.addCallback(MochiKit.Base.method(this.user().oneTimePasswordManager(), 'archiveOneTimePassword', this.oneTimePassword()));
+				}
+				result.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'connection_loggedIn');
+				result.addCallback(MochiKit.Async.succeed, someParameters);
+				
+				result.callback();
+//MochiKit.Logging.logDebug("--- Connection.loginDone - 1 - result: "/* + Clipperz.Base.serializeJSON(result)*/);
+			} else {
+//MochiKit.Logging.logDebug("--- Connection.loginDone - 2 - ERROR");
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+				result = MochiKit.Async.fail(Clipperz.PM.Connection.exception.WrongChecksum);
+			}
+//MochiKit.Logging.logDebug("<<< Connection.loginDone - result: " + Clipperz.Base.serializeJSON(result));
+
+			return result;
+		}, this));
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.3.8 - Connection.login - 8: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.callback(this);
+//MochiKit.Logging.logDebug("<<< Connection.login");
+		
+		return deferredResult;
+	},
+
+	//=========================================================================
+
+	'logout': function() {
+		var deferredResult;
+
+//MochiKit.Logging.logDebug(">>> Connection.logout: " + this);
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.logout - 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Proxy.defaultProxy, 'logout'), {});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.logout - 2: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'resetSrpConnection'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.logout - 3: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< Connection.logout");
+		
+		return deferredResult;
+	},
+	
+	//=========================================================================
+
+	'message': function(aMessageName, someParameters) {
+		var args;
+		var deferredResult;
+		
+//MochiKit.Logging.logDebug(">>> Connection.message: " + this);
+		args = {}
+		args['message'] = aMessageName;
+		args['srpSharedSecret'] = this.srpConnection().K();
+//		args['lock'] = this.user().lock();
+
+		if (someParameters != null) {
+			args['parameters'] = someParameters;
+		} else {
+			args['parameters'] = {};
+		} 
+//MochiKit.Logging.logDebug("--- Connection.message - args: " + Clipperz.Base.serializeJSON(args));
+
+//		deferredResult = new MochiKit.Async.Deferred();		//	### ?????????????
+		
+		return this.sendMessage(args);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'sendMessage': function(someArguments) {
+		var	deferredResult;
+		
+//MochiKit.Logging.logDebug(">>> Connection.sendMessage: " + this);
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.sendMessage - 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Proxy.defaultProxy, 'message'), someArguments);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.sendMessage - 2: " + res); return res;});
+
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			if (typeof(res['lock']) != 'undefined') {
+				this.user().setLock(res['lock']);
+			}
+			return res;
+		}, this));
+
+		deferredResult.addErrback(MochiKit.Base.method(this, 'messageExceptionHandler'), someArguments);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.sendMessage - 3: " + res); return res;});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.sendMessage - 3: " + Clipperz.Base.serializeJSON(res)); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< Connection.sendMessage");
+		
+		return deferredResult
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'messageExceptionHandler': function(anOriginalMessageArguments, anError) {
+		var result;
+
+//MochiKit.Logging.logDebug(">>> Connection.messageExceptionHandler - this: " + this + ", anError: " + anError);
+		if (anError instanceof MochiKit.Async.CancelledError) {
+//MochiKit.Logging.logDebug("--- Connection.messageExceptionHandler - 1");
+			result = anError;
+//MochiKit.Logging.logDebug("--- Connection.messageExceptionHandler - 2");
+		} else {
+//MochiKit.Logging.logDebug("--- Connection.messageExceptionHandler - 3 - anError.name: " + anError.name + ", message: " + anError.message);
+			if ((anError.message == 'Trying to communicate without an active connection')	||
+				(anError.message == 'No tollManager available for current session')		
+			) {
+//MochiKit.Logging.logDebug("--- Connection.messageExceptionHandler - 4");
+				result = this.reestablishConnection(anOriginalMessageArguments);
+//MochiKit.Logging.logDebug("--- Connection.messageExceptionHandler - 5");
+			} else if (anError.message == 'Session with stale data') {
+//MochiKit.Logging.logDebug("--- Connection.messageExceptionHandler - 5.1");
+				Clipperz.NotificationCenter.notify(this, 'EXCEPTION');
+//MochiKit.Logging.logDebug("--- Connection.messageExceptionHandler - 5.2");
+			} else {
+//MochiKit.Logging.logDebug("--- Connection.messageExceptionHandler - 6");
+				result = anError;
+//MochiKit.Logging.logDebug("--- Connection.messageExceptionHandler - 7");
+			}
+//MochiKit.Logging.logDebug("--- Connection.messageExceptionHandler - 8");
+		}
+//MochiKit.Logging.logDebug("<<< Connection.messageExceptionHandler");
+		
+		return result;;
+	},
+	
+	//=========================================================================
+
+	'reestablishConnection': function(anOriginalMessageArguments) {
+		var deferredResult;
+
+//MochiKit.Logging.logDebug("+++ Connection.reestablishConnection: " + Clipperz.Base.serializeJSON(anOriginalMessageArguments));
+
+//MochiKit.Logging.logDebug(">>> Connection.reestablishConnection: " + this);
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.reestablishConnection 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'resetSrpConnection'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.reestablishConnection 2: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'login'), true);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.reestablishConnection 3: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.bind(function(aMessage) {
+			aMessage['srpSharedSecret'] = this.srpConnection().K();
+			return aMessage;
+		}, this), anOriginalMessageArguments);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.reestablishConnection 4: " + Clipperz.Base.serializeJSON(res)); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'sendMessage'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.reestablishConnection 5: " + res); return res;});
+		deferredResult.addErrback(Clipperz.NotificationCenter.deferredNotification, this, 'EXCEPTION', null);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Connection.reestablishConnection 6: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< Connection.reestablishConnection");
+
+		return deferredResult;
+	},
+
+	//=========================================================================
+
+	'sharedSecret': function() {
+		return this.srpConnection().K();
+	},
+
+	//=========================================================================
+
+	'serverSideUserCredentials': function() {
+		var	result;
+		var	newSrpConnection;
+
+//MochiKit.Logging.logDebug(">>> Connection.serverSideUserCredentials");
+		newSrpConnection = new Clipperz.Crypto.SRP.Connection({ C:this.C(), P:this.P(), hash:this.hash() });
+		result = newSrpConnection.serverSideCredentials();
+		result['version'] = this.clipperz_pm_crypto_version();
+
+//MochiKit.Logging.logDebug("<<< Connection.serverSideUserCredentials - result: " + Clipperz.Base.serializeJSON(result));
+		return result;
+	},
+
+	//=========================================================================
+
+	'C': function() {
+		if (this._C == null) {
+			this._C = this.hash()(new Clipperz.ByteArray(this.user().username())).toHexString().substring(2);
+		}
+		
+		return this._C;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'P': function() {
+		if (this._P == null) {
+			this._P = this.hash()(new Clipperz.ByteArray(this.user().passphrase() + this.user().username())).toHexString().substring(2);
+		}
+		
+		return this._P;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'hash': function() {
+		return Clipperz.PM.Crypto.encryptingFunctions.versions['0.1'].hash;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'srpConnection': function() {
+		if (this._srpConnection == null) {
+			this._srpConnection = new Clipperz.Crypto.SRP.Connection({ C:this.C(), P:this.P(), hash:this.hash() });
+		}
+		
+		return this._srpConnection;
+	},
+	
+	'resetSrpConnection': function() {
+		this._C = null;
+		this._P = null;
+		this._srpConnection = null;
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
+
+
+//-----------------------------------------------------------------------------
+//
+//		S R P [ 1 . 1 ]    C O N N E C T I O N   class
+//
+//-----------------------------------------------------------------------------
+
+Clipperz.PM.Connection.SRP['1.1'] = function (args) {
+	args = args || {};
+	Clipperz.PM.Connection.SRP['1.0'].call(this, args);
+	
+	return this;
+}
+
+Clipperz.PM.Connection.SRP['1.1'].prototype = MochiKit.Base.update(new Clipperz.PM.Connection.SRP['1.0'](), {
+
+	'version': function() {
+		return '1.1';
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'C': function() {
+		if (this._C == null) {
+			this._C = this.hash()(new Clipperz.ByteArray(this.user().username() + this.user().passphrase())).toHexString().substring(2);
+		}
+		
+		return this._C;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'P': function() {
+		if (this._P == null) {
+			this._P = this.hash()(new Clipperz.ByteArray(this.user().passphrase() + this.user().username())).toHexString().substring(2);
+		}
+		
+		return this._P;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'hash': function() {
+		return Clipperz.PM.Crypto.encryptingFunctions.versions['0.2'].hash;
+	},
+
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
+Clipperz.PM.Connection.exception = {
+	WrongChecksum: new MochiKit.Base.NamedError("Clipperz.ByteArray.exception.InvalidValue")
+};
diff --git a/frontend/beta/js/Clipperz/PM/Crypto.js b/frontend/beta/js/Clipperz/PM/Crypto.js
new file mode 100644
index 0000000..7636822
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Crypto.js
@@ -0,0 +1,503 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Crypto) == 'undefined') { Clipperz.PM.Crypto = {}; }
+
+Clipperz.PM.Crypto.VERSION = "0.2";
+Clipperz.PM.Crypto.NAME = "Clipperz.PM.Crypto";
+
+MochiKit.Base.update(Clipperz.PM.Crypto, {
+
+	'__repr__': function () {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'communicationProtocol': {
+		'currentVersion': '0.2',
+		'versions': {
+			'0.1': Clipperz.PM.Connection.SRP['1.0'],	//Clipperz.Crypto.SRP.versions['1.0'].Connection,
+			'0.2': Clipperz.PM.Connection.SRP['1.1']	//Clipperz.Crypto.SRP.versions['1.1'].Connection,
+		},
+		'fallbackVersions': {
+			'current':	'0.1',
+			'0.2':		'0.1',
+			'0.1':		null
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'encryptingFunctions': {
+		'currentVersion': '0.3',
+		'versions': {
+
+		//#####################################################################
+
+			'0.1': {
+				'encrypt': function(aKey, aValue) {
+					return Clipperz.Crypto.Base.encryptUsingSecretKey(aKey, Clipperz.Base.serializeJSON(aValue));
+				},
+			
+				'deferredEncrypt': function(aKey, aValue) {
+					var deferredResult;
+					
+					deferredResult = new MochiKit.Async.Deferred();
+					deferredResult.addCallback(Clipperz.PM.Crypto.encryptingFunctions.versions['0.1'].encrypt, aKey, aValue);
+					deferredResult.callback();
+					
+					return deferredResult;
+				},
+				
+				'decrypt': function(aKey, aValue) {
+					var result;
+				
+					if (aValue != null) {
+						result = Clipperz.Base.evalJSON(Clipperz.Crypto.Base.decryptUsingSecretKey(aKey, aValue));
+					} else {
+						result = null;
+					}
+				
+					return result;
+				},
+				
+				'deferredDecrypt': function(aKey, aValue) {
+					var deferredResult;
+					
+					deferredResult = new MochiKit.Async.Deferred();
+					deferredResult.addCallback(Clipperz.PM.Crypto.encryptingFunctions.versions['0.1'].decrypt, aKey, aValue);
+					deferredResult.callback();
+					
+					return deferredResult;
+				},
+			
+				'hash': function(aValue) {
+					var result;
+					var strngResult;
+				
+					stringResult = Clipperz.Crypto.Base.computeHashValue(aValue.asString());	//	!!!!!!!
+					result = new Clipperz.ByteArray("0x" + stringResult);
+				
+					return result;
+				}
+			},
+
+		//#####################################################################
+
+			'0.2': {
+				'encrypt': function(aKey, aValue, aNonce) {
+					var result;
+					var	key, value;
+					var dataToEncrypt;
+					var encryptedData;
+				
+					key = Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aKey));
+					value = new Clipperz.ByteArray(Clipperz.Base.serializeJSON(aValue));
+					dataToEncrypt = Clipperz.Crypto.SHA.sha_d256(value).appendBlock(value);
+					encryptedData = Clipperz.Crypto.AES.encrypt(key, dataToEncrypt, aNonce);
+					result = encryptedData.toBase64String();
+				
+					return result;
+				},
+
+				'deferredEncrypt': function(aKey, aValue, aNonce) {
+					var deferredResult;
+					var	key, value;
+					var dataToEncrypt;
+					var encryptedData;
+				
+					key = Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aKey));
+					value = new Clipperz.ByteArray(Clipperz.Base.serializeJSON(aValue));
+					dataToEncrypt = Clipperz.Crypto.SHA.sha_d256(value).appendBlock(value);
+					
+					deferredResult = new MochiKit.Async.Deferred()
+					deferredResult.addCallback(Clipperz.Crypto.AES.deferredEncrypt, key, dataToEncrypt, aNonce);
+					deferredResult.addCallback(function(aResult) {
+						return aResult.toBase64String();
+					})
+					deferredResult.callback();
+					
+					return deferredResult;
+				},
+			
+				'decrypt': function(aKey, aValue) {
+					var result;
+					
+					if (aValue != null) {
+						var key, value;
+						var decryptedData;
+						var decryptedData;
+
+						key = Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aKey));
+						value = new Clipperz.ByteArray().appendBase64String(aValue);
+				
+						decryptedData = Clipperz.Crypto.AES.decrypt(key, value);
+						decryptedData = decryptedData.split((256/8));
+
+						try {
+							result = Clipperz.Base.evalJSON(decryptedData.asString());
+						} catch (exception) {
+							MochiKit.Logging.logError("Error while decrypting data");
+							throw Clipperz.Crypto.Base.exception.CorruptedMessage;
+						}
+					} else {
+						result = null;
+					}
+					
+					return result;
+				},
+
+				'deferredDecrypt': function(aKey, aValue) {
+					var result;
+
+					if (aValue != null) {
+						var deferredResult;
+						var key, value;
+						var decryptedData;
+
+						result = new MochiKit.Async.Deferred();
+
+						key = Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aKey));
+						value = new Clipperz.ByteArray().appendBase64String(aValue);
+				
+
+						deferredResult = new MochiKit.Async.Deferred()
+						deferredResult.addCallback(Clipperz.Crypto.AES.deferredDecrypt, key, value);
+						deferredResult.addCallback(function(aResult) {
+							var result;
+							var decryptedData;
+
+							decryptedData = aResult.split((256/8));
+							
+							try {
+								result = Clipperz.Base.evalJSON(decryptedData.asString());
+							} catch (exception) {
+								MochiKit.Logging.logError("Error while decrypting data");
+								throw Clipperz.Crypto.Base.exception.CorruptedMessage;
+							}
+
+							return result;
+						})
+						deferredResult.callback();
+						
+						result = deferredResult;
+					} else {
+						result = MochiKit.Async.succeed(null);
+					}
+					
+					return result;
+				},
+			
+				'hash': Clipperz.Crypto.SHA.sha_d256
+			},
+
+		//#####################################################################
+
+			'0.3': {
+				'encrypt': function(aKey, aValue, aNonce) {
+					var result;
+					var	key, value;
+					var data;
+					var dataToEncrypt;
+					var encryptedData;
+				
+					key = Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aKey));
+					value = Clipperz.Base.serializeJSON(aValue);
+					data = new Clipperz.ByteArray(value);
+					encryptedData = Clipperz.Crypto.AES.encrypt(key, data, aNonce);
+					result = encryptedData.toBase64String();
+				
+					return result;
+				},
+				
+				'deferredEncrypt': function(aKey, aValue, aNonce) {
+					var deferredResult;
+					var	key, value;
+					var data;
+					var dataToEncrypt;
+					var encryptedData;
+				
+					key = Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aKey));
+					value = Clipperz.Base.serializeJSON(aValue);
+					data = new Clipperz.ByteArray(value);
+					
+					deferredResult = new MochiKit.Async.Deferred()
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.PM.Crypto.deferredEncrypt - 1: " + res); return res;});
+					deferredResult.addCallback(Clipperz.Crypto.AES.deferredEncrypt, key, data, aNonce);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.PM.Crypto.deferredEncrypt - 2: " + res); return res;});
+					deferredResult.addCallback(function(aResult) {
+						return aResult.toBase64String();
+					})
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Clipperz.PM.Crypto.deferredEncrypt - 3: " + res); return res;});
+					deferredResult.callback();
+					
+					return deferredResult;
+				},
+			
+				'decrypt': function(aKey, aValue) {
+					var result;
+					
+					if (aValue != null) {
+						var key, value;
+						var decryptedData;
+						var decryptedValue;
+
+						key = Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aKey));
+						value = new Clipperz.ByteArray().appendBase64String(aValue);
+				
+						decryptedData = Clipperz.Crypto.AES.decrypt(key, value);
+
+						value = decryptedData.asString();
+						try {
+							result = Clipperz.Base.evalJSON(value);
+						} catch (exception) {
+							MochiKit.Logging.logError("Error while decrypting data");
+							throw Clipperz.Crypto.Base.exception.CorruptedMessage;
+						}
+					} else {
+						result = null;
+					}
+					
+					return result;
+				},
+			
+				'deferredDecrypt': function(aKey, aValue) {
+					var deferredResult;
+//					var now;
+					
+					deferredResult = new MochiKit.Async.Deferred();
+					now = new Date;
+					
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + (new Date() - now) + "] Clipperz.PM.Crypto.deferredDecrypt - 1: " + res); return res;});
+					if (aValue != null) {
+						var key, value;
+						var decryptedData;
+						var decryptedValue;
+
+						key = Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aKey));
+//MochiKit.Logging.logDebug("[" + (new Date() - now) + "] computed key");
+						value = new Clipperz.ByteArray().appendBase64String(aValue);
+//MochiKit.Logging.logDebug("[" + (new Date() - now) + "] appendedBase64String");
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + (new Date() - now) + "] Clipperz.PM.Crypto.deferredDecrypt - 1.1: " /* + res*/); return res;});
+						deferredResult.addCallback(Clipperz.Crypto.AES.deferredDecrypt, key, value);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + (new Date() - now) + "] Clipperz.PM.Crypto.deferredDecrypt - 2: " /* + res*/); return res;});
+						deferredResult.addCallback(MochiKit.Async.wait, 0.1);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + (new Date() - now) + "] Clipperz.PM.Crypto.deferredDecrypt - 3: " /* + res*/); return res;});
+						deferredResult.addCallback(function(aResult) {
+							return aResult.asString();
+						});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + (new Date() - now) + "] Clipperz.PM.Crypto.deferredDecrypt - 4: " /* + res*/); return res;});
+						deferredResult.addCallback(MochiKit.Async.wait, 0.1);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + (new Date() - now) + "] Clipperz.PM.Crypto.deferredDecrypt - 5: " /* + res*/); return res;});
+						deferredResult.addCallback(Clipperz.Base.evalJSON);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + (new Date() - now) + "] Clipperz.PM.Crypto.deferredDecrypt - 6: " /* + res*/); return res;});
+						deferredResult.addErrback(function(anError) {
+							MochiKit.Logging.logError("Error while decrypting data");
+							throw Clipperz.Crypto.Base.exception.CorruptedMessage;
+						})
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("[" + (new Date() - now) + "] Clipperz.PM.Crypto.deferredDecrypt - 7: " /* + res*/); return res;});
+					} else {
+						deferredResult.addCallback(function() {
+							return null;
+						});
+					}
+					deferredResult.callback();
+					
+					return deferredResult;
+				},
+				
+				'hash': Clipperz.Crypto.SHA.sha_d256
+			},
+
+		//#####################################################################
+/*
+			'0.4': {
+				'encrypt': function(aKey, aValue, aNonce) {
+					var result;
+					var	key, value;
+					var data;
+					var dataToEncrypt;
+					var encryptedData;
+				
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Clipperz.PM.Crypto.versions[0.3].encrypt");
+					key = Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aKey));
+//MochiKit.Logging.logDebug("--- [" + (new Date()).valueOf() + "] Clipperz.PM.Crypto.versions[0.3].encrypt - 1");
+					value = Clipperz.Base.serializeJSON(aValue);
+//MochiKit.Logging.logDebug("--- [" + (new Date()).valueOf() + "] Clipperz.PM.Crypto.versions[0.3].encrypt - 2");
+/ *
+//MochiKit.Logging.logDebug("--> encrypt.fullSize: " + value.length);
+					value = value.replace(/":{"label":"/g,		'":{l:"');
+					value = value.replace(/":{"key":"/g,		'":{k:"');
+					value = value.replace(/":{"notes":"/g,		'":{n:"');
+					value = value.replace(/":{"record":"/g,		'":{r:"');
+					value = value.replace(/", "label":"/g,		'",l:"');
+					value = value.replace(/", "favicon":"/g,	'",f:"');
+//MochiKit.Logging.logDebug("<-- encrypt.compressed: " + value.length);
+* /
+					data = new Clipperz.ByteArray(value);
+//MochiKit.Logging.logDebug("--- [" + (new Date()).valueOf() + "] Clipperz.PM.Crypto.versions[0.3].encrypt - 3");
+					encryptedData = Clipperz.Crypto.AES.encrypt(key, data, aNonce);
+//MochiKit.Logging.logDebug("--- [" + (new Date()).valueOf() + "] Clipperz.PM.Crypto.versions[0.3].encrypt - 4");
+					result = encryptedData.toBase64String();
+//MochiKit.Logging.logDebug("<<< [" + (new Date()).valueOf() + "] Clipperz.PM.Crypto.versions[0.3].encrypt");
+				
+					return result;
+				},
+			
+				'decrypt': function(aKey, aValue) {
+					var result;
+					
+					if (aValue != null) {
+						var key, value;
+						var decryptedData;
+						var decryptedValue;
+
+						key = Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aKey));
+						value = new Clipperz.ByteArray().appendBase64String(aValue);
+				
+						decryptedData = Clipperz.Crypto.AES.decrypt(key, value);
+
+						value = decryptedData.asString();
+/ *
+						value = value.replace(/":{l:"/g,	'":{"label":"');
+						value = value.replace(/":{k:"/g,	'":{"key":"');
+						value = value.replace(/":{n:"/g,	'":{"notes":"');
+						value = value.replace(/":{r:"/g,	'":{"record":"');
+						value = value.replace(/",l:"/g,		'", "label":"');
+						value = value.replace(/",f:"/g,		'", "favicon":"');
+* /
+						try {
+							result = Clipperz.Base.evalJSON(value);
+						} catch (exception) {
+							MochiKit.Logging.logError("Error while decrypting data");
+							throw Clipperz.Crypto.Base.exception.CorruptedMessage;
+						}
+						
+						
+					} else {
+						result = null;
+					}
+					
+					return result;
+				},
+			
+				'hash': Clipperz.Crypto.SHA.sha_d256
+			},
+*/
+		//#####################################################################
+			__syntaxFix__: "syntax fix"
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'encrypt': function(aKey, aValue, aVersion) {
+		return Clipperz.PM.Crypto.encryptingFunctions.versions[aVersion].encrypt(aKey, aValue);
+	},
+
+	'deferredEncrypt': function(aKey, aValue, aVersion) {
+		return Clipperz.PM.Crypto.encryptingFunctions.versions[aVersion].deferredEncrypt(aKey, aValue);
+	},
+
+	'encryptWithCurrentVersion': function(aKey, aValue) {
+		return Clipperz.PM.Crypto.encrypt(aKey, aValue, Clipperz.PM.Crypto.encryptingFunctions.currentVersion);
+	},
+
+	'deferredEncryptWithCurrentVersion': function(aKey, aValue) {
+		return Clipperz.PM.Crypto.deferredEncrypt(aKey, aValue, Clipperz.PM.Crypto.encryptingFunctions.currentVersion);
+	},
+	
+	//.........................................................................
+
+	'decrypt': function(aKey, aValue, aVersion) {
+		return Clipperz.PM.Crypto.encryptingFunctions.versions[aVersion].decrypt(aKey, aValue);
+	},
+
+	'deferredDecrypt': function(aKey, aValue, aVersion) {
+		return Clipperz.PM.Crypto.encryptingFunctions.versions[aVersion].deferredDecrypt(aKey, aValue);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'randomKey': function() {
+		return Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(32).toHexString().substring(2);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'passwordEntropy': function(aValue) {
+		var result;
+		var	bitPerChar;
+		
+		bitPerChar = 4;
+		if (/[a-z]/.test(aValue)) {
+			bitPerChar ++;
+		}
+		if (/[A-Z]/.test(aValue)) {
+			bitPerChar ++;
+		}
+		if (/[^a-zA-Z0-9]/.test(aValue)) {
+			bitPerChar ++;
+		}
+//MochiKit.Logging.logDebug("--- bitPerChar: " + bitPerChar);
+
+		result = aValue.length * bitPerChar;
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'nullValue': "####",
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
+//*****************************************************************************
+
+MochiKit.Base.update(Clipperz.PM.Crypto.communicationProtocol.versions, {
+	'current': Clipperz.PM.Crypto.communicationProtocol.versions[Clipperz.PM.Crypto.communicationProtocol.currentVersion]
+});
+
+MochiKit.Base.update(Clipperz.PM.Crypto.encryptingFunctions.versions, {
+	'current': Clipperz.PM.Crypto.encryptingFunctions.versions[Clipperz.PM.Crypto.encryptingFunctions.currentVersion]
+});
+
+//*****************************************************************************
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/DirectLogin.js b/frontend/beta/js/Clipperz/PM/DataModel/DirectLogin.js
new file mode 100644
index 0000000..3ebc208
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/DirectLogin.js
@@ -0,0 +1,536 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.DirectLogin = function(args) {
+//MochiKit.Logging.logDebug(">>> new Clipperz.PM.DataModel.DirectLogin");
+//console.log(">>> new Clipperz.PM.DataModel.DirectLogin - args: %o", args);
+//console.log("--- formData: %s", Clipperz.Base.serializeJSON(args.formData));
+	args = args || {};
+
+//MochiKit.Logging.logDebug("--- new Clipperz.PM.DataModel.DirectLogin - args: " + Clipperz.Base.serializeJSON(MochiKit.Base.keys(args)));
+	this._record = args.record || null;
+	this._label = args.label || "unnamed record"
+	this._reference = args.reference || Clipperz.PM.Crypto.randomKey();
+	this._favicon = args.favicon || null;
+	this._bookmarkletVersion = args.bookmarkletVersion || "0.1";
+
+	this._directLoginInputs = null;
+	
+	this._formValues = args.formValues || {};
+	this.setFormData(args.formData || null);
+//console.log("=== formData: %o", this.formData());
+
+	if (args.legacyBindingData == null) {
+		this.setBindingData(args.bindingData || null);
+	} else {
+		this.setLegacyBindingData(args.legacyBindingData);
+	}
+
+	this._fixedFavicon = null;
+	
+//	this._formValues = args.formValues || (this.hasValuesToSet() ? {} : null);
+//MochiKit.Logging.logDebug("<<< new Clipperz.PM.DataModel.DirectLogin");
+	
+	return this;
+}
+
+Clipperz.PM.DataModel.DirectLogin.prototype = MochiKit.Base.update(null, {
+
+	'remove': function() {
+		this.record().removeDirectLogin(this);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'record': function() {
+		return this._record;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this.record().user();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'reference': function() {
+		return this._reference;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'label': function() {
+		return this._label;
+	},
+
+	'setLabel': function(aValue) {
+		this._label = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'favicon': function() {
+		if (this._favicon == null) {
+			var	actionUrl;
+			var hostname;
+			
+			actionUrl = this.formData()['attributes']['action'];
+			hostname = actionUrl.replace(/^https?:\/\/([^\/]*)\/.*/, '$1');
+			this._favicon = "http://" + hostname + "/favicon.ico";
+		}
+
+		return this._favicon;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'fixedFavicon': function() {
+		var result;
+		
+		if (this._fixedFavicon == null) {
+			result = this.favicon();
+
+			if (Clipperz_IEisBroken) {
+				if (this.user().preferences().disableUnsecureFaviconLoadingForIE()) {
+					if (result.indexOf('https://') != 0) {
+						result = Clipperz.PM.Strings['defaultFaviconUrl_IE'];
+						this.setFixedFavicon(result);
+					}
+				}
+			}
+		} else {
+			result = this._fixedFavicon;
+		}
+		
+		return result;
+	},
+
+	'setFixedFavicon': function(aValue) {
+		this._fixedFavicon = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'bookmarkletVersion': function() {
+		return this._bookmarkletVersion;
+	},
+	
+	'setBookmarkletVersion': function(aValue) {
+		this._bookmarkletVersion = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'formData': function() {
+		return this._formData;
+	},
+
+	'setFormData': function(aValue) {
+		var formData;
+		
+//MochiKit.Logging.logDebug(">>> DirectLogin.setFormData - " + Clipperz.Base.serializeJSON(aValue));
+		switch (this.bookmarkletVersion()) {
+			case "0.2":
+				formData = aValue;
+				break;
+			case "0.1":
+//MochiKit.Logging.logDebug("--- DirectLogin.setFormData - fixing form data from bookmarklet version 0.1");
+				formData = this.fixFormDataFromBookmarkletVersion_0_1(aValue);
+				break;
+		}
+
+		this._formData = aValue;
+		this.setBookmarkletVersion("0.2");
+
+//MochiKit.Logging.logDebug("--- DirectLogin.setFormData - formData: " + Clipperz.Base.serializeJSON(formData));
+		if (formData != null) {
+			var i,c;
+			
+			this._directLoginInputs = [];
+			c = formData['inputs'].length;
+			for (i=0; i<c; i++) {
+				var directLoginInput;
+				
+				directLoginInput = new Clipperz.PM.DataModel.DirectLoginInput(this, formData['inputs'][i]);
+				this._directLoginInputs.push(directLoginInput);
+			}
+		}
+//MochiKit.Logging.logDebug("<<< DirectLogin.setFormData");
+	},
+
+	'fixFormDataFromBookmarkletVersion_0_1': function(aValue) {
+//{"type":"radio", "name":"action", "value":"new-user", "checked":false }, { "type":"radio", "name":"action", "value":"sign-in", "checked":true }
+//			||
+//		   \  /
+//			\/
+//{"name":"dominio", "type":"radio", "options":[{"value":"@alice.it", "checked":true}, {"value":"@tin.it", "checked":false}, {"value":"@virgilio.it", "checked":false}, {"value":"@tim.it", "checked":false}]}
+		var result;
+		var inputs;
+		var updatedInputs;
+		var radios;
+
+//MochiKit.Logging.logDebug(">>> DirectLogin.fixFormDataFromBookmarkletVersion_0_1");
+		result = aValue;
+		inputs = aValue['inputs'];
+		
+		updatedInputs = MochiKit.Base.filter(function(anInput) {
+			var	result;
+			var type;
+
+			type = anInput['type'] || 'text';
+			result =  type.toLowerCase() != 'radio';
+			
+			return result;
+		}, inputs);
+		radios = MochiKit.Base.filter(function(anInput) {
+			var	result;
+			var type;
+
+			type = anInput['type'] || 'text';
+			result =  type.toLowerCase() == 'radio';
+			
+			return result;
+		}, inputs);
+		
+		if (radios.length > 0) {
+			var updatedRadios;
+			
+			updatedRadios = {};
+			MochiKit.Iter.forEach(radios, MochiKit.Base.bind(function(aRadio) {
+				var	radioConfiguration;
+				
+				radioConfiguration = updatedRadios[aRadio['name']];
+				if (radioConfiguration == null) {
+					radioConfiguration = {type:'radio', name:aRadio['name'], options:[]};
+					updatedRadios[aRadio['name']] = radioConfiguration;
+				}
+				
+//	TODO: remove the value: field and replace it with element.dom.value = <some value>
+				radioConfiguration.options.push({value:aRadio['value'], checked:aRadio['checked']});
+
+				if ((aRadio['checked'] == true) && (this.formValues()[aRadio['name']] == null)) {
+//MochiKit.Logging.logDebug("+++ setting value '" + aRadio['value'] + "' for key: '" + aRadio['name'] + "'");
+					this.formValues()[aRadio['name']] = aRadio['value'];
+				}
+			}, this))
+			
+			updatedInputs = MochiKit.Base.concat(updatedInputs, MochiKit.Base.values(updatedRadios));
+		}
+		
+		delete result.inputs;
+		result.inputs = updatedInputs;
+//MochiKit.Logging.logDebug("<<< DirectLogin.fixFormDataFromBookmarkletVersion_0_1");
+
+		return result;
+	},
+	
+	//.........................................................................
+
+	'directLoginInputs': function() {
+		return this._directLoginInputs;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'formValues': function() {
+		return this._formValues;
+	},
+	
+	'hasValuesToSet': function() {
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> DirectLogin.hasValuesToSet");
+		if (this.directLoginInputs() != null) {
+			result = MochiKit.Iter.some(this.directLoginInputs(), MochiKit.Base.methodcaller('shouldSetValue'));
+		} else {
+			result = false;
+		}
+//MochiKit.Logging.logDebug("<<< DirectLogin.hasValuesToSet");
+		
+		return result;
+	},
+	
+//	'additionalValues': function() {
+	'inputsRequiringAdditionalValues': function() {
+		var	result;
+		var inputs;
+		
+//MochiKit.Logging.logDebug(">>> DirectLogin.additionalValues");
+		result = {};
+		if (this.directLoginInputs() != null) {
+			inputs = MochiKit.Base.filter(MochiKit.Base.methodcaller('shouldSetValue'), this.directLoginInputs());
+			MochiKit.Iter.forEach(inputs, function(anInput) {
+				result[anInput.name()] = anInput;
+			})
+		}
+//MochiKit.Logging.logDebug("<<< DirectLogin.additionalValues");
+
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'bindingData': function() {
+		return this._bindingData;
+	},
+
+	'setBindingData': function(aValue) {
+//MochiKit.Logging.logDebug(">>> DirectLogin.setBindingData");
+		if (aValue != null) {
+			var bindingKey;
+
+			this._bindingData = aValue;
+			this._bindings = {};
+		
+			for (bindingKey in aValue) {
+				var directLoginBinding;
+			
+				directLoginBinding = new Clipperz.PM.DataModel.DirectLoginBinding(this, bindingKey, {fieldKey:aValue[bindingKey]});
+				this._bindings[bindingKey] = directLoginBinding;
+			}
+		} else {
+			var editableFields;
+			var bindings;
+			
+			bindings = {};
+			
+			editableFields = MochiKit.Base.filter(function(aField) {
+				var result;
+				var type;
+		
+				type = aField['type'].toLowerCase();
+				result = ((type != 'hidden') && (type != 'submit') && (type != 'checkbox') && (type != 'radio') && (type != 'select'));
+		
+				return result;
+			}, this.formData().inputs);
+			
+			MochiKit.Iter.forEach(editableFields, function(anEditableField) {
+				bindings[anEditableField['name']] = new Clipperz.PM.DataModel.DirectLoginBinding(this, anEditableField['name']);
+			}, this);
+			
+			this._bindings = bindings;
+		}
+//MochiKit.Logging.logDebug("<<< DirectLogin.setBindingData");
+	},
+	
+	'setLegacyBindingData': function(aValue) {
+//MochiKit.Logging.logDebug(">>> DirectLogin.setLegacyBindingData");
+		var bindingKey;
+	
+		this._bindingData = aValue;
+		this._bindings = {};
+	
+		for (bindingKey in aValue) {
+			var directLoginBinding;
+		
+			directLoginBinding = new Clipperz.PM.DataModel.DirectLoginBinding(this, bindingKey, {fieldName:aValue[bindingKey]});
+			this._bindings[bindingKey] = directLoginBinding;
+		}
+//MochiKit.Logging.logDebug("<<< DirectLogin.setLegacyBindingData");
+	},
+	
+	//.........................................................................
+	
+	'bindings': function() {
+		return this._bindings;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'serializedData': function() {
+		var result;
+		var	bindingKey;
+		
+		result = {};
+//		result.reference = this.reference();
+		result.label = this.label();
+		result.favicon = this.favicon() || "";
+		result.bookmarkletVersion = this.bookmarkletVersion();
+		result.formData = this.formData();
+		if (this.hasValuesToSet) {
+			result.formValues = this.formValues();
+		}
+		result.bindingData = {};
+
+		for (bindingKey in this.bindings()) {
+			result.bindingData[bindingKey] = this.bindings()[bindingKey].serializedData();
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handleMissingFaviconImage': function(anEvent) {
+		anEvent.stop();
+		MochiKit.Signal.disconnectAll(anEvent.src());
+		this.setFixedFavicon(Clipperz.PM.Strings['defaultFaviconUrl']);
+		anEvent.src().src = this.fixedFavicon();
+	},
+	
+	//=========================================================================
+	
+	'runHttpAuthDirectLogin': function(aWindow) {
+		MochiKit.DOM.withWindow(aWindow, MochiKit.Base.bind(function() {
+			var completeUrl;
+			var url;
+			
+			url = this.bindings()['url'].field().value();
+
+			if (/^https?\:\/\//.test(url) == false) {
+				url = 'http://' + url;
+			}
+			
+			if (Clipperz_IEisBroken === true) {
+				completeUrl = url;
+			} else {
+				var username;
+				var password;
+
+				username = this.bindings()['username'].field().value();
+				password = this.bindings()['password'].field().value();
+
+				/(^https?\:\/\/)?(.*)/.test(url);
+
+				completeUrl = RegExp.$1 + username + ':' + password + '@' + RegExp.$2;
+			}
+			
+			MochiKit.DOM.currentWindow().location.href = completeUrl;
+		}, this));
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'runSubmitFormDirectLogin': function(aWindow) {
+		MochiKit.DOM.withWindow(aWindow, MochiKit.Base.bind(function() {
+			var formElement;
+			var	formSubmitFunction;
+			var submitButtons;
+			
+//MochiKit.Logging.logDebug("### runDirectLogin - 3");
+//			MochiKit.DOM.currentDocument().write('<html><head><title>' + this.label() + '</title><META http-equiv="Content-Type" content="text/html; charset=utf-8" /></head><body></body></html>')
+//MochiKit.Logging.logDebug("### runDirectLogin - 3.1");
+			MochiKit.DOM.appendChildNodes(MochiKit.DOM.currentDocument().body, MochiKit.DOM.H3(null, "Loading " + this.label() + " ..."));
+//MochiKit.Logging.logDebug("### runDirectLogin - 4");
+//console.log(this.formData()['attributes']);
+			formElement = MochiKit.DOM.FORM(MochiKit.Base.update({id:'directLoginForm'}, {	'method':this.formData()['attributes']['method'],
+																							'action':this.formData()['attributes']['action']}));
+//MochiKit.Logging.logDebug("### runDirectLogin - 5");
+			formSubmitFunction = MochiKit.Base.method(formElement, 'submit');
+//MochiKit.Logging.logDebug("### runDirectLogin - 6");
+
+			MochiKit.DOM.appendChildNodes(MochiKit.DOM.currentDocument().body,
+				MochiKit.DOM.DIV({style:'display:none; visibility:hidden;'}, formElement)
+			);
+//MochiKit.Logging.logDebug("### runDirectLogin - 7");
+			MochiKit.DOM.appendChildNodes(formElement, MochiKit.Base.map(	MochiKit.Base.methodcaller("formConfiguration"),
+																			this.directLoginInputs()));
+//MochiKit.Logging.logDebug("### runDirectLogin - 8");
+
+			submitButtons = MochiKit.Base.filter(function(anInputElement) {
+//MochiKit.Logging.logDebug("### runDirectLogin - 8.1 - " + anInputElement);
+//MochiKit.Logging.logDebug("### runDirectLogin - 8.2 - " + anInputElement.tagName);
+//MochiKit.Logging.logDebug("### runDirectLogin - 8.3 - " + anInputElement.getAttribute('type'));
+				return ((anInputElement.tagName.toLowerCase() == 'input') && (anInputElement.getAttribute('type').toLowerCase() == 'submit'));
+			}, formElement.elements)
+//MochiKit.Logging.logDebug("### runDirectLogin - 9");
+
+			if (submitButtons.length == 0) {
+//MochiKit.Logging.logDebug("### OLD submit")
+				if (Clipperz_IEisBroken == true) {
+//MochiKit.Logging.logDebug("### runDirectLogin - 10");
+					formElement.submit();
+				} else {
+//MochiKit.Logging.logDebug("### runDirectLogin - 11");
+					formSubmitFunction();
+				}
+			} else {
+//MochiKit.Logging.logDebug("### NEW submit")
+				submitButtons[0].click();
+			}
+
+		}, this));
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'runDirectLogin': function(aNewWindow) {
+		var	newWindow;
+
+//console.log("formData.attributes", this.formData()['attributes']);
+//		if (/^javascript/.test(this.formData()['attributes']['action'])) {
+		if ((/^(https?|webdav|ftp)\:/.test(this.formData()['attributes']['action']) == false) &&
+			(this.formData()['attributes']['type'] != 'http_auth'))
+		{
+			var messageBoxConfiguration;
+
+			if (typeof(aNewWindow) != 'undefined') {
+				aNewWindow.close();
+			}
+
+			messageBoxConfiguration = {};
+			messageBoxConfiguration.title = Clipperz.PM.Strings['VulnerabilityWarning_Panel_title'];
+			messageBoxConfiguration.msg = Clipperz.PM.Strings['VulnerabilityWarning_Panel_message'];
+			messageBoxConfiguration.animEl = YAHOO.ext.Element.get("mainDiv");
+			messageBoxConfiguration.progress = false;
+			messageBoxConfiguration.closable = false;
+			messageBoxConfiguration.buttons = {'cancel': Clipperz.PM.Strings['VulnerabilityWarning_Panel_buttonLabel']};
+
+			Clipperz.YUI.MessageBox.show(messageBoxConfiguration);
+
+			throw Clipperz.Base.exception.VulnerabilityIssue;
+		}
+
+//MochiKit.Logging.logDebug("### runDirectLogin - 1 : " + Clipperz.Base.serializeJSON(this.serializedData()));
+		if (typeof(aNewWindow) == 'undefined') {
+			newWindow = window.open(Clipperz.PM.Strings['directLoginJumpPageUrl'], "");
+		} else {
+			newWindow = aNewWindow;
+		}
+//MochiKit.Logging.logDebug("### runDirectLogin - 2");
+
+		if (this.formData()['attributes']['type'] == 'http_auth') {
+			this.runHttpAuthDirectLogin(newWindow);
+		} else {
+			this.runSubmitFormDirectLogin(newWindow)
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/DirectLoginBinding.js b/frontend/beta/js/Clipperz/PM/DataModel/DirectLoginBinding.js
new file mode 100644
index 0000000..19aa9cb
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/DirectLoginBinding.js
@@ -0,0 +1,113 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.DirectLoginBinding = function(aDirectLogin, aKey, args) {
+//MochiKit.Logging.logDebug(">>> new DirectLoginBinding")
+	args = args || {};
+//MochiKit.Logging.logDebug("--- new DirectLoginBinding - args: " + Clipperz.Base.serializeJSON(args));
+
+	this._directLogin = aDirectLogin || args.directLogin || null;
+	this._key = aKey;
+
+	this._fieldKey = args.fieldKey || null;
+	this._fieldName = args.fieldName || null;
+//MochiKit.Logging.logDebug("<<< new DirectLoginBinding")
+	
+	return this;
+}
+
+Clipperz.PM.DataModel.DirectLoginBinding.prototype = MochiKit.Base.update(null, {
+
+	'directLogin': function() {
+		return this._directLogin;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'key': function() {
+		return this._key;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'fieldKey': function() {
+//MochiKit.Logging.logDebug("=== Clipperz.PM.DataModel.DirectLoginBinding.fieldKey");
+//MochiKit.Logging.logDebug("=== Clipperz.PM.DataModel.DirectLoginBinding.fieldKey - " + this._fieldKey);
+		return this._fieldKey;
+	},
+	
+	'setFieldKey': function(aValue) {
+		this._fieldKey = aValue;
+	},
+	
+	'fieldName': function() {
+		return this._fieldName;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'field': function() {
+		var result;
+
+//MochiKit.Logging.logDebug(">>> Clipperz.PM.DataModel.DirectLoginBinding.field")		
+//MochiKit.Logging.logDebug("--- Clipperz.PM.DataModel.DirectLoginBinding.field - 1 - this.fieldKey(): " + this.fieldKey());
+//MochiKit.Logging.logDebug("--- Clipperz.PM.DataModel.DirectLoginBinding.field - 2 - this.fieldName(): " + this.fieldName());
+		if (this.fieldKey() != null) {
+			result = this.directLogin().record().currentVersion().fields()[this.fieldKey()];
+//MochiKit.Logging.logDebug("--- Clipperz.PM.DataModel.DirectLoginBinding.field - 3 - result: " + result);
+		} else if (this.fieldName() != null) {
+			result = this.directLogin().record().currentVersion().fieldWithName(this.fieldName());
+//MochiKit.Logging.logDebug("--- Clipperz.PM.DataModel.DirectLoginBinding.field - 4 - result: " + result);
+			
+			this.setFieldKey(result.key());
+		} else {
+			result = null;
+		}
+//MochiKit.Logging.logDebug("<<< Clipperz.PM.DataModel.DirectLoginBinding.field")		
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'serializedData': function() {
+		return this.fieldKey();
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/DirectLoginInput.js b/frontend/beta/js/Clipperz/PM/DataModel/DirectLoginInput.js
new file mode 100644
index 0000000..3302ed6
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/DirectLoginInput.js
@@ -0,0 +1,229 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+//#############################################################################
+
+Clipperz.PM.DataModel.DirectLoginInput = function(aDirectLogin, args) {
+	args = args || {};
+
+//console.log(">>> new DirectLoginInput - args: %o" + args);
+	this._directLogin = aDirectLogin;
+	this._args = args;
+	
+	return this;
+}
+
+Clipperz.PM.DataModel.DirectLoginInput.prototype = MochiKit.Base.update(null, {
+
+	'directLogin': function() {
+		return this._directLogin;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'args': function() {
+		return this._args;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'name': function() {
+		return this.args()['name'];
+	},
+
+	//-------------------------------------------------------------------------
+
+	'type': function() {
+		var result;
+		
+		result = this.args()['type'];
+		
+		if (result != null) {
+			result = result.toLowerCase();
+		}
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'value': function() {
+		return this.args()['value'];
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'formConfiguration': function() {
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> DirectLoginInput.formConfiguration - " + this.name());
+		if (this.shouldSetValue()) {
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 1");
+			switch (this.type()) {
+				case 'select':
+					var currentValue;
+					var options;
+					
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 2");
+					currentValue = this.directLogin().formValues()[this.name()];
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 2.1");
+					options = this.args()['options'];
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 2.2");
+					
+					result = MochiKit.DOM.SELECT({name:this.name()},
+						MochiKit.Base.map(function(anOption) {
+							var options;
+							
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 2.3");
+//	TODO: remove the value: field and replace it with element.dom.value = <some value>
+							options = {value:anOption['value']};
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 2.4");
+							if (currentValue == anOption['value']) {
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 2.5");
+								options.selected = true;
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 2.6");
+							}
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 2.7");
+							
+							return MochiKit.DOM.OPTION(options, anOption['label'])
+						}, options)
+					)
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 2.8");
+					break;
+				case 'checkbox':
+					var options;
+					
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 3");
+					options = {type:'checkbox', name: this.name()};
+					if (this.directLogin().formValues()[this.name()] == true) {
+						options['checked'] = true;
+					};
+
+					result = MochiKit.DOM.INPUT(options, null);
+					break;
+				case 'radio':
+					var currentName;
+					var currentValue;
+					var options;
+					
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4");
+					currentName = this.name();
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.1");
+					currentValue = this.directLogin().formValues()[this.name()];
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.2");
+					options = this.args()['options'];
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.3");
+					
+					result = MochiKit.DOM.DIV(null,
+						MochiKit.Base.map(function(anOption) {
+							var options;
+							var isChecked;
+							var inputNode;
+							var divNode;
+							
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.4");
+//	TODO: remove the value: field and replace it with element.dom.value = <some value>
+							options = {type:'radio', name:currentName, value:anOption['value']}
+							isChecked = (currentValue == anOption['value']);
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.5");
+							if (isChecked) {
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.6");
+								options.checked = true;
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.7");
+							}
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.8 - options: " + Clipperz.Base.serializeJSON(options));
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.8 - value: " + anOption['value']);
+
+							if (Clipperz_IEisBroken == true) {
+								var checkedValue;
+								
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.8.1");
+								checkedValue = (isChecked ? " CHECKED" : "");
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.8.2");
+								inputNode = MochiKit.DOM.currentDocument().createElement("<INPUT TYPE='RADIO' NAME='" + currentName + "' VALUE='" + anOption['value'] + "'" + checkedValue + ">");
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.8.3");
+							} else {
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.8.4");
+								inputNode = MochiKit.DOM.INPUT(options, anOption['value']);
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.8.5");
+							}
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.9");
+							divNode = MochiKit.DOM.DIV(null, inputNode);
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.10");
+							
+							return divNode;
+//							return MochiKit.DOM.DIV(null, MochiKit.DOM.INPUT(options, anOption['value']));
+						}, options)
+					);
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 4.9");
+					break;
+			}
+		} else {
+			var binding;
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 5");
+			binding = this.directLogin().bindings()[this.name()];
+
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 6");
+//	TODO: remove the value: field and replace it with element.dom.value = <some value>
+			result = MochiKit.DOM.INPUT({
+				type:((this.type() != 'password') ? this.type() : 'text'),
+//				type:(((this.type() != 'password') && (this.type() != 'submit')) ? this.type() : 'text'),
+				name:this.name(),
+				value:((binding != null)? binding.field().value() : this.value())
+			}, null);
+//MochiKit.Logging.logDebug("--- DirectLoginInput.formConfiguration - 7");
+		}
+
+//MochiKit.Logging.logDebug("<<< DirectLoginInput.formConfiguration: ");
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'shouldSetValue': function() {
+		var type;
+		var result;
+
+//MochiKit.Logging.logDebug(">>> DirectLoginInput.shouldSetValue");
+		type = this.type();
+		result = ((type == 'checkbox') || (type == 'radio') || (type == 'select'));
+//if (result == true) {
+//	MochiKit.Logging.logDebug("DIRECT LOGIN INPUT need value: " + Clipperz.Base.serializeJSON(this.args()));
+//}
+//MochiKit.Logging.logDebug("<<< DirectLoginInput.shouldSetValue");
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/DirectLoginReference.js b/frontend/beta/js/Clipperz/PM/DataModel/DirectLoginReference.js
new file mode 100644
index 0000000..b067a21
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/DirectLoginReference.js
@@ -0,0 +1,192 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.DirectLoginReference = function(args) {
+	args = args || {};
+
+//MochiKit.Logging.logDebug(">>> new DirectLoginReference: " + Clipperz.Base.serializeJSON(MochiKit.Base.keys(args)));
+//MochiKit.Logging.logDebug(">>> new DirectLoginReference - record: " + args.record);
+	this._user = args.user;
+	
+	if (args.directLogin != null) {
+		this._reference = args.directLogin.reference();
+		this._recordReference = args.directLogin.record().reference();
+		this._label = args.directLogin.label();
+		this._favicon = args.directLogin.favicon() || null;
+
+		this._directLogin = args.directLogin;
+		this._record = args.directLogin.record();
+	} else {
+		this._reference = args.reference;
+		this._recordReference = args.record;
+		this._label = args.label;
+		this._favicon = args.favicon || null;
+	
+		this._directLogin = null;
+		this._record = null;
+	}
+
+	this._fixedFavicon = null;
+	
+	return this;
+}
+
+Clipperz.PM.DataModel.DirectLoginReference.prototype = MochiKit.Base.update(null, {
+
+	'user': function() {
+		return this._user;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'reference': function() {
+		return this._reference;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'synchronizeValues': function(aDirectLogin) {
+		this._label = aDirectLogin.label();
+		this._favicon = aDirectLogin.favicon();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'label': function() {
+		return this._label;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'recordReference': function() {
+		return this._recordReference;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'record': function() {
+//MochiKit.Logging.logDebug(">>> DirectLoginReference.record");
+		if (this._record == null) {
+			this._record = this.user().records()[this.recordReference()];
+		}
+		
+//MochiKit.Logging.logDebug("<<< DirectLoginReference.record");
+		return this._record;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'favicon': function() {
+		return this._favicon;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'fixedFavicon': function() {
+		var result;
+		
+		if (this._fixedFavicon == null) {
+			result = this.favicon();
+
+			if (Clipperz_IEisBroken && (this.user().preferences().disableUnsecureFaviconLoadingForIE()) && (result.indexOf('https://') != 0)) {
+				result = Clipperz.PM.Strings['defaultFaviconUrl_IE'];
+				this.setFixedFavicon(result);
+			}
+		} else {
+			result = this._fixedFavicon;
+		}
+		
+		return result;
+	},
+
+	'setFixedFavicon': function(aValue) {
+		this._fixedFavicon = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'setupJumpPageWindow': function(aWindow) {
+//MochiKit.Logging.logDebug(">>> DirectLoginReference.setupJumpPageWindow - " + aWindow);
+		try {
+			MochiKit.DOM.withWindow(aWindow, MochiKit.Base.bind(function() {
+				MochiKit.DOM.appendChildNodes(MochiKit.DOM.currentDocument().body,
+					MochiKit.DOM.H1(null, "Loading " + this.label())
+				);
+			}, this));
+		} catch(e) {
+			MochiKit.Logging.logDebug("EXCEPTION: " + e);
+		}
+//MochiKit.Logging.logDebug("<<< DirectLoginReference.setupJumpPageWindow");
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'deferredDirectLogin': function() {
+		var deferredResult;
+
+//MochiKit.Logging.logDebug(">>> DirectLoginReference.deferredDirectLogin - " + this);
+		deferredResult = new MochiKit.Async.Deferred();
+//MochiKit.Logging.logDebug("--- DirectLoginReference.deferredDirectLogin - 1");
+		deferredResult.addCallback(MochiKit.Base.method(this.record(), 'deferredData'));
+//MochiKit.Logging.logDebug("--- DirectLoginReference.deferredDirectLogin - 2");
+		deferredResult.addCallback(function(aRecord, aDirectLoginReference) {
+			return aRecord.directLogins()[aDirectLoginReference];
+		}, this.record(), this.reference());
+//MochiKit.Logging.logDebug("--- DirectLoginReference.deferredDirectLogin - 3");
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< DirectLoginReference.deferredDirectLogin");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handleMissingFaviconImage': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> DirectLoginReference.handleMissingFaviconImage");
+		anEvent.stop();
+		MochiKit.Signal.disconnectAll(anEvent.src());
+		this.setFixedFavicon(Clipperz.PM.Strings['defaultFaviconUrl']);
+//MochiKit.Logging.logDebug("--- DirectLoginReference.handleMissingFaviconImage - fixedFavicon: " + this.fixedFavicon());
+//MochiKit.Logging.logDebug("--- DirectLoginReference.handleMissingFaviconImage - anEvent.src().src: " + anEvent.src().src);
+//		MochiKit.DOM.swapDOM(anEvent.src(), MochiKit.DOM.IMG({src:'this.fixedFavicon()'}));
+		anEvent.src().src = this.fixedFavicon();
+//MochiKit.Logging.logDebug("<<< DirectLoginReference.handleMissingFaviconImage");
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/Header.js b/frontend/beta/js/Clipperz/PM/DataModel/Header.js
new file mode 100644
index 0000000..ef34732
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/Header.js
@@ -0,0 +1,751 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.Header = function(args) {
+	args = args || {};
+
+	this._user = args.user;
+
+	this._serverData = null;
+	this._serverDataVersion = null;
+	this._jsonEvaledServerData = null;
+	
+	this._decryptedLegacyServerData = null;
+	this._isDecryptingLegacyServerData = false;
+	this._decryptingLegacyServerDataPendingQueue = [];
+
+	this.resetUpdatedSections();
+	
+	this._shouldLoadSections = {};
+
+	Clipperz.NotificationCenter.register(this.user(), 'updatedSection', this, 'updatedSectionHandler');
+	
+	return this;
+}
+
+Clipperz.PM.DataModel.Header.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+		
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	
+	'updatedSections': function() {
+		return this._updatedSections;
+	},
+
+	'markSectionAsUpdated': function(aSectionName) {
+		this.updatedSections().push(aSectionName);
+	},
+	
+	'resetUpdatedSections': function() {
+		this._updatedSections = []
+	},
+	
+	'hasSectionBeenUpdated': function(aSectionName) {
+		return (this.updatedSections().join().indexOf(aSectionName) != -1);
+	},
+	
+	'cachedServerDataSection': function(aSectionName) {
+		return (this.hasSectionBeenUpdated(aSectionName)) ? {} : this.jsonEvaledServerData()[aSectionName];
+	},
+	
+	'updateAllSections': function() {
+		this.resetUpdatedSections();
+		this.markSectionAsUpdated('records');
+		this.markSectionAsUpdated('directLogins');
+		this.markSectionAsUpdated('preferences');
+		this.markSectionAsUpdated('oneTimePasswords');
+		
+		return MochiKit.Async.succeed(this);
+	},
+	
+	'updatedSectionHandler': function(anEvent) {
+		this.markSectionAsUpdated(anEvent.parameters());
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'getObjectKeyIndex': function(anObject) {
+		var result;
+		var	itemReference;
+		var index;
+		
+		result = {};
+		index = 0;
+
+		for (itemReference in anObject) {
+			result[itemReference] = index.toString();
+			index ++;
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'serializedDataWithRecordAndDirectLoginIndexes': function(aRecordIndexes, aDirectLoginIndexs) {
+		var result;
+		var records;
+		var recordReference;
+
+//MochiKit.Logging.logDebug(">>> Header.serializedData");
+		result = {
+			'records': {},
+			'directLogins': {}
+		};
+
+		records = this.user().records();
+		for (recordReference in records) {
+			result['records'][aRecordIndexes[recordReference]] = this.user().records()[recordReference].headerData();
+		}
+		
+		for (directLoginReference in this.user().directLoginReferences()) {
+			var currentDirectLogin;
+			var	directLoginData;
+			
+			currentDirectLogin = this.user().directLoginReferences()[directLoginReference];
+			if (aRecordIndexes[currentDirectLogin.recordReference()] != null) {
+				directLoginData = {
+//					reference:  currentDirectLogin.reference(),
+					record:		aRecordIndexes[currentDirectLogin.recordReference()].toString(),
+					label:		currentDirectLogin.label(),
+					favicon:	currentDirectLogin.favicon() || ""
+				}
+
+				result['directLogins'][aDirectLoginIndexs[directLoginReference]] = directLoginData;
+			}
+			
+		}
+//MochiKit.Logging.logDebug("<<< Header.serializedData - result: " + Clipperz.Base.serializeJSON(result));
+//MochiKit.Logging.logDebug("<<< Header.serializedData");
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'encryptedData': function() {
+		var deferredResult;
+		var recordIndex;
+		var directLoginIndex;
+		var	serializedData;
+		var result;
+
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Header.encryptedData");
+//MochiKit.Logging.logDebug("### Header.encryptedData - " + Clipperz.Base.serializeJSON(this.updatedSections()));
+		result = {
+			'records': this.cachedServerDataSection('records'),
+			'directLogins': this.cachedServerDataSection('directLogins'),
+			'preferences': this.cachedServerDataSection('preferences'),
+			'oneTimePasswords': this.cachedServerDataSection('oneTimePasswords'),
+			'version': '0.1'
+		};
+
+		if (this.hasSectionBeenUpdated('records')) {
+			recordIndex = this.getObjectKeyIndex(this.user().records());
+			result['records']['index'] = recordIndex;
+		} else {
+			recordIndex = result['records']['index'];
+		}
+		
+		if (this.hasSectionBeenUpdated('directLogins')) {
+			directLoginIndex = this.getObjectKeyIndex(this.user().directLoginReferences());
+			result['directLogins']['index'] = directLoginIndex;
+		} else {
+			directLoginIndex = result['directLogins']['index'];
+		}
+		
+		if (this.hasSectionBeenUpdated('records') || this.hasSectionBeenUpdated('directLogins')) {
+			serializedData = this.serializedDataWithRecordAndDirectLoginIndexes(recordIndex, directLoginIndex);
+		}
+		
+		deferredResult = new MochiKit.Async.Deferred();
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 1: " + res); return res;});
+		if (this.hasSectionBeenUpdated('records')) {
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 1.1: " + res); return res;});
+			deferredResult.addCallback(function(anHeader, aResult, aSerializedData, aValue) {
+				return Clipperz.PM.Crypto.deferredEncryptWithCurrentVersion(anHeader.user().passphrase(), aSerializedData['records']);
+			}, this, result, serializedData);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 1.2: " + res); return res;});
+			deferredResult.addCallback(function(anHeader, aResult, aValue) {
+				aResult['records']['data'] = aValue;
+			}, this, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 1.3: " + res); return res;});
+		}
+		
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 2: " + res); return res;});
+		if (this.hasSectionBeenUpdated('directLogins')) {
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 2.1: " + res); return res;});
+			deferredResult.addCallback(function(anHeader, aResult, aSerializedData, aValue) {
+				return Clipperz.PM.Crypto.deferredEncryptWithCurrentVersion(anHeader.user().passphrase(), aSerializedData['directLogins']);
+			}, this, result, serializedData);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 2.2: " + res); return res;});
+			deferredResult.addCallback(function(anHeader, aResult, aValue) {
+				aResult['directLogins']['data'] = aValue;
+			}, this, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 2.3: " + res); return res;});
+		}
+		
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 3: " + res); return res;});
+		if (this.hasSectionBeenUpdated('preferences')) {
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 3.1: " + res); return res;});
+			deferredResult.addCallback(function(anHeader, aResult, aValue) {
+				return Clipperz.PM.Crypto.deferredEncryptWithCurrentVersion(anHeader.user().passphrase(), anHeader.user().preferences().serializedData());
+			}, this, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 3.2: " + res); return res;});
+			deferredResult.addCallback(function(anHeader, aResult, aValue) {
+				aResult['preferences']['data'] = aValue;
+			}, this, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 3.3: " + res); return res;});
+		}
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 4: " + res); return res;});
+		if (this.hasSectionBeenUpdated('oneTimePasswords')) {
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 4.1: " + res); return res;});
+//			deferredResult.addCallback(MochiKit.Base.method(this, 'loadOneTimePasswords'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 4.2: " + res); return res;});
+			deferredResult.addCallback(function(anHeader, aResult, aValue) {
+				return Clipperz.PM.Crypto.deferredEncryptWithCurrentVersion(anHeader.user().passphrase(), anHeader.user().oneTimePasswordManager().serializedData());
+			}, this, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 4.3: " + res); return res;});
+			deferredResult.addCallback(function(anHeader, aResult, aValue) {
+				aResult['oneTimePasswords']['data'] = aValue;
+			}, this, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 4.4: " + res); return res;});
+		}
+		
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 5: " + res); return res;});
+		deferredResult.addCallback(function(anHeader, aResult, aValue) {
+			var serverData;
+			
+			serverData = Clipperz.Base.serializeJSON(aResult);
+			anHeader.setServerData(serverData);
+			
+			return serverData;
+		}, this, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.encryptedData - 6: " + res); return res;});
+
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< [" + (new Date()).valueOf() + "] Header.encryptedData");
+
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'serverData': function() {
+		return this._serverData;
+	},
+	
+	'setServerData': function(aValue) {
+//MochiKit.Logging.logDebug(">>> Header.setServerData");
+//MochiKit.Logging.logDebug("[start]=============================================");
+//MochiKit.Logging.logDebug("SERVER_DATA: " + aValue);
+//MochiKit.Logging.logDebug("[end]===============================================");
+		this._serverData = aValue;
+//MochiKit.Logging.logDebug("--- Header.setServerData - 1");
+		this.resetUpdatedSections();
+//MochiKit.Logging.logDebug("--- Header.setServerData - 2");
+		this.resetJsonEvaledServerData();
+//MochiKit.Logging.logDebug("<<< Header.setServerData");
+	},
+
+	'jsonEvaledServerData': function() {
+		if (this._jsonEvaledServerData == null) {
+			this._jsonEvaledServerData = Clipperz.Base.evalJSON(this.serverData());
+		}
+		
+		return this._jsonEvaledServerData;
+	},
+	
+	'resetJsonEvaledServerData': function() {
+		this._jsonEvaledServerData = null;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'serverDataVersion': function() {
+		return this._serverDataVersion;
+	},
+	
+	'setServerDataVersion': function(aValue) {
+		this._serverDataVersion = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'decryptedLegacyServerData': function() {
+		var deferredResult;
+
+//MochiKit.Logging.logDebug(">>> Header.decryptedLegacyServerData");
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.decryptedLegacyServerData 1: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'updateAllSections'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.decryptedLegacyServerData 2: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		if (this._decryptedLegacyServerData == null) {
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.decryptedLegacyServerData 3: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'connection_decryptingUserData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.decryptedLegacyServerData 4: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(Clipperz.PM.Crypto.deferredDecrypt, this.user().passphrase(), this.serverData(), this.serverDataVersion());
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.decryptedLegacyServerData 5: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(function(anHeader, aValue) {
+				anHeader._decryptedLegacyServerData = aValue;
+			}, this);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.decryptedLegacyServerData 6: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		};
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.decryptedLegacyServerData 7: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		
+		deferredResult.addCallback(function(anHeader) {
+			return anHeader._decryptedLegacyServerData;
+		}, this);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.decryptedLegacyServerData 8: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< Header.decryptedLegacyServerData");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'serverDataFormat': function() {
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> Header.serverDataFormat");
+		if (this.serverData().charAt(0) == '{') {
+			var	serverData;
+			
+			serverData = Clipperz.Base.evalJSON(this.serverData());
+			result = serverData['version'];
+		} else {
+			result = 'LEGACY';
+		}
+//MochiKit.Logging.logDebug("<<< Header.serverDataFormat");
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'extractHeaderDataFromUserDetails': function(someUserDetails) {
+		if (this.serverData() == null) {
+			this.setServerData(someUserDetails['header']);
+			this.setServerDataVersion(someUserDetails['version'])
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'extractDataWithKey': function(aKey) {
+		var deferredResult;
+		
+//MochiKit.Logging.logDebug(">>> Header.extractDataWithKey");
+		deferredResult = new MochiKit.Async.Deferred();
+		
+		switch (this.serverDataFormat()) {
+			case 'LEGACY':
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.extractDataWithKey 1: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+				deferredResult.addCallback(MochiKit.Base.method(this, 'decryptedLegacyServerData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.extractDataWithKey 2: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+				deferredResult.addCallback(function(someDecryptedValues) {
+					return someDecryptedValues[aKey] || {};
+				})
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.extractDataWithKey 3: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+				break;
+			case '0.1':
+				var data;
+
+//#				data = Clipperz.Base.evalJSON(this.serverData());
+				data = this.jsonEvaledServerData();
+				if (typeof(data[aKey]) != 'undefined') {
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.extractDataWithKey 4: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+					deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'connection_decryptingUserData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.extractDataWithKey 5: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+					deferredResult.addCallback(Clipperz.PM.Crypto.deferredDecrypt, this.user().passphrase(), data[aKey]['data'], this.serverDataVersion());
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.extractDataWithKey 6: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+					deferredResult.addCallback(function(/*anHeader,*/ aKey, aData, aRecordIndex, aValue) {
+						var result;
+//MochiKit.Logging.logDebug(">>> [start] ===============================================");
+//MochiKit.Logging.logDebug("--- extractDataWithKey - 0 [" + aKey + "]: " + Clipperz.Base.serializeJSON(aValue));
+//MochiKit.Logging.logDebug("<<< [end] =================================================");
+						if (aKey == 'records') {
+							var recordKey;
+				
+							result = {};
+							for (recordKey in aData['index']) {
+								result[recordKey] = aValue[aData['index'][recordKey]];
+							}
+						} else if (aKey == 'directLogins') {
+							var	recordKeyReversedIndex;
+							var recordKey;
+							var directLoginKey;
+				
+							result = {};
+							recordKeyReversedIndex = {};
+	
+							for (recordKey in aRecordIndex) {
+								recordKeyReversedIndex[aRecordIndex[recordKey]] = recordKey;
+							}
+
+//MochiKit.Logging.logDebug("--- extractDataWithKey - 1 - aData['index']: " + Clipperz.Base.serializeJSON(aData['index']));
+							for (directLoginKey in aData['index']) {
+try {
+								if ((aData['index'][directLoginKey] != null) && (aValue[aData['index'][directLoginKey]] != null)) {
+									result[directLoginKey] = aValue[aData['index'][directLoginKey]];
+									result[directLoginKey]['record'] = recordKeyReversedIndex[result[directLoginKey]['record']];
+								}
+} catch(exception) {
+	//	result[directLoginKey] has no properties
+	MochiKit.Logging.logDebug("[Header 391] EXCEPTION: " + exception);
+	throw exception;
+}
+							}
+//MochiKit.Logging.logDebug("--- extractDataWithKey - 2");
+						} else {
+							result = aValue;
+						}
+			
+						return result;
+					}, /*this,*/ aKey, data[aKey], data['records']['index']);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.extractDataWithKey 6: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+				} else {
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.extractDataWithKey 7: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+					deferredResult.addCallback(MochiKit.Async.succeed, {});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.extractDataWithKey 8: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+				}
+ 				break;
+		}
+		
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.extractDataWithKey 9: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< Header.extractDataWithKey");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'processRecordData': function(someRecordData) {
+		var records;
+		var	recordReference;
+
+//console.log("HeaderRecordData parameters", someRecordData);
+//MochiKit.Logging.logDebug(">>> Header.processRecordData");
+		records = someRecordData;
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 1");
+		if (records != null) {
+//MochiKit.Logging.logDebug("--- Header.processRecordData - records: " + Clipperz.Base.serializeJSON(records));
+			for (recordReference in records) {
+				var newRecord;
+				var parameters;
+	
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 2 - recordReference: " + recordReference);
+				if (recordReference != "stacktrace") {
+					parameters = records[recordReference];	//.slice();
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 3");
+					if (typeof(parameters['notes']) != 'undefined') {
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 4");
+						if (parameters['notes'] != "") {
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 5");
+							parameters['headerNotes'] = parameters['notes'];
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 6");
+						}
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 7");
+						delete parameters['notes'];
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 8");
+					}
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 9");
+					parameters['reference'] = recordReference;
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 10");
+					parameters['user'] = this.user();
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 11");
+	
+					newRecord = new Clipperz.PM.DataModel.Record(parameters);
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 12");
+					this.user().addRecord(newRecord, true);
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 13");
+				}
+			}
+
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 14");
+			Clipperz.NotificationCenter.notify(null, 'recordAdded', null, true);
+//MochiKit.Logging.logDebug("--- Header.processRecordData - 15");
+		}
+//MochiKit.Logging.logDebug("<<< Header.processRecordData");
+		
+		return this.user().records();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'processDirectLoginData': function(someDirectLoginData) {
+		var directLogins;
+		var directLoginReference;
+		
+//MochiKit.Logging.logDebug(">>> Header.processDirectLoginData");
+		directLogins = someDirectLoginData;
+		if (directLogins != null) {
+			for (directLoginReference in directLogins) {
+				var directLoginReference;
+				var parameters;
+	
+				parameters = directLogins[directLoginReference];	//.slice();
+				parameters.user = this.user();
+				parameters.reference = directLoginReference;
+				directLoginReference = new Clipperz.PM.DataModel.DirectLoginReference(parameters);
+				if (directLoginReference.record() != null) {
+					this.user().addDirectLoginReference(directLoginReference, true);
+				}
+			}
+		}
+
+		Clipperz.NotificationCenter.notify(null, 'directLoginAdded', null, true);
+//MochiKit.Logging.logDebug("<<< Header.processDirectLoginData");
+		
+		return this.user().directLoginReferences();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'shouldLoadSections': function() {
+		return this._shouldLoadSections;
+	},
+	
+	'shouldLoadSection': function(aSectionName) {
+		var result;
+
+		if (typeof(this.shouldLoadSections()[aSectionName]) != 'undefined') {
+			result = this.shouldLoadSections()[aSectionName];
+		} else {
+			result = true;
+		}
+		
+		return result;
+	},
+	
+	'setShouldLoadSection': function(aSectionName, aValue) {
+		this.shouldLoadSections()[aSectionName] = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'loadRecords': function() {
+		var deferredResult;
+
+		if (this.shouldLoadSection('records') == true) {
+			this.setShouldLoadSection('records', false);
+
+			deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadRecords 1: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this.user(), 'getUserDetails'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadRecords 2: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'extractHeaderDataFromUserDetails'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadRecords 3: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'extractDataWithKey', 'records'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadRecords 4: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'processRecordData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadRecords 5: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.callback();
+		} else {
+			deferredResult = MochiKit.Async.succeed(this.user().records());
+		}
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'loadDirectLogins': function() {
+		var deferredResult;
+
+		if (this.shouldLoadSection('directLogins') == true) {
+			this.setShouldLoadSection('directLogins', false);
+
+			deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadDirectLogins - 1: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this.user(), 'getUserDetails'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadDirectLogins - 2: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'extractHeaderDataFromUserDetails'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadDirectLogins - 3: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'extractDataWithKey', 'directLogins'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadDirectLogins - 4: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'processDirectLoginData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadDirectLogins - 5: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.callback();
+		} else {
+			deferredResult = MochiKit.Async.succeed(this.user().directLoginReferences());
+		}
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'loadPreferences': function() {
+		var deferredResult;
+
+		if (this.shouldLoadSection('preferences') == true) {
+			this.setShouldLoadSection('preferences', false);
+
+			deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadPreferences - 1: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this.user(), 'getUserDetails'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadPreferences - 2: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'extractHeaderDataFromUserDetails'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadPreferences - 3: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'extractDataWithKey', 'preferences'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadPreferences - 4: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this.user().preferences(), 'updateWithData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadPreferences - 5: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.callback();
+		} else {
+			deferredResult = MochiKit.Async.succeed(this.user().preferences());
+		}
+		
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'loadOneTimePasswords': function() {
+		var deferredResult;
+		
+		if (this.shouldLoadSection('oneTimePasswords') == true) {
+			this.setShouldLoadSection('oneTimePasswords', false);
+
+			deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadOneTimePasswords - 1: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this.user(), 'getUserDetails'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadOneTimePasswords - 2: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'extractHeaderDataFromUserDetails'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadOneTimePasswords - 3: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'extractDataWithKey', 'oneTimePasswords'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadOneTimePasswords - 4: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this.user().oneTimePasswordManager(), 'updateWithData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadOneTimePasswords - 5: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this.user().connection(), 'message'), 'getOneTimePasswordsDetails', {});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadOneTimePasswords - 6: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this.user().oneTimePasswordManager(), 'updateWithServerData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadOneTimePasswords - 7: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.callback();
+		} else {
+			deferredResult = MochiKit.Async.succeed(this.user().oneTimePasswordManager());
+		}
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'loadAllSections': function() {
+		var deferredResult;
+
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadAllSections - 1: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'loadRecords'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadAllSections - 2: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'loadDirectLogins'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadAllSections - 3: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'loadPreferences'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadAllSections - 4: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'loadOneTimePasswords'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Header.loadAllSections - 5: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.callback();
+		
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/OneTimePassword.js b/frontend/beta/js/Clipperz/PM/DataModel/OneTimePassword.js
new file mode 100644
index 0000000..dd8d5c9
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/OneTimePassword.js
@@ -0,0 +1,333 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.OneTimePassword = function(args) {
+	args = args || {};
+
+//console.log("new OneTimePassword", args);
+//MochiKit.Logging.logDebug("---");
+	this._user = args['user'];
+	this._password = args['password'];
+	this._passwordValue = Clipperz.PM.DataModel.OneTimePassword.normalizedOneTimePassword(args['password']);
+	this._reference = args['reference'] || Clipperz.PM.Crypto.randomKey();
+	this._creationDate =	args['created']		? Clipperz.PM.Date.parseDateWithUTCFormat(args['created'])		: new Date();
+	this._usageDate =		args['used']		? Clipperz.PM.Date.parseDateWithUTCFormat(args['used'])			: null;
+
+	this._status =			args['status'] || 'ACTIVE';
+	this._connectionInfo = null;
+	
+	this._key = null;
+	this._keyChecksum = null;
+
+	return this;
+}
+
+Clipperz.PM.DataModel.OneTimePassword.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "Clipperz.PM.DataModel.OneTimePassword";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'password': function() {
+		return this._password;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'passwordValue': function() {
+		return this._passwordValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'creationDate': function() {
+		return this._creationDate;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'reference': function() {
+		return this._reference;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'key': function() {
+		if (this._key == null) {
+			this._key = Clipperz.PM.DataModel.OneTimePassword.computeKeyWithUsernameAndPassword(this.user().username(), this.passwordValue());
+		}
+		
+		return this._key;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'keyChecksum': function() {
+		if (this._keyChecksum == null) {
+			this._keyChecksum = Clipperz.PM.DataModel.OneTimePassword.computeKeyChecksumWithUsernameAndPassword(this.user().username(), this.passwordValue());
+		}
+		
+		return this._keyChecksum;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'status': function() {
+		return this._status;
+	},
+	
+	'setStatus': function(aValue) {
+		this._status = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'serializedData': function() {
+		var result;
+		
+		result = {
+			'password': 	this.password(),
+			'created':		this.creationDate()		? Clipperz.PM.Date.formatDateWithUTCFormat(this.creationDate())		: null,
+			'used':			this.usageDate()		? Clipperz.PM.Date.formatDateWithUTCFormat(this.usageDate())		: null,
+			'status':	 	this.status()
+		};
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'packedPassphrase': function() {
+		var result;
+		var packedPassphrase;
+		var encodedPassphrase;
+		var	prefixPadding;
+		var suffixPadding;
+		var getRandomBytes;
+		
+		getRandomBytes = MochiKit.Base.method(Clipperz.Crypto.PRNG.defaultRandomGenerator(), 'getRandomBytes');
+		
+		encodedPassphrase = new Clipperz.ByteArray(this.user().passphrase()).toBase64String();
+//MochiKit.Logging.logDebug("--- encodedPassphrase.length: " + encodedPassphrase.length);
+		prefixPadding = getRandomBytes(getRandomBytes(1).byteAtIndex(0)).toBase64String();
+//MochiKit.Logging.logDebug("--- prefixPadding.length: " + prefixPadding.length);
+		suffixPadding = getRandomBytes((500 - prefixPadding.length - encodedPassphrase.length) * 6 / 8).toBase64String();
+//MochiKit.Logging.logDebug("--- suffixPadding.length: " + suffixPadding.length);
+//MochiKit.Logging.logDebug("--- total.length: " + (prefixPadding.length + encodedPassphrase.length + suffixPadding.length));
+	
+		packedPassphrase = {
+			'prefix': prefixPadding,
+			'passphrase': encodedPassphrase,
+			'suffix': suffixPadding
+		};
+		
+//		result = Clipperz.Base.serializeJSON(packedPassphrase);
+		result = packedPassphrase;
+//MochiKit.Logging.logDebug("===== OTP packedPassprase: [" + result.length + "]" + result);
+//MochiKit.Logging.logDebug("<<< OneTimePassword.packedPassphrase");
+
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'encryptedPackedPassphrase': function() {
+		return Clipperz.PM.Crypto.deferredEncryptWithCurrentVersion(this.passwordValue(), this.packedPassphrase())
+	},
+
+	//-------------------------------------------------------------------------
+
+	'encryptedData': function() {
+		var deferredResult;
+		var	result;
+
+//MochiKit.Logging.logDebug(">>> OneTimePassword.encryptedData");
+//MochiKit.Logging.logDebug("--- OneTimePassword.encryptedData - id: " + this.reference());
+		result = {
+			'reference': this.reference(),
+			'key': this.key(),
+			'keyChecksum': this.keyChecksum(),
+			'data': "",
+			'version': Clipperz.PM.Crypto.encryptingFunctions.currentVersion
+		}
+//MochiKit.Logging.logDebug("--- OneTimePassword.encryptedData - 2: " + Clipperz.Base.serializeJSON(result));
+		deferredResult = new MochiKit.Async.Deferred();
+//MochiKit.Logging.logDebug("--- OneTimePassword.encryptedData - 3");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OneTimePassword.encryptedData - 1: " + res); return res;});
+//#		deferredResult.addCallback(Clipperz.PM.Crypto.deferredEncryptWithCurrentVersion, this.passwordValue(), this.packedPassphrase());
+		deferredResult.addCallback(MochiKit.Base.method(this, 'encryptedPackedPassphrase'));
+//MochiKit.Logging.logDebug("--- OneTimePassword.encryptedData - 4");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OneTimePassword.encryptedData - 2: [" + res.length + "]" + res); return res;});
+		deferredResult.addCallback(function(aResult, res) {
+			aResult['data'] = res;
+			return aResult;
+		}, result);
+//MochiKit.Logging.logDebug("--- OneTimePassword.encryptedData - 5");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OneTimePassword.encryptedData - 3: " + Clipperz.Base.serializeJSON(res)); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("--- OneTimePassword.encryptedData - 6");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'saveChanges': function() {
+		var deferredResult;
+		var	result;
+
+//MochiKit.Logging.logDebug(">>> OneTimePassword.saveChanges");
+		result = {};
+		deferredResult = new MochiKit.Async.Deferred();
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveOTP_encryptUserData');
+		deferredResult.addCallback(MochiKit.Base.method(this.user(), 'encryptedData'));
+		deferredResult.addCallback(function(aResult, res) {
+			aResult['user'] = res;
+			return aResult;
+		}, result);
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveOTP_encryptOTPData');
+		deferredResult.addCallback(MochiKit.Base.method(this, 'encryptedData'));
+		deferredResult.addCallback(function(aResult, res) {
+			aResult['oneTimePassword'] = res;
+			return aResult;
+		}, result);
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveOTP_sendingData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OneTimePassword.saveChanges - 1: " + Clipperz.Base.serializeJSON(res)); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.user().connection(), 'message'), 'addNewOneTimePassword');
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveOTP_updatingInterface');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OneTimePassword.saveChanges - 2: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'notify', 'OTPUpdated');
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'oneTimePassword_saveChanges_done', null);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OneTimePassword.saveChanges - 2: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< OneTimePassword.saveChanges");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'usageDate': function() {
+		return this._usageDate;
+	},
+
+	'setUsageDate': function(aValue) {
+		this._usageDate = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'connectionInfo': function() {
+		return this._connectionInfo;
+	},
+
+	'setConnectionInfo': function(aValue) {
+		this._connectionInfo = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'isExpired': function() {
+		return (this.usageDate() != null);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'updateStatusWithValues': function(someValues) {
+		var result;
+
+		result = false;
+		
+		if (someValues['status'] != this.status()) {
+			result = true;
+		}
+		
+		this.setStatus(someValues['status']);
+		this.setUsageDate(Clipperz.PM.Date.parseDateWithUTCFormat(someValues['requestDate']));
+		this.setConnectionInfo(someValues['connection']);
+
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+//=============================================================================
+
+Clipperz.PM.DataModel.OneTimePassword.computeKeyWithUsernameAndPassword = function(anUsername, aPassword) {
+	return Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(aPassword)).toHexString().substring(2);
+}
+
+Clipperz.PM.DataModel.OneTimePassword.computeKeyChecksumWithUsernameAndPassword = function(anUsername, aPassword) {
+	return Clipperz.Crypto.SHA.sha_d256(new Clipperz.ByteArray(anUsername + aPassword)).toHexString().substring(2);
+}
+
+//=============================================================================
+
+Clipperz.PM.DataModel.OneTimePassword.normalizedOneTimePassword = function(aPassword) {
+	var	result;
+	
+	if (aPassword.replace(/[\s\-]/g, '').length == 32) {
+		try {
+			var passwordByteArray;
+			
+			passwordByteArray = new Clipperz.ByteArray();
+			passwordByteArray.appendBase32String(aPassword);
+			
+			result = passwordByteArray.toBase64String();
+		} catch(exception) {
+			result = aPassword;
+		}
+	} else {
+		result = aPassword;
+	}
+	
+	return result;
+}
+
+//=============================================================================
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/OneTimePasswordManager.js b/frontend/beta/js/Clipperz/PM/DataModel/OneTimePasswordManager.js
new file mode 100644
index 0000000..d90100a
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/OneTimePasswordManager.js
@@ -0,0 +1,280 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.OneTimePasswordManager = function(anUser, args) {
+	args = args || {};
+
+	this._user = anUser;
+	this._oneTimePasswords = {};
+
+	this.updateWithData(args);
+
+	Clipperz.NotificationCenter.notify(null, 'oneTimePasswordAdded', null, true);
+
+	return this;
+}
+
+Clipperz.PM.DataModel.OneTimePasswordManager.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "Clipperz.PM.DataModel.OneTimePasswordManager";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'updateWithData': function(someValues) {
+		var	otpReference;
+
+//console.log("OneTimePasswordManager.updateWithData", someValues);
+//MochiKit.Logging.logDebug("OneTimePasswordManager.updateWithData: " + Clipperz.Base.serializeJSON(someValues));
+		for (otpReference in someValues) {
+			var otp;
+			var otpConfiguration;
+		
+			otpConfiguration = someValues[otpReference];
+			otpConfiguration['user'] = this.user();
+			otpConfiguration['reference'] = otpReference;
+			otp = new Clipperz.PM.DataModel.OneTimePassword(otpConfiguration);
+			this._oneTimePasswords[otpReference] = otp;
+		}
+
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'updateWithServerData': function(someValues) {
+		var deferredResult;
+		var	oneTimePasswordReference;
+		var wereChangesApplied;
+		
+//MochiKit.Logging.logDebug(">>> OneTimePasswordManager.updateWithServerData");
+		deferredResult = new MochiKit.Async.Deferred();
+		wereChangesApplied = false;
+	
+		for (oneTimePasswordReference in someValues) {
+			var oneTimePassword;
+		
+			oneTimePassword = this.oneTimePasswordWithReference(oneTimePasswordReference);
+			if (oneTimePassword != null) {
+				var oneTimePasswordHasBeenUpdated;
+				
+				oneTimePasswordHasBeenUpdated = oneTimePassword.updateStatusWithValues(someValues[oneTimePasswordReference]);
+				wereChangesApplied = oneTimePasswordHasBeenUpdated || wereChangesApplied;
+			} else {
+
+			}
+		}
+
+		if (wereChangesApplied == true) {
+			this.user().header().markSectionAsUpdated('oneTimePasswords');
+		}
+
+		for (oneTimePasswordReference in this.oneTimePasswords()) {
+			if (typeof(someValues[oneTimePasswordReference]) == 'undefind') {
+				deferredResult.addCallback(MochiKit.Base.method(this.oneTimePasswordWithReference(oneTimePasswordReference), 'saveChanges'));
+			}
+		}
+		
+		deferredResult.addCallback(MochiKit.Async.succeed, this);
+		
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< OneTimePasswordManager.updateWithServerData");
+
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'addOneTimePassword': function(aOneTimePassword, isBatchUpdate) {
+		this.oneTimePasswords()[aOneTimePassword.reference()] = aOneTimePassword;
+		
+		if (isBatchUpdate != true) {
+			Clipperz.NotificationCenter.notify(aOneTimePassword, 'oneTimePasswordAdded');
+			Clipperz.NotificationCenter.notify(this.user(), 'updatedSection', 'oneTimePasswords', true);
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'archiveOneTimePassword': function(aOneTimePasswordReference) {
+		var deferredResult;
+		
+//MochiKit.Logging.logDebug(">>> OneTimePasswordManager.archiveOneTimePassword");
+//MochiKit.Logging.logDebug("--- OneTimePasswordManager.archiveOneTimePassword - 0 otp.reference: " + aOneTimePasswordReference);
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(this.user(), 'loadOneTimePasswords'));
+		deferredResult.addCallback(MochiKit.Base.bind(function(aOneTimePasswordReference) {
+			var oneTimePassword;
+			
+//MochiKit.Logging.logDebug("--- OneTimePasswordManager.archiveOneTimePassword - 1 serializedData: " + Clipperz.Base.serializeJSON(this.serializedData()));
+			oneTimePassword = this.oneTimePasswords()[aOneTimePasswordReference];
+			
+			if (oneTimePassword != null) {
+				oneTimePassword.setUsageDate(new Date());
+
+//				while (this.usedOneTimePasswords().length > 10) {
+//					var referenceOfOneTimePasswordToRemove;
+//					
+//					referenceOfOneTimePasswordToRemove = this.usedOneTimePasswords()[0];
+//					delete this.oneTimePasswords()[referenceOfOneTimePasswordToRemove];
+//					this.usedOneTimePasswords().shift();
+//				}
+
+				Clipperz.NotificationCenter.notify(this.user(), 'updatedSection', 'oneTimePasswords', true);
+			} else {
+				MochiKit.Logging.logError("### OneTimePasswordManager.archiveOneTimePassword - the used OneTimePassword has not been found on the index-card. :-(");
+			}
+
+//MochiKit.Logging.logDebug("--- OneTimePasswordManager.archiveOneTimePassword - 2 serializedData: " + Clipperz.Base.serializeJSON(this.serializedData()));
+		}, this), aOneTimePasswordReference);
+		deferredResult.addCallback(MochiKit.Base.method(this, 'saveChanges'));
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< OneTimePasswordManager.archiveOneTimePassword");
+
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'serializedData': function() {
+		var result;
+		var	key;
+		
+		result = {};
+
+		for (key in this.oneTimePasswords()) {
+			result[key] = this.oneTimePasswords()[key].serializedData();
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'oneTimePasswords': function() {
+		return this._oneTimePasswords;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'oneTimePasswordWithReference': function(aOneTimePasswordReference) {
+		return this.oneTimePasswords()[aOneTimePasswordReference];
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'deleteOneTimePasswordWithReference': function(aOneTimePasswordReference) {
+		delete(this.oneTimePasswords()[aOneTimePasswordReference]);
+		Clipperz.NotificationCenter.notify(this.user(), 'updatedSection', 'oneTimePasswords', true);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'encryptedData': function() {
+		var deferredResult;
+		var oneTimePasswordReferences;
+		var result;
+		var i, c;
+		
+		result = {};
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Async.succeed);
+
+		oneTimePasswordReferences = MochiKit.Base.keys(this.oneTimePasswords());
+		c = oneTimePasswordReferences.length;
+		for (i=0; i<c; i++) {
+			var currentOneTimePassword;
+			
+			currentOneTimePassword = this.oneTimePasswords()[oneTimePasswordReferences[i]];
+			deferredResult.addCallback(MochiKit.Base.method(currentOneTimePassword, 'encryptedPackedPassphrase'));
+			deferredResult.addCallback(function(aResult, aOneTimePasswordReference, anEncryptedPackedPassphrase) {
+				aResult[aOneTimePasswordReference] = anEncryptedPackedPassphrase;
+				return aResult;
+			}, result, oneTimePasswordReferences[i]);
+		}
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OneTimePasswordManager.encryptedData: " + res); return res;});
+		
+		deferredResult.callback(result);
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'saveChanges': function() {
+		var deferredResult;
+		var	result;
+
+//MochiKit.Logging.logDebug(">>> OneTimePasswordManager.saveChanges");
+		result = {};
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveOTP_encryptUserData');
+		deferredResult.addCallback(MochiKit.Base.method(this.user(), 'encryptedData'));
+		deferredResult.addCallback(function(aResult, res) {
+			aResult['user'] = res;
+			return aResult;
+		}, result);
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveOTP_encryptOTPData');
+		deferredResult.addCallback(MochiKit.Base.bind(function(res) {
+			res['oneTimePasswords'] = MochiKit.Base.keys(this.oneTimePasswords());
+			return res;
+		}, this));
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveOTP_sendingData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OneTimePasswordManager.saveChanges - 1: " + Clipperz.Base.serializeJSON(res)); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.user().connection(), 'message'), 'updateOneTimePasswords');
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveOTP_updatingInterface');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OneTimePasswordManager.saveChanges - 2: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'notify', 'OTPUpdated');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("OneTimePasswordManager.saveChanges - 3: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< OneTimePasswordManager.saveChanges");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/Record.js b/frontend/beta/js/Clipperz/PM/DataModel/Record.js
new file mode 100644
index 0000000..b4b5023
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/Record.js
@@ -0,0 +1,759 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.Record = function(args) {
+	args = args || {};
+
+	this._user = args['user'] || null;
+	this._reference = args['reference'] || Clipperz.PM.Crypto.randomKey();
+	this._version = args['version'] || Clipperz.PM.Crypto.encryptingFunctions.currentVersion;
+	this._key = args['key'] || Clipperz.PM.Crypto.randomKey();
+
+	this.setLabel(args['label'] || Clipperz.PM.Strings['newRecordTitleLabel']);
+	
+	this.setHeaderNotes(args['headerNotes'] || null);
+	this.setNotes(args['notes'] || args['headerNotes'] || "");
+//MochiKit.Logging.logDebug("--- new Record ('" + this._label + "')- _headerNotes: '" + this._headerNotes + "'");
+//MochiKit.Logging.logDebug("--- new Record ('" + this._label + "')- _notes: '" + this._notes + "'");
+//	this._notes = args.notes || "";
+	
+	this._versions = {};
+	this._directLogins = {};
+	this._removedDirectLogins = [];
+	
+	this.setIsBrandNew(args['reference'] == null);
+
+	this.setShouldLoadData(this.isBrandNew() ? false: true);
+	this.setShouldDecryptData(this.isBrandNew() ? false: true);
+	this.setShouldProcessData(this.isBrandNew() ? false: true);
+
+	this.setCurrentVersion(this.isBrandNew() ? new Clipperz.PM.DataModel.RecordVersion(this, null): null);
+	this.setCurrentVersionKey(null);
+
+	this._serverData = null;
+	this._decryptedData = null;
+	this._cachedData = null;
+	
+	return this;
+}
+
+Clipperz.PM.DataModel.Record.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "Record (" + this.label() + ")";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isBrandNew': function() {
+		return this._isBrandNew;
+	},
+	
+	'setIsBrandNew': function(aValue) {
+		this._isBrandNew = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+/*
+	'shouldRunTheRecordCreationWizard': function() {
+		return (this.isBrandNew() && (MochiKit.Base.keys(this.currentVersion().fields()).length == 0));
+	},
+*/	
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'reference': function() {
+		return this._reference;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'key': function() {
+		return this._key;
+	},
+	
+	'updateKey': function() {
+		this._key = Clipperz.PM.Crypto.randomKey();
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'label': function() {
+		return this._label;
+	},
+
+	'setLabel': function(aValue) {
+		this._label = aValue;
+	},
+	
+	'lowerCaseLabel': function() {
+		return this.label().toLowerCase();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'versions': function() {
+		return this._versions;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'currentVersion': function() {
+		return this._currentVersion;
+	},
+	
+	'setCurrentVersion': function(aValue) {
+		this._currentVersion = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'currentVersionKey': function() {
+		return this._currentVersionKey;
+	},
+
+	'setCurrentVersionKey': function(aValue) {
+		this._currentVersionKey = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'deferredData': function() {
+		var	deferredResult;
+
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Record.deferredData - this: " + this);
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(this, 'loadData'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'decryptData'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'processData'));
+		deferredResult.addCallback(function(aRecord) {
+			return aRecord.currentVersion().deferredData();
+		});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'takeSnapshotOfCurrentData'));
+		deferredResult.addCallback(MochiKit.Async.succeed, this);
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< [" + (new Date()).valueOf() + "] Record.deferredData");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'exportedData': function() {
+		var result;
+		
+		result = {};
+		result['label'] = this.label();
+		result['data'] = this.serializedData();
+		result['currentVersion'] = this.currentVersion().serializedData();
+		result['currentVersion']['reference'] = this.currentVersion().reference();
+//		result['versions'] = MochiKit.Base.map(MochiKit.Base.methodcaller("serializedData"), MochiKit.Base.values(this.versions()));
+		
+		return Clipperz.Base.serializeJSON(result);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'shouldLoadData': function() {
+		return this._shouldLoadData;
+	},
+
+	'setShouldLoadData': function(aValue) {
+		this._shouldLoadData = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'shouldDecryptData': function() {
+		return this._shouldDecryptData;
+	},
+
+	'setShouldDecryptData': function(aValue) {
+		this._shouldDecryptData = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'shouldProcessData': function() {
+		return this._shouldProcessData;
+	},
+	
+	'setShouldProcessData': function(aValue) {
+		this._shouldProcessData = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'loadData': function() {
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Record.loadData - this: " + this);
+		if (this.shouldLoadData()) {
+			var deferredResult;
+		
+			deferredResult = new MochiKit.Async.Deferred();
+			deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'notify', 'loadingRecordData');
+			deferredResult.addCallback(MochiKit.Base.method(this.user().connection(), 'message'), 'getRecordDetail', {reference: this.reference()});
+			deferredResult.addCallback(MochiKit.Base.method(this,'setServerData'));
+			deferredResult.callback();
+			result = deferredResult;
+		} else {
+			result = MochiKit.Async.succeed(this.serverData());
+		}
+//MochiKit.Logging.logDebug("<<< [" + (new Date()).valueOf() + "] Record.loadData");
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'decryptData': function(anEncryptedData) {
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Record.decryptData - this: " + this + " (" + anEncryptedData + ")");
+		if (this.shouldDecryptData()) {
+			var deferredResult;
+		
+			deferredResult = new MochiKit.Async.Deferred();
+			deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'notify', 'decryptingRecordData');
+			deferredResult.addCallback(Clipperz.PM.Crypto.deferredDecrypt, this.key(), anEncryptedData['data'], anEncryptedData['version']);
+			deferredResult.addCallback(function(anEncryptedData, someDecryptedValues) {
+				var	result;
+
+				result = anEncryptedData;
+				result['data'] = someDecryptedValues;
+			
+				return result;
+			}, anEncryptedData);
+			deferredResult.addCallback(MochiKit.Base.method(this, 'setDecryptedData'));
+			deferredResult.callback();
+
+			result = deferredResult;
+		} else {
+			result = MochiKit.Async.succeed(this.decryptedData());
+		}
+//MochiKit.Logging.logDebug("<<< [" + (new Date()).valueOf() + "] Record.decryptData");
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'processData': function(someValues) {
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Record.processData");
+//MochiKit.Logging.logDebug("--- Record.processData: " + Clipperz.Base.serializeJSON(someValues));
+		if (this.shouldProcessData()) {
+			var currentVersionParameters;
+
+			this.processDataToExtractLegacyValues(someValues['data']);
+
+			if (typeof(someValues['data']['notes']) != 'undefined') {
+				this.setNotes(someValues['data']['notes']);
+			}
+			if (someValues['data']['currentVersionKey'] != null) {
+				this.setCurrentVersionKey(someValues['data']['currentVersionKey']);
+			} else {
+				this.setCurrentVersionKey(this.key());
+			}
+
+			currentVersionParameters = someValues['currentVersion'];
+			currentVersionParameters['key'] = this.currentVersionKey();
+			this.setCurrentVersion(new Clipperz.PM.DataModel.RecordVersion(this, currentVersionParameters));
+			
+			if (someValues['data']['directLogins'] != null) {
+				var	directLoginReference;
+			
+				for (directLoginReference in someValues['data']['directLogins']) {
+					var directLogin;
+					var directLoginParameters;
+				
+					directLoginParameters = someValues['data']['directLogins'][directLoginReference];
+					directLoginParameters.record = this;
+					directLoginParameters.reference = directLoginReference;
+				
+					directLogin = new Clipperz.PM.DataModel.DirectLogin(directLoginParameters);
+					this.addDirectLogin(directLogin, true);
+				}
+			}
+			this.setShouldProcessData(false);
+		}
+		
+		Clipperz.NotificationCenter.notify(this, 'recordDataReady');
+//MochiKit.Logging.logDebug("<<< [" + (new Date()).valueOf() + "] Record.processData");
+//MochiKit.Logging.logDebug("<<< Record.processData");
+		
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'processDataToExtractLegacyValues': function(someValues) {
+//MochiKit.Logging.logDebug(">>> Record.processDataToExtractLegacyValues");
+		if (someValues['data'] != null) {
+			this.setNotes(someValues['data']);
+		}
+
+		if (
+				(typeof(someValues['loginFormData']) != "undefined")
+			&&	(typeof(someValues['loginBindings'] != "undefined"))
+			&&	(someValues['loginFormData'] != "")
+			&&	(someValues['loginBindings'] != "")
+		) {
+			var	directLogin;
+
+			directLogin = new Clipperz.PM.DataModel.DirectLogin({
+				record:this,
+				label:this.label() + Clipperz.PM.Strings['newDirectLoginLabelSuffix'],
+				reference:Clipperz.Crypto.SHA.sha256(new Clipperz.ByteArray(this.label() +
+																			someValues['loginFormData'] +
+																			someValues['loginBindings'])).toHexString().substring(2),
+				formData:Clipperz.Base.evalJSON(someValues['loginFormData']),
+				legacyBindingData:Clipperz.Base.evalJSON(someValues['loginBindings']),
+				bookmarkletVersion:'0.1'
+			});
+			this.addDirectLogin(directLogin, true);
+		}
+//MochiKit.Logging.logDebug("<<< Record.processDataToExtractLegacyValues");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'getReadyBeforeUpdatingVersionValues': function() {
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'addNewField': function() {
+		var	newField;
+
+//MochiKit.Logging.logDebug(">>> Record.addNewField - " + this);
+		this.getReadyBeforeUpdatingVersionValues();
+		newField = this.currentVersion().addNewField();
+		Clipperz.NotificationCenter.notify(this, 'recordUpdated');
+//MochiKit.Logging.logDebug("<<< Record.addNewField");
+		
+		return newField;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'removeField': function(aField) {
+		this.getReadyBeforeUpdatingVersionValues();
+		this.currentVersion().removeField(aField);
+		Clipperz.NotificationCenter.notify(this, 'recordUpdated');
+	},
+
+	'removeEmptyFields': function() {
+		MochiKit.Iter.forEach(MochiKit.Base.values(this.currentVersion().fields()), MochiKit.Base.bind(function(aField) {
+			if (aField.isEmpty()) {
+				this.removeField(aField);
+//				this.currentVersion().removeField(aField);
+			}
+		}, this));
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'notes': function() {
+		return this._notes;
+	},
+	
+	'setNotes': function(aValue) {
+		this._notes = aValue;
+		this.setHeaderNotes(null);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'headerNotes': function() {
+		return this._headerNotes;
+	},
+	
+	'setHeaderNotes': function(aValue) {
+		this._headerNotes = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'remove': function() {
+//MochiKit.Logging.logDebug(">>> Record.remove - " + this);
+		MochiKit.Iter.forEach(MochiKit.Base.values(this.directLogins()), MochiKit.Base.method(this, 'removeDirectLogin'));
+
+		this.syncDirectLoginReferenceValues();
+		this.user().removeRecord(this);
+//MochiKit.Logging.logDebug("<<< Record.remove");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'directLogins': function() {
+		return this._directLogins;
+	},
+	
+	'addDirectLogin': function(aDirectLogin, shouldUpdateUser) {
+		this.directLogins()[aDirectLogin.reference()] = aDirectLogin;
+		if (shouldUpdateUser == true) {
+			this.user().addDirectLogin(aDirectLogin);
+		}
+	},
+
+	'removeDirectLogin': function(aDirectLogin) {
+		this.removedDirectLogins().push(aDirectLogin);
+		delete this.directLogins()[aDirectLogin.reference()];
+//		this.user().removeDirectLogin(aDirectLogin);
+	},
+
+	'resetDirectLogins': function() {
+		this._directLogins = {};
+	},
+
+	'removedDirectLogins': function() {
+		return this._removedDirectLogins;
+	},
+
+	'resetRemovedDirectLogins': function() {
+		this._removedDirectLogins = [];
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'serverData': function() {
+		return this._serverData;
+	},
+	
+	'setServerData': function(aValue) {
+		this._serverData = aValue;
+		this.setShouldLoadData(false);
+		return aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'decryptedData': function() {
+		return this._decryptedData;
+	},
+	
+	'setDecryptedData': function(aValue) {
+		this._decryptedData = aValue;
+		this.setShouldDecryptData(false);
+		return aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'cachedData': function() {
+		return this._cachedData;
+	},
+	
+	'setCachedData': function(aValue) {
+//MochiKit.Logging.logDebug(">>> Record.setCachedData");
+//MochiKit.Logging.logDebug("--- Record.setCachedData - aValue: " + Clipperz.Base.serializeJSON(aValue));
+		this._cachedData = aValue;
+		this.setShouldProcessData(false);
+//MochiKit.Logging.logDebug("<<< Record.setCachedData");
+
+		return aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'hasPendingChanges': function() {
+		var result;
+
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Record.hasPendingChanges");
+//MochiKit.Logging.logDebug(">>> Record.hasPendingChanges - cachedData: " + this.cachedData());
+//MochiKit.Logging.logDebug(">>> Record.hasPendingChanges - cachedData: " + Clipperz.Base.serializeJSON(this.cachedData()));
+//MochiKit.Logging.logDebug(">>> Record.hasPendingChanges - currentSnapshot: " + this.currentDataSnapshot());
+//MochiKit.Logging.logDebug(">>> Record.hasPendingChanges - currentSnapshot: " + Clipperz.Base.serializeJSON(this.currentDataSnapshot()));
+//console.log(">>> Record.hasPendingChanges - cachedData: %o", this.cachedData());
+//console.log(">>> Record.hasPendingChanges - currentSnapshot: %o", this.currentDataSnapshot());
+		result = (MochiKit.Base.compare(this.cachedData(), this.currentDataSnapshot()) != 0);
+//MochiKit.Logging.logDebug("<<< Record.hasPendingChanges - " + result);
+
+		if ((result == false) && this.isBrandNew() && (this.label() != Clipperz.PM.Strings['newRecordTitleLabel'])) {
+			result = true;
+		}
+//MochiKit.Logging.logDebug("<<< [" + (new Date()).valueOf() + "] Record.hasPendingChanges");
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'currentDataSnapshot': function() {
+		var	result;
+		
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Record.currentDataSnapshot");
+		result = {
+			'label': this.label(),
+			'data': this.serializedData(),
+			'currentVersion': this.currentVersion().currentDataSnapshot()
+		};
+		
+//		result['data']['data'] = this.notes();
+		result = Clipperz.Base.serializeJSON(result);
+		
+//MochiKit.Logging.logDebug("<<< [" + (new Date()).valueOf() + "] Record.currentDataSnapshot");
+//MochiKit.Logging.logDebug("<<< Record.currentDataSnapshot");
+
+		return result;
+	},
+
+	//.........................................................................
+
+	'takeSnapshotOfCurrentData': function() {
+		this.setCachedData(this.currentDataSnapshot());
+	},
+
+	//-------------------------------------------------------------------------
+
+	'headerData': function() {
+		var result;
+		
+		result = {
+			'label':		this.label(),
+			'key':			this.key()
+		};
+
+		if (this.headerNotes() != null) {
+			result['headerNotes'] = this.headerNotes();
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'serializedData': function() {
+		var result;
+		var directLoginReference;
+
+		result = {};
+		result['currentVersionKey'] = this.currentVersion().key();
+		
+		result['directLogins'] = {};
+		for (directLoginReference in this.directLogins()) {
+			result['directLogins'][directLoginReference] = this.directLogins()[directLoginReference].serializedData();
+		}
+		result['notes'] = this.notes();
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'encryptedData': function() {
+		var deferredResult;
+		var	result;
+		
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Record.encryptedData");
+		result = {}
+//MochiKit.Logging.logDebug("--- Record.encryptedData - 1");
+		deferredResult = new MochiKit.Async.Deferred();
+//MochiKit.Logging.logDebug("--- Record.encryptedData - 2");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.encryptedData - 1: " + res); return res;});
+		deferredResult.addCallback(function(aResult, aRecord) {
+			aResult['reference'] = aRecord.reference();
+			return aResult;
+		}, result, this);
+//MochiKit.Logging.logDebug("--- Record.encryptedData - 3");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.encryptedData - 2: " + res); return res;});
+		deferredResult.addCallback(Clipperz.PM.Crypto.deferredEncryptWithCurrentVersion, this.key(), this.serializedData());
+//MochiKit.Logging.logDebug("--- Record.encryptedData - 4");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.encryptedData - 3: " + res); return res;});
+		deferredResult.addCallback(function(aResult, res) {
+			aResult['data'] = res;
+			return aResult;
+		}, result);
+//MochiKit.Logging.logDebug("--- Record.encryptedData - 5");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.encryptedData - 4: " + res); return res;});
+		deferredResult.addCallback(function(aResult) {
+			aResult['version'] = Clipperz.PM.Crypto.encryptingFunctions.currentVersion;
+			return aResult;
+		}, result);
+//MochiKit.Logging.logDebug("--- Record.encryptedData - 6");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Record.encryptedData - 5: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< [" + (new Date()).valueOf() + "] Record.encryptedData");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'syncDirectLoginReferenceValues': function() {
+//MochiKit.Logging.logDebug(">>> Record.syncDirectLoginReferenceValues");
+		MochiKit.Iter.forEach(MochiKit.Base.values(this.directLogins()), function(aDirectLogin) {
+			aDirectLogin.record().user().synchronizeDirectLogin(aDirectLogin);
+		});
+
+		MochiKit.Iter.forEach(this.removedDirectLogins(), function(aDirectLogin) {
+			aDirectLogin.record().user().removeDirectLogin(aDirectLogin);
+		});
+		
+		this.resetRemovedDirectLogins();
+//MochiKit.Logging.logDebug("<<< Record.syncDirectLoginReferenceValues");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'saveChanges': function() {
+		var result;
+		
+		if (this.isBrandNew() == false) {
+			result = this.user().saveRecords([this], 'updateData');
+		} else {
+			result = this.user().saveRecords([this], 'addNewRecords');
+		}
+		
+		return result;
+	},
+	
+/*
+	'saveChanges': function() {
+		var deferredResult;
+		var	result;
+
+		Clipperz.NotificationCenter.notify(this.user(), 'updatedSection', 'records', true);
+//MochiKit.Logging.logDebug(">>> Record.saveChanges");
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Record.saveChanges");
+		if (this.headerNotes() != null) {
+			this.setNotes(this.headerNotes());
+		}
+		this.syncDirectLoginReferenceValues();
+		this.currentVersion().createNewVersion();
+
+		result = {'records': [{}]};
+		
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveCard_collectRecordInfo');
+		deferredResult.addCallback(MochiKit.Base.method(this, 'updateKey'));
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveCard_encryptUserData');
+		deferredResult.addCallback(MochiKit.Base.method(this.user(), 'encryptedData'));
+		deferredResult.addCallback(function(aResult, res) {
+			aResult['user'] = res;
+			return aResult;
+		}, result);
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveCard_encryptRecordData');
+		deferredResult.addCallback(MochiKit.Base.method(this, 'encryptedData'));
+		deferredResult.addCallback(function(aResult, res) {
+//#			aResult['record'] = res;
+			aResult['records'][0]['record'] = res;
+			return aResult;
+		}, result);
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveCard_encryptRecordVersions');
+		deferredResult.addCallback(MochiKit.Base.method(this.currentVersion(), 'encryptedData'));
+		deferredResult.addCallback(function(aResult, res) {
+//			aResult['currentRecordVersion'] = res;
+			aResult['records'][0]['currentRecordVersion'] = res;
+			return aResult;
+		}, result);
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveCard_sendingData');
+		if (this.isBrandNew() == false) {
+			deferredResult.addCallback(MochiKit.Base.method(this.user().connection(), 'message'), 'updateData');
+		} else {
+//#			deferredResult.addCallback(MochiKit.Base.method(this.user().connection(), 'message'), 'addNewRecord');
+			deferredResult.addCallback(MochiKit.Base.method(this.user().connection(), 'message'), 'addNewRecords');
+		}
+
+		deferredResult.addCallback(MochiKit.Base.method(this, 'takeSnapshotOfCurrentData'));
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveCard_updatingInterface');
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setIsBrandNew'), false);
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'notify', 'recordUpdated');
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'notify', 'directLoginUpdated');
+		deferredResult.callback();
+		
+		return deferredResult;
+	},
+*/	
+	//-------------------------------------------------------------------------
+
+	'cancelChanges': function() {
+//MochiKit.Logging.logDebug(">>> Record.cancelChanges");
+//MochiKit.Logging.logDebug("--- Record.cancelChanges - cachedData: " + Clipperz.Base.serializeJSON(this.cachedData()));
+		if (this.isBrandNew()) {
+			this.user().removeRecord(this);
+		} else {
+			this.restoreValuesFromSnapshot(this.cachedData());
+		}
+//MochiKit.Logging.logDebug("<<< Record.cancelChanges");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'restoreValuesFromSnapshot': function(someSnapshotData) {
+		var	snapshotData;
+		
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] Record.restoreValuesFromSnapshot");
+		snapshotData = Clipperz.Base.evalJSON(someSnapshotData);
+//MochiKit.Logging.logDebug("--- Record.restoreValuesFromSnapshot - someSnapshotData (1): " + Clipperz.Base.serializeJSON(someSnapshotData));
+		this.setLabel(snapshotData['label']);
+		this.resetDirectLogins();
+		this.setShouldProcessData(true);
+		this.processData(snapshotData);
+//MochiKit.Logging.logDebug("--- Record.restoreValuesFromSnapshot - snapshotData: (2)" + Clipperz.Base.serializeJSON(snapshotData));
+		
+		this.resetRemovedDirectLogins();
+		
+		{
+			var currentSnapshot;
+			var	comparisonResult;
+			
+			currentSnapshot = this.currentDataSnapshot();
+//MochiKit.Logging.logDebug("--- Record.restoreValuesFromSnapshot - 1");
+//console.log("snapshot data: %o", someSnapshotData.currentVersion);
+//console.log("current data: %o", currentSnapshot.currentVersion);
+//MochiKit.Logging.logDebug("--- Record.restoreValuesFromSnapshot - someSnapshotData: " + Clipperz.Base.serializeJSON(someSnapshotData.currentVersion));
+//MochiKit.Logging.logDebug("--- Record.restoreValuesFromSnapshot - currentSnapshot: " + Clipperz.Base.serializeJSON(currentSnapshot.currentVersion));
+			comparisonResult = MochiKit.Base.compare(someSnapshotData.currentVersion, currentSnapshot.currentVersion);
+//MochiKit.Logging.logDebug("--- Record.restoreValuesFromSnapshot - " + comparisonResult);
+		}
+//MochiKit.Logging.logDebug("<<< [" + (new Date()).valueOf() + "] Record.restoreValuesFromSnapshot");
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
+
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/RecordField.js b/frontend/beta/js/Clipperz/PM/DataModel/RecordField.js
new file mode 100644
index 0000000..2063825
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/RecordField.js
@@ -0,0 +1,220 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+//#############################################################################
+
+Clipperz.PM.DataModel.RecordField = function(args) {
+	args = args || {};
+
+	this._recordVersion = args.recordVersion || null;
+	this._key	 = args.key	   || Clipperz.PM.Crypto.randomKey();
+	this.setLabel(args.label  || '');
+	this.setValue(args.value  || '');
+	this.setType(args.type   || 'TXT');	//	valid types: 'TXT', 'PWD', 'URL', 'DATE', 'ADDR', 'CHECK', 'RADIO', ('NOTE' probably not), ...
+	this._hidden = args.hidden || (args.type == 'PWD') || false;
+
+	return this;
+}
+
+Clipperz.PM.DataModel.RecordField.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "Clipperz.PM.DataModel.RecordField - " + this.label() + " (" + this.key() + ")";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'recordVersion': function() {
+		return this._recordVersion;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'key': function() {
+		return this._key;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'label': function() {
+		return this._label;
+	},
+	
+	'setLabel': function(aValue) {
+		this._label = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'value': function() {
+		return this._value;
+	},
+	
+	'setValue': function(aValue) {
+		this._value = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'type': function() {
+		return this._type;
+	},
+	
+	'setType': function(aValue) {
+		this._type = aValue;
+		
+		if (aValue == 'PWD') {
+			this.setHidden(true);
+		} else {
+			this.setHidden(false);
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'serializeData': function() {
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> RecordField.serializeData - " + this);
+		result = {
+			label:  this.label(),
+			value:	this.value(),
+			type:   this.type(),
+			hidden: this.hidden()
+		};
+//MochiKit.Logging.logDebug("<<< RecordField.serializeData");
+
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'typeShortDescription': function() {
+//		return Clipperz.PM.DataModel.RecordField.TypeDescriptions[this.type()]['shortDescription'];
+		return Clipperz.PM.Strings['recordFieldTypologies'][this.type()]['shortDescription'];
+	},
+
+	//-------------------------------------------------------------------------
+
+	'hidden': function() {
+		return this._hidden;
+	},
+	
+	'setHidden': function(aValue) {
+		this._hidden = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'clone': function(aRecordVersion) {
+		var result;
+
+		result = new Clipperz.PM.DataModel.RecordField({
+			recordVersion:aRecordVersion,
+			label:this.label(),
+			value:this.value(),
+			type:this.type(),
+			hidden:this.hidden()
+		});
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isEmpty': function() {
+		var result;
+		
+		if ((this.label() == "") && (this.value() == "") && (this.type() == 'TXT')) {
+			result = true;
+		} else {
+			result = false;
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
+//#############################################################################
+/*
+Clipperz.PM.DataModel.RecordField.TypeDescriptions = {
+	'TXT': {
+		description: 'simple text field',
+		shortDescription: 'txt'
+	},
+	'PWD': {
+		description: 'simple text field, with default status set to hidden',
+		shortDescription: 'pwd'
+	},
+	'URL': {
+		description: 'simple text field in edit mode, that became an active url in view mode',
+		shortDescription: 'url'
+	},
+	'DATE': {
+		description: 'a value set with a calendar helper',
+		shortDescription: 'date'
+	},
+	'ADDR': {
+		description: 'just like the URL, but the active link points to Google Maps (or similar service) passing the address value as argument',
+		shortDescription: 'addr'
+	},
+	'CHECK': {
+		description: 'check description',
+		shortDescription: 'check'
+	},
+	'RADIO': {
+		description: 'radio description',
+		shortDescription: 'radio'
+	},
+	'SELECT': {
+		description: 'select description',
+		shortDescription: 'select'
+	}
+	
+//	'NOTE': {
+//		description: 'a simple text field, but with a bigger component dimension; possibly with "smart edit components"',
+//		shortDescription: 'note'
+//	}
+};
+
+Clipperz.PM.DataModel.RecordField.InputTypeToRecordFieldType = {
+	'text': 'TXT',
+	'password': 'PWD',
+	'checkbox': 'CHECK',
+	'radio': 'RADIO',
+	'select': 'SELECT'
+};
+*/
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/RecordVersion.js b/frontend/beta/js/Clipperz/PM/DataModel/RecordVersion.js
new file mode 100644
index 0000000..d2b3e12
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/RecordVersion.js
@@ -0,0 +1,535 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.RecordVersion = function(aRecord, args) {
+	args = args || {};
+
+	this._record = aRecord;
+
+	this._reference = args.reference || Clipperz.PM.Crypto.randomKey();
+	this._version = args.version || Clipperz.PM.Crypto.encryptingFunctions.currentVersion;
+	this._key = args.key || Clipperz.PM.Crypto.randomKey();;
+
+	this._previousVersion = args.previousVersion || null;
+	this._previousVersionKey = args.previousVersionKey || null;
+
+	this.setIsBrandNew(args.reference == null);
+
+	if (this.isBrandNew()) {
+		this._fields = {};
+
+		this.setShouldLoadData(false);
+		this.setShouldDecryptData(false);
+		this.setShouldProcessData(false);
+	} else {
+		if (typeof(args.fields) != 'undefined') {
+			this.processFieldData(args.fields);
+			
+			this.setShouldLoadData(false);
+			this.setShouldDecryptData(false);
+			this.setShouldProcessData(false);
+		} else {
+			 if (typeof(args.data) != 'undefined') {
+				this.setShouldLoadData(false);
+			} else {
+				this.setShouldLoadData(true);
+			}
+			this.setShouldDecryptData(true);
+			this.setShouldProcessData(true);
+		}
+	}
+
+	this._serverData = args.data;
+	this._decryptedData = null;
+
+	return this;
+}
+
+Clipperz.PM.DataModel.RecordVersion.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "RecordVersion";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'record': function() {
+		return this._record;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'reference': function() {
+		return this._reference;
+	},
+	
+	'setReference': function(aValue) {
+		this._reference = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'key': function() {
+//MochiKit.Logging.logDebug(">>> RecordVersion.key");
+//MochiKit.Logging.logDebug("--- RecordVersion.key - " + this._key);
+		return this._key;
+	},
+	
+	'setKey': function(aValue) {
+		this._key = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'serverData': function() {
+		return this._serverData;
+	},
+	
+	'setServerData': function(aValue) {
+		this._serverData = aValue;
+		this.setShouldLoadData(false);
+		return aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'decryptedData': function() {
+//MochiKit.Logging.logDebug(">>> RecordVersion.decryptedData: " + (this._decryptedData ? Clipperz.Base.serializeJSON(aValue) : "null"));
+		return this._decryptedData;
+	},
+	
+	'setDecryptedData': function(aValue) {
+//MochiKit.Logging.logDebug(">>> RecordVersion.setDecryptedData: " + Clipperz.Base.serializeJSON(aValue));
+		this._decryptedData = aValue;
+		this.setShouldDecryptData(false);
+		return aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'version': function() {
+		return this._version;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isBrandNew': function() {
+		return this._isBrandNew;
+	},
+
+	'setIsBrandNew': function(aValue) {
+		this._isBrandNew = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'fields': function() {
+		return this._fields;
+	},
+
+	'addField': function(aField) {
+		this.fields()[aField.key()] = aField;
+	},
+
+	'addNewField': function() {
+		var	newRecordField;
+		
+		newRecordField = new Clipperz.PM.DataModel.RecordField({recordVersion:this});
+		this.addField(newRecordField);
+		
+		return newRecordField;
+	},
+	
+	'fieldWithName': function(aValue) {
+		var	result;
+		var fieldValues;
+		var i,c;
+		
+		result = null;
+		fieldValues = MochiKit.Base.values(this.fields());
+		c = fieldValues.length;
+		for (i=0; (i<c) && (result == null); i++) {
+			var	currentField;
+			
+			currentField = fieldValues[i];
+			if (currentField.label() == aValue) {
+				result = currentField;
+			}
+		}
+
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'shouldLoadData': function() {
+		return this._shouldLoadData;
+	},
+
+	'setShouldLoadData': function(aValue) {
+		this._shouldLoadData = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'shouldDecryptData': function() {
+		return this._shouldDecryptData;
+	},
+
+	'setShouldDecryptData': function(aValue) {
+		this._shouldDecryptData = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'shouldProcessData': function() {
+		return this._shouldProcessData;
+	},
+	
+	'setShouldProcessData': function(aValue) {
+		this._shouldProcessData = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'deferredData': function() {
+		var deferredResult;
+		
+//MochiKit.Logging.logDebug(">>> RecordVersion.deferredData - this: " + this);
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(this, 'loadData'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'decryptData'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'processData'));
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< RecordVersion.deferredData");
+		
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'loadData': function() {
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> RecordVersion.loadData - this: " + this);
+		if (this.shouldLoadData()) {
+			var deferredResult;
+
+			alert("ERROR: this should have not happened yet!");
+//MochiKit.Logging.logDebug("--- RecordVersion.loadData - 1");
+			deferredResult = new MochiKit.Async.Deferred();
+//MochiKit.Logging.logDebug("--- RecordVersion.loadData - 2");
+			deferredResult.addCallback(MochiKit.Base.method(this, 'notify'), 'loadingRecordVersionData');
+//MochiKit.Logging.logDebug("--- RecordVersion.loadData - 3");
+			deferredResult.addCallback(MochiKit.Base.method(this.user().connection(), 'message'), 'getRecordVersionDetail', {reference: this.reference()});
+//MochiKit.Logging.logDebug("--- RecordVersion.loadData - 4");
+			deferredResult.addCallback(MochiKit.Base.method(this, 'setServerData'));
+//MochiKit.Logging.logDebug("--- RecordVersion.loadData - 5");
+			deferredResult.callback();
+//MochiKit.Logging.logDebug("--- RecordVersion.loadData - 6");
+			result = deferredResult;
+//MochiKit.Logging.logDebug("--- RecordVersion.loadData - 7");
+		} else {
+//MochiKit.Logging.logDebug("--- RecordVersion.loadData - 8");
+			result = MochiKit.Async.succeed(this.serverData());
+//MochiKit.Logging.logDebug("--- RecordVersion.loadData - 9");
+		}
+//MochiKit.Logging.logDebug("<<< RecordVersion.loadData");
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'decryptData': function(anEncryptedData) {
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> RecordVersion.decryptData - this: " + this + " (" + anEncryptedData + ")");
+		if (this.shouldDecryptData()) {
+			var deferredResult;
+			
+//MochiKit.Logging.logDebug("--- RecordVersion.decryptData - 1");
+			deferredResult = new MochiKit.Async.Deferred();
+//MochiKit.Logging.logDebug("--- RecordVersion.decryptData - 2");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.decryptData 1: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'notify'), 'decryptingRecordVersionData');
+//MochiKit.Logging.logDebug("--- RecordVersion.decryptData - 3");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.decryptData 2: " + res); return res;});
+			deferredResult.addCallback(Clipperz.PM.Crypto.deferredDecrypt, this.key(), anEncryptedData, this.version());
+//MochiKit.Logging.logDebug("--- RecordVersion.decryptData - 4");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.decryptData 3: " + res); return res;});
+//MochiKit.Logging.logDebug("--- RecordVersion.decryptData - 5");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.decryptData 4: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this, 'setDecryptedData'));
+//MochiKit.Logging.logDebug("--- RecordVersion.decryptData - 6");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.decryptData 5: " + res); return res;});
+			deferredResult.callback();
+//MochiKit.Logging.logDebug("--- RecordVersion.decryptData - 7");
+			result = deferredResult;
+//MochiKit.Logging.logDebug("--- RecordVersion.decryptData - 8");
+		} else {
+//MochiKit.Logging.logDebug("--- RecordVersion.decryptData - 9");
+			result = MochiKit.Async.succeed(this.decryptedData());
+//MochiKit.Logging.logDebug("--- RecordVersion.decryptData - 10");
+		}
+//MochiKit.Logging.logDebug("<<< RecordVersion.decryptData");
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'processFieldData': function(someValues) {
+		var fieldValues;
+		
+		this._fields = {};
+
+		if (typeof(someValues) == 'undefined') {
+			fieldValues = {};
+		} else {
+			fieldValues = someValues;
+		}
+
+		if (fieldValues.constructor == Array) {
+			var i, c;
+			c = fieldValues.length;
+			for (i=0; i<c; i++) {
+				var newRecordField;
+				var currentFieldValues;
+		
+				currentFieldValues = fieldValues[i];
+				currentFieldValues['recordVersion'] = this;
+				newRecordField = new Clipperz.PM.DataModel.RecordField(currentFieldValues);
+				this._fields[newRecordField.key()] = newRecordField;
+			}
+			
+		} else {
+			var fieldKey;
+			
+			for (fieldKey in fieldValues) {
+				var newRecordField;
+				var currentFieldValues;
+		
+				currentFieldValues = fieldValues[fieldKey];
+				currentFieldValues['key'] = fieldKey;
+				currentFieldValues['recordVersion'] = this;
+				newRecordField = new Clipperz.PM.DataModel.RecordField(currentFieldValues);
+				this._fields[fieldKey] = newRecordField;
+			}
+		}
+		
+	},
+	
+	'processData': function(someValues) {
+		if (this.shouldProcessData()) {
+			this.processFieldData(someValues.fields);
+			this.setShouldProcessData(false);
+		}
+		
+		this.notify('recordVersionDataReady');
+		
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'notify': function(aValue) {
+		Clipperz.NotificationCenter.notify(this, aValue);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'removeField': function(aField) {
+		delete this.fields()[aField.key()];
+	},
+
+	//-------------------------------------------------------------------------
+
+	'previousVersion': function() {
+		return this._previousVersion;
+	},
+
+	'setPreviousVersion': function(aValue) {
+		this._previousVersion = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'previousVersionKey': function() {
+		return this._previousVersionKey;
+	},
+	
+	'setPreviousVersionKey': function(aValue) {
+		this._previousVersionKey = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'serializedData': function() {
+		var result;
+		var	fieldKey;
+
+//MochiKit.Logging.logDebug(">>> RecordVersion.serializedData");
+		result = {
+			fields: {}
+		};
+//MochiKit.Logging.logDebug("--- RecordVersion.serializedData - 1");
+		
+		for (fieldKey in this.fields()) {
+//MochiKit.Logging.logDebug("--- RecordVersion.serializedData - 2");
+			result.fields[fieldKey] = this.fields()[fieldKey].serializeData();
+//MochiKit.Logging.logDebug("--- RecordVersion.serializedData - 3");
+		}
+//MochiKit.Logging.logDebug("--- RecordVersion.serializedData - 4");
+//MochiKit.Logging.logDebug("<<< RecordVersion.serializedData: " + Clipperz.Base.serializeJSON(result));
+
+		return result;
+	},
+
+	'currentDataSnapshot': function() {
+		var result;
+
+		result = this.serializedData();
+		result['version'] = this.version();
+		result['reference'] = this.reference();
+		result['previousVersionKey'] = this.previousVersionKey();
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'encryptedData': function() {
+		var deferredResult;
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> RecordVersion.encryptedData - " + this);
+		result = {};
+		deferredResult = new MochiKit.Async.Deferred();
+//MochiKit.Logging.logDebug("--- RecordVersion.encryptedData - 1");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 1: " + res); return res;});
+		deferredResult.addCallback(function(aResult, aRecordVersion) {
+			aResult['reference'] = aRecordVersion.reference();
+			aResult['recordReference'] = aRecordVersion.record().reference();	// TODO - this seems to be completely useless
+			return aResult;
+		}, result, this);
+//MochiKit.Logging.logDebug("--- RecordVersion.encryptedData - 2");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 2: " + res); return res;});
+		deferredResult.addCallback(Clipperz.PM.Crypto.deferredEncryptWithCurrentVersion, this.key(), this.serializedData());
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 3: " + res); return res;});
+		deferredResult.addCallback(function(aResult, res) {
+			aResult['data'] = res;
+			return aResult;
+		}, result);
+//MochiKit.Logging.logDebug("--- RecordVersion.encryptedData - 3");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 4: " + res); return res;});
+		deferredResult.addCallback(function(aResult) {
+			aResult['version'] = Clipperz.PM.Crypto.encryptingFunctions.currentVersion;
+			return aResult;
+		}, result);
+//MochiKit.Logging.logDebug("--- RecordVersion.encryptedData - 4");
+		if (this.previousVersion() != null) {
+//MochiKit.Logging.logDebug("--- RecordVersion.encryptedData - 5");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 5: " + res); return res;});
+			deferredResult.addCallback(function(aResult, aRecordVersion) {
+				aResult['previousVersion'] = aRecordVersion.previousVersion();
+				return aResult;
+			}, result, this);
+//MochiKit.Logging.logDebug("--- RecordVersion.encryptedData - 6");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 6: " + res); return res;});
+			deferredResult.addCallback(Clipperz.PM.Crypto.deferredEncryptWithCurrentVersion, this.key(), this.previousVersionKey());
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 7: " + res); return res;});
+			deferredResult.addCallback(function(aResult, res) {
+				aResult['previousVersionKey'] = res;
+				return aResult;
+			}, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 8: " + res); return res;});
+//MochiKit.Logging.logDebug("--- RecordVersion.encryptedData - 7");
+		} else {
+//MochiKit.Logging.logDebug("--- RecordVersion.encryptedData - 8");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 9: " + res); return res;});
+			deferredResult.addCallback(function(aResult) {
+				aResult['previousVersionKey'] = Clipperz.PM.Crypto.nullValue;
+				return aResult;
+			}, result);
+//MochiKit.Logging.logDebug("--- RecordVersion.encryptedData - 9");
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 10: " + res); return res;});
+		};
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("RecordVersion.encryptedData - 11: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< RecordVersion.encryptedData");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'createNewVersion': function() {
+		if (this.record().isBrandNew() == false) {
+			this.setPreviousVersion(this.reference());
+			this.setPreviousVersionKey(this.key());
+
+			this.setReference(Clipperz.PM.Crypto.randomKey());
+			this.setKey(Clipperz.PM.Crypto.randomKey());
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+/*
+	'shouldLoadData': function() {
+		return ((this.data() == null) && (this.isBrandNew() === false));
+	},
+	
+	'loadData': function() {
+//MochiKit.Logging.logDebug(">>> Record.loadData (" + this.label() + ")");
+//		if (this.shouldLoadData()) {
+//			this.user().connection().message(	'getRecordDetail',
+//												{recordReference: this.reference()},
+//												{	callback:MochiKit.Base.bind(this.loadDataCallback, this),
+//													errorHandler:Clipperz.PM.defaultErrorHandler	});		
+//		} else {
+//			this.notify('loadDataDone');
+//		}
+	},
+
+	'loadDataCallback': function() {
+MochiKit.Logging.logDebug("RecordVersion.loadDataCallback: " + Clipperz.Base.serializeJSON(arguments));
+	},
+*/
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/Statistics.js b/frontend/beta/js/Clipperz/PM/DataModel/Statistics.js
new file mode 100644
index 0000000..fb5eb01
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/Statistics.js
@@ -0,0 +1,133 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.Statistics = function(args) {
+	args = args || {};
+
+	this._user = args.user;
+	this._data = args.data || null;
+
+	return this;
+}
+
+Clipperz.PM.DataModel.Statistics.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+
+	'decrypt': function(aVersion, someEncryptedData) {
+		var deferredResult;
+
+//MochiKit.Logging.logDebug(">>> Statistics.decrypt");
+		if (someEncryptedData == Clipperz.PM.Crypto.nullValue) {
+			this.setData({});
+			deferredResult = MochiKit.Async.succeed(this.data());
+		} else {
+			var	statistic;
+			var user;
+		
+			statistic = this;
+			user = this.user();
+			deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addCallback(function() { console.time("Statistics.decrypt.deferredDecrypt")});
+			deferredResult.addCallback(Clipperz.PM.Crypto.deferredDecrypt, user.passphrase(), someEncryptedData, aVersion);
+//deferredResult.addCallback(function() { console.timeEnd("Statistics.decrypt.deferredDecrypt")});
+//deferredResult.addCallback(function() { console.time("Statistics.decrypt.setup")});
+			deferredResult.addCallbacks(
+				MochiKit.Base.partial(function (aStatistic, someData) {
+					aStatistic.setData(someData);
+					return aStatistic.data();
+				}, statistic),
+				MochiKit.Base.partial(function (aStatistic) {
+					MochiKit.Logging.logWarning("resetting user statistics due to an error while decrypting stored data");
+					aStatistic.setData({});
+					return aStatistic.data();
+				}, statistic)
+			);
+//deferredResult.addCallback(function() { console.timeEnd("Statistics.decrypt.setup")});
+
+			deferredResult.callback();
+		}
+//MochiKit.Logging.logDebug("<<< Statistics.decrypt");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'data': function() {
+		return this._data;
+	},
+	
+	'setData': function(aValue) {
+		this._data = aValue;
+		
+		this.extractInfoFromData(aValue);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'extractInfoFromData': function(someValues) {
+		
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'encryptedData': function() {
+		return Clipperz.PM.Crypto.deferredEncryptWithCurrentVersion(this.user().passphrase(), this.serializedData());
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'serializedData': function() {
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> Statistics.serializedData");
+		result = {};
+//MochiKit.Logging.logDebug("<<< Statistics.serializedData");
+
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/User.js b/frontend/beta/js/Clipperz/PM/DataModel/User.js
new file mode 100644
index 0000000..5aaaff7
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/User.js
@@ -0,0 +1,904 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.User = function(args) {
+//MochiKit.Logging.logDebug(">>> new User");
+	args = args || {};
+
+	this._username = args.username || null;
+	this._passphrase = args.passphrase || null;
+
+	this._connection = null;
+	this._connectionVersion = 'current';
+
+	this._header = null;
+	this._statistics = null;
+	this._lock = 'new lock';
+
+	this._preferences = null;
+	this._records = {};
+	this._directLoginReferences = {};
+	this._oneTimePasswordManager = null;
+	
+	this._isLoadingUserDetails = false;
+	this._loadingUserDetailsPendingQueue = [];
+	
+	this._maxNumberOfRecords = Number.MAX_VALUE;
+
+	this._shouldDownloadOfflineCopy = false;
+	
+	this._loginInfo = null;
+	this._loginHistory = null;
+	
+	this._serverData = null;
+//MochiKit.Logging.logDebug("<<< new User");
+
+	return this;
+}
+
+Clipperz.PM.DataModel.User.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "Clipperz.PM.DataModel.User - " + this.username();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'username': function() {
+		return this._username;
+	},
+
+	'setUsername': function(aValue) {
+		this._username = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'passphrase': function() {
+		return this._passphrase;
+	},
+
+	'setPassphrase': function(aValue) {
+		this._passphrase = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'maxNumberOfRecords': function() {
+		return this._maxNumberOfRecords;
+	},
+	
+	'setMaxNumberOfRecords': function(aValue) {
+		this._maxNumberOfRecords = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'errorHandler': function(anErrorString, anException) {
+MochiKit.Logging.logError("- User.errorHandler: " + anErrorString + " (" + anException + ")");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'connectionVersion': function() {
+		return this._connectionVersion;
+	},
+	
+	'setConnectionVersion': function(aValue) {
+		this._connectionVersion = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'connection': function() {
+		if ((this._connection == null) && (this.connectionVersion() != null) ){
+			this._connection = new Clipperz.PM.Crypto.communicationProtocol.versions[this.connectionVersion()]({user:this});
+		}
+				
+		return this._connection;
+	},
+	
+	'resetConnection': function(aValue) {
+		this._connection = null;
+	},
+
+	//=========================================================================
+
+	'register': function(anInvitationCode) {
+		var	deferredResult;
+		var prng;
+		
+//MochiKit.Logging.logError(">>> User.register: " + this);
+		prng = Clipperz.Crypto.PRNG.defaultRandomGenerator();
+		
+		deferredResult = new MochiKit.Async.Deferred()
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.register - 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(prng, 'deferredEntropyCollection'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.register - 2: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.header(), 'updateAllSections'), anInvitationCode);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.register - 2.1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'register'), anInvitationCode);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.register - 3: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logError("<<< User.register");
+		
+		return deferredResult;
+	},
+
+	//=========================================================================
+
+	'connect': function(aValue) {
+		var	deferredResult;
+		var prng;
+		
+		prng = Clipperz.Crypto.PRNG.defaultRandomGenerator();
+		
+//MochiKit.Logging.logDebug(">>> User.connect");
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.1 - User.connect - 1: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(prng, 'deferredEntropyCollection'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.2 - User.connect - 2: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'login'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.3 - User.connect - 3: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+
+//	TODO:	add an addErrback call here to manage a wrong login. Any error after this point is due to some other causes.
+//			possibly the same exact 'handleConnectionFallback use at the end of this same method.
+			
+		if (this.connectionVersion() != 'current') {
+			var	currentConnection;
+		
+			currentVersionConnection = new Clipperz.PM.Crypto.communicationProtocol.versions['current']({user:this});
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.4 - User.connect - 4: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'connection_upgrading');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.5 - User.connect - 5: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'message'), 'upgradeUserCredentials', currentVersionConnection.serverSideUserCredentials());
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.6 - User.connect - 6: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		}
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.7 - User.connect - 7: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'userConnected', null);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.8 - User.connect - 8: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+		deferredResult.addErrback(MochiKit.Base.method(this, 'handleConnectionFallback'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("1.2.9 - User.connect - 9: "/* + res*/); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("ERROR: " + res); return res;});
+
+		deferredResult.callback(aValue);
+//MochiKit.Logging.logDebug("<<< User.connect");
+		
+		return deferredResult;
+	},
+
+	//.........................................................................
+
+	'handleConnectionFallback': function(aValue) {
+		var result;
+//MochiKit.Logging.logDebug(">>> User.handleConnectionFallback");
+		if (aValue instanceof MochiKit.Async.CancelledError) {
+//MochiKit.Logging.logDebug("--- User.handleConnectionFallback - operation cancelled");
+			result = aValue;
+		} else {
+			
+//MochiKit.Logging.logDebug("--- User.handleConnectionFallback - an ERROR has occurred - " + aValue);
+			this.resetConnection();
+			this.setConnectionVersion(Clipperz.PM.Crypto.communicationProtocol.fallbackVersions[this.connectionVersion()]);
+
+			if (this.connectionVersion() != null) {
+				result = new MochiKit.Async.Deferred();
+				
+				result.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'connection_tryOlderSchema');
+				result.addCallback(MochiKit.Base.method(this, 'connect'));
+				result.callback();
+			} else {
+				result = MochiKit.Async.fail(Clipperz.PM.DataModel.User.exception.LoginFailed);
+			}
+		}
+//MochiKit.Logging.logDebug("<<< User.handleConnectionFallback");
+		return result;
+	},
+
+	//=========================================================================
+
+	'header': function() {
+		if (this._header == null) {
+			this._header = new Clipperz.PM.DataModel.Header({user:this});
+		}
+		return this._header;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'statistics': function() {
+		if (this._statistics == null) {
+			this._statistics = new Clipperz.PM.DataModel.Statistics({user:this});
+		}
+		return this._statistics;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'records': function() {
+		return this._records;
+	},
+
+	//.........................................................................
+	
+	'addRecord': function(aValue, isBatchUpdate) {
+		this.records()[aValue.reference()] = aValue;
+		
+		if (isBatchUpdate != true) {
+			Clipperz.NotificationCenter.notify(aValue, 'recordAdded', null, true);
+			Clipperz.NotificationCenter.notify(this, 'updatedSection', 'records', true);
+		}
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'addNewRecord': function() {
+		var	record;
+		
+//MochiKit.Logging.logDebug(">>> User.addNewRecord");
+		record = new Clipperz.PM.DataModel.Record({user:this});
+		this.addRecord(record);
+		Clipperz.NotificationCenter.notify(this, 'updatedSection', 'records', true);
+//MochiKit.Logging.logDebug("<<< User.addNewRecord");
+
+		return record;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'saveRecords': function(someRecords, aMethodName) {
+		var deferredResult;
+		var methodName;
+		var	result;
+		var i,c;
+
+//console.log("User.saveRecords - someRecords", someRecords);
+		methodName = aMethodName || 'addNewRecords';
+		
+		Clipperz.NotificationCenter.notify(this, 'updatedSection', 'records', true);
+//MochiKit.Logging.logDebug(">>> User.saveRecords");
+//MochiKit.Logging.logDebug(">>> [" + (new Date()).valueOf() + "] User.saveRecords");
+/*
+MochiKit.Logging.logDebug("--- User.saveRecords - 1");
+		MochiKit.Iter.forEach(someRecords, function(aRecord) {
+			if (aRecord.headerNotes() != null) {
+				aRecord.setNotes(aRecord.headerNotes());
+			}
+			aRecord.syncDirectLoginReferenceValues();
+			aRecord.currentVersion().createNewVersion();
+			aRecord.updateKey();
+		});
+MochiKit.Logging.logDebug("--- User.saveRecords - 2");
+*/
+
+		result = {'records': []};
+		
+		deferredResult = new MochiKit.Async.Deferred();
+		c = someRecords.length;
+		for (i=0; i<c; i++) {
+			deferredResult.addCallback(function(aRecord) {
+				if (aRecord.headerNotes() != null) {
+					aRecord.setNotes(aRecord.headerNotes());
+				}
+				aRecord.syncDirectLoginReferenceValues();
+				aRecord.currentVersion().createNewVersion();
+				aRecord.updateKey();
+			}, someRecords[i]);
+			deferredResult.addCallback(MochiKit.Async.wait, 0.1);
+		}
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 1 " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveCard_collectRecordInfo');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 2 " + res); return res;});
+
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveCard_encryptUserData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 3 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'encryptedData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 4 " + res); return res;});
+		deferredResult.addCallback(function(aResult, res) {
+			aResult['user'] = res;
+			return aResult;
+		}, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 5 " + res); return res;});
+
+		c = someRecords.length;
+		for (i=0; i<c; i++) {
+			var recordData;
+			
+			recordData = {};
+			
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 6.1 " + res); return res;});
+			deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveCard_encryptRecordData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 6.2 " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(someRecords[i], 'encryptedData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 6.3 " + res); return res;});
+			deferredResult.addCallback(function(aResult, res) {
+				aResult['record'] = res;
+				return aResult;
+			}, recordData);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 6.4 " + res); return res;});
+
+			deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', {} /*'saveCard_encryptRecordVersions'*/);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 6.5 " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(someRecords[i].currentVersion(), 'encryptedData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 6.6 " + res); return res;});
+			deferredResult.addCallback(function(aResult, res) {
+				aResult['currentRecordVersion'] = res;
+				return aResult;
+			}, recordData);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 6.7 " + res); return res;});
+
+			deferredResult.addCallback(function(aResult, res) {
+				aResult['records'].push(res);
+				return aResult;
+			}, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 6.8 " + res); return res;});
+		}
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 7 " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'saveCard_sendingData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 8 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'message'), methodName);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 9 " + res); return res;});
+
+		for (i=0; i<c; i++) {
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 9.1 " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(someRecords[i], 'takeSnapshotOfCurrentData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 9.2 " + res); return res;});
+			deferredResult.addCallback(MochiKit.Base.method(someRecords[i], 'setIsBrandNew'), false);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 9.3 " + res); return res;});
+		}
+		
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 10 " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'notify', 'recordUpdated');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 11 " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'notify', 'directLoginUpdated');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.saveRecords - 12 " + res); return res;});
+		deferredResult.callback();
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'removeRecord': function(aRecord) {
+//MochiKit.Logging.logDebug(">>> User.removeRecord");
+		delete this.records()[aRecord.reference()];
+//MochiKit.Logging.logDebug("--- User.removeRecord - 1");
+		Clipperz.NotificationCenter.notify(aRecord, 'recordRemoved', null, false);
+		Clipperz.NotificationCenter.notify(this, 'updatedSection', 'records', true);
+//MochiKit.Logging.logDebug("<<< User.removeRecord");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'deleteRecordsAction': function(someRecords) {
+		var	deferredResult;
+		var parameters;
+		
+//MochiKit.Logging.logDebug(">>> User.deleteRecordsAction - someRecords.length: " + someRecords.length);
+		parameters = {};
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.deleteRecordsAction - 1 " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'deleteRecord_collectData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.deleteRecordsAction - 2 " + res); return res;});
+		deferredResult.addCallback(function(someParameters, someRecords) {
+			var recordReferences;
+
+			recordReferences = MochiKit.Base.map(function(aRecord) {
+				var result;
+				
+				result = aRecord.reference();
+				aRecord.remove();
+
+				return result;
+			}, someRecords);
+			someParameters.recordReferences = recordReferences;
+			
+			return someParameters;
+		}, parameters);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.deleteRecordsAction - 3 " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'deleteRecord_encryptData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.deleteRecordsAction - 4 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'encryptedData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.deleteRecordsAction - 5 " + res); return res;});
+		deferredResult.addCallback(function(someParameters, anUserEncryptedData) {
+			someParameters.user = anUserEncryptedData;
+			return someParameters;
+		}, parameters);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.deleteRecordsAction - 6 " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'deleteRecord_sendingData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.deleteRecords parameters: " + Clipperz.Base.serializeJSON(res)); return res;});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.deleteRecordsAction - 7 " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'message'), 'deleteRecords');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.deleteRecordsAction - 8 " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'deleteRecord_updatingInterface');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.deleteRecordsAction - 9 " + res); return res;});
+		deferredResult.callback(someRecords);
+//MochiKit.Logging.logDebug("<<< User.deleteRecordsAction");
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'resetAllLocalData': function() {
+		this.resetConnection();
+
+		this.setUsername("");
+		this.setPassphrase("");
+
+		this._header = null;
+		this._statistics = null;
+		this._preferences = null;
+		this._records = {};
+		this._directLoginReferences = {};
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'deleteAccountAction': function() {
+		var deferredResult;
+		
+//MochiKit.Logging.logDebug(">>> user.deleteAccountAction - " + this);
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'message'), 'deleteUser');
+		deferredResult.addCallback(MochiKit.Base.method(this, 'resetAllLocalData'));
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< user.deleteAccountAction - " + this);
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'encryptedData': function() {
+		var deferredResult;
+		var	result;
+
+		result = {};
+		
+		deferredResult = new MochiKit.Async.Deferred();
+
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.encryptedData - 0: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.header(), 'encryptedData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.encryptedData - 1: " + res); return res;});
+		deferredResult.addCallback(function(aResult, aValue) {
+			aResult['header'] = aValue;
+		}, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.encryptedData - 2: " + res); return res;});
+
+		deferredResult.addCallback(MochiKit.Base.method(this.statistics(), 'encryptedData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.encryptedData - 3: " + res); return res;});
+		deferredResult.addCallback(function(aResult, aValue) {
+			aResult['statistics'] = aValue;
+		}, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.encryptedData - 4: " + res); return res;});
+
+		deferredResult.addCallback(MochiKit.Base.bind(function(aResult, aValue) {
+			aResult['version'] = Clipperz.PM.Crypto.encryptingFunctions.currentVersion;
+			aResult['lock'] = this.lock();
+
+			return aResult;
+		}, this), result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.encryptedData - 5: " + res); return res;});
+		deferredResult.callback();
+		
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'preferences': function() {
+		if (this._preferences == null) {
+			this._preferences = new Clipperz.PM.DataModel.UserPreferences({user:this});
+		}
+		
+		return this._preferences;
+	},
+/*
+	'setPreferences': function(aValue) {
+		this._preferences = aValue;
+
+		if (this._preferences.preferredLanguage() != null) {
+			Clipperz.PM.Strings.Languages.setSelectedLanguage(this._preferences.preferredLanguage());
+		} else {
+//MochiKit.Logging.logDebug("### keepping the browser selected language: " + Clipperz.PM.Strings.selectedLanguage);
+		}
+	},
+*/
+	//-------------------------------------------------------------------------
+
+	'oneTimePasswordManager': function() {
+		if (this._oneTimePasswordManager == null) {
+			this._oneTimePasswordManager = new Clipperz.PM.DataModel.OneTimePasswordManager(this, null);
+		}
+		
+		return this._oneTimePasswordManager;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'directLoginReferences': function() {
+		return this._directLoginReferences;
+	},
+	
+	'addDirectLoginReference': function(aDirectLoginReference, isBatchUpdate) {
+//MochiKit.Logging.logDebug(">>> User.addDirectLoginReference");
+		this.directLoginReferences()[aDirectLoginReference.reference()] = aDirectLoginReference;
+		
+		if (isBatchUpdate != true) {
+			Clipperz.NotificationCenter.notify(aDirectLoginReference, 'directLoginAdded');
+			Clipperz.NotificationCenter.notify(this, 'updatedSection', 'directLogins', true);
+		}
+	},
+
+	'removeDirectLoginReference': function(aDirectLoginReference) {
+		delete this.directLoginReferences()[aDirectLoginReference.reference()];
+		Clipperz.NotificationCenter.notify(aDirectLoginReference, 'directLoginRemoved');
+		Clipperz.NotificationCenter.notify(this, 'updatedSection', 'directLogins', true);
+	},
+
+	//.........................................................................
+	
+	'addDirectLogin': function(aDirectLogin) {
+		var	newDirectLoginReference;
+		
+		newDirectLoginReference = new Clipperz.PM.DataModel.DirectLoginReference({user:this, directLogin:aDirectLogin})
+		this.addDirectLoginReference(newDirectLoginReference);
+	},
+
+	'synchronizeDirectLogin': function(aDirectLogin) {
+		var directLoginReference;
+		
+		directLoginReference = this.directLoginReferences()[aDirectLogin.reference()];
+		if (typeof(directLoginReference) != 'undefined') {
+			directLoginReference.synchronizeValues(aDirectLogin);
+		} else {
+			this.addDirectLogin(aDirectLogin);
+		}
+	},
+	
+	'removeDirectLogin': function(aDirectLogin) {
+		this.removeDirectLoginReference(aDirectLogin);
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'changeCredentials': function(aUsername, aPassphrase) {
+		var	deferredResult;
+		var result;
+		
+		result = {};
+		
+		deferredResult = new MochiKit.Async.Deferred();
+
+		deferredResult.addCallback(MochiKit.Base.method(this.header(), 'loadAllSections'));
+		deferredResult.addCallback(MochiKit.Base.method(this.header(), 'updateAllSections'));
+
+		deferredResult.addCallback(MochiKit.Base.bind(function(aUsername, aPssphrase) {
+			this.setUsername(aUsername);
+			this.setPassphrase(aPassphrase);
+		}, this), aUsername, aPassphrase)
+		
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 1: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'changeCredentials_encryptingData');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 2: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'encryptedData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 3: " + res); return res;});
+		deferredResult.addCallback(function(aResult, anEncryptedData) {
+			aResult['user'] = anEncryptedData;
+
+			return aResult;
+		}, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 4: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'changeCredentials_creatingNewCredentials');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 5: " + res); return res;});
+		deferredResult.addCallback(function(aResult, anUser) {
+			var	newConnection;
+			
+			newConnection = new Clipperz.PM.Crypto.communicationProtocol.versions[Clipperz.PM.Crypto.communicationProtocol.currentVersion]({user:anUser})
+			aResult['credentials'] = newConnection.serverSideUserCredentials();
+
+			return aResult;
+		}, result, this);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 6: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.oneTimePasswordManager(), 'encryptedData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 7: " + res); return res;});
+		deferredResult.addCallback(function(aResult, anEncryptedData) {
+			aResult['oneTimePasswords'] = anEncryptedData;
+
+			return aResult;
+		}, result);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 8: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'changeCredentials_sendingCredentials');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 9: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'message'), 'upgradeUserCredentials');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 10: " + res); return res;});
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'changeCredentials_done');
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.changeCredentials - 11: " + res); return res;});
+		deferredResult.callback();
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'doLogout': function() {
+		var deferredResult;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.doLogout - 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'logout'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.doLogout - 2: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'resetAllLocalData'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.doLogout - 3: " + res); return res;});
+
+		deferredResult.callback();
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'lock': function() {
+		this.setPassphrase("")
+		this.connection().logout();
+		this.connection().resetSrpConnection();
+	},
+
+	'unlockWithPassphrase': function(aValue) {
+		var	deferredResult;
+//		var	connection;
+		
+//		connection = this.connection();
+		
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.unlockWithPassphrase 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setPassphrase'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.unlockWithPassphrase 2: " + res); return res;});
+//		deferredResult.addCallback(MochiKit.Base.method(connection, 'message'), 'echo', {'echo':"echo"});
+		deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'reestablishConnection'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.unlockWithPassphrase 3: " + res); return res;});
+//		deferredResult.addErrback(MochiKit.Base.method(this, 'setPassphrase', ""));
+		deferredResult.addErrback(MochiKit.Base.bind(function(anError) {
+			this.setPassphrase("");
+			this.connection().resetSrpConnection();
+			
+			return anError;
+		}, this));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("User.unlockWithPassphrase 4: " + res); return res;});
+		deferredResult.callback(aValue);
+		
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+	//-------------------------------------------------------------------------
+
+	'serverData': function() {
+		return this._serverData;
+	},
+	
+	'setServerData': function(aValue) {
+//MochiKit.Logging.logDebug(">>> User.setServerData");
+		this._serverData = aValue;
+
+		if (typeof(aValue.maxNumberOfRecords) != 'undefined') {
+			this.setMaxNumberOfRecords(aValue.maxNumberOfRecords);
+		}
+//MochiKit.Logging.logDebug("<<< User.setServerData");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isLoadingUserDetails': function() {
+		return this._isLoadingUserDetails;
+	},
+	
+	'setIsLoadingUserDetails': function(aValue) {
+		this._isLoadingUserDetails = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'loadingUserDetailsPendingQueue': function() {
+		return this._loadingUserDetailsPendingQueue;
+	},
+	
+	'flushLoadingUserDetailsPendingQueue': function() {
+		var queue;
+
+//MochiKit.Logging.logDebug(">>> User.flushLoadingUserDetailsPendingQueue");
+		queue = this.loadingUserDetailsPendingQueue();
+		
+		while(queue.length > 0) {
+//MochiKit.Logging.logDebug("--- User.flushLoadingUserDetailsPendingQueue - pop");
+			queue.pop().callback();
+		}
+//MochiKit.Logging.logDebug("<<< User.flushLoadingUserDetailsPendingQueue");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'getUserDetails': function() {
+		var deferredResult;
+
+//MochiKit.Logging.logDebug(">>> User.getUserDetails");
+		deferredResult = new MochiKit.Async.Deferred();
+		if ((this.serverData() == null) && (this.isLoadingUserDetails() == false)) {
+			deferredResult.addCallback(MochiKit.Base.method(this, 'setIsLoadingUserDetails', true));
+			deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'message'), 'getUserDetails');
+			deferredResult.addCallback(MochiKit.Base.method(this, 'setServerData'));
+			deferredResult.addCallback(MochiKit.Base.method(this, 'flushLoadingUserDetailsPendingQueue'));
+			deferredResult.addCallback(MochiKit.Base.method(this, 'setIsLoadingUserDetails', false));
+		}
+
+		deferredResult.addCallback(MochiKit.Base.method(this, 'serverData'));
+
+		if (this.isLoadingUserDetails() == false) {
+			deferredResult.callback();
+		} else {
+			this.loadingUserDetailsPendingQueue().push(deferredResult);
+		}
+//MochiKit.Logging.logDebug("<<< User.getUserDetails");
+
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'loadRecords': function() {
+		return this.header().loadRecords();
+	},
+	
+	'loadDirectLogins': function() {
+		return this.header().loadDirectLogins();
+	},
+	
+	'loadPreferences': function() {
+		return this.header().loadPreferences();
+	},
+
+	'loadOneTimePasswords': function() {
+		return this.header().loadOneTimePasswords();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'loadLoginHistory': function() {
+		var deferredResult;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(this.connection(), 'message'), 'getLoginHistory');
+		deferredResult.addCallback(function(aResult) {
+			return aResult['result'];
+		});
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setLoginHistory'));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'loginHistory'));
+		deferredResult.callback();
+		
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'shouldDownloadOfflineCopy': function() {
+		return this._shouldDownloadOfflineCopy;
+	},
+
+	'setShouldDownloadOfflineCopy': function(aValue) {
+		this._shouldDownloadOfflineCopy = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'loginInfo': function() {
+		return this._loginInfo;
+	},
+	
+	'setLoginInfo': function(aValue) {
+		this._loginInfo = aValue;
+//MochiKit.Logging.logDebug("### LoginInfo: " + Clipperz.Base.serializeJSON(aValue));
+	},
+
+	//-------------------------------------------------------------------------
+
+	'loginHistory': function() {
+		return this._loginHistory;
+	},
+	
+	'setLoginHistory': function(aValue) {
+		this._loginHistory = aValue;
+	},
+/*
+	'loginInfoWithOneTimePasswordReference': function(aOneTimePasswordReference) {
+		var result;
+		var i,c;
+
+		result = null;
+		c = this.loginHistory().length;
+		for (i=0; (i<c) && (result == null); i++) {
+			var currentLoginInfo;
+			
+			currentLoginInfo = this.loginHistory()[i];
+			if (currentLoginInfo['oneTimePasswordReference'] == aOneTimePasswordReference) {
+				result = currentLoginInfo;
+			}
+		}
+		
+		return result;
+	},
+*/	
+	//-------------------------------------------------------------------------
+
+	'lock': function() {
+		return this._lock;
+	},
+	
+	'setLock': function(aValue) {
+//MochiKit.Logging.logDebug("=== User.setLock: " + aValue);
+		this._lock = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
+
+Clipperz.PM.DataModel.User.exception = {
+	LoginFailed: new MochiKit.Base.NamedError("Clipperz.PM.DataModel.User.exception.LoginFailed") 
+};
+	
diff --git a/frontend/beta/js/Clipperz/PM/DataModel/UserPreferences.js b/frontend/beta/js/Clipperz/PM/DataModel/UserPreferences.js
new file mode 100644
index 0000000..dc73ce1
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/DataModel/UserPreferences.js
@@ -0,0 +1,197 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.DataModel) == 'undefined') { Clipperz.PM.DataModel = {}; }
+
+
+//#############################################################################
+
+Clipperz.PM.DataModel.UserPreferences = function(args) {
+	args = args || {};
+
+	this._user = args['user']; delete args['user'];
+	this._config = args;
+	
+	return this;
+}
+
+Clipperz.PM.DataModel.UserPreferences.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+
+	'config': function() {
+		return this._config;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'updateWithData': function(someValues) {
+		var currentLanguage;
+
+//MochiKit.Logging.logDebug(">>> Clipperz.PM.DataModel.UserPreferences.updateWithData: " + Clipperz.Base.serializeJSON(someValues));
+		currentLanguage = this.preferredLanguage();
+		
+		MochiKit.Base.update(this._config, someValues);
+
+		if (this.preferredLanguage() != currentLanguage) {
+			Clipperz.PM.Strings.Languages.setSelectedLanguage(this.preferredLanguage());
+		} else {
+//MochiKit.Logging.logDebug("### keepping the browser selected language: " + Clipperz.PM.Strings.selectedLanguage);
+		}
+
+		return this;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'configValue': function(aConfigName, aDefaultValue) {
+		var result;
+		
+//MochiKit.Logging.logDebug(">>> UserPreferences.configValue - config: " + Clipperz.Base.serializeJSON(this.config()));
+		if (typeof(this.config()[aConfigName]) == 'undefined') {
+			result = aDefaultValue;
+		} else {
+			result = this.config()[aConfigName];
+		}
+//MochiKit.Logging.logDebug("<<< UserPreferences.configValue");
+		
+		return result;
+	},
+
+	'setConfigValue': function(aConfigName, aValue) {
+		var result;
+		
+		if (aValue != this.configValue(aConfigName)) {
+			if (aValue == null) {
+				delete this.config()[aConfigName]
+			} else {
+				this.config()[aConfigName] = aValue;
+			}
+		
+			Clipperz.NotificationCenter.notify(this.user(), 'updatedSection', 'preferences', true);
+			
+			result = true;
+		} else {
+			result = false;
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'useSafeEditMode': function() {
+		return this.configValue('useSafeEditMode', true);
+	},
+	
+	'setUseSafeEditMode': function(aValue) {
+		this.setConfigValue('useSafeEditMode', aValue);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'preferredLanguage': function() {
+		return this.configValue('preferredLanguage', null);
+	},
+	
+	'setPreferredLanguage': function(aValue) {
+		if (this.setConfigValue('preferredLanguage', aValue)) {
+			Clipperz.PM.Strings.Languages.setSelectedLanguage(this.preferredLanguage());
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'shouldShowDonationPanel': function() {
+		return this.configValue('shouldShowDonationPanel', true);
+	},
+	
+	'setShouldShowDonationPanel': function(aValue) {
+		this.setConfigValue('shouldShowDonationPanel', aValue);
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'disableUnsecureFaviconLoadingForIE': function() {
+		return this.configValue('disableUnsecureFaviconLoadingForIE', false);
+	},
+	
+	'setDisableUnsecureFaviconLoadingForIE': function(aValue) {
+		this.setConfigValue('disableUnsecureFaviconLoadingForIE', aValue);
+	},
+	
+	//-------------------------------------------------------------------------
+	
+	'serializedData': function() {
+		return this.config();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'saveChanges': function(aReferenceElement) {
+		var	deferredResult;
+
+		deferredResult = new MochiKit.Async.Deferred();
+		
+		deferredResult.addCallback(MochiKit.Base.method(Clipperz.PM.Components.MessageBox(), 'deferredShow'),
+			{
+				title:"",	//	Clipperz.PM.Strings['accountPreferencesSavingPanelTitle_Step1'],
+				text:"",	//	Clipperz.PM.Strings['accountPreferencesSavingPanelText_Step1'],
+				width:240,
+				showProgressBar:true,
+				showCloseButton:false
+			},
+			aReferenceElement
+		);
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'account_savingPreferences_1');
+		deferredResult.addCallback(MochiKit.Base.method(this.user(), 'encryptedData'));
+		deferredResult.addCallback(function(res) {
+			return {user:res};
+		})
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedProgressState', 'account_savingPreferences_2');
+		deferredResult.addCallback(MochiKit.Base.method(this.user().connection(), 'message'), 'updateData');
+		deferredResult.addCallback(Clipperz.PM.Components.MessageBox().hide, YAHOO.ext.Element.get('main'));
+		deferredResult.addCallback(Clipperz.NotificationCenter.deferredNotification, this, 'updatedPreferences', null);
+
+		deferredResult.callback();
+		
+		return deferredResult;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Date.js b/frontend/beta/js/Clipperz/PM/Date.js
new file mode 100644
index 0000000..5e21340
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Date.js
@@ -0,0 +1,193 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Date) == 'undefined') { Clipperz.PM.Date = {}; }
+
+Clipperz.PM.Date.VERSION = "0.1";
+Clipperz.PM.Date.NAME = "Clipperz.PM.Date";
+
+MochiKit.Base.update(Clipperz.PM.Date, {
+
+	'__repr__': function () {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'locale': function() {
+		return {
+			'amDesignation':	Clipperz.PM.Strings['calendarStrings']['amDesignation'],
+			'pmDesignation':	Clipperz.PM.Strings['calendarStrings']['pmDesignation'],
+			'days':				Clipperz.PM.Strings['calendarStrings']['days'],
+			'shortDays':		Clipperz.PM.Strings['calendarStrings']['shortDays'],
+			'shortMonths':		Clipperz.PM.Strings['calendarStrings']['shortMonths'],
+			'months':			Clipperz.PM.Strings['calendarStrings']['months']
+		}
+	},
+	
+	//=========================================================================
+/*
+	'formatDateWithPHPLikeTemplate': function(aDate, aTemplate) {
+		return Clipperz.Date.formatDateWithPHPLikeTemplateAndLocale(aDate, aTemplate, Clipperz.PM.Date.locale());
+	},
+
+	'parseDateWithPHPLikeTemplate': function(aDate, aTemplate) {
+		return Clipperz.Date.parseDateWithPHPTemplateAndLocale(aDate, aTemplate, Clipperz.PM.Date.locale());
+	},
+
+	//=========================================================================
+
+	'formatDateWithJavaLikeTemplate': function(aDate, aTemplate) {
+		return Clipperz.Date.formatDateWithJavaLikeTemplateAndLocale(aDate, aTemplate, Clipperz.PM.Date.locale());
+	},
+
+	'parseDateWithJavaLikeTemplate': function(aDate, aTemplate) {
+		return Clipperz.Date.parseDateWithJavaLikeTemplateAndLocale(aDate, aTemplate, Clipperz.PM.Date.locale());
+	},
+*/
+	//=========================================================================
+
+	'formatDateWithTemplate': function(aDate, aTemplate) {
+		var result;
+
+		if (aDate == null) {
+			result = ""
+		} else {
+		 	result = Clipperz.Date.formatDateWithPHPLikeTemplateAndLocale(aDate, aTemplate, Clipperz.PM.Date.locale());
+		};
+		
+		return result;
+	},
+
+	'parseDateWithTemplate': function(aValue, aTemplate) {
+		return Clipperz.Date.parseDateWithPHPTemplateAndLocale(aValue, aTemplate, Clipperz.PM.Date.locale());
+	},
+
+	//=========================================================================
+
+	'formatDateWithUTCFormat': function(aDate) {
+		return Clipperz.Date.formatDateWithUTCFormatAndLocale(aDate,  Clipperz.PM.Date.locale());
+	},
+	
+	'parseDateWithUTCFormat': function(aValue) {
+		var result;
+		
+		if (aValue == null) {
+			result = null;
+		} else {
+		 	result = Clipperz.Date.parseDateWithUTCFormatAndLocale(aValue,  Clipperz.PM.Date.locale());
+		}
+		
+		return result;
+	},
+
+	//=========================================================================
+
+	'getElapsedTimeDescription': function(aDate) {
+		var result;
+
+		result = ""
+		
+		if (aDate != null) {
+			var now;
+			var elapsedTime;
+		
+			var millisencondsInAMinute;
+			var millisencondsInAnHour;
+			var millisencondsInADay;
+			var millisencondsInAWeek;
+			var millisencondsInAMonth;
+
+			now = new Date();
+			elapsedTime = now.getTime() - aDate.getTime();
+		
+			millisencondsInAMinute = 60 * 1000;
+			millisencondsInAnHour = millisencondsInAMinute * 60;
+			millisencondsInADay = millisencondsInAnHour * 24;
+			millisencondsInAWeek = millisencondsInADay * 7;
+			millisencondsInAMonth = millisencondsInAWeek * 5;
+
+			if ((elapsedTime / millisencondsInAMonth) > 1) {
+				result = Clipperz.PM.Strings['elapsedTimeDescriptions']['MORE_THAN_A_MONTH_AGO'];
+			} else if ((elapsedTime / millisencondsInAWeek) > 1) {
+				var elapsedWeeks;
+			
+				elapsedWeeks = Math.floor((elapsedTime / millisencondsInAWeek));
+				if (elapsedWeeks == 1) {
+					result = Clipperz.PM.Strings['elapsedTimeDescriptions']['MORE_THAN_A_WEEK_AGO'];
+				} else {
+					result = Clipprez.PM.Strings['elapsedTimeDescriptions']['MORE_THAN_*_WEEKS_AGO'].replace(/__elapsed__/, elapsedWeeks);
+				}
+			} else if ((elapsedTime / millisencondsInADay) > 1) {
+				var elapsedDays;
+			
+				elapsedDays = Math.floor((elapsedTime / millisencondsInADay));
+				if (elapsedDays == 1) {
+					result = Clipperz.PM.Strings['elapsedTimeDescriptions']['YESTERDAY'];
+				} else {
+					result = Clipperz.PM.Strings['elapsedTimeDescriptions']['*_DAYS_AGO'].replace(/__elapsed__/, elapsedDays);
+				}
+			} else if ((elapsedTime / millisencondsInAnHour) > 1) {
+				var elapsedHours;
+			
+				elapsedHours = Math.floor((elapsedTime / millisencondsInAnHour));
+				if (elapsedHours == 1) {
+					result = Clipperz.PM.Strings['elapsedTimeDescriptions']['ABOUT_AN_HOUR_AGO'];
+				} else {
+					result = Clipperz.PM.Strings['elapsedTimeDescriptions']['*_HOURS_AGO'].replace(/__elapsed__/, elapsedHours);
+				}
+			} else {
+				var elapsed10Minutes;
+			
+				elapsed10Minutes = (Math.floor((elapsedTime / millisencondsInAMinute) / 10)) * 10;
+				if (elapsed10Minutes == 0) {
+					result = Clipperz.PM.Strings['elapsedTimeDescriptions']['JUST_A_FEW_MINUTES_AGO'];
+				} else {
+					result = Clipperz.PM.Strings['elapsedTimeDescriptions']['ABOUT_*_MINUTES_AGO'].replace(/__elapsed__/, elapsed10Minutes+"");
+				}
+			}
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Main.js b/frontend/beta/js/Clipperz/PM/Main.js
new file mode 100644
index 0000000..9a068e1
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Main.js
@@ -0,0 +1,588 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+
+Clipperz.PM.VERSION = "0.1";
+Clipperz.PM.NAME = "Clipperz.PM";
+
+//#############################################################################
+
+Clipperz.PM.Main = function() {
+	this._loginPanel = null;
+	this._user = null;
+
+	this._isRunningCompact = false;
+	
+	Clipperz.NotificationCenter.register(null, 'userConnected', this, 'userConnectedCallback');
+	Clipperz.NotificationCenter.register(null, 'switchLanguage', this, 'switchLanguageHandler');
+
+	Clipperz.NotificationCenter.register(null, 'EXCEPTION', this, 'reportException');
+	
+	return this;
+}
+
+//=============================================================================
+
+MochiKit.Base.update(Clipperz.PM.Main.prototype, {
+	'toString': function() {
+		return "Clipperz.PM.Main";
+	},
+
+	'switchLanguageHandler': function() {
+//MochiKit.Logging.logDebug(">>> main.switchLanguageHandler");
+		YAHOO.ext.Element.get('donateHeaderIconLink').dom.href = Clipperz.PM.Strings['donateHeaderLinkUrl'];
+		YAHOO.ext.Element.get('donateHeaderLink').update(Clipperz.PM.Strings['donateHeaderLinkLabel']).dom.href = Clipperz.PM.Strings['donateHeaderLinkUrl'];
+		YAHOO.ext.Element.get('creditsHeaderLink').update(Clipperz.PM.Strings['creditsHeaderLinkLabel']).dom.href = Clipperz.PM.Strings['creditsHeaderLinkUrl'];
+		YAHOO.ext.Element.get('feedbackHeaderLink').update(Clipperz.PM.Strings['feedbackHeaderLinkLabel']).dom.href = Clipperz.PM.Strings['feedbackHeaderLinkUrl'];
+		YAHOO.ext.Element.get('helpHeaderLink').update(Clipperz.PM.Strings['helpHeaderLinkLabel']).dom.href = Clipperz.PM.Strings['helpHeaderLinkUrl'];
+		YAHOO.ext.Element.get('forumHeaderLink').update(Clipperz.PM.Strings['forumHeaderLinkLabel']).dom.href = Clipperz.PM.Strings['forumHeaderLinkUrl'];
+
+		if (YAHOO.ext.Element.get('logout') != null) {
+			YAHOO.ext.Element.get('logout').update(Clipperz.PM.Strings['logoutMenuLabel']);
+			YAHOO.ext.Element.get('lock').update(Clipperz.PM.Strings['lockMenuLabel']);
+
+			YAHOO.ext.Element.get('recordsTabAnchor').update(Clipperz.PM.Strings['recordMenuLabel']);
+			YAHOO.ext.Element.get('accountTabAnchor').update(Clipperz.PM.Strings['accountMenuLabel']);
+			YAHOO.ext.Element.get('dataTabAnchor').update(Clipperz.PM.Strings['dataMenuLabel']);
+//			YAHOO.ext.Element.get('contactsTabAnchor').update(Clipperz.PM.Strings['contactsMenuLabel']);
+			YAHOO.ext.Element.get('toolsTabAnchor').update(Clipperz.PM.Strings['toolsMenuLabel']);
+		}
+//MochiKit.Logging.logDebug("<<< main.switchLanguageHandler");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'fixToDrawTheMainTabsCorrectlyOnSafari': function() {
+		this.switchLanguageHandler();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'run': function(shouldShowRegistrationForm) {
+		var	mainElement;
+
+		Clipperz.NotificationCenter.register(null, 'updatedProgressState', this, 'updateProgressDialogStatus');
+
+		YAHOO.ext.Element.get('recordDetailEditModeHeaderMask').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide().unmask();
+		YAHOO.ext.Element.get('recordDetailEditModeVerticalMask').setVisibilityMode(YAHOO.ext.Element.DISPLAY).hide().unmask();
+		
+//MochiKit.Logging.logDebug(">>> Main.run");
+		mainElement = YAHOO.ext.Element.get('main');
+		if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+			YAHOO.ext.Element.get('applicationVersionType').dom.className = "readOnly";
+		}
+		mainElement.update("");
+
+		Clipperz.YUI.DomHelper.append(mainElement.dom, {tag:'ul', cls:'clipperzTabPanels', children:[
+			{tag:'li', id:'loginPanel'}
+		]})
+
+		this.setLoginPanel(new Clipperz.PM.Components.Panels.LoginPanel(YAHOO.ext.Element.get('loginPanel')));
+
+//MochiKit.Logging.logDebug("--- Main.run - selecting active form to show ...");
+		if (shouldShowRegistrationForm == true) {
+			this.loginPanel().showRegistrationForm(false);
+		} else {
+			this.loginPanel().showLoginForm(false);
+		}
+
+		this.switchLanguageHandler();
+//MochiKit.Logging.logDebug("--- Main.run - selecting active form to show. done.");
+//MochiKit.Logging.logDebug("<<< Main.run");
+	},
+
+	//-------------------------------------------------------------------------
+
+	'runCompact': function() {
+		this.setIsRunningCompact(true);
+		YAHOO.ext.Element.get(document.body).addClass("compact");
+		new Clipperz.PM.Components.Compact.LoginForm(YAHOO.ext.Element.get('mainDiv'));
+	},
+	
+	'showCompactInterface': function() {
+//MochiKit.Logging.logDebug(">>> main.showCompactInterface");
+		new Clipperz.PM.Components.Compact.CompactInterface(YAHOO.ext.Element.get('compactBody'), {user:this.user()});
+//MochiKit.Logging.logDebug("<<< main.showCompactInterface");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'mainPage': function() {
+		if (this._mainPage == null) {
+			this._mainPage = new Clipperz.PM.Components.MainPage();
+		}
+		
+		return this._mainPage;
+	},
+
+	//-------------------------------------------------------------------------
+	
+	'loginPanel': function() {
+		return this._loginPanel;
+	},
+	
+	'setLoginPanel': function(aValue) {
+		this._loginPanel = aValue;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'showMainPanels': function() {
+		var	mainElement;
+		var logoutBlock;
+		var lockBlock;
+		var menusTRElement;
+		
+		this.loginPanel().remove();
+		this.setLoginPanel(null);
+
+		logoutBlock = YAHOO.ext.Element.get('logoutLI');
+		Clipperz.YUI.DomHelper.append(logoutBlock.dom, {tag:'a', href:"#", id:'logout', htmlString:Clipperz.PM.Strings['logoutMenuLabel']});
+		MochiKit.Signal.connect('logout', 'onclick', this, 'doLogoutEventHandler');
+
+		lockBlock = YAHOO.ext.Element.get('lockLI');
+		Clipperz.YUI.DomHelper.append(lockBlock.dom, {tag:'a', href:"#", id:'lock', htmlString:Clipperz.PM.Strings['lockMenuLabel']});
+		MochiKit.Signal.connect('lock', 'onclick', this, 'doLockEventHandler');
+
+		menusTRElement = YAHOO.ext.Element.get('menusTR');
+		Clipperz.YUI.DomHelper.append(menusTRElement.dom, {tag:'td', id:'recordsTab', children:[{tag:'div', children:[{tag:'a', id:'recordsTabAnchor', htmlString:Clipperz.PM.Strings['recordMenuLabel']}]}]});
+		Clipperz.YUI.DomHelper.append(menusTRElement.dom, {tag:'td', id:'accountTab', children:[{tag:'div', children:[{tag:'a', id:'accountTabAnchor', htmlString:Clipperz.PM.Strings['accountMenuLabel']}]}]});
+		Clipperz.YUI.DomHelper.append(menusTRElement.dom, {tag:'td', id:'dataTab', children:[{tag:'div', children:[{tag:'a', id:'dataTabAnchor', htmlString:Clipperz.PM.Strings['dataMenuLabel']}]}]});
+//		Clipperz.YUI.DomHelper.append(menusTRElement.dom, {tag:'td', id:'contactsTab', children:[{tag:'div', children:[{tag:'a', id:'contactsTabAnchor', htmlString:Clipperz.PM.Strings['contactsMenuLabel']}]}]});
+		Clipperz.YUI.DomHelper.append(menusTRElement.dom, {tag:'td', id:'toolsTab', children:[{tag:'div', children:[{tag:'a', id:'toolsTabAnchor', htmlString:Clipperz.PM.Strings['toolsMenuLabel']}]}]});
+
+		mainElement = YAHOO.ext.Element.get('main');
+		mainElement.update("");
+		Clipperz.YUI.DomHelper.append(mainElement.dom, {tag:'ul', cls:'clipperzTabPanels', children:[
+			{tag:'li', id:'recordsPanel'},
+			{tag:'li', id:'accountPanel'},
+			{tag:'li', id:'dataPanel'},
+//			{tag:'li', id:'contactsPanel'},
+			{tag:'li', id:'toolsPanel'}
+		]}, true)
+
+		new Clipperz.PM.Components.TabPanel.TabPanelController({
+									name: 'mainTabPanel',
+									config:{	'recordsTab':'recordsPanel',
+												'accountTab':'accountPanel',
+												'dataTab':'dataPanel',
+//												'contactsTab':'contactsPanel',
+												'toolsTab':'toolsPanel'},
+									selectedTab:'recordsTab'
+		}).setUp();
+		
+		new Clipperz.PM.Components.Panels.MainPanel(YAHOO.ext.Element.get('recordsPanel'), {user:this.user()});
+		new Clipperz.PM.Components.Panels.AccountPanel(YAHOO.ext.Element.get('accountPanel'), {user:this.user()});
+		new Clipperz.PM.Components.Panels.DataPanel(YAHOO.ext.Element.get('dataPanel'), {user:this.user()});
+//		new Clipperz.PM.Components.Panels.ContactsPanel(YAHOO.ext.Element.get('contactsPanel'), {user:this.user()});
+		new Clipperz.PM.Components.Panels.ToolsPanel(YAHOO.ext.Element.get('toolsPanel'), {user:this.user()});
+
+		this.fixToDrawTheMainTabsCorrectlyOnSafari();	//	fix to
+//MochiKit.Logging.logDebug("<<< Main.showMainPanels");
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'userConnectedCallback': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> Main.userConnectedCallback");
+//MochiKit.Logging.logDebug(">>> doConnect - user: " + this.user());
+		this.setUser(anEvent.source());
+		
+		if (this.isRunningCompact()) {
+			this.showCompactInterface();
+		} else {
+			this.showMainPanels();
+		}
+//MochiKit.Logging.logDebug("<<< Main.userConnectedCallback");
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'user': function() {
+		return this._user;
+	},
+	
+	'setUser': function(aValue) {
+		this._user = aValue;
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'doLogoutEventHandler': function(anEvent) {
+		var deferred;
+		
+		anEvent.stop();
+
+		deferred = new MochiKit.Async.Deferred();
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("Main.doLogoutEventHandler - 1: " + res); return res;});
+		deferred.addCallback(MochiKit.Base.method(this.user(), 'doLogout'));
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("Main.doLogoutEventHandler - 2: " + res); return res;});
+		deferred.addCallback(Clipperz.PM.exit, 'logout.html');
+//deferred.addBoth(function(res) {MochiKit.Logging.logDebug("Main.doLogoutEventHandler - 3: " + res); return res;});
+		deferred.callback();
+	},
+
+	//-----------------------------------------------------------------------------
+	
+	'doLockEventHandler': function(anEvent) {
+		var	deferredResult;
+		var	lockDialogElement;
+		var lockDialog;
+		var unlockButton;
+
+		anEvent.stop();
+
+		Clipperz.NotificationCenter.notify(this, 'accountLocked', null, true);
+		
+		lockDialogElement = Clipperz.YUI.DomHelper.append(document.body, {tag:'div', id:'lockDialog', children:[
+			{tag:'div', cls:'ydlg-hd', htmlString:Clipperz.PM.Strings['lockTitle']},
+			{tag:'div', cls:'ydlg-bd', children:[
+				{tag:'div', cls:'alert-message', id:'lockMessage', children:[
+					{tag:'div', htmlString:Clipperz.PM.Strings['lockDescription']},
+					{tag:'form', id:'lockDialogForm', children:[
+						{tag:'input', type:'password', id:'lockPassphrase'}
+					]}
+				]}
+			]},
+			{tag:'div', cls:'ydlg-ft'}
+		]}, true);
+		new Clipperz.PM.Components.PasswordEntropyDisplay(YAHOO.ext.Element.get('lockPassphrase'));
+
+		lockDialog = new YAHOO.ext.BasicDialog(
+			lockDialogElement, { 
+				closable:false,
+				modal:true,
+				autoTabs:false,
+				resizable:false,
+				fixedcenter:true,
+				constraintoviewport:false,
+				width:350,
+				height:130,
+				shadow:true
+			}
+		);
+
+		unlockButton = lockDialog.addButton(Clipperz.PM.Strings['unlockButtonLabel'], MochiKit.Base.method(this, 'exitLock', lockDialog));
+//MochiKit.Logging.logDebug("--- Main.showAlertDialog - 5");
+		lockDialog.setDefaultButton(unlockButton);
+
+		MochiKit.Signal.connect('lockDialogForm', 'onsubmit', MochiKit.Base.method(this, 'exitLock', lockDialog));
+		lockDialog.on('show', function() {YAHOO.ext.Element.get('lockPassphrase').focus();});
+		lockDialog.show('main');
+//		this.user().lock();
+	},
+	
+	'exitLock': function(aLockDialog, anEvent) {
+//		var deferredResult;
+		
+//MochiKit.Logging.logDebug(">>> Exiting lock");
+		if (typeof(anEvent.stop) != 'undefined') {
+			anEvent.stop();
+		}
+		
+		if (this.user().passphrase() == YAHOO.ext.Element.get('lockPassphrase').dom.value) {
+			aLockDialog.hide(MochiKit.Base.method(aLockDialog, 'destroy', true));
+			Clipperz.NotificationCenter.notify(this, 'accountUnlocked', null, true);
+		} else {
+			YAHOO.ext.Element.get('lockPassphrase').dom.value = "";
+			YAHOO.ext.Element.get('lockPassphrase').focus();
+		}
+
+//		deferredResult = new MochiKit.Async.Deferred();
+//		deferredResult.addCallback(MochiKit.Base.method(this.user(), 'unlockWithPassphrase'));
+//		deferredResult.addCallback(MochiKit.Base.method(aLockDialog, 'hide', MochiKit.Base.method(aLockDialog, 'destroy', true)));
+//		deferredResult.addCallback(MochiKit.Base.method(Clipperz.NotificationCenter, 'notify', this, 'accountUnlocked', null, true));
+//		deferredResult.addErrback(function() {
+//			YAHOO.ext.Element.get('lockPassphrase').dom.value = "";
+//			YAHOO.ext.Element.get('lockPassphrase').focus();
+//		});
+//		deferredResult.callback(YAHOO.ext.Element.get('lockPassphrase').dom.value);
+
+		return false;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'updateProgressDialogStatus': function(anEvent) {
+//MochiKit.Logging.logDebug(">>> main.updateProgressDialogStatus - " + anEvent.parameters());
+//try {
+		if (Clipperz.Base.objectType(anEvent.parameters()) == 'string') {
+			Clipperz.PM.Components.MessageBox().update(Clipperz.PM.Strings.messagePanelConfigurations[anEvent.parameters()]());
+		} else {
+			Clipperz.PM.Components.MessageBox().update(anEvent.parameters());
+		}
+//} catch (exception) {
+//console.log("updateProgressDialogStatus - anEvent", anEvent);
+//	MochiKit.Logging.logError("Main.updateProgressDialogStatus: " + exception);
+//	throw exception;
+//}
+//MochiKit.Logging.logDebug("<<< main.updateProgressDialogStatus");
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'defaultErrorHandler': function(anErrorString, anException) {
+MochiKit.Logging.logDebug(">>> DEFAULT ERROR HANDLER: " + anErrorString + " (exception: " + Clipperz.Base.serializeJSON(anException) + ")");
+	},
+
+	//-----------------------------------------------------------------------------
+
+	'isRunningCompact': function() {
+		return this._isRunningCompact;
+	},
+	
+	'setIsRunningCompact': function(aValue) {
+		this._isRunningCompact = aValue;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'reportException': function(anError) {
+/*
+		var deferredResult;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+		
+		Clipperz.PM.Components.MessageBox().show(
+			{
+				title:Clipperz.PM.Strings['fatalErrorMessageTitle'],
+				text:Clipperz.PM.Strings['fatalErrorMessageText'],
+				width:240,
+				showProgressBar:false,
+				showCloseButton:false,
+				fn:MochiKit.Base.method(deferredResult, 'callback'),
+				scope:this,
+				buttons:{
+					'ok':	Clipperz.PM.Strings['fatalErrorMessageCloseButtonLabel']
+				}
+			}
+		);
+
+		deferredResult.addCallback(function() {
+			window.document.body.innerHTML = "";
+			window.location.reload(true);
+		});
+*/
+		Clipperz.PM.exit('error.html');
+	},
+	
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
+
+
+//#############################################################################
+
+MochiKit.Base.update(Clipperz.PM, {
+
+	__repr__: function() {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+	
+	toString: function() {
+		return this.__repr__();
+	},
+
+	//-----------------------------------------------------------------------------
+	
+	'initPage': function() {
+		var	main;
+		var shouldShowRegistrationForm;
+		var useCompactDesign;
+		
+//MochiKit.Logging.logWarning("Just testing logging system");
+		Clipperz.PM.Strings.Languages.initSetup();
+//		DWRUtil.useLoadingMessage(Clipperz.PM.Strings['DWRUtilLoadingMessage']);
+
+		if (window.location.search.indexOf("registration") != -1) {
+			shouldShowRegistrationForm = true;
+		} else {
+			shouldShowRegistrationForm = false;
+		}
+
+		if (window.location.search.indexOf("compact") != -1) {
+			useCompactDesign = true;
+		} else {
+			useCompactDesign = false;
+		}
+		
+		main = new Clipperz.PM.Main();
+
+		if (useCompactDesign == true) {
+			main.runCompact();
+		} else {
+			if (Clipperz_IEisBroken === true) {
+				if (Clipperz.PM.Proxy.defaultProxy.isReadOnly()) {
+					var logoParentNode;
+					
+					YAHOO.ext.Element.get('donateHeaderIcon').remove();
+					logoParentNode = YAHOO.ext.Element.get('logo').dom.parentNode;
+					YAHOO.ext.Element.get('logo').remove();
+					Clipperz.YUI.DomHelper.append(logoParentNode, {tag:'span', children:[
+						{tag:'span', cls:'clipperzLogoSpan', html:'clipper'},
+						{tag:'span', cls:'clipperzLogoZSpan', html:'z'}
+					]})
+				} else {
+					YAHOO.ext.Element.get('donateHeaderIcon').dom.src = "./images/smiles.gif";
+					YAHOO.ext.Element.get('logo').dom.src = "./images/logo.gif";
+				}
+			} else {
+				YAHOO.ext.Element.get('donateHeaderIcon').dom.src = "data:image/gif;charset=utf-8;base64,R0lGODlhEAAQAPf/ADMzZvrFL/KbGPrER3VXJeaJHvnGXNJ/KAEAAPnKefvJDamopMvLy8GZEfrTpvvgwGhVB0xKSO3BDUk+A/vYqnVgLcmndoRqM/exO3hrS3lmPYRsB39lDum9Dv3aCuebVPnIdP////3cCvewE07BafrQk/rHG1tYR5qZl7eUWZl7CfnGjdeuDPnCPpl4LDEoA5R2OP3XC/jBgfi2EvrXrvrRlWpYHgGtKdiqKPvfvu6nFzTNWfexFv7gCEc4GPrFDvaqFJmDB/euE/vYrJV5SfzUC7uTIuCxDf8AAPrHX519EbONGLubCvvYqzsxA/42AwaIGPzTC9u8CfTALlRUUomJiACWHaaMCsmeJFBFBZ5wUtaRVGlOVrySGLBvPNaBKsSGU9OOUbF7VPOycaRxUaFzWfGtaLZ6L+CaHcZ/Kt6YHVxJXfvXqaGhn0A8Z/i8c7JwM7d4MP6SBrJtM21MUDs4ZT84YmFhYaBnPqtyNM2QW6t2Va18XfvWsPvZsmVOXUQ7X86CJ1ZDWzo2Y6FoOfzSDBMPB/rTqW1OT0I5YEQ9ZnVTS1pEV9iCI7x+Ljw4ZvnJlqNnOfeyUfnMi/CkSfnKhAOmJ/WqU/ewJmVUO6qRB3ljHOGzFvauSfnFWveuI/esFK2JE5iVifrEEA+uJ/K+RayHMYVvTsyiE3NxbnBdQl5KG+cAAPnBIQYFA8GXN82hJbWXa6WDEQgGBFNBGMKeC4iFeZiiGdTZ1aqgd1dTPF9fX4R1BHReOOi9cdmsUn9xBKKFIWVPG5J0FLmzmcLCwtK5B6eQcnx5doZrFPnAH6eFP/fDL1RLBYVsQW5raMXGEFA5E+rLoUQEAG0kA8ONCteZId6wF86tCJ0AAGFQBurKn6mJHks/A2tZQOKfIHFua+29Wum1OOzv7LysCN3i3s/Rz/DDdeOyKCckHxQTEDsuEUIvEI1EBfP29KuIQbqUR9O7CbnCER8ZCSIeGDQJADQXAaCVaKeCGUNAPFRGMpmJS1xIF/rELPXARv///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQFZAD/ACwAAAAAEAAQAAAI+AABCASwhkyYDx+27PkzcGCdMmZWOOjT5xCkMXwUDXwERgaNHA9CPsjhZ4UeNwK1vHEwpAmFlxSaDGEjQwwAQZQq1aihKlaJEhYylagx6RIXPJ1AJEjgSsNSIrOWJpDk5QAGT0mSIKiQFQaCrAYwfCnwqUWpAatMDRjwitYAfy0wFSgwQhksZgHy6mWGpRWPAgdGjEKlxIThw7IajBrRKBIQBQpUaGMiQUItbSogA5nDSMCPIlGudHPiZEKQKEV+CKADgJCQQh5iy44dZQQcgXbSzCjSo7fvGDMCJRo4KA8oBTFEiIihQEgcQA0FIjqjRocONI4WNQwIACH5BAVkAP8ALAEABAANAAkAAAhaAP8J1GehhMASBgUqREAExLkUEFMoFOgDXpJwFzLCUChuwL8BHj8O8OeRRxd0ASbiwBKgn8AjHK5N5AQB1bUjAmt128BCIIssL3gqlALBiUAnGyRMFChiqcKAACH5BAVkAP8ALAEABAANAAoAAAhzAP8JrKEqlkALmQQq/JfAlYYECYjMSrDwXxIEFZIkgYEgicIWAleZEviK1gCBI/7BqhggwD8cS/4tEVWBg5JQoZRwsGEr2D8JuUKYa1OlCopiIYgdEchEVIinUBdcWahJFwoGDNqcCFLxnxRezbIAM6YwIAAh+QQFZAD/ACwCAAMADAAMAAAIeQD//ZN2TOC/bQUN/st06pRAhg4NOuvlS+DEigZ/LbsgUCNHgwSEuRAYcuS/JUam4FCIg5kRfF3anNqUbNiwZJs0oOCmYN8/d+VwmcM17t89Cf+kaCCxo+kOEhmwGYwHxYpVK1DIKYR2o2tXS/IU3rpBqiwpS7cEBgQAIfkEBWQA/wAsAgADAAwADAAACH4A//0b0kTgPwoFDf6roSqWQAuZSihM4EqDQCKzEihMgqCCQBgIkhgsNWCVKYGvaA3w908Zln8BFMbE0moUKiUmcuqU1WDUPwUqtDHp0KEatXYKFPwrUkRTN3v1pmV7UsSgBw8x5CBhxeqJwiI9wsp58kSOQlAKYlyNoWCEwIAAIfkEBWQA/wAsAQAEAA4ACwAACIwACURIhQxcBG8a8j1DlooKAXpUdt3ZFUGdoQgS71BJFw2Bx38IYLxDANIju2/C5hla5+LfP1M+DM3jZ+1fF1gBXOr8FwDHEpdLRFXgoCRUKCUcbNgK5lJCrhDm2lSpgqJYCGJHdDIRFaKr1wVXdv7TpAsFAwZtTgQR61IKr2ZZgBmLwVanCBEuhegMCAA7Cg==";
+				YAHOO.ext.Element.get('logo').dom.src = "data:image/gif;charset=utf-8;base64,R0lGODlhgwAoAPf/AP////+SAIKCmV1df3l5jYmhef//9vr6+YSQrJSguNfk60xMZjw8bf+PAI2Zsq6ulTU1ZZqasrzE05Gdtf//90pHW6d4KuPj6cLCz6ampzw3Ymt9nXp6Z21tif+MAHV1mPaOBJGRrPLy8dPT21Zhifb2+H19j/z8+MmOG3V/n729zcnJ1jU1aLmKIsnb5M3O2Xe5y3JyjHZqRD1xlElJd7KyuPSSBGFhhPn59kFBcKiovIaGov+KAP7+/sDA0HZ2mKqtwV5fh6y1yMTM2X19nXuCoTg5al1MUdTV4O3u8jU8bTMzZv+OAIt6Nfz8/G5ukldTVF5egv///nFxlJ2eeFFRfPX18cN/HpOTanV1lLOzp3l5m1dXesXF1O7u7MOPHj4+YaWltdXV1WJqj4ODdU1NeZWVZNaSFff39WFmjEtQfP+GAPSGBenq77q6ym1thP//+3l5kX5+kIOiubx8IpyCMf3//8nJ0eHh20JMedHRwVJSeba2yEJyPsaDHVhYffT+/llag4uNqcTE0T4+bvDw7dra4v7///n//6GhuGZojTw8a/r6+/z89OLy9ZWVr8mMG9ra1t/f5zo6ZUNEcjs7bPHx9dzc34iVsE5Od319mZ2dbUZJd2hoh4xsOf398mBhiP39/ZmZkmtrkKOmvK7B0T9Bb77H1evr2c2PGX2Ipn1YQT9RbOrq56bR3Y2NgLrV35mZZ+yOCqmptZiYmN/fx7OzxTY+YFJXgVFchdnZvsLE08jI0ztcTeCLEPuVAv2QAIqSrZietlJUbGpqYYWFWWdlSKKlepajukJvQMbI1kZhiURukj09ZlNUf5mwxOHhxFxchVtehoaOqoqKZv39+HF5mnR6m5OZsj8/bDQ0ZzQzZuzs6vr67MDAyUhIdGpqj+np0IqZstfY4o+btI6dtv2NAPf353ibtGJcTtWJEDJIdrPD0u/9/ufo7ZWiuZWjulVVdeLi6Nvb5N3d4oiIcIyMecLC0XWAoGVlfpCQmGCctXR3mXh4W2lukv///yH5BAEAAP8ALAAAAACDACgAAAj/AP8JHEiwoMGDCBMqXMiwocOHECNKnEixosWLGDNq3Mixo8ePIEOKHEmypMmTKFOqXMmyZcktLwZ1wRBF4I+YM2+43IlRWI8eAKrFEIgNANBqcXgqpfgOgFMDBAROcAqAgpylWCEmoApVIDyqVrOKZbj1adR/RbqoHdRprFuEZQF0fes2yIcfH55QOhh37sMcU378eMLAIaEngp8QYhjt7gdFRh5W+fCBVUcWIVaUoCplnopoBfueLbKiNK8OAkmXngVhzjjOSIQtKnit9Ioa/9Ah4TwuUbaDLAQp20z1RYTIBP3Z9sbClBB3Tgs0gYSiuvXrKCCla6jmBdXvTp1Q/yEoWiAysCakOpXS5hQi8E51LSCIab0lCe/h15pPMI8r+OuNkAlBRVAlAi4ufEcFJGt44OCDEHqwhgwM0aBAD4cASNUrA5X3z1ROUZDePw5oCN8IhQmEwHeHZAigITkMtM4FJgIgRSR7CZQCVSW0YYeLACzYIIRMBGCkkR5QuBAQ35XABxHiwPJdEvEI5CGIVY1Y4nehuLHDIyOAJ8BAK4Knwg4heMfZDgMJ8Z0kiXyQCHRO9RDGQDtqeMgxTXzhp58tnNHAkQFMuBAngFDVyJgCKXHKd8VYydVZWIoo0JZOhaLJQEbA8F0kZH7XA5sCsQADUE7hIdAyB6CqxzdLxP+qhgJUWZFinpxh8MEoHwxzUAvmHOlBKhUoxEk5VMHxQEEzcPaIpGapF6KWVPWwLEFKtFGrTv+UaaMWBWlDo1M4tLXPeiIsEOu6G9hRZz06fgfHnQktYUGwSJ4BxkK5lEJVKFVi+8QUU3xQBbRyUYrepf9yYBApLkpBhorVOlyQMJzZo80QVBWywxZEhLwFOe5+Gy9VYsyWkCfAAGNkA74Uu1AaElDVzb5kTSptlgw7xc0eBinCmRkUO2XFHwYF8V0sRjhSo6hunOzUMQrJMOiRNhzRECg+UIUKzgtduTCJVF2QI0FCU0V0t1S1QYNBoHy3CQu0Pk2VClJLIUpCxoD/cHUAHqziEM1UnQO2QmJP2zMAPxuUxndreysCFwZJI3fTVJ3Aiwo+dO655/pIfQBqB/Viw98NePIQCexkzt9AlAChwuykJs4z2eQOVZC3AFBTNAAnJFWQKt9hoQ0SLuJRSUO4jn7QEWwQ6kEdEKnxDJARFDRGok7t/Y/tluLu1CwF0U0VI7rzjhtBLCQYXlJzKFpTQSCHPH/zpBNUgTrSUw+REYFAFQBEQIyBMIBjVOkHwuZSKWpRBQdZIMgjnEAVaEzidwA4wKYGIghGUCUcF2wWVXiRon9oAwE/AgAczoK/gtzCDx44UgMsAIGCbKMh/qLKJ0LwASIYgjOXSBH4/xz4Lx1QRgXgoUWo5AUEyvCBSxkYCAKdIo8dUGYXJQOAHvBEFecRpA88IFQA/ECHK5jxjHSQWULyIImnweENHdLZh8aGqaeJoYS8q9ElYiQQErTjaZ/IBxed4sWBgFGMf5PhL6DAEGeMI4vgScIWCNKUaH0PLFcRHxruoCF6IG2JAMDBHQT4HXnMbyDMkIeJLDGxgeBjPaHIn0AOKcZaBsAGjGQIJQThjlaFpwQ6+ORAglGCYlqBdNMoZgmsoDtMteIbH7iABwHgBGC+jSDeKkQZniCJaYaiBEAow0Fo8Igk+JKaViBFIApiDWWKoC0ESQYbQEDPetqznrLIZUOMQIEDcExhC9EoIfsYQFAGsKBUBTXo4gpBOSM4IzBBWIxBJDeAfxihCoEBBR8TUokyjKJggWgGcBJ6UIJAQAMoTalKV1pDlmDKC5RrCEXpwpOXxpQhM6WpS2zqkJzqlCVYOppD6kOuU/5UJfwYxOxs8Q2HTOEes+ODOI9K1apa9aoLCQgAOwo=";
+			}
+			
+			main.run(shouldShowRegistrationForm);
+		}
+		
+		Clipperz.PM.defaultErrorHandler = main.defaultErrorHandler;
+		
+		//	DEBUG
+		if ((typeof(_clipperz_pm_test_user) != 'undefined') && (typeof(_clipperz_pm_test_passphrase) != 'undefined')) {
+//------- automatic login with test/test --------------			
+//			Clipperz.PM.Proxy.defaultProxy = new Clipperz.PM.Proxy.Offline();
+//MochiKit.Logging.logWarning("activating AUTOLOGIN (" + _clipperz_pm_test_user + "/" + _clipperz_pm_test_passphrase + ")");
+//			MochiKit.Async.callLater(0.9, MochiKit.Base.bind(main.doLogin, main), _clipperz_pm_test_user, _clipperz_pm_test_passphrase, YAHOO.ext.Element.get('Clipperz_PM_Components_Panels_login_submit_9'));
+			MochiKit.Async.callLater(0.5, MochiKit.Base.bind(main.loginPanel().doLoginWithUsernameAndPassphrase, main.loginPanel()), _clipperz_pm_test_user, _clipperz_pm_test_passphrase);
+//------- automatic registration --------------			
+//MochiKit.Logging.logWarning("Testing registration (user,passwd)");
+//MochiKit.Logging.logDebug("mainPanel: " + main.mainPage().mainPanel().content());
+//			main.mainPage().getActivePanel().showRegistrationFormAnimator().play();
+//			MochiKit.Async.callLater(1.9, MochiKit.Base.bind(main.doRegistration, main), 'user', 'passwd');
+//-------------------------------------
+//			main.showMainPanels('ok');
+		};
+
+		if 	(/fastEntropyAccumulationForTestingPurpose/.test(window.location.search)) {
+			Clipperz.Crypto.PRNG.defaultRandomGenerator().fastEntropyAccumulationForTestingPurpose();
+		}
+
+//		Clipperz.PM.Proxy.defaultProxy.knock();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'showDonationSplashScreen': function(aUser, aFocusElementId) {
+		var deferredResult;
+		var donateElement;
+		var	donateDialog;
+		var closeButton;
+		var closeFunction;
+		var donateButton;
+		var donateFunction;
+
+		deferredResult = new MochiKit.Async.Deferred();
+
+//MochiKit.Logging.logDebug(">>> Main.showRegistrationSplashScreen");
+		donateElement = Clipperz.YUI.DomHelper.append(document.body, {tag:'div', id:'donateSplash', children:[
+			{tag:'div', cls:'ydlg-hd', htmlString:Clipperz.PM.Strings['donateSplashPanelTitle']},
+			{tag:'div', cls:'ydlg-bd', children:[
+				{tag:'div', cls:'alert-message', id:'donateMessage', children:[
+					{tag:'div', cls:'donateSplashPanelIcon', children:[
+						{tag:'img', src:Clipperz.PM.Strings['donateSplashPanelIconUrl']}
+					]},
+					{tag:'div', cls:'donateSplashPanelDescription', htmlString:Clipperz.PM.Strings['donateSplashPanelDescription']}
+				]}
+			]},
+			{tag:'div', cls:'ydlg-ft'}
+		]}, true);
+
+		donateDialog = new YAHOO.ext.BasicDialog(
+			donateElement, { 
+				closable:false,
+				modal:true,
+				autoTabs:false,
+				resizable:false,
+				fixedcenter:true,
+				constraintoviewport:false,
+				width:450,
+				height:220,
+				shadow:true,
+				minWidth:300,
+				minHeight:300
+			}
+		);
+	
+		closeFunction = MochiKit.Base.partial(deferredResult.callback, false);
+		donateFunction = MochiKit.Base.partial(deferredResult.callback, true);
+		donateButton = donateDialog.addButton(Clipperz.PM.Strings['donateDonateButtonLabel'], donateFunction, deferredResult);
+
+		donateDialog.addKeyListener(27, closeFunction, deferredResult);
+		closeButton = donateDialog.addButton(Clipperz.PM.Strings['donateCloseButtonLabel'], closeFunction, deferredResult);
+
+		donateDialog.setDefaultButton(donateButton);
+		donateDialog.show(aFocusElementId /*'recordListAddRecordButton'*/);
+
+		deferredResult.addCallback(MochiKit.Base.bind(function(shouldOpenDonatePage) {
+			var result;
+			
+			if (shouldOpenDonatePage) {
+				window.open(Clipperz.PM.Strings['donateHeaderLinkUrl'], "donate");
+				aUser.preferences().setShouldShowDonationPanel(false);
+				aUser.preferences().saveChanges();
+			}
+		}, this));
+		deferredResult.addBoth(MochiKit.Base.method(donateDialog, 'hide'));
+		deferredResult.addBoth(MochiKit.Base.method(donateElement, 'remove'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Main.showDonationSplashScreen - 2: " + res); return res;});
+//MochiKit.Logging.logDebug("<<< Main.showRegistrationSplashScreen");
+		
+		return deferredResult;
+	},
+	
+	//-----------------------------------------------------------------------------
+
+	'exit': function(aPageName) {
+//		alert("ERROR: " + aPageName);
+
+//		YAHOO.ext.Element.get('menus').update("");
+//		YAHOO.ext.Element.get('logoutLI').update("");
+//		YAHOO.ext.Element.get('lockLI').update("");
+//		YAHOO.ext.Element.get('main').update("");
+//		Clipperz.YUI.DomHelper.append('main', {tag:'div', id:'exitBlock', children:Clipperz.PM.Strings['exitConfig']});
+		
+		MochiKit.Async.wait(0).addCallback(function() {
+//			window.location.href = "http://www.google.com/search?hl=" + Clipperz.PM.Strings.preferredLanguage + "&q=phishing&btnI=Google+Search";
+			window.location.href = "./" + aPageName;
+		});
+	},
+
+	//-----------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
+//#############################################################################
+
+//Clipperz.PM.SerializeAsyncCalls = function(aDelay, aFunction) {
+//	aFunction.apply(extend(null, arguments, 1));
+//};
+
+MochiKit.DOM.addLoadEvent(Clipperz.PM.initPage);
diff --git a/frontend/beta/js/Clipperz/PM/Proxy.js b/frontend/beta/js/Clipperz/PM/Proxy.js
new file mode 100644
index 0000000..d05a5e0
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Proxy.js
@@ -0,0 +1,173 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+
+//=============================================================================
+
+Clipperz.PM.Proxy = function(args) {
+	args = args || {};
+
+	this._shouldPayTolls = args.shouldPayTolls || false;
+
+	this._tolls = {
+		'CONNECT':	[],
+		'REGISTER':	[],
+		'MESSAGE':	[]
+	};
+
+	if (args.isDefault === true) {
+		Clipperz.PM.Proxy.defaultProxy = this;
+	}
+
+	return this;
+}
+
+Clipperz.PM.Proxy.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "Clipperz.PM.Proxy";
+	},
+
+	//=========================================================================
+
+	'shouldPayTolls': function() {
+		return this._shouldPayTolls;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'tolls': function() {
+		return this._tolls;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'payToll': function(aRequestType, someParameters) {
+		var	deferredResult;
+
+//console.log(">>> Proxy.payToll", aRequestType, someParameters);
+		if (this.shouldPayTolls()) {
+			deferredResult = new MochiKit.Async.Deferred();
+
+			if (this.tolls()[aRequestType].length == 0) {
+				deferredResult.addCallback(MochiKit.Base.method(this, 'sendMessage', 'knock', {requestType:aRequestType}));
+				deferredResult.addCallback(MochiKit.Base.method(this, 'setTollCallback'));
+			}
+			deferredResult.addCallback(MochiKit.Base.method(this.tolls()[aRequestType], 'pop'));
+			deferredResult.addCallback(MochiKit.Base.methodcaller('deferredPay'));
+			deferredResult.addCallback(function(aToll) {
+				var result;
+			
+				result = {
+					parameters: someParameters,
+					toll: aToll
+				}
+				
+				return result;
+			});
+		
+			deferredResult.callback();
+		} else {
+			deferredResult = MochiKit.Async.succeed({parameters:someParameters});
+		}
+//console.log("<<< Proxy.payToll");
+
+		return deferredResult;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'addToll': function(aToll) {
+//console.log(">>> Proxy.addToll", aToll);
+		this.tolls()[aToll.requestType()].push(aToll);
+//console.log("<<< Proxy.addToll");
+	},
+
+	//=========================================================================
+
+	'setTollCallback': function(someParameters) {
+//console.log(">>> Proxy.setTollCallback", someParameters);
+		if (typeof(someParameters['toll']) != 'undefined') {
+//console.log("added a new toll", someParameters['toll']);
+			this.addToll(new Clipperz.PM.Toll(someParameters['toll']));
+		}
+//console.log("<<< Proxy.setTallCallback", someParameters['result']);
+		//return someParameters['result'];
+		return someParameters;
+	},
+
+	//=========================================================================
+
+	'registration': function (someParameters) {
+		return this.processMessage('registration', someParameters, 'REGISTER');
+	},
+
+	'handshake': function (someParameters) {
+		return this.processMessage('handshake', someParameters, 'CONNECT');
+	},
+
+	'message': function (someParameters) {
+		return this.processMessage('message', someParameters, 'MESSAGE');
+	},
+
+	'logout': function (someParameters) {
+		return this.processMessage('logout', someParameters, 'MESSAGE');
+	},
+
+	//=========================================================================
+
+	'processMessage': function (aFunctionName, someParameters, aRequestType) {
+		var	deferredResult;
+
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(this, 'payToll', aRequestType));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'sendMessage', aFunctionName));
+		deferredResult.addCallback(MochiKit.Base.method(this, 'setTollCallback'));
+		deferredResult.callback(someParameters);
+		
+		return deferredResult;		
+	},
+
+	//=========================================================================
+
+	'sendMessage': function () {
+		throw Clipperz.Base.exception.AbstractMethod;		
+	},
+
+	//=========================================================================
+
+	'isReadOnly': function () {
+		return false;
+	},
+
+	//=========================================================================
+	__syntaxFix__: "syntax fix"
+	
+});
diff --git a/frontend/beta/js/Clipperz/PM/Proxy/Proxy.JSON.js b/frontend/beta/js/Clipperz/PM/Proxy/Proxy.JSON.js
new file mode 100755
index 0000000..889e1f1
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Proxy/Proxy.JSON.js
@@ -0,0 +1,100 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+
+//=============================================================================
+
+Clipperz.PM.Proxy.JSON = function(args) {
+	Clipperz.PM.Proxy.JSON.superclass.constructor.call(this, args);
+
+	this._url = args.url || Clipperz.Base.exception.raise('MandatoryParameter');
+	
+	return this;
+}
+
+YAHOO.extendX(Clipperz.PM.Proxy.JSON, Clipperz.PM.Proxy, {
+
+	'toString': function() {
+		return "Clipperz.PM.Proxy.JSON";
+	},
+
+	//=========================================================================
+
+	'url': function () {
+		return this._url;
+	},
+
+	//=========================================================================
+	
+	'sendMessage': function(aFunctionName, someParameters) {
+		var	deferredResult;
+		var parameters;
+		
+		parameters = {
+			method: aFunctionName,
+//			version: someParameters['version'],
+//			message: someParameters['message'],
+			parameters: Clipperz.Base.serializeJSON(someParameters)
+		};
+
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(function (aValue) {
+			MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'remoteRequestSent');
+			return aValue;
+		});
+		deferredResult.addCallback(MochiKit.Async.doXHR, this.url(), {
+			method:'POST',
+			sendContent:MochiKit.Base.queryString(parameters),
+			headers:{"Content-Type":"application/x-www-form-urlencoded"}
+		});
+		deferredResult.addCallback(function (aValue) {
+			MochiKit.Signal.signal(Clipperz.Signal.NotificationCenter, 'remoteRequestReceived');
+			return aValue;
+		});
+//		deferredResult.addCallback(MochiKit.Async.evalJSONRequest);
+		deferredResult.addCallback(MochiKit.Base.itemgetter('responseText'));
+		deferredResult.addCallback(Clipperz.Base.evalJSON);
+		deferredResult.addCallback(function (someValues) {
+			if (someValues['result'] == 'EXCEPTION') {
+				throw someValues['message'];
+			}
+			
+			return someValues;
+		})
+//			return MochiKit.Base.evalJSON(req.responseText);
+		deferredResult.callback();
+
+		return deferredResult;
+	},
+
+	//=========================================================================
+	__syntaxFix__: "syntax fix"
+	
+});
diff --git a/frontend/beta/js/Clipperz/PM/Proxy/Proxy.Offline.DataStore.js b/frontend/beta/js/Clipperz/PM/Proxy/Proxy.Offline.DataStore.js
new file mode 100644
index 0000000..4d3ba08
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Proxy/Proxy.Offline.DataStore.js
@@ -0,0 +1,804 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+try { if (typeof(Clipperz.PM.Proxy.Offline) == 'undefined') { throw ""; }} catch (e) {
+	throw "Clipperz.PM.Proxy.Offline.DataStore depends on Clipperz.PM.Proxy.Offline!";
+}  
+
+//=============================================================================
+
+Clipperz.PM.Proxy.Offline.DataStore = function(args) {
+	args = args || {};
+	
+	this._data = args.data || (typeof(_clipperz_dump_data_) != 'undefined' ? _clipperz_dump_data_ : null);
+	this._isReadOnly = (typeof(args.readOnly) == 'undefined' ? true : args.readOnly);
+	this._shouldPayTolls = args.shouldPayTolls || false;
+
+	this._tolls = {};
+	this._connections = {};
+
+	this._b = null;
+	this._B = null;
+	this._A = null;
+	this._userData = null;
+
+	return this;
+}
+
+//Clipperz.Base.extend(Clipperz.PM.Proxy.Offline.DataStore, Object, {
+Clipperz.PM.Proxy.Offline.DataStore.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+
+	'isReadOnly': function () {
+		return this._isReadOnly;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'shouldPayTolls': function() {
+		return this._shouldPayTolls;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'data': function () {
+		return this._data;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'tolls': function () {
+		return this._tolls;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'connections': function () {
+		return this._connections;
+	},
+
+	//=========================================================================
+
+	'resetData': function() {
+		this._data = {
+			'users': {
+				'catchAllUser': {
+					__masterkey_test_value__: 'masterkey',
+					s: '112233445566778899aabbccddeeff00112233445566778899aabbccddeeff00',
+					v: '112233445566778899aabbccddeeff00112233445566778899aabbccddeeff00'
+				}
+			}
+		};
+	},
+
+	//-------------------------------------------------------------------------
+
+	'setupWithEncryptedData': function(someData) {
+		this._data = Clipperz.Base.deepClone(someData);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'setupWithData': function(someData) {
+		var deferredResult;
+		var resultData;
+		var i, c;
+
+//Clipperz.log(">>> Proxy.Test.setupWithData");
+		resultData = this._data;
+
+		deferredResult = new MochiKit.Async.Deferred();
+		c = someData['users'].length;
+
+		for (i=0; i<c; i++) {
+			var	newConnection;
+			var	recordConfiguration;
+
+			deferredResult.addCallback(MochiKit.Base.method(this, 'userSerializedEncryptedData', someData['users'][i]));
+			deferredResult.addCallback(MochiKit.Base.bind(function(aUserSerializationContext) {
+//console.log("SERIALIZED USER", aUserSerializationContext);
+				resultData['users'][aUserSerializationContext['credentials']['C']] = {
+					's':		aUserSerializationContext['credentials']['s'],
+					'v':		aUserSerializationContext['credentials']['v'],
+					'version':				aUserSerializationContext['data']['connectionVersion'],
+					'userDetails':			aUserSerializationContext['encryptedData']['user']['header'],
+					'userDetailsVersion':	aUserSerializationContext['encryptedData']['user']['version'],
+					'statistics':			aUserSerializationContext['encryptedData']['user']['statistics'],
+					'lock':					aUserSerializationContext['encryptedData']['user']['lock'],
+					'records': 				this.rearrangeRecordsData(aUserSerializationContext['encryptedData']['records'])
+				}
+			}, this));
+		}
+		
+		deferredResult.addCallback(MochiKit.Base.bind(function() {
+//console.log("this._data", resultData);
+			this._data = resultData;
+		}, this));
+		
+		deferredResult.callback();
+//Clipperz.log("<<< Proxy.Test.setupWithData");
+
+		return deferredResult;
+	},
+
+	//=========================================================================
+
+	'b': function() {
+		return this._b;
+	},
+
+	'set_b': function(aValue) {
+		this._b = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'B': function() {
+		return this._B;
+	},
+
+	'set_B': function(aValue) {
+		this._B = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'A': function() {
+		return this._A;
+	},
+
+	'set_A': function(aValue) {
+		this._A = aValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'userData': function() {
+		return this._userData;
+	},
+	
+	'setUserData': function(aValue) {
+		this._userData = aValue;
+	},
+
+	//=========================================================================
+
+	'getTollForRequestType': function (aRequestType) {
+		var	result;
+		var	targetValue;
+		var cost;
+		
+		targetValue = Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(32).toHexString().substring(2);
+		switch (aRequestType) {
+			case 'REGISTER':
+				cost = 5;
+				break;
+			case 'CONNECT':
+				cost = 5;
+				break;
+			case 'MESSAGE':
+				cost = 2;
+				break;
+		}
+		
+		result = {
+				requestType: aRequestType,
+				targetValue: targetValue,
+				cost: cost
+		}
+
+		if (this.shouldPayTolls()) {
+			this.tolls()[targetValue] = result;
+		}
+
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'checkToll': function (aFunctionName, someParameters) {
+		if (this.shouldPayTolls()) {
+			var localToll;
+			var	tollParameters;
+			
+			tollParameters = someParameters['toll'];
+			localToll = this.tolls()[tollParameters['targetValue']];
+			
+			if (localToll != null) {
+				if (! Clipperz.PM.Toll.validate(tollParameters['targetValue'], tollParameters['toll'], localToll['cost'])) {
+					throw "Toll value too low.";
+				};
+			} else {
+				throw "Missing toll";
+			}
+		}
+	},
+
+	//=========================================================================
+	
+	'processMessage': function(aFunctionName, someParameters) {
+		var result;
+
+		switch(aFunctionName) {
+			case 'knock':
+				result = this._knock(someParameters);
+				break;
+			case 'registration':
+				this.checkToll(aFunctionName, someParameters);
+				result = this._registration(someParameters.parameters);
+				break;
+			case 'handshake':
+				this.checkToll(aFunctionName, someParameters);
+				result = this._handshake(someParameters.parameters);
+				break;
+			case 'message':
+				this.checkToll(aFunctionName, someParameters);
+				result = this._message(someParameters.parameters);
+				break;
+			case 'logout':
+				result = this._logout(someParameters.parameters);
+				break;
+		}
+
+		return result;
+	},
+
+	//=========================================================================
+
+	'_knock': function(someParameters) {
+		var result;
+		
+		result = {
+			toll: this.getTollForRequestType(someParameters['requestType'])
+//			toll: {
+//				requestType: someParameters['requestType'],
+//				targetValue: "3a1ba0be23580f902885c6c8a6b035e228ed1ca74d77de5f9bb0e0c899f07cfe",
+//				cost: 
+//			}
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'_registration': function(someParameters) {
+//console.log("_registration", someParameters);
+		if (this.isReadOnly() == false) {
+			if (typeof(this.data()['users'][someParameters['credentials']['C']]) == 'undefined') {
+				this.data()['users'][someParameters['credentials']['C']] = {
+					's':		someParameters['credentials']['s'],
+					'v':		someParameters['credentials']['v'],
+					'version':	someParameters['credentials']['version'],
+	//				'lock':		someParameters['user']['lock'],
+					'lock':		Clipperz.Crypto.Base.generateRandomSeed(),
+	//				'maxNumberOfRecords':	'100',
+					'userDetails':			someParameters['user']['header'],
+					'statistics':			someParameters['user']['statistics'],
+					'userDetailsVersion':	someParameters['user']['version'],
+					'records':	{}
+				}
+			} else {
+				throw "user already exists";
+			}
+		} else {
+			throw Clipperz.PM.Proxy.Offline.DataStore.exception.ReadOnly;
+		}
+
+		result = {
+			result: {
+				'lock':		this.data()['users'][someParameters['credentials']['C']]['lock'],
+				'result':	'done'
+			},
+			toll:   this.getTollForRequestType('CONNECT')
+		}
+
+		return MochiKit.Async.succeed(result);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'_handshake': function(someParameters) {
+		var result;
+		var	nextTollRequestType;
+
+//Clipperz.log(">>> Proxy.Offline.DataStore._handshake");
+		result = {};
+		if (someParameters.message == "connect") {
+			var userData;
+			var randomBytes;
+			var b, B, v;
+
+//console.log(">>> Proxy.Offline.DataStore._handshake.connect", someParameters);
+			userData = this.data()['users'][someParameters.parameters.C];
+			
+			if ((typeof(userData) != 'undefined') && (userData['version'] == someParameters.version)) {
+				this.setUserData(userData);
+			} else {
+				this.setUserData(this.data()['users']['catchAllUser']);
+			}
+
+			randomBytes = Clipperz.Crypto.Base.generateRandomSeed();
+			this.set_b(new Clipperz.Crypto.BigInt(randomBytes, 16));
+			v = new Clipperz.Crypto.BigInt(this.userData()['v'], 16);
+			this.set_B(v.add(Clipperz.Crypto.SRP.g().powerModule(this.b(), Clipperz.Crypto.SRP.n())));
+			
+			this.set_A(someParameters.parameters.A);
+			
+			result['s'] = this.userData()['s'];
+			result['B'] = this.B().asString(16);
+			
+			nextTollRequestType = 'CONNECT';
+		} else if (someParameters.message == "credentialCheck") {
+			var v, u, S, A, K, M1;
+			
+//console.log(">>> Proxy.Offline.DataStore._handshake.credentialCheck", someParameters);
+			v = new Clipperz.Crypto.BigInt(this.userData()['v'], 16);
+			u = new Clipperz.Crypto.BigInt(Clipperz.PM.Crypto.encryptingFunctions.versions[someParameters.version].hash(new Clipperz.ByteArray(this.B().asString(10))).toHexString(), 16);
+			A = new Clipperz.Crypto.BigInt(this.A(), 16);
+			S = (A.multiply(v.powerModule(u, Clipperz.Crypto.SRP.n()))).powerModule(this.b(), Clipperz.Crypto.SRP.n());
+
+			K = Clipperz.PM.Crypto.encryptingFunctions.versions[someParameters.version].hash(new Clipperz.ByteArray(S.asString(10))).toHexString().slice(2);
+
+			M1 = Clipperz.PM.Crypto.encryptingFunctions.versions[someParameters.version].hash(new Clipperz.ByteArray(A.asString(10) + this.B().asString(10) + K)).toHexString().slice(2);
+			if (someParameters.parameters.M1 == M1) {
+				var M2;
+				
+				M2 = Clipperz.PM.Crypto.encryptingFunctions.versions[someParameters.version].hash(new Clipperz.ByteArray(A.asString(10) + someParameters.parameters.M1 + K)).toHexString().slice(2);
+				result['M2'] = M2;
+			} else {
+				throw new Error("Client checksum verification failed! Expected <" + M1 + ">, received <" + someParameters.parameters.M1 + ">.", "Error");
+			}
+
+			nextTollRequestType = 'MESSAGE';
+		} else if (someParameters.message == "oneTimePassword") {
+			var otpData;
+			
+//console.log("HANDSHAKE WITH OTP", someParameters.parameters.oneTimePasswordKey);
+//console.log("someParameters", someParameters);
+//console.log("data.OTP", Clipperz.Base.serializeJSON(this.data()['onetimePasswords']));
+			otpData = this.data()['onetimePasswords'][someParameters.parameters.oneTimePasswordKey];
+
+			try {
+				if (typeof(otpData) != 'undefined') {
+					if (otpData['status'] == 'ACTIVE') {
+						if (otpData['key_checksum'] == someParameters.parameters.oneTimePasswordKeyChecksum) {
+							result = {
+								'data':		otpData['data'],
+								'version':	otpData['version']
+							}
+
+							otpData['status'] = 'REQUESTED';
+						} else {
+							otpData['status'] = 'DISABLED';
+							throw "The requested One Time Password has been disabled, due to a wrong keyChecksum";
+						}
+					} else {
+						throw "The requested One Time Password was not active";
+					}
+				} else {
+					throw "The requested One Time Password has not been found"
+				}
+			} catch (exception) {
+				result = {
+					'data':		Clipperz.PM.Crypto.randomKey(),
+					'version':	Clipperz.PM.Connection.communicationProtocol.currentVersion
+				}
+			}
+			nextTollRequestType = 'CONNECT';
+		} else {
+			MochiKit.Logging.logError("Clipperz.PM.Proxy.Test.handshake - unhandled message: " + someParameters.message);
+		}
+//console.log("<<< Proxy.Offline._handshake", result);
+
+		result = {
+			result: result,
+			toll:   this.getTollForRequestType(nextTollRequestType)
+		}
+
+		return MochiKit.Async.succeed(result);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'_message': function(someParameters) {
+		var result;
+
+		result = {};
+
+		//=====================================================================
+		//
+		//		R	E	A	D	-	O	N	L	Y		M e t h o d s
+		//
+		//=====================================================================
+		if (someParameters.message == 'getUserDetails') {
+			var recordsStats;
+			var recordReference;
+
+//try {		
+			recordsStats = {};
+			for (recordReference in this.userData()['records']) {
+				recordsStats[recordReference] = {
+					'updateDate': this.userData()['records'][recordReference]['updateDate']
+				}
+			}
+
+			result['header'] =  this.userDetails();
+			result['statistics'] = this.statistics();
+			result['maxNumberOfRecords'] = this.userData()['maxNumberOfRecords'];
+			result['version'] = this.userData()['userDetailsVersion'];
+			result['recordsStats'] = recordsStats;
+			
+			if (this.isReadOnly() == false) {
+				var	lock;
+				
+				if (typeof(this.userData()['lock']) == 'undefined') {
+					this.userData()['lock'] = "<<LOCK>>";
+				}
+				
+				result['lock'] = this.userData()['lock'];
+			}
+//} catch (exception) {
+//	console.log("*#*#*#*#*#*#*", exception);
+//	throw exception;
+//}
+		//=====================================================================
+		} else if (someParameters.message == 'getRecordDetail') {
+			recordData = this.userData()['records'][someParameters['parameters']['reference']];
+
+			result['reference'] = someParameters['parameters']['reference'];
+			result['data'] = recordData['data'];
+			result['version'] = recordData['version'];
+			result['creationData'] = recordData['creationDate'];
+			result['updateDate'] = recordData['updateDate'];
+			result['accessDate'] = recordData['accessDate'];
+
+			currentVersionData = recordData['versions'][recordData['currentVersion']];
+
+			result['currentVersion'] = {};
+			result['currentVersion']['reference'] = recordData['currentVersion'];
+			result['currentVersion']['version'] = currentVersionData['version'];
+			result['currentVersion']['header'] = currentVersionData['header'];
+			result['currentVersion']['data'] = currentVersionData['data'];
+			result['currentVersion']['creationData'] = currentVersionData['creationDate'];
+			result['currentVersion']['updateDate'] = currentVersionData['updateDate'];
+			result['currentVersion']['accessDate'] = currentVersionData['accessDate'];
+			if (typeof(currentVersionData['previousVersion']) != 'undefined') {
+				result['currentVersion']['previousVersionKey'] = currentVersionData['previousVersionKey'];
+				result['currentVersion']['previousVersion'] = currentVersionData['previousVersion'];
+			}
+
+		//=====================================================================
+		//
+		//		R	E	A	D	-	W	R	I	T	E		M e t h o d s
+		//
+		//=====================================================================
+		} else if (someParameters.message == 'upgradeUserCredentials') {
+			if (this.isReadOnly() == false) {
+				var parameters;
+				parameters = someParameters.parameters;
+
+				if (parameters['C'] == null) {
+					result = Clipperz.PM.DataModel.User.exception.CredentialUpgradeFailed;
+				} else if (parameters['s'] == null) {
+					result = Clipperz.PM.DataModel.User.exception.CredentialUpgradeFailed;
+				} else if (parameters['v'] == null) {
+					result = Clipperz.PM.DataModel.User.exception.CredentialUpgradeFailed;
+				} else if (parameters['version'] != Clipperz.PM.Connection.communicationProtocol.currentVersion) {
+					result = Clipperz.PM.DataModel.User.exception.CredentialUpgradeFailed;
+				} else {
+					result = {result:"done", parameters:parameters};
+				}
+			} else {
+				throw Clipperz.PM.Proxy.Offline.DataStore.exception.ReadOnly;
+			}
+		//=====================================================================
+/*		} else if (someParameters.message == 'updateData') {
+			if (this.isReadOnly() == false) {
+				var i, c;
+
+//console.log("###===============================================================");
+//console.log("###>>>", Clipperz.Base.serializeJSON(someParameters));
+//console.log("###--- userData", Clipperz.Base.serializeJSON(this.userData()));
+				if (this.userData()['lock']	!= someParameters['parameters']['user']['lock']) {
+					throw "the lock attribute is not processed correctly"
+				}
+
+				this.userData()['userDetails']			= someParameters['parameters']['user']['header'];
+				this.userData()['statistics']			= someParameters['parameters']['user']['statistics'];
+				this.userData()['userDetailsVersions']	= someParameters['parameters']['user']['version'];
+
+				c = someParameters['parameters']['records'].length;
+				for (i=0; i<c; i++) {
+					var currentRecord;
+					var currentRecordData;
+
+					currentRecordData = someParameters['parameters']['records'][i];
+					currentRecord = this.userData()['records'][currentRecordData['record']['reference']];
+					
+					if (currentRecord == null) {
+					}
+					
+					currentRecord['data'] = currentRecordData['record']['data'];
+					currentRecord['version'] = currentRecordData['record']['version'];
+					currentRecord['currentVersion'] = currentRecordData['currentRecordVersion']['reference'];
+					
+					currentRecord['versions'][currentRecordData['currentRecordVersion']['reference']] = {
+						'data':					currentRecordData['currentRecordVersion']['data'],
+						'version':				currentRecordData['currentRecordVersion']['version'],
+						'previousVersion':		currentRecordData['currentRecordVersion']['previousVersion'],
+						'previousVersionKey':	currentRecordData['currentRecordVersion']['previousVersionKey']
+					}
+				}
+
+				this.userData()['lock'] = Clipperz.PM.Crypto.randomKey();
+				result['lock'] = this.userData()['lock'];
+				result['result'] = 'done';
+//console.log("###<<< userData", Clipperz.Base.serializeJSON(this.userData()));
+			} else {
+				throw Clipperz.PM.Proxy.Offline.DataStore.exception.ReadOnly;
+			}
+*/		//=====================================================================
+		} else if (someParameters.message == 'saveChanges') {
+			if (this.isReadOnly() == false) {
+				var i, c;
+
+//console.log("###===============================================================");
+//console.log("###>>>", someParameters);
+//console.log("###>>>", Clipperz.Base.serializeJSON(someParameters));
+//console.log("###--- userData", Clipperz.Base.serializeJSON(this.userData()));
+//console.log("###===============================================================");
+//console.log("--- userData.lock  ", this.userData()['lock']);
+//console.log("--- parameters.lock", someParameters['parameters']['user']['lock']);
+				if (this.userData()['lock']	!= someParameters['parameters']['user']['lock']) {
+					throw "the lock attribute is not processed correctly"
+				}
+
+				this.userData()['userDetails']			= someParameters['parameters']['user']['header'];
+				this.userData()['statistics']			= someParameters['parameters']['user']['statistics'];
+				this.userData()['userDetailsVersions']	= someParameters['parameters']['user']['version'];
+
+				c = someParameters['parameters']['records']['updated'].length;
+				for (i=0; i<c; i++) {
+					var currentRecord;
+					var currentRecordData;
+
+					currentRecordData = someParameters['parameters']['records']['updated'][i];
+					currentRecord = this.userData()['records'][currentRecordData['record']['reference']];
+
+					if (
+						(typeof(this.userData()['records'][currentRecordData['record']['reference']]) == 'undefined')
+						&&
+						(typeof(currentRecordData['currentRecordVersion']) == 'undefined')
+					) {
+//console.log("######## SHIT HAPPENS");
+						throw "Record added without a recordVersion";
+					}
+
+					if (currentRecord == null) {
+						currentRecord = {};
+						currentRecord['versions'] = {};
+						currentRecord['creationDate']	= Clipperz.PM.Date.formatDateWithUTCFormat(new Date());
+						currentRecord['accessDate']		= Clipperz.PM.Date.formatDateWithUTCFormat(new Date());
+
+						this.userData()['records'][currentRecordData['record']['reference']] = currentRecord;
+					}
+					
+					currentRecord['data']		= currentRecordData['record']['data'];
+					currentRecord['version']	= currentRecordData['record']['version'];
+					currentRecord['updateDate']	= Clipperz.PM.Date.formatDateWithUTCFormat(new Date());
+
+					if (typeof(currentRecordData['currentRecordVersion']) != 'undefined') {
+						currentRecord['currentVersion'] = currentRecordData['currentRecordVersion']['reference'];
+						currentRecord['versions'][currentRecordData['currentRecordVersion']['reference']] = {
+							'data':					currentRecordData['currentRecordVersion']['data'],
+							'version':				currentRecordData['currentRecordVersion']['version'],
+							'previousVersion':		currentRecordData['currentRecordVersion']['previousVersion'],
+							'previousVersionKey':	currentRecordData['currentRecordVersion']['previousVersionKey'],
+							'creationDate':	Clipperz.PM.Date.formatDateWithUTCFormat(new Date()),
+							'updateDate':	Clipperz.PM.Date.formatDateWithUTCFormat(new Date()),
+							'accessDate':	Clipperz.PM.Date.formatDateWithUTCFormat(new Date())
+						}
+					}
+				}
+
+				c = someParameters['parameters']['records']['deleted'].length;
+				for (i=0; i<c; i++) {
+					var currentRecordReference;
+
+					currentRecordReference = someParameters['parameters']['records']['deleted'][i];
+//console.log("DELETING records", currentRecordReference);
+					delete this.userData()['records'][currentRecordReference];
+				}
+
+				this.userData()['lock'] = Clipperz.PM.Crypto.randomKey();
+				result['lock'] = this.userData()['lock'];
+				result['result'] = 'done';
+//console.log("###<<< userData", Clipperz.Base.serializeJSON(this.userData()));
+			} else {
+				throw Clipperz.PM.Proxy.Offline.DataStore.exception.ReadOnly;
+			}
+
+		//=====================================================================
+		//
+		//		U	N	H	A	N	D	L	E	D		M e t h o d
+		//
+		//=====================================================================
+		} else {
+			MochiKit.Logging.logError("Clipperz.PM.Proxy.Test.message - unhandled message: " + someParameters.message);
+		}
+	
+		result = {
+			result: result,
+			toll:   this.getTollForRequestType('MESSAGE')
+		}
+
+		return MochiKit.Async.succeed(result);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'_logout': function(someParameters) {
+		return MochiKit.Async.succeed({result: 'done'});
+	},
+
+	//=========================================================================
+	//#########################################################################
+
+	'isTestData': function() {
+		return (typeof(this.userData()['__masterkey_test_value__']) != 'undefined');
+	},
+
+	'userDetails': function() {
+		var result;
+		
+		if (this.isTestData()) {
+			var serializedHeader;
+			var version;
+
+//MochiKit.Logging.logDebug("### test data");
+			version = this.userData()['userDetailsVersion'];
+			serializedHeader = Clipperz.Base.serializeJSON(this.userData()['userDetails']);
+			result = Clipperz.PM.Crypto.encryptingFunctions.versions[version].encrypt(this.userData()['__masterkey_test_value__'], serializedHeader);
+		} else {
+//MochiKit.Logging.logDebug("### NOT test data");
+ 			result = this.userData()['userDetails'];
+		}
+		
+		return result;
+	},
+	
+	'statistics': function() {
+		var result;
+
+		if (this.userData()['statistics'] != null) {
+			if (this.isTestData()) {
+				var serializedStatistics;
+				var version;
+
+				version = this.userData()['userDetailsVersion'];
+				serializedStatistics = Clipperz.Base.serializeJSON(this.userData()['statistics']);
+				result = Clipperz.PM.Crypto.encryptingFunctions.versions[version].encrypt(this.userData()['__masterkey_test_value__'], serializedStatistics);
+			} else {
+			 	result = this.userData()['statistics'];
+			}
+		} else {
+			result = null;
+		}
+		
+		return result;
+	},
+
+/*
+	'userSerializedEncryptedData': function(someData) {
+		var deferredResult;
+		var deferredContext;
+		
+		deferredContext = { 'data': someData };
+		
+		deferredResult = new Clipperz.Async.Deferred('Proxy.Test.serializeUserEncryptedData', {trace:false});
+		deferredResult.addCallback(MochiKit.Base.bind(function(aDeferredContext) {
+			aDeferredContext['user'] = this.createUserUsingConfigurationData(aDeferredContext['data']);
+			return aDeferredContext;
+		}, this));
+		deferredResult.addCallback(function(aDeferredContext) {
+//			return aDeferredContext['user'].encryptedDataUsingVersion(aDeferredContext['data']['version']);
+			return aDeferredContext['user'].serializedDataUsingVersion(MochiKit.Base.values(aDeferredContext['user'].records()), aDeferredContext['data']['version']);
+		});
+		deferredResult.addCallback(function(aUserEncryptedData) {
+			deferredContext['encryptedData'] = aUserEncryptedData;
+			return deferredContext;
+		});
+		deferredResult.addCallback(function(aDeferredContext) {
+			var connection;
+
+			connection = new Clipperz.PM.Connection.communicationProtocol.versions[aDeferredContext['data']['connectionVersion']]()
+			aDeferredContext['credentials'] = connection.serverSideUserCredentials(aDeferredContext['user'].username(),aDeferredContext['user'].passphrase());
+
+			return aDeferredContext;
+		});
+
+//		deferredResult.addCallback(function(aDeferredContext) {
+//console.log("#-#-#-#-#", aDeferredContext);
+//			return aDeferredContext['user'].serializedDataUsingVersion(MochiKit.Base.values(aDeferredContext['user'].records()), aDeferredContext['data']['version']);
+//		}, deferredContext);
+//		deferredResult.addCallback(function(aUserSerializedData) {
+//console.log("USER SERIALIZED DATA", aUserSerializedData);
+//		});
+//
+//		deferredResult.addCallback(MochiKit.Async.succeed, deferredContext);
+		deferredResult.callback(deferredContext);
+		
+		return deferredResult;
+	},
+
+	'createUserUsingConfigurationData': function(someData) {
+		var result;
+		var user;
+		var recordLabel;
+
+		user = new Clipperz.PM.DataModel.User();
+		user.initForTests();
+		user.setUsername(someData['username']);
+		user.setPassphrase(someData['passphrase']);
+
+		for (recordLabel in someData['records']) {
+			var recordData;
+			var record;
+			var i, c;
+			
+			recordData = someData['records'][recordLabel];
+			record = new Clipperz.PM.DataModel.Record({user:user, label:recordLabel});
+			record.setNotes(recordData['notes']);
+			
+			c = recordData['fields'].length;
+			for (i=0; i<c; i++) {
+				var recordField;
+				
+				recordField = new Clipperz.PM.DataModel.RecordField();
+				recordField.setLabel(recordData['fields'][i]['name']);
+				recordField.setValue(recordData['fields'][i]['value']);
+				recordField.setType(recordData['fields'][i]['type']);
+				record.addField(recordField);
+			}
+			user.addRecord(record, true);
+		}
+		
+		result = user;
+		
+		return result;
+	},
+*/
+	//=========================================================================
+	__syntaxFix__: "syntax fix"
+});
+
+Clipperz.PM.Proxy.Offline.DataStore['exception'] = {
+	'ReadOnly': 		new MochiKit.Base.NamedError("Clipperz.PM.Proxy.Offline.DataStore.exception.ReadOnly")
+};
\ No newline at end of file
diff --git a/frontend/beta/js/Clipperz/PM/Proxy/Proxy.Offline.js b/frontend/beta/js/Clipperz/PM/Proxy/Proxy.Offline.js
new file mode 100644
index 0000000..072f9bf
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Proxy/Proxy.Offline.js
@@ -0,0 +1,73 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+
+//=============================================================================
+
+Clipperz.PM.Proxy.Offline = function(args) {
+	args = args || {};
+	
+	Clipperz.PM.Proxy.Offline.superclass.constructor.call(this, args);
+
+	this._dataStore = args.dataStore || new Clipperz.PM.Proxy.Offline.DataStore(args);
+
+	return this;
+}
+
+YAHOO.extendX(Clipperz.PM.Proxy.Offline, Clipperz.PM.Proxy, {
+
+	'toString': function () {
+		return "Clipperz.PM.Proxy.Offline";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'dataStore': function () {
+		return this._dataStore;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'sendMessage': function(aFunctionName, someParameters) {
+		return this.dataStore().processMessage(aFunctionName, someParameters);
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isReadOnly': function () {
+		return true;
+	},
+
+	//-------------------------------------------------------------------------
+
+	__syntaxFix__: "syntax fix"
+	
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Proxy/Proxy.PHP.js b/frontend/beta/js/Clipperz/PM/Proxy/Proxy.PHP.js
new file mode 100755
index 0000000..e7c2bc1
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Proxy/Proxy.PHP.js
@@ -0,0 +1,259 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+
+//=============================================================================
+
+Clipperz.PM.Proxy.PHP = function(args) {
+	Clipperz.PM.Proxy.PHP.superclass.constructor.call(this, args);
+/*
+	this._tolls = {
+		'CONNECT':	[],
+		'REGISTER':	[],
+		'MESSAGE':	[]
+	};
+*/	
+	return this;
+}
+
+YAHOO.extendX(Clipperz.PM.Proxy.PHP, Clipperz.PM.Proxy, {
+
+	'toString': function() {
+		return "Clipperz.PM.Proxy.PHP - " + this.args();
+	},
+
+	//=========================================================================
+/*
+	'tolls': function() {
+		return this._tolls;
+	},
+*/
+	//-------------------------------------------------------------------------
+/*
+	'payToll': function(aRequestType, someParameters) {
+		var	deferredResult;
+
+//MochiKit.Logging.logDebug(">>> Proxy.DWR.payToll: " + aRequestType);
+		if (this.tolls()[aRequestType].length > 0) {
+			deferredResult = MochiKit.Async.succeed(this.tolls()[aRequestType].pop());
+		} else {
+//MochiKit.Logging.logDebug("### " + aRequestType + " toll NOT immediately available; request queued.");
+			deferredResult = new MochiKit.Async.Deferred();
+			deferredResult.addCallback(function(someParameters) {
+				return new Clipperz.PM.Toll(someParameters['toll']);
+			})
+			com_clipperz_pm_Proxy.knock(Clipperz.Base.serializeJSON({requestType:aRequestType}), {
+				callback:MochiKit.Base.method(deferredResult, 'callback'),
+				errorHandler:MochiKit.Base.method(deferredResult, 'errback')
+			});
+		}
+		
+		deferredResult.addCallback(function(aToll) {
+			return aToll.deferredPay();
+		});
+		deferredResult.addCallback(function(someParameters, aToll) {
+			var result;
+			
+			result = {
+				parameters: someParameters,
+				toll: aToll
+			}
+			
+			return result;
+		}, someParameters);
+		
+		return deferredResult;
+	},
+*/
+	//-------------------------------------------------------------------------
+/*
+	'addToll': function(aToll) {
+		this.tolls()[aToll.requestType()].push(aToll);
+	},
+*/
+	//=========================================================================
+/*
+	'setTollCallback': function(someParameters) {
+//MochiKit.Logging.logDebug(">>> Proxy.DWR.setTollCallback");
+//MochiKit.Logging.logDebug("--- Proxy.DWR.setTollCallback - " + Clipperz.Base.serializeJSON(someParameters));
+		if (typeof(someParameters['toll']) != 'undefined') {
+			this.addToll(new Clipperz.PM.Toll(someParameters['toll']));
+		}
+		return someParameters['result'];
+	},
+*/
+	//=========================================================================
+
+	'registration': function(someParameters) {
+		return this.sendMessage('registration', someParameters, 'REGISTER');
+	},
+
+	//-------------------------------------------------------------------------
+
+	'handshake': function(someParameters) {
+/*
+		_s = "e8a2162f29aeaabb729f5625e9740edbf0cd80ac77c6b19ab951ed6c88443b8c";
+		_v = new Clipperz.Crypto.BigInt("955e2db0f7844aca372f5799e5f7e51b5866718493096908bd66abcf1d068108", 16);
+		_b = new Clipperz.Crypto.BigInt("5761e6c84d22ea3c5649de01702d60f674ccfe79238540eb34c61cd020230c53", 16);
+
+		_B = _v.add(Clipperz.Crypto.SRP.g().powerModule(_b, Clipperz.Crypto.SRP.n()));
+		_u = new Clipperz.Crypto.BigInt(Clipperz.PM.Crypto.encryptingFunctions.versions[someParameters.version].hash(new Clipperz.ByteArray(_B.asString(10))).toHexString(), 16);
+		_A = new Clipperz.Crypto.BigInt("3b3567ec33d73673552e960872eb154d091a2488915941038aef759236a27e64", 16);
+		_S = (_A.multiply(_v.powerModule(_u, Clipperz.Crypto.SRP.n()))).powerModule(_b, Clipperz.Crypto.SRP.n());
+		_K = Clipperz.PM.Crypto.encryptingFunctions.versions[someParameters.version].hash(new Clipperz.ByteArray(_S.asString(10))).toHexString().slice(2);
+		_M1 = Clipperz.PM.Crypto.encryptingFunctions.versions[someParameters.version].hash(new Clipperz.ByteArray(_A.asString(10) + _B.asString(10) + _K)).toHexString().slice(2);
+		_M2 = Clipperz.PM.Crypto.encryptingFunctions.versions[someParameters.version].hash(new Clipperz.ByteArray(_A.asString(10) + _M1 + _K)).toHexString().slice(2);
+		
+//		MochiKit.Logging.logDebug("b = " + _b.asString(16));
+//		MochiKit.Logging.logDebug("v = " + _v.asString(16));
+		MochiKit.Logging.logDebug("B = " + _B.asString(16));
+		MochiKit.Logging.logDebug("u = " + _u.asString(16));
+		MochiKit.Logging.logDebug("S = " + _S.asString(16));
+		MochiKit.Logging.logDebug("K = " + _K);
+		MochiKit.Logging.logDebug("M1 = " + _M1);
+		MochiKit.Logging.logDebug("M2 = " + _M2);
+//		MochiKit.Logging.logDebug("someParameters.version: " + someParameters.version);
+*/		
+		return this.sendMessage('handshake', someParameters, 'CONNECT');
+	},
+
+	//-------------------------------------------------------------------------
+
+	'message': function(someParameters) {
+		return this.sendMessage('message', someParameters, 'MESSAGE');
+	},
+
+	//-------------------------------------------------------------------------
+
+	'logout': function(someParameters) {
+//MochiKit.Logging.logDebug("=== Proxy.DWR.logout");
+		return this.sendMessage('logout', someParameters, 'MESSAGE');
+	},
+
+	//=========================================================================
+
+	'sendMessage': function(aFunctionName, someParameters, aRequestType) {
+/*
+		var	deferredResult;
+		var proxy;
+		
+//MochiKit.Logging.logDebug(">>> Proxy.DWR.sendMessage - " + aFunctionName + " - " + aRequestType);
+		proxy = this;
+		
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("x.1 Proxy.DWR.sendMessage - 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(proxy, 'payToll'), aRequestType);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("x.2 Proxy.DWR.sendMessage - 2: " + Clipperz.Base.serializeJSON(res)); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(proxy, 'sendRemoteMessage'), aFunctionName);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("x.3 Proxy.DWR.sendMessage - 3: " + res); return res;});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("x.3 Proxy.DWR.sendMessage - 3: " + Clipperz.Base.serializeJSON(res)); return res;});
+		deferredResult.callback(someParameters);
+		
+//MochiKit.Logging.logDebug("<<< Proxy.DWR.sendMessage");
+		return deferredResult;		
+*/
+
+//		return this.sendRemoteMessage(aFunctionName, someParameters);
+
+
+		var	deferredResult;
+		var proxy;
+
+		proxy = this;
+
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Base.method(proxy, 'sendRemoteMessage'), aFunctionName);
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("x.3 Proxy.PHP.sendMessage - 3: " + res); return res;});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("x.3 Proxy.PHP.sendMessage - 3.1: " + Clipperz.Base.serializeJSON(res)); return res;});
+
+		deferredResult.callback(someParameters);
+
+		return deferredResult;
+	},
+
+	//=========================================================================
+	
+	'sendRemoteMessage': function(aFunctionName, someParameters) {
+/*
+		var	deferredResult;
+
+//MochiKit.Logging.logDebug(">>> Proxy.DWR.sendRemoteMessage('" + aFunctionName + "', " + Clipperz.Base.serializeJSON(someParameters) + ") - " + this);
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Proxy.DWR.sendRemoteMessage - 1: " + res); return res;});
+//		deferredResult.addCallback(MochiKit.Base.method(this, 'setTollCallback'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("Proxy.DWR.sendRemoteMessage - 2: " + res); return res;});
+		
+		com_clipperz_pm_Proxy[aFunctionName](Clipperz.Base.serializeJSON(someParameters), {
+			callback:MochiKit.Base.method(deferredResult, 'callback'),
+			errorHandler:MochiKit.Base.method(deferredResult, 'errback')
+		});
+//MochiKit.Logging.logDebug("<<< Proxy.PHP.sendRemoteMessage - result: " + deferredResult);
+
+		return deferredResult;
+*/
+
+		var	deferredResult;
+		var parameters;
+		
+//MochiKit.Logging.logDebug(">>> Proxy.PHP.sendRemoteMessage('" + aFunctionName + "', " + Clipperz.Base.serializeJSON(someParameters) + ") - " + this);
+		parameters = {};
+		parameters['method'] = aFunctionName;
+//		parameters['version'] = someParameters['version'];
+//		parameters['message'] = someParameters['message'];
+		parameters['parameters'] = Clipperz.Base.serializeJSON(someParameters);
+//MochiKit.Logging.logDebug("--- Proxy.PHP.sendRemoteMessage('" + Clipperz.Base.serializeJSON(parameters) + ") - " + this);
+		deferredResult = new MochiKit.Async.Deferred();
+		deferredResult.addCallback(MochiKit.Async.doXHR, "./php/index.php", {
+			method:'POST',
+			sendContent:MochiKit.Base.queryString(parameters),
+			headers:{"Content-Type":"application/x-www-form-urlencoded"}
+		});
+//deferredResult.addCallback(function(res) {MochiKit.Logging.logDebug("Proxy.PHP.response - 2: " + res.responseText); return res;});
+//deferredResult.addErrback(function(res) {MochiKit.Logging.logDebug("Proxy.PHP.response - ERROR: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Async.evalJSONRequest);
+		deferredResult.callback();
+
+		return deferredResult;
+	},
+
+	//=========================================================================
+
+	'isReadOnly': function() {
+		return false;
+	},
+
+	//=========================================================================
+	__syntaxFix__: "syntax fix"
+	
+});
+
+//=============================================================================
+
+//Clipperz.PM.Proxy.defaultProxy = new Clipperz.PM.Proxy.PHP("Proxy.PHP - async test");
diff --git a/frontend/beta/js/Clipperz/PM/Proxy/Proxy.Test.js b/frontend/beta/js/Clipperz/PM/Proxy/Proxy.Test.js
new file mode 100644
index 0000000..fd5bf8a
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Proxy/Proxy.Test.js
@@ -0,0 +1,94 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Proxy) == 'undefined') { Clipperz.PM.Proxy = {}; }
+
+//=============================================================================
+
+Clipperz.PM.Proxy.Test = function(args) {
+	args = args || {};
+
+	Clipperz.PM.Proxy.Offline.call(this, args);
+
+	
+	
+	return this;
+}
+
+Clipperz.PM.Proxy.Test.prototype = MochiKit.Base.update(new Clipperz.PM.Proxy.Offline(), {
+
+	'toString': function() {
+		return "Clipperz.PM.Proxy.Test";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isTestData': function() {
+		return typeof(this.userData()['__masterkey_test_value__'] != 'undefined');
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'userDetails': function() {
+		var result;
+
+		if (this.isTestData()) {
+			var serializedHeader;
+			var version;
+		
+			version = this.userData()['version'];
+			serializedHeader = Clipperz.Base.serializeJSON(this.userData()['userDetails']);
+			result = Clipperz.PM.Crypto.encryptingFunctions.versions[version].encrypt(this.userData()['__masterkey_test_value__'], serializedHeader);
+		} else {
+			result = Clipperz.PM.Proxy.Offline.prototype.userDetails.call(this);
+		}
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'statistics': function() {
+		var result;
+		var serializedStatistics;
+		var version;
+		
+		version = this.userData()['version'];
+		serializedStatistics = Clipperz.Base.serializeJSON(this.userData()['statistics']);
+		result = Clipperz.PM.Crypto.encryptingFunctions.versions[version].encrypt(this.userData()['__masterkey_test_value__'], serializedStatistics);
+		
+		return result;
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+	
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Strings.js b/frontend/beta/js/Clipperz/PM/Strings.js
new file mode 100644
index 0000000..e9f5dbe
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings.js
@@ -0,0 +1,231 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Strings) == 'undefined') { Clipperz.PM.Strings = {}; }
+if (typeof(Clipperz.PM.Strings.Languages) == 'undefined') { Clipperz.PM.Strings.Languages = {}; }
+
+Clipperz.PM.Strings.standardStrings = {
+
+	'loginPanelSwitchLanguageSelectOptions':	[
+/*
+		{tag:'option', html:"Arabic (Oman) (العربية)", value:'ar-OM', disabled:true},
+		{tag:'option', html:"Arabic (Syria) (العربية)", value:'ar-SY', disabled:true},
+		{tag:'option', html:"Bahasa Indonesia", value:'id-ID', disabled:true},
+		{tag:'option', html:"Bulgarian (Български)", value:'bg-BG', disabled:true},
+		{tag:'option', html:"Català", value:'ca-ES', disabled:true},
+		{tag:'option', html:"Chinese (Simplified) (简体中文)", value:'zh-CN', disabled:true},
+		{tag:'option', html:"Chinese (Traditional) (正體中文)", value:'zh-TW', disabled:true},
+		{tag:'option', html:"Czech (Česky)", value:'cs-CZ', disabled:true},
+		{tag:'option', html:"Dansk", value:'da-DK', disabled:true},
+		{tag:'option', html:"Deutsch", value:'de-DE'/ *, disabled:true* /},
+		{tag:'option', html:"English (American)", value:'en-US'/ *, disabled:true* /},
+		{tag:'option', html:"English (British)", value:'en-GB'/ *, disabled:true* /},
+		{tag:'option', html:"English (Canadian)", value:'en-CA'/ *, disabled:true* /},
+		{tag:'option', html:"Español", value:'es-ES', disabled:true},
+		{tag:'option', html:"Eesti", value:'et-EE', disabled:true},
+		{tag:'option', html:"Français", value:'fr-FR', disabled:true},
+		{tag:'option', html:"Galego", value:'gl-ES', disabled:true},
+		{tag:'option', html:"Greek (Ελληνικά)", value:'el-GR', disabled:true},
+		{tag:'option', html:"Íslenska", value:'is-IS', disabled:true},
+		{tag:'option', html:"Italiano", value:'it-IT'/ *, disabled:true* /},
+		{tag:'option', html:"Japanese (日本語)", value:'ja-JP', disabled:true},
+		{tag:'option', html:"Korean (한국어)", value:'ko-KR', disabled:true},
+		{tag:'option', html:"Latviešu", value:'lv-LV', disabled:true},
+		{tag:'option', html:"Lietuvių", value:'lt-LT', disabled:true},
+		{tag:'option', html:"Macedonian (Македонски)", value:'mk-MK', disabled:true},
+		{tag:'option', html:"Magyar", value:'hu-HU', disabled:true},
+		{tag:'option', html:"Nederlands", value:'nl-NL', disabled:true},
+		{tag:'option', html:"Norsk bokmål", value:'nb-NO', disabled:true},
+		{tag:'option', html:"Norsk nynorsk", value:'nn-NO', disabled:true},
+		{tag:'option', html:"Persian (Western) (فارسى)", value:'fa-IR', disabled:true},
+		{tag:'option', html:"Polski", value:'pl-PL', disabled:true},
+		{tag:'option', html:"Português", value:'pt-PT'/ *, disabled:true* /},
+		{tag:'option', html:"Português Brasileiro", value:'pt-BR'/ *, disabled:true* /},
+		{tag:'option', html:"Românä", value:'ro-RO', disabled:true},
+		{tag:'option', html:"Russian (Русский)", value:'ru-RU', disabled:true},
+		{tag:'option', html:"Slovak (Slovenčina)", value:'sk-SK', disabled:true},
+		{tag:'option', html:"Slovenian (Slovenščina)", value:'sl-SI', disabled:true},
+		{tag:'option', html:"Suomi", value:'fi-FI', disabled:true},
+		{tag:'option', html:"Svenska", value:'sv-SE', disabled:true},
+		{tag:'option', html:"Thai (ไทย)", value:'th-TH', disabled:true},
+		{tag:'option', html:"Türkçe", value:'tr-TR', disabled:true},
+		{tag:'option', html:"Ukrainian (Українська)", value:'uk-UA', disabled:true}
+*/
+		{tag:'option', html:"Arabic (العربية)", value:"ar", disabled:true, cls:'disabledOption'},
+//		{tag:'option', html:"Chinese (中文)", value:"zh", disabled:true},
+		{tag:'option', html:"Chinese (Simplified) (简体中文)", value:'zh-CN'},
+		{tag:'option', html:"Dutch (Nederlands)", value:"nl-NL", disabled:true, cls:'disabledOption'},
+		{tag:'option', html:"English", value:"en-US"},
+		{tag:'option', html:"French (Français)", value:"fr-FR"},
+		{tag:'option', html:"German (Deutsch)", value:"de-DE"/* -- */, disabled:true, cls:'disabledOption' /* */},
+		{tag:'option', html:"Greek (Ελληνικά)", value:"el-GR"/* -- */, disabled:true, cls:'disabledOption' /* */},
+		{tag:'option', html:"Hebrew (עברית)", value:"he-IL"/* -- */, disabled:true, cls:'disabledOption' /* */},
+		{tag:'option', html:"Italian (Italiano)", value:"it-IT"},
+		{tag:'option', html:"Japanese (日本語)", value:"ja-JP"},
+		{tag:'option', html:"Korean (한국어)", value:"ko-KR", disabled:true, cls:'disabledOption'},
+		{tag:'option', html:"Norwegian (Norsk)", value:"no", disabled:true, cls:'disabledOption'},
+		{tag:'option', html:"Persian (فارسی)", value:"fa-IR", disabled:true, cls:'disabledOption'},
+		{tag:'option', html:"Polish (Polski)", value:"pl-PL", disabled:true, cls:'disabledOption'},
+		{tag:'option', html:"Portuguese (Português)", value:"pt-BR"},
+		{tag:'option', html:"Russian (Русский)", value:"ru-RU"/* -- */, disabled:true, cls:'disabledOption' /* */},
+		{tag:'option', html:"Spanish (Español)", value:"es-ES"},
+		{tag:'option', html:"Swedish (Svenska)", value:"sv-SE", disabled:true, cls:'disabledOption'},
+		{tag:'option', html:"Turkish (Türkçe)", value:"tr-TR", disabled:true, cls:'disabledOption'},
+		{tag:'option', html:"Vietnamese (Tiếng Việt)", value:"vi-VN", disabled:true, cls:'disabledOption'}
+	]
+}
+
+Clipperz.PM.Strings.GeneralSettings = {
+	'en-us': {
+		'loginFormAarghThatsBadUrl':	"http://www.clipperz.com/support/faq/account_faq",
+		'loginFormVerifyTheCodeUrl':	"http://www.clipperz.com/learn_more/reviewing_the_code",
+
+		'donateHeaderLinkUrl':			"http://www.clipperz.com/donations",
+		'creditsHeaderLinkUrl':			"http://www.clipperz.com/credits",
+		'feedbackHeaderLinkUrl':		"http://www.clipperz.com/contact",
+		'helpHeaderLinkUrl':			"http://www.clipperz.com/support/user_guide",
+		'forumHeaderLinkUrl':			"http://www.clipperz.com/forum",
+
+		'httpAuthBookmarkletConfiguration':	{tag:'textarea', id:'httpAuthDefaultConfiguration', html:"" +
+													"{ \"page\":{\"title\":\"HTTP authentication\"}," + "\n" +
+													"  \"form\":{\"attributes\": {" + "\n" +
+													"    \"action\":\"\"," + "\n" +
+													"    \"type\":\"http_auth\"" + "\n" +
+													"  }, \"inputs\": [" + "\n" +
+													"    {\"type\":\"text\",\"name\":\"url\",\"value\":\"\"}," + "\n" +
+													"    {\"type\":\"text\",\"name\":\"username\",\"value\":\"\"}," + "\n" +
+													"    {\"type\":\"password\",\"name\":\"password\",\"value\":\"\"}" + "\n" +
+													"  ]}, \"version\":\"0.2.3\"}"
+											},
+
+		'directLoginJumpPageUrl':	"",
+		'defaultFaviconUrl':		"data:application/octet-stream;charset=utf-8;base64,AAABAAEAFxcAAAEAGAD8BgAAFgAAACgAAAAXAAAALgAAAAEAGAAAAAAAAAAAABIXAAASFwAAAAAAAAAAAAD///////////////////////////////////////////////////////////////////////////////////////////9zAC////////////////////////////////////////////////////////////////////////////////////////////9pAG////////////////////////////////////////////////////////////////////////////////////////////9rAC////////////////////////////////////////////////////////////////////////////////////////////9yAHP////////////////////////IyMizs7O6urrq6ur////////////Ozs6zs7Ozs7Pq6ur///////////////////////8AAAD////////////////////V1dWXl5eXl5eXl5elpaX4+Pj////Ozs6Xl5eXl5eXl5eenp7///////////////////////8AAAD////////////////////Ozs6Xl5eXl5eXl5eXl5fBwcHq6uqenp6Xl5eXl5eXl5eXl5f///////////////////////8AAAD////////////////////j4+OXl5eXl5eXl5eXl5eXl5elpaWXl5eXl5eXl5eXl5ezs7P///////////////////////8AAAD////////////////////////IyMiXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eenp7x8fH////////////////////////////////////////////////////4+PilpaWXl5eXl5eXl5eXl5eXl5eXl5eXl5fOzs7////////////////////////////////////////////////////////q6uq6urqXl5eXl5eXl5eXl5eXl5eXl5eenp7V1dX4+Pj///////////////////////8AAAD////////////4+PjOzs6lpaWXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5e6urrj4+P///////////////8AAAD////////////BwcGXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5fx8fH///////////8AAAD///////////+zs7OXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5eXl5fj4+P///////////8AAAD////////////IyMiXl5eXl5eXl5eXl5e6urqXl5eXl5eXl5eXl5esrKylpaWXl5eXl5eXl5eenp7x8fH///////////8AAAD////////////////Ozs7Ozs7V1dX4+Pj///+Xl5eXl5eXl5eXl5fOzs7////q6urOzs7Ozs7q6ur///////////////8AAAD///////////////////////////////////+Xl5eXl5eXl5eXl5fOzs7///////////////////////////////////8AAAD///////////////////////////////////+Xl5eXl5eXl5eXl5fOzs7///////////////////////////////////8AAAD///////////////////////////////////+Xl5eXl5eXl5eXl5fOzs7///////////////////////////////////8AAAD////////////////////////////////////IyMiXl5eXl5eenp7x8fH///////////////////////////////////8AAAD////////////////////////////////////////j4+Pj4+Px8fH///////////////////////////////////////8AAAD///////////////////////////////////////////////////////////////////////////////////////////8AAAD///////////////////////////////////////////////////////////////////////////////////////////8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAo=",
+		'defaultFaviconUrl_IE':		"https://www.clipperz.com/images/icons/misc/favicon.ico",
+
+		'donateSplashPanelIconUrl':	"./images/smiles_big.gif",
+
+		'icons_baseUrl':	"https://www.clipperz.com/images/icons",
+
+		'passwordGeneratorLowercaseCharset':	"abcdefghijklmnopqrstuvwxyz",
+		'passwordGeneratorUppercaseCharset':	"ABCDEFGHIJKLMNOPQRSTUVWXYZ",
+		'passwordGeneratorNumberCharset':		"0123456789",
+		'passwordGeneratorSymbolCharset':		"!@#$%^&*+?[]{}/|\\<>,.;:~=-_",
+
+		'_': ""
+	}
+}
+
+Clipperz.PM.Strings.defaultLanguages = {
+	'default':	"en-us",
+
+//	'de':	"de-de",
+//	'el':	"el-gr",
+//	'he':	"he-il",
+//	'ru':	"ru-ru",
+	
+	
+	'fr':	"fr-fr", 
+	'es':	"es-es", 
+	'zh':	"zh-cn", 
+	'ja':	"ja-jp", 
+	'pt':	"pt-br", 
+	'it':	"it-it",
+	'en': 	"en-us"
+}
+
+Clipperz.PM.Strings.inputTypeToRecordFieldType = {
+	'text': 'TXT',
+	'password': 'PWD',
+	'checkbox': 'CHECK',
+	'radio': 'RADIO',
+	'select': 'SELECT'
+};
+
+Clipperz.PM.Strings.Languages.setSelectedLanguage = function(aLanguage) {
+	var language;
+	var	selectedLanguage;
+	
+	language = (aLanguage || Clipperz.PM.Strings.preferredLanguage || 'default').toLowerCase();
+//MochiKit.Logging.logDebug("1 - language: " + language);
+	if (typeof(Clipperz.PM.Strings.defaultLanguages[language]) != 'undefined') {
+		language = Clipperz.PM.Strings.defaultLanguages[language];
+//MochiKit.Logging.logDebug("2 - language: " + language);
+	}
+
+	if (typeof(Clipperz.PM.Strings.Languages[language]) != 'undefined') {
+		selectedLanguage = language;
+//MochiKit.Logging.logDebug("### selectedLanguage full match: " + selectedLanguage);
+	} else if (typeof(Clipperz.PM.Strings.defaultLanguages[language.substr(0,2)]) != 'undefined') {
+		selectedLanguage = Clipperz.PM.Strings.defaultLanguages[language.substr(0,2)];
+//MochiKit.Logging.logDebug("### selectedLanguage partial match: " + selectedLanguage);
+	} else {
+		selectedLanguage = Clipperz.PM.Strings.defaultLanguages['default'];
+//MochiKit.Logging.logDebug("### selectedLanguage default match: " + selectedLanguage);
+	}
+	
+//MochiKit.Logging.logDebug("### selectedLanguage: " + selectedLanguage);
+	if (selectedLanguage != Clipperz.PM.Strings.selectedLanguage) {
+//MochiKit.Logging.logDebug(">>> setting Clipperz.PM.Strings.selectedLanguage: " + selectedLanguage);
+		Clipperz.PM.Strings.selectedLanguage = selectedLanguage;
+
+		MochiKit.Base.update(Clipperz.PM.Strings, Clipperz.PM.Strings.standardStrings)
+//MochiKit.Logging.logDebug("=== 1: " + Clipperz.PM.Strings['bookmarkletTabInstructions']);
+		MochiKit.Base.updatetree(Clipperz.PM.Strings, Clipperz.PM.Strings.Languages[Clipperz.PM.Strings.defaultLanguages['default']]);
+//MochiKit.Logging.logDebug("=== 2: " + Clipperz.PM.Strings['bookmarkletTabInstructions']);
+		MochiKit.Base.updatetree(Clipperz.PM.Strings, Clipperz.PM.Strings.GeneralSettings[Clipperz.PM.Strings.defaultLanguages['default']]);
+//MochiKit.Logging.logDebug("=== 3: " + Clipperz.PM.Strings['bookmarkletTabInstructions']);
+		MochiKit.Base.updatetree(Clipperz.PM.Strings, Clipperz.PM.Strings.Languages[selectedLanguage]);
+//MochiKit.Logging.logDebug("=== 4: " + Clipperz.PM.Strings['bookmarkletTabInstructions']);
+		MochiKit.Base.updatetree(Clipperz.PM.Strings, Clipperz.PM.Strings.GeneralSettings[selectedLanguage]);
+//MochiKit.Logging.logDebug("=== 5: " + Clipperz.PM.Strings['bookmarkletTabInstructions']);
+
+		Clipperz.NotificationCenter.notify(Clipperz.PM.Strings.Languages, 'switchLanguage', selectedLanguage);
+//MochiKit.Logging.logDebug("<<< setting Clipperz.PM.Strings.selectedLanguage. Done");
+	}
+}
+
+Clipperz.PM.Strings.Languages.initSetup = function() {
+	var	language;
+	var	languageParser;
+
+	language = navigator.language || navigator.userLanguage;	//	en, en-US, .... "de", "nb-no"
+	languageParser = new RegExp("language=([a-z]{2}(?:\-[a-z]{2})?)(\&|$)", "i");
+	if (languageParser.test(window.location.search)) {
+//MochiKit.Logging.logDebug("LANGUAGE specified in the query string");
+		language = RegExp.$1;
+	}
+
+//MochiKit.Logging.logDebug("+++ preferredLanguage: " + language);
+	Clipperz.PM.Strings.preferredLanguage = language.toLowerCase();
+//MochiKit.Logging.logDebug("## preferredLanguage: " + Clipperz.PM.Strings.preferredLanguage);
+	Clipperz.PM.Strings.Languages.setSelectedLanguage(Clipperz.PM.Strings.preferredLanguage);
+}
+
+//MochiKit.DOM.addLoadEvent(Clipperz.PM.Strings.Languages.initSetup);
diff --git a/frontend/beta/js/Clipperz/PM/Strings/MessagePanelConfigurations.js b/frontend/beta/js/Clipperz/PM/Strings/MessagePanelConfigurations.js
new file mode 100644
index 0000000..446e96c
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/MessagePanelConfigurations.js
@@ -0,0 +1,389 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Strings) == 'undefined') { Clipperz.PM.Strings = {}; }
+
+Clipperz.PM.Strings.messagePanelConfigurations = {
+
+
+	//-------------------------------------------------------------------------
+	//
+	// Registration - connection
+	//
+	'registration_verify': function() {
+		return {
+			'title': null,
+			'text':  Clipperz.PM.Strings['connectionRegistrationSendingRequestMessageText']
+		}
+	},
+
+	'registration_sendingCredentials': function() {
+		return {
+			'title': null,
+			'text':  Clipperz.PM.Strings['connectionRegistrationSendingCredentialsMessageText']
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	//
+	// One Time Password login message panel
+	//
+
+	'OTP_login_start': function() {
+		return  {
+			'title': Clipperz.PM.Strings['OTPloginMessagePanelInitialTitle'],
+			'text':  Clipperz.PM.Strings['OTPloginMessagePanelInitialText'],
+			'steps': '+3',
+			'buttons': {}
+		}
+	},
+
+	'OTP_login_loadingOTP': function() {
+		return {
+			'title': Clipperz.PM.Strings['OTPloginMessagePanelLoadingTitle'],
+			'text':  Clipperz.PM.Strings['OTPloginMessagePanelLoadingText']
+		}
+	},
+
+	'OTP_login_extractingPassphrase': function() {
+		return {
+			'title': Clipperz.PM.Strings['OTPloginMessagePanelProcessingTitle'],
+			'text':  Clipperz.PM.Strings['OTPloginMessagePanelProcessingText']
+		}
+	},
+	
+	
+	//-------------------------------------------------------------------------
+	//
+	// Login message panel
+	//
+	'login_start': function() {
+		return  {
+			'title': Clipperz.PM.Strings['loginMessagePanelInitialTitle'],
+			'text':  Clipperz.PM.Strings['loginMessagePanelInitialText'],
+			'steps': '+7',
+			'buttons': {
+				'ok': Clipperz.PM.Strings['loginMessagePanelInitialButtonLabel']
+			}
+		}
+	},
+
+	'login_connected': function() {
+		return {
+			'title': Clipperz.PM.Strings['loginMessagePanelConnectedTitle'],
+			'text':  Clipperz.PM.Strings['loginMessagePanelConnectedText'],
+			'buttons': {}
+		}
+	},
+
+	'login_failed':	function() {
+		return {
+			'title': Clipperz.PM.Strings['loginMessagePanelFailureTitle'],
+			'text':  Clipperz.PM.Strings['loginMessagePanelFailureText'],
+			'button': Clipperz.PM.Strings['loginMessagePanelFailureButtonLabel']
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	//
+	// Login message panel - connection
+	//
+	'connection_sendingCredentials': function() {
+		return {
+			'title': Clipperz.PM.Strings['connectionLoginSendingCredentialsMessageTitle'],
+			'text':  Clipperz.PM.Strings['connectionLoginSendingCredentialsMessageText']
+		}
+	},
+
+	'connection_credentialVerification': function() {
+		return {
+			'title': Clipperz.PM.Strings['connectionLoginCredentialsVerificationMessageTitle'],
+			'text':  Clipperz.PM.Strings['connectionLoginCredentialsVerificationMessageText']
+		}
+	},
+
+	'connection_loggedIn': function() {
+		return {
+			'title': Clipperz.PM.Strings['connectionLoginDoneMessageTitle'],
+			'text':  Clipperz.PM.Strings['connectionLoginDoneMessageText']
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	//
+	//	Login message panel - user
+	//
+	'connection_upgrading': function() {
+		return {
+			'title': Clipperz.PM.Strings['userLoginPanelUpgradingUserCredentialsMessageTitle'],
+			'text':  Clipperz.PM.Strings['userLoginPanelUpgradingUserCredentialsMessageText'],
+			'steps': '+1'
+		}
+	},
+	
+	'connection_done': function() {
+		return {
+			'title': Clipperz.PM.Strings['userLoginPanelConnectedMessageTitle'],
+			'text':  Clipperz.PM.Strings['userLoginPanelConnectedMessageText']
+		}
+	},
+	
+	'connection_tryOlderSchema': function() {
+		return {
+			'title': Clipperz.PM.Strings['userLoginPanelTryingAnOlderConnectionSchemaMessageTitle'],
+			'text': Clipperz.PM.Strings['userLoginPanelTryingAnOlderConnectionSchemaMessageText'],
+			'steps': '+4'
+		}
+	},
+	
+	'connection_loadingUserData': function() {
+		return {
+			'title': Clipperz.PM.Strings['userLoginPanelLoadingUserDataMessageTitle'],
+			'text': Clipperz.PM.Strings['userLoginPanelLoadingUserDataMessageText']
+		}
+	},
+	
+	'connection_decryptingUserData': function() {
+		return {
+			'title': Clipperz.PM.Strings['userLoginPanelDecryptingUserDataMessageTitle'],
+			'text': Clipperz.PM.Strings['userLoginPanelDecryptingUserDataMessageText'],
+			'steps': '+1'
+		}
+	},
+	
+	'connection_decryptingUserStatistics': function() {
+		return {
+			'title': Clipperz.PM.Strings['userLoginPanelDecryptingUserStatisticsMessageTitle'],
+			'text': Clipperz.PM.Strings['userLoginPanelDecryptingUserStatisticsMessageText']
+		}
+	},
+	
+	'collectingEntropy': function() {
+		return {
+			'text': Clipperz.PM.Strings['panelCollectingEntryopyMessageText'],
+			'steps': '+1'
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	//
+	// Cards block - delete card panel
+	//
+	'deleteRecord_collectData': function() {
+		return {
+			'title': Clipperz.PM.Strings['deleteRecordPanelCollectRecordDataMessageTitle'],
+			'text': Clipperz.PM.Strings['deleteRecordPanelCollectRecordDataMessageText']
+		}
+	},
+	
+	'deleteRecord_encryptData': function() {
+		return {
+			'title': Clipperz.PM.Strings['deleteRecordPanelEncryptUserDataMessageTitle'],
+			'text': Clipperz.PM.Strings['deleteRecordPanelEncryptUserDataMessageText']
+		}
+	},
+	
+	'deleteRecord_sendingData': function() {
+		return {
+			'title': Clipperz.PM.Strings['deleteRecordPanelSendingDataToTheServerMessageTitle'],
+			'text': Clipperz.PM.Strings['deleteRecordPanelSendingDataToTheServerMessageText']
+		}
+	},
+	
+	'deleteRecord_updatingInterface': function() {
+		return {
+			'title': Clipperz.PM.Strings['deleteRecordPanelUpdatingTheInterfaceMessageTitle'],
+			'text': Clipperz.PM.Strings['deleteRecordPanelUpdatingTheInterfaceMessageText']
+		}
+	},
+
+
+	//-------------------------------------------------------------------------
+	//
+	//	Cards block - save card panel
+	//
+	'saveCard_collectRecordInfo': function() {
+		return {
+			'title': Clipperz.PM.Strings['recordSaveChangesPanelCollectRecordInfoMessageTitle'],
+			'text': Clipperz.PM.Strings['recordSaveChangesPanelCollectRecordInfoMessageText']
+		}
+	},
+
+	'saveCard_encryptUserData': function() {
+		return {
+			'title': Clipperz.PM.Strings['recordSaveChangesPanelEncryptUserDataMessageTitle'],
+			'text': Clipperz.PM.Strings['recordSaveChangesPanelEncryptUserDataMessageText']
+		}
+	},
+
+	'saveCard_encryptRecordData': function() {
+		return {
+			'title': Clipperz.PM.Strings['recordSaveChangesPanelEncryptRecordDataMessageTitle'],
+			'text': Clipperz.PM.Strings['recordSaveChangesPanelEncryptRecordDataMessageText']
+		}
+	},
+
+	'saveCard_encryptRecordVersions': function() {
+		return {
+			'title': Clipperz.PM.Strings['recordSaveChangesPanelEncryptRecordVersionDataMessageTitle'],
+			'text': Clipperz.PM.Strings['recordSaveChangesPanelEncryptRecordVersionDataMessageText']
+		}
+	},
+
+	'saveCard_sendingData': function() {
+		return {
+			'title': Clipperz.PM.Strings['recordSaveChangesPanelSendingDataToTheServerMessageTitle'],
+			'text': Clipperz.PM.Strings['recordSaveChangesPanelSendingDataToTheServerMessageText']
+		}
+	},
+
+	'saveCard_updatingInterface': function() {
+		return {
+			'title': Clipperz.PM.Strings['recordSaveChangesPanelUpdatingTheInterfaceMessageTitle'],
+			'text': Clipperz.PM.Strings['recordSaveChangesPanelUpdatingTheInterfaceMessageText']
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	//
+	//	Account panel - user preferences
+	//
+	'account_savingPreferences_1': function() {
+		return {
+			'title': Clipperz.PM.Strings['accountPreferencesSavingPanelTitle_Step1'],
+			'text': Clipperz.PM.Strings['accountPreferencesSavingPanelText_Step1'],
+			'steps': '+3'
+		}
+	},
+
+	'account_savingPreferences_2': function() {
+		return {
+			'title': Clipperz.PM.Strings['accountPreferencesSavingPanelTitle_Step2'],
+			'text': Clipperz.PM.Strings['accountPreferencesSavingPanelText_Step2']
+		}
+	},
+
+
+	//-------------------------------------------------------------------------
+	//
+	//	Account panel - change credentials
+	//
+	'changeCredentials_encryptingData': function() {
+		return {
+			'title': Clipperz.PM.Strings['changeCredentialsPanelEncryptingDataMessageTitle'],
+			'text':  Clipperz.PM.Strings['changeCredentialsPanelEncryptingDataMessageText']
+		}
+	},
+
+	'changeCredentials_creatingNewCredentials': function() {
+		return {
+			'title': Clipperz.PM.Strings['changeCredentialsPanelCreatingNewCredentialsMessageTitle'],
+			'text':  Clipperz.PM.Strings['changeCredentialsPanelCreatingNewCredentialsMessageText']
+		}
+	},
+
+	'changeCredentials_sendingCredentials': function() {
+		return {
+			'title': Clipperz.PM.Strings['changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle'],
+			'text':  Clipperz.PM.Strings['changeCredentialsPanelSendingNewCredentialsToTheServerMessageText']
+		}
+	},
+
+	'changeCredentials_done': function() {
+		return {
+			'title': Clipperz.PM.Strings['changeCredentialsPanelDoneMessageTitle'],
+			'text':  Clipperz.PM.Strings['changeCredentialsPanelDoneMessageText']
+		}
+	},
+	
+	
+	//-------------------------------------------------------------------------
+	//
+	//	Account panel - change credentials
+	//
+	'saveOTP_encryptUserData': function() {
+		return {
+			'title': Clipperz.PM.Strings['saveOTP_encryptUserDataTitle'],
+			'text':  Clipperz.PM.Strings['saveOTP_encryptUserDataText'],
+			'steps': '+4'
+		}
+	},
+	
+	'saveOTP_encryptOTPData': function() {
+		return {
+			'title': Clipperz.PM.Strings['saveOTP_encryptOTPDataTitle'],
+			'text':  Clipperz.PM.Strings['saveOTP_encryptOTPDataText']
+		}
+	},
+	
+	'saveOTP_sendingData': function() {
+		return {
+			'title': Clipperz.PM.Strings['saveOTP_sendingDataTitle'],
+			'text':  Clipperz.PM.Strings['saveOTP_sendingDataText']
+		}
+	},
+
+	'saveOTP_updatingInterface': function() {
+		return {
+			'title': Clipperz.PM.Strings['saveOTP_updatingInterfaceTitle'],
+			'text':  Clipperz.PM.Strings['saveOTP_updatingInterfaceText']
+		}
+	},
+
+	
+	//-------------------------------------------------------------------------
+	//
+	//	Data panel - processingImportData
+	//
+	'parseImportData': function() {
+		return {
+			'title': Clipperz.PM.Strings['importData_parsingDataTitle'],
+			'text':  Clipperz.PM.Strings['importData_parsingDataText']
+		}
+	},
+
+	'previewImportData': function() {
+		return {
+			'title': Clipperz.PM.Strings['importData_previewingDataTitle'],
+			'text':  Clipperz.PM.Strings['importData_previewingDataText']
+		}
+	},
+	
+	'processingImportData': function() {
+		return {
+			'title': Clipperz.PM.Strings['importData_processingDataTitle'],
+			'text':  Clipperz.PM.Strings['importData_processingDataText']
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+}
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_de-DE.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_de-DE.js
new file mode 100644
index 0000000..ecc8a36
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_de-DE.js
@@ -0,0 +1,352 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+Clipperz.PM.Strings.Languages['de-DE'.toLowerCase()] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+'clipperzServiceDescription':	"<h2>Privatsphäre für Deine Daten</h2> <ul> <li> <h3>Clipperz heißt:</h3> <ul> <li> <p>sichere und einfache zu bedienene Passwortverwaltung</p> </li> <li> <p>eine effektive Lösung des einmaligen Anmeldens</p> </li> <li> <p>eine digitale Brieftasche für Deine vertraulichen Daten</p> </li> </ul> </li> <li> <h3>Clipperz bietet Dir:</h3> <ul> <li> <p>einfaches Speichern und Verwalten von Passwörtern und Webzugangsdaten</p> </li> <li> <p>schnelles unkompliziertes einloggen, ohne Eingabe des Benutzernamen und Passworts, bei Webdiensten</p> </li> <li> <p>Schutz aller Deiner persönlichen Daten: Zutrittscodes, PINs, Benutzernamen, Passwörter, Kreditkartennummern, &hellip;</p> </li> <li> <p>Deine Geheimnisse mit Familienmitgliedern und Freunden zu teilen (mehr dazu in Kürze)</p> </li> </ul> </li> <li> <h3>Clipperz ist:</h3> <ul> <li> <p>kostenlos und absolut anonym</p> </li> <li> <p>unkomplizierter Zugriff zu jeder Zeit von jedem Rechner</p> </li> <li> <p>ohne Download und Installation verwendbar</p> </li> <li> <p>ein Schutz gegen das Speichern von Passwörtern auf Deinem PC oder das Notieren auf Papier</p> </li> </ul> </li> <li> <h3>Clipperz Sicherheit:</h3> <ul> <li> <p>Deine sensiblen persönlichen Informationen werden lokal durch Deinen Browser verschlüsselt, bevor sie an Clipperz über das Internet gesendet werden</p> </li> <li> <p>Der Schlüssel für diese Daten ist der Sicherheitssatz, den nur Du kennst</p> </li> <li> <p>Clipperz speichert Deine sensiblen Daten nur in verschlüsselter Form und kann zu keinem Zeitpunkt diese entschlüssel und in ihrer ursprünglichen Klartextform zugänglich machen</p> </li> <li> <p>Clipperz basiert auf standart Verschlüsselungsverfahren. Nichts ausergewöhnliches – oder hand gestricktes</p> </li> <li> <p>Du kannst den Quellcode zu jeder Zeit anschauen, aber Du brauchst nichts von Kryptographie zu verstehen um ein glücklicher Anwender zu sein!</p> </li> </ul> </li> <li> <a href=\"http://www.clipperz.com\" target=\"_blank\">Weitere Informationen</a> </li> </ul> ",
+'loginFormTitle':	"Login zu Deinem Clipperz Konto",
+'loginFormUsernameLabel':	"Benutzernamen",
+'loginFormPassphraseLabel':	"Sicherheitssatz",
+'loginFormDontHaveAnAccountLabel':	"Du hast noch kein Clipperz Konto?",
+'loginFormCreateOneLabel':	"Konto erstellen",
+'loginFormForgotYourCredentialsLabel':	"Zugangsdaten vergessen?",
+'loginFormAarghThatsBadLabel':	"Misst! Dass ist schlecht!",
+'loginFormAfraidOfMaliciousScriptsLabel':	"verängstigt von bösartigen Scripts?",
+'loginFormVerifyTheCodeLabel':	"begutachte den Quellcode",
+'loginFormButtonLabel':	"Einloggen",
+'loginPanelSwithLanguageDescription':	"<h5>Wechsel zu Deiner vervorzugten Sprache</h5> ",
+'browserCompatibilityDescription':	"<p>Bessere und sicherere Clipperz-Erfahrung mit Firefox. Clipperz funktioniert auch mit Safari, Opera und MS Internet Explorer!</p> ",
+'loginMessagePanelInitialTitle':	"Du wirst eingeloggt…",
+'loginMessagePanelInitialButtonLabel':	"Abbruch",
+'loginMessagePanelConnectedTitle':	"Verbunden",
+'loginMessagePanelConnectedText':	"Fertig",
+'loginMessagePanelFailureTitle':	"Fehler",
+'loginMessagePanelFailureText':	"Login fehlgeschlagen",
+'loginMessagePanelFailureButtonLabel':	"Schließen",
+'connectionLoginSendingCredentialsMessageTitle':	"Prüfe Zugangsdaten",
+'connectionLoginSendingCredentialsMessageText':	"Sende Zugangsdaten",
+'connectionLoginCredentialsVerificationMessageTitle':	"Prüfe Zugangsdaten",
+'connectionLoginCredentialsVerificationMessageText':	"Führe SRP Authentifizierung durch",
+'connectionLoginDoneMessageTitle':	"Prüfe Zugangsdaten",
+'connectionLoginDoneMessageText':	"Verbunden",
+'userLoginPanelUpgradingUserCredentialsMessageTitle':	"Prüfe Zugangsdaten",
+'userLoginPanelUpgradingUserCredentialsMessageText':	"Aktualisierung Deiner Zugangsdaten auf ein neues Authentifizierungsschema",
+'userLoginPanelConnectedMessageTitle':	"Benutzer authentifiziert",
+'userLoginPanelConnectedMessageText':	"Login erfolgreich",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageTitle':	"Prüfe Zugangsdaten",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageText':	"Probiere älteres Authentifizierungsschema",
+'userLoginPanelLoadingUserDataMessageTitle':	"Benutzer authentifiziert",
+'userLoginPanelLoadingUserDataMessageText':	"Lade verschlüsselte Kartendaten von Clipperz",
+'userLoginPanelDecryptingUserDataMessageTitle':	"Benutzer authentifiziert",
+'userLoginPanelDecryptingUserDataMessageText':	"Lokale Entschlüsselung der Kartendaten",
+'userLoginPanelDecryptingUserStatisticsMessageTitle':	"Benutzer authentifiziert",
+'userLoginPanelDecryptingUserStatisticsMessageText':	"Lokale Entschlüsselung der Benutzerstatisik",
+'splashAlertTitle':	"Willkommen bei Clipperz!",
+'splashAlertText':	"<p>Sicherheitshinweis</p> <ul> <li> <p>Die Speicherung von Informationen bei Clipperz ist so sicher, wie der Sicherheitssatz den Du zum Schutz gewählt hast. Ist der Sicherheitssatz nicht bekannt, können keine Informationen abgefragt werden.</p> </li> <li> <p>Solltest Du Clipperz nutzen, um sensible und kritische persönliche Daten abzuspeichern, so empfehlen wir in jedem Fall die Nutzung eines langen Sicherheitssatzes als Passwort und die Nutzung von Sonderzeichen, Zahlen, Groß- und Kleinbuchstaben.</p> </li> <li> <p>Clipperz kann einen verlorenen Sicherheitssatz nicht wiederherstellen!</p> </li> </ul> <p>Weitere Informationen findest Du bei <a href=\"http://www.clipperz.com\" target=\"_blank\">Clipperz</a>.</p> ",
+'splashAlertCloseButtonLabel':	"Ok",
+'registrationFormTitle':	"Erstelle Dein Konto",
+'registrationFormUsernameLabel':	"Benutzernamen",
+'registrationFormPassphraseLabel':	"Sicherheitssatz",
+'registrationFormRetypePassphraseLabel':	"Wiederhole Sicherheitssatz",
+'registrationFormSafetyCheckLabel':	"Ich akzeptiere dass es Clipperz nicht möglich ist, einen verlorenen Sicherheitssatz wiederherzustellen.",
+'registrationFormTermsOfServiceCheckLabel':	"Ich habe die <a href='http://www.clipperz.com/terms_of_service' target='_blank'>Nutzungsbedingungen</a> gelesen, verstanden und akzeptiere diese.",
+'registrationFormDoYouAlreadyHaveAnAccountLabel':	"Hast Du bereits einen Zugang?",
+'registrationFormSimplyLoginLabel':	"Einloggen",
+'registrationFormButtonLabel':	"Anmelden",
+'registrationFormWarningMessageNotMatchingPassphrases':	"Deine Sicherheitssätze stimmen nicht überein. Bitte erneut eingeben.",
+'registrationFormWarningMessageSafetyCheckNotSelected':	"Bitte lese die Bedingungen und akzeptiere die Auswahlboxen weiter unten.",
+'registrationFormWarningMessageTermsOfServiceCheckNotSelected':	"Du musst die Nutzungsbedingungen akzeptieren.",
+'registrationMessagePanelInitialTitle':	"Benutzer wird angelegt…",
+'registrationMessagePanelInitialButtonLabel':	"Abbruch",
+'registrationMessagePanelRegistrationDoneTitle':	"Anmeldung",
+'registrationMessagePanelRegistrationDoneText':	"Fertig",
+'registrationMessagePanelFailureTitle':	"Anmerldung fehlgeschlagen",
+'registrationMessagePanelFailureButtonLabel':	"Schließen",
+'connectionRegistrationSendingRequestMessageText':	"Zugangsdaten werden geprüft",
+'connectionRegistrationSendingCredentialsMessageText':	"Sende Zugangsdaten",
+'registrationSplashPanelTitle':	"Sicherheitshinweis",
+'registrationSplashPanelDescription':	"<p>Dies sind Deine Clipperz Zugangsdaten, pass sehr gut auf sie auf. Clipperz wird diese kein zweites und weiteres mal anzeigen!</p> ",
+'registrationSplashPanelUsernameLabel':	"Benutzernamen",
+'registrationSplashPanelPassphraseLabel':	"Schlüsselsatz",
+'donateHeaderLinkLabel':	"spende",
+'creditsHeaderLinkLabel':	"credits",
+'feedbackHeaderLinkLabel':	"feedback",
+'helpHeaderLinkLabel':	"hilfe",
+'forumHeaderLinkLabel':	"forum",
+'recordMenuLabel':	"Karten",
+'accountMenuLabel':	"Benutzer",
+'dataMenuLabel':	"Daten",
+'contactsMenuLabel':	"Kontakt",
+'bookmarkletMenuLabel':	"Bookmarklet",
+'logoutMenuLabel':	"Ausloggen",
+'lockMenuLabel':	"Sperren",
+'lockTitle':	"Dieses Konto ist gesperrt",
+'lockDescription':	"<p>Bitte gebe Deinen Sicherheitssatz ein, um das Clipperz-Konto zu entsperren.</p> ",
+'unlockButtonLabel':	"Entsperren",
+'changePasswordTabLabel':	"Sicherheitssatz ändern",
+'changePasswordTabTitle':	"Sicherheitssatz ändern",
+'changePasswordFormUsernameLabel':	"Benutzername",
+'changePasswordFormOldPassphraseLabel':	"Alter Sicherheitssatz",
+'changePasswordFormNewPassphraseLabel':	"Neuer Sicherheitssatz",
+'changePasswordFormRetypePassphraseLabel':	"Wiederholdung neuen Sicherheitssatz",
+'changePasswordFormSafetyCheckboxLabel':	"Ich akzeptiere dass es Clipperz nicht möglich ist, einen verlorenen Sicherheitssatz wiederherzustellen.",
+'changePasswordFormSubmitLabel':	"Sicherheitssatz ändern",
+'changePasswordFormWrongUsernameWarning':	"Falscher Benutzername",
+'changePasswordFormWrongPassphraseWarning':	"Falscher Sicherheitssatz",
+'changePasswordFormWrongRetypePassphraseWarning':	"Deine Sicherheitssätze stimmen nicht überein. Bitte erneut eingeben.",
+'changePasswordFormSafetyCheckWarning':	"Bitte ließ die folgenden Hinweise und akzeptiere diese.",
+'changePasswordFormProgressDialogTitle':	"Ändere Zugangsdaten",
+'changePasswordFormProgressDialogConnectedMessageTitle':	"Verbunden",
+'changePasswordFormProgressDialogConnectedMessageText':	"Fertig",
+'changePasswordFormProgressDialogErrorMessageTitle':	"Fehler",
+'changePasswordFormProgressDialogErrorMessageText':	"Ändern der Zugangsdaten fehlgeschlagen!",
+'changeCredentialsPanelEncryptingDataMessageTitle':	"Ändere Sicherheitssatz",
+'changeCredentialsPanelEncryptingDataMessageText':	"Lokale Verschlüsselung der Kartendaten",
+'changeCredentialsPanelCreatingNewCredentialsMessageTitle':	"Ändere Sicherheitssatz",
+'changeCredentialsPanelCreatingNewCredentialsMessageText':	"Aktualisiere Zugangsdaten",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle':	"Ändere Sicherheitssatz",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageText':	"Sende verschlüsselte Zugangsdaten zu Clipperz",
+'changeCredentialsPanelDoneMessageTitle':	"Ändere Sicherheitssatz",
+'changeCredentialsPanelDoneMessageText':	"Fertig",
+'manageOTPTabLabel':	"Verwaltung des Sicheitssatzes für einmaliges Anmelden",
+'manageOTPTabTitle':	"Verwaltung des Sicheitssatzes für einmaliges Anmelden",
+'manageOTPTabDescription':	"<p>Der Sicherheitssatz für einmaliges Anmelden funktoniert wie Dein regulärer Sicherheitssatz, nur dass er nur einmal verwendet werden kann.</p> <p>Sollte der gleiche Sicherheitssatz zu einem späteren Zeitpunkt nocheinmal genutzt werden, wird dieser automatisch zurückgewießen und der Einlogvorgang scheitert.</p> <p>Sofort nach einem erfolgreichen Login wird der Sicherheitssatz für einmaliges Anmelden gelöscht und somit verhindert dass er ungewollt verwendet wird.</p> <p>Die Nutzung von Sicherheitssätzen für einmaliges Anmelden sind eine ideale Möglichkeit wenn Du verunsichert bist ob Trojaner, Spyware oder ähnliches auf Deinem Rechner vorhanden ist.</p> <p> <b>Es wird empfohlen Sicherheitssätze für einmaliges Anmelden beim Zugiff auf Clipperz zu verwenden, wenn man sich an öffentlichen Rechnern befindet, wie in Internet Cafes oder Bücherreien.</b> </p> <p> </p> <p> <b>Mehr dazu in Kürze ...</b> </p> ",
+'accountPreferencesLabel':	"Einstellungen",
+'accountPreferencesTabTitle':	"Einstellungen",
+'accountPreferencesLanguageTitle':	"Sprachenauswahl",
+'accountPreferencesLanguageDescription':	"<p>Wähle Deine bevorzugte Sprache, aus der unten stehenden Liste.</p> ",
+'accountPreferencesInterfaceTitle':	"Personalisiere Dein persönliches Clipperz-Erscheinungsbild",
+'accountPreferencesInterfaceDescription':	"<p>Passe dass Clipperz-Erscheinungsbild an Deine Wünsche an.</p> ",
+'saveUserPreferencesFormSubmitLabel':	"Speichern",
+'cancelUserPreferencesFormSubmitLabel':	"Abbruch",
+'accountPreferencesSavingPanelTitle_Step1':	"Speichere Einstellungen",
+'accountPreferencesSavingPanelText_Step1':	"Lokale Verschlüsselung der Einstellungen",
+'accountPreferencesSavingPanelTitle_Step2':	"Speichere Einstellungen",
+'accountPreferencesSavingPanelText_Step2':	"Sende verschlüsselte Einstellungen",
+'deleteAccountTabLabel':	"Konto löschen",
+'deleteAccountTabTitle':	"Konto löschen",
+'deleteAccountFormUsernameLabel':	"Benutzername",
+'deleteAccountFormPassphraseLabel':	"Sicherheitssatz",
+'deleteAccountFormSafetyCheckboxLabel':	"Ich bin mir bewusst, dass alle meine Daten gelöscht werden und dieser Vorgang in keinem Falle rückgängig gemacht werden kann.",
+'deleteAccountFormSubmitLabel':	"Konto löschens",
+'deleteAccountFormWrongUsernameWarning':	"Falscher Benutzername",
+'deleteAccountFormWrongPassphraseWarning':	"Falscher Sicherheitssatz",
+'deleteAccountFormSafetyCheckWarning':	"Bitte lese die Bedingungen und akzeptiere die Auswahlboxen weiter unten.",
+'accountPanelDeletingAccountPanelConfirmationTitle':	"ACHTUNG",
+'accountPanelDeleteAccountPanelConfirmationText':	"Bist Du sicher, dass Du den Zugang löschen möchtest?",
+'accountPanelDeleteAccountPanelConfirmButtonLabel':	"Ja",
+'accountPanelDeleteAccountPanelDenyButtonLabel':	"Nein",
+'offlineCopyTabLabel':	"Offline Kopie",
+'offlineCopyTabTitle':	"Offline Kopie",
+'offlineCopyTabDescription':	"<p>Mit nur einem Klick kannst Du alle Deine verschlüsselten Daten von dem Clipperz Server auf Deine Festplatte speichern und somit eine “nur lesbare” Offline Version anlegen. Diese Version ist auch dann verwendbar, wenn Du keine Verbindung ins Internet hast. (Zum Beispiel zum Speichern von Login-Informationen bei einem Hotspot)</p> <p>Die “nur lesbare” Version ist genauso sicher, wie die änderbare Version auf dem Server. Deine Daten werden niemals entschlüsselt gespeichert - beide Versionen verwenden die gleiche Art der Verschlüsselung und Entschlüsselung direkt im Browser.</p> <ol> <li> <p>Klicke auf den untenstehenden Link um die Offline Version herunterzuladen.</p> </li> <li> <p>Der Browser fragt Dich, was Du mit der Datei “Clipperz_YYYYMMDD.zip” machen möchtest. Speichere Sie auf Deine Festplatte.</p> </li> <li> <p>Unzip (dekomprimiere) die Datei. Du erhälst das Verzeichnis “Clipperz_YYYYMMDD”.</p> </li> <li> <p>Öffne das Verzeichnis “Clipperz_YYYYMMDD” und mache einen Doppelklick auf die Datei “index.html”.</p> </li> <li> <p>Gib Deinen Clipperz Benutzernamen und Sicherheitsschlüssel ein, um Zugriff auf Deine persönlichen Daten auch ohne Internetzugang zu erhalten.</p> </li> </ol> ",
+'offlineCopyDownloadLinkLabel':	"Download",
+'sharingTabLabel':	"Freigabe für gemeinsame Nutzung",
+'sharingTabTitle':	"Freigabe für gemeinsame Nutzung",
+'sharingTabDescription':	"<p>Häufig muss eine vertrauenswürdige Information mit mehreren Personen geteilt werden.</p> <p>Dies sollte so einfach sein, wie einem Kollegen die PIN für den Anrufbeantworter zu geben, wenn Du im Urlaub bist; jedoch so schwierig, wie berechtigten Erben Zugriff auf das Ersparte bei der Bank zu geben.</p> <p>Clipperz ermöglicht die einfache Freigabe für gemeinsam genutzte Informationen, an berechtigte Personen, durch einen einfachen Prozess.</p> <p> </p> <p> <b>Mehr dazu in Kürze ...</b> </p> ",
+'importTabLabel':	"Import",
+'importTabTitle':	"Import",
+'importTabDescription':	"<p> <b>In Kürze ...</b> </p> ",
+'printingTabLabel':	"Export",
+'printingTabTitle':	"Export",
+'printingTabDescription':	"<p> <b>Drucke deine Kartendaten</b> </p> <p>Klicke auf den untenstehenden Link. Es öffnet sich ein Fenster mit Deinen Kartendaten in einem druckerfreundlichen Format.</p> <p>Wenn Du den Ausdruck aus Absicherungsgründen nutzen möchtest, nutze lieber die Variante der sichereren “Offline Kopie”. Ein Ausdruck ist wie eine Notiz auf dem Scheibtisch und könnte von jedem ohne weiteres gelesen werden. Bewahre diesen an einem sicheren, für andere nicht zugänglichen Ort auf!</p> ",
+'printingLinkLabel':	"Druckerfreundliches Format",
+'contactsTabLabel':	"Kontakte",
+'contactsTabTitle':	"Kontakte",
+'bookmarkletTabLabel':	"Bookmarklet",
+'bookmarkletTabTitle':	"Bookmarklet",
+'bookmarkletTabDescription':	"<p>Ein Bookmarklet ist ein Werkezug, welches Dir mit einem Mausklick wichtige Funktionen ermöglicht. Es kann gespeichert und verwendet werden wie eine ganz normale Webseite, die Du in Deine Favoriten gespeichert hast.</p> <p>Das clipperz Bookmarklet ermöglicht Dir schnell und einfach neue Karten und Direkt-Logins für bestehende Karten anzulegen.</p> <p> <b>Bitte beachte: Das Bookmarklet enthält keine Informationen zu Deinem Zugang (wie Benutzernamen oder Passwort), das Bookmarklet ist ein generisches Werzeug, welches für jeden Clipperz Anwender den gleichen Code beinhaltet.</b> </p> <div> <p>Um das Bookmarklet zu installieren <b>ziehe</b> den unten stehenden Link in die Lesezeichen-Leiste Deines Browsers.</p> </div> ",
+'bookmarkletTabBookmarkletTitle':	"Zu Clipperz hinzufügen",
+'bookmarkletTabInstructions':	"<h3>Anlegen einer neuen Karte für das Direkt Login bei einem Webservice</h3> <ol> <li> <p>Öffne die Webseite, auf der das Anmeldeforumlar vorhanden ist. (Das ist die Seite, auf der Du normal Deine Zugangsdaten einträgst)</p> </li> <li> <p>Öffne das Boormarklet durch anklicken: ein Pop-Up Fenster erscheint und bietet Dir die Karteninformationen an.</p> </li> <li> <p>Kopiere von diesem Fenster den Inhalt des größten Textfeldes durch in die Zwischenablage (Makieren und STRG+C)</p> </li> <li> <p>Öffne Deinen Clipperz Zugang und wähle <b>Neue Karte anlegen</b>.</p> </li> <li> <p>Füge den Inhalt Deiner Zwischenablage in das Textfeld ein (STRG+V) und ergänze optional einen <b>Titel</b>.</p> </li> <li> <p>Drücke die <b>Anlegen</b> Schaltfläche, kontrolliere nocheinmal die Details, und wähle anschließend <b>Speichern<b>.</p> </li> </ol> <h3>Direkt Login Funktionalität zu einer bestehenden Karte ergänzen</h3> <ol> <li> <p>Gleich wie oben.</p> </li> <li> <p>Gleich wie oben.</p> </li> <li> <p>Gleich wie oben.</p> </li> <li> <p>Öffne Deinen Clipperz Zugang und wähle die Karte, die Du ändern möchtest. Klicke anschließend auf <b>Bearbeiten</b>.</p> </li> <li> <p>Füge den Inhalt Deiner Zwischenablage in das Textfeld für “Direkt Login” ein (STRG+V).</p> </li> <li> <p>Drücke auf <b>Direkt Login hinzufügen</b>, kontrolliere die Angabgen und wähle <b>Speichern</b>.</p> </li> </ol> <p> </p> <p>Weitere Informationen über das Bookmarklet findest Du <a href=\"http://www.clipperz.com/support/user_guide/bookmarklet\" target=\"_blank\">hier</a>.</p> ",
+'mainPanelDirectLoginBlockLabel':	"Direktes Login",
+'directLinkReferenceShowButtonLabel':	"zeigen",
+'mainPanelDirectLoginBlockDescription':	"<p>Add “direct logins” to sign in to your web accounts without typing usernames and passwords!</p> <p>“Direct logins” greatly enhance your password security since you can:</p> <ul> <li> <p>conveniently adopt and enter complex passwords;</p> </li> <li> <p>never re-use the same and easy-to-guess password.</p> </li> </ul> <p>Simple and quick configuration with the Clipperz <b>bookmarklet</b>.</p> <a href=\"http://www.clipperz.com/support/user_guide/direct_logins\" target=\"_blank\">Learn more about “direct logins”</a> ",
+'mainPanelRecordsBlockLabel':	"Karten",
+'mainPanelAddRecordButtonLabel':	"Neue Karte anlegen",
+'mainPanelRemoveRecordButtonLabel':	"Karte löschen",
+'mainPanelRecordFilterBlockAllLabel':	"all",
+'mainPanelRecordFilterBlockTagsLabel':	"tags",
+'mainPanelRecordFilterBlockSearchLabel':	"search",
+'recordDetailNoRecordAtAllTitle':	"Willkommen bei Clipperz!",
+'recordDetailNoRecordAtAllDescription':	"<h5>Beginne mit dem Hinzufügen von Karten zu Deinem Zugang.</h5> <p>Karten sind einfache und flexible Formulare, bei denen Du Deine Passwörter und andere vertrauenswürde Daten speichern kannst.</p> <p>Karten können Zugangsinformationen für eine WebSite, die Kombination Deines Fahrradschlosses, oder Daten Deiner Kreditkarte enthalten, ...</p> <h5>Vergiss nicht das Bookmarklet</h5> <p>Bevor Du beginnst, installiere Dir das “Add to Clipperz” Bookmarklet: Es vereinfacht Dir das anlegen von Karten und verbessert somit den Komfor.</p> <p>Gehe zum “Bookmarklet” Tabulator um herauszufinden, wie es installiert und verwendet werden kann.</p> <p> </p> <p>Dann klicke einfach auf den <b>Neue Karte anlegen</b> Button und genieße Deinen Clipperz Zugang.</p> <p> </p> <a href=\"http://www.clipperz.com/support/user_guide/managing_cards\" target=\"_blank\">Näheres zum Erstellen und Verwalten von Karten lernen</a> ",
+'newRecordWizardTitleBox':	"<h5>Bitte wähle eine Vorlage</h5> <p>Karten sind einfache und flexible Formulare, bei denen Du Passwörter oder jede Art von vertraulichen Informationen speichern kannst.</p> <p>Beginne mit der Auswahl einer der unten stehenden Vorlagen. Zu jeder Zeit kannst Du Deine Karten  durch hinzufügen oder entfernen von Feldern verändern.</p> ",
+'newRecordWizardBookmarkletConfigurationTitle':	"Direktes Login",
+'newRecordWizardBookmarkletConfigurationDescription':	"<p>Füge bitte unten den Konfigurationscode ein, den das Clipperz Bookmarklet erzeugt hat.</p> <p>Eine neue Karte mit einem vollständigen Direkt Login zu dem gewählten Webzugang wird angelegt.</p> ",
+'newRecordWizardCreateButtonLabel':	"Anlegen",
+'newRecordWizardCancelButtonLabel':	"Abbruch",
+'recordTemplates':	{
+	'WebAccount':	{
+		'title':	"Web Zugangsdaten",
+		'description':	"<p>Eine einfache Karte, die die Login Informationen für einen Online Service speichert.</p> ",
+		'fields':	{
+			'URL':	"Web Adresse",
+			'TXT':	"Benutzername / E-Mail",
+			'PWD':	"Passwort"
+		}
+	},
+	'BankAccount':	{
+		'title':	"Bank Zugangsdaten",
+		'description':	"<p>Speichere geschützt Deine Online Banking Zugangsdaten.</p> ",
+		'fields':	{
+			'TXT':	"Bank",
+			'TXT':	"Kontonummer",
+			'URL':	"Web Adresse",
+			'TXT':	"Online Zugangsdaten",
+			'PWD':	"Online Passwort"
+		}
+	},
+	'CreditCard':	{
+		'title':	"Kreditkarte",
+		'description':	"<p>Kartennummer, CVV2, Ablaufdatum und PIN zu jeder Zeit abrufbar bei Clipperz.</p> ",
+		'fields':	{
+			'TXT':	"Art (Visa, AmEx, ...)",
+			'TXT':	"Nummer",
+			'TXT':	"Inhaber",
+			'TXT':	"Ablaufdatum",
+			'TXT':	"CVV2",
+			'PWD':	"PIN",
+			'URL':	"Webseite",
+			'TXT':	"Online Zugangsdaten",
+			'PWD':	"Passwort"
+		}
+	},
+	'AddressBookEntry':	{
+		'title':	"Adressbuch Eintrag",
+		'description':	"<p>Clipperz kann auch als Dein neues privates Adressbuch agieren. Nutze diese Vorlage um einfach eine neuen Eintrag anzulegen.</p> ",
+		'fields':	{
+			'TXT':	"Name",
+			'TXT':	"Email",
+			'TXT':	"Telefon",
+			'TXT':	"Handy",
+			'ADDR':	"Adresse"
+		}
+	},
+	'Custom':	{
+		'title':	"Benutzerdefinierte Karte",
+		'description':	"<p>Egal welche Art von vertraulichen Informationen Du speichern musst, mit der benutzerdefinierten Karte kannst Du diese Informationen speichern.</p> ",
+		'fields':	{
+			'TXT':	"Feldname 1",
+			'TXT':	"Feldname 2",
+			'TXT':	"Feldname 3"
+		}
+	}
+},
+'recordFieldTypologies':	{
+	'TXT':	{
+		'description':	"simple text field",
+		'shortDescription':	"Text"
+	},
+	'PWD':	{
+		'description':	"simple text field, with default status set to hidden",
+		'shortDescription':	"Passwort"
+	},
+	'URL':	{
+		'description':	"simple text field in edit mode, that became an active url in view mode",
+		'shortDescription':	"Webadresse"
+	},
+	'DATE':	{
+		'description':	"a value set with a calendar helper",
+		'shortDescription':	"Datum"
+	},
+	'ADDR':	{
+		'description':	"just like the URL, but the active link points to Google Maps (or similar service) passing the address value as argument",
+		'shortDescription':	"Postanschrift"
+	},
+	'CHECK':	{
+		'description':	"check description",
+		'shortDescription':	"check"
+	},
+	'RADIO':	{
+		'description':	"radio description",
+		'shortDescription':	"radio"
+	},
+	'SELECT':	{
+		'description':	"select description",
+		'shortDescription':	"select"
+	}
+},
+'newRecordPanelGeneralExceptionTitle':	"Fehler",
+'newRecordPanelGeneralExceptionMessage':	"Der Konfigurationstext ist nicht gültig. Stelle sicher, dass Du den Text des Bookmarket Pop-Up eingefügt hast und versuch es nocheinmal.",
+'newRecordPanelWrongBookmarkletVersionExceptionTitle':	"Fehler",
+'newRecordPanelWrongBookmarkletVersionExceptionMessage':	"Der Konfigurationstext wurde von einer älteren Version des Bookmarklets erstellt. Bitte aktualisiere Dein Bookmarklet und probiere es erneut.",
+'newRecordPanelExceptionPanelCloseButtonLabel':	"Abbruch",
+'mainPanelDeletingRecordPanelConfirmationTitle':	"Lösche ausgewählte Karte",
+'mainPanelDeleteRecordPanelConfirmationText':	"Möschtest Du wirklich die ausgewählte Karte löschen?",
+'mainPanelDeleteRecordPanelConfirmButtonLabel':	"Ja",
+'mainPanelDeleteRecordPanelDenyButtonLabel':	"Nein",
+'mainPanelDeletingRecordPanelInitialTitle':	"Lösche ausgewählte Karte",
+'mainPanelDeletingRecordPanelCompletedText':	"Fertig",
+'deleteRecordPanelCollectRecordDataMessageTitle':	"Karte löschen",
+'deleteRecordPanelCollectRecordDataMessageText':	"Aktualisiere Kartenliste",
+'deleteRecordPanelEncryptUserDataMessageTitle':	"Karte löschen",
+'deleteRecordPanelEncryptUserDataMessageText':	"Lokale Verschlüsselung der Karten Kopfdaten",
+'deleteRecordPanelSendingDataToTheServerMessageTitle':	"Karte löschen",
+'deleteRecordPanelSendingDataToTheServerMessageText':	"Lade verschlüsselte Karten Kopfdaten zu Clipperz hoch",
+'deleteRecordPanelUpdatingTheInterfaceMessageTitle':	"Karte löschen",
+'deleteRecordPanelUpdatingTheInterfaceMessageText':	"Aktualisiere Benutzerschnittstelle",
+'recordDetailNoRecordSelectedTitle':	"Keine Karte ausgewählt",
+'recordDetailNoRecordSelectedDescription':	"<p>Bitte wähle aus der linken Liste eine Karte aus.</p> ",
+'recordDetailLoadingRecordMessage':	"Lade verschlüsselte Karte von Clipperz runter",
+'recordDetailDecryptingRecordMessage':	"Lokale entschlüsselung der Kartendaten",
+'recordDetailLoadingRecordVersionMessage':	"Herunterladen der aktuellsten Kartenversion",
+'recordDetailDecryptingRecordVersionMessage':	"Lokale Entschlüsselung der aktuellen Version",
+'recordDetailLoadingErrorMessageTitle':	"Fehler beim Herunterladen der Karte",
+'recordDetailNotesLabel':	"Notiz",
+'recordDetailLabelFieldColumnLabel':	"Feld Namen",
+'recordDetailDataFieldColumnLabel':	"Feld Daten",
+'recordDetailTypeFieldColumnLabel':	"Art",
+'recordDetailSavingChangesMessagePanelInitialTitle':	"Speichere Karte",
+'recordDetailAddFieldButtonLabel':	"Neues Feld hinzufügen",
+'recordDetailDirectLoginBlockTitle':	"Direkt Logins",
+'recordDetailNewDirectLoginDescription':	"<p>Direkt Login Konfiguration</p> ",
+'recordDetailDirectLoginBlockNoDirectLoginConfiguredDescription':	"<p>Enthält diese Karte Informationen um Zugriff auf ein Online Service zu erhalten?</p> <p>Verwende das Bookmarklet um ein “Direkt Login” mit nur einem Klick von Clipperz zu konfigurieren.</p> ",
+'recordDetailAddNewDirectLoginButtonLabel':	"Neues Direktlogin hinzufügen",
+'recordDetailEditButtonLabel':	"Bearbeiten",
+'recordDetailSaveButtonLabel':	"Speichern",
+'recordDetailCancelButtonLabel':	"Abbruch",
+'newRecordTitleLabel':	"_neue Karte_",
+'newDirectLoginLabelSuffix':	"",
+'recordSaveChangesPanelCollectRecordInfoMessageTitle':	"Karte speichern",
+'recordSaveChangesPanelCollectRecordInfoMessageText':	"Aktualisierung der Karten Kopfdaten",
+'recordSaveChangesPanelEncryptUserDataMessageTitle':	"Karte speichern",
+'recordSaveChangesPanelEncryptUserDataMessageText':	"Lokale Verschlüsselung der Karten Kopfdaten",
+'recordSaveChangesPanelEncryptRecordDataMessageTitle':	"Karte speichern",
+'recordSaveChangesPanelEncryptRecordDataMessageText':	"Lokale Verschlüsselung der Karten Informationen",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageTitle':	"Karte speichern",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageText':	"Lokale Verschlüsselung der Karten Versions Informationen",
+'recordSaveChangesPanelSendingDataToTheServerMessageTitle':	"Karte speichern",
+'recordSaveChangesPanelSendingDataToTheServerMessageText':	"Verschlüsselte Karten Kopfdaten auf Clipperz hochladen",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageTitle':	"Karte speichern",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageText':	"Aktualisierung der Benutzerschnittstelle",
+'exit':	"<h2> <b>Auf Wiedersehen! Danke, dass Du Clipperz verwendet hast.</b> </h2> <ul> <li> <h3>Hinweis:</h3> <ul> <li> <p>Speichere diese Seite in Deine Favoriten, damit Du auch in Zukunft dich sicher mit Clipperz verbinden kannst (solltest Du dies nicht bereits getan haben)</p> </li> <li> <p>Clipperz wird Dir niemals eine E-Mail senden, weil wir Dich niemals nach Deiner E-Mail Anschrift gefragt haben (und dies auch nie werden) – öffne daher niemals eine Mail, die wvon Clipperz zu sein scheint</p> </li> </ul> </li> </ul> <p> </p> <p>In 10 Sekunden wirdst Du auf eine Seite von Wikipedia umgeleitet, wo Du über eine herausragende Sicherheitslücke informiert wirst.</p> ",
+//'DWRUtilLoadingMessage':	"Lade Daten ...",
+'comingSoon':	"In Kürze ...",
+'panelCollectingEntryopyMessageText':	"Sammlung",
+'directLoginConfigurationCheckBoxFieldSelectedValue':	"Ja",
+'directLoginConfigurationCheckBoxFieldNotSelectedValue':	"Nein",
+
+__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_el-GR.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_el-GR.js
new file mode 100644
index 0000000..37e0a96
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_el-GR.js
@@ -0,0 +1,701 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+//=============================================================================
+//
+//		G R E E K  (el_GR)
+//
+//=============================================================================
+
+Clipperz.PM.Strings.Languages['el-gr'] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+
+//-----------------------------------------------------
+//	Login page - description
+	'clipperzServiceDescriptionConfig': [
+			{tag:'h2', html:'Κρατήστε το για τον Εαυτό Σας'},
+			{tag:'ul', children:[
+				{tag:'li', children:[
+					{tag:'h3', html:'Το Clipperz είναι:'},
+					{tag:'ul', children:[
+						{tag:'li', children:[{tag:'span', html:'Ένας ασφαλής και απλός τρόπος διαχείρησης όλων των κωδικών πρόσβασης σας'}]},
+						{tag:'li', children:[{tag:'span', html:'Μια αποτελεσματική λύση πρόσβασης σε δεδομένα/εφαρμογές με μοναδικό κωδικό'}]},
+						{tag:'li', children:[{tag:'span', html:'Μια ψηφιακή θυρίδα για τα απόρρητα δεδομένα σας'}]}
+					]}
+				]},
+				{tag:'li', children:[
+					{tag:'h3', html:'Με το Clipperz μπορείτε:'},
+					{tag:'ul', children:[
+						{tag:'li', children:[{tag:'span', html:'Να αποθηκεύσετε και να διαχειριστείτε όλους τους κωδικούς πρόσβασης και τα online πιστοποιητικά/διαπιστευτήρια σας'}]},
+						{tag:'li', children:[{tag:'span', html:'Να έχετε πρόσβαση (login) στις υπηρεσίες διαδικτύου χωρίς την εισαγωγή oνομάτων λογαρισμών χρήστη (username),ή, κωδικών πρόσβασης (passwords)'}]},
+						{tag:'li', children:[{tag:'span', html:'Να προστατεύσετε όλα τα προσωπικά δεδομένα σας: κωδικούς συναγερμών, PINs, αριθμούς πιστωτικών καρτών, ...'}]},
+						{tag:'li', children:[{tag:'span', html:'Να μοιραστείτε δεδομένα με μέλη της οικογένεια σας και τους συνεργάτες σας (σύντομα στην διάθεση σας)'}]}
+					]}
+				]},
+				{tag:'li', children:[
+					{tag:'h3', html:'Τα πλεονεκτήματα του Clipperz είναι:'},
+					{tag:'ul', children:[
+						{tag:'li', children:[{tag:'span', html:'Είναι δωρεάν και προσφέρει πρόσβαση ανώνυμα'}]},
+						{tag:'li', children:[{tag:'span', html:'Μπορεί να χρησιμοποιηθεί οποαδήποτε ώρα και από οποιοδήποτε τερματικό'}]},
+						{tag:'li', children:[{tag:'span', html:'Δεν απαιτεί την φόρτωση και εγκατάσταση οποιουδήποτε λογισμικού'}]},
+						{tag:'li', children:[{tag:'span', html:'Αποφεύγετε την διατήριση απορρήτων στον υπολογιστή σας ή σε έντυπη μορφή'}]}
+					]}
+				]},
+				{tag:'li', children:[
+					{tag:'h3', html:'Η ασφάλεια που παρέχει το Clipperz:'},
+					{tag:'ul', children:[
+						{tag:'li', children:[{tag:'span', html:'Τα απόρρητα δεδομένα σας κωδικοποιούνται τοπικά από τον διακομιστή σας (browser) πρίν να φορτωθούν στο Clipperz'}]},
+						{tag:'li', children:[{tag:'span', html:'Το κλειδί της κωδικοποίησης είναι μία φράση-κωδικός γνωστή μόνο σε εσάς'}]},
+						{tag:'li', children:[{tag:'span', html:'Το Clipperz φυλάσσει τα προσωπικά σας δεδομένα σε κωδικοποιημένη μορφή, και δεν μπορεί να έχει πρόσβαση σε αυτά στην αρχική τους μορφή'}]},
+						{tag:'li', children:[{tag:'span', html:'Το Clipperz χρησιμοποιεί επίσημες /πρότυπες μεθόδους κωδικοποίησης, και όχι αόριστα και εφάνταστα μοντέλα'}]},
+						{tag:'li', children:[{tag:'span', html:'Έχετε πρόσβαση στον πηγαίο κώδικα οποτεδήποτε το θελήσετε, και δεν χρειάζετε να γνωρίζετε τίποτα από κρυπτογράφηση για να είστε ένας ευχαριστημένος χρήστης!'}]}
+					]}
+				]},
+				{tag:'li', children:[
+					{tag:'a', href:"http://www.clipperz.com", target:'_blank', html:'Μάθετε περισσότερα'}
+				]}
+			]}
+		],
+
+// Login page - form	
+	'loginFormTitle':							"Συνδεθείτε με τον Clipperz λογαριασμό σας",
+	'loginFormUsernameLabel':					"Όνομα χρήστη",
+	'loginFormPassphraseLabel':					"Κωδική φράση",
+	'loginFormDontHaveAnAccountLabel':			"Δεν έχετε δημιουργήσει λογαριασμό?",
+	'loginFormCreateOneLabel':					"Δημιουργήστε έναν",
+	'loginFormForgotYourCredentialsLabel':		"Ξεχάσατε τα διαπιστευτήριά σας?",
+	'loginFormAarghThatsBadLabel':				"Ααααργκ! Αυτό είναι κακό!",
+	'loginFormAfraidOfMaliciousScriptsLabel':	"φοβάστε κακόβουλα προγράμματα (scripts)?",
+	'loginFormVerifyTheCodeLabel':				"Επαληθεύστε τον κωδικό",
+	'loginFormButtonLabel':						"Σύνδεση",
+
+// Login page - language selection
+	'loginPanelSwithLanguageDescriptionConfig':	[
+		{tag:'h5', html:"Αλλάξτε στην γλώσσα προτήμησης σας"}
+	],
+
+// Login page - browser compatibility
+	'browserCompatibilityDescriptionConfig':	[
+		{tag:'p', html:"Έχετε μία καλύτερη και πιό ασφαλή Clipperz εμπειρία χρησιμοποιόντας τον Firefox. Ωστόσο το Clipperz συνεργάζετε άψογα με Opera και MS Internet Explorer!"}
+	], 
+
+// Login message panel
+	'loginMessagePanelInitialTitle':			"Γίνεται σύνδεση ...",
+	'loginMessagePanelInitialButtonLabel':		"Ακύρωση",
+	'loginMessagePanelConnectedTitle':			"Συνδεθήκατε",
+	'loginMessagePanelConnectedText':			"Ολοκληρώθηκε",
+	'loginMessagePanelFailureTitle':			"Λάθος",
+	'loginMessagePanelFailureText':				"Η σύνδεση χρήστη απέτυχε",
+	'loginMessagePanelFailureButtonLabel':		"Κλείσιμο",
+
+// Login message panel - connection
+	'connectionLoginSendingCredentialsMessageTitle':		"Γίνεται επαλήθευση διαπιστευτηρίων",
+	'connectionLoginSendingCredentialsMessageText':			"Αποστέλλονται διαπιστευτήρια",
+	'connectionLoginCredentialsVerificationMessageTitle':	"Γίνεται επαλήθευση διαπιστευτηρίων",
+	'connectionLoginCredentialsVerificationMessageText':	"Εκτέλεση πιστοποίησης SRP ",
+	'connectionLoginDoneMessageTitle':						"Γίνεται επαλήθευση διαπιστευτηρίων",
+	'connectionLoginDoneMessageText':						"Συνδεδεμένος",
+	
+//	Login message panel - user
+	'userLoginPanelUpgradingUserCredentialsMessageTitle':	   				"Γίνεται επαλήθευση διαπιστευτηρίων",
+	'userLoginPanelUpgradingUserCredentialsMessageText':	   				"Αναβάθμηση των διαπιστευτηρίων σας σε ένα νέο σζήμα πιστοποίησης",
+	'userLoginPanelConnectedMessageTitle':					   				"Χρήστης πιστοποιήθηκε ",
+	'userLoginPanelConnectedMessageText':					   				"Συνδεθήκατε με επιτυχία",
+	'userLoginPanelTryingAnOlderConnectionSchemaMessageTitle': 				"Γίνεται επαλήθευση διαπιστευτηρίων",
+	'userLoginPanelTryingAnOlderConnectionSchemaMessageText':  				"Trying an older authentication schema",
+	'userLoginPanelLoadingUserDataMessageTitle':			   				"Χρήστης πιστοποιήθηκε ",
+	'userLoginPanelLoadingUserDataMessageText':				   				"Downloading encrypted card headers from Clipperz",
+	'userLoginPanelDecryptingUserDataMessageTitle':							"Χρήστης πιστοποιήθηκε ",
+	'userLoginPanelDecryptingUserDataMessageText':							"Local decryption of card headers",
+	'userLoginPanelDecryptingUserStatisticsMessageTitle':					"Χρήστης πιστοποιήθηκε ",
+	'userLoginPanelDecryptingUserStatisticsMessageText':					"Local decryption of usage statistics",
+	
+//-----------------------------------------------------	
+//	Registration page - splash alert
+	'splashAlertTitle':	"Καλώς ήλθατε στο Clipperz!",
+	'splashAlertTextConfig': [
+			{tag:'p', html:'Μερικές συμβουλές ασφαλείας'},
+			{tag:'ul', children:[
+				{tag:'li', children:[{tag:'span', html:'Η αποθήκευση των δεδομένων σας στο Clipperz είναι τόσο ασφαλής, όσο η κωδική φράση που επιλέγετε για να τα προστατεύσετε. Κανένας δεν θα έχει πρόσβαση σε αυτά, εκτός αν γνωρίζει την κωδική φράση σας.'}]},
+				{tag:'li', children:[{tag:'span', html:'Αν πρόκειται να χρησιμοποιήσετε το Clipperz για ασφαλή προστασία ευαίσθητων ή σημαντικών πληροφοριών, βεβαιωθείτε ότι θα χρησιμοποιήσετε μία “γερή” κωδική φράση. Όσο μεγαλύτερη, τόσο καλύτερη!'}]},
+				{tag:'li', children:[{tag:'span', html:'Το Clipperz δεν θα έχει τη δυνατότητα να ανακτήσει μία χαμένη κωδική φράση!'}]}
+			]},
+			{tag:'p', html:'Για περισσότερες πληροφορίες, παρακαλώ ανατρέξτε στο <a href=\"http://www.clipperz.com\" target=\"_blank\">Clipperz</a>.'}
+		],
+	'splashAlertCloseButtonLabel':	"Εντάξει",
+	
+// Registration page - form	
+	'registrationFormTitle':								"Δημιουργήστε λογαριασμό",
+	'registrationFormUsernameLabel':						"Όνομα χρήστη",
+	'registrationFormPassphraseLabel':						"Κωδική φράση",
+	'registrationFormRetypePassphraseLabel':				"Εισάγετε ξανά την κωδική φράση",
+	'registrationFormSafetyCheckLabel':						"Κατανοώ πως το Clipperz δεν θα μπορεί να ανακτήσει μία χαμένη κωδική φράση.",
+	'registrationFormTermsOfServiceCheckLabel':				"Έχω διαβάσει και αποδέχομαι τους Όρους Χρήσης <a href='http://www.clipperz.com/terms_of_service' target='_blank'>Όρους Χρήσης</a>.",
+	'registrationFormDoYouAlreadyHaveAnAccountLabel':		"Έχετε ήδη έναν λογαριασμό?",
+	'registrationFormSimplyLoginLabel':						"απλώς συνδεθείτε",
+	'registrationFormButtonLabel':							"Εγγραφείτε",
+
+// Registration page - warning messages
+	'registrationFormWarningMessageNotMatchingPassphrases':	"Οι κωδικές φράσεις που εισάγατε δεν ταιριάζουν. Παρακαλώ ξαναπροσπαθήστε.",
+	'registrationFormWarningMessageSafetyCheckNotSelected':	"Παρακαλώ διαβάστε και επιλέξτε όλες τις παρακάτω επιλογές.",
+	'registrationFormWarningMessageTermsOfServiceCheckNotSelected':	"Πρέπει να αποδεχθείτε τους Όρους Χρήσης.",
+
+// Registration message panel	
+	'registrationMessagePanelInitialTitle':					"Δημιουργία λογαριασμού ...",
+	'registrationMessagePanelInitialButtonLabel':			"Ακύρωση",
+	'registrationMessagePanelRegistrationDoneTitle':		"Εγγραφή",
+	'registrationMessagePanelRegistrationDoneText':			"Ολοκληρώθηκε",
+	'registrationMessagePanelFailureTitle':					"Η εγγραφή απέτυχε",
+	'registrationMessagePanelFailureButtonLabel':			"Κλείσιμο",
+
+// Registration - connection
+	'connectionRegistrationSendingRequestMessageText':		"Γίνεται επαλήθευση διαπιστευτηρίων",
+	'connectionRegistrationSendingCredentialsMessageText':	"Αποστέλλονται διαπιστευτήρια",
+
+//-----------------------------------------------------	
+// Registration splash panel
+	'registrationSplashPanelTitle':	"Συμβουλές Ασφαλείας",
+	'registrationSplashPanelDescriptionConfig': [					
+			{tag:'p', html:'Αυτά είναι τα διαπιστευτήριά σας στο Clipperz, δείτε τα προσεκτικά. Το Clipperz δεν θα απεικονίσει το όνομα χρήστη και την κωδική σας φράση δεύτερη φορά!'}
+		],
+	'registrationSplashPanelUsernameLabel':		"όνομα χρήστη",	
+	'registrationSplashPanelPassphraseLabel':	"κωδική φράση",
+	
+//-----------------------------------------------------	
+//	Header links
+	'donateHeaderLinkLabel':	"donate",
+	'creditsHeaderLinkLabel':	"credits",
+	'feedbackHeaderLinkLabel':	"feedback", 
+	'helpHeaderLinkLabel':		"Βοήθεια", 
+	'forumHeaderLinkLabel':		"forum",	
+	
+//-----------------------------------------------------	
+//	Menu labels
+	'recordMenuLabel':		"cards",
+	'accountMenuLabel':		"Λογαριασμός",
+	'dataMenuLabel':		"Δεδομένα",
+	'contactsMenuLabel':	"Επαφές",
+	'bookmarkletMenuLabel':	"bookmarklet",
+	'logoutMenuLabel':		"Αποσύνδεση",
+	'lockMenuLabel':		"lock",
+
+//-----------------------------------------------------
+//	Lock dialog
+	'lockTitle':				"The account is locked",
+	'lockDescriptionConfig':	[
+		{tag:'p', html:'To unlock your account, please insert your passphrase'}
+	],
+	'unlockButtonLabel':		"Unlock",
+		
+//-----------------------------------------------------
+//	Account panel - change passphrase
+	'changePasswordTabLabel':	"Αλλάξτε την κωδική φράση σας",
+	'changePasswordTabTitle':	"Αλλάξτε την κωδική φράση σας",
+
+//	Account panel - change passphrase - form
+	'changePasswordFormUsernameLabel':			"όνομα χρήστη",
+	'changePasswordFormOldPassphraseLabel':		"παλαιά κωδική φράση",
+	'changePasswordFormNewPassphraseLabel':		"νέα κωδική φράση",
+	'changePasswordFormRetypePassphraseLabel':	"Εισάγετε ξανά τη νέα κωδική φράση",
+	'changePasswordFormSafetyCheckboxLabel':	"Κατανοώ πως το Clipperz δεν θα μπορεί να ανακτήσει μία χαμένη κωδική φράση.",
+	'changePasswordFormSubmitLabel':			"Αλλάξτε την κωδική φράση σας",
+
+//	Account panel - change passphrase - warnings
+	'changePasswordFormWrongUsernameWarning':			"Λάθος όνομα χρήστη",	
+	'changePasswordFormWrongPassphraseWarning':			"Λάθος κωδική φράση",
+	'changePasswordFormWrongRetypePassphraseWarning':	"Οι κωδικές φράσεις που εισάγατε δεν ταιριάζουν. Παρακαλώ ξαναπροσπαθήστε.",
+	'changePasswordFormSafetyCheckWarning':				"Παρακαλώ διαβάστε και επιλέξτε όλες τις παρακάτω επιλογές.",
+
+//	Account panel - change passphrase - progress dialog
+	'changePasswordFormProgressDialogTitle':								"Γίνεται αλλαγή διαπιστευτηρίων χρήστη",
+	'changePasswordFormProgressDialogConnectedMessageTitle':				"Συνδεδεμένος",
+	'changePasswordFormProgressDialogConnectedMessageText':					"Ολοκληρώθηκε",
+	'changePasswordFormProgressDialogErrorMessageTitle':					"Σφάλμα",
+	'changePasswordFormProgressDialogErrorMessageText':						"Απέτυχε η αλλαγή διαπιστευτηρίων!",
+	
+	'changeCredentialsPanelEncryptingDataMessageTitle':		   				"Γίνεται αλλαγή της κωδικής φράσης σας",
+	'changeCredentialsPanelEncryptingDataMessageText':						"Local encryption of card headers",
+	'changeCredentialsPanelCreatingNewCredentialsMessageTitle':				"Γίνεται αλλαγή της κωδικής φράσης σας",
+	'changeCredentialsPanelCreatingNewCredentialsMessageText':				"Γίνεται ανανέωση των διαπιστευτηρίων σας",
+	'changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle':	"Γίνεται αλλαγή της κωδικής φράσης σας",
+	'changeCredentialsPanelSendingNewCredentialsToTheServerMessageText':	"Uploading your encrypted credentials to Clipperz",
+	'changeCredentialsPanelDoneMessageTitle':								"Γίνεται αλλαγή της κωδικής φράσης σας",
+	'changeCredentialsPanelDoneMessageText':								"Ολοκληρώθηκε",
+			
+//-----------------------------------------------------
+//	Account panel - manage OTP
+	'manageOTPTabLabel':		"Manage your one-time passphrases",
+	'manageOTPTabTitle':		"Manage your one-time passphrases",	
+
+//	Account panel - manage OTP - description	
+	'manageOTPTabDescriptionConfig':	[
+		{tag:'p', html:"A one-time passphrase works like your regular passphrase, but can be used only once."},
+		{tag:'p', html:"If the same passphrase is used again at a later stage in a login attempt it will be rejected and the login process will fail."},
+		{tag:'p', html:"Immediately after a successful login, your one-time passphrase will be deleted preventing any fraudulent access."},
+		{tag:'p', html:"One-time passwords are an excellent choice if one is concerned about keyloggers or spyware infections that may be collecting data from compromised machines."},
+		{tag:'p', html:"<b>It's strongly advisable to use one-time passphrases when accessing Clipperz from public terminals, such as Internet cafes and libraries.</b>"},
+		{tag:'p', html:""},
+		{tag:'p', html:"<b>Coming soon ...</b>"}
+	],
+
+//-----------------------------------------------------
+// Account panel - user preferences
+	'accountPreferencesLabel':			"Προτιμήσεις",
+	'accountPreferencesTabTitle':		"Προτιμήσεις",
+
+// Account panel - user preferences - description
+	'accountPreferencesLanguageTitle':	"Επιλογή Γλώσσας",
+	'accountPreferencesLanguageDescriptionConfig': [
+		{tag:'p', html:"Choose your preferred language from the list below."}
+	],
+
+	'accountPreferencesInterfaceTitle':	"Interface customization",
+	'accountPreferencesInterfaceDescriptionConfig': [
+		{tag:'p', html:"Tune the Clipperz interface to your needs."}
+	],
+
+// Account panel - user preferences - form
+	'saveUserPreferencesFormSubmitLabel':						"Αποθήκευση",
+	'cancelUserPreferencesFormSubmitLabel':						"Ακύρωση",
+
+// Account panel - user preferences - panel
+	'accountPreferencesSavingPanelTitle_Step1':		"Saving preferences",
+	'accountPreferencesSavingPanelText_Step1':		"Local encryption of your preferences",
+	'accountPreferencesSavingPanelTitle_Step2':		"Saving preferences",
+	'accountPreferencesSavingPanelText_Step2':		"Sending encrypted preferences to Clipperz",
+	
+//-----------------------------------------------------
+//	Account panel - delete account
+	'deleteAccountTabLabel':	"Διαγράψτε τον λογαριασμό σας",	
+	'deleteAccountTabTitle':	"Γίνεται διαγραφή του λογαριασμού σας",
+
+//	Account panel - delete account - form
+	'deleteAccountFormUsernameLabel': 		"όνομα χρήστη",
+	'deleteAccountFormPassphraseLabel':		"κωδική φράση",
+	'deleteAccountFormSafetyCheckboxLabel':	"Κατανοώ πως όλα τα δεδομένα μου θα διαγραφούν και πως αυτή η πράξη είναι μη αναστρέψιμη.",
+	'deleteAccountFormSubmitLabel':			"Διαγράψτε τον λογαριασμό μου",
+
+//	Account panel - delete account - warnings
+	'deleteAccountFormWrongUsernameWarning':	"λάθος όνομα χρήστη",
+	'deleteAccountFormWrongPassphraseWarning':	"λάθος κωδική φράση",
+	'deleteAccountFormSafetyCheckWarning':		"Παρακαλώ διαβάστε και επιλέξτε την παρακάτω επιλογή.",
+
+//	Account panel - delete account - confirmation
+	'accountPanelDeletingAccountPanelConfirmationTitle':	"ΠΡΟΣΟΧΗ",
+	'accountPanelDeleteAccountPanelConfirmationText':		"Είστε σίγουρος/η ότι θέλετε να διαγράψετε αυτόν τον λογαριασμό?",
+	'accountPanelDeleteAccountPanelConfirmButtonLabel':		"Ναι",
+	'accountPanelDeleteAccountPanelDenyButtonLabel':		"Όχι",
+
+//-----------------------------------------------------
+//	Data panel - offline copy
+	'offlineCopyTabLabel':	"Offline copy",
+	'offlineCopyTabTitle':	"Offline copy",
+	
+// 	Data panel - offline copy - description
+	'offlineCopyTabDescriptionConfig': [
+		{tag:'p', html:"With just one click you can dump all your encrypted data from Clipperz servers to your hard disk and create a read-only offline version of Clipperz to be used when you are not connected to the Internet."},
+		{tag:'p', html:"The read-only version is as secure as the read-and-write one and will not expose your data to higher risks since they both share the same code and security architecture."},
+		{tag:'ol', children:[
+			{tag:'li', children:[{tag:'span', html:"Click the link below to download the offline copy."}]},
+			{tag:'li', children:[{tag:'span', html:"The browser will ask you what to do with the “Clipperz_YYYYMMDD.zip” file. Save it on your hard disk."}]},
+			{tag:'li', children:[{tag:'span', html:"Unzip the file to reveal the “Clipperz_YYYYMMDD” folder."}]},
+			{tag:'li', children:[{tag:'span', html:"Open the “Clipperz_YYYYMMDD” folder and double click on the “index.html” file."}]},
+			{tag:'li', children:[{tag:'span', html:"Enter the usual username and passphrase and access your private data without an Internet connection."}]}
+		]}
+	],
+	'offlineCopyDownloadLinkLabel':	"Download",
+
+//-----------------------------------------------------
+//	Data panel - sharing
+	'sharingTabLabel':	"Sharing",
+	'sharingTabTitle':	"Sharing",
+
+//	Data panel - sharing - description
+	'sharingTabDescriptionConfig':	[
+		{tag:'p', html:"Quite often a confidential piece of information needs to be shared with one or more persons."},
+		{tag:'p', html:"This could be as simple as giving your colleague the access code of your voice mailbox when you are out of the office, or as complicated as enabling the entitled heirs to access your safe deposit box at the local bank when you pass on."},
+		{tag:'p', html:"Clipperz can make sharing your secrets a secure and straightforward process."},
+		{tag:'p', html:""},
+		{tag:'p', html:"<b>Coming soon ...</b>"}
+	],
+	
+//-----------------------------------------------------
+// 	Data panel - import
+	'importTabLabel':	"Εισαγωγή",
+	'importTabTitle':	"Εισαγωγή",
+
+// 	Data panel - import - description
+	'importTabDescriptionConfig':	[
+		{tag:'p', html:"<b>Σύντομα κοντά σας ...</b>"}
+	],
+
+//-----------------------------------------------------
+//	Data panel - export
+	'printingTabLabel':	"Εξαγωγή",
+	'printingTabTitle':	"Εξαγωγή",
+
+//	Data panel - export - description “”
+		'printingTabDescriptionConfig':	[
+		{tag:'p', html:"<b>Print your data</b>"},
+		{tag:'p', html:"Clicking on the link below will open a new window displaying all your cards in a printable format."},
+		{tag:'p', html:"If you are going to print for backup purposes, please consider the more safe option provided by the creating an “offline copy”."}
+	],
+	'printingLinkLabel':	"Έκδοση Εκτύπωσης",
+	
+//-------------------------------------------------------------------
+//	Contacts panel
+	'contactsTabLabel':	"Contacts",
+	'contactsTabTitle':	"Contacts",
+
+//-------------------------------------------------------------------
+//	Bookmarklet panel
+	'bookmarkletTabLabel':				"Bookmarklet",
+	'bookmarkletTabTitle':				"Bookmarklet",
+
+//	Bookmarklet panel - description
+	'bookmarkletTabDescriptionConfig':	[
+		{tag:'p', html:"A bookmarklet is a simple “one-click” tool that can perform very useful tasks. It can be saved and used like a normal web page bookmark."},
+		{tag:'p', html:"The Clipperz bookmarklet will help you to quickly create new cards and new “direct logins” within existing cards."}, 
+		{tag:'p', html:"<b>Please note that the bookmarklet does not include any information related to your account (e.g. your username or passphrase), the bookmarklet is a general tool containing the same code for every Clipperz user.</b>"},
+		{tag:'div', children:[
+			{tag:'p', html:"To install the bookmarklet <b>drag</b> the link below to the bookmark bar of your browser."}
+		]}
+	],
+	'bookmarkletTabBookmarkletTitle':	"Προσθήκη στο Clipperz",
+
+//	Bookmarklet panel - instructions
+	'bookmarkletTabInstructionsConfig':	[
+		{tag:'h3', html:"How to create a new card inclusive of a “direct login” link to an online service"},
+		{tag:'ol', children:[
+			{tag:'li', children:[{tag:'span', html:"Open the web page where the login form is hosted. (this is the page where you usually enter your sign-in credentials)"}]},
+			{tag:'li', children:[{tag:'span', html:"Launch the bookmarklet by clicking on it: a pop-up window will appear over the web page."}]},
+			{tag:'li', children:[{tag:'span', html:"Copy to the clipboard the content of the large text area within the pop-up. (ctrl-C)"}]},
+			{tag:'li', children:[{tag:'span', html:"Enter your Clipperz account and click on the <b>Add new card</b> button."}]},
+			{tag:'li', children:[{tag:'span', html:"Select the “Direct login” template and paste the content of the clipboard to the large text area in the form. (ctrl-V)"}]},
+			{tag:'li', children:[{tag:'span', html:"Press the <b>Create</b> button, complete and review the details, then click <b>Save</b>."}]}
+		]},
+		{tag:'h3', html:"How to add a “direct login” link to an existing card"},
+		{tag:'ol', children:[
+			{tag:'li', children:[{tag:'span', html:"Same as above."}]},
+			{tag:'li', children:[{tag:'span', html:"Same as above."}]},
+			{tag:'li', children:[{tag:'span', html:"Same as above."}]},
+			{tag:'li', children:[{tag:'span', html:"Enter your Clipperz account and select the card containing the credentials for the web service you just visited and click the <b>Edit</b> button."}]},
+			{tag:'li', children:[{tag:'span', html:"Paste the content of the clipboard to the large text area in the “Direct logins” section. (ctrl-V)"}]},
+			{tag:'li', children:[{tag:'span', html:"Press the <b>Add direct login</b> button, review the details and then click <b>Save</b>."}]}
+		]},
+		{tag:'p', html:""},
+		{tag:'p', html:"Further information about the bookmarklet are <a href=\"http://www.clipperz.com/support/user_guide/bookmarklet\" target=\"_blank\">available here</a>."}
+	],
+
+//-------------------------------------------------------------------
+// Direct logins block
+	'mainPanelDirectLoginBlockLabel':		"Απευθείας σύνδεση",
+	'directLinkReferenceShowButtonLabel':	"Επίδειξη",
+	
+// Direct logins - blank slate	“”
+	'mainPanelDirectLoginBlockDescriptionConfig':	[	
+		{tag:'p', html:"Add “direct logins” to sign in to your web accounts without typing usernames and passwords!"},
+		{tag:'p', html:"“Direct logins” greatly enhance your password security since you can:"},
+		{tag:'ul', children:[
+			{tag:'li', children:[{tag:'span', html:"conveniently adopt and enter complex passwords;"}]},
+			{tag:'li', children:[{tag:'span', html:"never re-use the same and easy-to-guess password."}]}
+		]},
+		{tag:'p', html:"Simple and quick configuration with the Clipperz <b>bookmarklet</b>."},
+		{tag:'a', href:"http://www.clipperz.com/support/user_guide/direct_logins", target:'_blank', html:'Learn more about “direct logins”'}		
+	],
+
+//-------------------------------------------------------------------
+// Cards block		
+	'mainPanelRecordsBlockLabel':		"Κάρτες",
+	'mainPanelAddRecordButtonLabel':	"Προσθήκη νέας Κάρτας ",		
+	'mainPanelRemoveRecordButtonLabel':	"Διαγραφή κάρτας",		
+
+// Cards block - filter tabs
+	'mainPanelRecordFilterBlockAllLabel':		"Όλα",
+	'mainPanelRecordFilterBlockTagsLabel':		"Επιλογές",
+	'mainPanelRecordFilterBlockSearchLabel':	"Αναζήτηση",
+	
+// Cards block - blank slate
+	'recordDetailNoRecordAtAllTitle':				"Welcome to Clipperz!",
+	'recordDetailNoRecordAtAllDescriptionConfig':	[
+			{tag:'h5', html:'Get started by adding cards to your account.'},
+			{tag:'p', html:'Cards are simple and flexible forms where you can store your passwords and any other confidential data.'},
+			{tag:'p', html:'Cards could contain credentials for accessing a web site, the combination of your bicycle lock, details of your credit card, ...'},
+			{tag:'h5', html:'Don\'t forget the bookmarklet!'},
+			{tag:'p', html:'Before you start, install the “Add to Clipperz” bookmarklet: it will make creating cards easier and more fun.'},
+			{tag:'p', html:'Go to the bookmarklet tab to discover how to install it and how it use it.'},
+			{tag:'p', html:''},
+			{tag:'p', html:'Then simply click the <b>"Add new card"</b> button and enjoy your Clipperz account.'},
+			{tag:'p', html:''},
+			{tag:'a', href:"http://www.clipperz.com/support/user_guide/managing_cards", target:'_blank', html:'Learn more about creating and managing cards'}
+		],
+
+// Cards block - new card wizard - bookmarklet configuration
+	'newRecordWizardTitleBoxConfig': [
+		{tag:'h5', html:"Please select a template"},
+		{tag:'p', html:'Cards are simple and flexible forms where you can store passwords or any other confidential data.'}, 
+		{tag:'p', html:'Start choosing one of the template below. You can always customize your cards later by adding or removing fields.'}
+	],
+	
+	'newRecordWizardBookmarkletConfigurationTitle':						"Απευθείας σύνδεση",
+	'newRecordWizardBookmarkletConfigurationDescriptionConfig':			[
+		{tag:'p', html:"Paste below the configuration code generated by the Clipperz bookmarklet."},
+		{tag:'p', html:"A new card complete with a direct login to your web account will be created."}
+	],
+
+	'newRecordWizardCreateButtonLabel':	"Δημιουργία",
+	'newRecordWizardCancelButtonLabel':	"Ακύρωση",
+
+//-------------------------------------------------------------------
+// Card templates
+//-------------------------------------------------------------------
+
+	'recordTemplates': {
+
+//	Web password
+		'WebAccount': {
+			'title': "Web password",
+			'description': [
+				{tag:'p', html:"A simple card to store login credentials for your online services."}
+			],
+			'fields': [
+				{label:"Διεύθυνση δικτύου", type:'URL'},
+				{label:"Χρήστης ή διεύθυνση ηλεκτρονικού ταχυδρομείου", type:'TXT'},
+				{label:"Κωδικός Πράσβασης", type:'PWD'}
+			]
+		},
+
+//	Bank account	
+		'BankAccount': {
+			'title': "Bank account",
+			'description': [
+				{tag:'p', html:"Safely store your bank account number and online banking credentials."}
+			],
+			'fields': [
+				{label:"Τράπεζα", type:'TXT'},
+				{label:"Αριθμός λογαριασμού", type:'TXT'},
+				{label:"Ιστοσελίδα τράπεζας", type:'URL'},
+				{label:"Αρ. Ηλεκτρονικής τράπεζας (ID)", type:'TXT'},
+				{label:"Κώδικος Ηλεκτρονικής τράπεζας", type:'PWD'}
+			]
+		},
+
+// 	Credit card
+		'CreditCard': {
+			'title': "Credit card",
+			'description': [
+				{tag:'p', html:"Card number, expire date, CVV2 and PIN always at hand with Clipperz."}
+			],
+			'fields': [
+				{label:"Τύπος Κάρτας (Visa, AmEx,...)", type:'TXT'},
+				{label:"Αριθμός κάρτα", type:'TXT'},
+				{label:"Ονοματεπώνυμο κατόχου", type:'TXT'},
+				{label:"Ημερομηνία λήξης", type:'TXT'},
+				{label:"CVV2", type:'TXT'},
+				{label:"Κωδικός Αυτόματης ταμείακης μηχανης (ΑΤΜ)", type:'PWD'},
+				{label:"Ιστοσελίδα κάρτας", type:'URL'},
+				{label:"Χρήστης", type:'TXT'},
+				{label:"Κωδικός Πρόσβασης", type:'PWD'}
+			]
+		},
+
+// 	Address book entry	
+		'AddressBookEntry': {
+			'title': "Address book entry",
+			'description': [
+				{tag:'p', html:"Clipperz could also work as your new private address book. Use this template to easily add a new entry."}
+			],
+			'fields': [
+				{label:"Όνομα", type:'TXT'},
+				{label:"Ηλετρονικό ταχυδρομείο", type:'TXT'},
+				{label:"Τηλέφωνο", type:'TXT'},
+				{label:"Κινητο τηλέφωνο", type:'TXT'},			
+				{label:"Διεύθυνση", type:'ADDR'},
+			]
+		},
+
+//	Custom card
+		'Custom': {
+			'title': "Custom card",
+			'description': [
+				{tag:'p', html:"No matter which kind of confidential data you need to protect, create a custom card to match your needs."}
+			],
+			'fields': [
+				{label:"Περιγραφή 1", type:'TXT'},
+				{label:"Περιγραφή 2", type:'TXT'},
+				{label:"Περιγραφή 3", type:'TXT'}
+			]
+		}
+	},
+
+
+	'recordFieldTypologies': {
+		'TXT': {
+			description: 'simple text field',
+			shortDescription: '΄Κείμενο'
+		},
+		'PWD': {
+			description: 'simple text field, with default status set to hidden',
+			shortDescription: 'Κωδικός Πρόσβασης'
+		},
+		'URL': {
+			description: 'simple text field in edit mode, that became an active url in view mode',
+			shortDescription: 'Διεύθυνση ηλεκτρονικού ταχυδρομείου'
+		},
+		'DATE': {
+			description: 'a value set with a calendar helper',
+			shortDescription: 'Ημερομηνία'
+		},
+		'ADDR': {
+			description: 'just like the URL, but the active link points to Google Maps (or similar service) passing the address value as argument',
+			shortDescription: 'Διεύθυνση'
+		},
+		'CHECK': {
+			description: 'check description',
+			shortDescription: 'check'
+		},
+		'RADIO': {
+			description: 'radio description',
+			shortDescription: 'radio'
+		},
+		'SELECT': {
+			description: 'select description',
+			shortDescription: 'select'
+		}
+	},
+
+// Cards block - new card - warnings
+	'newRecordPanelGeneralExceptionTitle':						"Σφάλμα",
+	'newRecordPanelGeneralExceptionMessage':					"The configuration text is not valid. Make sure to get your text from the bookmarklet pop-up and retry.",
+	'newRecordPanelWrongBookmarkletVersionExceptionTitle':		"Σφάλμα",
+	'newRecordPanelWrongBookmarkletVersionExceptionMessage':	"The configuration text has been generated by an old version of the bookmarklet. Please update your bookmarklet and retry.",
+	'newRecordPanelExceptionPanelCloseButtonLabel':				"Ακύρωση",
+
+// Cards block - delete card
+	'mainPanelDeletingRecordPanelConfirmationTitle':	"Διαγραφή επιλεγμένης κάρτας",
+	'mainPanelDeleteRecordPanelConfirmationText':		"Είστε σίγουρος ότι θέλετε να διαγράψετε την επιλεγμένη κάρτα?",
+	'mainPanelDeleteRecordPanelConfirmButtonLabel':		"Ναι",
+	'mainPanelDeleteRecordPanelDenyButtonLabel':		"Όχι",
+	'mainPanelDeletingRecordPanelInitialTitle':			"Διαγραφή επιλεγμένης κάρτας ",
+	'mainPanelDeletingRecordPanelCompletedText':		"Ολοκλήρωση",
+
+// Cards block - delete card panel
+	'deleteRecordPanelCollectRecordDataMessageTitle':		   				"Διαγραφή κάρτας",
+	'deleteRecordPanelCollectRecordDataMessageText':		   				"Φόρτωση λίστα κάρτας",
+	'deleteRecordPanelEncryptUserDataMessageTitle':			   				"Διαγραφή κάρτας",
+	'deleteRecordPanelEncryptUserDataMessageText':			   				"Local encryption of card headers",
+	'deleteRecordPanelSendingDataToTheServerMessageTitle':	   				"Διαγραφή κάρτας",
+	'deleteRecordPanelSendingDataToTheServerMessageText':	   				"Uploading encrypted card headers to Clipperz",
+	'deleteRecordPanelUpdatingTheInterfaceMessageTitle':	   				"Διαγραφή κάρτας",
+	'deleteRecordPanelUpdatingTheInterfaceMessageText':		   				"Φόρτωση επιφάνειας",
+	
+// Cards block - no record selected
+	'recordDetailNoRecordSelectedTitle':			"Δεν έχει επιλεγεί κάποια κάρτα",
+	'recordDetailNoRecordSelectedDescriptionConfig':	[
+			{tag:'p', html:'Παρακαλώ επιλέξτε μια κάρτα από αυτές που βρίσκονται στα αριστερά σας'}
+		],
+
+// Cards block - loading messages	
+	'recordDetailLoadingRecordMessage':				"Downloading encrypted card from Clipperz",
+	'recordDetailDecryptingRecordMessage':			"Τοπικη αποκωδικοποίηση αρχείων κάρτας",
+	'recordDetailLoadingRecordVersionMessage':		"Φόρτωση τελευταίας έκδοσης κάρτας",
+	'recordDetailDecryptingRecordVersionMessage':	"Τοπική αποκωδικοποίηση της τελευταίας έκδοσης",
+	'recordDetailLoadingErrorMessageTitle':			"Σφάλμα στη φόρτωση της κάρτας",
+	
+// Cards block - card details
+	'recordDetailNotesLabel':						"Σημειώσης",
+	'recordDetailLabelFieldColumnLabel':			"Περιγραφή πεδίου",
+	'recordDetailDataFieldColumnLabel':				"Στοιχεία πεδίου",
+	'recordDetailTypeFieldColumnLabel':				"Τύπος",
+
+	'recordDetailSavingChangesMessagePanelInitialTitle':	"Αποθήκευση κάρτας",
+
+	'recordDetailAddFieldButtonLabel':			"Προσθέστε νέο πεδίο",
+	'recordDetailPasswordFieldHelpLabel':		"Για αντιγραφή του κωδικού στο clipboard επιλέξτε τα αστεράκια και μετα Ctrl-C",
+
+	'recordDetailDirectLoginBlockTitle':		"Κωδικός Πρόσβασης",
+	'recordDetailNewDirectLoginDescriptionConfig':	[					
+		{tag:'p', html:'Επικύρωση κωδικου πρόσβασης'}
+	],
+
+	'recordDetailDirectLoginBlockNoDirectLoginConfiguredDescriptionConfig':	[
+		{tag:'p', html:"Does this card contain credentials to access an online service?"},
+		{tag:'p', html:"Use the bookmarklet to configure a “direct login” from Clipperz with just one click!"}
+	],
+	'recordDetailAddNewDirectLoginButtonLabel':					"Προσθέστε νέο κωδικό πρόσβασης",
+
+	'recordDetailEditButtonLabel':		"Edit",
+	'recordDetailSaveButtonLabel':		"Αποθήκευση",
+	'recordDetailCancelButtonLabel':	"Ακύρωση",
+
+	'newRecordTitleLabel':					"_Νέα κάρτα_",
+
+// Cards block - save card panel
+	'recordSaveChangesPanelCollectRecordInfoMessageTitle':			"Αποθήκευση κάρτας",
+	'recordSaveChangesPanelCollectRecordInfoMessageText':			"Updating card headers",
+	'recordSaveChangesPanelEncryptUserDataMessageTitle':			"Αποθήκευση κάρτας",
+	'recordSaveChangesPanelEncryptUserDataMessageText':				"Local encryption of card headers",
+	'recordSaveChangesPanelEncryptRecordDataMessageTitle':			"Αποθήκευση κάρτας",
+	'recordSaveChangesPanelEncryptRecordDataMessageText':			"Local encryption of card's data",
+	'recordSaveChangesPanelEncryptRecordVersionDataMessageTitle':	"Αποθήκευση κάρτας",
+	'recordSaveChangesPanelEncryptRecordVersionDataMessageText':	"Local encryption of card's version data",
+	'recordSaveChangesPanelSendingDataToTheServerMessageTitle':		"Αποθήκευση κάρτας",
+	'recordSaveChangesPanelSendingDataToTheServerMessageText':		"Uploading encrypted card's header to Clipperz",
+	'recordSaveChangesPanelUpdatingTheInterfaceMessageTitle':		"Αποθήκευση κάρτας",
+	'recordSaveChangesPanelUpdatingTheInterfaceMessageText':		"Φόρτωση επιφάνειας",
+
+// Exit page	
+	'exitConfig': [
+			{tag:'h2', html:'<b>Goodbye! Thanks for using Clipperz.</b>'},
+			
+			{tag:'ul', children:[
+				{tag:'li', children:[
+					{tag:'h3', html:'Remember:'},
+					{tag:'ul', children:[
+						{tag:'li', children:[{tag:'span', html:'Bookmark this page to safely connect to Clipperz in the future (if you haven\'t already done it)'}]},
+						{tag:'li', children:[{tag:'span', html:'Clipperz will never send you an email, because we never asked your email address (and we never will), so never open an email that says it\'s from Clipperz'}]}
+					]}
+				]}
+			]},
+			{tag:'p', html:""},
+			{tag:'p', html:"In 10 seconds you will be redirected to a Wikipedia page where you can read about a major security issue ..."}
+		],
+
+//-------------------------------------------------------------------
+//	Miscellaneous strings	
+//-------------------------------------------------------------------	
+
+//	'DWRUtilLoadingMessage':						"Φόρτωση δεδομένων ...",
+	'comingSoon':									"Σύντομα κοντά σας ...",
+	'panelCollectingEntryopyMessageText':			"Collecting entropy",
+	'directLoginConfigurationCheckBoxFieldSelectedValue':		"Ναι",
+	'directLoginConfigurationCheckBoxFieldNotSelectedValue':	"Όχι",
+										
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_en-CA.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_en-CA.js
new file mode 100644
index 0000000..50fa7e5
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_en-CA.js
@@ -0,0 +1,43 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+//=============================================================================
+//
+//		E N G L I S H   C A N A D I A N  ( en_CA )
+//
+//=============================================================================
+
+Clipperz.PM.Strings.Languages['en-ca'] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+
+//	'forumHeaderLinkLabel':		"forum-CA",
+
+//	'recordMenuLabel':		"cards-CA",
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
\ No newline at end of file
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_en-GB.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_en-GB.js
new file mode 100644
index 0000000..ea55650
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_en-GB.js
@@ -0,0 +1,43 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+//=============================================================================
+//
+//		E N G L I S H   B R I T I S H  ( en_GB )
+//
+//=============================================================================
+
+Clipperz.PM.Strings.Languages['en-gb'] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+
+//	'forumHeaderLinkLabel':		"forum-GB",
+
+//	'recordMenuLabel':		"cards-GB",
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
\ No newline at end of file
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_en-US.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_en-US.js
new file mode 100644
index 0000000..c0dd6d0
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_en-US.js
@@ -0,0 +1,1259 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+if (typeof(Clipperz.PM.Strings) == 'undefined') { Clipperz.PM.Strings = {}; }
+if (typeof(Clipperz.PM.Strings.Languages) == 'undefined') { Clipperz.PM.Strings.Languages = {}; }
+
+//=============================================================================
+//
+//		E N G L I S H   A M E R I C A N  ( en_US )
+//
+//=============================================================================
+
+Clipperz.PM.Strings.Languages['en-us'] = {
+
+//	Login page - description
+'clipperzServiceDescription': "\
+	<!-- 	FIX CSS		DONE	-->	\
+	<h2>Keep it to yourself!</h2>\
+	<ul>\
+		<li>\
+			<h3>Clipperz is:</h3>\
+			<ul>\
+				<li><p>a secure and simple password manager</p></li>\
+				<li><p>an effective single sign-on solution</p></li>\
+				<li><p>a digital vault for your personal data</p></li>\
+			</ul>\
+		</li>\
+		<li>\
+			<h3>With Clipperz you can:</h3>\
+			<ul>\
+				<li><p>store and manage your passwords and online credentials</p></li>\
+				<li><p>login to your web services without entering any username or password</p></li>\
+				<li><p>protect all your sensitive data: codes for burglar alarms, PINs, credit card numbers, …</p></li>\
+				<li><p>share secrets with family members and associates (coming soon)</p></li>\
+			</ul>\
+		</li>\
+		<li>\
+			<h3>Clipperz benefits:</h3>\
+			<ul>\
+				<li><p>free and completely anonymous</p></li>\
+				<li><p>access it any time from any computer</p></li>\
+				<li><p>no software to download and nothing to install</p></li>\
+				<li><p>avoid keeping secrets on your PC or on paper</p></li>\
+			</ul>\
+		</li>\
+		<li>\
+			<h3>Clipperz security:</h3>\
+			<ul>\
+				<li><p>your secrets are locally encrypted by your browser before being uploaded to Clipperz</p></li>\
+				<li><p>the encryption key is a passphrase known only to you</p></li>\
+				<li><p>Clipperz hosts your sensitive data in encrypted form and could never actually access the data in its plain form</p></li>\
+				<li><p>Clipperz is built upon standard encryption schemes, nothing fancies or homemade</p></li>\
+				<li><p>you can review the source code anytime you like, but you need to know nothing about cryptography to be an happy user!</p></li>\
+			</ul>\
+		</li>\
+		<li>\
+			<a href=\"http://www.clipperz.com\" target=\"_blank\">Learn more</a>\
+		</li>\
+	</ul>",
+
+		
+'loginFormTitle':								"login with your Clipperz account",
+'loginFormUsernameLabel':						"username",
+'loginFormPassphraseLabel':						"passphrase",
+'loginFormDontHaveAnAccountLabel':				"don\'t have an account?",
+'loginFormCreateOneLabel':						"create one",
+'loginFormForgotYourCredentialsLabel':			"forgot your credentials?",
+'loginFormAarghThatsBadLabel':					"aargh! that\'s bad!",
+'loginFormAfraidOfMaliciousScriptsLabel':		"afraid of malicious scripts?",
+'loginFormVerifyTheCodeLabel':					"verify the code",
+'loginFormButtonLabel':							"Login",
+'loginFormOneTimePasswordCheckboxLabel':    	"use a one-time passphrase",
+'loginFormOneTimePasswordCheckboxDescription':  "",
+
+// Login page - language selection
+'loginPanelSwithLanguageDescription':			"<h5>Switch to your preferred language</h5>",
+
+// Login page - browser compatibility
+'browserCompatibilityDescription':				"<p>Have a better and safer Clipperz experience with Firefox. However Clipperz works just fine also with Opera, Safari and MS Internet Explorer!</p>",
+
+// Login with OTP - message panel
+'OTPloginMessagePanelInitialTitle':				"Logging in using a one-time passphrase",
+'OTPloginMessagePanelInitialText':				"Sending OTP credentials …",
+'OTPloginMessagePanelLoadingTitle':				"Logging in using a one-time passphrase",
+'OTPloginMessagePanelLoadingText':				"Fetching encrypted authentication data from the server …",
+'OTPloginMessagePanelProcessingTitle':			"Logging in using a one-time passphrase",
+'OTPloginMessagePanelProcessingText':			"Local decryption of authentication data",
+
+// Regular login - message panel
+'loginMessagePanelInitialTitle':				"Logging in …",
+'loginMessagePanelInitialText':					"---",
+'loginMessagePanelInitialButtonLabel':			"Cancel",
+'loginMessagePanelConnectedTitle':				"Connected",
+'loginMessagePanelConnectedText':				"Done",
+'loginMessagePanelFailureTitle':				"Error",
+'loginMessagePanelFailureText':					"Login failed",
+'loginMessagePanelFailureButtonLabel':			"Close",
+
+// Regular login - message panel - connection
+'connectionLoginSendingCredentialsMessageTitle':		"Verifying credentials",
+'connectionLoginSendingCredentialsMessageText':			"Sending credentials",
+'connectionLoginCredentialsVerificationMessageTitle':	"Verifying credentials",
+'connectionLoginCredentialsVerificationMessageText':	"Performing SRP authentication",
+'connectionLoginDoneMessageTitle':						"Verifying credentials",
+'connectionLoginDoneMessageText':						"Connected",
+	
+//	Regular login - message panel - user
+'userLoginPanelUpgradingUserCredentialsMessageTitle':	   				"Verifying credentials",
+'userLoginPanelUpgradingUserCredentialsMessageText':	   				"Upgrading your credentials to a new authentication schema",
+'userLoginPanelConnectedMessageTitle':					   				"User authenticated",
+'userLoginPanelConnectedMessageText':					   				"Successfully logged in",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageTitle': 				"Verifying credentials",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageText':  				"Trying an older authentication schema",
+'userLoginPanelLoadingUserDataMessageTitle':			   				"User authenticated",
+'userLoginPanelLoadingUserDataMessageText':				   				"Downloading encrypted card headers from Clipperz",
+'userLoginPanelDecryptingUserDataMessageTitle':							"User authenticated",
+'userLoginPanelDecryptingUserDataMessageText':							"Local decryption of card headers",
+'userLoginPanelDecryptingUserStatisticsMessageTitle':					"User authenticated",
+'userLoginPanelDecryptingUserStatisticsMessageText':					"Local decryption of usage statistics",
+	
+//	Registration page - splash alert
+'splashAlertTitle':	"Welcome to Clipperz!",
+'splashAlertText': "\
+	<!-- 	FIX CSS		DONE!	-->	\
+	<p>Some security advice</p>\
+	<ul>\
+		<li><p>Storing your data at Clipperz is as secure as the passphrase you choose to protect them. Nobody can access them unless they know your passphrase.</p></li>\
+		<li><p>If you are going to use Clipperz for safeguarding sensitive and critical information please make sure to use a strong passphrase. The longer the better!</p></li>\
+		<li><p>Clipperz will not be able to recover a lost passphrase!</p></li>\
+	</ul>\
+	<p>For any further information, please refer to <a href=\"http://www.clipperz.com\" target=\"_blank\">Clipperz</a> website.</p>",
+'splashAlertCloseButtonLabel':	"Ok",
+	
+// Registration page - form	
+'registrationFormTitle':								"create your account",
+'registrationFormUsernameLabel':						"username",
+'registrationFormPassphraseLabel':						"passphrase",
+'registrationFormRetypePassphraseLabel':				"re-enter passphrase",
+'registrationFormSafetyCheckLabel':						"I understand that Clipperz will not be able to recover a lost passphrase.",
+'registrationFormTermsOfServiceCheckLabel':				"I have read and agreed to the <a href='http://www.clipperz.com/terms_of_service' target='_blank'>Terms of Service</a>.",
+'registrationFormDoYouAlreadyHaveAnAccountLabel':		"do you already have an account?",
+'registrationFormSimplyLoginLabel':						"simply login",
+'registrationFormButtonLabel':							"Register",
+
+// Registration page - warning messages
+'registrationFormWarningMessageNotMatchingPassphrases':	"Your passphrases don't match, please re-type them.",
+'registrationFormWarningMessageSafetyCheckNotSelected':	"Please read and check all the boxes below.",
+'registrationFormWarningMessageTermsOfServiceCheckNotSelected':	"You need to agree to the Terms of Service.",
+
+// Registration page - message panel	
+'registrationMessagePanelInitialTitle':					"Creating account …",
+'registrationMessagePanelInitialText':					"---",
+'registrationMessagePanelInitialButtonLabel':			"Cancel",
+'registrationMessagePanelRegistrationDoneTitle':		"Registration",
+'registrationMessagePanelRegistrationDoneText':			"Done",
+'registrationMessagePanelFailureTitle':					"Registration failed",
+'registrationMessagePanelFailureButtonLabel':			"Close",
+
+// Registration page - message panel - connection
+'connectionRegistrationSendingRequestMessageText':		"Verifying credentials",
+'connectionRegistrationSendingCredentialsMessageText':	"Sending credentials",
+
+// Registration page - splash panel
+'registrationSplashPanelTitle':				"Security advice",
+'registrationSplashPanelDescription':		"<p>These are your Clipperz credentials, take good care of them. Clipperz will never display your username and passphrase a second time!</p>",
+'registrationSplashPanelUsernameLabel':		"username",
+'registrationSplashPanelPassphraseLabel':	"passphrase",
+	
+'registrationSplashPanelShowPassphraseButtonLabel':	"show passphrase",
+	
+//	Header links
+'donateHeaderLinkLabel':					"donate",
+'creditsHeaderLinkLabel':					"credits",
+'feedbackHeaderLinkLabel':					"feedback",
+'helpHeaderLinkLabel':						"help",
+'forumHeaderLinkLabel':						"forum",
+	
+//	Menu labels
+'recordMenuLabel':							"cards",
+'accountMenuLabel':							"account",
+'dataMenuLabel':							"data",
+'contactsMenuLabel':						"contacts",
+'toolsMenuLabel':							"tools",
+'logoutMenuLabel':							"logout",
+'lockMenuLabel':							"lock",
+
+//	Lock dialog
+'lockTitle':								"The account is locked",
+'lockDescription':							"<p>To unlock your account, please enter your passphrase.</p>",
+'unlockButtonLabel':						"Unlock",
+		
+//	Account panel - change passphrase
+'changePasswordTabLabel':					"Change your passphrase",
+'changePasswordTabTitle':					"Change your passphrase",
+
+'changePasswordFormUsernameLabel':			"username",
+'changePasswordFormOldPassphraseLabel':		"old passphrase",
+'changePasswordFormNewPassphraseLabel':		"new passphrase",
+'changePasswordFormRetypePassphraseLabel':	"re-enter new passphrase",
+'changePasswordFormSafetyCheckboxLabel':	"I understand that Clipperz will not be able to recover a lost passphrase.",
+'changePasswordFormSubmitLabel':			"Change passphrase",
+
+//	Account panel - change passphrase - warning messages
+'changePasswordFormWrongUsernameWarning':			"Wrong username",
+'changePasswordFormWrongPassphraseWarning':			"Wrong passphrase",
+'changePasswordFormWrongRetypePassphraseWarning':	"Your passphrases don't match, please re-type them.",
+'changePasswordFormSafetyCheckWarning':				"Please read and check the box below.",
+
+//	Account panel - change passphrase - progress dialog
+'changePasswordFormProgressDialogTitle':								"Changing user credentials",
+'changePasswordFormProgressDialogEmptyText':							"---",
+'changePasswordFormProgressDialogConnectedMessageTitle':				"Connected",
+'changePasswordFormProgressDialogConnectedMessageText':					"Done",
+'changePasswordFormProgressDialogErrorMessageTitle':					"Error",
+'changePasswordFormProgressDialogErrorMessageText':						"Credentials change failed!",
+
+'changeCredentialsPanelEncryptingDataMessageTitle':		   				"Changing your passphrase",
+'changeCredentialsPanelEncryptingDataMessageText':						"Local encryption of card headers",
+'changeCredentialsPanelCreatingNewCredentialsMessageTitle':				"Changing your passphrase",
+'changeCredentialsPanelCreatingNewCredentialsMessageText':				"Updating your credentials",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle':	"Changing your passphrase",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageText':	"Uploading your encrypted credentials to Clipperz",
+'changeCredentialsPanelDoneMessageTitle':								"Changing your passphrase",
+'changeCredentialsPanelDoneMessageText':								"Done",
+
+//	Account panel - OTP
+'manageOTPTabLabel':		"Manage your one-time passphrases",
+'manageOTPTabTitle':		"Manage your one-time passphrases",
+
+'manageOTPTabDescription':	"\
+	<p>A one-time passphrase works like your regular passphrase, but can be used only once.</p>\
+	<p>If the same passphrase is used again at a later stage in a login attempt it will be rejected and the login process will fail.</p>\
+	<p>Immediately after a successful login, your one-time passphrase will be deleted preventing any fraudulent access.</p>\
+	<p>One-time passphrases are an excellent choice if one is concerned about keyloggers or spyware infections that may be collecting data from compromised machines.</p>\
+	<p><b>It's strongly advisable to use one-time passphrases when accessing Clipperz from public terminals, such as Internet cafes and libraries.</b></p>",
+
+//	Account panel - OTP - OTP table
+'oneTimePasswordReadOnlyMessage': "\
+	<h6>Sorry!</h6>\
+	<p>You cannot manage your one-time passphrases when using the offline version of Clipperz.</p>",
+
+'oneTimePasswordLoadingMessage':	"\
+	<h6>Loading data</h6>\
+	<p>Please wait …</p>",
+
+'oneTimePasswordNoPasswordAvailable':	"\
+	<h6>No one-time passphrase available</h6>\
+	<p>Click the “New” button above to add one-time passphrases to your account.</p>",
+
+'createNewOTPButtonLabel':					"New",
+'deleteOTPButtonLabel':						"Delete",
+'printOTPButtonLabel':						"Print",
+
+'disabledOneTimePassword_warning':			"disabled",
+
+'oneTimePasswordSelectionLink_selectLabel':	"Select:",
+'oneTimePasswordSelectionLink_all':			"all",
+'oneTimePasswordSelectionLink_none':		"none",
+'oneTimePasswordSelectionLink_used':		"used",
+'oneTimePasswordSelectionLink_unused':		"unused",
+
+//Account panel - OTP - saving new OTP dialog
+'saveOTP_encryptUserDataTitle':				"Saving one-time passphrase",
+'saveOTP_encryptUserDataText':				"Processing new OTP credentials …",
+'saveOTP_encryptOTPDataTitle':				"Saving one-time passphrase",
+'saveOTP_encryptOTPDataText':				"Local encryption of authentication data …",
+'saveOTP_sendingDataTitle':					"Saving one-time passphrase",
+'saveOTP_sendingDataText':					"Sending authentication data to the server …",
+'saveOTP_updatingInterfaceTitle':			"Saving one-time passphrase",
+'saveOTP_updatingInterfaceText':			"Updating interface",
+                                    		
+// Account panel - preferences
+'accountPreferencesLabel':					"Preferences",
+'accountPreferencesTabTitle':				"Preferences",
+
+'accountPreferencesLanguageTitle':			"Language",
+'accountPreferencesLanguageDescription':	"<p>Choose your preferred language from the list below.</p>",
+
+'showDonationReminderPanelTitle':			"Donation reminders",
+'showDonationReminderPanelDescription':		"<p>Show donation reminders</p>",
+	
+'saveUserPreferencesFormSubmitLabel':		"Save",
+'cancelUserPreferencesFormSubmitLabel':		"Cancel",
+
+// Account panel - preferences - saving dialog
+'accountPreferencesSavingPanelTitle_Step1':		"Saving preferences",
+'accountPreferencesSavingPanelText_Step1':		"Local encryption of your preferences",
+'accountPreferencesSavingPanelTitle_Step2':		"Saving preferences",
+'accountPreferencesSavingPanelText_Step2':		"Sending encrypted preferences to Clipperz",
+
+//	Account panel - login history
+'accountLoginHistoryLabel':						"Login history",
+'loginHistoryTabTitle':							"Login history",
+
+'loginHistoryReadOnlyMessage':		"\
+	<h6>Sorry!</h6>\
+	<p>The login history is not available while using the offline version of Clipperz.</p>",
+	
+'loginHistoryLoadingMessage':		"\
+	<h6>Loading data</h6>\
+	<p>Please wait …</p>",
+	
+'loginHistoryLoadedMessage':		"\
+	<h6>Your latest 10 logins</h6>\
+	<p></p>",
+
+'loginHistoryIPLabel':						"IP",
+'loginHistoryTimeLabel':					"date",
+'loginHistoryCurrentSessionText':			"current session",
+'loginHistoryReloadButtonLabel':			"Reload login history",
+
+//	Account panel - delete account
+'deleteAccountTabLabel':					"Delete your account",
+'deleteAccountTabTitle':					"Delete your account",
+
+'deleteAccountFormUsernameLabel': 			"username",
+'deleteAccountFormPassphraseLabel':			"passphrase",
+'deleteAccountFormSafetyCheckboxLabel':		"I understand that all my data will be deleted and that this action is irreversible.",
+'deleteAccountFormSubmitLabel':				"Delete my account",
+
+//Account panel - delete account - warnings
+'deleteAccountFormWrongUsernameWarning':	"Wrong username",
+'deleteAccountFormWrongPassphraseWarning':	"Wrong passphrase",
+'deleteAccountFormSafetyCheckWarning':		"Please read and check the box below.",
+
+//Account panel - delete account - confirmation
+'accountPanelDeletingAccountPanelConfirmationTitle':	"ATTENTION",
+'accountPanelDeleteAccountPanelConfirmationText':		"Are your sure you want to delete your account?",
+'accountPanelDeleteAccountPanelConfirmButtonLabel':		"Yes",
+'accountPanelDeleteAccountPanelDenyButtonLabel':		"No",
+
+//Account panel - delete account - confirmation
+'accountPanelDeletingAccountPanelProgressTitle':		"Deleting the account data",
+'accountPanelDeletingAccountPanelProgressText':			"The operation could take long, please be patient.",
+
+//Data panel - offline copy
+'offlineCopyTabLabel':									"Offline copy",
+'offlineCopyTabTitle':									"Offline copy",
+	
+'offlineCopyTabDescription': "\
+	<!-- 	FIX CSS		DONE!	-->	\
+	<p>With just one click you can dump all your encrypted data from Clipperz servers to your hard disk and create a read-only offline version of Clipperz to be used when you are not connected to the Internet.</p>\
+	<p>The read-only version is as secure as the read-and-write one and will not expose your data to higher risks since they both share the same code and security architecture.</p>\
+	<ol>\
+		<li><p>Click the link below to start the download.</p></li>\
+		<li><p>The browser will ask you what to do with the “Clipperz_YYYYMMDD.html” file. Save it on your hard disk.</p></li>\
+		<li><p>Double click on the downloaded file to launch the offline version in your browser.</p></li>\
+		<li><p>Enter the usual username and passphrase.</p></li>\
+	</ol>",
+
+'offlineCopyDownloadLinkLabel':		"Download",
+
+//	Data panel - offline copy - not updated
+'offlineCopyDownloadWarning':		"\
+	<!-- 	FIX CSS		DONE!	-->	\
+	<h4><a href=\"#\" id=\"offlineCopyDownloadWarningLink\">Update your “offline copy”!</a></h4>\
+	<p>You have recently created or modified one or more cards, it would be wise to download a new copy of the offline version.</p>",
+
+'offlineCopyDownloadOk':								"",
+
+//	Data panel - sharing
+'sharingTabLabel':					"Sharing",
+'sharingTabTitle':					"Sharing",
+
+'sharingTabDescription':			"\
+	<p>Quite often a confidential piece of information needs to be shared with one or more persons.</p>\
+	<p>This could be as simple as giving your colleague the access code of your voice mailbox when you are out of the office, or as complicated as enabling the entitled heirs to access your safe deposit box at the local bank when you pass on.</p>\
+	<p>Clipperz can make sharing your secrets a secure and straightforward process.</p>\
+	<p></p>\
+	<p><b>Coming soon …</b></p>",
+	
+// 	Data panel - import
+'importTabLabel':					"Import",
+'importTabTitle':					"Import",
+
+'importTabDescription':				"<p>You can bulk import data to your Clipperz account from several file formats.</p>",
+	
+//	Data panel - export
+'printingTabLabel':					"Export",
+'printingTabTitle':					"Export",
+
+'printingTabDescription':			"\
+	<h5>Printing</h5>\
+	<p>Click on the link below to open a new window displaying all your cards in a printable format.</p>\
+	<p>If you are going to print for backup purposes, please consider the safer option provided by the “offline copy”.</p>",
+
+'printingLinkLabel':				"Printable version",
+
+'exportTabDescription':				"\
+	<h5>Exporting to JSON</h5>\
+	<p>JSON enables a “lossless” export of your cards. All the information will be preserved, including direct login configurations.</p>\
+	<p>This custom format it’s quite convenient if you need to move some of all of your cards to a different Clipperz account. Or if you want to restore a card that has been accidentally deleted.</p>\
+	<p>Click on the link below to start the export process.</p>",
+
+'exportLinkLabel':					"Export to JSON",
+
+'exportDataInProgressDescription':	"<h4>Exporting, please wait while your data are being processed …</h4>",
+
+'exportDataDescription':			"\
+	<h4>Instructions</h4>\
+	<p>Copy the text below to your favorite editor and save it. (e.g. “clipperz_export_20071217.json”)</p>",
+	
+//	Contacts panel
+'contactsTabLabel':					"Contacts",
+'contactsTabTitle':					"Contacts",
+
+//Tools panel - password generator
+'passwordGeneratorTabLabel':		"Password generator",
+'bookmarkletTabLabel':				"Bookmarklet",
+'compactTabLabel':					"Compact edition",
+'httpAuthTabLabel':					"HTTP authentication",
+
+'passwordGeneratorTabTitle':		"Password generator",
+'bookmarkletTabTitle':				"Bookmarklet",
+'compactTabTitle':					"Compact edition",
+'httpAuthTabTitle':					"HTTP authentication",
+	
+	
+//	Tools panel - password generator - description
+'paswordGeneratorTabDescription':	"<p></p>",
+'passwordGeneratorTabButtonLabel':	"Generate password",
+
+//	Tools panel - bookmarklet
+'bookmarkletTabLabel':				"Bookmarklet",
+'bookmarkletTabTitle':				"Bookmarklet",
+		
+'bookmarkletTabDescription':		"\
+	<!-- 	FIX CSS		DONE!	-->	\
+	<p>A bookmarklet is a simple “one-click” tool that can perform very useful tasks. It can be saved and used like a normal web page bookmark.</p>\
+	<p>The Clipperz bookmarklet will help you to quickly create new cards and new “direct logins” within existing cards.</p>\
+	<p><b>Please note that the bookmarklet does not include any information related to your account (e.g. your username or passphrase), the bookmarklet is a general tool containing the same code for every Clipperz user.</b></p>\
+	<h3>How to install the bookmarklet</h3>\
+	<h>Firefox, Camino, Opera, Safari</h5>\
+	<ol>\
+		<li><p>Make sure that the “Bookmarks Bar” is displayed by selecting “View > Toolbars > Bookmarks”, or similar menu items, from the browser menu.</p></li>\
+		<li><p>Drag and drop the “Add to Clipperz” link below to the bookmark bar.</p></li>\
+	</ol>\
+	\
+	<h5>Internet Explorer</h5>\
+	<ol>\
+		<li><p>Make sure that the “Links” toolbar is displayed by selecting “View > Toolbars > Links” from the browser menu.</p></li>\
+		<li><p>Right-click on the “Add to Clipperz” link below.</p></li>\
+		<li><p>Select “Add to favorites” from the contextual menu.</p></li>\
+		<li><p>Click “Yes” for any security message that pops up.</p></li>\
+		<li><p>Open the “Links” folder and click “OK”</p></li>\
+	</ol>",
+	
+'bookmarkletTabBookmarkletTitle':	"Add to Clipperz",
+
+//	Tools panel - bookmarklet - instructions
+'bookmarkletTabInstructions':		"\
+	<!-- 	FIX CSS		DONE!	-->	\
+	<h3>How to create a new card inclusive of a “direct login” link to an online service</h3>\
+	<ol>\
+		<li><p>Open the web page where the login form is hosted. (this is the page where you usually enter your sign-in credentials)</p></li>\
+		<li><p>Launch the bookmarklet by clicking on it: a pop-up window will appear over the web page.</p></li>\
+		<li><p>Copy to the clipboard the content of the large text area within the pop-up. (ctrl-C)</p></li>\
+		<li><p>Enter your Clipperz account and click on the <b>Add new card</b> button.</p></li>\
+		<li><p>Select the “Direct login” template and paste the content of the clipboard to the large text area in the form. (ctrl-V)</p></li>\
+		<li><p>Press the <b>Create</b> button, complete and review the details, then click <b>Save</b>.</p></li>\
+	</ol>\
+	\
+	<h3>How to add a “direct login” link to an existing card</h3>\
+	<ol>\
+		<li><p>Same as above.</p></li>\
+		<li><p>Same as above.</p></li>\
+		<li><p>Same as above.</p></li>\
+		<li><p>Enter your Clipperz account and select the card containing the credentials for the web service you just visited and click the <b>Edit</b> button.</p></li>\
+		<li><p>Paste the content of the clipboard to the large text area in the “Direct logins” section. (ctrl-V)</p></li>\
+		<li><p>Press the <b>Add direct login</b> button, review the details and then click <b>Save</b>.</p></li>\
+	</ol>\
+	\
+	<p></p>\
+	<p>Further information about the bookmarklet are <a href=\"http://www.clipperz.com/support/user_guide/bookmarklet\" target=\"_blank\">available here</a>.</p>",
+
+//	Tools panel - Compact - instructions
+'compactTabDescription':				"\
+	<!-- 	FIX CSS		DONE!	-->	\
+	<p>Clipperz Compact is a special version of Clipperz designed to be opened in the Firefox sidebar.</p>\
+	<p>Its purpose is to keep your collection of “direct logins” always at hand. Read more <a href=\"http://www.clipperz.com/support/user_guide/clipperz_compact\", target=\"blank\">here</a></p>\
+	\
+	<h3>How to launch Clipperz Compact in the sidebar</h3>\
+	<ol>\
+		<li><p>Get Firefox! Sidebars are only available in Firefox and you need to switch to Firefox in order to enjoy the convenience of Clipperz Compact.</p></li>\
+		<li>\
+			<p>Add the following URL to Firefox bookmarks, or even better, drag it to the bookmark bar.</p>\
+			<div id=\"compactLinkBox\"><a href=\"https://www.clipperz.com/beta/index.html?compact\" target=\"_search\">Clipperz Compact</a></div>\
+		</li>\
+		<li><p>Change the properties of the bookmark so that “load this bookmark in the sidebar” is checked.</p></li>\
+	</ol>\
+	\
+	<h5>Added bonus: Clipperz Compact works also in Opera’s panel.</h5>",
+
+//	Tools panel - HTTP authentication - instructions
+'httpAuthTabDescription':					"\
+	<!-- 	FIX CSS		DONE!	-->	\
+	<p>HTTP authentication is a method designed to allow a web browser to provide credentials – in the form of a username and password – including them in a website address (HTTP or HTTPS URL).</p>\
+	<p>Nowadays it is rarely used, but it can still be found on small, private websites. You can tell that a website is protected by HTTP authentication when the browser displays a pop-up window to enter username and password.</p>\
+	<p>Unfortunately the Clipperz bookmarklet does not work on websites that use HTTP authentication. However you can still create a “direct login”.</p>\
+	\
+	<h3>How to create a “direct login” for a website that uses HTTP authentication</h3>\
+	<ol>\
+		<li><p>Store website URL, username and password in a new card.</p></li>\
+		<li><p>Copy the configuration below and paste it to the large text area in the “Direct logins” section of the new card.</p></li>\
+		<li><p>Press the <b>Add direct login</b> button, bind URL, username and password fields and then click <b>Save</b>.</p></li>\
+	</ol>\
+	\
+	<h5><a href=\"http://support.microsoft.com/kb/834489\" target=\"_blank\">Warning: Internet Explorer does not support HTTP authentication.</a></h5>",
+	
+// Direct logins block
+'mainPanelDirectLoginBlockLabel':			"Direct logins",
+'directLinkReferenceShowButtonLabel':		"show",
+	
+// Direct logins - blank slate
+'mainPanelDirectLoginBlockDescription':		"\
+	<!-- 	FIX CSS		DONE!	-->	\
+	<p>Add “direct logins” to sign in to your web accounts without typing usernames and passwords!</p>\
+	<p>“Direct logins” greatly enhance your password security since you can:</p>\
+	<ul>\
+		<li><p>conveniently adopt and enter complex passwords;</p></li>\
+		<li><p>never re-use the same and easy-to-guess password.</p></li>\
+	</ul>\
+	<p>Simple and quick configuration with the <b>Clipperz bookmarklet</b>.</p>\
+	<a href=\"http://www.clipperz.com/support/user_guide/direct_logins\" target=\"_blank\">Learn more about “direct logins”</a>",
+
+// Cards block		
+'mainPanelRecordsBlockLabel':				"Cards",
+'mainPanelAddRecordButtonLabel':			"Add new card",
+'mainPanelRemoveRecordButtonLabel':			"Delete card",
+
+// Cards block - filter tabs
+'mainPanelRecordFilterBlockAllLabel':		"all",
+'mainPanelRecordFilterBlockTagsLabel':		"tags",
+'mainPanelRecordFilterBlockSearchLabel':	"search",
+	
+// Cards block - blank slate
+'recordDetailNoRecordAtAllTitle':			"Welcome to Clipperz!",
+'recordDetailNoRecordAtAllDescription':		"\
+	<h5>Get started by adding cards to your account.</h5>\
+	<p>Cards are simple and flexible forms where you can store your passwords and any other confidential data.</p>\
+	<p>Cards could contain credentials for accessing a web site, the combination of your bicycle lock, details of your credit card, …</p>\
+	\
+	<h5>Don't forget the Clipperz bookmarklet!</h5>\
+	<p>Before you start, install the “Add to Clipperz” bookmarklet: it will make creating cards easier and more fun.</p>\
+	<p>Go to the “Tools” tab to discover how to install it and how it use it.</p>\
+	<p></p>\
+	<p>Then simply click the <b>\"Add new card\"</b> button and enjoy your Clipperz account.</p>\
+	<p></p>\
+	<a  href=\"http://www.clipperz.com/support/user_guide/managing_cards\" target=\"_blank\">Learn more about creating and managing cards</a>",
+
+// Cards block - new card wizard - bookmarklet configuration
+'newRecordWizardTitleBox': 					"\
+	<h5>Please select a template</h5>\
+	<p>Cards are simple and flexible forms where you can store passwords or any other confidential data.</p>\
+	<p>Start choosing one of the templates below. You can always customize your cards later by adding or removing fields.</p>",
+	
+'newRecordWizardBookmarkletConfigurationTitle':			"Direct login",
+'newRecordWizardBookmarkletConfigurationDescription':	"\
+	<p>Paste below the configuration code generated by the Clipperz bookmarklet.</p>\
+	<p>A new card complete with a direct login to your web account will be created.</p>",
+
+'newRecordWizardCreateButtonLabel':						"Create",
+'newRecordWizardCancelButtonLabel':						"Cancel",
+	
+//	Create new card - Donation splash
+'donateSplashPanelTitle':								"Support Clipperz, make a donation today!",
+'donateSplashPanelDescription': 						"\
+	<!-- 	FIX CSS		DONE!	-->	\
+	<p>A few good reasons to make a donation:</p>\
+	<ul>\
+		<li><p>support the development of new features</p></li>\
+		<li><p>keep Clipperz free</p></li>\
+		<li><p>show appreciation for our hard work</p></li>\
+	</ul>\
+	<p>For any further information, please visit our <a href=\"http://www.clipperz.com/donations\" target=\"_blank\">Donations page</a>.</p>\
+	<p><b>Ready to donate?</b></p>",
+
+'donateCloseButtonLabel':								"Not yet",
+'donateDonateButtonLabel':								"Yes",
+	
+// Card templates
+'recordTemplates': {
+
+//Web password
+	'WebAccount': {
+		'title': 		"Web password",
+		'description':	"<p>A simple card to store login credentials for your online services.</p>",
+		'fields': [
+			{label:"Web address", type:'URL'},
+			{label:"Username or email", type:'TXT'},
+			{label:"Password", type:'PWD'}
+		]
+	},
+
+//Bank account	
+	'BankAccount': {
+		'title':		"Bank account",
+		'description':	"<p>Safely store your bank account number and online banking credentials.</p>",
+		'fields': [
+			{label:"Bank", type:'TXT'},
+			{label:"Account number", type:'TXT'},
+			{label:"Bank website", type:'URL'},
+			{label:"Online banking ID", type:'TXT'},
+			{label:"Online banking password", type:'PWD'}
+		]
+	},
+
+// 	Credit card
+	'CreditCard': {
+		'title':		"Credit card",
+		'description':	"<p>Card number, expire date, CVV2 and PIN always at hand with Clipperz.</p>",
+		'fields': [
+			{label:"Type (Visa, AmEx, …)", type:'TXT'},
+			{label:"Number", type:'TXT'},
+			{label:"Owner name", type:'TXT'},
+			{label:"Expiry date", type:'TXT'},
+			{label:"CVV2", type:'TXT'},
+			{label:"PIN", type:'PWD'},
+			{label:"Card website", type:'URL'},
+			{label:"Username", type:'TXT'},
+			{label:"Password", type:'PWD'}
+		]
+	},
+
+// 	Address book entry	
+	'AddressBookEntry': {
+		'title':		"Address book entry",
+		'description':	"<p>Clipperz could also work as your new private address book. Use this template to easily add a new entry.</p>",
+		'fields': [
+			{label:"Name", type:'TXT'},
+			{label:"Email", type:'TXT'},
+			{label:"Phone", type:'TXT'},
+			{label:"Mobile", type:'TXT'},
+			{label:"Address", type:'ADDR'},
+		]
+	},
+
+//Custom card
+	'Custom': {
+		'title': 		"Custom card",
+		'description':	"<p>No matter which kind of confidential data you need to protect, create a custom card to match your needs.</p>",
+		'fields': [
+			{label:"Label 1", type:'TXT'},
+			{label:"Label 2", type:'TXT'},
+			{label:"Label 3", type:'TXT'}
+		]
+	}
+},
+
+
+'recordFieldTypologies': {
+	'TXT': {
+		description: "simple text field",
+		shortDescription: "text"
+	},
+	'PWD': {
+		description: "simple text field, with default status set to hidden",
+		shortDescription: "password"
+	},
+	'URL': {
+		description: "simple text field in edit mode, that became an active url in view mode",
+		shortDescription: "web address"
+	},
+	'DATE': {
+		description: "a value set with a calendar helper",
+		shortDescription: "date"
+	},
+	'ADDR': {
+		description: "just like the URL, but the active link points to Google Maps (or similar service) passing the address value as argument",
+		shortDescription: "street address"
+	},
+	'CHECK': {
+		description: "check description",
+		shortDescription: "check"
+	},
+	'RADIO': {
+		description: "radio description",
+		shortDescription: "radio"
+	},
+	'SELECT': {
+		description: "select description",
+		shortDescription: "select"
+	}
+},
+
+// Cards block - new card - warnings
+'newRecordPanelGeneralExceptionTitle':						"Error",
+'newRecordPanelGeneralExceptionMessage':					"The configuration text is not valid. Make sure to get your text from the bookmarklet pop-up and retry.",
+'newRecordPanelWrongBookmarkletVersionExceptionTitle':		"Error",
+'newRecordPanelWrongBookmarkletVersionExceptionMessage':	"The configuration text has been generated by an old version of the bookmarklet. Please update your bookmarklet and retry.",
+'newRecordPanelExceptionPanelCloseButtonLabel':				"Cancel",
+
+// Cards block - delete card
+'mainPanelDeletingRecordPanelConfirmationTitle':			"Deleting selected card",
+'mainPanelDeleteRecordPanelConfirmationText':				"Do your really want to delete the selected card?",
+'mainPanelDeleteRecordPanelConfirmButtonLabel':				"Yes",
+'mainPanelDeleteRecordPanelDenyButtonLabel':				"No",
+'mainPanelDeletingRecordPanelInitialTitle':					"Deleting selected card",
+'mainPanelDeletingRecordPanelInitialText':					"---",
+'mainPanelDeletingRecordPanelCompletedText':				"Done",
+
+// Cards block - delete card panel
+'deleteRecordPanelCollectRecordDataMessageTitle':		   	"Delete card",
+'deleteRecordPanelCollectRecordDataMessageText':		   	"Updating card list",
+'deleteRecordPanelEncryptUserDataMessageTitle':			   	"Delete card",
+'deleteRecordPanelEncryptUserDataMessageText':			   	"Local encryption of card headers",
+'deleteRecordPanelSendingDataToTheServerMessageTitle':	   	"Delete card",
+'deleteRecordPanelSendingDataToTheServerMessageText':	   	"Uploading encrypted card headers to Clipperz",
+'deleteRecordPanelUpdatingTheInterfaceMessageTitle':	   	"Delete card",
+'deleteRecordPanelUpdatingTheInterfaceMessageText':		   	"Updating the interface",
+	
+// Cards block - no record selected
+'recordDetailNoRecordSelectedTitle':						"No card selected",
+'recordDetailNoRecordSelectedDescription':					"<p>Please select a card from the list on the left.</p>",
+
+// Cards block - loading messages	
+'recordDetailLoadingRecordMessage':							"Downloading encrypted card from Clipperz",
+'recordDetailDecryptingRecordMessage':						"Local decryption of card\'s data",
+'recordDetailLoadingRecordVersionMessage':					"Downloading latest card version",
+'recordDetailDecryptingRecordVersionMessage':				"Local decryption of latest version",
+'recordDetailLoadingErrorMessageTitle':						"Error while downloading the card",
+	
+// Cards block - card details
+'recordDetailNotesLabel':									"Notes",
+'recordDetailLabelFieldColumnLabel':						"Field label",
+'recordDetailDataFieldColumnLabel':							"Field data",
+'recordDetailTypeFieldColumnLabel':							"Type",
+
+'recordDetailSavingChangesMessagePanelInitialTitle':		"Saving card",
+'recordDetailSavingChangesMessagePanelInitialText':			"---",
+
+'recordDetailRemoveFieldButtonLabel':						"-",
+'recordDetailAddFieldButtonLabel':							"Add new field",
+'recordDetailPasswordFieldHelpLabel':						"click the stars to select the password and then Ctrl-C to copy",
+
+'recordDetailPasswordFieldScrambleLabel':					"scramble",
+'recordDetailPasswordFieldUnscrambleLabel':					"unscramble",
+	
+'recordDetailDirectLoginBlockTitle':						"Direct logins",
+'recordDetailNewDirectLoginDescription':					"<p>Direct login configuration</p>",
+
+'recordDetailDirectLoginBlockNoDirectLoginConfiguredDescription':	"\
+	<p>Does this card contain credentials to access an online service?</p>\
+	<p>Use the bookmarklet to configure a “direct login” from Clipperz with just one click!</p>",
+
+'recordDetailDeleteDirectLoginButtonLabel':					"-",
+'recordDetailAddNewDirectLoginButtonLabel':					"Add new direct login",
+
+'recordDetailEditButtonLabel':								"Edit",
+'recordDetailSaveButtonLabel':								"Save",
+'recordDetailCancelButtonLabel':							"Cancel",
+
+'newRecordTitleLabel':										"_new card_",
+'newDirectLoginLabelSuffix':								"",
+
+// Cards block - save card panel
+'recordSaveChangesPanelCollectRecordInfoMessageTitle':			"Save card",
+'recordSaveChangesPanelCollectRecordInfoMessageText':			"Updating card headers",
+'recordSaveChangesPanelEncryptUserDataMessageTitle':			"Save card",
+'recordSaveChangesPanelEncryptUserDataMessageText':				"Local encryption of card headers",
+'recordSaveChangesPanelEncryptRecordDataMessageTitle':			"Save card",
+'recordSaveChangesPanelEncryptRecordDataMessageText':			"Local encryption of card's data",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageTitle':	"Save card",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageText':	"Local encryption of card's version data",
+'recordSaveChangesPanelSendingDataToTheServerMessageTitle':		"Save card",
+'recordSaveChangesPanelSendingDataToTheServerMessageText':		"Uploading encrypted card's header to Clipperz",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageTitle':		"Save card",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageText':		"Updating the interface",
+
+//	Password Generator strings
+'passwordGeneratorPanelTitle':									"Password generator",
+'passwordGeneratorPanelOkLabel':								"Ok",
+'passwordGeneratorPanelCancelLabel':							"Cancel",
+
+'passwordGeneratorLowercaseLabel':								"abc",
+'passwordGeneratorUppercaseLabel':								"ABC",
+'passwordGeneratorNumberLabel':									"012",
+'passwordGeneratorSymbolLabel':									"@#$",
+
+'passwordGeneratorLengthLabel':									"length:",
+
+
+//Miscellaneous strings	
+
+//'DWRUtilLoadingMessage':										"Loading data …",
+'comingSoon':													"coming soon …",
+'panelCollectingEntryopyMessageText':							"Collecting entropy",
+'directLoginConfigurationCheckBoxFieldSelectedValue':			"Yes",
+'directLoginConfigurationCheckBoxFieldNotSelectedValue':		"No",
+	
+
+		
+// NEW - Import panel
+'importFormats':	{
+	'CSV': {
+		'label':		"CSV",
+		'description':	"<p>A widely recognized file format that stores tabular data. Several password managers can export data to this format.</p>"
+	},
+	'Excel': {
+		'label':		"Excel",
+		'description':	"<p>The popular spreadsheet from Microsoft. Storing passwords in Excel files is very common but not advisable.</p>"
+	},
+	'KeePass': {
+		'label':		"KeePass",
+		'description':	"<p>The custom TXT file created by KeePass password manager.</p>"
+	},
+	'PasswordPlus': {
+		'label':		"Password Plus",
+		'description':	"<p>The custom CSV format produced by Password Plus, a password manager mostly used on mobile devices.</p>"
+	},
+	'Roboform': {
+		'label':		"RoboForm",
+		'description':	"<p>The special HTML file created by Roboform password manager when displaying Passcard and Safenotes for printing.</p>"
+	},
+	'ClipperzExport': {
+		'label':		"JSON",
+		'description':	"<p>The file created by Clipperz itself in JSON format. It preserves all information contained in your cards, even direct login configurations.</p>"
+	}
+},
+
+//	JSON
+'Clipperz_ImportWizard_Title':				"JSON import",
+'importOptions_clipperz_description':		"<p>Open the JSON file exported from Clipperz in a text editor. Then copy and paste its content to the text area below.</p>",
+
+//	CSV
+'CSV_ImportWizard_Title':					"CSV import",
+'importOptions_csv_description_':			"\
+	<p>Open the CSV file in a text editor. Then copy and paste its content to the text area below.</p>\
+	<p>Please select the special characters used within your file.</p>",
+
+//	Excel
+'Excel_ImportWizard_Title':					"Excel import",
+'importOptions_excel_description_':			"<p>Open the Excel file and select the cells you want to import. Then copy and paste them to the text area below.</p>",
+
+//	KeePass
+'KeePass_ImportWizard_Title':				"KeePass import",
+'importOptions_keePass_description_':		"<p>Open the TXT file created by Keepass in a text editor. Then copy and paste its content to the text area below.</p>",
+	
+//	PasswordPlus
+'PasswordPlus_ImportWizard_Title':			"Password Plus import",
+'importOptions_passwordPlus_description':	"<p>Open the CSV file created by PasswordPlus in a text editor. Then copy and paste its content to the text area below.</p>",
+
+//	RoboForm
+'RoboForm_ImportWizard_Title':				"RoboForm import",
+'importOptions_roboForm_description':		"<p>Open the HTML file created by RoboForm in a text editor. Then copy and paste its content to the text area below.</p>",
+	
+	
+'importData_parsingDataTitle':				"Import",
+'importData_parsingDataText':				"Parsing data …",
+
+'importData_previewingDataTitle':			"Import",
+'importData_previewingDataText':			"Processing data …",
+
+'importData_processingDataTitle':			"Import",
+'importData_processingDataText':			"Creating new cards …",
+	
+'ImportWizard': {
+	'EDIT':									"edit",
+	'PREVIEW':								"preview",
+	'IMPORT':								"import",
+	
+	'KEEPASS_SETTINGS':						"settings",
+	
+	'CSV_EDIT':								"paste",
+	'CSV_COLUMNS':							"columns",
+	'CSV_HEADER':							"labels",
+	'CSV_TITLE':							"titles",
+	'CSV_NOTES':							"notes",
+	'CSV_FIELDS':							"types",
+	
+	'EXCEL_EDIT':							"edit"
+},
+
+'CSV_ImportWizard_Columns':			"<p>Select the columns you want to import.</p>",
+'CSV_ImportWizard_Header':			"<p>If the first row of the CSV file contains field labels, tick off the checkbox below.</p>",
+'CSV_ImportWizard_Header_Settings_firstRowHeaderLabel':	"Use the first row as labels?",
+'CSV_ImportWizard_Title':			"<p>Select the column that contains titles of the cards you are importing. (mandatory)</p>",
+'CSV_ImportWizard_Notes':			"<p>Select the column that represents a \"notes\" field. (optional)</p>",
+'CSV_ImportWizard_Notes_Settings_noSelectionLabel':		"\"notes\" field not present",
+'CSV_ImportWizard_Fields':			"<p>Select the correct type for each column from the drop down lists.</p>",
+'CSV_ImportWizard_Fields_MissingLabelWarning':			"Missing label",
+
+'importData_importConfirmation_title':					"Import",
+'importData_importConfirmation_text':					"Do you want to import __numberOfRecords__ cards?",
+	
+
+//	Vulnerability warning
+'VulnerabilityWarning_Panel_title':			"Vulnerability warning",
+'VulnerabilityWarning_Panel_message':		"The action as been aborted due to a catched vulnerability",
+'VulnerabilityWarning_Panel_buttonLabel':	"Close",
+
+
+	
+//	All the loginInfo panel infos
+
+'WELCOME_BACK':						"Welcome back!",
+	
+'currentConnectionText':			"You are connected from ip&nbsp;__ip__, apparently from __country__, using __browser__ on __operatingSystem__.",
+'latestConnectionText':				"Your latest connection was __elapsedTimeDescription__ (__time__) from ip&nbsp;__ip__, apparently from __country__, using __browser__ on __operatingSystem__.",
+
+'fullLoginHistoryLinkLabel':		"show login history",
+	
+'elapsedTimeDescriptions': {
+	'MORE_THAN_A_MONTH_AGO':		"more than a month ago",
+	'MORE_THAN_A_WEEK_AGO':			"more than a week ago",
+	'MORE_THAN_*_WEEKS_AGO':		"more than __elapsed__ weeks ago",
+	'YESTERDAY':					"yesterday",
+	'*_DAYS_AGO':					"__elapsed__ days ago",
+	'ABOUT_AN_HOUR_AGO':			"about an hour ago",
+	'*_HOURS_AGO':					"__elapsed__ hours ago",
+	'JUST_A_FEW_MINUTES_AGO':		"just a few minutes ago",
+	'ABOUT_*_MINUTES_AGO':			"about __elapsed__ minutes ago"
+},
+
+'unknown_ip':						"unknown",
+	
+'countries': {
+	'--':			"unknown",
+	'AD':			"Andorra",
+	'AE':			"United Arab Emirates",
+	'AF':			"Afghanistan",
+	'AG':			"Antigua and Barbuda",
+	'AI':			"Anguilla",
+	'AL':			"Albania",
+	'AM':			"Armenia",
+	'AN':			"Netherlands Antilles",
+	'AO':			"Angola",
+	'AP':			"Non-Spec Asia Pas Location",
+	'AR':			"Argentina",
+	'AS':			"American Samoa",
+	'AT':			"Austria",
+	'AU':			"Australia",
+	'AW':			"Aruba",
+	'AX':			"Aland Islands",
+	'AZ':			"Azerbaijan",
+	'BA':			"Bosnia and Herzegowina",
+	'BB':			"Barbados",
+	'BD':			"Bangladesh",
+	'BE':			"Belgium",
+	'BF':			"Burkina Faso",
+	'BG':			"Bulgaria",
+	'BH':			"Bahrain",
+	'BI':			"Burundi",
+	'BJ':			"Benin",
+	'BM':			"Bermuda",
+	'BN':			"Brunei Darussalam",
+	'BO':			"Bolivia",
+	'BR':			"Brazil",
+	'BS':			"Bahamas",
+	'BT':			"Bhutan",
+	'BW':			"Botswana",
+	'BY':			"Belarus",
+	'BZ':			"Belize",
+	'CA':			"Canada",
+	'CD':			"Congo the Democratic Republic of the",
+	'CF':			"Central African Republic",
+	'CH':			"Switzerland",
+	'CI':			"Cote D'ivoire",
+	'CK':			"Cook Islands",
+	'CL':			"Chile",
+	'CM':			"Cameroon",
+	'CN':			"China",
+	'CO':			"Colombia",
+	'CR':			"Costa Rica",
+	'CS':			"Serbia and Montenegro",
+	'CU':			"Cuba",
+	'CY':			"Cyprus",
+	'CZ':			"Czech Republic",
+	'DE':			"Germany",
+	'DJ':			"Djibouti",
+	'DK':			"Denmark",
+	'DO':			"Dominican Republic",
+	'DZ':			"Algeria",
+	'EC':			"Ecuador",
+	'EE':			"Estonia",
+	'EG':			"Egypt",
+	'ER':			"Eritrea",
+	'ES':			"Spain",
+	'ET':			"Ethiopia",
+	'EU':			"European Union",
+	'FI':			"Finland",
+	'FJ':			"Fiji",
+	'FM':			"Micronesia Federated States of",
+	'FO':			"Faroe Islands",
+	'FR':			"France",
+	'GA':			"Gabon",
+	'GB':			"United Kingdom",
+	'GD':			"Grenada",
+	'GE':			"Georgia",
+	'GF':			"French Guiana",
+	'GG':			"Guernsey",
+	'GH':			"Ghana",
+	'GI':			"Gibraltar",
+	'GL':			"Greenland",
+	'GM':			"Gambia",
+	'GP':			"Guadeloupe",
+	'GR':			"Greece",
+	'GT':			"Guatemala",
+	'GU':			"Guam",
+	'GW':			"Guinea-Bissau",
+	'GY':			"Guyana",
+	'HK':			"Hong Kong",
+	'HN':			"Honduras",
+	'HR':			"Croatia (Local Name: Hrvatska)",
+	'HT':			"Haiti",
+	'HU':			"Hungary",
+	'ID':			"Indonesia",
+	'IE':			"Ireland",
+	'IL':			"Israel",
+	'IM':			"Isle of Man",
+	'IN':			"India",
+	'IO':			"British Indian Ocean Territory",
+	'IQ':			"Iraq",
+	'IR':			"Iran (Islamic Republic of)",
+	'IS':			"Iceland",
+	'IT':			"Italy",
+	'JE':			"Jersey",
+	'JM':			"Jamaica",
+	'JO':			"Jordan",
+	'JP':			"Japan",
+	'KE':			"Kenya",
+	'KG':			"Kyrgyzstan",
+	'KH':			"Cambodia",
+	'KI':			"Kiribati",
+	'KN':			"Saint Kitts and Nevis",
+	'KR':			"Korea Republic of",
+	'KW':			"Kuwait",
+	'KY':			"Cayman Islands",
+	'KZ':			"Kazakhstan",
+	'LA':			"Lao People's Democratic Republic",
+	'LB':			"Lebanon",
+	'LC':			"Saint Lucia",
+	'LI':			"Liechtenstein",
+	'LK':			"Sri Lanka",
+	'LR':			"Liberia",
+	'LS':			"Lesotho",
+	'LT':			"Lithuania",
+	'LU':			"Luxembourg",
+	'LV':			"Latvia",
+	'LY':			"Libyan Arab Jamahiriya",
+	'MA':			"Morocco",
+	'MC':			"Monaco",
+	'MD':			"Moldova Republic of",
+	'MG':			"Madagascar",
+	'MH':			"Marshall Islands",
+	'MK':			"Macedonia the Former Yugoslav Republic of",
+	'ML':			"Mali",
+	'MM':			"Myanmar",
+	'MN':			"Mongolia",
+	'MO':			"Macau",
+	'MP':			"Northern Mariana Islands",
+	'MR':			"Mauritania",
+	'MS':			"Montserrat",
+	'MT':			"Malta",
+	'MU':			"Mauritius",
+	'MV':			"Maldives",
+	'MW':			"Malawi",
+	'MX':			"Mexico",
+	'MY':			"Malaysia",
+	'MZ':			"Mozambique",
+	'NA':			"Namibia",
+	'NC':			"New Caledonia",
+	'NF':			"Norfolk Island",
+	'NG':			"Nigeria",
+	'NI':			"Nicaragua",
+	'NL':			"Netherlands",
+	'NO':			"Norway",
+	'NP':			"Nepal",
+	'NR':			"Nauru",
+	'NU':			"Niue",
+	'NZ':			"New Zealand",
+	'OM':			"Oman",
+	'PA':			"Panama",
+	'PE':			"Peru",
+	'PF':			"French Polynesia",
+	'PG':			"Papua New Guinea",
+	'PH':			"Philippines",
+	'PK':			"Pakistan",
+	'PL':			"Poland",
+	'PR':			"Puerto Rico",
+	'PS':			"Palestinian Territory Occupied",
+	'PT':			"Portugal",
+	'PW':			"Palau",
+	'PY':			"Paraguay",
+	'QA':			"Qatar",
+	'RO':			"Romania",
+	'RS':			"Serbia",
+	'RU':			"Russian Federation",
+	'RW':			"Rwanda",
+	'SA':			"Saudi Arabia",
+	'SB':			"Solomon Islands",
+	'SC':			"Seychelles",
+	'SD':			"Sudan",
+	'SE':			"Sweden",
+	'SG':			"Singapore",
+	'SI':			"Slovenia",
+	'SK':			"Slovakia (Slovak Republic)",
+	'SL':			"Sierra Leone",
+	'SM':			"San Marino",
+	'SN':			"Senegal",
+	'SR':			"Suriname",
+	'SV':			"El Salvador",
+	'SY':			"Syrian Arab Republic",
+	'SZ':			"Swaziland",
+	'TC':			"Turks and Caicos Islands",
+	'TG':			"Togo",
+	'TH':			"Thailand",
+	'TJ':			"Tajikistan",
+	'TM':			"Turkmenistan",
+	'TN':			"Tunisia",
+	'TO':			"Tonga",
+	'TR':			"Turkey",
+	'TT':			"Trinidad and Tobago",
+	'TV':			"Tuvalu",
+	'TW':			"Taiwan Province of China",
+	'TZ':			"Tanzania United Republic of",
+	'UA':			"Ukraine",
+	'UG':			"Uganda",
+	'US':			"United States",
+	'UY':			"Uruguay",
+	'UZ':			"Uzbekistan",
+	'VA':			"Holy See (Vatican City State)",
+	'VE':			"Venezuela",
+	'VG':			"Virgin Islands (British)",
+	'VI':			"Virgin Islands (U.S.)",
+	'VN':			"Viet Nam",
+	'VU':			"Vanuatu",
+	'WF':			"Wallis and Futuna Islands",
+	'WS':			"Samoa",
+	'YE':			"Yemen",
+	'ZA':			"South Africa",
+	'ZM':			"Zambia",
+	'ZW':			"Zimbabwe",
+	'ZZ':			"Reserved"
+},
+
+'browsers': {
+	'UNKNOWN':		"Unknown",
+	'MSIE':			"Internet Explorer",
+	'FIREFOX':		"Firefox",
+	'OPERA':		"Opera",
+	'SAFARI':		"Safari",
+	'OMNIWEB':		"OmniWeb",
+	'CAMINO':		"Camino",
+	'CHROME':		"Chrome"
+},
+
+'operatingSystems': {
+	'UNKNOWN':		"Unknown",
+	'WINDOWS':		"Windows",
+	'MAC':			"Mac",
+	'LINUX':		"Linux",
+	'IPHONE':		"iPhone",
+	'MOBILE':		"Mobile",
+	'OPENBSD':		"OpenBSD",
+	'FREEBSD':		"FreeBSD",
+	'NETBSD':		"NetBSD"
+},
+	
+	
+//	Calendar texts
+'calendarStrings': {
+	'months': 	{
+		'0':	"January",
+		'1':	"February",
+		'2':	"March",
+		'3':	"April",
+		'4':	"May",
+		'5':	"June",
+		'6':	"July",
+		'7':	"August",
+		'8':	"September",
+		'9':	"October",
+		'10':	"November",
+		'11':	"December"
+	},
+	'shortMonths':	{
+		'0':	"Jan",
+		'1':	"Feb",
+		'2':	"Mar",
+		'3':	"Apr",
+		'4':	"May",
+		'5':	"Jun",
+		'6':	"Jul",
+		'7':	"Aug",
+		'8':	"Sep",
+		'9':	"Oct",
+		'10':	"Nov",
+		'11':	"Dec"
+	},
+
+	'days':	{
+		'0':	"Sunday",
+		'1':	"Monday",
+		'2':	"Tuesday",
+		'3':	"Wednesday",
+		'4':	"Thursday",
+		'5':	"Friday",
+		'6':	"Saturday"
+	},
+
+	'shortDays':	{
+		'0':	"Sun",
+		'1':	"Mon",
+		'2':	"Tue",
+		'3':	"Wed",
+		'4':	"Thu",
+		'5':	"Fri",
+		'6':	"Sat"
+	},
+
+	'veryShortDays':	{
+		'0':	"Su",
+		'1':	"Mo",
+		'2':	"Tu",
+		'3':	"We",
+		'4':	"Th",
+		'5':	"Fr",
+		'6':	"Sa"
+	},
+
+	'amDesignation':	"am",
+	'pmDesignation':	"pm"
+},
+
+
+// Date format
+'fullDate_format':	"l, F d, Y H:i:s",
+	
+__syntaxFix__: "syntax fix"
+
+}
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_es-ES.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_es-ES.js
new file mode 100644
index 0000000..1541d5f
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_es-ES.js
@@ -0,0 +1,480 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+Clipperz.PM.Strings.Languages['es-ES'.toLowerCase()] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+'clipperzServiceDescription':	"<h2>Guárdelo usted mismo!</h2> <ul> <li> <h3>Clipperz es:</h3> <ul> <li> <p>un simple y seguro administrador de contraseñas</p> </li> <li> <p>una efectiva y simple solución de logueo</p> </li> <li> <p>un maletín digital para sus datos confidenciales</p> </li> </ul> </li> <li> <h3>Con Clipperz usted puede:</h3> <ul> <li> <p>administrar y almacenar en línea sus contraseñas y credenciales digitales</p> </li> <li> <p>ingresar en sus servicios  web  sin ningún nombre de usuario o contraseña</p> </li> <li> <p>protejer todos sus datos sensibles: códigos de alarmas, PINs y números de tarjetas de crédito, &hellip;</p> </li> <li> <p>compartir secretos con sus familiares y socios</p> </li> </ul> </li> <li> <h3>Beneficios de Clipperz:</h3> <ul> <li> <p>es gratis y completamente anónimo</p> </li> <li> <p>con acceso en cualquier momento y desde cualquier ordenador</p> </li> <li> <p>no necesita instalar o descargar ningún programa</p> </li> <li> <p>no necesita guardar secretos en papel o en el ordenador</p> </li> </ul> </li> <li> <h3>Seguridad de Clipperz:</h3> <ul> <li> <p>sus secretos son localmente encriptados por su navegador antes de ser almacenados en  Clipperz</p> </li> <li> <p>la llave de encriptación es una frase clave conocida solo por usted</p> </li> <li> <p>Clipperz almacena sus datos de manera encriptada y nunca accede a ellos en forma de texto plano</p> </li> <li> <p>Clipperz esta basado en esquemas estándares de encriptación, no hemos inventado nada</p> </li> <li> <p>usted puede revisar el código todas las veces que lo desee, ¡ pero no necesita conocer algo de encriptación para ser un usuario feliz!</p> </li> </ul> </li> <li> <a href=\"http://www.clipperz.com\" target=\"_blank\">Aprender más</a> </li> </ul> ",
+'loginFormTitle':	"ingrese con su usuario Clipperz",
+'loginFormUsernameLabel':	"usuario",
+'loginFormPassphraseLabel':	"frase clave",
+'loginFormDontHaveAnAccountLabel':	"¿no tiene una cuenta?",
+'loginFormCreateOneLabel':	"crear una",
+'loginFormForgotYourCredentialsLabel':	"¿perdió sus credenciales?",
+'loginFormAarghThatsBadLabel':	"¡Ahhh! ¡eso es malo!",
+'loginFormAfraidOfMaliciousScriptsLabel':	"¿evitar scripts maliciosos?",
+'loginFormVerifyTheCodeLabel':	"verificar el código",
+'loginFormButtonLabel':	"Ingresar",
+'loginFormOneTimePasswordCheckboxLabel':	"usar una frase clave desechable",
+'loginPanelSwithLanguageDescription':	"<h5>Cambiar a su lenguaje preferido</h5> ",
+'browserCompatibilityDescription':	"<p>Obtenga una mejor y más segura experiencia con Firefox. De todas maneras Clipperz funciona también con Opera y MS Explorer!</p> ",
+'OTPloginMessagePanelInitialTitle':	"Ingresar usando una frase clave desechable",
+'OTPloginMessagePanelInitialText':	"Enviando credenciales OTP ...",
+'OTPloginMessagePanelLoadingTitle':	"Ingresar usando una frase clave desechable",
+'OTPloginMessagePanelLoadingText':	"Descargando datos de autenticación encriptados desde el servidor ...",
+'OTPloginMessagePanelProcessingTitle':	"Ingresar usando una frase clave desechable",
+'OTPloginMessagePanelProcessingText':	"Desencriptación local de datos de autenticación ...",
+'loginMessagePanelInitialTitle':	"Ingresando ...",
+'loginMessagePanelInitialButtonLabel':	"Cancelar",
+'loginMessagePanelConnectedTitle':	"Conectado",
+'loginMessagePanelConnectedText':	"Hecho",
+'loginMessagePanelFailureTitle':	"Error",
+'loginMessagePanelFailureText':	"Ingreso fallido",
+'loginMessagePanelFailureButtonLabel':	"Cerrar",
+'connectionLoginSendingCredentialsMessageTitle':	"Verificando credenciales",
+'connectionLoginSendingCredentialsMessageText':	"Enviando credenciales",
+'connectionLoginCredentialsVerificationMessageTitle':	"Verificando credenciales",
+'connectionLoginCredentialsVerificationMessageText':	"Realizando una autenticación SRP",
+'connectionLoginDoneMessageTitle':	"Verificando credenciales",
+'connectionLoginDoneMessageText':	"Conectado",
+'userLoginPanelUpgradingUserCredentialsMessageTitle':	"Verificando credenciales",
+'userLoginPanelUpgradingUserCredentialsMessageText':	"Actualizando sus credenciales al nuevo esquema de autenticación",
+'userLoginPanelConnectedMessageTitle':	"Usuario autenticado",
+'userLoginPanelConnectedMessageText':	"Exitosamente logueado",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageTitle':	"Verifying credentials",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageText':	"Probando un esquema de autenticación antiguo",
+'userLoginPanelLoadingUserDataMessageTitle':	"Usuario autenticado",
+'userLoginPanelLoadingUserDataMessageText':	"Descargando encabezamientos encriptados desde Clipperz",
+'userLoginPanelDecryptingUserDataMessageTitle':	"Usuario autenticado",
+'userLoginPanelDecryptingUserDataMessageText':	"Desencriptación local de datos",
+'userLoginPanelDecryptingUserStatisticsMessageTitle':	"Usuario autenticado",
+'userLoginPanelDecryptingUserStatisticsMessageText':	"Desencriptación local de estadísticas de uso",
+'splashAlertTitle':	"¡Bienvenido a Clipperz!",
+'splashAlertText':	"<p>Algunas advertencias sobre seguridad</p> <ul> <li> <p>Almacenar sus datos en Clipperz es tan seguro como la frase clave que usted elija para protegerlos. Nadie puede acceder a ellos a no ser que conozca la frase clave.</p> </li> <li> <p>Si usted va a usar Clipperz para guardar información sensible y crítica, esté seguro de elegir una frase clave fuerte. ¡Cuanto más larga mejor!</p> </li> <li> <p>Clipperz no le permitirá recuperar una frase clave perdida.</p> </li> </ul> <p>Si necesita más información, por favor visite  el sitio de <a href=\"http://www.clipperz.com\" target=\"_blank\">Clipperz</a>.</p> ",
+'splashAlertCloseButtonLabel':	"Aceptar",
+'registrationFormTitle':	"Abrir su cuenta",
+'registrationFormUsernameLabel':	"usuario",
+'registrationFormPassphraseLabel':	"frase clave",
+'registrationFormRetypePassphraseLabel':	"reingrese la frase clave",
+'registrationFormSafetyCheckLabel':	"Yo entiendo que Clipperz no me permite recuperar frases clave perdidas",
+'registrationFormTermsOfServiceCheckLabel':	"He leído y estoy de acuerdo con los <a href='http://www.clipperz.com/terms_of_service' target='_blank'>Términos de Servicio</a>.",
+'registrationFormDoYouAlreadyHaveAnAccountLabel':	"¿usted ya tiene una cuenta?",
+'registrationFormSimplyLoginLabel':	"ingreso simple",
+'registrationFormButtonLabel':	"Registrarse",
+'registrationFormWarningMessageNotMatchingPassphrases':	"Su frase clave no coincide, por favor reescríbala.",
+'registrationFormWarningMessageSafetyCheckNotSelected':	"Por favor, lea y chequee todas las casillas debajo.",
+'registrationFormWarningMessageTermsOfServiceCheckNotSelected':	"Usted necesita estar de acuerdo con los Términos de Servicio.",
+'registrationMessagePanelInitialTitle':	"Creando cuenta ...",
+'registrationMessagePanelInitialButtonLabel':	"Cancelar",
+'registrationMessagePanelRegistrationDoneTitle':	"Registración",
+'registrationMessagePanelRegistrationDoneText':	"Hecho",
+'registrationMessagePanelFailureTitle':	"Registración fallada",
+'registrationMessagePanelFailureButtonLabel':	"Cerrar",
+'connectionRegistrationSendingRequestMessageText':	"Verificando credenciales",
+'connectionRegistrationSendingCredentialsMessageText':	"Enviando credenciales",
+'registrationSplashPanelTitle':	"Aviso de seguridad",
+'registrationSplashPanelDescriptionConfig':	"<p>Estas son sus credenciales de Clipperz, cuídelas. ¡Clipperz nunca más le mostrará su cuenta y frase clave por segunda vez!</p> ",
+'registrationSplashPanelUsernameLabel':	"usuario",
+'registrationSplashPanelPassphraseLabel':	"frase clave",
+'registrationSplashPanelShowPassphraseButtonLabel':	" mostrar frase clave",
+'donateHeaderLinkLabel':	"donaciones",
+'creditsHeaderLinkLabel':	"créditos",
+'feedbackHeaderLinkLabel':	"contacto",
+'helpHeaderLinkLabel':	"ayuda",
+'forumHeaderLinkLabel':	"foro",
+'recordMenuLabel':	"tarjetas",
+'accountMenuLabel':	"cuenta",
+'dataMenuLabel':	"datos",
+'contactsMenuLabel':	"contactos",
+'toolsMenuLabel':	"herramientas",
+'logoutMenuLabel':	"salir",
+'lockMenuLabel':	"bloquear",
+'lockTitle':	"La cuenta está bloqueada",
+'lockDescriptionConfig':	"<p>Para desbloquear su cuenta, por favor ingrese su frase clave</p> ",
+'unlockButtonLabel':	"desbloquear",
+'changePasswordTabLabel':	"Cambiar su frase clave",
+'changePasswordTabTitle':	"Cambiar su frase clave",
+'changePasswordFormUsernameLabel':	"usuario",
+'changePasswordFormOldPassphraseLabel':	"frase clave anterior",
+'changePasswordFormNewPassphraseLabel':	"nueva frase clave",
+'changePasswordFormRetypePassphraseLabel':	"reingrese su nueva frase clave",
+'changePasswordFormSafetyCheckboxLabel':	"Yo entiendo que Clipperz no me permite recuperar una frase clave perdida.",
+'changePasswordFormSubmitLabel':	"Cambiar",
+'changePasswordFormWrongUsernameWarning':	"Usuario incorrecto",
+'changePasswordFormWrongPassphraseWarning':	"Frase clave incorrecta",
+'changePasswordFormWrongRetypePassphraseWarning':	"Sus frases claves no coinciden, por favor reescríbalas.",
+'changePasswordFormSafetyCheckWarning':	"Por favor lea y seleccione la casilla de abajo.",
+'changePasswordFormProgressDialogTitle':	"Cambiando credenciales de usuario",
+'changePasswordFormProgressDialogConnectedMessageTitle':	"Conectado",
+'changePasswordFormProgressDialogConnectedMessageText':	"Hecho",
+'changePasswordFormProgressDialogErrorMessageTitle':	"Error",
+'changePasswordFormProgressDialogErrorMessageText':	"¡Cambio de credenciales fallado!",
+'changeCredentialsPanelEncryptingDataMessageTitle':	"Cambiando su frase clave",
+'changeCredentialsPanelEncryptingDataMessageText':	"Encriptación local de encabezados de tarjetas",
+'changeCredentialsPanelCreatingNewCredentialsMessageTitle':	"Cambiando su frase clave",
+'changeCredentialsPanelCreatingNewCredentialsMessageText':	"Actualizando su credenciales",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle':	"Cambiando su frase clave",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageText':	"Subiendo sus credenciales encriptadas a Clipperz",
+'changeCredentialsPanelDoneMessageTitle':	"Cambiando su frase clave",
+'changeCredentialsPanelDoneMessageText':	"Hecho",
+'manageOTPTabLabel':	"Administrar su frases clave desechables",
+'manageOTPTabTitle':	"Administrar su frases clave desechables",
+'manageOTPTabDescription':	"<p>Una frase clave desechable uso funciona como una frase clave regular, pero puede ser usada solo una vez.</p> <p>Si las misma frase clave es usada nuevamente en un segundo intento de acceso, esta será rechazada y el proceso de acceso fallará.</p> <p>Inmediatamente después de un acceso exitoso, su on-time frase clave será borrada previniendo accesos fraudulentos.</p> <p>Frases claves desechables son una excelente elección para protegerse de keyloggers y spywares, que pueden recolectar datos desde máquinas comprometidas.</p> <p> <b>Le recomendamos muy fuertemente que use frases claves desechables uso cuando acceda a Clipperz desde terminales públicas, como Internet Cafés, Cybercafés y bibliotecas.</b> </p> ",
+'oneTimePasswordReadOnlyMessage':	"<h6>¡Disculpe!</h6> <p>Usted no puede usar su frases clave desechables mientras usa la versión fuera de línea de Clipperz.</p> ",
+'oneTimePasswordLoadingMessage':	"<h6>Cargando datos</h6> <p>Por favor espere ...</p> ",
+'oneTimePasswordNoPasswordAvailable':	"<h6>No hay frase clave desechables disponible</h6> <p>Haga click en el botón “Nueva” para agregar una frase clave desechables a su cuenta.</p> ",
+'createNewOTPButtonLabel':	"Nueva",
+'deleteOTPButtonLabel':	"Borrar",
+'printOTPButtonLabel':	"Imprimir",
+'disabledOneTimePassword_warning':	"desabilitado",
+'oneTimePasswordSelectionLink_selectLabel':	"Seleccionar:",
+'oneTimePasswordSelectionLink_all':	"todo",
+'oneTimePasswordSelectionLink_none':	"ninguna",
+'oneTimePasswordSelectionLink_used':	"usada",
+'oneTimePasswordSelectionLink_unused':	"sin uso",
+'saveOTP_encryptUserDataTitle':	"Guardando frase clave desechable",
+'saveOTP_encryptUserDataText':	"Procesando nuevas credenciales OTP ...",
+'saveOTP_encryptOTPDataTitle':	"Guardando frase clave desechable",
+'saveOTP_encryptOTPDataText':	"Encriptación local de datos de autenticación ...",
+'saveOTP_sendingDataTitle':	"Guardando frase clave desechable",
+'saveOTP_sendingDataText':	"Enviando datos de autenticación al servidor ...",
+'saveOTP_updatingInterfaceTitle':	"Guardando frase clave desechable",
+'saveOTP_updatingInterfaceText':	"Actualizando interface ...",
+'accountPreferencesLabel':	"Preferencias",
+'accountPreferencesTabTitle':	"Preferencias",
+'accountPreferencesLanguageTitle':	"Seleccione el lenguaje",
+'accountPreferencesLanguageDescription':	"<p>Elija su lenguaje preferido de la siguiente lista.<p> ",
+'showDonationReminderPanelTitle':	"Recordatorios de donaciones",
+'showDonationReminderPanelDescription':	"<p>Mostrar recordatorios de donaciones</p> ",
+'accountPreferencesInterfaceTitle':	"Personalización de la interface",
+'accountPreferencesInterfaceDescription':	"<p>Ajuste Clipperz a sus necesidades.</p> ",
+'saveUserPreferencesFormSubmitLabel':	"Guardar",
+'cancelUserPreferencesFormSubmitLabel':	"Cancelar",
+'accountPreferencesSavingPanelTitle_Step1':	"Guardando preferencias",
+'accountPreferencesSavingPanelText_Step1':	"Encriptación local de sus preferencias",
+'accountPreferencesSavingPanelTitle_Step2':	"Guardando preferencias",
+'accountPreferencesSavingPanelText_Step2':	"Enviando preferencias encriptadas a Clipperz",
+'accountLoginHistoryLabel':	"Historial de accesos",
+'loginHistoryTabTitle':	"Historial de accesos",
+'loginHistoryReadOnlyMessage':	"<h6>¡Perdón!</h6> <p>El historial de acceso no está disponible mientras usa la versión fuera de línea de Clipperz.</p> ",
+'loginHistoryLoadingMessage':	"<h6>Cargando datos</h6> <p>Por favor espere ...</p> ",
+'loginHistoryLoadedMessage':	"<h6>Sus últimos 10 accesos</h6> <p> </p> ",
+'loginHistoryIPLabel':	"IP",
+'loginHistoryTimeLabel':	"fecha",
+'loginHistoryCurrentSessionText':	"sesión actual",
+'loginHistoryReloadButtonLabel':	"Refrescar historial de acceso",
+'deleteAccountTabLabel':	"Borrar su cuenta",
+'deleteAccountTabTitle':	"Borrar su cuenta",
+'deleteAccountFormUsernameLabel':	"usuario",
+'deleteAccountFormPassphraseLabel':	"frase clave",
+'deleteAccountFormSafetyCheckboxLabel':	"Yo entiendo que todos mis datos serán borrados y que esta acción es irreversible.",
+'deleteAccountFormSubmitLabel':	"Borrar mi cuenta",
+'deleteAccountFormWrongUsernameWarning':	"Usuario incorrecto",
+'deleteAccountFormWrongPassphraseWarning':	"Frase clave incorrecta",
+'deleteAccountFormSafetyCheckWarning':	"Por favor, léa y marque la opción debajo.",
+'accountPanelDeletingAccountPanelConfirmationTitle':	"ATENCIÓN",
+'accountPanelDeleteAccountPanelConfirmationText':	"¿Esta Ud. seguro que desea borrar esta cuenta?",
+'accountPanelDeleteAccountPanelConfirmButtonLabel':	"Sí",
+'accountPanelDeleteAccountPanelDenyButtonLabel':	"No",
+'offlineCopyTabLabel':	"Copia fuera de línea",
+'offlineCopyTabTitle':	"Copia fuera de línea",
+'offlineCopyTabDescription':	"<p>Con solo un clik usted puede descargar todos sus datos encriptados desde los servidores de Clipperz a su disco rígido y crear una versión solo-lectura fuera de línea para ser usada cuando usted no está conectado a Internet.</p> <p>La versión solo-lectura es tan segura como la lectura-escritura y no expondrá sus datos a mayores riegos desde el momento que ambas comparten el mismo código y arquitectura de seguridad.</p> <ol> <li> <p>Haga click en el link debajo para comenzar la descarga.</p> </li> <li> <p>El navegador le preguntará que hacer con el archivo “Clipperz_YYYYMMDD.html”. Guárdelo en su disco rígido.</p> </li> <li> <p>Haga doble click en el archivo descargado para ejecutar la versión fuera de línea en su navegador.</p> </li> <li> <p>Ingrese el usuario y la frase clave habitual.</p> </li> </ol> ",
+'offlineCopyDownloadLinkLabel':	"Descargar",
+'offlineCopyDownloadWarning':	"<h4> <a href=\"#\" id=\"offlineCopyDownloadWarningLink\">¡Actualize su “copia fuera de línea”!</a> </h4> <p>Usted ha recientemente creado o modificado una o más tarjetas, podría ser necesario que realize una nueva “copia fuera de línea”.</p> ",
+'sharingTabLabel':	"Compartir",
+'sharingTabTitle':	"Compartir",
+'sharingTabDescription':	"<p>Muy frecuentemente una pieza de información confidencial necesita ser compartida con una o más personas.</p> <p>Esto debería ser tan simple como darle a sus colegas el accese al código de su casilla de voz cuando está fuera de la oficina, o tan complicado con habilitarles a sus herederos el derecho de acceder a su caja de seguridad en su banco.</p> <p>Clipperz puede permitirle compartir sus secretos de una forma segura y directa.</p> <p> </p> <p> <b>Proximamente ...</b> </p> ",
+'importTabLabel':	"Importar",
+'importTabTitle':	"Importar",
+'importTabDescription':	"<p> <b>Proximamente ...</b> </p> ",
+'printingTabLabel':	"Exportar",
+'printingTabTitle':	"Exportar",
+'printingTabDescription':	"<p> <b>Imprima sus datos</b> </p> <p>Haciendo click en el enlace que sigue se abrirá una nueva ventana mostrando todas sus tarjetas en un formato imprimible.</p> <p>Si usted está imprimiendo con propósitos de respaldo, por favor considere la opción más segura provista por la creación de una “copia fuera de línea”.</p> ",
+'printingLinkLabel':	"Versión imprimible",
+'contactsTabLabel':	"Contactos",
+'contactsTabTitle':	"Contactos",
+'passwordGeneratorTabLabel':	"Generador de contraseñas",
+'passwordGeneratorTabTitle':	"Generador de contraseñas",
+'paswordGeneratorTabDescriptionConfig':	"<p> </p> ",
+'passwordGeneratorTabButtonLabel':	"Generar contraseña",
+'bookmarkletTabLabel':	"Bookmarklet",
+'bookmarkletTabTitle':	"Bookmarklet",
+'bookmarkletTabDescription':	"<p>Un bookmarklet es una simple herramienta de \"un click\" que puede realizar tareas muy útiles. Este puede ser grabado y usado como un marcador normal de una página web.</p> <p>El Clipperz bookmarklet le ayudará a usted a crear rapidamente tarjetas nuevas y accesos directos dentro de las tarjetas existentes.</p> <p> <b>Por favor tenga en cuenta que el bookmarklet no incluye ninguna información relacionadas con su cuenta (ej: su nombre de usuario o clave), el bookmarklet es una herramienta general que contiene el mismo código para todos los usuarios de Clipperz.</b> </p> <h3>How to install the bookmarklet</h3> <h5>Firefox, Camino, Opera, Safari</h5> <ol> <li> <p>Asegúrese que la “Barra de marcadores” está mostrada seleccionando “Ver > Barra de herramientas > Barra de marcadores”, menú similar, desde el menú del navegador.</p> </li> <li> <p>Arrastre el enlace “Agregar a Clipperz” sobre la barra de marcadores.</p> </li> </ol> <h5>Internet Explorer</h5> <ol> <li> <p>Asegúrese que la barra “Vínculos” es mostrada seleccionando “Ver > Barra de Herramientas > Herramientas > Vínculos” desde el menú del navegador.</p> </li> <li> <p>Haga click con el botón derecho del mouse en el link “Agregar a Clipperz”.</p> </li> <li> <p>Seleccione “Agregar a favoritos” desde el menú contextual.</p> </li> <li> <p>Haga click en “Si” o “Acepto” a cualquier advertencia de seguridad que le aparezca.</p> </li> <li> <p>Abra la carpeta “Vínculos” y haga click en “OK”</p> </li> </ol> ",
+'bookmarkletTabBookmarkletTitle':	"Agregar a Clipperz",
+'bookmarkletTabInstructions':	"<h3>Como crear una nueva tarjeta que incluya un enlace de “acceso directo” a un servicio en línea.</h3> <ol> <li> <p>Abra una página web dónde el formulario de logueo está almacenado (es la página donde usualmente ingresa sus credenciales firmadas)</p> </li> <li> <p>Ejecute  el bookmarklet haciendo click en éste: una ventana emergente (pop-up) aparecerá sobre la página web.</p> </li> <li> <p>Copie al portapapeles el contenido de todo el texto dentro de la ventana emergente (pop-up) (Ctrl-C)</p> </li> <li> <p>Ingrese en su cuenta Clipperz y haga click en el botón <b>Agregar nueva tarjeta</b>.</p> </li> <li> <p>Seleccione la plantilla “Acceso directo” y pegue el contenido del portapapeles en el formulario (Ctrl-V)</p> </li> <li> <p>Haga click en el botón <b>Crear</b>, revise los datos y luego haga click en <b>Guardar</b>.</p> </li> </ol> <h3>Cómo agregar un enlace “acceso directo” a una tarjeta existente</h3> <ol> <li> <p>Igual que arriba.</p> </li> <li> <p>Igual que arriba.</p> </li> <li> <p>Igual que arriba.</p> </li> <li> <p>Ingrese en su cuenta Clipperz y seleccione una tarjeta conteniendo las credenciales de un servicio web que usted visitó y haga click en el botón <b>Editar</b>.</p> </li> <li> <p>Pegue el contenido del portapapeles en el área de texto de la sección “Acceso directo” (Ctrl-V)</p> </li> <li> <p>Haga click en el botón <b>Agregar acceso directo</b>, revise los detalles y luego haga click en <b>Guardar</b>.</p> </li> </ol> <p> </p> <p>Más información sobre bookmarklet está <a href=\"http://www.clipperz.com/support/user_guide/bookmarklet\" target=\"_blank\">disponible aquí</a>.</p> ",
+'mainPanelDirectLoginBlockLabel':	"Accesos directos",
+'directLinkReferenceShowButtonLabel':	"ver",
+'mainPanelDirectLoginBlockDescription':	"<p>¡ Agregar “accesos directos” para ingresar en sus cuentas de la web sin necesidad de escribir nombres de usuarios o claves!</p> <p>“Accesos directos” incrementa notablemente la seguridad de sus claves desde que ud. puede:</p> <ul> <li> <p>usar claves complejas con comodidad;</p> </li> <li> <p>nunca más reusar la misma clave simple.</p> </li> </ul> <p> </p> <a href=\"http://www.clipperz.com/support/user_guide/direct_logins\" target=\"_blank\">Apreender más sobre “accesos directos”</a> ",
+'mainPanelRecordsBlockLabel':	"Tarjetas",
+'mainPanelAddRecordButtonLabel':	"Agregar tarjeta nueva",
+'mainPanelRemoveRecordButtonLabel':	"Borrar tarjeta",
+'mainPanelRecordFilterBlockAllLabel':	"todo",
+'mainPanelRecordFilterBlockTagsLabel':	"tags",
+'mainPanelRecordFilterBlockSearchLabel':	"buscar",
+'recordDetailNoRecordAtAllTitle':	"¡Bienvenido a Clipperz!",
+'recordDetailNoRecordAtAllDescription':	"<h5>Comienze agregando tarjetas a su cuenta.</h5> <p>Tarjetas son formularios simples y flexibles donde Usted puede almacenar sus claves y cualquier otro dato confidencial.</p> <p>Tarjetas pueden contener credenciales para acceder a un sitio web, la conbinación del candado de su bicicleta, detalles de su tarjeta de crédito, ....</p> <h5>¡No olvide los bookmarklet!</h5> <p>Antes de comenzar, instale el “Agregar a Clipperz” bookmarklet: esta hará la creación de tarjetas más fácil y más divertida.</p> <p>Vaya al marcador “herramientas” para descubrir como instalar y usarlo.</p> <p> </p> <p>Luego simplemente haga click en el botón “Agregar nueva tarjeta” y disfrute su cuenta Clipperz.</p> <p> </p> <a href=\"http://www.clipperz.com/support/user_guide/managing_cards\" target=\"_blank\">Apreender más acerca de la creación y administración de las tarjetas</a> ",
+'newRecordWizardTitleBox':	"<h5>Por favor seleccione una plantilla</h5> <p>Tarjetas son formularios simples y flexibles donde usted puede almacenar claves y cualquier otro dato confidencial.</p> <p>Comienze eligiendo una de las plantillas que se encuentran debajo. Usted siempre puede personalizar sus tarjetas más tarde agregando o borrando campos.</p> ",
+'newRecordWizardBookmarkletConfigurationTitle':	"Acceso directo",
+'newRecordWizardBookmarkletConfigurationDescription':	"<p>Pegue debajo el código de configuración generado por el bookmarklet Clipperz.</p> <p>Una nueva tarjeta con un acceso directo a su cuenta web será creada.</p> ",
+'newRecordWizardCreateButtonLabel':	"Crear",
+'newRecordWizardCancelButtonLabel':	"Cancelar",
+'donateSplashPanelTitle':	"¡Apoye a Clipperz, haga una donación hoy!",
+'donateSplashPanelDescription':	"<p>Una pocas buenas razones para hacer una donación:</p> <ul> <li> <p>apoyar el desarrollo de nuevas utilidades</p> </li> <li> <p>mantener Clipperz gratuito</p> </li> <li> <p>mostrar su aprecio por nuestro duro trabajo</p> </li> </ul> <p>Por cualquier información adicional, por favor visite nuestra <a href=\"http://www.clipperz.com/donations\" target=\"_blank\">página de donaciones</a>.</p> <p> <b>¿Listo para hacer una donación?</b> </p> ",
+'donateCloseButtonLabel':	"No todavía",
+'donateDonateButtonLabel':	"Si",
+'recordTemplates':	{
+	'WebAccount':	{
+		'title':	"Contraseña web",
+		'description':	"<p>Una simple tarjeta para almacenar sus credenciales de acceso a sus servicios online.</p> ",
+		'fields':	{
+			'URL':	"Dirección web",
+			'TXT':	"Usuario o correo  electrónico",
+			'PWD':	"Contraseña"
+		}
+	},
+	'BankAccount':	{
+		'title':	"Cuenta bancaria",
+		'description':	"<p>Almacene en forma segura su número de cuenta bancaria y credenciales de servicios bancarios en línea.</p> ",
+		'fields':	{
+			'TXT':	"Banco",
+			'TXT':	"Número de cuenta",
+			'URL':	"Sitio web del Banco",
+			'TXT':	"ID del servicio bancario en línea",
+			'PWD':	"Contraseña del servicio bancario en línea"
+		}
+	},
+	'CreditCard':	{
+		'title':	"Tarjeta de crédito",
+		'description':	"<p>Número de tarjeta, fecha de vencimiento, CVV2 y PIN siempre a mano con Clipperz.</p> ",
+		'fields':	{
+			'TXT':	"Tipo (Visa, AmEx, ...)",
+			'TXT':	"Número",
+			'TXT':	"Nombre del  propietario",
+			'TXT':	"Fecha de vencimiento",
+			'TXT':	"CVV2",
+			'PWD':	"PIN cajero automático",
+			'URL':	"Sitio web tarjeta",
+			'TXT':	"Usuario",
+			'PWD':	"Contraseña"
+		}
+	},
+	'AddressBookEntry':	{
+		'title':	"Libreta de direcciones",
+		'description':	"<p>Clipperz puede también funcionar como su nueva libreta privada de direcciones. Use esta plantilla para crear fácilmente nuevas entradas.</p> ",
+		'fields':	{
+			'TXT':	"Nombre",
+			'TXT':	"Correo electrónico",
+			'TXT':	"Teléfono",
+			'TXT':	"Móvil",
+			'ADDR':	"Dirección"
+		}
+	},
+	'Custom':	{
+		'title':	" Tarjeta personalizada",
+		'description':	"<p>No importa que tipo de dato confidencial usted necesita proteger, puede crear la tarjeta que necesite.</p> ",
+		'fields':	{
+			'TXT':	"Etiqueta 1",
+			'TXT':	"Etiqueta 2",
+			'TXT':	"Etiqueta 3"
+		}
+	}
+},
+'recordFieldTypologies':	{
+	'TXT':	{
+		'description':	"simple text field",
+		'shortDescription':	"texto"
+	},
+	'PWD':	{
+		'description':	"simple text field, with default status set to hidden",
+		'shortDescription':	"contraseña"
+	},
+	'URL':	{
+		'description':	"simple text field in edit mode, that became an active url in view mode",
+		'shortDescription':	"dirección web"
+	},
+	'DATE':	{
+		'description':	"a value set with a calendar helper",
+		'shortDescription':	"fecha"
+	},
+	'ADDR':	{
+		'description':	"just like the URL, but the active link points to Google Maps (or similar service) passing the address value as argument",
+		'shortDescription':	"dirección postal"
+	},
+	'CHECK':	{
+		'description':	"check description",
+		'shortDescription':	"check"
+	},
+	'RADIO':	{
+		'description':	"radio description",
+		'shortDescription':	"radio"
+	},
+	'SELECT':	{
+		'description':	"select description",
+		'shortDescription':	"select"
+	}
+},
+'newRecordPanelGeneralExceptionTitle':	"Error",
+'newRecordPanelGeneralExceptionMessage':	"El texto de configuración no es válido. Asegúrese que toma su texto desde la ventana emergente del bookmarklet.",
+'newRecordPanelWrongBookmarkletVersionExceptionTitle':	"Error",
+'newRecordPanelWrongBookmarkletVersionExceptionMessage':	"El texto de configuración ha sido generado por una versión anterior de bookmarklet. Por favor actualize su bookmarklet y pruebe nuevamente.",
+'newRecordPanelExceptionPanelCloseButtonLabel':	"Cancelar",
+'mainPanelDeletingRecordPanelConfirmationTitle':	"Eliminando tarjeta seleccionada",
+'mainPanelDeleteRecordPanelConfirmationText':	"¿Desea realmente eliminar la tarjeta seleccionada?",
+'mainPanelDeleteRecordPanelConfirmButtonLabel':	"Sí",
+'mainPanelDeleteRecordPanelDenyButtonLabel':	"No",
+'mainPanelDeletingRecordPanelInitialTitle':	"Eliminando tarjeta seleccionada",
+'mainPanelDeletingRecordPanelCompletedText':	"Hecho",
+'deleteRecordPanelCollectRecordDataMessageTitle':	"Eliminar tarjeta",
+'deleteRecordPanelCollectRecordDataMessageText':	"Actualizando lista de tarjetas",
+'deleteRecordPanelEncryptUserDataMessageTitle':	"Eliminar tarjeta",
+'deleteRecordPanelEncryptUserDataMessageText':	"Encriptación local de encabezamiento de tarjetas",
+'deleteRecordPanelSendingDataToTheServerMessageTitle':	"Eliminar tarjeta",
+'deleteRecordPanelSendingDataToTheServerMessageText':	"Subiendo encabezamiento de tarjetas encriptadas a Clipperz",
+'deleteRecordPanelUpdatingTheInterfaceMessageTitle':	"Eliminar tarjeta",
+'deleteRecordPanelUpdatingTheInterfaceMessageText':	"Actualizando interface",
+'recordDetailNoRecordSelectedTitle':	"No hay tarjetas seleccionadas",
+'recordDetailNoRecordSelectedDescription':	"<p>Por favor seleccione una tarjeta de la lista de la izquierda.</p> ",
+'recordDetailLoadingRecordMessage':	"Descargando tarjetas encriptadas desde Clipperz",
+'recordDetailDecryptingRecordMessage':	"Desencriptación local de los datos de las tarjetas",
+'recordDetailLoadingRecordVersionMessage':	"Descargando última versión de la tarjeta",
+'recordDetailDecryptingRecordVersionMessage':	"Desencriptación local de la última versión",
+'recordDetailLoadingErrorMessageTitle':	"Error mientras descargaba la tarjeta",
+'recordDetailNotesLabel':	"Notas",
+'recordDetailLabelFieldColumnLabel':	"Campo título",
+'recordDetailDataFieldColumnLabel':	"Campo de datos",
+'recordDetailTypeFieldColumnLabel':	"Tipo",
+'recordDetailSavingChangesMessagePanelInitialTitle':	"Guardando tarjeta",
+'recordDetailAddFieldButtonLabel':	"Agregar nuevo campo",
+'recordDetailPasswordFieldHelpLabel':	"para copiar la contraseña al portapapeles, haga click en la estrella y luego Ctrl-C",
+'recordDetailPasswordFieldScrambleLabel':	"ocultar",
+'recordDetailPasswordFieldUnscrambleLabel':	"mostrar",
+'recordDetailDirectLoginBlockTitle':	"Acceso directos",
+'recordDetailNewDirectLoginDescription':	"<p>Configuración de los accesos directos</p> ",
+'recordDetailDirectLoginBlockNoDirectLoginConfiguredDescription':	"<p>¿Esta tarjeta contiene credenciales para acceder a un servicio en línea?</p> <p>¡Use los bookmarklet para configurar un \"acceso directo\" desde Clpperz con solo un click!</p> ",
+'recordDetailAddNewDirectLoginButtonLabel':	"Agregar nuevo acceso directo",
+'recordDetailEditButtonLabel':	"Editar",
+'recordDetailSaveButtonLabel':	"Guardar",
+'recordDetailCancelButtonLabel':	"Cancelar",
+'newRecordTitleLabel':	"_nueva tarjeta_",
+'recordSaveChangesPanelCollectRecordInfoMessageTitle':	"Guardar tarjeta",
+'recordSaveChangesPanelCollectRecordInfoMessageText':	"Actualizando encabezamiento de tarjetas",
+'recordSaveChangesPanelEncryptUserDataMessageTitle':	"Guardar tarjeta",
+'recordSaveChangesPanelEncryptUserDataMessageText':	"Encriptación local de encabezamiento de tarjetas",
+'recordSaveChangesPanelEncryptRecordDataMessageTitle':	"Guardar tarjeta",
+'recordSaveChangesPanelEncryptRecordDataMessageText':	"Encriptación local de los datos de la tarjeta",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageTitle':	"Guardar tarjeta",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageText':	"Encriptación local de la versión de los datos de la tarjeta",
+'recordSaveChangesPanelSendingDataToTheServerMessageTitle':	"Guardar tarjeta",
+'recordSaveChangesPanelSendingDataToTheServerMessageText':	"Subiendo encabezamiento de tarjeta encriptada a Clipperz",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageTitle':	"Guardar tarjeta",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageText':	"Actualizando la interface",
+'passwordGeneratorPanelTitle':	"Generador de contraseñas",
+'passwordGeneratorPanelOkLabel':	"Ok",
+'passwordGeneratorPanelCancelLabel':	"Cancelar",
+'passwordGeneratorLengthLabel':	"longitud:",
+//'DWRUtilLoadingMessage':	"Cargando datos ...",
+'comingSoon':	"próximamente ...",
+'panelCollectingEntryopyMessageText':	"Recogiendo entropía",
+'directLoginConfigurationCheckBoxFieldSelectedValue':	"Sí",
+'directLoginConfigurationCheckBoxFieldNotSelectedValue':	"No",
+'WELCOME_BACK':	"¡Bienvenido!",
+'currentConnectionText':	"Usted está ahora conectado desde ip&nbsp;__ip__, aparentemente desde __country__, usando __browser__ en __operatingSystem__.",
+'latestConnectionText':	"Su última conexión fue __elapsedTimeDescription__ (__time__) desde ip&nbsp;__ip__, aparentemente desde __country__, usando __browser__ en __operatingSystem__.",
+'fullLoginHistoryLinkLabel':	"mostrar historial de acceso",
+'elapsedTimeDescriptions':	{
+	'MORE_THAN_A_MONTH_AGO':	"más de un mes atrás",
+	'MORE_THAN_A_WEEK_AGO':	"más de una semana atrás",
+	'MORE_THAN_*_WEEKS_AGO':	"más de __elapsed__ semanas atrás",
+	'YESTERDAY':	"ayer",
+	'*_DAYS_AGO':	"__elapsed__ días atrás",
+	'ABOUT_AN_HOUR_AGO':	"about an hour ago",
+	'*_HOURS_AGO':	"__elapsed__ hours ago",
+	'JUST_A_FEW_MINUTES_AGO':	"hace unos minutos",
+	'ABOUT_*_MINUTES_AGO':	"hace __elapsed__ minutos atrás"
+},
+'unknown_ip':	"desconocida",
+'calendarStrings':	{
+	'months':	{
+		'0':	"Enero",
+		'1':	"Febrero",
+		'2':	"Marzo",
+		'3':	"Abril",
+		'4':	"Mayo",
+		'5':	"Junio",
+		'6':	"Julio",
+		'7':	"Agosto",
+		'8':	"Setiembre",
+		'9':	"Octubre",
+		'10':	"Noviembre",
+		'11':	"Diciembre"
+	},
+	'shortMonths':	{
+		'0':	"Ene",
+		'1':	"Feb",
+		'2':	"Mar",
+		'3':	"Abr",
+		'4':	"May",
+		'5':	"Jun",
+		'6':	"Jul",
+		'7':	"Ago",
+		'8':	"Set",
+		'9':	"Oct",
+		'10':	"Nov",
+		'11':	"Dic"
+	},
+	'days':	{
+		'0':	"Domingo",
+		'1':	"Lunes",
+		'2':	"Martes",
+		'3':	"Miércoles",
+		'4':	"Jueves",
+		'5':	"Viernes",
+		'6':	"Sábado"
+	},
+	'shortDays':	{
+		'0':	"Dom",
+		'1':	"Lun",
+		'2':	"Mar",
+		'3':	"Mie",
+		'4':	"Jue",
+		'5':	"Vie",
+		'6':	"Sab"
+	},
+	'veryShortDays':	{
+		'0':	"Do",
+		'1':	"Lu",
+		'2':	"Ma",
+		'3':	"Mi",
+		'4':	"Ju",
+		'5':	"Vi",
+		'6':	"Sa"
+	},
+	'amDesignation':	"am",
+	'pmDesignation':	"pm"
+},
+
+__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_fr-FR.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_fr-FR.js
new file mode 100644
index 0000000..c137fb8
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_fr-FR.js
@@ -0,0 +1,362 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+Clipperz.PM.Strings.Languages['fr-FR'.toLowerCase()] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+'clipperzServiceDescription':	"<h2>Gardez le pour vous!</h2> <ul> <li> <h3>Clipperz est:</h3> <ul> <li> <p>un gestionnaire de mots de passe sécurisé</p> </li> <li> <p>une solution fiable d’authentification unique</p> </li> <li> <p>une chambre forte numérique pour vos données confidentielles</p> </li> </ul> </li> <li> <h3>Avec Clipperz vous pouvez:</h3> <ul> <li> <p>enregistrer et gérer vos mots de passe et autres informations d'identification en ligne</p> </li> <li> <p>vous identifier sur vos sites web sans avoir besoin de saisir votre nom d’utilisateur ou votre mot de passe</p> </li> <li> <p>protéger toutes vos données sensibles: codes d’alarmes, PINs (téléphone portable), carte de crédits, &hellip;</p> </li> <li> <p>partager certaines données confidentielles avec vos proches et vos associés (bientôt disponible!)</p> </li> </ul> </li> <li> <h3>Les avantages de Clipperz:</h3> <ul> <li> <p>c'est gratuit et totalement anonyme</p> </li> <li> <p>accéder à vos données depuis n’importe quel ordinateur</p> </li> <li> <p>vous n'avez besoin d'aucun logiciel et rien n'est à installer sur votre poste</p> </li> <li> <p>cela vous évite de garder des mots de passe sur votre PC ou sur des bouts de papier</p> </li> </ul> </li> <li> <h3>La sécurité de Clipperz:</h3> <ul> <li> <p>vos mots de passe sont localement chiffrés par votre navigateur avant d’être téléchargé à Clipperz</p> </li> <li> <p>la clé de cryptage est une phrase secrète détenue uniquement par vous même</p> </li> <li> <p>héberge vos données sensibles dans des formulaires cryptés et ne peuvent être consultées directement en clair</p> </li> <li> <p>est développé sur des standard de cryptage réputé sans aucune fantaisie ni de bricolage fait maison</p> </li> <li> <p>vous pouvez consulter le code source autant que vous le souhaitez</p> </li> </ul> </li> <li> <a href=\"http://www.clipperz.com\" target=\"_blank\">Plus d’informations</a> </li> </ul> ",
+'loginFormTitle':	"identifiez-vous avec votre compte Clipperz",
+'loginFormUsernameLabel':	"nom d’utilisateur",
+'loginFormPassphraseLabel':	"phrase secrète",
+'loginFormDontHaveAnAccountLabel':	"vous n’avez pas de compte?",
+'loginFormCreateOneLabel':	"créez votre compte",
+'loginFormForgotYourCredentialsLabel':	"vous avez oublié votre certificat?",
+'loginFormAarghThatsBadLabel':	"c’est fort dommage pour vous!",
+'loginFormAfraidOfMaliciousScriptsLabel':	"vous avez peur des script malicieux?",
+'loginFormVerifyTheCodeLabel':	"vérifiez le code",
+'loginFormButtonLabel':	"S’identifer",
+'loginPanelSwithLanguageDescription':	"<p>Sélectionnez votre langue préféré</p> ",
+'browserCompatibilityDescription':	"<p>Have a better and safer Clipperz experience with Firefox. However Clipperz works just fine also with Opera and MS Internet Explorer!</p> ",
+'loginMessagePanelInitialTitle':	"En cours d’identification ...",
+'loginMessagePanelInitialButtonLabel':	"Annuler",
+'loginMessagePanelConnectedTitle':	"Connecté",
+'loginMessagePanelConnectedText':	"Terminé",
+'loginMessagePanelFailureTitle':	"Erreur",
+'loginMessagePanelFailureText':	"Identification échoué",
+'loginMessagePanelFailureButtonLabel':	"Fermer",
+'connectionLoginSendingCredentialsMessageTitle':	"Vérification des identifiants",
+'connectionLoginSendingCredentialsMessageText':	"Envoi des identifiants",
+'connectionLoginCredentialsVerificationMessageTitle':	"Vérification des identifiants",
+'connectionLoginCredentialsVerificationMessageText':	"Authentification SRP en cours",
+'connectionLoginDoneMessageTitle':	"Vérification des identifiants",
+'connectionLoginDoneMessageText':	"Connecté",
+'userLoginPanelUpgradingUserCredentialsMessageTitle':	"Vérification des identifiants",
+'userLoginPanelUpgradingUserCredentialsMessageText':	"Mise à jour de vos identifiants à un nouveau schéma d’authentification",
+'userLoginPanelConnectedMessageTitle':	"Utilisateur identifié",
+'userLoginPanelConnectedMessageText':	"Vous vous êtes identifié avec succès",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageTitle':	"Vérification des identifiants",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageText':	"Nous essayons un ancien schéma d’authentification",
+'userLoginPanelLoadingUserDataMessageTitle':	"Utilisateur identifié",
+'userLoginPanelLoadingUserDataMessageText':	"Téléchargement des cartes d’en-têtes chiffrés depuis Clipperz",
+'userLoginPanelDecryptingUserDataMessageTitle':	"Utilisateur identifié",
+'userLoginPanelDecryptingUserDataMessageText':	"Décryptage local des en-têtes chiffrés",
+'userLoginPanelDecryptingUserStatisticsMessageTitle':	"Utilisateur identifié",
+'userLoginPanelDecryptingUserStatisticsMessageText':	"Décryptage local des statistiques",
+'splashAlertTitle':	"Bienvenue sur Clipperz!",
+'splashAlertText':	"<p>Conseils de sécurité</p> <ul> <li> <p>Le stockage de vos mots de passe sur Clipperz est aussi sécurisé que la phrase que vous avez sélectionnée pour les protéger. Personne ne peux y accéder tant que personne ne connait votre phrase secrète.</p> </li> <li> <p>Si vous allez utiliser Clipperz pour sauvegarder des informations sensibles et critiques assurez-vous d’utiliser une phrase secrète compliquée. Plus elle sera longue mieux ce sera!</p> </li> <li> <p>Clipperz ne sera pas capable de récupérer votre phrase secrète!</p> </li> </ul> <p>Pour toute autre information, veuillez vous référer au site <a href=\"http://www.clipperz.com\" target=\"_blank\">Clipperz</a>.</p> ",
+'splashAlertCloseButtonLabel':	"Ok",
+'registrationFormTitle':	"créer votre compte",
+'registrationFormUsernameLabel':	"nom d’utilisateur",
+'registrationFormPassphraseLabel':	"phrase secrète",
+'registrationFormRetypePassphraseLabel':	"re-saisissez votre phrase secrète",
+'registrationFormSafetyCheckLabel':	"J’accepte que Clipperz ne pourra pas récupérer ma phrase secrète.",
+'registrationFormTermsOfServiceCheckLabel':	"J’ai lu et j’accepte les <a href='http://www.clipperz.com/terms_of_service' target='_blank'>Conditions d’Utilisation du Service</a>.",
+'registrationFormDoYouAlreadyHaveAnAccountLabel':	"avez-vous déjà un compte?",
+'registrationFormSimplyLoginLabel':	"identifiez-vous",
+'registrationFormButtonLabel':	"S’inscrire",
+'registrationFormWarningMessageNotMatchingPassphrases':	"Vos phrases secrètes ne correspondent pas, veuillez les saisir à nouveau.",
+'registrationFormWarningMessageSafetyCheckNotSelected':	"Veuillez lire et cocher les cases-à-cocher ci-dessous.",
+'registrationFormWarningMessageTermsOfServiceCheckNotSelected':	"Vous devez accepter les “Conditions d’Utilisation du Service”.",
+'registrationMessagePanelInitialTitle':	"Création du compte en cours ...",
+'registrationMessagePanelInitialButtonLabel':	"Annuler",
+'registrationMessagePanelRegistrationDoneTitle':	"Enregistrement",
+'registrationMessagePanelRegistrationDoneText':	"Terminé",
+'registrationMessagePanelFailureTitle':	"Enregistrement échoué",
+'registrationMessagePanelFailureButtonLabel':	"Fermer",
+'connectionRegistrationSendingRequestMessageText':	"Vérification en cours des identifiants",
+'connectionRegistrationSendingCredentialsMessageText':	"Envoi des identifiants",
+'registrationSplashPanelTitle':	"Conseils de sécurité",
+'registrationSplashPanelDescription':	"<p>Ce sont vos identifiants Clipperz, gardez les biens. Clipperz ne va plus jamais vous montrer votre nom d’utilisateur et votre phrase secrète!</p> ",
+'registrationSplashPanelUsernameLabel':	"nom d’utilisateur",
+'registrationSplashPanelPassphraseLabel':	"phrase secrète",
+'registrationSplashPanelShowPassphraseButtonLabel':	"afficher la phrase secrète",
+'donateHeaderLinkLabel':	"faites un don",
+'creditsHeaderLinkLabel':	"crédits",
+'feedbackHeaderLinkLabel':	"votre avis",
+'helpHeaderLinkLabel':	"aide",
+'forumHeaderLinkLabel':	"forum",
+'recordMenuLabel':	"cartes",
+'accountMenuLabel':	"compte",
+'dataMenuLabel':	"données",
+'contactsMenuLabel':	"contacts",
+'toolsMenuLabel':	"outils",
+'logoutMenuLabel':	"déconnexion",
+'lockMenuLabel':	"verrouiller",
+'lockTitle':	"Le compte est verrouillé",
+'lockDescription':	"<p>Pour déverrouiller votre compte, veuillez saisir votre phrase secrète</p> ",
+'unlockButtonLabel':	"Déverrouiller",
+'changePasswordTabLabel':	"Changer votre phrase secrète",
+'changePasswordTabTitle':	"Changer votre phrase secrète",
+'changePasswordFormUsernameLabel':	"nom d’utilisateur",
+'changePasswordFormOldPassphraseLabel':	"ancienne phrase secrète",
+'changePasswordFormNewPassphraseLabel':	"nouvelle phrase secrète",
+'changePasswordFormRetypePassphraseLabel':	"re-saisissez phrase secrète",
+'changePasswordFormSafetyCheckboxLabel':	"Je sais que Clipperz ne pourra pas récupérer ma phrase secrète.",
+'changePasswordFormSubmitLabel':	"Changer ma phrase secrète",
+'changePasswordFormWrongUsernameWarning':	"Nom d’utilisateur incorrect",
+'changePasswordFormWrongPassphraseWarning':	"Phrase secrète incorrect",
+'changePasswordFormWrongRetypePassphraseWarning':	"Votre phrase secrète ne correspond pas, veuillez la saisir à nouveau",
+'changePasswordFormSafetyCheckWarning':	"Veuillez lire et cocher la case-à-cocher ci-dessous",
+'changePasswordFormProgressDialogTitle':	"Changement des identifiants utilisateurs",
+'changePasswordFormProgressDialogConnectedMessageTitle':	"Connecté",
+'changePasswordFormProgressDialogConnectedMessageText':	"Terminé",
+'changePasswordFormProgressDialogErrorMessageTitle':	"Erreur",
+'changePasswordFormProgressDialogErrorMessageText':	"Changement de identifiants échoué!",
+'changeCredentialsPanelEncryptingDataMessageTitle':	"Changement de votre phrase secrète",
+'changeCredentialsPanelEncryptingDataMessageText':	"Cryptage local des identifiants",
+'changeCredentialsPanelCreatingNewCredentialsMessageTitle':	"Modifier votre phrase secrète",
+'changeCredentialsPanelCreatingNewCredentialsMessageText':	"Mettre à jour vos identifiants",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle':	"Modifier votre phrase secrète",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageText':	"Téléchargement de vos identifiants sur Clipperz.com",
+'changeCredentialsPanelDoneMessageTitle':	"Modifier votre phrase secrète",
+'changeCredentialsPanelDoneMessageText':	"Terminé",
+'manageOTPTabLabel':	"Mettre à jour votre phrase secrète à usage unique",
+'manageOTPTabTitle':	"Mettre à jour votre phrase secrète à usage unique",
+'manageOTPTabDescription':	"<p>Une phrase secrète à usage unique fonctionne comme votre phrase secrète habituelle, mais elle ne peut être utilisé qu'une seule fois.</p> <p>Si la phrase secrète est utilisé de nouveau et que vous tenté de vous identifier à nouveau, vous serez rejeté et le processus d'identification échouera.</p> <p>Juste après une identification correcte, votre phrase secrète à usage unique sera effacée pour interdire tout accès frauduleux.</p> <p>Les phrases secrètes à usage unique sont un excellent choix si vous craignez qu'un logiciel espion ne vole vos données après avoir infecté votre machine.</p> <p> <b>Il est fortement recommandé d'utiliser des phrases secrètes à usage unique lorsque vous accédez à Clipperz depuis un terminal public, comme un cybercafé ou une borne Internet.</b> </p> ",
+'accountPreferencesLabel':	"Préférences",
+'accountPreferencesTabTitle':	"Préférences",
+'accountPreferencesLanguageTitle':	"Choix de la langue",
+'accountPreferencesLanguageDescription':	"<p>Choisissez la langue d'affichage de Clipperz dans la liste suivante.</p> ",
+'accountPreferencesInterfaceTitle':	"Personnalisation de l'interface",
+'accountPreferencesInterfaceDescription':	"<p>Ajustez l'interface de Clipperz à vos besoins.</p> ",
+'saveUserPreferencesFormSubmitLabel':	"Enregistrer",
+'cancelUserPreferencesFormSubmitLabel':	"Annuler",
+'accountPreferencesSavingPanelTitle_Step1':	"Enregistrement des préférences",
+'accountPreferencesSavingPanelText_Step1':	"Chiffrement local de vos préférences",
+'accountPreferencesSavingPanelTitle_Step2':	"Enregistrement des préférences",
+'accountPreferencesSavingPanelText_Step2':	"Transmission des préférences chiffrées au serveur",
+'deleteAccountTabLabel':	"Supprimer votre compte",
+'deleteAccountTabTitle':	"Supprimer votre compte",
+'deleteAccountFormUsernameLabel':	"nom d’utilisateur",
+'deleteAccountFormPassphraseLabel':	"phrase secrète",
+'deleteAccountFormSafetyCheckboxLabel':	"Je sais que toute mes données seront supprimés et que cette action sera irréversible.",
+'deleteAccountFormSubmitLabel':	"Supprimer mon compte",
+'deleteAccountFormWrongUsernameWarning':	"Nom d’utilisateur incorrect",
+'deleteAccountFormWrongPassphraseWarning':	"Phrase secrète incorrect",
+'deleteAccountFormSafetyCheckWarning':	"Veuillez lire et cocher la case-à-cocher ci-dessous.",
+'accountPanelDeletingAccountPanelConfirmationTitle':	"ATTENTION",
+'accountPanelDeleteAccountPanelConfirmationText':	"Êtes-vous sûr de vouloir supprimer ce compte?",
+'accountPanelDeleteAccountPanelConfirmButtonLabel':	"Oui",
+'accountPanelDeleteAccountPanelDenyButtonLabel':	"Non",
+'offlineCopyTabLabel':	"Copie locale",
+'offlineCopyTabTitle':	"Copie locale",
+'offlineCopyTabDescription':	"<p>D'un seul click, vous pouvez télécharger toutes vos données chiffrées des serveurs Clipperz sur votre disque dur, créant ainsi une version déconnecté de Clipperz utilisable lorsque vous n'êtes pas connectés à Internet.</p> <p>Cette version en lecture seule est aussi sécurisée que la version en lecture-écriture, et n'expose pas vos données à un risque plus élevé. Elles partagent en effet le même code et la même architecture de sécurité.</p> <ol> <li> <p>Cliquez sur le liens ci-dessous pour lancer le téléchargement.</p> </li> <li> <p>Votre navigateur vous demandera que faire du fichier “Clipperz_YYYYMMDD.html”. Sauvez le sur votre disque dur.</p> </li> <li> <p>Puis double-cliquez sur le fichier téléchargé pour lancer la version déconnectée dans votre navigateur.</p> </li> <li> <p>Utilisez vos nom d’utilisateur et phrase secrète habituels.</p> </li> </ol> ",
+'offlineCopyDownloadLinkLabel':	"Télécharger",
+'sharingTabLabel':	"Partager",
+'sharingTabTitle':	"Partager",
+'sharingTabDescription':	"<p>De temps en temps il est nécessaire de partager des parties de vos informations confidentiels avec une ou plusieurs personnes.</p> <p>Cela pourrait être aussi simple que l’octroi à un collègue de votre code d’accès à votre messagerie vocale quand vous êtes hors du bureau, ou aussi compliqués que la permission d’ayant droit aux héritiers pour avoir accès à votre boîte de coffre-fort à la banque locale.</p> <p>Clipperz vous permez donc de partager vos mots de passe grâce à un processe sûr et direct.</p> <p> </p> <p> <b>Prochainement disponible ...</b> </p> ",
+'importTabLabel':	"Importer",
+'importTabTitle':	"Importer",
+'importTabDescription':	"<p> <b>Prochainement disponible ...</b> </p> ",
+'printingTabLabel':	"Exporter",
+'printingTabTitle':	"Exporter",
+'printingTabDescription':	"<p> <b>Version d’impression</b> </p> <p>En cliquant sur ce bouton vous ouvrirez une fenêtre contenant vos en-têtes cryptés dans un format d’impression.</p> <p>Si vous imprimez pour des raisons de sauvegarde personnel, veuillez vous tourner vers une solution plus sécurisé comme la version “Copie locale”.</p> ",
+'printingLinkLabel':	"Version imprimable",
+'contactsTabLabel':	"Contacts",
+'contactsTabTitle':	"Contacts",
+'passwordGeneratorTabLabel':	"Générateur de mot de passe",
+'bookmarkletTabLabel':	"Bookmarklet",
+'passwordGeneratorTabTitle':	"Générateur de mot de passe",
+'bookmarkletTabTitle':	"Bookmarklet",
+'paswordGeneratorTabDescription':	"<p> </p> ",
+'passwordGeneratorTabButtonLabel':	" Générer un mot de passe",
+'bookmarkletTabDescription':	"<p>Un bookmarklet est un outil “clique unique” simple qui peut exécuter des tâches très utiles. Il peut être sauvegardé et utilisé comme un signet de page Web normal.</p> <p>Le bookmarklet Clipperz vous aidera à rapidement créer de nouvelles cartes et des nouveaux “accès directs” avec vos cartes existantes.</p> <p> <b>Notez s’il vous plaît que le bookmarklet n’inclut pas d’informations liées à votre compte (par exemple votre nom d’utilisateur ou votre phrase secrète), le bookmarklet est un outil général contenant le même code pour chaque utilisateur Clipperz.</b> </p> <div> <p>Pour installer le bookmarklet <b>glissez & déposez</b> le lien ci-dessous dans votre bar de navigation.</p> </div> ",
+'bookmarkletTabBookmarkletTitle':	"Ajouter à Clipperz",
+'bookmarkletTabInstructions':	"<h3>Comment créer une carte comprenant un lien de “accès direct” à un service en ligne</h3> <ol> <li> <p>Ouvrir la page Web où le site affiche un formulaire d’identification. (C’est la page où vous entrez d’habitude vos informations d'identification)</p> </li> <li> <p>Lancer le bookmarklet en cliquant dessus : une fenêtre contextuelle apparait alors sur la page Web.</p> </li> <li> <p>Copier dans le presse-papiers le contenu du grand secteur de texte dans le menu contextuel. (Ctrl-C)</p> </li> <li> <p>Entrer dans votre compte Clipperz et cliquer sur <b>“Ajouter une nouvelle carte”</b>.</p> </li> <li> <p>Coller le presse-papiers dans la zone de texte et rajouter un titre (facultatif). (Ctrl-V)</p> </li> <li> <p>Cliquer sur le bouton <b>“Créer”</b>, repassez en revu les détails et cliquer <b>“Sauver”</b>. De plus amples informations sont disponibles <a href=\"http://www.clipperz.com/support/user_guide/bookmarklet\" target=\"_blank\">ici</a>.</p> </li> </ol> <h3>Comment ajouter un lien de “accès direct” à une carte existante</h3> <ol> <li> <p>Idem que précédemment.</p> </li> <li> <p>Idem que précédemment..</p> </li> <li> <p>Idem que précédemment.</p> </li> <li> <p>Entrer dans votre compte Clipperz et sélectionner la carte crypté qui contient les identifiants pour le service web que vous venez tout juste de visiter et cliquer sur <b>“Modifier”</b>.</p> </li> <li> <p>Coller le presse-papier dans la zone de texte <b>“Accès directs”</b>. (ctrl-V)</p> </li> <li> <p>Cliquer sur <b>“Ajouter un accès direct”</b>, repassez en revu les détails et cliquer <b>“Sauver”</b>.</p> </li> </ol> ",
+'mainPanelDirectLoginBlockLabel':	"Accès directs",
+'directLinkReferenceShowButtonLabel':	"voir",
+'mainPanelDirectLoginBlockDescription':	"<p>Ajouter une “accès direct” pour vous identifier sans avoir besoin de taper vos identifiants de connexions!</p> <p>Les “accès directs” augmente considérablement la sécurité de vos mots passes dans la mesure où vous pouvez:</p> <ul> <li> <p>adopter et saisir des mots de passe complexes;</p> </li> <li> <p>ne réutilisez le même mot de passe et ne mettez plus de mots de passe facile à deviner.</p> </li> </ul> <p>Simple et rapide à configurer avec le Clipperz <b>bookmarklet</b>.</p> <a href=\"http://www.clipperz.com/support/user_guide/direct_logins\" target=\"_blank\">Pour en savoir plus sur les “accès directs”</a> ",
+'mainPanelRecordsBlockLabel':	"Cartes",
+'mainPanelAddRecordButtonLabel':	"Ajouter une nouvelle carte",
+'mainPanelRemoveRecordButtonLabel':	"Supprimer une carte",
+'mainPanelRecordFilterBlockAllLabel':	"tous",
+'mainPanelRecordFilterBlockTagsLabel':	"tags",
+'mainPanelRecordFilterBlockSearchLabel':	"chercher",
+'recordDetailNoRecordAtAllTitle':	"Bienvenue sur Clipperz!",
+'recordDetailNoRecordAtAllDescription':	"<h5>Commencez par ajouter des cartes à votre compte.</h5> <p>Les cartes sont des formulaires flexibles ou vous pouvez enregistrer vos mots de passe et autres informations confidentielles.</p> <p>Par exemple, une carte peut contenir les informations d\"identification pour un site web, la combinaison de votre antivol de bicyclette, les détails de votre carte bancaire, ...</p> <h5>N'oubliez pas le bookmarklet!</h5> <p>Avant de commencer, installez le bookmarklet “Ajouter à Clipperz”: il rends la création de carte plus facile et amusante.</p> <p>Allez à l'onglet “outils” pour découvrir comment l'installer et l'utiliser.</p> <p> </p> <p>Ensuite, cliquez tout simplement sur le bouton “Ajouter une nouvelle carte” et profitez de votre compte Clipperz.</p> <p> </p> <a href=\"http://www.clipperz.com/support/user_guide/managing_cards\" target=\"_blank\">En savoir plus sur la création et la gestion des cartes.</a> ",
+'newRecordWizardTitleBox':	"<h5>Choisissez un modèle</h5> <p>Les cartes sont des formulaires flexibles ou vous pouvez enregistrer vos mots de passe et autres informations confidentielles.</p> <p>Commencez par choisir un des modèles ci-dessous. Vous pourrez toujours adapter vos cartes plus tard en ajoutant ou supprimant des champs.</p> ",
+'newRecordWizardBookmarkletConfigurationTitle':	"Accès directs",
+'newRecordWizardBookmarkletConfigurationDescriptionConfig':	"<p>Collez ici le code de configuration généré par le bookmarlet Clipperz.</p> <p>Cela créera une nouvelle carte avec un accès direct à votre site web.</p> ",
+'newRecordWizardCreateButtonLabel':	"Créer",
+'newRecordWizardCancelButtonLabel':	"Annuler",
+'recordTemplates':	{
+	'WebAccount':	{
+		'title':	"Mot de passe web",
+		'description':	"<p>Une carte toute simple pour enregistrer les informations d'identification de vos services en ligne.</p> ",
+		'fields':	{
+			'URL':	"Adresse web",
+			'TXT':	"Nom d'utilisateur ou email",
+			'PWD':	"Mot de passe"
+		}
+	},
+	'BankAccount':	{
+		'title':	"Compte bancaire",
+		'description':	"<p>Enregistrer de façon sécurisée vos numéros de compte bancaire et vos identifiants de service bancaire en ligne.</p> ",
+		'fields':	{
+			'TXT':	"Banque",
+			'TXT':	"N° de compte",
+			'URL':	"Adresse web du site",
+			'TXT':	"Identifiant",
+			'PWD':	"Mot de passe"
+		}
+	},
+	'CreditCard':	{
+		'title':	"Carte bancaire",
+		'description':	"<p>Ayez toujours sous la main votre numéro de carte, la date d'expiration, le code de contrôle et le code secret avec Clipperz</p> ",
+		'fields':	{
+			'TXT':	"Type (Visa, AmEx, ...)",
+			'TXT':	"Numéro",
+			'TXT':	"Nom du porteur",
+			'TXT':	"Date de validité",
+			'TXT':	"Code de contrôle",
+			'PWD':	"Code secret",
+			'URL':	"Site web",
+			'TXT':	"Identifiant",
+			'PWD':	"Mot de passe"
+		}
+	},
+	'AddressBookEntry':	{
+		'title':	"Carnet d'adresse",
+		'description':	"<p>Clipperz peux aussi être utilisé comme un nouveau carnet d'adresse privé. Utilisez ce modèle pour ajouter des contacts facilement.</p> ",
+		'fields':	{
+			'TXT':	"Nom",
+			'TXT':	"Adresse eMail",
+			'TXT':	"Téléphone",
+			'TXT':	"Mobile",
+			'ADDR':	"Adresse"
+		}
+	},
+	'Custom':	{
+		'title':	"Carte personnalisée",
+		'description':	"<p>Quelles que soient les données confidentielles que vous souhaitez protéger, créez une carte personnalisée adaptée à vos besoins.</p> ",
+		'fields':	{
+			'TXT':	"Titre du champ 1",
+			'TXT':	"Titre du champ 2",
+			'TXT':	"Titre du champ 3"
+		}
+	}
+},
+'recordFieldTypologies':	{
+	'TXT':	{
+		'description':	"simple text field",
+		'shortDescription':	"texte"
+	},
+	'PWD':	{
+		'description':	"simple text field, with default status set to hidden",
+		'shortDescription':	"mot de passe"
+	},
+	'URL':	{
+		'description':	"simple text field in edit mode, that became an active url in view mode",
+		'shortDescription':	"adresse de site web"
+	},
+	'DATE':	{
+		'description':	"a value set with a calendar helper",
+		'shortDescription':	"date"
+	},
+	'ADDR':	{
+		'description':	"just like the URL, but the active link points to Google Maps (or similar service) passing the address value as argument",
+		'shortDescription':	"adresse"
+	},
+	'CHECK':	{
+		'description':	"check description",
+		'shortDescription':	"check"
+	},
+	'RADIO':	{
+		'description':	"radio description",
+		'shortDescription':	"radio"
+	},
+	'SELECT':	{
+		'description':	"select description",
+		'shortDescription':	"select"
+	}
+},
+'newRecordPanelGeneralExceptionTitle':	"Erreur",
+'newRecordPanelGeneralExceptionMessage':	"Le code de configuration n'est pas valide. Copiez le depuis la fenêtre du bookmarklet, et essayez à nouveau.",
+'newRecordPanelWrongBookmarkletVersionExceptionTitle':	"Erreur",
+'newRecordPanelWrongBookmarkletVersionExceptionMessage':	"Ce code de configuration provient d'un ancien bookmarklet. Mettez votre bookmarklet à jour, puis essayez de nouveau.",
+'newRecordPanelExceptionPanelCloseButtonLabel':	"Annuler",
+'mainPanelDeletingRecordPanelConfirmationTitle':	"Suppression de la carte sélectionnée",
+'mainPanelDeleteRecordPanelConfirmationText':	"Voulez vous vraiment supprimer la carte sélectionnée?",
+'mainPanelDeleteRecordPanelConfirmButtonLabel':	"Oui",
+'mainPanelDeleteRecordPanelDenyButtonLabel':	"Non",
+'mainPanelDeletingRecordPanelInitialTitle':	"Suppression de la carte",
+'mainPanelDeletingRecordPanelCompletedText':	"Terminé",
+'deleteRecordPanelCollectRecordDataMessageTitle':	"Supprimer la carte",
+'deleteRecordPanelCollectRecordDataMessageText':	"Mise à jour de la liste des cartes",
+'deleteRecordPanelEncryptUserDataMessageTitle':	"Supprimer la carte",
+'deleteRecordPanelEncryptUserDataMessageText':	"Chiffrement local des en-têtes de carte",
+'deleteRecordPanelSendingDataToTheServerMessageTitle':	"Supprimer la carteDelete card",
+'deleteRecordPanelSendingDataToTheServerMessageText':	"Transmission des en-têtes chiffrées à Clipperz",
+'deleteRecordPanelUpdatingTheInterfaceMessageTitle':	"Supprimer la carte",
+'deleteRecordPanelUpdatingTheInterfaceMessageText':	"Mise à jour de l'interface",
+'recordDetailNoRecordSelectedTitle':	"Aucune carte sélectionnée",
+'recordDetailNoRecordSelectedDescription':	"<p>Veuillez selectionner une carte dans la liste de gauche.</p> ",
+'recordDetailLoadingRecordMessage':	"Téléchargement de la carte chiffrée depuis Clipperz",
+'recordDetailDecryptingRecordMessage':	"Déchiffrement local des informations de la carte",
+'recordDetailLoadingRecordVersionMessage':	"Téléchargement de la dernière version de la carte",
+'recordDetailDecryptingRecordVersionMessage':	"Déchiffrement local de la dernière version",
+'recordDetailLoadingErrorMessageTitle':	"Erreur lors du téléchargement de la carte",
+'recordDetailNotesLabel':	"Notes",
+'recordDetailLabelFieldColumnLabel':	"Titre du champ",
+'recordDetailDataFieldColumnLabel':	"Données du champ",
+'recordDetailTypeFieldColumnLabel':	"Type",
+'recordDetailSavingChangesMessagePanelInitialTitle':	"Enregistrement de la carte",
+'recordDetailAddFieldButtonLabel':	"Ajouter un champ",
+'recordDetailPasswordFieldHelpLabel':	"pour copier le mot de passe, cliquez sur les étoiles, puis Ctrl-C",
+'recordDetailPasswordFieldScrambleLabel':	"dissimuler",
+'recordDetailPasswordFieldUnscrambleLabel':	"en clair",
+'recordDetailDirectLoginBlockTitle':	"Accès directs",
+'recordDetailNewDirectLoginDescription':	"<p>Configuration de l'accès direct</p> ",
+'recordDetailDirectLoginBlockNoDirectLoginConfiguredDescription':	"<p>Cette carte contient-elle des informations d'identification pour un service en ligne?</p> <p>Utilisez le bookmarklet pour configurer un “accès direct” depuis Clipperz en un seul click!</p> ",
+'recordDetailAddNewDirectLoginButtonLabel':	"Ajouter un accès direct",
+'recordDetailEditButtonLabel':	"Modifier",
+'recordDetailSaveButtonLabel':	"Sauver",
+'recordDetailCancelButtonLabel':	"Annuler",
+'newRecordTitleLabel':	"_nouvelle carte_",
+'recordSaveChangesPanelCollectRecordInfoMessageTitle':	"Enregistrement de la carte",
+'recordSaveChangesPanelCollectRecordInfoMessageText':	"Updating card headers",
+'recordSaveChangesPanelEncryptUserDataMessageTitle':	"Sauvegarde de la carte",
+'recordSaveChangesPanelEncryptUserDataMessageText':	"Cryptage local des en-têtes chiffrés",
+'recordSaveChangesPanelEncryptRecordDataMessageTitle':	"Sauvegarde de la carte",
+'recordSaveChangesPanelEncryptRecordDataMessageText':	"Cryptage local des en-têtes chiffrés",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageTitle':	"Sauvegarde de la carte",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageText':	"Cryptage local des données de version de la carte",
+'recordSaveChangesPanelSendingDataToTheServerMessageTitle':	"Sauvegarde de la carte",
+'recordSaveChangesPanelSendingDataToTheServerMessageText':	"Téléchargement des cartes d’en-têtes chiffrés depuis Clipperz",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageTitle':	"Sauvegarde de la carte",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageText':	"Mise à jour de l'interface",
+'passwordGeneratorPanelTitle':	"Générateur de mot de passe",
+'passwordGeneratorPanelOkLabel':	"Ok",
+'passwordGeneratorPanelCancelLabel':	"Annuler",
+'passwordGeneratorLengthLabel':	"longueur:",
+//'DWRUtilLoadingMessage':	"Chargement des données ...",
+'comingSoon':	"Bientôt en ligne ...",
+'panelCollectingEntryopyMessageText':	"Rassemblement d'entropie",
+'directLoginConfigurationCheckBoxFieldSelectedValue':	"Oui",
+'directLoginConfigurationCheckBoxFieldNotSelectedValue':	"Non",
+
+__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_he-IL.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_he-IL.js
new file mode 100644
index 0000000..3bdfe19
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_he-IL.js
@@ -0,0 +1,40 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+//=============================================================================
+//
+//		H E B R E W  (he_IL)
+//
+//=============================================================================
+
+Clipperz.PM.Strings.Languages['he-il'] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_it-IT.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_it-IT.js
new file mode 100644
index 0000000..51c0d03
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_it-IT.js
@@ -0,0 +1,694 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+Clipperz.PM.Strings.Languages['it-IT'.toLowerCase()] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+'clipperzServiceDescription':	"<h2>Tienilo per te!</h2> <ul> <li> <h3>Clipperz è:</h3> <ul> <li> <p>un archivio semplice e sicuro per le tue password</p> </li> <li> <p>un canale di accesso unificato a tutti i tuoi servizi online</p> </li> <li> <p>una cassaforte digitale per tutti i tuoi dati riservati</p> </li> </ul> </li> <li> <h3>Con Clipperz puoi:</h3> <ul> <li> <p>memorizzare e gestire le password e le credenziali di accesso dei tuoi servizi online</p> </li> <li> <p>accedere ai tuoi servizi online con un solo click senza bisogno di inserire username o password</p> </li> <li> <p>proteggere tutte le tue informazioni confidenziali: codice dell&#x27;allarme di casa, dati delle carte di credito, …</p> </li> <li> <p>condividere dati riservati con i tuoi familiari o colleghi (disponibile a breve)</p> </li> </ul> </li> <li> <h3>I vantaggi di Clipperz:</h3> <ul> <li> <p>gratuito e completamente anonimo</p> </li> <li> <p>accessibile da qualsiasi computer</p> </li> <li> <p>nessun software da scaricare e niente da installare</p> </li> <li> <p>mai più informazioni riservate sul tuo PC o sulla carta!</p> </li> </ul> </li> <li> <h3>La sicurezza di Clipperz:</h3> <ul> <li> <p>i dati sono criptati dal tuo browser prima di essere inviati a Clipperz</p> </li> <li> <p>la chiave per decriptare i dati è conosciuta soltanto da te</p> </li> <li> <p>Clipperz riceve e memorizza solo i tuoi dati criptati e non ha nessuna possibilità di accedere alla versione in chiaro</p> </li> <li> <p>Clipperz utilizza solo sistemi crittografici standard, senza nessuna velleità di inventare e proporre nuovi algoritmi non validati dalla comunità scientifica</p> </li> <li> <p>tutto il codice di Clipperz è disponibile e può essere analizzato in qualsiasi momento, ma non serve essere un esperto di crittografia per apprezzare la sicurezza e la comodità di Clipperz!</p> </li> </ul> </li> <li><a href=\"http://www.clipperz.com\" target=\"_blank\">Maggiori informazioni su Clipperz (in inglese)</a> </li> </ul> ",
+'loginFormTitle':	"accedi a Clipperz",
+'loginFormUsernameLabel':	"Utente",
+'loginFormPassphraseLabel':	"frase segreta",
+'loginFormDontHaveAnAccountLabel':	"non ti sei ancora registrato?",
+'loginFormCreateOneLabel':	"registrati adesso",
+'loginFormForgotYourCredentialsLabel':	"hai perso i dati di accesso?",
+'loginFormAarghThatsBadLabel':	"aargh! questo non è bello!",
+'loginFormAfraidOfMaliciousScriptsLabel':	"non ti fidi?",
+'loginFormVerifyTheCodeLabel':	"controlla il codice",
+'loginFormButtonLabel':	"Accedi",
+'loginFormOneTimePasswordCheckboxLabel':	"usa un codice “usa e getta”",
+'loginFormOneTimePasswordCheckboxDescription':	"",
+'loginPanelSwithLanguageDescription':	"<h5>Seleziona la tua lingua preferita</h5> ",
+'browserCompatibilityDescription':	"<p>Clipperz consiglia Firefox per una maggiore sicurezza. Clipperz supporta anche Opera ed Internet Explorer.</p> ",
+'OTPloginMessagePanelInitialTitle':	"Accesso con codice “usa e getta”",
+'OTPloginMessagePanelInitialText':	"Invio delle credenziali OTP ...",
+'OTPloginMessagePanelLoadingTitle':	"Accesso con codice “usa e getta”",
+'OTPloginMessagePanelLoadingText':	"Caricamento dei dati di autenticazione criptati ...",
+'OTPloginMessagePanelProcessingTitle':	"Accesso con codice “usa e getta”",
+'OTPloginMessagePanelProcessingText':	"Decodifica locale dei dati di autenticazione ...",
+'loginMessagePanelInitialTitle':	"Connessione in corso ...",
+'loginMessagePanelInitialText':	"---",
+'loginMessagePanelInitialButtonLabel':	"Annulla",
+'loginMessagePanelConnectedTitle':	"Connesso",
+'loginMessagePanelConnectedText':	"Fatto",
+'loginMessagePanelFailureTitle':	"Errore",
+'loginMessagePanelFailureText':	"Connessione fallita",
+'loginMessagePanelFailureButtonLabel':	"Chiudi",
+'connectionLoginSendingCredentialsMessageTitle':	"Verifica delle credenziali",
+'connectionLoginSendingCredentialsMessageText':	"Invio delle credenziali",
+'connectionLoginCredentialsVerificationMessageTitle':	"Verifica delle credenziali",
+'connectionLoginCredentialsVerificationMessageText':	"Esecuzione dell&#x27;autenticazione SRP ...",
+'connectionLoginDoneMessageTitle':	"Verifica delle credenziali",
+'connectionLoginDoneMessageText':	"Connesso",
+'userLoginPanelUpgradingUserCredentialsMessageTitle':	"Verifica delle credenziali",
+'userLoginPanelUpgradingUserCredentialsMessageText':	"Aggiornamento delle credenziali ad un nuovo schema di autenticazione",
+'userLoginPanelConnectedMessageTitle':	"Utente autenticato",
+'userLoginPanelConnectedMessageText':	"Autenticazione eseguita con successo",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageTitle':	"Verifica delle credenziali",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageText':	"Tentativo con vecchio schema di autenticazione",
+'userLoginPanelLoadingUserDataMessageTitle':	"Utente autenticato",
+'userLoginPanelLoadingUserDataMessageText':	"Scarica le intestazioni criptate delle schede da Clipperz",
+'userLoginPanelDecryptingUserDataMessageTitle':	"Utente autenticato",
+'userLoginPanelDecryptingUserDataMessageText':	"Decodifica locale dell&#x27;intestazione delle schede",
+'userLoginPanelDecryptingUserStatisticsMessageTitle':	"Utente autenticato",
+'userLoginPanelDecryptingUserStatisticsMessageText':	"Decodifica locale delle statistiche d&#x27;uso",
+'splashAlertTitle':	"Benvenuto a Clipperz!",
+'splashAlertText':	"<p>Alcuni consigli per la sicurezza</p> <ul> <li> <p>La sicurezza dei tuoi dati dipende da quanto è sicura la frase segreta che usi per proteggerli. Nessuno può accedervi a meno che non conosca la frase segreta.</p> </li> <li> <p>Se hai intenzione di usare Clipperz per conservare informazioni sensibili e riservate, scegli attentamente una frase segreta complessa. Più è lunga, maggiore è la sicurezza!</p> </li> <li> <p>E non dimenticare che Clipperz non è in grado di recuperare la tua frase segreta in caso di smarrimento!</p> </li> </ul> <p>Per maggiori informazioni sulla sicurezza, consulta il sito <a href=\"http://www.clipperz.com\" target=\"_blank\">Clipperz</a> (in lingua inglese).</p> ",
+'splashAlertCloseButtonLabel':	"Ok",
+'registrationFormTitle':	"crea il tuo utente",
+'registrationFormUsernameLabel':	"Utente",
+'registrationFormPassphraseLabel':	"frase segreta",
+'registrationFormRetypePassphraseLabel':	"ripeti frase segreta",
+'registrationFormSafetyCheckLabel':	"Sono consapevole che Clipperz non è in grado di recuperare una frase segreta dimenticata.",
+'registrationFormTermsOfServiceCheckLabel':	"Dichiaro di aver letto e di accettare i <a href=\"http://www.clipperz.com/terms_of_service\" target=\"_blank\">Termini del Servizio</a> .",
+'registrationFormDoYouAlreadyHaveAnAccountLabel':	"sei già un utente registrato?",
+'registrationFormSimplyLoginLabel':	"accedi subito",
+'registrationFormButtonLabel':	"Registrati",
+'registrationFormWarningMessageNotMatchingPassphrases':	"Le frasi segrete non corrispondono, ripeti l&#x27;inserimento.",
+'registrationFormWarningMessageSafetyCheckNotSelected':	"Leggi e spunta le condizioni sotto riportate.",
+'registrationFormWarningMessageTermsOfServiceCheckNotSelected':	"Per procedere devi accettare i Termini del Servizio.",
+'registrationMessagePanelInitialTitle':	"Registrazione in corso ...",
+'registrationMessagePanelInitialText':	"---",
+'registrationMessagePanelInitialButtonLabel':	"Annulla",
+'registrationMessagePanelRegistrationDoneTitle':	"Registrazione",
+'registrationMessagePanelRegistrationDoneText':	"Fatto",
+'registrationMessagePanelFailureTitle':	"Registrazione fallita",
+'registrationMessagePanelFailureButtonLabel':	"Chiudi",
+'connectionRegistrationSendingRequestMessageText':	"Verifica delle credenziali",
+'connectionRegistrationSendingCredentialsMessageText':	"Invio delle credenziali",
+'registrationSplashPanelTitle':	"Avviso di sicurezza",
+'registrationSplashPanelDescription':	"<p>Queste sono le tue credenziali di accesso a Clipperz, conservale con cura. Il tuo utente ed la tua frase segreta non ti verranno mostrati una seconda volta!</p> ",
+'registrationSplashPanelUsernameLabel':	"Utente",
+'registrationSplashPanelPassphraseLabel':	"frase segreta",
+'registrationSplashPanelShowPassphraseButtonLabel':	"mostra la frase segreta",
+'donateHeaderLinkLabel':	"donazioni",
+'creditsHeaderLinkLabel':	"credits",
+'feedbackHeaderLinkLabel':	"scrivici",
+'helpHeaderLinkLabel':	"aiuto",
+'forumHeaderLinkLabel':	"forum",
+'recordMenuLabel':	"Schede",
+'accountMenuLabel':	"profilo",
+'dataMenuLabel':	"dati",
+'contactsMenuLabel':	"Contatti",
+'toolsMenuLabel':	"strumenti",
+'logoutMenuLabel':	"esci",
+'lockMenuLabel':	"blocca",
+'lockTitle':	"Utente bloccato",
+'lockDescription':	"<p>Per sbloccare il tuo utente inserisci la frase segreta</p> ",
+'unlockButtonLabel':	"Sblocca",
+'changePasswordTabLabel':	"Cambia la tua frase segreta",
+'changePasswordTabTitle':	"Cambia la tua frase segreta",
+'changePasswordFormUsernameLabel':	"Utente",
+'changePasswordFormOldPassphraseLabel':	"attuale frase segreta",
+'changePasswordFormNewPassphraseLabel':	"nuova frase segreta",
+'changePasswordFormRetypePassphraseLabel':	"ripeti nuova frase segreta",
+'changePasswordFormSafetyCheckboxLabel':	"Sono consapevole che Clipperz non è in grado di recuperare una frase segreta dimenticata.",
+'changePasswordFormSubmitLabel':	"Cambia frase segreta",
+'changePasswordFormWrongUsernameWarning':	"Utente errato",
+'changePasswordFormWrongPassphraseWarning':	"Frase segreta errata",
+'changePasswordFormWrongRetypePassphraseWarning':	"Le frasi segrete non corrispondono, ripeti l&#x27;inserimento.",
+'changePasswordFormSafetyCheckWarning':	"Leggi e spunta le condizioni sotto riportate.",
+'changePasswordFormProgressDialogTitle':	"Aggiornamento credenziali",
+'changePasswordFormProgressDialogEmptyText':	"---",
+'changePasswordFormProgressDialogConnectedMessageTitle':	"Connesso",
+'changePasswordFormProgressDialogConnectedMessageText':	"Fatto",
+'changePasswordFormProgressDialogErrorMessageTitle':	"Errore",
+'changePasswordFormProgressDialogErrorMessageText':	"Aggiornamento credenziali fallito!",
+'changeCredentialsPanelEncryptingDataMessageTitle':	"Cambio della frase segreta",
+'changeCredentialsPanelEncryptingDataMessageText':	"Cripta localmente l&#x27;intestazione delle schede",
+'changeCredentialsPanelCreatingNewCredentialsMessageTitle':	"Cambio della frase segreta",
+'changeCredentialsPanelCreatingNewCredentialsMessageText':	"Aggiornamento delle credenziali",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle':	"Cambio della frase segreta",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageText':	"Carica le intestazioni criptate delle schede su Clipperz",
+'changeCredentialsPanelDoneMessageTitle':	"Cambio della frase segreta",
+'changeCredentialsPanelDoneMessageText':	"Fatto",
+'manageOTPTabLabel':	"Codici di accesso “usa e getta”",
+'manageOTPTabTitle':	"Codici di accesso “usa e getta”",
+'manageOTPTabDescription':	"<p>I codici di accesso e “usa e getta” funzionano come la tua normale frase segreta, ma possono essere utilizzate una sola volta.</p> <p>Se lo stesso codice “usa e getta” viene utilizzato per tentare ulteriori accessi il processo di autenticazione fallirà.</p> <p>Infatti, dopo il primo utilizzo, il codice “usa e getta” verrà immediatamente disattivato e cancellato prevenendo così eventuali accessi non autorizzati.</p> <p>L&#x27;utilizzo di codici “usa e getta” è una scelta consigliata per chi teme che il computer dal quale sta accedendo a Clipperz non sia sicuro a causa di software quali keyloggers e spyware che potrebbero registrare le proprie credenziali di accesso.</p> <p><b>E&#x27; caldamente consigliato l&#x27;utilizzo di codici “usa e getta” quando ci si collega a Clipperz da terminali pubblici quali Internet Cafe e biblioteche.</b> </p> ",
+'oneTimePasswordReadOnlyMessage':	"<h6>Attenzione!</h6> <p>Non è possibilie accedere ai propri codici “usa e getta” quando si utilizza la versione offline di Clipperz.</p> ",
+'oneTimePasswordLoadingMessage':	"<h6>Caricamento dati</h6> <p>Si prega di attendere ...</p> ",
+'oneTimePasswordNoPasswordAvailable':	"<h6>Nessun codice “usa e getta” disponibile</h6> <p>Per creare codici “usa e getta” clicca sul pulsante “Nuovo” che trovi qui sopra.</p> ",
+'deleteOTPButtonLabel':	"Elimina",
+'printOTPButtonLabel':	"Stampa",
+'disabledOneTimePassword_warning':	"disabilitato",
+'oneTimePasswordSelectionLink_selectLabel':	"Seleziona:",
+'oneTimePasswordSelectionLink_none':	"nessuno",
+'oneTimePasswordSelectionLink_used':	"utilizzati",
+'oneTimePasswordSelectionLink_unused':	"disponibili",
+'saveOTP_encryptUserDataTitle':	"Registrazione del nuovo codice “usa e getta”",
+'saveOTP_encryptUserDataText':	"Elaborazione delle credenziali OTP ...",
+'saveOTP_encryptOTPDataTitle':	"Registrazione del nuovo codice “usa e getta”",
+'saveOTP_encryptOTPDataText':	"Codifica locale dei dati di autenticazione ...",
+'saveOTP_sendingDataTitle':	"Registrazione del nuovo codice “usa e getta”",
+'saveOTP_sendingDataText':	"Invio dei dati di autenticazione criptati ...",
+'saveOTP_updatingInterfaceTitle':	"Registrazione del nuovo codice “usa e getta”",
+'saveOTP_updatingInterfaceText':	"Aggiornamento dell&#x27;interfaccia",
+'accountPreferencesLabel':	"Preferenze",
+'accountPreferencesTabTitle':	"Preferenze",
+'accountPreferencesLanguageTitle':	"Selezione della lingua",
+'accountPreferencesLanguageDescription':	"<p>Scegli la lingua preferita dall&#x27;elenco sottostante.</p> ",
+'showDonationReminderPanelTitle':	"Promemoria donazioni",
+'showDonationReminderPanelDescription':	"<p>Mostra i promemopria per le donazioni</p> ",
+'saveUserPreferencesFormSubmitLabel':	"Salva",
+'cancelUserPreferencesFormSubmitLabel':	"Annulla",
+'accountPreferencesSavingPanelTitle_Step1':	"Salvataggio preferenze",
+'accountPreferencesSavingPanelText_Step1':	"Cripta localmente le preferenze",
+'accountPreferencesSavingPanelTitle_Step2':	"Salvataggio preferenze",
+'accountPreferencesSavingPanelText_Step2':	"Carica preferenze criptate su Clipperz",
+'accountLoginHistoryLabel':	"Registro degli accessi",
+'loginHistoryTabTitle':	"Registro degli accessi",
+'loginHistoryReadOnlyMessage':	"<h6>Attenzione!</h6> <p>Il registro degli accessi non è disponibile quando si utilizza la versione offline di Clipperz</p> ",
+'loginHistoryLoadingMessage':	"<h6>Caricamento dati</h6> <p>Si prega di attendere ...</p> ",
+'loginHistoryLoadedMessage':	"<h6>I tuoi ultimi 10 accessi</h6> <p> </p> ",
+'loginHistoryIPLabel':	"IP",
+'loginHistoryTimeLabel':	"data",
+'loginHistoryCurrentSessionText':	"sessione corrente",
+'loginHistoryReloadButtonLabel':	"Aggiorna il registro degli accessi",
+'deleteAccountTabLabel':	"Cancella il tuo utente",
+'deleteAccountTabTitle':	"Cancella il tuo utente",
+'deleteAccountFormUsernameLabel':	"Utente",
+'deleteAccountFormPassphraseLabel':	"frase segreta",
+'deleteAccountFormSafetyCheckboxLabel':	"Sono consapevole che tutti miei dati verranno cancellati e che questa azione è irreversibile.",
+'deleteAccountFormSubmitLabel':	"Cancella il mio utente",
+'deleteAccountFormWrongUsernameWarning':	"Utente errato",
+'deleteAccountFormWrongPassphraseWarning':	"Frase segreta errata",
+'deleteAccountFormSafetyCheckWarning':	"Leggi e spunta le condizioni sotto riportate.",
+'accountPanelDeletingAccountPanelConfirmationTitle':	"ATTENZIONE",
+'accountPanelDeleteAccountPanelConfirmationText':	"Sei sicuro di voler cancellare il tuo utente?",
+'offlineCopyTabLabel':	"Copia offline",
+'offlineCopyTabTitle':	"Copia offline",
+'offlineCopyTabDescription':	"<p>Con un solo clic puoi trasferire tutti i tuoi dati dai server di Clipperz al tuo PC, creando una versione offline di Clipperz a cui potrai accedere quando non è disponibile un collegamento ad Internet.</p> <p>La versione offline in sola lettura è sicura quanto quella online e non espone i tuoi dati a livelli di rischio superiore in quanto entrambe condividono la medesima architettura di sicurezza.</p> <ol> <li> <p>Clicca sul link sottostante per scaricare la copia offline dei tuoi dati.</p> </li> <li> <p>Il browser ti chiederà cosa fare del file “Clipperz_YYYYMMDD.html”. Scegli di salvarlo su un disco locale.</p> </li> <li> <p>Basta un doppio click sul file appena scaricato per lanciare la versione offline di Clipperz.</p> </li> <li> <p>Accedi utilizzando le normali credenziali di accesso.</p> </li> </ol> ",
+'offlineCopyDownloadLinkLabel':	"Scarica copia offline",
+'offlineCopyDownloadWarning':	"<h4><a href=\"#\" id=\"offlineCopyDownloadWarningLink\">Aggiorna la tua “copia offline”!</a> </h4> <p>Una o più schede sono state recentemente create o modificate, ti consigliamo di scaricare nuovamente la tua “copia offline”.</p> ",
+'offlineCopyDownloadOk':	"",
+'sharingTabLabel':	"Condividi",
+'sharingTabTitle':	"Condividi",
+'sharingTabDescription':	"<p>Spesso è necessario condividere alcune delle proprie informazioni riservate con una o più persone.</p> <p>Può trattarsi di situazioni semplici come dare ad un collega il codice di accesso alla propria segreteria telefonica quando si va in vacanza, oppure complesse come regolare l&#x27;accesso dei legittimi eredi ai servizi di online banking utilizzati dal defunto.</p> <p>Con Clipperz la condivisione di segreti diviene un processo semplice e sicuro.</p> <p> </p> <p><b>Presto disponibile ...</b> </p> ",
+'importTabLabel':	"Importa",
+'importTabTitle':	"Importa",
+'importTabDescription':	"<p>Presto disponibile ...</p> ",
+'printingTabLabel':	"Esporta",
+'printingTabTitle':	"Esporta",
+'printingTabDescription':	"<h5>Stampa i tuoi dati</h5> <p>Cliccando sul link sottostante si aprirà una nuova finestra in cui verranno visualizzate tutte le tue schede in un formato idoneo alla stampa.</p> <p>Se intendi utilizzare la stampa per creare una copia di sicurezza dei tuoi dati, ti suggeriamo di considerare l&#x27;opzione più sicura fornita della “copia offline”.</p> ",
+'printingLinkLabel':	"Versione stampabile",
+'contactsTabLabel':	"Contatti",
+'contactsTabTitle':	"Contatti",
+'passwordGeneratorTabLabel':	"Generatore di password",
+'bookmarkletTabLabel':	"Bookmarklet",
+'passwordGeneratorTabTitle':	"Generatore di password",
+'bookmarkletTabTitle':	"Bookmarklet",
+'paswordGeneratorTabDescription':	"<p> </p> ",
+'passwordGeneratorTabButtonLabel':	"Genera password",
+'bookmarkletTabLabel':	"Bookmarklet",
+'bookmarkletTabTitle':	"Bookmarklet",
+'bookmarkletTabBookmarkletTitle':	"Aggiungi a Clipperz",
+'bookmarkletTabInstructions':	"<h3>Come creare una scheda con “login diretto” ad un servizio online</h3> <ol> <li> <p>Aprire la pagina web che contiene la maschera di login. (ovvero la pagina dove usualmente si inseriscono nome utente e password)</p> </li> <li> <p>Cliccare sulla bookmarklet: una nuova finestrella si visualizzerà sopra la pagina.</p> </li> <li> <p>Copiare il testo di configurazione del “login diretto” contenuto nella finestrella. (ctrl-C)</p> </li> <li> <p>Accedere a Clipperz e cliccare sul pulsante <b>Aggiungi nuova scheda</b> .</p> </li> <li> <p>Selezionare il modello “Login diretto” ed incollare il testo precedentemente copiato. (ctrl-V)</p> </li> <li> <p>Cliccare sul pulsante <b>Crea</b> , completare e verificare i dettagli della scheda, quindi cliccare su <b>Salva</b> .</p> </li> </ol> <h3>Come aggiungere un “login diretto” ad una scheda esistente</h3> <ol> <li> <p>Come sopra.</p> </li> <li> <p>Come sopra.</p> </li> <li> <p>Come sopra.</p> </li> <li> <p>Accedere a Clipperz e selezionare la scheda contenente le credenziali del servizio a cui si vuole accedere con il “login diretto” e cliccare su <b>Modifica</b> .</p> </li> <li> <p>Incollare il testo precedentemente copiato nell&#x27;apposito campo presente nella sezione “Login diretti”. (ctrl-V)</p> </li> <li> <p>Cliccare il pulsante <b>Aggiungi nuovo login diretto</b> , completare e verificare i dettagli della scheda, quindi cliccare su <b>Salva</b> .</p> </li> </ol> <p> </p> <p>Ulteriori informazioni sull&#x27;utilizzo della bookmarklet sono <a href=\"http://www.clipperz.com/support/user_guide/bookmarklet\" target=\"_blank\">disponibili qui</a> .</p> ",
+'mainPanelDirectLoginBlockLabel':	"Login diretti",
+'directLinkReferenceShowButtonLabel':	"mostra",
+'mainPanelDirectLoginBlockDescription':	"<p>Crea “login diretti” per accedere ai tuoi servizi web senza bisogno di inserire username e password!</p> <p>I “login diretti” migliorano la tua sicurezza permettendoti di:</p> <ul> <li> <p>adottare comodamente password complesse;</p> </li> <li> <p>non riutilizzare mai la stessa password.</p> </li> </ul> <p>Semplice e rapido grazie alla <b>Clipperz bookmarklet</b> .</p><a href=\"http://www.clipperz.com/support/user_guide/direct_logins\" target=\"_blank\">Ulteriori informazioni</a> ",
+'mainPanelRecordsBlockLabel':	"Schede",
+'mainPanelAddRecordButtonLabel':	"Aggiungi nuova scheda",
+'mainPanelRemoveRecordButtonLabel':	"Elimina scheda",
+'mainPanelRecordFilterBlockTagsLabel':	"tags",
+'recordDetailNoRecordAtAllTitle':	"Benvenuto a Clipperz!",
+'recordDetailNoRecordAtAllDescription':	"<h5>Ora puoi iniziare ad aggiungere schede con le tue informazioni riservate.</h5> <p>Le schede sono semplici moduli in cui organizzare le tue password ed ogni altro tipo di dato confidenziale.</p> <p>Le schede hanno una struttura flessibile e si adattano a contenere le informazioni più diverse: dalle password ai dettagli delle tue carte di credito!</p> <h5>Non dimenticarti di installare la bookmarklet!</h5> <p>Prima di iniziare ti consigliamo di installare la bookmarklet “Aggiungi a Clipperz”: creare nuove schede diventerà più rapido e divertente.</p> <p>Vai alla sezione “bookmarklet” per scoprire come installarla ed utilizzarla.</p> <p> </p> <p>Quando sei pronto, clicca sul pulsante <b>Aggiungi nuova scheda</b> e metti al sicuro tutte le tue informazioni più preziose.</p> <p> </p><a href=\"http://www.clipperz.com/support/user_guide/managing_cards\" target=\"_blank\">Maggiori informazioni sulla creazione e gestione delle schede (in inglese)</a> ",
+'newRecordWizardTitleBox':	"<h5>Seleziona un modello di scheda</h5> <p>Le schede sono semplici moduli in cui organizzare le tue password ed ogni altro tipo di dato confidenziale.</p> <p>Scegli un modello dall&#x27;elenco sottostante. In seguito potrai sempre modificare la tua scheda aggiungendo o rimuovendo campi.</p> ",
+'newRecordWizardBookmarkletConfigurationTitle':	"Login diretto",
+'newRecordWizardBookmarkletConfigurationDescription':	"<p>Incolla qui sotto il codice generato dalla bookmarklet di Clipperz.</p> <p>Verrà creata una nuova scheda già completa con le informazioni per il “login diretto” al tuo servizio web.</p> ",
+'newRecordWizardCreateButtonLabel':	"Crea",
+'newRecordWizardCancelButtonLabel':	"Annulla",
+'donateSplashPanelTitle':	"Supporta Clipperz, fai una donazione oggi!",
+'donateSplashPanelDescription':	"<p>Alcune buone ragioni per fare una donazione:</p> <ul> <li> <p>supportare lo sviluppo di nuove funzionalità</p> </li> <li> <p>mantenere il servizio gratuito per tutti</p> </li> <li> <p>mostrare la tua gratitudine per il nostro duro lavoro</p> </li> </ul> <p>Per qualunque ulteriore informazione visita la <a href=\"http://www.clipperz.com/donations\" target=\"_blank\">pagina delle donazioni</a> .</p> <p><b>Pronto a donare?</b> </p> ",
+'donateCloseButtonLabel':	"Non ancora",
+'recordTemplates':	{
+	'WebAccount':	{
+		'title':	"Password",
+		'description':	"<p>Una scheda molto semplice per conservare le credenziali di accesso ai tuoi servizi web.</p> ",
+		'fields':	{
+			'URL':	"Indirizzo web",
+			'TXT':	"Utente o email",
+			'PWD':	"Password"
+		}
+	},
+	'BankAccount':	{
+		'title':	"Conto corrente bancario",
+		'description':	"<p>Proteggi il tuo numero di conto corrente ed i codici di accesso ai servizi di online banking.</p> ",
+		'fields':	{
+			'TXT':	"Banca",
+			'TXT':	"Conto corrente n.",
+			'URL':	"Sito web della banca",
+			'TXT':	"Online banking ID",
+			'PWD':	"Online banking password"
+		}
+	},
+	'CreditCard':	{
+		'title':	"Carta di credito",
+		'description':	"<p>Numero della carta, data di scadenza, codici CVV2 e PIN sempre a portata di mano con Clipperz.</p> ",
+		'fields':	{
+			'TXT':	"Tipo (Visa, AmEx, ...)",
+			'TXT':	"Numero",
+			'TXT':	"Titolare",
+			'TXT':	"Data di scadenza",
+			'TXT':	"CVV2",
+			'PWD':	"PIN",
+			'URL':	"Sito web della carta",
+			'TXT':	"Utente",
+			'PWD':	"Password"
+		}
+	},
+	'AddressBookEntry':	{
+		'title':	"Voce della rubrica",
+		'description':	"<p>Fai di Clipperz la tua rubrica segreta. Usa questo modello per creare una nuova voce.</p> ",
+		'fields':	{
+			'TXT':	"Nome",
+			'TXT':	"Email",
+			'TXT':	"Telefono",
+			'TXT':	"Cellulare",
+			'ADDR':	"Indirizzo"
+		}
+	},
+	'Custom':	{
+		'title':	"Scheda personalizzata",
+		'description':	"<p>Qualunque sia il tipo di informazione che desideri proteggere, Clipperz ti consente di creare una scheda su misura per i tuoi bisogni.</p> ",
+		'fields':	{
+			'TXT':	"Nome del campo 1",
+			'TXT':	"Nome del campo 2",
+			'TXT':	"Nome del campo 3"
+		}
+	}
+},
+'recordFieldTypologies':	{
+	'TXT':	{
+		'description':	"simple text field"
+	},
+	'PWD':	{
+		'description':	"simple text field, with default status set to hidden",
+		'shortDescription':	"Password"
+	},
+	'URL':	{
+		'description':	"simple text field in edit mode, that became an active url in view mode",
+		'shortDescription':	"Indirizzo web"
+	},
+	'DATE':	{
+		'description':	"a value set with a calendar helper",
+		'shortDescription':	"data"
+	},
+	'ADDR':	{
+		'description':	"just like the URL, but the active link points to Google Maps (or similar service) passing the address value as argument",
+		'shortDescription':	"indirizzo stradale"
+	},
+	'CHECK':	{
+		'description':	"check description",
+		'shortDescription':	"check"
+	},
+	'RADIO':	{
+		'description':	"radio description",
+		'shortDescription':	"radio"
+	},
+	'SELECT':	{
+		'description':	"select description",
+		'shortDescription':	"Seleziona:"
+	}
+},
+'newRecordPanelGeneralExceptionTitle':	"Errore",
+'newRecordPanelGeneralExceptionMessage':	"Configurazione non valida. Accertati di aver utilizzato il codice quello generato dalla bookmarklet.",
+'newRecordPanelWrongBookmarkletVersionExceptionTitle':	"Errore",
+'newRecordPanelWrongBookmarkletVersionExceptionMessage':	"La configurazione è stato generata da una vecchia versione della bookmarklet. Sei pregato di aggiornare subito la tua bookmarklet.",
+'newRecordPanelExceptionPanelCloseButtonLabel':	"Annulla",
+'mainPanelDeletingRecordPanelConfirmationTitle':	"Eliminazione della scheda in corso",
+'mainPanelDeleteRecordPanelConfirmationText':	"Vuoi veramente eliminare la scheda selezionata?",
+'mainPanelDeletingRecordPanelInitialTitle':	"Eliminazione della scheda in corso",
+'mainPanelDeletingRecordPanelInitialText':	"---",
+'mainPanelDeletingRecordPanelCompletedText':	"Fatto",
+'deleteRecordPanelCollectRecordDataMessageTitle':	"Elimina scheda",
+'deleteRecordPanelCollectRecordDataMessageText':	"Aggiorna elenco delle schede",
+'deleteRecordPanelEncryptUserDataMessageTitle':	"Elimina scheda",
+'deleteRecordPanelEncryptUserDataMessageText':	"Cripta localmente l&#x27;intestazione delle schede",
+'deleteRecordPanelSendingDataToTheServerMessageTitle':	"Elimina scheda",
+'deleteRecordPanelSendingDataToTheServerMessageText':	"Carica le intestazioni criptate delle schede su Clipperz",
+'deleteRecordPanelUpdatingTheInterfaceMessageTitle':	"Elimina scheda",
+'deleteRecordPanelUpdatingTheInterfaceMessageText':	"Aggiornamento dell&#x27;interfaccia",
+'recordDetailNoRecordSelectedTitle':	"Nessuna scheda selezionata",
+'recordDetailNoRecordSelectedDescription':	"<p>Selezionare una scheda dall&#x27;elenco a sinistra.</p> ",
+'recordDetailLoadingRecordMessage':	"Scarica scheda criptata da Clipperz",
+'recordDetailDecryptingRecordMessage':	"Decodifica locale dei dati della scheda",
+'recordDetailLoadingRecordVersionMessage':	"Scarica l&#x27;ultima versione della scheda",
+'recordDetailDecryptingRecordVersionMessage':	"Decodifica locale dell&#x27;ultima versione",
+'recordDetailLoadingErrorMessageTitle':	"Errore nello scaricamento della scheda",
+'recordDetailNotesLabel':	"Note",
+'recordDetailLabelFieldColumnLabel':	"Nome del campo",
+'recordDetailDataFieldColumnLabel':	"Dati del campo",
+'recordDetailTypeFieldColumnLabel':	"Tipo",
+'recordDetailSavingChangesMessagePanelInitialTitle':	"Salvataggio scheda",
+'recordDetailSavingChangesMessagePanelInitialText':	"---",
+'recordDetailRemoveFieldButtonLabel':	"-",
+'recordDetailAddFieldButtonLabel':	"Aggiungi nuovo campo",
+'recordDetailPasswordFieldHelpLabel':	"clicca le stelline per copiare la password e poi Ctrl-C",
+'recordDetailPasswordFieldScrambleLabel':	"nascondi",
+'recordDetailPasswordFieldUnscrambleLabel':	"mostra",
+'recordDetailDirectLoginBlockTitle':	"Login diretti",
+'recordDetailNewDirectLoginDescription':	"<p>Configurazione del login diretto</p> ",
+'recordDetailDirectLoginBlockNoDirectLoginConfiguredDescription':	"<p>Questa scheda contiene credenziali di accesso ad un servizio online?</p> <p>In tal caso puoi utilizzare la bookmarklet per configurare un “login diretto” da Clipperz con un solo clic!</p> ",
+'recordDetailDeleteDirectLoginButtonLabel':	"-",
+'recordDetailAddNewDirectLoginButtonLabel':	"Aggiungi nuovo login diretto",
+'recordDetailEditButtonLabel':	"Modifica",
+'recordDetailSaveButtonLabel':	"Salva",
+'recordDetailCancelButtonLabel':	"Annulla",
+'newRecordTitleLabel':	"_nuova scheda_",
+'newDirectLoginLabelSuffix':	"",
+'recordSaveChangesPanelCollectRecordInfoMessageTitle':	"Salva scheda",
+'recordSaveChangesPanelCollectRecordInfoMessageText':	"Aggiorna elenco delle schede",
+'recordSaveChangesPanelEncryptUserDataMessageTitle':	"Salva scheda",
+'recordSaveChangesPanelEncryptUserDataMessageText':	"Cripta localmente l&#x27;intestazione delle schede",
+'recordSaveChangesPanelEncryptRecordDataMessageTitle':	"Salva scheda",
+'recordSaveChangesPanelEncryptRecordDataMessageText':	"Cripta localmente i dati della scheda",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageTitle':	"Salva scheda",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageText':	"Cripta localmente la versione della scheda",
+'recordSaveChangesPanelSendingDataToTheServerMessageTitle':	"Salva scheda",
+'recordSaveChangesPanelSendingDataToTheServerMessageText':	"Carica le intestazioni criptate delle schede su Clipperz",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageTitle':	"Salva scheda",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageText':	"Aggiornamento dell&#x27;interfaccia",
+'passwordGeneratorPanelTitle':	"Generatore di password",
+'passwordGeneratorPanelOkLabel':	"Ok",
+'passwordGeneratorPanelCancelLabel':	"Annulla",
+'passwordGeneratorLengthLabel':	"lung . :",
+//'DWRUtilLoadingMessage':	"Caricamento dati",
+'comingSoon':	"Presto disponibile ...",
+'panelCollectingEntryopyMessageText':	"Raccolta entropia",
+'importData_parsingDataTitle':	"Importa",
+'importData_previewingDataTitle':	"Importa",
+'importData_processingDataTitle':	"Importa",
+'ImportWizard':	{
+	'EDIT':	"Modifica",
+	'IMPORT':	"Importa",
+	'CSV_NOTES':	"Note",
+	'EXCEL_EDIT':	"Modifica"
+},
+'importData_importConfirmation_title':	"Importa",
+'WELCOME_BACK':	"Bentornato!",
+'currentConnectionText':	"Sei collegato da ip __ip__; probabilmente in __country__, utilizzando __browser__ con __operatingSystem__.",
+'latestConnectionText':	"Il tuo ultimo accesso è stato __elapsedTimeDescription__ (__time__) da ip __ip__; probabilmente in __country__, utilizzando __browser__ con __operatingSystem__.",
+'fullLoginHistoryLinkLabel':	"vai al registro degli accessi",
+'elapsedTimeDescriptions':	{
+	'MORE_THAN_A_MONTH_AGO':	"più di un mese fa",
+	'MORE_THAN_A_WEEK_AGO':	"più di una settimana fa",
+	'MORE_THAN_*_WEEKS_AGO':	"più di __elapsed__ settimane fa",
+	'YESTERDAY':	"ieri",
+	'*_DAYS_AGO':	"__elapsed__ giorni fa",
+	'ABOUT_AN_HOUR_AGO':	"circa un&#x27;ora fa",
+	'*_HOURS_AGO':	"__elapsed__ ore fa",
+	'JUST_A_FEW_MINUTES_AGO':	"pochi minuti fa",
+	'ABOUT_*_MINUTES_AGO':	"circa __elapsed__ minuti fa"
+},
+'unknown_ip':	"sconosciuto",
+'countries':	{
+	'--':	"sconosciuto",
+	'AD':	"Andorra",
+	'AE':	"Emirati arabi uniti",
+	'AF':	"Afghanistan",
+	'AG':	"Antigua e Barbuda",
+	'AI':	"Anguilla",
+	'AL':	"Albania",
+	'AM':	"Armenia",
+	'AN':	"Antille olandesi",
+	'AO':	"Angola",
+	'AR':	"Argentina",
+	'AS':	"Samoa americane",
+	'AT':	"Austria",
+	'AU':	"Australia",
+	'AW':	"Aruba",
+	'AZ':	"Azerbaigian",
+	'BB':	"Barbados",
+	'BD':	"Bangladesh",
+	'BE':	"Belgio",
+	'BF':	"Burkina-Faso",
+	'BG':	"Bulgaria",
+	'BH':	"Bahrein",
+	'BI':	"Burundi",
+	'BJ':	"Benin",
+	'BM':	"Bermuda",
+	'BN':	"Brunei",
+	'BO':	"Bolivia",
+	'BR':	"Brasile",
+	'BS':	"Bahamas",
+	'BT':	"Bhutan",
+	'BW':	"Botswana",
+	'BY':	"Bielorussia",
+	'BZ':	"Belize",
+	'CA':	"Canada",
+	'CD':	"Repubblica democratica del Congo",
+	'CF':	"Repubblica centrafricana",
+	'CH':	"Svizzera",
+	'CK':	"Isole Cook",
+	'CL':	"Cile",
+	'CM':	"Camerun",
+	'CN':	"Cina",
+	'CO':	"Colombia",
+	'CR':	"Costa Rica",
+	'CS':	"Repubblica del Montenegro",
+	'CU':	"Cuba",
+	'CY':	"Cipro",
+	'CZ':	"Repubblica ceca",
+	'DE':	"Germania",
+	'DJ':	"Gibuti",
+	'DK':	"Danimarca",
+	'DO':	"Repubblica dominicana",
+	'DZ':	"Algeria",
+	'EC':	"Ecuador",
+	'EE':	"Estonia",
+	'EG':	"Egitto",
+	'ER':	"Eritrea",
+	'ES':	"Spagna",
+	'ET':	"Etiopia",
+	'FI':	"Finlandia",
+	'FJ':	"Figi",
+	'FM':	"Micronesia",
+	'FO':	"Isole Fær Øer",
+	'FR':	"Francia",
+	'GA':	"Gabon",
+	'GB':	"Regno Unito",
+	'GD':	"Grenada",
+	'GE':	"Georgia",
+	'GF':	"Guyana francese",
+	'GG':	"Guernsey",
+	'GH':	"Ghana",
+	'GI':	"Gibilterra",
+	'GL':	"Groenlandia",
+	'GM':	"Gambia",
+	'GP':	"Guadalupa",
+	'GR':	"Grecia",
+	'GT':	"Guatemala",
+	'GU':	"Guam",
+	'GW':	"Guinea-Bissau",
+	'GY':	"Guyana",
+	'HK':	"Hong Kong",
+	'HN':	"Honduras",
+	'HT':	"Haiti",
+	'HU':	"Ungheria",
+	'ID':	"Indonesia",
+	'IE':	"Irlanda",
+	'IL':	"Israele",
+	'IM':	"Isola di Man",
+	'IN':	"India",
+	'IO':	"Territorio britannico dell&#x27;Oceano Indiano",
+	'IQ':	"Iraq",
+	'IR':	"Iran",
+	'IS':	"Islanda",
+	'IT':	"Italia",
+	'JE':	"Jersey",
+	'JM':	"Giamaica",
+	'JO':	"Giordania",
+	'JP':	"Giappone",
+	'KE':	"Kenya",
+	'KG':	"Kirghizistan",
+	'KH':	"Cambogia",
+	'KI':	"Kiribati",
+	'KN':	"Saint Kitts e Nevis",
+	'KR':	"Corea del Sud",
+	'KW':	"Kuwait",
+	'KY':	"Isole Cayman",
+	'KZ':	"Kazakistan",
+	'LA':	"Laos",
+	'LB':	"Libano",
+	'LC':	"Saint Lucia",
+	'LI':	"Liechtenstein",
+	'LK':	"Sri Lanka",
+	'LR':	"Liberia",
+	'LS':	"Lesotho",
+	'LT':	"Lituania",
+	'LU':	"Lussemburgo",
+	'LV':	"Lettonia",
+	'LY':	"Libia",
+	'MA':	"Marocco",
+	'MC':	"Monaco",
+	'MD':	"Moldova",
+	'MG':	"Madagascar",
+	'MH':	"Isole Marshall",
+	'ML':	"Mali",
+	'MM':	"Myanmar",
+	'MN':	"Mongolia",
+	'MP':	"Marianne settentrionali",
+	'MR':	"Mauritania",
+	'MS':	"Montserrat",
+	'MT':	"Malta",
+	'MU':	"Maurizio",
+	'MV':	"Maldive",
+	'MW':	"Malawi",
+	'MX':	"Messico",
+	'MY':	"Malaysia",
+	'MZ':	"Mozambico",
+	'NA':	"Namibia",
+	'NC':	"Nuova Caledonia",
+	'NF':	"Isola Norfolk",
+	'NG':	"Nigeria",
+	'NI':	"Nicaragua",
+	'NL':	"Paesi Bassi",
+	'NO':	"Norvegia",
+	'NP':	"Nepal",
+	'NR':	"Nauru",
+	'NU':	"Niue",
+	'NZ':	"Nuova Zelanda",
+	'OM':	"Oman",
+	'PA':	"Panama",
+	'PE':	"Perù",
+	'PF':	"Polinesia francese",
+	'PG':	"Papua Nuova Guinea",
+	'PH':	"Filippine",
+	'PK':	"Pakistan",
+	'PL':	"Polonia",
+	'PR':	"Puerto Rico",
+	'PS':	"Territori palestinesi",
+	'PT':	"Portogallo",
+	'PW':	"Palau",
+	'PY':	"Paraguay",
+	'QA':	"Qatar",
+	'RO':	"Romania",
+	'RS':	"Serbia",
+	'RU':	"Russia",
+	'RW':	"Ruanda",
+	'SA':	"Arabia Saudita",
+	'SB':	"Isole Salomone",
+	'SC':	"Seicelle",
+	'SD':	"Sudan",
+	'SE':	"Svezia",
+	'SG':	"Singapore",
+	'SI':	"Slovenia",
+	'SL':	"Sierra Leone",
+	'SM':	"San Marino",
+	'SN':	"Senegal",
+	'SR':	"Suriname",
+	'SV':	"El Salvador",
+	'SY':	"Siria",
+	'SZ':	"Swaziland",
+	'TC':	"Turks e Caicos",
+	'TG':	"Togo",
+	'TH':	"Thailandia",
+	'TJ':	"Tagikistan",
+	'TM':	"Turkmenistan",
+	'TN':	"Tunisia",
+	'TO':	"Tonga",
+	'TR':	"Turchia",
+	'TV':	"Tuvalu",
+	'TW':	"Taiwan",
+	'TZ':	"Tanzania",
+	'UA':	"Ucraina",
+	'UG':	"Uganda",
+	'US':	"Stati Uniti",
+	'UY':	"Uruguay",
+	'UZ':	"Uzbekistan",
+	'VA':	"Santa Sede (Stato della Città del Vaticano)",
+	'VE':	"Venezuela",
+	'VG':	"Isole Vergini britanniche",
+	'VI':	"Isole Vergini statunitensi",
+	'VN':	"Vietnam",
+	'VU':	"Vanuatu",
+	'WS':	"Samoa",
+	'YE':	"Yemen",
+	'ZA':	"Sud Africa",
+	'ZM':	"Zambia",
+	'ZW':	"Zimbabwe"
+},
+'browsers':	{
+	'UNKNOWN':	"sconosciuto"
+},
+'operatingSystems':	{
+	'UNKNOWN':	"sconosciuto",
+	'MOBILE':	"Cellulare"
+},
+'calendarStrings':	{
+	'months':	{
+		'0':	"Gennaio",
+		'1':	"Febbraio",
+		'2':	"Marzo",
+		'3':	"Aprile",
+		'4':	"Mag",
+		'5':	"Giugno",
+		'6':	"Luglio",
+		'7':	"Agosto",
+		'8':	"Settembre",
+		'9':	"Ottobre",
+		'10':	"Novembre",
+		'11':	"Dicembre"
+	},
+	'shortMonths':	{
+		'0':	"Gen",
+		'1':	"Feb",
+		'2':	"Mar",
+		'3':	"Apr",
+		'4':	"Mag",
+		'5':	"Giu",
+		'6':	"Lug",
+		'7':	"Ago",
+		'8':	"Set",
+		'9':	"Ott",
+		'10':	"Nov",
+		'11':	"Dic"
+	},
+	'days':	{
+		'0':	"Domenica",
+		'1':	"Lunedì",
+		'2':	"Martedì",
+		'3':	"Mercoledì",
+		'4':	"Giovedì",
+		'5':	"Venerdì",
+		'6':	"Sabato"
+	},
+	'shortDays':	{
+		'0':	"Dom",
+		'2':	"Mar",
+		'3':	"Mer",
+		'4':	"Gio",
+		'5':	"Ven",
+		'6':	"Sab"
+	},
+	'veryShortDays':	{
+		'1':	"Lu",
+		'4':	"Gi",
+		'5':	"Ve"
+	}
+},
+
+__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_ja-JP.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_ja-JP.js
new file mode 100644
index 0000000..2b571b7
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_ja-JP.js
@@ -0,0 +1,808 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+Clipperz.PM.Strings.Languages['ja-JP'.toLowerCase()] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+'clipperzServiceDescription':	"<h2>自分で管理しよう！</h2> <ul> <li> <h3>Clipperz は</h3> <ul> <li> <p>安全でシンプルなパスワードマネージャです</p> </li> <li> <p>シングルサインオンを提供します</p> </li> <li> <p>機密情報のデジタル格納庫です</p> </li> </ul> </li> <li> <h3>Clipperz でできること</h3> <ul> <li> <p>パスワードを保管して管理できます</p> </li> <li> <p>ユーザー名やパスワードを入力せずに登録したウェブサービスにログインできます</p> </li> <li> <p>暗証番号やクレジットカード番号などあらゆる機密情報を守ります</p> </li> <li> <p>家族や信用できる相手と機密情報を共有できます（提供予定）</p> </li> </ul> </li> <li> <h3>Clipperz のよいところ</h3> <ul> <li> <p>無料で匿名利用できます</p> </li> <li> <p>いつでもどのコンピュータからでもアクセスできます</p> </li> <li> <p>ソフトウェアのダウンロードやインストールは不要です</p> </li> <li> <p>PC や紙に機密情報を残す必要がありません</p> </li> </ul> </li> <li> <h3>Clipperz のセキュリティ</h3> <ul> <li> <p>データはブラウザで暗号化されてから Clipprez に送信されます</p> </li> <li> <p>暗号化のキーはあなただけが知っているパスフレーズです</p> </li> <li> <p>保管したデータは暗号化されていて、保管中には決して中身を見ることができません</p> </li> <li> <p>標準が確立された暗号化手順を採用しています</p> </li> <li> <p>ソースコードはいつでも参照できますが、暗号化について何も知らなくても使えます</p> </li> </ul> </li> <li><a href=\"http://www.clipperz.com\" target=\"_blank\">もっと見る</a> </li> </ul> ",
+'loginFormTitle':	"Clipperz のアカウントでログイン",
+'loginFormUsernameLabel':	"ユーザー名",
+'loginFormPassphraseLabel':	"パスフレーズ",
+'loginFormDontHaveAnAccountLabel':	"アカウントを持っていない?",
+'loginFormCreateOneLabel':	"新規作成",
+'loginFormForgotYourCredentialsLabel':	"パスフレーズを忘れた?",
+'loginFormAarghThatsBadLabel':	"それは困った！",
+'loginFormAfraidOfMaliciousScriptsLabel':	"偽サイトかも？",
+'loginFormVerifyTheCodeLabel':	"確認する",
+'loginFormButtonLabel':	"ログイン",
+'loginFormOneTimePasswordCheckboxLabel':	"ワンタイムパスフレーズ使用",
+'loginFormOneTimePasswordCheckboxDescription':	"",
+'loginPanelSwithLanguageDescription':	"<h5>言語設定の変更</h5> ",
+'browserCompatibilityDescription':	"<p>Clipperz は Firefox に最適化されています。 しかし Clipperz は Opera や Safari そしてインターネットエクスプローラでも十分動作します。</p> ",
+'OTPloginMessagePanelInitialTitle':	"ワンタイムパスフレーズでログイン中",
+'OTPloginMessagePanelInitialText':	"OTP 情報送信中 ...",
+'OTPloginMessagePanelLoadingTitle':	"ワンタイムパスフレーズでログイン中",
+'OTPloginMessagePanelLoadingText':	"認証情報を取得中 ...",
+'OTPloginMessagePanelProcessingTitle':	"ワンタイムパスフレーズでログイン中",
+'OTPloginMessagePanelProcessingText':	"認証情報を復号中 ...",
+'loginMessagePanelInitialTitle':	"ログイン中 ...",
+'loginMessagePanelInitialText':	"---",
+'loginMessagePanelInitialButtonLabel':	"キャンセル",
+'loginMessagePanelConnectedTitle':	"接続完了",
+'loginMessagePanelConnectedText':	"完了",
+'loginMessagePanelFailureTitle':	"エラー",
+'loginMessagePanelFailureText':	"ログインに失敗しました",
+'loginMessagePanelFailureButtonLabel':	"閉じる",
+'connectionLoginSendingCredentialsMessageTitle':	"認証確認中",
+'connectionLoginSendingCredentialsMessageText':	"認証送信中",
+'connectionLoginCredentialsVerificationMessageTitle':	"認証確認中",
+'connectionLoginCredentialsVerificationMessageText':	"SRP 認証中",
+'connectionLoginDoneMessageTitle':	"認証確認中",
+'connectionLoginDoneMessageText':	"接続完了",
+'userLoginPanelUpgradingUserCredentialsMessageTitle':	"認証確認中",
+'userLoginPanelUpgradingUserCredentialsMessageText':	"認証更新中",
+'userLoginPanelConnectedMessageTitle':	"認証完了",
+'userLoginPanelConnectedMessageText':	"ログイン完了",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageTitle':	"認証確認中",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageText':	"認証復元中",
+'userLoginPanelLoadingUserDataMessageTitle':	"認証完了",
+'userLoginPanelLoadingUserDataMessageText':	"暗号化データを受信中",
+'userLoginPanelDecryptingUserDataMessageTitle':	"認証完了",
+'userLoginPanelDecryptingUserDataMessageText':	"復号中",
+'userLoginPanelDecryptingUserStatisticsMessageTitle':	"認証完了",
+'userLoginPanelDecryptingUserStatisticsMessageText':	"復号中",
+'splashAlertTitle':	"Clipperz へようこそ",
+'splashAlertText':	"<p>セキュリティアドバイス</p> <ul> <li> <p>Clipperz に保管したデータはパスフレーズによって保護されます。 パスフレーズを知らない人はデータにアクセスできません。</p> </li> <li> <p>Clipperz に重要なデータを保管するためにパスフレーズを類推されにくいものにしてください。 長いほど安全です。</p> </li> <li> <p>パスフレーズを忘れてしまったら Clipperz ではデータを復元できません。</p> </li> </ul> <p>さらに詳しくは Clipperz のサイトをごらんください。</p> ",
+'splashAlertCloseButtonLabel':	"OK",
+'registrationFormTitle':	"新規アカウント作成",
+'registrationFormUsernameLabel':	"ユーザー名",
+'registrationFormPassphraseLabel':	"パスフレーズ",
+'registrationFormRetypePassphraseLabel':	"パスフレーズをもう一度",
+'registrationFormSafetyCheckLabel':	"パスフレーズを忘れたら復活できないことを了承します。",
+'registrationFormTermsOfServiceCheckLabel':	"利用許諾に同意します 。",
+'registrationFormDoYouAlreadyHaveAnAccountLabel':	"アカウントを持っている？",
+'registrationFormSimplyLoginLabel':	"すぐにログイン",
+'registrationFormButtonLabel':	"登録",
+'registrationFormWarningMessageNotMatchingPassphrases':	"パスフレーズの入力に誤りがあります。 再入力してください。",
+'registrationFormWarningMessageSafetyCheckNotSelected':	"説明を読んで下のボックスを全てチェックしてください。",
+'registrationFormWarningMessageTermsOfServiceCheckNotSelected':	"利用許諾に同意してください。",
+'registrationMessagePanelInitialTitle':	"アカウント作成中 ...",
+'registrationMessagePanelInitialText':	"---",
+'registrationMessagePanelInitialButtonLabel':	"キャンセル",
+'registrationMessagePanelRegistrationDoneTitle':	"登録",
+'registrationMessagePanelRegistrationDoneText':	"完了",
+'registrationMessagePanelFailureTitle':	"登録失敗",
+'registrationMessagePanelFailureButtonLabel':	"閉じる",
+'connectionRegistrationSendingRequestMessageText':	"認証確認中",
+'connectionRegistrationSendingCredentialsMessageText':	"認証送信中",
+'registrationSplashPanelTitle':	"セキュリティアドバイス",
+'registrationSplashPanelDescription':	"<p>Clipperz の認証情報です。 大切に保管してください。 ユーザー名とパスフレーズは二度と表示されません。</p> ",
+'registrationSplashPanelUsernameLabel':	"ユーザー名",
+'registrationSplashPanelPassphraseLabel':	"パスフレーズ",
+'registrationSplashPanelShowPassphraseButtonLabel':	"パスフレーズを表示",
+'donateHeaderLinkLabel':	"寄付",
+'creditsHeaderLinkLabel':	"クレジット",
+'feedbackHeaderLinkLabel':	"フィードバック",
+'helpHeaderLinkLabel':	"ヘルプ",
+'forumHeaderLinkLabel':	"フォーラム",
+'recordMenuLabel':	"カード",
+'accountMenuLabel':	"アカウント",
+'dataMenuLabel':	"データ",
+'contactsMenuLabel':	"コンタクト",
+'toolsMenuLabel':	"ツール",
+'logoutMenuLabel':	"ログアウト",
+'lockMenuLabel':	"ロック",
+'lockTitle':	"アカウントはロックされました",
+'lockDescription':	"<p>ロックを解除するにはパスフレーズを入力してください。</p> ",
+'unlockButtonLabel':	"解除",
+'changePasswordTabLabel':	"パスフレーズの変更",
+'changePasswordTabTitle':	"パスフレーズの変更",
+'changePasswordFormUsernameLabel':	"ユーザー名",
+'changePasswordFormOldPassphraseLabel':	"今のパスフレーズ",
+'changePasswordFormNewPassphraseLabel':	"新しいパスフレーズ",
+'changePasswordFormRetypePassphraseLabel':	"パスフレーズをもう一度",
+'changePasswordFormSafetyCheckboxLabel':	"パスフレーズを忘れたら復活できないことを了承します。",
+'changePasswordFormSubmitLabel':	"変更",
+'changePasswordFormWrongUsernameWarning':	"ユーザー名が違います",
+'changePasswordFormWrongPassphraseWarning':	"パスフレーズが違います",
+'changePasswordFormWrongRetypePassphraseWarning':	"パスフレーズの入力に誤りがあります。 再入力してください。",
+'changePasswordFormSafetyCheckWarning':	"説明を読んでボックスをチェックしてください。",
+'changePasswordFormProgressDialogTitle':	"認証情報を変更中",
+'changePasswordFormProgressDialogEmptyText':	"---",
+'changePasswordFormProgressDialogConnectedMessageTitle':	"接続完了",
+'changePasswordFormProgressDialogConnectedMessageText':	"完了",
+'changePasswordFormProgressDialogErrorMessageTitle':	"エラー",
+'changePasswordFormProgressDialogErrorMessageText':	"変更に失敗しました",
+'changeCredentialsPanelEncryptingDataMessageTitle':	"パスフレーズを変更中",
+'changeCredentialsPanelEncryptingDataMessageText':	"カードヘッダ暗号化",
+'changeCredentialsPanelCreatingNewCredentialsMessageTitle':	"パスフレーズを変更中",
+'changeCredentialsPanelCreatingNewCredentialsMessageText':	"認証情報を送信中",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle':	"パスフレーズを変更中",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageText':	"暗号化データを送信中",
+'changeCredentialsPanelDoneMessageTitle':	"パスフレーズを変更中",
+'changeCredentialsPanelDoneMessageText':	"完了",
+'manageOTPTabLabel':	"ワンタイムパスフレーズ管理",
+'manageOTPTabTitle':	"ワンタイムパスフレーズ管理",
+'manageOTPTabDescription':	"<p>ワンタイムパスフレーズは通常のパスフレームと同様に機能しますが、一回限りの使い捨てパスフレーズです。</p> <p>同じパスフレーズで再度ログインすることはできません。</p> <p>不正アクセス防止のためにログインに成功したら直ちにワンタイムパスフレーズは削除されます</p> <p>ワンタイムパスフレーズはキーロガーやスパイウェアからパスフレーズを守るすばらしい機能です</p> <p><b>インターネットカフェや図書館などから Clipperz にアクセする場合にはワンタイムパスフレーズを利用することを強くお薦めします。</b> </p> ",
+'oneTimePasswordReadOnlyMessage':	"<h6>ごめんなさい</h6> <p>ローカルコピー使用中はワンタイムパスフレーズを利用できません。</p> ",
+'oneTimePasswordLoadingMessage':	"<h6>ロード中</h6> <p>お待ちください ...</p> ",
+'oneTimePasswordNoPasswordAvailable':	"<h6>有効なワンタイムパスフレーズがありません</h6> <p>「新規」ボタンをクリックしてワンタイムパスフレーズを作成してください。</p> ",
+'createNewOTPButtonLabel':	"新規",
+'deleteOTPButtonLabel':	"削除",
+'printOTPButtonLabel':	"印刷",
+'disabledOneTimePassword_warning':	"無効",
+'oneTimePasswordSelectionLink_selectLabel':	"選択:",
+'oneTimePasswordSelectionLink_all':	"すべて",
+'oneTimePasswordSelectionLink_none':	"解除",
+'oneTimePasswordSelectionLink_used':	"使用済",
+'oneTimePasswordSelectionLink_unused':	"未使用",
+'saveOTP_encryptUserDataTitle':	"ワンタイムパスフレーズを保存中",
+'saveOTP_encryptUserDataText':	"OTP 認証譲歩を作成中 ...",
+'saveOTP_encryptOTPDataTitle':	"ワンタイムパスフレーズを保存中",
+'saveOTP_encryptOTPDataText':	"暗号化データを作成中 ...",
+'saveOTP_sendingDataTitle':	"ワンタイムパスフレーズを保存中",
+'saveOTP_sendingDataText':	"暗号化データを送信中 ...",
+'saveOTP_updatingInterfaceTitle':	"ワンタイムパスフレーズを保存中",
+'saveOTP_updatingInterfaceText':	"インターフェイスを更新中 ...",
+'accountPreferencesLabel':	"設定",
+'accountPreferencesTabTitle':	"設定",
+'accountPreferencesLanguageTitle':	"言語設定",
+'accountPreferencesLanguageDescription':	"<p>リストから使用する言語を選択してください。</p> ",
+'showDonationReminderPanelTitle':	"ドネーションリマインダ",
+'showDonationReminderPanelDescription':	"<p>ドネーションリマインダを表示</p> ",
+'saveUserPreferencesFormSubmitLabel':	"保存",
+'cancelUserPreferencesFormSubmitLabel':	"キャンセル",
+'accountPreferencesSavingPanelTitle_Step1':	"保存中",
+'accountPreferencesSavingPanelText_Step1':	"暗号化中",
+'accountPreferencesSavingPanelTitle_Step2':	"保存中",
+'accountPreferencesSavingPanelText_Step2':	"送信中",
+'accountLoginHistoryLabel':	"ログイン履歴",
+'loginHistoryTabTitle':	"ログイン履歴",
+'loginHistoryReadOnlyMessage':	"<h6>ごめんなさい</h6> <p>ローカルコピー使用中はログイン履歴を利用できません。</p> ",
+'loginHistoryLoadingMessage':	"<h6>ロード中</h6> <p>お待ちください ...</p> ",
+'loginHistoryLoadedMessage':	"<h6>最近 10 回のログイン</h6> <p> </p> ",
+'loginHistoryIPLabel':	"IP",
+'loginHistoryTimeLabel':	"日付",
+'loginHistoryCurrentSessionText':	"現在のログイン",
+'loginHistoryReloadButtonLabel':	"ログイン履歴を更新",
+'deleteAccountTabLabel':	"アカウント削除",
+'deleteAccountTabTitle':	"アカウント削除",
+'deleteAccountFormUsernameLabel':	"ユーザー名",
+'deleteAccountFormPassphraseLabel':	"パスフレーズ",
+'deleteAccountFormSafetyCheckboxLabel':	"全てのデータが消去されて復元不可能になることを了承します。",
+'deleteAccountFormSubmitLabel':	"アカウント削除",
+'deleteAccountFormWrongUsernameWarning':	"ユーザー名が違います",
+'deleteAccountFormWrongPassphraseWarning':	"パスフレーズが違います",
+'deleteAccountFormSafetyCheckWarning':	"説明を読んでボックスをチェックしてください。",
+'accountPanelDeletingAccountPanelConfirmationTitle':	"確認",
+'accountPanelDeleteAccountPanelConfirmationText':	"本当にアカウントを削除しますか？",
+'accountPanelDeleteAccountPanelConfirmButtonLabel':	"はい",
+'accountPanelDeleteAccountPanelDenyButtonLabel':	"いいえ",
+'accountPanelDeletingAccountPanelProgressTitle':	"アカウント情報削除中",
+'accountPanelDeletingAccountPanelProgressText':	"しばらくお待ちください",
+'offlineCopyTabLabel':	"ローカルコピー",
+'offlineCopyTabTitle':	"ローカルコピー",
+'offlineCopyTabDescription':	"<p>ダウンロードのリンクをクリクするとインターネットに接続していないときでも利用できる読み取り専用のローカル版をダウンロードできます。</p> <p>ローカル版はオンライン版と同じ暗号化処理がされているため、編集可能なオンライン版と同じ安全性があります。</p> <ol> <li> <p>下の「ダウンロード」をクリックします。</p> </li> <li> <p>ブラウザーが &quot;Clipperz_YYYYMMDD.html&quot; をダウンロードするか確認します。 ファイルをハードディスクに保存してください。</p> </li> <li> <p>ローカルコピーをダブルクリックして起動してください。</p> </li> <li> <p>オンライン版と同じユーザー名とパスフレーズを入力してください。</p> </li> </ol> ",
+'offlineCopyDownloadLinkLabel':	"ダウンロード",
+'offlineCopyDownloadWarning':	"<h4><a href=\"#\" id=\"offlineCopyDownloadWarningLink\">ローカルコピーを更新してください</a> </h4> <p>ローカルコピーを作成後に新しいカードを追加または編集しています。 最新の情報を保つためローカルコピーを更新してください。</p> ",
+'offlineCopyDownloadOk':	"",
+'sharingTabLabel':	"共有",
+'sharingTabTitle':	"共有",
+'sharingTabDescription':	"<p>暗証番号などを他人に教える必要があることは日常生活で往々にして発生します。</p> <p>同僚に留守番電話のメッセージを代わりに聞いてもらうために暗証番号を教えたり、秘書に代わりに銀行に行ってもらうために暗証番号を教えたりということはよくあることです。</p> <p>Clipperz では機密情報を安全に、そして簡単に共有できます。</p> <p> </p> <p><b>近日登場 ...</b> </p> ",
+'importTabLabel':	"インポート",
+'importTabTitle':	"インポート",
+'importTabDescription':	"<p>コンピュータから Clipperz にデータを一括インポートできます。</p> ",
+'printingTabLabel':	"エクスポート",
+'printingTabTitle':	"エクスポート",
+'printingTabDescription':	"<h5>印刷</h5> <p>「印刷用データ」のリンクをクリックするとウィンドウが開いて全てのデータが印刷可能な状態で表示されます。</p> <p>バックアップが目的なら、誰でも見ることができる印刷版よりは安全なローカルコピーをお薦めします。</p> ",
+'printingLinkLabel':	"印刷用データ",
+'exportTabDescription':	"<h5>JSON エクスポート</h5> <p>JSON はすべてのデータをエクスポートできます。 ダイレクトログインを含むすべての情報が保存されます。</p> <p>このフォーマットはすべてのデータを別の Clipperz アカウントに移動するときに便利です。 トラブルが発生したときにデータを復旧するのにも役立ちます。</p> <p>「JSON 出力｣のリンクをクリックするとエクスポートが開始されます。</p> ",
+'exportLinkLabel':	"JSON 出力",
+'exportDataInProgressDescription':	"<h4>出力中。しばらくお待ちください ...</h4> ",
+'exportDataDescription':	"<h4>利用法</h4> <p>下のテキストを任意のエディターにコピーして保存します。 （例： 「clipperz_export_20071217.json」）</p> ",
+'contactsTabLabel':	"コンタクト",
+'contactsTabTitle':	"コンタクト",
+'passwordGeneratorTabLabel':	"パスワードジェネレータ",
+'bookmarkletTabLabel':	"ブックマークレット",
+'compactTabLabel':	"コンパクト版",
+'httpAuthTabLabel':	"HTTP 認証",
+'passwordGeneratorTabTitle':	"パスワードジェネレータ",
+'bookmarkletTabTitle':	"ブックマークレット",
+'compactTabTitle':	"コンパクト版",
+'httpAuthTabTitle':	"HTTP 認証",
+'paswordGeneratorTabDescription':	"<p> </p> ",
+'passwordGeneratorTabButtonLabel':	"パスワード生成",
+'bookmarkletTabLabel':	"ブックマークレット",
+'bookmarkletTabTitle':	"ブックマークレット",
+'bookmarkletTabDescription':	"<p>ブックマークレットはブラウザのブックマークに登録して使う小さなプログラムです。 通常のウェブページのブックマークと同じようにブラウザに登録できます。</p> <p>Clipperz のブックマークレットを使えば簡単に新規カードを追加したり、既存のカードにダイレクトログインを追加したりできます。</p> <p><b>Clipperz のブックマークレットにはユーザー名やパスフレーズなどの個人情報は含まれていません。ブックマークレットは全ユーザー共通のものです。</b> </p> <h3>ブックマークレットの登録方法</h3> <h>Firefox, Camino, Opera, Safari <ol> <li> <p>ブックマークバー（パーソナルバー）が表示されていることを確認します。 （「表示」メニュー（「表示＞ツールバー」サブメニューの場合もあり）から変更できます。）</p> </li> <li> <p>下の「Clipperz に追加」をブックマークバー（パーソナルバー）にドラッグします。</p> </li> </ol> <h5>インターネットエクスプローラー</h5> <ol> <li> <p>アドレスバーが表示されていることを確認します。 （「表示＞ツールバー＞アドレスバー」メニューから変更できます。）</p> </li> <li> <p>下の「Clipperz に追加」を右クリックします。</p> </li> <li> <p>コンテキストメニューから「お気に入りに追加」を選択します。</p> </li> <li> <p>セキュリティ警告が表示されますので「はい」をクリックします。</p> </li> <li> <p>保存先の「リンク」フォルダーを開き「OK」をクリックします。</p> </li> </ol> ",
+'bookmarkletTabBookmarkletTitle':	"Clipperz に追加",
+'bookmarkletTabInstructions':	"<h3>ダイレクトログイン用の新規カードの作成方法</h3> <ol> <li> <p>保存したいサービスのログインページを開きます。 （パスワードなどを入力する画面があるところです）</p> </li> <li> <p>ブックマークレットをクリックします。 画面上にウィンドウがポップアップします。</p> </li> <li> <p>ポップアップしたウィンドウに表示された登録用コードをコピーします。 （ctrl-C)</p> </li> <li> <p>Clipperz にログインして 「新規カード追加」のボタンをクリックします。</p> </li> <li> <p>「ダイレクトログイン」のテンプレートを選んでコード入力用のスペースに先ほどコピーしたコードを貼り付けます。 (ctrl-V)</p> </li> <li> <p>「作成」ボタンをクリックして、内容を確認して「保存」ボタンをクリックします。</p> </li> </ol> <h3>既存カードへのダイレクトログインの追加方法</h3> <ol> <li> <p>上記と同じです。</p> </li> <li> <p>上記と同じです。</p> </li> <li> <p>上記と同じです。</p> </li> <li> <p>Clipperz にログインして変更したいカードを選択後「編集」ボタンをクリックします。</p> </li> <li> <p>ダイレクトログインコード用のスペースに先ほどコピーしたコードを貼り付けます。 (ctrl-V)</p> </li> <li> <p>「ダイレクトログイン追加」ボタンをクリックして、内容を確認して「保存」ボタンをクリックします。</p> </li> </ol> <p> </p> <p>ブックマークレットに関する詳しい情報はこちら。</p> ",
+'compactTabDescription':	"<p>Clipprez Compact は Firefox のサイドバーで利用するようデザインされた Clipperz の特別版です。</p> <p>ダイレクトログインを常時アクセス可能にします。 さらに詳しく </p> <h3>Clipperz Compact の利用法</h3> <ol> <li> <p>Firefox を入手します。 サイドバーは Firefox だけで利用できるため、 Clipperz Compact を利用するには Firefox が必須です。</p> </li> <li> <p>下の「Clipperz Compact」 URL を Firefox のブックマークに登録します。ブックマークバーにドラッグするのが簡単です。</p> <div id=\"compactLinkBox\"><a href=\"https://www.clipperz.com/beta/index.html?compact\" target=\"_search\">Clipperz Compact</a> </div> </li> <li> <p>ブックマークを右クリックして「情報を見る｣を選択後、「このブックマークをサイドバーに読み込む｣にチェックを入れます。</p> </li> </ol> <h5>追加情報：Clipperz Compact は Opera のパネルでも操作します。</h5> ",
+'httpAuthTabDescription':	"<p>HTTP 認証は HTML の基本機能を使ってブラウザからユーザー名とパスワードでログインする方式です。</p> <p>すでに主流ではありませんが、またプライベートなサイトなどで使われています。 HTTP 認証が必要なサイトにアクセスしようとすると、ブラウザがポップアップウィンドウを開いてユーザー名とパスワードの入力を要求してきます。</p> <p>残念ながら、 Clipperz のブックマークレットは HTTP 認証には対応していません。 しかし、ダイレクトログインを設定する方法はあります。</p> <h3>HTTP 認証サイトでのダイレクトログイン設定方法</h3> <ol> <li> <p>サイトの URL とユーザー名、パスワードを新規カードに登録します。</p> </li> <li> <p>下記の設定をコピーして、カード編集画面の「ダイレクトログイン設定」のセクションに貼り付けます。</p> </li> <li> <p>「新規ダイレクトログイン追加｣ボタンをクリックして、 URL とユーザー名、パスワードを入力して保存します。</p> </li> </ol> <h5><a href=\"http://support.microsoft.com/kb/834489\" target=\"_blank\">警告：インターネットエクスプローラは HTTP 認証に対応していません。</a> </h5> ",
+'mainPanelDirectLoginBlockLabel':	"ダイレクトログイン",
+'directLinkReferenceShowButtonLabel':	"表示",
+'mainPanelDirectLoginBlockDescription':	"<p>ダイレクトログインを設定してユーザー名やパスワードを入力することなくログインできるようにしましょう。</p> <p>ダイレクトログインでさらにセキュリティを強化するために：</p> <ul> <li> <p>より複雑なパスワードを設定しましょう</p> </li> <li> <p>推測されやすい同じパスワードを複数のサイトで使わないようにしましょう。</p> </li> </ul> <p>ブックマークレットを使うと簡単に設定できます。</p><a href=\"http://www.clipperz.com/support/user_guide/direct_logins\" target=\"_blank\">ダイレクトログインに関する詳しい情報</a> ",
+'mainPanelRecordsBlockLabel':	"カード",
+'mainPanelAddRecordButtonLabel':	"新規カード追加",
+'mainPanelRemoveRecordButtonLabel':	"カード削除",
+'mainPanelRecordFilterBlockAllLabel':	"すべて",
+'mainPanelRecordFilterBlockTagsLabel':	"タグ",
+'mainPanelRecordFilterBlockSearchLabel':	"検索",
+'recordDetailNoRecordAtAllTitle':	"Clipperz へようこそ",
+'recordDetailNoRecordAtAllDescription':	"<h5>まず最初にカードを追加しましょう。</h5> <p>カードはパスワードやその他の重要な情報を保管するためのシンプルでフレキシブルなフォームです。</p> <p>カードにはウェブサイトのログインパスワード、自転車の鍵の番号、クレジットカードの番号など何でも記入できます。</p> <h5>ブックマークレットを活用しましょう。</h5> <p>まずは簡単にカードを追加できるブックマークレットをインストールしましょう。</p> <p>ブックマークレットのタブをクリックしてインストール方法と利用方法を確認しましょう。</p> <p> </p> <p>ブックマークレットをインストールしたら Clipperz を活用しましょう。</p> <p> </p><a href=\"http://www.clipperz.com/support/user_guide/managing_cards\" target=\"_blank\">カードに関する詳しい情報</a> ",
+'newRecordWizardTitleBox':	"<h5>テンプレート選択</h5> <p>カードはシンプルでパスワードや重要な情報を何でも保存できる柔軟性があります。</p> <p>まずはテンプレートを選んでください。  カードはいつでも自由に変更できます。</p> ",
+'newRecordWizardBookmarkletConfigurationTitle':	"ダイレクトログイン",
+'newRecordWizardBookmarkletConfigurationDescription':	"<p>ブックマークレットが生成したコードを下に貼り付けてください。</p> <p>ダイレクトログイン情報を含む新しいカードが作成されます。</p> ",
+'newRecordWizardCreateButtonLabel':	"作成",
+'newRecordWizardCancelButtonLabel':	"キャンセル",
+'donateSplashPanelTitle':	"Clipperz のために今すぐ寄付しよう",
+'donateSplashPanelDescription':	"<p>寄付する理由:</p> <ul> <li> <p>新機能追加をサポートします</p> </li> <li> <p>Clipperz を無料に保ちます</p> </li> <li> <p>開発陣の仕事に感謝します</p> </li> </ul> <p>詳しくは寄付のページをごらんください .</p> <p><b>寄付しますか？</b> </p> ",
+'donateCloseButtonLabel':	"あとでする",
+'donateDonateButtonLabel':	"はい",
+'recordTemplates':	{
+	'WebAccount':	{
+		'title':	"ウェブパスワード",
+		'description':	"<p>ログイン情報用のシンプルなカードです。</p> ",
+		'fields':	{
+			'URL':	"ウェブアドレス",
+			'TXT':	"ユーザー名またはメールアドレス",
+			'PWD':	"パスワード"
+		}
+	},
+	'BankAccount':	{
+		'title':	"銀行口座",
+		'description':	"<p>口座番号とオンラインバンキング情報用のカードです。</p> ",
+		'fields':	{
+			'TXT':	"銀行",
+			'TXT':	"口座番号",
+			'URL':	"銀行サイト",
+			'TXT':	"オンラインバンキング ID",
+			'PWD':	"オンラインバンキングパスワード"
+		}
+	},
+	'CreditCard':	{
+		'title':	"クレジットカード",
+		'description':	"<p>クレジットカードに関するあらゆる情報を保管できます。</p> ",
+		'fields':	{
+			'TXT':	"種類（Visa 、 AMEX など）",
+			'TXT':	"番号",
+			'TXT':	"所有者名",
+			'TXT':	"有効期限",
+			'TXT':	"CVV2 番号",
+			'PWD':	"暗証番号",
+			'URL':	"カード会社サイト",
+			'TXT':	"ユーザー名",
+			'PWD':	"パスワード"
+		}
+	},
+	'AddressBookEntry':	{
+		'title':	"アドレス帳",
+		'description':	"<p>Clipperz はプライベートなアドレス帳としても機能します。 このテンプレートを利用して簡単に新しい住所を追加できます。</p> ",
+		'fields':	{
+			'TXT':	"名前",
+			'TXT':	"メールアドレス",
+			'TXT':	"電話番号",
+			'TXT':	"携帯電話",
+			'ADDR':	"住所"
+		}
+	},
+	'Custom':	{
+		'title':	"カスタムカード",
+		'description':	"<p>カスタムカードを使えばどんな情報でも保管できます。</p> ",
+		'fields':	{
+			'TXT':	"ラベル 1",
+			'TXT':	"ラベル 2",
+			'TXT':	"ラベル 3"
+		}
+	}
+},
+'recordFieldTypologies':	{
+	'TXT':	{
+		'description':	"テキスト入力欄",
+		'shortDescription':	"テキスト"
+	},
+	'PWD':	{
+		'description':	"通常は非表示になるテキスト入力欄",
+		'shortDescription':	"パスワード"
+	},
+	'URL':	{
+		'description':	"表示モードではクリックできる URL 入力欄",
+		'shortDescription':	"ウェブアドレス"
+	},
+	'DATE':	{
+		'description':	"日付入力欄",
+		'shortDescription':	"日付"
+	},
+	'ADDR':	{
+		'description':	"Google マップ用の URL に似た文字列",
+		'shortDescription':	"住所"
+	},
+	'CHECK':	{
+		'description':	"チェックボックスの詳細",
+		'shortDescription':	"チェックボックス"
+	},
+	'RADIO':	{
+		'description':	"ラジオボタンの詳細",
+		'shortDescription':	"ラジオボタン"
+	},
+	'SELECT':	{
+		'description':	"セレクトリストの詳細",
+		'shortDescription':	"セレクトリスト"
+	}
+},
+'newRecordPanelGeneralExceptionTitle':	"エラー",
+'newRecordPanelGeneralExceptionMessage':	"コードが不正です。 ブックマークレットを確認してもう一度やり直してください。",
+'newRecordPanelWrongBookmarkletVersionExceptionTitle':	"エラー",
+'newRecordPanelWrongBookmarkletVersionExceptionMessage':	"古いバージョンのブックマークレットで生成されたコードです。 ブックマークレットを更新してやり直してください。",
+'newRecordPanelExceptionPanelCloseButtonLabel':	"キャンセル",
+'mainPanelDeletingRecordPanelConfirmationTitle':	"カード削除中",
+'mainPanelDeleteRecordPanelConfirmationText':	"本当に削除しますか？",
+'mainPanelDeleteRecordPanelConfirmButtonLabel':	"はい",
+'mainPanelDeleteRecordPanelDenyButtonLabel':	"いいえ",
+'mainPanelDeletingRecordPanelInitialTitle':	"カード削除中",
+'mainPanelDeletingRecordPanelInitialText':	"---",
+'mainPanelDeletingRecordPanelCompletedText':	"完了",
+'deleteRecordPanelCollectRecordDataMessageTitle':	"カード削除",
+'deleteRecordPanelCollectRecordDataMessageText':	"カードリスト更新中",
+'deleteRecordPanelEncryptUserDataMessageTitle':	"カード削除",
+'deleteRecordPanelEncryptUserDataMessageText':	"カードヘッダ暗号化",
+'deleteRecordPanelSendingDataToTheServerMessageTitle':	"カード削除",
+'deleteRecordPanelSendingDataToTheServerMessageText':	"送信中",
+'deleteRecordPanelUpdatingTheInterfaceMessageTitle':	"カード削除",
+'deleteRecordPanelUpdatingTheInterfaceMessageText':	"更新中",
+'recordDetailNoRecordSelectedTitle':	"カードが選択されていません",
+'recordDetailNoRecordSelectedDescription':	"<p>左のリストからカードを選択してください。</p> ",
+'recordDetailLoadingRecordMessage':	"データ受信中",
+'recordDetailDecryptingRecordMessage':	"データ復元中",
+'recordDetailLoadingRecordVersionMessage':	"最新情報を受信中",
+'recordDetailDecryptingRecordVersionMessage':	"最新情報を復元中",
+'recordDetailLoadingErrorMessageTitle':	"受信エラー",
+'recordDetailNotesLabel':	"ノート",
+'recordDetailLabelFieldColumnLabel':	"ラベル",
+'recordDetailDataFieldColumnLabel':	"データ",
+'recordDetailTypeFieldColumnLabel':	"タイプ",
+'recordDetailSavingChangesMessagePanelInitialTitle':	"保存中",
+'recordDetailSavingChangesMessagePanelInitialText':	"---",
+'recordDetailRemoveFieldButtonLabel':	"-",
+'recordDetailAddFieldButtonLabel':	"フィールド追加",
+'recordDetailPasswordFieldHelpLabel':	"パスワードをコピーするには星マークをクリックして ctrl-C をタイプします",
+'recordDetailPasswordFieldScrambleLabel':	"隠す",
+'recordDetailPasswordFieldUnscrambleLabel':	"可視化",
+'recordDetailDirectLoginBlockTitle':	"ダイレクトログイン",
+'recordDetailNewDirectLoginDescription':	"<p>ダイレクトログイン設定</p> ",
+'recordDetailDirectLoginBlockNoDirectLoginConfiguredDescription':	"<p>オンラインサービスのログイン情報を含んでいますか？</p> <p>ブックマークレットを使ってダイレクトログインを設定しましょう！</p> ",
+'recordDetailDeleteDirectLoginButtonLabel':	"-",
+'recordDetailAddNewDirectLoginButtonLabel':	"新規ダイレクトログイン追加",
+'recordDetailEditButtonLabel':	"編集",
+'recordDetailSaveButtonLabel':	"保存",
+'recordDetailCancelButtonLabel':	"キャンセル",
+'newRecordTitleLabel':	"_新規カード_",
+'newDirectLoginLabelSuffix':	"",
+'recordSaveChangesPanelCollectRecordInfoMessageTitle':	"カード保存",
+'recordSaveChangesPanelCollectRecordInfoMessageText':	"更新中",
+'recordSaveChangesPanelEncryptUserDataMessageTitle':	"カード保存",
+'recordSaveChangesPanelEncryptUserDataMessageText':	"カードヘッダ暗号化",
+'recordSaveChangesPanelEncryptRecordDataMessageTitle':	"カード保存",
+'recordSaveChangesPanelEncryptRecordDataMessageText':	"カードデータ暗号化",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageTitle':	"カード保存",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageText':	"バージョンデータ暗号化",
+'recordSaveChangesPanelSendingDataToTheServerMessageTitle':	"カード保存",
+'recordSaveChangesPanelSendingDataToTheServerMessageText':	"カード送信中",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageTitle':	"カード保存",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageText':	"更新中",
+'passwordGeneratorPanelTitle':	"パスワードジェネレータ",
+'passwordGeneratorPanelOkLabel':	"OK",
+'passwordGeneratorPanelCancelLabel':	"キャンセル",
+'passwordGeneratorLowercaseLabel':	"abc",
+'passwordGeneratorUppercaseLabel':	"ABC",
+'passwordGeneratorNumberLabel':	"012",
+'passwordGeneratorSymbolLabel':	"@#$",
+'passwordGeneratorLengthLabel':	"文字数:",
+//'DWRUtilLoadingMessage':	"ロード中 ...",
+'comingSoon':	"近日登場 ...",
+'panelCollectingEntryopyMessageText':	"整頓中",
+'directLoginConfigurationCheckBoxFieldSelectedValue':	"はい",
+'directLoginConfigurationCheckBoxFieldNotSelectedValue':	"いいえ",
+'importFormats':	{
+	'CSV':	{
+		'label':	"CSV",
+		'description':	"<p>広く普及しているフォーマットです。 いくつかのパスワードマネージャは CSV でのエクスポートに対応しています。</p>"
+	},
+	'Excel':	{
+		'label':	"エクセル",
+		'description':	"<p>マイクロソフトの有名な表計算ソフトです。 エクセルのファイルでパスワードを保存することは広く行われていますがおすすめできません。</p>"
+	},
+	'KeePass':	{
+		'label':	"KeePass",
+		'description':	"<p>パスワードマネージャ KeePass で生成されるテキストファイルです。</p>"
+	},
+	'PasswordPlus':	{
+		'label':	"Password Plus",
+		'description':	"<p>パスワードマネージャ Password Plus で生成される CSV ファイルです。</p>"
+	},
+	'Roboform':	{
+		'label':	"RoboForm",
+		'description':	"<p>パスワードマネージャ Roboform で印刷用に表示される HTML ファイルです。</p>"
+	},
+	'ClipperzExport':	{
+		'label':	"JSON",
+		'description':	"<p>Clipperz で生成されるフォーマットです。 ダイレクトログインを含むすべての情報が含まれます。</p>"
+	}
+},
+'Clipperz_ImportWizard_Title':	"JSON インポート",
+'importOptions_clipperz_description':	"<p>Clipperz で生成された JSON ファイルをテキストエディタで開きます。 次に下のテキストエリアにファイルの内容をコピーします。</p> ",
+'CSV_ImportWizard_Title':	"CSV インポート",
+'importOptions_csv_description_':	"<p>CSV ファイルをテキストエディタで開きます。 下のテキストエリアにファイルの内容をコピーします。</p> <p>区切り記号などを選択します。</p> ",
+'Excel_ImportWizard_Title':	"エクセルインポート",
+'importOptions_excel_description_':	"<p>エクセルでファイルを開いてインポートしたいセルを選択します。 次に下のテキストエリアに選択したセルをコピーします。</p> ",
+'KeePass_ImportWizard_Title':	"KeePass インポート",
+'importOptions_keePass_description_':	"<p>KeePas で生成されたファイルをテキストエディタで開きます。 次に下のテキストエリアにファイルの内容をコピーします。</p> ",
+'PasswordPlus_ImportWizard_Title':	"Password Plus インポート",
+'importOptions_passwordPlus_description':	"<p>Password Plus で生成された CSV ファイルをテキストエディタで開きます。 下のテキストエリアにファイルの内容をコピーします。</p> ",
+'RoboForm_ImportWizard_Title':	"RoboForm インポート",
+'importOptions_roboForm_description':	"<p>RoboForm で生成された HTML ファイルをテキストエディタで開きます。 次に下のテキストエリアにファイルの内容をコピーします。</p> ",
+'importData_parsingDataTitle':	"インポート",
+'importData_parsingDataText':	"分析中 ...",
+'importData_previewingDataTitle':	"インポート",
+'importData_previewingDataText':	"変換中 ...",
+'importData_processingDataTitle':	"インポート",
+'importData_processingDataText':	"カード作成中 ...",
+'ImportWizard':	{
+	'EDIT':	"編集",
+	'PREVIEW':	"プレビュー",
+	'IMPORT':	"インポート",
+	'KEEPASS_SETTINGS':	"設定",
+	'CSV_EDIT':	"貼り付け",
+	'CSV_COLUMNS':	"列",
+	'CSV_HEADER':	"ラベル",
+	'CSV_TITLE':	"タイトル",
+	'CSV_NOTES':	"ノート",
+	'CSV_FIELDS':	"タイプ",
+	'EXCEL_EDIT':	"編集"
+},
+'CSV_ImportWizard_Columns':	"<p>インポートする列を選択してください。</p> ",
+'CSV_ImportWizard_Header':	"<p>最初の行にラベルが含まれている場合、下のチェックボックスをチェックしてください。</p> ",
+'CSV_ImportWizard_Header_Settings_firstRowHeaderLabel':	"先頭行をラベルとして利用する",
+'CSV_ImportWizard_Title':	"<p>カードのタイトルになる列を選択してください。 （必須）</p>",
+'CSV_ImportWizard_Notes':	"<p>ノートに相当する列を選択してください。 （オプション）</p> ",
+'CSV_ImportWizard_Notes_Settings_noSelectionLabel':	"ノートは利用できません",
+'CSV_ImportWizard_Fields':	"<p>それぞれの列のデータタイプをドロップダウンリストから選択してください。</p> ",
+'CSV_ImportWizard_Fields_MissingLabelWarning':	"ラベルがありません",
+'importData_importConfirmation_title':	"インポート",
+'importData_importConfirmation_text':	"__numberOfRecords__ 枚のカードをインポートしますか？",
+'WELCOME_BACK':	"おかえりなさい",
+'currentConnectionText':	"あなたの利用 IP アドレスは __ip__, です。 country__, から __operatingSystem__ 版 __browser__ を利用しています。",
+'latestConnectionText':	"前回の利用は __elapsedTimeDescription__ (__time__)、IP アドレスは __ip__, でした。 country__ から __operatingSystem__ 版 __browser__ を利用しました。",
+'fullLoginHistoryLinkLabel':	"ログイン履歴を詳しく見る",
+'elapsedTimeDescriptions':	{
+	'MORE_THAN_A_MONTH_AGO':	"1 か月以上前",
+	'MORE_THAN_A_WEEK_AGO':	"1 週間以上前",
+	'MORE_THAN_*_WEEKS_AGO':	"elapsed__ 週間以上前",
+	'YESTERDAY':	"昨日",
+	'*_DAYS_AGO':	"__elapsed__ 日前",
+	'ABOUT_AN_HOUR_AGO':	"約 1 時間前",
+	'*_HOURS_AGO':	"__elapsed__ 時間前",
+	'JUST_A_FEW_MINUTES_AGO':	"直前",
+	'ABOUT_*_MINUTES_AGO':	"約 __elapsed__ 分前"
+},
+'unknown_ip':	"不明",
+'countries':	{
+	'--':	"不明",
+	'AD':	"アンドラ",
+	'AE':	"アラブ首長国連邦",
+	'AF':	"アフガニスタン",
+	'AG':	"アンティグアバーブーダ",
+	'AI':	"アングイラ",
+	'AL':	"アルバニア",
+	'AM':	"アルメニア",
+	'AN':	"オランダ アンティル諸島",
+	'AO':	"アンゴラ",
+	'AP':	"その他のアジアパシフィック地域",
+	'AR':	"アルゼンチン",
+	'AS':	"米国領サモア",
+	'AT':	"オーストリア",
+	'AU':	"オーストラリア",
+	'AW':	"アルーバ",
+	'AX':	"アーラント諸島",
+	'AZ':	"アゼルバイジャン",
+	'BA':	"ボスニア・ヘルツェゴビナ",
+	'BB':	"バルバドス",
+	'BD':	"バングラデシュ",
+	'BE':	"ベルギー",
+	'BF':	"ブルキナファソ",
+	'BG':	"ブルガリア",
+	'BH':	"バーレーン",
+	'BI':	"ブルンジ",
+	'BJ':	"ベナン",
+	'BN':	"ブルネイダルサラーム",
+	'BO':	"ボリビア",
+	'BR':	"ブラジル",
+	'BS':	"バハマ",
+	'BT':	"ブータン",
+	'BW':	"ボツワナ",
+	'BY':	"ベラルーシ",
+	'BZ':	"ベリーズ",
+	'CA':	"カナダ",
+	'CD':	"コンゴ民主共和国",
+	'CF':	"中央アフリカ共和国",
+	'CH':	"スイス",
+	'CI':	"コートジボワール",
+	'CK':	"クック諸島",
+	'CL':	"チリ",
+	'CM':	"カメルーン",
+	'CN':	"中国",
+	'CO':	"コロンビア",
+	'CR':	"コスタリカ",
+	'CS':	"セルビア・モンテネグロ",
+	'CU':	"キューバ",
+	'CY':	"キプロス",
+	'CZ':	"チェコ共和国",
+	'DE':	"ドイツ",
+	'DJ':	"ジブチ",
+	'DK':	"デンマーク",
+	'DO':	"ドミニカ共和国",
+	'DZ':	"アルジェリア",
+	'EC':	"エクアドル",
+	'EE':	"エストニア",
+	'EG':	"エジプト",
+	'ER':	"エリトリア",
+	'ES':	"スペイン",
+	'ET':	"エチオピア",
+	'EU':	"欧州連合",
+	'FI':	"フィンランド",
+	'FJ':	"フィジー",
+	'FM':	"ミクロネシア連邦邦国",
+	'FR':	"フランス",
+	'GA':	"ガボン",
+	'GB':	"英国",
+	'GD':	"グラナダ",
+	'GE':	"グルジア",
+	'GF':	"仏領ギアナ",
+	'GG':	"ガーンジー",
+	'GH':	"ガーナ",
+	'GI':	"ジブラルタル",
+	'GL':	"グリーンランド",
+	'GP':	"グアドロープ",
+	'GR':	"ギリシャ",
+	'GT':	"カタロニア",
+	'GU':	"グアム",
+	'GW':	"ギニアビサウ",
+	'GY':	"ガイアナ",
+	'HK':	"香港",
+	'HN':	"ホンデュラス",
+	'HR':	"クロアチア",
+	'HT':	"ハイチ",
+	'HU':	"ハンガリー",
+	'ID':	"インドネシア",
+	'IE':	"アイルランド",
+	'IL':	"イスラエル",
+	'IM':	"マン島",
+	'IN':	"インド",
+	'IO':	"英領インド洋植民地",
+	'IQ':	"イラク",
+	'IR':	"イラン・イスラム共和国",
+	'IS':	"アイスランド",
+	'IT':	"イタリア",
+	'JE':	"ジャージー",
+	'JO':	"ヨルダン",
+	'JP':	"日本",
+	'KE':	"ケニア",
+	'KG':	"キルギスタン",
+	'KH':	"カンボジア",
+	'KI':	"キリバス",
+	'KN':	"セントキッツネヴィス",
+	'KR':	"大韓民国 (韓国)",
+	'KW':	"クウェート",
+	'KY':	"カイマン諸島",
+	'KZ':	"カザフスタン",
+	'LA':	"ラオス人民民主共和国",
+	'LB':	"レバノン",
+	'LC':	"セントルシア",
+	'LI':	"リヒテンシュタイン",
+	'LK':	"スリランカ",
+	'LR':	"リベリア",
+	'LS':	"レソト",
+	'LT':	"リトアニア",
+	'LU':	"ルクセンブルグ",
+	'LV':	"ラトビア",
+	'LY':	"リビア・アラブ・Jamahiriya",
+	'MA':	"モロッコ",
+	'MC':	"モナコ",
+	'MD':	"モルドバ共和国",
+	'MG':	"マダガスカル",
+	'MH':	"マーシャル諸島",
+	'MK':	"マケドニア共和国",
+	'ML':	"マリ",
+	'MM':	"ミャンマー",
+	'MN':	"モンゴル",
+	'MO':	"マカオ",
+	'MP':	"北マリアナ諸島",
+	'MR':	"モーリタニア",
+	'MT':	"マルタ",
+	'MU':	"モーリシャス",
+	'MV':	"モルジヴ",
+	'MW':	"マラウイ",
+	'MX':	"メキシコ",
+	'MY':	"マレーシア",
+	'MZ':	"モザンビーク",
+	'NA':	"ナミビア",
+	'NC':	"ニューカレドニア",
+	'NF':	"ノーフォーク諸島",
+	'NG':	"ナイジェリア",
+	'NI':	"ニカラグア",
+	'NL':	"オランダ",
+	'NO':	"ノルウェー",
+	'NP':	"ネパール",
+	'NR':	"ナウル",
+	'NU':	"ニウエ",
+	'NZ':	"ニュージーランド",
+	'OM':	"オマーン",
+	'PA':	"パナマ",
+	'PE':	"ペルー",
+	'PF':	"仏領ポリネシア",
+	'PG':	"パプアニューギニア",
+	'PH':	"フィリピン",
+	'PK':	"パキスタン",
+	'PL':	"ポーランド",
+	'PR':	"プエルトリコ",
+	'PS':	"パレスチナ占領地区",
+	'PT':	"ポルトガル",
+	'PW':	"パラオ",
+	'PY':	"パラグアイ",
+	'QA':	"カタール",
+	'RO':	"ルーマニア",
+	'RS':	"セルビア",
+	'RU':	"ロシア連邦",
+	'RW':	"ルワンダ",
+	'SA':	"サウジアラビア",
+	'SB':	"ソロモン諸島",
+	'SC':	"セイシェル",
+	'SD':	"スーダン",
+	'SE':	"スウェーデン",
+	'SG':	"シンガポール",
+	'SI':	"スロベニア",
+	'SK':	"スロバキア",
+	'SL':	"シエラレオネ",
+	'SM':	"サンマリノ",
+	'SN':	"セネガル",
+	'SR':	"スリナム",
+	'SV':	"エルサルバドル",
+	'SY':	"シリアアラブ共和国",
+	'SZ':	"スワジランド",
+	'TC':	"タークスアンドケーコス諸島",
+	'TG':	"トーゴ",
+	'TH':	"タイ",
+	'TJ':	"タジキスタン",
+	'TM':	"トルクメニスタン",
+	'TN':	"チュニジア",
+	'TO':	"トンガ",
+	'TR':	"トルコ",
+	'TT':	"トリニダードトバコ",
+	'TV':	"ツヴァル",
+	'TW':	"中国領・台湾",
+	'TZ':	"タニザニア連合共和国",
+	'UA':	"ウクライナ",
+	'UG':	"ウガンダ",
+	'US':	"アメリカ合衆国",
+	'UY':	"ウルグアイ",
+	'UZ':	"ウズベキスタン",
+	'VA':	"聖庁 (バチカン市国)",
+	'VE':	"ベネズェラ",
+	'VG':	"英国ヴァージン諸島",
+	'VI':	"米国ヴァージン諸島",
+	'VN':	"ベトナム",
+	'VU':	"バヌアツ",
+	'WF':	"ワリーエフトゥーナ諸島",
+	'WS':	"サモア",
+	'YE':	"イエメン",
+	'ZA':	"南アフリカ",
+	'ZM':	"ザンビア",
+	'ZW':	"ジンバブエ",
+	'ZZ':	"Reserved"
+},
+'browsers':	{
+	'UNKNOWN':	"不明",
+	'MSIE':	"インターネットエクスプローラー",
+	'FIREFOX':	"Firefox",
+	'OPERA':	"Opera",
+	'SAFARI':	"Safari",
+	'OMNIWEB':	"OmniWeb",
+	'CAMINO':	"Camino"
+},
+'operatingSystems':	{
+	'UNKNOWN':	"不明",
+	'WINDOWS':	"ウィンドウズ",
+	'MAC':	"Mac",
+	'LINUX':	"Linux",
+	'IPHONE':	"iPhone",
+	'MOBILE':	"携帯電話",
+	'OPENBSD':	"OpenBSD",
+	'FREEBSD':	"FreeBSD",
+	'NETBSD':	"NetBSD"
+},
+'calendarStrings':	{
+	'months':	{
+		'0':	"1 月",
+		'1':	"2 月",
+		'2':	"3 月",
+		'3':	"4 月",
+		'4':	"5",
+		'5':	"6 月",
+		'6':	"7 月",
+		'7':	"8 月",
+		'8':	"9 月",
+		'9':	"10 月",
+		'10':	"11 月",
+		'11':	"12 月"
+	},
+	'shortMonths':	{
+		'0':	"1",
+		'1':	"2",
+		'2':	"3",
+		'3':	"4",
+		'4':	"5",
+		'5':	"6",
+		'6':	"7",
+		'7':	"8",
+		'8':	"9",
+		'9':	"10",
+		'10':	"11",
+		'11':	"12"
+	},
+	'days':	{
+		'0':	"日曜日",
+		'1':	"月曜日",
+		'2':	"火曜日",
+		'3':	"水曜日",
+		'4':	"木曜日",
+		'5':	"金曜日",
+		'6':	"土曜日"
+	},
+	'shortDays':	{
+		'0':	"日",
+		'1':	"月",
+		'2':	"火",
+		'3':	"水",
+		'4':	"木",
+		'5':	"金",
+		'6':	"土"
+	},
+	'veryShortDays':	{
+		'0':	"月",
+		'1':	"月",
+		'2':	"日",
+		'3':	"金",
+		'4':	"木",
+		'5':	"金",
+		'6':	"水"
+	},
+	'amDesignation':	"土",
+	'pmDesignation':	"午後"
+},
+'fullDate_format':	"l, F d, Y H:i:s",
+
+__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_pt-BR.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_pt-BR.js
new file mode 100644
index 0000000..db6c2f6
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_pt-BR.js
@@ -0,0 +1,478 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+Clipperz.PM.Strings.Languages['pt-BR'.toLowerCase()] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+'clipperzServiceDescriptionConfig':	"<h2>Guarde com você!</h2> <ul> <li> <h3>Clipperz é:</h3> <ul> <li> <p>um simples e seguro gerenciador de senhas</p> </li> <li> <p>uma efetiva solução com uma única assinatura</p> </li> <li> <p>um cofre digital para suas informações confidenciais</p> </li> </ul> </li> <li> <h3>Com Clipperz você pode:</h3> <ul> <li> <p>guardar e gerenciar suas senhas e credenciais online</p> </li> <li> <p>logar em seus serviços web sem precisar entrar com nenhum nome de usuário ou senha</p> </li> <li> <p>proteger todos os seus dados sensíveis: códigos de alarme, PINs, números de cartão de crédito, &hellip;</p> </li> <li> <p>compartilhar segredos com membros da família e associados (em breve)</p> </li> </ul> </li> <li> <h3>Clipperz proporciona:</h3> <ul> <li> <p>anonimato completo e gratuito</p> </li> <li> <p>acesso a qualquer hora em qualquer computador</p> </li> <li> <p>sem software ou download e nada que instalar</p> </li> <li> <p>evite guardar seus segredos em seu PC ou papel</p> </li> </ul> </li> <li> <h3>Segurança Clipperz:</h3> <ul> <li> <p>seus segredos são codificados localmente por seu navegador antes de ser enviado para Clipperz</p> </li> <li> <p>a chave de codificação é uma senha que só você conhece</p> </li> <li> <p>Clipperz armazena apenas seus dados confidenciais codificados, nunca acessando os dados originais</p> </li> <li> <p>Clipperz é construído a partir de esquemas de codificação padrão, ou seja, nada é exclusivo ou caseiro</p> </li> <li> <p>você pode revisar o código a qualquer momento, mas você não precisa conhecer nada sobre criptograia para ser um usuário feliz!</p> </li> </ul> </li> <li> <a href=\"http://www.clipperz.com\" target=\"_blank\">Saiba mais</a> </li> </ul> ",
+'loginFormTitle':	"entre sua conta Clipperz",
+'loginFormUsernameLabel':	"nome do usuário",
+'loginFormPassphraseLabel':	"frase chave",
+'loginFormDontHaveAnAccountLabel':	"não tem uma conta?",
+'loginFormCreateOneLabel':	"criar uma",
+'loginFormForgotYourCredentialsLabel':	"esqueceu suas credenciais?",
+'loginFormAarghThatsBadLabel':	"xiiiii! isso é não é bom!",
+'loginFormAfraidOfMaliciousScriptsLabel':	"medo de scripts maliciosos?",
+'loginFormVerifyTheCodeLabel':	"verifique o código",
+'loginFormButtonLabel':	"Entrar",
+'loginFormOneTimePasswordCheckboxLabel':	"use uma frase chave descartável",
+'loginPanelSwithLanguageDescription':	"<h5>Mudar para sua linguagem preferida</h5> ",
+'browserCompatibilityDescription':	"<p>Tenha uma experiência melhor e mais segura com Clipperz, utilizando o Firefox. No entanto, Clipperz funciona bem também em Opera e MS Internet Explorer!</p> ",
+'OTPloginMessagePanelInitialTitle':	"Acessando usando a frase chave descartável",
+'OTPloginMessagePanelInitialText':	"Enviando credenciais descartáveis ...",
+'OTPloginMessagePanelLoadingTitle':	"Acessando usando a frase chave descartável",
+'OTPloginMessagePanelLoadingText':	"Buscando informação de autenticação codificada no servidor ...",
+'OTPloginMessagePanelProcessingTitle':	"Acessando usando a frase chave descartável",
+'OTPloginMessagePanelProcessingText':	"Decodificação local da informação de autenticação ...",
+'loginMessagePanelInitialTitle':	"Entrando ...",
+'loginMessagePanelInitialButtonLabel':	"Cancelar",
+'loginMessagePanelConnectedTitle':	"Conectado",
+'loginMessagePanelConnectedText':	"Concluído",
+'loginMessagePanelFailureTitle':	"Erro",
+'loginMessagePanelFailureText':	"Ocorreu uma falha",
+'loginMessagePanelFailureButtonLabel':	"Fechar",
+'connectionLoginSendingCredentialsMessageTitle':	"Verificando credenciais",
+'connectionLoginSendingCredentialsMessageText':	"Enviando credenciais",
+'connectionLoginCredentialsVerificationMessageTitle':	"Verificando credenciais",
+'connectionLoginCredentialsVerificationMessageText':	"Realizando autenticação SRP",
+'connectionLoginDoneMessageTitle':	"Verificando credenciais",
+'connectionLoginDoneMessageText':	"Conectado",
+'userLoginPanelUpgradingUserCredentialsMessageTitle':	"Verificando credenciais",
+'userLoginPanelUpgradingUserCredentialsMessageText':	"Upgrade de suas credenciais para um novo esquema de autenticação",
+'userLoginPanelConnectedMessageTitle':	"Usuário autenticado",
+'userLoginPanelConnectedMessageText':	"Logado com sucesso em",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageTitle':	"Verificando credenciais",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageText':	"Tentando esquema antigo de autenticação",
+'userLoginPanelLoadingUserDataMessageTitle':	"Usuário autenticado",
+'userLoginPanelLoadingUserDataMessageText':	"Baixando cabeçalhos de cartão codificados de Clipperz",
+'userLoginPanelDecryptingUserDataMessageTitle':	"Usuário autenticado",
+'userLoginPanelDecryptingUserDataMessageText':	"Descrição local de cabeçalhos dos cartões",
+'userLoginPanelDecryptingUserStatisticsMessageTitle':	"Usuário autenticado",
+'userLoginPanelDecryptingUserStatisticsMessageText':	"Descrição local de estatísticas de uso",
+'splashAlertTitle':	"Bem-vindo ao Clipperz!",
+'splashAlertText':	"<p>Alguns avisos de segurança</p> <ul> <li> <p>Guardar suas informações no Clipperz é tão seguro quanto a frase chave que você escolher para protege-los. Ninguém pode acessá-los sem essa frase chave.</p> </li> <li> <p>Se você vai utlizar Clipperz para armazenar suas informações confidenciais e críticas, escolha uma frase chave difícil de ser descoberta. Quanto mais longa, melhor!</p> </li> <li> <p>Clipperz não será capaz de recuperar frase chave perdidas!</p> </li> </ul> <p>Para mais informações, por favor vá até <a href=\"http://www.clipperz.com\" target=\"_blank\">Clipperz</a> website.</p> ",
+'splashAlertCloseButtonLabel':	"Ok",
+'registrationFormTitle':	"crie sua conta",
+'registrationFormUsernameLabel':	"nome do usuário",
+'registrationFormPassphraseLabel':	"frase chave",
+'registrationFormRetypePassphraseLabel':	"entre novamente sua frase chave",
+'registrationFormSafetyCheckLabel':	"Eu compreendo que Clipperz não será capaz de recuperar senhas perdidas.",
+'registrationFormTermsOfServiceCheckLabel':	"Eu li e concordo com os <a href='http://www.clipperz.com/terms_of_service' target='_blank'>Termos do Serviço</a>.",
+'registrationFormDoYouAlreadyHaveAnAccountLabel':	"você já tem uma conta?",
+'registrationFormSimplyLoginLabel':	"login simples",
+'registrationFormButtonLabel':	"Registrar",
+'registrationFormWarningMessageNotMatchingPassphrases':	"Suas frases chaves não conferem, por favor tente novamente.",
+'registrationFormWarningMessageSafetyCheckNotSelected':	"Por favor leia e confira todos os campos abaixo.",
+'registrationFormWarningMessageTermsOfServiceCheckNotSelected':	"Você precisa concordar com os Termos do Serviço.",
+'registrationMessagePanelInitialTitle':	"Criando conta ...",
+'registrationMessagePanelInitialText':	"---",
+'registrationMessagePanelInitialButtonLabel':	"Cancelar",
+'registrationMessagePanelRegistrationDoneTitle':	"Registro",
+'registrationMessagePanelRegistrationDoneText':	"Concluído",
+'registrationMessagePanelFailureTitle':	"Registrou falhou",
+'registrationMessagePanelFailureButtonLabel':	"Fechar",
+'connectionRegistrationSendingRequestMessageText':	"Verificando credenciais",
+'connectionRegistrationSendingCredentialsMessageText':	"Enviando credenciais",
+'registrationSplashPanelTitle':	"Informe de segurança",
+'registrationSplashPanelDescription':	"<p>Essas são suas credenciais Clipperz, cuide delas com cuidado. Clipperz nunca vai mostrar seu nome de usuário e frase chave uma outra vez!</p> ",
+'registrationSplashPanelUsernameLabel':	"nome de usuário",
+'registrationSplashPanelPassphraseLabel':	"frase chave",
+'registrationSplashPanelShowPassphraseButtonLabel':	"mostrar frase chave",
+'donateHeaderLinkLabel':	"doar",
+'creditsHeaderLinkLabel':	"créditos",
+'feedbackHeaderLinkLabel':	"feedback",
+'helpHeaderLinkLabel':	"ajuda",
+'forumHeaderLinkLabel':	"fórum",
+'recordMenuLabel':	"cartões",
+'accountMenuLabel':	"conta",
+'dataMenuLabel':	"dados",
+'contactsMenuLabel':	"contatos",
+'toolsMenuLabel':	"ferramentas",
+'logoutMenuLabel':	"sair",
+'lockMenuLabel':	"bloquear",
+'lockTitle':	"A conta está bloqueada",
+'lockDescription':	"<p>Para desbloquear sua conta, por favor, entre com a frase chave</p> ",
+'unlockButtonLabel':	"desbloquear",
+'changePasswordTabLabel':	"Alterar sua frase chave",
+'changePasswordTabTitle':	"Alterar sua frase chave",
+'changePasswordFormUsernameLabel':	"nome de usuário",
+'changePasswordFormOldPassphraseLabel':	"frase chave antiga",
+'changePasswordFormNewPassphraseLabel':	"frase chave nova",
+'changePasswordFormRetypePassphraseLabel':	"re-inserir frase chave nova",
+'changePasswordFormSafetyCheckboxLabel':	"Eu compreendo que Clipperz não poderá recuperar a frase chave perdida.",
+'changePasswordFormSubmitLabel':	"Alterar frase chave",
+'changePasswordFormWrongUsernameWarning':	"Nome de usuário errado",
+'changePasswordFormWrongPassphraseWarning':	"Frase chave errada",
+'changePasswordFormWrongRetypePassphraseWarning':	"Suas frases chaves não conferem, por favor tente novamente.",
+'changePasswordFormSafetyCheckWarning':	"Por favor leia e confira todos os campos abaixo.",
+'changePasswordFormProgressDialogTitle':	"Alterando credenciais do usuário",
+'changePasswordFormProgressDialogConnectedMessageTitle':	"Conectado",
+'changePasswordFormProgressDialogConnectedMessageText':	"Concluído",
+'changePasswordFormProgressDialogErrorMessageTitle':	"Erro",
+'changePasswordFormProgressDialogErrorMessageText':	"Mudança de credenciais falhou!",
+'changeCredentialsPanelEncryptingDataMessageTitle':	"Alterando sua frase chave",
+'changeCredentialsPanelEncryptingDataMessageText':	"Codificação local de cabeçalho de cartões",
+'changeCredentialsPanelCreatingNewCredentialsMessageTitle':	"Alterando sua frase chave",
+'changeCredentialsPanelCreatingNewCredentialsMessageText':	"Atualizando suas credenciais",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle':	"Alterando sua frase chave",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageText':	"Enviando suas credenciais codificadas para Clipperz",
+'changeCredentialsPanelDoneMessageTitle':	"Alterando sua frase chave",
+'changeCredentialsPanelDoneMessageText':	"Concluído",
+'manageOTPTabLabel':	"Gerenciar suas frases chaves descartáveis",
+'manageOTPTabTitle':	"Gerenciar suas frases chaves descartáveis",
+'manageOTPTabDescription':	"<p>Uma frase chave descartável funciona como uma frase chave normal, mas só pode ser utilizada uma única vez.</p> <p>Se a mesma frase chave for utilizada novamente num próximo login, ela será rejeitada e o login não irá ocorrer.</p> <p>Imediatamente após um login com sucesso, sua frase chave descartável será apagada para evitar logins fraudulentos.</p> <p>Frases chaves descartáveis são uma excelente opção se você está preocupado com keyloggers ou spywares que podem estar coletando seus dados em determinadas máquinas.</p> <p> <b>É recomendável que você utilize frases chaves descartáveis sempre que utilizar terminais públicos como Internet cafés e bibliotecas.</b> </p> ",
+'oneTimePasswordReadOnlyMessage':	"<h6>Desculpe!</h6> <p>Você não pode gerenciar sua frase chave descartável quando usando a versão offline do Clipperz.</p> ",
+'oneTimePasswordLoadingMessage':	"<h6>Carregando informação</h6> <p>Por favor, aguarde ...</p> ",
+'oneTimePasswordNoPasswordAvailable':	"<h6>Nenhuma frase chave descartável disponível</h6> <p>Clique o botão “Novo” acima para adicionar uma frase chave descartável em sua conta.</p> ",
+'createNewOTPButtonLabel':	"Novo",
+'deleteOTPButtonLabel':	"Apagar",
+'printOTPButtonLabel':	"Imprimir",
+'disabledOneTimePassword_warning':	"desativada",
+'oneTimePasswordSelectionLink_selectLabel':	"Selecionar:",
+'oneTimePasswordSelectionLink_all':	"tudo",
+'oneTimePasswordSelectionLink_none':	"nenhum",
+'oneTimePasswordSelectionLink_used':	"usado",
+'oneTimePasswordSelectionLink_unused':	"não usado",
+'saveOTP_encryptUserDataTitle':	"Salvando a frase chave descartável",
+'saveOTP_encryptUserDataText':	"Processando novas credenciais descartáveis ...",
+'saveOTP_encryptOTPDataTitle':	"Salvando a frase chave descartável",
+'saveOTP_encryptOTPDataText':	"Codificação local da informação de autenticação ...",
+'saveOTP_sendingDataTitle':	"Salvando a frase chave descartável",
+'saveOTP_sendingDataText':	"Enviando informação de autenticação para o servidor ...",
+'saveOTP_updatingInterfaceTitle':	"Salvando a frase chave descartável",
+'saveOTP_updatingInterfaceText':	"Atualizando interface ...",
+'accountPreferencesLabel':	"Preferências",
+'accountPreferencesTabTitle':	"Preferências",
+'accountPreferencesLanguageTitle':	"Seleção de idioma",
+'accountPreferencesLanguageDescription':	"<p>Escolha seu idioma preferido da lista abaixo.</p> ",
+'showDonationReminderPanelTitle':	"Lembretes de doação",
+'showDonationReminderPanelDescription':	"<p>Mostrar lembretes de doação</p> ",
+'saveUserPreferencesFormSubmitLabel':	"Salvar",
+'cancelUserPreferencesFormSubmitLabel':	"Cancelar",
+'accountPreferencesSavingPanelTitle_Step1':	"Salvando preferências",
+'accountPreferencesSavingPanelText_Step1':	"Codificação local de suas preferências",
+'accountPreferencesSavingPanelTitle_Step2':	"Salvando preferências",
+'accountPreferencesSavingPanelText_Step2':	"Enviando informação codificada para o servidor",
+'accountLoginHistoryLabel':	"Histórico de conexão",
+'loginHistoryTabTitle':	"Histórico de conexão",
+'loginHistoryReadOnlyMessage':	"<h6>Desculpe!</h6> <p>Seu histórico de conexão não está disponível quando usando uma versão offline do Clipperz.</p> ",
+'loginHistoryLoadingMessage':	"<h6>Carregando informação</h6> <p>Por favor, aguarde ...</p> ",
+'loginHistoryLoadedMessageConfig':	"<h6>Suas 10 últimas conexões</h6> <p> </p> ",
+'loginHistoryIPLabel':	"IP",
+'loginHistoryTimeLabel':	"data",
+'loginHistoryCurrentSessionText':	"sessão atual",
+'loginHistoryReloadButtonLabel':	"Recarregar histórico de conexão",
+'deleteAccountTabLabel':	"Apagar sua conta",
+'deleteAccountTabTitle':	"Apagar sua conta",
+'deleteAccountFormUsernameLabel':	"nome de usuário",
+'deleteAccountFormPassphraseLabel':	"frase chave",
+'deleteAccountFormSafetyCheckboxLabel':	"Eu compreendo que toda minha informação será apagada e que esta ação é irreversível.",
+'deleteAccountFormSubmitLabel':	"Apagar minha conta",
+'deleteAccountFormWrongUsernameWarning':	"Nome de usuário errado",
+'deleteAccountFormWrongPassphraseWarning':	"Frase chave errada",
+'deleteAccountFormSafetyCheckWarning':	"Por favor leia e confira os campos abaixo.",
+'accountPanelDeletingAccountPanelConfirmationTitle':	"ATENÇÃO",
+'accountPanelDeleteAccountPanelConfirmationText':	"Você tem certeza que quer apagar esta conta?",
+'accountPanelDeleteAccountPanelConfirmButtonLabel':	"Sim",
+'accountPanelDeleteAccountPanelDenyButtonLabel':	"Não",
+'offlineCopyTabLabel':	"Cópia offline",
+'offlineCopyTabTitle':	"Cópia offline",
+'offlineCopyTabDescription':	"<p>Com apenas um click você pode passar toda sua informação codificada dos servidores Clipperz para seu hard disk e criar uma versão read-only offline do Clipperz para ser utilizada quando você não estiver conectado na Internet.</p> <p>Essa versão read-only é tão segura quanto a versão online e não vai expor suas informações a riscos maiores já que ambas tem a mesma arquitetura de código e segurança.</p> <ol> <li> <p>Clique no link abaixo para iniciar o download.</p> </li> <li> <p>O navegador vai perguntar o que fazer com o arquivo “Clipperz_YYYYMMDD.html”. Grave-o em seu hard disk.</p> </li> <li> <p>Clique duas vezes no arquivo baixado para abrir a versão offline em seu navegador.</p> </li> <li> <p>Entre sua frase chave e nome de usuário como sempre faz.</p> </li> </ol> ",
+'offlineCopyDownloadLinkLabel':	"Baixar",
+'offlineCopyDownloadWarningConfig':	"<h4> <a href=\"#\" id=\"offlineCopyDownloadWarningLink\">Atualize sua “cópia offline”!</a> </h4> <p>Vocie recentemente criou ou modificou um ou mais cartões, seria inteligente baixar uma nova “cópia offline”.</p> ",
+'sharingTabLabel':	"Compartilhar",
+'sharingTabTitle':	"Compartilhar",
+'sharingTabDescriptionConfig':	"<p>Frequentemente uma informação confidencial precisa ser compartilhada com uma ou mais pessoas.</p> <p>Isso pode ser tão simples quanto permitir o acesso de seus colegas ao seu voice mail quando você está fora do escritório, ou tão complicado quanto permitir que seus herdeiros acessem seu caixa num banco quando você morrer.</p> <p>Clipperz pode fazer o processo de compartilhamento simples e seguro.</p> <p> </p> <p> <b>Em breve ...</b> </p> ",
+'importTabLabel':	"Importar",
+'importTabTitle':	"Importar",
+'importTabDescription':	"<p> <b>Em breve ...</b> <p> ",
+'printingTabLabel':	"Exportar",
+'printingTabTitle':	"Exportar",
+'printingTabDescription':	"<p> <b>Versão para impressão</b> </p> <p>Clicando no link abaixo você abre uma nova janela contendo todos os seus cartões em formato de impressão.</p> <p>Se você vai impriir para backup, considere a opção mais segura criando uma “cópia offline”.</p> ",
+'printingLinkLabel':	"Versão para impressão",
+'contactsTabLabel':	"Contatos",
+'contactsTabTitle':	"Contatos",
+'passwordGeneratorTabLabel':	"Gerador de senhas",
+'passwordGeneratorTabTitle':	"Gerador de senhas",
+'passwordGeneratorTabButtonLabel':	"Gerar senha",
+'bookmarkletTabLabel':	"Bookmarklet",
+'bookmarkletTabTitle':	"Bookmarklet",
+'bookmarkletTabDescription':	"<p>Um bookmarklet é uma ferramenta “one-click” que pode executar diversas tarefas úteis. Pode ser salva e utilizada como uma página web preferida normal.</p> <p>Os bookmarklet Clipperz vão ajudar você a a rapidamente criar novos cartões e novos logins diretos a partir dos cartões existentes.</p> <p> <b>Por favor, note que o bookmarklet não inclui nenhuma informação relacionada à sua conta (e.g. seu nome de usuário ou frase chave), o bookmarklet é um ferramenta contendo o mesmo código para todos ois usuários Clipperz.</b> </p> <h3>Como instalar o bookmarlet</h3> <h5>Firefox, Camino, Opera, Safari</h5> <ol> <li> <p>Assegure-se que a “Barra de Bookmarks” está visível, selecionando “View > Toolbars > Bookmarks”, ou menu similar no menu do navegador</p> </li> <li> <p>Arraste o link “Adicionar ao Clipperz” abaixo para a barra de bookmark.</p> </li> </ol> <h5>Internet Explorer</h5> <ol> <li> <p>Assegure-se que o barra de “Links” está visível selecionando “View > Toolbar > Links” no menu do navegador.</p> </li> <li> <p>Clique com o botão direito no link “Adicionar ao Clipperz” abaixo.</p> </li> <li> <p>Select “Selecione “Add to favorites” no menu contextual.</p> </li> <li> <p>Clique “Yes” para qualquer mensagem de segurança que surgir em pop-up.</p> </li> <li> <p>Abra o folder “Links” e clique “OK”.</p> </li> </ol> ",
+'bookmarkletTabBookmarkletTitle':	"Adicionar ao Clipperz",
+'bookmarkletTabInstructions':	"<h3>Como criar um novo cartão para acessar diretamente um serviço online</h3> <ol> <li> <p>Abra a página web onde o formulário de login está. (é a página onde você usualmente entra com suas credenciais)</p> </li> <li> <p>Dispare a preferência clicando nela: um pop-up vai aparecer sobre a página.</p> </li> <li> <p>Copie para o clipboard o conteúdo da área de texto do pop-up. (ctrl-C)</p> </li> <li> <p>Entre em sua conta Clipperz e clique no botão <b>Adicionar novo cartão</b>.</p> </li> <li> <p>Selecione o template de \"Login Direto\" e cole o conteúdo do clipboard para a grande área de texto do formulário. (ctrl-V)</p> </li> <li> <p>Pressione o botão <b>Criar</b>, reveja os detalhes e clique <b>Save</b>.</p> </li> </ol> <h3>Como adicionar login direto a um cartão existente</h3> <ol> <li> <p>Idem acima.</p> </li> <li> <p>Idem acima.</p> </li> <li> <p>Idem acima.</p> </li> <li> <p>Entre em sua conta Clipperz e selecione o cartão contendo as credenciais para o serviço web que você visitou e clique no botão <b>Editar</b>.</p> </li> <li> <p>Cole o conteúdo do clipboard para a grande área de texto da sessão “Logins diretos”. (ctrl-V)</p> </li> <li> <p>Pressione o botão <b>Adicionar login direto</b>, reveja os detalhes e clique <b>Salvar</b>.</p> </li> </ol> <p> </p> <p>Mais informações sobre as preferências estão <a href=\"http://www.clipperz.com/support/user_guide/bookmarklet\" target=\"_blank\">disponíveis aqui</a>.</p> ",
+'mainPanelDirectLoginBlockLabel':	"Logins diretos",
+'directLinkReferenceShowButtonLabel':	"mostrar",
+'mainPanelDirectLoginBlockDescription':	"<p>Adicionar “logins diretos” para entrar em páginas web sem ter que digitar nome de usuário e senhas!</p> <p>“Logins diretos” ampliam a segurança de sus senha já que você pode:</p> <ul> <li> <p>utilizar senhas mais complexas;</p> </li> <li> <p>nunca re-utilizar a mesma senha fácil-de-lembrar.</p> </li> </ul> <p>Configuração simples e rápida com os <b>bookmarklet</b> Clipperz.</p> <a href=\"http://www.clipperz.com/support/user_guide/direct_logins\" target=\"_blank\">Saiba mais sobre “logins diretos”</a> ",
+'mainPanelRecordsBlockLabel':	"Cartões",
+'mainPanelAddRecordButtonLabel':	"Adicionar novo cartão",
+'mainPanelRemoveRecordButtonLabel':	"Apagar cartão",
+'mainPanelRecordFilterBlockAllLabel':	"todos",
+'mainPanelRecordFilterBlockTagsLabel':	"tags",
+'mainPanelRecordFilterBlockSearchLabel':	"buscar",
+'recordDetailNoRecordAtAllTitle':	"Bem-vindo ao Clipperz!",
+'recordDetailNoRecordAtAllDescription':	"<h5>Inicie criando cartões para sua conta.</h5> <p>Cartões são formulários simples e flexíveis onde você guarda senhas e outras informações confidenciais.</p> <p>Cartões podem conter credenciais de login a sites, a combinação do seu cadeado da bicicleta, detalhes do seu cartão de crédito, ...</p> <h5>Não esqueça o bookmarklet</h5> <p>Antes de começar, instale o bookmarklet “Adicionar ao Clipperz”: ele vai tornar o processo de criar cartões mais fácil e divertido.</p> <p> </p> <p>Depois, apenas click no botão <b>Adicionar novo cartão</b> e aproveite sua conta Clipperz.</p> <p> </p> <a href=\"http://www.clipperz.com/support/user_guide/managing_cards\" target=\"_blank\">Saiba mais sobre criar e gerenciar cartões</a> ",
+'newRecordWizardTitleBox':	"<h5>Por favor selecione um template</h5> <p>Cartões são formulários simples e flexíveis onde você pode arquivar suas senhas ou outras informações confidenciais.</p> <p>Comece escolhendo um dos templates abaixo. Você poderá customizar seus cartões mais tarde, adicionando e removendo campos.</p> ",
+'newRecordWizardBookmarkletConfigurationTitle':	"Login direto",
+'newRecordWizardBookmarkletConfigurationDescription':	"<p>Coloque abaixo o código de configuração gerado pelo bookmarklet Clipperz.</p> <p>Um novo cartão completo com login direto para sua conta web será criado.</p> ",
+'newRecordWizardCreateButtonLabel':	"Criar",
+'newRecordWizardCancelButtonLabel':	"Cancelar",
+'donateSplashPanelTitle':	"Apoie Clipperz, faça uma doação hoje!",
+'donateSplashPanelDescription':	"<p>Algumas boas razões para doar:</p> <ul> <li> <p>apoie o desenvolvimento de novas funcionalidades</p> </li> <li> <p>mantenha Clipperz gratuito</p> </li> <li> <p>mostrar apreciação por trabalho duro</p> </li> </ul> <p>Para qualquer informação adicional, por favor visite nossa <a href=\"http://www.clipperz.com/donations\" target=\"_blank\">página de Doações</a>.</p> <p> <b>Pronto para doar?</b> </p> ",
+'donateCloseButtonLabel':	"Não ainda",
+'donateDonateButtonLabel':	"Sim",
+'recordTemplates':	{
+	'WebAccount':	{
+		'title':	"Senha web",
+		'description':	"<p>Um cartão simples para arquivar credenciais de login para seus serviços online.</p> ",
+		'fields':	{
+			'URL':	"Endereço web",
+			'TXT':	"Nome de usuário ou email",
+			'PWD':	"Senha"
+		}
+	},
+	'BankAccount':	{
+		'title':	"Conta bancária",
+		'description':	"<p>Arquive com segurança o número de sua conta corrente e suas credenciais de online banking.</p> ",
+		'fields':	{
+			'TXT':	"Banco",
+			'TXT':	"Número da conta",
+			'URL':	"Website do banco",
+			'TXT':	"ID de online banking",
+			'PWD':	"Senha de online banking"
+		}
+	},
+	'CreditCard':	{
+		'title':	"Cartão de crédito",
+		'description':	"<p>Número do cartão, validade, CVV2 e PIN sempre disponíveis no Clipperz</p> ",
+		'fields':	{
+			'TXT':	"Tipo (Visa, AmEx, ...)",
+			'TXT':	"Número",
+			'TXT':	"Nome do proprietário",
+			'TXT':	"Prazo  de  validade",
+			'TXT':	"CVV2",
+			'PWD':	"PIN",
+			'URL':	"Website do cartão",
+			'TXT':	"Nome do usuário",
+			'PWD':	"Senha"
+		}
+	},
+	'AddressBookEntry':	{
+		'title':	"Agenda de endereços",
+		'description':	"<p>Clipperz pode também funcionar como sua agenda de endereços particular. Use esse template para facilmente adicionar novas entradas.</p> ",
+		'fields':	{
+			'TXT':	"Nome",
+			'TXT':	"Email",
+			'TXT':	"Fone",
+			'TXT':	"Mobile",
+			'ADDR':	"Endereço"
+		}
+	},
+	'Custom':	{
+		'title':	"Cartão customizado",
+		'description':	"<p>Não importa o tipo de informação confidencial você precisa proteger, crie um cartão customizado para sua necessidade.</p> ",
+		'fields':	{
+			'TXT':	"Label 1",
+			'TXT':	"Label 2",
+			'TXT':	"Label 3"
+		}
+	}
+},
+'recordFieldTypologies':	{
+	'TXT':	{
+		'description':	"simple text field",
+		'shortDescription':	"texto"
+	},
+	'PWD':	{
+		'description':	"simple text field, with default status set to hidden",
+		'shortDescription':	"senha"
+	},
+	'URL':	{
+		'description':	"simple text field in edit mode, that became an active url in view mode",
+		'shortDescription':	"endereço web"
+	},
+	'DATE':	{
+		'description':	"a value set with a calendar helper",
+		'shortDescription':	"data"
+	},
+	'ADDR':	{
+		'description':	"just like the URL, but the active link points to Google Maps (or similar service) passing the address value as argument",
+		'shortDescription':	"endereço"
+	},
+	'CHECK':	{
+		'description':	"check description",
+		'shortDescription':	"check"
+	},
+	'RADIO':	{
+		'description':	"radio description",
+		'shortDescription':	"radio"
+	},
+	'SELECT':	{
+		'description':	"select description",
+		'shortDescription':	"select"
+	}
+},
+'newRecordPanelGeneralExceptionTitle':	"Erro",
+'newRecordPanelGeneralExceptionMessage':	"O texto de configuração não é válido. Certifique-se do texto no pop-up de bookmarklet e tente novamente.",
+'newRecordPanelWrongBookmarkletVersionExceptionTitle':	"Erro",
+'newRecordPanelWrongBookmarkletVersionExceptionMessage':	"O texto de configuração foi gerado por uma velha versão de bookmarklet. Por favor, atualize seus preferidos e tente novamente.",
+'newRecordPanelExceptionPanelCloseButtonLabel':	"Cancelar",
+'mainPanelDeletingRecordPanelConfirmationTitle':	"Apagando o cartão selecionado",
+'mainPanelDeleteRecordPanelConfirmationText':	"Você quer mesmo apagar o cartão selecionado?",
+'mainPanelDeleteRecordPanelConfirmButtonLabel':	"Sim",
+'mainPanelDeleteRecordPanelDenyButtonLabel':	"Não",
+'mainPanelDeletingRecordPanelInitialTitle':	"Apagando o cartão selecionado",
+'mainPanelDeletingRecordPanelCompletedText':	"Concluído",
+'deleteRecordPanelCollectRecordDataMessageTitle':	"Apagar cartão",
+'deleteRecordPanelCollectRecordDataMessageText':	"Atualizando lista de cartões",
+'deleteRecordPanelEncryptUserDataMessageTitle':	"Apagar cartão",
+'deleteRecordPanelEncryptUserDataMessageText':	"Codificação local de cabeçalhos de cartão",
+'deleteRecordPanelSendingDataToTheServerMessageTitle':	"Apagar cartão",
+'deleteRecordPanelSendingDataToTheServerMessageText':	"Enviando os cabeçalhos de cartão codificados para Clipperz",
+'deleteRecordPanelUpdatingTheInterfaceMessageTitle':	"Apagar cartão",
+'deleteRecordPanelUpdatingTheInterfaceMessageText':	"Atualizando a interface",
+'recordDetailNoRecordSelectedTitle':	"Nenhum cartão selecionado",
+'recordDetailNoRecordSelectedDescription':	"<p>Por favor selecione um cartão da lista na esquerda.</p> ",
+'recordDetailLoadingRecordMessage':	"Baixando cartão codificados do Clipperz",
+'recordDetailDecryptingRecordMessage':	"Descrição local dos dados do cartão",
+'recordDetailLoadingRecordVersionMessage':	"Baixando a versão mais recente do cartão",
+'recordDetailDecryptingRecordVersionMessage':	"Descrição local da versão mais recente",
+'recordDetailLoadingErrorMessageTitle':	"Erro enquanto baixando o cartão",
+'recordDetailNotesLabel':	"Notas",
+'recordDetailLabelFieldColumnLabel':	"Legenda do campo",
+'recordDetailDataFieldColumnLabel':	"Dados do campo",
+'recordDetailTypeFieldColumnLabel':	"Tipo",
+'recordDetailSavingChangesMessagePanelInitialTitle':	"Salvando cartão",
+'recordDetailAddFieldButtonLabel':	"Adicionar novo campo",
+'recordDetailPasswordFieldHelpLabel':	"para copiar a senha para o clipboard clique nas estrelas e em seguida Ctrl-C",
+'recordDetailPasswordFieldScrambleLabel':	"misturar",
+'recordDetailPasswordFieldUnscrambleLabel':	"mostrar",
+'recordDetailDirectLoginBlockTitle':	"Logins diretos",
+'recordDetailNewDirectLoginDescription':	"<p>Configuração de login direto</p> ",
+'recordDetailDirectLoginBlockNoDirectLoginConfiguredDescriptionConfig':	"<p>Este cartão contém credenciais para acessar um serviço online?</p> <p>Use o bookmarklet para configurar um “login direto” desde o Clipperz com apenas um click!</p> ",
+'recordDetailAddNewDirectLoginButtonLabel':	"Adicionar novo login direto",
+'recordDetailEditButtonLabel':	"Editar",
+'recordDetailSaveButtonLabel':	"Salvar",
+'recordDetailCancelButtonLabel':	"Cancelar",
+'newRecordTitleLabel':	"_novo cartão_",
+'recordSaveChangesPanelCollectRecordInfoMessageTitle':	"Salvar cartão",
+'recordSaveChangesPanelCollectRecordInfoMessageText':	"Subindo cabeçalhos de cartão",
+'recordSaveChangesPanelEncryptUserDataMessageTitle':	"Salvar cartão",
+'recordSaveChangesPanelEncryptUserDataMessageText':	"Codificação local do cabeçalho do cartão",
+'recordSaveChangesPanelEncryptRecordDataMessageTitle':	"Salvar cartão",
+'recordSaveChangesPanelEncryptRecordDataMessageText':	"Codificação local da informação do cartão",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageTitle':	"Salvar cartão",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageText':	"Codificação local da informação de versão do cartão",
+'recordSaveChangesPanelSendingDataToTheServerMessageTitle':	"Salvar cartão",
+'recordSaveChangesPanelSendingDataToTheServerMessageText':	"Subindo o cabeçalho do cartão codificado para Clipperz",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageTitle':	"Salvar cartão",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageText':	"Atualizando a interface",
+'passwordGeneratorPanelTitle':	"Gerador de senhas",
+'passwordGeneratorPanelOkLabel':	"Ok",
+'passwordGeneratorPanelCancelLabel':	"Cancelar",
+'passwordGeneratorLengthLabel':	"compr.:",
+//'DWRUtilLoadingMessage':	"Carregando ...",
+'comingSoon':	"em breve ...",
+'panelCollectingEntryopyMessageText':	"Coletando entropia",
+'directLoginConfigurationCheckBoxFieldSelectedValue':	"Sim",
+'directLoginConfigurationCheckBoxFieldNotSelectedValue':	"Não",
+'WELCOME_BACK':	"Welcome back!",
+'currentConnectionText':	"Você está conectado do ip&nbsp;__ip__, aparentemente desde __country__, usando __browser__ num __operatingSystem__.",
+'latestConnectionText':	"Sua úlitima conexão foi __elapsedTimeDescription__ (__time__) do ip&nbsp;__ip__, aparentemente desde __country__, usando __browser__ num __operatingSystem__.",
+'fullLoginHistoryLinkLabel':	"mostrar o histórico de logins completos",
+'elapsedTimeDescriptions':	{
+	'MORE_THAN_A_MONTH_AGO':	"mais de um mês atrás",
+	'MORE_THAN_A_WEEK_AGO':	"mais de uma semana atrás",
+	'MORE_THAN_*_WEEKS_AGO':	"mais de __elapsed__ semanas atrás",
+	'YESTERDAY':	"ontem",
+	'*_DAYS_AGO':	"__elapsed__ dias atrás",
+	'ABOUT_AN_HOUR_AGO':	"cerca de uma hora atrás",
+	'*_HOURS_AGO':	"__elapsed__ horas atrás",
+	'JUST_A_FEW_MINUTES_AGO':	"apenas alguns minutos atrás",
+	'ABOUT_*_MINUTES_AGO':	"cerca de __elapsed__ minutos atrás"
+},
+'unknown_ip':	"desconhecido",
+'calendarStrings':	{
+	'months':	{
+		'0':	"Janeiro",
+		'1':	"Fevereiro",
+		'2':	"Março",
+		'3':	"Abril",
+		'4':	"Maio",
+		'5':	"Junho",
+		'6':	"Julho",
+		'7':	"Agosto",
+		'8':	"Setembro",
+		'9':	"Outubro",
+		'10':	"Novembro",
+		'11':	"Dezembro"
+	},
+	'shortMonths':	{
+		'0':	"Jan",
+		'1':	"Fev",
+		'2':	"Mar",
+		'3':	"Abr",
+		'4':	"Mai",
+		'5':	"Jun",
+		'6':	"Jul",
+		'7':	"Ago",
+		'8':	"Set",
+		'9':	"Out",
+		'10':	"Nov",
+		'11':	"Dez"
+	},
+	'days':	{
+		'0':	"Domingo",
+		'1':	"Segunda-feira",
+		'2':	"Terça-feira",
+		'3':	"Quarta-feira",
+		'4':	"Quinta-feira",
+		'5':	"Sexta-feira",
+		'6':	"Sábado"
+	},
+	'shortDays':	{
+		'0':	"Dom",
+		'1':	"Seg",
+		'2':	"Ter",
+		'3':	"Qua",
+		'4':	"Quin",
+		'5':	"Sex",
+		'6':	"Sab"
+	},
+	'veryShortDays':	{
+		'0':	"Do",
+		'1':	"Se",
+		'2':	"Te",
+		'3':	"Qa",
+		'4':	"Qi",
+		'5':	"Se",
+		'6':	"Sa"
+	},
+	'amDesignation':	"am",
+	'pmDesignation':	"pm"
+},
+
+__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_pt-PT.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_pt-PT.js
new file mode 100644
index 0000000..5284683
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_pt-PT.js
@@ -0,0 +1,42 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+//=============================================================================
+//
+//		P O R T U G U Ê S  ( pt_PT )
+//
+//=============================================================================
+
+Clipperz.PM.Strings.Languages['pt-pt'] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['pt-br'], {
+
+
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+});
+
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_ru-RU.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_ru-RU.js
new file mode 100644
index 0000000..41c904f
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_ru-RU.js
@@ -0,0 +1,440 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+Clipperz.PM.Strings.Languages['ru-RU'.toLowerCase()] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+'clipperzServiceDescription':	"<h2>Держи при себе!</h2> <ul> <li> <h3>Clipperz - это:</h3> <ul> <li> <p>безопасный и простой менеджер паролей</p> </li> <li> <p>эффективное решение для единой регистрации</p> </li> <li> <p>цифровое хранилище Ваших конфидециальных данных</p> </li> </ul> </li> <li>
+			<h3>C помошью Clipperz Вы можете:</h3> <ul>
+				<li> <p>хранить и управлять Вашими паролями</p> </li> <li> <p>входить в любые веб-сервисы без ввода логина и пароля</p> </li> <li> <p>защитить все  важные данные: коды охранной сигнализации, ПИНы, номера кредитных кард, ...</p> </li> <li> <p>открыть доступ Вашим членам семьи, друзьям, коллегам</p> </li> </ul> </li> <li>
+			<h3>Преимущества Clipperz:</h3> <ul>
+				<li> <p>бесплатный и абсолютно анонимный</p> </li> <li> <p>доступен в любое время и с любого компьютера</p> </li> <li> <p>не нужно ничего устанавливать</p> </li> <li> <p>не надо хранить секреты на компьютере или бумаге</p> </li> </ul> </li> <li>
+			<h3>Безопасность Clipperz:</h3> <ul>
+				<li> <p>все данные перед отправкой в Clipperz шифруются в браузере</p> </li> <li> <p>секретный ключ - это фраза, которую знаете только Вы</p> </li> <li> <p>Clipperz управляет важными данными в зашифрованном виде и никогда не получит доступ к ним в открытом виде</p> </li> <li> <p>Clipperz основан на стандартных криптографических протоколах: без каких-либо самоделок</p> </li> <li> <p>Вы можете просмотреть исходный код, но Вам ничего не надо знать о криптографии, чтобы быть просто пользоваться</p> </li> </ul> </li> <li>
+			<a href=\"http://www.clipperz.com\" target=\"_blank\">Подробнее</a> </li> </ul> ",
+'loginFormTitle':	"войти под Вашим аккаунтом Clipperz",
+'loginFormUsernameLabel':	"имя пользователя",
+'loginFormPassphraseLabel':	"ключевая фраза",
+'loginFormDontHaveAnAccountLabel':	"у вас еще нет аккаунта?",
+'loginFormCreateOneLabel':	"создать",
+'loginFormForgotYourCredentialsLabel':	"забыли пароль?",
+'loginFormAarghThatsBadLabel':	"о! это плохо!",
+'loginFormAfraidOfMaliciousScriptsLabel':	"опасаетесь вредоносных скриптов?",
+'loginFormVerifyTheCodeLabel':	"проверить код",
+'loginFormButtonLabel':	"Войти",
+'loginFormOneTimePasswordCheckboxLabel':	"использовать одноразовую ключевую фразу",
+'loginPanelSwithLanguageDescription':	"<h5>Переключиться на Ваш язык</h5> ",
+'browserCompatibilityDescription':	"<p>Лучше работать с Clipperz в Firefox. Однако Clipperz хорошо совместим с Opera и MS Internet Explorer!</p> ",
+'OTPloginMessagePanelInitialTitle':	"Вход",
+'OTPloginMessagePanelInitialText':	"Передача данных учетной записи ...",
+'OTPloginMessagePanelLoadingTitle':	"Вход",
+'OTPloginMessagePanelLoadingText':	"Запрос аутентификационных данных с сервера ...",
+'OTPloginMessagePanelProcessingTitle':	"Вход",
+'OTPloginMessagePanelProcessingText':	"Расшифровка аутентификационных данных",
+'loginMessagePanelInitialTitle':	"Вход ...",
+'loginMessagePanelInitialButtonLabel':	"Отмена",
+'loginMessagePanelConnectedTitle':	"Соединен",
+'loginMessagePanelConnectedText':	"Выполнен",
+'loginMessagePanelFailureTitle':	"Ошибка",
+'loginMessagePanelFailureText':	"Ошибка при попытке входа",
+'loginMessagePanelFailureButtonLabel':	"Закрыть",
+'connectionLoginSendingCredentialsMessageTitle':	"Проверка учетной записи",
+'connectionLoginSendingCredentialsMessageText':	"Передача данных ...",
+'connectionLoginCredentialsVerificationMessageTitle':	"Проверка учетной записи",
+'connectionLoginCredentialsVerificationMessageText':	"Выполняем SRP-аутентификацию ...",
+'connectionLoginDoneMessageTitle':	"Проверка учетной записи",
+'connectionLoginDoneMessageText':	"Соединено",
+'userLoginPanelUpgradingUserCredentialsMessageTitle':	"Проверка учетной записи",
+'userLoginPanelUpgradingUserCredentialsMessageText':	"Обновляем полномочия к новой схеме аутентификации",
+'userLoginPanelConnectedMessageTitle':	"Пользователь аутентифицирован",
+'userLoginPanelConnectedMessageText':	"Успешный вход",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageTitle':	"Проверка учетной записи",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageText':	"Пробуем войти по старой схеме",
+'userLoginPanelLoadingUserDataMessageTitle':	"Пользователь аутентифицирован",
+'userLoginPanelLoadingUserDataMessageText':	"Загрузка зашифрованных заголовков карточек",
+'userLoginPanelDecryptingUserDataMessageTitle':	"Пользователь аутентифицирован",
+'userLoginPanelDecryptingUserDataMessageText':	"Расшифровка заголовков карточек",
+'userLoginPanelDecryptingUserStatisticsMessageTitle':	"Пользователь аутентифицирован",
+'userLoginPanelDecryptingUserStatisticsMessageText':	"Расшифровка статистики",
+'splashAlertTitle':	"Добро пожаловать в Clipperz!",
+'splashAlertText':	"<p>Несколько советов по безопасности:</p> <ul> <li> <p>Хранение данных в Clipperz зависит от того, насколько безопасна выбранная Вами ключевая фраза</p> </li> <li> <p>Если собираетесь использовать Clipperz для защиты важных или критических данных, то убедитесь, что выбрали сложный пароль</p> </li> <li> <p>Clipperz не может восстановить забытую ключевую фразу</p> </li> </ul> <p>За дополнительной информацией обратитесь на <a href=\"http://www.clipperz.com\" target=\"_blank\">сайт</a> Clipperz.</p> ",
+'splashAlertCloseButtonLabel':	"OK",
+'registrationFormTitle':	"создать аккаунт",
+'registrationFormUsernameLabel':	"имя пользователя",
+'registrationFormPassphraseLabel':	"ключевая фраза",
+'registrationFormRetypePassphraseLabel':	"повторите ключевую фразу",
+'registrationFormSafetyCheckLabel':	"Я понимаю, что Clipperz не может восстановить забытую ключевую фразу",
+'registrationFormTermsOfServiceCheckLabel':	"Я прочитал и согласен с <a href='http://www.clipperz.com/terms_of_service' target='_blank'>Условиями предоставления услуг</a>.",
+'registrationFormDoYouAlreadyHaveAnAccountLabel':	"у вас уже есть аккаунт?",
+'registrationFormSimplyLoginLabel':	"просто ввойдите",
+'registrationFormButtonLabel':	"Зарегистрировать",
+'registrationFormWarningMessageNotMatchingPassphrases':	"Ключевые фразы не совпадают, пожайлуста, повторите ввод",
+'registrationFormWarningMessageSafetyCheckNotSelected':	"Прочитайте и проверьте все поля ниже",
+'registrationFormWarningMessageTermsOfServiceCheckNotSelected':	"Вы должны принять Условия предоставления услуг",
+'registrationMessagePanelInitialTitle':	"Создание аккаунта",
+'registrationMessagePanelInitialButtonLabel':	"Отмена",
+'registrationMessagePanelRegistrationDoneTitle':	"Регистрация",
+'registrationMessagePanelRegistrationDoneText':	"Выполнено",
+'registrationMessagePanelFailureTitle':	"Ошибка регистрации",
+'registrationMessagePanelFailureButtonLabel':	"Закрыть",
+'connectionRegistrationSendingRequestMessageText':	"Проверка учетной записи",
+'connectionRegistrationSendingCredentialsMessageText':	"Передача данных",
+'registrationSplashPanelTitle':	"Совет",
+'registrationSplashPanelDescription':	"<p>Это Ваши данные учетной записи, позаботесь об их безопасности. Clipperz никогда больше не покажет Ваше имя пользователя и ключевую фразу!</p> ",
+'registrationSplashPanelUsernameLabel':	"имя пользователя",
+'registrationSplashPanelPassphraseLabel':	"ключевая фраза",
+'registrationSplashPanelShowPassphraseButtonLabel':	"показать ключевую фразу",
+'donateHeaderLinkLabel':	"пожертвования",
+'creditsHeaderLinkLabel':	"список разработчиков",
+'feedbackHeaderLinkLabel':	"обратная связь",
+'helpHeaderLinkLabel':	"помощь",
+'forumHeaderLinkLabel':	"форум",
+'recordMenuLabel':	"карточки",
+'accountMenuLabel':	"аккаунт",
+'dataMenuLabel':	"данные",
+'contactsMenuLabel':	"контакты",
+'toolsMenuLabel':	"инструменты",
+'logoutMenuLabel':	"выйти",
+'lockMenuLabel':	"заблокировать",
+'lockTitle':	"Аккаунт заблокирован",
+'lockDescription':	"<p>Введите ключевую фразу для разблокировки</p> ",
+'unlockButtonLabel':	"разблокировать",
+'changePasswordTabLabel':	"Изменить ключевую фразу",
+'changePasswordTabTitle':	"Изменить ключевую фразу",
+'changePasswordFormUsernameLabel':	"имя пользователя",
+'changePasswordFormOldPassphraseLabel':	"старая ключевая фраза",
+'changePasswordFormNewPassphraseLabel':	"новая ключевая фраза",
+'changePasswordFormRetypePassphraseLabel':	"повторить ключевую фразу",
+'changePasswordFormSafetyCheckboxLabel':	"Я понимаю, что Clipperz не может восстановить забытую ключевую фразу.",
+'changePasswordFormSubmitLabel':	"Изменить",
+'changePasswordFormWrongUsernameWarning':	"Неправильное имя пользователя",
+'changePasswordFormWrongPassphraseWarning':	"Неверная ключевая фраза",
+'changePasswordFormWrongRetypePassphraseWarning':	"Ключевые фразы не совпадают, пожайлуста, повторите ввод.",
+'changePasswordFormSafetyCheckWarning':	"Прочитайте и проверьте все поля ниже.",
+'changePasswordFormProgressDialogTitle':	"Изменение учетной записи",
+'changePasswordFormProgressDialogConnectedMessageTitle':	"Соединено",
+'changePasswordFormProgressDialogConnectedMessageText':	"Выполнено",
+'changePasswordFormProgressDialogErrorMessageTitle':	"Ошибка",
+'changePasswordFormProgressDialogErrorMessageText':	"Ошибка изменения учетной записи!",
+'changeCredentialsPanelEncryptingDataMessageTitle':	"Изменение ключевой фразы",
+'changeCredentialsPanelEncryptingDataMessageText':	"Шифрование заголовков карточек",
+'changeCredentialsPanelCreatingNewCredentialsMessageTitle':	"Изменение ключевой фразы",
+'changeCredentialsPanelCreatingNewCredentialsMessageText':	"Обновление учетной записи",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle':	"Изменение ключевой фразы",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageText':	"Загрузка данных учетной записи в Clipperz",
+'changeCredentialsPanelDoneMessageTitle':	"Изменение ключевой фразы",
+'changeCredentialsPanelDoneMessageText':	"Выполнено",
+'manageOTPTabLabel':	"Управление одноразовыми ключевыми фразами",
+'manageOTPTabTitle':	"Управление одноразовыми ключевыми фразами",
+'manageOTPTabDescription':	"<p>Одноразовый пароль работает, как Ваша обычная ключевая фраза, но может быть использована только один раз.</p> <p>Если один и тот же пароль будет использоваться снова на следующих этапах, она будет отклонен и процедура входа завершится неудачно.</p> <p>Сразу после входа одноразовый пароль будет удален, чтобы предовратить любую несанкционированную попытку доступа.</p> <p>Одноразовые пароли - удачный выбор для тех, кто обеспокоен кейлоггерами или spyware, которые могут собирать информ.</p> <p> <b>Строго рекомендуется использовать одноразовые пароли для доступа к Clipperz с чужих компьютеров, из интернет-кафе и библиотек.</b> </p> ",
+'oneTimePasswordReadOnlyMessage':	"<h6>Извините!</h6> <p>Вы не можете управлять одноразовыми ключевыми фразами в оффлайновой версии Clipperz.</p> ",
+'oneTimePasswordLoadingMessage':	"<h6>Загрузка данных</h6> <p>Подождите, пожайлуста ...</p> ",
+'oneTimePasswordNoPasswordAvailable':	"<h6>Нет свободных для использования одноразовых ключевых фраз.</h6> <p>Нажмите кнопку “Новая”, чтобы добавить еще одноразовые ключевые фразы в аккаунт.</p> ",
+'createNewOTPButtonLabel':	"новая",
+'deleteOTPButtonLabel':	"удалить",
+'printOTPButtonLabel':	"печать",
+'disabledOneTimePassword_warning':	"запрещено",
+'oneTimePasswordSelectionLink_selectLabel':	"Выбрать:",
+'oneTimePasswordSelectionLink_all':	"все",
+'oneTimePasswordSelectionLink_none':	"ни одного",
+'oneTimePasswordSelectionLink_used':	"использованные",
+'oneTimePasswordSelectionLink_unused':	"неиспользованные",
+'saveOTP_encryptUserDataTitle':	"Сохранение одноразовых ключевых фраз",
+'saveOTP_encryptUserDataText':	"Обработка новых данных учетной записи ...",
+'saveOTP_encryptOTPDataTitle':	"одноразовыми ключевыми фразами",
+'saveOTP_encryptOTPDataText':	"Шифрование аутентификационных данных ...",
+'saveOTP_sendingDataTitle':	"одноразовыми ключевыми фразами",
+'saveOTP_sendingDataText':	"Передача аутентификационных данных на сервер ...",
+'saveOTP_updatingInterfaceTitle':	"одноразовыми ключевыми фразами",
+'saveOTP_updatingInterfaceText':	"Обновление интерфейса ...",
+'accountPreferencesLabel':	"Настройки",
+'accountPreferencesTabTitle':	"Настройки",
+'accountPreferencesLanguageTitle':	"Выбор языка",
+'accountPreferencesLanguageDescription':	"<p>Выберите Ваш язык из списка.</p> ",
+'showDonationReminderPanelTitle':	"Напоминания о пожертвованиях",
+'showDonationReminderPanelDescription':	"<p>Показать напоминания о пожертвованиях</p> ",
+'saveUserPreferencesFormSubmitLabel':	"Сохранить",
+'cancelUserPreferencesFormSubmitLabel':	"Отмена",
+'accountPreferencesSavingPanelTitle_Step1':	"Сохранение настроек",
+'accountPreferencesSavingPanelText_Step1':	"Шифрование настроек",
+'accountPreferencesSavingPanelTitle_Step2':	"Сохранение настроек",
+'accountPreferencesSavingPanelText_Step2':	"Передача зашифрованных настроек в Clipperz",
+'accountLoginHistoryLabel':	"История входов",
+'loginHistoryTabTitle':	"История входов",
+'loginHistoryReadOnlyMessage':	"<h6>Извините!</h6> <p>История входов не доступна в оффлайновой версии Clipperz.</p> ",
+'loginHistoryLoadingMessage':	"<h6>Загрузка данных</h6> <p>Подождите, пожайлуста ...</p> ",
+'loginHistoryLoadedMessage':	"<h6>Десять Ваших последних входов</h6> <p> </p> ",
+'loginHistoryIPLabel':	"IP",
+'loginHistoryTimeLabel':	"дата",
+'loginHistoryCurrentSessionText':	"текущая сессия",
+'loginHistoryReloadButtonLabel':	"Обновить историю",
+'deleteAccountTabLabel':	"Удалить аккаунт",
+'deleteAccountTabTitle':	"Удалить аккаунт",
+'deleteAccountFormUsernameLabel':	"имя пользователя",
+'deleteAccountFormPassphraseLabel':	"ключевая фраза",
+'deleteAccountFormSafetyCheckboxLabel':	"Я понимаю, что все мои данные будут удалены и это действие необратимо.",
+'deleteAccountFormSubmitLabel':	"Удалить мой аккаунт",
+'deleteAccountFormWrongUsernameWarning':	"Неверное имя пользователя",
+'deleteAccountFormWrongPassphraseWarning':	"Неверная ключевая фраза",
+'deleteAccountFormSafetyCheckWarning':	"Прочтите и отметьте все поля ниже.",
+'accountPanelDeletingAccountPanelConfirmationTitle':	"ВНИМАНИЕ",
+'accountPanelDeleteAccountPanelConfirmationText':	"Вы уверены, что хотите удалить аккаунт?",
+'accountPanelDeleteAccountPanelConfirmButtonLabel':	"Да",
+'accountPanelDeleteAccountPanelDenyButtonLabel':	"Нет",
+'offlineCopyTabLabel':	"Оффлайновая копия",
+'offlineCopyTabTitle':	"Оффлайновая копия",
+'offlineCopyTabDescription':	"<p>Одним кликом Вы можете сохранить все зашифрованные данные с серверов Clipperz на жесткий диск и создать оффлайновую версию, которую будете использовать при отсутствии подключения к Интернету.</p> <p>Версия только для чтения безопасна также, как и полная, и не подвергает Ваши данные большим рискам, так как использует тот же код и архитектуру.</p> <ol> <li> <p>Нажмите на ссылку, чтобы начать скачивание.</p> </li> <li> <p>Браузер спросит, что сделать с файлом “Clipperz_YYYYMMDD.html”. Сохраните его на Ваш жесткий диск.</p> </li> <li> <p>Double click on the downloaded file to launch the offline version in your browser.</p> </li> <li> <p>Как обычно, введите имя пользователя и ключевую фразу.</p> </li> </ol> ",
+'offlineCopyDownloadLinkLabel':	"Скачать",
+'offlineCopyDownloadWarning':	"<h4> <a href=\"#\" id=\"offlineCopyDownloadWarningLink\">Обновите Вашу “оффлайновую копию”!</a> </h4> <p>Вы недавно создали или изменили одну или более карточек: было бы разумным скачать новую оффлайновую копию.</p> ",
+'sharingTabLabel':	"Совместное использование",
+'sharingTabTitle':	"Совместное использование",
+'sharingTabDescription':	"<p>Достаточно часто конфидециальную информацию нужно открыть одному или нескольким людям.</p> <p>Это может быть просто, как дать коллеге ключ доступа к Вашей голосовой почте, когда Вас нет в офисе, или сложно, как открыть доступ наследникам к Вашему счету в местном банке, когда Вы скончаетесь.</p> <p>Clipperz поможет сделать совместное использование Ваших секретов безопасным и простым процессом.</p> <p> </p> <p> <b>Скоро ...</b> </p> ",
+'importTabLabel':	"Импорт",
+'importTabTitle':	"Импорт",
+'importTabDescription':	"<p> <b>Скоро ...</b> </p> ",
+'printingTabLabel':	"Экспорт",
+'printingTabTitle':	"Экспорт",
+'printingTabDescription':	"<p> <b>Печать Ваших данных</b> </p> <p>Нажмите по ссылке, чтобы открыть новое окно со всеми Вашими карточками для печати.</p> <p>Если вы собираетесь распечатать в резервных целях, пожайлуста, рассмотрите более безопасный вариант, как создание “оффлайновой копии”.</p> ",
+'printingLinkLabel':	"Версия для печати",
+'contactsTabLabel':	"Контакты",
+'contactsTabTitle':	"Контакты",
+'passwordGeneratorTabLabel':	"Генератор паролей",
+'passwordGeneratorTabTitle':	"Генератор паролей",
+'passwordGeneratorTabButtonLabel':	"Генератор паролей",
+'bookmarkletTabLabel':	"Закладка",
+'bookmarkletTabTitle':	"Закладка",
+'bookmarkletTabDescription':	"<p>Закладка - это простой инструмент, который может решать очень полезные задачи. Ее можно сохранить и использовать как обычную веб-страницу.</p> <p>Закладки помогут Вам быстро создать новые карточки и новые логины внутри существующих карточек.</p> <p> <b>Пожайлуста, учтите, что закладки действительно не включают какой-либо информации, связанной с аккаунтом (например, имя или ключевая фраза), закладки содержат один и тот же код для каждого пользователя.</b> </p> <h3>Как установить закладку</h3> <h5>Firefox, Camino, Opera, Safari</h5> <ol> <li> <p>Убедитесь, что панель закладок отображается выбором “View > Toolbars > Bookmarks” или похожими пунктами из меню браузера.</p> </li> <li> <p>Нажмите и перетащите ссылку “Добавить в Clipperz” на панель закладок.</p> </li> </ol> <h5>Internet Explorer</h5> <ol> <li> <p>Убедитесь, что отображается панель “Ссылки” выбором “View > Toolbars > Links” из меню браузера.</p> </li> <li> <p>Нажмите правой кнопкой на ссылку “Добавить в Clipperz”.</p> </li> <li> <p>Выберите “Add to favorites” из контекстного меню.</p> </li> <li> <p>Нажмите “Yes” для любых сообщений, которые появятся.</p> </li> <li> <p>Откройте папку “Links” и нажмите “OK”.</p> </li> </ol> ",
+'bookmarkletTabBookmarkletTitle':	"Добавить в Clipperz",
+'bookmarkletTabInstructions':	"<h3>Как создать новую карточку с ссылками “прямого подключения” в онлайновый сервис</h3> <ol> <li> <p>Откройте веб-страницу с формой входа. (обычно на этой страницы Вы вводите данные вашей учетной записи)</p> </li> <li> <p>Запустите закладку, нажав на нее: появится всплывающее окно.</p> </li> <li> <p>Скопируйте в буфер обмена содержимое текстового поля из всплывающего окна. (ctrl-C)</p> </li> <li> <p>Ввойдите в Ваш аккаунт и нажмите “Добавить новую карточку”.</p> </li> <li> <p>Выберите шаблон “Прямого подключения” и вставьте в текстовое поле содержимое буфера обмена. (ctrl-V)</p> </li> <li> <p>Нажмите кнопку “Создать”, проверьте правильность и нажмите “Сохранить”.</p> </li> </ol> <h3>Как создать ссылку “Прямого подключения” в существующей карточке</h3> <ol> <li> <p>Тоже самое, как и выше.</p> </li> <li> <p>Тоже самое, как и выше.</p> </li> <li> <p>Тоже самое, как и выше.</p> </li> <li> <p>Ввойдите в Ваш аккаунт и выберите карточку с данными учетной записи для только что посещенного веб-сервиса и нажмите “Редактировать”.</p> </li> <li> <p>Вставьте содержимое буфера обмена в текстовое поле в разделе “Прямого подключения”. (ctrl-V)</p> </li> <li> <p>Нажмите “Добавить новое прямое подключение”, проверьте правильность и нажмите “Сохранить”.</p> </li> </ol> <p> </p> <p>Подробнее о закладках <a href=\"http://www.clipperz.com/support/user_guide/bookmarklet\" target=\"_blank\">здесь</a>.</p> ",
+'mainPanelDirectLoginBlockLabel':	"Прямые подключения",
+'directLinkReferenceShowButtonLabel':	"показать",
+'mainPanelDirectLoginBlockDescription':	"<p>Добавьте “Прямые подключения”, чтобы срау входить в веб-сервисы без ввода имени и пароля!</p> <p>“Прямые подключения” значительно усиливают безопасность, так как:</p> <ul> <li> <p>удобно принимать и вводить сложные пароли;</p> </li> <li> <p>никогда не надо использовать простой и один и тот же пароль.</p> </li> </ul> <p>Простая и быстрая конфигурация с помощью закладок.</p> <a href=\"http://www.clipperz.com/support/user_guide/direct_logins\" target=\"_blank\">Подробнее о прямых подключениях</a> ",
+'mainPanelRecordsBlockLabel':	"Карточки",
+'mainPanelAddRecordButtonLabel':	"Добавить новую карточку",
+'mainPanelRemoveRecordButtonLabel':	"Удалить карточку",
+'mainPanelRecordFilterBlockAllLabel':	"все",
+'mainPanelRecordFilterBlockTagsLabel':	"теги",
+'mainPanelRecordFilterBlockSearchLabel':	"поиск",
+'recordDetailNoRecordAtAllTitle':	"Добро пожаловать в Clipperz!",
+'recordDetailNoRecordAtAllDescription':	"<h5>Начните, добавив карточку.</h5> <p>Карточки - это простой и гибкий инструмент, с помощью которого Вы можете хранить пароли и любую другую информацию.</p> <p>Карточки могут содержать учетные записи для доступа к веб-сайтам, код для замка от велосипеда, данные кредитной карточки, ...</p> <h5>Не забывай о закладках!</h5> <p>Перед началом работы установите закладку “Добавить в Clipperz”: создание карточек будет простым и забавным.</p> <p>Перейдите на панель закладок, чтобы изучить, как установить и использовать их.</p> <p> </p> <a href=\"http://www.clipperz.com/support/user_guide/managing_cards\" target=\"_blank\">Подробнее об создании и управлениями закладками</a> ",
+'newRecordWizardTitleBox':	"<h5>Пожайлуста, выберите шаблон</h5> <p>Карточки - это простой и гибкий инструмент, с помощью которого Вы можете хранить пароли и любую другую информацию.</p> <p>Выберите один из шаблонов. Вы всегда сможете настроить ваши карточки, добавляя или удаляя поля.</p> ",
+'newRecordWizardBookmarkletConfigurationTitle':	"Прямое подключение",
+'newRecordWizardBookmarkletConfigurationDescription':	"<p>Вставьте конфигурационный код, сгенерированный с помощью закладки</p> <p>Будет создана новая карточка с поддержкой прямого подключения.</p> ",
+'newRecordWizardCreateButtonLabel':	"Создать",
+'newRecordWizardCancelButtonLabel':	"Отмена",
+'donateSplashPanelTitle':	"Поддержите Clipperz, сделайте пожертвование сегодня!",
+'donateSplashPanelDescription':	"<p>Несколько причин сделать пожертвование:</p> <ul> <li> <p>поддержка развития новых функций</p> </li> <li> <p>оставить Clipperz бесплатным</p> </li> <li> <p>показать признательность нашей упорной работе</p> </li> </ul> <p>Для дополнительной информации посетите нашу <a href=\"http://www.clipperz.com/donations\" target=\"_blank\">страницу пожертвований</a>.</p> <p> <b>Готовы пожертвовать?</b> </p> ",
+'donateCloseButtonLabel':	"Еще нет",
+'donateDonateButtonLabel':	"Да",
+	'recordTemplates':	{
+		'WebAccount':	{
+			'title':	"Интернет Пароль",
+			'description':	"Простая форма для хранения учетной записи в онлайновый сервис."
+		},
+		'BankAccount':	{
+			'title':	"Банковский аккаунт",
+			'description':	"Безопасное хранение номера Вашей банковской карты и учетной записи для онлайнового банкинга."
+		},
+		'CreditCard':	{
+			'title':	"Кредитная карта",
+			'description':	"Номер карты, срок действия, CCV2 и ПИН всегда в Ваших руках."
+		},
+		'AddressBookEntry':	{
+			'title':	"Запись адресной книги",
+			'description':	"Clipperz может также работать, как новая частная адресная книга. Используйте этот шаблон, чтобы легко добавить новую запись."
+		},
+		'Custom':	{
+			'title':	"Пользовательская карточка",
+			'description':	"Не важно, какие данные нужно защитить, просто создайте карточку."
+		}
+	},
+	'recordFieldTypologies':	{
+		'TXT':	{
+			'description':	"simple text field",
+			'shortDescription':	"текст"
+		},
+		'PWD':	{
+			'description':	"simple text field, with default status set to hidden",
+			'shortDescription':	"пароль"
+		},
+		'URL':	{
+			'description':	"simple text field in edit mode, that became an active url in view mode",
+			'shortDescription':	"веб-адрес"
+		},
+		'DATE':	{
+			'description':	"a value set with a calendar helper",
+			'shortDescription':	"дата"
+		},
+		'ADDR':	{
+			'description':	"just like the URL, but the active link points to Google Maps (or similar service) passing the address value as argument",
+			'shortDescription':	"почтовый адрес"
+		},
+		'CHECK':	{
+			'description':	"check description",
+			'shortDescription':	"check"
+		},
+		'RADIO':	{
+			'description':	"radio description",
+			'shortDescription':	"radio"
+		},
+		'SELECT':	{
+			'description':	"select description",
+			'shortDescription':	"select"
+		}
+	},
+'newRecordPanelGeneralExceptionTitle':	"Ошибка",
+'newRecordPanelGeneralExceptionMessage':	"Конфигурационный текст неверен. Убедитесь, что Вы взяли его из окна закладки и попробуйте снова.",
+'newRecordPanelWrongBookmarkletVersionExceptionTitle':	"Ошибка",
+'newRecordPanelWrongBookmarkletVersionExceptionMessage':	"Конфигурационный текст был сгенерирован с помощью старой весии закладок. Пожайлуста, обновите Вашу закладку и попробуйте снова.",
+'newRecordPanelExceptionPanelCloseButtonLabel':	"Отмена",
+'mainPanelDeletingRecordPanelConfirmationTitle':	"Удаление выбранной карточки",
+'mainPanelDeleteRecordPanelConfirmationText':	"Вы действительно хотите удалить эту карточку?",
+'mainPanelDeleteRecordPanelConfirmButtonLabel':	"Ага",
+'mainPanelDeleteRecordPanelDenyButtonLabel':	"Не-а",
+'mainPanelDeletingRecordPanelInitialTitle':	"Удаление выбранной карточки",
+'mainPanelDeletingRecordPanelCompletedText':	"Выполнено",
+'deleteRecordPanelCollectRecordDataMessageTitle':	"Удаление карточки",
+'deleteRecordPanelCollectRecordDataMessageText':	"Обновление списка карточек",
+'deleteRecordPanelEncryptUserDataMessageTitle':	"Удаление карточки",
+'deleteRecordPanelEncryptUserDataMessageText':	"Шифрование заголовков карточек",
+'deleteRecordPanelSendingDataToTheServerMessageTitle':	"Удаление карточки",
+'deleteRecordPanelSendingDataToTheServerMessageText':	"Передача зашифрованных заголовков карчточек в Clipperz",
+'deleteRecordPanelUpdatingTheInterfaceMessageTitle':	"Удаление карточки",
+'deleteRecordPanelUpdatingTheInterfaceMessageText':	"Обновление интерфейса",
+'recordDetailNoRecordSelectedTitle':	"Не выбрана карточка",
+'recordDetailNoRecordSelectedDescription':	"<p>Пожайлуста, выберите карточку из списка слева.</p> ",
+'recordDetailLoadingRecordMessage':	"Загрузка зашифрованных карточек из Clipperz",
+'recordDetailDecryptingRecordMessage':	"Расшифровка данных карточек",
+'recordDetailLoadingRecordVersionMessage':	"Загрузка последней версии карточкиn",
+'recordDetailDecryptingRecordVersionMessage':	"Расшифровка",
+'recordDetailLoadingErrorMessageTitle':	"Ошибка при загрузку",
+'recordDetailNotesLabel':	"Примечания",
+'recordDetailLabelFieldColumnLabel':	"Метка поля",
+'recordDetailDataFieldColumnLabel':	"Данные поля",
+'recordDetailTypeFieldColumnLabel':	"Тип",
+'recordDetailSavingChangesMessagePanelInitialTitle':	"Сохранение карточки",
+'recordDetailAddFieldButtonLabel':	"Добавить новое поле",
+'recordDetailPasswordFieldHelpLabel':	"чтобы скопировать пароль в буфер обмена, нажмите на звездочку, затем Ctrl-C",
+'recordDetailPasswordFieldScrambleLabel':	"спрятать",
+'recordDetailPasswordFieldUnscrambleLabel':	"показать",
+'recordDetailDirectLoginBlockTitle':	"Прямые подключения",
+'recordDetailNewDirectLoginDescription':	"<p>Настройка прямых подключений</p> ",
+'recordDetailDirectLoginBlockNoDirectLoginConfiguredDescription':	"<p>В этой карточке есть данные для доступа в онлайновый сервис?</p> <p>Используйте закладки, чтобы настроить “прямые подключения”!</p> ",
+'recordDetailAddNewDirectLoginButtonLabel':	"Добавить новое прямое подключение",
+'recordDetailEditButtonLabel':	"Редактировать",
+'recordDetailSaveButtonLabel':	"Сохранить",
+'recordDetailCancelButtonLabel':	"Отмена",
+'newRecordTitleLabel':	"_новую карточку_",
+'recordSaveChangesPanelCollectRecordInfoMessageTitle':	"Сохранение карточки",
+'recordSaveChangesPanelCollectRecordInfoMessageText':	"Обновление заголовков карточек",
+'recordSaveChangesPanelEncryptUserDataMessageTitle':	"Сохранение карточки",
+'recordSaveChangesPanelEncryptUserDataMessageText':	"Шифрование заголовков карточки",
+'recordSaveChangesPanelEncryptRecordDataMessageTitle':	"Сохранение карточки",
+'recordSaveChangesPanelEncryptRecordDataMessageText':	"Шифровани данных карточки",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageTitle':	"Сохранение карточки",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageText':	"Шифрование данных версии карточки",
+'recordSaveChangesPanelSendingDataToTheServerMessageTitle':	"Сохранение карточки",
+'recordSaveChangesPanelSendingDataToTheServerMessageText':	"Передача зашифрованного заголовка карточки в Clipperz",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageTitle':	"Сохранение карточки",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageText':	"Обновление интерфейса",
+'passwordGeneratorPanelTitle':	"Генератор паролей",
+'passwordGeneratorPanelOkLabel':	"OK",
+'passwordGeneratorPanelCancelLabel':	"Отмена",
+'passwordGeneratorLengthLabel':	"длина:",
+//'DWRUtilLoadingMessage':	"Загрузка данных ...",
+'comingSoon':	"вскоре ...",
+'panelCollectingEntryopyMessageText':	"Определение энтропии",
+'directLoginConfigurationCheckBoxFieldSelectedValue':	"Да",
+'directLoginConfigurationCheckBoxFieldNotSelectedValue':	"Нет",
+'WELCOME_BACK':	"Добро пожаловать снова!",
+'currentConnectionText':	"Сейчас вы подключились с ip&nbsp;__ip__, очевидно __country__, используя __browser__ на __operatingSystem__.",
+'latestConnectionText':	"Последнее соединение было __elapsedTimeDescription__ (__time__) с ip&nbsp;__ip__, очевидно __country__, используя __browser__ на __operatingSystem__.",
+'fullLoginHistoryLinkLabel':	"показать полную историю входов",
+'elapsedTimeDescriptions':	{
+	'MORE_THAN_A_MONTH_AGO':	"за месяц",
+	'MORE_THAN_A_WEEK_AGO':	"за неделю",
+	'MORE_THAN_*_WEEKS_AGO':	"за несколько __elapsed__ недель",
+	'YESTERDAY':	"вчера",
+	'*_DAYS_AGO':	"__elapsed__ дней(-я)",
+	'ABOUT_AN_HOUR_AGO':	"за час",
+	'*_HOURS_AGO':	"__elapsed__ часов(-а)",
+	'JUST_A_FEW_MINUTES_AGO':	"несколько минут",
+	'ABOUT_*_MINUTES_AGO':	"около __elapsed__ минут"
+},
+'unknown_ip':	"неизвестный",
+'calendarStrings':	{
+	'months':	{
+		'0':	"Январь",
+		'1':	"Февраль",
+		'2':	"Март",
+		'3':	"Апрель",
+		'4':	"Май",
+		'5':	"Июнь",
+		'6':	"Июль",
+		'7':	"Август",
+		'8':	"Сентябрь",
+		'9':	"Октябрь",
+		'10':	"Ноябрь",
+		'11':	"Декабрь"
+	},
+	'shortMonths':	{
+		'0':	"Янв",
+		'1':	"Фев",
+		'2':	"Мар",
+		'3':	"Апр",
+		'4':	"Май",
+		'5':	"Июн",
+		'6':	"Июл",
+		'7':	"Авг",
+		'8':	"Сен",
+		'9':	"Окт",
+		'10':	"Ноя",
+		'11':	"Дек"
+	},
+	'days':	{
+		'0':	"Воскресенье",
+		'1':	"Понедельник",
+		'2':	"Вторник",
+		'3':	"Среда",
+		'4':	"Четверг",
+		'5':	"Пятница",
+		'6':	"Суббота"
+	},
+	'shortDays':	{
+		'0':	"Вск",
+		'1':	"Пон",
+		'2':	"Втр",
+		'3':	"Сре",
+		'4':	"Чет",
+		'5':	"Пят",
+		'6':	"Суб"
+	},
+	'amDesignation':	"am",
+	'pmDesignation':	"pm"
+},
+
+__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/PM/Strings/Strings_zh-CN.js b/frontend/beta/js/Clipperz/PM/Strings/Strings_zh-CN.js
new file mode 100644
index 0000000..a1d09f1
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Strings/Strings_zh-CN.js
@@ -0,0 +1,477 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+Clipperz.PM.Strings.Languages['zh-CN'.toLowerCase()] = MochiKit.Base.merge(Clipperz.PM.Strings.Languages['en-us'], {
+'clipperzServiceDescription':	"<h2>只有你知道</h2> <ul> <li> <h3>Clipperz 是:</h3> <ul> <li> <p>一个简单而又安全的密码管理员</p> </li> <li> <p>一个有效的单一登录解决方案</p> </li> <li> <p>一个您保密的资料数据库</p> </li> </ul> </li> <li> <h3> 使用 Clipperz 你能:</h3> <ul> <li> <p>储存和管理你的密码和网上证书</p> </li> <li> <p>无需输入密码自动帮助你登录网站服务</p> </li> <li> <p>保护你的敏感数据:通讯录,口令,信用卡号码, ...</p> </li> <li> <p>与家人和伙伴分享秘密(将要上线)</p> </li> </ul> </li> <li> <h3>Clipperz 的特点:</h3> <ul> <li> <p>免费，彻底匿名</p> </li> <li> <p>在任何时间 任何电脑都可以轻松获取你的密码</p> </li> <li> <p>无需下载和安装任何软件</p> </li> <li> <p>再也无需在电脑或者纸上记录密码了</p> </li> </ul> </li> <li> <h3>Clipperz 的安全性:</h3> <ul> <li> <p>密码将在本地浏览器加密，然后上传至 Clipperz</p> </li> <li> <p>加密密钥是一个只有你知道的密码短语</p> </li> <li> <p>Clipperz 服务会加密你的敏感数据，并不会出现数据的原始形式</p> </li> <li> <p>Clipperz 基于加密标准，没有任何的花哨</p> </li> <li> <p>只要你愿意，你随时都可以查看源代码，但是做为一个使用者来说完全没有去必要去了解那些繁琐的加密原理</p> </li> </ul> </li> <li> <a href=\"http://www.clipperz.com\" target=\"_blank\">更多</a> </li> </ul> ",
+'loginFormTitle':	"用你的 Clipperz 帐户登录",
+'loginFormUsernameLabel':	"用户名",
+'loginFormPassphraseLabel':	"密码短语",
+'loginFormDontHaveAnAccountLabel':	"还未建立帐户？",
+'loginFormCreateOneLabel':	"创建一个新帐户",
+'loginFormForgotYourCredentialsLabel':	"忘记你的证书？",
+'loginFormAarghThatsBadLabel':	"呃？这下糟糕了",
+'loginFormAfraidOfMaliciousScriptsLabel':	"害怕有恶意脚本？",
+'loginFormVerifyTheCodeLabel':	"验证代码",
+'loginFormButtonLabel':	"登录",
+'loginFormOneTimePasswordCheckboxLabel':	"使用一次性密码短语",
+'loginPanelSwithLanguageDescription':	"<h5>选择你的第一语言</h5> ",
+'browserCompatibilityDescription':	"<p>使用 Firefox 将得到更快更安全的 Clipperz 服务。不过 Clipperz 同样可以很好的工作在 Opera 和 微软的 IE 中。</p> ",
+'OTPloginMessagePanelInitialTitle':	"用一次性密码短语登录",
+'OTPloginMessagePanelInitialText':	"发送 OTP 证书 ...",
+'OTPloginMessagePanelLoadingTitle':	"用一次性密码短语登录",
+'OTPloginMessagePanelLoadingText':	"从服务器读取加密认证数据 ...",
+'OTPloginMessagePanelProcessingTitle':	"用一次性密码短语登录",
+'OTPloginMessagePanelProcessingText':	"本地解密认证数据",
+'loginMessagePanelInitialTitle':	"登录中...",
+'loginMessagePanelInitialButtonLabel':	"取消",
+'loginMessagePanelConnectedTitle':	"连接成功",
+'loginMessagePanelConnectedText':	"完成",
+'loginMessagePanelFailureTitle':	"错误",
+'loginMessagePanelFailureText':	"登录失败",
+'loginMessagePanelFailureButtonLabel':	"取消",
+'connectionLoginSendingCredentialsMessageTitle':	"验证证书",
+'connectionLoginSendingCredentialsMessageText':	"传送证书",
+'connectionLoginCredentialsVerificationMessageTitle':	"验证证书",
+'connectionLoginCredentialsVerificationMessageText':	"进行 SRP 认证",
+'connectionLoginDoneMessageTitle':	"验证证书",
+'connectionLoginDoneMessageText':	"已连接",
+'userLoginPanelUpgradingUserCredentialsMessageTitle':	"验证证书",
+'userLoginPanelUpgradingUserCredentialsMessageText':	"升级证书到新的认证模式",
+'userLoginPanelConnectedMessageTitle':	"用户识别",
+'userLoginPanelConnectedMessageText':	"成功登录",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageTitle':	"验证证书",
+'userLoginPanelTryingAnOlderConnectionSchemaMessageText':	"旧认证模式失效",
+'userLoginPanelLoadingUserDataMessageTitle':	"用户识别",
+'userLoginPanelLoadingUserDataMessageText':	"正在从 Clipperz 下载加密卡报头",
+'userLoginPanelDecryptingUserDataMessageTitle':	"用户识别",
+'userLoginPanelDecryptingUserDataMessageText':	"加密卡报头本地解密",
+'userLoginPanelDecryptingUserStatisticsMessageTitle':	"用户识别",
+'userLoginPanelDecryptingUserStatisticsMessageText':	"本地解密使用统计",
+'splashAlertTitle':	"Clipperz 欢迎您",
+'splashAlertText':	"<p>安全忠告</p> <ul> <li> <p>在 Clipperz ，用你选择的密码短语保存数据是安全的。没有人能够得到这些数据，除非他们有你的密码。</p> </li> <li> <p> 如果你决定使用 Clipperz 保护敏感数据和关键资料，请务必选用一个复杂的密码短语。越长越好</p> </li> <li> <p>注意:Clipperz将无法找回忘记的密码码短语!</p> </li> </ul> <p>获得更多的说明，请前往 <a href=\"http://www.clipperz.com\" target=\"_blank\">Clipperz</a> 网站.</p> ",
+'splashAlertCloseButtonLabel':	"确定",
+'registrationFormTitle':	"创建你的帐户",
+'registrationFormUsernameLabel':	"用户名",
+'registrationFormPassphraseLabel':	"密码短语",
+'registrationFormRetypePassphraseLabel':	"确认密码短语",
+'registrationFormSafetyCheckLabel':	"我明白 Clipperz 无法找回忘记的密码短语.",
+'registrationFormTermsOfServiceCheckLabel':	"我同意接受 <a href='http://www.clipperz.com/terms_of_service' target='_blank'>服务条款</a> 款.",
+'registrationFormDoYouAlreadyHaveAnAccountLabel':	"如果已有一个 Clipperz 帐户",
+'registrationFormSimplyLoginLabel':	"在此登录",
+'registrationFormButtonLabel':	"注册",
+'registrationFormWarningMessageNotMatchingPassphrases':	"两次密码短语不同，请重新输入",
+'registrationFormWarningMessageSafetyCheckNotSelected':	"请阅读并检查下面的选项框",
+'registrationFormWarningMessageTermsOfServiceCheckNotSelected':	"您需要同意服务条款",
+'registrationMessagePanelInitialTitle':	"创建账户...",
+'registrationMessagePanelInitialButtonLabel':	"取消",
+'registrationMessagePanelRegistrationDoneTitle':	"注册",
+'registrationMessagePanelRegistrationDoneText':	"完成",
+'registrationMessagePanelFailureTitle':	"注册失败",
+'registrationMessagePanelFailureButtonLabel':	"关闭",
+'connectionRegistrationSendingRequestMessageText':	"验证证书",
+'connectionRegistrationSendingCredentialsMessageText':	"传送证书",
+'registrationSplashPanelTitle':	"安全忠告",
+'registrationSplashPanelDescription':	"<p>这是你的 Clipperz 证书，请保存好。Clipperz 永远不会第二次显示你的用户名和密码短语</p> ",
+'registrationSplashPanelUsernameLabel':	"用户名",
+'registrationSplashPanelPassphraseLabel':	"密码短语",
+'registrationSplashPanelShowPassphraseButtonLabel':	"显示密码短语",
+'donateHeaderLinkLabel':	"捐赠",
+'creditsHeaderLinkLabel':	"致谢",
+'feedbackHeaderLinkLabel':	"反馈",
+'helpHeaderLinkLabel':	"帮助",
+'forumHeaderLinkLabel':	"论坛",
+'recordMenuLabel':	"密码卡片",
+'accountMenuLabel':	"账户",
+'dataMenuLabel':	"资料",
+'contactsMenuLabel':	"联系",
+'toolsMenuLabel':	"工具",
+'logoutMenuLabel':	"暂时离开",
+'lockMenuLabel':	"安全锁",
+'lockTitle':	"账户被锁定",
+'lockDescription':	"<p>请输入你的密码短语解开账户</p> ",
+'unlockButtonLabel':	"解锁",
+'changePasswordTabLabel':	"修改密码短语",
+'changePasswordTabTitle':	"修改密码短语",
+'changePasswordFormUsernameLabel':	"用户名",
+'changePasswordFormOldPassphraseLabel':	"旧密码短语",
+'changePasswordFormNewPassphraseLabel':	"新密码短语",
+'changePasswordFormRetypePassphraseLabel':	"确认密码短语",
+'changePasswordFormSafetyCheckboxLabel':	"我知道 Clipperz 不能找回丢失的密码短语",
+'changePasswordFormSubmitLabel':	"修改密码短语",
+'changePasswordFormWrongUsernameWarning':	"用户名错误",
+'changePasswordFormWrongPassphraseWarning':	"旧密码短语错误",
+'changePasswordFormWrongRetypePassphraseWarning':	"两次密码短语不同，请重新输入",
+'changePasswordFormSafetyCheckWarning':	"请阅读并检查下面的选项框",
+'changePasswordFormProgressDialogTitle':	"正在修改密码短语",
+'changePasswordFormProgressDialogConnectedMessageTitle':	"连接",
+'changePasswordFormProgressDialogConnectedMessageText':	"完成",
+'changePasswordFormProgressDialogErrorMessageTitle':	"错误",
+'changePasswordFormProgressDialogErrorMessageText':	"证书修改失败",
+'changeCredentialsPanelEncryptingDataMessageTitle':	"正在修改你的密码短语",
+'changeCredentialsPanelEncryptingDataMessageText':	"加密卡报头本地解密",
+'changeCredentialsPanelCreatingNewCredentialsMessageTitle':	"正在修改你的密码短语",
+'changeCredentialsPanelCreatingNewCredentialsMessageText':	"更新你的证书",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageTitle':	"正在修改你的密码短语",
+'changeCredentialsPanelSendingNewCredentialsToTheServerMessageText':	"正在上传本地证书到 Clipperz",
+'changeCredentialsPanelDoneMessageTitle':	"正在修改你的密码短语",
+'changeCredentialsPanelDoneMessageText':	"完成",
+'manageOTPTabLabel':	"管理你的一次性密码短语",
+'manageOTPTabTitle':	"管理你的一次性密码短语",
+'manageOTPTabDescription':	"<p>一次性密码短语工作起来和一般的密码短语一样，但是只可以使用一次</p> <p>如果同样的密码短语在一段时间以内再次登录，会被拒绝。登录进程将会失败。</p> <p>为了防止任何欺诈登录，在成功登陆之后，你的一次性密码将会立即被删除，</p> <p>如果一次性密码被键盘记录程序或者间谍软件得到，可能会从被感染的机器上收集数据，这样的话，一次性密码绝对是个很好的选择。</p> <p> <b>强烈建议在公共场合登录 Clipperz 时，使用一次性密码。比如公关计算机，网吧，图书馆等</b> </p> ",
+'oneTimePasswordReadOnlyMessage':	"<h6>对不起！</h6> <p>你不能从离线版本管理你的一次性密码短语</p> ",
+'oneTimePasswordLoadingMessage':	"<h6>加载数据</h6> <p>请等待 ...</p> ",
+'oneTimePasswordNoPasswordAvailable':	"<h6>一次性密码短语没有激活</h6> <p>点击“新建”按钮添加一次性密码短语到你的帐户</p> ",
+'createNewOTPButtonLabel':	"新建",
+'deleteOTPButtonLabel':	"删除",
+'printOTPButtonLabel':	"打印",
+'disabledOneTimePassword_warning':	"禁用",
+'oneTimePasswordSelectionLink_selectLabel':	"选择:",
+'oneTimePasswordSelectionLink_all':	"所有",
+'oneTimePasswordSelectionLink_none':	"没有",
+'oneTimePasswordSelectionLink_used':	"被使用",
+'oneTimePasswordSelectionLink_unused':	"未使用",
+'saveOTP_encryptUserDataTitle':	"保存一次性密码短语",
+'saveOTP_encryptUserDataText':	"处理新的 OTP 证书 ...",
+'saveOTP_encryptOTPDataTitle':	"保存一次性密码短语",
+'saveOTP_encryptOTPDataText':	"本地解密认证数据 ...",
+'saveOTP_sendingDataTitle':	"保存一次性密码短语",
+'saveOTP_sendingDataText':	"发送信任数据到服务器 ...",
+'saveOTP_updatingInterfaceTitle':	"保存一次性密码短语",
+'saveOTP_updatingInterfaceText':	"更新界面...",
+'accountPreferencesLabel':	"使用偏好",
+'accountPreferencesTabTitle':	"使用偏好",
+'accountPreferencesLanguageTitle':	"界面语言选择",
+'accountPreferencesLanguageDescription':	"<p>在下拉菜单中选择你的首选语言</p> ",
+'showDonationReminderPanelTitle':	"捐赠提示",
+'showDonationReminderPanelDescription':	"<p>显示捐赠提示</p> ",
+'saveUserPreferencesFormSubmitLabel':	"保存",
+'cancelUserPreferencesFormSubmitLabel':	"取消",
+'accountPreferencesSavingPanelTitle_Step1':	"保存使用偏好",
+'accountPreferencesSavingPanelText_Step1':	"本地加密你的使用偏好",
+'accountPreferencesSavingPanelTitle_Step2':	"保存使用偏好",
+'accountPreferencesSavingPanelText_Step2':	"正在向 Clipperz 传送加密后的使用偏好",
+'accountLoginHistoryLabel':	"登录历史",
+'loginHistoryTabTitle':	"登录历史",
+'loginHistoryReadOnlyMessage':	"<h6>对不起！</h6> <p>当你使用离线版本时登录历史是无法显示的</p> ",
+'loginHistoryLoadingMessage':	"<h6>加载数据</h6> <p>请等待 ...</p> ",
+'loginHistoryLoadedMessage':	"<h6>您的最近 10 次登陆</h6> <p> </p> ",
+'loginHistoryIPLabel':	"IP",
+'loginHistoryTimeLabel':	"时间",
+'loginHistoryCurrentSessionText':	"当前登录信息",
+'loginHistoryReloadButtonLabel':	"刷新登录历史",
+'deleteAccountTabLabel':	"删除你的账户",
+'deleteAccountTabTitle':	"删除你的账户",
+'deleteAccountFormUsernameLabel':	"用户名",
+'deleteAccountFormPassphraseLabel':	"密码短语",
+'deleteAccountFormSafetyCheckboxLabel':	"我知道我的所有数据将被删除,并且是不可回复的.",
+'deleteAccountFormSubmitLabel':	"删除我的账户",
+'deleteAccountFormWrongUsernameWarning':	"用户名错误",
+'deleteAccountFormWrongPassphraseWarning':	"密码短语错误",
+'deleteAccountFormSafetyCheckWarning':	"请阅读并检查下面的选项框",
+'accountPanelDeletingAccountPanelConfirmationTitle':	"注意",
+'accountPanelDeleteAccountPanelConfirmationText':	"你确认要删除你的帐户",
+'accountPanelDeleteAccountPanelConfirmButtonLabel':	"是",
+'accountPanelDeleteAccountPanelDenyButtonLabel':	"否",
+'offlineCopyTabLabel':	"离线拷贝",
+'offlineCopyTabTitle':	"离线拷贝",
+'offlineCopyTabDescription':	"<p>只需点击一次就可以从 Clipperz 服务器下载所有加密数据到你的硬盘，让你在不能连接互联网的时候使用离线只读版本的 Clipperz。</p> <p>你下载的离线数据和登陆我们网站在线使用是一样安全的，它们使用了同样的密码和安全体系，都不会有暴露数据的风险。</p> <ol> <li> <p>点击链接后开始下载。</p> </li> <li> <p>浏览器会问你如何处理 “Clipperz_YYYYMMDD.html” 文件。保存这个文件到你的硬盘。</p> </li> <li> <p>双击下载的文件在浏览器运行离线版本。</p> </li> <li> <p>输入你的用户名和密码短语。</p> </li> </ol> ",
+'offlineCopyDownloadLinkLabel':	"下载",
+'offlineCopyDownloadWarning':	"<h4> <a href=\"#\" id=\"offlineCopyDownloadWarningLink\">更新你的“离线版本”!</a> </h4> <p>你最近创建或修改了卡片，需要下载新的“离线版本”</p> ",
+'sharingTabLabel':	"共享",
+'sharingTabTitle':	"共享",
+'sharingTabDescription':	"<p>往往一个机密的资料需要另外一个人或者多人共同使用</p> <p>你可以在这里设置一个简单的授权码,以便在离开办公室的时候你的同事可以访问你的邮箱，或者设置一个复杂的，当你去世后子孙可以在这里找到取得银行保险箱的方法。</p> <p>Clipperz 可以安全并且简单的分享你的密码</p> <p> </p> <p> <b>即将发布...</b> </p> ",
+'importTabLabel':	"导入",
+'importTabTitle':	"导入",
+'importTabDescription':	"<p> <b>即将发布 ...</b> </p> ",
+'printingTabLabel':	"导出",
+'printingTabTitle':	"导出",
+'printingTabDescription':	"<p> <b>打印你的数据</b> </p> <p>点击下面的链接，将会打开一个新窗口，以打印格式显示你的密码卡片</p> <p>如果你打印下来是为了备份，请考虑使用我们提供的\"离线版本\"，这比打印更安全。</p> ",
+'printingLinkLabel':	"打印版本",
+'contactsTabLabel':	"联系",
+'contactsTabTitle':	"联系",
+'passwordGeneratorTabLabel':	"随机密码生成器",
+'passwordGeneratorTabTitle':	"随机密码生成器",
+'passwordGeneratorTabButtonLabel':	"生成随机密码",
+'bookmarkletTabLabel':	"书签按钮",
+'bookmarkletTabTitle':	"书签按钮",
+'bookmarkletTabDescription':	"<p>这个书签按钮是一个简单的非常有用的“一键”工具，它能像一般网站一样储存并且使用</p> <p>Clipperz 按钮书签可以帮助你快速建立密码卡片并且用存在的密码卡片直接登录</p> <p> <b>请注意，这个书签按钮不包含你账户中的任何信息（例如你的用户名和密码），对所有的 Clipperz 使用者，这个书签按钮是大家的工具，代码都是相同的。</b> </p> <h3>怎样安装书签按钮</h3> <h5>Firefox, Camino, Opera, Safari</h5> <ol> <li> <p>选择 “查看 > 工具栏 > 书签工具栏” 确认 “书签工具栏” 显示在浏览器菜单上。</p> </li> <li> <p>拖动 “添加到 Clipperz” 链接到书签工具栏。</p> </li> </ol> <h5>Internet Explorer</h5> <ol> <li> <p>选择 “查看 > 工具栏 > 链接” 确认 “链接” 显示在浏览器菜单上。</p> </li> <li> <p>右键 “添加到 Clipperz”</p> </li> <li> <p>选择 “添加到收藏夹”</p> </li> <li> <p>如果弹出安全提示选择 “是”</p> </li> <li> <p>打开 “链接” 文件夹后单击 “添加”</p> </li> </ol> ",
+'bookmarkletTabBookmarkletTitle':	"添加到 Clipperz",
+'bookmarkletTabInstructions':	"<h3>如何在一个在线服务中创建可以直接登录的新的密码卡片</h3> <ol> <li> <p>打开你要登录的页面（这个页面通常就是你输入登录信息的页面）</p> </li> <li> <p>点击书签按钮，会出现一个新的弹出窗口</p> </li> <li> <p>复制弹出窗口中的所有文本到剪贴板（ctrl+c）</p> </li> <li> <p>登录你的 Clipperz 账户，然后点击 <b>新建密码卡片</b> 按钮</p> </li> <li> <p>选择“直接登录”模板，之后粘贴剪贴板中的内容到大文本框（ctrl+v）</p> </li> <li> <p>按下 <b>创建</b> 按钮，检查细节并且点击 <b>保存</b>.</p> </li> </ol> <h3>对于已经存在的密码卡片如何添加直接登陆</h3> <ol> <li> <p>与上面的步骤相同</p> </li> <li> <p>与上面的步骤相同</p> </li> <li> <p>与上面的步骤相同</p> </li> <li> <p>输入你的 Clipperz 帐号，选择你刚刚访问的网络服务的密码卡片然后点击 <b>编辑</b> 按钮.</p> </li> <li> <p>将剪贴板中的内容粘贴到“直接登录”区域的大文本框中 (ctrl-V)</p> </li> <li> <p>点击添加 <b>自动登录</b> 按钮，检查细节并且点击k <b>保存</b>.</p> </li> </ol> <p> </p> <p>如果需要关于书签按钮的进一步资料可以在 <a href=\"http://www.clipperz.com/support/user_guide/bookmarklet\" target=\"_blank\">这里获得</a>.</p> ",
+'mainPanelDirectLoginBlockLabel':	"直接登录",
+'directLinkReferenceShowButtonLabel':	"显示",
+'mainPanelDirectLoginBlockDescription':	"<p>添加 “直接登录” 可以让你不用输入用户名和密码即可登录网络账户</p> <p>“直接登录” 可以大大提高你的密码安全性，因为你可以：</p> <ul> <li> <p>方便选择和输入复杂的密码</p> </li> <li> <p>永远不再使用相同的，容易猜测的密码</p> </li> </ul> <p>用 Clipperz 书签按钮简单快速的配置</p> <a href=\"http://www.clipperz.com/support/user_guide/direct_logins\" target=\"_blank\">关于 “直接登录” 的更多信息</a> ",
+'mainPanelRecordsBlockLabel':	"密码卡片",
+'mainPanelAddRecordButtonLabel':	"添加新密码卡片",
+'mainPanelRemoveRecordButtonLabel':	"删除密码卡片",
+'mainPanelRecordFilterBlockAllLabel':	"所有",
+'mainPanelRecordFilterBlockTagsLabel':	"标签",
+'mainPanelRecordFilterBlockSearchLabel':	"搜索",
+'recordDetailNoRecordAtAllTitle':	"欢迎来到 Clipperz!",
+'recordDetailNoRecordAtAllDescription':	"<h5>从你的账户添加密码卡片开始</h5> <p>密码卡片是简单灵活的方式，在这里你可以保存你的密码和其他机密资料.</p> <p>密码卡片含有一个全权访问网站的证书,你的通讯录，你的信用卡信息,……</p> <h5>不要忘记书签按钮</h5> <p>在你开始前，安装 “添加到 Clipperz” 书签按钮：它将使创建密码卡片变得简单并且有趣</p> <p>去书签按钮标签了解如何安装并使用它</p> <p> </p> <p>然后只需单击 “添加密码卡片” 按钮，即可尽情享受 Clipperz 帐户.</p> <p> <a href=\"http://www.clipperz.com/support/user_guide/managing_cards\" target=\"_blank\">关于创建和管理密码卡片的更多信息</a> </p> ",
+'newRecordWizardTitleBox':	"<h5>请选择一个模板</h5> <p>密码卡片是简单灵活的方式，在这里你可以保存你的密码和其他机密资料.</p> <p>首先选择下面的一个模板。在添加或者删除以后,可以随时定制你的密码卡片.</p> ",
+'newRecordWizardBookmarkletConfigurationTitle':	"直接登陆",
+'newRecordWizardBookmarkletConfigurationDescription':	"<p>将从 Clipperz 书签按钮得到的代码粘贴到下面的文本框中</p> <p>一个直接登陆你的网络账户的新密码卡片将要被创建完成</p> ",
+'newRecordWizardCreateButtonLabel':	"创建",
+'newRecordWizardCancelButtonLabel':	"取消",
+'donateSplashPanelTitle':	"今天就捐赠支持 Clipperz!",
+'donateSplashPanelDescription':	"<p>捐赠我们的原因:</p> <ul> <li> <p>支持新特性的开发</p> </li> <li> <p>保持 Clipperz 的免费</p> </li> <li> <p>对我们的辛勤工作表示感谢</p> </li> </ul> <p> <a href=\"http://www.clipperz.com/donations\" target=\"_blank\">进一步资料，请浏览我们的捐款页</a>.</p> <p> <b>愿意捐款？</b> </p> ",
+'donateCloseButtonLabel':	"不必了",
+'donateDonateButtonLabel':	"是",
+'recordTemplates':	{
+	'WebAccount':	{
+		'title':	"网站密码",
+		'description':	"<p>为您的网上服务提供简单的密码储存，自动登录服务.</p> ",
+		'fields':	{
+			'URL':	"网址",
+			'TXT':	"用户名或者电子邮件地址",
+			'PWD':	"密码"
+		}
+	},
+	'BankAccount':	{
+		'title':	"银行帐户",
+		'description':	"<p>安全储存你的银行账号和网上银行证书.</p> ",
+		'fields':	{
+			'TXT':	"银行",
+			'TXT':	"帐号",
+			'URL':	"银行网站",
+			'TXT':	"在线银行 ID",
+			'PWD':	"在线银行密码"
+		}
+	},
+	'CreditCard':	{
+		'title':	"信用卡",
+		'description':	"<p>信用卡号码，有效日期，CVV2和PIN 都由 Clipperz 管理</p> ",
+		'fields':	{
+			'TXT':	"类型(VISA, AmEx, ...)",
+			'TXT':	"号码",
+			'TXT':	"持卡人姓名",
+			'TXT':	"有效日期",
+			'TXT':	"CVV2",
+			'PWD':	"PIN",
+			'URL':	"信用卡网站",
+			'TXT':	"用户名",
+			'PWD':	"密码"
+		}
+	},
+	'AddressBookEntry':	{
+		'title':	"通讯录条目",
+		'description':	"<p>Clipperz 同样可以为你的私人通讯录服务. 使用这个模板，轻易添加新的条目.</p> ",
+		'fields':	{
+			'TXT':	"姓名",
+			'TXT':	"电子邮件",
+			'TXT':	"电话",
+			'TXT':	"手机",
+			'ADDR':	"地址"
+		}
+	},
+	'Custom':	{
+		'title':	"定制密码卡片",
+		'description':	"<p>无论你需要保护哪种类型的机密数据，创建定制密码卡片便可满足你的需求</p> ",
+		'fields':	{
+			'TXT':	"标签 1",
+			'TXT':	"标签 2",
+			'TXT':	"标签 3"
+		}
+	}
+},
+'recordFieldTypologies':	{
+	'TXT':	{
+		'description':	"simple text field",
+		'shortDescription':	"文字"
+	},
+	'PWD':	{
+		'description':	"simple text field, with default status set to hidden",
+		'shortDescription':	"密码"
+	},
+	'URL':	{
+		'description':	"simple text field in edit mode, that became an active url in view mode",
+		'shortDescription':	"网址"
+	},
+	'DATE':	{
+		'description':	"a value set with a calendar helper",
+		'shortDescription':	"数据"
+	},
+	'ADDR':	{
+		'description':	"just like the URL, but the active link points to Google Maps (or similar service) passing the address value as argument",
+		'shortDescription':	"地址"
+	},
+	'CHECK':	{
+		'description':	"check description",
+		'shortDescription':	"check"
+	},
+	'RADIO':	{
+		'description':	"radio description",
+		'shortDescription':	"radio"
+	},
+	'SELECT':	{
+		'description':	"select description",
+		'shortDescription':	"select"
+	}
+},
+'newRecordPanelGeneralExceptionTitle':	"错误",
+'newRecordPanelGeneralExceptionMessage':	"配置文本不正确，请从书签中确认你的文本并且再试一次",
+'newRecordPanelWrongBookmarkletVersionExceptionTitle':	"错误",
+'newRecordPanelWrongBookmarkletVersionExceptionMessage':	"配置文本已经产生了一个旧版本书签，请更新你的书签然后再试试。",
+'newRecordPanelExceptionPanelCloseButtonLabel':	"取消",
+'mainPanelDeletingRecordPanelConfirmationTitle':	"删除所选密码卡片",
+'mainPanelDeleteRecordPanelConfirmationText':	"确认要删除选定的密码卡片？",
+'mainPanelDeleteRecordPanelConfirmButtonLabel':	"是",
+'mainPanelDeleteRecordPanelDenyButtonLabel':	"否",
+'mainPanelDeletingRecordPanelInitialTitle':	"删除选定的密码卡片",
+'mainPanelDeletingRecordPanelCompletedText':	"完成",
+'deleteRecordPanelCollectRecordDataMessageTitle':	"删除密码卡片",
+'deleteRecordPanelCollectRecordDataMessageText':	"更新密码卡片列表",
+'deleteRecordPanelEncryptUserDataMessageTitle':	"删除密码卡片",
+'deleteRecordPanelEncryptUserDataMessageText':	"加密卡报头本地解密",
+'deleteRecordPanelSendingDataToTheServerMessageTitle':	"删除密码卡片",
+'deleteRecordPanelSendingDataToTheServerMessageText':	"从 Clipperz 更新加密卡报头",
+'deleteRecordPanelUpdatingTheInterfaceMessageTitle':	"删除密码卡片",
+'deleteRecordPanelUpdatingTheInterfaceMessageText':	"更新界面",
+'recordDetailNoRecordSelectedTitle':	"未选择密码卡片",
+'recordDetailNoRecordSelectedDescription':	"<p>从左边的列表中选择一个密码卡片</p> ",
+'recordDetailLoadingRecordMessage':	"正在从 Clipperz 下载加密卡片",
+'recordDetailDecryptingRecordMessage':	"密码卡片数据本地解密",
+'recordDetailLoadingRecordVersionMessage':	"下载最新版本的密码卡片",
+'recordDetailDecryptingRecordVersionMessage':	"本地解密最新版本密码卡片",
+'recordDetailLoadingErrorMessageTitle':	"密码卡片下载错误",
+'recordDetailNotesLabel':	"注释",
+'recordDetailLabelFieldColumnLabel':	"标签区域",
+'recordDetailDataFieldColumnLabel':	"数据区域",
+'recordDetailTypeFieldColumnLabel':	"类型",
+'recordDetailSavingChangesMessagePanelInitialTitle':	"保存密码卡片",
+'recordDetailAddFieldButtonLabel':	"添加新区域",
+'recordDetailPasswordFieldHelpLabel':	"点击星星复制密码到剪贴板，然后用 Ctrl+V 使用",
+'recordDetailPasswordFieldScrambleLabel':	"隐藏密码",
+'recordDetailPasswordFieldUnscrambleLabel':	"显示密码",
+'recordDetailDirectLoginBlockTitle':	"直接登录",
+'recordDetailNewDirectLoginDescription':	"<p>直接登录配置</p> ",
+'recordDetailDirectLoginBlockNoDirectLoginConfiguredDescription':	"<p>这个密码卡片包含在线服务证书吗？</p> <p>仅仅单击就可以从 Clipperz 使用书签配置 “直接登录”</p> ",
+'recordDetailAddNewDirectLoginButtonLabel':	"添加新的直接登录",
+'recordDetailEditButtonLabel':	"编辑",
+'recordDetailSaveButtonLabel':	"保存",
+'recordDetailCancelButtonLabel':	"取消",
+'newRecordTitleLabel':	"_新密码卡片_",
+'recordSaveChangesPanelCollectRecordInfoMessageTitle':	"保存密码卡片",
+'recordSaveChangesPanelCollectRecordInfoMessageText':	"更新密码卡片报头",
+'recordSaveChangesPanelEncryptUserDataMessageTitle':	"保存密码卡片",
+'recordSaveChangesPanelEncryptUserDataMessageText':	"本地加密卡片报头",
+'recordSaveChangesPanelEncryptRecordDataMessageTitle':	"保存密码卡片",
+'recordSaveChangesPanelEncryptRecordDataMessageText':	"本地加密卡片数据",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageTitle':	"保存密码卡片",
+'recordSaveChangesPanelEncryptRecordVersionDataMessageText':	"本地加密密码卡片版本数据",
+'recordSaveChangesPanelSendingDataToTheServerMessageTitle':	"保存密码卡片",
+'recordSaveChangesPanelSendingDataToTheServerMessageText':	"从 Clipperz 更新加密卡报头",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageTitle':	"保存密码卡片",
+'recordSaveChangesPanelUpdatingTheInterfaceMessageText':	"更新界面",
+'passwordGeneratorPanelTitle':	"密码生成器",
+'passwordGeneratorPanelOkLabel':	"确认",
+'passwordGeneratorPanelCancelLabel':	"取消",
+'passwordGeneratorLengthLabel':	"长度:",
+//'DWRUtilLoadingMessage':	"加载数据。。。",
+'comingSoon':	"即将到来。。。",
+'panelCollectingEntryopyMessageText':	"收集平均信息",
+'directLoginConfigurationCheckBoxFieldSelectedValue':	"是",
+'directLoginConfigurationCheckBoxFieldNotSelectedValue':	"否",
+'WELCOME_BACK':	"欢迎回来!",
+'currentConnectionText':	"你的连接 IP 地址是&nbsp;__ip__; 来自 __country__, 在 __browser__ 上使用 __operatingSystem__。",
+'latestConnectionText':	"你上次的登录 IP 是&nbsp;__ip__ 在 __elapsedTimeDescription__ (__time__); 来自 __country__, 在 __browser__ 上使用 __operatingSystem__。",
+'fullLoginHistoryLinkLabel':	"显示所有登录历史",
+'elapsedTimeDescriptions':	{
+	'MORE_THAN_A_MONTH_AGO':	"一个月之前",
+	'MORE_THAN_A_WEEK_AGO':	"一周之前",
+	'MORE_THAN_*_WEEKS_AGO':	"__elapsed__ 周以前",
+	'YESTERDAY':	"昨天",
+	'*_DAYS_AGO':	"__elapsed__ 天之前",
+	'ABOUT_AN_HOUR_AGO':	"大约一个小时前",
+	'*_HOURS_AGO':	"__elapsed__ 小时前",
+	'JUST_A_FEW_MINUTES_AGO':	"仅仅几分钟之前",
+	'ABOUT_*_MINUTES_AGO':	"大约 __elapsed__ 几分钟前"
+},
+'unknown_ip':	"未知",
+'calendarStrings':	{
+	'months':	{
+		'0':	"一月",
+		'1':	"二月",
+		'2':	"三月",
+		'3':	"四月",
+		'4':	"五月",
+		'5':	"六月",
+		'6':	"七月",
+		'7':	"八月",
+		'8':	"九月",
+		'9':	"十月",
+		'10':	"十一月",
+		'11':	"十二月"
+	},
+	'shortMonths':	{
+		'0':	"一月",
+		'1':	"二月",
+		'2':	"三月",
+		'3':	"四月",
+		'4':	"五月",
+		'5':	"六月",
+		'6':	"七月",
+		'7':	"八月",
+		'8':	"九月",
+		'9':	"十月",
+		'10':	"十一月",
+		'11':	"十二月"
+	},
+	'days':	{
+		'0':	"星期日",
+		'1':	"星期一",
+		'2':	"星期二",
+		'3':	"星期三",
+		'4':	"星期四",
+		'5':	"星期五",
+		'6':	"星期六"
+	},
+	'shortDays':	{
+		'0':	"日",
+		'1':	"一",
+		'2':	"二",
+		'3':	"三",
+		'4':	"四",
+		'5':	"五",
+		'6':	"六"
+	},
+	'veryShortDays':	{
+		'0':	"日",
+		'1':	"一",
+		'2':	"二",
+		'3':	"三",
+		'4':	"四",
+		'5':	"五",
+		'6':	"六"
+	},
+	'amDesignation':	"上午",
+	'pmDesignation':	"下午"
+},
+
+__syntaxFix__: "syntax fix"
+});
diff --git a/frontend/beta/js/Clipperz/PM/Toll.js b/frontend/beta/js/Clipperz/PM/Toll.js
new file mode 100644
index 0000000..6d412c1
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/PM/Toll.js
@@ -0,0 +1,193 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.PM) == 'undefined') { Clipperz.PM = {}; }
+
+//=============================================================================
+
+Clipperz.PM.Toll = function(args) {
+	this._requestType = args.requestType;
+	this._targetValue = args.targetValue;
+	this._cost = args.cost;
+	this._toll = null;
+
+	return this;
+}
+
+Clipperz.PM.Toll.prototype = MochiKit.Base.update(null, {
+
+	'toString': function() {
+		return "Clipperz.PM.Toll (" + this.requestType() + ": " + this.cost() + " - " + ((this.toll() == null)? 'UNPAID' : 'PAID') + ")";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'requestType': function() {
+		return this._requestType;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'targetValue': function() {
+		return this._targetValue;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'cost': function() {
+		return this._cost;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'toll': function() {
+		return this._toll;
+	},
+
+	//=========================================================================
+	
+	'prefixMatchingBits': function(aValue1, aValue2) {
+		var	result;
+		var i,c;
+		
+		result = 0;
+
+		c = Math.min(aValue1.length(), aValue2.length());
+		i = 0;
+		while (i<c && (aValue1.byteAtIndex(i) == aValue2.byteAtIndex(i))) {
+			result += 8;
+			i++;
+		}
+
+		if (i<c) {
+			var	xorValue;
+			
+			xorValue = (aValue1.byteAtIndex(i) ^ aValue2.byteAtIndex(i));
+			
+			if (xorValue >= 128) {
+				result += 0;
+			} else if (xorValue >= 64) {
+				result += 1;
+			} else if (xorValue >= 32) {
+				result += 2;
+			} else if (xorValue >= 16) {
+				result += 3;
+			} else if (xorValue >= 8) {
+				result += 4;
+			} else if (xorValue >= 4) {
+				result += 5;
+			} else if (xorValue >= 2) {
+				result += 6;
+			} else if (xorValue >= 1) {
+				result += 7;
+			}
+		}
+
+		return result;
+	},
+
+	//=========================================================================
+
+	'pay': function() {
+		var	result;
+		var	targetData;
+		var	targetMatchSize;
+		var prefixMatchingBits;
+		var	payment;
+		var i;
+		
+//MochiKit.Logging.logDebug(">>> Toll.pay");
+		if (this.toll() == null) {
+			i = 0;
+//MochiKit.Logging.logDebug("--- Proxy.payToll - 1");
+			targetData = new Clipperz.ByteArray("0x" + this.targetValue());
+//MochiKit.Logging.logDebug("--- Proxy.payToll - 2");
+			targetMatchSize = this.cost();
+//MochiKit.Logging.logDebug("--- Proxy.payToll - 3");
+		
+			payment = Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(32);
+//MochiKit.Logging.logDebug("--- Proxy.payToll - 4");
+		
+			do {
+				var	paymentData;
+
+//MochiKit.Logging.logDebug("--- Proxy.payToll - 5");
+				//payment = Clipperz.Crypto.PRNG.defaultRandomGenerator().getRandomBytes(32);
+				payment.increment();
+//MochiKit.Logging.logDebug("--- Proxy.payToll - 6");
+				paymentData = Clipperz.Crypto.SHA.sha256(payment);
+//MochiKit.Logging.logDebug("--- Proxy.payToll - 7");
+				prefixMatchingBits = this.prefixMatchingBits(targetData, paymentData);
+//MochiKit.Logging.logDebug("--- Proxy.payToll - 8");
+				i++;
+//MochiKit.Logging.logDebug("--- Proxy.payToll - 9");
+			} while (prefixMatchingBits < targetMatchSize);
+//MochiKit.Logging.logDebug("--- Proxy.payToll - 10");
+
+			this._toll = payment.toHexString().substring(2)
+		}
+//MochiKit.Logging.logDebug("<<< Toll.pay");
+
+		return this;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'deferredPay': function() {
+		var	deferredResult;
+		var	toll;
+		
+//MochiKit.Logging.logDebug(">>> Toll.deferredPay");
+		toll = this;
+		deferredResult = new MochiKit.Async.Deferred();
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("y.1 - Proxy.deferredPayToll - 1: " + res); return res;});
+		deferredResult.addCallback(MochiKit.Base.method(toll, 'pay'));
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("y.2 - Proxy.deferredPayToll - 2: " + res); return res;});
+		deferredResult.addCallback(function(aToll) {
+			var result;
+		
+			result = {
+				targetValue:aToll.targetValue(),
+				toll:aToll.toll()
+			};
+		
+			return result;
+		});
+//deferredResult.addBoth(function(res) {MochiKit.Logging.logDebug("y.3 - Proxy.deferredPayToll - 3: " + res); return res;});
+		deferredResult.callback();
+//MochiKit.Logging.logDebug("<<< Toll.deferredPay");
+		
+		return deferredResult;
+	},
+	
+	//=========================================================================
+	__syntaxFix__: "syntax fix"
+	
+});
+
diff --git a/frontend/beta/js/Clipperz/Profile.js b/frontend/beta/js/Clipperz/Profile.js
new file mode 100644
index 0000000..31888a9
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Profile.js
@@ -0,0 +1,485 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+addEvent(window, "load", sortables_init);
+
+var SORT_COLUMN_INDEX;
+
+function sortables_init() {
+    // Find all tables with class sortable and make them sortable
+    if (!document.getElementsByTagName) return;
+    tbls = document.getElementsByTagName("table");
+    for (ti=0;ti<tbls.length;ti++) {
+        thisTbl = tbls[ti];
+        if (((' '+thisTbl.className+' ').indexOf("sortable") != -1) && (thisTbl.id)) {
+            //initTable(thisTbl.id);
+            ts_makeSortable(thisTbl);
+        }
+    }
+}
+
+function ts_makeSortable(table) {
+    if (table.rows && table.rows.length > 0) {
+        var firstRow = table.rows[0];
+    }
+    if (!firstRow) return;
+    
+    // We have a first row: assume it's the header, and make its contents clickable links
+    for (var i=0;i<firstRow.cells.length;i++) {
+        var cell = firstRow.cells[i];
+        var txt = ts_getInnerText(cell);
+        cell.innerHTML = '<a href="#" class="sortheader" '+ 
+        'onclick="ts_resortTable(this, '+i+');return false;">' + 
+        txt+'<span class="sortarrow">&nbsp;&nbsp;&nbsp;</span></a>';
+    }
+}
+
+function ts_getInnerText(el) {
+	if (typeof el == "string") return el;
+	if (typeof el == "undefined") { return el };
+	if (el.innerText) return el.innerText;	//Not needed but it is faster
+	var str = "";
+	
+	var cs = el.childNodes;
+	var l = cs.length;
+	for (var i = 0; i < l; i++) {
+		switch (cs[i].nodeType) {
+			case 1: //ELEMENT_NODE
+				str += ts_getInnerText(cs[i]);
+				break;
+			case 3:	//TEXT_NODE
+				str += cs[i].nodeValue;
+				break;
+		}
+	}
+	return str;
+}
+
+function ts_resortTable(lnk,clid) {
+    // get the span
+    var span;
+    for (var ci=0;ci<lnk.childNodes.length;ci++) {
+        if (lnk.childNodes[ci].tagName && lnk.childNodes[ci].tagName.toLowerCase() == 'span') span = lnk.childNodes[ci];
+    }
+    var spantext = ts_getInnerText(span);
+    var td = lnk.parentNode;
+    var column = clid || td.cellIndex;
+    var table = getParent(td,'TABLE');
+
+    // Work out a type for the column
+    if (table.rows.length <= 1) return;
+    var itm = ts_getInnerText(table.rows[1].cells[column]);
+    sortfn = ts_sort_caseinsensitive;
+    if (itm.match(/^\d\d[\/-]\d\d[\/-]\d\d\d\d$/)) {
+		sortfn = ts_sort_date;
+	}
+    if (itm.match(/^\d\d[\/-]\d\d[\/-]\d\d$/)) {
+		sortfn = ts_sort_date;
+	}
+    if (itm.match(/^[£$]/)) {
+		sortfn = ts_sort_currency;
+	}
+    if (itm.match(/^[\d\.]+$/)) {
+		sortfn = ts_sort_numeric;
+	}
+    SORT_COLUMN_INDEX = column;
+    var firstRow = new Array();
+    var newRows = new Array();
+    for (i=0;i<table.rows[0].length;i++) {
+		firstRow[i] = table.rows[0][i];
+	}
+
+    for (j=1;j<table.rows.length;j++) {
+		newRows[j-1] = table.rows[j];
+	}
+    newRows.sort(sortfn);
+
+    if (span.getAttribute("sortdir") == 'down') {
+        ARROW = '&nbsp;&nbsp;&uarr;';
+        newRows.reverse();
+        span.setAttribute('sortdir','up');
+    } else {
+        ARROW = '&nbsp;&nbsp;&darr;';
+        span.setAttribute('sortdir','down');
+    }
+    
+    // We appendChild rows that already exist to the tbody, so it moves them rather than creating new ones
+    // don't do sortbottom rows
+    for (i=0;i<newRows.length;i++) {
+		if (!newRows[i].className || (newRows[i].className && (newRows[i].className.indexOf('sortbottom') == -1))) {
+ 			table.tBodies[0].appendChild(newRows[i]);
+		}
+	}
+    // do sortbottom rows only
+    for (i=0;i<newRows.length;i++) { 
+		if (newRows[i].className && (newRows[i].className.indexOf('sortbottom') != -1)) {
+			table.tBodies[0].appendChild(newRows[i]);
+		}
+	}
+    
+    // Delete any other arrows there may be showing
+    var allspans = document.getElementsByTagName("span");
+    for (var ci=0;ci<allspans.length;ci++) {
+        if (allspans[ci].className == 'sortarrow') {
+            if (getParent(allspans[ci],"table") == getParent(lnk,"table")) { // in the same table as us?
+                allspans[ci].innerHTML = '&nbsp;&nbsp;&nbsp;';
+            }
+        }
+    }
+        
+    span.innerHTML = ARROW;
+}
+
+function getParent(el, pTagName) {
+	if (el == null) return null;
+	else if (el.nodeType == 1 && el.tagName.toLowerCase() == pTagName.toLowerCase())	// Gecko bug, supposed to be uppercase
+		return el;
+	else
+		return getParent(el.parentNode, pTagName);
+}
+function ts_sort_date(a,b) {
+    // y2k notes: two digit years less than 50 are treated as 20XX, greater than 50 are treated as 19XX
+    aa = ts_getInnerText(a.cells[SORT_COLUMN_INDEX]);
+    bb = ts_getInnerText(b.cells[SORT_COLUMN_INDEX]);
+    if (aa.length == 10) {
+        dt1 = aa.substr(6,4)+aa.substr(3,2)+aa.substr(0,2);
+    } else {
+        yr = aa.substr(6,2);
+        if (parseInt(yr) < 50) { yr = '20'+yr; } else { yr = '19'+yr; }
+        dt1 = yr+aa.substr(3,2)+aa.substr(0,2);
+    }
+    if (bb.length == 10) {
+        dt2 = bb.substr(6,4)+bb.substr(3,2)+bb.substr(0,2);
+    } else {
+        yr = bb.substr(6,2);
+        if (parseInt(yr) < 50) { yr = '20'+yr; } else { yr = '19'+yr; }
+        dt2 = yr+bb.substr(3,2)+bb.substr(0,2);
+    }
+    if (dt1==dt2) return 0;
+    if (dt1<dt2) return -1;
+    return 1;
+}
+
+function ts_sort_currency(a,b) { 
+    aa = ts_getInnerText(a.cells[SORT_COLUMN_INDEX]).replace(/[^0-9.]/g,'');
+    bb = ts_getInnerText(b.cells[SORT_COLUMN_INDEX]).replace(/[^0-9.]/g,'');
+    return parseFloat(aa) - parseFloat(bb);
+}
+
+function ts_sort_numeric(a,b) { 
+    aa = parseFloat(ts_getInnerText(a.cells[SORT_COLUMN_INDEX]));
+    if (isNaN(aa)) aa = 0;
+    bb = parseFloat(ts_getInnerText(b.cells[SORT_COLUMN_INDEX])); 
+    if (isNaN(bb)) bb = 0;
+    return aa-bb;
+}
+
+function ts_sort_caseinsensitive(a,b) {
+    aa = ts_getInnerText(a.cells[SORT_COLUMN_INDEX]).toLowerCase();
+    bb = ts_getInnerText(b.cells[SORT_COLUMN_INDEX]).toLowerCase();
+    if (aa==bb) return 0;
+    if (aa<bb) return -1;
+    return 1;
+}
+
+function ts_sort_default(a,b) {
+    aa = ts_getInnerText(a.cells[SORT_COLUMN_INDEX]);
+    bb = ts_getInnerText(b.cells[SORT_COLUMN_INDEX]);
+    if (aa==bb) return 0;
+    if (aa<bb) return -1;
+    return 1;
+}
+
+
+function addEvent(elm, evType, fn, useCapture)
+// addEvent and removeEvent
+// cross-browser event handling for IE5+,  NS6 and Mozilla
+// By Scott Andrew
+{
+  if (elm.addEventListener){
+    elm.addEventListener(evType, fn, useCapture);
+    return true;
+  } else if (elm.attachEvent){
+    var r = elm.attachEvent("on"+evType, fn);
+    return r;
+  } else {
+    alert("Handler could not be removed");
+  }
+} 
+
+
+
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.Profile) == 'undefined') { Clipperz.Profile = {}; }
+
+Clipperz.Profile.VERSION = "0.1";
+Clipperz.Profile.NAME = "Clipperz.Profile";
+
+MochiKit.Base.update(Clipperz.Profile, {
+
+	//-------------------------------------------------------------------------
+
+	'__repr__': function () {
+		var	status;
+		
+		if (Clipperz.Profile.isEnabled == true) {
+			status = ENABLED;
+		} else {
+			status = DISABLED;
+		}
+		
+		return "[" + this.NAME + " " + this.VERSION + " - " + status + "]";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'isEnabled': function() {
+		return false;
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'initialValues': function() {
+		return {iters:0, total:0, min:Number.MAX_VALUE, max:0}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'start': function(aName) {},
+	'stop': function(aName) {},
+	'dump': function(aName) {},
+	'profileData': function(aName, aKey) {
+		var	result;
+
+		if (typeof(aName) != 'undefined') {
+			result = this.initialValues();
+
+			if (typeof(aKey) != 'undefined') {
+				result = result[aKey];
+			}
+		} else {
+			result = null;
+		}
+		
+		return result;
+		
+	},
+	'resetProfileData': function() {},
+	//-------------------------------------------------------------------------
+
+	'end': function(aName) {
+		Clipperz.Profile.stop(aName);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	__syntaxFix__: "syntax fix"
+});
+
+
+
+if ((typeof(clipperz_profiling_enabled) != 'undefined') && (clipperz_profiling_enabled == true)) {
+
+var _clipperz_profile_profiles = {};
+var _clipperz_profile_pns = [];
+
+
+MochiKit.Base.update(Clipperz.Profile, {
+
+	//-------------------------------------------------------------------------
+
+	'isEnabled': function() {
+		return true;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'start': function(aName) {
+		if (!_clipperz_profile_profiles[aName]) {
+			_clipperz_profile_profiles[aName] = this.initialValues();
+			_clipperz_profile_pns[_clipperz_profile_pns.length] = aName;
+		} else {
+			if (_clipperz_profile_profiles[aName]["start"]) {
+				Clipperz.Profile.stop(aName);
+			}
+		}
+
+		_clipperz_profile_profiles[aName].end = null;
+		_clipperz_profile_profiles[aName].start = new Date();
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'stop': function(aName) {
+		if ((_clipperz_profile_profiles[aName]) && (_clipperz_profile_profiles[aName]["start"])) {
+			with(_clipperz_profile_profiles[aName]) {
+				var now;
+				var	elapsedTime;
+				
+				now = new Date();
+				elapsedTime = (now - start);
+				
+				end = now;
+				min = Math.min(min, elapsedTime);
+				max = Math.max(max, elapsedTime);
+				total += elapsedTime;
+				start = null;
+				iters++;
+			}
+		} else {
+			// oops! bad call to end(), what should we do here?
+			return true;
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'dump': function(appendToDoc) {
+//		var tbl = document.createElement("table");
+		var tbl = MochiKit.DOM.TABLE(null, MochiKit.DOM.TBODY());
+		tbl.className = 'sortable';
+		tbl.id = "profileOutputTable_table";
+		with(tbl.style){
+			border = "1px solid black";
+			borderCollapse = "collapse";
+		}
+		var hdr = tbl.createTHead();
+		var hdrtr = hdr.insertRow(0);
+		// document.createElement("tr");
+		var cols = ["Identifier","#","Min", "Avg","Max","Total"];
+		for(var x=0; x<cols.length; x++){
+			var ntd = hdrtr.insertCell(x);
+			with(ntd.style){
+				backgroundColor = "#225d94";
+				color = "white";
+				borderBottom = "1px solid black";
+				borderRight = "1px solid black";
+				fontFamily = "tahoma";
+				fontWeight = "bolder";
+				paddingLeft = paddingRight = "5px";
+			}
+			ntd.appendChild(document.createTextNode(cols[x]));
+		}
+
+		for(var x=0; x < _clipperz_profile_pns.length; x++){
+			var prf = _clipperz_profile_profiles[_clipperz_profile_pns[x]];
+			this.end(_clipperz_profile_pns[x]);
+			if(prf.iters>0){
+				var bdytr = tbl.insertRow(true);
+				var vals = [_clipperz_profile_pns[x], prf.iters, prf.min, parseInt(Math.round(prf.total/prf.iters)), prf.max, prf.total];
+				for(var y=0; y<vals.length; y++){
+					var cc = bdytr.insertCell(y);
+					cc.appendChild(document.createTextNode(vals[y]));
+					with(cc.style){
+						borderBottom = "1px solid gray";
+						paddingLeft = paddingRight = "5px";
+						if(x%2){
+							backgroundColor = "#e1f1ff";
+						}
+						if(y>0){
+							textAlign = "right";
+							borderRight = "1px solid gray";
+						}else{
+							borderRight = "1px solid black";
+						}
+					}
+				}
+			}
+		}
+
+		if(appendToDoc){
+			var ne = document.createElement("div");
+			ne.id = "profileOutputTable";
+			with(ne.style){
+				fontFamily = "Courier New, monospace";
+				fontSize = "12px";
+				lineHeight = "16px";
+				borderTop = "1px solid black";
+				padding = "10px";
+			}
+			if(document.getElementById("profileOutputTable")){
+				MochiKit.DOM.swapDOM("profileOutputTable", ne);
+			}else{
+				document.body.appendChild(ne);
+			}
+			ne.appendChild(tbl);
+		}
+
+		return tbl;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'profileData': function(aName, aKey) {
+		var	result;
+
+		if (typeof(aName) == 'undefined') {
+			result = _clipperz_profile_profiles;
+		} else {
+			if (typeof(_clipperz_profile_profiles[aName]) != 'undefined') {
+				result = _clipperz_profile_profiles[aName];
+			} else {
+				result = {};
+			}
+		}
+
+		if (typeof(aKey) != 'undefined') {
+			if (aKey == "average") {
+				result = Math.round(Clipperz.Profile.profileData(aName, 'total')/Clipperz.Profile.profileData(aName, 'iters'));
+			} else {
+				if (typeof(result[aKey]) != 'undefined') {
+					result = result[aKey];
+				} else {
+					result = 0;
+				}
+			}
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'resetProfileData': function() {
+		_clipperz_profile_profiles = {};
+		_clipperz_profile_pns = [];
+	},
+
+	//-------------------------------------------------------------------------
+
+	__syntaxFix__: "syntax fix"
+});
+
+}
diff --git a/frontend/beta/js/Clipperz/Set.js b/frontend/beta/js/Clipperz/Set.js
new file mode 100644
index 0000000..61e0769
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Set.js
@@ -0,0 +1,167 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+
+if (typeof(Clipperz) == 'undefined') {
+	Clipperz = {};
+}
+
+//#############################################################################
+
+Clipperz.Set = function(args) {
+	args = args || {};
+//	MochiKit.Base.bindMethods(this);
+
+	if (args.items != null) {
+		this._items = args.items.slice();
+	} else {
+		this._items = [];
+	}
+
+	return this;
+}
+
+//=============================================================================
+
+Clipperz.Set.prototype = MochiKit.Base.update(null, {
+
+	//-------------------------------------------------------------------------
+
+	'toString': function() {
+		return "Clipperz.Set";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'items': function() {
+		return this._items;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'popAnItem': function() {
+		var result;
+	
+		if (this.size() > 0) {
+			result = this.items().pop();
+		} else {
+			result = null;
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'allItems': function() {
+		return this.items();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'contains': function(anItem) {
+		return (this.indexOf(anItem) != -1);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	'indexOf': function(anItem) {
+		var	result;
+		var	i, c;
+		
+		result = -1;
+
+		c = this.items().length;
+		for (i=0; (i<c) && (result == -1); i++) {
+			if (this.items()[i] === anItem) {
+				result = i;
+			}
+		}
+		
+		return result;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'add': function(anItem) {
+		if (anItem.constructor == Array) {
+			MochiKit.Base.map(MochiKit.Base.bind(this,add, this), anItem);
+		} else {
+			if (! this.contains(anItem)) {
+				this.items().push(anItem);
+			}
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'debug': function() {
+		var	i, c;
+		
+		result = -1;
+
+		c = this.items().length;
+		for (i=0; i<c; i++) {
+			alert("[" + i + "] " + this.items()[i].label);
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'remove': function(anItem) {
+		if (anItem.constructor == Array) {
+			MochiKit.Base.map(MochiKit.Base.bind(this.remove, this), anItem);
+		} else {
+			var	itemIndex;
+
+			itemIndex = this.indexOf(anItem);
+			if (itemIndex != -1) {
+				this.items().splice(itemIndex, 1);
+			}
+		}
+	},
+
+	//-------------------------------------------------------------------------
+
+	'size': function() {
+		return this.items().length;
+	},
+
+	//-------------------------------------------------------------------------
+
+	'empty': function() {
+		this.items().splice(0, this.items().length);
+	},
+	
+	//-------------------------------------------------------------------------
+
+	__syntaxFix__: "syntax fix"
+	
+	//-------------------------------------------------------------------------
+});
+
diff --git a/frontend/beta/js/Clipperz/Signal.js b/frontend/beta/js/Clipperz/Signal.js
new file mode 100644
index 0000000..1d3c9eb
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Signal.js
@@ -0,0 +1,71 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.Signal) == 'undefined') { Clipperz.Signal = {}; }
+
+Clipperz.Signal.VERSION = "0.1";
+Clipperz.Signal.NAME = "Clipperz.Signal";
+
+MochiKit.Base.update(Clipperz.Signal, {
+
+	//-------------------------------------------------------------------------
+
+	'__repr__': function () {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'fireNativeEvent': function(element, eventName) {
+		if (element.fireEvent) {
+			// MSIE
+			element.fireEvent(eventName);
+		} else {
+			// W3C
+			var event;
+			
+			event = document.createEvent("HTMLEvents");
+			event.initEvent(eventName.replace(/^on/, ""), true, true);
+			element.dispatchEvent(event);
+		}
+	},
+
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
+
+
diff --git a/frontend/beta/js/Clipperz/Style.js b/frontend/beta/js/Clipperz/Style.js
new file mode 100644
index 0000000..9762b1c
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/Style.js
@@ -0,0 +1,73 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.Style) == 'undefined') { Clipperz.Style = {}; }
+
+Clipperz.Style.VERSION = "0.1";
+Clipperz.Style.NAME = "Clipperz.DOM";
+
+MochiKit.Base.update(Clipperz.Style, {
+
+	//-------------------------------------------------------------------------
+
+	'__repr__': function () {
+		return "[" + this.NAME + " " + this.VERSION + "]";
+	},
+
+	//-------------------------------------------------------------------------
+
+	'toString': function () {
+		return this.__repr__();
+	},
+
+	//-------------------------------------------------------------------------
+
+	'applyZebraStylesToTable': function(aTable) {
+		var tbody;
+		var tbodyRows;
+		var i,c;
+		
+		tbody = MochiKit.DOM.getFirstElementByTagAndClassName('tbody', null, aTable);
+		tbodyRows = tbody.childNodes;
+//		tbodyRows = MochiKit.DOM.getElementsByTagAndClassName('tr', null, tbody)
+		c = tbodyRows.length;
+		for (i=0; i<c; i++) {
+			var element;
+
+			element = YAHOO.ext.Element.get(tbodyRows[i]);
+			element.addClass(((i%2 == 0) ? "zebra_odd": "zebra_even"));
+			element.removeClass(((i%2 == 1) ? "zebra_odd": "zebra_even"));
+		}
+	},
+	
+	//-------------------------------------------------------------------------
+	__syntaxFix__: "syntax fix"
+
+});
+
diff --git a/frontend/beta/js/Clipperz/YUI/Collapser.js b/frontend/beta/js/Clipperz/YUI/Collapser.js
new file mode 100644
index 0000000..5c0ac0f
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/Collapser.js
@@ -0,0 +1,73 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.YUI) == 'undefined') { Clipperz.YUI = {}; }
+
+//	found on YUI-EXT forum (http://www.yui-ext.com/forum/viewtopic.php?t=683&highlight=accordion)
+Clipperz.YUI.Collapser = function(clickEl, collapseEl, initiallyCollapsed) { 
+	this.clickEl = getEl(clickEl); 
+	this.collapseEl = getEl(collapseEl); 
+	this.clickEl.addClass('collapser-expanded'); 
+	if (initiallyCollapsed == true) {
+		this.afterCollapse();
+	}
+	this.clickEl.mon('click', function(){ 
+		this.collapsed === true ? this.expand() : this.collapse(); 
+	}, this, true); 
+}; 
+
+Clipperz.YUI.Collapser.prototype = { 
+	'collapse': function(){ 
+		this.collapseEl.clip(); 
+		this.collapseEl.setHeight(1, true, .35, this.afterCollapse.createDelegate(this), YAHOO.util.Easing.easeOut); 
+		this.clickEl.replaceClass('collapser-expanded','collapser-collapsed'); 
+	}, 
+
+	'afterCollapse': function(){ 
+		this.collapsed = true; 
+		this.collapseEl.setDisplayed(false); 
+		this.clickEl.replaceClass('collapser-expanded','collapser-collapsed'); 
+	}, 
+
+	'expand': function(){ 
+		this.collapseEl.setDisplayed(true); 
+		this.collapseEl.autoHeight(true, .35, this.afterExpand.createDelegate(this), YAHOO.util.Easing.easeOut); 
+		this.clickEl.replaceClass('collapser-collapsed','collapser-expanded'); 
+	}, 
+
+	'afterExpand': function(){ 
+		this.collapsed = false; 
+		this.collapseEl.unclip(); 
+		this.collapseEl.setStyle('height', '');    
+		this.clickEl.replaceClass('collapser-collapsed','collapser-expanded'); 
+	},
+
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+};
diff --git a/frontend/beta/js/Clipperz/YUI/DomHelper.js b/frontend/beta/js/Clipperz/YUI/DomHelper.js
new file mode 100644
index 0000000..4f8acde
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/DomHelper.js
@@ -0,0 +1,465 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.ext) == 'undefined') { Clipperz.ext = {}; }
+
+/**
+ * @class Clipperz.YUI.DomHelper
+ * Utility class for working with DOM and/or Templates. It transparently supports using HTML fragments or DOM. 
+ * For more information see <a href="http://www.jackslocum.com/yui/2006/10/06/domhelper-create-elements-using-dom-html-fragments-or-templates/">this blog post with examples</a>.
+ * @singleton
+ */
+Clipperz.YUI.DomHelper = new function(){
+    /**@private*/
+    var d = document;
+    var tempTableEl = null;
+    /** True to force the use of DOM instead of html fragments @type Boolean */
+    this.useDom = false;
+    var emptyTags = /^(?:base|basefont|br|frame|hr|img|input|isindex|link|meta|nextid|range|spacer|wbr|audioscope|area|param|keygen|col|limittext|spot|tab|over|right|left|choose|atop|of)$/i;
+    /**
+     * Applies a style specification to an element
+     * @param {String/HTMLElement} el The element to apply styles to
+     * @param {String/Object/Function} styles A style specification string eg "width:100px", or object in the form {width:"100px"}, or
+     * a function which returns such a specification.
+     */
+    this.applyStyles = function(el, styles){
+        if(styles){
+           var D = YAHOO.util.Dom;
+           if (typeof styles == "string"){
+               var re = /\s?([a-z\-]*)\:([^;]*);?/gi;
+               var matches;
+               while ((matches = re.exec(styles)) != null){
+                   D.setStyle(el, matches[1], matches[2]);
+               }
+           }else if (typeof styles == "object"){
+               for (var style in styles){
+                  D.setStyle(el, style, styles[style]);
+               }
+           }else if (typeof styles == "function"){
+                Clipperz.YUI.DomHelper.applyStyles(el, styles.call());
+           }
+        }
+    }; 
+    
+    // build as innerHTML where available
+    /** @ignore */
+    var createHtml = function(o){
+        var b = '';
+
+		if(typeof(o['html']) != 'undefined') {
+			o['html'] = Clipperz.Base.sanitizeString(o['html']);
+		} else if (typeof(o['htmlString']) != 'undefined') {
+			o['html'] = o['htmlString'];
+			delete o.htmlString;
+		}
+		
+        b += '<' + o.tag;
+        for(var attr in o){
+            if(attr == 'tag' || attr == 'children' || attr == 'html' || typeof o[attr] == 'function') continue;
+            if(attr == 'style'){
+                var s = o['style'];
+                if(typeof s == 'function'){
+                    s = s.call();
+                }
+                if(typeof s == 'string'){
+                    b += ' style="' + s + '"';
+                }else if(typeof s == 'object'){
+                    b += ' style="';
+                    for(var key in s){
+                        if(typeof s[key] != 'function'){
+                            b += key + ':' + s[key] + ';';
+                        }
+                    }
+                    b += '"';
+                }
+            }else{
+                if(attr == 'cls'){
+                    b += ' class="' + o['cls'] + '"';
+                }else if(attr == 'htmlFor'){
+                    b += ' for="' + o['htmlFor'] + '"';
+                }else{
+                    b += ' ' + attr + '="' + o[attr] + '"';
+                }
+            }
+        }
+        if(emptyTags.test(o.tag)){
+            b += ' />';
+        }else{
+            b += '>';
+            if(o.children){
+                for(var i = 0, len = o.children.length; i < len; i++) {
+                    b += createHtml(o.children[i], b);
+                }
+            }
+            if(o.html){
+                b += o.html;
+            }
+            b += '</' + o.tag + '>';
+        }
+        return b;
+    }
+    
+    // build as dom
+    /** @ignore */
+    var createDom = function(o, parentNode){
+        var el = d.createElement(o.tag);
+        var useSet = el.setAttribute ? true : false; // In IE some elements don't have setAttribute
+        for(var attr in o){
+            if(attr == 'tag' || attr == 'children' || attr == 'html' || attr == 'style' || typeof o[attr] == 'function') continue;
+            if(attr=='cls'){
+                el.className = o['cls'];
+            }else{
+                if(useSet) el.setAttribute(attr, o[attr]);
+                else el[attr] = o[attr];
+            }
+        }
+        Clipperz.YUI.DomHelper.applyStyles(el, o.style);
+        if(o.children){
+            for(var i = 0, len = o.children.length; i < len; i++) {
+             	createDom(o.children[i], el);
+            }
+        }
+        if(o.html){
+            el.innerHTML = o.html;
+        }
+        if(parentNode){
+           parentNode.appendChild(el);
+        }
+        return el;
+    };
+    
+    /**
+     * @ignore
+     * Nasty code for IE's broken table implementation 
+     */
+    var insertIntoTable = function(tag, where, el, html){
+        if(!tempTableEl){
+            tempTableEl = document.createElement('div');
+        }
+        var node;
+        if(tag == 'table' || tag == 'tbody'){
+           tempTableEl.innerHTML = '<table><tbody>'+html+'</tbody></table>';
+           node = tempTableEl.firstChild.firstChild.firstChild;
+        }else{
+           tempTableEl.innerHTML = '<table><tbody><tr>'+html+'</tr></tbody></table>';
+           node = tempTableEl.firstChild.firstChild.firstChild.firstChild;
+        }
+        if(where == 'beforebegin'){
+            el.parentNode.insertBefore(node, el);
+            return node;
+        }else if(where == 'afterbegin'){
+            el.insertBefore(node, el.firstChild);
+            return node;
+        }else if(where == 'beforeend'){
+            el.appendChild(node);
+            return node;
+        }else if(where == 'afterend'){
+            el.parentNode.insertBefore(node, el.nextSibling);
+            return node;
+        }
+    } 
+    
+    /**
+     * Inserts an HTML fragment into the Dom
+     * @param {String} where Where to insert the html in relation to el - beforeBegin, afterBegin, beforeEnd, afterEnd.
+     * @param {HTMLElement} el The context element
+     * @param {String} html The HTML fragmenet
+     * @return {HTMLElement} The new node
+     */
+    this.insertHtml = function(where, el, html){
+        where = where.toLowerCase();
+        if(el.insertAdjacentHTML){
+            var tag = el.tagName.toLowerCase();
+            if(tag == 'table' || tag == 'tbody' || tag == 'tr'){
+               return insertIntoTable(tag, where, el, html);
+            }
+            switch(where){
+                case 'beforebegin':
+                    el.insertAdjacentHTML(where, html);
+                    return el.previousSibling;
+                case 'afterbegin':
+                    el.insertAdjacentHTML(where, html);
+                    return el.firstChild;
+                case 'beforeend':
+                    el.insertAdjacentHTML(where, html);
+                    return el.lastChild;
+                case 'afterend':
+                    el.insertAdjacentHTML(where, html);
+                    return el.nextSibling;
+            }
+            throw 'Illegal insertion point -> "' + where + '"';
+        }
+        var range = el.ownerDocument.createRange();
+        var frag;
+        switch(where){
+             case 'beforebegin':
+                range.setStartBefore(el);
+                frag = range.createContextualFragment(html);
+                el.parentNode.insertBefore(frag, el);
+                return el.previousSibling;
+             case 'afterbegin':
+                if(el.firstChild){ // faster
+                    range.setStartBefore(el.firstChild);
+                }else{
+                    range.selectNodeContents(el);
+                    range.collapse(true);
+                }
+                frag = range.createContextualFragment(html);
+                el.insertBefore(frag, el.firstChild);
+                return el.firstChild;
+            case 'beforeend':
+                if(el.lastChild){
+                    range.setStartAfter(el.lastChild); // faster
+                }else{
+                    range.selectNodeContents(el);
+                    range.collapse(false);
+                }
+                frag = range.createContextualFragment(html);
+                el.appendChild(frag);
+                return el.lastChild;
+            case 'afterend':
+                range.setStartAfter(el);
+                frag = range.createContextualFragment(html);
+                el.parentNode.insertBefore(frag, el.nextSibling);
+                return el.nextSibling;
+            }
+            throw 'Illegal insertion point -> "' + where + '"';
+    };
+    
+    /**
+     * Creates new Dom element(s) and inserts them before el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} o The Dom object spec (and children)
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    this.insertBefore = function(el, o, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode;
+        if(this.useDom){
+            newNode = createDom(o, null);
+            el.parentNode.insertBefore(newNode, el);
+        }else{
+            var html = createHtml(o);
+            newNode = this.insertHtml('beforeBegin', el, html);
+        }
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    };
+    
+    /**
+     * Creates new Dom element(s) and inserts them after el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} o The Dom object spec (and children)
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    this.insertAfter = function(el, o, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode;
+        if(this.useDom){
+            newNode = createDom(o, null);
+            el.parentNode.insertBefore(newNode, el.nextSibling);
+        }else{
+            var html = createHtml(o);
+            newNode = this.insertHtml('afterEnd', el, html);
+        }
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    };
+    
+    /**
+     * Creates new Dom element(s) and appends them to el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} o The Dom object spec (and children)
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    this.append = function(el, o, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode;
+        if(this.useDom){
+            newNode = createDom(o, null);
+            el.appendChild(newNode);
+        }else{
+            var html = createHtml(o);
+            newNode = this.insertHtml('beforeEnd', el, html);
+        }
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    };
+    
+    /**
+     * Creates new Dom element(s) and overwrites the contents of el with them
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} o The Dom object spec (and children)
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    this.overwrite = function(el, o, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        el.innerHTML = createHtml(o);
+        return returnElement ? YAHOO.ext.Element.get(el.firstChild, true) : el.firstChild;
+    };
+    
+    /**
+     * Creates a new Clipperz.YUI.DomHelper.Template from the Dom object spec 
+     * @param {Object} o The Dom object spec (and children)
+     * @return {Clipperz.YUI.DomHelper.Template} The new template
+     */
+    this.createTemplate = function(o){
+        var html = createHtml(o);
+        return new Clipperz.YUI.DomHelper.Template(html);
+    };
+}();
+
+/**
+* @class Clipperz.YUI.DomHelper.Template
+* Represents an HTML fragment template.
+* For more information see <a href="http://www.jackslocum.com/yui/2006/10/06/domhelper-create-elements-using-dom-html-fragments-or-templates/">this blog post with examples</a>. 
+* <br>
+* <b>This class is also available as YAHOO.ext.Template</b>.
+* @constructor
+* @param {String/Array} html The HTML fragment or an array of fragments to join('') or multiple arguments to join('')
+*/
+Clipperz.YUI.DomHelper.Template = function(html){
+    if(html instanceof Array){
+        html = html.join(''); 
+    }else if(arguments.length > 1){
+        html = Array.prototype.join.call(arguments, '');
+    }
+    /**@private*/
+    this.html = html;
+};
+Clipperz.YUI.DomHelper.Template.prototype = {
+    /**
+     * Returns an HTML fragment of this template with the specified values applied
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @return {String}
+     */
+    applyTemplate : function(values){
+        if(this.compiled){
+            return this.compiled(values);
+        }
+        var empty = '';
+        var fn = function(match, index){
+            if(typeof values[index] != 'undefined'){
+                return values[index];
+            }else{
+                return empty;
+            }
+        }
+        return this.html.replace(this.re, fn);
+    },
+    
+    /**
+    * The regular expression used to match template variables 
+    * @type RegExp
+    * @property 
+    */
+    re : /\{([\w|-]+)\}/g,
+    
+    /**
+     * Compiles the template into an internal function, eliminating the RegEx overhead
+     */
+    compile : function(){
+        var body = ["this.compiled = function(values){ return ['"];
+        body.push(this.html.replace(this.re, "', values['$1'], '"));
+        body.push("'].join('');};");
+        eval(body.join(''));
+        return this;
+    },
+   
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) before el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    insertBefore: function(el, values, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode = Clipperz.YUI.DomHelper.insertHtml('beforeBegin', el, this.applyTemplate(values));
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    },
+    
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) after el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    insertAfter : function(el, values, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode = Clipperz.YUI.DomHelper.insertHtml('afterEnd', el, this.applyTemplate(values));
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    },
+    
+    /**
+     * Applies the supplied values to the template and append the new node(s) to el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    append : function(el, values, returnElement){
+		var sanitizedValues;
+		var key;
+		
+//		sanitizedValues = MochiKit.Base.map(sanitizedValues)
+//console.log("values", values);
+		sanitizedValues = {};
+		for (key in values) {
+			sanitizedValues[key] = Clipperz.Base.sanitizeString(values[key]);
+		}
+//console.log("sanitizedValues", sanitizedValues);
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode = Clipperz.YUI.DomHelper.insertHtml('beforeEnd', el, this.applyTemplate(sanitizedValues));
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    },
+    
+    /**
+     * Applies the supplied values to the template and overwrites the content of el with the new node(s)
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    overwrite : function(el, values, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        el.innerHTML = '';
+        var newNode = Clipperz.YUI.DomHelper.insertHtml('beforeEnd', el, this.applyTemplate(values));
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    }
+};
+/**
+ * Alias for applyTemplate
+ * @method
+ */
+Clipperz.YUI.DomHelper.Template.prototype.apply = Clipperz.YUI.DomHelper.Template.prototype.applyTemplate;
+
+YAHOO.ext.Template = Clipperz.YUI.DomHelper.Template;
diff --git a/frontend/beta/js/Clipperz/YUI/DomQuery.js b/frontend/beta/js/Clipperz/YUI/DomQuery.js
new file mode 100644
index 0000000..84aac08
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/DomQuery.js
@@ -0,0 +1,710 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+/*
+ * yui-ext 0.40
+ * Copyright(c) 2006, Jack Slocum.
+ */
+
+/**
+ * @class Ext.DomQuery
+ * Provides high performance selector/xpath processing by compiling queries into reusable functions.
+ * New pseudo classes and matchers can be plugged. It works on HTML and XML documents (if a content node is passed in).
+ * @singleton
+ */
+Ext.DomQuery = function(){
+    var cache = {}, simpleCache = {}, valueCache = {};
+    var nonSpace = /\S/;
+    var trimRe = /^\s*(.*?)\s*$/;
+    var tplRe = /\{(\d+)\}/g;
+    var modeRe = /^(\s?[\/>]\s?|\s|$)/;
+    var clsRes = {};
+    
+    function child(p, index){
+        var i = 0;
+        var n = p.firstChild;
+        while(n){
+            if(n.nodeType == 1){
+               i++;
+               if(i == index){
+                   return n;
+               }
+            }
+            n = n.nextSibling;
+        }
+        return null;
+    };
+    
+    function next(d){
+        var n = d.nextSibling;
+        while(n && n.nodeType != 1){
+            n = n.nextSibling;
+        }
+        return n;
+    };
+    
+    function prev(d){
+        var n = d.previousSibling;
+        while(n && n.nodeType != 1){
+            n = n.previousSibling;
+        }
+        return n;
+    };
+    
+    function clean(d){
+        var n = d.firstChild, ni = -1;
+ 	    while(n){
+ 	        var nx = n.nextSibling;
+ 	        if(n.nodeType == 3 && !nonSpace.test(n.nodeValue)){
+ 	            d.removeChild(n);
+ 	        }else{
+ 	            n.nodeIndex = ++ni;
+ 	        }
+ 	        n = nx;
+ 	    }
+ 	    return this;
+ 	};
+    
+    function byClassName(c, a, v){
+        if(!v){
+            return c;
+        }
+        var re = clsRes[v];
+        if(!re){
+            re = new RegExp('(?:^|\\s)(?:' + v + ')(?:\\s|$)');
+            clsRes[v] = re;
+        }
+        var r = [];
+        for(var i = 0, ci; ci = c[i]; i++){
+            if(re.test(ci.className)){
+                r[r.length] = ci;
+            }
+        }
+        return r;
+    };
+    
+    function convert(c){
+        if(c.slice){
+            return c;
+        }
+        var r = [];
+        for(var i = 0, l = c.length; i < l; i++){
+            r[r.length] = c[i];
+        }
+        return r;
+    };
+    
+    function attrValue(n, attr){
+        if(!n.tagName && typeof n.length != 'undefined'){
+            n = n[0];
+        }
+        if(!n){
+            return null;
+        }
+        if(attr == 'for'){
+            return n.htmlFor;
+        }
+        if(attr == 'class' || attr == 'className'){
+            return n.className;
+        }
+        return n.getAttribute(attr) || n[attr];
+          
+    };
+    
+    function getNodes(ns, mode, tagName){
+        var result = [], cs;
+        if(!ns){
+            return result;
+        }
+        mode = mode ? mode.replace(trimRe, '$1') : '';
+        tagName = tagName || '*';
+        if(ns.tagName || ns == document){
+            ns = [ns];   
+        }
+        if(mode != '/' && mode != '>'){
+            for(var i = 0, ni; ni = ns[i]; i++){
+                cs = ni.getElementsByTagName(tagName);
+                result = concat(result, cs);
+            }
+        }else{
+            for(var i = 0, ni; ni = ns[i]; i++){
+                var cn = ni.getElementsByTagName(tagName);
+                for(var j = 0, cj; cj = cn[j]; j++){
+                    if(cj.parentNode == ni){
+                        result[result.length] = cj;
+                    }
+                }
+            }
+            
+        }
+        return result;
+    };
+    
+    function concat(a, b){
+        if(b.slice){
+            return a.concat(b);
+        }
+        for(var i = 0, l = b.length; i < l; i++){
+            a[a.length] = b[i];
+        }
+        return a;
+    }
+    
+    function byTag(cs, tagName){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!tagName){
+            return cs;
+        }
+        var r = []; tagName = tagName.toLowerCase();
+        for(var i = 0, ci; ci = cs[i]; i++){
+            if(ci.nodeType == 1 && ci.tagName.toLowerCase()==tagName){
+                r[r.length] = ci;
+            }
+        }
+        return r; 
+    };
+    
+    function byId(cs, attr, id){
+        if(cs.tagName || cs == document){
+            cs = [cs];
+        }
+        if(!id){
+            return cs;
+        }
+        var r = [];
+        for(var i = 0, l = cs.length; i < l; i++){
+            var ci = cs[i];
+            if(ci && ci.id == id){
+                r[r.length] = ci;
+            }
+        }
+        return r; 
+    };
+    
+    function byAttribute(cs, attr, value, op, custom){
+        var r = [], st = custom=='{';
+        var f = Ext.DomQuery.operators[op];
+        for(var i = 0, l = cs.length; i < l; i++){
+            var a;
+            if(st){
+                a = Ext.DomQuery.getStyle(cs[i], attr);
+            }
+            else if(attr == 'class' || attr == 'className'){
+                a = cs[i].className;
+            }else if(attr == 'for'){
+                a = cs[i].htmlFor;
+            }else{
+                a = cs[i].getAttribute(attr);
+            }
+            if((f && f(a, value)) || (!f && a)){
+                r[r.length] = cs[i];
+            }
+        }
+        return r;
+    };
+    
+    function byPseudo(cs, name, value){
+        return Ext.DomQuery.pseudos[name](cs, value);
+    };
+    
+    // This is for IE MSXML which does not support expandos.
+    // IE runs the same speed using setAttribute, however FF slows way down
+    // and Safari completely fails so they need to continue to use expandos.
+    // Branched at load time for faster execution.
+    var isIE = window.ActiveXObject;
+    var addAttr = isIE ? 
+           function(n, a, v){
+              n.setAttribute(a, v);
+           } : 
+           function(n, a, v){
+              n[a] = v;
+           };
+    var getAttr = isIE ? 
+           function(n, a){
+              return n.getAttribute(a);
+           } : 
+           function(n, a){
+              return n[a];
+           };
+    var clearAttr = isIE ? 
+           function(n, a){
+              n.removeAttribute(a);
+           } : 
+           function(n, a, v){
+              delete n[a];
+           };
+    
+    function nodup(cs){
+        if(!cs.length){
+            return cs;
+        }
+        addAttr(cs[0], '_nodup', true);
+        var r = [cs[0]];
+        for(var i = 1, len = cs.length; i < len; i++){
+            var c = cs[i];
+            if(!getAttr(c, '_nodup')){
+                addAttr(c, '_nodup', true);
+                r[r.length] = c;
+            }
+        }
+        for(var i = 0, len = cs.length; i < len; i++){
+            clearAttr(cs[i], '_nodup');
+        }
+        return r;
+    }
+    
+    function quickDiff(c1, c2){
+        if(!c1.length){
+            return c2;
+        }
+        for(var i = 0, len = c1.length; i < len; i++){
+            addAttr(c1[i], '_qdiff', true);
+        }
+        var r = [];
+        for(var i = 0, len = c2.length; i < len; i++){
+            if(!getAttr(c2[i], '_qdiff')){
+                r[r.length] = c2[i];
+            }
+        }
+        for(var i = 0, len = c1.length; i < len; i++){
+            clearAttr(c1[i], '_qdiff');
+        }
+        return r;
+    }
+    
+    function quickId(ns, mode, root, id){
+        if(ns == root){
+           var d = root.ownerDocument || root;
+           return d.getElementById(id);
+        }
+        ns = getNodes(ns, mode, '*');
+        return byId(ns, null, id);
+    }
+    
+    return {
+        getStyle : function(el, name){
+            return YAHOO.util.Dom.getStyle(el, name);  
+        },
+        /**
+         * Compiles a selector/xpath query into a reusable function. The returned function
+         * takes one parameter "root" (optional), which is the context node from where the query should start. 
+         * @param {String} selector The selector/xpath query
+         * @param {String} type (optional) Either 'select' (the default) or 'simple' for a simple selector match
+         * @return {Function}
+         */
+        compile : function(path, type){
+            // strip leading slashes
+            while(path.substr(0, 1)=='/'){
+                path = path.substr(1);
+            }
+            type = type || 'select';
+            
+            var fn = ['var f = function(root){\n var mode; var n = root || document;\n'];
+            var q = path, mode, lq;
+            var tk = Ext.DomQuery.matchers;
+            var tklen = tk.length;
+            var mm;
+            while(q && lq != q){
+                lq = q;
+                var tm = q.match(/^(#)?([\w-\*]+)/);
+                if(type == 'select'){
+                    if(tm){
+                        if(tm[1] == '#'){
+                            fn[fn.length] = 'n = quickId(n, mode, root, "'+tm[2]+'");';
+                        }else{
+                            fn[fn.length] = 'n = getNodes(n, mode, "'+tm[2]+'");';
+                        }
+                        q = q.replace(tm[0], '');
+                    }else{
+                        fn[fn.length] = 'n = getNodes(n, mode, "*");';
+                    }
+                }else{
+                    if(tm){
+                        if(tm[1] == '#'){
+                            fn[fn.length] = 'n = byId(n, null, "'+tm[2]+'");';
+                        }else{
+                            fn[fn.length] = 'n = byTag(n, "'+tm[2]+'");';
+                        }
+                        q = q.replace(tm[0], '');
+                    }
+                }
+                while(!(mm = q.match(modeRe))){
+                    var matched = false;
+                    for(var j = 0; j < tklen; j++){
+                        var t = tk[j];
+                        var m = q.match(t.re);
+                        if(m){
+                            fn[fn.length] = t.select.replace(tplRe, function(x, i){
+                                                    return m[i];
+                                                });
+                            q = q.replace(m[0], '');
+                            matched = true;
+                            break;
+                        }
+                    }
+                    // prevent infinite loop on bad selector
+                    if(!matched){
+                        throw 'Error parsing selector, parsing failed at "' + q + '"';
+                    }
+                }
+                if(mm[1]){
+                    fn[fn.length] = 'mode="'+mm[1]+'";';
+                    q = q.replace(mm[1], '');
+                }
+            }
+            fn[fn.length] = 'return nodup(n);\n}';
+            eval(fn.join(''));
+            return f;
+        },
+        
+        /**
+         * Selects a group of elements.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @return {Array}
+         */
+        select : function(path, root, type){
+            if(!root || root == document){
+                root = document;
+            }
+            if(typeof root == 'string'){
+                root = document.getElementById(root);
+            }
+            var paths = path.split(',');
+            var results = [];
+            for(var i = 0, len = paths.length; i < len; i++){
+                var p = paths[i].replace(trimRe, '$1');
+                if(!cache[p]){
+                    cache[p] = Ext.DomQuery.compile(p);
+                    if(!cache[p]){
+                        throw p + ' is not a valid selector';
+                    }
+                }
+                var result = cache[p](root);
+                if(result && result != document){
+                    results = results.concat(result);
+                }
+            }
+            return results;
+        },
+        
+        /**
+         * Selects a single element.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @return {Element}
+         */
+        selectNode : function(path, root){
+            return Ext.DomQuery.select(path, root)[0];
+        },
+        
+        /**
+         * Selects the value of a node, optionally replacing null with the defaultValue.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @param {String} defaultValue
+         */
+        selectValue : function(path, root, defaultValue){
+            path = path.replace(trimRe, '$1');
+            if(!valueCache[path]){
+                valueCache[path] = Ext.DomQuery.compile(path, 'simple');
+            }
+            var n = valueCache[path](root);
+            n = n[0] ? n[0] : n;
+            var v = (n && n.firstChild ? n.firstChild.nodeValue : null);
+            return (v === null ? defaultValue : v);
+        },
+        
+        /**
+         * Selects the value of a node, parsing integers and floats.
+         * @param {String} selector The selector/xpath query
+         * @param {Node} root (optional) The start of the query (defaults to document).
+         * @param {Number} defaultValue
+         * @return {Number}
+         */
+        selectNumber : function(path, root, defaultValue){
+            var v = Ext.DomQuery.selectValue(path, root, defaultValue || 0);
+            return parseFloat(v);
+        },
+        
+        /**
+         * Returns true if the passed element(s) match the passed simple selector (e.g. div.some-class or span:first-child)
+         * @param {String/HTMLElement/Array} el An element id, element or array of elements
+         * @param {String} selector The simple selector to test
+         * @return {Boolean}
+         */
+        is : function(el, ss){
+            if(typeof el == 'string'){
+                el = document.getElementById(el);
+            }
+            var isArray = (el instanceof Array);
+            var result = Ext.DomQuery.filter(isArray ? el : [el], ss);
+            return isArray ? (result.length == el.length) : (result.length > 0);
+        },
+        
+        /**
+         * Filters an array of elements to only include matches of a simple selector (e.g. div.some-class or span:first-child)
+         * @param {Array} el An array of elements to filter
+         * @param {String} selector The simple selector to test
+         * @param {Boolean} nonMatches If true, it returns the elements that DON'T match 
+         * the selector instead of the ones that match
+         * @return {Array}
+         */
+        filter : function(els, ss, nonMatches){
+            ss = ss.replace(trimRe, '$1');
+            if(!simpleCache[ss]){
+                simpleCache[ss] = Ext.DomQuery.compile(ss, 'simple');
+            }
+            var result = simpleCache[ss](els);
+            return nonMatches ? quickDiff(result, els) : result;
+        },
+        
+        /**
+         * Collection of matching regular expressions and code snippets. 
+         */
+        matchers : [{
+                re: /^\.([\w-]+)/,
+                select: 'n = byClassName(n, null, "{1}");'
+            }, {
+                re: /^\:([\w-]+)(?:\(((?:[^\s>\/]*|.*?))\))?/,
+                select: 'n = byPseudo(n, "{1}", "{2}");'
+            },{
+                re: /^(?:([\[\{])(?:@)?([\w-]+)\s?(?:(=|.=)\s?['"]?(.*?)["']?)?[\]\}])/,
+                select: 'n = byAttribute(n, "{2}", "{4}", "{3}", "{1}");'
+            }, {
+                re: /^#([\w-]+)/,
+                select: 'n = byId(n, null, "{1}");'
+            },{
+                re: /^@([\w-]+)/,
+                select: 'return {firstChild:{nodeValue:attrValue(n, "{1}")}};'
+            }
+        ],
+        
+        /**
+         * Collection of operator comparison functions. The default operators are =, !=, ^=, $=, *= and %=.
+         * New operators can be added as long as the match the format <i>c</i>= where <i>c<i> is any character other than space, &gt; &lt;.
+         */
+        operators : {
+            '=' : function(a, v){
+                return a == v;
+            },
+            '!=' : function(a, v){
+                return a != v;
+            },
+            '^=' : function(a, v){
+                return a && a.substr(0, v.length) == v;
+            },
+            '$=' : function(a, v){
+                return a && a.substr(a.length-v.length) == v;
+            },
+            '*=' : function(a, v){
+                return a && a.indexOf(v) !== -1;
+            },
+            '%=' : function(a, v){
+                return (a % v) == 0;
+            }
+        },
+        
+        /**
+         * Collection of "pseudo class" processors. Each processor is passed the current nodeset (array)
+         * and the argument (if any) supplied in the selector.
+         */
+        pseudos : {
+            'first-child' : function(c){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i];
+                    if(!prev(ci)){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'last-child' : function(c){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i];
+                    if(!next(ci)){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'nth-child' : function(c, a){
+                var r = [];
+                if(a != 'odd' && a != 'even'){
+                    for(var i = 0, ci; ci = c[i]; i++){
+                        var m = child(ci.parentNode, a);
+                        if(m == ci){
+                            r[r.length] = m;
+                        }
+                    }
+                    return r;
+                }
+                var p;
+                // first let's clean up the parent nodes
+                for(var i = 0, l = c.length; i < l; i++){
+                    var cp = c[i].parentNode;
+                    if(cp != p){
+                        clean(cp);
+                        p = cp;
+                    }
+                }
+                // then lets see if we match
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i], m = false;
+                    if(a == 'odd'){
+                        m = ((ci.nodeIndex+1) % 2 == 1);
+                    }else if(a == 'even'){
+                        m = ((ci.nodeIndex+1) % 2 == 0);
+                    }
+                    if(m){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'only-child' : function(c){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i];
+                    if(!prev(ci) && !next(ci)){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'empty' : function(c){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i];
+                    if(!ci.firstChild){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'contains' : function(c, v){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    var ci = c[i];
+                    if(ci.innerHTML.indexOf(v) !== -1){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'checked' : function(c){
+                var r = [];
+                for(var i = 0, l = c.length; i < l; i++){
+                    if(c[i].checked == 'checked'){
+                        r[r.length] = c[i];
+                    }
+                }
+                return r;
+            },
+            
+            'not' : function(c, ss){
+                return Ext.DomQuery.filter(c, ss, true);
+            },
+            
+            'odd' : function(c){
+                return this['nth-child'](c, 'odd');
+            },
+            
+            'even' : function(c){
+                return this['nth-child'](c, 'even');
+            },
+            
+            'nth' : function(c, a){
+                return c[a-1];
+            },
+            
+            'first' : function(c){
+                return c[0];
+            },
+            
+            'last' : function(c){
+                return c[c.length-1];
+            },
+            
+            'has' : function(c, ss){
+                var s = Ext.DomQuery.select;
+                var r = [];
+                for(var i = 0, ci; ci = c[i]; i++){
+                    if(s(ss, ci).length > 0){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'next' : function(c, ss){
+                var is = Ext.DomQuery.is;
+                var r = [];
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = next(ci);
+                    if(n && is(n, ss)){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            },
+            
+            'prev' : function(c, ss){
+                var is = Ext.DomQuery.is;
+                var r = [];
+                for(var i = 0, ci; ci = c[i]; i++){
+                    var n = prev(ci);
+                    if(n && is(n, ss)){
+                        r[r.length] = ci;
+                    }
+                }
+                return r;
+            }
+        }
+    };
+}();
+
+/**
+ * Selects an array of DOM nodes by CSS/XPath selector. Shorthand of {@link Ext.DomQuery#select}
+ * @param {String} path The selector/xpath query
+ * @param {Node} root (optional) The start of the query (defaults to document).
+ * @return {Array}
+ * @member Ext
+ * @method query
+ */
+Ext.query = Ext.DomQuery.select;
diff --git a/frontend/beta/js/Clipperz/YUI/Drawer.js b/frontend/beta/js/Clipperz/YUI/Drawer.js
new file mode 100644
index 0000000..394912e
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/Drawer.js
@@ -0,0 +1,238 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.YUI) == 'undefined') { Clipperz.YUI = {}; }
+
+
+Clipperz.YUI.Drawer = function(anElement, aRegion) {
+	this._status = 'slideIn';
+	
+	this._element = YAHOO.ext.Element.get(anElement);
+	this._region = aRegion || null;
+
+	this._collapsedElement = this.element().getChildrenByClassName("drawer-collapsed")[0];
+	this._contentElement = this.element().getChildrenByClassName("drawer-content")[0];
+
+	
+	this._wholeCollapedElement = this.enhanceCollapsedElement();
+	this._wholeCollapedElement.setWidth(this.region().element().getWidth());
+	this._wholeCollapedElement.setHeight(this.region().element().getHeight());
+	
+	this._contentWrapper = this.enhanceContentElement();
+	this._contentElementActor = new YAHOO.ext.Actor(this.contentWrapper().dom);
+	this.contentElementActor().hide();
+	
+	this._contentWidth = 200;
+};
+
+YAHOO.extendX(Clipperz.YUI.Drawer, YAHOO.ext.util.Observable, {
+
+	'element': function() {
+		return this._element;
+	},
+
+	//-----------------------------------------------------
+
+	'status': function() {
+		return this._status;
+	},
+	
+	'setStatus': function(aValue) {
+		this._status = aValue;
+	},
+	
+	//-----------------------------------------------------
+
+	'collapsedElement': function() {
+		return this._collapsedElement;
+	},
+
+	//-----------------------------------------------------
+
+	'contentElement': function() {
+		return this._contentElement;
+	},
+	
+	//-----------------------------------------------------
+
+	'contentElementActor': function() {
+		return this._contentElementActor;
+	},
+	
+	//-----------------------------------------------------
+
+	'contentWrapper': function() {
+		return this._contentWrapper;
+	},
+	
+	//-----------------------------------------------------
+
+	'contentWidth': function() {
+		return this._contentWidth;
+	},
+
+	//-----------------------------------------------------
+
+	'region': function() {
+		return this._region;
+	},
+	
+	//-----------------------------------------------------
+
+	'enhanceCollapsedElement': function() {
+		var	wrapper;
+		var link;
+		
+		wrapper = this.collapsedElement().wrap({tag:'div', cls:'drawer-collapsedElement-wrapper', children:[
+			{tag:'div', cls:'drawer-pin-button', children:[
+				{tag:'a', cls:'drawer-pin-button', href:"#", children:[
+					{tag:'img', src:'./images/directLogins/drawer/mm-expand.gif'}
+				]}
+			]}
+		]});
+		
+		link = wrapper.getChildrenByClassName('drawer-pin-button', 'a')[0];
+		MochiKit.Signal.connect(link.dom, 'onclick', this, 'pinDrawer');
+		
+		this.collapsedElement().setHeight('100%');
+		this.collapsedElement().setStyle('cursor', 'pointer');
+		MochiKit.Signal.connect(this.collapsedElement().dom, 'onclick', this, 'showDrawer');
+		
+		return wrapper;
+	},
+
+	//-----------------------------------------------------
+
+	'enhanceContentElement': function() {
+		var wrapper;
+		
+		wrapper = this.contentElement().wrap({tag:'div', cls:'drawer-content-wrapper', children:[
+			{tag:'div', cls:'drawer-content-header', html:'direct login', style:'width:100%;'}
+		]});
+		
+		MochiKit.Signal.connect(wrapper.dom, 'onclick', this, 'hideDrawer');
+		return wrapper;
+	},
+
+	//-----------------------------------------------------
+
+	'pinDrawer': function() {
+		alert("pin drawer");
+	},
+
+	//-----------------------------------------------------
+
+	'showDrawer': function() {
+		if (this.status() == 'slideIn') {
+			var actor;
+
+			this.setStatus('slidingOut');
+			actor = this.contentElementActor();
+			actor.setHeight(this.region().element().getHeight());
+		
+			actor.startCapture(true);
+			actor.alignTo(this.element(), 'tr');
+			actor.blindShow('left', this.contentWidth(), .35);
+			actor.play(this.onSlideOut.createDelegate(this));
+		}
+	},
+	
+	//-----------------------------------------------------
+
+	'onSlideOut': function() {
+		this.setStatus('slideOut');
+MochiKit.Logging.logDebug(">>> onSlideOut");
+//		alert("done");
+	},
+
+	//-----------------------------------------------------
+/*
+	'showContentElement': function() {
+		var top, left, width, height;
+
+MochiKit.Logging.logDebug(">>> showContentElement");
+
+
+		top = this.element().getTop(true);
+		left = this.element().getRight();
+		width = this.contentWidth();
+		height = this.element().getHeight();
+
+		this.contentWrapper().setStyle('position', 'absolute');
+		this.contentWrapper().setStyle('overflow', 'none');
+		this.contentWrapper().setStyle('visibility', 'visible');
+		this.contentWrapper().setStyle('z-index', '10');
+
+		this.contentWrapper().setLeft(left);
+		this.contentWrapper().setTop(top);
+		this.contentWrapper().setHeight(height);
+		this.contentWrapper().setWidth(width);
+
+		this.contentWrapper().show();
+	},
+*/	
+	//-----------------------------------------------------
+
+	'hideDrawer': function() {
+		if (this.status() == 'slideOut') {
+			var actor;
+
+			this.setStatus('slidingIn');
+
+			actor = this.contentElementActor();
+			actor.setHeight(this.region().element().getHeight());
+		
+			actor.startCapture(true);
+			actor.alignTo(this.element(), 'tr');
+			actor.blindHide('left', .35);
+			actor.setVisible(false);
+			actor.play(this.onSlideIn.createDelegate(this));
+		}
+	},
+	
+	//-----------------------------------------------------
+
+	'onSlideIn': function() {
+		this.setStatus('slideIn');
+MochiKit.Logging.logDebug(">>> onSlideIn");
+//		alert("done");
+	},
+
+	//-----------------------------------------------------
+	
+	'hideContentElement': function() {
+		this.contentWrapper().hide();
+	},
+	
+	//-----------------------------------------------------
+	//-----------------------------------------------------
+
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
\ No newline at end of file
diff --git a/frontend/beta/js/Clipperz/YUI/IBLayoutManager.js b/frontend/beta/js/Clipperz/YUI/IBLayoutManager.js
new file mode 100644
index 0000000..626b699
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/IBLayoutManager.js
@@ -0,0 +1,114 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.YUI) == 'undefined') { Clipperz.YUI = {}; }
+
+
+Clipperz.YUI.IBLayoutManager = function(container, config) {
+	var regionName;
+	var	element;
+	
+	config = config || {};
+	
+    Clipperz.YUI.IBLayoutManager.superclass.constructor.call(this, container);
+    this.hideOnLayout = config.hideOnLayout || false;
+
+	element = YAHOO.ext.Element.get(container);
+	element.setStyle('position', 'absolute');
+	element.setStyle('overflow', 'hidden');
+	
+	for (regionName in config.regions) {
+		var newRegion;
+		
+		newRegion = new new Clipperz.YUI.IBLayoutRegion(this, regionName, config.regions[regionName]);
+		this.addRegion(regionName, newRegion);
+	}
+	
+	this.layout();
+};
+
+YAHOO.extendX(Clipperz.YUI.IBLayoutManager, YAHOO.ext.LayoutManager, {
+	
+	'toString': function() {
+		return "IBLayoutManager (" + this.el.id + ")";
+	},
+	
+	//-----------------------------------------------------
+
+	'add': function(aName, aPanel) {
+		var regionName;
+		
+        regionName = aName.toLowerCase();
+        return this.regions[regionName].add(aPanel);
+	},
+
+	//-----------------------------------------------------
+    
+	'addRegion': function(aRegion) {
+		var regionName;
+		
+		regionName = aRegion.name().toLowerCase();
+		if (!this.regions[regionName]) {
+//MochiKit.Logging.logDebug("--- adding region with name: " + aRegion.name());
+			this.regions[regionName] = aRegion;
+		} else {
+			// ????
+		}
+		
+		return aRegion;
+	},
+
+	//-----------------------------------------------------
+
+	'getRegion': function(target){
+		return this.regions[target.toLowerCase()];
+	},
+	
+	//-----------------------------------------------------
+
+	'layout': function(){
+		var	region;
+
+//MochiKit.Logging.logDebug(">>> IBLayoutManager.layout - regions: " + Clipperz.Base.serializeJSON(MochiKit.Base.keys(this.regions)));
+		for (region in this.regions) {
+//MochiKit.Logging.logDebug("--- IBLayoutManager.layout - region: " + region);
+			this.regions[region].layout();
+		}
+//MochiKit.Logging.logDebug("<<< IBLayoutManager.layout");
+	},
+	
+	//-----------------------------------------------------
+
+	'getSize': function() {
+		return this.el.getSize();
+	},
+    
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
diff --git a/frontend/beta/js/Clipperz/YUI/IBLayoutRegion.js b/frontend/beta/js/Clipperz/YUI/IBLayoutRegion.js
new file mode 100644
index 0000000..2fd4377
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/IBLayoutRegion.js
@@ -0,0 +1,249 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+if (typeof(Clipperz) == 'undefined') { Clipperz = {}; }
+if (typeof(Clipperz.YUI) == 'undefined') { Clipperz.YUI = {}; }
+
+
+Clipperz.YUI.IBLayoutRegion = function(aManager, aName, aConfig) {
+	this._configuration = aConfig;
+
+//	Clipperz.YUI.IBLayoutRegion.superclass.constructor.call();
+	Clipperz.YUI.IBLayoutRegion.superclass.constructor.call(this, aManager, aConfig, aName);
+};
+
+YAHOO.extendX(Clipperz.YUI.IBLayoutRegion, YAHOO.ext.LayoutRegion, {
+
+	'toString': function() {
+		return "IBLayoutRegion (" + this.name() + ")";
+	},
+
+	//-----------------------------------------------------
+
+	'name': function() {
+		return this.position;
+	},
+
+	//-----------------------------------------------------
+
+	'manager': function() {
+		return this.mgr;
+	},
+
+	'configuration': function() {
+		return this._configuration;
+	},
+
+	//-----------------------------------------------------
+
+	'getAttributeValue': function(anAttribute) {
+		var result;
+		
+		switch(anAttribute) {
+			case "top":
+				result = this.element().getTop();
+				break;
+			case "left":
+				result = this.element().getLeft();
+				break;
+			case "bottom":
+				result = this.element().getBottom();
+				break;
+			case "right":
+				result = this.element().getRight();
+				break;
+			case "height":
+				result = this.element().getHeight();
+				break;
+			case "width":
+				result = this.element().getWidth();
+				break;
+		}
+//MochiKit.Logging.logDebug("--- " + this.name() + " [" + anAttribute + "] = " + result);
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------
+
+	'normalizeConfigureValue': function(aConfigurationValue) {
+		var result;
+
+//MochiKit.Logging.logDebug("--- normalizeConfigureValue - " + aConfigurationValue);
+		if (typeof(aConfigurationValue) == 'number') {
+			result = aConfigurationValue;
+		} else if (aConfigurationValue == 'auto') {
+			result = aConfigurationValue;
+		} else {
+			var splitValues;
+			var referenceValue;
+			var deltaValue;
+			var targetRegion;
+			var targetAttribute;
+			
+			splitValues = aConfigurationValue.split('+');
+			referenceValue = Clipperz.Base.trim(splitValues[0]);
+			deltaValue = Clipperz.Base.trim(splitValues[1] || "");
+			
+			splitValues = referenceValue.split('.');
+			targetRegion = splitValues[0];
+			targetAttribute = splitValues[1];
+			
+//MochiKit.Logging.logDebug("> " + aConfigurationValue);
+//MochiKit.Logging.logDebug(">> manager: " + this.manager());
+//MochiKit.Logging.logDebug(">> targetRegion: " + targetRegion);
+//MochiKit.Logging.logDebug(">>> " + this.manager().getRegion(targetRegion));
+			targetValue = this.manager().getRegion(targetRegion).getAttributeValue(targetAttribute);
+//MochiKit.Logging.logDebug(">>>> " + targetRegion + "." + targetAttribute + " + " + deltaValue + " = " + targetValue);
+
+			result = targetValue + (deltaValue - 0);
+
+//MochiKit.Logging.logDebug("<<< " + aConfigurationValue + " = " + result);
+		}
+
+		return result;
+	},
+	
+	'normalizedConfiguration': function(aConfiguration) {
+		var	result;
+		var	key;
+		
+		result = {};
+
+//MochiKit.Logging.logDebug("--- normalizedConfiguration - keys: " + Clipperz.Base.serializeJSON(MochiKit.Base.keys(aConfiguration)));
+		for (key in aConfiguration) {
+			if ((key == 'top') || (key == 'bottom') || (key == 'left') || (key == 'rigth') || (key == 'width') || (key == 'height')) {
+				result[key] = this.normalizeConfigureValue(aConfiguration[key]);
+			} else {
+				result[key] = aConfiguration[key];
+			}
+		}
+		
+		return result;
+	},
+	
+	//-----------------------------------------------------
+
+	'element': function() {
+		return this.el;
+	},
+
+	//-----------------------------------------------------
+/*
+	'hide': function() {
+MochiKit.Logging.logDebug(">>> IBLayoutManager.hide()")
+		Clipperz.YUI.IBLayoutRegion.superclass.hide.call(this);
+	},
+*/
+	//-----------------------------------------------------
+/*
+	'add': function(aPanel) {
+		Clipperz.YUI.IBLayoutRegion.superclass.add.call(this, aPanel);
+		aPanel.el.fitToParent(true);
+	},
+*/
+	//-----------------------------------------------------
+
+	'updateBox': function(aBox) {
+//MochiKit.Logging.logDebug(">>> IBLayoutRegion.updateBox - " + aBox);
+		Clipperz.YUI.IBLayoutRegion.superclass.updateBox.call(this, aBox);
+	},
+	
+	//-----------------------------------------------------
+
+	'layout': function() {
+		var	top, left, bottom, right, width, height;
+		var	element;
+		var config;
+		var windowSize;
+		var containerSize;
+
+//MochiKit.Logging.logDebug(">>> IBLayoutRegion.layout - " + this);
+		config = this.normalizedConfiguration(this.configuration());
+		element = this.element();
+//		containerSize = this.manager().getSize(true);
+		containerSize = this.manager().getSize(false);
+		windowSize = {width: YAHOO.util.Dom.getViewportWidth(), height: YAHOO.util.Dom.getViewportHeight()};
+
+//		element.setStyle("position", "absolute");
+//		element.setStyle("overflow", "none");
+
+		if (typeof(config.top) == 'number') {
+			top = config.top;
+			
+			if (typeof(config.bottom) == 'number') { 
+				height =  containerSize.height - top - config.bottom;
+			} else if (typeof(config.height) == 'number') {
+				height = config.height;
+			} else {
+				//	???
+			}
+		} else {
+			if ((typeof(config.bottom) == 'number') && (typeof(config.height) == 'number')) {
+				top = containerSize.height - (config.height + config.bottom);
+				height = config.height;
+			} else if ((config.bottom == 'auto') && (typeof(config.height) == 'number')) {
+				top = ((containerSize.height - config.height) / 2);
+				height = config.height;
+			}
+		}
+
+		if (typeof(config.left) == 'number') {
+			left = config.left;
+			
+			if (typeof(config.right) == 'number') { 
+				width =  (containerSize.width - left - config.right);
+			} else if (typeof(config.width) == 'number') {
+				width = config.width;
+			} else {
+				//	???
+			}
+		} else {
+			if ((typeof(config.right) == 'number') && (typeof(config.width) == 'number')) {
+				left = containerSize.width - (config.width + config.right);
+				width = config.width;
+			} else if ((config.right == 'auto') && (typeof(config.width) == 'number')) {
+				left = ((containerSize.width - config.width) / 2);
+				width = config.width;
+			}
+		}
+//MochiKit.Logging.logDebug("--- setting position (top: " + top + ", left: " + left + ", width: " + width + ", height: " + height + ")");
+		element.setTop(top);
+		element.setLeft(left);
+		element.setWidth(width);
+		element.setHeight(height);
+		
+		if (this.activePanel != null) {
+			this.activePanel.setSize(width, height);
+		}
+//MochiKit.Logging.logDebug("<<< IBLayoutRegion.layout");
+	},
+
+	//-----------------------------------------------------
+	__syntaxFix__: '__syntaxFix__'
+});
diff --git a/frontend/beta/js/Clipperz/YUI/MessageBox.js b/frontend/beta/js/Clipperz/YUI/MessageBox.js
new file mode 100644
index 0000000..ec33d7d
--- a/dev/null
+++ b/frontend/beta/js/Clipperz/YUI/MessageBox.js
@@ -0,0 +1,265 @@
+/*
+
+Copyright 2008-2011 Clipperz Srl
+
+This file is part of Clipperz's Javascript Crypto Library.
+Javascript Crypto Library provides web developers with an extensive
+and efficient set of cryptographic functions. The library aims to
+obtain maximum execution speed while preserving modularity and
+reusability.
+For further information about its features and functionalities please
+refer to http://www.clipperz.com
+
+* Javascript Crypto Library is free software: you can redistribute
+  it and/or modify it under the terms of the GNU Affero General Public
+  License as published by the Free Software Foundation, either version
+  3 of the License, or (at your option) any later version.
+
+* Javascript Crypto Library is distributed in the hope that it will
+  be useful, but WITHOUT ANY WARRANTY; without even the implied
+  warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
+  See the GNU Affero General Public License for more details.
+
+* You should have received a copy of the GNU Affero General Public
+  License along with Javascript Crypto Library.  If not, see
+  <http://www.gnu.org/licenses/>.
+
+*/
+
+Clipperz.YUI.MessageBox = function(){
+    var dlg, opt, mask;
+    var bodyEl, msgEl, textboxEl, textareaEl, progressEl, pp;
+    var buttons, activeTextEl, bwidth;
+    
+    var handleButton = function(button){
+        if(typeof opt.fn == 'function'){
+            if(opt.fn.call(opt.scope||window, button, activeTextEl.dom.value) !== false){
+                dlg.hide();
+            }
+        }else{
+            dlg.hide();
+        }
+    };
+    
+    return {
+	    updateButtons: function(b){
+	        var width = 0;
+	        if(!b){
+	            buttons['ok'].hide();
+	            buttons['cancel'].hide();
+	            buttons['yes'].hide();
+	            buttons['no'].hide();
+	            return width;
+	        }
+	        for(var k in buttons){
+	            if(typeof buttons[k] != 'function'){
+	                if(b[k]){
+	                    buttons[k].show();
+	                    buttons[k].setText(typeof b[k] == 'string' ? b[k] : YAHOO.ext.MessageBox.buttonText[k]);
+	                    width += buttons[k].el.getWidth()+15;
+	                }else{
+	                    buttons[k].hide();
+	                }
+	            }
+	        }
+	        return width;
+	    },
+
+        getDialog : function(){
+           if(!dlg){
+                dlg = new YAHOO.ext.BasicDialog('mb-dlg', {
+                    autoCreate:true,
+                    shadow:true,
+                    draggable:true,
+                    resizable:false,
+                    constraintoviewport:true,
+                    fixedcenter:true,
+                    shim:true,
+                    modal:true,
+                    width:400, height:100,
+                    buttonAlign:'center',
+                    closeClick : function(){
+                        if(opt && opt.buttons && opt.buttons.no && !opt.buttons.cancel){
+                            handleButton('no');
+                        }else{
+                            handleButton('cancel');
+                        }
+                    }
+                });
+                dlg.closeClick = function(){
+                    alert('wtf');
+                };
+                mask = dlg.mask;
+                dlg.addKeyListener(27, dlg.hide, dlg);
+                buttons = {};
+                buttons['ok'] = dlg.addButton(this.buttonText['ok'], handleButton.createCallback('ok'));
+                buttons['yes'] = dlg.addButton(this.buttonText['yes'], handleButton.createCallback('yes'));
+                buttons['no'] = dlg.addButton(this.buttonText['no'], handleButton.createCallback('no'));
+                buttons['cancel'] = dlg.addButton(this.buttonText['cancel'], handleButton.createCallback('cancel'));
+                bodyEl = dlg.body.createChild({
+                    tag:'div', 
+                    html:'<span class="ext-mb-text"></span><br /><input type="text" class="ext-mb-input"><textarea class="ext-mb-textarea"></textarea><div class="ext-mb-progress-wrap"><div class="ext-mb-progress"><div class="ext-mb-progress-bar">&#160;</div></div></div>'
+                });
+                msgEl = bodyEl.dom.firstChild;
+                textboxEl = getEl(bodyEl.dom.childNodes[2]);
+                textboxEl.enableDisplayMode();
+                textboxEl.addKeyListener([10,13], function(){
+                    if(dlg.isVisible() && opt && opt.buttons){
+                        if(opt.buttons.ok){
+                            handleButton('ok');
+                        }else if(opt.buttons.yes){
+                            handleButton('yes');
+                        }
+                    }
+                });
+                textareaEl = getEl(bodyEl.dom.childNodes[3]);
+                textareaEl.enableDisplayMode();
+                progressEl = getEl(bodyEl.dom.childNodes[4]);
+                progressEl.enableDisplayMode();
+                pp = getEl(progressEl.dom.firstChild.firstChild);
+            }
+            return dlg;
+        },
+        
+        updateText : function(text){
+            if(!dlg.isVisible() && !opt.width){
+                dlg.resizeTo(this.maxWidth, 100); // resize first so content is never clipped from previous shows
+            }
+            msgEl.innerHTML = text;
+            var w = Math.max(Math.min(opt.width || msgEl.offsetWidth, this.maxWidth), 
+                        Math.max(opt.minWidth || this.minWidth, bwidth));
+            if(opt.prompt){
+                activeTextEl.setWidth(w);
+            }
+            dlg.setContentSize(w, bodyEl.getHeight());
+        },        
+        
+        updateProgress : function(value, text){
+            if(text){
+                this.updateText(text);
+            }
+            pp.setWidth(value*progressEl.dom.firstChild.offsetWidth);
+        },        
+        
+        isVisible : function(){
+            return dlg && dlg.isVisible();  
+        },
+        
+        hide : function(){
+            if(this.isVisible()){
+                dlg.hide();
+            }  
+        },
+        
+        show : function(options){
+            var d = this.getDialog();
+            opt = options;
+            d.setTitle(opt.title || '&#160;');
+            d.close.setDisplayed(opt.closable !== false);
+            activeTextEl = textboxEl;
+            opt.prompt = opt.prompt || (opt.multiline ? true : false)
+            if(opt.prompt){
+                if(opt.multiline){
+                    textboxEl.hide();
+                    textareaEl.show();
+                    textareaEl.setHeight(typeof opt.multiline == 'number' ? 
+                        opt.multiline : this.defaultTextHeight);
+                    activeTextEl = textareaEl;
+                }else{
+                    textboxEl.show();
+                    textareaEl.hide();
+                }
+            }else{
+                textboxEl.hide();
+                textareaEl.hide();
+            }
+            progressEl.setDisplayed(opt.progress === true);
+            this.updateProgress(0);
+            activeTextEl.dom.value = opt.value || '';
+            if(opt.prompt){
+                dlg.setDefaultButton(activeTextEl);
+            }else{
+                var bs = opt.buttons;
+                var db = null;
+                if(bs && bs.ok){
+                    db = buttons['ok'];
+                }else if(bs && bs.yes){
+                    db = buttons['yes'];
+                }
+                dlg.setDefaultButton(db);
+            }
+            bwidth = this.updateButtons(opt.buttons);
+            this.updateText(opt.msg);
+            d.modal = opt.modal !== false;
+            d.mask = opt.modal !== false ? mask : false;
+            d.animateTarget = null;
+            d.show(options.animEl);
+        },
+        
+        progress : function(title, msg){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                progress:true,
+                closable:false
+            });
+        },
+
+		progressElement : function() {
+			return progressEl;
+		},
+        
+		opt: function() {
+			return opt;
+		},
+		
+        alert : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OK,
+                fn: fn,
+                scope : scope
+            });
+        },
+        
+        confirm : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.YESNO,
+                fn: fn,
+                scope : scope
+            });
+        },
+        
+        prompt : function(title, msg, fn, scope, multiline){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OKCANCEL,
+                fn: fn,
+                minWidth:250,
+                scope : scope,
+                prompt:true,
+                multiline: multiline
+            });
+        },
+        
+        OK : {ok:true},
+        YESNO : {yes:true, no:true},
+        OKCANCEL : {ok:true, cancel:true},
+        YESNOCANCEL : {yes:true, no:true, cancel:true},
+        
+        defaultTextHeight:75,
+        maxWidth : 500,
+        minWidth : 100,
+        buttonText : {
+            ok : 'OK',
+            cancel : 'Cancel',
+            yes : 'Yes',
+            no : 'No'
+        }
+    };
+}();
diff --git a/frontend/beta/js/JSON/json2.js b/frontend/beta/js/JSON/json2.js
new file mode 100644
index 0000000..bbeeca9
--- a/dev/null
+++ b/frontend/beta/js/JSON/json2.js
@@ -0,0 +1,481 @@
+/*
+    http://www.JSON.org/json2.js
+    2008-09-01
+
+    Public Domain.
+
+    NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
+
+    See http://www.JSON.org/js.html
+
+    This file creates a global JSON object containing two methods: stringify
+    and parse.
+
+        JSON2.stringify(value, replacer, space)
+            value       any JavaScript value, usually an object or array.
+
+            replacer    an optional parameter that determines how object
+                        values are stringified for objects. It can be a
+                        function or an array of strings.
+
+            space       an optional parameter that specifies the indentation
+                        of nested structures. If it is omitted, the text will
+                        be packed without extra whitespace. If it is a number,
+                        it will specify the number of spaces to indent at each
+                        level. If it is a string (such as '\t' or '&nbsp;'),
+                        it contains the characters used to indent at each level.
+
+            This method produces a JSON text from a JavaScript value.
+
+            When an object value is found, if the object contains a toJSON
+            method, its toJSON method will be called and the result will be
+            stringified. A toJSON method does not serialize: it returns the
+            value represented by the name/value pair that should be serialized,
+            or undefined if nothing should be serialized. The toJSON method
+            will be passed the key associated with the value, and this will be
+            bound to the object holding the key.
+
+            For example, this would serialize Dates as ISO strings.
+
+                Date.prototype.toJSON = function (key) {
+                    function f(n) {
+                        // Format integers to have at least two digits.
+                        return n < 10 ? '0' + n : n;
+                    }
+
+                    return this.getUTCFullYear()   + '-' +
+                         f(this.getUTCMonth() + 1) + '-' +
+                         f(this.getUTCDate())      + 'T' +
+                         f(this.getUTCHours())     + ':' +
+                         f(this.getUTCMinutes())   + ':' +
+                         f(this.getUTCSeconds())   + 'Z';
+                };
+
+            You can provide an optional replacer method. It will be passed the
+            key and value of each member, with this bound to the containing
+            object. The value that is returned from your method will be
+            serialized. If your method returns undefined, then the member will
+            be excluded from the serialization.
+
+            If the replacer parameter is an array of strings, then it will be used to
+            select the members to be serialized. It filters the results such
+            that only members with keys listed in the replacer array are
+            stringified.
+
+            Values that do not have JSON representations, such as undefined or
+            functions, will not be serialized. Such values in objects will be
+            dropped; in arrays they will be replaced with null. You can use
+            a replacer function to replace those with JSON values.
+            JSON.stringify(undefined) returns undefined.
+
+            The optional space parameter produces a stringification of the
+            value that is filled with line breaks and indentation to make it
+            easier to read.
+
+            If the space parameter is a non-empty string, then that string will
+            be used for indentation. If the space parameter is a number, then
+            the indentation will be that many spaces.
+
+            Example:
+
+            text = JSON2.stringify(['e', {pluribus: 'unum'}]);
+            // text is '["e",{"pluribus":"unum"}]'
+
+
+            text = JSON2.stringify(['e', {pluribus: 'unum'}], null, '\t');
+            // text is '[\n\t"e",\n\t{\n\t\t"pluribus": "unum"\n\t}\n]'
+
+            text = JSON2.stringify([new Date()], function (key, value) {
+                return this[key] instanceof Date ?
+                    'Date(' + this[key] + ')' : value;
+            });
+            // text is '["Date(---current time---)"]'
+
+
+        JSON2.parse(text, reviver)
+            This method parses a JSON text to produce an object or array.
+            It can throw a SyntaxError exception.
+
+            The optional reviver parameter is a function that can filter and
+            transform the results. It receives each of the keys and values,
+            and its return value is used instead of the original value.
+            If it returns what it received, then the structure is not modified.
+            If it returns undefined then the member is deleted.
+
+            Example:
+
+            // Parse the text. Values that look like ISO date strings will
+            // be converted to Date objects.
+
+            myData = JSON2.parse(text, function (key, value) {
+                var a;
+                if (typeof value === 'string') {
+                    a =
+/^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2}(?:\.\d*)?)Z$/.exec(value);
+                    if (a) {
+                        return new Date(Date.UTC(+a[1], +a[2] - 1, +a[3], +a[4],
+                            +a[5], +a[6]));
+                    }
+                }
+                return value;
+            });
+
+            myData = JSON2.parse('["Date(09/09/2001)"]', function (key, value) {
+                var d;
+                if (typeof value === 'string' &&
+                        value.slice(0, 5) === 'Date(' &&
+                        value.slice(-1) === ')') {
+                    d = new Date(value.slice(5, -1));
+                    if (d) {
+                        return d;
+                    }
+                }
+                return value;
+            });
+
+
+    This is a reference implementation. You are free to copy, modify, or
+    redistribute.
+
+    This code should be minified before deployment.
+    See http://javascript.crockford.com/jsmin.html
+
+    USE YOUR OWN COPY. IT IS EXTREMELY UNWISE TO LOAD CODE FROM SERVERS YOU DO
+    NOT CONTROL.
+*/
+
+/*jslint evil: true */
+
+/*global JSON2 */
+
+/*members "", "\b", "\t", "\n", "\f", "\r", "\"", JSON, "\\", call,
+    charCodeAt, getUTCDate, getUTCFullYear, getUTCHours, getUTCMinutes,
+    getUTCMonth, getUTCSeconds, hasOwnProperty, join, lastIndex, length,
+    parse, propertyIsEnumerable, prototype, push, replace, slice, stringify,
+    test, toJSON, toString, valueOf
+*/
+
+// Create a JSON object only if one does not already exist. We create the
+// methods in a closure to avoid creating global variables.
+
+if (!this.JSON2) {
+    JSON2 = {};
+}
+(function () {
+
+    function f(n) {
+        // Format integers to have at least two digits.
+        return n < 10 ? '0' + n : n;
+    }
+
+    if (typeof Date.prototype.toJSON !== 'function') {
+
+        Date.prototype.toJSON = function (key) {
+
+            return this.getUTCFullYear()   + '-' +
+                 f(this.getUTCMonth() + 1) + '-' +
+                 f(this.getUTCDate())      + 'T' +
+                 f(this.getUTCHours())     + ':' +
+                 f(this.getUTCMinutes())   + ':' +
+                 f(this.getUTCSeconds())   + 'Z';
+        };
+
+        String.prototype.toJSON =
+        Number.prototype.toJSON =
+        Boolean.prototype.toJSON = function (key) {
+            return this.valueOf();
+        };
+    }
+
+    var cx = /[\u0000\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,
+        escapeable = /[\\\"\x00-\x1f\x7f-\x9f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,
+        gap,
+        indent,
+        meta = {    // table of character substitutions
+            '\b': '\\b',
+            '\t': '\\t',
+            '\n': '\\n',
+            '\f': '\\f',
+            '\r': '\\r',
+            '"' : '\\"',
+            '\\': '\\\\'
+        },
+        rep;
+
+
+    function quote(string) {
+
+// If the string contains no control characters, no quote characters, and no
+// backslash characters, then we can safely slap some quotes around it.
+// Otherwise we must also replace the offending characters with safe escape
+// sequences.
+
+        escapeable.lastIndex = 0;
+        return escapeable.test(string) ?
+            '"' + string.replace(escapeable, function (a) {
+                var c = meta[a];
+                if (typeof c === 'string') {
+                    return c;
+                }
+                return '\\u' + ('0000' + a.charCodeAt(0).toString(16)).slice(-4);
+            }) + '"' :
+            '"' + string + '"';
+    }
+
+
+    function str(key, holder) {
+
+// Produce a string from holder[key].
+
+        var i,          // The loop counter.
+            k,          // The member key.
+            v,          // The member value.
+            length,
+            mind = gap,
+            partial,
+            value = holder[key];
+
+// If the value has a toJSON method, call it to obtain a replacement value.
+
+        if (value && typeof value === 'object' &&
+                typeof value.toJSON === 'function') {
+            value = value.toJSON(key);
+        }
+
+// If we were called with a replacer function, then call the replacer to
+// obtain a replacement value.
+
+        if (typeof rep === 'function') {
+            value = rep.call(holder, key, value);
+        }
+
+// What happens next depends on the value's type.
+
+        switch (typeof value) {
+        case 'string':
+            return quote(value);
+
+        case 'number':
+
+// JSON numbers must be finite. Encode non-finite numbers as null.
+
+            return isFinite(value) ? String(value) : 'null';
+
+        case 'boolean':
+        case 'null':
+
+// If the value is a boolean or null, convert it to a string. Note:
+// typeof null does not produce 'null'. The case is included here in
+// the remote chance that this gets fixed someday.
+
+            return String(value);
+
+// If the type is 'object', we might be dealing with an object or an array or
+// null.
+
+        case 'object':
+
+// Due to a specification blunder in ECMAScript, typeof null is 'object',
+// so watch out for that case.
+
+            if (!value) {
+                return 'null';
+            }
+
+// Make an array to hold the partial results of stringifying this object value.
+
+            gap += indent;
+            partial = [];
+
+// If the object has a dontEnum length property, we'll treat it as an array.
+
+            if (typeof value.length === 'number' &&
+                    !value.propertyIsEnumerable('length')) {
+
+// The object is an array. Stringify every element. Use null as a placeholder
+// for non-JSON values.
+
+                length = value.length;
+                for (i = 0; i < length; i += 1) {
+                    partial[i] = str(i, value) || 'null';
+                }
+
+// Join all of the elements together, separated with commas, and wrap them in
+// brackets.
+
+                v = partial.length === 0 ? '[]' :
+                    gap ? '[\n' + gap +
+                            partial.join(',\n' + gap) + '\n' +
+                                mind + ']' :
+                          '[' + partial.join(',') + ']';
+                gap = mind;
+                return v;
+            }
+
+// If the replacer is an array, use it to select the members to be stringified.
+
+            if (rep && typeof rep === 'object') {
+                length = rep.length;
+                for (i = 0; i < length; i += 1) {
+                    k = rep[i];
+                    if (typeof k === 'string') {
+                        v = str(k, value);
+                        if (v) {
+                            partial.push(quote(k) + (gap ? ': ' : ':') + v);
+                        }
+                    }
+                }
+            } else {
+
+// Otherwise, iterate through all of the keys in the object.
+
+                for (k in value) {
+                    if (Object.hasOwnProperty.call(value, k)) {
+                        v = str(k, value);
+                        if (v) {
+                            partial.push(quote(k) + (gap ? ': ' : ':') + v);
+                        }
+                    }
+                }
+            }
+
+// Join all of the member texts together, separated with commas,
+// and wrap them in braces.
+
+            v = partial.length === 0 ? '{}' :
+                gap ? '{\n' + gap + partial.join(',\n' + gap) + '\n' +
+                        mind + '}' : '{' + partial.join(',') + '}';
+            gap = mind;
+            return v;
+        }
+    }
+
+// If the JSON object does not yet have a stringify method, give it one.
+
+    if (typeof JSON2.stringify !== 'function') {
+        JSON2.stringify = function (value, replacer, space) {
+
+// The stringify method takes a value and an optional replacer, and an optional
+// space parameter, and returns a JSON text. The replacer can be a function
+// that can replace values, or an array of strings that will select the keys.
+// A default replacer method can be provided. Use of the space parameter can
+// produce text that is more easily readable.
+
+            var i;
+            gap = '';
+            indent = '';
+
+// If the space parameter is a number, make an indent string containing that
+// many spaces.
+
+            if (typeof space === 'number') {
+                for (i = 0; i < space; i += 1) {
+                    indent += ' ';
+                }
+
+// If the space parameter is a string, it will be used as the indent string.
+
+            } else if (typeof space === 'string') {
+                indent = space;
+            }
+
+// If there is a replacer, it must be a function or an array.
+// Otherwise, throw an error.
+
+            rep = replacer;
+            if (replacer && typeof replacer !== 'function' &&
+                    (typeof replacer !== 'object' ||
+                     typeof replacer.length !== 'number')) {
+                throw new Error('JSON2.stringify');
+            }
+
+// Make a fake root object containing our value under the key of ''.
+// Return the result of stringifying the value.
+
+            return str('', {'': value});
+        };
+    }
+
+
+// If the JSON object does not yet have a parse method, give it one.
+
+    if (typeof JSON2.parse !== 'function') {
+        JSON2.parse = function (text, reviver) {
+
+// The parse method takes a text and an optional reviver function, and returns
+// a JavaScript value if the text is a valid JSON text.
+
+            var j;
+
+            function walk(holder, key) {
+
+// The walk method is used to recursively walk the resulting structure so
+// that modifications can be made.
+
+                var k, v, value = holder[key];
+                if (value && typeof value === 'object') {
+                    for (k in value) {
+                        if (Object.hasOwnProperty.call(value, k)) {
+                            v = walk(value, k);
+                            if (v !== undefined) {
+                                value[k] = v;
+                            } else {
+                                delete value[k];
+                            }
+                        }
+                    }
+                }
+                return reviver.call(holder, key, value);
+            }
+
+
+// Parsing happens in four stages. In the first stage, we replace certain
+// Unicode characters with escape sequences. JavaScript handles many characters
+// incorrectly, either silently deleting them, or treating them as line endings.
+
+            cx.lastIndex = 0;
+            if (cx.test(text)) {
+                text = text.replace(cx, function (a) {
+                    return '\\u' +
+                        ('0000' + a.charCodeAt(0).toString(16)).slice(-4);
+                });
+            }
+
+// In the second stage, we run the text against regular expressions that look
+// for non-JSON patterns. We are especially concerned with '()' and 'new'
+// because they can cause invocation, and '=' because it can cause mutation.
+// But just to be safe, we want to reject all unexpected forms.
+
+// We split the second stage into 4 regexp operations in order to work around
+// crippling inefficiencies in IE's and Safari's regexp engines. First we
+// replace the JSON backslash pairs with '@' (a non-JSON character). Second, we
+// replace all simple value tokens with ']' characters. Third, we delete all
+// open brackets that follow a colon or comma or that begin the text. Finally,
+// we look to see that the remaining characters are only whitespace or ']' or
+// ',' or ':' or '{' or '}'. If that is so, then the text is safe for eval.
+
+            if (/^[\],:{}\s]*$/.
+test(text.replace(/\\(?:["\\\/bfnrt]|u[0-9a-fA-F]{4})/g, '@').
+replace(/"[^"\\\n\r]*"|true|false|null|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?/g, ']').
+replace(/(?:^|:|,)(?:\s*\[)+/g, ''))) {
+
+// In the third stage we use the eval function to compile the text into a
+// JavaScript structure. The '{' operator is subject to a syntactic ambiguity
+// in JavaScript: it can begin a block or an object literal. We wrap the text
+// in parens to eliminate the ambiguity.
+
+                j = eval('(' + text + ')');
+
+// In the optional fourth stage, we recursively walk the new structure, passing
+// each name/value pair to a reviver function for possible transformation.
+
+                return typeof reviver === 'function' ?
+                    walk({'': j}, '') : j;
+            }
+
+// If the text is not JSON parseable, then a SyntaxError is thrown.
+
+            throw new SyntaxError('JSON2.parse');
+        };
+    }
+})();
\ No newline at end of file
diff --git a/frontend/beta/js/MochiKit/Async.js b/frontend/beta/js/MochiKit/Async.js
new file mode 100644
index 0000000..7f575aa
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Async.js
@@ -0,0 +1,683 @@
+/***
+
+MochiKit.Async 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide("MochiKit.Async");
+    dojo.require("MochiKit.Base");
+}
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Base", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.Async depends on MochiKit.Base!";
+}
+
+if (typeof(MochiKit.Async) == 'undefined') {
+    MochiKit.Async = {};
+}
+
+MochiKit.Async.NAME = "MochiKit.Async";
+MochiKit.Async.VERSION = "1.4";
+MochiKit.Async.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+MochiKit.Async.toString = function () {
+    return this.__repr__();
+};
+
+/** @id MochiKit.Async.Deferred */
+MochiKit.Async.Deferred = function (/* optional */ canceller) {
+    this.chain = [];
+    this.id = this._nextId();
+    this.fired = -1;
+    this.paused = 0;
+    this.results = [null, null];
+    this.canceller = canceller;
+    this.silentlyCancelled = false;
+    this.chained = false;
+};
+
+MochiKit.Async.Deferred.prototype = {
+    /** @id MochiKit.Async.Deferred.prototype.repr */
+    repr: function () {
+        var state;
+        if (this.fired == -1) {
+            state = 'unfired';
+        } else if (this.fired === 0) {
+            state = 'success';
+        } else {
+            state = 'error';
+        }
+        return 'Deferred(' + this.id + ', ' + state + ')';
+    },
+
+    toString: MochiKit.Base.forwardCall("repr"),
+
+    _nextId: MochiKit.Base.counter(),
+
+    /** @id MochiKit.Async.Deferred.prototype.cancel */
+    cancel: function () {
+        var self = MochiKit.Async;
+        if (this.fired == -1) {
+            if (this.canceller) {
+                this.canceller(this);
+            } else {
+                this.silentlyCancelled = true;
+            }
+            if (this.fired == -1) {
+                this.errback(new self.CancelledError(this));
+            }
+        } else if ((this.fired === 0) && (this.results[0] instanceof self.Deferred)) {
+            this.results[0].cancel();
+        }
+    },
+
+    _resback: function (res) {
+        /***
+
+        The primitive that means either callback or errback
+
+        ***/
+        this.fired = ((res instanceof Error) ? 1 : 0);
+        this.results[this.fired] = res;
+        this._fire();
+    },
+
+    _check: function () {
+        if (this.fired != -1) {
+            if (!this.silentlyCancelled) {
+                throw new MochiKit.Async.AlreadyCalledError(this);
+            }
+            this.silentlyCancelled = false;
+            return;
+        }
+    },
+
+    /** @id MochiKit.Async.Deferred.prototype.callback */
+    callback: function (res) {
+        this._check();
+        if (res instanceof MochiKit.Async.Deferred) {
+            throw new Error("Deferred instances can only be chained if they are the result of a callback");
+        }
+        this._resback(res);
+    },
+
+    /** @id MochiKit.Async.Deferred.prototype.errback */
+    errback: function (res) {
+        this._check();
+        var self = MochiKit.Async;
+        if (res instanceof self.Deferred) {
+            throw new Error("Deferred instances can only be chained if they are the result of a callback");
+        }
+        if (!(res instanceof Error)) {
+            res = new self.GenericError(res);
+        }
+        this._resback(res);
+    },
+
+    /** @id MochiKit.Async.Deferred.prototype.addBoth */
+    addBoth: function (fn) {
+        if (arguments.length > 1) {
+            fn = MochiKit.Base.partial.apply(null, arguments);
+        }
+        return this.addCallbacks(fn, fn);
+    },
+
+    /** @id MochiKit.Async.Deferred.prototype.addCallback */
+    addCallback: function (fn) {
+        if (arguments.length > 1) {
+            fn = MochiKit.Base.partial.apply(null, arguments);
+        }
+        return this.addCallbacks(fn, null);
+    },
+
+    /** @id MochiKit.Async.Deferred.prototype.addErrback */
+    addErrback: function (fn) {
+        if (arguments.length > 1) {
+            fn = MochiKit.Base.partial.apply(null, arguments);
+        }
+        return this.addCallbacks(null, fn);
+    },
+
+    /** @id MochiKit.Async.Deferred.prototype.addCallbacks */
+    addCallbacks: function (cb, eb) {
+        if (this.chained) {
+            throw new Error("Chained Deferreds can not be re-used");
+        }
+        this.chain.push([cb, eb]);
+        if (this.fired >= 0) {
+            this._fire();
+        }
+        return this;
+    },
+
+    _fire: function () {
+        /***
+
+        Used internally to exhaust the callback sequence when a result
+        is available.
+
+        ***/
+        var chain = this.chain;
+        var fired = this.fired;
+        var res = this.results[fired];
+        var self = this;
+        var cb = null;
+        while (chain.length > 0 && this.paused === 0) {
+            // Array
+            var pair = chain.shift();
+            var f = pair[fired];
+            if (f === null) {
+                continue;
+            }
+            try {
+                res = f(res);
+                fired = ((res instanceof Error) ? 1 : 0);
+                if (res instanceof MochiKit.Async.Deferred) {
+                    cb = function (res) {
+                        self._resback(res);
+                        self.paused--;
+                        if ((self.paused === 0) && (self.fired >= 0)) {
+                            self._fire();
+                        }
+                    };
+                    this.paused++;
+                }
+            } catch (err) {
+                fired = 1;
+                if (!(err instanceof Error)) {
+                    err = new MochiKit.Async.GenericError(err);
+                }
+                res = err;
+            }
+        }
+        this.fired = fired;
+        this.results[fired] = res;
+        if (cb && this.paused) {
+            // this is for "tail recursion" in case the dependent deferred
+            // is already fired
+            res.addBoth(cb);
+            res.chained = true;
+        }
+    }
+};
+
+MochiKit.Base.update(MochiKit.Async, {
+    /** @id MochiKit.Async.evalJSONRequest */
+    evalJSONRequest: function (/* req */) {
+        return eval('(' + arguments[0].responseText + ')');
+    },
+
+    /** @id MochiKit.Async.succeed */
+    succeed: function (/* optional */result) {
+        var d = new MochiKit.Async.Deferred();
+        d.callback.apply(d, arguments);
+        return d;
+    },
+
+    /** @id MochiKit.Async.fail */
+    fail: function (/* optional */result) {
+        var d = new MochiKit.Async.Deferred();
+        d.errback.apply(d, arguments);
+        return d;
+    },
+
+    /** @id MochiKit.Async.getXMLHttpRequest */
+    getXMLHttpRequest: function () {
+        var self = arguments.callee;
+        if (!self.XMLHttpRequest) {
+            var tryThese = [
+                function () { return new XMLHttpRequest(); },
+                function () { return new ActiveXObject('Msxml2.XMLHTTP'); },
+                function () { return new ActiveXObject('Microsoft.XMLHTTP'); },
+                function () { return new ActiveXObject('Msxml2.XMLHTTP.4.0'); },
+                function () {
+                    throw new MochiKit.Async.BrowserComplianceError("Browser does not support XMLHttpRequest");
+                }
+            ];
+            for (var i = 0; i < tryThese.length; i++) {
+                var func = tryThese[i];
+                try {
+                    self.XMLHttpRequest = func;
+                    return func();
+                } catch (e) {
+                    // pass
+                }
+            }
+        }
+        return self.XMLHttpRequest();
+    },
+
+    _xhr_onreadystatechange: function (d) {
+        // MochiKit.Logging.logDebug('this.readyState', this.readyState);
+        var m = MochiKit.Base;
+        if (this.readyState == 4) {
+            // IE SUCKS
+            try {
+                this.onreadystatechange = null;
+            } catch (e) {
+                try {
+                    this.onreadystatechange = m.noop;
+                } catch (e) {
+                }
+            }
+            var status = null;
+            try {
+                status = this.status;
+                if (!status && m.isNotEmpty(this.responseText)) {
+                    // 0 or undefined seems to mean cached or local
+                    status = 304;
+                }
+            } catch (e) {
+                // pass
+                // MochiKit.Logging.logDebug('error getting status?', repr(items(e)));
+            }
+            // 200 is OK, 201 is CREATED, 204 is NO CONTENT
+            // 304 is NOT MODIFIED, 1223 is apparently a bug in IE
+            if (status == 200 || status == 201 || status == 204 ||
+                    status == 304 || status == 1223) {
+                d.callback(this);
+            } else {
+                var err = new MochiKit.Async.XMLHttpRequestError(this, "Request failed");
+                if (err.number) {
+                    // XXX: This seems to happen on page change
+                    d.errback(err);
+                } else {
+                    // XXX: this seems to happen when the server is unreachable
+                    d.errback(err);
+                }
+            }
+        }
+    },
+
+    _xhr_canceller: function (req) {
+        // IE SUCKS
+        try {
+            req.onreadystatechange = null;
+        } catch (e) {
+            try {
+                req.onreadystatechange = MochiKit.Base.noop;
+            } catch (e) {
+            }
+        }
+        req.abort();
+    },
+
+
+    /** @id MochiKit.Async.sendXMLHttpRequest */
+    sendXMLHttpRequest: function (req, /* optional */ sendContent) {
+        if (typeof(sendContent) == "undefined" || sendContent === null) {
+            sendContent = "";
+        }
+
+        var m = MochiKit.Base;
+        var self = MochiKit.Async;
+        var d = new self.Deferred(m.partial(self._xhr_canceller, req));
+
+        try {
+            req.onreadystatechange = m.bind(self._xhr_onreadystatechange,
+                req, d);
+            req.send(sendContent);
+        } catch (e) {
+            try {
+                req.onreadystatechange = null;
+            } catch (ignore) {
+                // pass
+            }
+            d.errback(e);
+        }
+
+        return d;
+
+    },
+
+    /** @id MochiKit.Async.doXHR */
+    doXHR: function (url, opts) {
+        var m = MochiKit.Base;
+        opts = m.update({
+            method: 'GET',
+            sendContent: ''
+            /*
+            queryString: undefined,
+            username: undefined,
+            password: undefined,
+            headers: undefined,
+            mimeType: undefined
+            */
+        }, opts);
+        var self = MochiKit.Async;
+        var req = self.getXMLHttpRequest();
+        if (opts.queryString) {
+            var qs = m.queryString(opts.queryString);
+            if (qs) {
+                url += "?" + qs;
+            }
+        }
+        req.open(opts.method, url, true, opts.username, opts.password);
+        if (req.overrideMimeType && opts.mimeType) {
+            req.overrideMimeType(opts.mimeType);
+        }
+        if (opts.headers) {
+            var headers = opts.headers;
+            if (!m.isArrayLike(headers)) {
+                headers = m.items(headers);
+            }
+            for (var i = 0; i < headers.length; i++) {
+                var header = headers[i];
+                var name = header[0];
+                var value = header[1];
+                req.setRequestHeader(name, value);
+            }
+        }
+        return self.sendXMLHttpRequest(req, opts.sendContent);
+    },
+
+    _buildURL: function (url/*, ...*/) {
+        if (arguments.length > 1) {
+            var m = MochiKit.Base;
+            var qs = m.queryString.apply(null, m.extend(null, arguments, 1));
+            if (qs) {
+                return url + "?" + qs;
+            }
+        }
+        return url;
+    },
+
+    /** @id MochiKit.Async.doSimpleXMLHttpRequest */
+    doSimpleXMLHttpRequest: function (url/*, ...*/) {
+        var self = MochiKit.Async;
+        url = self._buildURL.apply(self, arguments);
+        return self.doXHR(url);
+    },
+
+    /** @id MochiKit.Async.loadJSONDoc */
+    loadJSONDoc: function (url/*, ...*/) {
+        var self = MochiKit.Async;
+        url = self._buildURL.apply(self, arguments);
+        var d = self.doXHR(url, {
+            'mimeType': 'text/plain',
+            'headers': [['Accept', 'application/json']]
+        });
+        d = d.addCallback(self.evalJSONRequest);
+        return d;
+    },
+
+    /** @id MochiKit.Async.wait */
+    wait: function (seconds, /* optional */value) {
+        var d = new MochiKit.Async.Deferred();
+        var m = MochiKit.Base;
+        if (typeof(value) != 'undefined') {
+            d.addCallback(function () { return value; });
+        }
+        var timeout = setTimeout(
+            m.bind("callback", d),
+            Math.floor(seconds * 1000));
+        d.canceller = function () {
+            try {
+                clearTimeout(timeout);
+            } catch (e) {
+                // pass
+            }
+        };
+        return d;
+    },
+
+    /** @id MochiKit.Async.callLater */
+    callLater: function (seconds, func) {
+        var m = MochiKit.Base;
+        var pfunc = m.partial.apply(m, m.extend(null, arguments, 1));
+        return MochiKit.Async.wait(seconds).addCallback(
+            function (res) { return pfunc(); }
+        );
+    }
+});
+
+
+/** @id MochiKit.Async.DeferredLock */
+MochiKit.Async.DeferredLock = function () {
+    this.waiting = [];
+    this.locked = false;
+    this.id = this._nextId();
+};
+
+MochiKit.Async.DeferredLock.prototype = {
+    __class__: MochiKit.Async.DeferredLock,
+    /** @id MochiKit.Async.DeferredLock.prototype.acquire */
+    acquire: function () {
+        var d = new MochiKit.Async.Deferred();
+        if (this.locked) {
+            this.waiting.push(d);
+        } else {
+            this.locked = true;
+            d.callback(this);
+        }
+        return d;
+    },
+    /** @id MochiKit.Async.DeferredLock.prototype.release */
+    release: function () {
+        if (!this.locked) {
+            throw TypeError("Tried to release an unlocked DeferredLock");
+        }
+        this.locked = false;
+        if (this.waiting.length > 0) {
+            this.locked = true;
+            this.waiting.shift().callback(this);
+        }
+    },
+    _nextId: MochiKit.Base.counter(),
+    repr: function () {
+        var state;
+        if (this.locked) {
+            state = 'locked, ' + this.waiting.length + ' waiting';
+        } else {
+            state = 'unlocked';
+        }
+        return 'DeferredLock(' + this.id + ', ' + state + ')';
+    },
+    toString: MochiKit.Base.forwardCall("repr")
+
+};
+
+/** @id MochiKit.Async.DeferredList */
+MochiKit.Async.DeferredList = function (list, /* optional */fireOnOneCallback, fireOnOneErrback, consumeErrors, canceller) {
+
+    // call parent constructor
+    MochiKit.Async.Deferred.apply(this, [canceller]);
+
+    this.list = list;
+    var resultList = [];
+    this.resultList = resultList;
+
+    this.finishedCount = 0;
+    this.fireOnOneCallback = fireOnOneCallback;
+    this.fireOnOneErrback = fireOnOneErrback;
+    this.consumeErrors = consumeErrors;
+
+    var cb = MochiKit.Base.bind(this._cbDeferred, this);
+    for (var i = 0; i < list.length; i++) {
+        var d = list[i];
+        resultList.push(undefined);
+        d.addCallback(cb, i, true);
+        d.addErrback(cb, i, false);
+    }
+
+    if (list.length === 0 && !fireOnOneCallback) {
+        this.callback(this.resultList);
+    }
+
+};
+
+MochiKit.Async.DeferredList.prototype = new MochiKit.Async.Deferred();
+
+MochiKit.Async.DeferredList.prototype._cbDeferred = function (index, succeeded, result) {
+    this.resultList[index] = [succeeded, result];
+    this.finishedCount += 1;
+    if (this.fired == -1) {
+        if (succeeded && this.fireOnOneCallback) {
+            this.callback([index, result]);
+        } else if (!succeeded && this.fireOnOneErrback) {
+            this.errback(result);
+        } else if (this.finishedCount == this.list.length) {
+            this.callback(this.resultList);
+        }
+    }
+    if (!succeeded && this.consumeErrors) {
+        result = null;
+    }
+    return result;
+};
+
+/** @id MochiKit.Async.gatherResults */
+MochiKit.Async.gatherResults = function (deferredList) {
+    var d = new MochiKit.Async.DeferredList(deferredList, false, true, false);
+    d.addCallback(function (results) {
+        var ret = [];
+        for (var i = 0; i < results.length; i++) {
+            ret.push(results[i][1]);
+        }
+        return ret;
+    });
+    return d;
+};
+
+/** @id MochiKit.Async.maybeDeferred */
+MochiKit.Async.maybeDeferred = function (func) {
+    var self = MochiKit.Async;
+    var result;
+    try {
+        var r = func.apply(null, MochiKit.Base.extend([], arguments, 1));
+        if (r instanceof self.Deferred) {
+            result = r;
+        } else if (r instanceof Error) {
+            result = self.fail(r);
+        } else {
+            result = self.succeed(r);
+        }
+    } catch (e) {
+        result = self.fail(e);
+    }
+    return result;
+};
+
+
+MochiKit.Async.EXPORT = [
+    "AlreadyCalledError",
+    "CancelledError",
+    "BrowserComplianceError",
+    "GenericError",
+    "XMLHttpRequestError",
+    "Deferred",
+    "succeed",
+    "fail",
+    "getXMLHttpRequest",
+    "doSimpleXMLHttpRequest",
+    "loadJSONDoc",
+    "wait",
+    "callLater",
+    "sendXMLHttpRequest",
+    "DeferredLock",
+    "DeferredList",
+    "gatherResults",
+    "maybeDeferred",
+    "doXHR"
+];
+
+MochiKit.Async.EXPORT_OK = [
+    "evalJSONRequest"
+];
+
+MochiKit.Async.__new__ = function () {
+    var m = MochiKit.Base;
+    var ne = m.partial(m._newNamedError, this);
+
+    ne("AlreadyCalledError",
+        /** @id MochiKit.Async.AlreadyCalledError */
+        function (deferred) {
+            /***
+
+            Raised by the Deferred if callback or errback happens
+            after it was already fired.
+
+            ***/
+            this.deferred = deferred;
+        }
+    );
+
+    ne("CancelledError",
+        /** @id MochiKit.Async.CancelledError */
+        function (deferred) {
+            /***
+
+            Raised by the Deferred cancellation mechanism.
+
+            ***/
+            this.deferred = deferred;
+        }
+    );
+
+    ne("BrowserComplianceError",
+        /** @id MochiKit.Async.BrowserComplianceError */
+        function (msg) {
+            /***
+
+            Raised when the JavaScript runtime is not capable of performing
+            the given function.  Technically, this should really never be
+            raised because a non-conforming JavaScript runtime probably
+            isn't going to support exceptions in the first place.
+
+            ***/
+            this.message = msg;
+        }
+    );
+
+    ne("GenericError",
+        /** @id MochiKit.Async.GenericError */
+        function (msg) {
+            this.message = msg;
+        }
+    );
+
+    ne("XMLHttpRequestError",
+        /** @id MochiKit.Async.XMLHttpRequestError */
+        function (req, msg) {
+            /***
+
+            Raised when an XMLHttpRequest does not complete for any reason.
+
+            ***/
+            this.req = req;
+            this.message = msg;
+            try {
+                // Strange but true that this can raise in some cases.
+                this.number = req.status;
+            } catch (e) {
+                // pass
+            }
+        }
+    );
+
+
+    this.EXPORT_TAGS = {
+        ":common": this.EXPORT,
+        ":all": m.concat(this.EXPORT, this.EXPORT_OK)
+    };
+
+    m.nameFunctions(this);
+
+};
+
+MochiKit.Async.__new__();
+
+MochiKit.Base._exportSymbols(this, MochiKit.Async);
diff --git a/frontend/beta/js/MochiKit/Base.js b/frontend/beta/js/MochiKit/Base.js
new file mode 100644
index 0000000..67f4499
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Base.js
@@ -0,0 +1,1403 @@
+/***
+
+MochiKit.Base 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide("MochiKit.Base");
+}
+if (typeof(MochiKit) == 'undefined') {
+    MochiKit = {};
+}
+if (typeof(MochiKit.Base) == 'undefined') {
+    MochiKit.Base = {};
+}
+if (typeof(MochiKit.__export__) == "undefined") {
+    MochiKit.__export__ = (MochiKit.__compat__  ||
+        (typeof(JSAN) == 'undefined' && typeof(dojo) == 'undefined')
+    );
+}
+
+MochiKit.Base.VERSION = "1.4";
+MochiKit.Base.NAME = "MochiKit.Base";
+/** @id MochiKit.Base.update */
+MochiKit.Base.update = function (self, obj/*, ... */) {
+    if (self === null) {
+        self = {};
+    }
+    for (var i = 1; i < arguments.length; i++) {
+        var o = arguments[i];
+        if (typeof(o) != 'undefined' && o !== null) {
+            for (var k in o) {
+                self[k] = o[k];
+            }
+        }
+    }
+    return self;
+};
+
+MochiKit.Base.update(MochiKit.Base, {
+    __repr__: function () {
+        return "[" + this.NAME + " " + this.VERSION + "]";
+    },
+
+    toString: function () {
+        return this.__repr__();
+    },
+
+    /** @id MochiKit.Base.camelize */
+    camelize: function (selector) {
+        /* from dojo.style.toCamelCase */
+        var arr = selector.split('-');
+        var cc = arr[0];
+        for (var i = 1; i < arr.length; i++) {
+            cc += arr[i].charAt(0).toUpperCase() + arr[i].substring(1);
+        }
+        return cc;
+    },
+
+    /** @id MochiKit.Base.counter */
+    counter: function (n/* = 1 */) {
+        if (arguments.length === 0) {
+            n = 1;
+        }
+        return function () {
+            return n++;
+        };
+    },
+
+    /** @id MochiKit.Base.clone */
+    clone: function (obj) {
+        var me = arguments.callee;
+        if (arguments.length == 1) {
+            me.prototype = obj;
+            return new me();
+        }
+    },
+
+    _flattenArray: function (res, lst) {
+        for (var i = 0; i < lst.length; i++) {
+            var o = lst[i];
+            if (o instanceof Array) {
+                arguments.callee(res, o);
+            } else {
+                res.push(o);
+            }
+        }
+        return res;
+    },
+
+    /** @id MochiKit.Base.flattenArray */
+    flattenArray: function (lst) {
+        return MochiKit.Base._flattenArray([], lst);
+    },
+
+    /** @id MochiKit.Base.flattenArguments */
+    flattenArguments: function (lst/* ...*/) {
+        var res = [];
+        var m = MochiKit.Base;
+        var args = m.extend(null, arguments);
+        while (args.length) {
+            var o = args.shift();
+            if (o && typeof(o) == "object" && typeof(o.length) == "number") {
+                for (var i = o.length - 1; i >= 0; i--) {
+                    args.unshift(o[i]);
+                }
+            } else {
+                res.push(o);
+            }
+        }
+        return res;
+    },
+
+    /** @id MochiKit.Base.extend */
+    extend: function (self, obj, /* optional */skip) {
+        // Extend an array with an array-like object starting
+        // from the skip index
+        if (!skip) {
+            skip = 0;
+        }
+        if (obj) {
+            // allow iterable fall-through, but skip the full isArrayLike
+            // check for speed, this is called often.
+            var l = obj.length;
+            if (typeof(l) != 'number' /* !isArrayLike(obj) */) {
+                if (typeof(MochiKit.Iter) != "undefined") {
+                    obj = MochiKit.Iter.list(obj);
+                    l = obj.length;
+                } else {
+                    throw new TypeError("Argument not an array-like and MochiKit.Iter not present");
+                }
+            }
+            if (!self) {
+                self = [];
+            }
+            for (var i = skip; i < l; i++) {
+                self.push(obj[i]);
+            }
+        }
+        // This mutates, but it's convenient to return because
+        // it's often used like a constructor when turning some
+        // ghetto array-like to a real array
+        return self;
+    },
+
+
+    /** @id MochiKit.Base.updatetree */
+    updatetree: function (self, obj/*, ...*/) {
+        if (self === null) {
+            self = {};
+        }
+        for (var i = 1; i < arguments.length; i++) {
+            var o = arguments[i];
+            if (typeof(o) != 'undefined' && o !== null) {
+                for (var k in o) {
+                    var v = o[k];
+                    if (typeof(self[k]) == 'object' && typeof(v) == 'object') {
+                        arguments.callee(self[k], v);
+                    } else {
+                        self[k] = v;
+                    }
+                }
+            }
+        }
+        return self;
+    },
+
+    /** @id MochiKit.Base.setdefault */
+    setdefault: function (self, obj/*, ...*/) {
+        if (self === null) {
+            self = {};
+        }
+        for (var i = 1; i < arguments.length; i++) {
+            var o = arguments[i];
+            for (var k in o) {
+                if (!(k in self)) {
+                    self[k] = o[k];
+                }
+            }
+        }
+        return self;
+    },
+
+    /** @id MochiKit.Base.keys */
+    keys: function (obj) {
+        var rval = [];
+        for (var prop in obj) {
+            rval.push(prop);
+        }
+        return rval;
+    },
+
+    /** @id MochiKit.Base.values */
+    values: function (obj) {
+        var rval = [];
+        for (var prop in obj) {
+            rval.push(obj[prop]);
+        }
+        return rval;
+    },
+
+     /** @id MochiKit.Base.items */
+    items: function (obj) {
+        var rval = [];
+        var e;
+        for (var prop in obj) {
+            var v;
+            try {
+                v = obj[prop];
+            } catch (e) {
+                continue;
+            }
+            rval.push([prop, v]);
+        }
+        return rval;
+    },
+
+
+    _newNamedError: function (module, name, func) {
+        func.prototype = new MochiKit.Base.NamedError(module.NAME + "." + name);
+        module[name] = func;
+    },
+
+
+    /** @id MochiKit.Base.operator */
+    operator: {
+        // unary logic operators
+        /** @id MochiKit.Base.truth */
+        truth: function (a) { return !!a; },
+        /** @id MochiKit.Base.lognot */
+        lognot: function (a) { return !a; },
+        /** @id MochiKit.Base.identity */
+        identity: function (a) { return a; },
+
+        // bitwise unary operators
+        /** @id MochiKit.Base.not */
+        not: function (a) { return ~a; },
+        /** @id MochiKit.Base.neg */
+        neg: function (a) { return -a; },
+
+        // binary operators
+        /** @id MochiKit.Base.add */
+        add: function (a, b) { return a + b; },
+        /** @id MochiKit.Base.sub */
+        sub: function (a, b) { return a - b; },
+        /** @id MochiKit.Base.div */
+        div: function (a, b) { return a / b; },
+        /** @id MochiKit.Base.mod */
+        mod: function (a, b) { return a % b; },
+        /** @id MochiKit.Base.mul */
+        mul: function (a, b) { return a * b; },
+
+        // bitwise binary operators
+        /** @id MochiKit.Base.and */
+        and: function (a, b) { return a & b; },
+        /** @id MochiKit.Base.or */
+        or: function (a, b) { return a | b; },
+        /** @id MochiKit.Base.xor */
+        xor: function (a, b) { return a ^ b; },
+        /** @id MochiKit.Base.lshift */
+        lshift: function (a, b) { return a << b; },
+        /** @id MochiKit.Base.rshift */
+        rshift: function (a, b) { return a >> b; },
+        /** @id MochiKit.Base.zrshift */
+        zrshift: function (a, b) { return a >>> b; },
+
+        // near-worthless built-in comparators
+        /** @id MochiKit.Base.eq */
+        eq: function (a, b) { return a == b; },
+        /** @id MochiKit.Base.ne */
+        ne: function (a, b) { return a != b; },
+        /** @id MochiKit.Base.gt */
+        gt: function (a, b) { return a > b; },
+        /** @id MochiKit.Base.ge */
+        ge: function (a, b) { return a >= b; },
+        /** @id MochiKit.Base.lt */
+        lt: function (a, b) { return a < b; },
+        /** @id MochiKit.Base.le */
+        le: function (a, b) { return a <= b; },
+
+        // strict built-in comparators
+        seq: function (a, b) { return a === b; },
+        sne: function (a, b) { return a !== b; },
+
+        // compare comparators
+        /** @id MochiKit.Base.ceq */
+        ceq: function (a, b) { return MochiKit.Base.compare(a, b) === 0; },
+        /** @id MochiKit.Base.cne */
+        cne: function (a, b) { return MochiKit.Base.compare(a, b) !== 0; },
+        /** @id MochiKit.Base.cgt */
+        cgt: function (a, b) { return MochiKit.Base.compare(a, b) == 1; },
+        /** @id MochiKit.Base.cge */
+        cge: function (a, b) { return MochiKit.Base.compare(a, b) != -1; },
+        /** @id MochiKit.Base.clt */
+        clt: function (a, b) { return MochiKit.Base.compare(a, b) == -1; },
+        /** @id MochiKit.Base.cle */
+        cle: function (a, b) { return MochiKit.Base.compare(a, b) != 1; },
+
+        // binary logical operators
+        /** @id MochiKit.Base.logand */
+        logand: function (a, b) { return a && b; },
+        /** @id MochiKit.Base.logor */
+        logor: function (a, b) { return a || b; },
+        /** @id MochiKit.Base.contains */
+        contains: function (a, b) { return b in a; }
+    },
+
+    /** @id MochiKit.Base.forwardCall */
+    forwardCall: function (func) {
+        return function () {
+            return this[func].apply(this, arguments);
+        };
+    },
+
+    /** @id MochiKit.Base.itemgetter */
+    itemgetter: function (func) {
+        return function (arg) {
+            return arg[func];
+        };
+    },
+
+    /** @id MochiKit.Base.typeMatcher */
+    typeMatcher: function (/* typ */) {
+        var types = {};
+        for (var i = 0; i < arguments.length; i++) {
+            var typ = arguments[i];
+            types[typ] = typ;
+        }
+        return function () {
+            for (var i = 0; i < arguments.length; i++) {
+                if (!(typeof(arguments[i]) in types)) {
+                    return false;
+                }
+            }
+            return true;
+        };
+    },
+
+    /** @id MochiKit.Base.isNull */
+    isNull: function (/* ... */) {
+        for (var i = 0; i < arguments.length; i++) {
+            if (arguments[i] !== null) {
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /** @id MochiKit.Base.isUndefinedOrNull */
+    isUndefinedOrNull: function (/* ... */) {
+        for (var i = 0; i < arguments.length; i++) {
+            var o = arguments[i];
+            if (!(typeof(o) == 'undefined' || o === null)) {
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /** @id MochiKit.Base.isEmpty */
+    isEmpty: function (obj) {
+        return !MochiKit.Base.isNotEmpty.apply(this, arguments);
+    },
+
+    /** @id MochiKit.Base.isNotEmpty */
+    isNotEmpty: function (obj) {
+        for (var i = 0; i < arguments.length; i++) {
+            var o = arguments[i];
+            if (!(o && o.length)) {
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /** @id MochiKit.Base.isArrayLike */
+    isArrayLike: function () {
+        for (var i = 0; i < arguments.length; i++) {
+            var o = arguments[i];
+            var typ = typeof(o);
+            if (
+                (typ != 'object' && !(typ == 'function' && typeof(o.item) == 'function')) ||
+                o === null ||
+                typeof(o.length) != 'number' ||
+                o.nodeType === 3
+            ) {
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /** @id MochiKit.Base.isDateLike */
+    isDateLike: function () {
+        for (var i = 0; i < arguments.length; i++) {
+            var o = arguments[i];
+            if (typeof(o) != "object" || o === null
+                    || typeof(o.getTime) != 'function') {
+                return false;
+            }
+        }
+        return true;
+    },
+
+
+    /** @id MochiKit.Base.xmap */
+    xmap: function (fn/*, obj... */) {
+        if (fn === null) {
+            return MochiKit.Base.extend(null, arguments, 1);
+        }
+        var rval = [];
+        for (var i = 1; i < arguments.length; i++) {
+            rval.push(fn(arguments[i]));
+        }
+        return rval;
+    },
+
+    /** @id MochiKit.Base.map */
+    map: function (fn, lst/*, lst... */) {
+        var m = MochiKit.Base;
+        var itr = MochiKit.Iter;
+        var isArrayLike = m.isArrayLike;
+        if (arguments.length <= 2) {
+            // allow an iterable to be passed
+            if (!isArrayLike(lst)) {
+                if (itr) {
+                    // fast path for map(null, iterable)
+                    lst = itr.list(lst);
+                    if (fn === null) {
+                        return lst;
+                    }
+                } else {
+                    throw new TypeError("Argument not an array-like and MochiKit.Iter not present");
+                }
+            }
+            // fast path for map(null, lst)
+            if (fn === null) {
+                return m.extend(null, lst);
+            }
+            // disabled fast path for map(fn, lst)
+            /*
+            if (false && typeof(Array.prototype.map) == 'function') {
+                // Mozilla fast-path
+                return Array.prototype.map.call(lst, fn);
+            }
+            */
+            var rval = [];
+            for (var i = 0; i < lst.length; i++) {
+                rval.push(fn(lst[i]));
+            }
+            return rval;
+        } else {
+            // default for map(null, ...) is zip(...)
+            if (fn === null) {
+                fn = Array;
+            }
+            var length = null;
+            for (i = 1; i < arguments.length; i++) {
+                // allow iterables to be passed
+                if (!isArrayLike(arguments[i])) {
+                    if (itr) {
+                        return itr.list(itr.imap.apply(null, arguments));
+                    } else {
+                        throw new TypeError("Argument not an array-like and MochiKit.Iter not present");
+                    }
+                }
+                // find the minimum length
+                var l = arguments[i].length;
+                if (length === null || length > l) {
+                    length = l;
+                }
+            }
+            rval = [];
+            for (i = 0; i < length; i++) {
+                var args = [];
+                for (var j = 1; j < arguments.length; j++) {
+                    args.push(arguments[j][i]);
+                }
+                rval.push(fn.apply(this, args));
+            }
+            return rval;
+        }
+    },
+
+    /** @id MochiKit.Base.xfilter */
+    xfilter: function (fn/*, obj... */) {
+        var rval = [];
+        if (fn === null) {
+            fn = MochiKit.Base.operator.truth;
+        }
+        for (var i = 1; i < arguments.length; i++) {
+            var o = arguments[i];
+            if (fn(o)) {
+                rval.push(o);
+            }
+        }
+        return rval;
+    },
+
+    /** @id MochiKit.Base.filter */
+    filter: function (fn, lst, self) {
+        var rval = [];
+        // allow an iterable to be passed
+        var m = MochiKit.Base;
+        if (!m.isArrayLike(lst)) {
+            if (MochiKit.Iter) {
+                lst = MochiKit.Iter.list(lst);
+            } else {
+                throw new TypeError("Argument not an array-like and MochiKit.Iter not present");
+            }
+        }
+        if (fn === null) {
+            fn = m.operator.truth;
+        }
+        if (typeof(Array.prototype.filter) == 'function') {
+            // Mozilla fast-path
+            return Array.prototype.filter.call(lst, fn, self);
+        } else if (typeof(self) == 'undefined' || self === null) {
+            for (var i = 0; i < lst.length; i++) {
+                var o = lst[i];
+                if (fn(o)) {
+                    rval.push(o);
+                }
+            }
+        } else {
+            for (i = 0; i < lst.length; i++) {
+                o = lst[i];
+                if (fn.call(self, o)) {
+                    rval.push(o);
+                }
+            }
+        }
+        return rval;
+    },
+
+
+    _wrapDumbFunction: function (func) {
+        return function () {
+            // fast path!
+            switch (arguments.length) {
+                case 0: return func();
+                case 1: return func(arguments[0]);
+                case 2: return func(arguments[0], arguments[1]);
+                case 3: return func(arguments[0], arguments[1], arguments[2]);
+            }
+            var args = [];
+            for (var i = 0; i < arguments.length; i++) {
+                args.push("arguments[" + i + "]");
+            }
+            return eval("(func(" + args.join(",") + "))");
+        };
+    },
+
+    /** @id MochiKit.Base.methodcaller */
+    methodcaller: function (func/*, args... */) {
+        var args = MochiKit.Base.extend(null, arguments, 1);
+        if (typeof(func) == "function") {
+            return function (obj) {
+                return func.apply(obj, args);
+            };
+        } else {
+            return function (obj) {
+                return obj[func].apply(obj, args);
+            };
+        }
+    },
+
+    /** @id MochiKit.Base.method */
+    method: function (self, func) {
+        var m = MochiKit.Base;
+        return m.bind.apply(this, m.extend([func, self], arguments, 2));
+    },
+
+    /** @id MochiKit.Base.compose */
+    compose: function (f1, f2/*, f3, ... fN */) {
+        var fnlist = [];
+        var m = MochiKit.Base;
+        if (arguments.length === 0) {
+            throw new TypeError("compose() requires at least one argument");
+        }
+        for (var i = 0; i < arguments.length; i++) {
+            var fn = arguments[i];
+            if (typeof(fn) != "function") {
+                throw new TypeError(m.repr(fn) + " is not a function");
+            }
+            fnlist.push(fn);
+        }
+        return function () {
+            var args = arguments;
+            for (var i = fnlist.length - 1; i >= 0; i--) {
+                args = [fnlist[i].apply(this, args)];
+            }
+            return args[0];
+        };
+    },
+
+    /** @id MochiKit.Base.bind */
+    bind: function (func, self/* args... */) {
+        if (typeof(func) == "string") {
+            func = self[func];
+        }
+        var im_func = func.im_func;
+        var im_preargs = func.im_preargs;
+        var im_self = func.im_self;
+        var m = MochiKit.Base;
+        if (typeof(func) == "function" && typeof(func.apply) == "undefined") {
+            // this is for cases where JavaScript sucks ass and gives you a
+            // really dumb built-in function like alert() that doesn't have
+            // an apply
+            func = m._wrapDumbFunction(func);
+        }
+        if (typeof(im_func) != 'function') {
+            im_func = func;
+        }
+        if (typeof(self) != 'undefined') {
+            im_self = self;
+        }
+        if (typeof(im_preargs) == 'undefined') {
+            im_preargs = [];
+        } else  {
+            im_preargs = im_preargs.slice();
+        }
+        m.extend(im_preargs, arguments, 2);
+        var newfunc = function () {
+            var args = arguments;
+            var me = arguments.callee;
+            if (me.im_preargs.length > 0) {
+                args = m.concat(me.im_preargs, args);
+            }
+            var self = me.im_self;
+            if (!self) {
+                self = this;
+            }
+            return me.im_func.apply(self, args);
+        };
+        newfunc.im_self = im_self;
+        newfunc.im_func = im_func;
+        newfunc.im_preargs = im_preargs;
+        return newfunc;
+    },
+
+    /** @id MochiKit.Base.bindMethods */
+    bindMethods: function (self) {
+        var bind = MochiKit.Base.bind;
+        for (var k in self) {
+            var func = self[k];
+            if (typeof(func) == 'function') {
+                self[k] = bind(func, self);
+            }
+        }
+    },
+
+    /** @id MochiKit.Base.registerComparator */
+    registerComparator: function (name, check, comparator, /* optional */ override) {
+        MochiKit.Base.comparatorRegistry.register(name, check, comparator, override);
+    },
+
+    _primitives: {'boolean': true, 'string': true, 'number': true},
+
+    /** @id MochiKit.Base.compare */
+    compare: function (a, b) {
+        if (a == b) {
+            return 0;
+        }
+        var aIsNull = (typeof(a) == 'undefined' || a === null);
+        var bIsNull = (typeof(b) == 'undefined' || b === null);
+        if (aIsNull && bIsNull) {
+            return 0;
+        } else if (aIsNull) {
+            return -1;
+        } else if (bIsNull) {
+            return 1;
+        }
+        var m = MochiKit.Base;
+        // bool, number, string have meaningful comparisons
+        var prim = m._primitives;
+        if (!(typeof(a) in prim && typeof(b) in prim)) {
+            try {
+                return m.comparatorRegistry.match(a, b);
+            } catch (e) {
+                if (e != m.NotFound) {
+                    throw e;
+                }
+            }
+        }
+        if (a < b) {
+            return -1;
+        } else if (a > b) {
+            return 1;
+        }
+        // These types can't be compared
+        var repr = m.repr;
+        throw new TypeError(repr(a) + " and " + repr(b) + " can not be compared");
+    },
+
+    /** @id MochiKit.Base.compareDateLike */
+    compareDateLike: function (a, b) {
+        return MochiKit.Base.compare(a.getTime(), b.getTime());
+    },
+
+    /** @id MochiKit.Base.compareArrayLike */
+    compareArrayLike: function (a, b) {
+        var compare = MochiKit.Base.compare;
+        var count = a.length;
+        var rval = 0;
+        if (count > b.length) {
+            rval = 1;
+            count = b.length;
+        } else if (count < b.length) {
+            rval = -1;
+        }
+        for (var i = 0; i < count; i++) {
+            var cmp = compare(a[i], b[i]);
+            if (cmp) {
+                return cmp;
+            }
+        }
+        return rval;
+    },
+
+    /** @id MochiKit.Base.registerRepr */
+    registerRepr: function (name, check, wrap, /* optional */override) {
+        MochiKit.Base.reprRegistry.register(name, check, wrap, override);
+    },
+
+    /** @id MochiKit.Base.repr */
+    repr: function (o) {
+        if (typeof(o) == "undefined") {
+            return "undefined";
+        } else if (o === null) {
+            return "null";
+        }
+        try {
+            if (typeof(o.__repr__) == 'function') {
+                return o.__repr__();
+            } else if (typeof(o.repr) == 'function' && o.repr != arguments.callee) {
+                return o.repr();
+            }
+            return MochiKit.Base.reprRegistry.match(o);
+        } catch (e) {
+            if (typeof(o.NAME) == 'string' && (
+                    o.toString == Function.prototype.toString ||
+                    o.toString == Object.prototype.toString
+                )) {
+                return o.NAME;
+            }
+        }
+        try {
+            var ostring = (o + "");
+        } catch (e) {
+            return "[" + typeof(o) + "]";
+        }
+        if (typeof(o) == "function") {
+            o = ostring.replace(/^\s+/, "");
+            var idx = o.indexOf("{");
+            if (idx != -1) {
+                o = o.substr(0, idx) + "{...}";
+            }
+        }
+        return ostring;
+    },
+
+    /** @id MochiKit.Base.reprArrayLike */
+    reprArrayLike: function (o) {
+        var m = MochiKit.Base;
+        return "[" + m.map(m.repr, o).join(", ") + "]";
+    },
+
+    /** @id MochiKit.Base.reprString */
+    reprString: function (o) {
+        return ('"' + o.replace(/(["\\])/g, '\\$1') + '"'
+            ).replace(/[\f]/g, "\\f"
+            ).replace(/[\b]/g, "\\b"
+            ).replace(/[\n]/g, "\\n"
+            ).replace(/[\t]/g, "\\t"
+            ).replace(/[\r]/g, "\\r");
+    },
+
+    /** @id MochiKit.Base.reprNumber */
+    reprNumber: function (o) {
+        return o + "";
+    },
+
+    /** @id MochiKit.Base.registerJSON */
+    registerJSON: function (name, check, wrap, /* optional */override) {
+        MochiKit.Base.jsonRegistry.register(name, check, wrap, override);
+    },
+
+
+    /** @id MochiKit.Base.evalJSON */
+    evalJSON: function () {
+        return eval("(" + arguments[0] + ")");
+    },
+
+    /** @id MochiKit.Base.serializeJSON */
+    serializeJSON: function (o) {
+        var objtype = typeof(o);
+        if (objtype == "number" || objtype == "boolean") {
+            return o + "";
+        } else if (o === null) {
+            return "null";
+        }
+        var m = MochiKit.Base;
+        var reprString = m.reprString;
+        if (objtype == "string") {
+            return reprString(o);
+        }
+        // recurse
+        var me = arguments.callee;
+        // short-circuit for objects that support "json" serialization
+        // if they return "self" then just pass-through...
+        var newObj;
+        if (typeof(o.__json__) == "function") {
+            newObj = o.__json__();
+            if (o !== newObj) {
+                return me(newObj);
+            }
+        }
+        if (typeof(o.json) == "function") {
+            newObj = o.json();
+            if (o !== newObj) {
+                return me(newObj);
+            }
+        }
+        // array
+        if (objtype != "function" && typeof(o.length) == "number") {
+            var res = [];
+            for (var i = 0; i < o.length; i++) {
+                var val = me(o[i]);
+                if (typeof(val) != "string") {
+                    val = "undefined";
+                }
+                res.push(val);
+            }
+            return "[" + res.join(", ") + "]";
+        }
+        // look in the registry
+        try {
+            newObj = m.jsonRegistry.match(o);
+            if (o !== newObj) {
+                return me(newObj);
+            }
+        } catch (e) {
+            if (e != m.NotFound) {
+                // something really bad happened
+                throw e;
+            }
+        }
+        // undefined is outside of the spec
+        if (objtype == "undefined") {
+            throw new TypeError("undefined can not be serialized as JSON");
+        }
+        // it's a function with no adapter, bad
+        if (objtype == "function") {
+            return null;
+        }
+        // generic object code path
+        res = [];
+        for (var k in o) {
+            var useKey;
+            if (typeof(k) == "number") {
+                useKey = '"' + k + '"';
+            } else if (typeof(k) == "string") {
+                useKey = reprString(k);
+            } else {
+                // skip non-string or number keys
+                continue;
+            }
+            val = me(o[k]);
+            if (typeof(val) != "string") {
+                // skip non-serializable values
+                continue;
+            }
+            res.push(useKey + ":" + val);
+        }
+        return "{" + res.join(", ") + "}";
+    },
+
+
+    /** @id MochiKit.Base.objEqual */
+    objEqual: function (a, b) {
+        return (MochiKit.Base.compare(a, b) === 0);
+    },
+
+    /** @id MochiKit.Base.arrayEqual */
+    arrayEqual: function (self, arr) {
+        if (self.length != arr.length) {
+            return false;
+        }
+        return (MochiKit.Base.compare(self, arr) === 0);
+    },
+
+    /** @id MochiKit.Base.concat */
+    concat: function (/* lst... */) {
+        var rval = [];
+        var extend = MochiKit.Base.extend;
+        for (var i = 0; i < arguments.length; i++) {
+            extend(rval, arguments[i]);
+        }
+        return rval;
+    },
+
+    /** @id MochiKit.Base.keyComparator */
+    keyComparator: function (key/* ... */) {
+        // fast-path for single key comparisons
+        var m = MochiKit.Base;
+        var compare = m.compare;
+        if (arguments.length == 1) {
+            return function (a, b) {
+                return compare(a[key], b[key]);
+            };
+        }
+        var compareKeys = m.extend(null, arguments);
+        return function (a, b) {
+            var rval = 0;
+            // keep comparing until something is inequal or we run out of
+            // keys to compare
+            for (var i = 0; (rval === 0) && (i < compareKeys.length); i++) {
+                var key = compareKeys[i];
+                rval = compare(a[key], b[key]);
+            }
+            return rval;
+        };
+    },
+
+    /** @id MochiKit.Base.reverseKeyComparator */
+    reverseKeyComparator: function (key) {
+        var comparator = MochiKit.Base.keyComparator.apply(this, arguments);
+        return function (a, b) {
+            return comparator(b, a);
+        };
+    },
+
+    /** @id MochiKit.Base.partial */
+    partial: function (func) {
+        var m = MochiKit.Base;
+        return m.bind.apply(this, m.extend([func, undefined], arguments, 1));
+    },
+
+    /** @id MochiKit.Base.listMinMax */
+    listMinMax: function (which, lst) {
+        if (lst.length === 0) {
+            return null;
+        }
+        var cur = lst[0];
+        var compare = MochiKit.Base.compare;
+        for (var i = 1; i < lst.length; i++) {
+            var o = lst[i];
+            if (compare(o, cur) == which) {
+                cur = o;
+            }
+        }
+        return cur;
+    },
+
+    /** @id MochiKit.Base.objMax */
+    objMax: function (/* obj... */) {
+        return MochiKit.Base.listMinMax(1, arguments);
+    },
+
+    /** @id MochiKit.Base.objMin */
+    objMin: function (/* obj... */) {
+        return MochiKit.Base.listMinMax(-1, arguments);
+    },
+
+    /** @id MochiKit.Base.findIdentical */
+    findIdentical: function (lst, value, start/* = 0 */, /* optional */end) {
+        if (typeof(end) == "undefined" || end === null) {
+            end = lst.length;
+        }
+        if (typeof(start) == "undefined" || start === null) {
+            start = 0;
+        }
+        for (var i = start; i < end; i++) {
+            if (lst[i] === value) {
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /** @id MochiKit.Base.mean */
+    mean: function(/* lst... */) {
+        /* http://www.nist.gov/dads/HTML/mean.html */
+        var sum = 0;
+
+        var m = MochiKit.Base;
+        var args = m.extend(null, arguments);
+        var count = args.length;
+
+        while (args.length) {
+            var o = args.shift();
+            if (o && typeof(o) == "object" && typeof(o.length) == "number") {
+                count += o.length - 1;
+                for (var i = o.length - 1; i >= 0; i--) {
+                    sum += o[i];
+                }
+            } else {
+                sum += o;
+            }
+        }
+
+        if (count <= 0) {
+            throw new TypeError('mean() requires at least one argument');
+        }
+
+        return sum/count;
+    },
+
+    /** @id MochiKit.Base.median */
+    median: function(/* lst... */) {
+        /* http://www.nist.gov/dads/HTML/median.html */
+        var data = MochiKit.Base.flattenArguments(arguments);
+        if (data.length === 0) {
+            throw new TypeError('median() requires at least one argument');
+        }
+        data.sort(compare);
+        if (data.length % 2 == 0) {
+            var upper = data.length / 2;
+            return (data[upper] + data[upper - 1]) / 2;
+        } else {
+            return data[(data.length - 1) / 2];
+        }
+    },
+
+    /** @id MochiKit.Base.findValue */
+    findValue: function (lst, value, start/* = 0 */, /* optional */end) {
+        if (typeof(end) == "undefined" || end === null) {
+            end = lst.length;
+        }
+        if (typeof(start) == "undefined" || start === null) {
+            start = 0;
+        }
+        var cmp = MochiKit.Base.compare;
+        for (var i = start; i < end; i++) {
+            if (cmp(lst[i], value) === 0) {
+                return i;
+            }
+        }
+        return -1;
+    },
+
+    /** @id MochiKit.Base.nodeWalk */
+    nodeWalk: function (node, visitor) {
+        var nodes = [node];
+        var extend = MochiKit.Base.extend;
+        while (nodes.length) {
+            var res = visitor(nodes.shift());
+            if (res) {
+                extend(nodes, res);
+            }
+        }
+    },
+
+
+    /** @id MochiKit.Base.nameFunctions */
+    nameFunctions: function (namespace) {
+        var base = namespace.NAME;
+        if (typeof(base) == 'undefined') {
+            base = '';
+        } else {
+            base = base + '.';
+        }
+        for (var name in namespace) {
+            var o = namespace[name];
+            if (typeof(o) == 'function' && typeof(o.NAME) == 'undefined') {
+                try {
+                    o.NAME = base + name;
+                } catch (e) {
+                    // pass
+                }
+            }
+        }
+    },
+
+
+    /** @id MochiKit.Base.queryString */
+    queryString: function (names, values) {
+        // check to see if names is a string or a DOM element, and if
+        // MochiKit.DOM is available.  If so, drop it like it's a form
+        // Ugliest conditional in MochiKit?  Probably!
+        if (typeof(MochiKit.DOM) != "undefined" && arguments.length == 1
+            && (typeof(names) == "string" || (
+                typeof(names.nodeType) != "undefined" && names.nodeType > 0
+            ))
+        ) {
+            var kv = MochiKit.DOM.formContents(names);
+            names = kv[0];
+            values = kv[1];
+        } else if (arguments.length == 1) {
+            // Allow the return value of formContents to be passed directly
+            if (typeof(names.length) == "number" && names.length == 2) {
+                return arguments.callee(names[0], names[1]);
+            }
+            var o = names;
+            names = [];
+            values = [];
+            for (var k in o) {
+                var v = o[k];
+                if (typeof(v) == "function") {
+                    continue;
+                } else if (typeof(v) != "string" &&
+                        typeof(v.length) == "number") {
+                    for (var i = 0; i < v.length; i++) {
+                        names.push(k);
+                        values.push(v[i]);
+                    }
+                } else {
+                    names.push(k);
+                    values.push(v);
+                }
+            }
+        }
+        var rval = [];
+        var len = Math.min(names.length, values.length);
+        var urlEncode = MochiKit.Base.urlEncode;
+        for (var i = 0; i < len; i++) {
+            v = values[i];
+            if (typeof(v) != 'undefined' && v !== null) {
+                rval.push(urlEncode(names[i]) + "=" + urlEncode(v));
+            }
+        }
+        return rval.join("&");
+    },
+
+
+    /** @id MochiKit.Base.parseQueryString */
+    parseQueryString: function (encodedString, useArrays) {
+        // strip a leading '?' from the encoded string
+        var qstr = (encodedString.charAt(0) == "?")
+            ? encodedString.substring(1)
+            : encodedString;
+        var pairs = qstr.replace(/\+/g, "%20").split(/(\&amp\;|\&\#38\;|\&#x26;|\&)/);
+        var o = {};
+        var decode;
+        if (typeof(decodeURIComponent) != "undefined") {
+            decode = decodeURIComponent;
+        } else {
+            decode = unescape;
+        }
+        if (useArrays) {
+            for (var i = 0; i < pairs.length; i++) {
+                var pair = pairs[i].split("=");
+                if (pair.length !== 2) {
+                    continue;
+                }
+                var name = decode(pair[0]);
+                var arr = o[name];
+                if (!(arr instanceof Array)) {
+                    arr = [];
+                    o[name] = arr;
+                }
+                arr.push(decode(pair[1]));
+            }
+        } else {
+            for (i = 0; i < pairs.length; i++) {
+                pair = pairs[i].split("=");
+                if (pair.length !== 2) {
+                    continue;
+                }
+                o[decode(pair[0])] = decode(pair[1]);
+            }
+        }
+        return o;
+    }
+});
+
+/** @id MochiKit.Base.AdapterRegistry */
+MochiKit.Base.AdapterRegistry = function () {
+    this.pairs = [];
+};
+
+MochiKit.Base.AdapterRegistry.prototype = {
+    /** @id MochiKit.Base.AdapterRegistry.prototype.register */
+    register: function (name, check, wrap, /* optional */ override) {
+        if (override) {
+            this.pairs.unshift([name, check, wrap]);
+        } else {
+            this.pairs.push([name, check, wrap]);
+        }
+    },
+
+    /** @id MochiKit.Base.AdapterRegistry.prototype.match */
+    match: function (/* ... */) {
+        for (var i = 0; i < this.pairs.length; i++) {
+            var pair = this.pairs[i];
+            if (pair[1].apply(this, arguments)) {
+                return pair[2].apply(this, arguments);
+            }
+        }
+        throw MochiKit.Base.NotFound;
+    },
+
+    /** @id MochiKit.Base.AdapterRegistry.prototype.unregister */
+    unregister: function (name) {
+        for (var i = 0; i < this.pairs.length; i++) {
+            var pair = this.pairs[i];
+            if (pair[0] == name) {
+                this.pairs.splice(i, 1);
+                return true;
+            }
+        }
+        return false;
+    }
+};
+
+
+MochiKit.Base.EXPORT = [
+    "flattenArray",
+    "noop",
+    "camelize",
+    "counter",
+    "clone",
+    "extend",
+    "update",
+    "updatetree",
+    "setdefault",
+    "keys",
+    "values",
+    "items",
+    "NamedError",
+    "operator",
+    "forwardCall",
+    "itemgetter",
+    "typeMatcher",
+    "isCallable",
+    "isUndefined",
+    "isUndefinedOrNull",
+    "isNull",
+    "isEmpty",
+    "isNotEmpty",
+    "isArrayLike",
+    "isDateLike",
+    "xmap",
+    "map",
+    "xfilter",
+    "filter",
+    "methodcaller",
+    "compose",
+    "bind",
+    "bindMethods",
+    "NotFound",
+    "AdapterRegistry",
+    "registerComparator",
+    "compare",
+    "registerRepr",
+    "repr",
+    "objEqual",
+    "arrayEqual",
+    "concat",
+    "keyComparator",
+    "reverseKeyComparator",
+    "partial",
+    "merge",
+    "listMinMax",
+    "listMax",
+    "listMin",
+    "objMax",
+    "objMin",
+    "nodeWalk",
+    "zip",
+    "urlEncode",
+    "queryString",
+    "serializeJSON",
+    "registerJSON",
+    "evalJSON",
+    "parseQueryString",
+    "findValue",
+    "findIdentical",
+    "flattenArguments",
+    "method",
+    "average",
+    "mean",
+    "median"
+];
+
+MochiKit.Base.EXPORT_OK = [
+    "nameFunctions",
+    "comparatorRegistry",
+    "reprRegistry",
+    "jsonRegistry",
+    "compareDateLike",
+    "compareArrayLike",
+    "reprArrayLike",
+    "reprString",
+    "reprNumber"
+];
+
+MochiKit.Base._exportSymbols = function (globals, module) {
+    if (!MochiKit.__export__) {
+        return;
+    }
+    var all = module.EXPORT_TAGS[":all"];
+    for (var i = 0; i < all.length; i++) {
+        globals[all[i]] = module[all[i]];
+    }
+};
+
+MochiKit.Base.__new__ = function () {
+    // A singleton raised when no suitable adapter is found
+    var m = this;
+
+    // convenience
+    /** @id MochiKit.Base.noop */
+    m.noop = m.operator.identity;
+
+    // Backwards compat
+    m.forward = m.forwardCall;
+    m.find = m.findValue;
+
+    if (typeof(encodeURIComponent) != "undefined") {
+        /** @id MochiKit.Base.urlEncode */
+        m.urlEncode = function (unencoded) {
+            return encodeURIComponent(unencoded).replace(/\'/g, '%27');
+        };
+    } else {
+        m.urlEncode = function (unencoded) {
+            return escape(unencoded
+                ).replace(/\+/g, '%2B'
+                ).replace(/\"/g,'%22'
+                ).rval.replace(/\'/g, '%27');
+        };
+    }
+
+    /** @id MochiKit.Base.NamedError */
+    m.NamedError = function (name) {
+        this.message = name;
+        this.name = name;
+    };
+    m.NamedError.prototype = new Error();
+    m.update(m.NamedError.prototype, {
+        repr: function () {
+            if (this.message && this.message != this.name) {
+                return this.name + "(" + m.repr(this.message) + ")";
+            } else {
+                return this.name + "()";
+            }
+        },
+        toString: m.forwardCall("repr")
+    });
+
+    /** @id MochiKit.Base.NotFound */
+    m.NotFound = new m.NamedError("MochiKit.Base.NotFound");
+
+
+    /** @id MochiKit.Base.listMax */
+    m.listMax = m.partial(m.listMinMax, 1);
+    /** @id MochiKit.Base.listMin */
+    m.listMin = m.partial(m.listMinMax, -1);
+
+    /** @id MochiKit.Base.isCallable */
+    m.isCallable = m.typeMatcher('function');
+    /** @id MochiKit.Base.isUndefined */
+    m.isUndefined = m.typeMatcher('undefined');
+
+    /** @id MochiKit.Base.merge */
+    m.merge = m.partial(m.update, null);
+    /** @id MochiKit.Base.zip */
+    m.zip = m.partial(m.map, null);
+
+    /** @id MochiKit.Base.average */
+    m.average = m.mean;
+
+    /** @id MochiKit.Base.comparatorRegistry */
+    m.comparatorRegistry = new m.AdapterRegistry();
+    m.registerComparator("dateLike", m.isDateLike, m.compareDateLike);
+    m.registerComparator("arrayLike", m.isArrayLike, m.compareArrayLike);
+
+    /** @id MochiKit.Base.reprRegistry */
+    m.reprRegistry = new m.AdapterRegistry();
+    m.registerRepr("arrayLike", m.isArrayLike, m.reprArrayLike);
+    m.registerRepr("string", m.typeMatcher("string"), m.reprString);
+    m.registerRepr("numbers", m.typeMatcher("number", "boolean"), m.reprNumber);
+
+    /** @id MochiKit.Base.jsonRegistry */
+    m.jsonRegistry = new m.AdapterRegistry();
+
+    var all = m.concat(m.EXPORT, m.EXPORT_OK);
+    m.EXPORT_TAGS = {
+        ":common": m.concat(m.EXPORT_OK),
+        ":all": all
+    };
+
+    m.nameFunctions(this);
+
+};
+
+MochiKit.Base.__new__();
+
+//
+// XXX: Internet Explorer blows
+//
+if (MochiKit.__export__) {
+    compare = MochiKit.Base.compare;
+    compose = MochiKit.Base.compose;
+    serializeJSON = MochiKit.Base.serializeJSON;
+}
+
+MochiKit.Base._exportSymbols(this, MochiKit.Base);
diff --git a/frontend/beta/js/MochiKit/Color.js b/frontend/beta/js/MochiKit/Color.js
new file mode 100644
index 0000000..37cb43b
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Color.js
@@ -0,0 +1,902 @@
+/***
+
+MochiKit.Color 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito and others.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Color');
+    dojo.require('MochiKit.Base');
+    dojo.require('MochiKit.DOM');
+    dojo.require('MochiKit.Style');
+}
+
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Base", []);
+    JSAN.use("MochiKit.DOM", []);
+    JSAN.use("MochiKit.Style", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.Color depends on MochiKit.Base";
+}
+
+try {
+    if (typeof(MochiKit.DOM) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.Color depends on MochiKit.DOM";
+}
+
+try {
+    if (typeof(MochiKit.Style) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.Color depends on MochiKit.Style";
+}
+
+if (typeof(MochiKit.Color) == "undefined") {
+    MochiKit.Color = {};
+}
+
+MochiKit.Color.NAME = "MochiKit.Color";
+MochiKit.Color.VERSION = "1.4";
+
+MochiKit.Color.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+
+MochiKit.Color.toString = function () {
+    return this.__repr__();
+};
+
+
+/** @id MochiKit.Color.Color */
+MochiKit.Color.Color = function (red, green, blue, alpha) {
+    if (typeof(alpha) == 'undefined' || alpha === null) {
+        alpha = 1.0;
+    }
+    this.rgb = {
+        r: red,
+        g: green,
+        b: blue,
+        a: alpha
+    };
+};
+
+
+// Prototype methods
+
+MochiKit.Color.Color.prototype = {
+
+    __class__: MochiKit.Color.Color,
+
+    /** @id MochiKit.Color.Color.prototype.colorWithAlpha */
+    colorWithAlpha: function (alpha) {
+        var rgb = this.rgb;
+        var m = MochiKit.Color;
+        return m.Color.fromRGB(rgb.r, rgb.g, rgb.b, alpha);
+    },
+
+    /** @id MochiKit.Color.Color.prototype.colorWithHue */
+    colorWithHue: function (hue) {
+        // get an HSL model, and set the new hue...
+        var hsl = this.asHSL();
+        hsl.h = hue;
+        var m = MochiKit.Color;
+        // convert back to RGB...
+        return m.Color.fromHSL(hsl);
+    },
+
+    /** @id MochiKit.Color.Color.prototype.colorWithSaturation */
+    colorWithSaturation: function (saturation) {
+        // get an HSL model, and set the new hue...
+        var hsl = this.asHSL();
+        hsl.s = saturation;
+        var m = MochiKit.Color;
+        // convert back to RGB...
+        return m.Color.fromHSL(hsl);
+    },
+
+    /** @id MochiKit.Color.Color.prototype.colorWithLightness */
+    colorWithLightness: function (lightness) {
+        // get an HSL model, and set the new hue...
+        var hsl = this.asHSL();
+        hsl.l = lightness;
+        var m = MochiKit.Color;
+        // convert back to RGB...
+        return m.Color.fromHSL(hsl);
+    },
+
+    /** @id MochiKit.Color.Color.prototype.darkerColorWithLevel */
+    darkerColorWithLevel: function (level) {
+        var hsl  = this.asHSL();
+        hsl.l = Math.max(hsl.l - level, 0);
+        var m = MochiKit.Color;
+        return m.Color.fromHSL(hsl);
+    },
+
+    /** @id MochiKit.Color.Color.prototype.lighterColorWithLevel */
+    lighterColorWithLevel: function (level) {
+        var hsl  = this.asHSL();
+        hsl.l = Math.min(hsl.l + level, 1);
+        var m = MochiKit.Color;
+        return m.Color.fromHSL(hsl);
+    },
+
+    /** @id MochiKit.Color.Color.prototype.blendedColor */
+    blendedColor: function (other, /* optional */ fraction) {
+        if (typeof(fraction) == 'undefined' || fraction === null) {
+            fraction = 0.5;
+        }
+        var sf = 1.0 - fraction;
+        var s = this.rgb;
+        var d = other.rgb;
+        var df = fraction;
+        return MochiKit.Color.Color.fromRGB(
+            (s.r * sf) + (d.r * df),
+            (s.g * sf) + (d.g * df),
+            (s.b * sf) + (d.b * df),
+            (s.a * sf) + (d.a * df)
+        );
+    },
+
+    /** @id MochiKit.Color.Color.prototype.compareRGB */
+    compareRGB: function (other) {
+        var a = this.asRGB();
+        var b = other.asRGB();
+        return MochiKit.Base.compare(
+            [a.r, a.g, a.b, a.a],
+            [b.r, b.g, b.b, b.a]
+        );
+    },
+
+    /** @id MochiKit.Color.Color.prototype.isLight */
+    isLight: function () {
+        return this.asHSL().b > 0.5;
+    },
+
+    /** @id MochiKit.Color.Color.prototype.isDark */
+    isDark: function () {
+        return (!this.isLight());
+    },
+
+    /** @id MochiKit.Color.Color.prototype.toHSLString */
+    toHSLString: function () {
+        var c = this.asHSL();
+        var ccc = MochiKit.Color.clampColorComponent;
+        var rval = this._hslString;
+        if (!rval) {
+            var mid = (
+                ccc(c.h, 360).toFixed(0)
+                + "," + ccc(c.s, 100).toPrecision(4) + "%"
+                + "," + ccc(c.l, 100).toPrecision(4) + "%"
+            );
+            var a = c.a;
+            if (a >= 1) {
+                a = 1;
+                rval = "hsl(" + mid + ")";
+            } else {
+                if (a <= 0) {
+                    a = 0;
+                }
+                rval = "hsla(" + mid + "," + a + ")";
+            }
+            this._hslString = rval;
+        }
+        return rval;
+    },
+
+    /** @id MochiKit.Color.Color.prototype.toRGBString */
+    toRGBString: function () {
+        var c = this.rgb;
+        var ccc = MochiKit.Color.clampColorComponent;
+        var rval = this._rgbString;
+        if (!rval) {
+            var mid = (
+                ccc(c.r, 255).toFixed(0)
+                + "," + ccc(c.g, 255).toFixed(0)
+                + "," + ccc(c.b, 255).toFixed(0)
+            );
+            if (c.a != 1) {
+                rval = "rgba(" + mid + "," + c.a + ")";
+            } else {
+                rval = "rgb(" + mid + ")";
+            }
+            this._rgbString = rval;
+        }
+        return rval;
+    },
+
+    /** @id MochiKit.Color.Color.prototype.asRGB */
+    asRGB: function () {
+        return MochiKit.Base.clone(this.rgb);
+    },
+
+    /** @id MochiKit.Color.Color.prototype.toHexString */
+    toHexString: function () {
+        var m = MochiKit.Color;
+        var c = this.rgb;
+        var ccc = MochiKit.Color.clampColorComponent;
+        var rval = this._hexString;
+        if (!rval) {
+            rval = ("#" +
+                m.toColorPart(ccc(c.r, 255)) +
+                m.toColorPart(ccc(c.g, 255)) +
+                m.toColorPart(ccc(c.b, 255))
+            );
+            this._hexString = rval;
+        }
+        return rval;
+    },
+
+    /** @id MochiKit.Color.Color.prototype.asHSV */
+    asHSV: function () {
+        var hsv = this.hsv;
+        var c = this.rgb;
+        if (typeof(hsv) == 'undefined' || hsv === null) {
+            hsv = MochiKit.Color.rgbToHSV(this.rgb);
+            this.hsv = hsv;
+        }
+        return MochiKit.Base.clone(hsv);
+    },
+
+    /** @id MochiKit.Color.Color.prototype.asHSL */
+    asHSL: function () {
+        var hsl = this.hsl;
+        var c = this.rgb;
+        if (typeof(hsl) == 'undefined' || hsl === null) {
+            hsl = MochiKit.Color.rgbToHSL(this.rgb);
+            this.hsl = hsl;
+        }
+        return MochiKit.Base.clone(hsl);
+    },
+
+    /** @id MochiKit.Color.Color.prototype.toString */
+    toString: function () {
+        return this.toRGBString();
+    },
+
+    /** @id MochiKit.Color.Color.prototype.repr */
+    repr: function () {
+        var c = this.rgb;
+        var col = [c.r, c.g, c.b, c.a];
+        return this.__class__.NAME + "(" + col.join(", ") + ")";
+    }
+
+};
+
+// Constructor methods
+
+MochiKit.Base.update(MochiKit.Color.Color, {
+    /** @id MochiKit.Color.Color.fromRGB */
+    fromRGB: function (red, green, blue, alpha) {
+        // designated initializer
+        var Color = MochiKit.Color.Color;
+        if (arguments.length == 1) {
+            var rgb = red;
+            red = rgb.r;
+            green = rgb.g;
+            blue = rgb.b;
+            if (typeof(rgb.a) == 'undefined') {
+                alpha = undefined;
+            } else {
+                alpha = rgb.a;
+            }
+        }
+        return new Color(red, green, blue, alpha);
+    },
+
+    /** @id MochiKit.Color.Color.fromHSL */
+    fromHSL: function (hue, saturation, lightness, alpha) {
+        var m = MochiKit.Color;
+        return m.Color.fromRGB(m.hslToRGB.apply(m, arguments));
+    },
+
+    /** @id MochiKit.Color.Color.fromHSV */
+    fromHSV: function (hue, saturation, value, alpha) {
+        var m = MochiKit.Color;
+        return m.Color.fromRGB(m.hsvToRGB.apply(m, arguments));
+    },
+
+    /** @id MochiKit.Color.Color.fromName */
+    fromName: function (name) {
+        var Color = MochiKit.Color.Color;
+        // Opera 9 seems to "quote" named colors(?!)
+        if (name.charAt(0) == '"') {
+            name = name.substr(1, name.length - 2);
+        }
+        var htmlColor = Color._namedColors[name.toLowerCase()];
+        if (typeof(htmlColor) == 'string') {
+            return Color.fromHexString(htmlColor);
+        } else if (name == "transparent") {
+            return Color.transparentColor();
+        }
+        return null;
+    },
+
+    /** @id MochiKit.Color.Color.fromString */
+    fromString: function (colorString) {
+        var self = MochiKit.Color.Color;
+        var three = colorString.substr(0, 3);
+        if (three == "rgb") {
+            return self.fromRGBString(colorString);
+        } else if (three == "hsl") {
+            return self.fromHSLString(colorString);
+        } else if (colorString.charAt(0) == "#") {
+            return self.fromHexString(colorString);
+        }
+        return self.fromName(colorString);
+    },
+
+
+    /** @id MochiKit.Color.Color.fromHexString */
+    fromHexString: function (hexCode) {
+        if (hexCode.charAt(0) == '#') {
+            hexCode = hexCode.substring(1);
+        }
+        var components = [];
+        var i, hex;
+        if (hexCode.length == 3) {
+            for (i = 0; i < 3; i++) {
+                hex = hexCode.substr(i, 1);
+                components.push(parseInt(hex + hex, 16) / 255.0);
+            }
+        } else {
+            for (i = 0; i < 6; i += 2) {
+                hex = hexCode.substr(i, 2);
+                components.push(parseInt(hex, 16) / 255.0);
+            }
+        }
+        var Color = MochiKit.Color.Color;
+        return Color.fromRGB.apply(Color, components);
+    },
+
+
+    _fromColorString: function (pre, method, scales, colorCode) {
+        // parses either HSL or RGB
+        if (colorCode.indexOf(pre) === 0) {
+            colorCode = colorCode.substring(colorCode.indexOf("(", 3) + 1, colorCode.length - 1);
+        }
+        var colorChunks = colorCode.split(/\s*,\s*/);
+        var colorFloats = [];
+        for (var i = 0; i < colorChunks.length; i++) {
+            var c = colorChunks[i];
+            var val;
+            var three = c.substring(c.length - 3);
+            if (c.charAt(c.length - 1) == '%') {
+                val = 0.01 * parseFloat(c.substring(0, c.length - 1));
+            } else if (three == "deg") {
+                val = parseFloat(c) / 360.0;
+            } else if (three == "rad") {
+                val = parseFloat(c) / (Math.PI * 2);
+            } else {
+                val = scales[i] * parseFloat(c);
+            }
+            colorFloats.push(val);
+        }
+        return this[method].apply(this, colorFloats);
+    },
+
+    /** @id MochiKit.Color.Color.fromComputedStyle */
+    fromComputedStyle: function (elem, style) {
+        var d = MochiKit.DOM;
+        var cls = MochiKit.Color.Color;
+        for (elem = d.getElement(elem); elem; elem = elem.parentNode) {
+            var actualColor = MochiKit.Style.getStyle.apply(d, arguments);
+            if (!actualColor) {
+                continue;
+            }
+            var color = cls.fromString(actualColor);
+            if (!color) {
+                break;
+            }
+            if (color.asRGB().a > 0) {
+                return color;
+            }
+        }
+        return null;
+    },
+
+    /** @id MochiKit.Color.Color.fromBackground */
+    fromBackground: function (elem) {
+        var cls = MochiKit.Color.Color;
+        return cls.fromComputedStyle(
+            elem, "backgroundColor", "background-color") || cls.whiteColor();
+    },
+
+    /** @id MochiKit.Color.Color.fromText */
+    fromText: function (elem) {
+        var cls = MochiKit.Color.Color;
+        return cls.fromComputedStyle(
+            elem, "color", "color") || cls.blackColor();
+    },
+
+    /** @id MochiKit.Color.Color.namedColors */
+    namedColors: function () {
+        return MochiKit.Base.clone(MochiKit.Color.Color._namedColors);
+    }
+});
+
+
+// Module level functions
+
+MochiKit.Base.update(MochiKit.Color, {
+    /** @id MochiKit.Color.clampColorComponent */
+    clampColorComponent: function (v, scale) {
+        v *= scale;
+        if (v < 0) {
+            return 0;
+        } else if (v > scale) {
+            return scale;
+        } else {
+            return v;
+        }
+    },
+
+    _hslValue: function (n1, n2, hue) {
+        if (hue > 6.0) {
+            hue -= 6.0;
+        } else if (hue < 0.0) {
+            hue += 6.0;
+        }
+        var val;
+        if (hue < 1.0) {
+            val = n1 + (n2 - n1) * hue;
+        } else if (hue < 3.0) {
+            val = n2;
+        } else if (hue < 4.0) {
+            val = n1 + (n2 - n1) * (4.0 - hue);
+        } else {
+            val = n1;
+        }
+        return val;
+    },
+
+    /** @id MochiKit.Color.hsvToRGB */
+    hsvToRGB: function (hue, saturation, value, alpha) {
+        if (arguments.length == 1) {
+            var hsv = hue;
+            hue = hsv.h;
+            saturation = hsv.s;
+            value = hsv.v;
+            alpha = hsv.a;
+        }
+        var red;
+        var green;
+        var blue;
+        if (saturation === 0) {
+            red = 0;
+            green = 0;
+            blue = 0;
+        } else {
+            var i = Math.floor(hue * 6);
+            var f = (hue * 6) - i;
+            var p = value * (1 - saturation);
+            var q = value * (1 - (saturation * f));
+            var t = value * (1 - (saturation * (1 - f)));
+            switch (i) {
+                case 1: red = q; green = value; blue = p; break;
+                case 2: red = p; green = value; blue = t; break;
+                case 3: red = p; green = q; blue = value; break;
+                case 4: red = t; green = p; blue = value; break;
+                case 5: red = value; green = p; blue = q; break;
+                case 6: // fall through
+                case 0: red = value; green = t; blue = p; break;
+            }
+        }
+        return {
+            r: red,
+            g: green,
+            b: blue,
+            a: alpha
+        };
+    },
+
+    /** @id MochiKit.Color.hslToRGB */
+    hslToRGB: function (hue, saturation, lightness, alpha) {
+        if (arguments.length == 1) {
+            var hsl = hue;
+            hue = hsl.h;
+            saturation = hsl.s;
+            lightness = hsl.l;
+            alpha = hsl.a;
+        }
+        var red;
+        var green;
+        var blue;
+        if (saturation === 0) {
+            red = lightness;
+            green = lightness;
+            blue = lightness;
+        } else {
+            var m2;
+            if (lightness <= 0.5) {
+                m2 = lightness * (1.0 + saturation);
+            } else {
+                m2 = lightness + saturation - (lightness * saturation);
+            }
+            var m1 = (2.0 * lightness) - m2;
+            var f = MochiKit.Color._hslValue;
+            var h6 = hue * 6.0;
+            red = f(m1, m2, h6 + 2);
+            green = f(m1, m2, h6);
+            blue = f(m1, m2, h6 - 2);
+        }
+        return {
+            r: red,
+            g: green,
+            b: blue,
+            a: alpha
+        };
+    },
+
+    /** @id MochiKit.Color.rgbToHSV */
+    rgbToHSV: function (red, green, blue, alpha) {
+        if (arguments.length == 1) {
+            var rgb = red;
+            red = rgb.r;
+            green = rgb.g;
+            blue = rgb.b;
+            alpha = rgb.a;
+        }
+        var max = Math.max(Math.max(red, green), blue);
+        var min = Math.min(Math.min(red, green), blue);
+        var hue;
+        var saturation;
+        var value = max;
+        if (min == max) {
+            hue = 0;
+            saturation = 0;
+        } else {
+            var delta = (max - min);
+            saturation = delta / max;
+
+            if (red == max) {
+                hue = (green - blue) / delta;
+            } else if (green == max) {
+                hue = 2 + ((blue - red) / delta);
+            } else {
+                hue = 4 + ((red - green) / delta);
+            }
+            hue /= 6;
+            if (hue < 0) {
+                hue += 1;
+            }
+            if (hue > 1) {
+                hue -= 1;
+            }
+        }
+        return {
+            h: hue,
+            s: saturation,
+            v: value,
+            a: alpha
+        };
+    },
+
+    /** @id MochiKit.Color.rgbToHSL */
+    rgbToHSL: function (red, green, blue, alpha) {
+        if (arguments.length == 1) {
+            var rgb = red;
+            red = rgb.r;
+            green = rgb.g;
+            blue = rgb.b;
+            alpha = rgb.a;
+        }
+        var max = Math.max(red, Math.max(green, blue));
+        var min = Math.min(red, Math.min(green, blue));
+        var hue;
+        var saturation;
+        var lightness = (max + min) / 2.0;
+        var delta = max - min;
+        if (delta === 0) {
+            hue = 0;
+            saturation = 0;
+        } else {
+            if (lightness <= 0.5) {
+                saturation = delta / (max + min);
+            } else {
+                saturation = delta / (2 - max - min);
+            }
+            if (red == max) {
+                hue = (green - blue) / delta;
+            } else if (green == max) {
+                hue = 2 + ((blue - red) / delta);
+            } else {
+                hue = 4 + ((red - green) / delta);
+            }
+            hue /= 6;
+            if (hue < 0) {
+                hue += 1;
+            }
+            if (hue > 1) {
+                hue -= 1;
+            }
+
+        }
+        return {
+            h: hue,
+            s: saturation,
+            l: lightness,
+            a: alpha
+        };
+    },
+
+    /** @id MochiKit.Color.toColorPart */
+    toColorPart: function (num) {
+        num = Math.round(num);
+        var digits = num.toString(16);
+        if (num < 16) {
+            return '0' + digits;
+        }
+        return digits;
+    },
+
+    __new__: function () {
+        var m = MochiKit.Base;
+        /** @id MochiKit.Color.fromRGBString */
+        this.Color.fromRGBString = m.bind(
+            this.Color._fromColorString, this.Color, "rgb", "fromRGB",
+            [1.0/255.0, 1.0/255.0, 1.0/255.0, 1]
+        );
+        /** @id MochiKit.Color.fromHSLString */
+        this.Color.fromHSLString = m.bind(
+            this.Color._fromColorString, this.Color, "hsl", "fromHSL",
+            [1.0/360.0, 0.01, 0.01, 1]
+        );
+
+        var third = 1.0 / 3.0;
+        /** @id MochiKit.Color.colors */
+        var colors = {
+            // NSColor colors plus transparent
+            /** @id MochiKit.Color.blackColor */
+            black: [0, 0, 0],
+            /** @id MochiKit.Color.blueColor */
+            blue: [0, 0, 1],
+            /** @id MochiKit.Color.brownColor */
+            brown: [0.6, 0.4, 0.2],
+            /** @id MochiKit.Color.cyanColor */
+            cyan: [0, 1, 1],
+            /** @id MochiKit.Color.darkGrayColor */
+            darkGray: [third, third, third],
+            /** @id MochiKit.Color.grayColor */
+            gray: [0.5, 0.5, 0.5],
+            /** @id MochiKit.Color.greenColor */
+            green: [0, 1, 0],
+            /** @id MochiKit.Color.lightGrayColor */
+            lightGray: [2 * third, 2 * third, 2 * third],
+            /** @id MochiKit.Color.magentaColor */
+            magenta: [1, 0, 1],
+            /** @id MochiKit.Color.orangeColor */
+            orange: [1, 0.5, 0],
+            /** @id MochiKit.Color.purpleColor */
+            purple: [0.5, 0, 0.5],
+            /** @id MochiKit.Color.redColor */
+            red: [1, 0, 0],
+            /** @id MochiKit.Color.transparentColor */
+            transparent: [0, 0, 0, 0],
+            /** @id MochiKit.Color.whiteColor */
+            white: [1, 1, 1],
+            /** @id MochiKit.Color.yellowColor */
+            yellow: [1, 1, 0]
+        };
+
+        var makeColor = function (name, r, g, b, a) {
+            var rval = this.fromRGB(r, g, b, a);
+            this[name] = function () { return rval; };
+            return rval;
+        };
+
+        for (var k in colors) {
+            var name = k + "Color";
+            var bindArgs = m.concat(
+                [makeColor, this.Color, name],
+                colors[k]
+            );
+            this.Color[name] = m.bind.apply(null, bindArgs);
+        }
+
+        var isColor = function () {
+            for (var i = 0; i < arguments.length; i++) {
+                if (!(arguments[i] instanceof Color)) {
+                    return false;
+                }
+            }
+            return true;
+        };
+
+        var compareColor = function (a, b) {
+            return a.compareRGB(b);
+        };
+
+        m.nameFunctions(this);
+
+        m.registerComparator(this.Color.NAME, isColor, compareColor);
+
+        this.EXPORT_TAGS = {
+            ":common": this.EXPORT,
+            ":all": m.concat(this.EXPORT, this.EXPORT_OK)
+        };
+
+    }
+});
+
+MochiKit.Color.EXPORT = [
+    "Color"
+];
+
+MochiKit.Color.EXPORT_OK = [
+    "clampColorComponent",
+    "rgbToHSL",
+    "hslToRGB",
+    "rgbToHSV",
+    "hsvToRGB",
+    "toColorPart"
+];
+
+MochiKit.Color.__new__();
+
+MochiKit.Base._exportSymbols(this, MochiKit.Color);
+
+// Full table of css3 X11 colors <http://www.w3.org/TR/css3-color/#X11COLORS>
+
+MochiKit.Color.Color._namedColors = {
+    aliceblue: "#f0f8ff",
+    antiquewhite: "#faebd7",
+    aqua: "#00ffff",
+    aquamarine: "#7fffd4",
+    azure: "#f0ffff",
+    beige: "#f5f5dc",
+    bisque: "#ffe4c4",
+    black: "#000000",
+    blanchedalmond: "#ffebcd",
+    blue: "#0000ff",
+    blueviolet: "#8a2be2",
+    brown: "#a52a2a",
+    burlywood: "#deb887",
+    cadetblue: "#5f9ea0",
+    chartreuse: "#7fff00",
+    chocolate: "#d2691e",
+    coral: "#ff7f50",
+    cornflowerblue: "#6495ed",
+    cornsilk: "#fff8dc",
+    crimson: "#dc143c",
+    cyan: "#00ffff",
+    darkblue: "#00008b",
+    darkcyan: "#008b8b",
+    darkgoldenrod: "#b8860b",
+    darkgray: "#a9a9a9",
+    darkgreen: "#006400",
+    darkgrey: "#a9a9a9",
+    darkkhaki: "#bdb76b",
+    darkmagenta: "#8b008b",
+    darkolivegreen: "#556b2f",
+    darkorange: "#ff8c00",
+    darkorchid: "#9932cc",
+    darkred: "#8b0000",
+    darksalmon: "#e9967a",
+    darkseagreen: "#8fbc8f",
+    darkslateblue: "#483d8b",
+    darkslategray: "#2f4f4f",
+    darkslategrey: "#2f4f4f",
+    darkturquoise: "#00ced1",
+    darkviolet: "#9400d3",
+    deeppink: "#ff1493",
+    deepskyblue: "#00bfff",
+    dimgray: "#696969",
+    dimgrey: "#696969",
+    dodgerblue: "#1e90ff",
+    firebrick: "#b22222",
+    floralwhite: "#fffaf0",
+    forestgreen: "#228b22",
+    fuchsia: "#ff00ff",
+    gainsboro: "#dcdcdc",
+    ghostwhite: "#f8f8ff",
+    gold: "#ffd700",
+    goldenrod: "#daa520",
+    gray: "#808080",
+    green: "#008000",
+    greenyellow: "#adff2f",
+    grey: "#808080",
+    honeydew: "#f0fff0",
+    hotpink: "#ff69b4",
+    indianred: "#cd5c5c",
+    indigo: "#4b0082",
+    ivory: "#fffff0",
+    khaki: "#f0e68c",
+    lavender: "#e6e6fa",
+    lavenderblush: "#fff0f5",
+    lawngreen: "#7cfc00",
+    lemonchiffon: "#fffacd",
+    lightblue: "#add8e6",
+    lightcoral: "#f08080",
+    lightcyan: "#e0ffff",
+    lightgoldenrodyellow: "#fafad2",
+    lightgray: "#d3d3d3",
+    lightgreen: "#90ee90",
+    lightgrey: "#d3d3d3",
+    lightpink: "#ffb6c1",
+    lightsalmon: "#ffa07a",
+    lightseagreen: "#20b2aa",
+    lightskyblue: "#87cefa",
+    lightslategray: "#778899",
+    lightslategrey: "#778899",
+    lightsteelblue: "#b0c4de",
+    lightyellow: "#ffffe0",
+    lime: "#00ff00",
+    limegreen: "#32cd32",
+    linen: "#faf0e6",
+    magenta: "#ff00ff",
+    maroon: "#800000",
+    mediumaquamarine: "#66cdaa",
+    mediumblue: "#0000cd",
+    mediumorchid: "#ba55d3",
+    mediumpurple: "#9370db",
+    mediumseagreen: "#3cb371",
+    mediumslateblue: "#7b68ee",
+    mediumspringgreen: "#00fa9a",
+    mediumturquoise: "#48d1cc",
+    mediumvioletred: "#c71585",
+    midnightblue: "#191970",
+    mintcream: "#f5fffa",
+    mistyrose: "#ffe4e1",
+    moccasin: "#ffe4b5",
+    navajowhite: "#ffdead",
+    navy: "#000080",
+    oldlace: "#fdf5e6",
+    olive: "#808000",
+    olivedrab: "#6b8e23",
+    orange: "#ffa500",
+    orangered: "#ff4500",
+    orchid: "#da70d6",
+    palegoldenrod: "#eee8aa",
+    palegreen: "#98fb98",
+    paleturquoise: "#afeeee",
+    palevioletred: "#db7093",
+    papayawhip: "#ffefd5",
+    peachpuff: "#ffdab9",
+    peru: "#cd853f",
+    pink: "#ffc0cb",
+    plum: "#dda0dd",
+    powderblue: "#b0e0e6",
+    purple: "#800080",
+    red: "#ff0000",
+    rosybrown: "#bc8f8f",
+    royalblue: "#4169e1",
+    saddlebrown: "#8b4513",
+    salmon: "#fa8072",
+    sandybrown: "#f4a460",
+    seagreen: "#2e8b57",
+    seashell: "#fff5ee",
+    sienna: "#a0522d",
+    silver: "#c0c0c0",
+    skyblue: "#87ceeb",
+    slateblue: "#6a5acd",
+    slategray: "#708090",
+    slategrey: "#708090",
+    snow: "#fffafa",
+    springgreen: "#00ff7f",
+    steelblue: "#4682b4",
+    tan: "#d2b48c",
+    teal: "#008080",
+    thistle: "#d8bfd8",
+    tomato: "#ff6347",
+    turquoise: "#40e0d0",
+    violet: "#ee82ee",
+    wheat: "#f5deb3",
+    white: "#ffffff",
+    whitesmoke: "#f5f5f5",
+    yellow: "#ffff00",
+    yellowgreen: "#9acd32"
+};
diff --git a/frontend/beta/js/MochiKit/Controls.js b/frontend/beta/js/MochiKit/Controls.js
new file mode 100644
index 0000000..b0bc5bf
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Controls.js
@@ -0,0 +1,1388 @@
+/***
+Copyright (c) 2005 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
+          (c) 2005 Ivan Krstic (http://blogs.law.harvard.edu/ivan)
+          (c) 2005 Jon Tirsen (http://www.tirsen.com)
+Contributors:
+    Richard Livsey
+    Rahul Bhargava
+    Rob Wills
+    Mochi-ized By Thomas Herve (_firstname_@nimail.org)
+
+See scriptaculous.js for full license.
+
+Autocompleter.Base handles all the autocompletion functionality
+that's independent of the data source for autocompletion. This
+includes drawing the autocompletion menu, observing keyboard
+and mouse events, and similar.
+
+Specific autocompleters need to provide, at the very least,
+a getUpdatedChoices function that will be invoked every time
+the text inside the monitored textbox changes. This method
+should get the text for which to provide autocompletion by
+invoking this.getToken(), NOT by directly accessing
+this.element.value. This is to allow incremental tokenized
+autocompletion. Specific auto-completion logic (AJAX, etc)
+belongs in getUpdatedChoices.
+
+Tokenized incremental autocompletion is enabled automatically
+when an autocompleter is instantiated with the 'tokens' option
+in the options parameter, e.g.:
+new Ajax.Autocompleter('id','upd', '/url/', { tokens: ',' });
+will incrementally autocomplete with a comma as the token.
+Additionally, ',' in the above example can be replaced with
+a token array, e.g. { tokens: [',', '\n'] } which
+enables autocompletion on multiple tokens. This is most
+useful when one of the tokens is \n (a newline), as it
+allows smart autocompletion after linebreaks.
+
+***/
+
+MochiKit.Base.update(MochiKit.Base, {
+    ScriptFragment: '(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)',
+
+/** @id MochiKit.Base.stripScripts */
+    stripScripts: function (str) {
+        return str.replace(new RegExp(MochiKit.Base.ScriptFragment, 'img'), '');
+    },
+
+/** @id MochiKit.Base.stripTags */
+    stripTags: function(str) {
+        return str.replace(/<\/?[^>]+>/gi, '');
+    },
+
+/** @id MochiKit.Base.extractScripts */
+    extractScripts: function (str) {
+        var matchAll = new RegExp(MochiKit.Base.ScriptFragment, 'img');
+        var matchOne = new RegExp(MochiKit.Base.ScriptFragment, 'im');
+        return MochiKit.Base.map(function (scriptTag) {
+            return (scriptTag.match(matchOne) || ['', ''])[1];
+        }, str.match(matchAll) || []);
+    },
+
+/** @id MochiKit.Base.evalScripts */
+    evalScripts: function (str) {
+        return MochiKit.Base.map(function (scr) {
+            eval(scr);
+        }, MochiKit.Base.extractScripts(str));
+    }
+});
+
+MochiKit.Form = {
+
+/** @id MochiKit.Form.serialize */
+    serialize: function (form) {
+        var elements = MochiKit.Form.getElements(form);
+        var queryComponents = [];
+
+        for (var i = 0; i < elements.length; i++) {
+            var queryComponent = MochiKit.Form.serializeElement(elements[i]);
+            if (queryComponent) {
+                queryComponents.push(queryComponent);
+            }
+        }
+
+        return queryComponents.join('&');
+    },
+
+/** @id MochiKit.Form.getElements */
+    getElements: function (form) {
+        form = MochiKit.DOM.getElement(form);
+        var elements = [];
+
+        for (tagName in MochiKit.Form.Serializers) {
+            var tagElements = form.getElementsByTagName(tagName);
+            for (var j = 0; j < tagElements.length; j++) {
+                elements.push(tagElements[j]);
+            }
+        }
+        return elements;
+    },
+
+/** @id MochiKit.Form.serializeElement */
+    serializeElement: function (element) {
+        element = MochiKit.DOM.getElement(element);
+        var method = element.tagName.toLowerCase();
+        var parameter = MochiKit.Form.Serializers[method](element);
+
+        if (parameter) {
+            var key = encodeURIComponent(parameter[0]);
+            if (key.length === 0) {
+                return;
+            }
+
+            if (!(parameter[1] instanceof Array)) {
+                parameter[1] = [parameter[1]];
+            }
+
+            return parameter[1].map(function (value) {
+                return key + '=' + encodeURIComponent(value);
+            }).join('&');
+        }
+    }
+};
+
+MochiKit.Form.Serializers = {
+
+/** @id MochiKit.Form.Serializers.input */
+    input: function (element) {
+        switch (element.type.toLowerCase()) {
+            case 'submit':
+            case 'hidden':
+            case 'password':
+            case 'text':
+                return MochiKit.Form.Serializers.textarea(element);
+            case 'checkbox':
+            case 'radio':
+                return MochiKit.Form.Serializers.inputSelector(element);
+        }
+        return false;
+    },
+
+/** @id MochiKit.Form.Serializers.inputSelector */
+    inputSelector: function (element) {
+        if (element.checked) {
+            return [element.name, element.value];
+        }
+    },
+
+/** @id MochiKit.Form.Serializers.textarea */
+    textarea: function (element) {
+        return [element.name, element.value];
+    },
+
+/** @id MochiKit.Form.Serializers.select */
+    select: function (element) {
+        return MochiKit.Form.Serializers[element.type == 'select-one' ?
+        'selectOne' : 'selectMany'](element);
+    },
+
+/** @id MochiKit.Form.Serializers.selectOne */
+    selectOne: function (element) {
+        var value = '', opt, index = element.selectedIndex;
+        if (index >= 0) {
+            opt = element.options[index];
+            value = opt.value;
+            if (!value && !('value' in opt)) {
+                value = opt.text;
+            }
+        }
+        return [element.name, value];
+    },
+
+/** @id MochiKit.Form.Serializers.selectMany */
+    selectMany: function (element) {
+        var value = [];
+        for (var i = 0; i < element.length; i++) {
+            var opt = element.options[i];
+            if (opt.selected) {
+                var optValue = opt.value;
+                if (!optValue && !('value' in opt)) {
+                    optValue = opt.text;
+                }
+                value.push(optValue);
+            }
+        }
+        return [element.name, value];
+    }
+};
+
+/** @id Ajax */
+var Ajax = {
+    activeRequestCount: 0
+};
+
+Ajax.Responders = {
+    responders: [],
+
+/** @id Ajax.Responders.register */
+    register: function (responderToAdd) {
+        if (MochiKit.Base.find(this.responders, responderToAdd) == -1) {
+            this.responders.push(responderToAdd);
+        }
+    },
+
+/** @id Ajax.Responders.unregister */
+    unregister: function (responderToRemove) {
+        this.responders = this.responders.without(responderToRemove);
+    },
+
+/** @id Ajax.Responders.dispatch */
+    dispatch: function (callback, request, transport, json) {
+        MochiKit.Iter.forEach(this.responders, function (responder) {
+            if (responder[callback] &&
+                typeof(responder[callback]) == 'function') {
+                try {
+                    responder[callback].apply(responder, [request, transport, json]);
+                } catch (e) {}
+            }
+        });
+    }
+};
+
+Ajax.Responders.register({
+
+/** @id Ajax.Responders.onCreate */
+    onCreate: function () {
+        Ajax.activeRequestCount++;
+    },
+
+/** @id Ajax.Responders.onComplete */
+    onComplete: function () {
+        Ajax.activeRequestCount--;
+    }
+});
+
+/** @id Ajax.Base */
+Ajax.Base = function () {};
+
+Ajax.Base.prototype = {
+
+/** @id Ajax.Base.prototype.setOptions */
+    setOptions: function (options) {
+        this.options = {
+            method: 'post',
+            asynchronous: true,
+            parameters:   ''
+        }
+        MochiKit.Base.update(this.options, options || {});
+    },
+
+/** @id Ajax.Base.prototype.responseIsSuccess */
+    responseIsSuccess: function () {
+        return this.transport.status == undefined
+            || this.transport.status === 0
+            || (this.transport.status >= 200 && this.transport.status < 300);
+    },
+
+/** @id Ajax.Base.prototype.responseIsFailure */
+    responseIsFailure: function () {
+        return !this.responseIsSuccess();
+    }
+};
+
+/** @id Ajax.Request */
+Ajax.Request = function (url, options) {
+    this.__init__(url, options);
+};
+
+/** @id Ajax.Events */
+Ajax.Request.Events = ['Uninitialized', 'Loading', 'Loaded',
+                       'Interactive', 'Complete'];
+
+MochiKit.Base.update(Ajax.Request.prototype, Ajax.Base.prototype);
+
+MochiKit.Base.update(Ajax.Request.prototype, {
+    __init__: function (url, options) {
+        this.transport = MochiKit.Async.getXMLHttpRequest();
+        this.setOptions(options);
+        this.request(url);
+    },
+
+/** @id Ajax.Request.prototype.request */
+    request: function (url) {
+        var parameters = this.options.parameters || '';
+        if (parameters.length > 0){
+            parameters += '&_=';
+        }
+
+        try {
+            this.url = url;
+            if (this.options.method == 'get' && parameters.length > 0) {
+                this.url += (this.url.match(/\?/) ? '&' : '?') + parameters;
+            }
+            Ajax.Responders.dispatch('onCreate', this, this.transport);
+
+            this.transport.open(this.options.method, this.url,
+                                this.options.asynchronous);
+
+            if (this.options.asynchronous) {
+                this.transport.onreadystatechange = MochiKit.Base.bind(this.onStateChange, this);
+                setTimeout(MochiKit.Base.bind(function () {
+                    this.respondToReadyState(1);
+                }, this), 10);
+            }
+
+            this.setRequestHeaders();
+
+            var body = this.options.postBody ? this.options.postBody : parameters;
+            this.transport.send(this.options.method == 'post' ? body : null);
+
+        } catch (e) {
+            this.dispatchException(e);
+        }
+    },
+
+/** @id Ajax.Request.prototype.setRequestHeaders */
+    setRequestHeaders: function () {
+        var requestHeaders = ['X-Requested-With', 'XMLHttpRequest'];
+
+        if (this.options.method == 'post') {
+            requestHeaders.push('Content-type',
+                                'application/x-www-form-urlencoded');
+
+            /* Force 'Connection: close' for Mozilla browsers to work around
+             * a bug where XMLHttpRequest sends an incorrect Content-length
+             * header. See Mozilla Bugzilla #246651.
+             */
+            if (this.transport.overrideMimeType) {
+                requestHeaders.push('Connection', 'close');
+            }
+        }
+
+        if (this.options.requestHeaders) {
+            requestHeaders.push.apply(requestHeaders, this.options.requestHeaders);
+        }
+
+        for (var i = 0; i < requestHeaders.length; i += 2) {
+            this.transport.setRequestHeader(requestHeaders[i], requestHeaders[i+1]);
+        }
+    },
+
+/** @id Ajax.Request.prototype.onStateChange */
+    onStateChange: function () {
+        var readyState = this.transport.readyState;
+        if (readyState != 1) {
+            this.respondToReadyState(this.transport.readyState);
+        }
+    },
+
+/** @id Ajax.Request.prototype.header */
+    header: function (name) {
+        try {
+          return this.transport.getResponseHeader(name);
+        } catch (e) {}
+    },
+
+/** @id Ajax.Request.prototype.evalJSON */
+    evalJSON: function () {
+        try {
+          return eval(this.header('X-JSON'));
+        } catch (e) {}
+    },
+
+/** @id Ajax.Request.prototype.evalResponse */
+    evalResponse: function () {
+        try {
+          return eval(this.transport.responseText);
+        } catch (e) {
+          this.dispatchException(e);
+        }
+    },
+
+/** @id Ajax.Request.prototype.respondToReadyState */
+    respondToReadyState: function (readyState) {
+        var event = Ajax.Request.Events[readyState];
+        var transport = this.transport, json = this.evalJSON();
+
+        if (event == 'Complete') {
+            try {
+                (this.options['on' + this.transport.status]
+                || this.options['on' + (this.responseIsSuccess() ? 'Success' : 'Failure')]
+                || MochiKit.Base.noop)(transport, json);
+            } catch (e) {
+                this.dispatchException(e);
+            }
+
+            if ((this.header('Content-type') || '').match(/^text\/javascript/i)) {
+                this.evalResponse();
+            }
+        }
+
+        try {
+            (this.options['on' + event] || MochiKit.Base.noop)(transport, json);
+            Ajax.Responders.dispatch('on' + event, this, transport, json);
+        } catch (e) {
+            this.dispatchException(e);
+        }
+
+        /* Avoid memory leak in MSIE: clean up the oncomplete event handler */
+        if (event == 'Complete') {
+            this.transport.onreadystatechange = MochiKit.Base.noop;
+        }
+    },
+
+/** @id Ajax.Request.prototype.dispatchException */
+    dispatchException: function (exception) {
+        (this.options.onException || MochiKit.Base.noop)(this, exception);
+        Ajax.Responders.dispatch('onException', this, exception);
+    }
+});
+
+/** @id Ajax.Updater */
+Ajax.Updater = function (container, url, options) {
+    this.__init__(container, url, options);
+};
+
+MochiKit.Base.update(Ajax.Updater.prototype, Ajax.Request.prototype);
+
+MochiKit.Base.update(Ajax.Updater.prototype, {
+    __init__: function (container, url, options) {
+        this.containers = {
+            success: container.success ? MochiKit.DOM.getElement(container.success) : MochiKit.DOM.getElement(container),
+            failure: container.failure ? MochiKit.DOM.getElement(container.failure) :
+                (container.success ? null : MochiKit.DOM.getElement(container))
+        }
+        this.transport = MochiKit.Async.getXMLHttpRequest();
+        this.setOptions(options);
+
+        var onComplete = this.options.onComplete || MochiKit.Base.noop;
+        this.options.onComplete = MochiKit.Base.bind(function (transport, object) {
+            this.updateContent();
+            onComplete(transport, object);
+        }, this);
+
+        this.request(url);
+    },
+
+/** @id Ajax.Updater.prototype.updateContent */
+    updateContent: function () {
+        var receiver = this.responseIsSuccess() ?
+            this.containers.success : this.containers.failure;
+        var response = this.transport.responseText;
+
+        if (!this.options.evalScripts) {
+            response = MochiKit.Base.stripScripts(response);
+        }
+
+        if (receiver) {
+            if (this.options.insertion) {
+                new this.options.insertion(receiver, response);
+            } else {
+                MochiKit.DOM.getElement(receiver).innerHTML =
+                    MochiKit.Base.stripScripts(response);
+                setTimeout(function () {
+                    MochiKit.Base.evalScripts(response);
+                }, 10);
+            }
+        }
+
+        if (this.responseIsSuccess()) {
+            if (this.onComplete) {
+                setTimeout(MochiKit.Base.bind(this.onComplete, this), 10);
+            }
+        }
+    }
+});
+
+/** @id Field */
+var Field = {
+
+/** @id clear */
+    clear: function () {
+        for (var i = 0; i < arguments.length; i++) {
+            MochiKit.DOM.getElement(arguments[i]).value = '';
+        }
+    },
+
+/** @id focus */
+    focus: function (element) {
+        MochiKit.DOM.getElement(element).focus();
+    },
+
+/** @id present */
+    present: function () {
+        for (var i = 0; i < arguments.length; i++) {
+            if (MochiKit.DOM.getElement(arguments[i]).value == '') {
+                return false;
+            }
+        }
+        return true;
+    },
+
+/** @id select */
+    select: function (element) {
+        MochiKit.DOM.getElement(element).select();
+    },
+
+/** @id activate */
+    activate: function (element) {
+        element = MochiKit.DOM.getElement(element);
+        element.focus();
+        if (element.select) {
+            element.select();
+        }
+    },
+
+/** @id scrollFreeActivate */
+    scrollFreeActivate: function (field) {
+        setTimeout(function () {
+            Field.activate(field);
+        }, 1);
+    }
+};
+
+
+/** @id Autocompleter */
+var Autocompleter = {};
+
+/** @id Autocompleter.Base */
+Autocompleter.Base = function () {};
+
+Autocompleter.Base.prototype = {
+
+/** @id Autocompleter.Base.prototype.baseInitialize */
+    baseInitialize: function (element, update, options) {
+        this.element = MochiKit.DOM.getElement(element);
+        this.update = MochiKit.DOM.getElement(update);
+        this.hasFocus = false;
+        this.changed = false;
+        this.active = false;
+        this.index = 0;
+        this.entryCount = 0;
+
+        if (this.setOptions) {
+            this.setOptions(options);
+        }
+        else {
+            this.options = options || {};
+        }
+
+        this.options.paramName = this.options.paramName || this.element.name;
+        this.options.tokens = this.options.tokens || [];
+        this.options.frequency = this.options.frequency || 0.4;
+        this.options.minChars = this.options.minChars || 1;
+        this.options.onShow = this.options.onShow || function (element, update) {
+                if (!update.style.position || update.style.position == 'absolute') {
+                    update.style.position = 'absolute';
+                    MochiKit.Position.clone(element, update, {
+                        setHeight: false,
+                        offsetTop: element.offsetHeight
+                    });
+                }
+                MochiKit.Visual.appear(update, {duration:0.15});
+            };
+        this.options.onHide = this.options.onHide || function (element, update) {
+                MochiKit.Visual.fade(update, {duration: 0.15});
+            };
+
+        if (typeof(this.options.tokens) == 'string') {
+            this.options.tokens = new Array(this.options.tokens);
+        }
+
+        this.observer = null;
+
+        this.element.setAttribute('autocomplete', 'off');
+
+        MochiKit.Style.hideElement(this.update);
+
+        MochiKit.Signal.connect(this.element, 'onblur', this, this.onBlur);
+        MochiKit.Signal.connect(this.element, 'onkeypress', this, this.onKeyPress, this);
+    },
+
+/** @id Autocompleter.Base.prototype.show */
+    show: function () {
+        if (MochiKit.Style.getStyle(this.update, 'display') == 'none') {
+            this.options.onShow(this.element, this.update);
+        }
+        if (!this.iefix && /MSIE/.test(navigator.userAgent &&
+            (MochiKit.Style.getStyle(this.update, 'position') == 'absolute'))) {
+            new Insertion.After(this.update,
+             '<iframe id="' + this.update.id + '_iefix" '+
+             'style="display:none;position:absolute;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);" ' +
+             'src="javascript:false;" frameborder="0" scrolling="no"></iframe>');
+            this.iefix = MochiKit.DOM.getElement(this.update.id + '_iefix');
+        }
+        if (this.iefix) {
+            setTimeout(MochiKit.Base.bind(this.fixIEOverlapping, this), 50);
+        }
+    },
+
+/** @id Autocompleter.Base.prototype.fixIEOverlapping */
+    fixIEOverlapping: function () {
+        MochiKit.Position.clone(this.update, this.iefix);
+        this.iefix.style.zIndex = 1;
+        this.update.style.zIndex = 2;
+        MochiKit.Style.showElement(this.iefix);
+    },
+
+/** @id Autocompleter.Base.prototype.hide */
+    hide: function () {
+        this.stopIndicator();
+        if (MochiKit.Style.getStyle(this.update, 'display') != 'none') {
+            this.options.onHide(this.element, this.update);
+        }
+        if (this.iefix) {
+            MochiKit.Style.hideElement(this.iefix);
+        }
+    },
+
+/** @id Autocompleter.Base.prototype.startIndicator */
+    startIndicator: function () {
+        if (this.options.indicator) {
+            MochiKit.Style.showElement(this.options.indicator);
+        }
+    },
+
+/** @id Autocompleter.Base.prototype.stopIndicator */
+    stopIndicator: function () {
+        if (this.options.indicator) {
+            MochiKit.Style.hideElement(this.options.indicator);
+        }
+    },
+
+/** @id Autocompleter.Base.prototype.onKeyPress */
+    onKeyPress: function (event) {
+        if (this.active) {
+            if (event.key().string == "KEY_TAB" || event.key().string == "KEY_RETURN") {
+                 this.selectEntry();
+                 MochiKit.Event.stop(event);
+            } else if (event.key().string == "KEY_ESCAPE") {
+                 this.hide();
+                 this.active = false;
+                 MochiKit.Event.stop(event);
+                 return;
+            } else if (event.key().string == "KEY_LEFT" || event.key().string == "KEY_RIGHT") {
+                 return;
+            } else if (event.key().string == "KEY_UP") {
+                 this.markPrevious();
+                 this.render();
+                 if (/AppleWebKit'/.test(navigator.appVersion)) {
+                     event.stop();
+                 }
+                 return;
+            } else if (event.key().string == "KEY_DOWN") {
+                 this.markNext();
+                 this.render();
+                 if (/AppleWebKit'/.test(navigator.appVersion)) {
+                     event.stop();
+                 }
+                 return;
+            }
+        } else {
+            if (event.key().string == "KEY_TAB" || event.key().string == "KEY_RETURN") {
+                return;
+            }
+        }
+
+        this.changed = true;
+        this.hasFocus = true;
+
+        if (this.observer) {
+            clearTimeout(this.observer);
+        }
+        this.observer = setTimeout(MochiKit.Base.bind(this.onObserverEvent, this),
+                                   this.options.frequency*1000);
+    },
+
+/** @id Autocompleter.Base.prototype.findElement */
+    findElement: function (event, tagName) {
+        var element = event.target;
+        while (element.parentNode && (!element.tagName ||
+              (element.tagName.toUpperCase() != tagName.toUpperCase()))) {
+            element = element.parentNode;
+        }
+        return element;
+    },
+
+/** @id Autocompleter.Base.prototype.hover */
+    onHover: function (event) {
+        var element = this.findElement(event, 'LI');
+        if (this.index != element.autocompleteIndex) {
+            this.index = element.autocompleteIndex;
+            this.render();
+        }
+        event.stop();
+    },
+
+/** @id Autocompleter.Base.prototype.onClick */
+    onClick: function (event) {
+        var element = this.findElement(event, 'LI');
+        this.index = element.autocompleteIndex;
+        this.selectEntry();
+        this.hide();
+    },
+
+/** @id Autocompleter.Base.prototype.onBlur */
+    onBlur: function (event) {
+        // needed to make click events working
+        setTimeout(MochiKit.Base.bind(this.hide, this), 250);
+        this.hasFocus = false;
+        this.active = false;
+    },
+
+/** @id Autocompleter.Base.prototype.render */
+    render: function () {
+        if (this.entryCount > 0) {
+            for (var i = 0; i < this.entryCount; i++) {
+                this.index == i ?
+                    MochiKit.DOM.addElementClass(this.getEntry(i), 'selected') :
+                    MochiKit.DOM.removeElementClass(this.getEntry(i), 'selected');
+            }
+            if (this.hasFocus) {
+                this.show();
+                this.active = true;
+            }
+        } else {
+            this.active = false;
+            this.hide();
+        }
+    },
+
+/** @id Autocompleter.Base.prototype.markPrevious */
+    markPrevious: function () {
+        if (this.index > 0) {
+            this.index--
+        } else {
+            this.index = this.entryCount-1;
+        }
+    },
+
+/** @id Autocompleter.Base.prototype.markNext */
+    markNext: function () {
+        if (this.index < this.entryCount-1) {
+            this.index++
+        } else {
+            this.index = 0;
+        }
+    },
+
+/** @id Autocompleter.Base.prototype.getEntry */
+    getEntry: function (index) {
+        return this.update.firstChild.childNodes[index];
+    },
+
+/** @id Autocompleter.Base.prototype.getCurrentEntry */
+    getCurrentEntry: function () {
+        return this.getEntry(this.index);
+    },
+
+/** @id Autocompleter.Base.prototype.selectEntry */
+    selectEntry: function () {
+        this.active = false;
+        this.updateElement(this.getCurrentEntry());
+    },
+
+/** @id Autocompleter.Base.prototype.collectTextNodesIgnoreClass */
+    collectTextNodesIgnoreClass: function (element, className) {
+        return MochiKit.Base.flattenArray(MochiKit.Base.map(function (node) {
+            if (node.nodeType == 3) {
+                return node.nodeValue;
+            } else if (node.hasChildNodes() && !MochiKit.DOM.hasElementClass(node, className)) {
+                return this.collectTextNodesIgnoreClass(node, className);
+            }
+            return '';
+        }, MochiKit.DOM.getElement(element).childNodes)).join('');
+    },
+
+/** @id Autocompleter.Base.prototype.updateElement */
+    updateElement: function (selectedElement) {
+        if (this.options.updateElement) {
+            this.options.updateElement(selectedElement);
+            return;
+        }
+        var value = '';
+        if (this.options.select) {
+            var nodes = document.getElementsByClassName(this.options.select, selectedElement) || [];
+            if (nodes.length > 0) {
+                value = MochiKit.DOM.scrapeText(nodes[0]);
+            }
+        } else {
+            value = this.collectTextNodesIgnoreClass(selectedElement, 'informal');
+        }
+        var lastTokenPos = this.findLastToken();
+        if (lastTokenPos != -1) {
+            var newValue = this.element.value.substr(0, lastTokenPos + 1);
+            var whitespace = this.element.value.substr(lastTokenPos + 1).match(/^\s+/);
+            if (whitespace) {
+                newValue += whitespace[0];
+            }
+            this.element.value = newValue + value;
+        } else {
+            this.element.value = value;
+        }
+        this.element.focus();
+
+        if (this.options.afterUpdateElement) {
+            this.options.afterUpdateElement(this.element, selectedElement);
+        }
+    },
+
+/** @id Autocompleter.Base.prototype.updateChoices */
+    updateChoices: function (choices) {
+        if (!this.changed && this.hasFocus) {
+            this.update.innerHTML = choices;
+            var d = MochiKit.DOM;
+            d.removeEmptyTextNodes(this.update);
+            d.removeEmptyTextNodes(this.update.firstChild);
+
+            if (this.update.firstChild && this.update.firstChild.childNodes) {
+                this.entryCount = this.update.firstChild.childNodes.length;
+                for (var i = 0; i < this.entryCount; i++) {
+                    var entry = this.getEntry(i);
+                    entry.autocompleteIndex = i;
+                    this.addObservers(entry);
+                }
+            } else {
+                this.entryCount = 0;
+            }
+
+            this.stopIndicator();
+
+            this.index = 0;
+            this.render();
+        }
+    },
+
+/** @id Autocompleter.Base.prototype.addObservers */
+    addObservers: function (element) {
+        MochiKit.Signal.connect(element, 'onmouseover', this, this.onHover);
+        MochiKit.Signal.connect(element, 'onclick', this, this.onClick);
+    },
+
+/** @id Autocompleter.Base.prototype.onObserverEvent */
+    onObserverEvent: function () {
+        this.changed = false;
+        if (this.getToken().length >= this.options.minChars) {
+            this.startIndicator();
+            this.getUpdatedChoices();
+        } else {
+            this.active = false;
+            this.hide();
+        }
+    },
+
+/** @id Autocompleter.Base.prototype.getToken */
+    getToken: function () {
+        var tokenPos = this.findLastToken();
+        if (tokenPos != -1) {
+            var ret = this.element.value.substr(tokenPos + 1).replace(/^\s+/,'').replace(/\s+$/,'');
+        } else {
+            var ret = this.element.value;
+        }
+        return /\n/.test(ret) ? '' : ret;
+    },
+
+/** @id Autocompleter.Base.prototype.findLastToken */
+    findLastToken: function () {
+        var lastTokenPos = -1;
+
+        for (var i = 0; i < this.options.tokens.length; i++) {
+            var thisTokenPos = this.element.value.lastIndexOf(this.options.tokens[i]);
+            if (thisTokenPos > lastTokenPos) {
+                lastTokenPos = thisTokenPos;
+            }
+        }
+        return lastTokenPos;
+    }
+}
+
+/** @id Ajax.Autocompleter */
+Ajax.Autocompleter = function (element, update, url, options) {
+    this.__init__(element, update, url, options);
+};
+
+MochiKit.Base.update(Ajax.Autocompleter.prototype, Autocompleter.Base.prototype);
+
+MochiKit.Base.update(Ajax.Autocompleter.prototype, {
+    __init__: function (element, update, url, options) {
+        this.baseInitialize(element, update, options);
+        this.options.asynchronous = true;
+        this.options.onComplete = MochiKit.Base.bind(this.onComplete, this);
+        this.options.defaultParams = this.options.parameters || null;
+        this.url = url;
+    },
+
+/** @id Ajax.Autocompleter.prototype.getUpdatedChoices */
+    getUpdatedChoices: function () {
+        var entry = encodeURIComponent(this.options.paramName) + '=' +
+            encodeURIComponent(this.getToken());
+
+        this.options.parameters = this.options.callback ?
+            this.options.callback(this.element, entry) : entry;
+
+        if (this.options.defaultParams) {
+            this.options.parameters += '&' + this.options.defaultParams;
+        }
+        new Ajax.Request(this.url, this.options);
+    },
+
+/** @id Ajax.Autocompleter.prototype.onComplete */
+    onComplete: function (request) {
+        this.updateChoices(request.responseText);
+    }
+});
+
+/***
+
+The local array autocompleter. Used when you'd prefer to
+inject an array of autocompletion options into the page, rather
+than sending out Ajax queries, which can be quite slow sometimes.
+
+The constructor takes four parameters. The first two are, as usual,
+the id of the monitored textbox, and id of the autocompletion menu.
+The third is the array you want to autocomplete from, and the fourth
+is the options block.
+
+Extra local autocompletion options:
+- choices - How many autocompletion choices to offer
+
+- partialSearch - If false, the autocompleter will match entered
+                                       text only at the beginning of strings in the
+                                       autocomplete array. Defaults to true, which will
+                                       match text at the beginning of any *word* in the
+                                       strings in the autocomplete array. If you want to
+                                       search anywhere in the string, additionally set
+                                       the option fullSearch to true (default: off).
+
+- fullSsearch - Search anywhere in autocomplete array strings.
+
+- partialChars - How many characters to enter before triggering
+                                    a partial match (unlike minChars, which defines
+                                    how many characters are required to do any match
+                                    at all). Defaults to 2.
+
+- ignoreCase - Whether to ignore case when autocompleting.
+                                Defaults to true.
+
+It's possible to pass in a custom function as the 'selector'
+option, if you prefer to write your own autocompletion logic.
+In that case, the other options above will not apply unless
+you support them.
+
+***/
+
+/** @id Autocompleter.Local */
+Autocompleter.Local = function (element, update, array, options) {
+    this.__init__(element, update, array, options);
+};
+
+MochiKit.Base.update(Autocompleter.Local.prototype, Autocompleter.Base.prototype);
+
+MochiKit.Base.update(Autocompleter.Local.prototype, {
+    __init__: function (element, update, array, options) {
+        this.baseInitialize(element, update, options);
+        this.options.array = array;
+    },
+
+/** @id Autocompleter.Local.prototype.getUpdatedChoices */
+    getUpdatedChoices: function () {
+        this.updateChoices(this.options.selector(this));
+    },
+
+/** @id Autocompleter.Local.prototype.setOptions */
+    setOptions: function (options) {
+        this.options = MochiKit.Base.update({
+            choices: 10,
+            partialSearch: true,
+            partialChars: 2,
+            ignoreCase: true,
+            fullSearch: false,
+            selector: function (instance) {
+                var ret = [];  // Beginning matches
+                var partial = [];  // Inside matches
+                var entry = instance.getToken();
+                var count = 0;
+
+                for (var i = 0; i < instance.options.array.length &&
+                    ret.length < instance.options.choices ; i++) {
+
+                    var elem = instance.options.array[i];
+                    var foundPos = instance.options.ignoreCase ?
+                        elem.toLowerCase().indexOf(entry.toLowerCase()) :
+                        elem.indexOf(entry);
+
+                    while (foundPos != -1) {
+                        if (foundPos === 0 && elem.length != entry.length) {
+                            ret.push('<li><strong>' + elem.substr(0, entry.length) + '</strong>' +
+                                elem.substr(entry.length) + '</li>');
+                            break;
+                        } else if (entry.length >= instance.options.partialChars &&
+                            instance.options.partialSearch && foundPos != -1) {
+                            if (instance.options.fullSearch || /\s/.test(elem.substr(foundPos - 1, 1))) {
+                                partial.push('<li>' + elem.substr(0, foundPos) + '<strong>' +
+                                    elem.substr(foundPos, entry.length) + '</strong>' + elem.substr(
+                                    foundPos + entry.length) + '</li>');
+                                break;
+                            }
+                        }
+
+                        foundPos = instance.options.ignoreCase ?
+                            elem.toLowerCase().indexOf(entry.toLowerCase(), foundPos + 1) :
+                            elem.indexOf(entry, foundPos + 1);
+
+                    }
+                }
+                if (partial.length) {
+                    ret = ret.concat(partial.slice(0, instance.options.choices - ret.length))
+                }
+                return '<ul>' + ret.join('') + '</ul>';
+            }
+        }, options || {});
+    }
+});
+
+/***
+
+AJAX in-place editor
+
+see documentation on http://wiki.script.aculo.us/scriptaculous/show/Ajax.InPlaceEditor
+
+Use this if you notice weird scrolling problems on some browsers,
+the DOM might be a bit confused when this gets called so do this
+waits 1 ms (with setTimeout) until it does the activation
+
+***/
+
+/** @id Ajax.InPlaceEditor */
+Ajax.InPlaceEditor = function (element, url, options) {
+    this.__init__(element, url, options);
+};
+
+/** @id Ajax.InPlaceEditor.defaultHighlightColor */
+Ajax.InPlaceEditor.defaultHighlightColor = '#FFFF99';
+
+Ajax.InPlaceEditor.prototype = {
+    __init__: function (element, url, options) {
+        this.url = url;
+        this.element = MochiKit.DOM.getElement(element);
+
+        this.options = MochiKit.Base.update({
+            okButton: true,
+            okText: 'ok',
+            cancelLink: true,
+            cancelText: 'cancel',
+            savingText: 'Saving...',
+            clickToEditText: 'Click to edit',
+            okText: 'ok',
+            rows: 1,
+            onComplete: function (transport, element) {
+                new MochiKit.Visual.Highlight(element, {startcolor: this.options.highlightcolor});
+            },
+            onFailure: function (transport) {
+                alert('Error communicating with the server: ' + MochiKit.Base.stripTags(transport.responseText));
+            },
+            callback: function (form) {
+                return MochiKit.DOM.formContents(form);
+            },
+            handleLineBreaks: true,
+            loadingText: 'Loading...',
+            savingClassName: 'inplaceeditor-saving',
+            loadingClassName: 'inplaceeditor-loading',
+            formClassName: 'inplaceeditor-form',
+            highlightcolor: Ajax.InPlaceEditor.defaultHighlightColor,
+            highlightendcolor: '#FFFFFF',
+            externalControl: null,
+            submitOnBlur: false,
+            ajaxOptions: {}
+        }, options || {});
+
+        if (!this.options.formId && this.element.id) {
+            this.options.formId = this.element.id + '-inplaceeditor';
+            if (MochiKit.DOM.getElement(this.options.formId)) {
+                // there's already a form with that name, don't specify an id
+                this.options.formId = null;
+            }
+        }
+
+        if (this.options.externalControl) {
+            this.options.externalControl = MochiKit.DOM.getElement(this.options.externalControl);
+        }
+
+        this.originalBackground = MochiKit.Style.getStyle(this.element, 'background-color');
+        if (!this.originalBackground) {
+            this.originalBackground = 'transparent';
+        }
+
+        this.element.title = this.options.clickToEditText;
+
+        this.onclickListener = MochiKit.Signal.connect(this.element, 'onclick', this, this.enterEditMode);
+        this.mouseoverListener = MochiKit.Signal.connect(this.element, 'onmouseover', this, this.enterHover);
+        this.mouseoutListener = MochiKit.Signal.connect(this.element, 'onmouseout', this, this.leaveHover);
+        if (this.options.externalControl) {
+            this.onclickListenerExternal = MochiKit.Signal.connect(this.options.externalControl,
+                'onclick', this, this.enterEditMode);
+            this.mouseoverListenerExternal = MochiKit.Signal.connect(this.options.externalControl,
+                'onmouseover', this, this.enterHover);
+            this.mouseoutListenerExternal = MochiKit.Signal.connect(this.options.externalControl,
+                'onmouseout', this, this.leaveHover);
+        }
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.enterEditMode */
+    enterEditMode: function (evt) {
+        if (this.saving) {
+            return;
+        }
+        if (this.editing) {
+            return;
+        }
+        this.editing = true;
+        this.onEnterEditMode();
+        if (this.options.externalControl) {
+            MochiKit.Style.hideElement(this.options.externalControl);
+        }
+        MochiKit.Style.hideElement(this.element);
+        this.createForm();
+        this.element.parentNode.insertBefore(this.form, this.element);
+        Field.scrollFreeActivate(this.editField);
+        // stop the event to avoid a page refresh in Safari
+        if (evt) {
+            evt.stop();
+        }
+        return false;
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.createForm */
+    createForm: function () {
+        this.form = document.createElement('form');
+        this.form.id = this.options.formId;
+        MochiKit.DOM.addElementClass(this.form, this.options.formClassName)
+        this.form.onsubmit = MochiKit.Base.bind(this.onSubmit, this);
+
+        this.createEditField();
+
+        if (this.options.textarea) {
+            var br = document.createElement('br');
+            this.form.appendChild(br);
+        }
+
+        if (this.options.okButton) {
+            okButton = document.createElement('input');
+            okButton.type = 'submit';
+            okButton.value = this.options.okText;
+            this.form.appendChild(okButton);
+        }
+
+        if (this.options.cancelLink) {
+            cancelLink = document.createElement('a');
+            cancelLink.href = '#';
+            cancelLink.appendChild(document.createTextNode(this.options.cancelText));
+            cancelLink.onclick = MochiKit.Base.bind(this.onclickCancel, this);
+            this.form.appendChild(cancelLink);
+        }
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.hasHTMLLineBreaks */
+    hasHTMLLineBreaks: function (string) {
+        if (!this.options.handleLineBreaks) {
+            return false;
+        }
+        return string.match(/<br/i) || string.match(/<p>/i);
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.convertHTMLLineBreaks */
+    convertHTMLLineBreaks: function (string) {
+        return string.replace(/<br>/gi, '\n').replace(/<br\/>/gi, '\n').replace(/<\/p>/gi, '\n').replace(/<p>/gi, '');
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.createEditField */
+    createEditField: function () {
+        var text;
+        if (this.options.loadTextURL) {
+            text = this.options.loadingText;
+        } else {
+            text = this.getText();
+        }
+
+        var obj = this;
+
+        if (this.options.rows == 1 && !this.hasHTMLLineBreaks(text)) {
+            this.options.textarea = false;
+            var textField = document.createElement('input');
+            textField.obj = this;
+            textField.type = 'text';
+            textField.name = 'value';
+            textField.value = text;
+            textField.style.backgroundColor = this.options.highlightcolor;
+            var size = this.options.size || this.options.cols || 0;
+            if (size !== 0) {
+                textField.size = size;
+            }
+            if (this.options.submitOnBlur) {
+                textField.onblur = MochiKit.Base.bind(this.onSubmit, this);
+            }
+            this.editField = textField;
+        } else {
+            this.options.textarea = true;
+            var textArea = document.createElement('textarea');
+            textArea.obj = this;
+            textArea.name = 'value';
+            textArea.value = this.convertHTMLLineBreaks(text);
+            textArea.rows = this.options.rows;
+            textArea.cols = this.options.cols || 40;
+            if (this.options.submitOnBlur) {
+                textArea.onblur = MochiKit.Base.bind(this.onSubmit, this);
+            }
+            this.editField = textArea;
+        }
+
+        if (this.options.loadTextURL) {
+            this.loadExternalText();
+        }
+        this.form.appendChild(this.editField);
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.getText */
+    getText: function () {
+        return this.element.innerHTML;
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.loadExternalText */
+    loadExternalText: function () {
+        MochiKit.DOM.addElementClass(this.form, this.options.loadingClassName);
+        this.editField.disabled = true;
+        new Ajax.Request(
+            this.options.loadTextURL,
+            MochiKit.Base.update({
+                asynchronous: true,
+                onComplete: MochiKit.Base.bind(this.onLoadedExternalText, this)
+            }, this.options.ajaxOptions)
+        );
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.onLoadedExternalText */
+    onLoadedExternalText: function (transport) {
+        MochiKit.DOM.removeElementClass(this.form, this.options.loadingClassName);
+        this.editField.disabled = false;
+        this.editField.value = MochiKit.Base.stripTags(transport);
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.onclickCancel */
+    onclickCancel: function () {
+        this.onComplete();
+        this.leaveEditMode();
+        return false;
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.onFailure */
+    onFailure: function (transport) {
+        this.options.onFailure(transport);
+        if (this.oldInnerHTML) {
+            this.element.innerHTML = this.oldInnerHTML;
+            this.oldInnerHTML = null;
+        }
+        return false;
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.onSubmit */
+    onSubmit: function () {
+        // onLoading resets these so we need to save them away for the Ajax call
+        var form = this.form;
+        var value = this.editField.value;
+
+        // do this first, sometimes the ajax call returns before we get a
+        // chance to switch on Saving which means this will actually switch on
+        // Saving *after* we have left edit mode causing Saving to be
+        // displayed indefinitely
+        this.onLoading();
+
+        new Ajax.Updater(
+            {
+                success: this.element,
+                 // dont update on failure (this could be an option)
+                failure: null
+            },
+            this.url,
+            MochiKit.Base.update({
+                parameters: this.options.callback(form, value),
+                onComplete: MochiKit.Base.bind(this.onComplete, this),
+                onFailure: MochiKit.Base.bind(this.onFailure, this)
+            }, this.options.ajaxOptions)
+        );
+        // stop the event to avoid a page refresh in Safari
+        if (arguments.length > 1) {
+            arguments[0].stop();
+        }
+        return false;
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.onLoading */
+    onLoading: function () {
+        this.saving = true;
+        this.removeForm();
+        this.leaveHover();
+        this.showSaving();
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.onSaving */
+    showSaving: function () {
+        this.oldInnerHTML = this.element.innerHTML;
+        this.element.innerHTML = this.options.savingText;
+        MochiKit.DOM.addElementClass(this.element, this.options.savingClassName);
+        this.element.style.backgroundColor = this.originalBackground;
+        MochiKit.Style.showElement(this.element);
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.removeForm */
+    removeForm: function () {
+        if (this.form) {
+            if (this.form.parentNode) {
+                MochiKit.DOM.removeElement(this.form);
+            }
+            this.form = null;
+        }
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.enterHover */
+    enterHover: function () {
+        if (this.saving) {
+            return;
+        }
+        this.element.style.backgroundColor = this.options.highlightcolor;
+        if (this.effect) {
+            this.effect.cancel();
+        }
+        MochiKit.DOM.addElementClass(this.element, this.options.hoverClassName)
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.leaveHover */
+    leaveHover: function () {
+        if (this.options.backgroundColor) {
+            this.element.style.backgroundColor = this.oldBackground;
+        }
+        MochiKit.DOM.removeElementClass(this.element, this.options.hoverClassName)
+        if (this.saving) {
+            return;
+        }
+        this.effect = new MochiKit.Visual.Highlight(this.element, {
+            startcolor: this.options.highlightcolor,
+            endcolor: this.options.highlightendcolor,
+            restorecolor: this.originalBackground
+        });
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.leaveEditMode */
+    leaveEditMode: function () {
+        MochiKit.DOM.removeElementClass(this.element, this.options.savingClassName);
+        this.removeForm();
+        this.leaveHover();
+        this.element.style.backgroundColor = this.originalBackground;
+        MochiKit.Style.showElement(this.element);
+        if (this.options.externalControl) {
+            MochiKit.Style.showElement(this.options.externalControl);
+        }
+        this.editing = false;
+        this.saving = false;
+        this.oldInnerHTML = null;
+        this.onLeaveEditMode();
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.onComplete */
+    onComplete: function (transport) {
+        this.leaveEditMode();
+        MochiKit.Base.bind(this.options.onComplete, this)(transport, this.element);
+    },
+
+/** @id Ajax.InPlaceEditor.prototype.onEnterEditMode */
+    onEnterEditMode: function () {},
+
+/** @id Ajax.InPlaceEditor.prototype.onLeaveEditMode */
+    onLeaveEditMode: function () {},
+
+ /** @id Ajax.InPlaceEditor.prototype.dispose */
+    dispose: function () {
+        if (this.oldInnerHTML) {
+            this.element.innerHTML = this.oldInnerHTML;
+        }
+        this.leaveEditMode();
+        MochiKit.Signal.disconnect(this.onclickListener);
+        MochiKit.Signal.disconnect(this.mouseoverListener);
+        MochiKit.Signal.disconnect(this.mouseoutListener);
+        if (this.options.externalControl) {
+            MochiKit.Signal.disconnect(this.onclickListenerExternal);
+            MochiKit.Signal.disconnect(this.mouseoverListenerExternal);
+            MochiKit.Signal.disconnect(this.mouseoutListenerExternal);
+        }
+    }
+};
+
diff --git a/frontend/beta/js/MochiKit/DOM.js b/frontend/beta/js/MochiKit/DOM.js
new file mode 100644
index 0000000..591c597
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/DOM.js
@@ -0,0 +1,1267 @@
+/***
+
+MochiKit.DOM 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide("MochiKit.DOM");
+    dojo.require("MochiKit.Base");
+}
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Base", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.DOM depends on MochiKit.Base!";
+}
+
+if (typeof(MochiKit.DOM) == 'undefined') {
+    MochiKit.DOM = {};
+}
+
+MochiKit.DOM.NAME = "MochiKit.DOM";
+MochiKit.DOM.VERSION = "1.4";
+MochiKit.DOM.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+MochiKit.DOM.toString = function () {
+    return this.__repr__();
+};
+
+MochiKit.DOM.EXPORT = [
+    "removeEmptyTextNodes",
+    "formContents",
+    "currentWindow",
+    "currentDocument",
+    "withWindow",
+    "withDocument",
+    "registerDOMConverter",
+    "coerceToDOM",
+    "createDOM",
+    "createDOMFunc",
+    "isChildNode",
+    "getNodeAttribute",
+    "removeNodeAttribute",
+    "setNodeAttribute",
+    "updateNodeAttributes",
+    "appendChildNodes",
+    "insertSiblingNodesAfter",
+    "insertSiblingNodesBefore",
+    "replaceChildNodes",
+    "removeElement",
+    "swapDOM",
+    "BUTTON",
+    "TT",
+    "PRE",
+    "H1",
+    "H2",
+    "H3",
+    "BR",
+    "CANVAS",
+    "HR",
+    "LABEL",
+    "TEXTAREA",
+    "FORM",
+    "STRONG",
+    "SELECT",
+    "OPTION",
+    "OPTGROUP",
+    "LEGEND",
+    "FIELDSET",
+    "P",
+    "UL",
+    "OL",
+    "LI",
+    "TD",
+    "TR",
+    "THEAD",
+    "TBODY",
+    "TFOOT",
+    "TABLE",
+    "TH",
+    "INPUT",
+    "SPAN",
+    "A",
+    "DIV",
+    "IMG",
+    "getElement",
+    "$",
+    "getElementsByTagAndClassName",
+    "addToCallStack",
+    "addLoadEvent",
+    "focusOnLoad",
+    "setElementClass",
+    "toggleElementClass",
+    "addElementClass",
+    "removeElementClass",
+    "swapElementClass",
+    "hasElementClass",
+    "escapeHTML",
+    "toHTML",
+    "emitHTML",
+    "scrapeText",
+    "isParent",
+    "getFirstParentByTagAndClassName",
+    "makeClipping",
+    "undoClipping",
+    "makePositioned",
+    "undoPositioned",
+    "getFirstElementByTagAndClassName"
+];
+
+MochiKit.DOM.EXPORT_OK = [
+    "domConverters"
+];
+
+MochiKit.DOM.DEPRECATED = [
+    ['computedStyle', 'MochiKit.Style.getStyle', '1.4'],
+    /** @id MochiKit.DOM.elementDimensions  */
+    ['elementDimensions', 'MochiKit.Style.getElementDimensions', '1.4'],
+    /** @id MochiKit.DOM.elementPosition  */
+    ['elementPosition', 'MochiKit.Style.getElementPosition', '1.4'],
+    ['hideElement', 'MochiKit.Style.hideElement', '1.4'],
+    /** @id MochiKit.DOM.setElementDimensions */
+    ['setElementDimensions', 'MochiKit.Style.setElementDimensions', '1.4'],
+    /** @id MochiKit.DOM.setElementPosition */
+    ['setElementPosition', 'MochiKit.Style.setElementPosition', '1.4'],
+    ['setDisplayForElement', 'MochiKit.Style.setDisplayForElement', '1.4'],
+    /** @id MochiKit.DOM.setOpacity */
+    ['setOpacity', 'MochiKit.Style.setOpacity', '1.4'],
+    ['showElement', 'MochiKit.Style.showElement', '1.4'],
+    /** @id MochiKit.DOM.Coordinates */
+    ['Coordinates', 'MochiKit.Style.Coordinates', '1.4'], // FIXME: broken
+    /** @id MochiKit.DOM.Dimensions */
+    ['Dimensions', 'MochiKit.Style.Dimensions', '1.4'] // FIXME: broken
+];
+
+/** @id MochiKit.DOM.getViewportDimensions */
+MochiKit.DOM.getViewportDimensions = new Function('' +
+    'if (!MochiKit["Style"]) {' +
+    '    throw new Error("This function has been deprecated and depends on MochiKit.Style.");' +
+    '}' +
+    'return MochiKit.Style.getViewportDimensions.apply(this, arguments);');
+
+MochiKit.Base.update(MochiKit.DOM, {
+
+    /** @id MochiKit.DOM.currentWindow */
+    currentWindow: function () {
+        return MochiKit.DOM._window;
+    },
+
+    /** @id MochiKit.DOM.currentDocument */
+    currentDocument: function () {
+        return MochiKit.DOM._document;
+    },
+
+    /** @id MochiKit.DOM.withWindow */
+    withWindow: function (win, func) {
+        var self = MochiKit.DOM;
+        var oldDoc = self._document;
+        var oldWin = self._window;
+        var rval;
+        try {
+            self._window = win;
+            self._document = win.document;
+            rval = func();
+        } catch (e) {
+            self._window = oldWin;
+            self._document = oldDoc;
+            throw e;
+        }
+        self._window = oldWin;
+        self._document = oldDoc;
+        return rval;
+    },
+
+    /** @id MochiKit.DOM.formContents  */
+    formContents: function (elem/* = document.body */) {
+        var names = [];
+        var values = [];
+        var m = MochiKit.Base;
+        var self = MochiKit.DOM;
+        if (typeof(elem) == "undefined" || elem === null) {
+            elem = self._document.body;
+        } else {
+            elem = self.getElement(elem);
+        }
+        m.nodeWalk(elem, function (elem) {
+            var name = elem.name;
+            if (m.isNotEmpty(name)) {
+                var tagName = elem.tagName.toUpperCase();
+                if (tagName === "INPUT"
+                    && (elem.type == "radio" || elem.type == "checkbox")
+                    && !elem.checked
+                ) {
+                    return null;
+                }
+                if (tagName === "SELECT") {
+                    if (elem.type == "select-one") {
+                        if (elem.selectedIndex >= 0) {
+                            var opt = elem.options[elem.selectedIndex];
+                            var v = opt.value;
+                            if (!v) {
+                                var h = opt.outerHTML;
+                                // internet explorer sure does suck.
+                                if (h && !h.match(/^[^>]+\svalue\s*=/i)) {
+                                    v = opt.text;
+                                }
+                            }
+                            names.push(name);
+                            values.push(v);
+                            return null;
+                        }
+                        // no form elements?
+                        names.push(name);
+                        values.push("");
+                        return null;
+                    } else {
+                        var opts = elem.options;
+                        if (!opts.length) {
+                            names.push(name);
+                            values.push("");
+                            return null;
+                        }
+                        for (var i = 0; i < opts.length; i++) {
+                            var opt = opts[i];
+                            if (!opt.selected) {
+                                continue;
+                            }
+                            var v = opt.value;
+                            if (!v) {
+                                var h = opt.outerHTML;
+                                // internet explorer sure does suck.
+                                if (h && !h.match(/^[^>]+\svalue\s*=/i)) {
+                                    v = opt.text;
+                                }
+                            }
+                            names.push(name);
+                            values.push(v);
+                        }
+                        return null;
+                    }
+                }
+                if (tagName === "FORM" || tagName === "P" || tagName === "SPAN"
+                    || tagName === "DIV"
+                ) {
+                    return elem.childNodes;
+                }
+                names.push(name);
+                values.push(elem.value || '');
+                return null;
+            }
+            return elem.childNodes;
+        });
+        return [names, values];
+    },
+
+    /** @id MochiKit.DOM.withDocument */
+    withDocument: function (doc, func) {
+        var self = MochiKit.DOM;
+        var oldDoc = self._document;
+        var rval;
+        try {
+            self._document = doc;
+            rval = func();
+        } catch (e) {
+            self._document = oldDoc;
+            throw e;
+        }
+        self._document = oldDoc;
+        return rval;
+    },
+
+    /** @id MochiKit.DOM.registerDOMConverter */
+    registerDOMConverter: function (name, check, wrap, /* optional */override) {
+        MochiKit.DOM.domConverters.register(name, check, wrap, override);
+    },
+
+    /** @id MochiKit.DOM.coerceToDOM */
+    coerceToDOM: function (node, ctx) {
+        var m = MochiKit.Base;
+        var im = MochiKit.Iter;
+        var self = MochiKit.DOM;
+        if (im) {
+            var iter = im.iter;
+            var repeat = im.repeat;
+            var map = m.map;
+        }
+        var domConverters = self.domConverters;
+        var coerceToDOM = arguments.callee;
+        var NotFound = m.NotFound;
+        while (true) {
+            if (typeof(node) == 'undefined' || node === null) {
+                return null;
+            }
+            if (typeof(node.nodeType) != 'undefined' && node.nodeType > 0) {
+                return node;
+            }
+            if (typeof(node) == 'number' || typeof(node) == 'boolean') {
+                node = node.toString();
+                // FALL THROUGH
+            }
+            if (typeof(node) == 'string') {
+                return self._document.createTextNode(node);
+            }
+            if (typeof(node.__dom__) == 'function') {
+                node = node.__dom__(ctx);
+                continue;
+            }
+            if (typeof(node.dom) == 'function') {
+                node = node.dom(ctx);
+                continue;
+            }
+            if (typeof(node) == 'function') {
+                node = node.apply(ctx, [ctx]);
+                continue;
+            }
+
+            if (im) {
+                // iterable
+                var iterNodes = null;
+                try {
+                    iterNodes = iter(node);
+                } catch (e) {
+                    // pass
+                }
+                if (iterNodes) {
+                    return map(coerceToDOM, iterNodes, repeat(ctx));
+                }
+            }
+
+            // adapter
+            try {
+                node = domConverters.match(node, ctx);
+                continue;
+            } catch (e) {
+                if (e != NotFound) {
+                    throw e;
+                }
+            }
+
+            // fallback
+            return self._document.createTextNode(node.toString());
+        }
+        // mozilla warnings aren't too bright
+        return undefined;
+    },
+
+    /** @id MochiKit.DOM.isChildNode */
+    isChildNode: function (node, maybeparent) {
+        var self = MochiKit.DOM;
+        if (typeof(node) == "string") {
+            node = self.getElement(node);
+        }
+        if (typeof(maybeparent) == "string") {
+            maybeparent = self.getElement(maybeparent);
+        }
+        if (node === maybeparent) {
+            return true;
+        }
+        while (node && node.tagName.toUpperCase() != "BODY") {
+            node = node.parentNode;
+            if (node === maybeparent) {
+                return true;
+            }
+        }
+        return false;
+    },
+
+    /** @id MochiKit.DOM.setNodeAttribute */
+    setNodeAttribute: function (node, attr, value) {
+        var o = {};
+        o[attr] = value;
+        try {
+            return MochiKit.DOM.updateNodeAttributes(node, o);
+        } catch (e) {
+            // pass
+        }
+        return null;
+    },
+
+    /** @id MochiKit.DOM.getNodeAttribute */
+    getNodeAttribute: function (node, attr) {
+        var self = MochiKit.DOM;
+        var rename = self.attributeArray.renames[attr];
+        node = self.getElement(node);
+        try {
+            if (rename) {
+                return node[rename];
+            }
+            return node.getAttribute(attr);
+        } catch (e) {
+            // pass
+        }
+        return null;
+    },
+
+    /** @id MochiKit.DOM.removeNodeAttribute */
+    removeNodeAttribute: function (node, attr) {
+        var self = MochiKit.DOM;
+        var rename = self.attributeArray.renames[attr];
+        node = self.getElement(node);
+        try {
+            if (rename) {
+                return node[rename];
+            }
+            return node.removeAttribute(attr);
+        } catch (e) {
+            // pass
+        }
+        return null;
+    },
+
+    /** @id MochiKit.DOM.updateNodeAttributes */
+    updateNodeAttributes: function (node, attrs) {
+        var elem = node;
+        var self = MochiKit.DOM;
+        if (typeof(node) == 'string') {
+            elem = self.getElement(node);
+        }
+        if (attrs) {
+            var updatetree = MochiKit.Base.updatetree;
+            if (self.attributeArray.compliant) {
+                // not IE, good.
+                for (var k in attrs) {
+                    var v = attrs[k];
+                    if (typeof(v) == 'object' && typeof(elem[k]) == 'object') {
+                        if (k == "style" && MochiKit.Style) {
+                            MochiKit.Style.setStyle(elem, v);
+                        } else {
+                            updatetree(elem[k], v);
+                        }
+                    } else if (k.substring(0, 2) == "on") {
+                        if (typeof(v) == "string") {
+                            v = new Function(v);
+                        }
+                        elem[k] = v;
+                    } else {
+                        elem.setAttribute(k, v);
+                    }
+                }
+            } else {
+                // IE is insane in the membrane
+                var renames = self.attributeArray.renames;
+                for (k in attrs) {
+                    v = attrs[k];
+                    var renamed = renames[k];
+                    if (k == "style" && typeof(v) == "string") {
+                        elem.style.cssText = v;
+                    } else if (typeof(renamed) == "string") {
+                        elem[renamed] = v;
+                    } else if (typeof(elem[k]) == 'object'
+                            && typeof(v) == 'object') {
+                        if (k == "style" && MochiKit.Style) {
+                            MochiKit.Style.setStyle(elem, v);
+                        } else {
+                            updatetree(elem[k], v);
+                        }
+                    } else if (k.substring(0, 2) == "on") {
+                        if (typeof(v) == "string") {
+                            v = new Function(v);
+                        }
+                        elem[k] = v;
+                    } else {
+                        elem.setAttribute(k, v);
+                    }
+                }
+            }
+        }
+        return elem;
+    },
+
+    /** @id MochiKit.DOM.appendChildNodes */
+    appendChildNodes: function (node/*, nodes...*/) {
+        var elem = node;
+        var self = MochiKit.DOM;
+        if (typeof(node) == 'string') {
+            elem = self.getElement(node);
+        }
+        var nodeStack = [
+            self.coerceToDOM(
+                MochiKit.Base.extend(null, arguments, 1),
+                elem
+            )
+        ];
+        var concat = MochiKit.Base.concat;
+        while (nodeStack.length) {
+            var n = nodeStack.shift();
+            if (typeof(n) == 'undefined' || n === null) {
+                // pass
+            } else if (typeof(n.nodeType) == 'number') {
+                elem.appendChild(n);
+            } else {
+                nodeStack = concat(n, nodeStack);
+            }
+        }
+        return elem;
+    },
+
+
+    /** @id MochiKit.DOM.insertSiblingNodesBefore */
+    insertSiblingNodesBefore: function (node/*, nodes...*/) {
+        var elem = node;
+        var self = MochiKit.DOM;
+        if (typeof(node) == 'string') {
+            elem = self.getElement(node);
+        }
+        var nodeStack = [
+            self.coerceToDOM(
+                MochiKit.Base.extend(null, arguments, 1),
+                elem
+            )
+        ];
+        var parentnode = elem.parentNode;
+        var concat = MochiKit.Base.concat;
+        while (nodeStack.length) {
+            var n = nodeStack.shift();
+            if (typeof(n) == 'undefined' || n === null) {
+                // pass
+            } else if (typeof(n.nodeType) == 'number') {
+                parentnode.insertBefore(n, elem);
+            } else {
+                nodeStack = concat(n, nodeStack);
+            }
+        }
+        return parentnode;
+    },
+
+    /** @id MochiKit.DOM.insertSiblingNodesAfter */
+    insertSiblingNodesAfter: function (node/*, nodes...*/) {
+        var elem = node;
+        var self = MochiKit.DOM;
+
+        if (typeof(node) == 'string') {
+            elem = self.getElement(node);
+        }
+        var nodeStack = [
+            self.coerceToDOM(
+                MochiKit.Base.extend(null, arguments, 1),
+                elem
+            )
+        ];
+
+        if (elem.nextSibling) {
+            return self.insertSiblingNodesBefore(elem.nextSibling, nodeStack);
+        }
+        else {
+            return self.appendChildNodes(elem.parentNode, nodeStack);
+        }
+    },
+
+    /** @id MochiKit.DOM.replaceChildNodes */
+    replaceChildNodes: function (node/*, nodes...*/) {
+        var elem = node;
+        var self = MochiKit.DOM;
+        if (typeof(node) == 'string') {
+            elem = self.getElement(node);
+            arguments[0] = elem;
+        }
+        var child;
+        while ((child = elem.firstChild)) {
+            elem.removeChild(child);
+        }
+        if (arguments.length < 2) {
+            return elem;
+        } else {
+            return self.appendChildNodes.apply(this, arguments);
+        }
+    },
+
+    /** @id MochiKit.DOM.createDOM */
+    createDOM: function (name, attrs/*, nodes... */) {
+        var elem;
+        var self = MochiKit.DOM;
+        var m = MochiKit.Base;
+        if (typeof(attrs) == "string" || typeof(attrs) == "number") {
+            var args = m.extend([name, null], arguments, 1);
+            return arguments.callee.apply(this, args);
+        }
+        if (typeof(name) == 'string') {
+            // Internet Explorer is dumb
+            var xhtml = self._xhtml;
+            if (attrs && !self.attributeArray.compliant) {
+                // http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/name_2.asp
+                var contents = "";
+                if ('name' in attrs) {
+                    contents += ' name="' + self.escapeHTML(attrs.name) + '"';
+                }
+                if (name == 'input' && 'type' in attrs) {
+                    contents += ' type="' + self.escapeHTML(attrs.type) + '"';
+                }
+                if (contents) {
+                    name = "<" + name + contents + ">";
+                    xhtml = false;
+                }
+            }
+            var d = self._document;
+            if (xhtml && d === document) {
+                elem = d.createElementNS("http://www.w3.org/1999/xhtml", name);
+            } else {
+                elem = d.createElement(name);
+            }
+        } else {
+            elem = name;
+        }
+        if (attrs) {
+            self.updateNodeAttributes(elem, attrs);
+        }
+        if (arguments.length <= 2) {
+            return elem;
+        } else {
+            var args = m.extend([elem], arguments, 2);
+            return self.appendChildNodes.apply(this, args);
+        }
+    },
+
+    /** @id MochiKit.DOM.createDOMFunc */
+    createDOMFunc: function (/* tag, attrs, *nodes */) {
+        var m = MochiKit.Base;
+        return m.partial.apply(
+            this,
+            m.extend([MochiKit.DOM.createDOM], arguments)
+        );
+    },
+
+    /** @id MochiKit.DOM.removeElement */
+    removeElement: function (elem) {
+        var e = MochiKit.DOM.getElement(elem);
+        e.parentNode.removeChild(e);
+        return e;
+    },
+
+    /** @id MochiKit.DOM.swapDOM */
+    swapDOM: function (dest, src) {
+        var self = MochiKit.DOM;
+        dest = self.getElement(dest);
+        var parent = dest.parentNode;
+        if (src) {
+            src = self.getElement(src);
+            parent.replaceChild(src, dest);
+        } else {
+            parent.removeChild(dest);
+        }
+        return src;
+    },
+
+    /** @id MochiKit.DOM.getElement */
+    getElement: function (id) {
+        var self = MochiKit.DOM;
+        if (arguments.length == 1) {
+            return ((typeof(id) == "string") ?
+                self._document.getElementById(id) : id);
+        } else {
+            return MochiKit.Base.map(self.getElement, arguments);
+        }
+    },
+
+    /** @id MochiKit.DOM.getElementsByTagAndClassName */
+    getElementsByTagAndClassName: function (tagName, className,
+            /* optional */parent) {
+        var self = MochiKit.DOM;
+        if (typeof(tagName) == 'undefined' || tagName === null) {
+            tagName = '*';
+        }
+        if (typeof(parent) == 'undefined' || parent === null) {
+            parent = self._document;
+        }
+        parent = self.getElement(parent);
+        var children = (parent.getElementsByTagName(tagName)
+            || self._document.all);
+        if (typeof(className) == 'undefined' || className === null) {
+            return MochiKit.Base.extend(null, children);
+        }
+
+        var elements = [];
+        for (var i = 0; i < children.length; i++) {
+            var child = children[i];
+            var cls = child.className;
+            if (!cls) {
+                continue;
+            }
+            var classNames = cls.split(' ');
+            for (var j = 0; j < classNames.length; j++) {
+                if (classNames[j] == className) {
+                    elements.push(child);
+                    break;
+                }
+            }
+        }
+
+        return elements;
+    },
+
+    _newCallStack: function (path, once) {
+        var rval = function () {
+            var callStack = arguments.callee.callStack;
+            for (var i = 0; i < callStack.length; i++) {
+                if (callStack[i].apply(this, arguments) === false) {
+                    break;
+                }
+            }
+            if (once) {
+                try {
+                    this[path] = null;
+                } catch (e) {
+                    // pass
+                }
+            }
+        };
+        rval.callStack = [];
+        return rval;
+    },
+
+    /** @id MochiKit.DOM.addToCallStack */
+    addToCallStack: function (target, path, func, once) {
+        var self = MochiKit.DOM;
+        var existing = target[path];
+        var regfunc = existing;
+        if (!(typeof(existing) == 'function'
+                && typeof(existing.callStack) == "object"
+                && existing.callStack !== null)) {
+            regfunc = self._newCallStack(path, once);
+            if (typeof(existing) == 'function') {
+                regfunc.callStack.push(existing);
+            }
+            target[path] = regfunc;
+        }
+        regfunc.callStack.push(func);
+    },
+
+    /** @id MochiKit.DOM.addLoadEvent */
+    addLoadEvent: function (func) {
+        var self = MochiKit.DOM;
+        self.addToCallStack(self._window, "onload", func, true);
+
+    },
+
+    /** @id MochiKit.DOM.focusOnLoad */
+    focusOnLoad: function (element) {
+        var self = MochiKit.DOM;
+        self.addLoadEvent(function () {
+            element = self.getElement(element);
+            if (element) {
+                element.focus();
+            }
+        });
+    },
+
+    /** @id MochiKit.DOM.setElementClass */
+    setElementClass: function (element, className) {
+        var self = MochiKit.DOM;
+        var obj = self.getElement(element);
+        if (self.attributeArray.compliant) {
+            obj.setAttribute("class", className);
+        } else {
+            obj.setAttribute("className", className);
+        }
+    },
+
+    /** @id MochiKit.DOM.toggleElementClass */
+    toggleElementClass: function (className/*, element... */) {
+        var self = MochiKit.DOM;
+        for (var i = 1; i < arguments.length; i++) {
+            var obj = self.getElement(arguments[i]);
+            if (!self.addElementClass(obj, className)) {
+                self.removeElementClass(obj, className);
+            }
+        }
+    },
+
+    /** @id MochiKit.DOM.addElementClass */
+    addElementClass: function (element, className) {
+        var self = MochiKit.DOM;
+        var obj = self.getElement(element);
+        var cls = obj.className;
+        // trivial case, no className yet
+        if (cls == undefined || cls.length === 0) {
+            self.setElementClass(obj, className);
+            return true;
+        }
+        // the other trivial case, already set as the only class
+        if (cls == className) {
+            return false;
+        }
+        var classes = cls.split(" ");
+        for (var i = 0; i < classes.length; i++) {
+            // already present
+            if (classes[i] == className) {
+                return false;
+            }
+        }
+        // append class
+        self.setElementClass(obj, cls + " " + className);
+        return true;
+    },
+
+    /** @id MochiKit.DOM.removeElementClass */
+    removeElementClass: function (element, className) {
+        var self = MochiKit.DOM;
+        var obj = self.getElement(element);
+        var cls = obj.className;
+        // trivial case, no className yet
+        if (cls == undefined || cls.length === 0) {
+            return false;
+        }
+        // other trivial case, set only to className
+        if (cls == className) {
+            self.setElementClass(obj, "");
+            return true;
+        }
+        var classes = cls.split(" ");
+        for (var i = 0; i < classes.length; i++) {
+            // already present
+            if (classes[i] == className) {
+                // only check sane case where the class is used once
+                classes.splice(i, 1);
+                self.setElementClass(obj, classes.join(" "));
+                return true;
+            }
+        }
+        // not found
+        return false;
+    },
+
+    /** @id MochiKit.DOM.swapElementClass */
+    swapElementClass: function (element, fromClass, toClass) {
+        var obj = MochiKit.DOM.getElement(element);
+        var res = MochiKit.DOM.removeElementClass(obj, fromClass);
+        if (res) {
+            MochiKit.DOM.addElementClass(obj, toClass);
+        }
+        return res;
+    },
+
+    /** @id MochiKit.DOM.hasElementClass */
+    hasElementClass: function (element, className/*...*/) {
+        var obj = MochiKit.DOM.getElement(element);
+        var cls = obj.className;
+        if (!cls) {
+            return false;
+        }
+        var classes = cls.split(" ");
+        for (var i = 1; i < arguments.length; i++) {
+            var good = false;
+            for (var j = 0; j < classes.length; j++) {
+                if (classes[j] == arguments[i]) {
+                    good = true;
+                    break;
+                }
+            }
+            if (!good) {
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /** @id MochiKit.DOM.escapeHTML */
+    escapeHTML: function (s) {
+        return s.replace(/&/g, "&amp;"
+            ).replace(/"/g, "&quot;"
+            ).replace(/</g, "&lt;"
+            ).replace(/>/g, "&gt;");
+    },
+
+    /** @id MochiKit.DOM.toHTML */
+    toHTML: function (dom) {
+        return MochiKit.DOM.emitHTML(dom).join("");
+    },
+
+    /** @id MochiKit.DOM.emitHTML */
+    emitHTML: function (dom, /* optional */lst) {
+        if (typeof(lst) == 'undefined' || lst === null) {
+            lst = [];
+        }
+        // queue is the call stack, we're doing this non-recursively
+        var queue = [dom];
+        var self = MochiKit.DOM;
+        var escapeHTML = self.escapeHTML;
+        var attributeArray = self.attributeArray;
+        while (queue.length) {
+            dom = queue.pop();
+            if (typeof(dom) == 'string') {
+                lst.push(dom);
+            } else if (dom.nodeType == 1) {
+                // we're not using higher order stuff here
+                // because safari has heisenbugs.. argh.
+                //
+                // I think it might have something to do with
+                // garbage collection and function calls.
+                lst.push('<' + dom.tagName.toLowerCase());
+                var attributes = [];
+                var domAttr = attributeArray(dom);
+                for (var i = 0; i < domAttr.length; i++) {
+                    var a = domAttr[i];
+                    attributes.push([
+                        " ",
+                        a.name,
+                        '="',
+                        escapeHTML(a.value),
+                        '"'
+                    ]);
+                }
+                attributes.sort();
+                for (i = 0; i < attributes.length; i++) {
+                    var attrs = attributes[i];
+                    for (var j = 0; j < attrs.length; j++) {
+                        lst.push(attrs[j]);
+                    }
+                }
+                if (dom.hasChildNodes()) {
+                    lst.push(">");
+                    // queue is the FILO call stack, so we put the close tag
+                    // on first
+                    queue.push("</" + dom.tagName.toLowerCase() + ">");
+                    var cnodes = dom.childNodes;
+                    for (i = cnodes.length - 1; i >= 0; i--) {
+                        queue.push(cnodes[i]);
+                    }
+                } else {
+                    lst.push('/>');
+                }
+            } else if (dom.nodeType == 3) {
+                lst.push(escapeHTML(dom.nodeValue));
+            }
+        }
+        return lst;
+    },
+
+    /** @id MochiKit.DOM.scrapeText */
+    scrapeText: function (node, /* optional */asArray) {
+        var rval = [];
+        (function (node) {
+            var cn = node.childNodes;
+            if (cn) {
+                for (var i = 0; i < cn.length; i++) {
+                    arguments.callee.call(this, cn[i]);
+                }
+            }
+            var nodeValue = node.nodeValue;
+            if (typeof(nodeValue) == 'string') {
+                rval.push(nodeValue);
+            }
+        })(MochiKit.DOM.getElement(node));
+        if (asArray) {
+            return rval;
+        } else {
+            return rval.join("");
+        }
+    },
+
+    /** @id MochiKit.DOM.removeEmptyTextNodes */
+    removeEmptyTextNodes: function (element) {
+        element = MochiKit.DOM.getElement(element);
+        for (var i = 0; i < element.childNodes.length; i++) {
+            var node = element.childNodes[i];
+            if (node.nodeType == 3 && !/\S/.test(node.nodeValue)) {
+                node.parentNode.removeChild(node);
+            }
+        }
+    },
+
+    /** @id MochiKit.DOM.makeClipping */
+    makeClipping: function (element) {
+        element = MochiKit.DOM.getElement(element);
+        var oldOverflow = element.style.overflow;
+        if ((MochiKit.Style.getStyle(element, 'overflow') || 'visible') != 'hidden') {
+            element.style.overflow = 'hidden';
+        }
+        return oldOverflow;
+    },
+
+    /** @id MochiKit.DOM.undoClipping */
+    undoClipping: function (element, overflow) {
+        element = MochiKit.DOM.getElement(element);
+        if (!overflow) {
+            return;
+        }
+        element.style.overflow = overflow;
+    },
+
+    /** @id MochiKit.DOM.makePositioned */
+    makePositioned: function (element) {
+        element = MochiKit.DOM.getElement(element);
+        var pos = MochiKit.Style.getStyle(element, 'position');
+        if (pos == 'static' || !pos) {
+            element.style.position = 'relative';
+            // Opera returns the offset relative to the positioning context,
+            // when an element is position relative but top and left have
+            // not been defined
+            if (/Opera/.test(navigator.userAgent)) {
+                element.style.top = 0;
+                element.style.left = 0;
+            }
+        }
+    },
+
+    /** @id MochiKit.DOM.undoPositioned */
+    undoPositioned: function (element) {
+        element = MochiKit.DOM.getElement(element);
+        if (element.style.position == 'relative') {
+            element.style.position = element.style.top = element.style.left = element.style.bottom = element.style.right = '';
+        }
+    },
+
+    /** @id MochiKit.DOM.getFirstElementByTagAndClassName */
+    getFirstElementByTagAndClassName: function (tagName, className,
+            /* optional */parent) {
+        var self = MochiKit.DOM;
+        if (typeof(tagName) == 'undefined' || tagName === null) {
+            tagName = '*';
+        }
+        if (typeof(parent) == 'undefined' || parent === null) {
+            parent = self._document;
+        }
+        parent = self.getElement(parent);
+        var children = (parent.getElementsByTagName(tagName)
+            || self._document.all);
+        if (typeof(className) == 'undefined' || className === null) {
+            return children[0];
+        }
+
+        for (var i = 0; i < children.length; i++) {
+            var child = children[i];
+            var classNames = child.className.split(' ');
+            for (var j = 0; j < classNames.length; j++) {
+                if (classNames[j] == className) {
+                    return child;
+                }
+            }
+        }
+    },
+
+    /** @id MochiKit.DOM.getFirstParentByTagAndClassName */
+    getFirstParentByTagAndClassName: function (elem, tagName, className) {
+        var self = MochiKit.DOM;
+        elem = self.getElement(elem);
+        if (typeof(tagName) == 'undefined' || tagName === null) {
+            tagName = '*';
+        } else {
+            tagName = tagName.toUpperCase();
+        }
+        if (typeof(className) == 'undefined' || className === null) {
+            className = null;
+        }
+
+        var classList = '';
+        var curTagName = '';
+        while (elem && elem.tagName) {
+            elem = elem.parentNode;
+            if (tagName == '*' && className === null) {
+                return elem;
+            }
+            classList = elem.className.split(' ');
+            curTagName = elem.tagName.toUpperCase();
+            if (className === null && tagName == curTagName) {
+                return elem;
+            } else if (className !== null) {
+                for (var i = 0; i < classList.length; i++) {
+                    if (tagName == '*' && classList[i] == className) {
+                        return elem;
+                    } else if (tagName == curTagName && classList[i] == className) {
+                        return elem;
+                    }
+                }
+            }
+        }
+        return elem;
+    },
+
+    /** @id MochiKit.DOM.isParent */
+    isParent: function (child, element) {
+        if (!child.parentNode || child == element) {
+            return false;
+        }
+
+        if (child.parentNode == element) {
+            return true;
+        }
+
+        return MochiKit.DOM.isParent(child.parentNode, element);
+    },
+
+    __new__: function (win) {
+
+        var m = MochiKit.Base;
+        if (typeof(document) != "undefined") {
+            this._document = document;
+            var kXULNSURI = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
+            this._xhtml = (document.documentElement &&
+                document.createElementNS &&
+                document.documentElement.namespaceURI === kXULNSURI);
+        } else if (MochiKit.MockDOM) {
+            this._document = MochiKit.MockDOM.document;
+        }
+        this._window = win;
+
+        this.domConverters = new m.AdapterRegistry();
+
+        var __tmpElement = this._document.createElement("span");
+        var attributeArray;
+        if (__tmpElement && __tmpElement.attributes &&
+                __tmpElement.attributes.length > 0) {
+            // for braindead browsers (IE) that insert extra junk
+            var filter = m.filter;
+            attributeArray = function (node) {
+                return filter(attributeArray.ignoreAttrFilter, node.attributes);
+            };
+            attributeArray.ignoreAttr = {};
+            var attrs = __tmpElement.attributes;
+            var ignoreAttr = attributeArray.ignoreAttr;
+            for (var i = 0; i < attrs.length; i++) {
+                var a = attrs[i];
+                ignoreAttr[a.name] = a.value;
+            }
+            attributeArray.ignoreAttrFilter = function (a) {
+                return (attributeArray.ignoreAttr[a.name] != a.value);
+            };
+            attributeArray.compliant = false;
+            attributeArray.renames = {
+                "class": "className",
+                "checked": "defaultChecked",
+                "usemap": "useMap",
+                "for": "htmlFor",
+                "readonly": "readOnly",
+                "colspan": "colSpan",
+                "bgcolor": "bgColor"
+            };
+        } else {
+            attributeArray = function (node) {
+                /***
+
+                    Return an array of attributes for a given node,
+                    filtering out attributes that don't belong for
+                    that are inserted by "Certain Browsers".
+
+                ***/
+                return node.attributes;
+            };
+            attributeArray.compliant = true;
+            attributeArray.renames = {};
+        }
+        this.attributeArray = attributeArray;
+
+        // FIXME: this really belongs in Base, and could probably be cleaner
+        var _deprecated = function(fromModule, arr) {
+            var modules = arr[1].split('.');
+            var str = '';
+            var obj = {};
+
+            str += 'if (!MochiKit.' + modules[1] + ') { throw new Error("';
+            str += 'This function has been deprecated and depends on MochiKit.';
+            str += modules[1] + '.");}';
+            str += 'return MochiKit.' + modules[1] + '.' + arr[0];
+            str += '.apply(this, arguments);';
+
+            obj[modules[2]] = new Function(str);
+            MochiKit.Base.update(MochiKit[fromModule], obj);
+        }
+        for (var i; i < MochiKit.DOM.DEPRECATED.length; i++) {
+            _deprecated('DOM', MochiKit.DOM.DEPRECATED[i]);
+        }
+
+        // shorthand for createDOM syntax
+        var createDOMFunc = this.createDOMFunc;
+        /** @id MochiKit.DOM.UL */
+        this.UL = createDOMFunc("ul");
+        /** @id MochiKit.DOM.OL */
+        this.OL = createDOMFunc("ol");
+        /** @id MochiKit.DOM.LI */
+        this.LI = createDOMFunc("li");
+        /** @id MochiKit.DOM.TD */
+        this.TD = createDOMFunc("td");
+        /** @id MochiKit.DOM.TR */
+        this.TR = createDOMFunc("tr");
+        /** @id MochiKit.DOM.TBODY */
+        this.TBODY = createDOMFunc("tbody");
+        /** @id MochiKit.DOM.THEAD */
+        this.THEAD = createDOMFunc("thead");
+        /** @id MochiKit.DOM.TFOOT */
+        this.TFOOT = createDOMFunc("tfoot");
+        /** @id MochiKit.DOM.TABLE */
+        this.TABLE = createDOMFunc("table");
+        /** @id MochiKit.DOM.TH */
+        this.TH = createDOMFunc("th");
+        /** @id MochiKit.DOM.INPUT */
+        this.INPUT = createDOMFunc("input");
+        /** @id MochiKit.DOM.SPAN */
+        this.SPAN = createDOMFunc("span");
+        /** @id MochiKit.DOM.A */
+        this.A = createDOMFunc("a");
+        /** @id MochiKit.DOM.DIV */
+        this.DIV = createDOMFunc("div");
+        /** @id MochiKit.DOM.IMG */
+        this.IMG = createDOMFunc("img");
+        /** @id MochiKit.DOM.BUTTON */
+        this.BUTTON = createDOMFunc("button");
+        /** @id MochiKit.DOM.TT */
+        this.TT = createDOMFunc("tt");
+        /** @id MochiKit.DOM.PRE */
+        this.PRE = createDOMFunc("pre");
+        /** @id MochiKit.DOM.H1 */
+        this.H1 = createDOMFunc("h1");
+        /** @id MochiKit.DOM.H2 */
+        this.H2 = createDOMFunc("h2");
+        /** @id MochiKit.DOM.H3 */
+        this.H3 = createDOMFunc("h3");
+        /** @id MochiKit.DOM.BR */
+        this.BR = createDOMFunc("br");
+        /** @id MochiKit.DOM.HR */
+        this.HR = createDOMFunc("hr");
+        /** @id MochiKit.DOM.LABEL */
+        this.LABEL = createDOMFunc("label");
+        /** @id MochiKit.DOM.TEXTAREA */
+        this.TEXTAREA = createDOMFunc("textarea");
+        /** @id MochiKit.DOM.FORM */
+        this.FORM = createDOMFunc("form");
+        /** @id MochiKit.DOM.P */
+        this.P = createDOMFunc("p");
+        /** @id MochiKit.DOM.SELECT */
+        this.SELECT = createDOMFunc("select");
+        /** @id MochiKit.DOM.OPTION */
+        this.OPTION = createDOMFunc("option");
+        /** @id MochiKit.DOM.OPTGROUP */
+        this.OPTGROUP = createDOMFunc("optgroup");
+        /** @id MochiKit.DOM.LEGEND */
+        this.LEGEND = createDOMFunc("legend");
+        /** @id MochiKit.DOM.FIELDSET */
+        this.FIELDSET = createDOMFunc("fieldset");
+        /** @id MochiKit.DOM.STRONG */
+        this.STRONG = createDOMFunc("strong");
+        /** @id MochiKit.DOM.CANVAS */
+        this.CANVAS = createDOMFunc("canvas");
+
+        /** @id MochiKit.DOM.$ */
+        this.$ = this.getElement;
+
+        this.EXPORT_TAGS = {
+            ":common": this.EXPORT,
+            ":all": m.concat(this.EXPORT, this.EXPORT_OK)
+        };
+
+        m.nameFunctions(this);
+
+    }
+});
+
+
+MochiKit.DOM.__new__(((typeof(window) == "undefined") ? this : window));
+
+//
+// XXX: Internet Explorer blows
+//
+if (MochiKit.__export__) {
+    withWindow = MochiKit.DOM.withWindow;
+    withDocument = MochiKit.DOM.withDocument;
+}
+
+MochiKit.Base._exportSymbols(this, MochiKit.DOM);
diff --git a/frontend/beta/js/MochiKit/DateTime.js b/frontend/beta/js/MochiKit/DateTime.js
new file mode 100644
index 0000000..c0b03ee
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/DateTime.js
@@ -0,0 +1,216 @@
+/***
+
+MochiKit.DateTime 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.DateTime');
+}
+
+if (typeof(MochiKit) == 'undefined') {
+    MochiKit = {};
+}
+
+if (typeof(MochiKit.DateTime) == 'undefined') {
+    MochiKit.DateTime = {};
+}
+
+MochiKit.DateTime.NAME = "MochiKit.DateTime";
+MochiKit.DateTime.VERSION = "1.4";
+MochiKit.DateTime.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+MochiKit.DateTime.toString = function () {
+    return this.__repr__();
+};
+
+/** @id MochiKit.DateTime.isoDate */
+MochiKit.DateTime.isoDate = function (str) {
+    str = str + "";
+    if (typeof(str) != "string" || str.length === 0) {
+        return null;
+    }
+    var iso = str.split('-');
+    if (iso.length === 0) {
+        return null;
+    }
+    return new Date(iso[0], iso[1] - 1, iso[2]);
+};
+
+MochiKit.DateTime._isoRegexp = /(\d{4,})(?:-(\d{1,2})(?:-(\d{1,2})(?:[T ](\d{1,2}):(\d{1,2})(?::(\d{1,2})(?:\.(\d+))?)?(?:(Z)|([+-])(\d{1,2})(?::(\d{1,2}))?)?)?)?)?/;
+
+/** @id MochiKit.DateTime.isoTimestamp */
+MochiKit.DateTime.isoTimestamp = function (str) {
+    str = str + "";
+    if (typeof(str) != "string" || str.length === 0) {
+        return null;
+    }
+    var res = str.match(MochiKit.DateTime._isoRegexp);
+    if (typeof(res) == "undefined" || res === null) {
+        return null;
+    }
+    var year, month, day, hour, min, sec, msec;
+    year = parseInt(res[1], 10);
+    if (typeof(res[2]) == "undefined" || res[2] === '') {
+        return new Date(year);
+    }
+    month = parseInt(res[2], 10) - 1;
+    day = parseInt(res[3], 10);
+    if (typeof(res[4]) == "undefined" || res[4] === '') {
+        return new Date(year, month, day);
+    }
+    hour = parseInt(res[4], 10);
+    min = parseInt(res[5], 10);
+    sec = (typeof(res[6]) != "undefined" && res[6] !== '') ? parseInt(res[6], 10) : 0;
+    if (typeof(res[7]) != "undefined" && res[7] !== '') {
+        msec = Math.round(1000.0 * parseFloat("0." + res[7]));
+    } else {
+        msec = 0;
+    }
+    if ((typeof(res[8]) == "undefined" || res[8] === '') && (typeof(res[9]) == "undefined" || res[9] === '')) {
+        return new Date(year, month, day, hour, min, sec, msec);
+    }
+    var ofs;
+    if (typeof(res[9]) != "undefined" && res[9] !== '') {
+        ofs = parseInt(res[10], 10) * 3600000;
+        if (typeof(res[11]) != "undefined" && res[11] !== '') {
+            ofs += parseInt(res[11], 10) * 60000;
+        }
+        if (res[9] == "-") {
+            ofs = -ofs;
+        }
+    } else {
+        ofs = 0;
+    }
+    return new Date(Date.UTC(year, month, day, hour, min, sec, msec) - ofs);
+};
+
+/** @id MochiKit.DateTime.toISOTime */
+MochiKit.DateTime.toISOTime = function (date, realISO/* = false */) {
+    if (typeof(date) == "undefined" || date === null) {
+        return null;
+    }
+    var hh = date.getHours();
+    var mm = date.getMinutes();
+    var ss = date.getSeconds();
+    var lst = [
+        ((realISO && (hh < 10)) ? "0" + hh : hh),
+        ((mm < 10) ? "0" + mm : mm),
+        ((ss < 10) ? "0" + ss : ss)
+    ];
+    return lst.join(":");
+};
+
+/** @id MochiKit.DateTime.toISOTimeStamp */
+MochiKit.DateTime.toISOTimestamp = function (date, realISO/* = false*/) {
+    if (typeof(date) == "undefined" || date === null) {
+        return null;
+    }
+    var sep = realISO ? "T" : " ";
+    var foot = realISO ? "Z" : "";
+    if (realISO) {
+        date = new Date(date.getTime() + (date.getTimezoneOffset() * 60000));
+    }
+    return MochiKit.DateTime.toISODate(date) + sep + MochiKit.DateTime.toISOTime(date, realISO) + foot;
+};
+
+/** @id MochiKit.DateTime.toISODate */
+MochiKit.DateTime.toISODate = function (date) {
+    if (typeof(date) == "undefined" || date === null) {
+        return null;
+    }
+    var _padTwo = MochiKit.DateTime._padTwo;
+    return [
+        date.getFullYear(),
+        _padTwo(date.getMonth() + 1),
+        _padTwo(date.getDate())
+    ].join("-");
+};
+
+/** @id MochiKit.DateTime.americanDate */
+MochiKit.DateTime.americanDate = function (d) {
+    d = d + "";
+    if (typeof(d) != "string" || d.length === 0) {
+        return null;
+    }
+    var a = d.split('/');
+    return new Date(a[2], a[0] - 1, a[1]);
+};
+
+MochiKit.DateTime._padTwo = function (n) {
+    return (n > 9) ? n : "0" + n;
+};
+
+/** @id MochiKit.DateTime.toPaddedAmericanDate */
+MochiKit.DateTime.toPaddedAmericanDate = function (d) {
+    if (typeof(d) == "undefined" || d === null) {
+        return null;
+    }
+    var _padTwo = MochiKit.DateTime._padTwo;
+    return [
+        _padTwo(d.getMonth() + 1),
+        _padTwo(d.getDate()),
+        d.getFullYear()
+    ].join('/');
+};
+
+/** @id MochiKit.DateTime.toAmericanDate */
+MochiKit.DateTime.toAmericanDate = function (d) {
+    if (typeof(d) == "undefined" || d === null) {
+        return null;
+    }
+    return [d.getMonth() + 1, d.getDate(), d.getFullYear()].join('/');
+};
+
+MochiKit.DateTime.EXPORT = [
+    "isoDate",
+    "isoTimestamp",
+    "toISOTime",
+    "toISOTimestamp",
+    "toISODate",
+    "americanDate",
+    "toPaddedAmericanDate",
+    "toAmericanDate"
+];
+
+MochiKit.DateTime.EXPORT_OK = [];
+MochiKit.DateTime.EXPORT_TAGS = {
+    ":common": MochiKit.DateTime.EXPORT,
+    ":all": MochiKit.DateTime.EXPORT
+};
+
+MochiKit.DateTime.__new__ = function () {
+    // MochiKit.Base.nameFunctions(this);
+    var base = this.NAME + ".";
+    for (var k in this) {
+        var o = this[k];
+        if (typeof(o) == 'function' && typeof(o.NAME) == 'undefined') {
+            try {
+                o.NAME = base + k;
+            } catch (e) {
+                // pass
+            }
+        }
+    }
+};
+
+MochiKit.DateTime.__new__();
+
+if (typeof(MochiKit.Base) != "undefined") {
+    MochiKit.Base._exportSymbols(this, MochiKit.DateTime);
+} else {
+    (function (globals, module) {
+        if ((typeof(JSAN) == 'undefined' && typeof(dojo) == 'undefined')
+            || (MochiKit.__export__ === false)) {
+            var all = module.EXPORT_TAGS[":all"];
+            for (var i = 0; i < all.length; i++) {
+                globals[all[i]] = module[all[i]];
+            }
+        }
+    })(this, MochiKit.DateTime);
+}
diff --git a/frontend/beta/js/MochiKit/DragAndDrop.js b/frontend/beta/js/MochiKit/DragAndDrop.js
new file mode 100644
index 0000000..c471ffe
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/DragAndDrop.js
@@ -0,0 +1,824 @@
+/***
+MochiKit.DragAndDrop 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+Copyright (c) 2005 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
+    Mochi-ized By Thomas Herve (_firstname_@nimail.org)
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.DragAndDrop');
+    dojo.require('MochiKit.Base');
+    dojo.require('MochiKit.DOM');
+    dojo.require('MochiKit.Iter');
+    dojo.require('MochiKit.Visual');
+    dojo.require('MochiKit.Signal');
+}
+
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Base", []);
+    JSAN.use("MochiKit.DOM", []);
+    JSAN.use("MochiKit.Visual", []);
+    JSAN.use("MochiKit.Iter", []);
+    JSAN.use("MochiKit.Signal", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined' ||
+        typeof(MochiKit.DOM) == 'undefined' ||
+        typeof(MochiKit.Visual) == 'undefined' ||
+        typeof(MochiKit.Signal) == 'undefined' ||
+        typeof(MochiKit.Iter) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.DragAndDrop depends on MochiKit.Base, MochiKit.DOM, MochiKit.Visual, MochiKit.Signal and MochiKit.Iter!";
+}
+
+if (typeof(MochiKit.DragAndDrop) == 'undefined') {
+    MochiKit.DragAndDrop = {};
+}
+
+MochiKit.DragAndDrop.NAME = 'MochiKit.DragAndDrop';
+MochiKit.DragAndDrop.VERSION = '1.4';
+
+MochiKit.DragAndDrop.__repr__ = function () {
+    return '[' + this.NAME + ' ' + this.VERSION + ']';
+};
+
+MochiKit.DragAndDrop.toString = function () {
+    return this.__repr__();
+};
+
+MochiKit.DragAndDrop.EXPORT = [
+    "Droppable",
+    "Draggable"
+];
+
+MochiKit.DragAndDrop.EXPORT_OK = [
+    "Droppables",
+    "Draggables"
+];
+
+MochiKit.DragAndDrop.Droppables = {
+    /***
+
+    Manage all droppables. Shouldn't be used, use the Droppable object instead.
+
+    ***/
+    drops: [],
+
+    remove: function (element) {
+        this.drops = MochiKit.Base.filter(function (d) {
+            return d.element != MochiKit.DOM.getElement(element);
+        }, this.drops);
+    },
+
+    register: function (drop) {
+        this.drops.push(drop);
+    },
+
+    unregister: function (drop) {
+        this.drops = MochiKit.Base.filter(function (d) {
+            return d != drop;
+        }, this.drops);
+    },
+
+    prepare: function (element) {
+        MochiKit.Base.map(function (drop) {
+            if (drop.isAccepted(element)) {
+                if (drop.options.activeclass) {
+                    MochiKit.DOM.addElementClass(drop.element,
+                                                 drop.options.activeclass);
+                }
+                drop.options.onactive(drop.element, element);
+            }
+        }, this.drops);
+    },
+
+    findDeepestChild: function (drops) {
+        deepest = drops[0];
+
+        for (i = 1; i < drops.length; ++i) {
+            if (MochiKit.DOM.isParent(drops[i].element, deepest.element)) {
+                deepest = drops[i];
+            }
+        }
+        return deepest;
+    },
+
+    show: function (point, element) {
+        if (!this.drops.length) {
+            return;
+        }
+        var affected = [];
+
+        if (this.last_active) {
+            this.last_active.deactivate();
+        }
+        MochiKit.Iter.forEach(this.drops, function (drop) {
+            if (drop.isAffected(point, element)) {
+                affected.push(drop);
+            }
+        });
+        if (affected.length > 0) {
+            drop = this.findDeepestChild(affected);
+            MochiKit.Position.within(drop.element, point.page.x, point.page.y);
+            drop.options.onhover(element, drop.element,
+                MochiKit.Position.overlap(drop.options.overlap, drop.element));
+            drop.activate();
+        }
+    },
+
+    fire: function (event, element) {
+        if (!this.last_active) {
+            return;
+        }
+        MochiKit.Position.prepare();
+
+        if (this.last_active.isAffected(event.mouse(), element)) {
+            this.last_active.options.ondrop(element,
+               this.last_active.element, event);
+        }
+    },
+
+    reset: function (element) {
+        MochiKit.Base.map(function (drop) {
+            if (drop.options.activeclass) {
+                MochiKit.DOM.removeElementClass(drop.element,
+                                                drop.options.activeclass);
+            }
+            drop.options.ondesactive(drop.element, element);
+        }, this.drops);
+        if (this.last_active) {
+            this.last_active.deactivate();
+        }
+    }
+};
+
+/** @id MochiKit.DragAndDrop.Droppable */
+MochiKit.DragAndDrop.Droppable = function (element, options) {
+    var cls = arguments.callee;
+    if (!(this instanceof cls)) {
+        return new cls(element, options);
+    }
+    this.__init__(element, options);
+};
+
+MochiKit.DragAndDrop.Droppable.prototype = {
+    /***
+
+    A droppable object. Simple use is to create giving an element:
+
+        new MochiKit.DragAndDrop.Droppable('myelement');
+
+    Generally you'll want to define the 'ondrop' function and maybe the
+    'accept' option to filter draggables.
+
+    ***/
+    __class__: MochiKit.DragAndDrop.Droppable,
+
+    __init__: function (element, /* optional */options) {
+        var d = MochiKit.DOM;
+        var b = MochiKit.Base;
+        this.element = d.getElement(element);
+        this.options = b.update({
+
+            /** @id MochiKit.DragAndDrop.greedy */
+            greedy: true,
+
+            /** @id MochiKit.DragAndDrop.hoverclass */
+            hoverclass: null,
+
+            /** @id MochiKit.DragAndDrop.activeclass */
+            activeclass: null,
+
+            /** @id MochiKit.DragAndDrop.hoverfunc */
+            hoverfunc: b.noop,
+
+            /** @id MochiKit.DragAndDrop.accept */
+            accept: null,
+
+            /** @id MochiKit.DragAndDrop.onactive */
+            onactive: b.noop,
+
+            /** @id MochiKit.DragAndDrop.ondesactive */
+            ondesactive: b.noop,
+
+            /** @id MochiKit.DragAndDrop.onhover */
+            onhover: b.noop,
+
+            /** @id MochiKit.DragAndDrop.ondrop */
+            ondrop: b.noop,
+
+            /** @id MochiKit.DragAndDrop.containment */
+            containment: [],
+            tree: false
+        }, options || {});
+
+        // cache containers
+        this.options._containers = [];
+        b.map(MochiKit.Base.bind(function (c) {
+            this.options._containers.push(d.getElement(c));
+        }, this), this.options.containment);
+
+        d.makePositioned(this.element); // fix IE
+
+        MochiKit.DragAndDrop.Droppables.register(this);
+    },
+
+    /** @id MochiKit.DragAndDrop.isContained */
+    isContained: function (element) {
+        if (this.options._containers.length) {
+            var containmentNode;
+            if (this.options.tree) {
+                containmentNode = element.treeNode;
+            } else {
+                containmentNode = element.parentNode;
+            }
+            return MochiKit.Iter.some(this.options._containers, function (c) {
+                return containmentNode == c;
+            });
+        } else {
+            return true;
+        }
+    },
+
+    /** @id MochiKit.DragAndDrop.isAccepted */
+    isAccepted: function (element) {
+        return ((!this.options.accept) || MochiKit.Iter.some(
+          this.options.accept, function (c) {
+            return MochiKit.DOM.hasElementClass(element, c);
+        }));
+    },
+
+    /** @id MochiKit.DragAndDrop.isAffected */
+    isAffected: function (point, element) {
+        return ((this.element != element) &&
+                this.isContained(element) &&
+                this.isAccepted(element) &&
+                MochiKit.Position.within(this.element, point.page.x,
+                                                       point.page.y));
+    },
+
+    /** @id MochiKit.DragAndDrop.deactivate */
+    deactivate: function () {
+        /***
+
+        A droppable is deactivate when a draggable has been over it and left.
+
+        ***/
+        if (this.options.hoverclass) {
+            MochiKit.DOM.removeElementClass(this.element,
+                                            this.options.hoverclass);
+        }
+        this.options.hoverfunc(this.element, false);
+        MochiKit.DragAndDrop.Droppables.last_active = null;
+    },
+
+    /** @id MochiKit.DragAndDrop.activate */
+    activate: function () {
+        /***
+
+        A droppable is active when a draggable is over it.
+
+        ***/
+        if (this.options.hoverclass) {
+            MochiKit.DOM.addElementClass(this.element, this.options.hoverclass);
+        }
+        this.options.hoverfunc(this.element, true);
+        MochiKit.DragAndDrop.Droppables.last_active = this;
+    },
+
+    /** @id MochiKit.DragAndDrop.destroy */
+    destroy: function () {
+        /***
+
+        Delete this droppable.
+
+        ***/
+        MochiKit.DragAndDrop.Droppables.unregister(this);
+    },
+
+    /** @id MochiKit.DragAndDrop.repr */
+    repr: function () {
+        return '[' + this.__class__.NAME + ", options:" + MochiKit.Base.repr(this.options) + "]";
+    }
+};
+
+MochiKit.DragAndDrop.Draggables = {
+    /***
+
+    Manage draggables elements. Not intended to direct use.
+
+    ***/
+    drags: [],
+
+    register: function (draggable) {
+        if (this.drags.length === 0) {
+            var conn = MochiKit.Signal.connect;
+            this.eventMouseUp = conn(document, 'onmouseup', this, this.endDrag);
+            this.eventMouseMove = conn(document, 'onmousemove', this,
+                                       this.updateDrag);
+            this.eventKeypress = conn(document, 'onkeypress', this,
+                                      this.keyPress);
+        }
+        this.drags.push(draggable);
+    },
+
+    unregister: function (draggable) {
+        this.drags = MochiKit.Base.filter(function (d) {
+            return d != draggable;
+        }, this.drags);
+        if (this.drags.length === 0) {
+            var disc = MochiKit.Signal.disconnect;
+            disc(this.eventMouseUp);
+            disc(this.eventMouseMove);
+            disc(this.eventKeypress);
+        }
+    },
+
+    activate: function (draggable) {
+        // allows keypress events if window is not currently focused
+        // fails for Safari
+        window.focus();
+        this.activeDraggable = draggable;
+    },
+
+    deactivate: function () {
+        this.activeDraggable = null;
+    },
+
+    updateDrag: function (event) {
+        if (!this.activeDraggable) {
+            return;
+        }
+        var pointer = event.mouse();
+        // Mozilla-based browsers fire successive mousemove events with
+        // the same coordinates, prevent needless redrawing (moz bug?)
+        if (this._lastPointer && (MochiKit.Base.repr(this._lastPointer.page) ==
+                                  MochiKit.Base.repr(pointer.page))) {
+            return;
+        }
+        this._lastPointer = pointer;
+        this.activeDraggable.updateDrag(event, pointer);
+    },
+
+    endDrag: function (event) {
+        if (!this.activeDraggable) {
+            return;
+        }
+        this._lastPointer = null;
+        this.activeDraggable.endDrag(event);
+        this.activeDraggable = null;
+    },
+
+    keyPress: function (event) {
+        if (this.activeDraggable) {
+            this.activeDraggable.keyPress(event);
+        }
+    },
+
+    notify: function (eventName, draggable, event) {
+        MochiKit.Signal.signal(this, eventName, draggable, event);
+    }
+};
+
+/** @id MochiKit.DragAndDrop.Draggable */
+MochiKit.DragAndDrop.Draggable = function (element, options) {
+    var cls = arguments.callee;
+    if (!(this instanceof cls)) {
+        return new cls(element, options);
+    }
+    this.__init__(element, options);
+};
+
+MochiKit.DragAndDrop.Draggable.prototype = {
+    /***
+
+    A draggable object. Simple instantiate :
+
+        new MochiKit.DragAndDrop.Draggable('myelement');
+
+    ***/
+    __class__ : MochiKit.DragAndDrop.Draggable,
+
+    __init__: function (element, /* optional */options) {
+        var v = MochiKit.Visual;
+        var b = MochiKit.Base;
+        options = b.update({
+
+            /** @id MochiKit.DragAndDrop.handle */
+            handle: false,
+
+            /** @id MochiKit.DragAndDrop.starteffect */
+            starteffect: function (innerelement) {
+                this._savedOpacity = MochiKit.Style.getStyle(innerelement, 'opacity') || 1.0;
+                new v.Opacity(innerelement, {duration:0.2, from:this._savedOpacity, to:0.7});
+            },
+            /** @id MochiKit.DragAndDrop.reverteffect */
+            reverteffect: function (innerelement, top_offset, left_offset) {
+                var dur = Math.sqrt(Math.abs(top_offset^2) +
+                          Math.abs(left_offset^2))*0.02;
+                return new v.Move(innerelement,
+                            {x: -left_offset, y: -top_offset, duration: dur});
+            },
+
+            /** @id MochiKit.DragAndDrop.endeffect */
+            endeffect: function (innerelement) {
+                new v.Opacity(innerelement, {duration:0.2, from:0.7, to:this._savedOpacity});
+            },
+
+            /** @id MochiKit.DragAndDrop.onchange */
+            onchange: b.noop,
+
+            /** @id MochiKit.DragAndDrop.zindex */
+            zindex: 1000,
+
+            /** @id MochiKit.DragAndDrop.revert */
+            revert: false,
+
+            /** @id MochiKit.DragAndDrop.scroll */
+            scroll: false,
+
+            /** @id MochiKit.DragAndDrop.scrollSensitivity */
+            scrollSensitivity: 20,
+
+            /** @id MochiKit.DragAndDrop.scrollSpeed */
+            scrollSpeed: 15,
+            // false, or xy or [x, y] or function (x, y){return [x, y];}
+
+            /** @id MochiKit.DragAndDrop.snap */
+            snap: false
+        }, options || {});
+
+        var d = MochiKit.DOM;
+        this.element = d.getElement(element);
+
+        if (options.handle && (typeof(options.handle) == 'string')) {
+            this.handle = d.getFirstElementByTagAndClassName(null,
+                                       options.handle, this.element);
+        }
+        if (!this.handle) {
+            this.handle = d.getElement(options.handle);
+        }
+        if (!this.handle) {
+            this.handle = this.element;
+        }
+
+        if (options.scroll && !options.scroll.scrollTo && !options.scroll.outerHTML) {
+            options.scroll = d.getElement(options.scroll);
+            this._isScrollChild = MochiKit.DOM.isChildNode(this.element, options.scroll);
+        }
+
+        d.makePositioned(this.element);  // fix IE
+
+        this.delta = this.currentDelta();
+        this.options = options;
+        this.dragging = false;
+
+        this.eventMouseDown = MochiKit.Signal.connect(this.handle,
+                              'onmousedown', this, this.initDrag);
+        MochiKit.DragAndDrop.Draggables.register(this);
+    },
+
+    /** @id MochiKit.DragAndDrop.destroy */
+    destroy: function () {
+        MochiKit.Signal.disconnect(this.eventMouseDown);
+        MochiKit.DragAndDrop.Draggables.unregister(this);
+    },
+
+    /** @id MochiKit.DragAndDrop.currentDelta */
+    currentDelta: function () {
+        var s = MochiKit.Style.getStyle;
+        return [
+          parseInt(s(this.element, 'left') || '0'),
+          parseInt(s(this.element, 'top') || '0')];
+    },
+
+    /** @id MochiKit.DragAndDrop.initDrag */
+    initDrag: function (event) {
+        if (!event.mouse().button.left) {
+            return;
+        }
+        // abort on form elements, fixes a Firefox issue
+        var src = event.target();
+        var tagName = (src.tagName || '').toUpperCase();
+        if (tagName === 'INPUT' || tagName === 'SELECT' ||
+            tagName === 'OPTION' || tagName === 'BUTTON' ||
+            tagName === 'TEXTAREA') {
+            return;
+        }
+
+        if (this._revert) {
+            this._revert.cancel();
+            this._revert = null;
+        }
+
+        var pointer = event.mouse();
+        var pos = MochiKit.Position.cumulativeOffset(this.element);
+        this.offset = [pointer.page.x - pos.x, pointer.page.y - pos.y];
+
+        MochiKit.DragAndDrop.Draggables.activate(this);
+        event.stop();
+    },
+
+    /** @id MochiKit.DragAndDrop.startDrag */
+    startDrag: function (event) {
+        this.dragging = true;
+        if (this.options.selectclass) {
+            MochiKit.DOM.addElementClass(this.element,
+                                         this.options.selectclass);
+        }
+        if (this.options.zindex) {
+            this.originalZ = parseInt(MochiKit.Style.getStyle(this.element,
+                                      'z-index') || '0');
+            this.element.style.zIndex = this.options.zindex;
+        }
+
+        if (this.options.ghosting) {
+            this._clone = this.element.cloneNode(true);
+            this.ghostPosition = MochiKit.Position.absolutize(this.element);
+            this.element.parentNode.insertBefore(this._clone, this.element);
+        }
+
+        if (this.options.scroll) {
+            if (this.options.scroll == window) {
+                var where = this._getWindowScroll(this.options.scroll);
+                this.originalScrollLeft = where.left;
+                this.originalScrollTop = where.top;
+            } else {
+                this.originalScrollLeft = this.options.scroll.scrollLeft;
+                this.originalScrollTop = this.options.scroll.scrollTop;
+            }
+        }
+
+        MochiKit.DragAndDrop.Droppables.prepare(this.element);
+        MochiKit.DragAndDrop.Draggables.notify('start', this, event);
+        if (this.options.starteffect) {
+            this.options.starteffect(this.element);
+        }
+    },
+
+    /** @id MochiKit.DragAndDrop.updateDrag */
+    updateDrag: function (event, pointer) {
+        if (!this.dragging) {
+            this.startDrag(event);
+        }
+        MochiKit.Position.prepare();
+        MochiKit.DragAndDrop.Droppables.show(pointer, this.element);
+        MochiKit.DragAndDrop.Draggables.notify('drag', this, event);
+        this.draw(pointer);
+        this.options.onchange(this);
+
+        if (this.options.scroll) {
+            this.stopScrolling();
+            var p, q;
+            if (this.options.scroll == window) {
+                var s = this._getWindowScroll(this.options.scroll);
+                p = new MochiKit.Style.Coordinates(s.left, s.top);
+                q = new MochiKit.Style.Coordinates(s.left + s.width,
+                                                   s.top + s.height);
+            } else {
+                p = MochiKit.Position.page(this.options.scroll);
+                p.x += this.options.scroll.scrollLeft;
+                p.y += this.options.scroll.scrollTop;
+                p.x += (window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0);
+                p.y += (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0);
+                q = new MochiKit.Style.Coordinates(p.x + this.options.scroll.offsetWidth,
+                                                   p.y + this.options.scroll.offsetHeight);
+            }
+            var speed = [0, 0];
+            if (pointer.page.x > (q.x - this.options.scrollSensitivity)) {
+                speed[0] = pointer.page.x - (q.x - this.options.scrollSensitivity);
+            } else if (pointer.page.x < (p.x + this.options.scrollSensitivity)) {
+                speed[0] = pointer.page.x - (p.x + this.options.scrollSensitivity);
+            }
+            if (pointer.page.y > (q.y - this.options.scrollSensitivity)) {
+                speed[1] = pointer.page.y - (q.y - this.options.scrollSensitivity);
+            } else if (pointer.page.y < (p.y + this.options.scrollSensitivity)) {
+                speed[1] = pointer.page.y - (p.y + this.options.scrollSensitivity);
+            }
+            this.startScrolling(speed);
+        }
+
+        // fix AppleWebKit rendering
+        if (/AppleWebKit'/.test(navigator.appVersion)) {
+            window.scrollBy(0, 0);
+        }
+        event.stop();
+    },
+
+    /** @id MochiKit.DragAndDrop.finishDrag */
+    finishDrag: function (event, success) {
+        var dr = MochiKit.DragAndDrop;
+        this.dragging = false;
+        if (this.options.selectclass) {
+            MochiKit.DOM.removeElementClass(this.element,
+                                            this.options.selectclass);
+        }
+
+        if (this.options.ghosting) {
+            // XXX: from a user point of view, it would be better to remove
+            // the node only *after* the MochiKit.Visual.Move end when used
+            // with revert.
+            MochiKit.Position.relativize(this.element, this.ghostPosition);
+            MochiKit.DOM.removeElement(this._clone);
+            this._clone = null;
+        }
+
+        if (success) {
+            dr.Droppables.fire(event, this.element);
+        }
+        dr.Draggables.notify('end', this, event);
+
+        var revert = this.options.revert;
+        if (revert && typeof(revert) == 'function') {
+            revert = revert(this.element);
+        }
+
+        var d = this.currentDelta();
+        if (revert && this.options.reverteffect) {
+            this._revert = this.options.reverteffect(this.element,
+                d[1] - this.delta[1], d[0] - this.delta[0]);
+        } else {
+            this.delta = d;
+        }
+
+        if (this.options.zindex) {
+            this.element.style.zIndex = this.originalZ;
+        }
+
+        if (this.options.endeffect) {
+            this.options.endeffect(this.element);
+        }
+
+        dr.Draggables.deactivate();
+        dr.Droppables.reset(this.element);
+    },
+
+    /** @id MochiKit.DragAndDrop.keyPress */
+    keyPress: function (event) {
+        if (event.key().string != "KEY_ESCAPE") {
+            return;
+        }
+        this.finishDrag(event, false);
+        event.stop();
+    },
+
+    /** @id MochiKit.DragAndDrop.endDrag */
+    endDrag: function (event) {
+        if (!this.dragging) {
+            return;
+        }
+        this.stopScrolling();
+        this.finishDrag(event, true);
+        event.stop();
+    },
+
+    /** @id MochiKit.DragAndDrop.draw */
+    draw: function (point) {
+        var pos = MochiKit.Position.cumulativeOffset(this.element);
+        var d = this.currentDelta();
+        pos.x -= d[0];
+        pos.y -= d[1];
+
+        if (this.options.scroll && (this.options.scroll != window && this._isScrollChild)) {
+            pos.x -= this.options.scroll.scrollLeft - this.originalScrollLeft;
+            pos.y -= this.options.scroll.scrollTop - this.originalScrollTop;
+        }
+
+        var p = [point.page.x - pos.x - this.offset[0],
+                 point.page.y - pos.y - this.offset[1]];
+
+        if (this.options.snap) {
+            if (typeof(this.options.snap) == 'function') {
+                p = this.options.snap(p[0], p[1]);
+            } else {
+                if (this.options.snap instanceof Array) {
+                    var i = -1;
+                    p = MochiKit.Base.map(MochiKit.Base.bind(function (v) {
+                            i += 1;
+                            return Math.round(v/this.options.snap[i]) *
+                                   this.options.snap[i];
+                        }, this), p);
+                } else {
+                    p = MochiKit.Base.map(MochiKit.Base.bind(function (v) {
+                        return Math.round(v/this.options.snap) *
+                               this.options.snap;
+                        }, this), p);
+                }
+            }
+        }
+        var style = this.element.style;
+        if ((!this.options.constraint) ||
+            (this.options.constraint == 'horizontal')) {
+            style.left = p[0] + 'px';
+        }
+        if ((!this.options.constraint) ||
+            (this.options.constraint == 'vertical')) {
+            style.top = p[1] + 'px';
+        }
+        if (style.visibility == 'hidden') {
+            style.visibility = '';  // fix gecko rendering
+        }
+    },
+
+    /** @id MochiKit.DragAndDrop.stopScrolling */
+    stopScrolling: function () {
+        if (this.scrollInterval) {
+            clearInterval(this.scrollInterval);
+            this.scrollInterval = null;
+            MochiKit.DragAndDrop.Draggables._lastScrollPointer = null;
+        }
+    },
+
+    /** @id MochiKit.DragAndDrop.startScrolling */
+    startScrolling: function (speed) {
+        if (!speed[0] && !speed[1]) {
+            return;
+        }
+        this.scrollSpeed = [speed[0] * this.options.scrollSpeed,
+                            speed[1] * this.options.scrollSpeed];
+        this.lastScrolled = new Date();
+        this.scrollInterval = setInterval(MochiKit.Base.bind(this.scroll, this), 10);
+    },
+
+    /** @id MochiKit.DragAndDrop.scroll */
+    scroll: function () {
+        var current = new Date();
+        var delta = current - this.lastScrolled;
+        this.lastScrolled = current;
+
+        if (this.options.scroll == window) {
+            var s = this._getWindowScroll(this.options.scroll);
+            if (this.scrollSpeed[0] || this.scrollSpeed[1]) {
+                var dm = delta / 1000;
+                this.options.scroll.scrollTo(s.left + dm * this.scrollSpeed[0],
+                                             s.top + dm * this.scrollSpeed[1]);
+            }
+        } else {
+            this.options.scroll.scrollLeft += this.scrollSpeed[0] * delta / 1000;
+            this.options.scroll.scrollTop += this.scrollSpeed[1] * delta / 1000;
+        }
+
+        var d = MochiKit.DragAndDrop;
+
+        MochiKit.Position.prepare();
+        d.Droppables.show(d.Draggables._lastPointer, this.element);
+        d.Draggables.notify('drag', this);
+        if (this._isScrollChild) {
+            d.Draggables._lastScrollPointer = d.Draggables._lastScrollPointer || d.Draggables._lastPointer;
+            d.Draggables._lastScrollPointer.x += this.scrollSpeed[0] * delta / 1000;
+            d.Draggables._lastScrollPointer.y += this.scrollSpeed[1] * delta / 1000;
+            if (d.Draggables._lastScrollPointer.x < 0) {
+                d.Draggables._lastScrollPointer.x = 0;
+            }
+            if (d.Draggables._lastScrollPointer.y < 0) {
+                d.Draggables._lastScrollPointer.y = 0;
+            }
+            this.draw(d.Draggables._lastScrollPointer);
+        }
+
+        this.options.onchange(this);
+    },
+
+    _getWindowScroll: function (win) {
+        var vp, w, h;
+        MochiKit.DOM.withWindow(win, function () {
+            vp = MochiKit.Style.getViewportPosition(win.document);
+        });
+        if (win.innerWidth) {
+            w = win.innerWidth;
+            h = win.innerHeight;
+        } else if (win.document.documentElement && win.document.documentElement.clientWidth) {
+            w = win.document.documentElement.clientWidth;
+            h = win.document.documentElement.clientHeight;
+        } else {
+            w = win.document.body.offsetWidth;
+            h = win.document.body.offsetHeight;
+        }
+        return {top: vp.x, left: vp.y, width: w, height: h};
+    },
+
+    /** @id MochiKit.DragAndDrop.repr */
+    repr: function () {
+        return '[' + this.__class__.NAME + ", options:" + MochiKit.Base.repr(this.options) + "]";
+    }
+};
+
+MochiKit.DragAndDrop.__new__ = function () {
+    MochiKit.Base.nameFunctions(this);
+
+    this.EXPORT_TAGS = {
+        ":common": this.EXPORT,
+        ":all": MochiKit.Base.concat(this.EXPORT, this.EXPORT_OK)
+    };
+};
+
+MochiKit.DragAndDrop.__new__();
+
+MochiKit.Base._exportSymbols(this, MochiKit.DragAndDrop);
+
diff --git a/frontend/beta/js/MochiKit/Format.js b/frontend/beta/js/MochiKit/Format.js
new file mode 100644
index 0000000..937b681
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Format.js
@@ -0,0 +1,304 @@
+/***
+
+MochiKit.Format 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Format');
+}
+
+if (typeof(MochiKit) == 'undefined') {
+    MochiKit = {};
+}
+
+if (typeof(MochiKit.Format) == 'undefined') {
+    MochiKit.Format = {};
+}
+
+MochiKit.Format.NAME = "MochiKit.Format";
+MochiKit.Format.VERSION = "1.4";
+MochiKit.Format.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+MochiKit.Format.toString = function () {
+    return this.__repr__();
+};
+
+MochiKit.Format._numberFormatter = function (placeholder, header, footer, locale, isPercent, precision, leadingZeros, separatorAt, trailingZeros) {
+    return function (num) {
+        num = parseFloat(num);
+        if (typeof(num) == "undefined" || num === null || isNaN(num)) {
+            return placeholder;
+        }
+        var curheader = header;
+        var curfooter = footer;
+        if (num < 0) {
+            num = -num;
+        } else {
+            curheader = curheader.replace(/-/, "");
+        }
+        var me = arguments.callee;
+        var fmt = MochiKit.Format.formatLocale(locale);
+        if (isPercent) {
+            num = num * 100.0;
+            curfooter = fmt.percent + curfooter;
+        }
+        num = MochiKit.Format.roundToFixed(num, precision);
+        var parts = num.split(/\./);
+        var whole = parts[0];
+        var frac = (parts.length == 1) ? "" : parts[1];
+        var res = "";
+        while (whole.length < leadingZeros) {
+            whole = "0" + whole;
+        }
+        if (separatorAt) {
+            while (whole.length > separatorAt) {
+                var i = whole.length - separatorAt;
+                //res = res + fmt.separator + whole.substring(i, whole.length);
+                res = fmt.separator + whole.substring(i, whole.length) + res;
+                whole = whole.substring(0, i);
+            }
+        }
+        res = whole + res;
+        if (precision > 0) {
+            while (frac.length < trailingZeros) {
+                frac = frac + "0";
+            }
+            res = res + fmt.decimal + frac;
+        }
+        return curheader + res + curfooter;
+    };
+};
+
+/** @id MochiKit.Format.numberFormatter */
+MochiKit.Format.numberFormatter = function (pattern, placeholder/* = "" */, locale/* = "default" */) {
+    // http://java.sun.com/docs/books/tutorial/i18n/format/numberpattern.html
+    // | 0 | leading or trailing zeros
+    // | # | just the number
+    // | , | separator
+    // | . | decimal separator
+    // | % | Multiply by 100 and format as percent
+    if (typeof(placeholder) == "undefined") {
+        placeholder = "";
+    }
+    var match = pattern.match(/((?:[0#]+,)?[0#]+)(?:\.([0#]+))?(%)?/);
+    if (!match) {
+        throw TypeError("Invalid pattern");
+    }
+    var header = pattern.substr(0, match.index);
+    var footer = pattern.substr(match.index + match[0].length);
+    if (header.search(/-/) == -1) {
+        header = header + "-";
+    }
+    var whole = match[1];
+    var frac = (typeof(match[2]) == "string" && match[2] != "") ? match[2] : "";
+    var isPercent = (typeof(match[3]) == "string" && match[3] != "");
+    var tmp = whole.split(/,/);
+    var separatorAt;
+    if (typeof(locale) == "undefined") {
+        locale = "default";
+    }
+    if (tmp.length == 1) {
+        separatorAt = null;
+    } else {
+        separatorAt = tmp[1].length;
+    }
+    var leadingZeros = whole.length - whole.replace(/0/g, "").length;
+    var trailingZeros = frac.length - frac.replace(/0/g, "").length;
+    var precision = frac.length;
+    var rval = MochiKit.Format._numberFormatter(
+        placeholder, header, footer, locale, isPercent, precision,
+        leadingZeros, separatorAt, trailingZeros
+    );
+    var m = MochiKit.Base;
+    if (m) {
+        var fn = arguments.callee;
+        var args = m.concat(arguments);
+        rval.repr = function () {
+            return [
+                self.NAME,
+                "(",
+                map(m.repr, args).join(", "),
+                ")"
+            ].join("");
+        };
+    }
+    return rval;
+};
+
+/** @id MochiKit.Format.formatLocale */
+MochiKit.Format.formatLocale = function (locale) {
+    if (typeof(locale) == "undefined" || locale === null) {
+        locale = "default";
+    }
+    if (typeof(locale) == "string") {
+        var rval = MochiKit.Format.LOCALE[locale];
+        if (typeof(rval) == "string") {
+            rval = arguments.callee(rval);
+            MochiKit.Format.LOCALE[locale] = rval;
+        }
+        return rval;
+    } else {
+        return locale;
+    }
+};
+
+/** @id MochiKit.Format.twoDigitAverage */
+MochiKit.Format.twoDigitAverage = function (numerator, denominator) {
+    if (denominator) {
+        var res = numerator / denominator;
+        if (!isNaN(res)) {
+            return MochiKit.Format.twoDigitFloat(numerator / denominator);
+        }
+    }
+    return "0";
+};
+
+/** @id MochiKit.Format.twoDigitFloat */
+MochiKit.Format.twoDigitFloat = function (someFloat) {
+    var sign = (someFloat < 0 ? '-' : '');
+    var s = Math.floor(Math.abs(someFloat) * 100).toString();
+    if (s == '0') {
+        return s;
+    }
+    if (s.length < 3) {
+        while (s.charAt(s.length - 1) == '0') {
+            s = s.substring(0, s.length - 1);
+        }
+        return sign + '0.' + s;
+    }
+    var head = sign + s.substring(0, s.length - 2);
+    var tail = s.substring(s.length - 2, s.length);
+    if (tail == '00') {
+        return head;
+    } else if (tail.charAt(1) == '0') {
+        return head + '.' + tail.charAt(0);
+    } else {
+        return head + '.' + tail;
+    }
+};
+
+/** @id MochiKit.Format.lstrip */
+MochiKit.Format.lstrip = function (str, /* optional */chars) {
+    str = str + "";
+    if (typeof(str) != "string") {
+        return null;
+    }
+    if (!chars) {
+        return str.replace(/^\s+/, "");
+    } else {
+        return str.replace(new RegExp("^[" + chars + "]+"), "");
+    }
+};
+
+/** @id MochiKit.Format.rstrip */
+MochiKit.Format.rstrip = function (str, /* optional */chars) {
+    str = str + "";
+    if (typeof(str) != "string") {
+        return null;
+    }
+    if (!chars) {
+        return str.replace(/\s+$/, "");
+    } else {
+        return str.replace(new RegExp("[" + chars + "]+$"), "");
+    }
+};
+
+/** @id MochiKit.Format.strip */
+MochiKit.Format.strip = function (str, /* optional */chars) {
+    var self = MochiKit.Format;
+    return self.rstrip(self.lstrip(str, chars), chars);
+};
+
+/** @id MochiKit.Format.truncToFixed */
+MochiKit.Format.truncToFixed = function (aNumber, precision) {
+    aNumber = Math.floor(aNumber * Math.pow(10, precision));
+    var res = (aNumber * Math.pow(10, -precision)).toFixed(precision);
+    if (res.charAt(0) == ".") {
+        res = "0" + res;
+    }
+    return res;
+};
+
+/** @id MochiKit.Format.roundToFixed */
+MochiKit.Format.roundToFixed = function (aNumber, precision) {
+    return MochiKit.Format.truncToFixed(
+        aNumber + 0.5 * Math.pow(10, -precision),
+        precision
+    );
+};
+
+/** @id MochiKit.Format.percentFormat */
+MochiKit.Format.percentFormat = function (someFloat) {
+    return MochiKit.Format.twoDigitFloat(100 * someFloat) + '%';
+};
+
+MochiKit.Format.EXPORT = [
+    "truncToFixed",
+    "roundToFixed",
+    "numberFormatter",
+    "formatLocale",
+    "twoDigitAverage",
+    "twoDigitFloat",
+    "percentFormat",
+    "lstrip",
+    "rstrip",
+    "strip"
+];
+
+MochiKit.Format.LOCALE = {
+    en_US: {separator: ",", decimal: ".", percent: "%"},
+    de_DE: {separator: ".", decimal: ",", percent: "%"},
+    fr_FR: {separator: " ", decimal: ",", percent: "%"},
+    "default": "en_US"
+};
+
+MochiKit.Format.EXPORT_OK = [];
+MochiKit.Format.EXPORT_TAGS = {
+    ':all': MochiKit.Format.EXPORT,
+    ':common': MochiKit.Format.EXPORT
+};
+
+MochiKit.Format.__new__ = function () {
+    // MochiKit.Base.nameFunctions(this);
+    var base = this.NAME + ".";
+    var k, v, o;
+    for (k in this.LOCALE) {
+        o = this.LOCALE[k];
+        if (typeof(o) == "object") {
+            o.repr = function () { return this.NAME; };
+            o.NAME = base + "LOCALE." + k;
+        }
+    }
+    for (k in this) {
+        o = this[k];
+        if (typeof(o) == 'function' && typeof(o.NAME) == 'undefined') {
+            try {
+                o.NAME = base + k;
+            } catch (e) {
+                // pass
+            }
+        }
+    }
+};
+
+MochiKit.Format.__new__();
+
+if (typeof(MochiKit.Base) != "undefined") {
+    MochiKit.Base._exportSymbols(this, MochiKit.Format);
+} else {
+    (function (globals, module) {
+        if ((typeof(JSAN) == 'undefined' && typeof(dojo) == 'undefined')
+            || (MochiKit.__export__ === false)) {
+            var all = module.EXPORT_TAGS[":all"];
+            for (var i = 0; i < all.length; i++) {
+                globals[all[i]] = module[all[i]];
+            }
+        }
+    })(this, MochiKit.Format);
+}
diff --git a/frontend/beta/js/MochiKit/Iter.js b/frontend/beta/js/MochiKit/Iter.js
new file mode 100644
index 0000000..1d008e2
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Iter.js
@@ -0,0 +1,843 @@
+/***
+
+MochiKit.Iter 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Iter');
+    dojo.require('MochiKit.Base');
+}
+
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Base", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.Iter depends on MochiKit.Base!";
+}
+
+if (typeof(MochiKit.Iter) == 'undefined') {
+    MochiKit.Iter = {};
+}
+
+MochiKit.Iter.NAME = "MochiKit.Iter";
+MochiKit.Iter.VERSION = "1.4";
+MochiKit.Base.update(MochiKit.Iter, {
+    __repr__: function () {
+        return "[" + this.NAME + " " + this.VERSION + "]";
+    },
+    toString: function () {
+        return this.__repr__();
+    },
+
+    /** @id MochiKit.Iter.registerIteratorFactory  */
+    registerIteratorFactory: function (name, check, iterfactory, /* optional */ override) {
+        MochiKit.Iter.iteratorRegistry.register(name, check, iterfactory, override);
+    },
+
+    /** @id MochiKit.Iter.iter */
+    iter: function (iterable, /* optional */ sentinel) {
+        var self = MochiKit.Iter;
+        if (arguments.length == 2) {
+            return self.takewhile(
+                function (a) { return a != sentinel; },
+                iterable
+            );
+        }
+        if (typeof(iterable.next) == 'function') {
+            return iterable;
+        } else if (typeof(iterable.iter) == 'function') {
+            return iterable.iter();
+        /*
+        }  else if (typeof(iterable.__iterator__) == 'function') {
+            //
+            // XXX: We can't support JavaScript 1.7 __iterator__ directly
+            //      because of Object.prototype.__iterator__
+            //
+            return iterable.__iterator__();
+        */
+        }
+
+        try {
+            return self.iteratorRegistry.match(iterable);
+        } catch (e) {
+            var m = MochiKit.Base;
+            if (e == m.NotFound) {
+                e = new TypeError(typeof(iterable) + ": " + m.repr(iterable) + " is not iterable");
+            }
+            throw e;
+        }
+    },
+
+    /** @id MochiKit.Iter.count */
+    count: function (n) {
+        if (!n) {
+            n = 0;
+        }
+        var m = MochiKit.Base;
+        return {
+            repr: function () { return "count(" + n + ")"; },
+            toString: m.forwardCall("repr"),
+            next: m.counter(n)
+        };
+    },
+
+    /** @id MochiKit.Iter.cycle */
+    cycle: function (p) {
+        var self = MochiKit.Iter;
+        var m = MochiKit.Base;
+        var lst = [];
+        var iterator = self.iter(p);
+        return {
+            repr: function () { return "cycle(...)"; },
+            toString: m.forwardCall("repr"),
+            next: function () {
+                try {
+                    var rval = iterator.next();
+                    lst.push(rval);
+                    return rval;
+                } catch (e) {
+                    if (e != self.StopIteration) {
+                        throw e;
+                    }
+                    if (lst.length === 0) {
+                        this.next = function () {
+                            throw self.StopIteration;
+                        };
+                    } else {
+                        var i = -1;
+                        this.next = function () {
+                            i = (i + 1) % lst.length;
+                            return lst[i];
+                        };
+                    }
+                    return this.next();
+                }
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.repeat */
+    repeat: function (elem, /* optional */n) {
+        var m = MochiKit.Base;
+        if (typeof(n) == 'undefined') {
+            return {
+                repr: function () {
+                    return "repeat(" + m.repr(elem) + ")";
+                },
+                toString: m.forwardCall("repr"),
+                next: function () {
+                    return elem;
+                }
+            };
+        }
+        return {
+            repr: function () {
+                return "repeat(" + m.repr(elem) + ", " + n + ")";
+            },
+            toString: m.forwardCall("repr"),
+            next: function () {
+                if (n <= 0) {
+                    throw MochiKit.Iter.StopIteration;
+                }
+                n -= 1;
+                return elem;
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.next */
+    next: function (iterator) {
+        return iterator.next();
+    },
+
+    /** @id MochiKit.Iter.izip */
+    izip: function (p, q/*, ...*/) {
+        var m = MochiKit.Base;
+        var self = MochiKit.Iter;
+        var next = self.next;
+        var iterables = m.map(self.iter, arguments);
+        return {
+            repr: function () { return "izip(...)"; },
+            toString: m.forwardCall("repr"),
+            next: function () { return m.map(next, iterables); }
+        };
+    },
+
+    /** @id MochiKit.Iter.ifilter */
+    ifilter: function (pred, seq) {
+        var m = MochiKit.Base;
+        seq = MochiKit.Iter.iter(seq);
+        if (pred === null) {
+            pred = m.operator.truth;
+        }
+        return {
+            repr: function () { return "ifilter(...)"; },
+            toString: m.forwardCall("repr"),
+            next: function () {
+                while (true) {
+                    var rval = seq.next();
+                    if (pred(rval)) {
+                        return rval;
+                    }
+                }
+                // mozilla warnings aren't too bright
+                return undefined;
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.ifilterfalse */
+    ifilterfalse: function (pred, seq) {
+        var m = MochiKit.Base;
+        seq = MochiKit.Iter.iter(seq);
+        if (pred === null) {
+            pred = m.operator.truth;
+        }
+        return {
+            repr: function () { return "ifilterfalse(...)"; },
+            toString: m.forwardCall("repr"),
+            next: function () {
+                while (true) {
+                    var rval = seq.next();
+                    if (!pred(rval)) {
+                        return rval;
+                    }
+                }
+                // mozilla warnings aren't too bright
+                return undefined;
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.islice */
+    islice: function (seq/*, [start,] stop[, step] */) {
+        var self = MochiKit.Iter;
+        var m = MochiKit.Base;
+        seq = self.iter(seq);
+        var start = 0;
+        var stop = 0;
+        var step = 1;
+        var i = -1;
+        if (arguments.length == 2) {
+            stop = arguments[1];
+        } else if (arguments.length == 3) {
+            start = arguments[1];
+            stop = arguments[2];
+        } else {
+            start = arguments[1];
+            stop = arguments[2];
+            step = arguments[3];
+        }
+        return {
+            repr: function () {
+                return "islice(" + ["...", start, stop, step].join(", ") + ")";
+            },
+            toString: m.forwardCall("repr"),
+            next: function () {
+                var rval;
+                while (i < start) {
+                    rval = seq.next();
+                    i++;
+                }
+                if (start >= stop) {
+                    throw self.StopIteration;
+                }
+                start += step;
+                return rval;
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.imap */
+    imap: function (fun, p, q/*, ...*/) {
+        var m = MochiKit.Base;
+        var self = MochiKit.Iter;
+        var iterables = m.map(self.iter, m.extend(null, arguments, 1));
+        var map = m.map;
+        var next = self.next;
+        return {
+            repr: function () { return "imap(...)"; },
+            toString: m.forwardCall("repr"),
+            next: function () {
+                return fun.apply(this, map(next, iterables));
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.applymap */
+    applymap: function (fun, seq, self) {
+        seq = MochiKit.Iter.iter(seq);
+        var m = MochiKit.Base;
+        return {
+            repr: function () { return "applymap(...)"; },
+            toString: m.forwardCall("repr"),
+            next: function () {
+                return fun.apply(self, seq.next());
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.chain */
+    chain: function (p, q/*, ...*/) {
+        // dumb fast path
+        var self = MochiKit.Iter;
+        var m = MochiKit.Base;
+        if (arguments.length == 1) {
+            return self.iter(arguments[0]);
+        }
+        var argiter = m.map(self.iter, arguments);
+        return {
+            repr: function () { return "chain(...)"; },
+            toString: m.forwardCall("repr"),
+            next: function () {
+                while (argiter.length > 1) {
+                    try {
+                        return argiter[0].next();
+                    } catch (e) {
+                        if (e != self.StopIteration) {
+                            throw e;
+                        }
+                        argiter.shift();
+                    }
+                }
+                if (argiter.length == 1) {
+                    // optimize last element
+                    var arg = argiter.shift();
+                    this.next = m.bind("next", arg);
+                    return this.next();
+                }
+                throw self.StopIteration;
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.takewhile */
+    takewhile: function (pred, seq) {
+        var self = MochiKit.Iter;
+        seq = self.iter(seq);
+        return {
+            repr: function () { return "takewhile(...)"; },
+            toString: MochiKit.Base.forwardCall("repr"),
+            next: function () {
+                var rval = seq.next();
+                if (!pred(rval)) {
+                    this.next = function () {
+                        throw self.StopIteration;
+                    };
+                    this.next();
+                }
+                return rval;
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.dropwhile */
+    dropwhile: function (pred, seq) {
+        seq = MochiKit.Iter.iter(seq);
+        var m = MochiKit.Base;
+        var bind = m.bind;
+        return {
+            "repr": function () { return "dropwhile(...)"; },
+            "toString": m.forwardCall("repr"),
+            "next": function () {
+                while (true) {
+                    var rval = seq.next();
+                    if (!pred(rval)) {
+                        break;
+                    }
+                }
+                this.next = bind("next", seq);
+                return rval;
+            }
+        };
+    },
+
+    _tee: function (ident, sync, iterable) {
+        sync.pos[ident] = -1;
+        var m = MochiKit.Base;
+        var listMin = m.listMin;
+        return {
+            repr: function () { return "tee(" + ident + ", ...)"; },
+            toString: m.forwardCall("repr"),
+            next: function () {
+                var rval;
+                var i = sync.pos[ident];
+
+                if (i == sync.max) {
+                    rval = iterable.next();
+                    sync.deque.push(rval);
+                    sync.max += 1;
+                    sync.pos[ident] += 1;
+                } else {
+                    rval = sync.deque[i - sync.min];
+                    sync.pos[ident] += 1;
+                    if (i == sync.min && listMin(sync.pos) != sync.min) {
+                        sync.min += 1;
+                        sync.deque.shift();
+                    }
+                }
+                return rval;
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.tee */
+    tee: function (iterable, n/* = 2 */) {
+        var rval = [];
+        var sync = {
+            "pos": [],
+            "deque": [],
+            "max": -1,
+            "min": -1
+        };
+        if (arguments.length == 1 || typeof(n) == "undefined" || n === null) {
+            n = 2;
+        }
+        var self = MochiKit.Iter;
+        iterable = self.iter(iterable);
+        var _tee = self._tee;
+        for (var i = 0; i < n; i++) {
+            rval.push(_tee(i, sync, iterable));
+        }
+        return rval;
+    },
+
+    /** @id MochiKit.Iter.list */
+    list: function (iterable) {
+        // Fast-path for Array and Array-like
+        var m = MochiKit.Base;
+        if (typeof(iterable.slice) == 'function') {
+            return iterable.slice();
+        } else if (m.isArrayLike(iterable)) {
+            return m.concat(iterable);
+        }
+
+        var self = MochiKit.Iter;
+        iterable = self.iter(iterable);
+        var rval = [];
+        try {
+            while (true) {
+                rval.push(iterable.next());
+            }
+        } catch (e) {
+            if (e != self.StopIteration) {
+                throw e;
+            }
+            return rval;
+        }
+        // mozilla warnings aren't too bright
+        return undefined;
+    },
+
+
+    /** @id MochiKit.Iter.reduce */
+    reduce: function (fn, iterable, /* optional */initial) {
+        var i = 0;
+        var x = initial;
+        var self = MochiKit.Iter;
+        iterable = self.iter(iterable);
+        if (arguments.length < 3) {
+            try {
+                x = iterable.next();
+            } catch (e) {
+                if (e == self.StopIteration) {
+                    e = new TypeError("reduce() of empty sequence with no initial value");
+                }
+                throw e;
+            }
+            i++;
+        }
+        try {
+            while (true) {
+                x = fn(x, iterable.next());
+            }
+        } catch (e) {
+            if (e != self.StopIteration) {
+                throw e;
+            }
+        }
+        return x;
+    },
+
+    /** @id MochiKit.Iter.range */
+    range: function (/* [start,] stop[, step] */) {
+        var start = 0;
+        var stop = 0;
+        var step = 1;
+        if (arguments.length == 1) {
+            stop = arguments[0];
+        } else if (arguments.length == 2) {
+            start = arguments[0];
+            stop = arguments[1];
+        } else if (arguments.length == 3) {
+            start = arguments[0];
+            stop = arguments[1];
+            step = arguments[2];
+        } else {
+            throw new TypeError("range() takes 1, 2, or 3 arguments!");
+        }
+        if (step === 0) {
+            throw new TypeError("range() step must not be 0");
+        }
+        return {
+            next: function () {
+                if ((step > 0 && start >= stop) || (step < 0 && start <= stop)) {
+                    throw MochiKit.Iter.StopIteration;
+                }
+                var rval = start;
+                start += step;
+                return rval;
+            },
+            repr: function () {
+                return "range(" + [start, stop, step].join(", ") + ")";
+            },
+            toString: MochiKit.Base.forwardCall("repr")
+        };
+    },
+
+    /** @id MochiKit.Iter.sum */
+    sum: function (iterable, start/* = 0 */) {
+        if (typeof(start) == "undefined" || start === null) {
+            start = 0;
+        }
+        var x = start;
+        var self = MochiKit.Iter;
+        iterable = self.iter(iterable);
+        try {
+            while (true) {
+                x += iterable.next();
+            }
+        } catch (e) {
+            if (e != self.StopIteration) {
+                throw e;
+            }
+        }
+        return x;
+    },
+
+    /** @id MochiKit.Iter.exhaust */
+    exhaust: function (iterable) {
+        var self = MochiKit.Iter;
+        iterable = self.iter(iterable);
+        try {
+            while (true) {
+                iterable.next();
+            }
+        } catch (e) {
+            if (e != self.StopIteration) {
+                throw e;
+            }
+        }
+    },
+
+    /** @id MochiKit.Iter.forEach */
+    forEach: function (iterable, func, /* optional */self) {
+        var m = MochiKit.Base;
+        if (arguments.length > 2) {
+            func = m.bind(func, self);
+        }
+        // fast path for array
+        if (m.isArrayLike(iterable)) {
+            try {
+                for (var i = 0; i < iterable.length; i++) {
+                    func(iterable[i]);
+                }
+            } catch (e) {
+                if (e != MochiKit.Iter.StopIteration) {
+                    throw e;
+                }
+            }
+        } else {
+            self = MochiKit.Iter;
+            self.exhaust(self.imap(func, iterable));
+        }
+    },
+
+    /** @id MochiKit.Iter.every */
+    every: function (iterable, func) {
+        var self = MochiKit.Iter;
+        try {
+            self.ifilterfalse(func, iterable).next();
+            return false;
+        } catch (e) {
+            if (e != self.StopIteration) {
+                throw e;
+            }
+            return true;
+        }
+    },
+
+    /** @id MochiKit.Iter.sorted */
+    sorted: function (iterable, /* optional */cmp) {
+        var rval = MochiKit.Iter.list(iterable);
+        if (arguments.length == 1) {
+            cmp = MochiKit.Base.compare;
+        }
+        rval.sort(cmp);
+        return rval;
+    },
+
+    /** @id MochiKit.Iter.reversed */
+    reversed: function (iterable) {
+        var rval = MochiKit.Iter.list(iterable);
+        rval.reverse();
+        return rval;
+    },
+
+    /** @id MochiKit.Iter.some */
+    some: function (iterable, func) {
+        var self = MochiKit.Iter;
+        try {
+            self.ifilter(func, iterable).next();
+            return true;
+        } catch (e) {
+            if (e != self.StopIteration) {
+                throw e;
+            }
+            return false;
+        }
+    },
+
+    /** @id MochiKit.Iter.iextend */
+    iextend: function (lst, iterable) {
+        if (MochiKit.Base.isArrayLike(iterable)) {
+            // fast-path for array-like
+            for (var i = 0; i < iterable.length; i++) {
+                lst.push(iterable[i]);
+            }
+        } else {
+            var self = MochiKit.Iter;
+            iterable = self.iter(iterable);
+            try {
+                while (true) {
+                    lst.push(iterable.next());
+                }
+            } catch (e) {
+                if (e != self.StopIteration) {
+                    throw e;
+                }
+            }
+        }
+        return lst;
+    },
+
+    /** @id MochiKit.Iter.groupby */
+    groupby: function(iterable, /* optional */ keyfunc) {
+        var m = MochiKit.Base;
+        var self = MochiKit.Iter;
+        if (arguments.length < 2) {
+            keyfunc = m.operator.identity;
+        }
+        iterable = self.iter(iterable);
+
+        // shared
+        var pk = undefined;
+        var k = undefined;
+        var v;
+
+        function fetch() {
+            v = iterable.next();
+            k = keyfunc(v);
+        };
+
+        function eat() {
+            var ret = v;
+            v = undefined;
+            return ret;
+        };
+
+        var first = true;
+        var compare = m.compare;
+        return {
+            repr: function () { return "groupby(...)"; },
+            next: function() {
+                // iterator-next
+
+                // iterate until meet next group
+                while (compare(k, pk) === 0) {
+                    fetch();
+                    if (first) {
+                        first = false;
+                        break;
+                    }
+                }
+                pk = k;
+                return [k, {
+                    next: function() {
+                        // subiterator-next
+                        if (v == undefined) { // Is there something to eat?
+                            fetch();
+                        }
+                        if (compare(k, pk) !== 0) {
+                            throw self.StopIteration;
+                        }
+                        return eat();
+                    }
+                }];
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.groupby_as_array */
+    groupby_as_array: function (iterable, /* optional */ keyfunc) {
+        var m = MochiKit.Base;
+        var self = MochiKit.Iter;
+        if (arguments.length < 2) {
+            keyfunc = m.operator.identity;
+        }
+
+        iterable = self.iter(iterable);
+        var result = [];
+        var first = true;
+        var prev_key;
+        var compare = m.compare;
+        while (true) {
+            try {
+                var value = iterable.next();
+                var key = keyfunc(value);
+            } catch (e) {
+                if (e == self.StopIteration) {
+                    break;
+                }
+                throw e;
+            }
+            if (first || compare(key, prev_key) !== 0) {
+                var values = [];
+                result.push([key, values]);
+            }
+            values.push(value);
+            first = false;
+            prev_key = key;
+        }
+        return result;
+    },
+
+    /** @id MochiKit.Iter.arrayLikeIter */
+    arrayLikeIter: function (iterable) {
+        var i = 0;
+        return {
+            repr: function () { return "arrayLikeIter(...)"; },
+            toString: MochiKit.Base.forwardCall("repr"),
+            next: function () {
+                if (i >= iterable.length) {
+                    throw MochiKit.Iter.StopIteration;
+                }
+                return iterable[i++];
+            }
+        };
+    },
+
+    /** @id MochiKit.Iter.hasIterateNext */
+    hasIterateNext: function (iterable) {
+        return (iterable && typeof(iterable.iterateNext) == "function");
+    },
+
+    /** @id MochiKit.Iter.iterateNextIter */
+    iterateNextIter: function (iterable) {
+        return {
+            repr: function () { return "iterateNextIter(...)"; },
+            toString: MochiKit.Base.forwardCall("repr"),
+            next: function () {
+                var rval = iterable.iterateNext();
+                if (rval === null || rval === undefined) {
+                    throw MochiKit.Iter.StopIteration;
+                }
+                return rval;
+            }
+        };
+    }
+});
+
+
+MochiKit.Iter.EXPORT_OK = [
+    "iteratorRegistry",
+    "arrayLikeIter",
+    "hasIterateNext",
+    "iterateNextIter",
+];
+
+MochiKit.Iter.EXPORT = [
+    "StopIteration",
+    "registerIteratorFactory",
+    "iter",
+    "count",
+    "cycle",
+    "repeat",
+    "next",
+    "izip",
+    "ifilter",
+    "ifilterfalse",
+    "islice",
+    "imap",
+    "applymap",
+    "chain",
+    "takewhile",
+    "dropwhile",
+    "tee",
+    "list",
+    "reduce",
+    "range",
+    "sum",
+    "exhaust",
+    "forEach",
+    "every",
+    "sorted",
+    "reversed",
+    "some",
+    "iextend",
+    "groupby",
+    "groupby_as_array"
+];
+
+MochiKit.Iter.__new__ = function () {
+    var m = MochiKit.Base;
+    // Re-use StopIteration if exists (e.g. SpiderMonkey)
+    if (typeof(StopIteration) != "undefined") {
+        this.StopIteration = StopIteration;
+    } else {
+        /** @id MochiKit.Iter.StopIteration */
+        this.StopIteration = new m.NamedError("StopIteration");
+    }
+    this.iteratorRegistry = new m.AdapterRegistry();
+    // Register the iterator factory for arrays
+    this.registerIteratorFactory(
+        "arrayLike",
+        m.isArrayLike,
+        this.arrayLikeIter
+    );
+
+    this.registerIteratorFactory(
+        "iterateNext",
+        this.hasIterateNext,
+        this.iterateNextIter
+    );
+
+    this.EXPORT_TAGS = {
+        ":common": this.EXPORT,
+        ":all": m.concat(this.EXPORT, this.EXPORT_OK)
+    };
+
+    m.nameFunctions(this);
+
+};
+
+MochiKit.Iter.__new__();
+
+//
+// XXX: Internet Explorer blows
+//
+if (MochiKit.__export__) {
+    reduce = MochiKit.Iter.reduce;
+}
+
+MochiKit.Base._exportSymbols(this, MochiKit.Iter);
diff --git a/frontend/beta/js/MochiKit/Logging.js b/frontend/beta/js/MochiKit/Logging.js
new file mode 100644
index 0000000..4d25c3e
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Logging.js
@@ -0,0 +1,321 @@
+/***
+
+MochiKit.Logging 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Logging');
+    dojo.require('MochiKit.Base');
+}
+
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Base", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.Logging depends on MochiKit.Base!";
+}
+
+if (typeof(MochiKit.Logging) == 'undefined') {
+    MochiKit.Logging = {};
+}
+
+MochiKit.Logging.NAME = "MochiKit.Logging";
+MochiKit.Logging.VERSION = "1.4";
+MochiKit.Logging.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+
+MochiKit.Logging.toString = function () {
+    return this.__repr__();
+};
+
+
+MochiKit.Logging.EXPORT = [
+    "LogLevel",
+    "LogMessage",
+    "Logger",
+    "alertListener",
+    "logger",
+    "log",
+    "logError",
+    "logDebug",
+    "logFatal",
+    "logWarning"
+];
+
+
+MochiKit.Logging.EXPORT_OK = [
+    "logLevelAtLeast",
+    "isLogMessage",
+    "compareLogMessage"
+];
+
+
+/** @id MochiKit.Logging.LogMessage */
+MochiKit.Logging.LogMessage = function (num, level, info) {
+    this.num = num;
+    this.level = level;
+    this.info = info;
+    this.timestamp = new Date();
+};
+
+MochiKit.Logging.LogMessage.prototype = {
+     /** @id MochiKit.Logging.LogMessage.prototype.repr */
+    repr: function () {
+        var m = MochiKit.Base;
+        return 'LogMessage(' +
+            m.map(
+                m.repr,
+                [this.num, this.level, this.info]
+            ).join(', ') + ')';
+    },
+    /** @id MochiKit.Logging.LogMessage.prototype.toString */
+    toString: MochiKit.Base.forwardCall("repr")
+};
+
+MochiKit.Base.update(MochiKit.Logging, {
+    /** @id MochiKit.Logging.logLevelAtLeast */
+    logLevelAtLeast: function (minLevel) {
+        var self = MochiKit.Logging;
+        if (typeof(minLevel) == 'string') {
+            minLevel = self.LogLevel[minLevel];
+        }
+        return function (msg) {
+            var msgLevel = msg.level;
+            if (typeof(msgLevel) == 'string') {
+                msgLevel = self.LogLevel[msgLevel];
+            }
+            return msgLevel >= minLevel;
+        };
+    },
+
+    /** @id MochiKit.Logging.isLogMessage */
+    isLogMessage: function (/* ... */) {
+        var LogMessage = MochiKit.Logging.LogMessage;
+        for (var i = 0; i < arguments.length; i++) {
+            if (!(arguments[i] instanceof LogMessage)) {
+                return false;
+            }
+        }
+        return true;
+    },
+
+    /** @id MochiKit.Logging.compareLogMessage */
+    compareLogMessage: function (a, b) {
+        return MochiKit.Base.compare([a.level, a.info], [b.level, b.info]);
+    },
+
+    /** @id MochiKit.Logging.alertListener */
+    alertListener: function (msg) {
+        alert(
+            "num: " + msg.num +
+            "\nlevel: " +  msg.level +
+            "\ninfo: " + msg.info.join(" ")
+        );
+    }
+
+});
+
+/** @id MochiKit.Logging.Logger */
+MochiKit.Logging.Logger = function (/* optional */maxSize) {
+    this.counter = 0;
+    if (typeof(maxSize) == 'undefined' || maxSize === null) {
+        maxSize = -1;
+    }
+    this.maxSize = maxSize;
+    this._messages = [];
+    this.listeners = {};
+    this.useNativeConsole = false;
+};
+
+MochiKit.Logging.Logger.prototype = {
+    /** @id MochiKit.Logging.Logger.prototype.clear */
+    clear: function () {
+        this._messages.splice(0, this._messages.length);
+    },
+
+    /** @id MochiKit.Logging.Logger.prototype.logToConsole */
+    logToConsole: function (msg) {
+        if (typeof(window) != "undefined" && window.console
+                && window.console.log) {
+            // Safari and FireBug 0.4
+            // Percent replacement is a workaround for cute Safari crashing bug
+            window.console.log(msg.replace(/%/g, '\uFF05'));
+        } else if (typeof(opera) != "undefined" && opera.postError) {
+            // Opera
+            opera.postError(msg);
+        } else if (typeof(printfire) == "function") {
+            // FireBug 0.3 and earlier
+            printfire(msg);
+        } else if (typeof(Debug) != "undefined" && Debug.writeln) {
+            // IE Web Development Helper (?)
+            // http://www.nikhilk.net/Entry.aspx?id=93
+            Debug.writeln(msg);
+        } else if (typeof(debug) != "undefined" && debug.trace) {
+            // Atlas framework (?)
+            // http://www.nikhilk.net/Entry.aspx?id=93
+            debug.trace(msg);
+        }
+    },
+
+    /** @id MochiKit.Logging.Logger.prototype.dispatchListeners */
+    dispatchListeners: function (msg) {
+        for (var k in this.listeners) {
+            var pair = this.listeners[k];
+            if (pair.ident != k || (pair[0] && !pair[0](msg))) {
+                continue;
+            }
+            pair[1](msg);
+        }
+    },
+
+    /** @id MochiKit.Logging.Logger.prototype.addListener */
+    addListener: function (ident, filter, listener) {
+        if (typeof(filter) == 'string') {
+            filter = MochiKit.Logging.logLevelAtLeast(filter);
+        }
+        var entry = [filter, listener];
+        entry.ident = ident;
+        this.listeners[ident] = entry;
+    },
+
+    /** @id MochiKit.Logging.Logger.prototype.removeListener */
+    removeListener: function (ident) {
+        delete this.listeners[ident];
+    },
+
+    /** @id MochiKit.Logging.Logger.prototype.baseLog */
+    baseLog: function (level, message/*, ...*/) {
+        var msg = new MochiKit.Logging.LogMessage(
+            this.counter,
+            level,
+            MochiKit.Base.extend(null, arguments, 1)
+        );
+        this._messages.push(msg);
+        this.dispatchListeners(msg);
+        if (this.useNativeConsole) {
+            this.logToConsole(msg.level + ": " + msg.info.join(" "));
+        }
+        this.counter += 1;
+        while (this.maxSize >= 0 && this._messages.length > this.maxSize) {
+            this._messages.shift();
+        }
+    },
+
+    /** @id MochiKit.Logging.Logger.prototype.getMessages */
+    getMessages: function (howMany) {
+        var firstMsg = 0;
+        if (!(typeof(howMany) == 'undefined' || howMany === null)) {
+            firstMsg = Math.max(0, this._messages.length - howMany);
+        }
+        return this._messages.slice(firstMsg);
+    },
+
+    /** @id MochiKit.Logging.Logger.prototype.getMessageText */
+    getMessageText: function (howMany) {
+        if (typeof(howMany) == 'undefined' || howMany === null) {
+            howMany = 30;
+        }
+        var messages = this.getMessages(howMany);
+        if (messages.length) {
+            var lst = map(function (m) {
+                return '\n  [' + m.num + '] ' + m.level + ': ' + m.info.join(' ');
+            }, messages);
+            lst.unshift('LAST ' + messages.length + ' MESSAGES:');
+            return lst.join('');
+        }
+        return '';
+    },
+
+    /** @id MochiKit.Logging.Logger.prototype.debuggingBookmarklet */
+    debuggingBookmarklet: function (inline) {
+        if (typeof(MochiKit.LoggingPane) == "undefined") {
+            alert(this.getMessageText());
+        } else {
+            MochiKit.LoggingPane.createLoggingPane(inline || false);
+        }
+    }
+};
+
+MochiKit.Logging.__new__ = function () {
+    this.LogLevel = {
+        ERROR: 40,
+        FATAL: 50,
+        WARNING: 30,
+        INFO: 20,
+        DEBUG: 10
+    };
+
+    var m = MochiKit.Base;
+    m.registerComparator("LogMessage",
+        this.isLogMessage,
+        this.compareLogMessage
+    );
+
+    var partial = m.partial;
+
+    var Logger = this.Logger;
+    var baseLog = Logger.prototype.baseLog;
+    m.update(this.Logger.prototype, {
+        debug: partial(baseLog, 'DEBUG'),
+        log: partial(baseLog, 'INFO'),
+        error: partial(baseLog, 'ERROR'),
+        fatal: partial(baseLog, 'FATAL'),
+        warning: partial(baseLog, 'WARNING')
+    });
+
+    // indirectly find logger so it can be replaced
+    var self = this;
+    var connectLog = function (name) {
+        return function () {
+            self.logger[name].apply(self.logger, arguments);
+        };
+    };
+
+    /** @id MochiKit.Logging.log */
+    this.log = connectLog('log');
+    /** @id MochiKit.Logging.logError */
+    this.logError = connectLog('error');
+    /** @id MochiKit.Logging.logDebug */
+    this.logDebug = connectLog('debug');
+    /** @id MochiKit.Logging.logFatal */
+    this.logFatal = connectLog('fatal');
+    /** @id MochiKit.Logging.logWarning */
+    this.logWarning = connectLog('warning');
+    this.logger = new Logger();
+    this.logger.useNativeConsole = true;
+
+    this.EXPORT_TAGS = {
+        ":common": this.EXPORT,
+        ":all": m.concat(this.EXPORT, this.EXPORT_OK)
+    };
+
+    m.nameFunctions(this);
+
+};
+
+if (typeof(printfire) == "undefined" &&
+        typeof(document) != "undefined" && document.createEvent &&
+        typeof(dispatchEvent) != "undefined") {
+    // FireBug really should be less lame about this global function
+    printfire  = function () {
+        printfire.args = arguments;
+        var ev = document.createEvent("Events");
+        ev.initEvent("printfire", false, true);
+        dispatchEvent(ev);
+    };
+}
+
+MochiKit.Logging.__new__();
+
+MochiKit.Base._exportSymbols(this, MochiKit.Logging);
diff --git a/frontend/beta/js/MochiKit/LoggingPane.js b/frontend/beta/js/MochiKit/LoggingPane.js
new file mode 100644
index 0000000..3798ae4
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/LoggingPane.js
@@ -0,0 +1,374 @@
+/***
+
+MochiKit.LoggingPane 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.LoggingPane');
+    dojo.require('MochiKit.Logging');
+    dojo.require('MochiKit.Base');
+}
+
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Logging", []);
+    JSAN.use("MochiKit.Base", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined' || typeof(MochiKit.Logging) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.LoggingPane depends on MochiKit.Base and MochiKit.Logging!";
+}
+
+if (typeof(MochiKit.LoggingPane) == 'undefined') {
+    MochiKit.LoggingPane = {};
+}
+
+MochiKit.LoggingPane.NAME = "MochiKit.LoggingPane";
+MochiKit.LoggingPane.VERSION = "1.4";
+MochiKit.LoggingPane.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+
+MochiKit.LoggingPane.toString = function () {
+    return this.__repr__();
+};
+
+/** @id MochiKit.LoggingPane.createLoggingPane */
+MochiKit.LoggingPane.createLoggingPane = function (inline/* = false */) {
+    var m = MochiKit.LoggingPane;
+    inline = !(!inline);
+    if (m._loggingPane && m._loggingPane.inline != inline) {
+        m._loggingPane.closePane();
+        m._loggingPane = null;
+    }
+    if (!m._loggingPane || m._loggingPane.closed) {
+        m._loggingPane = new m.LoggingPane(inline, MochiKit.Logging.logger);
+    }
+    return m._loggingPane;
+};
+
+/** @id MochiKit.LoggingPane.LoggingPane */
+MochiKit.LoggingPane.LoggingPane = function (inline/* = false */, logger/* = MochiKit.Logging.logger */) {
+
+    /* Use a div if inline, pop up a window if not */
+    /* Create the elements */
+    if (typeof(logger) == "undefined" || logger === null) {
+        logger = MochiKit.Logging.logger;
+    }
+    this.logger = logger;
+    var update = MochiKit.Base.update;
+    var updatetree = MochiKit.Base.updatetree;
+    var bind = MochiKit.Base.bind;
+    var clone = MochiKit.Base.clone;
+    var win = window;
+    var uid = "_MochiKit_LoggingPane";
+    if (typeof(MochiKit.DOM) != "undefined") {
+        win = MochiKit.DOM.currentWindow();
+    }
+    if (!inline) {
+        // name the popup with the base URL for uniqueness
+        var url = win.location.href.split("?")[0].replace(/[#:\/.><&-]/g, "_");
+        var name = uid + "_" + url;
+        var nwin = win.open("", name, "dependent,resizable,height=200");
+        if (!nwin) {
+            alert("Not able to open debugging window due to pop-up blocking.");
+            return undefined;
+        }
+        nwin.document.write(
+            '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" '
+            + '"http://www.w3.org/TR/html4/loose.dtd">'
+            + '<html><head><title>[MochiKit.LoggingPane]</title></head>'
+            + '<body></body></html>'
+        );
+        nwin.document.close();
+        nwin.document.title += ' ' + win.document.title;
+        win = nwin;
+    }
+    var doc = win.document;
+    this.doc = doc;
+
+    // Connect to the debug pane if it already exists (i.e. in a window orphaned by the page being refreshed)
+    var debugPane = doc.getElementById(uid);
+    var existing_pane = !!debugPane;
+    if (debugPane && typeof(debugPane.loggingPane) != "undefined") {
+        debugPane.loggingPane.logger = this.logger;
+        debugPane.loggingPane.buildAndApplyFilter();
+        return debugPane.loggingPane;
+    }
+
+    if (existing_pane) {
+        // clear any existing contents
+        var child;
+        while ((child = debugPane.firstChild)) {
+            debugPane.removeChild(child);
+        }
+    } else {
+        debugPane = doc.createElement("div");
+        debugPane.id = uid;
+    }
+    debugPane.loggingPane = this;
+    var levelFilterField = doc.createElement("input");
+    var infoFilterField = doc.createElement("input");
+    var filterButton = doc.createElement("button");
+    var loadButton = doc.createElement("button");
+    var clearButton = doc.createElement("button");
+    var closeButton = doc.createElement("button");
+    var logPaneArea = doc.createElement("div");
+    var logPane = doc.createElement("div");
+
+    /* Set up the functions */
+    var listenerId = uid + "_Listener";
+    this.colorTable = clone(this.colorTable);
+    var messages = [];
+    var messageFilter = null;
+
+    /** @id MochiKit.LoggingPane.messageLevel */
+    var messageLevel = function (msg) {
+        var level = msg.level;
+        if (typeof(level) == "number") {
+            level = MochiKit.Logging.LogLevel[level];
+        }
+        return level;
+    };
+
+    /** @id MochiKit.LoggingPane.messageText */
+    var messageText = function (msg) {
+        return msg.info.join(" ");
+    };
+
+    /** @id MochiKit.LoggingPane.addMessageText */
+    var addMessageText = bind(function (msg) {
+        var level = messageLevel(msg);
+        var text = messageText(msg);
+        var c = this.colorTable[level];
+        var p = doc.createElement("span");
+        p.className = "MochiKit-LogMessage MochiKit-LogLevel-" + level;
+        p.style.cssText = "margin: 0px; white-space: -moz-pre-wrap; white-space: -o-pre-wrap; white-space: pre-wrap; white-space: pre-line; word-wrap: break-word; wrap-option: emergency; color: " + c;
+        p.appendChild(doc.createTextNode(level + ": " + text));
+        logPane.appendChild(p);
+        logPane.appendChild(doc.createElement("br"));
+        if (logPaneArea.offsetHeight > logPaneArea.scrollHeight) {
+            logPaneArea.scrollTop = 0;
+        } else {
+            logPaneArea.scrollTop = logPaneArea.scrollHeight;
+        }
+    }, this);
+
+    /** @id MochiKit.LoggingPane.addMessage */
+    var addMessage = function (msg) {
+        messages[messages.length] = msg;
+        addMessageText(msg);
+    };
+
+    /** @id MochiKit.LoggingPane.buildMessageFilter */
+    var buildMessageFilter = function () {
+        var levelre, infore;
+        try {
+            /* Catch any exceptions that might arise due to invalid regexes */
+            levelre = new RegExp(levelFilterField.value);
+            infore = new RegExp(infoFilterField.value);
+        } catch(e) {
+            /* If there was an error with the regexes, do no filtering */
+            logDebug("Error in filter regex: " + e.message);
+            return null;
+        }
+
+        return function (msg) {
+            return (
+                levelre.test(messageLevel(msg)) &&
+                infore.test(messageText(msg))
+            );
+        };
+    };
+
+    /** @id MochiKit.LoggingPane.clearMessagePane */
+    var clearMessagePane = function () {
+        while (logPane.firstChild) {
+            logPane.removeChild(logPane.firstChild);
+        }
+    };
+
+    /** @id MochiKit.LoggingPane.clearMessages */
+    var clearMessages = function () {
+        messages = [];
+        clearMessagePane();
+    };
+
+    /** @id MochiKit.LoggingPane.closePane */
+    var closePane = bind(function () {
+        if (this.closed) {
+            return;
+        }
+        this.closed = true;
+        if (MochiKit.LoggingPane._loggingPane == this) {
+            MochiKit.LoggingPane._loggingPane = null;
+        }
+        this.logger.removeListener(listenerId);
+        try {
+            try {
+              debugPane.loggingPane = null;
+            } catch(e) { logFatal("Bookmarklet was closed incorrectly."); }
+            if (inline) {
+                debugPane.parentNode.removeChild(debugPane);
+            } else {
+                this.win.close();
+            }
+        } catch(e) {}
+    }, this);
+
+    /** @id MochiKit.LoggingPane.filterMessages */
+    var filterMessages = function () {
+        clearMessagePane();
+
+        for (var i = 0; i < messages.length; i++) {
+            var msg = messages[i];
+            if (messageFilter === null || messageFilter(msg)) {
+                addMessageText(msg);
+            }
+        }
+    };
+
+    this.buildAndApplyFilter = function () {
+        messageFilter = buildMessageFilter();
+
+        filterMessages();
+
+        this.logger.removeListener(listenerId);
+        this.logger.addListener(listenerId, messageFilter, addMessage);
+    };
+
+
+    /** @id MochiKit.LoggingPane.loadMessages */
+    var loadMessages = bind(function () {
+        messages = this.logger.getMessages();
+        filterMessages();
+    }, this);
+
+    /** @id MochiKit.LoggingPane.filterOnEnter */
+    var filterOnEnter = bind(function (event) {
+        event = event || window.event;
+        key = event.which || event.keyCode;
+        if (key == 13) {
+            this.buildAndApplyFilter();
+        }
+    }, this);
+
+    /* Create the debug pane */
+    var style = "display: block; z-index: 1000; left: 0px; bottom: 0px; position: fixed; width: 100%; background-color: white; font: " + this.logFont;
+    if (inline) {
+        style += "; height: 10em; border-top: 2px solid black";
+    } else {
+        style += "; height: 100%;";
+    }
+    debugPane.style.cssText = style;
+
+    if (!existing_pane) {
+        doc.body.appendChild(debugPane);
+    }
+
+    /* Create the filter fields */
+    style = {"cssText": "width: 33%; display: inline; font: " + this.logFont};
+
+    updatetree(levelFilterField, {
+        "value": "FATAL|ERROR|WARNING|INFO|DEBUG",
+        "onkeypress": filterOnEnter,
+        "style": style
+    });
+    debugPane.appendChild(levelFilterField);
+
+    updatetree(infoFilterField, {
+        "value": ".*",
+        "onkeypress": filterOnEnter,
+        "style": style
+    });
+    debugPane.appendChild(infoFilterField);
+
+    /* Create the buttons */
+    style = "width: 8%; display:inline; font: " + this.logFont;
+
+    filterButton.appendChild(doc.createTextNode("Filter"));
+    filterButton.onclick = bind("buildAndApplyFilter", this);
+    filterButton.style.cssText = style;
+    debugPane.appendChild(filterButton);
+
+    loadButton.appendChild(doc.createTextNode("Load"));
+    loadButton.onclick = loadMessages;
+    loadButton.style.cssText = style;
+    debugPane.appendChild(loadButton);
+
+    clearButton.appendChild(doc.createTextNode("Clear"));
+    clearButton.onclick = clearMessages;
+    clearButton.style.cssText = style;
+    debugPane.appendChild(clearButton);
+
+    closeButton.appendChild(doc.createTextNode("Close"));
+    closeButton.onclick = closePane;
+    closeButton.style.cssText = style;
+    debugPane.appendChild(closeButton);
+
+    /* Create the logging pane */
+    logPaneArea.style.cssText = "overflow: auto; width: 100%";
+    logPane.style.cssText = "width: 100%; height: " + (inline ? "8em" : "100%");
+
+    logPaneArea.appendChild(logPane);
+    debugPane.appendChild(logPaneArea);
+
+    this.buildAndApplyFilter();
+    loadMessages();
+
+    if (inline) {
+        this.win = undefined;
+    } else {
+        this.win = win;
+    }
+    this.inline = inline;
+    this.closePane = closePane;
+    this.closed = false;
+
+
+    return this;
+};
+
+MochiKit.LoggingPane.LoggingPane.prototype = {
+    "logFont": "8pt Verdana,sans-serif",
+    "colorTable": {
+        "ERROR": "red",
+        "FATAL": "darkred",
+        "WARNING": "blue",
+        "INFO": "black",
+        "DEBUG": "green"
+    }
+};
+
+
+MochiKit.LoggingPane.EXPORT_OK = [
+    "LoggingPane"
+];
+
+MochiKit.LoggingPane.EXPORT = [
+    "createLoggingPane"
+];
+
+MochiKit.LoggingPane.__new__ = function () {
+    this.EXPORT_TAGS = {
+        ":common": this.EXPORT,
+        ":all": MochiKit.Base.concat(this.EXPORT, this.EXPORT_OK)
+    };
+
+    MochiKit.Base.nameFunctions(this);
+
+    MochiKit.LoggingPane._loggingPane = null;
+
+};
+
+MochiKit.LoggingPane.__new__();
+
+MochiKit.Base._exportSymbols(this, MochiKit.LoggingPane);
diff --git a/frontend/beta/js/MochiKit/MochiKit.js b/frontend/beta/js/MochiKit/MochiKit.js
new file mode 100644
index 0000000..3a13b24
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/MochiKit.js
@@ -0,0 +1,154 @@
+/***
+
+MochiKit.MochiKit 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(MochiKit) == 'undefined') {
+    MochiKit = {};
+}
+
+if (typeof(MochiKit.MochiKit) == 'undefined') {
+    /** @id MochiKit.MochiKit */
+    MochiKit.MochiKit = {};
+}
+
+MochiKit.MochiKit.NAME = "MochiKit.MochiKit";
+MochiKit.MochiKit.VERSION = "1.4";
+MochiKit.MochiKit.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+
+/** @id MochiKit.MochiKit.toString */
+MochiKit.MochiKit.toString = function () {
+    return this.__repr__();
+};
+
+/** @id MochiKit.MochiKit.SUBMODULES */
+MochiKit.MochiKit.SUBMODULES = [
+    "Base",
+    "Iter",
+    "Logging",
+    "DateTime",
+    "Format",
+    "Async",
+    "DOM",
+    "Selector",
+    "Style",
+    "LoggingPane",
+    "Color",
+    "Signal",
+    "Position",
+    "Visual"
+];
+
+if (typeof(JSAN) != 'undefined' || typeof(dojo) != 'undefined') {
+    if (typeof(dojo) != 'undefined') {
+        dojo.provide('MochiKit.MochiKit');
+        dojo.require("MochiKit.*");
+    }
+    if (typeof(JSAN) != 'undefined') {
+        (function (lst) {
+            for (var i = 0; i < lst.length; i++) {
+                JSAN.use("MochiKit." + lst[i], []);
+            }
+        })(MochiKit.MochiKit.SUBMODULES);
+    }
+    (function () {
+        var extend = MochiKit.Base.extend;
+        var self = MochiKit.MochiKit;
+        var modules = self.SUBMODULES;
+        var EXPORT = [];
+        var EXPORT_OK = [];
+        var EXPORT_TAGS = {};
+        var i, k, m, all;
+        for (i = 0; i < modules.length; i++) {
+            m = MochiKit[modules[i]];
+            extend(EXPORT, m.EXPORT);
+            extend(EXPORT_OK, m.EXPORT_OK);
+            for (k in m.EXPORT_TAGS) {
+                EXPORT_TAGS[k] = extend(EXPORT_TAGS[k], m.EXPORT_TAGS[k]);
+            }
+            all = m.EXPORT_TAGS[":all"];
+            if (!all) {
+                all = extend(null, m.EXPORT, m.EXPORT_OK);
+            }
+            var j;
+            for (j = 0; j < all.length; j++) {
+                k = all[j];
+                self[k] = m[k];
+            }
+        }
+        self.EXPORT = EXPORT;
+        self.EXPORT_OK = EXPORT_OK;
+        self.EXPORT_TAGS = EXPORT_TAGS;
+    }());
+
+} else {
+    if (typeof(MochiKit.__compat__) == 'undefined') {
+        MochiKit.__compat__ = true;
+    }
+    (function () {
+        if (typeof(document) == "undefined") {
+            return;
+        }
+        var scripts = document.getElementsByTagName("script");
+        var kXULNSURI = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
+        var base = null;
+        var baseElem = null;
+        var allScripts = {};
+        var i;
+        for (i = 0; i < scripts.length; i++) {
+            var src = scripts[i].getAttribute("src");
+            if (!src) {
+                continue;
+            }
+            allScripts[src] = true;
+            if (src.match(/MochiKit.js$/)) {
+                base = src.substring(0, src.lastIndexOf('MochiKit.js'));
+                baseElem = scripts[i];
+            }
+        }
+        if (base === null) {
+            return;
+        }
+        var modules = MochiKit.MochiKit.SUBMODULES;
+        for (var i = 0; i < modules.length; i++) {
+            if (MochiKit[modules[i]]) {
+                continue;
+            }
+            var uri = base + modules[i] + '.js';
+            if (uri in allScripts) {
+                continue;
+            }
+            if (document.documentElement &&
+                document.documentElement.namespaceURI == kXULNSURI) {
+                // XUL
+                var s = document.createElementNS(kXULNSURI, 'script');
+                s.setAttribute("id", "MochiKit_" + base + modules[i]);
+                s.setAttribute("src", uri);
+                s.setAttribute("type", "application/x-javascript");
+                baseElem.parentNode.appendChild(s);
+            } else {
+                // HTML
+                /*
+                    DOM can not be used here because Safari does
+                    deferred loading of scripts unless they are
+                    in the document or inserted with document.write
+
+                    This is not XHTML compliant.  If you want XHTML
+                    compliance then you must use the packed version of MochiKit
+                    or include each script individually (basically unroll
+                    these document.write calls into your XHTML source)
+
+                */
+                document.write('<script src="' + uri +
+                    '" type="text/javascript"></script>');
+            }
+        };
+    })();
+}
diff --git a/frontend/beta/js/MochiKit/MockDOM.js b/frontend/beta/js/MochiKit/MockDOM.js
new file mode 100644
index 0000000..92558cb
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/MockDOM.js
@@ -0,0 +1,115 @@
+/***
+
+MochiKit.MockDOM 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(MochiKit) == "undefined") {
+    MochiKit = {};
+}
+
+if (typeof(MochiKit.MockDOM) == "undefined") {
+    MochiKit.MockDOM = {};
+}
+
+MochiKit.MockDOM.NAME = "MochiKit.MockDOM";
+MochiKit.MockDOM.VERSION = "1.4";
+
+MochiKit.MockDOM.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+
+/** @id MochiKit.MockDOM.toString */
+MochiKit.MockDOM.toString = function () {
+    return this.__repr__();
+};
+
+/** @id MochiKit.MockDOM.createDocument */
+MochiKit.MockDOM.createDocument = function () {
+    var doc = new MochiKit.MockDOM.MockElement("DOCUMENT");
+    doc.body = doc.createElement("BODY");
+    doc.appendChild(doc.body);
+    return doc;
+};
+
+/** @id MochiKit.MockDOM.MockElement */
+MochiKit.MockDOM.MockElement = function (name, data, ownerDocument) {
+    this.tagName = this.nodeName = name.toUpperCase();
+    this.ownerDocument = ownerDocument || null;
+    if (name == "DOCUMENT") {
+        this.nodeType = 9;
+        this.childNodes = [];
+    } else if (typeof(data) == "string") {
+        this.nodeValue = data;
+        this.nodeType = 3;
+    } else {
+        this.nodeType = 1;
+        this.childNodes = [];
+    }
+    if (name.substring(0, 1) == "<") {
+        var nameattr = name.substring(
+            name.indexOf('"') + 1, name.lastIndexOf('"'));
+        name = name.substring(1, name.indexOf(" "));
+        this.tagName = this.nodeName = name.toUpperCase();
+        this.setAttribute("name", nameattr);
+    }
+};
+
+MochiKit.MockDOM.MockElement.prototype = {
+    /** @id MochiKit.MockDOM.MockElement.prototype.createElement */
+    createElement: function (tagName) {
+        return new MochiKit.MockDOM.MockElement(tagName, null, this.nodeType == 9 ? this : this.ownerDocument);
+    },
+    /** @id MochiKit.MockDOM.MockElement.prototype.createTextNode */
+    createTextNode: function (text) {
+        return new MochiKit.MockDOM.MockElement("text", text, this.nodeType == 9 ? this : this.ownerDocument);
+    },
+    /** @id MochiKit.MockDOM.MockElement.prototype.setAttribute */
+    setAttribute: function (name, value) {
+        this[name] = value;
+    },
+    /** @id MochiKit.MockDOM.MockElement.prototype.getAttribute */
+    getAttribute: function (name) {
+        return this[name];
+    },
+    /** @id MochiKit.MockDOM.MockElement.prototype.appendChild */
+    appendChild: function (child) {
+        this.childNodes.push(child);
+    },
+    /** @id MochiKit.MockDOM.MockElement.prototype.toString */
+    toString: function () {
+        return "MockElement(" + this.tagName + ")";
+    },
+    /** @id MochiKit.MockDOM.MockElement.prototype.getElementsByTagName */
+    getElementsByTagName: function (tagName) {
+        var foundElements = [];
+        MochiKit.Base.nodeWalk(this, function(node){
+            if (tagName == '*' || tagName == node.tagName) {
+                foundElements.push(node);
+                return node.childNodes;
+            }
+        });
+        return foundElements;
+    }
+};
+
+    /** @id MochiKit.MockDOM.EXPORT_OK */
+MochiKit.MockDOM.EXPORT_OK = [
+    "mockElement",
+    "createDocument"
+];
+
+    /** @id MochiKit.MockDOM.EXPORT */
+MochiKit.MockDOM.EXPORT = [
+    "document"
+];
+
+MochiKit.MockDOM.__new__ = function () {
+    this.document = this.createDocument();
+};
+
+MochiKit.MockDOM.__new__();
diff --git a/frontend/beta/js/MochiKit/New.js b/frontend/beta/js/MochiKit/New.js
new file mode 100644
index 0000000..8b13789
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/New.js
@@ -0,0 +1 @@
+
diff --git a/frontend/beta/js/MochiKit/Position.js b/frontend/beta/js/MochiKit/Position.js
new file mode 100644
index 0000000..6092fe9
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Position.js
@@ -0,0 +1,246 @@
+/***
+
+MochiKit.Position 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005-2006 Bob Ippolito and others.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Position');
+    dojo.require('MochiKit.Base');
+    dojo.require('MochiKit.DOM');
+    dojo.require('MochiKit.Style');
+}
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use('MochiKit.Base', []);
+    JSAN.use('MochiKit.DOM', []);
+    JSAN.use('MochiKit.Style', []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined' ||
+        typeof(MochiKit.Style) == 'undefined' ||
+        typeof(MochiKit.DOM) == 'undefined') {
+        throw '';
+    }
+} catch (e) {
+    throw 'MochiKit.Style depends on MochiKit.Base, MochiKit.DOM, and MochiKit.Style!';
+}
+
+if (typeof(MochiKit.Position) == 'undefined') {
+    MochiKit.Position = {};
+}
+
+MochiKit.Position.NAME = 'MochiKit.Position';
+MochiKit.Position.VERSION = '1.4';
+MochiKit.Position.__repr__ = function () {
+    return '[' + this.NAME + ' ' + this.VERSION + ']';
+};
+MochiKit.Position.toString = function () {
+    return this.__repr__();
+};
+
+MochiKit.Position.EXPORT_OK = [];
+
+MochiKit.Position.EXPORT = [
+];
+
+
+MochiKit.Base.update(MochiKit.Position, {
+    // set to true if needed, warning: firefox performance problems
+    // NOT neeeded for page scrolling, only if draggable contained in
+    // scrollable elements
+    includeScrollOffsets: false,
+
+    /** @id MochiKit.Position.prepare */
+    prepare: function () {
+        var deltaX =  window.pageXOffset
+                   || document.documentElement.scrollLeft
+                   || document.body.scrollLeft
+                   || 0;
+        var deltaY =  window.pageYOffset
+                   || document.documentElement.scrollTop
+                   || document.body.scrollTop
+                   || 0;
+        this.windowOffset = new MochiKit.Style.Coordinates(deltaX, deltaY);
+    },
+
+    /** @id MochiKit.Position.cumulativeOffset */
+    cumulativeOffset: function (element) {
+        var valueT = 0;
+        var valueL = 0;
+        do {
+            valueT += element.offsetTop  || 0;
+            valueL += element.offsetLeft || 0;
+            element = element.offsetParent;
+        } while (element);
+        return new MochiKit.Style.Coordinates(valueL, valueT);
+    },
+
+    /** @id MochiKit.Position.realOffset */
+    realOffset: function (element) {
+        var valueT = 0;
+        var valueL = 0;
+        do {
+            valueT += element.scrollTop  || 0;
+            valueL += element.scrollLeft || 0;
+            element = element.parentNode;
+        } while (element);
+        return new MochiKit.Style.Coordinates(valueL, valueT);
+    },
+
+    /** @id MochiKit.Position.within */
+    within: function (element, x, y) {
+        if (this.includeScrollOffsets) {
+            return this.withinIncludingScrolloffsets(element, x, y);
+        }
+        this.xcomp = x;
+        this.ycomp = y;
+        this.offset = this.cumulativeOffset(element);
+        if (element.style.position == "fixed") {
+            this.offset.x += this.windowOffset.x;
+            this.offset.y += this.windowOffset.y;
+        }
+
+        return (y >= this.offset.y &&
+                y <  this.offset.y + element.offsetHeight &&
+                x >= this.offset.x &&
+                x <  this.offset.x + element.offsetWidth);
+    },
+
+    /** @id MochiKit.Position.withinIncludingScrolloffsets */
+    withinIncludingScrolloffsets: function (element, x, y) {
+        var offsetcache = this.realOffset(element);
+
+        this.xcomp = x + offsetcache.x - this.windowOffset.x;
+        this.ycomp = y + offsetcache.y - this.windowOffset.y;
+        this.offset = this.cumulativeOffset(element);
+
+        return (this.ycomp >= this.offset.y &&
+                this.ycomp <  this.offset.y + element.offsetHeight &&
+                this.xcomp >= this.offset.x &&
+                this.xcomp <  this.offset.x + element.offsetWidth);
+    },
+
+    // within must be called directly before
+    /** @id MochiKit.Position.overlap */
+    overlap: function (mode, element) {
+        if (!mode) {
+            return 0;
+        }
+        if (mode == 'vertical') {
+          return ((this.offset.y + element.offsetHeight) - this.ycomp) /
+                 element.offsetHeight;
+        }
+        if (mode == 'horizontal') {
+          return ((this.offset.x + element.offsetWidth) - this.xcomp) /
+                 element.offsetWidth;
+        }
+    },
+
+    /** @id MochiKit.Position.absolutize */
+    absolutize: function (element) {
+        element = MochiKit.DOM.getElement(element);
+        if (element.style.position == 'absolute') {
+            return;
+        }
+        MochiKit.Position.prepare();
+
+        var offsets = MochiKit.Position.positionedOffset(element);
+        var width = element.clientWidth;
+        var height = element.clientHeight;
+
+        var oldStyle = {
+            'position': element.style.position,
+            'left': offsets.x - parseFloat(element.style.left  || 0),
+            'top': offsets.y - parseFloat(element.style.top || 0),
+            'width': element.style.width,
+            'height': element.style.height
+        };
+
+        element.style.position = 'absolute';
+        element.style.top = offsets.y + 'px';
+        element.style.left = offsets.x + 'px';
+        element.style.width = width + 'px';
+        element.style.height = height + 'px';
+
+        return oldStyle;
+    },
+
+    /** @id MochiKit.Position.positionedOffset */
+    positionedOffset: function (element) {
+        var valueT = 0, valueL = 0;
+        do {
+            valueT += element.offsetTop  || 0;
+            valueL += element.offsetLeft || 0;
+            element = element.offsetParent;
+            if (element) {
+                p = MochiKit.Style.getStyle(element, 'position');
+                if (p == 'relative' || p == 'absolute') {
+                    break;
+                }
+            }
+        } while (element);
+        return new MochiKit.Style.Coordinates(valueL, valueT);
+    },
+
+    /** @id MochiKit.Position.relativize */
+    relativize: function (element, oldPos) {
+        element = MochiKit.DOM.getElement(element);
+        if (element.style.position == 'relative') {
+            return;
+        }
+        MochiKit.Position.prepare();
+
+        var top = parseFloat(element.style.top || 0) -
+                  (oldPos['top'] || 0);
+        var left = parseFloat(element.style.left || 0) -
+                   (oldPos['left'] || 0);
+
+        element.style.position = oldPos['position'];
+        element.style.top = top + 'px';
+        element.style.left = left + 'px';
+        element.style.width = oldPos['width'];
+        element.style.height = oldPos['height'];
+    },
+
+    /** @id MochiKit.Position.clone */
+    clone: function (source, target) {
+        source = MochiKit.DOM.getElement(source);
+        target = MochiKit.DOM.getElement(target);
+        target.style.position = 'absolute';
+        var offsets = this.cumulativeOffset(source);
+        target.style.top = offsets.y + 'px';
+        target.style.left = offsets.x + 'px';
+        target.style.width = source.offsetWidth + 'px';
+        target.style.height = source.offsetHeight + 'px';
+    },
+
+    /** @id MochiKit.Position.page */
+    page: function (forElement) {
+        var valueT = 0;
+        var valueL = 0;
+
+        var element = forElement;
+        do {
+            valueT += element.offsetTop  || 0;
+            valueL += element.offsetLeft || 0;
+
+            // Safari fix
+            if (element.offsetParent == document.body && MochiKit.Style.getStyle(element, 'position') == 'absolute') {
+                break;
+            }
+        } while (element = element.offsetParent);
+
+        element = forElement;
+        do {
+            valueT -= element.scrollTop  || 0;
+            valueL -= element.scrollLeft || 0;
+        } while (element = element.parentNode);
+
+        return new MochiKit.Style.Coordinates(valueL, valueT);
+    }
+});
diff --git a/frontend/beta/js/MochiKit/Selector.js b/frontend/beta/js/MochiKit/Selector.js
new file mode 100644
index 0000000..c385df7
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Selector.js
@@ -0,0 +1,431 @@
+/***
+
+MochiKit.Selector 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito and others.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Selector');
+    dojo.require('MochiKit.Base');
+    dojo.require('MochiKit.DOM');
+    dojo.require('MochiKit.Iter');
+}
+
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Base", []);
+    JSAN.use("MochiKit.DOM", []);
+    JSAN.use("MochiKit.Iter", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) === 'undefined' ||
+        typeof(MochiKit.DOM) === 'undefined' ||
+        typeof(MochiKit.Iter) === 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.Selector depends on MochiKit.Base, MochiKit.DOM and MochiKit.Iter!";
+}
+
+if (typeof(MochiKit.Selector) == 'undefined') {
+    MochiKit.Selector = {};
+}
+
+MochiKit.Selector.NAME = "MochiKit.Selector";
+
+MochiKit.Selector.VERSION = "1.4";
+
+MochiKit.Selector.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+
+MochiKit.Selector.toString = function () {
+    return this.__repr__();
+};
+
+MochiKit.Selector.EXPORT = [
+    "Selector",
+    "findChildElements",
+    "findDocElements",
+    "$$"
+];
+
+MochiKit.Selector.EXPORT_OK = [
+];
+
+MochiKit.Selector.Selector = function (expression) {
+    this.params = {classNames: [], pseudoClassNames: []};
+    this.expression = expression.toString().replace(/(^\s+|\s+$)/g, '');
+    this.parseExpression();
+    this.compileMatcher();
+};
+
+MochiKit.Selector.Selector.prototype = {
+    /***
+
+    Selector class: convenient object to make CSS selections.
+
+    ***/
+    __class__: MochiKit.Selector.Selector,
+
+    /** @id MochiKit.Selector.Selector.prototype.parseExpression */
+    parseExpression: function () {
+        function abort(message) {
+            throw 'Parse error in selector: ' + message;
+        }
+
+        if (this.expression == '')  {
+            abort('empty expression');
+        }
+
+        var repr = MochiKit.Base.repr;
+        var params = this.params;
+        var expr = this.expression;
+        var match, modifier, clause, rest;
+        while (match = expr.match(/^(.*)\[([a-z0-9_:-]+?)(?:([~\|!^$*]?=)(?:"([^"]*)"|([^\]\s]*)))?\]$/i)) {
+            params.attributes = params.attributes || [];
+            params.attributes.push({name: match[2], operator: match[3], value: match[4] || match[5] || ''});
+            expr = match[1];
+        }
+
+        if (expr == '*') {
+            return this.params.wildcard = true;
+        }
+
+        while (match = expr.match(/^([^a-z0-9_-])?([a-z0-9_-]+(?:\([^)]*\))?)(.*)/i)) {
+            modifier = match[1];
+            clause = match[2];
+            rest = match[3];
+            switch (modifier) {
+                case '#':
+                    params.id = clause;
+                    break;
+                case '.':
+                    params.classNames.push(clause);
+                    break;
+                case ':':
+                    params.pseudoClassNames.push(clause);
+                    break;
+                case '':
+                case undefined:
+                    params.tagName = clause.toUpperCase();
+                    break;
+                default:
+                    abort(repr(expr));
+            }
+            expr = rest;
+        }
+
+        if (expr.length > 0) {
+            abort(repr(expr));
+        }
+    },
+
+    /** @id MochiKit.Selector.Selector.prototype.buildMatchExpression */
+    buildMatchExpression: function () {
+        var repr = MochiKit.Base.repr;
+        var params = this.params;
+        var conditions = [];
+        var clause, i;
+
+        function childElements(element) {
+            return "MochiKit.Base.filter(function (node) { return node.nodeType == 1; }, " + element + ".childNodes)";
+        }
+
+        if (params.wildcard) {
+            conditions.push('true');
+        }
+        if (clause = params.id) {
+            conditions.push('element.id == ' + repr(clause));
+        }
+        if (clause = params.tagName) {
+            conditions.push('element.tagName.toUpperCase() == ' + repr(clause));
+        }
+        if ((clause = params.classNames).length > 0) {
+            for (i = 0; i < clause.length; i++) {
+                conditions.push('MochiKit.DOM.hasElementClass(element, ' + repr(clause[i]) + ')');
+            }
+        }
+        if ((clause = params.pseudoClassNames).length > 0) {
+            for (i = 0; i < clause.length; i++) {
+                var match = clause[i].match(/^([^(]+)(?:\((.*)\))?$/);
+                var pseudoClass = match[1];
+                var pseudoClassArgument = match[2];
+                switch (pseudoClass) {
+                    case 'root':
+                        conditions.push('element.nodeType == 9 || element === element.ownerDocument.documentElement'); break;
+                    case 'nth-child':
+                    case 'nth-last-child':
+                    case 'nth-of-type':
+                    case 'nth-last-of-type':
+                        match = pseudoClassArgument.match(/^((?:(\d+)n\+)?(\d+)|odd|even)$/);
+                        if (!match) {
+                            throw "Invalid argument to pseudo element nth-child: " + pseudoClassArgument;
+                        }
+                        var a, b;
+                        if (match[0] == 'odd') {
+                            a = 2;
+                            b = 1;
+                        } else if (match[0] == 'even') {
+                            a = 2;
+                            b = 0;
+                        } else {
+                            a = match[2] && parseInt(match) || null;
+                            b = parseInt(match[3]);
+                        }
+                        conditions.push('this.nthChild(element,' + a + ',' + b
+                                        + ',' + !!pseudoClass.match('^nth-last')    // Reverse
+                                        + ',' + !!pseudoClass.match('of-type$')     // Restrict to same tagName
+                                        + ')');
+                        break;
+                    case 'first-child':
+                        conditions.push('this.nthChild(element, null, 1)');
+                        break;
+                    case 'last-child':
+                        conditions.push('this.nthChild(element, null, 1, true)');
+                        break;
+                    case 'first-of-type':
+                        conditions.push('this.nthChild(element, null, 1, false, true)');
+                        break;
+                    case 'last-of-type':
+                        conditions.push('this.nthChild(element, null, 1, true, true)');
+                        break;
+                    case 'only-child':
+                        conditions.push(childElements('element.parentNode') + '.length == 1');
+                        break;
+                    case 'only-of-type':
+                        conditions.push('MochiKit.Base.filter(function (node) { return node.tagName == element.tagName; }, ' + childElements('element.parentNode') + ').length == 1');
+                        break;
+                    case 'empty':
+                        conditions.push('element.childNodes.length == 0');
+                        break;
+                    case 'enabled':
+                        conditions.push('(this.isUIElement(element) && element.disabled === false)');
+                        break;
+                    case 'disabled':
+                        conditions.push('(this.isUIElement(element) && element.disabled === true)');
+                        break;
+                    case 'checked':
+                        conditions.push('(this.isUIElement(element) && element.checked === true)');
+                        break;
+                    case 'not':
+                        var subselector = new MochiKit.Selector.Selector(pseudoClassArgument);
+                        conditions.push('!( ' + subselector.buildMatchExpression() + ')')
+                        break;
+                }
+            }
+        }
+        if (clause = params.attributes) {
+            MochiKit.Base.map(function (attribute) {
+                var value = 'MochiKit.DOM.getNodeAttribute(element, ' + repr(attribute.name) + ')';
+                var splitValueBy = function (delimiter) {
+                    return value + ' && ' + value + '.split(' + repr(delimiter) + ')';
+                }
+
+                switch (attribute.operator) {
+                    case '=':
+                        conditions.push(value + ' == ' + repr(attribute.value));
+                        break;
+                    case '~=':
+                        conditions.push('MochiKit.Base.findValue(' + splitValueBy(' ') + ', ' + repr(attribute.value) + ') > -1');
+                        break;
+                    case '^=':
+                        conditions.push(value + '.substring(0, ' + attribute.value.length + ') == ' + repr(attribute.value));
+                        break;
+                    case '$=':
+                        conditions.push(value + '.substring(' + value + '.length - ' + attribute.value.length + ') == ' + repr(attribute.value));
+                        break;
+                    case '*=':
+                        conditions.push(value + '.match(' + repr(attribute.value) + ')');
+                        break;
+                    case '|=':
+                        conditions.push(
+                            splitValueBy('-') + '[0].toUpperCase() == ' + repr(attribute.value.toUpperCase())
+                        );
+                        break;
+                    case '!=':
+                        conditions.push(value + ' != ' + repr(attribute.value));
+                        break;
+                    case '':
+                    case undefined:
+                        conditions.push(value + ' != null');
+                        break;
+                    default:
+                        throw 'Unknown operator ' + attribute.operator + ' in selector';
+                }
+            }, clause);
+        }
+
+        return conditions.join(' && ');
+    },
+
+    /** @id MochiKit.Selector.Selector.prototype.compileMatcher */
+    compileMatcher: function () {
+        this.match = new Function('element', 'if (!element.tagName) return false; \
+                return ' + this.buildMatchExpression());
+    },
+
+    /** @id MochiKit.Selector.Selector.prototype.nthChild */
+    nthChild: function (element, a, b, reverse, sametag){
+        var siblings = MochiKit.Base.filter(function (node) {
+            return node.nodeType == 1;
+        }, element.parentNode.childNodes);
+        if (sametag) {
+            siblings = MochiKit.Base.filter(function (node) {
+                return node.tagName == element.tagName;
+            }, siblings);
+        }
+        if (reverse) {
+            siblings = MochiKit.Iter.reversed(siblings);
+        }
+        if (a) {
+            var actualIndex = MochiKit.Base.findIdentical(siblings, element);
+            return ((actualIndex + 1 - b) / a) % 1 == 0;
+        } else {
+            return b == MochiKit.Base.findIdentical(siblings, element) + 1;
+        }
+    },
+
+    /** @id MochiKit.Selector.Selector.prototype.isUIElement */
+    isUIElement: function (element) {
+        return findValue(['input', 'button', 'select', 'option', 'textarea', 'object'],
+                element.tagName.toLowerCase()) > -1;
+    },
+
+    /** @id MochiKit.Selector.Selector.prototype.findElements */
+    findElements: function (scope, axis) {
+        var element;
+
+        if (axis == undefined) {
+            axis = "";
+        }
+
+        function inScope(element, scope) {
+            if (axis == "") {
+                return MochiKit.DOM.isChildNode(element, scope);
+            } else if (axis == ">") {
+                return element.parentNode == scope;
+            } else if (axis == "+") {
+                return element == nextSiblingElement(scope);
+            } else if (axis == "~") {
+                var sibling = scope;
+                while (sibling = nextSiblingElement(sibling)) {
+                    if (element == sibling) {
+                        return true;
+                    }
+                }
+                return false;
+            } else {
+                throw "Invalid axis: " + axis;
+            }
+        }
+
+        if (element = MochiKit.DOM.getElement(this.params.id)) {
+            if (this.match(element)) {
+                if (!scope || inScope(element, scope)) {
+                    return [element];
+                }
+            }
+        }
+
+        function nextSiblingElement(node) {
+            node = node.nextSibling;
+            while (node && node.nodeType != 1) {
+                node = node.nextSibling;
+            }
+            return node;
+        }
+
+        if (axis == "") {
+            scope = (scope || currentDocument()).getElementsByTagName(this.params.tagName || '*');
+        } else if (axis == ">") {
+            if (!scope) {
+                throw "> combinator not allowed without preceeding expression";
+            }
+            scope = MochiKit.Base.filter(function (node) {
+                return node.nodeType == 1;
+            }, scope.childNodes);
+        } else if (axis == "+") {
+            if (!scope) {
+                throw "+ combinator not allowed without preceeding expression";
+            }
+            scope = nextSiblingElement(scope) && [nextSiblingElement(scope)];
+        } else if (axis == "~") {
+            if (!scope) {
+                throw "~ combinator not allowed without preceeding expression";
+            }
+            var newscope = [];
+            while (nextSiblingElement(scope)) {
+                scope = nextSiblingElement(scope);
+                newscope.push(scope);
+            }
+            scope = newscope;
+        }
+
+        if (!scope) {
+            return [];
+        }
+
+        var results = MochiKit.Base.filter(MochiKit.Base.bind(function (scopeElt) {
+            return this.match(scopeElt);
+        }, this), scope);
+
+        return results;
+    },
+
+    /** @id MochiKit.Selector.Selector.prototype.repr */
+    repr: function () {
+        return 'Selector(' + this.expression + ')';
+    },
+
+    toString: MochiKit.Base.forwardCall("repr")
+};
+
+MochiKit.Base.update(MochiKit.Selector, {
+
+    /** @id MochiKit.Selector.findChildElements */
+    findChildElements: function (element, expressions) {
+        return MochiKit.Base.flattenArray(MochiKit.Base.map(function (expression) {
+            var nextScope = "";
+            return MochiKit.Iter.reduce(function (results, expr) {
+                if (match = expr.match(/^[>+~]$/)) {
+                    nextScope = match[0];
+                    return results;
+                } else {
+                    var selector = new MochiKit.Selector.Selector(expr);
+                    var elements = MochiKit.Iter.reduce(function (elements, result) {
+                        return MochiKit.Base.extend(elements, selector.findElements(result || element, nextScope));
+                    }, results, []);
+                    nextScope = "";
+                    return elements;
+                }
+            }, expression.replace(/(^\s+|\s+$)/g, '').split(/\s+/), [null]);
+        }, expressions));
+    },
+
+    findDocElements: function () {
+        return MochiKit.Selector.findChildElements(MochiKit.DOM.currentDocument(), arguments);
+    },
+
+    __new__: function () {
+        var m = MochiKit.Base;
+
+        this.$$ = this.findDocElements;
+
+        this.EXPORT_TAGS = {
+            ":common": this.EXPORT,
+            ":all": m.concat(this.EXPORT, this.EXPORT_OK)
+        };
+
+        m.nameFunctions(this);
+    }
+});
+
+MochiKit.Selector.__new__();
+
+MochiKit.Base._exportSymbols(this, MochiKit.Selector);
+
diff --git a/frontend/beta/js/MochiKit/Signal.js b/frontend/beta/js/MochiKit/Signal.js
new file mode 100644
index 0000000..a11a3de
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Signal.js
@@ -0,0 +1,864 @@
+/***
+
+MochiKit.Signal 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2006 Jonathan Gardner, Beau Hartshorne, Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Signal');
+    dojo.require('MochiKit.Base');
+    dojo.require('MochiKit.DOM');
+    dojo.require('MochiKit.Style');
+}
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use('MochiKit.Base', []);
+    JSAN.use('MochiKit.DOM', []);
+    JSAN.use('MochiKit.Style', []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined') {
+        throw '';
+    }
+} catch (e) {
+    throw 'MochiKit.Signal depends on MochiKit.Base!';
+}
+
+try {
+    if (typeof(MochiKit.DOM) == 'undefined') {
+        throw '';
+    }
+} catch (e) {
+    throw 'MochiKit.Signal depends on MochiKit.DOM!';
+}
+
+try {
+    if (typeof(MochiKit.Style) == 'undefined') {
+        throw '';
+    }
+} catch (e) {
+    throw 'MochiKit.Signal depends on MochiKit.Style!';
+}
+
+if (typeof(MochiKit.Signal) == 'undefined') {
+    MochiKit.Signal = {};
+}
+
+MochiKit.Signal.NAME = 'MochiKit.Signal';
+MochiKit.Signal.VERSION = '1.4';
+
+MochiKit.Signal._observers = [];
+
+/** @id MochiKit.Signal.Event */
+MochiKit.Signal.Event = function (src, e) {
+    this._event = e || window.event;
+    this._src = src;
+};
+
+MochiKit.Base.update(MochiKit.Signal.Event.prototype, {
+
+    __repr__: function () {
+        var repr = MochiKit.Base.repr;
+        var str = '{event(): ' + repr(this.event()) +
+            ', src(): ' + repr(this.src()) +
+            ', type(): ' + repr(this.type()) +
+            ', target(): ' + repr(this.target());
+
+        if (this.type() && 
+            this.type().indexOf('key') === 0 ||
+            this.type().indexOf('mouse') === 0 ||
+            this.type().indexOf('click') != -1 ||
+            this.type() == 'contextmenu') {
+            str += ', modifier(): ' + '{alt: ' + repr(this.modifier().alt) +
+            ', ctrl: ' + repr(this.modifier().ctrl) +
+            ', meta: ' + repr(this.modifier().meta) +
+            ', shift: ' + repr(this.modifier().shift) +
+            ', any: ' + repr(this.modifier().any) + '}';
+        }
+
+        if (this.type() && this.type().indexOf('key') === 0) {
+            str += ', key(): {code: ' + repr(this.key().code) +
+                ', string: ' + repr(this.key().string) + '}';
+        }
+
+        if (this.type() && (
+            this.type().indexOf('mouse') === 0 ||
+            this.type().indexOf('click') != -1 ||
+            this.type() == 'contextmenu')) {
+
+            str += ', mouse(): {page: ' + repr(this.mouse().page) +
+                ', client: ' + repr(this.mouse().client);
+
+            if (this.type() != 'mousemove') {
+                str += ', button: {left: ' + repr(this.mouse().button.left) +
+                    ', middle: ' + repr(this.mouse().button.middle) +
+                    ', right: ' + repr(this.mouse().button.right) + '}}';
+            } else {
+                str += '}';
+            }
+        }
+        if (this.type() == 'mouseover' || this.type() == 'mouseout') {
+            str += ', relatedTarget(): ' + repr(this.relatedTarget());
+        }
+        str += '}';
+        return str;
+    },
+
+     /** @id MochiKit.Signal.Event.prototype.toString */
+    toString: function () {
+        return this.__repr__();
+    },
+
+    /** @id MochiKit.Signal.Event.prototype.src */
+    src: function () {
+        return this._src;
+    },
+
+    /** @id MochiKit.Signal.Event.prototype.event  */
+    event: function () {
+        return this._event;
+    },
+
+    /** @id MochiKit.Signal.Event.prototype.type */
+    type: function () {
+        return this._event.type || undefined;
+    },
+
+    /** @id MochiKit.Signal.Event.prototype.target */
+    target: function () {
+        return this._event.target || this._event.srcElement;
+    },
+
+    _relatedTarget: null,
+    /** @id MochiKit.Signal.Event.prototype.relatedTarget */
+    relatedTarget: function () {
+        if (this._relatedTarget !== null) {
+            return this._relatedTarget;
+        }
+
+        var elem = null;
+        if (this.type() == 'mouseover') {
+            elem = (this._event.relatedTarget ||
+                this._event.fromElement);
+        } else if (this.type() == 'mouseout') {
+            elem = (this._event.relatedTarget ||
+                this._event.toElement);
+        }
+        if (elem !== null) {
+            this._relatedTarget = elem;
+            return elem;
+        }
+
+        return undefined;
+    },
+
+    _modifier: null,
+    /** @id MochiKit.Signal.Event.prototype.modifier */
+    modifier: function () {
+        if (this._modifier !== null) {
+            return this._modifier;
+        }
+        var m = {};
+        m.alt = this._event.altKey;
+        m.ctrl = this._event.ctrlKey;
+        m.meta = this._event.metaKey || false; // IE and Opera punt here
+        m.shift = this._event.shiftKey;
+        m.any = m.alt || m.ctrl || m.shift || m.meta;
+        this._modifier = m;
+        return m;
+    },
+
+    _key: null,
+    /** @id MochiKit.Signal.Event.prototype.key */
+    key: function () {
+        if (this._key !== null) {
+            return this._key;
+        }
+        var k = {};
+        if (this.type() && this.type().indexOf('key') === 0) {
+
+            /*
+
+                If you're looking for a special key, look for it in keydown or
+                keyup, but never keypress. If you're looking for a Unicode
+                chracter, look for it with keypress, but never keyup or
+                keydown.
+
+                Notes:
+
+                FF key event behavior:
+                key     event   charCode    keyCode
+                DOWN    ku,kd   0           40
+                DOWN    kp      0           40
+                ESC     ku,kd   0           27
+                ESC     kp      0           27
+                a       ku,kd   0           65
+                a       kp      97          0
+                shift+a ku,kd   0           65
+                shift+a kp      65          0
+                1       ku,kd   0           49
+                1       kp      49          0
+                shift+1 ku,kd   0           0
+                shift+1 kp      33          0
+
+                IE key event behavior:
+                (IE doesn't fire keypress events for special keys.)
+                key     event   keyCode
+                DOWN    ku,kd   40
+                DOWN    kp      undefined
+                ESC     ku,kd   27
+                ESC     kp      27
+                a       ku,kd   65
+                a       kp      97
+                shift+a ku,kd   65
+                shift+a kp      65
+                1       ku,kd   49
+                1       kp      49
+                shift+1 ku,kd   49
+                shift+1 kp      33
+
+                Safari key event behavior:
+                (Safari sets charCode and keyCode to something crazy for
+                special keys.)
+                key     event   charCode    keyCode
+                DOWN    ku,kd   63233       40
+                DOWN    kp      63233       63233
+                ESC     ku,kd   27          27
+                ESC     kp      27          27
+                a       ku,kd   97          65
+                a       kp      97          97
+                shift+a ku,kd   65          65
+                shift+a kp      65          65
+                1       ku,kd   49          49
+                1       kp      49          49
+                shift+1 ku,kd   33          49
+                shift+1 kp      33          33
+
+            */
+
+            /* look for special keys here */
+            if (this.type() == 'keydown' || this.type() == 'keyup') {
+                k.code = this._event.keyCode;
+                k.string = (MochiKit.Signal._specialKeys[k.code] ||
+                    'KEY_UNKNOWN');
+                this._key = k;
+                return k;
+
+            /* look for characters here */
+            } else if (this.type() == 'keypress') {
+
+                /*
+
+                    Special key behavior:
+
+                    IE: does not fire keypress events for special keys
+                    FF: sets charCode to 0, and sets the correct keyCode
+                    Safari: sets keyCode and charCode to something stupid
+
+                */
+
+                k.code = 0;
+                k.string = '';
+
+                if (typeof(this._event.charCode) != 'undefined' &&
+                    this._event.charCode !== 0 &&
+                    !MochiKit.Signal._specialMacKeys[this._event.charCode]) {
+                    k.code = this._event.charCode;
+                    k.string = String.fromCharCode(k.code);
+                } else if (this._event.keyCode &&
+                    typeof(this._event.charCode) == 'undefined') { // IE
+                    k.code = this._event.keyCode;
+                    k.string = String.fromCharCode(k.code);
+                }
+
+                this._key = k;
+                return k;
+            }
+        }
+        return undefined;
+    },
+
+    _mouse: null,
+    /** @id MochiKit.Signal.Event.prototype.mouse */
+    mouse: function () {
+        if (this._mouse !== null) {
+            return this._mouse;
+        }
+
+        var m = {};
+        var e = this._event;
+
+        if (this.type() && (
+            this.type().indexOf('mouse') === 0 ||
+            this.type().indexOf('click') != -1 ||
+            this.type() == 'contextmenu')) {
+
+            m.client = new MochiKit.Style.Coordinates(0, 0);
+            if (e.clientX || e.clientY) {
+                m.client.x = (!e.clientX || e.clientX < 0) ? 0 : e.clientX;
+                m.client.y = (!e.clientY || e.clientY < 0) ? 0 : e.clientY;
+            }
+
+            m.page = new MochiKit.Style.Coordinates(0, 0);
+            if (e.pageX || e.pageY) {
+                m.page.x = (!e.pageX || e.pageX < 0) ? 0 : e.pageX;
+                m.page.y = (!e.pageY || e.pageY < 0) ? 0 : e.pageY;
+            } else {
+                /*
+
+                    The IE shortcut can be off by two. We fix it. See:
+                    http://msdn.microsoft.com/workshop/author/dhtml/reference/methods/getboundingclientrect.asp
+
+                    This is similar to the method used in
+                    MochiKit.Style.getElementPosition().
+
+                */
+                var de = MochiKit.DOM._document.documentElement;
+                var b = MochiKit.DOM._document.body;
+
+                m.page.x = e.clientX +
+                    (de.scrollLeft || b.scrollLeft) -
+                    (de.clientLeft || 0);
+
+                m.page.y = e.clientY +
+                    (de.scrollTop || b.scrollTop) -
+                    (de.clientTop || 0);
+
+            }
+            if (this.type() != 'mousemove') {
+                m.button = {};
+                m.button.left = false;
+                m.button.right = false;
+                m.button.middle = false;
+
+                /* we could check e.button, but which is more consistent */
+                if (e.which) {
+                    m.button.left = (e.which == 1);
+                    m.button.middle = (e.which == 2);
+                    m.button.right = (e.which == 3);
+
+                    /*
+
+                        Mac browsers and right click:
+
+                            - Safari doesn't fire any click events on a right
+                              click:
+                              http://bugs.webkit.org/show_bug.cgi?id=6595
+
+                            - Firefox fires the event, and sets ctrlKey = true
+
+                            - Opera fires the event, and sets metaKey = true
+
+                        oncontextmenu is fired on right clicks between
+                        browsers and across platforms.
+
+                    */
+
+                } else {
+                    m.button.left = !!(e.button & 1);
+                    m.button.right = !!(e.button & 2);
+                    m.button.middle = !!(e.button & 4);
+                }
+            }
+            this._mouse = m;
+            return m;
+        }
+        return undefined;
+    },
+
+    /** @id MochiKit.Signal.Event.prototype.stop */
+    stop: function () {
+        this.stopPropagation();
+        this.preventDefault();
+    },
+
+    /** @id MochiKit.Signal.Event.prototype.stopPropagation */
+    stopPropagation: function () {
+        if (this._event.stopPropagation) {
+            this._event.stopPropagation();
+        } else {
+            this._event.cancelBubble = true;
+        }
+    },
+
+    /** @id MochiKit.Signal.Event.prototype.preventDefault */
+    preventDefault: function () {
+        if (this._event.preventDefault) {
+            this._event.preventDefault();
+        } else if (this._confirmUnload === null) {
+            this._event.returnValue = false;
+        }
+    },
+
+    _confirmUnload: null,
+
+    /** @id MochiKit.Signal.Event.prototype.confirmUnload */
+    confirmUnload: function (msg) {
+        if (this.type() == 'beforeunload') {
+            this._confirmUnload = msg;
+            this._event.returnValue = msg;
+        }
+    }
+});
+
+/* Safari sets keyCode to these special values onkeypress. */
+MochiKit.Signal._specialMacKeys = {
+    3: 'KEY_ENTER',
+    63289: 'KEY_NUM_PAD_CLEAR',
+    63276: 'KEY_PAGE_UP',
+    63277: 'KEY_PAGE_DOWN',
+    63275: 'KEY_END',
+    63273: 'KEY_HOME',
+    63234: 'KEY_ARROW_LEFT',
+    63232: 'KEY_ARROW_UP',
+    63235: 'KEY_ARROW_RIGHT',
+    63233: 'KEY_ARROW_DOWN',
+    63302: 'KEY_INSERT',
+    63272: 'KEY_DELETE'
+};
+
+/* for KEY_F1 - KEY_F12 */
+(function () {
+    var _specialMacKeys = MochiKit.Signal._specialMacKeys;
+    for (i = 63236; i <= 63242; i++) {
+        // no F0
+        _specialMacKeys[i] = 'KEY_F' + (i - 63236 + 1);
+    }
+})();
+
+/* Standard keyboard key codes. */
+MochiKit.Signal._specialKeys = {
+    8: 'KEY_BACKSPACE',
+    9: 'KEY_TAB',
+    12: 'KEY_NUM_PAD_CLEAR', // weird, for Safari and Mac FF only
+    13: 'KEY_ENTER',
+    16: 'KEY_SHIFT',
+    17: 'KEY_CTRL',
+    18: 'KEY_ALT',
+    19: 'KEY_PAUSE',
+    20: 'KEY_CAPS_LOCK',
+    27: 'KEY_ESCAPE',
+    32: 'KEY_SPACEBAR',
+    33: 'KEY_PAGE_UP',
+    34: 'KEY_PAGE_DOWN',
+    35: 'KEY_END',
+    36: 'KEY_HOME',
+    37: 'KEY_ARROW_LEFT',
+    38: 'KEY_ARROW_UP',
+    39: 'KEY_ARROW_RIGHT',
+    40: 'KEY_ARROW_DOWN',
+    44: 'KEY_PRINT_SCREEN',
+    45: 'KEY_INSERT',
+    46: 'KEY_DELETE',
+    59: 'KEY_SEMICOLON', // weird, for Safari and IE only
+    91: 'KEY_WINDOWS_LEFT',
+    92: 'KEY_WINDOWS_RIGHT',
+    93: 'KEY_SELECT',
+    106: 'KEY_NUM_PAD_ASTERISK',
+    107: 'KEY_NUM_PAD_PLUS_SIGN',
+    109: 'KEY_NUM_PAD_HYPHEN-MINUS',
+    110: 'KEY_NUM_PAD_FULL_STOP',
+    111: 'KEY_NUM_PAD_SOLIDUS',
+    144: 'KEY_NUM_LOCK',
+    145: 'KEY_SCROLL_LOCK',
+    186: 'KEY_SEMICOLON',
+    187: 'KEY_EQUALS_SIGN',
+    188: 'KEY_COMMA',
+    189: 'KEY_HYPHEN-MINUS',
+    190: 'KEY_FULL_STOP',
+    191: 'KEY_SOLIDUS',
+    192: 'KEY_GRAVE_ACCENT',
+    219: 'KEY_LEFT_SQUARE_BRACKET',
+    220: 'KEY_REVERSE_SOLIDUS',
+    221: 'KEY_RIGHT_SQUARE_BRACKET',
+    222: 'KEY_APOSTROPHE'
+    // undefined: 'KEY_UNKNOWN'
+};
+
+(function () {
+    /* for KEY_0 - KEY_9 */
+    var _specialKeys = MochiKit.Signal._specialKeys;
+    for (var i = 48; i <= 57; i++) {
+        _specialKeys[i] = 'KEY_' + (i - 48);
+    }
+
+    /* for KEY_A - KEY_Z */
+    for (i = 65; i <= 90; i++) {
+        _specialKeys[i] = 'KEY_' + String.fromCharCode(i);
+    }
+
+    /* for KEY_NUM_PAD_0 - KEY_NUM_PAD_9 */
+    for (i = 96; i <= 105; i++) {
+        _specialKeys[i] = 'KEY_NUM_PAD_' + (i - 96);
+    }
+
+    /* for KEY_F1 - KEY_F12 */
+    for (i = 112; i <= 123; i++) {
+        // no F0
+        _specialKeys[i] = 'KEY_F' + (i - 112 + 1);
+    }
+})();
+
+MochiKit.Base.update(MochiKit.Signal, {
+
+    __repr__: function () {
+        return '[' + this.NAME + ' ' + this.VERSION + ']';
+    },
+
+    toString: function () {
+        return this.__repr__();
+    },
+
+    _unloadCache: function () {
+        var self = MochiKit.Signal;
+        var observers = self._observers;
+
+        for (var i = 0; i < observers.length; i++) {
+            self._disconnect(observers[i]);
+        }
+
+        delete self._observers;
+
+        try {
+            window.onload = undefined;
+        } catch(e) {
+            // pass
+        }
+
+        try {
+            window.onunload = undefined;
+        } catch(e) {
+            // pass
+        }
+    },
+
+    _listener: function (src, func, obj, isDOM) {
+        var self = MochiKit.Signal;
+        var E = self.Event;
+        if (!isDOM) {
+            return MochiKit.Base.bind(func, obj);
+        }
+        obj = obj || src;
+        if (typeof(func) == "string") {
+            return function (nativeEvent) {
+                obj[func].apply(obj, [new E(src, nativeEvent)]);
+            };
+        } else {
+            return function (nativeEvent) {
+                func.apply(obj, [new E(src, nativeEvent)]);
+            };
+        }
+    },
+
+    _browserAlreadyHasMouseEnterAndLeave: function () {
+        return /MSIE/.test(navigator.userAgent);
+    },
+
+    _mouseEnterListener: function (src, sig, func, obj) {
+        var E = MochiKit.Signal.Event;
+        return function (nativeEvent) {
+            var e = new E(src, nativeEvent);
+            try {
+                e.relatedTarget().nodeName;
+            } catch (err) {
+                /* probably hit a permission denied error; possibly one of
+                 * firefox's screwy anonymous DIVs inside an input element.
+                 * Allow this event to propogate up.
+                 */
+                return;
+            }
+            e.stop();
+            if (MochiKit.DOM.isChildNode(e.relatedTarget(), src)) {
+                /* We've moved between our node and a child. Ignore. */
+                return;
+            }
+            e.type = function () { return sig; };
+            if (typeof(func) == "string") {
+                return obj[func].apply(obj, [e]);
+            } else {
+                return func.apply(obj, [e]);
+            }
+        };
+    },
+
+    _getDestPair: function (objOrFunc, funcOrStr) {
+        var obj = null;
+        var func = null;
+        if (typeof(funcOrStr) != 'undefined') {
+            obj = objOrFunc;
+            func = funcOrStr;
+            if (typeof(funcOrStr) == 'string') {
+                if (typeof(objOrFunc[funcOrStr]) != "function") {
+                    throw new Error("'funcOrStr' must be a function on 'objOrFunc'");
+                }
+            } else if (typeof(funcOrStr) != 'function') {
+                throw new Error("'funcOrStr' must be a function or string");
+            }
+        } else if (typeof(objOrFunc) != "function") {
+            throw new Error("'objOrFunc' must be a function if 'funcOrStr' is not given");
+        } else {
+            func = objOrFunc;
+        }
+        return [obj, func];
+
+    },
+
+    /** @id MochiKit.Signal.connect */
+    connect: function (src, sig, objOrFunc/* optional */, funcOrStr) {
+        src = MochiKit.DOM.getElement(src);
+        var self = MochiKit.Signal;
+
+        if (typeof(sig) != 'string') {
+            throw new Error("'sig' must be a string");
+        }
+
+        var destPair = self._getDestPair(objOrFunc, funcOrStr);
+        var obj = destPair[0];
+        var func = destPair[1];
+        if (typeof(obj) == 'undefined' || obj === null) {
+            obj = src;
+        }
+
+        var isDOM = !!(src.addEventListener || src.attachEvent);
+        if (isDOM && (sig === "onmouseenter" || sig === "onmouseleave")
+                  && !self._browserAlreadyHasMouseEnterAndLeave()) {
+            var listener = self._mouseEnterListener(src, sig.substr(2), func, obj);
+            if (sig === "onmouseenter") {
+                sig = "onmouseover";
+            } else {
+                sig = "onmouseout";
+            }
+        } else {
+            var listener = self._listener(src, func, obj, isDOM);
+        }
+
+        if (src.addEventListener) {
+            src.addEventListener(sig.substr(2), listener, false);
+        } else if (src.attachEvent) {
+            src.attachEvent(sig, listener); // useCapture unsupported
+        }
+
+        var ident = [src, sig, listener, isDOM, objOrFunc, funcOrStr, true];
+        self._observers.push(ident);
+
+
+        if (!isDOM && typeof(src.__connect__) == 'function') {
+            var args = MochiKit.Base.extend([ident], arguments, 1);
+            src.__connect__.apply(src, args);
+        }
+
+
+        return ident;
+    },
+
+    _disconnect: function (ident) {
+        // already disconnected
+        if (!ident[6]) { return; }
+        ident[6] = false;
+        // check isDOM
+        if (!ident[3]) { return; }
+        var src = ident[0];
+        var sig = ident[1];
+        var listener = ident[2];
+        if (src.removeEventListener) {
+            src.removeEventListener(sig.substr(2), listener, false);
+        } else if (src.detachEvent) {
+            src.detachEvent(sig, listener); // useCapture unsupported
+        } else {
+            throw new Error("'src' must be a DOM element");
+        }
+    },
+
+     /** @id MochiKit.Signal.disconnect */
+    disconnect: function (ident) {
+        var self = MochiKit.Signal;
+        var observers = self._observers;
+        var m = MochiKit.Base;
+        if (arguments.length > 1) {
+            // compatibility API
+            var src = MochiKit.DOM.getElement(arguments[0]);
+            var sig = arguments[1];
+            var obj = arguments[2];
+            var func = arguments[3];
+            for (var i = observers.length - 1; i >= 0; i--) {
+                var o = observers[i];
+                if (o[0] === src && o[1] === sig && o[4] === obj && o[5] === func) {
+                    self._disconnect(o);
+                    if (!self._lock) {
+                        observers.splice(i, 1);
+                    } else {
+                        self._dirty = true;
+                    }
+                    return true;
+                }
+            }
+        } else {
+            var idx = m.findIdentical(observers, ident);
+            if (idx >= 0) {
+                self._disconnect(ident);
+                if (!self._lock) {
+                    observers.splice(idx, 1);
+                } else {
+                    self._dirty = true;
+                }
+                return true;
+            }
+        }
+        return false;
+    },
+
+    /** @id MochiKit.Signal.disconnectAllTo */
+    disconnectAllTo: function (objOrFunc, /* optional */funcOrStr) {
+        var self = MochiKit.Signal;
+        var observers = self._observers;
+        var disconnect = self._disconnect;
+        var locked = self._lock;
+        var dirty = self._dirty;
+        if (typeof(funcOrStr) === 'undefined') {
+            funcOrStr = null;
+        }
+        for (var i = observers.length - 1; i >= 0; i--) {
+            var ident = observers[i];
+            if (ident[4] === objOrFunc &&
+                    (funcOrStr === null || ident[5] === funcOrStr)) {
+                disconnect(ident);
+                if (locked) {
+                    dirty = true;
+                } else {
+                    observers.splice(i, 1);
+                }
+            }
+        }
+        self._dirty = dirty;
+    },
+
+    /** @id MochiKit.Signal.disconnectAll */
+    disconnectAll: function (src/* optional */, sig) {
+        src = MochiKit.DOM.getElement(src);
+        var m = MochiKit.Base;
+        var signals = m.flattenArguments(m.extend(null, arguments, 1));
+        var self = MochiKit.Signal;
+        var disconnect = self._disconnect;
+        var observers = self._observers;
+        var i, ident;
+        var locked = self._lock;
+        var dirty = self._dirty;
+        if (signals.length === 0) {
+            // disconnect all
+            for (i = observers.length - 1; i >= 0; i--) {
+                ident = observers[i];
+                if (ident[0] === src) {
+                    disconnect(ident);
+                    if (!locked) {
+                        observers.splice(i, 1);
+                    } else {
+                        dirty = true;
+                    }
+                }
+            }
+        } else {
+            var sigs = {};
+            for (i = 0; i < signals.length; i++) {
+                sigs[signals[i]] = true;
+            }
+            for (i = observers.length - 1; i >= 0; i--) {
+                ident = observers[i];
+                if (ident[0] === src && ident[1] in sigs) {
+                    disconnect(ident);
+                    if (!locked) {
+                        observers.splice(i, 1);
+                    } else {
+                        dirty = true;
+                    }
+                }
+            }
+        }
+        self._dirty = dirty;
+    },
+
+    /** @id MochiKit.Signal.signal */
+    signal: function (src, sig) {
+        var self = MochiKit.Signal;
+        var observers = self._observers;
+        src = MochiKit.DOM.getElement(src);
+        var args = MochiKit.Base.extend(null, arguments, 2);
+        var errors = [];
+        self._lock = true;
+        for (var i = 0; i < observers.length; i++) {
+            var ident = observers[i];
+            if (ident[0] === src && ident[1] === sig) {
+                try {
+                    ident[2].apply(src, args);
+                } catch (e) {
+                    errors.push(e);
+                }
+            }
+        }
+        self._lock = false;
+        if (self._dirty) {
+            self._dirty = false;
+            for (var i = observers.length - 1; i >= 0; i--) {
+                if (!observers[i][6]) {
+                    observers.splice(i, 1);
+                }
+            }
+        }
+        if (errors.length == 1) {
+            throw errors[0];
+        } else if (errors.length > 1) {
+            var e = new Error("Multiple errors thrown in handling 'sig', see errors property");
+            e.errors = errors;
+            throw e;
+        }
+    }
+
+});
+
+MochiKit.Signal.EXPORT_OK = [];
+
+MochiKit.Signal.EXPORT = [
+    'connect',
+    'disconnect',
+    'signal',
+    'disconnectAll',
+    'disconnectAllTo'
+];
+
+MochiKit.Signal.__new__ = function (win) {
+    var m = MochiKit.Base;
+    this._document = document;
+    this._window = win;
+    this._lock = false;
+    this._dirty = false;
+
+    try {
+        this.connect(window, 'onunload', this._unloadCache);
+    } catch (e) {
+        // pass: might not be a browser
+    }
+
+    this.EXPORT_TAGS = {
+        ':common': this.EXPORT,
+        ':all': m.concat(this.EXPORT, this.EXPORT_OK)
+    };
+
+    m.nameFunctions(this);
+};
+
+MochiKit.Signal.__new__(this);
+
+//
+// XXX: Internet Explorer blows
+//
+if (MochiKit.__export__) {
+    connect = MochiKit.Signal.connect;
+    disconnect = MochiKit.Signal.disconnect;
+    disconnectAll = MochiKit.Signal.disconnectAll;
+    signal = MochiKit.Signal.signal;
+}
+
+MochiKit.Base._exportSymbols(this, MochiKit.Signal);
diff --git a/frontend/beta/js/MochiKit/Sortable.js b/frontend/beta/js/MochiKit/Sortable.js
new file mode 100644
index 0000000..8976ec0
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Sortable.js
@@ -0,0 +1,589 @@
+/***
+Copyright (c) 2005 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
+    Mochi-ized By Thomas Herve (_firstname_@nimail.org)
+
+See scriptaculous.js for full license.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Sortable');
+    dojo.require('MochiKit.Base');
+    dojo.require('MochiKit.DOM');
+    dojo.require('MochiKit.Iter');
+}
+
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Base", []);
+    JSAN.use("MochiKit.DOM", []);
+    JSAN.use("MochiKit.Iter", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined' ||
+        typeof(MochiKit.DOM) == 'undefined' ||
+        typeof(MochiKit.Iter) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.DragAndDrop depends on MochiKit.Base, MochiKit.DOM and MochiKit.Iter!";
+}
+
+if (typeof(MochiKit.Sortable) == 'undefined') {
+    MochiKit.Sortable = {};
+}
+
+MochiKit.Sortable.NAME = 'MochiKit.Sortable';
+MochiKit.Sortable.VERSION = '1.4';
+
+MochiKit.Sortable.__repr__ = function () {
+    return '[' + this.NAME + ' ' + this.VERSION + ']';
+};
+
+MochiKit.Sortable.toString = function () {
+    return this.__repr__();
+};
+
+MochiKit.Sortable.EXPORT = [
+];
+
+MochiKit.Sortable.EXPORT_OK = [
+];
+
+MochiKit.Base.update(MochiKit.Sortable, {
+    /***
+
+    Manage sortables. Mainly use the create function to add a sortable.
+
+    ***/
+    sortables: {},
+
+    _findRootElement: function (element) {
+        while (element.tagName.toUpperCase() != "BODY") {
+            if (element.id && MochiKit.Sortable.sortables[element.id]) {
+                return element;
+            }
+            element = element.parentNode;
+        }
+    },
+
+    /** @id MochiKit.Sortable.options */
+    options: function (element) {
+        element = MochiKit.Sortable._findRootElement(MochiKit.DOM.getElement(element));
+        if (!element) {
+            return;
+        }
+        return MochiKit.Sortable.sortables[element.id];
+    },
+
+    /** @id MochiKit.Sortable.destroy */
+    destroy: function (element){
+        var s = MochiKit.Sortable.options(element);
+        var b = MochiKit.Base;
+        var d = MochiKit.DragAndDrop;
+
+        if (s) {
+            MochiKit.Signal.disconnect(s.startHandle);
+            MochiKit.Signal.disconnect(s.endHandle);
+            b.map(function (dr) {
+                d.Droppables.remove(dr);
+            }, s.droppables);
+            b.map(function (dr) {
+                dr.destroy();
+            }, s.draggables);
+
+            delete MochiKit.Sortable.sortables[s.element.id];
+        }
+    },
+
+    /** @id MochiKit.Sortable.create */
+    create: function (element, options) {
+        element = MochiKit.DOM.getElement(element);
+        var self = MochiKit.Sortable;
+
+        /** @id MochiKit.Sortable.options */
+        options = MochiKit.Base.update({
+
+            /** @id MochiKit.Sortable.element */
+            element: element,
+
+            /** @id MochiKit.Sortable.tag */
+            tag: 'li',  // assumes li children, override with tag: 'tagname'
+
+            /** @id MochiKit.Sortable.dropOnEmpty */
+            dropOnEmpty: false,
+
+            /** @id MochiKit.Sortable.tree */
+            tree: false,
+
+            /** @id MochiKit.Sortable.treeTag */
+            treeTag: 'ul',
+
+            /** @id MochiKit.Sortable.overlap */
+            overlap: 'vertical',  // one of 'vertical', 'horizontal'
+
+            /** @id MochiKit.Sortable.constraint */
+            constraint: 'vertical',  // one of 'vertical', 'horizontal', false
+            // also takes array of elements (or ids); or false
+
+            /** @id MochiKit.Sortable.containment */
+            containment: [element],
+
+            /** @id MochiKit.Sortable.handle */
+            handle: false,  // or a CSS class
+
+            /** @id MochiKit.Sortable.only */
+            only: false,
+
+            /** @id MochiKit.Sortable.hoverclass */
+            hoverclass: null,
+
+            /** @id MochiKit.Sortable.ghosting */
+            ghosting: false,
+
+            /** @id MochiKit.Sortable.scroll */
+            scroll: false,
+
+            /** @id MochiKit.Sortable.scrollSensitivity */
+            scrollSensitivity: 20,
+
+            /** @id MochiKit.Sortable.scrollSpeed */
+            scrollSpeed: 15,
+
+            /** @id MochiKit.Sortable.format */
+            format: /^[^_]*_(.*)$/,
+
+            /** @id MochiKit.Sortable.onChange */
+            onChange: MochiKit.Base.noop,
+
+            /** @id MochiKit.Sortable.onUpdate */
+            onUpdate: MochiKit.Base.noop,
+
+            /** @id MochiKit.Sortable.accept */
+            accept: null
+        }, options);
+
+        // clear any old sortable with same element
+        self.destroy(element);
+
+        // build options for the draggables
+        var options_for_draggable = {
+            revert: true,
+            ghosting: options.ghosting,
+            scroll: options.scroll,
+            scrollSensitivity: options.scrollSensitivity,
+            scrollSpeed: options.scrollSpeed,
+            constraint: options.constraint,
+            handle: options.handle
+        };
+
+        if (options.starteffect) {
+            options_for_draggable.starteffect = options.starteffect;
+        }
+
+        if (options.reverteffect) {
+            options_for_draggable.reverteffect = options.reverteffect;
+        } else if (options.ghosting) {
+            options_for_draggable.reverteffect = function (innerelement) {
+                innerelement.style.top = 0;
+                innerelement.style.left = 0;
+            };
+        }
+
+        if (options.endeffect) {
+            options_for_draggable.endeffect = options.endeffect;
+        }
+
+        if (options.zindex) {
+            options_for_draggable.zindex = options.zindex;
+        }
+
+        // build options for the droppables
+        var options_for_droppable = {
+            overlap: options.overlap,
+            containment: options.containment,
+            hoverclass: options.hoverclass,
+            onhover: self.onHover,
+            tree: options.tree,
+            accept: options.accept
+        }
+
+        var options_for_tree = {
+            onhover: self.onEmptyHover,
+            overlap: options.overlap,
+            containment: options.containment,
+            hoverclass: options.hoverclass,
+            accept: options.accept
+        }
+
+        // fix for gecko engine
+        MochiKit.DOM.removeEmptyTextNodes(element);
+
+        options.draggables = [];
+        options.droppables = [];
+
+        // drop on empty handling
+        if (options.dropOnEmpty || options.tree) {
+            new MochiKit.DragAndDrop.Droppable(element, options_for_tree);
+            options.droppables.push(element);
+        }
+        MochiKit.Base.map(function (e) {
+            // handles are per-draggable
+            var handle = options.handle ?
+                MochiKit.DOM.getFirstElementByTagAndClassName(null,
+                    options.handle, e) : e;
+            options.draggables.push(
+                new MochiKit.DragAndDrop.Draggable(e,
+                    MochiKit.Base.update(options_for_draggable,
+                                         {handle: handle})));
+            new MochiKit.DragAndDrop.Droppable(e, options_for_droppable);
+            if (options.tree) {
+                e.treeNode = element;
+            }
+            options.droppables.push(e);
+        }, (self.findElements(element, options) || []));
+
+        if (options.tree) {
+            MochiKit.Base.map(function (e) {
+                new MochiKit.DragAndDrop.Droppable(e, options_for_tree);
+                e.treeNode = element;
+                options.droppables.push(e);
+            }, (self.findTreeElements(element, options) || []));
+        }
+
+        // keep reference
+        self.sortables[element.id] = options;
+
+        options.lastValue = self.serialize(element);
+        options.startHandle = MochiKit.Signal.connect(MochiKit.DragAndDrop.Draggables, 'start',
+                                MochiKit.Base.partial(self.onStart, element));
+        options.endHandle = MochiKit.Signal.connect(MochiKit.DragAndDrop.Draggables, 'end',
+                                MochiKit.Base.partial(self.onEnd, element));
+    },
+
+    /** @id MochiKit.Sortable.onStart */
+    onStart: function (element, draggable) {
+        var self = MochiKit.Sortable;
+        var options = self.options(element);
+        options.lastValue = self.serialize(options.element);
+    },
+
+    /** @id MochiKit.Sortable.onEnd */
+    onEnd: function (element, draggable) {
+        var self = MochiKit.Sortable;
+        self.unmark();
+        var options = self.options(element);
+        if (options.lastValue != self.serialize(options.element)) {
+            options.onUpdate(options.element);
+        }
+    },
+
+    // return all suitable-for-sortable elements in a guaranteed order
+
+    /** @id MochiKit.Sortable.findElements */
+    findElements: function (element, options) {
+        return MochiKit.Sortable.findChildren(
+            element, options.only, options.tree ? true : false, options.tag);
+    },
+
+    /** @id MochiKit.Sortable.findTreeElements */
+    findTreeElements: function (element, options) {
+        return MochiKit.Sortable.findChildren(
+            element, options.only, options.tree ? true : false, options.treeTag);
+    },
+
+    /** @id MochiKit.Sortable.findChildren */
+    findChildren: function (element, only, recursive, tagName) {
+        if (!element.hasChildNodes()) {
+            return null;
+        }
+        tagName = tagName.toUpperCase();
+        if (only) {
+            only = MochiKit.Base.flattenArray([only]);
+        }
+        var elements = [];
+        MochiKit.Base.map(function (e) {
+            if (e.tagName &&
+                e.tagName.toUpperCase() == tagName &&
+               (!only ||
+                MochiKit.Iter.some(only, function (c) {
+                    return MochiKit.DOM.hasElementClass(e, c);
+                }))) {
+                elements.push(e);
+            }
+            if (recursive) {
+                var grandchildren = MochiKit.Sortable.findChildren(e, only, recursive, tagName);
+                if (grandchildren && grandchildren.length > 0) {
+                    elements = elements.concat(grandchildren);
+                }
+            }
+        }, element.childNodes);
+        return elements;
+    },
+
+    /** @id MochiKit.Sortable.onHover */
+    onHover: function (element, dropon, overlap) {
+        if (MochiKit.DOM.isParent(dropon, element)) {
+            return;
+        }
+        var self = MochiKit.Sortable;
+
+        if (overlap > .33 && overlap < .66 && self.options(dropon).tree) {
+            return;
+        } else if (overlap > 0.5) {
+            self.mark(dropon, 'before');
+            if (dropon.previousSibling != element) {
+                var oldParentNode = element.parentNode;
+                element.style.visibility = 'hidden';  // fix gecko rendering
+                dropon.parentNode.insertBefore(element, dropon);
+                if (dropon.parentNode != oldParentNode) {
+                    self.options(oldParentNode).onChange(element);
+                }
+                self.options(dropon.parentNode).onChange(element);
+            }
+        } else {
+            self.mark(dropon, 'after');
+            var nextElement = dropon.nextSibling || null;
+            if (nextElement != element) {
+                var oldParentNode = element.parentNode;
+                element.style.visibility = 'hidden';  // fix gecko rendering
+                dropon.parentNode.insertBefore(element, nextElement);
+                if (dropon.parentNode != oldParentNode) {
+                    self.options(oldParentNode).onChange(element);
+                }
+                self.options(dropon.parentNode).onChange(element);
+            }
+        }
+    },
+
+    _offsetSize: function (element, type) {
+        if (type == 'vertical' || type == 'height') {
+            return element.offsetHeight;
+        } else {
+            return element.offsetWidth;
+        }
+    },
+
+    /** @id MochiKit.Sortable.onEmptyHover */
+    onEmptyHover: function (element, dropon, overlap) {
+        var oldParentNode = element.parentNode;
+        var self = MochiKit.Sortable;
+        var droponOptions = self.options(dropon);
+
+        if (!MochiKit.DOM.isParent(dropon, element)) {
+            var index;
+
+            var children = self.findElements(dropon, {tag: droponOptions.tag,
+                                                      only: droponOptions.only});
+            var child = null;
+
+            if (children) {
+                var offset = self._offsetSize(dropon, droponOptions.overlap) * (1.0 - overlap);
+
+                for (index = 0; index < children.length; index += 1) {
+                    if (offset - self._offsetSize(children[index], droponOptions.overlap) >= 0) {
+                        offset -= self._offsetSize(children[index], droponOptions.overlap);
+                    } else if (offset - (self._offsetSize (children[index], droponOptions.overlap) / 2) >= 0) {
+                        child = index + 1 < children.length ? children[index + 1] : null;
+                        break;
+                    } else {
+                        child = children[index];
+                        break;
+                    }
+                }
+            }
+
+            dropon.insertBefore(element, child);
+
+            self.options(oldParentNode).onChange(element);
+            droponOptions.onChange(element);
+        }
+    },
+
+    /** @id MochiKit.Sortable.unmark */
+    unmark: function () {
+        var m = MochiKit.Sortable._marker;
+        if (m) {
+            MochiKit.Style.hideElement(m);
+        }
+    },
+
+    /** @id MochiKit.Sortable.mark */
+    mark: function (dropon, position) {
+        // mark on ghosting only
+        var d = MochiKit.DOM;
+        var self = MochiKit.Sortable;
+        var sortable = self.options(dropon.parentNode);
+        if (sortable && !sortable.ghosting) {
+            return;
+        }
+
+        if (!self._marker) {
+            self._marker = d.getElement('dropmarker') ||
+                        document.createElement('DIV');
+            MochiKit.Style.hideElement(self._marker);
+            d.addElementClass(self._marker, 'dropmarker');
+            self._marker.style.position = 'absolute';
+            document.getElementsByTagName('body').item(0).appendChild(self._marker);
+        }
+        var offsets = MochiKit.Position.cumulativeOffset(dropon);
+        self._marker.style.left = offsets.x + 'px';
+        self._marker.style.top = offsets.y + 'px';
+
+        if (position == 'after') {
+            if (sortable.overlap == 'horizontal') {
+                self._marker.style.left = (offsets.x + dropon.clientWidth) + 'px';
+            } else {
+                self._marker.style.top = (offsets.y + dropon.clientHeight) + 'px';
+            }
+        }
+        MochiKit.Style.showElement(self._marker);
+    },
+
+    _tree: function (element, options, parent) {
+        var self = MochiKit.Sortable;
+        var children = self.findElements(element, options) || [];
+
+        for (var i = 0; i < children.length; ++i) {
+            var match = children[i].id.match(options.format);
+
+            if (!match) {
+                continue;
+            }
+
+            var child = {
+                id: encodeURIComponent(match ? match[1] : null),
+                element: element,
+                parent: parent,
+                children: [],
+                position: parent.children.length,
+                container: self._findChildrenElement(children[i], options.treeTag.toUpperCase())
+            }
+
+            /* Get the element containing the children and recurse over it */
+            if (child.container) {
+                self._tree(child.container, options, child)
+            }
+
+            parent.children.push (child);
+        }
+
+        return parent;
+    },
+
+    /* Finds the first element of the given tag type within a parent element.
+       Used for finding the first LI[ST] within a L[IST]I[TEM].*/
+    _findChildrenElement: function (element, containerTag) {
+        if (element && element.hasChildNodes) {
+            containerTag = containerTag.toUpperCase();
+            for (var i = 0; i < element.childNodes.length; ++i) {
+                if (element.childNodes[i].tagName.toUpperCase() == containerTag) {
+                    return element.childNodes[i];
+                }
+            }
+        }
+        return null;
+    },
+
+    /** @id MochiKit.Sortable.tree */
+    tree: function (element, options) {
+        element = MochiKit.DOM.getElement(element);
+        var sortableOptions = MochiKit.Sortable.options(element);
+        options = MochiKit.Base.update({
+            tag: sortableOptions.tag,
+            treeTag: sortableOptions.treeTag,
+            only: sortableOptions.only,
+            name: element.id,
+            format: sortableOptions.format
+        }, options || {});
+
+        var root = {
+            id: null,
+            parent: null,
+            children: new Array,
+            container: element,
+            position: 0
+        }
+
+        return MochiKit.Sortable._tree(element, options, root);
+    },
+
+    /**
+     * Specifies the sequence for the Sortable.
+     * @param {Node} element    Element to use as the Sortable.
+     * @param {Object} newSequence    New sequence to use.
+     * @param {Object} options    Options to use fro the Sortable.
+     */
+    setSequence: function (element, newSequence, options) {
+        var self = MochiKit.Sortable;
+        var b = MochiKit.Base;
+        element = MochiKit.DOM.getElement(element);
+        options = b.update(self.options(element), options || {});
+
+        var nodeMap = {};
+        b.map(function (n) {
+            var m = n.id.match(options.format);
+            if (m) {
+                nodeMap[m[1]] = [n, n.parentNode];
+            }
+            n.parentNode.removeChild(n);
+        }, self.findElements(element, options));
+
+        b.map(function (ident) {
+            var n = nodeMap[ident];
+            if (n) {
+                n[1].appendChild(n[0]);
+                delete nodeMap[ident];
+            }
+        }, newSequence);
+    },
+
+    /* Construct a [i] index for a particular node */
+    _constructIndex: function (node) {
+        var index = '';
+        do {
+            if (node.id) {
+                index = '[' + node.position + ']' + index;
+            }
+        } while ((node = node.parent) != null);
+        return index;
+    },
+
+    /** @id MochiKit.Sortable.sequence */
+    sequence: function (element, options) {
+        element = MochiKit.DOM.getElement(element);
+        var self = MochiKit.Sortable;
+        var options = MochiKit.Base.update(self.options(element), options || {});
+
+        return MochiKit.Base.map(function (item) {
+            return item.id.match(options.format) ? item.id.match(options.format)[1] : '';
+        }, MochiKit.DOM.getElement(self.findElements(element, options) || []));
+    },
+
+    /**
+     * Serializes the content of a Sortable. Useful to send this content through a XMLHTTPRequest.
+     * These options override the Sortable options for the serialization only.
+     * @param {Node} element    Element to serialize.
+     * @param {Object} options    Serialization options.
+     */
+    serialize: function (element, options) {
+        element = MochiKit.DOM.getElement(element);
+        var self = MochiKit.Sortable;
+        options = MochiKit.Base.update(self.options(element), options || {});
+        var name = encodeURIComponent(options.name || element.id);
+
+        if (options.tree) {
+            return MochiKit.Base.flattenArray(MochiKit.Base.map(function (item) {
+                return [name + self._constructIndex(item) + "[id]=" +
+                encodeURIComponent(item.id)].concat(item.children.map(arguments.callee));
+            }, self.tree(element, options).children)).join('&');
+        } else {
+            return MochiKit.Base.map(function (item) {
+                return name + "[]=" + encodeURIComponent(item);
+            }, self.sequence(element, options)).join('&');
+        }
+    }
+});
+
+// trunk compatibility
+MochiKit.Sortable.Sortable = MochiKit.Sortable;
diff --git a/frontend/beta/js/MochiKit/Style.js b/frontend/beta/js/MochiKit/Style.js
new file mode 100644
index 0000000..6fdfbfb
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Style.js
@@ -0,0 +1,444 @@
+/***
+
+MochiKit.Style 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005-2006 Bob Ippolito, Beau Hartshorne.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Style');
+    dojo.require('MochiKit.Base');
+    dojo.require('MochiKit.DOM');
+}
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use('MochiKit.Base', []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined') {
+        throw '';
+    }
+} catch (e) {
+    throw 'MochiKit.Style depends on MochiKit.Base!';
+}
+
+try {
+    if (typeof(MochiKit.DOM) == 'undefined') {
+        throw '';
+    }
+} catch (e) {
+    throw 'MochiKit.Style depends on MochiKit.DOM!';
+}
+
+
+if (typeof(MochiKit.Style) == 'undefined') {
+    MochiKit.Style = {};
+}
+
+MochiKit.Style.NAME = 'MochiKit.Style';
+MochiKit.Style.VERSION = '1.4';
+MochiKit.Style.__repr__ = function () {
+    return '[' + this.NAME + ' ' + this.VERSION + ']';
+};
+MochiKit.Style.toString = function () {
+    return this.__repr__();
+};
+
+MochiKit.Style.EXPORT_OK = [];
+
+MochiKit.Style.EXPORT = [
+    'setStyle',
+    'setOpacity',
+    'getStyle',
+    'getElementDimensions',
+    'elementDimensions', // deprecated
+    'setElementDimensions',
+    'getElementPosition',
+    'elementPosition', // deprecated
+    'setElementPosition',
+    'setDisplayForElement',
+    'hideElement',
+    'showElement',
+    'getViewportDimensions',
+    'getViewportPosition',
+    'Dimensions',
+    'Coordinates'
+];
+
+
+/*
+
+    Dimensions
+
+*/
+/** @id MochiKit.Style.Dimensions */
+MochiKit.Style.Dimensions = function (w, h) {
+    this.w = w;
+    this.h = h;
+};
+
+MochiKit.Style.Dimensions.prototype.__repr__ = function () {
+    var repr = MochiKit.Base.repr;
+    return '{w: '  + repr(this.w) + ', h: ' + repr(this.h) + '}';
+};
+
+MochiKit.Style.Dimensions.prototype.toString = function () {
+    return this.__repr__();
+};
+
+
+/*
+
+    Coordinates
+
+*/
+/** @id MochiKit.Style.Coordinates */
+MochiKit.Style.Coordinates = function (x, y) {
+    this.x = x;
+    this.y = y;
+};
+
+MochiKit.Style.Coordinates.prototype.__repr__ = function () {
+    var repr = MochiKit.Base.repr;
+    return '{x: '  + repr(this.x) + ', y: ' + repr(this.y) + '}';
+};
+
+MochiKit.Style.Coordinates.prototype.toString = function () {
+    return this.__repr__();
+};
+
+
+MochiKit.Base.update(MochiKit.Style, {
+
+    /** @id MochiKit.Style.getStyle */
+    getStyle: function (elem, cssProperty) {
+        var dom = MochiKit.DOM;
+        var d = dom._document;
+
+        elem = dom.getElement(elem);
+        cssProperty = MochiKit.Base.camelize(cssProperty);
+
+        if (!elem || elem == d) {
+            return undefined;
+        }
+        if (cssProperty == 'opacity' && elem.filters) {
+            var opacity = (MochiKit.Style.getStyle(elem, 'filter') || '').match(/alpha\(opacity=(.*)\)/);
+            if (opacity && opacity[1]) {
+                return parseFloat(opacity[1]) / 100;
+            }
+            return 1.0;
+        }
+        var value = elem.style ? elem.style[cssProperty] : null;
+        if (!value) {
+            if (d.defaultView && d.defaultView.getComputedStyle) {
+                var css = d.defaultView.getComputedStyle(elem, null);
+                cssProperty = cssProperty.replace(/([A-Z])/g, '-$1'
+                    ).toLowerCase(); // from dojo.style.toSelectorCase
+                value = css ? css.getPropertyValue(cssProperty) : null;
+            } else if (elem.currentStyle) {
+                value = elem.currentStyle[cssProperty];
+            }
+        }
+        if (cssProperty == 'opacity') {
+            value = parseFloat(value);
+        }
+
+        if (/Opera/.test(navigator.userAgent) && (MochiKit.Base.find(['left', 'top', 'right', 'bottom'], cssProperty) != -1)) {
+            if (MochiKit.Style.getStyle(elem, 'position') == 'static') {
+                value = 'auto';
+            }
+        }
+
+        return value == 'auto' ? null : value;
+    },
+
+    /** @id MochiKit.Style.setStyle */
+    setStyle: function (elem, style) {
+        elem = MochiKit.DOM.getElement(elem);
+        for (name in style) {
+            if (name == 'opacity') {
+                MochiKit.Style.setOpacity(elem, style[name]);
+            } else {
+                elem.style[MochiKit.Base.camelize(name)] = style[name];
+            }
+        }
+    },
+
+    /** @id MochiKit.Style.setOpacity */
+    setOpacity: function (elem, o) {
+        elem = MochiKit.DOM.getElement(elem);
+        var self = MochiKit.Style;
+        if (o == 1) {
+            var toSet = /Gecko/.test(navigator.userAgent) && !(/Konqueror|AppleWebKit|KHTML/.test(navigator.userAgent));
+            elem.style["opacity"] = toSet ? 0.999999 : 1.0;
+            if (/MSIE/.test(navigator.userAgent)) {
+                elem.style['filter'] =
+                    self.getStyle(elem, 'filter').replace(/alpha\([^\)]*\)/gi, '');
+            }
+        } else {
+            if (o < 0.00001) {
+                o = 0;
+            }
+            elem.style["opacity"] = o;
+            if (/MSIE/.test(navigator.userAgent)) {
+                elem.style['filter'] =
+                    self.getStyle(elem, 'filter').replace(/alpha\([^\)]*\)/gi, '') + 'alpha(opacity=' + o * 100 + ')';
+            }
+        }
+    },
+
+    /*
+
+        getElementPosition is adapted from YAHOO.util.Dom.getXY v0.9.0.
+        Copyright: Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+        License: BSD, http://developer.yahoo.net/yui/license.txt
+
+    */
+
+    /** @id MochiKit.Style.getElementPosition */
+    getElementPosition: function (elem, /* optional */relativeTo) {
+        var self = MochiKit.Style;
+        var dom = MochiKit.DOM;
+        elem = dom.getElement(elem);
+
+        if (!elem ||
+            (!(elem.x && elem.y) &&
+            (!elem.parentNode === null ||
+            self.getStyle(elem, 'display') == 'none'))) {
+            return undefined;
+        }
+
+        var c = new self.Coordinates(0, 0);
+        var box = null;
+        var parent = null;
+
+        var d = MochiKit.DOM._document;
+        var de = d.documentElement;
+        var b = d.body;
+
+        if (!elem.parentNode && elem.x && elem.y) {
+            /* it's just a MochiKit.Style.Coordinates object */
+            c.x += elem.x || 0;
+            c.y += elem.y || 0;
+        } else if (elem.getBoundingClientRect) { // IE shortcut
+            /*
+
+                The IE shortcut can be off by two. We fix it. See:
+                http://msdn.microsoft.com/workshop/author/dhtml/reference/methods/getboundingclientrect.asp
+
+                This is similar to the method used in
+                MochiKit.Signal.Event.mouse().
+
+            */
+            box = elem.getBoundingClientRect();
+
+            c.x += box.left +
+                (de.scrollLeft || b.scrollLeft) -
+                (de.clientLeft || 0);
+
+            c.y += box.top +
+                (de.scrollTop || b.scrollTop) -
+                (de.clientTop || 0);
+
+        } else if (elem.offsetParent) {
+            c.x += elem.offsetLeft;
+            c.y += elem.offsetTop;
+            parent = elem.offsetParent;
+
+            if (parent != elem) {
+                while (parent) {
+                    c.x += parent.offsetLeft;
+                    c.y += parent.offsetTop;
+                    parent = parent.offsetParent;
+                }
+            }
+
+            /*
+
+                Opera < 9 and old Safari (absolute) incorrectly account for
+                body offsetTop and offsetLeft.
+
+            */
+            var ua = navigator.userAgent.toLowerCase();
+            if ((typeof(opera) != 'undefined' &&
+                parseFloat(opera.version()) < 9) ||
+                (ua.indexOf('AppleWebKit') != -1 &&
+                self.getStyle(elem, 'position') == 'absolute')) {
+
+                c.x -= b.offsetLeft;
+                c.y -= b.offsetTop;
+
+            }
+        }
+
+        if (typeof(relativeTo) != 'undefined') {
+            relativeTo = arguments.callee(relativeTo);
+            if (relativeTo) {
+                c.x -= (relativeTo.x || 0);
+                c.y -= (relativeTo.y || 0);
+            }
+        }
+
+        if (elem.parentNode) {
+            parent = elem.parentNode;
+        } else {
+            parent = null;
+        }
+
+        while (parent) {
+            var tagName = parent.tagName.toUpperCase();
+            if (tagName === 'BODY' || tagName === 'HTML') {
+                break;
+            }
+            var disp = self.getStyle(parent, 'display');
+            // Handle strange Opera bug for some display
+            if (disp != 'inline' && disp != 'table-row') {
+                c.x -= parent.scrollLeft;
+                c.y -= parent.scrollTop;
+            }
+            if (parent.parentNode) {
+                parent = parent.parentNode;
+            } else {
+                parent = null;
+            }
+        }
+
+        return c;
+    },
+
+    /** @id MochiKit.Style.setElementPosition */
+    setElementPosition: function (elem, newPos/* optional */, units) {
+        elem = MochiKit.DOM.getElement(elem);
+        if (typeof(units) == 'undefined') {
+            units = 'px';
+        }
+        var newStyle = {};
+        var isUndefNull = MochiKit.Base.isUndefinedOrNull;
+        if (!isUndefNull(newPos.x)) {
+            newStyle['left'] = newPos.x + units;
+        }
+        if (!isUndefNull(newPos.y)) {
+            newStyle['top'] = newPos.y + units;
+        }
+        MochiKit.DOM.updateNodeAttributes(elem, {'style': newStyle});
+    },
+
+    /** @id MochiKit.Style.getElementDimensions */
+    getElementDimensions: function (elem) {
+        var self = MochiKit.Style;
+        var dom = MochiKit.DOM;
+        if (typeof(elem.w) == 'number' || typeof(elem.h) == 'number') {
+            return new self.Dimensions(elem.w || 0, elem.h || 0);
+        }
+        elem = dom.getElement(elem);
+        if (!elem) {
+            return undefined;
+        }
+        var disp = self.getStyle(elem, 'display');
+        // display can be empty/undefined on WebKit/KHTML
+        if (disp != 'none' && disp !== '' && typeof(disp) != 'undefined') {
+            return new self.Dimensions(elem.offsetWidth || 0,
+                elem.offsetHeight || 0);
+        }
+        var s = elem.style;
+        var originalVisibility = s.visibility;
+        var originalPosition = s.position;
+        s.visibility = 'hidden';
+        s.position = 'absolute';
+        s.display = '';
+        var originalWidth = elem.offsetWidth;
+        var originalHeight = elem.offsetHeight;
+        s.display = 'none';
+        s.position = originalPosition;
+        s.visibility = originalVisibility;
+        return new self.Dimensions(originalWidth, originalHeight);
+    },
+
+    /** @id MochiKit.Style.setElementDimensions */
+    setElementDimensions: function (elem, newSize/* optional */, units) {
+        elem = MochiKit.DOM.getElement(elem);
+        if (typeof(units) == 'undefined') {
+            units = 'px';
+        }
+        var newStyle = {};
+        var isUndefNull = MochiKit.Base.isUndefinedOrNull;
+        if (!isUndefNull(newSize.w)) {
+            newStyle['width'] = newSize.w + units;
+        }
+        if (!isUndefNull(newSize.h)) {
+            newStyle['height'] = newSize.h + units;
+        }
+        MochiKit.DOM.updateNodeAttributes(elem, {'style': newStyle});
+    },
+
+    /** @id MochiKit.Style.setDisplayForElement */
+    setDisplayForElement: function (display, element/*, ...*/) {
+        var elements = MochiKit.Base.extend(null, arguments, 1);
+        var getElement = MochiKit.DOM.getElement;
+        for (var i = 0; i < elements.length; i++) {
+            element = getElement(elements[i]);
+            if (element) {
+                element.style.display = display;
+            }
+        }
+    },
+
+    /** @id MochiKit.Style.getViewportDimensions */
+    getViewportDimensions: function () {
+        var d = new MochiKit.Style.Dimensions();
+
+        var w = MochiKit.DOM._window;
+        var b = MochiKit.DOM._document.body;
+
+        if (w.innerWidth) {
+            d.w = w.innerWidth;
+            d.h = w.innerHeight;
+        } else if (b.parentElement.clientWidth) {
+            d.w = b.parentElement.clientWidth;
+            d.h = b.parentElement.clientHeight;
+        } else if (b && b.clientWidth) {
+            d.w = b.clientWidth;
+            d.h = b.clientHeight;
+        }
+        return d;
+    },
+
+    /** @id MochiKit.Style.getViewportPosition */
+    getViewportPosition: function () {
+        var c = new MochiKit.Style.Coordinates(0, 0);
+        var d = MochiKit.DOM._document;
+        var de = d.documentElement;
+        var db = d.body;
+        if (de && (de.scrollTop || de.scrollLeft)) {
+            c.x = de.scrollLeft;
+            c.y = de.scrollTop;
+        } else if (db) {
+            c.x = db.scrollLeft;
+            c.y = db.scrollTop;
+        }
+        return c;
+    },
+
+    __new__: function () {
+        var m = MochiKit.Base;
+
+        this.elementPosition = this.getElementPosition;
+        this.elementDimensions = this.getElementDimensions;
+
+        this.hideElement = m.partial(this.setDisplayForElement, 'none');
+        this.showElement = m.partial(this.setDisplayForElement, 'block');
+
+        this.EXPORT_TAGS = {
+            ':common': this.EXPORT,
+            ':all': m.concat(this.EXPORT, this.EXPORT_OK)
+        };
+
+        m.nameFunctions(this);
+    }
+});
+
+MochiKit.Style.__new__();
+MochiKit.Base._exportSymbols(this, MochiKit.Style);
diff --git a/frontend/beta/js/MochiKit/Test.js b/frontend/beta/js/MochiKit/Test.js
new file mode 100644
index 0000000..494a5b4
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Test.js
@@ -0,0 +1,181 @@
+/***
+
+MochiKit.Test 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Test');
+    dojo.require('MochiKit.Base');
+}
+
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Base", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) == 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.Test depends on MochiKit.Base!";
+}
+
+if (typeof(MochiKit.Test) == 'undefined') {
+    MochiKit.Test = {};
+}
+
+MochiKit.Test.NAME = "MochiKit.Test";
+MochiKit.Test.VERSION = "1.4";
+MochiKit.Test.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+
+MochiKit.Test.toString = function () {
+    return this.__repr__();
+};
+
+
+MochiKit.Test.EXPORT = ["runTests"];
+MochiKit.Test.EXPORT_OK = [];
+
+MochiKit.Test.runTests = function (obj) {
+    if (typeof(obj) == "string") {
+        obj = JSAN.use(obj);
+    }
+    var suite = new MochiKit.Test.Suite();
+    suite.run(obj);
+};
+
+MochiKit.Test.Suite = function () {
+    this.testIndex = 0;
+    MochiKit.Base.bindMethods(this);
+};
+
+MochiKit.Test.Suite.prototype = {
+    run: function (obj) {
+        try {
+            obj(this);
+        } catch (e) {
+            this.traceback(e);
+        }
+    },
+    traceback: function (e) {
+        var items = MochiKit.Iter.sorted(MochiKit.Base.items(e));
+        print("not ok " + this.testIndex + " - Error thrown");
+        for (var i = 0; i < items.length; i++) {
+            var kv = items[i];
+            if (kv[0] == "stack") {
+                kv[1] = kv[1].split(/\n/)[0];
+            }
+            this.print("# " + kv.join(": "));
+        }
+    },
+    print: function (s) {
+        print(s);
+    },
+    is: function (got, expected, /* optional */message) {
+        var res = 1;
+        var msg = null;
+        try {
+            res = MochiKit.Base.compare(got, expected);
+        } catch (e) {
+            msg = "Can not compare " + typeof(got) + ":" + typeof(expected);
+        }
+        if (res) {
+            msg = "Expected value did not compare equal";
+        }
+        if (!res) {
+            return this.testResult(true, message);
+        }
+        return this.testResult(false, message,
+            [[msg], ["got:", got], ["expected:", expected]]);
+    },
+
+    testResult: function (pass, msg, failures) {
+        this.testIndex += 1;
+        if (pass) {
+            this.print("ok " + this.testIndex + " - " + msg);
+            return;
+        }
+        this.print("not ok " + this.testIndex + " - " + msg);
+        if (failures) {
+            for (var i = 0; i < failures.length; i++) {
+                this.print("# " + failures[i].join(" "));
+            }
+        }
+    },
+
+    isDeeply: function (got, expected, /* optional */message) {
+        var m = MochiKit.Base;
+        var res = 1;
+        try {
+            res = m.compare(got, expected);
+        } catch (e) {
+            // pass
+        }
+        if (res === 0) {
+            return this.ok(true, message);
+        }
+        var gk = m.keys(got);
+        var ek = m.keys(expected);
+        gk.sort();
+        ek.sort();
+        if (m.compare(gk, ek)) {
+            // differing keys
+            var cmp = {};
+            var i;
+            for (i = 0; i < gk.length; i++) {
+                cmp[gk[i]] = "got";
+            }
+            for (i = 0; i < ek.length; i++) {
+                if (ek[i] in cmp) {
+                    delete cmp[ek[i]];
+                } else {
+                    cmp[ek[i]] = "expected";
+                }
+            }
+            var diffkeys = m.keys(cmp);
+            diffkeys.sort();
+            var gotkeys = [];
+            var expkeys = [];
+            while (diffkeys.length) {
+                var k = diffkeys.shift();
+                if (k in Object.prototype) {
+                    continue;
+                }
+                (cmp[k] == "got" ? gotkeys : expkeys).push(k);
+            }
+
+
+        }
+
+        return this.testResult((!res), msg,
+            (msg ? [["got:", got], ["expected:", expected]] : undefined)
+        );
+    },
+
+    ok: function (res, message) {
+        return this.testResult(res, message);
+    }
+};
+
+MochiKit.Test.__new__ = function () {
+    var m = MochiKit.Base;
+
+    this.EXPORT_TAGS = {
+        ":common": this.EXPORT,
+        ":all": m.concat(this.EXPORT, this.EXPORT_OK)
+    };
+
+    m.nameFunctions(this);
+
+};
+
+MochiKit.Test.__new__();
+
+MochiKit.Base._exportSymbols(this, MochiKit.Test);
diff --git a/frontend/beta/js/MochiKit/Visual.js b/frontend/beta/js/MochiKit/Visual.js
new file mode 100644
index 0000000..914b3b4
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/Visual.js
@@ -0,0 +1,1976 @@
+/***
+
+MochiKit.Visual 1.4
+
+See <http://mochikit.com/> for documentation, downloads, license, etc.
+
+(c) 2005 Bob Ippolito and others.  All rights Reserved.
+
+***/
+
+if (typeof(dojo) != 'undefined') {
+    dojo.provide('MochiKit.Visual');
+    dojo.require('MochiKit.Base');
+    dojo.require('MochiKit.DOM');
+    dojo.require('MochiKit.Style');
+    dojo.require('MochiKit.Color');
+    dojo.require('MochiKit.Position');
+}
+
+if (typeof(JSAN) != 'undefined') {
+    JSAN.use("MochiKit.Base", []);
+    JSAN.use("MochiKit.DOM", []);
+    JSAN.use("MochiKit.Style", []);
+    JSAN.use("MochiKit.Color", []);
+    JSAN.use("MochiKit.Position", []);
+}
+
+try {
+    if (typeof(MochiKit.Base) === 'undefined' ||
+        typeof(MochiKit.DOM) === 'undefined' ||
+        typeof(MochiKit.Style) === 'undefined' ||
+        typeof(MochiKit.Position) === 'undefined' ||
+        typeof(MochiKit.Color) === 'undefined') {
+        throw "";
+    }
+} catch (e) {
+    throw "MochiKit.Visual depends on MochiKit.Base, MochiKit.DOM, MochiKit.Style, MochiKit.Position and MochiKit.Color!";
+}
+
+if (typeof(MochiKit.Visual) == "undefined") {
+    MochiKit.Visual = {};
+}
+
+MochiKit.Visual.NAME = "MochiKit.Visual";
+MochiKit.Visual.VERSION = "1.4";
+
+MochiKit.Visual.__repr__ = function () {
+    return "[" + this.NAME + " " + this.VERSION + "]";
+};
+
+MochiKit.Visual.toString = function () {
+    return this.__repr__();
+};
+
+MochiKit.Visual._RoundCorners = function (e, options) {
+    e = MochiKit.DOM.getElement(e);
+    this._setOptions(options);
+    if (this.options.__unstable__wrapElement) {
+        e = this._doWrap(e);
+    }
+
+    var color = this.options.color;
+    var C = MochiKit.Color.Color;
+    if (this.options.color === "fromElement") {
+        color = C.fromBackground(e);
+    } else if (!(color instanceof C)) {
+        color = C.fromString(color);
+    }
+    this.isTransparent = (color.asRGB().a <= 0);
+
+    var bgColor = this.options.bgColor;
+    if (this.options.bgColor === "fromParent") {
+        bgColor = C.fromBackground(e.offsetParent);
+    } else if (!(bgColor instanceof C)) {
+        bgColor = C.fromString(bgColor);
+    }
+
+    this._roundCornersImpl(e, color, bgColor);
+};
+
+MochiKit.Visual._RoundCorners.prototype = {
+    _doWrap: function (e) {
+        var parent = e.parentNode;
+        var doc = MochiKit.DOM.currentDocument();
+        if (typeof(doc.defaultView) === "undefined"
+            || doc.defaultView === null) {
+            return e;
+        }
+        var style = doc.defaultView.getComputedStyle(e, null);
+        if (typeof(style) === "undefined" || style === null) {
+            return e;
+        }
+        var wrapper = MochiKit.DOM.DIV({"style": {
+            display: "block",
+            // convert padding to margin
+            marginTop: style.getPropertyValue("padding-top"),
+            marginRight: style.getPropertyValue("padding-right"),
+            marginBottom: style.getPropertyValue("padding-bottom"),
+            marginLeft: style.getPropertyValue("padding-left"),
+            // remove padding so the rounding looks right
+            padding: "0px"
+            /*
+            paddingRight: "0px",
+            paddingLeft: "0px"
+            */
+        }});
+        wrapper.innerHTML = e.innerHTML;
+        e.innerHTML = "";
+        e.appendChild(wrapper);
+        return e;
+    },
+
+    _roundCornersImpl: function (e, color, bgColor) {
+        if (this.options.border) {
+            this._renderBorder(e, bgColor);
+        }
+        if (this._isTopRounded()) {
+            this._roundTopCorners(e, color, bgColor);
+        }
+        if (this._isBottomRounded()) {
+            this._roundBottomCorners(e, color, bgColor);
+        }
+    },
+
+    _renderBorder: function (el, bgColor) {
+        var borderValue = "1px solid " + this._borderColor(bgColor);
+        var borderL = "border-left: "  + borderValue;
+        var borderR = "border-right: " + borderValue;
+        var style = "style='" + borderL + ";" + borderR +  "'";
+        el.innerHTML = "<div " + style + ">" + el.innerHTML + "</div>";
+    },
+
+    _roundTopCorners: function (el, color, bgColor) {
+        var corner = this._createCorner(bgColor);
+        for (var i = 0; i < this.options.numSlices; i++) {
+            corner.appendChild(
+                this._createCornerSlice(color, bgColor, i, "top")
+            );
+        }
+        el.style.paddingTop = 0;
+        el.insertBefore(corner, el.firstChild);
+    },
+
+    _roundBottomCorners: function (el, color, bgColor) {
+        var corner = this._createCorner(bgColor);
+        for (var i = (this.options.numSlices - 1); i >= 0; i--) {
+            corner.appendChild(
+                this._createCornerSlice(color, bgColor, i, "bottom")
+            );
+        }
+        el.style.paddingBottom = 0;
+        el.appendChild(corner);
+    },
+
+    _createCorner: function (bgColor) {
+        var dom = MochiKit.DOM;
+        return dom.DIV({style: {backgroundColor: bgColor.toString()}});
+    },
+
+    _createCornerSlice: function (color, bgColor, n, position) {
+        var slice = MochiKit.DOM.SPAN();
+
+        var inStyle = slice.style;
+        inStyle.backgroundColor = color.toString();
+        inStyle.display = "block";
+        inStyle.height = "1px";
+        inStyle.overflow = "hidden";
+        inStyle.fontSize = "1px";
+
+        var borderColor = this._borderColor(color, bgColor);
+        if (this.options.border && n === 0) {
+            inStyle.borderTopStyle = "solid";
+            inStyle.borderTopWidth = "1px";
+            inStyle.borderLeftWidth = "0px";
+            inStyle.borderRightWidth = "0px";
+            inStyle.borderBottomWidth = "0px";
+            // assumes css compliant box model
+            inStyle.height = "0px";
+            inStyle.borderColor = borderColor.toString();
+        } else if (borderColor) {
+            inStyle.borderColor = borderColor.toString();
+            inStyle.borderStyle = "solid";
+            inStyle.borderWidth = "0px 1px";
+        }
+
+        if (!this.options.compact && (n == (this.options.numSlices - 1))) {
+            inStyle.height = "2px";
+        }
+
+        this._setMargin(slice, n, position);
+        this._setBorder(slice, n, position);
+
+        return slice;
+    },
+
+    _setOptions: function (options) {
+        this.options = {
+            corners: "all",
+            color: "fromElement",
+            bgColor: "fromParent",
+            blend: true,
+            border: false,
+            compact: false,
+            __unstable__wrapElement: false
+        };
+        MochiKit.Base.update(this.options, options);
+
+        this.options.numSlices = (this.options.compact ? 2 : 4);
+    },
+
+    _whichSideTop: function () {
+        var corners = this.options.corners;
+        if (this._hasString(corners, "all", "top")) {
+            return "";
+        }
+
+        var has_tl = (corners.indexOf("tl") != -1);
+        var has_tr = (corners.indexOf("tr") != -1);
+        if (has_tl && has_tr) {
+            return "";
+        }
+        if (has_tl) {
+            return "left";
+        }
+        if (has_tr) {
+            return "right";
+        }
+        return "";
+    },
+
+    _whichSideBottom: function () {
+        var corners = this.options.corners;
+        if (this._hasString(corners, "all", "bottom")) {
+            return "";
+        }
+
+        var has_bl = (corners.indexOf('bl') != -1);
+        var has_br = (corners.indexOf('br') != -1);
+        if (has_bl && has_br) {
+            return "";
+        }
+        if (has_bl) {
+            return "left";
+        }
+        if (has_br) {
+            return "right";
+        }
+        return "";
+    },
+
+    _borderColor: function (color, bgColor) {
+        if (color == "transparent") {
+            return bgColor;
+        } else if (this.options.border) {
+            return this.options.border;
+        } else if (this.options.blend) {
+            return bgColor.blendedColor(color);
+        }
+        return "";
+    },
+
+
+    _setMargin: function (el, n, corners) {
+        var marginSize = this._marginSize(n) + "px";
+        var whichSide = (
+            corners == "top" ? this._whichSideTop() : this._whichSideBottom()
+        );
+        var style = el.style;
+
+        if (whichSide == "left") {
+            style.marginLeft = marginSize;
+            style.marginRight = "0px";
+        } else if (whichSide == "right") {
+            style.marginRight = marginSize;
+            style.marginLeft = "0px";
+        } else {
+            style.marginLeft = marginSize;
+            style.marginRight = marginSize;
+        }
+    },
+
+    _setBorder: function (el, n, corners) {
+        var borderSize = this._borderSize(n) + "px";
+        var whichSide = (
+            corners == "top" ? this._whichSideTop() : this._whichSideBottom()
+        );
+
+        var style = el.style;
+        if (whichSide == "left") {
+            style.borderLeftWidth = borderSize;
+            style.borderRightWidth = "0px";
+        } else if (whichSide == "right") {
+            style.borderRightWidth = borderSize;
+            style.borderLeftWidth = "0px";
+        } else {
+            style.borderLeftWidth = borderSize;
+            style.borderRightWidth = borderSize;
+        }
+    },
+
+    _marginSize: function (n) {
+        if (this.isTransparent) {
+            return 0;
+        }
+
+        var o = this.options;
+        if (o.compact && o.blend) {
+            var smBlendedMarginSizes = [1, 0];
+            return smBlendedMarginSizes[n];
+        } else if (o.compact) {
+            var compactMarginSizes = [2, 1];
+            return compactMarginSizes[n];
+        } else if (o.blend) {
+            var blendedMarginSizes = [3, 2, 1, 0];
+            return blendedMarginSizes[n];
+        } else {
+            var marginSizes = [5, 3, 2, 1];
+            return marginSizes[n];
+        }
+    },
+
+    _borderSize: function (n) {
+        var o = this.options;
+        var borderSizes;
+        if (o.compact && (o.blend || this.isTransparent)) {
+            return 1;
+        } else if (o.compact) {
+            borderSizes = [1, 0];
+        } else if (o.blend) {
+            borderSizes = [2, 1, 1, 1];
+        } else if (o.border) {
+            borderSizes = [0, 2, 0, 0];
+        } else if (this.isTransparent) {
+            borderSizes = [5, 3, 2, 1];
+        } else {
+            return 0;
+        }
+        return borderSizes[n];
+    },
+
+    _hasString: function (str) {
+        for (var i = 1; i< arguments.length; i++) {
+            if (str.indexOf(arguments[i]) != -1) {
+                return true;
+            }
+        }
+        return false;
+    },
+
+    _isTopRounded: function () {
+        return this._hasString(this.options.corners,
+            "all", "top", "tl", "tr"
+        );
+    },
+
+    _isBottomRounded: function () {
+        return this._hasString(this.options.corners,
+            "all", "bottom", "bl", "br"
+        );
+    },
+
+    _hasSingleTextChild: function (el) {
+        return (el.childNodes.length == 1 && el.childNodes[0].nodeType == 3);
+    }
+};
+
+/** @id MochiKit.Visual.roundElement */
+MochiKit.Visual.roundElement = function (e, options) {
+    new MochiKit.Visual._RoundCorners(e, options);
+};
+
+/** @id MochiKit.Visual.roundClass */
+MochiKit.Visual.roundClass = function (tagName, className, options) {
+    var elements = MochiKit.DOM.getElementsByTagAndClassName(
+        tagName, className
+    );
+    for (var i = 0; i < elements.length; i++) {
+        MochiKit.Visual.roundElement(elements[i], options);
+    }
+};
+
+/** @id MochiKit.Visual.tagifyText */
+MochiKit.Visual.tagifyText = function (element, /* optional */tagifyStyle) {
+    /***
+
+    Change a node text to character in tags.
+
+    @param tagifyStyle: the style to apply to character nodes, default to
+    'position: relative'.
+
+    ***/
+    tagifyStyle = tagifyStyle || 'position:relative';
+    if (/MSIE/.test(navigator.userAgent)) {
+        tagifyStyle += ';zoom:1';
+    }
+    element = MochiKit.DOM.getElement(element);
+    var ma = MochiKit.Base.map;
+    ma(function (child) {
+        if (child.nodeType == 3) {
+            ma(function (character) {
+                element.insertBefore(
+                    MochiKit.DOM.SPAN({style: tagifyStyle},
+                        character == ' ' ? String.fromCharCode(160) : character), child);
+            }, child.nodeValue.split(''));
+            MochiKit.DOM.removeElement(child);
+        }
+    }, element.childNodes);
+};
+
+/** @id MochiKit.Visual.forceRerendering */
+MochiKit.Visual.forceRerendering = function (element) {
+    try {
+        element = MochiKit.DOM.getElement(element);
+        var n = document.createTextNode(' ');
+        element.appendChild(n);
+        element.removeChild(n);
+    } catch(e) {
+    }
+};
+
+/** @id MochiKit.Visual.multiple */
+MochiKit.Visual.multiple = function (elements, effect, /* optional */options) {
+    /***
+
+    Launch the same effect subsequently on given elements.
+
+    ***/
+    options = MochiKit.Base.update({
+        speed: 0.1, delay: 0.0
+    }, options || {});
+    var masterDelay = options.delay;
+    var index = 0;
+    MochiKit.Base.map(function (innerelement) {
+        options.delay = index * options.speed + masterDelay;
+        new effect(innerelement, options);
+        index += 1;
+    }, elements);
+};
+
+MochiKit.Visual.PAIRS = {
+    'slide': ['slideDown', 'slideUp'],
+    'blind': ['blindDown', 'blindUp'],
+    'appear': ['appear', 'fade'],
+    'size': ['grow', 'shrink']
+};
+
+/** @id MochiKit.Visual.toggle */
+MochiKit.Visual.toggle = function (element, /* optional */effect, /* optional */options) {
+    /***
+
+    Toggle an item between two state depending of its visibility, making
+    a effect between these states. Default  effect is 'appear', can be
+    'slide' or 'blind'.
+
+    ***/
+    element = MochiKit.DOM.getElement(element);
+    effect = (effect || 'appear').toLowerCase();
+    options = MochiKit.Base.update({
+        queue: {position: 'end', scope: (element.id || 'global'), limit: 1}
+    }, options || {});
+    var v = MochiKit.Visual;
+    v[element.style.display != 'none' ?
+      v.PAIRS[effect][1] : v.PAIRS[effect][0]](element, options);
+};
+
+/***
+
+Transitions: define functions calculating variations depending of a position.
+
+***/
+
+MochiKit.Visual.Transitions = {};
+
+/** @id MochiKit.Visual.Transitions.linear */
+MochiKit.Visual.Transitions.linear = function (pos) {
+    return pos;
+};
+
+/** @id MochiKit.Visual.Transitions.sinoidal */
+MochiKit.Visual.Transitions.sinoidal = function (pos) {
+    return (-Math.cos(pos*Math.PI)/2) + 0.5;
+};
+
+/** @id MochiKit.Visual.Transitions.reverse */
+MochiKit.Visual.Transitions.reverse = function (pos) {
+    return 1 - pos;
+};
+
+/** @id MochiKit.Visual.Transitions.flicker */
+MochiKit.Visual.Transitions.flicker = function (pos) {
+    return ((-Math.cos(pos*Math.PI)/4) + 0.75) + Math.random()/4;
+};
+
+/** @id MochiKit.Visual.Transitions.wobble */
+MochiKit.Visual.Transitions.wobble = function (pos) {
+    return (-Math.cos(pos*Math.PI*(9*pos))/2) + 0.5;
+};
+
+/** @id MochiKit.Visual.Transitions.pulse */
+MochiKit.Visual.Transitions.pulse = function (pos) {
+    return (Math.floor(pos*10) % 2 === 0 ?
+        (pos*10 - Math.floor(pos*10)) : 1 - (pos*10 - Math.floor(pos*10)));
+};
+
+/** @id MochiKit.Visual.Transitions.none */
+MochiKit.Visual.Transitions.none = function (pos) {
+    return 0;
+};
+
+/** @id MochiKit.Visual.Transitions.full */
+MochiKit.Visual.Transitions.full = function (pos) {
+    return 1;
+};
+
+/***
+
+Core effects
+
+***/
+
+MochiKit.Visual.ScopedQueue = function () {
+    var cls = arguments.callee;
+    if (!(this instanceof cls)) {
+        return new cls();
+    }
+    this.__init__();
+};
+
+MochiKit.Base.update(MochiKit.Visual.ScopedQueue.prototype, {
+    __init__: function () {
+        this.effects = [];
+        this.interval = null;
+    },
+
+    /** @id MochiKit.Visual.ScopedQueue.prototype.add */
+    add: function (effect) {
+        var timestamp = new Date().getTime();
+
+        var position = (typeof(effect.options.queue) == 'string') ?
+            effect.options.queue : effect.options.queue.position;
+
+        var ma = MochiKit.Base.map;
+        switch (position) {
+            case 'front':
+                // move unstarted effects after this effect
+                ma(function (e) {
+                    if (e.state == 'idle') {
+                        e.startOn += effect.finishOn;
+                        e.finishOn += effect.finishOn;
+                    }
+                }, this.effects);
+                break;
+            case 'end':
+                var finish;
+                // start effect after last queued effect has finished
+                ma(function (e) {
+                    var i = e.finishOn;
+                    if (i >= (finish || i)) {
+                        finish = i;
+                    }
+                }, this.effects);
+                timestamp = finish || timestamp;
+                break;
+            case 'break':
+                ma(function (e) {
+                    e.finalize();
+                }, this.effects);
+                break;
+        }
+
+        effect.startOn += timestamp;
+        effect.finishOn += timestamp;
+        if (!effect.options.queue.limit ||
+            this.effects.length < effect.options.queue.limit) {
+            this.effects.push(effect);
+        }
+
+        if (!this.interval) {
+            this.interval = this.startLoop(MochiKit.Base.bind(this.loop, this),
+                                        40);
+        }
+    },
+
+    /** @id MochiKit.Visual.ScopedQueue.prototype.startLoop */
+    startLoop: function (func, interval) {
+        return setInterval(func, interval);
+    },
+
+    /** @id MochiKit.Visual.ScopedQueue.prototype.remove */
+    remove: function (effect) {
+        this.effects = MochiKit.Base.filter(function (e) {
+            return e != effect;
+        }, this.effects);
+        if (!this.effects.length) {
+            this.stopLoop(this.interval);
+            this.interval = null;
+        }
+    },
+
+    /** @id MochiKit.Visual.ScopedQueue.prototype.stopLoop */
+    stopLoop: function (interval) {
+        clearInterval(interval);
+    },
+
+    /** @id MochiKit.Visual.ScopedQueue.prototype.loop */
+    loop: function () {
+        var timePos = new Date().getTime();
+        MochiKit.Base.map(function (effect) {
+            effect.loop(timePos);
+        }, this.effects);
+    }
+});
+
+MochiKit.Visual.Queues = {
+    instances: {},
+
+    get: function (queueName) {
+        if (typeof(queueName) != 'string') {
+            return queueName;
+        }
+
+        if (!this.instances[queueName]) {
+            this.instances[queueName] = new MochiKit.Visual.ScopedQueue();
+        }
+        return this.instances[queueName];
+    }
+};
+
+MochiKit.Visual.Queue = MochiKit.Visual.Queues.get('global');
+
+MochiKit.Visual.DefaultOptions = {
+    transition: MochiKit.Visual.Transitions.sinoidal,
+    duration: 1.0,  // seconds
+    fps: 25.0,  // max. 25fps due to MochiKit.Visual.Queue implementation
+    sync: false,  // true for combining
+    from: 0.0,
+    to: 1.0,
+    delay: 0.0,
+    queue: 'parallel'
+};
+
+MochiKit.Visual.Base = function () {};
+
+MochiKit.Visual.Base.prototype = {
+    /***
+
+    Basic class for all Effects. Define a looping mechanism called for each step
+    of an effect. Don't instantiate it, only subclass it.
+
+    ***/
+
+    __class__ : MochiKit.Visual.Base,
+
+    /** @id MochiKit.Visual.Base.prototype.start */
+    start: function (options) {
+        var v = MochiKit.Visual;
+        this.options = MochiKit.Base.setdefault(options || {},
+                                                v.DefaultOptions);
+        this.currentFrame = 0;
+        this.state = 'idle';
+        this.startOn = this.options.delay*1000;
+        this.finishOn = this.startOn + (this.options.duration*1000);
+        this.event('beforeStart');
+        if (!this.options.sync) {
+            v.Queues.get(typeof(this.options.queue) == 'string' ?
+                'global' : this.options.queue.scope).add(this);
+        }
+    },
+
+    /** @id MochiKit.Visual.Base.prototype.loop */
+    loop: function (timePos) {
+        if (timePos >= this.startOn) {
+            if (timePos >= this.finishOn) {
+                return this.finalize();
+            }
+            var pos = (timePos - this.startOn) / (this.finishOn - this.startOn);
+            var frame =
+                Math.round(pos * this.options.fps * this.options.duration);
+            if (frame > this.currentFrame) {
+                this.render(pos);
+                this.currentFrame = frame;
+            }
+        }
+    },
+
+    /** @id MochiKit.Visual.Base.prototype.render */
+    render: function (pos) {
+        if (this.state == 'idle') {
+            this.state = 'running';
+            this.event('beforeSetup');
+            this.setup();
+            this.event('afterSetup');
+        }
+        if (this.state == 'running') {
+            if (this.options.transition) {
+                pos = this.options.transition(pos);
+            }
+            pos *= (this.options.to - this.options.from);
+            pos += this.options.from;
+            this.event('beforeUpdate');
+            this.update(pos);
+            this.event('afterUpdate');
+        }
+    },
+
+    /** @id MochiKit.Visual.Base.prototype.cancel */
+    cancel: function () {
+        if (!this.options.sync) {
+            MochiKit.Visual.Queues.get(typeof(this.options.queue) == 'string' ?
+                'global' : this.options.queue.scope).remove(this);
+        }
+        this.state = 'finished';
+    },
+
+    /** @id MochiKit.Visual.Base.prototype.finalize */
+    finalize: function () {
+        this.render(1.0);
+        this.cancel();
+        this.event('beforeFinish');
+        this.finish();
+        this.event('afterFinish');
+    },
+
+    setup: function () {
+    },
+
+    finish: function () {
+    },
+
+    update: function (position) {
+    },
+
+    /** @id MochiKit.Visual.Base.prototype.event */
+    event: function (eventName) {
+        if (this.options[eventName + 'Internal']) {
+            this.options[eventName + 'Internal'](this);
+        }
+        if (this.options[eventName]) {
+            this.options[eventName](this);
+        }
+    },
+
+    /** @id MochiKit.Visual.Base.prototype.repr */
+    repr: function () {
+        return '[' + this.__class__.NAME + ', options:' +
+               MochiKit.Base.repr(this.options) + ']';
+    }
+};
+
+    /** @id MochiKit.Visual.Parallel */
+MochiKit.Visual.Parallel = function (effects, options) {
+    var cls = arguments.callee;
+    if (!(this instanceof cls)) {
+        return new cls(effects, options);
+    }
+
+    this.__init__(effects, options);
+};
+
+MochiKit.Visual.Parallel.prototype = new MochiKit.Visual.Base();
+
+MochiKit.Base.update(MochiKit.Visual.Parallel.prototype, {
+    /***
+
+    Run multiple effects at the same time.
+
+    ***/
+
+    __class__ : MochiKit.Visual.Parallel,
+
+    __init__: function (effects, options) {
+        this.effects = effects || [];
+        this.start(options);
+    },
+
+    /** @id MochiKit.Visual.Parallel.prototype.update */
+    update: function (position) {
+        MochiKit.Base.map(function (effect) {
+            effect.render(position);
+        }, this.effects);
+    },
+
+    /** @id MochiKit.Visual.Parallel.prototype.finish */
+    finish: function () {
+        MochiKit.Base.map(function (effect) {
+            effect.finalize();
+        }, this.effects);
+    }
+});
+
+/** @id MochiKit.Visual.Opacity */
+MochiKit.Visual.Opacity = function (element, options) {
+    var cls = arguments.callee;
+    if (!(this instanceof cls)) {
+        return new cls(element, options);
+    }
+    this.__init__(element, options);
+};
+
+MochiKit.Visual.Opacity.prototype = new MochiKit.Visual.Base();
+
+MochiKit.Base.update(MochiKit.Visual.Opacity.prototype, {
+    /***
+
+    Change the opacity of an element.
+
+    @param options: 'from' and 'to' change the starting and ending opacities.
+    Must be between 0.0 and 1.0. Default to current opacity and 1.0.
+
+    ***/
+
+    __class__ : MochiKit.Visual.Opacity,
+
+    __init__: function (element, /* optional */options) {
+        var b = MochiKit.Base;
+        var s = MochiKit.Style;
+        this.element = MochiKit.DOM.getElement(element);
+        // make this work on IE on elements without 'layout'
+        if (this.element.currentStyle &&
+            (!this.element.currentStyle.hasLayout)) {
+            s.setStyle(this.element, {zoom: 1});
+        }
+        options = b.update({
+            from: s.getStyle(this.element, 'opacity') || 0.0,
+            to: 1.0
+        }, options || {});
+        this.start(options);
+    },
+
+    /** @id MochiKit.Visual.Opacity.prototype.update */
+    update: function (position) {
+        MochiKit.Style.setStyle(this.element, {'opacity': position});
+    }
+});
+
+/**  @id MochiKit.Visual.Move.prototype */
+MochiKit.Visual.Move = function (element, options) {
+    var cls = arguments.callee;
+    if (!(this instanceof cls)) {
+        return new cls(element, options);
+    }
+    this.__init__(element, options);
+};
+
+MochiKit.Visual.Move.prototype = new MochiKit.Visual.Base();
+
+MochiKit.Base.update(MochiKit.Visual.Move.prototype, {
+    /***
+
+    Move an element between its current position to a defined position
+
+    @param options: 'x' and 'y' for final positions, default to 0, 0.
+
+    ***/
+
+    __class__ : MochiKit.Visual.Move,
+
+    __init__: function (element, /* optional */options) {
+        this.element = MochiKit.DOM.getElement(element);
+        options = MochiKit.Base.update({
+            x: 0,
+            y: 0,
+            mode: 'relative'
+        }, options || {});
+        this.start(options);
+    },
+
+    /** @id MochiKit.Visual.Move.prototype.setup */
+    setup: function () {
+        // Bug in Opera: Opera returns the 'real' position of a static element
+        // or relative element that does not have top/left explicitly set.
+        // ==> Always set top and left for position relative elements in your
+        // stylesheets (to 0 if you do not need them)
+        MochiKit.DOM.makePositioned(this.element);
+
+        var s = this.element.style;
+        var originalVisibility = s.visibility;
+        var originalDisplay = s.display;
+        if (originalDisplay == 'none') {
+            s.visibility = 'hidden';
+            s.display = '';
+        }
+
+        this.originalLeft = parseFloat(MochiKit.Style.getStyle(this.element, 'left') || '0');
+        this.originalTop = parseFloat(MochiKit.Style.getStyle(this.element, 'top') || '0');
+
+        if (this.options.mode == 'absolute') {
+            // absolute movement, so we need to calc deltaX and deltaY
+            this.options.x -= this.originalLeft;
+            this.options.y -= this.originalTop;
+        }
+        if (originalDisplay == 'none') {
+            s.visibility = originalVisibility;
+            s.display = originalDisplay;
+        }
+    },
+
+    /** @id MochiKit.Visual.Move.prototype.update */
+    update: function (position) {
+        MochiKit.Style.setStyle(this.element, {
+            left: Math.round(this.options.x * position + this.originalLeft) + 'px',
+            top: Math.round(this.options.y * position + this.originalTop) + 'px'
+        });
+    }
+});
+
+/** @id MochiKit.Visual.Scale */
+MochiKit.Visual.Scale = function (element, percent, options) {
+    var cls = arguments.callee;
+    if (!(this instanceof cls)) {
+        return new cls(element, percent, options);
+    }
+    this.__init__(element, percent, options);
+};
+
+MochiKit.Visual.Scale.prototype = new MochiKit.Visual.Base();
+
+MochiKit.Base.update(MochiKit.Visual.Scale.prototype, {
+    /***
+
+    Change the size of an element.
+
+    @param percent: final_size = percent*original_size
+
+    @param options: several options changing scale behaviour
+
+    ***/
+
+    __class__ : MochiKit.Visual.Scale,
+
+    __init__: function (element, percent, /* optional */options) {
+        this.element = MochiKit.DOM.getElement(element);
+        options = MochiKit.Base.update({
+            scaleX: true,
+            scaleY: true,
+            scaleContent: true,
+            scaleFromCenter: false,
+            scaleMode: 'box',  // 'box' or 'contents' or {} with provided values
+            scaleFrom: 100.0,
+            scaleTo: percent
+        }, options || {});
+        this.start(options);
+    },
+
+    /** @id MochiKit.Visual.Scale.prototype.setup */
+    setup: function () {
+        this.restoreAfterFinish = this.options.restoreAfterFinish || false;
+        this.elementPositioning = MochiKit.Style.getStyle(this.element,
+                                                        'position');
+
+        var ma = MochiKit.Base.map;
+        var b = MochiKit.Base.bind;
+        this.originalStyle = {};
+        ma(b(function (k) {
+                this.originalStyle[k] = this.element.style[k];
+            }, this), ['top', 'left', 'width', 'height', 'fontSize']);
+
+        this.originalTop = this.element.offsetTop;
+        this.originalLeft = this.element.offsetLeft;
+
+        var fontSize = MochiKit.Style.getStyle(this.element,
+                                             'font-size') || '100%';
+        ma(b(function (fontSizeType) {
+            if (fontSize.indexOf(fontSizeType) > 0) {
+                this.fontSize = parseFloat(fontSize);
+                this.fontSizeType = fontSizeType;
+            }
+        }, this), ['em', 'px', '%']);
+
+        this.factor = (this.options.scaleTo - this.options.scaleFrom)/100;
+
+        if (/^content/.test(this.options.scaleMode)) {
+            this.dims = [this.element.scrollHeight, this.element.scrollWidth];
+        } else if (this.options.scaleMode == 'box') {
+            this.dims = [this.element.offsetHeight, this.element.offsetWidth];
+        } else {
+            this.dims = [this.options.scaleMode.originalHeight,
+                         this.options.scaleMode.originalWidth];
+        }
+    },
+
+    /** @id MochiKit.Visual.Scale.prototype.update */
+    update: function (position) {
+        var currentScale = (this.options.scaleFrom/100.0) +
+                           (this.factor * position);
+        if (this.options.scaleContent && this.fontSize) {
+            MochiKit.Style.setStyle(this.element, {
+                fontSize: this.fontSize * currentScale + this.fontSizeType
+            });
+        }
+        this.setDimensions(this.dims[0] * currentScale,
+                           this.dims[1] * currentScale);
+    },
+
+    /** @id MochiKit.Visual.Scale.prototype.finish */
+    finish: function () {
+        if (this.restoreAfterFinish) {
+            MochiKit.Style.setStyle(this.element, this.originalStyle);
+        }
+    },
+
+    /** @id MochiKit.Visual.Scale.prototype.setDimensions */
+    setDimensions: function (height, width) {
+        var d = {};
+        var r = Math.round;
+        if (/MSIE/.test(navigator.userAgent)) {
+            r = Math.ceil;
+        }
+        if (this.options.scaleX) {
+            d.width = r(width) + 'px';
+        }
+        if (this.options.scaleY) {
+            d.height = r(height) + 'px';
+        }
+        if (this.options.scaleFromCenter) {
+            var topd = (height - this.dims[0])/2;
+            var leftd = (width - this.dims[1])/2;
+            if (this.elementPositioning == 'absolute') {
+                if (this.options.scaleY) {
+                    d.top = this.originalTop - topd + 'px';
+                }
+                if (this.options.scaleX) {
+                    d.left = this.originalLeft - leftd + 'px';
+                }
+            } else {
+                if (this.options.scaleY) {
+                    d.top = -topd + 'px';
+                }
+                if (this.options.scaleX) {
+                    d.left = -leftd + 'px';
+                }
+            }
+        }
+        MochiKit.Style.setStyle(this.element, d);
+    }
+});
+
+/** @id MochiKit.Visual.Highlight */
+MochiKit.Visual.Highlight = function (element, options) {
+    var cls = arguments.callee;
+    if (!(this instanceof cls)) {
+        return new cls(element, options);
+    }
+    this.__init__(element, options);
+};
+
+MochiKit.Visual.Highlight.prototype = new MochiKit.Visual.Base();
+
+MochiKit.Base.update(MochiKit.Visual.Highlight.prototype, {
+    /***
+
+    Highlight an item of the page.
+
+    @param options: 'startcolor' for choosing highlighting color, default
+    to '#ffff99'.
+
+    ***/
+
+    __class__ : MochiKit.Visual.Highlight,
+
+    __init__: function (element, /* optional */options) {
+        this.element = MochiKit.DOM.getElement(element);
+        options = MochiKit.Base.update({
+            startcolor: '#ffff99'
+        }, options || {});
+        this.start(options);
+    },
+
+    /** @id MochiKit.Visual.Highlight.prototype.setup */
+    setup: function () {
+        var b = MochiKit.Base;
+        var s = MochiKit.Style;
+        // Prevent executing on elements not in the layout flow
+        if (s.getStyle(this.element, 'display') == 'none') {
+            this.cancel();
+            return;
+        }
+        // Disable background image during the effect
+        this.oldStyle = {
+            backgroundImage: s.getStyle(this.element, 'background-image')
+        };
+        s.setStyle(this.element, {
+            backgroundImage: 'none'
+        });
+
+        if (!this.options.endcolor) {
+            this.options.endcolor =
+                MochiKit.Color.Color.fromBackground(this.element).toHexString();
+        }
+        if (b.isUndefinedOrNull(this.options.restorecolor)) {
+            this.options.restorecolor = s.getStyle(this.element,
+                                                   'background-color');
+        }
+        // init color calculations
+        this._base = b.map(b.bind(function (i) {
+            return parseInt(
+                this.options.startcolor.slice(i*2 + 1, i*2 + 3), 16);
+        }, this), [0, 1, 2]);
+        this._delta = b.map(b.bind(function (i) {
+            return parseInt(this.options.endcolor.slice(i*2 + 1, i*2 + 3), 16)
+                - this._base[i];
+        }, this), [0, 1, 2]);
+    },
+
+    /** @id MochiKit.Visual.Highlight.prototype.update */
+    update: function (position) {
+        var m = '#';
+        MochiKit.Base.map(MochiKit.Base.bind(function (i) {
+            m += MochiKit.Color.toColorPart(Math.round(this._base[i] +
+                                            this._delta[i]*position));
+        }, this), [0, 1, 2]);
+        MochiKit.Style.setStyle(this.element, {
+            backgroundColor: m
+        });
+    },
+
+    /** @id MochiKit.Visual.Highlight.prototype.finish */
+    finish: function () {
+        MochiKit.Style.setStyle(this.element,
+            MochiKit.Base.update(this.oldStyle, {
+                backgroundColor: this.options.restorecolor
+        }));
+    }
+});
+
+/** @id MochiKit.Visual.ScrollTo */
+MochiKit.Visual.ScrollTo = function (element, options) {
+    var cls = arguments.callee;
+    if (!(this instanceof cls)) {
+        return new cls(element, options);
+    }
+    this.__init__(element, options);
+};
+
+MochiKit.Visual.ScrollTo.prototype = new MochiKit.Visual.Base();
+
+MochiKit.Base.update(MochiKit.Visual.ScrollTo.prototype, {
+    /***
+
+    Scroll to an element in the page.
+
+    ***/
+
+    __class__ : MochiKit.Visual.ScrollTo,
+
+    __init__: function (element, /* optional */options) {
+        this.element = MochiKit.DOM.getElement(element);
+        this.start(options || {});
+    },
+
+    /** @id MochiKit.Visual.ScrollTo.prototype.setup */
+    setup: function () {
+        var p = MochiKit.Position;
+        p.prepare();
+        var offsets = p.cumulativeOffset(this.element);
+        if (this.options.offset) {
+            offsets.y += this.options.offset;
+        }
+        var max;
+        if (window.innerHeight) {
+            max = window.innerHeight - window.height;
+        } else if (document.documentElement &&
+                   document.documentElement.clientHeight) {
+            max = document.documentElement.clientHeight -
+                  document.body.scrollHeight;
+        } else if (document.body) {
+            max = document.body.clientHeight - document.body.scrollHeight;
+        }
+        this.scrollStart = p.windowOffset.y;
+        this.delta = (offsets.y > max ? max : offsets.y) - this.scrollStart;
+    },
+
+    /** @id MochiKit.Visual.ScrollTo.prototype.update */
+    update: function (position) {
+        var p = MochiKit.Position;
+        p.prepare();
+        window.scrollTo(p.windowOffset.x, this.scrollStart + (position * this.delta));
+    }
+});
+
+MochiKit.Visual.CSS_LENGTH = /^(([\+\-]?[0-9\.]+)(em|ex|px|in|cm|mm|pt|pc|\%))|0$/;
+
+MochiKit.Visual.Morph = function (element, options) {
+    var cls = arguments.callee;
+    if (!(this instanceof cls)) {
+        return new cls(element, options);
+    }
+    this.__init__(element, options);
+};
+
+MochiKit.Visual.Morph.prototype = new MochiKit.Visual.Base();
+
+MochiKit.Base.update(MochiKit.Visual.Morph.prototype, {
+    /***
+
+    Morph effect: make a transformation from current style to the given style,
+    automatically making a transition between the two.
+
+    ***/
+
+    __class__ : MochiKit.Visual.Morph,
+
+    __init__: function (element, /* optional */options) {
+        this.element = MochiKit.DOM.getElement(element);
+        this.start(options || {});
+    },
+
+    /** @id MochiKit.Visual.Morph.prototype.setup */
+    setup: function () {
+        var b = MochiKit.Base;
+        var style = this.options.style;
+        this.styleStart = {};
+        this.styleEnd = {};
+        this.units = {};
+        var value, unit;
+        for (var s in style) {
+            value = style[s];
+            s = b.camelize(s);
+            if (MochiKit.Visual.CSS_LENGTH.test(value)) {
+                var components = value.match(/^([\+\-]?[0-9\.]+)(.*)$/);
+                value = parseFloat(components[1]);
+                unit = (components.length == 3) ? components[2] : null;
+                this.styleEnd[s] = value;
+                this.units[s] = unit;
+                value = MochiKit.Style.getStyle(this.element, s);
+                components = value.match(/^([\+\-]?[0-9\.]+)(.*)$/);
+                value = parseFloat(components[1]);
+                this.styleStart[s] = value;
+            } else {
+                var c = MochiKit.Color.Color;
+                value = c.fromString(value);
+                if (value) {
+                    this.units[s] = "color";
+                    this.styleEnd[s] = value.toHexString();
+                    value = MochiKit.Style.getStyle(this.element, s);
+                    this.styleStart[s] = c.fromString(value).toHexString();
+
+                    this.styleStart[s] = b.map(b.bind(function (i) {
+                        return parseInt(
+                            this.styleStart[s].slice(i*2 + 1, i*2 + 3), 16);
+                    }, this), [0, 1, 2]);
+                    this.styleEnd[s] = b.map(b.bind(function (i) {
+                        return parseInt(
+                            this.styleEnd[s].slice(i*2 + 1, i*2 + 3), 16);
+                    }, this), [0, 1, 2]);
+                }
+            }
+        }
+    },
+
+    /** @id MochiKit.Visual.Morph.prototype.update */
+    update: function (position) {
+        var value;
+        for (var s in this.styleStart) {
+            if (this.units[s] == "color") {
+                var m = '#';
+                var start = this.styleStart[s];
+                var end = this.styleEnd[s];
+                MochiKit.Base.map(MochiKit.Base.bind(function (i) {
+                    m += MochiKit.Color.toColorPart(Math.round(start[i] +
+                                                    (end[i] - start[i])*position));
+                }, this), [0, 1, 2]);
+                this.element.style[s] = m;
+            } else {
+                value = this.styleStart[s] + Math.round((this.styleEnd[s] - this.styleStart[s]) * position * 1000) / 1000 + this.units[s];
+                this.element.style[s] = value;
+            }
+        }
+    }
+});
+
+/***
+
+Combination effects.
+
+***/
+
+/** @id MochiKit.Visual.fade */
+MochiKit.Visual.fade = function (element, /* optional */ options) {
+    /***
+
+    Fade a given element: change its opacity and hide it in the end.
+
+    @param options: 'to' and 'from' to change opacity.
+
+    ***/
+    var s = MochiKit.Style;
+    var oldOpacity = s.getStyle(element, 'opacity');
+    options = MochiKit.Base.update({
+        from: s.getStyle(element, 'opacity') || 1.0,
+        to: 0.0,
+        afterFinishInternal: function (effect) {
+            if (effect.options.to !== 0) {
+                return;
+            }
+            s.hideElement(effect.element);
+            s.setStyle(effect.element, {'opacity': oldOpacity});
+        }
+    }, options || {});
+    return new MochiKit.Visual.Opacity(element, options);
+};
+
+/** @id MochiKit.Visual.appear */
+MochiKit.Visual.appear = function (element, /* optional */ options) {
+    /***
+
+    Make an element appear.
+
+    @param options: 'to' and 'from' to change opacity.
+
+    ***/
+    var s = MochiKit.Style;
+    var v = MochiKit.Visual;
+    options = MochiKit.Base.update({
+        from: (s.getStyle(element, 'display') == 'none' ? 0.0 :
+               s.getStyle(element, 'opacity') || 0.0),
+        to: 1.0,
+        // force Safari to render floated elements properly
+        afterFinishInternal: function (effect) {
+            v.forceRerendering(effect.element);
+        },
+        beforeSetupInternal: function (effect) {
+            s.setStyle(effect.element, {'opacity': effect.options.from});
+            s.showElement(effect.element);
+        }
+    }, options || {});
+    return new v.Opacity(element, options);
+};
+
+/** @id MochiKit.Visual.puff */
+MochiKit.Visual.puff = function (element, /* optional */ options) {
+    /***
+
+    'Puff' an element: grow it to double size, fading it and make it hidden.
+
+    ***/
+    var s = MochiKit.Style;
+    var v = MochiKit.Visual;
+    element = MochiKit.DOM.getElement(element);
+    var oldStyle = {
+        position: s.getStyle(element, 'position'),
+        top: element.style.top,
+        left: element.style.left,
+        width: element.style.width,
+        height: element.style.height,
+        opacity: s.getStyle(element, 'opacity')
+    };
+    options = MochiKit.Base.update({
+        beforeSetupInternal: function (effect) {
+            MochiKit.Position.absolutize(effect.effects[0].element);
+        },
+        afterFinishInternal: function (effect) {
+            s.hideElement(effect.effects[0].element);
+            s.setStyle(effect.effects[0].element, oldStyle);
+        },
+        scaleContent: true,
+        scaleFromCenter: true
+    }, options || {});
+    return new v.Parallel(
+        [new v.Scale(element, 200,
+            {sync: true, scaleFromCenter: options.scaleFromCenter,
+             scaleContent: options.scaleContent, restoreAfterFinish: true}),
+         new v.Opacity(element, {sync: true, to: 0.0 })],
+        options);
+};
+
+/** @id MochiKit.Visual.blindUp */
+MochiKit.Visual.blindUp = function (element, /* optional */ options) {
+    /***
+
+    Blind an element up: change its vertical size to 0.
+
+    ***/
+    var d = MochiKit.DOM;
+    element = d.getElement(element);
+    var elemClip = d.makeClipping(element);
+    options = MochiKit.Base.update({
+        scaleContent: false,
+        scaleX: false,
+        restoreAfterFinish: true,
+        afterFinishInternal: function (effect) {
+            MochiKit.Style.hideElement(effect.element);
+            d.undoClipping(effect.element, elemClip);
+        }
+    }, options || {});
+
+    return new MochiKit.Visual.Scale(element, 0, options);
+};
+
+/** @id MochiKit.Visual.blindDown */
+MochiKit.Visual.blindDown = function (element, /* optional */ options) {
+    /***
+
+    Blind an element down: restore its vertical size.
+
+    ***/
+    var d = MochiKit.DOM;
+    var s = MochiKit.Style;
+    element = d.getElement(element);
+    var elementDimensions = s.getElementDimensions(element);
+    var elemClip;
+    options = MochiKit.Base.update({
+        scaleContent: false,
+        scaleX: false,
+        scaleFrom: 0,
+        scaleMode: {originalHeight: elementDimensions.h,
+                    originalWidth: elementDimensions.w},
+        restoreAfterFinish: true,
+        afterSetupInternal: function (effect) {
+            elemClip = d.makeClipping(effect.element);
+            s.setStyle(effect.element, {height: '0px'});
+            s.showElement(effect.element);
+        },
+        afterFinishInternal: function (effect) {
+            d.undoClipping(effect.element, elemClip);
+        }
+    }, options || {});
+    return new MochiKit.Visual.Scale(element, 100, options);
+};
+
+/** @id MochiKit.Visual.switchOff */
+MochiKit.Visual.switchOff = function (element, /* optional */ options) {
+    /***
+
+    Apply a switch-off-like effect.
+
+    ***/
+    var d = MochiKit.DOM;
+    element = d.getElement(element);
+    var oldOpacity = MochiKit.Style.getStyle(element, 'opacity');
+    var elemClip;
+    options = MochiKit.Base.update({
+        duration: 0.3,
+        scaleFromCenter: true,
+        scaleX: false,
+        scaleContent: false,
+        restoreAfterFinish: true,
+        beforeSetupInternal: function (effect) {
+            d.makePositioned(effect.element);
+            elemClip = d.makeClipping(effect.element);
+        },
+        afterFinishInternal: function (effect) {
+            MochiKit.Style.hideElement(effect.element);
+            d.undoClipping(effect.element, elemClip);
+            d.undoPositioned(effect.element);
+            MochiKit.Style.setStyle(effect.element, {'opacity': oldOpacity});
+        }
+    }, options || {});
+    var v = MochiKit.Visual;
+    return new v.appear(element, {
+        duration: 0.4,
+        from: 0,
+        transition: v.Transitions.flicker,
+        afterFinishInternal: function (effect) {
+            new v.Scale(effect.element, 1, options);
+        }
+    });
+};
+
+/** @id MochiKit.Visual.dropOut */
+MochiKit.Visual.dropOut = function (element, /* optional */ options) {
+    /***
+
+    Make an element fall and disappear.
+
+    ***/
+    var d = MochiKit.DOM;
+    var s = MochiKit.Style;
+    element = d.getElement(element);
+    var oldStyle = {
+        top: s.getStyle(element, 'top'),
+        left: s.getStyle(element, 'left'),
+        opacity: s.getStyle(element, 'opacity')
+    };
+
+    options = MochiKit.Base.update({
+        duration: 0.5,
+        distance: 100,
+        beforeSetupInternal: function (effect) {
+            d.makePositioned(effect.effects[0].element);
+        },
+        afterFinishInternal: function (effect) {
+            s.hideElement(effect.effects[0].element);
+            d.undoPositioned(effect.effects[0].element);
+            s.setStyle(effect.effects[0].element, oldStyle);
+        }
+    }, options || {});
+    var v = MochiKit.Visual;
+    return new v.Parallel(
+        [new v.Move(element, {x: 0, y: options.distance, sync: true}),
+         new v.Opacity(element, {sync: true, to: 0.0})],
+        options);
+};
+
+/** @id MochiKit.Visual.shake */
+MochiKit.Visual.shake = function (element, /* optional */ options) {
+    /***
+
+    Move an element from left to right several times.
+
+    ***/
+    var d = MochiKit.DOM;
+    var v = MochiKit.Visual;
+    var s = MochiKit.Style;
+    element = d.getElement(element);
+    options = MochiKit.Base.update({
+        x: -20,
+        y: 0,
+        duration: 0.05,
+        afterFinishInternal: function (effect) {
+            d.undoPositioned(effect.element);
+            s.setStyle(effect.element, oldStyle);
+        }
+    }, options || {});
+    var oldStyle = {
+        top: s.getStyle(element, 'top'),
+        left: s.getStyle(element, 'left') };
+        return new v.Move(element,
+          {x: 20, y: 0, duration: 0.05, afterFinishInternal: function (effect) {
+        new v.Move(effect.element,
+          {x: -40, y: 0, duration: 0.1, afterFinishInternal: function (effect) {
+        new v.Move(effect.element,
+           {x: 40, y: 0, duration: 0.1, afterFinishInternal: function (effect) {
+        new v.Move(effect.element,
+          {x: -40, y: 0, duration: 0.1, afterFinishInternal: function (effect) {
+        new v.Move(effect.element,
+           {x: 40, y: 0, duration: 0.1, afterFinishInternal: function (effect) {
+        new v.Move(effect.element, options
+        ) }}) }}) }}) }}) }});
+};
+
+/** @id MochiKit.Visual.slideDown */
+MochiKit.Visual.slideDown = function (element, /* optional */ options) {
+    /***
+
+    Slide an element down.
+    It needs to have the content of the element wrapped in a container
+    element with fixed height.
+
+    ***/
+    var d = MochiKit.DOM;
+    var b = MochiKit.Base;
+    var s = MochiKit.Style;
+    element = d.getElement(element);
+    if (!element.firstChild) {
+        throw "MochiKit.Visual.slideDown must be used on a element with a child";
+    }
+    d.removeEmptyTextNodes(element);
+    var oldInnerBottom = s.getStyle(element.firstChild, 'bottom') || 0;
+    var elementDimensions = s.getElementDimensions(element);
+    var elemClip;
+    options = b.update({
+        scaleContent: false,
+        scaleX: false,
+        scaleFrom: 0,
+        scaleMode: {originalHeight: elementDimensions.h,
+                    originalWidth: elementDimensions.w},
+        restoreAfterFinish: true,
+        afterSetupInternal: function (effect) {
+            d.makePositioned(effect.element);
+            d.makePositioned(effect.element.firstChild);
+            if (/Opera/.test(navigator.userAgent)) {
+                s.setStyle(effect.element, {top: ''});
+            }
+            elemClip = d.makeClipping(effect.element);
+            s.setStyle(effect.element, {height: '0px'});
+            s.showElement(effect.element);
+        },
+        afterUpdateInternal: function (effect) {
+            s.setStyle(effect.element.firstChild,
+               {bottom: (effect.dims[0] - effect.element.clientHeight) + 'px'});
+        },
+        afterFinishInternal: function (effect) {
+            d.undoClipping(effect.element, elemClip);
+            // IE will crash if child is undoPositioned first
+            if (/MSIE/.test(navigator.userAgent)) {
+                d.undoPositioned(effect.element);
+                d.undoPositioned(effect.element.firstChild);
+            } else {
+                d.undoPositioned(effect.element.firstChild);
+                d.undoPositioned(effect.element);
+            }
+            s.setStyle(effect.element.firstChild,
+                                  {bottom: oldInnerBottom});
+        }
+    }, options || {});
+
+    return new MochiKit.Visual.Scale(element, 100, options);
+};
+
+/** @id MochiKit.Visual.slideUp */
+MochiKit.Visual.slideUp = function (element, /* optional */ options) {
+    /***
+
+    Slide an element up.
+    It needs to have the content of the element wrapped in a container
+    element with fixed height.
+
+    ***/
+    var d = MochiKit.DOM;
+    var b = MochiKit.Base;
+    var s = MochiKit.Style;
+    element = d.getElement(element);
+    if (!element.firstChild) {
+        throw "MochiKit.Visual.slideUp must be used on a element with a child";
+    }
+    d.removeEmptyTextNodes(element);
+    var oldInnerBottom = s.getStyle(element.firstChild, 'bottom');
+    var elemClip;
+    options = b.update({
+        scaleContent: false,
+        scaleX: false,
+        scaleMode: 'box',
+        scaleFrom: 100,
+        restoreAfterFinish: true,
+        beforeStartInternal: function (effect) {
+            d.makePositioned(effect.element);
+            d.makePositioned(effect.element.firstChild);
+            if (/Opera/.test(navigator.userAgent)) {
+                s.setStyle(effect.element, {top: ''});
+            }
+            elemClip = d.makeClipping(effect.element);
+            s.showElement(effect.element);
+        },
+        afterUpdateInternal: function (effect) {
+            s.setStyle(effect.element.firstChild,
+            {bottom: (effect.dims[0] - effect.element.clientHeight) + 'px'});
+        },
+        afterFinishInternal: function (effect) {
+            s.hideElement(effect.element);
+            d.undoClipping(effect.element, elemClip);
+            d.undoPositioned(effect.element.firstChild);
+            d.undoPositioned(effect.element);
+            s.setStyle(effect.element.firstChild, {bottom: oldInnerBottom});
+        }
+    }, options || {});
+    return new MochiKit.Visual.Scale(element, 0, options);
+};
+
+// Bug in opera makes the TD containing this element expand for a instance
+// after finish
+/** @id MochiKit.Visual.squish */
+MochiKit.Visual.squish = function (element, /* optional */ options) {
+    /***
+
+    Reduce an element and make it disappear.
+
+    ***/
+    var d = MochiKit.DOM;
+    var b = MochiKit.Base;
+    var elemClip;
+    options = b.update({
+        restoreAfterFinish: true,
+        beforeSetupInternal: function (effect) {
+            elemClip = d.makeClipping(effect.element);
+        },
+        afterFinishInternal: function (effect) {
+            MochiKit.Style.hideElement(effect.element);
+            d.undoClipping(effect.element, elemClip);
+        }
+    }, options || {});
+
+    return new MochiKit.Visual.Scale(element, /Opera/.test(navigator.userAgent) ? 1 : 0, options);
+};
+
+/** @id MochiKit.Visual.grow */
+MochiKit.Visual.grow = function (element, /* optional */ options) {
+    /***
+
+    Grow an element to its original size. Make it zero-sized before
+    if necessary.
+
+    ***/
+    var d = MochiKit.DOM;
+    var v = MochiKit.Visual;
+    var s = MochiKit.Style;
+    element = d.getElement(element);
+    options = MochiKit.Base.update({
+        direction: 'center',
+        moveTransition: v.Transitions.sinoidal,
+        scaleTransition: v.Transitions.sinoidal,
+        opacityTransition: v.Transitions.full,
+        scaleContent: true,
+        scaleFromCenter: false
+    }, options || {});
+    var oldStyle = {
+        top: element.style.top,
+        left: element.style.left,
+        height: element.style.height,
+        width: element.style.width,
+        opacity: s.getStyle(element, 'opacity')
+    };
+
+    var dims = s.getElementDimensions(element);
+    var initialMoveX, initialMoveY;
+    var moveX, moveY;
+
+    switch (options.direction) {
+        case 'top-left':
+            initialMoveX = initialMoveY = moveX = moveY = 0;
+            break;
+        case 'top-right':
+            initialMoveX = dims.w;
+            initialMoveY = moveY = 0;
+            moveX = -dims.w;
+            break;
+        case 'bottom-left':
+            initialMoveX = moveX = 0;
+            initialMoveY = dims.h;
+            moveY = -dims.h;
+            break;
+        case 'bottom-right':
+            initialMoveX = dims.w;
+            initialMoveY = dims.h;
+            moveX = -dims.w;
+            moveY = -dims.h;
+            break;
+        case 'center':
+            initialMoveX = dims.w / 2;
+            initialMoveY = dims.h / 2;
+            moveX = -dims.w / 2;
+            moveY = -dims.h / 2;
+            break;
+    }
+
+    var optionsParallel = MochiKit.Base.update({
+        beforeSetupInternal: function (effect) {
+            s.setStyle(effect.effects[0].element, {height: '0px'});
+            s.showElement(effect.effects[0].element);
+        },
+        afterFinishInternal: function (effect) {
+            d.undoClipping(effect.effects[0].element);
+            d.undoPositioned(effect.effects[0].element);
+            s.setStyle(effect.effects[0].element, oldStyle);
+        }
+    }, options || {});
+
+    return new v.Move(element, {
+        x: initialMoveX,
+        y: initialMoveY,
+        duration: 0.01,
+        beforeSetupInternal: function (effect) {
+            s.hideElement(effect.element);
+            d.makeClipping(effect.element);
+            d.makePositioned(effect.element);
+        },
+        afterFinishInternal: function (effect) {
+            new v.Parallel(
+                [new v.Opacity(effect.element, {
+                    sync: true, to: 1.0, from: 0.0,
+                    transition: options.opacityTransition
+                 }),
+                 new v.Move(effect.element, {
+                     x: moveX, y: moveY, sync: true,
+                     transition: options.moveTransition
+                 }),
+                 new v.Scale(effect.element, 100, {
+                        scaleMode: {originalHeight: dims.h,
+                                    originalWidth: dims.w},
+                        sync: true,
+                        scaleFrom: /Opera/.test(navigator.userAgent) ? 1 : 0,
+                        transition: options.scaleTransition,
+                        scaleContent: options.scaleContent,
+                        scaleFromCenter: options.scaleFromCenter,
+                        restoreAfterFinish: true
+                })
+                ], optionsParallel
+            );
+        }
+    });
+};
+
+/** @id MochiKit.Visual.shrink */
+MochiKit.Visual.shrink = function (element, /* optional */ options) {
+    /***
+
+    Shrink an element and make it disappear.
+
+    ***/
+    var d = MochiKit.DOM;
+    var v = MochiKit.Visual;
+    var s = MochiKit.Style;
+    element = d.getElement(element);
+    options = MochiKit.Base.update({
+        direction: 'center',
+        moveTransition: v.Transitions.sinoidal,
+        scaleTransition: v.Transitions.sinoidal,
+        opacityTransition: v.Transitions.none,
+        scaleContent: true,
+        scaleFromCenter: false
+    }, options || {});
+    var oldStyle = {
+        top: element.style.top,
+        left: element.style.left,
+        height: element.style.height,
+        width: element.style.width,
+        opacity: s.getStyle(element, 'opacity')
+    };
+
+    var dims = s.getElementDimensions(element);
+    var moveX, moveY;
+
+    switch (options.direction) {
+        case 'top-left':
+            moveX = moveY = 0;
+            break;
+        case 'top-right':
+            moveX = dims.w;
+            moveY = 0;
+            break;
+        case 'bottom-left':
+            moveX = 0;
+            moveY = dims.h;
+            break;
+        case 'bottom-right':
+            moveX = dims.w;
+            moveY = dims.h;
+            break;
+        case 'center':
+            moveX = dims.w / 2;
+            moveY = dims.h / 2;
+            break;
+    }
+    var elemClip;
+
+    var optionsParallel = MochiKit.Base.update({
+        beforeStartInternal: function (effect) {
+            elemClip = d.makePositioned(effect.effects[0].element);
+            d.makeClipping(effect.effects[0].element);
+        },
+        afterFinishInternal: function (effect) {
+            s.hideElement(effect.effects[0].element);
+            d.undoClipping(effect.effects[0].element, elemClip);
+            d.undoPositioned(effect.effects[0].element);
+            s.setStyle(effect.effects[0].element, oldStyle);
+        }
+    }, options || {});
+
+    return new v.Parallel(
+        [new v.Opacity(element, {
+            sync: true, to: 0.0, from: 1.0,
+            transition: options.opacityTransition
+         }),
+         new v.Scale(element, /Opera/.test(navigator.userAgent) ? 1 : 0, {
+             sync: true, transition: options.scaleTransition,
+             scaleContent: options.scaleContent,
+             scaleFromCenter: options.scaleFromCenter,
+             restoreAfterFinish: true
+         }),
+         new v.Move(element, {
+             x: moveX, y: moveY, sync: true, transition: options.moveTransition
+         })
+        ], optionsParallel
+    );
+};
+
+/** @id MochiKit.Visual.pulsate */
+MochiKit.Visual.pulsate = function (element, /* optional */ options) {
+    /***
+
+    Pulse an element between appear/fade.
+
+    ***/
+    var d = MochiKit.DOM;
+    var v = MochiKit.Visual;
+    var b = MochiKit.Base;
+    var oldOpacity = MochiKit.Style.getStyle(element, 'opacity');
+    options = b.update({
+        duration: 3.0,
+        from: 0,
+        afterFinishInternal: function (effect) {
+            MochiKit.Style.setStyle(effect.element, {'opacity': oldOpacity});
+        }
+    }, options || {});
+    var transition = options.transition || v.Transitions.sinoidal;
+    var reverser = b.bind(function (pos) {
+        return transition(1 - v.Transitions.pulse(pos));
+    }, transition);
+    b.bind(reverser, transition);
+    return new v.Opacity(element, b.update({
+        transition: reverser}, options));
+};
+
+/** @id MochiKit.Visual.fold */
+MochiKit.Visual.fold = function (element, /* optional */ options) {
+    /***
+
+    Fold an element, first vertically, then horizontally.
+
+    ***/
+    var d = MochiKit.DOM;
+    var v = MochiKit.Visual;
+    var s = MochiKit.Style;
+    element = d.getElement(element);
+    var oldStyle = {
+        top: element.style.top,
+        left: element.style.left,
+        width: element.style.width,
+        height: element.style.height
+    };
+    var elemClip = d.makeClipping(element);
+    options = MochiKit.Base.update({
+        scaleContent: false,
+        scaleX: false,
+        afterFinishInternal: function (effect) {
+            new v.Scale(element, 1, {
+                scaleContent: false,
+                scaleY: false,
+                afterFinishInternal: function (effect) {
+                    s.hideElement(effect.element);
+                    d.undoClipping(effect.element, elemClip);
+                    s.setStyle(effect.element, oldStyle);
+                }
+            });
+        }
+    }, options || {});
+    return new v.Scale(element, 5, options);
+};
+
+
+// Compatibility with MochiKit 1.0
+MochiKit.Visual.Color = MochiKit.Color.Color;
+MochiKit.Visual.getElementsComputedStyle = MochiKit.DOM.computedStyle;
+
+/* end of Rico adaptation */
+
+MochiKit.Visual.__new__ = function () {
+    var m = MochiKit.Base;
+
+    m.nameFunctions(this);
+
+    this.EXPORT_TAGS = {
+        ":common": this.EXPORT,
+        ":all": m.concat(this.EXPORT, this.EXPORT_OK)
+    };
+
+};
+
+MochiKit.Visual.EXPORT = [
+    "roundElement",
+    "roundClass",
+    "tagifyText",
+    "multiple",
+    "toggle",
+    "Parallel",
+    "Opacity",
+    "Move",
+    "Scale",
+    "Highlight",
+    "ScrollTo",
+    "Morph",
+    "fade",
+    "appear",
+    "puff",
+    "blindUp",
+    "blindDown",
+    "switchOff",
+    "dropOut",
+    "shake",
+    "slideDown",
+    "slideUp",
+    "squish",
+    "grow",
+    "shrink",
+    "pulsate",
+    "fold"
+];
+
+MochiKit.Visual.EXPORT_OK = [
+    "Base",
+    "PAIRS"
+];
+
+MochiKit.Visual.__new__();
+
+MochiKit.Base._exportSymbols(this, MochiKit.Visual);
diff --git a/frontend/beta/js/MochiKit/__package__.js b/frontend/beta/js/MochiKit/__package__.js
new file mode 100644
index 0000000..8d644b1
--- a/dev/null
+++ b/frontend/beta/js/MochiKit/__package__.js
@@ -0,0 +1,18 @@
+dojo.kwCompoundRequire({
+    "common": [
+        "MochiKit.Base",
+        "MochiKit.Iter",
+        "MochiKit.Logging",
+        "MochiKit.DateTime",
+        "MochiKit.Format",
+        "MochiKit.Async",
+        "MochiKit.DOM",
+        "MochiKit.Style",
+        "MochiKit.LoggingPane",
+        "MochiKit.Color",
+        "MochiKit.Signal",
+        "MochiKit.Position",
+        "MochiKit.Visual"
+    ]
+});
+dojo.provide("MochiKit.*");
diff --git a/frontend/beta/js/YUI-extensions/Bench.js b/frontend/beta/js/YUI-extensions/Bench.js
new file mode 100644
index 0000000..6921131
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/Bench.js
@@ -0,0 +1,40 @@
+// @deprecated
+// Use YAHOO.timer() instead
+YAHOO.ext.util.Bench = function(){
+   this.timers = {};
+   this.lastKey = null;
+};
+YAHOO.ext.util.Bench.prototype = {
+   start : function(key){
+       this.lastKey = key;
+       this.timers[key] = {};
+       this.timers[key].startTime = new Date().getTime(); 
+   },
+   
+   stop : function(key){
+       key = key || this.lastKey;
+       this.timers[key].endTime = new Date().getTime(); 
+   },
+   
+   getElapsed : function(key){
+       key = key || this.lastKey;
+       return this.timers[key].endTime - this.timers[key].startTime;
+   },
+   
+   toString : function(html){
+       var results = "";
+       for(var key in this.timers){
+           if(typeof this.timers[key] != 'function'){
+               results += key + ":\t" + (this.getElapsed(key) / 1000) + " seconds\n";
+           }
+       }
+       if(html){
+           results = results.replace("\n", '<br>');
+       }
+       return results;
+   },
+   
+   show : function(){
+       alert(this.toString());
+   }
+};
diff --git a/frontend/beta/js/YUI-extensions/CSS.js b/frontend/beta/js/YUI-extensions/CSS.js
new file mode 100644
index 0000000..4fba37c
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/CSS.js
@@ -0,0 +1,208 @@
+/**
+ * @class YAHOO.ext.util.CSS
+ * Class for manipulating CSS Rules
+ * @singleton
+ */
+YAHOO.ext.util.CSS = new function(){
+	var rules = null;
+   	
+   	var toCamel = function(property) {
+      var convert = function(prop) {
+         var test = /(-[a-z])/i.exec(prop);
+         return prop.replace(RegExp.$1, RegExp.$1.substr(1).toUpperCase());
+      };
+      while(property.indexOf('-') > -1) {
+         property = convert(property);
+      }
+      return property;
+   };
+   
+   /**
+    * Very simple dynamic creation of stylesheets from a text blob of rules.
+    * @param {String} cssText The text containing the css rules
+    * @return {StyleSheet} 
+    */
+   this.createStyleSheet = function(cssText){
+       var ss;
+       if(YAHOO.ext.util.Browser.isIE){
+           ss = document.createStyleSheet();
+           ss.cssText = cssText;
+       }else{
+           var head = document.getElementsByTagName("head")[0];
+           var rules = document.createElement('style');
+           rules.setAttribute('type', 'text/css');
+           try{
+                rules.appendChild(document.createTextNode(cssText));
+           }catch(e){
+               rules.cssText = cssText; 
+           }
+           head.appendChild(rules);
+           ss = document.styleSheets[document.styleSheets.length-1];
+       }
+       this.cacheStyleSheet(ss);
+       return ss;
+   };
+   
+   this.removeStyleSheet = function(id){
+       var existing = document.getElementById(id);
+       if(existing){
+           existing.parentNode.removeChild(existing);
+       }
+   };
+   
+   this.swapStyleSheet = function(id, url){
+       this.removeStyleSheet(id);
+       var ss = document.createElement('link');
+       ss.setAttribute('rel', 'stylesheet');
+       ss.setAttribute('type', 'text/css');
+       ss.setAttribute('id', id);
+       ss.setAttribute('href', url);
+       document.getElementsByTagName("head")[0].appendChild(ss);
+   };
+   
+   /**
+    * Refresh the rule cache if you have dynamically added stylesheets
+    * @return {Object} An object (hash) of rules indexed by selector
+    */
+   this.refreshCache = function(){
+       return this.getRules(true);
+   };
+   
+   this.cacheStyleSheet = function(ss){
+       try{// try catch for cross domain access issue
+           var ssRules = ss.cssRules || ss.rules;
+           for(var j = ssRules.length-1; j >= 0; --j){
+               rules[ssRules[j].selectorText] = ssRules[j];
+           }
+       }catch(e){}
+   };
+   
+   /**
+    * Gets all css rules for the document
+    * @param {Boolean} refreshCache true to refresh the internal cache
+    * @return {Object} An object (hash) of rules indexed by selector
+    */
+   this.getRules = function(refreshCache){
+   		if(rules == null || refreshCache){
+   			rules = {};
+   			var ds = document.styleSheets;
+   			for(var i =0, len = ds.length; i < len; i++){
+   			    try{
+    		        this.cacheStyleSheet(ds[i]);
+    		    }catch(e){} 
+	        }
+   		}
+   		return rules;
+   	};
+   	
+   	/**
+    * Gets an an individual CSS rule by selector(s)
+    * @param {String/Array} selector The CSS selector or an array of selectors to try. The first selector that is found is returned.
+    * @param {Boolean} refreshCache true to refresh the internal cache
+    * @return {CSSRule} The CSS rule or null if one is not found
+    */
+   this.getRule = function(selector, refreshCache){
+   		var rs = this.getRules(refreshCache);
+   		if(!(selector instanceof Array)){
+   		    return rs[selector];
+   		}
+   		for(var i = 0; i < selector.length; i++){
+			if(rs[selector[i]]){
+				return rs[selector[i]];
+			}
+		}
+		return null;
+   	};
+   	
+   	
+   	/**
+    * Updates a rule property
+    * @param {String/Array} selector If it's an array it tries each selector until it finds one. Stops immediately once one is found.
+    * @param {String} property The css property
+    * @param {String} value The new value for the property
+    * @return {Boolean} true if a rule was found and updated 
+    */
+   this.updateRule = function(selector, property, value){
+   		if(!(selector instanceof Array)){
+   			var rule = this.getRule(selector);
+   			if(rule){
+   				rule.style[toCamel(property)] = value;
+   				return true;
+   			}
+   		}else{
+   			for(var i = 0; i < selector.length; i++){
+   				if(this.updateRule(selector[i], property, value)){
+   					return true;
+   				}
+   			}
+   		}
+   		return false;
+   	};
+   	
+   	/**
+    * Applies a rule to an element without adding the class
+    * @param {HTMLElement} el The element
+    * @param {String/Array} selector If it's an array it tries each selector until it finds one. Stops immediately once one is found.
+    * @return {Boolean} true if a rule was found and applied 
+    */
+   this.apply = function(el, selector){
+   		if(!(selector instanceof Array)){
+   			var rule = this.getRule(selector);
+   			if(rule){
+   			    var s = rule.style;
+   				for(var key in s){
+   				    if(typeof s[key] != 'function'){
+       					if(s[key] && String(s[key]).indexOf(':') < 0 && s[key] != 'false'){
+       						try{el.style[key] = s[key];}catch(e){}
+       					}
+   				    }
+   				}
+   				return true;
+   			}
+   		}else{
+   			for(var i = 0; i < selector.length; i++){
+   				if(this.apply(el, selector[i])){
+   					return true;
+   				}
+   			}
+   		}
+   		return false;
+   	};
+   	
+   	this.applyFirst = function(el, id, selector){
+   		var selectors = [
+   			'#' + id + ' ' + selector,
+   			selector
+   		];
+   		return this.apply(el, selectors);
+   	};
+   	
+   	this.revert = function(el, selector){
+   		if(!(selector instanceof Array)){
+   			var rule = this.getRule(selector);
+   			if(rule){
+   				for(key in rule.style){
+   					if(rule.style[key] && String(rule.style[key]).indexOf(':') < 0 && rule.style[key] != 'false'){
+   						try{el.style[key] = '';}catch(e){}
+   					}
+   				}
+   				return true;
+   			}
+   		}else{
+   			for(var i = 0; i < selector.length; i++){
+   				if(this.revert(el, selector[i])){
+   					return true;
+   				}
+   			}
+   		}
+   		return false;
+   	};
+   	
+   	this.revertFirst = function(el, id, selector){
+   		var selectors = [
+   			'#' + id + ' ' + selector,
+   			selector
+   		];
+   		return this.revert(el, selectors);
+   	};   	
+}();
diff --git a/frontend/beta/js/YUI-extensions/CompositeElement.js b/frontend/beta/js/YUI-extensions/CompositeElement.js
new file mode 100644
index 0000000..7b9c875
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/CompositeElement.js
@@ -0,0 +1,140 @@
+/**
+ * @class YAHOO.ext.CompositeElement
+ * Standard composite class. Creates a YAHOO.ext.Element for every element in the collection.
+ * <br><br>
+ * <b>NOTE: Although they are not listed, this class supports all of the set/update methods of YAHOO.ext.Element. All YAHOO.ext.Element
+ * actions will be performed on all the elements in this collection.</b>
+ * <br><br>
+ * All methods return <i>this</i> and can be chained.
+ <pre><code>
+ var els = getEls('#some-el div.some-class');
+ // or
+ var els = YAHOO.ext.Element.select('#some-el div.some-class');
+ els.setWidth(100); // all elements become 100 width
+ els.hide(true); // all elements fade out and hide
+ // or
+ els.setWidth(100).hide(true);
+ </code></pre>
+ */
+YAHOO.ext.CompositeElement = function(els){
+    this.elements = [];
+    this.addElements(els);
+};
+YAHOO.ext.CompositeElement.prototype = {
+    isComposite: true,
+    addElements : function(els){
+        if(!els) return this;
+        var yels = this.elements;
+        var index = yels.length-1;
+        for(var i = 0, len = els.length; i < len; i++) {
+        	yels[++index] = getEl(els[i], true);
+        }
+        return this;
+    },
+    invoke : function(fn, args){
+        var els = this.elements;
+        for(var i = 0, len = els.length; i < len; i++) {
+        	YAHOO.ext.Element.prototype[fn].apply(els[i], args);
+        }
+        return this;
+    },
+    /**
+    * Adds elements to this composite.
+    * @param {String/Array} els A string CSS selector, an array of elements or an element
+    * @return {CompositeElement} this
+    */
+    add : function(els){
+        if(typeof els == 'string'){
+            this.addElements(YAHOO.ext.Element.selectorFunction(string));
+        }else if(els instanceof Array){
+            this.addElements(els);
+        }else{
+            this.addElements([els]);
+        }
+        return this;
+    },
+    /**
+    * Calls the passed function passing (el, this, index) for each element in this composite.
+    * @param {Function} fn The function to call
+    * @param {Object} scope (optional) The <i>this</i> object (defaults to the element)
+    * @return {CompositeElement} this
+    */
+    each : function(fn, scope){
+        var els = this.elements;
+        for(var i = 0, len = els.length; i < len; i++){
+            fn.call(scope || els[i], els[i], this, i);
+        }
+        return this;
+    }
+};
+/**
+ * @class YAHOO.ext.CompositeElementLite
+ * @extends YAHOO.ext.CompositeElement
+ * Flyweight composite class. Reuses the same YAHOO.ext.Element for element operations.
+ * <br><br>
+ * <b>NOTE: Although they are not listed, this class supports all of the set/update methods of YAHOO.ext.Element. All YAHOO.ext.Element
+ * actions will be performed on all the elements in this collection.</b>
+ */
+YAHOO.ext.CompositeElementLite = function(els){
+    YAHOO.ext.CompositeElementLite.superclass.constructor.call(this, els);
+    this.el = YAHOO.ext.Element.get(this.elements[0], true);
+};
+YAHOO.extendX(YAHOO.ext.CompositeElementLite, YAHOO.ext.CompositeElement, {
+    addElements : function(els){
+        if(els){
+            this.elements = this.elements.concat(els);
+        }
+        return this;
+    },
+    invoke : function(fn, args){
+        var els = this.elements;
+        var el = this.el;
+        for(var i = 0, len = els.length; i < len; i++) {
+            el.dom = els[i];
+        	YAHOO.ext.Element.prototype[fn].apply(el, args);
+        }
+        return this;
+    }
+});
+YAHOO.ext.CompositeElement.createCall = function(proto, fnName){
+    if(!proto[fnName]){
+        proto[fnName] = function(){
+            return this.invoke(fnName, arguments);  
+        };
+    }
+};
+for(var fnName in YAHOO.ext.Element.prototype){
+    if(typeof YAHOO.ext.Element.prototype[fnName] == 'function'){
+        YAHOO.ext.CompositeElement.createCall(YAHOO.ext.CompositeElement.prototype, fnName);
+    }
+}
+if(typeof cssQuery == 'function'){// Dean Edwards cssQuery
+    YAHOO.ext.Element.selectorFunction = cssQuery;
+}else if(typeof document.getElementsBySelector == 'function'){ // Simon Willison's getElementsBySelector
+    YAHOO.ext.Element.selectorFunction = document.getElementsBySelector.createDelegate(document);
+}
+/**
+ * @member YAHOO.ext.Element
+* Selects elements based on the passed CSS selector to enable working on them as 1.
+* @param {String/Array} selector The CSS selector or an array of elements
+* @param {Boolean} unique (optional) true to create a unique YAHOO.ext.Element for each element (defaults to a shared flyweight object)
+* @return {CompositeElementLite/CompositeElement}
+* @method @static
+*/
+YAHOO.ext.Element.select = function(selector, unique){
+    var els;
+    if(typeof selector == 'string'){
+        els = YAHOO.ext.Element.selectorFunction(selector);
+    }else if(selector instanceof Array){
+        els = selector;
+    }else{
+        throw 'Invalid selector';
+    }
+    if(unique === true){
+        return new YAHOO.ext.CompositeElement(els);
+    }else{
+        return new YAHOO.ext.CompositeElementLite(els);
+    }
+};
+
+var getEls = YAHOO.ext.Element.select;
diff --git a/frontend/beta/js/YUI-extensions/CustomTagReader.js b/frontend/beta/js/YUI-extensions/CustomTagReader.js
new file mode 100644
index 0000000..12faaa9
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/CustomTagReader.js
@@ -0,0 +1,40 @@
+/**
+ * @class YAHOO.ext.CustomTagReader
+ * Utility class to normalize reading of custom tags across browsers.
+ */
+YAHOO.ext.CustomTagReader = function(namespace){
+    this.namespace = namespace;
+};
+YAHOO.ext.CustomTagReader.prototype = {
+    getAttribute : function(el, name, defaultValue){
+        return (this.useNS ?
+            v = el.getAttributeNS(this.namespace, name) : null) ||
+            el.getAttribute(this.namespace+':'+name) ||
+            el.getAttribute(name);
+    },
+    
+    getElements : function(tagName, targetEl){
+        targetEl = targetEl || document.body;
+        var els;
+        if(this.useNS){ // no namespaces in IE
+           els = targetEl.getElementsByTagNameNS(this.namespace, tagName);
+        }
+        if(!els || els.length < 1){ // ie6, firefox 1.5, firefox 2 depending on doc type
+           els = targetEl.getElementsByTagName(this.namespace+':'+tagName);
+        }
+        if(!els || els.length < 1){ // everyone else
+           els = targetEl.getElementsByTagName(tagName);
+        }
+        return els;
+    },
+    
+    eachElement : function(tagName, targetEl, fn, scope){
+        var els = this.getElements(tagName, targetEl);
+        for(var i = 0, len = els.length; i < len; i++) {
+        	var el = els[i];
+        	fn.call(scope || el, el);
+        }  
+    },
+    
+    useNS : (!YAHOO.ext.util.Browser.isIE && document.getElementsByTagNameNS) ? true : false
+};
diff --git a/frontend/beta/js/YUI-extensions/Date.js b/frontend/beta/js/YUI-extensions/Date.js
new file mode 100644
index 0000000..f79c8a5
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/Date.js
@@ -0,0 +1,407 @@
+/*
+ * All the Date functions below are the excellent work of Baron Schwartz
+ * They generate precompiled functions from date formats instead of parsing and processing
+ * the format everytime you do something with a date.
+ */
+/** @ignore */
+Date.parseFunctions = {count:0};
+/** @ignore */
+Date.parseRegexes = [];
+/** @ignore */
+Date.formatFunctions = {count:0};
+
+/**
+ * Formats a date given to the supplied format - the format syntax is the same as <a href="http://www.php.net/date">PHP's date() function</a>.
+ */
+Date.prototype.dateFormat = function(format) {
+    if (Date.formatFunctions[format] == null) {
+        Date.createNewFormat(format);
+    }
+    var func = Date.formatFunctions[format];
+    return this[func]();
+};
+
+/**
+ * Same as {@link #dateFormat}
+ */
+Date.prototype.format = Date.prototype.dateFormat;
+
+/** @ignore */
+Date.createNewFormat = function(format) {
+    var funcName = "format" + Date.formatFunctions.count++;
+    Date.formatFunctions[format] = funcName;
+    var code = "Date.prototype." + funcName + " = function(){return ";
+    var special = false;
+    var ch = '';
+    for (var i = 0; i < format.length; ++i) {
+        ch = format.charAt(i);
+        if (!special && ch == "\\") {
+            special = true;
+        }
+        else if (special) {
+            special = false;
+            code += "'" + String.escape(ch) + "' + ";
+        }
+        else {
+            code += Date.getFormatCode(ch);
+        }
+    }
+    eval(code.substring(0, code.length - 3) + ";}");
+};
+
+/** @ignore */
+Date.getFormatCode = function(character) {
+    switch (character) {
+    case "d":
+        return "String.leftPad(this.getDate(), 2, '0') + ";
+    case "D":
+        return "Date.dayNames[this.getDay()].substring(0, 3) + ";
+    case "j":
+        return "this.getDate() + ";
+    case "l":
+        return "Date.dayNames[this.getDay()] + ";
+    case "S":
+        return "this.getSuffix() + ";
+    case "w":
+        return "this.getDay() + ";
+    case "z":
+        return "this.getDayOfYear() + ";
+    case "W":
+        return "this.getWeekOfYear() + ";
+    case "F":
+        return "Date.monthNames[this.getMonth()] + ";
+    case "m":
+        return "String.leftPad(this.getMonth() + 1, 2, '0') + ";
+    case "M":
+        return "Date.monthNames[this.getMonth()].substring(0, 3) + ";
+    case "n":
+        return "(this.getMonth() + 1) + ";
+    case "t":
+        return "this.getDaysInMonth() + ";
+    case "L":
+        return "(this.isLeapYear() ? 1 : 0) + ";
+    case "Y":
+        return "this.getFullYear() + ";
+    case "y":
+        return "('' + this.getFullYear()).substring(2, 4) + ";
+    case "a":
+        return "(this.getHours() < 12 ? 'am' : 'pm') + ";
+    case "A":
+        return "(this.getHours() < 12 ? 'AM' : 'PM') + ";
+    case "g":
+        return "((this.getHours() %12) ? this.getHours() % 12 : 12) + ";
+    case "G":
+        return "this.getHours() + ";
+    case "h":
+        return "String.leftPad((this.getHours() %12) ? this.getHours() % 12 : 12, 2, '0') + ";
+    case "H":
+        return "String.leftPad(this.getHours(), 2, '0') + ";
+    case "i":
+        return "String.leftPad(this.getMinutes(), 2, '0') + ";
+    case "s":
+        return "String.leftPad(this.getSeconds(), 2, '0') + ";
+    case "O":
+        return "this.getGMTOffset() + ";
+    case "T":
+        return "this.getTimezone() + ";
+    case "Z":
+        return "(this.getTimezoneOffset() * -60) + ";
+    default:
+        return "'" + String.escape(character) + "' + ";
+    };
+};
+
+/**
+ * Parses a date given the supplied format - the format syntax is the same as <a href="http://www.php.net/date">PHP's date() function</a>.
+ */
+Date.parseDate = function(input, format) {
+    if (Date.parseFunctions[format] == null) {
+        Date.createParser(format);
+    }
+    var func = Date.parseFunctions[format];
+    return Date[func](input);
+};
+
+/** @ignore */
+Date.createParser = function(format) {
+    var funcName = "parse" + Date.parseFunctions.count++;
+    var regexNum = Date.parseRegexes.length;
+    var currentGroup = 1;
+    Date.parseFunctions[format] = funcName;
+
+    var code = "Date." + funcName + " = function(input){\n"
+        + "var y = -1, m = -1, d = -1, h = -1, i = -1, s = -1;\n"
+        + "var d = new Date();\n"
+        + "y = d.getFullYear();\n"
+        + "m = d.getMonth();\n"
+        + "d = d.getDate();\n"
+        + "var results = input.match(Date.parseRegexes[" + regexNum + "]);\n"
+        + "if (results && results.length > 0) {"
+    var regex = "";
+
+    var special = false;
+    var ch = '';
+    for (var i = 0; i < format.length; ++i) {
+        ch = format.charAt(i);
+        if (!special && ch == "\\") {
+            special = true;
+        }
+        else if (special) {
+            special = false;
+            regex += String.escape(ch);
+        }
+        else {
+            obj = Date.formatCodeToRegex(ch, currentGroup);
+            currentGroup += obj.g;
+            regex += obj.s;
+            if (obj.g && obj.c) {
+                code += obj.c;
+            }
+        }
+    }
+
+    code += "if (y > 0 && m >= 0 && d > 0 && h >= 0 && i >= 0 && s >= 0)\n"
+        + "{return new Date(y, m, d, h, i, s);}\n"
+        + "else if (y > 0 && m >= 0 && d > 0 && h >= 0 && i >= 0)\n"
+        + "{return new Date(y, m, d, h, i);}\n"
+        + "else if (y > 0 && m >= 0 && d > 0 && h >= 0)\n"
+        + "{return new Date(y, m, d, h);}\n"
+        + "else if (y > 0 && m >= 0 && d > 0)\n"
+        + "{return new Date(y, m, d);}\n"
+        + "else if (y > 0 && m >= 0)\n"
+        + "{return new Date(y, m);}\n"
+        + "else if (y > 0)\n"
+        + "{return new Date(y);}\n"
+        + "}return null;}";
+
+    Date.parseRegexes[regexNum] = new RegExp("^" + regex + "$");
+    eval(code);
+};
+
+/** @ignore */
+Date.formatCodeToRegex = function(character, currentGroup) {
+    switch (character) {
+    case "D":
+        return {g:0,
+        c:null,
+        s:"(?:Sun|Mon|Tue|Wed|Thu|Fri|Sat)"};
+    case "j":
+    case "d":
+        return {g:1,
+            c:"d = parseInt(results[" + currentGroup + "], 10);\n",
+            s:"(\\d{1,2})"};
+    case "l":
+        return {g:0,
+            c:null,
+            s:"(?:" + Date.dayNames.join("|") + ")"};
+    case "S":
+        return {g:0,
+            c:null,
+            s:"(?:st|nd|rd|th)"};
+    case "w":
+        return {g:0,
+            c:null,
+            s:"\\d"};
+    case "z":
+        return {g:0,
+            c:null,
+            s:"(?:\\d{1,3})"};
+    case "W":
+        return {g:0,
+            c:null,
+            s:"(?:\\d{2})"};
+    case "F":
+        return {g:1,
+            c:"m = parseInt(Date.monthNumbers[results[" + currentGroup + "].substring(0, 3)], 10);\n",
+            s:"(" + Date.monthNames.join("|") + ")"};
+    case "M":
+        return {g:1,
+            c:"m = parseInt(Date.monthNumbers[results[" + currentGroup + "]], 10);\n",
+            s:"(Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec)"};
+    case "n":
+    case "m":
+        return {g:1,
+            c:"m = parseInt(results[" + currentGroup + "], 10) - 1;\n",
+            s:"(\\d{1,2})"};
+    case "t":
+        return {g:0,
+            c:null,
+            s:"\\d{1,2}"};
+    case "L":
+        return {g:0,
+            c:null,
+            s:"(?:1|0)"};
+    case "Y":
+        return {g:1,
+            c:"y = parseInt(results[" + currentGroup + "], 10);\n",
+            s:"(\\d{4})"};
+    case "y":
+        return {g:1,
+            c:"var ty = parseInt(results[" + currentGroup + "], 10);\n"
+                + "y = ty > Date.y2kYear ? 1900 + ty : 2000 + ty;\n",
+            s:"(\\d{1,2})"};
+    case "a":
+        return {g:1,
+            c:"if (results[" + currentGroup + "] == 'am') {\n"
+                + "if (h == 12) { h = 0; }\n"
+                + "} else { if (h < 12) { h += 12; }}",
+            s:"(am|pm)"};
+    case "A":
+        return {g:1,
+            c:"if (results[" + currentGroup + "] == 'AM') {\n"
+                + "if (h == 12) { h = 0; }\n"
+                + "} else { if (h < 12) { h += 12; }}",
+            s:"(AM|PM)"};
+    case "g":
+    case "G":
+    case "h":
+    case "H":
+        return {g:1,
+            c:"h = parseInt(results[" + currentGroup + "], 10);\n",
+            s:"(\\d{1,2})"};
+    case "i":
+        return {g:1,
+            c:"i = parseInt(results[" + currentGroup + "], 10);\n",
+            s:"(\\d{2})"};
+    case "s":
+        return {g:1,
+            c:"s = parseInt(results[" + currentGroup + "], 10);\n",
+            s:"(\\d{2})"};
+    case "O":
+        return {g:0,
+            c:null,
+            s:"[+-]\\d{4}"};
+    case "T":
+        return {g:0,
+            c:null,
+            s:"[A-Z]{3}"};
+    case "Z":
+        return {g:0,
+            c:null,
+            s:"[+-]\\d{1,5}"};
+    default:
+        return {g:0,
+            c:null,
+            s:String.escape(character)};
+    }
+};
+
+Date.prototype.getTimezone = function() {
+    return this.toString().replace(
+        /^.*? ([A-Z]{3}) [0-9]{4}.*$/, "$1").replace(
+        /^.*?\(([A-Z])[a-z]+ ([A-Z])[a-z]+ ([A-Z])[a-z]+\)$/, "$1$2$3");
+};
+
+Date.prototype.getGMTOffset = function() {
+    return (this.getTimezoneOffset() > 0 ? "-" : "+")
+        + String.leftPad(Math.floor(this.getTimezoneOffset() / 60), 2, "0")
+        + String.leftPad(this.getTimezoneOffset() % 60, 2, "0");
+};
+
+Date.prototype.getDayOfYear = function() {
+    var num = 0;
+    Date.daysInMonth[1] = this.isLeapYear() ? 29 : 28;
+    for (var i = 0; i < this.getMonth(); ++i) {
+        num += Date.daysInMonth[i];
+    }
+    return num + this.getDate() - 1;
+};
+
+Date.prototype.getWeekOfYear = function() {
+    // Skip to Thursday of this week
+    var now = this.getDayOfYear() + (4 - this.getDay());
+    // Find the first Thursday of the year
+    var jan1 = new Date(this.getFullYear(), 0, 1);
+    var then = (7 - jan1.getDay() + 4);
+    return String.leftPad(((now - then) / 7) + 1, 2, "0");
+};
+
+Date.prototype.isLeapYear = function() {
+    var year = this.getFullYear();
+    return ((year & 3) == 0 && (year % 100 || (year % 400 == 0 && year)));
+};
+
+Date.prototype.getFirstDayOfMonth = function() {
+    var day = (this.getDay() - (this.getDate() - 1)) % 7;
+    return (day < 0) ? (day + 7) : day;
+};
+
+Date.prototype.getLastDayOfMonth = function() {
+    var day = (this.getDay() + (Date.daysInMonth[this.getMonth()] - this.getDate())) % 7;
+    return (day < 0) ? (day + 7) : day;
+};
+
+Date.prototype.getDaysInMonth = function() {
+    Date.daysInMonth[1] = this.isLeapYear() ? 29 : 28;
+    return Date.daysInMonth[this.getMonth()];
+};
+
+/** @ignore */
+Date.prototype.getSuffix = function() {
+    switch (this.getDate()) {
+        case 1:
+        case 21:
+        case 31:
+            return "st";
+        case 2:
+        case 22:
+            return "nd";
+        case 3:
+        case 23:
+            return "rd";
+        default:
+            return "th";
+    }
+};
+
+/** @ignore */
+Date.daysInMonth = [31,28,31,30,31,30,31,31,30,31,30,31];
+
+/**
+ * Override these values for international dates, for example...
+ * Date.monthNames = ['JanInYourLang', 'FebInYourLang', ...];
+ */
+Date.monthNames =
+   ["January",
+    "February",
+    "March",
+    "April",
+    "May",
+    "June",
+    "July",
+    "August",
+    "September",
+    "October",
+    "November",
+    "December"];
+    
+/**
+ * Override these values for international dates, for example...
+ * Date.dayNames = ['SundayInYourLang', 'MondayInYourLang', ...];
+ */
+Date.dayNames =
+   ["Sunday",
+    "Monday",
+    "Tuesday",
+    "Wednesday",
+    "Thursday",
+    "Friday",
+    "Saturday"];
+
+/** @ignore */
+Date.y2kYear = 50;
+
+/** @ignore */
+Date.monthNumbers = {
+    Jan:0,
+    Feb:1,
+    Mar:2,
+    Apr:3,
+    May:4,
+    Jun:5,
+    Jul:6,
+    Aug:7,
+    Sep:8,
+    Oct:9,
+    Nov:10,
+    Dec:11};
diff --git a/frontend/beta/js/YUI-extensions/DomHelper.js b/frontend/beta/js/YUI-extensions/DomHelper.js
new file mode 100644
index 0000000..d9e7484
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/DomHelper.js
@@ -0,0 +1,416 @@
+/**
+ * @class YAHOO.ext.DomHelper
+ * Utility class for working with DOM and/or Templates. It transparently supports using HTML fragments or DOM. 
+ * For more information see <a href="http://www.jackslocum.com/yui/2006/10/06/domhelper-create-elements-using-dom-html-fragments-or-templates/">this blog post with examples</a>.
+ * @singleton
+ */
+YAHOO.ext.DomHelper = new function(){
+    /**@private*/
+    var d = document;
+    var tempTableEl = null;
+    /** True to force the use of DOM instead of html fragments @type Boolean */
+    this.useDom = false;
+    var emptyTags = /^(?:base|basefont|br|frame|hr|img|input|isindex|link|meta|nextid|range|spacer|wbr|audioscope|area|param|keygen|col|limittext|spot|tab|over|right|left|choose|atop|of)$/i;
+    /**
+     * Applies a style specification to an element
+     * @param {String/HTMLElement} el The element to apply styles to
+     * @param {String/Object/Function} styles A style specification string eg "width:100px", or object in the form {width:"100px"}, or
+     * a function which returns such a specification.
+     */
+    this.applyStyles = function(el, styles){
+        if(styles){
+           var D = YAHOO.util.Dom;
+           if (typeof styles == "string"){
+               var re = /\s?([a-z\-]*)\:([^;]*);?/gi;
+               var matches;
+               while ((matches = re.exec(styles)) != null){
+                   D.setStyle(el, matches[1], matches[2]);
+               }
+           }else if (typeof styles == "object"){
+               for (var style in styles){
+                  D.setStyle(el, style, styles[style]);
+               }
+           }else if (typeof styles == "function"){
+                YAHOO.ext.DomHelper.applyStyles(el, styles.call());
+           }
+        }
+    }; 
+    
+    // build as innerHTML where available
+    /** @ignore */
+    var createHtml = function(o){
+        var b = '';
+        b += '<' + o.tag;
+        for(var attr in o){
+            if(attr == 'tag' || attr == 'children' || attr == 'html' || typeof o[attr] == 'function') continue;
+            if(attr == 'style'){
+                var s = o['style'];
+                if(typeof s == 'function'){
+                    s = s.call();
+                }
+                if(typeof s == 'string'){
+                    b += ' style="' + s + '"';
+                }else if(typeof s == 'object'){
+                    b += ' style="';
+                    for(var key in s){
+                        if(typeof s[key] != 'function'){
+                            b += key + ':' + s[key] + ';';
+                        }
+                    }
+                    b += '"';
+                }
+            }else{
+                if(attr == 'cls'){
+                    b += ' class="' + o['cls'] + '"';
+                }else if(attr == 'htmlFor'){
+                    b += ' for="' + o['htmlFor'] + '"';
+                }else{
+                    b += ' ' + attr + '="' + o[attr] + '"';
+                }
+            }
+        }
+        if(emptyTags.test(o.tag)){
+            b += ' />';
+        }else{
+            b += '>';
+            if(o.children){
+                for(var i = 0, len = o.children.length; i < len; i++) {
+                    b += createHtml(o.children[i], b);
+                }
+            }
+            if(o.html){
+                b += o.html;
+            }
+            b += '</' + o.tag + '>';
+        }
+        return b;
+    }
+    
+    // build as dom
+    /** @ignore */
+    var createDom = function(o, parentNode){
+        var el = d.createElement(o.tag);
+        var useSet = el.setAttribute ? true : false; // In IE some elements don't have setAttribute
+        for(var attr in o){
+            if(attr == 'tag' || attr == 'children' || attr == 'html' || attr == 'style' || typeof o[attr] == 'function') continue;
+            if(attr=='cls'){
+                el.className = o['cls'];
+            }else{
+                if(useSet) el.setAttribute(attr, o[attr]);
+                else el[attr] = o[attr];
+            }
+        }
+        YAHOO.ext.DomHelper.applyStyles(el, o.style);
+        if(o.children){
+            for(var i = 0, len = o.children.length; i < len; i++) {
+             	createDom(o.children[i], el);
+            }
+        }
+        if(o.html){
+            el.innerHTML = o.html;
+        }
+        if(parentNode){
+           parentNode.appendChild(el);
+        }
+        return el;
+    };
+    
+    /**
+     * @ignore
+     * Nasty code for IE's broken table implementation 
+     */
+    var insertIntoTable = function(tag, where, el, html){
+        if(!tempTableEl){
+            tempTableEl = document.createElement('div');
+        }
+        var node;
+        if(tag == 'table' || tag == 'tbody'){
+           tempTableEl.innerHTML = '<table><tbody>'+html+'</tbody></table>';
+           node = tempTableEl.firstChild.firstChild.firstChild;
+        }else{
+           tempTableEl.innerHTML = '<table><tbody><tr>'+html+'</tr></tbody></table>';
+           node = tempTableEl.firstChild.firstChild.firstChild.firstChild;
+        }
+        if(where == 'beforebegin'){
+            el.parentNode.insertBefore(node, el);
+            return node;
+        }else if(where == 'afterbegin'){
+            el.insertBefore(node, el.firstChild);
+            return node;
+        }else if(where == 'beforeend'){
+            el.appendChild(node);
+            return node;
+        }else if(where == 'afterend'){
+            el.parentNode.insertBefore(node, el.nextSibling);
+            return node;
+        }
+    } 
+    
+    /**
+     * Inserts an HTML fragment into the Dom
+     * @param {String} where Where to insert the html in relation to el - beforeBegin, afterBegin, beforeEnd, afterEnd.
+     * @param {HTMLElement} el The context element
+     * @param {String} html The HTML fragmenet
+     * @return {HTMLElement} The new node
+     */
+    this.insertHtml = function(where, el, html){
+        where = where.toLowerCase();
+        if(el.insertAdjacentHTML){
+            var tag = el.tagName.toLowerCase();
+            if(tag == 'table' || tag == 'tbody' || tag == 'tr'){
+               return insertIntoTable(tag, where, el, html);
+            }
+            switch(where){
+                case 'beforebegin':
+                    el.insertAdjacentHTML(where, html);
+                    return el.previousSibling;
+                case 'afterbegin':
+                    el.insertAdjacentHTML(where, html);
+                    return el.firstChild;
+                case 'beforeend':
+                    el.insertAdjacentHTML(where, html);
+                    return el.lastChild;
+                case 'afterend':
+                    el.insertAdjacentHTML(where, html);
+                    return el.nextSibling;
+            }
+            throw 'Illegal insertion point -> "' + where + '"';
+        }
+        var range = el.ownerDocument.createRange();
+        var frag;
+        switch(where){
+             case 'beforebegin':
+                range.setStartBefore(el);
+                frag = range.createContextualFragment(html);
+                el.parentNode.insertBefore(frag, el);
+                return el.previousSibling;
+             case 'afterbegin':
+                if(el.firstChild){ // faster
+                    range.setStartBefore(el.firstChild);
+                }else{
+                    range.selectNodeContents(el);
+                    range.collapse(true);
+                }
+                frag = range.createContextualFragment(html);
+                el.insertBefore(frag, el.firstChild);
+                return el.firstChild;
+            case 'beforeend':
+                if(el.lastChild){
+                    range.setStartAfter(el.lastChild); // faster
+                }else{
+                    range.selectNodeContents(el);
+                    range.collapse(false);
+                }
+                frag = range.createContextualFragment(html);
+                el.appendChild(frag);
+                return el.lastChild;
+            case 'afterend':
+                range.setStartAfter(el);
+                frag = range.createContextualFragment(html);
+                el.parentNode.insertBefore(frag, el.nextSibling);
+                return el.nextSibling;
+            }
+            throw 'Illegal insertion point -> "' + where + '"';
+    };
+    
+    /**
+     * Creates new Dom element(s) and inserts them before el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} o The Dom object spec (and children)
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    this.insertBefore = function(el, o, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode;
+        if(this.useDom){
+            newNode = createDom(o, null);
+            el.parentNode.insertBefore(newNode, el);
+        }else{
+            var html = createHtml(o);
+            newNode = this.insertHtml('beforeBegin', el, html);
+        }
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    };
+    
+    /**
+     * Creates new Dom element(s) and inserts them after el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} o The Dom object spec (and children)
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    this.insertAfter = function(el, o, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode;
+        if(this.useDom){
+            newNode = createDom(o, null);
+            el.parentNode.insertBefore(newNode, el.nextSibling);
+        }else{
+            var html = createHtml(o);
+            newNode = this.insertHtml('afterEnd', el, html);
+        }
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    };
+    
+    /**
+     * Creates new Dom element(s) and appends them to el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} o The Dom object spec (and children)
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    this.append = function(el, o, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode;
+        if(this.useDom){
+            newNode = createDom(o, null);
+            el.appendChild(newNode);
+        }else{
+            var html = createHtml(o);
+            newNode = this.insertHtml('beforeEnd', el, html);
+        }
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    };
+    
+    /**
+     * Creates new Dom element(s) and overwrites the contents of el with them
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} o The Dom object spec (and children)
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    this.overwrite = function(el, o, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        el.innerHTML = createHtml(o);
+        return returnElement ? YAHOO.ext.Element.get(el.firstChild, true) : el.firstChild;
+    };
+    
+    /**
+     * Creates a new YAHOO.ext.DomHelper.Template from the Dom object spec 
+     * @param {Object} o The Dom object spec (and children)
+     * @return {YAHOO.ext.DomHelper.Template} The new template
+     */
+    this.createTemplate = function(o){
+        var html = createHtml(o);
+        return new YAHOO.ext.DomHelper.Template(html);
+    };
+}();
+
+/**
+* @class YAHOO.ext.DomHelper.Template
+* Represents an HTML fragment template.
+* For more information see <a href="http://www.jackslocum.com/yui/2006/10/06/domhelper-create-elements-using-dom-html-fragments-or-templates/">this blog post with examples</a>. 
+* <br>
+* <b>This class is also available as YAHOO.ext.Template</b>.
+* @constructor
+* @param {String/Array} html The HTML fragment or an array of fragments to join('') or multiple arguments to join('')
+*/
+YAHOO.ext.DomHelper.Template = function(html){
+    if(html instanceof Array){
+        html = html.join(''); 
+    }else if(arguments.length > 1){
+        html = Array.prototype.join.call(arguments, '');
+    }
+    /**@private*/
+    this.html = html;
+};
+YAHOO.ext.DomHelper.Template.prototype = {
+    /**
+     * Returns an HTML fragment of this template with the specified values applied
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @return {String}
+     */
+    applyTemplate : function(values){
+        if(this.compiled){
+            return this.compiled(values);
+        }
+        var empty = '';
+        var fn = function(match, index){
+            if(typeof values[index] != 'undefined'){
+                return values[index];
+            }else{
+                return empty;
+            }
+        }
+        return this.html.replace(this.re, fn);
+    },
+    
+    /**
+    * The regular expression used to match template variables 
+    * @type RegExp
+    * @property 
+    */
+    re : /\{([\w|-]+)\}/g,
+    
+    /**
+     * Compiles the template into an internal function, eliminating the RegEx overhead
+     */
+    compile : function(){
+        var body = ["this.compiled = function(values){ return ['"];
+        body.push(this.html.replace(this.re, "', values['$1'], '"));
+        body.push("'].join('');};");
+        eval(body.join(''));
+        return this;
+    },
+   
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) before el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    insertBefore: function(el, values, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode = YAHOO.ext.DomHelper.insertHtml('beforeBegin', el, this.applyTemplate(values));
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    },
+    
+    /**
+     * Applies the supplied values to the template and inserts the new node(s) after el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    insertAfter : function(el, values, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode = YAHOO.ext.DomHelper.insertHtml('afterEnd', el, this.applyTemplate(values));
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    },
+    
+    /**
+     * Applies the supplied values to the template and append the new node(s) to el
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    append : function(el, values, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        var newNode = YAHOO.ext.DomHelper.insertHtml('beforeEnd', el, this.applyTemplate(values));
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    },
+    
+    /**
+     * Applies the supplied values to the template and overwrites the content of el with the new node(s)
+     * @param {String/HTMLElement/Element} el The context element
+     * @param {Object} values The template values. Can be an array if your params are numeric (i.e. {0}) or an object (i.e. {foo: 'bar'})
+     * @param {<i>Boolean</i>} returnElement (optional) true to return a YAHOO.ext.Element
+     * @return {HTMLElement} The new node
+     */
+    overwrite : function(el, values, returnElement){
+        el = el.dom ? el.dom : YAHOO.util.Dom.get(el);
+        el.innerHTML = '';
+        var newNode = YAHOO.ext.DomHelper.insertHtml('beforeEnd', el, this.applyTemplate(values));
+        return returnElement ? YAHOO.ext.Element.get(newNode, true) : newNode;
+    }
+};
+/**
+ * Alias for applyTemplate
+ * @method
+ */
+YAHOO.ext.DomHelper.Template.prototype.apply = YAHOO.ext.DomHelper.Template.prototype.applyTemplate;
+
+YAHOO.ext.Template = YAHOO.ext.DomHelper.Template;
diff --git a/frontend/beta/js/YUI-extensions/Element.js b/frontend/beta/js/YUI-extensions/Element.js
new file mode 100644
index 0000000..4019923
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/Element.js
@@ -0,0 +1,2157 @@
+/**
+ * @class YAHOO.ext.Element
+ * Wraps around a DOM element and provides convenient access to Yahoo 
+ * UI library functionality (and more).<br><br>
+ * Usage:<br>
+ * <pre><code>
+ * var el = YAHOO.ext.Element.get('myElementId');
+ * // or the shorter
+ * var el = getEl('myElementId');
+ * </code></pre>
+ * Using YAHOO.ext.Element.get() instead of calling the constructor directly ensures you get the same object 
+ * each call instead of constructing a new one.<br><br>
+ * For working with collections of Elements, see <a href="YAHOO.ext.CompositeElement.html">YAHOO.ext.CompositeElement</a>
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @requires YAHOO.util.CustomEvent 
+ * @requires YAHOO.util.Anim (optional) to support animation
+ * @requires YAHOO.util.Motion (optional) to support animation
+ * @requires YAHOO.util.Easing (optional) to support animation
+ * @constructor Create a new Element directly.
+ * @param {String/HTMLElement} element
+ * @param {<i>Boolean</i>} forceNew (optional) By default the constructor checks to see if there is already an instance of this element in the cache and if there is it returns the same instance. This will skip that check (useful for extending this class).
+ */
+YAHOO.ext.Element = function(element, forceNew){
+    var dom = typeof element == 'string' ? 
+            document.getElementById(element) : element;
+    if(!dom){ // invalid id/element
+        return null;
+    }
+    if(!forceNew && YAHOO.ext.Element.cache[dom.id]){ // element object already exists
+        return YAHOO.ext.Element.cache[dom.id];
+    }
+    /**
+     * The DOM element
+     * @type HTMLElement
+     */
+    this.dom = dom;
+    
+    /**
+     * The DOM element ID
+     * @type String
+     */
+    this.id = dom.id;
+        
+    /**
+     * The element's default display mode @type String
+     */
+    this.originalDisplay = YAHOO.util.Dom.getStyle(dom, 'display') || '';
+    if(this.autoDisplayMode){
+        if(this.originalDisplay == 'none'){
+            this.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+        }
+    }
+    if(this.originalDisplay == 'none'){
+        this.originalDisplay = '';
+    }
+}
+
+YAHOO.ext.Element.prototype = {    
+    visibilityMode : 1,
+    /**
+     * The default unit to append to CSS values where a unit isn't provided (Defaults to px).
+     * @type String
+     */
+    defaultUnit : 'px',
+    /**
+     * Sets the elements visibility mode. When setVisible() is called it
+     * will use this to determine whether to set the visibility or the display property.
+     * @param visMode Element.VISIBILITY or Element.DISPLAY
+     * @return {YAHOO.ext.Element} this
+     */
+    setVisibilityMode : function(visMode){
+        this.visibilityMode = visMode;
+        return this;
+    },
+    /**
+     * Convenience method for setVisibilityMode(Element.DISPLAY)
+     * @param {String} display (optional) What to set display to when visible
+     * @return {YAHOO.ext.Element} this
+     */
+    enableDisplayMode : function(display){
+        this.setVisibilityMode(YAHOO.ext.Element.DISPLAY);
+        if(typeof display != 'undefined') this.originalDisplay = display;
+        return this;
+    },
+    
+    /**
+     * Perform Yahoo UI animation on this element. 
+     * @param {Object} args The YUI animation control args
+     * @param {<i>Float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+     * @param {<i>Function</i>} animType (optional) YAHOO.util.Anim subclass to use. For example: YAHOO.util.Motion
+     * @return {YAHOO.ext.Element} this
+     */
+    animate : function(args, duration, onComplete, easing, animType, stopAnims){
+        this.anim(args, duration, onComplete, easing, animType);
+        return this;
+    },
+    
+    /**
+     * @private Internal animation call
+     */
+    anim : function(args, duration, onComplete, easing, animType){
+        animType = animType || YAHOO.util.Anim;
+        var anim = new animType(this.dom, args, duration || .35, 
+                easing || YAHOO.util.Easing.easeBoth);
+        if(onComplete){
+             anim.onComplete.subscribe(function(){
+                if(typeof onComplete == 'function'){
+                    onComplete.call(this);
+                }else if(onComplete instanceof Array){
+                    for(var i = 0; i < onComplete.length; i++){
+                        var fn = onComplete[i];
+                        if(fn) fn.call(this);
+                    }
+                }
+            }, this, true);
+        }
+        anim.animate();
+        return anim;
+    },
+    
+    /**
+     * Scrolls this element into view within the passed container.
+     * @param {<i>String/HTMLElement/Element</i>} container (optional) The container element to scroll (defaults to document.body)
+     * @return {YAHOO.ext.Element} this
+     */
+    scrollIntoView : function(container){
+        var c = getEl(container || document.body, true);
+        var cp = c.getStyle('position');
+        var restorePos = false;
+        if(cp != 'relative' && cp != 'absolute'){
+            c.setStyle('position', 'relative');
+            restorePos = true;
+        }
+        var el = this.dom;
+        var childTop = parseInt(el.offsetTop, 10);
+        var childBottom = childTop + el.offsetHeight;
+        var containerTop = parseInt(c.dom.scrollTop, 10); // parseInt for safari bug
+        var containerBottom = containerTop + c.dom.clientHeight;
+        if(childTop < containerTop){
+        	c.dom.scrollTop = childTop;
+        }else if(childBottom > containerBottom){
+            c.dom.scrollTop = childBottom-c.dom.clientHeight;
+        }
+        if(restorePos){
+            c.setStyle('position', cp);
+        }
+        return this;
+    },
+        
+    /** 
+     * Measures the elements content height and updates height to match. Note, this function uses setTimeout and 
+     * the new height may not be available immediately.
+     * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>Float</i>} duration (optional) Length of the animation. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeOut for hiding or YAHOO.util.Easing.easeIn for showing)
+     * @return {YAHOO.ext.Element} this
+     */
+    autoHeight : function(animate, duration, onComplete, easing){
+        var oldHeight = this.getHeight();
+        this.clip();
+        this.setHeight(1); // force clipping
+        setTimeout(function(){
+            var height = parseInt(this.dom.scrollHeight, 10); // parseInt for Safari
+            if(!animate){
+                this.setHeight(height);
+                this.unclip();
+                if(typeof onComplete == 'function'){
+                    onComplete();
+                }
+            }else{
+                this.setHeight(oldHeight); // restore original height
+                this.setHeight(height, animate, duration, function(){
+                    this.unclip();
+                    if(typeof onComplete == 'function') onComplete();
+                }.createDelegate(this), easing);
+            }
+        }.createDelegate(this), 0);
+        return this;
+    },
+    
+    contains : function(el){
+        if(!el){return false;}
+        return YAHOO.util.Dom.isAncestor(this.dom, el.dom ? el.dom : el);
+    },
+    
+    /**
+     * Checks whether the element is currently visible using both visibility and display properties.
+     * @param {<i>Boolean</i>} deep True to walk the dom and see if parent elements are hidden.
+     * @return {Boolean} true if the element is currently visible 
+     */
+    isVisible : function(deep) {
+        var vis = YAHOO.util.Dom.getStyle(this.dom, 'visibility') != 'hidden' 
+               && YAHOO.util.Dom.getStyle(this.dom, 'display') != 'none';
+        if(!deep || !vis){
+            return vis;
+        }
+        var p = this.dom.parentNode;
+        while(p && p.tagName.toLowerCase() != 'body'){
+            if(YAHOO.util.Dom.getStyle(p, 'visibility') == 'hidden' || YAHOO.util.Dom.getStyle(p, 'display') == 'none'){
+                return false;
+            }
+            p = p.parentNode;
+        }
+        return true;
+    },
+    
+    /**
+     * Selects child nodes based on the passed CSS selector (the selector should not contain an id)
+     * @param {String} selector The CSS selector
+     * @param {Boolean} unique true to create a unique YAHOO.ext.Element for each child (defaults to a shared flyweight object)
+     * @return {CompositeElement/CompositeElementLite} The composite element
+     */
+    select : function(selector, unique){
+        return YAHOO.ext.Element.select('#' + this.dom.id + ' ' + selector, unique);  
+    },
+    
+    /**
+     * Initializes a YAHOO.util.DD object for this element.
+     * @param {String} group The group the DD object is member of
+     * @param {Object} config The DD config object
+     * @param {Object} overrides An object containing methods to override/implement on the DD object
+     * @return {YAHOO.util.DD} The DD object
+     */
+    initDD : function(group, config, overrides){
+        var dd = new YAHOO.util.DD(YAHOO.util.Dom.generateId(this.dom), group, config);
+        return YAHOO.ext.util.Config.apply(dd, overrides);
+    },
+   
+    /**
+     * Initializes a YAHOO.util.DDProxy object for this element.
+     * @param {String} group The group the DDProxy object is member of
+     * @param {Object} config The DDProxy config object
+     * @param {Object} overrides An object containing methods to override/implement on the DDProxy object
+     * @return {YAHOO.util.DDProxy} The DDProxy object
+     */
+    initDDProxy : function(group, config, overrides){
+        var dd = new YAHOO.util.DDProxy(YAHOO.util.Dom.generateId(this.dom), group, config);
+        return YAHOO.ext.util.Config.apply(dd, overrides);
+    },
+   
+    /**
+     * Initializes a YAHOO.util.DDTarget object for this element.
+     * @param {String} group The group the DDTarget object is member of
+     * @param {Object} config The DDTarget config object
+     * @param {Object} overrides An object containing methods to override/implement on the DDTarget object
+     * @return {YAHOO.util.DDTarget} The DDTarget object
+     */
+    initDDTarget : function(group, config, overrides){
+        var dd = new YAHOO.util.DDTarget(YAHOO.util.Dom.generateId(this.dom), group, config);
+        return YAHOO.ext.util.Config.apply(dd, overrides);
+    },
+   
+    /**
+     * Sets the visibility of the element (see details). If the visibilityMode is set to Element.DISPLAY, it will use 
+     * the display property to hide the element, otherwise it uses visibility. The default is to hide and show using the visibility property.
+     * @param {Boolean} visible Whether the element is visible
+     * @param {<i>Boolean</i>} animate (optional) Fade the element in or out (Default is false)
+     * @param {<i>Float</i>} duration (optional) How long the fade effect lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeOut for hiding or YAHOO.util.Easing.easeIn for showing)
+     * @return {YAHOO.ext.Element} this
+     */
+     setVisible : function(visible, animate, duration, onComplete, easing){
+        //if(this.isVisible() == visible) return; // nothing to do
+        if(!animate || !YAHOO.util.Anim){
+            if(this.visibilityMode == YAHOO.ext.Element.DISPLAY){
+                this.setDisplayed(visible);
+            }else{
+                YAHOO.util.Dom.setStyle(this.dom, 'visibility', visible ? 'visible' : 'hidden');
+            }
+        }else{
+            // make sure they can see the transition
+            this.setOpacity(visible?0:1);
+            YAHOO.util.Dom.setStyle(this.dom, 'visibility', 'visible');
+            if(this.visibilityMode == YAHOO.ext.Element.DISPLAY){
+                this.setDisplayed(true);
+            }
+            var args = {opacity: { from: (visible?0:1), to: (visible?1:0) }};
+            var anim = new YAHOO.util.Anim(this.dom, args, duration || .35, 
+                easing || (visible ? YAHOO.util.Easing.easeIn : YAHOO.util.Easing.easeOut));
+            anim.onComplete.subscribe((function(){
+                if(this.visibilityMode == YAHOO.ext.Element.DISPLAY){
+                    this.setDisplayed(visible);
+                }else{
+                    YAHOO.util.Dom.setStyle(this.dom, 'visibility', visible ? 'visible' : 'hidden');
+                }
+            }).createDelegate(this));
+            if(onComplete){
+                anim.onComplete.subscribe(onComplete);
+            }
+            anim.animate();
+        }
+        return this;
+    },
+    
+    /**
+     * Returns true if display is not "none"
+     * @return {Boolean}
+     */
+    isDisplayed : function() {
+        return YAHOO.util.Dom.getStyle(this.dom, 'display') != 'none';
+    },
+    
+    /**
+     * Toggles the elements visibility or display, depending on visibility mode.
+     * @param {<i>Boolean</i>} animate (optional) Fade the element in or out (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the fade effect lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeOut for hiding or YAHOO.util.Easing.easeIn for showing)
+     * @return {YAHOO.ext.Element} this
+     */
+    toggle : function(animate, duration, onComplete, easing){
+        this.setVisible(!this.isVisible(), animate, duration, onComplete, easing);
+        return this;
+    },
+    
+    /**
+     * Sets the css display. Uses originalDisplay if value is a boolean true.
+     * @param {Boolean} value Boolean to display the element using it's default display or a string to set the display directly
+     * @return {YAHOO.ext.Element} this
+     */
+    setDisplayed : function(value) {
+        if(typeof value == 'boolean'){
+           value = value ? this.originalDisplay : 'none';
+        }
+        YAHOO.util.Dom.setStyle(this.dom, 'display', value);
+        return this;
+    },
+    
+    /**
+     * Tries to focus the element. Any exceptions are caught.
+     * @return {YAHOO.ext.Element} this
+     */
+    focus : function() {
+        try{
+            this.dom.focus();
+        }catch(e){}
+        return this;
+    },
+    
+    /**
+     * Tries to blur the element. Any exceptions are caught.
+     * @return {YAHOO.ext.Element} this
+     */
+    blur : function() {
+        try{
+            this.dom.blur();
+        }catch(e){}
+        return this;
+    },
+    
+    /**
+     * Add a CSS class to the element.
+     * @param {String/Array} className The CSS class to add or an array of classes
+     * @return {YAHOO.ext.Element} this
+     */
+    addClass : function(className){
+        if(className instanceof Array){
+            for(var i = 0, len = className.length; i < len; i++) {
+            	this.addClass(className[i]);
+            }
+        }else{
+            if(!this.hasClass(className)){
+                this.dom.className = this.dom.className + ' ' + className;
+            }
+        }
+        return this;
+    },
+    
+    /**
+     * Adds the passed className to this element and removes the class from all siblings
+     * @param {String} className The className to add
+     * @return {YAHOO.ext.Element} this
+     */
+    radioClass : function(className){
+        var siblings = this.dom.parentNode.childNodes;
+        for(var i = 0; i < siblings.length; i++) {
+        	var s = siblings[i];
+        	if(s.nodeType == 1){
+        	    YAHOO.util.Dom.removeClass(s, className);
+        	}
+        }
+        this.addClass(className);
+        return this;
+    },
+    /**
+     * Removes a CSS class from the element.
+     * @param {String/Array} className The CSS class to remove or an array of classes
+     * @return {YAHOO.ext.Element} this
+     */
+    removeClass : function(className){
+        if(!className){
+            return this;
+        }
+        if(className instanceof Array){
+            for(var i = 0, len = className.length; i < len; i++) {
+            	this.removeClass(className[i]);
+            }
+        }else{
+            var re = new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)', 'g');
+            var c = this.dom.className;
+            if(re.test(c)){
+                this.dom.className = c.replace(re, ' ');
+            }
+        }
+        return this;
+    },
+    
+    /**
+     * Toggles (adds or removes) the passed class.
+     * @param {String} className
+     * @return {YAHOO.ext.Element} this
+     */
+    toggleClass : function(className){
+        if(this.hasClass(className)){
+            this.removeClass(className);
+        }else{
+            this.addClass(className);
+        }
+        return this;
+    },
+    
+    /**
+     * Checks if a CSS class is in use by the element.
+     * @param {String} className The CSS class to check
+     * @return {Boolean} true or false
+     */
+    hasClass : function(className){
+        var re = new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)');
+        return re.test(this.dom.className);
+    },
+    
+    /**
+     * Replaces a CSS class on the element with another.
+     * @param {String} oldClassName The CSS class to replace
+     * @param {String} newClassName The replacement CSS class
+     * @return {YAHOO.ext.Element} this
+     */
+    replaceClass : function(oldClassName, newClassName){
+        this.removeClass(oldClassName);
+        this.addClass(newClassName);
+        return this;
+    },
+    
+    /**
+       * Normalizes currentStyle and ComputedStyle.
+       * @param {String} property The style property whose value is returned.
+       * @return {String} The current value of the style property for this element.
+       */
+    getStyle : function(name){
+        return YAHOO.util.Dom.getStyle(this.dom, name);
+    },
+    
+    /**
+       * Wrapper for setting style properties, also takes single object parameter of multiple styles
+       * @param {String/Object} property The style property to be set or an object of multiple styles.
+       * @param {String} val (optional) The value to apply to the given property or null if an object was passed.
+       * @return {YAHOO.ext.Element} this
+     */
+    setStyle : function(name, value){
+        if(typeof name == 'string'){
+            YAHOO.util.Dom.setStyle(this.dom, name, value);
+        }else{
+            var D = YAHOO.util.Dom;
+            for(var style in name){
+                if(typeof name[style] != 'function'){
+                   D.setStyle(this.dom, style, name[style]);
+                }
+            }
+        }
+        return this;
+    },
+    
+    /**
+     * More flexible version of {@link #setStyle} for setting style properties.
+     * @param {String/Object/Function} styles A style specification string eg "width:100px", or object in the form {width:"100px"}, or
+     * a function which returns such a specification.
+     * @return {YAHOO.ext.Element} this
+     */
+    applyStyles : function(style){
+       YAHOO.ext.DomHelper.applyStyles(this.dom, style);
+    },
+    
+    /**
+       * Gets the current X position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+       @ return {Number} The X position of the element
+       */
+    getX : function(){
+        return YAHOO.util.Dom.getX(this.dom);
+    },
+    
+    /**
+       * Gets the current Y position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+       @ return {Number} The Y position of the element
+       */
+    getY : function(){
+        return YAHOO.util.Dom.getY(this.dom);
+    },
+    
+    /**
+       * Gets the current position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+       @ return {Array} The XY position of the element
+       */
+    getXY : function(){
+        return YAHOO.util.Dom.getXY(this.dom);
+    },
+    
+    /**
+       * Sets the X position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+       @param {Number} The X position of the element
+      * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+     * @return {YAHOO.ext.Element} this
+     */
+    setX : function(x, animate, duration, onComplete, easing){
+        if(!animate || !YAHOO.util.Anim){
+            YAHOO.util.Dom.setX(this.dom, x);
+        }else{
+            this.setXY([x, this.getY()], animate, duration, onComplete, easing);
+        }
+        return this;
+    },
+    
+    /**
+       * Sets the Y position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+       @param {Number} The Y position of the element
+      * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+     * @return {YAHOO.ext.Element} this
+      */
+    setY : function(y, animate, duration, onComplete, easing){
+        if(!animate || !YAHOO.util.Anim){
+            YAHOO.util.Dom.setY(this.dom, y);
+        }else{
+            this.setXY([this.getX(), y], animate, duration, onComplete, easing);
+        }
+        return this;
+    },
+    
+    /**
+     * Set the element's left position directly using CSS style (instead of setX())
+     * @param {String} left The left CSS property value
+     * @return {YAHOO.ext.Element} this
+     */
+    setLeft : function(left){
+        YAHOO.util.Dom.setStyle(this.dom, 'left', this.addUnits(left));
+        return this;
+    },
+    
+    /**
+     * Set the element's top position directly using CSS style (instead of setY())
+     * @param {String} top The top CSS property value
+     * @return {YAHOO.ext.Element} this
+     */
+    setTop : function(top){
+        YAHOO.util.Dom.setStyle(this.dom, 'top', this.addUnits(top));
+        return this;
+    },
+    
+    /**
+     * Set the element's css right style
+     * @param {String} right The right CSS property value
+     * @return {YAHOO.ext.Element} this
+     */
+    setRight : function(right){
+        YAHOO.util.Dom.setStyle(this.dom, 'right', this.addUnits(right));
+        return this;
+    },
+    
+    /**
+     * Set the element's css bottom style
+     * @param {String} bottom The bottom CSS property value
+     * @return {YAHOO.ext.Element} this
+     */
+    setBottom : function(bottom){
+        YAHOO.util.Dom.setStyle(this.dom, 'bottom', this.addUnits(bottom));
+        return this;
+    },
+    
+    /**
+     * Set the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Array} pos Contains X & Y [x, y] values for new position (coordinates are page-based)
+     * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+      * @return {YAHOO.ext.Element} this
+       */
+    setXY : function(pos, animate, duration, onComplete, easing){
+        if(!animate || !YAHOO.util.Anim){
+            YAHOO.util.Dom.setXY(this.dom, pos);
+        }else{
+            this.anim({points: {to: pos}}, duration, onComplete, easing, YAHOO.util.Motion);
+        }
+        return this;
+    },
+    
+    /**
+     * Set the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+     * @return {YAHOO.ext.Element} this
+     */
+    setLocation : function(x, y, animate, duration, onComplete, easing){
+        this.setXY([x, y], animate, duration, onComplete, easing);
+        return this;
+    },
+    
+    /**
+     * Set the position of the element in page coordinates, regardless of how the element is positioned.
+     * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+     * @return {YAHOO.ext.Element} this
+     */
+    moveTo : function(x, y, animate, duration, onComplete, easing){
+        //YAHOO.util.Dom.setStyle(this.dom, 'left', this.addUnits(x));
+        //YAHOO.util.Dom.setStyle(this.dom, 'top', this.addUnits(y));
+        this.setXY([x, y], animate, duration, onComplete, easing);
+        return this;
+    },
+    
+    /**
+       * Returns the region of the given element.
+       * The element must be part of the DOM tree to have a region (display:none or elements not appended return false).
+       * @return {Region} A YAHOO.util.Region containing "top, left, bottom, right" member data.
+       */
+    getRegion : function(){
+        return YAHOO.util.Dom.getRegion(this.dom);
+    },
+    
+    /**
+     * Returns the offset height of the element
+     * @param {Boolean} contentHeight (optional) true to get the height minus borders and padding
+     * @return {Number} The element's height
+     */
+    getHeight : function(contentHeight){
+        var h = this.dom.offsetHeight;
+        return contentHeight !== true ? h : h-this.getBorderWidth('tb')-this.getPadding('tb');
+    },
+    
+    /**
+     * Returns the offset width of the element
+     * @param {Boolean} contentWidth (optional) true to get the width minus borders and padding
+     * @return {Number} The element's width
+     */
+    getWidth : function(contentWidth){
+        var w = this.dom.offsetWidth;
+        return contentWidth !== true ? w : w-this.getBorderWidth('lr')-this.getPadding('lr');
+    },
+    
+    /**
+     * Returns the size of the element
+     * @param {Boolean} contentSize (optional) true to get the width/size minus borders and padding
+     * @return {Object} An object containing the element's size {width: (element width), height: (element height)}
+     */
+    getSize : function(contentSize){
+        return {width: this.getWidth(contentSize), height: this.getHeight(contentSize)};
+    },
+    
+    /** @private */
+    adjustWidth : function(width){
+        if(typeof width == 'number'){
+            if(this.autoBoxAdjust && !this.isBorderBox()){
+               width -= (this.getBorderWidth('lr') + this.getPadding('lr'));
+            }
+            if(width < 0){
+                width = 0;
+            }
+        }
+        return width;
+    },
+    
+    /** @private */
+    adjustHeight : function(height){
+        if(typeof height == 'number'){
+           if(this.autoBoxAdjust && !this.isBorderBox()){
+               height -= (this.getBorderWidth('tb') + this.getPadding('tb'));
+           }
+           if(height < 0){
+               height = 0;
+           }
+        }
+        return height;
+    },
+    
+    /**
+     * Set the width of the element
+     * @param {Number} width The new width
+     * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeOut if width is larger or YAHOO.util.Easing.easeIn if it is smaller)
+     * @return {YAHOO.ext.Element} this
+     */
+    setWidth : function(width, animate, duration, onComplete, easing){
+        width = this.adjustWidth(width);
+        if(!animate || !YAHOO.util.Anim){
+            this.dom.style.width = this.addUnits(width); 
+            //YAHOO.util.Dom.setStyle(this.dom, 'width', this.addUnits(width));
+        }else{
+            this.anim({width: {to: width}}, duration, onComplete, 
+                easing || (width > this.getWidth() ? YAHOO.util.Easing.easeOut : YAHOO.util.Easing.easeIn));
+        }
+        return this;
+    },
+    
+    /**
+     * Set the height of the element
+     * @param {Number} height The new height
+     * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeOut if height is larger or YAHOO.util.Easing.easeIn if it is smaller)
+     * @return {YAHOO.ext.Element} this
+     */
+     setHeight : function(height, animate, duration, onComplete, easing){
+        height = this.adjustHeight(height);
+        if(!animate || !YAHOO.util.Anim){
+            this.dom.style.height = this.addUnits(height); 
+            //YAHOO.util.Dom.setStyle(this.dom, 'height', this.addUnits(height));
+        }else{
+            this.anim({height: {to: height}}, duration, onComplete,  
+                   easing || (height > this.getHeight() ? YAHOO.util.Easing.easeOut : YAHOO.util.Easing.easeIn));
+        }
+        return this;
+    },
+    
+    /**
+     * Set the size of the element. If animation is true, both width an height will be animated concurrently.
+     * @param {Number} width The new width
+     * @param {Number} height The new height
+     * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+     * @return {YAHOO.ext.Element} this
+     */
+     setSize : function(width, height, animate, duration, onComplete, easing){
+        width = this.adjustWidth(width); height = this.adjustHeight(height);
+        if(!animate || !YAHOO.util.Anim){
+            this.dom.style.width = this.addUnits(width);
+            this.dom.style.height = this.addUnits(height);
+        }else{
+            this.anim({width: {to: width}, height: {to: height}}, duration, onComplete, easing);
+        }
+        return this;
+    },
+    
+    /**
+     * Sets the element's position and size in one shot. If animation is true then width, height, x and y will be animated concurrently.
+     * @param {Number} x X value for new position (coordinates are page-based)
+     * @param {Number} y Y value for new position (coordinates are page-based)
+     * @param {Number} width The new width
+     * @param {Number} height The new height
+     * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+     * @return {YAHOO.ext.Element} this
+     */
+    setBounds : function(x, y, width, height, animate, duration, onComplete, easing){
+        if(!animate || !YAHOO.util.Anim){
+            this.setSize(width, height);
+            this.setLocation(x, y);
+        }else{
+            width = this.adjustWidth(width); height = this.adjustHeight(height);
+            this.anim({points: {to: [x, y]}, width: {to: width}, height: {to: height}}, duration, onComplete, easing, YAHOO.util.Motion);
+        }
+        return this;
+    },
+    
+    /**
+     * Sets the element's position and size the the specified region. If animation is true then width, height, x and y will be animated concurrently.
+     * @param {YAHOO.util.Region} region The region to fill
+     * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+     * @return {YAHOO.ext.Element} this
+     */
+    setRegion : function(region, animate, duration, onComplete, easing){
+        this.setBounds(region.left, region.top, region.right-region.left, region.bottom-region.top, animate, duration, onComplete, easing);
+        return this;
+    },
+    
+    /**
+     * Appends an event handler to this element
+     * @param {String}   eventName     The type of event to listen for
+     * @param {Function} handler        The method the event invokes
+     * @param {<i>Object</i>}   scope  (optional)  An arbitrary object that will be 
+     *                             passed as a parameter to the handler
+     * @param {<i>boolean</i>}  override (optional) If true, the obj passed in becomes
+     *                             the execution scope of the listener
+     * @return {YAHOO.ext.Element} this
+     */
+    addListener : function(eventName, handler, scope, override){
+        YAHOO.util.Event.addListener(this.dom, eventName, handler, scope || this, true);
+        return this;
+    },
+    /**
+     * Appends an event handler to this element that is buffered. If the event is triggered more than once
+     * in the specified time-frame, only the last one actually fires.
+     * @param {String}   eventName     The type of event to listen for
+     * @param {Function} handler        The method the event invokes
+     * @param {<i>Object</i>}   scope  (optional) The scope (this object) for the handler
+     * @param {<i>Number</i>}  millis (optional) The number of milliseconds to buffer (defaults to 250)
+     * @return {Function} The wrapped function that was created (can be used to remove the listener)
+     */
+    bufferedListener : function(eventName, fn, scope, millis){
+        var task = new YAHOO.ext.util.DelayedTask();
+        scope = scope || this;
+        var newFn = function(e){
+            task.delay(millis || 250, fn, scope, Array.prototype.slice.call(arguments, 0));
+        }
+        this.addListener(eventName, newFn);
+        return newFn;
+    },
+    
+    
+    /**
+     * Appends an event handler to this element. The difference between this function and addListener is this
+     * function prevents the default action, and if set stops propagation (bubbling) as well
+     * @param {String}   eventName     The type of event to listen for
+     * @param {Boolean}   stopPropagation     Whether to also stopPropagation (bubbling) 
+     * @param {Function} handler        The method the event invokes
+     * @param {<i>Object</i>}   scope  (optional)  An arbitrary object that will be 
+     *                             passed as a parameter to the handler
+     * @param {<i>boolean</i>}  override (optional) If true, the obj passed in becomes
+     *                             the execution scope of the listener
+     * @return {YAHOO.ext.Element} this
+     */
+    addHandler : function(eventName, stopPropagation, handler, scope, override){
+        var fn = YAHOO.ext.Element.createStopHandler(stopPropagation, handler, scope || this, true);
+        YAHOO.util.Event.addListener(this.dom, eventName, fn);
+        return fn;
+    },
+    
+    /**
+     * Appends an event handler to this element (Same as addListener)
+     * @param {String}   eventName     The type of event to listen for
+     * @param {Function} handler        The method the event invokes
+     * @param {<i>Object</i>}   scope (optional)   An arbitrary object that will be 
+     *                             passed as a parameter to the handler
+     * @param {<i>boolean</i>}  override (optional) If true, the obj passed in becomes
+     *                             the execution scope of the listener
+     * @return {YAHOO.ext.Element} this
+     */
+    on : function(eventName, handler, scope, override){
+        YAHOO.util.Event.addListener(this.dom, eventName, handler, scope || this, true);
+        return this;
+    },
+    
+    /**
+     * Append a managed listener - See {@link YAHOO.ext.EventObject} for more details. Use mon() for a shorter version.
+     * @param {String}   eventName     The type of event to listen for
+     * @param {Function} fn        The method the event invokes
+     * @param {<i>Object</i>}   scope  (optional)  An arbitrary object that will be 
+     *                             passed as a parameter to the handler
+     * @param {<i>boolean</i>}  override (optional) If true, the obj passed in becomes
+     *                             the execution scope of the listener
+     * @return {Function} The EventManager wrapped function that can be used to remove the listener
+     */
+    addManagedListener : function(eventName, fn, scope, override){
+        return YAHOO.ext.EventManager.on(this.dom, eventName, fn, scope || this, true);
+    },
+    
+    /** 
+     * Append a managed listener (shorthanded for {@link #addManagedListener}) 
+     * @param {String}   eventName     The type of event to listen for
+     * @param {Function} fn        The method the event invokes
+     * @param {<i>Object</i>}   scope  (optional)  An arbitrary object that will be 
+     *                             passed as a parameter to the handler
+     * @param {<i>boolean</i>}  override (optional) If true, the obj passed in becomes
+     *                             the execution scope of the listener
+     * @return {Function} The EventManager wrapped function that can be used to remove the listener
+     */
+    mon : function(eventName, fn, scope, override){
+        return YAHOO.ext.EventManager.on(this.dom, eventName, fn, scope || this, true);
+    },
+    /**
+     * Removes an event handler from this element
+     * @param {String} sType the type of event to remove
+     * @param {Function} fn the method the event invokes
+     * @param {Object} scope
+     * @return {YAHOO.ext.Element} this
+     */
+    removeListener : function(eventName, handler, scope){
+        YAHOO.util.Event.removeListener(this.dom, eventName, handler);
+        return this;
+    },
+    
+    /**
+     * Removes all previous added listeners from this element
+     * @return {YAHOO.ext.Element} this
+     */
+    removeAllListeners : function(){
+        YAHOO.util.Event.purgeElement(this.dom);
+        return this;
+    },
+    
+    
+    /**
+     * Set the opacity of the element
+     * @param {Float} opacity The new opacity. 0 = transparent, .5 = 50% visibile, 1 = fully visible, etc
+     * @param {<i>Boolean</i>} animate (optional) Animate (fade) the transition (Default is false)
+     * @param {<i>Float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeOut if height is larger or YAHOO.util.Easing.easeIn if it is smaller)
+     * @return {YAHOO.ext.Element} this
+     */
+     setOpacity : function(opacity, animate, duration, onComplete, easing){
+        if(!animate || !YAHOO.util.Anim){
+            YAHOO.util.Dom.setStyle(this.dom, 'opacity', opacity);
+        }else{
+            this.anim({opacity: {to: opacity}}, duration, onComplete, easing);
+        }
+        return this;
+    },
+    
+    /**
+     * Gets the left X coordinate
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getLeft : function(local){
+        if(!local){
+            return this.getX();
+        }else{
+            return parseInt(this.getStyle('left'), 10) || 0;
+        }
+    },
+    
+    /**
+     * Gets the right X coordinate of the element (element X position + element width)
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getRight : function(local){
+        if(!local){
+            return this.getX() + this.getWidth();
+        }else{
+            return (this.getLeft(true) + this.getWidth()) || 0;
+        }
+    },
+    
+    /**
+     * Gets the top Y coordinate
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getTop : function(local) {
+        if(!local){
+            return this.getY();
+        }else{
+            return parseInt(this.getStyle('top'), 10) || 0;
+        }
+    },
+    
+    /**
+     * Gets the bottom Y coordinate of the element (element Y position + element height)
+     * @param {Boolean} local True to get the local css position instead of page coordinate
+     * @return {Number}
+     */
+    getBottom : function(local){
+        if(!local){
+            return this.getY() + this.getHeight();
+        }else{
+            return (this.getTop(true) + this.getHeight()) || 0;
+        }
+    },
+    
+    /**
+    * Set the element as absolute positioned with the specified z-index
+    * @param {<i>Number</i>} zIndex (optional)
+    * @return {YAHOO.ext.Element} this
+     */
+    setAbsolutePositioned : function(zIndex){
+        this.setStyle('position', 'absolute');
+        if(zIndex){
+            this.setStyle('z-index', zIndex);
+        }
+        return this;
+    },
+    
+    /**
+    * Set the element as relative positioned with the specified z-index
+    * @param {<i>Number</i>} zIndex (optional)
+    * @return {YAHOO.ext.Element} this
+     */
+    setRelativePositioned : function(zIndex){
+        this.setStyle('position', 'relative');
+        if(zIndex){
+            this.setStyle('z-index', zIndex);
+        }
+        return this;
+    },
+    
+    /**
+    * Clear positioning back to the default when the document was loaded
+    * @return {YAHOO.ext.Element} this
+     */
+    clearPositioning : function(){
+        this.setStyle('position', '');
+        this.setStyle('left', '');
+        this.setStyle('right', '');
+        this.setStyle('top', '');
+        this.setStyle('bottom', '');
+        return this;
+    },
+    
+    /**
+    * Gets an object with all CSS positioning properties. Useful along with setPostioning to get 
+    * snapshot before performing an update and then restoring the element.
+    * @return {Object} 
+    */
+    getPositioning : function(){
+        return {
+            'position' : this.getStyle('position'),
+            'left' : this.getStyle('left'),
+            'right' : this.getStyle('right'),
+            'top' : this.getStyle('top'),
+            'bottom' : this.getStyle('bottom')
+        };
+    },
+    
+    /**
+     * Gets the width of the border(s) for the specified side(s)
+     * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example, 
+     * passing lr would get the border (l)eft width + the border (r)ight width.
+     * @return {Number} The width of the sides passed added together
+     */
+    getBorderWidth : function(side){
+        return this.addStyles(side, YAHOO.ext.Element.borders);
+    },
+    
+    /**
+     * Gets the width of the padding(s) for the specified side(s)
+     * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example, 
+     * passing lr would get the padding (l)eft + the padding (r)ight.
+     * @return {Number} The padding of the sides passed added together
+     */
+    getPadding : function(side){
+        return this.addStyles(side, YAHOO.ext.Element.paddings);
+    },
+    
+    /**
+    * Set positioning with an object returned by getPositioning().
+    * @param {Object} posCfg
+    * @return {YAHOO.ext.Element} this
+     */
+    setPositioning : function(positionCfg){
+        if(positionCfg.position)this.setStyle('position', positionCfg.position);
+        if(positionCfg.left)this.setLeft(positionCfg.left);
+        if(positionCfg.right)this.setRight(positionCfg.right);
+        if(positionCfg.top)this.setTop(positionCfg.top);
+        if(positionCfg.bottom)this.setBottom(positionCfg.bottom);
+        return this;
+    },
+    
+    
+    /**
+     * Quick set left and top adding default units
+     * @return {YAHOO.ext.Element} this
+     */
+     setLeftTop : function(left, top){
+        this.dom.style.left = this.addUnits(left);
+        this.dom.style.top = this.addUnits(top);
+        return this;
+    },
+    
+    /**
+     * Move this element relative to it's current position.
+     * @param {String} direction Possible values are: 'l','left' - 'r','right' - 't','top','up' - 'b','bottom','down'.
+     * @param {Number} distance How far to move the element in pixels
+     * @param {<i>Boolean</i>} animate (optional) Animate the movement (Default is false)
+     * @param {<i>Float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. 
+     * @return {YAHOO.ext.Element} this
+     */
+     move : function(direction, distance, animate, duration, onComplete, easing){
+        var xy = this.getXY();
+        direction = direction.toLowerCase();
+        switch(direction){
+            case 'l':
+            case 'left':
+                this.moveTo(xy[0]-distance, xy[1], animate, duration, onComplete, easing);
+                break;
+           case 'r':
+           case 'right':
+                this.moveTo(xy[0]+distance, xy[1], animate, duration, onComplete, easing);
+                break;
+           case 't':
+           case 'top':
+           case 'up':
+                this.moveTo(xy[0], xy[1]-distance, animate, duration, onComplete, easing);
+                break;
+           case 'b':
+           case 'bottom':
+           case 'down':
+                this.moveTo(xy[0], xy[1]+distance, animate, duration, onComplete, easing);
+                break;
+        }
+        return this;
+    },
+    
+    /**
+     *  Store the current overflow setting and clip overflow on the element - use {@link #unclip} to remove
+     * @return {YAHOO.ext.Element} this
+     */
+    clip : function(){
+        if(!this.isClipped){
+           this.isClipped = true;
+           this.originalClip = {
+               'o': this.getStyle('overflow'), 
+               'x': this.getStyle('overflow-x'),
+               'y': this.getStyle('overflow-y')
+           };
+           this.setStyle('overflow', 'hidden');
+           this.setStyle('overflow-x', 'hidden');
+           this.setStyle('overflow-y', 'hidden');
+        }
+        return this;
+    },
+    
+    /**
+     *  Return clipping (overflow) to original clipping before clip() was called
+     * @return {YAHOO.ext.Element} this
+     */
+    unclip : function(){
+        if(this.isClipped){
+            this.isClipped = false;
+            var o = this.originalClip;
+            if(o.o){this.setStyle('overflow', o.o);}
+            if(o.x){this.setStyle('overflow-x', o.x);}
+            if(o.y){this.setStyle('overflow-y', o.y);}
+        }
+        return this;
+    },
+    
+    /**
+     * Align this element with another element.
+     * @param {String/HTMLElement/YAHOO.ext.Element} element The element to align to.
+     * @param {String} position The position to align to. Possible values are 'tl' - top left, 'tr' - top right, 'bl' - bottom left, and 'br' - bottom right. 
+     * @param {<i>Array</i>} offsets (optional) Offset the positioning by [x, y]
+     * @param {<i>Boolean</i>} animate (optional) Animate the movement (Default is false)
+     * @param {<i>Float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. 
+     * @return {YAHOO.ext.Element} this
+     */
+     alignTo : function(element, position, offsets, animate, duration, onComplete, easing){
+        var otherEl = getEl(element);
+        if(!otherEl){
+            return this; // must not exist
+        }
+        offsets = offsets || [0, 0];
+        var r = otherEl.getRegion();
+        position = position.toLowerCase();
+        switch(position){
+           case 'bl':
+                this.moveTo(r.left + offsets[0], r.bottom + offsets[1], 
+                            animate, duration, onComplete, easing);
+                break;
+           case 'br':
+                this.moveTo(r.right + offsets[0], r.bottom + offsets[1], 
+                            animate, duration, onComplete, easing);
+                break;
+           case 'tl':
+                this.moveTo(r.left + offsets[0], r.top + offsets[1], 
+                            animate, duration, onComplete, easing);
+                break;
+           case 'tr':
+                this.moveTo(r.right + offsets[0], r.top + offsets[1], 
+                            animate, duration, onComplete, easing);
+                break;
+        }
+        return this;
+    },
+    
+    /**
+    * Clears any opacity settings from this element. Required in some cases for IE.
+    * @return {YAHOO.ext.Element} this
+     */
+    clearOpacity : function(){
+        if (window.ActiveXObject) {
+            this.dom.style.filter = '';
+        } else {
+            this.dom.style.opacity = '';
+            this.dom.style['-moz-opacity'] = '';
+            this.dom.style['-khtml-opacity'] = '';
+        }
+        return this;
+    },
+    
+    /**
+    * Hide this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}.
+    * @param {<i>Boolean</i>} animate (optional) Animate (fade) the transition (Default is false)
+     * @param {<i>Float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+    * @return {YAHOO.ext.Element} this
+      */
+    hide : function(animate, duration, onComplete, easing){
+        this.setVisible(false, animate, duration, onComplete, easing);
+        return this;
+    },
+    
+    /**
+    * Show this element - Uses display mode to determine whether to use "display" or "visibility". See {@link #setVisible}.
+    * @param {<i>Boolean</i>} animate (optional) Animate (fade in) the transition (Default is false)
+     * @param {<i>Float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+     * @return {YAHOO.ext.Element} this
+     */
+    show : function(animate, duration, onComplete, easing){
+        this.setVisible(true, animate, duration, onComplete, easing);
+        return this;
+    },
+    
+    /**
+     * @private Test if size has a unit, otherwise appends the default 
+     */
+    addUnits : function(size){
+        if(size === '' || size == 'auto' || typeof size == 'undefined'){
+            return size;
+        }
+        if(typeof size == 'number' || !YAHOO.ext.Element.unitPattern.test(size)){
+            return size + this.defaultUnit;
+        }
+        return size;
+    },
+    
+    /**
+     * Temporarily enables offsets (width,height,x,y) for an element with display:none, use endMeasure() when done.
+     * @return {YAHOO.ext.Element} this
+     */
+    beginMeasure : function(){
+        var el = this.dom;
+        if(el.offsetWidth || el.offsetHeight){
+            return this; // offsets work already
+        }
+        var changed = [];
+        var p = this.dom; // start with this element
+        while((!el.offsetWidth && !el.offsetHeight) && p && p.tagName && p.tagName.toLowerCase() != 'body'){
+            if(YAHOO.util.Dom.getStyle(p, 'display') == 'none'){
+                changed.push({el: p, visibility: YAHOO.util.Dom.getStyle(p, 'visibility')});
+                p.style.visibility = 'hidden';
+                p.style.display = 'block';
+            }
+            p = p.parentNode;
+        }
+        this._measureChanged = changed;
+        return this;
+               
+    },
+    
+    /**
+     * Restores displays to before beginMeasure was called
+     * @return {YAHOO.ext.Element} this
+     */
+    endMeasure : function(){
+        var changed = this._measureChanged;
+        if(changed){
+            for(var i = 0, len = changed.length; i < len; i++) {
+            	var r = changed[i];
+            	r.el.style.visibility = r.visibility;
+                r.el.style.display = 'none';
+            }
+            this._measureChanged = null;
+        }
+        return this;
+    },
+    
+    /**
+    * Update the innerHTML of this element, optionally searching for and processing scripts
+    * @param {String} html The new HTML
+    * @param {<i>Boolean</i>} loadScripts (optional) true to look for and process scripts
+    * @param {Function} callback For async script loading you can be noticed when the update completes
+    * @return {YAHOO.ext.Element} this
+     */
+    update : function(html, loadScripts, callback){
+        if(typeof html == 'undefined'){
+            html = '';
+        }
+        if(loadScripts !== true){
+            this.dom.innerHTML = html;
+            if(typeof callback == 'function'){
+                callback();
+            }
+            return this;
+        }
+        var id = YAHOO.util.Dom.generateId();
+        var dom = this.dom;
+        
+        html += '<span id="' + id + '"></span>';
+        
+        YAHOO.util.Event.onAvailable(id, function(){
+            var hd = document.getElementsByTagName("head")[0];
+            var re = /(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/img; 
+            var srcRe = /\ssrc=([\'\"])(.*?)\1/i;
+            var match;
+            while(match = re.exec(html)){
+                var srcMatch = match[0].match(srcRe);
+                if(srcMatch && srcMatch[2]){
+                   var s = document.createElement("script");
+                   s.src = srcMatch[2];
+                   hd.appendChild(s);
+                }else if(match[1] && match[1].length > 0){
+                   eval(match[1]);
+                }                     
+            }
+            var el = document.getElementById(id);
+            if(el){el.parentNode.removeChild(el);}
+            if(typeof callback == 'function'){
+                callback();
+            }
+        });
+        dom.innerHTML = html.replace(/(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/img, '');
+        return this;
+    },
+    
+    /**
+     * Direct access to the UpdateManager update() method (takes the same parameters).
+     * @param {String/Function} url The url for this request or a function to call to get the url
+     * @param {<i>String/Object</i>} params (optional) The parameters to pass as either a url encoded string "param1=1&amp;param2=2" or an object {param1: 1, param2: 2}
+     * @param {<i>Function</i>} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
+     * @param {<i>Boolean</i>} discardUrl (optional) By default when you execute an update the defaultUrl is changed to the last used url. If true, it will not store the url.
+     * @return {YAHOO.ext.Element} this
+     */
+    load : function(){
+        var um = this.getUpdateManager();
+        um.update.apply(um, arguments);
+        return this;
+    },
+    
+    /**
+    * Gets this elements UpdateManager
+    * @return {YAHOO.ext.UpdateManager} The UpdateManager
+    */
+    getUpdateManager : function(){
+        if(!this.updateManager){
+            this.updateManager = new YAHOO.ext.UpdateManager(this);
+        }
+        return this.updateManager;
+    },
+    
+    /**
+     * Disables text selection for this element (normalized across browsers)
+     * @return {YAHOO.ext.Element} this
+     */
+    unselectable : function(){
+        this.dom.unselectable = 'on';
+        this.swallowEvent('selectstart', true);
+        this.applyStyles('-moz-user-select:none;-khtml-user-select:none;');
+        return this;
+    },
+    
+    /**
+    * Calculates the x, y to center this element on the screen
+    * @param {Boolean} offsetScroll True to offset the documents current scroll position
+    * @return {Array} The x, y values [x, y]
+    */
+    getCenterXY : function(offsetScroll){
+        var centerX = Math.round((YAHOO.util.Dom.getViewportWidth()-this.getWidth())/2);
+        var centerY = Math.round((YAHOO.util.Dom.getViewportHeight()-this.getHeight())/2);
+        if(!offsetScroll){
+            return [centerX, centerY];
+        }else{
+            var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft || 0;
+            var scrollY = document.documentElement.scrollTop || document.body.scrollTop || 0;
+            return[centerX + scrollX, centerY + scrollY];
+        }
+    },
+    
+    /**
+    * Centers the Element in either the viewport, or another Element.
+    * @param {String/HTMLElement/YAHOO.ext.Element} centerIn (optional) The element in which to center the element.
+    */
+    center : function(centerIn) {
+        if(!centerIn){
+            this.setXY(this.getCenterXY(true));
+        }else{
+            var box = YAHOO.ext.Element.get(centerIn).getBox();
+            this.setXY([box.x + (box.width / 2) - (this.getWidth() / 2),
+                   box.y + (box.height / 2) - (this.getHeight() / 2)]);
+        }
+        return this;
+    },
+
+    /**
+    * Gets an array of child YAHOO.ext.Element objects by tag name
+    * @param {String} tagName
+    * @return {Array} The children
+    */
+    getChildrenByTagName : function(tagName){
+        var children = this.dom.getElementsByTagName(tagName);
+        var len = children.length;
+        var ce = new Array(len);
+        for(var i = 0; i < len; ++i){
+            ce[i] = YAHOO.ext.Element.get(children[i], true);
+        }
+        return ce;
+    },
+    
+    /**
+    * Gets an array of child YAHOO.ext.Element objects by class name and optional tagName
+    * @param {String} className
+    * @param {<i>String</i>} tagName (optional)
+    * @return {Array} The children
+    */
+    getChildrenByClassName : function(className, tagName){
+        var children = YAHOO.util.Dom.getElementsByClassName(className, tagName, this.dom);
+        var len = children.length;
+        var ce = new Array(len);
+        for(var i = 0; i < len; ++i){
+            ce[i] = YAHOO.ext.Element.get(children[i], true);
+        }
+        return ce;
+    },
+    
+    /**
+     * Tests various css rules/browsers to determine if this element uses a border box
+     * @return {Boolean}
+     */
+    isBorderBox : function(){
+        if(typeof this.bbox == 'undefined'){
+            var el = this.dom;
+            var b = YAHOO.ext.util.Browser;
+            var strict = YAHOO.ext.Strict;
+            this.bbox = ((b.isIE && !strict && el.style.boxSizing != 'content-box') || 
+               (b.isGecko && YAHOO.util.Dom.getStyle(el, "-moz-box-sizing") == 'border-box') || 
+               (!b.isSafari && YAHOO.util.Dom.getStyle(el, "box-sizing") == 'border-box'));
+        }
+        return this.bbox; 
+    },
+    
+    /**
+     * Return a box {x, y, width, height} that can be used to set another elements
+     * size/location to match this element. 
+     * @param {Boolean} contentBox (optional) If true a box for the content of the element is returned. 
+     * @param {Boolean} local (optional) If true the element's left and top are returned instead of page x/y.
+     * @return {Object}
+     */
+    getBox : function(contentBox, local){
+        var xy;
+        if(!local){
+            xy = this.getXY();
+        }else{
+            var left = parseInt(YAHOO.util.Dom.getStyle('left'), 10) || 0;
+            var top = parseInt(YAHOO.util.Dom.getStyle('top'), 10) || 0;
+            xy = [left, top];
+        }
+        var el = this.dom;
+        var w = el.offsetWidth;
+        var h = el.offsetHeight;
+        if(!contentBox){
+            return {x: xy[0], y: xy[1], width: w, height: h};
+        }else{
+            var l = this.getBorderWidth('l')+this.getPadding('l');
+            var r = this.getBorderWidth('r')+this.getPadding('r');
+            var t = this.getBorderWidth('t')+this.getPadding('t');
+            var b = this.getBorderWidth('b')+this.getPadding('b');
+            return {x: xy[0]+l, y: xy[1]+t, width: w-(l+r), height: h-(t+b)};
+        }
+    },
+    
+    /**
+     * Sets the element's box. Use getBox() on another element to get a box obj. If animate is true then width, height, x and y will be animated concurrently.
+     * @param {Object} box The box to fill {x, y, width, height}
+     * @param {<i>Boolean</i>} adjust (optional) Whether to adjust for box-model issues automatically
+     * @param {<i>Boolean</i>} animate (optional) Animate the transition (Default is false)
+     * @param {<i>float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeBoth)
+     * @return {YAHOO.ext.Element} this
+     */
+    setBox : function(box, adjust, animate, duration, onComplete, easing){
+        var w = box.width, h = box.height;
+        if((adjust && !this.autoBoxAdjust) && !this.isBorderBox()){
+           w -= (this.getBorderWidth('lr') + this.getPadding('lr'));
+           h -= (this.getBorderWidth('tb') + this.getPadding('tb'));
+        }
+        this.setBounds(box.x, box.y, w, h, animate, duration, onComplete, easing);
+        return this;
+    },
+    
+    /**
+     * Forces the browser to repaint this element
+     * @return {YAHOO.ext.Element} this
+     */
+     repaint : function(){
+        var dom = this.dom;
+        YAHOO.util.Dom.addClass(dom, 'yui-ext-repaint');
+        setTimeout(function(){
+            YAHOO.util.Dom.removeClass(dom, 'yui-ext-repaint');
+        }, 1);
+        return this;
+    },
+    
+    /**
+     * Returns an object with properties top, left, right and bottom representing the margins of this element unless sides is passed, 
+     * then it returns the calculated width of the sides (see getPadding)
+     * @param {String} sides (optional) Any combination of l, r, t, b to get the sum of those sides
+     * @return {Object/Number}
+     */
+    getMargins : function(side){
+        if(!side){
+            return {
+                top: parseInt(this.getStyle('margin-top'), 10) || 0,
+                left: parseInt(this.getStyle('margin-left'), 10) || 0,
+                bottom: parseInt(this.getStyle('margin-bottom'), 10) || 0,
+                right: parseInt(this.getStyle('margin-right'), 10) || 0
+            };
+        }else{
+            return this.addStyles(side, YAHOO.ext.Element.margins);
+         }
+    },
+    
+    addStyles : function(sides, styles){
+        var val = 0;
+        for(var i = 0, len = sides.length; i < len; i++){
+             var w = parseInt(this.getStyle(styles[sides.charAt(i)]), 10);
+             if(!isNaN(w)) val += w;
+        }
+        return val;
+    },
+    
+    /**
+     * Creates a proxy element of this element
+     * @param {String/Object} config The class name of the proxy element or a DomHelper config object
+     * @param {<i>String/HTMLElement</i>} renderTo (optional) The element or element id to render the proxy to (defaults to document.body)
+     * @param {<i>Boolean</i>} matchBox (optional) True to align and size the proxy to this element now (defaults to false)
+     * @return {YAHOO.ext.Element} The new proxy element
+     */
+    createProxy : function(config, renderTo, matchBox){
+        if(renderTo){
+            renderTo = YAHOO.util.Dom.get(renderTo);
+        }else{
+            renderTo = document.body;
+        }
+        config = typeof config == 'object' ? 
+            config : {tag : 'div', cls: config};
+        var proxy = YAHOO.ext.DomHelper.append(renderTo, config, true);
+        if(matchBox){
+           proxy.setBox(this.getBox());
+        }
+        return proxy;
+    },
+    
+    /**
+     * Puts a mask over this element to disable user interaction. Requires core.css.
+     * This method can only be applied to elements which accept child nodes.
+     * @return {Element} The message element
+     */
+    mask : function(){
+        if(this.getStyle('position') == 'static'){
+            this.setStyle('position', 'relative');
+        }
+        if(!this._mask){
+            this._mask = YAHOO.ext.DomHelper.append(this.dom, {tag:'div', cls:'ext-el-mask'}, true);
+        }
+        this.addClass('ext-masked');
+        this._mask.setDisplayed(true);
+        return this._mask;
+    },
+    
+    /**
+     * Removes a previously applied mask. If removeEl is true the mask overlay is destroyed, otherwise
+     * it is cached for reuse.
+     */
+    unmask : function(removeEl){
+        if(this._mask){
+            removeEl === true ?
+               this._mask.remove() : this._mask.setDisplayed(false);
+        }
+        this.removeClass('ext-masked');
+    },
+    
+    /**
+     * Creates an iframe shim for this element to keep selects and other windowed objects from
+     * showing through.
+     * @return {YAHOO.ext.Element} The new shim element
+     */
+    createShim : function(){
+        var config = {
+            tag : 'iframe', 
+            frameBorder:'no', 
+            cls: 'yiframe-shim', 
+            style: 'position:absolute;visibility:hidden;left:0;top:0;overflow:hidden;', 
+            src: YAHOO.ext.SSL_SECURE_URL
+        };
+        var shim = YAHOO.ext.DomHelper.insertBefore(this.dom, config, true);
+        shim.setOpacity(.01);
+        shim.setBox(this.getBox());
+        return shim;
+    },
+    
+    /**
+     * Removes this element from the DOM and deletes it from the cache
+     */
+    remove : function(){
+        this.dom.parentNode.removeChild(this.dom);
+        delete YAHOO.ext.Element.cache[this.dom.id];
+    },
+    
+    /**
+     * Sets up event handlers to add and remove a css class when the mouse is over this element
+     * @param {String} className
+     * @return {YAHOO.ext.Element} this
+     */
+    addClassOnOver : function(className){
+        this.on('mouseover', function(){
+            this.addClass(className);
+        }, this, true);
+        this.on('mouseout', function(){
+            this.removeClass(className);
+        }, this, true);
+        return this;
+    },
+    
+    /**
+     * Stops the specified event from bubbling and optionally prevent's the default action
+     * @param {String} eventName
+     * @param {Boolean} preventDefault (optional) true to prevent the default action too
+     * @return {YAHOO.ext.Element} this
+     */
+    swallowEvent : function(eventName, preventDefault){
+        var fn = function(e){
+            e.stopPropagation();
+            if(preventDefault){
+                e.preventDefault();
+            }
+        };
+        this.mon(eventName, fn);
+        return this;
+    },
+    
+    /**
+     * Sizes this element to it's parent element's dimensions performing 
+     * neccessary box adjustments. 
+     * @param {Boolean} monitorResize (optional) If true maintains the fit when the browser window is resized.
+     * @param {String/HTMLElment/Element} targetParent (optional) The target parent, default to the parentNode.
+     * @return {YAHOO.ext.Element} this
+     */
+    fitToParent : function(monitorResize, targetParent){
+        var p = getEl(targetParent || this.dom.parentNode);
+        p.beginMeasure(); // in case parent is display:none
+        var box = p.getBox(true, true);
+        p.endMeasure();
+        this.setSize(box.width, box.height);
+        if(monitorResize === true){
+            YAHOO.ext.EventManager.onWindowResize(this.fitToParent, this, true);
+        }
+        return this;
+    },
+    
+    /**
+     * Gets the next sibling, skipping text nodes
+     * @return {HTMLElement} The next sibling or null
+	 */
+    getNextSibling : function(){
+        var n = this.dom.nextSibling;
+        while(n && n.nodeType != 1){
+            n = n.nextSibling;
+        }
+        return n;
+    },
+    
+    /**
+     * Gets the previous sibling, skipping text nodes
+     * @return {HTMLElement} The previous sibling or null
+	 */
+    getPrevSibling : function(){
+        var n = this.dom.previousSibling;
+        while(n && n.nodeType != 1){
+            n = n.previousSibling;
+        }
+        return n;
+    },
+    
+    
+    /**
+     * Appends the passed element(s) to this element
+     * @param {String/HTMLElement/Array/Element/CompositeElement} el
+     * @return {YAHOO.ext.Element} this
+     */
+    appendChild: function(el){
+        el = getEl(el);
+        el.appendTo(this);
+        return this;
+    },
+    
+    /**
+     * Creates the passed DomHelper config and appends it to this element or optionally inserts it before the passed child element.
+     * @param {Object} config DomHelper element config object
+     * @param {<i>HTMLElement</i>} insertBefore (optional) a child element of this element
+     * @return {YAHOO.ext.Element} The new child element
+     */
+    createChild: function(config, insertBefore){
+        var c;
+        if(insertBefore){
+            c = YAHOO.ext.DomHelper.insertBefore(insertBefore, config, true);
+        }else{
+            c = YAHOO.ext.DomHelper.append(this.dom, config, true);
+        }
+        return c;
+    },
+    
+    /**
+     * Appends this element to the passed element
+     * @param {String/HTMLElement/Element} el The new parent element
+     * @return {YAHOO.ext.Element} this
+     */
+    appendTo: function(el){
+        var node = getEl(el).dom;
+        node.appendChild(this.dom);
+        return this;
+    },
+    
+    /**
+     * Inserts this element before the passed element in the DOM
+     * @param {String/HTMLElement/Element} el The element to insert before
+     * @return {YAHOO.ext.Element} this
+     */
+    insertBefore: function(el){
+        var node = getEl(el).dom;
+        node.parentNode.insertBefore(this.dom, node);
+        return this;
+    },
+    
+    /**
+     * Inserts this element after the passed element in the DOM
+     * @param {String/HTMLElement/Element} el The element to insert after
+     * @return {YAHOO.ext.Element} this
+     */
+    insertAfter: function(el){
+        var node = getEl(el).dom;
+        node.parentNode.insertBefore(this.dom, node.nextSibling);
+        return this;
+    },
+    
+    /**
+     * Creates and wraps this element with another element
+     * @param {Object} config (optional) DomHelper element config object for the wrapper element or null for an empty div
+     * @return {Element} The newly created wrapper element
+     */
+    wrap: function(config){
+        if(!config){
+            config = {tag: 'div'};
+        }
+        var newEl = YAHOO.ext.DomHelper.insertBefore(this.dom, config, true);
+        newEl.dom.appendChild(this.dom);
+        return newEl;
+    },
+    
+    /**
+     * Replaces the passed element with this element
+     * @param {String/HTMLElement/Element} el The element to replace
+     * @return {YAHOO.ext.Element} this
+     */
+    replace: function(el){
+        el = getEl(el);
+        this.insertBefore(el);
+        el.remove();
+        return this;
+    },
+    
+    /**
+     * Inserts an html fragment into this element
+     * @param {String} where Where to insert the html in relation to the this element - beforeBegin, afterBegin, beforeEnd, afterEnd.
+     * @param {String} html The HTML fragment
+     * @return {HTMLElement} The inserted node (or nearest related if more than 1 inserted)
+     */
+    insertHtml : function(where, html){
+        return YAHOO.ext.DomHelper.insertHtml(where, this.dom, html);
+    },
+    
+    /**
+     * Sets the passed attributes as attributes of this element (a style attribute can be a string, object or function)
+     * @param {Object} o The object with the attributes
+     * @return {YAHOO.ext.Element} this
+     */
+    set : function(o){
+        var el = this.dom;
+        var useSet = el.setAttribute ? true : false;
+        for(var attr in o){
+            if(attr == 'style' || typeof o[attr] == 'function') continue;
+            if(attr=='cls'){
+                el.className = o['cls'];
+            }else{
+                if(useSet) el.setAttribute(attr, o[attr]);
+                else el[attr] = o[attr];
+            }
+        }
+        YAHOO.ext.DomHelper.applyStyles(el, o.style);
+        return this;
+    },
+    
+    /**
+     * Convenience method for constructing a KeyMap
+     * @param {Number/Array/Object/String} key Either a string with the keys to listen for, the numeric key code, array of key codes or an object with the following options: 
+     *                                  {key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope of the function
+     * @return {YAHOO.ext.KeyMap} The KeyMap created
+     */
+    addKeyListener : function(key, fn, scope){
+        var config;
+        if(typeof key != 'object' || key instanceof Array){
+            config = {
+                key: key,
+                fn: fn,
+                scope: scope 
+            };
+        }else{
+            config = {
+                key : key.key,
+                shift : key.shift,
+                ctrl : key.ctrl,
+                alt : key.alt,
+                fn: fn,
+                scope: scope
+            };
+        }
+        var map = new YAHOO.ext.KeyMap(this, config);
+        return map; 
+    },
+    
+    /**
+     * Creates a KeyMap for this element
+     * @param {Object} config The KeyMap config. See {@link YAHOO.ext.KeyMap} for more details
+     * @return {YAHOO.ext.KeyMap} The KeyMap created
+     */
+    addKeyMap : function(config){
+        return new YAHOO.ext.KeyMap(this, config);
+    },
+    
+    /**
+     * Returns true if this element is scrollable.
+     * @return {Boolean}
+     */
+     isScrollable : function(){
+        var dom = this.dom;
+        return dom.scrollHeight > dom.clientHeight || dom.scrollWidth > dom.clientWidth;
+    },
+    
+    /**
+     * Scrolls this element the specified scroll point. It does NOT do bounds checking so if you scroll to a weird value it will try to do it. For auto bounds checking, use scroll().
+     * @param {String} side Either 'left' for scrollLeft values or 'top' for scrollTop values.
+     * @param {Number} value The new scroll value
+     * @param {<i>Boolean</i>} animate (optional) Animate the scroll (Default is false)
+     * @param {<i>Float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. 
+     * @return {Element} this
+     */
+     
+    scrollTo : function(side, value, animate, duration, onComplete, easing){
+        var prop = side.toLowerCase() == 'left' ? 'scrollLeft' : 'scrollTop';
+        if(!animate || !YAHOO.util.Anim){
+            this.dom[prop] = value;
+        }else{
+            var to = prop == 'scrollLeft' ? [value, this.dom.scrollTop] : [this.dom.scrollLeft, value];
+            this.anim({scroll: {'to': to}}, duration, onComplete, easing || YAHOO.util.Easing.easeOut, YAHOO.util.Scroll);
+        }
+        return this;
+    },
+    
+    /**
+     * Scrolls this element the specified direction. Does bounds checking to make sure the scroll is 
+     * within this elements scrollable range.
+     * @param {String} direction Possible values are: 'l','left' - 'r','right' - 't','top','up' - 'b','bottom','down'.
+     * @param {Number} distance How far to scroll the element in pixels
+     * @param {<i>Boolean</i>} animate (optional) Animate the scroll (Default is false)
+     * @param {<i>Float</i>} duration (optional) How long the animation lasts. (Defaults to .35 seconds)
+     * @param {<i>Function</i>} onComplete (optional) Function to call when animation completes.
+     * @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. 
+     * @return {Boolean} Returns true if a scroll was triggered or false if the element 
+     * was scrolled as far as it could go.
+     */
+     scroll : function(direction, distance, animate, duration, onComplete, easing){
+         if(!this.isScrollable()){
+             return;
+         }
+         var el = this.dom;
+         var l = el.scrollLeft, t = el.scrollTop;
+         var w = el.scrollWidth, h = el.scrollHeight;
+         var cw = el.clientWidth, ch = el.clientHeight;
+         direction = direction.toLowerCase();
+         var scrolled = false;
+         switch(direction){
+             case 'l':
+             case 'left':
+                 if(w - l > cw){
+                     var v = Math.min(l + distance, w-cw);
+                     this.scrollTo('left', v, animate, duration, onComplete, easing);
+                     scrolled = true;
+                 }
+                 break;
+            case 'r':
+            case 'right':
+                 if(l > 0){
+                     var v = Math.max(l - distance, 0);
+                     this.scrollTo('left', v, animate, duration, onComplete, easing);
+                     scrolled = true;
+                 }
+                 break;
+            case 't':
+            case 'top':
+            case 'up':
+                 if(t > 0){
+                     var v = Math.max(t - distance, 0);
+                     this.scrollTo('top', v, animate, duration, onComplete, easing);
+                     scrolled = true;
+                 }
+                 break;
+            case 'b':
+            case 'bottom':
+            case 'down':
+                 if(h - t > ch){
+                     var v = Math.min(t + distance, h-ch);
+                     this.scrollTo('top', v, animate, duration, onComplete, easing);
+                     scrolled = true;
+                 }
+                 break;
+         }
+         return scrolled;
+    },
+    
+    /**
+     * Return the CSS color for the specified CSS attribute. rgb, 3 digit (like #fff) and valid values
+     * are convert to standard 6 digit hex color. 
+     * @param {String} attr The css attribute
+     * @param {String} defaultValue The default value to use when a valid color isn't found
+     * @param {String} prefix (optional) defaults to #. Use an empty string when working with 
+     * YUI color anims.
+     */
+    getColor : function(attr, defaultValue, prefix){
+        var v = this.getStyle(attr);
+        if(!v || v == 'transparent' || v == 'inherit') {
+            return defaultValue;
+        }
+        var color = typeof prefix == 'undefined' ? '#' : prefix;  
+        if(v.substr(0, 4) == 'rgb('){
+            var rvs = v.slice(4, v.length -1).split(',');
+            for(var i = 0; i < 3; i++){
+                var h = parseInt(rvs[i]).toString(16);
+                if(h < 16){
+                    h = '0' + h;   
+                }
+                color += h;
+            }
+        } else {  
+            if(v.substr(0, 1) == '#'){
+                if(v.length == 4) {
+                    for(var i = 1; i < 4; i++){
+                        var c = v.charAt(i);
+                        color +=  c + c;
+                    }
+                }else if(v.length == 7){
+                    color += v.slice(1, 6);
+                }
+            }
+        }
+        return(color.length > 5 ? color.toLowerCase() : defaultValue);  
+    },
+    
+    /**
+     * Highlights the Element by setting a color (defaults to background-color) and then 
+     * fading back to the original color. If no original color is available, you should 
+     * provide an "endColor" option which will be cleared after the animation. The available options 
+     * for the "options" parameter are listed below (with their default values): <br/>
+<pre><code>
+el.highlight('ff0000', {<br/>
+    attr: 'background-color',<br/>
+    endColor: (current color) or 'ffffff'<br/>
+    callback: yourFunction,<br/>
+    scope: yourObject,<br/>
+    easing: YAHOO.util.Easing.easeNone, <br/>
+    duration: .75<br/>
+});   
+</code></pre>
+     * @param {String} color (optional) The highlight color. Should be a 6 char hex color (no #). (defaults to ffff9c)
+     * @param {Object} options (optional) Object literal with any of the options listed above
+     */
+    highlight : function(color, options){
+        color = color || 'ffff9c';
+        options = options || {};
+        attr = options.attr || 'background-color';
+        var origColor = this.getColor(attr);
+        endColor = (options.endColor || origColor) || 'ffffff';
+        var dom = this.dom;
+        var cb = function(){
+            YAHOO.util.Dom.setStyle(dom, attr, origColor || '');
+            if(options.callback){
+                options.callback.call(options.scope || window);
+            }
+        };
+        var o = {};
+        o[attr] = {from: color, to: endColor};
+        this.anim(o, options.duration || .75, cb, options.easing || YAHOO.util.Easing.easeNone, YAHOO.util.ColorAnim);
+        return this;
+    }
+};
+
+/**
+ * true to automatically adjust width and height settings for box-model issues (default to true)
+ */
+YAHOO.ext.Element.prototype.autoBoxAdjust = true;
+/**
+ * true to automatically detect display mode and use display instead of visibility with show()/hide() (defaults to false).
+ * To enable this globally:<pre><code>YAHOO.ext.Element.prototype.autoDisplayMode = true;</code></pre>
+ */
+YAHOO.ext.Element.prototype.autoDisplayMode = true;
+
+YAHOO.ext.Element.unitPattern = /\d+(px|em|%|en|ex|pt|in|cm|mm|pc)$/i;
+/**
+ * Visibility mode constant - Use visibility to hide element
+ * @static
+ * @type Number
+ */
+YAHOO.ext.Element.VISIBILITY = 1;
+/**
+ * Visibility mode constant - Use display to hide element
+ * @static
+ * @type Number
+ */
+YAHOO.ext.Element.DISPLAY = 2;
+
+YAHOO.ext.Element.blockElements = /^(?:address|blockquote|center|dir|div|dl|fieldset|form|h\d|hr|isindex|menu|ol|ul|p|pre|table|dd|dt|li|tbody|tr|td|thead|tfoot|iframe)$/i;
+YAHOO.ext.Element.borders = {l: 'border-left-width', r: 'border-right-width', t: 'border-top-width', b: 'border-bottom-width'};
+YAHOO.ext.Element.paddings = {l: 'padding-left', r: 'padding-right', t: 'padding-top', b: 'padding-bottom'};
+YAHOO.ext.Element.margins = {l: 'margin-left', r: 'margin-right', t: 'margin-top', b: 'margin-bottom'};
+        
+/**
+ * @private Call out to here so we make minimal closure
+ */
+YAHOO.ext.Element.createStopHandler = function(stopPropagation, handler, scope, override){
+    return function(e){
+        if(e){
+            if(stopPropagation){
+                YAHOO.util.Event.stopEvent(e);
+            }else {
+                YAHOO.util.Event.preventDefault(e);
+            }
+        }
+        handler.call(override && scope ? scope : window, e, scope);
+    };
+};
+
+/**
+ * @private
+ */
+YAHOO.ext.Element.cache = {};
+
+/**
+ * Static method to retreive Element objects. Uses simple caching to consistently return the same object. 
+ * Automatically fixes if an object was recreated with the same id via AJAX or DOM.
+ * @param {String/HTMLElement/Element} el The id of the element or the element to wrap (must have an id). If you pass in an element, it is returned
+ * @return {Element} The element object
+ * @static
+ */
+YAHOO.ext.Element.get = function(){
+    var doc = document; // prevent IE dom lookup on every call to getEl
+    var docEl;
+    var E = YAHOO.ext.Element;
+    var D = YAHOO.util.Dom;
+    
+    return function(el){
+        if(!el){ return null; }
+        if(el instanceof E){
+            if(el != docEl){
+                el.dom = doc.getElementById(el.id); // refresh dom element in case no longer valid
+                E.cache[el.id] = el; // in case it was created directly with Element(), let's cache it
+            }
+            return el;
+        }else if(el.isComposite){
+            return el;
+        }else if(el instanceof Array){
+            return E.select(el);
+        }else if(el == doc){
+            // create a bogus element object representing the document object
+            if(!docEl){
+                var f = function(){};
+                f.prototype = E.prototype;
+                docEl = new f();
+                docEl.dom = doc;
+            }
+            return docEl;
+        }
+        var key = el;
+        if(typeof el != 'string'){ // must be an element
+            D.generateId(el, 'elgen-');
+            key = el.id;
+        }
+        var element = E.cache[key];
+        if(!element){
+            element = new E(key);
+            if(!element.dom) return null;
+            E.cache[key] = element;
+        }else{
+            element.dom = doc.getElementById(key);
+        }
+        return element;
+    };
+}();
+
+/*
+ * Gets the globally shared flyweight Element. Use sparingly for 
+ * bulk operations where a unique instance isn't needed.
+ * Do not store a reference to this element - the dom node
+ * can be overwritten by other code.
+ */
+YAHOO.ext.Element.fly = function(el){
+    var E = YAHOO.ext.Element;
+    if(typeof el == 'string'){
+        el = document.getElementById(el);
+    }
+    if(!E._flyweight){
+        var f = function(){};
+        f.prototype = E.prototype;
+        E._flyweight = new f();
+    }
+    E._flyweight.dom = el;
+    return E._flyweight;
+}
+
+/*
+ * Shorthand function for YAHOO.ext.Element.get()
+ */
+getEl = YAHOO.ext.Element.get;
+
+YAHOO.util.Event.addListener(window, 'unload', function(){ 
+    YAHOO.ext.Element.cache = null;
+});
+
diff --git a/frontend/beta/js/YUI-extensions/EventManager.js b/frontend/beta/js/YUI-extensions/EventManager.js
new file mode 100644
index 0000000..f9db759
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/EventManager.js
@@ -0,0 +1,456 @@
+
+/**
+ * @class YAHOO.ext.EventManager
+ * Registers event handlers that want to receive a normalized EventObject instead of the standard browser event and provides 
+ * several useful events directly.
+ * See {@link YAHOO.ext.EventObject} for more details on normalized event objects.
+ * @singleton
+ */
+YAHOO.ext.EventManager = new function(){
+    var docReadyEvent;
+    var docReadyProcId;
+    var docReadyState = false;
+    this.ieDeferSrc = false;
+    var resizeEvent;
+    var resizeTask;
+    
+    var fireDocReady = function(){
+        if(!docReadyState){
+            docReadyState = true;
+            if(docReadyProcId){
+                clearInterval(docReadyProcId);
+            }
+            if(docReadyEvent){
+                docReadyEvent.fire();
+            }
+        }
+    };
+    
+    var initDocReady = function(){
+        docReadyEvent = new YAHOO.util.CustomEvent('documentready');
+        if(document.addEventListener) {
+            YAHOO.util.Event.on(document, "DOMContentLoaded", fireDocReady);
+        }else if(YAHOO.ext.util.Browser.isIE){
+            // inspired by  http://www.thefutureoftheweb.com/blog/2006/6/adddomloadevent
+            document.write('<s'+'cript id="ie-deferred-loader" defer="defer" src="' +
+                        (YAHOO.ext.EventManager.ieDeferSrc || YAHOO.ext.SSL_SECURE_URL) + '"></s'+'cript>');
+            YAHOO.util.Event.on('ie-deferred-loader', 'readystatechange', function(){
+                if(this.readyState == 'complete'){
+                    fireDocReady();
+                }
+            });
+        }else if(YAHOO.ext.util.Browser.isSafari){ 
+            docReadyProcId = setInterval(function(){
+                var rs = document.readyState;
+                if(rs == 'loaded' || rs == 'complete') {
+                    fireDocReady();     
+                 }
+            }, 10);
+        }
+        // no matter what, make sure it fires on load
+        YAHOO.util.Event.on(window, 'load', fireDocReady);
+    };
+    /** 
+     * Places a simple wrapper around an event handler to override the browser event 
+     * object with a YAHOO.ext.EventObject
+     * @param {Function} fn        The method the event invokes
+     * @param {Object}   scope    An object that becomes the scope of the handler
+     * @param {boolean}  override If true, the obj passed in becomes
+     *                             the execution scope of the listener
+     * @return {Function} The wrapped function
+     */
+    this.wrap = function(fn, scope, override){
+        var wrappedFn = function(e){
+            YAHOO.ext.EventObject.setEvent(e);
+            fn.call(override ? scope || window : window, YAHOO.ext.EventObject, scope);
+        };
+        return wrappedFn;
+    };
+    
+    /**
+     * Appends an event handler
+     *
+     * @param {Object}   element        The html element to assign the 
+     *                             event to
+     * @param {String}   eventName     The type of event to append
+     * @param {Function} fn        The method the event invokes
+     * @param {Object}   scope    An object that becomes the scope of the handler
+     * @param {boolean}  override If true, the obj passed in becomes
+     *                             the execution scope of the listener
+     * @return {Function} The wrapper function created (to be used to remove the listener if necessary)
+     */
+    this.addListener = function(element, eventName, fn, scope, override){
+        var wrappedFn = this.wrap(fn, scope, override);
+        YAHOO.util.Event.addListener(element, eventName, wrappedFn);
+        return wrappedFn;
+    };
+    
+    /**
+     * Removes an event handler
+     *
+     * @param {Object}   element        The html element to remove the 
+     *                             event from
+     * @param {String}   eventName     The type of event to append
+     * @param {Function} wrappedFn        The wrapper method returned when adding the listener
+     * @return {Boolean} True if a listener was actually removed
+     */
+    this.removeListener = function(element, eventName, wrappedFn){
+        return YAHOO.util.Event.removeListener(element, eventName, wrappedFn);
+    };
+    
+    /**
+     * Appends an event handler (shorthand for addListener)
+     *
+     * @param {Object}   element        The html element to assign the 
+     *                             event to
+     * @param {String}   eventName     The type of event to append
+     * @param {Function} fn        The method the event invokes
+     * @param {Object}   scope    An arbitrary object that will be 
+     *                             passed as a parameter to the handler
+     * @param {boolean}  override If true, the obj passed in becomes
+     *                             the execution scope of the listener
+     * @return {Function} The wrapper function created (to be used to remove the listener if necessary)
+     * @method
+     */
+    this.on = this.addListener;
+    
+    /**
+     * Fires when the document is ready (before onload and before images are loaded). Can be 
+     * accessed shorthanded Ext.onReady().
+     * @param {Function} fn        The method the event invokes
+     * @param {Object}   scope    An  object that becomes the scope of the handler
+     * @param {boolean}  override If true, the obj passed in becomes
+     *                             the execution scope of the listener
+     */
+    this.onDocumentReady = function(fn, scope, override){
+        if(docReadyState){ // if it already fired
+            fn.call(override? scope || window : window, scope);
+            return;
+        }
+        if(!docReadyEvent){
+            initDocReady();
+        }
+        docReadyEvent.subscribe(fn, scope, override);
+    }
+    
+    /**
+     * Fires when the window is resized and provides resize event buffering (50 milliseconds), passes new viewport width and height to handlers.
+     * @param {Function} fn        The method the event invokes
+     * @param {Object}   scope    An object that becomes the scope of the handler
+     * @param {boolean}  override If true, the obj passed in becomes
+     *                             the execution scope of the listener
+     */
+    this.onWindowResize = function(fn, scope, override){
+        if(!resizeEvent){
+            resizeEvent = new YAHOO.util.CustomEvent('windowresize');
+            resizeTask = new YAHOO.ext.util.DelayedTask(function(){
+                resizeEvent.fireDirect(YAHOO.util.Dom.getViewportWidth(), YAHOO.util.Dom.getViewportHeight());
+            });
+            YAHOO.util.Event.on(window, 'resize', function(){
+                resizeTask.delay(50);
+            });
+        }
+        resizeEvent.subscribe(fn, scope, override);
+    };
+    
+    /**
+     * Removes the passed window resize listener.
+     * @param {Function} fn        The method the event invokes
+     * @param {Object}   scope    The scope of handler
+     */
+    this.removeResizeListener = function(fn, scope){
+        if(resizeEvent){
+            resizeEvent.unsubscribe(fn, scope);
+        }
+    };
+    
+    this.fireResize = function(){
+        if(resizeEvent){
+            resizeEvent.fireDirect(YAHOO.util.Dom.getViewportWidth(), YAHOO.util.Dom.getViewportHeight());
+        }   
+    };
+};
+
+YAHOO.ext.onReady = YAHOO.ext.EventManager.onDocumentReady;
+
+/**
+ * @class YAHOO.ext.EventObject
+ * EventObject exposes the Yahoo! UI Event functionality directly on the object
+ * passed to your event handler. It exists mostly for convenience. It also fixes the annoying null checks automatically to cleanup your code 
+ * (All the YAHOO.util.Event methods throw javascript errors if the passed event is null).
+ * To get an EventObject instead of the standard browser event,
+ * your must register your listener thru the {@link YAHOO.ext.EventManager} or directly on an Element
+ * with {@link YAHOO.ext.Element#addManagedListener} or the shorthanded equivalent {@link YAHOO.ext.Element#mon}.<br>
+ * Example:
+ * <pre><code>
+ fu<>nction handleClick(e){ // e is not a standard event object, it is a YAHOO.ext.EventObject
+    e.preventDefault();
+    var target = e.getTarget();
+    ...
+ }
+ var myDiv = getEl('myDiv');
+ myDiv.mon('click', handleClick);
+ //or
+ YAHOO.ext.EventManager.on('myDiv', 'click', handleClick);
+ YAHOO.ext.EventManager.addListener('myDiv', 'click', handleClick);
+ </code></pre>
+ * @singleton
+ */
+YAHOO.ext.EventObject = new function(){
+    /** The normal browser event */ 
+    this.browserEvent = null;
+    /** The button pressed in a mouse event */ 
+    this.button = -1;
+    /** True if the shift key was down during the event */ 
+    this.shiftKey = false;
+    /** True if the control key was down during the event */ 
+    this.ctrlKey = false;
+    /** True if the alt key was down during the event */ 
+    this.altKey = false;
+    
+    /** Key constant @type Number */
+    this.BACKSPACE = 8;
+    /** Key constant @type Number */
+    this.TAB = 9;
+    /** Key constant @type Number */
+    this.RETURN = 13;
+    /** Key constant @type Number */
+    this.ESC = 27;
+    /** Key constant @type Number */
+    this.SPACE = 32;
+    /** Key constant @type Number */
+    this.PAGEUP = 33;
+    /** Key constant @type Number */
+    this.PAGEDOWN = 34;
+    /** Key constant @type Number */
+    this.END = 35;
+    /** Key constant @type Number */
+    this.HOME = 36;
+    /** Key constant @type Number */
+    this.LEFT = 37;
+    /** Key constant @type Number */
+    this.UP = 38;
+    /** Key constant @type Number */
+    this.RIGHT = 39;
+    /** Key constant @type Number */
+    this.DOWN = 40;
+    /** Key constant @type Number */
+    this.DELETE = 46;
+    /** Key constant @type Number */
+    this.F5 = 116;
+
+       /** @private */ 
+    this.setEvent = function(e){
+        if(e == this){ // already wrapped
+            return this;
+        }
+        this.browserEvent = e;
+        if(e){
+            this.button = e.button;
+            this.shiftKey = e.shiftKey;
+            this.ctrlKey = e.ctrlKey;
+            this.altKey = e.altKey;
+        }else{
+            this.button = -1;
+            this.shiftKey = false;
+            this.ctrlKey = false;
+            this.altKey = false;
+        }
+        return this;
+    };
+    
+    /**
+     * Stop the event. Calls YAHOO.util.Event.stopEvent() if the event is not null.
+     */ 
+    this.stopEvent = function(){
+        if(this.browserEvent){
+            YAHOO.util.Event.stopEvent(this.browserEvent);
+        }
+    };
+    
+    /**
+     * Prevents the browsers default handling of the event. Calls YAHOO.util.Event.preventDefault() if the event is not null.
+     */ 
+    this.preventDefault = function(){
+        if(this.browserEvent){
+            YAHOO.util.Event.preventDefault(this.browserEvent);
+        }
+    };
+    
+    /** @private */
+    this.isNavKeyPress = function(){
+        return (this.browserEvent.keyCode && this.browserEvent.keyCode >= 33 && this.browserEvent.keyCode <= 40);
+    };
+    
+    /**
+     * Cancels bubbling of the event. Calls YAHOO.util.Event.stopPropagation() if the event is not null.
+     */ 
+    this.stopPropagation = function(){
+        if(this.browserEvent){
+            YAHOO.util.Event.stopPropagation(this.browserEvent);
+        }
+    };
+    
+    /**
+     * Gets the key code for the event. Returns value from YAHOO.util.Event.getCharCode() if the event is not null.
+     * @return {Number}
+     */ 
+    this.getCharCode = function(){
+        if(this.browserEvent){
+            return YAHOO.util.Event.getCharCode(this.browserEvent);
+        }
+        return null;
+    };
+    
+    /**
+     * Returns a browsers key for a keydown event
+     * @return {Number} The key code
+     */
+    this.getKey = function(){
+        if(this.browserEvent){
+            return this.browserEvent.keyCode || this.browserEvent.charCode;
+        }
+        return null;
+    };
+    
+    /**
+     * Gets the x coordinate of the event. Returns value from YAHOO.util.Event.getPageX() if the event is not null.
+     * @return {Number}
+     */ 
+    this.getPageX = function(){
+        if(this.browserEvent){
+            return YAHOO.util.Event.getPageX(this.browserEvent);
+        }
+        return null;
+    };
+    
+    /**
+     * Gets the y coordinate of the event. Returns value from YAHOO.util.Event.getPageY() if the event is not null.
+     * @return {Number}
+     */ 
+    this.getPageY = function(){
+        if(this.browserEvent){
+            return YAHOO.util.Event.getPageY(this.browserEvent);
+        }
+        return null;
+    };
+    
+    /**
+     * Gets the time of the event. Returns value from YAHOO.util.Event.getTime() if the event is not null.
+     * @return {Number}
+     */ 
+    this.getTime = function(){
+        if(this.browserEvent){
+            return YAHOO.util.Event.getTime(this.browserEvent);
+        }
+        return null;
+    };
+    
+    /**
+     * Gets the page coordinates of the event. Returns value from YAHOO.util.Event.getXY() if the event is not null.
+     * @return {Array} The xy values like [x, y]
+     */ 
+    this.getXY = function(){
+        if(this.browserEvent){
+            return YAHOO.util.Event.getXY(this.browserEvent);
+        }
+        return [];
+    };
+    
+    /**
+     * Gets the target for the event. Returns value from YAHOO.util.Event.getTarget() if the event is not null.
+     * @return {HTMLelement}
+     */ 
+    this.getTarget = function(){
+        if(this.browserEvent){
+            return YAHOO.util.Event.getTarget(this.browserEvent);
+        }
+        return null;
+    };
+    
+    /**
+     * Walk up the DOM looking for a particular target - if the default target matches, it is returned.
+     * @param {String} className The class name to look for or null
+     * @param {String} tagName (optional) The tag name to look for
+     * @return {HTMLelement}
+     */ 
+    this.findTarget = function(className, tagName){
+        if(tagName) tagName = tagName.toLowerCase();
+        if(this.browserEvent){
+            function isMatch(el){
+               if(!el){
+                   return false;
+               }
+               if(className && !YAHOO.util.Dom.hasClass(el, className)){
+                   return false;
+               }
+               if(tagName && el.tagName.toLowerCase() != tagName){
+                   return false;
+               }
+               return true;
+            };
+            
+            var t = this.getTarget();
+            if(!t || isMatch(t)){
+    		    return t;
+    	    }
+    	    var p = t.parentNode;
+    	    var b = document.body;
+    	    while(p && p != b){
+                if(isMatch(p)){
+                	return p;
+                }
+                p = p.parentNode;
+            }
+    	}
+        return null;
+    };
+    /**
+     * Gets the related target. Returns value from YAHOO.util.Event.getRelatedTarget() if the event is not null.
+     * @return {HTMLElement}
+     */ 
+    this.getRelatedTarget = function(){
+        if(this.browserEvent){
+            return YAHOO.util.Event.getRelatedTarget(this.browserEvent);
+        }
+        return null;
+    };
+    
+    /**
+     * Normalizes mouse wheel delta across browsers
+     * @return {Number} The delta 
+     */
+    this.getWheelDelta = function(){
+        var e = this.browserEvent;
+        var delta = 0;
+        if(e.wheelDelta){ /* IE/Opera. */
+            delta = e.wheelDelta/120;
+            /* In Opera 9, delta differs in sign as compared to IE. */
+            if(window.opera) delta = -delta;
+        }else if(e.detail){ /* Mozilla case. */
+            delta = -e.detail/3;
+        }
+        return delta;
+    };
+    
+    /**
+     * Returns true if the control, shift or alt key was pressed during this event.
+     * @return {Boolean}
+     */ 
+    this.hasModifier = function(){
+        return this.ctrlKey || this.altKey || this.shiftKey;
+    };
+    
+    /**
+     * Returns true if the target of this event equals el or is a child of el
+     * @param {String/HTMLElement/Element} el
+     * @return {Boolean}
+     */
+    this.within = function(el){
+        el = getEl(el);
+        var t = this.getTarget();
+        return t && el && (el.dom == t || YAHOO.util.Dom.isAncestor(el.dom, t));
+    }
+}();
+            
+    
diff --git a/frontend/beta/js/YUI-extensions/JSON.js b/frontend/beta/js/YUI-extensions/JSON.js
new file mode 100644
index 0000000..ffc9573
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/JSON.js
@@ -0,0 +1,132 @@
+/**
+ * @class YAHOO.ext.util.JSON
+ * Modified version of Douglas Crockford's json.js that doesn't
+ * mess with the Object prototype 
+ * http://www.json.org/js.html
+ * @singleton
+ */
+YAHOO.ext.util.JSON = new function(){
+    var useHasOwn = {}.hasOwnProperty ? true : false;
+    
+    // crashes Safari in some instances
+    //var validRE = /^("(\\.|[^"\\\n\r])*?"|[,:{}\[\]0-9.\-+Eaeflnr-u \n\r\t])+?$/;
+    
+    var pad = function(n) {
+        return n < 10 ? '0' + n : n;
+    };
+    
+    var m = {
+        '\b': '\\b',
+        '\t': '\\t',
+        '\n': '\\n',
+        '\f': '\\f',
+        '\r': '\\r',
+        '"' : '\\"',
+        '\\': '\\\\'
+    };
+
+    var encodeString = function(s){
+        if (/["\\\x00-\x1f]/.test(s)) {
+            return '"' + s.replace(/([\x00-\x1f\\"])/g, function(a, b) {
+                var c = m[b];
+                if(c){
+                    return c;
+                }
+                c = b.charCodeAt();
+                return '\\u00' +
+                    Math.floor(c / 16).toString(16) +
+                    (c % 16).toString(16);
+            }) + '"';
+        }
+        return '"' + s + '"';
+    };
+    
+    var encodeArray = function(o){
+        var a = ['['], b, i, l = o.length, v;
+            for (i = 0; i < l; i += 1) {
+                v = o[i];
+                switch (typeof v) {
+                    case 'undefined':
+                    case 'function':
+                    case 'unknown':
+                        break;
+                    default:
+                        if (b) {
+                            a.push(',');
+                        }
+                        a.push(v === null ? "null" : YAHOO.ext.util.JSON.encode(v));
+                        b = true;
+                }
+            }
+            a.push(']');
+            return a.join('');
+    };
+    
+    var encodeDate = function(o){
+        return '"' + o.getFullYear() + '-' +
+                pad(o.getMonth() + 1) + '-' +
+                pad(o.getDate()) + 'T' +
+                pad(o.getHours()) + ':' +
+                pad(o.getMinutes()) + ':' +
+                pad(o.getSeconds()) + '"';
+    };
+    
+    /**
+     * Encodes an Object, Array or other value
+     * @param {Mixed} o The variable to encode
+     * @return {String} The JSON string
+     */
+    this.encode = function(o){
+        if(typeof o == 'undefined' || o === null){
+            return 'null';
+        }else if(o instanceof Array){
+            return encodeArray(o);
+        }else if(o instanceof Date){
+            return encodeDate(o);
+        }else if(typeof o == 'string'){
+            return encodeString(o);
+        }else if(typeof o == 'number'){
+            return isFinite(o) ? String(o) : "null";
+        }else if(typeof o == 'boolean'){
+            return String(o);
+        }else {
+            var a = ['{'], b, i, v;
+            for (var i in o) {
+                if(!useHasOwn || o.hasOwnProperty(i)) {
+                    v = o[i];
+                    switch (typeof v) {
+                    case 'undefined':
+                    case 'function':
+                    case 'unknown':
+                        break;
+                    default:
+                        if(b){
+                            a.push(',');
+                        }
+                        a.push(this.encode(i), ':',
+                                v === null ? "null" : this.encode(v));
+                        b = true;
+                    }
+                }
+            }
+            a.push('}');
+            return a.join('');
+        }
+    };
+    
+    /**
+     * Decodes (parses) a JSON string to an object. If the JSON is invalid, this function throws a SyntaxError.
+     * @param {String} json The JSON string
+     * @return {Object} The resulting object
+     */
+    this.decode = function(json){
+        // although crockford had a good idea, this line crashes safari in some instances
+        //try{
+            //if(validRE.test(json)) {
+                return eval('(' + json + ')');
+           // }
+       // }catch(e){
+       // }
+       // throw new SyntaxError("parseJSON");
+    };
+}();
diff --git a/frontend/beta/js/YUI-extensions/KeyMap.js b/frontend/beta/js/YUI-extensions/KeyMap.js
new file mode 100644
index 0000000..c5af567
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/KeyMap.js
@@ -0,0 +1,135 @@
+/**
+ * @class YAHOO.ext.KeyMap
+ * Handles mapping keys to actions for an element. One key map can be used for multiple actions. 
+ * A KeyMap can also handle a string representation of keys.<br />
+ * Usage:
+ <pre><code>
+ // map one key by key code
+ var map = new YAHOO.ext.KeyMap('my-element', {
+     key: 13,
+     fn: myHandler,
+     scope: myObject
+ });
+ 
+ // map multiple keys to one action by string
+ var map = new YAHOO.ext.KeyMap('my-element', {
+     key: "a\r\n\t",
+     fn: myHandler,
+     scope: myObject
+ });
+ 
+ // map multiple keys to multiple actions by strings and array of codes
+ var map = new YAHOO.ext.KeyMap('my-element', [
+    {
+        key: [10,13],
+        fn: function(){ alert('Return was pressed'); }
+    }, {
+        key: "abc",
+        fn: function(){ alert('a, b or c was pressed'); }
+    }, {
+        key: "\t",
+        ctrl:true,
+        shift:true,
+        fn: function(){ alert('Control + shift + tab was pressed.'); }
+    }
+]);
+ </code></pre>
+* <b>Note: A KepMap starts enabled</b>
+* @constructor
+* @param {String/HTMLElement/YAHOO.ext.Element} el The element to bind to
+* @param {Object} config The config
+* @param {String} eventName (optional) The event to bind to (Defaults to "keydown").
+ */
+YAHOO.ext.KeyMap = function(el, config, eventName){
+    this.el  = getEl(el);
+    this.eventName = eventName || 'keydown';
+    this.bindings = [];
+    if(config instanceof Array){
+	    for(var i = 0, len = config.length; i < len; i++){
+	        this.addBinding(config[i]);
+	    }
+    }else{
+        this.addBinding(config);
+    }
+    this.keyDownDelegate = YAHOO.ext.EventManager.wrap(this.handleKeyDown, this, true);
+    this.enable();
+}
+
+YAHOO.ext.KeyMap.prototype = {
+    /**
+     * Add a new binding to this KeyMap
+     * @param {Object} config A single KeyMap config
+     */
+	addBinding : function(config){
+        var keyCode = config.key, 
+            shift = config.shift, 
+            ctrl = config.ctrl, 
+            alt = config.alt,
+            fn = config.fn,
+            scope = config.scope;
+        if(typeof keyCode == 'string'){
+            var ks = [];
+            var keyString = keyCode.toUpperCase();
+            for(var j = 0, len = keyString.length; j < len; j++){
+                ks.push(keyString.charCodeAt(j));
+            }
+            keyCode = ks;
+        }
+        var keyArray = keyCode instanceof Array;
+        var handler = function(e){
+            if((!shift || e.shiftKey) && (!ctrl || e.ctrlKey) &&  (!alt || e.altKey)){
+                var k = e.getKey();
+                if(keyArray){
+                    for(var i = 0, len = keyCode.length; i < len; i++){
+                        if(keyCode[i] == k){
+                          fn.call(scope || window, k, e);
+                          return;
+                        }
+                    }
+                }else{
+                    if(k == keyCode){
+                        fn.call(scope || window, k, e);
+                    }
+                }
+            }
+        };
+        this.bindings.push(handler);  
+	},
+	
+	handleKeyDown : function(e){
+	    if(this.enabled){ //just in case
+    	    var b = this.bindings;
+    	    for(var i = 0, len = b.length; i < len; i++){
+    	        b[i](e);
+    	    }
+	    }
+	},
+	
+	/**
+	 * Returns true if this KepMap is enabled
+	 * @return {Boolean} 
+	 */
+	isEnabled : function(){
+	    return this.enabled;  
+	},
+	
+	/**
+	 * Enable this KeyMap
+	 */
+	enable: function(){
+		if(!this.enabled){
+		    this.el.on(this.eventName, this.keyDownDelegate);
+		    this.enabled = true;
+		}
+	},
+
+	/**
+	 * Disable this KeyMap
+	 */
+	disable: function(){
+		if(this.enabled){
+		    this.el.removeListener(this.eventName, this.keyDownDelegate);
+		    this.enabled = false;
+		}
+	}
+};
diff --git a/frontend/beta/js/YUI-extensions/Layer.js b/frontend/beta/js/YUI-extensions/Layer.js
new file mode 100644
index 0000000..9eeaf7c
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/Layer.js
@@ -0,0 +1,246 @@
+/**
+ * @class YAHOO.ext.Layer
+ * @extends YAHOO.ext.Element
+ * An extended Element object that supports a shadow and shim, constrain to viewport and
+ * automatic maintaining of shadow/shim positions.
+ * @cfg {Boolean} shim False to disable the iframe shim in browsers which need one (defaults to true)
+ * @cfg {String/Boolean} shadow True to create a shadow element with default class "ylayer-shadow" or 
+ * you can pass a string with a css class name. False turns off the shadow.
+ * @cfg {Object} dh DomHelper object config to create element with (defaults to {tag: 'div', cls: 'ylayer'}).  
+ * @cfg {Boolean} constrain False to disable constrain to viewport (defaults to true)
+ * @cfg {String} cls CSS class to add to the element
+ * @cfg {Number} zindex Starting z-index (defaults to 11000!)
+ * @cfg {Number} shadowOffset Offset for the shadow (defaults to 3)
+ * @constructor
+ * @param {Object} config
+ * @param {String/HTMLElement} existingEl (optional) Uses an existing dom element. If the element is not found it creates it.
+ */
+YAHOO.ext.Layer = function(config, existingEl){
+    config = config || {};
+    var dh = YAHOO.ext.DomHelper;
+    if(existingEl){
+        this.dom = YAHOO.util.Dom.get(existingEl);
+    }
+    if(!this.dom){
+        var o = config.dh || {tag: 'div', cls: 'ylayer'};
+        this.dom = dh.insertBefore(document.body.firstChild, o);
+    }
+    if(config.cls){
+        this.addClass(config.cls);
+    }
+    this.constrain = config.constrain !== false;
+    this.visibilityMode = YAHOO.ext.Element.VISIBILITY;
+    this.id = YAHOO.util.Dom.generateId(this.dom);
+    var zindex = (config.zindex || parseInt(this.getStyle('z-index'), 10)) || 11000;
+    this.setAbsolutePositioned(zindex);
+    if(config.shadow){
+        var cls = (typeof config.shadow == 'string' ? config.shadow : 'ylayer-shadow');
+        this.shadow = dh.insertBefore(this.dom, 
+            {tag: 'div', cls: cls}, true);
+        this.shadowOffset = config.shadowOffset || 3;
+        this.shadow.setAbsolutePositioned(zindex-1);
+    }else{
+        this.shadowOffset = 0;
+    }
+    var b = YAHOO.ext.util.Browser;
+    if(config.shim !== false && (b.isIE || (b.isGecko && b.isMac))){
+        this.shim = this.createShim();
+        this.shim.setOpacity(0);
+        this.shim.setAbsolutePositioned(zindex-2);
+    }
+    this.hide();
+};
+YAHOO.extendX(YAHOO.ext.Layer, YAHOO.ext.Element, {
+    sync : function(doShow){
+        if(this.isVisible() && (this.shadow || this.shim)){
+            var b = this.getBox();
+            if(this.shim){
+                if(doShow){
+                   this.shim.show();
+                }
+                this.shim.setBox(b);
+            }
+            if(this.shadow){
+                if(doShow){
+                    this.shadow.show();
+                }
+                b.x += this.shadowOffset;
+                b.y += this.shadowOffset;
+                this.shadow.setBox(b);
+            }
+        }
+    },
+    
+    syncLocalXY : function(){
+        var l = this.getLeft(true);
+        var t = this.getTop(true);
+        if(this.shim){
+            this.shim.setLeftTop(l, t);
+        }
+        if(this.shadow){
+            this.shadow.setLeftTop(l + this.shadowOffset, 
+              t + this.shadowOffset);
+        }
+    },
+    
+    hideUnders : function(negOffset){
+        if(this.shadow){
+            this.shadow.hide();
+            if(negOffset){
+                this.shadow.setLeftTop(-10000,-10000);
+            }
+        }
+        if(this.shim){
+           this.shim.hide();
+           if(negOffset){
+               this.shim.setLeftTop(-10000,-10000);
+           }
+        }
+    },
+    
+    constrainXY : function(){
+        if(this.constrain){
+            var vw = YAHOO.util.Dom.getViewportWidth(),
+                vh = YAHOO.util.Dom.getViewportHeight();
+            var xy = this.getXY();
+            var x = xy[0], y = xy[1];   
+            var w = this.dom.offsetWidth+this.shadowOffset, h = this.dom.offsetHeight+this.shadowOffset;
+            // only move it if it needs it
+            var moved = false;
+            // first validate right/bottom
+            if(x + w > vw){
+                x = vw - w;
+                moved = true;
+            }
+            if(y + h > vh){
+                y = vh - h;
+                moved = true;
+            }
+            // then make sure top/left isn't negative
+            if(x < 0){
+                x = 0;
+                moved = true;
+            }
+            if(y < 0){
+                y = 0;
+                moved = true;
+            }
+            if(moved){
+                xy = [x, y];
+                this.lastXY = xy;
+                this.beforeAction();
+                YAHOO.ext.Layer.superclass.setXY.call(this, xy);
+                this.sync(true);
+            }
+        }
+    },
+    
+    setVisible : function(v, a, d, c, e){
+        if(this.lastXY){
+            YAHOO.ext.Layer.superclass.setXY.call(this, this.lastXY);
+        }
+        if(a && v){
+            var cb = function(){
+                this.sync(true);
+                if(c){
+                    c();
+                }
+            }.createDelegate(this);
+            YAHOO.ext.Layer.superclass.setVisible.call(this, true, true, d, cb, e);
+        }else{
+            if(!v){
+                this.hideUnders(true);
+            }
+            var cb = c;
+            if(a){
+                cb = function(){
+                    this.setLeftTop(-10000,-10000);
+                    if(c){
+                        c();
+                    }
+                }.createDelegate(this);
+            }
+            YAHOO.ext.Layer.superclass.setVisible.call(this, v, a, d, cb, e);
+            if(v){
+                this.sync(true);
+            }else if(!a){
+                this.setLeftTop(-10000,-10000);
+            }
+        }
+    },
+    
+    beforeAction : function(){
+        if(this.shadow){
+            this.shadow.hide();
+        }
+    },
+    
+    setXY : function(xy, a, d, c, e){
+        this.lastXY = xy;
+        this.beforeAction();
+        var cb = this.createCB(c);
+        YAHOO.ext.Layer.superclass.setXY.call(this, xy, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+    },
+    
+    createCB : function(c){
+        var el = this;
+        return function(){
+            el.constrainXY();
+            el.sync(true);
+            if(c){
+                c();
+            }
+        };
+    },
+    
+    setX : function(x, a, d, c, e){
+        this.setXY([x, this.getY()], a, d, c, e);
+    },
+    
+    setY : function(y, a, d, c, e){
+        this.setXY([this.getX(), y], a, d, c, e);
+    },
+    
+    setSize : function(w, h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        YAHOO.ext.Layer.superclass.setSize.call(this, w, h, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+    },
+    
+    setWidth : function(w, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        YAHOO.ext.Layer.superclass.setWidth.call(this, w, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+    },
+    
+    setHeight : function(h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        YAHOO.ext.Layer.superclass.setHeight.call(this, h, a, d, cb, e);
+        if(!a){
+            cb();
+        }
+    },
+    
+    setBounds : function(x, y, w, h, a, d, c, e){
+        this.beforeAction();
+        var cb = this.createCB(c);
+        if(!a){
+            YAHOO.ext.Layer.superclass.setXY.call(this, [x, y]);
+            YAHOO.ext.Layer.superclass.setSize.call(this, w, h, a, d, cb, e);
+            cb();
+        }else{
+            YAHOO.ext.Layer.superclass.setBounds.call(this, x, y, w, h, a, d, cb, e);
+        }
+        return this;
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/MixedCollection.js b/frontend/beta/js/YUI-extensions/MixedCollection.js
new file mode 100644
index 0000000..2e3d88a
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/MixedCollection.js
@@ -0,0 +1,344 @@
+/**
+ * @class YAHOO.ext.util.MixedCollection
+ * A Collection class that maintains both numeric indexes and keys and exposes events.<br>
+ * @constructor
+ * @param {Boolean} allowFunctions True if the addAll function should add function references
+ * to the collection.
+ */
+YAHOO.ext.util.MixedCollection = function(allowFunctions){
+    this.items = [];
+    this.keys = [];
+    this.events = {
+        /**
+         * @event clear
+         * Fires when the collection is cleared.
+         */
+        'clear' : new YAHOO.util.CustomEvent('clear'),
+        /**
+         * @event add
+         * Fires when an item is added to the collection.
+         * @param {Number} index The index at which the item was added.
+         * @param {Object} o The item added.
+         * @param {String} key The key associated with the added item.
+         */
+        'add' : new YAHOO.util.CustomEvent('add'),
+        /**
+         * @event replace
+         * Fires when an item is replaced in the collection.
+         * @param {String} key he key associated with the new added.
+         * @param {Object} old The item being replaced.
+         * @param {Object} new The new item.
+         */
+        'replace' : new YAHOO.util.CustomEvent('replace'),
+        /**
+         * @event remove
+         * Fires when an item is removed from the collection.
+         * @param {Object} o The item being removed.
+         * @param {String} key (optional) The key associated with the removed item.
+         */
+        'remove' : new YAHOO.util.CustomEvent('remove')
+    }
+    this.allowFunctions = allowFunctions === true;
+};
+
+YAHOO.extendX(YAHOO.ext.util.MixedCollection, YAHOO.ext.util.Observable, {
+    allowFunctions : false,
+   
+/**
+ * Adds an item to the collection.
+ * @param {String} key The key to associate with the item
+ * @param {Object} o The item to add.
+ * @return {Object} The item added.
+ */
+    add : function(key, o){
+        if(arguments.length == 1){
+            o = arguments[0];
+            key = this.getKey(o);
+        }
+        this.items.push(o);
+        if(typeof key != 'undefined' && key != null){
+            this.items[key] = o;
+            this.keys.push(key);
+        }
+        this.fireEvent('add', this.items.length-1, o, key);
+        return o;
+    },
+   
+/**
+  * MixedCollection has a generic way to fetch keys if you implement getKey.
+    <pre><code>
+    // normal way
+    var mc = new YAHOO.ext.util.MixedCollection();
+    mc.add(someEl.dom.id, someEl);
+    mc.add(otherEl.dom.id, otherEl);
+    //and so on
+    
+    // using getKey
+    var mc = new YAHOO.ext.util.MixedCollection();
+    mc.getKey = function(el){
+       return el.dom.id;
+    }
+    mc.add(someEl);
+    mc.add(otherEl);
+    // etc
+    </code>
+ * @param o {Object} The item for which to find the key.
+ * @return {Object} The key for the passed item.
+ */
+    getKey : function(o){
+         return null; 
+    },
+   
+/**
+ * Replaces an item in the collection.
+ * @param {String} key The key associated with the item to replace, or the item to replace.
+ * @param o {Object} o (optional) If the first parameter passed was a key, the item to associate with that key.
+ * @return {Object}  The new item.
+ */
+    replace : function(key, o){
+        if(arguments.length == 1){
+            o = arguments[0];
+            key = this.getKey(o);
+        }
+        if(typeof this.items[key] == 'undefined'){
+            return this.add(key, o);
+        }
+        var old = this.items[key];
+        if(typeof key == 'number'){ // array index key
+            this.items[key] = o;
+        }else{
+            var index = this.indexOfKey(key);
+            this.items[index] = o;
+            this.items[key] = o;
+        }
+        this.fireEvent('replace', key, old, o);
+        return o;
+    },
+   
+/**
+ * Adds all elements of an Array or an Object to the collection.
+ * @param {Object/Array} objs An Object containing properties which will be added to the collection, or
+ * an Array of values, each of which are added to the collection.
+ */
+    addAll : function(objs){
+        if(arguments.length > 1 || objs instanceof Array){
+            var args = arguments.length > 1 ? arguments : objs;
+            for(var i = 0, len = args.length; i < len; i++){
+                this.add(args[i]);
+            }
+        }else{
+            for(var key in objs){
+                if(this.allowFunctions || typeof objs[key] != 'function'){
+                    this.add(objs[key], key);
+                }
+            }
+        }
+    },
+   
+/**
+ * Executes the specified function once for every item in the collection, passing each
+ * item as the first and only parameter.
+ * @param {Function} fn The function to execute for each item.
+ * @param {Object} scope (optional) The scope in which to execute the function.
+ */
+    each : function(fn, scope){
+        for(var i = 0, len = this.items.length; i < len; i++){
+            fn.call(scope || window, this.items[i]);
+        }
+    },
+   
+/**
+ * Executes the specified function once for every key in the collection, passing each
+ * key, and its associated item as the first two parameters.
+ * @param {Function} fn The function to execute for each item.
+ * @param {Object} scope (optional) The scope in which to execute the function.
+ */
+    eachKey : function(fn, scope){
+        for(var i = 0, len = this.keys.length; i < len; i++){
+            fn.call(scope || window, this.keys[i], this.items[i]);
+        }
+    },
+   
+/**
+ * Returns the first item in the collection which elicits a true return value from the
+ * passed selection function.
+ * @param {Function} fn The selection function to execute for each item.
+ * @param {Object} scope (optional) The scope in which to execute the function.
+ * @return {Object} The first item in the collection which returned true from the selection function.
+ */
+    find : function(fn, scope){
+        for(var i = 0, len = this.items.length; i < len; i++){
+            if(fn.call(scope || window, this.items[i])){
+                return this.items[i];
+            }
+        }
+        return null;
+    },
+   
+/**
+ * Inserts an item at the specified index in the collection.
+ * @param {Number} index The index to insert the item at.
+ * @param {String} key The key to associate with the new item, or the item itself.
+ * @param {Object} o  (optional) If the second parameter was a key, the new item.
+ * @return {Object} The item inserted.
+ */
+    insert : function(index, key, o){
+        if(arguments.length == 2){
+            o = arguments[1];
+            key = this.getKey(o);
+        }
+        if(index >= this.items.length){
+            return this.add(o, key);
+        }
+        this.items.splice(index, 0, o);
+        if(typeof key != 'undefined' && key != null){
+            this.items[key] = o;
+            this.keys.splice(index, 0, key);
+        }
+        this.fireEvent('add', index, o, key);
+        return o;
+    },
+   
+/**
+ * Removed an item from the collection.
+ * @param {Object} o The item to remove.
+ * @return {Object} The item removed.
+ */
+    remove : function(o){
+        var index = this.indexOf(o);
+        this.items.splice(index, 1);
+        if(typeof this.keys[index] != 'undefined'){
+            var key = this.keys[index];
+            this.keys.splice(index, 1);
+            delete this.items[key];
+        }
+        this.fireEvent('remove', o);
+        return o;
+    },
+   
+/**
+ * Remove an item from a specified index in the collection.
+ * @param {Number} index The index within the collection of the item to remove.
+ */
+    removeAt : function(index){
+        this.items.splice(index, 1);
+        var key = this.keys[index];
+        if(typeof key != 'undefined'){
+             this.keys.splice(index, 1);
+             delete this.items[key];
+        }
+        this.fireEvent('remove', o, key);
+    },
+   
+/**
+ * Removed an item associated with the passed key fom the collection.
+ * @param {String} key The key of the item to remove.
+ */
+    removeKey : function(key){
+        var o = this.items[key];
+        var index = this.indexOf(o);
+        this.items.splice(index, 1);
+        this.keys.splice(index, 1);
+        delete this.items[key];
+        this.fireEvent('remove', o, key);
+    },
+   
+/**
+ * Returns the number of items in the collection.
+ * @return {Number} the number of items in the collection.
+ */
+    getCount : function(){
+        return this.items.length; 
+    },
+   
+/**
+ * Returns index within the collection of the passed Object.
+ * @param {Object} o The item to find the index of.
+ * @return {Number} index of the item.
+ */
+    indexOf : function(o){
+        if(!this.items.indexOf){
+            for(var i = 0, len = this.items.length; i < len; i++){
+                if(this.items[i] == o) return i;
+            }
+            return -1;
+        }else{
+            return this.items.indexOf(o);
+        }
+    },
+   
+/**
+ * Returns index within the collection of the passed key.
+ * @param {String} key The key to find the index of.
+ * @return {Number} index of the key.
+ */
+    indexOfKey : function(key){
+        if(!this.keys.indexOf){
+            for(var i = 0, len = this.keys.length; i < len; i++){
+                if(this.keys[i] == key) return i;
+            }
+            return -1;
+        }else{
+            return this.keys.indexOf(key);
+        }
+    },
+   
+/**
+ * Returns the item associated with the passed key.
+ * @param {String/Number} key The key or index of the item.
+ * @return {Object} The item associated with the passed key.
+ */
+    item : function(key){
+        return this.items[key];
+    },
+   
+/**
+ * Returns true if the collection contains the passed Object as an item.
+ * @param {Object} o  The Object to look for in the collection.
+ * @return {Boolean} True if the collection contains the Object as an item.
+ */
+    contains : function(o){
+        return this.indexOf(o) != -1;
+    },
+   
+/**
+ * Returns true if the collection contains the passed Object as a key.
+ * @param {String} key The key to look for in the collection.
+ * @return {Boolean} True if the collection contains the Object as a key.
+ */
+    containsKey : function(key){
+        return typeof this.items[key] != 'undefined';
+    },
+   
+/**
+ * Removes all items from the collection.
+ */
+    clear : function(o){
+        this.items = [];
+        this.keys = [];
+        this.fireEvent('clear');
+    },
+   
+/**
+ * Returns the first item in the collection.
+ * @return {Object} the first item in the collection..
+ */
+    first : function(){
+        return this.items[0]; 
+    },
+   
+/**
+ * Returns the last item in the collection.
+ * @return {Object} the last item in the collection..
+ */
+    last : function(){
+        return this.items[this.items.length];   
+    }
+});
+/**
+ * Returns the item associated with the passed key or index.
+ * @method
+ * @param {String/Number} key The key or index of the item.
+ * @return {Object} The item associated with the passed key.
+ */
+YAHOO.ext.util.MixedCollection.prototype.get = YAHOO.ext.util.MixedCollection.prototype.item;
diff --git a/frontend/beta/js/YUI-extensions/State.js b/frontend/beta/js/YUI-extensions/State.js
new file mode 100644
index 0000000..76a9618
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/State.js
@@ -0,0 +1,264 @@
+YAHOO.namespace('ext.state');
+/**
+ * @class YAHOO.ext.state.Provider
+ * Abstract base class for provider implementations. This class provides methods
+ * for encoding and decoding <b>typed</b> variables including dates and defines the 
+ * Provider interface.
+ */
+YAHOO.ext.state.Provider = function(){
+    YAHOO.ext.state.Provider.superclass.constructor.call(this);
+    /**
+     * @event statechange
+     * Fires when a state change occurs.
+     * @param {Provider} this
+     * @param {String} key The state key which was changed
+     * @param {String} value The encoded value for the state
+     */
+    this.events = {
+        'statechange': new YAHOO.util.CustomEvent('statechange')  
+    };
+    this.state = {};
+};
+YAHOO.extendX(YAHOO.ext.state.Provider, YAHOO.ext.util.Observable, {
+    /**
+     * Get the current value for a key.
+     * @param {String} name
+     * @param {Mixed} defaultValue
+     * @return {Mixed}
+     */
+    get : function(name, defaultValue){
+        return typeof this.state[name] == 'undefined' ?
+            defaultValue : this.state[name];
+    },
+    
+    /**
+     * Clear a value from the state.
+     */
+    clear : function(name){
+        delete this.state[name];
+        this.fireEvent('statechange', this, name, null);
+    },
+    
+    /**
+     * Set the value for a key.
+     * @param {String} name
+     * @param {Mixed} value
+     */
+    set : function(name, value){
+        this.state[name] = value;
+        this.fireEvent('statechange', this, name, value);
+    },
+    
+    /**
+     * Decodes a string previously encoded with {@link #encodeValue}.
+     * @param {String} value
+     * @return {Mixed} The value
+     */
+    decodeValue : function(cookie){
+        var re = /^(a|n|d|b|s|o)\:(.*)$/;
+        var matches = re.exec(unescape(cookie));
+        if(!matches || !matches[1]) return; // non state cookie
+        var type = matches[1];
+        var v = matches[2];
+        switch(type){
+            case 'n':
+                return parseFloat(v);
+            case 'd':
+                return new Date(Date.parse(v));
+            case 'b':
+                return (v == '1');
+            case 'a':
+                var all = [];
+                var values = v.split('^');
+                for(var i = 0, len = values.length; i < len; i++){
+                    all.push(this.decodeValue(values[i]))
+                }
+                return all;
+           case 'o':
+                var all = {};
+                var values = v.split('^');
+                for(var i = 0, len = values.length; i < len; i++){
+                    var kv = values[i].split('=');
+                    all[kv[0]] = this.decodeValue(kv[1]);
+                }
+                return all;
+           default:
+                return v;
+        }
+    },
+    
+    /**
+     * Encode a value including type information.
+     * @param {Mixed} value
+     * @return {String}
+     */
+    encodeValue : function(v){
+        var enc;
+        if(typeof v == 'number'){
+            enc = 'n:' + v;
+        }else if(typeof v == 'boolean'){
+            enc = 'b:' + (v ? '1' : '0');
+        }else if(v instanceof Date){
+            enc = 'd:' + v.toGMTString();
+        }else if(v instanceof Array){
+            var flat = '';
+            for(var i = 0, len = v.length; i < len; i++){
+                flat += this.encodeValue(v[i]);
+                if(i != len-1) flat += '^';
+            }
+            enc = 'a:' + flat;
+        }else if(typeof v == 'object'){
+            var flat = '';
+            for(var key in v){
+                if(typeof v[key] != 'function'){
+                    flat += key + '=' + this.encodeValue(v[key]) + '^';
+                }
+            }
+            enc = 'o:' + flat.substring(0, flat.length-1);
+        }else{
+            enc = 's:' + v;
+        }
+        return escape(enc);        
+    }
+});
+
+/**
+ * @class YAHOO.ext.state.Manager
+ * This is the global state manager. By default all components that are "state aware" check this class
+ * for state information if you don't pass them a custom state provider. In order for this class
+ * to be useful, it must be initialized with a provider when your application initializes.
+ <pre><code>
+// in your initialization function
+init : function(){
+   YAHOO.ext.state.Manager.setProvider(new YAHOO.ext.state.CookieProvider());
+   ...
+   // supposed you have a {@link YAHOO.ext.BorderLayout}
+   var layout = new YAHOO.ext.BorderLayout(...);
+   layout.restoreState();
+   // or a {YAHOO.ext.BasicDialog}
+   var dialog = new YAHOO.ext.BasicDialog(...);
+   dialog.restoreState();
+ </code></pre>
+ * @singleton
+ */
+YAHOO.ext.state.Manager = new function(){
+    var provider = new YAHOO.ext.state.Provider();
+    
+    return {
+        /**
+         * Configures the default provider for your application.
+         * @param {Provider} stateProvider
+         */
+        setProvider : function(stateProvider){
+            provider = stateProvider;
+        },
+        
+        /**
+         * Get the current value for a key.
+         * @param {String} name
+         * @param {Mixed} defaultValue
+         * @return {Mixed}
+         */
+        get : function(key, defaultValue){
+            return provider.get(key, defaultValue);
+        },
+        
+        /**
+         * Set the value for a key.
+         * @param {String} name
+         * @param {Mixed} value
+         */
+         set : function(key, value){
+            provider.set(key, value);
+        },
+        
+        /**
+         * Clear a value from the state.
+         */
+        clear : function(key){
+            provider.clear(key);
+        },
+        
+        /**
+         * Gets the currently configured provider.
+         * @return {Provider}
+         */
+        getProvider : function(){
+            return provider;
+        }
+    };
+}();
+
+/**
+ * @class YAHOO.ext.state.CookieProvider
+ * @extends YAHOO.ext.state.Provider
+ * The default Provider implementation. The example below includes all valid configuration options and their
+ * default values.
+ <pre><code>
+   var cp = new YAHOO.ext.state.CookieProvider({
+       path: '/',
+       expires: new Date(new Date().getTime()+(1000*60*60*24*7)); //7 days
+       domain: null,
+       secure: false       
+   })
+   YAHOO.ext.state.Manager.setProvider(cp);
+ </code></pre>
+ * @constructor
+ * Create a new CookieProvider
+ * @param {Object} config The configuration object
+ */
+YAHOO.ext.state.CookieProvider = function(config){
+    YAHOO.ext.state.CookieProvider.superclass.constructor.call(this);
+    this.path = '/';
+    this.expires = new Date(new Date().getTime()+(1000*60*60*24*7)); //7 days
+    this.domain = null;
+    this.secure = false;
+    YAHOO.ext.util.Config.apply(this, config);
+    this.state = this.readCookies();
+};
+
+YAHOO.extendX(YAHOO.ext.state.CookieProvider, YAHOO.ext.state.Provider, {
+    set : function(name, value){
+        if(typeof value == 'undefined' || value === null){
+            this.clear(name);
+            return;
+        }
+        this.setCookie(name, value);
+        YAHOO.ext.state.CookieProvider.superclass.set.call(this, name, value);
+    },
+        
+    clear : function(name){
+        this.clearCookie(name);
+        YAHOO.ext.state.CookieProvider.superclass.clear.call(this, name);
+    },
+        
+    readCookies : function(){
+        var cookies = {};
+        var c = document.cookie + ';';
+        var re = /\s?(.*?)=(.*?);/g;
+    	var matches;
+    	while((matches = re.exec(c)) != null){
+            var name = matches[1];
+            var value = matches[2];
+            if(name && name.substring(0,3) == 'ys-'){
+                cookies[name.substr(3)] = this.decodeValue(value);
+            }
+        }
+        return cookies;
+    },
+    
+    setCookie : function(name, value){
+        document.cookie = "ys-"+ name + "=" + this.encodeValue(value) +
+           ((this.expires == null) ? "" : ("; expires=" + this.expires.toGMTString())) +
+           ((this.path == null) ? "" : ("; path=" + this.path)) +
+           ((this.domain == null) ? "" : ("; domain=" + this.domain)) +
+           ((this.secure == true) ? "; secure" : "");
+    },
+    
+    clearCookie : function(name){
+        document.cookie = "ys-" + name + "=null; expires=Thu, 01-Jan-70 00:00:01 GMT" +
+           ((this.path == null) ? "" : ("; path=" + this.path)) +
+           ((this.domain == null) ? "" : ("; domain=" + this.domain)) +
+           ((this.secure == true) ? "; secure" : "");
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/UpdateManager.js b/frontend/beta/js/YUI-extensions/UpdateManager.js
new file mode 100644
index 0000000..c2eb23f
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/UpdateManager.js
@@ -0,0 +1,484 @@
+/**
+ * @class YAHOO.ext.UpdateManager
+ * @extends YAHOO.ext.util.Observable
+ * Provides AJAX-style update for Element object using Yahoo 
+ * UI library YAHOO.util.Connect functionality.<br><br>
+ * Usage:<br>
+ * <pre><code>
+ * // Get it from a YAHOO.ext.Element object
+ * var el = getEl('foo');
+ * var mgr = el.getUpdateManager();
+ * mgr.update('http://myserver.com/index.php', 'param1=1&amp;param2=2');
+ * ...
+ * mgr.formUpdate('myFormId', 'http://myserver.com/index.php');
+ * <br>
+ * // or directly (returns the same UpdateManager instance)
+ * var mgr = new YAHOO.ext.UpdateManager('myElementId');
+ * mgr.startAutoRefresh(60, 'http://myserver.com/index.php');
+ * mgr.on('update', myFcnNeedsToKnow);
+ * <br>
+ * </code></pre>
+ * @requires YAHOO.ext.Element
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @requires YAHOO.util.CustomEvent 
+ * @requires YAHOO.util.Connect
+ * @constructor
+ * Create new UpdateManager directly.
+ * @param {String/HTMLElement/YAHOO.ext.Element} el The element to update 
+ * @param {<i>Boolean</i>} forceNew (optional) By default the constructor checks to see if the passed element already has an UpdateManager and if it does it returns the same instance. This will skip that check (useful for extending this class).
+ */
+YAHOO.ext.UpdateManager = function(el, forceNew){
+    el = YAHOO.ext.Element.get(el);
+    if(!forceNew && el.updateManager){
+        return el.updateManager;
+    }
+    /**
+     * The Element object
+     * @type YAHOO.ext.Element
+     */
+    this.el = el;
+    /**
+     * Cached url to use for refreshes. Overwritten every time update() is called unless 'discardUrl' param is set to true.
+     * @type String
+     */
+    this.defaultUrl = null;
+    this.beforeUpdate = new YAHOO.util.CustomEvent('UpdateManager.beforeUpdate');
+    this.onUpdate = new YAHOO.util.CustomEvent('UpdateManager.onUpdate');
+    this.onFailure = new YAHOO.util.CustomEvent('UpdateManager.onFailure');
+    
+    this.events = {
+        /**
+         * @event beforeupdate
+         * Fired before an update is made, return false from your handler and the update is cancelled. 
+         * @param {YAHOO.ext.Element} el
+         * @param {String/Object/Function} url
+         * @param {String/Object} params
+         */
+        'beforeupdate': this.beforeUpdate,
+        /**
+         * @event update
+         * Fired after successful update is made. 
+         * @param {YAHOO.ext.Element} el
+         * @param {Object} oResponseObject The YAHOO.util.Connect response Object
+         */
+        'update': this.onUpdate,
+        /**
+         * @event failure
+         * Fired on update failure. Uses fireDirect with signature: (oElement, oResponseObject)
+         * @param {YAHOO.ext.Element} el
+         * @param {Object} oResponseObject The YAHOO.util.Connect response Object
+         */
+        'failure': this.onFailure 
+    };
+    
+    /**
+     * Blank page URL to use with SSL file uploads (Defaults to YAHOO.ext.UpdateManager.defaults.sslBlankUrl or 'about:blank'). 
+     * @type String
+     */
+    this.sslBlankUrl = YAHOO.ext.UpdateManager.defaults.sslBlankUrl;
+    /**
+     * Whether to append unique parameter on get request to disable caching (Defaults to YAHOO.ext.UpdateManager.defaults.disableCaching or false). 
+     * @type Boolean
+     */
+    this.disableCaching = YAHOO.ext.UpdateManager.defaults.disableCaching;
+    /**
+     * Text for loading indicator (Defaults to YAHOO.ext.UpdateManager.defaults.indicatorText or '&lt;div class="loading-indicator"&gt;Loading...&lt;/div&gt;'). 
+     * @type String
+     */
+    this.indicatorText = YAHOO.ext.UpdateManager.defaults.indicatorText;
+    /**
+     * Whether to show indicatorText when loading (Defaults to YAHOO.ext.UpdateManager.defaults.showLoadIndicator or true). 
+     * @type String
+     */
+    this.showLoadIndicator = YAHOO.ext.UpdateManager.defaults.showLoadIndicator;
+    /**
+     * Timeout for requests or form posts in seconds (Defaults to YAHOO.ext.UpdateManager.defaults.timeout or 30 seconds). 
+     * @type Number
+     */
+    this.timeout = YAHOO.ext.UpdateManager.defaults.timeout;
+    
+    /**
+     * True to process scripts in the output (Defaults to YAHOO.ext.UpdateManager.defaults.loadScripts (false)). 
+     * @type Boolean
+     */
+    this.loadScripts = YAHOO.ext.UpdateManager.defaults.loadScripts;
+    
+    /**
+     * YAHOO.util.Connect transaction object of current executing transaction
+     */
+    this.transaction = null;
+    
+    /**
+     * @private
+     */
+    this.autoRefreshProcId = null;
+    /**
+     * Delegate for refresh() prebound to 'this', use myUpdater.refreshDelegate.createCallback(arg1, arg2) to bind arguments
+     * @type Function
+     */
+    this.refreshDelegate = this.refresh.createDelegate(this);
+    /**
+     * Delegate for update() prebound to 'this', use myUpdater.updateDelegate.createCallback(arg1, arg2) to bind arguments
+     * @type Function
+     */
+    this.updateDelegate = this.update.createDelegate(this);
+    /**
+     * Delegate for formUpdate() prebound to 'this', use myUpdater.formUpdateDelegate.createCallback(arg1, arg2) to bind arguments
+     * @type Function
+     */
+    this.formUpdateDelegate = this.formUpdate.createDelegate(this);
+    /**
+     * @private
+     */
+    this.successDelegate = this.processSuccess.createDelegate(this);
+    /**
+     * @private
+     */
+     this.failureDelegate = this.processFailure.createDelegate(this);
+     
+     /**
+      * The renderer for this UpdateManager. Defaults to {@link YAHOO.ext.UpdateManager.BasicRenderer}. 
+      */
+      this.renderer = new YAHOO.ext.UpdateManager.BasicRenderer();
+};
+
+YAHOO.ext.UpdateManager.prototype = {
+    fireEvent : YAHOO.ext.util.Observable.prototype.fireEvent,
+    on : YAHOO.ext.util.Observable.prototype.on,
+    addListener : YAHOO.ext.util.Observable.prototype.addListener,
+    delayedListener : YAHOO.ext.util.Observable.prototype.delayedListener,
+    removeListener : YAHOO.ext.util.Observable.prototype.removeListener,
+    purgeListeners : YAHOO.ext.util.Observable.prototype.purgeListeners,
+    bufferedListener : YAHOO.ext.util.Observable.prototype.bufferedListener,
+    /**
+     * Get the Element this UpdateManager is bound to
+     * @return {YAHOO.ext.Element} The element
+     */
+    getEl : function(){
+        return this.el;
+    },
+    
+    /**
+     * Performs an async request, updating this element with the response. If params are specified it uses POST, otherwise it uses GET.
+     * @param {Object/String/Function} url The url for this request or a function to call to get the url or a config object containing any of the following options:
+<pre><code>
+um.update({<br/>
+    url: 'your-url.php',<br/>
+    params: {param1: 'foo', param2: 'bar'}, // or a URL encoded string<br/>
+    callback: yourFunction,<br/>
+    scope: yourObject, //(optional scope)  <br/>
+    discardUrl: false, <br/>
+    nocache: false,<br/>
+    text: 'Loading...',<br/>
+    timeout: 30,<br/>
+    scripts: false<br/>
+});   
+</code></pre>
+     * The only required property is url. The optional properties nocache, text and scripts 
+     * are shorthand for disableCaching, indicatorText and loadScripts and are used to set their associated property on this UpdateManager instance.
+     * @param {<i>String/Object</i>} params (optional) The parameters to pass as either a url encoded string "param1=1&amp;param2=2" or an object {param1: 1, param2: 2}
+     * @param {<i>Function</i>} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess, oResponse)
+     * @param {<i>Boolean</i>} discardUrl (optional) By default when you execute an update the defaultUrl is changed to the last used url. If true, it will not store the url.
+     */
+    update : function(url, params, callback, discardUrl){
+        if(this.beforeUpdate.fireDirect(this.el, url, params) !== false){
+            if(typeof url == 'object'){ // must be config object
+                var cfg = url;
+                url = cfg.url;
+                params = params || cfg.params;
+                callback = callback || cfg.callback;
+                discardUrl = discardUrl || cfg.discardUrl;
+                if(callback && cfg.scope){
+                    callback = callback.createDelegate(cfg.scope);
+                }
+                if(typeof cfg.nocache != 'undefined'){this.disableCaching = cfg.nocache};
+                if(typeof cfg.text != 'undefined'){this.indicatorText = '<div class="loading-indicator">'+cfg.text+'</div>'};
+                if(typeof cfg.scripts != 'undefined'){this.loadScripts = cfg.scripts};
+                if(typeof cfg.timeout != 'undefined'){this.timeout = cfg.timeout};
+            }
+            this.showLoading();
+            if(!discardUrl){
+                this.defaultUrl = url;
+            }
+            if(typeof url == 'function'){
+                url = url();
+            }
+            if(typeof params == 'function'){
+                params = params();
+            }
+            if(params && typeof params != 'string'){ // must be object
+                var buf = [];
+                for(var key in params){
+                    if(typeof params[key] != 'function'){
+                        buf.push(encodeURIComponent(key), '=', encodeURIComponent(params[key]), '&');
+                    }
+                }
+                delete buf[buf.length-1];
+                params = buf.join('');
+            }
+            var callback = {
+                success: this.successDelegate,
+                failure: this.failureDelegate,
+                timeout: (this.timeout*1000),
+                argument: {'url': url, 'form': null, 'callback': callback, 'params': params}
+            };
+            var method = params ? 'POST' : 'GET';
+            if(method == 'GET'){
+                url = this.prepareUrl(url);
+            }
+            this.transaction = YAHOO.util.Connect.asyncRequest(method, url, callback, params);
+        }
+    },
+    
+    /**
+     * Performs an async form post, updating this element with the response. If the form has the attribute enctype="multipart/form-data", it assumes it's a file upload.
+     * Uses this.sslBlankUrl for SSL file uploads to prevent IE security warning. See YUI docs for more info. 
+     * @param {String/HTMLElement} form The form Id or form element
+     * @param {<i>String</i>} url (optional) The url to pass the form to. If omitted the action attribute on the form will be used.
+     * @param {<i>Boolean</i>} reset (optional) Whether to try to reset the form after the update
+     * @param {<i>Function</i>} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess, oResponse)
+     */
+    formUpdate : function(form, url, reset, callback){
+        if(this.beforeUpdate.fireDirect(this.el, form, url) !== false){
+            formEl = YAHOO.util.Dom.get(form);
+            this.showLoading();
+            if(typeof url == 'function'){
+                url = url();
+            }
+            if(typeof params == 'function'){
+                params = params();
+            }
+            url = url || formEl.action;
+            var callback = {
+                success: this.successDelegate,
+                failure: this.failureDelegate,
+                timeout: (this.timeout*1000),
+                argument: {'url': url, 'form': form, 'callback': callback, 'reset': reset}
+            };
+            var isUpload = false;
+            var enctype = formEl.getAttribute('enctype');
+            if(enctype && enctype.toLowerCase() == 'multipart/form-data'){
+                isUpload = true;
+            }
+            YAHOO.util.Connect.setForm(form, isUpload, this.sslBlankUrl);
+            this.transaction = YAHOO.util.Connect.asyncRequest('POST', url, callback);
+        }
+    },
+    
+    /**
+     * Refresh the element with the last used url or defaultUrl. If there is no url, it returns immediately
+     * @param {Function} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
+     */
+    refresh : function(callback){
+        if(this.defaultUrl == null){
+            return;
+        }
+        this.update(this.defaultUrl, null, callback, true);
+    },
+    
+    /**
+     * Set this element to auto refresh.
+     * @param {Number} interval How often to update (in seconds).
+     * @param {<i>String/Function</i>} url (optional) The url for this request or a function to call to get the url (Defaults to the last used url)
+     * @param {<i>String/Object</i>} params (optional) The parameters to pass as either a url encoded string "&param1=1&param2=2" or as an object {param1: 1, param2: 2}
+     * @param {<i>Function</i>} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
+     * @param {<i>Boolean</i>} refreshNow (optional) Whether to execute the refresh now, or wait the interval
+     */
+    startAutoRefresh : function(interval, url, params, callback, refreshNow){
+        if(refreshNow){
+            this.update(url || this.defaultUrl, params, callback, true);
+        }
+        if(this.autoRefreshProcId){
+            clearInterval(this.autoRefreshProcId);
+        }
+        this.autoRefreshProcId = setInterval(this.update.createDelegate(this, [url || this.defaultUrl, params, callback, true]), interval*1000);
+    },
+    
+    /**
+     * Stop auto refresh on this element.
+     */
+     stopAutoRefresh : function(){
+        if(this.autoRefreshProcId){
+            clearInterval(this.autoRefreshProcId);
+        }
+    },
+    
+    /**
+     * Called to update the element to "Loading" state. Override to perform custom action.
+     */
+    showLoading : function(){
+        if(this.showLoadIndicator){
+            this.el.update(this.indicatorText);
+        }
+    },
+    
+    /**
+     * Adds unique parameter to query string if disableCaching = true
+     * @private
+     */
+    prepareUrl : function(url){
+        if(this.disableCaching){
+            var append = '_dc=' + (new Date().getTime());
+            if(url.indexOf('?') !== -1){
+                url += '&' + append;
+            }else{
+                url += '?' + append;
+            }
+        }
+        return url;
+    },
+    
+    /**
+     * @private
+     */
+    processSuccess : function(response){
+        this.transaction = null;
+        if(response.argument.form && response.argument.reset){
+            try{ // put in try/catch since some older FF releases had problems with this
+                response.argument.form.reset();
+            }catch(e){}
+        }
+        if(this.loadScripts){
+            this.renderer.render(this.el, response, this, 
+                this.updateComplete.createDelegate(this, [response]));
+        }else{
+            this.renderer.render(this.el, response, this);
+            this.updateComplete(response);
+        }
+    },
+    
+    updateComplete : function(response){
+        this.fireEvent('update', this.el, response);
+        if(typeof response.argument.callback == 'function'){
+            response.argument.callback(this.el, true, response);
+        }
+    },
+    
+    /**
+     * @private
+     */
+    processFailure : function(response){
+        this.transaction = null;
+        this.onFailure.fireDirect(this.el, response);
+        if(typeof response.argument.callback == 'function'){
+            response.argument.callback(this.el, false, response);
+        }
+    },
+    
+    /**
+     * Set the content renderer for this UpdateManager. See {@link YAHOO.ext.UpdateManager.BasicRenderer#render} for more details.
+     * @param {Object} renderer The object implementing the render() method
+     */
+    setRenderer : function(renderer){
+        this.renderer = renderer;
+    },
+    
+    getRenderer : function(){
+       return this.renderer;  
+    },
+    
+    /**
+     * Set the defaultUrl used for updates
+     * @param {String/Function} defaultUrl The url or a function to call to get the url
+     */
+    setDefaultUrl : function(defaultUrl){
+        this.defaultUrl = defaultUrl;
+    },
+    
+    /**
+     * Aborts the executing transaction
+     */
+    abort : function(){
+        if(this.transaction){
+            YAHOO.util.Connect.abort(this.transaction);
+        }
+    },
+    
+    /**
+     * Returns true if an update is in progress
+     * @return {Boolean}
+     */
+    isUpdating : function(){
+        if(this.transaction){
+            return YAHOO.util.Connect.isCallInProgress(this.transaction);
+        }
+        return false;
+    }
+};
+
+/**
+ * @class YAHOO.ext.UpdateManager.defaults
+ * The defaults collection enables customizing the default properties of UpdateManager
+ */
+   YAHOO.ext.UpdateManager.defaults = {
+       /**
+         * Timeout for requests or form posts in seconds (Defaults 30 seconds). 
+         * @type Number
+         */
+         timeout : 30,
+         
+         /**
+         * True to process scripts by default (Defaults to false). 
+         * @type Boolean
+         */
+        loadScripts : false,
+         
+        /**
+        * Blank page URL to use with SSL file uploads (Defaults to 'javascript:false'). 
+        * @type String
+        */
+        sslBlankUrl : (YAHOO.ext.SSL_SECURE_URL || 'javascript:false'),
+        /**
+         * Whether to append unique parameter on get request to disable caching (Defaults to false). 
+         * @type Boolean
+         */
+        disableCaching : false,
+        /**
+         * Whether to show indicatorText when loading (Defaults to true). 
+         * @type Boolean
+         */
+        showLoadIndicator : true,
+        /**
+         * Text for loading indicator (Defaults to '&lt;div class="loading-indicator"&gt;Loading...&lt;/div&gt;'). 
+         * @type String
+         */
+        indicatorText : '<div class="loading-indicator">Loading...</div>'
+   };
+
+/**
+ * Static convenience method, Usage: 
+ * <pre><code>YAHOO.ext.UpdateManager.updateElement('my-div', 'stuff.php');</code></pre>
+ * @param {String/HTMLElement/YAHOO.ext.Element} el The element to update
+ * @param {String} url The url
+ * @param {<i>String/Object</i>} params (optional) Url encoded param string or an object of name/value pairs
+ * @param {<i>Object</i>} options (optional) A config object with any of the UpdateManager properties you want to set - for example: {disableCaching:true, indicatorText: 'Loading data...'}
+ * @static
+ */
+YAHOO.ext.UpdateManager.updateElement = function(el, url, params, options){
+    var um = getEl(el, true).getUpdateManager();
+    YAHOO.ext.util.Config.apply(um, options);
+    um.update(url, params, options ? options.callback : null);
+};
+// alias for backwards compat
+YAHOO.ext.UpdateManager.update = YAHOO.ext.UpdateManager.updateElement;
+/**
+ * @class YAHOO.ext.UpdateManager.BasicRenderer
+ * Default Content renderer. Updates the elements innerHTML with the responseText.
+ */ 
+YAHOO.ext.UpdateManager.BasicRenderer = function(){};
+
+YAHOO.ext.UpdateManager.BasicRenderer.prototype = {
+    /**
+     * This is called when the transaction is completed and it's time to update the element - The BasicRenderer 
+     * updates the elements innerHTML with the responseText - To perform a custom render (i.e. XML or JSON processing), 
+     * create an object with a "render(el, response)" method and pass it to setRenderer on the UpdateManager.
+     * @param {YAHOO.ext.Element} el The element being rendered
+     * @param {Object} response The YUI Connect response object
+     * @param {UpdateManager} updateManager The calling update manager
+     * @param {Function} callback A callback that will need to be called if loadScripts is true on the UpdateManager
+     */
+     render : function(el, response, updateManager, callback){
+        el.update(response.responseText, updateManager.loadScripts, callback);
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/anim/Actor.js b/frontend/beta/js/YUI-extensions/anim/Actor.js
new file mode 100644
index 0000000..f5574e6
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/anim/Actor.js
@@ -0,0 +1,759 @@
+
+/**
+ * @class YAHOO.ext.Actor
+ * Provides support for syncing and chaining of Element Yahoo! UI based animation and some common effects. Actors support "self-play" without an Animator.<br><br>
+ * <b>Note: Along with the animation methods defined below, this class inherits and captures all of the "set" or animation methods of {@link YAHOO.ext.Element}. "get" methods are not captured and execute immediately.</b>
+ * <br><br>Usage:<br>
+ * <pre><code>
+ * var actor = new YAHOO.ext.Actor('myElementId');
+ * actor.startCapture(true);
+ * actor.moveTo(100, 100, true);
+ * actor.squish();
+ * actor.play();
+ * <br>
+ * // or to start capturing immediately, with no Animator (the null second param)
+ * <br>
+ * var actor = new YAHOO.ext.Actor('myElementId', null, true);
+ * actor.moveTo(100, 100, true);
+ * actor.squish();
+ * actor.play();
+ * </code></pre>
+ * @extends YAHOO.ext.Element
+ * @requires YAHOO.ext.Element
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @requires YAHOO.util.CustomEvent 
+ * @requires YAHOO.util.Anim
+ * @requires YAHOO.util.ColorAnim
+ * @requires YAHOO.util.Motion
+ * @className YAHOO.ext.Actor
+ * @constructor
+ * Create new Actor.
+ * @param {String/HTMLElement} el The dom element or element id 
+ * @param {<i>YAHOO.ext.Animator</i>} animator (optional) The Animator that will capture this Actor's actions
+ * @param {<i>Boolean</i>} selfCapture (optional) Whether this actor should capture it's own actions to support self playback without an animator (defaults to false)
+ */
+YAHOO.ext.Actor = function(element, animator, selfCapture){
+    this.el = YAHOO.ext.Element.get(element, true); // cache el object for playback
+    YAHOO.ext.Actor.superclass.constructor.call(this, element, true);
+    this.onCapture = new YAHOO.util.CustomEvent('Actor.onCapture');
+    if(animator){
+        /**
+        * The animator used to sync this actor with other actors
+        * @member YAHOO.ext.Actor
+        */
+        animator.addActor(this);
+    }
+    /**
+    * Whether this actor is currently capturing
+    * @member YAHOO.ext.Actor
+    */
+    this.capturing = selfCapture;
+    this.playlist = selfCapture ? new YAHOO.ext.Animator.AnimSequence() : null;
+};
+
+YAHOO.extendX(YAHOO.ext.Actor, YAHOO.ext.Element);
+
+/**
+ * Captures an action for this actor. Generally called internally but can be called directly.
+ * @param {YAHOO.ext.Actor.Action} action
+ */
+YAHOO.ext.Actor.prototype.capture = function(action){
+    if(this.playlist != null){
+        this.playlist.add(action);
+    }
+    this.onCapture.fireDirect(this, action);
+    return action;
+};
+
+/** @ignore */
+YAHOO.ext.Actor.overrideAnimation = function(method, animParam, onParam){
+    return function(){
+        if(!this.capturing){
+            return method.apply(this, arguments);
+        }
+        var args = Array.prototype.slice.call(arguments, 0);
+        if(args[animParam] === true){
+            return this.capture(new YAHOO.ext.Actor.AsyncAction(this, method, args, onParam));
+        }else{
+            return this.capture(new YAHOO.ext.Actor.Action(this, method, args));
+        }
+    };
+}
+
+/** @ignore */
+YAHOO.ext.Actor.overrideBasic = function(method){
+    return function(){
+        if(!this.capturing){
+            return method.apply(this, arguments);
+        }
+        var args = Array.prototype.slice.call(arguments, 0);
+        return this.capture(new YAHOO.ext.Actor.Action(this, method, args));
+    };
+}
+
+// All of these methods below are marked "ignore" because JSDoc treats them as fields, not function. How brilliant. The Element methods are documented anyway though.
+/** Capturing override - See {@link YAHOO.ext.Element#setVisibilityMode} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setVisibilityMode = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.setVisibilityMode);
+/** Capturing override - See {@link YAHOO.ext.Element#enableDisplayMode} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.enableDisplayMode = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.enableDisplayMode);
+/** Capturing override - See {@link YAHOO.ext.Element#focus} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.focus = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.focus);
+/** Capturing override - See {@link YAHOO.ext.Element#addClass} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.addClass = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.addClass);
+/** Capturing override - See {@link YAHOO.ext.Element#removeClass} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.removeClass = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.removeClass);
+/** Capturing override - See {@link YAHOO.ext.Element#replaceClass} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.replaceClass = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.replaceClass);
+/** Capturing override - See {@link YAHOO.ext.Element#setStyle} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setStyle = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.setStyle);
+/** Capturing override - See {@link YAHOO.ext.Element#setLeft} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setLeft = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.setLeft);
+/** Capturing override - See {@link YAHOO.ext.Element#setTop} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setTop = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.setTop);
+/** Capturing override - See {@link YAHOO.ext.Element#setAbsolutePositioned} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setAbsolutePositioned = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.setAbsolutePositioned);
+/** Capturing override - See {@link YAHOO.ext.Element#setRelativePositioned} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setRelativePositioned = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.setRelativePositioned);
+/** Capturing override - See {@link YAHOO.ext.Element#clearPositioning} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.clearPositioning = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.clearPositioning);
+/** Capturing override - See {@link YAHOO.ext.Element#setPositioning} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setPositioning = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.setPositioning);
+/** Capturing override - See {@link YAHOO.ext.Element#clip} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.clip = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.clip);
+/** Capturing override - See {@link YAHOO.ext.Element#unclip} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.unclip = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.unclip);
+/** Capturing override - See {@link YAHOO.ext.Element#clearOpacity} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.clearOpacity = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.clearOpacity);
+/** Capturing override - See {@link YAHOO.ext.Element#update} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.update = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.update);
+/** Capturing override - See {@link YAHOO.ext.Element#remove} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.remove = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.remove);
+YAHOO.ext.Actor.prototype.fitToParent = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.fitToParent);
+YAHOO.ext.Actor.prototype.appendChild = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.appendChild);
+YAHOO.ext.Actor.prototype.createChild = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.createChild);
+YAHOO.ext.Actor.prototype.appendTo = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.appendTo);
+YAHOO.ext.Actor.prototype.insertBefore = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.insertBefore);
+YAHOO.ext.Actor.prototype.insertAfter = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.insertAfter);
+YAHOO.ext.Actor.prototype.wrap = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.wrap);
+YAHOO.ext.Actor.prototype.replace = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.replace);
+YAHOO.ext.Actor.prototype.insertHtml = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.insertHtml);
+YAHOO.ext.Actor.prototype.set = YAHOO.ext.Actor.overrideBasic(YAHOO.ext.Actor.superclass.set);
+
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#load} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.load = function(){
+   if(!this.capturing){
+        return YAHOO.ext.Actor.superclass.load.apply(this, arguments);
+   }
+   var args = Array.prototype.slice.call(arguments, 0);
+   return this.capture(new YAHOO.ext.Actor.AsyncAction(this, YAHOO.ext.Actor.superclass.load, 
+        args, 2));
+};
+
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#animate} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.animate = function(args, duration, onComplete, easing, animType){
+    if(!this.capturing){
+        return YAHOO.ext.Actor.superclass.animate.apply(this, arguments);
+    }
+    return this.capture(new YAHOO.ext.Actor.AsyncAction(this, YAHOO.ext.Actor.superclass.animate, 
+        [args, duration, onComplete, easing, animType], 2));
+};
+
+/** Capturing and animation syncing override - See {@link YAHOO.ext.Element#setVisible} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setVisible = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setVisible, 1, 3);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#toggle} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.toggle = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.toggle, 0, 2);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#setXY} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setXY = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setXY, 1, 3);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#setLocation} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setLocation = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setLocation, 2, 4);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#setWidth} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setWidth = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setWidth, 1, 3);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#setHeight} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setHeight = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setHeight, 1, 3);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#setSize} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setSize = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setSize, 2, 4);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#setBounds} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setBounds = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setBounds, 4, 6);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#setOpacity} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setOpacity = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setOpacity, 1, 3);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#moveTo} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.moveTo = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.moveTo, 2, 4);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#move} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.move = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.move, 2, 4);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#alignTo} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.alignTo = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.alignTo, 3, 5);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#hide} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.hide = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.hide, 0, 2);
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#show} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.show = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.show, 0, 2);
+
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#setBox} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setBox = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setBox, 2, 4);
+
+/**Capturing and animation syncing override - See {@link YAHOO.ext.Element#autoHeight} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.autoHeight = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.autoHeight, 0, 2);
+/** Capturing override - See {@link YAHOO.ext.Element#setX} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setX = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setX, 1, 3);
+/** Capturing override - See {@link YAHOO.ext.Element#setY} for method details.
+ * @method */
+YAHOO.ext.Actor.prototype.setY = YAHOO.ext.Actor.overrideAnimation(YAHOO.ext.Actor.superclass.setY, 1, 3);
+
+/**
+ * Start self capturing calls on this Actor. All subsequent calls are captured and executed when play() is called.
+ */
+YAHOO.ext.Actor.prototype.startCapture = function(){
+    this.capturing = true;
+    this.playlist = new YAHOO.ext.Animator.AnimSequence();
+ };
+ 
+ /**
+ * Stop self capturing calls on this Actor.
+ */
+ YAHOO.ext.Actor.prototype.stopCapture = function(){
+     this.capturing = false;
+ };
+
+/**
+ * Clears any calls that have been self captured.
+ */
+YAHOO.ext.Actor.prototype.clear = function(){
+    this.playlist = new YAHOO.ext.Animator.AnimSequence();
+};
+
+/**
+ * Starts playback of self captured calls.
+ * @param {<i>Function</i>} oncomplete (optional) Callback to execute when playback has completed
+ */
+YAHOO.ext.Actor.prototype.play = function(oncomplete){
+    this.capturing = false;
+    if(this.playlist){
+        this.playlist.play(oncomplete);
+    }
+ };
+
+/**
+ * Capture a function call.
+ * @param {Function} fcn The function to call
+ * @param {<i>Array</i>} args (optional) The arguments to call the function with
+ * @param {<i>Object</i>} scope (optional) The scope of the function
+ */
+YAHOO.ext.Actor.prototype.addCall = function(fcn, args, scope){
+    if(!this.capturing){
+        fcn.apply(scope || this, args || []);
+    }else{
+        this.capture(new YAHOO.ext.Actor.Action(scope, fcn, args || []));
+    }
+};
+
+/**
+ * Capture an async function call.
+ * @param {Function} fcn The function to call
+ * @param {Number} callbackIndex The index of the callback parameter on the passed function. A CALLBACK IS REQUIRED.
+ * @param {<i>Array</i>} args The arguments to call the function with
+ * @param {<i>Object</i>} scope (optional) The scope of the function
+ */
+YAHOO.ext.Actor.prototype.addAsyncCall = function(fcn, callbackIndex, args, scope){
+    if(!this.capturing){
+        fcn.apply(scope || this, args || []);
+    }else{
+       this.capture(new YAHOO.ext.Actor.AsyncAction(scope, fcn, args || [], callbackIndex));
+    }
+ },
+ 
+/**
+ * Capture a pause (in seconds).
+ * @param {Number} seconds The seconds to pause
+ */
+YAHOO.ext.Actor.prototype.pause = function(seconds){
+    this.capture(new YAHOO.ext.Actor.PauseAction(seconds));
+ };
+ 
+/**
+* Shake this element from side to side
+*/
+YAHOO.ext.Actor.prototype.shake = function(){
+    this.move('left', 20, true, .05);
+    this.move('right', 40, true, .05);
+    this.move('left', 40, true, .05);
+    this.move('right', 20, true, .05);
+};
+
+/**
+* Bounce this element from up and down
+*/
+YAHOO.ext.Actor.prototype.bounce = function(){
+    this.move('up', 20, true, .05);
+    this.move('down', 40, true, .05);
+    this.move('up', 40, true, .05);
+    this.move('down', 20, true, .05);
+};
+
+/**
+* Show the element using a "blinds" effect
+* @param {String} anchor The part of the element that it should appear to exapand from. 
+                        The short/long options currently are t/top, l/left
+* @param {<i>Number</i>} newSize (optional) The size to animate to. (Default to current size)
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+* @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeOut)
+*/
+YAHOO.ext.Actor.prototype.blindShow = function(anchor, newSize, duration, easing){
+    var size = this.getSize();
+    this.clip();
+    anchor = anchor.toLowerCase();
+    switch(anchor){
+        case 't':
+        case 'top':
+            this.setHeight(1);
+            this.setVisible(true);
+            this.setHeight(newSize || size.height, true, duration || .5, null, easing || YAHOO.util.Easing.easeOut);
+        break;
+        case 'l':
+        case 'left':
+            this.setWidth(1);
+            this.setVisible(true);
+            this.setWidth(newSize || size.width, true, duration || .5, null, easing || YAHOO.util.Easing.easeOut);
+        break;
+    }
+    this.unclip();
+    return size;
+};
+
+/**
+* Hide the element using a "blinds" effect
+* @param {String} anchor The part of the element that it should appear to collapse to.
+                        The short/long options are t/top, l/left, b/bottom, r/right.
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+* @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeIn)
+*/
+YAHOO.ext.Actor.prototype.blindHide = function(anchor, duration, easing){
+    var size = this.getSize();
+    this.clip();
+    anchor = anchor.toLowerCase();
+    switch(anchor){
+        case 't':
+        case 'top':
+            this.setSize(size.width, 1, true, duration || .5, null, easing || YAHOO.util.Easing.easeIn);
+            this.setVisible(false);
+        break;
+        case 'l':
+        case 'left':
+            this.setSize(1, size.height, true, duration || .5, null, easing || YAHOO.util.Easing.easeIn);
+            this.setVisible(false);
+        break;
+        case 'r':
+        case 'right':
+            this.animate({width: {to: 1}, points: {by: [size.width, 0]}}, 
+            duration || .5, null, YAHOO.util.Easing.easeIn, YAHOO.util.Motion);
+            this.setVisible(false);
+        break;
+        case 'b':
+        case 'bottom':
+            this.animate({height: {to: 1}, points: {by: [0, size.height]}}, 
+            duration || .5, null, YAHOO.util.Easing.easeIn, YAHOO.util.Motion);
+            this.setVisible(false);
+        break;
+    }
+    return size;
+};
+
+/**
+* Show the element using a "slide in" effect - In order for this effect to work the element MUST have a child element container that can be "slid" otherwise a blindShow effect is rendered. 
+* @param {String} anchor The part of the element that it should appear to slide from. 
+                        The short/long options currently are t/top, l/left
+* @param {<i>Number</i>} newSize (optional) The size to animate to. (Default to current size)
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+* @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeOuth)
+*/
+YAHOO.ext.Actor.prototype.slideShow = function(anchor, newSize, duration, easing, clearPositioning){
+    var size = this.getSize();
+    this.clip();
+    var firstChild = this.dom.firstChild;
+    if(!firstChild || (firstChild.nodeName && "#TEXT" == firstChild.nodeName.toUpperCase())) { // can't do a slide with only a textnode
+        this.blindShow(anchor, newSize, duration, easing);
+        return;
+    }
+    var child = YAHOO.ext.Element.get(firstChild, true);
+    var pos = child.getPositioning();
+    this.addCall(child.setAbsolutePositioned, null, child);
+    this.setVisible(true);
+    anchor = anchor.toLowerCase();
+    switch(anchor){
+        case 't':
+        case 'top':
+            this.addCall(child.setStyle, ['right', ''], child);
+            this.addCall(child.setStyle, ['top', ''], child);
+            this.addCall(child.setStyle, ['left', '0px'], child);
+            this.addCall(child.setStyle, ['bottom', '0px'], child);
+            this.setHeight(1);
+            this.setHeight(newSize || size.height, true, duration || .5, null, easing || YAHOO.util.Easing.easeOut);
+        break;
+        case 'l':
+        case 'left':
+            this.addCall(child.setStyle, ['left', ''], child);
+            this.addCall(child.setStyle, ['bottom', ''], child);
+            this.addCall(child.setStyle, ['right', '0px'], child);
+            this.addCall(child.setStyle, ['top', '0px'], child);
+            this.setWidth(1);
+            this.setWidth(newSize || size.width, true, duration || .5, null, easing || YAHOO.util.Easing.easeOut);
+        break;
+        case 'r':
+        case 'right':
+            this.addCall(child.setStyle, ['left', '0px'], child);
+            this.addCall(child.setStyle, ['top', '0px'], child);
+            this.addCall(child.setStyle, ['right', ''], child);
+            this.addCall(child.setStyle, ['bottom', ''], child);
+            this.setWidth(1);
+            this.setWidth(newSize || size.width, true, duration || .5, null, easing || YAHOO.util.Easing.easeOut);
+        break;
+        case 'b':
+        case 'bottom':
+            this.addCall(child.setStyle, ['right', ''], child);
+            this.addCall(child.setStyle, ['top', '0px'], child);
+            this.addCall(child.setStyle, ['left', '0px'], child);
+            this.addCall(child.setStyle, ['bottom', ''], child);
+            this.setHeight(1);
+            this.setHeight(newSize || size.height, true, duration || .5, null, easing || YAHOO.util.Easing.easeOut);
+        break;
+    }
+    if(clearPositioning !== false){
+      this.addCall(child.setPositioning, [pos], child);
+    }
+    this.unclip();
+    return size;
+};
+
+/**
+* Hide the element using a "slide in" effect - In order for this effect to work the element MUST have a child element container that can be "slid" otherwise a blindHide effect is rendered. 
+* @param {String} anchor The part of the element that it should appear to slide to.
+                        The short/long options are t/top, l/left, b/bottom, r/right.
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+* @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeIn)
+*/
+YAHOO.ext.Actor.prototype.slideHide = function(anchor, duration, easing){
+    var size = this.getSize();
+    this.clip();
+    var firstChild = this.dom.firstChild;
+    if(!firstChild || (firstChild.nodeName && "#TEXT" == firstChild.nodeName.toUpperCase())) { // can't do a slide with only a textnode
+        this.blindHide(anchor, duration, easing);
+        return;
+    }
+    var child = YAHOO.ext.Element.get(firstChild, true);
+    var pos = child.getPositioning();
+    this.addCall(child.setAbsolutePositioned, null, child);
+    anchor = anchor.toLowerCase();
+    switch(anchor){
+        case 't':
+        case 'top':
+            this.addCall(child.setStyle, ['right', ''], child);
+            this.addCall(child.setStyle, ['top', ''], child);
+            this.addCall(child.setStyle, ['left', '0px'], child);
+            this.addCall(child.setStyle, ['bottom', '0px'], child);
+            this.setSize(size.width, 1, true, duration || .5, null, easing || YAHOO.util.Easing.easeIn);
+            this.setVisible(false);
+        break;
+        case 'l':
+        case 'left':
+            this.addCall(child.setStyle, ['left', ''], child);
+            this.addCall(child.setStyle, ['bottom', ''], child);
+            this.addCall(child.setStyle, ['right', '0px'], child);
+            this.addCall(child.setStyle, ['top', '0px'], child);
+            this.setSize(1, size.height, true, duration || .5, null, easing || YAHOO.util.Easing.easeIn);
+            this.setVisible(false);
+        break;
+        case 'r':
+        case 'right':
+            this.addCall(child.setStyle, ['right', ''], child);
+            this.addCall(child.setStyle, ['bottom', ''], child);
+            this.addCall(child.setStyle, ['left', '0px'], child);
+            this.addCall(child.setStyle, ['top', '0px'], child);
+            this.setSize(1, size.height, true, duration || .5, null, easing || YAHOO.util.Easing.easeIn);
+            this.setVisible(false);
+        break;
+        case 'b':
+        case 'bottom':
+            this.addCall(child.setStyle, ['right', ''], child);
+            this.addCall(child.setStyle, ['top', '0px'], child);
+            this.addCall(child.setStyle, ['left', '0px'], child);
+            this.addCall(child.setStyle, ['bottom', ''], child);
+            this.setSize(size.width, 1, true, duration || .5, null, easing || YAHOO.util.Easing.easeIn);
+            this.setVisible(false);
+        break;
+    }
+    this.addCall(child.setPositioning, [pos], child);
+    return size;
+};
+
+/**
+* Hide the element by "squishing" it into the corner
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+*/
+YAHOO.ext.Actor.prototype.squish = function(duration){
+    var size = this.getSize();
+    this.clip();
+    this.setSize(1, 1, true, duration || .5);
+    this.setVisible(false);
+    return size;
+};
+
+/**
+* Fade an element in
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+*/
+YAHOO.ext.Actor.prototype.appear = function(duration){
+    this.setVisible(true, true, duration);
+};
+
+/**
+* Fade an element out
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+*/
+YAHOO.ext.Actor.prototype.fade = function(duration){
+    this.setVisible(false, true, duration);
+};
+
+/**
+* Blink the element as if it was clicked and then collapse on it's center
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+*/
+YAHOO.ext.Actor.prototype.switchOff = function(duration){
+    this.clip();
+    this.setVisible(false, true, .1);
+    this.clearOpacity();
+    this.setVisible(true);
+    this.animate({height: {to: 1}, points: {by: [0, this.getHeight()/2]}}, 
+            duration || .5, null, YAHOO.util.Easing.easeOut, YAHOO.util.Motion);
+    this.setVisible(false);
+};
+
+/**
+* Highlight the element using a background color (or passed attribute) animation
+* @param {String} color (optional) The color to use for the highlight
+* @param {<i>String</i>} fromColor (optional) If the element does not currently have a background color, you will need to pass in a color to animate from
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+* @param {<i>String</i>} attribute (optional) Specify a CSS attribute to use other than background color - camelCase
+*/
+YAHOO.ext.Actor.prototype.highlight = function(color, fromColor, duration, attribute){
+    attribute = attribute || 'background-color';
+    var original = this.getStyle(attribute);
+    fromColor = fromColor || ((original && original != '' && original != 'transparent') ? original : '#FFFFFF');
+    var cfg = {};
+    cfg[attribute] = {to: color, from: fromColor};
+    this.setVisible(true);
+    this.animate(cfg, duration || .5, null, YAHOO.util.Easing.bounceOut, YAHOO.util.ColorAnim);
+    this.setStyle(attribute, original);
+};
+
+/**
+* Fade the element in and out the specified amount of times
+* @param {<i>Number</i>} count (optional) How many times to pulse (Defaults to 3)
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+*/
+YAHOO.ext.Actor.prototype.pulsate = function(count, duration){
+    count = count || 3;
+    for(var i = 0; i < count; i++){
+        this.toggle(true, duration || .25);
+        this.toggle(true, duration || .25);
+    }
+};
+
+/**
+* Fade the element as it is falling from it's current position
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+*/
+YAHOO.ext.Actor.prototype.dropOut = function(duration){
+    this.animate({opacity: {to: 0}, points: {by: [0, this.getHeight()]}}, 
+            duration || .5, null, YAHOO.util.Easing.easeIn, YAHOO.util.Motion);
+    this.setVisible(false);
+};
+
+/**
+* Hide the element in a way that it appears as if it is flying off the screen
+* @param {String} anchor The part of the page that the element should appear to move to. 
+                        The short/long options are t/top, l/left, b/bottom, r/right, tl/top-left, 
+                        tr/top-right, bl/bottom-left or br/bottom-right.
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+* @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeIn)
+*/
+YAHOO.ext.Actor.prototype.moveOut = function(anchor, duration, easing){
+    var Y = YAHOO.util;
+    var vw = Y.Dom.getViewportWidth();
+    var vh = Y.Dom.getViewportHeight();
+    var cpoints = this.getCenterXY()
+    var centerX = cpoints[0];
+    var centerY = cpoints[1];
+    var anchor = anchor.toLowerCase();
+    var p;
+    switch(anchor){
+        case 't':
+        case 'top':
+            p = [centerX, -this.getHeight()];
+        break;
+        case 'l':
+        case 'left':
+            p = [-this.getWidth(), centerY];
+        break;
+        case 'r':
+        case 'right':
+            p = [vw+this.getWidth(), centerY];
+        break;
+        case 'b':
+        case 'bottom':
+            p = [centerX, vh+this.getHeight()];
+        break;
+        case 'tl':
+        case 'top-left':
+            p = [-this.getWidth(), -this.getHeight()];
+        break;
+        case 'bl':
+        case 'bottom-left':
+            p = [-this.getWidth(), vh+this.getHeight()];
+        break;
+        case 'br':
+        case 'bottom-right':
+            p = [vw+this.getWidth(), vh+this.getHeight()];
+        break;
+        case 'tr':
+        case 'top-right':
+            p = [vw+this.getWidth(), -this.getHeight()];
+        break;
+    }
+    this.moveTo(p[0], p[1], true, duration || .35, null, easing || Y.Easing.easeIn);
+    this.setVisible(false);
+};
+
+/**
+* Show the element in a way that it appears as if it is flying onto the screen
+* @param {String} anchor The part of the page that the element should appear to move from. 
+                        The short/long options are t/top, l/left, b/bottom, r/right, tl/top-left, 
+                        tr/top-right, bl/bottom-left or br/bottom-right.
+* @param {<i>Array</i>} to (optional) Array of x and y position to move to like [x, y] (Defaults to center screen)
+* @param {<i>Float</i>} duration (optional) How long the effect lasts (in seconds)
+* @param {<i>Function</i>} easing (optional) YAHOO.util.Easing method to use. (Defaults to YAHOO.util.Easing.easeOut)
+*/
+YAHOO.ext.Actor.prototype.moveIn = function(anchor, to, duration, easing){
+    to = to || this.getCenterXY();
+    this.moveOut(anchor, .01);
+    this.setVisible(true);
+    this.setXY(to, true, duration || .35, null, easing || YAHOO.util.Easing.easeOut);
+};
+/**
+* Show a ripple of exploding, attenuating borders to draw attention to an Element.
+* @param {<i>Number<i>} color (optional) The color of the border.
+* @param {<i>Number</i>} count (optional) How many ripples.
+* @param {<i>Float</i>} duration (optional) How long each ripple takes to expire
+*/
+YAHOO.ext.Actor.prototype.frame = function(color, count, duration){
+    color = color || "red";
+    count = count || 3;
+    duration = duration || .5;
+    var frameFn = function(callback){
+        var box = this.getBox();
+        var animFn = function(){ 
+            var proxy = this.createProxy({
+                 tag:"div",
+                 style:{
+                    visbility:"hidden",
+                    position:"absolute",
+                    'z-index':"35000", // yee haw
+                    border:"0px solid " + color
+                 }
+              });
+            var scale = proxy.isBorderBox() ? 2 : 1;
+            proxy.animate({
+                top:{from:box.y, to:box.y - 20},
+                left:{from:box.x, to:box.x - 20},
+                borderWidth:{from:0, to:10},
+                opacity:{from:1, to:0},
+                height:{from:box.height, to:(box.height + (20*scale))},
+                width:{from:box.width, to:(box.width + (20*scale))}
+            }, duration, function(){
+                proxy.remove();
+            });
+            if(--count > 0){
+                 animFn.defer((duration/2)*1000, this);
+            }else{
+                if(typeof callback == 'function'){
+                    callback();
+                }
+            }
+       }
+       animFn.call(this);
+   }
+   this.addAsyncCall(frameFn, 0, null, this);
+};
+
+YAHOO.ext.Actor.Action = function(actor, method, args){
+      this.actor = actor;
+      this.method = method;
+      this.args = args;
+  }
+  
+YAHOO.ext.Actor.Action.prototype = {
+    play : function(onComplete){
+        this.method.apply(this.actor || window, this.args);
+        onComplete();
+    }  
+};
+
+
+YAHOO.ext.Actor.AsyncAction = function(actor, method, args, onIndex){
+    YAHOO.ext.Actor.AsyncAction.superclass.constructor.call(this, actor, method, args);
+    this.onIndex = onIndex;
+    this.originalCallback = this.args[onIndex];
+}
+YAHOO.extendX(YAHOO.ext.Actor.AsyncAction, YAHOO.ext.Actor.Action);
+
+YAHOO.ext.Actor.AsyncAction.prototype.play = function(onComplete){
+    var callbackArg = this.originalCallback ? 
+                        this.originalCallback.createSequence(onComplete) : onComplete;
+    this.args[this.onIndex] = callbackArg;
+    this.method.apply(this.actor, this.args);
+};
+
+
+YAHOO.ext.Actor.PauseAction = function(seconds){
+    this.seconds = seconds;
+};
+YAHOO.ext.Actor.PauseAction.prototype = {
+    play : function(onComplete){
+        setTimeout(onComplete, this.seconds * 1000);
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/anim/Animator.js b/frontend/beta/js/YUI-extensions/anim/Animator.js
new file mode 100644
index 0000000..ed250fb
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/anim/Animator.js
@@ -0,0 +1,482 @@
+/**
+ * @class YAHOO.ext.Animator
+ * Provides support for syncing animations for multiple {@link YAHOO.ext.Actor}s.<br><br>
+* <br><br>This example can be seen in action <a href="http://www.jackslocum.com/yui/2006/08/19/a-splitbar-component-for-yahoo-ui/" target="_new">here</a> 
+* by clicking on "Click here and I will point it out" at the end of the first paragraph.<br>
+ * <pre><code>
+var animator = new YAHOO.ext.Animator();
+var cursor = new YAHOO.ext.Actor('cursor-img', animator);
+var click = new YAHOO.ext.Actor('click-img', animator);
+var resize = new YAHOO.ext.Actor('resize-img', animator);
+
+// start capturing
+animator.startCapture();
+
+// these animations will be run in sequence
+cursor.show();
+cursor.moveTo(500,400);
+cursor.moveTo(20, getEl('navbar').getY()+10, true, .75);
+click.show();
+click.alignTo(cursor, 'tl', [-4, -4]);
+
+// Add an async function call, pass callback to argument 1
+animator.addAsyncCall(Blog.navbar.undockDelegate, 1);
+
+// pause .5 seconds
+animator.pause(.5);
+
+// again, these animations will be run in sequence
+click.hide(true, .7);
+cursor.alignTo('splitter', 'tr', [0, +100], true, 1);
+resize.alignTo('splitter', 'tr', [-12, +100]);
+
+// start sync block: these animations will run at the same time
+animator.beginSync();
+cursor.hide();
+resize.show();
+animator.endSync();
+
+// play the captured animation sequences, call myCallback when done
+animator.play(myCallback);
+ * </code></pre>
+ * @requires YAHOO.ext.Element
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @requires YAHOO.util.CustomEvent 
+ * @requires YAHOO.util.Anim
+ * @requires YAHOO.util.ColorAnim
+ * @requires YAHOO.util.Motion
+ * @constructor
+ * @param {String/HTMLElement} el The dom element or element id 
+ * @param {<i>YAHOO.ext.Animator</i>} animator (optional) The Animator that will capture this Actor's actions
+ * @param {<i>Boolean</i>} selfCapture (optional) Whether this actor should capture it's own actions to support self playback without an animator (defaults to false)
+ */ 
+ YAHOO.ext.Animator = function(/*Actors...*/){
+    this.actors = [];
+    this.playlist = new YAHOO.ext.Animator.AnimSequence();
+    this.captureDelegate = this.capture.createDelegate(this);
+    this.playDelegate = this.play.createDelegate(this);
+    this.syncing = false;
+    this.stopping = false;
+    this.playing = false;
+    for(var i = 0; i < arguments.length; i++){
+        this.addActor(arguments[i]);
+    }
+ };
+ 
+ YAHOO.ext.Animator.prototype = {
+ 
+     capture : function(actor, action){
+        if(this.syncing){
+            if(!this.syncMap[actor.id]){
+                this.syncMap[actor.id] = new YAHOO.ext.Animator.AnimSequence();
+            }
+            this.syncMap[actor.id].add(action);
+        }else{
+            this.playlist.add(action);
+        }
+    },
+    
+    /**
+      * Add an actor. The actor is also set to capturing = true.
+      * @param {YAHOO.ext.Actor} actor
+      */
+     addActor : function(actor){
+        actor.onCapture.subscribe(this.captureDelegate);
+        this.actors.push(actor);
+    },
+    
+    
+    /**
+      * Start capturing actions on the added actors. 
+      * @param {<i>Boolean</i>} clearPlaylist Whether to also create a new playlist
+      */
+     startCapture : function(clearPlaylist){
+        for(var i = 0; i < this.actors.length; i++){
+            var a = this.actors[i];
+            if(!this.isCapturing(a)){
+                a.onCapture.subscribe(this.captureDelegate);
+            }
+            a.capturing = true;
+        }
+        if(clearPlaylist){
+            this.playlist = new YAHOO.ext.Animator.AnimSequence();
+        }
+     },
+     
+     /**
+      * Checks whether this animator is listening to a specific actor.
+      * @param {YAHOO.ext.Actor} actor
+      */
+     isCapturing : function(actor){
+        var subscribers = actor.onCapture.subscribers;
+        if(subscribers){
+            for(var i = 0; i < subscribers.length; i++){
+                if(subscribers[i] && subscribers[i].contains(this.captureDelegate)){
+                    return true;
+                }
+            }
+        }
+        return false;
+     },
+     
+     /**
+      * Stop capturing on all added actors.
+      */
+     stopCapture : function(){
+         for(var i = 0; i < this.actors.length; i++){
+            var a = this.actors[i];
+            a.onCapture.unsubscribe(this.captureDelegate);
+            a.capturing = false;
+         }
+     },
+     
+     /**
+     * Start a multi-actor sync block. By default all animations are run in sequence. While in the sync block
+     * each actor's own animations will still be sequenced, but all actors will animate at the same time. 
+     */
+    beginSync : function(){
+        this.syncing = true;
+        this.syncMap = {};
+     },
+     
+     /**
+     * End the multi-actor sync block
+     */
+    endSync : function(){
+         this.syncing = false;
+         var composite = new YAHOO.ext.Animator.CompositeSequence();
+         for(key in this.syncMap){
+             if(typeof this.syncMap[key] != 'function'){
+                composite.add(this.syncMap[key]);
+             }
+         }
+         this.playlist.add(composite);
+         this.syncMap = null;
+     },
+     
+    /**
+     * Starts playback of the playlist, also stops any capturing. To start capturing again call {@link #startCapture}.
+     * @param {<i>Function</i>} oncomplete (optional) Callback to execute when playback has completed
+     */
+    play : function(oncomplete){
+        if(this.playing) return; // can't play the same animation twice at once
+        this.stopCapture();
+        this.playlist.play(oncomplete);
+    },
+    
+    /**
+     * Stop at the next available stopping point
+     */
+    stop : function(){
+        this.playlist.stop();
+    },
+    
+    /**
+     * Check if this animator is currently playing
+     */
+    isPlaying : function(){
+        return this.playlist.isPlaying();
+    },
+    /**
+     * Clear the playlist
+     */
+    clear : function(){
+        this.playlist = new YAHOO.ext.Animator.AnimSequence();
+     },
+     
+    /**
+     * Add a function call to the playlist.
+     * @param {Function} fcn The function to call
+     * @param {<i>Array</i>} args The arguments to call the function with
+     * @param {<i>Object</i>} scope (optional) The scope of the function
+     */
+     addCall : function(fcn, args, scope){
+        this.playlist.add(new YAHOO.ext.Actor.Action(scope, fcn, args || []));
+     },
+     
+     /**
+     * Add an async function call to the playlist.
+     * @param {Function} fcn The function to call
+     * @param {Number} callbackIndex The index of the callback parameter on the passed function. A CALLBACK IS REQUIRED.
+     * @param {<i>Array</i>} args The arguments to call the function with
+     * @param {<i>Object</i>} scope (optional) The scope of the function
+     */
+    addAsyncCall : function(fcn, callbackIndex, args, scope){
+        this.playlist.add(new YAHOO.ext.Actor.AsyncAction(scope, fcn, args || [], callbackIndex));
+     },
+     
+     /**
+     * Add a pause to the playlist (in seconds)
+     * @param {Number} seconds The number of seconds to pause.
+     */
+    pause : function(seconds){
+        this.playlist.add(new YAHOO.ext.Actor.PauseAction(seconds));
+     }
+     
+  };
+/**
+ * Static function to build a AnimatorComposite from a css selector (requires YAHOO.ext.Element.selectorFunction be defined)
+ * @param {String/Array} selector The css selector or an array of nodes to animate
+ * @method @static
+ */
+YAHOO.ext.Animator.select = function(selector){
+    var els;
+    if(typeof selector == 'string'){
+        els = YAHOO.ext.Element.selectorFunction(selector);
+    }else if(selector instanceof Array){
+        els = selector;
+    }else{
+        throw 'Invalid selector';
+    }
+    return new YAHOO.ext.AnimatorComposite(els);
+};
+var getActors = YAHOO.ext.Animator.select;
+
+/**
+ * @class YAHOO.ext.AnimatorComposite
+ * Composite class with synchronized animations. This is the class returned by getActors(selector) or YAHOO.ext.Animator.select().
+ */
+YAHOO.ext.AnimatorComposite = function(els){
+    this.animator = new YAHOO.ext.Animator();
+    this.addElements(els);
+    this.syncAnims = true;
+};
+YAHOO.ext.AnimatorComposite.prototype = {
+    isComposite: true,
+    /**
+    * Adds elements to this composite.
+    * @param {Array} els An array of elements to add
+    * @return {AnimatorComposite} this
+    */
+    addElements : function(els){
+        if(!els) return this;
+        var anim = this.animator;
+        for(var i = 0, len = els.length; i < len; i++) {
+        	anim.addActor(new YAHOO.ext.Actor(els[i]));
+        }
+        anim.startCapture();
+        return this;
+    },
+    /**
+    * Operations called after sequence() will be performed one by one on each element in this composite.
+    * @return {AnimatorComposite} this
+    */
+    sequence : function(){
+        this.syncAnims = false;
+        return this;
+    },
+    /**
+    * Operations called after sync() will be performed at the same time on each element in this composite.
+    * @return {AnimatorComposite} this
+    */
+    sync : function(){
+        this.syncAnims = true;
+        return this;
+    },
+    invoke : function(fn, args){
+        var els = this.animator.actors;
+        if(this.syncAnims) this.animator.beginSync();
+        for(var i = 0, len = els.length; i < len; i++) {
+            YAHOO.ext.Actor.prototype[fn].apply(els[i], args);
+        }
+        if(this.syncAnims) this.animator.endSync();
+        return this;
+    },
+    /**
+    * Play the actions queued in this composite.
+    * @param {Function} callback (optional) callback is called when all animations have compelted
+    * @return {AnimatorComposite} this
+    */
+    play : function(callback){
+        this.animator.play(callback);
+        return this;
+    },
+    /**
+    * Clear all actions in the queue.
+    * @param {Function} callback (optional) callback is called when all animations have compelted
+    * @return {AnimatorComposite} this
+    */
+    reset : function(callback){
+        this.animator.startCapture(true);
+        return this;
+    },
+    /**
+     * Add a pause
+     * @param {Number} seconds
+    * @return {AnimatorComposite} this
+     */
+    pause : function(seconds){
+        this.animator.pause(seconds);
+        return this;
+    },
+    /**
+    * Get the YAHOO.ext.Animator that controls the animations for this composite.
+    * @return {YAHOO.ext.Animator}
+    */
+    getAnimator : function(){
+        return this.animator;
+    },
+    /**
+    * Calls the passed function passing (el, this, index) for each element in this composite.
+    * @param {Function} fn The function to call
+    * @param {Object} scope (optional) The <i>this</i> object (defaults to the element)
+    * @return {AnimatorComposite} this
+    */
+    each : function(fn, scope){
+        var els = this.animator.actors;
+        if(this.syncAnims) this.animator.beginSync();
+        for(var i = 0, len = els.length; i < len; i++){
+            fn.call(scope || els[i], els[i], this, i);
+        }
+        if(this.syncAnims) this.animator.endSync();
+        return this;
+    },
+    /**
+     * Add a function call to the playlist.
+     * @param {Function} fcn The function to call
+     * @param {<i>Array</i>} args (optional) The arguments to call the function with
+     * @param {<i>Object</i>} scope (optional) The scope of the function
+     * @return {AnimatorComposite} this
+     */
+     addCall : function(fcn, args, scope){
+        this.animator.addCall(fcn, args, scope);
+        return this;
+    },
+    /**
+     * Add an async function call to the playlist.
+     * @param {Function} fcn The function to call
+     * @param {Number} callbackIndex The index of the callback parameter on the passed function. <b>A CALLBACK IS REQUIRED</b>.
+     * @param {<i>Array</i>} args (optional) The arguments to call the function with
+     * @param {<i>Object</i>} scope (optional) The scope of the function
+     * @return {AnimatorComposite} this
+    */
+    addAsyncCall : function(fcn, callbackIndex, args, scope){
+        this.animator.addAsyncCall(fcn, callbackIndex, args, scope);
+        return this;
+    }
+};
+for(var fnName in YAHOO.ext.Actor.prototype){
+    if(typeof YAHOO.ext.Actor.prototype[fnName] == 'function'){
+        YAHOO.ext.CompositeElement.createCall(YAHOO.ext.AnimatorComposite.prototype, fnName);
+    }
+}
+
+
+YAHOO.ext.Animator.AnimSequence = function(){
+    this.actions = [];
+    this.nextDelegate = this.next.createDelegate(this);
+    this.playDelegate = this.play.createDelegate(this);
+    this.oncomplete = null;
+    this.playing = false;
+    this.stopping = false;
+    this.actionIndex = -1;
+ };
+ 
+ YAHOO.ext.Animator.AnimSequence.prototype = {
+ 
+    add : function(action){
+        this.actions.push(action);
+    },
+    
+    next : function(){
+        if(this.stopping){
+            this.playing = false;
+            if(this.oncomplete){
+                this.oncomplete(this, false);
+            }
+            return;
+        }
+        var nextAction = this.actions[++this.actionIndex];
+        if(nextAction){
+            nextAction.play(this.nextDelegate);
+        }else{
+            this.playing = false;
+            if(this.oncomplete){
+                this.oncomplete(this, true);
+            }
+        }
+    },
+    
+    play : function(oncomplete){
+        if(this.playing) return; // can't play the same sequence twice at once
+        this.oncomplete = oncomplete;
+        this.stopping = false;
+        this.playing = true;
+        this.actionIndex = -1;
+        this.next();
+    },
+    
+    stop : function(){
+        this.stopping = true;
+    },
+    
+    isPlaying : function(){
+        return this.playing;
+    },
+    
+    clear : function(){
+        this.actions = [];
+    },
+     
+    addCall : function(fcn, args, scope){
+        this.actions.push(new YAHOO.ext.Actor.Action(scope, fcn, args || []));
+     },
+     
+     addAsyncCall : function(fcn, callbackIndex, args, scope){
+        this.actions.push(new YAHOO.ext.Actor.AsyncAction(scope, fcn, args || [], callbackIndex));
+     },
+     
+     pause : function(seconds){
+        this.actions.push(new YAHOO.ext.Actor.PauseAction(seconds));
+     }
+     
+  };
+
+YAHOO.ext.Animator.CompositeSequence = function(){
+    this.sequences = [];
+    this.completed = 0;
+    this.trackDelegate = this.trackCompletion.createDelegate(this);
+}
+
+YAHOO.ext.Animator.CompositeSequence.prototype = {
+    add : function(sequence){
+        this.sequences.push(sequence);
+    },
+    
+    play : function(onComplete){
+        this.completed = 0;
+        if(this.sequences.length < 1){
+            if(onComplete)onComplete();
+            return;
+        }
+        this.onComplete = onComplete;
+        for(var i = 0; i < this.sequences.length; i++){
+            this.sequences[i].play(this.trackDelegate);
+        }
+    },
+    
+    trackCompletion : function(){
+        ++this.completed;
+        if(this.completed >= this.sequences.length && this.onComplete){
+            this.onComplete();
+        }
+    },
+    
+    stop : function(){
+        for(var i = 0; i < this.sequences.length; i++){
+            this.sequences[i].stop();
+        }
+    },
+    
+    isPlaying : function(){
+        for(var i = 0; i < this.sequences.length; i++){
+            if(this.sequences[i].isPlaying()){
+                return true;
+            }
+        }
+        return false;
+    }
+};
+
+
diff --git a/frontend/beta/js/YUI-extensions/data/AbstractDataModel.js b/frontend/beta/js/YUI-extensions/data/AbstractDataModel.js
new file mode 100644
index 0000000..092ea75
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/data/AbstractDataModel.js
@@ -0,0 +1,226 @@
+/**
+ * @class YAHOO.ext.grid.AbstractDataModel
+ * @extends YAHOO.ext.util.Observable
+ * This abstract class provides default implementations of the events required by the Grid. 
+ It takes care of the creating the CustomEvents and provides some convenient methods for firing the events. <br><br>
+ * @constructor
+*/
+YAHOO.ext.grid.AbstractDataModel = function(){
+    /** Fires when a cell is updated - fireDirect sig: (this, rowIndex, columnIndex)
+     * @private
+     * @type YAHOO.util.CustomEvent
+     * @deprecated Use addListener instead of accessing directly
+     */
+    this.onCellUpdated = new YAHOO.util.CustomEvent('onCellUpdated');
+    /** Fires when all data needs to be revalidated - fireDirect sig: (thisd)
+     * @private
+     * @type YAHOO.util.CustomEvent 
+     * @deprecated Use addListener instead of accessing directly
+     */
+    this.onTableDataChanged = new YAHOO.util.CustomEvent('onTableDataChanged');
+    /** Fires when rows are deleted - fireDirect sig: (this, firstRowIndex, lastRowIndex)
+     * @private
+     * @type YAHOO.util.CustomEvent 
+     * @deprecated Use addListener instead of accessing directly
+     */
+    this.onRowsDeleted = new YAHOO.util.CustomEvent('onRowsDeleted');
+    /** Fires when a rows are inserted - fireDirect sig: (this, firstRowIndex, lastRowIndex)
+     * @private
+     * @type YAHOO.util.CustomEvent 
+     * @deprecated Use addListener instead of accessing directly
+     */
+    this.onRowsInserted = new YAHOO.util.CustomEvent('onRowsInserted');
+    /** Fires when a rows are updated - fireDirect sig: (this, firstRowIndex, lastRowIndex)
+     * @private
+     * @type YAHOO.util.CustomEvent 
+     * @deprecated Use addListener instead of accessing directly
+     */
+    this.onRowsUpdated = new YAHOO.util.CustomEvent('onRowsUpdated');
+    /** Fires when a sort has reordered the rows - fireDirect sig: (this, sortColumnIndex, 
+     * @private
+     * sortDirection = 'ASC' or 'DESC')
+     * @type YAHOO.util.CustomEvent 
+     * @deprecated Use addListener instead of accessing directly
+     */
+    this.onRowsSorted = new YAHOO.util.CustomEvent('onRowsSorted');
+    
+    this.events = {
+      /**
+       * @event cellupdated
+       * Fires when a cell is updated
+       * @param {DataModel} this
+       * @param {Number} rowIndex
+       * @param {Number} columnIndex
+       */
+      'cellupdated' : this.onCellUpdated,
+      /**
+       * @event datachanged
+       * Fires when the entire data structure has changed
+       * @param {DataModel} this
+       */
+      'datachanged' : this.onTableDataChanged,
+      /**
+       * @event rowsdeleted
+       * Fires  when a range of rows have been deleted
+       * @param {DataModel} this
+       * @param {Number} firstRowIndex
+       * @param {Number} lastRowIndex
+       */
+      'rowsdeleted' : this.onRowsDeleted,
+      /**
+       * @event rowsinserted
+       * Fires when a range of rows have been inserted
+       * @param {DataModel} this
+       * @param {Number} firstRowIndex
+       * @param {Number} lastRowIndex
+       */
+      'rowsinserted' : this.onRowsInserted,
+      /**
+       * @event rowsupdated
+       * Fires when a range of rows have been updated
+       * @param {DataModel} this
+       * @param {Number} firstRowIndex
+       * @param {Number} lastRowIndex
+       */
+      'rowsupdated' : this.onRowsUpdated,
+      /**
+       * @event rowssorted
+       * Fires when the data has been sorted
+       * @param {DataModel} this
+       */
+      'rowssorted' : this.onRowsSorted
+    };
+};
+
+YAHOO.ext.grid.AbstractDataModel.prototype = {
+    
+    fireEvent : YAHOO.ext.util.Observable.prototype.fireEvent,
+    on : YAHOO.ext.util.Observable.prototype.on,
+    addListener : YAHOO.ext.util.Observable.prototype.addListener,
+    delayedListener : YAHOO.ext.util.Observable.prototype.delayedListener,
+    removeListener : YAHOO.ext.util.Observable.prototype.removeListener,
+    purgeListeners : YAHOO.ext.util.Observable.prototype.purgeListeners,
+    bufferedListener : YAHOO.ext.util.Observable.prototype.bufferedListener,
+    
+    /**
+     *  Notifies listeners that the value of the cell at [row, col] has been updated
+     * @deprecated
+     * @private
+     */
+    fireCellUpdated : function(row, col){
+        this.onCellUpdated.fireDirect(this, row, col);
+    },
+    
+    /**
+     *  Notifies listeners that all data for the grid may have changed - use as a last resort. This 
+     * also wipes out all selections a user might have made.
+     * @deprecated
+     * @private
+     */
+    fireTableDataChanged : function(){
+        this.onTableDataChanged.fireDirect(this);
+    },
+    
+    /**
+     *  Notifies listeners that rows in the range [firstRow, lastRow], inclusive, have been deleted
+     * @deprecated
+     * @private
+     */
+    fireRowsDeleted : function(firstRow, lastRow){
+        this.onRowsDeleted.fireDirect(this, firstRow, lastRow);
+    },
+    
+    /**
+     *  Notifies listeners that rows in the range [firstRow, lastRow], inclusive, have been inserted
+     * @deprecated
+     * @private
+     */
+    fireRowsInserted : function(firstRow, lastRow){
+        this.onRowsInserted.fireDirect(this, firstRow, lastRow);
+    },
+    
+    /**
+     *  Notifies listeners that rows in the range [firstRow, lastRow], inclusive, have been updated
+     * @deprecated
+     * @private
+     */
+    fireRowsUpdated : function(firstRow, lastRow){
+        this.onRowsUpdated.fireDirect(this, firstRow, lastRow);
+    },
+    
+    /**
+     *  Notifies listeners that rows have been sorted and any indexes may be invalid
+     * @deprecated
+     * @private
+     */
+    fireRowsSorted : function(sortColumnIndex, sortDir, noRefresh){
+        this.onRowsSorted.fireDirect(this, sortColumnIndex, sortDir, noRefresh);
+    },
+    
+    /**
+     * Empty interface method - Classes which extend AbstractDataModel should implement this method.
+     * See {@link YAHOO.ext.DefaultDataModel#sort} for an example implementation.
+    * @private
+      */
+    sort : function(sortInfo, columnIndex, direction, suppressEvent){
+    	
+    },
+    
+    /**
+     * Interface method to supply info regarding the Grid's current sort state - if overridden,
+     * this should return an object like this {column: this.sortColumn, direction: this.sortDir}.
+     * @return {Object} 
+      */
+    getSortState : function(){
+    	return {column: this.sortColumn, direction: this.sortDir};
+    },
+    
+    /**
+     * Empty interface method - Classes which extend AbstractDataModel should implement this method.
+     * See {@link YAHOO.ext.DefaultDataModel} for an example implementation.
+     * @private
+     */
+    getRowCount : function(){
+    	
+    },
+    
+    /**
+     * Empty interface method - Classes which extend AbstractDataModel should implement this method to support virtual row counts.
+     * @private
+     */
+    getTotalRowCount : function(){
+    	return this.getRowCount();
+    },
+    
+    
+    /**
+     * Empty interface method - Classes which extend AbstractDataModel should implement this method.
+     * See {@link YAHOO.ext.DefaultDataModel} for an example implementation.
+    * @private
+      */
+    getRowId : function(rowIndex){
+    	
+    },
+    
+    /**
+     * Empty interface method - Classes which extend AbstractDataModel should implement this method.
+     * See {@link YAHOO.ext.DefaultDataModel} for an example implementation.
+     * @private
+     */
+    getValueAt : function(rowIndex, colIndex){
+    	
+    },
+    
+    /**
+     * Empty interface method - Classes which extend AbstractDataModel should implement this method.
+     * See {@link YAHOO.ext.DefaultDataModel} for an example implementation.
+     * @private
+     */
+    setValueAt : function(value, rowIndex, colIndex){
+    	
+    },
+    
+    isPaged : function(){
+        return false;
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/data/DefaultDataModel.js b/frontend/beta/js/YUI-extensions/data/DefaultDataModel.js
new file mode 100644
index 0000000..57a022a
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/data/DefaultDataModel.js
@@ -0,0 +1,339 @@
+
+/**
+ * @class YAHOO.ext.grid.DefaultDataModel
+ * This is the default implementation of a DataModel used by the Grid. It works 
+ * with multi-dimensional array based data. Using the event system in the base class 
+ * {@link YAHOO.ext.grid.AbstractDataModel}, all updates to this DataModel are automatically
+ * reflected in the user interface.
+ * <br>Usage:<br>
+ * <pre><code>
+ * var myData = [
+	["MSFT","Microsoft Corporation", "314,571.156", "32,187.000", "55000"],
+	["ORCL", "Oracle Corporation", "62,615.266", "9,519.000", "40650"]
+ * ];
+ * var dataModel = new YAHOO.ext.grid.DefaultDataModel(myData);
+ * </code></pre>
+ * @extends YAHOO.ext.grid.AbstractDataModel
+ * @constructor
+ * @param {Array} data 
+*/
+YAHOO.ext.grid.DefaultDataModel = function(data){
+    YAHOO.ext.grid.DefaultDataModel.superclass.constructor.call(this);
+    /**@private*/
+    this.data = data;
+};
+YAHOO.extendX(YAHOO.ext.grid.DefaultDataModel, YAHOO.ext.grid.AbstractDataModel, {
+    /**
+     * Returns the number of rows in the dataset
+     * @return {Number}
+     */
+    getRowCount : function(){
+        return this.data.length;
+    },
+        
+    /**
+     * Returns the ID of the specified row. By default it return the value of the first column. 
+     * Override to provide more advanced ID handling. 
+     * @return {Number}
+     */
+    getRowId : function(rowIndex){
+        return this.data[rowIndex][0];
+    },
+    
+    /**
+     * Returns the column data for the specified row. 
+     * @return {Array}
+     */
+    getRow : function(rowIndex){
+        return this.data[rowIndex];
+    },
+    
+    /**
+     * Returns the column data for the specified rows as a 
+     * multi-dimensional array: rows[3][0] would give you the value of row 4, column 0. 
+     * @param {Array} indexes The row indexes to fetch
+     * @return {Array}
+     */
+    getRows : function(indexes){
+        var data = this.data;
+        var r = [];
+        for(var i = 0; i < indexes.length; i++){
+           r.push(data[indexes[i]]);
+        }
+        return r;
+    },
+    
+    /**
+     * Returns the value at the specified data position
+     * @param {Number} rowIndex
+     * @param {Number} colIndex
+     * @return {Object}
+     */
+    getValueAt : function(rowIndex, colIndex){
+    	return this.data[rowIndex][colIndex];
+    },
+    
+    /**
+     * Sets the specified value at the specified data position
+     * @param {Object} value The new value
+     * @param {Number} rowIndex
+     * @param {Number} colIndex
+     */
+    setValueAt: function(value, rowIndex, colIndex){
+        this.data[rowIndex][colIndex] = value;
+        this.fireCellUpdated(rowIndex, colIndex);
+    },
+    
+    /**
+     * @private
+     * Removes the specified range of rows.
+     * @param {Number} startIndex
+     * @param {<i>Number</i>} endIndex (optional) Defaults to startIndex
+     */
+    removeRows: function(startIndex, endIndex){
+        endIndex = endIndex || startIndex;
+        this.data.splice(startIndex, endIndex-startIndex+1);
+        this.fireRowsDeleted(startIndex, endIndex);
+    },
+    
+    /**
+     * Remove a row.
+     * @param {Number} index
+     */
+    removeRow: function(index){
+        this.data.splice(index, 1);
+        this.fireRowsDeleted(index, index);
+    },
+    
+    /**
+     * @private
+     * Removes all rows.
+     */
+    removeAll: function(){
+    	var count = this.getRowCount();
+    	if(count > 0){
+        	this.removeRows(0, count-1);
+    	}
+    },
+    
+    /**
+     * Query the DataModel rows by the filters defined in spec, for example...
+     * <pre><code>
+     * // column 1 starts with Jack, column 2 filtered by myFcn, column 3 equals 'Fred'
+     * dataModel.filter({1: /^Jack.+/i}, 2: myFcn, 3: 'Fred'});
+     * </code></pre> 
+     * @param {Object} spec The spec is generally an object literal consisting of
+     * column index and filter type. The filter type can be a string/number (exact match),
+     * a regular expression to test using String.search() or a function to call. If it's a function, 
+     * it will be called with the value for the specified column and an array of the all column 
+     * values for that row: yourFcn(value, columnData). If it returns anything other than true, 
+     * the row is not a match. If you have modified Object.prototype this method may fail.
+     * @param {Boolean} returnUnmatched True to return rows which <b>don't</b> match the query instead
+     * of rows that do match
+     * @return {Array} An array of row indexes that match
+     */
+    query: function(spec, returnUnmatched){
+        var d = this.data;
+        var r = [];
+        for(var i = 0; i < d.length; i++){
+            var row = d[i];
+            var isMatch = true;
+            for(var col in spec){
+                //if(typeof spec[col] != 'function'){
+                    if(!isMatch) continue;
+                    var filter = spec[col];
+                    switch(typeof filter){
+                        case 'string':
+                        case 'number':
+                        case 'boolean':
+                          if(row[col] != filter){
+                              isMatch = false;
+                          }
+                        break;
+                        case 'function':
+                          if(!filter(row[col], row)){
+                              isMatch = false;
+                          }
+                        break;
+                        case 'object':
+                           if(filter instanceof RegExp){
+                               if(String(row[col]).search(filter) === -1){
+                                   isMatch = false;
+                               }
+                           }
+                        break;
+                    }
+                //}
+            }
+            if(isMatch && !returnUnmatched){
+                r.push(i);
+            }else if(!isMatch && returnUnmatched){
+                r.push(i);
+            }
+        }
+        return r;
+    },
+    
+    /**
+     * Filter the DataModel rows by the query defined in spec, see {@link #query} for more details 
+     * on the query spec.
+     * @param {Object} query The query spec {@link #query}
+     * @return {Number} The number of rows removed
+     */
+    filter: function(query){
+        var matches = this.query(query, true);
+        var data = this.data;
+        // go thru the data setting matches to deleted
+        // while not disturbing row indexes
+        for(var i = 0; i < matches.length; i++){ 
+            data[matches[i]]._deleted = true;
+        }
+        for(var i = 0; i < data.length; i++){
+            while(data[i] && data[i]._deleted === true){
+                this.removeRow(i);
+            }
+        }
+        return matches.length;
+    },
+    
+    /**
+     * Adds a row to the dataset.
+     * @param {Array} cellValues The array of values for the new row
+     * @return {Number} The index of the added row
+     */
+    addRow: function(cellValues){
+        this.data.push(cellValues);
+        var newIndex = this.data.length-1;
+        this.fireRowsInserted(newIndex, newIndex);
+        this.applySort();
+        return newIndex;
+    },
+    
+    /**
+     * @private
+     * Adds a set of rows.
+     * @param {Array} rowData This should be an array of arrays like the constructor takes
+     */
+    addRows: function(rowData){
+        this.data = this.data.concat(rowData);
+        var firstIndex = this.data.length-rowData.length;
+        this.fireRowsInserted(firstIndex, firstIndex+rowData.length-1);
+        this.applySort();
+    },
+    
+    /**
+     * Inserts a row a the specified location in the dataset.
+     * @param {Number} index The index where the row should be inserted
+     * @param {Array} cellValues The array of values for the new row
+     * @return {Number} The index the row was inserted in
+     */
+    insertRow: function(index, cellValues){
+        this.data.splice(index, 0, cellValues);
+        this.fireRowsInserted(index, index);
+        this.applySort();
+        return index;
+    },
+    
+    /**
+     * @private
+     * Inserts a set of rows.
+     * @param {Number} index The index where the rows should be inserted
+     * @param {Array} rowData This should be an array of arrays like the constructor takes
+     */
+    insertRows: function(index, rowData){
+        /*
+        if(index == this.data.length){ // try these two first since they are faster
+            this.data = this.data.concat(rowData);
+        }else if(index == 0){
+            this.data = rowData.concat(this.data);
+        }else{
+            var newData = this.data.slice(0, index);
+            newData.concat(rowData);
+            newData.concat(this.data.slice(index));
+            this.data = newData;
+        }*/
+        var args = rowData.concat();
+        args.splice(0, 0, index, 0);
+        this.data.splice.apply(this.data, args);
+        this.fireRowsInserted(index, index+rowData.length-1);
+        this.applySort();
+    },
+    
+    /**
+     * Applies the last used sort to the current data.
+     */
+    applySort: function(suppressEvent){
+    	if(typeof this.sortColumn != 'undefined'){
+    		this.sort(this.sortInfo, this.sortColumn, this.sortDir, suppressEvent);
+    	}
+    },
+    
+    /**
+     * Sets the default sort info. Note: this function does not actually apply the sort.
+     * @param {Function/Object} sortInfo A sort comparison function or null to use the default or A object that has a method getSortType(index) that returns a function like 
+     *                                               a grid column model. 
+     * @param {Number} columnIndex The column index to sort by
+     * @param {String} direction The direction of the sort ('DESC' or 'ASC')
+     */
+    setDefaultSort: function(sortInfo, columnIndex, direction){
+        this.sortInfo = sortInfo;
+        this.sortColumn = columnIndex;
+        this.sortDir = direction;
+    },
+    /**
+     * Sorts the data by the specified column - Uses the sortType specified for the column in the passed columnModel.
+     * @param {Function/Object} sortInfo A sort comparison function or null to use the default or A object that has a method getSortType(index) that returns a function like 
+     *                                               a grid column model. 
+     * @param {Number} columnIndex The column index to sort by
+     * @param {String} direction The direction of the sort ('DESC' or 'ASC')
+     */
+    sort: function(sortInfo, columnIndex, direction, suppressEvent){
+        // store these so we can maintain sorting when we load new data
+        this.sortInfo = sortInfo;
+        this.sortColumn = columnIndex;
+        this.sortDir = direction;
+        
+        var dsc = (direction && direction.toUpperCase() == 'DESC');
+        var sortType = null;
+        if(sortInfo != null){
+            if(typeof sortInfo == 'function'){
+                sortType = sortInfo;
+            }else if(typeof sortInfo == 'object'){
+                sortType = sortInfo.getSortType(columnIndex);;
+            }
+        }
+        var fn = function(cells, cells2){
+            var v1 = sortType ? sortType(cells[columnIndex], cells) : cells[columnIndex];
+            var v2 = sortType ? sortType(cells2[columnIndex], cells2) : cells2[columnIndex];
+            if(v1 < v2)
+    			return dsc ? +1 : -1;
+    		if(v1 > v2)
+    			return dsc ? -1 : +1;
+    	    return 0;
+        };
+        this.data.sort(fn);
+        if(!suppressEvent){
+           this.fireRowsSorted(columnIndex, direction);
+        }
+    },
+    
+    /**
+     * Calls passed function with each rows data - if the function returns false it stops.
+     * @param {Function} fn
+     * @param {Object} scope (optional)
+     */ 
+    each: function(fn, scope){
+        var d = this.data;
+        for(var i = 0, len = d.length; i < len; i++){
+            if(fn.call(scope || window, d[i], i) === false) break;
+        }
+    }
+});
+
+/**
+ * Alias to YAHOO.ext.grid.DefaultColumnModel.sortTypes
+ * @static
+ */
+if(YAHOO.ext.grid.DefaultColumnModel){
+    YAHOO.ext.grid.DefaultDataModel.sortTypes = YAHOO.ext.grid.DefaultColumnModel.sortTypes;
+}
diff --git a/frontend/beta/js/YUI-extensions/data/JSONDataModel.js b/frontend/beta/js/YUI-extensions/data/JSONDataModel.js
new file mode 100644
index 0000000..ca48dce
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/data/JSONDataModel.js
@@ -0,0 +1,81 @@
+
+/**
+ * @class YAHOO.ext.grid.JSONDataModel
+ * This is an implementation of a DataModel used by the Grid. It works 
+ * with JSON data.
+ * <br>Example schema:
+ * <pre><code>
+ * var schema = {
+ *     root: 'Results.Result',
+ *     id: 'ASIN',
+ *     fields: ['Author', 'Title', 'Manufacturer', 'ProductGroup']
+ * };
+ * </code></pre>
+ * @extends YAHOO.ext.grid.LoadableDataModel
+ * @constructor
+*/
+YAHOO.ext.grid.JSONDataModel = function(schema){
+    YAHOO.ext.grid.JSONDataModel.superclass.constructor.call(this, YAHOO.ext.grid.LoadableDataModel.JSON);
+    /**@private*/
+    this.schema = schema;
+};
+YAHOO.extendX(YAHOO.ext.grid.JSONDataModel, YAHOO.ext.grid.LoadableDataModel, {
+    /**
+     * Overrides loadData in LoadableDataModel to process JSON data
+     * @param {Object} data The JSON object to load
+     * @param {Function} callback
+     */
+    loadData : function(data, callback, keepExisting){
+    	var idField = this.schema.id;
+    	var fields = this.schema.fields;
+    	try{
+        	if(this.schema.totalProperty){
+                var v = parseInt(eval('data.' + this.schema.totalProperty), 10);
+                if(!isNaN(v)){
+                    this.totalCount = v;
+                }
+            }
+        	var rowData = [];
+    	    var root = eval('data.' + this.schema.root);
+    	    for(var i = 0; i < root.length; i++){
+    			var node = root[i];
+    			var colData = [];
+    			colData.node = node;
+    			colData.id = (typeof node[idField] != 'undefined' && node[idField] !== '' ? node[idField] : String(i));
+    			for(var j = 0; j < fields.length; j++) {
+    			    var val = node[fields[j]];
+    			    if(typeof val == 'undefined'){
+    			        val = '';
+    			    }
+    	            if(this.preprocessors[j]){
+    	                val = this.preprocessors[j](val);
+    	            }
+    	            colData.push(val);
+    	        }
+    	        rowData.push(colData);
+    		}
+    		if(keepExisting !== true){
+    		  this.removeAll();
+    		}
+            this.addRows(rowData);
+        	if(typeof callback == 'function'){
+    	    	callback(this, true);
+    	    }
+          	this.fireLoadEvent();
+    	}catch(e){
+    		this.fireLoadException(e, null);
+    		if(typeof callback == 'function'){
+    	    	callback(this, false);
+    	    }
+    	}
+    },
+    
+    /**
+     * Overrides getRowId in DefaultDataModel to return the ID value of the specified node. 
+     * @param {Number} rowIndex
+     * @return {Number}
+     */
+    getRowId : function(rowIndex){
+        return this.data[rowIndex].id;
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/data/LoadableDataModel.js b/frontend/beta/js/YUI-extensions/data/LoadableDataModel.js
new file mode 100644
index 0000000..07def44
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/data/LoadableDataModel.js
@@ -0,0 +1,330 @@
+/**
+ * @class YAHOO.ext.grid.LoadableDataModel
+ * This class extends DefaultDataModel and adds the core functionality to load data remotely. Generally you will want to use one of it's subclasses.<br><br>
+ * @extends YAHOO.ext.grid.DefaultDataModel
+ * @constructor
+ * @param {String} dataType YAHOO.ext.grid.LoadableDataModel.XML, YAHOO.ext.grid.LoadableDataModel.TEXT or YAHOO.ext.grid.JSON
+*/
+YAHOO.ext.grid.LoadableDataModel = function(dataType){
+    YAHOO.ext.grid.LoadableDataModel.superclass.constructor.call(this, []);
+    
+    /** Fires when a successful load is completed - fireDirect sig: (this)
+     * @type YAHOO.util.CustomEvent 
+     * @deprecated Use addListener instead of accessing directly
+     * @private
+     */
+    this.onLoad = new YAHOO.util.CustomEvent('load');
+    /** Fires when a load fails - fireDirect sig: (this, errorMsg, responseObj)
+     * @type YAHOO.util.CustomEvent 
+     * @deprecated Use addListener instead of accessing directly
+     * @private
+     */
+    this.onLoadException = new YAHOO.util.CustomEvent('loadException');
+    /**
+       * @event load
+       * Fires when new data has successfully been loaded
+       * @param {DataModel} this
+       */
+    this.events['load'] = this.onLoad;
+    /**
+       * @event beforeload
+       * Fires before a load takes place
+       * @param {DataModel} this
+       */
+    this.events['beforeload'] = new YAHOO.util.CustomEvent('beforeload');
+    /**
+       * @event loadexception
+       * Fires when there's an error loading data
+       * @param {DataModel} this
+       * @param {Exception} e The exception object or null
+       * @param {Object} response The Connect response object
+       */
+    this.events['loadexception'] = this.onLoadException;
+    
+    /**@private*/
+    this.dataType = dataType;
+    /**@private*/
+    this.preprocessors = [];
+    /**@private*/
+    this.postprocessors = [];
+    
+    // paging info
+    /** The active page @type Number*/
+    this.loadedPage = 1;
+    /** True to use remote sorting, initPaging automatically sets this to true @type Boolean */
+    this.remoteSort = false;
+    /** The number of records per page @type Number*/
+    this.pageSize = 0;
+    /** The script/page to call to provide paged/sorted data @type String*/
+    this.pageUrl = null;
+    /** An object of key/value pairs to be passed as parameters
+     * when loading pages/sorting @type Object*/
+    this.baseParams = {};
+    /** Maps named params to url parameters - Override to specify your own param names */
+    this.paramMap = {'page':'page', 'pageSize':'pageSize', 'sortColumn':'sortColumn', 'sortDir':'sortDir'};
+    
+};
+YAHOO.extendX(YAHOO.ext.grid.LoadableDataModel, YAHOO.ext.grid.DefaultDataModel, {
+    
+    /** @ignore */
+    setLoadedPage: function(pageNum, userCallback){
+        this.loadedPage = pageNum;
+        if(typeof userCallback == 'function'){
+            userCallback();
+        }
+    },
+    
+    /** Returns true if this model uses paging @return Boolean */
+    isPaged: function(){
+        return this.pageSize > 0;
+    },
+    
+    /** Returns the total number of records available, override if needed @return {Number} */
+    getTotalRowCount: function(){
+        return this.totalCount || this.getRowCount();
+    },
+    
+    /** Returns the number of records per page @return Number */
+    getPageSize: function(){
+        return this.pageSize;
+    },
+    
+    /** Returns the total number of pages available @return Number */
+    getTotalPages: function(){
+        if(this.getPageSize() == 0 || this.getTotalRowCount() == 0){
+            return 1;
+        }
+        return Math.ceil(this.getTotalRowCount()/this.getPageSize());
+    },
+    
+    /** Initializes paging for this model.
+     * @param {String} url
+     * @param {Number} pageSize
+     * @param {Object} baseParams (optional) Object containing key/value pairs to add to all requests
+     */
+    initPaging: function(url, pageSize, baseParams){
+        this.pageUrl = url;
+        this.pageSize = pageSize;
+        this.remoteSort = true;
+        if(baseParams) this.baseParams = baseParams;
+    },
+    
+    /** @ignore */
+    createParams: function(pageNum, sortColumn, sortDir){
+        var params = {}, map = this.paramMap;
+        for(var key in this.baseParams){
+            if(typeof this.baseParams[key] != 'function'){
+                params[key] = this.baseParams[key];
+            }
+        }
+        params[map['page']] = pageNum;
+        params[map['pageSize']] = this.getPageSize();
+        params[map['sortColumn']] = (typeof sortColumn == 'undefined' ? '' : sortColumn);
+        params[map['sortDir']] = sortDir || '';
+        return params;
+    },
+    
+    /**
+     * Loads a page of data.
+     * @param {Number} pageNum Which page to load. The first page is 1.
+     * @param {Function} callback (optional) Optional callback when loading is complete
+     * @param {Boolean} keepExisting (optional) true to keep existing data and append the new data
+     */
+    loadPage: function(pageNum, callback, keepExisting){
+        var sort = this.getSortState();
+        var params = this.createParams(pageNum, sort.column, sort.direction);
+        this.load(this.pageUrl, params, this.setLoadedPage.createDelegate(this, [pageNum, callback]), 
+                   keepExisting ? (pageNum-1) * this.pageSize : null);
+    },
+    
+    /** @ignore */
+    applySort: function(suppressEvent){
+    	if(!this.remoteSort){
+            YAHOO.ext.grid.LoadableDataModel.superclass.applySort.apply(this, arguments);
+        }else if(!suppressEvent){
+            var sort = this.getSortState();
+            if(sort.column){
+               this.fireRowsSorted(sort.column, sort.direction, true);
+            }
+        }
+    },
+    
+    /** @ignore */
+    resetPaging: function(){
+    	this.loadedPage = 1;
+    },
+    
+    /* Overridden sort method to use remote sorting if turned on */
+    sort: function(sortInfo, columnIndex, direction, suppressEvent){
+        if(!this.remoteSort){
+            YAHOO.ext.grid.LoadableDataModel.superclass.sort.apply(this, arguments);
+        }else{
+            this.sortInfo = sortInfo;
+            this.sortColumn = columnIndex;
+            this.sortDir = direction;
+            var params = this.createParams(this.loadedPage, columnIndex, direction);
+            this.load(this.pageUrl, params, this.fireRowsSorted.createDelegate(this, [columnIndex, direction, true]));
+        }
+    },
+    
+    /**
+     * Initiates the loading of the data from the specified URL - Failed load attempts will 
+     * fire the {@link #loadexception} event.
+     * @param {Object/String} url The url from which the data can be loaded
+     * @param {<i>String/Object</i>} params (optional) The parameters to pass as either a url encoded string "param1=1&amp;param2=2" or as an object {param1: 1, param2: 2}
+     * @param {<i>Function</i>} callback (optional) Callback when load is complete - called with signature (this, true for success, false for failure)
+     * @param {<i>Number</i>} insertIndex (optional) if present, loaded data is inserted at the specified index instead of overwriting existing data
+     */
+    load: function(url, params, callback, insertIndex){
+    	this.fireEvent('beforeload', this);
+    	if(params && typeof params != 'string'){ // must be object
+            var buf = [];
+            for(var key in params){
+                if(typeof params[key] != 'function'){
+                    buf.push(encodeURIComponent(key), '=', encodeURIComponent(params[key]), '&');
+                }
+            }
+            delete buf[buf.length-1];
+            params = buf.join('');
+        }
+        var cb = {
+            success: this.processResponse,
+            failure: this.processException,
+            scope: this,
+    		argument: {callback: callback, insertIndex: insertIndex}
+        };
+        var method = params ? 'POST' : 'GET';
+        this.transId = YAHOO.util.Connect.asyncRequest(method, url, cb, params);
+    },
+    
+    /**@private*/
+    processResponse: function(response){
+        var cb = response.argument.callback;
+        var keepExisting = (typeof response.argument.insertIndex == 'number');
+        var insertIndex = response.argument.insertIndex;
+        switch(this.dataType){
+        	case YAHOO.ext.grid.LoadableDataModel.XML:
+        		this.loadData(response.responseXML, cb, keepExisting, insertIndex);
+        	break;
+        	case YAHOO.ext.grid.LoadableDataModel.JSON:
+        		var rtext = response.responseText;
+        		try { // this code is a modified version of Yahoo! UI DataSource JSON parsing
+    		        // Trim leading spaces
+    		        while(rtext.substring(0,1) == " ") {
+    		            rtext = rtext.substring(1, rtext.length);
+    		        }
+    		        // Invalid JSON response
+    		        if(rtext.indexOf("{") < 0) {
+    		            throw "Invalid JSON response";
+    		        }
+    		
+    		        // Empty (but not invalid) JSON response
+    		        if(rtext.indexOf("{}") === 0) {
+    		            this.loadData({}, response.argument.callback);
+    		            return;
+    		        }
+    		
+    		        // Turn the string into an object literal...
+    		        // ...eval is necessary here
+    		        var jsonObjRaw = eval("(" + rtext + ")");
+    		        if(!jsonObjRaw) {
+    		            throw "Error evaling JSON response";
+    		        }
+    				this.loadData(jsonObjRaw, cb, keepExisting, insertIndex);
+    		    } catch(e) {
+    		        this.fireLoadException(e, response);
+    				if(typeof cb == 'function'){
+    			    	cb(this, false);
+    			    }
+    		   	}
+        	break;
+        	case YAHOO.ext.grid.LoadableDataModel.TEXT:
+        		this.loadData(response.responseText, cb, keepExisting, insertIndex);
+        	break;
+        };
+    },
+    
+    /**@private*/
+    processException: function(response){
+        this.fireLoadException(null, response);
+        if(typeof response.argument.callback == 'function'){
+            response.argument.callback(this, false);
+        }
+    },
+    
+    fireLoadException: function(e, responseObj){
+        this.onLoadException.fireDirect(this, e, responseObj);
+    },
+    
+    fireLoadEvent: function(){
+        this.fireEvent('load', this.loadedPage, this.getTotalPages());
+    },
+    
+    /**
+     * Adds a preprocessor function to parse data before it is added to the Model - ie. Date.parse to parse dates.
+     * @param {Number} columnIndex 
+     * @param {Function} fn
+     */
+    addPreprocessor: function(columnIndex, fn){
+        this.preprocessors[columnIndex] = fn;
+    },
+    
+    /**
+     * Gets the preprocessor function for the specified column.
+     * @param {Number} columnIndex
+     * @return {Function}
+     */
+    getPreprocessor: function(columnIndex){
+        return this.preprocessors[columnIndex];
+    },
+    
+    /**
+     * Removes a preprocessor function.
+     * @param {Number} columnIndex 
+     */
+    removePreprocessor: function(columnIndex){
+        this.preprocessors[columnIndex] = null;
+    },
+    
+    /**
+     * Adds a postprocessor function to format data before updating the underlying data source (ie. convert date to string before updating XML document).
+     * @param {Number} columnIndex 
+     * @param {Function} fn
+     */
+    addPostprocessor: function(columnIndex, fn){
+        this.postprocessors[columnIndex] = fn;
+    },
+    
+    /**
+     * Gets the postprocessor function for the specified column.
+     * @param {Number} columnIndex
+     * @return {Function}
+     */
+    getPostprocessor: function(columnIndex){
+        return this.postprocessors[columnIndex];
+    },
+    
+    /**
+     * Removes a postprocessor function.
+     * @param {Number} columnIndex
+     */
+    removePostprocessor: function(columnIndex){
+        this.postprocessors[columnIndex] = null;
+    },
+    /**
+     * Empty interface method - Called to process the data returned by the XHR - Classes which extend LoadableDataModel should implement this method.
+     * See {@link YAHOO.ext.XMLDataModel} for an example implementation.
+     */
+    loadData: function(data, callback, keepExisting, insertIndex){
+    	
+    }
+});
+
+YAHOO.ext.grid.LoadableDataModel.XML = 'xml';
+YAHOO.ext.grid.LoadableDataModel.JSON = 'json';
+YAHOO.ext.grid.LoadableDataModel.TEXT = 'text';
+
+
+
+
+
diff --git a/frontend/beta/js/YUI-extensions/data/Tree.js b/frontend/beta/js/YUI-extensions/data/Tree.js
new file mode 100644
index 0000000..afa5b20
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/data/Tree.js
@@ -0,0 +1,412 @@
+YAHOO.namespace('ext.data');
+
+/**
+ * @class YAHOO.ext.data.Tree
+ * @extends YAHOO.ext.util.Observable
+ * The class represents a tree data structure and bubbles all the events for it's nodes. The nodes
+ * in the tree have most standard DOM functionality.
+ * @constructor
+ * @param {Node} root (optional) The root node 
+ */
+YAHOO.ext.data.Tree = function(root){
+   this.nodeHash = {};
+   this.root = null;
+   if(root){
+       this.setRootNode(root);
+   }
+   this.events = {
+       'append' : true,
+       'remove' : true,
+       'move' : true,
+       'insert' : true,
+       'beforeappend' : true,
+       'beforeremove' : true,
+       'beforemove' : true,
+       'beforeinsert' : true
+   };
+};
+
+YAHOO.extendX(YAHOO.ext.data.Tree, YAHOO.ext.util.Observable, {
+    pathSeparator: '/',
+    
+    getRootNode : function(){
+        return this.root;
+    },
+    
+    setRootNode : function(node){
+        this.root = node;
+        node.ownerTree = this;
+        node.isRoot = true;
+        return node;
+    },
+    
+    getNodeById : function(id){
+        return this.nodeHash[id];  
+    },
+    
+    registerNode : function(node){
+        this.nodeHash[node.id] = node;
+    },
+    
+    unregisterNode : function(node){
+        delete this.nodeHash[node.id];
+    },
+    
+    toString : function(){
+        return '[Tree'+(this.id?' '+this.id:'')+']';
+    }  
+});
+
+/**
+ * @class YAHOO.ext.tree.Node
+ * @extends YAHOO.ext.util.Observable
+ * @cfg {String} text The text for this node
+ * @cfg {String} id The id for this node
+ * @constructor
+ * @param {Object} attributes The attributes/config for the node 
+ */
+YAHOO.ext.data.Node = function(attributes){
+    this.attributes = attributes || {};
+    this.leaf = this.attributes.leaf;
+    this.id = this.attributes.id;
+    if(!this.id){
+        this.id = YAHOO.util.Dom.generateId(null, 'ynode-');
+        this.attributes.id = this.id;
+    }
+    
+    this.childNodes = [];
+    if(!this.childNodes.indexOf){ // indexOf is a must
+        this.childNodes.indexOf = function(o){
+            for(var i = 0, len = this.length; i < len; i++){
+                if(this[i] == o) return i;
+            }
+            return -1;
+        };
+    }
+    this.parentNode = null;
+    this.firstChild = null;
+    this.lastChild = null;
+    this.previousSibling = null;
+    this.nextSibling = null;
+    
+    this.events = {
+       'append' : true,
+       'remove' : true,
+       'move' : true,
+       'insert' : true,
+       'beforeappend' : true,
+       'beforeremove' : true,
+       'beforemove' : true,
+       'beforeinsert' : true
+   };
+};
+
+YAHOO.extendX(YAHOO.ext.data.Node, YAHOO.ext.util.Observable, {
+    fireEvent : function(evtName){
+        // first do standard event for this node
+        if(YAHOO.ext.data.Node.superclass.fireEvent.apply(this, arguments) === false){
+            return false;
+        }
+        // then bubble it up to the tree if the event wasn't cancelled
+        if(this.ownerTree){
+            if(this.ownerTree.fireEvent.apply(this.ownerTree, arguments) === false){
+                return false;
+            }
+        }
+        return true;
+    },
+    
+    isLeaf : function(){
+        return this.leaf === true;  
+    },
+    
+    setFirstChild : function(node){
+        this.firstChild = node;  
+    },
+    
+    setLastChild : function(node){
+        this.lastChild = node;
+    },
+    
+    isLast : function(){
+       return (!this.parentNode ? true : this.parentNode.lastChild == this);   
+    },
+    
+    isFirst : function(){
+       return (!this.parentNode ? true : this.parentNode.firstChild == this);   
+    },
+    
+    hasChildNodes : function(){
+        return !this.isLeaf() && this.childNodes.length > 0;
+    },
+    
+    appendChild : function(node){
+        var multi = false;
+        if(node instanceof Array){
+            multi = node;
+        }else if(arguments.length > 1){
+            multi = arguments;
+        }
+        // if passed an array or multiple args do them one by one
+        if(multi){
+            for(var i = 0, len = multi.length; i < len; i++) {
+            	this.appendChild(multi[i]);
+            }
+        }else{
+            if(this.fireEvent('beforeappend', this.ownerTree, this, node) === false){
+                return false;
+            }
+            var index = this.childNodes.length;
+            var oldParent = node.parentNode;
+            // it's a move, make sure we move it cleanly
+            if(oldParent){
+                if(node.fireEvent('beforemove', node.getOwnerTree(), node, oldParent, this, index) === false){
+                    return false;
+                }
+                oldParent.removeChild(node);
+            }
+            var index = this.childNodes.length;
+            if(index == 0){
+                this.setFirstChild(node);
+            }
+            this.childNodes.push(node);
+            node.parentNode = this;
+            var ps = this.childNodes[index-1];
+            if(ps){
+                node.previousSibling = ps;
+                ps.nextSibling = node;
+            }
+            this.setLastChild(node);
+            node.setOwnerTree(this.getOwnerTree());
+            this.fireEvent('append', this.ownerTree, this, node, index);
+            if(oldParent){
+                node.fireEvent('move', this.ownerTree, node, oldParent, this, index);
+            }
+            return node;
+        }
+    },
+    
+    removeChild : function(node){
+        var index = this.childNodes.indexOf(node);
+        if(index == -1){
+            return false;
+        }
+        if(this.fireEvent('beforeremove', this.ownerTree, this, node) === false){
+            return false;
+        }
+            
+        // remove it from childNodes collection
+        this.childNodes.splice(index, 1);
+        
+        // update siblings
+        if(node.previousSibling){
+            node.previousSibling.nextSibling = node.nextSibling;
+        }
+        if(node.nextSibling){
+            node.nextSibling.previousSibling = node.previousSibling;
+        }
+        
+        // update child refs
+        if(this.firstChild == node){
+            this.setFirstChild(node.nextSibling);
+        }
+        if(this.lastChild == node){
+            this.setLastChild(node.previousSibling);
+        }
+        
+        node.setOwnerTree(null);
+        // clear any references from the node
+        node.parentNode = null;
+        node.previousSibling = null;
+        node.nextSibling = null;
+        this.fireEvent('remove', this.ownerTree, this, node);
+        return node;
+    },
+    
+    insertBefore : function(node, refNode){
+        if(!refNode){ // like standard Dom, refNode can be null for append
+            return this.appendChild(node);
+        }
+        // nothing to do
+        if(node == refNode){
+            return false;
+        }
+        
+        if(this.fireEvent('beforeinsert', this.ownerTree, this, node, refNode) === false){
+            return false;
+        }
+        var index = this.childNodes.indexOf(refNode);
+        var oldParent = node.parentNode;
+        var refIndex = index;
+        
+        // when moving internally, indexes will change after remove
+        if(oldParent == this && this.childNodes.indexOf(node) < index){
+            refIndex--;
+        }
+        
+        // it's a move, make sure we move it cleanly
+        if(oldParent){
+            if(node.fireEvent('beforemove', node.getOwnerTree(), node, oldParent, this, index, refNode) === false){
+                return false;
+            }
+            oldParent.removeChild(node);
+        }
+        if(refIndex == 0){
+            this.setFirstChild(node);
+        }
+        this.childNodes.splice(refIndex, 0, node);
+        node.parentNode = this;
+        var ps = this.childNodes[refIndex-1];
+        if(ps){
+            node.previousSibling = ps;
+            ps.nextSibling = node;
+        }
+        node.nextSibling = refNode;
+        node.setOwnerTree(this.getOwnerTree());
+        this.fireEvent('insert', this.ownerTree, this, node, refNode);
+        if(oldParent){
+            node.fireEvent('move', this.ownerTree, node, oldParent, this, refIndex, refNode);
+        }
+        return node;
+    },
+    
+    item : function(index){
+        return this.childNodes[index];  
+    },
+    
+    replaceChild : function(newChild, oldChild){
+        this.insertBefore(newChild, oldChild);
+        this.removeChild(oldChild);
+        return oldChild;
+    },
+    
+    indexOf : function(child){
+        return this.childNodes.indexOf(child);  
+    },
+    
+    getOwnerTree : function(){
+        // if it doesn't have one, look for one
+        if(!this.ownerTree){
+            var p = this;
+            while(p){
+                if(p.ownerTree){
+                    this.ownerTree = p.ownerTree;
+                    break;
+                }
+                p = p.parentNode;
+            }
+        }
+        return this.ownerTree;
+    },
+    
+    setOwnerTree : function(tree){
+        // if it's move, we need to update everyone
+        if(tree != this.ownerTree){
+            if(this.ownerTree){
+                this.ownerTree.unregisterNode(this);
+            }
+            this.ownerTree = tree;
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+            	cs[i].setOwnerTree(tree);
+            }
+            if(tree){
+                tree.registerNode(this);
+            }
+        }
+    },
+    
+    getPath : function(attr){
+        attr = attr || 'id';
+        var p = this.parentNode;
+        var b = [this.attributes[attr]];
+        while(p){
+            b.unshift(p.attributes[attr]);
+            p = p.parentNode;
+        }
+        var sep = this.getOwnerTree().pathSeparator;
+        return sep + b.join(sep);
+    },
+    
+    bubble : function(fn, scope, args){
+        var p = this;
+        while(p){
+            if(fn.call(scope || p, args || p) === false){
+                break;
+            }
+            p = p.parentNode;
+        }
+    },
+    
+    cascade : function(fn, scope, args){
+        if(fn.call(scope || this, args || this) !== false){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+            	cs[i].cascade(fn, scope, args);
+            }
+        }
+    },
+    
+    eachChild : function(fn, scope, args){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+        	if(fn.call(scope || this, args || cs[i]) === false){
+        	    break;
+        	}
+        }
+    },
+    
+    findChild : function(attribute, value){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+        	if(cs[i].attributes[attribute] == value){
+        	    return cs[i];
+        	}
+        }
+        return null;
+    },
+    
+    /**
+     * Sorts this nodes children using the supplied sort function
+     * @param {Function} fn
+     * @param {Object} scope
+     */
+    sort : function(fn, scope){
+        var cs = this.childNodes;
+        var len = cs.length;
+        if(len > 0){
+            var sortFn = scope ? function(){fn.apply(scope, arguments);} : fn;
+            cs.sort(sortFn);
+            for(var i = 0; i < len; i++){
+                var n = cs[i];
+                n.previousSibling = cs[i-1];
+                n.nextSibling = cs[i+1];
+                if(i == 0){
+                    this.setFirstChild(n);
+                }
+                if(i == len-1){
+                    this.setLastChild(n);
+                }
+            }
+        }
+    },
+    
+    contains : function(node){
+        return node.isAncestor(this);
+    },
+    
+    isAncestor : function(node){
+        var p = this.parentNode;
+        while(p){
+            if(p == node){
+                return true;
+            }
+            p = p.parentNode;
+        }
+        return false;
+    },
+    
+    toString : function(){
+        return '[Node'+(this.id?' '+this.id:'')+']';
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/data/XMLDataModel.js b/frontend/beta/js/YUI-extensions/data/XMLDataModel.js
new file mode 100644
index 0000000..e312a9e
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/data/XMLDataModel.js
@@ -0,0 +1,274 @@
+/**
+ * @class YAHOO.ext.grid.XMLDataModel
+ * This is an implementation of a DataModel used by the Grid. It works 
+ * with XML data. 
+ * <br>Example schema from Amazon search:
+ * <pre><code>
+ * var schema = {
+ *     tagName: 'Item',
+ *     id: 'ASIN',
+ *     fields: ['Author', 'Title', 'Manufacturer', 'ProductGroup']
+ * };
+ * </code></pre>
+ * @extends YAHOO.ext.grid.LoadableDataModel
+ * @constructor
+ * @param {Object} schema The schema to use
+ * @param {XMLDocument} xml An XML document to load immediately
+*/
+YAHOO.ext.grid.XMLDataModel = function(schema, xml){
+    YAHOO.ext.grid.XMLDataModel.superclass.constructor.call(this, YAHOO.ext.grid.LoadableDataModel.XML);
+    /**@private*/
+    this.schema = schema;
+    this.xml = xml;
+    if(xml){
+        this.loadData(xml);
+    }
+    this.idSeed = 0;
+};
+YAHOO.extendX(YAHOO.ext.grid.XMLDataModel, YAHOO.ext.grid.LoadableDataModel, {
+    
+    getDocument: function(){
+       return this.xml;    
+    },
+    
+    /**
+     * Overrides loadData in LoadableDataModel to process XML
+     * @param {XMLDocument} doc The document to load
+     * @param {<i>Function</i>} callback (optional) callback to call when loading is complete
+     * @param {<i>Boolean</i>} keepExisting (optional) true to keep existing data
+     * @param {<i>Number</i>} insertIndex (optional) if present, loaded data is inserted at the specified index instead of overwriting existing data
+     */
+    loadData: function(doc, callback, keepExisting, insertIndex){
+    	this.xml = doc;
+    	var idField = this.schema.id;
+    	var fields = this.schema.fields;
+    	if(this.schema.totalTag){
+    	    this.totalCount = null;
+    	    var totalNode = doc.getElementsByTagName(this.schema.totalTag);
+    	    if(totalNode && totalNode.item(0) && totalNode.item(0).firstChild) {
+                var v = parseInt(totalNode.item(0).firstChild.nodeValue, 10);
+                if(!isNaN(v)){
+                    this.totalCount = v;
+                }
+        	}
+    	}
+    	var rowData = [];
+    	var nodes = doc.getElementsByTagName(this.schema.tagName);
+        if(nodes && nodes.length > 0) {
+    	    for(var i = 0; i < nodes.length; i++) {
+    	        var node = nodes.item(i);
+    	        var colData = [];
+    	        colData.node = node;
+    	        colData.id = this.getNamedValue(node, idField, String(++this.idSeed));
+    	        for(var j = 0; j < fields.length; j++) {
+    	            var val = this.getNamedValue(node, fields[j], "");
+    	            if(this.preprocessors[j]){
+    	                val = this.preprocessors[j](val);
+    	            }
+    	            colData.push(val);
+    	        }
+    	        rowData.push(colData);
+    	    }
+        }
+        if(keepExisting !== true){
+           YAHOO.ext.grid.XMLDataModel.superclass.removeAll.call(this);
+    	}
+    	if(typeof insertIndex != 'number'){
+    	    insertIndex = this.getRowCount();
+    	}
+        YAHOO.ext.grid.XMLDataModel.superclass.insertRows.call(this, insertIndex, rowData);
+        if(typeof callback == 'function'){
+        	callback(this, true);
+        }
+        this.fireLoadEvent();
+    },
+    
+    /**
+     * Adds a row to this DataModel and syncs the XML document
+     * @param {String} id The id of the row, if null the next row index is used
+     * @param {Array} cellValues The cell values for this row
+     * @return {Number} The index of the new row (if the model is sorted this index may not be accurate)
+     */
+    addRow: function(id, cellValues){
+        var node = this.createNode(this.xml, id, cellValues);
+        cellValues.id = id || ++this.idSeed;
+        cellValues.node = node;
+        return YAHOO.ext.grid.XMLDataModel.superclass.addRow.call(this, cellValues);
+    },
+    
+    /**
+     * Inserts a row into this DataModel and syncs the XML document
+     * @param {Number} index The index to insert the row
+     * @param {String} id The id of the row, if null the next row index is used
+     * @param {Array} cellValues The cell values for this row
+     * @return {Number} The index of the new row (if the model is sorted this index may not be accurate)
+     */
+    insertRow: function(index, id, cellValues){
+        var node = this.createNode(this.xml, id, cellValues);
+        cellValues.id = id || ++this.idSeed;
+        cellValues.node = node;
+        return YAHOO.ext.grid.XMLDataModel.superclass.insertRow.call(this, index, cellValues);
+    },
+    
+    /**
+     * Removes the row from DataModel and syncs the XML document
+     * @param {Number} index The index of the row to remove
+     */
+    removeRow: function(index){
+        var node = this.data[index].node;
+        node.parentNode.removeChild(node);
+        YAHOO.ext.grid.XMLDataModel.superclass.removeRow.call(this, index, index);
+    },
+    
+    getNode: function(rowIndex){
+        return this.data[rowIndex].node;
+    },
+    
+    /**
+     * Override this method to define your own node creation routine for when new rows are added.
+     * By default this method clones the first node and sets the column values in the newly cloned node.
+     * In many instances this will not work and you will have to create the node manually.
+     * @param {XMLDocument} xmlDoc The xml document being used by this model
+     * @param {String/Number} id The row id
+     * @param {Array} colData The column data for the new node
+     * @return {XMLNode} The created node
+     */
+    createNode: function(xmlDoc, id, colData){
+        var template = this.data[0].node;
+        var newNode = template.cloneNode(true);
+        var fields = this.schema.fields;
+        for(var i = 0, len = fields.length; i < len; i++){
+            var nodeValue = colData[i];
+            if(this.postprocessors[i]){
+                nodeValue = this.postprocessors[i](nodeValue);
+            }
+            this.setNamedValue(newNode, fields[i], nodeValue);
+        }
+        if(id){
+            this.setNamedValue(newNode, this.schema.idField, id);
+        }
+        template.parentNode.appendChild(newNode);
+        return newNode;
+    },
+    
+    /**
+     * @private
+     * Convenience function looks for value in attributes, then in children tags - also 
+     * normalizes namespace matches (ie matches ns:tag, FireFox matches tag and not ns:tag).
+     */
+    getNamedValue: function(node, name, defaultValue){
+    	if(!node || !name){
+    		return defaultValue;
+    	}
+    	var nodeValue = defaultValue;
+        var attrNode = node.attributes.getNamedItem(name);
+        if(attrNode) {
+        	nodeValue = attrNode.value;
+        } else {
+            var childNode = node.getElementsByTagName(name);
+            if(childNode && childNode.item(0) && childNode.item(0).firstChild) {
+                nodeValue = childNode.item(0).firstChild.nodeValue;
+        	}else{
+        	    // try to strip namespace for FireFox
+        	    var index = name.indexOf(':');
+        	    if(index > 0){
+        	        return this.getNamedValue(node, name.substr(index+1), defaultValue);
+        	    }
+        	}
+        }
+        return nodeValue;
+    },
+    
+    /**
+     * @private
+     * Convenience function set a value in the underlying xml node.
+     */
+    setNamedValue: function(node, name, value){
+    	if(!node || !name){
+    		return;
+    	}
+    	var attrNode = node.attributes.getNamedItem(name);
+        if(attrNode) {
+        	attrNode.value = value;
+        	return;
+        }
+        var childNode = node.getElementsByTagName(name);
+        if(childNode && childNode.item(0) && childNode.item(0).firstChild) {
+            childNode.item(0).firstChild.nodeValue = value;
+        }else{
+    	    // try to strip namespace for FireFox
+    	    var index = name.indexOf(':');
+    	    if(index > 0){
+    	        this.setNamedValue(node, name.substr(index+1), value);
+    	    }
+    	}
+    },
+    
+    /**
+     * Overrides DefaultDataModel.setValueAt to update the underlying XML Document
+     * @param {Object} value The new value
+     * @param {Number} rowIndex
+     * @param {Number} colIndex
+     */
+    setValueAt: function(value, rowIndex, colIndex){
+        var node = this.data[rowIndex].node;
+        if(node){
+            var nodeValue = value;
+            if(this.postprocessors[colIndex]){
+                nodeValue = this.postprocessors[colIndex](value);
+            }
+            this.setNamedValue(node, this.schema.fields[colIndex], nodeValue);
+        }
+        YAHOO.ext.grid.XMLDataModel.superclass.setValueAt.call(this, value, rowIndex, colIndex);
+    },
+    
+    /**
+     * Overrides getRowId in DefaultDataModel to return the ID value of the specified node. 
+     * @param {Number} rowIndex
+     * @return {Number}
+     */
+    getRowId: function(rowIndex){
+        return this.data[rowIndex].id;
+    },
+    
+    addRows : function(rowData){   
+        for(var j = 0, len = rowData.length; j < len; j++){
+           var cellValues = rowData[j];
+           var id = ++this.idSeed; 
+           var node = this.createNode(this.xml, id, cellValues);       
+           cellValues.node=node;
+           cellValues.id = cellValues.id || id;
+           YAHOO.ext.grid.XMLDataModel.superclass.addRow.call(this,cellValues);
+        }
+    },   
+
+   insertRows : function(index, rowData){
+       // copy original array so it is not reversed 
+       rowData = rowData.slice(0).reverse();
+       for(var j = 0, len = rowData.length; j < len; j++){
+          var cellValues = rowData[j];
+          var id = ++this.idSeed; 
+          var node = this.createNode(this.xml, id, cellValues);
+          cellValues.id = cellValues.id || id;
+          cellValues.node = node;
+          YAHOO.ext.grid.XMLDataModel.superclass.insertRow.call(this, index, cellValues);
+       }
+   }
+});
+
+YAHOO.ext.grid.XMLQueryDataModel = function(){
+   YAHOO.ext.grid.XMLQueryDataModel.superclass.constructor.apply(this, arguments);
+};
+YAHOO.extendX(YAHOO.ext.grid.XMLQueryDataModel, YAHOO.ext.grid.XMLDataModel, {
+    getNamedValue: function(node, name, defaultValue){
+    	if(!node || !name){
+    		return defaultValue;
+    	}
+    	var nodeValue = defaultValue;
+    	var childNode = cssQuery(name, node);
+    	if(childNode && childNode[0]) {
+            nodeValue = childNode[0].firstChild.nodeValue;
+    	}
+        return nodeValue;
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/dd/DragSource.js b/frontend/beta/js/YUI-extensions/dd/DragSource.js
new file mode 100644
index 0000000..efee2d6
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/dd/DragSource.js
@@ -0,0 +1,218 @@
+// kill drag drop dependency
+if(YAHOO.util.DragDrop){
+
+YAHOO.ext.dd.DragSource = function(el, config){
+    this.el = getEl(el);
+    this.dragData = {};
+    
+    YAHOO.ext.util.Config.apply(this, config);
+    
+    if(!this.proxy){
+        this.proxy = new YAHOO.ext.dd.StatusProxy();
+    }
+    this.el.on('mouseup', this.handleMouseUp);
+    YAHOO.ext.dd.DragSource.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
+          {dragElId : this.proxy.id, resizeFrame: false, isTarget: false, scroll: this.scroll === true});
+    
+    this.dragging = false;
+};
+
+YAHOO.extendX(YAHOO.ext.dd.DragSource, YAHOO.util.DDProxy, {
+    dropAllowed : 'ydd-drop-ok',
+    dropNotAllowed : 'ydd-drop-nodrop',
+    
+    getDragData : function(e){
+        return this.dragData;
+    },
+    
+    onDragEnter : function(e, id){
+        var target = YAHOO.util.DragDropMgr.getDDById(id);
+        this.cachedTarget = target;
+        if(this.beforeDragEnter(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                var status = target.notifyEnter(this, e, this.dragData);
+                this.proxy.setStatus(status);
+            }else{
+                this.proxy.setStatus(this.dropAllowed);
+            }
+            
+            if(this.afterDragEnter){
+                this.afterDragEnter(target, e, id);
+            }
+        }
+    },
+    
+    beforeDragEnter : function(target, e, id){
+        return true;
+    },
+    
+    alignElWithMouse: function() {
+        YAHOO.ext.dd.DragSource.superclass.alignElWithMouse.apply(this, arguments);
+        this.proxy.sync();
+    },
+    
+    onDragOver : function(e, id){
+        var target = this.cachedTarget || YAHOO.util.DragDropMgr.getDDById(id);
+        if(this.beforeDragOver(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                var status = target.notifyOver(this, e, this.dragData);
+                this.proxy.setStatus(status);
+            }
+                        
+            if(this.afterDragOver){
+                this.afterDragOver(target, e, id);
+            }
+        }
+    },
+    
+    beforeDragOver : function(target, e, id){
+        return true;
+    },
+    
+    onDragOut : function(e, id){
+        var target = this.cachedTarget || YAHOO.util.DragDropMgr.getDDById(id);
+        if(this.beforeDragOut(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                target.notifyOut(this, e, this.dragData);
+            }
+            this.proxy.reset();
+            if(this.afterDragOut){
+                this.afterDragOut(target, e, id);
+            }
+        }
+        this.cachedTarget = null;
+    },
+    
+    beforeDragOut : function(target, e, id){
+        return true;
+    },
+    
+    
+    onDragDrop : function(e, id){
+        var target = this.cachedTarget || YAHOO.util.DragDropMgr.getDDById(id);
+        if(this.beforeDragDrop(target, e, id) !== false){
+            if(target.isNotifyTarget){
+                if(target.notifyDrop(this, e, this.dragData)){ // valid drop?
+                    this.onValidDrop(target, e, id);
+                }else{
+                    this.onInvalidDrop(target, e, id);
+                }
+            }else{
+                this.onValidDrop(target, e, id);
+            }
+            
+            if(this.afterDragDrop){
+                this.afterDragDrop(target, e, id);
+            }
+        }
+    },
+    
+    beforeDragDrop : function(target, e, id){
+        return true;
+    },
+    
+    onValidDrop : function(target, e, id){
+        this.hideProxy();
+    },
+    
+    getRepairXY : function(e, data){
+        return this.el.getXY();  
+    },
+    
+    onInvalidDrop : function(target, e, id){
+        this.beforeInvalidDrop(target, e, id);
+        if(this.cachedTarget){
+            if(this.cachedTarget.isNotifyTarget){
+                this.cachedTarget.notifyOut(this, e, this.dragData);
+            }
+            this.cacheTarget = null;
+        }
+        this.proxy.repair(this.getRepairXY(e, this.dragData), this.afterRepair, this);
+        if(this.afterInvalidDrop){
+            this.afterInvalidDrop(e, id);
+        }
+    },
+    
+    afterRepair : function(){
+        this.el.highlight(this.hlColor || 'c3daf9');
+        this.dragging = false;
+    },
+
+    beforeInvalidDrop : function(target, e, id){
+        return true;
+    },
+    
+    handleMouseDown : function(e){
+        if(this.dragging) {
+            return;
+        }
+        if(YAHOO.ext.QuickTips){
+            YAHOO.ext.QuickTips.disable();
+        }
+        var data = this.getDragData(e);
+        if(data && this.onBeforeDrag(data, e) !== false){
+            this.dragData = data;
+            this.proxy.stop();
+            YAHOO.ext.dd.DragSource.superclass.handleMouseDown.apply(this, arguments);
+        } 
+    },
+    
+    handleMouseUp : function(e){
+        if(YAHOO.ext.QuickTips){
+            YAHOO.ext.QuickTips.enable();
+        }
+    },
+    
+    onBeforeDrag : function(data, e){
+        return true;
+    },
+    
+    startDrag : function(e){
+        this.proxy.reset();
+        this.dragging = true;
+        this.proxy.update('');
+        this.onInitDrag(e);
+        this.proxy.show();
+    },
+    
+    onInitDrag : function(e){
+        var clone = this.el.dom.cloneNode(true);
+        clone.id = YAHOO.util.Dom.generateId(); // prevent duplicate ids
+        this.proxy.update(clone);
+        return true;
+    },
+       
+    
+    getProxy : function(){
+        return this.proxy;  
+    },
+    
+    hideProxy : function(){
+        this.proxy.hide();  
+        this.proxy.reset(true);
+        this.dragging = false;
+    },
+    
+    triggerCacheRefresh : function(){
+        YAHOO.util.DDM.refreshCache(this.groups);
+    },
+    
+    // override to prevent hiding
+    b4EndDrag: function(e) {
+    },
+         
+    // override to prevent moving
+    endDrag : function(e){
+        this.onEndDrag(this.dragData, e);
+    },
+    
+    onEndDrag : function(data, e){
+          
+    },
+    
+    // pin to cursor
+    autoOffset : function(x, y) {
+        this.setDelta(-12, -20);
+    }    
+});
+}
diff --git a/frontend/beta/js/YUI-extensions/dd/DragZone.js b/frontend/beta/js/YUI-extensions/dd/DragZone.js
new file mode 100644
index 0000000..7a6edb6
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/dd/DragZone.js
@@ -0,0 +1,64 @@
+// kill drag drop dependency
+if(YAHOO.util.DragDrop){
+/**
+ * @class YAHOO.ext.dd.DragZone
+ * @extends YAHOO.ext.dd.Source
+ * This class provides a container DD instance that proxies for multiple child node sources.<br />
+ * By default, this class requires that draggable child nodes are registered with
+ * {@link YAHOO.ext.dd.Registry}.
+ * @cfg {Boolean} containerScroll True to register this container with the Scrollmanager 
+ * for auto scrolling during drag operations.
+ * @constructor
+ * @param {String/HTMLElement/Element} el The container element
+ * @param {Object} config
+ */
+YAHOO.ext.dd.DragZone = function(el, config){
+    YAHOO.ext.dd.DragZone.superclass.constructor.call(this, el, config);
+    if(this.containerScroll){
+        YAHOO.ext.dd.ScrollManager.register(this.el);
+    }
+};
+
+YAHOO.extendX(YAHOO.ext.dd.DragZone, YAHOO.ext.dd.DragSource, {
+    /**
+     * Called when a mousedown occurs in this container. Looks in {@link YAHOO.ext.dd.Registry}
+     * for a valid target to drag based on the mouse down. Override this method
+     * to provide your own lookup logic (e.g. finding a child by class name). Make sure your returned
+     * object has a "ddel" attribute (with an HTML Element) for other functions to work.
+     * @param {EventObject} e The mouse down event
+     * @return {Object} The dragData
+     */
+    getDragData : function(e){
+        return YAHOO.ext.dd.Registry.getHandleFromEvent(e);
+    },
+    
+    /**
+     * Called once drag threshold has been reached to initialize the proxy element. By default, it clones the
+     * this.dragData.ddel
+     * @param {EventObject} e The current event
+     * @return {Boolean} true to continue the drag, false to cancel
+     */
+    onInitDrag : function(e){
+        this.proxy.update(this.dragData.ddel.cloneNode(true));
+        return true;
+    },
+    
+    /**
+     * Called after a repair of an invalid drop. By default, highlights this.dragData.ddel 
+     */
+    afterRepair : function(){
+        YAHOO.ext.Element.fly(this.dragData.ddel).highlight(this.hlColor || 'c3daf9');
+        this.dragging = false;
+    },
+
+    /**
+     * Called before a repair of an invalid drop to get the XY to animate to. By default returns
+     * the XY of this.dragData.ddel
+     * @param {EventObject} e The mouse up event
+     * @return {Array} The xy location (e.g. [100, 200])
+     */
+    getRepairXY : function(e){
+        return YAHOO.ext.Element.fly(this.dragData.ddel).getXY();  
+    }
+});
+}
diff --git a/frontend/beta/js/YUI-extensions/dd/DropTarget.js b/frontend/beta/js/YUI-extensions/dd/DropTarget.js
new file mode 100644
index 0000000..30e59cd
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/dd/DropTarget.js
@@ -0,0 +1,45 @@
+// kill drag drop dependency
+if(YAHOO.util.DragDrop){
+
+YAHOO.ext.dd.DropTarget = function(el, config){
+    this.el = getEl(el);
+    
+    YAHOO.ext.util.Config.apply(this, config);
+    
+    if(this.containerScroll){
+        YAHOO.ext.dd.ScrollManager.register(this.el);
+    }
+    
+    YAHOO.ext.dd.DropTarget.superclass.constructor.call(this, this.el.dom, this.ddGroup || this.group, 
+          {isTarget: true});
+
+};
+
+YAHOO.extendX(YAHOO.ext.dd.DropTarget, YAHOO.util.DDTarget, {
+    isTarget : true,
+    isNotifyTarget : true,
+    dropAllowed : 'ydd-drop-ok',
+    dropNotAllowed : 'ydd-drop-nodrop',
+    
+    notifyEnter : function(dd, e, data){
+        if(this.overClass){
+            this.el.addClass(this.overClass);
+        }
+        return this.dropAllowed;
+    },
+    
+    notifyOver : function(dd, e, data){
+        return this.dropAllowed;
+    },
+    
+    notifyOut : function(dd, e, data){
+        if(this.overClass){
+            this.el.removeClass(this.overClass);
+        }
+    },
+    
+    notifyDrop : function(dd, e, data){
+        return false;
+    }
+});
+}
diff --git a/frontend/beta/js/YUI-extensions/dd/DropZone.js b/frontend/beta/js/YUI-extensions/dd/DropZone.js
new file mode 100644
index 0000000..ce446fb
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/dd/DropZone.js
@@ -0,0 +1,81 @@
+// kill drag drop dependency
+if(YAHOO.util.DragDrop){
+YAHOO.ext.dd.DropZone = function(el, config){
+    YAHOO.ext.dd.DropZone.superclass.constructor.call(this, el, config);
+};
+
+YAHOO.extendX(YAHOO.ext.dd.DropZone, YAHOO.ext.dd.DropTarget, {
+    getTargetFromEvent : function(e){
+        return YAHOO.ext.dd.Registry.getTargetFromEvent(e);
+    },
+    
+    onNodeEnter : function(n, dd, e, data){
+        
+    },
+    
+    onNodeOver : function(n, dd, e, data){
+        return this.dropAllowed;
+    },
+    
+    onNodeOut : function(n, dd, e, data){
+        
+    },
+    
+    onNodeDrop : function(n, dd, e, data){
+        return false;
+    },
+    
+    onContainerOver : function(n, dd, e, data){
+        return this.dropNotAllowed;
+    },
+    
+    onContainerDrop : function(n, dd, e, data){
+        return false;
+    },
+    
+    notifyEnter : function(dd, e, data){
+        return this.dropNotAllowed;
+    },
+    
+    notifyOver : function(dd, e, data){
+        var n = this.getTargetFromEvent(e);
+        if(!n){ // not over valid drop target
+            if(this.lastOverNode){
+                this.onNodeOut(this.lastOverNode, dd, e, data);
+                this.lastOverNode = null;
+            }
+            return this.onContainerOver(dd, e, data);
+        }
+        if(this.lastOverNode != n){
+            if(this.lastOverNode){
+                this.onNodeOut(this.lastOverNode, dd, e, data);
+            }
+            this.onNodeEnter(n, dd, e, data);
+            this.lastOverNode = n;
+        }
+        return this.onNodeOver(n, dd, e, data);
+    },
+    
+    notifyOut : function(dd, e, data){
+        if(this.lastOverNode){
+            this.onNodeOut(this.lastOverNode, dd, e, data);
+            this.lastOverNode = null;
+        }
+    },
+    
+    notifyDrop : function(dd, e, data){
+        if(this.lastOverNode){
+            this.onNodeOut(this.lastOverNode, dd, e, data);
+            this.lastOverNode = null;
+        }
+        var n = this.getTargetFromEvent(e);
+        return n ?
+            this.onNodeDrop(n, dd, e, data) :
+            this.onContainerDrop(n, dd, e, data);
+    },
+    
+    triggerCacheRefresh : function(){
+        YAHOO.util.DDM.refreshCache(this.groups);
+    }  
+});
+}
diff --git a/frontend/beta/js/YUI-extensions/dd/Registry.js b/frontend/beta/js/YUI-extensions/dd/Registry.js
new file mode 100644
index 0000000..983b874
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/dd/Registry.js
@@ -0,0 +1,80 @@
+// kill drag drop dependency
+if(YAHOO.util.DragDrop){
+
+YAHOO.ext.dd.Registry = function(){
+    var elements = {}; 
+    var handles = {}; 
+    var autoIdSeed = 0;
+    var doc = document; // local reference for IE
+    
+    var getId = function(el, autogen){
+        if(typeof el == 'string'){
+            return el;
+        }
+        var id = el.id;
+        if(!id && autogen !== false){
+            id = 'yddgen-' + (++autoIdSeed);
+            el.id = id;
+        }
+        return id;
+    };
+    
+    return {
+        register : function(el, data){
+            data = data || {};
+            if(typeof el == 'string'){
+                el = doc.getElementById(el);
+            }
+            data.ddel = el;
+            elements[getId(el)] = data;
+            if(data.isHandle !== false){
+                handles[data.ddel.id] = data;
+            }
+            if(data.handles){
+                var hs = data.handles;
+                for(var i = 0, len = hs.length; i < len; i++){
+                	handles[getId(hs[i])] = data;
+                }
+            }
+        },
+        
+        unregister : function(el){
+            var id = getId(el, false);
+            var data = elements[id];
+            if(data){
+                delete elements[id];
+                if(data.handles){
+                    var hs = data.handles;
+                    for(var i = 0, len = hs.length; i < len; i++){
+                    	delete handles[getId(hs[i], false)];
+                    }
+                }
+            }
+        },
+        
+        getHandle : function(id){
+            if(typeof id != 'string'){ // must be element?
+                id = id.id;
+            }
+            return handles[id];
+        },
+        
+        getHandleFromEvent : function(e){
+            var t = YAHOO.util.Event.getTarget(e);
+            return t ? handles[t.id] : null;
+        },
+        
+        getTarget : function(id){
+            if(typeof id != 'string'){ // must be element?
+                id = id.id;
+            }
+            return elements[id];
+        },
+        
+        getTargetFromEvent : function(e){
+            var t = YAHOO.util.Event.getTarget(e);
+            return t ? elements[t.id] || handles[t.id] : null;
+        }
+    };
+}();
+}
diff --git a/frontend/beta/js/YUI-extensions/dd/ScrollManager.js b/frontend/beta/js/YUI-extensions/dd/ScrollManager.js
new file mode 100644
index 0000000..615aadf
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/dd/ScrollManager.js
@@ -0,0 +1,171 @@
+// kill dependency issue
+if(YAHOO.util.DragDrop){
+/**
+ * @class YAHOO.ext.dd.ScrollManager
+ * Provides automatic scrolling of overflow regions in the page during drag operations.<br><br>
+ * <b>Note: This class uses "Point Mode" and is untested in "Intersect Mode".</b>
+ * @singleton
+ */
+YAHOO.ext.dd.ScrollManager = function(){
+    var ddm = YAHOO.util.DragDropMgr;
+    var els = {};
+    var dragEl = null;
+    var proc = {};
+    
+    var onStop = function(e){
+        dragEl = null;
+        clearProc();
+    };
+    
+    var triggerRefresh = function(){
+        if(ddm.dragCurrent){
+             ddm.refreshCache(ddm.dragCurrent.groups);
+        }
+    }
+    
+    var doScroll = function(){
+        if(ddm.dragCurrent){
+            var dds = YAHOO.ext.dd.ScrollManager;
+            if(!dds.animate || !YAHOO.util.Scroll){
+                if(proc.el.scroll(proc.dir, dds.increment)){
+                    triggerRefresh();
+                }
+            }else{
+                proc.el.scroll(proc.dir, dds.increment, true, dds.animDuration, triggerRefresh);
+            }
+        }
+    };
+    
+    var clearProc = function(){
+        if(proc.id){
+            clearInterval(proc.id);
+        }
+        proc.id = 0;
+        proc.el = null;
+        proc.dir = '';
+    };
+    
+    var startProc = function(el, dir){
+        clearProc();
+        proc.el = el;
+        proc.dir = dir;
+        proc.id = setInterval(doScroll, YAHOO.ext.dd.ScrollManager.frequency);
+    };
+    
+    var onFire = function(e, isDrop){
+        if(isDrop || !ddm.dragCurrent){ return; }
+        var dds = YAHOO.ext.dd.ScrollManager;
+        if(!dragEl || dragEl != ddm.dragCurrent){
+            dragEl = ddm.dragCurrent;
+            // refresh regions on drag start
+            dds.refreshCache();
+        }
+        
+        var xy = YAHOO.util.Event.getXY(e);
+        var pt = new YAHOO.util.Point(xy[0], xy[1]);
+        for(var id in els){
+            var el = els[id], r = el._region;
+            if(r.contains(pt) && el.isScrollable()){
+                if(r.bottom - pt.y <= dds.thresh){
+                    if(proc.el != el){
+                        startProc(el, 'down');
+                    }
+                    return;
+                }else if(r.right - pt.x <= dds.thresh){
+                    if(proc.el != el){
+                        startProc(el, 'left');
+                    }
+                    return;
+                }else if(pt.y - r.top <= dds.thresh){
+                    if(proc.el != el){
+                        startProc(el, 'up');
+                    }
+                    return;
+                }else if(pt.x - r.left <= dds.thresh){
+                    if(proc.el != el){
+                        startProc(el, 'right');
+                    }
+                    return;
+                }
+            }
+        }
+        clearProc();
+    };
+    
+    ddm.fireEvents = ddm.fireEvents.createSequence(onFire, ddm);
+    ddm.stopDrag = ddm.stopDrag.createSequence(onStop, ddm);
+    
+    return {
+        /**
+         * Registers new overflow element(s) to auto scroll
+         * @param {String/HTMLElement/Element/Array} el The id of or the element to be scrolled or an array of either
+         */
+        register : function(el){
+            if(el instanceof Array){
+                for(var i = 0, len = el.length; i < len; i++) {
+                	this.register(el[i]);
+                }
+            }else{
+                el = getEl(el);
+                els[el.id] = el;
+            }
+        },
+        
+        /**
+         * Unregisters overflow element(s) so they are no longer scrolled
+         * @param {String/HTMLElement/Element/Array} el The id of or the element to be removed or an array of either
+         */
+        unregister : function(el){
+            if(el instanceof Array){
+                for(var i = 0, len = el.length; i < len; i++) {
+                	this.unregister(el[i]);
+                }
+            }else{
+                el = getEl(el);
+                delete els[el.id];
+            }
+        },
+        
+        /**
+         * The number of pixels from the edge of a container the pointer needs to be to 
+         * trigger scrolling (defaults to 25)
+         * @type Number
+         */
+        thresh : 25,
+        
+        /**
+         * The number of pixels to scroll in each scroll increment (defaults to 50)
+         * @type Number
+         */
+        increment : 100,
+        
+        /**
+         * The frequency of scrolls in milliseconds (defaults to 500)
+         * @type Number
+         */
+        frequency : 500,
+        
+        /**
+         * True to animate the scroll (defaults to true)
+         * @type Boolean
+         */
+        animate: true,
+        
+        /**
+         * The animation duration in seconds - 
+         * MUST BE less than YAHOO.ext.dd.ScrollManager.frequency! (defaults to .4)
+         * @type Number
+         */
+        animDuration: .4,
+        
+        /**
+         * Manually trigger a cache refresh.
+         */
+        refreshCache : function(){
+            for(var id in els){
+                els[id]._region = els[id].getRegion();
+            }
+        }
+    } 
+}();
+}
diff --git a/frontend/beta/js/YUI-extensions/dd/StatusProxy.js b/frontend/beta/js/YUI-extensions/dd/StatusProxy.js
new file mode 100644
index 0000000..97de4d9
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/dd/StatusProxy.js
@@ -0,0 +1,110 @@
+YAHOO.ext.dd.StatusProxy = function(config){
+    YAHOO.ext.util.Config.apply(this, config);
+    this.id = this.id || YAHOO.util.Dom.generateId();
+    this.el = new YAHOO.ext.Layer({
+        dh: {
+            id: this.id, tag: 'div', cls: 'ydd-drag-proxy '+this.dropNotAllowed, children: [
+                {tag: 'div', cls: 'ydd-drop-icon'},
+                {tag: 'div', cls: 'ydd-drag-ghost'}
+            ]
+        }, 
+        shadow: !config || config.shadow !== false
+    });
+    /*this.el = YAHOO.ext.DomHelper.insertBefore(document.body.firstChild, {
+        id: this.id, tag: 'div', cls: 'ydd-drag-proxy '+this.dropNotAllowed, children: [
+            {tag: 'div', cls: 'ydd-drop-icon'},
+            {tag: 'div', cls: 'ydd-drag-ghost'}
+        ]
+    }, true);*/
+    this.ghost = getEl(this.el.dom.childNodes[1]);
+    this.dropStatus = this.dropNotAllowed;
+};
+
+YAHOO.ext.dd.StatusProxy.prototype = {
+    dropAllowed : 'ydd-drop-ok',
+    dropNotAllowed : 'ydd-drop-nodrop',
+    /**
+     * Updates the DD visual element to allow/not allow a drop
+     * @param {String} cssClass The css class for the new drop status indicator image
+     */
+    setStatus : function(cssClass){
+        cssClass = cssClass || this.dropNotAllowed;
+        if(this.dropStatus != cssClass){
+            this.el.replaceClass(this.dropStatus, cssClass);
+            this.dropStatus = cssClass;
+        }
+    },
+    
+    reset : function(clearGhost){
+        this.el.dom.className = 'ydd-drag-proxy ' + this.dropNotAllowed;
+        this.dropStatus = this.dropNotAllowed;
+        if(clearGhost){
+            this.ghost.update('');
+        }
+    },
+    
+    update : function(html){
+        if(typeof html == 'string'){
+            this.ghost.update(html);
+        }else{
+            this.ghost.update('');
+            html.style.margin = '0';
+            this.ghost.dom.appendChild(html);
+        }        
+    },
+    
+    getEl : function(){
+        return this.el;
+    },
+    
+    getGhost : function(){
+        return this.ghost;
+    },
+    
+    hide : function(clear){
+        this.el.hide();
+        if(clear){
+            this.reset(true);
+        }
+    },
+    
+    stop : function(){
+        if(this.anim && this.anim.isAnimated()){
+            this.anim.stop();
+        }
+    },
+    
+    show : function(){
+        this.el.show();
+    },
+    
+    sync : function(){
+        this.el.syncLocalXY();  
+    },
+    
+    repair : function(xy, callback, scope){
+        this.callback = callback;
+        this.scope = scope;
+        if(xy && this.animRepair !== false && YAHOO.util.Anim){
+            this.el.addClass('ydd-drag-repair');
+            this.el.hideUnders(true);
+            if(!this.anim){
+                this.anim = new YAHOO.util.Motion(this.el.dom, {}, this.repairDuration || .5, YAHOO.util.Easing.easeOut);
+                this.anim.onComplete.subscribe(this.afterRepair, this, true);
+            }
+            this.anim.attributes = {points: {to:xy}};
+            this.anim.animate();
+        }else{
+            this.afterRepair();
+        }
+    },
+    
+    afterRepair : function(){
+        this.hide(true);
+        if(typeof this.callback == 'function'){
+            this.callback.call(this.scope || this);
+        }
+        this.callback == null;
+        this.scope == null;
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/grid/AbstractColumnModel.js b/frontend/beta/js/YUI-extensions/grid/AbstractColumnModel.js
new file mode 100644
index 0000000..1f93590
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/AbstractColumnModel.js
@@ -0,0 +1,131 @@
+/**
+ * @class YAHOO.ext.grid.AbstractColumnModel
+ * @extends YAHOO.ext.util.Observable
+ * This abstract class defines the ColumnModel interface and provides default implementations of the events required by the Grid. 
+ * @constructor
+*/
+YAHOO.ext.grid.AbstractColumnModel = function(){
+	// legacy events
+	this.onWidthChange = new YAHOO.util.CustomEvent('widthChanged');
+    this.onHeaderChange = new YAHOO.util.CustomEvent('headerChanged');
+	this.onHiddenChange = new YAHOO.util.CustomEvent('hiddenChanged');
+    
+    this.events = {
+        /**
+	     * @event widthchange
+	     * Fires when the width of a column changes
+	     * @param {ColumnModel} this
+	     * @param {Number} columnIndex The column index
+	     * @param {Number} newWidth The new width
+	     */
+	    'widthchange': this.onWidthChange,
+        /**
+	     * @event headerchange
+	     * Fires when the text of a header changes 
+	     * @param {ColumnModel} this
+	     * @param {Number} columnIndex The column index
+	     * @param {Number} newText The new header text
+	     */
+	    'headerchange': this.onHeaderChange,
+        /**
+	     * @event hiddenchange
+	     * Fires when a column is hidden or "unhidden"
+	     * @param {ColumnModel} this
+	     * @param {Number} columnIndex The column index
+	     * @param {Number} hidden true if hidden, false otherwise
+	     */
+	    'hiddenchange': this.onHiddenChange
+    };
+};
+
+YAHOO.ext.grid.AbstractColumnModel.prototype = {
+	fireEvent : YAHOO.ext.util.Observable.prototype.fireEvent,
+    on : YAHOO.ext.util.Observable.prototype.on,
+    addListener : YAHOO.ext.util.Observable.prototype.addListener,
+    delayedListener : YAHOO.ext.util.Observable.prototype.delayedListener,
+    removeListener : YAHOO.ext.util.Observable.prototype.removeListener,
+    purgeListeners : YAHOO.ext.util.Observable.prototype.purgeListeners,
+    bufferedListener : YAHOO.ext.util.Observable.prototype.bufferedListener,
+    
+    fireWidthChange : function(colIndex, newWidth){
+		this.onWidthChange.fireDirect(this, colIndex, newWidth);
+	},
+	
+	fireHeaderChange : function(colIndex, newHeader){
+		this.onHeaderChange.fireDirect(this, colIndex, newHeader);
+	},
+	
+	fireHiddenChange : function(colIndex, hidden){
+		this.onHiddenChange.fireDirect(this, colIndex, hidden);
+	},
+	
+	/**
+     * Interface method - Returns the number of columns.
+     * @return {Number}
+     */
+    getColumnCount : function(){
+        return 0;
+    },
+    
+    /**
+     * Interface method - Returns true if the specified column is sortable.
+     * @param {Number} col The column index
+     * @return {Boolean}
+     */
+    isSortable : function(col){
+        return false;
+    },
+    
+    /**
+     * Interface method - Returns true if the specified column is hidden.
+     * @param {Number} col The column index
+     * @return {Boolean}
+     */
+    isHidden : function(col){
+        return false;
+    },
+    
+    /**
+     * Interface method - Returns the sorting comparison function defined for the column (defaults to sortTypes.none).
+     * @param {Number} col The column index
+     * @return {Function}
+     */
+    getSortType : function(col){
+        return YAHOO.ext.grid.DefaultColumnModel.sortTypes.none;
+    },
+    
+    /**
+     * Interface method - Returns the rendering (formatting) function defined for the column.
+     * @param {Number} col The column index
+     * @return {Function}
+     */
+    getRenderer : function(col){
+        return YAHOO.ext.grid.DefaultColumnModel.defaultRenderer;
+    },
+    
+    /**
+     * Interface method - Returns the width for the specified column.
+     * @param {Number} col The column index
+     * @return {Number}
+     */
+    getColumnWidth : function(col){
+        return 0;
+    },
+    
+    /**
+     * Interface method - Returns the total width of all columns.
+     * @return {Number}
+     */
+    getTotalWidth : function(){
+        return 0;
+    },
+    
+    /**
+     * Interface method - Returns the header for the specified column.
+     * @param {Number} col The column index
+     * @return {String}
+     */
+    getColumnHeader : function(col){
+        return '';
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/grid/DefaultColumnModel.js b/frontend/beta/js/YUI-extensions/grid/DefaultColumnModel.js
new file mode 100644
index 0000000..fbdba26
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/DefaultColumnModel.js
@@ -0,0 +1,325 @@
+/**
+ * @class YAHOO.ext.grid.DefaultColumnModel
+ * @extends YAHOO.ext.grid.AbstractColumnModel
+ * This is the default implementation of a ColumnModel used by the Grid. It defines
+ * the columns in the grid.
+ * <br>Usage:<br>
+ <pre><code>
+ var sort = YAHOO.ext.grid.DefaultColumnModel.sortTypes;
+ var myColumns = [
+	{header: "Ticker", width: 60, sortable: true, sortType: sort.asUCString}, 
+	{header: "Company Name", width: 150, sortable: true, sortType: sort.asUCString}, 
+	{header: "Market Cap.", width: 100, sortable: true, sortType: sort.asFloat}, 
+	{header: "$ Sales", width: 100, sortable: true, sortType: sort.asFloat, renderer: money}, 
+	{header: "Employees", width: 100, sortable: true, sortType: sort.asFloat}
+ ];
+ var colModel = new YAHOO.ext.grid.DefaultColumnModel(myColumns);
+ </code></pre>
+ * @constructor
+ * @param {Object} config The config object
+*/
+YAHOO.ext.grid.DefaultColumnModel = function(config){
+	YAHOO.ext.grid.DefaultColumnModel.superclass.constructor.call(this);
+    /**
+     * The config passed into the constructor
+     */
+    this.config = config;
+    
+    /**
+     * The width of columns which have no width specified (defaults to 100)
+     * @type Number
+     */
+    this.defaultWidth = 100;
+    /**
+     * Default sortable of columns which have no sortable specified (defaults to false)
+     * @type Boolean
+     */
+    this.defaultSortable = false;
+};
+YAHOO.extendX(YAHOO.ext.grid.DefaultColumnModel, YAHOO.ext.grid.AbstractColumnModel, {
+    
+    /**
+     * Returns the number of columns.
+     * @return {Number}
+     */
+    getColumnCount : function(){
+        return this.config.length;
+    },
+        
+    /**
+     * Returns true if the specified column is sortable.
+     * @param {Number} col The column index
+     * @return {Boolean}
+     */
+    isSortable : function(col){
+        if(typeof this.config[col].sortable == 'undefined'){
+            return this.defaultSortable;
+        }
+        return this.config[col].sortable;
+    },
+        
+    /**
+     * Returns the sorting comparison function defined for the column (defaults to sortTypes.none).
+     * @param {Number} col The column index
+     * @return {Function}
+     */
+    getSortType : function(col){
+        if(!this.dataMap){
+            // build a lookup so we don't search every time
+            var map = [];
+            for(var i = 0, len = this.config.length; i < len; i++){
+                map[this.getDataIndex(i)] = i;
+            }
+            this.dataMap = map;
+        }
+        col = this.dataMap[col];
+        if(!this.config[col].sortType){
+            return YAHOO.ext.grid.DefaultColumnModel.sortTypes.none;
+        }
+        return this.config[col].sortType;
+    },
+        
+    /**
+     * Sets the sorting comparison function for a column.
+     * @param {Number} col The column index
+     * @param {Function} fn
+     */
+    setSortType : function(col, fn){
+        this.config[col].sortType = fn;
+    },
+        
+    
+    /**
+     * Returns the rendering (formatting) function defined for the column.
+     * @param {Number} col The column index
+     * @return {Function}
+     */
+    getRenderer : function(col){
+        if(!this.config[col].renderer){
+            return YAHOO.ext.grid.DefaultColumnModel.defaultRenderer;
+        }
+        return this.config[col].renderer;
+    },
+        
+    /**
+     * Sets the rendering (formatting) function for a column.
+     * @param {Number} col The column index
+     * @param {Function} fn
+     */
+    setRenderer : function(col, fn){
+        this.config[col].renderer = fn;
+    },
+        
+    /**
+     * Returns the width for the specified column.
+     * @param {Number} col The column index
+     * @return {Number}
+     */
+    getColumnWidth : function(col){
+        return this.config[col].width || this.defaultWidth;
+    },
+        
+    /**
+     * Sets the width for a column.
+     * @param {Number} col The column index
+     * @param {Number} width The new width
+     */
+    setColumnWidth : function(col, width, suppressEvent){
+        this.config[col].width = width;
+        this.totalWidth = null;
+        if(!suppressEvent){
+             this.onWidthChange.fireDirect(this, col, width);
+        }
+    },
+        
+    /**
+     * Returns the total width of all columns.
+     * @param {Boolean} includeHidden True to include hidden column widths
+     * @return {Number}
+     */
+    getTotalWidth : function(includeHidden){
+        if(!this.totalWidth){
+            this.totalWidth = 0;
+            for(var i = 0; i < this.config.length; i++){
+                if(includeHidden || !this.isHidden(i)){
+                    this.totalWidth += this.getColumnWidth(i);
+                }
+            }
+        }
+        return this.totalWidth;
+    },
+        
+    /**
+     * Returns the header for the specified column.
+     * @param {Number} col The column index
+     * @return {String}
+     */
+    getColumnHeader : function(col){
+        return this.config[col].header;
+    },
+         
+    /**
+     * Sets the header for a column.
+     * @param {Number} col The column index
+     * @param {String} header The new header
+     */
+    setColumnHeader : function(col, header){
+        this.config[col].header = header;
+        this.onHeaderChange.fireDirect(this, col, header);
+    },
+    
+    /**
+     * Returns the tooltip for the specified column.
+     * @param {Number} col The column index
+     * @return {String}
+     */
+    getColumnTooltip : function(col){
+            return this.config[col].tooltip;
+    },
+    /**
+     * Sets the tooltip for a column.
+     * @param {Number} col The column index
+     * @param {String} tooltip The new tooltip
+     */
+    setColumnTooltip : function(col, header){
+            this.config[col].tooltip = tooltip;
+    },
+        
+    /**
+     * Returns the dataIndex for the specified column.
+     * @param {Number} col The column index
+     * @return {Number}
+     */
+    getDataIndex : function(col){
+        if(typeof this.config[col].dataIndex != 'number'){
+            return col;
+        }
+        return this.config[col].dataIndex;
+    },
+         
+    /**
+     * Sets the dataIndex for a column.
+     * @param {Number} col The column index
+     * @param {Number} dataIndex The new dataIndex
+     */
+    setDataIndex : function(col, dataIndex){
+        this.config[col].dataIndex = dataIndex;
+    },
+    /**
+     * Returns true if the cell is editable.
+     * @param {Number} colIndex The column index
+     * @param {Number} rowIndex The row index
+     * @return {Boolean}
+     */
+    isCellEditable : function(colIndex, rowIndex){
+        return this.config[colIndex].editable || (typeof this.config[colIndex].editable == 'undefined' && this.config[colIndex].editor);
+    },
+    
+    /**
+     * Returns the editor defined for the cell/column.
+     * @param {Number} colIndex The column index
+     * @param {Number} rowIndex The row index
+     * @return {Object}
+     */
+    getCellEditor : function(colIndex, rowIndex){
+        return this.config[colIndex].editor;
+    },
+       
+    /**
+     * Sets if a column is editable.
+     * @param {Number} col The column index
+     * @param {Boolean} editable True if the column is editable
+     */
+    setEditable : function(col, editable){
+        this.config[col].editable = editable;
+    },
+    
+    
+    /**
+     * Returns true if the column is hidden.
+     * @param {Number} colIndex The column index
+     * @return {Boolean}
+     */
+    isHidden : function(colIndex){
+        return this.config[colIndex].hidden;
+    },
+    
+    
+    /**
+     * Returns true if the column width cannot be changed
+     */
+    isFixed : function(colIndex){
+        return this.config[colIndex].fixed;
+    },
+    
+    /**
+     * Returns true if the column cannot be resized
+     * @return {Boolean}
+     */
+    isResizable : function(colIndex){
+        return this.config[colIndex].resizable !== false;
+    },
+    /**
+     * Sets if a column is hidden.
+     * @param {Number} colIndex The column index
+     */
+    setHidden : function(colIndex, hidden){
+        this.config[colIndex].hidden = hidden;
+        this.totalWidth = null;
+        this.fireHiddenChange(colIndex, hidden);
+    },
+    
+    /**
+     * Sets the editor for a column.
+     * @param {Number} col The column index
+     * @param {Object} editor The editor object
+     */
+    setEditor : function(col, editor){
+        this.config[col].editor = editor;
+    }
+});
+
+/**
+ * Defines the default sorting (casting?) comparison functions used when sorting data:
+ * <br>&nbsp;&nbsp;sortTypes.none - sorts data as it is without casting or parsing (the default)
+ * <br>&nbsp;&nbsp;sortTypes.asUCString - case insensitive string
+ * <br>&nbsp;&nbsp;sortTypes.asDate - attempts to parse data as a date
+ * <br>&nbsp;&nbsp;sortTypes.asFloat
+ * <br>&nbsp;&nbsp;sortTypes.asInt
+ * @static
+ */
+YAHOO.ext.grid.DefaultColumnModel.sortTypes = {
+    none : function(s) {
+    	return s;
+    },
+
+    asUCString : function(s) {
+    	return String(s).toUpperCase();
+    },
+    
+    asDate : function(s) {
+        if(s instanceof Date){
+            return s.getTime();
+        }
+    	return Date.parse(String(s));
+    },
+    
+    asFloat : function(s) {
+    	var val = parseFloat(String(s).replace(/,/g, ''));
+        if(isNaN(val)) val = 0;
+    	return val;
+    },
+    
+    asInt : function(s) {
+        var val = parseInt(String(s).replace(/,/g, ''));
+        if(isNaN(val)) val = 0;
+    	return val;
+    }
+};
+
+YAHOO.ext.grid.DefaultColumnModel.defaultRenderer = function(value){
+	if(typeof value == 'string' && value.length < 1){
+	    return '&#160;';
+	}
+	return value;
+}
diff --git a/frontend/beta/js/YUI-extensions/grid/EditorGrid.js b/frontend/beta/js/YUI-extensions/grid/EditorGrid.js
new file mode 100644
index 0000000..e7405a0
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/EditorGrid.js
@@ -0,0 +1,16 @@
+/**
+ * @class YAHOO.ext.grid.EditorGrid
+ * @extends YAHOO.ext.grid.Grid
+ * Shortcut class for creating and editable grid.
+ * @param {String/HTMLElement/YAHOO.ext.Element} container The element into which this grid will be rendered - 
+ * The container MUST have some type of size defined for the grid to fill. The container will be 
+ * automatically set to position relative if it isn't already.
+ * @param {Object} dataModel The data model to bind to
+ * @param {Object} colModel The column model with info about this grid's columns
+ */
+YAHOO.ext.grid.EditorGrid = function(container, dataModel, colModel){
+    YAHOO.ext.grid.EditorGrid.superclass.constructor.call(this, container, dataModel, 
+                      colModel, new YAHOO.ext.grid.EditorSelectionModel());
+    this.container.addClass('yeditgrid');
+};
+YAHOO.extendX(YAHOO.ext.grid.EditorGrid, YAHOO.ext.grid.Grid);
diff --git a/frontend/beta/js/YUI-extensions/grid/EditorSelectionModel.js b/frontend/beta/js/YUI-extensions/grid/EditorSelectionModel.js
new file mode 100644
index 0000000..c1cb240
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/EditorSelectionModel.js
@@ -0,0 +1,182 @@
+
+/**
+ @class YAHOO.ext.grid.EditorSelectionModel
+ * Extends {@link YAHOO.ext.grid.DefaultSelectionModel} to enable cell navigation. <br><br> 
+ @extends YAHOO.ext.grid.DefaultSelectionModel
+ @constructor
+ */
+YAHOO.ext.grid.EditorSelectionModel = function(){
+    YAHOO.ext.grid.EditorSelectionModel.superclass.constructor.call(this);
+    /** Number of clicks to activate a cell (for editing) - valid values are 1 or 2
+     * @type Number */
+    this.clicksToActivateCell = 1;
+    this.events['cellactivate'] = new YAHOO.util.CustomEvent('cellactivate');
+};
+
+YAHOO.extendX(YAHOO.ext.grid.EditorSelectionModel, YAHOO.ext.grid.DefaultSelectionModel);
+
+YAHOO.ext.grid.EditorSelectionModel.prototype.disableArrowNavigation = false;
+YAHOO.ext.grid.EditorSelectionModel.prototype.controlForArrowNavigation = false;
+
+/** @ignore */
+YAHOO.ext.grid.EditorSelectionModel.prototype.initEvents = function(){
+    this.grid.addListener("cellclick", this.onCellClick, this, true);
+    this.grid.addListener("celldblclick", this.onCellDblClick, this, true);
+    this.grid.addListener("keydown", this.keyDown, this, true);
+};
+
+YAHOO.ext.grid.EditorSelectionModel.prototype.onCellClick = function(grid, rowIndex, colIndex){
+    if(this.clicksToActivateCell == 1){
+        var row = this.grid.getRow(rowIndex);
+        var cell = row.childNodes[colIndex];
+        if(cell){
+            this.activate(row, cell);
+        }
+    }
+};
+
+YAHOO.ext.grid.EditorSelectionModel.prototype.activate = function(row, cell){
+    this.fireEvent('cellactivate', this, row, cell);
+    this.grid.doEdit(row, cell);
+};
+
+YAHOO.ext.grid.EditorSelectionModel.prototype.onCellDblClick = function(grid, rowIndex, colIndex){
+    if(this.clicksToActivateCell == 2){
+        var row = this.grid.getRow(rowIndex);
+        var cell = row.childNodes[colIndex];
+        if(cell){
+            this.activate(row, cell);
+        }
+    }
+};
+
+/** @ignore */
+YAHOO.ext.grid.EditorSelectionModel.prototype.setRowState = function(row, selected){
+    YAHOO.ext.grid.EditorSelectionModel.superclass.setRowState.call(this, row, false, false);
+};
+/** @ignore */
+YAHOO.ext.grid.EditorSelectionModel.prototype.focusRow = function(row, selected){
+};
+
+YAHOO.ext.grid.EditorSelectionModel.prototype.getEditorCellAfter = function(cell, spanRows){
+    var g = this.grid;
+    var next = g.getCellAfter(cell);
+    while(next && !g.colModel.isCellEditable(next.columnIndex)){
+        next = g.getCellAfter(next);
+    }
+    if(!next && spanRows){
+        var row = g.getRowAfter(g.getRowFromChild(cell));
+        if(row){
+            next = g.getFirstCell(row);
+            if(!g.colModel.isCellEditable(next.columnIndex)){
+                next = this.getEditorCellAfter(next);
+            }
+        }
+    }
+    return next;
+};
+
+YAHOO.ext.grid.EditorSelectionModel.prototype.getEditorCellBefore = function(cell, spanRows){
+    var g = this.grid;
+    var prev = g.getCellBefore(cell);
+    while(prev && !g.colModel.isCellEditable(prev.columnIndex)){
+        prev = g.getCellBefore(prev);
+    }
+    if(!prev && spanRows){
+        var row = g.getRowBefore(g.getRowFromChild(cell));
+        if(row){
+            prev = g.getLastCell(row);
+            if(!g.colModel.isCellEditable(prev.columnIndex)){
+               prev = this.getEditorCellBefore(prev);
+            }
+        }
+    }
+    return prev;
+};
+
+YAHOO.ext.grid.EditorSelectionModel.prototype.allowArrowNav = function(e){
+    return (!this.disableArrowNavigation && (!this.controlForArrowNavigation || e.ctrlKey));
+}
+/** @ignore */
+YAHOO.ext.grid.EditorSelectionModel.prototype.keyDown = function(e){
+    var g = this.grid, cm = g.colModel, cell = g.getEditingCell();
+    if(!cell) return;
+    var newCell;
+    switch(e.browserEvent.keyCode){
+         case e.TAB:
+             if(e.shiftKey){
+                 newCell = this.getEditorCellBefore(cell, true);
+             }else{
+                 newCell = this.getEditorCellAfter(cell, true);
+             }
+             e.preventDefault();
+         break;
+         case e.DOWN:
+             if(this.allowArrowNav(e)){
+                 var next = g.getRowAfter(g.getRowFromChild(cell));
+                 if(next){
+                     newCell = next.childNodes[cell.columnIndex];
+                 }
+             }
+         break;
+         case e.UP:
+             if(this.allowArrowNav(e)){
+                 var prev = g.getRowBefore(g.getRowFromChild(cell));
+                 if(prev){
+                     newCell = prev.childNodes[cell.columnIndex];
+                 }
+             }
+         break;
+         case e.RETURN:
+             if(e.shiftKey){
+                 var prev = g.getRowBefore(g.getRowFromChild(cell));
+                 if(prev){
+                     newCell = prev.childNodes[cell.columnIndex];
+                 }
+             }else{
+                 var next = g.getRowAfter(g.getRowFromChild(cell));
+                 if(next){
+                     newCell = next.childNodes[cell.columnIndex];
+                 }
+             }
+         break;
+         case e.RIGHT:
+             if(this.allowArrowNav(e)){
+                 newCell = this.getEditorCellAfter(cell);
+             }
+         break;
+         case e.LEFT:
+             if(this.allowArrowNav(e)){
+                 newCell = this.getEditorCellBefore(cell);
+             }
+         break;
+    };
+    if(newCell){
+        this.activate(g.getRowFromChild(newCell), newCell);
+        e.stopEvent();
+    }
+};
+
+/**
+ * @class YAHOO.ext.grid.EditorAndSelectionModel
+ */
+YAHOO.ext.grid.EditorAndSelectionModel = function(){
+    YAHOO.ext.grid.EditorAndSelectionModel.superclass.constructor.call(this);
+    this.events['cellactivate'] = new YAHOO.util.CustomEvent('cellactivate');
+};
+
+YAHOO.extendX(YAHOO.ext.grid.EditorAndSelectionModel, YAHOO.ext.grid.DefaultSelectionModel);
+
+YAHOO.ext.grid.EditorAndSelectionModel.prototype.initEvents = function(){
+    YAHOO.ext.grid.EditorAndSelectionModel.superclass.initEvents.call(this);
+    this.grid.addListener("celldblclick", this.onCellDblClick, this, true);
+};
+
+YAHOO.ext.grid.EditorAndSelectionModel.prototype.onCellDblClick = function(grid, rowIndex, colIndex){
+    var row = this.grid.getRow(rowIndex);
+    var cell = row.childNodes[colIndex];
+    if(cell){
+        this.fireEvent('cellactivate', this, row, cell);
+        this.grid.doEdit(row, cell);
+    }
+}; 
diff --git a/frontend/beta/js/YUI-extensions/grid/Grid.js b/frontend/beta/js/YUI-extensions/grid/Grid.js
new file mode 100644
index 0000000..46d5de4
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/Grid.js
@@ -0,0 +1,965 @@
+/**
+ * @class YAHOO.ext.grid.Grid
+ * @extends YAHOO.ext.util.Observable
+ * This class represents the primary interface of a component based grid control.
+ * <br><br>Usage:<pre><code>
+ var grid = new YAHOO.ext.grid.Grid('my-container-id', dataModel, columnModel);
+ // set any options
+ grid.render();
+ // or using a config
+ var grid = new YAHOO.ext.grid.Grid('my-container-id', {
+     dataModel: myDataModel,
+     colModel: myColModel,
+     selModel: mySelectionModel,
+     autoSizeColumns: true,
+     monitorWindowResize: false,
+     trackMouseOver: true
+ }).render();
+ * </code></pre>
+ * <b>Common Problems:</b><br/>
+ * - Grid does not resize properly when going smaller: Setting overflow hidden on the container 
+ * element will correct this<br/>
+ * - If you get el.style[camel]= NaNpx or -2px or something related, be certain you have given your container element 
+ * dimensions. The grid adapts to your container's size, if your container has no size defined then the results
+ * are unpredictable.<br/>
+ * - Do not render the grid into an element with display:none. Try using visibility:hidden. Otherwise there is no way for the 
+ * grid to calculate dimensions/offsets.<br/>
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @requires YAHOO.util.CustomEvent 
+ * @requires YAHOO.ext.Element
+ * @requires YAHOO.ext.util.Browser
+ * @requires YAHOO.ext.util.CSS
+ * @requires YAHOO.ext.SplitBar 
+ * @requires YAHOO.ext.EventObject 
+ * @constructor
+ * @param {String/HTMLElement/YAHOO.ext.Element} container The element into which this grid will be rendered - 
+ * The container MUST have some type of size defined for the grid to fill. The container will be 
+ * automatically set to position relative if it isn't already.
+ * @param {Object} config A config object that sets properties on this grid OR the data model to bind to
+ * @param {Object} colModel (optional) The column model with info about this grid's columns
+ * @param {Object} selectionModel (optional) The selection model for this grid (defaults to DefaultSelectionModel)
+ */
+YAHOO.ext.grid.Grid = function(container, config, colModel, selectionModel){
+	/** @private */
+	this.container = YAHOO.ext.Element.get(container);
+	this.container.update('');
+	this.container.setStyle('overflow', 'hidden');
+	this.id = this.container.id;
+	this.rows = [];
+    this.rowCount = 0;
+    this.fieldId = null;
+    var dataModel = config; // for legacy pre config support
+    this.dataModel = dataModel;
+    this.colModel = colModel;
+    this.selModel = selectionModel;
+	this.activeEditor = null;
+	this.editingCell = null;
+	
+	
+	if(typeof config == 'object' && !config.getRowCount){// must be config object
+	    YAHOO.ext.util.Config.apply(this, config);
+	}
+	
+	/** @private */
+	this.setValueDelegate = this.setCellValue.createDelegate(this);
+	
+	/** @private */
+	this.events = {
+	    // raw events
+	    /**
+	     * @event click
+	     * The raw click event for the entire grid.
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'click' : true,
+	    /**
+	     * @event dblclick
+	     * The raw dblclick event for the entire grid.
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'dblclick' : true,
+	    /**
+	     * @event mousedown
+	     * The raw mousedown event for the entire grid.
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'mousedown' : true,
+	    /**
+	     * @event mouseup
+	     * The raw mouseup event for the entire grid.
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'mouseup' : true,
+	    /**
+	     * @event mouseover
+	     * The raw mouseover event for the entire grid.
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'mouseover' : true,
+	    /**
+	     * @event mouseout
+	     * The raw mouseout event for the entire grid.
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'mouseout' : true,
+	    /**
+	     * @event keypress
+	     * The raw keypress event for the entire grid.
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'keypress' : true,
+	    /**
+	     * @event keydown
+	     * The raw keydown event for the entire grid.
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'keydown' : true,
+	    
+	    // custom events
+	    
+	    /**
+	     * @event cellclick
+	     * Fires when a cell is clicked
+	     * @param {Grid} this
+	     * @param {Number} rowIndex
+	     * @param {Number} columnIndex
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'cellclick' : true,
+	    /**
+	     * @event celldblclick
+	     * Fires when a cell is double clicked
+	     * @param {Grid} this
+	     * @param {Number} rowIndex
+	     * @param {Number} columnIndex
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'celldblclick' : true,
+	    /**
+	     * @event rowclick
+	     * Fires when a row is clicked
+	     * @param {Grid} this
+	     * @param {Number} rowIndex
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'rowclick' : true,
+	    /**
+	     * @event rowdblclick
+	     * Fires when a row is double clicked
+	     * @param {Grid} this
+	     * @param {Number} rowIndex
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'rowdblclick' : true,
+	    /**
+	     * @event headerclick
+	     * Fires when a header is clicked
+	     * @param {Grid} this
+	     * @param {Number} columnIndex
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'headerclick' : true,
+	    /**
+	     * @event rowcontextmenu
+	     * Fires when a row is right clicked
+	     * @param {Grid} this
+	     * @param {Number} rowIndex
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'rowcontextmenu' : true,
+	    /**
+        * @event cellcontextmenu
+       * Fires when a cell is right clicked
+       * @param {Grid} this
+       * @param {Number} rowIndex
+       * @param {Number} cellIndex
+       * @param {YAHOO.ext.EventObject} e
+       */
+      'cellcontextmenu' : true,
+	    /**
+	     * @event headercontextmenu
+	     * Fires when a header is right clicked
+	     * @param {Grid} this
+	     * @param {Number} columnIndex
+	     * @param {YAHOO.ext.EventObject} e
+	     */
+	    'headercontextmenu' : true,
+	    /**
+	     * @event beforeedit
+	     * Fires before a cell is edited
+	     * @param {Grid} this
+	     * @param {Number} rowIndex
+	     * @param {Number} columnIndex
+	     */
+	    'beforeedit' : true,
+	    /**
+	     * @event afteredit
+	     * Fires after a cell is edited
+	     * @param {Grid} this
+	     * @param {Number} rowIndex
+	     * @param {Number} columnIndex
+	     */
+	    'afteredit' : true,
+	    /**
+	     * @event bodyscroll
+	     * Fires when the body element is scrolled
+	     * @param {Number} scrollLeft
+	     * @param {Number} scrollTop
+	     */
+	    'bodyscroll' : true,
+	    /**
+	     * @event columnresize
+	     * Fires when the user resizes a column
+	     * @param {Number} columnIndex
+	     * @param {Number} newSize
+	     */
+	    'columnresize' : true,
+	    /**
+	     * @event startdrag
+	     * Fires when row(s) start being dragged 
+	     * @param {Grid} this
+	     * @param {YAHOO.ext.GridDD} dd The drag drop object
+	     * @param {event} e The raw browser event
+	     */
+	    'startdrag' : true,
+	    /**
+	     * @event enddrag
+	     * Fires when a drag operation is complete
+	     * @param {Grid} this
+	     * @param {YAHOO.ext.GridDD} dd The drag drop object
+	     * @param {event} e The raw browser event
+	     */
+	    'enddrag' : true,
+	    /**
+	     * @event dragdrop
+	     * Fires when dragged row(s) are dropped on a valid DD target 
+	     * @param {Grid} this
+	     * @param {YAHOO.ext.GridDD} dd The drag drop object
+	     * @param {String} targetId The target drag drop object
+	     * @param {event} e The raw browser event
+	     */
+	    'dragdrop' : true,
+	    /**
+	     * @event dragover
+	     * Fires while row(s) are being dragged. "targetId" is the id of the Yahoo.util.DD object the selected rows are being dragged over.
+	     * @param {Grid} this
+	     * @param {YAHOO.ext.GridDD} dd The drag drop object
+	     * @param {String} targetId The target drag drop object
+	     * @param {event} e The raw browser event
+	     */
+	    'dragover' : true,
+	    /**
+	     * @event dragenter
+	     *  Fires when the dragged row(s) first cross another DD target while being dragged 
+	     * @param {Grid} this
+	     * @param {YAHOO.ext.GridDD} dd The drag drop object
+	     * @param {String} targetId The target drag drop object
+	     * @param {event} e The raw browser event
+	     */
+	    'dragenter' : true,
+	    /**
+	     * @event dragout
+	     * Fires when the dragged row(s) leave another DD target while being dragged 
+	     * @param {Grid} this
+	     * @param {YAHOO.ext.GridDD} dd The drag drop object
+	     * @param {String} targetId The target drag drop object
+	     * @param {event} e The raw browser event
+	     */
+	    'dragout' : true
+	};
+};
+
+YAHOO.ext.grid.Grid.prototype = { 
+    /** The minimum width a column can be resized to. (Defaults to 25)
+	 * @type Number */
+	minColumnWidth : 25,
+	
+	/** True to automatically resize the columns to fit their content <b>on initial render</b>
+	 * @type Boolean */
+	autoSizeColumns : false,
+	
+	/** True to measure headers with column data when auto sizing columns
+	 * @type Boolean */
+	autoSizeHeaders : false,
+	
+	/**
+	 * True to autoSize the grid when the window resizes - defaults to true
+	 */
+	monitorWindowResize : true,
+	
+	/** If autoSizeColumns is on, maxRowsToMeasure can be used to limit the number of
+	 * rows measured to get a columns size - defaults to 0 (all rows).
+	 * @type Number */
+	maxRowsToMeasure : 0,
+	
+	/** True to highlight rows when the mouse is over (default is false)
+	 * @type Boolean */
+	trackMouseOver : false,
+	
+	/** True to enable drag and drop of rows
+	 * @type Boolean */
+	enableDragDrop : false,
+	
+	/** True to stripe the rows (default is true)
+	 * @type Boolean */
+	stripeRows : true,
+	/** True to fit the height of the grid container to the height of the data (defaults to false)
+	 * @type Boolean */
+	autoHeight : false,
+	
+	/** True to fit the width of the grid container to the width of the columns (defaults to false)
+	 * @type Boolean */
+	autoWidth : false,
+	
+	/**
+	 * The view used by the grid. This can be set before a call to render(). 
+	 * Defaults to a YAHOO.ext.grid.GridView or PagedGridView depending on the data model.
+	 * @type Object
+	 */
+	view : null,
+	
+	/** A regular expression defining tagNames 
+     * allowed to have text selection (Defaults to <code>/INPUT|TEXTAREA|SELECT/i</code>) */
+    allowTextSelectionPattern : /INPUT|TEXTAREA|SELECT/i,
+    
+    /**
+     * Called once after all setup has been completed and the grid is ready to be rendered.
+     * @return {YAHOO.ext.grid.Grid} this
+     */
+    render : function(){
+        if((!this.container.dom.offsetHeight || this.container.dom.offsetHeight < 20) 
+                || this.container.getStyle('height') == 'auto'){
+    	    this.autoHeight = true;   
+    	}	       
+    	if((!this.container.dom.offsetWidth || this.container.dom.offsetWidth < 20)){
+    	    this.autoWidth = true;   
+    	}	       
+    	if(!this.view){
+    	    if(this.dataModel.isPaged()){
+    		    this.view = new YAHOO.ext.grid.PagedGridView();
+    	    }else{
+    	        this.view = new YAHOO.ext.grid.GridView();
+    	    }
+    	}
+    	this.view.init(this);
+        this.el = getEl(this.view.render(), true);
+        var c = this.container;
+        c.mon("click", this.onClick, this, true);
+        c.mon("dblclick", this.onDblClick, this, true);
+        c.mon("contextmenu", this.onContextMenu, this, true);
+        c.mon("selectstart", this.cancelTextSelection, this, true);
+        c.mon("mousedown", this.cancelTextSelection, this, true);
+        c.mon("mousedown", this.onMouseDown, this, true);
+        c.mon("mouseup", this.onMouseUp, this, true);
+        if(this.trackMouseOver){
+            this.el.mon("mouseover", this.onMouseOver, this, true);
+            this.el.mon("mouseout", this.onMouseOut, this, true);
+        }
+        c.mon("keypress", this.onKeyPress, this, true);
+        c.mon("keydown", this.onKeyDown, this, true);
+        this.init();
+        return this;
+    },
+    
+    init : function(){
+        this.rows = this.el.dom.rows;
+        if(!this.disableSelection){
+	        if(!this.selModel){
+	            this.selModel = new YAHOO.ext.grid.DefaultSelectionModel(this);
+	        }
+	        this.selModel.init(this);
+	        this.selModel.onSelectionChange.subscribe(this.updateField, this, true);
+        }else{
+            this.selModel = new YAHOO.ext.grid.DisableSelectionModel(this);
+            this.selModel.init(this);
+        }
+        
+        if(this.enableDragDrop){
+            this.dd = new YAHOO.ext.grid.GridDD(this, this.container.dom);
+        }
+     },   
+
+    /**
+     * Resets the grid for use with a new configuration and/or data and column models. After calling this function
+     * you will need to call render() again. Any listeners for this grid will be retained.
+     * Warning: any listeners manually attached (not through the grid) to the grid's container 
+     * element will be removed. 
+     * @param {Object} config Standard config object with properties to set on this grid
+     * @return {YAHOO.ext.grid.Grid} this
+     */
+    reset : function(config){
+        this.destroy(false, true);
+        YAHOO.ext.util.Config.apply(this, config);
+        return this;
+    },
+    
+    /**
+     * Destroy this grid. 
+     * @param {Boolean} removeEl True to remove the element
+     */
+    destroy : function(removeEl, keepListeners){
+        var c = this.container;
+        c.removeAllListeners();
+        this.view.destroy();
+        YAHOO.ext.EventManager.removeResizeListener(this.view.onWindowResize, this.view);
+        this.view = null;
+        this.colModel.purgeListeners();
+        if(!keepListeners){
+            this.purgeListeners();
+        }
+        c.update('');
+        if(removeEl === true){
+            c.remove();
+        }
+    },
+    
+    /**
+     * Replace the current data model with a new one (experimental)
+     * @param {DataModel} dm The new data model
+     * @pram {Boolean} rerender true to render the grid rows from scratch
+     */
+    setDataModel : function(dm, rerender){
+        this.view.unplugDataModel(this.dataModel);
+        this.dataModel = dm;
+        this.view.plugDataModel(dm);
+        if(rerender){
+            dm.fireEvent('datachanged');
+        }
+    },
+    
+    onMouseDown : function(e){
+        this.fireEvent('mousedown', e);
+    },
+    
+    onMouseUp : function(e){
+        this.fireEvent('mouseup', e);
+    },
+    
+    onMouseOver : function(e){
+        this.fireEvent('mouseover', e);
+    },
+    
+    onMouseOut : function(e){
+        this.fireEvent('mouseout', e);
+    },
+    
+    onKeyPress : function(e){
+        this.fireEvent('keypress', e);
+    },
+    
+    onKeyDown : function(e){
+        this.fireEvent('keydown', e);
+    },
+    
+    fireEvent : YAHOO.ext.util.Observable.prototype.fireEvent,
+    on : YAHOO.ext.util.Observable.prototype.on,
+    addListener : YAHOO.ext.util.Observable.prototype.addListener,
+    delayedListener : YAHOO.ext.util.Observable.prototype.delayedListener,
+    removeListener : YAHOO.ext.util.Observable.prototype.removeListener,
+    purgeListeners : YAHOO.ext.util.Observable.prototype.purgeListeners,
+    bufferedListener : YAHOO.ext.util.Observable.prototype.bufferedListener,
+    
+    onClick : function(e){
+        this.fireEvent('click', e);
+        var target = e.getTarget();
+        var row = this.getRowFromChild(target);
+        var cell = this.getCellFromChild(target);
+        var header = this.getHeaderFromChild(target);
+        if(cell){
+            this.fireEvent('cellclick', this, row.rowIndex, cell.columnIndex, e);
+        }
+        if(row){
+            this.fireEvent('rowclick', this, row.rowIndex, e);
+        }
+        if(header){
+            this.fireEvent('headerclick', this, header.columnIndex, e);
+        }
+    },
+
+    onContextMenu : function(e){
+        var target = e.getTarget();
+        var row = this.getRowFromChild(target);
+        var cell = this.getCellFromChild(target);
+        var header = this.getHeaderFromChild(target);
+        if(cell){
+            this.fireEvent('cellcontextmenu', this, row.rowIndex, cell.columnIndex, e);
+        }
+        if(row){
+            this.fireEvent('rowcontextmenu', this, row.rowIndex, e);
+        }
+        if(header){
+            this.fireEvent('headercontextmenu', this, header.columnIndex, e);
+        }
+        e.preventDefault();
+    },
+
+    onDblClick : function(e){
+        this.fireEvent('dblclick', e);
+        var target = e.getTarget();
+        var row = this.getRowFromChild(target);
+        var cell = this.getCellFromChild(target);
+        if(row){
+            this.fireEvent('rowdblclick', this, row.rowIndex, e);
+        }
+        if(cell){
+            this.fireEvent('celldblclick', this, row.rowIndex, cell.columnIndex, e);
+        }
+    },
+    
+    /**
+     * Starts editing the specified for the specified row/column
+     * @param {Number} rowIndex
+     * @param {Number} colIndex
+     */
+    startEditing : function(rowIndex, colIndex){
+        var row = this.rows[rowIndex];
+        var cell = row.childNodes[colIndex];
+        this.stopEditing();
+        setTimeout(this.doEdit.createDelegate(this, [row, cell]), 10);
+    },
+        
+    /**
+     * Stops any active editing
+     */
+    stopEditing : function(){
+        if(this.activeEditor){
+            this.activeEditor.stopEditing();
+        }
+    },
+        
+    /** @ignore */
+    doEdit : function(row, cell){
+        if(!row || !cell) return;
+        var cm = this.colModel;
+        var dm = this.dataModel;
+        var colIndex = cell.columnIndex;
+        var rowIndex = row.rowIndex;
+        if(cm.isCellEditable(colIndex, rowIndex)){
+           var ed = cm.getCellEditor(colIndex, rowIndex);
+           if(ed){
+               if(this.activeEditor){
+                   this.activeEditor.stopEditing();
+               }
+               this.fireEvent('beforeedit', this, rowIndex, colIndex);
+               this.activeEditor = ed;
+               this.editingCell = cell;
+               this.view.ensureVisible(row, true);
+               try{
+                   cell.focus();
+               }catch(e){}
+               ed.init(this, this.el.dom.parentNode, this.setValueDelegate);
+               var value = dm.getValueAt(rowIndex, cm.getDataIndex(colIndex));
+               // set timeout so firefox stops editing before starting a new edit
+               setTimeout(ed.startEditing.createDelegate(ed, [value, row, cell]), 1);
+           }   
+        }  
+    },
+    
+    setCellValue : function(value, rowIndex, colIndex){
+         this.dataModel.setValueAt(value, rowIndex, this.colModel.getDataIndex(colIndex));
+         this.fireEvent('afteredit', this, rowIndex, colIndex);
+    },
+    
+    /** @ignore Called when text selection starts or mousedown to prevent default */
+    cancelTextSelection : function(e){
+        var target = e.getTarget();
+        if(target && target != this.el.dom.parentNode && !this.allowTextSelectionPattern.test(target.tagName)){
+            e.preventDefault();
+        }
+    },
+    
+    /**
+     * Causes the grid to manually recalculate it's dimensions. Generally this is done automatically, 
+     * but if manual update is required this method will initiate it.
+     */
+    autoSize : function(){
+        this.view.updateWrapHeight();
+        this.view.adjustForScroll();
+    },
+    
+    /**
+     * Scrolls the grid to the specified row
+     * @param {Number/HTMLElement} row The row object or index of the row
+     */
+    scrollTo : function(row){
+        if(typeof row == 'number'){
+            row = this.rows[row];
+        }
+        this.view.ensureVisible(row, true);
+    },
+    
+    /** @private */
+    getEditingCell : function(){
+        return this.editingCell;    
+    },
+    
+    /**
+     * Binds this grid to the field with the specified id. Initially reads and parses the comma 
+     * delimited ids in the field and selects those items. All selections made in the grid
+     * will be persisted to the field by their ids comma delimited.
+     * @param {String} The id of the field to bind to
+     */
+    bindToField : function(fieldId){
+        this.fieldId = fieldId;
+        this.readField();
+    },
+    
+    /** @private */
+    updateField : function(){
+        if(this.fieldId){
+            var field = YAHOO.util.Dom.get(this.fieldId);
+            field.value = this.getSelectedRowIds().join(',');
+        }
+    },
+    
+    /**
+     * Causes the grid to read and select the ids from the bound field - See {@link #bindToField}.
+     */
+    readField : function(){
+        if(this.fieldId){
+            var field = YAHOO.util.Dom.get(this.fieldId);
+            var values = field.value.split(',');
+            var rows = this.getRowsById(values);
+            this.selModel.selectRows(rows, false);
+        }
+    },
+	
+	/**
+	 * Returns the table row at the specified index
+	 * @param {Number} index
+	 * @return {HTMLElement} 
+	 */
+    getRow : function(index){
+        return this.rows[index];
+    },
+	
+	/**
+	 * Returns the rows that have the specified id(s). The id value for a row is provided 
+	 * by the DataModel. See {@link YAHOO.ext.grid.DefaultDataModel#getRowId}.
+	 * @param {String/Array} An id to find or an array of ids
+	 * @return {HtmlElement/Array} If one id was passed in, it returns one result. 
+	 * If an array of ids was specified, it returns an Array of HTMLElements
+	 */
+    getRowsById : function(id){
+        var dm = this.dataModel;
+        if(!(id instanceof Array)){
+            for(var i = 0; i < this.rows.length; i++){
+                if(dm.getRowId(i) == id){
+                    return this.rows[i];
+                }
+            }
+            return null;
+        }
+        var found = [];
+        var re = "^(?:";
+        for(var i = 0; i < id.length; i++){
+            re += id[i];
+            if(i != id.length-1) re += "|";
+        }
+        var regex = new RegExp(re + ")$");
+        for(var i = 0; i < this.rows.length; i++){
+            if(regex.test(dm.getRowId(i))){
+                found.push(this.rows[i]);
+            }
+        }
+        return found;
+    },
+    
+    /**
+	 * Returns the row that comes after the specified row - text nodes are skipped.
+	 * @param {HTMLElement} row
+	 * @return {HTMLElement} 
+	 */
+    getRowAfter : function(row){
+        return this.getSibling('next', row);
+    },
+    
+    /**
+	 * Returns the row that comes before the specified row - text nodes are skipped.
+	 * @param {HTMLElement} row
+	 * @return {HTMLElement} 
+	 */
+    getRowBefore : function(row){
+        return this.getSibling('previous', row);
+    },
+    
+    /**
+	 * Returns the cell that comes after the specified cell - text nodes are skipped.
+	 * @param {HTMLElement} cell
+	 * @param {Boolean} includeHidden
+	 * @return {HTMLElement} 
+	 */
+    getCellAfter : function(cell, includeHidden){
+        var next = this.getSibling('next', cell);
+        if(next && !includeHidden && this.colModel.isHidden(next.columnIndex)){
+            return this.getCellAfter(next);
+        }
+        return next;
+    },
+    
+    /**
+	 * Returns the cell that comes before the specified cell - text nodes are skipped.
+	 * @param {HTMLElement} cell
+	 * @param {Boolean} includeHidden
+	 * @return {HTMLElement} 
+	 */
+    getCellBefore : function(cell, includeHidden){
+        var prev = this.getSibling('previous', cell);
+        if(prev && !includeHidden && this.colModel.isHidden(prev.columnIndex)){
+            return this.getCellBefore(prev);
+        }
+        return prev;
+    },
+    
+    /**
+	 * Returns the last cell for the row - text nodes and hidden columns are skipped.
+	 * @param {HTMLElement} row
+	 * @param {Boolean} includeHidden
+	 * @return {HTMLElement} 
+	 */
+    getLastCell : function(row, includeHidden){
+        var cell = this.getElement('previous', row.lastChild);
+        if(cell && !includeHidden && this.colModel.isHidden(cell.columnIndex)){
+            return this.getCellBefore(cell);
+        }
+        return cell;
+    },
+    
+    /**
+	 * Returns the first cell for the row - text nodes and hidden columns are skipped.
+	 * @param {HTMLElement} row
+	 * @param {Boolean} includeHidden
+	 * @return {HTMLElement} 
+	 */
+    getFirstCell : function(row, includeHidden){
+        var cell = this.getElement('next', row.firstChild);
+        if(cell && !includeHidden && this.colModel.isHidden(cell.columnIndex)){
+            return this.getCellAfter(cell);
+        }
+        return cell;
+    },
+    
+    /**
+     * @private
+     * Gets siblings, skipping text nodes
+     * @param {String} type The direction to walk: 'next' or 'previous'
+     * @param {HTMLElement} node
+	 */
+    getSibling : function(type, node){
+        if(!node) return null;
+        type += 'Sibling';
+        var n = node[type];
+        while(n && n.nodeType != 1){
+            n = n[type];
+        }
+        return n;
+    },
+    
+    /**
+     * Returns node if node is an HTMLElement else walks the siblings in direction looking for 
+     * a node that is an element
+     * @param {String} direction The direction to walk: 'next' or 'previous'
+     * @private
+     */
+    getElement : function(direction, node){
+        if(!node || node.nodeType == 1) return node;
+        else return this.getSibling(direction, node);
+    },
+    
+    /**
+     * @private
+     */
+    getElementFromChild : function(childEl, parentClass){
+        if(!childEl || (YAHOO.util.Dom.hasClass(childEl, parentClass))){
+		    return childEl;
+	    }
+	    var p = childEl.parentNode;
+	    var b = document.body;
+	    while(p && p != b){
+            if(YAHOO.util.Dom.hasClass(p, parentClass)){
+            	return p;
+            }
+            p = p.parentNode;
+        }
+	    return null;
+    },
+    
+    /**
+	 * Returns the row that contains the specified child element.
+	 * @param {HTMLElement} childEl
+	 * @return {HTMLElement} 
+	 */
+    getRowFromChild : function(childEl){
+        return this.getElementFromChild(childEl, 'ygrid-row');
+    },
+    
+    /**
+	 * Returns the cell that contains the specified child element.
+	 * @param {HTMLElement} childEl
+	 * @return {HTMLElement} 
+	 */
+    getCellFromChild : function(childEl){
+        return this.getElementFromChild(childEl, 'ygrid-col');
+    },
+    
+    
+    /**
+     * Returns the header element that contains the specified child element.
+     * @param {HTMLElement}  childEl
+	 * @return {HTMLElement} 
+	 */
+     getHeaderFromChild : function(childEl){
+        return this.getElementFromChild(childEl, 'ygrid-hd');
+    },
+    
+    /**
+     * Convenience method for getSelectionModel().getSelectedRows() - 
+     * See <small>{@link YAHOO.ext.grid.DefaultSelectionModel#getSelectedRows}</small> for more details.
+     * @return {Array}
+     */
+    getSelectedRows : function(){
+        return this.selModel.getSelectedRows();
+    },
+    
+    /**
+     * Convenience method for getSelectionModel().getSelectedRows()[0] - 
+     * See <small>{@link YAHOO.ext.grid.DefaultSelectionModel#getSelectedRows}</small> for more details.
+     * @return {HTMLElement}
+     */
+    getSelectedRow : function(){
+        if(this.selModel.hasSelection()){
+            return this.selModel.getSelectedRows()[0];
+        }
+        return null;
+    },
+    
+    /**
+     * Get the selected row indexes
+     * @return {Array} Array of indexes
+     */
+    getSelectedRowIndexes : function(){
+        var a = [];
+        var rows = this.selModel.getSelectedRows();
+        for(var i = 0; i < rows.length; i++) {
+        	a[i] = rows[i].rowIndex;
+        }
+        return a;
+    },
+    
+    /**
+     * Gets the first selected row or -1 if none are selected
+     * @return {Number}
+     */
+    getSelectedRowIndex : function(){
+        if(this.selModel.hasSelection()){
+           return this.selModel.getSelectedRows()[0].rowIndex;
+        }
+        return -1;
+    },
+    
+    /**
+     * Convenience method for getSelectionModel().getSelectedRowIds()[0] - 
+     * See <small>{@link YAHOO.ext.grid.DefaultSelectionModel#getSelectedRowIds}</small> for more details.
+     * @return {String}
+     */
+    getSelectedRowId : function(){
+        if(this.selModel.hasSelection()){
+           return this.selModel.getSelectedRowIds()[0];
+        }
+        return null;
+    },
+    
+    /**
+     * Convenience method for getSelectionModel().getSelectedRowIds() - 
+     * See <small>{@link YAHOO.ext.grid.DefaultSelectionModel#getSelectedRowIds}</small> for more details.
+     * @return {Array}
+     */
+    getSelectedRowIds : function(){
+        return this.selModel.getSelectedRowIds();
+    },
+    
+    /**
+     * Convenience method for getSelectionModel().clearSelections() - 
+     * See <small>{@link YAHOO.ext.grid.DefaultSelectionModel#clearSelections}</small> for more details.
+     */
+    clearSelections : function(){
+        this.selModel.clearSelections();
+    },
+    
+        
+    /**
+     * Convenience method for getSelectionModel().selectAll() - 
+     * See <small>{@link YAHOO.ext.grid.DefaultSelectionModel#selectAll}</small> for more details.
+     */
+    selectAll : function(){
+        this.selModel.selectAll();
+    },
+    
+        
+    /**
+     * Convenience method for getSelectionModel().getCount() - 
+     * See <small>{@link YAHOO.ext.grid.DefaultSelectionModel#getCount}</small> for more details.
+     * @return {Number}
+     */
+    getSelectionCount : function(){
+        return this.selModel.getCount();
+    },
+    
+    /**
+     * Convenience method for getSelectionModel().hasSelection() - 
+     * See <small>{@link YAHOO.ext.grid.DefaultSelectionModel#hasSelection}</small> for more details.
+     * @return {Boolean}
+     */
+    hasSelection : function(){
+        return this.selModel.hasSelection();
+    },
+    
+    /**
+     * Returns the grid's SelectionModel.
+     * @return {SelectionModel}
+     */
+    getSelectionModel : function(){
+        if(!this.selModel){
+            this.selModel = new DefaultSelectionModel();
+        }
+        return this.selModel;
+    },
+    
+    /**
+     * Returns the grid's DataModel.
+     * @return {DataModel}
+     */
+    getDataModel : function(){
+        return this.dataModel;
+    },
+    
+    /**
+     * Returns the grid's ColumnModel.
+     * @return {ColumnModel}
+     */
+    getColumnModel : function(){
+        return this.colModel;
+    },
+    
+    /**
+     * Returns the grid's GridView object.
+     * @return {GridView}
+     */
+    getView : function(){
+        return this.view;
+    },
+    /**
+     * Called to get grid's drag proxy text, by default returns this.ddText. 
+     * @return {String}
+     */
+    getDragDropText : function(){
+        return this.ddText.replace('%0', this.selModel.getCount());
+    }
+};
+/**
+ * Configures the text is the drag proxy (defaults to "%0 selected row(s)"). 
+ * %0 is replaced with the number of selected rows.
+ * @type String
+ */
+YAHOO.ext.grid.Grid.prototype.ddText = "%0 selected row(s)";
diff --git a/frontend/beta/js/YUI-extensions/grid/GridDD.js b/frontend/beta/js/YUI-extensions/grid/GridDD.js
new file mode 100644
index 0000000..cdcaf39
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/GridDD.js
@@ -0,0 +1,101 @@
+
+// kill dependency issue
+if(YAHOO.util.DDProxy){
+/**
+ * @class YAHOO.ext.grid.GridDD
+ * Custom implementation of YAHOO.util.DDProxy used internally by the grid
+ * @extends YAHOO.util.DDProxy
+ */
+YAHOO.ext.grid.GridDD = function(grid, bwrap){
+    this.grid = grid;
+    var ddproxy = document.createElement('div');
+    ddproxy.id = grid.container.id + '-ddproxy';
+    ddproxy.className = 'ygrid-drag-proxy';
+    document.body.insertBefore(ddproxy, document.body.firstChild);
+    YAHOO.util.Dom.setStyle(ddproxy, 'opacity', .80);
+    var ddicon = document.createElement('span');
+    ddicon.className = 'ygrid-drop-icon ygrid-drop-nodrop';
+    ddproxy.appendChild(ddicon);
+    var ddtext = document.createElement('span');
+    ddtext.className = 'ygrid-drag-text';
+    ddtext.innerHTML = "&#160;";
+    ddproxy.appendChild(ddtext);
+    
+    this.ddproxy = ddproxy;
+    this.ddtext = ddtext;
+    this.ddicon = ddicon;
+    YAHOO.util.Event.on(bwrap, 'click', this.handleClick, this, true);
+    YAHOO.ext.grid.GridDD.superclass.constructor.call(this, bwrap.id, 'GridDD', 
+          {dragElId : ddproxy.id, resizeFrame: false});
+          
+    this.unlockDelegate = grid.selModel.unlock.createDelegate(grid.selModel);
+};
+YAHOO.extendX(YAHOO.ext.grid.GridDD, YAHOO.util.DDProxy);
+
+YAHOO.ext.grid.GridDD.prototype.handleMouseDown = function(e){
+    var row = this.grid.getRowFromChild(YAHOO.util.Event.getTarget(e));
+    if(!row) return;
+    if(this.grid.selModel.isSelected(row)){
+        YAHOO.ext.grid.GridDD.superclass.handleMouseDown.call(this, e);
+    }else {
+        this.grid.selModel.unlock();
+        YAHOO.ext.EventObject.setEvent(e);
+        this.grid.selModel.rowClick(this.grid, row.rowIndex, YAHOO.ext.EventObject);
+        YAHOO.ext.grid.GridDD.superclass.handleMouseDown.call(this, e);
+        this.grid.selModel.lock();
+    }
+};
+
+YAHOO.ext.grid.GridDD.prototype.handleClick = function(e){
+    if(this.grid.selModel.isLocked()){
+         setTimeout(this.unlockDelegate, 1);
+         YAHOO.util.Event.stopEvent(e);
+    }
+};
+
+/**
+ * Updates the DD visual element to allow/not allow a drop
+ * @param {Boolean} dropStatus True if drop is allowed on the target
+ */
+YAHOO.ext.grid.GridDD.prototype.setDropStatus = function(dropStatus){
+    if(dropStatus === true){
+        YAHOO.util.Dom.replaceClass(this.ddicon, 'ygrid-drop-nodrop', 'ygrid-drop-ok');
+    }else{
+        YAHOO.util.Dom.replaceClass(this.ddicon, 'ygrid-drop-ok', 'ygrid-drop-nodrop');
+    }
+};
+
+YAHOO.ext.grid.GridDD.prototype.startDrag = function(e){
+    this.ddtext.innerHTML = this.grid.getDragDropText();
+    this.setDropStatus(false);
+    this.grid.selModel.lock();
+    this.grid.fireEvent('startdrag', this.grid, this, e);
+};
+       
+YAHOO.ext.grid.GridDD.prototype.endDrag = function(e){
+    YAHOO.util.Dom.setStyle(this.ddproxy, 'visibility', 'hidden');
+    this.grid.fireEvent('enddrag', this.grid, this, e);
+};
+
+YAHOO.ext.grid.GridDD.prototype.autoOffset = function(iPageX, iPageY) {
+    this.setDelta(-12, -20);
+};
+
+YAHOO.ext.grid.GridDD.prototype.onDragEnter = function(e, id) {
+    this.setDropStatus(true);
+    this.grid.fireEvent('dragenter', this.grid, this, id, e);
+};
+
+YAHOO.ext.grid.GridDD.prototype.onDragDrop = function(e, id) {
+    this.grid.fireEvent('dragdrop', this.grid, this, id, e);
+};
+
+YAHOO.ext.grid.GridDD.prototype.onDragOver = function(e, id) {
+    this.grid.fireEvent('dragover', this.grid, this, id, e);
+};
+
+YAHOO.ext.grid.GridDD.prototype.onDragOut = function(e, id) {
+    this.setDropStatus(false);
+    this.grid.fireEvent('dragout', this.grid, this, id, e);
+};
+};
diff --git a/frontend/beta/js/YUI-extensions/grid/GridView.js b/frontend/beta/js/YUI-extensions/grid/GridView.js
new file mode 100644
index 0000000..dbd47e3
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/GridView.js
@@ -0,0 +1,790 @@
+/**
+ * @class YAHOO.ext.grid.GridView
+ * Default UI code used internally by the Grid. This is the object returned by {@link YAHOO.ext.grid.Grid#getView}.
+ * @constructor
+ */
+YAHOO.ext.grid.GridView = function(){
+	this.grid = null;
+	this.lastFocusedRow = null;
+	this.onScroll = new YAHOO.util.CustomEvent('onscroll');
+	this.adjustScrollTask = new YAHOO.ext.util.DelayedTask(this._adjustForScroll, this);
+	this.ensureVisibleTask = new YAHOO.ext.util.DelayedTask();
+};
+
+YAHOO.ext.grid.GridView.prototype = {
+	init: function(grid){
+		this.grid = grid;
+	},
+	
+	fireScroll: function(scrollLeft, scrollTop){
+		this.onScroll.fireDirect(this.grid, scrollLeft, scrollTop);
+	},
+	
+	/**
+	 * @private
+	 * Utility method that gets an array of the cell renderers
+	 */
+	getColumnRenderers : function(){
+    	var renderers = [];
+    	var cm = this.grid.colModel;
+        var colCount = cm.getColumnCount();
+        for(var i = 0; i < colCount; i++){
+            renderers.push(cm.getRenderer(i));
+        }
+        return renderers;
+    },
+    
+    buildIndexMap : function(){
+        var colToData = {};
+        var dataToCol = {};
+        var cm = this.grid.colModel;
+        for(var i = 0, len = cm.getColumnCount(); i < len; i++){
+            var di = cm.getDataIndex(i);
+            colToData[i] = di;
+            dataToCol[di] = i;
+        }
+        return {'colToData': colToData, 'dataToCol': dataToCol};
+    },
+    
+    getDataIndexes : function(){
+    	if(!this.indexMap){
+            this.indexMap = this.buildIndexMap();
+        }
+        return this.indexMap.colToData;
+    },
+    
+    getColumnIndexByDataIndex : function(dataIndex){
+        if(!this.indexMap){
+            this.indexMap = this.buildIndexMap();
+        }
+    	return this.indexMap.dataToCol[dataIndex];
+    },
+    
+    updateHeaders : function(){
+        var colModel = this.grid.colModel;
+        var hcells = this.headers;
+        var colCount = colModel.getColumnCount();
+        for(var i = 0; i < colCount; i++){
+            hcells[i].textNode.innerHTML = colModel.getColumnHeader(i);
+        }
+    },
+    
+    adjustForScroll : function(disableDelay){
+        if(!disableDelay){
+            this.adjustScrollTask.delay(50);
+        }else{
+            this._adjustForScroll();
+        }
+    },
+    
+    /**
+     * Returns the rowIndex/columnIndex of the cell found at the passed page coordinates
+     * @param {Number} x
+     * @param {Number} y
+     * @return {Array} [rowIndex, columnIndex]
+     */
+     getCellAtPoint : function(x, y){
+        var colIndex = null;        
+        var rowIndex = null;
+        
+        // translate page coordinates to local coordinates
+        var xy = YAHOO.util.Dom.getXY(this.wrap);
+        x = (x - xy[0]) + this.wrap.scrollLeft;
+        y = (y - xy[1]) + this.wrap.scrollTop;
+        
+        var colModel = this.grid.colModel;
+        var pos = 0;
+        var colCount = colModel.getColumnCount();
+        for(var i = 0; i < colCount; i++){
+            if(colModel.isHidden(i)) continue;
+            var width = colModel.getColumnWidth(i);
+            if(x >= pos && x < pos+width){
+                colIndex = i;
+                break;
+            }
+            pos += width;
+        }
+        if(colIndex != null){
+            rowIndex = (y == 0 ? 0 : Math.floor(y / this.getRowHeight()));
+            if(rowIndex >= this.grid.dataModel.getRowCount()){
+                return null;
+            }
+            return [colIndex, rowIndex];
+        }
+        return null;
+    },
+    
+    /** @private */
+    _adjustForScroll : function(){
+        this.forceScrollUpdate();
+        if(this.scrollbarMode == YAHOO.ext.grid.GridView.SCROLLBARS_OVERLAP){
+            var adjustment = 0;
+            if(this.wrap.clientWidth && this.wrap.clientWidth !== 0){
+                adjustment = this.wrap.offsetWidth - this.wrap.clientWidth;
+            }
+            this.hwrap.setWidth(this.wrap.offsetWidth-adjustment);
+        }else{
+            this.hwrap.setWidth(this.wrap.offsetWidth);
+        }
+        this.bwrap.setWidth(Math.max(this.grid.colModel.getTotalWidth(), this.wrap.clientWidth));
+    },
+
+    /**
+     * Focuses the specified row. The preferred way to scroll to a row is {@link #ensureVisible}.
+     * @param {Number/HTMLElement} row The index of a row or the row itself
+     */
+     focusRow : function(row){
+        if(typeof row == 'number'){
+            row = this.getBodyTable().childNodes[row];
+        }
+        if(!row) return;
+    	var left = this.wrap.scrollLeft;
+    	try{ // try catch for IE occasional focus bug
+    	    row.childNodes.item(0).hideFocus = true;
+        	row.childNodes.item(0).focus();
+        }catch(e){}
+        this.ensureVisible(row);
+        this.wrap.scrollLeft = left;
+        this.handleScroll();
+        this.lastFocusedRow = row;
+    },
+
+    /**
+     * Scrolls the specified row into view. This call is automatically buffered (delayed), to disable
+     * the delay, pass true for disableDelay. 
+     * @param {Number/HTMLElement} row The index of a row or the row itself
+     * @param {Boolean} disableDelay
+     */
+     ensureVisible : function(row, disableDelay){
+        if(!disableDelay){
+            this.ensureVisibleTask.delay(50, this._ensureVisible, this, [row]);
+        }else{
+            this._ensureVisible(row);
+        }
+    },
+
+    /** @ignore */
+    _ensureVisible : function(row){
+        if(typeof row == 'number'){
+            row = this.getBodyTable().childNodes[row];
+        }
+        if(!row) return;
+    	var left = this.wrap.scrollLeft;
+    	var rowTop = parseInt(row.offsetTop, 10); // parseInt for safari bug
+        var rowBottom = rowTop + row.offsetHeight;
+        var clientTop = parseInt(this.wrap.scrollTop, 10); // parseInt for safari bug
+        var clientBottom = clientTop + this.wrap.clientHeight;
+        if(rowTop < clientTop){
+        	this.wrap.scrollTop = rowTop;
+        }else if(rowBottom > clientBottom){
+            this.wrap.scrollTop = rowBottom-this.wrap.clientHeight;
+        }
+        this.wrap.scrollLeft = left;
+        this.handleScroll();
+    },
+    
+    updateColumns : function(){
+        this.grid.stopEditing();
+        var colModel = this.grid.colModel;
+        var hcols = this.headers;
+        var colCount = colModel.getColumnCount();
+        var pos = 0;
+        var totalWidth = colModel.getTotalWidth();
+        for(var i = 0; i < colCount; i++){
+            if(colModel.isHidden(i)) continue;
+            var width = colModel.getColumnWidth(i);
+            hcols[i].style.width = width + 'px';
+            hcols[i].style.left = pos + 'px';
+            hcols[i].split.style.left = (pos+width-3) + 'px';
+            this.setCSSWidth(i, width, pos);
+            pos += width;
+        }
+        this.lastWidth = totalWidth;
+        if(this.grid.autoWidth){
+            this.grid.container.setWidth(totalWidth+this.grid.container.getBorderWidth('lr'));
+            this.grid.autoSize();
+        }
+        this.bwrap.setWidth(Math.max(totalWidth, this.wrap.clientWidth));
+        if(!YAHOO.ext.util.Browser.isIE){ // fix scrolling prob in gecko and opera
+        	this.wrap.scrollLeft = this.hwrap.dom.scrollLeft;
+        }
+        this.syncScroll();
+        this.forceScrollUpdate();
+        if(this.grid.autoHeight){
+            this.autoHeight();
+            this.updateWrapHeight();
+        }
+    },
+    
+    setCSSWidth : function(colIndex, width, pos){
+        var selector = ["#" + this.grid.id + " .ygrid-col-" + colIndex, ".ygrid-col-" + colIndex];
+        YAHOO.ext.util.CSS.updateRule(selector, 'width', width + 'px');
+        if(typeof pos == 'number'){
+            YAHOO.ext.util.CSS.updateRule(selector, 'left', pos + 'px');
+        }
+    },
+    
+    /**
+     * Set a css style for a column dynamically. 
+     * @param {Number} colIndex The index of the column
+     * @param {String} name The css property name
+     * @param {String} value The css value
+     */
+     setCSSStyle : function(colIndex, name, value){
+        var selector = ["#" + this.grid.id + " .ygrid-col-" + colIndex, ".ygrid-col-" + colIndex];
+        YAHOO.ext.util.CSS.updateRule(selector, name, value);
+    },
+    
+    handleHiddenChange : function(colModel, colIndex, hidden){
+        if(hidden){
+            this.hideColumn(colIndex);
+        }else{
+            this.unhideColumn(colIndex);
+        }
+        this.updateColumns();
+    },
+    
+    hideColumn : function(colIndex){
+        var selector = ["#" + this.grid.id + " .ygrid-col-" + colIndex, ".ygrid-col-" + colIndex];
+        YAHOO.ext.util.CSS.updateRule(selector, 'position', 'absolute');
+        YAHOO.ext.util.CSS.updateRule(selector, 'visibility', 'hidden');
+        
+        this.headers[colIndex].style.display = 'none';
+        this.headers[colIndex].split.style.display = 'none';
+    },
+    
+    unhideColumn : function(colIndex){
+        var selector = ["#" + this.grid.id + " .ygrid-col-" + colIndex, ".ygrid-col-" + colIndex];
+        YAHOO.ext.util.CSS.updateRule(selector, 'position', '');
+        YAHOO.ext.util.CSS.updateRule(selector, 'visibility', 'visible');
+        
+        this.headers[colIndex].style.display = '';
+        this.headers[colIndex].split.style.display = '';
+    },
+    
+    getBodyTable : function(){
+    	return this.bwrap.dom;
+    },
+    
+    updateRowIndexes : function(firstRow, lastRow){
+        var stripeRows = this.grid.stripeRows;
+        var bt = this.getBodyTable();
+        var nodes = bt.childNodes;
+        firstRow = firstRow || 0;
+        lastRow = lastRow || nodes.length-1;
+        var re = /^(?:ygrid-row ygrid-row-alt|ygrid-row)/;
+        for(var rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){
+            var node = nodes[rowIndex];
+            if(stripeRows && (rowIndex+1) % 2 == 0){
+        		node.className = node.className.replace(re, 'ygrid-row ygrid-row-alt');
+        	}else{
+        		node.className = node.className.replace(re, 'ygrid-row');
+        	}
+            node.rowIndex = rowIndex;
+            nodes[rowIndex].style.top = (rowIndex * this.rowHeight) + 'px';
+        }
+    },
+
+    insertRows : function(dataModel, firstRow, lastRow){
+        this.updateBodyHeight();
+        this.adjustForScroll(true);
+        var renderers = this.getColumnRenderers();
+        var dindexes = this.getDataIndexes();
+        var colCount = this.grid.colModel.getColumnCount();
+        var beforeRow = null;
+        var bt = this.getBodyTable();
+        if(firstRow < bt.childNodes.length){
+            beforeRow = bt.childNodes[firstRow];
+        }
+        for(var rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){
+            var row = document.createElement('span');
+            row.className = 'ygrid-row';
+            row.style.top = (rowIndex * this.rowHeight) + 'px';
+            this.renderRow(dataModel, row, rowIndex, colCount, renderers, dindexes);
+            if(beforeRow){
+            	bt.insertBefore(row, beforeRow);
+            }else{
+                bt.appendChild(row);
+            }
+        }
+        this.updateRowIndexes(firstRow);
+        this.adjustForScroll(true);
+    },
+    
+    renderRow : function(dataModel, row, rowIndex, colCount, renderers, dindexes){
+        for(var colIndex = 0; colIndex < colCount; colIndex++){
+            var td = document.createElement('span');
+            td.className = 'ygrid-col ygrid-col-' + colIndex + (colIndex == colCount-1 ? ' ygrid-col-last' : '');
+            td.columnIndex = colIndex;
+            td.tabIndex = 0;
+            var span = document.createElement('span');
+            span.className = 'ygrid-cell-text';
+            td.appendChild(span);
+            var val = renderers[colIndex](dataModel.getValueAt(rowIndex, dindexes[colIndex]), rowIndex, colIndex, td, dataModel);
+            if(typeof val == 'undefined' || val === '') val = '&#160;';
+            span.innerHTML = val;
+            row.appendChild(td);
+        }
+    },
+    
+    deleteRows : function(dataModel, firstRow, lastRow){
+        this.updateBodyHeight();
+        // first make sure they are deselected
+        this.grid.selModel.deselectRange(firstRow, lastRow);
+        var bt = this.getBodyTable();
+        var rows = []; // get references because the rowIndex will change
+        for(var rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){
+            rows.push(bt.childNodes[rowIndex]);
+        }
+        for(var i = 0; i < rows.length; i++){
+            bt.removeChild(rows[i]);
+            rows[i] = null;
+        }
+        rows = null;
+        this.updateRowIndexes(firstRow);
+        this.adjustForScroll();
+    },
+    
+    updateRows : function(dataModel, firstRow, lastRow){
+        var bt = this.getBodyTable();
+        var dindexes = this.getDataIndexes();
+        var renderers = this.getColumnRenderers();
+        var colCount = this.grid.colModel.getColumnCount();
+        for(var rowIndex = firstRow; rowIndex <= lastRow; rowIndex++){
+            var row = bt.rows[rowIndex];
+            var cells = row.childNodes;
+            for(var colIndex = 0; colIndex < colCount; colIndex++){
+                var td = cells[colIndex];
+                var val = renderers[colIndex](dataModel.getValueAt(rowIndex, dindexes[colIndex]), rowIndex, colIndex, td, dataModel);
+                if(typeof val == 'undefined' || val === '') val = '&#160;';
+                td.firstChild.innerHTML = val;
+            }
+        }
+    },
+    
+    handleSort : function(dataModel, sortColumnIndex, sortDir, noRefresh){
+		var	selectedRows;
+        this.grid.selModel.syncSelectionsToIds();
+        if(!noRefresh){
+           this.updateRows(dataModel, 0, dataModel.getRowCount()-1);
+        }
+        this.updateHeaderSortState();
+		selectedRows = this.grid.selModel.getSelectedRows();
+		if (selectedRows.length > 0) {
+			this.focusRow(selectedRows[0]);
+		}
+    },
+    
+    syncScroll : function(){
+        this.hwrap.dom.scrollLeft = this.wrap.scrollLeft;
+    },
+    
+    handleScroll : function(){
+        this.syncScroll();
+        this.fireScroll(this.wrap.scrollLeft, this.wrap.scrollTop);
+        this.grid.fireEvent('bodyscroll', this.wrap.scrollLeft, this.wrap.scrollTop);
+    },
+    
+    getRowHeight : function(){
+        if(!this.rowHeight){
+            var rule = YAHOO.ext.util.CSS.getRule(["#" + this.grid.id + " .ygrid-row", ".ygrid-row"]);
+        	if(rule && rule.style.height){
+        	    this.rowHeight = parseInt(rule.style.height, 10);
+        	}else{
+        	    this.rowHeight = 21;
+        	}
+        }
+        return this.rowHeight;
+    },
+    
+    renderRows : function(dataModel){
+        this.grid.stopEditing();
+        if(this.grid.selModel){
+            this.grid.selModel.clearSelections();
+        }
+    	var bt = this.getBodyTable();
+    	bt.innerHTML = '';
+    	this.rowHeight = this.getRowHeight();
+    	this.insertRows(dataModel, 0, dataModel.getRowCount()-1);
+    },
+    
+    updateCell : function(dataModel, rowIndex, dataIndex){
+        var colIndex = this.getColumnIndexByDataIndex(dataIndex);
+        if(typeof colIndex == 'undefined'){ // not present in grid
+            return;
+        }
+        var bt = this.getBodyTable();
+        var row = bt.childNodes[rowIndex];
+        var cell = row.childNodes[colIndex];
+        var renderer = this.grid.colModel.getRenderer(colIndex);
+        var val = renderer(dataModel.getValueAt(rowIndex, dataIndex), rowIndex, colIndex, cell, dataModel);
+        if(typeof val == 'undefined' || val === '') val = '&#160;';
+        cell.firstChild.innerHTML = val;
+    },
+    
+    calcColumnWidth : function(colIndex, maxRowsToMeasure){
+        var maxWidth = 0;
+        var bt = this.getBodyTable();
+        var rows = bt.childNodes;
+        var stopIndex = Math.min(maxRowsToMeasure || rows.length, rows.length);
+        if(this.grid.autoSizeHeaders){
+            var h = this.headers[colIndex];
+            var curWidth = h.style.width;
+            h.style.width = this.grid.minColumnWidth+'px';
+            maxWidth = Math.max(maxWidth, h.scrollWidth);
+            h.style.width = curWidth;
+        }
+        for(var i = 0; i < stopIndex; i++){
+            var cell = rows[i].childNodes[colIndex].firstChild;
+            maxWidth = Math.max(maxWidth, cell.scrollWidth);
+        }
+        return maxWidth + /*margin for error in IE*/ 5;
+    },
+    
+    /**
+     * Autofit a column to it's content.
+     * @param {Number} colIndex
+     * @param {Boolean} forceMinSize true to force the column to go smaller if possible
+     */
+     autoSizeColumn : function(colIndex, forceMinSize){
+        if(forceMinSize){
+           this.setCSSWidth(colIndex, this.grid.minColumnWidth);
+        }
+        var newWidth = this.calcColumnWidth(colIndex);
+        this.grid.colModel.setColumnWidth(colIndex,
+            Math.max(this.grid.minColumnWidth, newWidth));
+        this.grid.fireEvent('columnresize', colIndex, newWidth);
+    },
+    
+    /**
+     * Autofits all columns to their content and then expands to fit any extra space in the grid
+     */
+     autoSizeColumns : function(){
+        var colModel = this.grid.colModel;
+        var colCount = colModel.getColumnCount();
+        var wrap = this.wrap;
+        for(var i = 0; i < colCount; i++){
+            this.setCSSWidth(i, this.grid.minColumnWidth);
+            colModel.setColumnWidth(i, this.calcColumnWidth(i, this.grid.maxRowsToMeasure), true);
+        }
+        if(colModel.getTotalWidth() < wrap.clientWidth){
+            var diff = Math.floor((wrap.clientWidth - colModel.getTotalWidth()) / colCount);
+            for(var i = 0; i < colCount; i++){
+                colModel.setColumnWidth(i, colModel.getColumnWidth(i) + diff, true);
+            }
+        }
+        this.updateColumns();  
+    },
+    
+    /**
+     * Autofits all columns to the grid's width proportionate with their current size
+     */
+    fitColumns : function(){
+        var cm = this.grid.colModel;
+        var colCount = cm.getColumnCount();
+        var cols = [];
+        var width = 0;
+        var i, w;
+        for (i = 0; i < colCount; i++){
+            if(!cm.isHidden(i) && !cm.isFixed(i)){
+                w = cm.getColumnWidth(i);
+                cols.push(i);
+                cols.push(w);
+                width += w;
+            }
+        }
+        var frac = (this.wrap.clientWidth - cm.getTotalWidth())/width;
+        while (cols.length){
+            w = cols.pop();
+            i = cols.pop();
+            cm.setColumnWidth(i, Math.floor(w + w*frac), true);
+        }
+        this.updateColumns();
+    }, 
+    
+    onWindowResize : function(){
+        if(this.grid.monitorWindowResize){
+            this.adjustForScroll();
+            this.updateWrapHeight();
+            this.adjustForScroll();
+        }  
+    },
+    
+    updateWrapHeight : function(){
+        this.grid.container.beginMeasure();
+        this.autoHeight();
+        var box = this.grid.container.getSize(true);
+        this.wrapEl.setHeight(box.height-this.footerHeight-parseInt(this.wrap.offsetTop, 10));
+        this.pwrap.setSize(box.width, box.height);
+        this.grid.container.endMeasure();
+    },
+    
+    forceScrollUpdate : function(){
+        var wrap = this.wrapEl;
+        wrap.setWidth(wrap.getWidth(true));
+        setTimeout(function(){ // set timeout so FireFox works
+            wrap.setWidth('');
+        }, 1);
+    },
+    
+    updateHeaderSortState : function(){
+        var state = this.grid.dataModel.getSortState();
+        if(!state || typeof state.column == 'undefined') return;
+        var sortColumn = this.getColumnIndexByDataIndex(state.column);
+        var sortDir = state.direction;
+        for(var i = 0, len = this.headers.length; i < len; i++){
+            var h = this.headers[i];
+            if(i != sortColumn){
+                h.sortDesc.style.display = 'none';
+                h.sortAsc.style.display = 'none';
+                YAHOO.util.Dom.removeClass(h, 'ygrid-sort-col');
+            }else{
+                h.sortDesc.style.display = sortDir == 'DESC' ? 'block' : 'none';
+                h.sortAsc.style.display = sortDir == 'ASC' ? 'block' : 'none';
+                YAHOO.util.Dom.addClass(h, 'ygrid-sort-col');
+            }
+        }
+    },
+
+    unplugDataModel : function(dm){
+        dm.removeListener('cellupdated', this.updateCell, this);
+        dm.removeListener('datachanged', this.renderRows, this);
+        dm.removeListener('rowsdeleted', this.deleteRows, this);
+        dm.removeListener('rowsinserted', this.insertRows, this);
+        dm.removeListener('rowsupdated', this.updateRows, this);
+        dm.removeListener('rowssorted', this.handleSort, this);
+    },
+    
+    plugDataModel : function(dm){
+        dm.on('cellupdated', this.updateCell, this, true);
+        dm.on('datachanged', this.renderRows, this, true);
+        dm.on('rowsdeleted', this.deleteRows, this, true);
+        dm.on('rowsinserted', this.insertRows, this, true);
+        dm.on('rowsupdated', this.updateRows, this, true);
+        dm.on('rowssorted', this.handleSort, this, true);
+    },
+    
+    destroy : function(){
+        this.unplugDataModel(this.grid.dataModel);
+        var sp = this.splitters;
+        if(sp){
+            for(var i in sp){
+                if(sp[i] && typeof sp[i] != 'function'){
+                    sp[i].destroy(true);
+                }
+            }
+        }
+    },
+    
+    render : function(){
+        var grid = this.grid;
+        var container = grid.container.dom;
+        var dataModel = grid.dataModel;
+        this.plugDataModel(dataModel);
+    
+        var colModel = grid.colModel;
+        colModel.onWidthChange.subscribe(this.updateColumns, this, true);
+        colModel.onHeaderChange.subscribe(this.updateHeaders, this, true);
+        colModel.onHiddenChange.subscribe(this.handleHiddenChange, this, true);
+        
+        if(grid.monitorWindowResize === true){
+            YAHOO.ext.EventManager.onWindowResize(this.onWindowResize, this, true);
+        }
+        var autoSizeDelegate = this.autoSizeColumn.createDelegate(this);
+        
+        var colCount = colModel.getColumnCount();
+        
+        var dh = YAHOO.ext.DomHelper;
+        this.pwrap = dh.append(container, 
+            {tag: 'div', cls: 'ygrid-positioner', 
+            style: 'position:relative;width:100%;height:100%;left:0;top:0;overflow:hidden;'}, true);
+        var pos = this.pwrap.dom;
+        
+        //create wrapper elements that handle offsets and scrolling
+        var wrap = dh.append(pos, {tag: 'div', cls: 'ygrid-wrap'});
+        this.wrap = wrap;
+        this.wrapEl = getEl(wrap, true);
+        YAHOO.ext.EventManager.on(wrap, 'scroll', this.handleScroll, this, true);
+        
+        var hwrap = dh.append(pos, {tag: 'div', cls: 'ygrid-wrap-headers'});
+        this.hwrap = getEl(hwrap, true);
+        
+        var bwrap = dh.append(wrap, {tag: 'div', cls: 'ygrid-wrap-body', id: container.id + '-body'});
+        this.bwrap = getEl(bwrap, true);
+        this.bwrap.setWidth(colModel.getTotalWidth());
+        bwrap.rows = bwrap.childNodes;
+        
+        this.footerHeight = 0;
+        var foot = this.appendFooter(this.pwrap.dom);
+        if(foot){
+            this.footer = getEl(foot, true);
+            this.footerHeight = this.footer.getHeight();
+        }
+        this.updateWrapHeight();
+        
+        var hrow = dh.append(hwrap, {tag: 'span', cls: 'ygrid-hrow'});
+        this.hrow = hrow;
+        
+        if(!YAHOO.ext.util.Browser.isGecko){
+            // IE doesn't like iframes, we will leave this alone
+            var iframe = document.createElement('iframe');
+            iframe.className = 'ygrid-hrow-frame';
+            iframe.frameBorder = 0;
+            iframe.src = YAHOO.ext.SSL_SECURE_URL;
+            hwrap.appendChild(iframe);
+        }
+        this.headerCtrl = new YAHOO.ext.grid.HeaderController(this.grid);
+        this.headers = [];
+        this.cols = [];
+        this.splitters = [];
+        
+        var htemplate = dh.createTemplate({
+           tag: 'span', cls: 'ygrid-hd ygrid-header-{0}', children: [{
+                tag: 'span',
+                cls: 'ygrid-hd-body',
+                html: '<table border="0" cellpadding="0" cellspacing="0" title="{2}">' +
+                      '<tbody><tr><td><span>{1}</span></td>' +
+                      '<td><span class="sort-desc"></span><span class="sort-asc"></span></td>' +
+                      '</tr></tbody></table>'
+           }]
+        });
+        htemplate.compile();
+        
+        var ruleBuf = [];
+                
+        for(var i = 0; i < colCount; i++){
+            var hd = htemplate.append(hrow, [i, colModel.getColumnHeader(i), colModel.getColumnTooltip(i) || '']);
+            var spans = hd.getElementsByTagName('span');
+            hd.textNode = spans[1];
+            hd.sortDesc = spans[2];
+            hd.sortAsc = spans[3];
+    	    hd.columnIndex = i;
+            this.headers.push(hd);
+            if(colModel.isSortable(i)){
+                this.headerCtrl.register(hd);
+            }
+            var split = dh.append(hrow, {tag: 'span', cls: 'ygrid-hd-split'});
+            hd.split = split;
+        	
+        	if(colModel.isResizable(i) && !colModel.isFixed(i)){
+            	YAHOO.util.Event.on(split, 'dblclick', autoSizeDelegate.createCallback(i+0, true));
+            	var sb = new YAHOO.ext.SplitBar(split, hd, null, YAHOO.ext.SplitBar.LEFT);
+            	sb.columnIndex = i;
+            	sb.minSize = grid.minColumnWidth;
+            	sb.onMoved.subscribe(this.onColumnSplitterMoved, this, true);
+            	YAHOO.util.Dom.addClass(sb.proxy, 'ygrid-column-sizer');
+            	YAHOO.util.Dom.setStyle(sb.proxy, 'background-color', '');
+            	sb.dd._resizeProxy = function(){
+            	    var el = this.getDragEl();
+            	    YAHOO.util.Dom.setStyle(el, 'height', (hwrap.clientHeight+wrap.clientHeight-2) +'px');
+            	};
+            	this.splitters[i] = sb;
+        	}else{
+        	    split.style.cursor = 'default';
+        	}
+        	ruleBuf.push('#', container.id, ' .ygrid-col-', i, ' {\n}\n');        	
+        }
+        
+        YAHOO.ext.util.CSS.createStyleSheet(ruleBuf.join(''));
+        
+        if(grid.autoSizeColumns){
+            this.renderRows(dataModel);
+            this.autoSizeColumns();
+        }else{
+            this.updateColumns();
+            this.renderRows(dataModel);
+        }
+        
+        for(var i = 0; i < colCount; i++){
+            if(colModel.isHidden(i)){
+                this.hideColumn(i);
+            }
+        }
+        this.updateHeaderSortState();
+        return this.bwrap;
+    },
+    
+    onColumnSplitterMoved : function(splitter, newSize){
+        this.grid.colModel.setColumnWidth(splitter.columnIndex, newSize);
+        this.grid.fireEvent('columnresize', splitter.columnIndex, newSize);
+    },
+    
+    appendFooter : function(parentEl){
+        return null;  
+    },
+    
+    autoHeight : function(){
+        if(this.grid.autoHeight){
+            var h = this.getBodyHeight();
+            var c = this.grid.container;
+            var total = h + (parseInt(this.wrap.offsetTop, 10)||0) + 
+                    this.footerHeight + c.getBorderWidth('tb') + c.getPadding('tb')
+                    + (this.wrap.offsetHeight - this.wrap.clientHeight);
+            c.setHeight(total);
+            
+        }
+    },
+    
+    getBodyHeight : function(){
+        return this.grid.dataModel.getRowCount() * this.getRowHeight();;
+    },
+    
+    updateBodyHeight : function(){
+        this.getBodyTable().style.height = this.getBodyHeight() + 'px';
+        if(this.grid.autoHeight){
+            this.autoHeight();
+            this.updateWrapHeight();
+        }
+    }
+};
+YAHOO.ext.grid.GridView.SCROLLBARS_UNDER = 0;
+YAHOO.ext.grid.GridView.SCROLLBARS_OVERLAP = 1;
+YAHOO.ext.grid.GridView.prototype.scrollbarMode = YAHOO.ext.grid.GridView.SCROLLBARS_UNDER;
+
+YAHOO.ext.grid.GridView.prototype.fitColumnsToContainer = YAHOO.ext.grid.GridView.prototype.fitColumns;
+
+YAHOO.ext.grid.HeaderController = function(grid){
+	this.grid = grid;
+	this.headers = [];
+};
+
+YAHOO.ext.grid.HeaderController.prototype = {
+	register : function(header){
+		this.headers.push(header);
+		YAHOO.ext.EventManager.on(header, 'selectstart', this.cancelTextSelection, this, true);
+        YAHOO.ext.EventManager.on(header, 'mousedown', this.cancelTextSelection, this, true);
+        YAHOO.ext.EventManager.on(header, 'mouseover', this.headerOver, this, true);
+        YAHOO.ext.EventManager.on(header, 'mouseout', this.headerOut, this, true);
+        YAHOO.ext.EventManager.on(header, 'click', this.headerClick, this, true);
+	},
+	
+	headerClick : function(e){
+	    var grid = this.grid, cm = grid.colModel, dm = grid.dataModel;
+	    grid.stopEditing();
+        var header = grid.getHeaderFromChild(e.getTarget());
+        var state = dm.getSortState();
+        var direction = header.sortDir || 'ASC';
+        if(typeof state.column != 'undefined' && 
+                 grid.getView().getColumnIndexByDataIndex(state.column) == header.columnIndex){
+            direction = (state.direction == 'ASC' ? 'DESC' : 'ASC');
+        }
+        header.sortDir = direction;
+        dm.sort(cm, cm.getDataIndex(header.columnIndex), direction);
+    },
+    
+    headerOver : function(e){
+        var header = this.grid.getHeaderFromChild(e.getTarget());
+        YAHOO.util.Dom.addClass(header, 'ygrid-hd-over');
+        //YAHOO.ext.util.CSS.applyFirst(header, this.grid.id, '.ygrid-hd-over');
+    },
+    
+    headerOut : function(e){
+        var header = this.grid.getHeaderFromChild(e.getTarget());
+        YAHOO.util.Dom.removeClass(header, 'ygrid-hd-over');
+        //YAHOO.ext.util.CSS.revertFirst(header, this.grid.id, '.ygrid-hd-over');
+    },
+    
+    cancelTextSelection : function(e){
+    	e.preventDefault();
+    }
+};
\ No newline at end of file
diff --git a/frontend/beta/js/YUI-extensions/grid/PagedGridView.js b/frontend/beta/js/YUI-extensions/grid/PagedGridView.js
new file mode 100644
index 0000000..ecaece2
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/PagedGridView.js
@@ -0,0 +1,194 @@
+/**
+ * @class YAHOO.ext.grid.PagedGridView
+ * @extends YAHOO.ext.grid.GridView
+ * Extends the default GridView to add a paging interface.
+ * @constructor
+ * This class is created for you automatically if your data model is set to use paging.
+ */
+YAHOO.ext.grid.PagedGridView = function(){
+    YAHOO.ext.grid.PagedGridView.superclass.constructor.call(this);
+    this.cursor = 1;
+};
+
+YAHOO.extendX(YAHOO.ext.grid.PagedGridView, YAHOO.ext.grid.GridView, {
+    appendFooter : function(parentEl){
+        var fwrap = document.createElement('div');
+        fwrap.className = 'ygrid-wrap-footer';
+        var fbody = document.createElement('span');
+        fbody.className = 'ygrid-footer';
+        fwrap.appendChild(fbody);
+        parentEl.appendChild(fwrap);
+        this.createPagingToolbar(fbody);
+        return fwrap;
+    },
+
+    createPagingToolbar : function(container){
+        var tb = new YAHOO.ext.Toolbar(container);
+        this.pageToolbar = tb;
+        this.first = tb.addButton({
+            tooltip: this.firstText, 
+            className: 'ygrid-page-first',
+            disabled: true,
+            click: this.onClick.createDelegate(this, ['first'])
+        });
+        this.prev = tb.addButton({
+            tooltip: this.prevText, 
+            className: 'ygrid-page-prev', 
+            disabled: true,
+            click: this.onClick.createDelegate(this, ['prev'])
+        });
+        tb.addSeparator();
+        tb.add(this.beforePageText);
+        var pageBox = document.createElement('input');
+        pageBox.type = 'text';
+        pageBox.size = 3;
+        pageBox.value = '1';
+        pageBox.className = 'ygrid-page-number';
+        tb.add(pageBox);
+        this.field = getEl(pageBox, true);
+        this.field.mon('keydown', this.onEnter, this, true);
+        this.field.on('focus', function(){pageBox.select();});
+        this.afterTextEl = tb.addText(this.afterPageText.replace('%0', '1'));
+        this.field.setHeight(18);
+        tb.addSeparator();
+        this.next = tb.addButton({
+            tooltip: this.nextText, 
+            className: 'ygrid-page-next', 
+            disabled: true,
+            click: this.onClick.createDelegate(this, ['next'])
+        });
+        this.last = tb.addButton({
+            tooltip: this.lastText, 
+            className: 'ygrid-page-last', 
+            disabled: true,
+            click: this.onClick.createDelegate(this, ['last'])
+        });
+        tb.addSeparator();
+        this.loading = tb.addButton({
+            tooltip: this.refreshText, 
+            className: 'ygrid-loading',
+            disabled: true,
+            click: this.onClick.createDelegate(this, ['refresh'])
+        });
+        this.onPageLoaded(1, this.grid.dataModel.getTotalPages());
+    },
+    
+    /**
+     * Returns the toolbar used for paging so you can add new buttons.
+     * @return {YAHOO.ext.Toolbar}
+     */
+    getPageToolbar : function(){
+        return this.pageToolbar;  
+    },
+    
+    onPageLoaded : function(pageNum, totalPages){
+        this.cursor = pageNum;
+        this.lastPage = totalPages;
+        this.afterTextEl.innerHTML = this.afterPageText.replace('%0', totalPages);
+        this.field.dom.value = pageNum;
+        this.first.setDisabled(pageNum == 1);
+        this.prev.setDisabled(pageNum == 1);
+        this.next.setDisabled(pageNum == totalPages);
+        this.last.setDisabled(pageNum == totalPages);
+        this.loading.enable();
+    },
+    
+    onLoadError : function(){
+        this.loading.enable();
+    },
+    
+    onEnter : function(e){
+        if(e.browserEvent.keyCode == e.RETURN){
+            var v = this.field.dom.value;
+            if(!v){
+                this.field.dom.value = this.cursor;
+                return;
+            }
+            var pageNum = parseInt(v, 10);
+            if(isNaN(pageNum)){
+                this.field.dom.value = this.cursor;
+                return;
+            }
+            pageNum = Math.min(Math.max(1, pageNum), this.lastPage);
+            this.grid.dataModel.loadPage(pageNum);
+            e.stopEvent();
+        }
+    },
+    
+    beforeLoad : function(){
+        this.grid.stopEditing();
+        if(this.loading){
+            this.loading.disable();
+        }  
+    },
+    
+    onClick : function(which){
+        switch(which){
+            case 'first':
+                this.grid.dataModel.loadPage(1);
+            break;
+            case 'prev':
+                this.grid.dataModel.loadPage(this.cursor -1);
+            break;
+            case 'next':
+                this.grid.dataModel.loadPage(this.cursor + 1);
+            break;
+            case 'last':
+                this.grid.dataModel.loadPage(this.lastPage);
+            break;
+            case 'refresh':
+                this.grid.dataModel.loadPage(this.cursor);
+            break;
+        }
+    },
+    
+    unplugDataModel : function(dm){
+        dm.removeListener('beforeload', this.beforeLoad, this);
+        dm.removeListener('load', this.onPageLoaded, this);
+        dm.removeListener('loadexception', this.onLoadError, this);
+        YAHOO.ext.grid.PagedGridView.superclass.unplugDataModel.call(this, dm);
+    },
+    
+    plugDataModel : function(dm){
+        dm.on('beforeload', this.beforeLoad, this, true);
+        dm.on('load', this.onPageLoaded, this, true);
+        dm.on('loadexception', this.onLoadError, this);
+        YAHOO.ext.grid.PagedGridView.superclass.plugDataModel.call(this, dm);
+    },
+    
+    /**
+     * Customizable piece of the default paging text (defaults to "Page")
+     * @type String
+     */
+    beforePageText : "Page",
+    /**
+     * Customizable piece of the default paging text (defaults to "of %0")
+     * @type String
+     */
+    afterPageText : "of %0",
+    /**
+     * Customizable piece of the default paging text (defaults to "First Page")
+     * @type String
+     */
+    firstText : "First Page",
+    /**
+     * Customizable piece of the default paging text (defaults to "Previous Page")
+     * @type String
+     */
+    prevText : "Previous Page",
+    /**
+     * Customizable piece of the default paging text (defaults to "Next Page")
+     * @type String
+     */
+    nextText : "Next Page",
+    /**
+     * Customizable piece of the default paging text (defaults to "Last Page")
+     * @type String
+     */
+    lastText : "Last Page",
+    /**
+     * Customizable piece of the default paging text (defaults to "Refresh")
+     * @type String
+     */
+    refreshText : "Refresh"
+});
diff --git a/frontend/beta/js/YUI-extensions/grid/SelectionModel.js b/frontend/beta/js/YUI-extensions/grid/SelectionModel.js
new file mode 100644
index 0000000..6981440
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/SelectionModel.js
@@ -0,0 +1,445 @@
+/**
+ @class YAHOO.ext.grid.DefaultSelectionModel
+ * @extends YAHOO.ext.util.Observable
+ * The default SelectionModel used by {@link YAHOO.ext.grid.Grid}. 
+ It supports multiple selections and keyboard selection/navigation. <br><br>
+ @constructor
+ */
+YAHOO.ext.grid.DefaultSelectionModel = function(){
+    this.selectedRows = [];
+    this.selectedRowIds = [];
+    this.lastSelectedRow = null;
+    
+    this.onRowSelect = new YAHOO.util.CustomEvent('SelectionTable.rowSelected');
+    this.onSelectionChange = new YAHOO.util.CustomEvent('SelectionTable.selectionChanged');
+    
+    this.events = {
+        /**
+	     * @event selectionchange
+	     * Fires when the selection changes 
+	     * @param {SelectionModel} this
+	     * @param {Array} rows Array of row elements that are selected
+	     * @param {String} ids Array of ids that are selected
+	     */
+	    'selectionchange' : this.onSelectionChange,
+        /**
+	     * @event rowselect
+	     * Fires when a row is selected or deselected
+	     * @param {SelectionModel} this
+	     * @param {HTMLElement} row The row element
+	     * @param {Boolean} selected true if the row was selected, false if deselected
+	     */
+	    'rowselect' : this.onRowSelect
+    };
+    
+    this.locked = false;
+};
+
+YAHOO.ext.grid.DefaultSelectionModel.prototype = {
+    /** @ignore Called by the grid automatically. Do not call directly. */
+    init : function(grid){
+        this.grid = grid;
+        this.initEvents();
+    },
+    
+    /**
+     * Lock the selections
+     */
+    lock : function(){
+        this.locked = true;
+    },
+    
+    /**
+     * Unlock the selections
+     */
+    unlock : function(){
+        this.locked = false;  
+    },
+    
+    /**
+     * Returns true if the selections are locked
+     * @return {Boolean}
+     */
+    isLocked : function(){
+        return this.locked;    
+    },
+    
+    /** @ignore */
+    initEvents : function(){
+        if(this.grid.trackMouseOver){
+        	this.grid.addListener("mouseover", this.handleOver, this, true);
+        	this.grid.addListener("mouseout", this.handleOut, this, true);
+        }
+        this.grid.addListener("rowclick", this.rowClick, this, true);
+        this.grid.addListener("keydown", this.keyDown, this, true);
+    },
+    
+    fireEvent : YAHOO.ext.util.Observable.prototype.fireEvent,
+    on : YAHOO.ext.util.Observable.prototype.on,
+    addListener : YAHOO.ext.util.Observable.prototype.addListener,
+    delayedListener : YAHOO.ext.util.Observable.prototype.delayedListener,
+    removeListener : YAHOO.ext.util.Observable.prototype.removeListener,
+    purgeListeners : YAHOO.ext.util.Observable.prototype.purgeListeners,
+    bufferedListener : YAHOO.ext.util.Observable.prototype.bufferedListener,
+    
+    /** @ignore Syncs selectedRows with the correct row by looking it up by id. 
+      Used after a sort moves data around. */
+    syncSelectionsToIds : function(){
+        if(this.getCount() > 0){
+            var ids = this.selectedRowIds.concat();
+            this.clearSelections();
+            this.selectRowsById(ids, true);
+        }
+    },
+    
+    /**
+     * Set the selected rows by their ID(s). IDs must match what is returned by the DataModel getRowId(index).
+     * @param {String/Array} id The id(s) to select 
+     * @param {<i>Boolean</i>} keepExisting (optional) True to retain existing selections 
+     */
+    selectRowsById : function(id, keepExisting){
+        var rows = this.grid.getRowsById(id);
+        if (!(rows instanceof Array)){
+            this.selectRow(rows, keepExisting);
+            return;
+        }
+        this.selectRows(rows, keepExisting);
+    },
+    
+    /**
+     * Gets the number of selected rows.
+     * @return {Number}
+     */
+    getCount : function(){
+        return this.selectedRows.length;
+    },
+    
+    /**
+     * Selects the first row in the grid.
+     */
+    selectFirstRow : function(){
+        for(var j = 0; j < this.grid.rows.length; j++){
+            if(this.isSelectable(this.grid.rows[j])){
+            	this.focusRow(this.grid.rows[j]);
+                this.setRowState(this.grid.rows[j], true);
+                return;
+            }
+        }
+    },
+    
+    /**
+     * Selects the row immediately following the last selected row.
+     * @param {<i>Boolean</i>} keepExisting (optional) True to retain existing selections
+     */
+    selectNext : function(keepExisting){
+        if(this.lastSelectedRow){
+            for(var j = (this.lastSelectedRow.rowIndex+1); j < this.grid.rows.length; j++){
+                var row = this.grid.rows[j];
+                if(this.isSelectable(row)){
+                    this.focusRow(row);
+                    this.setRowState(row, true, keepExisting);
+                    return;
+                }
+            }
+        }
+    },
+    
+    /**
+     * Selects the row that precedes the last selected row.
+     * @param {<i>Boolean</i>} keepExisting (optional) True to retain existing selections 
+     */
+    selectPrevious : function(keepExisting){
+        if(this.lastSelectedRow){
+            for(var j = (this.lastSelectedRow.rowIndex-1); j >= 0; j--){
+                var row = this.grid.rows[j];
+                if(this.isSelectable(row)){
+                    this.focusRow(row);
+                    this.setRowState(row, true, keepExisting);
+                    return;
+                }
+            }
+        }
+    },
+    
+    /**
+     * Returns the selected rows.
+     * @return {Array} Array of DOM row elements
+     */
+    getSelectedRows : function(){
+        return this.selectedRows;
+    },
+    
+    /**
+     * Returns the selected row ids.
+     * @return {Array} Array of String ids
+     */
+    getSelectedRowIds : function(){
+        return this.selectedRowIds;
+    },
+    
+    /**
+     * Clears all selections.
+     */
+    clearSelections : function(){
+        if(this.isLocked()) return;
+        var oldSelections = this.selectedRows.concat();
+        for(var j = 0; j < oldSelections.length; j++){
+            this.setRowState(oldSelections[j], false);
+        }
+        this.selectedRows = [];
+        this.selectedRowIds = [];
+    },
+    
+        
+    /**
+     * Selects all rows.
+     */
+    selectAll : function(){
+        if(this.isLocked()) return;
+        this.selectedRows = [];
+        this.selectedRowIds = [];
+        for(var j = 0, len = this.grid.rows.length; j < len; j++){
+            this.setRowState(this.grid.rows[j], true, true);
+        }
+    },
+    
+    /**
+     * Returns True if there is a selection.
+     * @return {Boolean}
+     */
+    hasSelection : function(){
+        return this.selectedRows.length > 0;
+    },
+    
+    /**
+     * Returns True if the specified row is selected.
+     * @param {HTMLElement} row The row to check
+     * @return {Boolean}
+     */
+    isSelected : function(row){
+        return row && (row.selected === true || row.getAttribute('selected') == 'true');
+    },
+    
+    /**
+     * Returns True if the specified row is selectable.
+     * @param {HTMLElement} row The row to check
+     * @return {Boolean}
+     */
+    isSelectable : function(row){
+        return row && row.getAttribute('selectable') != 'false';
+    },
+    
+    /** @ignore */
+    rowClick : function(grid, rowIndex, e){
+        if(this.isLocked()) return;
+        var row = grid.getRow(rowIndex);
+        if(this.isSelectable(row)){
+            if(e.shiftKey && this.lastSelectedRow){
+                var lastIndex = this.lastSelectedRow.rowIndex;
+                this.selectRange(this.lastSelectedRow, row, e.ctrlKey);
+                this.lastSelectedRow = this.grid.el.dom.rows[lastIndex];
+            }else{
+                this.focusRow(row);
+                var rowState = e.ctrlKey ? !this.isSelected(row) : true;
+                this.setRowState(row, rowState, e.hasModifier());
+            }
+        }
+    },
+    
+    /**
+     * Deprecated. Tries to focus the row and scroll it into view - Use grid.scrollTo or grid.getView().focusRow() instead.
+     * @deprecated
+     * @param {HTMLElement} row The row to focus
+     */
+    focusRow : function(row){
+    	this.grid.view.focusRow(row);
+    },
+
+    /**
+     * Selects a row.
+     * @param {Number/HTMLElement} row The row or index of the row to select
+     * @param {<i>Boolean</i>} keepExisting (optional) True to retain existing selections 
+     */
+    selectRow : function(row, keepExisting){
+        this.setRowState(this.getRow(row), true, keepExisting);
+    },
+    
+    /**
+     * Selects multiple rows.
+     * @param {Array} rows Array of the rows or indexes of the row to select
+     * @param {<i>Boolean</i>} keepExisting (optional) True to retain existing selections 
+     */
+    selectRows : function(rows, keepExisting){
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        for(var i = 0; i < rows.length; i++){
+            this.selectRow(rows[i], true);
+        }
+    },
+    
+    /**
+     * Deselects a row.
+     * @param {Number/HTMLElement} row The row or index of the row to deselect
+     */
+    deselectRow : function(row){
+        this.setRowState(this.getRow(row), false);
+    },
+    
+    /** @ignore */
+    getRow : function(row){
+        if(typeof row == 'number'){
+            row = this.grid.rows[row];
+        }
+        return row;
+    },
+    
+    /**
+     * Selects a range of rows. All rows in between startRow and endRow are also selected.
+     * @param {Number/HTMLElement} startRow The row or index of the first row in the range
+     * @param {Number/HTMLElement} endRow The row or index of the last row in the range
+     * @param {<i>Boolean</i>} keepExisting (optional) True to retain existing selections 
+     */
+    selectRange : function(startRow, endRow, keepExisting){
+        startRow = this.getRow(startRow);
+        endRow = this.getRow(endRow);
+        this.setRangeState(startRow, endRow, true, keepExisting);
+    },
+    
+    /**
+     * Deselects a range of rows. All rows in between startRow and endRow are also deselected.
+     * @param {Number/HTMLElement} startRow The row or index of the first row in the range
+     * @param {Number/HTMLElement} endRow The row or index of the last row in the range
+     */
+    deselectRange : function(startRow, endRow){
+        startRow = this.getRow(startRow);
+        endRow = this.getRow(endRow);
+        this.setRangeState(startRow, endRow, false, true);
+    },
+    
+    /** @ignore */
+    setRowStateFromChild : function(childEl, selected, keepExisting){
+        var row = this.grid.getRowFromChild(childEl);
+        this.setRowState(row, selected, keepExisting);
+    },
+    
+    /** @ignore */
+    setRangeState : function(startRow, endRow, selected, keepExisting){
+        if(this.isLocked()) return;
+        if(!keepExisting){
+            this.clearSelections();
+        }
+        var curRow = startRow;
+        while(curRow.rowIndex != endRow.rowIndex){
+            this.setRowState(curRow, selected, true);
+            curRow = (startRow.rowIndex < endRow.rowIndex ? 
+                        this.grid.getRowAfter(curRow) : this.grid.getRowBefore(curRow))
+        }
+        this.setRowState(endRow, selected, true);
+    },
+    
+    /** @ignore */
+    setRowState : function(row, selected, keepExisting){
+        if(this.isLocked()) return;
+        if(this.isSelectable(row)){
+            if(selected){
+                if(!keepExisting){
+                    this.clearSelections();
+                }
+                this.setRowClass(row, 'selected');
+                row.selected = true;
+                this.selectedRows.push(row);
+                this.selectedRowIds.push(this.grid.dataModel.getRowId(row.rowIndex));
+                this.lastSelectedRow = row;
+            }else{
+                this.setRowClass(row, '');
+                row.selected = false;
+                this._removeSelected(row);
+            }
+            this.fireEvent('rowselect', this, row, selected);
+            this.fireEvent('selectionchange', this, this.selectedRows, this.selectedRowIds);
+        }
+    },
+
+    /** @ignore */
+    handleOver : function(e){
+        var row = this.grid.getRowFromChild(e.getTarget());
+        if(this.isSelectable(row) && !this.isSelected(row)){
+            this.setRowClass(row, 'over');
+        }
+    },
+    
+    /** @ignore */
+    handleOut : function(e){
+        var row = this.grid.getRowFromChild(e.getTarget());
+        if(this.isSelectable(row) && !this.isSelected(row)){
+            this.setRowClass(row, '');
+        }
+    },
+    
+    /** @ignore */
+    keyDown : function(e){
+        if(e.browserEvent.keyCode == e.DOWN){
+            this.selectNext(e.shiftKey);
+            e.preventDefault();
+        }else if(e.browserEvent.keyCode == e.UP){
+            this.selectPrevious(e.shiftKey);
+            e.preventDefault();
+        }
+    },
+
+    /** @ignore */
+    setRowClass : function(row, cssClass){
+        if(this.isSelectable(row)){
+            if(cssClass == 'selected'){
+                YAHOO.util.Dom.removeClass(row, 'ygrid-row-over');
+                YAHOO.util.Dom.addClass(row, 'ygrid-row-selected');
+            }else if(cssClass == 'over'){
+                YAHOO.util.Dom.removeClass(row, 'ygrid-row-selected');
+                YAHOO.util.Dom.addClass(row, 'ygrid-row-over');
+            }else if(cssClass == ''){
+                YAHOO.util.Dom.removeClass(row, 'ygrid-row-selected');
+                YAHOO.util.Dom.removeClass(row, 'ygrid-row-over');
+            }
+        }
+    },
+    
+    /** @ignore */
+    _removeSelected : function(row){
+        var sr = this.selectedRows;
+        for (var i = 0; i < sr.length; i++) {
+          if (sr[i] === row){
+              this.selectedRows.splice(i, 1);
+              this.selectedRowIds.splice(i, 1);
+              return;
+          }
+        }
+    }
+};
+
+/**
+ @class YAHOO.ext.grid.SingleSelectionModel
+ @extends YAHOO.ext.grid.DefaultSelectionModel
+ Allows only one row to be selected at a time.
+ @constructor
+ * Create new SingleSelectionModel
+ */
+YAHOO.ext.grid.SingleSelectionModel = function(){
+    YAHOO.ext.grid.SingleSelectionModel.superclass.constructor.call(this);
+};
+
+YAHOO.extendX(YAHOO.ext.grid.SingleSelectionModel, YAHOO.ext.grid.DefaultSelectionModel);
+
+/** @ignore */
+YAHOO.ext.grid.SingleSelectionModel.prototype.setRowState = function(row, selected){
+    YAHOO.ext.grid.SingleSelectionModel.superclass.setRowState.call(this, row, selected, false);
+};
+
+YAHOO.ext.grid.DisableSelectionModel = function(){
+    YAHOO.ext.grid.DisableSelectionModel.superclass.constructor.call(this);
+};
+
+YAHOO.extendX(YAHOO.ext.grid.DisableSelectionModel, YAHOO.ext.grid.DefaultSelectionModel);
+
+YAHOO.ext.grid.DisableSelectionModel.prototype.initEvents = function(){
+};
diff --git a/frontend/beta/js/YUI-extensions/grid/editor/CellEditor.js b/frontend/beta/js/YUI-extensions/grid/editor/CellEditor.js
new file mode 100644
index 0000000..7c51a48
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/editor/CellEditor.js
@@ -0,0 +1,91 @@
+/**
+ * @class YAHOO.ext.grid.CellEditor
+ * Base class for all EditorGrid editors
+ */
+YAHOO.ext.grid.CellEditor = function(element){
+    this.colIndex = null;
+    this.rowIndex = null;
+    this.grid = null;
+    this.editing = false;
+    this.originalValue = null;
+    this.element = getEl(element, true);
+    this.element.addClass('ygrid-editor');
+    this.element.dom.tabIndex = 1;
+    this.initialized = false;
+    this.callback = null;
+};
+
+YAHOO.ext.grid.CellEditor.prototype = {
+    init : function(grid, bodyElement, callback){
+        // there's no way for the grid to know if multiple columns 
+        // share the same editor so it will try to initialize the 
+        // same one over and over
+        if(this.initialized) return;
+        this.initialized = true;
+        this.callback = callback;
+        this.grid = grid;
+        bodyElement.appendChild(this.element.dom);
+        this.initEvents();
+    },
+    
+    initEvents : function(){
+        var stopOnEnter = function(e){
+            if(e.browserEvent.keyCode == e.RETURN){
+                this.stopEditing(true);
+            }else if(e.browserEvent.keyCode == e.ESC){
+                this.setValue(this.originalValue);
+                this.stopEditing(true);
+            }
+        }
+        this.element.mon('keydown', stopOnEnter, this, true);
+        this.element.on('blur', this.stopEditing, this, true);
+    },
+
+    startEditing : function(value, row, cell){
+        this.originalValue = value;
+        this.rowIndex = row.rowIndex;
+        this.colIndex = cell.columnIndex;
+        this.cell = cell;
+        this.setValue(value);
+        var cellbox = getEl(cell, true).getBox();
+        this.fitToCell(cellbox);
+        this.editing = true;
+        this.show();
+    },
+     
+    stopEditing : function(focusCell){
+         if(this.editing){
+             this.editing = false;
+             var newValue = this.getValue();
+             this.hide();
+             //if(focusCell){try{this.cell.focus();}catch(e){}}; // try to give the cell focus so keyboard nav still works
+             if(this.originalValue != newValue){
+                this.callback(newValue, this.rowIndex, this.colIndex);
+             }
+         }
+     },
+     
+    setValue : function(value){
+        this.element.dom.value = value;
+    },
+    
+    getValue : function(){
+        return this.element.dom.value;
+    },
+    
+    fitToCell : function(box){
+        this.element.setBox(box, true);
+    },
+    
+    show : function(){
+        this.element.show();
+        this.element.focus();
+    },
+    
+    hide : function(){
+        try{
+            this.element.dom.blur();
+        }catch(e){}
+        this.element.hide();
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/grid/editor/CheckboxEditor.js b/frontend/beta/js/YUI-extensions/grid/editor/CheckboxEditor.js
new file mode 100644
index 0000000..681b847
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/editor/CheckboxEditor.js
@@ -0,0 +1,60 @@
+/**
+ * @class YAHOO.ext.grid.CheckboxEditor
+ * @extends YAHOO.ext.grid.CellEditor
+Provides a checkbox for editing boolean values. It currently has no configuration options.<br><br>
+For more information on using this editor, see <a href="http://www.jackslocum.com/yui/2006/09/10/adding-built-in-editing-support-to-the-yahoo-ui-extensions-grid/">this blog post</a>.
+* @constructor
+* Create a new CheckboxEditor
+ */
+YAHOO.ext.grid.CheckboxEditor = function(){
+    var div = document.createElement('span');
+    div.className = 'ygrid-editor ygrid-checkbox-editor';
+    var cb = document.createElement('input');
+    cb.type = 'checkbox';
+    cb.setAttribute('autocomplete', 'off');
+    div.appendChild(cb);
+    document.body.appendChild(div);
+    YAHOO.ext.grid.CheckboxEditor.superclass.constructor.call(this, div);
+    div.tabIndex = '';
+    cb.tabIndex = 1;
+    this.cb = getEl(cb, true);
+};
+
+YAHOO.extendX(YAHOO.ext.grid.CheckboxEditor, YAHOO.ext.grid.CellEditor);
+
+YAHOO.ext.grid.CheckboxEditor.prototype.fitToCell = function(box){
+    this.element.setBox(box, true);
+};
+
+YAHOO.ext.grid.CheckboxEditor.prototype.setValue = function(value){
+     this.cb.dom.checked = (value === true || value === 'true' || value === 1 || value === '1');
+};
+
+YAHOO.ext.grid.CheckboxEditor.prototype.getValue = function(){
+     return this.cb.dom.checked;
+};
+
+YAHOO.ext.grid.CheckboxEditor.prototype.show = function(){
+    this.element.show();
+    this.cb.focus();
+};
+
+YAHOO.ext.grid.CheckboxEditor.prototype.initEvents = function(){
+    var stopOnEnter = function(e){
+        if(e.browserEvent.keyCode == e.RETURN){
+            this.stopEditing(true);
+        }else if(e.browserEvent.keyCode == e.ESC){
+            this.setValue(this.originalValue);
+            this.stopEditing(true);
+        }
+    }
+    this.cb.mon('keydown', stopOnEnter, this, true);
+    this.cb.on('blur', this.stopEditing, this, true);
+};
+
+YAHOO.ext.grid.CheckboxEditor.prototype.hide = function(){
+    try{
+        this.cb.dom.blur();
+    }catch(e){}
+    this.element.hide();
+};
diff --git a/frontend/beta/js/YUI-extensions/grid/editor/DateEditor.js b/frontend/beta/js/YUI-extensions/grid/editor/DateEditor.js
new file mode 100644
index 0000000..303ad2b
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/editor/DateEditor.js
@@ -0,0 +1,268 @@
+/**
+ * @class YAHOO.ext.grid.DateEditor
+ * @extends YAHOO.ext.grid.CellEditor
+Provides a date editor field, and optionally a DatePicker. The DateEditor provides a method to override (showCalendar) if you don't want to use the built in DatePicker control. The reason I chose to use my own DatePicker control rather than the nice YUI Calendar component is my control was very easy to override events to make it work well with the grid. It's also only 5k compressed, while the YUI Calendar is 40k compressed. The DatePicker supports left/right keys to move months, up/down keys to move years and the mouse wheel to quickly go through the months. The DateEditor supports the following configuration options:
+<ul class="list">
+<li><i>format</i> - The date format for the editor. The format is identical to <a href="http://www.php.net/date">PHP date()</a> and text is allowed. Credit for that goes to <a style="font-weight:normal;" href="http://www.xaprb.com/blog/2006/05/14/javascript-date-formatting-benchmarks/">this fantastic date library</a>. This format is for the editor only and doesn't affect the rendering of the cell when not in edit mode. Your rendering function can use any date format it wants.</li>
+<li><i>minValue</i> - The minimum allowed date. Can be either a Javascript date object or a string date in the specified format.</li>
+<li><i>maxValue</i> - The maximum allowed date. Can be either a Javascript date object or a string date in the specified format.</li>
+<li><i>minText</i> - The tooltip to display when the date in the cell is before minValue.</li>
+<li><i>maxText</i> - The tooltip to display when the date in the cell is after maxValue.</li>
+<li><i>invalidText</i> - The text to display when the date in the field is invalid (for example: 02/31/06)</li>
+<li><i>disabledDays</i> - An array of days to disable, 0 based. For example, [0, 6] disables Sunday and Saturday.</li>
+<li><i>disabledDaysText</i> - The tooltip to display when the date in the cell (or DatePicker) falls on a disabled day.</li>
+<li><i>disabledDates</i> - An array of "dates" to disable, as strings. These strings will be used to build a dynamic regular expression so they are very powerful. For example, ["03/08/2003", "09/16/2003"] would disable those dates, but ["03/08", "09/16"] would disable them for every year. If you are using short years, you will want to use ^ to tell the regular expression to only match the beginning like ["^03/08"]. To disable March of 2006: ["03/../2006"] or every March ["^03"]. In order to support regular expressions, if you are using a date format that has "." in it, you will have to  escape the dot when restricting dates. For example: ["03\\.08\\.03"].</li>
+<li><i>disabledDatesText</i> - The tooltip to display when the date in the cell (or DatePicker) falls on a disabled date.</li>
+<li><i>allowBlank</i> - True if the cell is allowed to be empty.</li>
+<li><i>blankText</i> - The tooltip (error message) to display when the cell is empty and is not allowed to be.</li>
+<li><i>validator</i> - Any custom validation function you want called. The function must return true if the data is valid or an error message otherwise.</li>
+<li><i>validationDelay</i> - The delay in milliseconds for validation. Each time the user types something the field is validated after a specified delay, setting this value allows you to customize that delay (for example, if your custom validation routine is slow).</li>
+</ul>
+For more information on using this editor, see <a href="http://www.jackslocum.com/yui/2006/09/10/adding-built-in-editing-support-to-the-yahoo-ui-extensions-grid/">this blog post</a>.
+* @constructor
+* Create a new DateEditor
+* @param {Object} config
+ */
+YAHOO.ext.grid.DateEditor = function(config){
+    var div = document.createElement('span');
+    div.className = 'ygrid-editor ygrid-editor-container';
+    
+    var element = document.createElement('input');
+    element.type = 'text';
+    element.tabIndex = 1;
+    element.setAttribute('autocomplete', 'off');
+    div.appendChild(element);
+    
+    var pick = document.createElement('span');
+    pick.className = 'pick-button';
+    div.appendChild(pick);
+    
+    document.body.appendChild(div);
+    
+    this.div = getEl(div, true);
+    this.element = getEl(element, true);
+    this.pick = getEl(pick, true);
+    
+    this.colIndex = null;
+    this.rowIndex = null;
+    this.grid = null;
+    this.editing = false;
+    this.originalValue = null;
+    this.initialized = false;
+    this.callback = null;
+    
+    this.cal = null;
+    this.mouseDownHandler = YAHOO.ext.EventManager.wrap(this.handleMouseDown, this, true);
+    
+    YAHOO.ext.util.Config.apply(this, config);
+    if(typeof this.minValue == 'string') this.minValue = this.parseDate(this.minValue);
+    if(typeof this.maxValue == 'string') this.maxValue = this.parseDate(this.maxValue);
+    this.ddMatch = /ddnone/;
+    if(this.disabledDates){
+        var dd = this.disabledDates;
+        var re = "(?:";
+        for(var i = 0; i < dd.length; i++){
+            re += dd[i];
+            if(i != dd.length-1) re += "|";
+        }
+        this.ddMatch = new RegExp(re + ")");
+    }
+};
+
+YAHOO.ext.grid.DateEditor.prototype = {
+    init : function(grid, bodyElement, callback){
+        if(this.initialized) return;
+        
+        this.initialized = true;
+        this.callback = callback;
+        this.grid = grid;
+        bodyElement.appendChild(this.div.dom);
+        this.initEvents();
+    },
+    
+    initEvents : function(){
+         var stopOnEnter = function(e){
+            if(e.browserEvent.keyCode == e.RETURN){
+                this.stopEditing(true);
+            }else if(e.browserEvent.keyCode == e.ESC){
+                this.setValue(this.originalValue);
+                this.stopEditing(true);
+            }
+        }
+        this.element.mon('keydown', stopOnEnter, this, true);
+        var vtask = new YAHOO.ext.util.DelayedTask(this.validate, this);
+        this.element.mon('keyup', vtask.delay.createDelegate(vtask, [this.validationDelay]));
+        this.pick.on('click', this.showCalendar, this, true);
+    },
+    
+    startEditing : function(value, row, cell){
+        this.originalValue = value;
+        this.rowIndex = row.rowIndex;
+        this.colIndex = cell.columnIndex;
+        this.cell = cell;
+        this.setValue(value);
+        this.validate();
+        var cellbox = getEl(cell, true).getBox();
+        this.div.setBox(cellbox, true);
+        this.element.setWidth(cellbox.width-this.pick.getWidth());
+        this.editing = true;
+        YAHOO.util.Event.on(document, "mousedown", this.mouseDownHandler);
+        this.show();
+    },
+     
+     stopEditing : function(focusCell){
+         if(this.editing){
+             YAHOO.util.Event.removeListener(document, "mousedown", this.mouseDownHandler);
+             this.editing = false;
+             var newValue = this.getValue();
+             this.hide();
+             //if(focusCell){try{this.cell.focus();}catch(e){}}// try to give the cell focus so keyboard nav still works
+             if(this.originalValue != newValue){
+                this.callback(newValue, this.rowIndex, this.colIndex);
+             }
+         }
+     },
+    
+    setValue : function(value){
+        this.element.dom.value = this.formatDate(value);
+        this.validate();
+    },
+    
+    getValue : function(){
+        if(!this.validate()){
+           return this.originalValue;
+       }else{
+           var value = this.element.dom.value;
+           if(value.length < 1){
+               return value;
+           } else{
+               return this.parseDate(value);
+           }
+       }   
+    },
+    
+    show : function() {
+        this.div.show();
+        this.element.focus();
+        this.validate();
+    },
+    
+    hide : function(){
+        try{
+            this.element.dom.blur();
+        }catch(e){}
+        this.div.hide();
+    },
+    
+    validate : function(){
+        var dom = this.element.dom;
+        var value = dom.value;
+        if(value.length < 1){ // if it's blank
+             if(this.allowBlank){
+                 dom.title = '';
+                 this.element.removeClass('ygrid-editor-invalid');
+                 return true;
+             }else{
+                 dom.title = this.blankText;
+                 this.element.addClass('ygrid-editor-invalid');
+                 return false;
+             }
+        }
+        value = this.parseDate(value);
+        if(!value){
+            dom.title = this.invalidText.replace('%0', dom.value).replace('%1', this.format);
+            this.element.addClass('ygrid-editor-invalid');
+            return false;
+        }
+        var time = value.getTime();
+        if(this.minValue && time < this.minValue.getTime()){
+            dom.title = this.minText.replace('%0', this.formatDate(this.minValue));
+            this.element.addClass('ygrid-editor-invalid');
+            return false;
+        }
+        if(this.maxValue && time > this.maxValue.getTime()){
+            dom.title = this.maxText.replace('%0', this.formatDate(this.maxValue));
+            this.element.addClass('ygrid-editor-invalid');
+            return false;
+        }
+        if(this.disabledDays){
+            var day = value.getDay();
+            for(var i = 0; i < this.disabledDays.length; i++) {
+            	if(day === this.disabledDays[i]){
+            	    dom.title = this.disabledDaysText;
+                    this.element.addClass('ygrid-editor-invalid');
+                    return false;
+            	}
+            }
+        }
+        var fvalue = this.formatDate(value);
+        if(this.ddMatch.test(fvalue)){
+            dom.title = this.disabledDatesText.replace('%0', fvalue);
+            this.element.addClass('ygrid-editor-invalid');
+            return false;
+        }
+        var msg = this.validator(value);
+        if(msg !== true){
+            dom.title = msg;
+            this.element.addClass('ygrid-editor-invalid');
+            return false;
+        }
+        dom.title = '';
+        this.element.removeClass('ygrid-editor-invalid');
+        return true;
+    },
+    
+    handleMouseDown : function(e){
+        var t = e.getTarget();
+        var dom = this.div.dom;
+        if(t != dom && !YAHOO.util.Dom.isAncestor(dom, t)){
+            this.stopEditing();
+        }
+    },
+    
+    showCalendar : function(value){
+        if(this.cal == null){
+            this.cal = new YAHOO.ext.DatePicker(this.div.dom.parentNode.parentNode);
+        }
+        this.cal.minDate = this.minValue;
+        this.cal.maxDate = this.maxValue;
+        this.cal.disabledDatesRE = this.ddMatch;
+        this.cal.disabledDatesText = this.disabledDatesText;
+        this.cal.disabledDays = this.disabledDays;
+        this.cal.disabledDaysText = this.disabledDaysText;
+        this.cal.format = this.format;
+        if(this.minValue){
+            this.cal.minText = this.minText.replace('%0', this.formatDate(this.minValue));
+        }
+        if(this.maxValue){
+            this.cal.maxText = this.maxText.replace('%0', this.formatDate(this.maxValue));
+        }
+        var r = this.div.getRegion();
+        this.cal.show(r.left, r.bottom, this.getValue(), this.setValue.createDelegate(this));
+    },
+    
+    parseDate : function(value){
+        if(!value || value instanceof Date) return value;
+        return Date.parseDate(value, this.format);
+    },
+    
+    formatDate : function(date){
+        if(!date || !(date instanceof Date)) return date;
+        return date.format(this.format);
+    }
+};
+
+YAHOO.ext.grid.DateEditor.prototype.format = 'm/d/y';
+YAHOO.ext.grid.DateEditor.prototype.disabledDays = null;
+YAHOO.ext.grid.DateEditor.prototype.disabledDaysText = '';
+YAHOO.ext.grid.DateEditor.prototype.disabledDates = null;
+YAHOO.ext.grid.DateEditor.prototype.disabledDatesText = '';
+YAHOO.ext.grid.DateEditor.prototype.allowBlank = true;
+YAHOO.ext.grid.DateEditor.prototype.minValue = null;
+YAHOO.ext.grid.DateEditor.prototype.maxValue = null;
+YAHOO.ext.grid.DateEditor.prototype.minText = 'The date in this field must be after %0';
+YAHOO.ext.grid.DateEditor.prototype.maxText = 'The date in this field must be before %0';
+YAHOO.ext.grid.DateEditor.prototype.blankText = 'This field cannot be blank';
+YAHOO.ext.grid.DateEditor.prototype.invalidText = '%0 is not a valid date - it must be in the format %1';
+YAHOO.ext.grid.DateEditor.prototype.validationDelay = 200;
+YAHOO.ext.grid.DateEditor.prototype.validator = function(){return true;};
diff --git a/frontend/beta/js/YUI-extensions/grid/editor/NumberEditor.js b/frontend/beta/js/YUI-extensions/grid/editor/NumberEditor.js
new file mode 100644
index 0000000..f74d3d9
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/editor/NumberEditor.js
@@ -0,0 +1,166 @@
+/**
+ * @class YAHOO.ext.grid.NumberEditor
+ * @extends YAHOO.ext.grid.CellEditor
+Provides a masked editor for numeric values. Invalid keys are ignored. It supports the following configuration options:
+<ul class="list">
+<li><i>allowDecimals</i> - True if the cell can have decimal values.</li>
+<li><i>decimalSeparator</i> - Character(s) to allow as the decimal separator.</li>
+<li><i>decimalPrecision</i> - Set the maximum decimal precision.</li>
+<li><i>decimalPrecisionFcn</i> - Define the function to call to remove extra precision (ie. Math.floor, Math.round, Math.ceil or your own function).</li>
+<li><i>allowNegative</i> - True if the cell allows negative values.</li>
+<li><i>selectOnFocus</i> - True to select the text when the editor is activated.</li>
+<li><i>minValue</i> - The minimum value the cell will allow.</li>
+<li><i>maxValue</i> - The maximum value the cell will allow.</li>
+<li><i>minText</i> - The tooltip to display when the value in the cell is below the minimum.</li>
+<li><i>maxText</i> - The tooltip to display when the value in the cell is above the maximum.</li>
+<li><i>nanText</i> - The tooltip to display when the value in the cell is not a valid number (for example, negatives are allowed and the value in the cell is just "-" with no numbers).</li>
+<li><i>allowBlank</i> - True if the cell is allowed to be empty.</li>
+<li><i>blankText</i> - The tooltip (error message) to display when the cell is empty and is not allowed to be.</li>
+<li><i>validator</i> - Any custom validation function you want called. The function must return true if the data is valid or an error message otherwise.</li>
+<li><i>validationDelay</i> - The delay in milliseconds for validation. Each time the user types something the field is validated after a specified delay, setting this value allows you to customize that delay (for example, if your custom validation routine is slow).</li>
+</ul>
+For more information on using this editor, see <a href="http://www.jackslocum.com/yui/2006/09/10/adding-built-in-editing-support-to-the-yahoo-ui-extensions-grid/">this blog post</a>.
+* @constructor
+* Create a new NumberEditor
+* @param {Object} config
+ */
+YAHOO.ext.grid.NumberEditor = function(config){
+    var element = document.createElement('input');
+    element.type = 'text';
+    element.className = 'ygrid-editor ygrid-num-editor';
+    element.setAttribute('autocomplete', 'off');
+    document.body.appendChild(element);
+    YAHOO.ext.grid.NumberEditor.superclass.constructor.call(this, element);
+    YAHOO.ext.util.Config.apply(this, config);
+};
+YAHOO.extendX(YAHOO.ext.grid.NumberEditor, YAHOO.ext.grid.CellEditor);
+
+YAHOO.ext.grid.NumberEditor.prototype.initEvents = function(){
+    var stopOnEnter = function(e){
+        if(e.browserEvent.keyCode == e.RETURN){
+            this.stopEditing(true);
+        }else if(e.browserEvent.keyCode == e.ESC){
+            this.setValue(this.originalValue);
+            this.stopEditing(true);
+        }
+    };
+    
+    var allowed = "0123456789";
+    if(this.allowDecimals){
+        allowed += this.decimalSeparator;
+    }
+    if(this.allowNegative){
+        allowed += '-';
+    }
+    var keyPress = function(e){
+        var c = e.getCharCode();
+        if(c != e.BACKSPACE && allowed.indexOf(String.fromCharCode(c)) === -1){
+            e.stopEvent();
+        }
+    };
+    this.element.mon('keydown', stopOnEnter, this, true);
+    var vtask = new YAHOO.ext.util.DelayedTask(this.validate, this);
+    this.element.mon('keyup', vtask.delay.createDelegate(vtask, [this.validationDelay]));
+    this.element.mon('keypress', keyPress, this, true);
+    this.element.on('blur', this.stopEditing, this, true);
+};
+
+YAHOO.ext.grid.NumberEditor.prototype.validate = function(){
+    var dom = this.element.dom;
+    var value = dom.value;
+    if(value.length < 1){ // if it's blank
+         if(this.allowBlank){
+             dom.title = '';
+             this.element.removeClass('ygrid-editor-invalid');
+             return true;
+         }else{
+             dom.title = this.blankText;
+             this.element.addClass('ygrid-editor-invalid');
+             return false;
+         }
+    }
+    if(value.search(/\d+/) === -1){
+        dom.title = this.nanText.replace('%0', value);
+        this.element.addClass('ygrid-editor-invalid');
+        return false;
+    }
+    var num = this.parseValue(value);
+    if(num < this.minValue){
+        dom.title = this.minText.replace('%0', this.minValue);
+        this.element.addClass('ygrid-editor-invalid');
+        return false;
+    }
+    if(num > this.maxValue){
+        dom.title = this.maxText.replace('%0', this.maxValue);
+        this.element.addClass('ygrid-editor-invalid');
+        return false;
+    }
+    var msg = this.validator(value);
+    if(msg !== true){
+        dom.title = msg;
+        this.element.addClass('ygrid-editor-invalid');
+        return false;
+    }
+    dom.title = '';
+    this.element.removeClass('ygrid-editor-invalid');
+    return true;
+};
+
+YAHOO.ext.grid.NumberEditor.prototype.show = function(){
+    this.element.dom.title = '';
+    YAHOO.ext.grid.NumberEditor.superclass.show.call(this);
+    if(this.selectOnFocus){
+        try{
+            this.element.dom.select();
+        }catch(e){}
+    }
+    this.validate(this.element.dom.value);
+};
+
+YAHOO.ext.grid.NumberEditor.prototype.getValue = function(){
+   if(!this.validate()){
+       return this.originalValue;
+   }else{
+       var value = this.element.dom.value;
+       if(value.length < 1){
+           return value;
+       } else{
+           return this.fixPrecision(this.parseValue(value));
+       }
+   }   
+};
+YAHOO.ext.grid.NumberEditor.prototype.parseValue = function(value){
+    return parseFloat(new String(value).replace(this.decimalSeparator, '.'));
+};
+
+YAHOO.ext.grid.NumberEditor.prototype.fixPrecision = function(value){
+   if(!this.allowDecimals || this.decimalPrecision == -1 || isNaN(value) || value == 0 || !value){
+       return value;
+   }
+   // this should work but doesn't due to precision error in JS
+   // var scale = Math.pow(10, this.decimalPrecision);
+   // var fixed = this.decimalPrecisionFcn(value * scale);
+   // return fixed / scale;
+   //
+   // so here's our workaround:
+   var scale = Math.pow(10, this.decimalPrecision+1);
+   var fixed = this.decimalPrecisionFcn(value * scale);
+   fixed = this.decimalPrecisionFcn(fixed/10);
+   return fixed / (scale/10);
+};
+
+YAHOO.ext.grid.NumberEditor.prototype.allowBlank = true;
+YAHOO.ext.grid.NumberEditor.prototype.allowDecimals = true;
+YAHOO.ext.grid.NumberEditor.prototype.decimalSeparator = '.';
+YAHOO.ext.grid.NumberEditor.prototype.decimalPrecision = 2;
+YAHOO.ext.grid.NumberEditor.prototype.decimalPrecisionFcn = Math.floor;
+YAHOO.ext.grid.NumberEditor.prototype.allowNegative = true;
+YAHOO.ext.grid.NumberEditor.prototype.selectOnFocus = true;
+YAHOO.ext.grid.NumberEditor.prototype.minValue = Number.NEGATIVE_INFINITY;
+YAHOO.ext.grid.NumberEditor.prototype.maxValue = Number.MAX_VALUE;
+YAHOO.ext.grid.NumberEditor.prototype.minText = 'The minimum value for this field is %0';
+YAHOO.ext.grid.NumberEditor.prototype.maxText = 'The maximum value for this field is %0';
+YAHOO.ext.grid.NumberEditor.prototype.blankText = 'This field cannot be blank';
+YAHOO.ext.grid.NumberEditor.prototype.nanText = '%0 is not a valid number';
+YAHOO.ext.grid.NumberEditor.prototype.validationDelay = 100;
+YAHOO.ext.grid.NumberEditor.prototype.validator = function(){return true;};
diff --git a/frontend/beta/js/YUI-extensions/grid/editor/SelectEditor.js b/frontend/beta/js/YUI-extensions/grid/editor/SelectEditor.js
new file mode 100644
index 0000000..200b8e3
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/editor/SelectEditor.js
@@ -0,0 +1,37 @@
+/**
+ * @class YAHOO.ext.grid.SelectEditor
+ * @extends YAHOO.ext.grid.CellEditor
+Creates an editor out of an existing select field. You can create the select element through DOM in Javascript and pass it to the SelectEditor's constructor <b>or</b> an easier way is like this:
+<br><br>
+Define the select field in your document, giving it the ygrid-editor class.
+<pre><code>
+&lt;select id="light" class="ygrid-editor"&gt;
+	&lt;option value="Shade"&gt;Shade&lt;/option&gt;
+	&lt;option value="Mostly Shady"&gt;Mostly Shady&lt;/option&gt;
+	&lt;option value="Sun or Shade"&gt;Sun or Shade&lt;/option&gt;
+	&lt;option value="Mostly Sunny"&gt;Mostly Sunny&lt;/option&gt;
+	&lt;option value="Sunny"&gt;Sunny&lt;/option&gt;
+&lt;/select&gt;
+</code></pre>
+Create the SelectEditor object, passing in the id of your select field.
+<pre><code>
+var editor = new YAHOO.ext.grid.SelectEditor('light'); 
+</code></pre>
+For more information on using this editor, see <a href="http://www.jackslocum.com/yui/2006/09/10/adding-built-in-editing-support-to-the-yahoo-ui-extensions-grid/">this blog post</a>.
+* @constructor
+* Create a new SelectEditor
+* @param {HTMLElement/String} element
+ */
+YAHOO.ext.grid.SelectEditor = function(element){
+    element.hideFocus = true;
+    YAHOO.ext.grid.SelectEditor.superclass.constructor.call(this, element);
+    this.element.swallowEvent('click');
+};
+YAHOO.extendX(YAHOO.ext.grid.SelectEditor, YAHOO.ext.grid.CellEditor);
+
+YAHOO.ext.grid.SelectEditor.prototype.fitToCell = function(box){
+    if(YAHOO.ext.util.Browser.isGecko){
+        box.height -= 3;
+    }
+    this.element.setBox(box, true);
+};
diff --git a/frontend/beta/js/YUI-extensions/grid/editor/TextEditor.js b/frontend/beta/js/YUI-extensions/grid/editor/TextEditor.js
new file mode 100644
index 0000000..3c97acd
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/grid/editor/TextEditor.js
@@ -0,0 +1,110 @@
+/**
+ * @class YAHOO.ext.grid.TextEditor
+ * @extends YAHOO.ext.grid.CellEditor
+Provides basic text editing for a cells and supports the following configuration options:
+<ul class="list">
+<li><i>allowBlank</i> - True if the cell is allowed to be empty.</li>
+<li><i>minLength</i> - The minimum length the cell will accept.</li>
+<li><i>maxLength</i> - The maximum length the cell will allow.</li>
+<li><i>minText</i> - The tooltip to display when the length of the value in the cell is below the minimum.</li>
+<li><i>maxText</i> - The tooltip to display when the length of the value in the cell is above the maximum.</li>
+<li><i>selectOnFocus</i> - True to select the text when the editor is activated.</li>
+<li><i>blankText</i> - The tooltip (error message) to display when the cell is empty and is not allowed to be.</li>
+<li><i>regex</i> - A regular expression to match if the value is valid. If the regex.test(value) returns false, the value is considered invalid.</li>
+<li><i>regexText</i> - The tooltip (error message) to display when regex does not match.</li>
+<li><i>validator</i> - Any custom validation function you want called. The function must return true if the data is valid or an error message otherwise.</li>
+<li><i>validationDelay</i> - The delay in milliseconds for validation. Each time the user types something the field is validated after a specified delay, setting this value allows you to customize that delay (for example, if your custom validation routine is slow).</li>
+</ul>
+For more information on using this editor, see <a href="http://www.jackslocum.com/yui/2006/09/10/adding-built-in-editing-support-to-the-yahoo-ui-extensions-grid/">this blog post</a>.
+* @constructor
+* Create a new TextEditor
+* @param {Object} config
+ */
+YAHOO.ext.grid.TextEditor = function(config){
+    var element = document.createElement('input');
+    element.type = 'text';
+    element.className = 'ygrid-editor ygrid-text-editor';
+    element.setAttribute('autocomplete', 'off');
+    document.body.appendChild(element);
+    YAHOO.ext.grid.TextEditor.superclass.constructor.call(this, element);
+    YAHOO.ext.util.Config.apply(this, config);
+};
+YAHOO.extendX(YAHOO.ext.grid.TextEditor, YAHOO.ext.grid.CellEditor);
+
+YAHOO.ext.grid.TextEditor.prototype.validate = function(){
+    var dom = this.element.dom;
+    var value = dom.value;
+    if(value.length < 1){ // if it's blank
+         if(this.allowBlank){
+             dom.title = '';
+             this.element.removeClass('ygrid-editor-invalid');
+             return true;
+         }else{
+             dom.title = this.blankText;
+             this.element.addClass('ygrid-editor-invalid');
+             return false;
+         }
+    }
+    if(value.length < this.minLength){
+        dom.title = this.minText.replace('%0', this.minLength);
+        this.element.addClass('ygrid-editor-invalid');
+        return false;
+    }
+    if(value.length > this.maxLength){
+        dom.title = this.maxText.replace('%0', this.maxLength);
+        this.element.addClass('ygrid-editor-invalid');
+        return false;
+    }
+    var msg = this.validator(value);
+    if(msg !== true){
+        dom.title = msg;
+        this.element.addClass('ygrid-editor-invalid');
+        return false;
+    }
+    if(this.regex && !this.regex.test(value)){
+        dom.title = this.regexText;
+        this.element.addClass('ygrid-editor-invalid');
+        return false;
+    }
+    dom.title = '';
+    this.element.removeClass('ygrid-editor-invalid');
+    return true;
+};
+
+YAHOO.ext.grid.TextEditor.prototype.initEvents = function(){
+    YAHOO.ext.grid.TextEditor.superclass.initEvents.call(this);
+    var vtask = new YAHOO.ext.util.DelayedTask(this.validate, this);
+    this.element.mon('keyup', vtask.delay.createDelegate(vtask, [this.validationDelay]));
+};
+
+YAHOO.ext.grid.TextEditor.prototype.show = function(){
+    this.element.dom.title = '';
+    YAHOO.ext.grid.TextEditor.superclass.show.call(this);
+    this.element.focus();
+    if(this.selectOnFocus){
+        try{
+            this.element.dom.select();
+        }catch(e){}
+    }
+    this.validate(this.element.dom.value);
+};
+
+YAHOO.ext.grid.TextEditor.prototype.getValue = function(){
+   if(!this.validate()){
+       return this.originalValue;
+   }else{
+       return this.element.dom.value;
+   }   
+};
+
+YAHOO.ext.grid.TextEditor.prototype.allowBlank = true;
+YAHOO.ext.grid.TextEditor.prototype.minLength = 0;
+YAHOO.ext.grid.TextEditor.prototype.maxLength = Number.MAX_VALUE;
+YAHOO.ext.grid.TextEditor.prototype.minText = 'The minimum length for this field is %0';
+YAHOO.ext.grid.TextEditor.prototype.maxText = 'The maximum length for this field is %0';
+YAHOO.ext.grid.TextEditor.prototype.selectOnFocus = true;
+YAHOO.ext.grid.TextEditor.prototype.blankText = 'This field cannot be blank';
+YAHOO.ext.grid.TextEditor.prototype.validator = function(){return true;};
+YAHOO.ext.grid.TextEditor.prototype.validationDelay = 200;
+YAHOO.ext.grid.TextEditor.prototype.regex = null;
+YAHOO.ext.grid.TextEditor.prototype.regexText = '';
diff --git a/frontend/beta/js/YUI-extensions/layout/BasicLayoutRegion.js b/frontend/beta/js/YUI-extensions/layout/BasicLayoutRegion.js
new file mode 100644
index 0000000..b7ea273
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/layout/BasicLayoutRegion.js
@@ -0,0 +1,265 @@
+/**
+ * @class YAHOO.ext.BasicLayoutRegion
+ * @extends YAHOO.ext.util.Observable
+ * This class represents a lightweight region in a layout manager. This region does not move dom nodes
+ * and does not have a titlebar, tabs or any other features. All it does is size and position 
+ * panels. To create a BasicLayoutRegion, add lightweight:true or basic:true to your regions config.
+ */
+YAHOO.ext.BasicLayoutRegion = function(mgr, config, pos, skipConfig){
+    this.mgr = mgr;
+    this.position  = pos;
+    this.events = {
+        /**
+         * @event beforeremove
+         * Fires before a panel is removed (or closed). To cancel the removal set "e.cancel = true" on the event argument.
+         * @param {YAHOO.ext.LayoutRegion} this
+         * @param {YAHOO.ext.ContentPanel} panel The panel
+         * @param {Object} e The cancel event object
+         */
+        'beforeremove' : true,
+        /**
+         * @event invalidated
+         * Fires when the layout for this region is changed.
+         * @param {YAHOO.ext.LayoutRegion} this
+         */
+        'invalidated' : true,
+        /**
+         * @event visibilitychange
+         * Fires when this region is shown or hidden 
+         * @param {YAHOO.ext.LayoutRegion} this
+         * @param {Boolean} visibility true or false
+         */
+        'visibilitychange' : true,
+        /**
+         * @event paneladded
+         * Fires when a panel is added. 
+         * @param {YAHOO.ext.LayoutRegion} this
+         * @param {YAHOO.ext.ContentPanel} panel The panel
+         */
+        'paneladded' : true,
+        /**
+         * @event panelremoved
+         * Fires when a panel is removed. 
+         * @param {YAHOO.ext.LayoutRegion} this
+         * @param {YAHOO.ext.ContentPanel} panel The panel
+         */
+        'panelremoved' : true,
+        /**
+         * @event collapsed
+         * Fires when this region is collapsed. 
+         * @param {YAHOO.ext.LayoutRegion} this
+         */
+        'collapsed' : true,
+        /**
+         * @event expanded
+         * Fires when this region is expanded. 
+         * @param {YAHOO.ext.LayoutRegion} this
+         */
+        'expanded' : true,
+        /**
+         * @event panelactivated
+         * Fires when a panel is activated. 
+         * @param {YAHOO.ext.LayoutRegion} this
+         * @param {YAHOO.ext.ContentPanel} panel The activated panel
+         */
+        'panelactivated' : true,
+        /**
+         * @event resized
+         * Fires when the user resizes this region. 
+         * @param {YAHOO.ext.LayoutRegion} this
+         * @param {Number} newSize The new size (width for east/west, height for north/south)
+         */
+        'resized' : true
+    };
+    /** A collection of panels in this region. @type YAHOO.ext.util.MixedCollection */
+    this.panels = new YAHOO.ext.util.MixedCollection();
+    this.panels.getKey = this.getPanelId.createDelegate(this);
+    this.box = null;
+    this.activePanel = null;
+    if(skipConfig !== true){
+        this.applyConfig(config);
+    }
+};
+
+YAHOO.extendX(YAHOO.ext.BasicLayoutRegion, YAHOO.ext.util.Observable, {
+    getPanelId : function(p){
+        return p.getId();
+    },
+    
+    applyConfig : function(config){
+        this.margins = config.margins || this.margins || {top: 0, left: 0, right:0, bottom: 0};
+        this.config = config;
+    },
+    
+    /**
+     * Resizes the region to the specified size. For vertical regions (west, east) this adjusts 
+     * the width, for horizontal (north, south) the height.
+     * @param {Number} newSize The new width or height
+     */
+    resizeTo : function(newSize){
+        if(this.activePanel){
+            var el = this.activePanel.getEl();
+            switch(this.position){
+                case 'east':
+                case 'west':
+                    el.setWidth(newSize);
+                    this.fireEvent('resized', this, newSize);
+                break;
+                case 'north':
+                case 'south':
+                    el.setHeight(newSize);
+                    this.fireEvent('resized', this, newSize);
+                break;                
+            }
+        }
+    },
+    
+    getBox : function(){
+        return this.activePanel ? this.activePanel.getEl().getBox(false, true) : null;
+    },
+    
+    getMargins : function(){
+        return this.margins;
+    },
+    
+    updateBox : function(box){
+        this.box = box;
+        var el = this.activePanel.getEl();
+        el.dom.style.left = box.x + 'px';
+        el.dom.style.top = box.y + 'px';
+        el.setSize(box.width, box.height);
+    },
+    
+    /**
+     * Returns the container element for this region.
+     * @return {YAHOO.ext.Element}
+     */
+    getEl : function(){
+        return this.activePanel;
+    },
+    
+    /**
+     * Returns true if this region is currently visible.
+     * @return {Boolean}
+     */
+    isVisible : function(){
+        return this.activePanel ? true : false;
+    },
+    
+    setActivePanel : function(panel){
+        panel = this.getPanel(panel);
+        if(this.activePanel && this.activePanel != panel){
+            this.activePanel.setActiveState(false);
+            this.activePanel.getEl().setStyle({left:-10000,right:-10000});
+        }
+        this.activePanel = panel;
+        panel.setActiveState(true);
+        if(this.box){
+            panel.setSize(this.box.width, this.box.height);
+        }
+        this.fireEvent('panelactivated', this, panel);
+        this.fireEvent('invalidated');
+    },
+    
+    /**
+     * Show the specified panel.
+     * @param {Number/String/ContentPanel} panelId The panels index, id or the panel itself
+     * @return {YAHOO.ext.ContentPanel} The shown panel or null
+     */
+    showPanel : function(panel){
+        if(panel = this.getPanel(panel)){
+            this.setActivePanel(panel);
+        }
+        return panel;
+    },
+    
+    /**
+     * Get the active panel for this region.
+     * @return {YAHOO.ext.ContentPanel} The active panel or null
+     */
+    getActivePanel : function(){
+        return this.activePanel;
+    },
+    
+    /**
+     * Add the passed ContentPanel(s)
+     * @param {ContentPanel...} panel The ContentPanel(s) to add (you can pass more than one)
+     * @return {YAHOO.ext.ContentPanel} The panel added (if only one was added)
+     */
+    add : function(panel){
+        if(arguments.length > 1){
+            for(var i = 0, len = arguments.length; i < len; i++) {
+            	this.add(arguments[i]);
+            }
+            return null;
+        }
+        if(this.hasPanel(panel)){
+            this.showPanel(panel);
+            return panel;
+        }
+        panel.setRegion(this);
+        this.panels.add(panel);
+        panel.getEl().setStyle('position', 'absolute');
+        if(!panel.background){
+            this.setActivePanel(panel);
+            if(this.config.initialSize && this.panels.getCount()==1){
+                this.resizeTo(this.config.initialSize);
+            }
+        }
+        this.fireEvent('paneladded', this, panel);
+        return panel;
+    },
+    
+    /**
+     * Returns true if the panel is in this region.
+     * @param {Number/String/ContentPanel} panel The panels index, id or the panel itself
+     * @return {Boolean}
+     */
+    hasPanel : function(panel){
+        if(typeof panel == 'object'){ // must be panel obj
+            panel = panel.getId();
+        }
+        return this.getPanel(panel) ? true : false;
+    },
+    
+    /**
+     * Removes the specified panel. If preservePanel is not true (either here or in the config), the panel is destroyed.
+     * @param {Number/String/ContentPanel} panel The panels index, id or the panel itself
+     * @param {Boolean} preservePanel Overrides the config preservePanel option
+     * @return {YAHOO.ext.ContentPanel} The panel that was removed
+     */
+    remove : function(panel, preservePanel){
+        panel = this.getPanel(panel);
+        if(!panel){
+            return null;
+        }
+        var e = {};
+        this.fireEvent('beforeremove', this, panel, e);
+        if(e.cancel === true){
+            return null;
+        }
+        var panelId = panel.getId();
+        this.panels.removeKey(panelId);
+        return panel;
+    },
+    
+    /**
+     * Returns the panel specified or null if it's not in this region.
+     * @param {Number/String/ContentPanel} panel The panels index, id or the panel itself
+     * @return {YAHOO.ext.ContentPanel}
+     */
+    getPanel : function(id){
+        if(typeof id == 'object'){ // must be panel obj
+            return id;
+        }
+        return this.panels.get(id);
+    },
+    
+    /**
+     * Returns this regions position (north/south/east/west/center).
+     * @return {String} 
+     */
+    getPosition: function(){
+        return this.position;    
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/layout/BorderLayout.js b/frontend/beta/js/YUI-extensions/layout/BorderLayout.js
new file mode 100644
index 0000000..0529c24
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/layout/BorderLayout.js
@@ -0,0 +1,281 @@
+/**
+ * @class YAHOO.ext.BorderLayout
+ * @extends YAHOO.ext.LayoutManager
+ * This class represents a common layout manager used in desktop applications. For screenshots and more details,
+ * please see: <br><br>
+ * <a href="http://www.jackslocum.com/yui/2006/10/19/cross-browser-web-20-layouts-with-yahoo-ui/">Cross Browser Layouts - Part 1</a><br>
+ * <a href="http://www.jackslocum.com/yui/2006/10/28/cross-browser-web-20-layouts-part-2-ajax-feed-viewer-20/">Cross Browser Layouts - Part 2</a><br><br>
+ * Example:
+ <pre><code>
+ var layout = new YAHOO.ext.BorderLayout(document.body, {
+    north: {
+        initialSize: 25,
+        titlebar: false
+    },
+    west: {
+        split:true,
+        initialSize: 200,
+        minSize: 175,
+        maxSize: 400,
+        titlebar: true,
+        collapsible: true
+    },
+    east: {
+        split:true,
+        initialSize: 202,
+        minSize: 175,
+        maxSize: 400,
+        titlebar: true,
+        collapsible: true
+    },
+    south: {
+        split:true,
+        initialSize: 100,
+        minSize: 100,
+        maxSize: 200,
+        titlebar: true,
+        collapsible: true
+    },
+    center: {
+        titlebar: true,
+        autoScroll:true,
+        resizeTabs: true,
+        minTabWidth: 50,
+        preferredTabWidth: 150
+    }
+});
+
+// shorthand
+var CP = YAHOO.ext.ContentPanel;
+
+layout.beginUpdate();
+layout.add('north', new CP('north', 'North'));
+layout.add('south', new CP('south', {title: 'South', closable: true}));
+layout.add('west', new CP('west', {title: 'West'}));
+layout.add('east', new CP('autoTabs', {title: 'Auto Tabs', closable: true}));
+layout.add('center', new CP('center1', {title: 'Close Me', closable: true}));
+layout.add('center', new CP('center2', {title: 'Center Panel', closable: false}));
+layout.getRegion('center').showPanel('center1');
+layout.endUpdate();
+</code></pre>
+* @constructor
+* Create a new BorderLayout
+* @param {String/HTMLElement/Element} container The container this layout is bound to
+* @param {Object} config Configuration options
+ */
+YAHOO.ext.BorderLayout = function(container, config){
+    config = config || {};
+    YAHOO.ext.BorderLayout.superclass.constructor.call(this, container);
+    this.factory = config.factory || YAHOO.ext.BorderLayout.RegionFactory;
+    /** 
+     * True to hide the center panel while performing layouts. This helps when the center region contains 
+     * heavy components such as a yui-ext grid. 
+     * @type Boolean
+     */
+    this.hideOnLayout = config.hideOnLayout || false;
+    for(var i = 0, len = this.factory.validRegions.length; i < len; i++) {
+    	var target = this.factory.validRegions[i];
+    	if(config[target]){
+    	    this.addRegion(target, config[target]);
+    	}
+    }
+    //this.dragOverDelegate = YAHOO.ext.EventManager.wrap(this.onDragOver, this, true);
+};
+
+YAHOO.extendX(YAHOO.ext.BorderLayout, YAHOO.ext.LayoutManager, {
+    /**
+     * Creates and adds a new region if it doesn't already exist.
+     * @param {String} target The target region key (north, south, east, west or center).
+     * @param {Object} config The regions config object
+     * @return {BorderLayoutRegion} The new region
+     */
+    addRegion : function(target, config){
+        if(!this.regions[target]){
+            var r = this.factory.create(target, this, config);
+    	    this.regions[target] = r;
+    	    r.on('visibilitychange', this.layout, this, true);
+            r.on('paneladded', this.layout, this, true);
+            r.on('panelremoved', this.layout, this, true);
+            r.on('invalidated', this.layout, this, true);
+            r.on('resized', this.onRegionResized, this, true);
+            r.on('collapsed', this.onRegionCollapsed, this, true);
+            r.on('expanded', this.onRegionExpanded, this, true);
+        }
+        return this.regions[target];
+    },
+    
+    /**
+     * Performs a layout update.
+     */
+    layout : function(){
+        if(this.updating) return;
+        //var bench = new YAHOO.ext.util.Bench();
+	    //bench.start('Layout...');
+        var size = this.getViewSize();
+        var w = size.width, h = size.height;
+        var centerW = w, centerH = h, centerY = 0, centerX = 0;
+        var x = 0, y = 0;
+        
+        var rs = this.regions;
+        var n = rs['north'], s = rs['south'], west = rs['west'], e = rs['east'], c = rs['center'];
+        if(this.hideOnLayout){
+            c.el.setStyle('display', 'none');
+        }
+        if(n && n.isVisible()){
+            var b = n.getBox();
+            var m = n.getMargins();
+            b.width = w - (m.left+m.right);
+            b.x = m.left;
+            b.y = m.top;
+            centerY = b.height + b.y + m.bottom;
+            centerH -= centerY;
+            n.updateBox(this.safeBox(b));
+        }
+        if(s && s.isVisible()){
+            var b = s.getBox();
+            var m = s.getMargins();
+            b.width = w - (m.left+m.right);
+            b.x = m.left;
+            var totalHeight = (b.height + m.top + m.bottom);
+            b.y = h - totalHeight + m.top;
+            centerH -= totalHeight;
+            s.updateBox(this.safeBox(b));
+        }
+        if(west && west.isVisible()){
+            var b = west.getBox();
+            var m = west.getMargins();
+            b.height = centerH - (m.top+m.bottom);
+            b.x = m.left;
+            b.y = centerY + m.top;
+            var totalWidth = (b.width + m.left + m.right);
+            centerX += totalWidth;
+            centerW -= totalWidth;
+            west.updateBox(this.safeBox(b));
+        }
+        if(e && e.isVisible()){
+            var b = e.getBox();
+            var m = e.getMargins();
+            b.height = centerH - (m.top+m.bottom);
+            var totalWidth = (b.width + m.left + m.right);
+            b.x = w - totalWidth + m.left;
+            b.y = centerY + m.top;
+            centerW -= totalWidth;
+            e.updateBox(this.safeBox(b));
+        }
+        if(c){
+            var m = c.getMargins();
+            var centerBox = {
+                x: centerX + m.left,
+                y: centerY + m.top,
+                width: centerW - (m.left+m.right),
+                height: centerH - (m.top+m.bottom)
+            };
+            if(this.hideOnLayout){
+                c.el.setStyle('display', 'block');
+            }
+            c.updateBox(this.safeBox(centerBox));
+        }
+        this.el.repaint();
+        this.fireEvent('layout', this);
+        //bench.stop();
+	    //alert(bench.toString());
+    },
+    
+    safeBox : function(box){
+        box.width = Math.max(0, box.width);
+        box.height = Math.max(0, box.height);
+        return box;
+    },
+    
+    /**
+     * Adds a ContentPanel (or subclass) to this layout.
+     * @param {String} target The target region key (north, south, east, west or center).
+     * @param {YAHOO.ext.ContentPanel} panel The panel to add
+     * @return {YAHOO.ext.ContentPanel} The added panel
+     */
+    add : function(target, panel){
+        target = target.toLowerCase();
+        return this.regions[target].add(panel);
+    },
+    
+    /**
+     * Adds a ContentPanel (or subclass) to this layout.
+     * @param {String} target The target region key (north, south, east, west or center).
+     * @param {Number/String/YAHOO.ext.ContentPanel} panel The index, id or panel to remove
+     * @return {YAHOO.ext.ContentPanel} The removed panel
+     */
+    remove : function(target, panel){
+        target = target.toLowerCase();
+        return this.regions[target].remove(panel);
+    },
+    
+    /**
+     * Searches all regions for a panel with the specified id
+     * @param {String} panelId
+     * @return {YAHOO.ext.ContentPanel} The panel or null if it wasn't found
+     */
+    findPanel : function(panelId){
+        var rs = this.regions;
+        for(var target in rs){
+            if(typeof rs[target] != 'function'){
+                var p = rs[target].getPanel(panelId);
+                if(p){
+                    return p;
+                }
+            }
+        }
+        return null;
+    },
+    
+    /**
+     * Searches all regions for a panel with the specified id and activates (shows) it.
+     * @param {String/ContentPanel} panelId The panels id or the panel itself
+     * @return {YAHOO.ext.ContentPanel} The shown panel or null
+     */
+    showPanel : function(panelId) {
+      var rs = this.regions;
+      for(var target in rs){
+         var r = rs[target];
+         if(typeof r != 'function'){
+            if(r.hasPanel(panelId)){
+               return r.showPanel(panelId);
+            }
+         }
+      }
+      return null;
+   },
+   
+   /**
+     * Restores this layouts state using YAHOO.ext.state.Manager or the state provided by the passed provider.
+     * @param {YAHOO.ext.state.Provider} provider (optional) An alternate state provider
+     */
+    restoreState : function(provider){
+        if(!provider){
+            provider = YAHOO.ext.state.Manager;
+        }
+        var sm = new YAHOO.ext.LayoutStateManager();
+        sm.init(this, provider);
+    }
+});
+
+YAHOO.ext.BorderLayout.RegionFactory = {};
+YAHOO.ext.BorderLayout.RegionFactory.validRegions = ['north','south','east','west','center'];
+YAHOO.ext.BorderLayout.RegionFactory.create = function(target, mgr, config){
+    target = target.toLowerCase();
+    if(config.lightweight || config.basic){
+        return new YAHOO.ext.BasicLayoutRegion(mgr, config, target);
+    }
+    switch(target){
+        case 'north':
+            return new YAHOO.ext.NorthLayoutRegion(mgr, config);
+        case 'south':
+            return new YAHOO.ext.SouthLayoutRegion(mgr, config);
+        case 'east':
+            return new YAHOO.ext.EastLayoutRegion(mgr, config);
+        case 'west':
+            return new YAHOO.ext.WestLayoutRegion(mgr, config);
+        case 'center':
+            return new YAHOO.ext.CenterLayoutRegion(mgr, config);
+    }
+    throw 'Layout region "'+target+'" not supported.';
+};
diff --git a/frontend/beta/js/YUI-extensions/layout/BorderLayoutRegions.js b/frontend/beta/js/YUI-extensions/layout/BorderLayoutRegions.js
new file mode 100644
index 0000000..9b4a09f
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/layout/BorderLayoutRegions.js
@@ -0,0 +1,207 @@
+/*
+ * These classes are private internal classes
+ */
+YAHOO.ext.CenterLayoutRegion = function(mgr, config){
+    YAHOO.ext.CenterLayoutRegion.superclass.constructor.call(this, mgr, config, 'center');
+    this.visible = true;
+    this.minWidth = config.minWidth || 20;
+    this.minHeight = config.minHeight || 20;
+};
+
+YAHOO.extendX(YAHOO.ext.CenterLayoutRegion, YAHOO.ext.LayoutRegion, {
+    hide : function(){
+        // center panel can't be hidden
+    },
+    
+    show : function(){
+        // center panel can't be hidden
+    },
+    
+    getMinWidth: function(){
+        return this.minWidth;
+    },
+    
+    getMinHeight: function(){
+        return this.minHeight;
+    }
+});
+
+
+YAHOO.ext.NorthLayoutRegion = function(mgr, config){
+    YAHOO.ext.NorthLayoutRegion.superclass.constructor.call(this, mgr, config, 'north', 'n-resize');
+    if(this.split){
+        this.split.placement = YAHOO.ext.SplitBar.TOP;
+        this.split.orientation = YAHOO.ext.SplitBar.VERTICAL;
+        this.split.el.addClass('ylayout-split-v');
+    }
+    if(typeof config.initialSize != 'undefined'){
+        this.el.setHeight(config.initialSize);
+    }
+};
+YAHOO.extendX(YAHOO.ext.NorthLayoutRegion, YAHOO.ext.SplitLayoutRegion, {
+    getBox : function(){
+        if(this.collapsed){
+            return this.collapsedEl.getBox();
+        }
+        var box = this.el.getBox();
+        if(this.split){
+            box.height += this.split.el.getHeight();
+        }
+        return box;
+    },
+    
+    updateBox : function(box){
+        if(this.split && !this.collapsed){
+            box.height -= this.split.el.getHeight();
+            this.split.el.setLeft(box.x);
+            this.split.el.setTop(box.y+box.height);
+            this.split.el.setWidth(box.width);
+        }
+        if(this.collapsed){
+            this.el.setWidth(box.width);
+            var bodyWidth = box.width - this.el.getBorderWidth('rl');
+            this.bodyEl.setWidth(bodyWidth);
+            if(this.activePanel && this.panelSize){
+                this.activePanel.setSize(bodyWidth, this.panelSize.height);
+            }
+        }
+        YAHOO.ext.NorthLayoutRegion.superclass.updateBox.call(this, box);
+    }
+});
+
+YAHOO.ext.SouthLayoutRegion = function(mgr, config){
+    YAHOO.ext.SouthLayoutRegion.superclass.constructor.call(this, mgr, config, 'south', 's-resize');
+    if(this.split){
+        this.split.placement = YAHOO.ext.SplitBar.BOTTOM;
+        this.split.orientation = YAHOO.ext.SplitBar.VERTICAL;
+        this.split.el.addClass('ylayout-split-v');
+    }
+    if(typeof config.initialSize != 'undefined'){
+        this.el.setHeight(config.initialSize);
+    }
+};
+YAHOO.extendX(YAHOO.ext.SouthLayoutRegion, YAHOO.ext.SplitLayoutRegion, {
+    getBox : function(){
+        if(this.collapsed){
+            return this.collapsedEl.getBox();
+        }
+        var box = this.el.getBox();
+        if(this.split){
+            var sh = this.split.el.getHeight();
+            box.height += sh;
+            box.y -= sh;
+        }
+        return box;
+    },
+    
+    updateBox : function(box){
+        if(this.split && !this.collapsed){
+            var sh = this.split.el.getHeight();
+            box.height -= sh;
+            box.y += sh;
+            this.split.el.setLeft(box.x);
+            this.split.el.setTop(box.y-sh);
+            this.split.el.setWidth(box.width);
+        }
+        if(this.collapsed){
+            this.el.setWidth(box.width);
+            var bodyWidth = box.width - this.el.getBorderWidth('rl');
+            this.bodyEl.setWidth(bodyWidth);
+            if(this.activePanel && this.panelSize){
+                this.activePanel.setSize(bodyWidth, this.panelSize.height);
+            }
+        }
+        YAHOO.ext.SouthLayoutRegion.superclass.updateBox.call(this, box);
+    }
+});
+
+YAHOO.ext.EastLayoutRegion = function(mgr, config){
+    YAHOO.ext.EastLayoutRegion.superclass.constructor.call(this, mgr, config, 'east', 'e-resize');
+    if(this.split){
+        this.split.placement = YAHOO.ext.SplitBar.RIGHT;
+        this.split.orientation = YAHOO.ext.SplitBar.HORIZONTAL;
+        this.split.el.addClass('ylayout-split-h');
+    }
+    if(typeof config.initialSize != 'undefined'){
+        this.el.setWidth(config.initialSize);
+    }
+};
+YAHOO.extendX(YAHOO.ext.EastLayoutRegion, YAHOO.ext.SplitLayoutRegion, {
+    getBox : function(){
+        if(this.collapsed){
+            return this.collapsedEl.getBox();
+        }
+        var box = this.el.getBox();
+        if(this.split){
+            var sw = this.split.el.getWidth();
+            box.width += sw;
+            box.x -= sw;
+        }
+        return box;
+    },
+    
+    updateBox : function(box){
+        if(this.split && !this.collapsed){
+            var sw = this.split.el.getWidth();
+            box.width -= sw;
+            this.split.el.setLeft(box.x);
+            this.split.el.setTop(box.y);
+            this.split.el.setHeight(box.height);
+            box.x += sw;
+        }
+        if(this.collapsed){
+            this.el.setHeight(box.height);
+            var bodyHeight = this.config.titlebar ? box.height - (this.titleEl.getHeight()||0) : box.height;
+            bodyHeight -= this.el.getBorderWidth('tb');
+            this.bodyEl.setHeight(bodyHeight);
+            if(this.activePanel && this.panelSize){
+                this.activePanel.setSize(this.panelSize.width, bodyHeight);
+            }
+        }
+        YAHOO.ext.EastLayoutRegion.superclass.updateBox.call(this, box);
+    }
+});
+
+YAHOO.ext.WestLayoutRegion = function(mgr, config){
+    YAHOO.ext.WestLayoutRegion.superclass.constructor.call(this, mgr, config, 'west', 'w-resize');
+    if(this.split){
+        this.split.placement = YAHOO.ext.SplitBar.LEFT;
+        this.split.orientation = YAHOO.ext.SplitBar.HORIZONTAL;
+        this.split.el.addClass('ylayout-split-h');
+    }
+    if(typeof config.initialSize != 'undefined'){
+        this.el.setWidth(config.initialSize);
+    }
+};
+YAHOO.extendX(YAHOO.ext.WestLayoutRegion, YAHOO.ext.SplitLayoutRegion, {
+    getBox : function(){
+        if(this.collapsed){
+            return this.collapsedEl.getBox();
+        }
+        var box = this.el.getBox();
+        if(this.split){
+            box.width += this.split.el.getWidth();
+        }
+        return box;
+    },
+    
+    updateBox : function(box){
+        if(this.split && !this.collapsed){
+            var sw = this.split.el.getWidth();
+            box.width -= sw;
+            this.split.el.setLeft(box.x+box.width);
+            this.split.el.setTop(box.y);
+            this.split.el.setHeight(box.height);
+        }
+        if(this.collapsed){
+            this.el.setHeight(box.height);
+            var bodyHeight = this.config.titlebar ? box.height - (this.titleEl.getHeight()||0) : box.height;
+            bodyHeight -= this.el.getBorderWidth('tb');
+            this.bodyEl.setHeight(bodyHeight);
+            if(this.activePanel && this.panelSize){
+                this.activePanel.setSize(this.panelSize.width, bodyHeight);
+            }
+        }
+        YAHOO.ext.WestLayoutRegion.superclass.updateBox.call(this, box);
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/layout/ContentPanels.js b/frontend/beta/js/YUI-extensions/layout/ContentPanels.js
new file mode 100644
index 0000000..7cfdde7
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/layout/ContentPanels.js
@@ -0,0 +1,325 @@
+/**
+ * @class YAHOO.ext.ContentPanel
+ * @extends YAHOO.ext.util.Observable
+ * A basic ContentPanel element.
+ * @cfg {Boolean} fitToFrame True for this panel to manually adjust it's size when the region resizes  (defaults to false)
+ * @cfg {Boolean/Object} autoCreate True to auto generate the DOM element for this panel, or a DomHelper config of the element to create
+ * @cfg {Boolean} closable True if the panel can be closed/removed
+ * @cfg {Boolean} background True if the panel should not be activated when it is added (defaults to false)
+ * @cfg {String/HTMLElement/Element} resizeEl An element to resize if fitToFrame is true (instead of this panel's element)
+ * @cfg {Toolbar} toolbar A toolbar for this panel
+ * @cfg {Boolean} autoScroll True to scroll overflow in this panel (use with fitToFrame)
+ * @cfg {String} title The title for this panel
+ * @cfg {Array} adjustments Values to <b>add</b> to the width/height when doing a fitToFrame (default is [0, 0])
+ * @constructor
+ * Create a new ContentPanel.
+ * @param {String/HTMLElement/Element} el The container element for this panel
+ * @param {String/Object} config A string to set only the title or a config object
+ * @param {String} content (optional) Set the HTML content for this panel
+ */
+YAHOO.ext.ContentPanel = function(el, config, content){
+    YAHOO.ext.ContentPanel.superclass.constructor.call(this);
+    this.el = getEl(el, true);
+    if(!this.el && config && config.autoCreate){
+        if(typeof config.autoCreate == 'object'){
+            if(!config.autoCreate.id){
+                config.autoCreate.id = el;
+            }
+            this.el = YAHOO.ext.DomHelper.append(document.body,
+                        config.autoCreate, true);
+        }else{
+            this.el = YAHOO.ext.DomHelper.append(document.body,
+                        {tag: 'div', cls: 'ylayout-inactive-content', id: el}, true);
+        }
+    }
+    this.closable = false;
+    this.loaded = false;
+    this.active = false;
+    if(typeof config == 'string'){
+        this.title = config;
+    }else{
+        YAHOO.ext.util.Config.apply(this, config);
+    }
+    if(this.resizeEl){
+        this.resizeEl = getEl(this.resizeEl, true);
+    }else{
+        this.resizeEl = this.el;
+    }
+    this.events = {
+        /**
+         * @event activate
+         * Fires when this panel is activated. 
+         * @param {YAHOO.ext.ContentPanel} this
+         */
+        'activate' : new YAHOO.util.CustomEvent('activate'),
+        /**
+         * @event deactivate
+         * Fires when this panel is activated. 
+         * @param {YAHOO.ext.ContentPanel} this
+         */
+        'deactivate' : new YAHOO.util.CustomEvent('deactivate') 
+    };
+    if(this.autoScroll){
+        this.resizeEl.setStyle('overflow', 'auto');
+    }
+    if(content){
+        this.setContent(content);
+    }
+};
+
+YAHOO.extendX(YAHOO.ext.ContentPanel, YAHOO.ext.util.Observable, {
+    setRegion : function(region){
+        this.region = region;
+        if(region){
+           this.el.replaceClass('ylayout-inactive-content', 'ylayout-active-content'); 
+        }else{
+           this.el.replaceClass('ylayout-active-content', 'ylayout-inactive-content'); 
+        } 
+    },
+    
+    /**
+     * Returns the toolbar for this Panel if one was configured
+     * @return {YAHOO.ext.Toolbar} 
+     */
+    getToolbar : function(){
+        return this.toolbar;
+    },
+    
+    setActiveState : function(active){
+        this.active = active;
+        if(!active){
+            this.fireEvent('deactivate', this);
+        }else{
+            this.fireEvent('activate', this);
+        }
+    },
+    /**
+     * Updates this panel's element
+     * @param {String} content The new content
+     * @param {<i>Boolean</i>} loadScripts (optional) true to look for and process scripts
+    */
+    setContent : function(content, loadScripts){
+        this.el.update(content, loadScripts);
+    },
+    
+    /**
+     * Get the {@link YAHOO.ext.UpdateManager} for this panel. Enables you to perform Ajax updates.
+     * @return {YAHOO.ext.UpdateManager} The UpdateManager
+     */
+    getUpdateManager : function(){
+        return this.el.getUpdateManager();
+    },
+    
+    /**
+     * Set a URL to be used to load the content for this panel.
+     * @param {String/Function} url The url to load the content from or a function to call to get the url
+     * @param {<i>String/Object</i>} params (optional) The string params for the update call or an object of the params. See {@link YAHOO.ext.UpdateManager#update} for more details. (Defaults to null)
+     * @param {<i>Boolean</i>} loadOnce (optional) Whether to only load the content once. If this is false it makes the Ajax call every time this panel is activated. (Defaults to false)
+     * @return {YAHOO.ext.UpdateManager} The UpdateManager
+     */
+    setUrl : function(url, params, loadOnce){
+        if(this.refreshDelegate){
+            this.removeListener('activate', this.refreshDelegate);
+        }
+        this.refreshDelegate = this._handleRefresh.createDelegate(this, [url, params, loadOnce]);
+        this.on('activate', this._handleRefresh.createDelegate(this, [url, params, loadOnce]));
+        return this.el.getUpdateManager();
+    },
+    
+    _handleRefresh : function(url, params, loadOnce){
+        if(!loadOnce || !this.loaded){
+            var updater = this.el.getUpdateManager();
+            updater.update(url, params, this._setLoaded.createDelegate(this));
+        }
+    },
+    
+    _setLoaded : function(){
+        this.loaded = true;
+    }, 
+    
+    /**
+     * Returns this panel's id
+     * @return {String} 
+     */
+    getId : function(){
+        return this.el.id;
+    },
+    
+    /**
+     * Returns this panel's element
+     * @return {YAHOO.ext.Element} 
+     */
+    getEl : function(){
+        return this.el;
+    },
+    
+    adjustForComponents : function(width, height){
+        if(this.toolbar){
+            var te = this.toolbar.getEl();
+            height -= te.getHeight();
+            te.setWidth(width);
+        }
+        if(this.adjustments){
+            width += this.adjustments[0];
+            height += this.adjustments[1];
+        }
+        return {'width': width, 'height': height};
+    },
+    
+    setSize : function(width, height){
+        if(this.fitToFrame){
+            var size = this.adjustForComponents(width, height);
+            this.resizeEl.setSize(this.autoWidth ? 'auto' : size.width, size.height);
+        }
+    },
+    
+    /**
+     * Returns this panel's title
+     * @return {String} 
+     */
+    getTitle : function(){
+        return this.title;
+    },
+    
+    /**
+     * Set this panel's title
+     * @param {String} title
+     */
+    setTitle : function(title){
+        this.title = title;
+        if(this.region){
+            this.region.updatePanelTitle(this, title);
+        }
+    },
+    
+    /**
+     * Returns true is this panel was configured to be closable
+     * @return {Boolean} 
+     */
+    isClosable : function(){
+        return this.closable;
+    },
+    
+    beforeSlide : function(){
+        this.el.clip();
+        this.resizeEl.clip();
+    },
+    
+    afterSlide : function(){
+        this.el.unclip();
+        this.resizeEl.unclip();
+    },
+    
+    /**
+     *   Force a content refresh from the URL specified in the setUrl() method.
+     *   Will fail silently if the setUrl method has not been called.
+     *   This does not activate the panel, just updates its content.
+     */
+    refresh : function(){
+        if(this.refreshDelegate){
+           this.loaded = false;
+           this.refreshDelegate();
+        }
+    },
+    
+    /**
+     * Destroys this panel
+     */
+    destroy : function(){
+        this.el.removeAllListeners();
+        var tempEl = document.createElement('span');
+        tempEl.appendChild(this.el.dom);
+        tempEl.innerHTML = '';
+        this.el = null;
+    }
+});
+
+/**
+ * @class YAHOO.ext.GridPanel
+ * @extends YAHOO.ext.ContentPanel
+ * @constructor
+ * Create a new GridPanel.
+ * @param {YAHOO.ext.grid.Grid} grid The grid for this panel
+ * @param {String/Object} config A string to set only the title or a config object
+ */
+YAHOO.ext.GridPanel = function(grid, config){
+    this.wrapper = YAHOO.ext.DomHelper.append(document.body, // wrapper for IE7 strict & safari scroll issue
+        {tag: 'div', cls: 'ylayout-grid-wrapper ylayout-inactive-content'}, true);
+    this.wrapper.dom.appendChild(grid.container.dom);
+    YAHOO.ext.GridPanel.superclass.constructor.call(this, this.wrapper, config);
+    if(this.toolbar){
+        this.toolbar.el.insertBefore(this.wrapper.dom.firstChild);
+    }
+    grid.monitorWindowResize = false; // turn off autosizing
+    grid.autoHeight = false;
+    grid.autoWidth = false;
+    this.grid = grid;
+    this.grid.container.replaceClass('ylayout-inactive-content', 'ylayout-component-panel');
+};
+
+YAHOO.extendX(YAHOO.ext.GridPanel, YAHOO.ext.ContentPanel, {
+    getId : function(){
+        return this.grid.id;
+    },
+    
+    /**
+     * Returns the grid for this panel
+     * @return {YAHOO.ext.grid.Grid} 
+     */
+    getGrid : function(){
+        return this.grid;    
+    },
+    
+    setSize : function(width, height){
+        var grid = this.grid;
+        var size = this.adjustForComponents(width, height);
+        grid.container.setSize(size.width, size.height);
+        grid.autoSize();
+    },
+    
+    beforeSlide : function(){
+        this.grid.getView().wrapEl.clip();
+    },
+    
+    afterSlide : function(){
+        this.grid.getView().wrapEl.unclip();
+    },
+    
+    destroy : function(){
+        this.grid.getView().unplugDataModel(this.grid.getDataModel());
+        this.grid.container.removeAllListeners();
+        YAHOO.ext.GridPanel.superclass.destroy.call(this);
+    }
+});
+
+
+/**
+ * @class YAHOO.ext.NestedLayoutPanel
+ * @extends YAHOO.ext.ContentPanel
+ * @constructor
+ * Create a new NestedLayoutPanel.
+ * @param {YAHOO.ext.BorderLayout} layout The layout for this panel
+ * @param {String/Object} config A string to set only the title or a config object
+ */
+YAHOO.ext.NestedLayoutPanel = function(layout, config){
+    YAHOO.ext.NestedLayoutPanel.superclass.constructor.call(this, layout.getEl(), config);
+    layout.monitorWindowResize = false; // turn off autosizing
+    this.layout = layout;
+    this.layout.getEl().addClass('ylayout-nested-layout');
+};
+
+YAHOO.extendX(YAHOO.ext.NestedLayoutPanel, YAHOO.ext.ContentPanel, {
+    setSize : function(width, height){
+        var size = this.adjustForComponents(width, height);
+        this.layout.getEl().setSize(size.width, size.height);
+        this.layout.layout();
+    },
+    
+    /**
+     * Returns the nested BorderLayout for this panel
+     * @return {YAHOO.ext.BorderLayout} 
+     */
+    getLayout : function(){
+        return this.layout;
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/layout/LayoutManager.js b/frontend/beta/js/YUI-extensions/layout/LayoutManager.js
new file mode 100644
index 0000000..c59bf0e
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/layout/LayoutManager.js
@@ -0,0 +1,135 @@
+/**
+ * @class YAHOO.ext.LayoutManager
+ * @extends YAHOO.ext.util.Observable
+ * Base class for layout managers.
+ */
+YAHOO.ext.LayoutManager = function(container){
+    YAHOO.ext.LayoutManager.superclass.constructor.call(this);
+    this.el = getEl(container, true);
+    // ie scrollbar fix
+    if(this.el.dom == document.body && YAHOO.ext.util.Browser.isIE){
+        document.body.scroll = 'no';
+    }
+    this.id = this.el.id;
+    this.el.addClass('ylayout-container');
+    /** false to disable window resize monitoring @type Boolean */
+    this.monitorWindowResize = true;
+    this.regions = {};
+    this.events = {
+        /**
+         * @event layout
+         * Fires when a layout is performed. 
+         * @param {YAHOO.ext.LayoutManager} this
+         */
+        'layout' : new YAHOO.util.CustomEvent(),
+        /**
+         * @event regionresized
+         * Fires when the user resizes a region. 
+         * @param {YAHOO.ext.LayoutRegion} region
+         * @param {Number} newSize The new size (width for east/west, height for north/south)
+         */
+        'regionresized' : new YAHOO.util.CustomEvent(),
+        /**
+         * @event regioncollapsed
+         * Fires when a region is collapsed. 
+         * @param {YAHOO.ext.LayoutRegion} region
+         */
+        'regioncollapsed' : new YAHOO.util.CustomEvent(),
+        /**
+         * @event regionexpanded
+         * Fires when a region is expanded.  
+         * @param {YAHOO.ext.LayoutRegion} region
+         */
+        'regionexpanded' : new YAHOO.util.CustomEvent()
+    };
+    this.updating = false;
+    YAHOO.ext.EventManager.onWindowResize(this.onWindowResize, this, true);
+};
+
+YAHOO.extendX(YAHOO.ext.LayoutManager, YAHOO.ext.util.Observable, {
+    /**
+     * Returns true if this layout is currently being updated
+     * @return {Boolean}
+     */
+    isUpdating : function(){
+        return this.updating; 
+    },
+    
+    /**
+     * Suspend the LayoutManager from doing auto-layouts while
+     * making multiple add or remove calls
+     */
+    beginUpdate : function(){
+        this.updating = true;    
+    },
+    
+    /**
+     * Restore auto-layouts and optionally disable the manager from performing a layout
+     * @param {Boolean} noLayout true to disable a layout update 
+     */
+    endUpdate : function(noLayout){
+        this.updating = false;
+        if(!noLayout){
+            this.layout();
+        }    
+    },
+    
+    layout: function(){
+        
+    },
+    
+    onRegionResized : function(region, newSize){
+        this.fireEvent('regionresized', region, newSize);
+        this.layout();
+    },
+    
+    onRegionCollapsed : function(region){
+        this.fireEvent('regioncollapsed', region);
+    },
+    
+    onRegionExpanded : function(region){
+        this.fireEvent('regionexpanded', region);
+    },
+        
+    /**
+     * Returns the size of the current view, This method normalizes document.body and element embedded layouts and
+     * performs box-model adjustments.
+     * @return {Object} The size as an object {width: (the width), height: (the height)}
+     */
+    getViewSize : function(){
+        var size;
+        if(this.el.dom != document.body){
+            this.el.beginMeasure();
+            size = this.el.getSize();
+            this.el.endMeasure();
+        }else{
+            size = {width: YAHOO.util.Dom.getViewportWidth(), height: YAHOO.util.Dom.getViewportHeight()};
+        }
+        size.width -= this.el.getBorderWidth('lr')-this.el.getPadding('lr');
+        size.height -= this.el.getBorderWidth('tb')-this.el.getPadding('tb');
+        return size;
+    },
+    
+    /**
+     * Returns the element this layout is bound to.
+     * @return {YAHOO.ext.Element}
+     */
+    getEl : function(){
+        return this.el;
+    },
+    
+    /**
+     * Returns the specified region.
+     * @param {String} target The region key
+     * @return {YAHOO.ext.LayoutRegion}
+     */
+    getRegion : function(target){
+        return this.regions[target.toLowerCase()];
+    },
+    
+    onWindowResize : function(){
+        if(this.monitorWindowResize){
+            this.layout();
+        }
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/layout/LayoutRegion.js b/frontend/beta/js/YUI-extensions/layout/LayoutRegion.js
new file mode 100644
index 0000000..fa8a1b6
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/layout/LayoutRegion.js
@@ -0,0 +1,496 @@
+/**
+ * @class YAHOO.ext.LayoutRegion
+ * @extends YAHOO.ext.util.Observable
+ * This class represents a region in a layout manager.
+ * @cfg {Boolean} collapsible False to disable collapsing (defaults to true)
+ * @cfg {Boolean} floatable False to disable floating (defaults to true)
+ * @cfg {Object} margins Margins for the element (defaults to {top: 0, left: 0, right:0, bottom: 0})
+ * @cfg {Object} cmargins Margins for the element when collapsed (defaults to: north/south {top: 2, left: 0, right:0, bottom: 2} or east/west {top: 0, left: 2, right:2, bottom: 0})
+ * @cfg {String} tabPosition 'top' or 'bottom' (defaults to 'bottom')
+ * @cfg {Boolean} alwaysShowTabs True to always display tabs even when only 1 panel (defaults to false)
+ * @cfg {Boolean} autoScroll True to enable overflow scrolling (defaults to false)
+ * @cfg {Boolean} titlebar True to display a title bar (defaults to true)
+ * @cfg {String} title The title for the region (overrides panel titles)
+ * @cfg {Boolean} animate True to animate expand/collapse (defaults to false)
+ * @cfg {Float} duration The duration of the expand/collapse animation in seconds 
+ * @cfg {Float} slideDuration The duration of the slide out/in when collapsed in seconds
+ * @cfg {Boolean} autoHide False to disable disable autoHide when the mouse leaves the "floated" region (defaults to true)
+ * @cfg {Boolean} preservePanels True to preserve removed panels so they can be readded later (defaults to false)
+ * @cfg {Boolean} closeOnTabs True to place the close icon on the tabs instead of the region titlebar (defaults to false)
+ * @cfg {Boolean} hideTabs True to hide the tab strip (defaults to false)
+ * @cfg {Boolean} resizeTabs True to enable automatic tab resizing. This will resize the tabs so they are all the same size and fit within 
+ * the space available, similar to FireFox 1.5 tabs (defaults to false)
+ * @cfg {Number} minTabWidth The minimum tab width (defaults to 40)
+ * @cfg {Number} preferredTabWidth The preferred tab width (defaults to 150)
+ */
+YAHOO.ext.LayoutRegion = function(mgr, config, pos){
+    YAHOO.ext.LayoutRegion.superclass.constructor.call(this, mgr, config, pos, true);
+    var dh = YAHOO.ext.DomHelper;
+    /** This regions container element @type YAHOO.ext.Element */
+    this.el = dh.append(mgr.el.dom, {tag: 'div', cls: 'ylayout-panel ylayout-panel-' + this.position}, true);
+    /** This regions title element @type YAHOO.ext.Element */
+    this.titleEl = dh.append(this.el.dom, {tag: 'div', unselectable: 'on', cls: 'yunselectable ylayout-panel-hd ylayout-title-'+this.position, children:[
+        {tag: 'span', cls: 'yunselectable ylayout-panel-hd-text', unselectable: 'on', html: '&#160;'},
+        {tag: 'div', cls: 'yunselectable ylayout-panel-hd-tools', unselectable: 'on'}
+    ]}, true);
+    this.titleEl.enableDisplayMode();
+    /** This regions title text element @type HTMLElement */
+    this.titleTextEl = this.titleEl.dom.firstChild;
+    this.tools = getEl(this.titleEl.dom.childNodes[1], true);
+    this.closeBtn = this.createTool(this.tools.dom, 'ylayout-close');
+    this.closeBtn.enableDisplayMode();
+    this.closeBtn.on('click', this.closeClicked, this, true);
+    this.closeBtn.hide();
+    /** This regions body element @type YAHOO.ext.Element */
+    this.bodyEl = dh.append(this.el.dom, {tag: 'div', cls: 'ylayout-panel-body'}, true);
+    this.visible = false;
+    this.collapsed = false;
+    this.hide();
+    this.on('paneladded', this.validateVisibility, this, true);
+    this.on('panelremoved', this.validateVisibility, this, true);
+    
+    this.applyConfig(config);
+};
+
+YAHOO.extendX(YAHOO.ext.LayoutRegion, YAHOO.ext.BasicLayoutRegion, {
+    applyConfig : function(config){
+        if(config.collapsible && this.position != 'center' && !this.collapsedEl){
+            var dh = YAHOO.ext.DomHelper;
+            this.collapseBtn = this.createTool(this.tools.dom, 'ylayout-collapse-'+this.position);
+            this.collapseBtn.mon('click', this.collapse, this, true);
+            /** This regions collapsed element @type YAHOO.ext.Element */
+            this.collapsedEl = dh.append(this.mgr.el.dom, {tag: 'div', cls: 'ylayout-collapsed ylayout-collapsed-'+this.position, children:[
+                {tag: 'div', cls: 'ylayout-collapsed-tools'}
+            ]}, true);
+            if(config.floatable !== false){
+               this.collapsedEl.addClassOnOver('ylayout-collapsed-over');
+               this.collapsedEl.mon('click', this.collapseClick, this, true);
+            }
+            this.expandBtn = this.createTool(this.collapsedEl.dom.firstChild, 'ylayout-expand-'+this.position);
+            this.expandBtn.mon('click', this.expand, this, true);
+        }
+        if(this.collapseBtn){
+            this.collapseBtn.setVisible(config.collapsible == true);
+        }
+        this.cmargins = config.cmargins || this.cmargins || 
+                         (this.position == 'west' || this.position == 'east' ? 
+                             {top: 0, left: 2, right:2, bottom: 0} : 
+                             {top: 2, left: 0, right:0, bottom: 2});
+        this.margins = config.margins || this.margins || {top: 0, left: 0, right:0, bottom: 0};
+        this.bottomTabs = config.tabPosition != 'top';
+        this.autoScroll = config.autoScroll || false;
+        if(this.autoScroll){
+            this.bodyEl.setStyle('overflow', 'auto');
+        }else{
+            this.bodyEl.setStyle('overflow', 'hidden');
+        }
+        if((!config.titlebar && !config.title) || config.titlebar === false){
+            this.titleEl.hide();
+        }else{
+            this.titleEl.show();
+            if(config.title){
+                this.titleTextEl.innerHTML = config.title;
+            }
+        }
+        this.duration = config.duration || .30;
+        this.slideDuration = config.slideDuration || .45;
+        this.config = config;
+        if(config.collapsed){
+            this.collapse(true);
+        }
+    },
+    /**
+     * Returns true if this region is currently visible.
+     * @return {Boolean}
+     */
+    isVisible : function(){
+        return this.visible;
+    },
+    
+    getBox : function(){
+        var b;
+        if(!this.collapsed){
+            b = this.el.getBox(false, true);
+        }else{
+            b = this.collapsedEl.getBox(false, true);
+        }
+        return b;
+    },
+    
+    getMargins : function(){
+        return this.collapsed ? this.cmargins : this.margins;
+    },
+    
+    highlight : function(){
+        this.el.addClass('ylayout-panel-dragover'); 
+    },
+    
+    unhighlight : function(){
+        this.el.removeClass('ylayout-panel-dragover'); 
+    },
+    
+    updateBox : function(box){
+        this.box = box;
+        if(!this.collapsed){
+            this.el.dom.style.left = box.x + 'px';
+            this.el.dom.style.top = box.y + 'px';
+            this.el.setSize(box.width, box.height);
+            var bodyHeight = this.titleEl.isVisible() ? box.height - (this.titleEl.getHeight()||0) : box.height;
+            bodyHeight -= this.el.getBorderWidth('tb');
+            bodyWidth = box.width - this.el.getBorderWidth('rl');
+            this.bodyEl.setHeight(bodyHeight);
+            this.bodyEl.setWidth(bodyWidth);
+            var tabHeight = bodyHeight;
+            if(this.tabs){
+                tabHeight = this.tabs.syncHeight(bodyHeight);
+                if(YAHOO.ext.util.Browser.isIE) this.tabs.el.repaint();
+            }
+            this.panelSize = {width: bodyWidth, height: tabHeight};
+            if(this.activePanel){
+                this.activePanel.setSize(bodyWidth, tabHeight);
+            }
+        }else{
+            this.collapsedEl.dom.style.left = box.x + 'px';
+            this.collapsedEl.dom.style.top = box.y + 'px';
+            this.collapsedEl.setSize(box.width, box.height);
+        }
+        if(this.tabs){
+            this.tabs.autoSizeTabs();
+        }
+    },
+    
+    /**
+     * Returns the container element for this region.
+     * @return {YAHOO.ext.Element}
+     */
+    getEl : function(){
+        return this.el;
+    },
+    
+    /**
+     * Hides this region.
+     */
+    hide : function(){
+        if(!this.collapsed){
+            this.el.dom.style.left = '-2000px';
+            this.el.hide();
+        }else{
+            this.collapsedEl.dom.style.left = '-2000px';
+            this.collapsedEl.hide();
+        }
+        this.visible = false;
+        this.fireEvent('visibilitychange', this, false);
+    },
+    
+    /**
+     * Shows this region if it was previously hidden.
+     */
+    show : function(){
+        if(!this.collapsed){
+            this.el.show();
+        }else{
+            this.collapsedEl.show();
+        }
+        this.visible = true;
+        this.fireEvent('visibilitychange', this, true);
+    },
+    
+    closeClicked : function(){
+        if(this.activePanel){
+            this.remove(this.activePanel);
+        }
+    },
+    
+    collapseClick : function(e){
+       if(this.isSlid){
+           e.stopPropagation();
+           this.slideIn();
+       }else{
+           e.stopPropagation();
+           this.slideOut();
+       }   
+    },
+    
+    /**
+     * Collapses this region.
+     * @param {Boolean} skipAnim (optional) true to collapse the element without animation (if animate is true)
+     */
+    collapse : function(skipAnim){
+        if(this.collapsed) return;
+        this.collapsed = true;
+        if(this.split){
+            this.split.el.hide();
+        }
+        if(this.config.animate && skipAnim !== true){
+            this.fireEvent('invalidated', this);    
+            this.animateCollapse();
+        }else{
+            this.el.setLocation(-20000,-20000);
+            this.el.hide();
+            this.collapsedEl.show();
+            this.fireEvent('collapsed', this);
+            this.fireEvent('invalidated', this); 
+        }
+    },
+    
+    animateCollapse : function(){
+        // overridden
+    },
+    
+    /**
+     * Expand this region if it was previously collapsed.
+     * @param {YAHOO.ext.EventObject} e The event that triggered the expand (or null if calling manually)
+     * @param {Boolean} skipAnim (optional) true to expand the element without animation (if animate is true)
+     */
+    expand : function(e, skipAnim){
+        if(e) e.stopPropagation();
+        if(!this.collapsed) return;
+        if(this.isSlid){
+            this.slideIn(this.expand.createDelegate(this));
+            return;
+        }
+        this.collapsed = false;
+        this.el.show();
+        if(this.config.animate && skipAnim !== true){
+            this.animateExpand();
+        }else{
+            if(this.split){
+                this.split.el.show();
+            }
+            this.collapsedEl.setLocation(-2000,-2000);
+            this.collapsedEl.hide();
+            this.fireEvent('invalidated', this);
+            this.fireEvent('expanded', this);
+        }
+    },
+    
+    animateExpand : function(){
+        // overridden
+    },
+    
+    initTabs : function(){
+        this.bodyEl.setStyle('overflow', 'hidden');
+        var ts = new YAHOO.ext.TabPanel(this.bodyEl.dom, this.bottomTabs);
+        if(this.config.hideTabs){
+            ts.stripWrap.setDisplayed(false);
+        }
+        this.tabs = ts;
+        ts.resizeTabs = this.config.resizeTabs === true;
+        ts.minTabWidth = this.config.minTabWidth || 40;
+        ts.maxTabWidth = this.config.maxTabWidth || 250;
+        ts.preferredTabWidth = this.config.preferredTabWidth || 150;
+        ts.monitorResize = false;
+        ts.bodyEl.setStyle('overflow', this.config.autoScroll ? 'auto' : 'hidden');
+        this.panels.each(this.initPanelAsTab, this);
+    },
+    
+    initPanelAsTab : function(panel){
+        var ti = this.tabs.addTab(panel.getEl().id, panel.getTitle(), null, 
+                    this.config.closeOnTab && panel.isClosable());
+        ti.on('activate', function(){ 
+              this.setActivePanel(panel); 
+        }, this, true);
+        if(this.config.closeOnTab){
+            ti.on('beforeclose', function(t, e){
+                e.cancel = true;
+                this.remove(panel);
+            }, this, true);
+        }
+        return ti;
+    },
+    
+    updatePanelTitle : function(panel, title){
+        if(this.activePanel == panel){
+            this.updateTitle(title);
+        }
+        if(this.tabs){
+            this.tabs.getTab(panel.getEl().id).setText(title);
+        }
+    },
+    
+    updateTitle : function(title){
+        if(this.titleTextEl && !this.config.title){
+            this.titleTextEl.innerHTML = (typeof title != 'undefined' && title.length > 0 ? title : "&#160;");
+        }
+    },
+    
+    setActivePanel : function(panel){
+        panel = this.getPanel(panel);
+        if(this.activePanel && this.activePanel != panel){
+            this.activePanel.setActiveState(false);
+        }
+        this.activePanel = panel;
+        panel.setActiveState(true);
+        if(this.panelSize){
+            panel.setSize(this.panelSize.width, this.panelSize.height);
+        }
+        this.closeBtn.setVisible(!this.config.closeOnTab && !this.isSlid && panel.isClosable());
+        this.updateTitle(panel.getTitle());
+        this.fireEvent('panelactivated', this, panel);
+    },
+    
+    /**
+     * Show the specified panel.
+     * @param {Number/String/ContentPanel} panelId The panels index, id or the panel itself
+     * @return {YAHOO.ext.ContentPanel} The shown panel or null
+     */
+    showPanel : function(panel){
+        if(panel = this.getPanel(panel)){
+            if(this.tabs){
+                this.tabs.activate(panel.getEl().id);
+            }else{
+                this.setActivePanel(panel);
+            }
+        }
+        return panel;
+    },
+    
+    /**
+     * Get the active panel for this region.
+     * @return {YAHOO.ext.ContentPanel} The active panel or null
+     */
+    getActivePanel : function(){
+        return this.activePanel;
+    },
+    
+    validateVisibility : function(){
+        if(this.panels.getCount() < 1){
+            this.updateTitle('&#160;');
+            this.closeBtn.hide();
+            this.hide();
+        }else{
+            if(!this.isVisible()){
+                this.show();
+            }
+        }
+    },
+    
+    /**
+     * Add the passed ContentPanel(s)
+     * @param {ContentPanel...} panel The ContentPanel(s) to add (you can pass more than one)
+     * @return {YAHOO.ext.ContentPanel} The panel added (if only one was added)
+     */
+    add : function(panel){
+        if(arguments.length > 1){
+            for(var i = 0, len = arguments.length; i < len; i++) {
+            	this.add(arguments[i]);
+            }
+            return null;
+        }
+        if(this.hasPanel(panel)){
+            this.showPanel(panel);
+            return panel;
+        }
+        panel.setRegion(this);
+        this.panels.add(panel);
+        if(this.panels.getCount() == 1 && !this.config.alwaysShowTabs){
+            this.bodyEl.dom.appendChild(panel.getEl().dom);
+            if(panel.background !== true){
+                this.setActivePanel(panel);
+            }
+            this.fireEvent('paneladded', this, panel);
+            return panel;
+        }
+        if(!this.tabs){
+            this.initTabs();
+        }else{
+            this.initPanelAsTab(panel);
+        }
+        if(panel.background !== true){
+            this.tabs.activate(panel.getEl().id);
+        }
+        this.fireEvent('paneladded', this, panel);
+        return panel;
+    },
+    
+    /**
+     * Hides the tab for the specified panel.
+     * @param {Number/String/ContentPanel} panel The panels index, id or the panel itself
+     */
+    hidePanel : function(panel){
+        if(this.tabs && (panel = this.getPanel(panel))){
+            this.tabs.hideTab(panel.getEl().id);
+        }
+    },
+    
+    /**
+     * Unhides the tab for a previously hidden panel.
+     * @param {Number/String/ContentPanel} panel The panels index, id or the panel itself
+     */
+    unhidePanel : function(panel){
+        if(this.tabs && (panel = this.getPanel(panel))){
+            this.tabs.unhideTab(panel.getEl().id);
+        }
+    },
+    
+    clearPanels : function(){
+        while(this.panels.getCount() > 0){
+             this.remove(this.panels.first());
+        }
+    },
+    
+    /**
+     * Removes the specified panel. If preservePanel is not true (either here or in the config), the panel is destroyed.
+     * @param {Number/String/ContentPanel} panel The panels index, id or the panel itself
+     * @param {Boolean} preservePanel Overrides the config preservePanel option
+     * @return {YAHOO.ext.ContentPanel} The panel that was removed
+     */
+    remove : function(panel, preservePanel){
+        panel = this.getPanel(panel);
+        if(!panel){
+            return null;
+        }
+        var e = {};
+        this.fireEvent('beforeremove', this, panel, e);
+        if(e.cancel === true){
+            return null;
+        }
+        preservePanel = (typeof preservePanel != 'undefined' ? preservePanel : (this.config.preservePanels === true || panel.preserve === true));
+        var panelId = panel.getId();
+        this.panels.removeKey(panelId);
+        if(preservePanel){
+            document.body.appendChild(panel.getEl().dom);
+        }
+        if(this.tabs){
+            this.tabs.removeTab(panel.getEl().id);
+        }else if (!preservePanel){
+            this.bodyEl.dom.removeChild(panel.getEl().dom);
+        }
+        if(this.panels.getCount() == 1 && this.tabs && !this.config.alwaysShowTabs){
+            var p = this.panels.first();
+            var tempEl = document.createElement('span'); // temp holder to keep IE from deleting the node
+            tempEl.appendChild(p.getEl().dom);
+            this.bodyEl.update('');
+            this.bodyEl.dom.appendChild(p.getEl().dom);
+            tempEl = null;
+            this.updateTitle(p.getTitle());
+            this.tabs = null;
+            this.bodyEl.setStyle('overflow', this.config.autoScroll ? 'auto' : 'hidden');
+            this.setActivePanel(p);
+        }
+        panel.setRegion(null);
+        if(this.activePanel == panel){
+            this.activePanel = null;
+        }
+        if(this.config.autoDestroy !== false && preservePanel !== true){
+            try{panel.destroy();}catch(e){}
+        }
+        this.fireEvent('panelremoved', this, panel);
+        return panel;
+    },
+    
+    /**
+     * Returns the TabPanel component used by this region
+     * @return {YAHOO.ext.TabPanel}
+     */
+    getTabs : function(){
+        return this.tabs;    
+    },
+    
+    createTool : function(parentEl, className){
+        var btn = YAHOO.ext.DomHelper.append(parentEl, {tag: 'div', cls: 'ylayout-tools-button', 
+            children: [{tag: 'div', cls: 'ylayout-tools-button-inner ' + className, html: '&#160;'}]}, true);
+        btn.addClassOnOver('ylayout-tools-button-over');
+        return btn;
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/layout/LayoutStateManager.js b/frontend/beta/js/YUI-extensions/layout/LayoutStateManager.js
new file mode 100644
index 0000000..ea22235
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/layout/LayoutStateManager.js
@@ -0,0 +1,68 @@
+/*
+ * Private internal class for reading and applying state
+ */
+YAHOO.ext.LayoutStateManager = function(layout){
+     // default empty state
+     this.state = {
+        north: {},
+        south: {},
+        east: {},
+        west: {}       
+    };
+};
+
+YAHOO.ext.LayoutStateManager.prototype = {
+    init : function(layout, provider){
+        this.provider = provider;
+        var state = provider.get(layout.id+'-layout-state');
+        if(state){
+            var wasUpdating = layout.isUpdating();
+            if(!wasUpdating){
+                layout.beginUpdate();
+            }
+            for(var key in state){
+                if(typeof state[key] != 'function'){
+                    var rstate = state[key];
+                    var r = layout.getRegion(key);
+                    if(r && rstate){
+                        if(rstate.size){
+                            r.resizeTo(rstate.size);
+                        }
+                        if(rstate.collapsed == true){
+                            r.collapse(true);
+                        }else{
+                            r.expand(null, true);
+                        }
+                    }
+                }
+            }
+            if(!wasUpdating){
+                layout.endUpdate();
+            }
+            this.state = state; 
+        }
+        this.layout = layout;
+        layout.on('regionresized', this.onRegionResized, this, true);
+        layout.on('regioncollapsed', this.onRegionCollapsed, this, true);
+        layout.on('regionexpanded', this.onRegionExpanded, this, true);
+    },
+    
+    storeState : function(){
+        this.provider.set(this.layout.id+'-layout-state', this.state);
+    },
+    
+    onRegionResized : function(region, newSize){
+        this.state[region.getPosition()].size = newSize;
+        this.storeState();
+    },
+    
+    onRegionCollapsed : function(region){
+        this.state[region.getPosition()].collapsed = true;
+        this.storeState();
+    },
+    
+    onRegionExpanded : function(region){
+        this.state[region.getPosition()].collapsed = false;
+        this.storeState();
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/layout/SplitLayoutRegion.js b/frontend/beta/js/YUI-extensions/layout/SplitLayoutRegion.js
new file mode 100644
index 0000000..6b8ce9e
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/layout/SplitLayoutRegion.js
@@ -0,0 +1,282 @@
+/**
+ * @class YAHOO.ext.SplitLayoutRegion
+ * @extends YAHOO.ext.LayoutRegion
+ * Adds a splitbar and other (private) useful functionality to a LayoutRegion
+ */
+YAHOO.ext.SplitLayoutRegion = function(mgr, config, pos, cursor){
+    this.cursor = cursor;
+    YAHOO.ext.SplitLayoutRegion.superclass.constructor.call(this, mgr, config, pos);
+    if(config.split){
+        this.hide();
+    }
+};
+
+YAHOO.extendX(YAHOO.ext.SplitLayoutRegion, YAHOO.ext.LayoutRegion, {
+    applyConfig : function(config){
+        YAHOO.ext.SplitLayoutRegion.superclass.applyConfig.call(this, config);
+        if(config.split){
+            if(!this.split){
+                var splitEl = YAHOO.ext.DomHelper.append(this.mgr.el.dom, 
+                        {tag: 'div', id: this.el.id + '-split', cls: 'ylayout-split ylayout-split-'+this.position, html: '&#160;'});
+                /** The SplitBar for this region @type YAHOO.ext.SplitBar */
+                this.split = new YAHOO.ext.SplitBar(splitEl, this.el);
+                this.split.onMoved.subscribe(this.onSplitMove, this, true);
+                this.split.useShim = config.useShim === true;
+                YAHOO.util.Dom.setStyle([this.split.el.dom, this.split.proxy], 'cursor', this.cursor);
+                this.split.getMaximumSize = this.getMaxSize.createDelegate(this);
+            }
+            if(typeof config.minSize != 'undefined'){
+                this.split.minSize = config.minSize;
+            }
+            if(typeof config.maxSize != 'undefined'){
+                this.split.maxSize = config.maxSize;
+            }
+        }
+    },
+    
+    getMaxSize : function(){
+         var cmax = this.config.maxSize || 10000;
+         var center = this.mgr.getRegion('center');
+         return Math.min(cmax, (this.el.getWidth()+center.getEl().getWidth())-center.getMinWidth());
+    },
+    
+    onSplitMove : function(split, newSize){
+        this.fireEvent('resized', this, newSize);
+    },
+    
+    /** 
+     * Returns the SplitBar for this region.
+     * @return {YAHOO.ext.SplitBar}
+     */
+    getSplitBar : function(){
+        return this.split;
+    },
+    
+    hide : function(){
+        if(this.split){
+            this.split.el.setLocation(-2000,-2000);
+            this.split.el.hide();
+        }
+        YAHOO.ext.SplitLayoutRegion.superclass.hide.call(this);
+    },
+    
+    show : function(){
+        if(this.split){
+            this.split.el.show();
+        }
+        YAHOO.ext.SplitLayoutRegion.superclass.show.call(this);
+    },
+    
+    beforeSlide: function(){
+        if(YAHOO.ext.util.Browser.isGecko){// firefox overflow auto bug workaround
+            this.bodyEl.clip();
+            if(this.tabs) this.tabs.bodyEl.clip();
+            if(this.activePanel){
+                this.activePanel.getEl().clip();
+                
+                if(this.activePanel.beforeSlide){
+                    this.activePanel.beforeSlide();
+                }
+            }
+        }
+    },
+    
+    afterSlide : function(){
+        if(YAHOO.ext.util.Browser.isGecko){// firefox overflow auto bug workaround
+            this.bodyEl.unclip();
+            if(this.tabs) this.tabs.bodyEl.unclip();
+            if(this.activePanel){
+                this.activePanel.getEl().unclip();
+                if(this.activePanel.afterSlide){
+                    this.activePanel.afterSlide();
+                }
+            }
+        }
+    },
+    
+    slideOut : function(){
+        if(!this.slideEl){
+            this.slideEl = new YAHOO.ext.Actor(
+                YAHOO.ext.DomHelper.append(this.mgr.el.dom, {tag: 'div', cls:'ylayout-slider'}));
+            if(this.config.autoHide !== false){
+                var slideInTask = new YAHOO.ext.util.DelayedTask(this.slideIn, this);
+                this.slideEl.mon('mouseout', function(e){
+                    var to = e.getRelatedTarget();
+                    if(to && to != this.slideEl.dom && !YAHOO.util.Dom.isAncestor(this.slideEl.dom, to)){
+                        slideInTask.delay(500);
+                    }
+                }, this, true);
+                this.slideEl.mon('mouseover', function(e){
+                    slideInTask.cancel();
+                }, this, true);
+            }
+        }
+        var sl = this.slideEl, c = this.collapsedEl, cm = this.cmargins;
+        this.isSlid = true;
+        this.snapshot = {
+            'left': this.el.getLeft(true),
+            'top': this.el.getTop(true),
+            'colbtn': this.collapseBtn.isVisible(),
+            'closebtn': this.closeBtn.isVisible()
+        };
+        this.collapseBtn.hide();
+        this.closeBtn.hide();
+        this.el.show();
+        this.el.setLeftTop(0,0);
+        sl.startCapture(true);
+        var size;
+        switch(this.position){
+            case 'west':
+                sl.setLeft(c.getRight(true));
+                sl.setTop(c.getTop(true));
+                size = this.el.getWidth();
+            break;
+            case 'east':
+                sl.setRight(this.mgr.getViewSize().width-c.getLeft(true));
+                sl.setTop(c.getTop(true));
+                size = this.el.getWidth();
+            break;
+            case 'north':
+                sl.setLeft(c.getLeft(true));
+                sl.setTop(c.getBottom(true));
+                size = this.el.getHeight();
+            break;
+            case 'south':
+                sl.setLeft(c.getLeft(true));
+                sl.setBottom(this.mgr.getViewSize().height-c.getTop(true));
+                size = this.el.getHeight();
+            break;
+        }
+        sl.dom.appendChild(this.el.dom);
+        YAHOO.util.Event.on(document.body, 'click', this.slideInIf, this, true);
+        sl.setSize(this.el.getWidth(), this.el.getHeight());
+        this.beforeSlide();
+        if(this.activePanel){
+            this.activePanel.setSize(this.bodyEl.getWidth(), this.bodyEl.getHeight());
+        }
+        sl.slideShow(this.getAnchor(), size, this.slideDuration, null, false);
+        sl.play(function(){
+            this.afterSlide();
+        }.createDelegate(this));
+    },
+    
+    slideInIf : function(e){
+        var t = YAHOO.util.Event.getTarget(e);
+        if(!YAHOO.util.Dom.isAncestor(this.el.dom, t)){
+            this.slideIn();
+        }
+    },
+    
+    slideIn : function(callback){
+        if(this.isSlid && !this.slideEl.playlist.isPlaying()){
+            YAHOO.util.Event.removeListener(document.body, 'click', this.slideInIf, this, true);
+            this.slideEl.startCapture(true);
+            this.slideEl.slideHide(this.getAnchor(), this.slideDuration, null);
+            this.beforeSlide();
+            this.slideEl.play(function(){
+                this.isSlid = false;
+                this.el.setPositioning(this.snapshot);
+                this.collapseBtn.setVisible(this.snapshot.colbtn);
+                this.closeBtn.setVisible(this.snapshot.closebtn);
+                this.afterSlide();
+                this.mgr.el.dom.appendChild(this.el.dom);
+                if(typeof callback == 'function'){
+                    callback();
+                }
+            }.createDelegate(this));
+        }
+    },
+    
+    animateExpand : function(){
+        var em = this.margins, cm = this.cmargins;
+        var c = this.collapsedEl, el = this.el;
+        var direction, distance;
+        switch(this.position){
+            case 'west':
+                direction = 'right';
+                el.setLeft(-(el.getWidth() + (em.right+em.left)));
+                el.setTop(c.getTop(true)-cm.top+em.top);
+                distance = el.getWidth() + (em.right+em.left);
+            break;
+            case 'east':
+                direction = 'left';
+                el.setLeft(this.mgr.getViewSize().width + em.left);
+                el.setTop(c.getTop(true)-cm.top+em.top);
+                distance = el.getWidth() + (em.right+em.left);
+            break;
+            case 'north':
+                direction = 'down';
+                el.setLeft(em.left);
+                el.setTop(-(el.getHeight() + (em.top+em.bottom)));
+                distance = el.getHeight() + (em.top+em.bottom);
+            break;
+            case 'south':
+                direction = 'up';
+                el.setLeft(em.left);
+                el.setTop(this.mgr.getViewSize().height + em.top);
+                distance = el.getHeight() + (em.top+em.bottom);
+            break;
+        }
+        this.beforeSlide();
+        el.setStyle('z-index', '100');
+        el.show();
+        c.setLocation(-2000,-2000);
+        c.hide();
+        el.move(direction, distance, true, this.duration, function(){
+            this.afterSlide();
+            el.setStyle('z-index', '');
+            if(this.split){
+                this.split.el.show();
+            }
+            this.fireEvent('invalidated', this);
+            this.fireEvent('expanded', this);
+        }.createDelegate(this), this.config.easing || YAHOO.util.Easing.easeOut);
+    },
+    
+    animateCollapse : function(){
+        var em = this.margins, cm = this.cmargins;
+        var c = this.collapsedEl, el = this.el;
+        var direction, distance;
+        switch(this.position){
+            case 'west':
+                direction = 'left';
+                distance = el.getWidth() + (em.right+em.left);
+            break;
+            case 'east':
+                direction = 'right';
+                distance = el.getWidth() + (em.right+em.left);
+            break;
+            case 'north':
+                direction = 'up';
+                distance = el.getHeight() + (em.top+em.bottom);
+            break;
+            case 'south':
+                direction = 'down';
+                distance = el.getHeight() + (em.top+em.bottom);
+            break;
+        }
+        this.el.setStyle('z-index', '100');
+        this.beforeSlide();
+        this.el.move(direction, distance, true, this.duration, function(){
+            this.afterSlide();
+            this.el.setStyle('z-index', '');
+            this.el.setLocation(-20000,-20000);
+            this.el.hide();
+            this.collapsedEl.show();
+            this.fireEvent('collapsed', this); 
+        }.createDelegate(this), YAHOO.util.Easing.easeIn);
+    },
+    
+    getAnchor : function(){
+        switch(this.position){
+            case 'west':
+                return 'left';
+            case 'east':
+                return 'right';
+            case 'north':
+                return 'top';
+            case 'south':
+                return 'bottom';
+        }
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/tree/AsyncTreeNode.js b/frontend/beta/js/YUI-extensions/tree/AsyncTreeNode.js
new file mode 100644
index 0000000..5d48b00
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/tree/AsyncTreeNode.js
@@ -0,0 +1,58 @@
+YAHOO.ext.tree.AsyncTreeNode = function(config){
+    this.loaded = false;
+    this.loading = false;
+    YAHOO.ext.tree.AsyncTreeNode.superclass.constructor.apply(this, arguments);
+    this.events['beforeload'] = true;
+    this.events['load'] = true;
+};
+YAHOO.extendX(YAHOO.ext.tree.AsyncTreeNode, YAHOO.ext.tree.TreeNode, {
+    expand : function(deep, anim, callback){
+        if(this.loading){ // if an async load is already running, waiting til it's done
+            var timer;
+            var f = function(){
+                if(!this.loading){ // done loading
+                    clearInterval(timer);
+                    this.expand(deep, anim, callback);
+                }
+            }.createDelegate(this);
+            timer = setInterval(f, 200);
+        }
+        if(!this.loaded){
+            if(this.fireEvent('beforeload', this) === false){
+                return;
+            }
+            this.loading = true;
+            this.ui.beforeLoad(this);
+            var loader = this.loader || this.attributes.loader || this.getOwnerTree().getLoader();
+            if(loader){
+                loader.load(this, this.loadComplete.createDelegate(this, [deep, anim, callback]));
+                return;
+            }
+        }
+        YAHOO.ext.tree.AsyncTreeNode.superclass.expand.call(this, deep, anim, callback);
+    },
+    
+    isLoading : function(){
+        return this.loading;  
+    },
+    
+    loadComplete : function(deep, anim, callback){
+        this.loading = false;
+        this.loaded = true;
+        this.ui.afterLoad(this);
+        this.fireEvent('load', this);
+        this.expand(deep, anim, callback);
+    },
+    
+    isLoaded : function(){
+        return this.loaded;
+    },
+    
+    hasChildNodes : function(){
+        if(!this.isLeaf() && !this.loaded){
+            return true;
+        }else{
+            return YAHOO.ext.tree.AsyncTreeNode.superclass.hasChildNodes.call(this);
+        }
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/tree/TreeDragZone.js b/frontend/beta/js/YUI-extensions/tree/TreeDragZone.js
new file mode 100644
index 0000000..9b77b3c
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/tree/TreeDragZone.js
@@ -0,0 +1,43 @@
+YAHOO.ext.tree.TreeDragZone = function(tree, config){
+    YAHOO.ext.tree.TreeDragZone.superclass.constructor.call(this, tree.getEl(), config);
+    this.tree = tree;
+};
+
+YAHOO.extendX(YAHOO.ext.tree.TreeDragZone, YAHOO.ext.dd.DragZone, {
+    ddGroup : 'TreeDD',
+    
+    onBeforeDrag : function(data, e){
+        var n = data.node;
+        return n && n.draggable && !n.disabled;
+    },
+    
+    onInitDrag : function(e){
+        var data = this.dragData;
+        this.tree.getSelectionModel().select(data.node);
+        this.proxy.update('');
+        data.node.ui.appendDDGhost(this.proxy.ghost.dom);
+        this.tree.fireEvent('startdrag', this.tree, data.node, e);
+    },
+    
+    getRepairXY : function(e, data){
+        return data.node.ui.getDDRepairXY();
+    },
+    
+    onEndDrag : function(data, e){
+        this.tree.fireEvent('enddrag', this.tree, data.node, e); 
+    },
+    
+    onValidDrop : function(dd, e, id){
+        this.tree.fireEvent('dragdrop', this.tree, this.dragData.node, dd, e);
+        this.hideProxy();
+    },
+    
+    beforeInvalidDrop : function(e, id){
+        if(YAHOO.util.Anim){
+            // this scrolls the original position back into view
+            var sm = this.tree.getSelectionModel();
+            sm.clearSelections();
+            sm.select(this.dragData.node);
+        }
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/tree/TreeDropZone.js b/frontend/beta/js/YUI-extensions/tree/TreeDropZone.js
new file mode 100644
index 0000000..91c24e1
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/tree/TreeDropZone.js
@@ -0,0 +1,228 @@
+YAHOO.ext.tree.TreeDropZone = function(tree, config){
+    this.allowParentInsert = false;
+    this.allowContainerDrop = false;
+    this.appendOnly = false;
+    YAHOO.ext.tree.TreeDropZone.superclass.constructor.call(this, tree.container, config);
+    this.tree = tree;
+    this.lastInsertClass = 'ytree-no-status';
+    this.dragOverData = {};
+};
+
+YAHOO.extendX(YAHOO.ext.tree.TreeDropZone, YAHOO.ext.dd.DropZone, {
+    ddGroup : 'TreeDD',
+    
+    expandDelay : 1000,
+    
+    expandNode : function(node){
+        if(node.hasChildNodes() && !node.isExpanded()){
+            node.expand(false, null, this.triggerCacheRefresh.createDelegate(this));
+        }
+    },
+    
+    queueExpand : function(node){
+        this.expandProcId = this.expandNode.defer(this.expandDelay, this, [node]);
+    },
+    
+    cancelExpand : function(){
+        if(this.expandProcId){
+            clearTimeout(this.expandProcId);
+            this.expandProcId = false;
+        }
+    },
+    
+    isValidDropPoint : function(n, pt, dd, e, data){
+        if(!n || !data){ return false; }
+        var targetNode = n.node;
+        var dropNode = data.node;
+        // default drop rules
+        if(!(targetNode && targetNode.isTarget && pt)){
+            return false;
+        }
+        if(pt == 'append' && targetNode.allowChildren === false){
+            return false;
+        }
+        if((pt == 'above' || pt == 'below') && (targetNode.parentNode && targetNode.parentNode.allowChildren === false)){
+            return false;
+        }
+        if(dropNode && (targetNode == dropNode || dropNode.contains(targetNode))){
+            return false;
+        }
+        // reuse the object
+        var overEvent = this.dragOverData;
+        overEvent.tree = this.tree;
+        overEvent.target = targetNode;
+        overEvent.data = data;
+        overEvent.point = pt;
+        overEvent.source = dd;
+        overEvent.rawEvent = e;
+        overEvent.dropNode = dropNode;
+        overEvent.cancel = false;  
+        var result = this.tree.fireEvent('nodedragover', overEvent);
+        return overEvent.cancel === false && result !== false;
+    },
+    
+    getDropPoint : function(e, n, dd){
+        var tn = n.node;
+        if(tn.isRoot){
+            return tn.allowChildren !== false ? 'ap-pend' : false; // always append for root
+        }
+        var dragEl = n.ddel;
+        var t = YAHOO.util.Dom.getY(dragEl), b = t + dragEl.offsetHeight;
+        var y = YAHOO.util.Event.getPageY(e);
+        var noAppend = tn.allowChildren === false || tn.isLeaf();
+        if(this.appendOnly || tn.parentNode.allowChildren === false){
+            return noAppend ? false : 'append';
+        }
+        var noBelow = false;
+        if(!this.allowParentInsert){
+            noBelow = tn.hasChildNodes() && tn.isExpanded();
+        }
+        var q = (b - t) / (noAppend ? 2 : 3);
+        if(y >= t && y < t + q){
+            return 'above';
+        }else if(!noBelow && (noAppend || y >= b-q && y <= b)){
+            return 'below';
+        }else{
+            return 'append';
+        }
+        return false;
+    },
+    
+    onNodeEnter : function(n, dd, e, data){
+        this.cancelExpand();
+    },
+    
+    onNodeOver : function(n, dd, e, data){
+        var pt = this.getDropPoint(e, n, dd);
+        var node = n.node;
+        
+        // auto node expand check
+        if(!this.expandProcId && pt == 'append' && node.hasChildNodes() && !n.node.isExpanded()){
+            this.queueExpand(node);
+        }else if(pt != 'append'){
+            this.cancelExpand();
+        }
+        
+        // set the insert point style on the target node
+        var returnCls = this.dropNotAllowed;
+        if(this.isValidDropPoint(n, pt, dd, e, data)){
+           if(pt){
+               var el = n.ddel;
+               var cls, returnCls;
+               if(pt == 'above'){
+                   returnCls = n.node.isFirst() ? 'ytree-drop-ok-above' : 'ytree-drop-ok-between';
+                   cls = 'ytree-drag-insert-above';
+               }else if(pt == 'below'){
+                   returnCls = n.node.isLast() ? 'ytree-drop-ok-below' : 'ytree-drop-ok-between';
+                   cls = 'ytree-drag-insert-below';
+               }else{
+                   returnCls = 'ytree-drop-ok-append';
+                   cls = 'ytree-drag-append';
+               }
+               if(this.lastInsertClass != cls){
+                   YAHOO.util.Dom.replaceClass(el, this.lastInsertClass, cls);
+                   this.lastInsertClass = cls;
+               }
+           }
+       }
+       return returnCls;
+    },
+    
+    onNodeOut : function(n, dd, e, data){
+        this.cancelExpand();
+        this.removeDropIndicators(n);
+    },
+    
+    onNodeDrop : function(n, dd, e, data){
+        var point = this.getDropPoint(e, n, dd);
+        var targetNode = n.node;
+        targetNode.ui.startDrop();
+        if(!this.isValidDropPoint(n, point, dd, e, data)){
+            targetNode.ui.endDrop();
+            return false;
+        }
+        // first try to find the drop node
+        var dropNode = data.node || (dd.getTreeNode ? dd.getTreeNode(data, targetNode, point, e) : null);
+        var dropEvent = {
+            tree : this.tree,
+            target: targetNode,
+            data: data,
+            point: point,
+            source: dd,
+            rawEvent: e,
+            dropNode: dropNode,
+            cancel: dropNode ? false : true   
+        };
+        var retval = this.tree.fireEvent('beforenodedrop', dropEvent);
+        if(retval === false || dropEvent.cancel === true || !dropEvent.dropNode){
+            targetNode.ui.endDrop();
+            return false;
+        }
+        if(point == 'append' && !targetNode.isExpanded()){
+            targetNode.expand(false, null, function(){
+                this.completeDrop(dropEvent);
+            }.createDelegate(this));
+        }else{
+            this.completeDrop(dropEvent);
+        }
+        return true;
+    },
+    
+    completeDrop : function(de){
+        var ns = de.dropNode, p = de.point, t = de.target;
+        if(!(ns instanceof Array)){
+            ns = [ns];
+        }
+        var n;
+        for(var i = 0, len = ns.length; i < len; i++){
+            n = ns[i];
+            if(p == 'above'){
+                t.parentNode.insertBefore(n, t);
+            }else if(p == 'below'){
+                t.parentNode.insertBefore(n, t.nextSibling);
+            }else{
+                t.appendChild(n);
+            }
+        }
+        n.select(); // select and highlight the last insert
+        if(this.tree.hlDrop){
+            n.ui.highlight();
+        }
+        t.ui.endDrop();
+        this.tree.fireEvent('nodedrop', de);
+    },
+    
+    afterNodeMoved : function(dd, data, e, targetNode, dropNode){
+        if(this.tree.hlDrop){
+            dropNode.select();
+            dropNode.ui.highlight();
+        }
+        this.tree.fireEvent('nodedrop', this.tree, targetNode, data, dd, e);
+    },
+    
+    getTree : function(){
+        return this.tree;
+    },
+    
+    removeDropIndicators : function(n){
+        if(n && n.ddel){
+            var el = n.ddel;
+            YAHOO.util.Dom.removeClass(el, 'ytree-drag-insert-above');
+            YAHOO.util.Dom.removeClass(el, 'ytree-drag-insert-below');
+            YAHOO.util.Dom.removeClass(el, 'ytree-drag-append');
+            this.lastInsertClass = '_noclass';
+        }
+    },
+    
+    beforeDragDrop : function(target, e, id){
+        this.cancelExpand();
+        return true;
+    },
+    
+    afterRepair : function(data){
+        if(data){
+            data.node.ui.highlight();
+        }
+        this.hideProxy();
+    }    
+});
diff --git a/frontend/beta/js/YUI-extensions/tree/TreeFilter.js b/frontend/beta/js/YUI-extensions/tree/TreeFilter.js
new file mode 100644
index 0000000..9eeb274
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/tree/TreeFilter.js
@@ -0,0 +1,105 @@
+/**
+ * This doesn't update the indent (lines) or expand collapse icons of the nodes
+ */
+YAHOO.ext.tree.TreeFilter = function(tree, config){
+    this.tree = tree;
+    this.filtered = {};
+    YAHOO.ext.util.Config.apply(this, config, {
+        clearBlank:false,
+        reverse:false,
+        autoClear:false,
+        remove:false
+    });
+};
+
+YAHOO.ext.tree.TreeFilter.prototype = {
+     /**
+     * Filter the data by a specific attribute.
+     * @param {String/RegExp} value Either string that the attribute value 
+     * should start with or a RegExp to test against the attribute
+     * @param {String} attr (optional) The attribute passed in your node's attributes collection. Defaults to "text".
+     * @param {TreeNode} startNode (optional) The node to start the filter at.
+     */
+    filter : function(value, attr, startNode){
+        attr = attr || 'text';
+        var f;
+        if(typeof value == 'string'){
+            var vlen = value.length;
+            // auto clear empty filter
+            if(vlen == 0 && this.clearBlank){
+                this.clearFilter();
+                return;
+            }
+            value = value.toLowerCase();
+            f = function(n){
+                return n.attributes[attr].substr(0, vlen).toLowerCase() == value;
+            }
+        }else if(value.exec){ // regex?
+            f = function(n){
+                return value.test(n.attributes[attr]);
+            }
+        }else{
+            throw 'Illegal filter type, must be string or regex';
+        }
+        this.filterBy(f, null, startNode);
+	},
+    
+    /**
+     * Filter by a function. The passed function will be called with each 
+     * node in the tree (or from the startNode). If the function returns true, the node is kept 
+     * otherwise it is filtered. If a node is filtered, it's children are also filtered.
+     * @param {Function} fn The filter function
+     * @param {Object} scope (optional) The scope of the function (defaults to the current node) 
+     */
+    filterBy : function(fn, scope, startNode){
+        startNode = startNode || this.tree.root;
+        if(this.autoClear){
+            this.clearFilter();
+        }
+        var af = this.filtered, rv = this.reverse;
+        var f = function(n){
+            if(n == startNode){
+                return true;
+            }
+            if(af[n.id]){
+                return false;
+            }
+            var m = fn.call(scope || n, n);
+            if(!m || rv){
+                af[n.id] = n;
+                n.ui.hide();
+                return false;
+            }
+            return true;
+        }
+        startNode.cascade(f);
+        if(this.remove){
+           for(var id in af){
+               if(typeof id != 'function'){
+                   var n = af[id];
+                   if(n && n.parentNode){
+                       n.parentNode.removeChild(n);
+                   }
+               }
+           } 
+        }
+    },
+    
+    /**
+     * Clears the current filter. Note: with the "remove" option
+     * set a filter cannot be cleared.
+     */
+    clear : function(){
+        var t = this.tree;
+        var af = this.filtered;
+        for(var id in af){
+            if(typeof id != 'function'){
+                var n = af[id];
+                if(n){
+                    n.ui.show();
+                }
+            }
+        }
+        this.filtered = {}; 
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/tree/TreeLoader.js b/frontend/beta/js/YUI-extensions/tree/TreeLoader.js
new file mode 100644
index 0000000..34989bd
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/tree/TreeLoader.js
@@ -0,0 +1,107 @@
+YAHOO.ext.tree.TreeLoader = function(config){
+    this.baseParams = {};
+    this.requestMethod = 'POST';
+    YAHOO.ext.util.Config.apply(this, config);
+    
+    this.events = {
+        'beforeload' : true,
+        'load' : true,
+        'loadexception' : true  
+    };
+};
+
+YAHOO.extendX(YAHOO.ext.tree.TreeLoader, YAHOO.ext.util.Observable, {
+    load : function(node, callback){
+        if(node.attributes.children){ // preloaded json children
+            var cs = node.attributes.children;
+            for(var i = 0, len = cs.length; i < len; i++){
+                node.appendChild(this.createNode(cs[i]));
+            }
+            if(typeof callback == 'function'){
+                callback();
+            }
+        }else if(this.dataUrl){
+            this.requestData(node, callback);
+        }
+    },
+    
+    getParams: function(node){
+        var buf = [], bp = this.baseParams;
+        for(var key in bp){
+            if(typeof bp[key] != 'function'){
+                buf.push(encodeURIComponent(key), '=', encodeURIComponent(bp[key]), '&');
+            }
+        }
+        buf.push('node=', encodeURIComponent(node.id));
+        return buf.join('');
+    },
+    
+    requestData : function(node, callback){
+        if(this.fireEvent('beforeload', this, node, callback) !== false){
+            var params = this.getParams(node);
+            var cb = {
+                success: this.handleResponse,
+                failure: this.handleFailure,
+                scope: this,
+        		argument: {callback: callback, node: node}
+            };
+            this.transId = YAHOO.util.Connect.asyncRequest(this.requestMethod, this.dataUrl, cb, params);
+        }else{
+            // if the load is cancelled, make sure we notify 
+            // the node that we are done
+            if(typeof callback == 'function'){
+                callback();
+            }
+        }
+    },
+    
+    isLoading : function(){
+        return this.transId ? true : false;  
+    },
+    
+    abort : function(){
+        if(this.isLoading()){
+            YAHOO.util.Connect.abort(this.transId);
+        }
+    },
+    
+    createNode : function(attr){
+        if(this.applyLoader !== false){
+            attr.loader = this;
+        }
+        return(attr.leaf ? 
+                        new YAHOO.ext.tree.TreeNode(attr) : 
+                        new YAHOO.ext.tree.AsyncTreeNode(attr));  
+    },
+    
+    processResponse : function(response, node, callback){
+        var json = response.responseText;
+        try {
+            var o = eval('('+json+')');
+	        for(var i = 0, len = o.length; i < len; i++){
+	            node.appendChild(this.createNode(o[i])); 
+	        }
+	        if(typeof callback == 'function'){
+                callback();
+            }
+        }catch(e){
+            this.handleFailure(response);
+        }
+    },
+    
+    handleResponse : function(response){
+        this.transId = false;
+        var a = response.argument;
+        this.processResponse(response, a.node, a.callback);
+        this.fireEvent('load', this, a.node, response);
+    },
+    
+    handleFailure : function(response){
+        this.transId = false;
+        var a = response.argument;
+        this.fireEvent('loadexception', this, a.node, response);
+        if(typeof a.callback == 'function'){
+            a.callback();
+        }
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/tree/TreeNode.js b/frontend/beta/js/YUI-extensions/tree/TreeNode.js
new file mode 100644
index 0000000..c676481
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/tree/TreeNode.js
@@ -0,0 +1,300 @@
+/**
+ * @class YAHOO.ext.tree.TreeNode
+ * @extends YAHOO.ext.data.Node
+ * @cfg {Boolean} leaf true if this node is a leaf and does not have or cannot have children
+ * @cfg {Boolean} expanded true to start the node expanded
+ * @cfg {Boolean} draggable false to make this node undraggable if DD is on (default to true)
+ * @cfg {Boolean} isTarget false if this node cannot be drop on
+ * @cfg {Boolean} disabled true to start the node disabled
+ * @constructor
+ * @param {Object} attributes The attributes/config for the node 
+ */
+YAHOO.ext.tree.TreeNode = function(attributes){
+    attributes = attributes || {};
+    if(typeof attributes == 'string'){
+        attributes = {text: attributes};
+    }
+    this.el = null;
+    this.childrenRendered = false;
+    this.rendered = false;
+    YAHOO.ext.tree.TreeNode.superclass.constructor.call(this, attributes);
+    this.expanded = attributes.expanded === true;
+    this.isTarget = attributes.isTarget !== false;
+    this.draggable = attributes.draggable !== false && attributes.allowDrag !== false;
+    this.allowChildren = attributes.allowChildren !== false && attributes.allowDrop !== false;
+    this.text = attributes.text;
+    this.disabled = attributes.disabled === true;
+    
+    YAHOO.ext.util.Config.apply(this.events, {
+        'textchange' : true,
+        'beforeexpand' : true,
+        'beforecollapse' : true,
+        'expand' : true,
+        'disabledchange' : true,
+        'collapse' : true,
+        'beforeclick':true,
+        'click':true,
+        'dblclick':true,
+        'contentmenu':true,
+        'beforechildrenrendered':true
+    });
+    
+    var uiClass = this.attributes.uiProvider || YAHOO.ext.tree.TreeNodeUI;
+    this.ui = new uiClass(this);
+};
+YAHOO.extendX(YAHOO.ext.tree.TreeNode, YAHOO.ext.data.Node, {
+    isExpanded : function(){
+        return this.expanded;
+    },
+    
+    getUI : function(){
+        return this.ui;    
+    },
+    
+    setFirstChild : function(node){
+        var of = this.firstChild;
+        YAHOO.ext.tree.TreeNode.superclass.setFirstChild.call(this, node);
+        if(this.childrenRendered && of && node != of){
+            of.renderIndent(true, true);  
+        }
+        if(this.rendered){
+            this.renderIndent(true, true);
+        }
+    },
+    
+    setLastChild : function(node){
+        var ol = this.lastChild;
+        YAHOO.ext.tree.TreeNode.superclass.setLastChild.call(this, node);
+        if(this.childrenRendered && ol && node != ol){
+            ol.renderIndent(true, true);    
+        }
+        if(this.rendered){
+            this.renderIndent(true, true);
+        }
+    },
+    
+    // these methods are overridden to provide lazy rendering support
+    appendChild : function(){
+        var node = YAHOO.ext.tree.TreeNode.superclass.appendChild.apply(this, arguments);
+        if(node && this.childrenRendered){
+            node.render();
+        }
+        this.ui.updateExpandIcon();
+        return node;
+    },
+    
+    removeChild : function(node){
+        this.ownerTree.getSelectionModel().unselect(node);
+        YAHOO.ext.tree.TreeNode.superclass.removeChild.apply(this, arguments);
+        // if it's been rendered remove dom node
+        if(this.childrenRendered){
+            node.ui.remove();
+        }
+        if(this.childNodes.length < 1){
+            this.collapse(false, false);
+        }else{
+            this.ui.updateExpandIcon();
+        }
+        return node;
+    },
+    
+    insertBefore : function(node, refNode){
+        var newNode = YAHOO.ext.tree.TreeNode.superclass.insertBefore.apply(this, arguments);
+        if(newNode && refNode && this.childrenRendered){
+            node.render();
+        }
+        this.ui.updateExpandIcon();
+        return newNode;
+    },
+    
+    setText : function(text){
+        var oldText = this.text;
+        this.text = text;
+        this.attributes.text = text;
+        if(this.rendered){ // event without subscribing
+            this.ui.onTextChange(this, text, oldText);
+        }
+        this.fireEvent('textchange', this, text, oldText);
+    },
+    
+    select : function(){
+        this.getOwnerTree().getSelectionModel().select(this);
+    },
+    
+    unselect : function(){
+        this.getOwnerTree().getSelectionModel().unselect(this);
+    },
+    
+    isSelected : function(){
+        return this.getOwnerTree().getSelectionModel().isSelected(node);  
+    },
+    
+    expand : function(deep, anim, callback){
+        if(!this.expanded){
+            if(this.fireEvent('beforeexpand', this, deep, anim) === false){
+                return;
+            }
+            if(!this.childrenRendered){
+                this.renderChildren();
+            }
+            this.expanded = true;
+            if((this.getOwnerTree().animate && anim !== false) || anim){
+                this.ui.animExpand(function(){
+                    this.fireEvent('expand', this);
+                    if(typeof callback == 'function'){
+                        callback(this);
+                    }
+                    if(deep === true){
+                        this.expandChildNodes(true);
+                    }
+                }.createDelegate(this));
+                return;
+            }else{
+                this.ui.expand();
+                this.fireEvent('expand', this);
+                if(typeof callback == 'function'){
+                    callback(this);
+                }
+            }
+        }else{
+           if(typeof callback == 'function'){
+               callback(this);
+           } 
+        }
+        if(deep === true){
+            this.expandChildNodes(true);
+        }
+    },
+    
+    collapse : function(deep, anim){
+        if(this.expanded && (!this.isRoot || (this.isRoot && this.getOwnerTree().rootVisible))){
+            if(this.fireEvent('beforecollapse', this, deep, anim) === false){
+                return;
+            }
+            this.expanded = false;
+            if((this.getOwnerTree().animate && anim !== false) || anim){
+                this.ui.animCollapse(function(){
+                    this.fireEvent('collapse', this);
+                    if(deep === true){
+                        this.collapseChildNodes(true);
+                    }
+                }.createDelegate(this));
+                return;
+            }else{
+                this.ui.collapse();
+                this.fireEvent('collapse', this);
+            }
+        }
+        if(deep === true){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++) {
+            	cs[i].collapse(true)
+            }
+        }
+    },
+    
+    delayedExpand : function(delay){
+        if(!this.expandProcId){
+            this.expandProcId = this.expand.defer(delay, this);
+        } 
+    },
+    
+    cancelExpand : function(){
+        if(this.expandProcId){
+            clearTimeout(this.expandProcId);
+        }
+        this.expandProcId = false; 
+    },
+    
+    toggle : function(){
+        if(this.expanded){
+            this.collapse();
+        }else{
+            this.expand();
+        }
+    },
+    
+    ensureVisible : function(){
+        if(this.parentNode){
+            this.parentNode.bubble(function(){
+                this.expand(false, false);
+            });
+        }  
+    },
+    
+    expandChildNodes : function(deep){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+        	cs[i].expand(deep);
+        }
+    },
+    
+    collapseChildNodes : function(deep){
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++) {
+        	cs[i].expand(deep);
+        }
+    },
+    
+    disable : function(){
+        this.disabled = true;
+        this.unselect();
+        if(this.rendered && this.ui.onDisableChange){ // event without subscribing
+            this.ui.onDisableChange(this, true);
+        }
+        this.fireEvent('disabledchange', this, true);
+    },
+    
+    enable : function(){
+        this.disabled = false;
+        if(this.rendered && this.ui.onDisableChange){ // event without subscribing
+            this.ui.onDisableChange(this, false);
+        }
+        this.fireEvent('disabledchange', this, false); 
+    },
+    
+    renderChildren : function(suppressEvent){
+        if(suppressEvent !== false){
+            this.fireEvent('beforechildrenrendered', this);
+        }
+        var cs = this.childNodes;
+        for(var i = 0, len = cs.length; i < len; i++){
+            cs[i].render(true);
+        }
+        this.childrenRendered = true;
+    },
+    
+    sort : function(fn, scope){
+        YAHOO.ext.tree.TreeNode.superclass.sort.apply(this, arguments);
+        if(this.childrenRendered){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++){
+                cs[i].render(true);
+            }
+        }  
+    },
+    
+    render : function(bulkRender){
+        this.ui.render(bulkRender);
+        if(!this.rendered){
+            this.rendered = true;
+            if(this.expanded){
+                this.expanded = false;
+                this.expand(false, false);
+            }
+        }
+    },
+    
+    renderIndent : function(deep, refresh){
+        if(refresh){
+            this.ui.childIndent = null;
+        }
+        this.ui.renderIndent();
+        if(deep === true && this.childrenRendered){
+            var cs = this.childNodes;
+            for(var i = 0, len = cs.length; i < len; i++){
+                cs[i].renderIndent(true, refresh);
+            }
+        }
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/tree/TreeNodeUI.js b/frontend/beta/js/YUI-extensions/tree/TreeNodeUI.js
new file mode 100644
index 0000000..80927f4
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/tree/TreeNodeUI.js
@@ -0,0 +1,452 @@
+/**
+ * The TreeNode UI implementation is separate from the 
+ * tree implementation. Unless you are customizing the tree UI,
+ * you should never have to use this directly.
+ */
+YAHOO.ext.tree.TreeNodeUI = function(node){
+    this.node = node;
+    this.rendered = false;
+    this.animating = false;
+};
+
+YAHOO.ext.tree.TreeNodeUI.prototype = {
+    emptyIcon : Ext.BLANK_IMAGE_URL,
+    
+    removeChild : function(node){
+        if(this.rendered){
+            this.ctNode.removeChild(node.ui.getEl());
+        } 
+    },
+    
+    beforeLoad : function(){
+         YAHOO.util.Dom.addClass(this.elNode, 'ytree-node-loading'); 
+    },
+    
+    afterLoad : function(){
+         YAHOO.util.Dom.removeClass(this.elNode, 'ytree-node-loading'); 
+    },
+    
+    onTextChange : function(node, text, oldText){
+        if(this.rendered){
+            this.textNode.innerHTML = text;
+        }
+    },
+    
+    onDisableChange : function(node, state){
+        this.disabled = state;
+        if(state){
+            YAHOO.util.Dom.addClass(this.elNode, 'ytree-node-disabled');
+        }else{
+            YAHOO.util.Dom.removeClass(this.elNode, 'ytree-node-disabled');
+        } 
+    },
+    
+    onSelectedChange : function(state){
+        if(state){
+            this.focus();
+            YAHOO.util.Dom.addClass(this.elNode, 'ytree-selected');
+        }else{
+            this.blur();
+            YAHOO.util.Dom.removeClass(this.elNode, 'ytree-selected');
+        } 
+    },
+    
+    onMove : function(tree, node, oldParent, newParent, index, refNode){
+        this.childIndent = null;
+        if(this.rendered){
+            var targetNode = newParent.ui.getContainer();
+            if(!targetNode){//target not rendered
+                this.holder = document.createElement('div');
+                this.holder.appendChild(this.wrap);
+                return;
+            }
+            var insertBefore = refNode ? refNode.ui.getEl() : null;
+            if(insertBefore){
+                targetNode.insertBefore(this.wrap, insertBefore);
+            }else{
+                targetNode.appendChild(this.wrap);
+            }
+            this.node.renderIndent(true);
+        }
+    },
+    
+    remove : function(){
+        if(this.rendered){
+            this.holder = document.createElement('div');
+            this.holder.appendChild(this.wrap);
+        }  
+    },
+    
+    fireEvent : function(){
+        this.node.fireEvent.apply(this.node, arguments);  
+    },
+    
+    initEvents : function(){
+        this.node.on('move', this.onMove, this, true);
+        //this.node.on('hiddenchange', this.onHiddenChange, this, true);
+        
+        // these were optimized out but a custom UI could use them
+        //this.node.on('remove', this.onChildRemoved, this, true);
+        //this.node.on('selectedstatechange', this.onSelectedChange, this, true);
+        //this.node.on('disabledchange', this.onDisableChange, this, true);
+        //this.node.on('textchange', this.onTextChange, this, true);
+        
+        var E = YAHOO.util.Event;
+        var a = this.anchor;
+        
+        var el = YAHOO.ext.Element.fly(a);
+        
+        if(YAHOO.ext.util.Browser.isOpera){ // opera render bug ignores the CSS
+            el.setStyle('text-decoration', 'none');
+        }
+        
+        el.mon('click', this.onClick, this, true);
+        el.mon('dblclick', this.onDblClick, this, true);
+        el.mon('contextmenu', this.onContextMenu, this, true);
+        
+        //el.on('focus', function(){
+        //    this.node.getOwnerTree().getSelectionModel().select(this.node);
+        //}, this, true);
+        
+        var icon = YAHOO.ext.Element.fly(this.iconNode);
+        icon.mon('click', this.onClick, this, true);
+        icon.mon('dblclick', this.onDblClick, this, true);
+        icon.mon('contextmenu', this.onContextMenu, this, true);
+        E.on(this.ecNode, 'click', this.ecClick, this, true);
+        
+        if(this.node.disabled){
+            YAHOO.util.Dom.addClass(this.elNode, 'ytree-node-disabled');
+        }
+        if(this.node.hidden){
+            YAHOO.util.Dom.addClass(this.elNode, 'ytree-node-disabled');
+        }
+        var dd = this.node.ownerTree.enableDD || this.node.ownerTree.enableDrag || this.node.ownerTree.enableDrop;
+        if(dd && (!this.node.isRoot || this.node.ownerTree.rootVisible)){
+            YAHOO.ext.dd.Registry.register(this.elNode, {
+                node: this.node,
+                handles: [this.iconNode, this.textNode],
+                isHandle: false
+            });
+        }
+    },
+    
+    hide : function(){
+        if(this.rendered){
+            this.wrap.style.display = 'none';
+        }  
+    },
+    
+    show : function(){
+        if(this.rendered){
+            this.wrap.style.display = '';
+        } 
+    },
+    
+    onContextMenu : function(e){
+        e.preventDefault();
+        this.focus();
+        this.fireEvent('contextmenu', this.node, e);
+    },
+    
+    onClick : function(e){
+        if(this.dropping){
+            return;
+        }
+        if(this.fireEvent('beforeclick', this.node, e) !== false){
+            if(!this.disabled && this.node.attributes.href){
+                this.focus();
+                this.fireEvent('click', this.node, e);
+                return;
+            }
+            e.preventDefault();
+            if(this.disabled){
+                return;
+            }
+            this.focus();
+            this.fireEvent('click', this.node, e);
+        }else{
+            e.stopEvent();
+        }
+    },
+    
+    onDblClick : function(e){
+        e.preventDefault();
+        if(this.disabled){
+            return;
+        }
+        if(!this.animating && this.node.hasChildNodes()){
+            this.node.toggle();
+        }
+        this.fireEvent('dblclick', this.node, e);
+    },
+    
+    ecClick : function(e){
+        if(!this.animating && this.node.hasChildNodes()){
+            this.node.toggle();
+        }
+    },
+    
+    startDrop : function(){
+        this.dropping = true;
+    },
+    
+    // delayed drop so the click event doesn't get fired on a drop
+    endDrop : function(){ 
+       setTimeout(function(){
+           this.dropping = false;
+       }.createDelegate(this), 50); 
+    },
+    
+    expand : function(){
+        this.updateExpandIcon();
+        this.ctNode.style.display = '';
+    },
+    
+    focus : function(){
+        try{
+            this.anchor.focus();
+        }catch(e){} 
+    },
+    
+    blur : function(){
+        try{
+            this.anchor.blur();
+        }catch(e){} 
+    },
+    
+    animExpand : function(callback){
+        if(this.animating && this.anim){
+            this.anim.stop();
+        }
+        this.animating = true;
+        this.updateExpandIcon();
+        var ct = this.ctNode;
+        var cs = ct.style;
+        cs.position = 'absolute';
+        cs.visibility = 'hidden';
+        cs.display = '';
+        var h = ct.clientHeight;
+        cs.overflow = 'hidden';
+        cs.height = '1px';
+        cs.position = '';
+        cs.visibility = '';
+        var anim = new YAHOO.util.Anim(ct, {
+            height: {to: h}
+        }, this.node.ownerTree.duration || .25, YAHOO.util.Easing.easeOut);
+        anim.onComplete.subscribe(function(){
+            cs.overflow = '';
+            cs.height = '';
+            this.animating = false;
+            this.anim = null;
+            if(typeof callback == 'function'){
+                callback();
+            }
+        }, this, true);
+        this.anim = anim;
+        anim.animate();
+    },
+    
+    highlight : function(){
+        var tree = this.node.getOwnerTree();
+        var hlColor = tree.hlColor || 'C3DAF9';
+        var hlBaseColor = tree.hlBaseColor || 'FFFFFF';
+        var anim = new YAHOO.util.ColorAnim(this.wrap, {
+            backgroundColor: {from: hlColor, to: hlBaseColor}
+        }, .75, YAHOO.util.Easing.easeNone);
+        anim.onComplete.subscribe(function(){
+            YAHOO.util.Dom.setStyle(this.wrap, 'background-color', '');
+        }, this, true);
+        anim.animate(); 
+    },
+    
+    collapse : function(){
+        this.updateExpandIcon();
+        this.ctNode.style.display = 'none';
+    },
+    
+    animCollapse : function(callback){
+        if(this.animating && this.anim){
+            this.anim.stop();
+        }
+        this.animating = true;
+        this.updateExpandIcon();
+        var ct = this.ctNode;
+        var cs = ct.style;
+        cs.height = ct.offsetHeight +'px';
+        cs.overflow = 'hidden';
+        var anim = new YAHOO.util.Anim(ct, {
+            height: {to: 1}
+        }, this.node.ownerTree.duration || .25, YAHOO.util.Easing.easeOut);
+        anim.onComplete.subscribe(function(){
+            cs.display = 'none';
+            cs.overflow = '';
+            cs.height = '';
+            this.animating = false;
+            this.anim = null;
+            if(typeof callback == 'function'){
+                callback();
+            }
+        }, this, true);
+        this.anim = anim;
+        anim.animate();
+    },
+    
+    getContainer : function(){
+        return this.ctNode;  
+    },
+    
+    getEl : function(){
+        return this.wrap;  
+    },
+    
+    appendDDGhost : function(ghostNode){
+        ghostNode.appendChild(this.elNode.cloneNode(true));
+    },
+    
+    getDDRepairXY : function(){
+        return YAHOO.util.Dom.getXY(this.iconNode);  
+    },
+    
+    onRender : function(){
+        this.render();    
+    },
+    
+    render : function(bulkRender){
+        var n = this.node;
+        var targetNode = n.parentNode ? 
+              n.parentNode.ui.getContainer() : n.ownerTree.container.dom;
+        if(!this.rendered){
+            this.rendered = true;
+            var a = n.attributes;
+        
+            // add some indent caching, this helps performance when rendering a large tree
+            this.indentMarkup = '';
+            if(n.parentNode){
+                this.indentMarkup = n.parentNode.ui.getChildIndent();
+            }
+            
+            var buf = ['<li class="ytree-node"><div class="ytree-node-el ', n.attributes.cls,'">',
+                '<span class="ytree-node-indent">',this.indentMarkup,'</span>',
+                '<img src="', this.emptyIcon, '" class="ytree-ec-icon">',
+                '<img src="', a.icon || this.emptyIcon, '" class="ytree-node-icon',(a.icon ? ' ytree-node-inline-icon' : ''),'" unselectable="on">',
+                '<a href="',a.href ? a.href : '#','" tabIndex="1" ',
+                 a.hrefTarget ? ' target="'+a.hrefTarget+'"' : '','><span unselectable="on">',n.text,'</span></a></div>',
+                '<ul class="ytree-node-ct" style="display:none;"></ul>',
+                '</li>'];
+                
+            if(bulkRender !== true && n.nextSibling && n.nextSibling.ui.getEl()){
+                this.wrap = YAHOO.ext.DomHelper.insertHtml('beforeBegin', 
+                                    n.nextSibling.ui.getEl(), buf.join(''));
+            }else{
+                this.wrap = YAHOO.ext.DomHelper.insertHtml('beforeEnd', targetNode, buf.join(''));
+            }
+            this.elNode = this.wrap.childNodes[0];
+            this.ctNode = this.wrap.childNodes[1];
+            var cs = this.elNode.childNodes;
+            this.indentNode = cs[0];
+            this.ecNode = cs[1];
+            this.iconNode = cs[2];
+            this.anchor = cs[3];
+            this.textNode = cs[3].firstChild;
+            if(a.qtip){
+               if(this.textNode.setAttributeNS){
+                   this.textNode.setAttributeNS('y', 'qtip', a.qtip);
+                   if(a.qtipTitle){
+                       this.textNode.setAttributeNS('y', 'qtitle', a.qtipTitle);
+                   }
+               }else{
+                   this.textNode.setAttribute('y:qtip', a.qtip);
+                   if(a.qtipTitle){
+                       this.textNode.setAttribute('y:qtitle', a.qtipTitle);
+                   }
+               } 
+            }
+            this.initEvents();
+            //this.renderIndent(); cached above now instead call updateExpandIcon
+            this.updateExpandIcon();
+        }else{
+            if(bulkRender === true) {
+                targetNode.appendChild(this.wrap);
+            }
+        }
+    },
+    
+    getAnchor : function(){
+        return this.anchor;
+    },
+    
+    getTextEl : function(){
+        return this.textNode;
+    },
+    
+    getIconEl : function(){
+        return this.iconNode;
+    },
+    
+    updateExpandIcon : function(){
+        if(this.rendered){
+            var n = this.node;
+            var cls = n.isLast() ? "ytree-elbow-end" : "ytree-elbow";
+            var hasChild = n.hasChildNodes();
+            if(hasChild){
+                cls += n.expanded ? '-minus' : '-plus';
+                var c1 = n.expanded ? 'ytree-node-collapsed' : 'ytree-node-expanded';
+                var c2 = n.expanded ? 'ytree-node-expanded' : 'ytree-node-collapsed';
+                YAHOO.util.Dom.removeClass(this.elNode, 'ytree-node-leaf');
+                YAHOO.util.Dom.replaceClass(this.elNode, c1, c2);
+            }else{
+                YAHOO.util.Dom.replaceClass(this.elNode, 'ytree-node-expanded', 'ytree-node-leaf');
+            }
+            this.ecNode.className = 'ytree-ec-icon '+cls;
+        }
+    },
+    
+    getChildIndent : function(){
+        if(!this.childIndent){
+            var buf = [];
+            var p = this.node;
+            while(p){
+                if(!p.isRoot || (p.isRoot && p.ownerTree.rootVisible)){
+                    if(!p.isLast()) {
+                        buf.unshift('<img src="'+this.emptyIcon+'" class="ytree-elbow-line">');
+                    } else {
+                        buf.unshift('<img src="'+this.emptyIcon+'" class="ytree-icon">');
+                    }
+                }
+                p = p.parentNode;
+            }
+            this.childIndent = buf.join('');
+        }
+        return this.childIndent;
+    },
+    
+    renderIndent : function(){
+        if(this.rendered){
+            var indent = '';
+            var p = this.node.parentNode;
+            if(p){
+                indent = p.ui.getChildIndent();
+            }
+            if(this.indentMarkup != indent){ // don't rerender if not required
+                this.indentNode.innerHTML = indent;
+                this.indentMarkup = indent;
+            }
+            this.updateExpandIcon();
+        }
+    }
+};
+
+YAHOO.ext.tree.RootTreeNodeUI = function(){
+    YAHOO.ext.tree.RootTreeNodeUI.superclass.constructor.apply(this, arguments);
+};
+YAHOO.extendX(YAHOO.ext.tree.RootTreeNodeUI, YAHOO.ext.tree.TreeNodeUI);
+YAHOO.ext.tree.RootTreeNodeUI.prototype.render = function(){
+    if(!this.rendered){
+        var targetNode = this.node.ownerTree.container.dom;
+        this.node.expanded = true;
+        targetNode.innerHTML = '<div class="ytree-root-node"></div>';
+        this.wrap = this.ctNode = targetNode.firstChild;
+    }
+};
+YAHOO.ext.tree.RootTreeNodeUI.prototype.collapse = function(){
+};
diff --git a/frontend/beta/js/YUI-extensions/tree/TreePanel.js b/frontend/beta/js/YUI-extensions/tree/TreePanel.js
new file mode 100644
index 0000000..202c0d0
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/tree/TreePanel.js
@@ -0,0 +1,213 @@
+YAHOO.namespace('ext.tree');
+
+YAHOO.ext.tree.TreePanel = function(el, config){
+   YAHOO.ext.tree.TreePanel.superclass.constructor.call(this);
+   this.el = getEl(el);
+   this.id = this.el.id;
+   YAHOO.ext.util.Config.apply(this, config || {}, {
+       rootVisible : true,
+       lines : true,
+       enableDD : false,
+       hlDrop : true/*,
+       hlColor: null,
+       ddGroup : 'TreeDD'
+       hlBaseColor : 'FFFFFF'*/
+       
+   });
+   YAHOO.ext.util.Config.apply(this.events, {
+        'beforeload' : true,
+        'load' : true,
+        'textchange' : true,
+        'beforeexpand' : true,
+        'beforecollapse' : true,
+        'expand' : true,
+        'collapse' : true,
+        'disabledchange' : true,
+        'beforeclick':true,
+        'click':true,
+        'dblclick':true,
+        'contentmenu':true,
+        'beforechildrenrendered':true,
+       /**
+	     * @event startdrag
+	     * Fires when a node starts being dragged 
+	     * @param {YAHOO.ext.tree.TreePanel} this
+	     * @param {YAHOO.ext.tree.TreeNode} node
+	     * @param {event} e The raw browser event
+	     */
+	    'startdrag' : true,
+	    /**
+	     * @event enddrag
+	     * Fires when a drag operation is complete
+	     * @param {YAHOO.ext.tree.TreePanel} this
+	     * @param {YAHOO.ext.tree.TreeNode} node
+	     * @param {event} e The raw browser event
+	     */
+	    'enddrag' : true,
+	    /**
+	     * @event dragdrop
+	     * Fires when a dragged node is dropped on a valid DD target 
+	     * @param {YAHOO.ext.tree.TreePanel} this
+	     * @param {YAHOO.ext.tree.TreeNode} node
+	     * @param {DD} dd The dd it was dropped on
+	     * @param {event} e The raw browser event
+	     */
+	    'dragdrop' : true,
+	    /**
+	     * @event beforenodedrop
+	     * Fires when a DD object is dropped on a node in this tree for preprocessing. This event can cancel.
+	     * @param {Object} dropEvent
+	     */
+	    'beforenodedrop' : true,
+	    /**
+	     * @event nodedrop
+	     * Fires after a DD object is dropped on a node in this tree 
+	     * @param {Object} dropEvent
+	     */
+	    'nodedrop' : true,
+	     /**
+	     * @event nodedragover
+	     * Fires when a tree node is being target
+	     * @param {Object} dragOverEvent
+	     */
+	    'nodedragover' : true
+   });
+   if(this.singleExpand){
+       this.on('beforeexpand', this.restrictExpand, this, true);
+   }
+   // problem with safari and animation
+   // I am investigating
+   if(YAHOO.ext.util.Browser.isSafari){
+       this.animate = false;
+   }     
+};
+YAHOO.extendX(YAHOO.ext.tree.TreePanel, YAHOO.ext.data.Tree, {
+    restrictExpand : function(node){
+        var p = node.parentNode;
+        if(p){
+            if(p.expandedChild && p.expandedChild.parentNode == p){
+                p.expandedChild.collapse();
+            }
+            p.expandedChild = node;
+        }    
+    },
+    
+    setRootNode : function(node){
+        YAHOO.ext.tree.TreePanel.superclass.setRootNode.call(this, node);
+        if(!this.rootVisible){
+            node.ui = new YAHOO.ext.tree.RootTreeNodeUI(node);
+        }
+        return node;
+    },
+    
+    getEl : function(){
+        return this.el;  
+    },
+    
+    getLoader : function(){
+        return this.loader;    
+    },
+    
+    expandAll : function(){
+        this.root.expand(true);
+    },
+    
+    collapseAll : function(){
+        this.root.collapse(true);  
+    },
+    
+    getSelectionModel : function(){
+        if(!this.selModel){
+            this.selModel = new YAHOO.ext.tree.DefaultSelectionModel();
+        }
+        return this.selModel;
+    },
+    
+    expandPath : function(path, attr, callback){
+        attr = attr || 'id';
+        var keys = path.split(this.pathSeparator);
+        var curNode = this.root;
+        if(curNode.attributes[attr] != keys[1]){ // invalid root
+            if(callback){
+                callback(false, null);
+            }
+            return;
+        }
+        var index = 1;
+        var f = function(){
+            if(++index == keys.length){
+                if(callback){
+                    callback(true, curNode);
+                }
+                return;
+            }
+            var c = curNode.findChild(attr, keys[index]);
+            if(!c){
+                if(callback){
+                    callback(false, curNode);
+                }
+                return;
+            }
+            curNode = c;
+            c.expand(false, false, f);
+        }
+        curNode.expand(false, false, f);
+    },
+    
+    selectPath : function(path, attr, callback){
+        attr = attr || 'id';
+        var keys = path.split(this.pathSeparator);
+        var v = keys.pop();
+        if(keys.length > 0){
+            var f = function(success, node){
+                if(success && node){
+                    var n = node.findChild(attr, v);
+                    if(n){
+                        n.select();
+                        if(callback){
+                            callback(true, n);
+                        }
+                    }
+                }else{
+                    if(callback){
+                        callback(false, n);
+                    }
+                }
+            };
+            this.expandPath(keys.join(this.pathSeparator), attr, f);
+        }else{
+            this.root.select();
+            if(callback){
+                callback(true, this.root);
+            }
+        }
+    },
+    
+    render : function(){
+        this.container = this.el.createChild({tag:'ul', 
+               cls:'ytree-root-ct ' + 
+               (this.lines ? 'ytree-lines' : 'ytree-no-lines')});
+        
+        if(this.containerScroll){
+            YAHOO.ext.dd.ScrollManager.register(this.el);    
+        }
+            
+        if((this.enableDD || this.enableDrop) && !this.dropZone){
+           this.dropZone = new YAHOO.ext.tree.TreeDropZone(this, this.dropConfig || {
+               ddGroup: this.ddGroup || 'TreeDD'
+           });
+        }
+        if((this.enableDD || this.enableDrag) && !this.dragZone){
+           this.dragZone = new YAHOO.ext.tree.TreeDragZone(this, this.dragConfig || {
+               ddGroup: this.ddGroup || 'TreeDD',
+               scroll: this.ddScroll
+           });
+        }
+        this.getSelectionModel().init(this);
+        this.root.render();
+        if(!this.rootVisible){
+            this.root.renderChildren();
+        }
+        return this;
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/tree/TreeSelectionModel.js b/frontend/beta/js/YUI-extensions/tree/TreeSelectionModel.js
new file mode 100644
index 0000000..4fed88e
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/tree/TreeSelectionModel.js
@@ -0,0 +1,195 @@
+YAHOO.ext.tree.DefaultSelectionModel = function(){
+   this.selNode = null;
+   
+   this.events = {
+       'selectionchange' : true
+   };
+};
+
+YAHOO.extendX(YAHOO.ext.tree.DefaultSelectionModel, YAHOO.ext.util.Observable, {
+    init : function(tree){
+        this.tree = tree;
+        tree.el.mon('keydown', this.onKeyDown, this, true);
+        tree.on('click', this.onNodeClick, this, true);
+    },
+    
+    onNodeClick : function(node, e){
+        this.select(node);
+    },
+    
+    select : function(node){
+        if(this.selNode && this.selNode != node){
+            this.selNode.ui.onSelectedChange(false);
+        }
+        this.selNode = node;
+        node.ui.onSelectedChange(true);
+        this.fireEvent('selectionchange', this, node);
+        return node;
+    },
+    
+    unselect : function(node){
+        if(this.selNode == node){
+            this.clearSelections();
+        }    
+    },
+    
+    clearSelections : function(){
+        var n = this.selNode;
+        if(n){
+            n.ui.onSelectedChange(false);
+            this.selNode = null;
+            this.fireEvent('selectionchange', this, null);
+        }
+        return n;
+    },
+    
+    getSelectedNode : function(){
+        return this.selNode;    
+    },
+    
+    isSelected : function(node){
+        return this.selNode == node;  
+    },
+    
+    onKeyDown : function(e){
+        var s = this.selNode || this.lastSelNode;
+        // undesirable, but required
+        var sm = this;
+        if(!s){
+            return;
+        }
+        var k = e.getKey();
+        //alert(k)
+        switch(k){
+             case e.DOWN:
+                 e.preventDefault();
+                 if(s.firstChild && s.isExpanded()){
+                     this.select(s.firstChild, e);
+                 }else if(s.nextSibling){
+                     this.select(s.nextSibling, e);
+                 }else if(s.parentNode){
+                     s.parentNode.bubble(function(){
+                         if(this.nextSibling){
+                             sm.select(this.nextSibling, e);
+                             return false;
+                         }
+                     });
+                 }
+             break;
+             case e.UP:
+                 e.preventDefault();
+                 var ps = s.previousSibling;
+                 if(ps){
+                     if(!ps.isExpanded()){
+                         this.select(ps, e);
+                     }else{
+                         var lc = ps.lastChild;
+                         while(lc && lc.isExpanded()){
+                             lc = lc.lastChild; 
+                         }
+                         this.select(lc, e);
+                     }
+                 }else if(s.parentNode && (this.tree.rootVisible || !s.parentNode.isRoot)){
+                     this.select(s.parentNode, e);
+                 }
+             break;
+             case e.RIGHT:
+                 e.preventDefault();
+                 if(s.hasChildNodes()){
+                     if(!s.isExpanded()){
+                         s.expand();
+                     }else if(s.firstChild){
+                         this.select(s.firstChild, e);
+                     }
+                 }
+             break;
+             case e.LEFT:
+                 e.preventDefault();
+                 if(s.hasChildNodes() && s.isExpanded()){
+                     s.collapse();
+                 }else if(s.parentNode && (this.tree.rootVisible || s.parentNode != this.tree.getRootNode())){
+                     this.select(s.parentNode, e);
+                 }
+             break;
+        };
+    }
+});
+
+YAHOO.ext.tree.MultiSelectionModel = function(){
+   this.selNodes = [];
+   this.selMap = {};
+   this.events = {
+       'selectionchange' : true
+   };
+};
+
+YAHOO.extendX(YAHOO.ext.tree.MultiSelectionModel, YAHOO.ext.util.Observable, {
+    init : function(tree){
+        this.tree = tree;
+        tree.el.mon('keydown', this.onKeyDown, this, true);
+        tree.on('click', this.onNodeClick, this, true);
+    },
+    
+    onNodeClick : function(node, e){
+        this.select(node, e, e.ctrlKey);
+    },
+    
+    select : function(node, e, keepExisting){
+        if(keepExisting !== true){
+            this.clearSelections(true);
+        }
+        this.selNodes.push(node);
+        this.selMap[node.id] = node;
+        this.lastSelNode = node;
+        node.ui.onSelectedChange(true);
+        this.fireEvent('selectionchange', this, this.selNodes);
+        return node;
+    },
+    
+    unselect : function(node){
+        if(this.selMap[node.id]){
+            node.ui.onSelectedChange(false);
+            var sn = this.selNodes;
+            var index = -1;
+            if(sn.indexOf){
+                index = sn.indexOf(node);
+            }else{
+                for(var i = 0, len = sn.length; i < len; i++){
+                    if(sn[i] == node){
+                        index = i;
+                        break;
+                    }
+                }
+            }
+            if(index != -1){
+                this.selNodes.splice(index, 1);
+            }
+            delete this.selMap[node.id];
+            this.fireEvent('selectionchange', this, this.selNodes);
+        }
+    },
+    
+    clearSelections : function(suppressEvent){
+        var sn = this.selNodes;
+        if(sn.length > 0){
+            for(var i = 0, len = sn.length; i < len; i++){
+                sn[i].ui.onSelectedChange(false);
+            }
+            this.selNodes = [];
+            this.selMap = {};
+            if(suppressEvent !== true){
+                this.fireEvent('selectionchange', this, this.selNodes);
+            }
+        }
+    },
+    
+    isSelected : function(node){
+        return this.selMap[node.id] ? true : false;  
+    },
+    
+    getSelectedNodes : function(){
+        return this.selNodes;    
+    },
+    
+    onKeyDown : YAHOO.ext.tree.DefaultSelectionModel.prototype.onKeyDown
+});
diff --git a/frontend/beta/js/YUI-extensions/tree/TreeSorter.js b/frontend/beta/js/YUI-extensions/tree/TreeSorter.js
new file mode 100644
index 0000000..9960703
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/tree/TreeSorter.js
@@ -0,0 +1,49 @@
+YAHOO.ext.tree.TreeSorter = function(tree, config){
+    YAHOO.ext.util.Config.apply(this, config);
+    tree.on('beforechildrenrendered', this.doSort, this, true);
+    tree.on('append', this.updateSort, this, true);
+    tree.on('insert', this.updateSort, this, true);
+    
+    var dsc = this.dir && this.dir.toLowerCase() == 'desc';
+    var p = this.property || 'text';
+    var sortType = this.sortType;
+    var fs = this.folderSort;
+    var cs = this.caseSensitive === true;
+    
+    this.sortFn = function(n1, n2){
+        if(fs){
+            if(n1.leaf && !n2.leaf){
+                return 1;
+            }
+            if(!n1.leaf && n2.leaf){
+                return -1;
+            }
+        }
+    	var v1 = sortType ? sortType(n1) : (cs ? n1[p] : n1[p].toUpperCase());
+    	var v2 = sortType ? sortType(n2) : (cs ? n2[p] : n2[p].toUpperCase());
+    	if(v1 < v2){
+			return dsc ? +1 : -1;
+		}else if(v1 > v2){
+			return dsc ? -1 : +1;
+        }else{
+	    	return 0;
+        }
+    };
+};
+
+YAHOO.ext.tree.TreeSorter.prototype = {
+    doSort : function(node){
+        node.sort(this.sortFn);
+    },
+    
+    compareNodes : function(n1, n2){
+        
+        return (n1.text.toUpperCase() > n2.text.toUpperCase() ? 1 : -1);
+    },
+    
+    updateSort : function(tree, node){
+        if(node.childrenRendered){
+            this.doSort.defer(1, this, [node]);
+        }
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/widgets/BasicDialog.js b/frontend/beta/js/YUI-extensions/widgets/BasicDialog.js
new file mode 100644
index 0000000..3912568
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/BasicDialog.js
@@ -0,0 +1,1046 @@
+/**
+ * @class YAHOO.ext.BasicDialog
+ * @extends YAHOO.ext.util.Observable
+ * Lightweight Dialog Class.
+ * 
+ * The code below lists all configuration options along with the default value.
+ * If the default value is what you want you can leave it out:
+ * <pre><code>
+  var dlg = new YAHOO.ext.BasicDialog('element-id', {
+       autoCreate: false, (true to auto create from scratch, or DomHelper Object)
+       title: null, (title to set at config time)
+       width: (css),
+       height: (css),
+       x: 200, //(defaults to center screen if blank)
+       y: 500, //(defaults to center screen if blank)
+       animateTarget: null,// (no animation) This is the id or element to animate from
+       resizable: true,
+       minHeight: 80,
+       minWidth: 200,
+       modal: false,
+       autoScroll: true,
+       closable: true,
+       constraintoviewport: true,
+       draggable: true,
+       autoTabs: false, (if true searches child nodes for elements with class ydlg-tab and converts them to tabs)
+       tabTag: 'div', // the tag name of tab elements
+       proxyDrag: false, (drag a proxy element rather than the dialog itself)
+       fixedcenter: false,
+       shadow: false,
+       buttonAlign: 'right',
+       minButtonWidth: 75,
+       shim: false // true to create an iframe shim to 
+                   // keep selects from showing through
+  });
+  </code></pre>
+ * @constructor
+ * Create a new BasicDialog.
+ * @param {String/HTMLElement/YAHOO.ext.Element} el The id of or container element
+ * @param {Object} config configuration options
+ */
+YAHOO.ext.BasicDialog = function(el, config){
+    this.el = getEl(el);
+    var dh = YAHOO.ext.DomHelper;
+    if(!this.el && config && config.autoCreate){
+        if(typeof config.autoCreate == 'object'){
+            if(!config.autoCreate.id){
+                config.autoCreate.id = el;
+            }
+            this.el = dh.append(document.body,
+                        config.autoCreate, true);
+        }else{
+            this.el = dh.append(document.body,
+                        {tag: 'div', id: el}, true);
+        }
+    }
+    el = this.el;
+    el.setDisplayed(true);
+    el.hide = this.hideAction;
+    this.id = el.id;
+    el.addClass('ydlg');
+        
+    YAHOO.ext.util.Config.apply(this, config);
+    
+    this.proxy = el.createProxy('ydlg-proxy');
+    this.proxy.hide = this.hideAction;
+    this.proxy.setOpacity(.5);
+    this.proxy.hide();
+    
+    if(config.width){
+        el.setWidth(config.width);
+    }
+    if(config.height){
+        el.setHeight(config.height);
+    }
+    this.size = el.getSize();
+    if(typeof config.x != 'undefined' && typeof config.y != 'undefined'){
+        this.xy = [config.x,config.y];
+    }else{
+        this.xy = el.getCenterXY(true);
+    }
+    // find the header, body and footer
+    var cn = el.dom.childNodes;
+    for(var i = 0, len = cn.length; i < len; i++) {
+    	var node = cn[i];
+    	if(node && node.nodeType == 1){
+    	    if(YAHOO.util.Dom.hasClass(node, 'ydlg-hd')){
+    	        this.header = getEl(node, true);
+    	    }else if(YAHOO.util.Dom.hasClass(node, 'ydlg-bd')){
+    	        this.body = getEl(node, true);
+    	    }else if(YAHOO.util.Dom.hasClass(node, 'ydlg-ft')){
+    	        /**
+                 * The footer element
+                 * @type YAHOO.ext.Element
+                 */
+                this.footer = getEl(node, true);
+    	    }
+    	}
+    }
+    
+    if(!this.header){
+        /**
+         * The header element
+         * @type YAHOO.ext.Element
+         */
+        this.header = this.body ? 
+             dh.insertBefore(this.body.dom, {tag: 'div', cls:'ydlg-hd'}, true) :
+             dh.append(el.dom, {tag: 'div', cls:'ydlg-hd'}, true);
+    }
+    if(this.title){
+        this.header.update(this.title);
+    }
+    // this element allows the dialog to be focused for keyboard event
+    this.focusEl = dh.append(el.dom, {tag: 'a', href:'#', cls:'ydlg-focus', tabIndex:'-1'}, true);
+    this.focusEl.swallowEvent('click', true);
+    if(!this.body){
+        /**
+         * The body element
+         * @type YAHOO.ext.Element
+         */
+        this.body = dh.append(el.dom, {tag: 'div', cls:'ydlg-bd'}, true);
+    }
+    // wrap the header for special rendering
+    var hl = dh.insertBefore(this.header.dom, {tag: 'div', cls:'ydlg-hd-left'});
+    var hr = dh.append(hl, {tag: 'div', cls:'ydlg-hd-right'});
+    hr.appendChild(this.header.dom);
+    
+    // wrap the body and footer for special rendering
+    this.bwrap = dh.insertBefore(this.body.dom, {tag: 'div', cls:'ydlg-dlg-body'}, true);
+    this.bwrap.dom.appendChild(this.body.dom);
+    if(this.footer) this.bwrap.dom.appendChild(this.footer.dom);
+    
+    this.bg = this.el.createChild({
+        tag: 'div', cls:'ydlg-bg',
+        html: '<div class="ydlg-bg-left"><div class="ydlg-bg-right"><div class="ydlg-bg-center">&#160;</div></div></div>'
+    });
+    this.centerBg = getEl(this.bg.dom.firstChild.firstChild.firstChild);
+    
+    
+    if(this.autoScroll !== false && !this.autoTabs){
+        this.body.setStyle('overflow', 'auto');
+    }
+    if(this.closable !== false){
+        this.el.addClass('ydlg-closable');
+        this.close = dh.append(el.dom, {tag: 'div', cls:'ydlg-close'}, true);
+        this.close.mon('click', this.closeClick, this, true);
+        this.close.addClassOnOver('ydlg-close-over');
+    }
+    if(this.resizable !== false){
+        this.el.addClass('ydlg-resizable');
+        this.resizer = new YAHOO.ext.Resizable(el, {
+            minWidth: this.minWidth || 80, 
+            minHeight:this.minHeight || 80, 
+            handles: 'all',
+            pinned: true
+        });
+        this.resizer.on('beforeresize', this.beforeResize, this, true);
+        this.resizer.on('resize', this.onResize, this, true);
+    }
+    if(this.draggable !== false){
+        el.addClass('ydlg-draggable');
+        if (!this.proxyDrag) {
+            var dd = new YAHOO.util.DD(el.dom.id, 'WindowDrag');
+        }
+        else {
+            var dd = new YAHOO.util.DDProxy(el.dom.id, 'WindowDrag', {dragElId: this.proxy.id});
+        }
+        dd.setHandleElId(this.header.id);
+        dd.endDrag = this.endMove.createDelegate(this);
+        dd.startDrag = this.startMove.createDelegate(this);
+        dd.onDrag = this.onDrag.createDelegate(this);
+        this.dd = dd;
+    }
+    if(this.modal){
+        this.mask = dh.append(document.body, {tag: 'div', cls:'ydlg-mask'}, true);
+        this.mask.enableDisplayMode('block');
+        this.mask.hide();
+        this.el.addClass('ydlg-modal');
+    }
+    if(this.shadow){
+        this.shadow = el.createProxy({tag: 'div', cls:'ydlg-shadow'});
+        this.shadow.setOpacity(.3);
+        this.shadow.setVisibilityMode(YAHOO.ext.Element.VISIBILITY);
+        this.shadow.setDisplayed('block');
+        this.shadow.hide = this.hideAction;
+        this.shadow.hide();
+    }else{
+        this.shadowOffset = 0;
+    }
+    // adding an iframe shim to FF kills the cursor on the PC, but is needed on the Mac
+    // where it (luckily) does not kill the cursor
+    if(!YAHOO.ext.util.Browser.isGecko || YAHOO.ext.util.Browser.isMac){
+        if(this.shim){
+            this.shim = this.el.createShim();
+            this.shim.hide = this.hideAction;
+            this.shim.hide();
+        }
+    }else{
+        this.shim = false;
+    }
+    if(this.autoTabs){
+        this.initTabs();
+    }
+    this.syncBodyHeight();
+    this.events = {
+        /**
+         * @event keydown
+         * Fires when a key is pressed
+         * @param {YAHOO.ext.BasicDialog} this
+         * @param {YAHOO.ext.EventObject} e
+         */
+        'keydown' : true,
+        /**
+         * @event move
+         * Fires when this dialog is moved by the user.
+         * @param {YAHOO.ext.BasicDialog} this
+         * @param {Number} x The new page X
+         * @param {Number} y The new page Y
+         */
+        'move' : true,
+        /**
+         * @event resize
+         * Fires when this dialog is resized by the user.
+         * @param {YAHOO.ext.BasicDialog} this
+         * @param {Number} width The new width
+         * @param {Number} height The new height
+         */
+        'resize' : true,
+        /**
+         * @event beforehide
+         * Fires before this dialog is hidden.
+         * @param {YAHOO.ext.BasicDialog} this
+         */
+        'beforehide' : true,
+        /**
+         * @event hide
+         * Fires when this dialog is hidden.
+         * @param {YAHOO.ext.BasicDialog} this
+         */
+        'hide' : true,
+        /**
+         * @event beforeshow
+         * Fires before this dialog is shown.
+         * @param {YAHOO.ext.BasicDialog} this
+         */
+        'beforeshow' : true,
+        /**
+         * @event show
+         * Fires when this dialog is shown.
+         * @param {YAHOO.ext.BasicDialog} this
+         */
+        'show' : true
+    };
+    el.mon('keydown', this.onKeyDown, this, true);
+    el.mon("mousedown", this.toFront, this, true);
+
+    YAHOO.ext.EventManager.onWindowResize(this.adjustViewport, this, true);
+    this.el.hide();
+    YAHOO.ext.DialogManager.register(this);
+};
+
+YAHOO.extendX(YAHOO.ext.BasicDialog, YAHOO.ext.util.Observable, {
+    shadowOffset: 3,
+    minHeight: 80,
+    minWidth: 200,
+    minButtonWidth: 75,
+    defaultButton: null,
+    buttonAlign: 'right',
+    /**
+     * Sets the dialog title.
+     * @param {String} text
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    setTitle : function(text){
+        this.header.update(text);
+        return this; 
+    },
+    
+    closeClick : function(){
+        this.hide();  
+    },
+    
+    /**
+     * Reinitializes the tabs component, clearing out old tabs and finding new ones.
+     * @return {YAHOO.ext.TabPanel} tabs The tabs component
+     */
+    initTabs : function(){
+        var tabs = this.getTabs();
+        while(tabs.getTab(0)){
+            tabs.removeTab(0);
+        }
+        var tabEls = YAHOO.util.Dom.getElementsByClassName('ydlg-tab', this.tabTag || 'div', this.el.dom);
+        if(tabEls.length > 0){
+            for(var i = 0, len = tabEls.length; i < len; i++) {
+            	var tabEl = tabEls[i];
+            	tabs.addTab(YAHOO.util.Dom.generateId(tabEl), tabEl.title);
+            	tabEl.title = '';
+            }
+            tabs.activate(0);
+        }
+        return tabs;
+    },
+    
+    beforeResize : function(){
+        this.resizer.minHeight = Math.max(this.minHeight, this.getHeaderFooterHeight(true)+40);
+    },
+    
+    onResize : function(){
+        this.refreshSize();
+        this.syncBodyHeight();
+        this.adjustAssets();
+        this.fireEvent('resize', this, this.size.width, this.size.height);
+    },
+    
+    onKeyDown : function(e){
+        if(this.isVisible()){
+            this.fireEvent('keydown', this, e);
+        }
+    },
+    
+    /**
+     * Resizes the dialog.
+     * @param {Number} width
+     * @param {Number} height
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    resizeTo : function(width, height){
+        this.el.setSize(width, height);
+        this.size = {width: width, height: height};
+        this.syncBodyHeight();
+        if(this.fixedcenter){
+            this.center();
+        }
+        if(this.isVisible()){
+            this.constrainXY();
+            this.adjustAssets();
+        }
+        this.fireEvent('resize', this, width, height);
+        return this;
+    },
+    
+    
+    /**
+     * Resizes the dialog to fit the specified content size.
+     * @param {Number} width
+     * @param {Number} height
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    setContentSize : function(w, h){
+        h += this.getHeaderFooterHeight() + this.body.getMargins('tb');
+        w += this.body.getMargins('lr') + this.bwrap.getMargins('lr') + this.centerBg.getPadding('lr');
+        //if(!this.el.isBorderBox()){
+            h +=  this.body.getPadding('tb') + this.bwrap.getBorderWidth('tb') + this.body.getBorderWidth('tb') + this.el.getBorderWidth('tb');
+            w += this.body.getPadding('lr') + this.bwrap.getBorderWidth('lr') + this.body.getBorderWidth('lr') + this.bwrap.getPadding('lr') + this.el.getBorderWidth('lr');
+        //}
+        if(this.tabs){
+            h += this.tabs.stripWrap.getHeight() + this.tabs.bodyEl.getMargins('tb') + this.tabs.bodyEl.getPadding('tb');
+            w += this.tabs.bodyEl.getMargins('lr') + this.tabs.bodyEl.getPadding('lr');
+        }
+        this.resizeTo(w, h);
+        return this;
+    },
+    
+    /**
+     * Adds a key listener for when this dialog is displayed
+     * @param {Number/Array/Object} key Either the numeric key code, array of key codes or an object with the following options: 
+     *                                  {key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}
+     * @param {Function} fn The function to call
+     * @param {Object} scope (optional) The scope of the function
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    addKeyListener : function(key, fn, scope){
+        var keyCode, shift, ctrl, alt;
+        if(typeof key == 'object' && !(key instanceof Array)){
+            keyCode = key['key'];
+            shift = key['shift'];
+            ctrl = key['ctrl'];
+            alt = key['alt'];
+        }else{
+            keyCode = key;
+        }
+        var handler = function(dlg, e){
+            if((!shift || e.shiftKey) && (!ctrl || e.ctrlKey) &&  (!alt || e.altKey)){
+                var k = e.getKey();
+                if(keyCode instanceof Array){
+                    for(var i = 0, len = keyCode.length; i < len; i++){
+                        if(keyCode[i] == k){
+                          fn.call(scope || window, dlg, k, e);
+                          return;
+                        }
+                    }
+                }else{
+                    if(k == keyCode){
+                        fn.call(scope || window, dlg, k, e);
+                    }
+                }
+            }
+        };
+        this.on('keydown', handler);
+        return this; 
+    },
+    
+    /**
+     * Returns the TabPanel component (if autoTabs)
+     * @return {YAHOO.ext.TabPanel}
+     */
+    getTabs : function(){
+        if(!this.tabs){
+            this.el.addClass('ydlg-auto-tabs');
+            this.body.addClass(this.tabPosition == 'bottom' ? 'ytabs-bottom' : 'ytabs-top');
+            this.tabs = new YAHOO.ext.TabPanel(this.body.dom, this.tabPosition == 'bottom');
+        }
+        return this.tabs;    
+    },
+    
+    /**
+     * Adds a button.
+     * @param {String/Object} config A string becomes the button text, an object is expected to be a valid YAHOO.ext.DomHelper element config
+     * @param {Function} handler The function called when the button is clicked
+     * @param {Object} scope (optional) The scope of the handler function
+     * @return {YAHOO.ext.Button}
+     */
+    addButton : function(config, handler, scope){
+        var dh = YAHOO.ext.DomHelper;
+        if(!this.footer){
+            this.footer = dh.append(this.bwrap.dom, {tag: 'div', cls:'ydlg-ft'}, true);
+        }
+        if(!this.btnContainer){
+            var tb = this.footer.createChild({
+                tag:'div', 
+                cls:'ydlg-btns ydlg-btns-'+this.buttonAlign,
+                html:'<table cellspacing="0"><tbody><tr></tr></tbody></table>'
+            });
+            this.btnContainer = tb.dom.firstChild.firstChild.firstChild;
+        }
+        var bconfig = {
+            handler: handler,
+            scope: scope,
+            minWidth: this.minButtonWidth
+        };
+        if(typeof config == 'string'){
+            bconfig.text = config;
+        }else{
+            bconfig.dhconfig = config;
+        }
+        var btn = new YAHOO.ext.Button(
+            this.btnContainer.appendChild(document.createElement('td')),
+            bconfig
+        );
+        this.syncBodyHeight();
+        if(!this.buttons){
+            this.buttons = [];
+        }
+        this.buttons.push(btn);
+        return btn;
+    },
+    
+    /**
+     * Sets the default button to be focused when the dialog is displayed
+     * @param {YAHOO.ext.BasicDialog.Button} btn The button object returned by addButton
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    setDefaultButton : function(btn){
+        this.defaultButton = btn;  
+        return this;
+    },
+    
+    getHeaderFooterHeight : function(safe){
+        var height = 0;
+        if(this.header){
+           height += this.header.getHeight();
+        }
+        if(this.footer){
+           var fm = this.footer.getMargins();
+            height += (this.footer.getHeight()+fm.top+fm.bottom);
+        }
+        height += this.bwrap.getPadding('tb')+this.bwrap.getBorderWidth('tb');
+        height += this.centerBg.getPadding('tb');
+        return height;
+    },
+    
+    syncBodyHeight : function(){
+        var height = this.size.height - this.getHeaderFooterHeight(false);
+        this.body.setHeight(height-this.body.getMargins('tb'));
+        if(this.tabs){
+            this.tabs.syncHeight();
+        }
+        var hh = this.header.getHeight();
+        var h = this.size.height-hh;
+        this.centerBg.setHeight(h);
+        this.bwrap.setLeftTop(this.centerBg.getPadding('l'), hh+this.centerBg.getPadding('t'));
+        this.bwrap.setHeight(h-this.centerBg.getPadding('tb'));
+        this.bwrap.setWidth(this.el.getWidth(true)-this.centerBg.getPadding('lr'));
+        this.body.setWidth(this.bwrap.getWidth(true));
+    },
+    
+    /**
+     * Restores the previous state of the dialog if YAHOO.ext.state is configured
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    restoreState : function(){
+        var box = YAHOO.ext.state.Manager.get(this.stateId || (this.el.id + '-state'));
+        if(box && box.width){
+            this.xy = [box.x, box.y];
+            this.resizeTo(box.width, box.height);
+        }
+        return this; 
+    },
+    
+    beforeShow : function(){
+        if(this.fixedcenter) {
+            this.xy = this.el.getCenterXY(true);
+        }
+        if(this.modal){
+            YAHOO.util.Dom.addClass(document.body, 'masked');
+            this.mask.setSize(YAHOO.util.Dom.getDocumentWidth(), YAHOO.util.Dom.getDocumentHeight());
+            this.mask.show();
+        }
+        this.constrainXY();
+    },
+    
+    animShow : function(){
+        var b = getEl(this.animateTarget, true).getBox();
+        this.proxy.setSize(b.width, b.height);
+        this.proxy.setLocation(b.x, b.y);
+        this.proxy.show();
+        this.proxy.setBounds(this.xy[0], this.xy[1], this.size.width, this.size.height, 
+                    true, .35, this.showEl.createDelegate(this));
+    },
+    
+    /**
+     * Shows the dialog.
+     * @param {String/HTMLElement/YAHOO.ext.Element} animateTarget (optional) Reset the animation target
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    show : function(animateTarget){
+        if (this.fireEvent('beforeshow', this) === false){
+            return;
+        }
+        if(this.syncHeightBeforeShow){
+            this.syncBodyHeight();
+        }
+        this.animateTarget = animateTarget || this.animateTarget;
+        if(!this.el.isVisible()){
+            this.beforeShow();
+            if(this.animateTarget){
+                this.animShow();
+            }else{
+                this.showEl();
+            }
+        }
+        return this; 
+    },
+    
+    showEl : function(){
+        this.proxy.hide();
+        this.el.setXY(this.xy);
+        this.el.show();
+        this.adjustAssets(true);
+        this.toFront();
+        this.focus();
+        this.fireEvent('show', this);
+    },
+    
+    focus : function(){
+        if(this.defaultButton){
+            this.defaultButton.focus();
+        }else{
+            this.focusEl.focus();
+        }  
+    },
+    
+    constrainXY : function(){
+        if(this.constraintoviewport !== false){
+            if(!this.viewSize){
+                if(this.container){
+                    var s = this.container.getSize();
+                    this.viewSize = [s.width, s.height];
+                }else{
+                    this.viewSize = [YAHOO.util.Dom.getViewportWidth(), 
+                                     YAHOO.util.Dom.getViewportHeight()];
+                }
+            }
+            var x = this.xy[0], y = this.xy[1];
+            var w = this.size.width, h = this.size.height;
+            var vw = this.viewSize[0], vh = this.viewSize[1];
+            // only move it if it needs it
+            var moved = false;
+            // first validate right/bottom
+            if(x + w > vw){
+                x = vw - w;
+                moved = true;
+            }
+            if(y + h > vh){
+                y = vh - h;
+                moved = true;
+            }
+            // then make sure top/left isn't negative
+            if(x < 0){
+                x = 0;
+                moved = true;
+            }
+            if(y < 0){
+                y = 0;
+                moved = true;
+            }
+            if(moved){
+                // cache xy
+                this.xy = [x, y];
+                if(this.isVisible()){
+                    this.el.setLocation(x, y);
+                    this.adjustAssets();
+                }
+            }
+        }
+    },
+    
+    onDrag : function(){
+        if(!this.proxyDrag){
+            this.xy = this.el.getXY();
+            this.adjustAssets();
+        }   
+    },
+    
+    adjustAssets : function(doShow){
+        var x = this.xy[0], y = this.xy[1];
+        var w = this.size.width, h = this.size.height;
+        if(doShow === true){
+            if(this.shadow){
+                this.shadow.show();
+            }
+            if(this.shim){
+                this.shim.show();
+            }
+        }
+        if(this.shadow && this.shadow.isVisible()){
+            this.shadow.setBounds(x + this.shadowOffset, y + this.shadowOffset, w, h);
+        }
+        if(this.shim && this.shim.isVisible()){
+            this.shim.setBounds(x, y, w, h);
+        }
+    },
+    
+    
+    adjustViewport : function(w, h){
+        if(!w || !h){
+            w = YAHOO.util.Dom.getViewportWidth();
+            h = YAHOO.util.Dom.getViewportHeight();
+        }
+        // cache the size
+        this.viewSize = [w, h];
+        if(this.modal && this.mask.isVisible()){
+            this.mask.setSize(w, h); // first make sure the mask isn't causing overflow
+            this.mask.setSize(YAHOO.util.Dom.getDocumentWidth(), YAHOO.util.Dom.getDocumentHeight());
+        }
+        if(this.isVisible()){
+            this.constrainXY();
+        }
+    },
+    
+    /**
+     * Destroys this dialog
+     * @param {Boolean} removeEl (optional) true to remove the element from the DOM
+     */
+    destroy : function(removeEl){
+        YAHOO.ext.EventManager.removeResizeListener(this.adjustViewport, this);
+        if(this.tabs){
+            this.tabs.destroy(removeEl);
+        }
+        if(this.shim){
+            this.shim.remove();
+        }
+        if(this.shadow){
+            this.shadow.remove();
+        }
+        if(this.proxy){
+            this.proxy.remove();
+        }
+        if(this.resizer){
+            this.resizer.destroy();
+        }
+        if(this.close){
+            this.close.removeAllListeners();
+            this.close.remove();
+        }
+        if(this.mask){
+            this.mask.remove();
+        }
+        if(this.dd){
+            this.dd.unreg();
+        }
+        if(this.buttons){
+           for(var i = 0, len = this.buttons.length; i < len; i++){
+               this.buttons[i].destroy();
+           }
+        }
+        this.el.removeAllListeners();
+        if(removeEl === true){
+            this.el.update('');
+            this.el.remove();
+        }
+        YAHOO.ext.DialogManager.unregister(this);
+    },
+    
+    startMove : function(){
+        if(this.proxyDrag){
+            this.proxy.show();
+        }
+        if(this.constraintoviewport !== false){
+            this.dd.constrainTo(document.body, {right: this.shadowOffset, bottom: this.shadowOffset});
+        }
+    },
+    
+    endMove : function(){
+        if(!this.proxyDrag){
+            YAHOO.util.DD.prototype.endDrag.apply(this.dd, arguments);
+        }else{
+            YAHOO.util.DDProxy.prototype.endDrag.apply(this.dd, arguments);
+            this.proxy.hide();
+        }
+        this.refreshSize();
+        this.adjustAssets();
+        this.fireEvent('move', this, this.xy[0], this.xy[1])
+    },
+    
+    /**
+     * Brings this dialog to the front of any other visible dialogs
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    toFront : function(){
+        YAHOO.ext.DialogManager.bringToFront(this);  
+        return this; 
+    },
+    
+    /**
+     * Sends this dialog to the back (under) of any other visible dialogs
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    toBack : function(){
+        YAHOO.ext.DialogManager.sendToBack(this);  
+        return this; 
+    },
+    
+    /**
+     * Centers this dialog 
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    center : function(){
+        var xy = this.el.getCenterXY(true);
+        this.moveTo(xy[0], xy[1]);
+        return this; 
+    },
+    
+    /**
+     * Moves the dialog to the specified point
+     * @param {Number} x
+     * @param {Number} y
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    moveTo : function(x, y){
+        this.xy = [x,y];
+        if(this.isVisible()){
+            this.el.setXY(this.xy);
+            this.adjustAssets();
+        }
+        return this; 
+    },
+    
+    /**
+     * Returns true if the dialog is visible
+     * @return {Boolean}
+     */
+    isVisible : function(){
+        return this.el.isVisible();    
+    },
+    
+    animHide : function(callback){
+        var b = getEl(this.animateTarget, true).getBox();
+        this.proxy.show();
+        this.proxy.setBounds(this.xy[0], this.xy[1], this.size.width, this.size.height);
+        this.el.hide();
+        this.proxy.setBounds(b.x, b.y, b.width, b.height, true, .35, 
+                    this.hideEl.createDelegate(this, [callback]));
+    },
+    
+    /**
+     * Hides the dialog.
+     * @param {Function} callback (optional) Function to call when the dialog is hidden
+     * @return {YAHOO.ext.BasicDialog} this
+     */
+    hide : function(callback){
+        if (this.fireEvent('beforehide', this) === false)
+            return;
+        
+        if(this.shadow){
+            this.shadow.hide();
+        }
+        if(this.shim) {
+          this.shim.hide();
+        }
+        if(this.animateTarget){
+           this.animHide(callback);
+        }else{
+            this.el.hide();
+            this.hideEl(callback);
+        }
+        return this; 
+    },
+    
+    hideEl : function(callback){
+        this.proxy.hide();
+        if(this.modal){
+            this.mask.hide();
+            YAHOO.util.Dom.removeClass(document.body, 'masked');
+        }
+        this.fireEvent('hide', this);
+        if(typeof callback == 'function'){
+            callback();
+        }
+    },
+    
+    hideAction : function(){
+        this.setLeft('-10000px');  
+        this.setTop('-10000px');
+        this.setStyle('visibility', 'hidden'); 
+    },
+    
+    refreshSize : function(){
+        this.size = this.el.getSize();
+        this.xy = this.el.getXY();
+        YAHOO.ext.state.Manager.set(this.stateId || this.el.id + '-state', this.el.getBox());
+    },
+    
+    setZIndex : function(index){
+        if(this.modal){
+            this.mask.setStyle('z-index', index);
+        }
+        if(this.shim){
+            this.shim.setStyle('z-index', ++index);
+        }
+        if(this.shadow){
+            this.shadow.setStyle('z-index', ++index);
+        }
+        this.el.setStyle('z-index', ++index);
+        if(this.proxy){
+            this.proxy.setStyle('z-index', ++index);
+        }
+        if(this.resizer){
+            this.resizer.proxy.setStyle('z-index', ++index);
+        }
+        
+        this.lastZIndex = index;
+    },
+    
+    /**
+     * Returns the element for this dialog
+     * @return {YAHOO.ext.Element}
+     */
+    getEl : function(){
+        return this.el;
+    }
+});
+
+/**
+ * @class YAHOO.ext.DialogManager
+ * Provides global access to BasicDialogs that have been created and 
+ * support for z-indexing (layering) multiple open dialogs.
+ */
+YAHOO.ext.DialogManager = function(){
+    var list = {};
+    var accessList = [];
+    var front = null;
+    
+    var sortDialogs = function(d1, d2){
+        return (!d1._lastAccess || d1._lastAccess < d2._lastAccess) ? -1 : 1;
+    };
+    
+    var orderDialogs = function(){
+        accessList.sort(sortDialogs);
+        var seed = YAHOO.ext.DialogManager.zseed;
+        for(var i = 0, len = accessList.length; i < len; i++){
+            if(accessList[i]){
+                accessList[i].setZIndex(seed + (i*10));
+            }  
+        }
+    };
+    
+    return {
+        /**
+         * The starting z-index for BasicDialogs - defaults to 10000
+         * @type Number
+         */
+        zseed : 10000,
+        
+        
+        register : function(dlg){
+            list[dlg.id] = dlg;
+            accessList.push(dlg);
+        },
+        
+        unregister : function(dlg){
+            delete list[dlg.id];
+            if(!accessList.indexOf){
+                for(var i = 0, len = accessList.length; i < len; i++){
+                    accessList.splice(i, 1);
+                    return;
+                }
+            }else{
+                var i = accessList.indexOf(dlg);
+                if(i != -1){
+                    accessList.splice(i, 1);
+                }
+            }
+        },
+        
+        /**
+         * Gets a registered dialog by id
+         * @param {String/Object} id The id of the dialog or a dialog
+         * @return {YAHOO.ext.BasicDialog}
+         */
+        get : function(id){
+            return typeof id == 'object' ? id : list[id];
+        },
+        
+        /**
+         * Brings the specified dialog to the front
+         * @param {String/Object} dlg The id of the dialog or a dialog
+         * @return {YAHOO.ext.BasicDialog}
+         */
+        bringToFront : function(dlg){
+            dlg = this.get(dlg);
+            if(dlg != front){
+                front = dlg;
+                dlg._lastAccess = new Date().getTime();
+                orderDialogs();
+            }
+            return dlg;
+        },
+        
+        /**
+         * Sends the specified dialog to the back
+         * @param {String/Object} dlg The id of the dialog or a dialog
+         * @return {YAHOO.ext.BasicDialog}
+         */
+        sendToBack : function(dlg){
+            dlg = this.get(dlg);
+            dlg._lastAccess = -(new Date().getTime());
+            orderDialogs();
+            return dlg;
+        }
+    };
+}();
+
+/**
+ * @class YAHOO.ext.LayoutDialog
+ * @extends YAHOO.ext.BasicDialog
+ * Dialog which provides adjustments for working with a layout in a Dialog. 
+ * Add your neccessary layout config options to the dialogs config.<br>
+ * Example Usage (including a nested layout):
+ * <pre><code>    if(!dialog){
+    dialog = new YAHOO.ext.LayoutDialog("download-dlg", { 
+            modal: true,
+            width:600,
+            height:450,
+            shadow:true,
+            minWidth:500,
+            minHeight:350,
+            autoTabs:true,
+            proxyDrag:true,
+            // layout config merges with the dialog config
+            center:{
+                tabPosition: 'top',
+                alwaysShowTabs: true
+            }
+    });
+    dialog.addKeyListener(27, dialog.hide, dialog);
+    dialog.setDefaultButton(dialog.addButton('Close', dialog.hide, dialog));
+    dialog.addButton('Build It!', this.getDownload, this);
+    
+    // we can even add nested layouts
+    var innerLayout = new YAHOO.ext.BorderLayout('dl-inner', {
+        east: {
+            initialSize: 200,
+            autoScroll:true,
+            split:true
+        },
+        center: {
+            autoScroll:true
+        }
+    });
+    innerLayout.beginUpdate();
+    innerLayout.add('east', new YAHOO.ext.ContentPanel('dl-details'));
+    innerLayout.add('center', new YAHOO.ext.ContentPanel('selection-panel'));
+    innerLayout.endUpdate(true);
+    
+    // when doing updates to the top level layout in a dialog, you need to 
+    // use dialog.beginUpdate()/endUpdate() instead of layout.beginUpdate()/endUpdate()
+    var layout = dialog.getLayout();
+    dialog.beginUpdate();
+    layout.add('center', new YAHOO.ext.ContentPanel('standard-panel', 
+                        {title: 'Download the Source', fitToFrame:true}));
+    layout.add('center', new YAHOO.ext.NestedLayoutPanel(innerLayout, 
+               {title: 'Build your own yui-ext.js'}));
+    layout.getRegion('center').showPanel(sp);
+    dialog.endUpdate();</code></pre>
+    * @constructor
+    * @param {String/HTMLElement/YAHOO.ext.Element} el The id of or container element
+    * @param {Object} config configuration options
+  */
+YAHOO.ext.LayoutDialog = function(el, config){
+    config.autoTabs = false;
+    YAHOO.ext.LayoutDialog.superclass.constructor.call(this, el, config);
+    this.body.setStyle({overflow:'hidden', position:'relative'});
+    this.layout = new YAHOO.ext.BorderLayout(this.body.dom, config);
+    this.layout.monitorWindowResize = false;
+    this.el.addClass('ydlg-auto-layout');
+    // fix case when center region overwrites center function
+    this.center = YAHOO.ext.BasicDialog.prototype.center;
+    this.on('show', this.layout.layout, this.layout, true);
+};
+YAHOO.extendX(YAHOO.ext.LayoutDialog, YAHOO.ext.BasicDialog, {
+    /**
+     * Ends update of the layout <strike>and resets display to none</strike>. Use standard beginUpdate/endUpdate on the layout.
+     * @deprecated
+     */
+    endUpdate : function(){
+        this.layout.endUpdate();
+    },
+    /**
+     * Begins an update of the layout <strike>and sets display to block and visibility to hidden</strike>. Use standard beginUpdate/endUpdate on the layout.
+     *  @deprecated
+     */
+    beginUpdate : function(){
+        this.layout.beginUpdate();
+    },
+    /**
+     * Get the BorderLayout for this dialog
+     * @return {YAHOO.ext.BorderLayout} 
+     */
+    getLayout : function(){
+        return this.layout;
+    },
+    syncBodyHeight : function(){
+        YAHOO.ext.LayoutDialog.superclass.syncBodyHeight.call(this);
+        if(this.layout)this.layout.layout();
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/widgets/Button.js b/frontend/beta/js/YUI-extensions/widgets/Button.js
new file mode 100644
index 0000000..5bf3dc3
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/Button.js
@@ -0,0 +1,185 @@
+/**
+ * @class YAHOO.ext.Button
+ * @extends YAHOO.ext.util.Observable
+ * Simple Button class
+ * @cfg {String} text The button text
+ * @cfg {Function} handler A function called when the button is clicked (can be used instead of click event)
+ * @cfg {Object} scope The scope of the handler
+ * @cfg {Number} minWidth The minimum width for this button (used to give a set of buttons a common width)
+ * @constructor
+ * Create a new button
+ * @param {String/HTMLElement/Element} renderTo The element to append the button to
+ * @param {Object} config The config object
+ */
+YAHOO.ext.Button = function(renderTo, config){
+    YAHOO.ext.util.Config.apply(this, config);
+    this.events = {
+        /**
+	     * @event click
+	     * Fires when this button is clicked
+	     * @param {Button} this
+	     * @param {EventObject} e The click event
+	     */
+	    'click' : true  
+    };
+    if(renderTo){
+        this.render(renderTo);
+    }
+};
+
+YAHOO.extendX(YAHOO.ext.Button, YAHOO.ext.util.Observable, {
+    render : function(renderTo){
+        var btn;
+        if(!this.dhconfig){
+            if(!YAHOO.ext.Button.buttonTemplate){
+                // hideous table template
+                YAHOO.ext.Button.buttonTemplate = new YAHOO.ext.DomHelper.Template('<a href="#" class="ybtn-focus"><table border="0" cellpadding="0" cellspacing="0" class="ybtn-wrap"><tbody><tr><td class="ybtn-left">&#160;</td><td class="ybtn-center" unselectable="on">{0}</td><td class="ybtn-right">&#160;</td></tr></tbody></table></a>');
+            }
+            btn = YAHOO.ext.Button.buttonTemplate.append(
+               getEl(renderTo).dom, [this.text], true);
+            this.tbl = getEl(btn.dom.firstChild, true);
+        }else{
+            btn = YAHOO.ext.DomHelper.append(this.footer.dom, this.dhconfig, true);
+        }
+        this.el = btn;
+        this.autoWidth();
+        btn.addClass('ybtn');
+        btn.mon('click', this.onClick, this, true);
+        btn.on('mouseover', this.onMouseOver, this, true);
+        btn.on('mouseout', this.onMouseOut, this, true);
+        btn.on('mousedown', this.onMouseDown, this, true);
+        btn.on('mouseup', this.onMouseUp, this, true);
+    },
+    /**
+     * Returns the buttons element
+     * @return {YAHOO.ext.Element}
+     */
+    getEl : function(){
+        return this.el;  
+    },
+    
+    /**
+     * Destroys this Button. 
+     */
+    destroy : function(){
+        this.el.removeAllListeners();
+        this.purgeListeners();
+        this.el.update('');
+        this.el.remove();
+    },
+    
+    autoWidth : function(){
+        if(this.tbl){
+            this.el.setWidth('auto');
+            this.tbl.setWidth('auto');
+            if(this.minWidth){
+                 if(this.tbl.getWidth() < this.minWidth){
+                     this.tbl.setWidth(this.minWidth);
+                 }
+            }
+            this.el.setWidth(this.tbl.getWidth());
+        } 
+    },
+    /**
+     * Sets this buttons click handler
+     * @param {Function} handler The function to call when the button is clicked
+     * @param {Object} scope (optional) Scope for the function passed above
+     */
+    setHandler : function(handler, scope){
+        this.handler = handler;
+        this.scope = scope;  
+    },
+    
+    /**
+     * Set this buttons text
+     * @param {String} text
+     */
+    setText : function(text){
+        this.text = text;
+        this.el.dom.firstChild.firstChild.firstChild.childNodes[1].innerHTML = text;
+        this.autoWidth();
+    },
+    
+    /**
+     * Get the text for this button
+     * @return {String}
+     */
+    getText : function(){
+        return this.text;  
+    },
+    
+    /**
+     * Show this button
+     */
+    show: function(){
+        this.el.setStyle('display', '');
+    },
+    
+    /**
+     * Hide this button
+     */
+    hide: function(){
+        this.el.setStyle('display', 'none'); 
+    },
+    
+    /**
+     * Convenience function for boolean show/hide
+     * @param {Boolean} visible true to show/false to hide
+     */
+    setVisible: function(visible){
+        if(visible) {
+            this.show();
+        }else{
+            this.hide();
+        }
+    },
+    
+    /**
+     * Focus the button
+     */
+    focus : function(){
+        this.el.focus();    
+    },
+    
+    /**
+     * Disable this button
+     */
+    disable : function(){
+        this.el.addClass('ybtn-disabled');
+        this.disabled = true;
+    },
+    
+    /**
+     * Enable this button
+     */
+    enable : function(){
+        this.el.removeClass('ybtn-disabled');
+        this.disabled = false;
+    },
+    
+    onClick : function(e){
+        e.preventDefault();
+        if(!this.disabled){
+            this.fireEvent('click', this, e);
+            if(this.handler){
+                this.handler.call(this.scope || this, this, e);
+            }
+        }
+    },
+    onMouseOver : function(e){
+        if(!this.disabled){
+            this.el.addClass('ybtn-over');
+        }
+    },
+    onMouseOut : function(e){
+        this.el.removeClass('ybtn-over');
+    },
+    onMouseDown : function(){
+        if(!this.disabled){
+            this.el.addClass('ybtn-click');
+        }
+    },
+    onMouseUp : function(){
+        this.el.removeClass('ybtn-click');
+    }    
+});
diff --git a/frontend/beta/js/YUI-extensions/widgets/DatePicker.js b/frontend/beta/js/YUI-extensions/widgets/DatePicker.js
new file mode 100644
index 0000000..eb1e06f
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/DatePicker.js
@@ -0,0 +1,344 @@
+YAHOO.ext.DatePicker = function(id, parentElement){
+    this.id = id;
+    this.selectedDate = new Date();
+    this.visibleDate = new Date();
+    this.element = null;
+    this.shadow = null;
+    this.callback = null;
+    this.buildControl(parentElement || document.body);
+    this.mouseDownHandler = YAHOO.ext.EventManager.wrap(this.handleMouseDown, this, true);
+    this.keyDownHandler = YAHOO.ext.EventManager.wrap(this.handleKeyDown, this, true);
+    this.wheelHandler = YAHOO.ext.EventManager.wrap(this.handleMouseWheel, this, true);
+};
+
+YAHOO.ext.DatePicker.prototype = {
+    show : function(x, y, value, callback){
+        this.hide();
+        this.selectedDate = value;
+        this.visibleDate = value;
+        this.callback = callback;
+        this.refresh();
+        this.element.show();
+        this.element.setXY(this.constrainToViewport ? this.constrainXY(x, y) : [x, y]);
+        this.shadow.show();
+        this.shadow.setRegion(this.element.getRegion());
+        this.element.dom.tabIndex = 1;
+        this.element.focus();
+        YAHOO.util.Event.on(document, "mousedown", this.mouseDownHandler);
+        YAHOO.util.Event.on(document, "keydown", this.keyDownHandler);
+        YAHOO.util.Event.on(document, "mousewheel", this.wheelHandler);
+        YAHOO.util.Event.on(document, "DOMMouseScroll", this.wheelHandler);
+    },
+    
+    constrainXY : function(x, y){
+        var w = YAHOO.util.Dom.getViewportWidth();
+        var h = YAHOO.util.Dom.getViewportHeight();
+        var size = this.element.getSize();
+        return [
+            Math.min(w-size.width, x),
+            Math.min(h-size.height, y)
+        ];
+    },
+    
+    hide : function(){
+        this.shadow.hide();
+        this.element.hide();
+        YAHOO.util.Event.removeListener(document, "mousedown", this.mouseDownHandler);
+        YAHOO.util.Event.removeListener(document, "keydown", this.keyDownHandler);
+        YAHOO.util.Event.removeListener(document, "mousewheel", this.wheelHandler);
+        YAHOO.util.Event.removeListener(document, "DOMMouseScroll", this.wheelHandler);
+    },
+    
+    setSelectedDate : function(date){
+        this.selectedDate = date;
+    },
+    
+    getSelectedDate : function(){
+        return this.selectedDate;
+    },
+    
+    showPrevMonth : function(){
+        this.visibleDate = this.getPrevMonth(this.visibleDate);
+        this.refresh();
+    },
+    
+    showNextMonth : function(){
+        this.visibleDate = this.getNextMonth(this.visibleDate);
+        this.refresh();
+    },
+    
+    showPrevYear : function(){
+        var d = this.visibleDate;
+        this.visibleDate = new Date(d.getFullYear()-1, d.getMonth(), d.getDate());
+        this.refresh();
+    },
+    
+    showNextYear : function(){
+        var d = this.visibleDate;
+        this.visibleDate = new Date(d.getFullYear()+1, d.getMonth(), d.getDate());
+        this.refresh();
+    },
+    
+    handleMouseDown : function(e){
+        var target = e.getTarget();
+        if(target != this.element.dom && !YAHOO.util.Dom.isAncestor(this.element.dom, target)){
+            this.hide();
+        }
+    },
+    
+    handleKeyDown : function(e){
+        switch(e.browserEvent.keyCode){
+            case e.LEFT:
+                this.showPrevMonth();
+                e.stopEvent();
+            break;
+            case e.RIGHT:
+                this.showNextMonth();
+                e.stopEvent();
+            break;
+            case e.DOWN:
+                this.showPrevYear();
+                e.stopEvent();
+            break;
+            case e.UP:
+                this.showNextYear();
+                e.stopEvent();
+            break;
+        }
+    },
+    
+    handleMouseWheel : function(e){
+        var delta = e.getWheelDelta();
+        if(delta > 0){
+            this.showPrevMonth();
+            e.stopEvent();
+        } else if(delta < 0){
+            this.showNextMonth();
+            e.stopEvent();
+        }
+    },
+    
+    handleClick : function(e){
+        var d = this.visibleDate;
+        var t = e.getTarget();
+        if(t && t.className){
+            var cls = t.className.split(' ')[0];
+            switch(cls){
+                case 'active':
+                    this.handleSelection(new Date(d.getFullYear(), d.getMonth(), parseInt(t.innerHTML)));
+                break;
+                case 'prevday':
+                    var p = this.getPrevMonth(d);
+                    this.handleSelection(new Date(p.getFullYear(), p.getMonth(), parseInt(t.innerHTML)));
+                break;
+                case 'nextday':
+                    var n = this.getNextMonth(d);
+                    this.handleSelection(new Date(n.getFullYear(), n.getMonth(), parseInt(t.innerHTML)));
+                break;
+                case 'ypopcal-today':
+                    this.handleSelection(new Date());
+                break;
+                case 'next-month':
+                    this.showNextMonth();
+                break;
+                case 'prev-month':
+                    this.showPrevMonth();
+                break;
+            }   
+        }
+        e.stopEvent();
+    },
+    
+    selectToday : function(){
+        this.handleSelection(new Date());
+    },
+    
+    handleSelection: function(date){
+        this.selectedDate = date;
+        this.callback(date);
+        this.hide();    
+    },
+    
+    getPrevMonth : function(d){
+        var m = d.getMonth();var y = d.getFullYear();
+        return (m == 0 ? new Date(--y, 11, 1) : new Date(y, --m, 1));
+    },
+    
+    getNextMonth : function(d){
+        var m = d.getMonth();var y = d.getFullYear();
+        return (m == 11 ? new Date(++y, 0, 1) : new Date(y, ++m, 1));
+    },
+    
+    getDaysInMonth : function(m, y){
+        return (m == 1 || m == 3 || m == 5 || m == 7 || m == 8 || m == 10 || m == 12) ? 31 : (m == 4 || m == 6 || m == 9 || m == 11) ? 30 : this.isLeapYear(y) ? 29 : 28;
+    },
+    
+    isLeapYear : function(y){
+        return (((y % 4) == 0) && ((y % 100) != 0) || ((y % 400) == 0));
+    },
+    
+    clearTime : function(date){
+        if(date){
+            date.setHours(0);
+            date.setMinutes(0);
+            date.setSeconds(0);
+            date.setMilliseconds(0);
+        }
+        return date;
+    },
+    
+    refresh : function(){
+        var d = this.visibleDate;
+        this.buildInnerCal(d);
+        this.calHead.update(this.monthNames[d.getMonth()] + ' ' + d.getFullYear());
+        if(this.element.isVisible()){
+            this.shadow.setRegion(this.element.getRegion());
+        }
+    }
+};
+
+/**
+ * This code is not pretty, but it is fast!
+ * @ignore
+ */ 
+YAHOO.ext.DatePicker.prototype.buildControl = function(parentElement){
+    var c = document.createElement('div');
+    c.style.position = 'absolute';
+    c.style.visibility = 'hidden';
+    document.body.appendChild(c);
+    var html = '<iframe id="'+this.id+'_shdw" frameborder="0" class="ypopcal-shadow" src="'+YAHOO.ext.SSL_SECURE_URL+'"></iframe>' +
+    '<div hidefocus="true" class="ypopcal" id="'+this.id+'">' +
+    '<table class="ypopcal-head" border=0 cellpadding=0 cellspacing=0><tbody><tr><td class="ypopcal-arrow"><div class="prev-month">&#160;</div></td><td class="ypopcal-month">&#160;</td><td class="ypopcal-arrow"><div class="next-month">&#160;</div></td></tr></tbody></table>' +
+    '<center><div class="ypopcal-inner">';
+    html += "<table border=0 cellspacing=0 class=\"ypopcal-table\"><thead><tr class=\"ypopcal-daynames\">";
+    var names = this.dayNames;
+    for(var i = 0; i < names.length; i++){
+        html += '<td>' + names[i].substr(0, 1) + '</td>';
+    }
+    html+= "</tr></thead><tbody><tr>";
+    for(var i = 0; i < 42; i++) {
+        if(i % 7 == 0 && i != 0){
+            html += '</tr><tr>';
+        }
+        html += "<td>&nbsp;</td>";
+    }
+    html += "</tr></tbody></table>";
+    html += '</div><button class="ypopcal-today">'+this.todayText+'</button></center></div>';
+    c.innerHTML = html;
+    this.shadow = getEl(c.childNodes[0], true);
+    this.shadow.enableDisplayMode('block');
+    this.element = getEl(c.childNodes[1], true);
+    this.element.enableDisplayMode('block');
+    document.body.appendChild(this.shadow.dom);
+    document.body.appendChild(this.element.dom);
+    document.body.removeChild(c);
+    this.element.on("selectstart", function(){return false;});
+    var tbody = this.element.dom.getElementsByTagName('tbody')[1];
+    this.cells = tbody.getElementsByTagName('td');
+    this.calHead = this.element.getChildrenByClassName('ypopcal-month', 'td')[0];
+    this.element.mon('mousedown', this.handleClick, this, true);
+};
+
+YAHOO.ext.DatePicker.prototype.buildInnerCal = function(dateVal){
+    var days = this.getDaysInMonth(dateVal.getMonth() + 1, dateVal.getFullYear());
+    var firstOfMonth = new Date(dateVal.getFullYear(), dateVal.getMonth(), 1);
+    var startingPos = firstOfMonth.getDay();
+    if(startingPos == 0) startingPos = 7;
+    var pm = this.getPrevMonth(dateVal);
+    var prevStart = this.getDaysInMonth(pm.getMonth()+1, pm.getFullYear())-startingPos;
+    var cells = this.cells;
+    days += startingPos;
+    
+    // convert everything to numbers so it's fast
+    var day = 86400000;
+    var date = this.clearTime(new Date(pm.getFullYear(), pm.getMonth(), prevStart));
+    var today = this.clearTime(new Date()).getTime();
+    var sel = this.selectedDate ? this.clearTime(this.selectedDate).getTime() : today + 1; //today +1 will never match anything
+    var min = this.minDate ? this.clearTime(this.minDate).getTime() : Number.NEGATIVE_INFINITY;
+    var max = this.maxDate ? this.clearTime(this.maxDate).getTime() : Number.POSITIVE_INFINITY;
+    var ddMatch = this.disabledDatesRE;
+    var ddText = this.disabledDatesText;
+    var ddays = this.disabledDays;
+    var ddaysText = this.disabledDaysText;
+    var format = this.format;
+    
+    var setCellClass = function(cal, cell, d){
+        cell.title = '';
+        var t = d.getTime();
+        if(t == today){
+            cell.className += ' today';
+            cell.title = cal.todayText;
+        }
+        if(t == sel){
+            cell.className += ' selected';
+        }
+        // disabling
+        if(t < min) {
+            cell.className = ' ypopcal-disabled';
+            cell.title = cal.minText;
+            return;
+        }
+        if(t > max) {
+            cell.className = ' ypopcal-disabled';
+            cell.title = cal.maxText;
+            return;
+        }
+        if(ddays){
+            var day = d.getDay();
+            for(var i = 0; i < ddays.length; i++) {
+            	if(day === ddays[i]){
+            	    cell.title = ddaysText;
+                    cell.className = ' ypopcal-disabled';
+                    return;
+                }
+            }
+        }
+        if(ddMatch && format){
+            var fvalue = d.format(format);
+            if(ddMatch.test(fvalue)){
+                cell.title = ddText.replace('%0', fvalue);
+                cell.className = ' ypopcal-disabled';
+                return;
+            }
+        }
+    };
+    
+    var i = 0;
+    for(; i < startingPos; i++) {
+        cells[i].innerHTML = (++prevStart);
+        date.setDate(date.getDate()+1);
+        cells[i].className = 'prevday';
+        setCellClass(this, cells[i], date);
+    }
+    for(; i < days; i++){
+        intDay = i - startingPos + 1;
+        cells[i].innerHTML = (intDay);
+        date.setDate(date.getDate()+1);
+        cells[i].className = 'active';
+        setCellClass(this, cells[i], date);
+    }
+    var extraDays = 0;
+    for(; i < 42; i++) {
+         cells[i].innerHTML = (++extraDays);
+         date.setDate(date.getDate()+1);
+         cells[i].className = 'nextday';
+         setCellClass(this, cells[i], date);
+    }
+};
+
+YAHOO.ext.DatePicker.prototype.todayText = "Today";
+YAHOO.ext.DatePicker.prototype.minDate = null;
+YAHOO.ext.DatePicker.prototype.maxDate = null;
+YAHOO.ext.DatePicker.prototype.minText = "This date is before the minimum date";
+YAHOO.ext.DatePicker.prototype.maxText = "This date is after the maximum date";
+YAHOO.ext.DatePicker.prototype.format = 'm/d/y';
+YAHOO.ext.DatePicker.prototype.disabledDays = null;
+YAHOO.ext.DatePicker.prototype.disabledDaysText = '';
+YAHOO.ext.DatePicker.prototype.disabledDatesRE = null;
+YAHOO.ext.DatePicker.prototype.disabledDatesText = '';
+YAHOO.ext.DatePicker.prototype.constrainToViewport = true;
+
+
+YAHOO.ext.DatePicker.prototype.monthNames = Date.monthNames;
+
+YAHOO.ext.DatePicker.prototype.dayNames = Date.dayNames;
diff --git a/frontend/beta/js/YUI-extensions/widgets/InlineEditor.js b/frontend/beta/js/YUI-extensions/widgets/InlineEditor.js
new file mode 100644
index 0000000..a498faa
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/InlineEditor.js
@@ -0,0 +1,216 @@
+YAHOO.ext.InlineEditor = function(config, existingEl){
+    YAHOO.ext.util.Config.apply(this, config);
+    var dh = YAHOO.ext.DomHelper;
+    this.wrap = dh.append(this.container || document.body, {
+        tag:'div', 
+        cls:'yinline-editor-wrap'
+    }, true);
+    
+    this.textSizeEl = dh.append(document.body, {
+            tag: 'div',
+            cls: 'yinline-editor-sizer ' + (this.cls || '')
+        });
+    if(YAHOO.ext.util.Browser.isSafari){ // extra padding for safari's textboxes
+        this.textSizeEl.style.padding = '4px';
+        YAHOO.util.Dom.setStyle(this.textSizeEl, 'padding-right', '10px');
+    }
+    
+    if(!YAHOO.ext.util.Browser.isGecko){  // no one else needs FireFox cursor fix
+        this.wrap.setStyle('overflow', 'hidden');
+    }
+    
+    if(existingEl){
+        this.el = getEl(existingEl);
+    }
+    if(!this.el){
+        this.id = this.id || YAHOO.util.Dom.generateId();
+        if(!this.multiline){
+            this.el = this.wrap.createChild({
+                tag: 'input', 
+                name: this.name || this.id, 
+                id: this.id, 
+                type: this.type || 'text',
+                autocomplete: 'off',
+                value: this.value || '',
+                cls: 'yinline-editor ' + (this.cls || ''),
+                maxlength: this.maxLength || ''
+            });
+        }else{
+            this.el = this.wrap.createChild({
+                tag: 'textarea', 
+                name: this.name || this.id, 
+                id: this.id,
+                html: this.value || '',
+                cls: 'yinline-editor yinline-editor-multiline ' + (this.cls || ''),
+                wrap: 'none'
+            });
+        }
+    }else{
+        this.wrap.dom.appendChild(this.el.dom);
+    }
+    this.el.addKeyMap([{
+        key: [10, 13],
+        fn: this.onEnter,
+        scope: this
+    },{
+        key: 27,
+        fn: this.onEsc,
+        scope: this
+    }]);
+    this.el.mon('keyup', this.onKeyUp, this, true);
+    this.el.on('blur', this.onBlur, this, true);
+    this.el.swallowEvent('keydown');
+    this.events = {
+        'startedit' : true,
+        'beforecomplete' : true,
+        'complete' : true
+    };
+    this.editing = false;
+    this.autoSizeTask = new YAHOO.ext.util.DelayedTask(this.autoSize, this);
+};
+
+YAHOO.extendX(YAHOO.ext.InlineEditor, YAHOO.ext.util.Observable, {
+    onEnter : function(k, e){
+        if(this.multiline && (e.ctrlKey || e.shiftKey)){
+            return;
+        }else{
+            this.completeEdit();
+            e.stopEvent();
+        }
+    },
+    
+    onEsc : function(){
+        if(this.ignoreNoChange){
+            this.revert(true);
+        }else{
+            this.revert(false);
+            this.completeEdit();
+        }
+    },
+    
+    onBlur : function(){
+        if(this.editing && this.completeOnBlur !== false){
+            this.completeEdit();
+        }
+    },
+    
+    startEdit : function(el, value){
+        this.boundEl = YAHOO.util.Dom.get(el);
+        if(this.hideEl !== false){
+            this.boundEl.style.visibility = 'hidden';
+        }
+        var v = value || this.boundEl.innerHTML;
+        this.startValue = v;
+        this.setValue(v);
+        this.moveTo(YAHOO.util.Dom.getXY(this.boundEl));
+        this.editing = true;
+        if(YAHOO.ext.QuickTips){
+            YAHOO.ext.QuickTips.disable();
+        }
+        this.show.defer(10, this);
+    },
+    
+    onKeyUp : function(e){
+        var k = e.getKey();
+        if(this.editing && (k < 33 || k > 40) && k != 27){
+            this.autoSizeTask.delay(50);
+        }
+    },
+    
+    completeEdit : function(){
+        var v = this.getValue();
+        if(this.revertBlank !== false && v.length < 1){
+            v = this.startValue;
+            this.revert();
+        }
+        if(v == this.startValue && this.ignoreNoChange){
+            this.hide();
+        }
+        if(this.fireEvent('beforecomplete', this, v, this.startValue) !== false){
+            if(this.updateEl !== false && this.boundEl){
+                this.boundEl.innerHTML = v;
+            }
+            this.hide();
+            this.fireEvent('complete', this, v, this.startValue);
+        }
+    },
+    
+    revert : function(hide){
+        this.setValue(this.startValue);
+        if(hide){
+            this.hide();
+        } 
+    },
+    
+    show : function(){
+        this.autoSize();
+        this.wrap.show();
+        this.el.focus();
+        if(this.selectOnEdit !== false){
+            this.el.dom.select();
+        }
+    },
+    
+    hide : function(){
+        this.editing = false;
+        this.wrap.hide();
+        this.wrap.setLeftTop(-10000,-10000);
+        this.el.blur();
+        if(this.hideEl !== false){
+            this.boundEl.style.visibility = 'visible';
+        }
+        if(YAHOO.ext.QuickTips){
+            YAHOO.ext.QuickTips.enable();
+        }
+    },
+    
+    setValue : function(v){
+        this.el.dom.value = v;
+    },
+    
+    getValue : function(){
+        return this.el.dom.value;  
+    },
+    
+    autoSize : function(){
+        var el = this.el;
+        var wrap = this.wrap;
+        var v = el.dom.value;
+        var ts = this.textSizeEl;
+        if(v.length < 1){
+            ts.innerHTML = "&#160;&#160;";
+        }else{
+            v = v.replace(/[<> ]/g, '&#160;');
+            if(this.multiline){
+                v = v.replace(/\n/g, '<br />&#160;');
+            }
+            ts.innerHTML = v;
+        }
+        var ww = wrap.dom.offsetWidth;
+        var wh = wrap.dom.offsetHeight;
+        var w = ts.offsetWidth;
+        var h = ts.offsetHeight;
+        // lots of magic numbers in this block - wtf?
+        // the logic is to prevent the scrollbars from flashing
+        // in firefox. Updates the right element first
+        // so there's never overflow.
+        if(ww > w+4){
+            el.setWidth(w+4);
+            wrap.setWidth(w+8);
+        }else{
+            wrap.setWidth(w+8);
+            el.setWidth(w+4);
+        }
+        if(wh > h+4){
+            el.setHeight(h);
+            wrap.setHeight(h+4);
+        }else{
+            wrap.setHeight(h+4);
+            el.setHeight(h);
+        }
+    },
+    
+    moveTo : function(xy){
+        this.wrap.setXY(xy);
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/widgets/MessageBox.js b/frontend/beta/js/YUI-extensions/widgets/MessageBox.js
new file mode 100644
index 0000000..01b168d
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/MessageBox.js
@@ -0,0 +1,230 @@
+YAHOO.ext.MessageBox = function(){
+    var dlg, opt, mask;
+    var bodyEl, msgEl, textboxEl, textareaEl, progressEl, pp;
+    var buttons, activeTextEl, bwidth;
+    
+    var handleButton = function(button){
+        if(typeof opt.fn == 'function'){
+            if(opt.fn.call(opt.scope||window, button, activeTextEl.dom.value) !== false){
+                dlg.hide();
+            }
+        }else{
+            dlg.hide();
+        }
+    };
+    var updateButtons = function(b){
+        var width = 0;
+        if(!b){
+            buttons['ok'].hide();
+            buttons['cancel'].hide();
+            buttons['yes'].hide();
+            buttons['no'].hide();
+            return width;
+        }
+        for(var k in buttons){
+            if(typeof buttons[k] != 'function'){
+                if(b[k]){
+                    buttons[k].show();
+                    buttons[k].setText(typeof b[k] == 'string' ? b[k] : YAHOO.ext.MessageBox.buttonText[k]);
+                    width += buttons[k].el.getWidth()+15;
+                }else{
+                    buttons[k].hide();
+                }
+            }
+        }
+        return width;
+    };
+    
+    return {
+        getDialog : function(){
+           if(!dlg){
+                dlg = new YAHOO.ext.BasicDialog('mb-dlg', {
+                    autoCreate : true,
+                    shadow: true,
+                    draggable: true,
+                    resizable:false,
+                    constraintoviewport:true,
+                    fixedcenter:true,
+                    shim:true,
+                    modal: true,
+                    width:400, height:100,
+                    buttonAlign:'center',
+                    closeClick : function(){
+                        if(opt && opt.buttons && opt.buttons.no && !opt.buttons.cancel){
+                            handleButton('no');
+                        }else{
+                            handleButton('cancel');
+                        }
+                    }
+                });
+                dlg.closeClick = function(){
+                    alert('wtf');
+                };
+                mask = dlg.mask;
+                dlg.addKeyListener(27, dlg.hide, dlg);
+                buttons = {};
+                buttons['ok'] = dlg.addButton(this.buttonText['ok'], handleButton.createCallback('ok'));
+                buttons['yes'] = dlg.addButton(this.buttonText['yes'], handleButton.createCallback('yes'));
+                buttons['no'] = dlg.addButton(this.buttonText['no'], handleButton.createCallback('no'));
+                buttons['cancel'] = dlg.addButton(this.buttonText['cancel'], handleButton.createCallback('cancel'));
+                bodyEl = dlg.body.createChild({
+                    tag:'div', 
+                    html:'<span class="ext-mb-text"></span><br /><input type="text" class="ext-mb-input"><textarea class="ext-mb-textarea"></textarea><div class="ext-mb-progress-wrap"><div class="ext-mb-progress"><div class="ext-mb-progress-bar">&#160;</div></div></div>'
+                });
+                msgEl = bodyEl.dom.firstChild;
+                textboxEl = getEl(bodyEl.dom.childNodes[2]);
+                textboxEl.enableDisplayMode();
+                textboxEl.addKeyListener([10,13], function(){
+                    if(dlg.isVisible() && opt && opt.buttons){
+                        if(opt.buttons.ok){
+                            handleButton('ok');
+                        }else if(opt.buttons.yes){
+                            handleButton('yes');
+                        }
+                    }
+                });
+                textareaEl = getEl(bodyEl.dom.childNodes[3]);
+                textareaEl.enableDisplayMode();
+                progressEl = getEl(bodyEl.dom.childNodes[4]);
+                progressEl.enableDisplayMode();
+                pp = getEl(progressEl.dom.firstChild.firstChild);
+            }
+            return dlg;
+        },
+        
+        updateText : function(text){
+            if(!dlg.isVisible() && !opt.width){
+                dlg.resizeTo(this.maxWidth, 100); // resize first so content is never clipped from previous shows
+            }
+            msgEl.innerHTML = text;
+            var w = Math.max(Math.min(opt.width || msgEl.offsetWidth, this.maxWidth), 
+                        Math.max(opt.minWidth || this.minWidth, bwidth));
+            if(opt.prompt){
+                activeTextEl.setWidth(w);
+            }
+            dlg.setContentSize(w, bodyEl.getHeight());
+        },        
+        
+        updateProgress : function(value, text){
+            if(text){
+                this.updateText(text);
+            }
+            pp.setWidth(value*progressEl.dom.firstChild.offsetWidth);
+        },        
+        
+        isVisible : function(){
+            return dlg && dlg.isVisible();  
+        },
+        
+        hide : function(){
+            if(this.isVisible()){
+                dlg.hide();
+            }  
+        },
+        
+        show : function(options){
+            var d = this.getDialog();
+            opt = options;
+            d.setTitle(opt.title || '&#160;');
+            d.close.setDisplayed(opt.closable !== false);
+            activeTextEl = textboxEl;
+            opt.prompt = opt.prompt || (opt.multiline ? true : false)
+            if(opt.prompt){
+                if(opt.multiline){
+                    textboxEl.hide();
+                    textareaEl.show();
+                    textareaEl.setHeight(typeof opt.multiline == 'number' ? 
+                        opt.multiline : this.defaultTextHeight);
+                    activeTextEl = textareaEl;
+                }else{
+                    textboxEl.show();
+                    textareaEl.hide();
+                }
+            }else{
+                textboxEl.hide();
+                textareaEl.hide();
+            }
+            progressEl.setDisplayed(opt.progress === true);
+            this.updateProgress(0);
+            activeTextEl.dom.value = opt.value || '';
+            if(opt.prompt){
+                dlg.setDefaultButton(activeTextEl);
+            }else{
+                var bs = opt.buttons;
+                var db = null;
+                if(bs && bs.ok){
+                    db = buttons['ok'];
+                }else if(bs && bs.yes){
+                    db = buttons['yes'];
+                }
+                dlg.setDefaultButton(db);
+            }
+            bwidth = updateButtons(opt.buttons);
+            this.updateText(opt.msg);
+            d.modal = opt.modal !== false;
+            d.mask = opt.modal !== false ? mask : false;
+            d.animateTarget = null;
+            d.show(options.animEl);
+        },
+        
+        progress : function(title, msg){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: false,
+                progress:true,
+                closable:false
+            });
+        },
+        
+        alert : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OK,
+                fn: fn,
+                scope : scope
+            });
+        },
+        
+        confirm : function(title, msg, fn, scope){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.YESNO,
+                fn: fn,
+                scope : scope
+            });
+        },
+        
+        prompt : function(title, msg, fn, scope, multiline){
+            this.show({
+                title : title,
+                msg : msg,
+                buttons: this.OKCANCEL,
+                fn: fn,
+                minWidth:250,
+                scope : scope,
+                prompt:true,
+                multiline: multiline
+            });
+        },
+        
+        OK : {ok:true},
+        YESNO : {yes:true, no:true},
+        OKCANCEL : {ok:true, cancel:true},
+        YESNOCANCEL : {yes:true, no:true, cancel:true},
+        
+        defaultTextHeight:75,
+        maxWidth : 500,
+        minWidth : 100,
+        buttonText : {
+            ok : 'OK',
+            cancel : 'Cancel',
+            yes : 'Yes',
+            no : 'No'
+        }
+    };
+}();
+
+YAHOO.ext.Msg = YAHOO.ext.MessageBox;
diff --git a/frontend/beta/js/YUI-extensions/widgets/QuickTips.js b/frontend/beta/js/YUI-extensions/widgets/QuickTips.js
new file mode 100644
index 0000000..6658574
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/QuickTips.js
@@ -0,0 +1,311 @@
+/**
+ * @class YAHOO.ext.QuickTips
+ * @singleton
+ */
+YAHOO.ext.QuickTips = function(){
+    var el, tipBody, tipTitle, tm, cfg, close, tagEls = {}, reader, esc, anim, removeCls = null;
+    var ce, bd, xy;
+    var visible = false, disabled = true, inited = false;
+    var showProc = hideProc = dismissProc = 1, locks = [];
+    var E = YAHOO.util.Event, dd;
+    
+    var onOver = function(e){
+        if(disabled){
+            return;
+        }
+        var t = E.getTarget(e);
+        if(!t){
+            return;
+        }
+        if(ce && t == ce.el){
+            clearTimeout(hideProc);
+            return;
+        }
+        if(t && tagEls[t.id]){
+            tagEls[t.id].el = t;
+            showProc = show.defer(tm.showDelay, tm, [tagEls[t.id]]);
+            return;
+        }
+        var ttp = reader.getAttribute(t, cfg.attribute);
+        if(!ttp && tm.interceptTitles && t.title){
+            ttp = t.title;
+            t.title = '';
+            if(reader.useNS){
+                t.setAttributeNS('y', 'qtip', ttp);
+            }else{
+                t.setAttribute('qtip', ttp);
+            }
+        }
+        if(ttp){
+            xy = E.getXY(e);
+            xy[0] += 12; xy[1] += 20;
+            showProc = show.defer(tm.showDelay, tm, [{
+                el: t, 
+                text: ttp, 
+                width: reader.getAttribute(t, cfg.width),
+                autoHide: reader.getAttribute(t, cfg.hide) != 'user',
+                title: reader.getAttribute(t, cfg.title),
+           	    cls: reader.getAttribute(t, cfg.cls)
+            }]);
+        }
+    };
+    
+    var onOut = function(e){
+        clearTimeout(showProc);
+        var t = E.getTarget(e);
+        if(t && ce && ce.el == t && (tm.autoHide && ce.autoHide !== false)){
+            hideProc = setTimeout(hide, tm.hideDelay);
+        }
+    };
+    
+    var onMove = function(e){
+        if(disabled){
+            return;
+        }
+        xy = E.getXY(e);
+        xy[0] += 12; xy[1] += 20;
+        if(tm.trackMouse && ce){
+            el.setXY(xy);
+        }
+    };
+    
+    var onDown = function(e){
+        clearTimeout(showProc);
+        clearTimeout(hideProc);
+        if(!e.within(el)){
+            if(tm.hideOnClick && ce && ce.autoHide !== false){
+                hide();
+                tm.disable();
+            }
+        }
+    };
+    
+    var onUp = function(e){
+        tm.enable();
+    }
+    
+    var show = function(o){
+        if(disabled){
+            return;
+        }
+        clearTimeout(dismissProc);
+        stopAnim();
+        ce = o;
+        if(removeCls){ // in case manually hidden
+            el.removeClass(removeCls);
+            removeCls = null;
+        }
+        if(ce.cls){
+            el.addClass(ce.cls);
+            removeCls = ce.cls;
+        }
+        if(ce.title){
+            tipTitleText.update(ce.title);
+            tipTitle.show();
+        }else{
+            tipTitle.hide();
+        }
+        tipBody.update(o.text);
+        if(!ce.width){
+            if(tipBody.dom.style.width){
+               tipBody.dom.style.width  = '';
+            }
+            if(tipBody.dom.offsetWidth > tm.maxWidth){
+                tipBody.setWidth(tm.maxWidth);
+            }
+        }else{
+            tipBody.setWidth(ce.width);
+        }
+        if(!ce.autoHide){
+            close.setDisplayed(true);
+            if(dd){
+                dd.unlock();
+            }
+        }else{
+            close.setDisplayed(false);
+            if(dd){
+                dd.lock();
+            }
+        }
+        if(xy){
+            el.setXY(xy);
+        }
+        if(tm.animate){
+            anim.attributes = {opacity:{to:1}};
+            el.setOpacity(.1);
+            el.setStyle('visibility', 'visible');
+            anim.animateX(afterShow);
+        }else{
+            afterShow();
+        }
+    };
+    
+    var afterShow = function(){
+        if(ce){
+            el.show();
+            esc.enable();
+            if(tm.autoDismiss && ce.autoHide !== false){
+                dismissProc = setTimeout(hide, tm.autoDismissDelay);
+            }
+        }
+    }
+    
+    var hide = function(noanim){
+        clearTimeout(dismissProc);
+        clearTimeout(hideProc);
+        ce = null;
+        if(el.isVisible()){
+            esc.disable();
+            stopAnim();
+            if(noanim !== true && tm.animate){
+                anim.attributes = {opacity:{to:.1}};
+                el.beforeAction();
+                anim.animateX(afterHide);
+            }else{
+                afterHide();
+            } 
+        }
+    };
+    
+    var afterHide = function(){
+        el.hide();
+        if(removeCls){
+            el.removeClass(removeCls);
+            removeCls = null;
+        }
+    }
+    
+    var stopAnim = function(){
+        if(anim && anim.isAnimated()){
+            anim.stop();
+        }
+    }
+    
+    return {
+       init : function(){
+          if(YAHOO.ext.util.Browser.isIE && !YAHOO.ext.util.Browser.isIE7){
+              return;
+          }
+          tm = YAHOO.ext.QuickTips;
+          cfg = tm.tagConfig;
+          reader = new YAHOO.ext.CustomTagReader(cfg.namespace);
+          if(!inited){
+              el = new YAHOO.ext.Layer({cls:'ytip', shadow:true, useDisplay: false});
+              el.update('<div class="ytip-hd-left"><div class="ytip-hd-right"><div class="ytip-hd"></div></div></div>');
+              tipTitle = getEl(el.dom.firstChild);
+              tipTitleText = getEl(el.dom.firstChild.firstChild.firstChild);
+              tipTitle.enableDisplayMode('block');
+              tipBody = el.createChild({tag:'div', cls:'ytip-bd'});
+              close = el.createChild({tag:'div', cls:'ytip-close'});
+              close.on('click', hide);
+              d = getEl(document);
+              d.mon('mousedown', onDown);
+              d.on('mouseup', onUp);
+              d.on('mouseover', onOver);
+              d.on('mouseout', onOut);
+              d.on('mousemove', onMove);
+              esc = d.addKeyListener(27, hide);
+              esc.disable();
+              if(tm.animate){
+                  anim = new YAHOO.util.Anim(el.dom, {}, .1);
+              }
+              if(YAHOO.util.DD){
+                  dd = el.initDD('default', null, {
+                      onDrag : function(){
+                          el.sync();  
+                      }
+                  });
+                  dd.setHandleElId(tipTitleText.id);
+                  dd.lock();
+              }
+              inited = true;
+          }
+          this.scan(document.body);
+          this.enable(); 
+       },
+       
+       tips : function(config){
+           var cs = config instanceof Array ? config : arguments;
+           for(var i = 0, len = cs.length; i < len; i++) {
+               var c = cs[i];
+               var target = c.target;
+               if(target){
+                   if(target instanceof Array){
+                       for(var j = 0, jlen = target.length; j < jlen; j++){
+                           tagEls[target[j]] = c;
+                       }
+                   }else{
+                       tagEls[target] = c;
+                   }               	   
+               }
+           }
+       },
+       
+       enable : function(){
+           if(inited){
+               locks.pop();
+               if(locks.length < 1){
+                   disabled = false;
+               }
+           }
+       },
+       
+       disable : function(){
+          disabled = true;
+          clearTimeout(showProc);
+          clearTimeout(hideProc);
+          clearTimeout(dismissProc);
+          if(ce){
+              hide(true);
+          }
+          locks.push(1);
+       },
+       
+       scan : function(toScan){
+           toScan = toScan.dom ? toScan.dom : YAHOO.util.Dom.get(toScan);
+           var found = [];
+           reader.eachElement(cfg.tag, toScan, function(el){
+               var t = reader.getAttribute(el, cfg.target);
+           	   if(t){
+           	       found.push({
+           	          target: t.indexOf(',') != -1 ? t.split(',') : t, 
+                      text: el.innerHTML,
+                      autoHide: reader.getAttribute(el, cfg.hide) != 'user',
+                      width: reader.getAttribute(el, cfg.width),
+           	          title: reader.getAttribute(el, cfg.title),
+           	          cls: reader.getAttribute(el, cfg.cls)
+           	       });
+           	   }
+           	   el.parentNode.removeChild(el);
+           });
+           this.tips(found);
+       },
+       
+       tagConfig : { 
+           namespace : 'y',
+           tag : 'qtip',
+           attribute : 'qtip',
+           width : 'width',
+           target : 'target',
+           title : 'qtitle',
+           hide : 'hide',
+           cls : 'qclass'
+       },
+       
+       maxWidth : 300,
+       interceptTitles : true,
+       trackMouse : false,
+       hideOnClick : true,
+       showDelay : 500,
+       hideDelay : 200,
+       autoHide : true,
+       autoDismiss : true,
+       autoDismissDelay : 5000,
+       /**
+        * True to turn on fade animation. Defaults to true 
+        * except in IE7 (ClearType/scrollbar flicker issues in IE7 with filters).
+        * @type Boolean
+        */
+       animate : YAHOO.util.Anim && !YAHOO.ext.util.Browser.isIE7 
+   } 
+}();
diff --git a/frontend/beta/js/YUI-extensions/widgets/Resizable.js b/frontend/beta/js/YUI-extensions/widgets/Resizable.js
new file mode 100644
index 0000000..6944683
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/Resizable.js
@@ -0,0 +1,586 @@
+/**
+ * @class YAHOO.ext.Resizable
+ * @extends YAHOO.ext.util.Observable
+ * <p>Applies drag handles to an element to make it resizable. The drag handles are inserted into the element 
+ * and positioned absolute. Some elements, such as a textarea or image, don't support this. To overcome that, you can wrap
+ * the textarea in a div and set "resizeChild" to true (or the id of the textarea), <b>or</b> set wrap:true in your config and
+ * the element will be wrapped for you automatically.</p><br/>
+ * Here's a Resizable with every possible config option and it's default value:
+<pre><code>
+var resizer = new YAHOO.ext.Resizable('element-id', {
+    resizeChild : false,
+    adjustments : [0, 0],
+    minWidth : 5,
+    minHeight : 5,
+    maxWidth : 10000,
+    maxHeight : 10000,
+    enabled : true,
+    wrap: false, // true to wrap the element
+    width: null, // initial size
+    height: null, // initial size
+    animate : false,
+    duration : .35,
+    dynamic : false,
+    handles : false,
+    multiDirectional : false,
+    disableTrackOver : false,
+    easing : YAHOO.util.Easing ? YAHOO.util.Easing.easeOutStrong : null,
+    widthIncrement : 0,
+    heightIncrement : 0,
+    pinned : false,
+    width : null,
+    height : null,
+    preserveRatio : false,
+    transparent: false,
+    minX: 0,
+    minY: 0,
+    draggable: false
+});
+resizer.on('resize', myHandler);
+</code></pre>
+* <p>
+ * To hide a particular handle, set it's display to none in CSS, or through script:<br>
+ * resizer.east.setDisplayed(false);
+ * </p>
+ * @constructor
+ * Create a new resizable component
+ * @param {String/HTMLElement/YAHOO.ext.Element} el The id or element to resize
+ * @param {Object} config configuration options
+  */
+YAHOO.ext.Resizable = function(el, config){
+    this.el = getEl(el);
+    
+    if(config && config.wrap){
+        config.resizeChild = this.el;
+        this.el = this.el.wrap(typeof config.wrap == 'object' ? config.wrap : null);
+        this.el.id = this.el.dom.id = config.resizeChild.id + '-rzwrap';
+        this.el.setStyle('overflow', 'hidden');
+        this.el.setPositioning(config.resizeChild.getPositioning());
+        config.resizeChild.clearPositioning();
+        if(!config.width || !config.height){
+            var csize = config.resizeChild.getSize();
+            //csize.width -= config.adjustments[0];
+            //csize.height -= config.adjustments[1];
+            this.el.setSize(csize.width, csize.height);
+        }
+        if(config.pinned && !config.adjustments){
+            config.adjustments = 'auto';
+        }
+    }
+    
+    this.proxy = this.el.createProxy({tag: 'div', cls: 'yresizable-proxy', id: this.el.id + '-rzproxy'})
+    this.proxy.unselectable();
+    
+    // the overlay traps mouse events while dragging and fixes iframe issue
+    this.overlay = this.el.createProxy({tag: 'div', cls: 'yresizable-overlay', html: '&#160;'});
+    this.overlay.unselectable();
+    this.overlay.enableDisplayMode('block');
+    this.overlay.mon('mousemove', this.onMouseMove, this, true);
+    this.overlay.mon('mouseup', this.onMouseUp, this, true);
+    
+    YAHOO.ext.util.Config.apply(this, config, {
+        /** True to resizeSize the first child or id/element to resize @type YAHOO.ext.Element */
+        resizeChild : false,
+        /** String "auto" or an array [width, height] with values to be <b>added</b> to the resize operation's new size. @type Array/String */
+        adjustments : [0, 0],
+        /** The minimum width for the element @type Number */
+        minWidth : 5,
+        /** The minimum height for the element @type Number */
+        minHeight : 5,
+        /** The maximum width for the element @type Number */
+        maxWidth : 10000,
+        /** The maximum height for the element @type Number */
+        maxHeight : 10000,
+        /** false to disable resizing @type Boolean */
+        enabled : true,
+        /** True to animate the resize (not compatible with dynamic sizing) @type Boolean */
+        animate : false,
+        /** Animation duration @type Float */
+        duration : .35,
+        /** True to resize the element while dragging instead of using a proxy @type Boolean */
+        dynamic : false,
+        // these 3 are only available at config time
+        /** String consisting of the resize handles to display. Valid handles are 
+         * n (north), s (south) e (east), w (west), ne (northeast), nw (northwest), se (southeast), sw (southwest) 
+         * and all (which applies them all). If this is blank it defaults to "e,s,se". Handles can be delimited using
+         * a space, comma or semi-colon. This is only applied at config time.  @type String*/
+        handles : false,
+        multiDirectional : false,
+        /** true to disable mouse tracking. This is only applied at config time.  @type Boolean*/
+        disableTrackOver : false,
+        /** Animation easing @type YAHOO.util.Easing */
+        easing : YAHOO.util.Easing ? YAHOO.util.Easing.easeOutStrong : null,
+        /** The increment to snap the width resize in pixels (dynamic must be true) @type Number */
+        widthIncrement : 0,
+        /** The increment to snap the height resize in pixels (dynamic must be true) @type Number */
+        heightIncrement : 0,
+        /** true to pin the resize handles. This is only applied at config time.  @type Boolean*/
+        pinned : false,
+        /** The initial width for the element @type Number */
+        width : null,
+        /** The initial height for the element @type Number */
+        height : null,
+        /** true to preserve the initial size ratio.  @type Boolean*/
+        preserveRatio : false,
+        /** true for transparent handles. This is only applied at config time.  @type Boolean*/
+        transparent: false,
+        /** The minimum allowed page X for the element (only used for west resizing, defaults to 0) @type Number */
+        minX: 0,
+        /** The minimum allowed page Y for the element (only used for north resizing, defaults to 0) @type Number */
+        minY: 0,
+        /** convenience to initialize drag drop.  @type Boolean*/
+        draggable: false
+    });
+    
+    if(this.pinned){
+        this.disableTrackOver = true;
+        this.el.addClass('yresizable-pinned');    
+    }
+    // if the element isn't positioned, make it relative
+    var position = this.el.getStyle('position');
+    if(position != 'absolute' && position != 'fixed'){
+        this.el.setStyle('position', 'relative');
+    }
+    if(!this.handles){ // no handles passed, must be legacy style
+        this.handles = 's,e,se';
+        if(this.multiDirectional){
+            this.handles += ',n,w';
+        }
+    }
+    if(this.handles == 'all'){
+        this.handles = 'n s e w ne nw se sw';
+    }
+    var hs = this.handles.split(/\s*?[,;]\s*?| /);
+    var ps = YAHOO.ext.Resizable.positions;
+    for(var i = 0, len = hs.length; i < len; i++){
+        if(hs[i] && ps[hs[i]]){
+            var pos = ps[hs[i]];
+            this[pos] = new YAHOO.ext.Resizable.Handle(this, pos, this.disableTrackOver, this.transparent);
+        }
+    }
+    // legacy
+    this.corner = this.southeast;
+    
+    this.activeHandle = null;
+    
+    if(this.resizeChild){
+        if(typeof this.resizeChild == 'boolean'){
+            this.resizeChild = YAHOO.ext.Element.get(this.el.dom.firstChild, true);
+        }else{
+            this.resizeChild = YAHOO.ext.Element.get(this.resizeChild, true);
+        }
+    }
+    
+    if(this.adjustments == 'auto'){
+        var rc = this.resizeChild;
+        var hw = this.west, he = this.east, hn = this.north, hs = this.south;
+        if(rc && (hw || hn)){
+            rc.setRelativePositioned();
+            rc.setLeft(hw ? hw.el.getWidth() : 0);
+            rc.setTop(hn ? hn.el.getHeight() : 0);
+        }
+        this.adjustments = [
+            (he ? -he.el.getWidth() : 0) + (hw ? -hw.el.getWidth() : 0),
+            (hn ? -hn.el.getHeight() : 0) + (hs ? -hs.el.getHeight() : 0) -1 
+        ];
+    }
+    
+    if(this.draggable){
+        this.dd = this.dynamic ? 
+            this.el.initDD(null) : this.el.initDDProxy(null, {dragElId: this.proxy.id});
+        this.dd.setHandleElId(this.resizeChild ? this.resizeChild.id : this.el.id);
+    }
+    
+    // public events
+    this.events = {
+        /**
+         * @event beforeresize
+         * Fired before resize is allowed. Set enabled to false to cancel resize. 
+         * @param {YAHOO.ext.Resizable} this
+         * @param {YAHOO.ext.EventObject} e The mousedown event
+         */
+        'beforeresize' : new YAHOO.util.CustomEvent(),
+        /**
+         * @event resize
+         * Fired after a resize. 
+         * @param {YAHOO.ext.Resizable} this
+         * @param {Number} width The new width
+         * @param {Number} height The new height
+         * @param {YAHOO.ext.EventObject} e The mouseup event
+         */
+        'resize' : new YAHOO.util.CustomEvent()
+    };
+    
+    if(this.width !== null && this.height !== null){
+        this.resizeTo(this.width, this.height);
+    }else{
+        this.updateChildSize();
+    }
+};
+
+YAHOO.extendX(YAHOO.ext.Resizable, YAHOO.ext.util.Observable, {
+    /**
+     * Perform a manual resize
+     * @param {Number} width
+     * @param {Number} height
+     */
+    resizeTo : function(width, height){
+        this.el.setSize(width, height);
+        this.updateChildSize();
+        this.fireEvent('resize', this, width, height, null);
+    },
+    
+    startSizing : function(e){
+        this.fireEvent('beforeresize', this, e);
+        if(this.enabled){ // 2nd enabled check in case disabled before beforeresize handler
+            this.resizing = true;
+            this.startBox = this.el.getBox();
+            this.startPoint = e.getXY();
+            this.offsets = [(this.startBox.x + this.startBox.width) - this.startPoint[0],
+                            (this.startBox.y + this.startBox.height) - this.startPoint[1]];
+            this.proxy.setBox(this.startBox);
+            
+            this.overlay.setSize(YAHOO.util.Dom.getDocumentWidth(), YAHOO.util.Dom.getDocumentHeight());
+            this.overlay.show();
+            
+            if(!this.dynamic){
+                this.proxy.show();
+            }
+        }
+    },
+    
+    onMouseDown : function(handle, e){
+        if(this.enabled){
+            e.stopEvent();
+            this.activeHandle = handle;
+            this.overlay.setStyle('cursor', handle.el.getStyle('cursor'));
+            this.startSizing(e);
+        }          
+    },
+    
+    onMouseUp : function(e){
+        var size = this.resizeElement();
+        this.resizing = false;
+        this.handleOut();
+        this.overlay.hide();
+        this.fireEvent('resize', this, size.width, size.height, e);
+    },
+    
+    updateChildSize : function(){
+        if(this.resizeChild){
+            var el = this.el;
+            var child = this.resizeChild;
+            var adj = this.adjustments;
+            if(el.dom.offsetWidth){
+                var b = el.getSize(true);
+                child.setSize(b.width+adj[0], b.height+adj[1]);
+            }
+            // Second call here for IE
+            // The first call enables instant resizing and
+            // the second call corrects scroll bars if they
+            // exist
+            if(YAHOO.ext.util.Browser.isIE){
+                setTimeout(function(){
+                    if(el.dom.offsetWidth){
+                        var b = el.getSize(true);
+                        child.setSize(b.width+adj[0], b.height+adj[1]);
+                    }
+                }, 10);
+            }
+        }
+    },
+    
+    snap : function(value, inc, min){
+        if(!inc || !value) return value;
+        var newValue = value;
+        var m = value % inc;
+        if(m > 0){
+            if(m > (inc/2)){
+                newValue = value + (inc-m);
+            }else{
+                newValue = value - m;
+            }
+        }
+        return Math.max(min, newValue);
+    },
+    
+    resizeElement : function(){
+        var box = this.proxy.getBox();
+        //box.width = this.snap(box.width, this.widthIncrement);
+        //box.height = this.snap(box.height, this.heightIncrement);
+        //if(this.multiDirectional){
+            this.el.setBox(box, false, this.animate, this.duration, null, this.easing);
+        //}else{
+        //    this.el.setSize(box.width, box.height, this.animate, this.duration, null, this.easing);
+        //}
+        this.updateChildSize();
+        this.proxy.hide();
+        return box;
+    },
+    
+    constrain : function(v, diff, m, mx){
+        if(v - diff < m){
+            diff = v - m;    
+        }else if(v - diff > mx){
+            diff = mx - v; 
+        }
+        return diff;                
+    },
+    
+    onMouseMove : function(e){
+        if(this.enabled){
+            try{// try catch so if something goes wrong the user doesn't get hung
+            
+            //var curXY = this.startPoint;
+            var curSize = this.curSize || this.startBox;
+            var x = this.startBox.x, y = this.startBox.y;
+            var ox = x, oy = y;
+            var w = curSize.width, h = curSize.height;
+            var ow = w, oh = h;
+            var mw = this.minWidth, mh = this.minHeight;
+            var mxw = this.maxWidth, mxh = this.maxHeight;
+            var wi = this.widthIncrement;
+            var hi = this.heightIncrement;
+            
+            var eventXY = e.getXY();
+            var diffX = -(this.startPoint[0] - Math.max(this.minX, eventXY[0]));
+            var diffY = -(this.startPoint[1] - Math.max(this.minY, eventXY[1]));
+            
+            var pos = this.activeHandle.position;
+            
+            switch(pos){
+                case 'east':
+                    w += diffX; 
+                    w = Math.min(Math.max(mw, w), mxw);
+                    break;
+                case 'south':
+                    h += diffY;
+                    h = Math.min(Math.max(mh, h), mxh);
+                    break;
+                case 'southeast':
+                    w += diffX; 
+                    h += diffY;
+                    w = Math.min(Math.max(mw, w), mxw);
+                    h = Math.min(Math.max(mh, h), mxh);
+                    break;
+                case 'north':
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    break;
+                case 'west':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    x += diffX;
+                    w -= diffX;
+                    break;
+                case 'northeast':
+                    w += diffX; 
+                    w = Math.min(Math.max(mw, w), mxw);
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    break;
+                case 'northwest':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    diffY = this.constrain(h, diffY, mh, mxh);
+                    y += diffY;
+                    h -= diffY;
+                    x += diffX;
+                    w -= diffX;
+                    break;
+               case 'southwest':
+                    diffX = this.constrain(w, diffX, mw, mxw);
+                    h += diffY;
+                    h = Math.min(Math.max(mh, h), mxh);
+                    x += diffX;
+                    w -= diffX;
+                    break;
+            }
+            
+            var sw = this.snap(w, wi, mw);
+            var sh = this.snap(h, hi, mh);
+            if(sw != w || sh != h){
+                switch(pos){
+                    case 'northeast':
+                        y -= sh - h;
+                    break;
+                    case 'north':
+                        y -= sh - h;
+                        break;
+                    case 'southwest':
+                        x -= sw - w;
+                    break;
+                    case 'west':
+                        x -= sw - w;
+                        break;
+                    case 'northwest':
+                        x -= sw - w;
+                        y -= sh - h;
+                    break;
+                }
+                w = sw;
+                h = sh;
+            }
+            
+            if(this.preserveRatio){
+                switch(pos){
+                    case 'southeast':
+                    case 'east':
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        w = ow * (h/oh);
+                       break;
+                    case 'south':
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                        break;
+                    case 'northeast':
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                    break;
+                    case 'north':
+                        var tw = w;
+                        w = ow * (h/oh);
+                        w = Math.min(Math.max(mw, w), mxw);
+                        h = oh * (w/ow);
+                        x += (tw - w) / 2;
+                        break;
+                    case 'southwest':
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        var tw = w;
+                        w = ow * (h/oh);
+                        x += tw - w;
+                        break;
+                    case 'west':
+                        var th = h;
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        y += (th - h) / 2;
+                        var tw = w;
+                        w = ow * (h/oh);
+                        x += tw - w;
+                       break;
+                    case 'northwest':
+                        var tw = w;
+                        var th = h;
+                        h = oh * (w/ow);
+                        h = Math.min(Math.max(mh, h), mxh);
+                        w = ow * (h/oh);
+                        y += th - h;
+                         x += tw - w;
+                       break;
+                        
+                }
+            }
+            this.proxy.setBounds(x, y, w, h);
+            if(this.dynamic){
+                this.resizeElement();
+            }
+            }catch(e){}
+        }
+    },
+    
+    handleOver : function(){
+        if(this.enabled){
+            this.el.addClass('yresizable-over');
+        }
+    },
+    
+    handleOut : function(){
+        if(!this.resizing){
+            this.el.removeClass('yresizable-over');
+        }
+    },
+    
+    /**
+     * Returns the element this component is bound to.
+     * @return {YAHOO.ext.Element}
+     */
+    getEl : function(){
+        return this.el;
+    },
+    
+    /**
+     * Returns the resizeChild element (or null).
+     * @return {YAHOO.ext.Element}
+     */
+    getResizeChild : function(){
+        return this.resizeChild;
+    },
+    
+    /**
+     * Destroys this resizable. If the element was wrapped and 
+     * removeEl is not true then the wrap remains.
+     * @param {Boolean} removeEl (optional) true to remove the element from the DOM
+     */
+    destroy : function(removeEl){
+        this.proxy.remove();
+        this.overlay.removeAllListeners();
+        this.overlay.remove();
+        var ps = YAHOO.ext.Resizable.positions;
+        for(var k in ps){
+            if(typeof ps[k] != 'function' && this[ps[k]]){
+                var h = this[ps[k]];
+                h.el.removeAllListeners();
+                h.el.remove();
+            }
+        }
+        if(removeEl){
+            this.el.update('');
+            this.el.remove();
+        }
+    }
+});
+
+// hash to map config positions to true positions
+YAHOO.ext.Resizable.positions = {
+    n: 'north', s: 'south', e: 'east', w: 'west', se: 'southeast', sw: 'southwest', nw: 'northwest', ne: 'northeast' 
+};
+
+
+YAHOO.ext.Resizable.Handle = function(rz, pos, disableTrackOver, transparent){
+    if(!this.tpl){
+        // only initialize the template if resizable is used
+        var tpl = YAHOO.ext.DomHelper.createTemplate(
+            {tag: 'div', cls: 'yresizable-handle yresizable-handle-{0}', html: '&#160;'}
+        );
+        tpl.compile();
+        YAHOO.ext.Resizable.Handle.prototype.tpl = tpl;
+    }
+    this.position = pos;
+    this.rz = rz;
+    this.el = this.tpl.append(rz.el.dom, [this.position], true);
+    this.el.unselectable();
+    if(transparent){
+        this.el.setOpacity(0);
+    }
+    this.el.mon('mousedown', this.onMouseDown, this, true);
+    if(!disableTrackOver){
+        this.el.mon('mouseover', this.onMouseOver, this, true);
+        this.el.mon('mouseout', this.onMouseOut, this, true);
+    }
+};
+
+YAHOO.ext.Resizable.Handle.prototype = {
+    afterResize : function(rz){
+        // do nothing    
+    },
+    
+    onMouseDown : function(e){
+        this.rz.onMouseDown(this, e);
+    },
+    
+    onMouseOver : function(e){
+        this.rz.handleOver(this, e);
+    },
+    
+    onMouseOut : function(e){
+        this.rz.handleOut(this, e);
+    }  
+};
+
+
+
diff --git a/frontend/beta/js/YUI-extensions/widgets/SplitBar.js b/frontend/beta/js/YUI-extensions/widgets/SplitBar.js
new file mode 100644
index 0000000..855d138
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/SplitBar.js
@@ -0,0 +1,468 @@
+/*
+ * splitbar.js, version .7
+ * Copyright(c) 2006, Jack Slocum.
+ * Code licensed under the BSD License
+ */
+if(YAHOO.util.DragDropMgr){
+  YAHOO.util.DragDropMgr.clickTimeThresh = 350;
+}
+/**
+ * @class YAHOO.ext.SplitBar
+ * @extends YAHOO.ext.util.Observable
+ * Creates draggable splitter bar functionality from two elements.
+ * <br><br>
+ * Usage:
+ * <pre><code>
+var split = new YAHOO.ext.SplitBar('elementToDrag', 'elementToSize', 
+                   YAHOO.ext.SplitBar.HORIZONTAL, YAHOO.ext.SplitBar.LEFT);
+split.setAdapter(new YAHOO.ext.SplitBar.AbsoluteLayoutAdapter("container"));
+split.minSize = 100;
+split.maxSize = 600;
+split.animate = true;
+split.onMoved.subscribe(splitterMoved);
+</code></pre>
+ * @requires YAHOO.ext.Element
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @requires YAHOO.util.CustomEvent 
+ * @requires YAHOO.util.DDProxy
+ * @requires YAHOO.util.Anim (optional) to support animation
+ * @requires YAHOO.util.Easing (optional) to support animation
+ * @constructor
+ * Create a new SplitBar
+ * @param {String/HTMLElement/Element} dragElement The element to be dragged and act as the SplitBar. 
+ * @param {String/HTMLElement/Element} resizingElement The element to be resized based on where the SplitBar element is dragged 
+ * @param {Number} orientation (optional) Either YAHOO.ext.SplitBar.HORIZONTAL or YAHOO.ext.SplitBar.VERTICAL. (Defaults to HORIZONTAL)
+ * @param {Number} placement (optional) Either YAHOO.ext.SplitBar.LEFT or YAHOO.ext.SplitBar.RIGHT for horizontal or  
+                        YAHOO.ext.SplitBar.TOP or YAHOO.ext.SplitBar.BOTTOM for vertical. (By default, this is determined automatically by the intial position 
+                        position of the SplitBar).
+ */
+YAHOO.ext.SplitBar = function(dragElement, resizingElement, orientation, placement, existingProxy){
+    
+    /** @private */
+    this.el = YAHOO.ext.Element.get(dragElement, true);
+    this.el.dom.unselectable = 'on';
+    /** @private */
+    this.resizingEl = YAHOO.ext.Element.get(resizingElement, true);
+    
+    /**
+     * @private
+     * The orientation of the split. Either YAHOO.ext.SplitBar.HORIZONTAL or YAHOO.ext.SplitBar.VERTICAL. (Defaults to HORIZONTAL)
+     * Note: If this is changed after creating the SplitBar, the placement property must be manually updated
+     * @type Number
+     */
+    this.orientation = orientation || YAHOO.ext.SplitBar.HORIZONTAL;
+    
+    /**
+     * The minimum size of the resizing element. (Defaults to 0)
+     * @type Number
+     */
+    this.minSize = 0;
+    
+    /**
+     * The maximum size of the resizing element. (Defaults to 2000)
+     * @type Number
+     */
+    this.maxSize = 2000;
+    
+    this.onMoved = new YAHOO.util.CustomEvent("SplitBarMoved", this);
+    
+    /**
+     * Whether to animate the transition to the new size
+     * @type Boolean
+     */
+    this.animate = false;
+    
+    /**
+     * Whether to create a transparent shim that overlays the page when dragging, enables dragging across iframes.
+     * @type Boolean
+     */
+    this.useShim = false;
+    
+    /** @private */
+    this.shim = null;
+    
+    if(!existingProxy){
+        /** @private */
+        this.proxy = YAHOO.ext.SplitBar.createProxy(this.orientation);
+    }else{
+        this.proxy = getEl(existingProxy).dom;
+    }
+    /** @private */
+    this.dd = new YAHOO.util.DDProxy(this.el.dom.id, "SplitBars", {dragElId : this.proxy.id});
+    
+    /** @private */
+    this.dd.b4StartDrag = this.onStartProxyDrag.createDelegate(this);
+    
+    /** @private */
+    this.dd.endDrag = this.onEndProxyDrag.createDelegate(this);
+    
+    /** @private */
+    this.dragSpecs = {};
+    
+    /**
+     * @private The adapter to use to positon and resize elements
+     */
+    this.adapter = new YAHOO.ext.SplitBar.BasicLayoutAdapter();
+    this.adapter.init(this);
+    
+    if(this.orientation == YAHOO.ext.SplitBar.HORIZONTAL){
+        /** @private */
+        this.placement = placement || (this.el.getX() > this.resizingEl.getX() ? YAHOO.ext.SplitBar.LEFT : YAHOO.ext.SplitBar.RIGHT);
+        this.el.setStyle('cursor', 'e-resize');
+    }else{
+        /** @private */
+        this.placement = placement || (this.el.getY() > this.resizingEl.getY() ? YAHOO.ext.SplitBar.TOP : YAHOO.ext.SplitBar.BOTTOM);
+        this.el.setStyle('cursor', 'n-resize');
+    }
+    
+    this.events = {
+        /**
+         * @event resize
+         * Fires when the splitter is moved (alias for moved)
+         * @param {YAHOO.ext.SplitBar} this
+         * @param {Number} newSize the new width or height
+         */
+        'resize' : this.onMoved,
+        /**
+         * @event moved
+         * Fires when the splitter is moved
+         * @param {YAHOO.ext.SplitBar} this
+         * @param {Number} newSize the new width or height
+         */
+        'moved' : this.onMoved,
+        /**
+         * @event beforeresize
+         * Fires before the splitter is dragged
+         * @param {YAHOO.ext.SplitBar} this
+         */
+        'beforeresize' : new YAHOO.util.CustomEvent('beforeresize')
+    }
+}
+
+YAHOO.extendX(YAHOO.ext.SplitBar, YAHOO.ext.util.Observable, {
+    onStartProxyDrag : function(x, y){
+        this.fireEvent('beforeresize', this);
+        if(this.useShim){
+            if(!this.shim){
+                this.shim = YAHOO.ext.SplitBar.createShim();
+            }
+            this.shim.setVisible(true);
+        }
+        YAHOO.util.Dom.setStyle(this.proxy, 'display', 'block');
+        var size = this.adapter.getElementSize(this);
+        this.activeMinSize = this.getMinimumSize();;
+        this.activeMaxSize = this.getMaximumSize();;
+        var c1 = size - this.activeMinSize;
+        var c2 = Math.max(this.activeMaxSize - size, 0);
+        if(this.orientation == YAHOO.ext.SplitBar.HORIZONTAL){
+            this.dd.resetConstraints();
+            this.dd.setXConstraint(
+                this.placement == YAHOO.ext.SplitBar.LEFT ? c1 : c2, 
+                this.placement == YAHOO.ext.SplitBar.LEFT ? c2 : c1
+            );
+            this.dd.setYConstraint(0, 0);
+        }else{
+            this.dd.resetConstraints();
+            this.dd.setXConstraint(0, 0);
+            this.dd.setYConstraint(
+                this.placement == YAHOO.ext.SplitBar.TOP ? c1 : c2, 
+                this.placement == YAHOO.ext.SplitBar.TOP ? c2 : c1
+            );
+         }
+        this.dragSpecs.startSize = size;
+        this.dragSpecs.startPoint = [x, y];
+        
+        YAHOO.util.DDProxy.prototype.b4StartDrag.call(this.dd, x, y);
+    },
+    
+    /** 
+     * @private Called after the drag operation by the DDProxy
+     */
+    onEndProxyDrag : function(e){
+        YAHOO.util.Dom.setStyle(this.proxy, 'display', 'none');
+        var endPoint = YAHOO.util.Event.getXY(e);
+        if(this.useShim){
+            this.shim.setVisible(false);
+        }
+        var newSize;
+        if(this.orientation == YAHOO.ext.SplitBar.HORIZONTAL){
+            newSize = this.dragSpecs.startSize + 
+                (this.placement == YAHOO.ext.SplitBar.LEFT ?
+                    endPoint[0] - this.dragSpecs.startPoint[0] :
+                    this.dragSpecs.startPoint[0] - endPoint[0]
+                );
+        }else{
+            newSize = this.dragSpecs.startSize + 
+                (this.placement == YAHOO.ext.SplitBar.TOP ?
+                    endPoint[1] - this.dragSpecs.startPoint[1] :
+                    this.dragSpecs.startPoint[1] - endPoint[1]
+                );
+        }
+        newSize = Math.min(Math.max(newSize, this.activeMinSize), this.activeMaxSize);
+        if(newSize != this.dragSpecs.startSize){
+            this.adapter.setElementSize(this, newSize);
+            this.onMoved.fireDirect(this, newSize);
+        }
+    },
+    
+    /**
+     * Get the adapter this SplitBar uses
+     * @return The adapter object
+     */
+    getAdapter : function(){
+        return this.adapter;
+    },
+    
+    /**
+     * Set the adapter this SplitBar uses
+     * @param {Object} adapter A SplitBar adapter object
+     */
+    setAdapter : function(adapter){
+        this.adapter = adapter;
+        this.adapter.init(this);
+    },
+    
+    /**
+     * Gets the minimum size for the resizing element
+     * @return {Number} The minimum size
+     */
+    getMinimumSize : function(){
+        return this.minSize;
+    },
+    
+    /**
+     * Sets the minimum size for the resizing element
+     * @param {Number} minSize The minimum size
+     */
+    setMinimumSize : function(minSize){
+        this.minSize = minSize;
+    },
+    
+    /**
+     * Gets the maximum size for the resizing element
+     * @return {Number} The maximum size
+     */
+    getMaximumSize : function(){
+        return this.maxSize;
+    },
+    
+    /**
+     * Sets the maximum size for the resizing element
+     * @param {Number} maxSize The maximum size
+     */
+    setMaximumSize : function(maxSize){
+        this.maxSize = maxSize;
+    },
+    
+    /**
+     * Sets the initialize size for the resizing element
+     * @param {Number} size The initial size
+     */
+    setCurrentSize : function(size){
+        var oldAnimate = this.animate;
+        this.animate = false;
+        this.adapter.setElementSize(this, size);
+        this.animate = oldAnimate;
+    },
+    
+    /**
+     * Destroy this splitbar. 
+     * @param {Boolean} removeEl True to remove the element
+     */
+    destroy : function(removeEl){
+        if(this.shim){
+            this.shim.remove();
+        }
+        this.dd.unreg();
+        this.proxy.parentNode.removeChild(this.proxy);
+        if(removeEl){
+            this.el.remove();
+        }
+    }
+});
+
+/**
+ * @private static Create the shim to drag over iframes
+ */
+YAHOO.ext.SplitBar.createShim = function(){
+    var shim = document.createElement('div');
+    shim.unselectable = 'on';
+    YAHOO.util.Dom.generateId(shim, 'split-shim');
+    YAHOO.util.Dom.setStyle(shim, 'width', '100%');
+    YAHOO.util.Dom.setStyle(shim, 'height', '100%');
+    YAHOO.util.Dom.setStyle(shim, 'position', 'absolute');
+    YAHOO.util.Dom.setStyle(shim, 'background', 'white');
+    YAHOO.util.Dom.setStyle(shim, 'z-index', 11000);
+    window.document.body.appendChild(shim);
+    var shimEl = YAHOO.ext.Element.get(shim);
+    shimEl.setOpacity(.01);
+    shimEl.setXY([0, 0]);
+    return shimEl;
+};
+
+/**
+ * @private static Create our own proxy element element. So it will be the same same size on all browsers, we won't use borders. Instead we use a background color.
+ */
+YAHOO.ext.SplitBar.createProxy = function(orientation){
+    var proxy = document.createElement('div');
+    proxy.unselectable = 'on';
+    YAHOO.util.Dom.generateId(proxy, 'split-proxy');
+    YAHOO.util.Dom.setStyle(proxy, 'position', 'absolute');
+    YAHOO.util.Dom.setStyle(proxy, 'visibility', 'hidden');
+    YAHOO.util.Dom.setStyle(proxy, 'z-index', 11001);
+    YAHOO.util.Dom.setStyle(proxy, 'background-color', "#aaa");
+    if(orientation == YAHOO.ext.SplitBar.HORIZONTAL){
+        YAHOO.util.Dom.setStyle(proxy, 'cursor', 'e-resize');
+    }else{
+        YAHOO.util.Dom.setStyle(proxy, 'cursor', 'n-resize');
+    }
+    // the next 2 fix IE abs position div height problem
+    YAHOO.util.Dom.setStyle(proxy, 'line-height', '0px');
+    YAHOO.util.Dom.setStyle(proxy, 'font-size', '0px');
+    window.document.body.appendChild(proxy);
+    return proxy;
+};
+
+/** 
+ * @class YAHOO.ext.SplitBar.BasicLayoutAdapter
+ * Default Adapter. It assumes the splitter and resizing element are not positioned
+ * elements and only gets/sets the width of the element. Generally used for table based layouts.
+ */
+YAHOO.ext.SplitBar.BasicLayoutAdapter = function(){
+};
+
+YAHOO.ext.SplitBar.BasicLayoutAdapter.prototype = {
+    // do nothing for now
+    init : function(s){
+    
+    },
+    /**
+     * Called before drag operations to get the current size of the resizing element. 
+     * @param {YAHOO.ext.SplitBar} s The SplitBar using this adapter
+     */
+     getElementSize : function(s){
+        if(s.orientation == YAHOO.ext.SplitBar.HORIZONTAL){
+            return s.resizingEl.getWidth();
+        }else{
+            return s.resizingEl.getHeight();
+        }
+    },
+    
+    /**
+     * Called after drag operations to set the size of the resizing element.
+     * @param {YAHOO.ext.SplitBar} s The SplitBar using this adapter
+     * @param {Number} newSize The new size to set
+     * @param {Function} onComplete A function to be invoke when resizing is complete
+     */
+    setElementSize : function(s, newSize, onComplete){
+        if(s.orientation == YAHOO.ext.SplitBar.HORIZONTAL){
+            if(!YAHOO.util.Anim || !s.animate){
+                s.resizingEl.setWidth(newSize);
+                if(onComplete){
+                    onComplete(s, newSize);
+                }
+            }else{
+                s.resizingEl.setWidth(newSize, true, .1, onComplete, YAHOO.util.Easing.easeOut);
+            }
+        }else{
+            
+            if(!YAHOO.util.Anim || !s.animate){
+                s.resizingEl.setHeight(newSize);
+                if(onComplete){
+                    onComplete(s, newSize);
+                }
+            }else{
+                s.resizingEl.setHeight(newSize, true, .1, onComplete, YAHOO.util.Easing.easeOut);
+            }
+        }
+    }
+};
+
+/** 
+ *@class YAHOO.ext.SplitBar.AbsoluteLayoutAdapter
+ * @extends YAHOO.ext.SplitBar.BasicLayoutAdapter
+ * Adapter that  moves the splitter element to align with the resized sizing element. 
+ * Used with an absolute positioned SplitBar.
+ * @param {String/HTMLElement/Element} container The container that wraps around the absolute positioned content. If it's
+ * document.body, make sure you assign an id to the body element.
+ */
+YAHOO.ext.SplitBar.AbsoluteLayoutAdapter = function(container){
+    this.basic = new YAHOO.ext.SplitBar.BasicLayoutAdapter();
+    this.container = getEl(container);
+}
+
+YAHOO.ext.SplitBar.AbsoluteLayoutAdapter.prototype = {
+    init : function(s){
+        this.basic.init(s);
+        //YAHOO.util.Event.on(window, 'resize', this.moveSplitter.createDelegate(this, [s]));
+    },
+    
+    getElementSize : function(s){
+        return this.basic.getElementSize(s);
+    },
+    
+    setElementSize : function(s, newSize, onComplete){
+        this.basic.setElementSize(s, newSize, this.moveSplitter.createDelegate(this, [s]));
+    },
+    
+    moveSplitter : function(s){
+        var yes = YAHOO.ext.SplitBar;
+        switch(s.placement){
+            case yes.LEFT:
+                s.el.setX(s.resizingEl.getRight());
+                break;
+            case yes.RIGHT:
+                s.el.setStyle('right', (this.container.getWidth() - s.resizingEl.getLeft()) + 'px');
+                break;
+            case yes.TOP:
+                s.el.setY(s.resizingEl.getBottom());
+                break;
+            case yes.BOTTOM:
+                s.el.setY(s.resizingEl.getTop() - s.el.getHeight());
+                break;
+        }
+    }
+};
+
+/**
+ * Orientation constant - Create a vertical SplitBar
+ * @static
+ * @type Number
+ */
+YAHOO.ext.SplitBar.VERTICAL = 1;
+
+/**
+ * Orientation constant - Create a horizontal SplitBar
+ * @static
+ * @type Number
+ */
+YAHOO.ext.SplitBar.HORIZONTAL = 2;
+
+/**
+ * Placement constant - The resizing element is to the left of the splitter element
+ * @static
+ * @type Number
+ */
+YAHOO.ext.SplitBar.LEFT = 1;
+
+/**
+ * Placement constant - The resizing element is to the right of the splitter element
+ * @static
+ * @type Number
+ */
+YAHOO.ext.SplitBar.RIGHT = 2;
+
+/**
+ * Placement constant - The resizing element is positioned above the splitter element
+ * @static
+ * @type Number
+ */
+YAHOO.ext.SplitBar.TOP = 3;
+
+/**
+ * Placement constant - The resizing element is positioned under splitter element
+ * @static
+ * @type Number
+ */
+YAHOO.ext.SplitBar.BOTTOM = 4;
diff --git a/frontend/beta/js/YUI-extensions/widgets/TabPanel.js b/frontend/beta/js/YUI-extensions/widgets/TabPanel.js
new file mode 100644
index 0000000..25fd142
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/TabPanel.js
@@ -0,0 +1,756 @@
+/**
+ * @class YAHOO.ext.TabPanel
+ * @extends YAHOO.ext.util.Observable
+ * Creates a lightweight TabPanel component using Yahoo! UI.
+ * <br><br>
+ * Usage:
+ * <pre><code>
+    <font color="#008000">// basic tabs 1, built from existing content</font>
+    var tabs = new YAHOO.ext.TabPanel('tabs1');
+    tabs.addTab('script', "View Script");
+    tabs.addTab('markup', "View Markup");
+    tabs.activate('script');
+    
+    <font color="#008000">// more advanced tabs, built from javascript</font>
+    var jtabs = new YAHOO.ext.TabPanel('jtabs');
+    jtabs.addTab('jtabs-1', "Normal Tab", "My content was added during construction.");
+    
+    <font color="#008000">// set up the UpdateManager</font>
+    var tab2 = jtabs.addTab('jtabs-2', "Ajax Tab 1");
+    var updater = tab2.getUpdateManager();
+    updater.setDefaultUrl('ajax1.htm');
+    tab2.onActivate.subscribe(updater.refresh, updater, true);
+    
+    <font color="#008000">// Use setUrl for Ajax loading</font>
+    var tab3 = jtabs.addTab('jtabs-3', "Ajax Tab 2");
+    tab3.setUrl('ajax2.htm', null, true);
+    
+    <font color="#008000">// Disabled tab</font>
+    var tab4 = jtabs.addTab('tabs1-5', "Disabled Tab", "Can't see me cause I'm disabled");
+    tab4.disable();
+    
+    jtabs.activate('jtabs-1');
+}
+ * </code></pre>
+ * @requires YAHOO.ext.Element
+ * @requires YAHOO.ext.UpdateManager
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @requires YAHOO.util.CustomEvent 
+ * @requires YAHOO.util.Connect (optional)
+ * @constructor
+ * Create new TabPanel.
+ * @param {String/HTMLElement/Element} container The id, DOM element or YAHOO.ext.Element container where this TabPanel is to be rendered. 
+ * @param {Boolean} config Config object to set any properties for this TabPanel or true to render the tabs on the bottom. 
+ */
+YAHOO.ext.TabPanel = function(container, config){
+    /**
+    * The container element for this TabPanel.
+    * @type YAHOO.ext.Element
+    */
+    this.el = getEl(container, true);
+    /** The position of the tabs. Can be 'top' or 'bottom' @type String */
+    this.tabPosition = 'top';
+    this.currentTabWidth = 0;
+    /** The minimum width of a tab (ignored if resizeTabs is not true). @type Number */
+    this.minTabWidth = 40;
+    /** The maximum width of a tab (ignored if resizeTabs is not true). @type Number */
+    this.maxTabWidth = 250;
+    /** The preferred (default) width of a tab (ignored if resizeTabs is not true). @type Number */
+    this.preferredTabWidth = 175;
+    /** Set this to true to enable dynamic tab resizing. @type Boolean */
+    this.resizeTabs = false;
+    /** Set this to true to turn on window resizing monitoring (ignored if resizeTabs is not true). @type Boolean */
+    this.monitorResize = true;
+    
+    if(config){
+        if(typeof config == 'boolean'){
+            this.tabPosition = config ? 'bottom' : 'top';
+        }else{
+            YAHOO.ext.util.Config.apply(this, config);
+        }
+    }
+    if(this.tabPosition == 'bottom'){
+        this.bodyEl = getEl(this.createBody(this.el.dom));
+        this.el.addClass('ytabs-bottom');
+    }
+    this.stripWrap = getEl(this.createStrip(this.el.dom), true);
+    this.stripEl = getEl(this.createStripList(this.stripWrap.dom), true);
+    this.stripBody = getEl(this.stripWrap.dom.firstChild.firstChild, true);
+    if(YAHOO.ext.util.Browser.isIE){
+        YAHOO.util.Dom.setStyle(this.stripWrap.dom.firstChild, 'overflow-x', 'hidden');
+    }
+    if(this.tabPosition != 'bottom'){
+    /** The body element that contains TabPaneItem bodies. 
+     * @type YAHOO.ext.Element
+     */
+      this.bodyEl = getEl(this.createBody(this.el.dom));
+      this.el.addClass('ytabs-top');
+    }
+    this.items = [];
+    
+    this.bodyEl.setStyle('position', 'relative');
+    
+    // add indexOf to array if it isn't present
+    if(!this.items.indexOf){
+        this.items.indexOf = function(o){
+            for(var i = 0, len = this.length; i < len; i++){
+                if(this[i] == o) return i;
+            }
+            return -1;
+        }
+    }
+    this.active = null;
+    this.onTabChange = new YAHOO.util.CustomEvent('TabItem.onTabChange');
+    this.activateDelegate = this.activate.createDelegate(this);
+    
+    this.events = {
+        /**
+         * @event tabchange
+         * Fires when the active tab changes
+         * @param {YAHOO.ext.TabPanel} this
+         * @param {YAHOO.ext.TabPanelItem} activePanel The new active tab
+         */
+        'tabchange': this.onTabChange,
+        /**
+         * @event beforetabchange
+         * Fires before the active tab changes, set cancel to true on the "e" parameter to cancel the change
+         * @param {YAHOO.ext.TabPanel} this
+         * @param {Object} e Set cancel to true on this object to cancel the tab change
+         * @param {YAHOO.ext.TabPanelItem} tab The tab being changed to
+         */
+        'beforetabchange' : new YAHOO.util.CustomEvent('beforechange')
+    };
+    
+    YAHOO.ext.EventManager.onWindowResize(this.onResize, this, true);
+    this.cpad = this.el.getPadding('lr');
+    this.hiddenCount = 0;
+}
+
+YAHOO.ext.TabPanel.prototype = {
+    fireEvent : YAHOO.ext.util.Observable.prototype.fireEvent,
+    on : YAHOO.ext.util.Observable.prototype.on,
+    addListener : YAHOO.ext.util.Observable.prototype.addListener,
+    delayedListener : YAHOO.ext.util.Observable.prototype.delayedListener,
+    removeListener : YAHOO.ext.util.Observable.prototype.removeListener,
+    purgeListeners : YAHOO.ext.util.Observable.prototype.purgeListeners,
+    /**
+     * Creates a new TabPanelItem by looking for an existing element with the provided id - if it's not found it creates one.
+     * @param {String} id The id of the div to use <b>or create</b>
+     * @param {String} text The text for the tab
+     * @param {<i>String</i>} content (optional) Content to put in the TabPanelItem body
+     * @param {<i>Boolean</i>} closable (optional) True to create a close icon on the tab
+     * @return {YAHOO.ext.TabPanelItem} The created TabPanelItem
+     */
+    addTab : function(id, text, content, closable){
+        var item = new YAHOO.ext.TabPanelItem(this, id, text, closable);
+        this.addTabItem(item);
+        if(content){
+            item.setContent(content);
+        }
+        return item;
+    },
+    
+    /**
+     * Returns the TabPanelItem with the specified id/index
+     * @param {String/Number} id The id or index of the TabPanelItem to fetch.
+     * @return {YAHOO.ext.TabPanelItem}
+     */
+    getTab : function(id){
+        return this.items[id];
+    },
+    
+    /**
+     * Hides the TabPanelItem with the specified id/index
+     * @param {String/Number} id The id or index of the TabPanelItem to hide.
+     */
+    hideTab : function(id){
+        var t = this.items[id];
+        if(!t.isHidden()){
+           t.setHidden(true);
+           this.hiddenCount++;
+           this.autoSizeTabs();
+        }
+    },
+    
+    /**
+     * "Unhides" the TabPanelItem with the specified id/index
+     * @param {String/Number} id The id or index of the TabPanelItem to unhide.
+     */
+    unhideTab : function(id){
+        var t = this.items[id];
+        if(t.isHidden()){
+           t.setHidden(false);
+           this.hiddenCount--;
+           this.autoSizeTabs();
+        }
+    },
+    
+    /**
+     * Add an existing TabPanelItem.
+     * @param {YAHOO.ext.TabPanelItem} item The TabPanelItem to add
+     */
+    addTabItem : function(item){
+        this.items[item.id] = item;
+        this.items.push(item);
+        if(this.resizeTabs){
+           item.setWidth(this.currentTabWidth || this.preferredTabWidth)
+           this.autoSizeTabs();
+        }else{
+            item.autoSize();
+        }
+    },
+        
+    /**
+     * Remove a TabPanelItem.
+     * @param {String/Number} id The id or index of the TabPanelItem to remove.
+     */
+    removeTab : function(id){
+        var items = this.items;
+        var tab = items[id];
+        if(!tab) return;
+        var index = items.indexOf(tab);
+        if(this.active == tab && items.length > 1){
+            var newTab = this.getNextAvailable(index);
+            if(newTab)newTab.activate();
+        }
+        this.stripEl.dom.removeChild(tab.pnode.dom);
+        if(tab.bodyEl.dom.parentNode == this.bodyEl.dom){ // if it was moved already prevent error
+            this.bodyEl.dom.removeChild(tab.bodyEl.dom);
+        }
+        items.splice(index, 1);
+        delete this.items[tab.id];
+        tab.fireEvent('close', tab);
+        tab.purgeListeners();
+        this.autoSizeTabs();
+    },
+    
+    getNextAvailable : function(start){
+        var items = this.items;
+        var index = start;
+        // look for a next tab that will slide over to
+        // replace the one being removed
+        while(index < items.length){
+            var item = items[++index];
+            if(item && !item.isHidden()){
+                return item;
+            }
+        }
+        // if one isn't found select the previous tab (on the left)
+        var index = start;
+        while(index >= 0){
+            var item = items[--index];
+            if(item && !item.isHidden()){
+                return item;
+            }
+        }
+        return null;
+    },
+    
+    /**
+     * Disable a TabPanelItem. <b>It cannot be the active tab, if it is this call is ignored.</b>. 
+     * @param {String/Number} id The id or index of the TabPanelItem to disable.
+     */
+    disableTab : function(id){
+        var tab = this.items[id];
+        if(tab && this.active != tab){
+            tab.disable();
+        }
+    },
+    
+    /**
+     * Enable a TabPanelItem that is disabled.
+     * @param {String/Number} id The id or index of the TabPanelItem to enable.
+     */
+    enableTab : function(id){
+        var tab = this.items[id];
+        tab.enable();
+    },
+    
+    /**
+     * Activate a TabPanelItem. The currently active will be deactivated. 
+     * @param {String/Number} id The id or index of the TabPanelItem to activate.
+     */
+    activate : function(id){
+        var tab = this.items[id];
+        if(tab == this.active){
+            return tab;
+        } 
+        var e = {};
+        this.fireEvent('beforetabchange', this, e, tab);
+        if(e.cancel !== true && !tab.disabled){
+            if(this.active){
+                this.active.hide();
+            }
+            this.active = this.items[id];
+            this.active.show();
+            this.onTabChange.fireDirect(this, this.active);
+        }
+        return tab;
+    },
+    
+    /**
+     * Get the active TabPanelItem
+     * @return {YAHOO.ext.TabPanelItem} The active TabPanelItem or null if none are active.
+     */
+    getActiveTab : function(){
+        return this.active;
+    },
+    
+    /**
+     * Updates the tab body element to fit the height of the container element
+     * for overflow scrolling
+     * @param {Number} targetHeight (optional) Override the starting height from the elements height
+     */
+    syncHeight : function(targetHeight){
+        var height = (targetHeight || this.el.getHeight())-this.el.getBorderWidth('tb')-this.el.getPadding('tb');
+        var bm = this.bodyEl.getMargins();
+        var newHeight = height-(this.stripWrap.getHeight()||0)-(bm.top+bm.bottom);
+        this.bodyEl.setHeight(newHeight);
+        return newHeight; 
+    },
+    
+    onResize : function(){
+        if(this.monitorResize){
+            this.autoSizeTabs();
+        }
+    },
+
+    /**
+     * Disables tab resizing while tabs are being added (if resizeTabs is false this does nothing)
+     */
+    beginUpdate : function(){
+        this.updating = true;    
+    },
+    
+    /**
+     * Stops an update and resizes the tabs (if resizeTabs is false this does nothing)
+     */
+    endUpdate : function(){
+        this.updating = false;
+        this.autoSizeTabs();  
+    },
+    
+    /**
+     * Manual call to resize the tabs (if resizeTabs is false this does nothing)
+     */
+    autoSizeTabs : function(){
+        var count = this.items.length;
+        var vcount = count - this.hiddenCount;
+        if(!this.resizeTabs || count < 1 || vcount < 1 || this.updating) return;
+        var w = Math.max(this.el.getWidth() - this.cpad, 10);
+        var availWidth = Math.floor(w / vcount);
+        var b = this.stripBody;
+        if(b.getWidth() > w){
+            var tabs = this.items;
+            this.setTabWidth(Math.max(availWidth, this.minTabWidth));
+            if(availWidth < this.minTabWidth){
+                /*if(!this.sleft){    // incomplete scrolling code
+                    this.createScrollButtons();
+                }
+                this.showScroll();
+                this.stripClip.setWidth(w - (this.sleft.getWidth()+this.sright.getWidth()));*/
+            }
+        }else{
+            if(this.currentTabWidth < this.preferredTabWidth){
+                this.setTabWidth(Math.min(availWidth, this.preferredTabWidth));
+            }
+        }
+    },
+    
+    /**
+     * Returns the number of tabs
+     * @return {Number}
+     */
+     getCount : function(){
+         return this.items.length;  
+     },
+    
+    /**
+     * Resizes all the tabs to the passed width
+     * @param {Number} The new width
+     */
+    setTabWidth : function(width){
+        this.currentTabWidth = width;
+        for(var i = 0, len = this.items.length; i < len; i++) {
+        	if(!this.items[i].isHidden())this.items[i].setWidth(width);
+        }
+    },
+    
+    /**
+     * Destroys this TabPanel
+     * @param {Boolean} removeEl (optional) True to remove the element from the DOM as well
+     */
+    destroy : function(removeEl){
+        YAHOO.ext.EventManager.removeResizeListener(this.onResize, this);
+        for(var i = 0, len = this.items.length; i < len; i++){
+            this.items[i].purgeListeners();
+        }
+        if(removeEl === true){
+            this.el.update('');
+            this.el.remove();
+        }
+    }
+};
+
+/**
+* @class YAHOO.ext.TabPanelItem
+* @extends YAHOO.ext.util.Observable
+*/ 
+YAHOO.ext.TabPanelItem = function(tabPanel, id, text, closable){
+    /**
+     * The TabPanel this TabPanelItem belongs to
+     * @type YAHOO.ext.TabPanel
+     */
+    this.tabPanel = tabPanel;
+    /**
+     * The id for this TabPanelItem
+     * @type String
+     */
+    this.id = id;
+    /** @private */
+    this.disabled = false;
+    /** @private */
+    this.text = text;
+    /** @private */
+    this.loaded = false;
+    this.closable = closable;
+    
+    /** 
+     * The body element for this TabPanelItem
+     * @type YAHOO.ext.Element
+     */
+    this.bodyEl = getEl(tabPanel.createItemBody(tabPanel.bodyEl.dom, id));
+    this.bodyEl.setVisibilityMode(YAHOO.ext.Element.VISIBILITY);
+    this.bodyEl.setStyle('display', 'block');
+    this.bodyEl.setStyle('zoom', '1');
+    this.hideAction();
+    
+    var els = tabPanel.createStripElements(tabPanel.stripEl.dom, text, closable);
+    /** @private */
+    this.el = getEl(els.el, true);
+    this.inner = getEl(els.inner, true);
+    this.textEl = getEl(this.el.dom.firstChild.firstChild.firstChild, true);
+    this.pnode = getEl(els.el.parentNode, true);
+    this.el.mon('click', this.onTabClick, this, true);
+    /** @private */
+    if(closable){
+        var c = getEl(els.close, true);
+        c.dom.title = this.closeText;
+        c.addClassOnOver('close-over');
+        c.mon('click', this.closeClick, this, true);
+     }
+    
+    // these two are now private and deprecated
+    this.onActivate = new YAHOO.util.CustomEvent('TabItem.onActivate');
+    this.onDeactivate = new YAHOO.util.CustomEvent('TabItem.onDeactivate');
+    
+    this.events = {
+         /**
+         * @event activate
+         * Fires when this tab becomes the active tab
+         * @param {YAHOO.ext.TabPanel} tabPanel
+         * @param {YAHOO.ext.TabPanelItem} this
+         */
+        'activate': this.onActivate,
+        /**
+         * @event beforeclose
+         * Fires before this tab is closed. To cancal the close, set cancel to true on e. (e.cancel = true)
+         * @param {YAHOO.ext.TabPanelItem} this
+         * @param {Object} e Set cancel to true on this object to cancel the close.
+         */
+        'beforeclose': new YAHOO.util.CustomEvent('beforeclose'),
+        /**
+         * @event close
+         * Fires when this tab is closed
+         * @param {YAHOO.ext.TabPanelItem} this
+         */
+         'close': new YAHOO.util.CustomEvent('close'),
+        /**
+         * @event deactivate
+         * Fires when this tab is no longer the active tab
+         * @param {YAHOO.ext.TabPanel} tabPanel
+         * @param {YAHOO.ext.TabPanelItem} this
+         */
+         'deactivate' : this.onDeactivate  
+    };
+    this.hidden = false;
+};
+
+YAHOO.ext.TabPanelItem.prototype = {
+    fireEvent : YAHOO.ext.util.Observable.prototype.fireEvent,
+    on : YAHOO.ext.util.Observable.prototype.on,
+    addListener : YAHOO.ext.util.Observable.prototype.addListener,
+    delayedListener : YAHOO.ext.util.Observable.prototype.delayedListener,
+    removeListener : YAHOO.ext.util.Observable.prototype.removeListener,
+    purgeListeners : function(){
+       YAHOO.ext.util.Observable.prototype.purgeListeners.call(this);
+       this.el.removeAllListeners(); 
+    },
+    /**
+     * Show this TabPanelItem - this <b>does not</b> deactivate the currently active TabPanelItem.
+     */
+    show : function(){
+        this.pnode.addClass('on');
+        this.showAction();
+        if(YAHOO.ext.util.Browser.isOpera){
+            this.tabPanel.stripWrap.repaint();
+        }
+        this.onActivate.fireDirect(this.tabPanel, this); 
+    },
+    
+    /**
+     * Returns true if this tab is the active tab
+     * @return {Boolean}
+     */
+    isActive : function(){
+        return this.tabPanel.getActiveTab() == this;  
+    },
+    
+    /**
+     * Hide this TabPanelItem - if you don't activate another TabPanelItem this could look odd.
+     */
+    hide : function(){
+        this.pnode.removeClass('on');
+        this.hideAction();
+        this.onDeactivate.fireDirect(this.tabPanel, this); 
+    },
+    
+    hideAction : function(){
+        this.bodyEl.setStyle('position', 'absolute');
+        this.bodyEl.setLeft('-20000px');
+        this.bodyEl.setTop('-20000px');
+        this.bodyEl.hide();
+    },
+    
+    showAction : function(){
+        this.bodyEl.setStyle('position', 'relative');
+        this.bodyEl.setTop('');
+        this.bodyEl.setLeft('');
+        this.bodyEl.show();
+        this.tabPanel.el.repaint.defer(1);
+    },
+    
+    /**
+     * Set the tooltip (title attribute) for the tab
+     * @param {String} tooltip
+     */
+    setTooltip : function(text){
+        this.textEl.dom.title = text;
+    },
+    
+    onTabClick : function(e){
+        e.preventDefault();
+        this.tabPanel.activate(this.id);
+    },
+    
+    getWidth : function(){
+        return this.inner.getWidth();  
+    },
+    
+    setWidth : function(width){
+        var iwidth = width - this.pnode.getPadding("lr");
+        this.inner.setWidth(iwidth);
+        this.textEl.setWidth(iwidth-this.inner.getPadding('lr'));
+        this.pnode.setWidth(width);
+    },
+    
+    setHidden : function(hidden){
+        this.hidden = hidden;
+        this.pnode.setStyle('display', hidden ? 'none' : '');  
+    },
+    
+    /**
+     * Returns true if this tab is "hidden"
+     * @return {Boolean}
+     */
+    isHidden : function(){
+        return this.hidden;  
+    },
+    
+    /**
+     * Returns the text for this tab
+     * @return {String}
+     */
+    getText : function(){
+        return this.text;
+    },
+    
+    autoSize : function(){
+        this.el.beginMeasure();
+        this.textEl.setWidth(1);
+        this.setWidth(this.textEl.dom.scrollWidth+this.pnode.getPadding("lr")+this.inner.getPadding('lr'));
+        this.el.endMeasure();
+    },
+    
+    /**
+     * Sets the text for the tab (Note: this also sets the tooltip)
+     * @param {String} text
+     */
+    setText : function(text){
+        this.text = text;
+        this.textEl.update(text);
+        this.textEl.dom.title = text;
+        if(!this.tabPanel.resizeTabs){
+            this.autoSize();
+        }
+    },
+    /**
+     * Activate this TabPanelItem - this <b>does</b> deactivate the currently active TabPanelItem.
+     */
+    activate : function(){
+        this.tabPanel.activate(this.id);
+    },
+    
+    /**
+     * Disable this TabPanelItem - this call is ignore if this is the active TabPanelItem.
+     */
+    disable : function(){
+        if(this.tabPanel.active != this){
+            this.disabled = true;
+            this.pnode.addClass('disabled');
+        }
+    },
+    
+    /**
+     * Enable this TabPanelItem if it was previously disabled.
+     */
+    enable : function(){
+        this.disabled = false;
+        this.pnode.removeClass('disabled');
+    },
+    
+    /**
+     * Set the content for this TabPanelItem.
+     * @param {String} content The content
+     * @param {Boolean} loadScripts true to look for and load scripts
+     */
+    setContent : function(content, loadScripts){
+        this.bodyEl.update(content, loadScripts);
+    },
+    
+    /**
+     * Get the {@link YAHOO.ext.UpdateManager} for the body of this TabPanelItem. Enables you to perform Ajax updates.
+     * @return {YAHOO.ext.UpdateManager} The UpdateManager
+     */
+    getUpdateManager : function(){
+        return this.bodyEl.getUpdateManager();
+    },
+    
+    /**
+     * Set a URL to be used to load the content for this TabPanelItem.
+     * @param {String/Function} url The url to load the content from or a function to call to get the url
+     * @param {<i>String/Object</i>} params (optional) The string params for the update call or an object of the params. See {@link YAHOO.ext.UpdateManager#update} for more details. (Defaults to null)
+     * @param {<i>Boolean</i>} loadOnce (optional) Whether to only load the content once. If this is false it makes the Ajax call every time this TabPanelItem is activated. (Defaults to false)
+     * @return {YAHOO.ext.UpdateManager} The UpdateManager
+     */
+    setUrl : function(url, params, loadOnce){
+        if(this.refreshDelegate){
+            this.onActivate.unsubscribe(this.refreshDelegate);
+        }
+        this.refreshDelegate = this._handleRefresh.createDelegate(this, [url, params, loadOnce]);
+        this.onActivate.subscribe(this.refreshDelegate);
+        return this.bodyEl.getUpdateManager();
+    },
+    
+    /** @private */
+    _handleRefresh : function(url, params, loadOnce){
+        if(!loadOnce || !this.loaded){
+            var updater = this.bodyEl.getUpdateManager();
+            updater.update(url, params, this._setLoaded.createDelegate(this));
+        }
+    },
+    
+    /**
+     *   Force a content refresh from the URL specified in the setUrl() method.
+     *   Will fail silently if the setUrl method has not been called.
+     *   This does not activate the panel, just updates its content.
+     */
+    refresh : function(){
+        if(this.refreshDelegate){
+           this.loaded = false;
+           this.refreshDelegate();
+        }
+    }, 
+    
+    /** @private */
+    _setLoaded : function(){
+        this.loaded = true;
+    },
+    
+    /** @private */
+    closeClick : function(e){
+        var e = {};
+        this.fireEvent('beforeclose', this, e);
+        if(e.cancel !== true){
+            this.tabPanel.removeTab(this.id);
+        }
+    },
+    /**
+     * The text displayed in the tooltip for the close icon.
+     * @type String
+     */
+    closeText : 'Close this tab'
+};
+
+/** @private */
+YAHOO.ext.TabPanel.prototype.createStrip = function(container){
+    var strip = document.createElement('div');
+    strip.className = 'ytab-wrap';
+    container.appendChild(strip);
+    return strip;
+};
+/** @private */
+YAHOO.ext.TabPanel.prototype.createStripList = function(strip){
+    // div wrapper for retard IE
+    strip.innerHTML = '<div class="ytab-strip-wrap"><table class="ytab-strip" cellspacing="0" cellpadding="0" border="0"><tbody><tr></tr></tbody></table></div>';
+    return strip.firstChild.firstChild.firstChild.firstChild;
+};
+/** @private */
+YAHOO.ext.TabPanel.prototype.createBody = function(container){
+    var body = document.createElement('div');
+    YAHOO.util.Dom.generateId(body, 'tab-body');
+    YAHOO.util.Dom.addClass(body, 'yui-ext-tabbody');
+    container.appendChild(body);
+    return body;
+};
+/** @private */
+YAHOO.ext.TabPanel.prototype.createItemBody = function(bodyEl, id){
+    var body = YAHOO.util.Dom.get(id);
+    if(!body){
+        body = document.createElement('div');
+        body.id = id;
+    }
+    YAHOO.util.Dom.addClass(body, 'yui-ext-tabitembody');
+    bodyEl.insertBefore(body, bodyEl.firstChild);
+    return body;
+};
+/** @private */
+YAHOO.ext.TabPanel.prototype.createStripElements = function(stripEl, text, closable){
+    var td = document.createElement('td');
+    stripEl.appendChild(td);
+    if(closable){
+        td.className = "ytab-closable";
+        if(!this.closeTpl){
+            this.closeTpl = new YAHOO.ext.Template(
+               '<a href="#" class="ytab-right"><span class="ytab-left"><em class="ytab-inner">' +
+               '<span unselectable="on" title="{text}" class="ytab-text">{text}</span>' +
+               '<div unselectable="on" class="close-icon">&#160;</div></em></span></a>'
+            );
+        }
+        var el = this.closeTpl.overwrite(td, {'text': text});
+        var close = el.getElementsByTagName('div')[0];
+        var inner = el.getElementsByTagName('em')[0];
+        return {'el': el, 'close': close, 'inner': inner};
+    } else {
+        if(!this.tabTpl){
+            this.tabTpl = new YAHOO.ext.Template(
+               '<a href="#" class="ytab-right"><span class="ytab-left"><em class="ytab-inner">' +
+               '<span unselectable="on" title="{text}" class="ytab-text">{text}</span></em></span></a>'
+            );
+        }
+        var el = this.tabTpl.overwrite(td, {'text': text});
+        var inner = el.getElementsByTagName('em')[0];
+        return {'el': el, 'inner': inner};
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/widgets/TaskPanel.js b/frontend/beta/js/YUI-extensions/widgets/TaskPanel.js
new file mode 100644
index 0000000..e69de29
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/TaskPanel.js
diff --git a/frontend/beta/js/YUI-extensions/widgets/TemplateView.js b/frontend/beta/js/YUI-extensions/widgets/TemplateView.js
new file mode 100644
index 0000000..2100205
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/TemplateView.js
@@ -0,0 +1,766 @@
+/**
+ * @class YAHOO.ext.View
+ * @extends YAHOO.ext.util.Observable
+ * Create a "View" for an element based on a data model or UpdateManager and the supplied DomHelper template. 
+ * This class also supports single and multi selection modes. <br>
+ * Create a data model bound view:
+<pre><code>
+var dataModel = new YAHOO.ext.grid.XMLDataModel(...);
+var view = new YAHOO.ext.View('my-element', 
+           '&lt;div id="{0}"&gt;{2} - {1}&lt;/div&gt;', // auto create template
+           dataModel, { 
+              singleSelect: true, 
+              selectedClass: 'ydataview-selected'
+           });
+
+// listen for node click?
+view.on('click', function(vw, index, node, e){
+    alert('Node "' + node.id + '" at index: ' + index + ' was clicked.');
+});
+
+// load XML data
+dataModel.load('foobar.xml');
+</code></pre>
+For an example of creating a JSON/UpdateManager view, see {@link YAHOO.ext.JsonView}.
+ * <br><br>
+ * <b>Note: The root of your template must be a single node. Table/row implementations may work but are not supported due to
+ * IE's limited insertion support with tables and Opera's faulty event bubbling.</b>
+ * @constructor
+ * Create a new View
+ * @param {String/HTMLElement/Element} container The container element where the view is to be rendered.
+ * @param {String/DomHelper.Template} tpl The rendering template or a string to create a template with
+ * @param {DataModel} dataModel The bound data model
+ * @param {Object} config The config object
+*/
+YAHOO.ext.View = function(container, tpl, dataModel, config){
+    this.el = getEl(container, true);
+    this.nodes = this.el.dom.childNodes;
+    if(typeof tpl == 'string'){
+        tpl = new YAHOO.ext.Template(tpl);
+    }
+    tpl.compile();
+    /**
+     * The template used by this View
+     * @type {YAHOO.ext.DomHelper.Template}
+     */
+    this.tpl = tpl;
+    this.setDataModel(dataModel);
+    var CE = YAHOO.util.CustomEvent;
+	/** @private */
+	this.events = {
+	    /**
+         * @event beforeclick
+         * Fires before a click is processed. Returns false to cancel the default action.
+         * @param {YAHOO.ext.View} this
+         * @param {Number} index The index of the target node
+         * @param {HTMLElement} node The target node
+         * @param {YAHOO.ext.EventObject} e The raw event object
+         */
+        'beforeclick' : true,
+	    /**
+         * @event click
+         * Fires when a template node is clicked.
+         * @param {YAHOO.ext.View} this
+         * @param {Number} index The index of the target node
+         * @param {HTMLElement} node The target node
+         * @param {YAHOO.ext.EventObject} e The raw event object
+         */
+        'click' : true,
+	    /**
+         * @event dblclick
+         * Fires when a template node is double clicked.
+         * @param {YAHOO.ext.View} this
+         * @param {Number} index The index of the target node
+         * @param {HTMLElement} node The target node
+         * @param {YAHOO.ext.EventObject} e The raw event object
+         */
+        'dblclick' : true,
+	    /**
+         * @event contextmenu
+         * Fires when a template node is right clicked.
+         * @param {YAHOO.ext.View} this
+         * @param {Number} index The index of the target node
+         * @param {HTMLElement} node The target node
+         * @param {YAHOO.ext.EventObject} e The raw event object
+         */
+        'contextmenu' : true,
+	    /**
+         * @event selectionchange
+         * Fires when the selected nodes change.
+         * @param {YAHOO.ext.View} this
+         * @param {Array} selections Array of the selected nodes
+         */
+        'selectionchange' : true,
+        
+        /**
+         * @event beforeselect
+         * Fires before a selection is made. If any handlers return false, the selection is cancelled.
+         * @param {YAHOO.ext.View} this
+         * @param {HTMLElement} node The node to be selected
+         * @param {Array} selections Array of currently selected nodes
+         */
+        'beforeselect' : true
+	};
+	this.el.mon("click", this.onClick, this, true);
+    this.el.mon("dblclick", this.onDblClick, this, true);
+    this.el.mon("contextmenu", this.onContextMenu, this, true);
+    
+    /**
+     * The css class to add to selected nodes
+     * @type {YAHOO.ext.DomHelper.Template}
+     */
+    this.selectedClass = 'ydataview-selected';
+    
+    this.emptyText = '';
+    
+    this.selections = [];
+    
+    this.lastSelection = null;
+    
+    /**
+     * The root property in the loaded json object that contains the data
+     * @type {String}
+     */
+    this.jsonRoot = null;
+    YAHOO.ext.util.Config.apply(this, config);
+    if(this.renderUpdates || this.jsonRoot){
+        var um = this.el.getUpdateManager();
+        um.setRenderer(this);
+    }
+};
+
+YAHOO.extendX(YAHOO.ext.View, YAHOO.ext.util.Observable, {
+    /**
+     * Returns the element this view is bound to.
+     * @return {YAHOO.ext.Element}
+     */
+    getEl : function(){
+        return this.el;  
+    },
+    
+    render : function(el, response){
+        this.clearSelections();
+        this.el.update('');
+        var o;
+        try{
+            o = YAHOO.ext.util.JSON.decode(response.responseText);
+            if(this.jsonRoot){
+                o = eval('o.' + this.jsonRoot);
+            }
+        }catch(e){}
+        /**
+         * The current json data or null
+         */
+        this.jsonData = o;
+        this.beforeRender();
+        this.refresh();
+    },
+    
+    beforeRender : function(){
+        
+    },
+    
+    /**
+     * Refreshes the view. 
+     */
+     refresh : function(){
+        this.clearSelections();
+        this.el.update('');
+        this.html = [];
+        if(this.renderUpdates || this.jsonRoot){
+            var o = this.jsonData;
+            if(o){
+                for(var i = 0, len = o.length; i < len; i++) {
+                	this.renderEach(o[i]);
+                }
+            }
+        }else{
+           this.dataModel.each(this.renderEach, this);
+        }
+        var strHtml;
+        if(this.html.length > 0){
+            strHtml = this.html.join('');
+        }else{
+            strHtml = this.emptyText;
+        }
+        this.el.update(strHtml);
+        this.html = null;
+        this.nodes = this.el.dom.childNodes;
+        this.updateIndexes(0);
+    },
+    
+    /**
+     * Function to override to reformat the data that is sent to 
+     * the template for each node.
+     * @param {Array/Object} data The raw data (array of colData for a data model bound view or 
+     * a JSON object for an UpdateManager bound view).
+     * @param {Number} index The index of the data within the data model 
+     */
+    prepareData : function(data, index){
+        return data;  
+    },
+    
+    renderEach : function(data){
+        this.html[this.html.length] = this.tpl.applyTemplate(this.prepareData(data));
+    },
+    
+    /**
+     * Refresh an individual node.
+     * @param {Number} index 
+     */
+    refreshNode : function(index){
+        this.refreshNodes(index, index);
+    },
+    
+    refreshNodes : function(dm, startIndex, endIndex){
+        this.clearSelections();
+        var dm = this.dataModel;
+        var ns = this.nodes;
+        for(var i = startIndex; i <= endIndex; i++){
+            var d = this.prepareData(dm.getRow(i), i);
+            if(i < ns.length-1){
+                var old = ns[i];
+                this.tpl.insertBefore(old, d);
+                this.el.dom.removeChild(old);
+            }else{
+                this.tpl.append(this.el.dom, d);
+            }
+        }
+        this.updateIndexes(startIndex, endIndex);
+    },
+    
+    deleteNodes : function(dm, startIndex, endIndex){
+        this.clearSelections();
+        if(startIndex == 0 && endIndex >= this.nodes.length-1){
+            this.el.update('');
+        }else{
+            var el = this.el.dom;
+            for(var i = startIndex; i <= endIndex; i++){
+                el.removeChild(this.nodes[startIndex]);
+            }
+            this.updateIndexes(startIndex);
+        }
+    },
+    
+    insertNodes : function(dm, startIndex, endIndex){
+        if(this.nodes.length == 0){
+            this.refresh();
+        }else{
+            this.clearSelections();
+            var t = this.tpl;
+            var before = this.nodes[startIndex];
+            var dm = this.dataModel;
+            if(before){
+                for(var i = startIndex; i <= endIndex; i++){
+                    t.insertBefore(before, this.prepareData(dm.getRow(i), i));
+                }
+            }else{
+                var el = this.el.dom;
+                for(var i = startIndex; i <= endIndex; i++){
+                    t.append(el, this.prepareData(dm.getRow(i), i));
+                }
+            }
+            this.updateIndexes(startIndex);
+        }
+    },
+    
+    updateIndexes : function(dm, startIndex, endIndex){
+        var ns = this.nodes;
+        startIndex = startIndex || 0;
+        endIndex = endIndex || ns.length-1;
+        for(var i = startIndex; i <= endIndex; i++){
+            ns[i].nodeIndex = i;
+        }
+    },
+    
+    /**
+     * Changes the data model this view uses and refresh the view.
+     * @param {DataModel} dataModel 
+     */
+     setDataModel : function(dm){
+        if(!dm) return;
+        this.unplugDataModel(this.dataModel);
+        this.dataModel = dm;
+        dm.on('cellupdated', this.refreshNode, this, true);
+        dm.on('datachanged', this.refresh, this, true);
+        dm.on('rowsdeleted', this.deleteNodes, this, true);
+        dm.on('rowsinserted', this.insertNodes, this, true);
+        dm.on('rowsupdated', this.refreshNodes, this, true);
+        dm.on('rowssorted', this.refresh, this, true);
+        this.refresh();
+    },
+    
+    /**
+     * Unplug the data model and stop updates.
+     * @param {DataModel} dataModel 
+     */
+    unplugDataModel : function(dm){
+        if(!dm) return;
+        dm.removeListener('cellupdated', this.refreshNode, this);
+        dm.removeListener('datachanged', this.refresh, this);
+        dm.removeListener('rowsdeleted', this.deleteNodes, this);
+        dm.removeListener('rowsinserted', this.insertNodes, this);
+        dm.removeListener('rowsupdated', this.refreshNodes, this);
+        dm.removeListener('rowssorted', this.refresh, this);
+        this.dataModel = null;
+    },
+    
+    /**
+     * Returns the template node the passed child belongs to or null if it doesn't belong to one.
+     * @param {HTMLElement} node
+     * @return {HTMLElement} The template node 
+     */
+    findItemFromChild : function(node){
+        var el = this.el.dom;
+        if(!node || node.parentNode == el){
+		    return node;
+	    }
+	    var p = node.parentNode;
+	    while(p && p != el){
+            if(p.parentNode == el){
+            	return p;
+            }
+            p = p.parentNode;
+        }
+	    return null;
+    },
+    
+    /** @ignore */
+    onClick : function(e){
+        var item = this.findItemFromChild(e.getTarget());
+        if(item){
+            var index = this.indexOf(item);
+            if(this.onItemClick(item, index, e) !== false){
+                this.fireEvent('click', this, index, item, e);
+            }
+        }else{
+            this.clearSelections();
+        }
+    },
+
+    /** @ignore */
+    onContextMenu : function(e){
+        var item = this.findItemFromChild(e.getTarget());
+        if(item){
+            this.fireEvent('contextmenu', this, this.indexOf(item), item, e);
+        }
+    },
+
+    /** @ignore */
+    onDblClick : function(e){
+        var item = this.findItemFromChild(e.getTarget());
+        if(item){
+            this.fireEvent('dblclick', this, this.indexOf(item), item, e);
+        }
+    },
+    
+    onItemClick : function(item, index, e){
+        if(this.fireEvent('beforeclick', this, index, item, e) !== false){
+            if(this.multiSelect || this.singleSelect){
+                if(this.multiSelect && e.shiftKey && this.lastSelection){
+                    this.select(this.getNodes(this.indexOf(this.lastSelection), index), false);
+                }else{
+                    this.select(item, this.multiSelect && e.ctrlKey);
+                    this.lastSelection = item;
+                }
+                e.preventDefault();
+            }
+            return true;
+        }else{
+            return false;
+        }
+    },
+    
+    /**
+     * Get the number of selected nodes.
+     * @return {Number}
+     */
+    getSelectionCount : function(){
+        return this.selections.length;
+    },
+    
+    /**
+     * Get the currently selected nodes.
+     * @return {Array} An array of HTMLElements
+     */
+    getSelectedNodes : function(){
+        return this.selections;
+    },
+    
+    /**
+     * Get the indexes of the selected nodes.
+     * @return {Array}
+     */
+    getSelectedIndexes : function(){
+        var indexes = [];
+        for(var i = 0, len = this.selections.length; i < len; i++) {
+        	indexes.push(this.selections[i].nodeIndex);
+        }
+        return indexes;
+    },
+    
+    /**
+     * Clear all selections
+     * @param {Boolean} suppressEvent (optional) true to skip firing of the selectionchange event
+     */
+    clearSelections : function(suppressEvent){
+        if(this.multiSelect || this.singleSelect){
+            YAHOO.util.Dom.removeClass(this.selections, this.selectedClass);
+            this.selections = [];
+            if(!suppressEvent){
+                this.fireEvent('selectionchange', this, this.selections);
+            }
+        }
+    },
+    
+    /**
+     * Returns true if the passed node is selected
+     * @param {HTMLElement/Number} node The node or node index
+     * @return {Boolean}
+     */
+    isSelected : function(node){
+        node = this.getNode(node);
+        var s = this.selections;
+        if(s.length < 1){
+            return false;
+        }
+        if(s.indexOf){
+            return s.indexOf(node) !== -1;
+        }else{
+            for(var i = 0, len = s.length; i < len; i++){
+                if (s[i] == node){
+                    return true;
+                }
+            }
+            return false;
+        }
+    },
+    
+    /**
+     * Selects nodes.
+     * @param {Array/HTMLElement/String/Number} nodeInfo An HTMLElement template node, index of a template node, id of a template node or an array of any of those to select
+     * @param {Boolean} keepExisting (optional) true to keep existing selections
+     * @param {Boolean} suppressEvent (optional) true to skip firing of the selectionchange vent
+     */
+    select : function(nodeInfo, keepExisting, suppressEvent){
+        if(!keepExisting){
+            this.clearSelections(true);
+        }
+        if(nodeInfo instanceof Array){
+            for(var i = 0, len = nodeInfo.length; i < len; i++) {
+            	this.select(nodeInfo[i], true, true);
+            }
+        }else{
+            var node = this.getNode(nodeInfo);
+            if(node && !this.isSelected(node)){
+                if(this.fireEvent('beforeselect', this, node, this.selections) !== false){
+                    YAHOO.util.Dom.addClass(node, this.selectedClass);
+                    this.selections.push(node);
+                }
+            }
+        }
+        if(!suppressEvent){
+            this.fireEvent('selectionchange', this, this.selections);
+        }
+    },
+    
+    /**
+     * Gets a template node.
+     * @param {HTMLElement/String/Number} nodeInfo An HTMLElement template node, index of a template node or the id of a template node
+     * @return {HTMLElement} The node or null if it wasn't found
+     */
+     getNode : function(nodeInfo){
+        if(typeof nodeInfo == 'object'){
+            return nodeInfo;
+        }else if(typeof nodeInfo == 'string'){
+            return document.getElementById(nodeInfo);
+        }else if(typeof nodeInfo == 'number'){
+            return this.nodes[nodeInfo];
+        }
+        return null;
+    },
+    
+    /**
+     * Gets a range template nodes.
+     * @param {Number} startIndex
+     * @param {Number} endIndex
+     * @return {Array} An array of nodes
+     */
+    getNodes : function(start, end){
+        var ns = this.nodes;
+        start = start || 0;
+        end = typeof end == 'undefined' ? ns.length-1 : end;
+        var nodes = [];
+        if(start <= end){
+            for(var i = start; i <= end; i++) {
+        	    nodes.push(ns[i]);
+            }
+        }else{
+            for(var i = start; i >= end; i--) {
+        	    nodes.push(ns[i]);
+            }
+        }
+        return nodes;
+    },
+    
+    /**
+     * Finds the index of the passed node
+     * @param {HTMLElement/String/Number} nodeInfo An HTMLElement template node, index of a template node or the id of a template node
+     * @return {Number} The index of the node or -1
+     */
+     indexOf : function(node){
+        node = this.getNode(node);
+        if(typeof node.nodeIndex == 'number'){
+            return node.nodeIndex;
+        }
+        var ns = this.nodes;
+        for(var i = 0, len = ns.length; i < len; i++) {
+        	if(ns[i] == node){
+        	    return i;
+        	}
+        }
+        return -1;
+    }
+});
+
+/**
+ * @class YAHOO.ext.JsonView
+ * @extends YAHOO.ext.View
+ * Shortcut class to create a JSON + UpdateManager template view. Usage:
+<pre><code>
+var view = new YAHOO.ext.JsonView('my-element', 
+           '&lt;div id="{id}"&gt;{foo} - {bar}&lt;/div&gt;', // auto create template
+           { multiSelect: true, jsonRoot: 'data' });
+
+// listen for node click?
+view.on('click', function(vw, index, node, e){
+    alert('Node "' + node.id + '" at index: ' + index + ' was clicked.');
+});
+
+// direct load of JSON data
+view.load('foobar.php');
+
+
+// Example from my blog list
+var tpl = new YAHOO.ext.Template(
+    '&lt;div class="entry"&gt;' + 
+       '&lt;a class="entry-title" href="{link}"&gt;{title}&lt;/a&gt;' +
+       '&lt;h4&gt;{date} by {author} | {comments} Comments&lt;/h4&gt;{description}' +
+    '&lt;/div&gt;&lt;hr /&gt;'
+);
+
+var moreView = new YAHOO.ext.JsonView('entry-list', tpl, {
+   jsonRoot: 'posts'
+});
+moreView.on('beforerender', this.sortEntries, this, true);
+moreView.load({
+    url:'/blog/get-posts.php', 
+    params: 'allposts=true',
+    text:'Loading Blog Entries...'
+});
+</code></pre>
+ * @constructor
+ * Create a new JsonView
+ * @param {String/HTMLElement/Element} container The container element where the view is to be rendered.
+ * @param {DomHelper.Template} tpl The rendering template
+ * @param {Object} config The config object
+ */ 
+YAHOO.ext.JsonView = function(container, tpl, config){
+    var cfg = config || {};
+    cfg.renderUpdates = true;
+    YAHOO.ext.JsonView.superclass.constructor.call(this, container, tpl, null, cfg);        
+    /**
+     * @event beforerender
+     * Fires before rendering of the downloaded json data.
+     * @param {YAHOO.ext.View} this
+     * @param {Object} data The json data loaded
+     */
+     this.events['beforerender'] = true;
+     /**
+     * @event load
+     * Fires when data is loaded.
+     * @param {YAHOO.ext.View} this
+     * @param {Object} data The json data loaded
+     * @param {Object} response The raw Connect response object
+     */
+     this.events['load'] = true;
+     /**
+     * @event loadexception
+     * Fires when loading fails.
+     * @param {YAHOO.ext.View} this
+     * @param {Object} response The raw Connect response object
+     */
+     this.events['loadexception'] = true;
+     this.el.getUpdateManager().on('update', this.onLoad, this, true);
+     this.el.getUpdateManager().on('failure', this.onLoadException, this, true);
+};
+YAHOO.extendX(YAHOO.ext.JsonView, YAHOO.ext.View, {
+    /**
+     * Performs an async request, loading the JSON from the response. If params are specified it uses POST, otherwise it uses GET.
+     * @param {Object/String/Function} url The url for this request or a function to call to get the url or a config object containing any of the following options:
+<pre><code>
+view.load({
+    url: 'your-url.php',<br/>
+    params: {param1: 'foo', param2: 'bar'}, // or a URL encoded string<br/>
+    callback: yourFunction,<br/>
+    scope: yourObject, //(optional scope)  <br/>
+    discardUrl: false, <br/>
+    nocache: false,<br/>
+    text: 'Loading...',<br/>
+    timeout: 30,<br/>
+    scripts: false<br/>
+});   
+</code></pre>
+     * The only required property is url. The optional properties nocache, text and scripts 
+     * are shorthand for disableCaching, indicatorText and loadScripts and are used to set their associated property on this UpdateManager instance.
+     * @param {<i>String/Object</i>} params (optional) The parameters to pass as either a url encoded string "param1=1&amp;param2=2" or an object {param1: 1, param2: 2}
+     * @param {<i>Function</i>} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
+     * @param {<i>Boolean</i>} discardUrl (optional) By default when you execute an update the defaultUrl is changed to the last used url. If true, it will not store the url.
+     */
+    load : function(){
+        var um = this.el.getUpdateManager();
+        um.update.apply(um, arguments);
+    },
+    
+    /**
+     * Get the number of records in the current JSON dataset
+     * @return {Number}
+     */
+    getCount : function(){
+        return this.jsonData ? this.jsonData.length : 0;  
+    },
+    
+    /**
+     * Returns the JSON object for the specified node(s)
+     * @param {HTMLElement/Array} node The node or an array of nodes
+     * @return {Object/Array} If you pass in an array, you get an array back, otherwise 
+     * you get the JSON object for the node
+     */
+    getNodeData : function(node){
+        if(node instanceof Array){
+            var data = [];
+            for(var i = 0, len = node.length; i < len; i++){
+                data.push(this.getNodeData(node[i]));
+            }
+            return data;
+        }
+        return this.jsonData[this.indexOf(node)] || null; 
+    },
+    
+    beforeRender : function(){
+        this.snapshot = this.jsonData;    
+        if(this.sortInfo){
+            this.sort.apply(this, this.sortInfo);    
+        }
+        this.fireEvent('beforerender', this, this.jsonData);
+    },
+    
+    onLoad : function(el, o){
+       this.fireEvent('load', this, this.jsonData, o);
+    },
+    
+    onLoadException : function(el, o){
+       this.fireEvent('loadexception', this, o);
+    },
+    
+    /**
+     * Filter the data by a specific property.
+     * @param {String} property A property on your JSON objects
+     * @param {String/RegExp} value Either string that the property values 
+     * should start with or a RegExp to test against the property
+     */
+    filter : function(property, value){
+        if(this.jsonData){
+            var data = [];
+            var ss = this.snapshot;
+            if(typeof value == 'string'){
+                var vlen = value.length;
+                if(vlen == 0){
+                    this.clearFilter();
+                    return;
+                }
+                value = value.toLowerCase();
+                for(var i = 0, len = ss.length; i < len; i++){
+    				var o = ss[i];
+    				if(o[property].substr(0, vlen).toLowerCase() == value){
+    					data.push(o);
+    				}
+    			}
+            }else if(value.exec){ // regex?
+                for(var i = 0, len = ss.length; i < len; i++){
+    				var o = ss[i];
+    				if(value.test(o[property])){
+    					data.push(o);
+    				}
+    			}
+            }else{
+                return;
+            }
+            this.jsonData = data;
+    		this.refresh();
+        }
+	},
+    
+    /**
+     * Filter by a function. The passed function will be called with each 
+     * object in the current dataset. If the function returns true, the value is kept 
+     * otherwise it is filtered.
+     * @param {Function} fn
+     * @param {Object} scope (optional) The scope of the function (defaults to this JsonView) 
+     */
+    filterBy : function(fn, scope){
+        if(this.jsonData){
+            var data = [];
+            var ss = this.snapshot;
+            for(var i = 0, len = ss.length; i < len; i++){
+    			var o = ss[i];
+    			if(fn.call(scope|| this, o)){
+    				data.push(o);
+    			}
+    		}
+    		this.jsonData = data;
+    		this.refresh();
+        }
+    },
+    
+    /**
+     * Clears the current filter.
+     */
+    clearFilter : function(){
+        if(this.snapshot && this.jsonData != this.snapshot){
+            this.jsonData = this.snapshot;
+            this.refresh();
+        }   
+    },
+    
+    
+    /**
+     * Sorts the data for this view and refreshes it.
+     * @param {String} property A property on your JSON objects to sort on
+     * @param {String} direction (optional) desc or asc (defaults to asc) 
+     * @param {Function} sortType (optional) A function to call to convert the data to a sortable value.
+     */
+    sort : function(property, dir, sortType){
+        this.sortInfo = Array.prototype.slice.call(arguments, 0);
+        if(this.jsonData){
+            var p = property;
+            var dsc = dir && dir.toLowerCase() == 'desc';
+            var f = function(o1, o2){
+            	var v1 = sortType ? sortType(o1[p]) : o1[p];
+            	var v2 = sortType ? sortType(o2[p]) : o2[p];;
+            	if(v1 < v2){
+        			return dsc ? +1 : -1;
+        		}else if(v1 > v2){
+        			return dsc ? -1 : +1;
+                }else{
+        	    	return 0;
+                }
+            };
+            this.jsonData.sort(f);
+            this.refresh();
+            if(this.jsonData != this.snapshot){
+            	this.snapshot.sort(f);
+            }
+        }
+    }
+});
diff --git a/frontend/beta/js/YUI-extensions/widgets/Toolbar.js b/frontend/beta/js/YUI-extensions/widgets/Toolbar.js
new file mode 100644
index 0000000..7c14753
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/widgets/Toolbar.js
@@ -0,0 +1,296 @@
+/**
+ * @class YAHOO.ext.Toolbar
+ * Basic Toolbar used by the Grid to create the paging toolbar. This class is reusable but functionality
+ * is limited. Look for more functionality in a future version. 
+ * @constructor
+ * @param {String/HTMLElement/Element} container
+ * @param {Array} buttons (optional) array of button configs or elements to add
+ */ 
+ YAHOO.ext.Toolbar = function(container, buttons){
+    this.el = getEl(container, true);
+    var div = document.createElement('div');
+    div.className = 'ytoolbar';
+    var tb = document.createElement('table');
+    tb.border = 0;
+    tb.cellPadding = 0; 
+    tb.cellSpacing = 0;
+    div.appendChild(tb);
+    var tbody = document.createElement('tbody');
+    tb.appendChild(tbody);
+    var tr = document.createElement('tr');
+    tbody.appendChild(tr);
+    this.el.dom.appendChild(div);
+    this.tr = tr;
+    if(buttons){
+        this.add.apply(this, buttons);
+    }
+};
+
+YAHOO.ext.Toolbar.prototype = {
+    /**
+     * Adds element(s) to the toolbar - this function takes a variable number of 
+     * arguments of mixed type and adds them to the toolbar...
+     * 
+     * @param {Mixed} arg If arg is a ToolbarButton, it is added. If arg is a string, it is wrapped 
+     * in a ytb-text element and added unless the text is "separator" in which case a separator
+     * is added. Otherwise, it is assumed the element is an HTMLElement and it is added directly.
+     */
+    add : function(){
+        for(var i = 0; i < arguments.length; i++){
+            var el = arguments[i];
+            var td = document.createElement('td');
+            this.tr.appendChild(td);
+            if(el instanceof YAHOO.ext.ToolbarButton){
+                el.init(td);
+            }else if(el instanceof Array){
+                this.addButton(el);
+            }else if(typeof el == 'string'){
+                var span = document.createElement('span');
+                if(el == 'separator'){
+                    span.className = 'ytb-sep';
+                }else{
+                    span.innerHTML = el;
+                    span.className = 'ytb-text';
+                }
+                td.appendChild(span);
+            }else if(typeof el == 'object' && el.nodeType){ // must be element?
+                td.appendChild(el);
+            }else if(typeof el == 'object'){ // must be button config?
+                this.addButton(el);
+            }
+        }
+    },
+    
+    /**
+     * Returns the element for this toolbar
+     * @return {YAHOO.ext.Element}
+     */
+    getEl : function(){
+        return this.el;  
+    },
+    
+    /**
+     * Adds a separator
+     */
+    addSeparator : function(){
+        var td = document.createElement('td');
+        this.tr.appendChild(td);
+        var span = document.createElement('span');
+        span.className = 'ytb-sep';
+        td.appendChild(span);
+    },
+    
+    /**
+     * Add a button (or buttons), see {@link YAHOO.ext.ToolbarButton} for more info on the config
+     * @param {Object/Array} config A button config or array of configs
+     * @return {YAHOO.ext.ToolbarButton/Array}
+     */
+    addButton : function(config){
+        if(config instanceof Array){
+            var buttons = [];
+            for(var i = 0, len = config.length; i < len; i++) {
+            	buttons.push(this.addButton(config[i]));
+            }
+            return buttons;
+        }
+        var b = config;
+        if(!(config instanceof YAHOO.ext.ToolbarButton)){
+             b = new YAHOO.ext.ToolbarButton(config);
+        }
+        this.add(b);
+        return b;
+    },
+    
+    /**
+     * Adds text to the toolbar
+     * @param {String} text The text to add
+     * @return {HTMLElement} The span element created which you can use to update the text.
+     */
+    addText : function(text){
+        var td = document.createElement('td');
+        this.tr.appendChild(td);
+        var span = document.createElement('span');
+        span.className = 'ytb-text';
+        span.innerHTML = text;
+        td.appendChild(span);
+        return span;
+    },
+    
+    /**
+     * Inserts a button (or buttons) at the specified index
+     * @param {Number} index The index where the buttons are to be inserted
+     * @param {Object/Array} config A button config or array of configs
+     * @return {YAHOO.ext.ToolbarButton/Array}
+     */
+    insertButton : function(index, config){
+        if(config instanceof Array){
+            var buttons = [];
+            for(var i = 0, len = config.length; i < len; i++) {
+               buttons.push(this.insertButton(index + i, config[i]));
+            }
+            return buttons;
+        }
+        var b = new YAHOO.ext.ToolbarButton(config);
+        var td = document.createElement('td');
+        var nextSibling = this.tr.childNodes[index];
+        if (nextSibling)
+           this.tr.insertBefore(td, nextSibling);
+       else
+           this.tr.appendChild(td);
+        b.init(td);
+        return b;
+    }
+};
+
+/**
+ * @class YAHOO.ext.ToolbarButton
+ * A toolbar button. The config has the following options:
+ * <ul>
+ * <li>className - The CSS class for the button. Use this to attach a background image for an icon.</li>
+ * <li>text - The button's text</li>
+ * <li>tooltip - The buttons tooltip text</li>
+ * <li>click - function to call when the button is clicked</li>
+ * <li>mouseover - function to call when the mouse moves over the button</li>
+ * <li>mouseout - function to call when the mouse moves off the button</li>
+ * <li>scope - The scope of the above event handlers</li>
+ * <li></li>
+ * <li></li>
+ * @constructor
+ * @param {Object} config
+ */
+YAHOO.ext.ToolbarButton = function(config){
+    YAHOO.ext.util.Config.apply(this, config);
+};
+
+YAHOO.ext.ToolbarButton.prototype = {
+    /** @private */
+    init : function(appendTo){
+        var element = document.createElement('span');
+        element.className = 'ytb-button';
+        if(this.id){
+            element.id = this.id;
+        }
+        this.setDisabled(this.disabled === true);
+        var inner = document.createElement('span');
+        inner.className = 'ytb-button-inner ' + (this.className || this.cls);
+        inner.unselectable = 'on';
+        if(this.tooltip){
+            element.setAttribute('title', this.tooltip);
+        }
+        if(this.style){
+           YAHOO.ext.DomHelper.applyStyles(inner, this.style);
+        } 
+        element.appendChild(inner);
+        appendTo.appendChild(element);
+        this.el = getEl(element, true);
+        this.el.unselectable();
+        inner.innerHTML = (this.text ? this.text : '&#160;');
+        this.inner = inner;
+        this.el.mon('click', this.onClick, this, true);    
+        this.el.mon('mouseover', this.onMouseOver, this, true);    
+        this.el.mon('mouseout', this.onMouseOut, this, true);
+    },
+    
+    /**
+     * Sets this buttons click handler
+     * @param {Function} click The function to call when the button is clicked
+     * @param {Object} scope (optional) Scope for the function passed above
+     */
+    setHandler : function(click, scope){
+        this.click = click;
+        this.scope = scope;  
+    },
+    
+    /**
+     * Set this buttons text
+     * @param {String} text
+     */
+    setText : function(text){
+        this.inner.innerHTML = text;    
+    },
+    
+    /**
+     * Set this buttons tooltip text
+     * @param {String} text
+     */
+    setTooltip : function(text){
+        this.el.dom.title = text;    
+    },
+    
+    /**
+     * Show this button
+     */
+    show: function(){
+        this.el.dom.parentNode.style.display = '';
+    },
+    
+    /**
+     * Hide this button
+     */
+    hide: function(){
+        this.el.dom.parentNode.style.display = 'none';  
+    },
+    
+    /**
+     * Disable this button
+     */
+    disable : function(){
+        this.disabled = true;
+        if(this.el){
+            this.el.addClass('ytb-button-disabled');
+        }
+    },
+    
+    /**
+     * Enable this button
+     */
+    enable : function(){
+        this.disabled = false;
+        if(this.el){
+            this.el.removeClass('ytb-button-disabled');
+        }
+    },
+    
+    /**
+     * Returns true if this button is disabled.
+     * @return {Boolean}
+     */
+    isDisabled : function(){
+        return this.disabled === true;
+    },
+    
+    setDisabled : function(disabled){
+        if(disabled){
+            this.disable();
+        }else{
+            this.enable();
+        }
+    },
+    
+    /** @private */
+    onClick : function(){
+        if(!this.disabled && this.click){
+            this.click.call(this.scope || window, this);
+        }
+    },
+    
+    /** @private */
+    onMouseOver : function(){
+        if(!this.disabled){
+            this.el.addClass('ytb-button-over');
+            if(this.mouseover){
+                this.mouseover.call(this.scope || window, this);
+            }
+        }
+    },
+    
+    /** @private */
+    onMouseOut : function(){
+        this.el.removeClass('ytb-button-over');
+        if(!this.disabled){
+            if(this.mouseout){
+                this.mouseout.call(this.scope || window, this);
+            }
+        }
+    }
+};
diff --git a/frontend/beta/js/YUI-extensions/yutil.js b/frontend/beta/js/YUI-extensions/yutil.js
new file mode 100644
index 0000000..a815397
--- a/dev/null
+++ b/frontend/beta/js/YUI-extensions/yutil.js
@@ -0,0 +1,637 @@
+YAHOO.namespace('ext', 'ext.util', 'ext.grid', 'ext.dd', 'ext.tree', 'ext.data', 'ext.form');
+if(typeof Ext == 'undefined'){
+    Ext = YAHOO.ext;
+}
+YAHOO.ext.Strict = (document.compatMode == 'CSS1Compat');
+YAHOO.ext.SSL_SECURE_URL = 'javascript:false';
+YAHOO.ext.BLANK_IMAGE_URL = 'http:/'+'/www.yui-ext.com/blog/images/s.gif';
+
+// for old browsers
+window.undefined = undefined;
+/**
+ * @class Function
+ * These functions are available on every Function object (any javascript function).
+ */
+ //
+ /**
+ * Creates a callback that passes arguments[0], arguments[1], arguments[2], ...
+ * Call directly on any function. Example: <code>myFunction.createCallback(myarg, myarg2)</code>
+ * Will create a function that is bound to those 2 args.
+ * @return {Function} The new function
+*/
+Function.prototype.createCallback = function(/*args...*/){
+    // make args available, in function below
+    var args = arguments;
+    var method = this;
+    return function() {
+        return method.apply(window, args);
+    };
+};
+
+/**
+ * Creates a delegate (callback) that sets the scope to obj.
+ * Call directly on any function. Example: <code>this.myFunction.createDelegate(this)</code>
+ * Will create a function that is automatically scoped to this.
+ * @param {Object} obj (optional) The object for which the scope is set
+ * @param {<i>Array</i>} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+ * @param {<i>Boolean/Number</i>} appendArgs (optional) if True args are appended to call args instead of overriding, 
+ *                                             if a number the args are inserted at the specified position
+ * @return {Function} The new function
+ */
+Function.prototype.createDelegate = function(obj, args, appendArgs){
+    var method = this;
+    return function() {
+        var callArgs = args || arguments;
+        if(appendArgs === true){
+            callArgs = Array.prototype.slice.call(arguments, 0);
+            callArgs = callArgs.concat(args);
+        }else if(typeof appendArgs == 'number'){
+            callArgs = Array.prototype.slice.call(arguments, 0); // copy arguments first
+            var applyArgs = [appendArgs, 0].concat(args); // create method call params
+            Array.prototype.splice.apply(callArgs, applyArgs); // splice them in
+        }
+        return method.apply(obj || window, callArgs);
+    };
+};
+
+/**
+ * Calls this function after the number of millseconds specified.
+ * @param {Number} millis The number of milliseconds for the setTimeout call
+ * @param {Object} obj (optional) The object for which the scope is set
+ * @param {<i>Array</i>} args (optional) Overrides arguments for the call. (Defaults to the arguments passed by the caller)
+ * @param {<i>Boolean/Number</i>} appendArgs (optional) if True args are appended to call args instead of overriding, 
+ *                                             if a number the args are inserted at the specified position
+ * @return {Number} The timeout id that can be used with clearTimeout
+ */
+Function.prototype.defer = function(millis, obj, args, appendArgs){
+    return setTimeout(this.createDelegate(obj, args, appendArgs), millis);
+};
+/**
+ * Create a combined function call sequence of the original function + the passed function.
+ * The resulting function returns the results of the original function.
+ * The passed fcn is called with the parameters of the original function
+ * @param {Function} fcn The function to sequence
+ * @param {<i>Object</i>} scope (optional) The scope of the passed fcn (Defaults to scope of original function or window)
+ * @return {Function} The new function
+ */
+Function.prototype.createSequence = function(fcn, scope){
+    if(typeof fcn != 'function'){
+        return this;
+    }
+    var method = this;
+    return function() {
+        var retval = method.apply(this || window, arguments);
+        fcn.apply(scope || this || window, arguments);
+        return retval;
+    };
+};
+
+/*
+ * IE will leak if this isn't here
+ */
+YAHOO.util.Event.on(window, 'unload', function(){
+    var p = Function.prototype;
+    delete p.createSequence;
+    delete p.defer;
+    delete p.createDelegate;
+    delete p.createCallback;
+    delete p.createInterceptor;
+});
+
+/**
+ * Creates an interceptor function. The passed fcn is called before the original one. If it returns false, the original one is not called.
+ * The resulting function returns the results of the original function.
+ * The passed fcn is called with the parameters of the original function.
+ * @addon
+ * @param {Function} fcn The function to call before the original
+ * @param {<i>Object</i>} scope (optional) The scope of the passed fcn (Defaults to scope of original function or window)
+ * @return {Function} The new function
+ */
+Function.prototype.createInterceptor = function(fcn, scope){
+    if(typeof fcn != 'function'){
+        return this;
+    }
+    var method = this;
+    return function() {
+        fcn.target = this;
+        fcn.method = method;
+        if(fcn.apply(scope || this || window, arguments) === false){
+            return;
+        }
+        return method.apply(this || window, arguments);;
+    };
+};
+
+/**
+ * @class YAHOO.ext.util.Browser
+ * @singleton
+ */
+YAHOO.ext.util.Browser = new function(){
+	var ua = navigator.userAgent.toLowerCase();
+	/** @type Boolean */
+	this.isOpera = (ua.indexOf('opera') > -1);
+   	/** @type Boolean */
+	this.isSafari = (ua.indexOf('webkit') > -1);
+   	/** @type Boolean */
+	this.isIE = (window.ActiveXObject);
+   	/** @type Boolean */
+	this.isIE7 = (ua.indexOf('msie 7') > -1);
+   	/** @type Boolean */
+	this.isGecko = !this.isSafari && (ua.indexOf('gecko') > -1);
+	
+	if(ua.indexOf("windows") != -1 || ua.indexOf("win32") != -1){
+	    /** @type Boolean */
+	    this.isWindows = true;
+	}else if(ua.indexOf("macintosh") != -1){
+		/** @type Boolean */
+	    this.isMac = true;
+	}
+	if(this.isIE && !this.isIE7){
+        try{
+            document.execCommand("BackgroundImageCache", false, true);
+        }catch(e){}
+    }
+}();
+
+ /**
+ * Enable custom handler signature and event cancelling. Using fireDirect() instead of fire() calls the subscribed event handlers 
+ * with the exact parameters passed to fireDirect, instead of the usual (eventType, args[], obj). IMO this is more intuitive 
+ * and promotes cleaner code. Also, if an event handler returns false, it is returned by fireDirect and no other handlers will be called.<br>
+ * Example:<br><br><pre><code>
+ * if(beforeUpdateEvent.fireDirect(myArg, myArg2) !== false){
+ *     // do update
+ * }</code></pre>
+ */
+YAHOO.util.CustomEvent.prototype.fireDirect = function(){
+    var len=this.subscribers.length;
+    for (var i=0; i<len; ++i) {
+        var s = this.subscribers[i];
+        if(s){
+            var scope = (s.override) ? s.obj : this.scope;
+            if(s.fn.apply(scope, arguments) === false){
+                return false;
+            }
+        }
+    }
+    return true;
+};
+
+/**
+ * @class YAHOO-
+ * Additional functionality for the global YAHOO object.
+ * @singleton
+ */
+/**
+ * Prints all arguments to a resizable, movable, scrolling region without
+ * the need to include separate js or css. Double click it to hide it.
+ * @param {Mixed} arg1
+ * @param {Mixed} arg2
+ * @param {Mixed} etc
+ * @static
+ */
+YAHOO.print = function(arg1, arg2, etc){
+    if(!YAHOO.ext._console){
+        var cs = YAHOO.ext.DomHelper.insertBefore(document.body.firstChild,
+        {tag: 'div',style:'width:250px;height:350px;overflow:auto;border:3px solid #c3daf9;' +
+                'background:white;position:absolute;right:5px;top:5px;' +
+                'font:normal 8pt arial,verdana,helvetica;z-index:50000;padding:5px;'}, true);
+        if(YAHOO.ext.Resizable){
+            new YAHOO.ext.Resizable(cs, {
+                transparent:true,
+                handles: 'all',
+                pinned:true, 
+                adjustments: [0,0], 
+                wrap:true, 
+                draggable:(YAHOO.util.DD ? true : false)
+            });
+        }
+        cs.on('dblclick', cs.hide);
+        YAHOO.ext._console = cs;
+    }
+    var m = '';
+    for(var i = 0, len = arguments.length; i < len; i++) {
+    	m += (i == 0 ? '' : ', ') + arguments[i];
+    }
+    m += '<hr noshade style="color:#eeeeee;" size="1">'
+    var d = YAHOO.ext._console.dom;
+    d.innerHTML = m + d.innerHTML;
+    d.scrollTop = 0;
+    YAHOO.ext._console.show();
+};
+
+/**
+ * Applies the passed C#/DomHelper style format (e.g. "The variable {0} is equal to {1}") before calling {@link YAHOO#print}
+ * @param {String} format
+ * @param {Mixed} arg1
+ * @param {Mixed} arg2
+ * @param {Mixed} etc
+ * @static
+ */
+YAHOO.printf = function(format, arg1, arg2, etc){
+    var args = Array.prototype.slice.call(arguments, 1);
+    YAHOO.print(format.replace(
+      /\{\{[^{}]*\}\}|\{(\d+)(,\s*([\w.]+))?\}/g,
+      function(m, a1, a2, a3) {
+        if (m.chatAt == '{') {
+          return m.slice(1, -1);
+        }
+        var rpl = args[a1];
+        if (a3) {
+          var f = eval(a3);
+          rpl = f(rpl);
+        }
+        return rpl ? rpl : '';
+      }));
+}
+
+YAHOO._timers = {};
+/**
+ * If a timer with specified name doesn't exist it is started. If one exists and reset is not true
+ * it prints the ellapsed time since the start using YAHOO.printf.
+ * @param {String} name
+ * @param {Boolean} reset true to reset an existing timer
+ */
+YAHOO.timer = function(name, reset){
+    var t = new Date().getTime();
+    if(YAHOO._timers[name] && !reset){
+        YAHOO.printf("{0} : {1} ms", name, t-YAHOO._timers[name]);
+    }else{
+        YAHOO._timers[name] = t;
+    }
+}
+/**
+ * Extends one class with another class and optionally overrides members with the passed literal. This class
+ * also adds the function "override()" to the class that can be used to override 
+ * members on an instance.
+ * @param {Object} subclass The class inheriting the functionality
+ * @param {Object} superclass The class being extended
+ * @param {Object} overrides (optional) A literal with members
+ * @static
+ */
+YAHOO.extendX = function(subclass, superclass, overrides){
+    YAHOO.extend(subclass, superclass);
+    subclass.override = function(o){
+        YAHOO.override(subclass, o);
+    };
+    if(!subclass.prototype.override){
+        subclass.prototype.override = function(o){
+            for(var method in o){
+                this[method] = o[method];
+            }  
+        };
+    }
+    if(overrides){
+        subclass.override(overrides);
+    }
+};
+
+/**
+ * Creates namespaces but does not assume YAHOO is the root.
+ * @param {String} namespace1
+ * @param {String} namespace2
+ * @param {String} etc
+ * @static
+ */
+YAHOO.namespaceX = function(){
+    var a = arguments, len = a.length, i;
+    YAHOO.namespace.apply(YAHOO, a);
+    for(i = 0; i < len; i++){
+        var p = a[i].split('.')[0];
+        if(p != 'YAHOO' && YAHOO[p]){
+            eval(p + ' = YAHOO.' + p);
+            delete YAHOO[p];
+        }
+    }
+};
+
+YAHOO.override = function(origclass, overrides){
+    if(overrides){
+        var p = origclass.prototype;
+        for(var method in overrides){
+            p[method] = overrides[method];
+        }
+    }
+};
+
+/**
+ * @class YAHOO.ext.util.DelayedTask
+ * Provides a convenient method of performing setTimeout where a new
+ * timeout cancels the old timeout. An example would be performing validation on a keypress.
+ * You can use this class to buffer
+ * the keypress events for a certain number of milliseconds, and perform only if they stop
+ * for that amount of time.
+ * @constructor The parameters to this constructor serve as defaults and are not required.
+ * @param {<i>Function</i>} fn (optional) The default function to timeout
+ * @param {<i>Object</i>} scope (optional) The default scope of that timeout
+ * @param {<i>Array</i>} args (optional) The default Array of arguments
+ */
+YAHOO.ext.util.DelayedTask = function(fn, scope, args){
+    var timeoutId = null;
+    
+    /**
+     * Cancels any pending timeout and queues a new one
+     * @param {Number} delay The milliseconds to delay
+     * @param {Function} newFn (optional) Overrides function passed to constructor
+     * @param {Object} newScope (optional) Overrides scope passed to constructor
+     * @param {Array} newArgs (optional) Overrides args passed to constructor
+     */
+    this.delay = function(delay, newFn, newScope, newArgs){
+        if(timeoutId){
+            clearTimeout(timeoutId);
+        }
+        fn = newFn || fn;
+        scope = newScope || scope;
+        args = newArgs || args;
+        timeoutId = setTimeout(fn.createDelegate(scope, args), delay);
+    };
+    
+    /**
+     * Cancel the last queued timeout
+     */
+    this.cancel = function(){
+        if(timeoutId){
+            clearTimeout(timeoutId);
+            timeoutId = null;
+        }
+    };
+};
+
+/**
+ * @class YAHOO.ext.util.Observable
+ * Abstract base class that provides a common interface for publishing events. Subclasses are expected to 
+ * to have a property "events" with all the events defined.<br>
+ * For example:
+ * <pre><code>
+ var Employee = function(name){
+    this.name = name;
+    this.events = {
+        'fired' : new YAHOO.util.CustomEvent('fired'),
+        'quit' : true // lazy initialize the CustomEvent
+    }
+ }
+ YAHOO.extend(Employee, YAHOO.ext.util.Observable);
+</code></pre>
+ */
+YAHOO.ext.util.Observable = function(){};
+YAHOO.ext.util.Observable.prototype = {
+    /**
+     * Fires the specified event with the passed parameters (minus the event name).
+     * @param {String} eventName
+     * @param {Object...} args Variable number of parameters are passed to handlers
+     * @return {Boolean} returns false if any of the handlers return false otherwise it returns true
+     */
+    fireEvent : function(){
+        var ce = this.events[arguments[0].toLowerCase()];
+        if(typeof ce == 'object'){
+            return ce.fireDirect.apply(ce, Array.prototype.slice.call(arguments, 1));
+        }else{
+            return true;
+        }
+    },
+    /**
+     * Appends an event handler to this component
+     * @param {String}   eventName     The type of event to listen for
+     * @param {Function} handler        The method the event invokes
+     * @param {<i>Object</i>}   scope  (optional) The scope (this object) for the handler
+     * @param {<i>boolean</i>}  override (optional) If true, scope becomes the scope
+     */
+    addListener : function(eventName, fn, scope, override){
+        eventName = eventName.toLowerCase();
+        var ce = this.events[eventName];
+        if(!ce){
+            // added for a better message when subscribing to wrong event
+            throw 'You are trying to listen for an event that does not exist: "' + eventName + '".';
+        }
+        if(typeof ce == 'boolean'){
+            ce = new YAHOO.util.CustomEvent(eventName);
+            this.events[eventName] = ce;
+        }
+        ce.subscribe(fn, scope, override);
+    },
+    
+    /**
+     * Appends an event handler to this component that is delayed the specified number of milliseconds. This
+     * is useful for events that modify the DOM and need to wait for the browser to catch up.
+     * @param {String}   eventName     The type of event to listen for
+     * @param {Function} handler        The method the event invokes
+     * @param {<i>Object</i>}   scope  (optional) The scope (this object) for the handler
+     * @param {<i>Number</i>}  delay (optional) The number of milliseconds to delay (defaults to 1 millisecond)
+     * @return {Function} The wrapped function that was created (can be used to remove the listener)
+     */
+    delayedListener : function(eventName, fn, scope, delay){
+        var newFn = function(){
+            setTimeout(fn.createDelegate(scope, arguments), delay || 1);
+        }
+        this.addListener(eventName, newFn);
+        return newFn;
+    },
+    
+    /**
+     * Appends an event handler to this component that is buffered. If the event is triggered more than once
+     * in the specified time-frame, only the last one actually fires.
+     * @param {String}   eventName     The type of event to listen for
+     * @param {Function} handler        The method the event invokes
+     * @param {<i>Object</i>}   scope  (optional) The scope (this object) for the handler
+     * @param {<i>Number</i>}  millis (optional) The number of milliseconds to buffer (defaults to 250)
+     * @return {Function} The wrapped function that was created (can be used to remove the listener)
+     */
+    bufferedListener : function(eventName, fn, scope, millis){
+        var task = new YAHOO.ext.util.DelayedTask();
+        var newFn = function(){
+            task.delay(millis || 250, fn, scope, Array.prototype.slice.call(arguments, 0));
+        }
+        this.addListener(eventName, newFn);
+        return newFn;
+    },
+    
+    /**
+     * Removes a listener
+     * @param {String}   eventName     The type of event to listen for
+     * @param {Function} handler        The handler to remove
+     * @param {<i>Object</i>}   scope  (optional) The scope (this object) for the handler
+     */
+    removeListener : function(eventName, fn, scope){
+        var ce = this.events[eventName.toLowerCase()];
+        if(typeof ce == 'object'){
+            ce.unsubscribe(fn, scope);
+        }
+    },
+    
+    /**
+     * Removes all listeners for this object
+     */
+    purgeListeners : function(){
+        for(var evt in this.events){
+            if(typeof this.events[evt] == 'object'){
+                 this.events[evt].unsubscribeAll();
+            }
+        }
+    }
+};
+/**
+ * Appends an event handler to this element (shorthand for addListener)
+ * @param {String}   eventName     The type of event to listen for
+ * @param {Function} handler        The method the event invokes
+ * @param {<i>Object</i>}   scope  (optional) The scope (this object) for the handler
+ * @param {<i>boolean</i>}  override (optional) If true, scope becomes the scope
+ * @method
+ */
+YAHOO.ext.util.Observable.prototype.on = YAHOO.ext.util.Observable.prototype.addListener;
+
+/**
+ * Starts capture on the specified Observable. All events will be passed
+ * to the supplied function with the event name + standard signature of the event 
+ * <b>before</b> the event is fired. If the supplied function returns false,
+ * the event will not fire.
+ * @param {Observable} o The Observable to capture
+ * @param {Function} fn The function to call
+ * @param {Object} scope (optional) The scope (this object) for the fn
+ * @static
+ */
+YAHOO.ext.util.Observable.capture = function(o, fn, scope){
+    o.fireEvent = o.fireEvent.createInterceptor(fn, scope);  
+};
+
+/**
+ * Removes <b>all</b> added captures from the Observable. 
+ * @param {Observable} o The Observable to release
+ * @static
+ */
+YAHOO.ext.util.Observable.releaseCapture = function(o){
+    o.fireEvent = YAHOO.ext.util.Observable.prototype.fireEvent;  
+};
+
+/**
+ * @class YAHOO.ext.util.Config
+ * Class with one useful method
+ * @singleton
+ */
+YAHOO.ext.util.Config = {
+    /**
+     * Copies all the properties of config to obj.
+     * @param {Object} obj The receiver of the properties
+     * @param {Object} config The source of the properties
+     * @param {Object} defaults A different object that will also be applied for default values
+     * @return {Object} returns obj
+     */
+    apply : function(obj, config, defaults){
+        if(defaults){
+            this.apply(obj, defaults);
+        }
+        if(config){
+            for(var prop in config){
+                obj[prop] = config[prop];
+            }
+        }
+        return obj;
+    }
+};
+
+if(!String.escape){
+    String.escape = function(string) {
+        return string.replace(/('|\\)/g, "\\$1");
+    };
+};
+
+String.leftPad = function (val, size, ch) {
+    var result = new String(val);
+    if (ch == null) {
+        ch = " ";
+    }
+    while (result.length < size) {
+        result = ch + result;
+    }
+    return result;
+};
+
+// workaround for Safari anim duration speed problems
+if(YAHOO.util.AnimMgr && YAHOO.ext.util.Browser.isSafari){
+    YAHOO.util.AnimMgr.fps = 500;  
+}
+
+// add ability for callbacks instead of events for animations
+if(YAHOO.util.Anim){
+    YAHOO.util.Anim.prototype.animateX = function(callback, scope){
+        var f = function(){
+            this.onComplete.unsubscribe(f);
+            if(typeof callback == 'function'){
+                callback.call(scope || this, this);
+            }
+        };
+        this.onComplete.subscribe(f, this, true);
+        this.animate();
+    };
+}
+
+// workaround for Safari 1.3 not supporting hasOwnProperty
+if(YAHOO.util.Connect && YAHOO.ext.util.Browser.isSafari){
+    YAHOO.util.Connect.setHeader = function(o){
+		for(var prop in this._http_header){
+		    // if(this._http_header.hasOwnProperty(prop)){
+			if(typeof this._http_header[prop] != 'function'){
+				o.conn.setRequestHeader(prop, this._http_header[prop]);
+			}
+		}
+		delete this._http_header;
+		this._http_header = {};
+		this._has_http_headers = false;
+	};   
+}
+/**
+ * A simple enhancement to drag drop that allows you to constrain the movement of the
+ * DD or DDProxy object to a particular element.<br /><br />
+ * 
+ * Usage:
+ <pre><code>
+ var dd = new YAHOO.util.DDProxy("dragDiv1", "proxytest",  
+                { dragElId: "existingProxyDiv" });
+ dd.startDrag = function(){
+     this.constrainTo('parent-id');
+ }; 
+ </code></pre>
+ * Or you can initalize it using the {@link YAHOO.ext.Element} object:
+ <pre><code>
+ getEl('dragDiv1').initDDProxy('proxytest', {dragElId: "existingProxyDiv"}, {
+     startDrag : function(){
+         this.constrainTo('parent-id');
+     }
+ });
+ </code></pre>
+ */
+if(YAHOO.util.DragDrop){
+    /**
+     * Provides default constraint padding to "constrainTo" elements (defaults to {left: 0, right:0, top:0, bottom:0}).
+     * @type Object
+     */
+    YAHOO.util.DragDrop.prototype.defaultPadding = {left:0, right:0, top:0, bottom:0};
+    
+    /**
+     * Initializes the drag drop object's constraints to restrict movement to a certain element.
+     * @param {String/HTMLElement/Element} constrainTo The element to constrain to.
+     * @param {Object/Number} pad (optional) Pad provides a way to specify "padding" of the constraints, 
+     * and can be either a number for symmetrical padding (4 would be equal to {left:4, right:4, top:4, bottom:4}) or
+     * an object containing the sides to pad. For example: {right:10, bottom:10}
+     * @param {Boolean} inContent (optional) Constrain the draggable in the content box of the element (inside padding and borders)
+     */
+    YAHOO.util.DragDrop.prototype.constrainTo = function(constrainTo, pad, inContent){
+        if(typeof pad == 'number'){
+            pad = {left: pad, right:pad, top:pad, bottom:pad};
+        }
+        pad = pad || this.defaultPadding;
+        var b = getEl(this.getEl()).getBox();
+        var ce = getEl(constrainTo);
+        var c = ce.dom == document.body ? { x: 0, y: 0,
+                width: YAHOO.util.Dom.getViewportWidth(),
+                height: YAHOO.util.Dom.getViewportHeight()} : ce.getBox(inContent || false);
+        var topSpace = b.y - c.y;
+        var leftSpace = b.x - c.x;
+
+        this.resetConstraints();
+        this.setXConstraint(leftSpace - (pad.left||0), // left
+                c.width - leftSpace - b.width - (pad.right||0) //right
+        );
+        this.setYConstraint(topSpace - (pad.top||0), //top
+                c.height - topSpace - b.height - (pad.bottom||0) //bottom
+        );
+    } 
+}
diff --git a/frontend/beta/js/YUI/animation.js b/frontend/beta/js/YUI/animation.js
new file mode 100644
index 0000000..333f946
--- a/dev/null
+++ b/frontend/beta/js/YUI/animation.js
@@ -0,0 +1,1272 @@
+/*
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 0.12.0
+*/
+
+/**
+ * The animation module provides allows effects to be added to HTMLElements.
+ * @module animation
+ */
+
+/**
+ *
+ * Base animation class that provides the interface for building animated effects.
+ * <p>Usage: var myAnim = new YAHOO.util.Anim(el, { width: { from: 10, to: 100 } }, 1, YAHOO.util.Easing.easeOut);</p>
+ * @class Anim
+ * @namespace YAHOO.util
+ * @requires YAHOO.util.AnimMgr
+ * @requires YAHOO.util.Easing
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @requires YAHOO.util.CustomEvent
+ * @constructor
+ * @param {String | HTMLElement} el Reference to the element that will be animated
+ * @param {Object} attributes The attribute(s) to be animated.
+ * Each attribute is an object with at minimum a "to" or "by" member defined.
+ * Additional optional members are "from" (defaults to current value), "units" (defaults to "px").
+ * All attribute names use camelCase.
+ * @param {Number} duration (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
+ * @param {Function} method (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
+ */
+
+YAHOO.util.Anim = function(el, attributes, duration, method) {
+   if (el) {
+      this.init(el, attributes, duration, method);
+   }
+};
+
+YAHOO.util.Anim.prototype = {
+   /**
+    * Provides a readable name for the Anim instance.
+    * @method toString
+    * @return {String}
+    */
+   toString: function() {
+      var el = this.getEl();
+      var id = el.id || el.tagName;
+      return ("Anim " + id);
+   },
+
+   patterns: { // cached for performance
+      noNegatives:      /width|height|opacity|padding/i, // keep at zero or above
+      offsetAttribute:  /^((width|height)|(top|left))$/, // use offsetValue as default
+      defaultUnit:      /width|height|top$|bottom$|left$|right$/i, // use 'px' by default
+      offsetUnit:       /\d+(em|%|en|ex|pt|in|cm|mm|pc)$/i // IE may return these, so convert these to offset
+   },
+
+   /**
+    * Returns the value computed by the animation's "method".
+    * @method doMethod
+    * @param {String} attr The name of the attribute.
+    * @param {Number} start The value this attribute should start from for this animation.
+    * @param {Number} end  The value this attribute should end at for this animation.
+    * @return {Number} The Value to be applied to the attribute.
+    */
+   doMethod: function(attr, start, end) {
+      return this.method(this.currentFrame, start, end - start, this.totalFrames);
+   },
+
+   /**
+    * Applies a value to an attribute.
+    * @method setAttribute
+    * @param {String} attr The name of the attribute.
+    * @param {Number} val The value to be applied to the attribute.
+    * @param {String} unit The unit ('px', '%', etc.) of the value.
+    */
+   setAttribute: function(attr, val, unit) {
+      if ( this.patterns.noNegatives.test(attr) ) {
+         val = (val > 0) ? val : 0;
+      }
+
+      YAHOO.util.Dom.setStyle(this.getEl(), attr, val + unit);
+   },
+
+   /**
+    * Returns current value of the attribute.
+    * @method getAttribute
+    * @param {String} attr The name of the attribute.
+    * @return {Number} val The current value of the attribute.
+    */
+   getAttribute: function(attr) {
+      var el = this.getEl();
+      var val = YAHOO.util.Dom.getStyle(el, attr);
+
+      if (val !== 'auto' && !this.patterns.offsetUnit.test(val)) {
+         return parseFloat(val);
+      }
+
+      var a = this.patterns.offsetAttribute.exec(attr) || [];
+      var pos = !!( a[3] ); // top or left
+      var box = !!( a[2] ); // width or height
+
+      // use offsets for width/height and abs pos top/left
+      if ( box || (YAHOO.util.Dom.getStyle(el, 'position') == 'absolute' && pos) ) {
+         val = el['offset' + a[0].charAt(0).toUpperCase() + a[0].substr(1)];
+      } else { // default to zero for other 'auto'
+         val = 0;
+      }
+
+      return val;
+   },
+
+   /**
+    * Returns the unit to use when none is supplied.
+    * @method getDefaultUnit
+    * @param {attr} attr The name of the attribute.
+    * @return {String} The default unit to be used.
+    */
+   getDefaultUnit: function(attr) {
+       if ( this.patterns.defaultUnit.test(attr) ) {
+         return 'px';
+       }
+
+       return '';
+   },
+
+   /**
+    * Sets the actual values to be used during the animation.
+    * @method setRuntimeAttribute
+    * Should only be needed for subclass use.
+    * @param {Object} attr The attribute object
+    * @private
+    */
+   setRuntimeAttribute: function(attr) {
+      var start;
+      var end;
+      var attributes = this.attributes;
+
+      this.runtimeAttributes[attr] = {};
+
+      var isset = function(prop) {
+         return (typeof prop !== 'undefined');
+      };
+
+      if ( !isset(attributes[attr]['to']) && !isset(attributes[attr]['by']) ) {
+         return false; // note return; nothing to animate to
+      }
+
+      start = ( isset(attributes[attr]['from']) ) ? attributes[attr]['from'] : this.getAttribute(attr);
+
+      // To beats by, per SMIL 2.1 spec
+      if ( isset(attributes[attr]['to']) ) {
+         end = attributes[attr]['to'];
+      } else if ( isset(attributes[attr]['by']) ) {
+         if (start.constructor == Array) {
+            end = [];
+            for (var i = 0, len = start.length; i < len; ++i) {
+               end[i] = start[i] + attributes[attr]['by'][i];
+            }
+         } else {
+            end = start + attributes[attr]['by'];
+         }
+      }
+
+      this.runtimeAttributes[attr].start = start;
+      this.runtimeAttributes[attr].end = end;
+
+      // set units if needed
+      this.runtimeAttributes[attr].unit = ( isset(attributes[attr].unit) ) ? attributes[attr]['unit'] : this.getDefaultUnit(attr);
+   },
+
+   /**
+    * Constructor for Anim instance.
+    * @method init
+    * @param {String | HTMLElement} el Reference to the element that will be animated
+    * @param {Object} attributes The attribute(s) to be animated.
+    * Each attribute is an object with at minimum a "to" or "by" member defined.
+    * Additional optional members are "from" (defaults to current value), "units" (defaults to "px").
+    * All attribute names use camelCase.
+    * @param {Number} duration (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
+    * @param {Function} method (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
+    */
+   init: function(el, attributes, duration, method) {
+      /**
+       * Whether or not the animation is running.
+       * @property isAnimated
+       * @private
+       * @type Boolean
+       */
+      var isAnimated = false;
+
+      /**
+       * A Date object that is created when the animation begins.
+       * @property startTime
+       * @private
+       * @type Date
+       */
+      var startTime = null;
+
+      /**
+       * The number of frames this animation was able to execute.
+       * @property actualFrames
+       * @private
+       * @type Int
+       */
+      var actualFrames = 0;
+
+      /**
+       * The element to be animated.
+       * @property el
+       * @private
+       * @type HTMLElement
+       */
+      el = YAHOO.util.Dom.get(el);
+
+      /**
+       * The collection of attributes to be animated.
+       * Each attribute must have at least a "to" or "by" defined in order to animate.
+       * If "to" is supplied, the animation will end with the attribute at that value.
+       * If "by" is supplied, the animation will end at that value plus its starting value.
+       * If both are supplied, "to" is used, and "by" is ignored.
+       * Optional additional member include "from" (the value the attribute should start animating from, defaults to current value), and "unit" (the units to apply to the values).
+       * @property attributes
+       * @type Object
+       */
+      this.attributes = attributes || {};
+
+      /**
+       * The length of the animation.  Defaults to "1" (second).
+       * @property duration
+       * @type Number
+       */
+      this.duration = duration || 1;
+
+      /**
+       * The method that will provide values to the attribute(s) during the animation.
+       * Defaults to "YAHOO.util.Easing.easeNone".
+       * @property method
+       * @type Function
+       */
+      this.method = method || YAHOO.util.Easing.easeNone;
+
+      /**
+       * Whether or not the duration should be treated as seconds.
+       * Defaults to true.
+       * @property useSeconds
+       * @type Boolean
+       */
+      this.useSeconds = true; // default to seconds
+
+      /**
+       * The location of the current animation on the timeline.
+       * In time-based animations, this is used by AnimMgr to ensure the animation finishes on time.
+       * @property currentFrame
+       * @type Int
+       */
+      this.currentFrame = 0;
+
+      /**
+       * The total number of frames to be executed.
+       * In time-based animations, this is used by AnimMgr to ensure the animation finishes on time.
+       * @property totalFrames
+       * @type Int
+       */
+      this.totalFrames = YAHOO.util.AnimMgr.fps;
+
+
+      /**
+       * Returns a reference to the animated element.
+       * @method getEl
+       * @return {HTMLElement}
+       */
+      this.getEl = function() { return el; };
+
+      /**
+       * Checks whether the element is currently animated.
+       * @method isAnimated
+       * @return {Boolean} current value of isAnimated.
+       */
+      this.isAnimated = function() {
+         return isAnimated;
+      };
+
+      /**
+       * Returns the animation start time.
+       * @method getStartTime
+       * @return {Date} current value of startTime.
+       */
+      this.getStartTime = function() {
+         return startTime;
+      };
+
+      this.runtimeAttributes = {};
+
+
+
+      /**
+       * Starts the animation by registering it with the animation manager.
+       * @method animate
+       */
+      this.animate = function() {
+         if ( this.isAnimated() ) { return false; }
+
+         this.currentFrame = 0;
+
+         this.totalFrames = ( this.useSeconds ) ? Math.ceil(YAHOO.util.AnimMgr.fps * this.duration) : this.duration;
+
+         YAHOO.util.AnimMgr.registerElement(this);
+      };
+
+      /**
+       * Stops the animation.  Normally called by AnimMgr when animation completes.
+       * @method stop
+       * @param {Boolean} finish (optional) If true, animation will jump to final frame.
+       */
+      this.stop = function(finish) {
+         if (finish) {
+             this.currentFrame = this.totalFrames;
+             this._onTween.fire();
+         }
+         YAHOO.util.AnimMgr.stop(this);
+      };
+
+      var onStart = function() {
+         this.onStart.fire();
+
+         this.runtimeAttributes = {};
+         for (var attr in this.attributes) {
+            this.setRuntimeAttribute(attr);
+         }
+
+         isAnimated = true;
+         actualFrames = 0;
+         startTime = new Date();
+      };
+
+      /**
+       * Feeds the starting and ending values for each animated attribute to doMethod once per frame, then applies the resulting value to the attribute(s).
+       * @private
+       */
+
+      var onTween = function() {
+         var data = {
+            duration: new Date() - this.getStartTime(),
+            currentFrame: this.currentFrame
+         };
+
+         data.toString = function() {
+            return (
+               'duration: ' + data.duration +
+               ', currentFrame: ' + data.currentFrame
+            );
+         };
+
+         this.onTween.fire(data);
+
+         var runtimeAttributes = this.runtimeAttributes;
+
+         for (var attr in runtimeAttributes) {
+            this.setAttribute(attr, this.doMethod(attr, runtimeAttributes[attr].start, runtimeAttributes[attr].end), runtimeAttributes[attr].unit);
+         }
+
+         actualFrames += 1;
+      };
+
+      var onComplete = function() {
+         var actual_duration = (new Date() - startTime) / 1000 ;
+
+         var data = {
+            duration: actual_duration,
+            frames: actualFrames,
+            fps: actualFrames / actual_duration
+         };
+
+         data.toString = function() {
+            return (
+               'duration: ' + data.duration +
+               ', frames: ' + data.frames +
+               ', fps: ' + data.fps
+            );
+         };
+
+         isAnimated = false;
+         actualFrames = 0;
+         this.onComplete.fire(data);
+      };
+
+      /**
+       * Custom event that fires after onStart, useful in subclassing
+       * @private
+       */
+      this._onStart = new YAHOO.util.CustomEvent('_start', this, true);
+
+      /**
+       * Custom event that fires when animation begins
+       * Listen via subscribe method (e.g. myAnim.onStart.subscribe(someFunction)
+       * @event onStart
+       */
+      this.onStart = new YAHOO.util.CustomEvent('start', this);
+
+      /**
+       * Custom event that fires between each frame
+       * Listen via subscribe method (e.g. myAnim.onTween.subscribe(someFunction)
+       * @event onTween
+       */
+      this.onTween = new YAHOO.util.CustomEvent('tween', this);
+
+      /**
+       * Custom event that fires after onTween
+       * @private
+       */
+      this._onTween = new YAHOO.util.CustomEvent('_tween', this, true);
+
+      /**
+       * Custom event that fires when animation ends
+       * Listen via subscribe method (e.g. myAnim.onComplete.subscribe(someFunction)
+       * @event onComplete
+       */
+      this.onComplete = new YAHOO.util.CustomEvent('complete', this);
+      /**
+       * Custom event that fires after onComplete
+       * @private
+       */
+      this._onComplete = new YAHOO.util.CustomEvent('_complete', this, true);
+
+      this._onStart.subscribe(onStart);
+      this._onTween.subscribe(onTween);
+      this._onComplete.subscribe(onComplete);
+   }
+};
+
+/**
+ * Handles animation queueing and threading.
+ * Used by Anim and subclasses.
+ * @class AnimMgr
+ * @namespace YAHOO.util
+ */
+YAHOO.util.AnimMgr = new function() {
+   /**
+    * Reference to the animation Interval.
+    * @property thread
+    * @private
+    * @type Int
+    */
+   var thread = null;
+
+   /**
+    * The current queue of registered animation objects.
+    * @property queue
+    * @private
+    * @type Array
+    */
+   var queue = [];
+
+   /**
+    * The number of active animations.
+    * @property tweenCount
+    * @private
+    * @type Int
+    */
+   var tweenCount = 0;
+
+   /**
+    * Base frame rate (frames per second).
+    * Arbitrarily high for better x-browser calibration (slower browsers drop more frames).
+    * @property fps
+    * @type Int
+    *
+    */
+   this.fps = 200;
+
+   /**
+    * Interval delay in milliseconds, defaults to fastest possible.
+    * @property delay
+    * @type Int
+    *
+    */
+   this.delay = 1;
+
+   /**
+    * Adds an animation instance to the animation queue.
+    * All animation instances must be registered in order to animate.
+    * @method registerElement
+    * @param {object} tween The Anim instance to be be registered
+    */
+   this.registerElement = function(tween) {
+      queue[queue.length] = tween;
+      tweenCount += 1;
+      tween._onStart.fire();
+      this.start();
+   };
+
+   /**
+    * removes an animation instance from the animation queue.
+    * All animation instances must be registered in order to animate.
+    * @method unRegister
+    * @param {object} tween The Anim instance to be be registered
+    * @param {Int} index The index of the Anim instance
+    * @private
+    */
+   this.unRegister = function(tween, index) {
+      tween._onComplete.fire();
+      index = index || getIndex(tween);
+      if (index != -1) { queue.splice(index, 1); }
+
+      tweenCount -= 1;
+      if (tweenCount <= 0) { this.stop(); }
+   };
+
+   /**
+    * Starts the animation thread.
+	* Only one thread can run at a time.
+    * @method start
+    */
+   this.start = function() {
+      if (thread === null) { thread = setInterval(this.run, this.delay); }
+   };
+
+   /**
+    * Stops the animation thread or a specific animation instance.
+    * @method stop
+    * @param {object} tween A specific Anim instance to stop (optional)
+    * If no instance given, Manager stops thread and all animations.
+    */
+   this.stop = function(tween) {
+      if (!tween) {
+         clearInterval(thread);
+         for (var i = 0, len = queue.length; i < len; ++i) {
+            if (queue[i].isAnimated()) {
+               this.unRegister(tween, i);
+            }
+         }
+         queue = [];
+         thread = null;
+         tweenCount = 0;
+      }
+      else {
+         this.unRegister(tween);
+      }
+   };
+
+   /**
+    * Called per Interval to handle each animation frame.
+    * @method run
+    */
+   this.run = function() {
+      for (var i = 0, len = queue.length; i < len; ++i) {
+         var tween = queue[i];
+         if ( !tween || !tween.isAnimated() ) { continue; }
+
+         if (tween.currentFrame < tween.totalFrames || tween.totalFrames === null)
+         {
+            tween.currentFrame += 1;
+
+            if (tween.useSeconds) {
+               correctFrame(tween);
+            }
+            tween._onTween.fire();
+         }
+         else { YAHOO.util.AnimMgr.stop(tween, i); }
+      }
+   };
+
+   var getIndex = function(anim) {
+      for (var i = 0, len = queue.length; i < len; ++i) {
+         if (queue[i] == anim) {
+            return i; // note return;
+         }
+      }
+      return -1;
+   };
+
+   /**
+    * On the fly frame correction to keep animation on time.
+    * @method correctFrame
+    * @private
+    * @param {Object} tween The Anim instance being corrected.
+    */
+   var correctFrame = function(tween) {
+      var frames = tween.totalFrames;
+      var frame = tween.currentFrame;
+      var expected = (tween.currentFrame * tween.duration * 1000 / tween.totalFrames);
+      var elapsed = (new Date() - tween.getStartTime());
+      var tweak = 0;
+
+      if (elapsed < tween.duration * 1000) { // check if falling behind
+         tweak = Math.round((elapsed / expected - 1) * tween.currentFrame);
+      } else { // went over duration, so jump to end
+         tweak = frames - (frame + 1);
+      }
+      if (tweak > 0 && isFinite(tweak)) { // adjust if needed
+         if (tween.currentFrame + tweak >= frames) {// dont go past last frame
+            tweak = frames - (frame + 1);
+         }
+
+         tween.currentFrame += tweak;
+      }
+   };
+};
+/**
+ * Used to calculate Bezier splines for any number of control points.
+ * @class Bezier
+ * @namespace YAHOO.util
+ *
+ */
+YAHOO.util.Bezier = new function()
+{
+   /**
+    * Get the current position of the animated element based on t.
+    * Each point is an array of "x" and "y" values (0 = x, 1 = y)
+    * At least 2 points are required (start and end).
+    * First point is start. Last point is end.
+    * Additional control points are optional.
+    * @method getPosition
+    * @param {Array} points An array containing Bezier points
+    * @param {Number} t A number between 0 and 1 which is the basis for determining current position
+    * @return {Array} An array containing int x and y member data
+    */
+   this.getPosition = function(points, t)
+   {
+      var n = points.length;
+      var tmp = [];
+
+      for (var i = 0; i < n; ++i){
+         tmp[i] = [points[i][0], points[i][1]]; // save input
+      }
+
+      for (var j = 1; j < n; ++j) {
+         for (i = 0; i < n - j; ++i) {
+            tmp[i][0] = (1 - t) * tmp[i][0] + t * tmp[parseInt(i + 1, 10)][0];
+            tmp[i][1] = (1 - t) * tmp[i][1] + t * tmp[parseInt(i + 1, 10)][1];
+         }
+      }
+
+      return [ tmp[0][0], tmp[0][1] ];
+
+   };
+};
+/**
+ * Anim subclass for color transitions.
+ * <p>Usage: <code>var myAnim = new Y.ColorAnim(el, { backgroundColor: { from: '#FF0000', to: '#FFFFFF' } }, 1, Y.Easing.easeOut);</code> Color values can be specified with either 112233, #112233,
+ * [255,255,255], or rgb(255,255,255)</p>
+ * @class ColorAnim
+ * @namespace YAHOO.util
+ * @requires YAHOO.util.Anim
+ * @requires YAHOO.util.AnimMgr
+ * @requires YAHOO.util.Easing
+ * @requires YAHOO.util.Bezier
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @constructor
+ * @extends YAHOO.util.Anim
+ * @param {HTMLElement | String} el Reference to the element that will be animated
+ * @param {Object} attributes The attribute(s) to be animated.
+ * Each attribute is an object with at minimum a "to" or "by" member defined.
+ * Additional optional members are "from" (defaults to current value), "units" (defaults to "px").
+ * All attribute names use camelCase.
+ * @param {Number} duration (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
+ * @param {Function} method (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
+ */
+(function() {
+   YAHOO.util.ColorAnim = function(el, attributes, duration,  method) {
+      YAHOO.util.ColorAnim.superclass.constructor.call(this, el, attributes, duration, method);
+   };
+
+   YAHOO.extend(YAHOO.util.ColorAnim, YAHOO.util.Anim);
+
+   // shorthand
+   var Y = YAHOO.util;
+   var superclass = Y.ColorAnim.superclass;
+   var proto = Y.ColorAnim.prototype;
+
+   proto.toString = function() {
+      var el = this.getEl();
+      var id = el.id || el.tagName;
+      return ("ColorAnim " + id);
+   };
+
+   proto.patterns.color = /color$/i;
+   proto.patterns.rgb         = /^rgb\(([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)\)$/i;
+   proto.patterns.hex         = /^#?([0-9A-F]{2})([0-9A-F]{2})([0-9A-F]{2})$/i;
+   proto.patterns.hex3        = /^#?([0-9A-F]{1})([0-9A-F]{1})([0-9A-F]{1})$/i;
+   proto.patterns.transparent = /^transparent|rgba\(0, 0, 0, 0\)$/; // need rgba for safari
+
+   /**
+    * Attempts to parse the given string and return a 3-tuple.
+    * @method parseColor
+    * @param {String} s The string to parse.
+    * @return {Array} The 3-tuple of rgb values.
+    */
+   proto.parseColor = function(s) {
+      if (s.length == 3) { return s; }
+
+      var c = this.patterns.hex.exec(s);
+      if (c && c.length == 4) {
+         return [ parseInt(c[1], 16), parseInt(c[2], 16), parseInt(c[3], 16) ];
+      }
+
+      c = this.patterns.rgb.exec(s);
+      if (c && c.length == 4) {
+         return [ parseInt(c[1], 10), parseInt(c[2], 10), parseInt(c[3], 10) ];
+      }
+
+      c = this.patterns.hex3.exec(s);
+      if (c && c.length == 4) {
+         return [ parseInt(c[1] + c[1], 16), parseInt(c[2] + c[2], 16), parseInt(c[3] + c[3], 16) ];
+      }
+
+      return null;
+   };
+
+   proto.getAttribute = function(attr) {
+      var el = this.getEl();
+      if (  this.patterns.color.test(attr) ) {
+         var val = YAHOO.util.Dom.getStyle(el, attr);
+
+         if (this.patterns.transparent.test(val)) { // bgcolor default
+            var parent = el.parentNode; // try and get from an ancestor
+            val = Y.Dom.getStyle(parent, attr);
+
+            while (parent && this.patterns.transparent.test(val)) {
+               parent = parent.parentNode;
+               val = Y.Dom.getStyle(parent, attr);
+               if (parent.tagName.toUpperCase() == 'HTML') {
+                  val = '#fff';
+               }
+            }
+         }
+      } else {
+         val = superclass.getAttribute.call(this, attr);
+      }
+
+      return val;
+   };
+
+   proto.doMethod = function(attr, start, end) {
+      var val;
+
+      if ( this.patterns.color.test(attr) ) {
+         val = [];
+         for (var i = 0, len = start.length; i < len; ++i) {
+            val[i] = superclass.doMethod.call(this, attr, start[i], end[i]);
+         }
+
+         val = 'rgb('+Math.floor(val[0])+','+Math.floor(val[1])+','+Math.floor(val[2])+')';
+      }
+      else {
+         val = superclass.doMethod.call(this, attr, start, end);
+      }
+
+      return val;
+   };
+
+   proto.setRuntimeAttribute = function(attr) {
+      superclass.setRuntimeAttribute.call(this, attr);
+
+      if ( this.patterns.color.test(attr) ) {
+         var attributes = this.attributes;
+         var start = this.parseColor(this.runtimeAttributes[attr].start);
+         var end = this.parseColor(this.runtimeAttributes[attr].end);
+         // fix colors if going "by"
+         if ( typeof attributes[attr]['to'] === 'undefined' && typeof attributes[attr]['by'] !== 'undefined' ) {
+            end = this.parseColor(attributes[attr].by);
+
+            for (var i = 0, len = start.length; i < len; ++i) {
+               end[i] = start[i] + end[i];
+            }
+         }
+
+         this.runtimeAttributes[attr].start = start;
+         this.runtimeAttributes[attr].end = end;
+      }
+   };
+})();/*
+TERMS OF USE - EASING EQUATIONS
+Open source under the BSD License.
+Copyright 2001 Robert Penner All rights reserved.
+
+Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+
+ * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+ * Neither the name of the author nor the names of contributors may be used to endorse or promote products derived from this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+*/
+
+/**
+ * Singleton that determines how an animation proceeds from start to end.
+ * @class Easing
+ * @namespace YAHOO.util
+*/
+
+YAHOO.util.Easing = {
+
+   /**
+    * Uniform speed between points.
+    * @method easeNone
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @return {Number} The computed value for the current animation frame
+    */
+   easeNone: function (t, b, c, d) {
+   	return c*t/d + b;
+   },
+
+   /**
+    * Begins slowly and accelerates towards end. (quadratic)
+    * @method easeIn
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @return {Number} The computed value for the current animation frame
+    */
+   easeIn: function (t, b, c, d) {
+   	return c*(t/=d)*t + b;
+   },
+
+   /**
+    * Begins quickly and decelerates towards end.  (quadratic)
+    * @method easeOut
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @return {Number} The computed value for the current animation frame
+    */
+   easeOut: function (t, b, c, d) {
+   	return -c *(t/=d)*(t-2) + b;
+   },
+
+   /**
+    * Begins slowly and decelerates towards end. (quadratic)
+    * @method easeBoth
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @return {Number} The computed value for the current animation frame
+    */
+   easeBoth: function (t, b, c, d) {
+   	if ((t/=d/2) < 1) return c/2*t*t + b;
+   	return -c/2 * ((--t)*(t-2) - 1) + b;
+   },
+
+   /**
+    * Begins slowly and accelerates towards end. (quartic)
+    * @method easeInStrong
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @return {Number} The computed value for the current animation frame
+    */
+   easeInStrong: function (t, b, c, d) {
+   	return c*(t/=d)*t*t*t + b;
+   },
+
+   /**
+    * Begins quickly and decelerates towards end.  (quartic)
+    * @method easeOutStrong
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @return {Number} The computed value for the current animation frame
+    */
+   easeOutStrong: function (t, b, c, d) {
+   	return -c * ((t=t/d-1)*t*t*t - 1) + b;
+   },
+
+   /**
+    * Begins slowly and decelerates towards end. (quartic)
+    * @method easeBothStrong
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @return {Number} The computed value for the current animation frame
+    */
+   easeBothStrong: function (t, b, c, d) {
+   	if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
+   	return -c/2 * ((t-=2)*t*t*t - 2) + b;
+   },
+
+   /**
+    * Snap in elastic effect.
+    * @method elasticIn
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @param {Number} p Period (optional)
+    * @return {Number} The computed value for the current animation frame
+    */
+
+   elasticIn: function (t, b, c, d, a, p) {
+   	if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
+   	if (!a || a < Math.abs(c)) { a=c; var s=p/4; }
+   	else var s = p/(2*Math.PI) * Math.asin (c/a);
+   	return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
+   },
+
+   /**
+    * Snap out elastic effect.
+    * @method elasticOut
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @param {Number} p Period (optional)
+    * @return {Number} The computed value for the current animation frame
+    */
+   elasticOut: function (t, b, c, d, a, p) {
+   	if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
+   	if (!a || a < Math.abs(c)) { a=c; var s=p/4; }
+   	else var s = p/(2*Math.PI) * Math.asin (c/a);
+   	return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
+   },
+
+   /**
+    * Snap both elastic effect.
+    * @method elasticBoth
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @param {Number} p Period (optional)
+    * @return {Number} The computed value for the current animation frame
+    */
+   elasticBoth: function (t, b, c, d, a, p) {
+   	if (t==0) return b;  if ((t/=d/2)==2) return b+c;  if (!p) p=d*(.3*1.5);
+   	if (!a || a < Math.abs(c)) { a=c; var s=p/4; }
+   	else var s = p/(2*Math.PI) * Math.asin (c/a);
+   	if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
+   	return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
+   },
+
+   /**
+    * Backtracks slightly, then reverses direction and moves to end.
+    * @method backIn
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @param {Number} s Overshoot (optional)
+    * @return {Number} The computed value for the current animation frame
+    */
+   backIn: function (t, b, c, d, s) {
+   	if (typeof s == 'undefined') s = 1.70158;
+   	return c*(t/=d)*t*((s+1)*t - s) + b;
+   },
+
+   /**
+    * Overshoots end, then reverses and comes back to end.
+    * @method backOut
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @param {Number} s Overshoot (optional)
+    * @return {Number} The computed value for the current animation frame
+    */
+   backOut: function (t, b, c, d, s) {
+   	if (typeof s == 'undefined') s = 1.70158;
+   	return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
+   },
+
+   /**
+    * Backtracks slightly, then reverses direction, overshoots end,
+    * then reverses and comes back to end.
+    * @method backBoth
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @param {Number} s Overshoot (optional)
+    * @return {Number} The computed value for the current animation frame
+    */
+   backBoth: function (t, b, c, d, s) {
+   	if (typeof s == 'undefined') s = 1.70158;
+   	if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
+   	return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
+   },
+
+   /**
+    * Bounce off of start.
+    * @method bounceIn
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @return {Number} The computed value for the current animation frame
+    */
+   bounceIn: function (t, b, c, d) {
+   	return c - YAHOO.util.Easing.bounceOut(d-t, 0, c, d) + b;
+   },
+
+   /**
+    * Bounces off end.
+    * @method bounceOut
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @return {Number} The computed value for the current animation frame
+    */
+   bounceOut: function (t, b, c, d) {
+   	if ((t/=d) < (1/2.75)) {
+   		return c*(7.5625*t*t) + b;
+   	} else if (t < (2/2.75)) {
+   		return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
+   	} else if (t < (2.5/2.75)) {
+   		return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
+   	} else {
+   		return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
+   	}
+   },
+
+   /**
+    * Bounces off start and end.
+    * @method bounceBoth
+    * @param {Number} t Time value used to compute current value
+    * @param {Number} b Starting value
+    * @param {Number} c Delta between start and end values
+    * @param {Number} d Total length of animation
+    * @return {Number} The computed value for the current animation frame
+    */
+   bounceBoth: function (t, b, c, d) {
+   	if (t < d/2) return YAHOO.util.Easing.bounceIn(t*2, 0, c, d) * .5 + b;
+   	return YAHOO.util.Easing.bounceOut(t*2-d, 0, c, d) * .5 + c*.5 + b;
+   }
+};
+
+/**
+ * Anim subclass for moving elements along a path defined by the "points"
+ * member of "attributes".  All "points" are arrays with x, y coordinates.
+ * <p>Usage: <code>var myAnim = new YAHOO.util.Motion(el, { points: { to: [800, 800] } }, 1, YAHOO.util.Easing.easeOut);</code></p>
+ * @class Motion
+ * @namespace YAHOO.util
+ * @requires YAHOO.util.Anim
+ * @requires YAHOO.util.AnimMgr
+ * @requires YAHOO.util.Easing
+ * @requires YAHOO.util.Bezier
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @requires YAHOO.util.CustomEvent
+ * @constructor
+ * @extends YAHOO.util.Anim
+ * @param {String | HTMLElement} el Reference to the element that will be animated
+ * @param {Object} attributes The attribute(s) to be animated.
+ * Each attribute is an object with at minimum a "to" or "by" member defined.
+ * Additional optional members are "from" (defaults to current value), "units" (defaults to "px").
+ * All attribute names use camelCase.
+ * @param {Number} duration (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
+ * @param {Function} method (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
+ */
+(function() {
+   YAHOO.util.Motion = function(el, attributes, duration,  method) {
+      if (el) { // dont break existing subclasses not using YAHOO.extend
+         YAHOO.util.Motion.superclass.constructor.call(this, el, attributes, duration, method);
+      }
+   };
+
+   YAHOO.extend(YAHOO.util.Motion, YAHOO.util.ColorAnim);
+
+   // shorthand
+   var Y = YAHOO.util;
+   var superclass = Y.Motion.superclass;
+   var proto = Y.Motion.prototype;
+
+   proto.toString = function() {
+      var el = this.getEl();
+      var id = el.id || el.tagName;
+      return ("Motion " + id);
+   };
+
+   proto.patterns.points = /^points$/i;
+
+   proto.setAttribute = function(attr, val, unit) {
+      if (  this.patterns.points.test(attr) ) {
+         unit = unit || 'px';
+         superclass.setAttribute.call(this, 'left', val[0], unit);
+         superclass.setAttribute.call(this, 'top', val[1], unit);
+      } else {
+         superclass.setAttribute.call(this, attr, val, unit);
+      }
+   };
+
+   proto.getAttribute = function(attr) {
+      if (  this.patterns.points.test(attr) ) {
+         var val = [
+            superclass.getAttribute.call(this, 'left'),
+            superclass.getAttribute.call(this, 'top')
+         ];
+      } else {
+         val = superclass.getAttribute.call(this, attr);
+      }
+
+      return val;
+   };
+
+   proto.doMethod = function(attr, start, end) {
+      var val = null;
+
+      if ( this.patterns.points.test(attr) ) {
+         var t = this.method(this.currentFrame, 0, 100, this.totalFrames) / 100;
+         val = Y.Bezier.getPosition(this.runtimeAttributes[attr], t);
+      } else {
+         val = superclass.doMethod.call(this, attr, start, end);
+      }
+      return val;
+   };
+
+   proto.setRuntimeAttribute = function(attr) {
+      if ( this.patterns.points.test(attr) ) {
+         var el = this.getEl();
+         var attributes = this.attributes;
+         var start;
+         var control = attributes['points']['control'] || [];
+         var end;
+         var i, len;
+
+         if (control.length > 0 && !(control[0] instanceof Array) ) { // could be single point or array of points
+            control = [control];
+         } else { // break reference to attributes.points.control
+            var tmp = [];
+            for (i = 0, len = control.length; i< len; ++i) {
+               tmp[i] = control[i];
+            }
+            control = tmp;
+         }
+
+         if (Y.Dom.getStyle(el, 'position') == 'static') { // default to relative
+            Y.Dom.setStyle(el, 'position', 'relative');
+         }
+
+         if ( isset(attributes['points']['from']) ) {
+            Y.Dom.setXY(el, attributes['points']['from']); // set position to from point
+         }
+         else { Y.Dom.setXY( el, Y.Dom.getXY(el) ); } // set it to current position
+
+         start = this.getAttribute('points'); // get actual top & left
+
+         // TO beats BY, per SMIL 2.1 spec
+         if ( isset(attributes['points']['to']) ) {
+            end = translateValues.call(this, attributes['points']['to'], start);
+
+            var pageXY = Y.Dom.getXY(this.getEl());
+            for (i = 0, len = control.length; i < len; ++i) {
+               control[i] = translateValues.call(this, control[i], start);
+            }
+
+
+         } else if ( isset(attributes['points']['by']) ) {
+            end = [ start[0] + attributes['points']['by'][0], start[1] + attributes['points']['by'][1] ];
+
+            for (i = 0, len = control.length; i < len; ++i) {
+               control[i] = [ start[0] + control[i][0], start[1] + control[i][1] ];
+            }
+         }
+
+         this.runtimeAttributes[attr] = [start];
+
+         if (control.length > 0) {
+            this.runtimeAttributes[attr] = this.runtimeAttributes[attr].concat(control);
+         }
+
+         this.runtimeAttributes[attr][this.runtimeAttributes[attr].length] = end;
+      }
+      else {
+         superclass.setRuntimeAttribute.call(this, attr);
+      }
+   };
+
+   var translateValues = function(val, start) {
+      var pageXY = Y.Dom.getXY(this.getEl());
+      val = [ val[0] - pageXY[0] + start[0], val[1] - pageXY[1] + start[1] ];
+
+      return val;
+   };
+
+   var isset = function(prop) {
+      return (typeof prop !== 'undefined');
+   };
+})();
+/**
+ * Anim subclass for scrolling elements to a position defined by the "scroll"
+ * member of "attributes".  All "scroll" members are arrays with x, y scroll positions.
+ * <p>Usage: <code>var myAnim = new YAHOO.util.Scroll(el, { scroll: { to: [0, 800] } }, 1, YAHOO.util.Easing.easeOut);</code></p>
+ * @class Scroll
+ * @namespace YAHOO.util
+ * @requires YAHOO.util.Anim
+ * @requires YAHOO.util.AnimMgr
+ * @requires YAHOO.util.Easing
+ * @requires YAHOO.util.Bezier
+ * @requires YAHOO.util.Dom
+ * @requires YAHOO.util.Event
+ * @requires YAHOO.util.CustomEvent
+ * @extends YAHOO.util.Anim
+ * @constructor
+ * @param {String or HTMLElement} el Reference to the element that will be animated
+ * @param {Object} attributes The attribute(s) to be animated.
+ * Each attribute is an object with at minimum a "to" or "by" member defined.
+ * Additional optional members are "from" (defaults to current value), "units" (defaults to "px").
+ * All attribute names use camelCase.
+ * @param {Number} duration (optional, defaults to 1 second) Length of animation (frames or seconds), defaults to time-based
+ * @param {Function} method (optional, defaults to YAHOO.util.Easing.easeNone) Computes the values that are applied to the attributes per frame (generally a YAHOO.util.Easing method)
+ */
+(function() {
+   YAHOO.util.Scroll = function(el, attributes, duration,  method) {
+      if (el) { // dont break existing subclasses not using YAHOO.extend
+         YAHOO.util.Scroll.superclass.constructor.call(this, el, attributes, duration, method);
+      }
+   };
+
+   YAHOO.extend(YAHOO.util.Scroll, YAHOO.util.ColorAnim);
+
+   // shorthand
+   var Y = YAHOO.util;
+   var superclass = Y.Scroll.superclass;
+   var proto = Y.Scroll.prototype;
+
+   proto.toString = function() {
+      var el = this.getEl();
+      var id = el.id || el.tagName;
+      return ("Scroll " + id);
+   };
+
+   proto.doMethod = function(attr, start, end) {
+      var val = null;
+
+      if (attr == 'scroll') {
+         val = [
+            this.method(this.currentFrame, start[0], end[0] - start[0], this.totalFrames),
+            this.method(this.currentFrame, start[1], end[1] - start[1], this.totalFrames)
+         ];
+
+      } else {
+         val = superclass.doMethod.call(this, attr, start, end);
+      }
+      return val;
+   };
+
+   proto.getAttribute = function(attr) {
+      var val = null;
+      var el = this.getEl();
+
+      if (attr == 'scroll') {
+         val = [ el.scrollLeft, el.scrollTop ];
+      } else {
+         val = superclass.getAttribute.call(this, attr);
+      }
+
+      return val;
+   };
+
+   proto.setAttribute = function(attr, val, unit) {
+      var el = this.getEl();
+
+      if (attr == 'scroll') {
+         el.scrollLeft = val[0];
+         el.scrollTop = val[1];
+      } else {
+         superclass.setAttribute.call(this, attr, val, unit);
+      }
+   };
+})();
diff --git a/frontend/beta/js/YUI/autocomplete.js b/frontend/beta/js/YUI/autocomplete.js
new file mode 100644
index 0000000..a5722cc
--- a/dev/null
+++ b/frontend/beta/js/YUI/autocomplete.js
@@ -0,0 +1,3066 @@
+/*

+Copyright (c) 2006, Yahoo! Inc. All rights reserved.

+Code licensed under the BSD License:

+http://developer.yahoo.com/yui/license.txt

+version: 0.12.0

+*/

+

+ /**
+ * The AutoComplete control provides the front-end logic for text-entry suggestion and
+ * completion functionality.
+ *
+ * @module autocomplete
+ * @requires yahoo, dom, event, datasource
+ * @optional animation, connection, json
+ * @namespace YAHOO.widget
+ * @title AutoComplete Widget
+ */
+
+/****************************************************************************/
+/****************************************************************************/
+/****************************************************************************/
+
+/**
+ * The AutoComplete class provides the customizable functionality of a plug-and-play DHTML
+ * auto completion widget.  Some key features:
+ * <ul>
+ * <li>Navigate with up/down arrow keys and/or mouse to pick a selection</li>
+ * <li>The drop down container can "roll down" or "fly out" via configurable
+ * animation</li>
+ * <li>UI look-and-feel customizable through CSS, including container
+ * attributes, borders, position, fonts, etc</li>
+ * </ul>
+ *
+ * @class AutoComplete
+ * @constructor
+ * @param elInput {HTMLElement} DOM element reference of an input field
+ * @param elInput {String} String ID of an input field
+ * @param elContainer {HTMLElement} DOM element reference of an existing DIV
+ * @param elContainer {String} String ID of an existing DIV
+ * @param oDataSource {Object} Instance of YAHOO.widget.DataSource for query/results
+ * @param oConfigs {Object} (optional) Object literal of configuration params
+ */
+YAHOO.widget.AutoComplete = function(elInput,elContainer,oDataSource,oConfigs) {
+    if(elInput && elContainer && oDataSource) {
+        // Validate DataSource
+        if (oDataSource && (oDataSource instanceof YAHOO.widget.DataSource)) {
+            this.dataSource = oDataSource;
+        }
+        else {
+            return;
+        }
+
+        // Validate input element
+        if(YAHOO.util.Dom.inDocument(elInput)) {
+            if(typeof elInput == "string") {
+                    this._sName = "instance" + YAHOO.widget.AutoComplete._nIndex + " " + elInput;
+                    this._oTextbox = document.getElementById(elInput);
+            }
+            else {
+                this._sName = (elInput.id) ?
+                    "instance" + YAHOO.widget.AutoComplete._nIndex + " " + elInput.id:
+                    "instance" + YAHOO.widget.AutoComplete._nIndex;
+                this._oTextbox = elInput;
+            }
+        }
+        else {
+            return;
+        }
+
+        // Validate container element
+        if(YAHOO.util.Dom.inDocument(elContainer)) {
+            if(typeof elContainer == "string") {
+                    this._oContainer = document.getElementById(elContainer);
+            }
+            else {
+                this._oContainer = elContainer;
+            }
+            if(this._oContainer.style.display == "none") {
+            }
+        }
+        else {
+            return;
+        }
+
+        // Set any config params passed in to override defaults
+        if (typeof oConfigs == "object") {
+            for(var sConfig in oConfigs) {
+                if (sConfig) {
+                    this[sConfig] = oConfigs[sConfig];
+                }
+            }
+        }
+
+        // Initialization sequence
+        this._initContainer();
+        this._initProps();
+        this._initList();
+        this._initContainerHelpers();
+
+        // Set up events
+        var oSelf = this;
+        var oTextbox = this._oTextbox;
+        // Events are actually for the content module within the container
+        var oContent = this._oContainer._oContent;
+
+        // Dom events
+        YAHOO.util.Event.addListener(oTextbox,"keyup",oSelf._onTextboxKeyUp,oSelf);
+        YAHOO.util.Event.addListener(oTextbox,"keydown",oSelf._onTextboxKeyDown,oSelf);
+        YAHOO.util.Event.addListener(oTextbox,"focus",oSelf._onTextboxFocus,oSelf);
+        YAHOO.util.Event.addListener(oTextbox,"blur",oSelf._onTextboxBlur,oSelf);
+        YAHOO.util.Event.addListener(oContent,"mouseover",oSelf._onContainerMouseover,oSelf);
+        YAHOO.util.Event.addListener(oContent,"mouseout",oSelf._onContainerMouseout,oSelf);
+        YAHOO.util.Event.addListener(oContent,"scroll",oSelf._onContainerScroll,oSelf);
+        YAHOO.util.Event.addListener(oContent,"resize",oSelf._onContainerResize,oSelf);
+        if(oTextbox.form) {
+            YAHOO.util.Event.addListener(oTextbox.form,"submit",oSelf._onFormSubmit,oSelf);
+        }
+        YAHOO.util.Event.addListener(oTextbox,"keypress",oSelf._onTextboxKeyPress,oSelf);
+
+        // Custom events
+        this.textboxFocusEvent = new YAHOO.util.CustomEvent("textboxFocus", this);
+        this.textboxKeyEvent = new YAHOO.util.CustomEvent("textboxKey", this);
+        this.dataRequestEvent = new YAHOO.util.CustomEvent("dataRequest", this);
+        this.dataReturnEvent = new YAHOO.util.CustomEvent("dataReturn", this);
+        this.dataErrorEvent = new YAHOO.util.CustomEvent("dataError", this);
+        this.containerExpandEvent = new YAHOO.util.CustomEvent("containerExpand", this);
+        this.typeAheadEvent = new YAHOO.util.CustomEvent("typeAhead", this);
+        this.itemMouseOverEvent = new YAHOO.util.CustomEvent("itemMouseOver", this);
+        this.itemMouseOutEvent = new YAHOO.util.CustomEvent("itemMouseOut", this);
+        this.itemArrowToEvent = new YAHOO.util.CustomEvent("itemArrowTo", this);
+        this.itemArrowFromEvent = new YAHOO.util.CustomEvent("itemArrowFrom", this);
+        this.itemSelectEvent = new YAHOO.util.CustomEvent("itemSelect", this);
+        this.unmatchedItemSelectEvent = new YAHOO.util.CustomEvent("unmatchedItemSelect", this);
+        this.selectionEnforceEvent = new YAHOO.util.CustomEvent("selectionEnforce", this);
+        this.containerCollapseEvent = new YAHOO.util.CustomEvent("containerCollapse", this);
+        this.textboxBlurEvent = new YAHOO.util.CustomEvent("textboxBlur", this);
+        
+        // Finish up
+        oTextbox.setAttribute("autocomplete","off");
+        YAHOO.widget.AutoComplete._nIndex++;
+    }
+    // Required arguments were not found
+    else {
+    }
+};
+
+/////////////////////////////////////////////////////////////////////////////
+//
+// Public member variables
+//
+/////////////////////////////////////////////////////////////////////////////
+
+/**
+ * The DataSource object that encapsulates the data used for auto completion.
+ * This object should be an inherited object from YAHOO.widget.DataSource.
+ *
+ * @property dataSource
+ * @type Object
+ */
+YAHOO.widget.AutoComplete.prototype.dataSource = null;
+
+/**
+ * Number of characters that must be entered before querying for results. A negative value
+ * effectively turns off the widget. A value of 0 allows queries of null or empty string
+ * values.
+ *
+ * @property minQueryLength
+ * @type Number
+ * @default 1
+ */
+YAHOO.widget.AutoComplete.prototype.minQueryLength = 1;
+
+/**
+ * Maximum number of results to display in results container.
+ *
+ * @property maxResultsDisplayed
+ * @type Number
+ * @default 10
+ */
+YAHOO.widget.AutoComplete.prototype.maxResultsDisplayed = 10;
+
+/**
+ * Number of seconds to delay before submitting a query request.  If a query
+ * request is received before a previous one has completed its delay, the
+ * previous request is cancelled and the new request is set to the delay.
+ *
+ * @property queryDelay
+ * @type Number
+ * @default 0.5
+ */
+YAHOO.widget.AutoComplete.prototype.queryDelay = 0.5;
+
+/**
+ * Class name of a highlighted item within results container.
+ *
+ * @property highlighClassName
+ * @type String
+ * @default "yui-ac-highlight"
+ */
+YAHOO.widget.AutoComplete.prototype.highlightClassName = "yui-ac-highlight";
+
+/**
+ * Class name of a pre-highlighted item within results container.
+ *
+ * @property prehighlightClassName
+ * @type String
+ */
+YAHOO.widget.AutoComplete.prototype.prehighlightClassName = null;
+
+/**
+ * Query delimiter. A single character separator for multiple delimited
+ * selections. Multiple delimiter characteres may be defined as an array of
+ * strings. A null value or empty string indicates that query results cannot
+ * be delimited. This feature is not recommended if you need forceSelection to
+ * be true.
+ *
+ * @property delimChar
+ * @type String | String[]
+ */
+YAHOO.widget.AutoComplete.prototype.delimChar = null;
+
+/**
+ * Whether or not the first item in results container should be automatically highlighted
+ * on expand.
+ *
+ * @property autoHighlight
+ * @type Boolean
+ * @default true
+ */
+YAHOO.widget.AutoComplete.prototype.autoHighlight = true;
+
+/**
+ * Whether or not the input field should be automatically updated
+ * with the first query result as the user types, auto-selecting the substring
+ * that the user has not typed.
+ *
+ * @property typeAhead
+ * @type Boolean
+ * @default false
+ */
+YAHOO.widget.AutoComplete.prototype.typeAhead = false;
+
+/**
+ * Whether or not to animate the expansion/collapse of the results container in the
+ * horizontal direction.
+ *
+ * @property animHoriz
+ * @type Boolean
+ * @default false
+ */
+YAHOO.widget.AutoComplete.prototype.animHoriz = false;
+
+/**
+ * Whether or not to animate the expansion/collapse of the results container in the
+ * vertical direction.
+ *
+ * @property animVert
+ * @type Boolean
+ * @default true
+ */
+YAHOO.widget.AutoComplete.prototype.animVert = true;
+
+/**
+ * Speed of container expand/collapse animation, in seconds..
+ *
+ * @property animSpeed
+ * @type Number
+ * @default 0.3
+ */
+YAHOO.widget.AutoComplete.prototype.animSpeed = 0.3;
+
+/**
+ * Whether or not to force the user's selection to match one of the query
+ * results. Enabling this feature essentially transforms the input field into a
+ * &lt;select&gt; field. This feature is not recommended with delimiter character(s)
+ * defined.
+ *
+ * @property forceSelection
+ * @type Boolean
+ * @default false
+ */
+YAHOO.widget.AutoComplete.prototype.forceSelection = false;
+
+/**
+ * Whether or not to allow browsers to cache user-typed input in the input
+ * field. Disabling this feature will prevent the widget from setting the
+ * autocomplete="off" on the input field. When autocomplete="off"
+ * and users click the back button after form submission, user-typed input can
+ * be prefilled by the browser from its cache. This caching of user input may
+ * not be desired for sensitive data, such as credit card numbers, in which
+ * case, implementers should consider setting allowBrowserAutocomplete to false.
+ *
+ * @property allowBrowserAutocomplete
+ * @type Boolean
+ * @default true
+ */
+YAHOO.widget.AutoComplete.prototype.allowBrowserAutocomplete = true;
+
+/**
+ * Whether or not the results container should always be displayed.
+ * Enabling this feature displays the container when the widget is instantiated
+ * and prevents the toggling of the container to a collapsed state.
+ *
+ * @property alwaysShowContainer
+ * @type Boolean
+ * @default false
+ */
+YAHOO.widget.AutoComplete.prototype.alwaysShowContainer = false;
+
+/**
+ * Whether or not to use an iFrame to layer over Windows form elements in
+ * IE. Set to true only when the results container will be on top of a
+ * &lt;select&gt; field in IE and thus exposed to the IE z-index bug (i.e.,
+ * 5.5 < IE < 7).
+ *
+ * @property useIFrame
+ * @type Boolean
+ * @default false
+ */
+YAHOO.widget.AutoComplete.prototype.useIFrame = false;
+
+/**
+ * Whether or not the results container should have a shadow.
+ *
+ * @property useShadow
+ * @type Boolean
+ * @default false
+ */
+YAHOO.widget.AutoComplete.prototype.useShadow = false;
+
+/////////////////////////////////////////////////////////////////////////////
+//
+// Public methods
+//
+/////////////////////////////////////////////////////////////////////////////
+
+ /**
+ * Public accessor to the unique name of the AutoComplete instance.
+ *
+ * @method toString
+ * @return {String} Unique name of the AutoComplete instance.
+ */
+YAHOO.widget.AutoComplete.prototype.toString = function() {
+    return "AutoComplete " + this._sName;
+};
+
+ /**
+ * Returns true if container is in an expanded state, false otherwise.
+ *
+ * @method isContainerOpen
+ * @return {Boolean} Returns true if container is in an expanded state, false otherwise.
+ */
+YAHOO.widget.AutoComplete.prototype.isContainerOpen = function() {
+    return this._bContainerOpen;
+};
+
+/**
+ * Public accessor to the internal array of DOM &lt;li&gt; elements that
+ * display query results within the results container.
+ *
+ * @method getListItems
+ * @return {HTMLElement[]} Array of &lt;li&gt; elements within the results container.
+ */
+YAHOO.widget.AutoComplete.prototype.getListItems = function() {
+    return this._aListItems;
+};
+
+/**
+ * Public accessor to the data held in an &lt;li&gt; element of the
+ * results container.
+ *
+ * @method getListItemData
+ * @return {Object | Array} Object or array of result data or null
+ */
+YAHOO.widget.AutoComplete.prototype.getListItemData = function(oListItem) {
+    if(oListItem._oResultData) {
+        return oListItem._oResultData;
+    }
+    else {
+        return false;
+    }
+};
+
+/**
+ * Sets HTML markup for the results container header. This markup will be
+ * inserted within a &lt;div&gt; tag with a class of "ac_hd".
+ *
+ * @method setHeader
+ * @param sHeader {String} HTML markup for results container header.
+ */
+YAHOO.widget.AutoComplete.prototype.setHeader = function(sHeader) {
+    if(sHeader) {
+        if(this._oContainer._oContent._oHeader) {
+            this._oContainer._oContent._oHeader.innerHTML = sHeader;
+            this._oContainer._oContent._oHeader.style.display = "block";
+        }
+    }
+    else {
+        this._oContainer._oContent._oHeader.innerHTML = "";
+        this._oContainer._oContent._oHeader.style.display = "none";
+    }
+};
+
+/**
+ * Sets HTML markup for the results container footer. This markup will be
+ * inserted within a &lt;div&gt; tag with a class of "ac_ft".
+ *
+ * @method setFooter
+ * @param sFooter {String} HTML markup for results container footer.
+ */
+YAHOO.widget.AutoComplete.prototype.setFooter = function(sFooter) {
+    if(sFooter) {
+        if(this._oContainer._oContent._oFooter) {
+            this._oContainer._oContent._oFooter.innerHTML = sFooter;
+            this._oContainer._oContent._oFooter.style.display = "block";
+        }
+    }
+    else {
+        this._oContainer._oContent._oFooter.innerHTML = "";
+        this._oContainer._oContent._oFooter.style.display = "none";
+    }
+};
+
+/**
+ * Sets HTML markup for the results container body. This markup will be
+ * inserted within a &lt;div&gt; tag with a class of "ac_bd".
+ *
+ * @method setBody
+ * @param sHeader {String} HTML markup for results container body.
+ */
+YAHOO.widget.AutoComplete.prototype.setBody = function(sBody) {
+    if(sBody) {
+        if(this._oContainer._oContent._oBody) {
+            this._oContainer._oContent._oBody.innerHTML = sBody;
+            this._oContainer._oContent._oBody.style.display = "block";
+            this._oContainer._oContent.style.display = "block";
+        }
+    }
+    else {
+        this._oContainer._oContent._oBody.innerHTML = "";
+        this._oContainer._oContent.style.display = "none";
+    }
+    this._maxResultsDisplayed = 0;
+};
+
+/**
+ * Overridable method that converts a result item object into HTML markup
+ * for display. Return data values are accessible via the oResultItem object,
+ * and the key return value will always be oResultItem[0]. Markup will be
+ * displayed within &lt;li&gt; element tags in the container.
+ *
+ * @method formatResult
+ * @param oResultItem {Object} Result item representing one query result. Data is held in an array.
+ * @param sQuery {String} The current query string.
+ * @return {String} HTML markup of formatted result data.
+ */
+YAHOO.widget.AutoComplete.prototype.formatResult = function(oResultItem, sQuery) {
+    var sResult = oResultItem[0];
+    if(sResult) {
+        return sResult;
+    }
+    else {
+        return "";
+    }
+};
+
+/**
+ * Overridable method called before container expands allows implementers to access data
+ * and DOM elements.
+ *
+ * @method doBeforeExpandContainer
+ * @return {Boolean} Return true to continue expanding container, false to cancel the expand.
+ */
+YAHOO.widget.AutoComplete.prototype.doBeforeExpandContainer = function(oResultItem, sQuery) {
+    return true;
+};
+
+/**
+ * Makes query request to the DataSource.
+ *
+ * @method sendQuery
+ * @param sQuery {String} Query string.
+ */
+YAHOO.widget.AutoComplete.prototype.sendQuery = function(sQuery) {
+    this._sendQuery(sQuery);
+};
+
+/////////////////////////////////////////////////////////////////////////////
+//
+// Public events
+//
+/////////////////////////////////////////////////////////////////////////////
+
+/**
+ * Fired when the input field receives focus.
+ *
+ * @event textboxFocusEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ */
+YAHOO.widget.AutoComplete.prototype.textboxFocusEvent = null;
+
+/**
+ * Fired when the input field receives key input.
+ *
+ * @event textboxKeyEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param nKeycode {Number} The keycode number.
+ */
+YAHOO.widget.AutoComplete.prototype.textboxKeyEvent = null;
+
+/**
+ * Fired when the AutoComplete instance makes a query to the DataSource.
+ * 
+ * @event dataRequestEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param sQuery {String} The query string.
+ */
+YAHOO.widget.AutoComplete.prototype.dataRequestEvent = null;
+
+/**
+ * Fired when the AutoComplete instance receives query results from the data
+ * source.
+ *
+ * @event dataReturnEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param sQuery {String} The query string.
+ * @param aResults {Array} Results array.
+ */
+YAHOO.widget.AutoComplete.prototype.dataReturnEvent = null;
+
+/**
+ * Fired when the AutoComplete instance does not receive query results from the
+ * DataSource due to an error.
+ *
+ * @event dataErrorEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param sQuery {String} The query string.
+ */
+YAHOO.widget.AutoComplete.prototype.dataErrorEvent = null;
+
+/**
+ * Fired when the results container is expanded.
+ *
+ * @event containerExpandEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ */
+YAHOO.widget.AutoComplete.prototype.containerExpandEvent = null;
+
+/**
+ * Fired when the input field has been prefilled by the type-ahead
+ * feature. 
+ *
+ * @event typeAheadEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param sQuery {String} The query string.
+ * @param sPrefill {String} The prefill string.
+ */
+YAHOO.widget.AutoComplete.prototype.typeAheadEvent = null;
+
+/**
+ * Fired when result item has been moused over.
+ *
+ * @event itemMouseOverEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param elItem {HTMLElement} The &lt;li&gt element item moused to.
+ */
+YAHOO.widget.AutoComplete.prototype.itemMouseOverEvent = null;
+
+/**
+ * Fired when result item has been moused out.
+ *
+ * @event itemMouseOutEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param elItem {HTMLElement} The &lt;li&gt; element item moused from.
+ */
+YAHOO.widget.AutoComplete.prototype.itemMouseOutEvent = null;
+
+/**
+ * Fired when result item has been arrowed to. 
+ *
+ * @event itemArrowToEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param elItem {HTMLElement} The &lt;li&gt; element item arrowed to.
+ */
+YAHOO.widget.AutoComplete.prototype.itemArrowToEvent = null;
+
+/**
+ * Fired when result item has been arrowed away from.
+ *
+ * @event itemArrowFromEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param elItem {HTMLElement} The &lt;li&gt; element item arrowed from.
+ */
+YAHOO.widget.AutoComplete.prototype.itemArrowFromEvent = null;
+
+/**
+ * Fired when an item is selected via mouse click, ENTER key, or TAB key.
+ *
+ * @event itemSelectEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param elItem {HTMLElement} The selected &lt;li&gt; element item.
+ * @param oData {Object} The data returned for the item, either as an object,
+ * or mapped from the schema into an array.
+ */
+YAHOO.widget.AutoComplete.prototype.itemSelectEvent = null;
+
+/**
+ * Fired when a user selection does not match any of the displayed result items.
+ * Note that this event may not behave as expected when delimiter characters
+ * have been defined. 
+ *
+ * @event unmatchedItemSelectEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ * @param sQuery {String} The user-typed query string.
+ */
+YAHOO.widget.AutoComplete.prototype.unmatchedItemSelectEvent = null;
+
+/**
+ * Fired if forceSelection is enabled and the user's input has been cleared
+ * because it did not match one of the returned query results.
+ *
+ * @event selectionEnforceEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ */
+YAHOO.widget.AutoComplete.prototype.selectionEnforceEvent = null;
+
+/**
+ * Fired when the results container is collapsed.
+ *
+ * @event containerCollapseEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ */
+YAHOO.widget.AutoComplete.prototype.containerCollapseEvent = null;
+
+/**
+ * Fired when the input field loses focus.
+ *
+ * @event textboxBlurEvent
+ * @param oSelf {Object} The AutoComplete instance.
+ */
+YAHOO.widget.AutoComplete.prototype.textboxBlurEvent = null;
+
+/////////////////////////////////////////////////////////////////////////////
+//
+// Private member variables
+//
+/////////////////////////////////////////////////////////////////////////////
+
+/**
+ * Internal class variable to index multiple AutoComplete instances.
+ *
+ * @property _nIndex
+ * @type Number
+ * @default 0
+ * @private
+ */
+YAHOO.widget.AutoComplete._nIndex = 0;
+
+/**
+ * Name of AutoComplete instance.
+ *
+ * @property _sName
+ * @type String
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._sName = null;
+
+/**
+ * Text input field DOM element.
+ *
+ * @property _oTextbox
+ * @type HTMLElement
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._oTextbox = null;
+
+/**
+ * Whether or not the input field is currently in focus. If query results come back
+ * but the user has already moved on, do not proceed with auto complete behavior.
+ *
+ * @property _bFocused
+ * @type Boolean
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._bFocused = true;
+
+/**
+ * Animation instance for container expand/collapse.
+ *
+ * @property _oAnim
+ * @type Boolean
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._oAnim = null;
+
+/**
+ * Container DOM element.
+ *
+ * @property _oContainer
+ * @type HTMLElement
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._oContainer = null;
+
+/**
+ * Whether or not the results container is currently open.
+ *
+ * @property _bContainerOpen
+ * @type Boolean
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._bContainerOpen = false;
+
+/**
+ * Whether or not the mouse is currently over the results
+ * container. This is necessary in order to prevent clicks on container items
+ * from being text input field blur events.
+ *
+ * @property _bOverContainer
+ * @type Boolean
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._bOverContainer = false;
+
+/**
+ * Array of &lt;li&gt; elements references that contain query results within the
+ * results container.
+ *
+ * @property _aListItems
+ * @type Array
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._aListItems = null;
+
+/**
+ * Number of &lt;li&gt; elements currently displayed in results container.
+ *
+ * @property _nDisplayedItems
+ * @type Number
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._nDisplayedItems = 0;
+
+/**
+ * Internal count of &lt;li&gt; elements displayed and hidden in results container.
+ *
+ * @property _maxResultsDisplayed
+ * @type Number
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._maxResultsDisplayed = 0;
+
+/**
+ * Current query string
+ *
+ * @property _sCurQuery
+ * @type String
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._sCurQuery = null;
+
+/**
+ * Past queries this session (for saving delimited queries).
+ *
+ * @property _sSavedQuery
+ * @type String
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._sSavedQuery = null;
+
+/**
+ * Pointer to the currently highlighted &lt;li&gt; element in the container.
+ *
+ * @property _oCurItem
+ * @type HTMLElement
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._oCurItem = null;
+
+/**
+ * Whether or not an item has been selected since the container was populated
+ * with results. Reset to false by _populateList, and set to true when item is
+ * selected.
+ *
+ * @property _bItemSelected
+ * @type Boolean
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._bItemSelected = false;
+
+/**
+ * Key code of the last key pressed in textbox.
+ *
+ * @property _nKeyCode
+ * @type Number
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._nKeyCode = null;
+
+/**
+ * Delay timeout ID.
+ *
+ * @property _nDelayID
+ * @type Number
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._nDelayID = -1;
+
+/**
+ * Src to iFrame used when useIFrame = true. Supports implementations over SSL
+ * as well.
+ *
+ * @property _iFrameSrc
+ * @type String
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._iFrameSrc = "javascript:false;";
+
+/**
+ * For users typing via certain IMEs, queries must be triggered by intervals,
+ * since key events yet supported across all browsers for all IMEs.
+ *
+ * @property _queryInterval
+ * @type Object
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._queryInterval = null;
+
+/**
+ * Internal tracker to last known textbox value, used to determine whether or not
+ * to trigger a query via interval for certain IME users.
+ *
+ * @event _sLastTextboxValue
+ * @type String
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._sLastTextboxValue = null;
+
+/////////////////////////////////////////////////////////////////////////////
+//
+// Private methods
+//
+/////////////////////////////////////////////////////////////////////////////
+
+/**
+ * Updates and validates latest public config properties.
+ *
+ * @method __initProps
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._initProps = function() {
+    // Correct any invalid values
+    var minQueryLength = this.minQueryLength;
+    if(isNaN(minQueryLength) || (minQueryLength < 1)) {
+        minQueryLength = 1;
+    }
+    var maxResultsDisplayed = this.maxResultsDisplayed;
+    if(isNaN(this.maxResultsDisplayed) || (this.maxResultsDisplayed < 1)) {
+        this.maxResultsDisplayed = 10;
+    }
+    var queryDelay = this.queryDelay;
+    if(isNaN(this.queryDelay) || (this.queryDelay < 0)) {
+        this.queryDelay = 0.5;
+    }
+    var aDelimChar = (this.delimChar) ? this.delimChar : null;
+    if(aDelimChar) {
+        if(typeof aDelimChar == "string") {
+            this.delimChar = [aDelimChar];
+        }
+        else if(aDelimChar.constructor != Array) {
+            this.delimChar = null;
+        }
+    }
+    var animSpeed = this.animSpeed;
+    if((this.animHoriz || this.animVert) && YAHOO.util.Anim) {
+        if(isNaN(animSpeed) || (animSpeed < 0)) {
+            animSpeed = 0.3;
+        }
+        if(!this._oAnim ) {
+            oAnim = new YAHOO.util.Anim(this._oContainer._oContent, {}, this.animSpeed);
+            this._oAnim = oAnim;
+        }
+        else {
+            this._oAnim.duration = animSpeed;
+        }
+    }
+    if(this.forceSelection && this.delimChar) {
+    }
+};
+
+/**
+ * Initializes the results container helpers if they are enabled and do
+ * not exist
+ *
+ * @method _initContainerHelpers
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._initContainerHelpers = function() {
+    if(this.useShadow && !this._oContainer._oShadow) {
+        var oShadow = document.createElement("div");
+        oShadow.className = "yui-ac-shadow";
+        this._oContainer._oShadow = this._oContainer.appendChild(oShadow);
+    }
+    if(this.useIFrame && !this._oContainer._oIFrame) {
+        var oIFrame = document.createElement("iframe");
+        oIFrame.src = this._iFrameSrc;
+        oIFrame.frameBorder = 0;
+        oIFrame.scrolling = "no";
+        oIFrame.style.position = "absolute";
+        oIFrame.style.width = "100%";
+        oIFrame.style.height = "100%";
+        oIFrame.tabIndex = -1;
+        this._oContainer._oIFrame = this._oContainer.appendChild(oIFrame);
+    }
+};
+
+/**
+ * Initializes the results container once at object creation
+ *
+ * @method _initContainer
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._initContainer = function() {
+    if(!this._oContainer._oContent) {
+        // The oContent div helps size the iframe and shadow properly
+        var oContent = document.createElement("div");
+        oContent.className = "yui-ac-content";
+        oContent.style.display = "none";
+        this._oContainer._oContent = this._oContainer.appendChild(oContent);
+
+        var oHeader = document.createElement("div");
+        oHeader.className = "yui-ac-hd";
+        oHeader.style.display = "none";
+        this._oContainer._oContent._oHeader = this._oContainer._oContent.appendChild(oHeader);
+
+        var oBody = document.createElement("div");
+        oBody.className = "yui-ac-bd";
+        this._oContainer._oContent._oBody = this._oContainer._oContent.appendChild(oBody);
+
+        var oFooter = document.createElement("div");
+        oFooter.className = "yui-ac-ft";
+        oFooter.style.display = "none";
+        this._oContainer._oContent._oFooter = this._oContainer._oContent.appendChild(oFooter);
+    }
+    else {
+    }
+};
+
+/**
+ * Clears out contents of container body and creates up to
+ * YAHOO.widget.AutoComplete#maxResultsDisplayed &lt;li&gt; elements in an
+ * &lt;ul&gt; element.
+ *
+ * @method _initList
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._initList = function() {
+    this._aListItems = [];
+    while(this._oContainer._oContent._oBody.hasChildNodes()) {
+        var oldListItems = this.getListItems();
+        if(oldListItems) {
+            for(var oldi = oldListItems.length-1; oldi >= 0; i--) {
+                oldListItems[oldi] = null;
+            }
+        }
+        this._oContainer._oContent._oBody.innerHTML = "";
+    }
+
+    var oList = document.createElement("ul");
+    oList = this._oContainer._oContent._oBody.appendChild(oList);
+    for(var i=0; i<this.maxResultsDisplayed; i++) {
+        var oItem = document.createElement("li");
+        oItem = oList.appendChild(oItem);
+        this._aListItems[i] = oItem;
+        this._initListItem(oItem, i);
+    }
+    this._maxResultsDisplayed = this.maxResultsDisplayed;
+};
+
+/**
+ * Initializes each &lt;li&gt; element in the container list.
+ *
+ * @method _initListItem
+ * @param oItem {HTMLElement} The &lt;li&gt; DOM element.
+ * @param nItemIndex {Number} The index of the element.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._initListItem = function(oItem, nItemIndex) {
+    var oSelf = this;
+    oItem.style.display = "none";
+    oItem._nItemIndex = nItemIndex;
+
+    oItem.mouseover = oItem.mouseout = oItem.onclick = null;
+    YAHOO.util.Event.addListener(oItem,"mouseover",oSelf._onItemMouseover,oSelf);
+    YAHOO.util.Event.addListener(oItem,"mouseout",oSelf._onItemMouseout,oSelf);
+    YAHOO.util.Event.addListener(oItem,"click",oSelf._onItemMouseclick,oSelf);
+};
+
+/**
+ * Enables interval detection for  Korean IME support.
+ *
+ * @method _onIMEDetected
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onIMEDetected = function(oSelf) {
+    oSelf._enableIntervalDetection();
+};
+
+/**
+ * Enables query triggers based on text input detection by intervals (rather
+ * than by key events).
+ *
+ * @method _enableIntervalDetection
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._enableIntervalDetection = function() {
+    var currValue = this._oTextbox.value;
+    var lastValue = this._sLastTextboxValue;
+    if(currValue != lastValue) {
+        this._sLastTextboxValue = currValue;
+        this._sendQuery(currValue);
+    }
+};
+
+/**
+ * Cancels text input detection by intervals.
+ *
+ * @method _cancelIntervalDetection
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._cancelIntervalDetection = function(oSelf) {
+    if(oSelf._queryInterval) {
+        clearInterval(oSelf._queryInterval);
+    }
+};
+
+/**
+ * Whether or not key is functional or should be ignored. Note that the right
+ * arrow key is NOT an ignored key since it triggers queries for certain intl
+ * charsets.
+ *
+ * @method _isIgnoreKey
+ * @param nKeycode {Number} Code of key pressed.
+ * @return {Boolean} True if key should be ignored, false otherwise.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._isIgnoreKey = function(nKeyCode) {
+    if ((nKeyCode == 9) || (nKeyCode == 13)  || // tab, enter
+            (nKeyCode == 16) || (nKeyCode == 17) || // shift, ctl
+            (nKeyCode >= 18 && nKeyCode <= 20) || // alt,pause/break,caps lock
+            (nKeyCode == 27) || // esc
+            (nKeyCode >= 33 && nKeyCode <= 35) || // page up,page down,end
+            (nKeyCode >= 36 && nKeyCode <= 38) || // home,left,up
+            (nKeyCode == 40) || // down
+            (nKeyCode >= 44 && nKeyCode <= 45)) { // print screen,insert
+        return true;
+    }
+    return false;
+};
+
+/**
+ * Makes query request to the DataSource.
+ *
+ * @method _sendQuery
+ * @param sQuery {String} Query string.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._sendQuery = function(sQuery) {
+    // Widget has been effectively turned off
+    if(this.minQueryLength == -1) {
+        this._toggleContainer(false);
+        return;
+    }
+    // Delimiter has been enabled
+    var aDelimChar = (this.delimChar) ? this.delimChar : null;
+    if(aDelimChar) {
+        // Loop through all possible delimiters and find the latest one
+        // A " " may be a false positive if they are defined as delimiters AND
+        // are used to separate delimited queries
+        var nDelimIndex = -1;
+        for(var i = aDelimChar.length-1; i >= 0; i--) {
+            var nNewIndex = sQuery.lastIndexOf(aDelimChar[i]);
+            if(nNewIndex > nDelimIndex) {
+                nDelimIndex = nNewIndex;
+            }
+        }
+        // If we think the last delimiter is a space (" "), make sure it is NOT
+        // a false positive by also checking the char directly before it
+        if(aDelimChar[i] == " ") {
+            for (var j = aDelimChar.length-1; j >= 0; j--) {
+                if(sQuery[nDelimIndex - 1] == aDelimChar[j]) {
+                    nDelimIndex--;
+                    break;
+                }
+            }
+        }
+        // A delimiter has been found so extract the latest query
+        if (nDelimIndex > -1) {
+            var nQueryStart = nDelimIndex + 1;
+            // Trim any white space from the beginning...
+            while(sQuery.charAt(nQueryStart) == " ") {
+                nQueryStart += 1;
+            }
+            // ...and save the rest of the string for later
+            this._sSavedQuery = sQuery.substring(0,nQueryStart);
+            // Here is the query itself
+            sQuery = sQuery.substr(nQueryStart);
+        }
+        else if(sQuery.indexOf(this._sSavedQuery) < 0){
+            this._sSavedQuery = null;
+        }
+    }
+
+    // Don't search queries that are too short
+    if (sQuery && (sQuery.length < this.minQueryLength) || (!sQuery && this.minQueryLength > 0)) {
+        if (this._nDelayID != -1) {
+            clearTimeout(this._nDelayID);
+        }
+        this._toggleContainer(false);
+        return;
+    }
+
+    sQuery = encodeURIComponent(sQuery);
+    this._nDelayID = -1;    // Reset timeout ID because request has been made
+    this.dataRequestEvent.fire(this, sQuery);
+    this.dataSource.getResults(this._populateList, sQuery, this);
+};
+
+/**
+ * Populates the array of &lt;li&gt; elements in the container with query
+ * results. This method is passed to YAHOO.widget.DataSource#getResults as a
+ * callback function so results from the DataSource instance are returned to the
+ * AutoComplete instance.
+ *
+ * @method _populateList
+ * @param sQuery {String} The query string.
+ * @param aResults {Array} An array of query result objects from the DataSource.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._populateList = function(sQuery, aResults, oSelf) {
+    if(aResults === null) {
+        oSelf.dataErrorEvent.fire(oSelf, sQuery);
+    }
+    if (!oSelf._bFocused || !aResults) {
+        return;
+    }
+
+    var isOpera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1);
+    var contentStyle = oSelf._oContainer._oContent.style;
+    contentStyle.width = (!isOpera) ? null : "";
+    contentStyle.height = (!isOpera) ? null : "";
+
+    var sCurQuery = decodeURIComponent(sQuery);
+    oSelf._sCurQuery = sCurQuery;
+    oSelf._bItemSelected = false;
+
+    if(oSelf._maxResultsDisplayed != oSelf.maxResultsDisplayed) {
+        oSelf._initList();
+    }
+
+    var nItems = Math.min(aResults.length,oSelf.maxResultsDisplayed);
+    oSelf._nDisplayedItems = nItems;
+    if (nItems > 0) {
+        oSelf._initContainerHelpers();
+        var aItems = oSelf._aListItems;
+
+        // Fill items with data
+        for(var i = nItems-1; i >= 0; i--) {
+            var oItemi = aItems[i];
+            var oResultItemi = aResults[i];
+            oItemi.innerHTML = oSelf.formatResult(oResultItemi, sCurQuery);
+            oItemi.style.display = "list-item";
+            oItemi._sResultKey = oResultItemi[0];
+            oItemi._oResultData = oResultItemi;
+
+        }
+
+        // Empty out remaining items if any
+        for(var j = aItems.length-1; j >= nItems ; j--) {
+            var oItemj = aItems[j];
+            oItemj.innerHTML = null;
+            oItemj.style.display = "none";
+            oItemj._sResultKey = null;
+            oItemj._oResultData = null;
+        }
+
+        if(oSelf.autoHighlight) {
+            // Go to the first item
+            var oFirstItem = aItems[0];
+            oSelf._toggleHighlight(oFirstItem,"to");
+            oSelf.itemArrowToEvent.fire(oSelf, oFirstItem);
+            oSelf._typeAhead(oFirstItem,sQuery);
+        }
+        else {
+            oSelf._oCurItem = null;
+        }
+
+        // Expand the container
+        var ok = oSelf.doBeforeExpandContainer(oSelf._oTextbox, oSelf._oContainer, sQuery, aResults);
+        oSelf._toggleContainer(ok);
+    }
+    else {
+        oSelf._toggleContainer(false);
+    }
+    oSelf.dataReturnEvent.fire(oSelf, sQuery, aResults);
+};
+
+/**
+ * When forceSelection is true and the user attempts
+ * leave the text input box without selecting an item from the query results,
+ * the user selection is cleared.
+ *
+ * @method _clearSelection
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._clearSelection = function() {
+    var sValue = this._oTextbox.value;
+    var sChar = (this.delimChar) ? this.delimChar[0] : null;
+    var nIndex = (sChar) ? sValue.lastIndexOf(sChar, sValue.length-2) : -1;
+    if(nIndex > -1) {
+        this._oTextbox.value = sValue.substring(0,nIndex);
+    }
+    else {
+         this._oTextbox.value = "";
+    }
+    this._sSavedQuery = this._oTextbox.value;
+
+    // Fire custom event
+    this.selectionEnforceEvent.fire(this);
+};
+
+/**
+ * Whether or not user-typed value in the text input box matches any of the
+ * query results.
+ *
+ * @method _textMatchesOption
+ * @return {Boolean} True if user-input text matches a result, false otherwise.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._textMatchesOption = function() {
+    var foundMatch = false;
+
+    for(var i = this._nDisplayedItems-1; i >= 0 ; i--) {
+        var oItem = this._aListItems[i];
+        var sMatch = oItem._sResultKey.toLowerCase();
+        if (sMatch == this._sCurQuery.toLowerCase()) {
+            foundMatch = true;
+            break;
+        }
+    }
+    return(foundMatch);
+};
+
+/**
+ * Updates in the text input box with the first query result as the user types,
+ * selecting the substring that the user has not typed.
+ *
+ * @method _typeAhead
+ * @param oItem {HTMLElement} The &lt;li&gt; element item whose data populates the input field.
+ * @param sQuery {String} Query string.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._typeAhead = function(oItem, sQuery) {
+    // Don't update if turned off
+    if (!this.typeAhead) {
+        return;
+    }
+
+    var oTextbox = this._oTextbox;
+    var sValue = this._oTextbox.value; // any saved queries plus what user has typed
+
+    // Don't update with type-ahead if text selection is not supported
+    if(!oTextbox.setSelectionRange && !oTextbox.createTextRange) {
+        return;
+    }
+
+    // Select the portion of text that the user has not typed
+    var nStart = sValue.length;
+    this._updateValue(oItem);
+    var nEnd = oTextbox.value.length;
+    this._selectText(oTextbox,nStart,nEnd);
+    var sPrefill = oTextbox.value.substr(nStart,nEnd);
+    this.typeAheadEvent.fire(this,sQuery,sPrefill);
+};
+
+/**
+ * Selects text in the input field.
+ *
+ * @method _selectText
+ * @param oTextbox {HTMLElement} Text input box element in which to select text.
+ * @param nStart {Number} Starting index of text string to select.
+ * @param nEnd {Number} Ending index of text selection.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._selectText = function(oTextbox, nStart, nEnd) {
+    if (oTextbox.setSelectionRange) { // For Mozilla
+        oTextbox.setSelectionRange(nStart,nEnd);
+    }
+    else if (oTextbox.createTextRange) { // For IE
+        var oTextRange = oTextbox.createTextRange();
+        oTextRange.moveStart("character", nStart);
+        oTextRange.moveEnd("character", nEnd-oTextbox.value.length);
+        oTextRange.select();
+    }
+    else {
+        oTextbox.select();
+    }
+};
+
+/**
+ * Syncs results container with its helpers.
+ *
+ * @method _toggleContainerHelpers
+ * @param bShow {Boolean} True if container is expanded, false if collapsed
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._toggleContainerHelpers = function(bShow) {
+    var bFireEvent = false;
+    var width = this._oContainer._oContent.offsetWidth + "px";
+    var height = this._oContainer._oContent.offsetHeight + "px";
+
+    if(this.useIFrame && this._oContainer._oIFrame) {
+        bFireEvent = true;
+        if(bShow) {
+            this._oContainer._oIFrame.style.width = width;
+            this._oContainer._oIFrame.style.height = height;
+        }
+        else {
+            this._oContainer._oIFrame.style.width = 0;
+            this._oContainer._oIFrame.style.height = 0;
+        }
+    }
+    if(this.useShadow && this._oContainer._oShadow) {
+        bFireEvent = true;
+        if(bShow) {
+            this._oContainer._oShadow.style.width = width;
+            this._oContainer._oShadow.style.height = height;
+        }
+        else {
+           this._oContainer._oShadow.style.width = 0;
+            this._oContainer._oShadow.style.height = 0;
+        }
+    }
+};
+
+/**
+ * Animates expansion or collapse of the container.
+ *
+ * @method _toggleContainer
+ * @param bShow {Boolean} True if container should be expanded, false if container should be collapsed
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._toggleContainer = function(bShow) {
+    var oContainer = this._oContainer;
+
+    // Implementer has container always open so don't mess with it
+    if(this.alwaysShowContainer && this._bContainerOpen) {
+        return;
+    }
+    
+    // Clear contents of container
+    if(!bShow) {
+        this._oContainer._oContent.scrollTop = 0;
+        var aItems = this._aListItems;
+
+        if(aItems && (aItems.length > 0)) {
+            for(var i = aItems.length-1; i >= 0 ; i--) {
+                aItems[i].style.display = "none";
+            }
+        }
+
+        if (this._oCurItem) {
+            this._toggleHighlight(this._oCurItem,"from");
+        }
+
+        this._oCurItem = null;
+        this._nDisplayedItems = 0;
+        this._sCurQuery = null;
+    }
+
+    // Container is already closed
+    if (!bShow && !this._bContainerOpen) {
+        oContainer._oContent.style.display = "none";
+        return;
+    }
+
+    // If animation is enabled...
+    var oAnim = this._oAnim;
+    if (oAnim && oAnim.getEl() && (this.animHoriz || this.animVert)) {
+        // If helpers need to be collapsed, do it right away...
+        // but if helpers need to be expanded, wait until after the container expands
+        if(!bShow) {
+            this._toggleContainerHelpers(bShow);
+        }
+
+        if(oAnim.isAnimated()) {
+            oAnim.stop();
+        }
+
+        // Clone container to grab current size offscreen
+        var oClone = oContainer._oContent.cloneNode(true);
+        oContainer.appendChild(oClone);
+        oClone.style.top = "-9000px";
+        oClone.style.display = "block";
+
+        // Current size of the container is the EXPANDED size
+        var wExp = oClone.offsetWidth;
+        var hExp = oClone.offsetHeight;
+
+        // Calculate COLLAPSED sizes based on horiz and vert anim
+        var wColl = (this.animHoriz) ? 0 : wExp;
+        var hColl = (this.animVert) ? 0 : hExp;
+
+        // Set animation sizes
+        oAnim.attributes = (bShow) ?
+            {width: { to: wExp }, height: { to: hExp }} :
+            {width: { to: wColl}, height: { to: hColl }};
+
+        // If opening anew, set to a collapsed size...
+        if(bShow && !this._bContainerOpen) {
+            oContainer._oContent.style.width = wColl+"px";
+            oContainer._oContent.style.height = hColl+"px";
+        }
+        // Else, set it to its last known size.
+        else {
+            oContainer._oContent.style.width = wExp+"px";
+            oContainer._oContent.style.height = hExp+"px";
+        }
+
+        oContainer.removeChild(oClone);
+        oClone = null;
+
+    	var oSelf = this;
+    	var onAnimComplete = function() {
+            // Finish the collapse
+    		oAnim.onComplete.unsubscribeAll();
+
+            if(bShow) {
+                oSelf.containerExpandEvent.fire(oSelf);
+            }
+            else {
+                oContainer._oContent.style.display = "none";
+                oSelf.containerCollapseEvent.fire(oSelf);
+            }
+            oSelf._toggleContainerHelpers(bShow);
+     	};
+
+        // Display container and animate it
+        oContainer._oContent.style.display = "block";
+        oAnim.onComplete.subscribe(onAnimComplete);
+        oAnim.animate();
+        this._bContainerOpen = bShow;
+    }
+    // Else don't animate, just show or hide
+    else {
+        if(bShow) {
+            oContainer._oContent.style.display = "block";
+            this.containerExpandEvent.fire(this);
+        }
+        else {
+            oContainer._oContent.style.display = "none";
+            this.containerCollapseEvent.fire(this);
+        }
+        this._toggleContainerHelpers(bShow);
+        this._bContainerOpen = bShow;
+   }
+
+};
+
+/**
+ * Toggles the highlight on or off for an item in the container, and also cleans
+ * up highlighting of any previous item.
+ *
+ * @method _toggleHighlight
+ * @param oNewItem {HTMLElement} The &lt;li&gt; element item to receive highlight behavior.
+ * @param sType {String} Type "mouseover" will toggle highlight on, and "mouseout" will toggle highlight off.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._toggleHighlight = function(oNewItem, sType) {
+    var sHighlight = this.highlightClassName;
+    if(this._oCurItem) {
+        // Remove highlight from old item
+        YAHOO.util.Dom.removeClass(this._oCurItem, sHighlight);
+    }
+
+    if((sType == "to") && sHighlight) {
+        // Apply highlight to new item
+        YAHOO.util.Dom.addClass(oNewItem, sHighlight);
+        this._oCurItem = oNewItem;
+    }
+};
+
+/**
+ * Toggles the pre-highlight on or off for an item in the container.
+ *
+ * @method _togglePrehighlight
+ * @param oNewItem {HTMLElement} The &lt;li&gt; element item to receive highlight behavior.
+ * @param sType {String} Type "mouseover" will toggle highlight on, and "mouseout" will toggle highlight off.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._togglePrehighlight = function(oNewItem, sType) {
+    if(oNewItem == this._oCurItem) {
+        return;
+    }
+
+    var sPrehighlight = this.prehighlightClassName;
+    if((sType == "mouseover") && sPrehighlight) {
+        // Apply prehighlight to new item
+        YAHOO.util.Dom.addClass(oNewItem, sPrehighlight);
+    }
+    else {
+        // Remove prehighlight from old item
+        YAHOO.util.Dom.removeClass(oNewItem, sPrehighlight);
+    }
+};
+
+/**
+ * Updates the text input box value with selected query result. If a delimiter
+ * has been defined, then the value gets appended with the delimiter.
+ *
+ * @method _updateValue
+ * @param oItem {HTMLElement} The &lt;li&gt; element item with which to update the value.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._updateValue = function(oItem) {
+    var oTextbox = this._oTextbox;
+    var sDelimChar = (this.delimChar) ? (this.delimChar[0] || this.delimChar) : null;
+    var sSavedQuery = this._sSavedQuery;
+    var sResultKey = oItem._sResultKey;
+    oTextbox.focus();
+
+    // First clear text field
+    oTextbox.value = "";
+    // Grab data to put into text field
+    if(sDelimChar) {
+        if(sSavedQuery) {
+            oTextbox.value = sSavedQuery;
+        }
+        oTextbox.value += sResultKey + sDelimChar;
+        if(sDelimChar != " ") {
+            oTextbox.value += " ";
+        }
+    }
+    else { oTextbox.value = sResultKey; }
+
+    // scroll to bottom of textarea if necessary
+    if(oTextbox.type == "textarea") {
+        oTextbox.scrollTop = oTextbox.scrollHeight;
+    }
+
+    // move cursor to end
+    var end = oTextbox.value.length;
+    this._selectText(oTextbox,end,end);
+
+    this._oCurItem = oItem;
+};
+
+/**
+ * Selects a result item from the container
+ *
+ * @method _selectItem
+ * @param oItem {HTMLElement} The selected &lt;li&gt; element item.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._selectItem = function(oItem) {
+    this._bItemSelected = true;
+    this._updateValue(oItem);
+    this._cancelIntervalDetection(this);
+    this.itemSelectEvent.fire(this, oItem, oItem._oResultData);
+    this._toggleContainer(false);
+};
+
+/**
+ * For values updated by type-ahead, the right arrow key jumps to the end
+ * of the textbox, otherwise the container is closed.
+ *
+ * @method _jumpSelection
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._jumpSelection = function() {
+    if(!this.typeAhead) {
+        return;
+    }
+    else {
+        this._toggleContainer(false);
+    }
+};
+
+/**
+ * Triggered by up and down arrow keys, changes the current highlighted
+ * &lt;li&gt; element item. Scrolls container if necessary.
+ *
+ * @method _moveSelection
+ * @param nKeyCode {Number} Code of key pressed.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._moveSelection = function(nKeyCode) {
+    if(this._bContainerOpen) {
+        // Determine current item's id number
+        var oCurItem = this._oCurItem;
+        var nCurItemIndex = -1;
+
+        if (oCurItem) {
+            nCurItemIndex = oCurItem._nItemIndex;
+        }
+
+        var nNewItemIndex = (nKeyCode == 40) ?
+                (nCurItemIndex + 1) : (nCurItemIndex - 1);
+
+        // Out of bounds
+        if (nNewItemIndex < -2 || nNewItemIndex >= this._nDisplayedItems) {
+            return;
+        }
+
+        if (oCurItem) {
+            // Unhighlight current item
+            this._toggleHighlight(oCurItem, "from");
+            this.itemArrowFromEvent.fire(this, oCurItem);
+        }
+        if (nNewItemIndex == -1) {
+           // Go back to query (remove type-ahead string)
+            if(this.delimChar && this._sSavedQuery) {
+                if (!this._textMatchesOption()) {
+                    this._oTextbox.value = this._sSavedQuery;
+                }
+                else {
+                    this._oTextbox.value = this._sSavedQuery + this._sCurQuery;
+                }
+            }
+            else {
+                this._oTextbox.value = this._sCurQuery;
+            }
+            this._oCurItem = null;
+            return;
+        }
+        if (nNewItemIndex == -2) {
+            // Close container
+            this._toggleContainer(false);
+            return;
+        }
+
+        var oNewItem = this._aListItems[nNewItemIndex];
+
+        // Scroll the container if necessary
+        var oContent = this._oContainer._oContent;
+        var scrollOn = ((YAHOO.util.Dom.getStyle(oContent,"overflow") == "auto") ||
+            (YAHOO.util.Dom.getStyle(oContent,"overflowY") == "auto"));
+        if(scrollOn && (nNewItemIndex > -1) &&
+        (nNewItemIndex < this._nDisplayedItems)) {
+            // User is keying down
+            if(nKeyCode == 40) {
+                // Bottom of selected item is below scroll area...
+                if((oNewItem.offsetTop+oNewItem.offsetHeight) > (oContent.scrollTop + oContent.offsetHeight)) {
+                    // Set bottom of scroll area to bottom of selected item
+                    oContent.scrollTop = (oNewItem.offsetTop+oNewItem.offsetHeight) - oContent.offsetHeight;
+                }
+                // Bottom of selected item is above scroll area...
+                else if((oNewItem.offsetTop+oNewItem.offsetHeight) < oContent.scrollTop) {
+                    // Set top of selected item to top of scroll area
+                    oContent.scrollTop = oNewItem.offsetTop;
+
+                }
+            }
+            // User is keying up
+            else {
+                // Top of selected item is above scroll area
+                if(oNewItem.offsetTop < oContent.scrollTop) {
+                    // Set top of scroll area to top of selected item
+                    this._oContainer._oContent.scrollTop = oNewItem.offsetTop;
+                }
+                // Top of selected item is below scroll area
+                else if(oNewItem.offsetTop > (oContent.scrollTop + oContent.offsetHeight)) {
+                    // Set bottom of selected item to bottom of scroll area
+                    this._oContainer._oContent.scrollTop = (oNewItem.offsetTop+oNewItem.offsetHeight) - oContent.offsetHeight;
+                }
+            }
+        }
+
+        this._toggleHighlight(oNewItem, "to");
+        this.itemArrowToEvent.fire(this, oNewItem);
+        if(this.typeAhead) {
+            this._updateValue(oNewItem);
+        }
+    }
+};
+
+/////////////////////////////////////////////////////////////////////////////
+//
+// Private event handlers
+//
+/////////////////////////////////////////////////////////////////////////////
+
+/**
+ * Handles &lt;li&gt; element mouseover events in the container.
+ *
+ * @method _onItemMouseover
+ * @param v {HTMLEvent} The mouseover event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onItemMouseover = function(v,oSelf) {
+    if(oSelf.prehighlightClassName) {
+        oSelf._togglePrehighlight(this,"mouseover");
+    }
+    else {
+        oSelf._toggleHighlight(this,"to");
+    }
+
+    oSelf.itemMouseOverEvent.fire(oSelf, this);
+};
+
+/**
+ * Handles &lt;li&gt; element mouseout events in the container.
+ *
+ * @method _onItemMouseout
+ * @param v {HTMLEvent} The mouseout event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onItemMouseout = function(v,oSelf) {
+    if(oSelf.prehighlightClassName) {
+        oSelf._togglePrehighlight(this,"mouseout");
+    }
+    else {
+        oSelf._toggleHighlight(this,"from");
+    }
+
+    oSelf.itemMouseOutEvent.fire(oSelf, this);
+};
+
+/**
+ * Handles &lt;li&gt; element click events in the container.
+ *
+ * @method _onItemMouseclick
+ * @param v {HTMLEvent} The click event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onItemMouseclick = function(v,oSelf) {
+    // In case item has not been moused over
+    oSelf._toggleHighlight(this,"to");
+    oSelf._selectItem(this);
+};
+
+/**
+ * Handles container mouseover events.
+ *
+ * @method _onContainerMouseover
+ * @param v {HTMLEvent} The mouseover event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onContainerMouseover = function(v,oSelf) {
+    oSelf._bOverContainer = true;
+};
+
+/**
+ * Handles container mouseout events.
+ *
+ * @method _onContainerMouseout
+ * @param v {HTMLEvent} The mouseout event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onContainerMouseout = function(v,oSelf) {
+    oSelf._bOverContainer = false;
+    // If container is still active
+    if(oSelf._oCurItem) {
+        oSelf._toggleHighlight(oSelf._oCurItem,"to");
+    }
+};
+
+/**
+ * Handles container scroll events.
+ *
+ * @method _onContainerScroll
+ * @param v {HTMLEvent} The scroll event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onContainerScroll = function(v,oSelf) {
+    oSelf._oTextbox.focus();
+};
+
+/**
+ * Handles container resize events.
+ *
+ * @method _onContainerResize
+ * @param v {HTMLEvent} The resize event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onContainerResize = function(v,oSelf) {
+    oSelf._toggleContainerHelpers(oSelf._bContainerOpen);
+};
+
+/**
+ * Handles textbox keydown events of functional keys, mainly for UI behavior.
+ *
+ * @method _onTextboxKeyDown
+ * @param v {HTMLEvent} The keydown event.
+ * @param oSelf {object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onTextboxKeyDown = function(v,oSelf) {
+    var nKeyCode = v.keyCode;
+
+    switch (nKeyCode) {
+        case 9: // tab
+            if(oSelf.delimChar && (oSelf._nKeyCode != nKeyCode)) {
+                if(oSelf._bContainerOpen) {
+                    YAHOO.util.Event.stopEvent(v);
+                }
+            }
+            // select an item or clear out
+            if(oSelf._oCurItem) {
+                oSelf._selectItem(oSelf._oCurItem);
+            }
+            else {
+                oSelf._toggleContainer(false);
+            }
+            break;
+        case 13: // enter
+            if(oSelf._nKeyCode != nKeyCode) {
+                if(oSelf._bContainerOpen) {
+                    YAHOO.util.Event.stopEvent(v);
+                }
+            }
+            if(oSelf._oCurItem) {
+                oSelf._selectItem(oSelf._oCurItem);
+            }
+            else {
+                oSelf._toggleContainer(false);
+            }
+            break;
+        case 27: // esc
+            oSelf._toggleContainer(false);
+            return;
+        case 39: // right
+            oSelf._jumpSelection();
+            break;
+        case 38: // up
+            YAHOO.util.Event.stopEvent(v);
+            oSelf._moveSelection(nKeyCode);
+            break;
+        case 40: // down
+            YAHOO.util.Event.stopEvent(v);
+            oSelf._moveSelection(nKeyCode);
+            break;
+        default:
+            break;
+    }
+};
+
+/**
+ * Handles textbox keypress events.
+ * @method _onTextboxKeyPress
+ * @param v {HTMLEvent} The keypress event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onTextboxKeyPress = function(v,oSelf) {
+    var nKeyCode = v.keyCode;
+
+        //Expose only to Mac browsers, where stopEvent is ineffective on keydown events (bug 790337)
+        var isMac = (navigator.userAgent.toLowerCase().indexOf("mac") != -1);
+        if(isMac) {
+            switch (nKeyCode) {
+            case 9: // tab
+                if(oSelf.delimChar && (oSelf._nKeyCode != nKeyCode)) {
+                    if(oSelf._bContainerOpen) {
+                        YAHOO.util.Event.stopEvent(v);
+                    }
+                }
+                break;
+            case 13: // enter
+                    if(oSelf._nKeyCode != nKeyCode) {
+                        if(oSelf._bContainerOpen) {
+                            YAHOO.util.Event.stopEvent(v);
+                        }
+                    }
+                break;
+            case 38: // up
+            case 40: // down
+                YAHOO.util.Event.stopEvent(v);
+                break;
+            default:
+                break;
+            }
+        }
+
+        //TODO: (?) limit only to non-IE, non-Mac-FF for Korean IME support (bug 811948)
+        // Korean IME detected
+        else if(nKeyCode == 229) {
+            oSelf._queryInterval = setInterval(function() { oSelf._onIMEDetected(oSelf); },500);
+        }
+};
+
+/**
+ * Handles textbox keyup events that trigger queries.
+ *
+ * @method _onTextboxKeyUp
+ * @param v {HTMLEvent} The keyup event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onTextboxKeyUp = function(v,oSelf) {
+    // Check to see if any of the public properties have been updated
+    oSelf._initProps();
+
+    var nKeyCode = v.keyCode;
+    oSelf._nKeyCode = nKeyCode;
+    var sText = this.value; //string in textbox
+
+    // Filter out chars that don't trigger queries
+    if (oSelf._isIgnoreKey(nKeyCode) || (sText.toLowerCase() == oSelf._sCurQuery)) {
+        return;
+    }
+    else {
+        oSelf.textboxKeyEvent.fire(oSelf, nKeyCode);
+    }
+
+    // Set timeout on the request
+    if (oSelf.queryDelay > 0) {
+        var nDelayID =
+            setTimeout(function(){oSelf._sendQuery(sText);},(oSelf.queryDelay * 1000));
+
+        if (oSelf._nDelayID != -1) {
+            clearTimeout(oSelf._nDelayID);
+        }
+
+        oSelf._nDelayID = nDelayID;
+    }
+    else {
+        // No delay so send request immediately
+        oSelf._sendQuery(sText);
+    }
+};
+
+/**
+ * Handles text input box receiving focus.
+ *
+ * @method _onTextboxFocus
+ * @param v {HTMLEvent} The focus event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onTextboxFocus = function (v,oSelf) {
+    oSelf._oTextbox.setAttribute("autocomplete","off");
+    oSelf._bFocused = true;
+    oSelf.textboxFocusEvent.fire(oSelf);
+};
+
+/**
+ * Handles text input box losing focus.
+ *
+ * @method _onTextboxBlur
+ * @param v {HTMLEvent} The focus event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onTextboxBlur = function (v,oSelf) {
+    // Don't treat as a blur if it was a selection via mouse click
+    if(!oSelf._bOverContainer || (oSelf._nKeyCode == 9)) {
+        // Current query needs to be validated
+        if(!oSelf._bItemSelected) {
+            if(!oSelf._bContainerOpen || (oSelf._bContainerOpen && !oSelf._textMatchesOption())) {
+                if(oSelf.forceSelection) {
+                    oSelf._clearSelection();
+                }
+                else {
+                    oSelf.unmatchedItemSelectEvent.fire(oSelf, oSelf._sCurQuery);
+                }
+            }
+        }
+
+        if(oSelf._bContainerOpen) {
+            oSelf._toggleContainer(false);
+        }
+        oSelf._cancelIntervalDetection(oSelf);
+        oSelf._bFocused = false;
+        oSelf.textboxBlurEvent.fire(oSelf);
+    }
+};
+
+/**
+ * Handles form submission event.
+ *
+ * @method _onFormSubmit
+ * @param v {HTMLEvent} The submit event.
+ * @param oSelf {Object} The AutoComplete instance.
+ * @private
+ */
+YAHOO.widget.AutoComplete.prototype._onFormSubmit = function(v,oSelf) {
+    if(oSelf.allowBrowserAutocomplete) {
+        oSelf._oTextbox.setAttribute("autocomplete","on");
+    }
+    else {
+        oSelf._oTextbox.setAttribute("autocomplete","off");
+    }
+};
+/****************************************************************************/

+/****************************************************************************/

+/****************************************************************************/

+

+/**

+ * The DataSource classes manages sending a request and returning response from a live

+ * database. Supported data include local JavaScript arrays and objects and databases

+ * accessible via XHR connections. Supported response formats include JavaScript arrays,

+ * JSON, XML, and flat-file textual data.

+ *  

+ * @class DataSource

+ * @constructor

+ */

+YAHOO.widget.DataSource = function() { 

+    /* abstract class */

+};

+

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public constants

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Error message for null data responses.

+ *

+ * @property ERROR_DATANULL

+ * @type String

+ * @static

+ * @final

+ */

+YAHOO.widget.DataSource.ERROR_DATANULL = "Response data was null";

+

+/**

+ * Error message for data responses with parsing errors.

+ *

+ * @property ERROR_DATAPARSE

+ * @type String

+ * @static

+ * @final

+ */

+YAHOO.widget.DataSource.ERROR_DATAPARSE = "Response data could not be parsed";

+

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public member variables

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Max size of the local cache.  Set to 0 to turn off caching.  Caching is

+ * useful to reduce the number of server connections.  Recommended only for data

+ * sources that return comprehensive results for queries or when stale data is

+ * not an issue.

+ *

+ * @property maxCacheEntries

+ * @type Number

+ * @default 15

+ */

+YAHOO.widget.DataSource.prototype.maxCacheEntries = 15;

+

+/**

+ * Use this to equate cache matching with the type of matching done by your live

+ * data source. If caching is on and queryMatchContains is true, the cache

+ * returns results that "contain" the query string. By default,

+ * queryMatchContains is set to false, meaning the cache only returns results

+ * that "start with" the query string.

+ *

+ * @property queryMatchContains

+ * @type Boolean

+ * @default false

+ */

+YAHOO.widget.DataSource.prototype.queryMatchContains = false;

+

+/**

+ * Enables query subset matching. If caching is on and queryMatchSubset is

+ * true, substrings of queries will return matching cached results. For

+ * instance, if the first query is for "abc" susequent queries that start with

+ * "abc", like "abcd", will be queried against the cache, and not the live data

+ * source. Recommended only for DataSources that return comprehensive results

+ * for queries with very few characters.

+ *

+ * @property queryMatchSubset

+ * @type Boolean

+ * @default false

+ *

+ */

+YAHOO.widget.DataSource.prototype.queryMatchSubset = false;

+

+/**

+ * Enables query case-sensitivity matching. If caching is on and

+ * queryMatchCase is true, queries will only return results for case-sensitive

+ * matches.

+ *

+ * @property queryMatchCase

+ * @type Boolean

+ * @default false

+ */

+YAHOO.widget.DataSource.prototype.queryMatchCase = false;

+

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public methods

+//

+/////////////////////////////////////////////////////////////////////////////

+

+ /**

+ * Public accessor to the unique name of the DataSource instance.

+ *

+ * @method toString

+ * @return {String} Unique name of the DataSource instance

+ */

+YAHOO.widget.DataSource.prototype.toString = function() {

+    return "DataSource " + this._sName;

+};

+

+/**

+ * Retrieves query results, first checking the local cache, then making the

+ * query request to the live data source as defined by the function doQuery.

+ *

+ * @method getResults

+ * @param oCallbackFn {HTMLFunction} Callback function defined by oParent object to which to return results.

+ * @param sQuery {String} Query string.

+ * @param oParent {Object} The object instance that has requested data.

+ */

+YAHOO.widget.DataSource.prototype.getResults = function(oCallbackFn, sQuery, oParent) {

+    

+    // First look in cache

+    var aResults = this._doQueryCache(oCallbackFn,sQuery,oParent);

+    

+    // Not in cache, so get results from server

+    if(aResults.length === 0) {

+        this.queryEvent.fire(this, oParent, sQuery);

+        this.doQuery(oCallbackFn, sQuery, oParent);

+    }

+};

+

+/**

+ * Abstract method implemented by subclasses to make a query to the live data

+ * source. Must call the callback function with the response returned from the

+ * query. Populates cache (if enabled).

+ *

+ * @method doQuery

+ * @param oCallbackFn {HTMLFunction} Callback function implemented by oParent to which to return results.

+ * @param sQuery {String} Query string.

+ * @param oParent {Object} The object instance that has requested data.

+ */

+YAHOO.widget.DataSource.prototype.doQuery = function(oCallbackFn, sQuery, oParent) {

+    /* override this */ 

+};

+

+/**

+ * Flushes cache.

+ *

+ * @method flushCache

+ */

+YAHOO.widget.DataSource.prototype.flushCache = function() {

+    if(this._aCache) {

+        this._aCache = [];

+    }

+    if(this._aCacheHelper) {

+        this._aCacheHelper = [];

+    }

+    this.cacheFlushEvent.fire(this);

+};

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public events

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Fired when a query is made to the live data source.

+ *

+ * @event queryEvent

+ * @param oSelf {Object} The DataSource instance.

+ * @param oParent {Object} The requesting object.

+ * @param sQuery {String} The query string.

+ */

+YAHOO.widget.DataSource.prototype.queryEvent = null;

+

+/**

+ * Fired when a query is made to the local cache.

+ *

+ * @event cacheQueryEvent

+ * @param oSelf {Object} The DataSource instance.

+ * @param oParent {Object} The requesting object.

+ * @param sQuery {String} The query string.

+ */

+YAHOO.widget.DataSource.prototype.cacheQueryEvent = null;

+

+/**

+ * Fired when data is retrieved from the live data source.

+ *

+ * @event getResultsEvent

+ * @param oSelf {Object} The DataSource instance.

+ * @param oParent {Object} The requesting object.

+ * @param sQuery {String} The query string.

+ * @param aResults {Object[]} Array of result objects.

+ */

+YAHOO.widget.DataSource.prototype.getResultsEvent = null;

+    

+/**

+ * Fired when data is retrieved from the local cache.

+ *

+ * @event getCachedResultsEvent

+ * @param oSelf {Object} The DataSource instance.

+ * @param oParent {Object} The requesting object.

+ * @param sQuery {String} The query string.

+ * @param aResults {Object[]} Array of result objects.

+ */

+YAHOO.widget.DataSource.prototype.getCachedResultsEvent = null;

+

+/**

+ * Fired when an error is encountered with the live data source.

+ *

+ * @event dataErrorEvent

+ * @param oSelf {Object} The DataSource instance.

+ * @param oParent {Object} The requesting object.

+ * @param sQuery {String} The query string.

+ * @param sMsg {String} Error message string

+ */

+YAHOO.widget.DataSource.prototype.dataErrorEvent = null;

+

+/**

+ * Fired when the local cache is flushed.

+ *

+ * @event cacheFlushEvent

+ * @param oSelf {Object} The DataSource instance

+ */

+YAHOO.widget.DataSource.prototype.cacheFlushEvent = null;

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Private member variables

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Internal class variable to index multiple DataSource instances.

+ *

+ * @property _nIndex

+ * @type Number

+ * @private

+ * @static

+ */

+YAHOO.widget.DataSource._nIndex = 0;

+

+/**

+ * Name of DataSource instance.

+ *

+ * @property _sName

+ * @type String

+ * @private

+ */

+YAHOO.widget.DataSource.prototype._sName = null;

+

+/**

+ * Local cache of data result objects indexed chronologically.

+ *

+ * @property _aCache

+ * @type Object[]

+ * @private

+ */

+YAHOO.widget.DataSource.prototype._aCache = null;

+

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Private methods

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Initializes DataSource instance.

+ *  

+ * @method _init

+ * @private

+ */

+YAHOO.widget.DataSource.prototype._init = function() {

+    // Validate and initialize public configs

+    var maxCacheEntries = this.maxCacheEntries;

+    if(isNaN(maxCacheEntries) || (maxCacheEntries < 0)) {

+        maxCacheEntries = 0;

+    }

+    // Initialize local cache

+    if(maxCacheEntries > 0 && !this._aCache) {

+        this._aCache = [];

+    }

+    

+    this._sName = "instance" + YAHOO.widget.DataSource._nIndex;

+    YAHOO.widget.DataSource._nIndex++;

+    

+    this.queryEvent = new YAHOO.util.CustomEvent("query", this);

+    this.cacheQueryEvent = new YAHOO.util.CustomEvent("cacheQuery", this);

+    this.getResultsEvent = new YAHOO.util.CustomEvent("getResults", this);

+    this.getCachedResultsEvent = new YAHOO.util.CustomEvent("getCachedResults", this);

+    this.dataErrorEvent = new YAHOO.util.CustomEvent("dataError", this);

+    this.cacheFlushEvent = new YAHOO.util.CustomEvent("cacheFlush", this);

+};

+

+/**

+ * Adds a result object to the local cache, evicting the oldest element if the 

+ * cache is full. Newer items will have higher indexes, the oldest item will have

+ * index of 0. 

+ *

+ * @method _addCacheElem

+ * @param oResult {Object} Data result object, including array of results.

+ * @private

+ */

+YAHOO.widget.DataSource.prototype._addCacheElem = function(oResult) {

+    var aCache = this._aCache;

+    // Don't add if anything important is missing.

+    if(!aCache || !oResult || !oResult.query || !oResult.results) {

+        return;

+    }

+    

+    // If the cache is full, make room by removing from index=0

+    if(aCache.length >= this.maxCacheEntries) {

+        aCache.shift();

+    }

+        

+    // Add to cache, at the end of the array

+    aCache.push(oResult);

+};

+

+/**

+ * Queries the local cache for results. If query has been cached, the callback

+ * function is called with the results, and the cached is refreshed so that it

+ * is now the newest element.  

+ *

+ * @method _doQueryCache

+ * @param oCallbackFn {HTMLFunction} Callback function defined by oParent object to which to return results.

+ * @param sQuery {String} Query string.

+ * @param oParent {Object} The object instance that has requested data.

+ * @return aResults {Object[]} Array of results from local cache if found, otherwise null.

+ * @private 

+ */

+YAHOO.widget.DataSource.prototype._doQueryCache = function(oCallbackFn, sQuery, oParent) {

+    var aResults = [];

+    var bMatchFound = false;

+    var aCache = this._aCache;

+    var nCacheLength = (aCache) ? aCache.length : 0;

+    var bMatchContains = this.queryMatchContains;

+    

+    // If cache is enabled...

+    if((this.maxCacheEntries > 0) && aCache && (nCacheLength > 0)) {

+        this.cacheQueryEvent.fire(this, oParent, sQuery);

+        // If case is unimportant, normalize query now instead of in loops

+        if(!this.queryMatchCase) {

+            var sOrigQuery = sQuery;

+            sQuery = sQuery.toLowerCase();

+        }

+

+        // Loop through each cached element's query property...

+        for(var i = nCacheLength-1; i >= 0; i--) {

+            var resultObj = aCache[i];

+            var aAllResultItems = resultObj.results;

+            // If case is unimportant, normalize match key for comparison

+            var matchKey = (!this.queryMatchCase) ?

+                encodeURIComponent(resultObj.query).toLowerCase():

+                encodeURIComponent(resultObj.query);

+            

+            // If a cached match key exactly matches the query...

+            if(matchKey == sQuery) {

+                    // Stash all result objects into aResult[] and stop looping through the cache.

+                    bMatchFound = true;

+                    aResults = aAllResultItems;

+                    

+                    // The matching cache element was not the most recent,

+                    // so now we need to refresh the cache.

+                    if(i != nCacheLength-1) {                        

+                        // Remove element from its original location

+                        aCache.splice(i,1);

+                        // Add element as newest

+                        this._addCacheElem(resultObj);

+                    }

+                    break;

+            }

+            // Else if this query is not an exact match and subset matching is enabled...

+            else if(this.queryMatchSubset) {

+                // Loop through substrings of each cached element's query property...

+                for(var j = sQuery.length-1; j >= 0 ; j--) {

+                    var subQuery = sQuery.substr(0,j);

+                    

+                    // If a substring of a cached sQuery exactly matches the query...

+                    if(matchKey == subQuery) {                    

+                        bMatchFound = true;

+                        

+                        // Go through each cached result object to match against the query...

+                        for(var k = aAllResultItems.length-1; k >= 0; k--) {

+                            var aRecord = aAllResultItems[k];

+                            var sKeyIndex = (this.queryMatchCase) ?

+                                encodeURIComponent(aRecord[0]).indexOf(sQuery):

+                                encodeURIComponent(aRecord[0]).toLowerCase().indexOf(sQuery);

+                            

+                            // A STARTSWITH match is when the query is found at the beginning of the key string...

+                            if((!bMatchContains && (sKeyIndex === 0)) ||

+                            // A CONTAINS match is when the query is found anywhere within the key string...

+                            (bMatchContains && (sKeyIndex > -1))) {

+                                // Stash a match into aResults[].

+                                aResults.unshift(aRecord);

+                            }

+                        }

+                        

+                        // Add the subset match result set object as the newest element to cache,

+                        // and stop looping through the cache.

+                        resultObj = {};

+                        resultObj.query = sQuery;

+                        resultObj.results = aResults;

+                        this._addCacheElem(resultObj);

+                        break;

+                    }

+                }

+                if(bMatchFound) {

+                    break;

+                }

+            }

+        }

+        

+        // If there was a match, send along the results.

+        if(bMatchFound) {

+            this.getCachedResultsEvent.fire(this, oParent, sOrigQuery, aResults);

+            oCallbackFn(sOrigQuery, aResults, oParent);

+        }

+    }

+    return aResults;

+};

+

+

+/****************************************************************************/

+/****************************************************************************/

+/****************************************************************************/

+

+/**

+ * Implementation of YAHOO.widget.DataSource using XML HTTP requests that return

+ * query results.

+ *  

+ * @class DS_XHR

+ * @extends YAHOO.widget.DataSource

+ * @requires connection

+ * @constructor

+ * @param sScriptURI {String} Absolute or relative URI to script that returns query

+ * results as JSON, XML, or delimited flat-file data.

+ * @param aSchema {String[]} Data schema definition of results.

+ * @param oConfigs {Object} (optional) Object literal of config params.

+ */

+YAHOO.widget.DS_XHR = function(sScriptURI, aSchema, oConfigs) {

+    // Set any config params passed in to override defaults

+    if(typeof oConfigs == "object") {

+        for(var sConfig in oConfigs) {

+            this[sConfig] = oConfigs[sConfig];

+        }

+    }

+    

+    // Initialization sequence

+    if(!aSchema || (aSchema.constructor != Array)) {

+        return;

+    }

+    else {

+        this.schema = aSchema;

+    }

+    this.scriptURI = sScriptURI;

+    this._init();

+};

+

+YAHOO.widget.DS_XHR.prototype = new YAHOO.widget.DataSource();

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public constants

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * JSON data type.

+ *

+ * @property TYPE_JSON

+ * @type Number

+ * @static

+ * @final

+ */

+YAHOO.widget.DS_XHR.TYPE_JSON = 0;

+

+/**

+ * XML data type.

+ *

+ * @property TYPE_XML

+ * @type Number

+ * @static

+ * @final

+ */

+YAHOO.widget.DS_XHR.TYPE_XML = 1;

+

+/**

+ * Flat-file data type.

+ *

+ * @property TYPE_FLAT

+ * @type Number

+ * @static

+ * @final

+ */

+YAHOO.widget.DS_XHR.TYPE_FLAT = 2;

+

+/**

+ * Error message for XHR failure.

+ *

+ * @property ERROR_DATAXHR

+ * @type String

+ * @static

+ * @final

+ */

+YAHOO.widget.DS_XHR.ERROR_DATAXHR = "XHR response failed";

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public member variables

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Alias to YUI Connection Manager. Allows implementers to specify their own

+ * subclasses of the YUI Connection Manager utility.

+ *

+ * @property connMgr

+ * @type Object

+ * @default YAHOO.util.Connect

+ */

+YAHOO.widget.DS_XHR.prototype.connMgr = YAHOO.util.Connect;

+

+/**

+ * Number of milliseconds the XHR connection will wait for a server response. A

+ * a value of zero indicates the XHR connection will wait forever. Any value

+ * greater than zero will use the Connection utility's Auto-Abort feature.

+ *

+ * @property connTimeout

+ * @type Number

+ * @default 0

+ */

+YAHOO.widget.DS_XHR.prototype.connTimeout = 0;

+

+/**

+ * Absolute or relative URI to script that returns query results. For instance,

+ * queries will be sent to &#60;scriptURI&#62;?&#60;scriptQueryParam&#62;=userinput

+ *

+ * @property scriptURI

+ * @type String

+ */

+YAHOO.widget.DS_XHR.prototype.scriptURI = null;

+

+/**

+ * Query string parameter name sent to scriptURI. For instance, queries will be

+ * sent to &#60;scriptURI&#62;?&#60;scriptQueryParam&#62;=userinput

+ *

+ * @property scriptQueryParam

+ * @type String

+ * @default "query"

+ */

+YAHOO.widget.DS_XHR.prototype.scriptQueryParam = "query";

+

+/**

+ * String of key/value pairs to append to requests made to scriptURI. Define

+ * this string when you want to send additional query parameters to your script.

+ * When defined, queries will be sent to

+ * &#60;scriptURI&#62;?&#60;scriptQueryParam&#62;=userinput&#38;&#60;scriptQueryAppend&#62;

+ *

+ * @property scriptQueryAppend

+ * @type String

+ * @default ""

+ */

+YAHOO.widget.DS_XHR.prototype.scriptQueryAppend = "";

+

+/**

+ * XHR response data type. Other types that may be defined are YAHOO.widget.DS_XHR.TYPE_XML

+ * and YAHOO.widget.DS_XHR.TYPE_FLAT.

+ *

+ * @property responseType

+ * @type String

+ * @default YAHOO.widget.DS_XHR.TYPE_JSON

+ */

+YAHOO.widget.DS_XHR.prototype.responseType = YAHOO.widget.DS_XHR.TYPE_JSON;

+

+/**

+ * String after which to strip results. If the results from the XHR are sent

+ * back as HTML, the gzip HTML comment appears at the end of the data and should

+ * be ignored.

+ *

+ * @property responseStripAfter

+ * @type String

+ * @default "\n&#60;!-"

+ */

+YAHOO.widget.DS_XHR.prototype.responseStripAfter = "\n<!-";

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public methods

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Queries the live data source defined by scriptURI for results. Results are

+ * passed back to a callback function.

+ *  

+ * @method doQuery

+ * @param oCallbackFn {HTMLFunction} Callback function defined by oParent object to which to return results.

+ * @param sQuery {String} Query string.

+ * @param oParent {Object} The object instance that has requested data.

+ */

+YAHOO.widget.DS_XHR.prototype.doQuery = function(oCallbackFn, sQuery, oParent) {

+    var isXML = (this.responseType == YAHOO.widget.DS_XHR.TYPE_XML);

+    var sUri = this.scriptURI+"?"+this.scriptQueryParam+"="+sQuery;

+    if(this.scriptQueryAppend.length > 0) {

+        sUri += "&" + this.scriptQueryAppend;

+    }

+    var oResponse = null;

+    

+    var oSelf = this;

+    /*

+     * Sets up ajax request callback

+     *

+     * @param {object} oReq          HTTPXMLRequest object

+     * @private

+     */

+    var responseSuccess = function(oResp) {

+        // Response ID does not match last made request ID.

+        if(!oSelf._oConn || (oResp.tId != oSelf._oConn.tId)) {

+            oSelf.dataErrorEvent.fire(oSelf, oParent, sQuery, YAHOO.widget.DataSource.ERROR_DATANULL);

+            return;

+        }

+//DEBUG

+for(var foo in oResp) {

+}

+        if(!isXML) {

+            oResp = oResp.responseText;

+        }

+        else { 

+            oResp = oResp.responseXML;

+        }

+        if(oResp === null) {

+            oSelf.dataErrorEvent.fire(oSelf, oParent, sQuery, YAHOO.widget.DataSource.ERROR_DATANULL);

+            return;

+        }

+

+        var aResults = oSelf.parseResponse(sQuery, oResp, oParent);

+        var resultObj = {};

+        resultObj.query = decodeURIComponent(sQuery);

+        resultObj.results = aResults;

+        if(aResults === null) {

+            oSelf.dataErrorEvent.fire(oSelf, oParent, sQuery, YAHOO.widget.DataSource.ERROR_DATAPARSE);

+            aResults = [];

+        }

+        else {

+            oSelf.getResultsEvent.fire(oSelf, oParent, sQuery, aResults);

+            oSelf._addCacheElem(resultObj);

+        }

+        oCallbackFn(sQuery, aResults, oParent);

+    };

+

+    var responseFailure = function(oResp) {

+        oSelf.dataErrorEvent.fire(oSelf, oParent, sQuery, YAHOO.widget.DS_XHR.ERROR_DATAXHR);

+        return;

+    };

+    

+    var oCallback = {

+        success:responseSuccess,

+        failure:responseFailure

+    };

+    

+    if(!isNaN(this.connTimeout) && this.connTimeout > 0) {

+        oCallback.timeout = this.connTimeout;

+    }

+    

+    if(this._oConn) {

+        this.connMgr.abort(this._oConn);

+    }

+    

+    oSelf._oConn = this.connMgr.asyncRequest("GET", sUri, oCallback, null);

+};

+

+/**

+ * Parses raw response data into an array of result objects. The result data key

+ * is always stashed in the [0] element of each result object. 

+ *

+ * @method parseResponse

+ * @param sQuery {String} Query string.

+ * @param oResponse {Object} The raw response data to parse.

+ * @param oParent {Object} The object instance that has requested data.

+ * @returns {Object[]} Array of result objects.

+ */

+YAHOO.widget.DS_XHR.prototype.parseResponse = function(sQuery, oResponse, oParent) {

+    var aSchema = this.schema;

+    var aResults = [];

+    var bError = false;

+

+    // Strip out comment at the end of results

+    var nEnd = ((this.responseStripAfter !== "") && (oResponse.indexOf)) ?

+        oResponse.indexOf(this.responseStripAfter) : -1;

+    if(nEnd != -1) {

+        oResponse = oResponse.substring(0,nEnd);

+    }

+

+    switch (this.responseType) {

+        case YAHOO.widget.DS_XHR.TYPE_JSON:

+            var jsonList;

+            // Divert KHTML clients from JSON lib

+            if(window.JSON && (navigator.userAgent.toLowerCase().indexOf('khtml')== -1)) {

+                // Use the JSON utility if available

+                var jsonObjParsed = JSON.parse(oResponse);

+                if(!jsonObjParsed) {

+                    bError = true;

+                    break;

+                }

+                else {

+                    try {

+                        // eval is necessary here since aSchema[0] is of unknown depth

+                        jsonList = eval("jsonObjParsed." + aSchema[0]);

+                    }

+                    catch(e) {

+                        bError = true;

+                        break;

+                   }

+                }

+            }

+            else {

+                // Parse the JSON response as a string

+                try {

+                    // Trim leading spaces

+                    while (oResponse.substring(0,1) == " ") {

+                        oResponse = oResponse.substring(1, oResponse.length);

+                    }

+

+                    // Invalid JSON response

+                    if(oResponse.indexOf("{") < 0) {

+                        bError = true;

+                        break;

+                    }

+

+                    // Empty (but not invalid) JSON response

+                    if(oResponse.indexOf("{}") === 0) {

+                        break;

+                    }

+

+                    // Turn the string into an object literal...

+                    // ...eval is necessary here

+                    var jsonObjRaw = eval("(" + oResponse + ")");

+                    if(!jsonObjRaw) {

+                        bError = true;

+                        break;

+                    }

+

+                    // Grab the object member that contains an array of all reponses...

+                    // ...eval is necessary here since aSchema[0] is of unknown depth

+                    jsonList = eval("(jsonObjRaw." + aSchema[0]+")");

+                }

+                catch(e) {

+                    bError = true;

+                    break;

+               }

+            }

+

+            if(!jsonList) {

+                bError = true;

+                break;

+            }

+

+            if(jsonList.constructor != Array) {

+                jsonList = [jsonList];

+            }

+            

+            // Loop through the array of all responses...

+            for(var i = jsonList.length-1; i >= 0 ; i--) {

+                var aResultItem = [];

+                var jsonResult = jsonList[i];

+                // ...and loop through each data field value of each response

+                for(var j = aSchema.length-1; j >= 1 ; j--) {

+                    // ...and capture data into an array mapped according to the schema...

+                    var dataFieldValue = jsonResult[aSchema[j]];

+                    if(!dataFieldValue) {

+                        dataFieldValue = "";

+                    }

+                    aResultItem.unshift(dataFieldValue);

+                }

+                // If schema isn't well defined, pass along the entire result object

+                if(aResultItem.length == 1) {

+                    aResultItem.push(jsonResult);

+                }

+                // Capture the array of data field values in an array of results

+                aResults.unshift(aResultItem);

+            }

+            break;

+        case YAHOO.widget.DS_XHR.TYPE_XML:

+            // Get the collection of results

+            var xmlList = oResponse.getElementsByTagName(aSchema[0]);

+            if(!xmlList) {

+                bError = true;

+                break;

+            }

+            // Loop through each result

+            for(var k = xmlList.length-1; k >= 0 ; k--) {

+                var result = xmlList.item(k);

+                var aFieldSet = [];

+                // Loop through each data field in each result using the schema

+                for(var m = aSchema.length-1; m >= 1 ; m--) {

+                    var sValue = null;

+                    // Values may be held in an attribute...

+                    var xmlAttr = result.attributes.getNamedItem(aSchema[m]);

+                    if(xmlAttr) {

+                        sValue = xmlAttr.value;

+                    }

+                    // ...or in a node

+                    else{

+                        var xmlNode = result.getElementsByTagName(aSchema[m]);

+                        if(xmlNode && xmlNode.item(0) && xmlNode.item(0).firstChild) {

+                            sValue = xmlNode.item(0).firstChild.nodeValue;

+                        }

+                        else {

+                            sValue = "";

+                        }

+                    }

+                    // Capture the schema-mapped data field values into an array

+                    aFieldSet.unshift(sValue);

+                }

+                // Capture each array of values into an array of results

+                aResults.unshift(aFieldSet);

+            }

+            break;

+        case YAHOO.widget.DS_XHR.TYPE_FLAT:

+            if(oResponse.length > 0) {

+                // Delete the last line delimiter at the end of the data if it exists

+                var newLength = oResponse.length-aSchema[0].length;

+                if(oResponse.substr(newLength) == aSchema[0]) {

+                    oResponse = oResponse.substr(0, newLength);

+                }

+                var aRecords = oResponse.split(aSchema[0]);

+                for(var n = aRecords.length-1; n >= 0; n--) {

+                    aResults[n] = aRecords[n].split(aSchema[1]);

+                }

+            }

+            break;

+        default:

+            break;

+    }

+    sQuery = null;

+    oResponse = null;

+    oParent = null;

+    if(bError) {

+        return null;

+    }

+    else {

+        return aResults;

+    }

+};            

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Private member variables

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * XHR connection object.

+ *

+ * @property _oConn

+ * @type Object

+ * @private

+ */

+YAHOO.widget.DS_XHR.prototype._oConn = null;

+

+

+/****************************************************************************/

+/****************************************************************************/

+/****************************************************************************/

+

+/**

+ * Implementation of YAHOO.widget.DataSource using a native Javascript function as

+ * its live data source.

+ *  

+ * @class DS_JSFunction

+ * @constructor

+ * @extends YAHOO.widget.DataSource

+ * @param oFunction {String} In-memory Javascript function that returns query results as an array of objects.

+ * @param oConfigs {Object} (optional) Object literal of config params.

+ */

+YAHOO.widget.DS_JSFunction = function(oFunction, oConfigs) {

+    // Set any config params passed in to override defaults

+    if(typeof oConfigs == "object") {

+        for(var sConfig in oConfigs) {

+            this[sConfig] = oConfigs[sConfig];

+        }

+    }

+

+    // Initialization sequence

+    if(!oFunction  || (oFunction.constructor != Function)) {

+        return;

+    }

+    else {

+        this.dataFunction = oFunction;

+        this._init();

+    }

+};

+

+YAHOO.widget.DS_JSFunction.prototype = new YAHOO.widget.DataSource();

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public member variables

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * In-memory Javascript function that returns query results.

+ *

+ * @property dataFunction

+ * @type HTMLFunction

+ */

+YAHOO.widget.DS_JSFunction.prototype.dataFunction = null;

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public methods

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Queries the live data source defined by function for results. Results are

+ * passed back to a callback function.

+ *  

+ * @method doQuery

+ * @param oCallbackFn {HTMLFunction} Callback function defined by oParent object to which to return results.

+ * @param sQuery {String} Query string.

+ * @param oParent {Object} The object instance that has requested data.

+ */

+YAHOO.widget.DS_JSFunction.prototype.doQuery = function(oCallbackFn, sQuery, oParent) {

+    var oFunction = this.dataFunction;

+    var aResults = [];

+    

+    aResults = oFunction(sQuery);

+    if(aResults === null) {

+        this.dataErrorEvent.fire(this, oParent, sQuery, YAHOO.widget.DataSource.ERROR_DATANULL);

+        return;

+    }

+    

+    var resultObj = {};

+    resultObj.query = decodeURIComponent(sQuery);

+    resultObj.results = aResults;

+    this._addCacheElem(resultObj);

+    

+    this.getResultsEvent.fire(this, oParent, sQuery, aResults);

+    oCallbackFn(sQuery, aResults, oParent);

+    return;

+};

+

+/****************************************************************************/

+/****************************************************************************/

+/****************************************************************************/

+

+/**

+ * Implementation of YAHOO.widget.DataSource using a native Javascript array as

+ * its live data source.

+ *

+ * @class DS_JSArray

+ * @constructor

+ * @extends YAHOO.widget.DataSource

+ * @param aData {String[]} In-memory Javascript array of simple string data.

+ * @param oConfigs {Object} (optional) Object literal of config params.

+ */

+YAHOO.widget.DS_JSArray = function(aData, oConfigs) {

+    // Set any config params passed in to override defaults

+    if(typeof oConfigs == "object") {

+        for(var sConfig in oConfigs) {

+            this[sConfig] = oConfigs[sConfig];

+        }

+    }

+

+    // Initialization sequence

+    if(!aData || (aData.constructor != Array)) {

+        return;

+    }

+    else {

+        this.data = aData;

+        this._init();

+    }

+};

+

+YAHOO.widget.DS_JSArray.prototype = new YAHOO.widget.DataSource();

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public member variables

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * In-memory Javascript array of strings.

+ *

+ * @property data

+ * @type Array

+ */

+YAHOO.widget.DS_JSArray.prototype.data = null;

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public methods

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Queries the live data source defined by data for results. Results are passed

+ * back to a callback function.

+ *

+ * @method doQuery

+ * @param oCallbackFn {HTMLFunction} Callback function defined by oParent object to which to return results.

+ * @param sQuery {String} Query string.

+ * @param oParent {Object} The object instance that has requested data.

+ */

+YAHOO.widget.DS_JSArray.prototype.doQuery = function(oCallbackFn, sQuery, oParent) {

+    var aData = this.data; // the array

+    var aResults = []; // container for results

+    var bMatchFound = false;

+    var bMatchContains = this.queryMatchContains;

+    if(sQuery) {

+        if(!this.queryMatchCase) {

+            sQuery = sQuery.toLowerCase();

+        }

+

+        // Loop through each element of the array...

+        // which can be a string or an array of strings

+        for(var i = aData.length-1; i >= 0; i--) {

+            var aDataset = [];

+

+            if(aData[i]) {

+                if(aData[i].constructor == String) {

+                    aDataset[0] = aData[i];

+                }

+                else if(aData[i].constructor == Array) {

+                    aDataset = aData[i];

+                }

+            }

+

+            if(aDataset[0] && (aDataset[0].constructor == String)) {

+                var sKeyIndex = (this.queryMatchCase) ?

+                encodeURIComponent(aDataset[0]).indexOf(sQuery):

+                encodeURIComponent(aDataset[0]).toLowerCase().indexOf(sQuery);

+

+                // A STARTSWITH match is when the query is found at the beginning of the key string...

+                if((!bMatchContains && (sKeyIndex === 0)) ||

+                // A CONTAINS match is when the query is found anywhere within the key string...

+                (bMatchContains && (sKeyIndex > -1))) {

+                    // Stash a match into aResults[].

+                    aResults.unshift(aDataset);

+                }

+            }

+        }

+    }

+

+    this.getResultsEvent.fire(this, oParent, sQuery, aResults);

+    oCallbackFn(sQuery, aResults, oParent);

+};

diff --git a/frontend/beta/js/YUI/calendar.js b/frontend/beta/js/YUI/calendar.js
new file mode 100644
index 0000000..3593551
--- a/dev/null
+++ b/frontend/beta/js/YUI/calendar.js
@@ -0,0 +1,4239 @@
+/*
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version 0.12.0
+*/
+
+/**
+* Config is a utility used within an Object to allow the implementer to maintain a list of local configuration properties and listen for changes to those properties dynamically using CustomEvent. The initial values are also maintained so that the configuration can be reset at any given point to its initial state.
+* @class YAHOO.util.Config
+* @constructor
+* @param {Object}	owner	The owner Object to which this Config Object belongs
+*/
+YAHOO.util.Config = function(owner) {
+	if (owner) {
+		this.init(owner);
+	}
+};
+
+YAHOO.util.Config.prototype = {
+
+	/**
+	* Object reference to the owner of this Config Object
+	* @property owner
+	* @type Object
+	*/
+	owner : null,
+
+	/**
+	* Boolean flag that specifies whether a queue is currently being executed
+	* @property queueInProgress
+	* @type Boolean
+	*/
+	queueInProgress : false,
+
+
+	/**
+	* Validates that the value passed in is a Boolean.
+	* @method checkBoolean
+	* @param	{Object}	val	The value to validate
+	* @return	{Boolean}	true, if the value is valid
+	*/
+	checkBoolean: function(val) {
+		if (typeof val == 'boolean') {
+			return true;
+		} else {
+			return false;
+		}
+	},
+
+	/**
+	* Validates that the value passed in is a number.
+	* @method checkNumber
+	* @param	{Object}	val	The value to validate
+	* @return	{Boolean}	true, if the value is valid
+	*/
+	checkNumber: function(val) {
+		if (isNaN(val)) {
+			return false;
+		} else {
+			return true;
+		}
+	}
+};
+
+
+/**
+* Initializes the configuration Object and all of its local members.
+* @method init
+* @param {Object}	owner	The owner Object to which this Config Object belongs
+*/
+YAHOO.util.Config.prototype.init = function(owner) {
+
+	this.owner = owner;
+
+	/**
+	* Object reference to the owner of this Config Object
+	* @event configChangedEvent
+	*/
+	this.configChangedEvent = new YAHOO.util.CustomEvent("configChanged");
+
+	this.queueInProgress = false;
+
+	/* Private Members */
+
+	/**
+	* Maintains the local collection of configuration property objects and their specified values
+	* @property config
+	* @private
+	* @type Object
+	*/
+	var config = {};
+
+	/**
+	* Maintains the local collection of configuration property objects as they were initially applied.
+	* This object is used when resetting a property.
+	* @property initialConfig
+	* @private
+	* @type Object
+	*/
+	var initialConfig = {};
+
+	/**
+	* Maintains the local, normalized CustomEvent queue
+	* @property eventQueue
+	* @private
+	* @type Object
+	*/
+	var eventQueue = [];
+
+	/**
+	* Fires a configuration property event using the specified value.
+	* @method fireEvent
+	* @private
+	* @param {String}	key			The configuration property's name
+	* @param {value}	Object		The value of the correct type for the property
+	*/
+	var fireEvent = function( key, value ) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+
+		if (typeof property != 'undefined' && property.event) {
+			property.event.fire(value);
+		}
+	};
+	/* End Private Members */
+
+	/**
+	* Adds a property to the Config Object's private config hash.
+	* @method addProperty
+	* @param {String}	key	The configuration property's name
+	* @param {Object}	propertyObject	The Object containing all of this property's arguments
+	*/
+	this.addProperty = function( key, propertyObject ) {
+		key = key.toLowerCase();
+
+		config[key] = propertyObject;
+
+		propertyObject.event = new YAHOO.util.CustomEvent(key);
+		propertyObject.key = key;
+
+		if (propertyObject.handler) {
+			propertyObject.event.subscribe(propertyObject.handler, this.owner, true);
+		}
+
+		this.setProperty(key, propertyObject.value, true);
+
+		if (! propertyObject.suppressEvent) {
+			this.queueProperty(key, propertyObject.value);
+		}
+	};
+
+	/**
+	* Returns a key-value configuration map of the values currently set in the Config Object.
+	* @method getConfig
+	* @return {Object} The current config, represented in a key-value map
+	*/
+	this.getConfig = function() {
+		var cfg = {};
+
+		for (var prop in config) {
+			var property = config[prop];
+			if (typeof property != 'undefined' && property.event) {
+				cfg[prop] = property.value;
+			}
+		}
+
+		return cfg;
+	};
+
+	/**
+	* Returns the value of specified property.
+	* @method getProperty
+	* @param {String} key	The name of the property
+	* @return {Object}		The value of the specified property
+	*/
+	this.getProperty = function(key) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+		if (typeof property != 'undefined' && property.event) {
+			return property.value;
+		} else {
+			return undefined;
+		}
+	};
+
+	/**
+	* Resets the specified property's value to its initial value.
+	* @method resetProperty
+	* @param {String} key	The name of the property
+	* @return {Boolean} True is the property was reset, false if not
+	*/
+	this.resetProperty = function(key) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+		if (typeof property != 'undefined' && property.event) {
+			if (initialConfig[key] && initialConfig[key] != 'undefined')	{
+				this.setProperty(key, initialConfig[key]);
+			}
+			return true;
+		} else {
+			return false;
+		}
+	};
+
+	/**
+	* Sets the value of a property. If the silent property is passed as true, the property's event will not be fired.
+	* @method setProperty
+	* @param {String} key		The name of the property
+	* @param {String} value		The value to set the property to
+	* @param {Boolean} silent	Whether the value should be set silently, without firing the property event.
+	* @return {Boolean}			True, if the set was successful, false if it failed.
+	*/
+	this.setProperty = function(key, value, silent) {
+		key = key.toLowerCase();
+
+		if (this.queueInProgress && ! silent) {
+			this.queueProperty(key,value); // Currently running through a queue...
+			return true;
+		} else {
+			var property = config[key];
+			if (typeof property != 'undefined' && property.event) {
+				if (property.validator && ! property.validator(value)) { // validator
+					return false;
+				} else {
+					property.value = value;
+					if (! silent) {
+						fireEvent(key, value);
+						this.configChangedEvent.fire([key, value]);
+					}
+					return true;
+				}
+			} else {
+				return false;
+			}
+		}
+	};
+
+	/**
+	* Sets the value of a property and queues its event to execute. If the event is already scheduled to execute, it is
+	* moved from its current position to the end of the queue.
+	* @method queueProperty
+	* @param {String} key	The name of the property
+	* @param {String} value	The value to set the property to
+	* @return {Boolean}		true, if the set was successful, false if it failed.
+	*/
+	this.queueProperty = function(key, value) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+
+		if (typeof property != 'undefined' && property.event) {
+			if (typeof value != 'undefined' && property.validator && ! property.validator(value)) { // validator
+				return false;
+			} else {
+
+				if (typeof value != 'undefined') {
+					property.value = value;
+				} else {
+					value = property.value;
+				}
+
+				var foundDuplicate = false;
+
+				for (var i=0;i<eventQueue.length;i++) {
+					var queueItem = eventQueue[i];
+
+					if (queueItem) {
+						var queueItemKey = queueItem[0];
+						var queueItemValue = queueItem[1];
+
+						if (queueItemKey.toLowerCase() == key) {
+							// found a dupe... push to end of queue, null current item, and break
+							eventQueue[i] = null;
+							eventQueue.push([key, (typeof value != 'undefined' ? value : queueItemValue)]);
+							foundDuplicate = true;
+							break;
+						}
+					}
+				}
+
+				if (! foundDuplicate && typeof value != 'undefined') { // this is a refire, or a new property in the queue
+					eventQueue.push([key, value]);
+				}
+			}
+
+			if (property.supercedes) {
+				for (var s=0;s<property.supercedes.length;s++) {
+					var supercedesCheck = property.supercedes[s];
+
+					for (var q=0;q<eventQueue.length;q++) {
+						var queueItemCheck = eventQueue[q];
+
+						if (queueItemCheck) {
+							var queueItemCheckKey = queueItemCheck[0];
+							var queueItemCheckValue = queueItemCheck[1];
+
+							if ( queueItemCheckKey.toLowerCase() == supercedesCheck.toLowerCase() ) {
+								eventQueue.push([queueItemCheckKey, queueItemCheckValue]);
+								eventQueue[q] = null;
+								break;
+							}
+						}
+					}
+				}
+			}
+
+			return true;
+		} else {
+			return false;
+		}
+	};
+
+	/**
+	* Fires the event for a property using the property's current value.
+	* @method refireEvent
+	* @param {String} key	The name of the property
+	*/
+	this.refireEvent = function(key) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+		if (typeof property != 'undefined' && property.event && typeof property.value != 'undefined') {
+			if (this.queueInProgress) {
+				this.queueProperty(key);
+			} else {
+				fireEvent(key, property.value);
+			}
+		}
+	};
+
+	/**
+	* Applies a key-value Object literal to the configuration, replacing any existing values, and queueing the property events.
+	* Although the values will be set, fireQueue() must be called for their associated events to execute.
+	* @method applyConfig
+	* @param {Object}	userConfig	The configuration Object literal
+	* @param {Boolean}	init		When set to true, the initialConfig will be set to the userConfig passed in, so that calling a reset will reset the properties to the passed values.
+	*/
+	this.applyConfig = function(userConfig, init) {
+		if (init) {
+			initialConfig = userConfig;
+		}
+		for (var prop in userConfig) {
+			this.queueProperty(prop, userConfig[prop]);
+		}
+	};
+
+	/**
+	* Refires the events for all configuration properties using their current values.
+	* @method refresh
+	*/
+	this.refresh = function() {
+		for (var prop in config) {
+			this.refireEvent(prop);
+		}
+	};
+
+	/**
+	* Fires the normalized list of queued property change events
+	* @method fireQueue
+	*/
+	this.fireQueue = function() {
+		this.queueInProgress = true;
+		for (var i=0;i<eventQueue.length;i++) {
+			var queueItem = eventQueue[i];
+			if (queueItem) {
+				var key = queueItem[0];
+				var value = queueItem[1];
+
+				var property = config[key];
+				property.value = value;
+
+				fireEvent(key,value);
+			}
+		}
+
+		this.queueInProgress = false;
+		eventQueue = [];
+	};
+
+	/**
+	* Subscribes an external handler to the change event for any given property.
+	* @method subscribeToConfigEvent
+	* @param {String}	key			The property name
+	* @param {Function}	handler		The handler function to use subscribe to the property's event
+	* @param {Object}	obj			The Object to use for scoping the event handler (see CustomEvent documentation)
+	* @param {Boolean}	override	Optional. If true, will override "this" within the handler to map to the scope Object passed into the method.
+	* @return {Boolean}				True, if the subscription was successful, otherwise false.
+	*/
+	this.subscribeToConfigEvent = function(key, handler, obj, override) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+		if (typeof property != 'undefined' && property.event) {
+			if (! YAHOO.util.Config.alreadySubscribed(property.event, handler, obj)) {
+				property.event.subscribe(handler, obj, override);
+			}
+			return true;
+		} else {
+			return false;
+		}
+	};
+
+	/**
+	* Unsubscribes an external handler from the change event for any given property.
+	* @method unsubscribeFromConfigEvent
+	* @param {String}	key			The property name
+	* @param {Function}	handler		The handler function to use subscribe to the property's event
+	* @param {Object}	obj			The Object to use for scoping the event handler (see CustomEvent documentation)
+	* @return {Boolean}				True, if the unsubscription was successful, otherwise false.
+	*/
+	this.unsubscribeFromConfigEvent = function(key, handler, obj) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+		if (typeof property != 'undefined' && property.event) {
+			return property.event.unsubscribe(handler, obj);
+		} else {
+			return false;
+		}
+	};
+
+	/**
+	* Returns a string representation of the Config object
+	* @method toString
+	* @return {String}	The Config object in string format.
+	*/
+	this.toString = function() {
+		var output = "Config";
+		if (this.owner) {
+			output += " [" + this.owner.toString() + "]";
+		}
+		return output;
+	};
+
+	/**
+	* Returns a string representation of the Config object's current CustomEvent queue
+	* @method outputEventQueue
+	* @return {String}	The string list of CustomEvents currently queued for execution
+	*/
+	this.outputEventQueue = function() {
+		var output = "";
+		for (var q=0;q<eventQueue.length;q++) {
+			var queueItem = eventQueue[q];
+			if (queueItem) {
+				output += queueItem[0] + "=" + queueItem[1] + ", ";
+			}
+		}
+		return output;
+	};
+};
+
+/**
+* Checks to determine if a particular function/Object pair are already subscribed to the specified CustomEvent
+* @method YAHOO.util.Config.alreadySubscribed
+* @static
+* @param {YAHOO.util.CustomEvent} evt	The CustomEvent for which to check the subscriptions
+* @param {Function}	fn	The function to look for in the subscribers list
+* @param {Object}	obj	The execution scope Object for the subscription
+* @return {Boolean}	true, if the function/Object pair is already subscribed to the CustomEvent passed in
+*/
+YAHOO.util.Config.alreadySubscribed = function(evt, fn, obj) {
+	for (var e=0;e<evt.subscribers.length;e++) {
+		var subsc = evt.subscribers[e];
+		if (subsc && subsc.obj == obj && subsc.fn == fn) {
+			return true;
+		}
+	}
+	return false;
+};
+
+/**
+* YAHOO.widget.DateMath is used for simple date manipulation. The class is a static utility
+* used for adding, subtracting, and comparing dates.
+* @class YAHOO.widget.DateMath
+*/
+YAHOO.widget.DateMath = {
+	/**
+	* Constant field representing Day
+	* @property DAY
+	* @static
+	* @final
+	* @type String
+	*/
+	DAY : "D",
+
+	/**
+	* Constant field representing Week
+	* @property WEEK
+	* @static
+	* @final
+	* @type String
+	*/
+	WEEK : "W",
+
+	/**
+	* Constant field representing Year
+	* @property YEAR
+	* @static
+	* @final
+	* @type String
+	*/
+	YEAR : "Y",
+
+	/**
+	* Constant field representing Month
+	* @property MONTH
+	* @static
+	* @final
+	* @type String
+	*/
+	MONTH : "M",
+
+	/**
+	* Constant field representing one day, in milliseconds
+	* @property ONE_DAY_MS
+	* @static
+	* @final
+	* @type Number
+	*/
+	ONE_DAY_MS : 1000*60*60*24,
+
+	/**
+	* Adds the specified amount of time to the this instance.
+	* @method add
+	* @param {Date} date	The JavaScript Date object to perform addition on
+	* @param {String} field	The field constant to be used for performing addition.
+	* @param {Number} amount	The number of units (measured in the field constant) to add to the date.
+	* @return {Date} The resulting Date object
+	*/
+	add : function(date, field, amount) {
+		var d = new Date(date.getTime());
+		switch (field) {
+			case this.MONTH:
+				var newMonth = date.getMonth() + amount;
+				var years = 0;
+
+
+				if (newMonth < 0) {
+					while (newMonth < 0) {
+						newMonth += 12;
+						years -= 1;
+					}
+				} else if (newMonth > 11) {
+					while (newMonth > 11) {
+						newMonth -= 12;
+						years += 1;
+					}
+				}
+
+				d.setMonth(newMonth);
+				d.setFullYear(date.getFullYear() + years);
+				break;
+			case this.DAY:
+				d.setDate(date.getDate() + amount);
+				break;
+			case this.YEAR:
+				d.setFullYear(date.getFullYear() + amount);
+				break;
+			case this.WEEK:
+				d.setDate(date.getDate() + (amount * 7));
+				break;
+		}
+		return d;
+	},
+
+	/**
+	* Subtracts the specified amount of time from the this instance.
+	* @method subtract
+	* @param {Date} date	The JavaScript Date object to perform subtraction on
+	* @param {Number} field	The this field constant to be used for performing subtraction.
+	* @param {Number} amount	The number of units (measured in the field constant) to subtract from the date.
+	* @return {Date} The resulting Date object
+	*/
+	subtract : function(date, field, amount) {
+		return this.add(date, field, (amount*-1));
+	},
+
+	/**
+	* Determines whether a given date is before another date on the calendar.
+	* @method before
+	* @param {Date} date		The Date object to compare with the compare argument
+	* @param {Date} compareTo	The Date object to use for the comparison
+	* @return {Boolean} true if the date occurs before the compared date; false if not.
+	*/
+	before : function(date, compareTo) {
+		var ms = compareTo.getTime();
+		if (date.getTime() < ms) {
+			return true;
+		} else {
+			return false;
+		}
+	},
+
+	/**
+	* Determines whether a given date is after another date on the calendar.
+	* @method after
+	* @param {Date} date		The Date object to compare with the compare argument
+	* @param {Date} compareTo	The Date object to use for the comparison
+	* @return {Boolean} true if the date occurs after the compared date; false if not.
+	*/
+	after : function(date, compareTo) {
+		var ms = compareTo.getTime();
+		if (date.getTime() > ms) {
+			return true;
+		} else {
+			return false;
+		}
+	},
+
+	/**
+	* Determines whether a given date is between two other dates on the calendar.
+	* @method between
+	* @param {Date} date		The date to check for
+	* @param {Date} dateBegin	The start of the range
+	* @param {Date} dateEnd		The end of the range
+	* @return {Boolean} true if the date occurs between the compared dates; false if not.
+	*/
+	between : function(date, dateBegin, dateEnd) {
+		if (this.after(date, dateBegin) && this.before(date, dateEnd)) {
+			return true;
+		} else {
+			return false;
+		}
+	},
+
+	/**
+	* Retrieves a JavaScript Date object representing January 1 of any given year.
+	* @method getJan1
+	* @param {Number} calendarYear		The calendar year for which to retrieve January 1
+	* @return {Date}	January 1 of the calendar year specified.
+	*/
+	getJan1 : function(calendarYear) {
+		return new Date(calendarYear,0,1);
+	},
+
+	/**
+	* Calculates the number of days the specified date is from January 1 of the specified calendar year.
+	* Passing January 1 to this function would return an offset value of zero.
+	* @method getDayOffset
+	* @param {Date}	date	The JavaScript date for which to find the offset
+	* @param {Number} calendarYear	The calendar year to use for determining the offset
+	* @return {Number}	The number of days since January 1 of the given year
+	*/
+	getDayOffset : function(date, calendarYear) {
+		var beginYear = this.getJan1(calendarYear); // Find the start of the year. This will be in week 1.
+
+		// Find the number of days the passed in date is away from the calendar year start
+		var dayOffset = Math.ceil((date.getTime()-beginYear.getTime()) / this.ONE_DAY_MS);
+		return dayOffset;
+	},
+
+	/**
+	* Calculates the week number for the given date. This function assumes that week 1 is the
+	* week in which January 1 appears, regardless of whether the week consists of a full 7 days.
+	* The calendar year can be specified to help find what a the week number would be for a given
+	* date if the date overlaps years. For instance, a week may be considered week 1 of 2005, or
+	* week 53 of 2004. Specifying the optional calendarYear allows one to make this distinction
+	* easily.
+	* @method getWeekNumber
+	* @param {Date}	date	The JavaScript date for which to find the week number
+	* @param {Number} calendarYear	OPTIONAL - The calendar year to use for determining the week number. Default is
+	*											the calendar year of parameter "date".
+	* @param {Number} weekStartsOn	OPTIONAL - The integer (0-6) representing which day a week begins on. Default is 0 (for Sunday).
+	* @return {Number}	The week number of the given date.
+	*/
+	getWeekNumber : function(date, calendarYear) {
+		date = this.clearTime(date);
+		var nearestThurs = new Date(date.getTime() + (4 * this.ONE_DAY_MS) - ((date.getDay()) * this.ONE_DAY_MS));
+
+		var jan1 = new Date(nearestThurs.getFullYear(),0,1);
+		var dayOfYear = ((nearestThurs.getTime() - jan1.getTime()) / this.ONE_DAY_MS) - 1;
+
+		var weekNum = Math.ceil((dayOfYear)/ 7);
+		return weekNum;
+	},
+
+	/**
+	* Determines if a given week overlaps two different years.
+	* @method isYearOverlapWeek
+	* @param {Date}	weekBeginDate	The JavaScript Date representing the first day of the week.
+	* @return {Boolean}	true if the date overlaps two different years.
+	*/
+	isYearOverlapWeek : function(weekBeginDate) {
+		var overlaps = false;
+		var nextWeek = this.add(weekBeginDate, this.DAY, 6);
+		if (nextWeek.getFullYear() != weekBeginDate.getFullYear()) {
+			overlaps = true;
+		}
+		return overlaps;
+	},
+
+	/**
+	* Determines if a given week overlaps two different months.
+	* @method isMonthOverlapWeek
+	* @param {Date}	weekBeginDate	The JavaScript Date representing the first day of the week.
+	* @return {Boolean}	true if the date overlaps two different months.
+	*/
+	isMonthOverlapWeek : function(weekBeginDate) {
+		var overlaps = false;
+		var nextWeek = this.add(weekBeginDate, this.DAY, 6);
+		if (nextWeek.getMonth() != weekBeginDate.getMonth()) {
+			overlaps = true;
+		}
+		return overlaps;
+	},
+
+	/**
+	* Gets the first day of a month containing a given date.
+	* @method findMonthStart
+	* @param {Date}	date	The JavaScript Date used to calculate the month start
+	* @return {Date}		The JavaScript Date representing the first day of the month
+	*/
+	findMonthStart : function(date) {
+		var start = new Date(date.getFullYear(), date.getMonth(), 1);
+		return start;
+	},
+
+	/**
+	* Gets the last day of a month containing a given date.
+	* @method findMonthEnd
+	* @param {Date}	date	The JavaScript Date used to calculate the month end
+	* @return {Date}		The JavaScript Date representing the last day of the month
+	*/
+	findMonthEnd : function(date) {
+		var start = this.findMonthStart(date);
+		var nextMonth = this.add(start, this.MONTH, 1);
+		var end = this.subtract(nextMonth, this.DAY, 1);
+		return end;
+	},
+
+	/**
+	* Clears the time fields from a given date, effectively setting the time to midnight.
+	* @method clearTime
+	* @param {Date}	date	The JavaScript Date for which the time fields will be cleared
+	* @return {Date}		The JavaScript Date cleared of all time fields
+	*/
+	clearTime : function(date) {
+		date.setHours(12,0,0,0);
+		return date;
+	}
+};
+
+/**
+* The Calendar component is a UI control that enables users to choose one or more dates from a graphical calendar presented in a one-month ("one-up") or two-month ("two-up") interface. Calendars are generated entirely via script and can be navigated without any page refreshes.
+* @module    Calendar
+* @title     Calendar Widget
+* @namespace YAHOO.widget
+* @requires  yahoo,dom,event
+*/
+
+/**
+* Calendar is the base class for the Calendar widget. In its most basic
+* implementation, it has the ability to render a calendar widget on the page
+* that can be manipulated to select a single date, move back and forth between
+* months and years.
+* <p>To construct the placeholder for the calendar widget, the code is as
+* follows:
+*	<xmp>
+*		<div id="cal1Container"></div>
+*	</xmp>
+* Note that the table can be replaced with any kind of element.
+* </p>
+* @namespace YAHOO.widget
+* @class Calendar
+* @constructor
+* @param {String}	id			The id of the table element that will represent the calendar widget
+* @param {String}	containerId	The id of the container div element that will wrap the calendar table
+* @param {Object}	config		The configuration object containing the Calendar's arguments
+*/
+YAHOO.widget.Calendar = function(id, containerId, config) {
+	this.init(id, containerId, config);
+};
+
+/**
+* The path to be used for images loaded for the Calendar
+* @property YAHOO.widget.Calendar.IMG_ROOT
+* @static
+* @type String
+*/
+YAHOO.widget.Calendar.IMG_ROOT = (window.location.href.toLowerCase().indexOf("https") === 0 ? "https://a248.e.akamai.net/sec.yimg.com/i/" : "http://us.i1.yimg.com/us.yimg.com/i/");
+
+/**
+* Type constant used for renderers to represent an individual date (M/D/Y)
+* @property YAHOO.widget.Calendar.DATE
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Calendar.DATE = "D";
+
+/**
+* Type constant used for renderers to represent an individual date across any year (M/D)
+* @property YAHOO.widget.Calendar.MONTH_DAY
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Calendar.MONTH_DAY = "MD";
+
+/**
+* Type constant used for renderers to represent a weekday
+* @property YAHOO.widget.Calendar.WEEKDAY
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Calendar.WEEKDAY = "WD";
+
+/**
+* Type constant used for renderers to represent a range of individual dates (M/D/Y-M/D/Y)
+* @property YAHOO.widget.Calendar.RANGE
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Calendar.RANGE = "R";
+
+/**
+* Type constant used for renderers to represent a month across any year
+* @property YAHOO.widget.Calendar.MONTH
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Calendar.MONTH = "M";
+
+/**
+* Constant that represents the total number of date cells that are displayed in a given month
+* @property YAHOO.widget.Calendar.DISPLAY_DAYS
+* @static
+* @final
+* @type Number
+*/
+YAHOO.widget.Calendar.DISPLAY_DAYS = 42;
+
+/**
+* Constant used for halting the execution of the remainder of the render stack
+* @property YAHOO.widget.Calendar.STOP_RENDER
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Calendar.STOP_RENDER = "S";
+
+YAHOO.widget.Calendar.prototype = {
+
+	/**
+	* The configuration object used to set up the calendars various locale and style options.
+	* @property Config
+	* @private
+	* @deprecated Configuration properties should be set by calling Calendar.cfg.setProperty.
+	* @type Object
+	*/
+	Config : null,
+
+	/**
+	* The parent CalendarGroup, only to be set explicitly by the parent group
+	* @property parent
+	* @type CalendarGroup
+	*/
+	parent : null,
+
+	/**
+	* The index of this item in the parent group
+	* @property index
+	* @type Number
+	*/
+	index : -1,
+
+	/**
+	* The collection of calendar table cells
+	* @property cells
+	* @type HTMLTableCellElement[]
+	*/
+	cells : null,
+
+	/**
+	* The collection of calendar cell dates that is parallel to the cells collection. The array contains dates field arrays in the format of [YYYY, M, D].
+	* @property cellDates
+	* @type Array[](Number[])
+	*/
+	cellDates : null,
+
+	/**
+	* The id that uniquely identifies this calendar. This id should match the id of the placeholder element on the page.
+	* @property id
+	* @type String
+	*/
+	id : null,
+
+	/**
+	* The DOM element reference that points to this calendar's container element. The calendar will be inserted into this element when the shell is rendered.
+	* @property oDomContainer
+	* @type HTMLElement
+	*/
+	oDomContainer : null,
+
+	/**
+	* A Date object representing today's date.
+	* @property today
+	* @type Date
+	*/
+	today : null,
+
+	/**
+	* The list of render functions, along with required parameters, used to render cells.
+	* @property renderStack
+	* @type Array[]
+	*/
+	renderStack : null,
+
+	/**
+	* A copy of the initial render functions created before rendering.
+	* @property _renderStack
+	* @private
+	* @type Array
+	*/
+	_renderStack : null,
+
+	/**
+	* A Date object representing the month/year that the calendar is initially set to
+	* @property _pageDate
+	* @private
+	* @type Date
+	*/
+	_pageDate : null,
+
+	/**
+	* The private list of initially selected dates.
+	* @property _selectedDates
+	* @private
+	* @type Array
+	*/
+	_selectedDates : null,
+
+	/**
+	* A map of DOM event handlers to attach to cells associated with specific CSS class names
+	* @property domEventMap
+	* @type Object
+	*/
+	domEventMap : null
+};
+
+
+
+/**
+* Initializes the Calendar widget.
+* @method init
+* @param {String}	id			The id of the table element that will represent the calendar widget
+* @param {String}	containerId	The id of the container div element that will wrap the calendar table
+* @param {Object}	config		The configuration object containing the Calendar's arguments
+*/
+YAHOO.widget.Calendar.prototype.init = function(id, containerId, config) {
+	this.initEvents();
+	this.today = new Date();
+	YAHOO.widget.DateMath.clearTime(this.today);
+
+	this.id = id;
+	this.oDomContainer = document.getElementById(containerId);
+
+	/**
+	* The Config object used to hold the configuration variables for the Calendar
+	* @property cfg
+	* @type YAHOO.util.Config
+	*/
+	this.cfg = new YAHOO.util.Config(this);
+
+	/**
+	* The local object which contains the Calendar's options
+	* @property Options
+	* @type Object
+	*/
+	this.Options = {};
+
+	/**
+	* The local object which contains the Calendar's locale settings
+	* @property Locale
+	* @type Object
+	*/
+	this.Locale = {};
+
+	this.initStyles();
+
+	YAHOO.util.Dom.addClass(this.oDomContainer, this.Style.CSS_CONTAINER);
+	YAHOO.util.Dom.addClass(this.oDomContainer, this.Style.CSS_SINGLE);
+
+	this.cellDates = [];
+	this.cells = [];
+	this.renderStack = [];
+	this._renderStack = [];
+
+	this.setupConfig();
+
+	if (config) {
+		this.cfg.applyConfig(config, true);
+	}
+
+	this.cfg.fireQueue();
+};
+
+/**
+* Renders the built-in IFRAME shim for the IE6 and below
+* @method configIframe
+*/
+YAHOO.widget.Calendar.prototype.configIframe = function(type, args, obj) {
+	var useIframe = args[0];
+
+	if (YAHOO.util.Dom.inDocument(this.oDomContainer)) {
+		if (useIframe) {
+			var pos = YAHOO.util.Dom.getStyle(this.oDomContainer, "position");
+
+			if (this.browser == "ie" && (pos == "absolute" || pos == "relative")) {
+				if (! YAHOO.util.Dom.inDocument(this.iframe)) {
+					this.iframe = document.createElement("iframe");
+					this.iframe.src = "javascript:false;";
+					YAHOO.util.Dom.setStyle(this.iframe, "opacity", "0");
+					this.oDomContainer.insertBefore(this.iframe, this.oDomContainer.firstChild);
+				}
+			}
+		} else {
+			if (this.iframe) {
+				if (this.iframe.parentNode) {
+					this.iframe.parentNode.removeChild(this.iframe);
+				}
+				this.iframe = null;
+			}
+		}
+	}
+};
+
+/**
+* Default handler for the "title" property
+* @method configTitle
+*/
+YAHOO.widget.Calendar.prototype.configTitle = function(type, args, obj) {
+	var title = args[0];
+	var close = this.cfg.getProperty("close");
+
+	var titleDiv;
+
+	if (title && title !== "") {
+		titleDiv = YAHOO.util.Dom.getElementsByClassName(YAHOO.widget.CalendarGroup.CSS_2UPTITLE, "div", this.oDomContainer)[0] || document.createElement("div");
+		titleDiv.className = YAHOO.widget.CalendarGroup.CSS_2UPTITLE;
+		titleDiv.innerHTML = title;
+		this.oDomContainer.insertBefore(titleDiv, this.oDomContainer.firstChild);
+		YAHOO.util.Dom.addClass(this.oDomContainer, "withtitle");
+	} else {
+		titleDiv = YAHOO.util.Dom.getElementsByClassName(YAHOO.widget.CalendarGroup.CSS_2UPTITLE, "div", this.oDomContainer)[0] || null;
+
+		if (titleDiv) {
+			YAHOO.util.Event.purgeElement(titleDiv);
+			this.oDomContainer.removeChild(titleDiv);
+		}
+		if (! close) {
+			YAHOO.util.Dom.removeClass(this.oDomContainer, "withtitle");
+		}
+	}
+};
+
+/**
+* Default handler for the "close" property
+* @method configClose
+*/
+YAHOO.widget.Calendar.prototype.configClose = function(type, args, obj) {
+	var close = args[0];
+	var title = this.cfg.getProperty("title");
+
+	var linkClose;
+
+	if (close === true) {
+		linkClose = YAHOO.util.Dom.getElementsByClassName("link-close", "a", this.oDomContainer)[0] || document.createElement("a");
+		linkClose.href = "javascript:void(null);";
+		linkClose.className = "link-close";
+		YAHOO.util.Event.addListener(linkClose, "click", this.hide, this, true);
+		var imgClose = document.createElement("img");
+		imgClose.src = YAHOO.widget.Calendar.IMG_ROOT + "us/my/bn/x_d.gif";
+		imgClose.className = YAHOO.widget.CalendarGroup.CSS_2UPCLOSE;
+		linkClose.appendChild(imgClose);
+		this.oDomContainer.appendChild(linkClose);
+		YAHOO.util.Dom.addClass(this.oDomContainer, "withtitle");
+	} else {
+		linkClose = YAHOO.util.Dom.getElementsByClassName("link-close", "a", this.oDomContainer)[0] || null;
+
+		if (linkClose) {
+			YAHOO.util.Event.purgeElement(linkClose);
+			this.oDomContainer.removeChild(linkClose);
+		}
+		if (! title || title === "") {
+			YAHOO.util.Dom.removeClass(this.oDomContainer, "withtitle");
+		}
+	}
+};
+
+/**
+* Initializes Calendar's built-in CustomEvents
+* @method initEvents
+*/
+YAHOO.widget.Calendar.prototype.initEvents = function() {
+
+	/**
+	* Fired before a selection is made
+	* @event beforeSelectEvent
+	*/
+	this.beforeSelectEvent = new YAHOO.util.CustomEvent("beforeSelect");
+
+	/**
+	* Fired when a selection is made
+	* @event selectEvent
+	* @param {Array}	Array of Date field arrays in the format [YYYY, MM, DD].
+	*/
+	this.selectEvent = new YAHOO.util.CustomEvent("select");
+
+	/**
+	* Fired before a selection is made
+	* @event beforeDeselectEvent
+	*/
+	this.beforeDeselectEvent = new YAHOO.util.CustomEvent("beforeDeselect");
+
+	/**
+	* Fired when a selection is made
+	* @event deselectEvent
+	* @param {Array}	Array of Date field arrays in the format [YYYY, MM, DD].
+	*/
+	this.deselectEvent = new YAHOO.util.CustomEvent("deselect");
+
+	/**
+	* Fired when the Calendar page is changed
+	* @event changePageEvent
+	*/
+	this.changePageEvent = new YAHOO.util.CustomEvent("changePage");
+
+	/**
+	* Fired before the Calendar is rendered
+	* @event beforeRenderEvent
+	*/
+	this.beforeRenderEvent = new YAHOO.util.CustomEvent("beforeRender");
+
+	/**
+	* Fired when the Calendar is rendered
+	* @event renderEvent
+	*/
+	this.renderEvent = new YAHOO.util.CustomEvent("render");
+
+	/**
+	* Fired when the Calendar is reset
+	* @event resetEvent
+	*/
+	this.resetEvent = new YAHOO.util.CustomEvent("reset");
+
+	/**
+	* Fired when the Calendar is cleared
+	* @event clearEvent
+	*/
+	this.clearEvent = new YAHOO.util.CustomEvent("clear");
+
+	this.beforeSelectEvent.subscribe(this.onBeforeSelect, this, true);
+	this.selectEvent.subscribe(this.onSelect, this, true);
+	this.beforeDeselectEvent.subscribe(this.onBeforeDeselect, this, true);
+	this.deselectEvent.subscribe(this.onDeselect, this, true);
+	this.changePageEvent.subscribe(this.onChangePage, this, true);
+	this.renderEvent.subscribe(this.onRender, this, true);
+	this.resetEvent.subscribe(this.onReset, this, true);
+	this.clearEvent.subscribe(this.onClear, this, true);
+};
+
+
+/**
+* The default event function that is attached to a date link within a calendar cell
+* when the calendar is rendered.
+* @method doSelectCell
+* @param {DOMEvent} e	The event
+* @param {Calendar} cal	A reference to the calendar passed by the Event utility
+*/
+YAHOO.widget.Calendar.prototype.doSelectCell = function(e, cal) {
+	var target = YAHOO.util.Event.getTarget(e);
+
+	var cell,index,d,date;
+
+	while (target.tagName.toLowerCase() != "td" && ! YAHOO.util.Dom.hasClass(target, cal.Style.CSS_CELL_SELECTABLE)) {
+		target = target.parentNode;
+		if (target.tagName.toLowerCase() == "html") {
+			return;
+		}
+	}
+
+	cell = target;
+
+	if (YAHOO.util.Dom.hasClass(cell, cal.Style.CSS_CELL_SELECTABLE)) {
+		index = cell.id.split("cell")[1];
+		d = cal.cellDates[index];
+		date = new Date(d[0],d[1]-1,d[2]);
+
+		var link;
+
+		if (cal.Options.MULTI_SELECT) {
+			link = cell.getElementsByTagName("a")[0];
+			if (link) {
+				link.blur();
+			}
+
+			var cellDate = cal.cellDates[index];
+			var cellDateIndex = cal._indexOfSelectedFieldArray(cellDate);
+
+			if (cellDateIndex > -1) {
+				cal.deselectCell(index);
+			} else {
+				cal.selectCell(index);
+			}
+
+		} else {
+			link = cell.getElementsByTagName("a")[0];
+			if (link) {
+				link.blur();
+			}
+			cal.selectCell(index);
+		}
+	}
+};
+
+/**
+* The event that is executed when the user hovers over a cell
+* @method doCellMouseOver
+* @param {DOMEvent} e	The event
+* @param {Calendar} cal	A reference to the calendar passed by the Event utility
+*/
+YAHOO.widget.Calendar.prototype.doCellMouseOver = function(e, cal) {
+	var target;
+	if (e) {
+		target = YAHOO.util.Event.getTarget(e);
+	} else {
+		target = this;
+	}
+
+	while (target.tagName.toLowerCase() != "td") {
+		target = target.parentNode;
+		if (target.tagName.toLowerCase() == "html") {
+			return;
+		}
+	}
+
+	if (YAHOO.util.Dom.hasClass(target, cal.Style.CSS_CELL_SELECTABLE)) {
+		YAHOO.util.Dom.addClass(target, cal.Style.CSS_CELL_HOVER);
+	}
+};
+
+/**
+* The event that is executed when the user moves the mouse out of a cell
+* @method doCellMouseOut
+* @param {DOMEvent} e	The event
+* @param {Calendar} cal	A reference to the calendar passed by the Event utility
+*/
+YAHOO.widget.Calendar.prototype.doCellMouseOut = function(e, cal) {
+	var target;
+	if (e) {
+		target = YAHOO.util.Event.getTarget(e);
+	} else {
+		target = this;
+	}
+
+	while (target.tagName.toLowerCase() != "td") {
+		target = target.parentNode;
+		if (target.tagName.toLowerCase() == "html") {
+			return;
+		}
+	}
+
+	if (YAHOO.util.Dom.hasClass(target, cal.Style.CSS_CELL_SELECTABLE)) {
+		YAHOO.util.Dom.removeClass(target, cal.Style.CSS_CELL_HOVER);
+	}
+};
+
+YAHOO.widget.Calendar.prototype.setupConfig = function() {
+
+	/**
+	* The month/year representing the current visible Calendar date (mm/yyyy)
+	* @config pagedate
+	* @type String
+	* @default today's date
+	*/
+	this.cfg.addProperty("pagedate", { value:new Date(), handler:this.configPageDate } );
+
+	/**
+	* The date or range of dates representing the current Calendar selection
+	* @config selected
+	* @type String
+	* @default []
+	*/
+	this.cfg.addProperty("selected", { value:[], handler:this.configSelected } );
+
+	/**
+	* The title to display above the Calendar's month header
+	* @config title
+	* @type String
+	* @default ""
+	*/
+	this.cfg.addProperty("title", { value:"", handler:this.configTitle } );
+
+	/**
+	* Whether or not a close button should be displayed for this Calendar
+	* @config close
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("close", { value:false, handler:this.configClose } );
+
+	/**
+	* Whether or not an iframe shim should be placed under the Calendar to prevent select boxes from bleeding through in Internet Explorer 6 and below.
+	* @config iframe
+	* @type Boolean
+	* @default true
+	*/
+	this.cfg.addProperty("iframe", { value:true, handler:this.configIframe, validator:this.cfg.checkBoolean } );
+
+	/**
+	* The minimum selectable date in the current Calendar (mm/dd/yyyy)
+	* @config mindate
+	* @type String
+	* @default null
+	*/
+	this.cfg.addProperty("mindate", { value:null, handler:this.configMinDate } );
+
+	/**
+	* The maximum selectable date in the current Calendar (mm/dd/yyyy)
+	* @config maxdate
+	* @type String
+	* @default null
+	*/
+	this.cfg.addProperty("maxdate", { value:null, handler:this.configMaxDate } );
+
+
+	// Options properties
+
+	/**
+	* True if the Calendar should allow multiple selections. False by default.
+	* @config MULTI_SELECT
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("MULTI_SELECT",	{ value:false, handler:this.configOptions, validator:this.cfg.checkBoolean } );
+
+	/**
+	* The weekday the week begins on. Default is 0 (Sunday).
+	* @config START_WEEKDAY
+	* @type number
+	* @default 0
+	*/
+	this.cfg.addProperty("START_WEEKDAY",	{ value:0, handler:this.configOptions, validator:this.cfg.checkNumber  } );
+
+	/**
+	* True if the Calendar should show weekday labels. True by default.
+	* @config SHOW_WEEKDAYS
+	* @type Boolean
+	* @default true
+	*/
+	this.cfg.addProperty("SHOW_WEEKDAYS",	{ value:true, handler:this.configOptions, validator:this.cfg.checkBoolean  } );
+
+	/**
+	* True if the Calendar should show week row headers. False by default.
+	* @config SHOW_WEEK_HEADER
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("SHOW_WEEK_HEADER",{ value:false, handler:this.configOptions, validator:this.cfg.checkBoolean } );
+
+	/**
+	* True if the Calendar should show week row footers. False by default.
+	* @config SHOW_WEEK_FOOTER
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("SHOW_WEEK_FOOTER",{ value:false, handler:this.configOptions, validator:this.cfg.checkBoolean } );
+
+	/**
+	* True if the Calendar should suppress weeks that are not a part of the current month. False by default.
+	* @config HIDE_BLANK_WEEKS
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("HIDE_BLANK_WEEKS",{ value:false, handler:this.configOptions, validator:this.cfg.checkBoolean } );
+
+	/**
+	* The image that should be used for the left navigation arrow.
+	* @config NAV_ARROW_LEFT
+	* @type String
+	* @default YAHOO.widget.Calendar.IMG_ROOT + "us/tr/callt.gif"
+	*/
+	this.cfg.addProperty("NAV_ARROW_LEFT",	{ value:YAHOO.widget.Calendar.IMG_ROOT + "us/tr/callt.gif", handler:this.configOptions } );
+
+	/**
+	* The image that should be used for the left navigation arrow.
+	* @config NAV_ARROW_RIGHT
+	* @type String
+	* @default YAHOO.widget.Calendar.IMG_ROOT + "us/tr/calrt.gif"
+	*/
+	this.cfg.addProperty("NAV_ARROW_RIGHT",	{ value:YAHOO.widget.Calendar.IMG_ROOT + "us/tr/calrt.gif", handler:this.configOptions } );
+
+	// Locale properties
+
+	/**
+	* The short month labels for the current locale.
+	* @config MONTHS_SHORT
+	* @type String[]
+	* @default ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
+	*/
+	this.cfg.addProperty("MONTHS_SHORT",	{ value:["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], handler:this.configLocale } );
+
+	/**
+	* The long month labels for the current locale.
+	* @config MONTHS_LONG
+	* @type String[]
+	* @default ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"
+	*/
+	this.cfg.addProperty("MONTHS_LONG",		{ value:["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], handler:this.configLocale } );
+
+	/**
+	* The 1-character weekday labels for the current locale.
+	* @config WEEKDAYS_1CHAR
+	* @type String[]
+	* @default ["S", "M", "T", "W", "T", "F", "S"]
+	*/
+	this.cfg.addProperty("WEEKDAYS_1CHAR",	{ value:["S", "M", "T", "W", "T", "F", "S"], handler:this.configLocale } );
+
+	/**
+	* The short weekday labels for the current locale.
+	* @config WEEKDAYS_SHORT
+	* @type String[]
+	* @default ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]
+	*/
+	this.cfg.addProperty("WEEKDAYS_SHORT",	{ value:["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], handler:this.configLocale } );
+
+	/**
+	* The medium weekday labels for the current locale.
+	* @config WEEKDAYS_MEDIUM
+	* @type String[]
+	* @default ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]
+	*/
+	this.cfg.addProperty("WEEKDAYS_MEDIUM",	{ value:["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], handler:this.configLocale } );
+
+	/**
+	* The long weekday labels for the current locale.
+	* @config WEEKDAYS_LONG
+	* @type String[]
+	* @default ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]
+	*/
+	this.cfg.addProperty("WEEKDAYS_LONG",	{ value:["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], handler:this.configLocale } );
+
+	/**
+	* Refreshes the locale values used to build the Calendar.
+	* @method refreshLocale
+	* @private
+	*/
+	var refreshLocale = function() {
+		this.cfg.refireEvent("LOCALE_MONTHS");
+		this.cfg.refireEvent("LOCALE_WEEKDAYS");
+	};
+
+	this.cfg.subscribeToConfigEvent("START_WEEKDAY", refreshLocale, this, true);
+	this.cfg.subscribeToConfigEvent("MONTHS_SHORT", refreshLocale, this, true);
+	this.cfg.subscribeToConfigEvent("MONTHS_LONG", refreshLocale, this, true);
+	this.cfg.subscribeToConfigEvent("WEEKDAYS_1CHAR", refreshLocale, this, true);
+	this.cfg.subscribeToConfigEvent("WEEKDAYS_SHORT", refreshLocale, this, true);
+	this.cfg.subscribeToConfigEvent("WEEKDAYS_MEDIUM", refreshLocale, this, true);
+	this.cfg.subscribeToConfigEvent("WEEKDAYS_LONG", refreshLocale, this, true);
+
+	/**
+	* The setting that determines which length of month labels should be used. Possible values are "short" and "long".
+	* @config LOCALE_MONTHS
+	* @type String
+	* @default "long"
+	*/
+	this.cfg.addProperty("LOCALE_MONTHS",	{ value:"long", handler:this.configLocaleValues } );
+
+	/**
+	* The setting that determines which length of weekday labels should be used. Possible values are "1char", "short", "medium", and "long".
+	* @config LOCALE_WEEKDAYS
+	* @type String
+	* @default "short"
+	*/
+	this.cfg.addProperty("LOCALE_WEEKDAYS",	{ value:"short", handler:this.configLocaleValues } );
+
+	/**
+	* The value used to delimit individual dates in a date string passed to various Calendar functions.
+	* @config DATE_DELIMITER
+	* @type String
+	* @default ","
+	*/
+	this.cfg.addProperty("DATE_DELIMITER",		{ value:",", handler:this.configLocale } );
+
+	/**
+	* The value used to delimit date fields in a date string passed to various Calendar functions.
+	* @config DATE_FIELD_DELIMITER
+	* @type String
+	* @default "/"
+	*/
+	this.cfg.addProperty("DATE_FIELD_DELIMITER",{ value:"/", handler:this.configLocale } );
+
+	/**
+	* The value used to delimit date ranges in a date string passed to various Calendar functions.
+	* @config DATE_RANGE_DELIMITER
+	* @type String
+	* @default "-"
+	*/
+	this.cfg.addProperty("DATE_RANGE_DELIMITER",{ value:"-", handler:this.configLocale } );
+
+	/**
+	* The position of the month in a month/year date string
+	* @config MY_MONTH_POSITION
+	* @type Number
+	* @default 1
+	*/
+	this.cfg.addProperty("MY_MONTH_POSITION",	{ value:1, handler:this.configLocale, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the year in a month/year date string
+	* @config MY_YEAR_POSITION
+	* @type Number
+	* @default 2
+	*/
+	this.cfg.addProperty("MY_YEAR_POSITION",	{ value:2, handler:this.configLocale, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the month in a month/day date string
+	* @config MD_MONTH_POSITION
+	* @type Number
+	* @default 1
+	*/
+	this.cfg.addProperty("MD_MONTH_POSITION",	{ value:1, handler:this.configLocale, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the day in a month/year date string
+	* @config MD_DAY_POSITION
+	* @type Number
+	* @default 2
+	*/
+	this.cfg.addProperty("MD_DAY_POSITION",		{ value:2, handler:this.configLocale, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the month in a month/day/year date string
+	* @config MDY_MONTH_POSITION
+	* @type Number
+	* @default 1
+	*/
+	this.cfg.addProperty("MDY_MONTH_POSITION",	{ value:1, handler:this.configLocale, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the day in a month/day/year date string
+	* @config MDY_DAY_POSITION
+	* @type Number
+	* @default 2
+	*/
+	this.cfg.addProperty("MDY_DAY_POSITION",	{ value:2, handler:this.configLocale, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the year in a month/day/year date string
+	* @config MDY_YEAR_POSITION
+	* @type Number
+	* @default 3
+	*/
+	this.cfg.addProperty("MDY_YEAR_POSITION",	{ value:3, handler:this.configLocale, validator:this.cfg.checkNumber } );
+};
+
+/**
+* The default handler for the "pagedate" property
+* @method configPageDate
+*/
+YAHOO.widget.Calendar.prototype.configPageDate = function(type, args, obj) {
+	var val = args[0];
+	var month, year, aMonthYear;
+
+	if (val) {
+		if (val instanceof Date) {
+			val = YAHOO.widget.DateMath.findMonthStart(val);
+			this.cfg.setProperty("pagedate", val, true);
+			if (! this._pageDate) {
+				this._pageDate = this.cfg.getProperty("pagedate");
+			}
+			return;
+		} else {
+			aMonthYear = val.split(this.cfg.getProperty("DATE_FIELD_DELIMITER"));
+			month = parseInt(aMonthYear[this.cfg.getProperty("MY_MONTH_POSITION")-1], 10)-1;
+			year = parseInt(aMonthYear[this.cfg.getProperty("MY_YEAR_POSITION")-1], 10);
+		}
+	} else {
+		month = this.today.getMonth();
+		year = this.today.getFullYear();
+	}
+
+	this.cfg.setProperty("pagedate", new Date(year, month, 1), true);
+	if (! this._pageDate) {
+		this._pageDate = this.cfg.getProperty("pagedate");
+	}
+};
+
+/**
+* The default handler for the "mindate" property
+* @method configMinDate
+*/
+YAHOO.widget.Calendar.prototype.configMinDate = function(type, args, obj) {
+	var val = args[0];
+	if (typeof val == 'string') {
+		val = this._parseDate(val);
+		this.cfg.setProperty("mindate", new Date(val[0],(val[1]-1),val[2]));
+	}
+};
+
+/**
+* The default handler for the "maxdate" property
+* @method configMaxDate
+*/
+YAHOO.widget.Calendar.prototype.configMaxDate = function(type, args, obj) {
+	var val = args[0];
+	if (typeof val == 'string') {
+		val = this._parseDate(val);
+		this.cfg.setProperty("maxdate", new Date(val[0],(val[1]-1),val[2]));
+	}
+};
+
+/**
+* The default handler for the "selected" property
+* @method configSelected
+*/
+YAHOO.widget.Calendar.prototype.configSelected = function(type, args, obj) {
+	var selected = args[0];
+
+	if (selected) {
+		if (typeof selected == 'string') {
+			this.cfg.setProperty("selected", this._parseDates(selected), true);
+		}
+	}
+	if (! this._selectedDates) {
+		this._selectedDates = this.cfg.getProperty("selected");
+	}
+};
+
+/**
+* The default handler for all configuration options properties
+* @method configOptions
+*/
+YAHOO.widget.Calendar.prototype.configOptions = function(type, args, obj) {
+	type = type.toUpperCase();
+	var val = args[0];
+	this.Options[type] = val;
+};
+
+/**
+* The default handler for all configuration locale properties
+* @method configLocale
+*/
+YAHOO.widget.Calendar.prototype.configLocale = function(type, args, obj) {
+	type = type.toUpperCase();
+	var val = args[0];
+	this.Locale[type] = val;
+
+	this.cfg.refireEvent("LOCALE_MONTHS");
+	this.cfg.refireEvent("LOCALE_WEEKDAYS");
+
+};
+
+/**
+* The default handler for all configuration locale field length properties
+* @method configLocaleValues
+*/
+YAHOO.widget.Calendar.prototype.configLocaleValues = function(type, args, obj) {
+	type = type.toUpperCase();
+	var val = args[0];
+
+	switch (type) {
+		case "LOCALE_MONTHS":
+			switch (val) {
+				case "short":
+					this.Locale.LOCALE_MONTHS = this.cfg.getProperty("MONTHS_SHORT").concat();
+					break;
+				case "long":
+					this.Locale.LOCALE_MONTHS = this.cfg.getProperty("MONTHS_LONG").concat();
+					break;
+			}
+			break;
+		case "LOCALE_WEEKDAYS":
+			switch (val) {
+				case "1char":
+					this.Locale.LOCALE_WEEKDAYS = this.cfg.getProperty("WEEKDAYS_1CHAR").concat();
+					break;
+				case "short":
+					this.Locale.LOCALE_WEEKDAYS = this.cfg.getProperty("WEEKDAYS_SHORT").concat();
+					break;
+				case "medium":
+					this.Locale.LOCALE_WEEKDAYS = this.cfg.getProperty("WEEKDAYS_MEDIUM").concat();
+					break;
+				case "long":
+					this.Locale.LOCALE_WEEKDAYS = this.cfg.getProperty("WEEKDAYS_LONG").concat();
+					break;
+			}
+
+			var START_WEEKDAY = this.cfg.getProperty("START_WEEKDAY");
+
+			if (START_WEEKDAY > 0) {
+				for (var w=0;w<START_WEEKDAY;++w) {
+					this.Locale.LOCALE_WEEKDAYS.push(this.Locale.LOCALE_WEEKDAYS.shift());
+				}
+			}
+			break;
+	}
+};
+
+/**
+* Defines the style constants for the Calendar
+* @method initStyles
+*/
+YAHOO.widget.Calendar.prototype.initStyles = function() {
+
+	/**
+	* Collection of Style constants for the Calendar
+	* @property Style
+	*/
+	this.Style = {
+		/**
+		* @property Style.CSS_ROW_HEADER
+		*/
+		CSS_ROW_HEADER: "calrowhead",
+		/**
+		* @property Style.CSS_ROW_FOOTER
+		*/
+		CSS_ROW_FOOTER: "calrowfoot",
+		/**
+		* @property Style.CSS_CELL
+		*/
+		CSS_CELL : "calcell",
+		/**
+		* @property Style.CSS_CELL_SELECTED
+		*/
+		CSS_CELL_SELECTED : "selected",
+		/**
+		* @property Style.CSS_CELL_SELECTABLE
+		*/
+		CSS_CELL_SELECTABLE : "selectable",
+		/**
+		* @property Style.CSS_CELL_RESTRICTED
+		*/
+		CSS_CELL_RESTRICTED : "restricted",
+		/**
+		* @property Style.CSS_CELL_TODAY
+		*/
+		CSS_CELL_TODAY : "today",
+		/**
+		* @property Style.CSS_CELL_OOM
+		*/
+		CSS_CELL_OOM : "oom",
+		/**
+		* @property Style.CSS_CELL_OOB
+		*/
+		CSS_CELL_OOB : "previous",
+		/**
+		* @property Style.CSS_HEADER
+		*/
+		CSS_HEADER : "calheader",
+		/**
+		* @property Style.CSS_HEADER_TEXT
+		*/
+		CSS_HEADER_TEXT : "calhead",
+		/**
+		* @property Style.CSS_WEEKDAY_CELL
+		*/
+		CSS_WEEKDAY_CELL : "calweekdaycell",
+		/**
+		* @property Style.CSS_WEEKDAY_ROW
+		*/
+		CSS_WEEKDAY_ROW : "calweekdayrow",
+		/**
+		* @property Style.CSS_FOOTER
+		*/
+		CSS_FOOTER : "calfoot",
+		/**
+		* @property Style.CSS_CALENDAR
+		*/
+		CSS_CALENDAR : "yui-calendar",
+		/**
+		* @property Style.CSS_SINGLE
+		*/
+		CSS_SINGLE : "single",
+		/**
+		* @property Style.CSS_CONTAINER
+		*/
+		CSS_CONTAINER : "yui-calcontainer",
+		/**
+		* @property Style.CSS_NAV_LEFT
+		*/
+		CSS_NAV_LEFT : "calnavleft",
+		/**
+		* @property Style.CSS_NAV_RIGHT
+		*/
+		CSS_NAV_RIGHT : "calnavright",
+		/**
+		* @property Style.CSS_CELL_TOP
+		*/
+		CSS_CELL_TOP : "calcelltop",
+		/**
+		* @property Style.CSS_CELL_LEFT
+		*/
+		CSS_CELL_LEFT : "calcellleft",
+		/**
+		* @property Style.CSS_CELL_RIGHT
+		*/
+		CSS_CELL_RIGHT : "calcellright",
+		/**
+		* @property Style.CSS_CELL_BOTTOM
+		*/
+		CSS_CELL_BOTTOM : "calcellbottom",
+		/**
+		* @property Style.CSS_CELL_HOVER
+		*/
+		CSS_CELL_HOVER : "calcellhover",
+		/**
+		* @property Style.CSS_CELL_HIGHLIGHT1
+		*/
+		CSS_CELL_HIGHLIGHT1 : "highlight1",
+		/**
+		* @property Style.CSS_CELL_HIGHLIGHT2
+		*/
+		CSS_CELL_HIGHLIGHT2 : "highlight2",
+		/**
+		* @property Style.CSS_CELL_HIGHLIGHT3
+		*/
+		CSS_CELL_HIGHLIGHT3 : "highlight3",
+		/**
+		* @property Style.CSS_CELL_HIGHLIGHT4
+		*/
+		CSS_CELL_HIGHLIGHT4 : "highlight4"
+	};
+};
+
+/**
+* Builds the date label that will be displayed in the calendar header or
+* footer, depending on configuration.
+* @method buildMonthLabel
+* @return	{String}	The formatted calendar month label
+*/
+YAHOO.widget.Calendar.prototype.buildMonthLabel = function() {
+	var text = this.Locale.LOCALE_MONTHS[this.cfg.getProperty("pagedate").getMonth()] + " " + this.cfg.getProperty("pagedate").getFullYear();
+	return text;
+};
+
+/**
+* Builds the date digit that will be displayed in calendar cells
+* @method buildDayLabel
+* @param {Date}	workingDate	The current working date
+* @return	{String}	The formatted day label
+*/
+YAHOO.widget.Calendar.prototype.buildDayLabel = function(workingDate) {
+	var day = workingDate.getDate();
+	return day;
+};
+
+/**
+* Renders the calendar header.
+* @method renderHeader
+* @param {Array}	html	The current working HTML array
+* @return {Array} The current working HTML array
+*/
+YAHOO.widget.Calendar.prototype.renderHeader = function(html) {
+	var colSpan = 7;
+
+	if (this.cfg.getProperty("SHOW_WEEK_HEADER")) {
+		colSpan += 1;
+	}
+
+	if (this.cfg.getProperty("SHOW_WEEK_FOOTER")) {
+		colSpan += 1;
+	}
+
+	html[html.length] = "<thead>";
+	html[html.length] =		"<tr>";
+	html[html.length] =			'<th colspan="' + colSpan + '" class="' + this.Style.CSS_HEADER_TEXT + '">';
+	html[html.length] =				'<div class="' + this.Style.CSS_HEADER + '">';
+
+		var renderLeft, renderRight = false;
+
+		if (this.parent) {
+			if (this.index === 0) {
+				renderLeft = true;
+			}
+			if (this.index == (this.parent.cfg.getProperty("pages") -1)) {
+				renderRight = true;
+			}
+		} else {
+			renderLeft = true;
+			renderRight = true;
+		}
+
+		var cal = this.parent || this;
+
+		if (renderLeft) {
+			html[html.length] = '<a class="' + this.Style.CSS_NAV_LEFT + '" style="background-image:url(' + this.cfg.getProperty("NAV_ARROW_LEFT") + ')">&#160;</a>';
+		}
+
+		html[html.length] = this.buildMonthLabel();
+
+		if (renderRight) {
+			html[html.length] = '<a class="' + this.Style.CSS_NAV_RIGHT + '" style="background-image:url(' + this.cfg.getProperty("NAV_ARROW_RIGHT") + ')">&#160;</a>';
+		}
+
+
+	html[html.length] =				'</div>';
+	html[html.length] =			'</th>';
+	html[html.length] =		'</tr>';
+
+	if (this.cfg.getProperty("SHOW_WEEKDAYS")) {
+		html = this.buildWeekdays(html);
+	}
+
+	html[html.length] = '</thead>';
+
+	return html;
+};
+
+/**
+* Renders the Calendar's weekday headers.
+* @method buildWeekdays
+* @param {Array}	html	The current working HTML array
+* @return {Array} The current working HTML array
+*/
+YAHOO.widget.Calendar.prototype.buildWeekdays = function(html) {
+
+	html[html.length] = '<tr class="' + this.Style.CSS_WEEKDAY_ROW + '">';
+
+	if (this.cfg.getProperty("SHOW_WEEK_HEADER")) {
+		html[html.length] = '<th>&#160;</th>';
+	}
+
+	for(var i=0;i<this.Locale.LOCALE_WEEKDAYS.length;++i) {
+		html[html.length] = '<th class="calweekdaycell">' + this.Locale.LOCALE_WEEKDAYS[i] + '</th>';
+	}
+
+	if (this.cfg.getProperty("SHOW_WEEK_FOOTER")) {
+		html[html.length] = '<th>&#160;</th>';
+	}
+
+	html[html.length] = '</tr>';
+
+	return html;
+};
+
+/**
+* Renders the calendar body.
+* @method renderBody
+* @param {Date}	workingDate	The current working Date being used for the render process
+* @param {Array}	html	The current working HTML array
+* @return {Array} The current working HTML array
+*/
+YAHOO.widget.Calendar.prototype.renderBody = function(workingDate, html) {
+
+	var startDay = this.cfg.getProperty("START_WEEKDAY");
+
+	this.preMonthDays = workingDate.getDay();
+	if (startDay > 0) {
+		this.preMonthDays -= startDay;
+	}
+	if (this.preMonthDays < 0) {
+		this.preMonthDays += 7;
+	}
+
+	this.monthDays = YAHOO.widget.DateMath.findMonthEnd(workingDate).getDate();
+	this.postMonthDays = YAHOO.widget.Calendar.DISPLAY_DAYS-this.preMonthDays-this.monthDays;
+
+	workingDate = YAHOO.widget.DateMath.subtract(workingDate, YAHOO.widget.DateMath.DAY, this.preMonthDays);
+
+	var useDate,weekNum,weekClass;
+	useDate = this.cfg.getProperty("pagedate");
+
+	html[html.length] = '<tbody class="m' + (useDate.getMonth()+1) + '">';
+
+	var i = 0;
+
+	var tempDiv = document.createElement("div");
+	var cell = document.createElement("td");
+	tempDiv.appendChild(cell);
+
+	var jan1 = new Date(useDate.getFullYear(),0,1);
+
+	var cal = this.parent || this;
+
+	for (var r=0;r<6;r++) {
+
+		weekNum = YAHOO.widget.DateMath.getWeekNumber(workingDate, useDate.getFullYear(), startDay);
+
+		weekClass = "w" + weekNum;
+
+		if (r !== 0 && this.isDateOOM(workingDate) && this.cfg.getProperty("HIDE_BLANK_WEEKS") === true) {
+			break;
+		} else {
+
+			html[html.length] = '<tr class="' + weekClass + '">';
+
+			if (this.cfg.getProperty("SHOW_WEEK_HEADER")) { html = this.renderRowHeader(weekNum, html); }
+
+			for (var d=0;d<7;d++){ // Render actual days
+
+				var cellRenderers = [];
+
+				this.clearElement(cell);
+
+				YAHOO.util.Dom.addClass(cell, "calcell");
+
+				cell.id = this.id + "_cell" + i;
+
+				cell.innerHTML = i;
+
+				var renderer = null;
+
+				if (workingDate.getFullYear()	== this.today.getFullYear() &&
+					workingDate.getMonth()		== this.today.getMonth() &&
+					workingDate.getDate()		== this.today.getDate()) {
+					cellRenderers[cellRenderers.length]=cal.renderCellStyleToday;
+				}
+
+				this.cellDates[this.cellDates.length]=[workingDate.getFullYear(),workingDate.getMonth()+1,workingDate.getDate()]; // Add this date to cellDates
+
+				if (this.isDateOOM(workingDate)) {
+					cellRenderers[cellRenderers.length]=cal.renderCellNotThisMonth;
+				} else {
+
+					YAHOO.util.Dom.addClass(cell, "wd" + workingDate.getDay());
+					YAHOO.util.Dom.addClass(cell, "d" + workingDate.getDate());
+
+					for (var s=0;s<this.renderStack.length;++s) {
+
+						var rArray = this.renderStack[s];
+						var type = rArray[0];
+
+						var month;
+						var day;
+						var year;
+
+						switch (type) {
+							case YAHOO.widget.Calendar.DATE:
+								month = rArray[1][1];
+								day = rArray[1][2];
+								year = rArray[1][0];
+
+								if (workingDate.getMonth()+1 == month && workingDate.getDate() == day && workingDate.getFullYear() == year) {
+									renderer = rArray[2];
+									this.renderStack.splice(s,1);
+								}
+								break;
+							case YAHOO.widget.Calendar.MONTH_DAY:
+								month = rArray[1][0];
+								day = rArray[1][1];
+
+								if (workingDate.getMonth()+1 == month && workingDate.getDate() == day) {
+									renderer = rArray[2];
+									this.renderStack.splice(s,1);
+								}
+								break;
+							case YAHOO.widget.Calendar.RANGE:
+								var date1 = rArray[1][0];
+								var date2 = rArray[1][1];
+
+								var d1month = date1[1];
+								var d1day = date1[2];
+								var d1year = date1[0];
+
+								var d1 = new Date(d1year, d1month-1, d1day);
+
+								var d2month = date2[1];
+								var d2day = date2[2];
+								var d2year = date2[0];
+
+								var d2 = new Date(d2year, d2month-1, d2day);
+
+								if (workingDate.getTime() >= d1.getTime() && workingDate.getTime() <= d2.getTime()) {
+									renderer = rArray[2];
+
+									if (workingDate.getTime()==d2.getTime()) {
+										this.renderStack.splice(s,1);
+									}
+								}
+								break;
+							case YAHOO.widget.Calendar.WEEKDAY:
+
+								var weekday = rArray[1][0];
+								if (workingDate.getDay()+1 == weekday) {
+									renderer = rArray[2];
+								}
+								break;
+							case YAHOO.widget.Calendar.MONTH:
+
+								month = rArray[1][0];
+								if (workingDate.getMonth()+1 == month) {
+									renderer = rArray[2];
+								}
+								break;
+						}
+
+						if (renderer) {
+							cellRenderers[cellRenderers.length]=renderer;
+						}
+					}
+
+				}
+
+				if (this._indexOfSelectedFieldArray([workingDate.getFullYear(),workingDate.getMonth()+1,workingDate.getDate()]) > -1) {
+					cellRenderers[cellRenderers.length]=cal.renderCellStyleSelected;
+				}
+
+				var mindate = this.cfg.getProperty("mindate");
+				var maxdate = this.cfg.getProperty("maxdate");
+
+				if (mindate) {
+					mindate = YAHOO.widget.DateMath.clearTime(mindate);
+				}
+				if (maxdate) {
+					maxdate = YAHOO.widget.DateMath.clearTime(maxdate);
+				}
+
+				if (
+					(mindate && (workingDate.getTime() < mindate.getTime())) ||
+					(maxdate && (workingDate.getTime() > maxdate.getTime()))
+				) {
+					cellRenderers[cellRenderers.length]=cal.renderOutOfBoundsDate;
+				} else {
+					cellRenderers[cellRenderers.length]=cal.styleCellDefault;
+					cellRenderers[cellRenderers.length]=cal.renderCellDefault;
+				}
+
+
+
+				for (var x=0;x<cellRenderers.length;++x) {
+					var ren = cellRenderers[x];
+					if (ren.call((this.parent || this),workingDate,cell) == YAHOO.widget.Calendar.STOP_RENDER) {
+						break;
+					}
+				}
+
+				workingDate.setTime(workingDate.getTime() + YAHOO.widget.DateMath.ONE_DAY_MS);
+
+				if (i >= 0 && i <= 6) {
+					YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_TOP);
+				}
+				if ((i % 7) === 0) {
+					YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_LEFT);
+				}
+				if (((i+1) % 7) === 0) {
+					YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_RIGHT);
+				}
+
+				var postDays = this.postMonthDays;
+				if (postDays >= 7 && this.cfg.getProperty("HIDE_BLANK_WEEKS")) {
+					var blankWeeks = Math.floor(postDays/7);
+					for (var p=0;p<blankWeeks;++p) {
+						postDays -= 7;
+					}
+				}
+
+				if (i >= ((this.preMonthDays+postDays+this.monthDays)-7)) {
+					YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_BOTTOM);
+				}
+
+				html[html.length] = tempDiv.innerHTML;
+
+				i++;
+			}
+
+			if (this.cfg.getProperty("SHOW_WEEK_FOOTER")) { html = this.renderRowFooter(weekNum, html); }
+
+			html[html.length] = '</tr>';
+		}
+	}
+
+	html[html.length] = '</tbody>';
+
+	return html;
+};
+
+/**
+* Renders the calendar footer. In the default implementation, there is
+* no footer.
+* @method renderFooter
+* @param {Array}	html	The current working HTML array
+* @return {Array} The current working HTML array
+*/
+YAHOO.widget.Calendar.prototype.renderFooter = function(html) { return html; };
+
+/**
+* Renders the calendar after it has been configured. The render() method has a specific call chain that will execute
+* when the method is called: renderHeader, renderBody, renderFooter.
+* Refer to the documentation for those methods for information on
+* individual render tasks.
+* @method render
+*/
+YAHOO.widget.Calendar.prototype.render = function() {
+	this.beforeRenderEvent.fire();
+
+	// Find starting day of the current month
+	var workingDate = YAHOO.widget.DateMath.findMonthStart(this.cfg.getProperty("pagedate"));
+
+	this.resetRenderers();
+	this.cellDates.length = 0;
+
+	YAHOO.util.Event.purgeElement(this.oDomContainer, true);
+
+	var html = [];
+
+	html[html.length] = '<table cellSpacing="0" class="' + this.Style.CSS_CALENDAR + ' y' + workingDate.getFullYear() + '" id="' + this.id + '">';
+	html = this.renderHeader(html);
+	html = this.renderBody(workingDate, html);
+	html = this.renderFooter(html);
+	html[html.length] = '</table>';
+
+	this.oDomContainer.innerHTML = html.join("\n");
+
+	this.applyListeners();
+	this.cells = this.oDomContainer.getElementsByTagName("td");
+
+	this.cfg.refireEvent("title");
+	this.cfg.refireEvent("close");
+	this.cfg.refireEvent("iframe");
+
+	this.renderEvent.fire();
+};
+
+/**
+* Applies the Calendar's DOM listeners to applicable elements.
+* @method applyListeners
+*/
+YAHOO.widget.Calendar.prototype.applyListeners = function() {
+
+	var root = this.oDomContainer;
+	var cal = this.parent || this;
+
+	var linkLeft, linkRight;
+
+	linkLeft = YAHOO.util.Dom.getElementsByClassName(this.Style.CSS_NAV_LEFT, "a", root);
+	linkRight = YAHOO.util.Dom.getElementsByClassName(this.Style.CSS_NAV_RIGHT, "a", root);
+
+	if (linkLeft) {
+		this.linkLeft = linkLeft[0];
+		YAHOO.util.Event.addListener(this.linkLeft, "mousedown", cal.previousMonth, cal, true);
+	}
+
+	if (linkRight) {
+		this.linkRight = linkRight[0];
+		YAHOO.util.Event.addListener(this.linkRight, "mousedown", cal.nextMonth, cal, true);
+	}
+
+	if (this.domEventMap) {
+		var el,elements;
+		for (var cls in this.domEventMap) {
+			if (this.domEventMap.hasOwnProperty(cls)) {
+				var items = this.domEventMap[cls];
+
+				if (! (items instanceof Array)) {
+					items = [items];
+				}
+
+				for (var i=0;i<items.length;i++)	{
+					var item = items[i];
+					elements = YAHOO.util.Dom.getElementsByClassName(cls, item.tag, this.oDomContainer);
+
+					for (var c=0;c<elements.length;c++) {
+						el = elements[c];
+						 YAHOO.util.Event.addListener(el, item.event, item.handler, item.scope, item.correct );
+					}
+				}
+			}
+		}
+	}
+
+	YAHOO.util.Event.addListener(this.oDomContainer, "click", this.doSelectCell, this);
+	YAHOO.util.Event.addListener(this.oDomContainer, "mouseover", this.doCellMouseOver, this);
+	YAHOO.util.Event.addListener(this.oDomContainer, "mouseout", this.doCellMouseOut, this);
+};
+
+/**
+* Retrieves the Date object for the specified Calendar cell
+* @method getDateByCellId
+* @param {String}	id	The id of the cell
+* @return {Date} The Date object for the specified Calendar cell
+*/
+YAHOO.widget.Calendar.prototype.getDateByCellId = function(id) {
+	var date = this.getDateFieldsByCellId(id);
+	return new Date(date[0],date[1]-1,date[2]);
+};
+
+/**
+* Retrieves the Date object for the specified Calendar cell
+* @method getDateFieldsByCellId
+* @param {String}	id	The id of the cell
+* @return {Array}	The array of Date fields for the specified Calendar cell
+*/
+YAHOO.widget.Calendar.prototype.getDateFieldsByCellId = function(id) {
+	id = id.toLowerCase().split("_cell")[1];
+	id = parseInt(id, 10);
+	return this.cellDates[id];
+};
+
+// BEGIN BUILT-IN TABLE CELL RENDERERS
+
+/**
+* Renders a cell that falls before the minimum date or after the maximum date.
+* widget class.
+* @method renderOutOfBoundsDate
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+* @return {String} YAHOO.widget.Calendar.STOP_RENDER if rendering should stop with this style, null or nothing if rendering
+*			should not be terminated
+*/
+YAHOO.widget.Calendar.prototype.renderOutOfBoundsDate = function(workingDate, cell) {
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_OOB);
+	cell.innerHTML = workingDate.getDate();
+	return YAHOO.widget.Calendar.STOP_RENDER;
+};
+
+/**
+* Renders the row header for a week.
+* @method renderRowHeader
+* @param {Number}	weekNum	The week number of the current row
+* @param {Array}	cell	The current working HTML array
+*/
+YAHOO.widget.Calendar.prototype.renderRowHeader = function(weekNum, html) {
+	html[html.length] = '<th class="calrowhead">' + weekNum + '</th>';
+	return html;
+};
+
+/**
+* Renders the row footer for a week.
+* @method renderRowFooter
+* @param {Number}	weekNum	The week number of the current row
+* @param {Array}	cell	The current working HTML array
+*/
+YAHOO.widget.Calendar.prototype.renderRowFooter = function(weekNum, html) {
+	html[html.length] = '<th class="calrowfoot">' + weekNum + '</th>';
+	return html;
+};
+
+/**
+* Renders a single standard calendar cell in the calendar widget table.
+* All logic for determining how a standard default cell will be rendered is
+* encapsulated in this method, and must be accounted for when extending the
+* widget class.
+* @method renderCellDefault
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+*/
+YAHOO.widget.Calendar.prototype.renderCellDefault = function(workingDate, cell) {
+	cell.innerHTML = '<a href="javascript:void(null);" >' + this.buildDayLabel(workingDate) + "</a>";
+};
+
+/**
+* Styles a selectable cell.
+* @method styleCellDefault
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+*/
+YAHOO.widget.Calendar.prototype.styleCellDefault = function(workingDate, cell) {
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_SELECTABLE);
+};
+
+
+/**
+* Renders a single standard calendar cell using the CSS hightlight1 style
+* @method renderCellStyleHighlight1
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+*/
+YAHOO.widget.Calendar.prototype.renderCellStyleHighlight1 = function(workingDate, cell) {
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_HIGHLIGHT1);
+};
+
+/**
+* Renders a single standard calendar cell using the CSS hightlight2 style
+* @method renderCellStyleHighlight2
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+*/
+YAHOO.widget.Calendar.prototype.renderCellStyleHighlight2 = function(workingDate, cell) {
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_HIGHLIGHT2);
+};
+
+/**
+* Renders a single standard calendar cell using the CSS hightlight3 style
+* @method renderCellStyleHighlight3
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+*/
+YAHOO.widget.Calendar.prototype.renderCellStyleHighlight3 = function(workingDate, cell) {
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_HIGHLIGHT3);
+};
+
+/**
+* Renders a single standard calendar cell using the CSS hightlight4 style
+* @method renderCellStyleHighlight4
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+*/
+YAHOO.widget.Calendar.prototype.renderCellStyleHighlight4 = function(workingDate, cell) {
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_HIGHLIGHT4);
+};
+
+/**
+* Applies the default style used for rendering today's date to the current calendar cell
+* @method renderCellStyleToday
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+*/
+YAHOO.widget.Calendar.prototype.renderCellStyleToday = function(workingDate, cell) {
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_TODAY);
+};
+
+/**
+* Applies the default style used for rendering selected dates to the current calendar cell
+* @method renderCellStyleSelected
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+* @return {String} YAHOO.widget.Calendar.STOP_RENDER if rendering should stop with this style, null or nothing if rendering
+*			should not be terminated
+*/
+YAHOO.widget.Calendar.prototype.renderCellStyleSelected = function(workingDate, cell) {
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_SELECTED);
+};
+
+/**
+* Applies the default style used for rendering dates that are not a part of the current
+* month (preceding or trailing the cells for the current month)
+* @method renderCellNotThisMonth
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+* @return {String} YAHOO.widget.Calendar.STOP_RENDER if rendering should stop with this style, null or nothing if rendering
+*			should not be terminated
+*/
+YAHOO.widget.Calendar.prototype.renderCellNotThisMonth = function(workingDate, cell) {
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_OOM);
+	cell.innerHTML=workingDate.getDate();
+	return YAHOO.widget.Calendar.STOP_RENDER;
+};
+
+/**
+* Renders the current calendar cell as a non-selectable "black-out" date using the default
+* restricted style.
+* @method renderBodyCellRestricted
+* @param {Date}					workingDate		The current working Date object being used to generate the calendar
+* @param {HTMLTableCellElement}	cell			The current working cell in the calendar
+* @return {String} YAHOO.widget.Calendar.STOP_RENDER if rendering should stop with this style, null or nothing if rendering
+*			should not be terminated
+*/
+YAHOO.widget.Calendar.prototype.renderBodyCellRestricted = function(workingDate, cell) {
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL);
+	YAHOO.util.Dom.addClass(cell, this.Style.CSS_CELL_RESTRICTED);
+	cell.innerHTML=workingDate.getDate();
+	return YAHOO.widget.Calendar.STOP_RENDER;
+};
+
+// END BUILT-IN TABLE CELL RENDERERS
+
+// BEGIN MONTH NAVIGATION METHODS
+
+/**
+* Adds the designated number of months to the current calendar month, and sets the current
+* calendar page date to the new month.
+* @method addMonths
+* @param {Number}	count	The number of months to add to the current calendar
+*/
+YAHOO.widget.Calendar.prototype.addMonths = function(count) {
+	this.cfg.setProperty("pagedate", YAHOO.widget.DateMath.add(this.cfg.getProperty("pagedate"), YAHOO.widget.DateMath.MONTH, count));
+	this.resetRenderers();
+	this.changePageEvent.fire();
+};
+
+/**
+* Subtracts the designated number of months from the current calendar month, and sets the current
+* calendar page date to the new month.
+* @method subtractMonths
+* @param {Number}	count	The number of months to subtract from the current calendar
+*/
+YAHOO.widget.Calendar.prototype.subtractMonths = function(count) {
+	this.cfg.setProperty("pagedate", YAHOO.widget.DateMath.subtract(this.cfg.getProperty("pagedate"), YAHOO.widget.DateMath.MONTH, count));
+	this.resetRenderers();
+	this.changePageEvent.fire();
+};
+
+/**
+* Adds the designated number of years to the current calendar, and sets the current
+* calendar page date to the new month.
+* @method addYears
+* @param {Number}	count	The number of years to add to the current calendar
+*/
+YAHOO.widget.Calendar.prototype.addYears = function(count) {
+	this.cfg.setProperty("pagedate", YAHOO.widget.DateMath.add(this.cfg.getProperty("pagedate"), YAHOO.widget.DateMath.YEAR, count));
+	this.resetRenderers();
+	this.changePageEvent.fire();
+};
+
+/**
+* Subtcats the designated number of years from the current calendar, and sets the current
+* calendar page date to the new month.
+* @method subtractYears
+* @param {Number}	count	The number of years to subtract from the current calendar
+*/
+YAHOO.widget.Calendar.prototype.subtractYears = function(count) {
+	this.cfg.setProperty("pagedate", YAHOO.widget.DateMath.subtract(this.cfg.getProperty("pagedate"), YAHOO.widget.DateMath.YEAR, count));
+	this.resetRenderers();
+	this.changePageEvent.fire();
+};
+
+/**
+* Navigates to the next month page in the calendar widget.
+* @method nextMonth
+*/
+YAHOO.widget.Calendar.prototype.nextMonth = function() {
+	this.addMonths(1);
+};
+
+/**
+* Navigates to the previous month page in the calendar widget.
+* @method previousMonth
+*/
+YAHOO.widget.Calendar.prototype.previousMonth = function() {
+	this.subtractMonths(1);
+};
+
+/**
+* Navigates to the next year in the currently selected month in the calendar widget.
+* @method nextYear
+*/
+YAHOO.widget.Calendar.prototype.nextYear = function() {
+	this.addYears(1);
+};
+
+/**
+* Navigates to the previous year in the currently selected month in the calendar widget.
+* @method previousYear
+*/
+YAHOO.widget.Calendar.prototype.previousYear = function() {
+	this.subtractYears(1);
+};
+
+// END MONTH NAVIGATION METHODS
+
+// BEGIN SELECTION METHODS
+
+/**
+* Resets the calendar widget to the originally selected month and year, and
+* sets the calendar to the initial selection(s).
+* @method reset
+*/
+YAHOO.widget.Calendar.prototype.reset = function() {
+	this.cfg.resetProperty("selected");
+	this.cfg.resetProperty("pagedate");
+	this.resetEvent.fire();
+};
+
+/**
+* Clears the selected dates in the current calendar widget and sets the calendar
+* to the current month and year.
+* @method clear
+*/
+YAHOO.widget.Calendar.prototype.clear = function() {
+	this.cfg.setProperty("selected", []);
+	this.cfg.setProperty("pagedate", new Date(this.today.getTime()));
+	this.clearEvent.fire();
+};
+
+/**
+* Selects a date or a collection of dates on the current calendar. This method, by default,
+* does not call the render method explicitly. Once selection has completed, render must be
+* called for the changes to be reflected visually.
+* @method select
+* @param	{String/Date/Date[]}	date	The date string of dates to select in the current calendar. Valid formats are
+*								individual date(s) (12/24/2005,12/26/2005) or date range(s) (12/24/2005-1/1/2006).
+*								Multiple comma-delimited dates can also be passed to this method (12/24/2005,12/11/2005-12/13/2005).
+*								This method can also take a JavaScript Date object or an array of Date objects.
+* @return	{Date[]}			Array of JavaScript Date objects representing all individual dates that are currently selected.
+*/
+YAHOO.widget.Calendar.prototype.select = function(date) {
+	this.beforeSelectEvent.fire();
+
+	var selected = this.cfg.getProperty("selected");
+	var aToBeSelected = this._toFieldArray(date);
+
+	for (var a=0;a<aToBeSelected.length;++a) {
+		var toSelect = aToBeSelected[a]; // For each date item in the list of dates we're trying to select
+		if (this._indexOfSelectedFieldArray(toSelect) == -1) { // not already selected?
+			selected[selected.length]=toSelect;
+		}
+	}
+
+	if (this.parent) {
+		this.parent.cfg.setProperty("selected", selected);
+	} else {
+		this.cfg.setProperty("selected", selected);
+	}
+
+	this.selectEvent.fire(aToBeSelected);
+
+	return this.getSelectedDates();
+};
+
+/**
+* Selects a date on the current calendar by referencing the index of the cell that should be selected.
+* This method is used to easily select a single cell (usually with a mouse click) without having to do
+* a full render. The selected style is applied to the cell directly.
+* @method selectCell
+* @param	{Number}	cellIndex	The index of the cell to select in the current calendar.
+* @return	{Date[]}	Array of JavaScript Date objects representing all individual dates that are currently selected.
+*/
+YAHOO.widget.Calendar.prototype.selectCell = function(cellIndex) {
+	this.beforeSelectEvent.fire();
+
+	var selected = this.cfg.getProperty("selected");
+
+	var cell = this.cells[cellIndex];
+	var cellDate = this.cellDates[cellIndex];
+
+	var dCellDate = this._toDate(cellDate);
+
+	var selectDate = cellDate.concat();
+
+	selected[selected.length] = selectDate;
+
+	if (this.parent) {
+		this.parent.cfg.setProperty("selected", selected);
+	} else {
+		this.cfg.setProperty("selected", selected);
+	}
+
+	this.renderCellStyleSelected(dCellDate,cell);
+
+	this.selectEvent.fire([selectDate]);
+
+	this.doCellMouseOut.call(cell, null, this);
+
+	return this.getSelectedDates();
+};
+
+/**
+* Deselects a date or a collection of dates on the current calendar. This method, by default,
+* does not call the render method explicitly. Once deselection has completed, render must be
+* called for the changes to be reflected visually.
+* @method deselect
+* @param	{String/Date/Date[]}	date	The date string of dates to deselect in the current calendar. Valid formats are
+*								individual date(s) (12/24/2005,12/26/2005) or date range(s) (12/24/2005-1/1/2006).
+*								Multiple comma-delimited dates can also be passed to this method (12/24/2005,12/11/2005-12/13/2005).
+*								This method can also take a JavaScript Date object or an array of Date objects.
+* @return	{Date[]}			Array of JavaScript Date objects representing all individual dates that are currently selected.
+*/
+YAHOO.widget.Calendar.prototype.deselect = function(date) {
+	this.beforeDeselectEvent.fire();
+
+	var selected = this.cfg.getProperty("selected");
+
+	var aToBeSelected = this._toFieldArray(date);
+
+	for (var a=0;a<aToBeSelected.length;++a) {
+		var toSelect = aToBeSelected[a]; // For each date item in the list of dates we're trying to select
+		var index = this._indexOfSelectedFieldArray(toSelect);
+
+		if (index != -1) {
+			selected.splice(index,1);
+		}
+	}
+
+	if (this.parent) {
+		this.parent.cfg.setProperty("selected", selected);
+	} else {
+		this.cfg.setProperty("selected", selected);
+	}
+
+	this.deselectEvent.fire(aToBeSelected);
+
+	return this.getSelectedDates();
+};
+
+/**
+* Deselects a date on the current calendar by referencing the index of the cell that should be deselected.
+* This method is used to easily deselect a single cell (usually with a mouse click) without having to do
+* a full render. The selected style is removed from the cell directly.
+* @method deselectCell
+* @param	{Number}	cellIndex	The index of the cell to deselect in the current calendar.
+* @return	{Date[]}	Array of JavaScript Date objects representing all individual dates that are currently selected.
+*/
+YAHOO.widget.Calendar.prototype.deselectCell = function(i) {
+	this.beforeDeselectEvent.fire();
+
+	var selected = this.cfg.getProperty("selected");
+
+	var cell = this.cells[i];
+	var cellDate = this.cellDates[i];
+	var cellDateIndex = this._indexOfSelectedFieldArray(cellDate);
+
+	var dCellDate = this._toDate(cellDate);
+
+	var selectDate = cellDate.concat();
+
+	if (cellDateIndex > -1) {
+		if (this.cfg.getProperty("pagedate").getMonth() == dCellDate.getMonth() &&
+			this.cfg.getProperty("pagedate").getFullYear() == dCellDate.getFullYear()) {
+			YAHOO.util.Dom.removeClass(cell, this.Style.CSS_CELL_SELECTED);
+		}
+
+		selected.splice(cellDateIndex, 1);
+	}
+
+
+	if (this.parent) {
+		this.parent.cfg.setProperty("selected", selected);
+	} else {
+		this.cfg.setProperty("selected", selected);
+	}
+
+	this.deselectEvent.fire(selectDate);
+	return this.getSelectedDates();
+};
+
+/**
+* Deselects all dates on the current calendar.
+* @method deselectAll
+* @return {Date[]}		Array of JavaScript Date objects representing all individual dates that are currently selected.
+*						Assuming that this function executes properly, the return value should be an empty array.
+*						However, the empty array is returned for the sake of being able to check the selection status
+*						of the calendar.
+*/
+YAHOO.widget.Calendar.prototype.deselectAll = function() {
+	this.beforeDeselectEvent.fire();
+
+	var selected = this.cfg.getProperty("selected");
+	var count = selected.length;
+	var sel = selected.concat();
+
+	if (this.parent) {
+		this.parent.cfg.setProperty("selected", []);
+	} else {
+		this.cfg.setProperty("selected", []);
+	}
+
+	if (count > 0) {
+		this.deselectEvent.fire(sel);
+	}
+
+	return this.getSelectedDates();
+};
+
+// END SELECTION METHODS
+
+// BEGIN TYPE CONVERSION METHODS
+
+/**
+* Converts a date (either a JavaScript Date object, or a date string) to the internal data structure
+* used to represent dates: [[yyyy,mm,dd],[yyyy,mm,dd]].
+* @method _toFieldArray
+* @private
+* @param	{String/Date/Date[]}	date	The date string of dates to deselect in the current calendar. Valid formats are
+*								individual date(s) (12/24/2005,12/26/2005) or date range(s) (12/24/2005-1/1/2006).
+*								Multiple comma-delimited dates can also be passed to this method (12/24/2005,12/11/2005-12/13/2005).
+*								This method can also take a JavaScript Date object or an array of Date objects.
+* @return {Array[](Number[])}	Array of date field arrays
+*/
+YAHOO.widget.Calendar.prototype._toFieldArray = function(date) {
+	var returnDate = [];
+
+	if (date instanceof Date) {
+		returnDate = [[date.getFullYear(), date.getMonth()+1, date.getDate()]];
+	} else if (typeof date == 'string') {
+		returnDate = this._parseDates(date);
+	} else if (date instanceof Array) {
+		for (var i=0;i<date.length;++i) {
+			var d = date[i];
+			returnDate[returnDate.length] = [d.getFullYear(),d.getMonth()+1,d.getDate()];
+		}
+	}
+
+	return returnDate;
+};
+
+/**
+* Converts a date field array [yyyy,mm,dd] to a JavaScript Date object.
+* @method _toDate
+* @private
+* @param	{Number[]}		dateFieldArray	The date field array to convert to a JavaScript Date.
+* @return	{Date}	JavaScript Date object representing the date field array
+*/
+YAHOO.widget.Calendar.prototype._toDate = function(dateFieldArray) {
+	if (dateFieldArray instanceof Date) {
+		return dateFieldArray;
+	} else {
+		return new Date(dateFieldArray[0],dateFieldArray[1]-1,dateFieldArray[2]);
+	}
+};
+
+// END TYPE CONVERSION METHODS
+
+// BEGIN UTILITY METHODS
+
+/**
+* Converts a date field array [yyyy,mm,dd] to a JavaScript Date object.
+* @method _fieldArraysAreEqual
+* @private
+* @param	{Number[]}	array1	The first date field array to compare
+* @param	{Number[]}	array2	The first date field array to compare
+* @return	{Boolean}	The boolean that represents the equality of the two arrays
+*/
+YAHOO.widget.Calendar.prototype._fieldArraysAreEqual = function(array1, array2) {
+	var match = false;
+
+	if (array1[0]==array2[0]&&array1[1]==array2[1]&&array1[2]==array2[2]) {
+		match=true;
+	}
+
+	return match;
+};
+
+/**
+* Gets the index of a date field array [yyyy,mm,dd] in the current list of selected dates.
+* @method	_indexOfSelectedFieldArray
+* @private
+* @param	{Number[]}		find	The date field array to search for
+* @return	{Number}			The index of the date field array within the collection of selected dates.
+*								-1 will be returned if the date is not found.
+*/
+YAHOO.widget.Calendar.prototype._indexOfSelectedFieldArray = function(find) {
+	var selected = -1;
+	var seldates = this.cfg.getProperty("selected");
+
+	for (var s=0;s<seldates.length;++s) {
+		var sArray = seldates[s];
+		if (find[0]==sArray[0]&&find[1]==sArray[1]&&find[2]==sArray[2]) {
+			selected = s;
+			break;
+		}
+	}
+
+	return selected;
+};
+
+/**
+* Determines whether a given date is OOM (out of month).
+* @method	isDateOOM
+* @param	{Date}	date	The JavaScript Date object for which to check the OOM status
+* @return	{Boolean}	true if the date is OOM
+*/
+YAHOO.widget.Calendar.prototype.isDateOOM = function(date) {
+	var isOOM = false;
+	if (date.getMonth() != this.cfg.getProperty("pagedate").getMonth()) {
+		isOOM = true;
+	}
+	return isOOM;
+};
+
+// END UTILITY METHODS
+
+// BEGIN EVENT HANDLERS
+
+/**
+* Event executed before a date is selected in the calendar widget.
+* @deprecated Event handlers for this event should be susbcribed to beforeSelectEvent.
+*/
+YAHOO.widget.Calendar.prototype.onBeforeSelect = function() {
+	if (this.cfg.getProperty("MULTI_SELECT") === false) {
+		if (this.parent) {
+			this.parent.callChildFunction("clearAllBodyCellStyles", this.Style.CSS_CELL_SELECTED);
+			this.parent.deselectAll();
+		} else {
+			this.clearAllBodyCellStyles(this.Style.CSS_CELL_SELECTED);
+			this.deselectAll();
+		}
+	}
+};
+
+/**
+* Event executed when a date is selected in the calendar widget.
+* @param	{Array}	selected	An array of date field arrays representing which date or dates were selected. Example: [ [2006,8,6],[2006,8,7],[2006,8,8] ]
+* @deprecated Event handlers for this event should be susbcribed to selectEvent.
+*/
+YAHOO.widget.Calendar.prototype.onSelect = function(selected) { };
+
+/**
+* Event executed before a date is deselected in the calendar widget.
+* @deprecated Event handlers for this event should be susbcribed to beforeDeselectEvent.
+*/
+YAHOO.widget.Calendar.prototype.onBeforeDeselect = function() { };
+
+/**
+* Event executed when a date is deselected in the calendar widget.
+* @param	{Array}	selected	An array of date field arrays representing which date or dates were deselected. Example: [ [2006,8,6],[2006,8,7],[2006,8,8] ]
+* @deprecated Event handlers for this event should be susbcribed to deselectEvent.
+*/
+YAHOO.widget.Calendar.prototype.onDeselect = function(deselected) { };
+
+/**
+* Event executed when the user navigates to a different calendar page.
+* @deprecated Event handlers for this event should be susbcribed to changePageEvent.
+*/
+YAHOO.widget.Calendar.prototype.onChangePage = function() {
+	this.render();
+};
+
+/**
+* Event executed when the calendar widget is rendered.
+* @deprecated Event handlers for this event should be susbcribed to renderEvent.
+*/
+YAHOO.widget.Calendar.prototype.onRender = function() { };
+
+/**
+* Event executed when the calendar widget is reset to its original state.
+* @deprecated Event handlers for this event should be susbcribed to resetEvemt.
+*/
+YAHOO.widget.Calendar.prototype.onReset = function() { this.render(); };
+
+/**
+* Event executed when the calendar widget is completely cleared to the current month with no selections.
+* @deprecated Event handlers for this event should be susbcribed to clearEvent.
+*/
+YAHOO.widget.Calendar.prototype.onClear = function() { this.render(); };
+
+/**
+* Validates the calendar widget. This method has no default implementation
+* and must be extended by subclassing the widget.
+* @return	Should return true if the widget validates, and false if
+* it doesn't.
+* @type Boolean
+*/
+YAHOO.widget.Calendar.prototype.validate = function() { return true; };
+
+// END EVENT HANDLERS
+
+// BEGIN DATE PARSE METHODS
+
+/**
+* Converts a date string to a date field array
+* @private
+* @param	{String}	sDate			Date string. Valid formats are mm/dd and mm/dd/yyyy.
+* @return				A date field array representing the string passed to the method
+* @type Array[](Number[])
+*/
+YAHOO.widget.Calendar.prototype._parseDate = function(sDate) {
+	var aDate = sDate.split(this.Locale.DATE_FIELD_DELIMITER);
+	var rArray;
+
+	if (aDate.length == 2) {
+		rArray = [aDate[this.Locale.MD_MONTH_POSITION-1],aDate[this.Locale.MD_DAY_POSITION-1]];
+		rArray.type = YAHOO.widget.Calendar.MONTH_DAY;
+	} else {
+		rArray = [aDate[this.Locale.MDY_YEAR_POSITION-1],aDate[this.Locale.MDY_MONTH_POSITION-1],aDate[this.Locale.MDY_DAY_POSITION-1]];
+		rArray.type = YAHOO.widget.Calendar.DATE;
+	}
+
+	for (var i=0;i<rArray.length;i++) {
+		rArray[i] = parseInt(rArray[i], 10);
+	}
+
+	return rArray;
+};
+
+/**
+* Converts a multi or single-date string to an array of date field arrays
+* @private
+* @param	{String}	sDates		Date string with one or more comma-delimited dates. Valid formats are mm/dd, mm/dd/yyyy, mm/dd/yyyy-mm/dd/yyyy
+* @return							An array of date field arrays
+* @type Array[](Number[])
+*/
+YAHOO.widget.Calendar.prototype._parseDates = function(sDates) {
+	var aReturn = [];
+
+	var aDates = sDates.split(this.Locale.DATE_DELIMITER);
+
+	for (var d=0;d<aDates.length;++d) {
+		var sDate = aDates[d];
+
+		if (sDate.indexOf(this.Locale.DATE_RANGE_DELIMITER) != -1) {
+			// This is a range
+			var aRange = sDate.split(this.Locale.DATE_RANGE_DELIMITER);
+
+			var dateStart = this._parseDate(aRange[0]);
+			var dateEnd = this._parseDate(aRange[1]);
+
+			var fullRange = this._parseRange(dateStart, dateEnd);
+			aReturn = aReturn.concat(fullRange);
+		} else {
+			// This is not a range
+			var aDate = this._parseDate(sDate);
+			aReturn.push(aDate);
+		}
+	}
+	return aReturn;
+};
+
+/**
+* Converts a date range to the full list of included dates
+* @private
+* @param	{Number[]}	startDate	Date field array representing the first date in the range
+* @param	{Number[]}	endDate		Date field array representing the last date in the range
+* @return							An array of date field arrays
+* @type Array[](Number[])
+*/
+YAHOO.widget.Calendar.prototype._parseRange = function(startDate, endDate) {
+	var dStart   = new Date(startDate[0],startDate[1]-1,startDate[2]);
+	var dCurrent = YAHOO.widget.DateMath.add(new Date(startDate[0],startDate[1]-1,startDate[2]),YAHOO.widget.DateMath.DAY,1);
+	var dEnd     = new Date(endDate[0],  endDate[1]-1,  endDate[2]);
+
+	var results = [];
+	results.push(startDate);
+	while (dCurrent.getTime() <= dEnd.getTime()) {
+		results.push([dCurrent.getFullYear(),dCurrent.getMonth()+1,dCurrent.getDate()]);
+		dCurrent = YAHOO.widget.DateMath.add(dCurrent,YAHOO.widget.DateMath.DAY,1);
+	}
+	return results;
+};
+
+// END DATE PARSE METHODS
+
+// BEGIN RENDERER METHODS
+
+/**
+* Resets the render stack of the current calendar to its original pre-render value.
+*/
+YAHOO.widget.Calendar.prototype.resetRenderers = function() {
+	this.renderStack = this._renderStack.concat();
+};
+
+/**
+* Clears the inner HTML, CSS class and style information from the specified cell.
+* @method clearElement
+* @param	{HTMLTableCellElement}	The cell to clear
+*/
+YAHOO.widget.Calendar.prototype.clearElement = function(cell) {
+	cell.innerHTML = "&#160;";
+	cell.className="";
+};
+
+/**
+* Adds a renderer to the render stack. The function reference passed to this method will be executed
+* when a date cell matches the conditions specified in the date string for this renderer.
+* @method addRenderer
+* @param	{String}	sDates		A date string to associate with the specified renderer. Valid formats
+*									include date (12/24/2005), month/day (12/24), and range (12/1/2004-1/1/2005)
+* @param	{Function}	fnRender	The function executed to render cells that match the render rules for this renderer.
+*/
+YAHOO.widget.Calendar.prototype.addRenderer = function(sDates, fnRender) {
+	var aDates = this._parseDates(sDates);
+	for (var i=0;i<aDates.length;++i) {
+		var aDate = aDates[i];
+
+		if (aDate.length == 2) { // this is either a range or a month/day combo
+			if (aDate[0] instanceof Array) { // this is a range
+				this._addRenderer(YAHOO.widget.Calendar.RANGE,aDate,fnRender);
+			} else { // this is a month/day combo
+				this._addRenderer(YAHOO.widget.Calendar.MONTH_DAY,aDate,fnRender);
+			}
+		} else if (aDate.length == 3) {
+			this._addRenderer(YAHOO.widget.Calendar.DATE,aDate,fnRender);
+		}
+	}
+};
+
+/**
+* The private method used for adding cell renderers to the local render stack.
+* This method is called by other methods that set the renderer type prior to the method call.
+* @method _addRenderer
+* @private
+* @param	{String}	type		The type string that indicates the type of date renderer being added.
+*									Values are YAHOO.widget.Calendar.DATE, YAHOO.widget.Calendar.MONTH_DAY, YAHOO.widget.Calendar.WEEKDAY,
+*									YAHOO.widget.Calendar.RANGE, YAHOO.widget.Calendar.MONTH
+* @param	{Array}		aDates		An array of dates used to construct the renderer. The format varies based
+*									on the renderer type
+* @param	{Function}	fnRender	The function executed to render cells that match the render rules for this renderer.
+*/
+YAHOO.widget.Calendar.prototype._addRenderer = function(type, aDates, fnRender) {
+	var add = [type,aDates,fnRender];
+	this.renderStack.unshift(add);
+	this._renderStack = this.renderStack.concat();
+};
+
+/**
+* Adds a month to the render stack. The function reference passed to this method will be executed
+* when a date cell matches the month passed to this method.
+* @method addMonthRenderer
+* @param	{Number}	month		The month (1-12) to associate with this renderer
+* @param	{Function}	fnRender	The function executed to render cells that match the render rules for this renderer.
+*/
+YAHOO.widget.Calendar.prototype.addMonthRenderer = function(month, fnRender) {
+	this._addRenderer(YAHOO.widget.Calendar.MONTH,[month],fnRender);
+};
+
+/**
+* Adds a weekday to the render stack. The function reference passed to this method will be executed
+* when a date cell matches the weekday passed to this method.
+* @method addWeekdayRenderer
+* @param	{Number}	weekday		The weekday (0-6) to associate with this renderer
+* @param	{Function}	fnRender	The function executed to render cells that match the render rules for this renderer.
+*/
+YAHOO.widget.Calendar.prototype.addWeekdayRenderer = function(weekday, fnRender) {
+	this._addRenderer(YAHOO.widget.Calendar.WEEKDAY,[weekday],fnRender);
+};
+
+// END RENDERER METHODS
+
+// BEGIN CSS METHODS
+
+/**
+* Removes all styles from all body cells in the current calendar table.
+* @method clearAllBodyCellStyles
+* @param	{style}		The CSS class name to remove from all calendar body cells
+*/
+YAHOO.widget.Calendar.prototype.clearAllBodyCellStyles = function(style) {
+	for (var c=0;c<this.cells.length;++c) {
+		YAHOO.util.Dom.removeClass(this.cells[c],style);
+	}
+};
+
+// END CSS METHODS
+
+// BEGIN GETTER/SETTER METHODS
+/**
+* Sets the calendar's month explicitly
+* @method setMonth
+* @param {Number}	month		The numeric month, from 0 (January) to 11 (December)
+*/
+YAHOO.widget.Calendar.prototype.setMonth = function(month) {
+	var current = this.cfg.getProperty("pagedate");
+	current.setMonth(month);
+	this.cfg.setProperty("pagedate", current);
+};
+
+/**
+* Sets the calendar's year explicitly.
+* @method setYear
+* @param {Number}	year		The numeric 4-digit year
+*/
+YAHOO.widget.Calendar.prototype.setYear = function(year) {
+	var current = this.cfg.getProperty("pagedate");
+	current.setFullYear(year);
+	this.cfg.setProperty("pagedate", current);
+};
+
+/**
+* Gets the list of currently selected dates from the calendar.
+* @method getSelectedDates
+* @return {Date[]} An array of currently selected JavaScript Date objects.
+*/
+YAHOO.widget.Calendar.prototype.getSelectedDates = function() {
+	var returnDates = [];
+	var selected = this.cfg.getProperty("selected");
+
+	for (var d=0;d<selected.length;++d) {
+		var dateArray = selected[d];
+
+		var date = new Date(dateArray[0],dateArray[1]-1,dateArray[2]);
+		returnDates.push(date);
+	}
+
+	returnDates.sort( function(a,b) { return a-b; } );
+	return returnDates;
+};
+
+/// END GETTER/SETTER METHODS ///
+
+/**
+* Hides the Calendar's outer container from view.
+* @method hide
+*/
+YAHOO.widget.Calendar.prototype.hide = function() {
+	this.oDomContainer.style.display = "none";
+};
+
+/**
+* Shows the Calendar's outer container.
+* @method show
+*/
+YAHOO.widget.Calendar.prototype.show = function() {
+	this.oDomContainer.style.display = "block";
+};
+
+/**
+* Returns a string representing the current browser.
+* @property browser
+* @type String
+*/
+YAHOO.widget.Calendar.prototype.browser = function() {
+			var ua = navigator.userAgent.toLowerCase();
+				  if (ua.indexOf('opera')!=-1) { // Opera (check first in case of spoof)
+					 return 'opera';
+				  } else if (ua.indexOf('msie 7')!=-1) { // IE7
+					 return 'ie7';
+				  } else if (ua.indexOf('msie') !=-1) { // IE
+					 return 'ie';
+				  } else if (ua.indexOf('safari')!=-1) { // Safari (check before Gecko because it includes "like Gecko")
+					 return 'safari';
+				  } else if (ua.indexOf('gecko') != -1) { // Gecko
+					 return 'gecko';
+				  } else {
+					 return false;
+				  }
+			}();
+/**
+* Returns a string representation of the object.
+* @method toString
+* @return {String}	A string representation of the Calendar object.
+*/
+YAHOO.widget.Calendar.prototype.toString = function() {
+	return "Calendar " + this.id;
+};
+
+/**
+* @namespace YAHOO.widget
+* @class Calendar_Core
+* @extends YAHOO.widget.Calendar
+* @deprecated The old Calendar_Core class is no longer necessary.
+*/
+YAHOO.widget.Calendar_Core = YAHOO.widget.Calendar;
+
+YAHOO.widget.Cal_Core = YAHOO.widget.Calendar;
+
+/**
+* YAHOO.widget.CalendarGroup is a special container class for YAHOO.widget.Calendar. This class facilitates
+* the ability to have multi-page calendar views that share a single dataset and are
+* dependent on each other.
+*
+* The calendar group instance will refer to each of its elements using a 0-based index.
+* For example, to construct the placeholder for a calendar group widget with id "cal1" and
+* containerId of "cal1Container", the markup would be as follows:
+*	<xmp>
+*		<div id="cal1Container_0"></div>
+*		<div id="cal1Container_1"></div>
+*	</xmp>
+* The tables for the calendars ("cal1_0" and "cal1_1") will be inserted into those containers.
+* @namespace YAHOO.widget
+* @class CalendarGroup
+* @constructor
+* @param {String}	id			The id of the table element that will represent the calendar widget
+* @param {String}	containerId	The id of the container div element that will wrap the calendar table
+* @param {Object}	config		The configuration object containing the Calendar's arguments
+*/
+YAHOO.widget.CalendarGroup = function(id, containerId, config) {
+	if (arguments.length > 0) {
+		this.init(id, containerId, config);
+	}
+};
+
+/**
+* Initializes the calendar group. All subclasses must call this method in order for the
+* group to be initialized properly.
+* @method init
+* @param {String}	id			The id of the table element that will represent the calendar widget
+* @param {String}	containerId	The id of the container div element that will wrap the calendar table
+* @param {Object}	config		The configuration object containing the Calendar's arguments
+*/
+YAHOO.widget.CalendarGroup.prototype.init = function(id, containerId, config) {
+	this.initEvents();
+	this.initStyles();
+
+	/**
+	* The collection of Calendar pages contained within the CalendarGroup
+	* @property pages
+	* @type YAHOO.widget.Calendar[]
+	*/
+	this.pages = [];
+
+	/**
+	* The unique id associated with the CalendarGroup
+	* @property id
+	* @type String
+	*/
+	this.id = id;
+
+	/**
+	* The unique id associated with the CalendarGroup container
+	* @property containerId
+	* @type String
+	*/
+	this.containerId = containerId;
+
+	/**
+	* The outer containing element for the CalendarGroup
+	* @property oDomContainer
+	* @type HTMLElement
+	*/
+	this.oDomContainer = document.getElementById(containerId);
+
+	YAHOO.util.Dom.addClass(this.oDomContainer, YAHOO.widget.CalendarGroup.CSS_CONTAINER);
+	YAHOO.util.Dom.addClass(this.oDomContainer, YAHOO.widget.CalendarGroup.CSS_MULTI_UP);
+
+	/**
+	* The Config object used to hold the configuration variables for the CalendarGroup
+	* @property cfg
+	* @type YAHOO.util.Config
+	*/
+	this.cfg = new YAHOO.util.Config(this);
+
+	/**
+	* The local object which contains the CalendarGroup's options
+	* @property Options
+	* @type Object
+	*/
+	this.Options = {};
+
+	/**
+	* The local object which contains the CalendarGroup's locale settings
+	* @property Locale
+	* @type Object
+	*/
+	this.Locale = {};
+
+	this.setupConfig();
+
+	if (config) {
+		this.cfg.applyConfig(config, true);
+	}
+
+	this.cfg.fireQueue();
+
+	// OPERA HACK FOR MISWRAPPED FLOATS
+	if (this.browser == "opera"){
+		var fixWidth = function() {
+			var startW = this.oDomContainer.offsetWidth;
+			var w = 0;
+			for (var p=0;p<this.pages.length;++p) {
+				var cal = this.pages[p];
+				w += cal.oDomContainer.offsetWidth;
+			}
+			if (w > 0) {
+				this.oDomContainer.style.width = w + "px";
+			}
+		};
+		this.renderEvent.subscribe(fixWidth,this,true);
+	}
+};
+
+
+YAHOO.widget.CalendarGroup.prototype.setupConfig = function() {
+	/**
+	* The number of pages to include in the CalendarGroup. This value can only be set once, in the CalendarGroup's constructor arguments.
+	* @config pages
+	* @type Number
+	* @default 2
+	*/
+	this.cfg.addProperty("pages", { value:2, validator:this.cfg.checkNumber, handler:this.configPages } );
+
+	/**
+	* The month/year representing the current visible Calendar date (mm/yyyy)
+	* @config pagedate
+	* @type String
+	* @default today's date
+	*/
+	this.cfg.addProperty("pagedate", { value:new Date(), handler:this.configPageDate } );
+
+	/**
+	* The date or range of dates representing the current Calendar selection
+	* @config selected
+	* @type String
+	* @default []
+	*/
+	this.cfg.addProperty("selected", { value:[], handler:this.delegateConfig } );
+
+	/**
+	* The title to display above the CalendarGroup's month header
+	* @config title
+	* @type String
+	* @default ""
+	*/
+	this.cfg.addProperty("title", { value:"", handler:this.configTitle } );
+
+	/**
+	* Whether or not a close button should be displayed for this CalendarGroup
+	* @config close
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("close", { value:false, handler:this.configClose } );
+
+	/**
+	* Whether or not an iframe shim should be placed under the Calendar to prevent select boxes from bleeding through in Internet Explorer 6 and below.
+	* @config iframe
+	* @type Boolean
+	* @default true
+	*/
+	this.cfg.addProperty("iframe", { value:true, handler:this.delegateConfig, validator:this.cfg.checkBoolean } );
+
+	/**
+	* The minimum selectable date in the current Calendar (mm/dd/yyyy)
+	* @config mindate
+	* @type String
+	* @default null
+	*/
+	this.cfg.addProperty("mindate", { value:null, handler:this.delegateConfig } );
+
+	/**
+	* The maximum selectable date in the current Calendar (mm/dd/yyyy)
+	* @config maxdate
+	* @type String
+	* @default null
+	*/
+	this.cfg.addProperty("maxdate", { value:null, handler:this.delegateConfig  } );
+
+	// Options properties
+
+	/**
+	* True if the Calendar should allow multiple selections. False by default.
+	* @config MULTI_SELECT
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("MULTI_SELECT",	{ value:false, handler:this.delegateConfig, validator:this.cfg.checkBoolean } );
+
+	/**
+	* The weekday the week begins on. Default is 0 (Sunday).
+	* @config START_WEEKDAY
+	* @type number
+	* @default 0
+	*/
+	this.cfg.addProperty("START_WEEKDAY",	{ value:0, handler:this.delegateConfig, validator:this.cfg.checkNumber  } );
+
+	/**
+	* True if the Calendar should show weekday labels. True by default.
+	* @config SHOW_WEEKDAYS
+	* @type Boolean
+	* @default true
+	*/
+	this.cfg.addProperty("SHOW_WEEKDAYS",	{ value:true, handler:this.delegateConfig, validator:this.cfg.checkBoolean } );
+
+	/**
+	* True if the Calendar should show week row headers. False by default.
+	* @config SHOW_WEEK_HEADER
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("SHOW_WEEK_HEADER",{ value:false, handler:this.delegateConfig, validator:this.cfg.checkBoolean } );
+
+	/**
+	* True if the Calendar should show week row footers. False by default.
+	* @config SHOW_WEEK_FOOTER
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("SHOW_WEEK_FOOTER",{ value:false, handler:this.delegateConfig, validator:this.cfg.checkBoolean } );
+
+	/**
+	* True if the Calendar should suppress weeks that are not a part of the current month. False by default.
+	* @config HIDE_BLANK_WEEKS
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("HIDE_BLANK_WEEKS",{ value:false, handler:this.delegateConfig, validator:this.cfg.checkBoolean } );
+
+	/**
+	* The image that should be used for the left navigation arrow.
+	* @config NAV_ARROW_LEFT
+	* @type String
+	* @default YAHOO.widget.Calendar.IMG_ROOT + "us/tr/callt.gif"
+	*/
+	this.cfg.addProperty("NAV_ARROW_LEFT",	{ value:YAHOO.widget.Calendar.IMG_ROOT + "us/tr/callt.gif", handler:this.delegateConfig } );
+
+	/**
+	* The image that should be used for the left navigation arrow.
+	* @config NAV_ARROW_RIGHT
+	* @type String
+	* @default YAHOO.widget.Calendar.IMG_ROOT + "us/tr/calrt.gif"
+	*/
+	this.cfg.addProperty("NAV_ARROW_RIGHT",	{ value:YAHOO.widget.Calendar.IMG_ROOT + "us/tr/calrt.gif", handler:this.delegateConfig } );
+
+	// Locale properties
+
+	/**
+	* The short month labels for the current locale.
+	* @config MONTHS_SHORT
+	* @type String[]
+	* @default ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
+	*/
+	this.cfg.addProperty("MONTHS_SHORT",	{ value:["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"], handler:this.delegateConfig } );
+
+	/**
+	* The long month labels for the current locale.
+	* @config MONTHS_LONG
+	* @type String[]
+	* @default ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"
+	*/
+	this.cfg.addProperty("MONTHS_LONG",		{ value:["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"], handler:this.delegateConfig } );
+
+	/**
+	* The 1-character weekday labels for the current locale.
+	* @config WEEKDAYS_1CHAR
+	* @type String[]
+	* @default ["S", "M", "T", "W", "T", "F", "S"]
+	*/
+	this.cfg.addProperty("WEEKDAYS_1CHAR",	{ value:["S", "M", "T", "W", "T", "F", "S"], handler:this.delegateConfig } );
+
+	/**
+	* The short weekday labels for the current locale.
+	* @config WEEKDAYS_SHORT
+	* @type String[]
+	* @default ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]
+	*/
+	this.cfg.addProperty("WEEKDAYS_SHORT",	{ value:["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], handler:this.delegateConfig } );
+
+	/**
+	* The medium weekday labels for the current locale.
+	* @config WEEKDAYS_MEDIUM
+	* @type String[]
+	* @default ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]
+	*/
+	this.cfg.addProperty("WEEKDAYS_MEDIUM",	{ value:["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], handler:this.delegateConfig } );
+
+	/**
+	* The long weekday labels for the current locale.
+	* @config WEEKDAYS_LONG
+	* @type String[]
+	* @default ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]
+	*/
+	this.cfg.addProperty("WEEKDAYS_LONG",	{ value:["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], handler:this.delegateConfig } );
+
+	/**
+	* The setting that determines which length of month labels should be used. Possible values are "short" and "long".
+	* @config LOCALE_MONTHS
+	* @type String
+	* @default "long"
+	*/
+	this.cfg.addProperty("LOCALE_MONTHS",	{ value:"long", handler:this.delegateConfig } );
+
+	/**
+	* The setting that determines which length of weekday labels should be used. Possible values are "1char", "short", "medium", and "long".
+	* @config LOCALE_WEEKDAYS
+	* @type String
+	* @default "short"
+	*/
+	this.cfg.addProperty("LOCALE_WEEKDAYS",	{ value:"short", handler:this.delegateConfig } );
+
+	/**
+	* The value used to delimit individual dates in a date string passed to various Calendar functions.
+	* @config DATE_DELIMITER
+	* @type String
+	* @default ","
+	*/
+	this.cfg.addProperty("DATE_DELIMITER",		{ value:",", handler:this.delegateConfig } );
+
+	/**
+	* The value used to delimit date fields in a date string passed to various Calendar functions.
+	* @config DATE_FIELD_DELIMITER
+	* @type String
+	* @default "/"
+	*/
+	this.cfg.addProperty("DATE_FIELD_DELIMITER",{ value:"/", handler:this.delegateConfig } );
+
+	/**
+	* The value used to delimit date ranges in a date string passed to various Calendar functions.
+	* @config DATE_RANGE_DELIMITER
+	* @type String
+	* @default "-"
+	*/
+	this.cfg.addProperty("DATE_RANGE_DELIMITER",{ value:"-", handler:this.delegateConfig } );
+
+	/**
+	* The position of the month in a month/year date string
+	* @config MY_MONTH_POSITION
+	* @type Number
+	* @default 1
+	*/
+	this.cfg.addProperty("MY_MONTH_POSITION",	{ value:1, handler:this.delegateConfig, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the year in a month/year date string
+	* @config MY_YEAR_POSITION
+	* @type Number
+	* @default 2
+	*/
+	this.cfg.addProperty("MY_YEAR_POSITION",	{ value:2, handler:this.delegateConfig, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the month in a month/day date string
+	* @config MD_MONTH_POSITION
+	* @type Number
+	* @default 1
+	*/
+	this.cfg.addProperty("MD_MONTH_POSITION",	{ value:1, handler:this.delegateConfig, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the day in a month/year date string
+	* @config MD_DAY_POSITION
+	* @type Number
+	* @default 2
+	*/
+	this.cfg.addProperty("MD_DAY_POSITION",		{ value:2, handler:this.delegateConfig, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the month in a month/day/year date string
+	* @config MDY_MONTH_POSITION
+	* @type Number
+	* @default 1
+	*/
+	this.cfg.addProperty("MDY_MONTH_POSITION",	{ value:1, handler:this.delegateConfig, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the day in a month/day/year date string
+	* @config MDY_DAY_POSITION
+	* @type Number
+	* @default 2
+	*/
+	this.cfg.addProperty("MDY_DAY_POSITION",	{ value:2, handler:this.delegateConfig, validator:this.cfg.checkNumber } );
+
+	/**
+	* The position of the year in a month/day/year date string
+	* @config MDY_YEAR_POSITION
+	* @type Number
+	* @default 3
+	*/
+	this.cfg.addProperty("MDY_YEAR_POSITION",	{ value:3, handler:this.delegateConfig, validator:this.cfg.checkNumber } );
+
+};
+
+/**
+* Initializes CalendarGroup's built-in CustomEvents
+* @method initEvents
+*/
+YAHOO.widget.CalendarGroup.prototype.initEvents = function() {
+	var me = this;
+
+	/**
+	* Proxy subscriber to subscribe to the CalendarGroup's child Calendars' CustomEvents
+	* @method sub
+	* @private
+	* @param {Function} fn	The function to subscribe to this CustomEvent
+	* @param {Object}	obj	The CustomEvent's scope object
+	* @param {Boolean}	bOverride	Whether or not to apply scope correction
+	*/
+	var sub = function(fn, obj, bOverride) {
+		for (var p=0;p<me.pages.length;++p) {
+			var cal = me.pages[p];
+			cal[this.type + "Event"].subscribe(fn, obj, bOverride);
+		}
+	};
+
+	/**
+	* Proxy unsubscriber to unsubscribe from the CalendarGroup's child Calendars' CustomEvents
+	* @method unsub
+	* @private
+	* @param {Function} fn	The function to subscribe to this CustomEvent
+	* @param {Object}	obj	The CustomEvent's scope object
+	*/
+	var unsub = function(fn, obj) {
+		for (var p=0;p<me.pages.length;++p) {
+			var cal = me.pages[p];
+			cal[this.type + "Event"].unsubscribe(fn, obj);
+		}
+	};
+
+	/**
+	* Fired before a selection is made
+	* @event beforeSelectEvent
+	*/
+	this.beforeSelectEvent = new YAHOO.util.CustomEvent("beforeSelect");
+	this.beforeSelectEvent.subscribe = sub; this.beforeSelectEvent.unsubscribe = unsub;
+
+	/**
+	* Fired when a selection is made
+	* @event selectEvent
+	* @param {Array}	Array of Date field arrays in the format [YYYY, MM, DD].
+	*/
+	this.selectEvent = new YAHOO.util.CustomEvent("select");
+	this.selectEvent.subscribe = sub; this.selectEvent.unsubscribe = unsub;
+
+	/**
+	* Fired before a selection is made
+	* @event beforeDeselectEvent
+	*/
+	this.beforeDeselectEvent = new YAHOO.util.CustomEvent("beforeDeselect");
+	this.beforeDeselectEvent.subscribe = sub; this.beforeDeselectEvent.unsubscribe = unsub;
+
+	/**
+	* Fired when a selection is made
+	* @event deselectEvent
+	* @param {Array}	Array of Date field arrays in the format [YYYY, MM, DD].
+	*/
+	this.deselectEvent = new YAHOO.util.CustomEvent("deselect");
+	this.deselectEvent.subscribe = sub; this.deselectEvent.unsubscribe = unsub;
+
+	/**
+	* Fired when the Calendar page is changed
+	* @event changePageEvent
+	*/
+	this.changePageEvent = new YAHOO.util.CustomEvent("changePage");
+	this.changePageEvent.subscribe = sub; this.changePageEvent.unsubscribe = unsub;
+
+	/**
+	* Fired before the Calendar is rendered
+	* @event beforeRenderEvent
+	*/
+	this.beforeRenderEvent = new YAHOO.util.CustomEvent("beforeRender");
+	this.beforeRenderEvent.subscribe = sub; this.beforeRenderEvent.unsubscribe = unsub;
+
+	/**
+	* Fired when the Calendar is rendered
+	* @event renderEvent
+	*/
+	this.renderEvent = new YAHOO.util.CustomEvent("render");
+	this.renderEvent.subscribe = sub; this.renderEvent.unsubscribe = unsub;
+
+	/**
+	* Fired when the Calendar is reset
+	* @event resetEvent
+	*/
+	this.resetEvent = new YAHOO.util.CustomEvent("reset");
+	this.resetEvent.subscribe = sub; this.resetEvent.unsubscribe = unsub;
+
+	/**
+	* Fired when the Calendar is cleared
+	* @event clearEvent
+	*/
+	this.clearEvent = new YAHOO.util.CustomEvent("clear");
+	this.clearEvent.subscribe = sub; this.clearEvent.unsubscribe = unsub;
+
+};
+
+/**
+* The default Config handler for the "pages" property
+* @method configPages
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.CalendarGroup.prototype.configPages = function(type, args, obj) {
+	var pageCount = args[0];
+
+	for (var p=0;p<pageCount;++p) {
+		var calId = this.id + "_" + p;
+		var calContainerId = this.containerId + "_" + p;
+
+		var childConfig = this.cfg.getConfig();
+		childConfig.close = false;
+		childConfig.title = false;
+
+		var cal = this.constructChild(calId, calContainerId, childConfig);
+		var caldate = cal.cfg.getProperty("pagedate");
+		caldate.setMonth(caldate.getMonth()+p);
+		cal.cfg.setProperty("pagedate", caldate);
+
+		YAHOO.util.Dom.removeClass(cal.oDomContainer, this.Style.CSS_SINGLE);
+		YAHOO.util.Dom.addClass(cal.oDomContainer, "groupcal");
+
+		if (p===0) {
+			YAHOO.util.Dom.addClass(cal.oDomContainer, "first");
+		}
+
+		if (p==(pageCount-1)) {
+			YAHOO.util.Dom.addClass(cal.oDomContainer, "last");
+		}
+
+		cal.parent = this;
+		cal.index = p;
+
+		this.pages[this.pages.length] = cal;
+	}
+};
+
+/**
+* The default Config handler for the "pagedate" property
+* @method configPageDate
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.CalendarGroup.prototype.configPageDate = function(type, args, obj) {
+	var val = args[0];
+
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.cfg.setProperty("pagedate", val);
+		var calDate = cal.cfg.getProperty("pagedate");
+		calDate.setMonth(calDate.getMonth()+p);
+	}
+};
+
+/**
+* Delegates a configuration property to the CustomEvents associated with the CalendarGroup's children
+* @method delegateConfig
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.CalendarGroup.prototype.delegateConfig = function(type, args, obj) {
+	var val = args[0];
+	var cal;
+
+	for (var p=0;p<this.pages.length;p++) {
+		cal = this.pages[p];
+		cal.cfg.setProperty(type, val);
+	}
+};
+
+
+/**
+* Adds a function to all child Calendars within this CalendarGroup.
+* @method setChildFunction
+* @param {String}		fnName		The name of the function
+* @param {Function}		fn			The function to apply to each Calendar page object
+*/
+YAHOO.widget.CalendarGroup.prototype.setChildFunction = function(fnName, fn) {
+	var pageCount = this.cfg.getProperty("pages");
+
+	for (var p=0;p<pageCount;++p) {
+		this.pages[p][fnName] = fn;
+	}
+};
+
+/**
+* Calls a function within all child Calendars within this CalendarGroup.
+* @method callChildFunction
+* @param {String}		fnName		The name of the function
+* @param {Array}		args		The arguments to pass to the function
+*/
+YAHOO.widget.CalendarGroup.prototype.callChildFunction = function(fnName, args) {
+	var pageCount = this.cfg.getProperty("pages");
+
+	for (var p=0;p<pageCount;++p) {
+		var page = this.pages[p];
+		if (page[fnName]) {
+			var fn = page[fnName];
+			fn.call(page, args);
+		}
+	}
+};
+
+/**
+* Constructs a child calendar. This method can be overridden if a subclassed version of the default
+* calendar is to be used.
+* @method constructChild
+* @param {String}	id			The id of the table element that will represent the calendar widget
+* @param {String}	containerId	The id of the container div element that will wrap the calendar table
+* @param {Object}	config		The configuration object containing the Calendar's arguments
+* @return {YAHOO.widget.Calendar}	The YAHOO.widget.Calendar instance that is constructed
+*/
+YAHOO.widget.CalendarGroup.prototype.constructChild = function(id,containerId,config) {
+	var container = document.getElementById(containerId);
+	if (! container) {
+		container = document.createElement("div");
+		container.id = containerId;
+		this.oDomContainer.appendChild(container);
+	}
+	return new YAHOO.widget.Calendar(id,containerId,config);
+};
+
+
+/**
+* Sets the calendar group's month explicitly. This month will be set into the first
+* @method setMonth
+* page of the multi-page calendar, and all other months will be iterated appropriately.
+* @param {Number}	month		The numeric month, from 0 (January) to 11 (December)
+*/
+YAHOO.widget.CalendarGroup.prototype.setMonth = function(month) {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.setMonth(month+p);
+	}
+};
+
+/**
+* Sets the calendar group's year explicitly. This year will be set into the first
+* @method setYear
+* page of the multi-page calendar, and all other months will be iterated appropriately.
+* @param {Number}	year		The numeric 4-digit year
+*/
+YAHOO.widget.CalendarGroup.prototype.setYear = function(year) {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		var pageDate = cal.cfg.getProperty("pageDate");
+
+		if ((pageDate.getMonth()+1) == 1 && p>0) {
+			year+=1;
+		}
+		cal.setYear(year);
+	}
+};
+/**
+* Calls the render function of all child calendars within the group.
+* @method render
+*/
+YAHOO.widget.CalendarGroup.prototype.render = function() {
+	this.renderHeader();
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.render();
+	}
+	this.renderFooter();
+};
+
+/**
+* Selects a date or a collection of dates on the current calendar. This method, by default,
+* does not call the render method explicitly. Once selection has completed, render must be
+* called for the changes to be reflected visually.
+* @method select
+* @param	{String/Date/Date[]}	date	The date string of dates to select in the current calendar. Valid formats are
+*								individual date(s) (12/24/2005,12/26/2005) or date range(s) (12/24/2005-1/1/2006).
+*								Multiple comma-delimited dates can also be passed to this method (12/24/2005,12/11/2005-12/13/2005).
+*								This method can also take a JavaScript Date object or an array of Date objects.
+* @return	{Date[]}			Array of JavaScript Date objects representing all individual dates that are currently selected.
+*/
+YAHOO.widget.CalendarGroup.prototype.select = function(date) {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.select(date);
+	}
+	return this.getSelectedDates();
+};
+
+/**
+* Selects a date on the current calendar by referencing the index of the cell that should be selected.
+* This method is used to easily select a single cell (usually with a mouse click) without having to do
+* a full render. The selected style is applied to the cell directly.
+* @method selectCell
+* @param	{Number}	cellIndex	The index of the cell to select in the current calendar.
+* @return	{Date[]}	Array of JavaScript Date objects representing all individual dates that are currently selected.
+*/
+YAHOO.widget.CalendarGroup.prototype.selectCell = function(cellIndex) {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.selectCell(cellIndex);
+	}
+	return this.getSelectedDates();
+};
+
+/**
+* Deselects a date or a collection of dates on the current calendar. This method, by default,
+* does not call the render method explicitly. Once deselection has completed, render must be
+* called for the changes to be reflected visually.
+* @method deselect
+* @param	{String/Date/Date[]}	date	The date string of dates to deselect in the current calendar. Valid formats are
+*								individual date(s) (12/24/2005,12/26/2005) or date range(s) (12/24/2005-1/1/2006).
+*								Multiple comma-delimited dates can also be passed to this method (12/24/2005,12/11/2005-12/13/2005).
+*								This method can also take a JavaScript Date object or an array of Date objects.
+* @return	{Date[]}			Array of JavaScript Date objects representing all individual dates that are currently selected.
+*/
+YAHOO.widget.CalendarGroup.prototype.deselect = function(date) {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.deselect(date);
+	}
+	return this.getSelectedDates();
+};
+
+/**
+* Deselects all dates on the current calendar.
+* @method deselectAll
+* @return {Date[]}		Array of JavaScript Date objects representing all individual dates that are currently selected.
+*						Assuming that this function executes properly, the return value should be an empty array.
+*						However, the empty array is returned for the sake of being able to check the selection status
+*						of the calendar.
+*/
+YAHOO.widget.CalendarGroup.prototype.deselectAll = function() {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.deselectAll();
+	}
+	return this.getSelectedDates();
+};
+
+/**
+* Deselects a date on the current calendar by referencing the index of the cell that should be deselected.
+* This method is used to easily deselect a single cell (usually with a mouse click) without having to do
+* a full render. The selected style is removed from the cell directly.
+* @method deselectCell
+* @param	{Number}	cellIndex	The index of the cell to deselect in the current calendar.
+* @return	{Date[]}	Array of JavaScript Date objects representing all individual dates that are currently selected.
+*/
+YAHOO.widget.CalendarGroup.prototype.deselectCell = function(cellIndex) {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.deselectCell(cellIndex);
+	}
+	return this.getSelectedDates();
+};
+
+/**
+* Resets the calendar widget to the originally selected month and year, and
+* sets the calendar to the initial selection(s).
+* @method reset
+*/
+YAHOO.widget.CalendarGroup.prototype.reset = function() {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.reset();
+	}
+};
+
+/**
+* Clears the selected dates in the current calendar widget and sets the calendar
+* to the current month and year.
+* @method clear
+*/
+YAHOO.widget.CalendarGroup.prototype.clear = function() {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.clear();
+	}
+};
+
+/**
+* Navigates to the next month page in the calendar widget.
+* @method nextMonth
+*/
+YAHOO.widget.CalendarGroup.prototype.nextMonth = function() {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.nextMonth();
+	}
+};
+
+/**
+* Navigates to the previous month page in the calendar widget.
+* @method previousMonth
+*/
+YAHOO.widget.CalendarGroup.prototype.previousMonth = function() {
+	for (var p=this.pages.length-1;p>=0;--p) {
+		var cal = this.pages[p];
+		cal.previousMonth();
+	}
+};
+
+/**
+* Navigates to the next year in the currently selected month in the calendar widget.
+* @method nextYear
+*/
+YAHOO.widget.CalendarGroup.prototype.nextYear = function() {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.nextYear();
+	}
+};
+
+/**
+* Navigates to the previous year in the currently selected month in the calendar widget.
+* @method previousYear
+*/
+YAHOO.widget.CalendarGroup.prototype.previousYear = function() {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.previousYear();
+	}
+};
+
+
+/**
+* Gets the list of currently selected dates from the calendar.
+* @return			An array of currently selected JavaScript Date objects.
+* @type Date[]
+*/
+YAHOO.widget.CalendarGroup.prototype.getSelectedDates = function() {
+	var returnDates = [];
+	var selected = this.cfg.getProperty("selected");
+
+	for (var d=0;d<selected.length;++d) {
+		var dateArray = selected[d];
+
+		var date = new Date(dateArray[0],dateArray[1]-1,dateArray[2]);
+		returnDates.push(date);
+	}
+
+	returnDates.sort( function(a,b) { return a-b; } );
+	return returnDates;
+};
+
+/**
+* Adds a renderer to the render stack. The function reference passed to this method will be executed
+* when a date cell matches the conditions specified in the date string for this renderer.
+* @method addRenderer
+* @param	{String}	sDates		A date string to associate with the specified renderer. Valid formats
+*									include date (12/24/2005), month/day (12/24), and range (12/1/2004-1/1/2005)
+* @param	{Function}	fnRender	The function executed to render cells that match the render rules for this renderer.
+*/
+YAHOO.widget.CalendarGroup.prototype.addRenderer = function(sDates, fnRender) {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.addRenderer(sDates, fnRender);
+	}
+};
+
+/**
+* Adds a month to the render stack. The function reference passed to this method will be executed
+* when a date cell matches the month passed to this method.
+* @method addMonthRenderer
+* @param	{Number}	month		The month (1-12) to associate with this renderer
+* @param	{Function}	fnRender	The function executed to render cells that match the render rules for this renderer.
+*/
+YAHOO.widget.CalendarGroup.prototype.addMonthRenderer = function(month, fnRender) {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.addMonthRenderer(month, fnRender);
+	}
+};
+
+/**
+* Adds a weekday to the render stack. The function reference passed to this method will be executed
+* when a date cell matches the weekday passed to this method.
+* @method addWeekdayRenderer
+* @param	{Number}	weekday		The weekday (0-6) to associate with this renderer
+* @param	{Function}	fnRender	The function executed to render cells that match the render rules for this renderer.
+*/
+YAHOO.widget.CalendarGroup.prototype.addWeekdayRenderer = function(weekday, fnRender) {
+	for (var p=0;p<this.pages.length;++p) {
+		var cal = this.pages[p];
+		cal.addWeekdayRenderer(weekday, fnRender);
+	}
+};
+
+/**
+* Renders the header for the CalendarGroup.
+* @method renderHeader
+*/
+YAHOO.widget.CalendarGroup.prototype.renderHeader = function() {};
+
+/**
+* Renders a footer for the 2-up calendar container. By default, this method is
+* unimplemented.
+* @method renderFooter
+*/
+YAHOO.widget.CalendarGroup.prototype.renderFooter = function() {};
+
+/**
+* Adds the designated number of months to the current calendar month, and sets the current
+* calendar page date to the new month.
+* @method addMonths
+* @param {Number}	count	The number of months to add to the current calendar
+*/
+YAHOO.widget.CalendarGroup.prototype.addMonths = function(count) {
+	this.callChildFunction("addMonths", count);
+};
+
+
+/**
+* Subtracts the designated number of months from the current calendar month, and sets the current
+* calendar page date to the new month.
+* @method subtractMonths
+* @param {Number}	count	The number of months to subtract from the current calendar
+*/
+YAHOO.widget.CalendarGroup.prototype.subtractMonths = function(count) {
+	this.callChildFunction("subtractMonths", count);
+};
+
+/**
+* Adds the designated number of years to the current calendar, and sets the current
+* calendar page date to the new month.
+* @method addYears
+* @param {Number}	count	The number of years to add to the current calendar
+*/
+YAHOO.widget.CalendarGroup.prototype.addYears = function(count) {
+	this.callChildFunction("addYears", count);
+};
+
+/**
+* Subtcats the designated number of years from the current calendar, and sets the current
+* calendar page date to the new month.
+* @method subtractYears
+* @param {Number}	count	The number of years to subtract from the current calendar
+*/
+YAHOO.widget.CalendarGroup.prototype.subtractYears = function(count) {
+	this.callChildFunction("subtractYears", count);
+};
+
+/**
+* CSS class representing the container for the calendar
+* @property YAHOO.widget.CalendarGroup.CSS_CONTAINER
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.CalendarGroup.CSS_CONTAINER = "yui-calcontainer";
+
+/**
+* CSS class representing the container for the calendar
+* @property YAHOO.widget.CalendarGroup.CSS_MULTI_UP
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.CalendarGroup.CSS_MULTI_UP = "multi";
+
+/**
+* CSS class representing the title for the 2-up calendar
+* @property YAHOO.widget.CalendarGroup.CSS_2UPTITLE
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.CalendarGroup.CSS_2UPTITLE = "title";
+
+/**
+* CSS class representing the close icon for the 2-up calendar
+* @property YAHOO.widget.CalendarGroup.CSS_2UPCLOSE
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.CalendarGroup.CSS_2UPCLOSE = "close-icon";
+
+YAHOO.augment(YAHOO.widget.CalendarGroup, YAHOO.widget.Calendar, "buildDayLabel",
+																 "buildMonthLabel",
+																 "renderOutOfBoundsDate",
+																 "renderRowHeader",
+																 "renderRowFooter",
+																 "renderCellDefault",
+																 "styleCellDefault",
+																 "renderCellStyleHighlight1",
+																 "renderCellStyleHighlight2",
+																 "renderCellStyleHighlight3",
+																 "renderCellStyleHighlight4",
+																 "renderCellStyleToday",
+																 "renderCellStyleSelected",
+																 "renderCellNotThisMonth",
+																 "renderBodyCellRestricted",
+																 "initStyles",
+																 "configTitle",
+																 "configClose",
+																 "hide",
+																 "show",
+																 "browser");
+
+/**
+* Returns a string representation of the object.
+* @method toString
+* @return {String}	A string representation of the CalendarGroup object.
+*/
+YAHOO.widget.CalendarGroup.prototype.toString = function() {
+	return "CalendarGroup " + this.id;
+};
+
+YAHOO.widget.CalGrp = YAHOO.widget.CalendarGroup;
+
+/**
+* @class YAHOO.widget.Calendar2up
+* @extends YAHOO.widget.CalendarGroup
+* @deprecated The old Calendar2up class is no longer necessary, since CalendarGroup renders in a 2up view by default.
+*/
+YAHOO.widget.Calendar2up = function(id, containerId, config) {
+	this.init(id, containerId, config);
+};
+
+YAHOO.extend(YAHOO.widget.Calendar2up, YAHOO.widget.CalendarGroup);
+
+/**
+* @deprecated The old Calendar2up class is no longer necessary, since CalendarGroup renders in a 2up view by default.
+*/
+YAHOO.widget.Cal2up = YAHOO.widget.Calendar2up;
\ No newline at end of file
diff --git a/frontend/beta/js/YUI/connection.js b/frontend/beta/js/YUI/connection.js
new file mode 100644
index 0000000..58f6d0f
--- a/dev/null
+++ b/frontend/beta/js/YUI/connection.js
@@ -0,0 +1,960 @@
+/*
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 0.12.0
+*/
+
+/**
+ * @description
+ * The Connection Manager provides a simplified interface to the XMLHttpRequest
+ * object.  It handles cross-browser instantiantion of XMLHttpRequest, negotiates the
+ * interactive states and server response, returning the results to a pre-defined
+ * callback you create.
+ *
+ * @namespace YAHOO.util
+ * @module Connection
+ * @Class Connect
+ */
+YAHOO.util.Connect =
+{
+  /**
+   * @description Array of MSFT ActiveX ids for XMLHttpRequest.
+   * @property _msxml_progid
+   * @private
+   * @static
+   * @type array
+   */
+	_msxml_progid:[
+		'MSXML2.XMLHTTP.3.0',
+		'MSXML2.XMLHTTP',
+		'Microsoft.XMLHTTP'
+		],
+
+  /**
+   * @description Object literal of HTTP header(s)
+   * @property _http_header
+   * @private
+   * @static
+   * @type object
+   */
+	_http_header:{},
+
+  /**
+   * @description Determines if HTTP headers are set.
+   * @property _has_http_headers
+   * @private
+   * @static
+   * @type boolean
+   */
+	_has_http_headers:false,
+
+ /**
+  * @description Determines if a default header of
+  * Content-Type of 'application/x-www-form-urlencoded'
+  * will be added to any client HTTP headers sent for POST
+  * transactions.
+  * @property _use_default_post_header
+  * @private
+  * @static
+  * @type boolean
+  */
+    _use_default_post_header:true,
+
+ /**
+  * @description Determines if a default header of
+  * Content-Type of 'application/x-www-form-urlencoded'
+  * will be added to any client HTTP headers sent for POST
+  * transactions.
+  * @property _default_post_header
+  * @private
+  * @static
+  * @type boolean
+  */
+    _default_post_header:'application/x-www-form-urlencoded',
+
+ /**
+  * @description Property modified by setForm() to determine if the data
+  * should be submitted as an HTML form.
+  * @property _isFormSubmit
+  * @private
+  * @static
+  * @type boolean
+  */
+    _isFormSubmit:false,
+
+ /**
+  * @description Property modified by setForm() to determine if a file(s)
+  * upload is expected.
+  * @property _isFileUpload
+  * @private
+  * @static
+  * @type boolean
+  */
+    _isFileUpload:false,
+
+ /**
+  * @description Property modified by setForm() to set a reference to the HTML
+  * form node if the desired action is file upload.
+  * @property _formNode
+  * @private
+  * @static
+  * @type object
+  */
+    _formNode:null,
+
+ /**
+  * @description Property modified by setForm() to set the HTML form data
+  * for each transaction.
+  * @property _sFormData
+  * @private
+  * @static
+  * @type string
+  */
+    _sFormData:null,
+
+ /**
+  * @description Collection of polling references to the polling mechanism in handleReadyState.
+  * @property _poll
+  * @private
+  * @static
+  * @type object
+  */
+    _poll:{},
+
+ /**
+  * @description Queue of timeout values for each transaction callback with a defined timeout value.
+  * @property _timeOut
+  * @private
+  * @static
+  * @type object
+  */
+    _timeOut:{},
+
+  /**
+   * @description The polling frequency, in milliseconds, for HandleReadyState.
+   * when attempting to determine a transaction's XHR readyState.
+   * The default is 50 milliseconds.
+   * @property _polling_interval
+   * @private
+   * @static
+   * @type int
+   */
+     _polling_interval:50,
+
+  /**
+   * @description A transaction counter that increments the transaction id for each transaction.
+   * @property _transaction_id
+   * @private
+   * @static
+   * @type int
+   */
+     _transaction_id:0,
+
+  /**
+   * @description Member to add an ActiveX id to the existing xml_progid array.
+   * In the event(unlikely) a new ActiveX id is introduced, it can be added
+   * without internal code modifications.
+   * @method setProgId
+   * @public
+   * @static
+   * @param {string} id The ActiveX id to be added to initialize the XHR object.
+   * @return void
+   */
+	setProgId:function(id)
+	{
+		this._msxml_progid.unshift(id);
+	},
+
+  /**
+   * @description Member to enable or disable the default POST header.
+   * @method setDefaultPostHeader
+   * @public
+   * @static
+   * @param {boolean} b Set and use default header - true or false .
+   * @return void
+   */
+	setDefaultPostHeader:function(b)
+	{
+		this._use_default_post_header = b;
+	},
+
+  /**
+   * @description Member to modify the default polling interval.
+   * @method setPollingInterval
+   * @public
+   * @static
+   * @param {int} i The polling interval in milliseconds.
+   * @return void
+   */
+	setPollingInterval:function(i)
+	{
+		if(typeof i == 'number' && isFinite(i)){
+			this._polling_interval = i;
+		}
+	},
+
+  /**
+   * @description Instantiates a XMLHttpRequest object and returns an object with two properties:
+   * the XMLHttpRequest instance and the transaction id.
+   * @method createXhrObject
+   * @private
+   * @static
+   * @param {int} transactionId Property containing the transaction id for this transaction.
+   * @return object
+   */
+	createXhrObject:function(transactionId)
+	{
+		var obj,http;
+		try
+		{
+			// Instantiates XMLHttpRequest in non-IE browsers and assigns to http.
+			http = new XMLHttpRequest();
+			//  Object literal with http and tId properties
+			obj = { conn:http, tId:transactionId };
+		}
+		catch(e)
+		{
+			for(var i=0; i<this._msxml_progid.length; ++i){
+				try
+				{
+					// Instantiates XMLHttpRequest for IE and assign to http.
+					http = new ActiveXObject(this._msxml_progid[i]);
+					//  Object literal with conn and tId properties
+					obj = { conn:http, tId:transactionId };
+					break;
+				}
+				catch(e){}
+			}
+		}
+		finally
+		{
+			return obj;
+		}
+	},
+
+  /**
+   * @description This method is called by asyncRequest to create a
+   * valid connection object for the transaction.  It also passes a
+   * transaction id and increments the transaction id counter.
+   * @method getConnectionObject
+   * @private
+   * @static
+   * @return {object}
+   */
+	getConnectionObject:function()
+	{
+		var o;
+		var tId = this._transaction_id;
+
+		try
+		{
+			o = this.createXhrObject(tId);
+			if(o){
+				this._transaction_id++;
+			}
+		}
+		catch(e){}
+		finally
+		{
+			return o;
+		}
+	},
+
+  /**
+   * @description Method for initiating an asynchronous request via the XHR object.
+   * @method asyncRequest
+   * @public
+   * @static
+   * @param {string} method HTTP transaction method
+   * @param {string} uri Fully qualified path of resource
+   * @param {callback} callback User-defined callback function or object
+   * @param {string} postData POST body
+   * @return {object} Returns the connection object
+   */
+	asyncRequest:function(method, uri, callback, postData)
+	{
+		var o = this.getConnectionObject();
+
+		if(!o){
+			return null;
+		}
+		else{
+			if(this._isFormSubmit){
+				if(this._isFileUpload){
+					this.uploadFile(o.tId, callback, uri, postData);
+					this.releaseObject(o);
+
+					return;
+				}
+
+				//If the specified HTTP method is GET, setForm() will return an
+				//encoded string that is concatenated to the uri to
+				//create a querystring.
+				if(method == 'GET'){
+					if(this._sFormData.length != 0){
+						// If the URI already contains a querystring, append an ampersand
+						// and then concatenate _sFormData to the URI.
+						uri += ((uri.indexOf('?') == -1)?'?':'&') + this._sFormData;
+					}
+					else{
+						uri += "?" + this._sFormData;
+					}
+				}
+				else if(method == 'POST'){
+					//If POST data exist in addition to the HTML form data,
+					//it will be concatenated to the form data.
+					postData = postData?this._sFormData + "&" + postData:this._sFormData;
+				}
+			}
+
+			o.conn.open(method, uri, true);
+
+			if(this._isFormSubmit || (postData && this._use_default_post_header)){
+				this.initHeader('Content-Type', this._default_post_header);
+				if(this._isFormSubmit){
+					this.resetFormState();
+				}
+			}
+
+			if(this._has_http_headers){
+				this.setHeader(o);
+			}
+
+			this.handleReadyState(o, callback);
+			o.conn.send(postData || null);
+
+			return o;
+		}
+	},
+
+  /**
+   * @description This method serves as a timer that polls the XHR object's readyState
+   * property during a transaction, instead of binding a callback to the
+   * onreadystatechange event.  Upon readyState 4, handleTransactionResponse
+   * will process the response, and the timer will be cleared.
+   * @method handleReadyState
+   * @private
+   * @static
+   * @param {object} o The connection object
+   * @param {callback} callback The user-defined callback object
+   * @return {void}
+   */
+    handleReadyState:function(o, callback)
+    {
+		var oConn = this;
+
+		if(callback && callback.timeout){
+			this._timeOut[o.tId] = window.setTimeout(function(){ oConn.abort(o, callback, true); }, callback.timeout);
+		}
+
+		this._poll[o.tId] = window.setInterval(
+			function(){
+				if(o.conn && o.conn.readyState == 4){
+					window.clearInterval(oConn._poll[o.tId]);
+					delete oConn._poll[o.tId];
+
+					if(callback && callback.timeout){
+						delete oConn._timeOut[o.tId];
+					}
+
+					oConn.handleTransactionResponse(o, callback);
+				}
+			}
+		,this._polling_interval);
+    },
+
+  /**
+   * @description This method attempts to interpret the server response and
+   * determine whether the transaction was successful, or if an error or
+   * exception was encountered.
+   * @method handleTransactionResponse
+   * @private
+   * @static
+   * @param {object} o The connection object
+   * @param {object} callback The sser-defined callback object
+   * @param {boolean} isAbort Determines if the transaction was aborted.
+   * @return {void}
+   */
+    handleTransactionResponse:function(o, callback, isAbort)
+    {
+		// If no valid callback is provided, then do not process any callback handling.
+		if(!callback){
+			this.releaseObject(o);
+			return;
+		}
+
+		var httpStatus, responseObject;
+
+		try
+		{
+			if(o.conn.status !== undefined && o.conn.status != 0){
+				httpStatus = o.conn.status;
+			}
+			else{
+				httpStatus = 13030;
+			}
+		}
+		catch(e){
+			// 13030 is the custom code to indicate the condition -- in Mozilla/FF --
+			// when the o object's status and statusText properties are
+			// unavailable, and a query attempt throws an exception.
+			httpStatus = 13030;
+		}
+
+		if(httpStatus >= 200 && httpStatus < 300){
+			try
+			{
+				responseObject = this.createResponseObject(o, callback.argument);
+				if(callback.success){
+					if(!callback.scope){
+						callback.success(responseObject);
+					}
+					else{
+						// If a scope property is defined, the callback will be fired from
+						// the context of the object.
+						callback.success.apply(callback.scope, [responseObject]);
+					}
+				}
+			}
+			catch(e){}
+		}
+		else{
+			try
+			{
+				switch(httpStatus){
+					// The following cases are wininet.dll error codes that may be encountered.
+					case 12002: // Server timeout
+					case 12029: // 12029 to 12031 correspond to dropped connections.
+					case 12030:
+					case 12031:
+					case 12152: // Connection closed by server.
+					case 13030: // See above comments for variable status.
+						responseObject = this.createExceptionObject(o.tId, callback.argument, (isAbort?isAbort:false));
+						if(callback.failure){
+							if(!callback.scope){
+								callback.failure(responseObject);
+							}
+							else{
+								callback.failure.apply(callback.scope, [responseObject]);
+							}
+						}
+						break;
+					default:
+						responseObject = this.createResponseObject(o, callback.argument);
+						if(callback.failure){
+							if(!callback.scope){
+								callback.failure(responseObject);
+							}
+							else{
+								callback.failure.apply(callback.scope, [responseObject]);
+							}
+						}
+				}
+			}
+			catch(e){}
+		}
+
+		this.releaseObject(o);
+		responseObject = null;
+    },
+
+  /**
+   * @description This method evaluates the server response, creates and returns the results via
+   * its properties.  Success and failure cases will differ in the response
+   * object's property values.
+   * @method createResponseObject
+   * @private
+   * @static
+   * @param {object} o The connection object
+   * @param {callbackArg} callbackArg The user-defined argument or arguments to be passed to the callback
+   * @return {object}
+   */
+    createResponseObject:function(o, callbackArg)
+    {
+		var obj = {};
+		var headerObj = {};
+
+		try
+		{
+			var headerStr = o.conn.getAllResponseHeaders();
+			var header = headerStr.split('\n');
+			for(var i=0; i<header.length; i++){
+				var delimitPos = header[i].indexOf(':');
+				if(delimitPos != -1){
+					headerObj[header[i].substring(0,delimitPos)] = header[i].substring(delimitPos+2);
+				}
+			}
+		}
+		catch(e){}
+
+		obj.tId = o.tId;
+		obj.status = o.conn.status;
+		obj.statusText = o.conn.statusText;
+		obj.getResponseHeader = headerObj;
+		obj.getAllResponseHeaders = headerStr;
+		obj.responseText = o.conn.responseText;
+		obj.responseXML = o.conn.responseXML;
+
+		if(typeof callbackArg !== undefined){
+			obj.argument = callbackArg;
+		}
+
+		return obj;
+    },
+
+  /**
+   * @description If a transaction cannot be completed due to dropped or closed connections,
+   * there may be not be enough information to build a full response object.
+   * The failure callback will be fired and this specific condition can be identified
+   * by a status property value of 0.
+   *
+   * If an abort was successful, the status property will report a value of -1.
+   *
+   * @method createExceptionObject
+   * @private
+   * @static
+   * @param {int} tId The Transaction Id
+   * @param {callbackArg} callbackArg The user-defined argument or arguments to be passed to the callback
+   * @param {boolean} isAbort Determines if the exception case is caused by a transaction abort
+   * @return {object}
+   */
+    createExceptionObject:function(tId, callbackArg, isAbort)
+    {
+		var COMM_CODE = 0;
+		var COMM_ERROR = 'communication failure';
+		var ABORT_CODE = -1;
+		var ABORT_ERROR = 'transaction aborted';
+
+		var obj = {};
+
+		obj.tId = tId;
+		if(isAbort){
+			obj.status = ABORT_CODE;
+			obj.statusText = ABORT_ERROR;
+		}
+		else{
+			obj.status = COMM_CODE;
+			obj.statusText = COMM_ERROR;
+		}
+
+		if(callbackArg){
+			obj.argument = callbackArg;
+		}
+
+		return obj;
+    },
+
+  /**
+   * @description Public method that stores the custom HTTP headers for each transaction.
+   * @method initHeader
+   * @public
+   * @static
+   * @param {string} label The HTTP header label
+   * @param {string} value The HTTP header value
+   * @return {void}
+   */
+	initHeader:function(label,value)
+	{
+		if(this._http_header[label] === undefined){
+			this._http_header[label] = value;
+		}
+		else{
+			// Concatenate multiple values, comma-delimited,
+			// for the same header label,
+			this._http_header[label] =  value + "," + this._http_header[label];
+		}
+
+		this._has_http_headers = true;
+	},
+
+  /**
+   * @description Accessor that sets the HTTP headers for each transaction.
+   * @method setHeader
+   * @private
+   * @static
+   * @param {object} o The connection object for the transaction.
+   * @return {void}
+   */
+	setHeader:function(o)
+	{
+		for(var prop in this._http_header){
+			if(this._http_header.hasOwnProperty(prop)){
+				o.conn.setRequestHeader(prop, this._http_header[prop]);
+			}
+		}
+		delete this._http_header;
+
+		this._http_header = {};
+		this._has_http_headers = false;
+	},
+
+  /**
+   * @description This method assembles the form label and value pairs and
+   * constructs an encoded string.
+   * asyncRequest() will automatically initialize the
+   * transaction with a HTTP header Content-Type of
+   * application/x-www-form-urlencoded.
+   * @method setForm
+   * @public
+   * @static
+   * @param {string || object} form id or name attribute, or form object.
+   * @param {string} optional boolean to indicate SSL environment.
+   * @param {string || boolean} optional qualified path of iframe resource for SSL in IE.
+   * @return {string} string of the HTML form field name and value pairs..
+   */
+	setForm:function(formId, isUpload, secureUri)
+	{
+		this.resetFormState();
+		var oForm;
+		if(typeof formId == 'string'){
+			// Determine if the argument is a form id or a form name.
+			// Note form name usage is deprecated by supported
+			// here for legacy reasons.
+			oForm = (document.getElementById(formId) || document.forms[formId]);
+		}
+		else if(typeof formId == 'object'){
+			// Treat argument as an HTML form object.
+			oForm = formId;
+		}
+		else{
+			return;
+		}
+
+		// If the isUpload argument is true, setForm will call createFrame to initialize
+		// an iframe as the form target.
+		//
+		// The argument secureURI is also required by IE in SSL environments
+		// where the secureURI string is a fully qualified HTTP path, used to set the source
+		// of the iframe, to a stub resource in the same domain.
+		if(isUpload){
+
+			// Create iframe in preparation for file upload.
+			this.createFrame(secureUri?secureUri:null);
+
+			// Set form reference and file upload properties to true.
+			this._isFormSubmit = true;
+			this._isFileUpload = true;
+			this._formNode = oForm;
+
+			return;
+		}
+
+		var oElement, oName, oValue, oDisabled;
+		var hasSubmit = false;
+
+		// Iterate over the form elements collection to construct the
+		// label-value pairs.
+		for (var i=0; i<oForm.elements.length; i++){
+			oElement = oForm.elements[i];
+			oDisabled = oForm.elements[i].disabled;
+			oName = oForm.elements[i].name;
+			oValue = oForm.elements[i].value;
+
+			// Do not submit fields that are disabled or
+			// do not have a name attribute value.
+			if(!oDisabled && oName)
+			{
+				switch (oElement.type)
+				{
+					case 'select-one':
+					case 'select-multiple':
+						for(var j=0; j<oElement.options.length; j++){
+							if(oElement.options[j].selected){
+								if(window.ActiveXObject){
+									this._sFormData += encodeURIComponent(oName) + '=' + encodeURIComponent(oElement.options[j].attributes['value'].specified?oElement.options[j].value:oElement.options[j].text) + '&';
+								}
+								else{
+									this._sFormData += encodeURIComponent(oName) + '=' + encodeURIComponent(oElement.options[j].hasAttribute('value')?oElement.options[j].value:oElement.options[j].text) + '&';
+								}
+
+							}
+						}
+						break;
+					case 'radio':
+					case 'checkbox':
+						if(oElement.checked){
+							this._sFormData += encodeURIComponent(oName) + '=' + encodeURIComponent(oValue) + '&';
+						}
+						break;
+					case 'file':
+						// stub case as XMLHttpRequest will only send the file path as a string.
+					case undefined:
+						// stub case for fieldset element which returns undefined.
+					case 'reset':
+						// stub case for input type reset button.
+					case 'button':
+						// stub case for input type button elements.
+						break;
+					case 'submit':
+						if(hasSubmit == false){
+							this._sFormData += encodeURIComponent(oName) + '=' + encodeURIComponent(oValue) + '&';
+							hasSubmit = true;
+						}
+						break;
+					default:
+						this._sFormData += encodeURIComponent(oName) + '=' + encodeURIComponent(oValue) + '&';
+						break;
+				}
+			}
+		}
+
+		this._isFormSubmit = true;
+		this._sFormData = this._sFormData.substr(0, this._sFormData.length - 1);
+
+		return this._sFormData;
+	},
+
+  /**
+   * @description Resets HTML form properties when an HTML form or HTML form
+   * with file upload transaction is sent.
+   * @method resetFormState
+   * @private
+   * @static
+   * @return {void}
+   */
+	resetFormState:function(){
+		this._isFormSubmit = false;
+		this._isFileUpload = false;
+		this._formNode = null;
+		this._sFormData = "";
+	},
+
+  /**
+   * @description Creates an iframe to be used for form file uploads.  It is remove from the
+   * document upon completion of the upload transaction.
+   * @method createFrame
+   * @private
+   * @static
+   * @param {string} secureUri Optional qualified path of iframe resource for SSL in IE.
+   * @return {void}
+   */
+	createFrame:function(secureUri){
+
+		// IE does not allow the setting of id and name attributes as object
+		// properties via createElement().  A different iframe creation
+		// pattern is required for IE.
+		var frameId = 'yuiIO' + this._transaction_id;
+		if(window.ActiveXObject){
+			var io = document.createElement('<iframe id="' + frameId + '" name="' + frameId + '" />');
+
+			// IE will throw a security exception in an SSL environment if the
+			// iframe source is undefined.
+			if(typeof secureUri == 'boolean'){
+				io.src = 'javascript:false';
+			}
+			else if(typeof secureURI == 'string'){
+				// Deprecated
+				io.src = secureUri;
+			}
+		}
+		else{
+			var io = document.createElement('iframe');
+			io.id = frameId;
+			io.name = frameId;
+		}
+
+		io.style.position = 'absolute';
+		io.style.top = '-1000px';
+		io.style.left = '-1000px';
+
+		document.body.appendChild(io);
+	},
+
+  /**
+   * @description Parses the POST data and creates hidden form elements
+   * for each key-value, and appends them to the HTML form object.
+   * @method appendPostData
+   * @private
+   * @static
+   * @param {string} postData The HTTP POST data
+   * @return {array} formElements Collection of hidden fields.
+   */
+	appendPostData:function(postData)
+	{
+		var formElements = new Array();
+		var postMessage = postData.split('&');
+		for(var i=0; i < postMessage.length; i++){
+			var delimitPos = postMessage[i].indexOf('=');
+			if(delimitPos != -1){
+				formElements[i] = document.createElement('input');
+				formElements[i].type = 'hidden';
+				formElements[i].name = postMessage[i].substring(0,delimitPos);
+				formElements[i].value = postMessage[i].substring(delimitPos+1);
+				this._formNode.appendChild(formElements[i]);
+			}
+		}
+
+		return formElements;
+	},
+
+  /**
+   * @description Uploads HTML form, including files/attachments, to the
+   * iframe created in createFrame.
+   * @method uploadFile
+   * @private
+   * @static
+   * @param {int} id The transaction id.
+   * @param {object} callback - User-defined callback object.
+   * @param {string} uri Fully qualified path of resource.
+   * @return {void}
+   */
+	uploadFile:function(id, callback, uri, postData){
+
+		// Each iframe has an id prefix of "yuiIO" followed
+		// by the unique transaction id.
+		var frameId = 'yuiIO' + id;
+		var io = document.getElementById(frameId);
+
+		// Initialize the HTML form properties in case they are
+		// not defined in the HTML form.
+		this._formNode.action = uri;
+		this._formNode.method = 'POST';
+		this._formNode.target = frameId;
+
+		if(this._formNode.encoding){
+			// IE does not respect property enctype for HTML forms.
+			// Instead use property encoding.
+			this._formNode.encoding = 'multipart/form-data';
+		}
+		else{
+			this._formNode.enctype = 'multipart/form-data';
+		}
+
+		if(postData){
+			var oElements = this.appendPostData(postData);
+		}
+
+		this._formNode.submit();
+
+		if(oElements && oElements.length > 0){
+			try
+			{
+				for(var i=0; i < oElements.length; i++){
+					this._formNode.removeChild(oElements[i]);
+				}
+			}
+			catch(e){}
+		}
+
+		// Reset HTML form status properties.
+		this.resetFormState();
+
+		// Create the upload callback handler that fires when the iframe
+		// receives the load event.  Subsequently, the event handler is detached
+		// and the iframe removed from the document.
+
+		var uploadCallback = function()
+		{
+			var obj = {};
+			obj.tId = id;
+			obj.argument = callback.argument;
+
+			try
+			{
+				obj.responseText = io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null;
+				obj.responseXML = io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document;
+			}
+			catch(e){}
+
+			if(callback.upload){
+				if(!callback.scope){
+					callback.upload(obj);
+				}
+				else{
+					callback.upload.apply(callback.scope, [obj]);
+				}
+			}
+
+			if(YAHOO.util.Event){
+				YAHOO.util.Event.removeListener(io, "load", uploadCallback);
+			}
+			else if(window.detachEvent){
+				io.detachEvent('onload', uploadCallback);
+			}
+			else{
+				io.removeEventListener('load', uploadCallback, false);
+			}
+			setTimeout(function(){ document.body.removeChild(io); }, 100);
+		};
+
+
+		// Bind the onload handler to the iframe to detect the file upload response.
+		if(YAHOO.util.Event){
+			YAHOO.util.Event.addListener(io, "load", uploadCallback);
+		}
+		else if(window.attachEvent){
+			io.attachEvent('onload', uploadCallback);
+		}
+		else{
+			io.addEventListener('load', uploadCallback, false);
+		}
+	},
+
+  /**
+   * @description Method to terminate a transaction, if it has not reached readyState 4.
+   * @method abort
+   * @public
+   * @static
+   * @param {object} o The connection object returned by asyncRequest.
+   * @param {object} callback  User-defined callback object.
+   * @param {string} isTimeout boolean to indicate if abort was a timeout.
+   * @return {boolean}
+   */
+	abort:function(o, callback, isTimeout)
+	{
+		if(this.isCallInProgress(o)){
+			o.conn.abort();
+			window.clearInterval(this._poll[o.tId]);
+			delete this._poll[o.tId];
+			if(isTimeout){
+				delete this._timeOut[o.tId];
+			}
+
+			this.handleTransactionResponse(o, callback, true);
+
+			return true;
+		}
+		else{
+			return false;
+		}
+	},
+
+  /**
+   * Public method to check if the transaction is still being processed.
+   *
+   * @method isCallInProgress
+   * @public
+   * @static
+   * @param {object} o The connection object returned by asyncRequest
+   * @return {boolean}
+   */
+	isCallInProgress:function(o)
+	{
+		// if the XHR object assigned to the transaction has not been dereferenced,
+		// then check its readyState status.  Otherwise, return false.
+		if(o.conn){
+			return o.conn.readyState != 4 && o.conn.readyState != 0;
+		}
+		else{
+			//The XHR object has been destroyed.
+			return false;
+		}
+	},
+
+  /**
+   * @description Dereference the XHR instance and the connection object after the transaction is completed.
+   * @method releaseObject
+   * @private
+   * @static
+   * @param {object} o The connection object
+   * @return {void}
+   */
+	releaseObject:function(o)
+	{
+		//dereference the XHR instance.
+		o.conn = null;
+		//dereference the connection object.
+		o = null;
+	}
+};
\ No newline at end of file
diff --git a/frontend/beta/js/YUI/container.js b/frontend/beta/js/YUI/container.js
new file mode 100644
index 0000000..ec0f864
--- a/dev/null
+++ b/frontend/beta/js/YUI/container.js
@@ -0,0 +1,4561 @@
+/*
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version 0.12.0
+*/
+
+/**
+* Config is a utility used within an Object to allow the implementer to maintain a list of local configuration properties and listen for changes to those properties dynamically using CustomEvent. The initial values are also maintained so that the configuration can be reset at any given point to its initial state.
+* @class YAHOO.util.Config
+* @constructor
+* @param {Object}	owner	The owner Object to which this Config Object belongs
+*/
+YAHOO.util.Config = function(owner) {
+	if (owner) {
+		this.init(owner);
+	}
+};
+
+YAHOO.util.Config.prototype = {
+
+	/**
+	* Object reference to the owner of this Config Object
+	* @property owner
+	* @type Object
+	*/
+	owner : null,
+
+	/**
+	* Boolean flag that specifies whether a queue is currently being executed
+	* @property queueInProgress
+	* @type Boolean
+	*/
+	queueInProgress : false,
+
+
+	/**
+	* Validates that the value passed in is a Boolean.
+	* @method checkBoolean
+	* @param	{Object}	val	The value to validate
+	* @return	{Boolean}	true, if the value is valid
+	*/
+	checkBoolean: function(val) {
+		if (typeof val == 'boolean') {
+			return true;
+		} else {
+			return false;
+		}
+	},
+
+	/**
+	* Validates that the value passed in is a number.
+	* @method checkNumber
+	* @param	{Object}	val	The value to validate
+	* @return	{Boolean}	true, if the value is valid
+	*/
+	checkNumber: function(val) {
+		if (isNaN(val)) {
+			return false;
+		} else {
+			return true;
+		}
+	}
+};
+
+
+/**
+* Initializes the configuration Object and all of its local members.
+* @method init
+* @param {Object}	owner	The owner Object to which this Config Object belongs
+*/
+YAHOO.util.Config.prototype.init = function(owner) {
+
+	this.owner = owner;
+
+	/**
+	* Object reference to the owner of this Config Object
+	* @event configChangedEvent
+	*/
+	this.configChangedEvent = new YAHOO.util.CustomEvent("configChanged");
+
+	this.queueInProgress = false;
+
+	/* Private Members */
+
+	/**
+	* Maintains the local collection of configuration property objects and their specified values
+	* @property config
+	* @private
+	* @type Object
+	*/
+	var config = {};
+
+	/**
+	* Maintains the local collection of configuration property objects as they were initially applied.
+	* This object is used when resetting a property.
+	* @property initialConfig
+	* @private
+	* @type Object
+	*/
+	var initialConfig = {};
+
+	/**
+	* Maintains the local, normalized CustomEvent queue
+	* @property eventQueue
+	* @private
+	* @type Object
+	*/
+	var eventQueue = [];
+
+	/**
+	* Fires a configuration property event using the specified value.
+	* @method fireEvent
+	* @private
+	* @param {String}	key			The configuration property's name
+	* @param {value}	Object		The value of the correct type for the property
+	*/
+	var fireEvent = function( key, value ) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+
+		if (typeof property != 'undefined' && property.event) {
+			property.event.fire(value);
+		}
+	};
+	/* End Private Members */
+
+	/**
+	* Adds a property to the Config Object's private config hash.
+	* @method addProperty
+	* @param {String}	key	The configuration property's name
+	* @param {Object}	propertyObject	The Object containing all of this property's arguments
+	*/
+	this.addProperty = function( key, propertyObject ) {
+		key = key.toLowerCase();
+
+		config[key] = propertyObject;
+
+		propertyObject.event = new YAHOO.util.CustomEvent(key);
+		propertyObject.key = key;
+
+		if (propertyObject.handler) {
+			propertyObject.event.subscribe(propertyObject.handler, this.owner, true);
+		}
+
+		this.setProperty(key, propertyObject.value, true);
+
+		if (! propertyObject.suppressEvent) {
+			this.queueProperty(key, propertyObject.value);
+		}
+	};
+
+	/**
+	* Returns a key-value configuration map of the values currently set in the Config Object.
+	* @method getConfig
+	* @return {Object} The current config, represented in a key-value map
+	*/
+	this.getConfig = function() {
+		var cfg = {};
+
+		for (var prop in config) {
+			var property = config[prop];
+			if (typeof property != 'undefined' && property.event) {
+				cfg[prop] = property.value;
+			}
+		}
+
+		return cfg;
+	};
+
+	/**
+	* Returns the value of specified property.
+	* @method getProperty
+	* @param {String} key	The name of the property
+	* @return {Object}		The value of the specified property
+	*/
+	this.getProperty = function(key) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+		if (typeof property != 'undefined' && property.event) {
+			return property.value;
+		} else {
+			return undefined;
+		}
+	};
+
+	/**
+	* Resets the specified property's value to its initial value.
+	* @method resetProperty
+	* @param {String} key	The name of the property
+	* @return {Boolean} True is the property was reset, false if not
+	*/
+	this.resetProperty = function(key) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+		if (typeof property != 'undefined' && property.event) {
+			if (initialConfig[key] && initialConfig[key] != 'undefined')	{
+				this.setProperty(key, initialConfig[key]);
+			}
+			return true;
+		} else {
+			return false;
+		}
+	};
+
+	/**
+	* Sets the value of a property. If the silent property is passed as true, the property's event will not be fired.
+	* @method setProperty
+	* @param {String} key		The name of the property
+	* @param {String} value		The value to set the property to
+	* @param {Boolean} silent	Whether the value should be set silently, without firing the property event.
+	* @return {Boolean}			True, if the set was successful, false if it failed.
+	*/
+	this.setProperty = function(key, value, silent) {
+		key = key.toLowerCase();
+
+		if (this.queueInProgress && ! silent) {
+			this.queueProperty(key,value); // Currently running through a queue...
+			return true;
+		} else {
+			var property = config[key];
+			if (typeof property != 'undefined' && property.event) {
+				if (property.validator && ! property.validator(value)) { // validator
+					return false;
+				} else {
+					property.value = value;
+					if (! silent) {
+						fireEvent(key, value);
+						this.configChangedEvent.fire([key, value]);
+					}
+					return true;
+				}
+			} else {
+				return false;
+			}
+		}
+	};
+
+	/**
+	* Sets the value of a property and queues its event to execute. If the event is already scheduled to execute, it is
+	* moved from its current position to the end of the queue.
+	* @method queueProperty
+	* @param {String} key	The name of the property
+	* @param {String} value	The value to set the property to
+	* @return {Boolean}		true, if the set was successful, false if it failed.
+	*/
+	this.queueProperty = function(key, value) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+
+		if (typeof property != 'undefined' && property.event) {
+			if (typeof value != 'undefined' && property.validator && ! property.validator(value)) { // validator
+				return false;
+			} else {
+
+				if (typeof value != 'undefined') {
+					property.value = value;
+				} else {
+					value = property.value;
+				}
+
+				var foundDuplicate = false;
+
+				for (var i=0;i<eventQueue.length;i++) {
+					var queueItem = eventQueue[i];
+
+					if (queueItem) {
+						var queueItemKey = queueItem[0];
+						var queueItemValue = queueItem[1];
+
+						if (queueItemKey.toLowerCase() == key) {
+							// found a dupe... push to end of queue, null current item, and break
+							eventQueue[i] = null;
+							eventQueue.push([key, (typeof value != 'undefined' ? value : queueItemValue)]);
+							foundDuplicate = true;
+							break;
+						}
+					}
+				}
+
+				if (! foundDuplicate && typeof value != 'undefined') { // this is a refire, or a new property in the queue
+					eventQueue.push([key, value]);
+				}
+			}
+
+			if (property.supercedes) {
+				for (var s=0;s<property.supercedes.length;s++) {
+					var supercedesCheck = property.supercedes[s];
+
+					for (var q=0;q<eventQueue.length;q++) {
+						var queueItemCheck = eventQueue[q];
+
+						if (queueItemCheck) {
+							var queueItemCheckKey = queueItemCheck[0];
+							var queueItemCheckValue = queueItemCheck[1];
+
+							if ( queueItemCheckKey.toLowerCase() == supercedesCheck.toLowerCase() ) {
+								eventQueue.push([queueItemCheckKey, queueItemCheckValue]);
+								eventQueue[q] = null;
+								break;
+							}
+						}
+					}
+				}
+			}
+
+			return true;
+		} else {
+			return false;
+		}
+	};
+
+	/**
+	* Fires the event for a property using the property's current value.
+	* @method refireEvent
+	* @param {String} key	The name of the property
+	*/
+	this.refireEvent = function(key) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+		if (typeof property != 'undefined' && property.event && typeof property.value != 'undefined') {
+			if (this.queueInProgress) {
+				this.queueProperty(key);
+			} else {
+				fireEvent(key, property.value);
+			}
+		}
+	};
+
+	/**
+	* Applies a key-value Object literal to the configuration, replacing any existing values, and queueing the property events.
+	* Although the values will be set, fireQueue() must be called for their associated events to execute.
+	* @method applyConfig
+	* @param {Object}	userConfig	The configuration Object literal
+	* @param {Boolean}	init		When set to true, the initialConfig will be set to the userConfig passed in, so that calling a reset will reset the properties to the passed values.
+	*/
+	this.applyConfig = function(userConfig, init) {
+		if (init) {
+			initialConfig = userConfig;
+		}
+		for (var prop in userConfig) {
+			this.queueProperty(prop, userConfig[prop]);
+		}
+	};
+
+	/**
+	* Refires the events for all configuration properties using their current values.
+	* @method refresh
+	*/
+	this.refresh = function() {
+		for (var prop in config) {
+			this.refireEvent(prop);
+		}
+	};
+
+	/**
+	* Fires the normalized list of queued property change events
+	* @method fireQueue
+	*/
+	this.fireQueue = function() {
+		this.queueInProgress = true;
+		for (var i=0;i<eventQueue.length;i++) {
+			var queueItem = eventQueue[i];
+			if (queueItem) {
+				var key = queueItem[0];
+				var value = queueItem[1];
+
+				var property = config[key];
+				property.value = value;
+
+				fireEvent(key,value);
+			}
+		}
+
+		this.queueInProgress = false;
+		eventQueue = [];
+	};
+
+	/**
+	* Subscribes an external handler to the change event for any given property.
+	* @method subscribeToConfigEvent
+	* @param {String}	key			The property name
+	* @param {Function}	handler		The handler function to use subscribe to the property's event
+	* @param {Object}	obj			The Object to use for scoping the event handler (see CustomEvent documentation)
+	* @param {Boolean}	override	Optional. If true, will override "this" within the handler to map to the scope Object passed into the method.
+	* @return {Boolean}				True, if the subscription was successful, otherwise false.
+	*/
+	this.subscribeToConfigEvent = function(key, handler, obj, override) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+		if (typeof property != 'undefined' && property.event) {
+			if (! YAHOO.util.Config.alreadySubscribed(property.event, handler, obj)) {
+				property.event.subscribe(handler, obj, override);
+			}
+			return true;
+		} else {
+			return false;
+		}
+	};
+
+	/**
+	* Unsubscribes an external handler from the change event for any given property.
+	* @method unsubscribeFromConfigEvent
+	* @param {String}	key			The property name
+	* @param {Function}	handler		The handler function to use subscribe to the property's event
+	* @param {Object}	obj			The Object to use for scoping the event handler (see CustomEvent documentation)
+	* @return {Boolean}				True, if the unsubscription was successful, otherwise false.
+	*/
+	this.unsubscribeFromConfigEvent = function(key, handler, obj) {
+		key = key.toLowerCase();
+
+		var property = config[key];
+		if (typeof property != 'undefined' && property.event) {
+			return property.event.unsubscribe(handler, obj);
+		} else {
+			return false;
+		}
+	};
+
+	/**
+	* Returns a string representation of the Config object
+	* @method toString
+	* @return {String}	The Config object in string format.
+	*/
+	this.toString = function() {
+		var output = "Config";
+		if (this.owner) {
+			output += " [" + this.owner.toString() + "]";
+		}
+		return output;
+	};
+
+	/**
+	* Returns a string representation of the Config object's current CustomEvent queue
+	* @method outputEventQueue
+	* @return {String}	The string list of CustomEvents currently queued for execution
+	*/
+	this.outputEventQueue = function() {
+		var output = "";
+		for (var q=0;q<eventQueue.length;q++) {
+			var queueItem = eventQueue[q];
+			if (queueItem) {
+				output += queueItem[0] + "=" + queueItem[1] + ", ";
+			}
+		}
+		return output;
+	};
+};
+
+/**
+* Checks to determine if a particular function/Object pair are already subscribed to the specified CustomEvent
+* @method YAHOO.util.Config.alreadySubscribed
+* @static
+* @param {YAHOO.util.CustomEvent} evt	The CustomEvent for which to check the subscriptions
+* @param {Function}	fn	The function to look for in the subscribers list
+* @param {Object}	obj	The execution scope Object for the subscription
+* @return {Boolean}	true, if the function/Object pair is already subscribed to the CustomEvent passed in
+*/
+YAHOO.util.Config.alreadySubscribed = function(evt, fn, obj) {
+	for (var e=0;e<evt.subscribers.length;e++) {
+		var subsc = evt.subscribers[e];
+		if (subsc && subsc.obj == obj && subsc.fn == fn) {
+			return true;
+		}
+	}
+	return false;
+};
+
+/**
+*  The Container family of components is designed to enable developers to create different kinds of content-containing modules on the web. Module and Overlay are the most basic containers, and they can be used directly or extended to build custom containers. Also part of the Container family are four UI controls that extend Module and Overlay: Tooltip, Panel, Dialog, and SimpleDialog.
+* @module Container
+* @requires yahoo,dom,event,dragdrop,animation
+*/
+
+/**
+* Module is a JavaScript representation of the Standard Module Format. Standard Module Format is a simple standard for markup containers where child nodes representing the header, body, and footer of the content are denoted using the CSS classes "hd", "bd", and "ft" respectively. Module is the base class for all other classes in the YUI Container package.
+* @class Module
+* @namespace YAHOO.widget
+* @constructor
+* @param {String} el			The element ID representing the Module <em>OR</em>
+* @param {HTMLElement} el		The element representing the Module
+* @param {Object} userConfig	The configuration Object literal containing the configuration that should be set for this module. See configuration documentation for more details.
+*/
+YAHOO.widget.Module = function(el, userConfig) {
+	if (el) {
+		this.init(el, userConfig);
+	}
+};
+
+/**
+* Constant representing the prefix path to use for non-secure images
+* @property YAHOO.widget.Module.IMG_ROOT
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Module.IMG_ROOT = "http://us.i1.yimg.com/us.yimg.com/i/";
+
+/**
+* Constant representing the prefix path to use for securely served images
+* @property YAHOO.widget.Module.IMG_ROOT_SSL
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Module.IMG_ROOT_SSL = "https://a248.e.akamai.net/sec.yimg.com/i/";
+
+/**
+* Constant for the default CSS class name that represents a Module
+* @property YAHOO.widget.Module.CSS_MODULE
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Module.CSS_MODULE = "module";
+
+/**
+* Constant representing the module header
+* @property YAHOO.widget.Module.CSS_HEADER
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Module.CSS_HEADER = "hd";
+
+/**
+* Constant representing the module body
+* @property YAHOO.widget.Module.CSS_BODY
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Module.CSS_BODY = "bd";
+
+/**
+* Constant representing the module footer
+* @property YAHOO.widget.Module.CSS_FOOTER
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Module.CSS_FOOTER = "ft";
+
+/**
+* Constant representing the url for the "src" attribute of the iframe used to monitor changes to the browser's base font size
+* @property YAHOO.widget.Module.RESIZE_MONITOR_SECURE_URL
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Module.RESIZE_MONITOR_SECURE_URL = "javascript:false;";
+
+YAHOO.widget.Module.prototype = {
+	/**
+	* The class's constructor function
+	* @property contructor
+	* @type Function
+	*/
+	constructor : YAHOO.widget.Module,
+
+	/**
+	* The main module element that contains the header, body, and footer
+	* @property element
+	* @type HTMLElement
+	*/
+	element : null,
+
+	/**
+	* The header element, denoted with CSS class "hd"
+	* @property header
+	* @type HTMLElement
+	*/
+	header : null,
+
+	/**
+	* The body element, denoted with CSS class "bd"
+	* @property body
+	* @type HTMLElement
+	*/
+	body : null,
+
+	/**
+	* The footer element, denoted with CSS class "ft"
+	* @property footer
+	* @type HTMLElement
+	*/
+	footer : null,
+
+	/**
+	* The id of the element
+	* @property id
+	* @type String
+	*/
+	id : null,
+
+	/**
+	* The String representing the image root
+	* @property imageRoot
+	* @type String
+	*/
+	imageRoot : YAHOO.widget.Module.IMG_ROOT,
+
+	/**
+	* Initializes the custom events for Module which are fired automatically at appropriate times by the Module class.
+	* @method initEvents
+	*/
+	initEvents : function() {
+
+		/**
+		* CustomEvent fired prior to class initalization.
+		* @event beforeInitEvent
+		* @param {class} classRef	class reference of the initializing class, such as this.beforeInitEvent.fire(YAHOO.widget.Module)
+		*/
+		this.beforeInitEvent = new YAHOO.util.CustomEvent("beforeInit");
+
+		/**
+		* CustomEvent fired after class initalization.
+		* @event initEvent
+		* @param {class} classRef	class reference of the initializing class, such as this.beforeInitEvent.fire(YAHOO.widget.Module)
+		*/
+		this.initEvent = new YAHOO.util.CustomEvent("init");
+
+		/**
+		* CustomEvent fired when the Module is appended to the DOM
+		* @event appendEvent
+		*/
+		this.appendEvent = new YAHOO.util.CustomEvent("append");
+
+		/**
+		* CustomEvent fired before the Module is rendered
+		* @event beforeRenderEvent
+		*/
+		this.beforeRenderEvent = new YAHOO.util.CustomEvent("beforeRender");
+
+		/**
+		* CustomEvent fired after the Module is rendered
+		* @event renderEvent
+		*/
+		this.renderEvent = new YAHOO.util.CustomEvent("render");
+
+		/**
+		* CustomEvent fired when the header content of the Module is modified
+		* @event changeHeaderEvent
+		* @param {String/HTMLElement} content	String/element representing the new header content
+		*/
+		this.changeHeaderEvent = new YAHOO.util.CustomEvent("changeHeader");
+
+		/**
+		* CustomEvent fired when the body content of the Module is modified
+		* @event changeBodyEvent
+		* @param {String/HTMLElement} content	String/element representing the new body content
+		*/
+		this.changeBodyEvent = new YAHOO.util.CustomEvent("changeBody");
+
+		/**
+		* CustomEvent fired when the footer content of the Module is modified
+		* @event changeFooterEvent
+		* @param {String/HTMLElement} content	String/element representing the new footer content
+		*/
+		this.changeFooterEvent = new YAHOO.util.CustomEvent("changeFooter");
+
+		/**
+		* CustomEvent fired when the content of the Module is modified
+		* @event changeContentEvent
+		*/
+		this.changeContentEvent = new YAHOO.util.CustomEvent("changeContent");
+
+		/**
+		* CustomEvent fired when the Module is destroyed
+		* @event destroyEvent
+		*/
+		this.destroyEvent = new YAHOO.util.CustomEvent("destroy");
+
+		/**
+		* CustomEvent fired before the Module is shown
+		* @event beforeShowEvent
+		*/
+		this.beforeShowEvent = new YAHOO.util.CustomEvent("beforeShow");
+
+		/**
+		* CustomEvent fired after the Module is shown
+		* @event showEvent
+		*/
+		this.showEvent = new YAHOO.util.CustomEvent("show");
+
+		/**
+		* CustomEvent fired before the Module is hidden
+		* @event beforeHideEvent
+		*/
+		this.beforeHideEvent = new YAHOO.util.CustomEvent("beforeHide");
+
+		/**
+		* CustomEvent fired after the Module is hidden
+		* @event hideEvent
+		*/
+		this.hideEvent = new YAHOO.util.CustomEvent("hide");
+	},
+
+	/**
+	* String representing the current user-agent platform
+	* @property platform
+	* @type String
+	*/
+	platform : function() {
+					var ua = navigator.userAgent.toLowerCase();
+					if (ua.indexOf("windows") != -1 || ua.indexOf("win32") != -1) {
+						return "windows";
+					} else if (ua.indexOf("macintosh") != -1) {
+						return "mac";
+					} else {
+						return false;
+					}
+				}(),
+
+	/**
+	* String representing the current user-agent browser
+	* @property browser
+	* @type String
+	*/
+	browser : function() {
+			var ua = navigator.userAgent.toLowerCase();
+				  if (ua.indexOf('opera')!=-1) { // Opera (check first in case of spoof)
+					 return 'opera';
+				  } else if (ua.indexOf('msie 7')!=-1) { // IE7
+					 return 'ie7';
+				  } else if (ua.indexOf('msie') !=-1) { // IE
+					 return 'ie';
+				  } else if (ua.indexOf('safari')!=-1) { // Safari (check before Gecko because it includes "like Gecko")
+					 return 'safari';
+				  } else if (ua.indexOf('gecko') != -1) { // Gecko
+					 return 'gecko';
+				  } else {
+					 return false;
+				  }
+			}(),
+
+	/**
+	* Boolean representing whether or not the current browsing context is secure (https)
+	* @property isSecure
+	* @type Boolean
+	*/
+	isSecure : function() {
+		if (window.location.href.toLowerCase().indexOf("https") === 0) {
+			return true;
+		} else {
+			return false;
+		}
+	}(),
+
+	/**
+	* Initializes the custom events for Module which are fired automatically at appropriate times by the Module class.
+	*/
+	initDefaultConfig : function() {
+		// Add properties //
+
+		/**
+		* Specifies whether the Module is visible on the page.
+		* @config visible
+		* @type Boolean
+		* @default true
+		*/
+		this.cfg.addProperty("visible", { value:true, handler:this.configVisible, validator:this.cfg.checkBoolean } );
+
+		/**
+		* Object or array of objects representing the ContainerEffect classes that are active for animating the container.
+		* @config effect
+		* @type Object
+		* @default null
+		*/
+		this.cfg.addProperty("effect", { suppressEvent:true, supercedes:["visible"] } );
+
+		/**
+		* Specifies whether to create a special proxy iframe to monitor for user font resizing in the document
+		* @config monitorresize
+		* @type Boolean
+		* @default true
+		*/
+		this.cfg.addProperty("monitorresize", { value:true, handler:this.configMonitorResize } );
+	},
+
+	/**
+	* The Module class's initialization method, which is executed for Module and all of its subclasses. This method is automatically called by the constructor, and  sets up all DOM references for pre-existing markup, and creates required markup if it is not already present.
+	* @method init
+	* @param {String}	el	The element ID representing the Module <em>OR</em>
+	* @param {HTMLElement}	el	The element representing the Module
+	* @param {Object}	userConfig	The configuration Object literal containing the configuration that should be set for this module. See configuration documentation for more details.
+	*/
+	init : function(el, userConfig) {
+
+		this.initEvents();
+
+		this.beforeInitEvent.fire(YAHOO.widget.Module);
+
+		/**
+		* The Module's Config object used for monitoring configuration properties.
+		* @property cfg
+		* @type YAHOO.util.Config
+		*/
+		this.cfg = new YAHOO.util.Config(this);
+
+		if (this.isSecure) {
+			this.imageRoot = YAHOO.widget.Module.IMG_ROOT_SSL;
+		}
+
+		if (typeof el == "string") {
+			var elId = el;
+
+			el = document.getElementById(el);
+			if (! el) {
+				el = document.createElement("DIV");
+				el.id = elId;
+			}
+		}
+
+		this.element = el;
+
+		if (el.id) {
+			this.id = el.id;
+		}
+
+		var childNodes = this.element.childNodes;
+
+		if (childNodes) {
+			for (var i=0;i<childNodes.length;i++) {
+				var child = childNodes[i];
+				switch (child.className) {
+					case YAHOO.widget.Module.CSS_HEADER:
+						this.header = child;
+						break;
+					case YAHOO.widget.Module.CSS_BODY:
+						this.body = child;
+						break;
+					case YAHOO.widget.Module.CSS_FOOTER:
+						this.footer = child;
+						break;
+				}
+			}
+		}
+
+		this.initDefaultConfig();
+
+		YAHOO.util.Dom.addClass(this.element, YAHOO.widget.Module.CSS_MODULE);
+
+		if (userConfig) {
+			this.cfg.applyConfig(userConfig, true);
+		}
+
+		// Subscribe to the fireQueue() method of Config so that any queued configuration changes are
+		// excecuted upon render of the Module
+		if (! YAHOO.util.Config.alreadySubscribed(this.renderEvent, this.cfg.fireQueue, this.cfg)) {
+			this.renderEvent.subscribe(this.cfg.fireQueue, this.cfg, true);
+		}
+
+		this.initEvent.fire(YAHOO.widget.Module);
+	},
+
+	/**
+	* Initialized an empty IFRAME that is placed out of the visible area that can be used to detect text resize.
+	* @method initResizeMonitor
+	*/
+	initResizeMonitor : function() {
+
+        if(this.browser != "opera") {
+
+            var resizeMonitor = document.getElementById("_yuiResizeMonitor");
+
+            if (! resizeMonitor) {
+
+                resizeMonitor = document.createElement("iframe");
+
+                var bIE = (this.browser.indexOf("ie") === 0);
+
+                if(this.isSecure &&
+                   YAHOO.widget.Module.RESIZE_MONITOR_SECURE_URL &&
+                   bIE) {
+
+                  resizeMonitor.src =
+                       YAHOO.widget.Module.RESIZE_MONITOR_SECURE_URL;
+
+                }
+
+                resizeMonitor.id = "_yuiResizeMonitor";
+                resizeMonitor.style.visibility = "hidden";
+
+                document.body.appendChild(resizeMonitor);
+
+                resizeMonitor.style.width = "10em";
+                resizeMonitor.style.height = "10em";
+                resizeMonitor.style.position = "absolute";
+
+                var nLeft = -1 * resizeMonitor.offsetWidth,
+                    nTop = -1 * resizeMonitor.offsetHeight;
+
+                resizeMonitor.style.top = nTop + "px";
+                resizeMonitor.style.left =  nLeft + "px";
+                resizeMonitor.style.borderStyle = "none";
+                resizeMonitor.style.borderWidth = "0";
+                YAHOO.util.Dom.setStyle(resizeMonitor, "opacity", "0");
+
+                resizeMonitor.style.visibility = "visible";
+
+                if(!bIE) {
+
+                    var doc = resizeMonitor.contentWindow.document;
+
+                    doc.open();
+                    doc.close();
+
+                }
+
+            }
+
+            if(resizeMonitor && resizeMonitor.contentWindow) {
+
+                this.resizeMonitor = resizeMonitor;
+
+                YAHOO.util.Event.addListener(this.resizeMonitor.contentWindow, "resize", this.onDomResize, this, true);
+
+            }
+
+        }
+
+	},
+
+	/**
+	* Event handler fired when the resize monitor element is resized.
+	* @method onDomResize
+	* @param {DOMEvent} e	The DOM resize event
+	* @param {Object} obj	The scope object passed to the handler
+	*/
+	onDomResize : function(e, obj) {
+
+        var nLeft = -1 * this.resizeMonitor.offsetWidth,
+            nTop = -1 * this.resizeMonitor.offsetHeight;
+
+        this.resizeMonitor.style.top = nTop + "px";
+        this.resizeMonitor.style.left =  nLeft + "px";
+
+	},
+
+	/**
+	* Sets the Module's header content to the HTML specified, or appends the passed element to the header. If no header is present, one will be automatically created.
+	* @method setHeader
+	* @param {String}	headerContent	The HTML used to set the header <em>OR</em>
+	* @param {HTMLElement}	headerContent	The HTMLElement to append to the header
+	*/
+	setHeader : function(headerContent) {
+		if (! this.header) {
+			this.header = document.createElement("DIV");
+			this.header.className = YAHOO.widget.Module.CSS_HEADER;
+		}
+
+		if (typeof headerContent == "string") {
+			this.header.innerHTML = headerContent;
+		} else {
+			this.header.innerHTML = "";
+			this.header.appendChild(headerContent);
+		}
+
+		this.changeHeaderEvent.fire(headerContent);
+		this.changeContentEvent.fire();
+	},
+
+	/**
+	* Appends the passed element to the header. If no header is present, one will be automatically created.
+	* @method appendToHeader
+	* @param {HTMLElement}	element	The element to append to the header
+	*/
+	appendToHeader : function(element) {
+		if (! this.header) {
+			this.header = document.createElement("DIV");
+			this.header.className = YAHOO.widget.Module.CSS_HEADER;
+		}
+
+		this.header.appendChild(element);
+		this.changeHeaderEvent.fire(element);
+		this.changeContentEvent.fire();
+	},
+
+	/**
+	* Sets the Module's body content to the HTML specified, or appends the passed element to the body. If no body is present, one will be automatically created.
+	* @method setBody
+	* @param {String}	bodyContent	The HTML used to set the body <em>OR</em>
+	* @param {HTMLElement}	bodyContent	The HTMLElement to append to the body
+	*/
+	setBody : function(bodyContent) {
+		if (! this.body) {
+			this.body = document.createElement("DIV");
+			this.body.className = YAHOO.widget.Module.CSS_BODY;
+		}
+
+		if (typeof bodyContent == "string")
+		{
+			this.body.innerHTML = bodyContent;
+		} else {
+			this.body.innerHTML = "";
+			this.body.appendChild(bodyContent);
+		}
+
+		this.changeBodyEvent.fire(bodyContent);
+		this.changeContentEvent.fire();
+	},
+
+	/**
+	* Appends the passed element to the body. If no body is present, one will be automatically created.
+	* @method appendToBody
+	* @param {HTMLElement}	element	The element to append to the body
+	*/
+	appendToBody : function(element) {
+		if (! this.body) {
+			this.body = document.createElement("DIV");
+			this.body.className = YAHOO.widget.Module.CSS_BODY;
+		}
+
+		this.body.appendChild(element);
+		this.changeBodyEvent.fire(element);
+		this.changeContentEvent.fire();
+	},
+
+	/**
+	* Sets the Module's footer content to the HTML specified, or appends the passed element to the footer. If no footer is present, one will be automatically created.
+	* @method setFooter
+	* @param {String}	footerContent	The HTML used to set the footer <em>OR</em>
+	* @param {HTMLElement}	footerContent	The HTMLElement to append to the footer
+	*/
+	setFooter : function(footerContent) {
+		if (! this.footer) {
+			this.footer = document.createElement("DIV");
+			this.footer.className = YAHOO.widget.Module.CSS_FOOTER;
+		}
+
+		if (typeof footerContent == "string") {
+			this.footer.innerHTML = footerContent;
+		} else {
+			this.footer.innerHTML = "";
+			this.footer.appendChild(footerContent);
+		}
+
+		this.changeFooterEvent.fire(footerContent);
+		this.changeContentEvent.fire();
+	},
+
+	/**
+	* Appends the passed element to the footer. If no footer is present, one will be automatically created.
+	* @method appendToFooter
+	* @param {HTMLElement}	element	The element to append to the footer
+	*/
+	appendToFooter : function(element) {
+		if (! this.footer) {
+			this.footer = document.createElement("DIV");
+			this.footer.className = YAHOO.widget.Module.CSS_FOOTER;
+		}
+
+		this.footer.appendChild(element);
+		this.changeFooterEvent.fire(element);
+		this.changeContentEvent.fire();
+	},
+
+	/**
+	* Renders the Module by inserting the elements that are not already in the main Module into their correct places. Optionally appends the Module to the specified node prior to the render's execution. NOTE: For Modules without existing markup, the appendToNode argument is REQUIRED. If this argument is ommitted and the current element is not present in the document, the function will return false, indicating that the render was a failure.
+	* @method render
+	* @param {String}	appendToNode	The element id to which the Module should be appended to prior to rendering <em>OR</em>
+	* @param {HTMLElement}	appendToNode	The element to which the Module should be appended to prior to rendering
+	* @param {HTMLElement}	moduleElement	OPTIONAL. The element that represents the actual Standard Module container.
+	* @return {Boolean} Success or failure of the render
+	*/
+	render : function(appendToNode, moduleElement) {
+		this.beforeRenderEvent.fire();
+
+		if (! moduleElement) {
+			moduleElement = this.element;
+		}
+
+		var me = this;
+		var appendTo = function(element) {
+			if (typeof element == "string") {
+				element = document.getElementById(element);
+			}
+
+			if (element) {
+				element.appendChild(me.element);
+				me.appendEvent.fire();
+			}
+		};
+
+		if (appendToNode) {
+			appendTo(appendToNode);
+		} else { // No node was passed in. If the element is not pre-marked up, this fails
+			if (! YAHOO.util.Dom.inDocument(this.element)) {
+				return false;
+			}
+		}
+
+		// Need to get everything into the DOM if it isn't already
+
+		if (this.header && ! YAHOO.util.Dom.inDocument(this.header)) {
+			// There is a header, but it's not in the DOM yet... need to add it
+			var firstChild = moduleElement.firstChild;
+			if (firstChild) { // Insert before first child if exists
+				moduleElement.insertBefore(this.header, firstChild);
+			} else { // Append to empty body because there are no children
+				moduleElement.appendChild(this.header);
+			}
+		}
+
+		if (this.body && ! YAHOO.util.Dom.inDocument(this.body)) {
+			// There is a body, but it's not in the DOM yet... need to add it
+			if (this.footer && YAHOO.util.Dom.isAncestor(this.moduleElement, this.footer)) { // Insert before footer if exists in DOM
+				moduleElement.insertBefore(this.body, this.footer);
+			} else { // Append to element because there is no footer
+				moduleElement.appendChild(this.body);
+			}
+		}
+
+		if (this.footer && ! YAHOO.util.Dom.inDocument(this.footer)) {
+			// There is a footer, but it's not in the DOM yet... need to add it
+			moduleElement.appendChild(this.footer);
+		}
+
+		this.renderEvent.fire();
+		return true;
+	},
+
+	/**
+	* Removes the Module element from the DOM and sets all child elements to null.
+	* @method destroy
+	*/
+	destroy : function() {
+		if (this.element) {
+			var parent = this.element.parentNode;
+		}
+		if (parent) {
+			parent.removeChild(this.element);
+		}
+
+		this.element = null;
+		this.header = null;
+		this.body = null;
+		this.footer = null;
+
+		this.destroyEvent.fire();
+	},
+
+	/**
+	* Shows the Module element by setting the visible configuration property to true. Also fires two events: beforeShowEvent prior to the visibility change, and showEvent after.
+	* @method show
+	*/
+	show : function() {
+		this.cfg.setProperty("visible", true);
+	},
+
+	/**
+	* Hides the Module element by setting the visible configuration property to false. Also fires two events: beforeHideEvent prior to the visibility change, and hideEvent after.
+	* @method hide
+	*/
+	hide : function() {
+		this.cfg.setProperty("visible", false);
+	},
+
+	// BUILT-IN EVENT HANDLERS FOR MODULE //
+
+	/**
+	* Default event handler for changing the visibility property of a Module. By default, this is achieved by switching the "display" style between "block" and "none".
+	* This method is responsible for firing showEvent and hideEvent.
+	* @param {String} type	The CustomEvent type (usually the property name)
+	* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+	* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+	* @method configVisible
+	*/
+	configVisible : function(type, args, obj) {
+		var visible = args[0];
+		if (visible) {
+			this.beforeShowEvent.fire();
+			YAHOO.util.Dom.setStyle(this.element, "display", "block");
+			this.showEvent.fire();
+		} else {
+			this.beforeHideEvent.fire();
+			YAHOO.util.Dom.setStyle(this.element, "display", "none");
+			this.hideEvent.fire();
+		}
+	},
+
+	/**
+	* Default event handler for the "monitorresize" configuration property
+	* @param {String} type	The CustomEvent type (usually the property name)
+	* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+	* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+	* @method configMonitorResize
+	*/
+	configMonitorResize : function(type, args, obj) {
+		var monitor = args[0];
+		if (monitor) {
+			this.initResizeMonitor();
+		} else {
+			YAHOO.util.Event.removeListener(this.resizeMonitor, "resize", this.onDomResize);
+			this.resizeMonitor = null;
+		}
+	}
+};
+
+/**
+* Returns a String representation of the Object.
+* @method toString
+* @return {String}	The string representation of the Module
+*/
+YAHOO.widget.Module.prototype.toString = function() {
+	return "Module " + this.id;
+};
+
+/**
+* Overlay is a Module that is absolutely positioned above the page flow. It has convenience methods for positioning and sizing, as well as options for controlling zIndex and constraining the Overlay's position to the current visible viewport. Overlay also contains a dynamicly generated IFRAME which is placed beneath it for Internet Explorer 6 and 5.x so that it will be properly rendered above SELECT elements.
+* @class Overlay
+* @namespace YAHOO.widget
+* @extends YAHOO.widget.Module
+* @param {String}	el	The element ID representing the Overlay <em>OR</em>
+* @param {HTMLElement}	el	The element representing the Overlay
+* @param {Object}	userConfig	The configuration object literal containing 10/23/2006the configuration that should be set for this Overlay. See configuration documentation for more details.
+* @constructor
+*/
+YAHOO.widget.Overlay = function(el, userConfig) {
+	YAHOO.widget.Overlay.superclass.constructor.call(this, el, userConfig);
+};
+
+YAHOO.extend(YAHOO.widget.Overlay, YAHOO.widget.Module);
+
+/**
+* The URL that will be placed in the iframe
+* @property YAHOO.widget.Overlay.IFRAME_SRC
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Overlay.IFRAME_SRC = "javascript:false;"
+
+/**
+* Constant representing the top left corner of an element, used for configuring the context element alignment
+* @property YAHOO.widget.Overlay.TOP_LEFT
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Overlay.TOP_LEFT = "tl";
+
+/**
+* Constant representing the top right corner of an element, used for configuring the context element alignment
+* @property YAHOO.widget.Overlay.TOP_RIGHT
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Overlay.TOP_RIGHT = "tr";
+
+/**
+* Constant representing the top bottom left corner of an element, used for configuring the context element alignment
+* @property YAHOO.widget.Overlay.BOTTOM_LEFT
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Overlay.BOTTOM_LEFT = "bl";
+
+/**
+* Constant representing the bottom right corner of an element, used for configuring the context element alignment
+* @property YAHOO.widget.Overlay.BOTTOM_RIGHT
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Overlay.BOTTOM_RIGHT = "br";
+
+/**
+* Constant representing the default CSS class used for an Overlay
+* @property YAHOO.widget.Overlay.CSS_OVERLAY
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Overlay.CSS_OVERLAY = "overlay";
+
+/**
+* The Overlay initialization method, which is executed for Overlay and all of its subclasses. This method is automatically called by the constructor, and  sets up all DOM references for pre-existing markup, and creates required markup if it is not already present.
+* @method init
+* @param {String}	el	The element ID representing the Overlay <em>OR</em>
+* @param {HTMLElement}	el	The element representing the Overlay
+* @param {Object}	userConfig	The configuration object literal containing the configuration that should be set for this Overlay. See configuration documentation for more details.
+*/
+YAHOO.widget.Overlay.prototype.init = function(el, userConfig) {
+	YAHOO.widget.Overlay.superclass.init.call(this, el/*, userConfig*/);  // Note that we don't pass the user config in here yet because we only want it executed once, at the lowest subclass level
+
+	this.beforeInitEvent.fire(YAHOO.widget.Overlay);
+
+	YAHOO.util.Dom.addClass(this.element, YAHOO.widget.Overlay.CSS_OVERLAY);
+
+	if (userConfig) {
+		this.cfg.applyConfig(userConfig, true);
+	}
+
+	if (this.platform == "mac" && this.browser == "gecko") {
+		if (! YAHOO.util.Config.alreadySubscribed(this.showEvent,this.showMacGeckoScrollbars,this)) {
+			this.showEvent.subscribe(this.showMacGeckoScrollbars,this,true);
+		}
+		if (! YAHOO.util.Config.alreadySubscribed(this.hideEvent,this.hideMacGeckoScrollbars,this)) {
+			this.hideEvent.subscribe(this.hideMacGeckoScrollbars,this,true);
+		}
+	}
+
+	this.initEvent.fire(YAHOO.widget.Overlay);
+};
+
+/**
+* Initializes the custom events for Overlay which are fired automatically at appropriate times by the Overlay class.
+* @method initEvents
+*/
+YAHOO.widget.Overlay.prototype.initEvents = function() {
+	YAHOO.widget.Overlay.superclass.initEvents.call(this);
+
+	/**
+	* CustomEvent fired before the Overlay is moved.
+	* @event beforeMoveEvent
+	* @param {Number} x	x coordinate
+	* @param {Number} y	y coordinate
+	*/
+	this.beforeMoveEvent = new YAHOO.util.CustomEvent("beforeMove", this);
+
+	/**
+	* CustomEvent fired after the Overlay is moved.
+	* @event moveEvent
+	* @param {Number} x	x coordinate
+	* @param {Number} y	y coordinate
+	*/
+	this.moveEvent = new YAHOO.util.CustomEvent("move", this);
+};
+
+/**
+* Initializes the class's configurable properties which can be changed using the Overlay's Config object (cfg).
+* @method initDefaultConfig
+*/
+YAHOO.widget.Overlay.prototype.initDefaultConfig = function() {
+	YAHOO.widget.Overlay.superclass.initDefaultConfig.call(this);
+
+	// Add overlay config properties //
+
+	/**
+	* The absolute x-coordinate position of the Overlay
+	* @config x
+	* @type Number
+	* @default null
+	*/
+	this.cfg.addProperty("x", { handler:this.configX, validator:this.cfg.checkNumber, suppressEvent:true, supercedes:["iframe"] } );
+
+	/**
+	* The absolute y-coordinate position of the Overlay
+	* @config y
+	* @type Number
+	* @default null
+	*/
+	this.cfg.addProperty("y", { handler:this.configY, validator:this.cfg.checkNumber, suppressEvent:true, supercedes:["iframe"] } );
+
+	/**
+	* An array with the absolute x and y positions of the Overlay
+	* @config xy
+	* @type Number[]
+	* @default null
+	*/
+	this.cfg.addProperty("xy",{ handler:this.configXY, suppressEvent:true, supercedes:["iframe"] } );
+
+	/**
+	* The array of context arguments for context-sensitive positioning. The format is: [id or element, element corner, context corner]. For example, setting this property to ["img1", "tl", "bl"] would align the Overlay's top left corner to the context element's bottom left corner.
+	* @config context
+	* @type Array
+	* @default null
+	*/
+	this.cfg.addProperty("context",	{ handler:this.configContext, suppressEvent:true, supercedes:["iframe"] } );
+
+	/**
+	* True if the Overlay should be anchored to the center of the viewport.
+	* @config fixedcenter
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("fixedcenter", { value:false, handler:this.configFixedCenter, validator:this.cfg.checkBoolean, supercedes:["iframe","visible"] } );
+
+	/**
+	* CSS width of the Overlay.
+	* @config width
+	* @type String
+	* @default null
+	*/
+	this.cfg.addProperty("width", { handler:this.configWidth, suppressEvent:true, supercedes:["iframe"] } );
+
+	/**
+	* CSS height of the Overlay.
+	* @config height
+	* @type String
+	* @default null
+	*/
+	this.cfg.addProperty("height", { handler:this.configHeight, suppressEvent:true, supercedes:["iframe"] } );
+
+	/**
+	* CSS z-index of the Overlay.
+	* @config zIndex
+	* @type Number
+	* @default null
+	*/
+	this.cfg.addProperty("zIndex", { value:null, handler:this.configzIndex } );
+
+	/**
+	* True if the Overlay should be prevented from being positioned out of the viewport.
+	* @config constraintoviewport
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("constraintoviewport", { value:false, handler:this.configConstrainToViewport, validator:this.cfg.checkBoolean, supercedes:["iframe","x","y","xy"] } );
+
+	/**
+	* True if the Overlay should have an IFRAME shim (for correcting the select z-index bug in IE6 and below).
+	* @config iframe
+	* @type Boolean
+	* @default true for IE6 and below, false for all others
+	*/
+	this.cfg.addProperty("iframe", { value:(this.browser == "ie" ? true : false), handler:this.configIframe, validator:this.cfg.checkBoolean, supercedes:["zIndex"] } );
+};
+
+/**
+* Moves the Overlay to the specified position. This function is identical to calling this.cfg.setProperty("xy", [x,y]);
+* @method moveTo
+* @param {Number}	x	The Overlay's new x position
+* @param {Number}	y	The Overlay's new y position
+*/
+YAHOO.widget.Overlay.prototype.moveTo = function(x, y) {
+	this.cfg.setProperty("xy",[x,y]);
+};
+
+/**
+* Adds a special CSS class to the Overlay when Mac/Gecko is in use, to work around a Gecko bug where
+* scrollbars cannot be hidden. See https://bugzilla.mozilla.org/show_bug.cgi?id=187435
+* @method hideMacGeckoScrollbars
+*/
+YAHOO.widget.Overlay.prototype.hideMacGeckoScrollbars = function() {
+	YAHOO.util.Dom.removeClass(this.element, "show-scrollbars");
+	YAHOO.util.Dom.addClass(this.element, "hide-scrollbars");
+};
+
+/**
+* Removes a special CSS class from the Overlay when Mac/Gecko is in use, to work around a Gecko bug where
+* scrollbars cannot be hidden. See https://bugzilla.mozilla.org/show_bug.cgi?id=187435
+* @method showMacGeckoScrollbars
+*/
+YAHOO.widget.Overlay.prototype.showMacGeckoScrollbars = function() {
+	YAHOO.util.Dom.removeClass(this.element, "hide-scrollbars");
+	YAHOO.util.Dom.addClass(this.element, "show-scrollbars");
+};
+
+// BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
+
+/**
+* The default event handler fired when the "visible" property is changed. This method is responsible for firing showEvent and hideEvent.
+* @method configVisible
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configVisible = function(type, args, obj) {
+	var visible = args[0];
+
+	var currentVis = YAHOO.util.Dom.getStyle(this.element, "visibility");
+
+	if (currentVis == "inherit") {
+		var e = this.element.parentNode;
+		while (e.nodeType != 9 && e.nodeType != 11) {
+			currentVis = YAHOO.util.Dom.getStyle(e, "visibility");
+			if (currentVis != "inherit") { break; }
+			e = e.parentNode;
+		}
+		if (currentVis == "inherit") {
+			currentVis = "visible";
+		}
+	}
+
+	var effect = this.cfg.getProperty("effect");
+
+	var effectInstances = [];
+	if (effect) {
+		if (effect instanceof Array) {
+			for (var i=0;i<effect.length;i++) {
+				var eff = effect[i];
+				effectInstances[effectInstances.length] = eff.effect(this, eff.duration);
+			}
+		} else {
+			effectInstances[effectInstances.length] = effect.effect(this, effect.duration);
+		}
+	}
+
+	var isMacGecko = (this.platform == "mac" && this.browser == "gecko");
+
+	if (visible) { // Show
+		if (isMacGecko) {
+			this.showMacGeckoScrollbars();
+		}
+
+		if (effect) { // Animate in
+			if (visible) { // Animate in if not showing
+				if (currentVis != "visible" || currentVis === "") {
+					this.beforeShowEvent.fire();
+					for (var j=0;j<effectInstances.length;j++) {
+						var ei = effectInstances[j];
+						if (j === 0 && ! YAHOO.util.Config.alreadySubscribed(ei.animateInCompleteEvent,this.showEvent.fire,this.showEvent)) {
+							ei.animateInCompleteEvent.subscribe(this.showEvent.fire,this.showEvent,true); // Delegate showEvent until end of animateInComplete
+						}
+						ei.animateIn();
+					}
+				}
+			}
+		} else { // Show
+			if (currentVis != "visible" || currentVis === "") {
+				this.beforeShowEvent.fire();
+				YAHOO.util.Dom.setStyle(this.element, "visibility", "visible");
+				this.cfg.refireEvent("iframe");
+				this.showEvent.fire();
+			}
+		}
+
+	} else { // Hide
+		if (isMacGecko) {
+			this.hideMacGeckoScrollbars();
+		}
+
+		if (effect) { // Animate out if showing
+			if (currentVis == "visible") {
+				this.beforeHideEvent.fire();
+				for (var k=0;k<effectInstances.length;k++) {
+					var h = effectInstances[k];
+					if (k === 0 && ! YAHOO.util.Config.alreadySubscribed(h.animateOutCompleteEvent,this.hideEvent.fire,this.hideEvent)) {
+						h.animateOutCompleteEvent.subscribe(this.hideEvent.fire,this.hideEvent,true); // Delegate hideEvent until end of animateOutComplete
+					}
+					h.animateOut();
+				}
+			} else if (currentVis === "") {
+				YAHOO.util.Dom.setStyle(this.element, "visibility", "hidden");
+			}
+		} else { // Simple hide
+			if (currentVis == "visible" || currentVis === "") {
+				this.beforeHideEvent.fire();
+				YAHOO.util.Dom.setStyle(this.element, "visibility", "hidden");
+				this.cfg.refireEvent("iframe");
+				this.hideEvent.fire();
+			}
+		}
+	}
+};
+
+/**
+* Center event handler used for centering on scroll/resize, but only if the Overlay is visible
+* @method doCenterOnDOMEvent
+*/
+YAHOO.widget.Overlay.prototype.doCenterOnDOMEvent = function() {
+	if (this.cfg.getProperty("visible")) {
+		this.center();
+	}
+};
+
+/**
+* The default event handler fired when the "fixedcenter" property is changed.
+* @method configFixedCenter
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configFixedCenter = function(type, args, obj) {
+	var val = args[0];
+
+	if (val) {
+		this.center();
+
+		if (! YAHOO.util.Config.alreadySubscribed(this.beforeShowEvent, this.center, this)) {
+			this.beforeShowEvent.subscribe(this.center, this, true);
+		}
+
+		if (! YAHOO.util.Config.alreadySubscribed(YAHOO.widget.Overlay.windowResizeEvent, this.doCenterOnDOMEvent, this)) {
+			YAHOO.widget.Overlay.windowResizeEvent.subscribe(this.doCenterOnDOMEvent, this, true);
+		}
+
+		if (! YAHOO.util.Config.alreadySubscribed(YAHOO.widget.Overlay.windowScrollEvent, this.doCenterOnDOMEvent, this)) {
+			YAHOO.widget.Overlay.windowScrollEvent.subscribe( this.doCenterOnDOMEvent, this, true);
+		}
+	} else {
+		YAHOO.widget.Overlay.windowResizeEvent.unsubscribe(this.doCenterOnDOMEvent, this);
+		YAHOO.widget.Overlay.windowScrollEvent.unsubscribe(this.doCenterOnDOMEvent, this);
+	}
+};
+
+/**
+* The default event handler fired when the "height" property is changed.
+* @method configHeight
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configHeight = function(type, args, obj) {
+	var height = args[0];
+	var el = this.element;
+	YAHOO.util.Dom.setStyle(el, "height", height);
+	this.cfg.refireEvent("iframe");
+};
+
+/**
+* The default event handler fired when the "width" property is changed.
+* @method configWidth
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configWidth = function(type, args, obj) {
+	var width = args[0];
+	var el = this.element;
+	YAHOO.util.Dom.setStyle(el, "width", width);
+	this.cfg.refireEvent("iframe");
+};
+
+/**
+* The default event handler fired when the "zIndex" property is changed.
+* @method configzIndex
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configzIndex = function(type, args, obj) {
+	var zIndex = args[0];
+
+	var el = this.element;
+
+	if (! zIndex) {
+		zIndex = YAHOO.util.Dom.getStyle(el, "zIndex");
+		if (! zIndex || isNaN(zIndex)) {
+			zIndex = 0;
+		}
+	}
+
+	if (this.iframe) {
+		if (zIndex <= 0) {
+			zIndex = 1;
+		}
+		YAHOO.util.Dom.setStyle(this.iframe, "zIndex", (zIndex-1));
+	}
+
+	YAHOO.util.Dom.setStyle(el, "zIndex", zIndex);
+	this.cfg.setProperty("zIndex", zIndex, true);
+};
+
+/**
+* The default event handler fired when the "xy" property is changed.
+* @method configXY
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configXY = function(type, args, obj) {
+	var pos = args[0];
+	var x = pos[0];
+	var y = pos[1];
+
+	this.cfg.setProperty("x", x);
+	this.cfg.setProperty("y", y);
+
+	this.beforeMoveEvent.fire([x,y]);
+
+	x = this.cfg.getProperty("x");
+	y = this.cfg.getProperty("y");
+
+	this.cfg.refireEvent("iframe");
+	this.moveEvent.fire([x,y]);
+};
+
+/**
+* The default event handler fired when the "x" property is changed.
+* @method configX
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configX = function(type, args, obj) {
+	var x = args[0];
+	var y = this.cfg.getProperty("y");
+
+	this.cfg.setProperty("x", x, true);
+	this.cfg.setProperty("y", y, true);
+
+	this.beforeMoveEvent.fire([x,y]);
+
+	x = this.cfg.getProperty("x");
+	y = this.cfg.getProperty("y");
+
+	YAHOO.util.Dom.setX(this.element, x, true);
+
+	this.cfg.setProperty("xy", [x, y], true);
+
+	this.cfg.refireEvent("iframe");
+	this.moveEvent.fire([x, y]);
+};
+
+/**
+* The default event handler fired when the "y" property is changed.
+* @method configY
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configY = function(type, args, obj) {
+	var x = this.cfg.getProperty("x");
+	var y = args[0];
+
+	this.cfg.setProperty("x", x, true);
+	this.cfg.setProperty("y", y, true);
+
+	this.beforeMoveEvent.fire([x,y]);
+
+	x = this.cfg.getProperty("x");
+	y = this.cfg.getProperty("y");
+
+	YAHOO.util.Dom.setY(this.element, y, true);
+
+	this.cfg.setProperty("xy", [x, y], true);
+
+	this.cfg.refireEvent("iframe");
+	this.moveEvent.fire([x, y]);
+};
+
+/**
+* Shows the iframe shim, if it has been enabled
+* @method showIframe
+*/
+YAHOO.widget.Overlay.prototype.showIframe = function() {
+	if (this.iframe) {
+		this.iframe.style.display = "block";
+	}
+};
+
+/**
+* Hides the iframe shim, if it has been enabled
+* @method hideIframe
+*/
+YAHOO.widget.Overlay.prototype.hideIframe = function() {
+	if (this.iframe) {
+		this.iframe.style.display = "none";
+	}
+};
+
+/**
+* The default event handler fired when the "iframe" property is changed.
+* @method configIframe
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configIframe = function(type, args, obj) {
+
+	var val = args[0];
+
+	if (val) { // IFRAME shim is enabled
+
+		if (! YAHOO.util.Config.alreadySubscribed(this.showEvent, this.showIframe, this)) {
+			this.showEvent.subscribe(this.showIframe, this, true);
+		}
+		if (! YAHOO.util.Config.alreadySubscribed(this.hideEvent, this.hideIframe, this)) {
+			this.hideEvent.subscribe(this.hideIframe, this, true);
+		}
+
+		var x = this.cfg.getProperty("x");
+		var y = this.cfg.getProperty("y");
+
+		if (! x || ! y) {
+			this.syncPosition();
+			x = this.cfg.getProperty("x");
+			y = this.cfg.getProperty("y");
+		}
+
+		if (! isNaN(x) && ! isNaN(y)) {
+			if (! this.iframe) {
+				this.iframe = document.createElement("iframe");
+				if (this.isSecure) {
+					this.iframe.src = this.imageRoot + YAHOO.widget.Overlay.IFRAME_SRC;
+				}
+
+				var parent = this.element.parentNode;
+				if (parent) {
+					parent.appendChild(this.iframe);
+				} else {
+					document.body.appendChild(this.iframe);
+				}
+
+				YAHOO.util.Dom.setStyle(this.iframe, "position", "absolute");
+				YAHOO.util.Dom.setStyle(this.iframe, "border", "none");
+				YAHOO.util.Dom.setStyle(this.iframe, "margin", "0");
+				YAHOO.util.Dom.setStyle(this.iframe, "padding", "0");
+				YAHOO.util.Dom.setStyle(this.iframe, "opacity", "0");
+				if (this.cfg.getProperty("visible")) {
+					this.showIframe();
+				} else {
+					this.hideIframe();
+				}
+			}
+
+			var iframeDisplay = YAHOO.util.Dom.getStyle(this.iframe, "display");
+
+			if (iframeDisplay == "none") {
+				this.iframe.style.display = "block";
+			}
+
+			YAHOO.util.Dom.setXY(this.iframe, [x,y]);
+
+			var width = this.element.clientWidth;
+			var height = this.element.clientHeight;
+
+			YAHOO.util.Dom.setStyle(this.iframe, "width", (width+2) + "px");
+			YAHOO.util.Dom.setStyle(this.iframe, "height", (height+2) + "px");
+
+			if (iframeDisplay == "none") {
+				this.iframe.style.display = "none";
+			}
+		}
+	} else {
+		if (this.iframe) {
+			this.iframe.style.display = "none";
+		}
+		this.showEvent.unsubscribe(this.showIframe, this);
+		this.hideEvent.unsubscribe(this.hideIframe, this);
+	}
+};
+
+
+/**
+* The default event handler fired when the "constraintoviewport" property is changed.
+* @method configConstrainToViewport
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configConstrainToViewport = function(type, args, obj) {
+	var val = args[0];
+	if (val) {
+		if (! YAHOO.util.Config.alreadySubscribed(this.beforeMoveEvent, this.enforceConstraints, this)) {
+			this.beforeMoveEvent.subscribe(this.enforceConstraints, this, true);
+		}
+	} else {
+		this.beforeMoveEvent.unsubscribe(this.enforceConstraints, this);
+	}
+};
+
+/**
+* The default event handler fired when the "context" property is changed.
+* @method configContext
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.configContext = function(type, args, obj) {
+	var contextArgs = args[0];
+
+	if (contextArgs) {
+		var contextEl = contextArgs[0];
+		var elementMagnetCorner = contextArgs[1];
+		var contextMagnetCorner = contextArgs[2];
+
+		if (contextEl) {
+			if (typeof contextEl == "string") {
+				this.cfg.setProperty("context", [document.getElementById(contextEl),elementMagnetCorner,contextMagnetCorner], true);
+			}
+
+			if (elementMagnetCorner && contextMagnetCorner) {
+				this.align(elementMagnetCorner, contextMagnetCorner);
+			}
+		}
+	}
+};
+
+
+// END BUILT-IN PROPERTY EVENT HANDLERS //
+
+/**
+* Aligns the Overlay to its context element using the specified corner points (represented by the constants TOP_LEFT, TOP_RIGHT, BOTTOM_LEFT, and BOTTOM_RIGHT.
+* @method align
+* @param {String} elementAlign		The String representing the corner of the Overlay that should be aligned to the context element
+* @param {String} contextAlign		The corner of the context element that the elementAlign corner should stick to.
+*/
+YAHOO.widget.Overlay.prototype.align = function(elementAlign, contextAlign) {
+	var contextArgs = this.cfg.getProperty("context");
+	if (contextArgs) {
+		var context = contextArgs[0];
+
+		var element = this.element;
+		var me = this;
+
+		if (! elementAlign) {
+			elementAlign = contextArgs[1];
+		}
+
+		if (! contextAlign) {
+			contextAlign = contextArgs[2];
+		}
+
+		if (element && context) {
+			var elementRegion = YAHOO.util.Dom.getRegion(element);
+			var contextRegion = YAHOO.util.Dom.getRegion(context);
+
+			var doAlign = function(v,h) {
+				switch (elementAlign) {
+					case YAHOO.widget.Overlay.TOP_LEFT:
+						me.moveTo(h,v);
+						break;
+					case YAHOO.widget.Overlay.TOP_RIGHT:
+						me.moveTo(h-element.offsetWidth,v);
+						break;
+					case YAHOO.widget.Overlay.BOTTOM_LEFT:
+						me.moveTo(h,v-element.offsetHeight);
+						break;
+					case YAHOO.widget.Overlay.BOTTOM_RIGHT:
+						me.moveTo(h-element.offsetWidth,v-element.offsetHeight);
+						break;
+				}
+			};
+
+			switch (contextAlign) {
+				case YAHOO.widget.Overlay.TOP_LEFT:
+					doAlign(contextRegion.top, contextRegion.left);
+					break;
+				case YAHOO.widget.Overlay.TOP_RIGHT:
+					doAlign(contextRegion.top, contextRegion.right);
+					break;
+				case YAHOO.widget.Overlay.BOTTOM_LEFT:
+					doAlign(contextRegion.bottom, contextRegion.left);
+					break;
+				case YAHOO.widget.Overlay.BOTTOM_RIGHT:
+					doAlign(contextRegion.bottom, contextRegion.right);
+					break;
+			}
+		}
+	}
+};
+
+/**
+* The default event handler executed when the moveEvent is fired, if the "constraintoviewport" is set to true.
+* @method enforceConstraints
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Overlay.prototype.enforceConstraints = function(type, args, obj) {
+	var pos = args[0];
+
+	var x = pos[0];
+	var y = pos[1];
+
+	var offsetHeight = this.element.offsetHeight;
+	var offsetWidth = this.element.offsetWidth;
+
+	var viewPortWidth = YAHOO.util.Dom.getViewportWidth();
+	var viewPortHeight = YAHOO.util.Dom.getViewportHeight();
+
+	var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft;
+	var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
+
+	var topConstraint = scrollY + 10;
+	var leftConstraint = scrollX + 10;
+	var bottomConstraint = scrollY + viewPortHeight - offsetHeight - 10;
+	var rightConstraint = scrollX + viewPortWidth - offsetWidth - 10;
+
+	if (x < leftConstraint) {
+		x = leftConstraint;
+	} else if (x > rightConstraint) {
+		x = rightConstraint;
+	}
+
+	if (y < topConstraint) {
+		y = topConstraint;
+	} else if (y > bottomConstraint) {
+		y = bottomConstraint;
+	}
+
+	this.cfg.setProperty("x", x, true);
+	this.cfg.setProperty("y", y, true);
+	this.cfg.setProperty("xy", [x,y], true);
+};
+
+/**
+* Centers the container in the viewport.
+* @method center
+*/
+YAHOO.widget.Overlay.prototype.center = function() {
+	var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft;
+	var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
+
+	var viewPortWidth = YAHOO.util.Dom.getClientWidth();
+	var viewPortHeight = YAHOO.util.Dom.getClientHeight();
+
+	var elementWidth = this.element.offsetWidth;
+	var elementHeight = this.element.offsetHeight;
+
+	var x = (viewPortWidth / 2) - (elementWidth / 2) + scrollX;
+	var y = (viewPortHeight / 2) - (elementHeight / 2) + scrollY;
+
+	this.cfg.setProperty("xy", [parseInt(x, 10), parseInt(y, 10)]);
+
+	this.cfg.refireEvent("iframe");
+};
+
+/**
+* Synchronizes the Panel's "xy", "x", and "y" properties with the Panel's position in the DOM. This is primarily used to update position information during drag & drop.
+* @method syncPosition
+*/
+YAHOO.widget.Overlay.prototype.syncPosition = function() {
+	var pos = YAHOO.util.Dom.getXY(this.element);
+	this.cfg.setProperty("x", pos[0], true);
+	this.cfg.setProperty("y", pos[1], true);
+	this.cfg.setProperty("xy", pos, true);
+};
+
+/**
+* Event handler fired when the resize monitor element is resized.
+* @method onDomResize
+* @param {DOMEvent} e	The resize DOM event
+* @param {Object} obj	The scope object
+*/
+YAHOO.widget.Overlay.prototype.onDomResize = function(e, obj) {
+	YAHOO.widget.Overlay.superclass.onDomResize.call(this, e, obj);
+	var me = this;
+	setTimeout(function() {
+		me.syncPosition();
+		me.cfg.refireEvent("iframe");
+		me.cfg.refireEvent("context");
+	}, 0);
+};
+
+/**
+* Removes the Overlay element from the DOM and sets all child elements to null.
+* @method destroy
+*/
+YAHOO.widget.Overlay.prototype.destroy = function() {
+	if (this.iframe) {
+		this.iframe.parentNode.removeChild(this.iframe);
+	}
+
+	this.iframe = null;
+
+	YAHOO.widget.Overlay.superclass.destroy.call(this);
+};
+
+/**
+* Returns a String representation of the object.
+* @method toString
+* @return {String} The string representation of the Overlay.
+*/
+YAHOO.widget.Overlay.prototype.toString = function() {
+	return "Overlay " + this.id;
+};
+
+/**
+* A singleton CustomEvent used for reacting to the DOM event for window scroll
+* @event YAHOO.widget.Overlay.windowScrollEvent
+*/
+YAHOO.widget.Overlay.windowScrollEvent = new YAHOO.util.CustomEvent("windowScroll");
+
+/**
+* A singleton CustomEvent used for reacting to the DOM event for window resize
+* @event YAHOO.widget.Overlay.windowResizeEvent
+*/
+YAHOO.widget.Overlay.windowResizeEvent = new YAHOO.util.CustomEvent("windowResize");
+
+/**
+* The DOM event handler used to fire the CustomEvent for window scroll
+* @method YAHOO.widget.Overlay.windowScrollHandler
+* @static
+* @param {DOMEvent} e The DOM scroll event
+*/
+YAHOO.widget.Overlay.windowScrollHandler = function(e) {
+	if (YAHOO.widget.Module.prototype.browser == "ie" || YAHOO.widget.Module.prototype.browser == "ie7") {
+		if (! window.scrollEnd) {
+			window.scrollEnd = -1;
+		}
+		clearTimeout(window.scrollEnd);
+		window.scrollEnd = setTimeout(function() { YAHOO.widget.Overlay.windowScrollEvent.fire(); }, 1);
+	} else {
+		YAHOO.widget.Overlay.windowScrollEvent.fire();
+	}
+};
+
+/**
+* The DOM event handler used to fire the CustomEvent for window resize
+* @method YAHOO.widget.Overlay.windowResizeHandler
+* @static
+* @param {DOMEvent} e The DOM resize event
+*/
+YAHOO.widget.Overlay.windowResizeHandler = function(e) {
+	if (YAHOO.widget.Module.prototype.browser == "ie" || YAHOO.widget.Module.prototype.browser == "ie7") {
+		if (! window.resizeEnd) {
+			window.resizeEnd = -1;
+		}
+		clearTimeout(window.resizeEnd);
+		window.resizeEnd = setTimeout(function() { YAHOO.widget.Overlay.windowResizeEvent.fire(); }, 100);
+	} else {
+		YAHOO.widget.Overlay.windowResizeEvent.fire();
+	}
+};
+
+/**
+* A boolean that indicated whether the window resize and scroll events have already been subscribed to.
+* @property YAHOO.widget.Overlay._initialized
+* @private
+* @type Boolean
+*/
+YAHOO.widget.Overlay._initialized = null;
+
+if (YAHOO.widget.Overlay._initialized === null) {
+	YAHOO.util.Event.addListener(window, "scroll", YAHOO.widget.Overlay.windowScrollHandler);
+	YAHOO.util.Event.addListener(window, "resize", YAHOO.widget.Overlay.windowResizeHandler);
+
+	YAHOO.widget.Overlay._initialized = true;
+}
+
+/**
+* OverlayManager is used for maintaining the focus status of multiple Overlays.* @namespace YAHOO.widget
+* @namespace YAHOO.widget
+* @class OverlayManager
+* @constructor
+* @param {Array}	overlays	Optional. A collection of Overlays to register with the manager.
+* @param {Object}	userConfig		The object literal representing the user configuration of the OverlayManager
+*/
+YAHOO.widget.OverlayManager = function(userConfig) {
+	this.init(userConfig);
+};
+
+/**
+* The CSS class representing a focused Overlay
+* @property YAHOO.widget.OverlayManager.CSS_FOCUSED
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.OverlayManager.CSS_FOCUSED = "focused";
+
+YAHOO.widget.OverlayManager.prototype = {
+	/**
+	* The class's constructor function
+	* @property contructor
+	* @type Function
+	*/
+	constructor : YAHOO.widget.OverlayManager,
+
+	/**
+	* The array of Overlays that are currently registered
+	* @property overlays
+	* @type YAHOO.widget.Overlay[]
+	*/
+	overlays : null,
+
+	/**
+	* Initializes the default configuration of the OverlayManager
+	* @method initDefaultConfig
+	*/
+	initDefaultConfig : function() {
+		/**
+		* The collection of registered Overlays in use by the OverlayManager
+		* @config overlays
+		* @type YAHOO.widget.Overlay[]
+		* @default null
+		*/
+		this.cfg.addProperty("overlays", { suppressEvent:true } );
+
+		/**
+		* The default DOM event that should be used to focus an Overlay
+		* @config focusevent
+		* @type String
+		* @default "mousedown"
+		*/
+		this.cfg.addProperty("focusevent", { value:"mousedown" } );
+	},
+
+	/**
+	* Initializes the OverlayManager
+	* @method init
+	* @param {YAHOO.widget.Overlay[]}	overlays	Optional. A collection of Overlays to register with the manager.
+	* @param {Object}	userConfig		The object literal representing the user configuration of the OverlayManager
+	*/
+	init : function(userConfig) {
+		/**
+		* The OverlayManager's Config object used for monitoring configuration properties.
+		* @property cfg
+		* @type YAHOO.util.Config
+		*/
+		this.cfg = new YAHOO.util.Config(this);
+
+		this.initDefaultConfig();
+
+		if (userConfig) {
+			this.cfg.applyConfig(userConfig, true);
+		}
+		this.cfg.fireQueue();
+
+		/**
+		* The currently activated Overlay
+		* @property activeOverlay
+		* @private
+		* @type YAHOO.widget.Overlay
+		*/
+		var activeOverlay = null;
+
+		/**
+		* Returns the currently focused Overlay
+		* @method getActive
+		* @return {YAHOO.widget.Overlay}	The currently focused Overlay
+		*/
+		this.getActive = function() {
+			return activeOverlay;
+		};
+
+		/**
+		* Focuses the specified Overlay
+		* @method focus
+		* @param {YAHOO.widget.Overlay} overlay	The Overlay to focus
+		* @param {String} overlay	The id of the Overlay to focus
+		*/
+		this.focus = function(overlay) {
+			var o = this.find(overlay);
+			if (o) {
+				this.blurAll();
+				activeOverlay = o;
+				YAHOO.util.Dom.addClass(activeOverlay.element, YAHOO.widget.OverlayManager.CSS_FOCUSED);
+				this.overlays.sort(this.compareZIndexDesc);
+				var topZIndex = YAHOO.util.Dom.getStyle(this.overlays[0].element, "zIndex");
+				if (! isNaN(topZIndex) && this.overlays[0] != overlay) {
+					activeOverlay.cfg.setProperty("zIndex", (parseInt(topZIndex, 10) + 2));
+				}
+				this.overlays.sort(this.compareZIndexDesc);
+			}
+		};
+
+		/**
+		* Removes the specified Overlay from the manager
+		* @method remove
+		* @param {YAHOO.widget.Overlay}	overlay	The Overlay to remove
+		* @param {String} overlay	The id of the Overlay to remove
+		*/
+		this.remove = function(overlay) {
+			var o = this.find(overlay);
+			if (o) {
+				var originalZ = YAHOO.util.Dom.getStyle(o.element, "zIndex");
+				o.cfg.setProperty("zIndex", -1000, true);
+				this.overlays.sort(this.compareZIndexDesc);
+				this.overlays = this.overlays.slice(0, this.overlays.length-1);
+				o.cfg.setProperty("zIndex", originalZ, true);
+
+				o.cfg.setProperty("manager", null);
+				o.focusEvent = null;
+				o.blurEvent = null;
+				o.focus = null;
+				o.blur = null;
+			}
+		};
+
+		/**
+		* Removes focus from all registered Overlays in the manager
+		* @method blurAll
+		*/
+		this.blurAll = function() {
+			activeOverlay = null;
+			for (var o=0;o<this.overlays.length;o++) {
+				YAHOO.util.Dom.removeClass(this.overlays[o].element, YAHOO.widget.OverlayManager.CSS_FOCUSED);
+			}
+		};
+
+		var overlays = this.cfg.getProperty("overlays");
+
+		if (! this.overlays) {
+			this.overlays = [];
+		}
+
+		if (overlays) {
+			this.register(overlays);
+			this.overlays.sort(this.compareZIndexDesc);
+		}
+	},
+
+	/**
+	* Registers an Overlay or an array of Overlays with the manager. Upon registration, the Overlay receives functions for focus and blur, along with CustomEvents for each.
+	* @method register
+	* @param {YAHOO.widget.Overlay}	overlay		An Overlay to register with the manager.
+	* @param {YAHOO.widget.Overlay[]}	overlay		An array of Overlays to register with the manager.
+	* @return	{Boolean}	True if any Overlays are registered.
+	*/
+	register : function(overlay) {
+		if (overlay instanceof YAHOO.widget.Overlay) {
+			overlay.cfg.addProperty("manager", { value:this } );
+
+			overlay.focusEvent = new YAHOO.util.CustomEvent("focus");
+			overlay.blurEvent = new YAHOO.util.CustomEvent("blur");
+
+			var mgr=this;
+
+			overlay.focus = function() {
+				mgr.focus(this);
+				this.focusEvent.fire();
+			};
+
+			overlay.blur = function() {
+				mgr.blurAll();
+				this.blurEvent.fire();
+			};
+
+			var focusOnDomEvent = function(e,obj) {
+				overlay.focus();
+			};
+
+			var focusevent = this.cfg.getProperty("focusevent");
+			YAHOO.util.Event.addListener(overlay.element,focusevent,focusOnDomEvent,this,true);
+
+			var zIndex = YAHOO.util.Dom.getStyle(overlay.element, "zIndex");
+			if (! isNaN(zIndex)) {
+				overlay.cfg.setProperty("zIndex", parseInt(zIndex, 10));
+			} else {
+				overlay.cfg.setProperty("zIndex", 0);
+			}
+
+			this.overlays.push(overlay);
+			return true;
+		} else if (overlay instanceof Array) {
+			var regcount = 0;
+			for (var i=0;i<overlay.length;i++) {
+				if (this.register(overlay[i])) {
+					regcount++;
+				}
+			}
+			if (regcount > 0) {
+				return true;
+			}
+		} else {
+			return false;
+		}
+	},
+
+	/**
+	* Attempts to locate an Overlay by instance or ID.
+	* @method find
+	* @param {YAHOO.widget.Overlay}	overlay		An Overlay to locate within the manager
+	* @param {String}	overlay		An Overlay id to locate within the manager
+	* @return	{YAHOO.widget.Overlay}	The requested Overlay, if found, or null if it cannot be located.
+	*/
+	find : function(overlay) {
+		if (overlay instanceof YAHOO.widget.Overlay) {
+			for (var o=0;o<this.overlays.length;o++) {
+				if (this.overlays[o] == overlay) {
+					return this.overlays[o];
+				}
+			}
+		} else if (typeof overlay == "string") {
+			for (var p=0;p<this.overlays.length;p++) {
+				if (this.overlays[p].id == overlay) {
+					return this.overlays[p];
+				}
+			}
+		}
+		return null;
+	},
+
+	/**
+	* Used for sorting the manager's Overlays by z-index.
+	* @method compareZIndexDesc
+	* @private
+	* @return {Number}	0, 1, or -1, depending on where the Overlay should fall in the stacking order.
+	*/
+	compareZIndexDesc : function(o1, o2) {
+		var zIndex1 = o1.cfg.getProperty("zIndex");
+		var zIndex2 = o2.cfg.getProperty("zIndex");
+
+		if (zIndex1 > zIndex2) {
+			return -1;
+		} else if (zIndex1 < zIndex2) {
+			return 1;
+		} else {
+			return 0;
+		}
+	},
+
+	/**
+	* Shows all Overlays in the manager.
+	* @method showAll
+	*/
+	showAll : function() {
+		for (var o=0;o<this.overlays.length;o++) {
+			this.overlays[o].show();
+		}
+	},
+
+	/**
+	* Hides all Overlays in the manager.
+	* @method hideAll
+	*/
+	hideAll : function() {
+		for (var o=0;o<this.overlays.length;o++) {
+			this.overlays[o].hide();
+		}
+	},
+
+
+	/**
+	* Returns a string representation of the object.
+	* @method toString
+	* @return {String}	The string representation of the OverlayManager
+	*/
+	toString : function() {
+		return "OverlayManager";
+	}
+
+};
+
+/**
+* KeyListener is a utility that provides an easy interface for listening for keydown/keyup events fired against DOM elements.
+* @namespace YAHOO.util
+* @class KeyListener
+* @constructor
+* @param {HTMLElement}	attachTo	The element or element ID to which the key event should be attached
+* @param {String}	attachTo	The element or element ID to which the key event should be attached
+* @param {Object}	keyData		The object literal representing the key(s) to detect. Possible attributes are shift(boolean), alt(boolean), ctrl(boolean) and keys(either an int or an array of ints representing keycodes).
+* @param {Function}	handler		The CustomEvent handler to fire when the key event is detected
+* @param {Object}	handler		An object literal representing the handler.
+* @param {String}	event		Optional. The event (keydown or keyup) to listen for. Defaults automatically to keydown.
+*/
+YAHOO.util.KeyListener = function(attachTo, keyData, handler, event) {
+	if (! event) {
+		event = YAHOO.util.KeyListener.KEYDOWN;
+	}
+
+	/**
+	* The CustomEvent fired internally when a key is pressed
+	* @event keyEvent
+	* @private
+	* @param {Object}	keyData		The object literal representing the key(s) to detect. Possible attributes are shift(boolean), alt(boolean), ctrl(boolean) and keys(either an int or an array of ints representing keycodes).
+	*/
+	var keyEvent = new YAHOO.util.CustomEvent("keyPressed");
+
+	/**
+	* The CustomEvent fired when the KeyListener is enabled via the enable() function
+	* @event enabledEvent
+	* @param {Object}	keyData		The object literal representing the key(s) to detect. Possible attributes are shift(boolean), alt(boolean), ctrl(boolean) and keys(either an int or an array of ints representing keycodes).
+	*/
+	this.enabledEvent = new YAHOO.util.CustomEvent("enabled");
+
+	/**
+	* The CustomEvent fired when the KeyListener is disabled via the disable() function
+	* @event disabledEvent
+	* @param {Object}	keyData		The object literal representing the key(s) to detect. Possible attributes are shift(boolean), alt(boolean), ctrl(boolean) and keys(either an int or an array of ints representing keycodes).
+	*/
+	this.disabledEvent = new YAHOO.util.CustomEvent("disabled");
+
+	if (typeof attachTo == 'string') {
+		attachTo = document.getElementById(attachTo);
+	}
+
+	if (typeof handler == 'function') {
+		keyEvent.subscribe(handler);
+	} else {
+		keyEvent.subscribe(handler.fn, handler.scope, handler.correctScope);
+	}
+
+	/**
+	* Handles the key event when a key is pressed.
+	* @method handleKeyPress
+	* @param {DOMEvent} e	The keypress DOM event
+	* @param {Object}	obj	The DOM event scope object
+	* @private
+	*/
+	function handleKeyPress(e, obj) {
+		if (! keyData.shift) {
+			keyData.shift = false;
+		}
+		if (! keyData.alt) {
+			keyData.alt = false;
+		}
+		if (! keyData.ctrl) {
+			keyData.ctrl = false;
+		}
+
+		// check held down modifying keys first
+		if (e.shiftKey == keyData.shift &&
+			e.altKey   == keyData.alt &&
+			e.ctrlKey  == keyData.ctrl) { // if we pass this, all modifiers match
+
+			var dataItem;
+			var keyPressed;
+
+			if (keyData.keys instanceof Array) {
+				for (var i=0;i<keyData.keys.length;i++) {
+					dataItem = keyData.keys[i];
+
+					if (dataItem == e.charCode ) {
+						keyEvent.fire(e.charCode, e);
+						break;
+					} else if (dataItem == e.keyCode) {
+						keyEvent.fire(e.keyCode, e);
+						break;
+					}
+				}
+			} else {
+				dataItem = keyData.keys;
+
+				if (dataItem == e.charCode ) {
+					keyEvent.fire(e.charCode, e);
+				} else if (dataItem == e.keyCode) {
+					keyEvent.fire(e.keyCode, e);
+				}
+			}
+		}
+	}
+
+	/**
+	* Enables the KeyListener by attaching the DOM event listeners to the target DOM element
+	* @method enable
+	*/
+	this.enable = function() {
+		if (! this.enabled) {
+			YAHOO.util.Event.addListener(attachTo, event, handleKeyPress);
+			this.enabledEvent.fire(keyData);
+		}
+		/**
+		* Boolean indicating the enabled/disabled state of the Tooltip
+		* @property enabled
+		* @type Boolean
+		*/
+		this.enabled = true;
+	};
+
+	/**
+	* Disables the KeyListener by removing the DOM event listeners from the target DOM element
+	* @method disable
+	*/
+	this.disable = function() {
+		if (this.enabled) {
+			YAHOO.util.Event.removeListener(attachTo, event, handleKeyPress);
+			this.disabledEvent.fire(keyData);
+		}
+		this.enabled = false;
+	};
+
+	/**
+	* Returns a String representation of the object.
+	* @method toString
+	* @return {String}	The string representation of the KeyListener
+	*/
+	this.toString = function() {
+		return "KeyListener [" + keyData.keys + "] " + attachTo.tagName + (attachTo.id ? "[" + attachTo.id + "]" : "");
+	};
+
+};
+
+/**
+* Constant representing the DOM "keydown" event.
+* @property YAHOO.util.KeyListener.KEYDOWN
+* @static
+* @final
+* @type String
+*/
+YAHOO.util.KeyListener.KEYDOWN = "keydown";
+
+/**
+* Constant representing the DOM "keyup" event.
+* @property YAHOO.util.KeyListener.KEYUP
+* @static
+* @final
+* @type String
+*/
+YAHOO.util.KeyListener.KEYUP = "keyup";
+
+/**
+* Tooltip is an implementation of Overlay that behaves like an OS tooltip, displaying when the user mouses over a particular element, and disappearing on mouse out.
+* @namespace YAHOO.widget
+* @class Tooltip
+* @extends YAHOO.widget.Overlay
+* @constructor
+* @param {String}	el	The element ID representing the Tooltip <em>OR</em>
+* @param {HTMLElement}	el	The element representing the Tooltip
+* @param {Object}	userConfig	The configuration object literal containing the configuration that should be set for this Overlay. See configuration documentation for more details.
+*/
+YAHOO.widget.Tooltip = function(el, userConfig) {
+	YAHOO.widget.Tooltip.superclass.constructor.call(this, el, userConfig);
+};
+
+YAHOO.extend(YAHOO.widget.Tooltip, YAHOO.widget.Overlay);
+
+/**
+* Constant representing the Tooltip CSS class
+* @property YAHOO.widget.Tooltip.CSS_TOOLTIP
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Tooltip.CSS_TOOLTIP = "tt";
+
+/**
+* The Tooltip initialization method. This method is automatically called by the constructor. A Tooltip is automatically rendered by the init method, and it also is set to be invisible by default, and constrained to viewport by default as well.
+* @method init
+* @param {String}	el	The element ID representing the Tooltip <em>OR</em>
+* @param {HTMLElement}	el	The element representing the Tooltip
+* @param {Object}	userConfig	The configuration object literal containing the configuration that should be set for this Tooltip. See configuration documentation for more details.
+*/
+YAHOO.widget.Tooltip.prototype.init = function(el, userConfig) {
+	if (document.readyState && document.readyState != "complete") {
+		var deferredInit = function() {
+			this.init(el, userConfig);
+		};
+		YAHOO.util.Event.addListener(window, "load", deferredInit, this, true);
+	} else {
+		YAHOO.widget.Tooltip.superclass.init.call(this, el);
+
+		this.beforeInitEvent.fire(YAHOO.widget.Tooltip);
+
+		YAHOO.util.Dom.addClass(this.element, YAHOO.widget.Tooltip.CSS_TOOLTIP);
+
+		if (userConfig) {
+			this.cfg.applyConfig(userConfig, true);
+		}
+
+		this.cfg.queueProperty("visible",false);
+		this.cfg.queueProperty("constraintoviewport",true);
+
+		this.setBody("");
+		this.render(this.cfg.getProperty("container"));
+
+		this.initEvent.fire(YAHOO.widget.Tooltip);
+	}
+};
+
+/**
+* Initializes the class's configurable properties which can be changed using the Overlay's Config object (cfg).
+* @method initDefaultConfig
+*/
+YAHOO.widget.Tooltip.prototype.initDefaultConfig = function() {
+	YAHOO.widget.Tooltip.superclass.initDefaultConfig.call(this);
+
+	/**
+	* Specifies whether the Tooltip should be kept from overlapping its context element.
+	* @config preventoverlap
+	* @type Boolean
+	* @default true
+	*/
+	this.cfg.addProperty("preventoverlap",		{ value:true, validator:this.cfg.checkBoolean, supercedes:["x","y","xy"] } );
+
+	/**
+	* The number of milliseconds to wait before showing a Tooltip on mouseover.
+	* @config showdelay
+	* @type Number
+	* @default 200
+	*/
+	this.cfg.addProperty("showdelay",			{ value:200, handler:this.configShowDelay, validator:this.cfg.checkNumber } );
+
+	/**
+	* The number of milliseconds to wait before automatically dismissing a Tooltip after the mouse has been resting on the context element.
+	* @config autodismissdelay
+	* @type Number
+	* @default 5000
+	*/
+	this.cfg.addProperty("autodismissdelay",	{ value:5000, handler:this.configAutoDismissDelay, validator:this.cfg.checkNumber } );
+
+	/**
+	* The number of milliseconds to wait before hiding a Tooltip on mouseover.
+	* @config hidedelay
+	* @type Number
+	* @default 250
+	*/
+	this.cfg.addProperty("hidedelay",			{ value:250, handler:this.configHideDelay, validator:this.cfg.checkNumber } );
+
+	/**
+	* Specifies the Tooltip's text.
+	* @config text
+	* @type String
+	* @default null
+	*/
+	this.cfg.addProperty("text",				{ handler:this.configText, suppressEvent:true } );
+
+	/**
+	* Specifies the container element that the Tooltip's markup should be rendered into.
+	* @config container
+	* @type HTMLElement/String
+	* @default document.body
+	*/
+	this.cfg.addProperty("container",			{ value:document.body, handler:this.configContainer } );
+
+	/**
+	* Specifies the element or elements that the Tooltip should be anchored to on mouseover.
+	* @config context
+	* @type HTMLElement[]/String[]
+	* @default null
+	*/
+
+};
+
+// BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
+
+/**
+* The default event handler fired when the "text" property is changed.
+* @method configText
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Tooltip.prototype.configText = function(type, args, obj) {
+	var text = args[0];
+	if (text) {
+		this.setBody(text);
+	}
+};
+
+/**
+* The default event handler fired when the "container" property is changed.
+* @method configContainer
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Tooltip.prototype.configContainer = function(type, args, obj) {
+	var container = args[0];
+	if (typeof container == 'string') {
+		this.cfg.setProperty("container", document.getElementById(container), true);
+	}
+};
+
+/**
+* The default event handler fired when the "context" property is changed.
+* @method configContext
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Tooltip.prototype.configContext = function(type, args, obj) {
+	var context = args[0];
+	if (context) {
+
+		// Normalize parameter into an array
+		if (! (context instanceof Array)) {
+			if (typeof context == "string") {
+				this.cfg.setProperty("context", [document.getElementById(context)], true);
+			} else { // Assuming this is an element
+				this.cfg.setProperty("context", [context], true);
+			}
+			context = this.cfg.getProperty("context");
+		}
+
+
+		// Remove any existing mouseover/mouseout listeners
+		if (this._context) {
+			for (var c=0;c<this._context.length;++c) {
+				var el = this._context[c];
+				YAHOO.util.Event.removeListener(el, "mouseover", this.onContextMouseOver);
+				YAHOO.util.Event.removeListener(el, "mousemove", this.onContextMouseMove);
+				YAHOO.util.Event.removeListener(el, "mouseout", this.onContextMouseOut);
+			}
+		}
+
+		// Add mouseover/mouseout listeners to context elements
+		this._context = context;
+		for (var d=0;d<this._context.length;++d) {
+			var el2 = this._context[d];
+			YAHOO.util.Event.addListener(el2, "mouseover", this.onContextMouseOver, this);
+			YAHOO.util.Event.addListener(el2, "mousemove", this.onContextMouseMove, this);
+			YAHOO.util.Event.addListener(el2, "mouseout", this.onContextMouseOut, this);
+		}
+	}
+};
+
+// END BUILT-IN PROPERTY EVENT HANDLERS //
+
+// BEGIN BUILT-IN DOM EVENT HANDLERS //
+
+/**
+* The default event handler fired when the user moves the mouse while over the context element.
+* @method onContextMouseMove
+* @param {DOMEvent} e	The current DOM event
+* @param {Object}	obj	The object argument
+*/
+YAHOO.widget.Tooltip.prototype.onContextMouseMove = function(e, obj) {
+	obj.pageX = YAHOO.util.Event.getPageX(e);
+	obj.pageY = YAHOO.util.Event.getPageY(e);
+
+};
+
+/**
+* The default event handler fired when the user mouses over the context element.
+* @method onContextMouseOver
+* @param {DOMEvent} e	The current DOM event
+* @param {Object}	obj	The object argument
+*/
+YAHOO.widget.Tooltip.prototype.onContextMouseOver = function(e, obj) {
+
+	if (obj.hideProcId) {
+		clearTimeout(obj.hideProcId);
+		obj.hideProcId = null;
+	}
+
+	var context = this;
+	YAHOO.util.Event.addListener(context, "mousemove", obj.onContextMouseMove, obj);
+
+	if (context.title) {
+		obj._tempTitle = context.title;
+		context.title = "";
+	}
+
+	/**
+	* The unique process ID associated with the thread responsible for showing the Tooltip.
+	* @type int
+	*/
+	obj.showProcId = obj.doShow(e, context);
+};
+
+/**
+* The default event handler fired when the user mouses out of the context element.
+* @method onContextMouseOut
+* @param {DOMEvent} e	The current DOM event
+* @param {Object}	obj	The object argument
+*/
+YAHOO.widget.Tooltip.prototype.onContextMouseOut = function(e, obj) {
+	var el = this;
+
+	if (obj._tempTitle) {
+		el.title = obj._tempTitle;
+		obj._tempTitle = null;
+	}
+
+	if (obj.showProcId) {
+		clearTimeout(obj.showProcId);
+		obj.showProcId = null;
+	}
+
+	if (obj.hideProcId) {
+		clearTimeout(obj.hideProcId);
+		obj.hideProcId = null;
+	}
+
+
+	obj.hideProcId = setTimeout(function() {
+				obj.hide();
+				}, obj.cfg.getProperty("hidedelay"));
+};
+
+// END BUILT-IN DOM EVENT HANDLERS //
+
+/**
+* Processes the showing of the Tooltip by setting the timeout delay and offset of the Tooltip.
+* @method doShow
+* @param {DOMEvent} e	The current DOM event
+* @return {Number}	The process ID of the timeout function associated with doShow
+*/
+YAHOO.widget.Tooltip.prototype.doShow = function(e, context) {
+
+	var yOffset = 25;
+	if (this.browser == "opera" && context.tagName == "A") {
+		yOffset += 12;
+	}
+
+	var me = this;
+	return setTimeout(
+		function() {
+			if (me._tempTitle) {
+				me.setBody(me._tempTitle);
+			} else {
+				me.cfg.refireEvent("text");
+			}
+
+			me.moveTo(me.pageX, me.pageY + yOffset);
+			if (me.cfg.getProperty("preventoverlap")) {
+				me.preventOverlap(me.pageX, me.pageY);
+			}
+
+			YAHOO.util.Event.removeListener(context, "mousemove", me.onContextMouseMove);
+
+			me.show();
+			me.hideProcId = me.doHide();
+		},
+	this.cfg.getProperty("showdelay"));
+};
+
+/**
+* Sets the timeout for the auto-dismiss delay, which by default is 5 seconds, meaning that a tooltip will automatically dismiss itself after 5 seconds of being displayed.
+* @method doHide
+*/
+YAHOO.widget.Tooltip.prototype.doHide = function() {
+	var me = this;
+	return setTimeout(
+		function() {
+			me.hide();
+		},
+		this.cfg.getProperty("autodismissdelay"));
+};
+
+/**
+* Fired when the Tooltip is moved, this event handler is used to prevent the Tooltip from overlapping with its context element.
+* @method preventOverlay
+* @param {Number} pageX	The x coordinate position of the mouse pointer
+* @param {Number} pageY	The y coordinate position of the mouse pointer
+*/
+YAHOO.widget.Tooltip.prototype.preventOverlap = function(pageX, pageY) {
+
+	var height = this.element.offsetHeight;
+
+	var elementRegion = YAHOO.util.Dom.getRegion(this.element);
+
+	elementRegion.top -= 5;
+	elementRegion.left -= 5;
+	elementRegion.right += 5;
+	elementRegion.bottom += 5;
+
+	var mousePoint = new YAHOO.util.Point(pageX, pageY);
+
+	if (elementRegion.contains(mousePoint)) {
+		this.cfg.setProperty("y", (pageY-height-5));
+	}
+};
+
+/**
+* Returns a string representation of the object.
+* @method toString
+* @return {String}	The string representation of the Tooltip
+*/
+YAHOO.widget.Tooltip.prototype.toString = function() {
+	return "Tooltip " + this.id;
+};
+
+/**
+* Panel is an implementation of Overlay that behaves like an OS window, with a draggable header and an optional close icon at the top right.
+* @namespace YAHOO.widget
+* @class Panel
+* @extends YAHOO.widget.Overlay
+* @constructor
+* @param {String}	el	The element ID representing the Panel <em>OR</em>
+* @param {HTMLElement}	el	The element representing the Panel
+* @param {Object}	userConfig	The configuration object literal containing the configuration that should be set for this Panel. See configuration documentation for more details.
+*/
+YAHOO.widget.Panel = function(el, userConfig) {
+	YAHOO.widget.Panel.superclass.constructor.call(this, el, userConfig);
+};
+
+YAHOO.extend(YAHOO.widget.Panel, YAHOO.widget.Overlay);
+
+/**
+* Constant representing the default CSS class used for a Panel
+* @property YAHOO.widget.Panel.CSS_PANEL
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Panel.CSS_PANEL = "panel";
+
+/**
+* Constant representing the default CSS class used for a Panel's wrapping container
+* @property YAHOO.widget.Panel.CSS_PANEL_CONTAINER
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Panel.CSS_PANEL_CONTAINER = "panel-container";
+
+/**
+* The Overlay initialization method, which is executed for Overlay and all of its subclasses. This method is automatically called by the constructor, and  sets up all DOM references for pre-existing markup, and creates required markup if it is not already present.
+* @method init
+* @param {String}	el	The element ID representing the Overlay <em>OR</em>
+* @param {HTMLElement}	el	The element representing the Overlay
+* @param {Object}	userConfig	The configuration object literal containing the configuration that should be set for this Overlay. See configuration documentation for more details.
+*/
+YAHOO.widget.Panel.prototype.init = function(el, userConfig) {
+	YAHOO.widget.Panel.superclass.init.call(this, el/*, userConfig*/);  // Note that we don't pass the user config in here yet because we only want it executed once, at the lowest subclass level
+
+	this.beforeInitEvent.fire(YAHOO.widget.Panel);
+
+	YAHOO.util.Dom.addClass(this.element, YAHOO.widget.Panel.CSS_PANEL);
+
+	this.buildWrapper();
+
+	if (userConfig) {
+		this.cfg.applyConfig(userConfig, true);
+	}
+
+	this.beforeRenderEvent.subscribe(function() {
+		var draggable = this.cfg.getProperty("draggable");
+		if (draggable) {
+			if (! this.header) {
+				this.setHeader("&nbsp;");
+			}
+		}
+	}, this, true);
+
+	var me = this;
+
+	this.showMaskEvent.subscribe(function() {
+		var checkFocusable = function(el) {
+			if (el.tagName == "A" || el.tagName == "BUTTON" || el.tagName == "SELECT" || el.tagName == "INPUT" || el.tagName == "TEXTAREA" || el.tagName == "FORM") {
+				if (! YAHOO.util.Dom.isAncestor(me.element, el)) {
+					YAHOO.util.Event.addListener(el, "focus", el.blur);
+					return true;
+				}
+			} else {
+				return false;
+			}
+		};
+
+		this.focusableElements = YAHOO.util.Dom.getElementsBy(checkFocusable);
+	}, this, true);
+
+	this.hideMaskEvent.subscribe(function() {
+		for (var i=0;i<this.focusableElements.length;i++) {
+			var el2 = this.focusableElements[i];
+			YAHOO.util.Event.removeListener(el2, "focus", el2.blur);
+		}
+	}, this, true);
+
+	this.beforeShowEvent.subscribe(function() {
+		this.cfg.refireEvent("underlay");
+	}, this, true);
+
+	this.initEvent.fire(YAHOO.widget.Panel);
+};
+
+/**
+* Initializes the custom events for Module which are fired automatically at appropriate times by the Module class.
+*/
+YAHOO.widget.Panel.prototype.initEvents = function() {
+	YAHOO.widget.Panel.superclass.initEvents.call(this);
+
+	/**
+	* CustomEvent fired after the modality mask is shown
+	* @event showMaskEvent
+	*/
+	this.showMaskEvent = new YAHOO.util.CustomEvent("showMask");
+
+	/**
+	* CustomEvent fired after the modality mask is hidden
+	* @event hideMaskEvent
+	*/
+	this.hideMaskEvent = new YAHOO.util.CustomEvent("hideMask");
+
+	/**
+	* CustomEvent when the Panel is dragged
+	* @event dragEvent
+	*/
+	this.dragEvent = new YAHOO.util.CustomEvent("drag");
+};
+
+/**
+* Initializes the class's configurable properties which can be changed using the Panel's Config object (cfg).
+* @method initDefaultConfig
+*/
+YAHOO.widget.Panel.prototype.initDefaultConfig = function() {
+	YAHOO.widget.Panel.superclass.initDefaultConfig.call(this);
+
+	// Add panel config properties //
+
+	/**
+	* True if the Panel should display a "close" button
+	* @config close
+	* @type Boolean
+	* @default true
+	*/
+	this.cfg.addProperty("close", { value:true, handler:this.configClose, validator:this.cfg.checkBoolean, supercedes:["visible"] } );
+
+	/**
+	* True if the Panel should be draggable
+	* @config draggable
+	* @type Boolean
+	* @default true
+	*/
+	this.cfg.addProperty("draggable", { value:true,	handler:this.configDraggable, validator:this.cfg.checkBoolean, supercedes:["visible"] } );
+
+	/**
+	* Sets the type of underlay to display for the Panel. Valid values are "shadow", "matte", and "none".
+	* @config underlay
+	* @type String
+	* @default shadow
+	*/
+	this.cfg.addProperty("underlay", { value:"shadow", handler:this.configUnderlay, supercedes:["visible"] } );
+
+	/**
+	* True if the Panel should be displayed in a modal fashion, automatically creating a transparent mask over the document that will not be removed until the Panel is dismissed.
+	* @config modal
+	* @type Boolean
+	* @default false
+	*/
+	this.cfg.addProperty("modal",	{ value:false, handler:this.configModal, validator:this.cfg.checkBoolean, supercedes:["visible"] } );
+
+	/**
+	* A KeyListener (or array of KeyListeners) that will be enabled when the Panel is shown, and disabled when the Panel is hidden.
+	* @config keylisteners
+	* @type YAHOO.util.KeyListener[]
+	* @default null
+	*/
+	this.cfg.addProperty("keylisteners", { handler:this.configKeyListeners, suppressEvent:true, supercedes:["visible"] } );
+};
+
+// BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
+
+/**
+* The default event handler fired when the "close" property is changed. The method controls the appending or hiding of the close icon at the top right of the Panel.
+* @method configClose
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Panel.prototype.configClose = function(type, args, obj) {
+	var val = args[0];
+
+	var doHide = function(e, obj) {
+		obj.hide();
+	};
+
+	if (val) {
+		if (! this.close) {
+			this.close = document.createElement("DIV");
+			YAHOO.util.Dom.addClass(this.close, "close");
+
+			if (this.isSecure) {
+				YAHOO.util.Dom.addClass(this.close, "secure");
+			} else {
+				YAHOO.util.Dom.addClass(this.close, "nonsecure");
+			}
+
+			this.close.innerHTML = "&nbsp;";
+			this.innerElement.appendChild(this.close);
+			YAHOO.util.Event.addListener(this.close, "click", doHide, this);
+		} else {
+			this.close.style.display = "block";
+		}
+	} else {
+		if (this.close) {
+			this.close.style.display = "none";
+		}
+	}
+};
+
+/**
+* The default event handler fired when the "draggable" property is changed.
+* @method configDraggable
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Panel.prototype.configDraggable = function(type, args, obj) {
+	var val = args[0];
+	if (val) {
+		if (this.header) {
+			YAHOO.util.Dom.setStyle(this.header,"cursor","move");
+			this.registerDragDrop();
+		}
+	} else {
+		if (this.dd) {
+			this.dd.unreg();
+		}
+		if (this.header) {
+			YAHOO.util.Dom.setStyle(this.header,"cursor","auto");
+		}
+	}
+};
+
+/**
+* The default event handler fired when the "underlay" property is changed.
+* @method configUnderlay
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Panel.prototype.configUnderlay = function(type, args, obj) {
+	var val = args[0];
+
+	switch (val.toLowerCase()) {
+		case "shadow":
+			YAHOO.util.Dom.removeClass(this.element, "matte");
+			YAHOO.util.Dom.addClass(this.element, "shadow");
+
+			if (! this.underlay) { // create if not already in DOM
+				this.underlay = document.createElement("DIV");
+				this.underlay.className = "underlay";
+				this.underlay.innerHTML = "&nbsp;";
+				this.element.appendChild(this.underlay);
+			}
+
+			this.sizeUnderlay();
+			break;
+		case "matte":
+			YAHOO.util.Dom.removeClass(this.element, "shadow");
+			YAHOO.util.Dom.addClass(this.element, "matte");
+			break;
+		default:
+			YAHOO.util.Dom.removeClass(this.element, "shadow");
+			YAHOO.util.Dom.removeClass(this.element, "matte");
+			break;
+	}
+};
+
+/**
+* The default event handler fired when the "modal" property is changed. This handler subscribes or unsubscribes to the show and hide events to handle the display or hide of the modality mask.
+* @method configModal
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Panel.prototype.configModal = function(type, args, obj) {
+	var modal = args[0];
+
+	if (modal) {
+		this.buildMask();
+
+		if (! YAHOO.util.Config.alreadySubscribed( this.beforeShowEvent, this.showMask, this ) ) {
+			this.beforeShowEvent.subscribe(this.showMask, this, true);
+		}
+		if (! YAHOO.util.Config.alreadySubscribed( this.hideEvent, this.hideMask, this) ) {
+			this.hideEvent.subscribe(this.hideMask, this, true);
+		}
+		if (! YAHOO.util.Config.alreadySubscribed( YAHOO.widget.Overlay.windowResizeEvent, this.sizeMask, this ) ) {
+			YAHOO.widget.Overlay.windowResizeEvent.subscribe(this.sizeMask, this, true);
+		}
+		if (! YAHOO.util.Config.alreadySubscribed( this.destroyEvent, this.removeMask, this) ) {
+			this.destroyEvent.subscribe(this.removeMask, this, true);
+		}
+
+		this.cfg.refireEvent("zIndex");
+	} else {
+		this.beforeShowEvent.unsubscribe(this.showMask, this);
+		this.hideEvent.unsubscribe(this.hideMask, this);
+		YAHOO.widget.Overlay.windowResizeEvent.unsubscribe(this.sizeMask, this);
+		this.destroyEvent.unsubscribe(this.removeMask, this);
+	}
+};
+
+/**
+* Removes the modality mask.
+* @method removeMask
+*/
+YAHOO.widget.Panel.prototype.removeMask = function() {
+	if (this.mask) {
+		if (this.mask.parentNode) {
+			this.mask.parentNode.removeChild(this.mask);
+		}
+		this.mask = null;
+	}
+};
+
+/**
+* The default event handler fired when the "keylisteners" property is changed.
+* @method configKeyListeners
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Panel.prototype.configKeyListeners = function(type, args, obj) {
+	var listeners = args[0];
+
+	if (listeners) {
+		if (listeners instanceof Array) {
+			for (var i=0;i<listeners.length;i++) {
+				var listener = listeners[i];
+
+				if (! YAHOO.util.Config.alreadySubscribed(this.showEvent, listener.enable, listener)) {
+					this.showEvent.subscribe(listener.enable, listener, true);
+				}
+				if (! YAHOO.util.Config.alreadySubscribed(this.hideEvent, listener.disable, listener)) {
+					this.hideEvent.subscribe(listener.disable, listener, true);
+					this.destroyEvent.subscribe(listener.disable, listener, true);
+				}
+			}
+		} else {
+			if (! YAHOO.util.Config.alreadySubscribed(this.showEvent, listeners.enable, listeners)) {
+				this.showEvent.subscribe(listeners.enable, listeners, true);
+			}
+			if (! YAHOO.util.Config.alreadySubscribed(this.hideEvent, listeners.disable, listeners)) {
+				this.hideEvent.subscribe(listeners.disable, listeners, true);
+				this.destroyEvent.subscribe(listeners.disable, listeners, true);
+			}
+		}
+	}
+};
+
+/**
+* The default event handler fired when the "height" property is changed.
+* @method configHeight
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Panel.prototype.configHeight = function(type, args, obj) {
+	var height = args[0];
+	var el = this.innerElement;
+	YAHOO.util.Dom.setStyle(el, "height", height);
+	this.cfg.refireEvent("underlay");
+	this.cfg.refireEvent("iframe");
+};
+
+/**
+* The default event handler fired when the "width" property is changed.
+* @method configWidth
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Panel.prototype.configWidth = function(type, args, obj) {
+	var width = args[0];
+	var el = this.innerElement;
+	YAHOO.util.Dom.setStyle(el, "width", width);
+	this.cfg.refireEvent("underlay");
+	this.cfg.refireEvent("iframe");
+};
+
+/**
+* The default event handler fired when the "zIndex" property is changed.
+* @method configzIndex
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Panel.prototype.configzIndex = function(type, args, obj) {
+	YAHOO.widget.Panel.superclass.configzIndex.call(this, type, args, obj);
+
+	var maskZ = 0;
+	var currentZ = YAHOO.util.Dom.getStyle(this.element, "zIndex");
+
+	if (this.mask) {
+		if (! currentZ || isNaN(currentZ)) {
+			currentZ = 0;
+		}
+
+		if (currentZ === 0) {
+			this.cfg.setProperty("zIndex", 1);
+		} else {
+			maskZ = currentZ - 1;
+			YAHOO.util.Dom.setStyle(this.mask, "zIndex", maskZ);
+		}
+
+	}
+};
+
+// END BUILT-IN PROPERTY EVENT HANDLERS //
+
+/**
+* Builds the wrapping container around the Panel that is used for positioning the shadow and matte underlays. The container element is assigned to a  local instance variable called container, and the element is reinserted inside of it.
+* @method buildWrapper
+*/
+YAHOO.widget.Panel.prototype.buildWrapper = function() {
+	var elementParent = this.element.parentNode;
+	var originalElement = this.element;
+
+	var wrapper = document.createElement("DIV");
+	wrapper.className = YAHOO.widget.Panel.CSS_PANEL_CONTAINER;
+	wrapper.id = originalElement.id + "_c";
+
+	if (elementParent) {
+		elementParent.insertBefore(wrapper, originalElement);
+	}
+
+	wrapper.appendChild(originalElement);
+
+	this.element = wrapper;
+	this.innerElement = originalElement;
+
+	YAHOO.util.Dom.setStyle(this.innerElement, "visibility", "inherit");
+};
+
+/**
+* Adjusts the size of the shadow based on the size of the element.
+* @method sizeUnderlay
+*/
+YAHOO.widget.Panel.prototype.sizeUnderlay = function() {
+	if (this.underlay && this.browser != "gecko" && this.browser != "safari") {
+		this.underlay.style.width = this.innerElement.offsetWidth + "px";
+		this.underlay.style.height = this.innerElement.offsetHeight + "px";
+	}
+};
+
+/**
+* Event handler fired when the resize monitor element is resized.
+* @method onDomResize
+* @param {DOMEvent} e	The resize DOM event
+* @param {Object} obj	The scope object
+*/
+YAHOO.widget.Panel.prototype.onDomResize = function(e, obj) {
+	YAHOO.widget.Panel.superclass.onDomResize.call(this, e, obj);
+	var me = this;
+	setTimeout(function() {
+		me.sizeUnderlay();
+	}, 0);
+};
+
+/**
+* Registers the Panel's header for drag & drop capability.
+* @method registerDragDrop
+*/
+YAHOO.widget.Panel.prototype.registerDragDrop = function() {
+	if (this.header) {
+		this.dd = new YAHOO.util.DD(this.element.id, this.id);
+
+		if (! this.header.id) {
+			this.header.id = this.id + "_h";
+		}
+
+		var me = this;
+
+		this.dd.startDrag = function() {
+
+			if (me.browser == "ie") {
+				YAHOO.util.Dom.addClass(me.element,"drag");
+			}
+
+			if (me.cfg.getProperty("constraintoviewport")) {
+				var offsetHeight = me.element.offsetHeight;
+				var offsetWidth = me.element.offsetWidth;
+
+				var viewPortWidth = YAHOO.util.Dom.getViewportWidth();
+				var viewPortHeight = YAHOO.util.Dom.getViewportHeight();
+
+				var scrollX = window.scrollX || document.documentElement.scrollLeft;
+				var scrollY = window.scrollY || document.documentElement.scrollTop;
+
+				var topConstraint = scrollY + 10;
+				var leftConstraint = scrollX + 10;
+				var bottomConstraint = scrollY + viewPortHeight - offsetHeight - 10;
+				var rightConstraint = scrollX + viewPortWidth - offsetWidth - 10;
+
+				this.minX = leftConstraint;
+				this.maxX = rightConstraint;
+				this.constrainX = true;
+
+				this.minY = topConstraint;
+				this.maxY = bottomConstraint;
+				this.constrainY = true;
+			} else {
+				this.constrainX = false;
+				this.constrainY = false;
+			}
+
+			me.dragEvent.fire("startDrag", arguments);
+		};
+
+		this.dd.onDrag = function() {
+			me.syncPosition();
+			me.cfg.refireEvent("iframe");
+			if (this.platform == "mac" && this.browser == "gecko") {
+				this.showMacGeckoScrollbars();
+			}
+
+			me.dragEvent.fire("onDrag", arguments);
+		};
+
+		this.dd.endDrag = function() {
+			if (me.browser == "ie") {
+				YAHOO.util.Dom.removeClass(me.element,"drag");
+			}
+
+			me.dragEvent.fire("endDrag", arguments);
+		};
+
+		this.dd.setHandleElId(this.header.id);
+		this.dd.addInvalidHandleType("INPUT");
+		this.dd.addInvalidHandleType("SELECT");
+		this.dd.addInvalidHandleType("TEXTAREA");
+	}
+};
+
+/**
+* Builds the mask that is laid over the document when the Panel is configured to be modal.
+* @method buildMask
+*/
+YAHOO.widget.Panel.prototype.buildMask = function() {
+	if (! this.mask) {
+		this.mask = document.createElement("DIV");
+		this.mask.id = this.id + "_mask";
+		this.mask.className = "mask";
+		this.mask.innerHTML = "&nbsp;";
+
+		var maskClick = function(e, obj) {
+			YAHOO.util.Event.stopEvent(e);
+		};
+
+		var firstChild = document.body.firstChild;
+		if (firstChild)	{
+			document.body.insertBefore(this.mask, document.body.firstChild);
+		} else {
+			document.body.appendChild(this.mask);
+		}
+	}
+};
+
+/**
+* Hides the modality mask.
+* @method hideMask
+*/
+YAHOO.widget.Panel.prototype.hideMask = function() {
+	if (this.cfg.getProperty("modal") && this.mask) {
+		this.mask.style.display = "none";
+		this.hideMaskEvent.fire();
+		YAHOO.util.Dom.removeClass(document.body, "masked");
+	}
+};
+
+/**
+* Shows the modality mask.
+* @method showMask
+*/
+YAHOO.widget.Panel.prototype.showMask = function() {
+	if (this.cfg.getProperty("modal") && this.mask) {
+		YAHOO.util.Dom.addClass(document.body, "masked");
+		this.sizeMask();
+		this.mask.style.display = "block";
+		this.showMaskEvent.fire();
+	}
+};
+
+/**
+* Sets the size of the modality mask to cover the entire scrollable area of the document
+* @method sizeMask
+*/
+YAHOO.widget.Panel.prototype.sizeMask = function() {
+	if (this.mask) {
+		this.mask.style.height = YAHOO.util.Dom.getDocumentHeight()+"px";
+		this.mask.style.width = YAHOO.util.Dom.getDocumentWidth()+"px";
+	}
+};
+
+/**
+* Renders the Panel by inserting the elements that are not already in the main Panel into their correct places. Optionally appends the Panel to the specified node prior to the render's execution. NOTE: For Panels without existing markup, the appendToNode argument is REQUIRED. If this argument is ommitted and the current element is not present in the document, the function will return false, indicating that the render was a failure.
+* @method render
+* @param {String}	appendToNode	The element id to which the Module should be appended to prior to rendering <em>OR</em>
+* @param {HTMLElement}	appendToNode	The element to which the Module should be appended to prior to rendering
+* @return {boolean} Success or failure of the render
+*/
+YAHOO.widget.Panel.prototype.render = function(appendToNode) {
+	return YAHOO.widget.Panel.superclass.render.call(this, appendToNode, this.innerElement);
+};
+
+/**
+* Returns a String representation of the object.
+* @method toString
+* @return {String} The string representation of the Panel.
+*/
+YAHOO.widget.Panel.prototype.toString = function() {
+	return "Panel " + this.id;
+};
+
+/**
+* Dialog is an implementation of Panel that can be used to submit form data. Built-in functionality for buttons with event handlers is included, and button sets can be build dynamically, or the preincluded ones for Submit/Cancel and OK/Cancel can be utilized. Forms can be processed in 3 ways -- via an asynchronous Connection utility call, a simple form POST or GET, or manually.
+* @namespace YAHOO.widget
+* @class Dialog
+* @extends YAHOO.widget.Panel
+* @constructor
+* @param {String}	el	The element ID representing the Dialog <em>OR</em>
+* @param {HTMLElement}	el	The element representing the Dialog
+* @param {Object}	userConfig	The configuration object literal containing the configuration that should be set for this Dialog. See configuration documentation for more details.
+*/
+YAHOO.widget.Dialog = function(el, userConfig) {
+	YAHOO.widget.Dialog.superclass.constructor.call(this, el, userConfig);
+};
+
+YAHOO.extend(YAHOO.widget.Dialog, YAHOO.widget.Panel);
+
+/**
+* Constant representing the default CSS class used for a Dialog
+* @property YAHOO.widget.Dialog.CSS_DIALOG
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.Dialog.CSS_DIALOG = "dialog";
+
+/**
+* Initializes the class's configurable properties which can be changed using the Dialog's Config object (cfg).
+* @method initDefaultConfig
+*/
+YAHOO.widget.Dialog.prototype.initDefaultConfig = function() {
+	YAHOO.widget.Dialog.superclass.initDefaultConfig.call(this);
+
+	/**
+	* The internally maintained callback object for use with the Connection utility
+	* @property callback
+	* @type Object
+	*/
+	this.callback = {
+		/**
+		* The function to execute upon success of the Connection submission
+		* @property callback.success
+		* @type Function
+		*/
+		success : null,
+		/**
+		* The function to execute upon failure of the Connection submission
+		* @property callback.failure
+		* @type Function
+		*/
+		failure : null,
+		/**
+		* The arbitraty argument or arguments to pass to the Connection callback functions
+		* @property callback.argument
+		* @type Object
+		*/
+		argument: null
+	};
+
+	// Add form dialog config properties //
+
+	/**
+	* The method to use for posting the Dialog's form. Possible values are "async", "form", and "manual".
+	* @config postmethod
+	* @type String
+	* @default async
+	*/
+	this.cfg.addProperty("postmethod", { value:"async", validator:function(val) {
+													if (val != "form" && val != "async" && val != "none" && val != "manual") {
+														return false;
+													} else {
+														return true;
+													}
+												} });
+
+	/**
+	* Object literal(s) defining the buttons for the Dialog's footer.
+	* @config buttons
+	* @type Object[]
+	* @default "none"
+	*/
+	this.cfg.addProperty("buttons",		{ value:"none",	handler:this.configButtons } );
+};
+
+/**
+* Initializes the custom events for Dialog which are fired automatically at appropriate times by the Dialog class.
+* @method initEvents
+*/
+YAHOO.widget.Dialog.prototype.initEvents = function() {
+	YAHOO.widget.Dialog.superclass.initEvents.call(this);
+
+	/**
+	* CustomEvent fired prior to submission
+	* @event beforeSumitEvent
+	*/
+	this.beforeSubmitEvent	= new YAHOO.util.CustomEvent("beforeSubmit");
+
+	/**
+	* CustomEvent fired after submission
+	* @event submitEvent
+	*/
+	this.submitEvent		= new YAHOO.util.CustomEvent("submit");
+
+	/**
+	* CustomEvent fired prior to manual submission
+	* @event manualSubmitEvent
+	*/
+	this.manualSubmitEvent	= new YAHOO.util.CustomEvent("manualSubmit");
+
+	/**
+	* CustomEvent fired prior to asynchronous submission
+	* @event asyncSubmitEvent
+	*/
+	this.asyncSubmitEvent	= new YAHOO.util.CustomEvent("asyncSubmit");
+
+	/**
+	* CustomEvent fired prior to form-based submission
+	* @event formSubmitEvent
+	*/
+	this.formSubmitEvent	= new YAHOO.util.CustomEvent("formSubmit");
+
+	/**
+	* CustomEvent fired after cancel
+	* @event cancelEvent
+	*/
+	this.cancelEvent		= new YAHOO.util.CustomEvent("cancel");
+};
+
+/**
+* The Dialog initialization method, which is executed for Dialog and all of its subclasses. This method is automatically called by the constructor, and  sets up all DOM references for pre-existing markup, and creates required markup if it is not already present.
+* @method init
+* @param {String}	el	The element ID representing the Dialog <em>OR</em>
+* @param {HTMLElement}	el	The element representing the Dialog
+* @param {Object}	userConfig	The configuration object literal containing the configuration that should be set for this Dialog. See configuration documentation for more details.
+*/
+YAHOO.widget.Dialog.prototype.init = function(el, userConfig) {
+	YAHOO.widget.Dialog.superclass.init.call(this, el/*, userConfig*/);  // Note that we don't pass the user config in here yet because we only want it executed once, at the lowest subclass level
+
+	this.beforeInitEvent.fire(YAHOO.widget.Dialog);
+
+	YAHOO.util.Dom.addClass(this.element, YAHOO.widget.Dialog.CSS_DIALOG);
+
+	this.cfg.setProperty("visible", false);
+
+	if (userConfig) {
+		this.cfg.applyConfig(userConfig, true);
+	}
+
+	this.renderEvent.subscribe(this.registerForm, this, true);
+
+	this.showEvent.subscribe(this.focusFirst, this, true);
+	this.beforeHideEvent.subscribe(this.blurButtons, this, true);
+
+	this.beforeRenderEvent.subscribe(function() {
+		var buttonCfg = this.cfg.getProperty("buttons");
+		if (buttonCfg && buttonCfg != "none") {
+			if (! this.footer) {
+				this.setFooter("");
+			}
+		}
+	}, this, true);
+
+	this.initEvent.fire(YAHOO.widget.Dialog);
+};
+
+/**
+* Performs the submission of the Dialog form depending on the value of "postmethod" property.
+* @method doSubmit
+*/
+YAHOO.widget.Dialog.prototype.doSubmit = function() {
+	var pm = this.cfg.getProperty("postmethod");
+	switch (pm) {
+		case "async":
+			var method = this.form.getAttribute("method") || 'POST';
+			method = method.toUpperCase();
+			YAHOO.util.Connect.setForm(this.form);
+			var cObj = YAHOO.util.Connect.asyncRequest(method, this.form.getAttribute("action"), this.callback);
+			this.asyncSubmitEvent.fire();
+			break;
+		case "form":
+			this.form.submit();
+			this.formSubmitEvent.fire();
+			break;
+		case "none":
+		case "manual":
+			this.manualSubmitEvent.fire();
+			break;
+	}
+};
+
+/**
+* Prepares the Dialog's internal FORM object, creating one if one is not currently present.
+* @method registerForm
+*/
+YAHOO.widget.Dialog.prototype.registerForm = function() {
+	var form = this.element.getElementsByTagName("FORM")[0];
+
+	if (! form) {
+		var formHTML = "<form name=\"frm_" + this.id + "\" action=\"\"></form>";
+		this.body.innerHTML += formHTML;
+		form = this.element.getElementsByTagName("FORM")[0];
+	}
+
+	this.firstFormElement = function() {
+		for (var f=0;f<form.elements.length;f++ ) {
+			var el = form.elements[f];
+			if (el.focus) {
+				if (el.type && el.type != "hidden") {
+					return el;
+				}
+			}
+		}
+		return null;
+	}();
+
+	this.lastFormElement = function() {
+		for (var f=form.elements.length-1;f>=0;f-- ) {
+			var el = form.elements[f];
+			if (el.focus) {
+				if (el.type && el.type != "hidden") {
+					return el;
+				}
+			}
+		}
+		return null;
+	}();
+
+	this.form = form;
+
+	if (this.cfg.getProperty("modal") && this.form) {
+
+		var me = this;
+
+		var firstElement = this.firstFormElement || this.firstButton;
+		if (firstElement) {
+			this.preventBackTab = new YAHOO.util.KeyListener(firstElement, { shift:true, keys:9 }, {fn:me.focusLast, scope:me, correctScope:true} );
+			this.showEvent.subscribe(this.preventBackTab.enable, this.preventBackTab, true);
+			this.hideEvent.subscribe(this.preventBackTab.disable, this.preventBackTab, true);
+		}
+
+		var lastElement = this.lastButton || this.lastFormElement;
+		if (lastElement) {
+			this.preventTabOut = new YAHOO.util.KeyListener(lastElement, { shift:false, keys:9 }, {fn:me.focusFirst, scope:me, correctScope:true} );
+			this.showEvent.subscribe(this.preventTabOut.enable, this.preventTabOut, true);
+			this.hideEvent.subscribe(this.preventTabOut.disable, this.preventTabOut, true);
+		}
+	}
+};
+
+// BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
+
+/**
+* The default event handler for the "buttons" configuration property
+* @method configButtons
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.Dialog.prototype.configButtons = function(type, args, obj) {
+	var buttons = args[0];
+	if (buttons != "none") {
+		this.buttonSpan = null;
+		this.buttonSpan = document.createElement("SPAN");
+		this.buttonSpan.className = "button-group";
+
+		for (var b=0;b<buttons.length;b++) {
+			var button = buttons[b];
+
+			var htmlButton = document.createElement("BUTTON");
+			htmlButton.setAttribute("type", "button");
+
+			if (button.isDefault) {
+				htmlButton.className = "default";
+				this.defaultHtmlButton = htmlButton;
+			}
+
+			htmlButton.appendChild(document.createTextNode(button.text));
+			YAHOO.util.Event.addListener(htmlButton, "click", button.handler, this, true);
+
+			this.buttonSpan.appendChild(htmlButton);
+			button.htmlButton = htmlButton;
+
+			if (b === 0) {
+				this.firstButton = button.htmlButton;
+			}
+
+			if (b == (buttons.length-1)) {
+				this.lastButton = button.htmlButton;
+			}
+
+		}
+
+		this.setFooter(this.buttonSpan);
+
+		this.cfg.refireEvent("iframe");
+		this.cfg.refireEvent("underlay");
+	} else { // Do cleanup
+		if (this.buttonSpan) {
+			if (this.buttonSpan.parentNode) {
+				this.buttonSpan.parentNode.removeChild(this.buttonSpan);
+			}
+
+			this.buttonSpan = null;
+			this.firstButton = null;
+			this.lastButton = null;
+			this.defaultHtmlButton = null;
+		}
+	}
+};
+
+
+/**
+* The default event handler used to focus the first field of the form when the Dialog is shown.
+* @method focusFirst
+*/
+YAHOO.widget.Dialog.prototype.focusFirst = function(type,args,obj) {
+	if (args) {
+		var e = args[1];
+		if (e) {
+			YAHOO.util.Event.stopEvent(e);
+		}
+	}
+
+	if (this.firstFormElement) {
+		this.firstFormElement.focus();
+	} else {
+		this.focusDefaultButton();
+	}
+};
+
+/**
+* Sets the focus to the last button in the button or form element in the Dialog
+* @method focusLast
+*/
+YAHOO.widget.Dialog.prototype.focusLast = function(type,args,obj) {
+	if (args) {
+		var e = args[1];
+		if (e) {
+			YAHOO.util.Event.stopEvent(e);
+		}
+	}
+
+	var buttons = this.cfg.getProperty("buttons");
+	if (buttons && buttons instanceof Array) {
+		this.focusLastButton();
+	} else {
+		if (this.lastFormElement) {
+			this.lastFormElement.focus();
+		}
+	}
+};
+
+/**
+* Sets the focus to the button that is designated as the default. By default, his handler is executed when the show event is fired.
+* @method focusDefaultButton
+*/
+YAHOO.widget.Dialog.prototype.focusDefaultButton = function() {
+	if (this.defaultHtmlButton) {
+		this.defaultHtmlButton.focus();
+	}
+};
+
+/**
+* Blurs all the html buttons
+* @method blurButtons
+*/
+YAHOO.widget.Dialog.prototype.blurButtons = function() {
+	var buttons = this.cfg.getProperty("buttons");
+	if (buttons && buttons instanceof Array) {
+		var html = buttons[0].htmlButton;
+		if (html) {
+			html.blur();
+		}
+	}
+};
+
+/**
+* Sets the focus to the first button in the button list
+* @method focusFirstButton
+*/
+YAHOO.widget.Dialog.prototype.focusFirstButton = function() {
+	var buttons = this.cfg.getProperty("buttons");
+	if (buttons && buttons instanceof Array) {
+		var html = buttons[0].htmlButton;
+		if (html) {
+			html.focus();
+		}
+	}
+};
+
+/**
+* Sets the focus to the first button in the button list
+* @method focusLastButton
+*/
+YAHOO.widget.Dialog.prototype.focusLastButton = function() {
+	var buttons = this.cfg.getProperty("buttons");
+	if (buttons && buttons instanceof Array) {
+		var html = buttons[buttons.length-1].htmlButton;
+		if (html) {
+			html.focus();
+		}
+	}
+};
+
+// END BUILT-IN PROPERTY EVENT HANDLERS //
+
+/**
+* Built-in function hook for writing a validation function that will be checked for a "true" value prior to a submit. This function, as implemented by default, always returns true, so it should be overridden if validation is necessary.
+* @method validate
+*/
+YAHOO.widget.Dialog.prototype.validate = function() {
+	return true;
+};
+
+/**
+* Executes a submit of the Dialog followed by a hide, if validation is successful.
+* @method submit
+*/
+YAHOO.widget.Dialog.prototype.submit = function() {
+	if (this.validate()) {
+		this.beforeSubmitEvent.fire();
+		this.doSubmit();
+		this.submitEvent.fire();
+		this.hide();
+		return true;
+	} else {
+		return false;
+	}
+};
+
+/**
+* Executes the cancel of the Dialog followed by a hide.
+* @method cancel
+*/
+YAHOO.widget.Dialog.prototype.cancel = function() {
+	this.cancelEvent.fire();
+	this.hide();
+};
+
+/**
+* Returns a JSON-compatible data structure representing the data currently contained in the form.
+* @method getData
+* @return {Object} A JSON object reprsenting the data of the current form.
+*/
+YAHOO.widget.Dialog.prototype.getData = function() {
+	var form = this.form;
+	var data = {};
+
+	if (form) {
+		for (var i in this.form) {
+			var formItem = form[i];
+			if (formItem) {
+				if (formItem.tagName) { // Got a single form item
+					switch (formItem.tagName) {
+						case "INPUT":
+							switch (formItem.type) {
+								case "checkbox":
+									data[i] = formItem.checked;
+									break;
+								case "textbox":
+								case "text":
+								case "hidden":
+									data[i] = formItem.value;
+									break;
+							}
+							break;
+						case "TEXTAREA":
+							data[i] = formItem.value;
+							break;
+						case "SELECT":
+							var val = [];
+							for (var x=0;x<formItem.options.length;x++)	{
+								var option = formItem.options[x];
+								if (option.selected) {
+									var selval = option.value;
+									if (! selval || selval === "") {
+										selval = option.text;
+									}
+									val[val.length] = selval;
+								}
+							}
+							data[i] = val;
+							break;
+					}
+				} else if (formItem[0] && formItem[0].tagName) { // this is an array of form items
+					if (formItem[0].tagName == "INPUT") {
+						switch (formItem[0].type) {
+							case "radio":
+								for (var r=0; r<formItem.length; r++) {
+									var radio = formItem[r];
+									if (radio.checked) {
+										data[radio.name] = radio.value;
+										break;
+									}
+								}
+								break;
+							case "checkbox":
+								var cbArray = [];
+								for (var c=0; c<formItem.length; c++) {
+									var check = formItem[c];
+									if (check.checked) {
+										cbArray[cbArray.length] = check.value;
+									}
+								}
+								data[formItem[0].name] = cbArray;
+								break;
+						}
+					}
+				}
+			}
+		}
+	}
+	return data;
+};
+
+/**
+* Returns a string representation of the object.
+* @method toString
+* @return {String}	The string representation of the Dialog
+*/
+YAHOO.widget.Dialog.prototype.toString = function() {
+	return "Dialog " + this.id;
+};
+
+/**
+* SimpleDialog is a simple implementation of Dialog that can be used to submit a single value. Forms can be processed in 3 ways -- via an asynchronous Connection utility call, a simple form POST or GET, or manually.
+* @namespace YAHOO.widget
+* @class SimpleDialog
+* @extends YAHOO.widget.Dialog
+* @constructor
+* @param {String}	el	The element ID representing the SimpleDialog <em>OR</em>
+* @param {HTMLElement}	el	The element representing the SimpleDialog
+* @param {Object}	userConfig	The configuration object literal containing the configuration that should be set for this SimpleDialog. See configuration documentation for more details.
+*/
+YAHOO.widget.SimpleDialog = function(el, userConfig) {
+	YAHOO.widget.SimpleDialog.superclass.constructor.call(this, el, userConfig);
+};
+
+YAHOO.extend(YAHOO.widget.SimpleDialog, YAHOO.widget.Dialog);
+
+/**
+* Constant for the standard network icon for a blocking action
+* @property YAHOO.widget.SimpleDialog.ICON_BLOCK
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.SimpleDialog.ICON_BLOCK = "nt/ic/ut/bsc/blck16_1.gif";
+
+/**
+* Constant for the standard network icon for alarm
+* @property YAHOO.widget.SimpleDialog.ICON_ALARM
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.SimpleDialog.ICON_ALARM = "nt/ic/ut/bsc/alrt16_1.gif";
+
+/**
+* Constant for the standard network icon for help
+* @property YAHOO.widget.SimpleDialog.ICON_HELP
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.SimpleDialog.ICON_HELP  = "nt/ic/ut/bsc/hlp16_1.gif";
+
+/**
+* Constant for the standard network icon for info
+* @property YAHOO.widget.SimpleDialog.ICON_INFO
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.SimpleDialog.ICON_INFO  = "nt/ic/ut/bsc/info16_1.gif";
+
+/**
+* Constant for the standard network icon for warn
+* @property YAHOO.widget.SimpleDialog.ICON_WARN
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.SimpleDialog.ICON_WARN  = "nt/ic/ut/bsc/warn16_1.gif";
+
+/**
+* Constant for the standard network icon for a tip
+* @property YAHOO.widget.SimpleDialog.ICON_TIP
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.SimpleDialog.ICON_TIP   = "nt/ic/ut/bsc/tip16_1.gif";
+
+/**
+* Constant representing the default CSS class used for a SimpleDialog
+* @property YAHOO.widget.SimpleDialog.CSS_SIMPLEDIALOG
+* @static
+* @final
+* @type String
+*/
+YAHOO.widget.SimpleDialog.CSS_SIMPLEDIALOG = "simple-dialog";
+
+/**
+* Initializes the class's configurable properties which can be changed using the SimpleDialog's Config object (cfg).
+* @method initDefaultConfig
+*/
+YAHOO.widget.SimpleDialog.prototype.initDefaultConfig = function() {
+	YAHOO.widget.SimpleDialog.superclass.initDefaultConfig.call(this);
+
+	// Add dialog config properties //
+
+	/**
+	* Sets the informational icon for the SimpleDialog
+	* @config icon
+	* @type String
+	* @default "none"
+	*/
+	this.cfg.addProperty("icon",	{ value:"none",	handler:this.configIcon, suppressEvent:true } );
+
+	/**
+	* Sets the text for the SimpleDialog
+	* @config text
+	* @type String
+	* @default ""
+	*/
+	this.cfg.addProperty("text",	{ value:"", handler:this.configText, suppressEvent:true, supercedes:["icon"] } );
+};
+
+
+/**
+* The SimpleDialog initialization method, which is executed for SimpleDialog and all of its subclasses. This method is automatically called by the constructor, and  sets up all DOM references for pre-existing markup, and creates required markup if it is not already present.
+* @method init
+* @param {String}	el	The element ID representing the SimpleDialog <em>OR</em>
+* @param {HTMLElement}	el	The element representing the SimpleDialog
+* @param {Object}	userConfig	The configuration object literal containing the configuration that should be set for this SimpleDialog. See configuration documentation for more details.
+*/
+YAHOO.widget.SimpleDialog.prototype.init = function(el, userConfig) {
+	YAHOO.widget.SimpleDialog.superclass.init.call(this, el/*, userConfig*/);  // Note that we don't pass the user config in here yet because we only want it executed once, at the lowest subclass level
+
+	this.beforeInitEvent.fire(YAHOO.widget.SimpleDialog);
+
+	YAHOO.util.Dom.addClass(this.element, YAHOO.widget.SimpleDialog.CSS_SIMPLEDIALOG);
+
+	this.cfg.queueProperty("postmethod", "manual");
+
+	if (userConfig) {
+		this.cfg.applyConfig(userConfig, true);
+	}
+
+	this.beforeRenderEvent.subscribe(function() {
+		if (! this.body) {
+			this.setBody("");
+		}
+	}, this, true);
+
+	this.initEvent.fire(YAHOO.widget.SimpleDialog);
+
+};
+/**
+* Prepares the SimpleDialog's internal FORM object, creating one if one is not currently present, and adding the value hidden field.
+* @method registerForm
+*/
+YAHOO.widget.SimpleDialog.prototype.registerForm = function() {
+	YAHOO.widget.SimpleDialog.superclass.registerForm.call(this);
+	this.form.innerHTML += "<input type=\"hidden\" name=\"" + this.id + "\" value=\"\"/>";
+};
+
+// BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
+
+/**
+* Fired when the "icon" property is set.
+* @method configIcon
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.SimpleDialog.prototype.configIcon = function(type,args,obj) {
+	var icon = args[0];
+	if (icon && icon != "none") {
+		var iconHTML = "<img src=\"" + this.imageRoot + icon + "\" class=\"icon\" />";
+		this.body.innerHTML = iconHTML + this.body.innerHTML;
+	}
+};
+
+/**
+* Fired when the "text" property is set.
+* @method configText
+* @param {String} type	The CustomEvent type (usually the property name)
+* @param {Object[]}	args	The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
+* @param {Object} obj	The scope object. For configuration handlers, this will usually equal the owner.
+*/
+YAHOO.widget.SimpleDialog.prototype.configText = function(type,args,obj) {
+	var text = args[0];
+	if (text) {
+		this.setBody(text);
+		this.cfg.refireEvent("icon");
+	}
+};
+// END BUILT-IN PROPERTY EVENT HANDLERS //
+
+/**
+* Returns a string representation of the object.
+* @method toString
+* @return {String}	The string representation of the SimpleDialog
+*/
+YAHOO.widget.SimpleDialog.prototype.toString = function() {
+	return "SimpleDialog " + this.id;
+};
+
+/**
+* ContainerEffect encapsulates animation transitions that are executed when an Overlay is shown or hidden.
+* @namespace YAHOO.widget
+* @class ContainerEffect
+* @constructor
+* @param {YAHOO.widget.Overlay}	overlay		The Overlay that the animation should be associated with
+* @param {Object}	attrIn		The object literal representing the animation arguments to be used for the animate-in transition. The arguments for this literal are: attributes(object, see YAHOO.util.Anim for description), duration(Number), and method(i.e. YAHOO.util.Easing.easeIn).
+* @param {Object}	attrOut		The object literal representing the animation arguments to be used for the animate-out transition. The arguments for this literal are: attributes(object, see YAHOO.util.Anim for description), duration(Number), and method(i.e. YAHOO.util.Easing.easeIn).
+* @param {HTMLElement}	targetElement	Optional. The target element that should be animated during the transition. Defaults to overlay.element.
+* @param {class}	Optional. The animation class to instantiate. Defaults to YAHOO.util.Anim. Other options include YAHOO.util.Motion.
+*/
+YAHOO.widget.ContainerEffect = function(overlay, attrIn, attrOut, targetElement, animClass) {
+	if (! animClass) {
+		animClass = YAHOO.util.Anim;
+	}
+
+	/**
+	* The overlay to animate
+	* @property overlay
+	* @type YAHOO.widget.Overlay
+	*/
+	this.overlay = overlay;
+	/**
+	* The animation attributes to use when transitioning into view
+	* @property attrIn
+	* @type Object
+	*/
+	this.attrIn = attrIn;
+	/**
+	* The animation attributes to use when transitioning out of view
+	* @property attrOut
+	* @type Object
+	*/
+	this.attrOut = attrOut;
+	/**
+	* The target element to be animated
+	* @property targetElement
+	* @type HTMLElement
+	*/
+	this.targetElement = targetElement || overlay.element;
+	/**
+	* The animation class to use for animating the overlay
+	* @property animClass
+	* @type class
+	*/
+	this.animClass = animClass;
+};
+
+/**
+* Initializes the animation classes and events.
+* @method init
+*/
+YAHOO.widget.ContainerEffect.prototype.init = function() {
+	this.beforeAnimateInEvent = new YAHOO.util.CustomEvent("beforeAnimateIn");
+	this.beforeAnimateOutEvent = new YAHOO.util.CustomEvent("beforeAnimateOut");
+
+	this.animateInCompleteEvent = new YAHOO.util.CustomEvent("animateInComplete");
+	this.animateOutCompleteEvent = new YAHOO.util.CustomEvent("animateOutComplete");
+
+	this.animIn = new this.animClass(this.targetElement, this.attrIn.attributes, this.attrIn.duration, this.attrIn.method);
+	this.animIn.onStart.subscribe(this.handleStartAnimateIn, this);
+	this.animIn.onTween.subscribe(this.handleTweenAnimateIn, this);
+	this.animIn.onComplete.subscribe(this.handleCompleteAnimateIn, this);
+
+	this.animOut = new this.animClass(this.targetElement, this.attrOut.attributes, this.attrOut.duration, this.attrOut.method);
+	this.animOut.onStart.subscribe(this.handleStartAnimateOut, this);
+	this.animOut.onTween.subscribe(this.handleTweenAnimateOut, this);
+	this.animOut.onComplete.subscribe(this.handleCompleteAnimateOut, this);
+};
+
+/**
+* Triggers the in-animation.
+* @method animateIn
+*/
+YAHOO.widget.ContainerEffect.prototype.animateIn = function() {
+	this.beforeAnimateInEvent.fire();
+	this.animIn.animate();
+};
+
+/**
+* Triggers the out-animation.
+* @method animateOut
+*/
+YAHOO.widget.ContainerEffect.prototype.animateOut = function() {
+	this.beforeAnimateOutEvent.fire();
+	this.animOut.animate();
+};
+
+/**
+* The default onStart handler for the in-animation.
+* @method handleStartAnimateIn
+* @param {String} type	The CustomEvent type
+* @param {Object[]}	args	The CustomEvent arguments
+* @param {Object} obj	The scope object
+*/
+YAHOO.widget.ContainerEffect.prototype.handleStartAnimateIn = function(type, args, obj) { };
+/**
+* The default onTween handler for the in-animation.
+* @method handleTweenAnimateIn
+* @param {String} type	The CustomEvent type
+* @param {Object[]}	args	The CustomEvent arguments
+* @param {Object} obj	The scope object
+*/
+YAHOO.widget.ContainerEffect.prototype.handleTweenAnimateIn = function(type, args, obj) { };
+/**
+* The default onComplete handler for the in-animation.
+* @method handleCompleteAnimateIn
+* @param {String} type	The CustomEvent type
+* @param {Object[]}	args	The CustomEvent arguments
+* @param {Object} obj	The scope object
+*/
+YAHOO.widget.ContainerEffect.prototype.handleCompleteAnimateIn = function(type, args, obj) { };
+
+/**
+* The default onStart handler for the out-animation.
+* @method handleStartAnimateOut
+* @param {String} type	The CustomEvent type
+* @param {Object[]}	args	The CustomEvent arguments
+* @param {Object} obj	The scope object
+*/
+YAHOO.widget.ContainerEffect.prototype.handleStartAnimateOut = function(type, args, obj) { };
+/**
+* The default onTween handler for the out-animation.
+* @method handleTweenAnimateOut
+* @param {String} type	The CustomEvent type
+* @param {Object[]}	args	The CustomEvent arguments
+* @param {Object} obj	The scope object
+*/
+YAHOO.widget.ContainerEffect.prototype.handleTweenAnimateOut = function(type, args, obj) { };
+/**
+* The default onComplete handler for the out-animation.
+* @method handleCompleteAnimateOut
+* @param {String} type	The CustomEvent type
+* @param {Object[]}	args	The CustomEvent arguments
+* @param {Object} obj	The scope object
+*/
+YAHOO.widget.ContainerEffect.prototype.handleCompleteAnimateOut = function(type, args, obj) { };
+
+/**
+* Returns a string representation of the object.
+* @method toString
+* @return {String}	The string representation of the ContainerEffect
+*/
+YAHOO.widget.ContainerEffect.prototype.toString = function() {
+	var output = "ContainerEffect";
+	if (this.overlay) {
+		output += " [" + this.overlay.toString() + "]";
+	}
+	return output;
+};
+
+/**
+* A pre-configured ContainerEffect instance that can be used for fading an overlay in and out.
+* @method FADE
+* @static
+* @param {Overlay}	The Overlay object to animate
+* @param {Number}	The duration of the animation
+* @return {ContainerEffect}	The configured ContainerEffect object
+*/
+YAHOO.widget.ContainerEffect.FADE = function(overlay, dur) {
+	var fade = new YAHOO.widget.ContainerEffect(overlay, { attributes:{opacity: {from:0, to:1}}, duration:dur, method:YAHOO.util.Easing.easeIn }, { attributes:{opacity: {to:0}}, duration:dur, method:YAHOO.util.Easing.easeOut}, overlay.element );
+
+	fade.handleStartAnimateIn = function(type,args,obj) {
+		YAHOO.util.Dom.addClass(obj.overlay.element, "hide-select");
+
+		if (! obj.overlay.underlay) {
+			obj.overlay.cfg.refireEvent("underlay");
+		}
+
+		if (obj.overlay.underlay) {
+			obj.initialUnderlayOpacity = YAHOO.util.Dom.getStyle(obj.overlay.underlay, "opacity");
+			obj.overlay.underlay.style.filter = null;
+		}
+
+		YAHOO.util.Dom.setStyle(obj.overlay.element, "visibility", "visible");
+		YAHOO.util.Dom.setStyle(obj.overlay.element, "opacity", 0);
+	};
+
+	fade.handleCompleteAnimateIn = function(type,args,obj) {
+		YAHOO.util.Dom.removeClass(obj.overlay.element, "hide-select");
+
+		if (obj.overlay.element.style.filter) {
+			obj.overlay.element.style.filter = null;
+		}
+
+		if (obj.overlay.underlay) {
+			YAHOO.util.Dom.setStyle(obj.overlay.underlay, "opacity", obj.initialUnderlayOpacity);
+		}
+
+		obj.overlay.cfg.refireEvent("iframe");
+		obj.animateInCompleteEvent.fire();
+	};
+
+	fade.handleStartAnimateOut = function(type, args, obj) {
+		YAHOO.util.Dom.addClass(obj.overlay.element, "hide-select");
+
+		if (obj.overlay.underlay) {
+			obj.overlay.underlay.style.filter = null;
+		}
+	};
+
+	fade.handleCompleteAnimateOut =  function(type, args, obj) {
+		YAHOO.util.Dom.removeClass(obj.overlay.element, "hide-select");
+		if (obj.overlay.element.style.filter) {
+			obj.overlay.element.style.filter = null;
+		}
+		YAHOO.util.Dom.setStyle(obj.overlay.element, "visibility", "hidden");
+		YAHOO.util.Dom.setStyle(obj.overlay.element, "opacity", 1);
+
+		obj.overlay.cfg.refireEvent("iframe");
+
+		obj.animateOutCompleteEvent.fire();
+	};
+
+	fade.init();
+	return fade;
+};
+
+
+/**
+* A pre-configured ContainerEffect instance that can be used for sliding an overlay in and out.
+* @method SLIDE
+* @static
+* @param {Overlay}	The Overlay object to animate
+* @param {Number}	The duration of the animation
+* @return {ContainerEffect}	The configured ContainerEffect object
+*/
+YAHOO.widget.ContainerEffect.SLIDE = function(overlay, dur) {
+	var x = overlay.cfg.getProperty("x") || YAHOO.util.Dom.getX(overlay.element);
+	var y = overlay.cfg.getProperty("y") || YAHOO.util.Dom.getY(overlay.element);
+
+	var clientWidth = YAHOO.util.Dom.getClientWidth();
+	var offsetWidth = overlay.element.offsetWidth;
+
+	var slide = new YAHOO.widget.ContainerEffect(overlay, {
+															attributes:{ points: { to:[x, y] } },
+															duration:dur,
+															method:YAHOO.util.Easing.easeIn
+														},
+														{
+															attributes:{ points: { to:[(clientWidth+25), y] } },
+															duration:dur,
+															method:YAHOO.util.Easing.easeOut
+														},
+														overlay.element,
+														YAHOO.util.Motion);
+
+
+	slide.handleStartAnimateIn = function(type,args,obj) {
+		obj.overlay.element.style.left = (-25-offsetWidth) + "px";
+		obj.overlay.element.style.top  = y + "px";
+	};
+
+	slide.handleTweenAnimateIn = function(type, args, obj) {
+
+
+		var pos = YAHOO.util.Dom.getXY(obj.overlay.element);
+
+		var currentX = pos[0];
+		var currentY = pos[1];
+
+		if (YAHOO.util.Dom.getStyle(obj.overlay.element, "visibility") == "hidden" && currentX < x) {
+			YAHOO.util.Dom.setStyle(obj.overlay.element, "visibility", "visible");
+		}
+
+		obj.overlay.cfg.setProperty("xy", [currentX,currentY], true);
+		obj.overlay.cfg.refireEvent("iframe");
+	};
+
+	slide.handleCompleteAnimateIn = function(type, args, obj) {
+		obj.overlay.cfg.setProperty("xy", [x,y], true);
+		obj.startX = x;
+		obj.startY = y;
+		obj.overlay.cfg.refireEvent("iframe");
+		obj.animateInCompleteEvent.fire();
+	};
+
+	slide.handleStartAnimateOut = function(type, args, obj) {
+		var vw = YAHOO.util.Dom.getViewportWidth();
+
+		var pos = YAHOO.util.Dom.getXY(obj.overlay.element);
+
+		var yso = pos[1];
+
+		var currentTo = obj.animOut.attributes.points.to;
+		obj.animOut.attributes.points.to = [(vw+25), yso];
+	};
+
+	slide.handleTweenAnimateOut = function(type, args, obj) {
+		var pos = YAHOO.util.Dom.getXY(obj.overlay.element);
+
+		var xto = pos[0];
+		var yto = pos[1];
+
+		obj.overlay.cfg.setProperty("xy", [xto,yto], true);
+		obj.overlay.cfg.refireEvent("iframe");
+	};
+
+	slide.handleCompleteAnimateOut = function(type, args, obj) {
+		YAHOO.util.Dom.setStyle(obj.overlay.element, "visibility", "hidden");
+
+		obj.overlay.cfg.setProperty("xy", [x,y]);
+		obj.animateOutCompleteEvent.fire();
+	};
+
+	slide.init();
+	return slide;
+};
\ No newline at end of file
diff --git a/frontend/beta/js/YUI/dom.js b/frontend/beta/js/YUI/dom.js
new file mode 100644
index 0000000..6f04c43
--- a/dev/null
+++ b/frontend/beta/js/YUI/dom.js
@@ -0,0 +1,881 @@
+/*
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 0.12.0
+*/
+
+/**
+ * The dom module provides helper methods for manipulating Dom elements.
+ * @module dom
+ *
+ */
+
+(function() {
+    var Y = YAHOO.util,     // internal shorthand
+        getStyle,           // for load time browser branching
+        setStyle,           // ditto
+        id_counter = 0,     // for use with generateId
+        propertyCache = {}; // for faster hyphen converts
+
+    // brower detection
+    var ua = navigator.userAgent.toLowerCase(),
+        isOpera = (ua.indexOf('opera') > -1),
+        isSafari = (ua.indexOf('safari') > -1),
+        isGecko = (!isOpera && !isSafari && ua.indexOf('gecko') > -1),
+        isIE = (!isOpera && ua.indexOf('msie') > -1);
+
+    // regex cache
+    var patterns = {
+        HYPHEN: /(-[a-z])/i
+    };
+
+
+    var toCamel = function(property) {
+        if ( !patterns.HYPHEN.test(property) ) {
+            return property; // no hyphens
+        }
+
+        if (propertyCache[property]) { // already converted
+            return propertyCache[property];
+        }
+
+        while( patterns.HYPHEN.exec(property) ) {
+            property = property.replace(RegExp.$1,
+                    RegExp.$1.substr(1).toUpperCase());
+        }
+
+        propertyCache[property] = property;
+        return property;
+        //return property.replace(/-([a-z])/gi, function(m0, m1) {return m1.toUpperCase()}) // cant use function as 2nd arg yet due to safari bug
+    };
+
+    // branching at load instead of runtime
+    if (document.defaultView && document.defaultView.getComputedStyle) { // W3C DOM method
+        getStyle = function(el, property) {
+            var value = null;
+
+            var computed = document.defaultView.getComputedStyle(el, '');
+            if (computed) { // test computed before touching for safari
+                value = computed[toCamel(property)];
+            }
+
+            return el.style[property] || value;
+        };
+    } else if (document.documentElement.currentStyle && isIE) { // IE method
+        getStyle = function(el, property) {
+            switch( toCamel(property) ) {
+                case 'opacity' :// IE opacity uses filter
+                    var val = 100;
+                    try { // will error if no DXImageTransform
+                        val = el.filters['DXImageTransform.Microsoft.Alpha'].opacity;
+
+                    } catch(e) {
+                        try { // make sure its in the document
+                            val = el.filters('alpha').opacity;
+                        } catch(e) {
+                        }
+                    }
+                    return val / 100;
+                    break;
+                default:
+                    // test currentStyle before touching
+                    var value = el.currentStyle ? el.currentStyle[property] : null;
+                    return ( el.style[property] || value );
+            }
+        };
+    } else { // default to inline only
+        getStyle = function(el, property) { return el.style[property]; };
+    }
+
+    if (isIE) {
+        setStyle = function(el, property, val) {
+            switch (property) {
+                case 'opacity':
+                    if ( typeof el.style.filter == 'string' ) { // in case not appended
+                        el.style.filter = 'alpha(opacity=' + val * 100 + ')';
+
+                        if (!el.currentStyle || !el.currentStyle.hasLayout) {
+                            el.style.zoom = 1; // when no layout or cant tell
+                        }
+                    }
+                    break;
+                default:
+                el.style[property] = val;
+            }
+        };
+    } else {
+        setStyle = function(el, property, val) {
+            el.style[property] = val;
+        };
+    }
+
+    /**
+     * Provides helper methods for DOM elements.
+     * @namespace YAHOO.util
+     * @class Dom
+     */
+    YAHOO.util.Dom = {
+        /**
+         * Returns an HTMLElement reference.
+         * @method get
+         * @param {String | HTMLElement |Array} el Accepts a string to use as an ID for getting a DOM reference, an actual DOM reference, or an Array of IDs and/or HTMLElements.
+         * @return {HTMLElement | Array} A DOM reference to an HTML element or an array of HTMLElements.
+         */
+        get: function(el) {
+            if (!el) { return null; } // nothing to work with
+
+            if (typeof el != 'string' && !(el instanceof Array) ) { // assuming HTMLElement or HTMLCollection, so pass back as is
+                return el;
+            }
+
+            if (typeof el == 'string') { // ID
+                return document.getElementById(el);
+            }
+            else { // array of ID's and/or elements
+                var collection = [];
+                for (var i = 0, len = el.length; i < len; ++i) {
+                    collection[collection.length] = Y.Dom.get(el[i]);
+                }
+
+                return collection;
+            }
+
+            return null; // safety, should never happen
+        },
+
+        /**
+         * Normalizes currentStyle and ComputedStyle.
+         * @method getStyle
+         * @param {String | HTMLElement |Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
+         * @param {String} property The style property whose value is returned.
+         * @return {String | Array} The current value of the style property for the element(s).
+         */
+        getStyle: function(el, property) {
+            property = toCamel(property);
+
+            var f = function(element) {
+                return getStyle(element, property);
+            };
+
+            return Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Wrapper for setting style properties of HTMLElements.  Normalizes "opacity" across modern browsers.
+         * @method setStyle
+         * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
+         * @param {String} property The style property to be set.
+         * @param {String} val The value to apply to the given property.
+         */
+        setStyle: function(el, property, val) {
+            property = toCamel(property);
+
+            var f = function(element) {
+                setStyle(element, property, val);
+
+            };
+
+            Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Gets the current position of an element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+         * @method getXY
+         * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements
+         * @return {Array} The XY position of the element(s)
+         */
+        getXY: function(el) {
+            var f = function(el) {
+
+            // has to be part of document to have pageXY
+                if (el.parentNode === null || el.offsetParent === null ||
+                        this.getStyle(el, 'display') == 'none') {
+                    return false;
+                }
+
+                var parentNode = null;
+                var pos = [];
+                var box;
+
+                if (el.getBoundingClientRect) { // IE
+                    box = el.getBoundingClientRect();
+                    var doc = document;
+                    if ( !this.inDocument(el) && parent.document != document) {// might be in a frame, need to get its scroll
+                        doc = parent.document;
+
+                        if ( !this.isAncestor(doc.documentElement, el) ) {
+                            return false;
+                        }
+
+                    }
+
+                    var scrollTop = Math.max(doc.documentElement.scrollTop, doc.body.scrollTop);
+                    var scrollLeft = Math.max(doc.documentElement.scrollLeft, doc.body.scrollLeft);
+
+                    return [box.left + scrollLeft, box.top + scrollTop];
+                }
+                else { // safari, opera, & gecko
+                    pos = [el.offsetLeft, el.offsetTop];
+                    parentNode = el.offsetParent;
+                    if (parentNode != el) {
+                        while (parentNode) {
+                            pos[0] += parentNode.offsetLeft;
+                            pos[1] += parentNode.offsetTop;
+                            parentNode = parentNode.offsetParent;
+                        }
+                    }
+                    if (isSafari && this.getStyle(el, 'position') == 'absolute' ) { // safari doubles in some cases
+                        pos[0] -= document.body.offsetLeft;
+                        pos[1] -= document.body.offsetTop;
+                    }
+                }
+
+                if (el.parentNode) { parentNode = el.parentNode; }
+                else { parentNode = null; }
+
+                while (parentNode && parentNode.tagName.toUpperCase() != 'BODY' && parentNode.tagName.toUpperCase() != 'HTML')
+                { // account for any scrolled ancestors
+                    if (Y.Dom.getStyle(parentNode, 'display') != 'inline') { // work around opera inline scrollLeft/Top bug
+                        pos[0] -= parentNode.scrollLeft;
+                        pos[1] -= parentNode.scrollTop;
+                    }
+
+                    if (parentNode.parentNode) {
+                        parentNode = parentNode.parentNode;
+                    } else { parentNode = null; }
+                }
+
+
+                return pos;
+            };
+
+            return Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Gets the current X position of an element based on page coordinates.  The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+         * @method getX
+         * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements
+         * @return {String | Array} The X position of the element(s)
+         */
+        getX: function(el) {
+            var f = function(el) {
+                return Y.Dom.getXY(el)[0];
+            };
+
+            return Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Gets the current Y position of an element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+         * @method getY
+         * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements
+         * @return {String | Array} The Y position of the element(s)
+         */
+        getY: function(el) {
+            var f = function(el) {
+                return Y.Dom.getXY(el)[1];
+            };
+
+            return Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Set the position of an html element in page coordinates, regardless of how the element is positioned.
+         * The element(s) must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+         * @method setXY
+         * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements
+         * @param {Array} pos Contains X & Y values for new position (coordinates are page-based)
+         * @param {Boolean} noRetry By default we try and set the position a second time if the first fails
+         */
+        setXY: function(el, pos, noRetry) {
+            var f = function(el) {
+                var style_pos = this.getStyle(el, 'position');
+                if (style_pos == 'static') { // default to relative
+                    this.setStyle(el, 'position', 'relative');
+                    style_pos = 'relative';
+                }
+
+                var pageXY = this.getXY(el);
+                if (pageXY === false) { // has to be part of doc to have pageXY
+                    return false;
+                }
+
+                var delta = [ // assuming pixels; if not we will have to retry
+                    parseInt( this.getStyle(el, 'left'), 10 ),
+                    parseInt( this.getStyle(el, 'top'), 10 )
+                ];
+
+                if ( isNaN(delta[0]) ) {// in case of 'auto'
+                    delta[0] = (style_pos == 'relative') ? 0 : el.offsetLeft;
+                }
+                if ( isNaN(delta[1]) ) { // in case of 'auto'
+                    delta[1] = (style_pos == 'relative') ? 0 : el.offsetTop;
+                }
+
+                if (pos[0] !== null) { el.style.left = pos[0] - pageXY[0] + delta[0] + 'px'; }
+                if (pos[1] !== null) { el.style.top = pos[1] - pageXY[1] + delta[1] + 'px'; }
+
+                var newXY = this.getXY(el);
+
+                // if retry is true, try one more time if we miss
+                if (!noRetry && (newXY[0] != pos[0] || newXY[1] != pos[1]) ) {
+                    this.setXY(el, pos, true);
+                }
+
+            };
+
+            Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Set the X position of an html element in page coordinates, regardless of how the element is positioned.
+         * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+         * @method setX
+         * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
+         * @param {Int} x The value to use as the X coordinate for the element(s).
+         */
+        setX: function(el, x) {
+            Y.Dom.setXY(el, [x, null]);
+        },
+
+        /**
+         * Set the Y position of an html element in page coordinates, regardless of how the element is positioned.
+         * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
+         * @method setY
+         * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
+         * @param {Int} x To use as the Y coordinate for the element(s).
+         */
+        setY: function(el, y) {
+            Y.Dom.setXY(el, [null, y]);
+        },
+
+        /**
+         * Returns the region position of the given element.
+         * The element must be part of the DOM tree to have a region (display:none or elements not appended return false).
+         * @method getRegion
+         * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
+         * @return {Region | Array} A Region or array of Region instances containing "top, left, bottom, right" member data.
+         */
+        getRegion: function(el) {
+            var f = function(el) {
+                var region = new Y.Region.getRegion(el);
+                return region;
+            };
+
+            return Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Returns the width of the client (viewport).
+         * @method getClientWidth
+         * @deprecated Now using getViewportWidth.  This interface left intact for back compat.
+         * @return {Int} The width of the viewable area of the page.
+         */
+        getClientWidth: function() {
+            return Y.Dom.getViewportWidth();
+        },
+
+        /**
+         * Returns the height of the client (viewport).
+         * @method getClientHeight
+         * @deprecated Now using getViewportHeight.  This interface left intact for back compat.
+         * @return {Int} The height of the viewable area of the page.
+         */
+        getClientHeight: function() {
+            return Y.Dom.getViewportHeight();
+        },
+
+        /**
+         * Returns a array of HTMLElements with the given class.
+         * For optimized performance, include a tag and/or root node when possible.
+         * @method getElementsByClassName
+         * @param {String} className The class name to match against
+         * @param {String} tag (optional) The tag name of the elements being collected
+         * @param {String | HTMLElement} root (optional) The HTMLElement or an ID to use as the starting point
+         * @return {Array} An array of elements that have the given class name
+         */
+        getElementsByClassName: function(className, tag, root) {
+            var method = function(el) { return Y.Dom.hasClass(el, className); };
+            return Y.Dom.getElementsBy(method, tag, root);
+        },
+
+        /**
+         * Determines whether an HTMLElement has the given className.
+         * @method hasClass
+         * @param {String | HTMLElement | Array} el The element or collection to test
+         * @param {String} className the class name to search for
+         * @return {Boolean | Array} A boolean value or array of boolean values
+         */
+        hasClass: function(el, className) {
+            var re = new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)');
+
+            var f = function(el) {
+                return re.test(el['className']);
+            };
+
+            return Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Adds a class name to a given element or collection of elements.
+         * @method addClass
+         * @param {String | HTMLElement | Array} el The element or collection to add the class to
+         * @param {String} className the class name to add to the class attribute
+         */
+        addClass: function(el, className) {
+            var f = function(el) {
+                if (this.hasClass(el, className)) { return; } // already present
+
+
+                el['className'] = [el['className'], className].join(' ');
+            };
+
+            Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Removes a class name from a given element or collection of elements.
+         * @method removeClass
+         * @param {String | HTMLElement | Array} el The element or collection to remove the class from
+         * @param {String} className the class name to remove from the class attribute
+         */
+        removeClass: function(el, className) {
+            var re = new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)', 'g');
+
+            var f = function(el) {
+                if (!this.hasClass(el, className)) { return; } // not present
+
+
+                var c = el['className'];
+                el['className'] = c.replace(re, ' ');
+                if ( this.hasClass(el, className) ) { // in case of multiple adjacent
+                    this.removeClass(el, className);
+                }
+
+            };
+
+            Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Replace a class with another class for a given element or collection of elements.
+         * If no oldClassName is present, the newClassName is simply added.
+         * @method replaceClass
+         * @param {String | HTMLElement | Array} el The element or collection to remove the class from
+         * @param {String} oldClassName the class name to be replaced
+         * @param {String} newClassName the class name that will be replacing the old class name
+         */
+        replaceClass: function(el, oldClassName, newClassName) {
+            if (oldClassName === newClassName) { // avoid infinite loop
+                return false;
+            }
+
+            var re = new RegExp('(?:^|\\s+)' + oldClassName + '(?:\\s+|$)', 'g');
+
+            var f = function(el) {
+
+                if ( !this.hasClass(el, oldClassName) ) {
+                    this.addClass(el, newClassName); // just add it if nothing to replace
+                    return; // note return
+                }
+
+                el['className'] = el['className'].replace(re, ' ' + newClassName + ' ');
+
+                if ( this.hasClass(el, oldClassName) ) { // in case of multiple adjacent
+                    this.replaceClass(el, oldClassName, newClassName);
+                }
+            };
+
+            Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Generates a unique ID
+         * @method generateId
+         * @param {String | HTMLElement | Array} el (optional) An optional element array of elements to add an ID to (no ID is added if one is already present).
+         * @param {String} prefix (optional) an optional prefix to use (defaults to "yui-gen").
+         * @return {String | Array} The generated ID, or array of generated IDs (or original ID if already present on an element)
+         */
+        generateId: function(el, prefix) {
+            prefix = prefix || 'yui-gen';
+            el = el || {};
+
+            var f = function(el) {
+                if (el) {
+                    el = Y.Dom.get(el);
+                } else {
+                    el = {}; // just generating ID in this case
+                }
+
+                if (!el.id) {
+                    el.id = prefix + id_counter++;
+                } // dont override existing
+
+
+                return el.id;
+            };
+
+            return Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Determines whether an HTMLElement is an ancestor of another HTML element in the DOM hierarchy.
+         * @method isAncestor
+         * @param {String | HTMLElement} haystack The possible ancestor
+         * @param {String | HTMLElement} needle The possible descendent
+         * @return {Boolean} Whether or not the haystack is an ancestor of needle
+         */
+        isAncestor: function(haystack, needle) {
+            haystack = Y.Dom.get(haystack);
+            if (!haystack || !needle) { return false; }
+
+            var f = function(needle) {
+                if (haystack.contains && !isSafari) { // safari "contains" is broken
+                    return haystack.contains(needle);
+                }
+                else if ( haystack.compareDocumentPosition ) {
+                    return !!(haystack.compareDocumentPosition(needle) & 16);
+                }
+                else { // loop up and test each parent
+                    var parent = needle.parentNode;
+
+                    while (parent) {
+                        if (parent == haystack) {
+                            return true;
+                        }
+                        else if (!parent.tagName || parent.tagName.toUpperCase() == 'HTML') {
+                            return false;
+                        }
+
+                        parent = parent.parentNode;
+                    }
+                    return false;
+                }
+            };
+
+            return Y.Dom.batch(needle, f, Y.Dom, true);
+        },
+
+        /**
+         * Determines whether an HTMLElement is present in the current document.
+         * @method inDocument
+         * @param {String | HTMLElement} el The element to search for
+         * @return {Boolean} Whether or not the element is present in the current document
+         */
+        inDocument: function(el) {
+            var f = function(el) {
+                return this.isAncestor(document.documentElement, el);
+            };
+
+            return Y.Dom.batch(el, f, Y.Dom, true);
+        },
+
+        /**
+         * Returns a array of HTMLElements that pass the test applied by supplied boolean method.
+         * For optimized performance, include a tag and/or root node when possible.
+         * @method getElementsBy
+         * @param {Function} method - A boolean method for testing elements which receives the element as its only argument.
+
+         * @param {String} tag (optional) The tag name of the elements being collected
+         * @param {String | HTMLElement} root (optional) The HTMLElement or an ID to use as the starting point
+         */
+        getElementsBy: function(method, tag, root) {
+            tag = tag || '*';
+            root = Y.Dom.get(root) || document;
+
+            var nodes = [];
+            var elements = root.getElementsByTagName(tag);
+
+            if ( !elements.length && (tag == '*' && root.all) ) {
+                elements = root.all; // IE < 6
+            }
+
+            for (var i = 0, len = elements.length; i < len; ++i) {
+                if ( method(elements[i]) ) { nodes[nodes.length] = elements[i]; }
+            }
+
+
+            return nodes;
+        },
+
+        /**
+         * Returns an array of elements that have had the supplied method applied.
+         * The method is called with the element(s) as the first arg, and the optional param as the second ( method(el, o) ).
+         * @method batch
+         * @param {String | HTMLElement | Array} el (optional) An element or array of elements to apply the method to
+         * @param {Function} method The method to apply to the element(s)
+         * @param {Any} o (optional) An optional arg that is passed to the supplied method
+         * @param {Boolean} override (optional) Whether or not to override the scope of "method" with "o"
+         * @return {HTMLElement | Array} The element(s) with the method applied
+         */
+        batch: function(el, method, o, override) {
+            var id = el;
+            el = Y.Dom.get(el);
+
+            var scope = (override) ? o : window;
+
+            if (!el || el.tagName || !el.length) { // is null or not a collection (tagName for SELECT and others that can be both an element and a collection)
+                if (!el) {
+                    return false;
+                }
+                return method.call(scope, el, o);
+            }
+
+            var collection = [];
+
+            for (var i = 0, len = el.length; i < len; ++i) {
+                if (!el[i]) {
+                    id = el[i];
+                }
+                collection[collection.length] = method.call(scope, el[i], o);
+            }
+
+            return collection;
+        },
+
+        /**
+         * Returns the height of the document.
+         * @method getDocumentHeight
+         * @return {Int} The height of the actual document (which includes the body and its margin).
+         */
+        getDocumentHeight: function() {
+            var scrollHeight = (document.compatMode != 'CSS1Compat') ? document.body.scrollHeight : document.documentElement.scrollHeight;
+
+            var h = Math.max(scrollHeight, Y.Dom.getViewportHeight());
+            return h;
+        },
+
+        /**
+         * Returns the width of the document.
+         * @method getDocumentWidth
+         * @return {Int} The width of the actual document (which includes the body and its margin).
+         */
+        getDocumentWidth: function() {
+            var scrollWidth = (document.compatMode != 'CSS1Compat') ? document.body.scrollWidth : document.documentElement.scrollWidth;
+            var w = Math.max(scrollWidth, Y.Dom.getViewportWidth());
+            return w;
+        },
+
+        /**
+         * Returns the current height of the viewport.
+         * @method getViewportHeight
+         * @return {Int} The height of the viewable area of the page (excludes scrollbars).
+         */
+        getViewportHeight: function() {
+            var height = self.innerHeight; // Safari, Opera
+            var mode = document.compatMode;
+
+            if ( (mode || isIE) && !isOpera ) { // IE, Gecko
+                height = (mode == 'CSS1Compat') ?
+                        document.documentElement.clientHeight : // Standards
+                        document.body.clientHeight; // Quirks
+            }
+
+            return height;
+        },
+
+        /**
+         * Returns the current width of the viewport.
+         * @method getViewportWidth
+         * @return {Int} The width of the viewable area of the page (excludes scrollbars).
+         */
+
+        getViewportWidth: function() {
+            var width = self.innerWidth;  // Safari
+            var mode = document.compatMode;
+
+            if (mode || isIE) { // IE, Gecko, Opera
+                width = (mode == 'CSS1Compat') ?
+                        document.documentElement.clientWidth : // Standards
+                        document.body.clientWidth; // Quirks
+            }
+            return width;
+        }
+    };
+})();
+/**
+ * A region is a representation of an object on a grid.  It is defined
+ * by the top, right, bottom, left extents, so is rectangular by default.  If
+ * other shapes are required, this class could be extended to support it.
+ * @namespace YAHOO.util
+ * @class Region
+ * @param {Int} t the top extent
+ * @param {Int} r the right extent
+ * @param {Int} b the bottom extent
+ * @param {Int} l the left extent
+ * @constructor
+ */
+YAHOO.util.Region = function(t, r, b, l) {
+
+    /**
+     * The region's top extent
+     * @property top
+     * @type Int
+     */
+    this.top = t;
+
+    /**
+     * The region's top extent as index, for symmetry with set/getXY
+     * @property 1
+     * @type Int
+     */
+    this[1] = t;
+
+    /**
+     * The region's right extent
+     * @property right
+     * @type int
+     */
+    this.right = r;
+
+    /**
+     * The region's bottom extent
+     * @property bottom
+     * @type Int
+     */
+    this.bottom = b;
+
+    /**
+     * The region's left extent
+     * @property left
+     * @type Int
+     */
+    this.left = l;
+
+    /**
+     * The region's left extent as index, for symmetry with set/getXY
+     * @property 0
+     * @type Int
+     */
+    this[0] = l;
+};
+
+/**
+ * Returns true if this region contains the region passed in
+ * @method contains
+ * @param  {Region}  region The region to evaluate
+ * @return {Boolean}        True if the region is contained with this region,
+ *                          else false
+ */
+YAHOO.util.Region.prototype.contains = function(region) {
+    return ( region.left   >= this.left   &&
+             region.right  <= this.right  &&
+             region.top    >= this.top    &&
+             region.bottom <= this.bottom    );
+
+};
+
+/**
+ * Returns the area of the region
+ * @method getArea
+ * @return {Int} the region's area
+ */
+YAHOO.util.Region.prototype.getArea = function() {
+    return ( (this.bottom - this.top) * (this.right - this.left) );
+};
+
+/**
+ * Returns the region where the passed in region overlaps with this one
+ * @method intersect
+ * @param  {Region} region The region that intersects
+ * @return {Region}        The overlap region, or null if there is no overlap
+ */
+YAHOO.util.Region.prototype.intersect = function(region) {
+    var t = Math.max( this.top,    region.top    );
+    var r = Math.min( this.right,  region.right  );
+    var b = Math.min( this.bottom, region.bottom );
+    var l = Math.max( this.left,   region.left   );
+
+    if (b >= t && r >= l) {
+        return new YAHOO.util.Region(t, r, b, l);
+    } else {
+        return null;
+    }
+};
+
+/**
+ * Returns the region representing the smallest region that can contain both
+ * the passed in region and this region.
+ * @method union
+ * @param  {Region} region The region that to create the union with
+ * @return {Region}        The union region
+ */
+YAHOO.util.Region.prototype.union = function(region) {
+    var t = Math.min( this.top,    region.top    );
+    var r = Math.max( this.right,  region.right  );
+    var b = Math.max( this.bottom, region.bottom );
+    var l = Math.min( this.left,   region.left   );
+
+    return new YAHOO.util.Region(t, r, b, l);
+};
+
+/**
+ * toString
+ * @method toString
+ * @return string the region properties
+ */
+YAHOO.util.Region.prototype.toString = function() {
+    return ( "Region {"    +
+             "top: "       + this.top    +
+             ", right: "   + this.right  +
+             ", bottom: "  + this.bottom +
+             ", left: "    + this.left   +
+             "}" );
+};
+
+/**
+ * Returns a region that is occupied by the DOM element
+ * @method getRegion
+ * @param  {HTMLElement} el The element
+ * @return {Region}         The region that the element occupies
+ * @static
+ */
+YAHOO.util.Region.getRegion = function(el) {
+    var p = YAHOO.util.Dom.getXY(el);
+
+    var t = p[1];
+    var r = p[0] + el.offsetWidth;
+    var b = p[1] + el.offsetHeight;
+    var l = p[0];
+
+    return new YAHOO.util.Region(t, r, b, l);
+};
+
+/////////////////////////////////////////////////////////////////////////////
+
+/**
+ * A point is a region that is special in that it represents a single point on
+ * the grid.
+ * @namespace YAHOO.util
+ * @class Point
+ * @param {Int} x The X position of the point
+ * @param {Int} y The Y position of the point
+ * @constructor
+ * @extends YAHOO.util.Region
+ */
+YAHOO.util.Point = function(x, y) {
+   if (x instanceof Array) { // accept output from Dom.getXY
+      y = x[1];
+      x = x[0];
+   }
+
+    /**
+     * The X position of the point, which is also the right, left and index zero (for Dom.getXY symmetry)
+     * @property x
+     * @type Int
+     */
+
+    this.x = this.right = this.left = this[0] = x;
+
+    /**
+     * The Y position of the point, which is also the top, bottom and index one (for Dom.getXY symmetry)
+     * @property y
+     * @type Int
+     */
+    this.y = this.top = this.bottom = this[1] = y;
+};
+
+YAHOO.util.Point.prototype = new YAHOO.util.Region();
+
diff --git a/frontend/beta/js/YUI/dragdrop.js b/frontend/beta/js/YUI/dragdrop.js
new file mode 100644
index 0000000..43a0f61
--- a/dev/null
+++ b/frontend/beta/js/YUI/dragdrop.js
@@ -0,0 +1,2940 @@
+/*
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 0.12.0
+*/
+
+(function() {
+
+var Event=YAHOO.util.Event;
+var Dom=YAHOO.util.Dom;
+
+/**
+ * Defines the interface and base operation of items that that can be
+ * dragged or can be drop targets.  It was designed to be extended, overriding
+ * the event handlers for startDrag, onDrag, onDragOver, onDragOut.
+ * Up to three html elements can be associated with a DragDrop instance:
+ * <ul>
+ * <li>linked element: the element that is passed into the constructor.
+ * This is the element which defines the boundaries for interaction with
+ * other DragDrop objects.</li>
+ * <li>handle element(s): The drag operation only occurs if the element that
+ * was clicked matches a handle element.  By default this is the linked
+ * element, but there are times that you will want only a portion of the
+ * linked element to initiate the drag operation, and the setHandleElId()
+ * method provides a way to define this.</li>
+ * <li>drag element: this represents an the element that would be moved along
+ * with the cursor during a drag operation.  By default, this is the linked
+ * element itself as in {@link YAHOO.util.DD}.  setDragElId() lets you define
+ * a separate element that would be moved, as in {@link YAHOO.util.DDProxy}
+ * </li>
+ * </ul>
+ * This class should not be instantiated until the onload event to ensure that
+ * the associated elements are available.
+ * The following would define a DragDrop obj that would interact with any
+ * other DragDrop obj in the "group1" group:
+ * <pre>
+ *  dd = new YAHOO.util.DragDrop("div1", "group1");
+ * </pre>
+ * Since none of the event handlers have been implemented, nothing would
+ * actually happen if you were to run the code above.  Normally you would
+ * override this class or one of the default implementations, but you can
+ * also override the methods you want on an instance of the class...
+ * <pre>
+ *  dd.onDragDrop = function(e, id) {
+ *  &nbsp;&nbsp;alert("dd was dropped on " + id);
+ *  }
+ * </pre>
+ * @namespace YAHOO.util
+ * @class DragDrop
+ * @constructor
+ * @param {String} id of the element that is linked to this instance
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DragDrop:
+ *                    padding, isTarget, maintainOffset, primaryButtonOnly
+ */
+YAHOO.util.DragDrop = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+    }
+};
+
+YAHOO.util.DragDrop.prototype = {
+
+    /**
+     * The id of the element associated with this object.  This is what we
+     * refer to as the "linked element" because the size and position of
+     * this element is used to determine when the drag and drop objects have
+     * interacted.
+     * @property id
+     * @type String
+     */
+    id: null,
+
+    /**
+     * Configuration attributes passed into the constructor
+     * @property config
+     * @type object
+     */
+    config: null,
+
+    /**
+     * The id of the element that will be dragged.  By default this is same
+     * as the linked element , but could be changed to another element. Ex:
+     * YAHOO.util.DDProxy
+     * @property dragElId
+     * @type String
+     * @private
+     */
+    dragElId: null,
+
+    /**
+     * the id of the element that initiates the drag operation.  By default
+     * this is the linked element, but could be changed to be a child of this
+     * element.  This lets us do things like only starting the drag when the
+     * header element within the linked html element is clicked.
+     * @property handleElId
+     * @type String
+     * @private
+     */
+    handleElId: null,
+
+    /**
+     * An associative array of HTML tags that will be ignored if clicked.
+     * @property invalidHandleTypes
+     * @type {string: string}
+     */
+    invalidHandleTypes: null,
+
+    /**
+     * An associative array of ids for elements that will be ignored if clicked
+     * @property invalidHandleIds
+     * @type {string: string}
+     */
+    invalidHandleIds: null,
+
+    /**
+     * An indexted array of css class names for elements that will be ignored
+     * if clicked.
+     * @property invalidHandleClasses
+     * @type string[]
+     */
+    invalidHandleClasses: null,
+
+    /**
+     * The linked element's absolute X position at the time the drag was
+     * started
+     * @property startPageX
+     * @type int
+     * @private
+     */
+    startPageX: 0,
+
+    /**
+     * The linked element's absolute X position at the time the drag was
+     * started
+     * @property startPageY
+     * @type int
+     * @private
+     */
+    startPageY: 0,
+
+    /**
+     * The group defines a logical collection of DragDrop objects that are
+     * related.  Instances only get events when interacting with other
+     * DragDrop object in the same group.  This lets us define multiple
+     * groups using a single DragDrop subclass if we want.
+     * @property groups
+     * @type {string: string}
+     */
+    groups: null,
+
+    /**
+     * Individual drag/drop instances can be locked.  This will prevent
+     * onmousedown start drag.
+     * @property locked
+     * @type boolean
+     * @private
+     */
+    locked: false,
+
+    /**
+     * Lock this instance
+     * @method lock
+     */
+    lock: function() { this.locked = true; },
+
+    /**
+     * Unlock this instace
+     * @method unlock
+     */
+    unlock: function() { this.locked = false; },
+
+    /**
+     * By default, all insances can be a drop target.  This can be disabled by
+     * setting isTarget to false.
+     * @method isTarget
+     * @type boolean
+     */
+    isTarget: true,
+
+    /**
+     * The padding configured for this drag and drop object for calculating
+     * the drop zone intersection with this object.
+     * @method padding
+     * @type int[]
+     */
+    padding: null,
+
+    /**
+     * Cached reference to the linked element
+     * @property _domRef
+     * @private
+     */
+    _domRef: null,
+
+    /**
+     * Internal typeof flag
+     * @property __ygDragDrop
+     * @private
+     */
+    __ygDragDrop: true,
+
+    /**
+     * Set to true when horizontal contraints are applied
+     * @property constrainX
+     * @type boolean
+     * @private
+     */
+    constrainX: false,
+
+    /**
+     * Set to true when vertical contraints are applied
+     * @property constrainY
+     * @type boolean
+     * @private
+     */
+    constrainY: false,
+
+    /**
+     * The left constraint
+     * @property minX
+     * @type int
+     * @private
+     */
+    minX: 0,
+
+    /**
+     * The right constraint
+     * @property maxX
+     * @type int
+     * @private
+     */
+    maxX: 0,
+
+    /**
+     * The up constraint
+     * @property minY
+     * @type int
+     * @type int
+     * @private
+     */
+    minY: 0,
+
+    /**
+     * The down constraint
+     * @property maxY
+     * @type int
+     * @private
+     */
+    maxY: 0,
+
+    /**
+     * Maintain offsets when we resetconstraints.  Set to true when you want
+     * the position of the element relative to its parent to stay the same
+     * when the page changes
+     *
+     * @property maintainOffset
+     * @type boolean
+     */
+    maintainOffset: false,
+
+    /**
+     * Array of pixel locations the element will snap to if we specified a
+     * horizontal graduation/interval.  This array is generated automatically
+     * when you define a tick interval.
+     * @property xTicks
+     * @type int[]
+     */
+    xTicks: null,
+
+    /**
+     * Array of pixel locations the element will snap to if we specified a
+     * vertical graduation/interval.  This array is generated automatically
+     * when you define a tick interval.
+     * @property yTicks
+     * @type int[]
+     */
+    yTicks: null,
+
+    /**
+     * By default the drag and drop instance will only respond to the primary
+     * button click (left button for a right-handed mouse).  Set to true to
+     * allow drag and drop to start with any mouse click that is propogated
+     * by the browser
+     * @property primaryButtonOnly
+     * @type boolean
+     */
+    primaryButtonOnly: true,
+
+    /**
+     * The availabe property is false until the linked dom element is accessible.
+     * @property available
+     * @type boolean
+     */
+    available: false,
+
+    /**
+     * By default, drags can only be initiated if the mousedown occurs in the
+     * region the linked element is.  This is done in part to work around a
+     * bug in some browsers that mis-report the mousedown if the previous
+     * mouseup happened outside of the window.  This property is set to true
+     * if outer handles are defined.
+     *
+     * @property hasOuterHandles
+     * @type boolean
+     * @default false
+     */
+    hasOuterHandles: false,
+
+    /**
+     * Code that executes immediately before the startDrag event
+     * @method b4StartDrag
+     * @private
+     */
+    b4StartDrag: function(x, y) { },
+
+    /**
+     * Abstract method called after a drag/drop object is clicked
+     * and the drag or mousedown time thresholds have beeen met.
+     * @method startDrag
+     * @param {int} X click location
+     * @param {int} Y click location
+     */
+    startDrag: function(x, y) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDrag event
+     * @method b4Drag
+     * @private
+     */
+    b4Drag: function(e) { },
+
+    /**
+     * Abstract method called during the onMouseMove event while dragging an
+     * object.
+     * @method onDrag
+     * @param {Event} e the mousemove event
+     */
+    onDrag: function(e) { /* override this */ },
+
+    /**
+     * Abstract method called when this element fist begins hovering over
+     * another DragDrop obj
+     * @method onDragEnter
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this is hovering over.  In INTERSECT mode, an array of one or more
+     * dragdrop items being hovered over.
+     */
+    onDragEnter: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragOver event
+     * @method b4DragOver
+     * @private
+     */
+    b4DragOver: function(e) { },
+
+    /**
+     * Abstract method called when this element is hovering over another
+     * DragDrop obj
+     * @method onDragOver
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this is hovering over.  In INTERSECT mode, an array of dd items
+     * being hovered over.
+     */
+    onDragOver: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragOut event
+     * @method b4DragOut
+     * @private
+     */
+    b4DragOut: function(e) { },
+
+    /**
+     * Abstract method called when we are no longer hovering over an element
+     * @method onDragOut
+     * @param {Event} e the mousemove event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this was hovering over.  In INTERSECT mode, an array of dd items
+     * that the mouse is no longer over.
+     */
+    onDragOut: function(e, id) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the onDragDrop event
+     * @method b4DragDrop
+     * @private
+     */
+    b4DragDrop: function(e) { },
+
+    /**
+     * Abstract method called when this item is dropped on another DragDrop
+     * obj
+     * @method onDragDrop
+     * @param {Event} e the mouseup event
+     * @param {String|DragDrop[]} id In POINT mode, the element
+     * id this was dropped on.  In INTERSECT mode, an array of dd items this
+     * was dropped on.
+     */
+    onDragDrop: function(e, id) { /* override this */ },
+
+    /**
+     * Abstract method called when this item is dropped on an area with no
+     * drop target
+     * @method onInvalidDrop
+     * @param {Event} e the mouseup event
+     */
+    onInvalidDrop: function(e) { /* override this */ },
+
+    /**
+     * Code that executes immediately before the endDrag event
+     * @method b4EndDrag
+     * @private
+     */
+    b4EndDrag: function(e) { },
+
+    /**
+     * Fired when we are done dragging the object
+     * @method endDrag
+     * @param {Event} e the mouseup event
+     */
+    endDrag: function(e) { /* override this */ },
+
+    /**
+     * Code executed immediately before the onMouseDown event
+     * @method b4MouseDown
+     * @param {Event} e the mousedown event
+     * @private
+     */
+    b4MouseDown: function(e) {  },
+
+    /**
+     * Event handler that fires when a drag/drop obj gets a mousedown
+     * @method onMouseDown
+     * @param {Event} e the mousedown event
+     */
+    onMouseDown: function(e) { /* override this */ },
+
+    /**
+     * Event handler that fires when a drag/drop obj gets a mouseup
+     * @method onMouseUp
+     * @param {Event} e the mouseup event
+     */
+    onMouseUp: function(e) { /* override this */ },
+
+    /**
+     * Override the onAvailable method to do what is needed after the initial
+     * position was determined.
+     * @method onAvailable
+     */
+    onAvailable: function () {
+    },
+
+    /**
+     * Returns a reference to the linked element
+     * @method getEl
+     * @return {HTMLElement} the html element
+     */
+    getEl: function() {
+        if (!this._domRef) {
+            this._domRef = Dom.get(this.id);
+        }
+
+        return this._domRef;
+    },
+
+    /**
+     * Returns a reference to the actual element to drag.  By default this is
+     * the same as the html element, but it can be assigned to another
+     * element. An example of this can be found in YAHOO.util.DDProxy
+     * @method getDragEl
+     * @return {HTMLElement} the html element
+     */
+    getDragEl: function() {
+        return Dom.get(this.dragElId);
+    },
+
+    /**
+     * Sets up the DragDrop object.  Must be called in the constructor of any
+     * YAHOO.util.DragDrop subclass
+     * @method init
+     * @param id the id of the linked element
+     * @param {String} sGroup the group of related items
+     * @param {object} config configuration attributes
+     */
+    init: function(id, sGroup, config) {
+        this.initTarget(id, sGroup, config);
+        Event.on(this.id, "mousedown", this.handleMouseDown, this, true);
+        // Event.on(this.id, "selectstart", Event.preventDefault);
+    },
+
+    /**
+     * Initializes Targeting functionality only... the object does not
+     * get a mousedown handler.
+     * @method initTarget
+     * @param id the id of the linked element
+     * @param {String} sGroup the group of related items
+     * @param {object} config configuration attributes
+     */
+    initTarget: function(id, sGroup, config) {
+
+        // configuration attributes
+        this.config = config || {};
+
+        // create a local reference to the drag and drop manager
+        this.DDM = YAHOO.util.DDM;
+        // initialize the groups array
+        this.groups = {};
+
+        // assume that we have an element reference instead of an id if the
+        // parameter is not a string
+        if (typeof id !== "string") {
+            YAHOO.log("id is not a string, assuming it is an HTMLElement");
+            id = Dom.generateId(id);
+        }
+
+        // set the id
+        this.id = id;
+
+        // add to an interaction group
+        this.addToGroup((sGroup) ? sGroup : "default");
+
+        // We don't want to register this as the handle with the manager
+        // so we just set the id rather than calling the setter.
+        this.handleElId = id;
+
+        Event.onAvailable(id, this.handleOnAvailable, this, true);
+
+
+        // the linked element is the element that gets dragged by default
+        this.setDragElId(id);
+
+        // by default, clicked anchors will not start drag operations.
+        // @TODO what else should be here?  Probably form fields.
+        this.invalidHandleTypes = { A: "A" };
+        this.invalidHandleIds = {};
+        this.invalidHandleClasses = [];
+
+        this.applyConfig();
+    },
+
+    /**
+     * Applies the configuration parameters that were passed into the constructor.
+     * This is supposed to happen at each level through the inheritance chain.  So
+     * a DDProxy implentation will execute apply config on DDProxy, DD, and
+     * DragDrop in order to get all of the parameters that are available in
+     * each object.
+     * @method applyConfig
+     */
+    applyConfig: function() {
+
+        // configurable properties:
+        //    padding, isTarget, maintainOffset, primaryButtonOnly
+        this.padding           = this.config.padding || [0, 0, 0, 0];
+        this.isTarget          = (this.config.isTarget !== false);
+        this.maintainOffset    = (this.config.maintainOffset);
+        this.primaryButtonOnly = (this.config.primaryButtonOnly !== false);
+
+    },
+
+    /**
+     * Executed when the linked element is available
+     * @method handleOnAvailable
+     * @private
+     */
+    handleOnAvailable: function() {
+        this.available = true;
+        this.resetConstraints();
+        this.onAvailable();
+    },
+
+     /**
+     * Configures the padding for the target zone in px.  Effectively expands
+     * (or reduces) the virtual object size for targeting calculations.
+     * Supports css-style shorthand; if only one parameter is passed, all sides
+     * will have that padding, and if only two are passed, the top and bottom
+     * will have the first param, the left and right the second.
+     * @method setPadding
+     * @param {int} iTop    Top pad
+     * @param {int} iRight  Right pad
+     * @param {int} iBot    Bot pad
+     * @param {int} iLeft   Left pad
+     */
+    setPadding: function(iTop, iRight, iBot, iLeft) {
+        // this.padding = [iLeft, iRight, iTop, iBot];
+        if (!iRight && 0 !== iRight) {
+            this.padding = [iTop, iTop, iTop, iTop];
+        } else if (!iBot && 0 !== iBot) {
+            this.padding = [iTop, iRight, iTop, iRight];
+        } else {
+            this.padding = [iTop, iRight, iBot, iLeft];
+        }
+    },
+
+    /**
+     * Stores the initial placement of the linked element.
+     * @method setInitialPosition
+     * @param {int} diffX   the X offset, default 0
+     * @param {int} diffY   the Y offset, default 0
+     */
+    setInitPosition: function(diffX, diffY) {
+        var el = this.getEl();
+
+        if (!this.DDM.verifyEl(el)) {
+            return;
+        }
+
+        var dx = diffX || 0;
+        var dy = diffY || 0;
+
+        var p = Dom.getXY( el );
+
+        this.initPageX = p[0] - dx;
+        this.initPageY = p[1] - dy;
+
+        this.lastPageX = p[0];
+        this.lastPageY = p[1];
+
+
+        this.setStartPosition(p);
+    },
+
+    /**
+     * Sets the start position of the element.  This is set when the obj
+     * is initialized, the reset when a drag is started.
+     * @method setStartPosition
+     * @param pos current position (from previous lookup)
+     * @private
+     */
+    setStartPosition: function(pos) {
+        var p = pos || Dom.getXY( this.getEl() );
+        this.deltaSetXY = null;
+
+        this.startPageX = p[0];
+        this.startPageY = p[1];
+    },
+
+    /**
+     * Add this instance to a group of related drag/drop objects.  All
+     * instances belong to at least one group, and can belong to as many
+     * groups as needed.
+     * @method addToGroup
+     * @param sGroup {string} the name of the group
+     */
+    addToGroup: function(sGroup) {
+        this.groups[sGroup] = true;
+        this.DDM.regDragDrop(this, sGroup);
+    },
+
+    /**
+     * Remove's this instance from the supplied interaction group
+     * @method removeFromGroup
+     * @param {string}  sGroup  The group to drop
+     */
+    removeFromGroup: function(sGroup) {
+        if (this.groups[sGroup]) {
+            delete this.groups[sGroup];
+        }
+
+        this.DDM.removeDDFromGroup(this, sGroup);
+    },
+
+    /**
+     * Allows you to specify that an element other than the linked element
+     * will be moved with the cursor during a drag
+     * @method setDragElId
+     * @param id {string} the id of the element that will be used to initiate the drag
+     */
+    setDragElId: function(id) {
+        this.dragElId = id;
+    },
+
+    /**
+     * Allows you to specify a child of the linked element that should be
+     * used to initiate the drag operation.  An example of this would be if
+     * you have a content div with text and links.  Clicking anywhere in the
+     * content area would normally start the drag operation.  Use this method
+     * to specify that an element inside of the content div is the element
+     * that starts the drag operation.
+     * @method setHandleElId
+     * @param id {string} the id of the element that will be used to
+     * initiate the drag.
+     */
+    setHandleElId: function(id) {
+        if (typeof id !== "string") {
+            YAHOO.log("id is not a string, assuming it is an HTMLElement");
+            id = Dom.generateId(id);
+        }
+        this.handleElId = id;
+        this.DDM.regHandle(this.id, id);
+    },
+
+    /**
+     * Allows you to set an element outside of the linked element as a drag
+     * handle
+     * @method setOuterHandleElId
+     * @param id the id of the element that will be used to initiate the drag
+     */
+    setOuterHandleElId: function(id) {
+        if (typeof id !== "string") {
+            YAHOO.log("id is not a string, assuming it is an HTMLElement");
+            id = Dom.generateId(id);
+        }
+        Event.on(id, "mousedown",
+                this.handleMouseDown, this, true);
+        this.setHandleElId(id);
+
+        this.hasOuterHandles = true;
+    },
+
+    /**
+     * Remove all drag and drop hooks for this element
+     * @method unreg
+     */
+    unreg: function() {
+        Event.removeListener(this.id, "mousedown",
+                this.handleMouseDown);
+        this._domRef = null;
+        this.DDM._remove(this);
+    },
+
+    /**
+     * Returns true if this instance is locked, or the drag drop mgr is locked
+     * (meaning that all drag/drop is disabled on the page.)
+     * @method isLocked
+     * @return {boolean} true if this obj or all drag/drop is locked, else
+     * false
+     */
+    isLocked: function() {
+        return (this.DDM.isLocked() || this.locked);
+    },
+
+    /**
+     * Fired when this object is clicked
+     * @method handleMouseDown
+     * @param {Event} e
+     * @param {YAHOO.util.DragDrop} oDD the clicked dd object (this dd obj)
+     * @private
+     */
+    handleMouseDown: function(e, oDD) {
+
+        var button = e.which || e.button;
+
+        if (this.primaryButtonOnly && button > 1) {
+            return;
+        }
+
+        if (this.isLocked()) {
+            return;
+        }
+
+        this.DDM.refreshCache(this.groups);
+        // var self = this;
+        // setTimeout( function() { self.DDM.refreshCache(self.groups); }, 0);
+
+        // Only process the event if we really clicked within the linked
+        // element.  The reason we make this check is that in the case that
+        // another element was moved between the clicked element and the
+        // cursor in the time between the mousedown and mouseup events. When
+        // this happens, the element gets the next mousedown event
+        // regardless of where on the screen it happened.
+        var pt = new YAHOO.util.Point(Event.getPageX(e), Event.getPageY(e));
+        if (!this.hasOuterHandles && !this.DDM.isOverTarget(pt, this) )  {
+        } else {
+            if (this.clickValidator(e)) {
+
+
+                // set the initial element position
+                this.setStartPosition();
+
+
+                this.b4MouseDown(e);
+                this.onMouseDown(e);
+                this.DDM.handleMouseDown(e, this);
+
+                this.DDM.stopEvent(e);
+            } else {
+
+
+            }
+        }
+    },
+
+    clickValidator: function(e) {
+        var target = Event.getTarget(e);
+        return ( this.isValidHandleChild(target) &&
+                    (this.id == this.handleElId ||
+                        this.DDM.handleWasClicked(target, this.id)) );
+    },
+
+    /**
+     * Allows you to specify a tag name that should not start a drag operation
+     * when clicked.  This is designed to facilitate embedding links within a
+     * drag handle that do something other than start the drag.
+     * @method addInvalidHandleType
+     * @param {string} tagName the type of element to exclude
+     */
+    addInvalidHandleType: function(tagName) {
+        var type = tagName.toUpperCase();
+        this.invalidHandleTypes[type] = type;
+    },
+
+    /**
+     * Lets you to specify an element id for a child of a drag handle
+     * that should not initiate a drag
+     * @method addInvalidHandleId
+     * @param {string} id the element id of the element you wish to ignore
+     */
+    addInvalidHandleId: function(id) {
+        if (typeof id !== "string") {
+            YAHOO.log("id is not a string, assuming it is an HTMLElement");
+            id = Dom.generateId(id);
+        }
+        this.invalidHandleIds[id] = id;
+    },
+
+    /**
+     * Lets you specify a css class of elements that will not initiate a drag
+     * @method addInvalidHandleClass
+     * @param {string} cssClass the class of the elements you wish to ignore
+     */
+    addInvalidHandleClass: function(cssClass) {
+        this.invalidHandleClasses.push(cssClass);
+    },
+
+    /**
+     * Unsets an excluded tag name set by addInvalidHandleType
+     * @method removeInvalidHandleType
+     * @param {string} tagName the type of element to unexclude
+     */
+    removeInvalidHandleType: function(tagName) {
+        var type = tagName.toUpperCase();
+        // this.invalidHandleTypes[type] = null;
+        delete this.invalidHandleTypes[type];
+    },
+
+    /**
+     * Unsets an invalid handle id
+     * @method removeInvalidHandleId
+     * @param {string} id the id of the element to re-enable
+     */
+    removeInvalidHandleId: function(id) {
+        if (typeof id !== "string") {
+            YAHOO.log("id is not a string, assuming it is an HTMLElement");
+            id = Dom.generateId(id);
+        }
+        delete this.invalidHandleIds[id];
+    },
+
+    /**
+     * Unsets an invalid css class
+     * @method removeInvalidHandleClass
+     * @param {string} cssClass the class of the element(s) you wish to
+     * re-enable
+     */
+    removeInvalidHandleClass: function(cssClass) {
+        for (var i=0, len=this.invalidHandleClasses.length; i<len; ++i) {
+            if (this.invalidHandleClasses[i] == cssClass) {
+                delete this.invalidHandleClasses[i];
+            }
+        }
+    },
+
+    /**
+     * Checks the tag exclusion list to see if this click should be ignored
+     * @method isValidHandleChild
+     * @param {HTMLElement} node the HTMLElement to evaluate
+     * @return {boolean} true if this is a valid tag type, false if not
+     */
+    isValidHandleChild: function(node) {
+
+        var valid = true;
+        // var n = (node.nodeName == "#text") ? node.parentNode : node;
+        var nodeName;
+        try {
+            nodeName = node.nodeName.toUpperCase();
+        } catch(e) {
+            nodeName = node.nodeName;
+        }
+        valid = valid && !this.invalidHandleTypes[nodeName];
+        valid = valid && !this.invalidHandleIds[node.id];
+
+        for (var i=0, len=this.invalidHandleClasses.length; valid && i<len; ++i) {
+            valid = !Dom.hasClass(node, this.invalidHandleClasses[i]);
+        }
+
+
+        return valid;
+
+    },
+
+    /**
+     * Create the array of horizontal tick marks if an interval was specified
+     * in setXConstraint().
+     * @method setXTicks
+     * @private
+     */
+    setXTicks: function(iStartX, iTickSize) {
+        this.xTicks = [];
+        this.xTickSize = iTickSize;
+
+        var tickMap = {};
+
+        for (var i = this.initPageX; i >= this.minX; i = i - iTickSize) {
+            if (!tickMap[i]) {
+                this.xTicks[this.xTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        for (i = this.initPageX; i <= this.maxX; i = i + iTickSize) {
+            if (!tickMap[i]) {
+                this.xTicks[this.xTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        this.xTicks.sort(this.DDM.numericSort) ;
+    },
+
+    /**
+     * Create the array of vertical tick marks if an interval was specified in
+     * setYConstraint().
+     * @method setYTicks
+     * @private
+     */
+    setYTicks: function(iStartY, iTickSize) {
+        this.yTicks = [];
+        this.yTickSize = iTickSize;
+
+        var tickMap = {};
+
+        for (var i = this.initPageY; i >= this.minY; i = i - iTickSize) {
+            if (!tickMap[i]) {
+                this.yTicks[this.yTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        for (i = this.initPageY; i <= this.maxY; i = i + iTickSize) {
+            if (!tickMap[i]) {
+                this.yTicks[this.yTicks.length] = i;
+                tickMap[i] = true;
+            }
+        }
+
+        this.yTicks.sort(this.DDM.numericSort) ;
+    },
+
+    /**
+     * By default, the element can be dragged any place on the screen.  Use
+     * this method to limit the horizontal travel of the element.  Pass in
+     * 0,0 for the parameters if you want to lock the drag to the y axis.
+     * @method setXConstraint
+     * @param {int} iLeft the number of pixels the element can move to the left
+     * @param {int} iRight the number of pixels the element can move to the
+     * right
+     * @param {int} iTickSize optional parameter for specifying that the
+     * element
+     * should move iTickSize pixels at a time.
+     */
+    setXConstraint: function(iLeft, iRight, iTickSize) {
+        this.leftConstraint = iLeft;
+        this.rightConstraint = iRight;
+
+        this.minX = this.initPageX - iLeft;
+        this.maxX = this.initPageX + iRight;
+        if (iTickSize) { this.setXTicks(this.initPageX, iTickSize); }
+
+        this.constrainX = true;
+    },
+
+    /**
+     * Clears any constraints applied to this instance.  Also clears ticks
+     * since they can't exist independent of a constraint at this time.
+     * @method clearConstraints
+     */
+    clearConstraints: function() {
+        this.constrainX = false;
+        this.constrainY = false;
+        this.clearTicks();
+    },
+
+    /**
+     * Clears any tick interval defined for this instance
+     * @method clearTicks
+     */
+    clearTicks: function() {
+        this.xTicks = null;
+        this.yTicks = null;
+        this.xTickSize = 0;
+        this.yTickSize = 0;
+    },
+
+    /**
+     * By default, the element can be dragged any place on the screen.  Set
+     * this to limit the vertical travel of the element.  Pass in 0,0 for the
+     * parameters if you want to lock the drag to the x axis.
+     * @method setYConstraint
+     * @param {int} iUp the number of pixels the element can move up
+     * @param {int} iDown the number of pixels the element can move down
+     * @param {int} iTickSize optional parameter for specifying that the
+     * element should move iTickSize pixels at a time.
+     */
+    setYConstraint: function(iUp, iDown, iTickSize) {
+        this.topConstraint = iUp;
+        this.bottomConstraint = iDown;
+
+        this.minY = this.initPageY - iUp;
+        this.maxY = this.initPageY + iDown;
+        if (iTickSize) { this.setYTicks(this.initPageY, iTickSize); }
+
+        this.constrainY = true;
+
+    },
+
+    /**
+     * resetConstraints must be called if you manually reposition a dd element.
+     * @method resetConstraints
+     * @param {boolean} maintainOffset
+     */
+    resetConstraints: function() {
+
+
+        // Maintain offsets if necessary
+        if (this.initPageX || this.initPageX === 0) {
+            // figure out how much this thing has moved
+            var dx = (this.maintainOffset) ? this.lastPageX - this.initPageX : 0;
+            var dy = (this.maintainOffset) ? this.lastPageY - this.initPageY : 0;
+
+            this.setInitPosition(dx, dy);
+
+        // This is the first time we have detected the element's position
+        } else {
+            this.setInitPosition();
+        }
+
+        if (this.constrainX) {
+            this.setXConstraint( this.leftConstraint,
+                                 this.rightConstraint,
+                                 this.xTickSize        );
+        }
+
+        if (this.constrainY) {
+            this.setYConstraint( this.topConstraint,
+                                 this.bottomConstraint,
+                                 this.yTickSize         );
+        }
+    },
+
+    /**
+     * Normally the drag element is moved pixel by pixel, but we can specify
+     * that it move a number of pixels at a time.  This method resolves the
+     * location when we have it set up like this.
+     * @method getTick
+     * @param {int} val where we want to place the object
+     * @param {int[]} tickArray sorted array of valid points
+     * @return {int} the closest tick
+     * @private
+     */
+    getTick: function(val, tickArray) {
+
+        if (!tickArray) {
+            // If tick interval is not defined, it is effectively 1 pixel,
+            // so we return the value passed to us.
+            return val;
+        } else if (tickArray[0] >= val) {
+            // The value is lower than the first tick, so we return the first
+            // tick.
+            return tickArray[0];
+        } else {
+            for (var i=0, len=tickArray.length; i<len; ++i) {
+                var next = i + 1;
+                if (tickArray[next] && tickArray[next] >= val) {
+                    var diff1 = val - tickArray[i];
+                    var diff2 = tickArray[next] - val;
+                    return (diff2 > diff1) ? tickArray[i] : tickArray[next];
+                }
+            }
+
+            // The value is larger than the last tick, so we return the last
+            // tick.
+            return tickArray[tickArray.length - 1];
+        }
+    },
+
+    /**
+     * toString method
+     * @method toString
+     * @return {string} string representation of the dd obj
+     */
+    toString: function() {
+        return ("DragDrop " + this.id);
+    }
+
+};
+
+})();
+/**
+ * The drag and drop utility provides a framework for building drag and drop
+ * applications.  In addition to enabling drag and drop for specific elements,
+ * the drag and drop elements are tracked by the manager class, and the
+ * interactions between the various elements are tracked during the drag and
+ * the implementing code is notified about these important moments.
+ * @module dragdrop
+ * @title Drag and Drop
+ * @requires yahoo,dom,event
+ * @namespace YAHOO.util
+ */
+
+// Only load the library once.  Rewriting the manager class would orphan
+// existing drag and drop instances.
+if (!YAHOO.util.DragDropMgr) {
+
+/**
+ * DragDropMgr is a singleton that tracks the element interaction for
+ * all DragDrop items in the window.  Generally, you will not call
+ * this class directly, but it does have helper methods that could
+ * be useful in your DragDrop implementations.
+ * @class DragDropMgr
+ * @static
+ */
+YAHOO.util.DragDropMgr = function() {
+
+    var Event = YAHOO.util.Event;
+
+    return {
+
+        /**
+         * Two dimensional Array of registered DragDrop objects.  The first
+         * dimension is the DragDrop item group, the second the DragDrop
+         * object.
+         * @property ids
+         * @type {string: string}
+         * @private
+         * @static
+         */
+        ids: {},
+
+        /**
+         * Array of element ids defined as drag handles.  Used to determine
+         * if the element that generated the mousedown event is actually the
+         * handle and not the html element itself.
+         * @property handleIds
+         * @type {string: string}
+         * @private
+         * @static
+         */
+        handleIds: {},
+
+        /**
+         * the DragDrop object that is currently being dragged
+         * @property dragCurrent
+         * @type DragDrop
+         * @private
+         * @static
+         **/
+        dragCurrent: null,
+
+        /**
+         * the DragDrop object(s) that are being hovered over
+         * @property dragOvers
+         * @type Array
+         * @private
+         * @static
+         */
+        dragOvers: {},
+
+        /**
+         * the X distance between the cursor and the object being dragged
+         * @property deltaX
+         * @type int
+         * @private
+         * @static
+         */
+        deltaX: 0,
+
+        /**
+         * the Y distance between the cursor and the object being dragged
+         * @property deltaY
+         * @type int
+         * @private
+         * @static
+         */
+        deltaY: 0,
+
+        /**
+         * Flag to determine if we should prevent the default behavior of the
+         * events we define. By default this is true, but this can be set to
+         * false if you need the default behavior (not recommended)
+         * @property preventDefault
+         * @type boolean
+         * @static
+         */
+        preventDefault: true,
+
+        /**
+         * Flag to determine if we should stop the propagation of the events
+         * we generate. This is true by default but you may want to set it to
+         * false if the html element contains other features that require the
+         * mouse click.
+         * @property stopPropagation
+         * @type boolean
+         * @static
+         */
+        stopPropagation: true,
+
+        /**
+         * Internal flag that is set to true when drag and drop has been
+         * intialized
+         * @property initialized
+         * @private
+         * @static
+         */
+        initalized: false,
+
+        /**
+         * All drag and drop can be disabled.
+         * @property locked
+         * @private
+         * @static
+         */
+        locked: false,
+
+        /**
+         * Called the first time an element is registered.
+         * @method init
+         * @private
+         * @static
+         */
+        init: function() {
+            this.initialized = true;
+        },
+
+        /**
+         * In point mode, drag and drop interaction is defined by the
+         * location of the cursor during the drag/drop
+         * @property POINT
+         * @type int
+         * @static
+         */
+        POINT: 0,
+
+        /**
+         * In intersect mode, drag and drop interactio nis defined by the
+         * overlap of two or more drag and drop objects.
+         * @property INTERSECT
+         * @type int
+         * @static
+         */
+        INTERSECT: 1,
+
+        /**
+         * The current drag and drop mode.  Default: POINT
+         * @property mode
+         * @type int
+         * @static
+         */
+        mode: 0,
+
+        /**
+         * Runs method on all drag and drop objects
+         * @method _execOnAll
+         * @private
+         * @static
+         */
+        _execOnAll: function(sMethod, args) {
+            for (var i in this.ids) {
+                for (var j in this.ids[i]) {
+                    var oDD = this.ids[i][j];
+                    if (! this.isTypeOfDD(oDD)) {
+                        continue;
+                    }
+                    oDD[sMethod].apply(oDD, args);
+                }
+            }
+        },
+
+        /**
+         * Drag and drop initialization.  Sets up the global event handlers
+         * @method _onLoad
+         * @private
+         * @static
+         */
+        _onLoad: function() {
+
+            this.init();
+
+
+            Event.on(document, "mouseup",   this.handleMouseUp, this, true);
+            Event.on(document, "mousemove", this.handleMouseMove, this, true);
+            Event.on(window,   "unload",    this._onUnload, this, true);
+            Event.on(window,   "resize",    this._onResize, this, true);
+            // Event.on(window,   "mouseout",    this._test);
+
+        },
+
+        /**
+         * Reset constraints on all drag and drop objs
+         * @method _onResize
+         * @private
+         * @static
+         */
+        _onResize: function(e) {
+            this._execOnAll("resetConstraints", []);
+        },
+
+        /**
+         * Lock all drag and drop functionality
+         * @method lock
+         * @static
+         */
+        lock: function() { this.locked = true; },
+
+        /**
+         * Unlock all drag and drop functionality
+         * @method unlock
+         * @static
+         */
+        unlock: function() { this.locked = false; },
+
+        /**
+         * Is drag and drop locked?
+         * @method isLocked
+         * @return {boolean} True if drag and drop is locked, false otherwise.
+         * @static
+         */
+        isLocked: function() { return this.locked; },
+
+        /**
+         * Location cache that is set for all drag drop objects when a drag is
+         * initiated, cleared when the drag is finished.
+         * @property locationCache
+         * @private
+         * @static
+         */
+        locationCache: {},
+
+        /**
+         * Set useCache to false if you want to force object the lookup of each
+         * drag and drop linked element constantly during a drag.
+         * @property useCache
+         * @type boolean
+         * @static
+         */
+        useCache: true,
+
+        /**
+         * The number of pixels that the mouse needs to move after the
+         * mousedown before the drag is initiated.  Default=3;
+         * @property clickPixelThresh
+         * @type int
+         * @static
+         */
+        clickPixelThresh: 3,
+
+        /**
+         * The number of milliseconds after the mousedown event to initiate the
+         * drag if we don't get a mouseup event. Default=1000
+         * @property clickTimeThresh
+         * @type int
+         * @static
+         */
+        clickTimeThresh: 1000,
+
+        /**
+         * Flag that indicates that either the drag pixel threshold or the
+         * mousdown time threshold has been met
+         * @property dragThreshMet
+         * @type boolean
+         * @private
+         * @static
+         */
+        dragThreshMet: false,
+
+        /**
+         * Timeout used for the click time threshold
+         * @property clickTimeout
+         * @type Object
+         * @private
+         * @static
+         */
+        clickTimeout: null,
+
+        /**
+         * The X position of the mousedown event stored for later use when a
+         * drag threshold is met.
+         * @property startX
+         * @type int
+         * @private
+         * @static
+         */
+        startX: 0,
+
+        /**
+         * The Y position of the mousedown event stored for later use when a
+         * drag threshold is met.
+         * @property startY
+         * @type int
+         * @private
+         * @static
+         */
+        startY: 0,
+
+        /**
+         * Each DragDrop instance must be registered with the DragDropMgr.
+         * This is executed in DragDrop.init()
+         * @method regDragDrop
+         * @param {DragDrop} oDD the DragDrop object to register
+         * @param {String} sGroup the name of the group this element belongs to
+         * @static
+         */
+        regDragDrop: function(oDD, sGroup) {
+            if (!this.initialized) { this.init(); }
+
+            if (!this.ids[sGroup]) {
+                this.ids[sGroup] = {};
+            }
+            this.ids[sGroup][oDD.id] = oDD;
+        },
+
+        /**
+         * Removes the supplied dd instance from the supplied group. Executed
+         * by DragDrop.removeFromGroup, so don't call this function directly.
+         * @method removeDDFromGroup
+         * @private
+         * @static
+         */
+        removeDDFromGroup: function(oDD, sGroup) {
+            if (!this.ids[sGroup]) {
+                this.ids[sGroup] = {};
+            }
+
+            var obj = this.ids[sGroup];
+            if (obj && obj[oDD.id]) {
+                delete obj[oDD.id];
+            }
+        },
+
+        /**
+         * Unregisters a drag and drop item.  This is executed in
+         * DragDrop.unreg, use that method instead of calling this directly.
+         * @method _remove
+         * @private
+         * @static
+         */
+        _remove: function(oDD) {
+            for (var g in oDD.groups) {
+                if (g && this.ids[g][oDD.id]) {
+                    delete this.ids[g][oDD.id];
+                }
+            }
+            delete this.handleIds[oDD.id];
+        },
+
+        /**
+         * Each DragDrop handle element must be registered.  This is done
+         * automatically when executing DragDrop.setHandleElId()
+         * @method regHandle
+         * @param {String} sDDId the DragDrop id this element is a handle for
+         * @param {String} sHandleId the id of the element that is the drag
+         * handle
+         * @static
+         */
+        regHandle: function(sDDId, sHandleId) {
+            if (!this.handleIds[sDDId]) {
+                this.handleIds[sDDId] = {};
+            }
+            this.handleIds[sDDId][sHandleId] = sHandleId;
+        },
+
+        /**
+         * Utility function to determine if a given element has been
+         * registered as a drag drop item.
+         * @method isDragDrop
+         * @param {String} id the element id to check
+         * @return {boolean} true if this element is a DragDrop item,
+         * false otherwise
+         * @static
+         */
+        isDragDrop: function(id) {
+            return ( this.getDDById(id) ) ? true : false;
+        },
+
+        /**
+         * Returns the drag and drop instances that are in all groups the
+         * passed in instance belongs to.
+         * @method getRelated
+         * @param {DragDrop} p_oDD the obj to get related data for
+         * @param {boolean} bTargetsOnly if true, only return targetable objs
+         * @return {DragDrop[]} the related instances
+         * @static
+         */
+        getRelated: function(p_oDD, bTargetsOnly) {
+            var oDDs = [];
+            for (var i in p_oDD.groups) {
+                for (j in this.ids[i]) {
+                    var dd = this.ids[i][j];
+                    if (! this.isTypeOfDD(dd)) {
+                        continue;
+                    }
+                    if (!bTargetsOnly || dd.isTarget) {
+                        oDDs[oDDs.length] = dd;
+                    }
+                }
+            }
+
+            return oDDs;
+        },
+
+        /**
+         * Returns true if the specified dd target is a legal target for
+         * the specifice drag obj
+         * @method isLegalTarget
+         * @param {DragDrop} the drag obj
+         * @param {DragDrop} the target
+         * @return {boolean} true if the target is a legal target for the
+         * dd obj
+         * @static
+         */
+        isLegalTarget: function (oDD, oTargetDD) {
+            var targets = this.getRelated(oDD, true);
+            for (var i=0, len=targets.length;i<len;++i) {
+                if (targets[i].id == oTargetDD.id) {
+                    return true;
+                }
+            }
+
+            return false;
+        },
+
+        /**
+         * My goal is to be able to transparently determine if an object is
+         * typeof DragDrop, and the exact subclass of DragDrop.  typeof
+         * returns "object", oDD.constructor.toString() always returns
+         * "DragDrop" and not the name of the subclass.  So for now it just
+         * evaluates a well-known variable in DragDrop.
+         * @method isTypeOfDD
+         * @param {Object} the object to evaluate
+         * @return {boolean} true if typeof oDD = DragDrop
+         * @static
+         */
+        isTypeOfDD: function (oDD) {
+            return (oDD && oDD.__ygDragDrop);
+        },
+
+        /**
+         * Utility function to determine if a given element has been
+         * registered as a drag drop handle for the given Drag Drop object.
+         * @method isHandle
+         * @param {String} id the element id to check
+         * @return {boolean} true if this element is a DragDrop handle, false
+         * otherwise
+         * @static
+         */
+        isHandle: function(sDDId, sHandleId) {
+            return ( this.handleIds[sDDId] &&
+                            this.handleIds[sDDId][sHandleId] );
+        },
+
+        /**
+         * Returns the DragDrop instance for a given id
+         * @method getDDById
+         * @param {String} id the id of the DragDrop object
+         * @return {DragDrop} the drag drop object, null if it is not found
+         * @static
+         */
+        getDDById: function(id) {
+            for (var i in this.ids) {
+                if (this.ids[i][id]) {
+                    return this.ids[i][id];
+                }
+            }
+            return null;
+        },
+
+        /**
+         * Fired after a registered DragDrop object gets the mousedown event.
+         * Sets up the events required to track the object being dragged
+         * @method handleMouseDown
+         * @param {Event} e the event
+         * @param oDD the DragDrop object being dragged
+         * @private
+         * @static
+         */
+        handleMouseDown: function(e, oDD) {
+
+            this.currentTarget = YAHOO.util.Event.getTarget(e);
+
+            this.dragCurrent = oDD;
+
+            var el = oDD.getEl();
+
+            // track start position
+            this.startX = YAHOO.util.Event.getPageX(e);
+            this.startY = YAHOO.util.Event.getPageY(e);
+
+            this.deltaX = this.startX - el.offsetLeft;
+            this.deltaY = this.startY - el.offsetTop;
+
+            this.dragThreshMet = false;
+
+            this.clickTimeout = setTimeout(
+                    function() {
+                        var DDM = YAHOO.util.DDM;
+                        DDM.startDrag(DDM.startX, DDM.startY);
+                    },
+                    this.clickTimeThresh );
+        },
+
+        /**
+         * Fired when either the drag pixel threshol or the mousedown hold
+         * time threshold has been met.
+         * @method startDrag
+         * @param x {int} the X position of the original mousedown
+         * @param y {int} the Y position of the original mousedown
+         * @static
+         */
+        startDrag: function(x, y) {
+            clearTimeout(this.clickTimeout);
+            if (this.dragCurrent) {
+                this.dragCurrent.b4StartDrag(x, y);
+                this.dragCurrent.startDrag(x, y);
+            }
+            this.dragThreshMet = true;
+        },
+
+        /**
+         * Internal function to handle the mouseup event.  Will be invoked
+         * from the context of the document.
+         * @method handleMouseUp
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        handleMouseUp: function(e) {
+
+            if (! this.dragCurrent) {
+                return;
+            }
+
+            clearTimeout(this.clickTimeout);
+
+            if (this.dragThreshMet) {
+                this.fireEvents(e, true);
+            } else {
+            }
+
+            this.stopDrag(e);
+
+            this.stopEvent(e);
+        },
+
+        /**
+         * Utility to stop event propagation and event default, if these
+         * features are turned on.
+         * @method stopEvent
+         * @param {Event} e the event as returned by this.getEvent()
+         * @static
+         */
+        stopEvent: function(e) {
+            if (this.stopPropagation) {
+                YAHOO.util.Event.stopPropagation(e);
+            }
+
+            if (this.preventDefault) {
+                YAHOO.util.Event.preventDefault(e);
+            }
+        },
+
+        /**
+         * Internal function to clean up event handlers after the drag
+         * operation is complete
+         * @method stopDrag
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        stopDrag: function(e) {
+
+            // Fire the drag end event for the item that was dragged
+            if (this.dragCurrent) {
+                if (this.dragThreshMet) {
+                    this.dragCurrent.b4EndDrag(e);
+                    this.dragCurrent.endDrag(e);
+                }
+
+                this.dragCurrent.onMouseUp(e);
+            }
+
+            this.dragCurrent = null;
+            this.dragOvers = {};
+        },
+
+        /**
+         * Internal function to handle the mousemove event.  Will be invoked
+         * from the context of the html element.
+         *
+         * @TODO figure out what we can do about mouse events lost when the
+         * user drags objects beyond the window boundary.  Currently we can
+         * detect this in internet explorer by verifying that the mouse is
+         * down during the mousemove event.  Firefox doesn't give us the
+         * button state on the mousemove event.
+         * @method handleMouseMove
+         * @param {Event} e the event
+         * @private
+         * @static
+         */
+        handleMouseMove: function(e) {
+            if (! this.dragCurrent) {
+                return true;
+            }
+
+            // var button = e.which || e.button;
+
+            // check for IE mouseup outside of page boundary
+            if (YAHOO.util.Event.isIE && !e.button) {
+                this.stopEvent(e);
+                return this.handleMouseUp(e);
+            }
+
+            if (!this.dragThreshMet) {
+                var diffX = Math.abs(this.startX - YAHOO.util.Event.getPageX(e));
+                var diffY = Math.abs(this.startY - YAHOO.util.Event.getPageY(e));
+                if (diffX > this.clickPixelThresh ||
+                            diffY > this.clickPixelThresh) {
+                    this.startDrag(this.startX, this.startY);
+                }
+            }
+
+            if (this.dragThreshMet) {
+                this.dragCurrent.b4Drag(e);
+                this.dragCurrent.onDrag(e);
+                this.fireEvents(e, false);
+            }
+
+            this.stopEvent(e);
+
+            return true;
+        },
+
+        /**
+         * Iterates over all of the DragDrop elements to find ones we are
+         * hovering over or dropping on
+         * @method fireEvents
+         * @param {Event} e the event
+         * @param {boolean} isDrop is this a drop op or a mouseover op?
+         * @private
+         * @static
+         */
+        fireEvents: function(e, isDrop) {
+            var dc = this.dragCurrent;
+
+            // If the user did the mouse up outside of the window, we could
+            // get here even though we have ended the drag.
+            if (!dc || dc.isLocked()) {
+                return;
+            }
+
+            var x = YAHOO.util.Event.getPageX(e);
+            var y = YAHOO.util.Event.getPageY(e);
+            var pt = new YAHOO.util.Point(x,y);
+
+            // cache the previous dragOver array
+            var oldOvers = [];
+
+            var outEvts   = [];
+            var overEvts  = [];
+            var dropEvts  = [];
+            var enterEvts = [];
+
+            // Check to see if the object(s) we were hovering over is no longer
+            // being hovered over so we can fire the onDragOut event
+            for (var i in this.dragOvers) {
+
+                var ddo = this.dragOvers[i];
+
+                if (! this.isTypeOfDD(ddo)) {
+                    continue;
+                }
+
+                if (! this.isOverTarget(pt, ddo, this.mode)) {
+                    outEvts.push( ddo );
+                }
+
+                oldOvers[i] = true;
+                delete this.dragOvers[i];
+            }
+
+            for (var sGroup in dc.groups) {
+
+                if ("string" != typeof sGroup) {
+                    continue;
+                }
+
+                for (i in this.ids[sGroup]) {
+                    var oDD = this.ids[sGroup][i];
+                    if (! this.isTypeOfDD(oDD)) {
+                        continue;
+                    }
+
+                    if (oDD.isTarget && !oDD.isLocked() && oDD != dc) {
+                        if (this.isOverTarget(pt, oDD, this.mode)) {
+                            // look for drop interactions
+                            if (isDrop) {
+                                dropEvts.push( oDD );
+                            // look for drag enter and drag over interactions
+                            } else {
+
+                                // initial drag over: dragEnter fires
+                                if (!oldOvers[oDD.id]) {
+                                    enterEvts.push( oDD );
+                                // subsequent drag overs: dragOver fires
+                                } else {
+                                    overEvts.push( oDD );
+                                }
+
+                                this.dragOvers[oDD.id] = oDD;
+                            }
+                        }
+                    }
+                }
+            }
+
+            if (this.mode) {
+                if (outEvts.length) {
+                    dc.b4DragOut(e, outEvts);
+                    dc.onDragOut(e, outEvts);
+                }
+
+                if (enterEvts.length) {
+                    dc.onDragEnter(e, enterEvts);
+                }
+
+                if (overEvts.length) {
+                    dc.b4DragOver(e, overEvts);
+                    dc.onDragOver(e, overEvts);
+                }
+
+                if (dropEvts.length) {
+                    dc.b4DragDrop(e, dropEvts);
+                    dc.onDragDrop(e, dropEvts);
+                }
+
+            } else {
+                // fire dragout events
+                var len = 0;
+                for (i=0, len=outEvts.length; i<len; ++i) {
+                    dc.b4DragOut(e, outEvts[i].id);
+                    dc.onDragOut(e, outEvts[i].id);
+                }
+
+                // fire enter events
+                for (i=0,len=enterEvts.length; i<len; ++i) {
+                    // dc.b4DragEnter(e, oDD.id);
+                    dc.onDragEnter(e, enterEvts[i].id);
+                }
+
+                // fire over events
+                for (i=0,len=overEvts.length; i<len; ++i) {
+                    dc.b4DragOver(e, overEvts[i].id);
+                    dc.onDragOver(e, overEvts[i].id);
+                }
+
+                // fire drop events
+                for (i=0, len=dropEvts.length; i<len; ++i) {
+                    dc.b4DragDrop(e, dropEvts[i].id);
+                    dc.onDragDrop(e, dropEvts[i].id);
+                }
+
+            }
+
+            // notify about a drop that did not find a target
+            if (isDrop && !dropEvts.length) {
+                dc.onInvalidDrop(e);
+            }
+
+        },
+
+        /**
+         * Helper function for getting the best match from the list of drag
+         * and drop objects returned by the drag and drop events when we are
+         * in INTERSECT mode.  It returns either the first object that the
+         * cursor is over, or the object that has the greatest overlap with
+         * the dragged element.
+         * @method getBestMatch
+         * @param  {DragDrop[]} dds The array of drag and drop objects
+         * targeted
+         * @return {DragDrop}       The best single match
+         * @static
+         */
+        getBestMatch: function(dds) {
+            var winner = null;
+            // Return null if the input is not what we expect
+            //if (!dds || !dds.length || dds.length == 0) {
+               // winner = null;
+            // If there is only one item, it wins
+            //} else if (dds.length == 1) {
+
+            var len = dds.length;
+
+            if (len == 1) {
+                winner = dds[0];
+            } else {
+                // Loop through the targeted items
+                for (var i=0; i<len; ++i) {
+                    var dd = dds[i];
+                    // If the cursor is over the object, it wins.  If the
+                    // cursor is over multiple matches, the first one we come
+                    // to wins.
+                    if (dd.cursorIsOver) {
+                        winner = dd;
+                        break;
+                    // Otherwise the object with the most overlap wins
+                    } else {
+                        if (!winner ||
+                            winner.overlap.getArea() < dd.overlap.getArea()) {
+                            winner = dd;
+                        }
+                    }
+                }
+            }
+
+            return winner;
+        },
+
+        /**
+         * Refreshes the cache of the top-left and bottom-right points of the
+         * drag and drop objects in the specified group(s).  This is in the
+         * format that is stored in the drag and drop instance, so typical
+         * usage is:
+         * <code>
+         * YAHOO.util.DragDropMgr.refreshCache(ddinstance.groups);
+         * </code>
+         * Alternatively:
+         * <code>
+         * YAHOO.util.DragDropMgr.refreshCache({group1:true, group2:true});
+         * </code>
+         * @TODO this really should be an indexed array.  Alternatively this
+         * method could accept both.
+         * @method refreshCache
+         * @param {Object} groups an associative array of groups to refresh
+         * @static
+         */
+        refreshCache: function(groups) {
+            for (var sGroup in groups) {
+                if ("string" != typeof sGroup) {
+                    continue;
+                }
+                for (var i in this.ids[sGroup]) {
+                    var oDD = this.ids[sGroup][i];
+
+                    if (this.isTypeOfDD(oDD)) {
+                    // if (this.isTypeOfDD(oDD) && oDD.isTarget) {
+                        var loc = this.getLocation(oDD);
+                        if (loc) {
+                            this.locationCache[oDD.id] = loc;
+                        } else {
+                            delete this.locationCache[oDD.id];
+                            // this will unregister the drag and drop object if
+                            // the element is not in a usable state
+                            // oDD.unreg();
+                        }
+                    }
+                }
+            }
+        },
+
+        /**
+         * This checks to make sure an element exists and is in the DOM.  The
+         * main purpose is to handle cases where innerHTML is used to remove
+         * drag and drop objects from the DOM.  IE provides an 'unspecified
+         * error' when trying to access the offsetParent of such an element
+         * @method verifyEl
+         * @param {HTMLElement} el the element to check
+         * @return {boolean} true if the element looks usable
+         * @static
+         */
+        verifyEl: function(el) {
+            try {
+                if (el) {
+                    var parent = el.offsetParent;
+                    if (parent) {
+                        return true;
+                    }
+                }
+            } catch(e) {
+            }
+
+            return false;
+        },
+
+        /**
+         * Returns a Region object containing the drag and drop element's position
+         * and size, including the padding configured for it
+         * @method getLocation
+         * @param {DragDrop} oDD the drag and drop object to get the
+         *                       location for
+         * @return {YAHOO.util.Region} a Region object representing the total area
+         *                             the element occupies, including any padding
+         *                             the instance is configured for.
+         * @static
+         */
+        getLocation: function(oDD) {
+            if (! this.isTypeOfDD(oDD)) {
+                return null;
+            }
+
+            var el = oDD.getEl(), pos, x1, x2, y1, y2, t, r, b, l;
+
+            try {
+                pos= YAHOO.util.Dom.getXY(el);
+            } catch (e) { }
+
+            if (!pos) {
+                return null;
+            }
+
+            x1 = pos[0];
+            x2 = x1 + el.offsetWidth;
+            y1 = pos[1];
+            y2 = y1 + el.offsetHeight;
+
+            t = y1 - oDD.padding[0];
+            r = x2 + oDD.padding[1];
+            b = y2 + oDD.padding[2];
+            l = x1 - oDD.padding[3];
+
+            return new YAHOO.util.Region( t, r, b, l );
+        },
+
+        /**
+         * Checks the cursor location to see if it over the target
+         * @method isOverTarget
+         * @param {YAHOO.util.Point} pt The point to evaluate
+         * @param {DragDrop} oTarget the DragDrop object we are inspecting
+         * @return {boolean} true if the mouse is over the target
+         * @private
+         * @static
+         */
+        isOverTarget: function(pt, oTarget, intersect) {
+            // use cache if available
+            var loc = this.locationCache[oTarget.id];
+            if (!loc || !this.useCache) {
+                loc = this.getLocation(oTarget);
+                this.locationCache[oTarget.id] = loc;
+
+            }
+
+            if (!loc) {
+                return false;
+            }
+
+            oTarget.cursorIsOver = loc.contains( pt );
+
+            // DragDrop is using this as a sanity check for the initial mousedown
+            // in this case we are done.  In POINT mode, if the drag obj has no
+            // contraints, we are also done. Otherwise we need to evaluate the
+            // location of the target as related to the actual location of the
+            // dragged element.
+            var dc = this.dragCurrent;
+            if (!dc || !dc.getTargetCoord ||
+                    (!intersect && !dc.constrainX && !dc.constrainY)) {
+                return oTarget.cursorIsOver;
+            }
+
+            oTarget.overlap = null;
+
+            // Get the current location of the drag element, this is the
+            // location of the mouse event less the delta that represents
+            // where the original mousedown happened on the element.  We
+            // need to consider constraints and ticks as well.
+            var pos = dc.getTargetCoord(pt.x, pt.y);
+
+            var el = dc.getDragEl();
+            var curRegion = new YAHOO.util.Region( pos.y,
+                                                   pos.x + el.offsetWidth,
+                                                   pos.y + el.offsetHeight,
+                                                   pos.x );
+
+            var overlap = curRegion.intersect(loc);
+
+            if (overlap) {
+                oTarget.overlap = overlap;
+                return (intersect) ? true : oTarget.cursorIsOver;
+            } else {
+                return false;
+            }
+        },
+
+        /**
+         * unload event handler
+         * @method _onUnload
+         * @private
+         * @static
+         */
+        _onUnload: function(e, me) {
+            this.unregAll();
+        },
+
+        /**
+         * Cleans up the drag and drop events and objects.
+         * @method unregAll
+         * @private
+         * @static
+         */
+        unregAll: function() {
+
+            if (this.dragCurrent) {
+                this.stopDrag();
+                this.dragCurrent = null;
+            }
+
+            this._execOnAll("unreg", []);
+
+            for (i in this.elementCache) {
+                delete this.elementCache[i];
+            }
+
+            this.elementCache = {};
+            this.ids = {};
+        },
+
+        /**
+         * A cache of DOM elements
+         * @property elementCache
+         * @private
+         * @static
+         */
+        elementCache: {},
+
+        /**
+         * Get the wrapper for the DOM element specified
+         * @method getElWrapper
+         * @param {String} id the id of the element to get
+         * @return {YAHOO.util.DDM.ElementWrapper} the wrapped element
+         * @private
+         * @deprecated This wrapper isn't that useful
+         * @static
+         */
+        getElWrapper: function(id) {
+            var oWrapper = this.elementCache[id];
+            if (!oWrapper || !oWrapper.el) {
+                oWrapper = this.elementCache[id] =
+                    new this.ElementWrapper(YAHOO.util.Dom.get(id));
+            }
+            return oWrapper;
+        },
+
+        /**
+         * Returns the actual DOM element
+         * @method getElement
+         * @param {String} id the id of the elment to get
+         * @return {Object} The element
+         * @deprecated use YAHOO.util.Dom.get instead
+         * @static
+         */
+        getElement: function(id) {
+            return YAHOO.util.Dom.get(id);
+        },
+
+        /**
+         * Returns the style property for the DOM element (i.e.,
+         * document.getElById(id).style)
+         * @method getCss
+         * @param {String} id the id of the elment to get
+         * @return {Object} The style property of the element
+         * @deprecated use YAHOO.util.Dom instead
+         * @static
+         */
+        getCss: function(id) {
+            var el = YAHOO.util.Dom.get(id);
+            return (el) ? el.style : null;
+        },
+
+        /**
+         * Inner class for cached elements
+         * @class DragDropMgr.ElementWrapper
+         * @for DragDropMgr
+         * @private
+         * @deprecated
+         */
+        ElementWrapper: function(el) {
+                /**
+                 * The element
+                 * @property el
+                 */
+                this.el = el || null;
+                /**
+                 * The element id
+                 * @property id
+                 */
+                this.id = this.el && el.id;
+                /**
+                 * A reference to the style property
+                 * @property css
+                 */
+                this.css = this.el && el.style;
+            },
+
+        /**
+         * Returns the X position of an html element
+         * @method getPosX
+         * @param el the element for which to get the position
+         * @return {int} the X coordinate
+         * @for DragDropMgr
+         * @deprecated use YAHOO.util.Dom.getX instead
+         * @static
+         */
+        getPosX: function(el) {
+            return YAHOO.util.Dom.getX(el);
+        },
+
+        /**
+         * Returns the Y position of an html element
+         * @method getPosY
+         * @param el the element for which to get the position
+         * @return {int} the Y coordinate
+         * @deprecated use YAHOO.util.Dom.getY instead
+         * @static
+         */
+        getPosY: function(el) {
+            return YAHOO.util.Dom.getY(el);
+        },
+
+        /**
+         * Swap two nodes.  In IE, we use the native method, for others we
+         * emulate the IE behavior
+         * @method swapNode
+         * @param n1 the first node to swap
+         * @param n2 the other node to swap
+         * @static
+         */
+        swapNode: function(n1, n2) {
+            if (n1.swapNode) {
+                n1.swapNode(n2);
+            } else {
+                var p = n2.parentNode;
+                var s = n2.nextSibling;
+
+                if (s == n1) {
+                    p.insertBefore(n1, n2);
+                } else if (n2 == n1.nextSibling) {
+                    p.insertBefore(n2, n1);
+                } else {
+                    n1.parentNode.replaceChild(n2, n1);
+                    p.insertBefore(n1, s);
+                }
+            }
+        },
+
+        /**
+         * Returns the current scroll position
+         * @method getScroll
+         * @private
+         * @static
+         */
+        getScroll: function () {
+            var t, l, dde=document.documentElement, db=document.body;
+            if (dde && (dde.scrollTop || dde.scrollLeft)) {
+                t = dde.scrollTop;
+                l = dde.scrollLeft;
+            } else if (db) {
+                t = db.scrollTop;
+                l = db.scrollLeft;
+            } else {
+                YAHOO.log("could not get scroll property");
+            }
+            return { top: t, left: l };
+        },
+
+        /**
+         * Returns the specified element style property
+         * @method getStyle
+         * @param {HTMLElement} el          the element
+         * @param {string}      styleProp   the style property
+         * @return {string} The value of the style property
+         * @deprecated use YAHOO.util.Dom.getStyle
+         * @static
+         */
+        getStyle: function(el, styleProp) {
+            return YAHOO.util.Dom.getStyle(el, styleProp);
+        },
+
+        /**
+         * Gets the scrollTop
+         * @method getScrollTop
+         * @return {int} the document's scrollTop
+         * @static
+         */
+        getScrollTop: function () { return this.getScroll().top; },
+
+        /**
+         * Gets the scrollLeft
+         * @method getScrollLeft
+         * @return {int} the document's scrollTop
+         * @static
+         */
+        getScrollLeft: function () { return this.getScroll().left; },
+
+        /**
+         * Sets the x/y position of an element to the location of the
+         * target element.
+         * @method moveToEl
+         * @param {HTMLElement} moveEl      The element to move
+         * @param {HTMLElement} targetEl    The position reference element
+         * @static
+         */
+        moveToEl: function (moveEl, targetEl) {
+            var aCoord = YAHOO.util.Dom.getXY(targetEl);
+            YAHOO.util.Dom.setXY(moveEl, aCoord);
+        },
+
+        /**
+         * Gets the client height
+         * @method getClientHeight
+         * @return {int} client height in px
+         * @deprecated use YAHOO.util.Dom.getViewportHeight instead
+         * @static
+         */
+        getClientHeight: function() {
+            return YAHOO.util.Dom.getViewportHeight();
+        },
+
+        /**
+         * Gets the client width
+         * @method getClientWidth
+         * @return {int} client width in px
+         * @deprecated use YAHOO.util.Dom.getViewportWidth instead
+         * @static
+         */
+        getClientWidth: function() {
+            return YAHOO.util.Dom.getViewportWidth();
+        },
+
+        /**
+         * Numeric array sort function
+         * @method numericSort
+         * @static
+         */
+        numericSort: function(a, b) { return (a - b); },
+
+        /**
+         * Internal counter
+         * @property _timeoutCount
+         * @private
+         * @static
+         */
+        _timeoutCount: 0,
+
+        /**
+         * Trying to make the load order less important.  Without this we get
+         * an error if this file is loaded before the Event Utility.
+         * @method _addListeners
+         * @private
+         * @static
+         */
+        _addListeners: function() {
+            var DDM = YAHOO.util.DDM;
+            if ( YAHOO.util.Event && document ) {
+                DDM._onLoad();
+            } else {
+                if (DDM._timeoutCount > 2000) {
+                } else {
+                    setTimeout(DDM._addListeners, 10);
+                    if (document && document.body) {
+                        DDM._timeoutCount += 1;
+                    }
+                }
+            }
+        },
+
+        /**
+         * Recursively searches the immediate parent and all child nodes for
+         * the handle element in order to determine wheter or not it was
+         * clicked.
+         * @method handleWasClicked
+         * @param node the html element to inspect
+         * @static
+         */
+        handleWasClicked: function(node, id) {
+            if (this.isHandle(id, node.id)) {
+                return true;
+            } else {
+                // check to see if this is a text node child of the one we want
+                var p = node.parentNode;
+
+                while (p) {
+                    if (this.isHandle(id, p.id)) {
+                        return true;
+                    } else {
+                        p = p.parentNode;
+                    }
+                }
+            }
+
+            return false;
+        }
+
+    };
+
+}();
+
+// shorter alias, save a few bytes
+YAHOO.util.DDM = YAHOO.util.DragDropMgr;
+YAHOO.util.DDM._addListeners();
+
+}
+
+/**
+ * A DragDrop implementation where the linked element follows the
+ * mouse cursor during a drag.
+ * @class DD
+ * @extends YAHOO.util.DragDrop
+ * @constructor
+ * @param {String} id the id of the linked element
+ * @param {String} sGroup the group of related DragDrop items
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DD:
+ *                    scroll
+ */
+YAHOO.util.DD = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+    }
+};
+
+YAHOO.extend(YAHOO.util.DD, YAHOO.util.DragDrop, {
+
+    /**
+     * When set to true, the utility automatically tries to scroll the browser
+     * window wehn a drag and drop element is dragged near the viewport boundary.
+     * Defaults to true.
+     * @property scroll
+     * @type boolean
+     */
+    scroll: true,
+
+    /**
+     * Sets the pointer offset to the distance between the linked element's top
+     * left corner and the location the element was clicked
+     * @method autoOffset
+     * @param {int} iPageX the X coordinate of the click
+     * @param {int} iPageY the Y coordinate of the click
+     */
+    autoOffset: function(iPageX, iPageY) {
+        var x = iPageX - this.startPageX;
+        var y = iPageY - this.startPageY;
+        this.setDelta(x, y);
+    },
+
+    /**
+     * Sets the pointer offset.  You can call this directly to force the
+     * offset to be in a particular location (e.g., pass in 0,0 to set it
+     * to the center of the object, as done in YAHOO.widget.Slider)
+     * @method setDelta
+     * @param {int} iDeltaX the distance from the left
+     * @param {int} iDeltaY the distance from the top
+     */
+    setDelta: function(iDeltaX, iDeltaY) {
+        this.deltaX = iDeltaX;
+        this.deltaY = iDeltaY;
+    },
+
+    /**
+     * Sets the drag element to the location of the mousedown or click event,
+     * maintaining the cursor location relative to the location on the element
+     * that was clicked.  Override this if you want to place the element in a
+     * location other than where the cursor is.
+     * @method setDragElPos
+     * @param {int} iPageX the X coordinate of the mousedown or drag event
+     * @param {int} iPageY the Y coordinate of the mousedown or drag event
+     */
+    setDragElPos: function(iPageX, iPageY) {
+        // the first time we do this, we are going to check to make sure
+        // the element has css positioning
+
+        var el = this.getDragEl();
+        this.alignElWithMouse(el, iPageX, iPageY);
+    },
+
+    /**
+     * Sets the element to the location of the mousedown or click event,
+     * maintaining the cursor location relative to the location on the element
+     * that was clicked.  Override this if you want to place the element in a
+     * location other than where the cursor is.
+     * @method alignElWithMouse
+     * @param {HTMLElement} el the element to move
+     * @param {int} iPageX the X coordinate of the mousedown or drag event
+     * @param {int} iPageY the Y coordinate of the mousedown or drag event
+     */
+    alignElWithMouse: function(el, iPageX, iPageY) {
+        var oCoord = this.getTargetCoord(iPageX, iPageY);
+
+        if (!this.deltaSetXY) {
+            var aCoord = [oCoord.x, oCoord.y];
+            YAHOO.util.Dom.setXY(el, aCoord);
+            var newLeft = parseInt( YAHOO.util.Dom.getStyle(el, "left"), 10 );
+            var newTop  = parseInt( YAHOO.util.Dom.getStyle(el, "top" ), 10 );
+
+            this.deltaSetXY = [ newLeft - oCoord.x, newTop - oCoord.y ];
+        } else {
+            YAHOO.util.Dom.setStyle(el, "left", (oCoord.x + this.deltaSetXY[0]) + "px");
+            YAHOO.util.Dom.setStyle(el, "top",  (oCoord.y + this.deltaSetXY[1]) + "px");
+        }
+
+        this.cachePosition(oCoord.x, oCoord.y);
+        this.autoScroll(oCoord.x, oCoord.y, el.offsetHeight, el.offsetWidth);
+    },
+
+    /**
+     * Saves the most recent position so that we can reset the constraints and
+     * tick marks on-demand.  We need to know this so that we can calculate the
+     * number of pixels the element is offset from its original position.
+     * @method cachePosition
+     * @param iPageX the current x position (optional, this just makes it so we
+     * don't have to look it up again)
+     * @param iPageY the current y position (optional, this just makes it so we
+     * don't have to look it up again)
+     */
+    cachePosition: function(iPageX, iPageY) {
+        if (iPageX) {
+            this.lastPageX = iPageX;
+            this.lastPageY = iPageY;
+        } else {
+            var aCoord = YAHOO.util.Dom.getXY(this.getEl());
+            this.lastPageX = aCoord[0];
+            this.lastPageY = aCoord[1];
+        }
+    },
+
+    /**
+     * Auto-scroll the window if the dragged object has been moved beyond the
+     * visible window boundary.
+     * @method autoScroll
+     * @param {int} x the drag element's x position
+     * @param {int} y the drag element's y position
+     * @param {int} h the height of the drag element
+     * @param {int} w the width of the drag element
+     * @private
+     */
+    autoScroll: function(x, y, h, w) {
+
+        if (this.scroll) {
+            // The client height
+            var clientH = this.DDM.getClientHeight();
+
+            // The client width
+            var clientW = this.DDM.getClientWidth();
+
+            // The amt scrolled down
+            var st = this.DDM.getScrollTop();
+
+            // The amt scrolled right
+            var sl = this.DDM.getScrollLeft();
+
+            // Location of the bottom of the element
+            var bot = h + y;
+
+            // Location of the right of the element
+            var right = w + x;
+
+            // The distance from the cursor to the bottom of the visible area,
+            // adjusted so that we don't scroll if the cursor is beyond the
+            // element drag constraints
+            var toBot = (clientH + st - y - this.deltaY);
+
+            // The distance from the cursor to the right of the visible area
+            var toRight = (clientW + sl - x - this.deltaX);
+
+
+            // How close to the edge the cursor must be before we scroll
+            // var thresh = (document.all) ? 100 : 40;
+            var thresh = 40;
+
+            // How many pixels to scroll per autoscroll op.  This helps to reduce
+            // clunky scrolling. IE is more sensitive about this ... it needs this
+            // value to be higher.
+            var scrAmt = (document.all) ? 80 : 30;
+
+            // Scroll down if we are near the bottom of the visible page and the
+            // obj extends below the crease
+            if ( bot > clientH && toBot < thresh ) {
+                window.scrollTo(sl, st + scrAmt);
+            }
+
+            // Scroll up if the window is scrolled down and the top of the object
+            // goes above the top border
+            if ( y < st && st > 0 && y - st < thresh ) {
+                window.scrollTo(sl, st - scrAmt);
+            }
+
+            // Scroll right if the obj is beyond the right border and the cursor is
+            // near the border.
+            if ( right > clientW && toRight < thresh ) {
+                window.scrollTo(sl + scrAmt, st);
+            }
+
+            // Scroll left if the window has been scrolled to the right and the obj
+            // extends past the left border
+            if ( x < sl && sl > 0 && x - sl < thresh ) {
+                window.scrollTo(sl - scrAmt, st);
+            }
+        }
+    },
+
+    /**
+     * Finds the location the element should be placed if we want to move
+     * it to where the mouse location less the click offset would place us.
+     * @method getTargetCoord
+     * @param {int} iPageX the X coordinate of the click
+     * @param {int} iPageY the Y coordinate of the click
+     * @return an object that contains the coordinates (Object.x and Object.y)
+     * @private
+     */
+    getTargetCoord: function(iPageX, iPageY) {
+
+
+        var x = iPageX - this.deltaX;
+        var y = iPageY - this.deltaY;
+
+        if (this.constrainX) {
+            if (x < this.minX) { x = this.minX; }
+            if (x > this.maxX) { x = this.maxX; }
+        }
+
+        if (this.constrainY) {
+            if (y < this.minY) { y = this.minY; }
+            if (y > this.maxY) { y = this.maxY; }
+        }
+
+        x = this.getTick(x, this.xTicks);
+        y = this.getTick(y, this.yTicks);
+
+
+        return {x:x, y:y};
+    },
+
+    /*
+     * Sets up config options specific to this class. Overrides
+     * YAHOO.util.DragDrop, but all versions of this method through the
+     * inheritance chain are called
+     */
+    applyConfig: function() {
+        YAHOO.util.DD.superclass.applyConfig.call(this);
+        this.scroll = (this.config.scroll !== false);
+    },
+
+    /*
+     * Event that fires prior to the onMouseDown event.  Overrides
+     * YAHOO.util.DragDrop.
+     */
+    b4MouseDown: function(e) {
+        // this.resetConstraints();
+        this.autoOffset(YAHOO.util.Event.getPageX(e),
+                            YAHOO.util.Event.getPageY(e));
+    },
+
+    /*
+     * Event that fires prior to the onDrag event.  Overrides
+     * YAHOO.util.DragDrop.
+     */
+    b4Drag: function(e) {
+        this.setDragElPos(YAHOO.util.Event.getPageX(e),
+                            YAHOO.util.Event.getPageY(e));
+    },
+
+    toString: function() {
+        return ("DD " + this.id);
+    }
+
+    //////////////////////////////////////////////////////////////////////////
+    // Debugging ygDragDrop events that can be overridden
+    //////////////////////////////////////////////////////////////////////////
+    /*
+    startDrag: function(x, y) {
+    },
+
+    onDrag: function(e) {
+    },
+
+    onDragEnter: function(e, id) {
+    },
+
+    onDragOver: function(e, id) {
+    },
+
+    onDragOut: function(e, id) {
+    },
+
+    onDragDrop: function(e, id) {
+    },
+
+    endDrag: function(e) {
+    }
+
+    */
+
+});
+/**
+ * A DragDrop implementation that inserts an empty, bordered div into
+ * the document that follows the cursor during drag operations.  At the time of
+ * the click, the frame div is resized to the dimensions of the linked html
+ * element, and moved to the exact location of the linked element.
+ *
+ * References to the "frame" element refer to the single proxy element that
+ * was created to be dragged in place of all DDProxy elements on the
+ * page.
+ *
+ * @class DDProxy
+ * @extends YAHOO.util.DD
+ * @constructor
+ * @param {String} id the id of the linked html element
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                Valid properties for DDProxy in addition to those in DragDrop:
+ *                   resizeFrame, centerFrame, dragElId
+ */
+YAHOO.util.DDProxy = function(id, sGroup, config) {
+    if (id) {
+        this.init(id, sGroup, config);
+        this.initFrame();
+    }
+};
+
+/**
+ * The default drag frame div id
+ * @property YAHOO.util.DDProxy.dragElId
+ * @type String
+ * @static
+ */
+YAHOO.util.DDProxy.dragElId = "ygddfdiv";
+
+YAHOO.extend(YAHOO.util.DDProxy, YAHOO.util.DD, {
+
+    /**
+     * By default we resize the drag frame to be the same size as the element
+     * we want to drag (this is to get the frame effect).  We can turn it off
+     * if we want a different behavior.
+     * @property resizeFrame
+     * @type boolean
+     */
+    resizeFrame: true,
+
+    /**
+     * By default the frame is positioned exactly where the drag element is, so
+     * we use the cursor offset provided by YAHOO.util.DD.  Another option that works only if
+     * you do not have constraints on the obj is to have the drag frame centered
+     * around the cursor.  Set centerFrame to true for this effect.
+     * @property centerFrame
+     * @type boolean
+     */
+    centerFrame: false,
+
+    /**
+     * Creates the proxy element if it does not yet exist
+     * @method createFrame
+     */
+    createFrame: function() {
+        var self = this;
+        var body = document.body;
+
+        if (!body || !body.firstChild) {
+            setTimeout( function() { self.createFrame(); }, 50 );
+            return;
+        }
+
+        var div = this.getDragEl();
+
+        if (!div) {
+            div    = document.createElement("div");
+            div.id = this.dragElId;
+            var s  = div.style;
+
+            s.position   = "absolute";
+            s.visibility = "hidden";
+            s.cursor     = "move";
+            s.border     = "2px solid #aaa";
+            s.zIndex     = 999;
+
+            // appendChild can blow up IE if invoked prior to the window load event
+            // while rendering a table.  It is possible there are other scenarios
+            // that would cause this to happen as well.
+            body.insertBefore(div, body.firstChild);
+        }
+    },
+
+    /**
+     * Initialization for the drag frame element.  Must be called in the
+     * constructor of all subclasses
+     * @method initFrame
+     */
+    initFrame: function() {
+        this.createFrame();
+    },
+
+    applyConfig: function() {
+        YAHOO.util.DDProxy.superclass.applyConfig.call(this);
+
+        this.resizeFrame = (this.config.resizeFrame !== false);
+        this.centerFrame = (this.config.centerFrame);
+        this.setDragElId(this.config.dragElId || YAHOO.util.DDProxy.dragElId);
+    },
+
+    /**
+     * Resizes the drag frame to the dimensions of the clicked object, positions
+     * it over the object, and finally displays it
+     * @method showFrame
+     * @param {int} iPageX X click position
+     * @param {int} iPageY Y click position
+     * @private
+     */
+    showFrame: function(iPageX, iPageY) {
+        var el = this.getEl();
+        var dragEl = this.getDragEl();
+        var s = dragEl.style;
+
+        this._resizeProxy();
+
+        if (this.centerFrame) {
+            this.setDelta( Math.round(parseInt(s.width,  10)/2),
+                           Math.round(parseInt(s.height, 10)/2) );
+        }
+
+        this.setDragElPos(iPageX, iPageY);
+
+        YAHOO.util.Dom.setStyle(dragEl, "visibility", "visible");
+    },
+
+    /**
+     * The proxy is automatically resized to the dimensions of the linked
+     * element when a drag is initiated, unless resizeFrame is set to false
+     * @method _resizeProxy
+     * @private
+     */
+    _resizeProxy: function() {
+        if (this.resizeFrame) {
+            var DOM    = YAHOO.util.Dom;
+            var el     = this.getEl();
+            var dragEl = this.getDragEl();
+
+            var bt = parseInt( DOM.getStyle(dragEl, "borderTopWidth"    ), 10);
+            var br = parseInt( DOM.getStyle(dragEl, "borderRightWidth"  ), 10);
+            var bb = parseInt( DOM.getStyle(dragEl, "borderBottomWidth" ), 10);
+            var bl = parseInt( DOM.getStyle(dragEl, "borderLeftWidth"   ), 10);
+
+            if (isNaN(bt)) { bt = 0; }
+            if (isNaN(br)) { br = 0; }
+            if (isNaN(bb)) { bb = 0; }
+            if (isNaN(bl)) { bl = 0; }
+
+
+            var newWidth  = Math.max(0, el.offsetWidth  - br - bl);
+            var newHeight = Math.max(0, el.offsetHeight - bt - bb);
+
+
+            DOM.setStyle( dragEl, "width",  newWidth  + "px" );
+            DOM.setStyle( dragEl, "height", newHeight + "px" );
+        }
+    },
+
+    // overrides YAHOO.util.DragDrop
+    b4MouseDown: function(e) {
+        var x = YAHOO.util.Event.getPageX(e);
+        var y = YAHOO.util.Event.getPageY(e);
+        this.autoOffset(x, y);
+        this.setDragElPos(x, y);
+    },
+
+    // overrides YAHOO.util.DragDrop
+    b4StartDrag: function(x, y) {
+        // show the drag frame
+        this.showFrame(x, y);
+    },
+
+    // overrides YAHOO.util.DragDrop
+    b4EndDrag: function(e) {
+        YAHOO.util.Dom.setStyle(this.getDragEl(), "visibility", "hidden");
+    },
+
+    // overrides YAHOO.util.DragDrop
+    // By default we try to move the element to the last location of the frame.
+    // This is so that the default behavior mirrors that of YAHOO.util.DD.
+    endDrag: function(e) {
+        var DOM = YAHOO.util.Dom;
+        var lel = this.getEl();
+        var del = this.getDragEl();
+
+        // Show the drag frame briefly so we can get its position
+        // del.style.visibility = "";
+        DOM.setStyle(del, "visibility", "");
+
+        // Hide the linked element before the move to get around a Safari
+        // rendering bug.
+        //lel.style.visibility = "hidden";
+        DOM.setStyle(lel, "visibility", "hidden");
+        YAHOO.util.DDM.moveToEl(lel, del);
+        //del.style.visibility = "hidden";
+        DOM.setStyle(del, "visibility", "hidden");
+        //lel.style.visibility = "";
+        DOM.setStyle(lel, "visibility", "");
+    },
+
+    toString: function() {
+        return ("DDProxy " + this.id);
+    }
+
+});
+/**
+ * A DragDrop implementation that does not move, but can be a drop
+ * target.  You would get the same result by simply omitting implementation
+ * for the event callbacks, but this way we reduce the processing cost of the
+ * event listener and the callbacks.
+ * @class DDTarget
+ * @extends YAHOO.util.DragDrop
+ * @constructor
+ * @param {String} id the id of the element that is a drop target
+ * @param {String} sGroup the group of related DragDrop objects
+ * @param {object} config an object containing configurable attributes
+ *                 Valid properties for DDTarget in addition to those in
+ *                 DragDrop:
+ *                    none
+ */
+YAHOO.util.DDTarget = function(id, sGroup, config) {
+    if (id) {
+        this.initTarget(id, sGroup, config);
+    }
+};
+
+// YAHOO.util.DDTarget.prototype = new YAHOO.util.DragDrop();
+YAHOO.extend(YAHOO.util.DDTarget, YAHOO.util.DragDrop, {
+    toString: function() {
+        return ("DDTarget " + this.id);
+    }
+});
diff --git a/frontend/beta/js/YUI/event.js b/frontend/beta/js/YUI/event.js
new file mode 100644
index 0000000..7bfac3b
--- a/dev/null
+++ b/frontend/beta/js/YUI/event.js
@@ -0,0 +1,1738 @@
+/*                                                                                                                                                      
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 0.12.0
+*/ 
+
+/**
+ * The CustomEvent class lets you define events for your application
+ * that can be subscribed to by one or more independent component.
+ *
+ * @param {String}  type The type of event, which is passed to the callback
+ *                  when the event fires
+ * @param {Object}  oScope The context the event will fire from.  "this" will
+ *                  refer to this object in the callback.  Default value: 
+ *                  the window object.  The listener can override this.
+ * @param {boolean} silent pass true to prevent the event from writing to
+ *                  the log system
+ * @namespace YAHOO.util
+ * @class CustomEvent
+ * @constructor
+ */
+YAHOO.util.CustomEvent = function(type, oScope, silent, signature) {
+
+    /**
+     * The type of event, returned to subscribers when the event fires
+     * @property type
+     * @type string
+     */
+    this.type = type;
+
+    /**
+     * The scope the the event will fire from by default.  Defaults to the window 
+     * obj
+     * @property scope
+     * @type object
+     */
+    this.scope = oScope || window;
+
+    /**
+     * By default all custom events are logged in the debug build, set silent
+     * to true to disable logging for this event.
+     * @property silent
+     * @type boolean
+     */
+    this.silent = silent;
+
+    /**
+     * Custom events support two styles of arguments provided to the event
+     * subscribers.  
+     * <ul>
+     * <li>YAHOO.util.CustomEvent.LIST: 
+     *   <ul>
+     *   <li>param1: event name</li>
+     *   <li>param2: array of arguments sent to fire</li>
+     *   <li>param3: <optional> a custom object supplied by the subscriber</li>
+     *   </ul>
+     * </li>
+     * <li>YAHOO.util.CustomEvent.FLAT
+     *   <ul>
+     *   <li>param1: the first argument passed to fire.  If you need to
+     *           pass multiple parameters, use and array or object literal</li>
+     *   <li>param2: <optional> a custom object supplied by the subscriber</li>
+     *   </ul>
+     * </li>
+     * </ul>
+     *   @property signature
+     *   @type int
+     */
+    this.signature = signature || YAHOO.util.CustomEvent.LIST;
+
+    /**
+     * The subscribers to this event
+     * @property subscribers
+     * @type Subscriber[]
+     */
+    this.subscribers = [];
+
+    if (!this.silent) {
+    }
+
+    var onsubscribeType = "_YUICEOnSubscribe";
+
+    // Only add subscribe events for events that are not generated by 
+    // CustomEvent
+    if (type !== onsubscribeType) {
+
+        /**
+         * Custom events provide a custom event that fires whenever there is
+         * a new subscriber to the event.  This provides an opportunity to
+         * handle the case where there is a non-repeating event that has
+         * already fired has a new subscriber.  
+         *
+         * @event subscribeEvent
+         * @type YAHOO.util.CustomEvent
+         * @param {Function} fn The function to execute
+         * @param {Object}   obj An object to be passed along when the event 
+         *                       fires
+         * @param {boolean|Object}  override If true, the obj passed in becomes 
+         *                                   the execution scope of the listener.
+         *                                   if an object, that object becomes the
+         *                                   the execution scope.
+         */
+        this.subscribeEvent = 
+                new YAHOO.util.CustomEvent(onsubscribeType, this, true);
+
+    } 
+};
+
+/**
+ * Subscriber listener sigature constant.  The LIST type returns three
+ * parameters: the event type, the array of args passed to fire, and
+ * the optional custom object
+ * @property YAHOO.util.CustomEvent.LIST
+ * @static
+ * @type int
+ */
+YAHOO.util.CustomEvent.LIST = 0;
+
+/**
+ * Subscriber listener sigature constant.  The FLAT type returns two
+ * parameters: the first argument passed to fire and the optional 
+ * custom object
+ * @property YAHOO.util.CustomEvent.FLAT
+ * @static
+ * @type int
+ */
+YAHOO.util.CustomEvent.FLAT = 1;
+
+YAHOO.util.CustomEvent.prototype = {
+
+    /**
+     * Subscribes the caller to this event
+     * @method subscribe
+     * @param {Function} fn        The function to execute
+     * @param {Object}   obj       An object to be passed along when the event 
+     *                             fires
+     * @param {boolean|Object}  override If true, the obj passed in becomes 
+     *                                   the execution scope of the listener.
+     *                                   if an object, that object becomes the
+     *                                   the execution scope.
+     */
+    subscribe: function(fn, obj, override) {
+        if (this.subscribeEvent) {
+            this.subscribeEvent.fire(fn, obj, override);
+        }
+
+        this.subscribers.push( new YAHOO.util.Subscriber(fn, obj, override) );
+    },
+
+    /**
+     * Unsubscribes the caller from this event
+     * @method unsubscribe
+     * @param {Function} fn  The function to execute
+     * @param {Object}   obj  The custom object passed to subscribe (optional)
+     * @return {boolean} True if the subscriber was found and detached.
+     */
+    unsubscribe: function(fn, obj) {
+        var found = false;
+        for (var i=0, len=this.subscribers.length; i<len; ++i) {
+            var s = this.subscribers[i];
+            if (s && s.contains(fn, obj)) {
+                this._delete(i);
+                found = true;
+            }
+        }
+
+        return found;
+    },
+
+    /**
+     * Notifies the subscribers.  The callback functions will be executed
+     * from the scope specified when the event was created, and with the 
+     * following parameters:
+     *   <ul>
+     *   <li>The type of event</li>
+     *   <li>All of the arguments fire() was executed with as an array</li>
+     *   <li>The custom object (if any) that was passed into the subscribe() 
+     *       method</li>
+     *   </ul>
+     * @method fire 
+     * @param {Object*} arguments an arbitrary set of parameters to pass to 
+     *                            the handler.
+     */
+    fire: function() {
+        var len=this.subscribers.length;
+        if (!len && this.silent) {
+            return true;
+        }
+
+        var args=[], ret=true, i;
+
+        for (i=0; i<arguments.length; ++i) {
+            args.push(arguments[i]);
+        }
+
+        var argslength = args.length;
+
+        if (!this.silent) {
+        }
+
+        for (i=0; i<len; ++i) {
+            var s = this.subscribers[i];
+            if (s) {
+                if (!this.silent) {
+                }
+
+                var scope = s.getScope(this.scope);
+
+                if (this.signature == YAHOO.util.CustomEvent.FLAT) {
+                    var param = null;
+                    if (args.length > 0) {
+                        param = args[0];
+                    }
+                    ret = s.fn.call(scope, param, s.obj);
+                } else {
+                    ret = s.fn.call(scope, this.type, args, s.obj);
+                }
+                if (false === ret) {
+                    if (!this.silent) {
+                    }
+
+                    //break;
+                    return false;
+                }
+            }
+        }
+
+        return true;
+    },
+
+    /**
+     * Removes all listeners
+     * @method unsubscribeAll
+     */
+    unsubscribeAll: function() {
+        for (var i=0, len=this.subscribers.length; i<len; ++i) {
+            this._delete(len - 1 - i);
+        }
+    },
+
+    /**
+     * @method _delete
+     * @private
+     */
+    _delete: function(index) {
+        var s = this.subscribers[index];
+        if (s) {
+            delete s.fn;
+            delete s.obj;
+        }
+
+        // delete this.subscribers[index];
+        this.subscribers.splice(index, 1);
+    },
+
+    /**
+     * @method toString
+     */
+    toString: function() {
+         return "CustomEvent: " + "'" + this.type  + "', " + 
+             "scope: " + this.scope;
+
+    }
+};
+
+/////////////////////////////////////////////////////////////////////
+
+/**
+ * Stores the subscriber information to be used when the event fires.
+ * @param {Function} fn       The function to execute
+ * @param {Object}   obj      An object to be passed along when the event fires
+ * @param {boolean}  override If true, the obj passed in becomes the execution
+ *                            scope of the listener
+ * @class Subscriber
+ * @constructor
+ */
+YAHOO.util.Subscriber = function(fn, obj, override) {
+
+    /**
+     * The callback that will be execute when the event fires
+     * @property fn
+     * @type function
+     */
+    this.fn = fn;
+
+    /**
+     * An optional custom object that will passed to the callback when
+     * the event fires
+     * @property obj
+     * @type object
+     */
+    this.obj = obj || null;
+
+    /**
+     * The default execution scope for the event listener is defined when the
+     * event is created (usually the object which contains the event).
+     * By setting override to true, the execution scope becomes the custom
+     * object passed in by the subscriber.  If override is an object, that 
+     * object becomes the scope.
+     * @property override
+     * @type boolean|object
+     */
+    this.override = override;
+
+};
+
+/**
+ * Returns the execution scope for this listener.  If override was set to true
+ * the custom obj will be the scope.  If override is an object, that is the
+ * scope, otherwise the default scope will be used.
+ * @method getScope
+ * @param {Object} defaultScope the scope to use if this listener does not
+ *                              override it.
+ */
+YAHOO.util.Subscriber.prototype.getScope = function(defaultScope) {
+    if (this.override) {
+        if (this.override === true) {
+            return this.obj;
+        } else {
+            return this.override;
+        }
+    }
+    return defaultScope;
+};
+
+/**
+ * Returns true if the fn and obj match this objects properties.
+ * Used by the unsubscribe method to match the right subscriber.
+ *
+ * @method contains
+ * @param {Function} fn the function to execute
+ * @param {Object} obj an object to be passed along when the event fires
+ * @return {boolean} true if the supplied arguments match this 
+ *                   subscriber's signature.
+ */
+YAHOO.util.Subscriber.prototype.contains = function(fn, obj) {
+    if (obj) {
+        return (this.fn == fn && this.obj == obj);
+    } else {
+        return (this.fn == fn);
+    }
+};
+
+/**
+ * @method toString
+ */
+YAHOO.util.Subscriber.prototype.toString = function() {
+    return "Subscriber { obj: " + (this.obj || "")  + 
+           ", override: " +  (this.override || "no") + " }";
+};
+
+/**
+ * The Event Utility provides utilities for managing DOM Events and tools
+ * for building event systems
+ *
+ * @module event
+ * @title Event Utility
+ * @namespace YAHOO.util
+ * @requires yahoo
+ */
+
+// The first instance of Event will win if it is loaded more than once.
+if (!YAHOO.util.Event) {
+
+/**
+ * The event utility provides functions to add and remove event listeners,
+ * event cleansing.  It also tries to automatically remove listeners it
+ * registers during the unload event.
+ *
+ * @class Event
+ * @static
+ */
+    YAHOO.util.Event = function() {
+
+        /**
+         * True after the onload event has fired
+         * @property loadComplete
+         * @type boolean
+         * @static
+         * @private
+         */
+        var loadComplete =  false;
+
+        /**
+         * Cache of wrapped listeners
+         * @property listeners
+         * @type array
+         * @static
+         * @private
+         */
+        var listeners = [];
+
+        /**
+         * User-defined unload function that will be fired before all events
+         * are detached
+         * @property unloadListeners
+         * @type array
+         * @static
+         * @private
+         */
+        var unloadListeners = [];
+
+        /**
+         * Cache of DOM0 event handlers to work around issues with DOM2 events
+         * in Safari
+         * @property legacyEvents
+         * @static
+         * @private
+         */
+        var legacyEvents = [];
+
+        /**
+         * Listener stack for DOM0 events
+         * @property legacyHandlers
+         * @static
+         * @private
+         */
+        var legacyHandlers = [];
+
+        /**
+         * The number of times to poll after window.onload.  This number is
+         * increased if additional late-bound handlers are requested after
+         * the page load.
+         * @property retryCount
+         * @static
+         * @private
+         */
+        var retryCount = 0;
+
+        /**
+         * onAvailable listeners
+         * @property onAvailStack
+         * @static
+         * @private
+         */
+        var onAvailStack = [];
+
+        /**
+         * Lookup table for legacy events
+         * @property legacyMap
+         * @static
+         * @private
+         */
+        var legacyMap = [];
+
+        /**
+         * Counter for auto id generation
+         * @property counter
+         * @static
+         * @private
+         */
+        var counter = 0;
+
+        return { // PREPROCESS
+
+            /**
+             * The number of times we should look for elements that are not
+             * in the DOM at the time the event is requested after the document
+             * has been loaded.  The default is 200@amp;50 ms, so it will poll
+             * for 10 seconds or until all outstanding handlers are bound
+             * (whichever comes first).
+             * @property POLL_RETRYS
+             * @type int
+             * @static
+             * @final
+             */
+            POLL_RETRYS: 200,
+
+            /**
+             * The poll interval in milliseconds
+             * @property POLL_INTERVAL
+             * @type int
+             * @static
+             * @final
+             */
+            POLL_INTERVAL: 20,
+
+            /**
+             * Element to bind, int constant
+             * @property EL
+             * @type int
+             * @static
+             * @final
+             */
+            EL: 0,
+
+            /**
+             * Type of event, int constant
+             * @property TYPE
+             * @type int
+             * @static
+             * @final
+             */
+            TYPE: 1,
+
+            /**
+             * Function to execute, int constant
+             * @property FN
+             * @type int
+             * @static
+             * @final
+             */
+            FN: 2,
+
+            /**
+             * Function wrapped for scope correction and cleanup, int constant
+             * @property WFN
+             * @type int
+             * @static
+             * @final
+             */
+            WFN: 3,
+
+            /**
+             * Object passed in by the user that will be returned as a 
+             * parameter to the callback, int constant
+             * @property OBJ
+             * @type int
+             * @static
+             * @final
+             */
+            OBJ: 3,
+
+            /**
+             * Adjusted scope, either the element we are registering the event
+             * on or the custom object passed in by the listener, int constant
+             * @property ADJ_SCOPE
+             * @type int
+             * @static
+             * @final
+             */
+            ADJ_SCOPE: 4,
+
+            /**
+             * Safari detection is necessary to work around the preventDefault
+             * bug that makes it so you can't cancel a href click from the 
+             * handler.  There is not a capabilities check we can use here.
+             * @property isSafari
+             * @private
+             * @static
+             */
+            isSafari: (/Safari|Konqueror|KHTML/gi).test(navigator.userAgent),
+
+            /**
+             * IE detection needed to properly calculate pageX and pageY.  
+             * capabilities checking didn't seem to work because another 
+             * browser that does not provide the properties have the values 
+             * calculated in a different manner than IE.
+             * @property isIE
+             * @private
+             * @static
+             */
+            isIE: (!this.isSafari && !navigator.userAgent.match(/opera/gi) && 
+                    navigator.userAgent.match(/msie/gi)),
+
+            /**
+             * poll handle
+             * @property _interval
+             * @private
+             */
+            _interval: null,
+
+            /**
+             * @method startInterval
+             * @static
+             * @private
+             */
+            startInterval: function() {
+                if (!this._interval) {
+                    var self = this;
+                    var callback = function() { self._tryPreloadAttach(); };
+                    this._interval = setInterval(callback, this.POLL_INTERVAL);
+                    // this.timeout = setTimeout(callback, i);
+                }
+            },
+
+            /**
+             * Executes the supplied callback when the item with the supplied
+             * id is found.  This is meant to be used to execute behavior as
+             * soon as possible as the page loads.  If you use this after the
+             * initial page load it will poll for a fixed time for the element.
+             * The number of times it will poll and the frequency are
+             * configurable.  By default it will poll for 10 seconds.
+             *
+             * @method onAvailable
+             *
+             * @param {string}   p_id the id of the element to look for.
+             * @param {function} p_fn what to execute when the element is found.
+             * @param {object}   p_obj an optional object to be passed back as
+             *                   a parameter to p_fn.
+             * @param {boolean}  p_override If set to true, p_fn will execute
+             *                   in the scope of p_obj
+             *
+             * @static
+             */
+            onAvailable: function(p_id, p_fn, p_obj, p_override) {
+                onAvailStack.push( { id:         p_id, 
+                                     fn:         p_fn, 
+                                     obj:        p_obj, 
+                                     override:   p_override, 
+                                     checkReady: false    } );
+
+                retryCount = this.POLL_RETRYS;
+                this.startInterval();
+            },
+
+            /**
+             * Works the same way as onAvailable, but additionally checks the
+             * state of sibling elements to determine if the content of the
+             * available element is safe to modify.
+             *
+             * @method onContentReady
+             *
+             * @param {string}   p_id the id of the element to look for.
+             * @param {function} p_fn what to execute when the element is ready.
+             * @param {object}   p_obj an optional object to be passed back as
+             *                   a parameter to p_fn.
+             * @param {boolean}  p_override If set to true, p_fn will execute
+             *                   in the scope of p_obj
+             *
+             * @static
+             */
+            onContentReady: function(p_id, p_fn, p_obj, p_override) {
+                onAvailStack.push( { id:         p_id, 
+                                     fn:         p_fn, 
+                                     obj:        p_obj, 
+                                     override:   p_override,
+                                     checkReady: true      } );
+
+                retryCount = this.POLL_RETRYS;
+                this.startInterval();
+            },
+
+            /**
+             * Appends an event handler
+             *
+             * @method addListener
+             *
+             * @param {Object}   el        The html element to assign the 
+             *                             event to
+             * @param {String}   sType     The type of event to append
+             * @param {Function} fn        The method the event invokes
+             * @param {Object}   obj    An arbitrary object that will be 
+             *                             passed as a parameter to the handler
+             * @param {boolean}  override  If true, the obj passed in becomes
+             *                             the execution scope of the listener
+             * @return {boolean} True if the action was successful or defered,
+             *                        false if one or more of the elements 
+             *                        could not have the event bound to it.
+             * @static
+             */
+            addListener: function(el, sType, fn, obj, override) {
+
+                if (!fn || !fn.call) {
+                    return false;
+                }
+
+                // The el argument can be an array of elements or element ids.
+                if ( this._isValidCollection(el)) {
+                    var ok = true;
+                    for (var i=0,len=el.length; i<len; ++i) {
+                        ok = this.on(el[i], 
+                                       sType, 
+                                       fn, 
+                                       obj, 
+                                       override) && ok;
+                    }
+                    return ok;
+
+                } else if (typeof el == "string") {
+                    var oEl = this.getEl(el);
+                    // If the el argument is a string, we assume it is 
+                    // actually the id of the element.  If the page is loaded
+                    // we convert el to the actual element, otherwise we 
+                    // defer attaching the event until onload event fires
+
+                    // check to see if we need to delay hooking up the event 
+                    // until after the page loads.
+                    if (oEl) {
+                        el = oEl;
+                    } else {
+                        // defer adding the event until the element is available
+                        this.onAvailable(el, function() {
+                           YAHOO.util.Event.on(el, sType, fn, obj, override);
+                        });
+
+                        return true;
+                    }
+                }
+
+                // Element should be an html element or an array if we get 
+                // here.
+                if (!el) {
+                    return false;
+                }
+
+                // we need to make sure we fire registered unload events 
+                // prior to automatically unhooking them.  So we hang on to 
+                // these instead of attaching them to the window and fire the
+                // handles explicitly during our one unload event.
+                if ("unload" == sType && obj !== this) {
+                    unloadListeners[unloadListeners.length] =
+                            [el, sType, fn, obj, override];
+                    return true;
+                }
+
+                // if the user chooses to override the scope, we use the custom
+                // object passed in, otherwise the executing scope will be the
+                // HTML element that the event is registered on
+                var scope = el;
+                if (override) {
+                    if (override === true) {
+                        scope = obj;
+                    } else {
+                        scope = override;
+                    }
+                }
+
+                // wrap the function so we can return the obj object when
+                // the event fires;
+                var wrappedFn = function(e) {
+                        return fn.call(scope, YAHOO.util.Event.getEvent(e), 
+                                obj);
+                    };
+
+                var li = [el, sType, fn, wrappedFn, scope];
+                var index = listeners.length;
+                // cache the listener so we can try to automatically unload
+                listeners[index] = li;
+
+                if (this.useLegacyEvent(el, sType)) {
+                    var legacyIndex = this.getLegacyIndex(el, sType);
+
+                    // Add a new dom0 wrapper if one is not detected for this
+                    // element
+                    if ( legacyIndex == -1 || 
+                                el != legacyEvents[legacyIndex][0] ) {
+
+                        legacyIndex = legacyEvents.length;
+                        legacyMap[el.id + sType] = legacyIndex;
+
+                        // cache the signature for the DOM0 event, and 
+                        // include the existing handler for the event, if any
+                        legacyEvents[legacyIndex] = 
+                            [el, sType, el["on" + sType]];
+                        legacyHandlers[legacyIndex] = [];
+
+                        el["on" + sType] = 
+                            function(e) {
+                                YAHOO.util.Event.fireLegacyEvent(
+                                    YAHOO.util.Event.getEvent(e), legacyIndex);
+                            };
+                    }
+
+                    // add a reference to the wrapped listener to our custom
+                    // stack of events
+                    //legacyHandlers[legacyIndex].push(index);
+                    legacyHandlers[legacyIndex].push(li);
+
+                } else {
+                    this._simpleAdd(el, sType, wrappedFn, false);
+                }
+
+                return true;
+                
+            },
+
+            /**
+             * When using legacy events, the handler is routed to this object
+             * so we can fire our custom listener stack.
+             * @method fireLegacyEvent
+             * @static
+             * @private
+             */
+            fireLegacyEvent: function(e, legacyIndex) {
+                var ok = true;
+
+                var le = legacyHandlers[legacyIndex];
+                for (var i=0,len=le.length; i<len; ++i) {
+                    var li = le[i];
+                    if ( li && li[this.WFN] ) {
+                        var scope = li[this.ADJ_SCOPE];
+                        var ret = li[this.WFN].call(scope, e);
+                        ok = (ok && ret);
+                    }
+                }
+
+                return ok;
+            },
+
+            /**
+             * Returns the legacy event index that matches the supplied 
+             * signature
+             * @method getLegacyIndex
+             * @static
+             * @private
+             */
+            getLegacyIndex: function(el, sType) {
+                var key = this.generateId(el) + sType;
+                if (typeof legacyMap[key] == "undefined") { 
+                    return -1;
+                } else {
+                    return legacyMap[key];
+                }
+            },
+
+            /**
+             * Logic that determines when we should automatically use legacy
+             * events instead of DOM2 events.
+             * @method useLegacyEvent
+             * @static
+             * @private
+             */
+            useLegacyEvent: function(el, sType) {
+                if (!el.addEventListener && !el.attachEvent) {
+                    return true;
+                } else if (this.isSafari) {
+                    if ("click" == sType || "dblclick" == sType) {
+                        return true;
+                    }
+                }
+                return false;
+            },
+                    
+            /**
+             * Removes an event handler
+             *
+             * @method removeListener
+             *
+             * @param {Object} el the html element or the id of the element to 
+             * assign the event to.
+             * @param {String} sType the type of event to remove.
+             * @param {Function} fn the method the event invokes.  If fn is
+             * undefined, then all event handlers for the type of event are 
+             * removed.
+             * @return {boolean} true if the unbind was successful, false 
+             * otherwise.
+             * @static
+             */
+            removeListener: function(el, sType, fn) {
+                var i, len;
+
+                // The el argument can be a string
+                if (typeof el == "string") {
+                    el = this.getEl(el);
+                // The el argument can be an array of elements or element ids.
+                } else if ( this._isValidCollection(el)) {
+                    var ok = true;
+                    for (i=0,len=el.length; i<len; ++i) {
+                        ok = ( this.removeListener(el[i], sType, fn) && ok );
+                    }
+                    return ok;
+                }
+
+                if (!fn || !fn.call) {
+                    //return false;
+                    return this.purgeElement(el, false, sType);
+                }
+
+                if ("unload" == sType) {
+
+                    for (i=0, len=unloadListeners.length; i<len; i++) {
+                        var li = unloadListeners[i];
+                        if (li && 
+                            li[0] == el && 
+                            li[1] == sType && 
+                            li[2] == fn) {
+                                unloadListeners.splice(i, 1);
+                                return true;
+                        }
+                    }
+
+                    return false;
+                }
+
+                var cacheItem = null;
+
+                // The index is a hidden parameter; needed to remove it from
+                // the method signature because it was tempting users to
+                // try and take advantage of it, which is not possible.
+                var index = arguments[3];
+  
+                if ("undefined" == typeof index) {
+                    index = this._getCacheIndex(el, sType, fn);
+                }
+
+                if (index >= 0) {
+                    cacheItem = listeners[index];
+                }
+
+                if (!el || !cacheItem) {
+                    return false;
+                }
+
+                if (this.useLegacyEvent(el, sType)) {
+                    var legacyIndex = this.getLegacyIndex(el, sType);
+                    var llist = legacyHandlers[legacyIndex];
+                    if (llist) {
+                        for (i=0, len=llist.length; i<len; ++i) {
+                            li = llist[i];
+                            if (li && 
+                                li[this.EL] == el && 
+                                li[this.TYPE] == sType && 
+                                li[this.FN] == fn) {
+                                    llist.splice(i, 1);
+                                    break;
+                            }
+                        }
+                    }
+
+                } else {
+                    this._simpleRemove(el, sType, cacheItem[this.WFN], false);
+                }
+
+                // removed the wrapped handler
+                delete listeners[index][this.WFN];
+                delete listeners[index][this.FN];
+                listeners.splice(index, 1);
+
+                return true;
+
+            },
+
+            /**
+             * Returns the event's target element
+             * @method getTarget
+             * @param {Event} ev the event
+             * @param {boolean} resolveTextNode when set to true the target's
+             *                  parent will be returned if the target is a 
+             *                  text node.  @deprecated, the text node is
+             *                  now resolved automatically
+             * @return {HTMLElement} the event's target
+             * @static
+             */
+            getTarget: function(ev, resolveTextNode) {
+                var t = ev.target || ev.srcElement;
+                return this.resolveTextNode(t);
+            },
+
+            /**
+             * In some cases, some browsers will return a text node inside
+             * the actual element that was targeted.  This normalizes the
+             * return value for getTarget and getRelatedTarget.
+             * @method resolveTextNode
+             * @param {HTMLElement} node node to resolve
+             * @return {HTMLElement} the normized node
+             * @static
+             */
+            resolveTextNode: function(node) {
+                // if (node && node.nodeName && 
+                        // "#TEXT" == node.nodeName.toUpperCase()) {
+                if (node && 3 == node.nodeType) {
+                    return node.parentNode;
+                } else {
+                    return node;
+                }
+            },
+
+            /**
+             * Returns the event's pageX
+             * @method getPageX
+             * @param {Event} ev the event
+             * @return {int} the event's pageX
+             * @static
+             */
+            getPageX: function(ev) {
+                var x = ev.pageX;
+                if (!x && 0 !== x) {
+                    x = ev.clientX || 0;
+
+                    if ( this.isIE ) {
+                        x += this._getScrollLeft();
+                    }
+                }
+
+                return x;
+            },
+
+            /**
+             * Returns the event's pageY
+             * @method getPageY
+             * @param {Event} ev the event
+             * @return {int} the event's pageY
+             * @static
+             */
+            getPageY: function(ev) {
+                var y = ev.pageY;
+                if (!y && 0 !== y) {
+                    y = ev.clientY || 0;
+
+                    if ( this.isIE ) {
+                        y += this._getScrollTop();
+                    }
+                }
+
+                return y;
+            },
+
+            /**
+             * Returns the pageX and pageY properties as an indexed array.
+             * @method getXY
+             * @type int[]
+             * @static
+             */
+            getXY: function(ev) {
+                return [this.getPageX(ev), this.getPageY(ev)];
+            },
+
+            /**
+             * Returns the event's related target 
+             * @method getRelatedTarget
+             * @param {Event} ev the event
+             * @return {HTMLElement} the event's relatedTarget
+             * @static
+             */
+            getRelatedTarget: function(ev) {
+                var t = ev.relatedTarget;
+                if (!t) {
+                    if (ev.type == "mouseout") {
+                        t = ev.toElement;
+                    } else if (ev.type == "mouseover") {
+                        t = ev.fromElement;
+                    }
+                }
+
+                return this.resolveTextNode(t);
+            },
+
+            /**
+             * Returns the time of the event.  If the time is not included, the
+             * event is modified using the current time.
+             * @method getTime
+             * @param {Event} ev the event
+             * @return {Date} the time of the event
+             * @static
+             */
+            getTime: function(ev) {
+                if (!ev.time) {
+                    var t = new Date().getTime();
+                    try {
+                        ev.time = t;
+                    } catch(e) { 
+                        return t;
+                    }
+                }
+
+                return ev.time;
+            },
+
+            /**
+             * Convenience method for stopPropagation + preventDefault
+             * @method stopEvent
+             * @param {Event} ev the event
+             * @static
+             */
+            stopEvent: function(ev) {
+                this.stopPropagation(ev);
+                this.preventDefault(ev);
+            },
+
+            /**
+             * Stops event propagation
+             * @method stopPropagation
+             * @param {Event} ev the event
+             * @static
+             */
+            stopPropagation: function(ev) {
+                if (ev.stopPropagation) {
+                    ev.stopPropagation();
+                } else {
+                    ev.cancelBubble = true;
+                }
+            },
+
+            /**
+             * Prevents the default behavior of the event
+             * @method preventDefault
+             * @param {Event} ev the event
+             * @static
+             */
+            preventDefault: function(ev) {
+                if (ev.preventDefault) {
+                    ev.preventDefault();
+                } else {
+                    ev.returnValue = false;
+                }
+            },
+             
+            /**
+             * Finds the event in the window object, the caller's arguments, or
+             * in the arguments of another method in the callstack.  This is
+             * executed automatically for events registered through the event
+             * manager, so the implementer should not normally need to execute
+             * this function at all.
+             * @method getEvent
+             * @param {Event} e the event parameter from the handler
+             * @return {Event} the event 
+             * @static
+             */
+            getEvent: function(e) {
+                var ev = e || window.event;
+
+                if (!ev) {
+                    var c = this.getEvent.caller;
+                    while (c) {
+                        ev = c.arguments[0];
+                        if (ev && Event == ev.constructor) {
+                            break;
+                        }
+                        c = c.caller;
+                    }
+                }
+
+                return ev;
+            },
+
+            /**
+             * Returns the charcode for an event
+             * @method getCharCode
+             * @param {Event} ev the event
+             * @return {int} the event's charCode
+             * @static
+             */
+            getCharCode: function(ev) {
+                return ev.charCode || ev.keyCode || 0;
+            },
+
+            /**
+             * Locating the saved event handler data by function ref
+             *
+             * @method _getCacheIndex
+             * @static
+             * @private
+             */
+            _getCacheIndex: function(el, sType, fn) {
+                for (var i=0,len=listeners.length; i<len; ++i) {
+                    var li = listeners[i];
+                    if ( li                 && 
+                         li[this.FN] == fn  && 
+                         li[this.EL] == el  && 
+                         li[this.TYPE] == sType ) {
+                        return i;
+                    }
+                }
+
+                return -1;
+            },
+
+            /**
+             * Generates an unique ID for the element if it does not already 
+             * have one.
+             * @method generateId
+             * @param el the element to create the id for
+             * @return {string} the resulting id of the element
+             * @static
+             */
+            generateId: function(el) {
+                var id = el.id;
+
+                if (!id) {
+                    id = "yuievtautoid-" + counter;
+                    ++counter;
+                    el.id = id;
+                }
+
+                return id;
+            },
+
+            /**
+             * We want to be able to use getElementsByTagName as a collection
+             * to attach a group of events to.  Unfortunately, different 
+             * browsers return different types of collections.  This function
+             * tests to determine if the object is array-like.  It will also 
+             * fail if the object is an array, but is empty.
+             * @method _isValidCollection
+             * @param o the object to test
+             * @return {boolean} true if the object is array-like and populated
+             * @static
+             * @private
+             */
+            _isValidCollection: function(o) {
+                // this.logger.debug(o.constructor.toString())
+                // this.logger.debug(typeof o)
+
+                return ( o                    && // o is something
+                         o.length             && // o is indexed
+                         typeof o != "string" && // o is not a string
+                         !o.tagName           && // o is not an HTML element
+                         !o.alert             && // o is not a window
+                         typeof o[0] != "undefined" );
+
+            },
+
+            /**
+             * @private
+             * @property elCache
+             * DOM element cache
+             * @static
+             */
+            elCache: {},
+
+            /**
+             * We cache elements bound by id because when the unload event 
+             * fires, we can no longer use document.getElementById
+             * @method getEl
+             * @static
+             * @private
+             */
+            getEl: function(id) {
+                return document.getElementById(id);
+            },
+
+            /**
+             * Clears the element cache
+             * @deprecated Elements are not cached any longer
+             * @method clearCache
+             * @static
+             * @private
+             */
+            clearCache: function() { },
+
+            /**
+             * hook up any deferred listeners
+             * @method _load
+             * @static
+             * @private
+             */
+            _load: function(e) {
+                loadComplete = true;
+                var EU = YAHOO.util.Event;
+                // Remove the listener to assist with the IE memory issue, but not
+                // for other browsers because FF 1.0x does not like it.
+                if (this.isIE) {
+                    EU._simpleRemove(window, "load", EU._load);
+                }
+            },
+
+            /**
+             * Polling function that runs before the onload event fires, 
+             * attempting to attach to DOM Nodes as soon as they are 
+             * available
+             * @method _tryPreloadAttach
+             * @static
+             * @private
+             */
+            _tryPreloadAttach: function() {
+
+                if (this.locked) {
+                    return false;
+                }
+
+                this.locked = true;
+
+                // keep trying until after the page is loaded.  We need to 
+                // check the page load state prior to trying to bind the 
+                // elements so that we can be certain all elements have been 
+                // tested appropriately
+                var tryAgain = !loadComplete;
+                if (!tryAgain) {
+                    tryAgain = (retryCount > 0);
+                }
+
+                // onAvailable
+                var notAvail = [];
+                for (var i=0,len=onAvailStack.length; i<len ; ++i) {
+                    var item = onAvailStack[i];
+                    if (item) {
+                        var el = this.getEl(item.id);
+
+                        if (el) {
+                            // The element is available, but not necessarily ready
+
+                            if ( !item.checkReady || 
+                                    loadComplete || 
+                                    el.nextSibling ||
+                                    (document && document.body) ) {
+
+                                var scope = el;
+                                if (item.override) {
+                                    if (item.override === true) {
+                                        scope = item.obj;
+                                    } else {
+                                        scope = item.override;
+                                    }
+                                }
+                                item.fn.call(scope, item.obj);
+                                delete onAvailStack[i];
+                            }
+                        } else {
+                            notAvail.push(item);
+                        }
+                    }
+                }
+
+                retryCount = (notAvail.length === 0) ? 0 : retryCount - 1;
+
+                if (tryAgain) {
+                    this.startInterval();
+                } else {
+                    clearInterval(this._interval);
+                    this._interval = null;
+                }
+
+                this.locked = false;
+
+                return true;
+
+            },
+
+            /**
+             * Removes all listeners attached to the given element via addListener.
+             * Optionally, the node's children can also be purged.
+             * Optionally, you can specify a specific type of event to remove.
+             * @method purgeElement
+             * @param {HTMLElement} el the element to purge
+             * @param {boolean} recurse recursively purge this element's children
+             * as well.  Use with caution.
+             * @param {string} sType optional type of listener to purge. If
+             * left out, all listeners will be removed
+             * @static
+             */
+            purgeElement: function(el, recurse, sType) {
+                var elListeners = this.getListeners(el, sType);
+                if (elListeners) {
+                    for (var i=0,len=elListeners.length; i<len ; ++i) {
+                        var l = elListeners[i];
+                        // can't use the index on the changing collection
+                        //this.removeListener(el, l.type, l.fn, l.index);
+                        this.removeListener(el, l.type, l.fn);
+                    }
+                }
+
+                if (recurse && el && el.childNodes) {
+                    for (i=0,len=el.childNodes.length; i<len ; ++i) {
+                        this.purgeElement(el.childNodes[i], recurse, sType);
+                    }
+                }
+            },
+
+            /**
+             * Returns all listeners attached to the given element via addListener.
+             * Optionally, you can specify a specific type of event to return.
+             * @method getListeners
+             * @param el {HTMLElement} the element to inspect 
+             * @param sType {string} optional type of listener to return. If
+             * left out, all listeners will be returned
+             * @return {Object} the listener. Contains the following fields:
+             * &nbsp;&nbsp;type:   (string)   the type of event
+             * &nbsp;&nbsp;fn:     (function) the callback supplied to addListener
+             * &nbsp;&nbsp;obj:    (object)   the custom object supplied to addListener
+             * &nbsp;&nbsp;adjust: (boolean)  whether or not to adjust the default scope
+             * &nbsp;&nbsp;index:  (int)      its position in the Event util listener cache
+             * @static
+             */           
+            getListeners: function(el, sType) {
+                var elListeners = [];
+                if (listeners && listeners.length > 0) {
+                    for (var i=0,len=listeners.length; i<len ; ++i) {
+                        var l = listeners[i];
+                        if ( l  && l[this.EL] === el && 
+                                (!sType || sType === l[this.TYPE]) ) {
+                            elListeners.push({
+                                type:   l[this.TYPE],
+                                fn:     l[this.FN],
+                                obj:    l[this.OBJ],
+                                adjust: l[this.ADJ_SCOPE],
+                                index:  i
+                            });
+                        }
+                    }
+                }
+
+                return (elListeners.length) ? elListeners : null;
+            },
+
+            /**
+             * Removes all listeners registered by pe.event.  Called 
+             * automatically during the unload event.
+             * @method _unload
+             * @static
+             * @private
+             */
+            _unload: function(e) {
+
+                var EU = YAHOO.util.Event, i, j, l, len, index;
+
+                for (i=0,len=unloadListeners.length; i<len; ++i) {
+                    l = unloadListeners[i];
+                    if (l) {
+                        var scope = window;
+                        if (l[EU.ADJ_SCOPE]) {
+                            if (l[EU.ADJ_SCOPE] === true) {
+                                scope = l[EU.OBJ];
+                            } else {
+                                scope = l[EU.ADJ_SCOPE];
+                            }
+                        }
+                        l[EU.FN].call(scope, EU.getEvent(e), l[EU.OBJ] );
+                        delete unloadListeners[i];
+                        l=null;
+                        scope=null;
+                    }
+                }
+
+                if (listeners && listeners.length > 0) {
+                    j = listeners.length;
+                    while (j) {
+                        index = j-1;
+                        l = listeners[index];
+                        if (l) {
+                            EU.removeListener(l[EU.EL], l[EU.TYPE], 
+                                    l[EU.FN], index);
+                        } 
+                        j = j - 1;
+                    }
+                    l=null;
+
+                    EU.clearCache();
+                }
+
+                for (i=0,len=legacyEvents.length; i<len; ++i) {
+                    // dereference the element
+                    delete legacyEvents[i][0];
+                    // delete the array item
+                    delete legacyEvents[i];
+                }
+
+                EU._simpleRemove(window, "unload", EU._unload);
+
+            },
+
+            /**
+             * Returns scrollLeft
+             * @method _getScrollLeft
+             * @static
+             * @private
+             */
+            _getScrollLeft: function() {
+                return this._getScroll()[1];
+            },
+
+            /**
+             * Returns scrollTop
+             * @method _getScrollTop
+             * @static
+             * @private
+             */
+            _getScrollTop: function() {
+                return this._getScroll()[0];
+            },
+
+            /**
+             * Returns the scrollTop and scrollLeft.  Used to calculate the 
+             * pageX and pageY in Internet Explorer
+             * @method _getScroll
+             * @static
+             * @private
+             */
+            _getScroll: function() {
+                var dd = document.documentElement, db = document.body;
+                if (dd && (dd.scrollTop || dd.scrollLeft)) {
+                    return [dd.scrollTop, dd.scrollLeft];
+                } else if (db) {
+                    return [db.scrollTop, db.scrollLeft];
+                } else {
+                    return [0, 0];
+                }
+            },
+
+            /**
+             * Adds a DOM event directly without the caching, cleanup, scope adj, etc
+             *
+             * @method _simpleAdd
+             * @param {HTMLElement} el      the element to bind the handler to
+             * @param {string}      sType   the type of event handler
+             * @param {function}    fn      the callback to invoke
+             * @param {boolen}      capture capture or bubble phase
+             * @static
+             * @private
+             */
+            _simpleAdd: function () {
+                if (window.addEventListener) {
+                    return function(el, sType, fn, capture) {
+                        el.addEventListener(sType, fn, (capture));
+                    };
+                } else if (window.attachEvent) {
+                    return function(el, sType, fn, capture) {
+                        el.attachEvent("on" + sType, fn);
+                    };
+                } else {
+                    return function(){};
+                }
+            }(),
+
+            /**
+             * Basic remove listener
+             *
+             * @method _simpleRemove
+             * @param {HTMLElement} el      the element to bind the handler to
+             * @param {string}      sType   the type of event handler
+             * @param {function}    fn      the callback to invoke
+             * @param {boolen}      capture capture or bubble phase
+             * @static
+             * @private
+             */
+            _simpleRemove: function() {
+                if (window.removeEventListener) {
+                    return function (el, sType, fn, capture) {
+                        el.removeEventListener(sType, fn, (capture));
+                    };
+                } else if (window.detachEvent) {
+                    return function (el, sType, fn) {
+                        el.detachEvent("on" + sType, fn);
+                    };
+                } else {
+                    return function(){};
+                }
+            }()
+        };
+
+    }();
+
+    (function() {
+        var EU = YAHOO.util.Event;
+
+        /**
+         * YAHOO.util.Event.on is an alias for addListener
+         * @method on
+         * @see addListener
+         * @static
+         */
+        EU.on = EU.addListener;
+
+        // YAHOO.mix(EU, YAHOO.util.EventProvider.prototype);
+        // EU.createEvent("DOMContentReady");
+        // EU.subscribe("DOMContentReady", EU._load);
+
+        if (document && document.body) {
+            EU._load();
+        } else {
+            // EU._simpleAdd(document, "DOMContentLoaded", EU._load);
+            EU._simpleAdd(window, "load", EU._load);
+        }
+        EU._simpleAdd(window, "unload", EU._unload);
+        EU._tryPreloadAttach();
+    })();
+}
+
+/**
+ * EventProvider is designed to be used with YAHOO.augment to wrap 
+ * CustomEvents in an interface that allows events to be subscribed to 
+ * and fired by name.  This makes it possible for implementing code to
+ * subscribe to an event that either has not been created yet, or will
+ * not be created at all.
+ *
+ * @Class EventProvider
+ */
+YAHOO.util.EventProvider = function() { };
+
+YAHOO.util.EventProvider.prototype = {
+
+    /**
+     * Private storage of custom events
+     * @property __yui_events
+     * @type Object[]
+     * @private
+     */
+    __yui_events: null,
+
+    /**
+     * Private storage of custom event subscribers
+     * @property __yui_subscribers
+     * @type Object[]
+     * @private
+     */
+    __yui_subscribers: null,
+    
+    /**
+     * Subscribe to a CustomEvent by event type
+     *
+     * @method subscribe
+     * @param p_type     {string}   the type, or name of the event
+     * @param p_fn       {function} the function to exectute when the event fires
+     * @param p_obj
+     * @param p_obj      {Object}   An object to be passed along when the event 
+     *                              fires
+     * @param p_override {boolean}  If true, the obj passed in becomes the 
+     *                              execution scope of the listener
+     */
+    subscribe: function(p_type, p_fn, p_obj, p_override) {
+
+        this.__yui_events = this.__yui_events || {};
+        var ce = this.__yui_events[p_type];
+
+        if (ce) {
+            ce.subscribe(p_fn, p_obj, p_override);
+        } else {
+            this.__yui_subscribers = this.__yui_subscribers || {};
+            var subs = this.__yui_subscribers;
+            if (!subs[p_type]) {
+                subs[p_type] = [];
+            }
+            subs[p_type].push(
+                { fn: p_fn, obj: p_obj, override: p_override } );
+        }
+    },
+
+    /**
+     * Unsubscribes the from the specified event
+     * @method unsubscribe
+     * @param p_type {string}   The type, or name of the event
+     * @param p_fn   {Function} The function to execute
+     * @param p_obj  {Object}   The custom object passed to subscribe (optional)
+     * @return {boolean} true if the subscriber was found and detached.
+     */
+    unsubscribe: function(p_type, p_fn, p_obj) {
+        this.__yui_events = this.__yui_events || {};
+        var ce = this.__yui_events[p_type];
+        if (ce) {
+            return ce.unsubscribe(p_fn, p_obj);
+        } else {
+            return false;
+        }
+    },
+
+    /**
+     * Creates a new custom event of the specified type.  If a custom event
+     * by that name already exists, it will not be re-created.  In either
+     * case the custom event is returned. 
+     *
+     * @method createEvent
+     *
+     * @param p_type {string} the type, or name of the event
+     * @param p_config {object} optional config params.  Valid properties are:
+     *
+     *  <ul>
+     *    <li>
+     *      scope: defines the default execution scope.  If not defined
+     *      the default scope will be this instance.
+     *    </li>
+     *    <li>
+     *      silent: if true, the custom event will not generate log messages.
+     *      This is false by default.
+     *    </li>
+     *    <li>
+     *      onSubscribeCallback: specifies a callback to execute when the
+     *      event has a new subscriber.  This will fire immediately for
+     *      each queued subscriber if any exist prior to the creation of
+     *      the event.
+     *    </li>
+     *  </ul>
+     *
+     *  @return {CustomEvent} the custom event
+     *
+     */
+    createEvent: function(p_type, p_config) {
+
+        this.__yui_events = this.__yui_events || {};
+        var opts = p_config || {};
+        var events = this.__yui_events;
+
+        if (events[p_type]) {
+        } else {
+
+            var scope  = opts.scope  || this;
+            var silent = opts.silent || null;
+
+            var ce = new YAHOO.util.CustomEvent(p_type, scope, silent,
+                    YAHOO.util.CustomEvent.FLAT);
+            events[p_type] = ce;
+
+            if (opts.onSubscribeCallback) {
+                ce.subscribeEvent.subscribe(opts.onSubscribeCallback);
+            }
+
+            this.__yui_subscribers = this.__yui_subscribers || {};
+            var qs = this.__yui_subscribers[p_type];
+
+            if (qs) {
+                for (var i=0; i<qs.length; ++i) {
+                    ce.subscribe(qs[i].fn, qs[i].obj, qs[i].override);
+                }
+            }
+        }
+
+        return events[p_type];
+    },
+
+   /**
+     * Fire a custom event by name.  The callback functions will be executed
+     * from the scope specified when the event was created, and with the 
+     * following parameters:
+     *   <ul>
+     *   <li>The first argument fire() was executed with</li>
+     *   <li>The custom object (if any) that was passed into the subscribe() 
+     *       method</li>
+     *   </ul>
+     * @method fireEvent
+     * @param p_type    {string}  the type, or name of the event
+     * @param arguments {Object*} an arbitrary set of parameters to pass to 
+     *                            the handler.
+     * @return {boolean} the return value from CustomEvent.fire, or null if 
+     *                   the custom event does not exist.
+     */
+    fireEvent: function(p_type, arg1, arg2, etc) {
+
+        this.__yui_events = this.__yui_events || {};
+        var ce = this.__yui_events[p_type];
+
+        if (ce) {
+            var args = [];
+            for (var i=1; i<arguments.length; ++i) {
+                args.push(arguments[i]);
+            }
+            return ce.fire.apply(ce, args);
+        } else {
+            return null;
+        }
+    },
+
+    /**
+     * Returns true if the custom event of the provided type has been created
+     * with createEvent.
+     * @method hasEvent
+     * @param type {string} the type, or name of the event
+     */
+    hasEvent: function(type) {
+        if (this.__yui_events) {
+            if (this.__yui_events[type]) {
+                return true;
+            }
+        }
+        return false;
+    }
+
+};
+
diff --git a/frontend/beta/js/YUI/logger.js b/frontend/beta/js/YUI/logger.js
new file mode 100644
index 0000000..a2b40b2
--- a/dev/null
+++ b/frontend/beta/js/YUI/logger.js
@@ -0,0 +1,1559 @@
+/*

+Copyright (c) 2006, Yahoo! Inc. All rights reserved.

+Code licensed under the BSD License:

+http://developer.yahoo.com/yui/license.txt

+version: 0.12.0

+*/

+

+/****************************************************************************/

+/****************************************************************************/

+/****************************************************************************/

+

+/**

+ * The LogMsg class defines a single log message.

+ *

+ * @class LogMsg

+ * @constructor

+ * @param oConfigs {Object} Object literal of configuration params.

+ */

+ YAHOO.widget.LogMsg = function(oConfigs) {

+    // Parse configs

+    if (typeof oConfigs == "object") {

+        for(var param in oConfigs) {

+            this[param] = oConfigs[param];

+        }

+    }

+ };

+ 

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public member variables

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Log message.

+ *

+ * @property msg

+ * @type String

+ */

+YAHOO.widget.LogMsg.prototype.msg = null;

+ 

+/**

+ * Log timestamp.

+ *

+ * @property time

+ * @type Date

+ */

+YAHOO.widget.LogMsg.prototype.time = null;

+

+/**

+ * Log category.

+ *

+ * @property category

+ * @type String

+ */

+YAHOO.widget.LogMsg.prototype.category = null;

+

+/**

+ * Log source. The first word passed in as the source argument.

+ *

+ * @property source

+ * @type String

+ */

+YAHOO.widget.LogMsg.prototype.source = null;

+

+/**

+ * Log source detail. The remainder of the string passed in as the source argument, not

+ * including the first word (if any).

+ *

+ * @property sourceDetail

+ * @type String

+ */

+YAHOO.widget.LogMsg.prototype.sourceDetail = null;

+

+/****************************************************************************/

+/****************************************************************************/

+/****************************************************************************/

+

+/**

+ * The LogWriter class provides a mechanism to log messages through

+ * YAHOO.widget.Logger from a named source.

+ *

+ * @class LogWriter

+ * @constructor

+ * @param sSource {String} Source of LogWriter instance.

+ */

+YAHOO.widget.LogWriter = function(sSource) {

+    if(!sSource) {

+        YAHOO.log("Could not instantiate LogWriter due to invalid source.",

+            "error", "LogWriter");

+        return;

+    }

+    this._source = sSource;

+ };

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public methods

+//

+/////////////////////////////////////////////////////////////////////////////

+

+ /**

+ * Public accessor to the unique name of the LogWriter instance.

+ *

+ * @method toString

+ * @return {String} Unique name of the LogWriter instance.

+ */

+YAHOO.widget.LogWriter.prototype.toString = function() {

+    return "LogWriter " + this._sSource;

+};

+

+/**

+ * Logs a message attached to the source of the LogWriter.

+ *

+ * @method log

+ * @param sMsg {String} The log message.

+ * @param sCategory {String} Category name.

+ */

+YAHOO.widget.LogWriter.prototype.log = function(sMsg, sCategory) {

+    YAHOO.widget.Logger.log(sMsg, sCategory, this._source);

+};

+

+/**

+ * Public accessor to get the source name.

+ *

+ * @method getSource

+ * @return {String} The LogWriter source.

+ */

+YAHOO.widget.LogWriter.prototype.getSource = function() {

+    return this._sSource;

+};

+

+/**

+ * Public accessor to set the source name.

+ *

+ * @method setSource

+ * @param sSource {String} Source of LogWriter instance.

+ */

+YAHOO.widget.LogWriter.prototype.setSource = function(sSource) {

+    if(!sSource) {

+        YAHOO.log("Could not set source due to invalid source.", "error", this.toString());

+        return;

+    }

+    else {

+        this._sSource = sSource;

+    }

+};

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Private member variables

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Source of the LogWriter instance.

+ *

+ * @property _source

+ * @type String

+ * @private

+ */

+YAHOO.widget.LogWriter.prototype._source = null;

+

+

+

+/****************************************************************************/

+/****************************************************************************/

+/****************************************************************************/

+

+/**

+ * The LogReader class provides UI to read messages logged to YAHOO.widget.Logger.

+ *

+ * @class LogReader

+ * @constructor

+ * @param elContainer {HTMLElement} (optional) DOM element reference of an existing DIV.

+ * @param elContainer {String} (optional) String ID of an existing DIV.

+ * @param oConfigs {Object} (optional) Object literal of configuration params.

+ */

+YAHOO.widget.LogReader = function(elContainer, oConfigs) {

+    var oSelf = this;

+    this._sName = YAHOO.widget.LogReader._index;

+    YAHOO.widget.LogReader._index++;

+

+    // Parse config vars here

+    if (typeof oConfigs == "object") {

+        for(var param in oConfigs) {

+            this[param] = oConfigs[param];

+        }

+    }

+

+    // Attach container...

+    if(elContainer) {

+        if(typeof elContainer == "string") {

+            this._elContainer = document.getElementById(elContainer);

+        }

+        else if(elContainer.tagName) {

+            this._elContainer = elContainer;

+        }

+        this._elContainer.className = "yui-log";

+    }

+    // ...or create container from scratch

+    if(!this._elContainer) {

+        if(YAHOO.widget.LogReader._elDefaultContainer) {

+            this._elContainer =  YAHOO.widget.LogReader._elDefaultContainer;

+        }

+        else {

+            this._elContainer = document.body.appendChild(document.createElement("div"));

+            this._elContainer.id = "yui-log";

+            this._elContainer.className = "yui-log";

+

+            YAHOO.widget.LogReader._elDefaultContainer = this._elContainer;

+        }

+

+        // If implementer has provided container values, trust and set those

+        var containerStyle = this._elContainer.style;

+        if(this.width) {

+            containerStyle.width = this.width;

+        }

+        if(this.left) {

+            containerStyle.left = this.left;

+        }

+        if(this.right) {

+            containerStyle.right = this.right;

+        }

+        if(this.bottom) {

+            containerStyle.bottom = this.bottom;

+        }

+        if(this.top) {

+            containerStyle.top = this.top;

+        }

+        if(this.fontSize) {

+            containerStyle.fontSize = this.fontSize;

+        }

+    }

+

+    if(this._elContainer) {

+        // Create header

+        if(!this._elHd) {

+            this._elHd = this._elContainer.appendChild(document.createElement("div"));

+            this._elHd.id = "yui-log-hd" + this._sName;

+            this._elHd.className = "yui-log-hd";

+

+            this._elCollapse = this._elHd.appendChild(document.createElement("div"));

+            this._elCollapse.className = "yui-log-btns";

+

+            this._btnCollapse = document.createElement("input");

+            this._btnCollapse.type = "button";

+            this._btnCollapse.style.fontSize =

+                YAHOO.util.Dom.getStyle(this._elContainer,"fontSize");

+            this._btnCollapse.className = "yui-log-button";

+            this._btnCollapse.value = "Collapse";

+            this._btnCollapse = this._elCollapse.appendChild(this._btnCollapse);

+            YAHOO.util.Event.addListener(

+                oSelf._btnCollapse,'click',oSelf._onClickCollapseBtn,oSelf);

+

+            this._title = this._elHd.appendChild(document.createElement("h4"));

+            this._title.innerHTML = "Logger Console";

+

+            // If Drag and Drop utility is available...

+            // ...and this container was created from scratch...

+            // ...then make the header draggable

+            if(YAHOO.util.DD &&

+            (YAHOO.widget.LogReader._elDefaultContainer == this._elContainer)) {

+                var ylog_dd = new YAHOO.util.DD(this._elContainer.id);

+                ylog_dd.setHandleElId(this._elHd.id);

+                this._elHd.style.cursor = "move";

+            }

+        }

+        // Ceate console

+        if(!this._elConsole) {

+            this._elConsole =

+                this._elContainer.appendChild(document.createElement("div"));

+            this._elConsole.className = "yui-log-bd";

+

+            // If implementer has provided console, trust and set those

+            if(this.height) {

+                this._elConsole.style.height = this.height;

+            }

+        }

+        // Don't create footer if disabled

+        if(!this._elFt && this.footerEnabled) {

+            this._elFt = this._elContainer.appendChild(document.createElement("div"));

+            this._elFt.className = "yui-log-ft";

+

+            this._elBtns = this._elFt.appendChild(document.createElement("div"));

+            this._elBtns.className = "yui-log-btns";

+

+            this._btnPause = document.createElement("input");

+            this._btnPause.type = "button";

+            this._btnPause.style.fontSize =

+                YAHOO.util.Dom.getStyle(this._elContainer,"fontSize");

+            this._btnPause.className = "yui-log-button";

+            this._btnPause.value = "Pause";

+            this._btnPause = this._elBtns.appendChild(this._btnPause);

+            YAHOO.util.Event.addListener(

+                oSelf._btnPause,'click',oSelf._onClickPauseBtn,oSelf);

+

+            this._btnClear = document.createElement("input");

+            this._btnClear.type = "button";

+            this._btnClear.style.fontSize =

+                YAHOO.util.Dom.getStyle(this._elContainer,"fontSize");

+            this._btnClear.className = "yui-log-button";

+            this._btnClear.value = "Clear";

+            this._btnClear = this._elBtns.appendChild(this._btnClear);

+            YAHOO.util.Event.addListener(

+                oSelf._btnClear,'click',oSelf._onClickClearBtn,oSelf);

+

+            this._elCategoryFilters = this._elFt.appendChild(document.createElement("div"));

+            this._elCategoryFilters.className = "yui-log-categoryfilters";

+            this._elSourceFilters = this._elFt.appendChild(document.createElement("div"));

+            this._elSourceFilters.className = "yui-log-sourcefilters";

+        }

+    }

+

+    // Initialize internal vars

+    if(!this._buffer) {

+        this._buffer = []; // output buffer

+    }

+    // Timestamp of last log message to console

+    this._lastTime = YAHOO.widget.Logger.getStartTime(); 

+    

+    // Subscribe to Logger custom events

+    YAHOO.widget.Logger.newLogEvent.subscribe(this._onNewLog, this);

+    YAHOO.widget.Logger.logResetEvent.subscribe(this._onReset, this);

+

+    // Initialize category filters

+    this._categoryFilters = [];

+    var catsLen = YAHOO.widget.Logger.categories.length;

+    if(this._elCategoryFilters) {

+        for(var i=0; i < catsLen; i++) {

+            this._createCategoryCheckbox(YAHOO.widget.Logger.categories[i]);

+        }

+    }

+    // Initialize source filters

+    this._sourceFilters = [];

+    var sourcesLen = YAHOO.widget.Logger.sources.length;

+    if(this._elSourceFilters) {

+        for(var j=0; j < sourcesLen; j++) {

+            this._createSourceCheckbox(YAHOO.widget.Logger.sources[j]);

+        }

+    }

+    YAHOO.widget.Logger.categoryCreateEvent.subscribe(this._onCategoryCreate, this);

+    YAHOO.widget.Logger.sourceCreateEvent.subscribe(this._onSourceCreate, this);

+

+    this._filterLogs();

+    YAHOO.log("LogReader initialized", null, this.toString());

+};

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public member variables

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Whether or not the log reader is enabled to output log messages.

+ *

+ * @property logReaderEnabled

+ * @type Boolean

+ * @default true

+ */

+YAHOO.widget.LogReader.prototype.logReaderEnabled = true;

+

+/**

+ * Public member to access CSS width of the log reader container.

+ *

+ * @property width

+ * @type String

+ */

+YAHOO.widget.LogReader.prototype.width = null;

+

+/**

+ * Public member to access CSS height of the log reader container.

+ *

+ * @property height

+ * @type String

+ */

+YAHOO.widget.LogReader.prototype.height = null;

+

+/**

+ * Public member to access CSS top position of the log reader container.

+ *

+ * @property top

+ * @type String

+ */

+YAHOO.widget.LogReader.prototype.top = null;

+

+/**

+ * Public member to access CSS left position of the log reader container.

+ *

+ * @property left

+ * @type String

+ */

+YAHOO.widget.LogReader.prototype.left = null;

+

+/**

+ * Public member to access CSS right position of the log reader container.

+ *

+ * @property right

+ * @type String

+ */

+YAHOO.widget.LogReader.prototype.right = null;

+

+/**

+ * Public member to access CSS bottom position of the log reader container.

+ *

+ * @property bottom

+ * @type String

+ */

+YAHOO.widget.LogReader.prototype.bottom = null;

+

+/**

+ * Public member to access CSS font size of the log reader container.

+ *

+ * @property fontSize

+ * @type String

+ */

+YAHOO.widget.LogReader.prototype.fontSize = null;

+

+/**

+ * Whether or not the footer UI is enabled for the log reader.

+ *

+ * @property footerEnabled

+ * @type Boolean

+ * @default true

+ */

+YAHOO.widget.LogReader.prototype.footerEnabled = true;

+

+/**

+ * Whether or not output is verbose (more readable). Setting to true will make

+ * output more compact (less readable).

+ *

+ * @property verboseOutput

+ * @type Boolean

+ * @default true

+ */

+YAHOO.widget.LogReader.prototype.verboseOutput = true;

+

+/**

+ * Whether or not newest message is printed on top.

+ *

+ * @property newestOnTop

+ * @type Boolean

+ */

+YAHOO.widget.LogReader.prototype.newestOnTop = true;

+

+/**

+ * Maximum number of messages a LogReader console will display.

+ *

+ * @property thresholdMax

+ * @type Number

+ * @default 500

+ */

+YAHOO.widget.LogReader.prototype.thresholdMax = 500;

+

+/**

+ * When a LogReader console reaches its thresholdMax, it will clear out messages

+ * and print out the latest thresholdMin number of messages.

+ *

+ * @property thresholdMin

+ * @type Number

+ * @default 100

+ */

+YAHOO.widget.LogReader.prototype.thresholdMin = 100;

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public methods

+//

+/////////////////////////////////////////////////////////////////////////////

+

+ /**

+ * Public accessor to the unique name of the LogReader instance.

+ *

+ * @method toString

+ * @return {String} Unique name of the LogReader instance.

+ */

+YAHOO.widget.LogReader.prototype.toString = function() {

+    return "LogReader instance" + this._sName;

+};

+/**

+ * Pauses output of log messages. While paused, log messages are not lost, but

+ * get saved to a buffer and then output upon resume of log reader.

+ *

+ * @method pause

+ */

+YAHOO.widget.LogReader.prototype.pause = function() {

+    this._timeout = null;

+    this.logReaderEnabled = false;

+};

+

+/**

+ * Resumes output of log messages, including outputting any log messages that

+ * have been saved to buffer while paused.

+ *

+ * @method resume

+ */

+YAHOO.widget.LogReader.prototype.resume = function() {

+    this.logReaderEnabled = true;

+    this._printBuffer();

+};

+

+/**

+ * Hides UI of log reader. Logging functionality is not disrupted.

+ *

+ * @method hide

+ */

+YAHOO.widget.LogReader.prototype.hide = function() {

+    this._elContainer.style.display = "none";

+};

+

+/**

+ * Shows UI of log reader. Logging functionality is not disrupted.

+ *

+ * @method show

+ */

+YAHOO.widget.LogReader.prototype.show = function() {

+    this._elContainer.style.display = "block";

+};

+

+/**

+ * Updates title to given string.

+ *

+ * @method setTitle

+ * @param sTitle {String} New title.

+ */

+YAHOO.widget.LogReader.prototype.setTitle = function(sTitle) {

+    this._title.innerHTML = this.html2Text(sTitle);

+};

+

+/**

+ * Gets timestamp of the last log.

+ *

+ * @method getLastTime

+ * @return {Date} Timestamp of the last log.

+ */

+YAHOO.widget.LogReader.prototype.getLastTime = function() {

+    return this._lastTime;

+};

+

+/**

+ * Formats message string to HTML for output to console.

+ *

+ * @method formatMsg

+ * @param oLogMsg {Object} Log message object.

+ * @return {String} HTML-formatted message for output to console.

+ */

+YAHOO.widget.LogReader.prototype.formatMsg = function(oLogMsg) {

+    var category = oLogMsg.category;

+    

+    // Label for color-coded display

+    var label = category.substring(0,4).toUpperCase();

+

+    // Calculate the elapsed time to be from the last item that passed through the filter,

+    // not the absolute previous item in the stack

+

+    var time = oLogMsg.time;

+    if (time.toLocaleTimeString) {

+        var localTime  = time.toLocaleTimeString();

+    }

+    else {

+        localTime = time.toString();

+    }

+

+    var msecs = time.getTime();

+    var startTime = YAHOO.widget.Logger.getStartTime();

+    var totalTime = msecs - startTime;

+    var elapsedTime = msecs - this.getLastTime();

+

+    var source = oLogMsg.source;

+    var sourceDetail = oLogMsg.sourceDetail;

+    var sourceAndDetail = (sourceDetail) ?

+        source + " " + sourceDetail : source;

+        

+    // Escape HTML entities in the log message itself for output to console

+    var msg = this.html2Text(oLogMsg.msg);

+

+    // Verbose output includes extra line breaks

+    var output =  (this.verboseOutput) ?

+        ["<p><span class='", category, "'>", label, "</span> ",

+        totalTime, "ms (+", elapsedTime, ") ",

+        localTime, ": ",

+        "</p><p>",

+        sourceAndDetail,

+        ": </p><p>",

+        msg,

+        "</p>"] :

+

+        ["<p><span class='", category, "'>", label, "</span> ",

+        totalTime, "ms (+", elapsedTime, ") ",

+        localTime, ": ",

+        sourceAndDetail, ": ",

+        msg,"</p>"];

+

+    return output.join("");

+};

+

+/**

+ * Converts input chars "<", ">", and "&" to HTML entities.

+ *

+ * @method html2Text

+ * @param sHtml {String} String to convert.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype.html2Text = function(sHtml) {

+    if(sHtml) {

+        sHtml += "";

+        return sHtml.replace(/&/g, "&#38;").replace(/</g, "&#60;").replace(/>/g, "&#62;");

+    }

+    return "";

+};

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Private member variables

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Internal class member to index multiple log reader instances.

+ *

+ * @property _memberName

+ * @static

+ * @type Number

+ * @default 0

+ * @private

+ */

+YAHOO.widget.LogReader._index = 0;

+

+/**

+ * Name of LogReader instance.

+ *

+ * @property _sName

+ * @type String

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._sName = null;

+

+/**

+ * A class member shared by all log readers if a container needs to be

+ * created during instantiation. Will be null if a container element never needs to

+ * be created on the fly, such as when the implementer passes in their own element.

+ *

+ * @property _elDefaultContainer

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader._elDefaultContainer = null;

+

+/**

+ * Buffer of log message objects for batch output.

+ *

+ * @property _buffer

+ * @type Object[]

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._buffer = null;

+

+/**

+ * Number of log messages output to console.

+ *

+ * @property _consoleMsgCount

+ * @type Number

+ * @default 0

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._consoleMsgCount = 0;

+

+/**

+ * Date of last output log message.

+ *

+ * @property _lastTime

+ * @type Date

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._lastTime = null;

+

+/**

+ * Batched output timeout ID.

+ *

+ * @property _timeout

+ * @type Number

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._timeout = null;

+

+/**

+ * Array of filters for log message categories.

+ *

+ * @property _categoryFilters

+ * @type String[]

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._categoryFilters = null;

+

+/**

+ * Array of filters for log message sources.

+ *

+ * @property _sourceFilters

+ * @type String[]

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._sourceFilters = null;

+

+/**

+ * Log reader container element.

+ *

+ * @property _elContainer

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._elContainer = null;

+

+/**

+ * Log reader header element.

+ *

+ * @property _elHd

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._elHd = null;

+

+/**

+ * Log reader collapse element.

+ *

+ * @property _elCollapse

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._elCollapse = null;

+

+/**

+ * Log reader collapse button element.

+ *

+ * @property _btnCollapse

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._btnCollapse = null;

+

+/**

+ * Log reader title header element.

+ *

+ * @property _title

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._title = null;

+

+/**

+ * Log reader console element.

+ *

+ * @property _elConsole

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._elConsole = null;

+

+/**

+ * Log reader footer element.

+ *

+ * @property _elFt

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._elFt = null;

+

+/**

+ * Log reader buttons container element.

+ *

+ * @property _elBtns

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._elBtns = null;

+

+/**

+ * Container element for log reader category filter checkboxes.

+ *

+ * @property _elCategoryFilters

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._elCategoryFilters = null;

+

+/**

+ * Container element for log reader source filter checkboxes.

+ *

+ * @property _elSourceFilters

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._elSourceFilters = null;

+

+/**

+ * Log reader pause button element.

+ *

+ * @property _btnPause

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._btnPause = null;

+

+/**

+ * Clear button element.

+ *

+ * @property _btnClear

+ * @type HTMLElement

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._btnClear = null;

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Private methods

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Creates the UI for a category filter in the log reader footer element.

+ *

+ * @method _createCategoryCheckbox

+ * @param sCategory {String} Category name.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._createCategoryCheckbox = function(sCategory) {

+    var oSelf = this;

+

+    if(this._elFt) {

+        var elParent = this._elCategoryFilters;

+        var filters = this._categoryFilters;

+

+        var elFilter = elParent.appendChild(document.createElement("span"));

+        elFilter.className = "yui-log-filtergrp";

+            // Append el at the end so IE 5.5 can set "type" attribute

+            // and THEN set checked property

+            var chkCategory = document.createElement("input");

+            chkCategory.id = "yui-log-filter-" + sCategory + this._sName;

+            chkCategory.className = "yui-log-filter-" + sCategory;

+            chkCategory.type = "checkbox";

+            chkCategory.category = sCategory;

+            chkCategory = elFilter.appendChild(chkCategory);

+            chkCategory.checked = true;

+

+            // Add this checked filter to the internal array of filters

+            filters.push(sCategory);

+            // Subscribe to the click event

+            YAHOO.util.Event.addListener(chkCategory,'click',oSelf._onCheckCategory,oSelf);

+

+            // Create and class the text label

+            var lblCategory = elFilter.appendChild(document.createElement("label"));

+            lblCategory.htmlFor = chkCategory.id;

+            lblCategory.className = sCategory;

+            lblCategory.innerHTML = sCategory;

+    }

+};

+

+/**

+ * Creates a checkbox in the log reader footer element to filter by source.

+ *

+ * @method _createSourceCheckbox

+ * @param sSource {String} Source name.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._createSourceCheckbox = function(sSource) {

+    var oSelf = this;

+

+    if(this._elFt) {

+        var elParent = this._elSourceFilters;

+        var filters = this._sourceFilters;

+

+        var elFilter = elParent.appendChild(document.createElement("span"));

+        elFilter.className = "yui-log-filtergrp";

+

+        // Append el at the end so IE 5.5 can set "type" attribute

+        // and THEN set checked property

+        var chkSource = document.createElement("input");

+        chkSource.id = "yui-log-filter" + sSource + this._sName;

+        chkSource.className = "yui-log-filter" + sSource;

+        chkSource.type = "checkbox";

+        chkSource.source = sSource;

+        chkSource = elFilter.appendChild(chkSource);

+        chkSource.checked = true;

+

+        // Add this checked filter to the internal array of filters

+        filters.push(sSource);

+        // Subscribe to the click event

+        YAHOO.util.Event.addListener(chkSource,'click',oSelf._onCheckSource,oSelf);

+

+        // Create and class the text label

+        var lblSource = elFilter.appendChild(document.createElement("label"));

+        lblSource.htmlFor = chkSource.id;

+        lblSource.className = sSource;

+        lblSource.innerHTML = sSource;

+    }

+};

+

+/**

+ * Reprints all log messages in the stack through filters.

+ *

+ * @method _filterLogs

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._filterLogs = function() {

+    // Reprint stack with new filters

+    if (this._elConsole !== null) {

+        this._clearConsole();

+        this._printToConsole(YAHOO.widget.Logger.getStack());

+    }

+};

+

+/**

+ * Clears all outputted log messages from the console and resets the time of the

+ * last output log message.

+ *

+ * @method _clearConsole

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._clearConsole = function() {

+    // Clear the buffer of any pending messages

+    this._timeout = null;

+    this._buffer = [];

+    this._consoleMsgCount = 0;

+

+    // Reset the rolling timer

+    this._lastTime = YAHOO.widget.Logger.getStartTime();

+

+    var elConsole = this._elConsole;

+    while(elConsole.hasChildNodes()) {

+        elConsole.removeChild(elConsole.firstChild);

+    }

+};

+

+/**

+ * Sends buffer of log messages to output and clears buffer.

+ *

+ * @method _printBuffer

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._printBuffer = function() {

+    this._timeout = null;

+

+    if(this._elConsole !== null) {

+        var thresholdMax = this.thresholdMax;

+        thresholdMax = (thresholdMax && !isNaN(thresholdMax)) ? thresholdMax : 500;

+        if(this._consoleMsgCount < thresholdMax) {

+            var entries = [];

+            for (var i=0; i<this._buffer.length; i++) {

+                entries[i] = this._buffer[i];

+            }

+            this._buffer = [];

+            this._printToConsole(entries);

+        }

+        else {

+            this._filterLogs();

+        }

+        

+        if(!this.newestOnTop) {

+            this._elConsole.scrollTop = this._elConsole.scrollHeight;

+        }

+    }

+};

+

+/**

+ * Cycles through an array of log messages, and outputs each one to the console

+ * if its category has not been filtered out.

+ *

+ * @method _printToConsole

+ * @param aEntries {Object[]} Array of LogMsg objects to output to console.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._printToConsole = function(aEntries) {

+    // Manage the number of messages displayed in the console

+    var entriesLen = aEntries.length;

+    var thresholdMin = this.thresholdMin;

+    if(isNaN(thresholdMin) || (thresholdMin > this.thresholdMax)) {

+        thresholdMin = 0;

+    }

+    var entriesStartIndex = (entriesLen > thresholdMin) ? (entriesLen - thresholdMin) : 0;

+    

+    // Iterate through all log entries 

+    var sourceFiltersLen = this._sourceFilters.length;

+    var categoryFiltersLen = this._categoryFilters.length;

+    for(var i=entriesStartIndex; i<entriesLen; i++) {

+        // Print only the ones that filter through

+        var okToPrint = false;

+        var okToFilterCats = false;

+

+        // Get log message details

+        var entry = aEntries[i];

+        var source = entry.source;

+        var category = entry.category;

+

+        for(var j=0; j<sourceFiltersLen; j++) {

+            if(source == this._sourceFilters[j]) {

+                okToFilterCats = true;

+                break;

+            }

+        }

+        if(okToFilterCats) {

+            for(var k=0; k<categoryFiltersLen; k++) {

+                if(category == this._categoryFilters[k]) {

+                    okToPrint = true;

+                    break;

+                }

+            }

+        }

+        if(okToPrint) {

+            var output = this.formatMsg(entry);

+

+            // Verbose output uses <code> tag instead of <pre> tag (for wrapping)

+            var container = (this.verboseOutput) ? "CODE" : "PRE";

+            var oNewElement = (this.newestOnTop) ?

+                this._elConsole.insertBefore(

+                    document.createElement(container),this._elConsole.firstChild):

+                this._elConsole.appendChild(document.createElement(container));

+

+            oNewElement.innerHTML = output;

+            this._consoleMsgCount++;

+            this._lastTime = entry.time.getTime();

+        }

+    }

+};

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Private event handlers

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Handles Logger's categoryCreateEvent.

+ *

+ * @method _onCategoryCreate

+ * @param sType {String} The event.

+ * @param aArgs {Object[]} Data passed from event firer.

+ * @param oSelf {Object} The LogReader instance.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._onCategoryCreate = function(sType, aArgs, oSelf) {

+    var category = aArgs[0];

+    if(oSelf._elFt) {

+        oSelf._createCategoryCheckbox(category);

+    }

+};

+

+/**

+ * Handles Logger's sourceCreateEvent.

+ *

+ * @method _onSourceCreate

+ * @param sType {String} The event.

+ * @param aArgs {Object[]} Data passed from event firer.

+ * @param oSelf {Object} The LogReader instance.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._onSourceCreate = function(sType, aArgs, oSelf) {

+    var source = aArgs[0];

+    if(oSelf._elFt) {

+        oSelf._createSourceCheckbox(source);

+    }

+};

+

+/**

+ * Handles check events on the category filter checkboxes.

+ *

+ * @method _onCheckCategory

+ * @param v {HTMLEvent} The click event.

+ * @param oSelf {Object} The LogReader instance.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._onCheckCategory = function(v, oSelf) {

+    var newFilter = this.category;

+    var filtersArray = oSelf._categoryFilters;

+

+    if(!this.checked) { // Remove category from filters

+        for(var i=0; i<filtersArray.length; i++) {

+            if(newFilter == filtersArray[i]) {

+                filtersArray.splice(i, 1);

+                break;

+            }

+        }

+    }

+    else { // Add category to filters

+        filtersArray.push(newFilter);

+    }

+    oSelf._filterLogs();

+};

+

+/**

+ * Handles check events on the category filter checkboxes.

+ *

+ * @method _onCheckSource

+ * @param v {HTMLEvent} The click event.

+ * @param oSelf {Object} The log reader instance.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._onCheckSource = function(v, oSelf) {

+    var newFilter = this.source;

+    var filtersArray = oSelf._sourceFilters;

+

+    if(!this.checked) { // Remove category from filters

+        for(var i=0; i<filtersArray.length; i++) {

+            if(newFilter == filtersArray[i]) {

+                filtersArray.splice(i, 1);

+                break;

+            }

+        }

+    }

+    else { // Add category to filters

+        filtersArray.push(newFilter);

+    }

+    oSelf._filterLogs();

+};

+

+/**

+ * Handles click events on the collapse button.

+ *

+ * @method _onClickCollapseBtn

+ * @param v {HTMLEvent} The click event.

+ * @param oSelf {Object} The LogReader instance

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._onClickCollapseBtn = function(v, oSelf) {

+    var btn = oSelf._btnCollapse;

+    if(btn.value == "Expand") {

+        oSelf._elConsole.style.display = "block";

+        if(oSelf._elFt) {

+            oSelf._elFt.style.display = "block";

+        }

+        btn.value = "Collapse";

+    }

+    else {

+        oSelf._elConsole.style.display = "none";

+        if(oSelf._elFt) {

+            oSelf._elFt.style.display = "none";

+        }

+        btn.value = "Expand";

+    }

+};

+

+/**

+ * Handles click events on the pause button.

+ *

+ * @method _onClickPauseBtn

+ * @param v {HTMLEvent} The click event.

+ * @param oSelf {Object} The LogReader instance.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._onClickPauseBtn = function(v, oSelf) {

+    var btn = oSelf._btnPause;

+    if(btn.value == "Resume") {

+        oSelf.resume();

+        btn.value = "Pause";

+    }

+    else {

+        oSelf.pause();

+        btn.value = "Resume";

+    }

+};

+

+/**

+ * Handles click events on the clear button.

+ *

+ * @method _onClickClearBtn

+ * @param v {HTMLEvent} The click event.

+ * @param oSelf {Object} The LogReader instance.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._onClickClearBtn = function(v, oSelf) {

+    oSelf._clearConsole();

+};

+

+/**

+ * Handles Logger's newLogEvent.

+ *

+ * @method _onNewLog

+ * @param sType {String} The event.

+ * @param aArgs {Object[]} Data passed from event firer.

+ * @param oSelf {Object} The LogReader instance.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._onNewLog = function(sType, aArgs, oSelf) {

+    var logEntry = aArgs[0];

+    oSelf._buffer.push(logEntry);

+

+    if (oSelf.logReaderEnabled === true && oSelf._timeout === null) {

+        oSelf._timeout = setTimeout(function(){oSelf._printBuffer();}, 100);

+    }

+};

+

+/**

+ * Handles Logger's resetEvent.

+ *

+ * @method _onReset

+ * @param sType {String} The event.

+ * @param aArgs {Object[]} Data passed from event firer.

+ * @param oSelf {Object} The LogReader instance.

+ * @private

+ */

+YAHOO.widget.LogReader.prototype._onReset = function(sType, aArgs, oSelf) {

+    oSelf._filterLogs();

+};

+ /**

+ * The Logger widget provides a simple way to read or write log messages in

+ * JavaScript code. Integration with the YUI Library's debug builds allow

+ * implementers to access under-the-hood events, errors, and debugging messages.

+ * Output may be read through a LogReader console and/or output to a browser

+ * console.

+ *

+ * @module logger

+ * @requires yahoo, event, dom

+ * @optional dragdrop

+ * @namespace YAHOO.widget

+ * @title Logger Widget

+ */

+

+/****************************************************************************/

+/****************************************************************************/

+/****************************************************************************/

+

+/**

+ * The singleton Logger class provides core log management functionality. Saves

+ * logs written through the global YAHOO.log function or written by a LogWriter

+ * instance. Provides access to logs for reading by a LogReader instance or

+ * native browser console such as the Firebug extension to Firefox or Safari's

+ * JavaScript console through integration with the console.log() method.

+ *

+ * @class Logger

+ * @static

+ */

+YAHOO.widget.Logger = {

+    // Initialize members

+    loggerEnabled: true,

+    _browserConsoleEnabled: false,

+    categories: ["info","warn","error","time","window"],

+    sources: ["global"],

+    _stack: [], // holds all log msgs

+    maxStackEntries: 2500,

+    _startTime: new Date().getTime(), // static start timestamp

+    _lastTime: null // timestamp of last logged message

+};

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public methods

+//

+/////////////////////////////////////////////////////////////////////////////

+/**

+ * Saves a log message to the stack and fires newLogEvent. If the log message is

+ * assigned to an unknown category, creates a new category. If the log message is

+ * from an unknown source, creates a new source.  If browser console is enabled,

+ * outputs the log message to browser console.

+ *

+ * @method log

+ * @param sMsg {String} The log message.

+ * @param sCategory {String} Category of log message, or null.

+ * @param sSource {String} Source of LogWriter, or null if global.

+ */

+YAHOO.widget.Logger.log = function(sMsg, sCategory, sSource) {

+    if(this.loggerEnabled) {

+        if(!sCategory) {

+            sCategory = "info"; // default category

+        }

+        else {

+            sCategory = sCategory.toLocaleLowerCase();

+            if(this._isNewCategory(sCategory)) {

+                this._createNewCategory(sCategory);

+            }

+        }

+        var sClass = "global"; // default source

+        var sDetail = null;

+        if(sSource) {

+            var spaceIndex = sSource.indexOf(" ");

+            if(spaceIndex > 0) {

+                // Substring until first space

+                sClass = sSource.substring(0,spaceIndex);

+                // The rest of the source

+                sDetail = sSource.substring(spaceIndex,sSource.length);

+            }

+            else {

+                sClass = sSource;

+            }

+            if(this._isNewSource(sClass)) {

+                this._createNewSource(sClass);

+            }

+        }

+

+        var timestamp = new Date();

+        var logEntry = new YAHOO.widget.LogMsg({

+            msg: sMsg,

+            time: timestamp,

+            category: sCategory,

+            source: sClass,

+            sourceDetail: sDetail

+        });

+

+        var stack = this._stack;

+        var maxStackEntries = this.maxStackEntries;

+        if(maxStackEntries && !isNaN(maxStackEntries) &&

+            (stack.length >= maxStackEntries)) {

+            stack.shift();

+        }

+        stack.push(logEntry);

+        this.newLogEvent.fire(logEntry);

+

+        if(this._browserConsoleEnabled) {

+            this._printToBrowserConsole(logEntry);

+        }

+        return true;

+    }

+    else {

+        return false;

+    }

+};

+

+/**

+ * Resets internal stack and startTime, enables Logger, and fires logResetEvent.

+ *

+ * @method reset

+ */

+YAHOO.widget.Logger.reset = function() {

+    this._stack = [];

+    this._startTime = new Date().getTime();

+    this.loggerEnabled = true;

+    this.log("Logger reset");

+    this.logResetEvent.fire();

+};

+

+/**

+ * Public accessor to internal stack of log message objects.

+ *

+ * @method getStack

+ * @return {Object[]} Array of log message objects.

+ */

+YAHOO.widget.Logger.getStack = function() {

+    return this._stack;

+};

+

+/**

+ * Public accessor to internal start time.

+ *

+ * @method getStartTime

+ * @return {Date} Internal date of when Logger singleton was initialized.

+ */

+YAHOO.widget.Logger.getStartTime = function() {

+    return this._startTime;

+};

+

+/**

+ * Disables output to the browser's global console.log() function, which is used

+ * by the Firebug extension to Firefox as well as Safari.

+ *

+ * @method disableBrowserConsole

+ */

+YAHOO.widget.Logger.disableBrowserConsole = function() {

+    YAHOO.log("Logger output to the function console.log() has been disabled.");

+    this._browserConsoleEnabled = false;

+};

+

+/**

+ * Enables output to the browser's global console.log() function, which is used

+ * by the Firebug extension to Firefox as well as Safari.

+ *

+ * @method enableBrowserConsole

+ */

+YAHOO.widget.Logger.enableBrowserConsole = function() {

+    this._browserConsoleEnabled = true;

+    YAHOO.log("Logger output to the function console.log() has been enabled.");

+};

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Public events

+//

+/////////////////////////////////////////////////////////////////////////////

+

+ /**

+ * Fired when a new category has been created.

+ *

+ * @event categoryCreateEvent

+ * @param sCategory {String} Category name.

+ */

+YAHOO.widget.Logger.categoryCreateEvent =

+    new YAHOO.util.CustomEvent("categoryCreate", this, true);

+

+ /**

+ * Fired when a new source has been named.

+ *

+ * @event sourceCreateEvent

+ * @param sSource {String} Source name.

+ */

+YAHOO.widget.Logger.sourceCreateEvent =

+    new YAHOO.util.CustomEvent("sourceCreate", this, true);

+

+ /**

+ * Fired when a new log message has been created.

+ *

+ * @event newLogEvent

+ * @param sMsg {String} Log message.

+ */

+YAHOO.widget.Logger.newLogEvent = new YAHOO.util.CustomEvent("newLog", this, true);

+

+/**

+ * Fired when the Logger has been reset has been created.

+ *

+ * @event logResetEvent

+ */

+YAHOO.widget.Logger.logResetEvent = new YAHOO.util.CustomEvent("logReset", this, true);

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Private methods

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Creates a new category of log messages and fires categoryCreateEvent.

+ *

+ * @method _createNewCategory

+ * @param sCategory {String} Category name.

+ * @private

+ */

+YAHOO.widget.Logger._createNewCategory = function(sCategory) {

+    this.categories.push(sCategory);

+    this.categoryCreateEvent.fire(sCategory);

+};

+

+/**

+ * Checks to see if a category has already been created.

+ *

+ * @method _isNewCategory

+ * @param sCategory {String} Category name.

+ * @return {Boolean} Returns true if category is unknown, else returns false.

+ * @private

+ */

+YAHOO.widget.Logger._isNewCategory = function(sCategory) {

+    for(var i=0; i < this.categories.length; i++) {

+        if(sCategory == this.categories[i]) {

+            return false;

+        }

+    }

+    return true;

+};

+

+/**

+ * Creates a new source of log messages and fires sourceCreateEvent.

+ *

+ * @method _createNewSource

+ * @param sSource {String} Source name.

+ * @private

+ */

+YAHOO.widget.Logger._createNewSource = function(sSource) {

+    this.sources.push(sSource);

+    this.sourceCreateEvent.fire(sSource);

+};

+

+/**

+ * Checks to see if a source already exists.

+ *

+ * @method _isNewSource

+ * @param sSource {String} Source name.

+ * @return {Boolean} Returns true if source is unknown, else returns false.

+ * @private

+ */

+YAHOO.widget.Logger._isNewSource = function(sSource) {

+    if(sSource) {

+        for(var i=0; i < this.sources.length; i++) {

+            if(sSource == this.sources[i]) {

+                return false;

+            }

+        }

+        return true;

+    }

+};

+

+/**

+ * Outputs a log message to global console.log() function.

+ *

+ * @method _printToBrowserConsole

+ * @param oEntry {Object} Log entry object.

+ * @private

+ */

+YAHOO.widget.Logger._printToBrowserConsole = function(oEntry) {

+    if(window.console && console.log) {

+        var category = oEntry.category;

+        var label = oEntry.category.substring(0,4).toUpperCase();

+

+        var time = oEntry.time;

+        if (time.toLocaleTimeString) {

+            var localTime  = time.toLocaleTimeString();

+        }

+        else {

+            localTime = time.toString();

+        }

+

+        var msecs = time.getTime();

+        var elapsedTime = (YAHOO.widget.Logger._lastTime) ?

+            (msecs - YAHOO.widget.Logger._lastTime) : 0;

+        YAHOO.widget.Logger._lastTime = msecs;

+

+        var output =

+            localTime + " (" +

+            elapsedTime + "ms): " +

+            oEntry.source + ": " +

+            oEntry.msg;

+

+        console.log(output);

+    }

+};

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Private event handlers

+//

+/////////////////////////////////////////////////////////////////////////////

+

+/**

+ * Handles logging of messages due to window error events.

+ *

+ * @method _onWindowError

+ * @param sMsg {String} The error message.

+ * @param sUrl {String} URL of the error.

+ * @param sLine {String} Line number of the error.

+ * @private

+ */

+YAHOO.widget.Logger._onWindowError = function(sMsg,sUrl,sLine) {

+    // Logger is not in scope of this event handler

+    try {

+        YAHOO.widget.Logger.log(sMsg+' ('+sUrl+', line '+sLine+')', "window");

+        if(YAHOO.widget.Logger._origOnWindowError) {

+            YAHOO.widget.Logger._origOnWindowError();

+        }

+    }

+    catch(e) {

+        return false;

+    }

+};

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// Enable handling of native JavaScript errors

+// NB: Not all browsers support the window.onerror event

+//

+/////////////////////////////////////////////////////////////////////////////

+

+if(window.onerror) {

+    // Save any previously defined handler to call

+    YAHOO.widget.Logger._origOnWindowError = window.onerror;

+}

+window.onerror = YAHOO.widget.Logger._onWindowError;

+

+/////////////////////////////////////////////////////////////////////////////

+//

+// First log

+//

+/////////////////////////////////////////////////////////////////////////////

+

+YAHOO.widget.Logger.log("Logger initialized");

+

diff --git a/frontend/beta/js/YUI/menu.js b/frontend/beta/js/YUI/menu.js
new file mode 100644
index 0000000..50eb0cf
--- a/dev/null
+++ b/frontend/beta/js/YUI/menu.js
@@ -0,0 +1,6780 @@
+/*
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.com/yui/license.txt
+version: 0.12.0
+*/
+
+/**
+* @module menu
+* @description <p>The Menu Library features a collection of widgets that make
+* it easy to add menus to your website or web application.  With the Menu
+* Library you can create website fly-out menus, customized context menus, or
+* application-style menu bars with just a small amount of scripting.</p>
+* <ul>
+*    <li>Screen-reader accessibility.</li>
+*    <li>Keyboard and mouse navigation.</li>
+*    <li>A rich event model that provides access to all of a menu's
+*    interesting moments.</li>
+*    <li>Support for
+*    <a href="http://en.wikipedia.org/wiki/Progressive_Enhancement">Progressive
+*    Enhancement</a>; Menus can be created from simple,
+*    semantic markup on the page or purely through JavaScript.</li>
+* </ul>
+* @title Menu Library
+* @namespace YAHOO.widget
+* @requires Event, Dom, Container
+*/
+(function() {
+
+var Dom = YAHOO.util.Dom;
+var Event = YAHOO.util.Event;
+
+/**
+* Singleton that manages a collection of all menus and menu items.  Listens for
+* DOM events at the document level and dispatches the events to the
+* corresponding menu or menu item.
+*
+* @namespace YAHOO.widget
+* @class MenuManager
+* @static
+*/
+YAHOO.widget.MenuManager = new function() {
+
+    // Private member variables
+
+    // Flag indicating if the DOM event handlers have been attached
+
+    var m_bInitializedEventHandlers = false;
+
+    // Collection of menus
+
+    var m_oMenus = {};
+
+
+    //  Collection of menu items
+
+    var m_oItems = {};
+
+    // Collection of visible menus
+
+    var m_oVisibleMenus = {};
+
+    // Logger
+
+
+    // Private methods
+
+    /**
+    * Adds an item to the collection of known menu items.
+    * @private
+    * @param {YAHOO.widget.MenuItem} p_oItem Object specifying the MenuItem
+    * instance to be added.
+    */
+    var addItem = function(p_oItem) {
+
+        var sYUIId = Dom.generateId();
+
+        if(p_oItem && m_oItems[sYUIId] != p_oItem) {
+
+            p_oItem.element.setAttribute("yuiid", sYUIId);
+
+            m_oItems[sYUIId] = p_oItem;
+
+            p_oItem.destroyEvent.subscribe(onItemDestroy, p_oItem);
+
+
+        }
+
+    };
+
+    /**
+    * Removes an item from the collection of known menu items.
+    * @private
+    * @param {YAHOO.widget.MenuItem} p_oItem Object specifying the MenuItem
+    * instance to be removed.
+    */
+    var removeItem = function(p_oItem) {
+
+        var sYUIId = p_oItem.element.getAttribute("yuiid");
+
+        if(sYUIId && m_oItems[sYUIId]) {
+
+            delete m_oItems[sYUIId];
+
+
+        }
+
+    };
+
+    /**
+    * Finds the root DIV node of a menu or the root LI node of a menu item.
+    * @private
+    * @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+    * one-html.html#ID-58190037">HTMLElement</a>} p_oElement Object specifying
+    * an HTML element.
+    */
+    var getMenuRootElement = function(p_oElement) {
+
+        var oParentNode;
+
+        if(p_oElement && p_oElement.tagName) {
+
+            switch(p_oElement.tagName.toUpperCase()) {
+
+                case "DIV":
+
+                    oParentNode = p_oElement.parentNode;
+
+                    // Check if the DIV is the inner "body" node of a menu
+
+                    if(
+                        Dom.hasClass(p_oElement, "bd") &&
+                        oParentNode &&
+                        oParentNode.tagName &&
+                        oParentNode.tagName.toUpperCase() == "DIV"
+                    ) {
+
+                        return oParentNode;
+
+                    }
+                    else {
+
+                        return p_oElement;
+
+                    }
+
+                break;
+
+                case "LI":
+
+                    return p_oElement;
+
+                default:
+
+                    oParentNode = p_oElement.parentNode;
+
+                    if(oParentNode) {
+
+                        return getMenuRootElement(oParentNode);
+
+                    }
+
+                break;
+
+            }
+
+        }
+
+    };
+
+    // Private event handlers
+
+    /**
+    * Generic, global event handler for all of a menu's DOM-based
+    * events.  This listens for events against the document object.  If the
+    * target of a given event is a member of a menu or menu item's DOM, the
+    * instance's corresponding Custom Event is fired.
+    * @private
+    * @param {Event} p_oEvent Object representing the DOM event object passed
+    * back by the event utility (YAHOO.util.Event).
+    */
+    var onDOMEvent = function(p_oEvent) {
+
+        // Get the target node of the DOM event
+
+        var oTarget = Event.getTarget(p_oEvent);
+
+        // See if the target of the event was a menu, or a menu item
+
+        var oElement = getMenuRootElement(oTarget);
+
+        var oMenuItem;
+        var oMenu;
+
+        if(oElement) {
+
+            var sTagName = oElement.tagName.toUpperCase();
+
+            if(sTagName == "LI") {
+
+                var sYUIId = oElement.getAttribute("yuiid");
+
+                if(sYUIId) {
+
+                    oMenuItem = m_oItems[sYUIId];
+                    oMenu = oMenuItem.parent;
+
+                }
+
+            }
+            else if(sTagName == "DIV") {
+
+                if(oElement.id) {
+
+                    oMenu = m_oMenus[oElement.id];
+
+                }
+
+            }
+
+        }
+
+        if(oMenu) {
+
+            // Map of DOM event names to CustomEvent names
+
+            var oEventTypes =  {
+                    "click": "clickEvent",
+                    "mousedown": "mouseDownEvent",
+                    "mouseup": "mouseUpEvent",
+                    "mouseover": "mouseOverEvent",
+                    "mouseout": "mouseOutEvent",
+                    "keydown": "keyDownEvent",
+                    "keyup": "keyUpEvent",
+                    "keypress": "keyPressEvent"
+                };
+
+            var sCustomEventType = oEventTypes[p_oEvent.type];
+
+            // Fire the Custom Even that corresponds the current DOM event
+
+            if(oMenuItem && !oMenuItem.cfg.getProperty("disabled")) {
+
+                oMenuItem[sCustomEventType].fire(p_oEvent);
+
+            }
+
+            oMenu[sCustomEventType].fire(p_oEvent, oMenuItem);
+
+        }
+        else if(p_oEvent.type == "mousedown") {
+
+            /*
+                If the target of the event wasn't a menu, hide all
+                dynamically positioned menus
+            */
+
+            var oActiveItem;
+
+            for(var i in m_oMenus) {
+
+                if(m_oMenus.hasOwnProperty(i)) {
+
+                    oMenu = m_oMenus[i];
+
+                    if(
+                        oMenu.cfg.getProperty("clicktohide") &&
+                        oMenu.cfg.getProperty("position") == "dynamic"
+                    ) {
+
+                        oMenu.hide();
+
+                    }
+                    else {
+
+                        oMenu.clearActiveItem(true);
+
+                    }
+
+                }
+
+            }
+
+        }
+
+    };
+
+    /**
+    * "destroy" event handler for a menu.
+    * @private
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+    * fired the event.
+    */
+    var onMenuDestroy = function(p_sType, p_aArgs, p_oMenu) {
+
+        this.removeMenu(p_oMenu);
+
+    };
+
+    /**
+    * "destroy" event handler for a MenuItem instance.
+    * @private
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    var onItemDestroy = function(p_sType, p_aArgs, p_oItem) {
+
+        var sYUIId = p_oItem.element.getAttribute("yuiid");
+
+        if(sYUIId) {
+
+            delete m_oItems[sYUIId];
+
+        }
+
+    };
+
+    /**
+    * Event handler for when the "visible" configuration property
+    * of a Menu instance changes.
+    * @private
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+    * fired the event.
+    */
+    var onMenuVisibleConfigChange = function(p_sType, p_aArgs, p_oMenu) {
+
+        var bVisible = p_aArgs[0];
+
+        if(bVisible) {
+
+            m_oVisibleMenus[p_oMenu.id] = p_oMenu;
+
+
+        }
+        else if(m_oVisibleMenus[p_oMenu.id]) {
+
+            delete m_oVisibleMenus[p_oMenu.id];
+
+
+        }
+
+    };
+
+    /**
+    * "itemadded" event handler for a Menu instance.
+    * @private
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    */
+    var onItemAdded = function(p_sType, p_aArgs) {
+
+        addItem(p_aArgs[0]);
+
+    };
+
+
+    /**
+    * "itemremoved" event handler for a Menu instance.
+    * @private
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    */
+    var onItemRemoved = function(p_sType, p_aArgs) {
+
+        removeItem(p_aArgs[0]);
+
+    };
+
+    // Privileged methods
+
+    /**
+    * @method addMenu
+    * @description Adds a menu to the collection of known menus.
+    * @param {YAHOO.widget.Menu} p_oMenu Object specifying the Menu instance
+    * to be added.
+    */
+    this.addMenu = function(p_oMenu) {
+
+        if(p_oMenu && p_oMenu.id && !m_oMenus[p_oMenu.id]) {
+
+            m_oMenus[p_oMenu.id] = p_oMenu;
+
+
+            if(!m_bInitializedEventHandlers) {
+
+                var oDoc = document;
+
+                Event.addListener(oDoc, "mouseover", onDOMEvent, this, true);
+                Event.addListener(oDoc, "mouseout", onDOMEvent, this, true);
+                Event.addListener(oDoc, "mousedown", onDOMEvent, this, true);
+                Event.addListener(oDoc, "mouseup", onDOMEvent, this, true);
+                Event.addListener(oDoc, "click", onDOMEvent, this, true);
+                Event.addListener(oDoc, "keydown", onDOMEvent, this, true);
+                Event.addListener(oDoc, "keyup", onDOMEvent, this, true);
+                Event.addListener(oDoc, "keypress", onDOMEvent, this, true);
+
+                m_bInitializedEventHandlers = true;
+
+
+            }
+
+            p_oMenu.destroyEvent.subscribe(onMenuDestroy, p_oMenu, this);
+
+            p_oMenu.cfg.subscribeToConfigEvent(
+                "visible",
+                onMenuVisibleConfigChange,
+                p_oMenu
+            );
+
+            p_oMenu.itemAddedEvent.subscribe(onItemAdded);
+            p_oMenu.itemRemovedEvent.subscribe(onItemRemoved);
+
+
+        }
+
+    };
+
+    /**
+    * @method removeMenu
+    * @description Removes a menu from the collection of known menus.
+    * @param {YAHOO.widget.Menu} p_oMenu Object specifying the Menu instance
+    * to be removed.
+    */
+    this.removeMenu = function(p_oMenu) {
+
+        if(p_oMenu && m_oMenus[p_oMenu.id]) {
+
+            delete m_oMenus[p_oMenu.id];
+
+
+        }
+
+    };
+
+    /**
+    * @method hideVisible
+    * @description Hides all visible, dynamically positioned menus.
+    */
+    this.hideVisible = function() {
+
+        var oMenu;
+
+        for(var i in m_oVisibleMenus) {
+
+            if(m_oVisibleMenus.hasOwnProperty(i)) {
+
+                oMenu = m_oVisibleMenus[i];
+
+                if(oMenu.cfg.getProperty("position") == "dynamic") {
+
+                    oMenu.hide();
+
+                }
+
+            }
+
+        }
+
+    };
+
+    /**
+    * @method getMenus
+    * @description Returns an array of all menus registered with the
+    * menu manger.
+    * @return {Array}
+    */
+    this.getMenus = function() {
+
+        return m_oMenus;
+
+    };
+
+    /**
+    * @method getMenu
+    * @description Returns a menu with the specified id.
+    * @param {String} p_sId String specifying the id of the menu to
+    * be retrieved.
+    * @return {YAHOO.widget.Menu}
+    */
+    this.getMenu = function(p_sId) {
+
+        if(m_oMenus[p_sId]) {
+
+            return m_oMenus[p_sId];
+
+        }
+
+    };
+
+
+    /**
+    * @method toString
+    * @description Returns a string representing the menu manager.
+    * @return {String}
+    */
+    this.toString = function() {
+
+        return ("MenuManager");
+
+    };
+
+};
+
+})();
+
+(function() {
+
+var Dom = YAHOO.util.Dom;
+var Event = YAHOO.util.Event;
+
+/**
+* The Menu class creates a container that holds a vertical list representing
+* a set of options or commands.  Menu is the base class for all
+* menu containers.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;div&#62;</code> element of the menu.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;select&#62;</code> element to be used as the data source
+* for the menu.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+* level-one-html.html#ID-22445964">HTMLDivElement</a>} p_oElement Object
+* specifying the <code>&#60;div&#62;</code> element of the menu.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+* level-one-html.html#ID-94282980">HTMLSelectElement</a>} p_oElement
+* Object specifying the <code>&#60;select&#62;</code> element to be used as
+* the data source for the menu.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the menu. See configuration class documentation for
+* more details.
+* @namespace YAHOO.widget
+* @class Menu
+* @constructor
+* @extends YAHOO.widget.Overlay
+*/
+YAHOO.widget.Menu = function(p_oElement, p_oConfig) {
+
+    if(p_oConfig) {
+
+        this.parent = p_oConfig.parent;
+
+        this.lazyLoad = p_oConfig.lazyLoad || p_oConfig.lazyload;
+
+        this.itemData = p_oConfig.itemData || p_oConfig.itemdata;
+
+    }
+
+    YAHOO.widget.Menu.superclass.constructor.call(
+        this,
+        p_oElement,
+        p_oConfig
+    );
+
+};
+
+YAHOO.extend(YAHOO.widget.Menu, YAHOO.widget.Overlay, {
+
+// Constants
+
+/**
+* @property CSS_CLASS_NAME
+* @description String representing the CSS class(es) to be applied to the
+* menu's <code>&#60;div&#62;</code> element.
+* @default "yuimenu"
+* @final
+* @type String
+*/
+CSS_CLASS_NAME: "yuimenu",
+
+/**
+* @property ITEM_TYPE
+* @description Object representing the type of menu item to instantiate and
+* add when parsing the child nodes (either <code>&#60;li&#62;</code> element,
+* <code>&#60;optgroup&#62;</code> element or <code>&#60;option&#62;</code>)
+* of the menu's source HTML element.
+* @default YAHOO.widget.MenuItem
+* @final
+* @type YAHOO.widget.MenuItem
+*/
+ITEM_TYPE: null,
+
+/**
+* @property GROUP_TITLE_TAG_NAME
+* @description String representing the tagname of the HTML element used to
+* title the menu's item groups.
+* @default H6
+* @final
+* @type String
+*/
+GROUP_TITLE_TAG_NAME: "h6",
+
+// Private properties
+
+/**
+* @property _nHideDelayId
+* @description Number representing the time-out setting used to cancel the
+* hiding of a menu.
+* @default null
+* @private
+* @type Number
+*/
+_nHideDelayId: null,
+
+/**
+* @property _nShowDelayId
+* @description Number representing the time-out setting used to cancel the
+* showing of a menu.
+* @default null
+* @private
+* @type Number
+*/
+_nShowDelayId: null,
+
+/**
+* @property _hideDelayEventHandlersAssigned
+* @description Boolean indicating if the "mouseover" and "mouseout" event
+* handlers used for hiding the menu via a call to "window.setTimeout" have
+* already been assigned.
+* @default false
+* @private
+* @type Boolean
+*/
+_hideDelayEventHandlersAssigned: false,
+
+/**
+* @property _bHandledMouseOverEvent
+* @description Boolean indicating the current state of the menu's
+* "mouseover" event.
+* @default false
+* @private
+* @type Boolean
+*/
+_bHandledMouseOverEvent: false,
+
+/**
+* @property _bHandledMouseOutEvent
+* @description Boolean indicating the current state of the menu's
+* "mouseout" event.
+* @default false
+* @private
+* @type Boolean
+*/
+_bHandledMouseOutEvent: false,
+
+/**
+* @property _aGroupTitleElements
+* @description Array of HTML element used to title groups of menu items.
+* @default []
+* @private
+* @type Array
+*/
+_aGroupTitleElements: null,
+
+/**
+* @property _aItemGroups
+* @description Array of menu items.
+* @default []
+* @private
+* @type Array
+*/
+_aItemGroups: null,
+
+/**
+* @property _aListElements
+* @description Array of <code>&#60;ul&#62;</code> elements, each of which is
+* the parent node for each item's <code>&#60;li&#62;</code> element.
+* @default []
+* @private
+* @type Array
+*/
+_aListElements: null,
+
+// Public properties
+
+/**
+* @property lazyLoad
+* @description Boolean indicating if the menu's "lazy load" feature is
+* enabled.  If set to "true," initialization and rendering of the menu's
+* items will be deferred until the first time it is made visible.  This
+* property should be set via the constructor using the configuration
+* object literal.
+* @default false
+* @type Boolean
+*/
+lazyLoad: false,
+
+/**
+* @property itemData
+* @description Array of items to be added to the menu.  The array can contain
+* strings representing the text for each item to be created, object literals
+* representing the menu item configuration properties, or MenuItem instances.
+* This property should be set via the constructor using the configuration
+* object literal.
+* @default null
+* @type Array
+*/
+itemData: null,
+
+/**
+* @property activeItem
+* @description Object reference to the item in the menu that has focus.
+* @default null
+* @type YAHOO.widget.MenuItem
+*/
+activeItem: null,
+
+/**
+* @property parent
+* @description Object reference to the menu's parent menu or menu item.
+* This property can be set via the constructor using the configuration
+* object literal.
+* @default null
+* @type YAHOO.widget.MenuItem
+*/
+parent: null,
+
+/**
+* @property srcElement
+* @description Object reference to the HTML element (either
+* <code>&#60;select&#62;</code> or <code>&#60;div&#62;</code>) used to
+* create the menu.
+* @default null
+* @type <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+* level-one-html.html#ID-94282980">HTMLSelectElement</a>|<a
+* href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-html.
+* html#ID-22445964">HTMLDivElement</a>
+*/
+srcElement: null,
+
+// Events
+
+/**
+* @event mouseOverEvent
+* @description Fires when the mouse has entered the menu.  Passes back
+* the DOM Event object as an argument.
+*/
+mouseOverEvent: null,
+
+/**
+* @event mouseOutEvent
+* @description Fires when the mouse has left the menu.  Passes back the DOM
+* Event object as an argument.
+* @type YAHOO.util.CustomEvent
+*/
+mouseOutEvent: null,
+
+/**
+* @event mouseDownEvent
+* @description Fires when the user mouses down on the menu.  Passes back the
+* DOM Event object as an argument.
+* @type YAHOO.util.CustomEvent
+*/
+mouseDownEvent: null,
+
+/**
+* @event mouseUpEvent
+* @description Fires when the user releases a mouse button while the mouse is
+* over the menu.  Passes back the DOM Event object as an argument.
+* @type YAHOO.util.CustomEvent
+*/
+mouseUpEvent: null,
+
+/**
+* @event clickEvent
+* @description Fires when the user clicks the on the menu.  Passes back the
+* DOM Event object as an argument.
+* @type YAHOO.util.CustomEvent
+*/
+clickEvent: null,
+
+/**
+* @event keyPressEvent
+* @description Fires when the user presses an alphanumeric key when one of the
+* menu's items has focus.  Passes back the DOM Event object as an argument.
+* @type YAHOO.util.CustomEvent
+*/
+keyPressEvent: null,
+
+/**
+* @event keyDownEvent
+* @description Fires when the user presses a key when one of the menu's items
+* has focus.  Passes back the DOM Event object as an argument.
+* @type YAHOO.util.CustomEvent
+*/
+keyDownEvent: null,
+
+/**
+* @event keyUpEvent
+* @description Fires when the user releases a key when one of the menu's items
+* has focus.  Passes back the DOM Event object as an argument.
+* @type YAHOO.util.CustomEvent
+*/
+keyUpEvent: null,
+
+/**
+* @event itemAddedEvent
+* @description Fires when an item is added to the menu.
+* @type YAHOO.util.CustomEvent
+*/
+itemAddedEvent: null,
+
+/**
+* @event itemRemovedEvent
+* @description Fires when an item is removed to the menu.
+* @type YAHOO.util.CustomEvent
+*/
+itemRemovedEvent: null,
+
+/**
+* @method init
+* @description The Menu class's initialization method. This method is
+* automatically called by the constructor, and sets up all DOM references
+* for pre-existing markup, and creates required markup if it is not
+* already present.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;div&#62;</code> element of the menu.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;select&#62;</code> element to be used as the data source
+* for the menu.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+* level-one-html.html#ID-22445964">HTMLDivElement</a>} p_oElement Object
+* specifying the <code>&#60;div&#62;</code> element of the menu.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+* level-one-html.html#ID-94282980">HTMLSelectElement</a>} p_oElement
+* Object specifying the <code>&#60;select&#62;</code> element to be used as
+* the data source for the menu.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the menu. See configuration class documentation for
+* more details.
+*/
+init: function(p_oElement, p_oConfig) {
+
+    this._aItemGroups = [];
+    this._aListElements = [];
+    this._aGroupTitleElements = [];
+
+    if(!this.ITEM_TYPE) {
+
+        this.ITEM_TYPE = YAHOO.widget.MenuItem;
+
+    }
+
+    var oElement;
+
+    if(typeof p_oElement == "string") {
+
+        oElement = document.getElementById(p_oElement);
+
+    }
+    else if(p_oElement.tagName) {
+
+        oElement = p_oElement;
+
+    }
+
+    if(oElement && oElement.tagName) {
+
+        switch(oElement.tagName.toUpperCase()) {
+
+            case "DIV":
+
+                this.srcElement = oElement;
+
+                if(!oElement.id) {
+
+                    oElement.setAttribute("id", Dom.generateId());
+
+                }
+
+                /*
+                    Note: we don't pass the user config in here yet
+                    because we only want it executed once, at the lowest
+                    subclass level.
+                */
+
+                YAHOO.widget.Menu.superclass.init.call(this, oElement);
+
+                this.beforeInitEvent.fire(YAHOO.widget.Menu);
+
+
+            break;
+
+            case "SELECT":
+
+                this.srcElement = oElement;
+
+
+                /*
+                    The source element is not something that we can use
+                    outright, so we need to create a new Overlay
+
+                    Note: we don't pass the user config in here yet
+                    because we only want it executed once, at the lowest
+                    subclass level.
+                */
+
+                YAHOO.widget.Menu.superclass.init.call(this, Dom.generateId());
+
+                this.beforeInitEvent.fire(YAHOO.widget.Menu);
+
+            break;
+
+        }
+
+    }
+    else {
+
+        /*
+            Note: we don't pass the user config in here yet
+            because we only want it executed once, at the lowest
+            subclass level.
+        */
+
+        YAHOO.widget.Menu.superclass.init.call(this, p_oElement);
+
+        this.beforeInitEvent.fire(YAHOO.widget.Menu);
+
+    }
+
+    if(this.element) {
+
+        var oEl = this.element;
+
+        Dom.addClass(oEl, this.CSS_CLASS_NAME);
+
+        // Subscribe to Custom Events
+
+        this.initEvent.subscribe(this._onInit, this, true);
+        this.beforeRenderEvent.subscribe(this._onBeforeRender, this, true);
+        this.renderEvent.subscribe(this._onRender, this, true);
+        this.beforeShowEvent.subscribe(this._onBeforeShow, this, true);
+        this.showEvent.subscribe(this._onShow, this, true);
+        this.beforeHideEvent.subscribe(this._onBeforeHide, this, true);
+        this.mouseOverEvent.subscribe(this._onMouseOver, this, true);
+        this.mouseOutEvent.subscribe(this._onMouseOut, this, true);
+        this.clickEvent.subscribe(this._onClick, this, true);
+        this.keyDownEvent.subscribe(this._onKeyDown, this, true);
+
+        if(p_oConfig) {
+
+            this.cfg.applyConfig(p_oConfig, true);
+
+        }
+
+        // Register the Menu instance with the MenuManager
+
+        YAHOO.widget.MenuManager.addMenu(this);
+
+
+        this.initEvent.fire(YAHOO.widget.Menu);
+
+    }
+
+},
+
+// Private methods
+
+/**
+* @method _initSubTree
+* @description Iterates the childNodes of the source element to find nodes
+* used to instantiate menu and menu items.
+* @private
+*/
+_initSubTree: function() {
+
+    var oNode;
+
+    if(this.srcElement.tagName == "DIV") {
+
+        /*
+            Populate the collection of item groups and item
+            group titles
+        */
+
+        oNode = this.body.firstChild;
+
+        var nGroup = 0;
+        var sGroupTitleTagName = this.GROUP_TITLE_TAG_NAME.toUpperCase();
+
+        do {
+
+            if(oNode && oNode.tagName) {
+
+                switch(oNode.tagName.toUpperCase()) {
+
+                    case sGroupTitleTagName:
+
+                        this._aGroupTitleElements[nGroup] = oNode;
+
+                    break;
+
+                    case "UL":
+
+                        this._aListElements[nGroup] = oNode;
+                        this._aItemGroups[nGroup] = [];
+                        nGroup++;
+
+                    break;
+
+                }
+
+            }
+
+        }
+        while((oNode = oNode.nextSibling));
+
+        /*
+            Apply the "first-of-type" class to the first UL to mimic
+            the "first-of-type" CSS3 psuedo class.
+        */
+
+        if(this._aListElements[0]) {
+
+            Dom.addClass(this._aListElements[0], "first-of-type");
+
+        }
+
+    }
+
+    oNode = null;
+
+    if(this.srcElement.tagName) {
+
+        switch(this.srcElement.tagName.toUpperCase()) {
+
+            case "DIV":
+
+                if(this._aListElements.length > 0) {
+
+
+                    var i = this._aListElements.length - 1;
+
+                    do {
+
+                        oNode = this._aListElements[i].firstChild;
+
+
+                        do {
+
+                            if(oNode && oNode.tagName) {
+
+                                switch(oNode.tagName.toUpperCase()) {
+
+                                    case "LI":
+
+
+                                        this.addItem(
+                                                new this.ITEM_TYPE(
+                                                    oNode,
+                                                    { parent: this }
+                                                ),
+                                                i
+                                            );
+
+                                    break;
+
+                                }
+
+                            }
+
+                        }
+                        while((oNode = oNode.nextSibling));
+
+                    }
+                    while(i--);
+
+                }
+
+            break;
+
+            case "SELECT":
+
+
+                oNode = this.srcElement.firstChild;
+
+                do {
+
+                    if(oNode && oNode.tagName) {
+
+                        switch(oNode.tagName.toUpperCase()) {
+
+                            case "OPTGROUP":
+                            case "OPTION":
+
+
+                                this.addItem(
+                                        new this.ITEM_TYPE(
+                                                oNode,
+                                                { parent: this }
+                                            )
+                                        );
+
+                            break;
+
+                        }
+
+                    }
+
+                }
+                while((oNode = oNode.nextSibling));
+
+            break;
+
+        }
+
+    }
+
+},
+
+/**
+* @method _getFirstEnabledItem
+* @description Returns the first enabled item in the menu.
+* @return {YAHOO.widget.MenuItem}
+* @private
+*/
+_getFirstEnabledItem: function() {
+
+    var nGroups = this._aItemGroups.length;
+    var oItem;
+    var aItemGroup;
+
+    for(var i=0; i<nGroups; i++) {
+
+        aItemGroup = this._aItemGroups[i];
+
+        if(aItemGroup) {
+
+            var nItems = aItemGroup.length;
+
+            for(var n=0; n<nItems; n++) {
+
+                oItem = aItemGroup[n];
+
+                if(
+                    !oItem.cfg.getProperty("disabled") &&
+                    oItem.element.style.display != "none"
+                ) {
+
+                    return oItem;
+
+                }
+
+                oItem = null;
+
+            }
+
+        }
+
+    }
+
+},
+
+/**
+* @method _checkPosition
+* @description Checks to make sure that the value of the "position" property
+* is one of the supported strings. Returns true if the position is supported.
+* @private
+* @param {Object} p_sPosition String specifying the position of the menu.
+* @return {Boolean}
+*/
+_checkPosition: function(p_sPosition) {
+
+    if(typeof p_sPosition == "string") {
+
+        var sPosition = p_sPosition.toLowerCase();
+
+        return ("dynamic,static".indexOf(sPosition) != -1);
+
+    }
+
+},
+
+/**
+* @method _addItemToGroup
+* @description Adds a menu item to a group.
+* @private
+* @param {Number} p_nGroupIndex Number indicating the group to which the
+* item belongs.
+* @param {YAHOO.widget.MenuItem} p_oItem Object reference for the MenuItem
+* instance to be added to the menu.
+* @param {String} p_oItem String specifying the text of the item to be added
+* to the menu.
+* @param {Object} p_oItem Object literal containing a set of menu item
+* configuration properties.
+* @param {Number} p_nItemIndex Optional. Number indicating the index at
+* which the menu item should be added.
+* @return {YAHOO.widget.MenuItem}
+*/
+_addItemToGroup: function(p_nGroupIndex, p_oItem, p_nItemIndex) {
+
+    var oItem;
+
+    if(p_oItem instanceof this.ITEM_TYPE) {
+
+        oItem = p_oItem;
+        oItem.parent = this;
+
+    }
+    else if(typeof p_oItem == "string") {
+
+        oItem = new this.ITEM_TYPE(p_oItem, { parent: this });
+
+    }
+    else if(typeof p_oItem == "object" && p_oItem.text) {
+
+        var sText = p_oItem.text;
+
+        delete p_oItem["text"];
+
+        p_oItem.parent = this;
+
+        oItem = new this.ITEM_TYPE(sText, p_oItem);
+
+    }
+
+    if(oItem) {
+
+        var nGroupIndex = typeof p_nGroupIndex == "number" ? p_nGroupIndex : 0;
+
+        var aGroup = this._getItemGroup(nGroupIndex);
+
+        var oGroupItem;
+
+        if(!aGroup) {
+
+            aGroup = this._createItemGroup(nGroupIndex);
+
+        }
+
+        if(typeof p_nItemIndex == "number") {
+
+            var bAppend = (p_nItemIndex >= aGroup.length);
+
+            if(aGroup[p_nItemIndex]) {
+
+                aGroup.splice(p_nItemIndex, 0, oItem);
+
+            }
+            else {
+
+                aGroup[p_nItemIndex] = oItem;
+
+            }
+
+            oGroupItem = aGroup[p_nItemIndex];
+
+            if(oGroupItem) {
+
+                if(
+                    bAppend &&
+                    (
+                        !oGroupItem.element.parentNode ||
+                        oGroupItem.element.parentNode.nodeType == 11
+                    )
+                ) {
+
+                    this._aListElements[nGroupIndex].appendChild(
+                        oGroupItem.element
+                    );
+
+                }
+                else {
+
+
+                    /**
+                    * Returns the next sibling of an item in an array.
+                    * @private
+                    * @param {p_aArray} Array to search.
+                    * @param {p_nStartIndex} Number indicating the index to
+                    * start searching the array.
+                    * @return {Object}
+                    */
+                    var getNextItemSibling =
+
+                        function(p_aArray, p_nStartIndex) {
+
+                            return (
+                                    p_aArray[p_nStartIndex] ||
+                                    getNextItemSibling(
+                                        p_aArray,
+                                        (p_nStartIndex+1)
+                                    )
+                                );
+
+                        };
+
+
+                    var oNextItemSibling =
+                            getNextItemSibling(aGroup, (p_nItemIndex+1));
+
+                    if(
+                        oNextItemSibling &&
+                        (
+                            !oGroupItem.element.parentNode ||
+                            oGroupItem.element.parentNode.nodeType == 11
+                        )
+                    ) {
+
+                        this._aListElements[nGroupIndex].insertBefore(
+                                oGroupItem.element,
+                                oNextItemSibling.element
+                            );
+
+                    }
+
+                }
+
+
+                oGroupItem.parent = this;
+
+                this._subscribeToItemEvents(oGroupItem);
+
+                this._configureSubmenu(oGroupItem);
+
+                this._updateItemProperties(nGroupIndex);
+
+
+                this.itemAddedEvent.fire(oGroupItem);
+
+                return oGroupItem;
+
+            }
+
+        }
+        else {
+
+            var nItemIndex = aGroup.length;
+
+            aGroup[nItemIndex] = oItem;
+
+            oGroupItem = aGroup[nItemIndex];
+
+
+            if(oGroupItem) {
+
+                if(
+                    !Dom.isAncestor(
+                        this._aListElements[nGroupIndex],
+                        oGroupItem.element
+                    )
+                ) {
+
+                    this._aListElements[nGroupIndex].appendChild(
+                        oGroupItem.element
+                    );
+
+                }
+
+                oGroupItem.element.setAttribute("groupindex", nGroupIndex);
+                oGroupItem.element.setAttribute("index", nItemIndex);
+
+                oGroupItem.parent = this;
+
+                oGroupItem.index = nItemIndex;
+                oGroupItem.groupIndex = nGroupIndex;
+
+                this._subscribeToItemEvents(oGroupItem);
+
+                this._configureSubmenu(oGroupItem);
+
+                if(nItemIndex === 0) {
+
+                    Dom.addClass(oGroupItem.element, "first-of-type");
+
+                }
+
+
+
+                this.itemAddedEvent.fire(oGroupItem);
+
+                return oGroupItem;
+
+            }
+
+        }
+
+    }
+
+},
+
+/**
+* @method _removeItemFromGroupByIndex
+* @description Removes a menu item from a group by index.  Returns the menu
+* item that was removed.
+* @private
+* @param {Number} p_nGroupIndex Number indicating the group to which the menu
+* item belongs.
+* @param {Number} p_nItemIndex Number indicating the index of the menu item
+* to be removed.
+* @return {YAHOO.widget.MenuItem}
+*/
+_removeItemFromGroupByIndex: function(p_nGroupIndex, p_nItemIndex) {
+
+    var nGroupIndex = typeof p_nGroupIndex == "number" ? p_nGroupIndex : 0;
+    var aGroup = this._getItemGroup(nGroupIndex);
+
+    if(aGroup) {
+
+        var aArray = aGroup.splice(p_nItemIndex, 1);
+        var oItem = aArray[0];
+
+        if(oItem) {
+
+            // Update the index and className properties of each member
+
+            this._updateItemProperties(nGroupIndex);
+
+            if(aGroup.length === 0) {
+
+                // Remove the UL
+
+                var oUL = this._aListElements[nGroupIndex];
+
+                if(this.body && oUL) {
+
+                    this.body.removeChild(oUL);
+
+                }
+
+                // Remove the group from the array of items
+
+                this._aItemGroups.splice(nGroupIndex, 1);
+
+
+                // Remove the UL from the array of ULs
+
+                this._aListElements.splice(nGroupIndex, 1);
+
+
+                /*
+                     Assign the "first-of-type" class to the new first UL
+                     in the collection
+                */
+
+                oUL = this._aListElements[0];
+
+                if(oUL) {
+
+                    Dom.addClass(oUL, "first-of-type");
+
+                }
+
+            }
+
+
+            this.itemRemovedEvent.fire(oItem);
+
+            // Return a reference to the item that was removed
+
+            return oItem;
+
+        }
+
+    }
+
+},
+
+/**
+* @method _removeItemFromGroupByValue
+* @description Removes a menu item from a group by reference.  Returns the
+* menu item that was removed.
+* @private
+* @param {Number} p_nGroupIndex Number indicating the group to which the
+* menu item belongs.
+* @param {YAHOO.widget.MenuItem} p_oItem Object reference for the MenuItem
+* instance to be removed.
+* @return {YAHOO.widget.MenuItem}
+*/
+_removeItemFromGroupByValue: function(p_nGroupIndex, p_oItem) {
+
+    var aGroup = this._getItemGroup(p_nGroupIndex);
+
+    if(aGroup) {
+
+        var nItems = aGroup.length;
+        var nItemIndex = -1;
+
+        if(nItems > 0) {
+
+            var i = nItems-1;
+
+            do {
+
+                if(aGroup[i] == p_oItem) {
+
+                    nItemIndex = i;
+                    break;
+
+                }
+
+            }
+            while(i--);
+
+            if(nItemIndex > -1) {
+
+                return this._removeItemFromGroupByIndex(
+                            p_nGroupIndex,
+                            nItemIndex
+                        );
+
+            }
+
+        }
+
+    }
+
+},
+
+/**
+* @method _updateItemProperties
+* @description Updates the "index," "groupindex," and "className" properties
+* of the menu items in the specified group.
+* @private
+* @param {Number} p_nGroupIndex Number indicating the group of items to update.
+*/
+_updateItemProperties: function(p_nGroupIndex) {
+
+    var aGroup = this._getItemGroup(p_nGroupIndex);
+    var nItems = aGroup.length;
+
+    if(nItems > 0) {
+
+        var i = nItems - 1;
+        var oItem;
+        var oLI;
+
+        // Update the index and className properties of each member
+
+        do {
+
+            oItem = aGroup[i];
+
+            if(oItem) {
+
+                oLI = oItem.element;
+
+                oItem.index = i;
+                oItem.groupIndex = p_nGroupIndex;
+
+                oLI.setAttribute("groupindex", p_nGroupIndex);
+                oLI.setAttribute("index", i);
+
+                Dom.removeClass(oLI, "first-of-type");
+
+            }
+
+        }
+        while(i--);
+
+        if(oLI) {
+
+            Dom.addClass(oLI, "first-of-type");
+
+        }
+
+    }
+
+},
+
+/**
+* @method _createItemGroup
+* @description Creates a new menu item group (array) and its associated
+* <code>&#60;ul&#62;</code> element. Returns an aray of menu item groups.
+* @private
+* @param {Number} p_nIndex Number indicating the group to create.
+* @return {Array}
+*/
+_createItemGroup: function(p_nIndex) {
+
+    if(!this._aItemGroups[p_nIndex]) {
+
+        this._aItemGroups[p_nIndex] = [];
+
+        var oUL = document.createElement("ul");
+
+        this._aListElements[p_nIndex] = oUL;
+
+        return this._aItemGroups[p_nIndex];
+
+    }
+
+},
+
+/**
+* @method _getItemGroup
+* @description Returns the menu item group at the specified index.
+* @private
+* @param {Number} p_nIndex Number indicating the index of the menu item group
+* to be retrieved.
+* @return {Array}
+*/
+_getItemGroup: function(p_nIndex) {
+
+    var nIndex = ((typeof p_nIndex == "number") ? p_nIndex : 0);
+
+    return this._aItemGroups[nIndex];
+
+},
+
+/**
+* @method _configureSubmenu
+* @description Subscribes the menu item's submenu to its parent menu's events.
+* @private
+* @param {YAHOO.widget.MenuItem} p_oItem Object reference for the MenuItem
+* instance with the submenu to be configured.
+*/
+_configureSubmenu: function(p_oItem) {
+
+    var oSubmenu = p_oItem.cfg.getProperty("submenu");
+
+    if(oSubmenu) {
+
+        /*
+            Listen for configuration changes to the parent menu
+            so they they can be applied to the submenu.
+        */
+
+        this.cfg.configChangedEvent.subscribe(
+                this._onParentMenuConfigChange,
+                oSubmenu,
+                true
+            );
+
+        this.renderEvent.subscribe(
+                this._onParentMenuRender,
+                oSubmenu,
+                true
+            );
+
+        oSubmenu.beforeShowEvent.subscribe(
+                this._onSubmenuBeforeShow,
+                oSubmenu,
+                true
+            );
+
+        oSubmenu.showEvent.subscribe(
+                this._onSubmenuShow,
+                oSubmenu,
+                true
+            );
+
+        oSubmenu.hideEvent.subscribe(
+                this._onSubmenuHide,
+                oSubmenu,
+                true
+            );
+
+    }
+
+},
+
+/**
+* @method _subscribeToItemEvents
+* @description Subscribes a menu to a menu item's event.
+* @private
+* @param {YAHOO.widget.MenuItem} p_oItem Object reference for the MenuItem
+* instance whose events should be subscribed to.
+*/
+_subscribeToItemEvents: function(p_oItem) {
+
+    p_oItem.focusEvent.subscribe(this._onMenuItemFocus, p_oItem, this);
+
+    p_oItem.blurEvent.subscribe(this._onMenuItemBlur, this, true);
+
+    p_oItem.cfg.configChangedEvent.subscribe(
+        this._onMenuItemConfigChange,
+        p_oItem,
+        this
+    );
+
+},
+
+/**
+* @method _getOffsetWidth
+* @description Returns the offset width of the menu's
+* <code>&#60;div&#62;</code> element.
+* @private
+*/
+_getOffsetWidth: function() {
+
+    var oClone = this.element.cloneNode(true);
+
+    Dom.setStyle(oClone, "width", "");
+
+    document.body.appendChild(oClone);
+
+    var sWidth = oClone.offsetWidth;
+
+    document.body.removeChild(oClone);
+
+    return sWidth;
+
+},
+
+/**
+* @method _cancelHideDelay
+* @description Cancels the call to "hideMenu."
+* @private
+*/
+_cancelHideDelay: function() {
+
+    var oRoot = this.getRoot();
+
+    if(oRoot._nHideDelayId) {
+
+        window.clearTimeout(oRoot._nHideDelayId);
+
+    }
+
+},
+
+/**
+* @method _execHideDelay
+* @description Hides the menu after the number of milliseconds specified by
+* the "hidedelay" configuration property.
+* @private
+*/
+_execHideDelay: function() {
+
+    this._cancelHideDelay();
+
+    var oRoot = this.getRoot();
+    var me = this;
+
+    var hideMenu = function() {
+
+        if(oRoot.activeItem) {
+
+            oRoot.clearActiveItem();
+
+        }
+
+        if(oRoot == me && me.cfg.getProperty("position") == "dynamic") {
+
+            me.hide();
+
+        }
+
+    };
+
+    oRoot._nHideDelayId =
+        window.setTimeout(hideMenu, oRoot.cfg.getProperty("hidedelay"));
+
+},
+
+/**
+* @method _cancelShowDelay
+* @description Cancels the call to the "showMenu."
+* @private
+*/
+_cancelShowDelay: function() {
+
+    var oRoot = this.getRoot();
+
+    if(oRoot._nShowDelayId) {
+
+        window.clearTimeout(oRoot._nShowDelayId);
+
+    }
+
+},
+
+/**
+* @method _execShowDelay
+* @description Shows the menu after the number of milliseconds specified by
+* the "showdelay" configuration property have ellapsed.
+* @private
+* @param {YAHOO.widget.Menu} p_oMenu Object specifying the menu that should
+* be made visible.
+*/
+_execShowDelay: function(p_oMenu) {
+
+    this._cancelShowDelay();
+
+    var oRoot = this.getRoot();
+
+    var showMenu = function() {
+
+        p_oMenu.show();
+
+    };
+
+    oRoot._nShowDelayId =
+        window.setTimeout(showMenu, oRoot.cfg.getProperty("showdelay"));
+
+},
+
+// Protected methods
+
+/**
+* @method _onMouseOver
+* @description "mouseover" event handler for the menu.
+* @protected
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+_onMouseOver: function(p_sType, p_aArgs, p_oMenu) {
+
+    var oEvent = p_aArgs[0];
+    var oItem = p_aArgs[1];
+    var oTarget = Event.getTarget(oEvent);
+
+    if(
+        !this._bHandledMouseOverEvent &&
+        (oTarget == this.element || Dom.isAncestor(this.element, oTarget))
+    ) {
+
+        // MENU  MOUSEOVER LOGIC HERE
+
+        this.clearActiveItem();
+
+        this._bHandledMouseOverEvent = true;
+        this._bHandledMouseOutEvent = false;
+
+    }
+
+    if(
+        oItem && !oItem.handledMouseOverEvent &&
+        (oTarget == oItem.element || Dom.isAncestor(oItem.element, oTarget))
+    ) {
+
+        var oItemCfg = oItem.cfg;
+
+        // Select and focus the current menu item
+
+        oItemCfg.setProperty("selected", true);
+        oItem.focus();
+
+        if(this.cfg.getProperty("autosubmenudisplay")) {
+
+            // Show the submenu this menu item
+
+            var oSubmenu = oItemCfg.getProperty("submenu");
+
+            if(oSubmenu) {
+
+                if(this.cfg.getProperty("showdelay") > 0) {
+
+                    this._execShowDelay(oSubmenu);
+
+                }
+                else {
+
+                    oSubmenu.show();
+
+                }
+
+            }
+
+        }
+
+        oItem.handledMouseOverEvent = true;
+        oItem.handledMouseOutEvent = false;
+
+    }
+
+},
+
+/**
+* @method _onMouseOut
+* @description "mouseout" event handler for the menu.
+* @protected
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+_onMouseOut: function(p_sType, p_aArgs, p_oMenu) {
+
+    var oEvent = p_aArgs[0];
+    var oItem = p_aArgs[1];
+    var oRelatedTarget = Event.getRelatedTarget(oEvent);
+    var bMovingToSubmenu = false;
+
+    if(oItem) {
+
+        var oItemCfg = oItem.cfg;
+        var oSubmenu = oItemCfg.getProperty("submenu");
+
+        if(
+            oSubmenu &&
+            (
+                oRelatedTarget == oSubmenu.element ||
+                Dom.isAncestor(oSubmenu.element, oRelatedTarget)
+            )
+        ) {
+
+            bMovingToSubmenu = true;
+
+        }
+
+        if(
+            !oItem.handledMouseOutEvent &&
+            (
+                (
+                    oRelatedTarget != oItem.element &&
+                    !Dom.isAncestor(oItem.element, oRelatedTarget)
+                ) || bMovingToSubmenu
+            )
+        ) {
+
+            if(this.cfg.getProperty("showdelay") > 0) {
+
+                this._cancelShowDelay();
+
+            }
+
+            if(!bMovingToSubmenu) {
+
+                oItemCfg.setProperty("selected", false);
+
+            }
+
+            if(this.cfg.getProperty("autosubmenudisplay")) {
+
+                if(oSubmenu) {
+
+                    if(
+                        !(
+                            oRelatedTarget == oSubmenu.element ||
+                            YAHOO.util.Dom.isAncestor(
+                                oSubmenu.element,
+                                oRelatedTarget
+                            )
+                        )
+                    ) {
+
+                        oSubmenu.hide();
+
+                    }
+
+                }
+
+            }
+
+            oItem.handledMouseOutEvent = true;
+            oItem.handledMouseOverEvent = false;
+
+        }
+
+    }
+
+    if(
+        !this._bHandledMouseOutEvent &&
+        (
+            (
+                oRelatedTarget != this.element &&
+                !Dom.isAncestor(this.element, oRelatedTarget)
+            )
+            || bMovingToSubmenu
+        )
+    ) {
+
+        this._bHandledMouseOutEvent = true;
+        this._bHandledMouseOverEvent = false;
+
+    }
+
+},
+
+/**
+* @method _onClick
+* @description "click" event handler for the menu.
+* @protected
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+_onClick: function(p_sType, p_aArgs, p_oMenu) {
+
+    var oEvent = p_aArgs[0];
+    var oItem = p_aArgs[1];
+    var oTarget = Event.getTarget(oEvent);
+
+    if(oItem) {
+
+        var oItemCfg = oItem.cfg;
+        var oSubmenu = oItemCfg.getProperty("submenu");
+
+        /*
+            ACCESSIBILITY FEATURE FOR SCREEN READERS:
+            Expand/collapse the submenu when the user clicks
+            on the submenu indicator image.
+        */
+
+        if(oTarget == oItem.submenuIndicator && oSubmenu) {
+
+            if(oSubmenu.cfg.getProperty("visible")) {
+
+                oSubmenu.hide();
+
+            }
+            else {
+
+                this.clearActiveItem();
+
+                this.activeItem = oItem;
+
+                oItem.cfg.setProperty("selected", true);
+
+                oSubmenu.show();
+
+            }
+
+        }
+        else {
+
+            var sURL = oItemCfg.getProperty("url");
+            var bCurrentPageURL = (sURL.substr((sURL.length-1),1) == "#");
+            var sTarget = oItemCfg.getProperty("target");
+            var bHasTarget = (sTarget && sTarget.length > 0);
+
+            /*
+                Prevent the browser from following links
+                equal to "#"
+            */
+
+            if(
+                oTarget.tagName.toUpperCase() == "A" &&
+                bCurrentPageURL && !bHasTarget
+            ) {
+
+                Event.preventDefault(oEvent);
+
+            }
+
+            if(
+                oTarget.tagName.toUpperCase() != "A" &&
+                !bCurrentPageURL && !bHasTarget
+            ) {
+
+                /*
+                    Follow the URL of the item regardless of
+                    whether or not the user clicked specifically
+                    on the anchor element.
+                */
+
+                document.location = sURL;
+
+            }
+
+            /*
+                If the item doesn't navigate to a URL and it doesn't have
+                a submenu, then collapse the menu tree.
+            */
+
+            if(bCurrentPageURL && !oSubmenu) {
+
+                var oRoot = this.getRoot();
+
+                if(oRoot.cfg.getProperty("position") == "static") {
+
+                    oRoot.clearActiveItem();
+
+                }
+                else {
+
+                    oRoot.hide();
+
+                }
+
+            }
+
+        }
+
+    }
+
+},
+
+/**
+* @method _onKeyDown
+* @description "keydown" event handler for the menu.
+* @protected
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+_onKeyDown: function(p_sType, p_aArgs, p_oMenu) {
+
+    var oEvent = p_aArgs[0];
+    var oItem = p_aArgs[1];
+    var oSubmenu;
+
+    if(oItem) {
+
+        var oItemCfg = oItem.cfg;
+        var oParentItem = this.parent;
+        var oRoot;
+        var oNextItem;
+
+        switch(oEvent.keyCode) {
+
+            case 38:    // Up arrow
+            case 40:    // Down arrow
+
+                if(
+                    oItem == this.activeItem &&
+                    !oItemCfg.getProperty("selected")
+                ) {
+
+                    oItemCfg.setProperty("selected", true);
+
+                }
+                else {
+
+                    oNextItem = (oEvent.keyCode == 38) ?
+                        oItem.getPreviousEnabledSibling() :
+                        oItem.getNextEnabledSibling();
+
+                    if(oNextItem) {
+
+                        this.clearActiveItem();
+
+                        oNextItem.cfg.setProperty("selected", true);
+                        oNextItem.focus();
+
+                    }
+
+                }
+
+                Event.preventDefault(oEvent);
+
+            break;
+
+
+            case 39:    // Right arrow
+
+                oSubmenu = oItemCfg.getProperty("submenu");
+
+                if(oSubmenu) {
+
+                    if(!oItemCfg.getProperty("selected")) {
+
+                        oItemCfg.setProperty("selected", true);
+
+                    }
+
+                    oSubmenu.show();
+
+                    oSubmenu.setInitialSelection();
+
+                }
+                else {
+
+                    oRoot = this.getRoot();
+
+                    if(oRoot instanceof YAHOO.widget.MenuBar) {
+
+                        oNextItem = oRoot.activeItem.getNextEnabledSibling();
+
+                        if(oNextItem) {
+
+                            oRoot.clearActiveItem();
+
+                            oNextItem.cfg.setProperty("selected", true);
+
+                            oSubmenu = oNextItem.cfg.getProperty("submenu");
+
+                            if(oSubmenu) {
+
+                                oSubmenu.show();
+
+                            }
+
+                            oNextItem.focus();
+
+                        }
+
+                    }
+
+                }
+
+
+                Event.preventDefault(oEvent);
+
+            break;
+
+
+            case 37:    // Left arrow
+
+                if(oParentItem) {
+
+                    var oParentMenu = oParentItem.parent;
+
+                    if(oParentMenu instanceof YAHOO.widget.MenuBar) {
+
+                        oNextItem =
+                            oParentMenu.activeItem.getPreviousEnabledSibling();
+
+                        if(oNextItem) {
+
+                            oParentMenu.clearActiveItem();
+
+                            oNextItem.cfg.setProperty("selected", true);
+
+                            oSubmenu = oNextItem.cfg.getProperty("submenu");
+
+                            if(oSubmenu) {
+
+                                oSubmenu.show();
+
+                            }
+
+                            oNextItem.focus();
+
+                        }
+
+                    }
+                    else {
+
+                        this.hide();
+
+                        oParentItem.focus();
+
+                    }
+
+                }
+
+                Event.preventDefault(oEvent);
+
+            break;
+
+        }
+
+    }
+
+    if(oEvent.keyCode == 27) { // Esc key
+
+        if(this.cfg.getProperty("position") == "dynamic") {
+
+            this.hide();
+
+            if(this.parent) {
+
+                this.parent.focus();
+
+            }
+
+        }
+        else if(this.activeItem) {
+
+            oSubmenu = this.activeItem.cfg.getProperty("submenu");
+
+            if(oSubmenu && oSubmenu.cfg.getProperty("visible")) {
+
+                oSubmenu.hide();
+                this.activeItem.focus();
+
+            }
+            else {
+
+                this.activeItem.cfg.setProperty("selected", false);
+                this.activeItem.blur();
+
+            }
+
+        }
+
+        Event.preventDefault(oEvent);
+
+    }
+
+},
+
+// Private methods
+
+/**
+* @method _onInit
+* @description "init" event handler for the menu.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+_onInit: function(p_sType, p_aArgs, p_oMenu) {
+
+    if(
+        (
+            (this.parent && !this.lazyLoad) ||
+            (!this.parent && this.cfg.getProperty("position") == "static") ||
+            (
+                !this.parent &&
+                !this.lazyLoad &&
+                this.cfg.getProperty("position") == "dynamic"
+            )
+        ) &&
+        this.getItemGroups().length === 0
+    ) {
+
+        if(this.srcElement) {
+
+            this._initSubTree();
+
+        }
+
+        if(this.itemData) {
+
+            this.addItems(this.itemData);
+
+        }
+
+    }
+    else if(this.lazyLoad) {
+
+        this.cfg.fireQueue();
+
+    }
+
+},
+
+/**
+* @method _onBeforeRender
+* @description "beforerender" event handler for the menu.  Appends all of the
+* <code>&#60;ul&#62;</code>, <code>&#60;li&#62;</code> and their accompanying
+* title elements to the body element of the menu.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+_onBeforeRender: function(p_sType, p_aArgs, p_oMenu) {
+
+    var oConfig = this.cfg;
+    var oEl = this.element;
+    var nListElements = this._aListElements.length;
+
+    if(nListElements > 0) {
+
+        var i = 0;
+        var bFirstList = true;
+        var oUL;
+        var oGroupTitle;
+
+        do {
+
+            oUL = this._aListElements[i];
+
+            if(oUL) {
+
+                if(bFirstList) {
+
+                    Dom.addClass(oUL, "first-of-type");
+                    bFirstList = false;
+
+                }
+
+                if(!Dom.isAncestor(oEl, oUL)) {
+
+                    this.appendToBody(oUL);
+
+                }
+
+                oGroupTitle = this._aGroupTitleElements[i];
+
+                if(oGroupTitle) {
+
+                    if(!Dom.isAncestor(oEl, oGroupTitle)) {
+
+                        oUL.parentNode.insertBefore(oGroupTitle, oUL);
+
+                    }
+
+                    Dom.addClass(oUL, "hastitle");
+
+                }
+
+            }
+
+            i++;
+
+        }
+        while(i < nListElements);
+
+    }
+
+},
+
+/**
+* @method _onRender
+* @description "render" event handler for the menu.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+_onRender: function(p_sType, p_aArgs, p_oMenu) {
+
+    if(this.cfg.getProperty("position") == "dynamic") {
+
+        var sWidth =
+            this.element.parentNode.tagName.toUpperCase() == "BODY" ?
+            this.element.offsetWidth : this._getOffsetWidth();
+
+        this.cfg.setProperty("width", (sWidth + "px"));
+
+    }
+
+},
+
+/**
+* @method _onBeforeShow
+* @description "beforeshow" event handler for the menu.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+_onBeforeShow: function(p_sType, p_aArgs, p_oMenu) {
+
+    if(this.lazyLoad && this.getItemGroups().length === 0) {
+
+        if(this.srcElement) {
+
+            this._initSubTree();
+
+        }
+
+        if(this.itemData) {
+
+            if(
+                this.parent && this.parent.parent &&
+                this.parent.parent.srcElement &&
+                this.parent.parent.srcElement.tagName.toUpperCase() == "SELECT"
+            ) {
+
+                var nOptions = this.itemData.length;
+
+                for(var n=0; n<nOptions; n++) {
+
+                    if(this.itemData[n].tagName) {
+
+                        this.addItem((new this.ITEM_TYPE(this.itemData[n])));
+
+                    }
+
+                }
+
+            }
+            else {
+
+                this.addItems(this.itemData);
+
+            }
+
+        }
+
+        if(this.srcElement) {
+
+            this.render();
+
+        }
+        else {
+
+            if(this.parent) {
+
+                this.render(this.parent.element);
+
+            }
+            else {
+
+                this.render(this.cfg.getProperty("container"));
+
+            }
+
+        }
+
+    }
+
+},
+
+/**
+* @method _onShow
+* @description "show" event handler for the menu.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that fired
+* the event.
+*/
+_onShow: function(p_sType, p_aArgs, p_oMenu) {
+
+    this.setInitialFocus();
+
+    var oParent = this.parent;
+
+    if(oParent) {
+
+        var oParentMenu = oParent.parent;
+
+        var aParentAlignment = oParentMenu.cfg.getProperty("submenualignment");
+        var aAlignment = this.cfg.getProperty("submenualignment");
+
+        if(
+            (aParentAlignment[0] != aAlignment[0]) &&
+            (aParentAlignment[1] != aAlignment[1])
+        ) {
+
+            this.cfg.setProperty(
+                "submenualignment",
+                [ aParentAlignment[0], aParentAlignment[1] ]
+            );
+
+        }
+
+        if(
+            !oParentMenu.cfg.getProperty("autosubmenudisplay") &&
+            oParentMenu.cfg.getProperty("position") == "static"
+        ) {
+
+            oParentMenu.cfg.setProperty("autosubmenudisplay", true);
+
+            /**
+            * "click" event handler for the document
+            * @private
+            * @param {Event} p_oEvent Object reference for the DOM event object
+            * passed back by the event utility (YAHOO.util.Event).
+            */
+            var disableAutoSubmenuDisplay = function(p_oEvent) {
+
+                if(
+                    p_oEvent.type == "mousedown" ||
+                    (p_oEvent.type == "keydown" && p_oEvent.keyCode == 27)
+                ) {
+
+                    /*
+                        Set the "autosubmenudisplay" to "false" if the user
+                        clicks outside the menu bar.
+                    */
+
+                    var oTarget = Event.getTarget(p_oEvent);
+
+                    if(
+                        oTarget != oParentMenu.element ||
+                        !YAHOO.util.Dom.isAncestor(oParentMenu.element, oTarget)
+                    ) {
+
+                        oParentMenu.cfg.setProperty(
+                            "autosubmenudisplay",
+                            false
+                        );
+
+                        Event.removeListener(
+                                document,
+                                "mousedown",
+                                disableAutoSubmenuDisplay
+                            );
+
+                        Event.removeListener(
+                                document,
+                                "keydown",
+                                disableAutoSubmenuDisplay
+                            );
+
+                    }
+
+                }
+
+            };
+
+            Event.addListener(document, "mousedown", disableAutoSubmenuDisplay);
+            Event.addListener(document, "keydown", disableAutoSubmenuDisplay);
+
+        }
+
+    }
+
+},
+
+/**
+* @method _onBeforeHide
+* @description "beforehide" event handler for the menu.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that fired
+* the event.
+*/
+_onBeforeHide: function(p_sType, p_aArgs, p_oMenu) {
+
+    this.clearActiveItem(true);
+
+},
+
+/**
+* @method _onParentMenuConfigChange
+* @description "configchange" event handler for a submenu.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oSubmenu Object representing the submenu that
+* subscribed to the event.
+*/
+_onParentMenuConfigChange: function(p_sType, p_aArgs, p_oSubmenu) {
+
+    var sPropertyName = p_aArgs[0][0];
+    var oPropertyValue = p_aArgs[0][1];
+
+    switch(sPropertyName) {
+
+        case "iframe":
+        case "constraintoviewport":
+        case "hidedelay":
+        case "showdelay":
+        case "clicktohide":
+        case "effect":
+
+            p_oSubmenu.cfg.setProperty(sPropertyName, oPropertyValue);
+
+        break;
+
+    }
+
+},
+
+/**
+* @method _onParentMenuRender
+* @description "render" event handler for a submenu.  Renders a
+* submenu in response to the firing of its parent's "render" event.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oSubmenu Object representing the submenu that
+* subscribed to the event.
+*/
+_onParentMenuRender: function(p_sType, p_aArgs, p_oSubmenu) {
+
+    /*
+        Set the "constraintoviewport" configuration
+        property to match the parent Menu
+    */
+
+    var oParentMenu = p_oSubmenu.parent.parent;
+
+    var oConfig = {
+
+            constraintoviewport:
+                oParentMenu.cfg.getProperty("constraintoviewport"),
+
+            xy: [0,0],
+
+            clicktohide:
+                oParentMenu.cfg.getProperty("clicktohide"),
+
+            effect:
+                oParentMenu.cfg.getProperty("effect")
+
+        };
+
+    var nShowDelay = oParentMenu.cfg.getProperty("showdelay");
+
+    if(nShowDelay > 0) {
+
+        oConfig.showdelay = nShowDelay;
+
+    }
+
+    var nHideDelay = oParentMenu.cfg.getProperty("hidedelay");
+
+    if(nHideDelay > 0) {
+
+        oConfig.hidedelay = nHideDelay;
+
+    }
+
+    /*
+        Only sync the "iframe" configuration property if the parent
+        menu's "position" configuration is the same.
+    */
+
+    if(
+        this.cfg.getProperty("position") ==
+        oParentMenu.cfg.getProperty("position")
+    ) {
+
+        oConfig.iframe = oParentMenu.cfg.getProperty("iframe");
+
+    }
+
+
+    p_oSubmenu.cfg.applyConfig(oConfig);
+
+    if(!this.lazyLoad) {
+
+        if(Dom.inDocument(this.element)) {
+
+            this.render();
+
+        }
+        else {
+
+            this.render(this.parent.element);
+
+        }
+
+    }
+
+},
+
+/**
+* @method _onSubmenuBeforeShow
+* @description "beforeshow" event handler for a submenu.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oSubmenu Object representing the submenu that
+* subscribed to the event.
+*/
+_onSubmenuBeforeShow: function(p_sType, p_aArgs, p_oSubmenu) {
+
+    var oParent = this.parent;
+    var aAlignment = oParent.parent.cfg.getProperty("submenualignment");
+
+    this.cfg.setProperty(
+        "context",
+        [oParent.element, aAlignment[0], aAlignment[1]]
+    );
+
+    oParent.submenuIndicator.alt = oParent.EXPANDED_SUBMENU_INDICATOR_ALT_TEXT;
+
+},
+
+/**
+* @method _onSubmenuShow
+* @description "show" event handler for a submenu.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oSubmenu Object representing the submenu that
+* subscribed to the event.
+*/
+_onSubmenuShow: function(p_sType, p_aArgs, p_oSubmenu) {
+
+    var oParent = this.parent;
+
+    oParent.submenuIndicator.alt = oParent.EXPANDED_SUBMENU_INDICATOR_ALT_TEXT;
+
+},
+
+/**
+* @method _onSubmenuHide
+* @description "hide" Custom Event handler for a submenu.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oSubmenu Object representing the submenu that
+* subscribed to the event.
+*/
+_onSubmenuHide: function(p_sType, p_aArgs, p_oSubmenu) {
+
+    var oParent = this.parent;
+
+    oParent.submenuIndicator.alt = oParent.COLLAPSED_SUBMENU_INDICATOR_ALT_TEXT;
+
+},
+
+/**
+* @method _onMenuItemFocus
+* @description "focus" event handler for the menu's items.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+* that fired the event.
+*/
+_onMenuItemFocus: function(p_sType, p_aArgs, p_oItem) {
+
+    this.activeItem = p_oItem;
+
+},
+
+/**
+* @method _onMenuItemBlur
+* @description "blur" event handler for the menu's items.
+* @private
+* @param {String} p_sType String representing the name of the event
+* that was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+*/
+_onMenuItemBlur: function(p_sType, p_aArgs) {
+
+    this.activeItem = null;
+
+},
+
+/**
+* @method _onMenuItemConfigChange
+* @description "configchange" event handler for the menu's items.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+* that fired the event.
+*/
+_onMenuItemConfigChange: function(p_sType, p_aArgs, p_oItem) {
+
+    var sProperty = p_aArgs[0][0];
+
+    switch(sProperty) {
+
+        case "submenu":
+
+            var oSubmenu = p_aArgs[0][1];
+
+            if(oSubmenu) {
+
+                this._configureSubmenu(p_oItem);
+
+            }
+
+        break;
+
+        case "text":
+        case "helptext":
+
+            /*
+                A change to an item's "text" or "helptext"
+                configuration properties requires the width of the parent
+                menu to be recalculated.
+            */
+
+            if(this.element.style.width) {
+
+                var sWidth = this._getOffsetWidth() + "px";
+
+                Dom.setStyle(this.element, "width", sWidth);
+
+            }
+
+        break;
+
+    }
+
+},
+
+// Public event handlers for configuration properties
+
+/**
+* @method enforceConstraints
+* @description The default event handler executed when the moveEvent is fired,
+* if the "constraintoviewport" configuration property is set to true.
+* @param {String} type The name of the event that was fired.
+* @param {Array} args Collection of arguments sent when the
+* event was fired.
+* @param {Array} obj Array containing the current Menu instance
+* and the item that fired the event.
+*/
+enforceConstraints: function(type, args, obj) {
+
+    var oConfig = this.cfg;
+
+    var pos = args[0];
+
+    var x = pos[0];
+    var y = pos[1];
+
+    var bod = document.getElementsByTagName('body')[0];
+    var htm = document.getElementsByTagName('html')[0];
+
+    var bodyOverflow = Dom.getStyle(bod, "overflow");
+    var htmOverflow = Dom.getStyle(htm, "overflow");
+
+    var offsetHeight = this.element.offsetHeight;
+    var offsetWidth = this.element.offsetWidth;
+
+    var viewPortWidth = Dom.getClientWidth();
+    var viewPortHeight = Dom.getClientHeight();
+
+    var scrollX = window.scrollX || document.body.scrollLeft;
+    var scrollY = window.scrollY || document.body.scrollTop;
+
+    var topConstraint = scrollY + 10;
+    var leftConstraint = scrollX + 10;
+    var bottomConstraint = scrollY + viewPortHeight - offsetHeight - 10;
+    var rightConstraint = scrollX + viewPortWidth - offsetWidth - 10;
+
+    var aContext = oConfig.getProperty("context");
+    var oContextElement = aContext ? aContext[0] : null;
+
+
+    if (x < 10) {
+
+        x = leftConstraint;
+
+    } else if ((x + offsetWidth) > viewPortWidth) {
+
+        if(
+            oContextElement &&
+            ((x - oContextElement.offsetWidth) > offsetWidth)
+        ) {
+
+            x = (x - (oContextElement.offsetWidth + offsetWidth));
+
+        }
+        else {
+
+            x = rightConstraint;
+
+        }
+
+    }
+
+    if (y < 10) {
+
+        y = topConstraint;
+
+    } else if (y > bottomConstraint) {
+
+        if(oContextElement && (y > offsetHeight)) {
+
+            y = ((y + oContextElement.offsetHeight) - offsetHeight);
+
+        }
+        else {
+
+            y = bottomConstraint;
+
+        }
+
+    }
+
+    oConfig.setProperty("x", x, true);
+    oConfig.setProperty("y", y, true);
+
+},
+
+/**
+* @method configVisible
+* @description Event handler for when the "visible" configuration property
+* the menu changes.
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+configVisible: function(p_sType, p_aArgs, p_oMenu) {
+
+    if(this.cfg.getProperty("position") == "dynamic") {
+
+        YAHOO.widget.Menu.superclass.configVisible.call(
+            this,
+            p_sType,
+            p_aArgs,
+            p_oMenu
+        );
+
+    }
+    else {
+
+        var bVisible = p_aArgs[0];
+    	var sDisplay = Dom.getStyle(this.element, "display");
+
+        if(bVisible) {
+
+            if(sDisplay != "block") {
+                this.beforeShowEvent.fire();
+                Dom.setStyle(this.element, "display", "block");
+                this.showEvent.fire();
+            }
+
+        }
+        else {
+
+			if(sDisplay == "block") {
+				this.beforeHideEvent.fire();
+				Dom.setStyle(this.element, "display", "none");
+				this.hideEvent.fire();
+			}
+
+        }
+
+    }
+
+},
+
+/**
+* @method configPosition
+* @description Event handler for when the "position" configuration property
+* of the menu changes.
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+configPosition: function(p_sType, p_aArgs, p_oMenu) {
+
+    var sCSSPosition = p_aArgs[0] == "static" ? "static" : "absolute";
+    var oCfg = this.cfg;
+
+    Dom.setStyle(this.element, "position", sCSSPosition);
+
+    if(sCSSPosition == "static") {
+
+        /*
+            Remove the iframe for statically positioned menus since it will
+            intercept mouse events.
+        */
+
+        oCfg.setProperty("iframe", false);
+
+        // Statically positioned menus are visible by default
+
+        Dom.setStyle(this.element, "display", "block");
+
+        oCfg.setProperty("visible", true);
+
+    }
+    else {
+
+        /*
+            Even though the "visible" property is queued to
+            "false" by default, we need to set the "visibility" property to
+            "hidden" since Overlay's "configVisible" implementation checks the
+            element's "visibility" style property before deciding whether
+            or not to show an Overlay instance.
+        */
+
+        Dom.setStyle(this.element, "visibility", "hidden");
+
+    }
+
+    if(sCSSPosition == "absolute") {
+
+        var nZIndex = oCfg.getProperty("zindex");
+
+        if(!nZIndex || nZIndex === 0) {
+
+            nZIndex = this.parent ?
+                (this.parent.parent.cfg.getProperty("zindex") + 1) : 1;
+
+            oCfg.setProperty("zindex", nZIndex);
+
+        }
+
+    }
+
+},
+
+/**
+* @method configIframe
+* @description Event handler for when the "iframe" configuration property of
+* the menu changes.
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+configIframe: function(p_sType, p_aArgs, p_oMenu) {
+
+    if(this.cfg.getProperty("position") == "dynamic") {
+
+        YAHOO.widget.Menu.superclass.configIframe.call(
+            this,
+            p_sType,
+            p_aArgs,
+            p_oMenu
+        );
+
+    }
+
+},
+
+/**
+* @method configHideDelay
+* @description Event handler for when the "hidedelay" configuration property
+* of the menu changes.
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+configHideDelay: function(p_sType, p_aArgs, p_oMenu) {
+
+    var nHideDelay = p_aArgs[0];
+    var oMouseOutEvent = this.mouseOutEvent;
+    var oMouseOverEvent = this.mouseOverEvent;
+    var oKeyDownEvent = this.keyDownEvent;
+
+    if(nHideDelay > 0) {
+
+        /*
+            Only assign event handlers once. This way the user change
+            the value for the hidedelay as many times as they want.
+        */
+
+        if(!this._hideDelayEventHandlersAssigned) {
+
+            oMouseOutEvent.subscribe(this._execHideDelay, true);
+            oMouseOverEvent.subscribe(this._cancelHideDelay, this, true);
+            oKeyDownEvent.subscribe(this._cancelHideDelay, this, true);
+
+            this._hideDelayEventHandlersAssigned = true;
+
+        }
+
+    }
+    else {
+
+        oMouseOutEvent.unsubscribe(this._execHideDelay, this);
+        oMouseOverEvent.unsubscribe(this._cancelHideDelay, this);
+        oKeyDownEvent.unsubscribe(this._cancelHideDelay, this);
+
+        this._hideDelayEventHandlersAssigned = false;
+
+    }
+
+},
+
+/**
+* @method configContainer
+* @description Event handler for when the "container" configuration property
+of the menu changes.
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.Menu} p_oMenu Object representing the menu that
+* fired the event.
+*/
+configContainer: function(p_sType, p_aArgs, p_oMenu) {
+
+	var oElement = p_aArgs[0];
+
+	if(typeof oElement == 'string') {
+
+        this.cfg.setProperty(
+                "container",
+                document.getElementById(oElement),
+                true
+            );
+
+	}
+
+},
+
+// Public methods
+
+/**
+* Event handler called when the resize monitor element's "resize" evet is fired.
+*/
+onDomResize: function(e, obj) {
+
+    if(!this._handleResize) {
+
+        this._handleResize = true;
+        return;
+
+    }
+
+    var oConfig = this.cfg;
+
+    if(oConfig.getProperty("position") == "dynamic") {
+
+        oConfig.setProperty("width", (this._getOffsetWidth() + "px"));
+
+    }
+
+    YAHOO.widget.Menu.superclass.onDomResize.call(this, e, obj);
+
+},
+
+/**
+* @method initEvents
+* @description Initializes the custom events for the menu.
+*/
+initEvents: function() {
+
+	YAHOO.widget.Menu.superclass.initEvents.call(this);
+
+    // Create custom events
+
+    var CustomEvent = YAHOO.util.CustomEvent;
+
+    this.mouseOverEvent = new CustomEvent("mouseOverEvent", this);
+    this.mouseOutEvent = new CustomEvent("mouseOutEvent", this);
+    this.mouseDownEvent = new CustomEvent("mouseDownEvent", this);
+    this.mouseUpEvent = new CustomEvent("mouseUpEvent", this);
+    this.clickEvent = new CustomEvent("clickEvent", this);
+    this.keyPressEvent = new CustomEvent("keyPressEvent", this);
+    this.keyDownEvent = new CustomEvent("keyDownEvent", this);
+    this.keyUpEvent = new CustomEvent("keyUpEvent", this);
+    this.itemAddedEvent = new CustomEvent("itemAddedEvent", this);
+    this.itemRemovedEvent = new CustomEvent("itemRemovedEvent", this);
+
+},
+
+/**
+* @method getRoot
+* @description Finds the menu's root menu.
+*/
+getRoot: function() {
+
+    var oItem = this.parent;
+
+    if(oItem) {
+
+        var oParentMenu = oItem.parent;
+
+        return oParentMenu ? oParentMenu.getRoot() : this;
+
+    }
+    else {
+
+        return this;
+
+    }
+
+},
+
+/**
+* @method toString
+* @description Returns a string representing the menu.
+* @return {String}
+*/
+toString: function() {
+
+    return ("Menu " + this.id);
+
+},
+
+/**
+* @method setItemGroupTitle
+* @description Sets the title of a group of menu items.
+* @param {String} p_sGroupTitle String specifying the title of the group.
+* @param {Number} p_nGroupIndex Optional. Number specifying the group to which
+* the title belongs.
+*/
+setItemGroupTitle: function(p_sGroupTitle, p_nGroupIndex) {
+
+    if(typeof p_sGroupTitle == "string" && p_sGroupTitle.length > 0) {
+
+        var nGroupIndex = typeof p_nGroupIndex == "number" ? p_nGroupIndex : 0;
+        var oTitle = this._aGroupTitleElements[nGroupIndex];
+
+        if(oTitle) {
+
+            oTitle.innerHTML = p_sGroupTitle;
+
+        }
+        else {
+
+            oTitle = document.createElement(this.GROUP_TITLE_TAG_NAME);
+
+            oTitle.innerHTML = p_sGroupTitle;
+
+            this._aGroupTitleElements[nGroupIndex] = oTitle;
+
+        }
+
+        var i = this._aGroupTitleElements.length - 1;
+        var nFirstIndex;
+
+        do {
+
+            if(this._aGroupTitleElements[i]) {
+
+                Dom.removeClass(this._aGroupTitleElements[i], "first-of-type");
+
+                nFirstIndex = i;
+
+            }
+
+        }
+        while(i--);
+
+        if(nFirstIndex !== null) {
+
+            Dom.addClass(
+                this._aGroupTitleElements[nFirstIndex],
+                "first-of-type"
+            );
+
+        }
+
+    }
+
+},
+
+/**
+* @method addItem
+* @description Appends an item to the menu.
+* @param {YAHOO.widget.MenuItem} p_oItem Object reference for the MenuItem
+* instance to be added to the menu.
+* @param {String} p_oItem String specifying the text of the item to be added
+* to the menu.
+* @param {Object} p_oItem Object literal containing a set of menu item
+* configuration properties.
+* @param {Number} p_nGroupIndex Optional. Number indicating the group to
+* which the item belongs.
+* @return {YAHOO.widget.MenuItem}
+*/
+addItem: function(p_oItem, p_nGroupIndex) {
+
+    if(p_oItem) {
+
+        return this._addItemToGroup(p_nGroupIndex, p_oItem);
+
+    }
+
+},
+
+/**
+* @method addItems
+* @description Adds an array of items to the menu.
+* @param {Array} p_aItems Array of items to be added to the menu.  The array
+* can contain strings specifying the text for each item to be created, object
+* literals specifying each of the menu item configuration properties,
+* or MenuItem instances.
+* @param {Number} p_nGroupIndex Optional. Number specifying the group to
+* which the items belongs.
+* @return {Array}
+*/
+addItems: function(p_aItems, p_nGroupIndex) {
+
+    function isArray(p_oValue) {
+
+        return (typeof p_oValue == "object" && p_oValue.constructor == Array);
+
+    }
+
+    if(isArray(p_aItems)) {
+
+        var nItems = p_aItems.length;
+        var aItems = [];
+        var oItem;
+
+        for(var i=0; i<nItems; i++) {
+
+            oItem = p_aItems[i];
+
+            if(isArray(oItem)) {
+
+                aItems[aItems.length] = this.addItems(oItem, i);
+
+            }
+            else {
+
+                aItems[aItems.length] =
+                    this._addItemToGroup(p_nGroupIndex, oItem);
+
+            }
+
+        }
+
+        if(aItems.length) {
+
+            return aItems;
+
+        }
+
+    }
+
+},
+
+/**
+* @method insertItem
+* @description Inserts an item into the menu at the specified index.
+* @param {YAHOO.widget.MenuItem} p_oItem Object reference for the MenuItem
+* instance to be added to the menu.
+* @param {String} p_oItem String specifying the text of the item to be added
+* to the menu.
+* @param {Object} p_oItem Object literal containing a set of menu item
+* configuration properties.
+* @param {Number} p_nItemIndex Number indicating the ordinal position at which
+* the item should be added.
+* @param {Number} p_nGroupIndex Optional. Number indicating the group to which
+* the item belongs.
+* @return {YAHOO.widget.MenuItem}
+*/
+insertItem: function(p_oItem, p_nItemIndex, p_nGroupIndex) {
+
+    if(p_oItem) {
+
+        return this._addItemToGroup(p_nGroupIndex, p_oItem, p_nItemIndex);
+
+    }
+
+},
+
+/**
+* @method removeItem
+* @description Removes the specified item from the menu.
+* @param {YAHOO.widget.MenuItem} p_oObject Object reference for the MenuItem
+* instance to be removed from the menu.
+* @param {Number} p_oObject Number specifying the index of the item
+* to be removed.
+* @param {Number} p_nGroupIndex Optional. Number specifying the group to
+* which the item belongs.
+* @return {YAHOO.widget.MenuItem}
+*/
+removeItem: function(p_oObject, p_nGroupIndex) {
+
+    if(typeof p_oObject != "undefined") {
+
+        var oItem;
+
+        if(p_oObject instanceof YAHOO.widget.MenuItem) {
+
+            oItem = this._removeItemFromGroupByValue(p_nGroupIndex, p_oObject);
+
+        }
+        else if(typeof p_oObject == "number") {
+
+            oItem = this._removeItemFromGroupByIndex(p_nGroupIndex, p_oObject);
+
+        }
+
+        if(oItem) {
+
+            oItem.destroy();
+
+            return oItem;
+
+        }
+
+    }
+
+},
+
+/**
+* @method getItemGroups
+* @description Returns a multi-dimensional array of all of the items in the menu.
+* @return {Array}
+*/
+getItemGroups: function() {
+
+    return this._aItemGroups;
+
+},
+
+/**
+* @method getItem
+* @description Returns the item at the specified index.
+* @param {Number} p_nItemIndex Number indicating the ordinal position of the
+* item to be retrieved.
+* @param {Number} p_nGroupIndex Optional. Number indicating the group to which
+* the item belongs.
+* @return {YAHOO.widget.MenuItem}
+*/
+getItem: function(p_nItemIndex, p_nGroupIndex) {
+
+    if(typeof p_nItemIndex == "number") {
+
+        var aGroup = this._getItemGroup(p_nGroupIndex);
+
+        if(aGroup) {
+
+            return aGroup[p_nItemIndex];
+
+        }
+
+    }
+
+},
+
+/**
+* @method destroy
+* @description Removes the menu's <code>&#60;div&#62;</code> element
+* (and accompanying child nodes) from the document.
+*/
+destroy: function() {
+
+    // Remove Custom Event listeners
+
+    this.mouseOverEvent.unsubscribeAll();
+    this.mouseOutEvent.unsubscribeAll();
+    this.mouseDownEvent.unsubscribeAll();
+    this.mouseUpEvent.unsubscribeAll();
+    this.clickEvent.unsubscribeAll();
+    this.keyPressEvent.unsubscribeAll();
+    this.keyDownEvent.unsubscribeAll();
+    this.keyUpEvent.unsubscribeAll();
+
+    var nItemGroups = this._aItemGroups.length;
+    var nItems;
+    var oItemGroup;
+    var oItem;
+    var i;
+    var n;
+
+    // Remove all items
+
+    if(nItemGroups > 0) {
+
+        i = nItemGroups - 1;
+
+        do {
+
+            oItemGroup = this._aItemGroups[i];
+
+            if(oItemGroup) {
+
+                nItems = oItemGroup.length;
+
+                if(nItems > 0) {
+
+                    n = nItems - 1;
+
+                    do {
+
+                        oItem = this._aItemGroups[i][n];
+
+                        if(oItem) {
+
+                            oItem.destroy();
+                        }
+
+                    }
+                    while(n--);
+
+                }
+
+            }
+
+        }
+        while(i--);
+
+    }
+
+    // Continue with the superclass implementation of this method
+
+    YAHOO.widget.Menu.superclass.destroy.call(this);
+
+
+},
+
+/**
+* @method setInitialFocus
+* @description Sets focus to the menu's first enabled item.
+*/
+setInitialFocus: function() {
+
+    var oItem = this._getFirstEnabledItem();
+
+    if(oItem) {
+
+        oItem.focus();
+    }
+
+},
+
+/**
+* @method setInitialSelection
+* @description Sets the "selected" configuration property of the menu's first
+* enabled item to "true."
+*/
+setInitialSelection: function() {
+
+    var oItem = this._getFirstEnabledItem();
+
+    if(oItem) {
+
+        oItem.cfg.setProperty("selected", true);
+    }
+
+},
+
+/**
+* @method clearActiveItem
+* @description Sets the "selected" configuration property of the menu's active
+* item to "false" and hides the item's submenu.
+* @param {Boolean} p_bBlur Boolean indicating if the menu's active item
+* should be blurred.
+*/
+clearActiveItem: function(p_bBlur) {
+
+    if(this.cfg.getProperty("showdelay") > 0) {
+
+        this._cancelShowDelay();
+
+    }
+
+    var oActiveItem = this.activeItem;
+
+    if(oActiveItem) {
+
+        var oConfig = oActiveItem.cfg;
+
+        oConfig.setProperty("selected", false);
+
+        var oSubmenu = oConfig.getProperty("submenu");
+
+        if(oSubmenu) {
+
+            oSubmenu.hide();
+
+        }
+
+        if(p_bBlur) {
+
+            oActiveItem.blur();
+
+        }
+
+    }
+
+},
+
+/**
+* @description Initializes the class's configurable properties which can be
+* changed using the menu's Config object ("cfg").
+* @method initDefaultConfig
+*/
+initDefaultConfig: function() {
+
+    YAHOO.widget.Menu.superclass.initDefaultConfig.call(this);
+
+    var oConfig = this.cfg;
+
+	// Add configuration properties
+
+    /*
+        Change the default value for the "visible" configuration
+        property to "false" by re-adding the property.
+    */
+
+    /**
+    * @config visible
+    * @description Boolean indicating whether or not the menu is visible.  If
+    * the menu's "position" configuration property is set to "dynamic" (the
+    * default), this property toggles the menu's <code>&#60;div&#62;</code>
+    * element's "visibility" style property between "visible" (true) or
+    * "hidden" (false).  If the menu's "position" configuration property is
+    * set to "static" this property toggles the menu's
+    * <code>&#60;div&#62;</code> element's "display" style property
+    * between "block" (true) or "none" (false).
+    * @default false
+    * @type Boolean
+    */
+    oConfig.addProperty(
+        "visible",
+        {
+            value:false,
+            handler:this.configVisible,
+            validator:this.cfg.checkBoolean
+         }
+     );
+
+    /*
+        Change the default value for the "constraintoviewport" configuration
+        property to "true" by re-adding the property.
+    */
+
+    /**
+    * @config constraintoviewport
+    * @description Boolean indicating if the menu will try to remain inside
+    * the boundaries of the size of viewport.
+    * @default true
+    * @type Boolean
+    */
+    oConfig.addProperty(
+        "constraintoviewport",
+        {
+            value:true,
+            handler:this.configConstrainToViewport,
+            validator:this.cfg.checkBoolean,
+            supercedes:["iframe","x","y","xy"]
+        }
+    );
+
+    /**
+    * @config position
+    * @description String indicating how a menu should be positioned on the
+    * screen.  Possible values are "static" and "dynamic."  Static menus are
+    * visible by default and reside in the normal flow of the document
+    * (CSS position: static).  Dynamic menus are hidden by default, reside
+    * out of the normal flow of the document (CSS position: absolute), and
+    * can overlay other elements on the screen.
+    * @default dynamic
+    * @type String
+    */
+    oConfig.addProperty(
+        "position",
+        {
+            value: "dynamic",
+            handler: this.configPosition,
+            validator: this._checkPosition,
+            supercedes: ["visible"]
+        }
+    );
+
+    /**
+    * @config submenualignment
+    * @description Array defining how submenus should be aligned to their
+    * parent menu item. The format is: [itemCorner, submenuCorner]. By default
+    * a submenu's top left corner is aligned to its parent menu item's top
+    * right corner.
+    * @default ["tl","tr"]
+    * @type Array
+    */
+    oConfig.addProperty("submenualignment", { value: ["tl","tr"] } );
+
+    /**
+    * @config autosubmenudisplay
+    * @description Boolean indicating if submenus are automatically made
+    * visible when the user mouses over the menu's items.
+    * @default true
+    * @type Boolean
+    */
+	oConfig.addProperty(
+	   "autosubmenudisplay",
+	   {
+	       value: true,
+	       validator: oConfig.checkBoolean
+       }
+    );
+
+    /**
+    * @config showdelay
+    * @description Number indicating the time (in milliseconds) that should
+    * expire before a submenu is made visible when the user mouses over
+    * the menu's items.
+    * @default 0
+    * @type Number
+    */
+	oConfig.addProperty(
+	   "showdelay",
+	   {
+	       value: 0,
+	       validator: oConfig.checkNumber
+       }
+    );
+
+    /**
+    * @config hidedelay
+    * @description Number indicating the time (in milliseconds) that should
+    * expire before the menu is hidden.
+    * @default 0
+    * @type Number
+    */
+	oConfig.addProperty(
+	   "hidedelay",
+	   {
+	       value: 0,
+	       validator: oConfig.checkNumber,
+	       handler: this.configHideDelay,
+	       suppressEvent: true
+       }
+    );
+
+    /**
+    * @config clicktohide
+    * @description Boolean indicating if the menu will automatically be
+    * hidden if the user clicks outside of it.
+    * @default true
+    * @type Boolean
+    */
+    oConfig.addProperty(
+        "clicktohide",
+        {
+            value: true,
+            validator: oConfig.checkBoolean
+        }
+    );
+
+	/**
+	* @config container
+	* @description HTML element reference or string specifying the id
+	* attribute of the HTML element that the menu's markup should be rendered into.
+	* @type <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+	* level-one-html.html#ID-58190037">HTMLElement</a>|String
+	* @default document.body
+	*/
+	this.cfg.addProperty(
+	   "container",
+	   { value:document.body, handler:this.configContainer }
+   );
+
+}
+
+}); // END YAHOO.extend
+
+})();
+
+/**
+* The base class for all menuing containers.
+*
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;div&#62;</code> element of the menu module.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;select&#62;</code> element to be used as the data source for the
+* menu module.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929
+* /level-one-html.html#ID-22445964">HTMLDivElement</a>} p_oElement Object
+* specifying the <code>&#60;div&#62;</code> element of the menu module.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-94282980">HTMLSelectElement</a>} p_oElement Object
+* specifying the <code>&#60;select&#62;</code> element to be used as the data
+* source for the menu module.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the menu module. See configuration class documentation for
+* more details.
+* @class MenuModule
+* @constructor
+* @extends YAHOO.widget.Overlay
+* @deprecated As of version 0.12, all MenuModule functionality has been
+* implemented directly in YAHOO.widget.Menu, making YAHOO.widget.Menu the base
+* class for all menuing containers.
+*/
+YAHOO.widget.MenuModule = YAHOO.widget.Menu;
+
+(function() {
+
+var Dom = YAHOO.util.Dom;
+var Module = YAHOO.widget.Module;
+var Menu = YAHOO.widget.Menu;
+
+/**
+* Creates an item for a menu.
+*
+* @param {String} p_oObject String specifying the text of the menu item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-74680021">HTMLLIElement</a>} p_oObject Object specifying
+* the <code>&#60;li&#62;</code> element of the menu item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-38450247">HTMLOptGroupElement</a>} p_oObject Object
+* specifying the <code>&#60;optgroup&#62;</code> element of the menu item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-70901257">HTMLOptionElement</a>} p_oObject Object
+* specifying the <code>&#60;option&#62;</code> element of the menu item.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the menu item. See configuration class documentation
+* for more details.
+* @class MenuItem
+* @constructor
+*/
+YAHOO.widget.MenuItem = function(p_oObject, p_oConfig) {
+
+    if(p_oObject) {
+
+        if(p_oConfig) {
+
+            this.parent = p_oConfig.parent;
+            this.value = p_oConfig.value;
+
+        }
+
+        this.init(p_oObject, p_oConfig);
+
+    }
+
+};
+
+YAHOO.widget.MenuItem.prototype = {
+
+    // Constants
+
+    /**
+    * @property SUBMENU_INDICATOR_IMAGE_PATH
+    * @description String representing the path to the image to be used for the
+    * menu item's submenu arrow indicator.
+    * @default "nt/ic/ut/alt1/menuarorght8_nrm_1.gif"
+    * @final
+    * @type String
+    */
+    SUBMENU_INDICATOR_IMAGE_PATH: "nt/ic/ut/alt1/menuarorght8_nrm_1.gif",
+
+    /**
+    * @property SELECTED_SUBMENU_INDICATOR_IMAGE_PATH
+    * @description String representing the path to the image to be used for the
+    * submenu arrow indicator when the menu item is selected.
+    * @default "nt/ic/ut/alt1/menuarorght8_hov_1.gif"
+    * @final
+    * @type String
+    */
+    SELECTED_SUBMENU_INDICATOR_IMAGE_PATH:
+        "nt/ic/ut/alt1/menuarorght8_hov_1.gif",
+
+    /**
+    * @property DISABLED_SUBMENU_INDICATOR_IMAGE_PATH
+    * @description String representing the path to the image to be used for the
+    * submenu arrow indicator when the menu item is disabled.
+    * @default "nt/ic/ut/alt1/menuarorght8_dim_1.gif"
+    * @final
+    * @type String
+    */
+    DISABLED_SUBMENU_INDICATOR_IMAGE_PATH:
+        "nt/ic/ut/alt1/menuarorght8_dim_1.gif",
+
+    /**
+    * @property COLLAPSED_SUBMENU_INDICATOR_ALT_TEXT
+    * @description String representing the alt text for the image to be used
+    * for the submenu arrow indicator.
+    * @default "Collapsed.  Click to expand."
+    * @final
+    * @type String
+    */
+    COLLAPSED_SUBMENU_INDICATOR_ALT_TEXT: "Collapsed.  Click to expand.",
+
+    /**
+    * @property EXPANDED_SUBMENU_INDICATOR_ALT_TEXT
+    * @description String representing the alt text for the image to be used
+    * for the submenu arrow indicator when the submenu is visible.
+    * @default "Expanded.  Click to collapse."
+    * @final
+    * @type String
+    */
+    EXPANDED_SUBMENU_INDICATOR_ALT_TEXT: "Expanded.  Click to collapse.",
+
+    /**
+    * @property DISABLED_SUBMENU_INDICATOR_ALT_TEXT
+    * @description String representing the alt text for the image to be used
+    * for the submenu arrow indicator when the menu item is disabled.
+    * @default "Disabled."
+    * @final
+    * @type String
+    */
+    DISABLED_SUBMENU_INDICATOR_ALT_TEXT: "Disabled.",
+
+    /**
+    * @property CHECKED_IMAGE_PATH
+    * @description String representing the path to the image to be used for
+    * the checked state.
+    * @default "nt/ic/ut/bsc/menuchk8_nrm_1.gif"
+    * @final
+    * @type String
+    */
+    CHECKED_IMAGE_PATH: "nt/ic/ut/bsc/menuchk8_nrm_1.gif",
+
+
+    /**
+    * @property SELECTED_CHECKED_IMAGE_PATH
+    * @description String representing the path to the image to be used for
+    * the selected checked state.
+    * @default "nt/ic/ut/bsc/menuchk8_hov_1.gif"
+    * @final
+    * @type String
+    */
+    SELECTED_CHECKED_IMAGE_PATH: "nt/ic/ut/bsc/menuchk8_hov_1.gif",
+
+
+    /**
+    * @property DISABLED_CHECKED_IMAGE_PATH
+    * @description String representing the path to the image to be used for
+    * the disabled checked state.
+    * @default "nt/ic/ut/bsc/menuchk8_dim_1.gif"
+    * @final
+    * @type String
+    */
+    DISABLED_CHECKED_IMAGE_PATH: "nt/ic/ut/bsc/menuchk8_dim_1.gif",
+
+
+    /**
+    * @property CHECKED_IMAGE_ALT_TEXT
+    * @description String representing the alt text for the image to be used
+    * for the checked image.
+    * @default "Checked."
+    * @final
+    * @type String
+    */
+    CHECKED_IMAGE_ALT_TEXT: "Checked.",
+
+
+    /**
+    * @property DISABLED_CHECKED_IMAGE_ALT_TEXT
+    * @description String representing the alt text for the image to be used
+    * for the checked image when the item is disabled.
+    * @default "Checked. (Item disabled.)"
+    * @final
+    * @type String
+    */
+    DISABLED_CHECKED_IMAGE_ALT_TEXT: "Checked. (Item disabled.)",
+
+    /**
+    * @property CSS_CLASS_NAME
+    * @description String representing the CSS class(es) to be applied to the
+    * <code>&#60;li&#62;</code> element of the menu item.
+    * @default "yuimenuitem"
+    * @final
+    * @type String
+    */
+    CSS_CLASS_NAME: "yuimenuitem",
+
+    /**
+    * @property SUBMENU_TYPE
+    * @description Object representing the type of menu to instantiate and
+    * add when parsing the child nodes of the menu item's source HTML element.
+    * @final
+    * @type YAHOO.widget.Menu
+    */
+    SUBMENU_TYPE: null,
+
+    /**
+    * @property IMG_ROOT
+    * @description String representing the prefix path to use for
+    * non-secure images.
+    * @default "http://us.i1.yimg.com/us.yimg.com/i/"
+    * @type String
+    */
+    IMG_ROOT: "http://us.i1.yimg.com/us.yimg.com/i/",
+
+
+    /**
+    * @property IMG_ROOT_SSL
+    * @description String representing the prefix path to use for securely
+    * served images.
+    * @default "https://a248.e.akamai.net/sec.yimg.com/i/"
+    * @type String
+    */
+    IMG_ROOT_SSL: "https://a248.e.akamai.net/sec.yimg.com/i/",
+
+    // Private member variables
+
+    /**
+    * @property _oAnchor
+    * @description Object reference to the menu item's
+    * <code>&#60;a&#62;</code> element.
+    * @default null
+    * @private
+    * @type <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+    * one-html.html#ID-48250443">HTMLAnchorElement</a>
+    */
+    _oAnchor: null,
+
+
+    /**
+    * @property _oText
+    * @description Object reference to the menu item's text node.
+    * @default null
+    * @private
+    * @type TextNode
+    */
+    _oText: null,
+
+
+    /**
+    * @property _oHelpTextEM
+    * @description Object reference to the menu item's help text
+    * <code>&#60;em&#62;</code> element.
+    * @default null
+    * @private
+    * @type <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+    * one-html.html#ID-58190037">HTMLElement</a>
+    */
+    _oHelpTextEM: null,
+
+
+    /**
+    * @property _oSubmenu
+    * @description Object reference to the menu item's submenu.
+    * @default null
+    * @private
+    * @type YAHOO.widget.Menu
+    */
+    _oSubmenu: null,
+
+    /**
+    * @property _checkImage
+    * @description Object reference to the menu item's checkmark image.
+    * @default null
+    * @private
+    * @type <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+    * one-html.html#ID-17701901">HTMLImageElement</a>
+    */
+    _checkImage: null,
+
+    // Public properties
+
+	/**
+    * @property constructor
+	* @description Object reference to the menu item's constructor function.
+    * @default YAHOO.widget.MenuItem
+	* @type YAHOO.widget.MenuItem
+	*/
+	constructor: YAHOO.widget.MenuItem,
+
+	/**
+    * @property imageRoot
+	* @description String representing the root path for all of the menu
+	* item's images.
+	* @type String
+	*/
+	imageRoot: null,
+
+	/**
+    * @property isSecure
+	* @description Boolean representing whether or not the current browsing
+	* context is secure (HTTPS).
+	* @type Boolean
+	*/
+	isSecure: Module.prototype.isSecure,
+
+    /**
+    * @property index
+    * @description Number indicating the ordinal position of the menu item in
+    * its group.
+    * @default null
+    * @type Number
+    */
+    index: null,
+
+    /**
+    * @property groupIndex
+    * @description Number indicating the index of the group to which the menu
+    * item belongs.
+    * @default null
+    * @type Number
+    */
+    groupIndex: null,
+
+    /**
+    * @property parent
+    * @description Object reference to the menu item's parent menu.
+    * @default null
+    * @type YAHOO.widget.Menu
+    */
+    parent: null,
+
+    /**
+    * @property element
+    * @description Object reference to the menu item's
+    * <code>&#60;li&#62;</code> element.
+    * @default <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level
+    * -one-html.html#ID-74680021">HTMLLIElement</a>
+    * @type <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+    * one-html.html#ID-74680021">HTMLLIElement</a>
+    */
+    element: null,
+
+    /**
+    * @property srcElement
+    * @description Object reference to the HTML element (either
+    * <code>&#60;li&#62;</code>, <code>&#60;optgroup&#62;</code> or
+    * <code>&#60;option&#62;</code>) used create the menu item.
+    * @default <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+    * level-one-html.html#ID-74680021">HTMLLIElement</a>|<a href="http://www.
+    * w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-html.html#ID-38450247"
+    * >HTMLOptGroupElement</a>|<a href="http://www.w3.org/TR/2000/WD-DOM-
+    * Level-1-20000929/level-one-html.html#ID-70901257">HTMLOptionElement</a>
+    * @type <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+    * one-html.html#ID-74680021">HTMLLIElement</a>|<a href="http://www.w3.
+    * org/TR/2000/WD-DOM-Level-1-20000929/level-one-html.html#ID-38450247">
+    * HTMLOptGroupElement</a>|<a href="http://www.w3.org/TR/2000/WD-DOM-
+    * Level-1-20000929/level-one-html.html#ID-70901257">HTMLOptionElement</a>
+    */
+    srcElement: null,
+
+    /**
+    * @property value
+    * @description Object reference to the menu item's value.
+    * @default null
+    * @type Object
+    */
+    value: null,
+
+    /**
+    * @property submenuIndicator
+    * @description Object reference to the <code>&#60;img&#62;</code> element
+    * used to create the submenu indicator for the menu item.
+    * @default <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+    * level-one-html.html#ID-17701901">HTMLImageElement</a>
+    * @type <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+    * level-one-html.html#ID-17701901">HTMLImageElement</a>
+    */
+    submenuIndicator: null,
+
+	/**
+    * @property browser
+	* @description String representing the browser.
+	* @type String
+	*/
+	browser: Module.prototype.browser,
+
+    // Events
+
+    /**
+    * @event destroyEvent
+    * @description Fires when the menu item's <code>&#60;li&#62;</code>
+    * element is removed from its parent <code>&#60;ul&#62;</code> element.
+    * @type YAHOO.util.CustomEvent
+    */
+    destroyEvent: null,
+
+    /**
+    * @event mouseOverEvent
+    * @description Fires when the mouse has entered the menu item.  Passes
+    * back the DOM Event object as an argument.
+    * @type YAHOO.util.CustomEvent
+    */
+    mouseOverEvent: null,
+
+    /**
+    * @event mouseOutEvent
+    * @description Fires when the mouse has left the menu item.  Passes back
+    * the DOM Event object as an argument.
+    * @type YAHOO.util.CustomEvent
+    */
+    mouseOutEvent: null,
+
+    /**
+    * @event mouseDownEvent
+    * @description Fires when the user mouses down on the menu item.  Passes
+    * back the DOM Event object as an argument.
+    * @type YAHOO.util.CustomEvent
+    */
+    mouseDownEvent: null,
+
+    /**
+    * @event mouseUpEvent
+    * @description Fires when the user releases a mouse button while the mouse
+    * is over the menu item.  Passes back the DOM Event object as an argument.
+    * @type YAHOO.util.CustomEvent
+    */
+    mouseUpEvent: null,
+
+    /**
+    * @event clickEvent
+    * @description Fires when the user clicks the on the menu item.  Passes
+    * back the DOM Event object as an argument.
+    * @type YAHOO.util.CustomEvent
+    */
+    clickEvent: null,
+
+    /**
+    * @event keyPressEvent
+    * @description Fires when the user presses an alphanumeric key when the
+    * menu item has focus.  Passes back the DOM Event object as an argument.
+    * @type YAHOO.util.CustomEvent
+    */
+    keyPressEvent: null,
+
+    /**
+    * @event keyDownEvent
+    * @description Fires when the user presses a key when the menu item has
+    * focus.  Passes back the DOM Event object as an argument.
+    * @type YAHOO.util.CustomEvent
+    */
+    keyDownEvent: null,
+
+    /**
+    * @event keyUpEvent
+    * @description Fires when the user releases a key when the menu item has
+    * focus.  Passes back the DOM Event object as an argument.
+    * @type YAHOO.util.CustomEvent
+    */
+    keyUpEvent: null,
+
+    /**
+    * @event focusEvent
+    * @description Fires when the menu item receives focus.
+    * @type YAHOO.util.CustomEvent
+    */
+    focusEvent: null,
+
+    /**
+    * @event blurEvent
+    * @description Fires when the menu item loses the input focus.
+    * @type YAHOO.util.CustomEvent
+    */
+    blurEvent: null,
+
+    /**
+    * @method init
+    * @description The MenuItem class's initialization method. This method is
+    * automatically called by the constructor, and sets up all DOM references
+    * for pre-existing markup, and creates required markup if it is not
+    * already present.
+    * @param {String} p_oObject String specifying the text of the menu item.
+    * @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+    * one-html.html#ID-74680021">HTMLLIElement</a>} p_oObject Object specifying
+    * the <code>&#60;li&#62;</code> element of the menu item.
+    * @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+    * one-html.html#ID-38450247">HTMLOptGroupElement</a>} p_oObject Object
+    * specifying the <code>&#60;optgroup&#62;</code> element of the menu item.
+    * @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+    * one-html.html#ID-70901257">HTMLOptionElement</a>} p_oObject Object
+    * specifying the <code>&#60;option&#62;</code> element of the menu item.
+    * @param {Object} p_oConfig Optional. Object literal specifying the
+    * configuration for the menu item. See configuration class documentation
+    * for more details.
+    */
+    init: function(p_oObject, p_oConfig) {
+
+        this.imageRoot = (this.isSecure) ? this.IMG_ROOT_SSL : this.IMG_ROOT;
+
+        if(!this.SUBMENU_TYPE) {
+
+            this.SUBMENU_TYPE = Menu;
+
+        }
+
+        // Create the config object
+
+        this.cfg = new YAHOO.util.Config(this);
+
+        this.initDefaultConfig();
+
+        var oConfig = this.cfg;
+
+        if(this._checkString(p_oObject)) {
+
+            this._createRootNodeStructure();
+
+            oConfig.setProperty("text", p_oObject);
+
+        }
+        else if(this._checkDOMNode(p_oObject)) {
+
+            switch(p_oObject.tagName.toUpperCase()) {
+
+                case "OPTION":
+
+                    this._createRootNodeStructure();
+
+                    oConfig.setProperty("text", p_oObject.text);
+
+                    this.srcElement = p_oObject;
+
+                break;
+
+                case "OPTGROUP":
+
+                    this._createRootNodeStructure();
+
+                    oConfig.setProperty("text", p_oObject.label);
+
+                    this.srcElement = p_oObject;
+
+                    this._initSubTree();
+
+                break;
+
+                case "LI":
+
+                    // Get the anchor node (if it exists)
+
+                    var oAnchor = this._getFirstElement(p_oObject, "A");
+                    var sURL = "#";
+                    var sTarget = null;
+                    var sText = null;
+
+                    // Capture the "text" and/or the "URL"
+
+                    if(oAnchor) {
+
+                        sURL = oAnchor.getAttribute("href");
+                        sTarget = oAnchor.getAttribute("target");
+
+                        if(oAnchor.innerText) {
+
+                            sText = oAnchor.innerText;
+
+                        }
+                        else {
+
+                            var oRange = oAnchor.ownerDocument.createRange();
+
+                            oRange.selectNodeContents(oAnchor);
+
+                            sText = oRange.toString();
+
+                        }
+
+                    }
+                    else {
+
+                        var oText = p_oObject.firstChild;
+
+                        sText = oText.nodeValue;
+
+                        oAnchor = document.createElement("a");
+
+                        oAnchor.setAttribute("href", sURL);
+
+                        p_oObject.replaceChild(oAnchor, oText);
+
+                        oAnchor.appendChild(oText);
+
+                    }
+
+                    this.srcElement = p_oObject;
+                    this.element = p_oObject;
+                    this._oAnchor = oAnchor;
+
+
+                    // Check if emphasis has been applied to the MenuItem
+
+                    var oEmphasisNode = this._getFirstElement(oAnchor);
+                    var bEmphasis = false;
+                    var bStrongEmphasis = false;
+
+                    if(oEmphasisNode) {
+
+                        // Set a reference to the text node
+
+                        this._oText = oEmphasisNode.firstChild;
+
+                        switch(oEmphasisNode.tagName.toUpperCase()) {
+
+                            case "EM":
+
+                                bEmphasis = true;
+
+                            break;
+
+                            case "STRONG":
+
+                                bStrongEmphasis = true;
+
+                            break;
+
+                        }
+
+                    }
+                    else {
+
+                        // Set a reference to the text node
+
+                        this._oText = oAnchor.firstChild;
+
+                    }
+
+                    /*
+                        Set these properties silently to sync up the
+                        configuration object without making changes to the
+                        element's DOM
+                    */
+
+                    oConfig.setProperty("text", sText, true);
+                    oConfig.setProperty("url", sURL, true);
+                    oConfig.setProperty("target", sTarget, true);
+                    oConfig.setProperty("emphasis", bEmphasis, true);
+                    oConfig.setProperty(
+                        "strongemphasis",
+                        bStrongEmphasis,
+                        true
+                    );
+
+                    this._initSubTree();
+
+                break;
+
+            }
+
+        }
+
+        if(this.element) {
+
+            Dom.addClass(this.element, this.CSS_CLASS_NAME);
+
+            // Create custom events
+
+            var CustomEvent = YAHOO.util.CustomEvent;
+
+            this.destroyEvent = new CustomEvent("destroyEvent", this);
+            this.mouseOverEvent = new CustomEvent("mouseOverEvent", this);
+            this.mouseOutEvent = new CustomEvent("mouseOutEvent", this);
+            this.mouseDownEvent = new CustomEvent("mouseDownEvent", this);
+            this.mouseUpEvent = new CustomEvent("mouseUpEvent", this);
+            this.clickEvent = new CustomEvent("clickEvent", this);
+            this.keyPressEvent = new CustomEvent("keyPressEvent", this);
+            this.keyDownEvent = new CustomEvent("keyDownEvent", this);
+            this.keyUpEvent = new CustomEvent("keyUpEvent", this);
+            this.focusEvent = new CustomEvent("focusEvent", this);
+            this.blurEvent = new CustomEvent("blurEvent", this);
+
+            if(p_oConfig) {
+
+                oConfig.applyConfig(p_oConfig);
+
+            }
+
+            oConfig.fireQueue();
+
+        }
+
+    },
+
+    // Private methods
+
+    /**
+    * @method _getFirstElement
+    * @description Returns an HTML element's first HTML element node.
+    * @private
+    * @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+    * level-one-html.html#ID-58190037">HTMLElement</a>} p_oElement Object
+    * reference specifying the element to be evaluated.
+    * @param {String} p_sTagName Optional. String specifying the tagname of
+    * the element to be retrieved.
+    * @return {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+    * level-one-html.html#ID-58190037">HTMLElement</a>}
+    */
+    _getFirstElement: function(p_oElement, p_sTagName) {
+
+        var oElement;
+
+        if(p_oElement.firstChild && p_oElement.firstChild.nodeType == 1) {
+
+            oElement = p_oElement.firstChild;
+
+        }
+        else if(
+            p_oElement.firstChild &&
+            p_oElement.firstChild.nextSibling &&
+            p_oElement.firstChild.nextSibling.nodeType == 1
+        ) {
+
+            oElement = p_oElement.firstChild.nextSibling;
+
+        }
+
+        if(p_sTagName) {
+
+            return (oElement && oElement.tagName.toUpperCase() == p_sTagName) ?
+                oElement : false;
+
+        }
+
+        return oElement;
+
+    },
+
+    /**
+    * @method _checkString
+    * @description Determines if an object is a string.
+    * @private
+    * @param {Object} p_oObject Object to be evaluated.
+    * @return {Boolean}
+    */
+    _checkString: function(p_oObject) {
+
+        return (typeof p_oObject == "string");
+
+    },
+
+    /**
+    * @method _checkDOMNode
+    * @description Determines if an object is an HTML element.
+    * @private
+    * @param {Object} p_oObject Object to be evaluated.
+    * @return {Boolean}
+    */
+    _checkDOMNode: function(p_oObject) {
+
+        return (p_oObject && p_oObject.tagName);
+
+    },
+
+    /**
+    * @method _createRootNodeStructure
+    * @description Creates the core DOM structure for the menu item.
+    * @private
+    */
+    _createRootNodeStructure: function () {
+
+        this.element = document.createElement("li");
+
+        this._oText = document.createTextNode("");
+
+        this._oAnchor = document.createElement("a");
+        this._oAnchor.appendChild(this._oText);
+
+        this.cfg.refireEvent("url");
+
+        this.element.appendChild(this._oAnchor);
+
+    },
+
+    /**
+    * @method _initSubTree
+    * @description Iterates the source element's childNodes collection and uses
+    * the child nodes to instantiate other menus.
+    * @private
+    */
+    _initSubTree: function() {
+
+        var oSrcEl = this.srcElement;
+        var oConfig = this.cfg;
+
+        if(oSrcEl.childNodes.length > 0) {
+
+            if(
+                this.parent.lazyLoad &&
+                this.parent.srcElement &&
+                this.parent.srcElement.tagName.toUpperCase() == "SELECT"
+            ) {
+
+                oConfig.setProperty(
+                        "submenu",
+                        { id: Dom.generateId(), itemdata: oSrcEl.childNodes }
+                    );
+
+            }
+            else {
+
+                var oNode = oSrcEl.firstChild;
+                var aOptions = [];
+
+                do {
+
+                    if(oNode && oNode.tagName) {
+
+                        switch(oNode.tagName.toUpperCase()) {
+
+                            case "DIV":
+
+                                oConfig.setProperty("submenu", oNode);
+
+                            break;
+
+                            case "OPTION":
+
+                                aOptions[aOptions.length] = oNode;
+
+                            break;
+
+                        }
+
+                    }
+
+                }
+                while((oNode = oNode.nextSibling));
+
+
+                var nOptions = aOptions.length;
+
+                if(nOptions > 0) {
+
+                    var oMenu = new this.SUBMENU_TYPE(Dom.generateId());
+
+                    oConfig.setProperty("submenu", oMenu);
+
+                    for(var n=0; n<nOptions; n++) {
+
+                        oMenu.addItem((new oMenu.ITEM_TYPE(aOptions[n])));
+
+                    }
+
+                }
+
+            }
+
+        }
+
+    },
+
+    /**
+    * @method _preloadImage
+    * @description Preloads an image by creating an image element from the
+    * specified path and appending the image to the body of the document.
+    * @private
+    * @param {String} p_sPath String specifying the path to the image.
+    */
+    _preloadImage: function(p_sPath) {
+
+        var sPath = this.imageRoot + p_sPath;
+
+        if(!document.images[sPath]) {
+
+            var oImage = document.createElement("img");
+            oImage.src = sPath;
+            oImage.name = sPath;
+            oImage.id = sPath;
+            oImage.style.display = "none";
+
+            document.body.appendChild(oImage);
+
+        }
+
+    },
+
+    // Event handlers for configuration properties
+
+    /**
+    * @method configText
+    * @description Event handler for when the "text" configuration property of
+    * the menu item changes.
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    configText: function(p_sType, p_aArgs, p_oItem) {
+
+        var sText = p_aArgs[0];
+
+        if(this._oText) {
+
+            this._oText.nodeValue = sText;
+
+        }
+
+    },
+
+    /**
+    * @method configHelpText
+    * @description Event handler for when the "helptext" configuration property
+    * of the menu item changes.
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    configHelpText: function(p_sType, p_aArgs, p_oItem) {
+
+        var me = this;
+        var oHelpText = p_aArgs[0];
+        var oEl = this.element;
+        var oConfig = this.cfg;
+        var aNodes = [oEl, this._oAnchor];
+        var oImg = this.submenuIndicator;
+
+        /**
+        * Adds the "hashelptext" class to the necessary nodes and refires the
+        * "selected" and "disabled" configuration events.
+        * @private
+        */
+        var initHelpText = function() {
+
+            Dom.addClass(aNodes, "hashelptext");
+
+            if(oConfig.getProperty("disabled")) {
+
+                oConfig.refireEvent("disabled");
+
+            }
+
+            if(oConfig.getProperty("selected")) {
+
+                oConfig.refireEvent("selected");
+
+            }
+
+        };
+
+        /**
+        * Removes the "hashelptext" class and corresponding DOM element (EM).
+        * @private
+        */
+        var removeHelpText = function() {
+
+            Dom.removeClass(aNodes, "hashelptext");
+
+            oEl.removeChild(me._oHelpTextEM);
+            me._oHelpTextEM = null;
+
+        };
+
+        if(this._checkDOMNode(oHelpText)) {
+
+            if(this._oHelpTextEM) {
+
+                this._oHelpTextEM.parentNode.replaceChild(
+                    oHelpText,
+                    this._oHelpTextEM
+                );
+
+            }
+            else {
+
+                this._oHelpTextEM = oHelpText;
+
+                oEl.insertBefore(this._oHelpTextEM, oImg);
+
+            }
+
+            initHelpText();
+
+        }
+        else if(this._checkString(oHelpText)) {
+
+            if(oHelpText.length === 0) {
+
+                removeHelpText();
+
+            }
+            else {
+
+                if(!this._oHelpTextEM) {
+
+                    this._oHelpTextEM = document.createElement("em");
+
+                    oEl.insertBefore(this._oHelpTextEM, oImg);
+
+                }
+
+                this._oHelpTextEM.innerHTML = oHelpText;
+
+                initHelpText();
+
+            }
+
+        }
+        else if(!oHelpText && this._oHelpTextEM) {
+
+            removeHelpText();
+
+        }
+
+    },
+
+    /**
+    * @method configURL
+    * @description Event handler for when the "url" configuration property of
+    * the menu item changes.
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    configURL: function(p_sType, p_aArgs, p_oItem) {
+
+        var sURL = p_aArgs[0];
+
+        if(!sURL) {
+
+            sURL = "#";
+
+        }
+
+        this._oAnchor.setAttribute("href", sURL);
+
+    },
+
+    /**
+    * @method configTarget
+    * @description Event handler for when the "target" configuration property
+    * of the menu item changes.
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    configTarget: function(p_sType, p_aArgs, p_oItem) {
+
+        var sTarget = p_aArgs[0];
+        var oAnchor = this._oAnchor;
+
+        if(sTarget && sTarget.length > 0) {
+
+            oAnchor.setAttribute("target", sTarget);
+
+        }
+        else {
+
+            oAnchor.removeAttribute("target");
+
+        }
+
+    },
+
+    /**
+    * @method configEmphasis
+    * @description Event handler for when the "emphasis" configuration property
+    * of the menu item changes.
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    configEmphasis: function(p_sType, p_aArgs, p_oItem) {
+
+        var bEmphasis = p_aArgs[0];
+        var oAnchor = this._oAnchor;
+        var oText = this._oText;
+        var oConfig = this.cfg;
+        var oEM;
+
+        if(bEmphasis && oConfig.getProperty("strongemphasis")) {
+
+            oConfig.setProperty("strongemphasis", false);
+
+        }
+
+        if(oAnchor) {
+
+            if(bEmphasis) {
+
+                oEM = document.createElement("em");
+                oEM.appendChild(oText);
+
+                oAnchor.appendChild(oEM);
+
+            }
+            else {
+
+                oEM = this._getFirstElement(oAnchor, "EM");
+
+                oAnchor.removeChild(oEM);
+                oAnchor.appendChild(oText);
+
+            }
+
+        }
+
+    },
+
+    /**
+    * @method configStrongEmphasis
+    * @description Event handler for when the "strongemphasis" configuration
+    * property of the menu item changes.
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    configStrongEmphasis: function(p_sType, p_aArgs, p_oItem) {
+
+        var bStrongEmphasis = p_aArgs[0];
+        var oAnchor = this._oAnchor;
+        var oText = this._oText;
+        var oConfig = this.cfg;
+        var oStrong;
+
+        if(bStrongEmphasis && oConfig.getProperty("emphasis")) {
+
+            oConfig.setProperty("emphasis", false);
+
+        }
+
+        if(oAnchor) {
+
+            if(bStrongEmphasis) {
+
+                oStrong = document.createElement("strong");
+                oStrong.appendChild(oText);
+
+                oAnchor.appendChild(oStrong);
+
+            }
+            else {
+
+                oStrong = this._getFirstElement(oAnchor, "STRONG");
+
+                oAnchor.removeChild(oStrong);
+                oAnchor.appendChild(oText);
+
+            }
+
+        }
+
+    },
+
+    /**
+    * @method configChecked
+    * @description Event handler for when the "checked" configuration property
+    * of the menu item changes.
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    configChecked: function(p_sType, p_aArgs, p_oItem) {
+
+        var bChecked = p_aArgs[0];
+        var oEl = this.element;
+        var oConfig = this.cfg;
+        var oImg;
+
+
+        if(bChecked) {
+
+            this._preloadImage(this.CHECKED_IMAGE_PATH);
+            this._preloadImage(this.SELECTED_CHECKED_IMAGE_PATH);
+            this._preloadImage(this.DISABLED_CHECKED_IMAGE_PATH);
+
+            oImg = document.createElement("img");
+            oImg.src = (this.imageRoot + this.CHECKED_IMAGE_PATH);
+            oImg.alt = this.CHECKED_IMAGE_ALT_TEXT;
+
+            var oSubmenu = this.cfg.getProperty("submenu");
+
+            if(oSubmenu) {
+
+                oEl.insertBefore(oImg, oSubmenu.element);
+
+            }
+            else {
+
+                oEl.appendChild(oImg);
+
+            }
+
+            Dom.addClass([oEl, oImg], "checked");
+
+            this._checkImage = oImg;
+
+            if(oConfig.getProperty("disabled")) {
+
+                oConfig.refireEvent("disabled");
+
+            }
+
+            if(oConfig.getProperty("selected")) {
+
+                oConfig.refireEvent("selected");
+
+            }
+
+        }
+        else {
+
+            oImg = this._checkImage;
+
+            Dom.removeClass([oEl, oImg], "checked");
+
+            if(oImg) {
+
+                oEl.removeChild(oImg);
+
+            }
+
+            this._checkImage = null;
+
+        }
+
+    },
+
+    /**
+    * @method configDisabled
+    * @description Event handler for when the "disabled" configuration property
+    * of the menu item changes.
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    configDisabled: function(p_sType, p_aArgs, p_oItem) {
+
+        var bDisabled = p_aArgs[0];
+        var oAnchor = this._oAnchor;
+        var aNodes = [this.element, oAnchor];
+        var oEM = this._oHelpTextEM;
+        var oConfig = this.cfg;
+        var oImg;
+        var sImgSrc;
+        var sImgAlt;
+
+        if(oEM) {
+
+            aNodes[2] = oEM;
+
+        }
+
+        if(this.cfg.getProperty("checked")) {
+
+            sImgAlt = this.CHECKED_IMAGE_ALT_TEXT;
+            sImgSrc = this.CHECKED_IMAGE_PATH;
+            oImg = this._checkImage;
+
+            if(bDisabled) {
+
+                sImgAlt = this.DISABLED_CHECKED_IMAGE_ALT_TEXT;
+                sImgSrc = this.DISABLED_CHECKED_IMAGE_PATH;
+
+            }
+
+            oImg.src = document.images[(this.imageRoot + sImgSrc)].src;
+            oImg.alt = sImgAlt;
+
+        }
+
+        oImg = this.submenuIndicator;
+
+        if(bDisabled) {
+
+            if(oConfig.getProperty("selected")) {
+
+                oConfig.setProperty("selected", false);
+
+            }
+
+            oAnchor.removeAttribute("href");
+
+            Dom.addClass(aNodes, "disabled");
+
+            sImgSrc = this.DISABLED_SUBMENU_INDICATOR_IMAGE_PATH;
+            sImgAlt = this.DISABLED_SUBMENU_INDICATOR_ALT_TEXT;
+
+        }
+        else {
+
+            oAnchor.setAttribute("href", oConfig.getProperty("url"));
+
+            Dom.removeClass(aNodes, "disabled");
+
+            sImgSrc = this.SUBMENU_INDICATOR_IMAGE_PATH;
+            sImgAlt = this.COLLAPSED_SUBMENU_INDICATOR_ALT_TEXT;
+
+        }
+
+        if(oImg) {
+
+            oImg.src = this.imageRoot + sImgSrc;
+            oImg.alt = sImgAlt;
+
+        }
+
+    },
+
+    /**
+    * @method configSelected
+    * @description Event handler for when the "selected" configuration property
+    * of the menu item changes.
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    configSelected: function(p_sType, p_aArgs, p_oItem) {
+
+        if(!this.cfg.getProperty("disabled")) {
+
+            var bSelected = p_aArgs[0];
+            var oEM = this._oHelpTextEM;
+            var aNodes = [this.element, this._oAnchor];
+            var oImg = this.submenuIndicator;
+            var sImgSrc;
+
+            if(oEM) {
+
+                aNodes[aNodes.length] = oEM;
+
+            }
+
+            if(oImg) {
+
+                aNodes[aNodes.length] = oImg;
+
+            }
+
+
+            if(this.cfg.getProperty("checked")) {
+
+                sImgSrc = this.imageRoot + (bSelected ?
+                    this.SELECTED_CHECKED_IMAGE_PATH : this.CHECKED_IMAGE_PATH);
+
+                this._checkImage.src = document.images[sImgSrc].src;
+
+            }
+
+            if(bSelected) {
+
+                Dom.addClass(aNodes, "selected");
+                sImgSrc = this.SELECTED_SUBMENU_INDICATOR_IMAGE_PATH;
+
+            }
+            else {
+
+                Dom.removeClass(aNodes, "selected");
+                sImgSrc = this.SUBMENU_INDICATOR_IMAGE_PATH;
+
+            }
+
+            if(oImg) {
+
+                oImg.src = document.images[(this.imageRoot + sImgSrc)].src;
+
+            }
+
+        }
+
+    },
+
+    /**
+    * @method configSubmenu
+    * @description Event handler for when the "submenu" configuration property
+    * of the menu item changes.
+    * @param {String} p_sType String representing the name of the event that
+    * was fired.
+    * @param {Array} p_aArgs Array of arguments sent when the event was fired.
+    * @param {YAHOO.widget.MenuItem} p_oItem Object representing the menu item
+    * that fired the event.
+    */
+    configSubmenu: function(p_sType, p_aArgs, p_oItem) {
+
+        var oEl = this.element;
+        var oSubmenu = p_aArgs[0];
+        var oImg = this.submenuIndicator;
+        var oConfig = this.cfg;
+        var aNodes = [this.element, this._oAnchor];
+        var oMenu;
+        var bLazyLoad = this.parent && this.parent.lazyLoad;
+
+        if(oSubmenu) {
+
+            if(oSubmenu instanceof Menu) {
+
+                oMenu = oSubmenu;
+                oMenu.parent = this;
+                oMenu.lazyLoad = bLazyLoad;
+
+            }
+            else if(
+                typeof oSubmenu == "object" &&
+                oSubmenu.id &&
+                !oSubmenu.nodeType
+            ) {
+
+                var sSubmenuId = oSubmenu.id;
+                var oSubmenuConfig = oSubmenu;
+
+                delete oSubmenu["id"];
+
+                oSubmenuConfig.lazyload = bLazyLoad;
+                oSubmenuConfig.parent = this;
+
+                oMenu = new this.SUBMENU_TYPE(sSubmenuId, oSubmenuConfig);
+
+                // Set the value of the property to the Menu instance
+
+                this.cfg.setProperty("submenu", oMenu, true);
+
+            }
+            else {
+
+                oMenu = new this.SUBMENU_TYPE(
+                                oSubmenu,
+                                { lazyload: bLazyLoad, parent: this }
+                            );
+
+                // Set the value of the property to the Menu instance
+
+                this.cfg.setProperty("submenu", oMenu, true);
+
+            }
+
+            if(oMenu) {
+
+                this._oSubmenu = oMenu;
+
+                if(!oImg) {
+
+                    this._preloadImage(this.SUBMENU_INDICATOR_IMAGE_PATH);
+                    this._preloadImage(
+                            this.SELECTED_SUBMENU_INDICATOR_IMAGE_PATH
+                        );
+
+                    this._preloadImage(
+                            this.DISABLED_SUBMENU_INDICATOR_IMAGE_PATH
+                        );
+
+                    oImg = document.createElement("img");
+
+                    oImg.src =
+                        (this.imageRoot + this.SUBMENU_INDICATOR_IMAGE_PATH);
+
+                    oImg.alt = this.COLLAPSED_SUBMENU_INDICATOR_ALT_TEXT;
+
+                    oEl.appendChild(oImg);
+
+                    this.submenuIndicator = oImg;
+
+                    Dom.addClass(aNodes, "hassubmenu");
+
+                    if(oConfig.getProperty("disabled")) {
+
+                        oConfig.refireEvent("disabled");
+
+                    }
+
+                    if(oConfig.getProperty("selected")) {
+
+                        oConfig.refireEvent("selected");
+
+                    }
+
+                }
+
+            }
+
+        }
+        else {
+
+            Dom.removeClass(aNodes, "hassubmenu");
+
+            if(oImg) {
+
+                oEl.removeChild(oImg);
+
+            }
+
+            if(this._oSubmenu) {
+
+                this._oSubmenu.destroy();
+
+            }
+
+        }
+
+    },
+
+    // Public methods
+
+	/**
+    * @method initDefaultConfig
+	* @description Initializes an item's configurable properties.
+	*/
+	initDefaultConfig : function() {
+
+        var oConfig = this.cfg;
+        var CheckBoolean = oConfig.checkBoolean;
+
+        // Define the config properties
+
+        /**
+        * @config text
+        * @description String specifying the text label for the menu item.
+        * When building a menu from existing HTML the value of this property
+        * will be interpreted from the menu's markup.
+        * @default ""
+        * @type String
+        */
+        oConfig.addProperty(
+            "text",
+            {
+                value: "",
+                handler: this.configText,
+                validator: this._checkString,
+                suppressEvent: true
+            }
+        );
+
+
+        /**
+        * @config helptext
+        * @description String specifying additional instructional text to
+        * accompany the text for the nenu item.
+        * @default null
+        * @type String|<a href="http://www.w3.org/TR/
+        * 2000/WD-DOM-Level-1-20000929/level-one-html.html#ID-58190037">
+        * HTMLElement</a>
+        */
+        oConfig.addProperty("helptext", { handler: this.configHelpText });
+
+        /**
+        * @config url
+        * @description String specifying the URL for the menu item's anchor's
+        * "href" attribute.  When building a menu from existing HTML the value
+        * of this property will be interpreted from the menu's markup.
+        * @default "#"
+        * @type String
+        */
+        oConfig.addProperty(
+            "url",
+            { value: "#", handler: this.configURL, suppressEvent: true }
+        );
+
+        /**
+        * @config target
+        * @description String specifying the value for the "target" attribute
+        * of the menu item's anchor element. <strong>Specifying a target will
+        * require the user to click directly on the menu item's anchor node in
+        * order to cause the browser to navigate to the specified URL.</strong>
+        * When building a menu from existing HTML the value of this property
+        * will be interpreted from the menu's markup.
+        * @default null
+        * @type String
+        */
+        oConfig.addProperty(
+            "target",
+            { handler: this.configTarget, suppressEvent: true }
+        );
+
+        /**
+        * @config emphasis
+        * @description Boolean indicating if the text of the menu item will be
+        * rendered with emphasis.  When building a menu from existing HTML the
+        * value of this property will be interpreted from the menu's markup.
+        * @default false
+        * @type Boolean
+        */
+        oConfig.addProperty(
+            "emphasis",
+            {
+                value: false,
+                handler: this.configEmphasis,
+                validator: CheckBoolean,
+                suppressEvent: true
+            }
+        );
+
+        /**
+        * @config strongemphasis
+        * @description Boolean indicating if the text of the menu item will be
+        * rendered with strong emphasis.  When building a menu from existing
+        * HTML the value of this property will be interpreted from the
+        * menu's markup.
+        * @default false
+        * @type Boolean
+        */
+        oConfig.addProperty(
+            "strongemphasis",
+            {
+                value: false,
+                handler: this.configStrongEmphasis,
+                validator: CheckBoolean,
+                suppressEvent: true
+            }
+        );
+
+        /**
+        * @config checked
+        * @description Boolean indicating if the menu item should be rendered
+        * with a checkmark.
+        * @default false
+        * @type Boolean
+        */
+        oConfig.addProperty(
+            "checked",
+            {
+                value: false,
+                handler: this.configChecked,
+                validator: this.cfg.checkBoolean,
+                suppressEvent: true,
+                supercedes:["disabled"]
+            }
+        );
+
+        /**
+        * @config disabled
+        * @description Boolean indicating if the menu item should be disabled.
+        * (Disabled menu items are  dimmed and will not respond to user input
+        * or fire events.)
+        * @default false
+        * @type Boolean
+        */
+        oConfig.addProperty(
+            "disabled",
+            {
+                value: false,
+                handler: this.configDisabled,
+                validator: CheckBoolean,
+                suppressEvent: true
+            }
+        );
+
+        /**
+        * @config selected
+        * @description Boolean indicating if the menu item should
+        * be highlighted.
+        * @default false
+        * @type Boolean
+        */
+        oConfig.addProperty(
+            "selected",
+            {
+                value: false,
+                handler: this.configSelected,
+                validator: CheckBoolean,
+                suppressEvent: true
+            }
+        );
+
+        /**
+        * @config submenu
+        * @description Object specifying the submenu to be appended to the
+        * menu item.  The value can be one of the following: <ul><li>Object
+        * specifying a Menu instance.</li><li>Object literal specifying the
+        * menu to be created.  Format: <code>{ id: [menu id], itemdata:
+        * [<a href="YAHOO.widget.Menu.html#itemData">array of values for
+        * items</a>] }</code>.</li><li>String specifying the id attribute
+        * of the <code>&#60;div&#62;</code> element of the menu.</li><li>
+        * Object specifying the <code>&#60;div&#62;</code> element of the
+        * menu.</li></ul>
+        * @default null
+        * @type Menu|String|Object|<a href="http://www.w3.org/TR/2000/
+        * WD-DOM-Level-1-20000929/level-one-html.html#ID-58190037">
+        * HTMLElement</a>
+        */
+        oConfig.addProperty("submenu", { handler: this.configSubmenu });
+
+	},
+
+    /**
+    * @method getNextEnabledSibling
+    * @description Finds the menu item's next enabled sibling.
+    * @return YAHOO.widget.MenuItem
+    */
+    getNextEnabledSibling: function() {
+
+        if(this.parent instanceof Menu) {
+
+            var nGroupIndex = this.groupIndex;
+
+            /**
+            * Finds the next item in an array.
+            * @private
+            * @param {p_aArray} Array to search.
+            * @param {p_nStartIndex} Number indicating the index to
+            * start searching the array.
+            * @return {Object}
+            */
+            var getNextArrayItem = function(p_aArray, p_nStartIndex) {
+
+                return p_aArray[p_nStartIndex] ||
+                    getNextArrayItem(p_aArray, (p_nStartIndex+1));
+
+            };
+
+
+            var aItemGroups = this.parent.getItemGroups();
+            var oNextItem;
+
+
+            if(this.index < (aItemGroups[nGroupIndex].length - 1)) {
+
+                oNextItem = getNextArrayItem(
+                        aItemGroups[nGroupIndex],
+                        (this.index+1)
+                    );
+
+            }
+            else {
+
+                var nNextGroupIndex;
+
+                if(nGroupIndex < (aItemGroups.length - 1)) {
+
+                    nNextGroupIndex = nGroupIndex + 1;
+
+                }
+                else {
+
+                    nNextGroupIndex = 0;
+
+                }
+
+                var aNextGroup = getNextArrayItem(aItemGroups, nNextGroupIndex);
+
+                // Retrieve the first menu item in the next group
+
+                oNextItem = getNextArrayItem(aNextGroup, 0);
+
+            }
+
+            return (
+                oNextItem.cfg.getProperty("disabled") ||
+                oNextItem.element.style.display == "none"
+            ) ?
+            oNextItem.getNextEnabledSibling() : oNextItem;
+
+        }
+
+    },
+
+    /**
+    * @method getPreviousEnabledSibling
+    * @description Finds the menu item's previous enabled sibling.
+    * @return {YAHOO.widget.MenuItem}
+    */
+    getPreviousEnabledSibling: function() {
+
+        if(this.parent instanceof Menu) {
+
+            var nGroupIndex = this.groupIndex;
+
+            /**
+            * Returns the previous item in an array
+            * @private
+            * @param {p_aArray} Array to search.
+            * @param {p_nStartIndex} Number indicating the index to
+            * start searching the array.
+            * @return {Object}
+            */
+            var getPreviousArrayItem = function(p_aArray, p_nStartIndex) {
+
+                return p_aArray[p_nStartIndex] ||
+                    getPreviousArrayItem(p_aArray, (p_nStartIndex-1));
+
+            };
+
+            /**
+            * Get the index of the first item in an array
+            * @private
+            * @param {p_aArray} Array to search.
+            * @param {p_nStartIndex} Number indicating the index to
+            * start searching the array.
+            * @return {Object}
+            */
+            var getFirstItemIndex = function(p_aArray, p_nStartIndex) {
+
+                return p_aArray[p_nStartIndex] ?
+                    p_nStartIndex :
+                    getFirstItemIndex(p_aArray, (p_nStartIndex+1));
+
+            };
+
+            var aItemGroups = this.parent.getItemGroups();
+            var oPreviousItem;
+
+            if(
+                this.index > getFirstItemIndex(aItemGroups[nGroupIndex], 0)
+            ) {
+
+                oPreviousItem =
+                    getPreviousArrayItem(
+                        aItemGroups[nGroupIndex],
+                        (this.index-1)
+                    );
+
+            }
+            else {
+
+                var nPreviousGroupIndex;
+
+                if(nGroupIndex > getFirstItemIndex(aItemGroups, 0)) {
+
+                    nPreviousGroupIndex = nGroupIndex - 1;
+
+                }
+                else {
+
+                    nPreviousGroupIndex = aItemGroups.length - 1;
+
+                }
+
+                var aPreviousGroup =
+                        getPreviousArrayItem(aItemGroups, nPreviousGroupIndex);
+
+                oPreviousItem =
+                    getPreviousArrayItem(
+                        aPreviousGroup,
+                        (aPreviousGroup.length - 1)
+                    );
+
+            }
+
+            return (
+                oPreviousItem.cfg.getProperty("disabled") ||
+                oPreviousItem.element.style.display == "none"
+            ) ?
+            oPreviousItem.getPreviousEnabledSibling() : oPreviousItem;
+
+        }
+
+    },
+
+    /**
+    * @method focus
+    * @description Causes the menu item to receive the focus and fires the
+    * focus event.
+    */
+    focus: function() {
+
+        var oParent = this.parent;
+        var oAnchor = this._oAnchor;
+        var oActiveItem = oParent.activeItem;
+
+        if(
+            !this.cfg.getProperty("disabled") &&
+            oParent &&
+            oParent.cfg.getProperty("visible") &&
+            this.element.style.display != "none"
+        ) {
+
+            if(oActiveItem) {
+
+                oActiveItem.blur();
+
+            }
+
+            try {
+
+                oAnchor.focus();
+
+            }
+            catch(e) {
+
+            }
+
+            this.focusEvent.fire();
+
+        }
+
+    },
+
+    /**
+    * @method blur
+    * @description Causes the menu item to lose focus and fires the
+    * onblur event.
+    */
+    blur: function() {
+
+        var oParent = this.parent;
+
+        if(
+            !this.cfg.getProperty("disabled") &&
+            oParent &&
+            Dom.getStyle(oParent.element, "visibility") == "visible"
+        ) {
+
+            this._oAnchor.blur();
+
+            this.blurEvent.fire();
+
+        }
+
+    },
+
+	/**
+    * @method destroy
+	* @description Removes the menu item's <code>&#60;li&#62;</code> element
+	* from its parent <code>&#60;ul&#62;</code> element.
+	*/
+    destroy: function() {
+
+        var oEl = this.element;
+
+        if(oEl) {
+
+            // Remove CustomEvent listeners
+
+            this.mouseOverEvent.unsubscribeAll();
+            this.mouseOutEvent.unsubscribeAll();
+            this.mouseDownEvent.unsubscribeAll();
+            this.mouseUpEvent.unsubscribeAll();
+            this.clickEvent.unsubscribeAll();
+            this.keyPressEvent.unsubscribeAll();
+            this.keyDownEvent.unsubscribeAll();
+            this.keyUpEvent.unsubscribeAll();
+            this.focusEvent.unsubscribeAll();
+            this.blurEvent.unsubscribeAll();
+            this.cfg.configChangedEvent.unsubscribeAll();
+
+            // Remove the element from the parent node
+
+            var oParentNode = oEl.parentNode;
+
+            if(oParentNode) {
+
+                oParentNode.removeChild(oEl);
+
+                this.destroyEvent.fire();
+
+            }
+
+            this.destroyEvent.unsubscribeAll();
+
+        }
+
+    },
+
+    /**
+    * @method toString
+    * @description Returns a string representing the menu item.
+    * @return {String}
+    */
+    toString: function() {
+
+        return ("MenuItem: " + this.cfg.getProperty("text"));
+
+    }
+
+};
+
+})();
+
+/**
+* Creates an item for a menu module.
+*
+* @param {String} p_oObject String specifying the text of the menu module item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-
+* html.html#ID-74680021">HTMLLIElement</a>} p_oObject Object specifying the
+* <code>&#60;li&#62;</code> element of the menu module item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-
+* html.html#ID-38450247">HTMLOptGroupElement</a>} p_oObject Object specifying
+* the <code>&#60;optgroup&#62;</code> element of the menu module item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-
+* html.html#ID-70901257">HTMLOptionElement</a>} p_oObject Object specifying the
+* <code>&#60;option&#62;</code> element of the menu module item.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the menu module item. See configuration class documentation
+* for more details.
+* @class MenuModuleItem
+* @constructor
+* @deprecated As of version 0.12, all MenuModuleItem functionality has been
+* implemented directly in YAHOO.widget.MenuItem, making YAHOO.widget.MenuItem
+* the base class for all menu items.
+*/
+YAHOO.widget.MenuModuleItem = YAHOO.widget.MenuItem;
+
+/**
+* Creates a list of options or commands which are made visible in response to
+* an HTML element's "contextmenu" event ("mousedown" for Opera).
+*
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;div&#62;</code> element of the context menu.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;select&#62;</code> element to be used as the data source for the
+* context menu.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-
+* html.html#ID-22445964">HTMLDivElement</a>} p_oElement Object specifying the
+* <code>&#60;div&#62;</code> element of the context menu.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-
+* html.html#ID-94282980">HTMLSelectElement</a>} p_oElement Object specifying
+* the <code>&#60;select&#62;</code> element to be used as the data source for
+* the context menu.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the context menu. See configuration class documentation
+* for more details.
+* @class ContextMenu
+* @constructor
+* @extends YAHOO.widget.Menu
+* @namespace YAHOO.widget
+*/
+YAHOO.widget.ContextMenu = function(p_oElement, p_oConfig) {
+
+    YAHOO.widget.ContextMenu.superclass.constructor.call(
+            this,
+            p_oElement,
+            p_oConfig
+        );
+
+};
+
+YAHOO.extend(YAHOO.widget.ContextMenu, YAHOO.widget.Menu, {
+
+// Private properties
+
+/**
+* @property _oTrigger
+* @description Object reference to the current value of the "trigger"
+* configuration property.
+* @default null
+* @private
+* @type String|<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/leve
+* l-one-html.html#ID-58190037">HTMLElement</a>|Array
+*/
+_oTrigger: null,
+
+// Public properties
+
+/**
+* @property contextEventTarget
+* @description Object reference for the HTML element that was the target of the
+* "contextmenu" DOM event ("mousedown" for Opera) that triggered the display of
+* the context menu.
+* @default null
+* @type <a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-
+* html.html#ID-58190037">HTMLElement</a>
+*/
+contextEventTarget: null,
+
+/**
+* @method init
+* @description The ContextMenu class's initialization method. This method is
+* automatically called by the constructor, and sets up all DOM references for
+* pre-existing markup, and creates required markup if it is not already present.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;div&#62;</code> element of the context menu.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;select&#62;</code> element to be used as the data source for
+* the context menu.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-
+* html.html#ID-22445964">HTMLDivElement</a>} p_oElement Object specifying the
+* <code>&#60;div&#62;</code> element of the context menu.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-
+* html.html#ID-94282980">HTMLSelectElement</a>} p_oElement Object specifying
+* the <code>&#60;select&#62;</code> element to be used as the data source for
+* the context menu.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the context menu. See configuration class documentation
+* for more details.
+*/
+init: function(p_oElement, p_oConfig) {
+
+    if(!this.ITEM_TYPE) {
+
+        this.ITEM_TYPE = YAHOO.widget.ContextMenuItem;
+
+    }
+
+    // Call the init of the superclass (YAHOO.widget.Menu)
+
+    YAHOO.widget.ContextMenu.superclass.init.call(this, p_oElement);
+
+    this.beforeInitEvent.fire(YAHOO.widget.ContextMenu);
+
+    if(p_oConfig) {
+
+        this.cfg.applyConfig(p_oConfig, true);
+
+    }
+
+
+    this.initEvent.fire(YAHOO.widget.ContextMenu);
+
+},
+
+// Private methods
+
+/**
+* @method _removeEventHandlers
+* @description Removes all of the DOM event handlers from the HTML element(s)
+* whose "context menu" event ("click" for Opera) trigger the display of
+* the context menu.
+* @private
+*/
+_removeEventHandlers: function() {
+
+    var Event = YAHOO.util.Event;
+    var oTrigger = this._oTrigger;
+    var bOpera = (this.browser == "opera");
+
+    // Remove the event handlers from the trigger(s)
+
+    Event.removeListener(
+        oTrigger,
+        (bOpera ? "mousedown" : "contextmenu"),
+        this._onTriggerContextMenu
+    );
+
+    if(bOpera) {
+
+        Event.removeListener(oTrigger, "click", this._onTriggerClick);
+
+    }
+
+},
+
+// Private event handlers
+
+/**
+* @method _onTriggerClick
+* @description "click" event handler for the HTML element(s) identified as the
+* "trigger" for the context menu.  Used to cancel default behaviors in Opera.
+* @private
+* @param {Event} p_oEvent Object representing the DOM event object passed back
+* by the event utility (YAHOO.util.Event).
+* @param {YAHOO.widget.ContextMenu} p_oMenu Object representing the context
+* menu that is handling the event.
+*/
+_onTriggerClick: function(p_oEvent, p_oMenu) {
+
+    if(p_oEvent.ctrlKey) {
+
+        YAHOO.util.Event.stopEvent(p_oEvent);
+
+    }
+
+},
+
+/**
+* @method _onTriggerContextMenu
+* @description "contextmenu" event handler ("mousedown" for Opera) for the HTML
+* element(s) that trigger the display of the context menu.
+* @private
+* @param {Event} p_oEvent Object representing the DOM event object passed back
+* by the event utility (YAHOO.util.Event).
+* @param {YAHOO.widget.ContextMenu} p_oMenu Object representing the context
+* menu that is handling the event.
+*/
+_onTriggerContextMenu: function(p_oEvent, p_oMenu) {
+
+    // Hide any other ContextMenu instances that might be visible
+
+    YAHOO.widget.MenuManager.hideVisible();
+
+    var Event = YAHOO.util.Event;
+    var oConfig = this.cfg;
+
+    if(p_oEvent.type == "mousedown" && !p_oEvent.ctrlKey) {
+
+        return;
+
+    }
+
+    this.contextEventTarget = Event.getTarget(p_oEvent);
+
+    // Position and display the context menu
+
+    var nX = Event.getPageX(p_oEvent);
+    var nY = Event.getPageY(p_oEvent);
+
+    oConfig.applyConfig( { xy:[nX, nY], visible:true } );
+    oConfig.fireQueue();
+
+    /*
+        Prevent the browser's default context menu from appearing and
+        stop the propagation of the "contextmenu" event so that
+        other ContextMenu instances are not displayed.
+    */
+
+    Event.stopEvent(p_oEvent);
+
+},
+
+// Public methods
+
+/**
+* @method toString
+* @description Returns a string representing the context menu.
+* @return {String}
+*/
+toString: function() {
+
+    return ("ContextMenu " + this.id);
+
+},
+
+/**
+* @method initDefaultConfig
+* @description Initializes the class's configurable properties which can be
+* changed using the context menu's Config object ("cfg").
+*/
+initDefaultConfig: function() {
+
+    YAHOO.widget.ContextMenu.superclass.initDefaultConfig.call(this);
+
+    /**
+    * @config trigger
+    * @description The HTML element(s) whose "contextmenu" event ("mousedown"
+    * for Opera) trigger the display of the context menu.  Can be a string
+    * representing the id attribute of the HTML element, an object reference
+    * for the HTML element, or an array of strings or HTML element references.
+    * @default null
+    * @type String|<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/
+    * level-one-html.html#ID-58190037">HTMLElement</a>|Array
+    */
+    this.cfg.addProperty("trigger", { handler: this.configTrigger });
+
+},
+
+/**
+* @method destroy
+* @description Removes the context menu's <code>&#60;div&#62;</code> element
+* (and accompanying child nodes) from the document.
+*/
+destroy: function() {
+
+    // Remove the DOM event handlers from the current trigger(s)
+
+    this._removeEventHandlers();
+
+
+    // Continue with the superclass implementation of this method
+
+    YAHOO.widget.ContextMenu.superclass.destroy.call(this);
+
+},
+
+// Public event handlers for configuration properties
+
+/**
+* @method configTrigger
+* @description Event handler for when the value of the "trigger" configuration
+* property changes.
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.ContextMenu} p_oMenu Object representing the context
+* menu that fired the event.
+*/
+configTrigger: function(p_sType, p_aArgs, p_oMenu) {
+
+    var Event = YAHOO.util.Event;
+    var oTrigger = p_aArgs[0];
+
+    if(oTrigger) {
+
+        /*
+            If there is a current "trigger" - remove the event handlers
+            from that element(s) before assigning new ones
+        */
+
+        if(this._oTrigger) {
+
+            this._removeEventHandlers();
+
+        }
+
+        this._oTrigger = oTrigger;
+
+        /*
+            Listen for the "mousedown" event in Opera b/c it does not
+            support the "contextmenu" event
+        */
+
+        var bOpera = (this.browser == "opera");
+
+        Event.addListener(
+            oTrigger,
+            (bOpera ? "mousedown" : "contextmenu"),
+            this._onTriggerContextMenu,
+            this,
+            true
+        );
+
+        /*
+            Assign a "click" event handler to the trigger element(s) for
+            Opera to prevent default browser behaviors.
+        */
+
+        if(bOpera) {
+
+            Event.addListener(
+                oTrigger,
+                "click",
+                this._onTriggerClick,
+                this,
+                true
+            );
+
+        }
+
+    }
+    else {
+
+        this._removeEventHandlers();
+
+    }
+
+}
+
+}); // END YAHOO.extend
+
+/**
+* Creates an item for a context menu.
+*
+* @param {String} p_oObject String specifying the text of the context menu item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-74680021">HTMLLIElement</a>} p_oObject Object specifying the
+* <code>&#60;li&#62;</code> element of the context menu item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-38450247">HTMLOptGroupElement</a>} p_oObject Object
+* specifying the <code>&#60;optgroup&#62;</code> element of the context
+* menu item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-70901257">HTMLOptionElement</a>} p_oObject Object specifying
+* the <code>&#60;option&#62;</code> element of the context menu item.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the context menu item. See configuration class
+* documentation for more details.
+* @class ContextMenuItem
+* @constructor
+* @extends YAHOO.widget.MenuItem
+*/
+YAHOO.widget.ContextMenuItem = function(p_oObject, p_oConfig) {
+
+    YAHOO.widget.ContextMenuItem.superclass.constructor.call(
+        this,
+        p_oObject,
+        p_oConfig
+    );
+
+};
+
+YAHOO.extend(YAHOO.widget.ContextMenuItem, YAHOO.widget.MenuItem, {
+
+/**
+* @method init
+* @description The ContextMenuItem class's initialization method. This method
+* is automatically called by the constructor, and sets up all DOM references
+* for pre-existing markup, and creates required markup if it is not
+* already present.
+* @param {String} p_oObject String specifying the text of the context menu item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-74680021">HTMLLIElement</a>} p_oObject Object specifying the
+* <code>&#60;li&#62;</code> element of the context menu item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-38450247">HTMLOptGroupElement</a>} p_oObject Object
+* specifying the <code>&#60;optgroup&#62;</code> element of the context
+* menu item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-70901257">HTMLOptionElement</a>} p_oObject Object specifying
+* the <code>&#60;option&#62;</code> element of the context menu item.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the context menu item. See configuration class
+* documentation for more details.
+*/
+init: function(p_oObject, p_oConfig) {
+
+    if(!this.SUBMENU_TYPE) {
+
+        this.SUBMENU_TYPE = YAHOO.widget.ContextMenu;
+
+    }
+
+    /*
+        Call the init of the superclass (YAHOO.widget.MenuItem)
+        Note: We don't pass the user config in here yet
+        because we only want it executed once, at the lowest
+        subclass level.
+    */
+
+    YAHOO.widget.ContextMenuItem.superclass.init.call(this, p_oObject);
+
+    var oConfig = this.cfg;
+
+    if(p_oConfig) {
+
+        oConfig.applyConfig(p_oConfig, true);
+
+    }
+
+    oConfig.fireQueue();
+
+},
+
+// Public methods
+
+/**
+* @method toString
+* @description Returns a string representing the context menu item.
+* @return {String}
+*/
+toString: function() {
+
+    return ("MenuBarItem: " + this.cfg.getProperty("text"));
+
+}
+
+}); // END YAHOO.extend
+
+/**
+* Horizontal collection of items, each of which can contain a submenu.
+*
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;div&#62;</code> element of the menu bar.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;select&#62;</code> element to be used as the data source for the
+* menu bar.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-22445964">HTMLDivElement</a>} p_oElement Object specifying
+* the <code>&#60;div&#62;</code> element of the menu bar.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-94282980">HTMLSelectElement</a>} p_oElement Object
+* specifying the <code>&#60;select&#62;</code> element to be used as the data
+* source for the menu bar.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the menu bar. See configuration class documentation for
+* more details.
+* @class Menubar
+* @constructor
+* @extends YAHOO.widget.Menu
+* @namespace YAHOO.widget
+*/
+YAHOO.widget.MenuBar = function(p_oElement, p_oConfig) {
+
+    YAHOO.widget.MenuBar.superclass.constructor.call(
+            this,
+            p_oElement,
+            p_oConfig
+        );
+
+};
+
+YAHOO.extend(YAHOO.widget.MenuBar, YAHOO.widget.Menu, {
+
+/**
+* @method init
+* @description The MenuBar class's initialization method. This method is
+* automatically called by the constructor, and sets up all DOM references for
+* pre-existing markup, and creates required markup if it is not already present.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;div&#62;</code> element of the menu bar.
+* @param {String} p_oElement String specifying the id attribute of the
+* <code>&#60;select&#62;</code> element to be used as the data source for the
+* menu bar.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-22445964">HTMLDivElement</a>} p_oElement Object specifying
+* the <code>&#60;div&#62;</code> element of the menu bar.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-94282980">HTMLSelectElement</a>} p_oElement Object
+* specifying the <code>&#60;select&#62;</code> element to be used as the data
+* source for the menu bar.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the menu bar. See configuration class documentation for
+* more details.
+*/
+init: function(p_oElement, p_oConfig) {
+
+    if(!this.ITEM_TYPE) {
+
+        this.ITEM_TYPE = YAHOO.widget.MenuBarItem;
+
+    }
+
+    // Call the init of the superclass (YAHOO.widget.Menu)
+
+    YAHOO.widget.MenuBar.superclass.init.call(this, p_oElement);
+
+    this.beforeInitEvent.fire(YAHOO.widget.MenuBar);
+
+    if(p_oConfig) {
+
+        this.cfg.applyConfig(p_oConfig, true);
+
+    }
+
+    this.initEvent.fire(YAHOO.widget.MenuBar);
+
+},
+
+// Constants
+
+/**
+* @property CSS_CLASS_NAME
+* @description String representing the CSS class(es) to be applied to the menu
+* bar's <code>&#60;div&#62;</code> element.
+* @default "yuimenubar"
+* @final
+* @type String
+*/
+CSS_CLASS_NAME: "yuimenubar",
+
+// Protected event handlers
+
+/**
+* @method _onKeyDown
+* @description "keydown" Custom Event handler for the menu bar.
+* @private
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.MenuBar} p_oMenuBar Object representing the menu bar
+* that fired the event.
+*/
+_onKeyDown: function(p_sType, p_aArgs, p_oMenuBar) {
+
+    var Event = YAHOO.util.Event;
+    var oEvent = p_aArgs[0];
+    var oItem = p_aArgs[1];
+    var oItemCfg = oItem.cfg;
+    var oSubmenu;
+
+    switch(oEvent.keyCode) {
+
+        case 27:    // Esc key
+
+            if(this.cfg.getProperty("position") == "dynamic") {
+
+                this.hide();
+
+                if(this.parent) {
+
+                    this.parent.focus();
+
+                }
+
+            }
+            else if(this.activeItem) {
+
+                oSubmenu = this.activeItem.cfg.getProperty("submenu");
+
+                if(oSubmenu && oSubmenu.cfg.getProperty("visible")) {
+
+                    oSubmenu.hide();
+                    this.activeItem.focus();
+
+                }
+                else {
+
+                    this.activeItem.cfg.setProperty("selected", false);
+                    this.activeItem.blur();
+
+                }
+
+            }
+
+
+            Event.preventDefault(oEvent);
+
+        break;
+
+        case 37:    // Left arrow
+        case 39:    // Right arrow
+
+            if(
+                oItem == this.activeItem &&
+                !oItemCfg.getProperty("selected")
+            ) {
+
+                oItemCfg.setProperty("selected", true);
+
+            }
+            else {
+
+                var oNextItem = (oEvent.keyCode == 37) ?
+                        oItem.getPreviousEnabledSibling() :
+                        oItem.getNextEnabledSibling();
+
+                if(oNextItem) {
+
+                    this.clearActiveItem();
+
+                    oNextItem.cfg.setProperty("selected", true);
+
+                    if(this.cfg.getProperty("autosubmenudisplay")) {
+
+                        oSubmenu = oNextItem.cfg.getProperty("submenu");
+
+                        if(oSubmenu) {
+
+                            oSubmenu.show();
+                            oSubmenu.activeItem.blur();
+                            oSubmenu.activeItem = null;
+
+                        }
+
+                    }
+
+                    oNextItem.focus();
+
+                }
+
+            }
+
+            Event.preventDefault(oEvent);
+
+        break;
+
+        case 40:    // Down arrow
+
+            if(this.activeItem != oItem) {
+
+                this.clearActiveItem();
+
+                oItemCfg.setProperty("selected", true);
+                oItem.focus();
+
+            }
+
+            oSubmenu = oItemCfg.getProperty("submenu");
+
+            if(oSubmenu) {
+
+                if(oSubmenu.cfg.getProperty("visible")) {
+
+                    oSubmenu.setInitialSelection();
+                    oSubmenu.setInitialFocus();
+
+                }
+                else {
+
+                    oSubmenu.show();
+
+                }
+
+            }
+
+            Event.preventDefault(oEvent);
+
+        break;
+
+    }
+
+},
+
+/**
+* @method _onClick
+* @description "click" event handler for the menu bar.
+* @protected
+* @param {String} p_sType String representing the name of the event that
+* was fired.
+* @param {Array} p_aArgs Array of arguments sent when the event was fired.
+* @param {YAHOO.widget.MenuBar} p_oMenuBar Object representing the menu bar
+* that fired the event.
+*/
+_onClick: function(p_sType, p_aArgs, p_oMenuBar) {
+
+    YAHOO.widget.MenuBar.superclass._onClick.call(
+        this,
+        p_sType,
+        p_aArgs,
+        p_oMenuBar
+    );
+
+    var oItem = p_aArgs[1];
+
+    if(oItem) {
+
+        var Event = YAHOO.util.Event;
+        var Dom = YAHOO.util.Dom;
+
+        var oEvent = p_aArgs[0];
+        var oTarget = Event.getTarget(oEvent);
+
+        var oActiveItem = this.activeItem;
+        var oConfig = this.cfg;
+
+        // Hide any other submenus that might be visible
+
+        if(oActiveItem && oActiveItem != oItem) {
+
+            this.clearActiveItem();
+
+        }
+
+
+        // Select and focus the current item
+
+        oItem.cfg.setProperty("selected", true);
+        oItem.focus();
+
+
+        // Show the submenu for the item
+
+        var oSubmenu = oItem.cfg.getProperty("submenu");
+
+        if(oSubmenu && oTarget != oItem.submenuIndicator) {
+
+            if(oSubmenu.cfg.getProperty("visible")) {
+
+                oSubmenu.hide();
+
+            }
+            else {
+
+                oSubmenu.show();
+
+            }
+
+        }
+
+    }
+
+},
+
+// Public methods
+
+/**
+* @method toString
+* @description Returns a string representing the menu bar.
+* @return {String}
+*/
+toString: function() {
+
+    return ("MenuBar " + this.id);
+
+},
+
+/**
+* @description Initializes the class's configurable properties which can be
+* changed using the menu bar's Config object ("cfg").
+* @method initDefaultConfig
+*/
+initDefaultConfig: function() {
+
+    YAHOO.widget.MenuBar.superclass.initDefaultConfig.call(this);
+
+    var oConfig = this.cfg;
+
+	// Add configuration properties
+
+    /*
+        Set the default value for the "position" configuration property
+        to "static" by re-adding the property.
+    */
+
+    /**
+    * @config position
+    * @description String indicating how a menu bar should be positioned on the
+    * screen.  Possible values are "static" and "dynamic."  Static menu bars
+    * are visible by default and reside in the normal flow of the document
+    * (CSS position: static).  Dynamic menu bars are hidden by default, reside
+    * out of the normal flow of the document (CSS position: absolute), and can
+    * overlay other elements on the screen.
+    * @default static
+    * @type String
+    */
+    oConfig.addProperty(
+        "position",
+        {
+            value: "static",
+            handler: this.configPosition,
+            validator: this._checkPosition,
+            supercedes: ["visible"]
+        }
+    );
+
+    /*
+        Set the default value for the "submenualignment" configuration property
+        to ["tl","bl"] by re-adding the property.
+    */
+
+    /**
+    * @config submenualignment
+    * @description Array defining how submenus should be aligned to their
+    * parent menu bar item. The format is: [itemCorner, submenuCorner].
+    * @default ["tl","bl"]
+    * @type Array
+    */
+    oConfig.addProperty("submenualignment", { value: ["tl","bl"] } );
+
+    /*
+        Change the default value for the "autosubmenudisplay" configuration
+        property to "false" by re-adding the property.
+    */
+
+    /**
+    * @config autosubmenudisplay
+    * @description Boolean indicating if submenus are automatically made
+    * visible when the user mouses over the menu bar's items.
+    * @default false
+    * @type Boolean
+    */
+	oConfig.addProperty(
+	   "autosubmenudisplay",
+	   { value: false, validator: oConfig.checkBoolean }
+    );
+
+}
+
+}); // END YAHOO.extend
+
+/**
+* Creates an item for a menu bar.
+*
+* @param {String} p_oObject String specifying the text of the menu bar item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-74680021">HTMLLIElement</a>} p_oObject Object specifying the
+* <code>&#60;li&#62;</code> element of the menu bar item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-38450247">HTMLOptGroupElement</a>} p_oObject Object
+* specifying the <code>&#60;optgroup&#62;</code> element of the menu bar item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-70901257">HTMLOptionElement</a>} p_oObject Object specifying
+* the <code>&#60;option&#62;</code> element of the menu bar item.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the menu bar item. See configuration class documentation
+* for more details.
+* @class MenuBarItem
+* @constructor
+* @extends YAHOO.widget.MenuItem
+*/
+YAHOO.widget.MenuBarItem = function(p_oObject, p_oConfig) {
+
+    YAHOO.widget.MenuBarItem.superclass.constructor.call(
+        this,
+        p_oObject,
+        p_oConfig
+    );
+
+};
+
+YAHOO.extend(YAHOO.widget.MenuBarItem, YAHOO.widget.MenuItem, {
+
+/**
+* @method init
+* @description The MenuBarItem class's initialization method. This method is
+* automatically called by the constructor, and sets up all DOM references for
+* pre-existing markup, and creates required markup if it is not already present.
+* @param {String} p_oObject String specifying the text of the menu bar item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-74680021">HTMLLIElement</a>} p_oObject Object specifying the
+* <code>&#60;li&#62;</code> element of the menu bar item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-38450247">HTMLOptGroupElement</a>} p_oObject Object
+* specifying the <code>&#60;optgroup&#62;</code> element of the menu bar item.
+* @param {<a href="http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-
+* one-html.html#ID-70901257">HTMLOptionElement</a>} p_oObject Object specifying
+* the <code>&#60;option&#62;</code> element of the menu bar item.
+* @param {Object} p_oConfig Optional. Object literal specifying the
+* configuration for the menu bar item. See configuration class documentation
+* for more details.
+*/
+init: function(p_oObject, p_oConfig) {
+
+    if(!this.SUBMENU_TYPE) {
+
+        this.SUBMENU_TYPE = YAHOO.widget.Menu;
+
+    }
+
+    /*
+        Call the init of the superclass (YAHOO.widget.MenuItem)
+        Note: We don't pass the user config in here yet
+        because we only want it executed once, at the lowest
+        subclass level.
+    */
+
+    YAHOO.widget.MenuBarItem.superclass.init.call(this, p_oObject);
+
+    var oConfig = this.cfg;
+
+    if(p_oConfig) {
+
+        oConfig.applyConfig(p_oConfig, true);
+
+    }
+
+    oConfig.fireQueue();
+
+},
+
+// Constants
+
+/**
+* @property CSS_CLASS_NAME
+* @description String representing the CSS class(es) to be applied to the
+* <code>&#60;li&#62;</code> element of the menu bar item.
+* @default "yuimenubaritem"
+* @final
+* @type String
+*/
+CSS_CLASS_NAME: "yuimenubaritem",
+
+/**
+* @property SUBMENU_INDICATOR_IMAGE_PATH
+* @description String representing the path to the image to be used for the
+* menu bar item's submenu arrow indicator.
+* @default "nt/ic/ut/alt1/menuarodwn8_nrm_1.gif"
+* @final
+* @type String
+*/
+SUBMENU_INDICATOR_IMAGE_PATH: "nt/ic/ut/alt1/menuarodwn8_nrm_1.gif",
+
+/**
+* @property SELECTED_SUBMENU_INDICATOR_IMAGE_PATH
+* @description String representing the path to the image to be used for the
+* submenu arrow indicator when the menu bar item is selected.
+* @default "nt/ic/ut/alt1/menuarodwn8_hov_1.gif"
+* @final
+* @type String
+*/
+SELECTED_SUBMENU_INDICATOR_IMAGE_PATH: "nt/ic/ut/alt1/menuarodwn8_hov_1.gif",
+
+/**
+* @property DISABLED_SUBMENU_INDICATOR_IMAGE_PATH
+* @description String representing the path to the image to be used for the
+* submenu arrow indicator when the menu bar item is disabled.
+* @default "nt/ic/ut/alt1/menuarodwn8_dim_1.gif"
+* @final
+* @type String
+*/
+DISABLED_SUBMENU_INDICATOR_IMAGE_PATH: "nt/ic/ut/alt1/menuarodwn8_dim_1.gif",
+
+// Public methods
+
+/**
+* @method toString
+* @description Returns a string representing the menu bar item.
+* @return {String}
+*/
+toString: function() {
+
+    return ("MenuBarItem: " + this.cfg.getProperty("text"));
+
+}
+
+}); // END YAHOO.extend
+
diff --git a/frontend/beta/js/YUI/slider.js b/frontend/beta/js/YUI/slider.js
new file mode 100644
index 0000000..8d3cd62
--- a/dev/null
+++ b/frontend/beta/js/YUI/slider.js
@@ -0,0 +1,1113 @@
+/*                                                                                                                                                      
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 0.12.0
+*/ 
+
+/**
+ * The Slider component is a UI control that enables the user to adjust 
+ * values in a finite range along one or two axes. Typically, the Slider 
+ * control is used in a web application as a rich, visual replacement 
+ * for an input box that takes a number as input. The Slider control can 
+ * also easily accommodate a second dimension, providing x,y output for 
+ * a selection point chosen from a rectangular region.
+ *
+ * @module    slider
+ * @title     Slider Widget
+ * @namespace YAHOO.widget
+ * @requires  yahoo,dom,dragdrop,event
+ * @optional  animation
+ */
+
+/**
+ * A DragDrop implementation that can be used as a background for a
+ * slider.  It takes a reference to the thumb instance 
+ * so it can delegate some of the events to it.  The goal is to make the 
+ * thumb jump to the location on the background when the background is 
+ * clicked.  
+ *
+ * @class Slider
+ * @extends YAHOO.util.DragDrop
+ * @constructor
+ * @param {String} id     The id of the element linked to this instance
+ * @param {String} sGroup The group of related DragDrop items
+ * @param {String} sType  The type of slider (horiz, vert, region)
+ */
+YAHOO.widget.Slider = function(sElementId, sGroup, oThumb, sType) {
+    if (sElementId) {
+
+        /**
+         * The type of the slider (horiz, vert, region)
+         * @property type
+         * @type string
+         */
+        this.type = sType;
+
+        this.init(sElementId, sGroup, true);
+
+        //this.removeInvalidHandleType("A");
+
+
+        var self = this;
+
+        /**
+         * Event the fires when the value of the control changes.  If 
+         * the control is animated the event will fire every point
+         * along the way.
+         * @event change
+         * @param {int} new
+         * @param {int} firstOffset the number of pixels the thumb has moved
+         * from its start position. Normal horizontal and vertical sliders will only
+         * have the firstOffset.  Regions will have both, the first is the horizontal
+         * offset, the second the vertical.
+         * @param {int} secondOffset the y offset for region sliders
+         */
+        this.createEvent("change", this);
+
+        /**
+         * Event that fires at the end of a slider thumb move.
+         * @event slideStart
+         */
+        this.createEvent("slideStart", this);
+
+        /**
+         * Event that fires at the end of a slider thumb move
+         * @event slideEnd
+         */
+        this.createEvent("slideEnd", this);
+
+        /**
+         * A YAHOO.widget.SliderThumb instance that we will use to 
+         * reposition the thumb when the background is clicked
+         * @property thumb
+         * @type YAHOO.widget.SliderThumb
+         */
+        this.thumb = oThumb;
+
+        // add handler for the handle onchange event
+        oThumb.onChange = function() { 
+            self.handleThumbChange(); 
+        };
+
+        /**
+         * Overrides the isTarget property in YAHOO.util.DragDrop
+         * @property isTarget
+         * @private
+         */
+        this.isTarget = false;
+    
+        /**
+         * Flag that determines if the thumb will animate when moved
+         * @property animate
+         * @type boolean
+         */
+        this.animate = YAHOO.widget.Slider.ANIM_AVAIL;
+
+        /**
+         * Set to false to disable a background click thumb move
+         * @property backgroundEnabled
+         * @type boolean
+         */
+        this.backgroundEnabled = true;
+
+        /**
+         * Adjustment factor for tick animation, the more ticks, the
+         * faster the animation (by default)
+         * @property tickPause
+         * @type int
+         */
+        this.tickPause = 40;
+
+        /**
+         * Enables the arrow, home and end keys, defaults to true.
+         * @property enableKeys
+         * @type boolean
+         */
+        this.enableKeys = true;
+
+        /**
+         * Specifies the number of pixels the arrow keys will move the slider.
+         * Default is 25.
+         * @property keyIncrement
+         * @type int
+         */
+        this.keyIncrement = 20;
+
+        /**
+         * moveComplete is set to true when the slider has moved to its final
+         * destination.  For animated slider, this value can be checked in 
+         * the onChange handler to make it possible to execute logic only
+         * when the move is complete rather than at all points along the way.
+         *
+         * @property moveComplete
+         * @type Boolean
+         */
+        this.moveComplete = true;
+
+        /**
+         * If animation is configured, specifies the length of the animation
+         * in seconds.
+         * @property animationDuration
+         * @type int
+         * @default 0.2
+         */
+        this.animationDuration = 0.2;
+
+        if (oThumb._isHoriz && oThumb.xTicks && oThumb.xTicks.length) {
+            this.tickPause = Math.round(360 / oThumb.xTicks.length);
+        } else if (oThumb.yTicks && oThumb.yTicks.length) {
+            this.tickPause = Math.round(360 / oThumb.yTicks.length);
+        }
+
+
+        // delegate thumb methods
+        oThumb.onMouseDown = function () { return self.focus(); };
+        //oThumb.b4MouseDown = function () { return self.b4MouseDown(); };
+        // oThumb.lock = function() { self.lock(); };
+        // oThumb.unlock = function() { self.unlock(); };
+        oThumb.onMouseUp = function() { self.thumbMouseUp(); };
+        oThumb.onDrag = function() { self.fireEvents(); };
+        oThumb.onAvailable = function() { return self.setStartSliderState(); };
+    }
+};
+
+/**
+ * Factory method for creating a horizontal slider
+ * @method YAHOO.widget.Slider.getHorizSlider
+ * @static
+ * @param {String} sBGElId the id of the slider's background element
+ * @param {String} sHandleElId the id of the thumb element
+ * @param {int} iLeft the number of pixels the element can move left
+ * @param {int} iRight the number of pixels the element can move right
+ * @param {int} iTickSize optional parameter for specifying that the element 
+ * should move a certain number pixels at a time.
+ * @return {Slider} a horizontal slider control
+ */
+YAHOO.widget.Slider.getHorizSlider = 
+    function (sBGElId, sHandleElId, iLeft, iRight, iTickSize) {
+        return new YAHOO.widget.Slider(sBGElId, sBGElId, 
+            new YAHOO.widget.SliderThumb(sHandleElId, sBGElId, 
+                               iLeft, iRight, 0, 0, iTickSize), "horiz");
+};
+
+/**
+ * Factory method for creating a vertical slider
+ * @method YAHOO.widget.Slider.getVertSlider
+ * @static
+ * @param {String} sBGElId the id of the slider's background element
+ * @param {String} sHandleElId the id of the thumb element
+ * @param {int} iUp the number of pixels the element can move up
+ * @param {int} iDown the number of pixels the element can move down
+ * @param {int} iTickSize optional parameter for specifying that the element 
+ * should move a certain number pixels at a time.
+ * @return {Slider} a vertical slider control
+ */
+YAHOO.widget.Slider.getVertSlider = 
+    function (sBGElId, sHandleElId, iUp, iDown, iTickSize) {
+        return new YAHOO.widget.Slider(sBGElId, sBGElId, 
+            new YAHOO.widget.SliderThumb(sHandleElId, sBGElId, 0, 0, 
+                               iUp, iDown, iTickSize), "vert");
+};
+
+/**
+ * Factory method for creating a slider region like the one in the color
+ * picker example
+ * @method YAHOO.widget.Slider.getSliderRegion
+ * @static
+ * @param {String} sBGElId the id of the slider's background element
+ * @param {String} sHandleElId the id of the thumb element
+ * @param {int} iLeft the number of pixels the element can move left
+ * @param {int} iRight the number of pixels the element can move right
+ * @param {int} iUp the number of pixels the element can move up
+ * @param {int} iDown the number of pixels the element can move down
+ * @param {int} iTickSize optional parameter for specifying that the element 
+ * should move a certain number pixels at a time.
+ * @return {Slider} a slider region control
+ */
+YAHOO.widget.Slider.getSliderRegion = 
+    function (sBGElId, sHandleElId, iLeft, iRight, iUp, iDown, iTickSize) {
+        return new YAHOO.widget.Slider(sBGElId, sBGElId, 
+            new YAHOO.widget.SliderThumb(sHandleElId, sBGElId, iLeft, iRight, 
+                               iUp, iDown, iTickSize), "region");
+};
+
+/**
+ * By default, animation is available if the animation library is detected.
+ * @property YAHOO.widget.Slider.ANIM_AVAIL
+ * @static
+ * @type boolean
+ */
+YAHOO.widget.Slider.ANIM_AVAIL = true;
+
+YAHOO.extend(YAHOO.widget.Slider, YAHOO.util.DragDrop, {
+
+    onAvailable: function() {
+        var Event = YAHOO.util.Event;
+        Event.on(this.id, "keydown",  this.handleKeyDown,  this, true);
+        Event.on(this.id, "keypress", this.handleKeyPress, this, true);
+    },
+ 
+    handleKeyPress: function(e) {
+        if (this.enableKeys) {
+            var Event = YAHOO.util.Event;
+            var kc = Event.getCharCode(e);
+            switch (kc) {
+                case 0x25: // left
+                case 0x26: // up
+                case 0x27: // right
+                case 0x28: // down
+                case 0x24: // home
+                case 0x23: // end
+                    Event.preventDefault(e);
+                    break;
+                default:
+            }
+        }
+   },
+
+    handleKeyDown: function(e) {
+        if (this.enableKeys) {
+            var Event = YAHOO.util.Event;
+
+            var kc = Event.getCharCode(e), t=this.thumb;
+            var h=this.getXValue(),v=this.getYValue();
+
+            var horiz = false;
+            var changeValue = true;
+            switch (kc) {
+
+                // left
+                case 0x25: h -= this.keyIncrement; break;
+
+                // up
+                case 0x26: v -= this.keyIncrement; break;
+
+                // right
+                case 0x27: h += this.keyIncrement; break;
+
+                // down
+                case 0x28: v += this.keyIncrement; break;
+
+                // home
+                case 0x24: h = t.leftConstraint;    
+                           v = t.topConstraint;    
+                           break;
+
+                // end
+                case 0x23: h = t.rightConstraint; 
+                           v = t.bottomConstraint;    
+                           break;
+
+                default:   changeValue = false;
+            }
+
+            if (changeValue) {
+                if (t._isRegion) {
+                    this.setRegionValue(h, v, true);
+                } else {
+                    var newVal = (t._isHoriz) ? h : v;
+                    this.setValue(newVal, true);
+                }
+                Event.stopEvent(e);
+            }
+
+        }
+    },
+
+    /**
+     * Initialization that sets up the value offsets once the elements are ready
+     * @method setSliderStartState
+     */
+    setStartSliderState: function() {
+
+
+        this.setThumbCenterPoint();
+
+        /**
+         * The basline position of the background element, used
+         * to determine if the background has moved since the last
+         * operation.
+         * @property baselinePos
+         * @type [int, int]
+         */
+        this.baselinePos = YAHOO.util.Dom.getXY(this.getEl());
+
+        this.thumb.startOffset = this.thumb.getOffsetFromParent(this.baselinePos);
+
+        if (this.thumb._isRegion) {
+            if (this.deferredSetRegionValue) {
+                this.setRegionValue.apply(this, this.deferredSetRegionValue, true);
+                this.deferredSetRegionValue = null;
+            } else {
+                this.setRegionValue(0, 0, true);
+            }
+        } else {
+            if (this.deferredSetValue) {
+                this.setValue.apply(this, this.deferredSetValue, true);
+                this.deferredSetValue = null;
+            } else {
+                this.setValue(0, true, true);
+            }
+        }
+    },
+
+    /**
+     * When the thumb is available, we cache the centerpoint of the element so
+     * we can position the element correctly when the background is clicked
+     * @method setThumbCenterPoint
+     */
+    setThumbCenterPoint: function() {
+
+        var el = this.thumb.getEl();
+
+        if (el) {
+            /**
+             * The center of the slider element is stored so we can position 
+             * place it in the correct position when the background is clicked
+             * @property thumbCenterPoint
+             * @type {"x": int, "y": int}
+             */
+            this.thumbCenterPoint = { 
+                    x: parseInt(el.offsetWidth/2, 10), 
+                    y: parseInt(el.offsetHeight/2, 10) 
+            };
+        }
+
+    },
+
+    /**
+     * Locks the slider, overrides YAHOO.util.DragDrop
+     * @method lock
+     */
+    lock: function() {
+        this.thumb.lock();
+        this.locked = true;
+    },
+
+    /**
+     * Unlocks the slider, overrides YAHOO.util.DragDrop
+     * @method unlock
+     */
+    unlock: function() {
+        this.thumb.unlock();
+        this.locked = false;
+    },
+
+    /**
+     * Handles mouseup event on the slider background
+     * @method thumbMouseUp
+     * @private
+     */
+    thumbMouseUp: function() {
+        if (!this.isLocked() && !this.moveComplete) {
+            this.endMove();
+        }
+
+    },
+
+    /**
+     * Returns a reference to this slider's thumb
+     * @method getThumb
+     * @return {SliderThumb} this slider's thumb
+     */
+    getThumb: function() {
+        return this.thumb;
+    },
+
+    /**
+     * Try to focus the element when clicked so we can add
+     * accessibility features
+     * @method focus
+     * @private
+     */
+    focus: function() {
+
+        // Focus the background element if possible
+        var el = this.getEl();
+
+        if (el.focus) {
+            try {
+                el.focus();
+            } catch(e) {
+                // Prevent permission denied unhandled exception in FF that can
+                // happen when setting focus while another element is handling
+                // the blur.  @TODO this is still writing to the error log 
+                // (unhandled error) in FF1.5 with strict error checking on.
+            }
+        }
+
+        this.verifyOffset();
+
+        if (this.isLocked()) {
+            return false;
+        } else {
+            this.onSlideStart();
+            return true;
+        }
+    },
+
+    /**
+     * Event that fires when the value of the slider has changed
+     * @method onChange
+     * @param {int} firstOffset the number of pixels the thumb has moved
+     * from its start position. Normal horizontal and vertical sliders will only
+     * have the firstOffset.  Regions will have both, the first is the horizontal
+     * offset, the second the vertical.
+     * @param {int} secondOffset the y offset for region sliders
+     * @deprecated use instance.subscribe("change") instead
+     */
+    onChange: function (firstOffset, secondOffset) { 
+        /* override me */ 
+    },
+
+    /**
+     * Event that fires when the at the beginning of the slider thumb move
+     * @method onSlideStart
+     * @deprecated use instance.subscribe("slideStart") instead
+     */
+    onSlideStart: function () { 
+        /* override me */ 
+    },
+
+    /**
+     * Event that fires at the end of a slider thumb move
+     * @method onSliderEnd
+     * @deprecated use instance.subscribe("slideEnd") instead
+     */
+    onSlideEnd: function () { 
+        /* override me */ 
+    },
+
+    /**
+     * Returns the slider's thumb offset from the start position
+     * @method getValue
+     * @return {int} the current value
+     */
+    getValue: function () { 
+        return this.thumb.getValue();
+    },
+
+    /**
+     * Returns the slider's thumb X offset from the start position
+     * @method getXValue
+     * @return {int} the current horizontal offset
+     */
+    getXValue: function () { 
+        return this.thumb.getXValue();
+    },
+
+    /**
+     * Returns the slider's thumb Y offset from the start position
+     * @method getYValue
+     * @return {int} the current vertical offset
+     */
+    getYValue: function () { 
+        return this.thumb.getYValue();
+    },
+
+    /**
+     * Internal handler for the slider thumb's onChange event
+     * @method handleThumbChange
+     * @private
+     */
+    handleThumbChange: function () { 
+        var t = this.thumb;
+        if (t._isRegion) {
+            t.onChange(t.getXValue(), t.getYValue());
+            this.fireEvent("change", { x: t.getXValue(), y: t.getYValue() } );
+        } else {
+            t.onChange(t.getValue());
+            this.fireEvent("change", t.getValue());
+        }
+
+    },
+
+    /**
+     * Provides a way to set the value of the slider in code.
+     * @method setValue
+     * @param {int} newOffset the number of pixels the thumb should be
+     * positioned away from the initial start point 
+     * @param {boolean} skipAnim set to true to disable the animation
+     * for this move action (but not others).
+     * @param {boolean} force ignore the locked setting and set value anyway
+     * @return {boolean} true if the move was performed, false if it failed
+     */
+    setValue: function(newOffset, skipAnim, force) {
+
+        if (!this.thumb.available) {
+            this.deferredSetValue = arguments;
+            return false;
+        }
+
+        if (this.isLocked() && !force) {
+            return false;
+        }
+
+        if ( isNaN(newOffset) ) {
+            return false;
+        }
+
+        var t = this.thumb;
+        var newX, newY;
+        this.verifyOffset();
+        if (t._isRegion) {
+            return false;
+        } else if (t._isHoriz) {
+            this.onSlideStart();
+            // this.fireEvent("slideStart");
+            newX = t.initPageX + newOffset + this.thumbCenterPoint.x;
+            this.moveThumb(newX, t.initPageY, skipAnim);
+        } else {
+            this.onSlideStart();
+            // this.fireEvent("slideStart");
+            newY = t.initPageY + newOffset + this.thumbCenterPoint.y;
+            this.moveThumb(t.initPageX, newY, skipAnim);
+        }
+
+        return true;
+    },
+
+    /**
+     * Provides a way to set the value of the region slider in code.
+     * @method setRegionValue
+     * @param {int} newOffset the number of pixels the thumb should be
+     * positioned away from the initial start point (x axis for region)
+     * @param {int} newOffset2 the number of pixels the thumb should be
+     * positioned away from the initial start point (y axis for region)
+     * @param {boolean} skipAnim set to true to disable the animation
+     * for this move action (but not others).
+     * @param {boolean} force ignore the locked setting and set value anyway
+     * @return {boolean} true if the move was performed, false if it failed
+     */
+    setRegionValue: function(newOffset, newOffset2, skipAnim) {
+
+        if (!this.thumb.available) {
+            this.deferredSetRegionValue = arguments;
+            return false;
+        }
+
+        if (this.isLocked() && !force) {
+            return false;
+        }
+
+        if ( isNaN(newOffset) ) {
+            return false;
+        }
+
+        var t = this.thumb;
+        if (t._isRegion) {
+            this.onSlideStart();
+            var newX = t.initPageX + newOffset + this.thumbCenterPoint.x;
+            var newY = t.initPageY + newOffset2 + this.thumbCenterPoint.y;
+            this.moveThumb(newX, newY, skipAnim);
+            return true;
+        }
+
+        return false;
+
+    },
+
+    /**
+     * Checks the background position element position.  If it has moved from the
+     * baseline position, the constraints for the thumb are reset
+     * @method verifyOffset
+     * @return {boolean} True if the offset is the same as the baseline.
+     */
+    verifyOffset: function() {
+
+        var newPos = YAHOO.util.Dom.getXY(this.getEl());
+
+        if (newPos[0] != this.baselinePos[0] || newPos[1] != this.baselinePos[1]) {
+            this.thumb.resetConstraints();
+            this.baselinePos = newPos;
+            return false;
+        }
+
+        return true;
+    },
+
+    /**
+     * Move the associated slider moved to a timeout to try to get around the 
+     * mousedown stealing moz does when I move the slider element between the 
+     * cursor and the background during the mouseup event
+     * @method moveThumb
+     * @param {int} x the X coordinate of the click
+     * @param {int} y the Y coordinate of the click
+     * @param {boolean} skipAnim don't animate if the move happend onDrag
+     * @private
+     */
+    moveThumb: function(x, y, skipAnim) {
+
+
+        var t = this.thumb;
+        var self = this;
+
+        if (!t.available) {
+            return;
+        }
+
+
+        // this.verifyOffset();
+
+        t.setDelta(this.thumbCenterPoint.x, this.thumbCenterPoint.y);
+
+        var _p = t.getTargetCoord(x, y);
+        var p = [_p.x, _p.y];
+
+        this.fireEvent("slideStart");
+
+        if (this.animate && YAHOO.widget.Slider.ANIM_AVAIL && t._graduated && !skipAnim) {
+            // this.thumb._animating = true;
+            this.lock();
+            
+            setTimeout( function() { self.moveOneTick(p); }, this.tickPause );
+
+        } else if (this.animate && YAHOO.widget.Slider.ANIM_AVAIL && !skipAnim) {
+
+            // this.thumb._animating = true;
+            this.lock();
+
+            var oAnim = new YAHOO.util.Motion( 
+                    t.id, { points: { to: p } }, 
+                    this.animationDuration, 
+                    YAHOO.util.Easing.easeOut );
+
+            oAnim.onComplete.subscribe( function() { self.endMove(); } );
+            oAnim.animate();
+        } else {
+            t.setDragElPos(x, y);
+            // this.fireEvents();
+            this.endMove();
+        }
+    },
+
+    /**
+     * Move the slider one tick mark towards its final coordinate.  Used
+     * for the animation when tick marks are defined
+     * @method moveOneTick
+     * @param {int[]} the destination coordinate
+     * @private
+     */
+    moveOneTick: function(finalCoord) {
+
+        var t = this.thumb;
+        var curCoord = YAHOO.util.Dom.getXY(t.getEl());
+        var tmp;
+
+        // var thresh = Math.min(t.tickSize + (Math.floor(t.tickSize/2)), 10);
+        // var thresh = 10;
+        // var thresh = t.tickSize + (Math.floor(t.tickSize/2));
+
+        var nextCoord = null;
+
+        if (t._isRegion) {
+            nextCoord = this._getNextX(curCoord, finalCoord);
+            var tmpX = (nextCoord) ? nextCoord[0] : curCoord[0];
+            nextCoord = this._getNextY([tmpX, curCoord[1]], finalCoord);
+
+        } else if (t._isHoriz) {
+            nextCoord = this._getNextX(curCoord, finalCoord);
+        } else {
+            nextCoord = this._getNextY(curCoord, finalCoord);
+        }
+
+
+        if (nextCoord) {
+
+            // move to the next coord
+            // YAHOO.util.Dom.setXY(t.getEl(), nextCoord);
+
+            // var el = t.getEl();
+            // YAHOO.util.Dom.setStyle(el, "left", (nextCoord[0] + this.thumb.deltaSetXY[0]) + "px");
+            // YAHOO.util.Dom.setStyle(el, "top",  (nextCoord[1] + this.thumb.deltaSetXY[1]) + "px");
+
+            this.thumb.alignElWithMouse(t.getEl(), nextCoord[0], nextCoord[1]);
+            
+            // check if we are in the final position, if not make a recursive call
+            if (!(nextCoord[0] == finalCoord[0] && nextCoord[1] == finalCoord[1])) {
+                var self = this;
+                setTimeout(function() { self.moveOneTick(finalCoord); }, 
+                        this.tickPause);
+            } else {
+                this.endMove();
+            }
+        } else {
+            this.endMove();
+        }
+
+        //this.tickPause = Math.round(this.tickPause/2);
+    },
+
+    /**
+     * Returns the next X tick value based on the current coord and the target coord.
+     * @method _getNextX
+     * @private
+     */
+    _getNextX: function(curCoord, finalCoord) {
+        var t = this.thumb;
+        var thresh;
+        var tmp = [];
+        var nextCoord = null;
+        if (curCoord[0] > finalCoord[0]) {
+            thresh = t.tickSize - this.thumbCenterPoint.x;
+            tmp = t.getTargetCoord( curCoord[0] - thresh, curCoord[1] );
+            nextCoord = [tmp.x, tmp.y];
+        } else if (curCoord[0] < finalCoord[0]) {
+            thresh = t.tickSize + this.thumbCenterPoint.x;
+            tmp = t.getTargetCoord( curCoord[0] + thresh, curCoord[1] );
+            nextCoord = [tmp.x, tmp.y];
+        } else {
+            // equal, do nothing
+        }
+
+        return nextCoord;
+    },
+
+    /**
+     * Returns the next Y tick value based on the current coord and the target coord.
+     * @method _getNextY
+     * @private
+     */
+    _getNextY: function(curCoord, finalCoord) {
+        var t = this.thumb;
+        var thresh;
+        var tmp = [];
+        var nextCoord = null;
+
+        if (curCoord[1] > finalCoord[1]) {
+            thresh = t.tickSize - this.thumbCenterPoint.y;
+            tmp = t.getTargetCoord( curCoord[0], curCoord[1] - thresh );
+            nextCoord = [tmp.x, tmp.y];
+        } else if (curCoord[1] < finalCoord[1]) {
+            thresh = t.tickSize + this.thumbCenterPoint.y;
+            tmp = t.getTargetCoord( curCoord[0], curCoord[1] + thresh );
+            nextCoord = [tmp.x, tmp.y];
+        } else {
+            // equal, do nothing
+        }
+
+        return nextCoord;
+    },
+
+    /**
+     * Resets the constraints before moving the thumb.
+     * @method b4MouseDown
+     * @private
+     */
+    b4MouseDown: function(e) {
+        this.thumb.autoOffset();
+        this.thumb.resetConstraints();
+    },
+
+    /**
+     * Handles the mousedown event for the slider background
+     * @method onMouseDown
+     * @private
+     */
+    onMouseDown: function(e) {
+        // this.resetConstraints(true);
+        // this.thumb.resetConstraints(true);
+
+        if (! this.isLocked() && this.backgroundEnabled) {
+            var x = YAHOO.util.Event.getPageX(e);
+            var y = YAHOO.util.Event.getPageY(e);
+
+            this.focus();
+            this.moveThumb(x, y);
+        }
+        
+    },
+
+    /**
+     * Handles the onDrag event for the slider background
+     * @method onDrag
+     * @private
+     */
+    onDrag: function(e) {
+        if (! this.isLocked()) {
+            var x = YAHOO.util.Event.getPageX(e);
+            var y = YAHOO.util.Event.getPageY(e);
+            this.moveThumb(x, y, true);
+        }
+    },
+
+    /**
+     * Fired when the slider movement ends
+     * @method endMove
+     * @private
+     */
+    endMove: function () {
+        // this._animating = false;
+        this.unlock();
+        this.moveComplete = true;
+        this.fireEvents();
+    },
+
+    /**
+     * Fires the change event if the value has been changed.  Ignored if we are in
+     * the middle of an animation as the event will fire when the animation is
+     * complete
+     * @method fireEvents
+     * @private
+     */
+    fireEvents: function () {
+
+        var t = this.thumb;
+
+        t.cachePosition();
+
+        if (! this.isLocked()) {
+            if (t._isRegion) {
+                var newX = t.getXValue();
+                var newY = t.getYValue();
+
+                if (newX != this.previousX || newY != this.previousY) {
+                    this.onChange(newX, newY);
+                    this.fireEvent("change", { x: newX, y: newY });
+                }
+
+                this.previousX = newX;
+                this.previousY = newY;
+
+            } else {
+                var newVal = t.getValue();
+                if (newVal != this.previousVal) {
+                    this.onChange( newVal );
+                    this.fireEvent("change", newVal);
+                }
+                this.previousVal = newVal;
+            }
+
+            if (this.moveComplete) {
+                this.onSlideEnd();
+                this.fireEvent("slideEnd");
+                this.moveComplete = false;
+            }
+
+        }
+    },
+
+    /**
+     * Slider toString
+     * @method toString
+     * @return {string} string representation of the instance
+     */
+    toString: function () { 
+        return ("Slider (" + this.type +") " + this.id);
+    }
+
+});
+
+YAHOO.augment(YAHOO.widget.Slider, YAHOO.util.EventProvider);
+
+/**
+ * A drag and drop implementation to be used as the thumb of a slider.
+ * @class SliderThumb
+ * @extends YAHOO.util.DD
+ * @constructor
+ * @param {String} id the id of the slider html element
+ * @param {String} sGroup the group of related DragDrop items
+ * @param {int} iLeft the number of pixels the element can move left
+ * @param {int} iRight the number of pixels the element can move right
+ * @param {int} iUp the number of pixels the element can move up
+ * @param {int} iDown the number of pixels the element can move down
+ * @param {int} iTickSize optional parameter for specifying that the element 
+ * should move a certain number pixels at a time.
+ */
+YAHOO.widget.SliderThumb = function(id, sGroup, iLeft, iRight, iUp, iDown, iTickSize) {
+
+    if (id) {
+        this.init(id, sGroup);
+
+        /**
+         * The id of the thumbs parent HTML element (the slider background 
+         * element).
+         * @property parentElId
+         * @type string
+         */
+        this.parentElId = sGroup;
+    }
+
+    //this.removeInvalidHandleType("A");
+
+
+    /**
+     * Overrides the isTarget property in YAHOO.util.DragDrop
+     * @property isTarget
+     * @private
+     */
+    this.isTarget = false;
+
+    /**
+     * The tick size for this slider
+     * @property tickSize
+     * @type int
+     * @private
+     */
+    this.tickSize = iTickSize;
+
+    /**
+     * Informs the drag and drop util that the offsets should remain when
+     * resetting the constraints.  This preserves the slider value when
+     * the constraints are reset
+     * @property maintainOffset
+     * @type boolean
+     * @private
+     */
+    this.maintainOffset = true;
+
+    this.initSlider(iLeft, iRight, iUp, iDown, iTickSize);
+
+    /**
+     * Turns off the autoscroll feature in drag and drop
+     * @property scroll
+     * @private
+     */
+    this.scroll = false;
+
+}; 
+
+YAHOO.extend(YAHOO.widget.SliderThumb, YAHOO.util.DD, {
+
+    /**
+     * The (X and Y) difference between the thumb location and its parent 
+     * (the slider background) when the control is instantiated.
+     * @property startOffset
+     * @type [int, int]
+     */
+    startOffset: null,
+
+    /**
+     * Flag used to figure out if this is a horizontal or vertical slider
+     * @property _isHoriz
+     * @type boolean
+     * @private
+     */
+    _isHoriz: false,
+
+    /**
+     * Cache the last value so we can check for change
+     * @property _prevVal
+     * @type int
+     * @private
+     */
+    _prevVal: 0,
+
+    /**
+     * The slider is _graduated if there is a tick interval defined
+     * @property _graduated
+     * @type boolean
+     * @private
+     */
+    _graduated: false,
+
+    /**
+     * Returns the difference between the location of the thumb and its parent.
+     * @method getOffsetFromParent
+     * @param {[int, int]} parentPos Optionally accepts the position of the parent
+     * @type [int, int]
+     */
+    getOffsetFromParent: function(parentPos) {
+        var myPos = YAHOO.util.Dom.getXY(this.getEl());
+        var ppos  = parentPos || YAHOO.util.Dom.getXY(this.parentElId);
+
+        return [ (myPos[0] - ppos[0]), (myPos[1] - ppos[1]) ];
+    },
+
+    /**
+     * Set up the slider, must be called in the constructor of all subclasses
+     * @method initSlider
+     * @param {int} iLeft the number of pixels the element can move left
+     * @param {int} iRight the number of pixels the element can move right
+     * @param {int} iUp the number of pixels the element can move up
+     * @param {int} iDown the number of pixels the element can move down
+     * @param {int} iTickSize the width of the tick interval.
+     */
+    initSlider: function (iLeft, iRight, iUp, iDown, iTickSize) {
+
+        this.setXConstraint(iLeft, iRight, iTickSize);
+        this.setYConstraint(iUp, iDown, iTickSize);
+
+        if (iTickSize && iTickSize > 1) {
+            this._graduated = true;
+        }
+
+        this._isHoriz  = (iLeft || iRight); 
+        this._isVert   = (iUp   || iDown);
+        this._isRegion = (this._isHoriz && this._isVert); 
+
+    },
+
+    /**
+     * Clear's the slider's ticks
+     * @method clearTicks
+     */
+    clearTicks: function () {
+        YAHOO.widget.SliderThumb.superclass.clearTicks.call(this);
+        this._graduated = false;
+    },
+
+    /**
+     * Gets the current offset from the element's start position in
+     * pixels.
+     * @method getValue
+     * @return {int} the number of pixels (positive or negative) the
+     * slider has moved from the start position.
+     */
+    getValue: function () {
+        if (!this.available) { return 0; }
+        var val = (this._isHoriz) ? this.getXValue() : this.getYValue();
+        return val;
+    },
+
+    /**
+     * Gets the current X offset from the element's start position in
+     * pixels.
+     * @method getXValue
+     * @return {int} the number of pixels (positive or negative) the
+     * slider has moved horizontally from the start position.
+     */
+    getXValue: function () {
+        if (!this.available) { return 0; }
+        var newOffset = this.getOffsetFromParent();
+        return (newOffset[0] - this.startOffset[0]);
+    },
+
+    /**
+     * Gets the current Y offset from the element's start position in
+     * pixels.
+     * @method getYValue
+     * @return {int} the number of pixels (positive or negative) the
+     * slider has moved vertically from the start position.
+     */
+    getYValue: function () {
+        if (!this.available) { return 0; }
+        var newOffset = this.getOffsetFromParent();
+        return (newOffset[1] - this.startOffset[1]);
+    },
+
+    /**
+     * Thumb toString
+     * @method toString
+     * @return {string} string representation of the instance
+     */
+    toString: function () { 
+        return "SliderThumb " + this.id;
+    },
+
+    /**
+     * The onchange event for the handle/thumb is delegated to the YAHOO.widget.Slider
+     * instance it belongs to.
+     * @method onChange
+     * @private
+     */
+    onChange: function (x, y) { 
+    }
+
+});
+
+if ("undefined" == typeof YAHOO.util.Anim) {
+    YAHOO.widget.Slider.ANIM_AVAIL = false;
+}
+
diff --git a/frontend/beta/js/YUI/tabview.js b/frontend/beta/js/YUI/tabview.js
new file mode 100644
index 0000000..34a09bb
--- a/dev/null
+++ b/frontend/beta/js/YUI/tabview.js
@@ -0,0 +1,1950 @@
+/*
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 0.12.0
+*/
+(function() {
+
+    YAHOO.util.Lang = {
+        isArray: function(val) { // frames lose type, so test constructor string
+            if (val.constructor && val.constructor.toString().indexOf('Array') > -1) {
+                return true;
+            } else {
+                return YAHOO.util.Lang.isObject(val) && val.constructor == Array;
+            }
+        },
+
+        isBoolean: function(val) {
+            return typeof val == 'boolean';
+        },
+
+        isFunction: function(val) {
+            return typeof val == 'function';
+        },
+
+        isNull: function(val) {
+            return val === null;
+        },
+
+        isNumber: function(val) {
+            return !isNaN(val);
+        },
+
+        isObject: function(val) {
+            return typeof val == 'object' || YAHOO.util.Lang.isFunction(val);
+        },
+
+        isString: function(val) {
+            return typeof val == 'string';
+        },
+
+        isUndefined: function(val) {
+            return typeof val == 'undefined';
+        }
+    };
+})();/**
+ * Provides Attribute configurations.
+ * @namespace YAHOO.util
+ * @class Attribute
+ * @constructor
+ * @param hash {Object} The intial Attribute.
+ * @param {YAHOO.util.AttributeProvider} The owner of the Attribute instance.
+ */
+
+YAHOO.util.Attribute = function(hash, owner) {
+    if (owner) {
+        this.owner = owner;
+        this.configure(hash, true);
+    }
+};
+
+YAHOO.util.Attribute.prototype = {
+	/**
+     * The name of the attribute.
+	 * @property name
+	 * @type String
+	 */
+    name: undefined,
+
+	/**
+     * The value of the attribute.
+	 * @property value
+	 * @type String
+	 */
+    value: null,
+
+	/**
+     * The owner of the attribute.
+	 * @property owner
+	 * @type YAHOO.util.AttributeProvider
+	 */
+    owner: null,
+
+	/**
+     * Whether or not the attribute is read only.
+	 * @property readOnly
+	 * @type Boolean
+	 */
+    readOnly: false,
+
+	/**
+     * Whether or not the attribute can only be written once.
+	 * @property writeOnce
+	 * @type Boolean
+	 */
+    writeOnce: false,
+
+	/**
+     * The attribute's initial configuration.
+     * @private
+	 * @property _initialConfig
+	 * @type Object
+	 */
+    _initialConfig: null,
+
+	/**
+     * Whether or not the attribute's value has been set.
+     * @private
+	 * @property _written
+	 * @type Boolean
+	 */
+    _written: false,
+
+	/**
+     * The method to use when setting the attribute's value.
+     * The method recieves the new value as the only argument.
+	 * @property method
+	 * @type Function
+	 */
+    method: null,
+
+	/**
+     * The validator to use when setting the attribute's value.
+	 * @property validator
+	 * @type Function
+     * @return Boolean
+	 */
+    validator: null,
+
+    /**
+     * Retrieves the current value of the attribute.
+     * @method getValue
+     * @return {any} The current value of the attribute.
+     */
+    getValue: function() {
+        return this.value;
+    },
+
+    /**
+     * Sets the value of the attribute and fires beforeChange and change events.
+     * @method setValue
+     * @param {Any} value The value to apply to the attribute.
+     * @param {Boolean} silent If true the change events will not be fired.
+     * @return {Boolean} Whether or not the value was set.
+     */
+    setValue: function(value, silent) {
+        var beforeRetVal;
+        var owner = this.owner;
+        var name = this.name;
+
+        var event = {
+            type: name,
+            prevValue: this.getValue(),
+            newValue: value
+        };
+
+        if (this.readOnly || ( this.writeOnce && this._written) ) {
+            return false; // write not allowed
+        }
+
+        if (this.validator && !this.validator.call(owner, value) ) {
+            return false; // invalid value
+        }
+
+        if (!silent) {
+            beforeRetVal = owner.fireBeforeChangeEvent(event);
+            if (beforeRetVal === false) {
+                YAHOO.log('setValue ' + name +
+                        'cancelled by beforeChange event', 'info', 'Attribute');
+                return false;
+            }
+        }
+
+        if (this.method) {
+            this.method.call(owner, value);
+        }
+
+        this.value = value;
+        this._written = true;
+
+        event.type = name;
+
+        if (!silent) {
+            this.owner.fireChangeEvent(event);
+        }
+
+        return true;
+    },
+
+    /**
+     * Allows for configuring the Attribute's properties.
+     * @method configure
+     * @param {Object} map A key-value map of Attribute properties.
+     * @param {Boolean} init Whether or not this should become the initial config.
+     */
+    configure: function(map, init) {
+        map = map || {};
+        this._written = false; // reset writeOnce
+        this._initialConfig = this._initialConfig || {};
+
+        for (var key in map) {
+            if ( key && map.hasOwnProperty(key) ) {
+                this[key] = map[key];
+                if (init) {
+                    this._initialConfig[key] = map[key];
+                }
+            }
+        }
+    },
+
+    /**
+     * Resets the value to the initial config value.
+     * @method resetValue
+     * @return {Boolean} Whether or not the value was set.
+     */
+    resetValue: function() {
+        return this.setValue(this._initialConfig.value);
+    },
+
+    /**
+     * Resets the attribute config to the initial config state.
+     * @method resetConfig
+     */
+    resetConfig: function() {
+        this.configure(this._initialConfig);
+    },
+
+    /**
+     * Resets the value to the current value.
+     * Useful when values may have gotten out of sync with actual properties.
+     * @method refresh
+     * @return {Boolean} Whether or not the value was set.
+     */
+    refresh: function(silent) {
+        this.setValue(this.value, silent);
+    }
+};(function() {
+    var Lang = YAHOO.util.Lang;
+
+    /*
+    Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+    Code licensed under the BSD License:
+    http://developer.yahoo.net/yui/license.txt
+    */
+
+    /**
+     * Provides and manages YAHOO.util.Attribute instances
+     * @namespace YAHOO.util
+     * @class AttributeProvider
+     * @uses YAHOO.util.EventProvider
+     */
+    YAHOO.util.AttributeProvider = function() {};
+
+    YAHOO.util.AttributeProvider.prototype = {
+
+        /**
+         * A key-value map of Attribute configurations
+         * @property _configs
+         * @protected (may be used by subclasses and augmentors)
+         * @private
+         * @type {Object}
+         */
+        _configs: null,
+        /**
+         * Returns the current value of the attribute.
+         * @method get
+         * @param {String} key The attribute whose value will be returned.
+         */
+        get: function(key){
+            var configs = this._configs || {};
+            var config = configs[key];
+
+            if (!config) {
+                YAHOO.log(key + ' not found', 'error', 'AttributeProvider');
+                return undefined;
+            }
+
+            return config.value;
+        },
+
+        /**
+         * Sets the value of a config.
+         * @method set
+         * @param {String} key The name of the attribute
+         * @param {Any} value The value to apply to the attribute
+         * @param {Boolean} silent Whether or not to suppress change events
+         * @return {Boolean} Whether or not the value was set.
+         */
+        set: function(key, value, silent){
+            var configs = this._configs || {};
+            var config = configs[key];
+
+            if (!config) {
+                YAHOO.log('set failed: ' + key + ' not found',
+                        'error', 'AttributeProvider');
+                return false;
+            }
+
+            return config.setValue(value, silent);
+        },
+
+        /**
+         * Returns an array of attribute names.
+         * @method getAttributeKeys
+         * @return {Array} An array of attribute names.
+         */
+        getAttributeKeys: function(){
+            var configs = this._configs;
+            var keys = [];
+            var config;
+            for (var key in configs) {
+                config = configs[key];
+                if ( configs.hasOwnProperty(key) &&
+                        !Lang.isUndefined(config) ) {
+                    keys[keys.length] = key;
+                }
+            }
+
+            return keys;
+        },
+
+        /**
+         * Sets multiple attribute values.
+         * @method setAttributes
+         * @param {Object} map  A key-value map of attributes
+         * @param {Boolean} silent Whether or not to suppress change events
+         */
+        setAttributes: function(map, silent){
+            for (var key in map) {
+                if ( map.hasOwnProperty(key) ) {
+                    this.set(key, map[key], silent);
+                }
+            }
+        },
+
+        /**
+         * Resets the specified attribute's value to its initial value.
+         * @method resetValue
+         * @param {String} key The name of the attribute
+         * @param {Boolean} silent Whether or not to suppress change events
+         * @return {Boolean} Whether or not the value was set
+         */
+        resetValue: function(key, silent){
+            var configs = this._configs || {};
+            if (configs[key]) {
+                this.set(key, configs[key]._initialConfig.value, silent);
+                return true;
+            }
+            return false;
+        },
+
+        /**
+         * Sets the attribute's value to its current value.
+         * @method refresh
+         * @param {String | Array} key The attribute(s) to refresh
+         * @param {Boolean} silent Whether or not to suppress change events
+         */
+        refresh: function(key, silent){
+            var configs = this._configs;
+
+            key = ( ( Lang.isString(key) ) ? [key] : key ) ||
+                    this.getAttributeKeys();
+
+            for (var i = 0, len = key.length; i < len; ++i) {
+                if ( // only set if there is a value and not null
+                    configs[key[i]] &&
+                    ! Lang.isUndefined(configs[key[i]].value) &&
+                    ! Lang.isNull(configs[key[i]].value) ) {
+                    configs[key[i]].refresh(silent);
+                }
+            }
+        },
+
+        /**
+         * Adds an Attribute to the AttributeProvider instance.
+         * @method register
+         * @param {String} key The attribute's name
+         * @param {Object} map A key-value map containing the
+         * attribute's properties.
+         */
+        register: function(key, map) {
+            this._configs = this._configs || {};
+
+            if (this._configs[key]) { // dont override
+                return false;
+            }
+
+            map.name = key;
+            this._configs[key] = new YAHOO.util.Attribute(map, this);
+            return true;
+        },
+
+        /**
+         * Returns the attribute's properties.
+         * @method getAttributeConfig
+         * @param {String} key The attribute's name
+         * @private
+         * @return {object} A key-value map containing all of the
+         * attribute's properties.
+         */
+        getAttributeConfig: function(key) {
+            var configs = this._configs || {};
+            var config = configs[key] || {};
+            var map = {}; // returning a copy to prevent overrides
+
+            for (key in config) {
+                if ( config.hasOwnProperty(key) ) {
+                    map[key] = config[key];
+                }
+            }
+
+            return map;
+        },
+
+        /**
+         * Sets or updates an Attribute instance's properties.
+         * @method configureAttribute
+         * @param {String} key The attribute's name.
+         * @param {Object} map A key-value map of attribute properties
+         * @param {Boolean} init Whether or not this should become the intial config.
+         */
+        configureAttribute: function(key, map, init) {
+            var configs = this._configs || {};
+
+            if (!configs[key]) {
+                YAHOO.log('unable to configure, ' + key + ' not found',
+                        'error', 'AttributeProvider');
+                return false;
+            }
+
+            configs[key].configure(map, init);
+        },
+
+        /**
+         * Resets an attribute to its intial configuration.
+         * @method resetAttributeConfig
+         * @param {String} key The attribute's name.
+         * @private
+         */
+        resetAttributeConfig: function(key){
+            var configs = this._configs || {};
+            configs[key].resetConfig();
+        },
+
+        /**
+         * Fires the attribute's beforeChange event.
+         * @method fireBeforeChangeEvent
+         * @param {String} key The attribute's name.
+         * @param {Obj} e The event object to pass to handlers.
+         */
+        fireBeforeChangeEvent: function(e) {
+            var type = 'before';
+            type += e.type.charAt(0).toUpperCase() + e.type.substr(1) + 'Change';
+            e.type = type;
+            return this.fireEvent(e.type, e);
+        },
+
+        /**
+         * Fires the attribute's change event.
+         * @method fireChangeEvent
+         * @param {String} key The attribute's name.
+         * @param {Obj} e The event object to pass to the handlers.
+         */
+        fireChangeEvent: function(e) {
+            e.type += 'Change';
+            return this.fireEvent(e.type, e);
+        }
+    };
+
+    YAHOO.augment(YAHOO.util.AttributeProvider, YAHOO.util.EventProvider);
+})();(function() {
+// internal shorthand
+var Dom = YAHOO.util.Dom,
+    Lang = YAHOO.util.Lang,
+    EventPublisher = YAHOO.util.EventPublisher,
+    AttributeProvider = YAHOO.util.AttributeProvider;
+
+/**
+ * Element provides an interface to an HTMLElement's attributes and common
+ * methods.  Other commonly used attributes are added as well.
+ * @namespace YAHOO.util
+ * @class Element
+ * @uses YAHOO.util.AttributeProvider
+ * @constructor
+ * @param el {HTMLElement | String} The html element that
+ * represents the Element.
+ * @param {Object} map A key-value map of initial config names and values
+ */
+YAHOO.util.Element = function(el, map) {
+    if (arguments.length) {
+        this.init(el, map);
+    }
+};
+
+YAHOO.util.Element.prototype = {
+	/**
+     * Dom events supported by the Element instance.
+	 * @property DOM_EVENTS
+	 * @type Object
+	 */
+    DOM_EVENTS: null,
+
+	/**
+     * Wrapper for HTMLElement method.
+	 * @method appendChild
+	 * @param {Boolean} deep Whether or not to do a deep clone
+	 */
+    appendChild: function(child) {
+        child = child.get ? child.get('element') : child;
+        this.get('element').appendChild(child);
+    },
+
+	/**
+     * Wrapper for HTMLElement method.
+	 * @method getElementsByTagName
+	 * @param {String} tag The tagName to collect
+	 */
+    getElementsByTagName: function(tag) {
+        return this.get('element').getElementsByTagName(tag);
+    },
+
+	/**
+     * Wrapper for HTMLElement method.
+	 * @method hasChildNodes
+	 * @return {Boolean} Whether or not the element has childNodes
+	 */
+    hasChildNodes: function() {
+        return this.get('element').hasChildNodes();
+    },
+
+	/**
+     * Wrapper for HTMLElement method.
+	 * @method insertBefore
+	 * @param {HTMLElement} element The HTMLElement to insert
+	 * @param {HTMLElement} before The HTMLElement to insert
+     * the element before.
+	 */
+    insertBefore: function(element, before) {
+        element = element.get ? element.get('element') : element;
+        before = (before && before.get) ? before.get('element') : before;
+
+        this.get('element').insertBefore(element, before);
+    },
+
+	/**
+     * Wrapper for HTMLElement method.
+	 * @method removeChild
+	 * @param {HTMLElement} child The HTMLElement to remove
+	 */
+    removeChild: function(child) {
+        child = child.get ? child.get('element') : child;
+        this.get('element').removeChild(child);
+        return true;
+    },
+
+	/**
+     * Wrapper for HTMLElement method.
+	 * @method replaceChild
+	 * @param {HTMLElement} newNode The HTMLElement to insert
+	 * @param {HTMLElement} oldNode The HTMLElement to replace
+	 */
+    replaceChild: function(newNode, oldNode) {
+        newNode = newNode.get ? newNode.get('element') : newNode;
+        oldNode = oldNode.get ? oldNode.get('element') : oldNode;
+        return this.get('element').replaceChild(newNode, oldNode);
+    },
+
+
+    /**
+     * Registers Element specific attributes.
+     * @method initAttributes
+     * @param {Object} map A key-value map of initial attribute configs
+     */
+    initAttributes: function(map) {
+        map = map || {};
+        var element = Dom.get(map.element) || null;
+
+        /**
+         * The HTMLElement the Element instance refers to.
+         * @config element
+         * @type HTMLElement
+         */
+        this.register('element', {
+            value: element,
+            readOnly: true
+         });
+    },
+
+    /**
+     * Adds a listener for the given event.  These may be DOM or
+     * customEvent listeners.  Any event that is fired via fireEvent
+     * can be listened for.  All handlers receive an event object.
+     * @method addListener
+     * @param {String} type The name of the event to listen for
+     * @param {Function} fn The handler to call when the event fires
+     * @param {Any} obj A variable to pass to the handler
+     * @param {Object} scope The object to use for the scope of the handler
+     */
+    addListener: function(type, fn, obj, scope) {
+        var el = this.get('element');
+        var scope = scope || this;
+
+        el = this.get('id') || el;
+
+        if (!this._events[type]) { // create on the fly
+            if ( this.DOM_EVENTS[type] ) {
+                YAHOO.util.Event.addListener(el, type, function(e) {
+                    if (e.srcElement && !e.target) { // supplement IE with target
+                        e.target = e.srcElement;
+                    }
+                    this.fireEvent(type, e);
+                }, obj, scope);
+            }
+
+            this.createEvent(type, this);
+            this._events[type] = true;
+        }
+
+        this.subscribe.apply(this, arguments); // notify via customEvent
+    },
+
+
+    /**
+     * Alias for addListener
+     * @method on
+     * @param {String} type The name of the event to listen for
+     * @param {Function} fn The function call when the event fires
+     * @param {Any} obj A variable to pass to the handler
+     * @param {Object} scope The object to use for the scope of the handler
+     */
+    on: function() { this.addListener.apply(this, arguments); },
+
+
+    /**
+     * Remove an event listener
+     * @method removeListener
+     * @param {String} type The name of the event to listen for
+     * @param {Function} fn The function call when the event fires
+     */
+    removeListener: function(type, fn) {
+        this.unsubscribe.apply(this, arguments);
+    },
+
+	/**
+     * Wrapper for Dom method.
+	 * @method addClass
+	 * @param {String} className The className to add
+	 */
+    addClass: function(className) {
+        Dom.addClass(this.get('element'), className);
+    },
+
+	/**
+     * Wrapper for Dom method.
+	 * @method getElementsByClassName
+	 * @param {String} className The className to collect
+	 * @param {String} tag (optional) The tag to use in
+     * conjunction with class name
+     * @return {Array} Array of HTMLElements
+	 */
+    getElementsByClassName: function(className, tag) {
+        return Dom.getElementsByClassName(className, tag,
+                this.get('element') );
+    },
+
+	/**
+     * Wrapper for Dom method.
+	 * @method hasClass
+	 * @param {String} className The className to add
+     * @return {Boolean} Whether or not the element has the class name
+	 */
+    hasClass: function(className) {
+        return Dom.hasClass(this.get('element'), className);
+    },
+
+	/**
+     * Wrapper for Dom method.
+	 * @method removeClass
+	 * @param {String} className The className to remove
+	 */
+    removeClass: function(className) {
+        return Dom.removeClass(this.get('element'), className);
+    },
+
+	/**
+     * Wrapper for Dom method.
+	 * @method replaceClass
+	 * @param {String} oldClassName The className to replace
+	 * @param {String} newClassName The className to add
+	 */
+    replaceClass: function(oldClassName, newClassName) {
+        return Dom.replaceClass(this.get('element'),
+                oldClassName, newClassName);
+    },
+
+	/**
+     * Wrapper for Dom method.
+	 * @method setStyle
+	 * @param {String} property The style property to set
+	 * @param {String} value The value to apply to the style property
+	 */
+    setStyle: function(property, value) {
+        return Dom.setStyle(this.get('element'),  property, value);
+    },
+
+	/**
+     * Wrapper for Dom method.
+	 * @method getStyle
+	 * @param {String} property The style property to retrieve
+	 * @return {String} The current value of the property
+	 */
+    getStyle: function(property) {
+        return Dom.getStyle(this.get('element'),  property);
+    },
+
+	/**
+     * Apply any queued set calls.
+	 * @method fireQueue
+	 */
+    fireQueue: function() {
+        var queue = this._queue;
+        for (var i = 0, len = queue.length; i < len; ++i) {
+            this[queue[i][0]].apply(this, queue[i][1]);
+        }
+    },
+
+	/**
+     * Appends the HTMLElement into either the supplied parentNode.
+	 * @method appendTo
+	 * @param {HTMLElement | Element} parentNode The node to append to
+	 * @param {HTMLElement | Element} before An optional node to insert before
+	 */
+    appendTo: function(parent, before) {
+        parent = (parent.get) ?  parent.get('element') : Dom.get(parent);
+
+        before = (before && before.get) ?
+                before.get('element') : Dom.get(before);
+        var element = this.get('element');
+
+        var newAddition =  !Dom.inDocument(element);
+
+        if (!element) {
+            YAHOO.log('appendTo failed: element not available',
+                    'error', 'Element');
+            return false;
+        }
+
+        if (!parent) {
+            YAHOO.log('appendTo failed: parent not available',
+                    'error', 'Element');
+            return false;
+        }
+
+        if (element.parent != parent) {
+            if (before) {
+                parent.insertBefore(element, before);
+            } else {
+                parent.appendChild(element);
+            }
+        }
+
+        YAHOO.log(element + 'appended to ' + parent);
+
+        if (!newAddition) {
+            return false; // note return; no refresh if in document
+        }
+
+        // if a new addition, refresh HTMLElement any applied attributes
+        var keys = this.getAttributeKeys();
+
+        for (var key in keys) { // only refresh HTMLElement attributes
+            if ( !Lang.isUndefined(element[key]) ) {
+                this.refresh(key);
+            }
+        }
+    },
+
+    get: function(key) {
+        var configs = this._configs || {};
+        var el = configs.element; // avoid loop due to 'element'
+        if (el && !configs[key] && !Lang.isUndefined(el.value[key]) ) {
+            return el.value[key];
+        }
+
+        return AttributeProvider.prototype.get.call(this, key);
+    },
+
+    set: function(key, value, silent) {
+        var el = this.get('element');
+        if (!el) {
+            this._queue[key] = ['set', arguments];
+            return false;
+        }
+
+        // set it on the element if not a property
+        if ( !this._configs[key] && !Lang.isUndefined(el[key]) ) {
+            _registerHTMLAttr(this, key);
+        }
+
+        return AttributeProvider.prototype.set.apply(this, arguments);
+    },
+
+    register: function(key) { // protect html attributes
+        var configs = this._configs || {};
+        var element = this.get('element') || null;
+
+        if ( element && !Lang.isUndefined(element[key]) ) {
+            YAHOO.log(key + ' is reserved for ' + element,
+                    'error', 'Element');
+            return false;
+        }
+
+        return AttributeProvider.prototype.register.apply(this, arguments);
+    },
+
+    configureAttribute: function(property, map, init) { // protect html attributes
+        if (!this._configs[property] && this._configs.element &&
+                !Lang.isUndefined(this._configs.element[property]) ) {
+            _registerHTMLAttr(this, property, map);
+            return false;
+        }
+
+        return AttributeProvider.prototype.configure.apply(this, arguments);
+    },
+
+    getAttributeKeys: function() {
+        var el = this.get('element');
+        var keys = AttributeProvider.prototype.getAttributeKeys.call(this);
+
+        //add any unconfigured element keys
+        for (var key in el) {
+            if (!this._configs[key]) {
+                keys[key] = keys[key] || el[key];
+            }
+        }
+
+        return keys;
+    },
+
+    init: function(el, attr) {
+        this._queue = this._queue || [];
+        this._events = this._events || {};
+        this._configs = this._configs || {};
+        attr = attr || {};
+        attr.element = attr.element || el || null;
+
+        this.DOM_EVENTS = {
+            'click': true,
+            'keydown': true,
+            'keypress': true,
+            'keyup': true,
+            'mousedown': true,
+            'mousemove': true,
+            'mouseout': true,
+            'mouseover': true,
+            'mouseup': true
+        };
+
+        var readyHandler = function() {
+            this.initAttributes(attr);
+
+            this.setAttributes(attr, true);
+            this.fireQueue();
+            this.fireEvent('contentReady', {
+                type: 'contentReady',
+                target: attr.element
+            });
+        };
+
+        if ( Lang.isString(el) ) {
+            _registerHTMLAttr(this, 'id', { value: el });
+            YAHOO.util.Event.onAvailable(el, function() {
+                attr.element = Dom.get(el);
+                this.fireEvent('available', {
+                    type: 'available',
+                    target: attr.element
+                });
+            }, this, true);
+
+            YAHOO.util.Event.onContentReady(el, function() {
+                readyHandler.call(this);
+            }, this, true);
+        } else {
+            readyHandler.call(this);
+        }
+    }
+};
+
+/**
+ * Sets the value of the property and fires beforeChange and change events.
+ * @private
+ * @method _registerHTMLAttr
+ * @param {YAHOO.util.Element} element The Element instance to
+ * register the config to.
+ * @param {String} key The name of the config to register
+ * @param {Object} map A key-value map of the config's params
+ */
+var _registerHTMLAttr = function(self, key, map) {
+    var el = self.get('element');
+    map = map || {};
+    map.name = key;
+    map.method = map.method || function(value) {
+        el[key] = value;
+    };
+    map.value = map.value || el[key];
+    self._configs[key] = new YAHOO.util.Attribute(map, self);
+};
+
+/**
+ * Fires when the Element's HTMLElement can be retrieved by Id.
+ * <p>See: <a href="#addListener">Element.addListener</a></p>
+ * <p><strong>Event fields:</strong><br>
+ * <code>&lt;String&gt; type</code> available<br>
+ * <code>&lt;HTMLElement&gt;
+ * target</code> the HTMLElement bound to this Element instance<br>
+ * <p><strong>Usage:</strong><br>
+ * <code>var handler = function(e) {var target = e.target};<br>
+ * myTabs.addListener('available', handler);</code></p>
+ * @event available
+ */
+
+/**
+ * Fires when the Element's HTMLElement subtree is rendered.
+ * <p>See: <a href="#addListener">Element.addListener</a></p>
+ * <p><strong>Event fields:</strong><br>
+ * <code>&lt;String&gt; type</code> contentReady<br>
+ * <code>&lt;HTMLElement&gt;
+ * target</code> the HTMLElement bound to this Element instance<br>
+ * <p><strong>Usage:</strong><br>
+ * <code>var handler = function(e) {var target = e.target};<br>
+ * myTabs.addListener('contentReady', handler);</code></p>
+ * @event contentReady
+ */
+
+YAHOO.augment(YAHOO.util.Element, AttributeProvider);
+})();(function() {
+    var Dom = YAHOO.util.Dom,
+        Event = YAHOO.util.Event,
+        Lang = YAHOO.util.Lang;
+
+    /**
+     * A representation of a Tab's label and content.
+     * @namespace YAHOO.widget
+     * @class Tab
+     * @extends YAHOO.util.Element
+     * @constructor
+     * @param element {HTMLElement | String} (optional) The html element that
+     * represents the TabView. An element will be created if none provided.
+     * @param {Object} properties A key map of initial properties
+     */
+    Tab = function(el, attr) {
+        attr = attr || {};
+        if (arguments.length == 1 && !Lang.isString(el) && !el.nodeName) {
+            attr = el;
+            el = attr.element;
+        }
+
+        if (!el && !attr.element) {
+            el = _createTabElement.call(this, attr);
+        }
+
+        this.loadHandler =  {
+            success: function(o) {
+                this.set('content', o.responseText);
+            },
+            failure: function(o) {
+                YAHOO.log('loading failed: ' + o.statusText,
+                        'error', 'Tab');
+            }
+        };
+
+        Tab.superclass.constructor.call(this, el, attr);
+
+        this.DOM_EVENTS = {}; // delegating to tabView
+    };
+
+    YAHOO.extend(Tab, YAHOO.util.Element);
+    var proto = Tab.prototype;
+
+    /**
+     * The default tag name for a Tab's inner element.
+     * @property LABEL_INNER_TAGNAME
+     * @type String
+     * @default "em"
+     */
+    proto.LABEL_TAGNAME = 'em';
+
+    /**
+     * The class name applied to active tabs.
+     * @property ACTIVE_CLASSNAME
+     * @type String
+     * @default "on"
+     */
+    proto.ACTIVE_CLASSNAME = 'selected';
+
+    /**
+     * The class name applied to disabled tabs.
+     * @property DISABLED_CLASSNAME
+     * @type String
+     * @default "disabled"
+     */
+    proto.DISABLED_CLASSNAME = 'disabled';
+
+    /**
+     * The class name applied to dynamic tabs while loading.
+     * @property LOADING_CLASSNAME
+     * @type String
+     * @default "disabled"
+     */
+    proto.LOADING_CLASSNAME = 'loading';
+
+    /**
+     * Provides a reference to the connection request object when data is
+     * loaded dynamically.
+     * @property dataConnection
+     * @type Object
+     */
+    proto.dataConnection = null;
+
+    /**
+     * Object containing success and failure callbacks for loading data.
+     * @property loadHandler
+     * @type object
+     */
+    proto.loadHandler = null;
+
+    /**
+     * Provides a readable name for the tab.
+     * @method toString
+     * @return String
+     */
+    proto.toString = function() {
+        var el = this.get('element');
+        var id = el.id || el.tagName;
+        return "Tab " + id;
+    };
+
+    /**
+     * Registers TabView specific properties.
+     * @method initAttributes
+     * @param {Object} attr Hash of initial attributes
+     */
+    proto.initAttributes = function(attr) {
+        attr = attr || {};
+        Tab.superclass.initAttributes.call(this, attr);
+
+        var el = this.get('element');
+
+        /**
+         * The event that triggers the tab's activation.
+         * @config activationEvent
+         * @type String
+         */
+        this.register('activationEvent', {
+            value: attr.activationEvent || 'click'
+        });
+
+        /**
+         * The element that contains the tab's label.
+         * @config labelEl
+         * @type HTMLElement
+         */
+        this.register('labelEl', {
+            value: attr.labelEl || _getlabelEl.call(this),
+            method: function(value) {
+                var current = this.get('labelEl');
+
+                if (current) {
+                    if (current == value) {
+                        return false; // already set
+                    }
+
+                    this.replaceChild(value, current);
+                } else if (el.firstChild) { // ensure label is firstChild by default
+                    this.insertBefore(value, el.firstChild);
+                } else {
+                    this.appendChild(value);
+                }
+            }
+        });
+
+        /**
+         * The tab's label text (or innerHTML).
+         * @config label
+         * @type String
+         */
+        this.register('label', {
+            value: attr.label || _getLabel.call(this),
+            method: function(value) {
+                var labelEl = this.get('labelEl');
+                if (!labelEl) { // create if needed
+                    this.set('labelEl', _createlabelEl.call(this));
+                }
+
+                _setLabel.call(this, value);
+            }
+        });
+
+        /**
+         * The HTMLElement that contains the tab's content.
+         * @config contentEl
+         * @type HTMLElement
+         */
+        this.register('contentEl', { // TODO: apply className?
+            value: attr.contentEl || document.createElement('div'),
+            method: function(value) {
+                var current = this.get('contentEl');
+
+                if (current) {
+                    if (current == value) {
+                        return false; // already set
+                    }
+                    this.replaceChild(value, current);
+                }
+            }
+        });
+
+        /**
+         * The tab's content.
+         * @config content
+         * @type String
+         */
+        this.register('content', {
+            value: attr.content, // TODO: what about existing?
+            method: function(value) {
+                this.get('contentEl').innerHTML = value;
+            }
+        });
+
+        var _dataLoaded = false;
+
+        /**
+         * The tab's data source, used for loading content dynamically.
+         * @config dataSrc
+         * @type String
+         */
+        this.register('dataSrc', {
+            value: attr.dataSrc
+        });
+
+        /**
+         * Whether or not content should be reloaded for every view.
+         * @config cacheData
+         * @type Boolean
+         * @default false
+         */
+        this.register('cacheData', {
+            value: attr.cacheData || false,
+            validator: Lang.isBoolean
+        });
+
+        /**
+         * The method to use for the data request.
+         * @config loadMethod
+         * @type String
+         * @default "GET"
+         */
+        this.register('loadMethod', {
+            value: attr.loadMethod || 'GET',
+            validator: Lang.isString
+        });
+
+        /**
+         * Whether or not any data has been loaded from the server.
+         * @config dataLoaded
+         * @type Boolean
+         */
+        this.register('dataLoaded', {
+            value: false,
+            validator: Lang.isBoolean,
+            writeOnce: true
+        });
+
+        /**
+         * Number if milliseconds before aborting and calling failure handler.
+         * @config dataTimeout
+         * @type Number
+         * @default null
+         */
+        this.register('dataTimeout', {
+            value: attr.dataTimeout || null,
+            validator: Lang.isNumber
+        });
+
+        /**
+         * Whether or not the tab is currently active.
+         * If a dataSrc is set for the tab, the content will be loaded from
+         * the given source.
+         * @config active
+         * @type Boolean
+         */
+        this.register('active', {
+            value: attr.active || this.hasClass(this.ACTIVE_CLASSNAME),
+            method: function(value) {
+                if (value === true) {
+                    this.addClass(this.ACTIVE_CLASSNAME);
+                    this.set('title', 'active');
+                } else {
+                    this.removeClass(this.ACTIVE_CLASSNAME);
+                    this.set('title', '');
+                }
+            },
+            validator: function(value) {
+                return Lang.isBoolean(value) && !this.get('disabled') ;
+            }
+        });
+
+        /**
+         * Whether or not the tab is disabled.
+         * @config disabled
+         * @type Boolean
+         */
+        this.register('disabled', {
+            value: attr.disabled || this.hasClass(this.DISABLED_CLASSNAME),
+            method: function(value) {
+                if (value === true) {
+                    Dom.addClass(this.get('element'), this.DISABLED_CLASSNAME);
+                } else {
+                    Dom.removeClass(this.get('element'), this.DISABLED_CLASSNAME);
+                }
+            },
+            validator: Lang.isBoolean
+        });
+
+        /**
+         * The href of the tab's anchor element.
+         * @config href
+         * @type String
+         * @default '#'
+         */
+        this.register('href', {
+            value: attr.href || '#',
+            method: function(value) {
+                this.getElementsByTagName('a')[0].href = value;
+            },
+            validator: Lang.isString
+        });
+
+        /**
+         * The Whether or not the tab's content is visible.
+         * @config contentVisible
+         * @type Boolean
+         * @default false
+         */
+        this.register('contentVisible', {
+            value: attr.contentVisible,
+            method: function(value) {
+                if (value == true) {
+                    this.get('contentEl').style.display = 'block';
+
+                    if ( this.get('dataSrc') ) {
+                     // load dynamic content unless already loaded and caching
+                        if ( !this.get('dataLoaded') || !this.get('cacheData') ) {
+                            _dataConnect.call(this);
+                        }
+                    }
+                } else {
+                    this.get('contentEl').style.display = 'none';
+                }
+            },
+            validator: Lang.isBoolean
+        });
+    };
+
+    var _createTabElement = function(attr) {
+        var el = document.createElement('li');
+        var a = document.createElement('a');
+
+        a.href = attr.href || '#';
+
+        el.appendChild(a);
+
+        var label = attr.label || null;
+        var labelEl = attr.labelEl || null;
+
+        if (labelEl) { // user supplied labelEl
+            if (!label) { // user supplied label
+                label = _getLabel.call(this, labelEl);
+            }
+        } else {
+            labelEl = _createlabelEl.call(this);
+        }
+
+        a.appendChild(labelEl);
+
+        return el;
+    };
+
+    var _getlabelEl = function() {
+        return this.getElementsByTagName(this.LABEL_TAGNAME)[0];
+    };
+
+    var _createlabelEl = function() {
+        var el = document.createElement(this.LABEL_TAGNAME);
+        return el;
+    };
+
+    var _setLabel = function(label) {
+        var el = this.get('labelEl');
+        el.innerHTML = label;
+    };
+
+    var _getLabel = function() {
+        var label,
+            el = this.get('labelEl');
+
+            if (!el) {
+                return undefined;
+            }
+
+        return el.innerHTML;
+    };
+
+    var _dataConnect = function() {
+        if (!YAHOO.util.Connect) {
+            YAHOO.log('YAHOO.util.Connect dependency not met',
+                    'error', 'Tab');
+            return false;
+        }
+
+        Dom.addClass(this.get('contentEl').parentNode, this.LOADING_CLASSNAME);
+
+        this.dataConnection = YAHOO.util.Connect.asyncRequest(
+            this.get('loadMethod'),
+            this.get('dataSrc'),
+            {
+                success: function(o) {
+                    this.loadHandler.success.call(this, o);
+                    this.set('dataLoaded', true);
+                    this.dataConnection = null;
+                    Dom.removeClass(this.get('contentEl').parentNode,
+                            this.LOADING_CLASSNAME);
+                },
+                failure: function(o) {
+                    this.loadHandler.failure.call(this, o);
+                    this.dataConnection = null;
+                    Dom.removeClass(this.get('contentEl').parentNode,
+                            this.LOADING_CLASSNAME);
+                },
+                scope: this,
+                timeout: this.get('dataTimeout')
+            }
+        );
+    };
+
+    YAHOO.widget.Tab = Tab;
+
+    /**
+     * Fires before the active state is changed.
+     * <p>See: <a href="YAHOO.util.Element.html#addListener">Element.addListener</a></p>
+     * <p>If handler returns false, the change will be cancelled, and the value will not
+     * be set.</p>
+     * <p><strong>Event fields:</strong><br>
+     * <code>&lt;String&gt; type</code> beforeActiveChange<br>
+     * <code>&lt;Boolean&gt;
+     * prevValue</code> the current value<br>
+     * <code>&lt;Boolean&gt;
+     * newValue</code> the new value</p>
+     * <p><strong>Usage:</strong><br>
+     * <code>var handler = function(e) {var previous = e.prevValue};<br>
+     * myTabs.addListener('beforeActiveChange', handler);</code></p>
+     * @event beforeActiveChange
+     */
+
+    /**
+     * Fires after the active state is changed.
+     * <p>See: <a href="YAHOO.util.Element.html#addListener">Element.addListener</a></p>
+     * <p><strong>Event fields:</strong><br>
+     * <code>&lt;String&gt; type</code> activeChange<br>
+     * <code>&lt;Boolean&gt;
+     * prevValue</code> the previous value<br>
+     * <code>&lt;Boolean&gt;
+     * newValue</code> the updated value</p>
+     * <p><strong>Usage:</strong><br>
+     * <code>var handler = function(e) {var previous = e.prevValue};<br>
+     * myTabs.addListener('activeChange', handler);</code></p>
+     * @event activeChange
+     */
+
+    /**
+     * Fires before the tab label is changed.
+     * <p>See: <a href="YAHOO.util.Element.html#addListener">Element.addListener</a></p>
+     * <p>If handler returns false, the change will be cancelled, and the value will not
+     * be set.</p>
+     * <p><strong>Event fields:</strong><br>
+     * <code>&lt;String&gt; type</code> beforeLabelChange<br>
+     * <code>&lt;String&gt;
+     * prevValue</code> the current value<br>
+     * <code>&lt;String&gt;
+     * newValue</code> the new value</p>
+     * <p><strong>Usage:</strong><br>
+     * <code>var handler = function(e) {var previous = e.prevValue};<br>
+     * myTabs.addListener('beforeLabelChange', handler);</code></p>
+     * @event beforeLabelChange
+     */
+
+    /**
+     * Fires after the tab label is changed.
+     * <p>See: <a href="YAHOO.util.Element.html#addListener">Element.addListener</a></p>
+     * <p><strong>Event fields:</strong><br>
+     * <code>&lt;String&gt; type</code> labelChange<br>
+     * <code>&lt;String&gt;
+     * prevValue</code> the previous value<br>
+     * <code>&lt;String&gt;
+     * newValue</code> the updated value</p>
+     * <p><strong>Usage:</strong><br>
+     * <code>var handler = function(e) {var previous = e.prevValue};<br>
+     * myTabs.addListener('labelChange', handler);</code></p>
+     * @event labelChange
+     */
+
+    /**
+     * Fires before the tab content is changed.
+     * <p>See: <a href="YAHOO.util.Element.html#addListener">Element.addListener</a></p>
+     * <p>If handler returns false, the change will be cancelled, and the value will not
+     * be set.</p>
+     * <p><strong>Event fields:</strong><br>
+     * <code>&lt;String&gt; type</code> beforeContentChange<br>
+     * <code>&lt;String&gt;
+     * prevValue</code> the current value<br>
+     * <code>&lt;String&gt;
+     * newValue</code> the new value</p>
+     * <p><strong>Usage:</strong><br>
+     * <code>var handler = function(e) {var previous = e.prevValue};<br>
+     * myTabs.addListener('beforeContentChange', handler);</code></p>
+     * @event beforeContentChange
+     */
+
+    /**
+     * Fires after the tab content is changed.
+     * <p>See: <a href="YAHOO.util.Element.html#addListener">Element.addListener</a></p>
+     * <p><strong>Event fields:</strong><br>
+     * <code>&lt;String&gt; type</code> contentChange<br>
+     * <code>&lt;String&gt;
+     * prevValue</code> the previous value<br>
+     * <code>&lt;Boolean&gt;
+     * newValue</code> the updated value</p>
+     * <p><strong>Usage:</strong><br>
+     * <code>var handler = function(e) {var previous = e.prevValue};<br>
+     * myTabs.addListener('contentChange', handler);</code></p>
+     * @event contentChange
+     */
+})();(function() {
+
+    /**
+     * The tabview module provides a widget for managing content bound to tabs.
+     * @module tabview
+     *
+     */
+    /**
+     * A widget to control tabbed views.
+     * @namespace YAHOO.widget
+     * @class TabView
+     * @extends YAHOO.util.Element
+     * @constructor
+     * @param {HTMLElement | String | Object} el(optional) The html
+     * element that represents the TabView, or the attribute object to use.
+     * An element will be created if none provided.
+     * @param {Object} attr (optional) A key map of the tabView's
+     * initial attributes.  Ignored if first arg is attributes object.
+     */
+    YAHOO.widget.TabView = function(el, attr) {
+        attr = attr || {};
+        if (arguments.length == 1 && !Lang.isString(el) && !el.nodeName) {
+            attr = el; // treat first arg as attr object
+            el = attr.element || null;
+        }
+
+        if (!el && !attr.element) { // create if we dont have one
+            el = _createTabViewElement.call(this, attr);
+        }
+    	YAHOO.widget.TabView.superclass.constructor.call(this, el, attr);
+    };
+
+    YAHOO.extend(YAHOO.widget.TabView, YAHOO.util.Element);
+
+    var proto = YAHOO.widget.TabView.prototype;
+    var Dom = YAHOO.util.Dom;
+    var Lang = YAHOO.util.Lang;
+    var Event = YAHOO.util.Event;
+    var Tab = YAHOO.widget.Tab;
+
+
+    /**
+     * The className to add when building from scratch.
+     * @property CLASSNAME
+     * @default "navset"
+     */
+    proto.CLASSNAME = 'yui-navset';
+
+    /**
+     * The className of the HTMLElement containing the TabView's tab elements
+     * to look for when building from existing markup, or to add when building
+     * from scratch.
+     * All childNodes of the tab container are treated as Tabs when building
+     * from existing markup.
+     * @property TAB_PARENT_CLASSNAME
+     * @default "nav"
+     */
+    proto.TAB_PARENT_CLASSNAME = 'yui-nav';
+
+    /**
+     * The className of the HTMLElement containing the TabView's label elements
+     * to look for when building from existing markup, or to add when building
+     * from scratch.
+     * All childNodes of the content container are treated as content elements when
+     * building from existing markup.
+     * @property CONTENT_PARENT_CLASSNAME
+     * @default "nav-content"
+     */
+    proto.CONTENT_PARENT_CLASSNAME = 'yui-content';
+
+    proto._tabParent = null;
+    proto._contentParent = null;
+
+    /**
+     * Adds a Tab to the TabView instance.
+     * If no index is specified, the tab is added to the end of the tab list.
+     * @method addTab
+     * @param {YAHOO.widget.Tab} tab A Tab instance to add.
+     * @param {Integer} index The position to add the tab.
+     * @return void
+     */
+    proto.addTab = function(tab, index) {
+        var tabs = this.get('tabs');
+        if (!tabs) { // not ready yet
+            this._queue[this._queue.length] = ['addTab', arguments];
+            return false;
+        }
+
+        index = (index === undefined) ? tabs.length : index;
+
+        var before = this.getTab(index);
+
+        var self = this;
+        var el = this.get('element');
+        var tabParent = this._tabParent;
+        var contentParent = this._contentParent;
+
+        var tabElement = tab.get('element');
+        var contentEl = tab.get('contentEl');
+
+        if ( before ) {
+            tabParent.insertBefore(tabElement, before.get('element'));
+        } else {
+            tabParent.appendChild(tabElement);
+        }
+
+        if ( contentEl && !Dom.isAncestor(contentParent, contentEl) ) {
+            contentParent.appendChild(contentEl);
+        }
+
+        if ( !tab.get('active') ) {
+            tab.set('contentVisible', false, true); /* hide if not active */
+        } else {
+            this.set('activeTab', tab, true);
+
+        }
+
+        var activate = function(e) {
+            YAHOO.util.Event.preventDefault(e);
+            self.set('activeTab', this);
+        };
+
+        tab.addListener( tab.get('activationEvent'), activate);
+
+        tab.addListener('activationEventChange', function(e) {
+            if (e.prevValue != e.newValue) {
+                tab.removeListener(e.prevValue, activate);
+                tab.addListener(e.newValue, activate);
+            }
+        });
+
+        tabs.splice(index, 0, tab);
+    };
+
+    /**
+     * Routes childNode events.
+     * @method DOMEventHandler
+     * @param {event} e The Dom event that is being handled.
+     * @return void
+     */
+    proto.DOMEventHandler = function(e) {
+        var el = this.get('element');
+        var target = YAHOO.util.Event.getTarget(e);
+        var tabParent = this._tabParent;
+
+        if (Dom.isAncestor(tabParent, target) ) {
+            var tabEl;
+            var tab = null;
+            var contentEl;
+            var tabs = this.get('tabs');
+
+            for (var i = 0, len = tabs.length; i < len; i++) {
+                tabEl = tabs[i].get('element');
+                contentEl = tabs[i].get('contentEl');
+
+                if ( target == tabEl || Dom.isAncestor(tabEl, target) ) {
+                    tab = tabs[i];
+                    break; // note break
+                }
+            }
+
+            if (tab) {
+                tab.fireEvent(e.type, e);
+            }
+        }
+    };
+
+    /**
+     * Returns the Tab instance at the specified index.
+     * @method getTab
+     * @param {Integer} index The position of the Tab.
+     * @return YAHOO.widget.Tab
+     */
+    proto.getTab = function(index) {
+    	return this.get('tabs')[index];
+    };
+
+    /**
+     * Returns the index of given tab.
+     * @method getTabIndex
+     * @param {YAHOO.widget.Tab} tab The tab whose index will be returned.
+     * @return int
+     */
+    proto.getTabIndex = function(tab) {
+        var index = null;
+        var tabs = this.get('tabs');
+    	for (var i = 0, len = tabs.length; i < len; ++i) {
+            if (tab == tabs[i]) {
+                index = i;
+                break;
+            }
+        }
+
+        return index;
+    };
+
+    /**
+     * Removes the specified Tab from the TabView.
+     * @method removeTab
+     * @param {YAHOO.widget.Tab} item The Tab instance to be removed.
+     * @return void
+     */
+    proto.removeTab = function(tab) {
+        var tabCount = this.get('tabs').length;
+
+        var index = this.getTabIndex(tab);
+        var nextIndex = index + 1;
+        if ( tab == this.get('activeTab') ) { // select next tab
+            if (tabCount > 1) {
+                if (index + 1 == tabCount) {
+                    this.set('activeIndex', index - 1);
+                } else {
+                    this.set('activeIndex', index + 1);
+                }
+            }
+        }
+
+        this._tabParent.removeChild( tab.get('element') );
+        this._contentParent.removeChild( tab.get('contentEl') );
+        this._configs.tabs.value.splice(index, 1);
+
+    };
+
+    /**
+     * Provides a readable name for the TabView instance.
+     * @method toString
+     * @return String
+     */
+    proto.toString = function() {
+        var name = this.get('id') || this.get('tagName');
+        return "TabView " + name;
+    };
+
+    /**
+     * The transiton to use when switching between tabs.
+     * @method contentTransition
+     */
+    proto.contentTransition = function(newTab, oldTab) {
+        newTab.set('contentVisible', true);
+        oldTab.set('contentVisible', false);
+    };
+
+    /**
+     * Registers TabView specific properties.
+     * @method initAttributes
+     * @param {Object} attr Hash of initial attributes
+     */
+    proto.initAttributes = function(attr) {
+        YAHOO.widget.TabView.superclass.initAttributes.call(this, attr);
+
+        if (!attr.orientation) {
+            attr.orientation = 'top';
+        }
+
+        var el = this.get('element');
+
+        /**
+         * The Tabs belonging to the TabView instance.
+         * @config tabs
+         * @type Array
+         */
+        this.register('tabs', {
+            value: [],
+            readOnly: true
+        });
+
+        /**
+         * The container of the tabView's label elements.
+         * @property _tabParent
+         * @private
+         * @type HTMLElement
+         */
+        this._tabParent =
+                this.getElementsByClassName(this.TAB_PARENT_CLASSNAME,
+                        'ul' )[0] || _createTabParent.call(this);
+
+        /**
+         * The container of the tabView's content elements.
+         * @property _contentParent
+         * @type HTMLElement
+         * @private
+         */
+        this._contentParent =
+                this.getElementsByClassName(this.CONTENT_PARENT_CLASSNAME,
+                        'div')[0] ||  _createContentParent.call(this);
+
+        /**
+         * How the Tabs should be oriented relative to the TabView.
+         * @config orientation
+         * @type String
+         * @default "top"
+         */
+        this.register('orientation', {
+            value: attr.orientation,
+            method: function(value) {
+                var current = this.get('orientation');
+                this.addClass('yui-navset-' + value);
+
+                if (current != value) {
+                    this.removeClass('yui-navset-' + current);
+                }
+
+                switch(value) {
+                    case 'bottom':
+                    this.appendChild(this._tabParent);
+                    break;
+                }
+            }
+        });
+
+        /**
+         * The index of the tab currently active.
+         * @config activeIndex
+         * @type Int
+         */
+        this.register('activeIndex', {
+            value: attr.activeIndex,
+            method: function(value) {
+                this.set('activeTab', this.getTab(value));
+            },
+            validator: function(value) {
+                return !this.getTab(value).get('disabled'); // cannot activate if disabled
+            }
+        });
+
+        /**
+         * The tab currently active.
+         * @config activeTab
+         * @type YAHOO.widget.Tab
+         */
+        this.register('activeTab', {
+            value: attr.activeTab,
+            method: function(tab) {
+                var activeTab = this.get('activeTab');
+
+                if (tab) {
+                    tab.set('active', true);
+                }
+
+                if (activeTab && activeTab != tab) {
+                    activeTab.set('active', false);
+                }
+
+                if (activeTab && tab != activeTab) { // no transition if only 1
+                    this.contentTransition(tab, activeTab);
+                } else if (tab) {
+                    tab.set('contentVisible', true);
+                }
+            },
+            validator: function(value) {
+                return !value.get('disabled'); // cannot activate if disabled
+            }
+        });
+
+        if ( this._tabParent ) {
+            _initTabs.call(this);
+        }
+
+        for (var type in this.DOM_EVENTS) {
+            if ( this.DOM_EVENTS.hasOwnProperty(type) ) {
+                this.addListener.call(this, type, this.DOMEventHandler);
+            }
+        }
+    };
+
+    /**
+     * Creates Tab instances from a collection of HTMLElements.
+     * @method createTabs
+     * @private
+     * @param {Array|HTMLCollection} elements The elements to use for Tabs.
+     * @return void
+     */
+    var _initTabs = function() {
+        var tab,
+            attr,
+            contentEl;
+
+        var el = this.get('element');
+        var tabs = _getChildNodes(this._tabParent);
+        var contentElements = _getChildNodes(this._contentParent);
+
+        for (var i = 0, len = tabs.length; i < len; ++i) {
+            attr = {};
+
+            if (contentElements[i]) {
+                attr.contentEl = contentElements[i];
+            }
+
+            tab = new YAHOO.widget.Tab(tabs[i], attr);
+            this.addTab(tab);
+
+            if (tab.hasClass(tab.ACTIVE_CLASSNAME) ) {
+                this._configs.activeTab.value = tab; // dont invoke method
+            }
+        }
+    };
+
+    var _createTabViewElement = function(attr) {
+        var el = document.createElement('div');
+
+        if ( this.CLASSNAME ) {
+            el.className = this.CLASSNAME;
+        }
+
+        return el;
+    };
+
+    var _createTabParent = function(attr) {
+        var el = document.createElement('ul');
+
+        if ( this.TAB_PARENT_CLASSNAME ) {
+            el.className = this.TAB_PARENT_CLASSNAME;
+        }
+
+        this.get('element').appendChild(el);
+
+        return el;
+    };
+
+    var _createContentParent = function(attr) {
+        var el = document.createElement('div');
+
+        if ( this.CONTENT_PARENT_CLASSNAME ) {
+            el.className = this.CONTENT_PARENT_CLASSNAME;
+        }
+
+        this.get('element').appendChild(el);
+
+        return el;
+    };
+
+    var _getChildNodes = function(el) {
+        var nodes = [];
+        var childNodes = el.childNodes;
+
+        for (var i = 0, len = childNodes.length; i < len; ++i) {
+            if (childNodes[i].nodeType == 1) {
+                nodes[nodes.length] = childNodes[i];
+            }
+        }
+
+        return nodes;
+    };
+
+/**
+ * Fires before the activeTab is changed.
+ * <p>See: <a href="YAHOO.util.Element.html#addListener">Element.addListener</a></p>
+ * <p>If handler returns false, the change will be cancelled, and the value will not
+ * be set.</p>
+ * <p><strong>Event fields:</strong><br>
+ * <code>&lt;String&gt; type</code> beforeActiveTabChange<br>
+ * <code>&lt;<a href="YAHOO.widget.Tab.html">YAHOO.widget.Tab</a>&gt;
+ * prevValue</code> the currently active tab<br>
+ * <code>&lt;<a href="YAHOO.widget.Tab.html">YAHOO.widget.Tab</a>&gt;
+ * newValue</code> the tab to be made active</p>
+ * <p><strong>Usage:</strong><br>
+ * <code>var handler = function(e) {var previous = e.prevValue};<br>
+ * myTabs.addListener('beforeActiveTabChange', handler);</code></p>
+ * @event beforeActiveTabChange
+ */
+
+/**
+ * Fires after the activeTab is changed.
+ * <p>See: <a href="YAHOO.util.Element.html#addListener">Element.addListener</a></p>
+ * <p><strong>Event fields:</strong><br>
+ * <code>&lt;String&gt; type</code> activeTabChange<br>
+ * <code>&lt;<a href="YAHOO.widget.Tab.html">YAHOO.widget.Tab</a>&gt;
+ * prevValue</code> the formerly active tab<br>
+ * <code>&lt;<a href="YAHOO.widget.Tab.html">YAHOO.widget.Tab</a>&gt;
+ * newValue</code> the new active tab</p>
+ * <p><strong>Usage:</strong><br>
+ * <code>var handler = function(e) {var previous = e.prevValue};<br>
+ * myTabs.addListener('activeTabChange', handler);</code></p>
+ * @event activeTabChange
+ */
+
+/**
+ * Fires before the orientation is changed.
+ * <p>See: <a href="YAHOO.util.Element.html#addListener">Element.addListener</a></p>
+ * <p>If handler returns false, the change will be cancelled, and the value will not
+ * be set.</p>
+ * <p><strong>Event fields:</strong><br>
+ * <code>&lt;String&gt; type</code> beforeOrientationChange<br>
+ * <code>&lt;String&gt;
+ * prevValue</code> the current orientation<br>
+ * <code>&lt;String&gt;
+ * newValue</code> the new orientation to be applied</p>
+ * <p><strong>Usage:</strong><br>
+ * <code>var handler = function(e) {var previous = e.prevValue};<br>
+ * myTabs.addListener('beforeOrientationChange', handler);</code></p>
+ * @event beforeOrientationChange
+ */
+
+/**
+ * Fires after the orientation is changed.
+ * <p>See: <a href="YAHOO.util.Element.html#addListener">Element.addListener</a></p>
+ * <p><strong>Event fields:</strong><br>
+ * <code>&lt;String&gt; type</code> orientationChange<br>
+ * <code>&lt;String&gt;
+ * prevValue</code> the former orientation<br>
+ * <code>&lt;String&gt;
+ * newValue</code> the new orientation</p>
+ * <p><strong>Usage:</strong><br>
+ * <code>var handler = function(e) {var previous = e.prevValue};<br>
+ * myTabs.addListener('orientationChange', handler);</code></p>
+ * @event orientationChange
+ */
+})();
\ No newline at end of file
diff --git a/frontend/beta/js/YUI/treeview.js b/frontend/beta/js/YUI/treeview.js
new file mode 100644
index 0000000..ea6b6ef
--- a/dev/null
+++ b/frontend/beta/js/YUI/treeview.js
@@ -0,0 +1,2182 @@
+/*                                                                                                                                                      
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 0.12.0
+*/ 
+
+/**
+ * The treeview widget is a generic tree building tool.
+ * @module treeview
+ * @title TreeView Widget
+ * @requires yahoo
+ * @optional animation
+ * @namespace YAHOO.widget
+ */
+
+/**
+ * Contains the tree view state data and the root node.
+ *
+ * @class TreeView
+ * @constructor
+ * @param {string|HTMLElement} id The id of the element, or the element
+ * itself that the tree will be inserted into.
+ */
+YAHOO.widget.TreeView = function(id) {
+    if (id) { this.init(id); }
+};
+
+YAHOO.widget.TreeView.prototype = {
+
+    /**
+     * The id of tree container element
+     * @property id
+     * @type String
+     */
+    id: null,
+
+    /**
+     * The host element for this tree
+     * @property _el
+     * @private
+     */
+    _el: null,
+
+     /**
+     * Flat collection of all nodes in this tree
+     * @property _nodes
+     * @type Node[]
+     * @private
+     */
+    _nodes: null,
+
+    /**
+     * We lock the tree control while waiting for the dynamic loader to return
+     * @property locked
+     * @type boolean
+     */
+    locked: false,
+
+    /**
+     * The animation to use for expanding children, if any
+     * @property _expandAnim
+     * @type string
+     * @private
+     */
+    _expandAnim: null,
+
+    /**
+     * The animation to use for collapsing children, if any
+     * @property _collapseAnim
+     * @type string
+     * @private
+     */
+    _collapseAnim: null,
+
+    /**
+     * The current number of animations that are executing
+     * @property _animCount
+     * @type int
+     * @private
+     */
+    _animCount: 0,
+
+    /**
+     * The maximum number of animations to run at one time.
+     * @property maxAnim
+     * @type int
+     */
+    maxAnim: 2,
+
+    /**
+     * Sets up the animation for expanding children
+     * @method setExpandAnim
+     * @param {string} type the type of animation (acceptable values defined 
+     * in YAHOO.widget.TVAnim)
+     */
+    setExpandAnim: function(type) {
+        if (YAHOO.widget.TVAnim.isValid(type)) {
+            this._expandAnim = type;
+        }
+    },
+
+    /**
+     * Sets up the animation for collapsing children
+     * @method setCollapseAnim
+     * @param {string} the type of animation (acceptable values defined in 
+     * YAHOO.widget.TVAnim)
+     */
+    setCollapseAnim: function(type) {
+        if (YAHOO.widget.TVAnim.isValid(type)) {
+            this._collapseAnim = type;
+        }
+    },
+
+    /**
+     * Perform the expand animation if configured, or just show the
+     * element if not configured or too many animations are in progress
+     * @method animateExpand
+     * @param el {HTMLElement} the element to animate
+     * @param node {YAHOO.util.Node} the node that was expanded
+     * @return {boolean} true if animation could be invoked, false otherwise
+     */
+    animateExpand: function(el, node) {
+
+        if (this._expandAnim && this._animCount < this.maxAnim) {
+            // this.locked = true;
+            var tree = this;
+            var a = YAHOO.widget.TVAnim.getAnim(this._expandAnim, el, 
+                            function() { tree.expandComplete(node); });
+            if (a) { 
+                ++this._animCount;
+                this.fireEvent("animStart", {
+                        "node": node, 
+                        "type": "expand"
+                    });
+                a.animate();
+            }
+
+            return true;
+        }
+
+        return false;
+    },
+
+    /**
+     * Perform the collapse animation if configured, or just show the
+     * element if not configured or too many animations are in progress
+     * @method animateCollapse
+     * @param el {HTMLElement} the element to animate
+     * @param node {YAHOO.util.Node} the node that was expanded
+     * @return {boolean} true if animation could be invoked, false otherwise
+     */
+    animateCollapse: function(el, node) {
+
+        if (this._collapseAnim && this._animCount < this.maxAnim) {
+            // this.locked = true;
+            var tree = this;
+            var a = YAHOO.widget.TVAnim.getAnim(this._collapseAnim, el, 
+                            function() { tree.collapseComplete(node); });
+            if (a) { 
+                ++this._animCount;
+                this.fireEvent("animStart", {
+                        "node": node, 
+                        "type": "collapse"
+                    });
+                a.animate();
+            }
+
+            return true;
+        }
+
+        return false;
+    },
+
+    /**
+     * Function executed when the expand animation completes
+     * @method expandComplete
+     */
+    expandComplete: function(node) {
+        --this._animCount;
+        this.fireEvent("animComplete", {
+                "node": node, 
+                "type": "expand"
+            });
+        // this.locked = false;
+    },
+
+    /**
+     * Function executed when the collapse animation completes
+     * @method collapseComplete
+     */
+    collapseComplete: function(node) {
+        --this._animCount;
+        this.fireEvent("animComplete", {
+                "node": node, 
+                "type": "collapse"
+            });
+        // this.locked = false;
+    },
+
+    /**
+     * Initializes the tree
+     * @method init
+     * @parm {string|HTMLElement} id the id of the element that will hold the tree
+     * @private
+     */
+    init: function(id) {
+
+        this.id = id;
+
+        if ("string" !== typeof id) {
+            this._el = id;
+            this.id = this.generateId(id);
+        }
+
+        /**
+         * When animation is enabled, this event fires when the animation
+         * starts
+         * @event animStart
+         * @type CustomEvent
+         * @param {YAHOO.widget.Node} node the node that is expanding/collapsing
+         * @parm {String} type the type of animation ("expand" or "collapse")
+         */
+        this.createEvent("animStart", this);
+
+        /**
+         * When animation is enabled, this event fires when the animation
+         * completes
+         * @event animComplete
+         * @type CustomEvent
+         * @param {YAHOO.widget.Node} node the node that is expanding/collapsing
+         * @parm {String} type the type of animation ("expand" or "collapse")
+         */
+        this.createEvent("animComplete", this);
+
+        /**
+         * Fires when a node is going to be expanded.  Return false to stop
+         * the expand.
+         * @event collapse
+         * @type CustomEvent
+         * @param {YAHOO.widget.Node} node the node that is expanding/collapsing
+         */
+        this.createEvent("collapse", this);
+
+        /**
+         * Fires when a node is going to be collapsed.  Return false to stop
+         * the collapse.
+         * @event expand
+         * @type CustomEvent
+         * @param {YAHOO.widget.Node} node the node that is expanding/collapsing
+         */
+        this.createEvent("expand", this);
+
+        this._nodes = [];
+
+        // store a global reference
+        YAHOO.widget.TreeView.trees[this.id] = this;
+
+        // Set up the root node
+        this.root = new YAHOO.widget.RootNode(this);
+
+
+    },
+
+    /**
+     * Renders the tree boilerplate and visible nodes
+     * @method draw
+     */
+    draw: function() {
+        var html = this.root.getHtml();
+        this.getEl().innerHTML = html;
+        this.firstDraw = false;
+    },
+
+    /**
+     * Returns the tree's host element
+     * @method getEl
+     * @return {HTMLElement} the host element
+     */
+    getEl: function() {
+        if (! this._el) {
+            this._el = document.getElementById(this.id);
+        }
+        return this._el;
+    },
+
+    /**
+     * Nodes register themselves with the tree instance when they are created.
+     * @method regNode
+     * @param node {Node} the node to register
+     * @private
+     */
+    regNode: function(node) {
+        this._nodes[node.index] = node;
+    },
+
+    /**
+     * Returns the root node of this tree
+     * @method getRoot
+     * @return {Node} the root node
+     */
+    getRoot: function() {
+        return this.root;
+    },
+
+    /**
+     * Configures this tree to dynamically load all child data
+     * @method setDynamicLoad
+     * @param {function} fnDataLoader the function that will be called to get the data
+     * @param iconMode {int} configures the icon that is displayed when a dynamic
+     * load node is expanded the first time without children.  By default, the 
+     * "collapse" icon will be used.  If set to 1, the leaf node icon will be
+     * displayed.
+     */
+    setDynamicLoad: function(fnDataLoader, iconMode) { 
+        this.root.setDynamicLoad(fnDataLoader, iconMode);
+    },
+
+    /**
+     * Expands all child nodes.  Note: this conflicts with the "multiExpand"
+     * node property.  If expand all is called in a tree with nodes that
+     * do not allow multiple siblings to be displayed, only the last sibling
+     * will be expanded.
+     * @method expandAll
+     */
+    expandAll: function() { 
+        if (!this.locked) {
+            this.root.expandAll(); 
+        }
+    },
+
+    /**
+     * Collapses all expanded child nodes in the entire tree.
+     * @method collapseAll
+     */
+    collapseAll: function() { 
+        if (!this.locked) {
+            this.root.collapseAll(); 
+        }
+    },
+
+    /**
+     * Returns a node in the tree that has the specified index (this index
+     * is created internally, so this function probably will only be used
+     * in html generated for a given node.)
+     * @method getNodeByIndex
+     * @param {int} nodeIndex the index of the node wanted
+     * @return {Node} the node with index=nodeIndex, null if no match
+     */
+    getNodeByIndex: function(nodeIndex) {
+        var n = this._nodes[nodeIndex];
+        return (n) ? n : null;
+    },
+
+    /**
+     * Returns a node that has a matching property and value in the data
+     * object that was passed into its constructor.
+     * @method getNodeByProperty
+     * @param {object} property the property to search (usually a string)
+     * @param {object} value the value we want to find (usuall an int or string)
+     * @return {Node} the matching node, null if no match
+     */
+    getNodeByProperty: function(property, value) {
+        for (var i in this._nodes) {
+            var n = this._nodes[i];
+            if (n.data && value == n.data[property]) {
+                return n;
+            }
+        }
+
+        return null;
+    },
+
+    /**
+     * Returns a collection of nodes that have a matching property 
+     * and value in the data object that was passed into its constructor.  
+     * @method getNodesByProperty
+     * @param {object} property the property to search (usually a string)
+     * @param {object} value the value we want to find (usuall an int or string)
+     * @return {Array} the matching collection of nodes, null if no match
+     */
+    getNodesByProperty: function(property, value) {
+        var values = [];
+        for (var i in this._nodes) {
+            var n = this._nodes[i];
+            if (n.data && value == n.data[property]) {
+                values.push(n);
+            }
+        }
+
+        return (values.length) ? values : null;
+    },
+
+    /**
+     * Removes the node and its children, and optionally refreshes the 
+     * branch of the tree that was affected.
+     * @method removeNode
+     * @param {Node} The node to remove
+     * @param {boolean} autoRefresh automatically refreshes branch if true
+     * @return {boolean} False is there was a problem, true otherwise.
+     */
+    removeNode: function(node, autoRefresh) { 
+
+        // Don't delete the root node
+        if (node.isRoot()) {
+            return false;
+        }
+
+        // Get the branch that we may need to refresh
+        var p = node.parent;
+        if (p.parent) {
+            p = p.parent;
+        }
+
+        // Delete the node and its children
+        this._deleteNode(node);
+
+        // Refresh the parent of the parent
+        if (autoRefresh && p && p.childrenRendered) {
+            p.refresh();
+        }
+
+        return true;
+    },
+
+    /**
+     * Deletes this nodes child collection, recursively.  Also collapses
+     * the node, and resets the dynamic load flag.  The primary use for
+     * this method is to purge a node and allow it to fetch its data
+     * dynamically again.
+     * @method removeChildren
+     * @param {Node} node the node to purge
+     */
+    removeChildren: function(node) { 
+        while (node.children.length) {
+             this._deleteNode(node.children[0]);
+        }
+
+        node.childrenRendered = false;
+        node.dynamicLoadComplete = false;
+        if (node.expanded) {
+            node.collapse();
+        } else {
+            node.updateIcon();
+        }
+    },
+
+    /**
+     * Deletes the node and recurses children
+     * @method _deleteNode
+     * @private
+     */
+    _deleteNode: function(node) { 
+        // Remove all the child nodes first
+        this.removeChildren(node);
+
+        // Remove the node from the tree
+        this.popNode(node);
+    },
+
+    /**
+     * Removes the node from the tree, preserving the child collection 
+     * to make it possible to insert the branch into another part of the 
+     * tree, or another tree.
+     * @method popNode
+     * @param {Node} the node to remove
+     */
+    popNode: function(node) { 
+        var p = node.parent;
+
+        // Update the parent's collection of children
+        var a = [];
+
+        for (var i=0, len=p.children.length;i<len;++i) {
+            if (p.children[i] != node) {
+                a[a.length] = p.children[i];
+            }
+        }
+
+        p.children = a;
+
+        // reset the childrenRendered flag for the parent
+        p.childrenRendered = false;
+
+         // Update the sibling relationship
+        if (node.previousSibling) {
+            node.previousSibling.nextSibling = node.nextSibling;
+        }
+
+        if (node.nextSibling) {
+            node.nextSibling.previousSibling = node.previousSibling;
+        }
+
+        node.parent = null;
+        node.previousSibling = null;
+        node.nextSibling = null;
+        node.tree = null;
+
+        // Update the tree's node collection 
+        delete this._nodes[node.index];
+    },
+
+    /**
+     * TreeView instance toString
+     * @method toString
+     * @return {string} string representation of the tree
+     */
+    toString: function() {
+        return "TreeView " + this.id;
+    },
+
+    /**
+     * Generates an unique id for an element if it doesn't yet have one
+     * @method generateId
+     * @private
+     */
+    generateId: function(el) {
+        var id = el.id;
+
+        if (!id) {
+            id = "yui-tv-auto-id-" + YAHOO.widget.TreeView.counter;
+            ++YAHOO.widget.TreeView.counter;
+        }
+
+        return id;
+    },
+
+    /**
+     * Abstract method that is executed when a node is expanded
+     * @method onExpand
+     * @param node {Node} the node that was expanded
+     * @deprecated use treeobj.subscribe("expand") instead
+     */
+    onExpand: function(node) { },
+
+    /**
+     * Abstract method that is executed when a node is collapsed.
+     * @method onCollapse
+     * @param node {Node} the node that was collapsed.
+     * @deprecated use treeobj.subscribe("collapse") instead
+     */
+    onCollapse: function(node) { }
+
+};
+
+YAHOO.augment(YAHOO.widget.TreeView, YAHOO.util.EventProvider);
+
+/**
+ * Count of all nodes in all trees
+ * @property YAHOO.widget.TreeView.nodeCount
+ * @type int
+ * @static
+ */
+YAHOO.widget.TreeView.nodeCount = 0;
+
+/**
+ * Global cache of tree instances
+ * @property YAHOO.widget.TreeView.trees
+ * @type Array
+ * @static
+ * @private
+ */
+YAHOO.widget.TreeView.trees = [];
+
+/**
+ * Counter for generating a new unique element id
+ * @property YAHOO.widget.TreeView.counter
+ * @static
+ * @private
+ */
+YAHOO.widget.TreeView.counter = 0;
+
+/**
+ * Global method for getting a tree by its id.  Used in the generated
+ * tree html.
+ * @method YAHOO.widget.TreeView.getTree
+ * @param treeId {String} the id of the tree instance
+ * @return {TreeView} the tree instance requested, null if not found.
+ * @static
+ */
+YAHOO.widget.TreeView.getTree = function(treeId) {
+    var t = YAHOO.widget.TreeView.trees[treeId];
+    return (t) ? t : null;
+};
+
+/**
+ * Global method for getting a node by its id.  Used in the generated
+ * tree html.
+ * @method YAHOO.widget.TreeView.getNode
+ * @param treeId {String} the id of the tree instance
+ * @param nodeIndex {String} the index of the node to return
+ * @return {Node} the node instance requested, null if not found
+ * @static
+ */
+YAHOO.widget.TreeView.getNode = function(treeId, nodeIndex) {
+    var t = YAHOO.widget.TreeView.getTree(treeId);
+    return (t) ? t.getNodeByIndex(nodeIndex) : null;
+};
+
+/**
+ * Add a DOM event
+ * @method YAHOO.widget.TreeView.addHandler
+ * @param el the elment to bind the handler to
+ * @param {string} sType the type of event handler
+ * @param {function} fn the callback to invoke
+ * @static
+ */
+YAHOO.widget.TreeView.addHandler = function (el, sType, fn) {
+    if (el.addEventListener) {
+        el.addEventListener(sType, fn, false);
+    } else if (el.attachEvent) {
+        el.attachEvent("on" + sType, fn);
+    }
+};
+
+/**
+ * Remove a DOM event
+ * @method YAHOO.widget.TreeView.removeHandler
+ * @param el the elment to bind the handler to
+ * @param {string} sType the type of event handler
+ * @param {function} fn the callback to invoke
+ * @static
+ */
+
+YAHOO.widget.TreeView.removeHandler = function (el, sType, fn) {
+    if (el.removeEventListener) {
+        el.removeEventListener(sType, fn, false);
+    } else if (el.detachEvent) {
+        el.detachEvent("on" + sType, fn);
+    }
+};
+
+/**
+ * Attempts to preload the images defined in the styles used to draw the tree by
+ * rendering off-screen elements that use the styles.
+ * @method YAHOO.widget.TreeView.preload
+ * @param {string} prefix the prefix to use to generate the names of the
+ * images to preload, default is ygtv
+ * @static
+ */
+YAHOO.widget.TreeView.preload = function(prefix) {
+    prefix = prefix || "ygtv";
+    var styles = ["tn","tm","tmh","tp","tph","ln","lm","lmh","lp","lph","loading"];
+
+    var sb = [];
+    
+    for (var i = 0; i < styles.length; ++i) { 
+        sb[sb.length] = '<span class="' + prefix + styles[i] + '">&#160;</span>';
+    }
+
+    var f = document.createElement("div");
+    var s = f.style;
+    s.position = "absolute";
+    s.top = "-1000px";
+    s.left = "-1000px";
+    f.innerHTML = sb.join("");
+
+    document.body.appendChild(f);
+
+    YAHOO.widget.TreeView.removeHandler(window, 
+                "load", YAHOO.widget.TreeView.preload);
+
+};
+
+YAHOO.widget.TreeView.addHandler(window, 
+                "load", YAHOO.widget.TreeView.preload);
+
+/**
+ * The base class for all tree nodes.  The node's presentation and behavior in
+ * response to mouse events is handled in Node subclasses.
+ * @namespace YAHOO.widget
+ * @class Node
+ * @param oData {object} a string or object containing the data that will
+ * be used to render this node
+ * @param oParent {Node} this node's parent node
+ * @param expanded {boolean} the initial expanded/collapsed state
+ * @constructor
+ */
+YAHOO.widget.Node = function(oData, oParent, expanded) {
+    if (oData) { this.init(oData, oParent, expanded); }
+};
+
+YAHOO.widget.Node.prototype = {
+
+    /**
+     * The index for this instance obtained from global counter in YAHOO.widget.TreeView.
+     * @property index
+     * @type int
+     */
+    index: 0,
+
+    /**
+     * This node's child node collection.
+     * @property children
+     * @type Node[] 
+     */
+    children: null,
+
+    /**
+     * Tree instance this node is part of
+     * @property tree
+     * @type TreeView
+     */
+    tree: null,
+
+    /**
+     * The data linked to this node.  This can be any object or primitive
+     * value, and the data can be used in getNodeHtml().
+     * @property data
+     * @type object
+     */
+    data: null,
+
+    /**
+     * Parent node
+     * @property parent
+     * @type Node
+     */
+    parent: null,
+
+    /**
+     * The depth of this node.  We start at -1 for the root node.
+     * @property depth
+     * @type int
+     */
+    depth: -1,
+
+    /**
+     * The href for the node's label.  If one is not specified, the href will
+     * be set so that it toggles the node.
+     * @property href
+     * @type string
+     */
+    href: null,
+
+    /**
+     * The label href target, defaults to current window
+     * @property target
+     * @type string
+     */
+    target: "_self",
+
+    /**
+     * The node's expanded/collapsed state
+     * @property expanded
+     * @type boolean
+     */
+    expanded: false,
+
+    /**
+     * Can multiple children be expanded at once?
+     * @property multiExpand
+     * @type boolean
+     */
+    multiExpand: true,
+
+    /**
+     * Should we render children for a collapsed node?  It is possible that the
+     * implementer will want to render the hidden data...  @todo verify that we 
+     * need this, and implement it if we do.
+     * @property renderHidden
+     * @type boolean
+     */
+    renderHidden: false,
+
+    /**
+     * This flag is set to true when the html is generated for this node's
+     * children, and set to false when new children are added.
+     * @property childrenRendered
+     * @type boolean
+     */
+    childrenRendered: false,
+
+    /**
+     * Dynamically loaded nodes only fetch the data the first time they are
+     * expanded.  This flag is set to true once the data has been fetched.
+     * @property dynamicLoadComplete
+     * @type boolean
+     */
+    dynamicLoadComplete: false,
+
+    /**
+     * This node's previous sibling
+     * @property previousSibling
+     * @type Node
+     */
+    previousSibling: null,
+
+    /**
+     * This node's next sibling
+     * @property nextSibling
+     * @type Node
+     */
+    nextSibling: null,
+
+    /**
+     * We can set the node up to call an external method to get the child
+     * data dynamically.
+     * @property _dynLoad
+     * @type boolean
+     * @private
+     */
+    _dynLoad: false,
+
+    /**
+     * Function to execute when we need to get this node's child data.
+     * @property dataLoader
+     * @type function
+     */
+    dataLoader: null,
+
+    /**
+     * This is true for dynamically loading nodes while waiting for the
+     * callback to return.
+     * @property isLoading
+     * @type boolean
+     */
+    isLoading: false,
+
+    /**
+     * The toggle/branch icon will not show if this is set to false.  This
+     * could be useful if the implementer wants to have the child contain
+     * extra info about the parent, rather than an actual node.
+     * @property hasIcon
+     * @type boolean
+     */
+    hasIcon: true,
+
+    /**
+     * Used to configure what happens when a dynamic load node is expanded
+     * and we discover that it does not have children.  By default, it is
+     * treated as if it still could have children (plus/minus icon).  Set
+     * iconMode to have it display like a leaf node instead.
+     * @property iconMode
+     * @type int
+     */
+    iconMode: 0,
+
+    /**
+     * The node type
+     * @property _type
+     * @private
+     */
+    _type: "Node",
+
+    /*
+    spacerPath: "http://us.i1.yimg.com/us.yimg.com/i/space.gif",
+    expandedText: "Expanded",
+    collapsedText: "Collapsed",
+    loadingText: "Loading",
+    */
+
+    /**
+     * Initializes this node, gets some of the properties from the parent
+     * @method init
+     * @param oData {object} a string or object containing the data that will
+     * be used to render this node
+     * @param oParent {Node} this node's parent node
+     * @param expanded {boolean} the initial expanded/collapsed state
+     */
+    init: function(oData, oParent, expanded) {
+
+        this.data       = oData;
+        this.children   = [];
+        this.index      = YAHOO.widget.TreeView.nodeCount;
+        ++YAHOO.widget.TreeView.nodeCount;
+        this.expanded   = expanded;
+
+        /**
+         * The parentChange event is fired when a parent element is applied
+         * to the node.  This is useful if you need to apply tree-level
+         * properties to a tree that need to happen if a node is moved from
+         * one tre to another.
+         *
+         * @event parentChange
+         * @type CustomEvent
+         */
+        this.createEvent("parentChange", this);
+
+        // oParent should never be null except when we create the root node.
+        if (oParent) {
+            oParent.appendChild(this);
+        }
+    },
+
+    /**
+     * Certain properties for the node cannot be set until the parent
+     * is known. This is called after the node is inserted into a tree.
+     * the parent is also applied to this node's children in order to
+     * make it possible to move a branch from one tree to another.
+     * @method applyParent
+     * @param {Node} parentNode this node's parent node
+     * @return {boolean} true if the application was successful
+     */
+    applyParent: function(parentNode) {
+        if (!parentNode) {
+            return false;
+        }
+
+        this.tree   = parentNode.tree;
+        this.parent = parentNode;
+        this.depth  = parentNode.depth + 1;
+
+        if (!this.href) {
+            this.href = "javascript:" + this.getToggleLink();
+        }
+
+        if (! this.multiExpand) {
+            this.multiExpand = parentNode.multiExpand;
+        }
+
+        this.tree.regNode(this);
+        parentNode.childrenRendered = false;
+
+        // cascade update existing children
+        for (var i=0, len=this.children.length;i<len;++i) {
+            this.children[i].applyParent(this);
+        }
+
+        this.fireEvent("parentChange");
+
+        return true;
+    },
+
+    /**
+     * Appends a node to the child collection.
+     * @method appendChild
+     * @param childNode {Node} the new node
+     * @return {Node} the child node
+     * @private
+     */
+    appendChild: function(childNode) {
+        if (this.hasChildren()) {
+            var sib = this.children[this.children.length - 1];
+            sib.nextSibling = childNode;
+            childNode.previousSibling = sib;
+        }
+        this.children[this.children.length] = childNode;
+        childNode.applyParent(this);
+
+        return childNode;
+    },
+
+    /**
+     * Appends this node to the supplied node's child collection
+     * @method appendTo
+     * @param parentNode {Node} the node to append to.
+     * @return {Node} The appended node
+     */
+    appendTo: function(parentNode) {
+        return parentNode.appendChild(this);
+    },
+
+    /**
+    * Inserts this node before this supplied node
+    * @method insertBefore
+    * @param node {Node} the node to insert this node before
+    * @return {Node} the inserted node
+    */
+    insertBefore: function(node) {
+        var p = node.parent;
+        if (p) {
+
+            if (this.tree) {
+                this.tree.popNode(this);
+            }
+
+            var refIndex = node.isChildOf(p);
+            p.children.splice(refIndex, 0, this);
+            if (node.previousSibling) {
+                node.previousSibling.nextSibling = this;
+            }
+            this.previousSibling = node.previousSibling;
+            this.nextSibling = node;
+            node.previousSibling = this;
+
+            this.applyParent(p);
+        }
+
+        return this;
+    },
+ 
+    /**
+    * Inserts this node after the supplied node
+    * @method insertAfter
+    * @param node {Node} the node to insert after
+    * @return {Node} the inserted node
+    */
+    insertAfter: function(node) {
+        var p = node.parent;
+        if (p) {
+
+            if (this.tree) {
+                this.tree.popNode(this);
+            }
+
+            var refIndex = node.isChildOf(p);
+
+            if (!node.nextSibling) {
+                return this.appendTo(p);
+            }
+
+            p.children.splice(refIndex + 1, 0, this);
+
+            node.nextSibling.previousSibling = this;
+            this.previousSibling = node;
+            this.nextSibling = node.nextSibling;
+            node.nextSibling = this;
+
+            this.applyParent(p);
+        }
+
+        return this;
+    },
+
+    /**
+    * Returns true if the Node is a child of supplied Node
+    * @method isChildOf
+    * @param parentNode {Node} the Node to check
+    * @return {boolean} The node index if this Node is a child of 
+    *                   supplied Node, else -1.
+    * @private
+    */
+    isChildOf: function(parentNode) {
+        if (parentNode && parentNode.children) {
+            for (var i=0, len=parentNode.children.length; i<len ; ++i) {
+                if (parentNode.children[i] === this) {
+                    return i;
+                }
+            }
+        }
+
+        return -1;
+    },
+
+    /**
+     * Returns a node array of this node's siblings, null if none.
+     * @method getSiblings
+     * @return Node[]
+     */
+    getSiblings: function() {
+        return this.parent.children;
+    },
+
+    /**
+     * Shows this node's children
+     * @method showChildren
+     */
+    showChildren: function() {
+        if (!this.tree.animateExpand(this.getChildrenEl(), this)) {
+            if (this.hasChildren()) {
+                this.getChildrenEl().style.display = "";
+            }
+        }
+    },
+
+    /**
+     * Hides this node's children
+     * @method hideChildren
+     */
+    hideChildren: function() {
+
+        if (!this.tree.animateCollapse(this.getChildrenEl(), this)) {
+            this.getChildrenEl().style.display = "none";
+        }
+    },
+
+    /**
+     * Returns the id for this node's container div
+     * @method getElId
+     * @return {string} the element id
+     */
+    getElId: function() {
+        return "ygtv" + this.index;
+    },
+
+    /**
+     * Returns the id for this node's children div
+     * @method getChildrenElId
+     * @return {string} the element id for this node's children div
+     */
+    getChildrenElId: function() {
+        return "ygtvc" + this.index;
+    },
+
+    /**
+     * Returns the id for this node's toggle element
+     * @method getToggleElId
+     * @return {string} the toggel element id
+     */
+    getToggleElId: function() {
+        return "ygtvt" + this.index;
+    },
+
+    /*
+     * Returns the id for this node's spacer image.  The spacer is positioned
+     * over the toggle and provides feedback for screen readers.
+     * @method getSpacerId
+     * @return {string} the id for the spacer image
+     */
+    /*
+    getSpacerId: function() {
+        return "ygtvspacer" + this.index;
+    }, 
+    */
+
+    /**
+     * Returns this node's container html element
+     * @method getEl
+     * @return {HTMLElement} the container html element
+     */
+    getEl: function() {
+        return document.getElementById(this.getElId());
+    },
+
+    /**
+     * Returns the div that was generated for this node's children
+     * @method getChildrenEl
+     * @return {HTMLElement} this node's children div
+     */
+    getChildrenEl: function() {
+        return document.getElementById(this.getChildrenElId());
+    },
+
+    /**
+     * Returns the element that is being used for this node's toggle.
+     * @method getToggleEl
+     * @return {HTMLElement} this node's toggle html element
+     */
+    getToggleEl: function() {
+        return document.getElementById(this.getToggleElId());
+    },
+
+    /*
+     * Returns the element that is being used for this node's spacer.
+     * @method getSpacer
+     * @return {HTMLElement} this node's spacer html element
+     */
+    /*
+    getSpacer: function() {
+        return document.getElementById( this.getSpacerId() ) || {};
+    },
+    */
+
+    /*
+    getStateText: function() {
+        if (this.isLoading) {
+            return this.loadingText;
+        } else if (this.hasChildren(true)) {
+            if (this.expanded) {
+                return this.expandedText;
+            } else {
+                return this.collapsedText;
+            }
+        } else {
+            return "";
+        }
+    },
+    */
+
+    /**
+     * Generates the link that will invoke this node's toggle method
+     * @method getToggleLink
+     * @return {string} the javascript url for toggling this node
+     */
+    getToggleLink: function() {
+        return "YAHOO.widget.TreeView.getNode(\'" + this.tree.id + "\'," + 
+            this.index + ").toggle()";
+    },
+
+    /**
+     * Hides this nodes children (creating them if necessary), changes the
+     * @method collapse
+     * toggle style.
+     */
+    collapse: function() {
+        // Only collapse if currently expanded
+        if (!this.expanded) { return; }
+
+        // fire the collapse event handler
+        var ret = this.tree.onCollapse(this);
+
+        if (false === ret) {
+            return;
+        }
+
+        ret = this.tree.fireEvent("collapse", this);
+
+        if (false === ret) {
+            return;
+        }
+
+        if (!this.getEl()) {
+            this.expanded = false;
+            return;
+        }
+
+        // hide the child div
+        this.hideChildren();
+        this.expanded = false;
+
+        this.updateIcon();
+
+        // this.getSpacer().title = this.getStateText();
+
+    },
+
+    /**
+     * Shows this nodes children (creating them if necessary), changes the
+     * toggle style, and collapses its siblings if multiExpand is not set.
+     * @method expand
+     */
+    expand: function() {
+        // Only expand if currently collapsed.
+        if (this.expanded) { return; }
+
+        // fire the expand event handler
+        var ret = this.tree.onExpand(this);
+
+        if (false === ret) {
+            return;
+        }
+        
+        ret = this.tree.fireEvent("expand", this);
+
+        if (false === ret) {
+            return;
+        }
+
+        if (!this.getEl()) {
+            this.expanded = true;
+            return;
+        }
+
+        if (! this.childrenRendered) {
+            this.getChildrenEl().innerHTML = this.renderChildren();
+        } else {
+        }
+
+        this.expanded = true;
+
+        this.updateIcon();
+
+        // this.getSpacer().title = this.getStateText();
+
+        // We do an extra check for children here because the lazy
+        // load feature can expose nodes that have no children.
+
+        // if (!this.hasChildren()) {
+        if (this.isLoading) {
+            this.expanded = false;
+            return;
+        }
+
+        if (! this.multiExpand) {
+            var sibs = this.getSiblings();
+            for (var i=0; i<sibs.length; ++i) {
+                if (sibs[i] != this && sibs[i].expanded) { 
+                    sibs[i].collapse(); 
+                }
+            }
+        }
+
+        this.showChildren();
+    },
+
+    updateIcon: function() {
+        if (this.hasIcon) {
+            var el = this.getToggleEl();
+            if (el) {
+                el.className = this.getStyle();
+            }
+        }
+    },
+
+    /**
+     * Returns the css style name for the toggle
+     * @method getStyle
+     * @return {string} the css class for this node's toggle
+     */
+    getStyle: function() {
+        if (this.isLoading) {
+            return "ygtvloading";
+        } else {
+            // location top or bottom, middle nodes also get the top style
+            var loc = (this.nextSibling) ? "t" : "l";
+
+            // type p=plus(expand), m=minus(collapase), n=none(no children)
+            var type = "n";
+            if (this.hasChildren(true) || (this.isDynamic() && !this.getIconMode())) {
+            // if (this.hasChildren(true)) {
+                type = (this.expanded) ? "m" : "p";
+            }
+
+            return "ygtv" + loc + type;
+        }
+    },
+
+    /**
+     * Returns the hover style for the icon
+     * @return {string} the css class hover state
+     * @method getHoverStyle
+     */
+    getHoverStyle: function() { 
+        var s = this.getStyle();
+        if (this.hasChildren(true) && !this.isLoading) { 
+            s += "h"; 
+        }
+        return s;
+    },
+
+    /**
+     * Recursively expands all of this node's children.
+     * @method expandAll
+     */
+    expandAll: function() { 
+        for (var i=0;i<this.children.length;++i) {
+            var c = this.children[i];
+            if (c.isDynamic()) {
+                alert("Not supported (lazy load + expand all)");
+                break;
+            } else if (! c.multiExpand) {
+                alert("Not supported (no multi-expand + expand all)");
+                break;
+            } else {
+                c.expand();
+                c.expandAll();
+            }
+        }
+    },
+
+    /**
+     * Recursively collapses all of this node's children.
+     * @method collapseAll
+     */
+    collapseAll: function() { 
+        for (var i=0;i<this.children.length;++i) {
+            this.children[i].collapse();
+            this.children[i].collapseAll();
+        }
+    },
+
+    /**
+     * Configures this node for dynamically obtaining the child data
+     * when the node is first expanded.  Calling it without the callback
+     * will turn off dynamic load for the node.
+     * @method setDynamicLoad
+     * @param fmDataLoader {function} the function that will be used to get the data.
+     * @param iconMode {int} configures the icon that is displayed when a dynamic
+     * load node is expanded the first time without children.  By default, the 
+     * "collapse" icon will be used.  If set to 1, the leaf node icon will be
+     * displayed.
+     */
+    setDynamicLoad: function(fnDataLoader, iconMode) { 
+        if (fnDataLoader) {
+            this.dataLoader = fnDataLoader;
+            this._dynLoad = true;
+        } else {
+            this.dataLoader = null;
+            this._dynLoad = false;
+        }
+
+        if (iconMode) {
+            this.iconMode = iconMode;
+        }
+    },
+
+    /**
+     * Evaluates if this node is the root node of the tree
+     * @method isRoot
+     * @return {boolean} true if this is the root node
+     */
+    isRoot: function() { 
+        return (this == this.tree.root);
+    },
+
+    /**
+     * Evaluates if this node's children should be loaded dynamically.  Looks for
+     * the property both in this instance and the root node.  If the tree is
+     * defined to load all children dynamically, the data callback function is
+     * defined in the root node
+     * @method isDynamic
+     * @return {boolean} true if this node's children are to be loaded dynamically
+     */
+    isDynamic: function() { 
+        var lazy = (!this.isRoot() && (this._dynLoad || this.tree.root._dynLoad));
+        return lazy;
+    },
+
+    /**
+     * Returns the current icon mode.  This refers to the way childless dynamic
+     * load nodes appear.
+     * @method getIconMode
+     * @return {int} 0 for collapse style, 1 for leaf node style
+     */
+    getIconMode: function() {
+        return (this.iconMode || this.tree.root.iconMode);
+    },
+
+    /**
+     * Checks if this node has children.  If this node is lazy-loading and the
+     * children have not been rendered, we do not know whether or not there
+     * are actual children.  In most cases, we need to assume that there are
+     * children (for instance, the toggle needs to show the expandable 
+     * presentation state).  In other times we want to know if there are rendered
+     * children.  For the latter, "checkForLazyLoad" should be false.
+     * @method hasChildren
+     * @param checkForLazyLoad {boolean} should we check for unloaded children?
+     * @return {boolean} true if this has children or if it might and we are
+     * checking for this condition.
+     */
+    hasChildren: function(checkForLazyLoad) { 
+        return ( this.children.length > 0 || 
+                (checkForLazyLoad && this.isDynamic() && !this.dynamicLoadComplete) );
+    },
+
+    /**
+     * Expands if node is collapsed, collapses otherwise.
+     * @method toggle
+     */
+    toggle: function() {
+        if (!this.tree.locked && ( this.hasChildren(true) || this.isDynamic()) ) {
+            if (this.expanded) { this.collapse(); } else { this.expand(); }
+        }
+    },
+
+    /**
+     * Returns the markup for this node and its children.
+     * @method getHtml
+     * @return {string} the markup for this node and its expanded children.
+     */
+    getHtml: function() {
+
+        this.childrenRendered = false;
+
+        var sb = [];
+        sb[sb.length] = '<div class="ygtvitem" id="' + this.getElId() + '">';
+        sb[sb.length] = this.getNodeHtml();
+        sb[sb.length] = this.getChildrenHtml();
+        sb[sb.length] = '</div>';
+        return sb.join("");
+    },
+
+    /**
+     * Called when first rendering the tree.  We always build the div that will
+     * contain this nodes children, but we don't render the children themselves
+     * unless this node is expanded.
+     * @method getChildrenHtml
+     * @return {string} the children container div html and any expanded children
+     * @private
+     */
+    getChildrenHtml: function() {
+
+        var sb = [];
+        sb[sb.length] = '<div class="ygtvchildren"';
+        sb[sb.length] = ' id="' + this.getChildrenElId() + '"';
+        if (!this.expanded) {
+            sb[sb.length] = ' style="display:none;"';
+        }
+        sb[sb.length] = '>';
+
+        // Don't render the actual child node HTML unless this node is expanded.
+        if ( (this.hasChildren(true) && this.expanded) ||
+                (this.renderHidden && !this.isDynamic()) ) {
+            sb[sb.length] = this.renderChildren();
+        }
+
+        sb[sb.length] = '</div>';
+
+        return sb.join("");
+    },
+
+    /**
+     * Generates the markup for the child nodes.  This is not done until the node
+     * is expanded.
+     * @method renderChildren
+     * @return {string} the html for this node's children
+     * @private
+     */
+    renderChildren: function() {
+
+
+        var node = this;
+
+        if (this.isDynamic() && !this.dynamicLoadComplete) {
+            this.isLoading = true;
+            this.tree.locked = true;
+
+            if (this.dataLoader) {
+
+                setTimeout( 
+                    function() {
+                        node.dataLoader(node, 
+                            function() { 
+                                node.loadComplete(); 
+                            });
+                    }, 10);
+                
+            } else if (this.tree.root.dataLoader) {
+
+                setTimeout( 
+                    function() {
+                        node.tree.root.dataLoader(node, 
+                            function() { 
+                                node.loadComplete(); 
+                            });
+                    }, 10);
+
+            } else {
+                return "Error: data loader not found or not specified.";
+            }
+
+            return "";
+
+        } else {
+            return this.completeRender();
+        }
+    },
+
+    /**
+     * Called when we know we have all the child data.
+     * @method completeRender
+     * @return {string} children html
+     */
+    completeRender: function() {
+        var sb = [];
+
+        for (var i=0; i < this.children.length; ++i) {
+            // this.children[i].childrenRendered = false;
+            sb[sb.length] = this.children[i].getHtml();
+        }
+        
+        this.childrenRendered = true;
+
+        return sb.join("");
+    },
+
+    /**
+     * Load complete is the callback function we pass to the data provider
+     * in dynamic load situations.
+     * @method loadComplete
+     */
+    loadComplete: function() {
+        this.getChildrenEl().innerHTML = this.completeRender();
+        this.dynamicLoadComplete = true;
+        this.isLoading = false;
+        this.expand();
+        this.tree.locked = false;
+    },
+
+    /**
+     * Returns this node's ancestor at the specified depth.
+     * @method getAncestor
+     * @param {int} depth the depth of the ancestor.
+     * @return {Node} the ancestor
+     */
+    getAncestor: function(depth) {
+        if (depth >= this.depth || depth < 0)  {
+            return null;
+        }
+
+        var p = this.parent;
+        
+        while (p.depth > depth) {
+            p = p.parent;
+        }
+
+        return p;
+    },
+
+    /**
+     * Returns the css class for the spacer at the specified depth for
+     * this node.  If this node's ancestor at the specified depth
+     * has a next sibling the presentation is different than if it
+     * does not have a next sibling
+     * @method getDepthStyle
+     * @param {int} depth the depth of the ancestor.
+     * @return {string} the css class for the spacer
+     */
+    getDepthStyle: function(depth) {
+        return (this.getAncestor(depth).nextSibling) ? 
+            "ygtvdepthcell" : "ygtvblankdepthcell";
+    },
+
+    /**
+     * Get the markup for the node.  This is designed to be overrided so that we can
+     * support different types of nodes.
+     * @method getNodeHtml
+     * @return {string} The HTML that will render this node.
+     */
+    getNodeHtml: function() { 
+        return ""; 
+    },
+
+    /**
+     * Regenerates the html for this node and its children.  To be used when the
+     * node is expanded and new children have been added.
+     * @method refresh
+     */
+    refresh: function() {
+        // this.loadComplete();
+        this.getChildrenEl().innerHTML = this.completeRender();
+
+        if (this.hasIcon) {
+            var el = this.getToggleEl();
+            if (el) {
+                el.className = this.getStyle();
+            }
+        }
+    },
+
+    /**
+     * Node toString
+     * @method toString
+     * @return {string} string representation of the node
+     */
+    toString: function() {
+        return "Node (" + this.index + ")";
+    }
+
+};
+
+YAHOO.augment(YAHOO.widget.Node, YAHOO.util.EventProvider);
+
+/**
+ * A custom YAHOO.widget.Node that handles the unique nature of 
+ * the virtual, presentationless root node.
+ * @namespace YAHOO.widget
+ * @class RootNode
+ * @extends YAHOO.widget.Node
+ * @param oTree {YAHOO.widget.TreeView} The tree instance this node belongs to
+ * @constructor
+ */
+YAHOO.widget.RootNode = function(oTree) {
+	// Initialize the node with null params.  The root node is a
+	// special case where the node has no presentation.  So we have
+	// to alter the standard properties a bit.
+	this.init(null, null, true);
+	
+	/*
+	 * For the root node, we get the tree reference from as a param
+	 * to the constructor instead of from the parent element.
+	 */
+	this.tree = oTree;
+};
+
+YAHOO.extend(YAHOO.widget.RootNode, YAHOO.widget.Node, {
+    
+    // overrides YAHOO.widget.Node
+    getNodeHtml: function() { 
+        return ""; 
+    },
+
+    toString: function() { 
+        return "RootNode";
+    },
+
+    loadComplete: function() { 
+        this.tree.draw();
+    }
+
+});
+/**
+ * The default node presentation.  The first parameter should be
+ * either a string that will be used as the node's label, or an object
+ * that has a string propery called label.  By default, the clicking the
+ * label will toggle the expanded/collapsed state of the node.  By
+ * changing the href property of the instance, this behavior can be
+ * changed so that the label will go to the specified href.
+ * @namespace YAHOO.widget
+ * @class TextNode
+ * @extends YAHOO.widget.Node
+ * @constructor
+ * @param oData {object} a string or object containing the data that will
+ * be used to render this node
+ * @param oParent {YAHOO.widget.Node} this node's parent node
+ * @param expanded {boolean} the initial expanded/collapsed state
+ */
+YAHOO.widget.TextNode = function(oData, oParent, expanded) {
+
+    if (oData) { 
+        this.init(oData, oParent, expanded);
+        this.setUpLabel(oData);
+    }
+
+};
+
+YAHOO.extend(YAHOO.widget.TextNode, YAHOO.widget.Node, {
+    
+    /**
+     * The CSS class for the label href.  Defaults to ygtvlabel, but can be
+     * overridden to provide a custom presentation for a specific node.
+     * @property labelStyle
+     * @type string
+     */
+    labelStyle: "ygtvlabel",
+
+    /**
+     * The derived element id of the label for this node
+     * @property labelElId
+     * @type string
+     */
+    labelElId: null,
+
+    /**
+     * The text for the label.  It is assumed that the oData parameter will
+     * either be a string that will be used as the label, or an object that
+     * has a property called "label" that we will use.
+     * @property label
+     * @type string
+     */
+    label: null,
+
+    textNodeParentChange: function() {
+ 
+        /**
+         * Custom event that is fired when the text node label is clicked.  The
+         * custom event is defined on the tree instance, so there is a single
+         * event that handles all nodes in the tree.  The node clicked is 
+         * provided as an argument
+         *
+         * @event labelClick
+         * @for YAHOO.widget.TreeView
+         * @param {YAHOO.widget.Node} node the node clicked
+         */
+        if (this.tree && !this.tree.hasEvent("labelClick")) {
+            this.tree.createEvent("labelClick", this.tree);
+        }
+       
+    },
+
+    /**
+     * Sets up the node label
+     * @method setUpLabel
+     * @param oData string containing the label, or an object with a label property
+     */
+    setUpLabel: function(oData) { 
+        
+        // set up the custom event on the tree
+        this.textNodeParentChange();
+        this.subscribe("parentChange", this.textNodeParentChange);
+
+        if (typeof oData == "string") {
+            oData = { label: oData };
+        }
+        this.label = oData.label;
+        
+        // update the link
+        if (oData.href) {
+            this.href = oData.href;
+        }
+
+        // set the target
+        if (oData.target) {
+            this.target = oData.target;
+        }
+
+        if (oData.style) {
+            this.labelStyle = oData.style;
+        }
+
+        this.labelElId = "ygtvlabelel" + this.index;
+    },
+
+    /**
+     * Returns the label element
+     * @for YAHOO.widget.TextNode
+     * @method getLabelEl
+     * @return {object} the element
+     */
+    getLabelEl: function() { 
+        return document.getElementById(this.labelElId);
+    },
+
+    // overrides YAHOO.widget.Node
+    getNodeHtml: function() { 
+        var sb = [];
+
+        sb[sb.length] = '<table border="0" cellpadding="0" cellspacing="0">';
+        sb[sb.length] = '<tr>';
+        
+        for (var i=0;i<this.depth;++i) {
+            // sb[sb.length] = '<td class="ygtvdepthcell">&#160;</td>';
+            sb[sb.length] = '<td class="' + this.getDepthStyle(i) + '">&#160;</td>';
+        }
+
+        var getNode = 'YAHOO.widget.TreeView.getNode(\'' +
+                        this.tree.id + '\',' + this.index + ')';
+
+        sb[sb.length] = '<td';
+        // sb[sb.length] = ' onselectstart="return false"';
+        sb[sb.length] = ' id="' + this.getToggleElId() + '"';
+        sb[sb.length] = ' class="' + this.getStyle() + '"';
+        if (this.hasChildren(true)) {
+            sb[sb.length] = ' onmouseover="this.className=';
+            sb[sb.length] = getNode + '.getHoverStyle()"';
+            sb[sb.length] = ' onmouseout="this.className=';
+            sb[sb.length] = getNode + '.getStyle()"';
+        }
+        sb[sb.length] = ' onclick="javascript:' + this.getToggleLink() + '">';
+
+        /*
+        sb[sb.length] = '<img id="' + this.getSpacerId() + '"';
+        sb[sb.length] = ' alt=""';
+        sb[sb.length] = ' tabindex=0';
+        sb[sb.length] = ' src="' + this.spacerPath + '"';
+        sb[sb.length] = ' title="' + this.getStateText() + '"';
+        sb[sb.length] = ' class="ygtvspacer"';
+        // sb[sb.length] = ' onkeypress="return ' + getNode + '".onKeyPress()"';
+        sb[sb.length] = ' />';
+        */
+
+        sb[sb.length] = '&#160;';
+
+        sb[sb.length] = '</td>';
+        sb[sb.length] = '<td>';
+        sb[sb.length] = '<a';
+        sb[sb.length] = ' id="' + this.labelElId + '"';
+        sb[sb.length] = ' class="' + this.labelStyle + '"';
+        sb[sb.length] = ' href="' + this.href + '"';
+        sb[sb.length] = ' target="' + this.target + '"';
+        sb[sb.length] = ' onclick="return ' + getNode + '.onLabelClick(' + getNode +')"';
+        if (this.hasChildren(true)) {
+            sb[sb.length] = ' onmouseover="document.getElementById(\'';
+            sb[sb.length] = this.getToggleElId() + '\').className=';
+            sb[sb.length] = getNode + '.getHoverStyle()"';
+            sb[sb.length] = ' onmouseout="document.getElementById(\'';
+            sb[sb.length] = this.getToggleElId() + '\').className=';
+            sb[sb.length] = getNode + '.getStyle()"';
+        }
+        sb[sb.length] = ' >';
+        sb[sb.length] = this.label;
+        sb[sb.length] = '</a>';
+        sb[sb.length] = '</td>';
+        sb[sb.length] = '</tr>';
+        sb[sb.length] = '</table>';
+
+        return sb.join("");
+    },
+
+    /**
+     * Executed when the label is clicked.  Fires the labelClick custom event.
+     * @method onLabelClick
+     * @param me {Node} this node
+     * @scope the anchor tag clicked
+     * @return false to cancel the anchor click
+     */
+    onLabelClick: function(me) { 
+        return me.tree.fireEvent("labelClick", me);
+        //return true;
+    },
+
+    toString: function() { 
+        return "TextNode (" + this.index + ") " + this.label;
+    }
+
+});
+/**
+ * A menu-specific implementation that differs from TextNode in that only 
+ * one sibling can be expanded at a time.
+ * @namespace YAHOO.widget
+ * @class MenuNode
+ * @extends YAHOO.widget.TextNode
+ * @param oData {object} a string or object containing the data that will
+ * be used to render this node
+ * @param oParent {YAHOO.widget.Node} this node's parent node
+ * @param expanded {boolean} the initial expanded/collapsed state
+ * @constructor
+ */
+YAHOO.widget.MenuNode = function(oData, oParent, expanded) {
+	if (oData) { 
+		this.init(oData, oParent, expanded);
+		this.setUpLabel(oData);
+	}
+
+    /*
+     * Menus usually allow only one branch to be open at a time.
+     */
+	this.multiExpand = false;
+
+
+};
+
+YAHOO.extend(YAHOO.widget.MenuNode, YAHOO.widget.TextNode, {
+
+    toString: function() { 
+        return "MenuNode (" + this.index + ") " + this.label;
+    }
+
+});
+/**
+ * This implementation takes either a string or object for the
+ * oData argument.  If is it a string, we will use it for the display
+ * of this node (and it can contain any html code).  If the parameter
+ * is an object, we look for a parameter called "html" that will be
+ * used for this node's display.
+ * @namespace YAHOO.widget
+ * @class HTMLNode
+ * @extends YAHOO.widget.Node
+ * @constructor
+ * @param oData {object} a string or object containing the data that will
+ * be used to render this node
+ * @param oParent {YAHOO.widget.Node} this node's parent node
+ * @param expanded {boolean} the initial expanded/collapsed state
+ * @param hasIcon {boolean} specifies whether or not leaf nodes should
+ * have an icon
+ */
+YAHOO.widget.HTMLNode = function(oData, oParent, expanded, hasIcon) {
+    if (oData) { 
+        this.init(oData, oParent, expanded);
+        this.initContent(oData, hasIcon);
+    }
+};
+
+YAHOO.extend(YAHOO.widget.HTMLNode, YAHOO.widget.Node, {
+
+    /**
+     * The CSS class for the html content container.  Defaults to ygtvhtml, but 
+     * can be overridden to provide a custom presentation for a specific node.
+     * @property contentStyle
+     * @type string
+     */
+    contentStyle: "ygtvhtml",
+
+    /**
+     * The generated id that will contain the data passed in by the implementer.
+     * @property contentElId
+     * @type string
+     */
+    contentElId: null,
+
+    /**
+     * The HTML content to use for this node's display
+     * @property content
+     * @type string
+     */
+    content: null,
+
+    /**
+     * Sets up the node label
+     * @property initContent
+     * @param {object} An html string or object containing an html property
+     * @param {boolean} hasIcon determines if the node will be rendered with an
+     * icon or not
+     */
+    initContent: function(oData, hasIcon) { 
+        if (typeof oData == "string") {
+            oData = { html: oData };
+        }
+
+        this.html = oData.html;
+        this.contentElId = "ygtvcontentel" + this.index;
+        this.hasIcon = hasIcon;
+
+    },
+
+    /**
+     * Returns the outer html element for this node's content
+     * @method getContentEl
+     * @return {HTMLElement} the element
+     */
+    getContentEl: function() { 
+        return document.getElementById(this.contentElId);
+    },
+
+    // overrides YAHOO.widget.Node
+    getNodeHtml: function() { 
+        var sb = [];
+
+        sb[sb.length] = '<table border="0" cellpadding="0" cellspacing="0">';
+        sb[sb.length] = '<tr>';
+        
+        for (var i=0;i<this.depth;++i) {
+            sb[sb.length] = '<td class="' + this.getDepthStyle(i) + '">&#160;</td>';
+        }
+
+        if (this.hasIcon) {
+            sb[sb.length] = '<td';
+            sb[sb.length] = ' id="' + this.getToggleElId() + '"';
+            sb[sb.length] = ' class="' + this.getStyle() + '"';
+            sb[sb.length] = ' onclick="javascript:' + this.getToggleLink() + '"';
+            if (this.hasChildren(true)) {
+                sb[sb.length] = ' onmouseover="this.className=';
+                sb[sb.length] = 'YAHOO.widget.TreeView.getNode(\'';
+                sb[sb.length] = this.tree.id + '\',' + this.index +  ').getHoverStyle()"';
+                sb[sb.length] = ' onmouseout="this.className=';
+                sb[sb.length] = 'YAHOO.widget.TreeView.getNode(\'';
+                sb[sb.length] = this.tree.id + '\',' + this.index +  ').getStyle()"';
+            }
+            sb[sb.length] = '>&#160;</td>';
+        }
+
+        sb[sb.length] = '<td';
+        sb[sb.length] = ' id="' + this.contentElId + '"';
+        sb[sb.length] = ' class="' + this.contentStyle + '"';
+        sb[sb.length] = ' >';
+        sb[sb.length] = this.html;
+        sb[sb.length] = '</td>';
+        sb[sb.length] = '</tr>';
+        sb[sb.length] = '</table>';
+
+        return sb.join("");
+    },
+
+    toString: function() { 
+        return "HTMLNode (" + this.index + ")";
+    }
+
+});
+/**
+ * A static factory class for tree view expand/collapse animations
+ * @class TVAnim
+ * @static
+ */
+YAHOO.widget.TVAnim = function() {
+    return {
+        /**
+         * Constant for the fade in animation
+         * @property FADE_IN
+         * @type string
+         * @static
+         */
+        FADE_IN: "TVFadeIn",
+
+        /**
+         * Constant for the fade out animation
+         * @property FADE_OUT
+         * @type string
+         * @static
+         */
+        FADE_OUT: "TVFadeOut",
+
+        /**
+         * Returns a ygAnim instance of the given type
+         * @method getAnim
+         * @param type {string} the type of animation
+         * @param el {HTMLElement} the element to element (probably the children div)
+         * @param callback {function} function to invoke when the animation is done.
+         * @return {YAHOO.util.Animation} the animation instance
+         * @static
+         */
+        getAnim: function(type, el, callback) {
+            if (YAHOO.widget[type]) {
+                return new YAHOO.widget[type](el, callback);
+            } else {
+                return null;
+            }
+        },
+
+        /**
+         * Returns true if the specified animation class is available
+         * @method isValid
+         * @param type {string} the type of animation
+         * @return {boolean} true if valid, false if not
+         * @static
+         */
+        isValid: function(type) {
+            return (YAHOO.widget[type]);
+        }
+    };
+} ();
+
+/**
+ * A 1/2 second fade-in animation.
+ * @class TVFadeIn
+ * @constructor
+ * @param el {HTMLElement} the element to animate
+ * @param callback {function} function to invoke when the animation is finished
+ */
+YAHOO.widget.TVFadeIn = function(el, callback) {
+    /**
+     * The element to animate
+     * @property el
+     * @type HTMLElement
+     */
+    this.el = el;
+
+    /**
+     * the callback to invoke when the animation is complete
+     * @property callback
+     * @type function
+     */
+    this.callback = callback;
+
+};
+
+YAHOO.widget.TVFadeIn.prototype = {
+    /**
+     * Performs the animation
+     * @method animate
+     */
+    animate: function() {
+        var tvanim = this;
+
+        var s = this.el.style;
+        s.opacity = 0.1;
+        s.filter = "alpha(opacity=10)";
+        s.display = "";
+
+        var dur = 0.4; 
+        var a = new YAHOO.util.Anim(this.el, {opacity: {from: 0.1, to: 1, unit:""}}, dur);
+        a.onComplete.subscribe( function() { tvanim.onComplete(); } );
+        a.animate();
+    },
+
+    /**
+     * Clean up and invoke callback
+     * @method onComplete
+     */
+    onComplete: function() {
+        this.callback();
+    },
+
+    /**
+     * toString
+     * @method toString
+     * @return {string} the string representation of the instance
+     */
+    toString: function() {
+        return "TVFadeIn";
+    }
+};
+
+/**
+ * A 1/2 second fade out animation.
+ * @class TVFadeOut
+ * @constructor
+ * @param el {HTMLElement} the element to animate
+ * @param callback {Function} function to invoke when the animation is finished
+ */
+YAHOO.widget.TVFadeOut = function(el, callback) {
+    /**
+     * The element to animate
+     * @property el
+     * @type HTMLElement
+     */
+    this.el = el;
+
+    /**
+     * the callback to invoke when the animation is complete
+     * @property callback
+     * @type function
+     */
+    this.callback = callback;
+
+};
+
+YAHOO.widget.TVFadeOut.prototype = {
+    /**
+     * Performs the animation
+     * @method animate
+     */
+    animate: function() {
+        var tvanim = this;
+        var dur = 0.4;
+        var a = new YAHOO.util.Anim(this.el, {opacity: {from: 1, to: 0.1, unit:""}}, dur);
+        a.onComplete.subscribe( function() { tvanim.onComplete(); } );
+        a.animate();
+    },
+
+    /**
+     * Clean up and invoke callback
+     * @method onComplete
+     */
+    onComplete: function() {
+        var s = this.el.style;
+        s.display = "none";
+        // s.opacity = 1;
+        s.filter = "alpha(opacity=100)";
+        this.callback();
+    },
+
+    /**
+     * toString
+     * @method toString
+     * @return {string} the string representation of the instance
+     */
+    toString: function() {
+        return "TVFadeOut";
+    }
+};
+
diff --git a/frontend/beta/js/YUI/yahoo.js b/frontend/beta/js/YUI/yahoo.js
new file mode 100644
index 0000000..8a44a91
--- a/dev/null
+++ b/frontend/beta/js/YUI/yahoo.js
@@ -0,0 +1,145 @@
+/*                                                                                                                                                      
+Copyright (c) 2006, Yahoo! Inc. All rights reserved.
+Code licensed under the BSD License:
+http://developer.yahoo.net/yui/license.txt
+version: 0.12.0
+*/ 
+
+/**
+ * The YAHOO object is the single global object used by YUI Library.  It
+ * contains utility function for setting up namespaces, inheritance, and
+ * logging.  YAHOO.util, YAHOO.widget, and YAHOO.example are namespaces
+ * created automatically for and used by the library.
+ * @module yahoo
+ * @title  YAHOO Global
+ */
+
+/**
+ * The YAHOO global namespace object
+ * @class YAHOO
+ * @static
+ */
+if (typeof YAHOO == "undefined") {
+    var YAHOO = {};
+}
+
+/**
+ * Returns the namespace specified and creates it if it doesn't exist
+ * <pre>
+ * YAHOO.namespace("property.package");
+ * YAHOO.namespace("YAHOO.property.package");
+ * </pre>
+ * Either of the above would create YAHOO.property, then
+ * YAHOO.property.package
+ *
+ * Be careful when naming packages. Reserved words may work in some browsers
+ * and not others. For instance, the following will fail in Safari:
+ * <pre>
+ * YAHOO.namespace("really.long.nested.namespace");
+ * </pre>
+ * This fails because "long" is a future reserved word in ECMAScript
+ *
+ * @method namespace
+ * @static
+ * @param  {String*} arguments 1-n namespaces to create 
+ * @return {Object}  A reference to the last namespace object created
+ */
+YAHOO.namespace = function() {
+    var a=arguments, o=null, i, j, d;
+    for (i=0; i<a.length; ++i) {
+        d=a[i].split(".");
+        o=YAHOO;
+
+        // YAHOO is implied, so it is ignored if it is included
+        for (j=(d[0] == "YAHOO") ? 1 : 0; j<d.length; ++j) {
+            o[d[j]]=o[d[j]] || {};
+            o=o[d[j]];
+        }
+    }
+
+    return o;
+};
+
+/**
+ * Uses YAHOO.widget.Logger to output a log message, if the widget is available.
+ *
+ * @method log
+ * @static
+ * @param  {String}  msg  The message to log.
+ * @param  {String}  cat  The log category for the message.  Default
+ *                        categories are "info", "warn", "error", time".
+ *                        Custom categories can be used as well. (opt)
+ * @param  {String}  src  The source of the the message (opt)
+ * @return {Boolean}      True if the log operation was successful.
+ */
+YAHOO.log = function(msg, cat, src) {
+    var l=YAHOO.widget.Logger;
+    if(l && l.log) {
+        return l.log(msg, cat, src);
+    } else {
+        return false;
+    }
+};
+
+/**
+ * Utility to set up the prototype, constructor and superclass properties to
+ * support an inheritance strategy that can chain constructors and methods.
+ *
+ * @method extend
+ * @static
+ * @param {Function} subc   the object to modify
+ * @param {Function} superc the object to inherit
+ * @param {String[]} overrides  additional properties/methods to add to the
+ *                              subclass prototype.  These will override the
+ *                              matching items obtained from the superclass 
+ *                              if present.
+ */
+YAHOO.extend = function(subc, superc, overrides) {
+    var F = function() {};
+    F.prototype=superc.prototype;
+    subc.prototype=new F();
+    subc.prototype.constructor=subc;
+    subc.superclass=superc.prototype;
+    if (superc.prototype.constructor == Object.prototype.constructor) {
+        superc.prototype.constructor=superc;
+    }
+
+    if (overrides) {
+        for (var i in overrides) {
+            subc.prototype[i]=overrides[i];
+        }
+    }
+};
+
+/**
+ * Applies all prototype properties in the supplier to the receiver if the
+ * receiver does not have these properties yet.  Optionally, one or more
+ * methods/properties can be specified (as additional parameters).  This
+ * option will overwrite the property if receiver has it already.
+ *
+ * @method augment
+ * @static
+ * @param {Function} r  the object to receive the augmentation
+ * @param {Function} s  the object that supplies the properties to augment
+ * @param {String*}  arguments zero or more properties methods to augment the
+ *                             receiver with.  If none specified, everything
+ *                             in the supplier will be used unless it would
+ *                             overwrite an existing property in the receiver
+ */
+YAHOO.augment = function(r, s) {
+    var rp=r.prototype, sp=s.prototype, a=arguments, i, p;
+    if (a[2]) {
+        for (i=2; i<a.length; ++i) {
+            rp[a[i]] = sp[a[i]];
+        }
+    } else {
+        for (p in sp) { 
+            if (!rp[p]) {
+                rp[p] = sp[p];
+            }
+        }
+    }
+};
+
+YAHOO.namespace("util", "widget", "example");
+
--
cgit v0.9.0.2