I recently found out that this is a thing!

This commit is contained in:
Ellpeck 2019-11-20 22:17:58 +01:00
parent 9235dfde09
commit a22cc88b01
7 changed files with 38 additions and 42 deletions

View file

@ -29,40 +29,39 @@ function createBlogPages(folder) {
let json = JSON.parse(data); let json = JSON.parse(data);
for (let i = 0; i < json.length; i++) { for (let i = 0; i < json.length; i++) {
let post = json[i]; let post = json[i];
let id = post["id"]; fs.readFile(folder + "blog/" + post.id + ".md", function (_, content) {
fs.readFile(folder + "blog/" + id + ".md", function (_, content) {
let dom = new JSDOM(template); let dom = new JSDOM(template);
var document = dom.window.document; var document = dom.window.document;
document.title += " - " + post["name"]; document.title += " - " + post.name;
document.querySelector('meta[property="og:title"]').setAttribute("content", post["name"]); document.querySelector('meta[property="og:title"]').setAttribute("content", post.name);
document.querySelector('meta[name="description"]').setAttribute("content", post["summary"]); document.querySelector('meta[name="description"]').setAttribute("content", post.summary);
document.querySelector('meta[property="og:description"]').setAttribute("content", post["summary"]); document.querySelector('meta[property="og:description"]').setAttribute("content", post.summary);
var nav = ""; var nav = "";
nav += '<a class="nav-item nav-link" href="/#blog">Back to Main Page</a>'; nav += '<a class="nav-item nav-link" href="/#blog">Back to Main Page</a>';
if (i > 0) if (i > 0)
nav += '<a class="nav-item nav-link" href="/blog-' + json[i - 1]["id"] + '">Previous Post</a>'; nav += '<a class="nav-item nav-link" href="/blog-' + json[i - 1].id + '">Previous Post</a>';
if (i < json.length - 1) if (i < json.length - 1)
nav += '<a class="nav-item nav-link" href="/blog-' + json[i + 1]["id"] + '">Next Post</a>'; nav += '<a class="nav-item nav-link" href="/blog-' + json[i + 1].id + '">Next Post</a>';
document.getElementById("nav-items").innerHTML = nav; document.getElementById("nav-items").innerHTML = nav;
var c = ""; var c = "";
c += '<div class="list-display rounded">'; c += '<div class="list-display rounded">';
c += '<div class="blog-isolated">' c += '<div class="blog-isolated">'
c += '<h1>' + post["name"] + '</h1>'; c += '<h1>' + post.name + '</h1>';
c += '<div id="blog-post-' + id + '">' c += '<div id="blog-post-' + post.id + '">'
c += converter.makeHtml(content.toString()); c += converter.makeHtml(content.toString());
c += '</div>'; c += '</div>';
c += '<span class="text-muted project-status blog-isolated-status">' + post["date"] + "</span>"; c += '<span class="text-muted project-status blog-isolated-status">' + post.date + "</span>";
var discussLink = post["discuss"]; var discussLink = post.discuss;
if (discussLink) if (discussLink)
c += '<a href="' + discussLink + '" class="blog-discuss" id="blog-discuss-' + id + '">Discuss this post</a>' c += '<a href="' + discussLink + '" class="blog-discuss" id="blog-discuss-' + post.id + '">Discuss this post</a>'
c += '</div></div>'; c += '</div></div>';
document.getElementById("main").innerHTML = c; document.getElementById("main").innerHTML = c;
let html = dom.serialize(); let html = dom.serialize();
fs.writeFile(folder + "blog-" + id + ".html", html, function (_, _) {}); fs.writeFile(folder + "blog-" + post.id + ".html", html, function (_, _) {});
}); });
} }
}); });

View file

@ -47,15 +47,14 @@ function createFeed(callback) {
let json = JSON.parse(data); let json = JSON.parse(data);
for (let i = json.length - 1; i >= 0; i--) { for (let i = json.length - 1; i >= 0; i--) {
let post = json[i]; let post = json[i];
let id = post["id"]; let date = new Date(post.date);
let date = new Date(post["date"]);
fs.readFile(__dirname + "/../blog/" + id + ".md", function (_, content) { fs.readFile(__dirname + "/../blog/" + post.id + ".md", function (_, content) {
let html = converter.makeHtml(content.toString()); let html = converter.makeHtml(content.toString());
feed.addItem({ feed.addItem({
title: post["name"], title: post.name,
link: "https://ellpeck.de/blog-" + id, link: "https://ellpeck.de/blog-" + post.id,
description: post["summary"], description: post.summary,
content: html, content: html,
date: date, date: date,
published: date published: date

View file

@ -52,7 +52,7 @@ function refreshSitemap(folder) {
for (let post of json) { for (let post of json) {
sitemap.add({ sitemap.add({
url: "/blog-" + post["id"] url: "/blog-" + post.id
}); });
} }

View file

@ -44,8 +44,8 @@ const questions = [{
a: 'German, English, Java, JavaScript, C# and a bit of C, HTML and CSS.' a: 'German, English, Java, JavaScript, C# and a bit of C, HTML and CSS.'
}, },
{ {
"q": "How do you make games?", q: "How do you make games?",
"a": "I usually use the .NET-based framework <a href=\"http://www.monogame.net/\">MonoGame</a> together with some libraries to make it a bit easier, including my own library, MLEM, which you can read about in the <a href=\"#projects\">Projects</a> section." a: "I usually use the .NET-based framework <a href=\"http://www.monogame.net/\">MonoGame</a> together with some libraries to make it a bit easier, including my own library, MLEM, which you can read about in the <a href=\"#projects\">Projects</a> section."
}, },
{ {
q: 'What\'s your favorite programming language?', q: 'What\'s your favorite programming language?',
@ -80,8 +80,8 @@ const questions = [{
let a = ''; let a = '';
for (question of questions) { for (question of questions) {
a += '<p>'; a += '<p>';
a += '<strong>Q: ' + question["q"] + '</strong><br>'; a += '<strong>Q: ' + question.q + '</strong><br>';
a += '<strong>A:</strong> ' + question["a"]; a += '<strong>A:</strong> ' + question.a;
a += '</p>'; a += '</p>';
} }
$('#about-list').html(a); $('#about-list').html(a);

View file

@ -7,14 +7,13 @@ $.ajax({
list.html(""); list.html("");
for (let i = json.length - 1; i >= 0; i--) { for (let i = json.length - 1; i >= 0; i--) {
var obj = json[i]; var obj = json[i];
let id = obj["id"];
let p = ""; let p = "";
p += '<div class="card bg-light blog-entry rounded-0">'; p += '<div class="card bg-light blog-entry rounded-0">';
p += '<div class="card-body">'; p += '<div class="card-body">';
p += '<h2 class="card-title"><a class="blog-button" href="/blog-' + id + '">' + obj["name"] + '</a></h2>'; p += '<h2 class="card-title"><a class="blog-button" href="/blog-' + obj.id + '">' + obj.name + '</a></h2>';
p += '<div class="card-text text-muted blog-summary">' + obj["summary"] + '</div>'; p += '<div class="card-text text-muted blog-summary">' + obj.summary + '</div>';
p += '<span class="text-muted project-status">' + obj["date"] + "</span>"; p += '<span class="text-muted project-status">' + obj.date + "</span>";
p += '</div></div>'; p += '</div></div>';
list.append(p); list.append(p);
} }

View file

@ -62,17 +62,16 @@ let p = '';
for (project of projects) { for (project of projects) {
p += '<div class="card bg-light project rounded-0">'; p += '<div class="card bg-light project rounded-0">';
p += '<div class="card-body">'; p += '<div class="card-body">';
p += '<img class="project-image" src="res/projects/' + project["icon"] + '.png" alt="">'; p += '<img class="project-image" src="res/projects/' + project.icon + '.png" alt="">';
p += '<h4 class="card-title">' + project["name"] + '</h4>'; p += '<h4 class="card-title">' + project.name + '</h4>';
p += '<p class="card-text">' + project["desc"] + '</p>'; p += '<p class="card-text">' + project.desc + '</p>';
if (project["status"]) if (project.status)
p += '<span class="text-muted project-status">' + project["status"] + '</span>'; p += '<span class="text-muted project-status">' + project.status + '</span>';
let links = project["links"]; if (project.links) {
if (links) { for (let name in project.links) {
for (let name in links) { p += '<a href="' + project.links[name] + '" class="card-link btn ' + (dark ? "btn-outline-light" : "btn-outline-info") + ' rounded-0">' + name + '</a>';
p += '<a href="' + links[name] + '" class="card-link btn ' + (dark ? "btn-outline-light" : "btn-outline-info") + ' rounded-0">' + name + '</a>';
} }
} }

View file

@ -37,12 +37,12 @@ const socials = [{
let s = ''; let s = '';
for (social of socials) { for (social of socials) {
s += '<a class="btn ' + (dark ? "btn-dark" : "btn-light") + ' social-button rounded-0" href="' + social["link"] + '"">'; s += '<a class="btn ' + (dark ? "btn-dark" : "btn-light") + ' social-button rounded-0" href="' + social.link + '"">';
let icon = social["name"].toLowerCase(); let icon = social.name.toLowerCase();
if (dark && social["darkIcon"]) if (dark && social.darkIcon)
icon += '_dark'; icon += '_dark';
s += '<img class="social-image" src="res/social/' + icon + '.png" alt="">'; s += '<img class="social-image" src="res/social/' + icon + '.png" alt="">';
s += social["name"]; s += social.name;
s += '</a>' s += '</a>'
} }
$('#social-list').html(s); $('#social-list').html(s);