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

t1

pull/15/head
Suvodip 2024-06-17 18:41:11 +05:30
parent d82e6fcb9d
commit 5ed1ee1e6c
8 changed files with 219 additions and 210 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
public/saveGameData.js
View File

@ -3,23 +3,8 @@ const urlParams = new URLSearchParams(queryString);
const userId = urlParams.get('userid'); const userId = urlParams.get('userid');
const gameId = urlParams.get('id'); const gameId = urlParams.get('id');
let startTime = Date.now();
// Get the current time
let startTime = new Date();
// Simulate some process with a delay
setTimeout(() => {
// Get the current time again
let endTime = new Date();
// Calculate the difference in milliseconds
let timeDifference = endTime - startTime;
// Convert milliseconds to seconds
let timeDifferenceInSeconds = timeDifference / 1000;
console.log(`Time difference: ${timeDifferenceInSeconds} seconds`);
}, 3000); // 3-second delay
const url = window.location.href; const url = window.location.href;
const gameName = url.split('/'); const gameName = url.split('/');
@ -27,35 +12,52 @@ const gameType = gameName[3].split('?id=');
const gameVersion = gameType[0] + '-' + gameName[4]; const gameVersion = gameType[0] + '-' + gameName[4];
function submitUserData(drawingZone) { function submitUserData(drawingZone) {
const endTime = Date.now();
const timeDifference = endTime - startTime;
const timeDifferenceInSeconds = timeDifference / 1000;
// console.log(`Time difference: ${timeDifferenceInSeconds} seconds`);
let imageCode; let imageCode;
// console.log(drawingZone); let gameScore;
let scoreTotal=0;
if(scoreTotal){
gameScore = scoreTotal;
}else{
gameScore = 0;
}
// console.log('This is from main point', scoreTotal);
drawingZone.renderer.snapshot((image) => { drawingZone.renderer.snapshot((image) => {
submitButton.setVisible(true); if(gameType[0] == 'drawing'){
snapshotButton.setVisible(true); submitButton.setVisible(true);
customCursor.setVisible(true); snapshotButton.setVisible(true);
image.style.width = '160px'; customCursor.setVisible(true);
image.style.height = '120px'; image.style.width = '160px';
image.style.paddingLeft = '2px'; image.style.height = '120px';
document.body.appendChild(image); image.style.paddingLeft = '2px';
// Download the snapshot as an image document.body.appendChild(image);
const link = document.createElement('a'); // Download the snapshot as an image
link.href = image.src; const link = document.createElement('a');
link.download = 'my_drawing.png'; link.href = image.src;
link.click(); link.download = 'my_drawing.png';
document.body.removeChild(image); link.click();
imageCode = image.src; document.body.removeChild(image);
imageCode = image.src;
}
let userData = { let userData = {
'gameName': gameVersion, 'gameName': gameVersion,
'gameID': gameId, 'gameID': gameId,
'screenShot': imageCode, 'screenShot': imageCode,
'userId' : userId, 'userId' : userId,
'gameTime' : '10', 'gameTime' : timeDifferenceInSeconds,
'score' : '100' 'score' : scoreTotal
// 'starts': formattedDateTime, // 'starts': formattedDateTime,
// 'game_start' : gameStartTime, // 'game_start' : gameStartTime,
}; };
console.log(userData); console.log(userData);

57
src/pages/drag/dragdrop_phonics.astro
View File

@ -49,6 +49,7 @@ import Layout from '../../layouts/Layout.astro';
<script is:inline src="/assets/js/phaser_3.60.0.js"></script> <script is:inline src="/assets/js/phaser_3.60.0.js"></script>
</main> </main>
</Layout> </Layout>
<script src="/saveGameData.js" is:inline></script>
<script is:inline> <script is:inline>
const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
const drawingZone = { const drawingZone = {
@ -382,33 +383,33 @@ import Layout from '../../layouts/Layout.astro';
console.error('Error fetching initial data:', error); console.error('Error fetching initial data:', error);
}); });
const displayW = window.innerWidth; const displayW = window.innerWidth;
const URL = window.location.href; // const url = window.location.href;
const gameName = URL.split('/'); // const gameName = url.split('/');
let userData = { // let userData = {
'user': 'drawing@beanstalkedu.com', // 'user': 'drawing@beanstalkedu.com',
'game_name': gameName[3], // 'game_name': gameName[3],
'starts': formattedDateTime, // 'starts': formattedDateTime,
// 'game_start' : gameStartTime, // // 'game_start' : gameStartTime,
}; // };
function submitUserData() { // function submitUserData() {
fetch(`https://2016.dev2-cs.siliconpin.com/save/`, { // fetch(`https://2016.dev2-cs.siliconpin.com/save/`, {
method: 'POST', // method: 'POST',
headers: { // headers: {
'Content-Type' : 'application/json' // 'Content-Type' : 'application/json'
}, // },
body: JSON.stringify(userData) // body: JSON.stringify(userData)
}) // })
.then(response => { // .then(response => {
if(response.ok){ // if(response.ok){
// console.log('Data Saved', response) // // console.log('Data Saved', response)
} else{ // } else{
// console.log('Something Wrong', response) // // console.log('Something Wrong', response)
} // }
}) // })
.catch(error => { // .catch(error => {
console.error('An error occured', error) // console.error('An error occured', error)
}); // });
}; // };
// window.load // window.load
this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale(); this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale();
@ -435,7 +436,7 @@ import Layout from '../../layouts/Layout.astro';
submitNotic.setVisible(true); submitNotic.setVisible(true);
// window.location.reload(); // window.location.reload();
// windowLoad(); // windowLoad();
submitUserData(); submitUserData(this);
}) })
const blocks = [ const blocks = [

57
src/pages/drag/index.astro
View File

@ -49,6 +49,7 @@ import Layout from '../../layouts/Layout.astro';
<script is:inline src="/assets/js/phaser_3.60.0.js"></script> <script is:inline src="/assets/js/phaser_3.60.0.js"></script>
</main> </main>
</Layout> </Layout>
<script src="/saveGameData.js" is:inline></script>
<script is:inline> <script is:inline>
const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
const drawingZone = { const drawingZone = {
@ -353,33 +354,33 @@ import Layout from '../../layouts/Layout.astro';
console.error('Error fetching initial data:', error); console.error('Error fetching initial data:', error);
}); });
const displayW = window.innerWidth; const displayW = window.innerWidth;
const URL = window.location.href; // const URL = window.location.href;
const gameName = URL.split('/'); // const gameName = URL.split('/');
let userData = { // let userData = {
'user': 'drawing@beanstalkedu.com', // 'user': 'drawing@beanstalkedu.com',
'game_name': gameName[3], // 'game_name': gameName[3],
'starts': formattedDateTime, // 'starts': formattedDateTime,
// 'game_start' : gameStartTime, // // 'game_start' : gameStartTime,
}; // };
function submitUserData() { // function submitUserData() {
fetch(`https://2016.dev2-cs.siliconpin.com/save/`, { // fetch(`https://2016.dev2-cs.siliconpin.com/save/`, {
method: 'POST', // method: 'POST',
headers: { // headers: {
'Content-Type' : 'application/json' // 'Content-Type' : 'application/json'
}, // },
body: JSON.stringify(userData) // body: JSON.stringify(userData)
}) // })
.then(response => { // .then(response => {
if(response.ok){ // if(response.ok){
// console.log('Data Saved', response) // // console.log('Data Saved', response)
} else{ // } else{
// console.log('Something Wrong', response) // // console.log('Something Wrong', response)
} // }
}) // })
.catch(error => { // .catch(error => {
console.error('An error occured', error) // console.error('An error occured', error)
}); // });
}; // };
// window.load // window.load
const graphics = this.add.graphics(); const graphics = this.add.graphics();
@ -449,7 +450,7 @@ import Layout from '../../layouts/Layout.astro';
submitNotic.setVisible(true); submitNotic.setVisible(true);
// window.location.reload(); // window.location.reload();
// windowLoad(); // windowLoad();
submitUserData(); submitUserData(this);
}); });
const droppedBlocks = []; const droppedBlocks = [];

57
src/pages/drag/match_phonics.astro
View File

@ -49,6 +49,7 @@ import Layout from '../../layouts/Layout.astro';
<script is:inline src="/assets/js/phaser_3.60.0.js"></script> <script is:inline src="/assets/js/phaser_3.60.0.js"></script>
</main> </main>
</Layout> </Layout>
<script src="/saveGameData.js" is:inline></script>
<script is:inline> <script is:inline>
const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
const drawingZone = { const drawingZone = {
@ -337,33 +338,33 @@ import Layout from '../../layouts/Layout.astro';
console.error('Error fetching initial data:', error); console.error('Error fetching initial data:', error);
}); });
const displayW = window.innerWidth; const displayW = window.innerWidth;
const URL = window.location.href; // const url = window.location.href;
const gameName = URL.split('/'); // const gameName = url.split('/');
let userData = { // let userData = {
'user': 'drawing@beanstalkedu.com', // 'user': 'drawing@beanstalkedu.com',
'game_name': gameName[3], // 'game_name': gameName[3],
'starts': formattedDateTime, // 'starts': formattedDateTime,
// 'game_start' : gameStartTime, // // 'game_start' : gameStartTime,
}; // };
function submitUserData() { // function submitUserData() {
fetch(`https://2016.dev2-cs.siliconpin.com/save/`, { // fetch(`https://2016.dev2-cs.siliconpin.com/save/`, {
method: 'POST', // method: 'POST',
headers: { // headers: {
'Content-Type' : 'application/json' // 'Content-Type' : 'application/json'
}, // },
body: JSON.stringify(userData) // body: JSON.stringify(userData)
}) // })
.then(response => { // .then(response => {
if(response.ok){ // if(response.ok){
// console.log('Data Saved', response) // // console.log('Data Saved', response)
} else{ // } else{
// console.log('Something Wrong', response) // // console.log('Something Wrong', response)
} // }
}) // })
.catch(error => { // .catch(error => {
console.error('An error occured', error) // console.error('An error occured', error)
}); // });
}; // };
this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale(); this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale();
this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale(); this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
const retryButton = this.add.image(displayW / resetIconWidth, 30, "resetIcon").setScale(); const retryButton = this.add.image(displayW / resetIconWidth, 30, "resetIcon").setScale();
@ -406,7 +407,7 @@ import Layout from '../../layouts/Layout.astro';
submitNotic.setVisible(true); submitNotic.setVisible(true);
// window.location.reload(); // window.location.reload();
// windowLoad(); // windowLoad();
submitUserData(); submitUserData(this);
}) })
const blocks = [ const blocks = [

57
src/pages/drag/v2.astro
View File

@ -49,6 +49,7 @@ import Layout from '../../layouts/Layout.astro';
<script is:inline src="/assets/js/phaser_3.60.0.js"></script> <script is:inline src="/assets/js/phaser_3.60.0.js"></script>
</main> </main>
</Layout> </Layout>
<script src="/saveGameData.js" is:inline></script>
<script is:inline> <script is:inline>
const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
const drawingZone = { const drawingZone = {
@ -337,33 +338,33 @@ import Layout from '../../layouts/Layout.astro';
console.error('Error fetching initial data:', error); console.error('Error fetching initial data:', error);
}); });
const displayW = window.innerWidth; const displayW = window.innerWidth;
const URL = window.location.href; // const url = window.location.href;
const gameName = URL.split('/'); // const gameName = URL.split('/');
let userData = { // let userData = {
'user': 'drawing@beanstalkedu.com', // 'user': 'drawing@beanstalkedu.com',
'game_name': gameName[3], // 'game_name': gameName[3],
'starts': formattedDateTime, // 'starts': formattedDateTime,
// 'game_start' : gameStartTime, // // 'game_start' : gameStartTime,
}; // };
function submitUserData() { // function submitUserData() {
fetch(`https://2016.dev2-cs.siliconpin.com/save/`, { // fetch(`https://2016.dev2-cs.siliconpin.com/save/`, {
method: 'POST', // method: 'POST',
headers: { // headers: {
'Content-Type' : 'application/json' // 'Content-Type' : 'application/json'
}, // },
body: JSON.stringify(userData) // body: JSON.stringify(userData)
}) // })
.then(response => { // .then(response => {
if(response.ok){ // if(response.ok){
// console.log('Data Saved', response) // // console.log('Data Saved', response)
} else{ // } else{
// console.log('Something Wrong', response) // // console.log('Something Wrong', response)
} // }
}) // })
.catch(error => { // .catch(error => {
console.error('An error occured', error) // console.error('An error occured', error)
}); // });
}; // };
this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale(); this.add.image(displayW / topLogoWidth, 30, "topLogo").setScale();
this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale(); this.add.image(displayW / muteIconWidth, 30, "muteIcon").setScale();
const retryButton = this.add.image(displayW / resetIconWidth, 30, "resetIcon").setScale(); const retryButton = this.add.image(displayW / resetIconWidth, 30, "resetIcon").setScale();
@ -406,7 +407,7 @@ import Layout from '../../layouts/Layout.astro';
submitNotic.setVisible(true); submitNotic.setVisible(true);
// window.location.reload(); // window.location.reload();
// windowLoad(); // windowLoad();
submitUserData(); submitUserData(this);
}) })
const blocks = [ const blocks = [

57
src/pages/drag/v3.astro
View File

@ -49,6 +49,7 @@ import Layout from '../../layouts/Layout.astro';
<script is:inline src="/assets/js/phaser_3.60.0.js"></script> <script is:inline src="/assets/js/phaser_3.60.0.js"></script>
</main> </main>
</Layout> </Layout>
<script src="/saveGameData.js" is:inline></script>
<script is:inline> <script is:inline>
const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
const drawingZone = { const drawingZone = {
@ -370,33 +371,33 @@ import Layout from '../../layouts/Layout.astro';
console.error('Error fetching initial data:', error); console.error('Error fetching initial data:', error);
}); });
const displayW = window.innerWidth; const displayW = window.innerWidth;
const URL = window.location.href; // const URL = window.location.href;
const gameName = URL.split('/'); // const gameName = URL.split('/');
let userData = { // let userData = {
'user': 'drawing@beanstalkedu.com', // 'user': 'drawing@beanstalkedu.com',
'game_name': gameName[3], // 'game_name': gameName[3],
'starts': formattedDateTime, // 'starts': formattedDateTime,
// 'game_start' : gameStartTime, // // 'game_start' : gameStartTime,
}; // };
function submitUserData() { // function submitUserData() {
fetch(`https://2016.dev2-cs.siliconpin.com/save/`, { // fetch(`https://2016.dev2-cs.siliconpin.com/save/`, {
method: 'POST', // method: 'POST',
headers: { // headers: {
'Content-Type' : 'application/json' // 'Content-Type' : 'application/json'
}, // },
body: JSON.stringify(userData) // body: JSON.stringify(userData)
}) // })
.then(response => { // .then(response => {
if(response.ok){ // if(response.ok){
// console.log('Data Saved', response) // // console.log('Data Saved', response)
} else{ // } else{
// console.log('Something Wrong', response) // // console.log('Something Wrong', response)
} // }
}) // })
.catch(error => { // .catch(error => {
console.error('An error occured', error) // console.error('An error occured', error)
}); // });
}; // };
// window.load // window.load
const graphics = this.add.graphics(); const graphics = this.add.graphics();
@ -431,7 +432,7 @@ import Layout from '../../layouts/Layout.astro';
submitNotic.setVisible(true); submitNotic.setVisible(true);
// window.location.reload(); // window.location.reload();
// windowLoad(); // windowLoad();
submitUserData(); submitUserData(this);
}) })

57
src/pages/drag/v4.astro
View File

@ -49,6 +49,7 @@ import Layout from '../../layouts/Layout.astro';
<script is:inline src="/assets/js/phaser_3.60.0.js"></script> <script is:inline src="/assets/js/phaser_3.60.0.js"></script>
</main> </main>
</Layout> </Layout>
<script src="/saveGameData.js" is:inline></script>
<script is:inline> <script is:inline>
const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
const drawingZone = { const drawingZone = {
@ -358,33 +359,33 @@ import Layout from '../../layouts/Layout.astro';
console.error('Error fetching initial data:', error); console.error('Error fetching initial data:', error);
}); });
const displayW = window.innerWidth; const displayW = window.innerWidth;
const URL = window.location.href; // const URL = window.location.href;
const gameName = URL.split('/'); // const gameName = URL.split('/');
let userData = { // let userData = {
'user': 'drawing@beanstalkedu.com', // 'user': 'drawing@beanstalkedu.com',
'game_name': gameName[3], // 'game_name': gameName[3],
'starts': formattedDateTime, // 'starts': formattedDateTime,
// 'game_start' : gameStartTime, // // 'game_start' : gameStartTime,
}; // };
function submitUserData() { // function submitUserData() {
fetch(`https://2016.dev2-cs.siliconpin.com/save/`, { // fetch(`https://2016.dev2-cs.siliconpin.com/save/`, {
method: 'POST', // method: 'POST',
headers: { // headers: {
'Content-Type' : 'application/json' // 'Content-Type' : 'application/json'
}, // },
body: JSON.stringify(userData) // body: JSON.stringify(userData)
}) // })
.then(response => { // .then(response => {
if(response.ok){ // if(response.ok){
// console.log('Data Saved', response) // // console.log('Data Saved', response)
} else{ // } else{
// console.log('Something Wrong', response) // // console.log('Something Wrong', response)
} // }
}) // })
.catch(error => { // .catch(error => {
console.error('An error occured', error) // console.error('An error occured', error)
}); // });
}; // };
// window.load // window.load
const graphics = this.add.graphics(); const graphics = this.add.graphics();
@ -419,7 +420,7 @@ import Layout from '../../layouts/Layout.astro';
submitNotic.setVisible(true); submitNotic.setVisible(true);
// window.location.reload(); // window.location.reload();
// windowLoad(); // windowLoad();
submitUserData(); submitUserData(this);
}) })
// this.add.image(displayW / 2, displayH / 2, "bg").setScale(2.4); // this.add.image(displayW / 2, displayH / 2, "bg").setScale(2.4);

7
src/pages/drawing/index.astro
View File

@ -30,6 +30,7 @@ import Layout from '../../layouts/Layout.astro';
let submitButton; let submitButton;
let formattedDateTime; let formattedDateTime;
let shortUniqueID; let shortUniqueID;
let scoreTotal = 0;
if(isMobile){ if(isMobile){
topLogoWidth = 5; topLogoWidth = 5;
muteIconWidth = 2; muteIconWidth = 2;
@ -512,9 +513,9 @@ import Layout from '../../layouts/Layout.astro';
}); });
} }
const url = window.location.href; // const url = window.location.href;
const gameName = url.split('/'); // const gameName = url.split('/');
const gameType = gameName[3].split('?id='); // const gameType = gameName[3].split('?id=');
// function submitUserData(drawingZone) { // function submitUserData(drawingZone) {
// let imageCode; // let imageCode;
// // console.log(drawingZone); // // console.log(drawingZone);