A Real Post

Finally.. an actual real post and not just some random test page(s).

So a little update on everything that's been happening on the site so far.

Most of the previous week has been me changing layouts and color themes... which I think I settled on for the time being. During this adventure, I ended up using the Javascript language for the first time to make the theme/color selector (in the top right corner, have fun ^_^) which... was a real pain to get working properly (mostly getting the CSS to play nice... man, I can see why many people struggle with that now). Anyway, I like how it adds a layer of client customization to the site (and bonus points, it will remember your selection for future visits ^_^).

But that trial did give me enough experience to then try my hand at making a Javascript function to automatically setup the posts list on the log page... and well, this is my first post now using that new system. Below is the function:


// Place new entry posts at the TOP of this list
const posts = [
  "2024-08-31--A_Real_Post.html",
  // These don't point to actual posts, just filler
  "2024-08-31--Template.html",
  "2024-08-27--Continued_Redesign.html",
  "2024-08-26--Example_Post.html",
  "2024-08-25--Under_Development.html"
];

function generateMenu() {
    const ul = document.getElementById('post-list');

    posts.forEach(post => {
        const [date, titleParts] = post.replace('.html', '').split('--');
        const title = titleParts.replace(/_/g, ' ');
        const formattedDate = date.split('-').join(' / ');

        const li = document.createElement('li');
        const a = document.createElement('a');
        a.href = `/html/log/posts/${post}`;
        a.innerHTML = `[ ${formattedDate} ]<br />${title}`;
        li.appendChild(a);
        ul.appendChild(li);
    });
}

window.onload = generateMenu;
      

This is placed at the top of the log.html and then builds the <ul> dynamically based on how many entries I add. Ideally, I wanted it to pull the filenames directly from the directory these posts are contained in, but that apparently requires some magic (*cough* server side access *cough*) that I don't have access to. So this is a decent compromise.

I also updated the code highlight feature so it should include Javascript as well as Lua. I may add other languages as I feel I need them (I'm currently using Highlight.js to cover my needs, since it appears to be the easiest one for me to setup).

As a side; I can't thank ChatGPT enough for it's helpful advice during this process. My background is mostly system ( Basic, C/C++ ) or gaming ( gml, Lua ) languages.. so while I have dabbled in HTML (and some CSS) before (I'm old enough to have had a GeoCities website 'back in the day'), this was back in the 3.x days... a lot of changed since HTML5 has become a thing... but thankfully, ChatGPT really helped to clarify the code and point me in the right direction when it came to figuring out what is possible and what to look into. Definitely a game changer when it comes to software development.

Heh... I'm probably overusing the <strong> tag... I will probably pull back on that in future posts... but it's soooo fun to highlight everything =P.

So what's next?

Basically, I need to make all the 404's disappear. So I plan to work on the Land of "AI" page next, followed by the About and Links pages... and of course, more posts as I go about these updates.

So with that, time to end this post... How about with another "AI" Butterfly Artwork (you'll be seeing more of these soon enough).