<!DOCTYPE html>
<html>
<head>
	<title>PhotoSwipe</title>
	<meta name="author" content="Ste Brennan - Code Computerlove - http://www.codecomputerlove.com/" />
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
	
	<link href="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.css" rel="stylesheet" />
	<link href="/public/js/photoswipe/examples/jquery-mobile.css" type="text/css" rel="stylesheet" />
	<link href="/public/js/photoswipe/photoswipe.css" type="text/css" rel="stylesheet" />
	
	<script type="text/javascript" src="/public/js/photoswipe/lib/klass.min.js"></script>
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
	<script type="text/javascript" src="http://code.jquery.com/mobile/1.0rc2/jquery.mobile-1.0rc2.min.js"></script>
	<script type="text/javascript" src="/public/js/photoswipe/code.photoswipe.jquery-3.0.4.min.js"></script>
	
	
	<script type="text/javascript">
		
		/*
		 * IMPORTANT!!!
		 * REMEMBER TO ADD  rel="external"  to your anchor tags. 
		 * If you don't this will mess with how jQuery Mobile works
		 */
		
		(function(window, $, PhotoSwipe){
			
			$(document).ready(function(){
				
				$('div.gallery-page')
					.live('pageshow', function(e){
						
						var 
							currentPage = $(e.target),
							options = {},
							photoSwipeInstance = $("ul.gallery a", e.target).photoSwipe(options,  currentPage.attr('id'));
							
						return true;
						
					})
					
					.live('pagehide', function(e){
						
						var 
							currentPage = $(e.target),
							photoSwipeInstance = PhotoSwipe.getInstance(currentPage.attr('id'));

						if (typeof photoSwipeInstance != "undefined" && photoSwipeInstance != null) {
							PhotoSwipe.detatch(photoSwipeInstance);
						}
						
						return true;
						
					});
				
			});
		
		}(window, window.jQuery, window.Code.PhotoSwipe));
		
	</script>
	
</head>
<body>

<div data-role="page" id="Home">

	<div data-role="header">
		<h1>ARCHLine.XP Gallery</h1>
	</div>
	
	
	<div data-role="content" >		
		
		<ul data-role="listview" data-inset="true">
			<li><a href="#Interior">Interior Gallery</a></li> 
			<li><a href="#Architect">Architect Gallery</a></li> 
		</ul>
		
	</div>

	<div data-role="footer">
		<h4>&copy; 2012 CadLine Kft.</h4>
	</div>

</div>


<div data-role="page" data-add-back-btn="true" id="Interior" class="gallery-page">

	<div data-role="header">
		<h1>Interior design gallery</h1>
	</div>

	<div data-role="content">	
		
		<ul class="gallery">
		<?foreach($kepek as $kep):?>
		<?if( !is_dir($utvonal.$kep) ):?>
			<li><a href="/<?=$utvonal?><?=$kep?>" rel="external"><img src="/<?=$utvonal?>thumbs/<?=$kep?>" alt="<?=str_replace("_"," ",current(explode('.',$kep)))?>" /></a></li>
		<?endif;?>
		<?endforeach;?>
		</ul>
		
	</div>
	
	<div data-role="footer">
		<h4>&copy; <?=lang('m_cegnev')?></h4>
	</div>
	
</div>

<div data-role="page" data-add-back-btn="true" id="Architect" class="gallery-page">

	<div data-role="header">
		<h1>Architect Gallery</h1>
	</div>

	<div data-role="content">	
		
		<ul class="gallery">
		
			<li><a href="images/full/010.jpg" rel="external"><img src="images/thumb/010.jpg" alt="Image 010" /></a></li>
		
		</ul>
		
	</div>

	<div data-role="footer">
		<h4>&copy; 2013 CadLine Kft.</h4>
	</div>

</div>

</body>
</html>
