pascal.lafourcade
/
waria
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Ajustement des constantes pour les rendre dynamiques en fonction de la taille de l'écran (écran vertical, carré ...) - Suppression du plus de valeur écrite en dur dans le code (les valeurs arbitraires de dimension comme 50px)

Browse Source
master
clmaisonha 5 years ago
parent e064e963bb
commit b9dd434b13
11 changed files with 111 additions and 42 deletions
Show Stats Download Patch File Download Diff File

2
Code/public/js/level2.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
Code/public/js/level3.min.js vendored
View File

File diff suppressed because one or more lines are too long

9
Code/src/js/level2/Boot.js
Unescape View File

@ -5,9 +5,16 @@ class Boot extends ManageLang {
create() { create() {
super.create(); super.create();
let style = {font: '200px stencil', fill: "#e2e2e2"}; let style = {font: HEIGHT_TITLE.toString() + 'px stencil', fill: "#e2e2e2"};
this.add.text(WIDTH_WINDOW / 2, HEIGHT_WINDOW / 3, "WARIA", style).setOrigin(0.5, 0.5); this.add.text(WIDTH_WINDOW / 2, HEIGHT_WINDOW / 3, "WARIA", style).setOrigin(0.5, 0.5);
let btn = this.add.sprite(WIDTH_WINDOW / 2, (HEIGHT_WINDOW / 3) * 2, 'playLetter').setInteractive(); let btn = this.add.sprite(WIDTH_WINDOW / 2, (HEIGHT_WINDOW / 3) * 2, 'playLetter').setInteractive();
if (WIDTH_WINDOW > HEIGHT_WINDOW) {
btn.displayHeight = HEIGHT_WINDOW / 5;
btn.scaleX = btn.scaleY;
} else {
btn.displayWidth = WIDTH_WINDOW / 1.5;
btn.scaleY = btn.scaleX;
}
btn.on('pointerout', () => btn.setFrame(0)); btn.on('pointerout', () => btn.setFrame(0));
btn.on('pointerover', () => btn.setFrame(1)); btn.on('pointerover', () => btn.setFrame(1));
btn.on('pointerdown', () => this.clickPlay(btn)); btn.on('pointerdown', () => this.clickPlay(btn));

70
Code/src/js/level2/Description.js
Unescape View File

@ -6,8 +6,8 @@ class Description extends ManageLang {
create() { create() {
super.create(); super.create();
let x = WIDTH_WINDOW / 2; let x = WIDTH_WINDOW / 2;
let y = HEIGHT_WINDOW - 100; let y = HEIGHT_WINDOW;
let returnBtn = this.add.image(x, y, 'cancel').setOrigin(0.5, 0.5).setInteractive(); let returnBtn = this.add.image(x, y, 'cancel').setOrigin(0.5, 1).setInteractive();
returnBtn.on('pointerover', () => returnBtn.setFrame(1)); returnBtn.on('pointerover', () => returnBtn.setFrame(1));
returnBtn.on('pointerout', () => returnBtn.setFrame(0)); returnBtn.on('pointerout', () => returnBtn.setFrame(0));
returnBtn.on('pointerdown', () => this.return()); returnBtn.on('pointerdown', () => this.return());
@ -20,17 +20,34 @@ class Description extends ManageLang {
loadBonus() { loadBonus() {
this.width = WIDTH_WINDOW / 3 - 20; this.width = WIDTH_WINDOW / 3 - 20;
this.height = HEIGHT_WINDOW / 4; this.height = HEIGHT_WINDOW / 4;
let x = 0; let offX;
this.createList(lShieldBonus, x, true); let offY;
x = WIDTH_WINDOW / 3; let x;
this.createList(lSpeedBonus, x, false); if (WIDTH_WINDOW > HEIGHT_WINDOW) {
x = WIDTH_WINDOW / 1.5; this.nbWidth = 1;
this.createList(lAttackBonus, x, false); this.nbHeight = 3;
offX = WIDTH_WINDOW / 3;
offY = 0;
x = 0;
} else {
this.nbWidth = 3;
this.nbHeight = 1;
offX = 0;
offY = HEIGHT_WINDOW / 3.5;
x = WIDTH_BUTTON / 1.5;
}
let y = WIDTH_BUTTON / 1.5;
this.createList(lShieldBonus, x, y, true);
x += offX;
y += offY;
this.createList(lSpeedBonus, x, y, false);
x += offX;
y += offY;
this.createList(lAttackBonus, x, y, false);
} }
createList(listBonus, x, add = true) { createList(listBonus, x, y, add = true) {
let y = 50; this.createCategoryBonus(x, y, this.width * this.nbWidth, this.height * this.nbHeight);
this.createCategoryBonus(x, y, this.width, this.height * listBonus.length);
listBonus.forEach(bonus => { listBonus.forEach(bonus => {
let time = ""; let time = "";
if (bonus.time !== undefined) { if (bonus.time !== undefined) {
@ -45,7 +62,10 @@ class Description extends ManageLang {
value = 'BONUS : ' + sign + bonus.value; value = 'BONUS : ' + sign + bonus.value;
} }
this.createBonusDescription(x, y, this.width, this.height, bonus.texture, bonus.name, value + time); this.createBonusDescription(x, y, this.width, this.height, bonus.texture, bonus.name, value + time);
y += this.height; if (this.nbHeight > 1)
y += this.height;
if (this.nbWidth > 1)
x += this.width;
}); });
} }
@ -62,12 +82,26 @@ class Description extends ManageLang {
height -= 20; height -= 20;
this.add.rectangle(x, y, width, height, 0xFFFFFF).setOrigin(0, 0); this.add.rectangle(x, y, width, height, 0xFFFFFF).setOrigin(0, 0);
let image = this.add.image(x + 5, y + 5, texture).setOrigin(0, 0); let image = this.add.image(x + 5, y + 5, texture).setOrigin(0, 0);
image.displayHeight = 100; let style = {fill: "#000000"};
image.scaleX = image.scaleY; if (WIDTH_WINDOW > HEIGHT_WINDOW) {
let style = {font: (image.displayHeight / 2 - name.length) + 'px stencil', fill: "#000000"}; image.displayHeight = width / 5;
this.add.text(x + image.displayWidth + 10, y + 5 + image.displayHeight / 2, name.toString(), style).setOrigin(0, 0.5); image.scaleX = image.scaleY;
style.font = (height / 6) + 'px stencil'; style.font = (image.displayHeight / 3).toString() + 'px stencil';
this.add.text(x + 5, y + image.displayHeight + (height - image.displayHeight) / 2, text.toString(), style).setOrigin(0, 0.5); this.add.text(x + image.displayWidth + 10, y + 5 + image.displayHeight / 2, name.toString(), style).setOrigin(0, 0.5);
style.font = (image.displayHeight / 4).toString() + 'px stencil';
this.add.text(x + 5, y + image.displayHeight + (height - image.displayHeight) / 2, text.toString(), style).setOrigin(0, 0.5);
} else {
image.displayHeight = height / 2;
image.scaleX = image.scaleY;
if (image.displayWidth > width) {
image.displayWidth = width;
image.scaleY = image.scaleX;
}
style.font = (width / 10).toString() + 'px stencil';
this.add.text(x + 5, y + image.displayHeight + (height - image.displayHeight) / 3, name.toString(), style).setOrigin(0, 0);
style.font = (width / 15).toString() + 'px stencil';
this.add.text(x + 5, y + image.displayHeight + (height - image.displayHeight) / 1.5, text.toString(), style).setOrigin(0, 1);
}
} }
return() { return() {

4
Code/src/js/level2/Game.js
Unescape View File

@ -357,8 +357,8 @@ class Game extends ManageLang {
let diffX = width * 1.1; let diffX = width * 1.1;
let line = 0; let line = 0;
new Button(this, 10, 10, width, width, 'back', () => this.clickBack()).setOrigin(0, 0); new Button(this, 10, 10, width, width, 'back', () => this.clickBack()).setOrigin(0, 0);
new Button(this, WIDTH_WINDOW - diffX, y, width, width, 'bonusBtn', () => this.clickBonus()).setOrigin(1, 0); new Button(this, WIDTH_WINDOW - diffX, HEIGHT_WINDOW, width, width, 'bonusBtn', () => this.clickBonus()).setOrigin(1, 1);
new Button(this, WIDTH_WINDOW, y, width, width, 'save', () => this.clickSave()).setOrigin(1, 0); new Button(this, WIDTH_WINDOW, HEIGHT_WINDOW, width, width, 'save', () => this.clickSave()).setOrigin(1, 1);
this.playBtn = new Button(this, x, y, width, width, 'play', () => this.clickPlay()).setOrigin(1, 0); this.playBtn = new Button(this, x, y, width, width, 'play', () => this.clickPlay()).setOrigin(1, 0);
if (SPEED_GAME === 1) { if (SPEED_GAME === 1) {
line = 0; line = 0;

11
Code/src/js/level2/LevelSelect.js
Unescape View File

@ -7,14 +7,19 @@ class LevelSelect extends ManageLang {
create() { create() {
super.create(); super.create();
let style = {font: (HEIGHT_WINDOW / 5).toString() + 'px stencil', fill: "#e2e2e2"}; let style = {font: HEIGHT_TITLE.toString() + 'px stencil', fill: "#e2e2e2"};
let text = this.add.text(WIDTH_WINDOW / 2, HEIGHT_WINDOW / 6, "WARIA", style).setOrigin(0.5, 0.5); this.add.text(WIDTH_WINDOW / 2, HEIGHT_WINDOW / 6, "WARIA", style).setOrigin(0.5, 0.5);
this.createLevel(WIDTH_WINDOW / 3, HEIGHT_WINDOW / 2, 1); this.createLevel(WIDTH_WINDOW / 3, HEIGHT_WINDOW / 2, 1);
this.createLevel(WIDTH_WINDOW / 1.5, HEIGHT_WINDOW / 2, 2); this.createLevel(WIDTH_WINDOW / 1.5, HEIGHT_WINDOW / 2, 2);
} }
createLevel(x, y, number = 0) { createLevel(x, y, number = 0) {
let width = WIDTH_WINDOW / 8; let width;
if (WIDTH_WINDOW > HEIGHT_WINDOW) {
width = HEIGHT_WINDOW / 4;
} else {
width = WIDTH_WINDOW / 4;
}
let btn = this.add.image(x, y, 'rectangle').setOrigin(0.5, 0.5).setInteractive(); let btn = this.add.image(x, y, 'rectangle').setOrigin(0.5, 0.5).setInteractive();
btn.displayHeight = btn.displayWidth = width; btn.displayHeight = btn.displayWidth = width;
let style = {font: (width / 2).toString() + 'px stencil', fill: "#000000"}; let style = {font: (width / 2).toString() + 'px stencil', fill: "#000000"};

2
Code/src/js/level2/RectangleNode.js
Unescape View File

@ -106,7 +106,7 @@ class RectangleNode {
this.xLine = this.rect.x; this.xLine = this.rect.x;
this.yLine = this.rect.y; this.yLine = this.rect.y;
this.line.clear(); this.line.clear();
this.line.lineStyle(10, 0xffffff, 1); this.line.lineStyle(WIDTH_LINE, 0xffffff, 1);
this.line.lineBetween(this.xOrigin, this.yOrigin, this.rect.x, this.rect.y + this.rect.displayHeight / 10); this.line.lineBetween(this.xOrigin, this.yOrigin, this.rect.x, this.rect.y + this.rect.displayHeight / 10);
} }
if (this.canAddNode === true) { if (this.canAddNode === true) {

2
Code/src/js/level2/Robot.js
Unescape View File

@ -388,7 +388,7 @@ class Robot {
this.circleRange.clear(); this.circleRange.clear();
let color = COLOR_GREEN; let color = COLOR_GREEN;
let thickness = 4; let thickness = WIDTH_LINE / 2;
let alpha = 1 / 3; let alpha = 1 / 3;
this.circleRange.lineStyle(thickness, color, alpha); this.circleRange.lineStyle(thickness, color, alpha);
let radius = this.range * RANGE; let radius = this.range * RANGE;

11
Code/src/js/level2/Type.js
Unescape View File

@ -8,7 +8,7 @@ class Type extends ManageLang {
create() { create() {
super.create(); super.create();
let style = {font: (HEIGHT_WINDOW / 5).toString() + 'px stencil', fill: "#e2e2e2"}; let style = {font: HEIGHT_TITLE.toString() + 'px stencil', fill: "#e2e2e2"};
this.add.text(WIDTH_WINDOW / 2, HEIGHT_WINDOW / 6, "WARIA", style).setOrigin(0.5, 0.5); this.add.text(WIDTH_WINDOW / 2, HEIGHT_WINDOW / 6, "WARIA", style).setOrigin(0.5, 0.5);
let btnDuel = this.add.sprite((WIDTH_WINDOW / 8) * 3, (HEIGHT_WINDOW / 4) * 2, 'duel').setInteractive(); let btnDuel = this.add.sprite((WIDTH_WINDOW / 8) * 3, (HEIGHT_WINDOW / 4) * 2, 'duel').setInteractive();
@ -22,8 +22,13 @@ class Type extends ManageLang {
} }
createbutton(btn, level) { createbutton(btn, level) {
btn.displayHeight = HEIGHT_WINDOW / 4; if (WIDTH_WINDOW > HEIGHT_WINDOW) {
btn.scaleX = btn.scaleY; btn.displayHeight = HEIGHT_WINDOW / 4;
btn.scaleX = btn.scaleY;
} else {
btn.displayWidth = WIDTH_WINDOW / 4;
btn.scaleY = btn.scaleX;
}
btn.on('pointerout', () => btn.setFrame(0)); btn.on('pointerout', () => btn.setFrame(0));
btn.on('pointerover', () => btn.setFrame(1)); btn.on('pointerover', () => btn.setFrame(1));
btn.on('pointerdown', () => this.clickPlay(level)); btn.on('pointerdown', () => this.clickPlay(level));

34
Code/src/js/level2/Variable.js
Unescape View File

@ -21,31 +21,49 @@ const COLOR_SELECTED = 0xEFD807;
const COLOR_MYSELF = 0x6666ff; const COLOR_MYSELF = 0x6666ff;
const WIDTH_WINDOW = $(document).width() - 20; const WIDTH_WINDOW = $(document).width() - 20;
const HEIGHT_WINDOW = $(document).height() - 20; const HEIGHT_WINDOW = $(document).height() - 20;
const OFFX_MAP = WIDTH_WINDOW / 20; var OFFX_MAP = WIDTH_WINDOW / 20;
var OFFY_MAP; var OFFY_MAP;
var WIDTH_MAP; var WIDTH_MAP;
var OFFY_TREE_BEGIN; var OFFY_TREE_BEGIN;
var CENTERX_TREE; var CENTERX_TREE;
var HEIGHT_TITLE;
var HEIGHT_NODE;
var HEIGHT_BUTTON_TEXT;
if (WIDTH_WINDOW < HEIGHT_WINDOW) { if (WIDTH_WINDOW < HEIGHT_WINDOW) {
WIDTH_MAP = WIDTH_WINDOW * 0.8; WIDTH_MAP = WIDTH_WINDOW * 0.65;
OFFY_MAP = WIDTH_MAP / 10; OFFY_MAP = OFFX_MAP * 2;
HEIGHT_BUTTON_TEXT = WIDTH_WINDOW / 15;
if (WIDTH_MAP > HEIGHT_WINDOW * 0.4) {
WIDTH_MAP = HEIGHT_WINDOW * 0.4;
OFFX_MAP = OFFX_MAP * 3;
}
OFFY_TREE_BEGIN = WIDTH_MAP + OFFY_MAP * 2; OFFY_TREE_BEGIN = WIDTH_MAP + OFFY_MAP * 2;
CENTERX_TREE = WIDTH_WINDOW / 2; CENTERX_TREE = WIDTH_WINDOW / 2;
HEIGHT_TITLE = WIDTH_WINDOW / 5;
HEIGHT_NODE = (HEIGHT_WINDOW - WIDTH_MAP) / 6;
} else { } else {
WIDTH_MAP = HEIGHT_WINDOW * 0.8; WIDTH_MAP = HEIGHT_WINDOW * 0.8;
HEIGHT_NODE = HEIGHT_WINDOW / 7;
HEIGHT_BUTTON_TEXT = HEIGHT_WINDOW / 9;
if (WIDTH_MAP > WIDTH_WINDOW * 0.5) {
WIDTH_MAP = WIDTH_WINDOW * 0.4;
HEIGHT_NODE = (WIDTH_WINDOW - (WIDTH_MAP + OFFX_MAP)) / 6;
HEIGHT_BUTTON_TEXT = HEIGHT_WINDOW / 15;
}
OFFY_MAP = (HEIGHT_WINDOW - WIDTH_MAP) / 2; OFFY_MAP = (HEIGHT_WINDOW - WIDTH_MAP) / 2;
OFFY_TREE_BEGIN = HEIGHT_WINDOW / 5; OFFY_TREE_BEGIN = OFFY_MAP + WIDTH_MAP / 8;
CENTERX_TREE = (WIDTH_WINDOW - (WIDTH_MAP + OFFX_MAP)) / 2 + (WIDTH_MAP + OFFX_MAP); CENTERX_TREE = (WIDTH_WINDOW - (WIDTH_MAP + OFFX_MAP + WIDTH_MAP / 4)) / 2 + (WIDTH_MAP + OFFX_MAP + WIDTH_MAP / 4);
HEIGHT_TITLE = HEIGHT_WINDOW / 5;
} }
const OFFX_TREE = WIDTH_WINDOW / 10; const WIDTH_LINE = HEIGHT_NODE / 20;
const OFFY_TREE = HEIGHT_WINDOW / 6; const OFFX_TREE = HEIGHT_NODE;
const OFFY_TREE = HEIGHT_NODE * 1.1;
const WIDTH_BUTTON = WIDTH_MAP / 10; const WIDTH_BUTTON = WIDTH_MAP / 10;
const SCORE_HIT = 5; const SCORE_HIT = 5;
const SCORE_KILL = 15; const SCORE_KILL = 15;
const SCORE_BONUS = 4; const SCORE_BONUS = 4;
const HEIGHT_BAR = WIDTH_MAP / 20; const HEIGHT_BAR = WIDTH_MAP / 20;
const HEIGHT_NODE = HEIGHT_WINDOW / 6;
const LIFE = 100; const LIFE = 100;
const SHIELD = 100; const SHIELD = 100;

6
Code/src/js/level3/Finish.js
Unescape View File

@ -12,9 +12,9 @@ class Finish extends Phaser.Scene {
} }
addTitle(title) { addTitle(title) {
let sizeText = HEIGHT_WINDOW / 6; let sizeText = HEIGHT_TITLE / 1.5;
let style = {font: sizeText.toString() + 'px stencil', fill: "#e2e2e2"}; let style = {font: sizeText.toString() + 'px stencil', fill: "#e2e2e2"};
let text = this.add.text(WIDTH_WINDOW / 2, HEIGHT_WINDOW / 2, title, style).setOrigin(0.5, 0.5); let text = this.add.text(WIDTH_WINDOW / 2, HEIGHT_WINDOW / 2, title, style).setOrigin(0.5, 1);
style = {font: (sizeText / 2).toString() + 'px stencil', fill: "#e2e2e2"}; style = {font: (sizeText / 2).toString() + 'px stencil', fill: "#e2e2e2"};
this.add.text(WIDTH_WINDOW / 2, text.y + text.displayHeight, "SCORE : " + this.score.toString(), style).setOrigin(0.5, 0.5); this.add.text(WIDTH_WINDOW / 2, text.y + text.displayHeight, "SCORE : " + this.score.toString(), style).setOrigin(0.5, 0.5);
} }
@ -24,7 +24,7 @@ class Finish extends Phaser.Scene {
btn.on('pointerover', () => btn.setFrame(1)); btn.on('pointerover', () => btn.setFrame(1));
btn.on('pointerout', () => btn.setFrame(0)); btn.on('pointerout', () => btn.setFrame(0));
btn.displayHeight = HEIGHT_WINDOW / 9; btn.displayHeight = HEIGHT_BUTTON_TEXT;
btn.scaleX = btn.scaleY; btn.scaleX = btn.scaleY;
return btn; return btn;

Write Preview
Loading…
Cancel
Save