Find this useful? Enter your email to receive occasional updates for securing PHP code.
Signing you up...
Thank you for signing up!
PHP Decode
<?php // includes/header.php require_once $_SERVER['DOCUMENT_ROOT'] . '/technician-porta..
Decoded Output download
<?php
// includes/header.php
require_once $_SERVER['DOCUMENT_ROOT'] . '/technician-portal/config/config.php';
require_once $_SERVER['DOCUMENT_ROOT'] . '/technician-portal/config/functions.php';
require_once $_SERVER['DOCUMENT_ROOT'] . '/technician-portal/includes/classes/LicenseVerifier.php';
startSecureSession();
$currentUser = getCurrentUser();
// Verify license status on each page load (with caching)
$licenseVerifier = new LicenseVerifier();
if ($licenseVerifier->isPortalLocked() || !$licenseVerifier->verifyLicense()) {
// Clear any existing sessions
session_destroy();
// Redirect to a lock page or show error
die('Portal access has been revoked. Please contact your administrator.');
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Technician Portal</title>
<!-- CSS Files -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/main.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
<link href="https://cdn.datatables.net/1.11.5/css/dataTables.bootstrap5.min.css" rel="stylesheet">
<!-- JavaScript Files -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/main.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.11.5/js/dataTables.bootstrap5.min.js"></script>
<!-- Add this after your existing Bootstrap and other CSS links -->
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
<script src="<?php echo SITE_URL; ?>/assets/js/NotificationSystem.js"></script>
<!-- Custom CSS -->
<style>
/* Header Theme Variables */
:root {
--header-height: 70px;
--header-bg: rgba(255, 255, 255, 0.98);
--header-border: rgba(229, 231, 235, 0.5);
--header-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
--notification-primary: #4f46e5;
--notification-bg: #eff6ff;
--dropdown-shadow:
0 10px 15px -3px rgba(0, 0, 0, 0.1),
0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
/* Main Container */
.main-container {
display: flex;
flex-direction: column;
min-height: 100vh;
}
/* Top Header */
.top-header {
height: var(--header-height);
background: var(--header-bg);
border-bottom: 1px solid var(--header-border);
backdrop-filter: blur(10px);
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1000;
padding: 0 1.5rem;
box-shadow: var(--header-shadow);
}
/* Page Title */
.top-header h4 {
color: #1f2937;
font-weight: 600;
font-size: 1.25rem;
margin-left: 1rem;
position: relative;
}
.top-header h4::after {
content: '';
position: absolute;
bottom: -6px;
left: 0;
width: 40px;
height: 3px;
background: linear-gradient(90deg, #4f46e5, #818cf8);
border-radius: 2px;
opacity: 0;
transform: scaleX(0);
transition: all 0.3s ease;
}
.top-header h4:hover::after {
opacity: 1;
transform: scaleX(1);
}
/* Sidebar Toggle Button */
#sidebarToggle {
color: #4b5563;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.2s ease;
}
#sidebarToggle:hover {
background: rgba(79, 70, 229, 0.1);
color: #4f46e5;
}
/* Notification Bell */
.notification-bell {
position: relative;
padding: 0.5rem;
cursor: pointer;
border-radius: 8px;
transition: all 0.2s ease;
}
.notification-bell:hover {
background: rgba(79, 70, 229, 0.1);
}
.notification-bell i {
color: #4b5563;
transition: all 0.2s ease;
}
.notification-bell:hover i {
color: #4f46e5;
transform: rotate(12deg);
}
.notification-count {
position: absolute;
top: 0;
right: 0;
background: #ef4444;
color: white;
font-size: 0.75rem;
padding: 0.125rem 0.375rem;
border-radius: 999px;
font-weight: 600;
transform: translate(25%, -25%);
box-shadow: 0 2px 4px rgba(239, 68, 68, 0.2);
}
/* Notification Dropdown */
.notification-dropdown {
width: 320px;
padding: 0;
border: none;
border-radius: 12px;
box-shadow: var(--dropdown-shadow);
margin-top: 0.75rem;
}
.dropdown-header {
padding: 1rem;
font-weight: 600;
color: #1f2937;
background: rgba(249, 250, 251, 0.8);
border-radius: 12px 12px 0 0;
}
.notifications-content {
max-height: 360px;
overflow-y: auto;
padding: 0.5rem;
}
/* User Dropdown */
.dropdown-toggle {
padding: 0.5rem 1rem;
color: #1f2937;
font-weight: 500;
border-radius: 8px;
transition: all 0.2s ease;
}
.dropdown-toggle:hover {
background: rgba(79, 70, 229, 0.1);
color: #4f46e5;
}
.dropdown-toggle::after {
margin-left: 0.5rem;
vertical-align: middle;
transition: transform 0.2s ease;
}
.show .dropdown-toggle::after {
transform: rotate(180deg);
}
.dropdown-menu {
border: none;
border-radius: 12px;
box-shadow: var(--dropdown-shadow);
margin-top: 0.75rem;
padding: 0.5rem;
}
.dropdown-item {
padding: 0.75rem 1rem;
color: #4b5563;
border-radius: 8px;
transition: all 0.2s ease;
}
.dropdown-item:hover {
background: rgba(79, 70, 229, 0.1);
color: #4f46e5;
}
/* Content Wrapper */
.content-wrapper {
margin-top: var(--header-height);
margin-left: 250px; /* Adjust based on your sidebar width */
padding: 2rem;
transition: margin-left 0.3s ease;
}
/* Responsive Design */
@media (max-width: 768px) {
.content-wrapper {
margin-left: 0;
}
.top-header {
padding: 0 1rem;
}
.notification-dropdown {
width: 280px;
}
}
</style>
<script>
document.addEventListener('DOMContentLoaded', function() {
// Notification bell animation
const notificationBell = document.querySelector('.notification-bell');
if (notificationBell) {
// Initial animation
setTimeout(() => {
notificationBell.style.animation = 'bellShake 1s cubic-bezier(0.36, 0, 0.66, -0.56) forwards';
}, 1000);
// Animation on hover
notificationBell.addEventListener('mouseenter', () => {
notificationBell.style.animation = 'bellShake 0.5s cubic-bezier(0.36, 0, 0.66, -0.56)';
});
}
// Handle notification updates
function updateNotifications() {
const notificationCount = document.querySelector('.notification-count');
const notificationsContent = document.querySelector('.notifications-content');
// Fetch notifications (mock implementation)
fetch('/api/notifications')
.then(response => response.json())
.then(data => {
if (data.count > 0) {
notificationCount.textContent = data.count;
notificationCount.style.display = 'block';
if (data.count > parseInt(notificationCount.textContent)) {
notificationBell.style.animation = 'bellShake 1s cubic-bezier(0.36, 0, 0.66, -0.56)';
}
} else {
notificationCount.style.display = 'none';
}
})
.catch(error => console.error('Error fetching notifications:', error));
}
// Mobile sidebar toggle
const sidebarToggle = document.getElementById('sidebarToggle');
const mainContainer = document.querySelector('.main-container');
if (sidebarToggle) {
sidebarToggle.addEventListener('click', () => {
mainContainer.classList.toggle('sidebar-open');
const isOpen = mainContainer.classList.contains('sidebar-open');
// Animate the icon
sidebarToggle.querySelector('i').style.transform = isOpen ? 'rotate(90deg)' : 'rotate(0)';
});
}
// Add animation styles
const style = document.createElement('style');
style.textContent = `
@keyframes bellShake {
0% { transform: rotate(0); }
15% { transform: rotate(15deg); }
30% { transform: rotate(-15deg); }
45% { transform: rotate(10deg); }
60% { transform: rotate(-10deg); }
75% { transform: rotate(5deg); }
85% { transform: rotate(-5deg); }
92% { transform: rotate(3deg); }
100% { transform: rotate(0); }
}
@keyframes slideDown {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.dropdown-menu.show {
animation: slideDown 0.2s ease forwards;
}
`;
document.head.appendChild(style);
// Update notifications periodically
updateNotifications();
setInterval(updateNotifications, 30000); // Every 30 seconds
});
</script>
<script>
// Initialize Header Components
document.addEventListener('DOMContentLoaded', function() {
// User Avatar Initial
const userAvatar = document.querySelector('.user-avatar');
if (userAvatar) {
const userName = document.querySelector('.user-name').textContent;
userAvatar.textContent = userName.charAt(0).toUpperCase();
}
// Mobile Menu Toggle
const menuToggle = document.getElementById('sidebarToggle');
const body = document.body;
menuToggle?.addEventListener('click', () => {
body.classList.toggle('sidebar-open');
document.querySelector('.sidebar').classList.toggle('show');
});
// Close sidebar when clicking outside
document.addEventListener('click', (e) => {
if (body.classList.contains('sidebar-open') &&
!e.target.closest('.sidebar') &&
!e.target.closest('#sidebarToggle')) {
body.classList.remove('sidebar-open');
document.querySelector('.sidebar').classList.remove('show');
}
});
// Enhanced Notifications
let notificationTimeout;
const notificationBell = document.querySelector('.notification-bell');
notificationBell?.addEventListener('mouseenter', () => {
clearTimeout(notificationTimeout);
notificationBell.classList.add('active');
});
notificationBell?.addEventListener('mouseleave', () => {
notificationTimeout = setTimeout(() => {
notificationBell.classList.remove('active');
}, 300);
});
// Smooth Scroll Shadow
const header = document.querySelector('.top-header');
let lastScroll = 0;
window.addEventListener('scroll', () => {
const currentScroll = window.pageYOffset;
if (currentScroll > lastScroll && currentScroll > 80) {
header.style.boxShadow = '0 4px 12px rgba(0,0,0,0.05)';
} else {
header.style.boxShadow = '0 2px 4px rgba(0,0,0,0.03)';
}
lastScroll = currentScroll;
});
});
// Enhanced Notification Loading
function loadNotifications() {
const notificationContent = document.querySelector('.notifications-content');
if (!notificationContent) return;
fetch(SITE_URL + '/api/notifications.php')
.then(response => response.json())
.then(data => {
document.querySelector('.notification-count').textContent = data.unread_count;
notificationContent.innerHTML = data.html;
// Add animation to new notifications
const newNotifications = notificationContent.querySelectorAll('.new-notification');
newNotifications.forEach(notification => {
notification.classList.add('animate-in');
});
})
.catch(error => console.error('Error loading notifications:', error));
}
// Initialize on load
document.addEventListener('DOMContentLoaded', () => {
loadNotifications();
setInterval(loadNotifications, 60000); // Refresh every minute
});
</script>
</head>
<body>
<?php if(isset($currentUser)): ?>
<div class="main-container">
<!-- Include Top Header -->
<header class="top-header">
<div class="d-flex justify-content-between align-items-center h-100">
<div class="d-flex align-items-center">
<button class="btn btn-link d-md-none" id="sidebarToggle">
<i class="fas fa-bars"></i>
</button>
<h4 class="mb-0 ms-2"><?php echo isset($pageTitle) ? $pageTitle : 'Dashboard'; ?></h4>
</div>
<div class="d-flex align-items-center">
<div class="dropdown me-3">
<div class="notification-bell" data-bs-toggle="dropdown">
<i class="fas fa-bell fa-lg"></i>
<span class="notification-count">0</span>
</div>
<div class="dropdown-menu dropdown-menu-end notification-dropdown">
<div class="dropdown-header">Notifications</div>
<div class="dropdown-divider"></div>
<div class="notifications-content">
<!-- Notifications will be loaded here -->
</div>
</div>
</div>
<div class="dropdown">
<button class="btn btn-link dropdown-toggle" type="button" data-bs-toggle="dropdown">
<?php echo htmlspecialchars($currentUser['full_name']); ?>
</button>
<ul class="dropdown-menu dropdown-menu-end">
<li><a class="dropdown-item" href="<?php echo SITE_URL; ?>/profile.php">My Profile</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="<?php echo SITE_URL; ?>/change_password.php">
<i class="fas fa-key"></i> Change Password
</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="<?php echo SITE_URL; ?>/auth/logout.php">Logout</a></li>
</ul>
</div>
</div>
</div>
</header>
<!-- Include Sidebar -->
<?php require_once $_SERVER['DOCUMENT_ROOT'] . '/technician-portal/includes/sidebar.php'; ?>
<!-- Content Wrapper -->
<div class="content-wrapper">
<!-- Page content will be inserted here -->
<?php endif; ?>
<!-- Common JavaScript functions -->
<script src="<?php echo SITE_URL; ?>/assets/js/chat.js"></script>
<script src="<?php echo SITE_URL; ?>/assets/js/main.js"></script>
<script>
// Notification functions
function loadNotifications() {
$.get(SITE_URL + '/api/notifications.php', function(data) {
$('#notification-count').text(data.unread_count);
$('.notifications-content').html(data.html);
});
}
// Initialize components
$(document).ready(function() {
// Initialize Select2
$('.select2').select2();
// Load initial notifications
loadNotifications();
// Refresh notifications every minute
setInterval(loadNotifications, 60000);
// Mobile menu toggle
$('#menu-toggle').click(function(e) {
e.preventDefault();
$('.sidebar').toggleClass('show');
});
});
// Show loading spinner
function showLoading() {
$('.loading-spinner').show();
}
// Hide loading spinner
function hideLoading() {
$('.loading-spinner').hide();
}
</script>
<!-- Add this right after your jQuery and Bootstrap script includes -->
<script>
const SITE_URL = '<?php echo SITE_URL; ?>';
</script>
Did this file decode correctly?
Original Code
<?php
// includes/header.php
require_once $_SERVER['DOCUMENT_ROOT'] . '/technician-portal/config/config.php';
require_once $_SERVER['DOCUMENT_ROOT'] . '/technician-portal/config/functions.php';
require_once $_SERVER['DOCUMENT_ROOT'] . '/technician-portal/includes/classes/LicenseVerifier.php';
startSecureSession();
$currentUser = getCurrentUser();
// Verify license status on each page load (with caching)
$licenseVerifier = new LicenseVerifier();
if ($licenseVerifier->isPortalLocked() || !$licenseVerifier->verifyLicense()) {
// Clear any existing sessions
session_destroy();
// Redirect to a lock page or show error
die('Portal access has been revoked. Please contact your administrator.');
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Technician Portal</title>
<!-- CSS Files -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/main.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
<link href="https://cdn.datatables.net/1.11.5/css/dataTables.bootstrap5.min.css" rel="stylesheet">
<!-- JavaScript Files -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/main.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.11.5/js/dataTables.bootstrap5.min.js"></script>
<!-- Add this after your existing Bootstrap and other CSS links -->
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
<script src="<?php echo SITE_URL; ?>/assets/js/NotificationSystem.js"></script>
<!-- Custom CSS -->
<style>
/* Header Theme Variables */
:root {
--header-height: 70px;
--header-bg: rgba(255, 255, 255, 0.98);
--header-border: rgba(229, 231, 235, 0.5);
--header-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
--notification-primary: #4f46e5;
--notification-bg: #eff6ff;
--dropdown-shadow:
0 10px 15px -3px rgba(0, 0, 0, 0.1),
0 4px 6px -2px rgba(0, 0, 0, 0.05);
}
/* Main Container */
.main-container {
display: flex;
flex-direction: column;
min-height: 100vh;
}
/* Top Header */
.top-header {
height: var(--header-height);
background: var(--header-bg);
border-bottom: 1px solid var(--header-border);
backdrop-filter: blur(10px);
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1000;
padding: 0 1.5rem;
box-shadow: var(--header-shadow);
}
/* Page Title */
.top-header h4 {
color: #1f2937;
font-weight: 600;
font-size: 1.25rem;
margin-left: 1rem;
position: relative;
}
.top-header h4::after {
content: '';
position: absolute;
bottom: -6px;
left: 0;
width: 40px;
height: 3px;
background: linear-gradient(90deg, #4f46e5, #818cf8);
border-radius: 2px;
opacity: 0;
transform: scaleX(0);
transition: all 0.3s ease;
}
.top-header h4:hover::after {
opacity: 1;
transform: scaleX(1);
}
/* Sidebar Toggle Button */
#sidebarToggle {
color: #4b5563;
padding: 0.5rem;
border-radius: 8px;
transition: all 0.2s ease;
}
#sidebarToggle:hover {
background: rgba(79, 70, 229, 0.1);
color: #4f46e5;
}
/* Notification Bell */
.notification-bell {
position: relative;
padding: 0.5rem;
cursor: pointer;
border-radius: 8px;
transition: all 0.2s ease;
}
.notification-bell:hover {
background: rgba(79, 70, 229, 0.1);
}
.notification-bell i {
color: #4b5563;
transition: all 0.2s ease;
}
.notification-bell:hover i {
color: #4f46e5;
transform: rotate(12deg);
}
.notification-count {
position: absolute;
top: 0;
right: 0;
background: #ef4444;
color: white;
font-size: 0.75rem;
padding: 0.125rem 0.375rem;
border-radius: 999px;
font-weight: 600;
transform: translate(25%, -25%);
box-shadow: 0 2px 4px rgba(239, 68, 68, 0.2);
}
/* Notification Dropdown */
.notification-dropdown {
width: 320px;
padding: 0;
border: none;
border-radius: 12px;
box-shadow: var(--dropdown-shadow);
margin-top: 0.75rem;
}
.dropdown-header {
padding: 1rem;
font-weight: 600;
color: #1f2937;
background: rgba(249, 250, 251, 0.8);
border-radius: 12px 12px 0 0;
}
.notifications-content {
max-height: 360px;
overflow-y: auto;
padding: 0.5rem;
}
/* User Dropdown */
.dropdown-toggle {
padding: 0.5rem 1rem;
color: #1f2937;
font-weight: 500;
border-radius: 8px;
transition: all 0.2s ease;
}
.dropdown-toggle:hover {
background: rgba(79, 70, 229, 0.1);
color: #4f46e5;
}
.dropdown-toggle::after {
margin-left: 0.5rem;
vertical-align: middle;
transition: transform 0.2s ease;
}
.show .dropdown-toggle::after {
transform: rotate(180deg);
}
.dropdown-menu {
border: none;
border-radius: 12px;
box-shadow: var(--dropdown-shadow);
margin-top: 0.75rem;
padding: 0.5rem;
}
.dropdown-item {
padding: 0.75rem 1rem;
color: #4b5563;
border-radius: 8px;
transition: all 0.2s ease;
}
.dropdown-item:hover {
background: rgba(79, 70, 229, 0.1);
color: #4f46e5;
}
/* Content Wrapper */
.content-wrapper {
margin-top: var(--header-height);
margin-left: 250px; /* Adjust based on your sidebar width */
padding: 2rem;
transition: margin-left 0.3s ease;
}
/* Responsive Design */
@media (max-width: 768px) {
.content-wrapper {
margin-left: 0;
}
.top-header {
padding: 0 1rem;
}
.notification-dropdown {
width: 280px;
}
}
</style>
<script>
document.addEventListener('DOMContentLoaded', function() {
// Notification bell animation
const notificationBell = document.querySelector('.notification-bell');
if (notificationBell) {
// Initial animation
setTimeout(() => {
notificationBell.style.animation = 'bellShake 1s cubic-bezier(0.36, 0, 0.66, -0.56) forwards';
}, 1000);
// Animation on hover
notificationBell.addEventListener('mouseenter', () => {
notificationBell.style.animation = 'bellShake 0.5s cubic-bezier(0.36, 0, 0.66, -0.56)';
});
}
// Handle notification updates
function updateNotifications() {
const notificationCount = document.querySelector('.notification-count');
const notificationsContent = document.querySelector('.notifications-content');
// Fetch notifications (mock implementation)
fetch('/api/notifications')
.then(response => response.json())
.then(data => {
if (data.count > 0) {
notificationCount.textContent = data.count;
notificationCount.style.display = 'block';
if (data.count > parseInt(notificationCount.textContent)) {
notificationBell.style.animation = 'bellShake 1s cubic-bezier(0.36, 0, 0.66, -0.56)';
}
} else {
notificationCount.style.display = 'none';
}
})
.catch(error => console.error('Error fetching notifications:', error));
}
// Mobile sidebar toggle
const sidebarToggle = document.getElementById('sidebarToggle');
const mainContainer = document.querySelector('.main-container');
if (sidebarToggle) {
sidebarToggle.addEventListener('click', () => {
mainContainer.classList.toggle('sidebar-open');
const isOpen = mainContainer.classList.contains('sidebar-open');
// Animate the icon
sidebarToggle.querySelector('i').style.transform = isOpen ? 'rotate(90deg)' : 'rotate(0)';
});
}
// Add animation styles
const style = document.createElement('style');
style.textContent = `
@keyframes bellShake {
0% { transform: rotate(0); }
15% { transform: rotate(15deg); }
30% { transform: rotate(-15deg); }
45% { transform: rotate(10deg); }
60% { transform: rotate(-10deg); }
75% { transform: rotate(5deg); }
85% { transform: rotate(-5deg); }
92% { transform: rotate(3deg); }
100% { transform: rotate(0); }
}
@keyframes slideDown {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.dropdown-menu.show {
animation: slideDown 0.2s ease forwards;
}
`;
document.head.appendChild(style);
// Update notifications periodically
updateNotifications();
setInterval(updateNotifications, 30000); // Every 30 seconds
});
</script>
<script>
// Initialize Header Components
document.addEventListener('DOMContentLoaded', function() {
// User Avatar Initial
const userAvatar = document.querySelector('.user-avatar');
if (userAvatar) {
const userName = document.querySelector('.user-name').textContent;
userAvatar.textContent = userName.charAt(0).toUpperCase();
}
// Mobile Menu Toggle
const menuToggle = document.getElementById('sidebarToggle');
const body = document.body;
menuToggle?.addEventListener('click', () => {
body.classList.toggle('sidebar-open');
document.querySelector('.sidebar').classList.toggle('show');
});
// Close sidebar when clicking outside
document.addEventListener('click', (e) => {
if (body.classList.contains('sidebar-open') &&
!e.target.closest('.sidebar') &&
!e.target.closest('#sidebarToggle')) {
body.classList.remove('sidebar-open');
document.querySelector('.sidebar').classList.remove('show');
}
});
// Enhanced Notifications
let notificationTimeout;
const notificationBell = document.querySelector('.notification-bell');
notificationBell?.addEventListener('mouseenter', () => {
clearTimeout(notificationTimeout);
notificationBell.classList.add('active');
});
notificationBell?.addEventListener('mouseleave', () => {
notificationTimeout = setTimeout(() => {
notificationBell.classList.remove('active');
}, 300);
});
// Smooth Scroll Shadow
const header = document.querySelector('.top-header');
let lastScroll = 0;
window.addEventListener('scroll', () => {
const currentScroll = window.pageYOffset;
if (currentScroll > lastScroll && currentScroll > 80) {
header.style.boxShadow = '0 4px 12px rgba(0,0,0,0.05)';
} else {
header.style.boxShadow = '0 2px 4px rgba(0,0,0,0.03)';
}
lastScroll = currentScroll;
});
});
// Enhanced Notification Loading
function loadNotifications() {
const notificationContent = document.querySelector('.notifications-content');
if (!notificationContent) return;
fetch(SITE_URL + '/api/notifications.php')
.then(response => response.json())
.then(data => {
document.querySelector('.notification-count').textContent = data.unread_count;
notificationContent.innerHTML = data.html;
// Add animation to new notifications
const newNotifications = notificationContent.querySelectorAll('.new-notification');
newNotifications.forEach(notification => {
notification.classList.add('animate-in');
});
})
.catch(error => console.error('Error loading notifications:', error));
}
// Initialize on load
document.addEventListener('DOMContentLoaded', () => {
loadNotifications();
setInterval(loadNotifications, 60000); // Refresh every minute
});
</script>
</head>
<body>
<?php if(isset($currentUser)): ?>
<div class="main-container">
<!-- Include Top Header -->
<header class="top-header">
<div class="d-flex justify-content-between align-items-center h-100">
<div class="d-flex align-items-center">
<button class="btn btn-link d-md-none" id="sidebarToggle">
<i class="fas fa-bars"></i>
</button>
<h4 class="mb-0 ms-2"><?php echo isset($pageTitle) ? $pageTitle : 'Dashboard'; ?></h4>
</div>
<div class="d-flex align-items-center">
<div class="dropdown me-3">
<div class="notification-bell" data-bs-toggle="dropdown">
<i class="fas fa-bell fa-lg"></i>
<span class="notification-count">0</span>
</div>
<div class="dropdown-menu dropdown-menu-end notification-dropdown">
<div class="dropdown-header">Notifications</div>
<div class="dropdown-divider"></div>
<div class="notifications-content">
<!-- Notifications will be loaded here -->
</div>
</div>
</div>
<div class="dropdown">
<button class="btn btn-link dropdown-toggle" type="button" data-bs-toggle="dropdown">
<?php echo htmlspecialchars($currentUser['full_name']); ?>
</button>
<ul class="dropdown-menu dropdown-menu-end">
<li><a class="dropdown-item" href="<?php echo SITE_URL; ?>/profile.php">My Profile</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="<?php echo SITE_URL; ?>/change_password.php">
<i class="fas fa-key"></i> Change Password
</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="<?php echo SITE_URL; ?>/auth/logout.php">Logout</a></li>
</ul>
</div>
</div>
</div>
</header>
<!-- Include Sidebar -->
<?php require_once $_SERVER['DOCUMENT_ROOT'] . '/technician-portal/includes/sidebar.php'; ?>
<!-- Content Wrapper -->
<div class="content-wrapper">
<!-- Page content will be inserted here -->
<?php endif; ?>
<!-- Common JavaScript functions -->
<script src="<?php echo SITE_URL; ?>/assets/js/chat.js"></script>
<script src="<?php echo SITE_URL; ?>/assets/js/main.js"></script>
<script>
// Notification functions
function loadNotifications() {
$.get(SITE_URL + '/api/notifications.php', function(data) {
$('#notification-count').text(data.unread_count);
$('.notifications-content').html(data.html);
});
}
// Initialize components
$(document).ready(function() {
// Initialize Select2
$('.select2').select2();
// Load initial notifications
loadNotifications();
// Refresh notifications every minute
setInterval(loadNotifications, 60000);
// Mobile menu toggle
$('#menu-toggle').click(function(e) {
e.preventDefault();
$('.sidebar').toggleClass('show');
});
});
// Show loading spinner
function showLoading() {
$('.loading-spinner').show();
}
// Hide loading spinner
function hideLoading() {
$('.loading-spinner').hide();
}
</script>
<!-- Add this right after your jQuery and Bootstrap script includes -->
<script>
const SITE_URL = '<?php echo SITE_URL; ?>';
</script>
Function Calls
None |
Stats
MD5 | 0a97b5483cb3411c26a6cadf9561a011 |
Eval Count | 0 |
Decode Time | 54 ms |