engine.scope(({ start, cls, spr, btn, mset, mget, map, fget, camera, creset, text }) => { const sprites = { grass: [ [ 3, 3, 11, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 11, 3, 3, 3, 11, 3, 3, 3, 3, 3, 11, 3, 3, 3, 11, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 11, 3, 11, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 11, 3, 3, 3, 3, 3, 11, 3, 3, 3, 3, 11, ], [false, true, false, false, false, false, false, false], ], path: [ [ 4, 4, 4, 4, 4, 4, 4, 4, 4, 15, 4, 4, 4, 4, 15, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 15, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 15, 4, 4, 4, 15, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, 4, ], [false, false, false, false, false, false, false, false], ], tree: [ [ -1, 3, 11, 3, 3, 11, 3, -1, 3, 11, 3, 11, 11, 3, 11, 3, 3, 3, 11, 3, 3, 11, 3, 3, -1, 3, 3, 11, 11, 3, 3, -1, -1, -1, -1, 4, 4, -1, -1, -1, -1, -1, -1, 4, 4, -1, -1, -1, -1, -1, -1, 4, 4, -1, -1, -1, -1, -1, -1, 4, 4, -1, -1, -1, ], [true, false, false, false, false, false, false, false], ], wall: [ [ 5, 5, 5, 6, 5, 5, 5, 6, 5, 5, 5, 6, 5, 5, 5, 6, 6, 6, 6, 6, 6, 6, 6, 6, 5, 6, 5, 5, 5, 6, 5, 5, 5, 6, 5, 5, 5, 6, 5, 5, 6, 6, 6, 6, 6, 6, 6, 6, 5, 5, 5, 6, 5, 5, 5, 6, 5, 5, 5, 6, 5, 5, 5, 6, ], [true, false, false, false, false, false, false, false], ], playerDown: [ [ -1, -1, 8, 8, 8, 8, -1, -1, -1, 8, 8, 8, 8, 8, 8, -1, -1, 15, 15, 15, 15, 15, 15, -1, -1, 15, 1, 15, 15, 1, 15, -1, -1, -1, 1, 1, 1, 1, -1, -1, -1, 1, 1, 1, 1, 1, 1, -1, -1, -1, 1, -1, -1, 1, -1, -1, -1, -1, 4, -1, -1, 4, -1, -1, ], [false, false, false, false, false, false, false, false], ], playerUp: [ [ -1, -1, 8, 8, 8, 8, -1, -1, -1, 8, 8, 8, 8, 8, 8, -1, -1, 8, 8, 8, 8, 8, 8, -1, -1, 8, 8, 8, 8, 8, 8, -1, -1, -1, 1, 1, 1, 1, -1, -1, -1, 1, 1, 1, 1, 1, 1, -1, -1, -1, 1, -1, -1, 1, -1, -1, -1, -1, 4, -1, -1, 4, -1, -1, ], [false, false, false, false, false, false, false, false], ], playerLeft: [ [ -1, -1, 8, 8, 8, -1, -1, -1, -1, 8, 8, 8, 8, 8, -1, -1, -1, 15, 15, 15, 15, -1, -1, -1, 1, 15, 15, 15, -1, -1, -1, -1, -1, -1, 1, 1, 1, -1, -1, -1, -1, 1, 1, 1, 1, -1, -1, -1, -1, -1, 1, -1, 1, -1, -1, -1, -1, -1, 4, -1, 4, -1, -1, -1, ], [false, false, false, false, false, false, false, false], ], playerRight: [ [ -1, -1, -1, 8, 8, 8, -1, -1, -1, -1, 8, 8, 8, 8, 8, -1, -1, -1, -1, 15, 15, 15, 15, -1, -1, -1, -1, -1, 15, 15, 15, 1, -1, -1, -1, 1, 1, 1, -1, -1, -1, -1, 1, 1, 1, 1, -1, -1, -1, -1, 1, -1, 1, -1, -1, -1, -1, -1, 4, -1, 4, -1, -1, -1, ], [false, false, false, false, false, false, false, false], ], }; const MAP_W = 24, MAP_H = 24; const CANVAS = 128; let tileX = 11, tileY = 12; let px, py; let camX = 0, camY = 0; let moving = false; let facing = 'down'; let lastAxis = 'h'; const speed = 2; const facingSprite = { down: 'playerDown', up: 'playerUp', left: 'playerLeft', right: 'playerRight', }; function buildWorld() { for (let y = 0; y < MAP_H; y++) { for (let x = 0; x < MAP_W; x++) { mset(x, y, 'grass'); } } for (let x = 0; x < MAP_W; x++) { mset(x, 0, 'tree'); mset(x, MAP_H - 1, 'tree'); } for (let y = 0; y < MAP_H; y++) { mset(0, y, 'tree'); mset(MAP_W - 1, y, 'tree'); } for (let y = 8; y <= 15; y++) { for (let x = 8; x <= 15; x++) { mset(x, y, 'path'); } } for (let y = 9; y <= 10; y++) { for (let x = 9; x <= 11; x++) { mset(x, y, 'wall'); } } for (let y = 9; y <= 10; y++) { for (let x = 13; x <= 15; x++) { mset(x, y, 'wall'); } } for (let y = 13; y <= 14; y++) { for (let x = 10; x <= 13; x++) { mset(x, y, 'wall'); } } for (let y = 1; y <= 7; y++) { mset(11, y, 'path'); mset(12, y, 'path'); } for (let y = 16; y <= 22; y++) { mset(11, y, 'path'); mset(12, y, 'path'); } for (let x = 1; x <= 7; x++) { mset(x, 11, 'path'); mset(x, 12, 'path'); } for (let x = 16; x <= 22; x++) { mset(x, 11, 'path'); mset(x, 12, 'path'); } mset(3, 3, 'tree'); mset(5, 5, 'tree'); mset(7, 3, 'tree'); mset(4, 6, 'tree'); mset(18, 3, 'tree'); mset(20, 5, 'tree'); mset(17, 6, 'tree'); mset(21, 2, 'tree'); mset(3, 18, 'tree'); mset(6, 20, 'tree'); mset(4, 21, 'tree'); mset(19, 18, 'tree'); mset(21, 20, 'tree'); mset(17, 21, 'tree'); } function isSolid(x, y) { const tile = mget(x, y); return tile && fget(tile, 0); } function init() { buildWorld(); px = tileX * 8; py = tileY * 8; } function update() { let dx = 0, dy = 0; if (btn('ArrowLeft') || btn('a')) dx = -1; else if (btn('ArrowRight') || btn('d')) dx = 1; if (btn('ArrowUp') || btn('w')) dy = -1; else if (btn('ArrowDown') || btn('s')) dy = 1; if (dx !== 0 && dy === 0) lastAxis = 'h'; if (dy !== 0 && dx === 0) lastAxis = 'v'; if (dx !== 0 && dy !== 0) { if (lastAxis === 'h') dx = 0; else dy = 0; } if (dx === -1) facing = 'left'; else if (dx === 1) facing = 'right'; else if (dy === -1) facing = 'up'; else if (dy === 1) facing = 'down'; if (!moving && (dx !== 0 || dy !== 0)) { const nx = tileX + dx; const ny = tileY + dy; if (!isSolid(nx, ny)) { tileX = nx; tileY = ny; moving = true; } } if (moving) { const tx = tileX * 8; const ty = tileY * 8; if (px < tx) px = Math.min(px + speed, tx); else if (px > tx) px = Math.max(px - speed, tx); if (py < ty) py = Math.min(py + speed, ty); else if (py > ty) py = Math.max(py - speed, ty); if (px === tx && py === ty) moving = false; } camX = Math.max(0, Math.min(MAP_W * 8 - CANVAS, px - 60)); camY = Math.max(0, Math.min(MAP_H * 8 - CANVAS, py - 60)); } function draw() { cls(0); camera(camX, camY); const cx = Math.floor(camX / 8); const cy = Math.floor(camY / 8); map(0, cx, cy, 17, 17, cx * 8, cy * 8); spr(facingSprite[facing], px, py); } start({ sprites, sounds: {}, init, update, draw, target }); });

Editing: JRPG: Walking

Recent Edits

Plugins