Add latest comments to latest lane on main landing page

Update lastest episodes section to new layout
Initial formatting of swim lanes on main landing page
2025-07-16 10:42:05 -04:00 · 2025-07-15 21:45:31 -04:00 · 2025-07-15 21:06:33 -04:00 · 2025-07-14 20:51:41 -04:00 · 2025-07-14 20:13:06 -04:00
9 changed files with 425 additions and 568 deletions
--- a/GETTING_STARTED.md
+++ b/GETTING_STARTED.md
@@ -111,7 +111,7 @@ file are found in the comments within the file.

 Any database supported by the Perl:DBI and Perl::DBD modules can be used with 
 the site-generator program. Currently the hpr_generator project works with 
-an SQLite database.
+a MySQL or SQLite database.

 Find the [DBI] section of the file. It should look like the following

@@ -146,6 +146,26 @@ The hpr.db section of the driver option `dbi:SQLite:hpr.db` is the path
 to the sqlite file. The default assumes the hpr.db file is located in the same
 directory as the site-generator. 

+### MySQL
+
+Remove the comment character from the start of the database, driver, 
+user, and password option lines:
+
+ ```
+# Configuration settings for MySQL
+database: mysql
+driver: dbi:mysql:database=hpr_hpr:hostname=localhost 
+user: hpr-generator
+password: *********
+```
+
+This assumes that the MySQL database service is available at the localhost 
+hostname, that the database name (hpr_hpr) is the database created from 
+the hpr.sql dump file or manually created by you, that the user (hpr-generator) 
+was added by you and has read rights to the hpr_hpr database, and that the 
+password (replace ********* with the actual password) matches the password set 
+for the hpr-generator database user.
+
 ## Configuring the website for viewing locally

 For HTML links to work when viewing the files on your local machine using the 
--- a/README.md
+++ b/README.md
@@ -15,6 +15,15 @@ Static web page generator for the Hacker Public Radio website.
 		2.  Run `./utils/update-hpr.sh`
 	* SQLite v3.8.3 or greater is recommended. CTE WITH clauses are used in some template queries. Must convert WITH
 	  clauses to sub-queries when using earlier versions of SQLite.
+* With MySQL
+	* Create database hpr_hpr in the MySQL server from HPR dump file.
+		- ``sudo mysql --host=localhost < hpr.sql``
+	* Create a user that will be used by the site-generator.
+		- Suggested username: hpr-generator
+		- ``CREATE USER 'hpr-generator'@'localhost' IDENTIFIED BY '<password>';``
+	* Limit the user's privileges to EXECUTE and SELECT
+		- ``GRANT SELECT ON hpr_hpr.* TO 'hpr-generator'@'localhost';``
+		- ``GRANT EXECUTE ON `hpr_hpr`.* TO 'hpr-generator'@'localhost';``
 * Install the needed Perl modules using preferred method (distribution packages, CPAN, etc.)
    * Getopt::Long
    * Pod::Usage
@@ -26,7 +35,7 @@ Static web page generator for the Hacker Public Radio website.
    * Template::Plugin::HTML::Strip
    * DBI
    * Tie::DBI
-    * DBD::SQLite
+    * DBD::SQLite or DBD::mysql
    * Date::Calc
    * Text::CSV_XS
    * HTML::Entities
@@ -67,6 +76,4 @@ and add the label "**Feature Request**".
 * gordons
 * Ken Fallon
 * norrist
-* Paul Jewell
-

--- a/public_html/css/hpr.css
+++ b/public_html/css/hpr.css
@@ -14,21 +14,95 @@ https://creativecommons.org/publicdomain/
 *		-- https://css-tricks.com/linearly-scale-font-size-with-css-clamp-based-on-the-viewport/
 */

+:root {
+	--background-primary: #dfdfdf;
+	--text-primary: #4d4d4d; /* HPR Grey */
+	--background-secondary: #4d4d4d;
+	--text-secondary: #dfdfdf;
+	--link-primary: #247ba0;
+	--link-secondary: #7fc5e2;
+	--font-family-hpr: Verdana, Arial, Helvetica, sans-serif; /* 1em/1.5 OpenDyslexic, */;
+
+  /* screen breakpoints */
+	--for-phone-only: 599px;
+    --for-tablet-portrait-up: 600px;
+    --for-tablet-landscape-up: 900px;
+	--for-desktop-up: 1200px;
+    --for-big-desktop-up: 1800px; 
+
+
+}
+
 html {
 	margin: 0;
 	padding: 0;
-	display: block;
+	display: flex;
 }
-
 body {
-	display: block;
-	background: #dfdfdf;
+	display: flex;
+	flex-direction: column;
+	justify-content: flex-start;
+	background-color: var(--background-primary);
+	color: var(--text-primary);
 	font-size: 1rem; /* fallback for browsers that don't support the clamp function) */
 	font-size: clamp(1rem, 15px + 0.3vw, 1.07rem);
+	font-family: var(--font-family-hpr);
 	margin: 0;
 	padding: 0;
 }

+body > nav {
+	background-color: var(--background-secondary);
+	color: var(--text-secondary);
+}
+body > nav a {
+	color: var(--link-secondary);
+}
+body > nav ul {
+	background-color: inherit;
+	color: inherit;
+	margin: 0;
+	padding: 0.25rem;
+}
+body > nav ul li {
+	display: inline-block;
+	background-color: inherit;
+	color: inherit;
+	line-height: 1.5;
+	margin: 0;
+	padding: 0;
+	padding-right: clamp(0.5rem, -0.25rem + 3vw, 2.5rem);
+}
+body > header {
+	display: flex;
+	flex-direction: row;
+	flex-flow: wrap;
+	justify-content: space-between;
+	padding: 0.25rem;
+	background-image: url("/images/main-header-background.png");
+}
+body > header > * {
+	margin: 0;
+	padding: 0;
+	flex: 1 1 auto;
+}
+body > main {
+	padding: 0.25rem;
+}
+body > footer {
+	background-color: var(--background-secondary);
+	color: var(--text-secondary);
+	padding: 0.25rem;
+}
+body > footer hr:first-child {
+	display: none;
+	margin: 0;
+	padding: 0;
+}
+body > footer a {
+	color: var(--link-secondary);
+}
+
 div,
 h1,
 h2,
@@ -49,9 +123,9 @@ fieldset,
 input,
 textarea,
 blockquote {
-	font-family: Verdana, Arial, Helvetica, sans-serif; /* 1em/1.5 OpenDyslexic, */
-	color: #4D4D4D; /* HPR Grey */
-	background: white;
+	font-family: 	inherit;
+	color: inherit;
+	background: inherit;
 }

 h1 {
@@ -60,7 +134,8 @@ h1 {
 }

 h2,
-article * h1 {
+article * h1,
+section > header:first-child {
 	font-size: 1.45rem;
 	margin: 1.25rem 0 0.75rem 0;
 }
@@ -92,6 +167,7 @@ li {

 a {
 	text-decoration: none;
+	color: var(--link-primary);
 }

 a:hover {
@@ -124,395 +200,29 @@ p.meta span label {
 	font-weight: bold;
 }

-article>p,
-#maincontent>p {
-	line-height: 1.45;
-}
+div.lane {
+	display: flex;
+	flex-direction: row;

-article#previous_five_weeks>* {
-	line-height: 1.35;
-	margin: 0;
-	padding: 0;
 }
-
-article#previous_five_weeks>h3 {
-	margin: 1.5rem 0 0.5rem 0;
-}
-
-#container {
-	max-width: 58rem;
-	margin: 0.25rem;
-	padding: 0.75rem; /* fallback for browsers that don't support the clamp function) */
-	padding: clamp(0.75rem, -0.25rem + 3vw, 2.0rem);
-	overflow: hidden;
-	background: white;
-	border: thin solid #4D4D4D;
-}
-
-.shadow {
-	-moz-box-shadow:    2px 3px 6px 3px #675958;
-	-webkit-box-shadow: 2px 3px 6px 3px #675958;
-	box-shadow:         2px 3px 6px 3px #675958;
-}
-
-.thick_bar {
-	background-color: #4D4D4D;
-	color: white;
+a.lane-button {
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	margin: 0.5rem;
 	padding: 0.5rem;
-	margin: 1rem 0 1rem 0;
-}
-
-img#hprlogo {
-	max-width: 20vw;
-	padding-right: clamp(0.75rem, -0.25rem + 3vw, 1.5rem);
-	float: left;
-	margin-top: 1rem;
-	margin-bottom: clamp(0.75rem, -0.25rem + 2vw, 1.5rem);
-}
-
-#hpr_banner {
-	/* display: inline-block; */
-	border: 0;
-	margin: 0 0 0rem 0;
-	padding: 0;
-}
-
-#hpr_banner p {
-	margin: 0 0 0.5rem 0;
-}
-
-#hpr_banner h1#sitename {
-	font-size: clamp(1.44rem, -1rem + 3vw, 2rem);
-	letter-spacing: 0.06rem;
-	margin: 0;
-	padding: 0;
-}
-
-#hpr_banner h2 {
-	font-size: clamp(0.74rem, -1rem + 2vw, 1rem);
-	font-weight: 510;
-	margin: 0 0 1rem 0;
-	padding: 0;
-}
-
-#hpr_banner h3 {
-	font-size: 1rem;
-	font-weight: normal;
-	margin: 0 0 0.5rem 0;
-	padding: 0;
-}
-
-header>hr {
-	clear: both;
-}
-
-#accessible_menu {
-	font-size: smaller;
-}
-
-/* The main navigation menu */
-header>nav.menu {
-	display: block;
-	background-color: #4D4D4D; /* HPR Grey */
-	text-align: Left;
-	clear: both; /* Forces the menu to appear after the HPR Header block */
-	padding: 0;
-	margin: 0;
-}
-
-header>nav.menu ul {
-	margin: 0;
-	padding: 0.5rem;
-	background-color: inherit;
-	color: white;
-}
-
-header>nav.menu ul li {
-	display: inline-block;
-	background-color: inherit;
-	color: inherit;
-	line-height: 1.5;
-	margin: 0;
-	padding: 0;
-	padding-right: clamp(0.5rem, -0.25rem + 3vw, 2.5rem);
-}
-
-header>nav.menu ul li a {
-	color: white;
-	text-decoration: none;
-	display: block;
-	padding: 0.25rem 0;
-}
-
-header>nav.menu ul li a:hover {
-	border-bottom: thin solid white;
-	padding: 0.15rem 0;
-	-webkit-transition: 0.3s ease-in-out color;
-	-moz-transition: 0.3s ease-in-out color;
-	transition: 0.3s ease-in-out color;
-}
-
-header>nav.menu ul li a:visited {
-	color: #EDEDED;
-}
-
-a:active,
-header>nav.menu ul li a:active {
-	color: red;
-}
-
-pre {
-	/* Add background, border and scrollbar to <pre> */
-	background: #eee;
-	border: 1px solid #ddd;
-	overflow: auto;
-	clear: both;
-	padding: 0.5rem
-}
-
-code {
-	background: #eee;
-	border-radius: 0.2rem;
-	font-size: 0.95rem;
-}
-
-pre code {
-	padding-right: 0.5rem;
-	font-size: 0.85rem;
-	line-height: 1;
-}
-
-pre.comment {
-	white-space: pre-wrap;
-	line-height: 1.2rem;
-}
-
-table.hosts {
-	font-size: clamp(0.82rem, -0.25rem + 3vw, 1.0rem);
-	width: 100%;
-	background: white;
-	margin: 0 auto;
-	border-collapse: collapse;
-	display: inline-table;
+	border-width: 5px;
+	border-color: var(--link-primary);
+	border-style: solid;
+	border-radius: 5px;

 }

-table#t01,
-table.hosts {
-	display: block;
-	overflow-x: auto;
-}
-
-table#t01 tbody,
-table.hosts tbody {
-	display: table;
-}
-
-table#t01 tr:nth-child(even),
-table.hosts tr:nth-child(even) {
-	background-color: #cccccc;
-	border-bottom: thick solid white;
-}
-
-table#t01 tr:nth-child(odd),
-table.hosts tr:nth-child(odd) {
-	background-color: white;
-	border-bottom: thick solid white;
-}
-
-table.hosts tr td img {
-	vertical-align: middle;
-	max-height: 80px;
-}
-
-table.hosts th:first-child,
-table.hosts td:first-child {
-	min-width: 60px;
-	max-width: 80px;
-	text-align: left;
-	height: 62px;
-}
-
-table.hosts th:nth-child(2),
-table.hosts td:nth-child(2) {
-	text-align: left;
-	padding-left: clamp(0.15rem, -0.25rem + 3vw, 0.5rem);
-}
-
-table.hosts th:nth-child(3),
-table.hosts td:nth-child(3),
-table.hosts th:nth-child(4),
-table.hosts td:nth-child(4) {
-	width: 10%;
-	padding-right: clamp(0.10rem, -0.25rem + 3vw, 1rem);
-}
-
-body>div>footer {
-	margin-top: 2rem;
-}
-
-footer #more_info nav.column {
-	clear: both;
-	font-size: 0.9rem;
-	margin-left: 0.5rem;
-}
-
-footer #more_info nav.column ul li {
-	float: left;
-	margin-right: 1.5rem;
-	margin-bottom: 1rem;
-}
-
-footer #more_info nav.column h2 {
-	font-size: 1.35rem;
-	margin-top: 0.5rem;
-}
-
-footer h1.thick_bar {
-	clear: left;
-	font-size: 1.15rem;
-}
-
-footer #copyright {
-	font-size: smaller;
-	margin-left: 0.5rem;
-	margin-right: 0.5rem;
-}
-
-fieldset>table,
-fieldset>table thead,
-fieldset>table tbody,
-fieldset>table tr,
-fieldset>table th,
-fieldset>table td,
-fieldset>table td input,
-fieldset>table td textarea {
-	display: block;
-	font-size: 1rem;
-}
-
-fieldset>table {
-	width: calc(100vw + -16vw + -1rem);
-	max-width: 100%;
-}
-
-fieldset>table td input,
-fieldset>table td textarea {
-	width: calc(100vw + -16vw + -1.5rem);
-	max-width: 100%;
-	border: thin solid #DFDFDF;
-	margin-bottom: 0.5rem;
-	padding: 0.5rem;
-}
-
-fieldset>table td select {
-	margin-bottom: 0.5rem;
-	padding: 0.25rem;
-}
-
-fieldset>table td input[type="radio"] {
-	display: initial;
-	width: initial;
-	margin-bottom: 0.5rem;
-}
-
-fieldset>input {
-	background: #4D4D4D;
-	color: white;
-	font-weight: 600;
-	padding: 0.5rem;
-	border: thin solid #DFDFDF;
-	border-radius: 0.2rem;
-}
-
-@media only screen and (min-width: 58rem) {
-	#container {
-		margin: 0.5rem auto;
+@media (min-width: 900px) {
+	body { 
+		background-color: white; 
 	}
-
-	.shadow {
-		-moz-box-shadow:    1px 2px 5px 2px #675958;
-		-webkit-box-shadow: 1px 2px 5px 2px #675958;
-		box-shadow:         1px 2px 5px 2px #675958;
-	}
-
-	img#hprlogo {
-		margin-bottom: 1.5rem;
-	}
-
-	#hpr_banner {
-		float: left;
-	}
-
-	#hpr_banner h1#sitename {
-		font-size: 2rem;
-	}
-
-	#hpr_banner h2 {
-		font-size: 1rem;
-	}
-
-	header>hr {
-		clear: right;
-	}
-
-	table.hosts td:first-child {
-		height: 80px;
-	}
-
-	footer #more_info nav.column {
-		clear: none;
-		float: left;
-		width: 19.5%;
-		margin-left: 0;
-	}
-
-	footer #more_info nav.column:first-child {
-		margin-left: 0.5rem;
-	}
-
-	footer #more_info nav.column ul li {
-		float: none;
-		margin-bottom: 0.5rem;
-	}
-
-	fieldset>table,
-	fieldset>table thead,
-	fieldset>table tbody,
-	fieldset>table tr,
-	fieldset>table th,
-	fieldset>table td,
-	fieldset>table td input,
-	fieldset>table td textarea {
-		display: revert;
-		width: revert;
-	}
-
-	fieldset>table tr {
-		vertical-align: baseline;
-	}
-
-	fieldset>table tr:nth-child(3) {
-		vertical-align: top;
-	}
-
-	fieldset>table tr:nth-child(3) td:first-child {
-		padding-top: 0.5rem;
-	}
-
-	fieldset>table tr:nth-last-child(3) td:first-child {
-		padding-top: 1rem;
-	}
-
-	fieldset>table tr:nth-last-child(2) {
-		vertical-align: top;
-	}
-
-	fieldset>table tr:nth-last-child(2) td:first-child {
-		padding-top: 0.75rem;
-	}
-
-	fieldset>table td input[type="radio"] {
-		margin-top: 1.5rem;
+	#qr_code > img {
+		max-height: 195px;
 	}
 }
--- a/public_html/images/Richard_Querin_atomic-plain.svg
+++ b/public_html/images/Richard_Querin_atomic-plain.svg
--- a/public_html/images/qr_code_logo.png
+++ b/public_html/images/qr_code_logo.png
--- a/12
+++ b/12
@@ -56,9 +56,19 @@ Perl Template Toolkit.
        * SQLite v3.8.3 or greater is recommended. CTE WITH clauses are used in some template queries.
          Must convert WITH clauses to sub-queries when using earlier versions of SQLite.

+        With MySQL
+        * Create database hpr_hpr in the MySQL server from HPR dump file.
+                - sudo mysql --host=localhost < hpr.sql
+        * Create a user that will be used by the site-generator.
+                - Suggested username: hpr-generator
+                - CREATE USER 'hpr-generator'@'localhost' IDENTIFIED BY '<password>';
+        * Limit the user's privileges to EXECUTE and SELECT
+                - GRANT SELECT ON hpr_hpr.* TO 'hpr-generator'@'localhost';
+                - GRANT EXECUTE ON `hpr_hpr`.* TO 'hpr-generator'@'localhost';
+
        Install the needed Perl modules using preferred method (distribution packages, CPAN, etc.)
                * Config::Std
-                * DBD::SQLite
+                * DBD::SQLite or DBD:mysql
                * DBI
                * Data::Dumper
                * Date::Calc
--- a/templates/content-index.tpl.html
+++ b/templates/content-index.tpl.html
@@ -23,11 +23,6 @@
 <!--% END %-->
 <!--% after_html %-->
 <!--% END %-->
-<hr>
-  <article>
-    <header>
-        <h3>Welcome to HPR, the Community Podcast</h3>
-    </header>
 	<!--% days_till_next_episode = 0 %-->
 	<!--% USE DBI(constants.driver) %-->
 	<!--% USE date %-->
@@ -40,44 +35,99 @@
 	<!--% days_till_next_episode = calc.Delta_Days(now.0,now.1,now.2,slot_date.0,slot_date.1,slot_date.2) %-->

 	<!--% delta = date.calc.N_Delta_YMD(2005,9,19, date.format(date.now, '%Y'),date.format(date.now, '%m'),date.format(date.now, '%d')) %-->
-	<p>We started producing shows as <a href="<!--% absolute_path(baseurl) %-->eps/index.html#twt_episodes"><em>Today with a Techie</em></a> on 2005-09-19, <!--% delta.0 %--> years, <!--% delta.1 %--> months, <!--% delta.2 %--> days ago. Our shows are produced by <a href="<!--% absolute_path(baseurl) %-->correspondents/index.html">listeners</a> like you and can be on any <a href="<!--% absolute_path(baseurl) %-->eps/index.html">topics</a> that <strong>"are of interest to <a href="https://en.wikipedia.org/wiki/hacker_(hobbyist)">hackers</a>"</strong>. If you listen to HPR then please consider contributing one show a year. If you <a href="<!--% absolute_url(baseurl) %-->about.html#so_you_want_to_record_a_podcast">record</a> your show now it could be <a href="<!--% hub_baseurl %-->calendar.php">released</a> in <strong><!--% days_till_next_episode %--></strong> days.</p>
-  </article>
-  <!--% display_call_for_shows() %-->
-  <hr>
+	<section id="welcome">
+		<header>Welcome</header>
+		<p>Hacker Public Radio is a podcast that releases shows every weekday Monday to Friday. The shows are contributed by the public and can be on any topic that is of interest to hackers, makers, hobbyists, etc.</p>
+		<div id="call_for_shows">
+			<!--% display_call_for_shows() %-->
+		</div>
+  </section>
+  <section id="podcast_lane">
+	  <header>Podcast</header>
+	  <div class="lane">
+	  <a class="lane-button" href="<!--% absolute_path(baseurl) %-->about.html#recording_a_podcast">
+		  <img src="<!--% absolute_path(baseurl) %-->" alt="Microphone icon">
+		  Record
+	  </a>
+	  <a class="lane-button" href="https://hub.hackerpublicradio.org/calendar.php">
+		  <img src="" alt="Calendar icon">
+		  Schedule
+	  </a>
+	  <a class="lane-button" href="<!--% absolute_path(baseurl) %-->syndication.html">
+		  <img src="<!--% absolute_path(baseurl) %-->" alt="RSS icon">
+		 Subscribe 
+	  </a>
+	  <a class="lane-button" href="<!--% absolute_path(baseurl) %-->eps/index.html">
+		  <img src="" alt="Speaker icon">
+		 Listen 
+	  </a>
+	</div>
+  </section>
+  <section id="project_lane">
+	  <header>Project</header>
+	  <div class="lane">
+	  <a class="lane-button" href="<!--% absolute_path(baseurl) %-->correspondents/index.html">
+		  <img src="<!--% absolute_path(baseurl) %-->" alt="Person icon">
+		 Host 
+	  </a>
+	  <a class="lane-button" href="<!--% absolute_path(baseurl) %-->series/index.html">
+		  <img src="" alt="Stack of Books icon">
+		 Series 
+	  </a>
+	  <a class="lane-button" href="<!--% absolute_path(baseurl) %-->about.html">
+		  <img src="<!--% absolute_path(baseurl) %-->" alt="Question Mark icon">
+		 About 
+	  </a>
+	</div>
+  </section>
+  <section id="latest_lane">
  <!--% PROCESS 'shared-episode-summary.tpl.html' %-->
-<h1>Latest Shows</h1>
+  <section id="latest_shows">
+	<header>Latest Shows</header>
 <!--% host_cnt = 0 %-->
+	<ul>
 <!--% FOREACH latest_episodes IN DBI.query(query_latest_episodes)
 %-->
-<hr>
-<article>
-	<header>
-			<h1><a href="<!--% absolute_path(baseurl) %-->eps/hpr<!--% zero_pad_left(latest_episodes.id) %-->/index.html">hpr<!--% latest_episodes.id %--> :: <!--% latest_episodes.title %--></a></h1>
-		<h3><!--% latest_episodes.summary%--></h3>
-		<p class="meta"$><!--% show_avatar(latest_episodes.hostid, latest_episodes.host, host_cnt) %-->
-	Hosted by <a href="<!--% absolute_path(baseurl) %-->correspondents/<!--% zero_pad_left(latest_episodes.hostid) %-->.html"><!--% latest_episodes.host %--></a> on <!--% day_and_date(latest_episodes.date) %--> is flagged as <!--% display_explicit(latest_episodes.explicit) %--> and released under a <!--% latest_episodes.license %--> license. <br>
-	<!--% display_tags(latest_episodes.tags) %-->
-	<span><!--% show_series(latest_episodes.series, latest_episodes.seriesid) %--></span>
-	<span><label>Comments: </label><!--% display_comments_tally(latest_episodes.id, latest_episodes.eps_tally) %--></span><br>
-<!--% listen_now(latest_episodes, "hpr", baseurl, media_baseurl) %-->
-		</p>
-	</header>
-		<p>See <a href="<!--% absolute_path(baseurl) %-->eps/hpr<!--% zero_pad_left(latest_episodes.id) %-->/index.html">episode show notes</a> for more information.</p>
-</article>
+		<li><a href="<!--% absolute_path(baseurl) %-->eps/hpr<!--% zero_pad_left(latest_episodes.id) %-->/index.html">hpr<!--% latest_episodes.id %--> :: <!--% latest_episodes.title %--></a></li>
 <!--% host_cnt = host_cnt + 1 %-->
 <!--% END %-->
-<article id="previous_five_weeks">
-    <header>
-        <hr>
-        <h1>Previous five weeks</h1>
-    </header>
-<!--% FOREACH last_5_weeks_episodes IN DBI.query(query_last_5_weeks_episodes)
+	</ul>
+  </section>
+  <section id="latest_comments">
+	<header>Latest Comments</header>
+	<ul>
+<!--% FOREACH item IN DBI.query('
+		WITH episode_comment_rank AS (
+		SELECT 
+			comments.eps_id
+		  ,	comments.id as comment_id
+		  , comments.comment_author_name
+		  , comments.comment_timestamp
+		  , comments.comment_title
+		  , RANK() OVER (PARTITION BY eps_id ORDER BY id ) AS comment_number
+		FROM comments 
+	)
+	SELECT 
+		  episode_comment_rank.*	  
+		, hosts.host
+		, eps.title AS episode_title
+		, eps.date AS episode_date
+	FROM episode_comment_rank 
+	INNER JOIN eps 
+	  ON episode_comment_rank.eps_id = eps.id 
+	INNER JOIN hosts 
+	  ON eps.hostid = hosts.hostid 
+	ORDER BY episode_comment_rank.comment_timestamp DESC 
+	LIMIT 10;
+	
+	')
 %-->
-	<!--% show_summary(last_5_weeks_episodes) %-->
-	<p class="listen-in"><!--% display_listen_in(last_5_weeks_episodes.id) %--></p>
+	<li>hpr<!--% item.eps_id %--> (<!--% item.episode_date %-->) "<!--% item.episode_title %-->" by <!--% item.host %-->
+	<ul>
+		<li><a href="<!--% absolute_path(baseurl) %-->eps/hpr<!--% zero_pad_left(item.eps_id) %-->/index.html#comment_<!--% item.comment_id%-->">Comment <!--% item.comment_number %-->: <!--% item.comment_author_name %--> on <!--% item.comment_timestamp %-->: "<!--% item.comment_title %-->"</a>
+		</li>
+	</ul>
+	</li>
 <!--% END %-->
-</article>
-<h1>Older Shows</h1>
-	<p>
-	Get a <a href="<!--% absolute_path(baseurl) %-->eps/index.html">full list</a> of all our shows.
-	</p>
+	</ul>
+  </section>
--- a/templates/page.tpl.html
+++ b/templates/page.tpl.html
@@ -36,113 +36,45 @@
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.5, user-scalable=yes"/> 
 </head>

-<body id="give">
-<div id="container" class="shadow">
+<body>
+<nav class="menu" role="navigation">
+<!--% INCLUDE $navigation %-->
+</nav>
 <header>
-  <a href="<!--% absolute_path(baseurl) %-->"><img id="hprlogo" src="<!--% absolute_path(baseurl) %-->images/hpr_logo.png" alt="hprlogo"></a>
-  <div id="hpr_banner">
-    <p id="accessible_menu">
-      <a href="<!--% absolute_path(baseurl) %-->sitemap.html">Site Map</a>
-      - <a href="#maincontent">skip to main content</a>
-      </p>
-      <h1 id="sitename">
+  <div id="title">
+	  <h1>HPR</h1>
+      <h2 id="sitename">
        <a href="<!--% absolute_path(baseurl) %-->correspondents/index.html">H</a>acker
        <a href="<!--% absolute_path(baseurl) %-->comments_viewer.html">P</a>ublic
        <a href="<!--% absolute_path(baseurl) %-->syndication.html">R</a>adio
-      </h1>
-    <h2>Your ideas, projects, opinions - podcasted.</h2>
-    <h3>New episodes every weekday Monday through Friday.<br />
-    <em><small>This page was <a href="https://repo.anhonesthost.net/HPR/hpr_generator">generated</a> by <a href="mailto:<!--% generator_email %-->"><!--% generator_name %--></a> at <time dateTime="<!--% format_iso8601_date(date.now) %-->"><!--% format_feed_date(date.now) %--></time></small></em></h3>
-
+      </h2>
+	  <h3 id="site_url">https://HackerPublicRadio.org</h3>
+  </div>
+  <div id="tag_line">
+    <h1>The Community Podcast</h1>
+	<h2>Sharing your ideas, projects, opinions since 2005</h2>
+    <h3>New episodes every weekday
+  </div>
+    </h3>
+  </div>
+  <div id="qr_code">
+	  <img src="<!--% absolute_path(baseurl) %-->images/qr_code_logo.png" alt="QR code of HPR URL">
  </div>
-  <hr />
-  
-  <nav class="menu" role="navigation">
-<!--% INCLUDE $navigation %-->
-  </nav>
 </header>
-
-<main id="maincontent">
+<main>
 <!--% INCLUDE $content %-->
 </main>
-
-<footer id="footer_page">
-  <h1 class="thick_bar">More Information...</h1>
-  <div id="more_info">
-    <nav class="column">
-      <h2>Ancestry</h2>
-      <ul>
-        <li><a href="http://audio.textfiles.com/shows/radiofreekamerica/">Radio Freek America</a></li>
-        <li><a href="http://audio.textfiles.com/shows/binrev/">BinRev Radio</a></li>
-        <li><a href="http://audio.textfiles.com/shows/infonomicon/">Infonomicon</a></li>
-        <li><a href="http://audio.textfiles.com/shows/twat/">Today With a Techie</a></li>
-      </ul>
-    </nav>
-    <nav class="column">
-      <h2>Social</h2>
-      <ul>
-        <li><a href="https://lists.hackerpublicradio.com/mailman/listinfo/hpr" >Mailing list</a></li>
-        <li><a rel="me" href="https://infosec.exchange/@hpr" >Mastodon</a></li>
-        <li><a href="https://matrix.to/#/#hpr:matrix.org" >Matrix</a></li>
-        <li><a href="mumble://chatter.skyehaven.net:64738/Hacker%20Public%20Radio?version=1.2.0" >Mumble</a></li>
-        <li><a href="https://web.libera.chat/gamja/?channels=oggcastplanet" target="_blank">#oggcastplanet</a></li>
-        <li><a href="https://t.me/+6fEhQrf5IEc4ZGU8">Telegram</a></li>
-        <li><a href="https://twitter.com/HPR">Twitter.com</a></li>
-        <li><a href="https://www.facebook.com/HenryPartickReilly" target="_blank">Facebook</a></li>
-        <li><a href="https://www.linkedin.com/company/hackerpublicradio/" target="_blank">Linked-In</a></li>
-      </ul>
-    </nav>    
-    <nav class="column">
-      <h2>Unaffiliates</h2>
-      <ul>
-        <li><a href="https://archive.org/details/hackerpublicradio">Archive.org</a></li>
-        <li><a href="https://music.amazon.fr/podcasts/9d9e6211-ff78-4501-93b6-6a9e560c4dbd/hacker-public-radio">Amazon Music</a></li>
-        <li><a href="https://podcasts.google.com/feed/aHR0cDovL2hhY2tlcnB1YmxpY3JhZGlvLm9yZy9ocHJfcnNzLnBocA">Google Podcasts</a></li>
-        <li><a href="https://www.iheart.com/podcast/256-hacker-public-radio-30994513/" target="_blank">iHeart Radio</a></li>
-        <li><a href="https://podcasts.apple.com/us/podcast/hacker-public-radio/id281699640">iTunes</a></li>
-        <li><a href="https://www.listennotes.com/de/podcasts/hacker-public-radio-hacker-public-radio-mNH-jsI7LcJ/">Listen Notes</a></li>
-        <li><a href="https://www.mixcloud.com/hackerpublicradio/">MixCloud</a></li>
-        <li><a href="https://player.fm/series/hacker-public-radio">PlayerFM</a></li>
-        <li><a href="https://www.podchaser.com/podcasts/hacker-public-radio-76781">Podchaser</a></li>
-        <li><a href="https://nl.radio.net/podcast/hacker-public-radio">Radio.net</a></li>
-        <li><a href="https://open.spotify.com/show/7e2hYcnHj9vKgUzsIOf4r3">Spotify</a></li>
-        <li><a href="https://toppodcast.com/podcast_feeds/hacker-public-radio/">Top Podcasts</a></li>
-      </ul>
-    </nav>
-    <nav class="column">
-      <h2>Commons</h2>
-      <ul>
-        <li><a href="https://freeculturepodcasts.org/">Free Culture Podcasts</a></li>
-        <li><a href="https://archive.org/details/hackerpublicradio">archive.org</a></li>
-        <li><a href="https://repo.anhonesthost.net/HPR/">HPR Source Code</a></li>
-        <li><a href="https://cchits.net/">cchits.net</a></li>
-        <li><a href="https://freesound.org/">freesound.org</a></li>
-        <li><a href="https://librivox.org/">librivox.org</a></li>
-        <li><a href="https://openclipart.org/">openclipart.org</a></li>
-        <li><a href="https://openfontlibrary.org/">openfontlibrary.org</a></li>
-        <li><a href="https://www.openrouteservice.org/">openrouteservice.org/</a></li>
-        <li><a href="https://pixabay.com/">pixabay.com/</a></li>
-      </ul>
-    </nav>
-    <nav class="column">
-      <h2>Patrons</h2>
-      <ul>
-        <li><a href="https://anhonesthost.com/hosting/shared-hosting">AnHonestHost.com</a></li>
-        <li><a href="https://archive.org/donate/">Archive.org</a></li>
-        <li><a href="https://rsync.net/">rsync.net</a></li>
-      </ul>
-    </nav>
-  </div><!-- more_info -->
-  <h1 class="thick_bar">Copyright Information</h1>  
+<footer>
+  <hr>
  <div id="copyright">
-    <p>
-    Unless otherwise stated, our shows are released under a <a rel="license" href="https://creativecommons.org/licenses/by-sa/4.0/">
-    Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0)</a> license.</p>
-    <p>
+	  <span>Unless otherwise stated, our shows are released under a <a rel="license" href="https://creativecommons.org/licenses/by-sa/4.0/">
+    Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0)</a> license.</span>
+    <span>
    The <span property="dct:title">HPR Website Design</span> is released to the <a rel="license" href="https://creativecommons.org/publicdomain/mark/1.0/">Public Domain</a>.
-    </p>
-  </div><!-- copyright -->
-  <hr />
+    </span>
+  </div>
+ <div id="generated_by">This page was <a href="https://repo.anhonesthost.net/HPR/hpr_generator">generated</a> by <a href="mailto:<!--% generator_email %-->"><!--% generator_name %--></a> at <time dateTime="<!--% format_iso8601_date(date.now) %-->"><!--% format_feed_date(date.now) %--></time></em>
+ </div>
 </footer>
-</div>
-<!-- shadow -->
+</body>
+</html>
--- a/utils/check-dependencies.sh
+++ b/utils/check-dependencies.sh
@@ -1,67 +1,73 @@
-#!/bin/bash -
+#!/bin/bash - 
 #===============================================================================
 #
 #          FILE: check-dependencies.sh
-#
-#         USAGE: ./check-dependencies.sh
-#
-#   DESCRIPTION: Check that Perl module dependencies for the hpr_generator
+# 
+#         USAGE: ./check-dependencies.sh 
+# 
+#   DESCRIPTION: Check that Perl module dependencies for the hpr_generator 
 #		  are installed.
-#
+# 
 #       OPTIONS: ---
 #  REQUIREMENTS: ---
 #          BUGS: ---
 #         NOTES: ---
 #        AUTHOR: Roan "Rho`n" Horning (roan.horning@gmail.com)
-#  ORGANIZATION:
+#  ORGANIZATION: 
 #       CREATED: 09/05/2024 09:55:00 PM
 #      REVISION:  ---
 #===============================================================================

-set -o nounset # Treat unset variables as an error
+set -o nounset                              # Treat unset variables as an error

 #---  FUNCTION  ----------------------------------------------------------------
-#          NAME: is_module_installed
-#   DESCRIPTION: Tests if the supplied module is found on the system
+#          NAME: is_module_installed 
+#   DESCRIPTION: Tests if the supplied module is found on the system 
 #    PARAMETERS: Name of the denpendent Perl module
 #       RETURNS: 0 if not found, 1 if found
 #-------------------------------------------------------------------------------
 function is_module_installed {
-  HR="----------------------"
-  perl -e "use ${1} "
-  if [ $? -ne 0 ]; then
-    echo ${HR}
-  else
-    echo "Found module ${1}"
-    echo ${HR}
-  fi
+	HR="----------------------"
+	perl -e "use ${1} " 
+	if  [ $? -ne 0 ]
+	then
+		echo ${HR}
+	else
+		echo "Found module ${1}"
+		echo ${HR}
+	fi
 }

-MODULES=(
-  "Getopt::Long"
-  "Pod::Usage"
-  "Config::Std"
-  "Template"
-  "Template::Plugin::File"
-  "Template::Plugin::DBI"
-  "Template::Plugin::HTML::Strip"
-  "DBI"
-  "Tie::DBI"
-  "DBD::SQLite"
-  "Date::Calc"
-  "Text::CSV_XS"
+MODULES=( \
+	 "Getopt::Long" \
+	 "Pod::Usage" \
+	 "Config::Std" \
+	 "Template" \
+	 "Template::Plugin::File" \
+	 "Template::Plugin::DBI" \
+	 "Template::Plugin::HTML::Strip" \
+	 "DBI" \
+	 "Tie::DBI" \
+	 "DBD::SQLite" \
+	 "DBD::mysql" \
+	 "Date::Calc" \
+	 "Text::CSV_XS" \
 )

 echo "The following modules must be installed for the site-generator to function: "
-for module in "${MODULES[@]}"; do
-  echo "* ${module}"
+for module in "${MODULES[@]}"
+do
+	echo "* ${module}"
 done
+echo "When MySQL is used, the DBD:mysql module is required (otherwise it is optional)"
+echo "When SQLite is used, then the DBD:SQLite module is required (otherwise it is optional)"

 echo "Scanning for modules ..."
 echo "----------------------"

-for module in "${MODULES[@]}"; do
-  is_module_installed "${module}"
+for module in "${MODULES[@]}"
+do
+	is_module_installed "${module}"
 done

 echo "Finished scanning."
Author	SHA1	Message	Date
Roan Horning	71c1c46cfb	Add latest comments to latest lane on main landing page	2025-07-16 10:42:05 -04:00
Roan Horning	991f088ded	Update lastest episodes section to new layout	2025-07-15 21:45:31 -04:00
Roan Horning	ebe230ee0a	Initial formatting of swim lanes on main landing page	2025-07-15 21:06:33 -04:00
Roan Horning	da62e4ec51	Add QR code with logo	2025-07-14 20:51:41 -04:00
Roan Horning	34d13fa0c6	Format main template to new website design Create basic structure in html to be displayed using the CSS Flex box model	2025-07-14 20:13:06 -04:00