Replace separate .js data files with server-side JSON injection

- Remove need to maintain duplicate .js data files alongside JSON sources
- Load JSON data once at server startup and inject into templates
- Dev and production modes use the same data sources

Removes:
- server/scripts/data/{travelcities,regionalcities,stations}.js
- gulp compressJsData task for bundling data files

gulp/publish-frontend.mjs

@@ -26,11 +26,7 @@ const cloudfront = new CloudFrontClient({ region: 'us-east-1' });
 
 const RESOURCES_PATH = './dist/resources';
 
-const jsSourcesData = [
+// Data is now injected server-side, no need to bundle separate data files
-	'server/scripts/data/travelcities.js',
-	'server/scripts/data/regionalcities.js',
-	'server/scripts/data/stations.js',
-];
 
 const webpackOptions = {
 	mode: 'production',
@@ -56,11 +52,6 @@ const webpackOptions = {
 	},
 };
 
-const compressJsData = () => src(jsSourcesData)
-	.pipe(concat('data.min.js'))
-	.pipe(terser())
-	.pipe(dest(RESOURCES_PATH));
-
 const jsVendorSources = [
 	'server/scripts/vendor/auto/nosleep.js',
 	'server/scripts/vendor/auto/swiped-events.js',
@@ -133,12 +124,20 @@ const compressHtml = async () => {
 	const packageJson = await readFile('package.json');
 	const { version } = JSON.parse(packageJson);
 
+	// Load the same data that the main server uses
+	const travelCities = JSON.parse(await readFile('./datagenerators/output/travelcities.json'));
+	const regionalCities = JSON.parse(await readFile('./datagenerators/output/regionalcities.json'));
+	const stationInfo = JSON.parse(await readFile('./datagenerators/output/stations.json'));
+
 	return src(htmlSources)
 		.pipe(ejs({
 			production: version,
 			version,
 			OVERRIDES,
 			query: {},
+			travelCities,
+			regionalCities,
+			stationInfo,
 		}))
 		.pipe(rename({ extname: '.html' }))
 		.pipe(htmlmin({ collapseWhitespace: true }))

index.mjs

@@ -1,6 +1,7 @@
 import 'dotenv/config';
 import express from 'express';
 import fs from 'fs';
+import { readFile } from 'fs/promises';
 import {
 	weatherProxy, radarProxy, outlookProxy, mesonetProxy,
 } from './proxy/handlers.mjs';
@@ -8,6 +9,10 @@ import playlist from './src/playlist.mjs';
 import OVERRIDES from './src/overrides.mjs';
 import cache from './proxy/cache.mjs';
 
+const travelCities = JSON.parse(await readFile('./datagenerators/output/travelcities.json'));
+const regionalCities = JSON.parse(await readFile('./datagenerators/output/regionalcities.json'));
+const stationInfo = JSON.parse(await readFile('./datagenerators/output/stations.json'));
+
 const app = express();
 const port = process.env.WS4KP_PORT ?? 8080;
 
@@ -55,6 +60,9 @@ const index = (req, res) => {
 		version,
 		OVERRIDES,
 		query: req.query,
+		travelCities,
+		regionalCities,
+		stationInfo,
 	});
 };
 

server/scripts/data/travelcities.js

@@ -1,243 +0,0 @@
-// eslint-disable-next-line no-unused-vars
-const TravelCities = [
-	{
-		Name: 'Atlanta',
-		Latitude: 33.749,
-		Longitude: -84.388,
-		point: {
-			x: 51,
-			y: 87,
-			wfo: 'FFC',
-		},
-	},
-	{
-		Name: 'Boston',
-		Latitude: 42.3584,
-		Longitude: -71.0598,
-		point: {
-			x: 71,
-			y: 90,
-			wfo: 'BOX',
-		},
-	},
-	{
-		Name: 'Chicago',
-		Latitude: 41.9796,
-		Longitude: -87.9045,
-		point: {
-			x: 66,
-			y: 77,
-			wfo: 'LOT',
-		},
-	},
-	{
-		Name: 'Cleveland',
-		Latitude: 41.4995,
-		Longitude: -81.6954,
-		point: {
-			x: 83,
-			y: 65,
-			wfo: 'CLE',
-		},
-	},
-	{
-		Name: 'Dallas',
-		Latitude: 32.8959,
-		Longitude: -97.0372,
-		point: {
-			x: 80,
-			y: 109,
-			wfo: 'FWD',
-		},
-	},
-	{
-		Name: 'Denver',
-		Latitude: 39.7391,
-		Longitude: -104.9847,
-		point: {
-			x: 63,
-			y: 61,
-			wfo: 'BOU',
-		},
-	},
-	{
-		Name: 'Detroit',
-		Latitude: 42.3314,
-		Longitude: -83.0457,
-		point: {
-			x: 66,
-			y: 34,
-			wfo: 'DTX',
-		},
-	},
-	{
-		Name: 'Hartford',
-		Latitude: 41.7637,
-		Longitude: -72.6851,
-		point: {
-			x: 21,
-			y: 54,
-			wfo: 'BOX',
-		},
-	},
-	{
-		Name: 'Houston',
-		Latitude: 29.7633,
-		Longitude: -95.3633,
-		point: {
-			x: 65,
-			y: 97,
-			wfo: 'HGX',
-		},
-	},
-	{
-		Name: 'Indianapolis',
-		Latitude: 39.7684,
-		Longitude: -86.158,
-		point: {
-			x: 58,
-			y: 69,
-			wfo: 'IND',
-		},
-	},
-	{
-		Name: 'Los Angeles',
-		Latitude: 34.0522,
-		Longitude: -118.2437,
-		point: {
-			x: 155,
-			y: 45,
-			wfo: 'LOX',
-		},
-	},
-	{
-		Name: 'Miami',
-		Latitude: 25.7743,
-		Longitude: -80.1937,
-		point: {
-			x: 110,
-			y: 51,
-			wfo: 'MFL',
-		},
-	},
-	{
-		Name: 'Minneapolis',
-		Latitude: 44.98,
-		Longitude: -93.2638,
-		point: {
-			x: 108,
-			y: 72,
-			wfo: 'MPX',
-		},
-	},
-	{
-		Name: 'New York',
-		Latitude: 40.7142,
-		Longitude: -74.0059,
-		point: {
-			x: 33,
-			y: 35,
-			wfo: 'OKX',
-		},
-	},
-	{
-		Name: 'Norfolk',
-		Latitude: 36.8468,
-		Longitude: -76.2852,
-		point: {
-			x: 90,
-			y: 52,
-			wfo: 'AKQ',
-		},
-	},
-	{
-		Name: 'Orlando',
-		Latitude: 28.5383,
-		Longitude: -81.3792,
-		point: {
-			x: 26,
-			y: 68,
-			wfo: 'MLB',
-		},
-	},
-	{
-		Name: 'Philadelphia',
-		Latitude: 39.9523,
-		Longitude: -75.1638,
-		point: {
-			x: 50,
-			y: 76,
-			wfo: 'PHI',
-		},
-	},
-	{
-		Name: 'Pittsburgh',
-		Latitude: 40.4406,
-		Longitude: -79.9959,
-		point: {
-			x: 78,
-			y: 66,
-			wfo: 'PBZ',
-		},
-	},
-	{
-		Name: 'St. Louis',
-		Latitude: 38.6273,
-		Longitude: -90.1979,
-		point: {
-			x: 95,
-			y: 74,
-			wfo: 'LSX',
-		},
-	},
-	{
-		Name: 'San Francisco',
-		Latitude: 37.7749,
-		Longitude: -122.4194,
-		point: {
-			x: 85,
-			y: 105,
-			wfo: 'MTR',
-		},
-	},
-	{
-		Name: 'Seattle',
-		Latitude: 47.6062,
-		Longitude: -122.3321,
-		point: {
-			x: 125,
-			y: 68,
-			wfo: 'SEW',
-		},
-	},
-	{
-		Name: 'Syracuse',
-		Latitude: 43.0481,
-		Longitude: -76.1474,
-		point: {
-			x: 52,
-			y: 99,
-			wfo: 'BGM',
-		},
-	},
-	{
-		Name: 'Tampa',
-		Latitude: 27.9475,
-		Longitude: -82.4584,
-		point: {
-			x: 71,
-			y: 97,
-			wfo: 'TBW',
-		},
-	},
-	{
-		Name: 'Washington DC',
-		Latitude: 38.8951,
-		Longitude: -77.0364,
-		point: {
-			x: 97,
-			y: 71,
-			wfo: 'LWX',
-		},
-	},
-];

views/index.ejs

@@ -25,7 +25,12 @@
 
   <% if (production) { %>
   <link rel="stylesheet" type="text/css" href="resources/ws.min.css?_=<%=production%>" />
-  <script type="text/javascript" src="resources/data.min.js?_=<%=production%>"></script>
+  <!-- data must be loaded before main script -->
+  <script>
+    window.TravelCities = <%- JSON.stringify(travelCities) %>;
+    window.RegionalCities = <%- JSON.stringify(regionalCities) %>;
+    window.StationInfo = <%- JSON.stringify(stationInfo) %>;
+  </script>
   <script type="text/javascript" src="resources/vendor.min.js?_=<%=production%>"></script>
   <script type="text/javascript" src="resources/ws.min.js?_=<%=production%>"></script>
 	<script type="text/javascript">const OVERRIDES=<%-JSON.stringify(OVERRIDES)%>;</script>
@@ -56,9 +61,11 @@
 	<script type="module" src="scripts/modules/media.mjs"></script>
 	<script type="module" src="scripts/index.mjs"></script>
   <!-- data -->
-  <script type="text/javascript" src="scripts/data/travelcities.js"></script>
+  <script>
-  <script type="text/javascript" src="scripts/data/regionalcities.js"></script>
+    window.TravelCities = <%- JSON.stringify(travelCities) %>;
-  <script type="text/javascript" src="scripts/data/stations.js"></script>
+    window.RegionalCities = <%- JSON.stringify(regionalCities) %>;
+    window.StationInfo = <%- JSON.stringify(stationInfo) %>;
+  </script>
   <% } %>
 
 </head>