6 files changed, 46 insertions(+), 7 deletions(-)

M client/play.html
M client/src/gateway.ts
M client/src/index.ts
M client/static/play.css
A client/static/root.css
M server/src/main.rs

@@ 10,5 10,11 @@
     <script type="module" src="/src/index.ts"></script>
 
     <canvas id="canvas" class="renderbox"></canvas>
+
+    <div class="infobox">
+      <p id="pos">Position: NaN, NaN</p>
+      <p id="vel">Velocity: NaN</p>
+      <p is="pos-moon">Relative to Moon: NaN, NaN</p>
+    </div>
   </body>
 </html>

@@ 130,6 130,13 @@ export async function gateway_connect(gateway_url: string, username: string): Ga
 
                 for (let i = 0; i < pkt.players.length; i++) {
                     if (pkt.players[i].username == client.username) {
+                        if (global.me !== null) {
+                            let x_vel = (global.me.x - pkt.players[i].x) / (1 / 20);
+                            let y_vel = (global.me.y - pkt.players[i].y) / (1 / 20);
+                            let total_vel = Math.sqrt(x_vel * x_vel + y_vel * y_vel);
+                            global.velocity = total_vel;
+                        }
+
                         global.me = pkt.players[i];
                     }
                 }

@@ 1,6 1,3 @@
-import * as PIXI from "pixi.js";
-import {Sprite} from "pixi.js";
-
 import {Logger, logSetup} from "./logger";
 import {gateway_connect, GatewayClient} from "./gateway";
 import {Player} from "./protocol/player";


@@ 20,7 17,8 @@ export interface GlobalData {
     spritesheet_img: HTMLImageElement | null,
     spritesheet: object | null,
     context: CanvasRenderingContext2D,
-    keys: Keys
+    keys: Keys,
+    velocity: number
 }
 
 export interface Keys {


@@ 44,7 42,8 @@ export const global: GlobalData = {
         down: false,
         left: false,
         right: false
-    }
+    },
+    velocity: 0
 }
 
 async function client_main(server: string, username: string, texture_quality: string) {


@@ 146,6 145,11 @@ async function client_main(server: string, username: string, texture_quality: st
         // only translation will be to center our core module.
         global.context.translate(viewer_size_x / 2, viewer_size_y / 2);
 
+        if (global.me !== null) {
+            document.getElementById("pos").innerText = `Position: ${Math.trunc(global.me.x)}, ${Math.trunc(global.me.y)}`;
+        }
+        document.getElementById("vel").innerText = `Velocity: ${Math.trunc(global.velocity)}`;
+
         for (let i = 0; i < global.planets.length; i++) {
             let planet = global.planets[i];
             // @ts-ignore


@@ 159,6 163,8 @@ async function client_main(server: string, username: string, texture_quality: st
                 (planet.y - planet.radius - global.me?.y!), // dy
                 planet.radius * 2, // dw
                 planet.radius * 2); // dh
+
+            // todo: moon
         }
 
         for (let i = 0; i < global.players.length; i++) {


@@ 224,4 230,4 @@ function planet_type_to_tex_id(ty: PlanetType): string {
         return "earth.png"
     }
     return "unknown.png"
-}
+}<
\ No newline at end of file

@@ 1,3 1,5 @@
+@import "root.css";
+
 .renderbox {
     position: absolute;
     top: 0;


@@ 7,4 9,13 @@
 body {
     margin: 0;
     padding: 0;
+}
+
+.infobox {
+    position: absolute;
+    bottom: 0;
+    left: calc(50vw - 25%);
+    width: 50%;
+    background-color: var(--ui-bg-color);
+    padding: var(--ui-padding);
 }=
\ No newline at end of file

@@ 0,0 1,4 @@
+:root {
+    --ui-bg-color: gray;
+    --ui-padding: 5px;
+}<
\ No newline at end of file

@@ 83,7 83,12 @@ async fn _handle_request(mut conn: TcpStream, remote_addr: SocketAddr, mgr: Clie
     info!("[{}] passing to client handler", remote_addr);
 
     //forward the stream to the sink to achieve echo
-    handle_client(mgr.clone(), physics_data.clone(), remote_addr, rx, ws_write, ws_read).await?;
+    match handle_client(mgr.clone(), physics_data.clone(), remote_addr, rx, ws_write, ws_read).await {
+        Ok(_) => (),
+        Err(e) => {
+            error!("error in client thread: {}", e);
+        }
+    }
 
     // clean up values left over
     {