Skip to content

Commit

Permalink
update blog index sorting
Browse files Browse the repository at this point in the history
  • Loading branch information
@hannahilea
hannahilea committed Nov 4, 2024
1 parent 77b5dc2 commit b1e2438
Show file tree
Hide file tree
Showing 5 changed files with 149 additions and 132 deletions.
4 changes: 4 additions & 0 deletions .vscode/settings.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,10 @@
"match": "blog/__template/.*$",
"cmd": "echo 'A __template file has been saved ${file}.'; julia build-blogs/run.jl"
},
{
"match": "build-blogs/.*$",
"cmd": "echo 'A file in `build-blogs` has been saved ${file}.'; julia build-blogs/run.jl"
},
]
}
}
14 changes: 11 additions & 3 deletions blog/__template/index.template.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,8 +28,9 @@ <h1 class="title">Blog</h1>
<table>
<thead>
<tr>
<th class="sort desc" data-sort="date" data-default-order='desc'>Date</th>
<th class="sort" data-sort="title">Title</th>
<!-- <th class="sort desc" data-sort="date-pretty">Date pretty</th> -->
<th class="sort desc" data-sort="date-raw" data-default-order='desc'>Date</th>
<th class="sort" data-sort="title-raw">Title</th>
</tr>
</thead>
<!-- IMPORTANT, class="list" have to be at tbody -->
Expand All @@ -38,7 +39,14 @@ <h1 class="title">Blog</h1>
</tbody>
</table>
</div>
<script src="table-niceties.js"></script>
<!-- <script src="table-niceties.js"></script> -->
<script>
var options = {
valueNames: ['date-raw', 'date-pretty', 'title', 'title-raw', 'tags']
};

var blogList = new List('post-list', options);
</script>

<div>
<a href="/rss.xml" rel="subscribe-rss">
Expand Down
251 changes: 129 additions & 122 deletions blog/index.html
View file
Original file line number Diff line number Diff line change
@@ -1,132 +1,139 @@
<!--Auto-generated! Make changes in index.template.html, not this file-->
<!doctype html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Hannah Robertson's blog" />
<meta name="author" content="Hannah Robertson" />
<link rel="shortcut icon" type="image/png" href="../assets/img/favicon.png" />
<link rel="stylesheet" type="text/css" href="../assets/css/main.css" />
<script src="../assets/scripts/list.min.js"></script>

<title>@hannahilea: blog</title>
</head>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Hannah Robertson's blog" />
<meta name="author" content="Hannah Robertson" />
<link rel="shortcut icon" type="image/png" href="../assets/img/favicon.png" />
<link rel="stylesheet" type="text/css" href="../assets/css/main.css" />
<script src="../assets/scripts/list.min.js"></script>

<body>
<div class="main-container index-page">
<nav class="navbar" role="navigation">
@hannahilea:
<a href=".." class="nav-link">home</a> | <a href="../projects" class="nav-link">projects</a> |
<a href="../blog" class="nav-link">blog</a>
</nav>
<h1 class="title">Blog</h1>
<title>@hannahilea: blog</title>
</head>

<div id="post-list">
<table>
<thead>
<tr>
<th class="sort desc" data-sort="date" data-default-order="desc">Date</th>
<th class="sort" data-sort="title">Title</th>
</tr>
</thead>
<!-- IMPORTANT, class="list" have to be at tbody -->
<tbody class="list">
<tr>
<td class="date">31 Oct 2024</td>
<td class="date" hidden>2024-10-31</td>
<td class="title">
<a class="blog-url" href="./seagull-fliposcope-animation-with-cuttle">Scurrying seagull: CAD-assisted Fliposcope animation</a>
<!-- <p class="blog-tags">Tags: project-writeup, art, cuttle, cad, programming, split-flap </p> -->
</td>
</tr>
<body>
<div class="main-container index-page">
<nav class="navbar" role="navigation">
@hannahilea:
<a href=".." class="nav-link">home</a> |
<a href="../projects" class="nav-link">projects</a> |
<a href="../blog" class="nav-link">blog</a>
</nav>
<h1 class="title">Blog</h1>

<tr>
<td class="date">18 Oct 2024</td>
<td class="date" hidden>2024-10-18</td>
<td class="title">
<a class="blog-url" href="./clapping-music-2"
><strong><em>Clapping Music</em></strong> for one flip-disc display: Byte and variations</a
>
<!-- <p class="blog-tags">Tags: project-writeup, electromechanical-display, raspberry-pi, music, programming, hardware, software, julia </p> -->
</td>
</tr>

<tr>
<td class="date">11 Oct 2024</td>
<td class="date" hidden>2024-10-11</td>
<td class="title">
<a class="blog-url" href="./meme-making">Quick ’n hacky meme making, for fun and no profit</a>
<!-- <p class="blog-tags">Tags: tutorial, joy </p> -->
</td>
</tr>

<tr>
<td class="date">27 Sep 2024</td>
<td class="date" hidden>2024-09-27</td>
<td class="title">
<a class="blog-url" href="./cuttle-obsession">Obsessed with Cuttle: Parametric CAD for prototyping, producing, and procrastinating</a>
<!-- <p class="blog-tags">Tags: project-writeup, cuttle, cad, programming, prototyping, javascript, creative-coding, makerspace </p> -->
</td>
</tr>

<tr>
<td class="date">21 Sep 2024</td>
<td class="date" hidden>2024-09-21</td>
<td class="title">
<a class="blog-url" href="./make-a-list">First things first: Make a list</a>
<!-- <p class="blog-tags">Tags: musings, devtips, DDD </p> -->
</td>
</tr>

<tr>
<td class="date">20 Sep 2024</td>
<td class="date" hidden>2024-09-20</td>
<td class="title">
<a class="blog-url" href="./driven-developments">Dopamine-driven development (DDD), spite-driven development (SDD), and other DDs</a>
<!-- <p class="blog-tags">Tags: musings, brainstorm, techspeak </p> -->
</td>
</tr>

<tr>
<td class="date">18 Sep 2024</td>
<td class="date" hidden>2024-09-18</td>
<td class="title">
<a class="blog-url" href="./future-blog-posts">Titles of blog posts I might never write</a>
<!-- <p class="blog-tags">Tags: brainstorm, metawriting </p> -->
</td>
</tr>

<tr>
<td class="date">14 Sep 2024</td>
<td class="date" hidden>2024-09-14</td>
<td class="title">
<a class="blog-url" href="./clapping-music-for-flip-disc-displays"
><strong><em>Clapping Music</em></strong> for two flip-disc displays</a
>
<!-- <p class="blog-tags">Tags: project-writeup, electromechanical-display, raspberry-pi, music, programming, hardware, software, julia </p> -->
</td>
</tr>
<div id="post-list">
<table>
<thead>
<tr>
<!-- <th class="sort desc" data-sort="date-pretty">Date pretty</th> -->
<th class="sort desc" data-sort="date-raw" data-default-order='desc'>Date</th>
<th class="sort" data-sort="title-raw">Title</th>
</tr>
</thead>
<!-- IMPORTANT, class="list" have to be at tbody -->
<tbody class="list">
<tr>
<td class="date-pretty">31 Oct 2024</td>
<td class="date-raw" hidden>2024-10-31</td>
<td class="title-raw" hidden>Scurrying seagull: CAD-assisted Fliposcope animation</a></td>
<td class="title"><a class="blog-url" href="./seagull-fliposcope-animation-with-cuttle">Scurrying seagull: CAD-assisted Fliposcope animation</a>
<!-- <p class="blog-tags">Tags: project-writeup, art, cuttle, cad, programming, split-flap </p> -->
</td>
</tr>

<tr>
<td class="date-pretty">18 Oct 2024</td>
<td class="date-raw" hidden>2024-10-18</td>
<td class="title-raw" hidden><strong><em>Clapping Music</em></strong> for one flip-disc display: Byte and variations</a></td>
<td class="title"><a class="blog-url" href="./clapping-music-2"><strong><em>Clapping Music</em></strong> for one flip-disc display: Byte and variations</a>
<!-- <p class="blog-tags">Tags: project-writeup, electromechanical-display, raspberry-pi, music, programming, hardware, software, julia </p> -->
</td>
</tr>

<tr>
<td class="date-pretty">11 Oct 2024</td>
<td class="date-raw" hidden>2024-10-11</td>
<td class="title-raw" hidden>Quick ’n hacky meme making, for fun and no profit</a></td>
<td class="title"><a class="blog-url" href="./meme-making">Quick ’n hacky meme making, for fun and no profit</a>
<!-- <p class="blog-tags">Tags: tutorial, joy </p> -->
</td>
</tr>

<tr>
<td class="date-pretty">27 Sep 2024</td>
<td class="date-raw" hidden>2024-09-27</td>
<td class="title-raw" hidden>Obsessed with Cuttle: Parametric CAD for prototyping, producing, and procrastinating</a></td>
<td class="title"><a class="blog-url" href="./cuttle-obsession">Obsessed with Cuttle: Parametric CAD for prototyping, producing, and procrastinating</a>
<!-- <p class="blog-tags">Tags: project-writeup, cuttle, cad, programming, prototyping, javascript, creative-coding, makerspace </p> -->
</td>
</tr>

<tr>
<td class="date-pretty">21 Sep 2024</td>
<td class="date-raw" hidden>2024-09-21</td>
<td class="title-raw" hidden>First things first: Make a list</a></td>
<td class="title"><a class="blog-url" href="./make-a-list">First things first: Make a list</a>
<!-- <p class="blog-tags">Tags: musings, devtips, DDD </p> -->
</td>
</tr>

<tr>
<td class="date-pretty">20 Sep 2024</td>
<td class="date-raw" hidden>2024-09-20</td>
<td class="title-raw" hidden>Dopamine-driven development (DDD), spite-driven development (SDD), and other DDs</a></td>
<td class="title"><a class="blog-url" href="./driven-developments">Dopamine-driven development (DDD), spite-driven development (SDD), and other DDs</a>
<!-- <p class="blog-tags">Tags: musings, brainstorm, techspeak </p> -->
</td>
</tr>

<tr>
<td class="date-pretty">18 Sep 2024</td>
<td class="date-raw" hidden>2024-09-18</td>
<td class="title-raw" hidden>Titles of blog posts I might never write</a></td>
<td class="title"><a class="blog-url" href="./future-blog-posts">Titles of blog posts I might never write</a>
<!-- <p class="blog-tags">Tags: brainstorm, metawriting </p> -->
</td>
</tr>

<tr>
<td class="date-pretty">14 Sep 2024</td>
<td class="date-raw" hidden>2024-09-14</td>
<td class="title-raw" hidden><strong><em>Clapping Music</em></strong> for two flip-disc displays</a></td>
<td class="title"><a class="blog-url" href="./clapping-music-for-flip-disc-displays"><strong><em>Clapping Music</em></strong> for two flip-disc displays</a>
<!-- <p class="blog-tags">Tags: project-writeup, electromechanical-display, raspberry-pi, music, programming, hardware, software, julia </p> -->
</td>
</tr>

<tr>
<td class="date-pretty">17 May 2024</td>
<td class="date-raw" hidden>2024-05-17</td>
<td class="title-raw" hidden>This website’s structure: A meta post</a></td>
<td class="title"><a class="blog-url" href="./site-structure">This website’s structure: A meta post</a>
<!-- <p class="blog-tags">Tags: project-writeup, webdev, programming, metawriting </p> -->
</td>
</tr>

</tbody>
</table>
</div>
<!-- <script src="table-niceties.js"></script> -->
<script>
var options = {
valueNames: ['date-raw', 'date-pretty', 'title', 'title-raw', 'tags']
};

<tr>
<td class="date">17 May 2024</td>
<td class="date" hidden>2024-05-17</td>
<td class="title">
<a class="blog-url" href="./site-structure">This website’s structure: A meta post</a>
<!-- <p class="blog-tags">Tags: project-writeup, webdev, programming, metawriting </p> -->
</td>
</tr>
</tbody>
</table>
</div>
<script src="table-niceties.js"></script>
var blogList = new List('post-list', options);
</script>

<div>
<a href="/rss.xml" rel="subscribe-rss">
<!-- Source: https://img.shields.io/badge/rss-F88900?style=for-the-badge&logo=rss&logoColor=white -->
<img class="badge" src="../assets/img/rss-logo-styled.svg" alt="Subscribe to @hannahilea RSS feed"
/></a>
</div>
<div>
<a href="/rss.xml" rel="subscribe-rss">
<!-- Source: https://img.shields.io/badge/rss-F88900?style=for-the-badge&logo=rss&logoColor=white -->
<img class="badge" src="../assets/img/rss-logo-styled.svg" alt="Subscribe to @hannahilea RSS feed" /></a>
</div>
</body>
</div>
</body>

</html>
5 changes: 0 additions & 5 deletions blog/table-niceties.js
View file

This file was deleted.

7 changes: 5 additions & 2 deletions build-blogs/run.jl
View file
Original file line number Diff line number Diff line change
Expand Up @@ -128,13 +128,16 @@ function generate_blog_index(; overwrite_existing=false, template=blog_index_tem
end
metadata = sort(metadata; by=(m) -> m.date_str, rev=true)

# See blog/__template/index.template.html for how this
# fits into table
blog_strs = map(metadata) do m
date_pretty = Dates.format(Date(m.date_str), dateformat"d u yyyy")
tags = replace(m.tags, "," => ", ")
return """
<tr>
<td class="date">$(date_pretty)</td>
<td class="date" hidden>$(m.date_str)</td>
<td class="date-pretty">$(date_pretty)</td>
<td class="date-raw" hidden>$(m.date_str)</td>
<td class="title-raw" hidden>$(m.title)</a></td>
<td class="title"><a class="blog-url" href="$(m.url)">$(m.title)</a>
<!-- <p class="blog-tags">Tags: $tags </p> -->
</td>
Expand Down

0 comments on commit b1e2438

Please sign in to comment.