(function($) {

	$.fn.createForm = function(formParam) {
		var formHeader = "", formBody = "", formFooter = "";
		formHeader =
			'<article class="container_12">' +
				'<section class="grid_12">' +
					'<div class="search-block-border" id="jformmodal">' +
						'<form class="search-block-content form" id="' + formParam.id + '" method="' + formParam.method + '" action="' + formParam.action + '">' +
							'<fieldset class="search-grey-bg">';
		for(j = 0; j < formParam.components.length; j++) {
			formBody += $(this).generateElement(formParam.components[j]);
		}
		var buttonElement = '<button ' + (formParam.buttons[0].submit != "" ? 'onclick="' + formParam.buttons[0].submit + '"' : '') + ' type="' + formParam.buttons[0].type + '" style="' + formParam.buttons[0].style + '">' + formParam.buttons[0].value + '</button>';
		formFooter =
						'</fieldset>' +
						'<ul id="ulerrm" class="message error no-margin" style="display: none;">' +
							'<li id="errm"></li>' +
						'</ul>' +
							'<fieldset class="search-grey-bg search-no-margin">' +
								'<p class="search-' + formParam.buttons[0].classStyle + '">' +
									buttonElement +
								'</p>' +
							'</fieldset>'
						'</form>' +
					'</div>' +
				'</section>' +
				'<div class="clear"></div>' +
			'</article>';
		return formHeader + formBody + formFooter;
	}

	$.fn.generateElement = function(component) {
		var str = '';
		if(component.type == 'select') {
			var values = "";
			for(i = 0; i < component.value.option.length; i++) {
				if(component.value.option[i] == component.current)
					values += '<option selected="true" value="' + component.value.option[i] + '">' + component.value.text[i] + '</option>';
				else if(!component.blocked)
					values += '<option value="' + component.value.option[i] + '">' + component.value.text[i] + '</option>';
			}

			str =
								'<p class="' + component.classStyle + '">' +
									'<label for="' + component.id + '" class="search-' + component.classStyle + '">' + component.label + '</label>' +
									'<select name="' + component.name + '" id="' + component.id + '">' +
										values +
									'</select>' +
								'</p>';
		}
		else if(component.type == 'textarea')
			str =
								'<p class="search-' + component.classStyle + '">' +
									'<label for="' + component.id + '" class="search-' + component.classStyle + '">' + component.label + '</label>' +
									'<textarea rows="' + component.size.rows + '" cols="' + component.size.cols + '" name="' + component.name + '" id="' + component.id + '" class="full-width">' + component.value + '</textarea>' +
								'</p>';

		else if(component.type == 'input')
			str =
								'<p class="search-' + component.classStyle + '">' +
									'<label for="' + component.id + '" class="search-' + component.classStyle + '">' + component.label + '</label>' +
									'<input type="text" ' + component.readonly + ' name="' + component.name + '" id="' + component.id + '" value="' + component.value + '" class="full-width"/>' +
								'</p>';

		else if(component.type == 'hidden')
			str = '<input type="hidden" name="' + component.name + '" id="' + component.id + '" value="' + component.value + '">';
		else if(component.type == 'input-date')
			str =
								'<p class="search-' + component.classStyle + '">' +
									'<label for="' + component.id + '" class="search-' + component.classStyle + '">' + component.label + '</label>' +
									'<span class="input-type-text margin-right relative" ><input readonly="true" type="text" name="' + component.name + '" id="' + component.id + '" value="' + component.value + '" class="datepicker"></span>' +
								'</p>';

		return str;
	}

})(jQuery);