appController

var AppController = (function() {
    // Get Templates
    var tmpls = {},
        controllers = {};

    function getController(name) {
        return controllers[name];
    }

    function getTemplate(tmplName) {
        if (!tmpls[tmplName]) {
            var tmpl = document.getElementById(tmplName + '_tmpl');
            if (tmpl) {
                tmpls[tmplName] = tmpl.innerHTML;
            }
        }
        return tmpls[tmplName];
    }

    function getUrlPage(address) {
        return address
            .split('/')
            .pop()
            .split('.')[0];
    }

    function gotoPage(address) {
        var page = getUrlPage(address);
        if (page !== currentPage) {
            showPage(page);
            history.pushState(
                { page: page },
                page.slice(0, 1).toUpperCase() + page.slice(1),
                address
            );
        }
    }

    function showPage(page) {
        var templateSrc = getTemplate(page),
            template = Handlebars.compile(templateSrc);
        mainElement.innerHTML = template({});
        //update the title
        document.head.getElementsByTagName('title')[0].textContent =
            page.slice(0, 1).toUpperCase() + page.slice(1);
        initPage(page);
    }

    function initPage(page) {
        switch (page.toLowerCase()) {
            case 'register':
                getController('register').initRegister();
                break;
            case 'login':
                getController('login').initLogin();
                break;
        }
    }

    var currentPage = getUrlPage(location.href),
        mainElement = document.querySelector('main'),
        navigations = document.querySelectorAll('nav ul a:not([href="#top"])');

    Array.from(navigations).forEach(function(link) {
        link.addEventListener('click', function(event) {
            event.preventDefault();
            gotoPage(this.href);
        });
    });

    window.addEventListener('popstate', function() {
        showPage(getUrlPage(location.href));
    });

    return {
        addController: function (name, controller) {
            controllers[name] = controller;
        },
        getController: getController
    };
})();