about summary refs log tree commit diff stats
path: root/html/space
diff options
context:
space:
mode:
authorelioat <elioat@tilde.institute>2025-04-09 21:19:42 -0400
committerelioat <elioat@tilde.institute>2025-04-09 21:19:42 -0400
commita375a8bb1084bef90967734c6ec0233fca306145 (patch)
tree45f7c7d9f1ac08ccc8d5dfb43b4e6e80b4fe8ac5 /html/space
parent05f375a45e288a5d70323a536b72bfc0a978e38c (diff)
downloadtour-a375a8bb1084bef90967734c6ec0233fca306145.tar.gz
*
Diffstat (limited to 'html/space')
-rw-r--r--html/space/renderer.js68
1 files changed, 57 insertions, 11 deletions
diff --git a/html/space/renderer.js b/html/space/renderer.js
index 475304f..6af271d 100644
--- a/html/space/renderer.js
+++ b/html/space/renderer.js
@@ -19,6 +19,8 @@ const RADAR_RADIUS = 100;
 const RADAR_CENTER_X = 100;
 const RADAR_CENTER_Y = 100;
 const RADAR_SCALE = 0.1; // Scale factor for radar display
+const TARGET_LOCK_COLOR = '#ff0000';
+const TARGET_LOCK_THRESHOLD = 20; // Pixels from center to consider locked
 
 // Initialize the renderer
 export function initRenderer() {
@@ -80,13 +82,37 @@ function projectPoint(point, player) {
     };
 }
 
+// Check if any enemy ship is in targeting range
+function getTargetLock(player, gameState) {
+    const centerX = width / 2;
+    const centerY = height / 2;
+    
+    for (const ship of gameState.enemyShips) {
+        const projected = projectPoint(ship.position, player);
+        if (projected) {
+            const distance = Math.sqrt(
+                Math.pow(projected.x - centerX, 2) +
+                Math.pow(projected.y - centerY, 2)
+            );
+            
+            if (distance < TARGET_LOCK_THRESHOLD) {
+                return {
+                    ship,
+                    distance
+                };
+            }
+        }
+    }
+    return null;
+}
+
 // Draw radar/minimap
-function drawRadar(player, gameState) {
+function drawRadar(player, gameState, targetLock) {
     // Save context
     ctx.save();
     
     // Set radar style
-    ctx.strokeStyle = HUD_COLOR;
+    ctx.strokeStyle = targetLock ? TARGET_LOCK_COLOR : HUD_COLOR;
     ctx.fillStyle = 'rgba(0, 0, 0, 0.5)';
     ctx.lineWidth = 1;
     
@@ -137,7 +163,7 @@ function drawRadar(player, gameState) {
             ctx.arc(
                 RADAR_CENTER_X + dx,
                 RADAR_CENTER_Y + dy,
-                3,
+                4,
                 0,
                 Math.PI * 2
             );
@@ -150,9 +176,9 @@ function drawRadar(player, gameState) {
 }
 
 // Draw speed and direction indicators
-function drawSpeedIndicator(player) {
+function drawSpeedIndicator(player, targetLock) {
     ctx.save();
-    ctx.fillStyle = HUD_COLOR;
+    ctx.fillStyle = targetLock ? TARGET_LOCK_COLOR : HUD_COLOR;
     ctx.font = '14px monospace';
     
     // Calculate speed
@@ -173,9 +199,14 @@ function drawSpeedIndicator(player) {
 }
 
 // Draw enhanced targeting reticle
-function drawTargetingReticle() {
+function drawTargetingReticle(player, gameState) {
     ctx.save();
-    ctx.strokeStyle = HUD_COLOR;
+    
+    // Check for target lock
+    const targetLock = getTargetLock(player, gameState);
+    const currentColor = targetLock ? TARGET_LOCK_COLOR : HUD_COLOR;
+    
+    ctx.strokeStyle = currentColor;
     ctx.lineWidth = 1;
     
     // Outer circle
@@ -207,6 +238,20 @@ function drawTargetingReticle() {
     ctx.lineTo(width/2 + 20, height/2 + 20);
     ctx.stroke();
     
+    // Draw target lock indicator if locked
+    if (targetLock) {
+        // Draw pulsing circle around target
+        const pulseSize = 30 + Math.sin(Date.now() * 0.01) * 5;
+        ctx.beginPath();
+        ctx.arc(width/2, height/2, pulseSize, 0, Math.PI * 2);
+        ctx.stroke();
+        
+        // Draw target distance
+        ctx.fillStyle = currentColor;
+        ctx.font = '14px monospace';
+        ctx.fillText(`Target Lock: ${targetLock.distance.toFixed(1)}`, width/2 - 50, height/2 + 50);
+    }
+    
     ctx.restore();
 }
 
@@ -214,6 +259,7 @@ function drawTargetingReticle() {
 export function render() {
     const player = getPlayerState();
     const gameState = getGameState();
+    const targetLock = getTargetLock(player, gameState);
 
     // Clear canvas
     ctx.fillStyle = 'black';
@@ -272,7 +318,7 @@ export function render() {
     gameState.enemyShips.forEach(ship => {
         const projected = projectPoint(ship.position, player);
         if (projected) {
-            const size = 10 * projected.scale;
+            const size = 20 * projected.scale;
             ctx.fillStyle = '#ff0000';
             ctx.beginPath();
             ctx.moveTo(projected.x, projected.y - size);
@@ -296,7 +342,7 @@ export function render() {
     });
 
     // Draw HUD elements
-    drawRadar(player, gameState);
-    drawSpeedIndicator(player);
-    drawTargetingReticle();
+    drawRadar(player, gameState, targetLock);
+    drawSpeedIndicator(player, targetLock);
+    drawTargetingReticle(player, gameState);
 } 
\ No newline at end of file