script.js

function popup() {
    var popup = document.getElementById("myPopup");
    popup.classList.toggle("show");
}

document.addEventListener('DOMContentLoaded', function () {
    var mainNavLinks = document.querySelectorAll('#main-nav a');
    var currentLocation = window.location.pathname;

    mainNavLinks.forEach(function (link) {
        if (currentLocation.includes(link.getAttribute('href'))) {
            mainNavLinks.forEach(function (otherLink) {
                otherLink.parentElement.classList.remove('active');
            });
            link.parentElement.classList.add('active');
        }
    });

    var workerPins = document.querySelectorAll('.worker-pin');

    workerPins.forEach(function (pin) {
        pin.addEventListener('mouseenter', function () {
            var tooltip = document.createElement('div');
            tooltip.className = 'tooltip';
            tooltip.innerText = 'Worker Name';
            pin.appendChild(tooltip);

            tooltip.style.left = `${pin.offsetWidth / 2 - tooltip.offsetWidth / 2}px`;
            tooltip.style.top = `${-tooltip.offsetHeight - 5}px`;
            tooltip.style.visibility = 'visible';
            tooltip.style.opacity = '1';
        });

        pin.addEventListener('mouseleave', function () {
            var tooltip = pin.querySelector('.tooltip');
            if (tooltip) {
                tooltip.remove();
            }
        });
    });

    var workersJson = [
        { name: 'Alice Smith', expertise: 'Electrician' },
        { name: 'Bob Johnson', expertise: 'Plumber' },
        { name: 'Charlie Williams', expertise: 'Carpenter' },
        { name: 'Dana Brown', expertise: 'Painter' },
        { name: 'Jack Dawson', expertise: 'Gardener' },
        { name: 'James Johnson', expertise: 'Carpenter' },
        { name: 'Ronnie Williams', expertise: 'Carpenter' },
        { name: 'Brain Greene', expertise: 'AC Repair' }
    ];

    function filterWorkers(query) {
        query = query.toLowerCase();
        return workersJson.filter(function (worker) {
            return worker.name.toLowerCase().includes(query) || worker.expertise.toLowerCase().includes(query);
        });
    }

    function populateWorkerList(workers) {
        var workerListElement = document.getElementById('worker-list');
        if (workerListElement) {
            workerListElement.innerHTML = '';

            if (workers.length === 0) {
                workerListElement.textContent = 'No workers found.';
            } else {
                workers.forEach(function (worker) {
                    var workerCard = document.createElement('div');
                    workerCard.className = 'worker-card';

                    var nameElement = document.createElement('div');
                    nameElement.className = 'worker-info';
                    nameElement.textContent = 'Name: ' + worker.name;

                    var expertiseElement = document.createElement('div');
                    expertiseElement.className = 'worker-info';
                    expertiseElement.textContent = 'Expertise: ' + worker.expertise;

                    workerCard.appendChild(nameElement);
                    workerCard.appendChild(expertiseElement);

                    workerListElement.appendChild(workerCard);
                });
            }
        }
    }

    var searchInput = document.getElementById('worker-search-input');
    if (searchInput) {
        populateWorkerList(workersJson);

        searchInput.addEventListener('keyup', function () {
            var filteredWorkers = filterWorkers(this.value);
            populateWorkerList(filteredWorkers);
        });
    }
});

var workerForm = document.getElementById('worker-info-form');
if (workerForm) {
    workerForm.addEventListener('submit', function (event) {
        event.preventDefault();
        alert("Information saved successfully!");
        workerForm.reset();
    });
}

var accountForm = document.getElementById('account-info-form');
if (accountForm) {
    accountForm.addEventListener('submit', function (event) {
        event.preventDefault();
        alert("Information saved successfully!");
        accountForm.reset();
    });
}