kar
/
phaser-game-bs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add Start Button ANd change Help Button Possition in capital letter and numeric

pull/5/head
Dev 1 2023-10-17 20:14:40 +05:30
parent ae14d20615
commit 167f8723cf
11 changed files with 308 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/pages/numeric/0.astro
View File

@ -54,6 +54,11 @@ import Layout from "../../layouts/Layout.astro";
sunHeight = 70;
animated0videoScale = 0.6;
animated0Height = 32;
helpButtonHeight = customHeight / 1.1;
helpButtonWidth = customWidth / 2 + 10;
startButtonHeight = customHeight / 1.1;
startButtonWidth = customWidth / 2 - 100;
} else{
cloudeSize = 500;
cloudHeight = 250;
@ -68,6 +73,11 @@ import Layout from "../../layouts/Layout.astro";
sunHeight = 100;
animated0videoScale = 0.70;
animated0Height = 20;
helpButtonHeight = customHeight / 2 + 40;
helpButtonWidth = customWidth / 1.32;
startButtonHeight = customHeight / 2 - 20;
startButtonWidth = customWidth / 1.32;
}
// let hideButton;
@ -203,11 +213,11 @@ import Layout from "../../layouts/Layout.astro";
let textX, textY;
firstLayer = this.add.image(customWidth / 2, customHeight / 2 + letterHeight, 'layer1').setScale(letterScale);
textX = isMobile ? customWidth / 16 : customWidth * 0.70;
textY = isMobile ? customHeight / 6.5 : customHeight / 2;
textX = isMobile ? customWidth / 4 : customWidth * 0.75;
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Hook Around Close',{ font: '700 35px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();
// audioOneAudio.play();
firstLayer.setDepth(1);
firstLayer.setAlpha(0.5);
firstLayer.setInteractive({ draggable: true });
@ -257,6 +267,25 @@ import Layout from "../../layouts/Layout.astro";
graphics.lineTo(pointer.x, pointer.y);
graphics.strokePath();
});
let startButton = this.add.text(startButtonWidth, startButtonHeight, "Start", {
font: '900 24px Quicksand',
fill: '#05b3a4',
backgroundColor : '#7c4c23',
padding: {x: 20, y: 10},
shadow: {
offsetX : 2,
offsetY : 2,
color: '#000',
blur: 5,
fill: true
}
})
firstTextLayer.setVisible(false);
startButton.setInteractive().on('pointerdown', () => {
audioOneAudio.play();
firstTextLayer.setVisible(true);
})
}

35
src/pages/numeric/1.astro
View File

@ -55,6 +55,11 @@ import Layout from "../../layouts/Layout.astro";
animated1videoScale = 0.6;
animated1Height = 32;
helpButtonHeight = customHeight / 1.1;
helpButtonWidth = customWidth / 2 + 10;
startButtonHeight = customHeight / 1.1;
startButtonWidth = customWidth / 2 - 100;
} else{
cloudeSize = 500;
cloudHeight = 250;
@ -70,6 +75,11 @@ import Layout from "../../layouts/Layout.astro";
animated1videoScale = 0.70;
animated1Height = 20;
helpButtonHeight = customHeight / 2 + 40;
helpButtonWidth = customWidth / 1.32;
startButtonHeight = customHeight / 2 - 20;
startButtonWidth = customWidth / 1.32;
}
// let hideButton;
@ -206,11 +216,11 @@ import Layout from "../../layouts/Layout.astro";
let textX, textY;
firstLayer = this.add.image(customWidth / 2 - 10, customHeight / 2 + letterHeight, 'layer1').setScale(letterScale);
textX = isMobile ? customWidth / 4 : customWidth * 0.70;
textY = isMobile ? customHeight / 6.5 : customHeight / 2;
textX = isMobile ? customWidth / 4 : customWidth * 0.75;
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Tall Down',{ font: '700 35px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();
// audioOneAudio.play();
firstLayer.setDepth(1);
firstLayer.setAlpha(0.5);
firstLayer.setInteractive({ draggable: true });
@ -260,6 +270,25 @@ import Layout from "../../layouts/Layout.astro";
graphics.lineTo(pointer.x, pointer.y);
graphics.strokePath();
});
let startButton = this.add.text(startButtonWidth, startButtonHeight, "Start", {
font: '900 24px Quicksand',
fill: '#05b3a4',
backgroundColor : '#7c4c23',
padding: {x: 20, y: 10},
shadow: {
offsetX : 2,
offsetY : 2,
color: '#000',
blur: 5,
fill: true
}
})
firstTextLayer.setVisible(false);
startButton.setInteractive().on('pointerdown', () => {
audioOneAudio.play();
firstTextLayer.setVisible(true);
})
}

31
src/pages/numeric/2.astro
View File

@ -55,6 +55,11 @@ import Layout from "../../layouts/Layout.astro";
animated2Scale = 0.55;
animated2Height = 32;
helpButtonHeight = customHeight / 1.1;
helpButtonWidth = customWidth / 2 + 10;
startButtonHeight = customHeight / 1.1;
startButtonWidth = customWidth / 2 - 100;
} else{
cloudeSize = 500;
cloudHeight = 250;
@ -70,6 +75,11 @@ import Layout from "../../layouts/Layout.astro";
animated2Scale = 0.55;
animated2Height = 20;
helpButtonHeight = customHeight / 2 + 40;
helpButtonWidth = customWidth / 1.32;
startButtonHeight = customHeight / 2 - 20;
startButtonWidth = customWidth / 1.32;
}
// let hideButton;
@ -212,7 +222,7 @@ import Layout from "../../layouts/Layout.astro";
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Roll Slant',{ font: '700 40px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();
// audioOneAudio.play();
firstLayer.setDepth(1);
firstLayer.setAlpha(0.5);
firstLayer.setInteractive({ draggable: true });
@ -294,6 +304,25 @@ import Layout from "../../layouts/Layout.astro";
graphics.lineTo(pointer.x, pointer.y);
graphics.strokePath();
});
let startButton = this.add.text(startButtonWidth, startButtonHeight, "Start", {
font: '900 24px Quicksand',
fill: '#05b3a4',
backgroundColor : '#7c4c23',
padding: {x: 20, y: 10},
shadow: {
offsetX : 2,
offsetY : 2,
color: '#000',
blur: 5,
fill: true
}
})
firstTextLayer.setVisible(false);
startButton.setInteractive().on('pointerdown', () => {
audioOneAudio.play();
firstTextLayer.setVisible(true);
})
}
function update() {

31
src/pages/numeric/3.astro
View File

@ -55,6 +55,11 @@ import Layout from "../../layouts/Layout.astro";
animated3Scale = 0.55;
animated3Height = 32;
helpButtonHeight = customHeight / 1.1;
helpButtonWidth = customWidth / 2 + 10;
startButtonHeight = customHeight / 1.1;
startButtonWidth = customWidth / 2 - 100;
} else{
cloudeSize = 500;
cloudHeight = 250;
@ -70,6 +75,11 @@ import Layout from "../../layouts/Layout.astro";
animated3Scale = 0.55;
animated3Height = 20;
helpButtonHeight = customHeight / 2 + 40;
helpButtonWidth = customWidth / 1.32;
startButtonHeight = customHeight / 2 - 20;
startButtonWidth = customWidth / 1.32;
}
// let hideButton;
@ -211,7 +221,7 @@ import Layout from "../../layouts/Layout.astro";
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Roll Around',{ font: '700 40px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();
// audioOneAudio.play();
firstLayer.setDepth(1);
firstLayer.setAlpha(0.5);
firstLayer.setInteractive({ draggable: true });
@ -293,6 +303,25 @@ import Layout from "../../layouts/Layout.astro";
graphics.lineTo(pointer.x, pointer.y);
graphics.strokePath();
});
let startButton = this.add.text(startButtonWidth, startButtonHeight, "Start", {
font: '900 24px Quicksand',
fill: '#05b3a4',
backgroundColor : '#7c4c23',
padding: {x: 20, y: 10},
shadow: {
offsetX : 2,
offsetY : 2,
color: '#000',
blur: 5,
fill: true
}
})
firstTextLayer.setVisible(false);
startButton.setInteractive().on('pointerdown', () => {
audioOneAudio.play();
firstTextLayer.setVisible(true);
})
}
function update() {

31
src/pages/numeric/4.astro
View File

@ -59,6 +59,11 @@ import Layout from "../../layouts/Layout.astro";
animated4Height = 35;
animated4Scale = 0.65;
helpButtonHeight = customHeight / 1.1;
helpButtonWidth = customWidth / 2 + 10;
startButtonHeight = customHeight / 1.1;
startButtonWidth = customWidth / 2 - 100;
} else{
cloudeSize = 500;
cloudHeight = 250;
@ -74,6 +79,11 @@ import Layout from "../../layouts/Layout.astro";
animated4Height = 20;
animated4Scale = 0.7;
helpButtonHeight = customHeight / 2 + 40;
helpButtonWidth = customWidth / 1.32;
startButtonHeight = customHeight / 2 - 20;
startButtonWidth = customWidth / 1.32;
}
function preload() {
this.load.video('animated4', '/assets/animated-letter/number_4.mp4');
@ -213,7 +223,7 @@ import Layout from "../../layouts/Layout.astro";
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Down',{ font: '700 40px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();
// audioOneAudio.play();
firstLayer.setDepth(1);
firstLayer.setAlpha(0.5);
firstLayer.setInteractive({ draggable: true });
@ -325,6 +335,25 @@ import Layout from "../../layouts/Layout.astro";
graphics.lineTo(pointer.x, pointer.y);
graphics.strokePath();
});
let startButton = this.add.text(startButtonWidth, startButtonHeight, "Start", {
font: '900 24px Quicksand',
fill: '#05b3a4',
backgroundColor : '#7c4c23',
padding: {x: 20, y: 10},
shadow: {
offsetX : 2,
offsetY : 2,
color: '#000',
blur: 5,
fill: true
}
})
firstTextLayer.setVisible(false);
startButton.setInteractive().on('pointerdown', () => {
audioOneAudio.play();
firstTextLayer.setVisible(true);
})
}
function update() {

31
src/pages/numeric/5.astro
View File

@ -59,6 +59,11 @@ import Layout from "../../layouts/Layout.astro";
animated5Height = 35;
animated5Scale = 0.55;
helpButtonHeight = customHeight / 1.1;
helpButtonWidth = customWidth / 2 + 10;
startButtonHeight = customHeight / 1.1;
startButtonWidth = customWidth / 2 - 100;
} else{
cloudeSize = 500;
cloudHeight = 250;
@ -74,6 +79,11 @@ import Layout from "../../layouts/Layout.astro";
animated5Height = 20;
animated5Scale = 0.6;
helpButtonHeight = customHeight / 2 + 40;
helpButtonWidth = customWidth / 1.32;
startButtonHeight = customHeight / 2 - 20;
startButtonWidth = customWidth / 1.32;
}
function preload() {
this.load.video('animated5', '/assets/animated-letter/number_5.mp4');
@ -214,7 +224,7 @@ import Layout from "../../layouts/Layout.astro";
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Down',{ font: '700 40px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();
// audioOneAudio.play();
firstLayer.setDepth(1);
firstLayer.setAlpha(0.5);
firstLayer.setInteractive({ draggable: true });
@ -326,6 +336,25 @@ import Layout from "../../layouts/Layout.astro";
graphics.lineTo(pointer.x, pointer.y);
graphics.strokePath();
});
let startButton = this.add.text(startButtonWidth, startButtonHeight, "Start", {
font: '900 24px Quicksand',
fill: '#05b3a4',
backgroundColor : '#7c4c23',
padding: {x: 20, y: 10},
shadow: {
offsetX : 2,
offsetY : 2,
color: '#000',
blur: 5,
fill: true
}
})
firstTextLayer.setVisible(false);
startButton.setInteractive().on('pointerdown', () => {
audioOneAudio.play();
firstTextLayer.setVisible(true);
})
}
function update() {

31
src/pages/numeric/6.astro
View File

@ -55,6 +55,11 @@ import Layout from "../../layouts/Layout.astro";
animated6Scale = 0.55;
animated6Height = 32;
helpButtonHeight = customHeight / 1.1;
helpButtonWidth = customWidth / 2 + 10;
startButtonHeight = customHeight / 1.1;
startButtonWidth = customWidth / 2 - 100;
} else{
cloudeSize = 500;
cloudHeight = 250;
@ -70,6 +75,11 @@ import Layout from "../../layouts/Layout.astro";
animated6Scale = 0.55;
animated6Height = 20;
helpButtonHeight = customHeight / 2 + 40;
helpButtonWidth = customWidth / 1.32;
startButtonHeight = customHeight / 2 - 20;
startButtonWidth = customWidth / 1.32;
}
// let hideButton;
@ -212,7 +222,7 @@ import Layout from "../../layouts/Layout.astro";
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Curve Down',{ font: '700 40px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();
// audioOneAudio.play();
firstLayer.setDepth(1);
firstLayer.setAlpha(0.5);
firstLayer.setInteractive({ draggable: true });
@ -294,6 +304,25 @@ import Layout from "../../layouts/Layout.astro";
graphics.lineTo(pointer.x, pointer.y);
graphics.strokePath();
});
let startButton = this.add.text(startButtonWidth, startButtonHeight, "Start", {
font: '900 24px Quicksand',
fill: '#05b3a4',
backgroundColor : '#7c4c23',
padding: {x: 20, y: 10},
shadow: {
offsetX : 2,
offsetY : 2,
color: '#000',
blur: 5,
fill: true
}
})
firstTextLayer.setVisible(false);
startButton.setInteractive().on('pointerdown', () => {
audioOneAudio.play();
firstTextLayer.setVisible(true);
})
}
function update() {

33
src/pages/numeric/7.astro
View File

@ -55,13 +55,18 @@ import Layout from "../../layouts/Layout.astro";
animated7Scale = 0.55;
animated7Height = 32;
helpButtonHeight = customHeight / 1.1;
helpButtonWidth = customWidth / 2 + 10;
startButtonHeight = customHeight / 1.1;
startButtonWidth = customWidth / 2 - 100;
} else{
cloudeSize = 500;
cloudHeight = 250;
canvasScale = 0.195;
canvasHeight = 20;
letterHeight = 10;
letterScale = 1;
letterScale = 1.1;
backgroundScale = 1;
sunScale = 0.2;
sunScalePlus = 0.25;
@ -70,6 +75,11 @@ import Layout from "../../layouts/Layout.astro";
animated7Scale = 0.55;
animated7Height = 20;
helpButtonHeight = customHeight / 2 + 40;
helpButtonWidth = customWidth / 1.32;
startButtonHeight = customHeight / 2 - 20;
startButtonWidth = customWidth / 1.32;
}
// let hideButton;
@ -212,7 +222,7 @@ import Layout from "../../layouts/Layout.astro";
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Slide',{ font: '700 40px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();
// audioOneAudio.play();
firstLayer.setDepth(1);
firstLayer.setAlpha(0.5);
firstLayer.setInteractive({ draggable: true });
@ -294,6 +304,25 @@ import Layout from "../../layouts/Layout.astro";
graphics.lineTo(pointer.x, pointer.y);
graphics.strokePath();
});
let startButton = this.add.text(startButtonWidth, startButtonHeight, "Start", {
font: '900 24px Quicksand',
fill: '#05b3a4',
backgroundColor : '#7c4c23',
padding: {x: 20, y: 10},
shadow: {
offsetX : 2,
offsetY : 2,
color: '#000',
blur: 5,
fill: true
}
})
firstTextLayer.setVisible(false);
startButton.setInteractive().on('pointerdown', () => {
audioOneAudio.play();
firstTextLayer.setVisible(true);
})
}
function update() {

31
src/pages/numeric/8.astro
View File

@ -55,6 +55,11 @@ import Layout from "../../layouts/Layout.astro";
animated8Scale = 0.55;
animated8Height = 15;
helpButtonHeight = customHeight / 1.1;
helpButtonWidth = customWidth / 2 + 10;
startButtonHeight = customHeight / 1.1;
startButtonWidth = customWidth / 2 - 100;
} else{
cloudeSize = 500;
cloudHeight = 250;
@ -70,6 +75,11 @@ import Layout from "../../layouts/Layout.astro";
animated8Scale = 0.55;
animated8Height = 0;
helpButtonHeight = customHeight / 2 + 40;
helpButtonWidth = customWidth / 1.32;
startButtonHeight = customHeight / 2 - 20;
startButtonWidth = customWidth / 1.32;
}
// let hideButton;
@ -212,7 +222,7 @@ import Layout from "../../layouts/Layout.astro";
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Hook Snake',{ font: '700 40px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();
// audioOneAudio.play();
firstLayer.setDepth(1);
firstLayer.setAlpha(0.5);
firstLayer.setInteractive({ draggable: true });
@ -294,6 +304,25 @@ import Layout from "../../layouts/Layout.astro";
graphics.lineTo(pointer.x, pointer.y);
graphics.strokePath();
});
let startButton = this.add.text(startButtonWidth, startButtonHeight, "Start", {
font: '900 24px Quicksand',
fill: '#05b3a4',
backgroundColor : '#7c4c23',
padding: {x: 20, y: 10},
shadow: {
offsetX : 2,
offsetY : 2,
color: '#000',
blur: 5,
fill: true
}
})
firstTextLayer.setVisible(false);
startButton.setInteractive().on('pointerdown', () => {
audioOneAudio.play();
firstTextLayer.setVisible(true);
})
}
function update() {

35
src/pages/numeric/9.astro
View File

@ -54,7 +54,12 @@ import Layout from "../../layouts/Layout.astro";
sunHeight = 70;
animated9Scale = 0.55;
animated9Height = 32;
animated9Height = 40;
helpButtonHeight = customHeight / 1.1;
helpButtonWidth = customWidth / 2 + 10;
startButtonHeight = customHeight / 1.1;
startButtonWidth = customWidth / 2 - 100;
} else{
cloudeSize = 500;
cloudHeight = 250;
@ -70,6 +75,11 @@ import Layout from "../../layouts/Layout.astro";
animated9Scale = 0.55;
animated9Height = 20;
helpButtonHeight = customHeight / 2 + 40;
helpButtonWidth = customWidth / 1.32;
startButtonHeight = customHeight / 2 - 20;
startButtonWidth = customWidth / 1.32;
}
// let hideButton;
@ -208,11 +218,11 @@ import Layout from "../../layouts/Layout.astro";
let textX, textY;
firstLayer = this.add.image(customWidth / 2 - 10, customHeight / 2 + letterHeight, 'layer1').setScale(letterScale);
textX = isMobile ? customWidth / 4 : customWidth * 0.75;
textX = isMobile ? customWidth / 8 : customWidth * 0.75;
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Curve Around',{ font: '700 40px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();
// audioOneAudio.play();
firstLayer.setDepth(1);
firstLayer.setAlpha(0.5);
firstLayer.setInteractive({ draggable: true });
@ -294,6 +304,25 @@ import Layout from "../../layouts/Layout.astro";
graphics.lineTo(pointer.x, pointer.y);
graphics.strokePath();
});
let startButton = this.add.text(startButtonWidth, startButtonHeight, "Start", {
font: '900 24px Quicksand',
fill: '#05b3a4',
backgroundColor : '#7c4c23',
padding: {x: 20, y: 10},
shadow: {
offsetX : 2,
offsetY : 2,
color: '#000',
blur: 5,
fill: true
}
})
firstTextLayer.setVisible(false);
startButton.setInteractive().on('pointerdown', () => {
audioOneAudio.play();
firstTextLayer.setVisible(true);
})
}
function update() {

2
src/pages/small-letter/s.astro
View File

@ -206,7 +206,7 @@ import Layout from "../../layouts/Layout.astro";
firstLayer = this.add.image(customWidth / 2, customHeight / 2 + letterHeight, 'layer1').setScale(letterScale);
textX = isMobile ? customWidth / 13 : customWidth * 0.75;
textY = isMobile ? customHeight / 6.5 : customHeight / 2;
textY = isMobile ? customHeight / 5 : customHeight / 2.4;
const firstTextLayer = this.add.text(textX, textY, '1. Hook Around Snake',{ font: '700 35px quicksand', fill: '#05b3a4'});
const audioOneAudio = this.sound.add('audioOne');
audioOneAudio.play();