diff --git a/public/saveGameData.js b/public/saveGameData.js index 849ce7b..7249ffa 100644 --- a/public/saveGameData.js +++ b/public/saveGameData.js @@ -2,6 +2,8 @@ const queryString = window.location.search; const urlParams = new URLSearchParams(queryString); const userId = urlParams.get('userId'); let gameId; +let submitNotic; + console.log(userId); let startTime = Date.now(); @@ -50,10 +52,10 @@ function submitUserData(drawingZone) { image.style.paddingLeft = '2px'; document.body.appendChild(image); // Download the snapshot as an image - const link = document.createElement('a'); - link.href = image.src; - link.download = 'my_drawing.png'; - link.click(); + // const link = document.createElement('a'); + // link.href = image.src; + // link.download = 'my_drawing.png'; + // link.click(); document.body.removeChild(image); imageCode = image.src; }else if( gameType[0] == "guided-tracing"){ @@ -65,10 +67,10 @@ function submitUserData(drawingZone) { image.style.paddingLeft = '2px'; document.body.appendChild(image); // Download the snapshot as an image - const link = document.createElement('a'); - link.href = image.src; - link.download = `guided-tracing-${gameId}.png`; - link.click(); + // const link = document.createElement('a'); + // link.href = image.src; + // link.download = `guided-tracing-${gameId}.png`; + // link.click(); document.body.removeChild(image); imageCode = image.src; } @@ -85,7 +87,7 @@ function submitUserData(drawingZone) { // 'starts': formattedDateTime, // 'game_start' : gameStartTime, }; - // console.log(userData); + console.log(userData); fetch(`https://phaser-game-api.s38.siliconpin.com/save-data`, { method: 'POST', @@ -96,9 +98,12 @@ function submitUserData(drawingZone) { }) .then(response => { if(response.ok){ - // console.log('Data Saved', response) + console.log('Data Saved', response.status) + if(response.status == 200){ + submitNotic.setVisible(true); + } } else{ - // console.log('Something Wrong', response) + // console.log('Something Wrong', response) } }) .catch(error => { diff --git a/src/pages/drag/dragdrop_phonics.astro b/src/pages/drag/dragdrop_phonics.astro index be61ef9..a728b95 100644 --- a/src/pages/drag/dragdrop_phonics.astro +++ b/src/pages/drag/dragdrop_phonics.astro @@ -430,11 +430,7 @@ import Layout from '../../layouts/Layout.astro'; submitButton = this.add.image(displayW / tickIconWidth, 30, "tickIcon").setScale(); this.add.image(displayW / cancelIconWidth, 30, "cancelIcon").setScale(); - const submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { - font: '600 20px Quicksand', - fill: 'blue' - }).setDepth(1); - submitNotic.setVisible(false); + submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { font: '600 20px Quicksand', fill: 'blue'}).setDepth(1).setVisible(false); // submitButton = this.add.text(window.innerWidth / 2 - buttonWidth, window.innerHeight / 2 - buttonHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -445,7 +441,6 @@ import Layout from '../../layouts/Layout.astro'; submitButton.setInteractive().on('pointerdown', () => { // console.log('Clicked'); // submitButton.setVisible(false); - submitNotic.setVisible(true); // window.location.reload(); // windowLoad(); submitUserData(this); diff --git a/src/pages/drag/index.astro b/src/pages/drag/index.astro index 4536e0f..5605c20 100644 --- a/src/pages/drag/index.astro +++ b/src/pages/drag/index.astro @@ -403,11 +403,8 @@ import Layout from '../../layouts/Layout.astro'; graphics.moveTo(x, y); graphics.lineTo(x + lineWidth, y); graphics.strokePath(); - const submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { - font: '600 20px Quicksand', - fill: 'blue' - }).setDepth(1); - submitNotic.setVisible(false); + submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { font: '600 20px Quicksand', fill: 'blue'}).setDepth(1).setVisible(false); + // submitButton = this.add.text(window.innerWidth / 2 - buttonWidth, window.innerHeight / 2 - buttonHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -458,7 +455,6 @@ import Layout from '../../layouts/Layout.astro'; // submitButton.setVisible(false); submitButton.setInteractive().on('pointerdown', () => { // submitButton.setVisible(false); - submitNotic.setVisible(true); // window.location.reload(); // windowLoad(); submitUserData(this); @@ -567,23 +563,23 @@ import Layout from '../../layouts/Layout.astro'; resultView.setVisible(true); } }; - const footerBorder = this.add.graphics(); - const footerX = 0; const footerY = window.innerHeight / 1.07; - const footerLineWidth = window.innerWidth; - footerBorder.lineStyle(1, 0x0348A8); - footerBorder.setAlpha(0.2); - footerBorder.beginPath(); - footerBorder.moveTo(footerX, footerY); - footerBorder.lineTo(footerX + footerLineWidth, footerY); - footerBorder.strokePath(); - let textSize; - if(isMobile){ - textSize = 10; - }else{ - textSize = 20; - } - this.add.text(displayW / 20, window.innerHeight / 1.05, 'All rights reserved. Copyright@akademy.interakto2024', {font: ` ${textSize}px Quicksand`, fill: '#002C6970',}); - this.add.text(displayW / 1.36, window.innerHeight / 1.05, 'Privacy • Terms of use', {font: ` ${textSize}px Quicksand`, fill: '#002C6970',}); + // const footerBorder = this.add.graphics(); + // const footerX = 0; const footerY = window.innerHeight / 1.07; + // const footerLineWidth = window.innerWidth; + // footerBorder.lineStyle(1, 0x0348A8); + // footerBorder.setAlpha(0.2); + // footerBorder.beginPath(); + // footerBorder.moveTo(footerX, footerY); + // footerBorder.lineTo(footerX + footerLineWidth, footerY); + // footerBorder.strokePath(); + // let textSize; + // if(isMobile){ + // textSize = 10; + // }else{ + // textSize = 20; + // } + // this.add.text(displayW / 20, window.innerHeight / 1.05, 'All rights reserved. Copyright@akademy.interakto2024', {font: ` ${textSize}px Quicksand`, fill: '#002C6970',}); + // this.add.text(displayW / 1.36, window.innerHeight / 1.05, 'Privacy • Terms of use', {font: ` ${textSize}px Quicksand`, fill: '#002C6970',}); } } // let hideButton = this.add.text(helpButtonWidth, helpButtonHeight, "Let`s Do", { diff --git a/src/pages/drag/match_phonics.astro b/src/pages/drag/match_phonics.astro index ccb429c..552e022 100644 --- a/src/pages/drag/match_phonics.astro +++ b/src/pages/drag/match_phonics.astro @@ -409,11 +409,8 @@ import Layout from '../../layouts/Layout.astro'; graphics.moveTo(x, y); graphics.lineTo(x + lineWidth, y); graphics.strokePath(); - const submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { - font: '600 20px Quicksand', - fill: 'blue' - }).setDepth(1); - submitNotic.setVisible(false); + submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { font: '600 20px Quicksand', fill: 'blue'}).setDepth(1).setVisible(false); + // submitButton = this.add.text(window.innerWidth / 2 - buttonWidth, window.innerHeight / 2 - buttonHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -424,7 +421,6 @@ import Layout from '../../layouts/Layout.astro'; submitButton.setInteractive().on('pointerdown', () => { // console.log('Clicked'); // submitButton.setVisible(false); - submitNotic.setVisible(true); // window.location.reload(); // windowLoad(); submitUserData(this); diff --git a/src/pages/drag/v2.astro b/src/pages/drag/v2.astro index 3f6d196..b727408 100644 --- a/src/pages/drag/v2.astro +++ b/src/pages/drag/v2.astro @@ -409,11 +409,7 @@ import Layout from '../../layouts/Layout.astro'; graphics.moveTo(x, y); graphics.lineTo(x + lineWidth, y); graphics.strokePath(); - const submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { - font: '600 20px Quicksand', - fill: 'blue' - }).setDepth(1); - submitNotic.setVisible(false); + submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { font: '600 20px Quicksand', fill: 'blue'}).setDepth(1).setVisible(false); // submitButton = this.add.text(window.innerWidth / 2 - buttonWidth, window.innerHeight / 2 - buttonHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -424,7 +420,6 @@ import Layout from '../../layouts/Layout.astro'; submitButton.setInteractive().on('pointerdown', () => { // console.log('Clicked'); // submitButton.setVisible(false); - submitNotic.setVisible(true); // window.location.reload(); // windowLoad(); submitUserData(this); diff --git a/src/pages/drag/v3.astro b/src/pages/drag/v3.astro index 4d21789..d28d4e2 100644 --- a/src/pages/drag/v3.astro +++ b/src/pages/drag/v3.astro @@ -439,11 +439,7 @@ import Layout from '../../layouts/Layout.astro'; submitButton = this.add.image(displayW / tickIconWidth, 30, "tickIcon").setScale(); this.add.image(displayW / cancelIconWidth, 30, "cancelIcon").setScale(); - const submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { - font: '600 20px Quicksand', - fill: 'blue' - }).setDepth(1); - submitNotic.setVisible(false); + submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { font: '600 20px Quicksand', fill: 'blue'}).setDepth(1).setVisible(false); // submitButton = this.add.text(window.innerWidth / 2 - buttonWidth, window.innerHeight / 2 - buttonHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -452,7 +448,6 @@ import Layout from '../../layouts/Layout.astro'; // }).setDepth(1); submitButton.setInteractive().on('pointerdown', () => { // console.log('Clicked'); - submitNotic.setVisible(true); // window.location.reload(); // windowLoad(); submitUserData(this); diff --git a/src/pages/drag/v4.astro b/src/pages/drag/v4.astro index bba10ed..ceeca04 100644 --- a/src/pages/drag/v4.astro +++ b/src/pages/drag/v4.astro @@ -424,12 +424,6 @@ import Layout from '../../layouts/Layout.astro'; 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(); - - const submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { - font: '600 20px Quicksand', - fill: 'blue' - }).setDepth(1); - submitNotic.setVisible(false); // submitButton = this.add.text(window.innerWidth / 2 - buttonWidth, window.innerHeight / 2 - buttonHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -438,7 +432,6 @@ import Layout from '../../layouts/Layout.astro'; // }).setDepth(1); submitButton.setInteractive().on('pointerdown', () => { // console.log('Clicked'); - submitNotic.setVisible(true); // window.location.reload(); // windowLoad(); submitUserData(this); diff --git a/src/pages/drawing/drawing_phonics.astro b/src/pages/drawing/drawing_phonics.astro index f039eb2..19d35f1 100644 --- a/src/pages/drawing/drawing_phonics.astro +++ b/src/pages/drawing/drawing_phonics.astro @@ -184,11 +184,7 @@ import Layout from '../../layouts/Layout.astro'; retryButton.setInteractive().on('pointerdown', () => { window.location.reload(); }); - const submitNotic = this.add.text(window.innerWidth * 0.5 - noticeWidth, window.innerHeight * 0.85 - noticeHeight, 'Submitted Successfully', { - font: '600 20px Quicksand', - fill: 'blue' - }).setDepth(1); - submitNotic.setVisible(false); + submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { font: '600 20px Quicksand', fill: 'blue'}).setDepth(1).setVisible(false); // submitButton = this.add.text(window.innerWidth - submitWidth, window.innerHeight - submitHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -197,8 +193,6 @@ import Layout from '../../layouts/Layout.astro'; // }); submitButton.setVisible(true); submitButton.setInteractive().on('pointerdown', () => { - submitNotic.setVisible(true); - submitNotic.setVisible(false); // windowLoad(); submitUserData(this); }); diff --git a/src/pages/drawing/drawing_writo.astro b/src/pages/drawing/drawing_writo.astro index ddae878..1460efb 100644 --- a/src/pages/drawing/drawing_writo.astro +++ b/src/pages/drawing/drawing_writo.astro @@ -184,11 +184,8 @@ import Layout from '../../layouts/Layout.astro'; retryButton.setInteractive().on('pointerdown', () => { window.location.reload(); }); - const submitNotic = this.add.text(window.innerWidth * 0.5 - noticeWidth, window.innerHeight * 0.85 - noticeHeight, 'Submitted Successfully', { - font: '600 20px Quicksand', - fill: 'blue' - }).setDepth(1); - submitNotic.setVisible(false); + submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { font: '600 20px Quicksand', fill: 'blue'}).setDepth(1).setVisible(false); + // submitButton = this.add.text(window.innerWidth - submitWidth, window.innerHeight - submitHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -197,8 +194,6 @@ import Layout from '../../layouts/Layout.astro'; // }); submitButton.setVisible(true); submitButton.setInteractive().on('pointerdown', () => { - submitNotic.setVisible(true); - submitNotic.setVisible(false); // windowLoad(); submitUserData(this); }); diff --git a/src/pages/drawing/index.astro b/src/pages/drawing/index.astro index 71c58b6..76a7c92 100644 --- a/src/pages/drawing/index.astro +++ b/src/pages/drawing/index.astro @@ -33,6 +33,8 @@ import Layout from '../../layouts/Layout.astro'; let scoreTotal = 0; let noticeWidth; let noticeHeight; + let muteIcon; + let retryButton; if(isMobile){ topLogoWidth = 4.5; muteIconWidth = 1.8; @@ -119,6 +121,7 @@ import Layout from '../../layouts/Layout.astro'; }; const game = new Phaser.Game(config); }) + .catch(error => { console.error('Error fetching initial data:', error); }); @@ -178,19 +181,15 @@ import Layout from '../../layouts/Layout.astro'; borderBottom.strokePath(); this.add.image(customWidth / topLogoWidth, 30, "topLogo"); - this.add.image(customWidth / muteIconWidth, 30, "muteIcon"); - const retryButton = this.add.image(customWidth / resetIconWidth, 30, "resetIcon"); + muteIcon = this.add.image(customWidth / muteIconWidth, 30, "muteIcon"); + retryButton = this.add.image(customWidth / resetIconWidth, 30, "resetIcon"); submitButton = this.add.image(customWidth / tickIconWidth, 30, "tickIcon"); retryButton.setInteractive().on('pointerdown', () => { window.location.reload(); }); - const submitNotic = this.add.text(window.innerWidth * 0.5 - noticeWidth, window.innerHeight * 0.85 - noticeHeight, 'Submitted Successfully', { - font: '600 20px Quicksand', - fill: 'blue' - }).setDepth(1); - submitNotic.setVisible(false); + submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { font: '600 20px Quicksand', fill: 'blue'}).setDepth(1).setVisible(false); // submitButton = this.add.text(window.innerWidth - submitWidth, window.innerHeight - submitHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -199,8 +198,6 @@ import Layout from '../../layouts/Layout.astro'; // }); submitButton.setVisible(true); submitButton.setInteractive().on('pointerdown', () => { - submitNotic.setVisible(true); - submitNotic.setVisible(false); // windowLoad(); submitUserData(this); }); @@ -660,10 +657,17 @@ import Layout from '../../layouts/Layout.astro'; submitButton.setVisible(false); snapshotButton.setVisible(false); customCursor.setVisible(false); + muteIcon.setVisible(false); + retryButton.setVisible(false); + + drawingZone.renderer.snapshot((image) => { submitButton.setVisible(true); snapshotButton.setVisible(true); customCursor.setVisible(true); + muteIcon.setVisible(true); + retryButton.setVisible(true); + image.style.width = '160px'; image.style.height = '120px'; image.style.paddingLeft = '2px'; diff --git a/src/pages/drawing/v2.astro b/src/pages/drawing/v2.astro index 63ef898..51561f7 100644 --- a/src/pages/drawing/v2.astro +++ b/src/pages/drawing/v2.astro @@ -236,11 +236,7 @@ import Layout from '../../layouts/Layout.astro'; retryButton.setInteractive().on('pointerdown', ()=>{ window.location.reload(); }) - const submitNotic = this.add.text(window.innerWidth * 0.5 - noticeWidth, window.innerHeight * 0.85 - noticeHeight, 'Submitted Successfully', { - font: '600 20px Quicksand', - fill: 'blue' - }).setDepth(1); - submitNotic.setVisible(false); + submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { font: '600 20px Quicksand', fill: 'blue'}).setDepth(1).setVisible(false); // submitButton = this.add.text(window.innerWidth - submitWidth, window.innerHeight - submitHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -249,7 +245,6 @@ import Layout from '../../layouts/Layout.astro'; // }); submitButton.setInteractive().on('pointerdown', () => { // console.log('Clicked'); - submitNotic.setVisible(true); // windowLoad(); // submitUserData(); submitUserData(this); diff --git a/src/pages/drawing/v3.astro b/src/pages/drawing/v3.astro index 75600aa..d1bea41 100644 --- a/src/pages/drawing/v3.astro +++ b/src/pages/drawing/v3.astro @@ -214,8 +214,7 @@ import Layout from '../../layouts/Layout.astro'; retryButton.setInteractive().on('pointerdown', () => { window.location.reload(); }) - const submitNotic = this.add.text(window.innerWidth * 0.5 - noticeWidth, window.innerHeight * 0.85 - noticeHeight, 'Submitted Successfully', {font: '600 20px Quicksand', fill: 'blue'}).setDepth(1); - submitNotic.setVisible(false); + submitNotic = this.add.text(window.innerWidth / 2 - noticeWidth, window.innerHeight / 2 - noticeHeight, 'Submitted Successfully', { font: '600 20px Quicksand', fill: 'blue'}).setDepth(1).setVisible(false); // submitButton = this.add.text(window.innerWidth - submitWidth, window.innerHeight - submitHeight, "Submit", { // font: '600 30px Quicksand', // fill: '#fff', @@ -226,7 +225,6 @@ import Layout from '../../layouts/Layout.astro'; submitButton.setInteractive().on('pointerdown', () => { // console.log('Clicked'); // submitButton.setVisible(false); - submitNotic.setVisible(true); // windowLoad(); submitUserData(this); })