{********************************************************* @ author:
Nicolas Biersart @ email: n.biersart@esia-network.com
**********************************************************}
{if ! isset($adm_group_list)}
	{include file='overall_adm_iframe.html'}
{/if}
{if isset($l_adm_create_group_success)}
	<p class="EventOK">{$l_adm_create_group_success}</p> 
{/if} 
<!-- 
{if isset($l_adm_update_group_access_success)}
	<p class="EventOK">{$l_adm_update_group_access_success}</p> 
{/if} 
{if	isset($l_adm_update_group_sw_success)}
	<p class="EventOK">{$l_adm_update_group_sw_success}</p> 
{/if}  
-->
{if isset($l_adm_delete_group_success)}
	<p class="EventOK">{$l_adm_delete_group_success}</p> 
{/if} 
{if isset($l_adm_update_success)}
	<p class="EventOK">{$l_adm_update_success}</p> 
{/if}
{if isset($adm_group_create)}
	<form method="post" action="administration.php?admin=groups&amp;action=create">
		<table class="tab">
			<tr>
				<td>{$l_groupname}</td>
				<td><input type="text" name="groupname" /></td>
			</tr>
			<tr>
				<td>{$l_description}</td>
				<td><textarea name="groupdesc" rows="10" cols="50" name="groupdesc" /></textarea></td>
			</tr>
			<tr>
				<td colspan="2"><input type="submit" value="{$l_add}" /></td>
			</tr>
		</table>
	</form> 
{elseif isset($adm_group_list)}
	<script type="text/javascript">
	<!--
	{literal} 
		$(document).ready(function()
		{
			Adm.TableSorter("#userGroupTable","{/literal}{$lang.MODIF}{literal} ","adminTabs");
        	$("#userGroupTable").tablesorterPager({
	            container: $( "#usergrouppager" ),
	            output: '{startRow} to {endRow} ({filteredRows})',
	            size: 50,
          	});
	        $('#userGroupTable').data("tablesorter").widgets.push('print');
	        $('#userGroupTable').data("tablesorter").widgets.push('columnSelector');
	        $('#userGroupTable').data("tablesorter").widgetOptions['columnSelector_container']=$('#userGroupTable_columnSelector');
	        
       		$('#userGroupTable_print').on('click', function(){
                $('#userGroupTable').trigger('printTable');
        	});
		});
	{/literal}
	//-->
	</script>

	<div class="tableview_title">
		<h1>{$lang.GROUPS}</h1>
		{esia_pager divid="usergrouppager" 
				tablesorterid="userGroupTable" 
				divcss="pager" 
				height="22px"
				ulclass="triList" 
				langprint="{$lang.ADM_PRINT_BOARD}"
				langcolumn="{$lang.ADM_SHOW_HIDDEN_COLUMN}"
				liclass="triElement"
				icn_printer="/theme/default/images/table-print.jpg"
				icn_column="/theme/default/images/table-change-order.jpg"
				icn_columnselect="/theme/default/images/table-change-order.jpg"}
			<a href="/administration.php?admin=groups&amp;action=create" title="{$lang.ADM_CREATE_GROUP}" onclick="Adm.openDialog(this,'{$lang.ADM_CREATE_GROUP}'); return false;" style="margin-right:5px;margin-left:5px;">
			<img class="btn_img" src="/theme/default/images/add-user-group2.png" alt="{$lang.ADM_CREATE_GROUP}"/>
			
		</a>  		
		{/esia_pager}
	</div>
	<table id="userGroupTable" class="tab">
		<thead>
			<tr>
					<th class="leftAlign">{$l_groups}</th>
					<th class="leftAlign">{$l_description}</th>
					<th>{$l_adm_action}</th>
				</tr>
		</thead>
		<tbody>
			{foreach name=outer item=grp from=$list_grp}
				<tr>
					<td><a href="./administration.php?admin=groups&amp;action=view&amp;group={$grp.id}">{$grp.name}</a></td>
					<td>{$grp.description}</td>
					<td style="text-align:center">
						<a href="./administration.php?admin=groups&amp;action=view&amp;group={$grp.id}">
							<img class="button" src="/theme/default-image/esia_update_button2.png" alt="{$l_adm_change}" title="{$l_adm_change}" />
						</a> 
						{if $grp.id != 1}
						<a href="./administration.php?admin=groups&amp;action=supprimer&amp;group={$grp.id}">
							<img class="button" src="/theme/default-image/esia_delete_button.png" alt="{$l_adm_delete}" title="{$l_adm_delete}" />
						</a>
						{/if}
					</td>
				</tr>
			{/foreach}
		</tbody>
	</table> 
{elseif isset($adm_group_view)}
	<script type="text/javascript">
	<!--
	{literal} 
		function transfert_opt(idselect1,idselect2)
		{
			$("#"+idselect1+" option").each(function() 
			{
				var value = this.value;
			    var nodeName = this.text;
			    var optkey = this.parentNode.label;
			    if(optkey)
			    {
				    if( $( "#opt-"+idselect2+"-"+optkey ).length )
				    {
				    	$( "#opt-"+idselect2+"-"+optkey ).append('<option value="'+value+'">'+nodeName+'</option>');	
				    }
				    else
				    {
				    	$("#"+idselect2).append('<optgroup id="opt-'+idselect2+'-'+optkey+'" label="'+optkey+'"><option value="'+value+'">'+nodeName+'</option></optgroup>');
				    }
			    }
			    else
			    {
			    	$("#"+idselect2).append('<option value="'+value+'">'+nodeName+'</option>');
			    }
			    this.remove();
			});
	       	
		}
		function searchNode()
		{
			var stext = $("#searchNode").prop('value');
			if(stext.length > 2)
			{
	            var tag =  new RegExp(stext,"i");
	            $("#node_access").children().hide();
	            $("#node_available").children().hide();
				$("#node_available option").each(function() 
				{
	                if(this.text.search(tag)==-1)
	                {
	                    $(this).hide();
	                }
	                else
	                {
	                	$(this).parent().show();
	                    $(this).show();
	                }
				});
				$("#node_access option").each(function() 
				{
					if(this.text.search(tag)==-1)
					{
						$(this).hide();
					}
					else
					{
						$(this).parent().show();
						$(this).show();
					}
				});
			}
			else if(stext.length == 0)
			{
	            $("#node_access").children().show();
	            $("#node_available").children().show();
				$("#node_available option").each(function() 
				{	
					$(this).show();
				});
				$("#node_access option").each(function() 
				{
					$(this).show();
				});
			}
		}
		function transfert_elem(elem,selectdest)
		{
		    var value = $(elem).val();
		    var nodeName = elem.options[elem.selectedIndex].text;	
		    var optkey = elem.options[elem.selectedIndex].parentNode.label;
		    if(optkey)
		    {
			    if( $( "#opt-"+selectdest+"-"+optkey ).length )
			    {
			    	$( "#opt-"+selectdest+"-"+optkey ).append('<option value="'+value+'">'+nodeName+'</option>');	
			    }
			    else
			    {
			    	$( "#"+selectdest).append('<optgroup id="opt-'+selectdest+'-'+optkey+'" label="'+optkey+'"><option value="'+value+'">'+nodeName+'</option></optgroup>');
			    }
		    }
		    else
		    {
		    	$( "#"+selectdest).append('<option value="'+value+'">'+nodeName+'</option>');
		    }
		    elem.options[elem.selectedIndex].remove();
		}
		function submitGroupForm()
		{
			if($("#node_access option").length ==0)
			{
				$("#node_access").append('<option value="0"></option>');	
			}
			if($("#privilege_access option").length ==0)
			{
				$("#privilege_access").append('<option value="0"></option>');	
			}
			$("#privilege_access option").prop("selected",true);
			var arr = new Array();
			var elem = $('#node_access option');
			elem.each( function(index,elm) 
			{
				var id = $(elm).val();
				arr.push(id);
			});	
			$('#node_access_json').val(JSON.stringify(arr));
			$('#node_available').empty();	
			$('#node_access').empty();
		}	
		function transfertGroup(opt,src,dest)
		{
			key = opt.replace(' ','--');
		    if( $( "#opt-"+dest+"-"+key ).length ==0 )
		    {
		    	optgroup = $('<optgroup id="opt-'+dest+'-'+key+'" label="'+opt+'"></optgroup>');
		    	optgroup.on('click', function(){transfertGroup(opt,dest,src);});
		    	$( "#"+dest).append(optgroup);
		    }
			$("#opt-"+src+'-'+key+' option').each( function(index,elm)
			{
			    var value = $(elm).val();
			    var nodeName = $(elm).text();
				$( "#opt-"+dest+"-"+key ).append('<option value="'+value+'">'+nodeName+'</option>');
			});
			$("#opt-"+src+'-'+key).remove();
		}
        $(document).ready(function() 
    	{
			$("#searchNode").on('keyup', searchNode);
			$("#searchNode").tooltip({
				  position: { my: "left+15 center", at: "right center"}
			});
    	});
	{/literal}
	//-->
	</script>
	<div class="tableview_title">
		<h1>{$lang.INFORMATIONS}</h1>
		<div class="pager">
			<ul class="triList">
				<li class="triElement">
					<a title="{$lang.ADM_GROUP_DELETE}" href="/administration.php?admin=groups&amp;action=supprimer&amp;group={$adm_groupid}">
						<img class="btn_img" src="/theme/default/images/group-delete.jpg" alt="{$lang.ADM_GROUP_DELETE}" />
					</a>
				</li>
			</ul>
		</div>
	</div>
	<table class="tab">
		<tr>
			<td>{$l_groupname}</td>
			<td>{$adm_groupname}</td>
		</tr>
	</table>
	<div class="tableview_title">
		<h1>{$lang.PERM}</h1>
	</div>
	<div class="contentView">
		<form action="administration.php?admin=groups&action=maj&amp;group={$adm_groupid}" method="post" onsubmit="submitGroupForm();">
		<input type="hidden" value="" id="node_access_json" name="node_access_json">
		<table class="droitgrp" style="margin-left:auto; margin-right:auto;">
			<tr>
				<td>
					<table>
						<tr>
							<td>{$l_adm_access_available}<br />
								<select id="privilege_available" name="privilege_available[]" multiple="multiple" class="select_group_access"> 
									{foreach name=outer item=acc from=$adm_group_list_access}
										<option value="{$acc.id}">{$acc.name}</option> 
									{/foreach}
								</select>
							</td>
							<td>
								<input type="button" value=">>" onclick="transfert_opt('privilege_available','privilege_access');"><br /><br />
								<input type="button" value="<<" onclick="transfert_opt('privilege_access','privilege_available');">
							</td>
							<td>{$l_adm_access_auth}<br />
								<select id="privilege_access" name="privilege_access[]" class="select_group_access" multiple="multiple"> 
									{foreach name=outer item=acc from=$adm_group_list_auth}
										<option value="{$acc.id}">{$acc.name}</option> 
									{/foreach}
								</select>
							</td>
						</tr>
					</table>
				</td>
				<td style="width:30px;"></td>
				<td>
					<table style=" margin:5px;">
						<tr>
							<td colspan="3" style="text-align:center;">
							{$lang.SEARCH}
							<input type="text" id="searchNode" class="input_group_access" autocomplete="off" title="{$lang.ADM_GROUP_SEARCH_TIPS}"/>
						</td>
						</tr>
						<tr>
							<td>{$l_adm_dev_available}<br />
								<select id="node_available" name="node_available[]" class="select_group_access" multiple="multiple"> 
									{foreach name=outer key=key item=items from=$adm_group_list_dev_dispo}
										
										{if $key eq ''}
											<optgroup id="opt-node_available-NoGroup" label="NoGroup" onclick="transfertGroup('NoGroup','node_available','node_access');">
										{else}
											<optgroup id="opt-node_available-{$key|replace:' ':'--'}" label="{$key|escape:javascript}" onclick="transfertGroup('{$key|replace:' ':'--'}','node_available','node_access');">
										{/if}
										{foreach name=outers item=dev from=$items}
											<option value="{$dev.id}">{$dev.name}</option>
										{/foreach} 
										</optgroup>
									{/foreach}
								</select>
							</td>
							<td>
								<input type="button" value=">>" onclick="transfert_opt('node_available','node_access');"><br /><br />
								<input type="button" value="<<" onclick="transfert_opt('node_access','node_available');">
							</td>
							<td>{$l_adm_dev_auth}<br />
								<select id="node_access" name="node_access[]" class="select_group_access" multiple="multiple"> 
									{foreach name=outer key=key item=items from=$adm_group_list_dev_auto}
										{if $key eq ''}
											<optgroup id="opt-node_access-NoGroup" label="NoGroup" onclick="transfertGroup('NoGroup','node_access','node_available');">
										{else}
											<optgroup id="opt-node_access-{$key|replace:' ':'--'}" label="{$key}" onclick="transfertGroup('{$key}','node_access','node_available');">
										{/if}
										{foreach name=outers item=dev from=$items}
											<option value="{$dev.id}">{$dev.name}</option>
										{/foreach} 
										</optgroup>
									{/foreach}
								</select>
							</td>
						</tr>
					</table>
					<script type="text/javascript">	
						$(function()
						{
							var l_available = "{$l_adm_access_available}";
							var l_auth = "{$l_adm_access_auth}";
							var l_nodeavailable = "{$l_adm_dev_available}";
							var l_nodeauth = "{$l_adm_dev_auth}";
							var l_select ="{$lang.REPORT_SELECTALL}";
							var l_unselect ="{$lang.REPORT_SELECTALL}";
							{literal}
							$('#listeSelection').multiSelect({ 
									selectableHeader: l_available,
									selectionHeader: l_auth,
									selectableOptgroup: true,
									selectAllButton: l_select,
									unselectAllButton:l_unselect
								});
							$('#node_available').on('change', function(){ 
								transfert_elem(this,'node_access');
							});
							$('#node_access').on('change', function()
							{
								transfert_elem(this,'node_available');
							});
							$('#privilege_available').on('change', function()
							{
								transfert_elem(this,'privilege_access');
							});
							$('#privilege_access').on('change', function()
							{
								transfert_elem(this,'privilege_available');
							});
							{/literal}
						});
					</script>
				</td>
			</tr>
		</table> 
		
		<div style="text-align:center; margin-top:20px">
			<td><input type="submit" value="{$lang.ADM_GROUP_ACCESS_UPDATE}" /></td>
		</div>
		</form>
	</div>
{elseif isset($adm_group_delete)}
	<form method="post" action="/administration.php?admin=groups&amp;action=supprimer" name="plugin_del">
		<p>
			{$l_adm_del_group_confirm} {$group.name}<br />{$l_description}:
			{$group.description}
		</p>
		<input type="hidden" name="group" value="{$group.id}"> 
		<input type="submit" value="supprimer" />
	</form> 
{/if}