Compare commits
No commits in common. "74ce5a3af97307baf408de220d98ba8d6e27d4dd" and "683c19569f98bdb314176c4b92989beeb32defe9" have entirely different histories.
74ce5a3af9
...
683c19569f
@ -1,8 +1,3 @@
|
|||||||
@font-face {
|
|
||||||
font-family: 'Minecraft';
|
|
||||||
src: url('../res/fonts/Minecraft.ttf');
|
|
||||||
}
|
|
||||||
|
|
||||||
html, body {
|
html, body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
@ -52,7 +47,3 @@ div#menu > ul > li {
|
|||||||
padding-top: 10px;
|
padding-top: 10px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
div#board > canvas {
|
|
||||||
letter-spacing: 2px;
|
|
||||||
}
|
|
2
main.js
@ -31,7 +31,7 @@ function createWindow () {
|
|||||||
win.loadFile(path.join("html/game.html"));
|
win.loadFile(path.join("html/game.html"));
|
||||||
|
|
||||||
// Open the DevTools.
|
// Open the DevTools.
|
||||||
// win.webContents.openDevTools();
|
win.webContents.openDevTools();
|
||||||
}
|
}
|
||||||
|
|
||||||
// This method will be called when Electron has finished
|
// This method will be called when Electron has finished
|
||||||
|
Before Width: | Height: | Size: 5.3 KiB |
Before Width: | Height: | Size: 437 B |
Before Width: | Height: | Size: 372 B |
Before Width: | Height: | Size: 383 B |
Before Width: | Height: | Size: 304 B |
Before Width: | Height: | Size: 339 B |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 672 B |
@ -11,7 +11,7 @@ module.exports = {
|
|||||||
"Press Ctrl to sprint, but watch your stamina!",
|
"Press Ctrl to sprint, but watch your stamina!",
|
||||||
"Press space to interact with objects",
|
"Press space to interact with objects",
|
||||||
"If the arrow above an object is red, you cannot interact with it",
|
"If the arrow above an object is red, you cannot interact with it",
|
||||||
"You might be missing a key or have already interacted with it",
|
"You might be missing key or have already interacted with it",
|
||||||
"Press space to return"
|
"Press space to return"
|
||||||
],
|
],
|
||||||
gameOver: {
|
gameOver: {
|
||||||
|
@ -5,7 +5,7 @@ const { Texture, Sound, TileSprite, entity } = asdf;
|
|||||||
const texture = new Texture(__dirname + "/../../res/images/tilemap.png");
|
const texture = new Texture(__dirname + "/../../res/images/tilemap.png");
|
||||||
const sounds = {
|
const sounds = {
|
||||||
forbidden: new Sound(__dirname + "/../../res/sounds/forbidden.wav"),
|
forbidden: new Sound(__dirname + "/../../res/sounds/forbidden.wav"),
|
||||||
obtain: new Sound(__dirname + "/../../res/sounds/obtain.wav", { volume: 0.1 })
|
obtain: new Sound(__dirname + "/../../res/sounds/obtain.wav")
|
||||||
};
|
};
|
||||||
|
|
||||||
const Pointer = require("./pointer.js");
|
const Pointer = require("./pointer.js");
|
||||||
|
@ -5,7 +5,7 @@ const tilemap = new Texture("../res/images/tilemap.png");
|
|||||||
const tileSize = 32;
|
const tileSize = 32;
|
||||||
|
|
||||||
const text = require(__dirname + "/../../res/lang/default.js");
|
const text = require(__dirname + "/../../res/lang/default.js");
|
||||||
const fillStyle = {fill: "#ffffff", font: "24px Minecraft"};
|
const fillStyle = {fill: "#ffffff", font: "24px Arial"};
|
||||||
|
|
||||||
class Stats extends Container {
|
class Stats extends Container {
|
||||||
constructor(player) {
|
constructor(player) {
|
||||||
@ -20,14 +20,14 @@ class Stats extends Container {
|
|||||||
livesText.pos = {x: 10, y: 310};
|
livesText.pos = {x: 10, y: 310};
|
||||||
|
|
||||||
const livesCounter = new Text(player.lives, fillStyle);
|
const livesCounter = new Text(player.lives, fillStyle);
|
||||||
livesCounter.pos = {x: 100, y: 310};
|
livesCounter.pos = {x: 90, y: 310};
|
||||||
|
|
||||||
const heart = new TileSprite(tilemap, tileSize, tileSize);
|
const heart = new TileSprite(tilemap, tileSize, tileSize);
|
||||||
heart.frame = {x: tilemapFrames[42].x / tileSize, y: tilemapFrames[42].y / tileSize};
|
heart.frame = {x: tilemapFrames[42].x / tileSize, y: tilemapFrames[42].y / tileSize};
|
||||||
heart.pos = {x: 120, y: 284};
|
heart.pos = {x: 104, y: 284};
|
||||||
|
|
||||||
const staminaText = new Text(text.game.stamina + ":", fillStyle);
|
const staminaText = new Text("| " + text.game.stamina + ":", fillStyle);
|
||||||
staminaText.pos = {x: 160, y: 310};
|
staminaText.pos = {x: 140, y: 310};
|
||||||
|
|
||||||
this.children = [
|
this.children = [
|
||||||
background,
|
background,
|
||||||
@ -41,7 +41,7 @@ class Stats extends Container {
|
|||||||
Array(5).fill().forEach((_val, index) => {
|
Array(5).fill().forEach((_val, index) => {
|
||||||
const sprite = new TileSprite(tilemap, tileSize, tileSize);
|
const sprite = new TileSprite(tilemap, tileSize, tileSize);
|
||||||
sprite.frame = {x: tilemapFrames[44].x / tileSize, y: tilemapFrames[44].y / tileSize};
|
sprite.frame = {x: tilemapFrames[44].x / tileSize, y: tilemapFrames[44].y / tileSize};
|
||||||
sprite.pos = {x: index * 26 + 290, y: 286};
|
sprite.pos = {x: index * 26 + 270, y: 286};
|
||||||
this.children.push(sprite);
|
this.children.push(sprite);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
57
src/levels/1-1 copy.js
Normal file
@ -0,0 +1,57 @@
|
|||||||
|
const tileSize = 32;
|
||||||
|
|
||||||
|
var level = {
|
||||||
|
tiles: [
|
||||||
|
1, 2, 2, 2, 2, 6, 0, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 5, 6,
|
||||||
|
4, 21, 22, 23, 21, 7, 0, 4, 22, 23, 21, 22, 23, 21, 22, 23, 21, 22, 23, 21, 22, 23, 21, 22, 23, 21, 22, 23, 21, 7,
|
||||||
|
4, 17, 17, 17, 17, 7, 0, 4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 7, 0, 4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 8, 2, 3, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 0, 22, 22, 22, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 0, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 0, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 0, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 0, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 0, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 0, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
14, 15, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 10, 9
|
||||||
|
],
|
||||||
|
size: {
|
||||||
|
w: 960,
|
||||||
|
h: 480
|
||||||
|
},
|
||||||
|
startPos: [
|
||||||
|
{ x: 48, y: 64 },
|
||||||
|
{ x: 48, y: 128 }
|
||||||
|
],
|
||||||
|
entities: [
|
||||||
|
{
|
||||||
|
type: "Mage",
|
||||||
|
pos: { x: 12 * tileSize, y: 2 * tileSize }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "Mage",
|
||||||
|
pos: { x: 1 * tileSize, y: 8 * tileSize }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "Chest",
|
||||||
|
pos: { x: 4 * tileSize, y: 2 * tileSize },
|
||||||
|
action: (player) => {
|
||||||
|
player.items.keys.push("1-2_3");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "Portal",
|
||||||
|
pos: { x: 8 * tileSize, y: 2 * tileSize },
|
||||||
|
texture: "Ladder",
|
||||||
|
action: (_player, level) => {
|
||||||
|
level.switch = { module: __dirname + "/1-1.js", pos: 0 };
|
||||||
|
},
|
||||||
|
key: "1-2_3"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
module.exports = level;
|
57
src/levels/1-1.js
Normal file
@ -0,0 +1,57 @@
|
|||||||
|
const tileSize = 32;
|
||||||
|
|
||||||
|
var level = {
|
||||||
|
tiles: [
|
||||||
|
1, 2, 2, 2, 2, 6, 0, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 5, 6,
|
||||||
|
4, 21, 22, 23, 21, 7, 0, 4, 22, 23, 21, 22, 23, 21, 22, 23, 21, 22, 23, 21, 22, 23, 21, 22, 23, 21, 22, 23, 21, 7,
|
||||||
|
4, 17, 17, 17, 17, 7, 0, 4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 7, 0, 4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 8, 2, 3, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 22, 22, 22, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
4, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 17, 7,
|
||||||
|
14, 15, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 11, 10, 9
|
||||||
|
],
|
||||||
|
size: {
|
||||||
|
w: 960,
|
||||||
|
h: 480
|
||||||
|
},
|
||||||
|
startPos: [
|
||||||
|
{ x: 48, y: 64 },
|
||||||
|
{ x: 48, y: 128 }
|
||||||
|
],
|
||||||
|
entities: [
|
||||||
|
{
|
||||||
|
type: "Mage",
|
||||||
|
pos: { x: 12 * tileSize, y: 2 * tileSize }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "Mage",
|
||||||
|
pos: { x: 1 * tileSize, y: 8 * tileSize }
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "Chest",
|
||||||
|
pos: { x: 4 * tileSize, y: 2 * tileSize },
|
||||||
|
action: (player) => {
|
||||||
|
player.items.keys.push("1-1_1");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "Portal",
|
||||||
|
pos: { x: 8 * tileSize, y: 2 * tileSize },
|
||||||
|
texture: "Ladder",
|
||||||
|
action: (_player, level) => {
|
||||||
|
level.switch = { module: __dirname + "/1-1 copy.js", pos: 0 };
|
||||||
|
},
|
||||||
|
key: "1-1_1"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
module.exports = level;
|
@ -1,9 +1,9 @@
|
|||||||
const asdf = require("asdf-games");
|
const asdf = require("asdf-games");
|
||||||
// eslint-disable-next-line no-unused-vars
|
// eslint-disable-next-line no-unused-vars
|
||||||
const { Text, Container, Rect } = asdf;
|
const { Texture, Text, Container, Sprite } = asdf;
|
||||||
|
|
||||||
const text = require(__dirname + "/../../res/lang/default.js");
|
const text = require(__dirname + "/../../res/lang/default.js");
|
||||||
const fillStyle = {fill: "#ffffff", font: "24px Minecraft"};
|
const fillStyle = {fill: "#ffffff", font: "24px Arial"};
|
||||||
|
|
||||||
class GameOver extends Container {
|
class GameOver extends Container {
|
||||||
constructor(game, keys, onEnd) {
|
constructor(game, keys, onEnd) {
|
||||||
@ -14,14 +14,12 @@ class GameOver extends Container {
|
|||||||
|
|
||||||
this.children = [];
|
this.children = [];
|
||||||
|
|
||||||
this.add(new Rect(this.game.w, this.game.h, { fill: "#333333" }));
|
var gameover = new Text(text.gameOver.dead, {fill: "#ffffff", font: "32px Arial"});
|
||||||
|
gameover.pos = { x: 200, y: 200 };
|
||||||
var gameover = new Text(text.gameOver.dead, {fill: "#bb0a1e", font: "60px Minecraft"});
|
|
||||||
gameover.pos = { x: 188, y: 150 };
|
|
||||||
this.add(gameover);
|
this.add(gameover);
|
||||||
|
|
||||||
var instruction = new Text(text.gameOver.instruction, fillStyle);
|
var instruction = new Text(text.gameOver.instruction, fillStyle);
|
||||||
instruction.pos = { x: 125, y: 216 };
|
instruction.pos = { x: 200, y: 236 };
|
||||||
this.add(instruction);
|
this.add(instruction);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,8 +1,9 @@
|
|||||||
const asdf = require("asdf-games");
|
const asdf = require("asdf-games");
|
||||||
// eslint-disable-next-line no-unused-vars
|
// eslint-disable-next-line no-unused-vars
|
||||||
const { Texture, Container, Sprite } = asdf;
|
const { Texture, Text, Container, Sprite } = asdf;
|
||||||
|
|
||||||
var logo = new Texture("../res/images/asdf-logo.png");
|
const text = require(__dirname + "/../../res/lang/default.js");
|
||||||
|
const fillStyle = {fill: "#ffffff", font: "24px Arial"};
|
||||||
|
|
||||||
class Logo extends Container {
|
class Logo extends Container {
|
||||||
constructor(game, onEnd) {
|
constructor(game, onEnd) {
|
||||||
@ -12,7 +13,15 @@ class Logo extends Container {
|
|||||||
|
|
||||||
this.children = [];
|
this.children = [];
|
||||||
|
|
||||||
this.add(new Sprite(logo));
|
const textPos = { x: 200, y: 150 };
|
||||||
|
for (let index = 0; index < text.logoScreen.length; index++) {
|
||||||
|
const element = new Text(text.logoScreen[index], fillStyle);
|
||||||
|
element.pos = {
|
||||||
|
x: textPos.x,
|
||||||
|
y: textPos.y + 24 * index
|
||||||
|
};
|
||||||
|
this.add(element);
|
||||||
|
}
|
||||||
|
|
||||||
this.lifetime = 2;
|
this.lifetime = 2;
|
||||||
}
|
}
|
||||||
|
@ -1,16 +1,9 @@
|
|||||||
const asdf = require("asdf-games");
|
const asdf = require("asdf-games");
|
||||||
// eslint-disable-next-line no-unused-vars
|
// eslint-disable-next-line no-unused-vars
|
||||||
const { Texture, Container, TileSprite, Text, AnimManager, Rect, Sprite } = asdf;
|
const { Texture, Container, Sprite, Text } = asdf;
|
||||||
|
|
||||||
const text = require(__dirname + "/../../res/lang/default.js");
|
const text = require(__dirname + "/../../res/lang/default.js");
|
||||||
const fillStyle = {fill: "#ffffff", font: "24px Minecraft"};
|
const fillStyle = {fill: "#ffffff", font: "24px Arial"};
|
||||||
|
|
||||||
const textures = {
|
|
||||||
space: new Texture("../res/images/keys/space.png"),
|
|
||||||
t: new Texture("../res/images/keys/t.png"),
|
|
||||||
q: new Texture("../res/images/keys/q.png"),
|
|
||||||
logo: new Texture("../res/images/logo.png")
|
|
||||||
};
|
|
||||||
|
|
||||||
class Title extends Container {
|
class Title extends Container {
|
||||||
constructor(game, keys, onStart, onTutorial, onQuit) {
|
constructor(game, keys, onStart, onTutorial, onQuit) {
|
||||||
@ -26,46 +19,13 @@ class Title extends Container {
|
|||||||
|
|
||||||
this.children = [];
|
this.children = [];
|
||||||
|
|
||||||
this.add(new Rect(this.game.w, this.game.h, { fill: "#333333" }));
|
const textPos = { x: 200, y: 200 };
|
||||||
|
|
||||||
this.add(new Sprite(textures.logo));
|
|
||||||
|
|
||||||
this.keyCaps = [
|
|
||||||
new TileSprite(textures.space, 64, 16),
|
|
||||||
new TileSprite(textures.t, 16, 16),
|
|
||||||
new TileSprite(textures.q, 16, 16)
|
|
||||||
];
|
|
||||||
|
|
||||||
this.keyCaps.forEach(element => {
|
|
||||||
element.scale = { x: 1.5, y: 1.5 };
|
|
||||||
element.anims = new AnimManager(element);
|
|
||||||
element.anims.add("press", [0, 1].map(y => ({ x: 0, y })), 0.50);
|
|
||||||
element.anims.play("press");
|
|
||||||
console.log(element);
|
|
||||||
});
|
|
||||||
|
|
||||||
const textPos = { x: 220, y: 240 };
|
|
||||||
for (let index = 0; index < text.titleScreen.instructions.length; index++) {
|
for (let index = 0; index < text.titleScreen.instructions.length; index++) {
|
||||||
const keyCap = this.keyCaps[index];
|
|
||||||
if (index == 0) {
|
|
||||||
keyCap.pos = {
|
|
||||||
x: textPos.x - 120,
|
|
||||||
y: textPos.y + (28 * index) - 18
|
|
||||||
};
|
|
||||||
} else {
|
|
||||||
keyCap.pos = {
|
|
||||||
x: textPos.x - 56,
|
|
||||||
y: textPos.y + (28 * index) - 20
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
const element = new Text(text.titleScreen.instructions[index], fillStyle);
|
const element = new Text(text.titleScreen.instructions[index], fillStyle);
|
||||||
element.pos = {
|
element.pos = {
|
||||||
x: textPos.x,
|
x: textPos.x,
|
||||||
y: textPos.y + 28 * index
|
y: textPos.y + 28 * index
|
||||||
};
|
};
|
||||||
|
|
||||||
this.add(keyCap);
|
|
||||||
this.add(element);
|
this.add(element);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,16 +1,9 @@
|
|||||||
const asdf = require("asdf-games");
|
const asdf = require("asdf-games");
|
||||||
// eslint-disable-next-line no-unused-vars
|
// eslint-disable-next-line no-unused-vars
|
||||||
const { Texture, Rect, Container, Text, TileSprite } = asdf;
|
const { Texture, Container, Text, Sprite } = asdf;
|
||||||
|
|
||||||
const text = require(__dirname + "/../../res/lang/default.js");
|
const text = require(__dirname + "/../../res/lang/default.js");
|
||||||
const fillStyle = {fill: "#ffffff", font: "16px Minecraft"};
|
const fillStyle = {fill: "#ffffff", font: "20px Arial"};
|
||||||
|
|
||||||
const textures = {
|
|
||||||
space: new Texture("../res/images/keys/space.png"),
|
|
||||||
arrows: new Texture("../res/images/keys/arrows.png"),
|
|
||||||
ctrl: new Texture("../res/images/keys/ctrl.png"),
|
|
||||||
interact: new Texture("../res/images/tutorial/interact.png")
|
|
||||||
};
|
|
||||||
|
|
||||||
class Tutorial extends Container {
|
class Tutorial extends Container {
|
||||||
constructor(game, keys, onEnd) {
|
constructor(game, keys, onEnd) {
|
||||||
@ -19,52 +12,16 @@ class Tutorial extends Container {
|
|||||||
this.keys = keys;
|
this.keys = keys;
|
||||||
this.onEnd = onEnd;
|
this.onEnd = onEnd;
|
||||||
|
|
||||||
this.pos = { x: 0, y: 0 };
|
|
||||||
this.children = [];
|
this.children = [];
|
||||||
|
|
||||||
this.add(new Rect(this.game.w, this.game.h, { fill: "#333333" }));
|
const textPos = { x: 50, y: 150 };
|
||||||
|
|
||||||
const title = new Text("Tutorial", {fill: "#ffffff", font: "36px Minecraft"});
|
|
||||||
title.pos = { x: 12, y: 44 };
|
|
||||||
this.add(title);
|
|
||||||
|
|
||||||
this.images = [
|
|
||||||
new TileSprite(textures.arrows, 48, 32),
|
|
||||||
new TileSprite(textures.ctrl, 21, 16),
|
|
||||||
new TileSprite(textures.space, 64, 16),
|
|
||||||
new TileSprite(textures.interact, 64, 39)
|
|
||||||
];
|
|
||||||
|
|
||||||
this.instructions = [];
|
|
||||||
for (let index = 0; index < text.tutorial.length; index++) {
|
for (let index = 0; index < text.tutorial.length; index++) {
|
||||||
this.instructions.push(new Text(text.tutorial[index], fillStyle));
|
const element = new Text(text.tutorial[index], fillStyle);
|
||||||
}
|
element.pos = {
|
||||||
|
x: textPos.x,
|
||||||
// Controls direction
|
y: textPos.y + 24 * index
|
||||||
this.images[0].pos = { x: 24, y: 60 };
|
};
|
||||||
this.instructions[0].pos = { x: 12, y: 108 };
|
this.add(element);
|
||||||
|
|
||||||
// Controls sprint
|
|
||||||
this.images[1].pos = { x: 24, y: 116 };
|
|
||||||
this.instructions[1].pos = { x: 12, y: 148 };
|
|
||||||
|
|
||||||
// Controls action
|
|
||||||
this.images[2].pos = { x: 24, y: 156 };
|
|
||||||
this.instructions[2].pos = { x: 12, y: 188 };
|
|
||||||
|
|
||||||
// Interact
|
|
||||||
this.images[3].pos = { x: 24, y: 196 };
|
|
||||||
this.instructions[3].pos = { x: 12, y: 254 };
|
|
||||||
this.instructions[4].pos = { x: 12, y: 274 };
|
|
||||||
|
|
||||||
// Back to menu
|
|
||||||
this.instructions[5].pos = { x: 12, y: 308 };
|
|
||||||
|
|
||||||
for (let index = 0; index < this.instructions.length; index++) {
|
|
||||||
if (this.images[index]) {
|
|
||||||
this.add(this.images[index]);
|
|
||||||
}
|
|
||||||
this.add(this.instructions[index]);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|