page delivery tweaks

gulp/publish-frontend.mjs

@@ -159,6 +159,9 @@ const uploadImages = () => src(imageSources, { base: './server', encoding: false
 		s3({
 			Bucket: process.env.BUCKET,
 			StorageClass: 'STANDARD',
+			maps: {
+				CacheControl: () => 'max-age=31536000',
+			},
 		}),
 	);
 

server/fonts/ReadMe.txt

@@ -1,30 +0,0 @@
---Star 3000--
-
-Star3000.ttf - Standard text style for most screens (and Travel Cities title header)
-Star3000 Small.ttf - Time/Date and some page headers
-Star3000 Large.ttf - Travel Cities Forecast (Forecast portion only)
-Star3000 Extra Large.ttf - Only used on some advertiser text
-Star3000 Extended.ttf - Only used on some advertiser text
-"Heavy" style is an emboldened version of the standard font (used on some STARs)
-
-Star3000 Outline.ttf - A contrast border (stroke) that surrounds the Star3000.ttf base font. When used, must be as a text layer undeneath the base font (and is usually black in color).
-Star3000 Small Outline.ttf - A contrast border (stroke) that surrounds the Star3000 Small.ttf base font. When used, must be as a text layer undeneath the base font (and is usually black in color).
-Star3000 Large Outline.ttf - A contrast border (stroke) that surrounds the Star3000 Large.ttf base font. When used, must be as a text layer undeneath the base font (and is usually black in color).
-
-***Outlines for other font styles are not currently available.
-
---Star 4000--
-
-Star4000.ttf - Standard text style for zone forecast, observation tables, regional map cities, almanac, extended forecast day/weather/temperature headers, Current Conditions right half data and most page header titles (also Travel Cities title header before Nov. 1992)
-Star4000 Small.ttf - Time/Date, NWS Local Update page header, temperature header for Travel Cities Forecast (after Nov. 1992)
-Star4000 Large.ttf - City names and temperature data on Travel Cities Forecast (after Nov. 1992), Extended forecast temperature values (after Feb. 1991), Current Conditions temperature value (after Mar. 1991)
-Star4000 Large Compressed - Travel Cities Forecast (before Nov. 1992), regional map temperatures
-Star4000 Large Compressed Numbers - Temperature values on regional forecast/observation maps
-Star4000 Extended - A proportional width font used for the Current Conditions present weather description and wind data
-Star 4 Radar.ttf - Radar airport I.D.
-
---Star Jr.--
-
-StarJr.ttf - Standard text style for most screens (and Travel Cities title header)
-StarJr Small.ttf - Time/Date and some page headers
-StarJr Compressed.ttf - Travel Cities Forecast

server/scripts/modules/radar.mjs

@@ -52,7 +52,7 @@ class Radar extends WeatherDisplay {
 		}
 
 		// get the base map
-		const src = 'images/maps/radar.jpg';
+		const src = 'images/maps/radar.webp';
 		this.baseMap = await loadImg(src);
 
 		const baseUrl = 'https://mesonet.agron.iastate.edu/archive/data/';

server/scripts/modules/regionalforecast.mjs

@@ -28,7 +28,7 @@ class RegionalForecast extends WeatherDisplay {
 		// there are enough other cities available to populate the map sufficiently even if some do not load
 
 		// pre-load the base map
-		let baseMap = 'images/maps/basemap.png';
+		let baseMap = 'images/maps/basemap.webp';
 		if (weatherParameters.state === 'HI') {
 			baseMap = 'images/maps/radar-hawaii.png';
 		} else if (weatherParameters.state === 'AK') {

server/styles/scss/_page.scss

@@ -254,35 +254,24 @@ body {
 @font-face {
 	font-family: "Star4000";
 	src: url('../fonts/Star4000.woff') format('woff');
-}
+	font-display: swap;
-
-@font-face {
-	font-family: "Star 4 Radar";
-	src: url('../fonts/Star 4 Radar.woff') format('woff');
 }
 
 @font-face {
 	font-family: 'Star4000 Extended';
 	src: url('../fonts/Star4000 Extended.woff') format('woff');
-}
+	font-display: swap;
-
-@font-face {
-	font-family: 'Star4000LCN';
-	src: url('../fonts/Star4000LCN.woff') format('woff');
-}
-
-@font-face {
-	font-family: 'Star4000 Large Compressed';
-	src: url('../fonts/Star4000 Large Compressed.woff') format('woff');
 }
 
 @font-face {
 	font-family: 'Star4000 Large';
-	src: url('../fonts/Star4000 Large.ttf') format('truetype');
+	src: url('../fonts/Star4000 Large.woff') format('woff');
+	font-display: swap;
 }
 
 @font-face {
 	font-family: 'Star4000 Small';
+	font-display: swap;
 	src: url('../fonts/Star4000 Small.woff') format('woff');
 }
 

views/index.ejs

@@ -18,6 +18,10 @@
 	<meta property="og:image" content="https://weatherstar.netbymatt.com/images/social/1200x600.png">
 	<meta property="og:image:width" content="1200">
 	<meta property="og:image:height" content="627">
+	<link rel="preload" href="fonts/Star4000.woff" as="font" type="font/woff" crossorigin>
+	<link rel="preload" href="fonts/Star4000 Extended.woff" as="font" type="font/woff" crossorigin>
+	<link rel="preload" href="fonts/Star4000 Large.woff" as="font" type="font/woff" crossorigin>
+	<link rel="preload" href="fonts/Star4000 Small.woff" as="font" type="font/woff" crossorigin>
 
   <% if (production) { %>
   <link rel="stylesheet" type="text/css" href="resources/ws.min.css?_=<%=production%>" />

views/partials/radar.ejs

@@ -35,7 +35,7 @@
 		<div class="scroll-area">
 			<div class="frame template">
 				<div class="map">
-					<img src="images/maps/radar.jpg" />
+					<img src="images/maps/radar.webp" />
 				</div>
 			</div>
 		</div>

views/partials/regional-forecast.ejs

@@ -1,6 +1,6 @@
 <%- include('header.ejs', {titleDual:{ top: 'Regional' , bottom: 'Observations' }, hasTime: true }) %>
 	<div class="main has-scroll regional-forecast">
-		<div class="map"><img src="images/maps/basemap.png" /></div>
+		<div class="map"><img src="images/maps/basemap.webp" /></div>
 		<div class="location-container">
 			<div class="location template">
 				<div class="icon">