112 lines
4.3 KiB
JavaScript
112 lines
4.3 KiB
JavaScript
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 () {
|
|
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();
|
|
}
|