File: /home/durgeshpandey215/public_html/ipsol.skilladders.com/all-courses.php
<?php
require_once 'controller/security_headers.php';
require_once 'controller/DB_Config.php';
$con = OpenCon();
// --- Configuration ---
$limit = 9;
$page = isset($_GET['page']) && is_numeric($_GET['page']) ? (int)$_GET['page'] : 1;
if ($page < 1) $page = 1;
$offset = ($page - 1) * $limit;
// Filters
$cat_filter = isset($_GET['cat']) && is_numeric($_GET['cat']) ? (int)$_GET['cat'] : null;
$mode_filter = isset($_GET['mode']) ? $_GET['mode'] : null;
$search = isset($_GET['search']) ? trim($_GET['search']) : '';
// 1. Fetch Categories for Sidebar
$cat_where_parts = ["delete_status = 'N'"];
if ($mode_filter) {
$safe_mode_cat = mysqli_real_escape_string($con, $mode_filter);
$cat_where_parts[] = "training_type LIKE '%$safe_mode_cat%'";
}
if ($search) {
$safe_search_cat = mysqli_real_escape_string($con, $search);
$cat_where_parts[] = "(name LIKE '%$safe_search_cat%' OR course_summery LIKE '%$safe_search_cat%' OR title LIKE '%$safe_search_cat%')";
}
$cat_where_sql = implode(' AND ', $cat_where_parts);
$cat_sql = "
SELECT c.id, c.name,
(SELECT COUNT(*) FROM courses WHERE parent_course_id = c.id AND $cat_where_sql) as course_count
FROM courses c
WHERE c.parent_course_id IS NULL AND c.delete_status = 'N'
ORDER BY c.sort_order ASC";
$cat_result = mysqli_query($con, $cat_sql);
$categories = [];
$total_all_courses = 0;
while ($row = mysqli_fetch_assoc($cat_result)) {
$categories[] = $row;
$total_all_courses += $row['course_count'];
}
// 2. Build Course Query
$where = ["delete_status = 'N'", "parent_course_id IS NOT NULL"];
if ($cat_filter) {
$safe_cat = mysqli_real_escape_string($con, $cat_filter);
$where[] = "parent_course_id = $safe_cat";
}
if ($mode_filter) {
$safe_mode = mysqli_real_escape_string($con, $mode_filter);
$where[] = "training_type LIKE '%$safe_mode%'";
}
if ($search) {
$safe_search = mysqli_real_escape_string($con, $search);
$where[] = "(name LIKE '%$safe_search%' OR course_summery LIKE '%$safe_search%' OR title LIKE '%$safe_search%')";
}
$where_sql = implode(' AND ', $where);
// 3. Totals
$count_sql = "SELECT COUNT(*) as total FROM courses WHERE $where_sql";
$count_result = mysqli_query($con, $count_sql);
$total_records = mysqli_fetch_assoc($count_result)['total'];
$total_pages = ceil($total_records / $limit);
// 4. Fetch Courses
$courses_sql = "SELECT * FROM courses WHERE $where_sql ORDER BY id DESC LIMIT $offset, $limit";
$courses_result = mysqli_query($con, $courses_sql);
$courses = [];
while ($row = mysqli_fetch_assoc($courses_result)) {
$courses[] = $row;
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Browse Courses - IP Solutions</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
<script>
tailwind.config = {
theme: {
extend: {
colors: {
brand: {
blue: '#2957A4',
navy: '#00062F',
light: '#F5F5F5',
}
},
fontFamily: {
sans: ['"Plus Jakarta Sans"', 'sans-serif'],
}
}
}
}
</script>
<style>
body { font-family: 'Plus Jakarta Sans', sans-serif; background-color: #f8fafc; }
.sidebar-card {
background: white;
border-radius: 12px;
border: 1px solid #e2e8f0;
overflow: hidden;
margin-bottom: 20px;
}
.sidebar-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 16px 20px;
border-bottom: 1px solid #f1f5f9;
}
.sidebar-title {
font-size: 11px;
font-weight: 800;
color: #94a3b8;
letter-spacing: 0.05em;
text-transform: uppercase;
}
.reset-link {
font-size: 11px;
font-weight: 700;
color: #ef4444;
cursor: pointer;
text-decoration: none;
}
.menu-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 20px;
color: #64748b;
font-size: 13px;
font-weight: 600;
transition: all 0.2s;
border-left: 3px solid transparent;
text-decoration: none;
}
.menu-item:hover {
background-color: #f8fafc;
color: #2957A4;
}
.menu-item.active {
background-color: #eff6ff;
color: #2957A4;
border-left-color: #2957A4;
}
.count-badge {
background-color: white;
border: 1px solid #cbd5e1;
color: #94a3b8;
font-size: 10px;
font-weight: 700;
padding: 2px 6px;
border-radius: 4px;
min-width: 24px;
text-align: center;
}
.menu-item.active .count-badge {
border-color: #bfdbfe;
color: #2957A4;
}
</style>
</head>
<body class="text-slate-800 antialiased min-h-screen flex flex-col bg-slate-50">
<?php include 'header_v2.php'; ?>
<div class="max-w-[1400px] mx-auto px-4 md:px-8 py-8 lg:py-10">
<!-- Header & Search -->
<div class="flex flex-col md:flex-row md:items-end justify-between gap-6 mb-8">
<div>
<h1 class="text-3xl font-black text-slate-800 tracking-tight">
<?php
if ($search) echo "Search Results";
elseif ($cat_filter) {
foreach($categories as $c) {
if($c['id'] == $cat_filter) { echo $c['name']; break; }
}
}
else echo "Course Library";
?>
</h1>
<p class="text-slate-500 font-medium text-sm mt-1">
<?php if($search): ?>
Showing results for <span class="text-brand-blue font-bold">"<?php echo htmlspecialchars($search); ?>"</span>
<?php else: ?>
Browse our professional certification programs
<?php endif; ?>
</p>
</div>
<div class="w-full md:w-80">
<form action="all-courses.php" method="GET" class="relative">
<?php if($cat_filter): ?><input type="hidden" name="cat" value="<?php echo $cat_filter; ?>"><?php endif; ?>
<?php if($mode_filter): ?><input type="hidden" name="mode" value="<?php echo $mode_filter; ?>"><?php endif; ?>
<input type="text" name="search" value="<?php echo htmlspecialchars($search); ?>"
class="w-full pl-10 pr-10 py-3 bg-white border border-slate-200 rounded-xl text-sm font-bold focus:outline-none focus:border-brand-blue focus:ring-4 focus:ring-blue-500/10 transition shadow-sm placeholder:font-normal"
placeholder="Search courses...">
<i class="fa fa-search absolute left-3.5 top-3.5 text-slate-400"></i>
<?php if($search): ?>
<a href="all-courses.php<?php echo $cat_filter ? '?cat='.$cat_filter : ''; ?>" class="absolute right-3 top-3 text-slate-400 hover:text-red-500 p-0.5">
<i class="fa fa-times-circle"></i>
</a>
<?php endif; ?>
</form>
</div>
</div>
<div class="flex flex-col lg:flex-row gap-8 items-start">
<!-- SIDEBAR -->
<aside class="hidden lg:block w-64 shrink-0 sticky top-24">
<!-- Category Widget -->
<div class="sidebar-card">
<div class="sidebar-header">
<span class="sidebar-title">Categories</span>
<?php if($cat_filter || $search || $mode_filter): ?>
<a href="all-courses.php" class="reset-link">Reset</a>
<?php endif; ?>
</div>
<div class="py-2">
<!-- 'All Courses' is active only if no category is selected -->
<?php
$all_params = [];
if($search) $all_params['search'] = $search;
if($mode_filter) $all_params['mode'] = $mode_filter;
$all_link = "all-courses.php" . ($all_params ? '?' . http_build_query($all_params) : '');
?>
<a href="<?php echo $all_link; ?>"
class="menu-item <?php echo (!$cat_filter) ? 'active' : ''; ?>">
<span>All Courses</span>
<span class="count-badge"><?php echo $total_all_courses; ?></span>
</a>
<?php foreach ($categories as $cat): ?>
<a href="?cat=<?php echo $cat['id']; ?><?php echo $search ? '&search='.$search : ''; ?><?php echo $mode_filter ? '&mode='.$mode_filter : ''; ?>"
class="menu-item <?php echo $cat_filter == $cat['id'] ? 'active' : ''; ?>">
<span class="truncate pr-2"><?php echo $cat['name']; ?></span>
<?php if($cat['course_count'] > 0): ?>
<span class="count-badge"><?php echo $cat['course_count']; ?></span>
<?php endif; ?>
</a>
<?php endforeach; ?>
</div>
</div>
<!-- Mode Widget -->
<div class="sidebar-card">
<div class="sidebar-header border-none pb-0">
<span class="sidebar-title">Training Mode</span>
</div>
<div class="p-4 space-y-3">
<!-- Helper to toggle modes -->
<?php
function getModeLink($current_mode, $target) {
// If already selected, we could unselect, but for now specific requirement just simple filtering
// Let's just switch to that mode or clear if same?
// User request implies checkboxes, let's just make them simple links
global $cat_filter, $search;
$base = "?";
if($cat_filter) $base .= "cat=$cat_filter&";
if($search) $base .= "search=$search&";
if ($current_mode === $target) return $base; // Toggle off (remove mode)
return $base . "mode=" . $target;
}
?>
<a href="<?php echo getModeLink($mode_filter, 'Online'); ?>" class="flex items-center gap-3 group">
<div class="w-4 h-4 rounded border <?php echo $mode_filter==='Online' ? 'bg-brand-blue border-brand-blue' : 'bg-white border-slate-300'; ?> flex items-center justify-center transition-colors">
<?php if($mode_filter==='Online'): ?><i class="fa fa-check text-white text-[10px]"></i><?php endif; ?>
</div>
<span class="text-sm font-semibold text-slate-600 group-hover:text-brand-blue">Online Training</span>
</a>
<a href="<?php echo getModeLink($mode_filter, 'Classroom'); ?>" class="flex items-center gap-3 group">
<div class="w-4 h-4 rounded border <?php echo $mode_filter==='Classroom' ? 'bg-brand-blue border-brand-blue' : 'bg-white border-slate-300'; ?> flex items-center justify-center transition-colors">
<?php if($mode_filter==='Classroom'): ?><i class="fa fa-check text-white text-[10px]"></i><?php endif; ?>
</div>
<span class="text-sm font-semibold text-slate-600 group-hover:text-brand-blue">Classroom Training</span>
</a>
<a href="<?php echo getModeLink($mode_filter, 'Corporate'); ?>" class="flex items-center gap-3 group">
<div class="w-4 h-4 rounded border <?php echo $mode_filter==='Corporate' ? 'bg-brand-blue border-brand-blue' : 'bg-white border-slate-300'; ?> flex items-center justify-center transition-colors">
<?php if($mode_filter==='Corporate'): ?><i class="fa fa-check text-white text-[10px]"></i><?php endif; ?>
</div>
<span class="text-sm font-semibold text-slate-600 group-hover:text-brand-blue">Corporate Training</span>
</a>
</div>
</div>
</aside>
<!-- RESULTS -->
<main class="flex-1 min-w-0">
<?php if (count($courses) > 0): ?>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-6 mb-10">
<?php foreach ($courses as $course): ?>
<a href="course/<?php echo $course['page_url']; ?>.php" class="flex flex-col bg-white rounded-xl border border-slate-200 hover:border-brand-blue/40 hover:shadow-lg hover:-translate-y-1 transition-all duration-300 group overflow-hidden h-full">
<div class="relative h-44 bg-slate-100 overflow-hidden border-b border-slate-50">
<?php if ($course['img_file']): ?>
<img src="img/course_img/<?php echo $course['img_file']; ?>" class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-105">
<?php else: ?>
<div class="w-full h-full flex items-center justify-center bg-slate-50">
<i class="fa fa-graduation-cap text-slate-300 text-4xl"></i>
</div>
<?php endif; ?>
<?php if ($course['course_logo']): ?>
<div class="absolute -bottom-4 right-4 w-12 h-12 bg-white p-1.5 rounded-lg shadow-sm border border-slate-100 flex items-center justify-center z-10">
<img src="img/course_logo/<?php echo $course['course_logo']; ?>" class="max-w-full max-h-full object-contain">
</div>
<?php endif; ?>
</div>
<div class="p-5 pt-7 flex-1 flex flex-col">
<h3 class="text-base font-bold text-slate-900 leading-snug mb-2 group-hover:text-brand-blue transition-colors line-clamp-2">
<?php echo $course['name']; ?>
</h3>
<p class="text-slate-500 text-xs leading-relaxed line-clamp-3 mb-4 break-words">
<?php
$summ = strip_tags($course['course_summery']);
echo $summ ? $summ : 'Detailed training curriculum available.';
?>
</p>
<div class="flex items-center justify-between pt-4 border-t border-slate-50 mt-auto">
<?php if($course['duration']): ?>
<div class="flex items-center gap-1.5 text-xs font-semibold text-slate-500 bg-slate-50 px-2 py-1 rounded">
<i class="fa fa-clock-o text-brand-blue"></i> <?php echo $course['duration']; ?>
</div>
<?php else: ?>
<span class="text-xs text-slate-400 font-semibold">Self-Paced</span>
<?php endif; ?>
<span class="text-xs font-bold text-brand-blue group-hover:underline">View Details</span>
</div>
</div>
</a>
<?php endforeach; ?>
</div>
<!-- Pagination -->
<?php if ($total_pages > 1): ?>
<div class="flex justify-center pt-6 border-t border-slate-200">
<nav class="flex gap-2">
<!-- Prev -->
<a href="<?php echo $page > 1 ? '?page='.($page-1).($cat_filter?'&cat='.$cat_filter:'').($mode_filter?'&mode='.$mode_filter:'').($search?'&search='.$search:'') : '#'; ?>"
class="h-10 px-4 flex items-center justify-center border rounded-lg text-sm font-bold transition <?php echo $page > 1 ? 'bg-white border-slate-200 text-slate-600 hover:border-brand-blue hover:text-brand-blue' : 'bg-slate-50 border-slate-100 text-slate-300 pointer-events-none'; ?>">
Previous
</a>
<!-- Pages -->
<?php
$start = max(1, $page - 1);
$end = min($total_pages, $page + 1);
if($start > 1) echo '<span class="flex items-center px-2 text-slate-400">...</span>';
for($i=$start; $i<=$end; $i++):
?>
<a href="?page=<?php echo $i; ?><?php echo $cat_filter?'&cat='.$cat_filter:''; ?><?php echo $mode_filter?'&mode='.$mode_filter:''; ?><?php echo $search?'&search='.$search:''; ?>"
class="w-10 h-10 flex items-center justify-center border rounded-lg text-sm font-bold transition
<?php echo $i==$page ? 'bg-brand-blue border-brand-blue text-white shadow-sm' : 'bg-white border-slate-200 text-slate-600 hover:border-brand-blue hover:text-brand-blue'; ?>">
<?php echo $i; ?>
</a>
<?php endfor; ?>
<?php if($end < $total_pages) echo '<span class="flex items-center px-2 text-slate-400">...</span>'; ?>
<!-- Next -->
<a href="<?php echo $page < $total_pages ? '?page='.($page+1).($cat_filter?'&cat='.$cat_filter:'').($mode_filter?'&mode='.$mode_filter:'').($search?'&search='.$search:'') : '#'; ?>"
class="h-10 px-4 flex items-center justify-center border rounded-lg text-sm font-bold transition <?php echo $page < $total_pages ? 'bg-white border-slate-200 text-slate-600 hover:border-brand-blue hover:text-brand-blue' : 'bg-slate-50 border-slate-100 text-slate-300 pointer-events-none'; ?>">
Next
</a>
</nav>
</div>
<?php endif; ?>
<?php else: ?>
<!-- Empty State -->
<div class="bg-white rounded-xl border border-slate-200 p-12 text-center shadow-sm">
<div class="w-16 h-16 bg-slate-50 rounded-full flex items-center justify-center mx-auto mb-4 text-slate-400 border border-slate-100">
<i class="fa fa-folder-open text-2xl"></i>
</div>
<h3 class="text-lg font-bold text-slate-900 mb-1">No matches found</h3>
<p class="text-slate-500 text-sm mb-6">We couldn't find any courses for <span class="font-bold">"<?php echo htmlspecialchars($search); ?>"</span>.</p>
<a href="all-courses.php" class="inline-flex items-center gap-2 px-6 py-2.5 bg-brand-blue text-white rounded-lg text-sm font-bold hover:bg-blue-700 transition shadow-sm">
<i class="fa fa-refresh"></i> Clear Search
</a>
</div>
<?php endif; ?>
</main>
</div>
</div>
<?php include 'footer_v2.php'; ?>
</body>
</html>