5.19.2

.eslintrc

@@ -2,8 +2,7 @@
 	"env": {
 		"browser": true,
 		"es6": true,
-		"node": true,
-		"jquery": true
+		"node": true
 	},
 	"extends": [
 		"airbnb-base"
@@ -12,10 +11,11 @@
 		"TravelCities": "readonly",
 		"RegionalCities": "readonly",
 		"StationInfo": "readonly",
-		"SunCalc": "readonly"
+		"SunCalc": "readonly",
+		"NoSleep": "readonly"
 	},
 	"parserOptions": {
-		"ecmaVersion": 2023,
+		"ecmaVersion": "latest",
 		"sourceType": "module"
 	},
 	"plugins": [],

.gitignore

@@ -11,4 +11,7 @@ server/music/*
 
 #dist folder
 dist/*
-!dist/readme.txt
+!dist/readme.txt
+
+#environment variables
+.env

.vscode/launch.json

@@ -15,6 +15,9 @@
 				"**/*.min.js",
 				"**/vendor/**"
 			],
+			"runtimeArgs": [
+				"--autoplay-policy=no-user-gesture-required"
+			]
 		},
 		{
 			"name": "Data:stations",
@@ -66,13 +69,13 @@
 		},
 		{
 			"name": "Test",
-			"program": "${workspaceFolder}/tests/index.js",
+			"program": "${workspaceFolder}/tests/index.mjs",
 			"request": "launch",
 			"skipFiles": [
 				"<node_internals>/**"
 			],
 			"type": "node",
-			"outputCapture": "std"
+			"console": "integratedTerminal"
 		},
 	],
 	"compounds": [

.vscode/settings.json

@@ -1,7 +1,4 @@
 {
-	"cSpell.enableFiletypes": [
-		"javascript"
-	],
 	"liveSassCompile.settings.formats": [
 		{
 			"format": "compressed",
@@ -23,7 +20,4 @@
 	"eslint.validate": [
 		"javascript"
 	],
-	"cSpell.words": [
-		"Tucsan"
-	]
 }

README.md

@@ -18,7 +18,7 @@ This project is based on the work of [Mike Battaglia](https://github.com/vbguyny
 
 ## Does WeatherStar 4000+ work outside of the USA?
 
-This project is tightly coupled to [NOAA's Weather API](https://www.weather.gov/documentation/services-web-api), which is exclsuive to the United States. Using NOAA's Weather API is a crucial requirement to provide an authentic WeatherStar 4000+ experience.
+This project is tightly coupled to [NOAA's Weather API](https://www.weather.gov/documentation/services-web-api), which is exclusive to the United States. Using NOAA's Weather API is a crucial requirement to provide an authentic WeatherStar 4000+ experience.
 
 If you would like to display weather information for international locations (outside of the USA), please checkout a fork of this project created by [@mwood77](https://github.com/mwood77):
 - [`ws4kp-international`](https://github.com/mwood77/ws4kp-international)
@@ -92,11 +92,12 @@ Kiosk mode can be activated by a checkbox on the page. Note that there is no way
 
 It's also possible to enter kiosk mode using a permalink. First generate a [Permalink](#sharing-a-permalink-bookmarking), then to the end of it add `&kiosk=true`. Opening this link will load all of the selected displays included in the Permalink, enter kiosk mode immediately upon loading and start playing the forecast.
 
-## Wish list
+## Default query string paramaters (environment variables)
+When serving this via the built-in Express server, it's possible to define environment variables that direct the user to a default set of paramaters (like the  [Permalink](#sharing-a-permalink-bookmarking) above). If a user requests the root page at `http://localhost:8080/` the query string provided by environment variables will be appended to the url thus providing a default configuration.
 
-As time allows I will be working on the following enhancements.
+Environment variables can be added to the command line as usual, or via a .env file which is parsed with [dotenv](https://github.com/motdotla/dotenv). Both methods have the same effect.
 
-* Better error reporting when api.weather.gov is down (happens more often than you would think)
+Environment variables that are to be added to the default query string are prefixed with `WSQS_` and then use the same key/value pairs generated by the [Permalink](#sharing-a-permalink-bookmarking) above, with the `- (dash)` character replaced by an `_ (underscore)`. For example, if you wanted to turn the travel forecast on, you would find `travel-checkbox=true` in the permalink, it's matching environment variable becomes `WSQS_travel_checkbox=true`.
 
 ## Serving static files
 The app can be served as a static set of files on any web server. Run the provided gulp task to create a set of static distribution files:
@@ -108,7 +109,7 @@ The resulting files will be in the /dist folder in the root of the project. Thes
 ## Music
 The WeatherStar had wonderful background music from the smooth jazz and new age genres by artists of the time. Lists of the music that played are available by searching online, but it's all copyrighted music and would be difficult to provide as part of this repository.
 
-I've used AI tools to create WeatherStar-inspired music tracks that are unencumbered by copyright and are included in this repo. Too keep the size down, I've only included 4 tracks. Additional tracks will be posted in a companion repository [ws4kp-music](https://github.com/netbymatt/ws4kp-music).
+I've used AI tools to create WeatherStar-inspired music tracks that are unencumbered by copyright and are included in this repo. Too keep the size down, I've only included 4 tracks. Additional tracks are in a companion repository [ws4kp-music](https://github.com/netbymatt/ws4kp-music).
 
 ### Customizing the music
 Placing .mp3 files in the `/server/music` folder will override the default music included in the repo. Subdirectories will not be scanned. When weatherstar loads in the browser it will load a list if available files and randomize the order when it starts playing. On each loop through the available tracks the order will again be shuffled. If you're using the static files method to host your WeatherStar music is located in `/music`.
@@ -129,6 +130,7 @@ Thanks to the WeatherStar community for providing these discussions to further e
 
 * [Stream as FFMPEG](https://github.com/netbymatt/ws4kp/issues/37#issuecomment-2008491948)
 * [Weather like it's 1999](https://blog.scottlabs.io/2024/02/weather-like-its-1999/) Raspberry pi, streaming, music and CRT all combined into a complete solution.
+* [ws4channels](https://github.com/rice9797/ws4channels) A Dockerized Node.js application to stream WeatherStar 4000 data into Channels DVR using Puppeteer and FFmpeg.
 
 ## Customization
 A hook is provided as `/server/scripts/custom.js` to allow customizations to your own fork of this project, without accidentally pushing your customizations back upstream to the git repository. An sample file is provided at `/server/scripts/custom.sample.js` and should be renamed to `custom.js` activate it.

datagenerators/output/regionalcities.json

@@ -1150,7 +1150,7 @@
 		}
 	},
 	{
-		"city": "Tucsan",
+		"city": "Tucson",
 		"lat": 32.2216,
 		"lon": -110.9698,
 		"point": {

datagenerators/regionalcities-raw.json

@@ -575,7 +575,7 @@
 		"lon": -77.9447
 	},
 	{
-		"city": "Tucsan",
+		"city": "Tucson",
 		"lat": 32.2216,
 		"lon": -110.9698
 	}

datagenerators/stations.mjs

@@ -9,61 +9,59 @@ import chunk from './chunk.mjs';
 // skip stations starting with these letters
 const skipStations = ['U', 'C', 'H', 'W', 'Y', 'T', 'S', 'M', 'O', 'L', 'A', 'F', 'B', 'N', 'V', 'R', 'D', 'E', 'I', 'G', 'J'];
 
-// immediately invoked function so we can access async/await
-const start = async () => {
-	// chunk the list of states
-	const chunkStates = chunk(states, 5);
+// chunk the list of states
+const chunkStates = chunk(states, 1);
 
-	// store output
-	const output = {};
+// store output
+const output = {};
 
-	// process all chunks
-	for (let i = 0; i < chunkStates.length; i += 1) {
-		const stateChunk = chunkStates[i];
-		// loop through states
+// process all chunks
+for (let i = 0; i < chunkStates.length; i += 1) {
+	const stateChunk = chunkStates[i];
+	// loop through states
 
-		stateChunk.forEach(async (state) => {
-			try {
-				let stations;
-				let next = `https://api.weather.gov/stations?state=${state}`;
-				do {
-					// get list and parse the JSON
-					// eslint-disable-next-line no-await-in-loop
-					const stationsRaw = await https(next);
-					stations = JSON.parse(stationsRaw);
-					// filter stations for 4 letter identifiers
-					const stationsFiltered4 = stations.features.filter((station) => station.properties.stationIdentifier.match(/^[A-Z]{4}$/));
-					// filter against starting letter
-					const stationsFiltered = stationsFiltered4.filter((station) => !skipStations.includes(station.properties.stationIdentifier.slice(0, 1)));
-					// add each resulting station to the output
-					stationsFiltered.forEach((station) => {
-						const id = station.properties.stationIdentifier;
-						if (output[id]) {
-							console.log(`Duplicate station: ${state}-${id}`);
-							return;
-						}
-						output[id] = {
-							id,
-							city: station.properties.name,
-							state,
-							lat: station.geometry.coordinates[1],
-							lon: station.geometry.coordinates[0],
-						};
-					});
-					next = stations?.pagination?.next;
-					// write the output
-					writeFileSync('./datagenerators/output/stations.json', JSON.stringify(output, null, 2));
-				}
-				while (next && stations.features.length > 0);
-				console.log(`Complete: ${state}`);
-				return true;
-			} catch (e) {
-				console.error(`Unable to get state: ${state}`);
-				return false;
+	// eslint-disable-next-line no-await-in-loop
+	await Promise.allSettled(stateChunk.map(async (state) => {
+		try {
+			let stations;
+			let next = `https://api.weather.gov/stations?state=${state}`;
+			let round = 0;
+			do {
+				console.log(`Getting: ${state}-${round}`);
+				// get list and parse the JSON
+				// eslint-disable-next-line no-await-in-loop
+				const stationsRaw = await https(next);
+				stations = JSON.parse(stationsRaw);
+				// filter stations for 4 letter identifiers
+				const stationsFiltered4 = stations.features.filter((station) => station.properties.stationIdentifier.match(/^[A-Z]{4}$/));
+				// filter against starting letter
+				const stationsFiltered = stationsFiltered4.filter((station) => !skipStations.includes(station.properties.stationIdentifier.slice(0, 1)));
+				// add each resulting station to the output
+				stationsFiltered.forEach((station) => {
+					const id = station.properties.stationIdentifier;
+					if (output[id]) {
+						console.log(`Duplicate station: ${state}-${id}`);
+						return;
+					}
+					output[id] = {
+						id,
+						city: station.properties.name,
+						state,
+						lat: station.geometry.coordinates[1],
+						lon: station.geometry.coordinates[0],
+					};
+				});
+				next = stations?.pagination?.next;
+				round += 1;
+				// write the output
+				writeFileSync('./datagenerators/output/stations.json', JSON.stringify(output, null, 2));
 			}
-		});
-	}
-};
-
-// immediately invoked function allows access to async
-await start();
+			while (next && stations.features.length > 0);
+			console.log(`Complete: ${state}`);
+			return true;
+		} catch (e) {
+			console.error(`Unable to get state: ${state}`);
+			return false;
+		}
+	}));
+}

gulp/publish-frontend.mjs

@@ -1,4 +1,5 @@
 /* eslint-disable import/no-extraneous-dependencies */
+import 'dotenv/config';
 import {
 	src, dest, series, parallel,
 } from 'gulp';
@@ -6,9 +7,9 @@ import concat from 'gulp-concat';
 import terser from 'gulp-terser';
 import ejs from 'gulp-ejs';
 import rename from 'gulp-rename';
-import htmlmin from 'gulp-htmlmin';
+import htmlmin from 'gulp-html-minifier-terser';
 import { deleteAsync } from 'del';
-import s3Upload from 'gulp-s3-upload';
+import s3Upload from 'gulp-s3-uploader';
 import webpack from 'webpack-stream';
 import TerserPlugin from 'terser-webpack-plugin';
 import { readFile } from 'fs/promises';
@@ -32,8 +33,6 @@ const jsSourcesData = [
 
 const webpackOptions = {
 	mode: 'production',
-	// mode: 'development',
-	// devtool: 'source-map',
 	output: {
 		filename: 'ws.min.js',
 	},
@@ -62,8 +61,6 @@ const compressJsData = () => src(jsSourcesData)
 	.pipe(dest(RESOURCES_PATH));
 
 const jsVendorSources = [
-	'server/scripts/vendor/auto/jquery.js',
-	'server/scripts/vendor/jquery.autocomplete.min.js',
 	'server/scripts/vendor/auto/nosleep.js',
 	'server/scripts/vendor/auto/swiped-events.js',
 	'server/scripts/vendor/auto/suncalc.js',
@@ -79,6 +76,7 @@ const mjsSources = [
 	'server/scripts/modules/hazards.mjs',
 	'server/scripts/modules/currentweather.mjs',
 	'server/scripts/modules/almanac.mjs',
+	'server/scripts/modules/spc-outlook.mjs',
 	'server/scripts/modules/icons.mjs',
 	'server/scripts/modules/extendedforecast.mjs',
 	'server/scripts/modules/hourly.mjs',
@@ -140,7 +138,7 @@ const uploadSources = [
 ];
 const upload = () => src(uploadSources, { base: './dist', encoding: false })
 	.pipe(s3({
-		Bucket: 'weatherstar',
+		Bucket: process.env.BUCKET,
 		StorageClass: 'STANDARD',
 		maps: {
 			CacheControl: (keyname) => {
@@ -154,17 +152,18 @@ const upload = () => src(uploadSources, { base: './dist', encoding: false })
 const imageSources = [
 	'server/fonts/**',
 	'server/images/**',
+	'!server/images/gimp/**',
 ];
 const uploadImages = () => src(imageSources, { base: './server', encoding: false })
 	.pipe(
 		s3({
-			Bucket: 'weatherstar',
+			Bucket: process.env.BUCKET,
 			StorageClass: 'STANDARD',
 		}),
 	);
 
 const invalidate = () => cloudfront.send(new CreateInvalidationCommand({
-	DistributionId: 'E9171A4KV8KCW',
+	DistributionId: process.env.DISTRIBUTION_ID,
 	InvalidationBatch: {
 		CallerReference: (new Date()).toLocaleString(),
 		Paths: {

gulp/update-vendor.mjs

@@ -9,7 +9,6 @@ const vendorFiles = [
 	'./node_modules/luxon/build/es6/luxon.js',
 	'./node_modules/luxon/build/es6/luxon.js.map',
 	'./node_modules/nosleep.js/dist/NoSleep.js',
-	'./node_modules/jquery/dist/jquery.js',
 	'./node_modules/suncalc/suncalc.js',
 	'./node_modules/swiped-events/src/swiped-events.js',
 ];

index.mjs

@@ -1,3 +1,4 @@
+import 'dotenv/config';
 import express from 'express';
 import fs from 'fs';
 import corsPassThru from './cors/index.mjs';
@@ -20,7 +21,39 @@ app.get('/playlist.json', playlist);
 // version
 const { version } = JSON.parse(fs.readFileSync('package.json'));
 
+// read and parse environment variables to append to the query string
+// use the permalink (share) button on the web app to generate a starting point for your configuration
+// then take each key/value in the querystring and append WSQS_ to the beginning, and then replace any
+// hyphens with underscores in the key name
+// environment variables are read from the command line and .env file via the dotenv package
+
+const qsVars = {};
+
+Object.entries(process.env).forEach(([key, value]) => {
+	// test for key matching pattern described above
+	if (key.match(/^WSQS_[A-Za-z0-9_]+$/)) {
+		// convert the key to a querystring formatted key
+		const formattedKey = key.replace(/^WSQS_/, '').replaceAll('_', '-');
+		qsVars[formattedKey] = value;
+	}
+});
+
+// single flag to determine if environment variables are present
+const hasQsVars = Object.entries(qsVars).length > 0;
+
+// turn the environment query string into search params
+const defaultSearchParams = (new URLSearchParams(qsVars)).toString();
+
 const index = (req, res) => {
+	// test for no query string in request and if environment query string values were provided
+	if (hasQsVars && Object.keys(req.query).length === 0) {
+		// redirect the user to the query-string appended url
+		const url = new URL(`${req.protocol}://${req.host}${req.url}`);
+		url.search = defaultSearchParams;
+		res.redirect(307, url.toString());
+		return;
+	}
+	// return the standard page
 	res.render('index', {
 		production: false,
 		version,

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "ws4kp",
-	"version": "5.16.2",
+	"version": "5.19.2",
 	"description": "Welcome to the WeatherStar 4000+ project page!",
 	"main": "index.mjs",
 	"type": "module",
@@ -32,22 +32,21 @@
 		"gulp-concat": "^2.6.1",
 		"gulp-ejs": "^5.1.0",
 		"gulp-file": "^0.4.0",
-		"gulp-htmlmin": "^5.0.1",
 		"gulp-rename": "^2.0.0",
-		"gulp-s3-upload": "^1.7.3",
+		"gulp-s3-uploader": "^1.0.6",
 		"gulp-sass": "^6.0.0",
 		"gulp-terser": "^2.0.0",
-		"jquery": "^3.6.0",
-		"jquery-touchswipe": "^1.6.19",
 		"luxon": "^3.0.0",
 		"nosleep.js": "^0.12.0",
 		"sass": "^1.54.0",
 		"suncalc": "^1.8.0",
 		"swiped-events": "^1.1.4",
 		"terser-webpack-plugin": "^5.3.6",
-		"webpack-stream": "^7.0.0"
+		"webpack-stream": "^7.0.0",
+		"gulp-html-minifier-terser": "^7.1.0"
 	},
 	"dependencies": {
+		"dotenv": "^16.5.0",
 		"ejs": "^3.1.5",
 		"express": "^5.1.0"
 	}

server/images/.directory

@@ -1,4 +0,0 @@
-[Dolphin]
-PreviewsShown=true
-Timestamp=2020,10,1,21,36,7
-Version=4