From 8cd72547f0f4d112be4230d23acb748342271d75 Mon Sep 17 00:00:00 2001 From: Ellpeck Date: Wed, 17 Mar 2021 03:07:12 +0100 Subject: [PATCH] added categories to the blog --- blog/src/posts.json | 18 ++++++++++++++++++ index.html | 5 ++--- node/blog.js | 7 ++++--- node/rss.js | 7 ++++++- scripts/blog.js | 42 +++++++++++++++++++++++++++++++++--------- style/style.css | 20 +++++++++++++++++++- 6 files changed, 82 insertions(+), 17 deletions(-) diff --git a/blog/src/posts.json b/blog/src/posts.json index b84f50d..5f55c2e 100644 --- a/blog/src/posts.json +++ b/blog/src/posts.json @@ -2,6 +2,7 @@ "name": "Blogs are Cool, I Think", "summary": "The first post and how I created it", "id": "blogs_are_cool", + "cat": "Miscellaneous", "date": "2/17/2019", "discuss": "https://twitter.com/Ellpeck/status/1096937184601538566", "archived": true @@ -10,6 +11,7 @@ "name": "Why You Should Mod Minecraft", "summary": "About what makes Minecraft modding great and why you should probably try it if you enjoy programming", "id": "why_you_should_mod_minecraft", + "cat": "Minecraft", "date": "2/17/2019", "discuss": "https://twitter.com/Ellpeck/status/1097177774337462272" }, @@ -17,6 +19,7 @@ "name": "Kindling the Reading Flame", "summary": "About the Kindle, Harry Potter and what I like and dislike about them", "id": "reading", + "cat": "Miscellaneous", "date": "3/22/2019", "discuss": "https://twitter.com/Ellpeck/status/1109102077911973888" }, @@ -24,6 +27,7 @@ "name": "Small Projects", "summary": "Why creating a small, unplanned project is sometimes good for you", "id": "small_projects", + "cat": "Programming", "date": "5/1/2019", "discuss": "https://twitter.com/Ellpeck/status/1123651624201871360" }, @@ -31,6 +35,7 @@ "name": "About Cross-Platform and Motivation", "summary": "How moving from Java to C# taught me how horrible it is to create a cross-platform application with little to no knowledge or documentation", "id": "cross_platform_trainwreck", + "cat": "Programming", "date": "7/6/2019", "discuss": "https://twitter.com/Ellpeck/status/1147502654236573697", "archived": true @@ -39,6 +44,7 @@ "name": "Big Projects", "summary": "How a once small project I even created a post about turned into the first game I'm selling: Foe Frenzy", "id": "big_projects", + "cat": "Programming", "date": "9/15/2019", "discuss": "https://twitter.com/Ellpeck/status/1173247686654517249" }, @@ -46,6 +52,7 @@ "name": "How to make a Rock Bottom mod", "summary": "My adventures back into a game I stopped working on about two years ago and how I start on a mod for it", "id": "rock_bottom_mod", + "cat": "Programming", "date": "10/3/2019", "discuss": "https://twitter.com/Ellpeck/status/1180092634410487808" }, @@ -53,6 +60,7 @@ "name": "Java Tutorial, Part 1: Hello World", "summary": "The first part of my post series for programming beginners where I explain how to write code in Java.", "id": "java_1", + "cat": "Java Tutorials", "date": "10/10/2019", "discuss": "https://twitter.com/Ellpeck/status/1182080078827737088" }, @@ -60,6 +68,7 @@ "name": "Java Tutorial, Part 2: Intro to Conditions and Loops", "summary": "The second part of my post series for programming beginners. This one is all about conditions and loops.", "id": "java_2", + "cat": "Java Tutorials", "date": "10/10/2019", "discuss": "https://twitter.com/Ellpeck/status/1182354544707198976" }, @@ -67,6 +76,7 @@ "name": "Java Tutorial, Part 3: (Static) Methods", "summary": "In this Java tutorial for beginners, we cover what (static) methods, parameters and return types are.", "id": "java_3", + "cat": "Java Tutorials", "date": "10/11/2019", "discuss": "https://twitter.com/Ellpeck/status/1182775985885847558" }, @@ -74,6 +84,7 @@ "name": "Java Tutorial, Part 4: Classes and Objects", "summary": "In this Java tutorial for beginners, we cover the basics of creating classes with a constructor, some fields and some methods and creating objects of them.", "id": "java_4", + "cat": "Java Tutorials", "date": "10/14/2019", "discuss": "https://twitter.com/Ellpeck/status/1183857460660101133" }, @@ -81,6 +92,7 @@ "name": "Java Tutorial, Part 5: Things I Left Out So Far", "summary": "In this Java tutorial for beginners, we cover some shorthands, some more data types, the difference between pass-by-reference and pass-by-value, null, as well as arrays and lists.", "id": "java_5", + "cat": "Java Tutorials", "date": "10/17/2019", "discuss": "https://twitter.com/Ellpeck/status/1184894859133509632" }, @@ -88,6 +100,7 @@ "name": "Lows", "summary": "About depression and what it feels like when I don't know what to do with myself", "id": "lows", + "cat": "Miscellaneous", "date": "10/20/2019", "discuss": "https://twitter.com/Ellpeck/status/1186028260838334471", "archived": true @@ -96,6 +109,7 @@ "name": "Java Tutorial, Part 6: Inheritance", "summary": "In this Java tutorial for beginners, we cover classes extending other classes and the instanceof keyword.", "id": "java_6", + "cat": "Java Tutorials", "date": "10/31/2019", "discuss": "https://twitter.com/Ellpeck/status/1189904487722487809" }, @@ -103,6 +117,7 @@ "name": "Java Tutorial, Part 7: Overriding Methods", "summary": "In this Java tutorial for beginners, we cover overriding methods, calling superclass methods and toString().", "id": "java_7", + "cat": "Java Tutorials", "date": "11/26/2019", "discuss": "https://twitter.com/Ellpeck/status/1199339701640945664" }, @@ -110,12 +125,14 @@ "name": "But Do You Really Care?", "summary": "On taking a break from social media", "id": "but_do_you_really_care", + "cat": "Miscellaneous", "date": "5/6/2020" }, { "name": "Oh God, Please Don't Port Actually Additions", "summary": "As Actually Additions celebrates its fifth birthday, I break down what I like and dislike about it.", "id": "actually_additions", + "cat": "Minecraft", "date": "5/10/2020", "discuss": "https://twitter.com/Ellpeck/status/1259600490377216002" }, @@ -123,6 +140,7 @@ "name": "The Future of Actually Additions", "summary": "Not wanting to accept the fate of Actually Additions, someone has come to its rescue. 1.16, here we come?", "id": "future_actually_additions", + "cat": "Minecraft", "date": "11/23/2020", "discuss": "https://twitter.com/Ellpeck/status/1330938597785169925" } diff --git a/index.html b/index.html index d04f549..6eb3cd3 100644 --- a/index.html +++ b/index.html @@ -169,13 +169,12 @@ Occasionally I enjoy writing stuff. So here's some of the stuff I've written. Just click on any of the headers to open the post. Alternatively, you can subscribe to this blog using RSS, Atom or JSON.

+
The content that should be here is dynamically generated. Please enable JavaScript if you see this.
-
- The content that should be here is dynamically generated. Please enable JavaScript if you see this. -
+
diff --git a/node/blog.js b/node/blog.js index 8211944..c14d534 100644 --- a/node/blog.js +++ b/node/blog.js @@ -41,10 +41,10 @@ fs.readFile(folder + "index.html", function (_, html) { nav += 'Back to Main Page'; let last = getAdjacentPost(json, i, -1); if (last) - nav += 'Previous Post'; + nav += 'Previous ' + post.cat + ' Post'; let next = getAdjacentPost(json, i, 1); if (next) - nav += 'Next Post'; + nav += 'Next ' + post.cat + ' Post'; document.getElementById("nav-items").innerHTML = nav; let c = ""; @@ -72,12 +72,13 @@ fs.readFile(folder + "index.html", function (_, html) { }); function getAdjacentPost(json, index, move) { + let cat = json[index].cat; while (true) { index += move; let post = json[index]; if (!post) break; - if (!post.archived) + if (post.cat == cat && !post.archived) return post; } } \ No newline at end of file diff --git a/node/rss.js b/node/rss.js index c1fd846..305181b 100644 --- a/node/rss.js +++ b/node/rss.js @@ -45,8 +45,13 @@ function createFeed(callback) { description: post.summary, content: html, date: date, - published: date + published: date, + category: [{ + name: post.cat + }] }); + if (feed.categories.indexOf(post.cat) < 0) + feed.addCategory(post.cat); if (i == 0) { callback(feed); diff --git a/scripts/blog.js b/scripts/blog.js index 69d9b75..58acca4 100644 --- a/scripts/blog.js +++ b/scripts/blog.js @@ -4,23 +4,38 @@ $("#blog-archive-button").on("click", function () { $(this).html((archive.is(":visible") ? "Hide" : "Show") + " archived posts"); }); +let blogData; $.ajax({ dataType: "json", url: "blog/src/posts.json", cache: false, success: function (json) { - let list = $('#blog-list'); - let archive = $('#blog-archive'); - list.html(""); - archive.html(""); - for (let i = json.length - 1; i >= 0; i--) { - var obj = json[i]; + blogData = json; + populateBlog("All"); + forceToAnchor(); + } +}); + +function populateBlog(cat) { + let archive = $('#blog-archive'); + let list = $('#blog-list'); + let cats = $('#blog-cats'); + archive.html(""); + list.html(""); + cats.html(""); + + addCatButton(cats, "All"); + for (let i = blogData.length - 1; i >= 0; i--) { + var obj = blogData[i]; + addCatButton(cats, obj.cat); + if (cat == "All" || obj.cat == cat) { let p = ""; p += '
'; p += '
'; - p += '

' + obj.name + '

'; + p += '

' + obj.name + '

'; p += '
' + obj.summary + '
'; p += '' + obj.date + ""; + p += '' + obj.cat + ""; p += '
'; if (obj.archived) { archive.append(p); @@ -28,6 +43,15 @@ $.ajax({ list.append(p); } } - forceToAnchor(); } -}); \ No newline at end of file +} + +function addCatButton(cats, cat) { + let catAnchor = `blog-cat-${cat.toLowerCase().replace(" ", "_")}`; + if (!$(`#${catAnchor}`).length) { + cats.append(``); + $(`#${catAnchor}`).on('click', function () { + populateBlog(cat); + }); + } +} \ No newline at end of file diff --git a/style/style.css b/style/style.css index 710d63b..66bb64c 100644 --- a/style/style.css +++ b/style/style.css @@ -56,6 +56,12 @@ body { bottom: 15px; } +.blog-cat { + position: absolute; + right: 20px; + top: 15px; +} + .social-button { width: 200px; margin: 10px; @@ -76,6 +82,11 @@ body { text-align: center; } +.blog-cat-button { + padding: 0px; + margin-right: 10px; +} + #blog-archive-button { display: block; position: relative; @@ -123,7 +134,8 @@ body { margin-top: 15px; } -.blog-summary { +.blog-summary, +.blog-title { width: 85%; } @@ -255,4 +267,10 @@ blockquote { right: 10px; bottom: 5px; } + + .blog-cat { + position: absolute; + right: 10px; + top: 5px; + } } \ No newline at end of file