funix 4 years ago
parent c3fca7fc67
commit 165772f103
  1. 47
      app.js
  2. 88
      index.html

@ -1,5 +1,5 @@
var riddle = ["var(--yellow)", "var(--green)", "var(--green)", "var(--red)"] var riddle = ["var(--yellow)", "var(--green)", "var(--green)", "var(--red)"]
var turn = 0
var n1 = 0 var n1 = 0
var n2 = 0 var n2 = 0
var n3 = 0 var n3 = 0
@ -9,8 +9,8 @@ var current = []
var colors = ["var(--red)", "var(--brown)", "var(--green)", "var(--blue)", "var(--yellow)", "var(--orange)", "var(--white)"] var colors = ["var(--red)", "var(--brown)", "var(--green)", "var(--blue)", "var(--yellow)", "var(--orange)", "var(--white)"]
function go() {
document.getElementById("choiceEl1").addEventListener("click", function() { document.getElementsByClassName("choiceEl1")[turn].addEventListener("click", function() {
this.style.background = colors[n0] this.style.background = colors[n0]
current[0] = colors[n0] current[0] = colors[n0]
n0++ n0++
@ -19,7 +19,7 @@ document.getElementById("choiceEl1").addEventListener("click", function() {
} }
}) })
document.getElementById("choiceEl2").addEventListener("click", function() { document.getElementsByClassName("choiceEl2")[turn].addEventListener("click", function() {
this.style.background = colors[n1] this.style.background = colors[n1]
current[1] = colors[n1] current[1] = colors[n1]
n1++ n1++
@ -28,7 +28,7 @@ document.getElementById("choiceEl2").addEventListener("click", function() {
} }
}) })
document.getElementById("choiceEl3").addEventListener("click", function() { document.getElementsByClassName("choiceEl3")[turn].addEventListener("click", function() {
this.style.background = colors[n2] this.style.background = colors[n2]
current[2] = colors[n2] current[2] = colors[n2]
n2++ n2++
@ -37,7 +37,7 @@ document.getElementById("choiceEl3").addEventListener("click", function() {
} }
}) })
document.getElementById("choiceEl4").addEventListener("click", function() { document.getElementsByClassName("choiceEl4")[turn].addEventListener("click", function() {
this.style.background = colors[n3] this.style.background = colors[n3]
current[3] = colors[n3] current[3] = colors[n3]
n3++ n3++
@ -45,6 +45,9 @@ document.getElementById("choiceEl4").addEventListener("click", function() {
n3 = 0 n3 = 0
} }
}) })
}
go()
function shuffle() { function shuffle() {
let array = [0, 1, 2, 3] let array = [0, 1, 2, 3]
@ -76,10 +79,36 @@ function check() {
for (let solve = 0; solve < 4; solve++) { for (let solve = 0; solve < 4; solve++) {
r = newShuffle[solve] r = newShuffle[solve]
if (riddle[solve] == current[solve]) { if (riddle[solve] == current[solve]) {
document.getElementsByClassName("result")[r].style.background = "var(--black)" document.getElementsByClassName("results")[turn].getElementsByClassName("result")[r].style.background = "var(--black)"
} else if (riddle.includes(current[solve])) { } else if (riddle.includes(current[solve])) {
document.getElementsByClassName("result")[r].style.background = "var(--white)" document.getElementsByClassName("results")[turn].getElementsByClassName("result")[r].style.background = "var(--white)"
} }
} }
let areEqual = (first, second) => {
if (first.length !== second.length) {
return false;
};
for (let i = 0; i < first.length; i++) {
if (!second.includes(first[i])) {
return false;
};
};
return true;
};
if (areEqual(current, riddle)) {
alert("win")
}
if (turn == 6) {
alert("stop")
}
turn++
console.log(turn)
if (turn == 6) {
alert("stop")
}
go()
} }

@ -12,28 +12,88 @@
<body> <body>
<!-- <div class="palette">
<div class="red" onclick="pick('red')"></div>
<div class="blue"></div>
<div class="green"></div>
<div class="yellow"></div>
<div class="orange"></div>
<div class="brown"></div>
</div> -->
<div class="row"> <div class="row">
<div class="choice"> <div class="choice">
<button id="choiceEl1"></button> <button class="choiceEl1"></button>
<button id="choiceEl2"></button> <button class="choiceEl2"></button>
<button id="choiceEl3"></button> <button class="choiceEl3"></button>
<button id="choiceEl4"></button> <button class="choiceEl4"></button>
</div>
<div class="results">
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
</div>
</div>
<div class="row">
<div class="choice">
<button class="choiceEl1"></button>
<button class="choiceEl2"></button>
<button class="choiceEl3"></button>
<button class="choiceEl4"></button>
</div>
<div class="results">
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
</div>
</div>
<div class="row">
<div class="choice">
<button class="choiceEl1"></button>
<button class="choiceEl2"></button>
<button class="choiceEl3"></button>
<button class="choiceEl4"></button>
</div>
<div class="results">
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
</div>
</div>
<div class="row">
<div class="choice">
<button class="choiceEl1"></button>
<button class="choiceEl2"></button>
<button class="choiceEl3"></button>
<button class="choiceEl4"></button>
</div>
<div class="results">
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
</div>
</div>
<div class="row">
<div class="choice">
<button class="choiceEl1"></button>
<button class="choiceEl2"></button>
<button class="choiceEl3"></button>
<button class="choiceEl4"></button>
</div>
<div class="results">
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
</div>
</div>
<div class="row">
<div class="choice">
<button class="choiceEl1"></button>
<button class="choiceEl2"></button>
<button class="choiceEl3"></button>
<button class="choiceEl4"></button>
</div> </div>
<div class="results"> <div class="results">
<button class="result"></button> <button class="result"></button>
<button class="result"></button> <button class="result"></button>
<button class="result"></button> <button class="result"></button>
<button class="result"></button> <button class="result"></button>
</div> </div>
</div> </div>

Loading…
Cancel
Save