71 lines
2.6 KiB
JavaScript
71 lines
2.6 KiB
JavaScript
//----------------------------NOTIFICATION BELL-------------------------------//
|
|
document.addEventListener("DOMContentLoaded", function() {
|
|
const bell = document.getElementById("bell");
|
|
const notificationDropdown = document.getElementById("notificationDropdown");
|
|
|
|
let notifications = [];
|
|
|
|
// Function to add a notification
|
|
function addNotification(message) {
|
|
if (notifications.length >= 10) {
|
|
notifications.pop(); // Remove the oldest notification if there are already 10
|
|
}
|
|
notifications.unshift(message); // Add new notification to the beginning
|
|
updateDropdown();
|
|
}
|
|
|
|
function updateDropdown() {
|
|
notificationDropdown.innerHTML = '';
|
|
notifications.forEach(notification => {
|
|
const notificationElement = document.createElement("a");
|
|
notificationElement.href = "#";
|
|
notificationElement.textContent = notification;
|
|
notificationDropdown.appendChild(notificationElement);
|
|
});
|
|
}
|
|
|
|
// Event listener for the bell icon
|
|
bell.addEventListener("click", function() {
|
|
const isDropdownVisible = notificationDropdown.style.display === "block";
|
|
notificationDropdown.style.display = isDropdownVisible ? "none" : "block";
|
|
});
|
|
|
|
// Function to add click event listeners to buttons
|
|
function addClickListeners(buttons, label) {
|
|
buttons.forEach(button => {
|
|
button.addEventListener("click", function() {
|
|
addNotification(`${label} button with ID ${button.id} clicked`);
|
|
});
|
|
});
|
|
}
|
|
|
|
// Add click event listeners to all relevant buttons
|
|
const modifyButtons = document.querySelectorAll(".btn_modify");
|
|
const deleteButtons = document.querySelectorAll(".btn_delete");
|
|
const submitButtons = document.querySelectorAll("input[type='submit']");
|
|
|
|
addClickListeners(modifyButtons, "Modify");
|
|
addClickListeners(deleteButtons, "Delete");
|
|
addClickListeners(submitButtons, "Submit");
|
|
});
|
|
|
|
|
|
|
|
|
|
//-----------------------SETTINGS FUNCTION -----------------------------//
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
var settingsButton = document.getElementById('settingsButton');
|
|
var dropdownContent = document.getElementById('dropdownContent');
|
|
|
|
settingsButton.addEventListener('click', function() {
|
|
dropdownContent.style.display = dropdownContent.style.display === 'block' ? 'none' : 'block';
|
|
});
|
|
|
|
window.addEventListener('click', function(event) {
|
|
if (event.target !== settingsButton) {
|
|
dropdownContent.style.display = 'none';
|
|
}
|
|
});
|
|
});
|