<?php 
session_start();
include("includes/db.php");
include("functions/functions.php");
?>

<?php

if(isset($_GET['pro_id'])){
	$pro_id=$_GET['pro_id'];
	$get_product="select * from products where product_id='$pro_id'";
	$run_product=mysqli_query($con,$get_product);
	$row_product=mysqli_fetch_array($run_product);
	$p_cat_id=$row_product['p_cat_id'];
	$p_title=$row_product['product_title'];
	$p_price=$row_product['product_price'];
	$p_desc=$row_product['product_desc'];
	$p_img3=$row_product['product_img1'];
	$p_img2=$row_product['product_img2'];
	$p_img1=$row_product['product_img3'];

	$get_p_cat="select * from product_category where p_cat_id='$p_cat_id'";
	$run_p_cat=mysqli_query($con,$get_p_cat);
	$row_p_cat=mysqli_fetch_array($run_p_cat);
	$p_cat_id=$row_p_cat['p_cat_id'];
	$p_cat_title = $row_p_cat['p_cat_title'];
}

?>

<?php   include("includes/header.php"); ?>

	<div id="content">
		<div class="container"><!--container start -->
			<div class="col-md-12"><!--col-md-12 start -->
				<ul class="breadcrumb">
					<li><a href="index.php">Home</a></li>
					<li>Shop</li>
					<li><a href="shop.php?p_cat=<?php echo $p_cat_id; ?>"><?php echo $p_cat_title; ?></a></li>
					<li><?php echo $p_title; ?></li>
				</ul>
				
				
			</div><!--col-md-12 end -->
			<div class="col-md-3"><!--col-md-3 start -->
				<?php
				include("includes/sidebar.php");
				?>
			</div><!--col-md-3 end -->

			<div class="col-md-9">
				<div class="row" id="productmain">
				<div class="col-sm-6"><!-- col-md-6 slider start-->
					
<!--  Zooming Effect Div start-->

				<div class="exzoom hidden" id="exzoom">
    <div class="exzoom_img_box">
        <ul class='exzoom_img_ul'>
            <li><img src="admin/product_images/<?php echo $p_img3; ?>"/></li>
            <li><img src="admin/product_images/<?php echo $p_img2; ?>"/></li>
            <li><img src="admin/product_images/<?php echo $p_img1; ?>"/></li>
        </ul>
    </div>
    <div class="exzoom_nav"></div>
    <p class="exzoom_btn">
        <a href="javascript:void(0);" class="exzoom_prev_btn"> < </a>
        <a href="javascript:void(0);" class="exzoom_next_btn"> > </a>
    </p>
</div>

<!--  Zooming Effect Div End-->
				</div>					
				<!-- col-md-6 slider end-->

				<div class="col-md-6">
					<div class="box"><!-- box start -->
						<h1 class="text-center">
							<?php echo $p_title; ?>
								
							</h1>
							<?php
							addCart();
							?>
						<form action="details.php?add_cart=<?php echo $pro_id; ?>" method="post" class="form-horizontal">
						<!---	<div class="form-group">
								<label class="col-md-5 control-label">Quantity:</label>
								<div class="col-md-7">
									<select name="product_qty" class="form-control">
										<option>1</option>
										<option>2</option>
										<option>3</option>
										<option>4</option>
										<option>5</option>
									</select>
								</div><!--col-md-7 end --
							</div><!-- Form Group End --
							
							<p class="price">&#8377 <?php echo $p_price; ?></p>
							<p class="text-center buttons"> 
								<button class="btn btn-primary" type="submit">
									<i class="fa fa-shopping-cart"></i> Add to Cart
								</button>
								
								<button class="btn btn-primary" type="submit">
									<i class="fa fa-shopping-bag"></i><a href="cart.php"> Shopping Cart</a>
								</button>---------------->
								
							<!--	<button><i class="fa fa-shopping-bag"></i><a href="cart.php"></i>Shopping Cart</a></button>
							</p>--->
						</form>
						
						
						
					</div><!-- box end -->

					<!-- The Modal -->
<div id="myModal" class="modal">

  <!-- The Close Button -->
  <span class="close" onclick="document.getElementById('myModal').style.display='none'">X</span>

  <!-- Modal Content (The Image) -->
  <img class="modal-content" id="img01">

  <!-- Modal Caption (Image Text) -->
  <div id="caption"></div>
</div>
				</div>
			</div>

			<div class="box" id="details">
				<h4>Product Details</h4>
				<p><?php echo $p_desc; ?></p>
			</div>

			<div id="row same-height-row"><!--row same-height-row Start -->
				<div class="col-md-3 col-sm-6"><!--col-md-3 col-sm-6 Start -->
					<div class="box same-height-headline"><!--box same-height-row headline start -->
						<p>NEORISE VENTURES is OEM of Electronic Product and wide range of Normal,
						Smart Frameless LED TV. We have expertise with various Co-Branding LED TV across India.We work with the aim
						of providing our customers with the best quality products with the complete entertainment experience and value for money.</p>
					</div><!--box same-height-row headline end -->
				</div><!--col-md-3 col-sm-6 end -->

				<?php

	$get_product = "select * from products order by 1 LIMIT 0,3";
	$run_products = mysqli_query($con,$get_product);
	while($row_product=mysqli_fetch_array($run_products)){
		$pro_id=$row_product['product_id'];
		$pro_title=$row_product['product_title'];
		$pro_price=$row_product['product_price'];
		$pro_img1 = $row_product['product_img1'];

		echo "<div class='col-sm-3 col-sm-6 '>
				<div class='product'>
					<a href='details.php?pro_id=$pro_id'>
						<img src='admin/product_images/$pro_img1' class='img-responsive'>
					</a>
					<div class='text'>
						<h3><a href='details.php?pro_id=$pro_id'>$pro_title</a></h3>
						
					<!--	<p class='card-text d-inline'>Price : <span class='font-weight-bolder'>&#8377 $pro_price</span></p>-->
										</div>
				</div>
			</div>

		";
	}
				?>

			</div>

		</div><!--container end -->
	</div>

<!--footer start-->
<?php
include ("includes/footer.php");
?>
<!--footer end-->
<!--  Zooming Effect Div start-->
<script type="text/javascript">

    $('.container').imagesLoaded( function() {
  $("#exzoom").exzoom({
        autoPlay: false,
    });
  $("#exzoom").removeClass('hidden')
});

</script>
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-36251023-1']);
  _gaq.push(['_setDomainName', 'jqueryscript.net']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
<!--  Zooming Effect Div End-->  

<script>
// Get the modal
var modal = document.getElementById("myModal");
var i;

var img = document.getElementsByClassName("myImg");
var modalImg = document.getElementById("img01");

 for(i=0;i< img.length;i++)
   {    
    img[i].onclick = function(){

    modal.style.display = "block";
       modalImg.src = this.src;

 }
}

var span = document.getElementsByClassName("close")[0];


span.onclick = function() { 
   modal.style.display = "none";
}
</script>


<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</body>
</html>