function main(page) {
    window.currPage = page;
    window.currOpacity = 1;
    document.getElementById("about-link").attributes.removeNamedItem("href");
    document.getElementById("games-link").attributes.removeNamedItem("href");
    document.getElementById("blog-link").attributes.removeNamedItem("href");
    document.getElementById("about-link").onclick = function () { return openPage("about"); };
    document.getElementById("games-link").onclick = function () { return openPage("games"); };
    document.getElementById("blog-link").onclick = function () { return openPage("blog"); };
    addBlogposts();
    var search = window.location.search;
    if (search != "") {
        setBlogTextOnSearch(search);
    }
    window.onpopstate = function () {
        var page = window.location.pathname.split("/").filter(function (f) { return f != ""; })[0];
        var search = window.location.search.slice(0, -1);
        if (page == "blogtext") {
            setBlogTextOnSearch(search);
        }
        openPage(page || "about", page, false);
    };
}
function openPage(page, new_url, renew_history) {
    if (new_url === void 0) { new_url = null; }
    if (renew_history === void 0) { renew_history = true; }
    if (page == window.currPage) {
        return;
    }
    slideOpacity(function () {
        var link = document.getElementById(window.currPage + "-link");
        if (link) {
            link.children[0].className = "";
            link.children[0].className = "active";
        }
        document.getElementById(window.currPage).className = "hiddenarea";
        window.currPage = page;
        document.getElementById(page).style.opacity = "0";
        document.getElementById(page).className = "";
        var target = new_url || page;
        var targetPg = "/" + target;
        if (target == "about") {
            target = "";
            targetPg = "";
        }
        ;
        if (renew_history) {
            window.history.pushState(target, target, targetPg + "/");
        }
        document.title = "Teascade | " + page;
        document.getElementsByClassName("stuffarea")[0].scrollTop = 0;
        slideOpacity(function () {
        }, 1.5);
    }, -1.5);
}
function slideOpacity(callback, step) {
    var currElem = document.getElementById(window.currPage);
    var id = setInterval(function () {
        window.currOpacity += 0.02 * step;
        currElem.style.opacity = "" + window.currOpacity;
        if ((window.currOpacity <= 0 && step < 0) || (window.currOpacity >= 1 && step > 0)) {
            clearInterval(id);
            callback();
        }
    }, 2);
}
function addBlogposts() {
    window.blogpostData = JSON.parse(window.blogpostDataStr);
    var div = document.getElementById("blog");
    var blogpostData = window.blogpostData.sort(function (a, b) { return b.time - a.time; });
    blogpostData.forEach(function (val) {
        var title = document.createElement("h2");
        title.className = "blogtitle";
        title.innerHTML = val.title;
        var timestamp = document.createElement("p");
        timestamp.className += "timestamp";
        timestamp.innerHTML = new Date(val.time).toUTCString();
        title.appendChild(timestamp);
        div.appendChild(title);
        title.onclick = function () {
            openPage("blogtext", "blogtext?id=" + val.source.slice(0, -5));
            setBlogText(val.source, new Date(val.time).toUTCString());
        };
    });
}
function setBlogTextOnSearch(search) {
    search = search.slice(1, -1);
    var parts = search.split("=");
    if (parts[0] == "id") {
        var timestamp = void 0;
        for (var i in window.blogpostData) {
            console.log(window.blogpostData[i].source);
            console.log(search + ".html");
            if (window.blogpostData[i].source == parts[1] + ".html") {
                timestamp = new Date(window.blogpostData[i].time).toUTCString();
            }
        }
        setBlogText(parts[1] + ".html", timestamp);
    }
}
function setBlogText(source, time) {
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == XMLHttpRequest.DONE) {
            if (xmlhttp.status == 200) {
                document.getElementById("blogtext").innerHTML = xmlhttp.responseText;
                var timestamp = document.createElement("p");
                timestamp.className += "timestamp";
                timestamp.innerHTML = time;
                document.getElementById("blogtext").appendChild(timestamp);
            }
        }
    };
    xmlhttp.open("GET", "/blogposts/" + source, true);
    xmlhttp.send();
}