<?php include "assets/header.php";
if(isset($_REQUEST['list'])){
	$i=1;
	$id = array();
	$link = array();
	$head = array();
	$detail = array();
	$s="select * from yt_list where yt_link = '".$_REQUEST['list']."' order by yt_id desc";
	$q=mysql_query($s);
	$a=mysql_affected_rows();
	if($a==1){
		$f=mysql_fetch_array($q);
		$id[$i]=$f['yt_id'];
		$list[$i]=$f['yt_link'];
		$head[$i]=$f['yt_head'];
		$detail[$i]=$f['yt_detail'];
		$i=2;
		$s="select * from yt_list where yt_link <> '".$_REQUEST['list']."' order by yt_id desc";
		$q=mysql_query($s);
		$a=mysql_affected_rows();
		while($f=mysql_fetch_array($q)){
			$id[$i]=$f['yt_id'];
			$list[$i]=$f['yt_link'];
			$head[$i]=$f['yt_head'];
			$detail[$i]=$f['yt_detail'];
			$i++;
		}
		$a=$a+1;
	}else{
		header("Location: vdo");
	}
}else{
	$i=1;
	$id = array();
	$link = array();
	$head = array();
	$detail = array();
	$s="select * from yt_list order by yt_id desc";
	$q=mysql_query($s);
	$a=mysql_affected_rows();
	while($f=mysql_fetch_array($q)){
		$id[$i]=$f['yt_id'];
		$list[$i]=$f['yt_link'];
		$head[$i]=$f['yt_head'];
		$detail[$i]=$f['yt_detail'];
		$i++;
	}
}
?>

<div class="container" id="vdo">
	<div id="carousel-main" class="carousel slide" data-ride="carousel" style="padding:0;margin-bottom:30px;">
	  <ol class="carousel-indicators">
		<li data-target="#carousel-main" data-slide-to="0" class="active"></li>
	  </ol>
	  <div class="carousel-inner" role="listbox">
	  	<div class="item active">
		  <img src="assets/img/banner/slide.gif" width="100%">
		  <div class="carousel-caption" style="color: #fff;">
			<p class="service-text-service" style="color: #fff;margin-bottom: 0;">YUKIFIX<span style="font-size: 30px;"><sup>®</sup></span> Video</p>
			<p style="color: #fff;margin-bottom: 0">Watch It Before You Make Any Decision</p>
			<p style="color: #fff;">All About Video Smartphone Glass Replacement </p>
		  </div>
		</div>
	  </div>
	  <a class="left carousel-control" href="#carousel-main" role="button" data-slide="prev">
		<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
		<span class="sr-only">Previous</span>
	  </a>
	  <a class="right carousel-control" href="#carousel-main" role="button" data-slide="next">
		<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
		<span class="sr-only">Next</span>
	  </a>
	</div>
	<div class="row" align="center" style="margin-bottom: 30px;">
		<p class="service-text-service" style="margin-bottom: 5px;">VDO การซ่อม</p>
		<p style="font-size: 16px;color: #999;margin-bottom: 0;">Watch Before You Make Any Desision</p>
		<p style="font-size: 16px;color: #999;">All About Video Smartphone Glass Replacement</p>
	</div>
	
	<div class="row">
		<div class="col-xs-12 col-sm-9">
			<div class="row" style="padding: 0">
				<div class="col-xs-12" style="padding: 0">
					<iframe class="hidden-mobile" width="100%" height="460" src="https://www.youtube.com/embed/<?=$list[1]?>" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
					<iframe class="hidden-large" width="100%" height="320" src="https://www.youtube.com/embed/<?=$list[1]?>" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
					<p style="font-size: 30px;font-weight: 500;color: fe7a15"><?=$head[1]?></p>
					<p><?=$detail[1]?></p>
				</div>
				<div class="col-xs-12" style="padding: 0">
					<iframe class="hidden-mobile" width="100%" height="460" src="https://www.youtube.com/embed/<?=$list[2]?>" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
					<iframe class="hidden-large" width="100%" height="320" src="https://www.youtube.com/embed/<?=$list[2]?>" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
					<p style="font-size: 30px;font-weight: 500;color: fe7a15"><?=$head[2]?></p>
					<p><?=$detail[2]?></p>
				</div>
			</div>
		</div>
		<div class="col-xs-12 col-sm-3" style="font-size: 18px;font-weight: 500;">
			<?php
			$j=3;
			for($j==3;$j<11;$j++){
				if(strlen($list[$j])>0){
			?><p style="border-bottom: solid 2px #fe7a15;padding-bottom: 10px;">
              <a href="vdo?list=<?=$list[$j]?>" style="color: #666;">
              	<i class="fab fa-youtube" style="color: red"></i> <?=$head[$j]?><BR><span style="font-size: 14px;font-weight: 200;color: #999;"><?=$detail[$j]?></span>
              </a>
              </p>
              <?php
				}
			}
			?>
		</div>
	</div>
	<div class="row" style="margin-top: 30px;">
		<div class="col-xs-12" align="center" style="border-bottom: solid 1px #eaeaea;padding-bottom: 20px;">
			<a role="button" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample"><i class="fas fa-chevron-down"></i> MORE VDO <i class="fas fa-chevron-down"></i></a>
		</div>
		<div class="col-xs-12" style="margin-top: 20px;">
			<div class="collapse" id="collapseExample">
		  <?php
			$j=12;
			for($j==12;$j<=$a;$j++){
				if(strlen($list[$j])>0){
			?>
          	<div class="row" style="background-color: #fff;box-shadow: 0 0 3px #eaeaea;padding: 10px;margin-bottom: 20px;">
            	<div class="col-xs-12 col-sm-6">
           			<iframe width="100%" height="300" src="https://www.youtube.com/embed/<?=$list[$j]?>" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
           		</div>
            	<div class="col-xs-12 col-sm-6" style="margin-bottom: 20px;">
            		<p style="padding-bottom: 10px;">
					  <a href="vdo?list=<?=$list[$j]?>" style="color: #666;display: inline;">
						<i class="fab fa-youtube" style="color: red"></i> <?=$head[$j]?><HR><span style="font-size: 14px;font-weight: 200;color: #999;"><?=$detail[$j]?></span>
					  </a>
              		</p>
            	</div>
             </div>
              <?php
				}
			}
			?>
			  
			</div>
		</div>
	</div>
</div>

<?php include("assets/footer.php");?>