var LoginBox = new Class({
	options: {
		loginAction: '/ajax/login/',
		checkAction: '/ajax/',
		absolutePath: '',
		errors: [['username','login.empty.username','errorEmptyUsername'],
				 ['password','login.empty.password','errorEmptyPassword'],
				 ['username','login.notfound.user','errorWrongUsername'],
				 ['password','login.password','errorWrongPassword'],
				 ['username','login.unverified','errorUserNotverified']]
	},
	highlightErrors: function(responseHTML) {
		var element = this.element;
		hasErrors = false;
		element.getElement("ul").getElements("li").each(function(li) {
			li.setStyle('display', 'none');
		});
		element.getElements("input").each(function(input) {
			input.setStyle('color', 'black');
		});
		element.options.errors.each(function(error) {
			if (responseHTML.indexOf(error[1]) != -1) {
				hasErrors = true;
				element.getElement("ul").getElement("li." + error[2]).setStyle('display', 'block');
				element.getElement('input[name=' + error[0] + ']').setStyle('color', 'red');
			}
		});
		if (hasErrors) {
			element.getElement("ul").setStyle('display','block');
		}
	},
	reloadMe: function() {
		window.location.reload(null);
	},
	initialize: function(element, options){
		this.element = $(element);
		this.setOptions(options);
		$extend(element, this);
		var form = element.getElement('.loginBox').getElement('form');
		var usernameInput = form.getElement('.usernameInputHolder').getElement('input[name=username]');
		var passwordInput = form.getElement('.passwordInputHolder').getElement('input[name=password]');
		var passwordOverlayInput = form.getElement('.passwordInputHolder').getElement('input[name=passwordOverlay]');
		if (usernameInput.get('value') != 'E-postadress') {
			usernameInput.setStyles({
				'text-transform': 'none',
				'color': '#000000'
			});
		}
		usernameInput.addEvent('focus', function(e) {
			if (usernameInput.get('value') == 'E-postadress') {
				usernameInput.set('value', '');
				usernameInput.setStyles({
					'text-transform': 'none',
					'color': '#000000'
				});
			}
		});
		usernameInput.addEvent('blur', function(e) {
			if (usernameInput.get('value') == '') {
				usernameInput.set('value', 'E-postadress');
				usernameInput.setStyles({
					'text-transform': 'uppercase',
					'color': '#652438'
				});
			}
		});
		passwordOverlayInput.addEvent('focus', function(e) {
			passwordOverlayInput.setStyle('display', 'none');
			passwordInput.setStyle('display', 'block');
			passwordInput.focus();
		});
		passwordInput.addEvent('blur', function(e) {
			if (passwordInput.get('value') == '') {
				passwordOverlayInput.setStyle('display','block');
				passwordInput.setStyle('display','none');
			}
		});
		element.getElement('input.button').addEvent('click', function(e) {
			e.stop();
			var myHTMLRequest = new Request.HTML({
				url:element.options.loginAction,
				onComplete: function(responseTree, responseElements, responseHTML, responseJavaScript) {
					if (!responseHTML || responseHTML.length == 0) {
						element.reloadMe.delay(1000);
					} else {
						element.highlightErrors(responseHTML);
					}
				}
			}).post({
				'username':element.getElement('input[name=username]').value,
				'password':element.getElement('input[name=password]').value
			});
		});					
		return element;
	}
});
LoginBox.implement(new Options, new Events);