Skip to content

Commit c5a1a9f

Browse files
grs2116K3dasAarC10
authored
Feat/grayson/risk UI (#69)
Co-authored-by: Mia Pigal <m@yarn.network> Co-authored-by: Aaron <30483634+AarC10@users.noreply.github.com>
1 parent 20a369a commit c5a1a9f

22 files changed

Lines changed: 9641 additions & 0 deletions

ui/.gitignore

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?

ui/README.md

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
# `ui`
2+
3+
Ground station UI and overlays implemented in [Svelte](https://svelte.dev/).
4+
5+
Communicates with GSW through the `mqtt_producer` app and an MQTT server. This project uses [`pnpm`](https://pnpm.io/) over `npm` for its performance benefits.
6+
7+
## Usage
8+
9+
Example URL format: `http://localhost:5173/?bg=%23fafbf2&callSign=KE2EGW-1&groundStation=43.08348,-77.67641&mqttAddress=127.0.0.1:3000&mqttChannel=3&teamNumber=52`
10+
11+
Available parameters:
12+
- bg: %23\[hex code here]
13+
- callSign
14+
- groundStation: lat,lon
15+
- mockMqtt: true if mocking MQTT data
16+
- mqttAddress: address of MQTT
17+
- mqttChannel: channel for MQTT data
18+
- teamNumber
19+
20+
## Development
21+
22+
```shell
23+
# mosquitto container
24+
docker compose -f compose-services.yaml up --build
25+
26+
go run ./cmd/mqtt_producer
27+
28+
# ui development server
29+
cd ui/ && pnpm run dev
30+
```

ui/eslint.config.ts

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
import globals from "globals";
2+
import svelte from "eslint-plugin-svelte";
3+
import tseslint from "typescript-eslint";
4+
import svelteConfig from "./svelte.config.js";
5+
import stylistic from "@stylistic/eslint-plugin";
6+
import js from "@eslint/js";
7+
8+
export default [
9+
js.configs.recommended,
10+
...tseslint.configs.recommended,
11+
...svelte.configs.recommended,
12+
{
13+
plugins: {
14+
"@stylistic": stylistic,
15+
},
16+
},
17+
{
18+
languageOptions: {
19+
globals: {
20+
...globals.browser,
21+
...globals.node, // Add this if you are using SvelteKit in non-SPA mode
22+
},
23+
},
24+
},
25+
{
26+
files: ["**/*.svelte", "**/*.svelte.ts", "**/*.svelte.js"],
27+
// See more details at: https://typescript-eslint.io/packages/parser/
28+
languageOptions: {
29+
parserOptions: {
30+
projectService: true,
31+
extraFileExtensions: [".svelte"], // Add support for additional file extensions, such as .svelte
32+
parser: tseslint.parser,
33+
// Specify a parser for each language, if needed:
34+
// parser: {
35+
// ts: ts.parser,
36+
// js: espree, // Use espree for .js files (add: import espree from 'espree')
37+
// typescript: ts.parser
38+
// },
39+
40+
// We recommend importing and specifying svelte.config.js.
41+
// By doing so, some rules in eslint-plugin-svelte will automatically read the configuration and adjust their behavior accordingly.
42+
// While certain Svelte settings may be statically loaded from svelte.config.js even if you don’t specify it,
43+
// explicitly specifying it ensures better compatibility and functionality.
44+
//
45+
// If non-serializable properties are included, running ESLint with the --cache flag will fail.
46+
// In that case, please remove the non-serializable properties. (e.g. `svelteConfig: { ...svelteConfig, kit: { ...svelteConfig.kit, typescript: undefined }}`)
47+
svelteConfig
48+
},
49+
}
50+
},
51+
// {
52+
// "overrides": [
53+
// {
54+
// "files": ["*.svelte"],
55+
// "rules": {
56+
// "svelte/indent": [
57+
// "error",
58+
// { indent: 4 },
59+
// ],
60+
// "indent": "off"
61+
// }
62+
// }
63+
// ],
64+
65+
// },
66+
{
67+
rules: {
68+
"indent": [
69+
"error",
70+
4,
71+
],
72+
"svelte/indent": [
73+
"error",
74+
{ indent: 4 },
75+
],
76+
77+
"linebreak-style": ["error", "unix"],
78+
"@stylistic/quotes": ["error", "double"],
79+
"@stylistic/semi": "error",
80+
},
81+
},
82+
];

ui/index.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>GSW UI</title>
7+
</head>
8+
<body>
9+
<div id="app"></div>
10+
<script type="module" src="/src/main.ts"></script>
11+
</body>
12+
</html>

ui/package.json

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"name": "gsw-ui",
3+
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
6+
"scripts": {
7+
"dev": "vite",
8+
"build": "vite build",
9+
"preview": "vite preview",
10+
"check": "svelte-check --tsconfig ./tsconfig.app.json && tsc -p tsconfig.node.json"
11+
},
12+
"devDependencies": {
13+
"@eslint/js": "^9.39.2",
14+
"@stylistic/eslint-plugin": "^5.7.1",
15+
"@sveltejs/vite-plugin-svelte": "^6.2.1",
16+
"@tailwindcss/vite": "^4.1.18",
17+
"@tsconfig/svelte": "^5.0.6",
18+
"@types/node": "^24.10.1",
19+
"eslint": "^9.39.2",
20+
"eslint-plugin-svelte": "^3.14.0",
21+
"globals": "^17.2.0",
22+
"svelte": "^5.43.8",
23+
"svelte-check": "^4.3.4",
24+
"svelte-maplibre-gl": "^1.0.3",
25+
"tailwindcss": "^4.1.18",
26+
"typescript": "~5.9.3",
27+
"typescript-eslint": "^8.54.0",
28+
"vite": "^7.2.4"
29+
},
30+
"dependencies": {
31+
"maplibre-gl": "^5.19.0",
32+
"mqtt": "^5.14.1"
33+
}
34+
}

0 commit comments

Comments
 (0)