{include file="$admingentemplates/admin_top.tpl"}
<link href="{$site_root}{$template_root}/css/alert.css" rel="stylesheet" type="text/css">
<div id="boxes">
	<div id="close" class="close" onclick="Close()"></div>
	<div id="dialog" class="window">
	</div>
</div>
<div id="mask"></div>
<div class="back">
    <a href="{$file_name}">{$lang.button.back}</a>
</div>
<div class="cr"></div>
<div class="show_help" style="display: none;">&nbsp;</div>
<div class="red_header">{$lang.admin_games.razdel_name}</div>
<div class="cr">&nbsp;</div>
<div class="cr">&nbsp;</div>
<div class="help_text" style="display:block;">
    <div class="close_help">
        <img src="{$site_root}{$template_root}/images/close_help.png" alt="">
    </div>
    <div class="help_body">
        <span class="help_title">{$lang.help}:</span>{$help.admin_games_list}
    </div>
</div>
<div class="cr">&nbsp;</div>
<div id="tooltip" onclick="hideToolTip()" style="text-align:center; background-color: #FFFFFF; border: 1px dotted; text-align: {$default_left}; position:absolute; display:none; padding:5px;"></div>
{literal}
<script type="text/javascript">
$(function() {
$('#tool_tip_4 *').tooltip();
});
</script>
{/literal}
<div>
{*	<div>
		<div><a href="{$file_name}"><b>{$lang.admin_games.back_to_categories_list}</b></a></div>
	</div>*}
	<div id="games_search_div">
	<table border=0 cellspacing=0 cellpadding=0 width="100%">
		<tr bgcolor="#ffffff">
			<td colspan=4 class="main_content_text">
				{if $links}
				<div style="margin-{$default_left}: 0px; padding-top: 15px;">
				{foreach item=item from=$links}
					<span style="padding-{$default_right}: 15px;"><a href="{$item.link}" {if $item.selected eq '1'} class="text_head"{/if}>{$item.name}</a></span>
				{/foreach}
				</div>
				{/if}
			</td>
		</tr>
		<tr class="table_header">
			<td class="main_header_text" align="left" width="15%">{$lang.admin_games.games_icon}</td>
			<td class="main_header_text" align="center" width="30%">{$lang.games.categories}</td>
			<td class="main_header_text" align="center" width="35%">{$lang.admin_games.games_name}</td>
			<td class="main_header_text" align="right" width="20%">{$lang.admin_games.actions}</td>
		{section name=i loop=$games_list}
		<tr {if $smarty.section.i.index mod 2 eq 1}class="table_row even"{else}class="table_row odd"{/if}>
			<td class="main_content_text" align="left" style="padding:5px 10px 5px 10px;">
				<img src="{$games_list[i].icon}" height="100" width="100">
			</td>
			<td class="main_content_text" valign="top" align="center" style="padding:5px 10px 5px 10px;"><div style="padding-left:10px;">{$games_list[i].category}</td>
			<td class="main_content_text" valign="top" align="center" style="padding:5px 10px 5px 10px;"><div style="padding-left:10px;">{$games_list[i].name}</td>
			<td class="main_content_text" valign="top" align="right" style="padding:5px 10px 5px 10px;">
					<div class="block_action fr" style="display: none;">
						<div class="action_del" style="display: block;">				
							<img width="16" alt="" src="{$site_root}{$template_root}/images/photo_delete.png" onmouseout="javascript:hideToolTip();" onmouseover="javascript: showToolTip(event,'{$lang.button.delete}');return false" onclick="PopUp('delete_game','{$games_list[i].id}')">
						</div>
					</div>
					<div style="width:10px;float:right;" class="fl">&nbsp;</div>
					<div class="block_action fr" style="display: none;">
						<div class="action_edit" style="display: block;">
							<img width="16" alt="" src="{$site_root}{$template_root}/images/edit.png" onmouseout="javascript:hideToolTip();" onmouseover="javascript: showToolTip(event,'{$lang.button.edit}');return false" onclick="document.location.href='{$file_name}?sel=edit_game&id_category={$games_list[i].id_category}&id_games={$games_list[i].id}'">
						</div>
					</div>
			</td>
		</tr>
		{sectionelse}
		<tr height="40">
			<td class="main_error_text" align="left" colspan="4" bgcolor="#FFFFFF">{$lang.interests_spr.empty}</td>
		</tr>
		{/section}
{*		<tr bgcolor="#ffffff">
			<td colspan=4 class="main_content_text">
			{if $links}
			<div style="margin-{$default_left}: 0px; padding-top: 15px;">
			{foreach item=item from=$links}
				<span style="padding-{$default_right}: 15px;"><a href="{$item.link}" {if $item.selected eq '1'} class="text_head"{/if}>{$item.name}</a></span>
			{/foreach}
			</div>
			{/if}
			</td>
		</tr>*}
	<tr class="table_header">
		<td colspan="4">	
			&nbsp;&nbsp;
			{if $links}
			{foreach item=item from=$links.pages}
				&nbsp;<a onclick="PageList('games_search_div', '{$item.link}');" class="page_link" {if $item.selected} style=" font-weight: bold; text-decoration: none;" {/if}>{$item.name}</a>&nbsp;
			{/foreach}
			{/if}
			<div class="page_navigation">
			{if $links.previous}
				<a onclick="PageList('games_search_div', '{$links.previous}');">< {$lang.content.previous} {$per_page}</a>
			{/if}
			{if $links.next}
				<a onclick="PageList('games_search_div', '{$links.next}');">{$lang.content.next} {$per_page} ></a>
			{/if}
			</div>	
		</td>
	</tr>
	</table>
	</div>
</div>
<script language="JavaScript" type="text/javascript">
{literal}
function Close(){
    $('#mask').fadeOut(500);
    $('#close').fadeOut(500)
    $('#dialog').fadeOut(500)	
}
		function showToolTip(e,text){
			if(document.all)e = event;
			var obj = document.getElementById('tooltip');
			obj.innerHTML = text;
			obj.style.display = 'block';
			var st = Math.max(document.body.scrollTop,document.documentElement.scrollTop);
			if(navigator.userAgent.toLowerCase().indexOf('safari')>=0)st=0;
			var leftPos = e.clientX - $('#tooltip').width()-10;
			if(leftPos<0)leftPos = 0;
			obj.style.left = leftPos + 'px';
			obj.style.top = e.clientY - obj.offsetHeight -10 + st + 'px';
		}
		function hideToolTip(){
			document.getElementById('tooltip').style.display = 'none';
		}
$(document).ready(function() {	
	//if close button is clicked
	$('.window .close').live("click",function (e) {
		//Cancel the link behavior
		//e.preventDefault();
		$('#mask, .window').hide();
	});		
	
	//if mask is clicked
	$('#mask').click(function () {
		$(this).hide();
		$('.window').hide();
	});			
	
});
//select all the a tag with name equal to modal
function PopUp(par,id) {
	if (par == 'view_items')
	$.post("{/literal}{$file_name}{literal}?rand="+Math.random(),{sel:par,id:id},
		function(data){
			$("#dialog").css("height","400px"),
			$("#dialog").css("width","500px"),
			$("#dialog").html(data),
			ShowPopup()
		}
	);
	if (par == 'delete_game')	 {
		str_html = "<div align=\"right\"><a href=\"#\"class=\"close\" ><img border=\"0\" src=\"{/literal}{$site_root}{$admin_theme_path}{literal}/images/window-close.png\"></a></div>";
		str_html = str_html+"<div id=\"answ\" style=\"padding:20px;\">";
		str_html = str_html+"<div align=\"left\">{/literal}{$lang.admin_games.games_delete}{literal}</div>";
		str_html = str_html+"<div style=\"padding-top:40px;\"><div align=\"center\" style=\"width:100%;\"><a class=\"admin_button_major\" href=\"{/literal}{$file_name}{literal}?sel=delete_game&id_category={/literal}{$id_category}{literal}&id_games="+id+"&page={/literal}{$page}{literal}\">{/literal}{$lang.admin_games.games_delete_yes}{literal}<span>&nbsp;</span></a></div>";
		str_html = str_html+"<div align=\"left\" style=\"padding-left:50px;\"><a href=\"#\"class=\"close\">{/literal}{$lang.admin_games.games_delete_no}{literal}</a></div>";
		str_html = str_html+"</div></div>";
	
		$("#dialog").html(str_html);
		$("#dialog").css("height","230px"),
		$("#dialog").css("width","410px"),
		$("#dialog").css("padding","20px"),
		ShowPopup();
	}
}
function ShowPopup() {
	//e.preventDefault();
	//Get the A tag
	var id = '#dialog';
	
	//Get the screen height and width
	var maskHeight = $(document).height();
	var maskWidth = $(window).width();
	
	//Set heigth and width to mask to fill up the whole screen
	$('#mask').css({'width':maskWidth,'height':maskHeight});
		
	//transition effect		
	$('#mask').fadeIn(500);	
	$('#mask').fadeTo("fast",0.8);	
	
	//Get the window height and width
	var winH = $(window).height();
	var winW = $(window).width();
              
	//Set the popup window to center
	$(id).css('top',  winH/2-$(id).height()/2);
	$(id).css('left', winW/2-$(id).width()/2);
        $('#close').css('top',  winH/2-$('#dialog').height()/2+11);
		$('#close').css('left', winW/2+$('#dialog').width()/2+5);
	
	//transition effect
	$(id).fadeIn(500); 
	$('#close').fadeIn(500); 	
}
{/literal}
</script>
{include file="$admingentemplates/admin_bottom.tpl"}