<script type="text/javascript">
var period_id = {$period_tab};
</script>
<table class="ListTable" style='padding-top:0px;margin-top:0px;'>
<tr class="list_one">
	<td class="FormRowField">{$days}</td>
	<td class="FormRowValue">
	<input type="checkbox" name="periods[{$period_tab}][days][]" value="7" />&nbsp;{$sunday}<br/>
	<input type="checkbox" name="periods[{$period_tab}][days][]" value="1" />&nbsp;{$monday}<br/>
	<input type="checkbox" name="periods[{$period_tab}][days][]" value="2" />&nbsp;{$tuesday}<br/>
	<input type="checkbox" name="periods[{$period_tab}][days][]" value="3" />&nbsp;{$wednesday}<br/>
	<input type="checkbox" name="periods[{$period_tab}][days][]" value="4" />&nbsp;{$thursday}<br/>
	<input type="checkbox" name="periods[{$period_tab}][days][]" value="5" />&nbsp;{$friday}<br/>
	<input type="checkbox" name="periods[{$period_tab}][days][]" value="6" />&nbsp;{$saturday}<br/>
</tr>
<tr class="list_two">
	<td class="FormRowField">{$time_period}</td>
	<td class="FormRowValue">
	<input type="text" id="start_period_{$period_tab}" name="periods[{$period_tab}][start_period]" size="6" class="timepicker" />&nbsp;-&nbsp;<input id="stop_period_{$period_tab}" type="text" name="periods[{$period_tab}][end_period]" size="6" class="timepicker" />
	</td>
</tr>
<tr class="list_one">
	<td class="FormRowField">{$downtime_type}</td>
	<td class="FormRowValue">
	<input type="radio" name="periods[{$period_tab}][fixed]" value="1" checked="checked" />{$fixed}<br/>
	<input type="radio" name="periods[{$period_tab}][fixed]" value="0" />{$flexible}&nbsp;
	<input type="text" name="periods[{$period_tab}][duration]" size="6" />&nbsp;
    <select name="periods[{$period_tab}][scale]">
        <option selected="selected" value="s">{$seconds}</option>
        <option value="m">{$minutes}</option>
        <option value="h">{$hours}</option>
        <option value="d">{$days}</option>
    </select>
	</td>
</tr>
</table>
{assign var=period_info value=$period_tab-1}
{literal}
<script type="text/javascript">
jQuery(function() {
	if (listPeriod != 'undefined' && listPeriod[{/literal}{$period_info}{literal}] != undefined) {
		var infos_{/literal}{$period_info}{literal} = listPeriod[{/literal}{$period_info}{literal}];
        jQuery('input[name="periods[{/literal}{$period_tab}{literal}][start_period]"]')[0].value = infos_{/literal}{$period_info}{literal}.start_time;
        jQuery('input[name="periods[{/literal}{$period_tab}{literal}][end_period]"]')[0].value = infos_{/literal}{$period_info}{literal}.end_time;
        jQuery('input[name="periods[{/literal}{$period_tab}{literal}][duration]"]')[0].value = infos_{/literal}{$period_info}{literal}.duration;
        jQuery('input[name="periods[{/literal}{$period_tab}{literal}][fixed]"]').each(function (index, item) {
			if (item.value == infos_{/literal}{$period_info}{literal}.fixed) {
				item.checked = true;
			}
		});

        jQuery.each(infos_{/literal}{$period_info}{literal}.day_of_week, function (index, value) {
            jQuery('input[name="periods[{/literal}{$period_tab}{literal}][days][]"]').each(function (index_form, item_form) {
                if (item_form.value == value) {
                    item_form.checked = true;
                }
            });

        });

	}
        jQuery(".timepicker").timepicker();
});

$(document).ready(function () {
    var validButton = $('#validForm');
    if (!validButton.length) {
        $("#tabs_periods :input").prop("disabled", true);
    }
});
</script>
{/literal}
