summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--assets/image/hedge.pngbin1640 -> 17841 bytes
-rw-r--r--src/entities/lava.js9
-rw-r--r--src/entities/wordIs.js3
-rw-r--r--src/render/graphics.js13
-rw-r--r--src/render/sprites.js21
5 files changed, 36 insertions, 10 deletions
diff --git a/assets/image/hedge.png b/assets/image/hedge.png
index 505d494..3fc280d 100644
--- a/assets/image/hedge.png
+++ b/assets/image/hedge.png
Binary files differ
diff --git a/src/entities/lava.js b/src/entities/lava.js
index c0389bc..bd1ca04 100644
--- a/src/entities/lava.js
+++ b/src/entities/lava.js
@@ -4,12 +4,7 @@ game.createLava = () => {
lava.addComponent(game.components.LoadPriority({priority: 5}));
lava.addComponent(game.components.Appearance({rot: 0, width: 100, height: 100}));
lava.addComponent(game.components.Alive());
- lava.sprite = game.graphics.Sprite({
- image: game.assets.lava,
- spriteHeight: 24,
- spriteWidth: 24,
- numFrames: 3,
- timePerFrame: 100,
- });
+ lava.sprite = game.sprites.lava;
+
return lava;
}
diff --git a/src/entities/wordIs.js b/src/entities/wordIs.js
index a32bfa1..ca00856 100644
--- a/src/entities/wordIs.js
+++ b/src/entities/wordIs.js
@@ -2,7 +2,8 @@ game.createWordIs = () => {
const wordIs = game.Entity();
wordIs.addComponent(game.components.LoadPriority({priority: 3}));
wordIs.addComponent(game.components.Appearance({rot: 0, width: 100, height: 100}));
- wordIs.addComponent(game.components.Stop({stop: true}));
+ // wordIs.addComponent(game.components.Stop({stop: true}));
+ wordIs.addComponent(game.components.Pushable());
wordIs.addComponent(game.components.Alive());
wordIs.sprite = game.sprites.wordIs;
return wordIs;
diff --git a/src/render/graphics.js b/src/render/graphics.js
index 6a199f0..8a4cb1c 100644
--- a/src/render/graphics.js
+++ b/src/render/graphics.js
@@ -6,7 +6,7 @@ game.graphics = (
context.clearRect(0, 0, game.canvas.width, game.canvas.height);
};
- const Sprite = ({image, spriteX, spriteY, spriteWidth, spriteHeight, timePerFrame, cols, rows, numFrames, drawFunction}) => {
+ const Sprite = ({image, spriteX, spriteY, spriteWidth, spriteHeight, timePerFrame, cols, rows, numFrames, color, drawFunction}) => {
timePerFrame = timePerFrame ?? 100;
numFrames = numFrames ?? 1;
cols = cols ?? numFrames;
@@ -33,6 +33,15 @@ game.graphics = (
const row = currentFrame % rows;
const col = Math.floor(currentFrame / rows);
context.drawImage(image, spriteX+col*spriteWidth, spriteY+row*spriteHeight, spriteWidth, spriteHeight, x, y, width, height);
+
+ // apply color to sprite
+ if (color) {
+ context.globalAlpha=0.7;
+ context.globalCompositeOperation="source-atop";
+ context.fillStyle=color;
+ context.fillRect(x, y, width, height);
+ }
+
context.restore();
};
} else {
@@ -43,4 +52,4 @@ game.graphics = (
return { clear, Sprite };
}
-)(document.getElementById("game-canvas").getContext("2d")); \ No newline at end of file
+)(document.getElementById("game-canvas").getContext("2d"));
diff --git a/src/render/sprites.js b/src/render/sprites.js
index d8ae126..9626b00 100644
--- a/src/render/sprites.js
+++ b/src/render/sprites.js
@@ -12,6 +12,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#ede285",
}),
floor: game.graphics.Sprite({
image: game.assets.floor,
@@ -19,6 +20,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#404040",
}),
hedge: game.graphics.Sprite({
image: game.assets.hedge,
@@ -26,6 +28,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 250,
+ color: "#5c8339",
}),
grass: game.graphics.Sprite({
image: game.assets.grass,
@@ -33,6 +36,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#5c8339",
}),
lava: game.graphics.Sprite({
image: game.assets.lava,
@@ -40,6 +44,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#e49950",
}),
rock: game.graphics.Sprite({
image: game.assets.rock,
@@ -47,6 +52,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#90673e",
}),
wall: game.graphics.Sprite({
image: game.assets.wall,
@@ -54,6 +60,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#707070",
}),
water: game.graphics.Sprite({
image: game.assets.water,
@@ -61,6 +68,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#5f9dd1",
}),
wordBigBlue: game.graphics.Sprite({
image: game.assets.wordBigBlue,
@@ -68,6 +76,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#0f2439",
}),
wordFlag: game.graphics.Sprite({
image: game.assets.wordFlag,
@@ -75,6 +84,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#ede285",
}),
wordIs: game.graphics.Sprite({
image: game.assets.wordIs,
@@ -82,6 +92,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#ffffff",
}),
wordKill: game.graphics.Sprite({
image: game.assets.wordKill,
@@ -89,6 +100,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#e49950",
}),
wordLava: game.graphics.Sprite({
image: game.assets.wordLava,
@@ -96,6 +108,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#e49950",
}),
wordPush: game.graphics.Sprite({
image: game.assets.wordPush,
@@ -103,6 +116,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#90673e",
}),
wordRock: game.graphics.Sprite({
image: game.assets.wordRock,
@@ -110,6 +124,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#90673e",
}),
wordSink: game.graphics.Sprite({
image: game.assets.wordSink,
@@ -117,6 +132,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#5f9dd1",
}),
wordStop: game.graphics.Sprite({
image: game.assets.wordStop,
@@ -124,6 +140,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#252e0e",
}),
wordWall: game.graphics.Sprite({
image: game.assets.wordWall,
@@ -131,6 +148,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#707070",
}),
wordWater: game.graphics.Sprite({
image: game.assets.wordWater,
@@ -138,6 +156,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#5f9dd1",
}),
wordWin: game.graphics.Sprite({
image: game.assets.wordWin,
@@ -145,6 +164,7 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#ede285",
}),
wordYou: game.graphics.Sprite({
image: game.assets.wordYou,
@@ -152,5 +172,6 @@ game.sprites = {
spriteWidth: 24,
numFrames: 3,
timePerFrame: 100,
+ color: "#0f2439",
}),
};
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-09-21 18:48:00 +0000