Scribd
Upload
8 views

Messenger

Uploaded by

enzorivera112302
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
8 views

Messenger

Uploaded by

enzorivera112302
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 18

<!

doctype html>
<html lang="en">
<style>
.containers {
margin: 0 50px;
}

@media (max-width: 768px) {


.containers {
margin: 0 20px;
}
}

@media (max-width: 576px) {


.containers {
margin: 0 10px;
}
}
/* Custom Navbar Styling */
.navbar {
background-color: #2c3e50;
border-bottom: 3px solid #2980b9;
padding: 10px 0;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.navbar .containers {
display: flex;
justify-content: space-between;
align-items: center;
}

.navbar-logo img {
height: 50px;
}

.navbar-toggle {
background-color: transparent;
border: none;
outline: none;
color: #ecf0f1;
}

.navbar-toggle span {
display: block;
width: 25px;
height: 3px;
background-color: #ecf0f1;
margin: 4px 0;
}

.navbar-menu {
display: flex;
justify-content: space-between;
align-items: center;
}

.navbar-nav {
list-style: none;
display: flex;
padding: 0;
margin: 0;
}

.nav-item {
margin: 15px 0;
text-align: center;
}

.nav-item a {
color: #bdc3c7;
font-size: 16px;
padding: 10px 0;
display: block;
text-decoration: none;
}

.nav-item a:hover {
color: #ecf0f1;
}

.navbar-nav-auth {
display: flex;
}

.navbar-nav-auth .nav-item {
margin-left: 15px;
}

.navbar-fixed-top {
position: fixed;
top: 0;
width: 100%;
z-index: 1000;
transition: background-color 0.3s ease;
}

.navbar-sticky-function {
background-color: #34495e;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* Responsive Styles */
@media (max-width: 768px) {
.navbar-menu {
flex-direction: column;
}

.navbar-nav {
flex-direction: column;
}

.navbar-nav-auth {
flex-direction: column;
}
}
</style>
<?php
require '../constants/settings.php';
require 'constants/check-login.php';

if ($user_online == "true") {
if ($myrole == "employee") {
} else {
header("location:../");
}
} else {
header("location:../");
}

if (isset($_GET['page'])) {
$page = $_GET['page'];
if ($page=="" || $page=="1") {
$page1 = 0;
$page = 1;
} else {
$page1 = ($page*10)-10;
}
} else {
$page1 = 0;
$page = 1;
}
?>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

<title>Batceis - Change Password</title>


<meta name="description" content="Online Job Management / Job Portal" />
<meta name="keywords" content="job, work, resume, applicants, application,
employee, employer, hire, hiring, human resource management, hr, online job
management, company, worker, career, recruiting, recruitment" />
<meta name="author" content="BwireSoft">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-
scale=1">
<meta property="og:image" content="http://<?php echo "$actual_link";
?>/images/banner.jpg" />
<meta property="og:image:secure_url" content="https://<?php echo
"$actual_link"; ?>/images/banner.jpg" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image:width" content="500" />
<meta property="og:image:height" content="300" />
<meta property="og:image:alt" content="Bwire Jobs" />
<meta property="og:description" content="Online Job Management / Job Portal" />

<link rel="shortcut icon" href="../images/ico/favicon.png">


<link href="../css/nav.css" rel="stylesheet">
<link rel="stylesheet" type="text/css"
href="../bootstrap/css/bootstrap.min.css" media="screen">
<link href="../css/animate.css" rel="stylesheet">
<link href="../css/main.css" rel="stylesheet">
<link href="../css/component.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/
css/all.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/5.15.4/css/all.min.css">
<link rel="stylesheet" href="../icons/linearicons/style.css">
<link rel="stylesheet" href="../icons/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="../icons/simple-line-icons/css/simple-line-
icons.css">
<link rel="stylesheet" href="../icons/ionicons/css/ionicons.css">
<link rel="stylesheet" href="../icons/pe-icon-7-stroke/css/pe-icon-7-
stroke.css">
<link rel="stylesheet" href="../icons/rivolicons/style.css">
<link rel="stylesheet" href="../icons/flaticon-line-icon-set/flaticon-line-
icon-set.css">
<link rel="stylesheet" href="../icons/flaticon-streamline-outline/flaticon-
streamline-outline.css">
<link rel="stylesheet" href="../icons/flaticon-thick-icons/flaticon-thick.css">
<link rel="stylesheet" href="../icons/flaticon-ventures/flaticon-ventures.css">

<link href="../css/style.css" rel="stylesheet">


<link href="../css/view2.css" rel="stylesheet">
</head>
<style>
.autofit2 {
height:80px;
width:100px;
object-fit:cover;
}
</style>

<body class="not-transparent-header">
<div class="container-wrapper">
<header id="header">
<nav class="navbar navbar-default navbar-fixed-top navbar-sticky-
function">
<div class="containers">
<div class="navbar-logo">
<a href="./"><img src="../images/logo1.png" alt="Logo1"
/></a>
</div>
<button class="navbar-toggle" aria-label="Toggle navigation">
<span></span>
<span></span>
<span></span>
</button>
<div class="navbar-menu">
<ul class="navbar-nav">
<li class="nav-item"><a
href="../employee/index_applicant.php" style="color: white;">Home</a></li>
<li class="nav-item"><a href="../job-list.php"
style="color: white;" >Job List</a></li>
<li class="nav-item"><a href="../employers.php"
style="color: white;">Employers</a></li>
<li class="nav-item"><a href="../contact.php"
style="color: white;">Contact Us</a></li>
</ul>
<ul class="navbar-nav navbar-nav-auth">
<?php if ($user_online): ?>
<li class="nav-item"><a href="../logout.php"
style="color: white;">Logout</a></li>
<li class="nav-item"><a href="./"style="color:
white;">Profile</a></li>
<?php else: ?>
<li class="nav-item"><a href="login.php"
style="color: white;">Login</a></li>
<li class="nav-item"><a href="#registerModal" data-
toggle="modal" style="color: white;">Register</a></li>
<?php endif; ?>
</ul>
</div>
</div>
</nav>
</header>

<div class="main-wrapper">
<div class="breadcrumb-wrapper">
<div class="containers">
<ol class="breadcrumb-list booking-step">
<li><a href="../">BATCEIS</a></li>
<li><span>Profile</span></li>
</ol>
<!-- Notification bell positioned relative to the breadcrumb --
>
<div id="notification-bell" class="notification-bell">
<i class="fa fa-bell"></i>
<span id="notification-count" class="notification-
count"></span>
</div>

<div id="notification-dropdown" class="notification-dropdown">


<div id="notification-content"></div>
</div>
</div>
</div>
<!-- Add this right before the closing </body> tag -->
<script>
document.addEventListener('DOMContentLoaded', function() {
const bell = document.getElementById('notification-bell');
const dropdown = document.getElementById('notification-
dropdown');
const notificationCount =
document.getElementById('notification-count');
const notificationContent =
document.getElementById('notification-content');

function fetchNotifications() {
fetch('get_notifications.php')
.then(response => response.json())
.then(data => {
const relevantNotifications =
data.filter(notification =>
notification.status === 'HIRED' ||
notification.status === 'NOT HIRED'
);
notificationCount.textContent =
relevantNotifications.length;
notificationContent.innerHTML = '';

relevantNotifications.forEach(notification => {
const notificationItem =
document.createElement('div');
notificationItem.className = 'notification-
item';
notificationItem.textContent = `Job: $
{notification.job_title} - Status: ${notification.status}`;

notificationContent.appendChild(notificationItem);

// Create an additional message container


const additionalMessage =
document.createElement('div');
additionalMessage.className = 'additional-
message';

// Add message for hired candidates


if (notification.status === 'HIRED') {
additionalMessage.textContent = 'Please
wait for an email regarding to your upcoming interview.';
}

// Add message for not hired candidates


if (notification.status === 'NOT HIRED') {
additionalMessage.textContent = 'We are
sorry, but you were not selected for the position. We wish you the best in your
future applications.';
}

// Append additional message to notification


item

notificationItem.appendChild(additionalMessage);

// Toggle additional message on click


notificationItem.addEventListener('click',
function() {
additionalMessage.style.display =
additionalMessage.style.display === 'none' ? 'block' : 'none';
});
});
})
.catch(error => console.error('Error fetching
notifications:', error));
}

bell.addEventListener('click', function() {
dropdown.style.display = dropdown.style.display ===
'none' ? 'block' : 'none';
});

// Fetch notifications every 60 seconds


fetchNotifications();
setInterval(fetchNotifications, 60000);
});
</script>

<style>
.breadcrumb-wrapper {
position: relative;
}
.notification-bell {
position: absolute;
top: 10px;
right: 20px;
cursor: pointer;
z-index: 1001;
font-size: 20px;
color: black;
}

.notification-count {
position: absolute;
color: red;
font-size: 15px;
top: -10px;
left: 15px;
}

.notification-dropdown {
display: none;
position: absolute;
top: 30px;
right: 0;
background-color: #1c1f26;
border: 1px solid #ddd;
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
padding: 15px;
max-width: 350px;
max-height: 400px;
overflow-y: auto;
z-index: 1000;
}

.notification-item {
padding: 10px 15px;
border-bottom: 1px solid #eee;
display: flex;
align-items: center;
transition: background-color 0.3s;
cursor: pointer;
}

.notification-item:hover {
background-color: #f0f0f0;
}

.notification-item:last-child {
border-bottom: none;
}

.additional-message {
display: none;
padding: 10px 15px;
background-color: #1c1f26;
border-left: 4px solid #007bff;
margin-top: 5px;
font-size: 14px;
color: #f0f0f0;
}
</style>

<div class="admin-container-wrapper">
<div class="containers">
<div class="GridLex-gap-15-wrappper">
<div class="GridLex-grid-noGutter-equalHeight">
<div class="GridLex-col-3_sm-4_xs-12">
<div class="admin-sidebar">
<div class="admin-user-item">
<div class="image">
<?php
if ($myavatar == null) {
print '<center><img class="img-circle
autofit2" src="../images/default.jpg" title="'.$myfname.'" alt="image"
/></center>';
}else{
echo '<center><img class="img-circle
autofit2" alt="image" title="'.$myfname.'"
src="data:image/jpeg;base64,'.base64_encode($myavatar).'"/></center>';
}
?>
</div>
<br>

<h4><?php echo "$myfname $mylname"; ?>


<?php if (trim($verified) === 'verified
/'): ?>
<span class="employer-status"
style="margin-left: 0px; color: blue;">
&#10004;
</span>
<?php endif; ?>
</h4>

<p class="user-role"><?php echo "$myedu"; ?


></p>
</div>

<ul class="admin-user-menu clearfix">


<li class="active">
<a href="./"><i class="fa fa-user"></i>
Profile</a>
</li>
<li class="">
<a href="peso-verification.php"><i
class="fa fa-landmark"></i> PESO Verification</a>
</li>
<li>
<a href="change-password.php"><i class="fa
fa-key"></i> Change Password</a>
</li>
<li>
<a href="training.php"><i class="fa fa-
gears"></i> Training & Workshop</a>
</li>
<li>
<a href="experience.php"><i class="fa
fa-briefcase"></i> Working Experience</a>
</li>
<li>
<a href="attachments.php"><i class="fa
fa-folder-open"></i>Attachments</a>
</li>
<li>
<a href="applied-jobs.php"><i class="fa
fa-bookmark"></i> Applied Jobs</a>
</li>
<li>
<a href="../logout.php"><i class="fa
fa-sign-out"></i> Logout</a>
</li>
</ul>
</div>
</div>

<div class="GridLex-col-9_sm-8_xs-12">
<div class="admin-content-wrapper">
<div class="admin-section-title">
<h2>Messenger</h2>
</div>
<div class="resume-list-wrapper">
<?php require
'constants/check_reply.php'; ?>
<div class="GridLex-grid">
<!-- Job Listings Column -->
<div class="GridLex-col-5_xs-12">
<div class="recent-job-wrapper"
id="job-list">
<?php
require
'../constants/db_config.php';
try {
$conn = new
PDO("mysql:host=$servername;dbname=$dbname", $username, $password);
$conn-
>setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

$stmt = $conn-
>prepare("SELECT * FROM tbl_job_applications WHERE member_no = :myid ORDER BY id
DESC LIMIT :page1, 10");
$stmt->bindParam(':myid',
$myid, PDO::PARAM_STR);
$stmt->bindParam(':page1',
$page1, PDO::PARAM_INT);
$stmt->execute();
$result = $stmt-
>fetchAll();

foreach($result as $row) {
$job_id =
$row['job_id'];
$application_status =
$row['status'];

$stmtb = $conn-
>prepare("SELECT * FROM tbl_jobs WHERE job_id = :job_id");
$stmtb-
>bindParam(':job_id', $job_id, PDO::PARAM_STR);
$stmtb->execute();
$resultb = $stmtb-
>fetchAll();

foreach($resultb as
$rowb) {
$job_title =
$rowb['title'];
$jobcountry =
$rowb['country'];
$jobtype =
$rowb['type'];
$compid =
$rowb['company'];
$stmtc = $conn-
>prepare("SELECT * FROM tbl_users WHERE member_no = :compid AND role =
'employer'");
$stmtc-
>bindParam(':compid', $compid, PDO::PARAM_STR);
$stmtc->execute();
$resultc = $stmtc-
>fetchAll();

foreach ($resultc
as $rowc) {
$compname =
$rowc['first_name'];
$complogo =
$rowc['avatar'];
}
?>
<a
href="javascript:void(0);" class="recent-job-item clearfix"
onclick="showMessenger('<?php echo htmlspecialchars($job_id); ?>', '<?php echo
htmlspecialchars($compid); ?>')">
<div
class="GridLex-grid-middle">
<div
class="GridLex-col-5_xs-10">
<div
class="job-position">

<div class="image">

<?php

if ($complogo == null) {

echo '<center><img class="autofit3" alt="image"


src="../images/blank.png"/></center>';

} else {

echo '<center><img class="autofit3" alt="image"


title="'.htmlspecialchars($compname).'" width="100" height="100"
src="data:image/jpeg;base64,'.base64_encode($complogo).'"/></center>';

}
?>

</div>

<div class="content">

<h4><?php echo htmlspecialchars($job_title); ?></h4>

<p><?php echo htmlspecialchars($compname); ?></p>

</div>
</div>
</div>
</div>
</a>
<?php
}
}
} catch(PDOException $e) {
echo "Error: " . $e-
>getMessage();
}
?>
</div>
</div>

<!-- Messenger Column -->


<div class="GridLex-col-7_xs-12">
<div id="messenger-container"
class="messenger-container" style="display: none;">
<div id="chat-header"
class="chat-header">
<h3>Conversation</h3>
</div>
<div id="message-list"
class="message-list"></div>
<div class="message-input">
<input type="text"
id="message-input" placeholder="Type a message...">
<button id="send-
button">Send</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

<style>
.messenger-container {
display: flex;
flex-direction: column;
height: 500px;
background: #ffffff;
border-radius: 10px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
overflow: hidden;
}

.chat-header {
padding: 15px;
background-color: #f1f1f1;
border-bottom: 1px solid #ddd;
}

.message-list {
flex-grow: 1;
overflow-y: auto;
display: flex;
flex-direction: column-reverse;
padding: 15px;
}

.message {
display: flex;
align-items: flex-start;
margin-bottom: 15px;
}

.message.sent {
flex-direction: row-reverse;
}

.message .avatar {
width: 40px;
height: 40px;
border-radius: 50%;
margin-right: 10px;
margin-left: 10px;
}

.message .content {
max-width: 70%;
padding: 10px;
border-radius: 18px;
font-size: 14px;
line-height: 1.4;
}

.message.sent .content {
background-color: #007bff;
color: white;
}

.message.received .content {
background-color: #f1f1f1;
color: #333;
}

.message .time {
font-size: 12px;
color: #888;
margin-top: 5px;
}

.message-input {
display: flex;
padding: 15px;
border-top: 1px solid #ddd;
}

.message-input input {
flex-grow: 1;
padding: 10px;
border: 1px solid #ddd;
border-radius: 20px;
margin-right: 10px;
}

.message-input button {
padding: 10px 15px;
background-color: #007bff;
color: white;
border: none;
border-radius: 20px;
cursor: pointer;
}

.message-input button:hover {
background-color: #0056b3;
}

.containers {
margin: 0 50px;
}

@media (max-width: 768px) {


.containers {
margin: 0 20px;
}
}

@media (max-width: 576px) {


.containers {
margin: 0 10px;
}
}
</style>

<script>
// Initialize lastMessageTimestamps globally to store the timestamps for each
job/company pair
let lastMessageTimestamps = {};

function showMessenger(jobId, compid) {


console.log("showMessenger called with Job ID:", jobId, "and Company ID:",
compid);

// Show the messenger container and update the header


$('#messenger-container').fadeIn();
$('#chat-header h3').text("Conversation for Job ID: " + jobId);

// Reset the message list


$('#message-list').empty();
// Load messages for the new job
loadMessages(jobId, compid);

// Set up event listener for sending messages


$('#send-button').off('click').on('click', function() {
sendMessage(compid, jobId);
});

// Enable message input to send by pressing 'Enter'


$('#message-input').off('keypress').on('keypress', function(e) {
if (e.which == 13) {
sendMessage(compid, jobId);
return false;
}
});

// Periodically check for new messages


setInterval(function() {
loadMessages(jobId, compid);
}, 2000);
}

function loadMessages(jobId, compid) {


const lastTimestamp = lastMessageTimestamps[`${jobId}_${compid}`] || '';

$.ajax({
url: 'fetch_messages.php',
type: 'POST',
data: { job_id: jobId, compid: compid, last_timestamp: lastTimestamp },
dataType: 'json',
success: function(response) {
if (response.status === 'success') {
const chatBox = $('#message-list');

response.messages.forEach(message => {
const messageClass = message.sender_id == response.myid ?
'sent' : 'received';
chatBox.append(`
<div class="message ${messageClass}">
<p>${escapeHtml(message.message)}</p>
<span class="time">$
{escapeHtml(message.timestamp)}</span>
</div>
`);

// Update the latest timestamp for this chat (using both


jobId and compid as the key)
lastMessageTimestamps[`${jobId}_${compid}`] =
message.timestamp;
});

// Scroll to the bottom of the chat


chatBox.scrollTop(chatBox[0].scrollHeight);
} else {
console.error("Error loading messages:", response.message);
}
},
error: function(xhr, status, error) {
console.error("AJAX error:", status, error);
}
});
}

function sendMessage(compid, jobId) {


const messageInput = $('#message-input');
const message = messageInput.val().trim();

if (message !== '') {


$.ajax({
url: 'send_message.php',
type: 'POST',
data: {
compid: compid,
job_id: jobId,
message: message
},
dataType: 'json',
success: function(response) {
if (response.status === 'success') {
messageInput.val(''); // Clear the input field

// Directly append the new message to the chat


const newMessage = response.message;
const messageClass = newMessage.sender_id == '<?php echo
$myid; ?>' ? 'sent' : 'received';
const avatarUrl = newMessage.sender_id == '<?php echo
$myid; ?>' ?
'<?php echo $myavatar ? "data:image/jpeg;base64," .
base64_encode($myavatar) : "../images/default.jpg"; ?>' :
(newMessage.sender_avatar ? "data:image/jpeg;base64," +
newMessage.sender_avatar : "../images/default.jpg");

$('#message-list').prepend(`
<div class="message ${messageClass}">
<img src="${avatarUrl}" alt="Avatar"
class="avatar">
<div class="content">
<p>${escapeHtml(newMessage.message)}</p>
<span class="time">$
{escapeHtml(newMessage.timestamp)}</span>
</div>
</div>
`);

// Scroll to the bottom of the chat


const chatBox = $('#message-list');
chatBox.scrollTop(chatBox[0].scrollHeight);
} else {
console.error("Error sending message:", response.message);
}
},
error: function(xhr, status, error) {
console.error("AJAX error: " + status + " " + error);
}
});
}
}
function escapeHtml(unsafe) {
return unsafe
.replace(/&/g, "&amp;")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/"/g, "&quot;")
.replace(/'/g, "&#039;");
}
</script>

</div>
</div>
</div>
</div>

<footer class="footer-wrapper">
<div class="main-footer">
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-9">
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="footer-about-us">
<h5 class="footer-title">About
BATCEIS</h5>
<p>BATCEIS is an online job portal that
connects job seekers with employers. Our mission is to help people find jobs and
help employers find the right talent.</p>
</div>
</div>
<div class="col-sm-6 col-md-5 mt-30-xs">
<h5 class="footer-title">Quick Links</h5>
<ul class="footer-menu clearfix">
<li><a href="../">Home</a></li>
<li><a href="../job-list.php">Job
List</a></li>
<li><a
href="../employers.php">Employers</a></li>
<li><a
href="../employees.php">Employees</a></li>
<li><a href="../contact.php">Contact
Us</a></li>
<li><a href="#">Go to top</a></li>
</ul>
</div>
</div>
</div>
<div class="col-sm-12 col-md-3 mt-30-sm">
<h5 class="footer-title">BATCEIS Contact</h5>
<p>Address : Balete, Batangas</p>
<p>Email : <a
href="mailto:[email protected]">[email protected]</a></p>
<p>Phone : <a href="tel:
+639999999999">+639999999999</a></p>
</div>
</div>
</div>
</div>
<div class="bottom-footer">
<div class="container">
<div class="row">
<div class="col-sm-4 col-md-4">
<p class="copy-right">&#169; Copyright <?php echo
date('Y'); ?> BATCEIS</p>
</div>
<div class="col-sm-4 col-md-4">
<ul class="bottom-footer-menu">
<li><a >Developed by Bossing</a></li>
</ul>
</div>
<div class="col-sm-4 col-md-4">
<ul class="bottom-footer-menu for-social">
<li><a href="<?php echo "$tw"; ?>"><i class="ri
ri-twitter" data-toggle="tooltip" data-placement="top"
title="twitter"></i></a></li>
<li><a href="<?php echo "$fb"; ?>"><i class="ri
ri-facebook" data-toggle="tooltip" data-placement="top"
title="facebook"></i></a></li>
<li><a href="<?php echo "$ig"; ?>"><i class="ri
ri-instagram" data-toggle="tooltip" data-placement="top"
title="instagram"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</footer>
</div>
</div>

<div id="back-to-top">
<a href="#"><i class="ion-ios-arrow-up"></i></a>
</div>

<script type="text/javascript" src="../js/jquery-1.11.3.min.js"></script>


<script type="text/javascript"
src="../js/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="../bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../js/bootstrap-modalmanager.js"></script>
<script type="text/javascript" src="../js/bootstrap-modal.js"></script>
<script type="text/javascript" src="../js/smoothscroll.js"></script>
<script type="text/javascript" src="../js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="../js/jquery.waypoints.min.js"></script>
<script type="text/javascript" src="../js/wow.min.js"></script>
<script type="text/javascript" src="../js/jquery.slicknav.min.js"></script>
<script type="text/javascript" src="../js/jquery.placeholder.min.js"></script>
<script type="text/javascript" src="../js/bootstrap-tokenfield.js"></script>
<script type="text/javascript" src="../js/typeahead.bundle.min.js"></script>
<script type="text/javascript"
src="../js/bootstrap3-wysihtml5.min.js"></script>
<script type="text/javascript" src="../js/bootstrap-select.min.js"></script>
<script type="text/javascript" src="../js/jquery-filestyle.min.js"></script>
<script type="text/javascript" src="../js/bootstrap-select.js"></script>
<script type="text/javascript" src="../js/ion.rangeSlider.min.js"></script>
<script type="text/javascript" src="../js/handlebars.min.js"></script>
<script type="text/javascript" src="../js/jquery.countimator.js"></script>
<script type="text/javascript"
src="../js/jquery.countimator.wheel.js"></script>
<script type="text/javascript" src="../js/slick.min.js"></script>
<script type="text/javascript" src="../js/easy-ticker.js"></script>
<script type="text/javascript" src="../js/jquery.introLoader.min.js"></script>
<script type="text/javascript" src="../js/jquery.responsivegrid.js"></script>
<script type="text/javascript" src="../js/customs.js"></script>

<script type="text/javascript" src="../js/fileinput.min.js"></script>


<script type="text/javascript" src="../js/customs-fileinput.js"></script>

<script type="text/javascript" src="../js/jquery.sheepItPlugin.js"></script>


<script type="text/javascript" src="../js/customs-sheepItPlugin.js"></script>

<script>
document.addEventListener('DOMContentLoaded', function() {
const navbarToggle = document.querySelector('.navbar-toggle');
const navbarMenu = document.querySelector('.navbar-menu');

navbarToggle.addEventListener('click', function() {
navbarMenu.classList.toggle('active');
});
});
</script>
</body>
</html>

You might also like