website/js/viewPost.js

if(window.location['pathname'] == "/post.html"){
    loadPost();
}

// return the value of the get parameter with the given name
function getParameter(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)");
    var results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

async function loadPost() {
    let id =  getParameter("id");

    let header = document.createElement("jl-header");
    let footer = document.createElement("jl-footer");
    let content = document.createElement("div");

    if(id == null) {
        content.innerHTML = "<h1>404 - Post not found</h1>";
    } else {
        var graphql = JSON.stringify({
        query: 'query($postID: String!) {blogPost(id: $postID) {content title}}',
        variables: {
            "postID": id
        }
        })
        var requestOptions = {
        method: 'POST',
        body: graphql,
        headers: { 'Content-Type': 'application/json' }
        };
        let post = (await (await fetch("/API/graphql.php", requestOptions)).json()).data.blogPost;
        content.innerHTML = post["content"];
        document.title = post["title"] + " - Jonas Leder";

        header.setAttribute("data-title", post["title"]);
    }
    content.id = "content";

    document.body.appendChild(header);
    document.body.appendChild(content);
    document.body.appendChild(footer);
}