{strip}
<div id="content" >
    <table >
        <tr>
            <td class="text_head">{if $template->template_id}{t}Edycja szablonu{/t}{else}Dodawanie szablonu{/if}</td>
            <td class="text_head_help"></td>
        </tr>
        <tr>
            <td class="text_head_line1"></td>
            <td class="text_head_line2"></td>
        </tr>
    </table><br />


    {* wyswietlanie bledow i informacji*}
    {assign var="errTab" value=$errTemplates}
    {assign var="msgTab" value=$msgTemplates}
    {include file="provex/error.inc.tpl"}
    {include file="provex/msg.inc.tpl"}

    <!-- wyszukiwanie -->

    <form data-check-form-changed="1" id="form_provexTemplateEdit" name="provexTemplateEdit" method="post" action="">
        <input type="hidden" name="{$formName}[timestamp]" value="{time()}"/>
        <input type="hidden" name="templateId" value="{$template->template_id}"/>
        <input type="hidden" data-form-action="1" name="{$formName}[action]" value=""/>
        <table class="form_table" cellspacing="1">
            <tr>
                <td colspan="2">
                    <table>
                        <tr>
                            <td class="key_left"></td>
                            <td class="key">
                                <a href="#" class="submit-btt">{t}Zapisz{/t}</a>
                            </td>
                            <td class="key_right"></td>
                            {if $template->template_id}

                            <td></td>
                            <td class="key_left"></td>
                            <td class="key">
                                <a href="#" class="remove-btt">{t}Usuń{/t}</a>
                            </td>
                            <td class="key_right"></td>
                            {if $template->template_status == 'DRAFT'}
							<td></td>
                            <td class="key_left"></td>
                            <td class="key">
                                <a href="#" class="activate-btt">{t}Aktywuj{/t}</a>
                            </td>
                            <td class="key_right"></td>
                            {/if}
							{if $template->template_status == 'ACTIVE'}
							<td></td>
                            <td class="key_left"></td>
                            <td class="key">
                                <a href="#" class="deactivate-btt">{t}Deaktywuj{/t}</a>
                            </td>
                            <td class="key_right"></td>
                            {/if}
                            {/if}
                        </tr>
                    </table>
                </td>

            </tr>


            {if $template->template_id}
            <tr>
                <td class="form_label">{t}ID{/t}:</td>
                <td class="text_block">{$template->template_id}</td>
            </tr>
            {/if}
            <tr>
                <td class="form_label">{t}Nazwa{/t}:<span class="required-star">*</span></td>
                <td class="text_block"><input type="text" name="{$formName}[templateName]" value="{$formData['templateName']}" style="width:400px;"/></td>
            </tr>
            <tr>
                <td class="form_label">{t}Typ{/t}:<span class="required-star">*</span></td>
                <td class="text_block">
                    <select name="{$formName}[templateType]">
                        <option value="HTTP" {if $formData['templateType'] == 'HTTP'}selected{/if}>{t}HTTP{/t}</option>
                        <option value="TFTP" {if $formData['templateType'] == 'TFTP'}selected{/if}>{t}TFTP{/t}</option>
                    </select></td>
            </tr>
            {if $template->template_id}
            <tr>
                <td class="form_label">{t}Status{/t}:</td>
                <td class="text_block">
                    {$template->template_status}
                </td>
            </tr>
            {/if}
            <tr>
                <td class="form_label">{t}Model{/t}:<span class="required-star">*</span></td>
                <td class="text_block">
                    <select name="{$formName}[modelId]">
                        {foreach name=list from=$modelList->model_list item=row}
                        <option value="{$row->model_id}" {if $formData['modelId'] == $row->model_id}selected{/if}>{$row->model_symbol}</option>
                        {/foreach}
                    </select></td>
            </tr>
			<tr>
                <td class="form_label">{t}Usuwać po pobraniu?{/t}:<span class="required-star">*</span></td>
                <td class="text_block">
					<select name="{$formName}[deleteFileAfterDownload]">
						<option value="0" {if $formData['deleteFileAfterDownload'] == true}selected="selected"{/if}>nie</option>
						<option value="1" {if $formData['deleteFileAfterDownload'] == true}selected="selected"{/if}>tak</option>
                    </select>
				</td>
            </tr>
			<tr>
                <td class="form_label">{t}Czas timeout [min]{/t}:<span class="required-star">*</span></td>
                <td class="text_block"><input type="text" name="{$formName}[configurationTimeout]" value="{$formData['configurationTimeout']}" style="width:50px;"/></td>
            </tr>

            {if $template->template_id}
            <tr>
                <td class="form_label">{t}Data modyfikacji{/t}:</td>
                <td class="text_block">{$template->modification_date}</td>
            </tr>
            <tr>
                <td class="form_label">{t}Data utworzenia{/t}:</td>
                <td class="text_block">{$template->creation_date}</td>
            </tr>
            {/if}
            <tr>
                <td colspan="2" class="text_block" style="text-align:center;border-bottom:1px solid black;">{t}Parametry{/t}<span class="required-star">*</span></td>

            </tr>



            <tr>
                <td class="form_label" style="vertical-align:top;padding-top:15px;"></td>
                <td class="text_block">
					<a href="#" class="provex-add-item">{t}dodaj{/t}</a>&nbsp;&nbsp;
					<input id="itemSelect2AddId" type="hidden" name="" value=""/>
                    <input id="itemSelect2Add" type="text" name="" value=""/>&nbsp;&nbsp;{t}wpisz początek nazwy systemowej parametru{/t}<br/>
					<br/>
					<input class="template-list-serialized" type="hidden" name="{$formName}[templateItemListSerialized]" value=""/>
                    <table id="templateItemList" class="data_table" cellspacing="1">
                        <thead>
                            <tr>
                                <td class="">
									<input type="checkbox" class="toggle-checkboxes-switch" name="" value="" title="{t}zaznacz wszystkie{/t}"/>
								</td>
                                <td></td>
                                <td class="">{t}Nazwa systemowa{/t}</td>
                                <td class="">{t}Nazwa producenta{/t}</td>
                                <td class="">{t}Typ{/t}</td>
                                <td class="" style="width:200px;">{t}Wartość domyślna{/t}</td>
                                <td class="">{t}Komentarz{/t}</td>
                            </tr>
                        </thead>
                        <tbody>
                        {foreach name=list from=$formData['templateItemList'] key=itemId item=row}
							<tr class="item-row" data-item-id="{$itemId}" {if $row['toRemove']}style="display:none;"{/if}>
								<td class=""><input data-item-id="{$itemId}" type="checkbox" name="{$formName}[selectedIds][]" value="{$row['itemId']}"/></td>
                                <td class="">
									<a href="#" data-item-id="{$itemId}" class="provex-remove-item">{t}usuń{/t}</a>&nbsp;
									<a href="#" data-item-id="{$itemId}" class="provex-edit-item">{t}edycja{/t}</a>
									<input class="item-value-input-provexName" type="hidden" name="{$formName}[templateItemList][{$itemId}][provexName]" value="{$row['provexName']}"/>
									<input class="item-value-input-vendorName" type="hidden" name="{$formName}[templateItemList][{$itemId}][vendorName]" value="{$row['vendorName']}"/>
									<input class="item-value-input-itemId" type="hidden" name="{$formName}[templateItemList][{$itemId}][itemId]" value="{$row['itemId']}"/>
									<input class="item-value-input-defaultValue" type="hidden" name="{$formName}[templateItemList][{$itemId}][defaultValue]" value="{$row['defaultValue']}"/>
									<input class="item-value-input-type" type="hidden" name="{$formName}[templateItemList][{$itemId}][type]" value="{$row['type']}"/>
									<input class="item-value-input-comment" type="hidden" name="{$formName}[templateItemList][{$itemId}][comment]" value="{$row['comment']}"/>

								</td>
                                <td class="">{$row['provexName']}</td>
                                <td class="">{$row['vendorName']}</td>
                                <td class="">{$row['type']}</td>
                                <td class=" item-value-html-defaultValue">
                                {if $row['type'] == 'TEXT'}
                                    {$row['defaultValue']}
                                {elseif  $row['type'] == 'INTEGER'}
                                    {$row['defaultValue']}
                                {elseif  $row['type'] == 'BOOL'}
                                    {if {$row['defaultValue']}}{t}TAK(BOOL){/t}
									{else}{t}NIE(BOOL){/t}
									{/if}
                                {/if}
                                </td>
                                <td class="">
                                {$row['comment']}
                                </td>
                            </tr>
                        {/foreach}
                        </tbody>
                        <tfoot>

                            <tr>
                                <td class="td_data">
									<input type="checkbox" class="toggle-checkboxes-switch" name="" value="" title="{t}zaznacz wszystkie{/t}"/>
								</td>
                                <td class="td_data" colspan="8" style="text-align: left">
                                    <a class="provex-list-link-remove-selected" href="#">{t}usuń zaznaczone{/t}</a>&nbsp;&nbsp;
									<a class="provex-list-link-remove-all" href="#">{t}usuń wszystkie{/t}</a>&nbsp;&nbsp;

                                </td>
                            </tr>

                        </tfoot>
                    </table>




                </td>
            </tr>
			<tr>
				<td class="form_label"><span class="required-star">*</span></td>
				<td class="text_block">{t}- pola wymagane{/t}</td>
			</tr>
            <tr>
                <td colspan="2">
                    <table>
                        <tr>
                            <td class="key_left"></td>
                            <td class="key">
                                <a href="#" class="submit-btt">{t}Zapisz{/t}</a>
                            </td>
                            <td class="key_right"></td>
                            {if $template->template_id}

                            <td></td>
                            <td class="key_left"></td>
                            <td class="key">
                                <a href="#" class="remove-btt">{t}Usuń{/t}</a>
                            </td>
                            <td class="key_right"></td>
                            {if $template->template_status == 'DRAFT'}
							<td></td>
                            <td class="key_left"></td>
                            <td class="key">
                                <a href="#" class="activate-btt">{t}Aktywuj{/t}</a>
                            </td>
                            <td class="key_right"></td>
                            {/if}
							{if $template->template_status == 'ACTIVE'}
							<td></td>
                            <td class="key_left"></td>
                            <td class="key">
                                <a href="#" class="deactivate-btt">{t}Deaktywuj{/t}</a>
                            </td>
                            <td class="key_right"></td>
                            {/if}
                            {/if}
                        </tr>
                    </table>
                </td>

            </tr>
        </table>
    </form>
</div>
<div class="item-details" style="display:none;">
	<div class="provex-loader"></div>
</div>
{/strip}
<script>
// submit formularza
$('.submit-btt').click(function(e){
    e.preventDefault();
    pageFormChanged = false;
	var oTable = $('#templateItemList').dataTable();
	var sData = oTable.$('input').serialize();
	$('.template-list-serialized').val(sData);
    $(this).parents('form:first').submit();
});
    
    // usuwanie
$('.remove-btt').click(function(e){
    if(!confirm('{t}Czy jesteś pewien?{/t}')){
        return false;
    }
    e.preventDefault();
    $(this).parents('form:first').find('[data-form-action]').val('delete');
    $(this).parents('form:first').submit();
});
    // usuwanie
$('.activate-btt').click(function(e){
    if(!confirm('{t}Czy jesteś pewien?{/t}')){
        return false;
    }
    e.preventDefault();
    $(this).parents('form:first').find('[data-form-action]').val('activate');
    $(this).parents('form:first').submit();
});
    // usuwanie
$('.deactivate-btt').click(function(e){
    if(!confirm('{t}Czy jesteś pewien?{/t}')){
        return false;
    }
    e.preventDefault();
    $(this).parents('form:first').find('[data-form-action]').val('deactivate');
    $(this).parents('form:first').submit();
});
  
// usuwanie itemów
$('.provex-list-link-remove-all').click(function(e){
	var oTable = $('#templateItemList').dataTable();
	if(!confirm('{t}Czy jesteś pewien?{/t}')){
        return false;
    }
    e.preventDefault();
	oTable.fnClearTable();
});
   
$('.toggle-checkboxes-switch').live('click',function(){
    var checked = $(this).attr('checked');
    if(checked != 'checked' && checked != true){
        checked = false;
    }
    $('.dataTables_wrapper :checkbox').attr('checked',checked);

});    

// dodawanie itemów
$('.provex-add-item').click(function(e){
    e.preventDefault();
    var itemId = $( "#itemSelect2AddId" ).val();
	if(!itemId){
		alert('{t}Nie wybrano parametru lub prametr jest błędny.{/t}');
		return false;
	}
	var oTable = $('#templateItemList').dataTable()
	var isAdded = oTable.$('tr[data-item-id="'+itemId+'"]');
	if(isAdded.length > 0){
		alert('{t}Wybrany parametr jest już na liście użytkownika.{/t}');
		return false;
	}
	
	var mode = 'add';
    var content = $('.item-details').html();
    var vendorName = '';
    var defaultValue = '';
    var dialogEl = $('.item-dialog');
	
    dialogEl.dialog('destroy');
    dialogEl.remove();
    $(this).parents('form:first').after('<div class="item-dialog" title="{t}Edycja parametru{/t}"></div>');
    dialogEl = $('.item-dialog');
    dialogEl.html(content);
    dialogEl.dialog({ width : 550,autoOpen : true,modal : true,closeOnEscape : false,draggable : true,resizable : true,dialogClass : '' });
    
    // ajax do servera
    $.post('ajax.php?action=provexTemplateItemEdit',{ itemId : itemId, vendorName: vendorName, defaultValue: defaultValue, mode: mode },function(data){
        dialogEl.html(data);
        
    },'html');

	$( "#itemSelect2AddId" ).val('');
	$( "#itemSelect2Add" ).val('');
});


// usuwanie itemów
$('.provex-remove-item').live('click',function(e){
    if(confirm('{t}Czy jesteś pewien?{/t}')){
		e.preventDefault();
		var oTable = $('#templateItemList').dataTable()
		var aPos = oTable.fnGetPosition( $(this).parents('td:first').get(0) );
		oTable.fnDeleteRow(aPos[0]);
	}

});
// edytowanie itemów
$('.provex-edit-item').live('click',function(e){
    e.preventDefault();
    var itemId = $(this).data('item-id');
	var defaultValue = $(this).parents('tr:first').find('.item-value-input-defaultValue').val();
	var vendorName = $(this).parents('tr:first').find('.item-value-input-vendorName').val();
    var content = $('.item-details').html();
    var dialogEl = $('.item-dialog');
	var mode = 'edit';
    dialogEl.dialog('destroy');
    dialogEl.remove();
    $(this).parents('form:first').after('<div class="item-dialog" title="{t}Edycja parametru{/t}"></div>');
    dialogEl = $('.item-dialog');
    dialogEl.html(content);
    dialogEl.dialog({ width : 550,autoOpen : true,modal : true,closeOnEscape : false,draggable : true,resizable : true,dialogClass : '' });
    
    var form = $(this).parents('form:first').serialize();
    // ajax do servera
    $.post('ajax.php?action=provexTemplateItemEdit',{ itemId : itemId, vendorName: vendorName, defaultValue: defaultValue, mode: mode },function(data){
        dialogEl.html(data);
        
    },'html');
});
var allowDeletion = false;
// usuwanie itemów
$('.provex-list-link-remove-selected').click(function(e){
    var oTable = $('#templateItemList').dataTable()
    var selected = oTable.$(':checkbox:checked');
    var selectedCount = selected.length;
    if(selectedCount == 0){
        alert('{t}Nie zaznaczono rekordów.{/t}');
        return false;
    }
    if(!confirm('{t}Czy jesteś pewien?{/t}')){
        return false;
    }
    e.preventDefault();
	
	

	
	var dialogEl = $('.item-dialog');
	var content = $('.item-details').html();
    dialogEl.dialog('destroy');
    dialogEl.remove();
    $(this).parents('form:first').after('<div class="item-dialog" title="{t}Usuwanie elementów{/t}"></div>');
    dialogEl = $('.item-dialog');
    dialogEl.html(content);
    dialogEl.dialog({ width : 250,autoOpen : true,modal : true,closeOnEscape : false,draggable : false,resizable : false,dialogClass : '', beforeClose : function(event, ui){ allowDeletion = false; } });
    $(this).parents('.dataTables_wrapper').find('.toggle-checkboxes-switch').attr('checked',false);
	allowDeletion = true;
	fnRemoveItems(selected);
    
});


function fnRemoveItems(selected){
	var itemId = false;
	var node = false;
	var checkbox = false;
	var aPos = false;
	var item = false;

	
	var form = $('#form_provexTemplateEdit').serialize();
    // ajax do servera
    $.post('ajax.php?action=provexConfigurationItemRemove',{ cnt : selected.length },function(data){
		var oTable = $('#templateItemList').dataTable();
        if(data && data > 0 && allowDeletion){
			while(data > 0 && selected.lenght !=0){
			
				checkbox = selected.first();
				selected = selected.filter(':not(:first)');
				node = checkbox.parents('td:first').get(0);
				if(!node || node == undefined)break;
				aPos = oTable.fnGetPosition( node );
				oTable.fnDeleteRow(aPos[0],null,false);
				data--;
			}
			oTable.fnDraw();
			fnRemoveItems(selected);
		}
		else {
			oTable.fnDraw();
			$('.item-dialog').dialog('destroy');
		}
		
		
    },'json');

}


$( "#itemSelect2Add" ).autocomplete({
		//define callback to format results
					source: function(req, add){
					
						//pass request to server
						$.getJSON("ajax.php?action=provexGetItemList", req, function(data) {
							
							//create array for response objects
							var suggestions = [];
							
							//process response
							$.each(data, function(i, val){								
								suggestions.push({ label : val.label, value: val.value });
							});
							
							//pass array to callback
							add(suggestions);
						});
					},
					focus: function(event, ui){
						return false;
					},
					//define select handler
					select: function(e, ui) {
						$( "#itemSelect2Add" ).val(ui.item.label);
						$( "#itemSelect2AddId" ).val(ui.item.value);
						return false;
					}
										
		});

$(document).ready(function(){
	$('#templateItemList').dataTable({
		"bPaginate": false,
		"bInfo": false,
		"bLengthChange": false,
		"bFilter": true,
		"sScrollY": '400px',
		"bScrollCollapse": true,
		"aoColumns" : [
		{ bSortable : false, bSearchable : false },
		{ bSortable : false, bSearchable : false },
		{ bSortable : true },
		{ bSortable : true },
		{ bSortable : false },
		{ bSortable : true },
		{ bSortable : false },
		],
        "oLanguage": dataTablesoLanguage
	});
});


</script>