release: bump version to 0.28.1

frontend/public/earth/js/controls.js

@@ -35,7 +35,7 @@ let cleanupFns = [];
 const HUD_PANEL_IDS = [
   "legend",
   "earth-stats",
-  "tv-panel",
+  "media-panel",
   "layer-toggles",
 ];
 const DRAGGABLE_PANEL_SELECTOR = ".hud-panel-draggable";
@@ -94,7 +94,7 @@ function setHudPanelVisibility(panelId, visible) {
   if (!panel) return;
   panel.classList.toggle("hud-panel-hidden", !visible);
   syncSettingsToggle(panelId, visible);
-  if (panelId === "tv-panel") {
+  if (panelId === "media-panel") {
     updateTVToggleUI(visible);
     updateNewsToggleUI(visible);
     if (visible) {
@@ -236,7 +236,7 @@ function setupDraggableHudPanels() {
     };
 
     bindListener(handle, "pointerdown", (event) => {
-      if (event.target.closest(".hud-panel-close, .hud-panel__action, .layer-panel-btn, .info-card-close, .tv-panel-select, .tv-panel-tab, .tv-panel-player, .tv-panel-edge, .legend-bar-btn, .news-story-card")) return;
+      if (event.target.closest(".hud-panel-close, .hud-panel__action, .layer-panel-btn, .info-card-close, .tv-panel-select, .media-panel-tab, .tv-panel-player, .tv-panel-edge, .legend-bar-btn, .news-story-card")) return;
       isDragging = true;
       startPointerX = event.clientX;
       startPointerY = event.clientY;
@@ -807,14 +807,14 @@ function setupTerrainControls() {
     showStatusMessage(expanded ? "布局已最大化" : "布局已恢复", "info");
   });
 
-  const tvVisible = !document.getElementById("tv-panel")?.classList.contains("hud-panel-hidden");
-  updateTVToggleUI(tvVisible);
-  if (tvVisible) {
+  const mediaVisible = !document.getElementById("media-panel")?.classList.contains("hud-panel-hidden");
+  updateTVToggleUI(mediaVisible);
+  if (mediaVisible) {
     ensureTVPanelReady().catch((error) => {
       console.error("初始化电视直播面板失败:", error);
     });
   }
-  updateNewsToggleUI(!document.getElementById("tv-panel")?.classList.contains("hud-panel-hidden"));
+  updateNewsToggleUI(mediaVisible);
   ensureNewsPanelReady().catch((error) => {
     console.error("初始化态势新闻内容失败:", error);
   });

frontend/public/earth/js/main.js

@@ -194,10 +194,8 @@ const HUD_INTERACTIVE_SELECTORS = [
   "#legend *",
   "#earth-stats",
   "#earth-stats *",
-  "#tv-panel",
-  "#tv-panel *",
-  "#news-panel",
-  "#news-panel *",
+  "#media-panel",
+  "#media-panel *",
 ];
 
 function bindListener(target, eventName, handler, options) {

frontend/public/earth/js/news.js

@@ -1,6 +1,10 @@
 import { showStatusMessage } from "./ui.js";
 import { getActiveTVTab, openTVPanelTab, isTVPanelVisible, setTVPanelVisible } from "./tv.js";
 
+// News aggregation now lives inside the shared media panel:
+// - outer shell: #media-panel
+// - this module renders into inner pane: #news-panel
+
 const EARTH_NEWS_API = "/api/v1/news/earth-feed";
 const FOCUS_UPDATE_INTERVAL_MS = 4000;
 const DATA_REFRESH_INTERVAL_MS = 180000;

frontend/public/earth/js/tv.js

@@ -2,6 +2,11 @@ import Hls from "hls.js";
 import { showStatusMessage } from "./ui.js";
 import { createHUDPanel } from "./hud-panels.js";
 
+// Naming convention:
+// - #media-panel is the outer HUD shell, responsible for drag/resize/show-hide
+// - #tv-panel is the inner live tab pane
+// - #news-panel is the inner aggregation-news tab pane
+
 const TV_STREAMS_API = "/api/v1/tv/streams";
 const TV_PROXY_API = "/api/v1/tv/proxy";
 const TV_STATUS_MESSAGE = {
@@ -22,7 +27,7 @@ let refreshPromise = null;
 let hlsPlayer = null;
 let hlsRecoveryAttempts = 0;
 let metaAutoCollapseTimer = null;
-let tvPanel = null;
+let mediaPanel = null;
 let activeTab = "live";
 const failedSourceIds = new Set();
 let probeTimer = null;
@@ -48,7 +53,8 @@ const HLS_RETRY_CONFIG = {
 
 function getElements() {
   return {
-    panel: document.getElementById("tv-panel"),
+    // Outer media shell node.
+    panel: document.getElementById("media-panel"),
     toggleBtn: document.getElementById("toggle-tv"),
     select: document.getElementById("tv-source-select"),
     title: document.getElementById("tv-source-title"),
@@ -67,13 +73,14 @@ function getElements() {
     newsHeaderControls: document.getElementById("tv-header-controls-news"),
     liveTabBtn: document.getElementById("tv-tab-live"),
     newsTabBtn: document.getElementById("tv-tab-news"),
-    livePane: document.getElementById("tv-tab-live-pane"),
-    newsPane: document.getElementById("tv-tab-news-pane"),
+    // Inner tab panes.
+    livePane: document.getElementById("tv-panel"),
+    newsPane: document.getElementById("news-panel"),
   };
 }
 
 function setMetaCollapsed(collapsed) {
-  tvPanel?.setCollapsed(collapsed);
+  mediaPanel?.setCollapsed(collapsed);
 }
 
 function syncPanelActiveTab(tab = activeTab) {
@@ -224,7 +231,7 @@ function updateToggleButton(visible) {
 }
 
 function syncSettingsToggle(visible) {
-  const input = document.querySelector('[data-settings-panel="tv-panel"]');
+  const input = document.querySelector('[data-settings-panel="media-panel"]');
   if (input instanceof HTMLInputElement) {
     input.checked = visible;
   }
@@ -233,7 +240,7 @@ function syncSettingsToggle(visible) {
 function setPanelVisible(visible) {
   const { panel } = getElements();
   if (!panel) return;
-  tvPanel?.setVisible(visible);
+  mediaPanel?.setVisible(visible);
   updateToggleButton(visible);
   syncSettingsToggle(visible);
   window.dispatchEvent(new CustomEvent("earth:tv-visibility-change", {
@@ -336,7 +343,7 @@ function updateTabState(target, isActive, activeClassName = "") {
 
 function updateTabButtonState(button, isActive) {
   if (!(button instanceof HTMLButtonElement)) return;
-  button.classList.toggle("tv-panel-tab--active", isActive);
+  button.classList.toggle("media-panel-tab--active", isActive);
   button.setAttribute("aria-selected", isActive ? "true" : "false");
 }
 
@@ -376,7 +383,7 @@ export function openTVPanelTab(tab = "live") {
 }
 
 export function isTVPanelVisible() {
-  return tvPanel?.isVisible() ?? !getElements().panel?.classList.contains("hud-panel-hidden");
+  return mediaPanel?.isVisible() ?? !getElements().panel?.classList.contains("hud-panel-hidden");
 }
 
 export function getActiveTVTab() {
@@ -861,7 +868,7 @@ export function initTVPanel() {
   } = getElements();
 
   if (panel && metaToggle) {
-    tvPanel = createHUDPanel({
+    mediaPanel = createHUDPanel({
       panel,
       header: ".hud-panel__header",
       body: "#tv-meta-wrap",
@@ -873,13 +880,13 @@ export function initTVPanel() {
     });
   }
 
-  updateToggleButton(tvPanel?.isVisible() ?? !panel?.classList.contains("hud-panel-hidden"));
-  syncSettingsToggle(tvPanel?.isVisible() ?? !panel?.classList.contains("hud-panel-hidden"));
+  updateToggleButton(mediaPanel?.isVisible() ?? !panel?.classList.contains("hud-panel-hidden"));
+  syncSettingsToggle(mediaPanel?.isVisible() ?? !panel?.classList.contains("hud-panel-hidden"));
 
   toggleBtn?.addEventListener("click", async (event) => {
     event.preventDefault();
     event.stopPropagation();
-    const currentlyVisible = tvPanel?.isVisible() ?? false;
+    const currentlyVisible = mediaPanel?.isVisible() ?? false;
     if (!currentlyVisible) {
       setPanelVisible(true);
       setActiveTab("live");
@@ -907,7 +914,7 @@ export function initTVPanel() {
 
   metaToggle?.addEventListener("click", () => {
     clearTimeout(metaAutoCollapseTimer);
-    const isNowCollapsed = !(tvPanel?.isCollapsed() ?? false);
+    const isNowCollapsed = !(mediaPanel?.isCollapsed() ?? false);
     setMetaCollapsed(isNowCollapsed);
   });