'use strict';

const Router = (function () {
    function Router(routes) {
        this.routes = routes;
        this.currentPage = null;
        this.currentRoute = null;
    }

    Router.prototype.navigate = function (route) {
        if (this.currentRoute === route) return;

        const PageClass = this.routes[route] || this.routes['home'];

        if (this.currentPage && this.currentPage.destroy) {
            this.currentPage.destroy();
        }

        this.currentPage = new PageClass();
        this.currentPage.mount();
        this.currentRoute = route;

        // Update active nav button
        this.updateActiveNav(route);
    };

    Router.prototype.updateActiveNav = function (route) {
        const navButtons = document.querySelectorAll('[data-route]');
        for (let i = 0; i < navButtons.length; i++) {
            if (navButtons[i].getAttribute('data-route') === route) {
                navButtons[i].classList.add('active');
            } else {
                navButtons[i].classList.remove('active');
            }
        }
    };

    Router.prototype.start = function () {
        const self = this;

        // Setup button navigation
        const navButtons = document.querySelectorAll('[data-route]');
        for (let i = 0; i < navButtons.length; i++) {
            navButtons[i].addEventListener('click', function () {
                const route = this.getAttribute('data-route');
                self.navigate(route);
            });
        }

        // Initial route
        this.navigate('home');
    };

    return Router;
})();
