{extends file=$element.methods->getTemplatePath('general')}

{block name=input}	{** no append here!! **}
	<input type="text"
		{if $element.style.CSSClass}
			class="{$element.style.CSSClass}"
		{/if}

		id="{$element.displayID}"
		value="{$element.displayValue}"

		{if $element.disabled}
			disabled="disabled"
		{/if}

		style="	{if $element.style.height} height:{$element.style.height}px;{/if}
				{if $element.style.width} width:{$element.style.width}px;{/if}"

		{if !$element.disabled && $element.settings.events.onChange}
			onChange="setTimeout(function(){ var element = $('{$element.id}'); {$element.settings.events.onChange|join:';'}}, 1);"
		{/if}

		{if $element.placeholder}
			placeholder="{$element.placeholder}"
		{/if}

	/>

	{if $element.disabled}
		<img src="{$smarty.const.SMARTY_BLANKGIF}" alt="" class="imgIcon icon-calendar-disabled"
			id="{$element.id}_calendarButton"
		/>
	{else}
		<input type="hidden"
			id="{$element.id}"
			name="{$element.name}"
			value="{$element.value}"
		/>

		<img src="{$smarty.const.SMARTY_BLANKGIF}" alt="" class="imgIcon icon-calendar"
			id="{$element.id}_calendarButton"
		/>
	{/if}
{/block}

<script type="text/javascript">
	{block name=script}
		{if !$element.disabled}
			MVC.scheduleOnLoad(function(){
				Calendar.setup({
					inputField:"{$element.id}_title",
					button:"{$element.id}_calendarButton",
					ifFormat:Date.displayFormat,
					onUpdate: function(calendar){
						$('{$element.id}').value = calendar.date.dateFormat("Y-m-d");
						_events.simulate('blur', '{$element.displayID}');
					}
					{if $element.value}, 'date':"{$element.displayValue}"{/if}
					{if $element.validatorParams.minValue || $element.validatorParams.maxValue || $element.validatorParams.minValueElement || $element.validatorParams.maxValueElement}
						, disableFunc:function(dt){
							var disable = false;
							{if $element.validatorParams.maxValue}
								if(dt.dateFormat("Y-m-d")>'{$element.validatorParams.maxValue}') {
									disable = true;
								}
							{/if}

							{if $element.validatorParams.minValue}
								if(dt.dateFormat("Y-m-d")<'{$element.validatorParams.minValue}') {
									disable = true;
								}
							{/if}
							
							{if $element.validatorParams.maxValueElement}
								if($F('{$element.validatorParams.maxValueElement}') && dt.dateFormat("Y-m-d")>$F('{$element.validatorParams.maxValueElement}')) {
									disable = true;
								}
							{/if}
							
							{if $element.validatorParams.minValueElement}
								if($F('{$element.validatorParams.minValueElement}') && dt.dateFormat("Y-m-d")<$F('{$element.validatorParams.minValueElement}')) {
									disable = true;
								}
							{/if}

							return disable;
						}
					{/if}
				});


				{if $element.hasValidator}
					_inputValidator.createOnLoad('{$element.id}_title', 'date', {$element.validatorParams|@json_encode},
						{ onBlur: function(value, validator){
							var dt = _inputValidator.parseDate(value, validator.dateFormats);
							if(dt){
								$('{$element.id}').value = dt.dateFormat("Y-m-d");
							}else{
								$('{$element.id}').value = '';
							}
						}
					});
				{/if}
			});
		{/if}
	{/block}
</script>