diff --git a/public/client.js b/public/client.js index 74b6895..4c6008c 100644 --- a/public/client.js +++ b/public/client.js @@ -34,6 +34,7 @@ const teamMaterials = { range: new THREE.MeshToonMaterial({ color: 0x00ffff, transparent: true, opacity: opacity / 2 }), } +const minimapCameraZ = 10 const minimapCamera = new THREE.OrthographicCamera(-10, 10, 10, -10) const minimapRenderer = new THREE.WebGLRenderer() @@ -171,8 +172,21 @@ function connectWebSocket() { websocket.onmessage = (event) => { state.byteSize = new Blob([event.data]).size const stateUpdates = JSON.parse(event.data) + + if (stateUpdates.width != null && stateUpdates.height != null) { + state.width = stateUpdates.width + state.height = stateUpdates.height + + minimapCamera.top = state.height / 200 + minimapCamera.right = state.height / 200 + minimapCamera.bottom = -state.height / 200 + minimapCamera.left = -state.height / 200 + minimapCamera.updateProjectionMatrix() + minimapCamera.position.set(state.width / 200, state.height / 200, minimapCameraZ) + } + for (const [key, value] of Object.entries(stateUpdates)) { - if (!['abilities', 'terrains', 'entities', 'projectiles'].includes(key)) { + if (!['abilities', 'terrains', 'entities', 'projectiles', 'width', 'height'].includes(key)) { state[key] = value } } @@ -282,7 +296,7 @@ function connectWebSocket() { if (e.id == playerId) { const rangeMaterial = teamMaterials['range'] - const rangeSize = state.abilities.find((it) => it.id == e.abilities?.a)?.range ?? 0 + const rangeSize = (state.abilities.find((it) => it.id == e.abilities?.a)?.range ?? 0) + e.radius const rangeMarker = new THREE.Mesh(new THREE.CylinderGeometry((rangeSize) / 100, (rangeSize) / 100, 1), rangeMaterial) const rangeMarkerSize = 4000 rangeMarker.scale.y = e.height / rangeMarkerSize diff --git a/public/index.html b/public/index.html index bfc82f7..08c97ee 100644 --- a/public/index.html +++ b/public/index.html @@ -135,6 +135,7 @@ +

Connection:


diff --git a/src/game.js b/src/game.js
index 91ce3bf..bf3ac48 100644
--- a/src/game.js
+++ b/src/game.js
@@ -11,12 +11,12 @@ export default class Game {
   averageTick = 0
   currentTick = 0
   entities = []
-  height = 2000
+  height = 5000
   projectiles = []
   secondToSlowestTick = 0
   terrains = []
   tickRate = 30
-  width = 2000
+  width = 5000
 
   #currentTiming = 0
   #eventEmitter = new EventEmitter()