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

work on score calculations

pull/2/head
dev sp 2024-01-17 08:45:14 +00:00
parent 85924a90e6
commit 62565a5bf2
4 changed files with 61 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -96,7 +96,7 @@ import Layout from '../../layouts/Layout.astro';
return result;
};
shortUniqueID = generateShortUniqueID(10); // Change 10 to the desired length
let blockMatches;
const targetZones = [
{
x: 0,
@ -123,24 +123,24 @@ import Layout from '../../layouts/Layout.astro';
block: null,
},
];
const blockMatches = [
{
blockName: "blocks1",
targetName: "target1",
},
{
blockName: "blocks2",
targetName: "target2",
},
{
blockName: "blocks3",
targetName: "target3",
},
{
blockName: "blocks4",
targetName: "target4",
},
];
// const blockMatches = [
// {
// blockName: "blocks1",
// targetName: "target1",
// },
// {
// blockName: "blocks2",
// targetName: "target2",
// },
// {
// blockName: "blocks3",
// targetName: "target3",
// },
// {
// blockName: "blocks4",
// targetName: "target4",
// },
// ];
// console.log(blockMatches.blockName, blockMatches.targetName)
var assetsList = {}
const params = new URLSearchParams(window.location.search);
@ -303,6 +303,24 @@ import Layout from '../../layouts/Layout.astro';
font: ` ${responsiveFontSize}px Quicksand`,
fill: '#7c4c23',
}).setOrigin(0.5);
blockMatches = [
{
blockName: "blocks1",
targetName: `target${data.answer1}`,
},
{
blockName: "blocks2",
targetName: `target${data.answer2}`,
},
{
blockName: "blocks3",
targetName: `target${data.answer3}`,
},
{
blockName: "blocks4",
targetName: `target${data.answer4}`,
},
];
// this.add.text(displayW / 14 - 15, 50, data.LearningArea, {font: `20px`}).setTint(0x7c4c23);
// this.add.text(displayW / 14 - 15, 70, data.LearningSubArea_copy, {font: `19px`}).setTint(0x7c4c23);
// Left Image Name
@ -526,11 +544,12 @@ import Layout from '../../layouts/Layout.astro';
submitButton.setVisible(true);
}
}
let scoreTotal = 0;
const match = blockMatches.find((m) => m.blockName === blockName && m.targetName === targetName);
let scoreTotal=0;
if(match){
console.log(match)
if(match !== undefined){
scoreTotal++;
// console.log(scoreTotal)
console.log(scoreTotal)
}
// console.log(scoreTotal)
// // console.log(match)

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

@ -12,10 +12,10 @@ import Layout from '../../layouts/Layout.astro';
<script is:inline>
const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
const drawingZone = {
x: isMobile ? 0 : window.innerWidth / 4, // Set x to 0 on mobile, else 1/4 of screen width
y: window.innerHeight / 4,
width: isMobile ? window.innerWidth : window.innerWidth / 2, // Full width on mobile, else 1/2 of screen width
height: window.innerHeight / 2,
x: 0,
y: 0,
width: window.innerWidth,
height: window.innerHeight,
};
if(isMobile){
submitWidth = 250;
@ -117,8 +117,8 @@ import Layout from '../../layouts/Layout.astro';
.then(({ data }) => {
// console.log(data.colors)
const screenCenterX = this.cameras.main.worldView.x + this.cameras.main.width / 2;
const baseFontSize = 15;
const responsiveFontSize = (window.innerWidth / 280) * baseFontSize;
const baseFontSize = 22;
const responsiveFontSize = (window.innerWidth / 800) * baseFontSize;
const descrptText = this.add.text(screenCenterX, 70, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#7c4c23', }).setOrigin(0.5);
// this.add.text(customWidth / 2 - learningWidth, customHeight / 2 - learningHeight, data.LearningArea, {font: `20px`}).setTint(0X7C4C23)
// this.add.text(customWidth / 2 - learningWidth, customHeight / 2 - learningHeight + 20, data.LearningSubArea, {font: `20px`}).setTint(0X7C4C23)
@ -230,8 +230,8 @@ import Layout from '../../layouts/Layout.astro';
// const colors = data.colors;
// var colors = colorList;
const colors = ['#ff0000', '#00ff00', '#0000ff', '#ffff00', '#ff00ff', '#00ffff'];
const buttonSize = 50;
const buttonSpacing = 15;
const buttonSize = 60;
const buttonSpacing = 5;
// Create a container div for the color buttons
const colorButtonsContainer = document.createElement('div');
colorButtonsContainer.style.display = 'flex'; // Display color buttons horizontally
@ -468,10 +468,12 @@ import Layout from '../../layouts/Layout.astro';
snapNotice.setVisible(false);
}
function captureSnapshot(drawingZone) {
submitButton.setVisible(false);
// snapNotice.setVisible(true);
snapshotButton.setVisible(false);
customCursor.setVisible(false);
drawingZone.renderer.snapshot((image) => {
submitButton.setVisible(true);
snapshotButton.setVisible(true);
customCursor.setVisible(true);
image.style.width = '160px';

4
src/pages/drawing/v2.astro
View File

@ -219,7 +219,7 @@ import Layout from '../../layouts/Layout.astro';
colorContainer.style.flexDirection = 'column';
}
var colors = colorList;
const buttonSize = 50;
const buttonSize = 60;
const buttonSpacing = 15;
const colorButtonsContainer = document.createElement('div');
colorButtonsContainer.style.display = 'flex';
@ -443,9 +443,11 @@ import Layout from '../../layouts/Layout.astro';
}
function captureSnapshot(drawingZone) {
// snapNotice.setVisible(true);
submitButton.setVisible(false);
snapshotButton.setVisible(false);
customCursor.setVisible(false);
drawingZone.renderer.snapshot((image) => {
submitButton.setVisible(true);
snapshotButton.setVisible(true);
customCursor.setVisible(true);
image.style.width = '160px';

12
src/pages/drawing/v3.astro
View File

@ -23,7 +23,7 @@ import Layout from '../../layouts/Layout.astro';
noticeWidth = 100;
noticeHeight = 0;
downloadWidth = 67;
downloadHeight = 200;
downloadHeight = 160;
learningWidth = 200;
learningHeight = 400
} else {
@ -117,8 +117,8 @@ import Layout from '../../layouts/Layout.astro';
.then(({ data }) => {
// console.log(data.colors)
const screenCenterX = this.cameras.main.worldView.x + this.cameras.main.width / 2;
const baseFontSize = 15;
const responsiveFontSize = (window.innerWidth / 280) * baseFontSize;
const baseFontSize = 22;
const responsiveFontSize = (window.innerWidth / 800) * baseFontSize;
const descrptText = this.add.text(screenCenterX, 70, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#7c4c23', }).setOrigin(0.5);
// this.add.text(customWidth / 2 - learningWidth, customHeight / 2 - learningHeight, data.LearningArea, {font: `20px`}).setTint(0X7C4C23)
// this.add.text(customWidth / 2 - learningWidth, customHeight / 2 - learningHeight + 20, data.LearningSubArea, {font: `20px`}).setTint(0X7C4C23)
@ -230,7 +230,7 @@ import Layout from '../../layouts/Layout.astro';
// const colors = data.colors;
// var colors = colorList;
const colors = ['#ff0000'];
const buttonSize = 50;
const buttonSize = 60;
const buttonSpacing = 15;
// Create a container div for the color buttons
const colorButtonsContainer = document.createElement('div');
@ -452,7 +452,7 @@ import Layout from '../../layouts/Layout.astro';
// };
// Add a "Save Snapshot" button
if(isMobile){
snapWidth = 50;
snapWidth = 70;
snapHeight = 70;
} else {
snapWidth = 200;
@ -468,10 +468,12 @@ import Layout from '../../layouts/Layout.astro';
snapNotice.setVisible(false);
}
function captureSnapshot(drawingZone) {
submitButton.setVisible(false);
// snapNotice.setVisible(true);
snapshotButton.setVisible(false);
customCursor.setVisible(false);
drawingZone.renderer.snapshot((image) => {
submitButton.setVisible(true);
snapshotButton.setVisible(true);
customCursor.setVisible(true);
image.style.width = '160px';