/**
 * Simple tab router for screen navigation
 */

var Router = (function() {
    var tabs = null;
    var screens = null;
    var currentScreen = 'control';

    function init() {
        tabs = document.querySelectorAll('.tab');
        screens = document.querySelectorAll('.screen');

        tabs.forEach(function(tab) {
            tab.addEventListener('click', function() {
                if (tab.classList.contains('disabled')) return;
                var screenName = tab.getAttribute('data-screen');
                navigate(screenName);
            });
        });

        // Navigate to screen from URL hash on init (skip disabled screens)
        var hash = window.location.hash.replace('#', '');
        var targetTab = hash && document.querySelector('.tab[data-screen="' + hash + '"]');
        if (hash && document.getElementById('screen-' + hash) && targetTab && !targetTab.classList.contains('disabled')) {
            navigate(hash);
        }
    }

    function navigate(screenName) {
        currentScreen = screenName;

        screens.forEach(function(screen) {
            screen.classList.remove('active');
        });

        var targetScreen = document.getElementById('screen-' + screenName);
        if (targetScreen) {
            targetScreen.classList.add('active');
        }

        tabs.forEach(function(tab) {
            tab.classList.remove('active');
            if (tab.getAttribute('data-screen') === screenName) {
                tab.classList.add('active');
            }
        });

        window.location.hash = screenName;
    }

    function getCurrentScreen() {
        return currentScreen;
    }

    return {
        init: init,
        navigate: navigate,
        getCurrentScreen: getCurrentScreen
    };
})();
