<?php include_once('header.php'); 

if(!empty($_GET['course_id']))
$course_id = $_GET['course_id'];
elseif(!empty($_POST['course_id']))
$course_id = $_POST['course_id'];
else
$course_id = '';

$limit=9;
$latest_news=get_courses_display($course_id,'','',1,$limit);
?>

<!-- START SECTION TOP -->
	<section class="section-top">
		<div class="container">
			<div class="col-lg-10 offset-lg-1 text-center">
				<div class="section-top-title wow fadeInRight" data-wow-duration="2s" data-wow-delay="0.6s" data-wow-offset="0">
					<h1>Available Courses</h1>
					<ul>
						<li><a href="index.php">Home</a></li>
						<li> / Course</li>
					</ul>
				</div><!-- //.HERO-TEXT -->
			</div><!--- END COL -->
		</div><!--- END CONTAINER -->
	</section>	
	<!-- END SECTION TOP -->

	<!--START COURSE -->
	<div class="best-cpurse section-padding">
		<div class="container">			
			<div class="row">					
				<div class="col-lg-8">					
					<div class="row">
                    	<?php
					  for($i=0;$i<count($latest_news);$i++)
					  {
					  
						  $sela=executework("SELECT * FROM  lms_cart_list,lms_cart_course where lms_cart_course.cart_id=lms_cart_list.cart_id and lms_cart_list.purchage_course_id='".$latest_news[$i]['id']."' and lms_cart_course.user_type='Student'");
						$cnta=@mysqli_num_rows($sela);
						$rowa=@mysqli_fetch_array($sela); 
    			?>
                
                 <div class="col-lg-4 col-md-4 col-sm-6 mix sale wow fadeInDown" data-wow-duration="2s" data-wow-delay="0.<?php echo $i; ?>s" data-wow-offset="<?php echo $i; ?>">
							<div class="product-grid">
								<div class="product-image">
									
                                    <?php
									 if(!empty($latest_news[$i]['course_img'])){ ?>
                                        <img class="pic-1" src="../instructor/courses_upload/<?php echo $latest_news[$i]['course_img']; ?>" alt="">
                                        <img class="pic-2" src="../instructor/courses_upload/<?php echo $latest_news[$i]['course_img']; ?>" alt="">
                                    <?php } else{ ?>
                                         <img class="pic-1" src="assets/images/banner/course-bg-p2.png" alt="">
                                         <img class="pic-2" src="assets/images/banner/course-bg-p2.png" alt="">
                                    <?php } ?>
                                   
									<ul class="social">
										<li> 
                                            <a href="javascript:void(0);" class="popup-img" data-image="../instructor/courses_upload/<?php echo $latest_news[$i]['course_img']; ?>"><i class="ti-zoom-in"></i></a>
                                        </li>
										<li><a href="" data-tip="Add to Wishlist"><i class="ti-bag"></i></a></li>
										<li><a href="view_course.php?course_id=<?php echo $latest_news[$i]['id']; ?>" data-tip="Add to Cart"><i class="ti-shopping-cart"></i></a></li>
									</ul>
									<span class="product-new-label"><?php $result = str_replace("_", " ", $latest_news[$i]['course_type']); echo mb_strtoupper($result); ?></span>
								</div>
								<ul class="rating">
									<li class="fa fa-star"></li>
									<li class="fa fa-star"></li>
									<li class="fa fa-star"></li>
									<li class="fa fa-star"></li>
									<li class="fa fa-star"></li>
								</ul>
								<div class="product-content">
									<h3 class="title"><a href="view_course.php?course_id=<?php echo $latest_news[$i]['id']; ?>">
									<?php 
                                        $text = $latest_news[$i]['course_title'];
										$text = trim($text);
										
										if (mb_strlen($text) > 26) {
											echo mb_substr($text, 0, 26) . '...';
										} else {
											echo $text;
										}
                                    ?></a></h3>
									<div class="price">$<?php echo $latest_news[$i]['course_price']/100*$latest_news[$i]['course_discount']; ?>
										<span>$<?php echo $latest_news[$i]['course_price']; ?></span>
									</div>
									<a class="add-to-cart" href="">+ Add To Cart</a>
								</div>
							</div>
						</div><!-- End Col -->	
                
               <?php } 
			    if(count($latest_news)==0)
				{
			   ?> 
              		 <div> <center> <strong style="color:red"> No Data Found </strong> </center> </div>
               <?php }  ?>				
					</div><!--END ROW -->				
				</div><!--END COL -->
				<div class="col-lg-4">	
					<div class="sidebar-post">
						<div class="blog_search">
							<input type="text" class="form-control" placeholder="Type & Press Enter">
						</div>				
					</div><!-- END SINGLE POST -->
					<div class="rs-slider">
						<h4>Price Filter</h4>
						<div class="range-slider">
							<input type="range" value="500" min="0" max="500" range="true">
							<span class="range-value">500</span>
						</div>				
					</div><!-- END SINGLE POST -->
					<div class="sidebar-post">
						<div class="sidebar_title"><h4>Follow us</h4></div>
						<div class="single_social">
							<ul>
								<li><div class="social_item b_facebook"><a href="#" title="facebook"><i class="fa fa-facebook"></i><span class="item-list">150K Likes</span></a></div></li>
								
								<li><div class="social_item b_twitter"><a href="#" title="twitter"><i class="fa fa-twitter"></i><span class="item-list">138K Followers</span></a></div></li>
								
								<li><div class="social_item b_youtube"><a href="#" title="youtube"><i class="fa fa-youtube"></i><span class="item-list">90K Subscribers</span></a></div></li>
								
								<li><div class="social_item b_pinterest"><a href="#" title="pinterest"><i class="fa fa-pinterest"></i><span class="item-list">350K Followers</span></a></div></li>
								
								<li><div class="social_item b_tumblr"><a href="#" title="rss"><i class="fa fa-tumblr"></i><span class="item-list">901 Followers</span></a></div></li>
								
								<li><div class="social_item b_rss"><a href="#" title="rss"><i class="fa fa-rss"></i><span class="item-list">411 Followers</span></a></div></li>
							</ul>
						</div><!-- END SOCIAL MEDIA POST -->
					</div><!-- END SIDEBAR POST -->							
					<div class="sidebar-post">
						<div class="sidebar_title"><h4>CATEGORIES</h4></div>
						<div class="single_category">
							<ul>
                            <?php 
								$cat=get_course_master('');
								 for($i=0;$i<count($cat);$i++)
					  			 {
							?>
								<li> <a href="#" style="text-decoration:none"> <i class="fa fa-arrow-right text-danger"></i> &nbsp;<?php echo $cat[$i]['title']; ?></a></li>
                             <?php } ?>
							</ul>
						</div><!-- END SOCIAL MEDIA POST -->
					</div><!-- END SIDEBAR POST -->						
								
					<div class="sidebar-post">
						<div class="sidebar_title"><h4>Skill Level</h4></div>
						<div class="single_langu">
							<i class="fa fa-arrow-right text-danger"></i>
							<span>All Levels</a></span>
						</div><!-- END SINGLE LANGU -->
						<div class="single_langu">
							<i class="fa fa-arrow-right text-danger"></i>
							<span>Beginner Levels</span>
						</div><!-- END SINGLE LANGU -->
						<div class="single_langu">
							<i class="fa fa-arrow-right text-danger"></i>
							<span>Intermediate Level</span>
						</div><!-- END SINGLE LANGU -->
						<div class="single_langu">
							<i class="fa fa-arrow-right text-danger"></i>
							<span>Expert Level</span>
						</div><!-- END SINGLE LANGU -->
					</div><!-- END SIDEBAR POST -->				
									
				</div><!--END COL -->				
			</div><!--END ROW -->		
		</div><!--END CONTAINER -->
	</div>
	<!--END COURSE -->	
    
    <div class="modal fade" id="imageModal" tabindex="-1">
  <div class="modal-dialog modal-dialog-centered modal-lg">
    <div class="modal-content bg-transparent border-0">
      <div class="modal-body text-center">
        <img id="modalImage" class="img-fluid rounded">
      </div>
    </div>
  </div>
</div>
    
<script>
document.querySelectorAll('.popup-img').forEach(btn => {
  btn.addEventListener('click', function(e) {
    e.preventDefault(); // stop link reload

    let imagePath = this.getAttribute('data-image'); // ✅ get correct image

    document.getElementById('modalImage').src = imagePath;

    var myModal = new bootstrap.Modal(document.getElementById('imageModal'));
    myModal.show();
  });
});
</script>

<?php include_once('footer.php'); ?>
