Add LWN News section

server/scripts/modules/linuxnews.mjs

@@ -0,0 +1,89 @@
+import { safeJson } from './utils/fetch.mjs';
+import STATUS from './status.mjs';
+import WeatherDisplay from './weatherdisplay.mjs';
+import { registerDisplay } from './navigation.mjs';
+import { debugFlag } from './utils/debug.mjs';
+
+const STORIES_PER_PAGE = 2;
+const PAGE_DURATION_MS = 9000;
+
+class LinuxNews extends WeatherDisplay {
+	constructor(navId, elemId) {
+		super(navId, elemId, 'Linux News: LWN', true);
+		this.timing.baseDelay = PAGE_DURATION_MS;
+	}
+
+	async getData(weatherParameters, refresh) {
+		if (!super.getData(weatherParameters, refresh)) return;
+
+		try {
+			const response = await safeJson('/api/linux-news', {
+				retryCount: 0,
+			});
+
+			if (!response?.success || !response.stories?.length) {
+				if (debugFlag('linuxnews')) {
+					console.log('Linux News: no stories available');
+				}
+				this.setStatus(STATUS.noData);
+				return;
+			}
+
+			this.data = response.stories.slice(0, 8);
+			this.setStatus(STATUS.loaded);
+		} catch (error) {
+			if (debugFlag('linuxnews')) {
+				console.log('Linux News: error fetching data:', error.message);
+			}
+			this.setStatus(STATUS.noData);
+		}
+	}
+
+	async drawCanvas() {
+		super.drawCanvas();
+
+		const outputElem = this.elem.querySelector('.news-output');
+		const container = this.elem.querySelector('.container');
+		const pages = [];
+
+		for (let i = 0; i < this.data.length; i += STORIES_PER_PAGE) {
+			pages.push(this.data.slice(i, i + STORIES_PER_PAGE));
+		}
+
+		outputElem.innerHTML = '';
+		pages.forEach((pageStories) => {
+			const pageElem = document.createElement('div');
+			pageElem.className = 'news-page';
+
+			pageStories.forEach((story) => {
+				const storyElem = document.createElement('div');
+				storyElem.className = 'story';
+
+				const headlineElem = document.createElement('div');
+				headlineElem.className = 'headline';
+				headlineElem.textContent = story.headline;
+
+				const blurbElem = document.createElement('div');
+				blurbElem.className = 'blurb';
+				blurbElem.textContent = story.blurb;
+
+				storyElem.append(headlineElem, blurbElem);
+				pageElem.appendChild(storyElem);
+			});
+
+			outputElem.appendChild(pageElem);
+		});
+
+		this.pageHeight = container.offsetHeight;
+		this.timing.totalScreens = Math.max(1, pages.length);
+		this.timing.delay = new Array(this.timing.totalScreens).fill(1);
+		this.calcNavTiming();
+
+		const top = -this.screenIndex * this.pageHeight;
+		outputElem.style.top = `${top}px`;
+
+		this.finishDraw();
+	}
+}
+
+registerDisplay(new LinuxNews(14, 'linux-news'));

server/styles/scss/_linux-news.scss

@@ -0,0 +1,54 @@
+@use 'shared/_utils' as u;
+
+.weather-display .linux-news {
+	&.main {
+		height: auto !important;
+		min-height: 250px;
+	}
+
+	.container {
+		position: relative;
+		top: 15px;
+		margin: 0px 10px;
+		box-sizing: border-box;
+		height: 250px;
+		overflow: hidden;
+	}
+
+	.news-output {
+		position: relative;
+
+		.news-page {
+			height: 250px;
+			box-sizing: border-box;
+			padding: 0 8px;
+			display: flex;
+			flex-direction: column;
+			justify-content: space-between;
+		}
+
+		.story {
+			height: 116px;
+			overflow: hidden;
+		}
+
+		.headline {
+			font-family: 'Star4000';
+			font-size: 17pt;
+			line-height: 22px;
+			color: #ff0;
+			text-transform: uppercase;
+			@include u.text-shadow();
+			margin-bottom: 4px;
+		}
+
+		.blurb {
+			font-family: 'Star4000';
+			font-size: 14pt;
+			line-height: 16px;
+			color: #fff;
+			@include u.text-shadow();
+			overflow: hidden;
+		}
+	}
+}

server/styles/scss/ws.scss

@@ -15,4 +15,5 @@
 @use 'media';
 @use 'spc-outlook';
 @use 'server-observations';
-@use 'shared/scanlines';
+@use 'linux-news';
+@use 'shared/scanlines';