add site-newdesign configuration that generates the new design

Reviewed-on: HPR/hpr_generator#268
Reviewed-by: Roan Horning <rho_n@josh@dao-mail.com>

GETTING_STARTED.md

@@ -6,11 +6,7 @@ If git is not installed on the operating system, please install it now
 To retrieve the code from the repository on anhonesthost.net (a username and 
 password are required), run:
 
-`git clone https://repo.anhonesthost.net/rho_n/hpr_generator.git`
-
-To retrieve the code from the repository on gitlab.com, run: 
-
-`git clone https://gitlab.com/roan.horning/hpr_generator.git`
+`git clone https://repo.anhonesthost.net/HPR/hpr_generator.git`
 
 On success, an "hpr_generator" directory will be created in the folder from 
 which the clone command was executed containing a local copy of the git repository.
@@ -41,8 +37,9 @@ apt install libconfig-std-perl \
 ## Using CPAN to install the modules
 
 A cross platform method to install the needed modules is the Perl CPAN application. 
-Make sure both the [make](https://www.gnu.org/software/make/manual/make.html) 
-command and the [cpan](https://perldoc.perl.org/CPAN) command are available. 
+Make sure that the [gcc](https://www.gnu.org/software/gcc/), 
+[make](https://www.gnu.org/software/make/manual/make.html), 
+and [cpan](https://perldoc.perl.org/CPAN) commands are available. 
 Install them using the operating system's package manager, or from source.
 
 Run commands:
@@ -51,9 +48,21 @@ Run commands:
 cpan Config::Std
 cpan Template
 cpan Template::Plugin::DBI
+cpan Template::Plugin::HTML::Strip
 cpan DBD::SQLite
 cpan Date::Calc
 cpan Tie::DBI
+cpan Text:CSV_XS
+```
+
+## Testing for Perl module dependencies
+
+A bash script is included in the utils directory that will list the Perl modules used by the site-generator and report whether the modules are installed on the current OS.
+
+It can be run from any directory. To run from the utils directory:
+
+```
+./check-dependencies.sh
 ```
 
 # Create the HPR database
@@ -86,11 +95,11 @@ program which creates the hpr.db file:
 
 `./utils/mysql2sqlite ./hpr-sqlite.sql | sqlite3 ./hpr.db`
 
-For convenience, the update-sqlite-db.sh script in the utils directory
+For convenience, the update-hpr-db.sh script in the utils directory
 automates the above steps (including downloading the hpr.sql file). 
 From the root of the local hpr_generator repository run:
 
-`./utils/update-sqlite-db.sh`
+`./utils/update-hpr-db.sh`
 
 # Configure the site-generator
 
@@ -102,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 
-a MySQL or SQLite database.
+an SQLite database.
 
 Find the [DBI] section of the file. It should look like the following
 
@@ -137,26 +146,6 @@ 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 
@@ -177,7 +166,7 @@ baseurl: file://</path/to>/hpr_generator/public_html
 ```
 
 Replace \<path/to\> with the full path to the hpr_generator directory. For 
-example: `file:///home/rho_n/development/hpr_generator/public_html`
+example: `file:///home/HPR/development/hpr_generator/public_html`
 
 ## Configuring the website media file links
 

NEW_DESIGN_INTEGRATION.md

@@ -0,0 +1,96 @@
+# New Design Integration
+
+This branch integrates the modern design from DraftHPRSplash (hobbypublicradio.org) into the hpr_generator system.
+
+## What's Been Done
+
+### 1. Design Assets Added
+- **CSS**: New responsive design stylesheet at `public_html/css/new-design.css`
+- **Images**: New banner logo at `public_html/images/logo.png`
+- **Icons**: Complete icon set from Remix Icons in `public_html/icons/`
+
+### 2. New Templates Created
+- **Main Template**: `templates/page-newdesign.tpl.html` - Main page layout with new design
+- **Index Content**: `templates/content-index-newdesign.tpl.html` - Homepage with card-based layout
+- **Navigation**: `templates/navigation-newdesign.tpl.html` - Simplified navigation
+
+### 3. Configuration
+- **New Config**: `site-newdesign.cfg` - Configuration file to use new design templates
+
+## Key Design Changes
+
+### Navigation
+- **Before**: Complex multi-level navigation with detailed menu structure
+- **After**: Simple 4-item top navigation (Home, Upload, Download, About)
+
+### Layout
+- **Before**: Traditional header with logo + complex navigation + main content + detailed footer
+- **After**: Clean banner image + simplified navigation + card-based sections + minimal footer
+
+### Homepage Content
+- **Before**: Text-heavy with detailed episode listings
+- **After**: Card-based sections for podcast functions (Record, Schedule, Subscribe, Listen) + streamlined episode/comment lists
+
+## How to Use
+
+### Option 1: Test New Design
+```bash
+# Install dependencies first (see GETTING_STARTED.md)
+./site-generator --configuration=site-newdesign.cfg index
+```
+
+### Option 2: Generate Full Site with New Design
+```bash
+./site-generator --configuration=site-newdesign.cfg --all
+```
+
+### Option 3: Compare Designs
+```bash
+# Generate with old design
+./site-generator index
+
+# Generate with new design  
+./site-generator --configuration=site-newdesign.cfg index
+
+# Compare the generated index.html files
+```
+
+## Compatibility
+
+- **Database**: Uses same database and queries as original
+- **Functionality**: All existing features preserved
+- **RSS/XML**: Uses same RSS templates (no changes needed)
+- **URLs**: All URL structures remain the same
+- **Templates**: Original templates unchanged, new design uses separate template files
+
+## Next Steps
+
+1. **Testing**: Generate and test all page types with new design
+2. **Content Templates**: Create new design versions for other content templates as needed
+3. **Refinement**: Adjust styling and layout based on testing
+4. **Documentation**: Update any template documentation
+
+## Files Added/Modified
+
+### New Files
+- `public_html/css/new-design.css`
+- `public_html/images/logo.png` 
+- `public_html/icons/` (directory with SVG icons)
+- `templates/page-newdesign.tpl.html`
+- `templates/content-index-newdesign.tpl.html`
+- `templates/navigation-newdesign.tpl.html`
+- `site-newdesign.cfg`
+- `NEW_DESIGN_INTEGRATION.md` (this file)
+
+### No Existing Files Modified
+This integration preserves all existing functionality while adding the new design as an option.
+
+## Design Principles Maintained
+
+1. **Responsive**: Mobile-first responsive design
+2. **Accessible**: Maintains accessibility features
+3. **Performance**: Optimized CSS and minimal JavaScript
+4. **Standards**: Valid HTML5 and modern CSS
+5. **Compatibility**: Works with existing generator system
+
+The integration allows switching between designs via configuration, enabling easy testing and gradual migration.

README.md

@@ -15,17 +15,8 @@ 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
+    * Getopt::Long
     * Pod::Usage
     * Config::Std
     * Template
@@ -35,7 +26,7 @@ Static web page generator for the Hacker Public Radio website.
     * Template::Plugin::HTML::Strip
     * DBI
     * Tie::DBI
-    * DBD::SQLite or DBD:mysql
+    * DBD::SQLite
     * Date::Calc
     * Text::CSV_XS
     * HTML::Entities
@@ -54,24 +45,28 @@ Generate pages based on the same template:
 `site-generator correspondent=1,3,5..10`
 
 ## Support
-Please [submit an Issue](https://repo.anhonesthost.net/rho_n/hpr_generator/issues),
+Please [submit an Issue](https://repo.anhonesthost.net/HPR/hpr_generator/issues),
 and add the label "**Help Request**" for help running or installing the site-generator.
 
-For discussing HPR site generation in general, please [submit an Issue](https://repo.anhonesthost.net/rho_n/hpr_generator/issues) and add the label "**General Discussion**".
+For discussing HPR site generation in general, please [submit an Issue](https://repo.anhonesthost.net/HPR/hpr_generator/issues) and add the label "**General Discussion**".
 
 ## Contributing
 Happy to take any contributions or suggestions.
 
-To contribute code or documentation, please create a fork of the project and [submit a pull request](https://repo.anhonesthost.net/rho_n/hpr_generator/pulls) or send a patch. If an issue exists that is related to your patch, please assign the issue to yourself, or if it is already assigned to someone else, please coordinate with them to minimize duplicated efforts.
+To contribute code or documentation, please create a fork of the project and [submit a pull request](https://repo.anhonesthost.net/HPR/hpr_generator/pulls) or send a patch. If an issue exists that is related to your patch, please assign the issue to yourself, or if it is already assigned to someone else, please coordinate with them to minimize duplicated efforts.
 
-If you have found an error in the code or the generated HTML, please [submit an Issue](https://repo.anhonesthost.net/rho_n/hpr_generator/issues),
+If you have found an error in the code or the generated HTML, please [submit an Issue](https://repo.anhonesthost.net/HPR/hpr_generator/issues),
 and add the label "**Bug Found**".
 
-To make a suggestion, please [submit an Issue](https://repo.anhonesthost.net/rho_n/hpr_generator/issues),
+To make a suggestion, please [submit an Issue](https://repo.anhonesthost.net/HPR/hpr_generator/issues),
 and add the label "**Feature Request**".
 
 ## Authors and acknowledgment
 * Roan "Rho`n" Horning
+* Dave Morriss
 * gordons
 * Ken Fallon
 * norrist
+* Paul Jewell
+
+

public_html/css/hpr.css

@@ -4,275 +4,515 @@
 https://creativecommons.org/publicdomain/ 
  
 */
+/*
+ *	See the following for the modern CSS responsive design techniques used in this file:
+ *	- MDN web docs: Responsive design 
+ *		-- https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design
+ *	- Matthew James Tayler: Responsive Font Size (Optimal Text at Every Breakpoint) 
+ *		-- https://matthewjamestaylor.com/responsive-font-size
+ *	- CSS-Tricks: Linearly Scale font-size with CSS clamp() Based on the Viewport
+ *		-- https://css-tricks.com/linearly-scale-font-size-with-css-clamp-based-on-the-viewport/
+*/
 
-p.meta span label { font-weight: bold; }
-@media only screen and (min-width: 479px) { 
-
-body {background: #dfdfdf;}
-div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, textarea, blockquote {
-  font-family: Verdana, Arial, Helvetica, sans-serif;/* 1em/1.5 OpenDyslexic, */
-  color: #4D4D4D; /* HPR Grey */
-  background: white;
+html {
+	margin: 0;
+	padding: 0;
+	display: block;
 }
 
+body {
+	display: block;
+	background: #dfdfdf;
+	font-size: 1rem; /* fallback for browsers that don't support the clamp function) */
+	font-size: clamp(1rem, 15px + 0.3vw, 1.07rem);
+	margin: 0;
+	padding: 0;
+}
 
-#container {
-	width: 100%;
-	max-width: 58em;
-	margin: auto;
-	overflow: hidden;
-	padding: .5em;
-	border: thin solid;
+div,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+ul,
+ol,
+li,
+dl,
+dt,
+dd,
+img,
+form,
+fieldset,
+input,
+textarea,
+blockquote {
+	font-family: Verdana, Arial, Helvetica, sans-serif; /* 1em/1.5 OpenDyslexic, */
+	color: #4D4D4D; /* HPR Grey */
 	background: white;
 }
 
-.shadow {
-  -moz-box-shadow:    2px 3px 6px 3px #675958;
-  -webkit-box-shadow: 2px 3px 6px 3px #675958;
-  box-shadow:         2px 3px 6px 3px #675958;}
-
-#hprlogo { 
-  display: block; 
-  position: relative; 
-  top: 0; 
-  left: 0; 
-  border: 0; 
-  margin: 0.75em;
-  float:left;
+h1 {
+	font-size: 1.5rem;
+	margin: 1.25rem 0 0.75rem 0;
 }
 
-#hpr_banner { 
-  display: block; 
-  position: relative;
-  border: 0; 
-  margin: 0.75em;
-  float: left;
+h2,
+article * h1 {
+	font-size: 1.45rem;
+	margin: 1.25rem 0 0.75rem 0;
 }
 
-#hpr_banner h1 {margin: -.25em 0em -.5em 0em;}
-#hpr_banner h2 {font-size: 100%; font-weight: lighter; }
-#hpr_banner h3 {font-size: 90%; font-weight: lighter; }
-
-#accessible_menu {
-  font-size: small;
+h3,
+article * h2 {
+	font-size: 1.25rem;
+	margin: 1.25rem 0 0.75rem 0;
 }
 
-/* The main navigation menu */
-.menu {
-  background: #4D4D4D; /* HPR Grey */
-  text-align: Left;
-  clear:both; /* Forces the menu to appear after the HPR Header block */
-  padding: 0em 0em;
-  margin: 0em 0em;
+h4,
+article * h3 {
+	font-size: 1.15rem;
+	margin: 1.25rem 0 0.75rem 0;
 }
 
-.menu ul ul { /* Causes the sub menus not to be displayed, until hover shows them */
-  display: none;
+img {
+	max-width: 100%;
+	height: auto;
 }
 
-#main_menu li a {display: block;}
-
-.menu ul li { padding: .25em 0em;}
-
+ul {
+	padding-left: 1.15rem;
 }
 
-.menu ul { /* The menu bar background across screen */
-  background: #4D4D4D; /* HPR Grey */
-  color: white;
-  padding: 0 10px; /* Keeps sub menus to the left */
-  list-style: none;
-  position: relative;
-  margin: 0;
-  display: inline-table;
+li {
+	line-height: 1.25;
 }
 
-.menu ul:after { /* Forces the dropdown to be a block with non float */
-  content: ""; 
-  clear: both; 
-  display: block;
+a {
+	text-decoration: none;
 }
 
-.menu ul li {
-  background: #4D4D4D; /* HPR Grey */
-  color: white;
-  float: left;
-  padding: .5em 1em;
+a:hover {
+	cursor: pointer;
 }
 
-.menu ul li a {
-  background: #4D4D4D; /* HPR Grey */
-  color: white;
-  display: block; 
-  text-decoration: none;
-}
-    
-.menu ul ul {
-  background: #4D4D4D; /* HPR Grey */
-  color: white;
-  padding: 0;
-  position: absolute; 
-  top: 100%;
-}
-
-.menu ul ul li {
-  background: #4D4D4D; /* HPR Grey */
-  color: white;
-  float: none; 
-  position: relative;
-}
-    
-.menu ul ul ul {
-  position: absolute; 
-  left: 100%; 
-  top:0;
-}
-
-
 hr {
-  background: #4D4D4D;  /* HPR Grey */
-  border: 0;
-  height: 0.25em;
+	background: #4D4D4D;
+	border: 0;
+	height: 0.25em;
 }
 
-/* The multi colum footer layout */
-
-#footer_page {
-  width:100%;
+audio {
+	padding: .7em 0em .5em 0em;
+	clear: both;
+	position: relative;
+	z-index: auto;
 }
 
-.column {
-  width:12%;
-  background-color: white;
-  color: #4D4D4D; /* HPR Grey */
-  float:left;
-  margin:0 10px;
-  display: block;
+.audcredit {
+	font-size: 75%;
+	margin-bottom: 1em;
 }
 
-.column li {
-  list-style:none;
-  padding: .25em 0em;
-  font-size: 85%;
+p.meta {
+	line-height: 1.25;
+}
+
+p.meta span label {
+	font-weight: bold;
+}
+
+article>p,
+#maincontent>p {
+	line-height: 1.45;
+}
+
+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 {
-  width:100%;
-  background-color: #4D4D4D; /* HPR Grey */
-  color: white;
-  float:left;   
-  clear: both;
-  height:1.5em;
-  padding: .5em 0em .5em 0em;
-  font-size: 1em;
-  margin: 1em 0em 1em 0em;
+	background-color: #4D4D4D;
+	color: white;
+	padding: 0.5rem;
+	margin: 1rem 0 1rem 0;
 }
 
-#more_info {margin: auto;}
-nav.column { display: block; padding: 0em 1em 0em 1em;}
-#copyright {
-  font-size: small;
-  width:100%;
-  float:left;   
+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);
 }
 
-article, #copyright p {
-  padding: 0 10px;
+#hpr_banner {
+	/* display: inline-block; */
+	border: 0;
+	margin: 0 0 0rem 0;
+	padding: 0;
 }
 
-audio {padding: .7em 0em .5em 0em; clear: both; position: relative; z-index:auto;}
-.audcredit { font-size: 75%;margin-bottom: 1em;}
-h1.showtitle { font-size: 125%;}
-
-/* Full Index Page styling */
-#index_full h2.title {
-	font-weight: lighter;
-	margin-bottom: -.5em;
-	padding: .5em 0em 0em 0em; 
-	font-size: 110%;}
-
-#index_full p.meta {font-size: 85%;}
-
-#small {
-  font-size: small;
+#hpr_banner p {
+	margin: 0 0 0.5rem 0;
 }
 
-p.author { font-size: 85%;}
-p.shownotes { padding: .5em;}
-#maincontent footer p { /* font-size: 75%; */ margin-bottom: 1em;}
-/* link styling */
-a:link {text-decoration: none;}
-
-table {
-    width:100%;
-}
-table, th, td {
-    border-collapse: collapse;
-    padding: 2px;
-    text-align: left;
-}
-table#t01, table#t01 th, table#t01 td {
-    border: 1px solid black;
-}
-table#t01 th, table#t01 td {
-    padding: 5px;
-    text-align: left;
-}
-table#t01 tr:nth-child(even) {
-    background-color: #eee;
-}
-table#t01 tr:nth-child(odd) {
-   background-color:#fff;
-}
-table#t01 th	{
-    background-color: #4D4D4D;
-    color: white;
+#hpr_banner h1#sitename {
+	font-size: clamp(1.44rem, -1rem + 3vw, 2rem);
+	letter-spacing: 0.06rem;
+	margin: 0;
+	padding: 0;
 }
 
-pre { /* Add background, border and scrollbar to <pre> */
-    background: #eee;
-    border: 1px solid #ddd;
-    overflow: auto;
-    clear: both;
+#hpr_banner h2 {
+	font-size: clamp(0.74rem, -1rem + 2vw, 1rem);
+	font-weight: 510;
+	margin: 0 0 1rem 0;
+	padding: 0;
 }
 
-table.hosts {
-	background: white
+#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;
 }
-table.hosts tr:nth-child(even) { background-color:#cccccc; }
-table.hosts tr:nth-child(odd) { background-color:white; }
-table.hosts tr td img { vertical-align:middle }
 
 pre.comment {
 	white-space: pre-wrap;
-	padding: 2px;
 	line-height: 1.2rem;
 }
 
-h3.title { margin: 1.25rem 0 0.75rem 0 }
-p.meta { margin: 0.25rem 0 }
-p.summary { margin: 0.25rem 0 }
-p.listen-in { margin-top: 0 }
+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;
 
-@media only screen and (max-width: 680px) { 
-	#container {width: 95%;}
-	img#hprlogo {float: left; max-width: 85px; padding: .35em;}
-	.column {width: 15%;}
-	h1 {font-size: 140%;}
-	h2 {font-size: 120%;}
-	h3 {font-size: 100%;}
-	nav.column { display: block; padding: 0em .25em 0em .25em;}
-	#footer_page li {font-size: 85%; padding: .5em .25em .5em .25em;}
-	footer p {font-size: 75%;}
-	audio {float: none; }
 }
 
-@media only screen and (max-width: 479px) { 
-	body {background: #ffffff; color: #4D4D4D; font-family: Verdana, Arial, Helvetica, sans-serif;/* 1em/1.5 OpenDyslexic, */}
-	li {font-size: 100%; padding: .75em 0em .75em 0em; margin-left: -.25em;}
-	img#hprlogo {float: left; max-width: 65px; padding: .35em;}
-	.column {width: auto;}
-	h1#sitename { clear: both;}
-	a:link {text-decoration: none;}
-	audio {padding: .7em 0em .5em 0em; width: 95%; max-width: 300px;}
-	.audcredit { font-size: 65%; margin-bottom: 1em;}
+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;
+	}
+
+	.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;
+	}
 }

public_html/css/new-design.css

@@ -0,0 +1,323 @@
+@charset "utf-8";
+
+html {
+	margin: 0;
+	padding: 0;
+	display: block;
+}
+
+body {
+	display: block;
+	background: #dfdfdf;
+	font-size: 1rem;	
+	margin: 0;
+	padding: 0;
+}
+
+div,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+ul,
+ol,
+li,
+dl,
+dt,
+dd,
+img,
+form,
+fieldset,
+input,
+textarea,
+blockquote,
+footer {
+	font-family: Verdana, Arial, Helvetica, sans-serif;
+	color: #4D4D4D;
+	font-size: 1rem;
+}
+
+h1 {
+	font-size: 1.2rem;
+}
+
+h2 {
+	font-size: 1rem;
+}
+
+h3 {
+	font-size: 0.8rem;
+}
+
+h4 {
+	font-size: 0.6rem;
+}
+
+img {
+	max-width: 100%;
+	height: auto;
+}
+
+ul {
+	padding-left: 1.15rem;
+}
+
+li {
+	line-height: 1.25;
+}
+
+a {
+	text-decoration: none;
+		font-family: Verdana, Arial, Helvetica, sans-serif;
+		color: #5e949e;
+		font-size: 1rem;	
+}
+
+a:hover {
+	cursor: pointer;
+	color: #7eb4be;
+}
+
+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;
+}
+
+footer {	
+	background-color: #4D4D4D;
+	text-align: center;
+	font-size: 0.8rem;
+	padding: 1em;
+}
+
+footer span {
+	background-color: #4D4D4D;
+	color: #dfdfdf;
+}
+
+footer a {
+	color: #afafef;
+	font-size: 0.8rem;
+}
+
+nav{
+  background: linear-gradient(to right, #2f789d, #a6cbcb);
+  color: #dfdfdf;
+  overflow: hidden;
+  position: relative;
+}
+
+.menu-links {
+  display: flex;
+}
+
+nav a {
+  display: block;
+  color: #b6dbdb;
+  text-align: center;
+  padding: 10px;
+  text-decoration: none;
+  font-size: 0.9rem;
+}
+
+nav a:hover {
+	background-color: #5fa9be;
+	color: #efefef;
+}
+
+.hamburger {
+  display: none;
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: 10px;
+}
+
+.hamburger img {
+  width: 24px;
+  height: 24px;
+  filter: invert(80%) sepia(20%) saturate(100%) hue-rotate(140deg) brightness(110%);
+}
+
+@media screen and (max-width: 600px) {
+	.hamburger {
+		display: flex;
+	}
+	
+	.menu-links {
+		position: static;
+		left: 0;
+		right: 0;
+		background: linear-gradient(to right, #2f789d, #a6cbcb);
+		flex-direction: column;
+		display: none;
+	}
+	
+	.menu-links.active {
+		display: flex;
+	}
+	
+	nav a {
+		text-align: left;
+		border-top: solid 1px #0f597e;
+	}
+
+	nav a:hover {
+		background: linear-gradient(to right, #3f89ae, #a6cbcb);
+	}
+}
+
+@media screen and (max-width: 700px) {
+
+}
+
+.banner {
+	margin: 5px;
+	background: linear-gradient(to right, #2f789d, #a6cbcb); 	
+}
+
+.banner-image {
+	margin: 0 auto;
+	height: 35vh;
+	width: 100%;
+	display: block;
+	object-fit: cover;
+	object-position: left;
+	max-width:1600px;
+}
+
+main {
+	margin: 0 2em;
+}
+
+section  {
+	margin: 10px;
+}
+
+section.podcast {
+	width: 90%;
+	margin: 0 5%;
+	display: flex;
+	flex-wrap: wrap;
+}
+
+a.podcast {
+	flex: 0 0 20%;
+	flex-basis: 150px;
+	box-sizing: border-box;	
+	margin: 2.5%;
+	padding: 1em 1em 0em 1em;
+	height: 180px;
+	background-size: cover;
+	border: none;
+}
+
+section a.podcast.record {
+	background-image: url('../icons/record_button.png');
+}
+
+section a.podcast.schedule {
+	background-image: url('../icons/schedule_button.png');
+	background-size: cover;
+	border: none;
+}
+
+section a.podcast.subscribe {
+	background-image: url('../icons/subscribe_button.png');
+	background-size: cover;
+	border: none;
+}
+
+section a.podcast.listen {
+	background-image: url('../icons/listen_button.png');
+	background-size: cover;
+	border: none;
+}
+
+section.podcast > a > p
+{
+	display: none;
+}
+
+section.project {
+	width: 90%;
+	margin: 0 5%;
+	display: flex;
+	flex-wrap: wrap;
+}
+
+a.project {
+	flex: 0 0 20%;
+	flex-basis: 150px;
+	box-sizing: border-box;	
+	margin: 2.5%;
+	padding: 1em 1em 0em 1em;
+	height: 180px;
+	background-size: cover;
+	border: none;
+}
+
+section.project > a > p
+{
+	display: none;
+}
+
+section a.project.host {
+	background-image: url('../icons/hosts_button.png');
+	background-size: cover;
+	border: none;
+}
+
+section a.project.series {
+	background-image: url('../icons/series_button.png');
+	background-size: cover;
+	border: none;
+}
+
+section a.project.about {
+	background-image: url('../icons/about_button.png');
+	background-size: cover;
+	border: none;
+}
+
+.column-container {
+	display: flex;
+	justify-content: space-between;	
+}
+
+section.episodes, section.comments {
+	paddng: 10px;	
+	flex-basis: 50%;
+}
+
+@media (min-width: 600px) {
+  section.episodes, section.comments {
+    flex-basis: 50%;
+  }
+}
+
+@media (max-width: 600px) {
+  .column-container {
+    flex-direction: column;
+    justify-content: stretch; 
+  }
+}

public_html/icons/LICENCE.md

@@ -0,0 +1,2 @@
+[Remix-Design/RemixIcon is licensed under the
+Apache License 2.0](https://github.com/Remix-Design/remixicon/blob/master/License)

public_html/icons/calendar-2-line.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z"></path></svg>

public_html/icons/close-line.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M11.9997 10.5865L16.9495 5.63672L18.3637 7.05093L13.4139 12.0007L18.3637 16.9504L16.9495 18.3646L11.9997 13.4149L7.04996 18.3646L5.63574 16.9504L10.5855 12.0007L5.63574 7.05093L7.04996 5.63672L11.9997 10.5865Z"/></svg>

public_html/icons/menu-line.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M3 4H21V6H3V4ZM3 11H21V13H3V11ZM3 18H21V20H3V18Z"/></svg>

public_html/icons/mic-fill.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M11.9998 1C14.7612 1 16.9998 3.23858 16.9998 6V10C16.9998 12.7614 14.7612 15 11.9998 15C9.23833 15 6.99976 12.7614 6.99976 10V6C6.99976 3.23858 9.23833 1 11.9998 1ZM3.05469 11H5.07065C5.55588 14.3923 8.47329 17 11.9998 17C15.5262 17 18.4436 14.3923 18.9289 11H20.9448C20.4837 15.1716 17.1714 18.4839 12.9998 18.9451V23H10.9998V18.9451C6.82814 18.4839 3.51584 15.1716 3.05469 11Z"></path></svg>

public_html/icons/mic-line.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M11.9998 3C10.3429 3 8.99976 4.34315 8.99976 6V10C8.99976 11.6569 10.3429 13 11.9998 13C13.6566 13 14.9998 11.6569 14.9998 10V6C14.9998 4.34315 13.6566 3 11.9998 3ZM11.9998 1C14.7612 1 16.9998 3.23858 16.9998 6V10C16.9998 12.7614 14.7612 15 11.9998 15C9.23833 15 6.99976 12.7614 6.99976 10V6C6.99976 3.23858 9.23833 1 11.9998 1ZM3.05469 11H5.07065C5.55588 14.3923 8.47329 17 11.9998 17C15.5262 17 18.4436 14.3923 18.9289 11H20.9448C20.4837 15.1716 17.1714 18.4839 12.9998 18.9451V23H10.9998V18.9451C6.82814 18.4839 3.51584 15.1716 3.05469 11Z"></path></svg>

public_html/icons/question-mark.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M12 19C12.8284 19 13.5 19.6716 13.5 20.5C13.5 21.3284 12.8284 22 12 22C11.1716 22 10.5 21.3284 10.5 20.5C10.5 19.6716 11.1716 19 12 19ZM12 2C15.3137 2 18 4.68629 18 8C18 10.1646 17.2474 11.2907 15.3259 12.9231C13.3986 14.5604 13 15.2969 13 17H11C11 14.526 11.787 13.3052 14.031 11.3989C15.5479 10.1102 16 9.43374 16 8C16 5.79086 14.2091 4 12 4C9.79086 4 8 5.79086 8 8V9H6V8C6 4.68629 8.68629 2 12 2Z"></path></svg>

public_html/icons/rss-fill.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M3 3C12.9411 3 21 11.0589 21 21H18C18 12.7157 11.2843 6 3 6V3ZM3 10C9.07513 10 14 14.9249 14 21H11C11 16.5817 7.41828 13 3 13V10ZM3 17C5.20914 17 7 18.7909 7 21H3V17Z"></path></svg>

public_html/icons/rss-line.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M3 17C5.20914 17 7 18.7909 7 21H3V17ZM3 10C9.07513 10 14 14.9249 14 21H12C12 16.0294 7.97056 12 3 12V10ZM3 3C12.9411 3 21 11.0589 21 21H19C19 12.1634 11.8366 5 3 5V3Z"></path></svg>

public_html/icons/stack-fill.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M20.0833 10.4999L21.2854 11.2212C21.5221 11.3633 21.5989 11.6704 21.4569 11.9072C21.4146 11.9776 21.3557 12.0365 21.2854 12.0787L11.9999 17.6499L2.71451 12.0787C2.47772 11.9366 2.40093 11.6295 2.54301 11.3927C2.58523 11.3223 2.64413 11.2634 2.71451 11.2212L3.9166 10.4999L11.9999 15.3499L20.0833 10.4999ZM20.0833 15.1999L21.2854 15.9212C21.5221 16.0633 21.5989 16.3704 21.4569 16.6072C21.4146 16.6776 21.3557 16.7365 21.2854 16.7787L12.5144 22.0412C12.1977 22.2313 11.8021 22.2313 11.4854 22.0412L2.71451 16.7787C2.47772 16.6366 2.40093 16.3295 2.54301 16.0927C2.58523 16.0223 2.64413 15.9634 2.71451 15.9212L3.9166 15.1999L11.9999 20.0499L20.0833 15.1999ZM12.5144 1.30864L21.2854 6.5712C21.5221 6.71327 21.5989 7.0204 21.4569 7.25719C21.4146 7.32757 21.3557 7.38647 21.2854 7.42869L11.9999 12.9999L2.71451 7.42869C2.47772 7.28662 2.40093 6.97949 2.54301 6.7427C2.58523 6.67232 2.64413 6.61343 2.71451 6.5712L11.4854 1.30864C11.8021 1.11864 12.1977 1.11864 12.5144 1.30864Z"></path></svg>

public_html/icons/stack-line.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M20.0833 15.1999L21.2854 15.9212C21.5221 16.0633 21.5989 16.3704 21.4569 16.6072C21.4146 16.6776 21.3557 16.7365 21.2854 16.7787L12.5144 22.0412C12.1977 22.2313 11.8021 22.2313 11.4854 22.0412L2.71451 16.7787C2.47772 16.6366 2.40093 16.3295 2.54301 16.0927C2.58523 16.0223 2.64413 15.9634 2.71451 15.9212L3.9166 15.1999L11.9999 20.0499L20.0833 15.1999ZM20.0833 10.4999L21.2854 11.2212C21.5221 11.3633 21.5989 11.6704 21.4569 11.9072C21.4146 11.9776 21.3557 12.0365 21.2854 12.0787L11.9999 17.6499L2.71451 12.0787C2.47772 11.9366 2.40093 11.6295 2.54301 11.3927C2.58523 11.3223 2.64413 11.2634 2.71451 11.2212L3.9166 10.4999L11.9999 15.3499L20.0833 10.4999ZM12.5144 1.30864L21.2854 6.5712C21.5221 6.71327 21.5989 7.0204 21.4569 7.25719C21.4146 7.32757 21.3557 7.38647 21.2854 7.42869L11.9999 12.9999L2.71451 7.42869C2.47772 7.28662 2.40093 6.97949 2.54301 6.7427C2.58523 6.67232 2.64413 6.61343 2.71451 6.5712L11.4854 1.30864C11.8021 1.11864 12.1977 1.11864 12.5144 1.30864ZM11.9999 3.33233L5.88723 6.99995L11.9999 10.6676L18.1126 6.99995L11.9999 3.33233Z"></path></svg>

public_html/icons/user-fill.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M4 22C4 17.5817 7.58172 14 12 14C16.4183 14 20 17.5817 20 22H4ZM12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13Z"></path></svg>

public_html/icons/user-line.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M4 22C4 17.5817 7.58172 14 12 14C16.4183 14 20 17.5817 20 22H18C18 18.6863 15.3137 16 12 16C8.68629 16 6 18.6863 6 22H4ZM12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13ZM12 11C14.21 11 16 9.21 16 7C16 4.79 14.21 3 12 3C9.79 3 8 4.79 8 7C8 9.21 9.79 11 12 11Z"></path></svg>

public_html/icons/volume-up-fill.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M2 16.0001H5.88889L11.1834 20.3319C11.2727 20.405 11.3846 20.4449 11.5 20.4449C11.7761 20.4449 12 20.2211 12 19.9449V4.05519C12 3.93977 11.9601 3.8279 11.887 3.73857C11.7121 3.52485 11.3971 3.49335 11.1834 3.66821L5.88889 8.00007H2C1.44772 8.00007 1 8.44778 1 9.00007V15.0001C1 15.5524 1.44772 16.0001 2 16.0001ZM23 12C23 15.292 21.5539 18.2463 19.2622 20.2622L17.8445 18.8444C19.7758 17.1937 21 14.7398 21 12C21 9.26016 19.7758 6.80629 17.8445 5.15557L19.2622 3.73779C21.5539 5.75368 23 8.70795 23 12ZM18 12C18 10.0883 17.106 8.38548 15.7133 7.28673L14.2842 8.71584C15.3213 9.43855 16 10.64 16 12C16 13.36 15.3213 14.5614 14.2842 15.2841L15.7133 16.7132C17.106 15.6145 18 13.9116 18 12Z"></path></svg>

public_html/icons/volume-up-line.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M6.60282 10.0001L10 7.22056V16.7796L6.60282 14.0001H3V10.0001H6.60282ZM2 16.0001H5.88889L11.1834 20.3319C11.2727 20.405 11.3846 20.4449 11.5 20.4449C11.7761 20.4449 12 20.2211 12 19.9449V4.05519C12 3.93977 11.9601 3.8279 11.887 3.73857C11.7121 3.52485 11.3971 3.49335 11.1834 3.66821L5.88889 8.00007H2C1.44772 8.00007 1 8.44778 1 9.00007V15.0001C1 15.5524 1.44772 16.0001 2 16.0001ZM23 12C23 15.292 21.5539 18.2463 19.2622 20.2622L17.8445 18.8444C19.7758 17.1937 21 14.7398 21 12C21 9.26016 19.7758 6.80629 17.8445 5.15557L19.2622 3.73779C21.5539 5.75368 23 8.70795 23 12ZM18 12C18 10.0883 17.106 8.38548 15.7133 7.28673L14.2842 8.71584C15.3213 9.43855 16 10.64 16 12C16 13.36 15.3213 14.5614 14.2842 15.2841L15.7133 16.7132C17.106 15.6145 18 13.9116 18 12Z"></path></svg>

public_html/js/index.js

@@ -0,0 +1,83 @@
+window.onload = () => {
+
+	/* scale benner image map co-ordinates */
+	
+	const image = document.querySelector('.banner-image');
+	const areas = document.querySelectorAll('.bannermap > area');	
+
+	const max_width = 1600;
+	const image_height_ratio = 0.35;
+
+	const image_map_coords = [
+		[108,187,240,343],
+		[246,187,359,343],
+		[363,187,492,343]
+	];
+
+	function calcTransform(prop) {		
+		let scale, offset;
+		prop.original_aspect = prop.original_width / prop.original_height;
+		prop.scaled_width = prop.image_height * prop.original_aspect;
+		prop.image_aspect = prop.image_width / prop.image_height;
+		if (prop.scaled_width < prop.image_width) {
+			prop.scaled_height = prop.image_height * prop.image_aspect / prop.original_aspect;
+			offset = (prop.image_height - prop.scaled_height) / 2;
+			scale = prop.scaled_height / prop.original_height;
+		} else {
+			offset = 0;
+			scale = prop.image_height / prop.original_height;
+		}
+		return [scale, offset];
+	}
+
+	function setCoords() {		
+		areas.forEach((area, index) => {
+			const [x1, y1, x2, y2] = image_map_coords[index];			
+			let prop = {
+				screen_width: (window.innerWidth),
+				contained_width: (window.innerWidth <= max_width) ? window.innerWidth : max_width,
+				screen_height: window.innerHeight,
+				image_width: image.offsetWidth,
+				image_height: image.offsetHeight,
+				original_width: image.naturalWidth,
+				original_height: image.naturalHeight
+			};
+			let [ scale, offset ] = calcTransform(prop);
+			const scaled_coords = `${x1*scale}, ${y1*scale + offset}, ${x2*scale}, ${y2*scale + offset}`;
+			area.setAttribute('coords', scaled_coords);
+		});
+	}
+	
+	new ResizeObserver(setCoords).observe(image);
+	
+	/* hamburger menu functionality */
+	const hamburger = document.getElementById('hamburger-menu');
+	const menuLinks = document.getElementById('menu-links');
+	const menuIcon = hamburger?.querySelector('.menu-icon');
+	const closeIcon = hamburger?.querySelector('.close-icon');
+	
+	if (hamburger && menuLinks && menuIcon && closeIcon) {
+		hamburger.addEventListener('click', () => {
+			const isActive = menuLinks.classList.contains('active');
+			
+			menuLinks.classList.toggle('active');
+			
+			if (isActive) {
+				menuIcon.style.display = 'block';
+				closeIcon.style.display = 'none';
+			} else {
+				menuIcon.style.display = 'none';
+				closeIcon.style.display = 'block';
+			}
+		});
+		
+		// Close menu when clicking on a link
+		menuLinks.addEventListener('click', (e) => {
+			if (e.target.tagName === 'A') {
+				menuLinks.classList.remove('active');
+				menuIcon.style.display = 'block';
+				closeIcon.style.display = 'none';
+			}
+		});
+	}
+};

site-generator

@@ -56,19 +56,9 @@ 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 or DBD:mysql
+                * DBD::SQLite
                 * DBI
                 * Data::Dumper
                 * Date::Calc
@@ -122,7 +112,6 @@ use Text::CSV_XS;
 use HTML::Entities qw(encode_entities);
 use Date::Calc;
 use DBI;
-use DBD::SQLite;
 use Tie::DBI;
 use Template;
 use Template::Plugin::Date;
@@ -291,26 +280,23 @@ sub parse_page_arg {
     # Split page name from page ids if available.
     my ($page, $ids) = split(/=/, $page_arg);
     my @ids;
+    $ids = "" unless defined $ids;
 
-    if(!$ids) {
-        $ids = "";
-    }
-    else {
-        # Parse the page ids and push them onto @ids array
-        my @ids_by_comma = split(/\,/, $ids);
-        foreach my $id_by_comma (@ids_by_comma) {
-            my @ids_for_range = split(/\.\./, $id_by_comma);
-            if ((scalar @ids_for_range) == 2) {
-                push @ids, $ids_for_range[0]..$ids_for_range[1];
-            }
-            elsif ((scalar @ids_for_range) == 1) {
-                push @ids, $ids_for_range[0];
-            }
-            else {
-                verbose (1, "\nWarning: Page $page id range $id_by_comma could not be parsed.");
-            }
+    # Parse the page ids and push them onto @ids array
+    my @ids_by_comma = split(/\,/, $ids);
+    foreach my $id_by_comma (@ids_by_comma) {
+        my @ids_for_range = split(/\.\./, $id_by_comma);
+        if ((scalar @ids_for_range) == 2) {
+            push @ids, $ids_for_range[0]..$ids_for_range[1];
+        }
+        elsif ((scalar @ids_for_range) == 1) {
+            push @ids, $ids_for_range[0];
+        }
+        else {
+            verbose (1, "\nWarning: Page $page id range $id_by_comma could not be parsed.");
         }
     }
+    
     return ('page' => $page, 'ids' => [@ids]);
 }
 
@@ -327,7 +313,7 @@ sub get_ids_from_db {
         || die $tt->error(), "\n";
 
         # Starts with a newline and comma
-        return split(/,/, substr($selected_ids, 2));
+        return split(/,/, substr($selected_ids, 1));
 }
 
 sub get_filename {

site-newdesign.cfg

@@ -0,0 +1,173 @@
+# Configure the Perl DBI driver to allow the templates communicate 
+# with the database.
+# dbi:<driver name [SQLite, CSV, ADO, mSQL, etc.]>:<database name>
+# For more information on Perl Template Toolkit see: 
+# http://template-toolkit.org/docs/manual/index.html
+[DBI]
+# Configuration settings for SQLite
+database: sqlite
+driver: dbi:SQLite:hpr.db 
+
+# Configure the location of the templates and the generated HTML
+[app_paths]
+templates_path: ./templates
+output_path: ./public_html
+
+# Configure the root template page which pulls in the navigation and 
+# content templates used by each page. An optional baseurl property may 
+# be defined. This is useful when opening files directly from local 
+# filesystem to allow relative paths to work.
+[root_template]
+content: page-newdesign.tpl.html
+#baseurl: OPTIONAL [i.e. file://<full path to local website directory>]
+http_baseurl: http://hackerpublicradio.org/
+hub_baseurl: https://hub.hackerpublicradio.org/
+media_baseurl: https://hub.hackerpublicradio.org/ccdn.php?filename=/eps/hpr$eps_id/
+generator_name: The HPR Robot
+generator_email: robot.nospam@nospam.hackerpublicradio.org
+
+# Configure the navigation menu and the content templates for each page 
+# of the site:
+#
+# [page_name] REQUIRED
+# navigation: REQUIRED <name of navigation template>
+# content: REQUIRED <name of page content template>
+
+# Configure filename if default name is not desired 
+# (Default is "ROOT/[page_name].html"):
+#
+# filename: OPTIONAL <relative path from ROOT -- optional>
+# * <directory path> -- Must end in forward slash. File will be created 
+#                       in this path with the default naming scheme.
+# * <file name> -- May include a relative path. Should include the file 
+#                  extension. May have [id] marker in path or name which 
+#                  will be substituted with a padded page id.
+
+# Configure pages which use the same content template:
+#
+# multipage: OPTIONAL true | false (DEFAULT = false)  
+
+[index]
+navigation: navigation-newdesign.tpl.html
+content: content-index-newdesign.tpl.html
+
+[about]
+navigation: navigation-newdesign.tpl.html
+content: content-about.tpl.html
+
+[correspondents]
+navigation: navigation-newdesign.tpl.html
+content: content-correspondents.tpl.html
+filename: correspondents/index.html
+
+[correspondent]
+navigation: navigation-newdesign.tpl.html
+content: content-correspondent.tpl.html
+multipage: true
+filename: correspondents/[id].html
+
+[series]
+navigation: navigation-newdesign.tpl.html
+content: content-series.tpl.html
+filename: series/index.html
+
+[series_episode]
+navigation: navigation-newdesign.tpl.html
+content: content-series_episode.tpl.html
+multipage: true
+filename: series/[id].html
+
+[episodes]
+navigation: navigation-newdesign.tpl.html
+content: content-episodes.tpl.html
+filename: eps/index.html
+
+[episode]
+navigation: navigation-newdesign.tpl.html
+content: content-episode.tpl.html
+multipage: true
+filename: eps/hpr[id]/index.html
+
+[download]
+navigation: navigation-newdesign.tpl.html
+content: content-download.tpl.html
+
+[syndication]
+navigation: navigation-newdesign.tpl.html
+content: content-syndication.tpl.html
+
+[search]
+navigation: navigation-newdesign.tpl.html
+content: content-search.tpl.html
+
+[sitemap]
+navigation: navigation-newdesign.tpl.html
+content: content-sitemap.tpl.html
+
+[tags]
+navigation: navigation-newdesign.tpl.html
+content: content-tags.tpl.html
+
+[twat_episode]
+navigation: navigation-newdesign.tpl.html
+content: content-twat_episode.tpl.html
+multipage: true
+filename: eps/twt[id]/index.html
+
+[mumble-howto]
+navigation: navigation-newdesign.tpl.html
+content: content-mumble-howto.tpl.html
+
+[contact]
+navigation: navigation-newdesign.tpl.html
+content: content-contact.tpl.html
+
+[promote]
+navigation: navigation-newdesign.tpl.html
+content: content-promote.tpl.html 
+
+[comments_viewer]
+navigation: navigation-newdesign.tpl.html
+content: content-comments_viewer.tpl.html
+
+[hpr_ogg]
+root_template: rss.tpl.xml
+content: rss-hpr.tpl.xml
+filename: hpr_ogg.rss
+media_file_extension: ogg
+
+[hpr_mp3]
+root_template: rss.tpl.xml
+content: rss-hpr.tpl.xml
+filename: hpr_mp3.rss
+media_file_extension: mp3
+audio_mime_type: mpeg
+
+[hpr_spx]
+root_template: rss.tpl.xml
+content: rss-hpr.tpl.xml
+filename: hpr_spx.rss
+media_file_extension: spx
+
+[hpr_total_ogg]
+root_template: rss.tpl.xml
+content: rss-hpr_total.tpl.xml
+filename: hpr_total_ogg.rss
+media_file_extension: ogg
+
+[hpr_total_mp3]
+root_template: rss.tpl.xml
+content: rss-hpr_total.tpl.xml
+filename: hpr_total_mp3.rss
+media_file_extension: mp3
+audio_mime_type: mpeg
+
+[hpr_total_spx]
+root_template: rss.tpl.xml
+content: rss-hpr_total.tpl.xml
+filename: hpr_total_spx.rss
+media_file_extension: spx
+
+[comments]
+root_template: rss-comments.tpl.xml
+filename: comments.rss

site.cfg

@@ -7,13 +7,6 @@
 # Configuration settings for SQLite
 database: sqlite
 driver: dbi:SQLite:hpr.db 
-#user:        (not used - leave blank)
-#password:    (not used - leave blank)
-# Configuration settings for MySQL
-#database: mysql
-#driver: dbi:mysql:database=hpr_hpr:hostname=localhost 
-#user: hpr-generator  (Suggested user with read-only privileges)
-#password: *********  (Password for user)
 
 # Configure the location of the templates and the generated HTML
 [app_paths]
@@ -27,11 +20,11 @@ output_path: ./public_html
 [root_template]
 content: page.tpl.html
 #baseurl: OPTIONAL [i.e. file://<full path to local website directory>]
-#baseurl: file:///home/roan/Development/hpr/website/hpr_generator/public_html/
-baseurl: https://hackerpublicradio.org/
+#baseurl: file:///home/user/Code/OpenSource/hpr/hpr_generator/public_html
 http_baseurl: http://hackerpublicradio.org/
 hub_baseurl: https://hub.hackerpublicradio.org/
 media_baseurl: https://archive.org/download/hpr$eps_id/
+#media_baseurl: https://hub.hackerpublicradio.org/ccdn.php?filename=/eps/hpr$eps_id/
 generator_name: The HPR Robot
 generator_email: robot.nospam@nospam.hackerpublicradio.org
 
@@ -97,6 +90,10 @@ content: content-episode.tpl.html
 multipage: true
 filename: eps/hpr[id]/index.html
 
+[download]
+navigation: navigation-get-shows.tpl.html
+content: content-download.tpl.html
+
 [syndication]
 navigation: navigation-get-shows.tpl.html
 content: content-syndication.tpl.html
@@ -117,13 +114,20 @@ content: content-tags.tpl.html
 navigation: navigation-get-shows.tpl.html
 content: content-twat_episode.tpl.html
 multipage: true
-filename: eps/twat[id]/index.html
-media_baseurl: https://www.hackerpublicradio.org/eps/
+filename: eps/twt[id]/index.html
 
 [mumble-howto]
 navigation: navigation-about.tpl.html
 content: content-mumble-howto.tpl.html
 
+[contact]
+navigation: navigation-about.tpl.html
+content: content-contact.tpl.html
+
+[promote]
+navigation: navigation-about.tpl.html
+content: content-promote.tpl.html 
+
 [comments_viewer]
 navigation: navigation-about.tpl.html
 content: content-comments_viewer.tpl.html

templates/content-about.tpl.html

@@ -66,8 +66,9 @@
   <p>See the section <a href="<!--% absolute_url(baseurl,'about.html#stuff_you_need_to_know') %-->" >stuff you need to know</a> for more information.</p>
   <h3 id="recent_policy_changes">Recent Policy Changes</h3>
   <ul>
+  <li><a href="https://lists.hackerpublicradio.com/pipermail/hpr/2024-October/004791.html">Clarification that contributions are CC BY-SA 4.0 unless otherwise stated</a></li>
   <li><a href="https://lists.hackerpublicradio.com/pipermail/hpr/2021-July/004191.html">HPR will move #oggcastplanet on libera, 
-  and we will also include links to the matrix, and <a href="https://botsin.space/@hpr">Mastodon</a> channel</a></li>
+  and we will also include links to the matrix</a>, and <a href="https://infosec.exchange/@hpr">Mastodon</a> channel</li>
   <li><a href="https://lists.hackerpublicradio.com/pipermail/hpr/2021-August/004200.html">Existing shows will be 
   flagged with the current version and new shows will default to "Attribution 4.0 International (CC BY 4.0)"</a></li>
   <li><a href="https://lists.hackerpublicradio.com/pipermail/hpr/2021-November/004328.html">The Intro Outro will be 
@@ -79,7 +80,7 @@
   <p>
   Our hosting is kindly provided by <a href="<!--% absolute_url(baseurl) %-->correspondents/0174.html">Josh</a> from 
   <a href="https://anhonesthost.com/shared-hosting/">AnHonestHost.com</a>. 
-  We would appreciate it if you could <a href="https://secure.anhonesthost.com/cart.php?gid=17">donate</a> to help 
+  We would appreciate it if you could <a href="https://secure.anhonesthost.com/store/hpr-hosting-cost-donations">donate</a> to help 
   reduce his costs in funding the hosting. He is also accepting bitcoins to <em>1KsxJr9HtsdaUeU7yaV9bk9bQi21UPBtUq</em>
   </p>
   <p>
@@ -89,25 +90,36 @@
   
   <hr />
 
-  <h1 id="contact">Contact<a href="<!--% absolute_url(baseurl,'about.html#contact') %-->">.</a></h1>
+  <h1 id="contact">Primary Contact Points<a href="<!--% absolute_url(baseurl,'about.html#contact') %-->">.</a></h1>
 
-  <p>We are always looking for more hosts...</p>
   <ul>
-    <li>email: <strong>admin -at- hackerpublicradio org</strong><br />
-    <em>As an anti-spam measure you will get an error back but we do get your email.</em></li>
-    <li>Website: <a href="<!--% absolute_url(baseurl,'') %-->" ><!--% absolute_url(baseurl,'') %--></a></li>
-    <li>Maillist: <a href="<!--% absolute_url(baseurl,'/maillist') %-->">Mailing list</a></li>
+    <li>email: <strong>admin -at- hackerpublicradio org</strong>, will put you in touch with the Janitors who are 
+    the first point of contact for any issues related to the HPR community. 
+    If you have any issue of concern please bring it to their attention first.
+    <br />
+    <em>As an anti-spam measure you may get an error back but we do get your email.</em></li>
+    <li>Website: <a href="<!--% absolute_url(baseurl,'') %-->" ><!--% absolute_url(baseurl,'') %--></a>. 
+    There is a comment link on each show where you can provide your constructive feedback.</li>
+    <li>Maillist: <a href="<!--% absolute_url(baseurl,'/maillist') %-->">Mailing list</a>. 
+    While the Janitors are the first point of contact, the HPR project is 
+    <a href="<!--% absolute_url(baseurl,'about.html#governance') %-->">governed</a> by the community.
+    Decisions about how Hacker Public Radio are made on the mailing list, and you can join it by going to :<br />
+    <a href="<!--% absolute_url(baseurl,'/maillist') %-->"><!--% absolute_url(baseurl,'/maillist') %--></a></li>
+    <li>Mastodon: <a href="https://infosec.exchange/@hpr">https://infosec.exchange/@hpr</a> is the official HPR Mastodon instance
+    and is actively monitored.</li>
+    <li>Matrix: <a href="https://matrix.to/#/#hpr:matrix.org" >https://matrix.to/#/#hpr:matrix.org</a> is the official HPR Matrix channel
+    and is actively monitored.</li>
+  </ul>
+  <h3 id="contact_secondary">Secondary Contact Points</h3>
+  <p>These platforms are monitored from time to time. Commenting here is less likely to get an immediate response.</p>
+  <ul>
+    <li><a href="https://t.me/+6fEhQrf5IEc4ZGU8">Telegram</a></li>
     <li><a href="https://web.libera.chat/gamja/?channels=oggcastplanet" >#oggcastplanet</a></li>
     <li><a href="https://www.facebook.com/home.php?sk=group_130169220378872¬if_t=group_r2j" >Facebook</a></li>
     <li><a href="https://www.linkedin.com/company/hackerpublicradio/" >Linked-In</a></li>
     <li><a href="http://itunes.apple.com/us/podcast/hacker-public-radio/id281699640" >iTunes</a></li>
   </ul>
-  <h2>Mail List</h2>
-  <p>
-  HPR is governed by the community, so decisions about how Hacker Public Radio should be run are made on the mailing list you can join it by going to :<br />
-  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="<!--% absolute_url(baseurl,'/maillist') %-->"><!--% absolute_url(baseurl,'/maillist') %--></a>
-  </p>
-
+  
   <hr />
   
   <h1 id ="press" >In the Press<a href="<!--% absolute_url(baseurl,'about.html#press') %-->">.</a></h1>
@@ -146,7 +158,7 @@
 
   <h2 id="podcatcher_support">Podcatcher Support</h2>
   <p>
-  Please report your experiences with our feeds to <!--% absolute_url(baseurl,'about.html#contact') %-->admin@hpr</a>. 
+  Please report your experiences with our feeds to admin@hpr</a>. 
   </p>
 
   <h2 id="other_ways_to_help">Other ways to help</h2>
@@ -276,7 +288,7 @@
   and we'll get in touch with you with all you need to know about getting your show published.<br />
   You can chat with other podcasters using IRC in the <strong>#oggcastplanet</strong> channel on the 
   <a href="https://web.libera.chat/gamja/?channels=oggcastplanet">libera.chat</a> network. 
-  Follow us on <a href="https://botsin.space/@hpr">Mastodon</a> (use the tag <strong>#hpr</strong>) 
+  Follow us on <a href="https://infosec.exchange/@hpr">Mastodon</a> (use the tag <strong>#hpr</strong>) 
   and on <a href="https://twitter.com/hpr">Twitter</a> (use the tag <strong>#hpr</strong>). 
   We have a <a href="https://www.facebook.com/HenryPartickReilly">Facebook</a> and 
   <a href="https://www.linkedin.com/groups?mostPopular=&amp;gid=3737302">LinkedIn</a> group, 
@@ -582,9 +594,10 @@
 
   <h1 id="reserve_queue">Feed the reserve queue<a href="<!--% absolute_url(baseurl,'about.html#reserve_queue') %-->">.</a></h1>
   <p>
-  The reserve queue is intended only to be used in the cases where there is still a gap in the schedule 24 hours prior to release. 
+  The reserve queue is intended only to be used in the cases where there is still a gap in the schedule one week prior to release. 
   This was known as the emergency queue, but now can also be used when the hosts don't care when the shows are scheduled. 
   They will be used on a first come first go basis, when there is no conflict with the scheduling guidelines.
+  These shows contain a message alerting listeners to the fact that we had free slots that were not filled.
   </p>
 
   <hr />
@@ -592,11 +605,12 @@
   <h1 id="scheduling_guidelines">Scheduling Guidelines</h1>
   <ol>
   <li>You must have your audio recording ready to upload <strong>before</strong> you pick a slot.</li>
+  <li>New hosts, Interviews, and other time critical shows should use the first free slot.</li>
   <li>Always try and fill any free slots that are available in the upcoming two weeks.</li>
-  <li>If the queue is filling up then please consider leaving some slots free for new contributors.</li>
-  <li>If you have a non urgent show then find a empty week and schedule it then.</li>
-  <li>If you are uploading a series of shows, consider scheduling one every two weeks.</li>
-  <li>Interviews may be released sooner.</li>
+  <li>When the queue is filling up then leave some slots free for new contributors.</li>
+  <li>Post non urgent shows into the first empty week.</li>
+  <li>If you are uploading a series of shows then post them one every two weeks.</li>
+  <li>If you have a non urgent show that is timeless, then add it to the <a href="<!--% absolute_url(baseurl,'about.html#reserve_queue') %-->">Reserve Queue</a>.</li>
   </ol>
   
   <hr />
@@ -821,7 +835,7 @@
     <li id="Short_Summary"><strong>Summary:</strong> <em>Mandatory</em><br />
     This is a short 100 character summary of what your show is about. 
     Please fill this out as it is used once the show has gone off the main page, on the mobile site, 
-    on printed brochures, on text to speech announcements, on twitter, <a href="https://botsin.space/@hpr">Mastodon</a> etc.</li>
+    on printed brochures, on text to speech announcements, on twitter, <a href="https://infosec.exchange/@hpr">Mastodon</a> etc.</li>
     <li id="Theme"><strong>Theme:</strong> <em>Automatic</em><br />
     The Intro, and the Outro will be added automatically. Please do not add it.
     </li>
@@ -858,42 +872,17 @@
       Your audio is completely inaccessible to those who have hearing problems, 
       so the only way for your show to be of help to them is if you distill the essence of the show into the show notes. 
       If you are using a script to prepare your show then include that.</li>
+      <li><strong>Adding the shownotes</strong>
+      <ul>
+	<li>Add text and use the WYSIWYG editor buttons to add additional formatting</li>
+	<li>Optionally - You can paste in <strong>Rendered</strong> HTML</li>
+	<li><strong>Do not paste un-rendored markup (HTML, Markdown,
+	RestructuredText)</strong> unless your intention is to have un-rendored
+	markup as shownotes.</li>
+	<li>The amount you can enter is restricted to 4000 characters, but you can provide additional show notes if you wish.
+            Please add them to an full_shownotes.html file which you can expect to be served from
+            <!--% absolute_url(baseurl) %-->eps/hpr9999/full_shownotes.html</li>
     </ul>
-    The amount you can enter is restricted to 4000 characters, but you can provide additional show notes if you wish. 
-    Please add them to an full_shownotes.html file which you can expect to be served from 
-    <!--% absolute_url(baseurl) %-->eps/hpr9999/full_shownotes.html<br /> <br />
-          <li>
-    If you wish to include text formatting then please use a format that supports it. We accept:
-
-    <ul>
-    <li>HTML5</li>
-    <li>Markdown (standard)</li>
-    <li>Markdown (GitHub flavoured)</li>
-    <li>Markdown (Pandoc flavoured)</li>
-    <li>RestructuredText</li>
-    <li>txt2tags</li>
-    <li>Plain text</li>
-    </ul> 
-
-    However please restrict yourself to text unless you are experienced producing valid markdown/HTML5. 
-    Regardless of the format you send your shownotes will end up in html5 &lt;article&gt; section, 
-    where the header and footer are not available to you. Avoid using &lt;div&gt; or &lt;span&gt;. 
-    The inclusion of JavaScript will send your show into quarantine, until an experienced HPR volunteer 
-    can be found to debug it.<br />
-    It takes us a lot longer to fix incorrectly formatted shownotes than plain text, so please only create formatted 
-    show notes if you know what you are doing and are sure that what you are writing is valid. 
-    </li>
-    <li id="shownotes_format"><strong>Show Note Format:</strong> <em>Optional</em><br />
-    Please tell us which format, if any you used when filling in your shownotes.
-    <ul>
-      <li><a href="https://www.w3schools.com/html/default.asp">HTML5</a></li>
-      <li><a href="https://en.wikipedia.org/wiki/Markdown">Markdown (standard)</a></li>
-      <li><a href="https://docs.github.com/en/get-started/writing-on-github/getting-started-with-writing-and-formatting-on-github/basic-writing-and-formatting-syntax">Markdown (GitHub flavoured)</a></li>
-      <li><a href="https://pandoc.org/MANUAL.html#pandocs-markdown">Markdown (Pandoc flavoured)</a></li>
-      <li><a href="https://docutils.sourceforge.io/docs/user/rst/quickstart.html">RestructuredText</a></li>
-      <li>Plain text having no formatting.</li>
-    </ul>
-    </li>
     
     <li id="series"><strong>Series:</strong> <em>Optional</em><br />
     Select the <a href="<!--% absolute_url(baseurl) %-->series/index.html">series</a> if any that your show is a part of.
@@ -1146,7 +1135,7 @@
   <li>You can join the <strong>#oggcastplanet</strong> channel on IRC. 
   Visit the <a href="http://webchat.freenode.net/?channels=oggcastplanet">freenode.net</a> network to sign up.</li>
   <li>A number of HPR messages may be found on Twitter and 
-  <a href="https://botsin.space/@hpr">Mastodon</a>.</li>
+  <a href="https://infosec.exchange/@hpr">Mastodon</a>.</li>
   <li>There is a <a href="https://t.me/+6fEhQrf5IEc4ZGU8">chat group on Telegram</a></li>
   <li>An HPR tradition exists where we record a 26-hour show at the turn of the year celebrating the 
     arrival of the New Year around the world. We use Mumble to record the show and anyone can connect 

templates/content-comments_viewer.tpl.html

@@ -1,8 +1,9 @@
 <!--% PROCESS 'shared-episode-summary.tpl.html' %-->
 <!--% PROCESS 'shared-utils.tpl.html' %-->
 <!--% PROCESS 'shared-listen-now.tpl.html' %-->
-<!--% PROCESS "queries-episode-${constants.database}.tpl.html" %-->
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% PROCESS "queries-episode.tpl.html" %-->
+<!--% USE DBI(constants.driver) %-->
+
 <h2>Comment Viewer</h2>
 <p>Because of the spammers we have had to turn on comment moderation. Sorry about the delay this will cause.</p>
 <p><a href="<!--% absolute_path(baseurl) %-->comments.rss">Subscribe</a> to the comment feed.</p>
@@ -28,7 +29,7 @@
 
 <article>
 <header>
-	<h1><a href="<!--% absolute_path(baseurl) %-->eps/hpr<!--% zero_pad_left(item.eps_id) %-->/index.html#comment_<!--% item.comment_id %-->"><!--% item.comment_author_name %--> says</a>: <!--% item.comment_title %--></h1>
+	<h1><!--% item.comment_author_name %--> says: <!--% item.comment_title %--></h1>
 	<p><small>Posted at <!--% item.comment_timestamp %--> relating to the show <a href="<!--% absolute_path(baseurl) %-->eps/hpr<!--% zero_pad_left(item.eps_id) %-->/index.html">hpr<!--% item.eps_id %--></a> which was released on <!--% item.episode_date %--> by <a href="<!--% absolute_path(baseurl) %-->correspondents/<!--% zero_pad_left(item.host_id) %-->.html"><!--% item.host %--></a> entitled <em><!--% item.episode_title %--></em></small>
 </p>
 </header>

templates/content-contact.tpl.html

@@ -0,0 +1,21 @@
+<article>
+    <header>
+        <h1>Contact</h1>
+    </header>
+    <p>We are always looking for more hosts...</p>
+    <ul>
+      <li>email: <strong>admin -at- hackerpublicradio org</strong><br />
+      <em>As an anti-spam measure you will get an error back but we do get your email.</em></li>
+      <li>Website: <a href="http://www.hackerpublicradio.org" target="_blank">www.hackerpublicradio.org</a></li>
+      <li>Mailist: <a href="http://www.hackerpublicradio.org/maillist" target="_blank">Maillist</a></li>
+      <li><a href="https://web.libera.chat/gamja/?channels=oggcastplanet" target="_blank">#oggcastplanet</a></li>
+      <li><a href="https://www.facebook.com/home.php?sk=group_130169220378872¬if_t=group_r2j" target="_blank">Facebook</a></li>
+      <li><a href="https://www.linkedin.com/company/hackerpublicradio/" target="_blank">Linked-In</a></li>
+      <li><a href="http://itunes.apple.com/us/podcast/hacker-public-radio/id281699640" target="_blank">iTunes</a></li>
+    </ul>
+    <h2>Mail List</h2>
+    <p>
+    HPR is governed by the community, so decisions about how Hacker Public Radio should be run are made on the mailing list you can join it by going to :<br />
+    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="http://www.hackerpublicradio.org/maillist">http://www.hackerpublicradio.org/maillist</a>
+    </p>
+</article>

templates/content-correspondent.tpl.html

@@ -1,17 +1,12 @@
 <!--% PROCESS 'shared-episode-summary.tpl.html' %-->
 <!--% PROCESS 'shared-avatar.tpl.html' %-->
 <!--% PROCESS 'shared-utils.tpl.html' %-->
-<!--% PROCESS "queries-correspondent-${constants.database}.tpl.html" %-->
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
-<!--% query_hpr_show_count = DBI.prepare('
-		SELECT id
-		FROM eps
-		WHERE eps.hostid = ?
-		')
-%-->
+<!--% PROCESS "queries-correspondent.tpl.html" %-->
+<!--% USE DBI(constants.driver) %-->
 <!--% results_hpr_shows = DBI.prepare(query_hpr_shows)
 %-->
-<!--% hpr_shows_to_count = query_hpr_show_count.execute(id); %-->
+<!--% results_hpr_show_count = DBI.prepare(query_hpr_show_count) %-->
+<!--% hpr_shows_to_count = results_hpr_show_count.execute(id); %-->
 <!--% hpr_shows = results_hpr_shows.execute(id); %-->
 <!--% hpr_show_count = 0 %-->
 <!--% FOREACH show IN hpr_shows_to_count %-->

templates/content-correspondents.tpl.html

@@ -2,8 +2,8 @@
 <!--% PROCESS 'shared-avatar.tpl.html' %-->
 <article>
 	<h2 class="title">Correspondents</h2>
-	<p>For more information on how to become a Correspondent see our <a href="<!--% absolute_url(baseurl) %-->about.html#so_you_want_to_record_a_podcast">contribute</a></center> page. To add a logo here, either email one to admin at hpr or setup your email on <a href="https://en.gravatar.com/">Gravatar</a>. To protect your browsing privacy we gather the images every hour and serve them directly from HPR.<p />
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+	<p>For more information on how to become a Correspondent see our <a href="<!--% absolute_url(baseurl) %-->about.html#so_you_want_to_record_a_podcast">contribute</a> page. To add a logo here, either email one to admin at hpr or setup your email on <a href="https://en.gravatar.com/">Gravatar</a>. To protect your browsing privacy we gather the images every hour and serve them directly from HPR.</p>
+<!--% USE DBI(constants.driver) %-->
 <!--% host_cnt = 0 %-->
 	<table class="hosts">
 	<th >Avatar</th>
@@ -18,7 +18,7 @@
 		on h.hostid = e.hostid
 		order by h.host'
 	) %-->
-	<tr height="80">
+	<tr>
 	<td><!--% get_avatar(host.hostid, host.host, host_cnt > 8) %--></td>
 
 		<td><strong><!--% host.host %--></strong><br>

templates/content-download.tpl.html

@@ -0,0 +1,56 @@
+<article>
+	<header>
+        <h1>Download Archive</h1>
+        <p>Please be aware that our Archive exceeds <strong>62Gb</strong> <em>(Ogg: 21Gb, Spx: 16Gb, mp3: 25Gb)</em>. We are happy for you to download them, but please make sure that you are not going to incur additional bandwidth charges on your side.</p>
+        <p>We will be happy to post you DVD's of the episodes anywhere in the world if bandwidth is an issue.</p>
+    </header>
+        <h2>Full Episode Guide</h2>
+        <p>
+        The <a href="./eps/index.html">compete episode guide</a> is available to you, and it lists all the shows on one page going right back to the very first episode.
+        </p>
+        <h2>Command line download</h2>
+        <p>
+        You can download the audio of the episodes directly from the command line using the following commands:
+        </p>
+        <ul>
+          <li>ogg:<br />
+          <span style="font-family:monospace;">curl 'https://www.hackerpublicradio.org/eps/hpr[0001-3657].ogg' -o "hpr#1.ogg"</span></li>
+          <li>spx:<br />
+          <span style="font-family:monospace;">curl 'https://www.hackerpublicradio.org/eps/hpr[0001-3657].spx' -o "hpr#1.spx"</span></li>
+          <li>mp3:<br />
+          <span style="font-family:monospace;">curl 'https://www.hackerpublicradio.org/eps/hpr[0001-3657].mp3' -o "hpr#1.mp3"</span></li>
+        </li>
+        </ul>
+        <h2>Full RSS feed, BitTorrent and Magnet links</h2>
+        <p>The full rss feed is updated daily and contains the complete show note with links to supporting articles. The torrent/magnet also contains this information and is a snaphot of the archive taken between 2007 and November 2013. </p>
+        <ul>
+          <li><span style="font-family:monospace;">ogg: <a href="hpr_total_ogg_rss.php">rss</a>, <a href="https://www.talkgeektome.us/torrents/HPR-Ogg-2007-Nov2013.torrent">torrent</a>, <a href="magnet:?xt=urn:btih:390C66903BBB2B6A067C438C70B2E90988AA8207&dn=HPR-Ogg-2007-Nov2013&tr=http%3A%2F%2Ftracker.info-underground.net%3A16880%2Fannounce">magnet</a></span></li>
+          <li><span style="font-family:monospace;">spx: <a href="hpr_total_spx_rss.php">rss</a>, <a href="https://www.talkgeektome.us/torrents/HPR-Mp3-2007-Nov2013.torrent">torrent</a>, <a href="magnet:?xt=urn:btih:E2573BEF0209B8C2E3C7908BAF220EC34D4A5B8E&dn=HPR-Speex-2007-Nov2013&tr=http%3A%2F%2Ftracker.info-underground.net%3A16880%2Fannounce">magnet</a></span></li>
+          <li><span style="font-family:monospace;">mp3: <a href="hpr_total_rss.php">rss</a>, <a href="https://www.talkgeektome.us/torrents/HPR-Mp3-2007-Nov2013.torrent">torrent</a>, <a href="magnet:?xt=urn:btih:6E9492AD78BCCA2B8D6A42C9C0BCAB0E6FA778F8&dn=HPR-Mp3-2007-Nov2013&tr=http%3A%2F%2Ftracker.info-underground.net%3A16880%2Fannounce">magnet</a></span></li>
+        </ul>
+        <h3>Direct download of the remaining shows</h3>
+        <p>
+        You can download the remaining episodes since the torrent was created directly from the command line using the following commands:
+        </p>
+        <ul>
+          <li>ogg:<br />
+          <span style="font-family:monospace;">curl 'https://www.hackerpublicradio.org/eps/hpr[1391-3657].ogg' -o "hpr#1.ogg"</span>
+          </li>
+        </li>
+        </ul>
+        <ul>
+          <li>spx:<br />
+          <span style="font-family:monospace;">curl 'https://www.hackerpublicradio.org/eps/hpr[1391-3657].spx' -o "hpr#1.spx"</span>
+          </li>
+        </li>
+        </ul>
+        <ul>
+          <li>mp3:<br />
+          <span style="font-family:monospace;">curl 'https://www.hackerpublicradio.org/eps/hpr[1391-3657].mp3' -o "hpr#1.mp3"</span>
+          </li>
+        </li>
+        </ul>
+      <footer>
+      <p>Big to DeepGeek and the team for providing the BitTorrent service.</p>
+      </footer>
+</article>

templates/content-episode.tpl.html

@@ -3,7 +3,7 @@
 <!--% PROCESS 'shared-utils.tpl.html' %-->
 <!--% PROCESS 'shared-listen-now.tpl.html' %-->
 <!--% PROCESS 'shared-show-transcript.tpl.html' %-->
-<!--% PROCESS "queries-episode-${constants.database}.tpl.html" %-->
+<!--% PROCESS "queries-episode.tpl.html" %-->
 <!--% USE DBI(constants.driver, constants.user, constants.password) %-->
 <!--% query_episodes = DBI.prepare(query_episode_maxmin) %-->
 <!--% episode_result = query_episodes.execute(id, id, id, id, id) %-->
@@ -17,11 +17,10 @@
 		<p class="meta"><!--% episode_navigation %-->
 		</p>
 <p><!--% show_avatar(episode.hostid, episode.host) %-->
-Hosted by <a href="<!--% absolute_path(baseurl) %-->correspondents/<!--% zero_pad_left(episode.hostid) %-->.html"><!--% episode.host %--></a> on <span><!--% episode.date %--></span> is flagged as <span><!--% display_explicit(episode.explicit) %--></span> and is released under a <span><!--% episode.license %--> license</span>. <br>
+Hosted by <a href="<!--% absolute_path(baseurl) %-->correspondents/<!--% zero_pad_left(episode.hostid) %-->.html"><!--% episode.host %--></a> on <span><!--% day_and_date(episode.date) %--></span> is flagged as <span><!--% display_explicit(episode.explicit) %--></span> and is released under a <span><!--% episode.license %--> license</span>. <br>
 <!--% display_tags(episode.tags) %-->
 
 <label>Comments: </label><!--% display_comments_tally(episode.id, episode.eps_tally) %--> <br>
-The show is available on the Internet Archive at: <a href="https://archive.org/details/hpr<!--% zero_pad_left(episode.id) %-->">https://archive.org/details/hpr<!--% zero_pad_left(episode.id) %--></a>
 <!--% listen_now(episode, "hpr", baseurl, media_baseurl) %-->
 </p>
 <h3><!--% show_series(episode.series, episode.seriesid, "Part of the series") %--></h3> 
@@ -29,7 +28,6 @@ The show is available on the Internet Archive at: <a href="https://archive.org/d
 	</header>
 	<div><!--% episode.notes %--></div>
 <footer>
-<!--% show_transcript(episode, "hpr", baseurl, media_baseurl) %-->
 <p>
 <!--% episode_navigation %-->
 </p>
@@ -56,8 +54,8 @@ Subscribe to the comments <a href="<!--% absolute_path(baseurl) %-->comments.rss
 <!--% FOREACH comment IN comments_result %-->
 <h5 id="comment_<!--% comment.id %-->"><a href="/eps/hpr<!--% zero_pad_left(episode.id) %-->/index.html#comment_<!--% comment.id %-->">Comment #<!--% comment_index %--></a> posted on <!--% comment.comment_timestamp %--> by <!--% comment.comment_author_name %--></h5>
 <h4><!--% comment.comment_title %--></h4>
-<!--% comment.comment_text FILTER html_para %-->
-<!--% comment_index = comment_index + 1 %-->
+<p class="comment"><!--% comment.comment_text FILTER html_line_break %--></p>
+<!--% comment_index = comment_index + 1 %--> 
 <!--% END %-->
 
         <h2>Leave Comment</h2>
@@ -110,9 +108,18 @@ Subscribe to the comments <a href="<!--% absolute_path(baseurl) %-->comments.rss
 	</tr>
 <!-- . -->
 	<tr>
-	<td>What is the <strong>HOST_ID</strong> for the host of this show?</td>
+	<td>Who is the <strong>host</strong> of this show?</td>
 	<td>
-	<input required type="text" name="hostid" size="20" maxlength="5" placeholder="Type the host number"></td>
+	<select required name="hostid" id="hostid">
+		<option value="Spammer" selected="selected">Spammer</option>
+		<option value="Spammer">Linus Torvalds</option>
+		<option value="Spammer">Marie Curie</option>
+		<option value="<!--% episode.hostid %-->"><!--% episode.host %--></option>
+		<option value="Spammer">Alan Turing</option>
+		<option value="Spammer">Terry Pratchett</option>
+		<option value="Spammer">Yuri Gagarin</option>
+	</select>
+		<td>
 	<td>
 <!-- . -->
 	<tr>

templates/content-episodes.tpl.html

@@ -1,5 +1,5 @@
  <!--% PROCESS 'shared-episode-summary.tpl.html' %-->
- <!--% PROCESS "queries-episodes-${constants.database}.tpl.html" %-->
+ <!--% PROCESS "queries-episodes.tpl.html" %-->
 <article>
     <header>
         <h1>Complete Archive of Shows.</h1>
@@ -7,13 +7,13 @@
         All this information is available to the public. Scrape if you wish but if we can format the data for you then we're happy to help.
         </p>
     </header>
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% USE DBI(constants.driver) %-->
 <!--% FOREACH episodes IN DBI.query(query_episodes) 
 %-->
 	<!--% show_summary(episodes) %-->
 	<p class="listen-in"><!--% display_listen_in(episodes.id) %--></p>
 <!--% END %-->
-<h2 id="twat_episodes">Today With a Techie Archived Shows</h2>
+<h2 id="twt_episodes">Today With a Techie Archived Shows</h2>
 	<p>
 		<!-- Creative Commons License -->
 		<a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/2.5/"><img alt="Creative Commons License" border="0" src="https://creativecommons.org/images/public/somerights20.png" width="88" height="31" /></a><br>The following work is licensed under a <a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/2.5/">Creative Commons Attribution-NonCommercial-ShareAlike 2.5 License</a>.</p>

templates/content-index-newdesign.tpl.html

@@ -0,0 +1,98 @@
+<!--% PROCESS 'shared-avatar.tpl.html' %-->
+<!--% PROCESS 'shared-utils.tpl.html' %-->
+<!--% PROCESS 'shared-listen-now.tpl.html' %-->
+<!--% PROCESS 'shared-show-transcript.tpl.html' %-->
+<!--% PROCESS 'shared-call_for_shows.tpl.html' %-->
+<!--% INCLUDE 'content-index-announcement.tpl.html' %-->
+<!--% PROCESS "queries-index.tpl.html" %-->
+<!--% MACRO tidy_notes(all_lines) BLOCK %-->
+<!--% lines = all_lines %-->
+<!--% after_html = all_lines %-->
+<!--% img_re = '(?six)^(.*?)\<img ([^\>]+\>)(.+)$' %-->
+<!--% lazy_re = '(?i)loading="lazy"' %-->
+<!--% WHILE (matches = lines.match(img_re)) %-->
+<!--% 	img_tag = matches.1 %-->
+<!--% 	after_html = matches.2 %-->
+<!--% 	matches.0 %-->
+<!--% 	IF (img_tag.search(lazy_re)) %-->
+    <img <!--% img_tag %-->
+<!--% 	ELSE %-->
+    <img loading="lazy" <!--% img_tag %-->
+<!--% 	END %-->
+<!--% 	lines = after_html %-->
+<!--% END %-->
+<!--% after_html %-->
+<!--% END %-->
+
+<section class="welcome">
+	<!--% days_till_next_episode = 0 %-->
+	<!--% USE DBI(constants.driver) %-->
+	<!--% USE date %-->
+	<!--% calc = date.calc %-->
+	<!--% episodes = DBI.query(query_next_available_episode).get_all() %-->
+	<!--% last_date = episodes.0.date.split('-') %-->
+	<!--% offset = (calc.Day_of_Week(last_date.0,last_date.1,last_date.2) == 5 ? 3 : 1) %-->
+	<!--% slot_date = calc.Add_Delta_Days(last_date.0,last_date.1,last_date.2,offset) %-->
+	<!--% now = calc.Today() %-->
+	<!--% 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')) %-->
+	
+	<h2>Welcome</h2>
+	<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>
+	<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>
+</section>
+
+<!--% display_call_for_shows() %-->
+
+<h2>Podcast</h2>
+<section class="podcast">
+	<a class="podcast record" href="<!--% absolute_url(baseurl) %-->about.html#so_you_want_to_record_a_podcast">
+		<p>Record</p>
+	</a>
+	<a class="podcast schedule" href="<!--% hub_baseurl %-->calendar.php">
+		<p>Schedule</p>
+	</a>
+	<a class="podcast subscribe" href="<!--% absolute_path(baseurl) %-->syndication.html">
+		<p>Subscribe</p>
+	</a>
+	<a class="podcast listen" href="<!--% absolute_path(baseurl) %-->eps/index.html">
+		<p>Listen</p>
+	</a>
+</section>
+
+<h2>Project</h2>
+<section class="project">
+	<a class="project host" href="<!--% absolute_path(baseurl) %-->correspondents/index.html">
+		<p>Hosts</p>
+	</a>
+	<a class="project series" href="<!--% absolute_path(baseurl) %-->series/index.html">
+		<p>Series</p>
+	</a>
+	<a class="project about" href="<!--% absolute_path(baseurl) %-->about.html">
+		<p>About</p>
+	</a>
+</section>
+
+<div class="column-container">
+	<section class="episodes">
+		<h2>Latest Episodes</h2>
+		<ul>
+<!--% host_cnt = 0 %-->
+<!--% FOREACH latest_episodes IN DBI.query(query_latest_episodes) %-->
+			<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 %-->
+		</ul>
+		<p><a href="<!--% absolute_path(baseurl) %-->eps/index.html">View all episodes</a></p>
+	</section>
+	
+	<section class="comments">
+		<h2>Latest Comments</h2>
+		<ul>
+<!--% FOREACH last_5_weeks_episodes IN DBI.query(query_last_5_weeks_episodes).slice(0,4) %-->
+			<li><!--% show_summary(last_5_weeks_episodes) %--></li>
+<!--% END %-->
+		</ul>
+		<p><a href="<!--% absolute_path(baseurl) %-->comments_viewer.html">View all comments</a></p>
+	</section>
+</div>

templates/content-index.tpl.html

@@ -4,7 +4,7 @@
 <!--% PROCESS 'shared-show-transcript.tpl.html' %-->
 <!--% PROCESS 'shared-call_for_shows.tpl.html' %-->
 <!--% INCLUDE 'content-index-announcement.tpl.html' %-->
-<!--% PROCESS "queries-index-${constants.database}.tpl.html" %-->
+<!--% PROCESS "queries-index.tpl.html" %-->
 <!--% MACRO tidy_notes(all_lines) BLOCK %-->
 <!--% lines = all_lines %-->
 <!--% after_html = all_lines %-->
@@ -29,7 +29,7 @@
         <h3>Welcome to HPR, the Community Podcast</h3>
     </header>
 	<!--% days_till_next_episode = 0 %-->
-	<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+	<!--% USE DBI(constants.driver) %-->
 	<!--% USE date %-->
 	<!--% calc = date.calc %-->
 	<!--% episodes = DBI.query(query_next_available_episode).get_all() %-->
@@ -40,7 +40,7 @@
 	<!--% 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#twat_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>
+	<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>
@@ -55,21 +55,18 @@
 			<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 <!--% latest_episodes.date %--> is flagged as <!--% display_explicit(latest_episodes.explicit) %--> and released under a <!--% latest_episodes.license %--> license. <br>
+	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>
-		<!--% tidy_notes(latest_episodes.notes) %-->
-	<footer>
-	<!--% show_transcript(latest_episodes, "hpr", baseurl, media_baseurl) %-->
-	</footer>
+		<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>
 <!--% host_cnt = host_cnt + 1 %-->
 <!--% END %-->
-<article>
+<article id="previous_five_weeks">
     <header>
         <hr>
         <h1>Previous five weeks</h1>

templates/content-promote.tpl.html

@@ -0,0 +1,22 @@
+<article>
+    <header>
+        <h1>Please promote HPR</h1>
+    </header>
+<p>Feel free to use the promotional material to spread the word in your podcasts, or have them played on to other shows.</p>
+<h2>General HPR promotion</h2>
+<ul>
+<li><a href="./media/promos/HPRpromoKlaatu.ogg">Klaatu explains HPR Daily podcast by the www.hackerpublicradio.org Community for the www.hackerpublicradio.org Community</a></li>
+<!--<li><a href="../media/promos/HPRpromoNewsCast.ogg">A News Caster tells us about HPR</a></li> 
+<li><a href="../media/promos/HPRpromoSkirlet.ogg">Skirlet tells us we need to listen to HPR</a></li>-->
+</ul>
+
+<h2>Requests for contributions</h2>
+<p>
+<ul>
+<li><a href="./media/promos/Jude-aka-Mrs_Peter64_HPR-needs-shows.flac">Jude Mrs. Peter64 HPR needs shows</a></li>
+<li><a href="./media/promos/hpr-contributor-promo-sax.ogg">slick0 basenet theme</a></li>
+<li><a href="./media/promos/hpr-contributor-promo-basenettheme.ogg">slick0 sax roll</a></li>
+</ul>
+</p>
+
+</article>

templates/content-series.tpl.html

@@ -1,7 +1,7 @@
 <!--% PROCESS 'shared-utils.tpl.html' %-->
-<!--% PROCESS "queries-series-${constants.database}.tpl.html" %-->
+<!--% PROCESS "queries-series.tpl.html" %-->
   <article>
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% USE DBI(constants.driver) %-->
 <h1 class="title">In-Depth Series</h1>
 <!--% FOREACH series IN DBI.query(query_episodes) %-->
 	<h2><a href="<!--% absolute_path(baseurl) %-->series/<!--% zero_pad_left(series.id) %-->.html"><!--% series.name %--></a></h2>

templates/content-series_episode.tpl.html

@@ -1,7 +1,7 @@
 <!--% PROCESS 'shared-episode-summary.tpl.html' %-->
 <!--% PROCESS 'shared-avatar.tpl.html' %-->
-<!--% PROCESS "queries-series_episodes-${constants.database}.tpl.html" %-->
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% PROCESS "queries-series_episodes.tpl.html" %-->
+<!--% USE DBI(constants.driver) %-->
 <!--% query_series = DBI.prepare(query_series_sql)
 %-->
 <!--% series_result = query_series.execute(id) %-->

templates/content-sitemap.tpl.html

@@ -5,7 +5,7 @@
     <li><a href="<!--% absolute_path(baseurl) %-->index.html"><strong>Home</strong></a> ← The HPR Homepage</li>
     <li><a href="<!--% absolute_path(baseurl) %-->syndication.html">Get Shows</a> ← The RSS Syndication Feeds</li>
     <ul>
-		<li><a href="<!--% absolute_path(baseurl) %-->correspondents/index.html">Full Episode Guide</a> ← Complete list of all the Shows.</li>
+		<li><a href="<!--% absolute_path(baseurl) %-->eps/index.html">Full Episode Guide</a> ← Complete list of all the Shows.</li>
       <li><a href="<!--% absolute_path(baseurl) %-->series/index.html">In-Depth Series</a> ← Overview of the In-Depth Series.</li>
       <li><a href="<!--% absolute_url(baseurl) %-->about.html#download">Download Options</a> ← How to download the entire archive.</li>
     </ul>

templates/content-syndication.tpl.html

@@ -20,9 +20,9 @@
   Every month, the HPR Janitors put down their mops had have a chat about all the shows, and what else has been going on in the HPR community. This is a regular show scheduled for the first Monday of the month. 
   </p>
   <ul>
-    <li><a href="<!--% absolute_path(baseurl) %-->hpr_ogg_rss.php?series=47">ogg</a> Larger file size higher quality feed.</li>
-    <li><a href="<!--% absolute_path(baseurl) %-->hpr_spx_rss.php?series=47">mp3</a> Larger file size regular quality feed in a common format.</li>
-    <li><a href="<!--% absolute_path(baseurl) %-->hpr_mp3_rss.php?series=47">spx</a> Small file size lower quality feed. <br/>Ideal for dial-up/mobile connections.</li>
+    <li><a href="<!--% absolute_path(baseurl) %-->hpr_opus_rss.php?series=47">opus</a>.</li>
+    <li><a href="<!--% absolute_path(baseurl) %-->hpr_ogg_rss.php?series=47">ogg</a>.</li>
+    <li><a href="<!--% absolute_path(baseurl) %-->hpr_mp3_rss.php?series=47">mp3</a>.</li>
   </ul>
   <p>
   We also maintain an <a href="https://archive.org/details/hackerpublicradio?and[]=subject%3A%22Community+News%22">Archive.org</a> page where you can get the shows in even more formats.
@@ -37,9 +37,9 @@
   Use these feeds to keep up to date with the latest HPR Episodes.
   </p>
   <ul>
-    <li><a href="<!--% absolute_url(baseurl) %-->hpr_ogg_rss.php">ogg</a> Larger file size higher quality feed.</li>
-    <li><a href="<!--% absolute_url(baseurl) %-->hpr_rss.php">mp3</a> Larger file size regular quality feed in a common format.</li>
-    <li><a href="<!--% absolute_url(baseurl) %-->hpr_spx_rss.php">spx</a> Small file size lower quality feed. <br/>Ideal for dial-up/mobile connections.</li>
+    <li><a href="<!--% absolute_url(baseurl) %-->hpr_opus_rss.php">opus</a>.</li>
+    <li><a href="<!--% absolute_url(baseurl) %-->hpr_ogg_rss.php">ogg</a>.</li>
+    <li><a href="<!--% absolute_url(baseurl) %-->hpr_rss.php">mp3</a>.</li>
   </ul>
   <p>
   We also maintain an <a href="https://archive.org/details/hackerpublicradio">Archive.org</a> page where you can get the shows in even more formats. For more recent shows we are now including the original upload as delivered.
@@ -53,9 +53,9 @@
     Use this feed to get the archived episodes. The feed themselves run over 15Mb in size and so use them to download the archived episodes and when you are up to date switch back to the Two Week Feeds listed above.
   </p>
   <ul>
-    <li><a href="<!--% absolute_path(baseurl) %-->hpr_total_ogg_rss.php">ogg feed</a> Warning over 50G</li>
-    <li><a href="<!--% absolute_path(baseurl) %-->hpr_total_spx_rss.php">spx feed</a> Warning over 22G</li>
-    <li><a href="<!--% absolute_path(baseurl) %-->hpr_total_rss.php">mp3 feed</a> Warning over 36G</li>
+    <li><a href="<!--% absolute_path(baseurl) %-->hpr_total_opus_rss.php">opus feed</a> Warning over 62G</li>
+    <li><a href="<!--% absolute_path(baseurl) %-->hpr_total_ogg_rss.php">ogg feed</a> Warning over 71G</li>
+    <li><a href="<!--% absolute_path(baseurl) %-->hpr_total_rss.php">mp3 feed</a> Warning over 70G</li>
   </ul>
 </article>
 <article>
@@ -112,8 +112,8 @@
 <article>
   <header>
   <h1>Download Archive</h1>
-  <p>Please be aware that our Archive exceeds <strong>62Gb</strong> <em>(Ogg: 21Gb, Spx: 16Gb, mp3: 25Gb)</em>. We are happy for you to download them, but please make sure that you are not going to incur additional bandwidth charges on your side.</p>
-  <p>We will be happy to post you DVD's of the episodes anywhere in the world if bandwidth is an issue.</p>
+  <p>Please be aware that our Archive exceeds <strong>200Gb</strong></em>. We are happy for you to download them, but please make sure that you are not going to incur additional bandwidth charges on your side.</p>
+  <p>We will be happy to physically send episodes anywhere in the world if bandwidth is an issue.</p>
   </header>
   <h2>Full Episode Guide</h2>
   <p>

templates/content-tags.tpl.html

@@ -1,30 +1,30 @@
 <!--% PROCESS 'shared-utils.tpl.html' %-->
-<!--% PROCESS "queries-tags-${constants.database}.tpl.html" %-->
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% PROCESS "queries-tags.tpl.html" %-->
+<!--% USE DBI(constants.driver) %-->
 <!--% PERL %-->
 $Template::Stash::PRIVATE = undef; # Allow . in tag
 <!--% END %-->
+<!--% USE String %-->
 <!--% uniq_tag_count = 0 %-->
-<!--% comma_re = '(?x)(?:^|,\s*)(?:"((?>[^"]*)(?:""[^"]*)*)"|([^",]*))'; %-->
-<!--# 'Moka5,interview, "computer science"' -->
 <!--% FOREACH episode IN DBI.query(query_tags);
     ep_id = episode.id;
     ep_tags = episode.tags;
-    FOREACH tag_str IN ep_tags.split(comma_re);
+    FOREACH tag_str IN ep_tags.csv_parse;
         NEXT UNLESS tag_str;
         NEXT IF tag_str == '';
         tag = tag_str.lower;
+		tag_index = String.new(tag).push('_');
         first_char = tag.substr(0,1);
         IF first_char == '.';
             first_char = '&#x0002E;'; # Unicode .
         END;
-        IF all_tags.${first_char}.exists(tag);
-            all_tags.${first_char}.${tag}.count = all_tags.${first_char}.${tag}.count + 1;
-            all_tags.${first_char}.${tag}.urls.push(ep_id);
+        IF all_tags.${first_char}.exists(tag_index);
+            all_tags.${first_char}.${tag_index}.count = all_tags.${first_char}.${tag_index}.count + 1;
+            all_tags.${first_char}.${tag_index}.urls.push(ep_id);
         ELSE;
-            all_tags.${first_char}.${tag}.count = 1;
+            all_tags.${first_char}.${tag_index}.count = 1;
             uniq_tag_count = uniq_tag_count + 1;
-            all_tags.${first_char}.${tag}.urls = [ep_id];
+            all_tags.${first_char}.${tag_index}.urls = [ep_id];
         END;
     END;
 END %-->
@@ -53,7 +53,7 @@ END %-->
 	<ul class="columns3">
     <!--% FOREACH first_char IN all_first %-->
         <!--% IF all_tags.${first_char} %-->
-            <li><a href="<!--% absolute_path(baseurl) %-->tags.html#<!--% all_tags.${first_char}.keys.sort.first %-->"><strong><!--% first_char %--></strong></a></li>
+            <li><a href="<!--% absolute_path(baseurl) %-->tags.html#<!--% tag_to_id(String.new(all_tags.${first_char}.keys.sort.first).chop) %-->"><strong><!--% first_char %--></strong></a></li>
         <!--% END %-->
     <!--% END %-->
 	</ul>
@@ -63,11 +63,12 @@ END %-->
 		<p class="ralign"><a href="<!--% absolute_path(baseurl) %-->tags.html#TOP">&UpArrow; Go to index</a></p>
 	        <h3>Tags beginning with '<!--% first_char %-->'</h3>
 	        <ul>
-                <!--% FOREACH tag IN all_tags.${first_char}.keys.sort %-->
+                <!--% FOREACH tag_index IN all_tags.${first_char}.keys.sort %-->
+				<!--% tag = String.new(tag_index).chop; tag_id = String.new(tag_index).chop; %-->
     	        	<li>
-    	        		<a id="<!--% tag %-->"><strong><!--% tag %--></strong></a>: 
+    	        		<a id="<!--% tag_to_id(tag_id) %-->"><strong><!--% tag %--></strong></a>: 
                         <!--% ep_links = [] %-->
-                        <!--% FOREACH ep_id IN all_tags.${first_char}.${tag}.urls.nsort;
+                        <!--% FOREACH ep_id IN all_tags.${first_char}.${tag_index}.urls.nsort;
 							ep_links.push("<a href=\"${absolute_path(baseurl)}eps/hpr" _ zero_pad_left(ep_id) _ '/index.html"'
                                 ' target="_blank" aria-label="' _ tag _
                                 ' - show ' _ ep_id _ '">' _ ep_id _ '</a>');

templates/content-twat_episode.tpl.html

@@ -2,7 +2,7 @@
 <!--% PROCESS 'shared-avatar.tpl.html' %-->
 <!--% PROCESS 'shared-utils.tpl.html' %-->
 <!--% PROCESS 'shared-listen-now.tpl.html' %-->
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% USE DBI(constants.driver) %-->
 <!--% query_episodes = DBI.prepare('
 		WITH episode_maxmin AS (
 					SELECT MAX(id) AS \'latest\', MIN(id) AS \'earliest\', ? AS \'id\' 
@@ -45,7 +45,7 @@
 %-->
 <!--% episode_result = query_episodes.execute(id, id, id, id, id) %-->
 <!--% FOREACH episode IN episode_result %-->
-<!--% episode_navigation = step_navigation(baseurl,episode,"twat") %-->
+<!--% episode_navigation = step_navigation(baseurl,episode,"twt") %-->
 <article>
 	<header>
 		<h1><!--% episode.id %--> :: <!--% episode.title %--></h1>
@@ -53,7 +53,7 @@
 		<p class="meta"><!--% episode_navigation %-->
 		</p>
 <p><!--% show_avatar(episode.hostid, episode.host) %-->
-Hosted by <a href="<!--% absolute_path(baseurl) %-->correspondents/<!--% zero_pad_left(episode.hostid) %-->.html"><!--% episode.host %--></a> on <span><!--% episode.date %--></span> is flagged as <span><!--% display_explicit(episode.explicit) %--></span> and is released under a <span><!--% episode.license %--> license</span>. <br>
+Hosted by <a href="<!--% absolute_path(baseurl) %-->correspondents/<!--% zero_pad_left(episode.hostid) %-->.html"><!--% episode.host %--></a> on <span><!--% day_and_date(episode.date) %--></span> is flagged as <span><!--% display_explicit(episode.explicit) %--></span> and is released under a <span><!--% episode.license %--> license</span>. <br>
 <!--% display_tags(episode.tags) %--> <br>
 <!--% listen_now(episode, "twat", baseurl, media_baseurl) %-->
 <!--% display_listen_in(episode.id, "twat") %-->  

templates/ids-correspondent.tpl.html

@@ -1,4 +1,4 @@
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% USE DBI(constants.driver) %-->
 <!--% FOREACH host IN DBI.query(
 	'select h.hostid from hosts as h'
 ) %-->

templates/ids-episode.tpl.html

@@ -1,5 +1,5 @@
-<!--% PROCESS "queries-ids-episode-${constants.database}.tpl.html" %-->
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% PROCESS "queries-ids-episode.tpl.html" %-->
+<!--% USE DBI(constants.driver) %-->
 <!--% FOREACH episode IN DBI.query(query_ids_episode) %-->
 ,<!--% episode.id %-->
 <!--% END %-->

templates/ids-twat_episode.tpl.html

@@ -1,4 +1,4 @@
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% USE DBI(constants.driver) %-->
 <!--% FOREACH episode IN DBI.query(
 	'select eps.id from twat_eps AS eps'
 ) %-->

templates/navigation-newdesign.tpl.html

@@ -0,0 +1,2 @@
+<!--% PROCESS 'shared-utils.tpl.html' %-->
+<!-- Simple navigation for new design - content is handled in the main page template -->

templates/page-newdesign.tpl.html

@@ -0,0 +1,61 @@
+<!--% PROCESS 'shared-utils.tpl.html' %-->
+<!--% USE date %-->
+<!DOCTYPE HTML>
+<html lang="en">
+<head>
+  <title>Hacker Public Radio ~ The Technology Community Podcast</title>
+  <!--% IF baseurl %-->
+  <base href="<!--% baseurl %-->">
+  <!--% END %-->
+  <meta charset="utf-8" />
+  <meta http-equiv="X-Clacks-Overhead" content="GNU Terry Pratchett" />
+  <meta http-equiv="last-modified" content="<!--% format_feed_date(date.now) %-->">
+  <meta name="keywords" content="Technology, Tech News, Education, Training" />
+  <meta name="description" content="Hacker Public Radio is a podcast that releases shows every weekday Monday through Friday. Our shows are produced by the community (you) and can be on any topic that is of interest to hackers and hobbyists." />
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="shortcut icon" href="<!--% absolute_url(baseurl) %-->hpr.ico" >
+  <link rel="alternate" type="application/rss+xml" title="Hacker Public Radio Opus RSS" href="<!--% absolute_path(baseurl) %-->hpr_opus_rss.php" />
+  <link rel="alternate" type="application/rss+xml" title="Hacker Public Radio Ogg Vorbis RSS" href="<!--% absolute_path(baseurl) %-->hpr_ogg_rss.php" />
+  <link rel="alternate" type="application/rss+xml" title="Hacker Public Radio MP3 RSS" href="<!--% absolute_path(baseurl) %-->hpr_mp3_rss.php" />
+  <link rel="alternate" type="application/rss+xml" title="Hacker Public Radio Comments RSS" href="<!--% absolute_path(baseurl) %-->comments.rss" />
+  <link rel="license" title="CC BY-SA 4.0"  href="https://creativecommons.org/licenses/by-sa/4.0/" />
+  <link href="<!--% absolute_path(baseurl) %-->css/new-design.css" rel="stylesheet" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.5, user-scalable=yes"/> 
+</head>
+
+<body>
+    <nav class="menu">
+        <button class="hamburger" id="hamburger-menu" aria-label="Toggle navigation menu">
+            <img src="<!--% absolute_path(baseurl) %-->icons/menu-line.svg" class="menu-icon" alt="Menu" />
+            <img src="<!--% absolute_path(baseurl) %-->icons/close-line.svg" class="close-icon" alt="Close" style="display: none;" />
+        </button>
+        <div class="menu-links" id="menu-links">
+            <a href="<!--% absolute_path(baseurl) %-->index.html">Home</a>
+            <a href="<!--% hub_baseurl %-->calendar.php">Upload</a>
+            <a href="<!--% absolute_path(baseurl) %-->syndication.html">Download</a>
+            <a href="<!--% absolute_path(baseurl) %-->about.html">About</a>
+        </div>
+    </nav>
+
+    <header class="banner title">
+        <img class="banner-image" src="<!--% absolute_path(baseurl) %-->images/logo.png" alt="Hacker Public Radio" aria-description="H.P.R. Hacker Public Radio https://HackerPublicRadio.org, The Community Podcast, Sharing Your Ideas, Projects, Options since 2005, New Episodes Every Weekday" usemap="#bannermap" />
+        <map class="bannermap" name="bannermap">
+            <area shape="rect" coords="108,187,240,343" href="<!--% absolute_path(baseurl) %-->correspondents/index.html" alt="hacker" title="hacker"/>
+            <area shape="rect" coords="246,187,359,343" href="<!--% absolute_path(baseurl) %-->comments_viewer.html" alt="public" title="public" />
+            <area shape="rect" coords="363,187,492,343" href="<!--% absolute_path(baseurl) %-->syndication.html" alt="radio" title="radio" />
+        </map>
+    </header>
+
+    <main id="maincontent">
+<!--% INCLUDE $content %-->
+    </main>
+
+    <footer>
+        <span>Unless otherwise stated, our shows are released under a <a href="https://creativecommons.org/licenses/by-sa/4.0/" target="_blank">Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0)</a> license.</span>
+        <span>The HPR Website Design is released to the <a href="https://creativecommons.org/publicdomain/mark/1.0/" target="_blank">Public Domain</a>.</span>
+        <span><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></span>
+    </footer>
+
+    <script src='<!--% absolute_path(baseurl) %-->js/index.js'></script>
+</body>
+</html>

templates/page.tpl.html

@@ -23,14 +23,14 @@
   }
   </style>
   <link rel="shortcut icon" href="<!--% absolute_url(baseurl) %-->hpr.ico" >
+  <link rel="alternate" type="application/rss+xml" title="Hacker Public Radio Opus RSS" href="<!--% absolute_path(baseurl) %-->hpr_opus_rss.php" />
   <link rel="alternate" type="application/rss+xml" title="Hacker Public Radio Ogg Vorbis RSS" href="<!--% absolute_path(baseurl) %-->hpr_ogg_rss.php" />
-  <link rel="alternate" type="application/rss+xml" title="Hacker Public Radio Speex RSS" href="<!--% absolute_path(baseurl) %-->hpr_spx_rss.php" />
   <link rel="alternate" type="application/rss+xml" title="Hacker Public Radio MP3 RSS" href="<!--% absolute_path(baseurl) %-->hpr_mp3_rss.php" />
   <link rel="alternate" type="application/rss+xml" title="Hacker Public Radio Comments RSS" href="<!--% absolute_path(baseurl) %-->comments.rss" />
   <link rel="license" title="CC BY-SA 4.0"  href="https://creativecommons.org/licenses/by-sa/4.0/" />
-  <link href="<!--% absolute_path(baseurl) %-->css/hpr.css" rel="stylesheet" />
+  <link href="/css/hpr.css" rel="stylesheet" />
   <!--[if IE]>
-  <link rel="stylesheet" href="<!--% absolute_path(baseurl) %-->css/hpr.css" media="screen" type="text/css" />
+  <link rel="stylesheet" href="/css/hpr.css" media="screen" type="text/css" />
   <script src="/JavaScript/html5.js"></script>
   <![endif]-->
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.5, user-scalable=yes"/> 
@@ -52,7 +52,7 @@
       </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/rho_n/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>
+    <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>
 
   </div>
   <hr />
@@ -67,7 +67,7 @@
 </main>
 
 <footer id="footer_page">
-  <h1 class="thick_bar"><span style="padding-left: 1em;">More Information...</span></h1>
+  <h1 class="thick_bar">More Information...</h1>
   <div id="more_info">
     <nav class="column">
       <h2>Ancestry</h2>
@@ -81,8 +81,8 @@
     <nav class="column">
       <h2>Social</h2>
       <ul>
-        <li><a href="<!--% absolute_url(baseurl,'/maillist') %-->" >Mailing list</a></li>
-        <li><a href="https://botsin.space/@hpr" >Mastodon</a></li>
+        <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>
@@ -114,7 +114,7 @@
       <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/explore/repos" >HPR Source Code</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>
@@ -133,7 +133,7 @@
       </ul>
     </nav>
   </div><!-- more_info -->
-  <h1 class="thick_bar"><span style="padding-left: 1em;">Copyright Information</span></h1>  
+  <h1 class="thick_bar">Copyright Information</h1>  
   <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/">
@@ -141,7 +141,6 @@
     <p>
     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>
-    <hr />
   </div><!-- copyright -->
   <hr />
 </footer>

templates/queries-call_for_shows-mysql.tpl.html

@@ -1,6 +0,0 @@
-<!--% query_call_for_shows = '
-	SELECT CASE WHEN COUNT(id) < 6 THEN True ELSE False END AS `request_for_shows`
-	FROM eps
-	WHERE eps.date > NOW() AND eps.date <= DATE_ADD(NOW(), INTERVAL 10 DAY)
-	'
-%-->

templates/queries-correspondent-mysql.tpl.html

@@ -1,18 +0,0 @@
-<!--% query_hpr_shows = '
-		SELECT
-		eps.id,
-		eps.explicit,
-		eps.date, eps.license, eps.duration,
-		eps.title, eps.summary, eps.tags,
-		eps.notes,
-		hosts.local_image,
-		hosts.hostid,
-		hosts.host, hosts.email, hosts.profile,
-		miniseries.name AS series, miniseries.id AS seriesid
-	FROM eps
-	INNER JOIN hosts ON eps.hostid = hosts.hostid
-	INNER JOIN miniseries ON eps.series = miniseries.id
-	WHERE hosts.hostid = ? AND eps.date < DATE_ADD(NOW(), INTERVAL 1 DAY)
-	ORDER BY eps.id DESC
-	'
-%-->

templates/queries-correspondent.tpl.html

@@ -16,3 +16,9 @@
 	ORDER BY eps.id + 0 DESC
 	'
 %-->
+<!--% query_hpr_show_count = '
+	SELECT id
+	FROM eps
+	WHERE eps.hostid = ? AND eps.date < date(\'now\', \'+1 days\')
+	'
+%-->

templates/queries-episode-mysql.tpl.html

@@ -1,51 +0,0 @@
-<!--% query_episode_maxmin = '
-		WITH episode_maxmin AS (
-			SELECT MAX(id) AS \'latest\', MIN(id) AS \'earliest\', ? AS \'id\' 
-			FROM eps
-			WHERE eps.date <= UTC_DATE()
-		),
-		episode_date AS (
-			SELECT eps.date 
-			FROM eps
-			WHERE eps.id = ?
-		),
-		episode_previous AS (
-			SELECT MAX(id) AS \'previous\', ? AS \'id\'
-			FROM eps
-			INNER JOIN episode_date
-			ON eps.date < episode_date.date
-			WHERE eps.id > 1
-		),
-		episode_next AS (
-			SELECT MIN(id) AS \'next\', ? AS \'id\'
-			FROM eps
-			INNER JOIN episode_date
-				ON eps.date > episode_date.date
-			WHERE eps.date <= NOW()
-		),
-		comment_tallies AS (	
-			SELECT 
-				eps_id,
-				COUNT(eps_id) AS eps_tally
-			FROM comments
-			GROUP BY eps_id 
-		)
-		SELECT eps.id, eps.date, eps.title, eps.duration, 
-			   eps.summary, eps.notes, eps.explicit, eps.license, 
-			   eps.tags, eps.version, eps.downloads, eps.valid,
-			   episode_maxmin.latest, episode_maxmin.earliest,
-			   episode_previous.previous, episode_next.next,
-			   hosts.hostid, hosts.host,
-			   miniseries.name AS \'series\', miniseries.id AS \'seriesid\',
-			   miniseries.description AS \'series_description\',
-			   COALESCE (comment_tallies.eps_tally, 0) AS eps_tally 
-		FROM eps
-		INNER JOIN hosts ON eps.hostid = hosts.hostid
-		INNER JOIN miniseries ON eps.series = miniseries.id
-		INNER JOIN episode_maxmin ON eps.id = episode_maxmin.id
-		INNER JOIN episode_previous ON eps.id = episode_previous.id
-		INNER JOIN episode_next ON eps.id = episode_next.id
-		LEFT JOIN comment_tallies ON eps.id = comment_tallies.eps_id
-		WHERE eps.id = ?
-	'
-%-->

templates/queries-episodes-mysql.tpl.html

@@ -1,15 +0,0 @@
-<!--% query_episodes = 'SELECT 
-        eps.id, 
-        eps.explicit, 
-        eps.date, eps.license, eps.title, eps.summary, 
-		eps.duration, eps.notes, eps.tags,
-        hosts.hostid, 
-        hosts.host, hosts.email, hosts.local_image, 
-		miniseries.name AS series, miniseries.id AS seriesid
-    FROM eps 
-	INNER JOIN hosts ON eps.hostid = hosts.hostid 
-	INNER JOIN miniseries ON eps.series = miniseries.id
-	WHERE eps.date <= UTC_DATE()
-	ORDER BY eps.id DESC'
-%-->
-

templates/queries-ids-episode-sqlite.tpl.html

@@ -1,2 +0,0 @@
-<!--% query_ids_episode = 'select eps.id from eps order by eps.id' %-->
-

templates/queries-index-mysql.tpl.html

@@ -1,58 +0,0 @@
-<!--% query_next_available_episode = '
-    SELECT id, date FROM eps e WHERE id = (
-        SELECT  id + 1 FROM eps mo
-            WHERE NOT EXISTS (
-		SELECT NULL
-		FROM   eps mi
-		WHERE  mi.id = mo.id + 1
-            )
-        ORDER BY id
-        LIMIT 1) - 1
-    '
-%-->
-<!--% query_latest_episodes = '
-	WITH comment_tallies AS (
-		SELECT
-			eps_id,
-			COUNT(eps_id) AS eps_tally
-		FROM comments
-		GROUP BY eps_id
-	)
-	SELECT
-		eps.id,
-		eps.explicit,
-		eps.date, eps.license, eps.duration,
-		eps.title, eps.summary, eps.tags,
-		eps.notes,
-		hosts.local_image,
-		hosts.hostid,
-		hosts.host, hosts.email,
-		miniseries.name AS series, miniseries.id AS seriesid,
-		COALESCE (comment_tallies.eps_tally, 0) AS eps_tally
-	FROM eps
-	INNER JOIN hosts ON eps.hostid = hosts.hostid
-    INNER JOIN miniseries ON eps.series = miniseries.id
-    LEFT JOIN comment_tallies ON eps.id = comment_tallies.eps_id
-	WHERE eps.date <= UTC_DATE()
-	ORDER BY eps.id  DESC
-	LIMIT 10
-	'
-%-->
-<!--% query_last_5_weeks_episodes = '
-	SELECT
-        eps.id,
-	eps.explicit,
-        eps.date, eps.license, eps.title, eps.summary,
-		eps.duration, eps.notes, eps.tags,
-        hosts.hostid,
-        hosts.host, hosts.email, hosts.local_image,
-		miniseries.name AS series, miniseries.id AS seriesid
-    FROM eps
-	INNER JOIN hosts ON eps.hostid = hosts.hostid
-	INNER JOIN miniseries ON eps.series = miniseries.id
-	WHERE eps.date <= UTC_DATE()
-    ORDER BY eps.id  DESC
-	LIMIT 30 OFFSET 10
-	'
-%-->
-

templates/queries-series-mysql.tpl.html

@@ -1,15 +0,0 @@
-<!--% query_episodes = 'SELECT miniseries.id, miniseries.name, miniseries.description, 
-			miniseries.private, miniseries.image, miniseries.valid,
-			ep.number_of_episodes, ep.latest_show, ep.earliest_show
-		FROM miniseries
-		INNER JOIN 
-			(SELECT series, 
-				COUNT(eps.id) AS number_of_episodes,
-				MAX(eps.date) AS latest_show,
-				MIN(eps.date) AS earliest_show
-			 FROM eps 
-			 WHERE eps.date < DATE_ADD(NOW(), INTERVAL 1 DAY)
-			 GROUP BY series) AS ep ON ep.series = miniseries.id
-		ORDER BY name'
-%-->
-

templates/queries-series_episodes-mysql.tpl.html

@@ -1,29 +0,0 @@
-<!--% query_series_sql = 'SELECT miniseries.id, miniseries.name, 
-			miniseries.description, 
-			miniseries.private, miniseries.image, miniseries.valid,
-			ep.number_of_episodes, ep.latest_show, ep.earliest_show
-		 FROM miniseries
-		 INNER JOIN 
-			(SELECT series, 
-				COUNT(eps.id) AS number_of_episodes,
-				MAX(eps.date) AS latest_show,
-				MIN(eps.date) AS earliest_show
-			 FROM eps 
-			 WHERE eps.date < DATE_ADD(NOW(), INTERVAL 1 DAY)
-			 GROUP BY series) AS ep ON ep.series = miniseries.id
-		 WHERE miniseries.id = ?
-		 ORDER BY name'
-%-->
-<!--% query_shows_sql = 'SELECT
-	id, date, title,
-	duration, summary, notes,
-	explicit, eps.license, tags,
-	hosts.host, hosts.hostid
-	FROM eps
-	INNER JOIN hosts
-	ON eps.hostid = hosts.hostid
-	WHERE series = ? AND eps.date < DATE_ADD(NOW(), INTERVAL 1 DAY)
-	ORDER BY eps.id DESC
-	'
-%-->
-

templates/queries-tags-sqlite.tpl.html

@@ -1 +0,0 @@
-<!--% query_tags = 'SELECT id, tags FROM eps' %-->

templates/rss-comments.tpl.xml

@@ -3,27 +3,28 @@
 <!--% PROCESS 'shared-utils.tpl.html' %-->
 <!--% PROCESS 'shared-episode-summary.tpl.html' %-->
 <!--% USE date %-->
+<!--% USE HTML.Strip emit_spaces = 0 %-->
 <channel>
   <title>Hacker Public Radio ~ Comment Feed</title>
-  <link><!--% baseurl %-->about.html</link>
+  <link><!--% absolute_url(http_baseurl) %-->about.html</link>
   <description>Comments Feed: Hacker Public Radio is a podcast that releases shows every weekday Monday through Friday. Our shows are produced by the community (you) and can be on any topic that is of interest to hackers and hobbyists.</description>
   <language>en-us</language>
   <copyright>Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) License</copyright>
   <managingEditor>feedback.nospam@nospam.hackerpublicradio.org (HPR Feedback)</managingEditor>
   <webMaster>admin.nospam@nospam.hackerpublicradio.org (HPR Webmaster)</webMaster>
-  <generator>https://repo.anhonesthost.net/rho_n/hpr_generator</generator>
+  <generator>https://repo.anhonesthost.net/HPR/hpr_generator</generator>
   <docs>https://www.rssboard.org/rss-specification</docs>
   <ttl>600</ttl>
   <image>
-    <url><!--% baseurl %-->images/hpr_feed_small.png</url>
+    <url><!--% absolute_url(http_baseurl) %-->images/hpr_feed_small.png</url>
     <title>Hacker Public Radio ~ Comment Feed</title>
-    <link><!--% baseurl %-->about.html</link>
+    <link><!--% absolute_url(http_baseurl) %-->about.html</link>
     <description>The Hacker Public Radio Old Microphone Logo</description>
     <height>164</height>
     <width>144</width>
   </image>
-  <atom:link href="<!--% baseurl %-->comments.rss" rel="self" type="application/rss+xml" />  
-  <!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+  <atom:link href="<!--% absolute_url(http_baseurl) %-->comments.rss" rel="self" type="application/rss+xml" />  
+  <!--% USE DBI(constants.driver) %-->
   <!--% FOREACH response IN DBI.query('SELECT max( comment_timestamp) AS latest_update FROM comments') %-->
   
   <pubDate><!--% format_feed_date(response.latest_update) %--></pubDate>
@@ -49,15 +50,15 @@
   %-->
 
   <item>
-    <title><!--% item.comment_author_name %--> says: <!--% item.comment_title %--></title>
-    <author>feedback.nospam@nospam.hackerpublicradio.org (<!--% item.comment_author_name %-->)</author>
-    <link><!--% baseurl %-->eps/hpr<!--% zero_pad_left(item.eps_id) %-->/index.html#comments</link>
+    <title><!--% item.comment_author_name | html_strip | xml_entity %--> says: <!--% item.comment_title | html_strip | xml_entity %--></title>
+    <author>feedback.nospam@nospam.hackerpublicradio.org (<!--% item.comment_author_name | html_strip | xml_entity %-->)</author>
+    <link><!--% absolute_url(http_baseurl) %-->eps/hpr<!--% zero_pad_left(item.eps_id) %-->/index.html#comments</link>
     <description><![CDATA[<strong>
-    RE: hpr<!--% zero_pad_left(item.eps_id) %-->::<!--% item.episode_date %--> <em><!--% item.episode_title %--></em> by <a href="<!--% baseurl %-->correspondents/<!--% zero_pad_left(item.host_id) %-->.html"><!--% item.host %--></a></strong><!--% rss_show_series(item.series_name, item.series_id) %--><br />
+    RE: hpr<!--% zero_pad_left(item.eps_id) %-->::<!--% item.episode_date %--> <em><!--% item.episode_title | html_strip | xml_entity %--></em> by <a href="<!--% absolute_url(http_baseurl) %-->correspondents/<!--% zero_pad_left(item.host_id) %-->.html"><!--% item.host %--></a></strong><!--% rss_show_series(item.series_name, item.series_id) | html_strip | xml_entity %--><br />
 <!--% display_episode_duration(item.episode_duration) %--><!--% display_listen_in(item.eps_id) %--><br /><!--% item.comment_text FILTER html_line_break %-->
 ]]></description>
     <pubDate><!--% format_feed_date(item.comment_timestamp) %--></pubDate>
-    <guid isPermaLink="false"><!--% baseurl %-->eps/hpr<!--% zero_pad_left(item.eps_id) %-->/index.html#comment_<!--% item.id %--></guid>
+    <guid isPermaLink="false"><!--% absolute_url(http_baseurl) %-->eps/hpr<!--% zero_pad_left(item.eps_id) %-->/index.html#comment_<!--% item.id %--></guid>
   </item>
   <!--% END %-->
 </channel>

templates/rss-hpr.tpl.xml

@@ -1,5 +1,5 @@
 <!--% PROCESS 'shared-item.tpl.xml' %-->
-<!--% PROCESS "rss-query-hpr-${constants.database}.tpl.xml" %-->
+<!--% PROCESS "rss-query-hpr.tpl.xml" %-->
 <!--% FOREACH episode IN feed_result %-->
 <!--% display_item(episode, media_file_extension, audio_mime_type) %-->
 <!--% END %-->

templates/rss-hpr_total.tpl.xml

@@ -1,5 +1,5 @@
 <!--% PROCESS 'shared-item.tpl.xml' %-->
-<!--% PROCESS "rss-query-hpr_total-${constants.database}.tpl.xml" %-->
+<!--% PROCESS "rss-query-hpr_total.tpl.xml" %-->
 <!--% FOREACH episode IN feed_result %-->
 <!--% display_item(episode, media_file_extension, audio_mime_type) %-->
 <!--% END %-->

templates/rss-query-hpr-mysql.tpl.xml

@@ -1,26 +0,0 @@
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
-<!--% query_hpr_feed = DBI.prepare('
-        SELECT
-            eps.id,
-            eps.explicit,
-            DATE_FORMAT(eps.date, \'%H:%i:%S %d:%m:%Y\') AS \'date\',
-            eps.license, eps.duration,
-            eps.title, eps.summary, eps.tags,
-            eps.notes,
-            hosts.local_image,
-            hosts.hostid,
-            hosts.host, hosts.email,
-            miniseries.name AS series, miniseries.id AS seriesid,
-            assets.size AS length
-        FROM eps
-        INNER JOIN hosts ON eps.hostid = hosts.hostid
-        INNER JOIN miniseries ON eps.series = miniseries.id
-        INNER JOIN assets ON eps.id = assets.episode_id
-        WHERE eps.date <= UTC_DATE()
-        AND assets.extension = ?
-        ORDER BY eps.date DESC
-        LIMIT 10
-')
-%-->
-<!--% feed_result = query_hpr_feed.execute(media_file_extension) %-->
-

templates/rss-query-hpr.tpl.xml

@@ -1,4 +1,4 @@
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% USE DBI(constants.driver) %-->
 <!--% query_hpr_feed = DBI.prepare('
         SELECT
             eps.id,

templates/rss-query-hpr_total-mysql.tpl.xml

@@ -1,25 +0,0 @@
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
-<!--% query_hpr_feed = DBI.prepare('
-        SELECT
-            eps.id,
-            eps.explicit,
-            DATE_FORMAT(eps.date, \'%H:%i:%S %d:%m:%Y\') AS \'date\',
-            eps.license, eps.duration,
-            eps.title, eps.summary, eps.tags,
-            eps.notes,
-            hosts.local_image,
-            hosts.hostid,
-            hosts.host, hosts.email,
-            miniseries.name AS series, miniseries.id AS seriesid,
-            assets.size AS length
-        FROM eps
-        INNER JOIN hosts ON eps.hostid = hosts.hostid
-        INNER JOIN miniseries ON eps.series = miniseries.id
-        INNER JOIN assets ON eps.id = assets.episode_id
-        WHERE eps.date < UTC_DATE()
-        AND assets.extension = ?
-        ORDER BY eps.date DESC
-')
-%-->
-<!--% feed_result = query_hpr_feed.execute(media_file_extension) %-->
-

templates/rss-query-hpr_total.tpl.xml

@@ -1,4 +1,4 @@
-<!--% USE DBI(constants.driver, constants.user, constants.password) %-->
+<!--% USE DBI(constants.driver) %-->
 <!--% query_hpr_feed = DBI.prepare('
         SELECT
             eps.id,

templates/shared-call_for_shows.tpl.html

@@ -1,5 +1,5 @@
 <!--% PROCESS 'shared-utils.tpl.html' %-->
-<!--% PROCESS "queries-call_for_shows-${constants.database}.tpl.html" %-->
+<!--% PROCESS "queries-call_for_shows.tpl.html" %-->
 <!--% MACRO display_call_for_shows BLOCK %-->
 	<!--% result_call_for_shows = DBI.prepare(query_call_for_shows) %-->
 	<!--% results_call_for_shows = result_call_for_shows.execute().get_all() %-->

templates/shared-episode-summary.tpl.html

@@ -1,4 +1,5 @@
 <!--% PROCESS 'shared-utils.tpl.html' %-->
+<!--% PROCESS 'shared-show-transcript.tpl.html' %-->
 
 <!--% MACRO rss_show_series(series, series_id)  IF series != "general" %-->
 from the series <em><a href="<!--% baseurl %-->series/<!--% zero_pad_left(series_id) %-->.html"><!--% series %--></em></a>.
@@ -14,7 +15,7 @@ from the series <em><a href="<!--% baseurl %-->series/<!--% zero_pad_left(series
 <!--% MACRO display_tags(tags) BLOCK %-->
     <span><label>Tags:</label> <em>
         <!--% FOREACH tag IN tags.csv_parse %-->
-        <a href="<!--% absolute_path(baseurl) %-->tags.html#<!--% tag.lower %-->"><!--% tag %--></a><!--% IF loop.count == loop.size %-->.<!--% ELSE %-->,<!--% END %-->
+        <a href="<!--% absolute_path(baseurl) %-->tags.html#<!--% tag_to_id(tag) %-->"><!--% tag %--></a><!--% IF loop.count == loop.size %-->.<!--% ELSE %-->,<!--% END %-->
         <!--% END %--></em>
     </span>
 <!--% END %-->
@@ -24,10 +25,10 @@ from the series <em><a href="<!--% baseurl %-->series/<!--% zero_pad_left(series
  Listen in 
 <!--% IF episode_type == 'hpr' %-->
 <a href="<!--% media_path(eps_id, episode_type, 'ogg', baseurl, media_baseurl) %-->" aria-label="Download <!--% episode_type %--><!--% zero_pad_left(eps_id) %--> as">ogg</a>,
-<a href="<!--% media_path(eps_id, episode_type, 'spx', baseurl, media_baseurl) %-->" aria-label="Download <!--% episode_type %--><!--% zero_pad_left(eps_id) %--> as">spx</a>,
+<a href="<!--% media_path(eps_id, episode_type, 'opus', baseurl, media_baseurl) %-->" aria-label="Download <!--% episode_type %--><!--% zero_pad_left(eps_id) %--> as">opus</a>,
 or 
 <!--% END %-->
-<a href="<!--% media_path(eps_id, episode_type, 'mp3', baseurl, media_baseurl) %-->" aria-label="Download <!--% episode_type %--><!--% zero_pad_left(eps_id) %--> as">mp3</a> format.
+<a href="<!--% media_path(eps_id, episode_type, 'mp3', baseurl, media_baseurl) %-->" aria-label="Download <!--% episode_type %--><!--% zero_pad_left(eps_id) %--> as">mp3</a> format. 
 <!--% END %-->
 
 <!--% MACRO display_comments_tally(eps_id, tally) BLOCK %-->
@@ -35,7 +36,7 @@ or
 <!--% END %-->
 
 <!--% MACRO show_meta(show, hide_tags) BLOCK %-->
-	<span><label>Released:</label> <!--% show.date %-->.</span> 
+<span><label>Released:</label> <!--% day_and_date(show.date) %-->.</span> 
 	<span><label>Duration:</label> <!--% display_episode_duration(show.duration) %-->.</span> 
 	<span><label>Flag:</label> <!--% display_explicit(show.explicit) %-->.</span> 
 	<span><!--% show_series(show.series, show.seriesid) %--></span>  <br>
@@ -57,7 +58,7 @@ or
 
 <!--% MACRO twat_show_summary(show, hide_host) BLOCK %-->
 
-	<h3 class="title"><a href="<!--% absolute_path(baseurl) %-->eps/twat<!--% zero_pad_left(show.id) %-->/index.html">Today with a Techie Ep.<!--% show.id %--> :: <!--% show.title %--></a> <!--% IF hide_host == "" %--> 
+	<h3 class="title"><a href="<!--% absolute_path(baseurl) %-->eps/twt<!--% zero_pad_left(show.id) %-->/index.html">Today with a Techie Ep.<!--% show.id %--> :: <!--% show.title %--></a> <!--% IF hide_host == "" %--> 
 		hosted by <a href="<!--% absolute_path(baseurl) %-->correspondents/<!--% zero_pad_left(show.hostid) %-->.html"><!--% show.host %--></a>
 	<!--% END %-->
 	</h3>

templates/shared-listen-now.tpl.html

@@ -1,4 +1,5 @@
 <!--% PROCESS 'shared-episode-summary.tpl.html' %-->
+<!--% PROCESS 'shared-show-transcript.tpl.html' %-->
 
 <!--% MACRO listen_now(episode, episode_type, baseurl, media_baseurl, hide_duration) BLOCK %-->
 <p><!--% display_listen_in(episode.id, episode_type) %--> Play now:<br>	
@@ -7,6 +8,7 @@
 		<source src="<!--% media_path(episode.id, episode_type, 'mp3', baseurl, media_baseurl) %-->" type="audio/mpeg" >
 	</audio>
 	<!--% IF !hide_duration %--><br>
-	Duration: <!--% display_episode_duration(episode.duration) %--><!--% END %--></p>
+	Duration: <!--% display_episode_duration(episode.duration) %--><!--% END %-->
+	<!--% IF episode_type == "hpr" %--><br><!--% show_transcript(episode, episode_type, baseurl, media_baseurl) %--><!--% END %--></p>
 <!--% END %-->
 

templates/shared-show-transcript.tpl.html

@@ -1,14 +1,5 @@
 <!--% MACRO show_transcript(episode, episode_type, baseurl, media_baseurl) BLOCK %-->
-<h2>Show Transcript</h2>
-<p>Automatically generated using <a href="https://github.com/openai/whisper">whisper</a>
-<pre><code>whisper --model tiny --language en hpr<!--% zero_pad_left(episode.id) %-->.wav</code></pre></p>
-<p>
-You can save these subtitle files to the same location as the HPR Episode, and they will automatically show in players like <a href="https://mpv.io/">mpv</a>, <a href="https://www.videolan.org/vlc/">vlc</a>. Some players allow you to specify the subtitle file location.
-</p>
-<ul>
-	<li>Text: <a href="<!--% media_path(episode.id, episode_type, 'txt', baseurl, media_baseurl) %-->">hpr<!--% zero_pad_left(episode.id) %-->.txt</a></li> 
-	<li><a href="https://en.wikipedia.org/wiki/WebVTT">WebVTT</a>: <a href="<!--% media_path(episode.id, episode_type, 'vtt', baseurl, media_baseurl) %-->">hpr<!--% zero_pad_left(episode.id) %-->.vtt</a></li>
-	<li><a href="https://en.wikipedia.org/wiki/SubRip">SubRip</a>: <a href="<!--% media_path(episode.id, episode_type, 'srt', baseurl, media_baseurl) %-->">hpr<!--% zero_pad_left(episode.id) %-->.srt</a></li>
-</ul>
+Download the <a href="<!--% media_path(episode.id, episode_type, 'txt', baseurl, media_baseurl) %-->" aria-label="Download <!--% episode_type %--><!--% zero_pad_left(episode.id) %-->">transcription</a></li> and  
+	<a href="<!--% media_path(episode.id, episode_type, 'srt', baseurl, media_baseurl) %-->" aria-label="Download <!--% episode_type %--><!--% zero_pad_left(episode.id) %-->">subtitles</a>.
 <!--% END %-->
 

templates/shared-utils.tpl.html

@@ -49,6 +49,24 @@
 <!--% iso8601_date.format(date_to_format) %-->
 <!--% END %-->
 
+<!--% MACRO day_from_date(eps_date) BLOCK %-->
+<!--% USE eps_day = date(format => '%A', locale => 'en_US', gmt => 1)  %-->
+<!--% eps_day.format("$eps_date 0:0:0") %-->
+<!--% END %-->
+
+<!--% MACRO day_and_date(eps_date) BLOCK %-->
+<!--% day_from_date(eps_date) %-->, <!--% eps_date %-->
+<!--% END %-->
+
+<!--% MACRO tag_to_id(tag, is_index) BLOCK %-->
+<!--% tag = tag.replace('\s+','_') %-->
+<!--% IF is_index %-->
+    <!--% tag.upper %-->
+<!--% ELSE %-->
+    <!--% tag.lower %-->
+<!--% END %-->
+<!--% END %-->
+
 <!--% MACRO absolute_url(base, path) BLOCK %-->
 <!--% UNLESS base.empty %-->
     <!--% UNLESS base.substr(-1) == '/' %-->
@@ -76,6 +94,7 @@
 
 <!--% MACRO media_path(episode_id, episode_type, media_type, baseurl, media_baseurl) BLOCK %-->
         <!--% IF episode_type == "twat" %-->
+                <!--% episode_type = "twt" %-->
                 <!--% padding = 3 %-->
                 <!--% media_folder = "eps/"; padding = 3 %-->
         <!--% ELSE %-->
@@ -89,7 +108,7 @@
                         <!--% media_baseurl = "${media_baseurl}hpr\$eps_id/" %-->
                 <!--% END %-->
                 <!--% media_folder = "" %-->
-                <!--% media_baseurl = media_baseurl.replace('\$eps_id', zero_pad_left(episode_id)) %-->
+                <!--% media_baseurl = media_baseurl.replace('hpr\$eps_id', episode_type _ zero_pad_left(episode_id, padding)) %-->
         <!--% END %-->
         <!--% media_basepath(baseurl, media_baseurl) %--><!--% media_folder %--><!--% episode_type %--><!--% zero_pad_left(episode_id, padding) %-->.<!--% media_type %-->
 <!--% END %-->

utils/check-dependencies.sh

@@ -0,0 +1,67 @@
+#!/bin/bash -
+#===============================================================================
+#
+#          FILE: check-dependencies.sh
+#
+#         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:
+#       CREATED: 09/05/2024 09:55:00 PM
+#      REVISION:  ---
+#===============================================================================
+
+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
+#    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
+}
+
+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"
+)
+
+echo "The following modules must be installed for the site-generator to function: "
+for module in "${MODULES[@]}"; do
+  echo "* ${module}"
+done
+
+echo "Scanning for modules ..."
+echo "----------------------"
+
+for module in "${MODULES[@]}"; do
+  is_module_installed "${module}"
+done
+
+echo "Finished scanning."