<script src="./js/diagram.js"></script>

		<div class="container">
			<div class="row">
				<div class="col-lg-4">
						<div class="bs-component">
							<div id="tabs" class="list-group" style="cursor: default;">
								<a onclick="mload('stat'); treload('stat');" id="stat" class="list-group-item">
									<?=$GLOBALS['lang']['m4'];?>
								</a>
								<a onclick="mload('setting'); treload('setting');" id="setting" class="list-group-item">
									<?=$GLOBALS['lang']['m2'];?>
								</a>
								<a onclick="mload('tasks'); treload('tasks');" id="tasks" class="list-group-item">
									<?=$GLOBALS['lang']['m5'];?>
								</a>
								<a onclick="mload('upload'); treload('upload');" id="upload" class="list-group-item">
									<?=$GLOBALS['lang']['m11'];?>
								</a>
							</div>
						</div>
					</div>

					<div id="ajax">
						<div class="col-lg-4">
							<form enctype="multipart/form-data" action="?shells" method="POST" />
							<div id="form" class="bs-component">
								<!-- hidden form  -->
							</div>
							</form>
						</div>

						<div class="col-lg-4">
							<div id="info" class="bs-component">
								<!-- hidden info  -->
							</div>
						</div>
					</div>


				<div class="col-lg-12">
					<div class="bs-component" id="table">

						
					<div id="cards" style="overflow-x: auto; width: 100%;">
						<table style="width: 160%; white-space: nowrap;" class="table table-striped table-bordered table-striped table-hover">
							<thead>
								<tr>
									<th width="5%;">id</th>
									<th width="5%"><?=$GLOBALS['lang']['tab16'];?></th>
									<th width="9%"><?=$GLOBALS['lang']['tab1'];?></th>
									<th width="14%"><?=$GLOBALS['lang']['tab2'];?></th>
									<th width="7%"><?=$GLOBALS['lang']['tab3'];?></th>
									<th width="5%"><?=$GLOBALS['lang']['tab4'];?></th>
									<th width="9%"><?=$GLOBALS['lang']['tab12'];?></th>
									<th width="9%"><?=$GLOBALS['lang']['tab13'];?></th>
									<th width="19%"><?=$GLOBALS['lang']['tab14'];?></th>
									<th width="5%"><?=$GLOBALS['lang']['tab5'];?></th>
									<th width="5%"><?=$GLOBALS['lang']['tab6'];?></th>
									<th width="5%"><?=$GLOBALS['lang']['tab7'];?></th>
									<th width="6%"><?=$GLOBALS['lang']['tab17'];?></th>
									<th width="5%"><?=$GLOBALS['lang']['tab8'];?></th>
									<th width="5%"><?=$GLOBALS['lang']['tab9'];?></th>
									<th width="5%"><?=$GLOBALS['lang']['tab10'];?></th>
									<th width="5%"><?=$GLOBALS['lang']['tab15'];?></th>
									<th width="10%"><?=$GLOBALS['lang']['tab11'];?></th>
								</tr>

							</thead>

							<tbody>
								<?=$th;?>
							</tbody>

						</table>
					</div>
						<center><ul class="pagination">
							<?=$pagination;?>
						</ul></center>
					</div>
				</div>
			</div>
		</div>

<script language="JavaScript">
var login="<?=$_COOKIE['login'];?>", session="<?=$_COOKIE['SESSION'];?>";
var preload='<img src="./img/preload.gif" />';

mload(findmenu());

$("#tabs").on("click",".list-group-item",function(){
	$("#tabs .list-group-item").removeClass("active");
	$(this).addClass("active");
});

function findmenu(){
	if($.cookie("sc_men")=="" || $.cookie("sc_men")==null){
		$('#stat').addClass("active");
		return "stat";
	}

	$("#tabs .list-group-item").removeClass("active");
	$('#'+$.cookie("sc_men")).addClass("active");

	return $.cookie("sc_men");
}

function treload(value){
	$.cookie("sc_men",value, { expires: 365 });
	/*$.post("./inc/ajax/cards/table.php",{
		login: login,
		SESSION: session,
		page: "<?=$_GET['page'];?>"
		}).done(function(data){
			$('#table').html(data);
		}
	);*/
}

function mload(value){
	var img='<div style="padding-top:27px;text-align:center;"><img src="./img/load.gif" /></div>';
	$('#form').html(img); $('#info').html(img);

	$.post("./inc/ajax/cards/"+value+".php",{
		login: login,
		SESSION: session
	}).done(function(data){
		$('#ajax').html(data);
	});
}

function deltr(id){
	$('#actions'+id).html(preload);

	$.post("./inc/ajax/cards/delete.php",{
		login: login,
		SESSION: session,
		id: id
	}).done(function(data){
		$('#id'+id).remove();
	});
}

function viewd(id,d){
	$('#'+d+id).html(preload);

	$.post("./inc/ajax/cards/"+d+".php",{
		login: login,
		SESSION: session,
		id: id
	}).done(function(data){
		$('#'+d+id).html(data);
	});
}

$(document).ready(function(){
	$("#cards").niceScroll({cursorcolor:"#679FD2"});
});

</script>