SimpleGCS: added simple web GCS by tridge · Pull Request #267 · ArduPilot/WebTools

tridge · 2025-08-10T08:50:10Z

simple web UI for a boat, designed for my autonomous buoy
builds on #265

and add cli_test.js

Copilot

Pull Request Overview

This PR adds a "SimpleGCS" web-based ground control station designed for autonomous buoys and small boats. It builds on the existing WebTools framework and adds MAVLink FTP capabilities for fetching fence data.

Adds a complete SimpleGCS implementation with touch-friendly interface for mobile use
Implements MAVLink FTP protocol for file transfers (specifically for fence data)
Updates TelemetryDashboard to use a centralized MAVLink module structure

Reviewed Changes

Copilot reviewed 13 out of 20 changed files in this pull request and generated 6 comments.

Show a summary per file

File	Description
modules/MAVLink/mavftp.js	New MAVLink FTP implementation and fence data parser
modules/MAVLink/local_modules/	Added jspack dependencies for binary data handling
SimpleGCS/	Complete new GCS application with map interface and vehicle control
TelemetryDashboard/	Updated to use centralized MAVLink modules and improved connection handling
Dev/index.html	Added SimpleGCS to the development index page

Comments suppressed due to low confidence (1)

modules/MAVLink/mavftp.js:116

Variable name 'setup_passphase' contains a spelling error. It should be 'setup_passphrase' (missing 'r').

	    payload: null

modules/MAVLink/mavftp.js

SimpleGCS/app.js

TelemetryDashboard/TelemetryDashboard.js

rmackay9 · 2025-08-11T01:14:12Z

This is great to see! I think the world will be flooded with custom GCS from now on and I think it's going to make AP's usability much better.

and added mavftp

IamPete1

There is quite a bit of inlining of html/css which could be done in the index either directly or with a template.

The formating is also quite bad in places. It would benefit from a tidyup to make it easyer to read.

IamPete1 · 2025-08-12T10:49:38Z

SimpleGCS/app.js

+	DOCK         : 8,
+	CIRCLE       : 9,


Odd indentation.

IamPete1 · 2025-08-12T10:52:15Z

SimpleGCS/app.js

+	    params[0] || 0, params[1] || 0, params[2] || 0, params[3] || 0,
+	    params[4] || 0, params[5] || 0, params[6] || 0


Strictly this should be || NaN

IamPete1 · 2025-08-12T10:53:49Z

SimpleGCS/app.js

+	const el = document.createElement("div");
+	el.className = "toast";
+	el.textContent = msg;
+	document.body.appendChild(el);


html templates can make this stuff a bit nicer. You can import the template and inject it.

IamPete1 · 2025-08-12T10:54:06Z

SimpleGCS/app.js

+  <div style="display:flex; justify-content:space-between; font-size:13px; margin-bottom:4px;">
+    <span></span>
+    <span id="armed-pill" style="
+      padding:1px 4px; border-radius:999px; font-weight:500;
+      background:#9e9e9e; color:#111;">DISARM</span>
+  </div>
+  <div style="opacity:0.8">MODE: <span id="mode-value" style="font-weight:700">—</span></div>


Maybe a template again.

Or it looks like this is always added? Maybe it can just be in the html.

IamPete1 · 2025-08-12T10:55:27Z

SimpleGCS/app.js

+  <div style="opacity: 0.7; margin-bottom: 2px;">BATTERY</div>
+  <div id="battery-value" style="font-size: 14px; font-weight: bold;">---%</div>
+  <div id="current-value" style="font-size: 12px; opacity: 0.85;">--- A</div>


IamPete1 · 2025-08-12T10:58:41Z

SimpleGCS/app.js

+	};
+
+	const svg = `
+      <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 24 24" style="transform: rotate(${rotateDeg}deg); transform-origin: center;">


You can do the rotation in leaflet I think. You could have a look at the map widget in telemetry dashboard.

IamPete1 · 2025-08-12T11:01:20Z

SimpleGCS/app.js

+	url_input.value = localStorage.getItem(LS_KEYS.url) || "ws://127.0.0.1:56781";
+	passphrase_input.value = localStorage.getItem(LS_KEYS.pass) || "";


I have been reading up about GDPR, this is probably not allowed without getting consent first. But I guess we have the same problem on the wiki too.

IamPete1 · 2025-08-12T11:06:59Z

TelemetryDashboard/Examples/URDF_Viewer.json

    }
  }
-}
+}


Its there a real change in this file somewhere?

One disadvantage of the json widget format is that it is hard to read in its native format like this.

IamPete1 · 2025-08-12T11:21:23Z

TelemetryDashboard/cli_test.js

@@ -0,0 +1,113 @@
+//!/usr/bin/env node


Would this be better in the new SimpleGSC directory?

davidbuzz · 2025-10-21T00:59:33Z

Not sure why u didnt look around at the existing web-based frontends, and node-based backends before writing this.? There's plenty of existing similar work: ( did u refer to any of these?)
https://github.com/davidbuzz/MAVControl/blob/master/mavudp_to_ws_server.js - thats similar to your TelemetryDashboard/cli_test.js but includes more explicit UDP, a namespaced websocket, and uses mainsteream node stuff like express.js and socket.io its a bit old, and prob doesnt run right now, so I get u not noticing it.
https://github.com/davidbuzz/MAVAgent/blob/master/mav-agent.js - its got loadable modules like mavproxy, would (have) been a great target/place to add your mavftp.js impl, and already does tcp and udp , and supports multiple concurrent vehicles with a popular node library called 'Backbone' for vehicle states, can do missions, params, and signing. its also a bit old, so probably wont run with your latest mavlink.js , but thats a small issue. Did i mention its a lot like mavproxy? :-)

tridge added 2 commits August 9, 2025 14:16

update mavlink.js

7d9cdc9

TelemetryDashboard: allow for heartbeat send and signing

1fdab91

and add cli_test.js

tridge requested a review from IamPete1 August 10, 2025 08:50

tridge force-pushed the pr-SimpleGCS branch from cea8032 to d33bf66 Compare August 10, 2025 08:53

tridge mentioned this pull request Aug 10, 2025

TelemetryDashboard: support HEARTBEAT send and signing #265

Open

rmackay9 requested a review from Copilot August 11, 2025 01:12

Copilot AI reviewed Aug 11, 2025

View reviewed changes

tridge force-pushed the pr-SimpleGCS branch from d33bf66 to 8eac51f Compare August 11, 2025 10:20

tridge added 4 commits August 12, 2025 20:08

modules: moved MAVLink to modules directory

90dfb75

and added mavftp

TelemetryDashboard: removed old mavlink module

e5fa2c3

TelemetryDashboard: update to use modules/MAVLink

503e674

SimpleGCS: a simple GCS for autonomous buoys

b78fe3a

tridge force-pushed the pr-SimpleGCS branch from 8eac51f to b78fe3a Compare August 12, 2025 10:10

IamPete1 reviewed Aug 12, 2025

View reviewed changes

TelemetryDashboard/cli_test.js

@@ -0,0 +1,113 @@

//!/usr/bin/env node

Copy link

Member

IamPete1 Aug 12, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would this be better in the new SimpleGSC directory?

IamPete1 mentioned this pull request Aug 12, 2025

Add a new WebTool: AI Chat WebTool #264

Open

		params[0] \|\| 0, params[1] \|\| 0, params[2] \|\| 0, params[3] \|\| 0,
		params[4] \|\| 0, params[5] \|\| 0, params[6] \|\| 0

		url_input.value = localStorage.getItem(LS_KEYS.url) \|\| "ws://127.0.0.1:56781";
		passphrase_input.value = localStorage.getItem(LS_KEYS.pass) \|\| "";

                   }
                 }
-              }

                
                    No newline at end of file
+              }

Conversation

tridge commented Aug 10, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

rmackay9 commented Aug 11, 2025

Uh oh!

IamPete1 left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

davidbuzz commented Oct 21, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

tridge commented Aug 10, 2025 •

edited

Loading