next work start from tick_phonics_v1

pull/30/head
Suvodip 2024-11-26 19:53:39 +05:30
parent 2d6e01e184
commit c999045fe4
13 changed files with 306 additions and 18 deletions

View File

@ -56,6 +56,9 @@ import Layout from '../../layouts/Layout.astro';
let cancelIconWidth;
let retryButton;
let blockMatches;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
@ -142,6 +145,10 @@ import Layout from '../../layouts/Layout.astro';
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/drag_drop_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
const {image1, image2, image3, image4, image5, image6, image7, image8} = data;
if(isMobile){
imageCustomWidth = "?width=80";
@ -239,6 +246,9 @@ import Layout from '../../layouts/Layout.astro';
for (var i = 0; i < 5; i++) {
this.load.image('logo'+i, '/assets/background.jpg');
}
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image("topMatch", "/assets/top_match.jpg");
this.load.image('topLogo', '/assets/top_logo.svg');
this.load.image("tickIcon", '/assets/svg/tick2.svg');
@ -410,7 +420,7 @@ import Layout from '../../layouts/Layout.astro';
// window.load
this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale();
this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
let soundButton = this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
const retryButton = this.add.image(displayW / resetIconWidth, 30, "resetIcon").setScale();
submitButton = this.add.image(displayW / tickIconWidth, 30, "tickIcon").setScale();
this.add.image(displayW / cancelIconWidth, 30, "cancelIcon").setScale();
@ -432,7 +442,19 @@ import Layout from '../../layouts/Layout.astro';
showAnimation();
})
let blocks1Width1, blocks1Width2, blocks1Width3, blocks1Width4, blocks1Width5, blocks1Width6, blocks1Width7, blocks1Width8;
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
soundButton.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
if(isMobile){
blocks1Width1 = 180;

View File

@ -59,6 +59,9 @@ const numberOfTimes = starNumberOfTime;
let resetIconWidth;
let tickIconWidth;
let cancelIconWidth;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
@ -168,6 +171,11 @@ const numberOfTimes = starNumberOfTime;
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
// console.log(audioData)
const {left_image1, left_image2, left_image3, left_image4, right_image1, right_image2, right_image3, right_image4} = data;
if(isMobile){
imageCustomWidth = "?width=100";
@ -264,6 +272,9 @@ const numberOfTimes = starNumberOfTime;
for (var i = 0; i < 5; i++) {
this.load.image('logo'+i, '/assets/background.jpg');
}
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image("topMatch", "/assets/top_match.jpg");
this.load.image('topLogo', '/assets/top_logo.svg');
this.load.image("tickIcon", '/assets/svg/tick2.svg');
@ -397,15 +408,8 @@ const numberOfTimes = starNumberOfTime;
graphics.strokePath();
submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', {font: '600 20px Quicksand', fill: '#FFFFFF', backgroundColor: '#004aad',padding: {left: 20,right: 20,top: 10,bottom: 10}}).setDepth(3).setVisible(false);
// submitButton = this.add.text(window.innerWidth / 2 - buttonWidth, window.innerHeight / 2 - buttonHeight, "Submit", {
// font: '600 30px Quicksand',
// fill: '#fff',
// backgroundColor: 'blue',
// padding: { x: 20, y: 10 },
// }).setDepth(1);
this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale();
this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
let soundButton = this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
const retryButton = this.add.image(displayW / resetIconWidth, 30, "resetIcon").setScale();
submitButton = this.add.image(displayW / tickIconWidth, 30, "tickIcon").setScale();
this.add.image(displayW / cancelIconWidth, 30, "cancelIcon").setScale();
@ -417,6 +421,20 @@ const numberOfTimes = starNumberOfTime;
// this.add.image(displayW * 0.9-33, 510, "border").setAlpha(1).setScale(1).setDepth(-1);
this.add.image(displayW * 0.9-32, 680, "target4");
// this.add.image(displayW * 0.9-33, 680, "border").setAlpha(1).setScale(1).setDepth(-1);
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
soundButton.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
const blocks = [
{

View File

@ -55,6 +55,9 @@ import Layout from '../../layouts/Layout.astro';
let resetIconWidth;
let tickIconWidth;
let cancelIconWidth;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
@ -147,6 +150,10 @@ import Layout from '../../layouts/Layout.astro';
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/drag_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
const {left_image1, left_image2, left_image3, left_image4, right_image1, right_image2, right_image3, right_image4} = data;
if(isMobile){
imageCustomWidth = "?width=100";
@ -243,6 +250,9 @@ import Layout from '../../layouts/Layout.astro';
for (var i = 0; i < 5; i++) {
this.load.image('logo'+i, '/assets/background.jpg');
}
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image("topMatch", "/assets/top_match.jpg");
this.load.image('topLogo', '/assets/top_logo.svg');
this.load.image("tick", '/assets/tick.png');
@ -372,7 +382,7 @@ import Layout from '../../layouts/Layout.astro';
// });
// };
this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale();
this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
let soundButton = this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
const retryButton = this.add.image(displayW / resetIconWidth, 30, "resetIcon").setScale();
submitButton = this.add.image(displayW / tickIconWidth, 30, "tickIcon").setScale();
this.add.image(displayW / cancelIconWidth, 30, "cancelIcon").setScale();
@ -385,6 +395,19 @@ import Layout from '../../layouts/Layout.astro';
this.add.image(displayW * 0.9-32, 680, "target4");
// this.add.image(displayW * 0.9-33, 680, "border").setAlpha(1).setScale(1).setDepth(-1);
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
soundButton.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
const graphics = this.add.graphics();
const x = 0; const y = 54;

View File

@ -56,6 +56,10 @@ import Layout from '../../layouts/Layout.astro';
let tickIconWidth;
let cancelIconWidth;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
muteIconWidth = 1.8;
@ -147,6 +151,11 @@ import Layout from '../../layouts/Layout.astro';
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
const {left_image1, left_image2, left_image3, left_image4, right_image1, right_image2, right_image3, right_image4} = data;
if(isMobile){
imageCustomWidth = "?width=100";
@ -243,6 +252,9 @@ import Layout from '../../layouts/Layout.astro';
for (var i = 0; i < 5; i++) {
this.load.image('logo'+i, '/assets/background.jpg');
}
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image("topMatch", "/assets/top_match.jpg");
this.load.image('topLogo', '/assets/top_logo.svg');
this.load.image("tick", '/assets/tick.png');
@ -372,7 +384,7 @@ import Layout from '../../layouts/Layout.astro';
// });
// };
this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale();
this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
let soundButton = this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
const retryButton = this.add.image(displayW / resetIconWidth, 30, "resetIcon").setScale();
submitButton = this.add.image(displayW / tickIconWidth, 30, "tickIcon").setScale();
this.add.image(displayW / cancelIconWidth, 30, "cancelIcon").setScale();
@ -384,7 +396,19 @@ import Layout from '../../layouts/Layout.astro';
// this.add.image(displayW * 0.9-33, 510, "border").setAlpha(1).setScale(1).setDepth(-1);
this.add.image(displayW * 0.9-32, 680, "target4");
// this.add.image(displayW * 0.9-33, 680, "border").setAlpha(1).setScale(1).setDepth(-1);
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
soundButton.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
const graphics = this.add.graphics();
const x = 0; const y = 54;

View File

@ -59,6 +59,9 @@ import Layout from '../../layouts/Layout.astro';
let blockMatches;
let retryButtonWidth;
let leftTargetZoneW;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
@ -179,6 +182,10 @@ import Layout from '../../layouts/Layout.astro';
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
const {image1, image2, image3, image4, image5, image6, image7, image8} = data;
if(isMobile){
imageCustomWidth = "?width=100";
@ -274,6 +281,9 @@ import Layout from '../../layouts/Layout.astro';
for (var i = 0; i < 5; i++) {
this.load.image('logo'+i, '/assets/background.jpg');
}
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image("topMatch", "/assets/top_match.jpg");
this.load.image('topLogo', '/assets/top_logo.svg');
this.load.image("tick", '/assets/tick.png');
@ -422,12 +432,25 @@ import Layout from '../../layouts/Layout.astro';
graphics.strokePath();
this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale();
this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
let soundButton = this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
const retryButton = this.add.image(displayW / resetIconWidth, 30, "resetIcon").setScale();
submitButton = this.add.image(displayW / tickIconWidth, 30, "tickIcon").setScale();
this.add.image(displayW / cancelIconWidth, 30, "cancelIcon").setScale();
submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', {font: '600 20px Quicksand', fill: '#FFFFFF', backgroundColor: '#004aad',padding: {left: 20,right: 20,top: 10,bottom: 10}}).setDepth(3).setVisible(false);
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
soundButton.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
// submitButton = this.add.text(window.innerWidth / 2 - buttonWidth, window.innerHeight / 2 - buttonHeight, "Submit", {
// font: '600 30px Quicksand',
// fill: '#fff',

View File

@ -59,6 +59,9 @@ import Layout from '../../layouts/Layout.astro';
let leftTargetZoneW;
let rightTargetZoneW;
let retryButtonWidth;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
@ -145,6 +148,10 @@ import Layout from '../../layouts/Layout.astro';
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v4/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
const {image1, image2, image3, image4, image5, image6, image7, image8} = data;
if(isMobile){imageCustomWidth = "?width=100";} else{imageCustomWidth = "?width=100";};
const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
@ -238,6 +245,9 @@ import Layout from '../../layouts/Layout.astro';
for (var i = 0; i < 5; i++) {
this.load.image('logo'+i, '/assets/background.jpg');
}
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image("topMatch", "/assets/top_match.jpg");
this.load.image('topLogo', '/assets/top_logo.svg');
// this.load.image("tick", '/assets/tick.png');
@ -249,8 +259,6 @@ import Layout from '../../layouts/Layout.astro';
// this.load.image("retryIcon", "/assets/svg/retry.svg")
this.load.image("border", '/assets/squar.png');
this.load.spritesheet("blocks1", assetsList.element5,{
frameWidth: 100,
frameHeight: 100,
@ -405,10 +413,23 @@ import Layout from '../../layouts/Layout.astro';
graphics.strokePath();
this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale();
this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
let soundButton = this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
const retryButton = this.add.image(displayW / resetIconWidth, 30, "resetIcon").setScale();
submitButton = this.add.image(displayW / tickIconWidth, 30, "tickIcon").setScale();
this.add.image(displayW / cancelIconWidth, 30, "cancelIcon").setScale();
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
soundButton.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
// submitButton = this.add.text(window.innerWidth / 2 - buttonWidth, window.innerHeight / 2 - buttonHeight, "Submit", {
// font: '600 30px Quicksand',
// fill: '#fff',

View File

@ -90,6 +90,10 @@ import Layout from '../../layouts/Layout.astro';
let scoreTotal = 0;
let maxScore;
let erase;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
muteIconWidth = 1.8;
@ -152,6 +156,10 @@ import Layout from '../../layouts/Layout.astro';
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/drawing_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
// console.log(data)
// colorList = data.colors;
const {image} = data;
@ -191,6 +199,9 @@ import Layout from '../../layouts/Layout.astro';
let colorList;
function preload() {
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image('outline', assetsList.image);
this.load.image('topLogo', '/assets/top_logo.svg');
this.load.image("tickIcon", '/assets/svg/tick2.svg');
@ -247,6 +258,19 @@ import Layout from '../../layouts/Layout.astro';
retryButton.setInteractive().on('pointerdown', () => {
graphics.clear();
});
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
muteIcon.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', {font: '600 20px Quicksand', fill: '#FFFFFF', backgroundColor: '#004aad',padding: {left: 20,right: 20,top: 10,bottom: 10}}).setDepth(3).setVisible(false);
// submitButton = this.add.text(window.innerWidth - submitWidth, window.innerHeight - submitHeight, "Submit", {
// font: '600 30px Quicksand',

View File

@ -90,6 +90,9 @@ import Layout from '../../layouts/Layout.astro';
let scoreTotal = 0;
let maxScore;
let erase;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
muteIconWidth = 1.8;
@ -153,6 +156,10 @@ import Layout from '../../layouts/Layout.astro';
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/drawing_writo/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
// console.log(data)
// colorList = data.colors;
const {image} = data;
@ -192,6 +199,9 @@ import Layout from '../../layouts/Layout.astro';
let colorList;
function preload() {
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image('outline', assetsList.image);
this.load.image('topLogo', '/assets/top_logo.svg');
this.load.image("tickIcon", '/assets/svg/tick2.svg');
@ -246,6 +256,19 @@ import Layout from '../../layouts/Layout.astro';
retryButton = this.add.image(customWidth / resetIconWidth, 30, "resetIcon");
submitButton = this.add.image(customWidth / tickIconWidth, 30, "tickIcon");
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
muteIcon.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
retryButton.setInteractive().on('pointerdown', () => {
graphics.clear();

View File

@ -143,6 +143,9 @@ import Layout from '../../layouts/Layout.astro';
let retryButton;
let maxScore;
let erase;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
muteIconWidth = 1.65;
@ -209,6 +212,10 @@ import Layout from '../../layouts/Layout.astro';
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
// console.log(data)
// colorList = data.colors;
const {image} = data;
@ -249,6 +256,9 @@ import Layout from '../../layouts/Layout.astro';
let colorList;
function preload() {
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image('outline', assetsList.image);
this.load.image('topLogo', '/assets/top_logo.svg');
this.load.image("tickIcon", '/assets/svg/tick2.svg');
@ -298,6 +308,19 @@ import Layout from '../../layouts/Layout.astro';
submitButton = this.add.image(customWidth / tickIconWidth, 30, "tickIcon");
galleryButton = this.add.image(customWidth / galleryIconWidth, 30, "galleryIcons");
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
muteIcon.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
retryButton.setInteractive().on('pointerdown', () => {
// window.location.reload();

View File

@ -98,6 +98,9 @@ import Layout from '../../layouts/Layout.astro';
let noticeHeight;
let maxScore;
let erase;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
muteIconWidth = 1.8;
@ -170,6 +173,10 @@ import Layout from '../../layouts/Layout.astro';
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
colorList = data.colors;
defaultColor = colorList[0];
const {image1, image2} = data;
@ -210,6 +217,9 @@ import Layout from '../../layouts/Layout.astro';
let colorList;
function preload() {
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image('image1', assetsList.image1);
this.load.image('image2', assetsList.image2);
this.load.image('topLogo', '/assets/top_logo.svg');
@ -297,6 +307,19 @@ import Layout from '../../layouts/Layout.astro';
retryButton = this.add.image(customWidth / resetIconWidth, 30, "resetIcon");
submitButton = this.add.image(customWidth / tickIconWidth, 30, "tickIcon");
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
muteIcon.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
retryButton.setInteractive().on('pointerdown', ()=>{
graphics.clear();
})

View File

@ -90,6 +90,9 @@ import Layout from '../../layouts/Layout.astro';
let cancelIconWidth;
let maxScore;
let erase;
let audioData;
let audioFileId = false;
let isPlaying = false;
if(isMobile){
topLogoWidth = 4.5;
@ -154,6 +157,10 @@ import Layout from '../../layouts/Layout.astro';
const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
.then(response => response.json())
.then(({data}) => {
if(data.instruction){
audioFileId = true;
}
audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
// console.log(data)
// colorList = data.colors;
const {image} = data;
@ -193,6 +200,9 @@ import Layout from '../../layouts/Layout.astro';
let colorList;
function preload() {
if(audioFileId === true){
this.load.audio('instructAudio', audioData)
}
this.load.image('outline', assetsList.image);
this.load.image('topLogo', '/assets/top_logo.svg');
this.load.image("tickIcon", '/assets/svg/tick2.svg');
@ -279,6 +289,19 @@ import Layout from '../../layouts/Layout.astro';
submitButton = this.add.image(customWidth / tickIconWidth, 30, "tickIcon");
// galleryButton = this.add.image(customWidth / galleryIconWidth, 30, "galleryIcons");
if(audioFileId === true){
let instructionAudio = this.sound.add('instructAudio')
muteIcon.setInteractive().on('pointerdown', () => {
if(isPlaying === false){
instructionAudio.play()
isPlaying = true
} else if(isPlaying === true) {
instructionAudio.stop();
isPlaying = false
}
})
}
retryButton.setInteractive().on('pointerdown', () => {
graphics.clear();
})

View File

@ -11,7 +11,7 @@ import Layout from "../../layouts/Layout.astro";
<img src="/assets/top_logo.svg" alt="" draggable="false" class="select-none">
</div>
<div class="flex flex-row space-x-1 pb-2">
<button><img src="/assets/svg/mute.svg" alt=""></button>
<button id="instructionButton"><img src="/assets/svg/mute.svg" alt=""></button>
<button><img src="/assets/svg/reset.svg" alt=""></button>
<button onclick="saveUserData();"><img src="/assets/svg/tick2.svg" alt=""></button>
<button><img src="/assets/svg/cancel.svg" alt=""></button>
@ -111,6 +111,14 @@ import Layout from "../../layouts/Layout.astro";
<img src="/assets/svg/clip-art2.svg" alt="Clip Art" class="clip-art">
</div>
</div>
<div>
<audio controls>
<source id="instrucAudio1" src="" type="audio/ogg">
<source id="instrucAudio2" src="" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</div>
</main>
</Layout>
<script is:inline>
@ -171,12 +179,15 @@ import Layout from "../../layouts/Layout.astro";
}
}, 100);
}
window.onload = () => {
fetch(`https://game-du.teachertrainingkolkata.in/items/tick_phonics_option_6/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
.then(res => res.json())
.then(data => {
gameData = data.data;
// console.log(gameData)
let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
document.getElementById('instrucAudio1').src = audioLink;
document.getElementById('instrucAudio2').src = audioLink;
console.log(audioLink)
document.getElementById("gameDescription").innerHTML = gameData.description;
if(gameData.label1){
document.getElementById("label1").innerHTML = gameData.label1;
@ -204,7 +215,9 @@ import Layout from "../../layouts/Layout.astro";
const imageId = `image${i}`;
document.getElementById(imageId).src = assetsURL + gameData[imageId];
}
});
}
function checkResult2(id) {
const checkbox = document.getElementById('a' + id.slice(-1));

View File

@ -0,0 +1,28 @@
<div>
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source id="audioFile" src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</div>
<script is:inline>
fetch('https://game-du.teachertrainingkolkata.in/items/game_drag/19')
.then(response => response.json())
.then(responseData => {
console.log(responseData); // Log the full response
// Check if the data contains the 'instruction' field
const instructionId = responseData.data.instruction;
// Assuming you need to build the full URL from this instruction ID
const audioUrl = `https://game-du.teachertrainingkolkata.in/assets/${instructionId}.mp3`;
console.log(audioUrl)
// Set the audio source dynamically
document.getElementById('audioFile').src = audioUrl;
})
.catch(error => {
console.error('Error fetching audio source:', error);
});
</script>