Router
    .add('territory/manager/(.*)/(.*)', function (type, id) {
        Territory_Manager.init(type, id);
        pageActive()
        routerScroll()
    })
    .add('territory/editor/(.*)/(.*)', function (type, id) {
        Editor.init(type, id);
        pageActive()
        routerScroll()
    })
    .add('territory/card/(.*)/(.*)', function (type, id) {
        Card.init(type, id);
        pageActive()
        routerScroll()
    })
    .add('territory', function () {
        Territory.init();
        pageActive('territory')
        routerScroll()
    })
    .add('sheeps/(.*)', function (name) {
        Sheeps.init(name);
        routerScroll();
        pageActive('sheeps')
    })
    .add('sheeps', function () {
        Sheeps.init();
        routerScroll();
        pageActive('sheeps')
    })
    .add('home', function () {
        Home.init();
        pageActive('home')
        routerScroll()
    })
    .add('schedule', function () {
        Options.init();
        routerScroll();
        pageActive('schedule')
    })
    .add('stand', function () {
        Stand.init();
        routerScroll();
        pageActive('stand')
    })
    .add('options', function () {
        Options.init();
        routerScroll();
        pageActive('options')
    })
    .add('constructor', function () {
        Constructor.init();
        routerScroll();
        pageActive()
    })
    .add(function () {
        page_404();
        routerScroll();
        pageActive();
    })


function routerScroll() {
    if (!history.state) return;
    window.scroll(0, history.state.position);
}

function pageActive(element) {
    let nav = document.getElementsByTagName("nav")[0];
    let dots = nav.getElementsByTagName("li");

    for (i = 0; i < dots.length; i++) {
        dots[i].children[0].setAttribute('data-state', '');
    }
    if (element) document.getElementById(`nav-${element}`).setAttribute('data-state', 'active')

}