add score calculation in drag all games all varient
parent
94e1b772aa
commit
15b8c1e803
|
@ -75,6 +75,8 @@ import Layout from '../../layouts/Layout.astro';
|
|||
let submitButton;
|
||||
let formattedDateTime;
|
||||
let shortUniqueID;
|
||||
let scoreTotal = 0;
|
||||
let resultView;
|
||||
gameResult = [];
|
||||
window.onload = function() {
|
||||
// Get the current date and time
|
||||
|
@ -505,6 +507,30 @@ import Layout from '../../layouts/Layout.astro';
|
|||
retryButton.setInteractive().on('pointerdown', () => {
|
||||
window.location.reload();
|
||||
})
|
||||
let score = 0;
|
||||
let counter = 0;
|
||||
const isMatch = (blockName, targetName) => {
|
||||
if(isMatch){
|
||||
counter++;
|
||||
// console.log(counter)
|
||||
}
|
||||
const match = blockMatches.find((m) => m.blockName === blockName && m.targetName === targetName);
|
||||
console.log(match)
|
||||
if(match !== undefined){
|
||||
scoreTotal++;
|
||||
console.log("Score Total", scoreTotal)
|
||||
resultView = this.add.text(window.innerWidth / 2 - 100, window.innerHeight / 2 - 100, `Your Score: ${scoreTotal}`, {font: `24px`, fill: `#7c4c23`});
|
||||
resultView.setVisible(false);
|
||||
}
|
||||
if(counter === 4){
|
||||
const overlap = document.getElementById("overlap");
|
||||
overlap.style.display = "block";
|
||||
// console.log(counter)
|
||||
submitButton.setVisible(true);
|
||||
resultView.setVisible(true);
|
||||
}
|
||||
};
|
||||
|
||||
}
|
||||
}
|
||||
// let hideButton = this.add.text(helpButtonWidth, helpButtonHeight, "Let`s Do", {
|
||||
|
@ -529,82 +555,7 @@ import Layout from '../../layouts/Layout.astro';
|
|||
const targetZone = targetZones.find((zone) => zone.name === block.texture.key);
|
||||
});
|
||||
};
|
||||
let score = 0;
|
||||
let counter = 0;
|
||||
|
||||
const isMatch = (blockName, targetName) => {
|
||||
if(isMatch){
|
||||
counter++;
|
||||
// console.log(counter)
|
||||
|
||||
if(counter === 4){
|
||||
const overlap = document.getElementById("overlap");
|
||||
overlap.style.display = "block";
|
||||
// console.log(counter)
|
||||
submitButton.setVisible(true);
|
||||
}
|
||||
}
|
||||
let scoreTotal = 0;
|
||||
const match = blockMatches.find((m) => m.blockName === blockName && m.targetName === targetName);
|
||||
console.log(match)
|
||||
if(match !== undefined){
|
||||
scoreTotal++;
|
||||
console.log(scoreTotal)
|
||||
}
|
||||
// console.log(scoreTotal)
|
||||
// // console.log(match)
|
||||
// if(match){
|
||||
// score++;
|
||||
// console.log(score)
|
||||
// let day;
|
||||
// switch (score) {
|
||||
// case 0:
|
||||
// day = "Points - 1";
|
||||
// break;
|
||||
// case 2:
|
||||
// day = "Points - 2";
|
||||
// break;
|
||||
// case 4:
|
||||
// day = "Points - 4";
|
||||
|
||||
// }
|
||||
// console.log(day)
|
||||
// finalDom = document.getElementById("good");
|
||||
// finalDom.classList.add("good");
|
||||
// document.getElementById("good").innerHTML = day;
|
||||
// document.getElementById("good").style.color = '#7c4c23'
|
||||
// // console.log(totalScore)
|
||||
// // if(score === 2){
|
||||
// // finalDom = document.getElementById("good");
|
||||
// // finalDom.classList.add("good");
|
||||
// // document.getElementById("good").innerHTML = " Good";
|
||||
// // document.getElementById("good").style.color = '#7c4c23'
|
||||
|
||||
|
||||
// // // let img = document.createElement("img");
|
||||
// // // img.src = "/assets/party-feestje.gif";
|
||||
// // // img.width = 100;
|
||||
// // // document.getElementById('win').appendChild(img);
|
||||
// // }
|
||||
// // else if(score === 4) {
|
||||
// // finalDom = document.getElementById("verryGood");
|
||||
// // finalDom.classList.add("verryGood");
|
||||
// // document.getElementById("verryGood").innerHTML = "Verry Good";
|
||||
// // document.getElementById("verryGood").style.color = '#7c4c23'
|
||||
// // }
|
||||
// // else {
|
||||
// // // finalDom = document.getElementById("lost");
|
||||
// // // finalDom.classList.add("lost");
|
||||
// // // document.getElementById("lost").innerHTML = " Lost";
|
||||
// // // document.getElementById("lost").style.color = '#7c4c23'
|
||||
// // // console.log("Losttttt")
|
||||
// // }
|
||||
|
||||
// } else{
|
||||
// score = score
|
||||
// }
|
||||
// return match !== undefined;
|
||||
};
|
||||
|
||||
</script>
|
||||
<style href="https://fonts.googleapis.com/css?family=Quicksand&display=swap" rel="stylesheet" >
|
||||
|
|
|
@ -76,6 +76,9 @@ import Layout from '../../layouts/Layout.astro';
|
|||
let formattedDateTime;
|
||||
let shortUniqueID;
|
||||
let blockMatches;
|
||||
let resultView;
|
||||
let scoreTotal = 0; // scoreTotal resultView
|
||||
|
||||
gameResult = [];
|
||||
window.onload = function() {
|
||||
// Get the current date and time
|
||||
|
@ -469,60 +472,6 @@ import Layout from '../../layouts/Layout.astro';
|
|||
displayResult(droppedBlocks);
|
||||
}
|
||||
});
|
||||
|
||||
// newBlock.on("dragend", () => {
|
||||
// newBlock.setScale(1.0);
|
||||
// let droppedOnTargetZone = false;
|
||||
// targetZones.forEach((targetZone, targetIndex) => {
|
||||
// if (
|
||||
// Phaser.Geom.Intersects.RectangleToRectangle(
|
||||
// newBlock.getBounds(),
|
||||
// new Phaser.Geom.Rectangle(targetZone.x, targetZone.y, 200, 100)
|
||||
// )
|
||||
// ) {
|
||||
// if (targetZone.block === null) {
|
||||
// newBlock.setPosition(targetZone.x - 50, targetZone.y - 50);
|
||||
// newBlock.disableInteractive();
|
||||
// targetZone.block = newBlock;
|
||||
// droppedBlocks.push(newBlock);
|
||||
// if (isMatch(newBlock.texture.key, targetZone.name)) {
|
||||
// // console.log(isMatch(newBlock.texture.key, targetZone.name))
|
||||
|
||||
// // if(isMatch(newBlock.texture.key, targetZone.name)){
|
||||
// // score++;
|
||||
// // // console.log(score);
|
||||
// // if(score === 4){
|
||||
// // const overlap = document.getElementById("overlap");
|
||||
// // overlap.style.display = "block";
|
||||
// // let finalDom;
|
||||
// // }
|
||||
// // console.log(score)
|
||||
// // if(score >= 2){
|
||||
// // console.log("Win")
|
||||
// // } else{
|
||||
// // console.log("Loose")
|
||||
// // }
|
||||
// // }
|
||||
// //counter++; // Increment the counter when a match is found
|
||||
// }
|
||||
// } else {
|
||||
// newBlock.setPosition(block.x, block.y);
|
||||
// }
|
||||
// droppedOnTargetZone = true;
|
||||
// targetZoneBorders[targetIndex].setVisible(true);
|
||||
// targetZoneBorders[targetIndex].setAlpha(1);
|
||||
// return;
|
||||
// }
|
||||
// });
|
||||
|
||||
// if (!droppedOnTargetZone) {
|
||||
// newBlock.setPosition(block.x, block.y);
|
||||
// }
|
||||
// if (droppedBlocks.length === targetZones.length)
|
||||
// {
|
||||
// displayResult(droppedBlocks);
|
||||
// }
|
||||
// });
|
||||
});
|
||||
let retryButton = this.add.text(retryButtonWidth, retryButtonHeight, 'Reset', {
|
||||
font: '600 30px Quicksand',
|
||||
|
@ -533,6 +482,29 @@ import Layout from '../../layouts/Layout.astro';
|
|||
retryButton.setInteractive().on('pointerdown', () => {
|
||||
window.location.reload();
|
||||
})
|
||||
let score = 0;
|
||||
let counter = 0;
|
||||
|
||||
const isMatch = (blockName, targetName) => {
|
||||
if(isMatch){
|
||||
counter++;
|
||||
// console.log(counter)
|
||||
}
|
||||
const match = blockMatches.find((m) => m.blockName === blockName && m.targetName === targetName);
|
||||
console.log(match)
|
||||
if(match !== undefined){
|
||||
scoreTotal++;
|
||||
console.log("Score Total", scoreTotal)
|
||||
resultView = this.add.text(window.innerWidth / 2 - 100, window.innerHeight / 2 - 100, `Your Score: ${scoreTotal}`,{font: `24px`, fill: `#7c4c23`}).setVisible(false);
|
||||
}
|
||||
if(counter === 4){
|
||||
const overlap = document.getElementById("overlap");
|
||||
overlap.style.display = "block";
|
||||
// console.log(counter)
|
||||
submitButton.setVisible(true);
|
||||
resultView.setVisible(true);
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
// let hideButton = this.add.text(helpButtonWidth, helpButtonHeight, "Let`s Do", {
|
||||
|
@ -557,82 +529,6 @@ import Layout from '../../layouts/Layout.astro';
|
|||
const targetZone = targetZones.find((zone) => zone.name === block.texture.key);
|
||||
});
|
||||
};
|
||||
let score = 0;
|
||||
let counter = 0;
|
||||
|
||||
const isMatch = (blockName, targetName) => {
|
||||
if(isMatch){
|
||||
counter++;
|
||||
// console.log(counter)
|
||||
|
||||
if(counter === 4){
|
||||
const overlap = document.getElementById("overlap");
|
||||
overlap.style.display = "block";
|
||||
// console.log(counter)
|
||||
submitButton.setVisible(true);
|
||||
}
|
||||
}
|
||||
const match = blockMatches.find((m) => m.blockName === blockName && m.targetName === targetName);
|
||||
console.log(match)
|
||||
let scoreTotal=0;
|
||||
if(match){
|
||||
scoreTotal++;
|
||||
// console.log(scoreTotal)
|
||||
}
|
||||
// console.log(scoreTotal)
|
||||
// // console.log(match)
|
||||
// if(match){
|
||||
// score++;
|
||||
// console.log(score)
|
||||
// let day;
|
||||
// switch (score) {
|
||||
// case 0:
|
||||
// day = "Points - 1";
|
||||
// break;
|
||||
// case 2:
|
||||
// day = "Points - 2";
|
||||
// break;
|
||||
// case 4:
|
||||
// day = "Points - 4";
|
||||
|
||||
// }
|
||||
// console.log(day)
|
||||
// finalDom = document.getElementById("good");
|
||||
// finalDom.classList.add("good");
|
||||
// document.getElementById("good").innerHTML = day;
|
||||
// document.getElementById("good").style.color = '#7c4c23'
|
||||
// // console.log(totalScore)
|
||||
// // if(score === 2){
|
||||
// // finalDom = document.getElementById("good");
|
||||
// // finalDom.classList.add("good");
|
||||
// // document.getElementById("good").innerHTML = " Good";
|
||||
// // document.getElementById("good").style.color = '#7c4c23'
|
||||
|
||||
|
||||
// // // let img = document.createElement("img");
|
||||
// // // img.src = "/assets/party-feestje.gif";
|
||||
// // // img.width = 100;
|
||||
// // // document.getElementById('win').appendChild(img);
|
||||
// // }
|
||||
// // else if(score === 4) {
|
||||
// // finalDom = document.getElementById("verryGood");
|
||||
// // finalDom.classList.add("verryGood");
|
||||
// // document.getElementById("verryGood").innerHTML = "Verry Good";
|
||||
// // document.getElementById("verryGood").style.color = '#7c4c23'
|
||||
// // }
|
||||
// // else {
|
||||
// // // finalDom = document.getElementById("lost");
|
||||
// // // finalDom.classList.add("lost");
|
||||
// // // document.getElementById("lost").innerHTML = " Lost";
|
||||
// // // document.getElementById("lost").style.color = '#7c4c23'
|
||||
// // // console.log("Losttttt")
|
||||
// // }
|
||||
|
||||
// } else{
|
||||
// score = score
|
||||
// }
|
||||
// return match !== undefined;
|
||||
};
|
||||
|
||||
</script>
|
||||
<style href="https://fonts.googleapis.com/css?family=Quicksand&display=swap" rel="stylesheet" >
|
||||
|
|
|
@ -81,6 +81,8 @@ import Layout from '../../layouts/Layout.astro';
|
|||
let shortUniqueID;
|
||||
let retryButton;
|
||||
let blockMatches;
|
||||
let resultView;
|
||||
let scoreTotal = 0; // resultView scoreTotal
|
||||
gameResult = [];
|
||||
window.onload = function() {
|
||||
// Get the current date and time
|
||||
|
@ -428,13 +430,13 @@ import Layout from '../../layouts/Layout.astro';
|
|||
id: "block4",
|
||||
},
|
||||
{
|
||||
x: displayW / 2+100,
|
||||
x: displayW / 2,
|
||||
y: window.innerHeight - 120,
|
||||
textureKey: "blocks5",
|
||||
id: "block5",
|
||||
},
|
||||
{
|
||||
x: displayW / 2,
|
||||
x: displayW / 2+100,
|
||||
y: window.innerHeight - 120,
|
||||
textureKey: "blocks6",
|
||||
id: "block6",
|
||||
|
@ -506,52 +508,41 @@ import Layout from '../../layouts/Layout.astro';
|
|||
}
|
||||
});
|
||||
});
|
||||
|
||||
// let retryButton = this.add.text(retryButtonWidth, retryButtonHeight, 'Reset', {
|
||||
// font: '600 30px Quicksand',
|
||||
// fill: '#fff',
|
||||
// backgroundColor: 'blue',
|
||||
// padding: { x: 20, y: 10 },
|
||||
// })
|
||||
retryButton = this.add.image(retryButtonWidth, retryButtonHeight, 'retryIcon')
|
||||
retryButton.setInteractive().on('pointerdown', () => {
|
||||
window.location.reload();
|
||||
})
|
||||
retryButton.setVisible(false);
|
||||
let score = 0;
|
||||
let counter = 0;
|
||||
|
||||
const isMatch = (blockName, targetName) => {
|
||||
if(isMatch){
|
||||
counter++;
|
||||
// console.log(counter)
|
||||
}
|
||||
//resultView scoreTotal
|
||||
const match = blockMatches.find((m) => m.blockName === blockName && m.targetName === targetName);
|
||||
console.log(match)
|
||||
if(match){
|
||||
scoreTotal++;
|
||||
resultView = this.add.text(window.innerWidth / 2 - 100, window.innerHeight / 2 - 100, `Your Score: ${scoreTotal}`, {font: `24px`, fill: `#7c4c23`}).setVisible(false);
|
||||
// console.log(scoreTotal)
|
||||
}
|
||||
if(counter === 8){
|
||||
// console.log(counter)
|
||||
submitButton.setVisible(true);
|
||||
retryButton.setVisible(true);
|
||||
resultView.setVisible(true);
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
const displayResult = (droppedBlocks) => {
|
||||
// const overlap = document.getElementById("overlap");
|
||||
// overlap.style.display = "block";
|
||||
// let finalDom;
|
||||
droppedBlocks.forEach((block) => {
|
||||
const targetZone = targetZones.find((zone) => zone.name === block.texture.key);
|
||||
});
|
||||
};
|
||||
let score = 0;
|
||||
let counter = 0;
|
||||
|
||||
const isMatch = (blockName, targetName) => {
|
||||
if(isMatch){
|
||||
counter++;
|
||||
// console.log(counter)
|
||||
|
||||
if(counter === 8){
|
||||
const overlap = document.getElementById("overlap");
|
||||
overlap.style.display = "block";
|
||||
// console.log(counter)
|
||||
submitButton.setVisible(true);
|
||||
retryButton.setVisible(true);
|
||||
}
|
||||
}
|
||||
const match = blockMatches.find((m) => m.blockName === blockName && m.targetName === targetName);
|
||||
console.log(match)
|
||||
let scoreTotal=0;
|
||||
if(match){
|
||||
scoreTotal++;
|
||||
// console.log(scoreTotal)
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style href="https://fonts.googleapis.com/css?family=Quicksand&display=swap" rel="stylesheet" >
|
||||
|
|
|
@ -81,6 +81,8 @@ import Layout from '../../layouts/Layout.astro';
|
|||
let shortUniqueID;
|
||||
let retryButton;
|
||||
let blockMatches;
|
||||
let scoreTotal = 0;
|
||||
let resultView; // scoreTotal resultView
|
||||
gameResult = [];
|
||||
window.onload = function() {
|
||||
// Get the current date and time
|
||||
|
@ -513,6 +515,27 @@ import Layout from '../../layouts/Layout.astro';
|
|||
window.location.reload();
|
||||
})
|
||||
retryButton.setVisible(false);
|
||||
let score = 0;
|
||||
let counter = 0;
|
||||
const isMatch = (blockName, targetName) => {
|
||||
if(isMatch){
|
||||
counter++;
|
||||
// console.log(counter)
|
||||
}
|
||||
const match = blockMatches.find((m) => m.blockName === blockName && m.targetName === targetName);
|
||||
// console.log(match)
|
||||
if(match !== undefined){
|
||||
scoreTotal++;
|
||||
resultView = this.add.text(window.innerWidth / 2 - 100, window.innerHeight / 2 - 100, `Your Score: ${scoreTotal}`, {font: `24px`, fill: `#7c4c23`}).setVisible(false);
|
||||
console.log("Score Total", scoreTotal)
|
||||
}
|
||||
if(counter === 8){
|
||||
// console.log(counter)
|
||||
submitButton.setVisible(true);
|
||||
retryButton.setVisible(true);
|
||||
resultView.setVisible(true);
|
||||
}
|
||||
};
|
||||
}
|
||||
}
|
||||
const displayResult = (droppedBlocks) => {
|
||||
|
@ -520,30 +543,6 @@ import Layout from '../../layouts/Layout.astro';
|
|||
const targetZone = targetZones.find((zone) => zone.name === block.texture.key);
|
||||
});
|
||||
};
|
||||
let score = 0;
|
||||
let counter = 0;
|
||||
|
||||
const isMatch = (blockName, targetName) => {
|
||||
if(isMatch){
|
||||
counter++;
|
||||
console.log(counter)
|
||||
|
||||
if(counter === 8){
|
||||
const overlap = document.getElementById("overlap");
|
||||
overlap.style.display = "block";
|
||||
console.log(counter)
|
||||
submitButton.setVisible(true);
|
||||
retryButton.setVisible(true);
|
||||
}
|
||||
}
|
||||
const match = blockMatches.find((m) => m.blockName === blockName && m.targetName === targetName);
|
||||
console.log(match)
|
||||
let scoreTotal=0;
|
||||
if(match !== undefined){
|
||||
scoreTotal++;
|
||||
console.log("Score Total", scoreTotal)
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
<style href="https://fonts.googleapis.com/css?family=Quicksand&display=swap" rel="stylesheet" >
|
||||
|
|
Loading…
Reference in New Issue