{"id":29121574,"url":"https://github.com/lanseria/launchdeck-nuxt-app","last_synced_at":"2026-03-05T14:03:43.696Z","repository":{"id":293629178,"uuid":"984640025","full_name":"lanseria/LaunchDeck-nuxt-app","owner":"lanseria","description":"A modern, high-performance rocket launch mission simulation and visualization platform built with Nuxt 3 and Vue 3. Its core feature is data-driven: the entire launch process, including telemetry data, key events, and display information, is defined by an independent JSON file, achieving complete separation of logic and UI. ","archived":false,"fork":false,"pushed_at":"2025-06-29T08:35:26.000Z","size":1753,"stargazers_count":2,"open_issues_count":1,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-29T09:33:14.094Z","etag":null,"topics":["launchdeck","nuxt3","rocket","spacex","svg","vue3"],"latest_commit_sha":null,"homepage":"https://launch-deck-video.netlify.app/","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lanseria.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-05-16T09:02:49.000Z","updated_at":"2025-06-29T01:51:43.000Z","dependencies_parsed_at":"2025-06-29T09:24:50.310Z","dependency_job_id":"2525c2f4-489c-473e-9cf0-4528960f1108","html_url":"https://github.com/lanseria/LaunchDeck-nuxt-app","commit_stats":null,"previous_names":["lanseria/launchdeck-nuxt-app"],"tags_count":0,"template":false,"template_full_name":"antfu/vitesse-nuxt","purl":"pkg:github/lanseria/LaunchDeck-nuxt-app","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lanseria%2FLaunchDeck-nuxt-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lanseria%2FLaunchDeck-nuxt-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lanseria%2FLaunchDeck-nuxt-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lanseria%2FLaunchDeck-nuxt-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lanseria","download_url":"https://codeload.github.com/lanseria/LaunchDeck-nuxt-app/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lanseria%2FLaunchDeck-nuxt-app/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30130031,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-05T12:40:50.676Z","status":"ssl_error","status_checked_at":"2026-03-05T12:39:32.209Z","response_time":93,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["launchdeck","nuxt3","rocket","spacex","svg","vue3"],"created_at":"2025-06-29T17:00:34.510Z","updated_at":"2026-03-05T14:03:43.676Z","avatar_url":"https://github.com/lanseria.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# LaunchDeck - 高度可定制的火箭发射模拟器\n\n[![Nuxt](https://img.shields.io/badge/Nuxt-3.x-00DC82.svg)](https://nuxt.com)\n[![Vue](https://img.shields.io/badge/Vue-3.x-4FC08D.svg)](https://vuejs.org)\n[![TypeScript](https://img.shields.io/badge/TypeScript-5.x-3178C6.svg)](https://www.typescriptlang.org/)\n[![UnoCSS](https://img.shields.io/badge/UnoCSS-gray?logo=unocss)](https://github.com/unocss/unocss)\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)\n\n一个基于 Nuxt 3 和 Vue 3 构建的现代化、高性能的火箭发射任务模拟与可视化平台。其核心特点是**数据驱动**：整个发射流程，包括遥测数据、关键事件和显示信息，都由一个独立的 `JSON` 文件定义，实现了逻辑与UI的完全分离。\n\n本项目深度整合了 SpaceX 风格的发射仪表盘UI，提供了包括动态仪表、SVG时间轴和流畅动画在内的高保真视觉体验。\n\n---\n\n### ✨ 效果预览\n\n\u003c!-- 强烈建议在此处替换为项目的动态 GIF 或视频截图 --\u003e\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"./public/preview.png\" width=\"800\"/\u003e\n  \u003cbr/\u003e\n  \u003cem\u003ehttps://launch-deck-video.netlify.app/\u003c/em\u003e\n\u003c/p\u003e\n\n---\n\n### 核心功能\n\n- 🚀 **完全数据驱动**: 整个模拟过程由一个 `JSON` 文件驱动。您可以通过修改 `JSON` 来定义全新的发射任务，无需改动任何前端代码。\n- 🛰️ **高保真UI**: 默认搭载 SpaceX 风格的仪表盘，包含：\n  - 实时更新的速度和高度仪表盘 (`Gauge`)。\n  - 动态 SVG 发射时间轴 (`TimelineSvg`)，能够流畅展示任务节点。\n  - 带有入场/出场动画的临时信息提示卡。\n- ⏱️ **高精度计时**: 采用基于 `performance.now()` 的计时引擎，确保模拟时钟的精准和动画的流畅。\n- 📊 **实时插值遥测**: 通过在关键遥测节点之间进行**平滑线性插值**，即使数据点稀疏，也能创造出连续、流畅的高度和速度变化动画。\n- 📺 **视频同步**: 支持将模拟过程与本地视频文件精确同步，包括播放、暂停、跳转和重置。\n- ⚙️ **解耦架构**:\n  - **控制面板 (`/`)**: 用于加载任务文件、控制模拟进程（开始/暂停/重置/跳转）。\n  - **显示面板 (`/control`)**: 专用于展示，可全屏显示。\n  - 两者通过 `BroadcastChannel` API 通信，实现了窗口/标签页之间的完全解耦。\n- 🔇 **iframe 实时预览**: 控制面板内嵌了一个**静音**的 `iframe` 预览窗口，提供100%真实的“所见即所得”效果。\n\n---\n\n### 🛠️ 技术栈\n\n- **核心框架**: [Nuxt 3](https://nuxt.com) (v3.17.4) + [Vue 3](https://vuejs.org)\n- **语言**: [TypeScript](https://www.typescriptlang.org/)\n- **状态管理**: [Pinia](https://pinia.vuejs.org/)\n- **样式方案**: [UnoCSS](https://github.com/unocss/unocss) (即时原子化CSS引擎)\n- **核心API**: `BroadcastChannel` API, `performance.now()`\n\n---\n\n### 快速开始\n\n#### 1. 启动应用\n\n项目包含两个主要页面：\n\n- **控制面板**: 访问根路径 `http://localhost:10630/`\n- **显示面板**: 访问路径 `http://localhost:10630/control`\n\n通常，您只需要打开**控制面板**。控制面板右侧的预览区已经内嵌了显示面板。您也可以点击预览区上方的“在新窗口打开”链接，来打开一个独立的、有声音的显示面板。\n\n#### 2. 加载任务文件\n\n在控制面板的“任务时序”卡片中，点击“选择文件”按钮，加载一个符合格式的 `JSON` 文件。\n\n项目在 `public/` 目录下提供了两个示例文件，可以直接使用：\n\n- `public/spacex-falcon9-mission.json` (猎鹰9号任务)\n- `public/zq2e-y2.json` (朱雀二号遥二任务)\n\n#### 3. 控制模拟\n\n加载文件后，即可使用控制按钮：\n\n- **开始/继续**: 启动或从暂停处继续模拟。\n- **暂停**: 暂停模拟。\n- **重置**: 将模拟重置到由 `videoConfig.startTimeOffset` 定义的初始状态。\n- **快速跳转**: 输入以秒为单位的MET（任务经过时间，负数代表T-），然后点击跳转。\n\n---\n\n### 📄 任务数据文件格式\n\n这是驱动整个模拟的核心。一个标准的 `JSON` 文件结构如下：\n\n```json\n{\n  \"missionName\": \"任务名称 (例如: Starlink Mission)\",\n  \"vehicle\": \"运载工具名称 (例如: Falcon 9)\",\n  \"videoConfig\": {\n    \"type\": \"local\",\n    \"source\": \"/videos/your_video.mp4\",\n    \"startTimeOffset\": -13\n    // 视频的第0秒对应模拟时间的T-13秒\n  },\n  \"events\": [\n    {\n      \"time\": 0,\n      \"name\": \"LIFTOFF\",\n      // telemetry (可选): 定义该时间点的遥测数据快照\n      // 在两个遥测节点之间，数据会被平滑插值\n      \"telemetry\": {\n        \"speed_kmh\": 0,\n        \"altitude_km\": 0\n      },\n      // displayInfo (可选): 定义该时间点要临时显示的右下角信息\n      \"displayInfo\": {\n        \"title\": \"LIFTOFF\",\n        \"line1\": \"FALCON 9 HAS CLEARED THE TOWER\",\n        \"line2\": \"\",\n        \"line3\": \"\"\n      }\n    },\n    {\n      \"time\": 72,\n      \"name\": \"MAX-Q\",\n      \"telemetry\": {\n        \"speed_kmh\": 1900,\n        \"altitude_km\": 11.5\n      },\n      \"displayInfo\": {\n        \"title\": \"MAX-Q\",\n        \"line1\": \"MAXIMUM DYNAMIC PRESSURE\",\n        \"line2\": \"THIS IS THE LARGEST AMOUNT OF STRESS\",\n        \"line3\": \"EXERTED ON THE VEHICLE\"\n      }\n    }\n    // ... 更多事件节点\n  ]\n}\n```\n\n---\n\n### 📦 项目设置\n\n1.  **克隆项目**\n\n    ```bash\n    git clone https://github.com/lanseria/LaunchDeck-nuxt-app.git\n    cd LaunchDeck-nuxt-app\n    ```\n\n2.  **安装依赖**\n    推荐使用 `pnpm`：\n\n    ```bash\n    pnpm install\n    ```\n\n3.  **启动开发服务器**\n    ```bash\n    pnpm dev\n    ```\n    应用将在 `http://localhost:10630` 上运行。\n\n---\n\n### 目录结构概览\n\n- `composables/store/control.ts`: **核心逻辑**，包含模拟引擎和计时器。\n- `composables/store/display.ts`: **显示逻辑**，负责接收和存储广播数据。\n- `components/Dashboards/SpaceXFalcon9.vue`: **主UI组件**，组装了所有仪表盘元素。\n- `components/Dashboards/Common/`: 存放如 `Gauge.vue`, `TimelineSvg.vue` 等可复用的UI子组件。\n- `pages/index.vue`: 控制面板页面。\n- `pages/control.vue`: 显示面板页面。\n- `public/`: 存放任务 `JSON` 文件和视频文件。\n- `types/launchdeck.d.ts`: 全局 TypeScript 类型定义。\n\n---\n\n### 💡 未来可拓展方向\n\n- **更多主题**: 创建新的仪表盘主题组件，并通过 `controlStore` 实现主题切换。\n- **实时API对接**: 修改 `controlStore` 以从 WebSocket 或 SSE API 获取实时遥测数据，而不是从文件读取。\n- **交互式编辑器**: 创建一个UI界面，让用户可以可视化地编辑 `events` 时间轴和其属性。\n\n---\n\n### 致谢\n\n- 本项目基于 [Vitesse for Nuxt 3](https://github.com/antfu/vitesse-nuxt3) 模板。\n- UI风格和部分组件逻辑的灵感来源于 [spacex-launch-timeline](https://github.com/HarishChaudhari/spacex-launch-timeline) 项目。\n\n---\n\n### 许可证\n\n[MIT](./LICENSE) © 2024 Lanseria\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flanseria%2Flaunchdeck-nuxt-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flanseria%2Flaunchdeck-nuxt-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flanseria%2Flaunchdeck-nuxt-app/lists"}