diff --git a/client/index.js b/client/index.js index 467a256..a3d8ac3 100644 --- a/client/index.js +++ b/client/index.js @@ -5,6 +5,7 @@ import {Container, Renderer} from '@avocado/graphics'; import {World} from '@avocado/physics/matter/world'; import {StateSynchronizer} from '@avocado/state'; +const renderer = new Renderer([640, 360]); const stage = new Container(); const entityList = new EntityList(); @@ -53,7 +54,6 @@ let actionState = actionRegistry.state(); // Create the socket connection. const socket = createClient(window.location.href); // Create the graphics canvas. -const renderer = new Renderer([1280, 720]); const appNode = document.querySelector('.app'); appNode.appendChild(renderer.element); // Input messages. diff --git a/resource/flower-barrel.png b/resource/flower-barrel.png index 8fbf28c..f7a5152 100644 Binary files a/resource/flower-barrel.png and b/resource/flower-barrel.png differ diff --git a/resource/idle.animation.json b/resource/idle.animation.json index de41451..d105ae9 100644 --- a/resource/idle.animation.json +++ b/resource/idle.animation.json @@ -1,7 +1,7 @@ { "frameRate": 0.1, "frameCount": 8, - "frameSize": [128, 128], + "frameSize": [32, 32], "directionCount": 4, "imageUri": "/idle.png" } diff --git a/resource/idle.png b/resource/idle.png index 7a5b159..34d2c79 100644 Binary files a/resource/idle.png and b/resource/idle.png differ diff --git a/resource/moving.animation.json b/resource/moving.animation.json index a2e3bd8..55cd172 100644 --- a/resource/moving.animation.json +++ b/resource/moving.animation.json @@ -1,7 +1,7 @@ { "frameRate": 0.1, "frameCount": 8, - "frameSize": [128, 128], + "frameSize": [32, 32], "directionCount": 4, "imageUri": "/moving.png" } diff --git a/resource/moving.png b/resource/moving.png index 6931b71..00c6d6c 100644 Binary files a/resource/moving.png and b/resource/moving.png differ diff --git a/resource/tileset.png b/resource/tileset.png new file mode 100644 index 0000000..df4090e Binary files /dev/null and b/resource/tileset.png differ diff --git a/server/game.js b/server/game.js index 9f02054..8e08ced 100644 --- a/server/game.js +++ b/server/game.js @@ -23,8 +23,8 @@ const stateSynchronizer = new StateSynchronizer({ entityList, }); for (let i = 0; i < 40; ++i) { - const x = Math.floor(Math.random() * 800) + 200; - const y = Math.floor(Math.random() * 300) + 200; + const x = Math.floor(Math.random() * 200) + 50; + const y = Math.floor(Math.random() * 75) + 50; const flowerBarrel = createFlowerBarrelEntity([x, y]); entityList.addEntity(flowerBarrel); } @@ -66,11 +66,11 @@ function createEntityForConnection(socket) { params: { animations: { idle: { - offset: [0, -48], + offset: [0, -12], uri: '/idle.animation.json', }, moving: { - offset: [0, -48], + offset: [0, -12], uri: '/moving.animation.json', }, } @@ -87,7 +87,7 @@ function createEntityForConnection(socket) { informed: {}, mobile: { state: { - speed: 400, + speed: 100, }, }, physical: { @@ -95,7 +95,7 @@ function createEntityForConnection(socket) { shape: { type: 'rectangle', position: [0, 0], - size: [32, 32], + size: [8, 8], } } }, @@ -128,8 +128,8 @@ function createFlowerBarrelEntity(position) { params: { images: { initial: { - offset: [0, -32], - size: [128, 128], // Derive? + offset: [0, -8], + size: [32, 32], // Derive? uri: '/flower-barrel.png', }, } @@ -142,7 +142,7 @@ function createFlowerBarrelEntity(position) { shape: { type: 'rectangle', position: [0, 0], - size: [80, 40], + size: [20, 10], } } }, @@ -169,7 +169,7 @@ function createMainLoop(avocadoServer) { } // All informed entities get their own slice. for (const entity of informables) { - const CAMERA_LOCATION = [640, 360]; + const CAMERA_LOCATION = [320, 180]; const reduced = entity.reduceStateDiff(diff, CAMERA_LOCATION); entity.inform(reduced); } diff --git a/traits/informed.js b/traits/informed.js index 51961b3..f96e3e1 100644 --- a/traits/informed.js +++ b/traits/informed.js @@ -11,7 +11,7 @@ class InformedBase extends Trait { static defaultState() { return { - informSize: [1280, 720], + informSize: [640, 360], }; }