the game
feat: responsiveness
+66
-8
+66
-8
src/main.ts
+66
-8
src/main.ts
···
38
38
k.setGravity(1600);
39
39
40
40
// Create ground
41
-
const ground = k.add([
41
+
let ground = k.add([
42
42
k.rect(k.width(), 48),
43
43
k.pos(0, k.height() - 48),
44
44
k.outline(4),
···
49
49
50
50
// Create walls around the edge of the map
51
51
// Left wall
52
-
const leftWall = k.add([
52
+
let leftWall = k.add([
53
53
k.rect(20, k.height()),
54
54
k.pos(-20, 0),
55
55
k.outline(4),
···
60
60
]);
61
61
62
62
// Right wall
63
-
const rightWall = k.add([
63
+
let rightWall = k.add([
64
64
k.rect(20, k.height()),
65
65
k.pos(k.width(), 0),
66
66
k.outline(4),
···
71
71
]);
72
72
73
73
// Top wall
74
-
const topWall = k.add([
74
+
let topWall = k.add([
75
75
k.rect(k.width(), 20),
76
76
k.pos(0, -20),
77
77
k.outline(4),
···
80
80
k.color(127, 200, 255),
81
81
k.opacity(0.5),
82
82
]);
83
+
84
+
// Handle window resize
85
+
k.onResize(() => {
86
+
// Update ground
87
+
if (ground.exists()) {
88
+
ground.width = k.width();
89
+
ground.pos.y = k.height() - 48;
90
+
}
91
+
92
+
// Update left wall
93
+
if (leftWall.exists()) {
94
+
leftWall.height = k.height();
95
+
}
96
+
97
+
// Update right wall
98
+
if (rightWall.exists()) {
99
+
rightWall.height = k.height();
100
+
rightWall.pos.x = k.width();
101
+
}
102
+
103
+
// Update top wall
104
+
if (topWall.exists()) {
105
+
topWall.width = k.width();
106
+
}
107
+
});
83
108
84
109
// Create player object with components
85
110
const playerObj = k.add([
···
337
362
// Game over scene
338
363
k.scene("gameOver", (score: number) => {
339
364
// Background
340
-
k.add([k.rect(k.width(), k.height()), k.color(0, 0, 0), k.opacity(0.7)]);
365
+
let background = k.add([k.rect(k.width(), k.height()), k.color(0, 0, 0), k.opacity(0.7)]);
341
366
342
367
// Game over text
343
-
k.add([
368
+
let gameOverText = k.add([
344
369
k.text("GAME OVER", { size: 64 }),
345
370
k.pos(k.width() / 2, k.height() / 3),
346
371
k.anchor("center"),
···
348
373
]);
349
374
350
375
// Score display
351
-
k.add([
376
+
let scoreDisplay = k.add([
352
377
k.text(`Final Score: ${score}`, { size: 36 }),
353
378
k.pos(k.width() / 2, k.height() / 2),
354
379
k.anchor("center"),
···
366
391
]);
367
392
368
393
// Restart text
369
-
k.add([
394
+
let restartText = k.add([
370
395
k.text("RESTART", { size: 24 }),
371
396
k.pos(k.width() / 2, (k.height() * 2) / 3),
372
397
k.anchor("center"),
373
398
k.color(255, 255, 255),
374
399
]);
400
+
401
+
// Handle window resize
402
+
k.onResize(() => {
403
+
// Update background
404
+
if (background.exists()) {
405
+
background.width = k.width();
406
+
background.height = k.height();
407
+
}
408
+
409
+
// Update game over text position
410
+
if (gameOverText.exists()) {
411
+
gameOverText.pos.x = k.width() / 2;
412
+
gameOverText.pos.y = k.height() / 3;
413
+
}
414
+
415
+
// Update score display position
416
+
if (scoreDisplay.exists()) {
417
+
scoreDisplay.pos.x = k.width() / 2;
418
+
scoreDisplay.pos.y = k.height() / 2;
419
+
}
420
+
421
+
// Update restart button position
422
+
if (restartBtn.exists()) {
423
+
restartBtn.pos.x = k.width() / 2;
424
+
restartBtn.pos.y = (k.height() * 2) / 3;
425
+
}
426
+
427
+
// Update restart text position
428
+
if (restartText.exists()) {
429
+
restartText.pos.x = k.width() / 2;
430
+
restartText.pos.y = (k.height() * 2) / 3;
431
+
}
432
+
});
375
433
376
434
// Restart on button click
377
435
restartBtn.onClick(() => {