From 588a293a8a7006de4c64f24af59766b80f49dce4 Mon Sep 17 00:00:00 2001
From: bye <bye@byecorps.com>
Date: Thu, 29 Aug 2024 20:53:41 +0100
Subject: [PATCH] i cant get this fucking camera working

---
 src/js/main.js                | 26 +++++++++--------
 src/js/objects/ground.js      | 27 ++++++++++++++++++
 src/js/rooms/debug_sprites.js | 10 +++++--
 src/js/rooms/game.js          | 54 +++++++++++++++++++----------------
 4 files changed, 77 insertions(+), 40 deletions(-)
 create mode 100644 src/js/objects/ground.js

diff --git a/src/js/main.js b/src/js/main.js
index c667064..6a16d54 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -4,6 +4,12 @@ import Engine from "../../hampsterengine/src/engine.js";
 import Keyboard from "../../hampsterengine/src/keyboard";
 import {FontRenderer, Stars} from "./objects";
 
+// Init the engine and canvas
+const canvas = new Canvas(c);
+const engine = new Engine(canvas);
+const assets = engine.assetStore;
+const keyboard = new Keyboard();
+
 import SoundBox from "./sb-player-small";
 // import {mus_DEMOSONG} from "./songs/DEMOSONGDONOTCOMMIT";
 
@@ -31,11 +37,6 @@ import {rm_DEBUG_sprites} from "./rooms/debug_sprites";
 const query = new URLSearchParams(window.location.search);
 window.query = query;
 
-// Init the engine and canvas
-const canvas = new Canvas(c);
-const engine = new Engine(canvas);
-const assets = engine.assetStore;
-const keyboard = new Keyboard();
 assets.addImage('font', font);
 
 const fontRenderer = new FontRenderer(assets.get`font`);
@@ -81,8 +82,9 @@ engine.running = false; // Game uses this as a pause state actually
 // }
 // tempCanvasStars.toBlob(createStarsObjectURL);
 
-assets.addMiniSprite('grass', 'IIIIIIQIQQQJZQZZRZRRZRZRSSRSRZZR');
-assets.renderMiniSprite('grass', ['#2a6', '#964', '#853']);
+const GROUND_PALETTE = ['#2a6', '#964', '#853']
+assets.addMiniSprite('grass', 'IIIIIIQIQQQJZQZZRZRRZRZRSSRSRZZR', 8, GROUND_PALETTE);
+assets.addMiniSprite('dirt', 'SSRRRZ[ZZZRRZRZZRZRRZRZRSSRSRZZR', 8, GROUND_PALETTE);
 
 engine.registerRoom(rm_mainMenu, 'mainMenu');
 engine.registerRoom(rm_game, 'game');
@@ -132,8 +134,7 @@ function main() {
     } catch (e) {
         engine.running = false;
 
-        canvas.pixelRatio = 2;
-        canvas.ctx.setTransform(canvas.pixelRatio, 0, 0, canvas.pixelRatio, 0, 0);
+        canvas.setScale(1);
         canvas.fill('#a05555d0');
 
         const logo = assets.get`splash`
@@ -162,12 +163,10 @@ function physicsTick() {
 
 console.debug(engine.rooms);
 
+let roomToLoad = (query.get`room` ? engine.getRoomIndex(query.get`room`) : engine.getRoomIndex`mainMenu`);
 if (query.get`room`) {
     console.log('Requesting room', query.get`room`);
     engine.loadDelay = 0;
-    engine.room = engine.getRoomIndex(query.get`room`);
-} else {
-    engine.room = engine.getRoomIndex`mainMenu`;
 }
 
 // Ensure assets are loaded.
@@ -176,6 +175,9 @@ function load() {
         engine.loadLoop();
         setTimeout(load, 1000/60);
     } else {
+        engine.initRooms();
+        console.log("Initialised rooms");
+        engine.room = roomToLoad;
         readyTime = performance.now();
         engine.lastPhysicsFrame = performance.now();
         main();
diff --git a/src/js/objects/ground.js b/src/js/objects/ground.js
new file mode 100644
index 0000000..a73e0d9
--- /dev/null
+++ b/src/js/objects/ground.js
@@ -0,0 +1,27 @@
+import {Entity} from "../../../hampsterengine/src/things";
+import {round, roundToRatio} from "../extras";
+
+export default class Ground extends Entity {
+    constructor(scale = 1) {
+        super();
+
+        this.width = canvas.width;
+        this.height = 16 * scale;
+
+        this.x = 0;
+        this.y = canvas.height - this.height;
+
+        this.scale = scale;
+
+        this.surface = engine.assetStore.get`grass`.sprite;
+        this.below = engine.assetStore.get`dirt`.sprite;
+    }
+
+    draw() {
+        if (!(this.surface || this.below)) return;
+        canvas.tileImage(this.surface, roundToRatio(this.x), roundToRatio(this.y), this.width, 8*this.scale, 8*this.scale, 8*this.scale);
+        canvas.tileImage(this.below, roundToRatio(this.x), roundToRatio(this.y+8*this.scale), this.width, this.height-8*this.scale, 8*this.scale, 8*this.scale);
+        canvas.fillRect(this.x, this.y, this.width, this.height);
+    }
+}
+
diff --git a/src/js/rooms/debug_sprites.js b/src/js/rooms/debug_sprites.js
index a59d14e..f5174f0 100644
--- a/src/js/rooms/debug_sprites.js
+++ b/src/js/rooms/debug_sprites.js
@@ -1,12 +1,16 @@
 
 import {Room} from "../../../hampsterengine/src/things";
+import Ground from "../objects/ground";
 
 export const rm_DEBUG_sprites = new Room();
+rm_DEBUG_sprites.init = function () {
+    const ground = new Ground();
+    rm_DEBUG_sprites.push(ground, 'ground');
+}
+
 rm_DEBUG_sprites.start = _=> {
     canvas.setScale(3);
+    rm_DEBUG_sprites.init();
     canvas.ctx.imageSmoothingEnabled = false;
 }
 
-rm_DEBUG_sprites.draw = _=> {
-    canvas.tileImage(engine.assetStore.get('grass').sprite, 0, 0, canvas.width, 8, 8, 8);
-}
diff --git a/src/js/rooms/game.js b/src/js/rooms/game.js
index a1be296..3d8d328 100644
--- a/src/js/rooms/game.js
+++ b/src/js/rooms/game.js
@@ -2,12 +2,15 @@
 import {Entity, Room} from "../../../hampsterengine/src/things";
 import Player from "../objects/player";
 import {clone, clonePlayer, abs} from "../extras";
+import Ground from "../objects/ground";
 
 export const rm_game = new Room();
 const GRAVITY_X = 0; // I don't think we're going to use X gravity but i'm going to keep in the source in case i do
 const GRAVITY_Y = 300; // Per second
 const entities = rm_game.entities;
 
+rm_game.width = 1000;
+rm_game.height = 1000;
 
 rm_game.start = _=>{
     engine.running = true;
@@ -19,6 +22,7 @@ rm_game.stop = _=>{
 
 rm_game.step = _=>{
     const elapsed = 1 / 60;
+    const player = rm_game.get('plr');
 
     let friction = 0.9;
     const boost = keyboard.keys.includes("Shift") ? 40 : 0;
@@ -71,6 +75,12 @@ rm_game.step = _=>{
 
     if (abs(player.vy) < 1) player.vy = 0;
     if (abs(player.vx) < 1) player.vx = 0;
+
+    // Update the camera
+    canvas.camera.goTo(
+        Math.min(Math.max(player.x+canvas.width/8, canvas.width/8), rm_game.width-canvas.width),
+        Math.min(Math.max(player.y+canvas.width/8, canvas.width/8), rm_game.height-canvas.height)
+    );
 }
 
 rm_game.drawGui = _ => {
@@ -87,30 +97,24 @@ rm_game.drawGui = _ => {
     });
 
     // Draw the player's position
-    canvas.strokeRect(rm_game.x, rm_game.y, 10, 16);
+    // canvas.strokeRect(rm_game.x, rm_game.y, 10, 16);
+}
+
+rm_game.init = _=>{
+    let player = new Player();
+
+    player.x = 40;
+    player.y = 40;
+    player.width = 16;
+    player.height = 26;
+    window.player = player;
+    rm_game.push(player, 'plr');
+
+    let ground = new Ground(2);
+    ground.width = rm_game.width;
+    ground.y = rm_game.height - ground.height;
+
+    rm_game.push(ground);
+
 }
 
-let player = new Player();
-
-player.x = 40;
-player.y = 40;
-player.width = 10;
-player.height = 16;
-window.player = player;
-entities.push(player);
-
-let floor = new Entity();
-floor.x = 64;
-floor.y = 150;
-floor.width = 128;
-floor.height = 50;
-floor.draw = _=> { canvas.setStrokeColor('black'); canvas.strokeRect(floor.x, floor.y, floor.width, floor.height) }
-rm_game.entities.push(floor);
-
-let ceiling = new Entity();
-ceiling.x = 64;
-ceiling.y = 75;
-ceiling.width = 128;
-ceiling.height = 50;
-ceiling.draw = _=> { canvas.setStrokeColor('black'); canvas.strokeRect(ceiling.x, ceiling.y, ceiling.width, ceiling.height) }
-rm_game.entities.push(ceiling);
-- 
GitLab