$.widget('ui.form', {
	_init: function	() {
		var form = this.element;

		form
			.addClass('ui-form')
			.find('input[type="text"], input[type="password"]')
				.prop('autocomplete', 'off').wrap($('<div />').addClass('ui-form-text-field'))
			.end()
			.find('input[type="file"]')
				.wrap($('<div />').addClass('ui-form-file-field'))
			.end()
			.find('textarea')
				.wrap($('<div />').addClass('ui-form-textarea-field'))
			.end()
			.find('select[multiple="multiple"]')
				.wrap($('<div />').addClass('ui-form-multi-select-field'))
			.end()
			.find('.ui-form-multi-select-field')
				.prepend($('<div />').addClass('options'))
				.prepend($('<input />').attr('type', 'text').prop('readonly', true))
				.find('select option')
					.each(function() {
						
						$('<label />')
							.append(
								$('<input />')
									.attr('name', $(this).parents('select:first').attr('name'))
									.attr('type', 'checkbox')
									.val($(this).val())
									.prop('checked', $(this).prop('selected'))
							)
							.append($(this).text())
							.appendTo($(this).parents('select:first').siblings('.options'));
					})
				.end()
				.append($('<div />').addClass('populate'))
			.end();
		
		form.find('a.submit').each(function() {
			$(this).html($('<span />').text($(this).text()));
		});
		
		form.find('.ui-form-multi-select-field').each(function() {
			$(this).data('max', $(this).find('select').data('max'));
			$(this).find('select').remove();
			$(this).find('input[type="checkbox"]:eq(0)').change();
		});
	}
});

$(function() {
	
	$('.ui-form a.submit').live('click', function() {
		$(this).parents('form:first').submit();
	});
	
	$('.ui-form input').live('keypress', function(e) {
		if (e.keyCode == 13) {
			$(this).parents('form:first').submit();
		}
	});
	
	$('.ui-form-multi-select-field')
		.find('.options input[type="checkbox"]')
			.live('change', function() {
				var container = $(this).parents('.options:first'),
					max = $(this).parents('.ui-form-multi-select-field:first').data('max');
					checked = container.find('input[type="checkbox"]:checked').length;
				
				container.siblings('input[type="text"]').val(checked + ' / ' + max);	
					
				if (checked < max) {
					container.find('input[type="checkbox"]').prop('disabled', false);
				} else {
					container.find('input[type="checkbox"]:not(:checked)').prop('disabled', true)
				}
			})
		.end()
		.find('.populate')
			.live('click', function() {
				var options = $(this).siblings('.options');
				if (options.is(':visible')) {
					options.removeClass('options-visible');
				} else {
					$('.ui-form-multi-select-field .options-visible').removeClass('options-visible');
					options.addClass('options-visible');
				}
			})
		.end()
		.find('input[type="text"]')
			.live('focus', function() {
				var options = $(this).siblings('.options');
				
				if (!options.is(':visible')) {
					$('.ui-form-multi-select-field .options-visible').removeClass('options-visible');
					options.addClass('options-visible');
				}
			})
		.end();
	
	$('body').bind('click', function(e) {
		if (!$(e.target).hasClass('ui-form-multi-select-field') && !$(e.target).parents('.ui-form-multi-select-field:first').length) {
			$('.ui-form-multi-select-field .options').removeClass('options-visible')
		}
	});
});