var evaluatedTags = "";
const clamp = (val, min, max) => Math.min(Math.max(val, min), max)

function postList(n = 0) {
    fetch("/data/posts.json")
	.then((response) => response.json())
	.then((data) => {
	    n = clamp(n, 0, data.posts.length);
	    if (n < 1) {
		n = data.posts.length;
	    }

	    // i ❤ for loops
	    for (var i = n - 1; i >= 0; i--) {
		console.log("dkfjlaafjsdk" + i)
		postCard(data.posts[i]);
	    }
	});
}

function postCard(post) {
    var blogContainer = document.getElementById("blog-container");
    
    var title = post.title;
    var date = post.date;
    var author = post.author;
    var tags = post.tags;
    var thumbnail = post.thumbnail;
    var id = post.id;

    evaluatedTags = "";
    tags.forEach(createTags)

    var template = `
                    <div class="card" tabindex="9999">
                        <img src="${thumbnail}"
                            alt="">
                        <div>
                            <div class="flex-container-normal chip-container"> 
				${evaluatedTags}
			    </div>
                            <a href="/blog/post.html?post=${id}" class="link">${title}</a>
                            <p>${date}</p>
                        </div>
                    </div>
	`

    blogContainer.innerHTML += template;
}

function createTags(tag) {
    evaluatedTags += `<span class="chip">${tag}</span>`
}

function getUrlVars() {
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for (var i = 0; i < hashes.length; i++) {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}

// DEPENDENCIES
// * /scripts/scroll.js
function loadPost(n) {
    const md = markdownit({
	'html': true
    })

    fetch("/data/posts.json")
	.then((response) => response.json())
	.then((data) => {
	    var post = data.posts[n];
	    
	    var banner = document.getElementById("banner");
	    var title = document.getElementById("title");
	    var date = document.getElementById("date");
	    var author = document.getElementById("author");
	    var tags = document.getElementById("tag-container");
	    var content = document.getElementById("content");

	    banner.src = post.banner;
	    title.innerHTML = post.title;
	    date.innerHTML = post.date;
	    author.innerHTML = post.author;
	    post.tags.forEach(createTags);
	    tags.innerHTML = evaluatedTags;

	    fetch(post.path)
		.then((response) => response.text())
		.then((data) => {
		    data = data.replaceAll("-+-+-+", `
<section class="normal-section">
<div class="center-grid">
<div class="div-sizing" id="content">
`)
		    data = data.replaceAll("+-+-+-", `
</div>
</div>
</section>
`)

		    console.log(data);


		    var result = md.render(data);
		    content.innerHTML = result;
		}).then(() => addNodes());
	});
}