<!-- sidebar.php -->
<?php ob_start();?>
<style>
.sideNav{
  background: #1B263B;
  transition: transform 0.3s ease-in-out;
}
.the-logo{
  background: #E67817;
  margin-top:-11px;
}
.nav-links a{
	color: #fff;
}
@media(max-width: 992px){
  .the-logo img{
    width: 30px;
    height: 30px;
    margin-left: -22px!important;
  }
  .sideNav a{
    font-size: 15px;
  }
  .the-logo span{
    font-size: 15px;
  }
}
</style>
<?php
if (isset($_SESSION['username'])) {
	$username = $_SESSION['username']; // username = email
	$staffRole = $_SESSION['role'];

	// Get staff Id
	$getstf = "SELECT * FROM staff WHERE email = ? ";
	$stmt = $pdo->prepare($getstf);
	$stmt->execute([$username]);
	$row = $stmt->fetch(PDO::FETCH_ASSOC);

	$staffId = $row['staffId'];

	$title = $row['title'];
	$names 	= $row['fullname'];
	$email = $row['email'];
	$mobile = $row['phone_number'];
	$password = $row['password'];
	$roles 	= $row['roles'];
}else{
	header('Location:../login.php');
}

// Get the current academic session
$session_status = 'active';
$acaSession = "SELECT session_year FROM sessions WHERE status = ? ";
$sespdo = $pdo->prepare($acaSession);
$sespdo->execute([$session_status]);
$sessionRow = $sespdo->fetch(PDO::FETCH_ASSOC);
$current_session = $sessionRow['session_year'];

// Get the current term
$term_status = 'active';
$get_term = "SELECT term_title FROM terms WHERE status = ?";
$termpdo = $pdo->prepare($get_term);
$termpdo->execute([$term_status]);
$termRow = $termpdo->fetch(PDO::FETCH_ASSOC);
$current_term = $termRow['term_title'];

?>
<div class="sideNav" id="dropdown">
	<div class="the-links" style="margin-top: ;">
		<div class="the-logo" onclick="ShowNav()">
			<img src="logo/goodness.jpg">
			<span>Select Menu <i class=" fa fa-arrow-down"></i></span>
		</div>
		<div class="nav-links" id="dropLink">

			<a href="index.php" >
				<div class="side-inner">
					<i class="fa fa-rss"></i> Dashboard
				</div>
			</a>

			<a href="my-subjects.php">
				<div class="side-inner">
					<i class="fa fa-book-open"></i> My Subjects
				</div>
			</a>

			<a href="#" onclick="openStd()">
				<div class="side-inner">
					<i class="fa fa-edit"></i> Enter Scores
					<i class="fa fa-caret-down"></i>
				</div>
			</a>
			<div class="dsp-std" id="openStud">
				<div class="inner-links">
					<!-- Get the class students -->
					<?php
					$claStd = "SELECT DISTINCT(class) AS class FROM teacher_assignments 
								WHERE staffId = ?";
					$stdstmt = $pdo->prepare($claStd);
					$stdstmt->execute([$staffId]);
					while ($stdrow = $stdstmt->fetch(PDO::FETCH_ASSOC)) {
						$className = $stdrow['class'];?>
						<a href="sub.php?class=<?=$className?>">
							<div class="side-inner">
								<i class="fa fa-caret-right"></i> <?= $className?> Student
							</div>
						</a>
					<?php }

					?>
					
				</div>
			</div>

			<!-- Display Report card since you are a classteacher -->
			<?php
			if ($staffRole == 'class_teacher') {?>
				<a href="my_class_results.php">
					<div class="side-inner">
						<i class="fa fa-table"></i> My Class Result
					</div>
				</a>
			
			
			<a href="my-students.php">
				<div class="side-inner">
					<i class="fa fa-users"></i> My Students
				</div>
			</a>
			<!-- Since you are a class teacher, you can see all your students here -->

			<?php }
			?>
			<a href="records_history.php">
				<div class="side-inner">
					<i class="fa fa-pen"></i> Records
				</div>
			</a>
		    
		   <a href="profile.php">
			   	<div class="side-inner">
			   		<i class="fa fa-cogs"></i> Profile
			   	</div>
		   </a>

			<a href="../logout.php">
				<div class="side-inner">
					<i class="fa fa-user-circle"></i> Logout
				</div>
			</a>
		</div>
	</div>
    
</div>

<style>
	.dsp-std{
		width: 100%;
		height: 0;
		background: #1F282F;
		overflow: hidden;
		transition: height 0.4s ease;
		box-shadow: 0 2px 4px rgba(0,0,0,0.3);
	}
	.dsp-std.expanded{
		
	}
	.inner-links{
		display: flex;
		flex-direction: column;
		/*padding: 10px;*/
		padding-left: 10px;
		padding-right: 10px;
	}
	.inner-links a{
		color: #fff;
		font-size: 15px;

	}
</style>
<script>
function DropClick() {
  const sidebar = document.getElementById('dropdown');
  sidebar.classList.toggle('active');
}

// Detect clicks outside sidebar (only on mobile)
document.addEventListener('click', function(event) {
  const sidebar = document.getElementById('dropdown');
  const menuBtn = document.getElementById('menuBtn'); // ✅ Now this exists

  // Only run on mobile
  if (window.innerWidth <= 992) {
    const clickInsideSidebar = sidebar.contains(event.target);
    const clickOnButton = menuBtn.contains(event.target);

    // If sidebar is open and click is outside both
    if (sidebar.classList.contains('active') && !clickInsideSidebar && !clickOnButton) {
      sidebar.classList.remove('active');
    }
  }
});
</script>
<script>
	function openStd() {
		const content = document.getElementById('openStud');

			if (content.classList.contains('expanded')) {
				// Get the current height before collapsing
				content.style.height = content.scrollHeight + 'px';

				// Force reflow to make sure browser registers the height
				content.offsetHeight; // This line is very important

				// Now collapse
				content.style.height = '0';
				content.classList.remove('expanded');
			} else {
				// Expand
				content.style.height = content.scrollHeight + 'px';
				content.classList.add('expanded');

				// After transition, reset to auto so resizing works naturally
				content.addEventListener('transitionend', function removeHeight() {
					if (content.classList.contains('expanded')) {
						content.style.height = 'auto';
					}
					content.removeEventListener('transitionend', removeHeight);
				});
			}
			
	}

	function ShowNav(){
		let dropLinks = document.getElementById('dropLink');
		dropLinks.classList.toggle('active');
	}

	function flexing(){
		const myDrops = document.getElementById('myDrop');
		myDrops.classList.toggle('active');
	}

</script>
<?php



?>