First version of the newly restructured repository

8 files changed, 3869 insertions, 0 deletions

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,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\" />";
+		}
+
+		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"
+	
+});
+