<?
require_once("../dbconfig.php");
require_once("config.php");
require_once("../appheader.php");


$baseurl = "http://web.sportsystem.hk/fourtrailsmini2017/galleryb/";

//$path = "photos/53960f4d2fbb87e9c50c9df2ed628837/out/";
//$images = glob($path . '*.{jpg,jpeg,png,gif,JPG,JPEG,PNG,GIF}', GLOB_BRACE);
//d($images);
$photomax = 1500;


$timeranges = array(
    "1" => array ("value" => 1, "display_en" => 'Before 9:00', 'Before 9:00', "start" =>  "2017-09-16 06:00:00", "end" => "2017-09-16 08:59:59"),
    "2" => array ("value" => 2, "display_en" => '09:00-12:00', '09:00-12:00', "start" =>  "2017-09-16 09:00:00", "end" => "2017-09-16 11:59:59"),
    "3" => array ("value" => 3, "display_en" => '12:00-14:00', '12:00-14:00', "start" =>  "2017-09-16 12:00:00", "end" => "2017-09-16 13:59:59"),
);

//https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fweb.sportsystem.hk%2Fttnh2016%2Fgallery%2F%23%26gid%3D1%26pid%3D9


$bibno =  getpostval('bibno');

 
 if ($bibno  != "v" && $bibno  != "volunteer" &&  $bibno  != "EMPTY")
 {
 $bibno = str_pad($bibno, 4, "0", STR_PAD_LEFT);
 }
 
 
if ($bibno == "0000" || $bibno == ""  || $bibno == "undefined" )
{
	$bibno = "";
}

 
$location_select = $_REQUEST['locationbuttons'];
$timerange_select = $_REQUEST['timerangbuttons'];
$credit_select = $_REQUEST['creditbuttons'];
//d($location_select);


$sql = "select  count(*) as c from " .  $table_prefix . "gallery";
	$stmt = $db->prepare($sql);
	$stmt->execute();	
	$totalphotos = $stmt->fetch(PDO::FETCH_ASSOC);

$sql = "select  location, count(*) as c from " .  $table_prefix . "gallery group by location order by c desc";
	$stmt = $db->prepare($sql);
	$stmt->execute();	
	$locations = $stmt->fetchAll(PDO::FETCH_ASSOC);

$sql = "select  credit, count(*) as c from " .  $table_prefix . "gallery group by credit order by c desc";
	$stmt = $db->prepare($sql);
	$stmt->execute();	
	$credits = $stmt->fetchAll(PDO::FETCH_ASSOC);
	
	//d($credits);
	
if ($bibno || $location_select || $timerange_select || $credit_select )
{

	if ($bibno == "volunteer")
	{
		$bibno = "v";
	}


	if (strtolower($bibno)  != "EMPTY" && strtolower($bibno)  != "all" && strtolower($bibno)  != "v" && strtolower($bibno)  != "empty" && ctype_alpha(substr($bibno,0,1)))
	{
	$bibno  = substr($bibno,1);
	}

	
	$sql = 'select  distinct gallery.* from  ' .  $table_prefix . 'gallery gallery left join  ' .  $table_prefix . 'gallery_tag gallery_tag on gallery.id = gallery_tag.gallery_id where 1=1 ';

	if (intval($bibno) > 0 ) 
	{
		 $sql .= 'and CAST(gallery_tag.bibno AS UNSIGNED) = ' .  $bibno . ''  ;
	}
	
	if (strtolower($bibno)== "v") 
	{
		 $sql .= 'and gallery_tag.bibno = "v"'  ;
	}
	
	
	if ($bibno == "EMPTY") 
	{
		 $sql .= 'and (gallery_tag.bibno = "" or gallery_tag.bibno  is null)'  ;
	}

	
	$l = null;


	if ($location_select)
	{

		foreach ($location_select as $lx)
		{
			if (trim($lx) != "EMPTY" &&  trim($lx) != "")
			{
				$l[] = mysql_escape_mimic($lx);
			}
		}
		
		
		$sql .= " and  ( location in ('" . implode("','",$l) . "')";
		
		foreach ($location_select as $l)
		{
			if ($l == "EMPTY") $sql .= " or location is null";
		}
		
		 $sql .= ") ";
		
	}
	
	$l = array();
	
	if ($credit_select)
	{

		foreach ($credit_select as $lx)
		{
			if (trim($lx) != "EMPTY" &&  trim($lx) != "")
			{
				$l[] = mysql_escape_mimic($lx);
			}
		}
		
		
		$sql .= " and  ( credit in ('" . implode("','",$l) . "')";
		
		foreach ($credit_select as $l)
		{
			if ($l == "EMPTY") $sql .= " or credit is null";
		}
		
		 $sql .= ") ";
		
	}
	
	
	if ($timerange_select)
	{
	
	/*
		$sql .= "  and (taketime >= '" . $timeranges[$timerange_select]['start'] . "' and taketime <= '" . $timeranges[$timerange_select]['end'] ."')";
	*/
		//$sql .= " and  location in ('" . implode("','",$location_select) . "')";
		$sql .= " and ( 1=2 ";
		foreach ($timerange_select as $s)
		{
			if ( $timeranges[$s]['start'] )
			{
			$sql .= "  or (taketime >= '" . mysql_escape_mimic($timeranges[$s]['start']) . "' and taketime <= '" . mysql_escape_mimic($timeranges[$s]['end']) ."')";
			}
			
		}
		
		foreach ($timerange_select as $l)
		{
			if ($l == "EMPTY") $sql .= " or taketime =  '0000-00-00 00:00:00' or taketime =  '' or taketime is null";
		}
	
		$sql .= " ) ";
		
		
	}

	$sql .= " order by taketime limit " . $photomax ;
} else {
	
	if(intval($_GET['pid']))
	{
		$sql = ' select  * from ' .  $table_prefix . 'gallery  gallery order by case when id=' . intval($_GET['pid']) . '  then -1 else RAND() end asc limit 200';
	} else {
		$sql = 'select  * from ' .  $table_prefix . 'gallery ORDER BY rand() limit 200';
	}
}


//$sql = "select  * from gallery  limit 20";
//d($_GET);
//exit();
//echo $sql;


$stmt = $db->prepare($sql);
$stmt->execute();	
$images = $stmt->fetchAll(PDO::FETCH_ASSOC);


if(intval($_GET['pid']))
	{
			$sql = ' select  * from ' .  $table_prefix . 'gallery where  id=' . intval($_GET['pid']) ;
			$stmt = $db->prepare($sql);
			$stmt->execute();	
			$odimages = $stmt->fetch(PDO::FETCH_ASSOC);
	}

?>
<html>
<head>


		<? if(!$odimages['basename']) { 
		
			 if ($bibno &&	$images[0])
			 {
				//d($images[0]);
				$ogimage = $baseurl . 'photos/' . $images[0]['path'] . '/' . $images[0]['basename'];
				$ogimagewidth = $images[0]['width'];
				$ogimageheight = $images[0]['height'];
			 } else {
				$ogimage = $baseurl . 'photos/' .  '820f143e05-a6e23fac0a/100_2288.JPG';
				$ogimagewidth = 2048;
				$ogimageheight = 1052;
			 }
		
		 } else { 
			$ogimage = $baseurl . '/photos/' .  $odimages['path'] . '/' . $odimages['basename'];
			$ogimagewidth = $odimages['width'];
			$ogimageheight = $odimages['height'];
		}	
		
		?>
		 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>FOUR TRAILS MINI 迷你四徑 - 照片庫 Photo Gallery</title>
		
	
		<meta property="og:image" content="<?=$ogimage?>"/>
		<meta property="og:image:width" content="<?=$ogimagewidth?>"/>
		<meta property="og:image:height"  content="<?=$ogimageheight?>"/>
		

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

<link rel='stylesheet prefetch' href='dist/s.css'>
<link rel='stylesheet prefetch' href='dist/default-skin/default-skin.css'>


<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>

	
<link rel='stylesheet prefetch' href='index.css?dummy=1'>
<link href="owl-carousel/owl.carousel.css" rel="stylesheet">
<link href="owl-carousel/owl.theme.css" rel="stylesheet">


<!--
<?
//$hash = substr(strrchr('#', $_SERVER['REQUEST_URI']), 1);
//d($_SERVER);
//$hash = $_SERVER['REQUEST_URI'];
//echo  $hash;
?>
-->
<style>

.img-circle {
    border-radius: 50%;
}


.pswp__button--report, .pswp__button--report:before {
  <? if ($_SESSION['lang'] == "en") { ?>
  background: url('dist/report_butt_en.png') 0 0 no-repeat  !important;
  <? } else { ?>
  background: url('dist/report_butt_zh.png') 0 0 no-repeat  !important;
  <? } ?>
  background-size: 132px 44px;

  width: 132px;
  height: 44px;
}

.bootbox.modal {z-index: 9999 !important;}


</style>

</head>


 <body> 

<nav class="navbar navbar-default">
        <div class="container-fluid">
          <div class="navbar-header" >
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
              <span class="sr-only">Toggle navigation</span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
            </button>
            
			<a class="navbar-left " href="http://www.fourtrailsmini.com/" style="max-height:70px;" >
							<img src="http://www.fourtrailsmini.com/wp-content/uploads/2017/04/4TrailsMiniLogo-tran-800.png" alt="<?echo $gallerytitle;?>" id="logo"  style="max-height:70px;" >
			</a>
          </div>
          <div id="navbar" class="navbar-collapse collapse" >
            <ul class="nav navbar-nav">
			 
            </ul>
          
			
			<ul class="nav navbar-nav navbar-right">
               <li class="active"><a href="http://web.sportsystem.hk/fourtrailsmini2017/galleryb/">RACE 2-LANTAU TRAIL<br>賽事2-鳯凰徑</a></li>
              <li class=""><a href="http://web.sportsystem.hk/fourtrailsmini2017/galleryc/">RACE 3-WILSON TRAIL<br>賽事3-衛奕信徑</a></li>
				<li ><a href="http://web.sportsystem.hk/fourtrailsmini2017/galleryd/">RACE 4-MACLEHOSE TRAIL<br>賽事4-麥理浩徑</a></li>
            </ul>
			
			
          </div><!--/.nav-collapse -->
        </div><!--/.container-fluid -->
      </nav>
<div class="container-fluid" >
<?
if ($bibno || $location_select || $timerange_select || $credit_select )
{


} else {
?>
  <div class="row" >
	 <div class="col-lg-12" >
		<center>
	
		<div id="owl-demo" class="owl-carousel owl-theme" >
			
			<div class="item"><img src="photos/820f143e05-a6e23fac0a/100_2288.JPG" style="max-height:500px; max-width:100%;" ></div>
			<div class="item"><img src="photos/820f143e05-989a670de1/100_2174.JPG" style="max-height:500px; max-width:100%;" ></div>
			<div class="item"><img src="photos/820f143e05-989a670de1/100_2204.JPG" style="max-height:500px; max-width:100%;" ></div>
			
			
		</div>
		
		</center>
  	</div>
 </div>
 
 <?
}
?>
 <div class="row" style="padding:5px;text-align:center" >
	
	 
	<label ><?=i18n_text('Location');?>:</label>
	<? foreach ($locations  as $location)
	{

	if ($location['location'] == "")
	{
		$location['location'] = "EMPTY";
	}

	?>


	<button class="btn btn-default
	<? if (in_array($location['location'], $location_select)) echo "active"; ?>

	" name="locationbuttons" type="button" data-toggle="button" style="margin:2px;" value="<?=$location['location'];?>">
	  <?
	  if ($location['location'] != "EMPTY")
		{
		echo i18n_text($location['location']);
		} else {
		echo i18n_text("Photo without location ino");
		}
	  
	  
	  ?> <span class="label label-pill label-info"><?=$location['c'];?></span>
	</button>

	<?
	}
	?>  
		 

 </div>
 <div class="row" style="padding:5px;text-align:center" >
	<label ><?=i18n_text('Photographer');?>:</label>
	<? foreach ($credits  as $credit)
	{

	?>


	<button class="btn btn-default <? if (in_array($credit['credit'], $credit_select)) echo "active"; ?>" name="creditbuttons" type="button" data-toggle="button" style="margin:2px;" value="<?=$credit['credit'];?>">
	  <?
		echo $credit['credit'];
	  ?> <span class="label label-pill label-info"><?=$credit['c'];?></span>
	</button>

	<?
	}
	?>  


	</div> 
	
 
 <div class="row" style="padding:5px;text-align:center" >
	<label><?=i18n_text('Time');?>:</label>
	<?
	/*
	foreach ($timeranges as $timerange)
	{
		
		if ($timerange['value'] == $timerange_select) {$active = "active";} else {$active = "";}
		
		
		echo '<a href="index.html?timerangbuttons=' . $timerange['value']  . '" class="btn btn-default '.  $active .  '"  name="timerangbuttons" value="' .$timerange['value'] . '"  style="margin:2px;">' .  i18n_field($timerange,display) . '</a>';
	}
	echo '<a href="index.html" class="btn btn-default "  name="timerangbuttons" style="margin:2px;">CLEAR</a>';
	*/
	
	foreach ($timeranges as $timerange)
	{
		
		if (in_array($timerange['value'], $timerange_select)) {$active = "active";} else {$active = "";}
		
		
		echo '<button class="btn btn-default '.  $active .  '"  name="timerangbuttons" value="' .$timerange['value'] . '"  type="button" data-toggle="button" style="margin:2px;">' .  i18n_field($timerange,display) . '</button>';
	}
	
	
	?>
	</div> 
	
	<div class="row" style="padding:20px;text-align:center">
		<button  onclick="getselected();"     class="btn  btn-primary" type="button"  style=" padding-left:30px; padding-right:30px; width:200px; ">Go!</button>
		 <?
		if ($_SESSION['lang'] == "en")
			{
		  ?>
		  <a href="index.html?lang=zh-hant">中文</a>
		  <?
		  } else {
		  ?>
		  <a href="index.html?lang=en">English</a>
		  <?
		  } 
		  ?>
	</div>
 
<?
//echo "Photo display:" . sizeof($images);
?>
<div class="row">
<div class="my-gallery" itemscope itemtype="http://schema.org/ImageGallery">


<?

if (sizeof($images) > 0) {


  foreach ($images as $image_r)
{
 $image = '/fourtrailsmini2017/galleryb/photos/' . $image_r['path'] . "/" . $image_r['basename'];
 $imagethumb = '/fourtrailsmini2017/galleryb/photos/' .$image_r['path'] . "/thumb/" . $image_r['basename'];
// list($width, $height, $type, $attr) = getimagesize($image);

?> 
	
    <figure style=" padding-right: 0;  padding-left: 0;" class = "col-sm-2  col-xs-4 col-lg-1 col-md-1"  itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
      <a href="<? echo $image; ?>" itemprop="contentUrl"  pid="<?=$image_r['id'];?>" data-size="<?echo $image_r['width'];?>x<?echo $image_r['height'];?>">
          <!--
		  <img src="<? echo $image; ?>" itemprop="thumbnail" alt="Image description" />
		  <img itemprop="thumbnail" src="/image.php/<?echo basename($image);?>?width=100&height=100&cropratio=1:1&image=/utmt2016/gallery/<?echo $image;?>" alt="<?basename($image);?>" />
		  -->
		  <img class="lazy" itemprop="thumbnail" data-original="<?echo $imagethumb?>" alt="<?=basename($image);?>"  />
		  
<?// echo basename($image);?>
		  
      </a>
	  
		<figcaption itemprop="caption description">
		
		<?
		/*
			<a style="color:#555555" href="swaplogo.php?image=<?echo urlencode($image);?>" target="_blank">S</a>
			
			<a style="color:white" href="updatetag.php?image=<?echo urlencode($image);?>" target="_blank"
			onclick='PopupCenter("updatetag.php?image=<?echo urlencode($image);?>", "", 400, 400);return false;'
			
			>+ <?echo i18n_text("Tag more participants")?> </a>
			
			
			*/
		?>

			
		    <? // echo basename($image);?>
		 </figcaption>
		 
		
	 </figure>
<?
}
} else {

?>
<div class="row">
	  <div class="col-lg-12">
			<div class="alert alert-danger" role="alert" style="padding-left:30px"><?echo i18n_text("NO_PHOTO");?></div>
	 </div>
</div>	 
<?


}
?>	
                                          
   
</div>
    

</div>

<?
if ( sizeof($images) >= $photomax )

{
?>

<div class="row">
	  <div class="col-lg-12">
			<div class="alert alert-danger" role="alert" style="padding-left:30px"><?echo i18n_text("TOO_MUCH_PHOTO");?></div>
	 </div>
</div>	 
<?
}
?>

</div>
<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="pswp__bg"></div>
    <div class="pswp__scroll-wrap">
        <div class="pswp__container">
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
        </div>
        <div class="pswp__ui pswp__ui--hidden">
            <div class="pswp__top-bar">
                <div class="pswp__counter"></div>
                <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>
                <button class="pswp__button pswp__button--share" title="Share"></button>
                <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>
                <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>
				<!--<button class="pswp__button pswp__button--report" id="reportbutt" title="Report" ></button>-->
                <div class="pswp__preloader">
                    <div class="pswp__preloader__icn">
                      <div class="pswp__preloader__cut">
                        <div class="pswp__preloader__donut"></div>
                      </div>
                    </div>
                </div>
            </div>
            <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                <div class="pswp__share-tooltip"></div> 
            </div>
            <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)">
            </button>
            <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)">
            </button>
            <div class="pswp__caption">
                <div class="pswp__caption__center"></div>
            </div>
          </div>
        </div>
</div>


<script src='dist/photoswipe.js?dummy=1'></script>
<script src='dist/photoswipe-ui-default.js?dummy=1'></script>
<script src="owl-carousel/owl.carousel.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootbox.js/4.4.0/bootbox.min.js"></script>

<script src="js/jquery.lazyload.min.js?v=1.9.7"></script>
<script src="js/jquery.scrollstop.min.js"></script>


<script src="index.js?dummy=2'"></script>
  
  
<div id="fb-root"></div>

<script>


	$("img.lazy").lazyload({
         effect : "fadeIn",
         //event: "scrollstop"
     });

  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-859169-4', 'auto');
  ga('send', 'pageview');
  
  
  (function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5&appId=170786406270595";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
  
  
</body>    
</html>