main
funix 4 years ago
parent 165772f103
commit 5e8a37ca16
  1. 27
      app.js
  2. 162
      index.html
  3. 20
      style.css

@ -10,6 +10,16 @@ var current = []
var colors = ["var(--red)", "var(--brown)", "var(--green)", "var(--blue)", "var(--yellow)", "var(--orange)", "var(--white)"]
function go() {
let divs = document.getElementsByClassName("row")
for (let div = 0; div < divs.length; div++) {
if (div != turn) {
document.getElementsByClassName("row")[div].classList.add("disabledButtons");
}
}
document.getElementsByClassName("choiceEl1")[turn].addEventListener("click", function() {
this.style.background = colors[n0]
current[0] = colors[n0]
@ -45,6 +55,8 @@ function go() {
n3 = 0
}
})
}
go()
@ -100,15 +112,20 @@ function check() {
if (areEqual(current, riddle)) {
alert("win")
}
if (turn == 6) {
alert("stop")
}
turn++
console.log(turn)
if (turn == 6) {
alert("stop")
}
current = []
go()
}
function checkpre() {
if (current.length == 4) {
check()
} else {
console.log("sdv")
}
}

@ -11,97 +11,97 @@
</head>
<body>
<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 class="mother">
<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="results">
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
<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>
<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 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>
<div class="row">
<div class="choice">
<button class="choiceEl1"></button>
<button class="choiceEl2"></button>
<button class="choiceEl3"></button>
<button class="choiceEl4"></button>
<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="results">
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
<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>
<div class="row">
<div class="choice">
<button class="choiceEl1"></button>
<button class="choiceEl2"></button>
<button class="choiceEl3"></button>
<button class="choiceEl4"></button>
<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="results">
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
<button class="result"></button>
</div>
</div>
<div>
</div>
<button id="check" onclick="check()">CHECK!</button>
<button id="check" onclick="checkpre()">CHECK!</button>
<script src="app.js" async defer></script>
</body>

@ -15,11 +15,20 @@ html {
padding: 0;
width: 100%;
height: 100%;
/* background-color: #000; */
}
.mother {
/* border: solid; */
height: 90%;
display: flex;
flex-direction: column;
justify-content: space-evenly;
}
button {
width: 20px;
height: 20px;
width: 35px;
height: 35px;
border-radius: 40%;
}
@ -27,7 +36,7 @@ button {
border: solid;
display: flex;
flex-direction: row;
height: 60px;
height: 15%;
width: 90%;
justify-content: space-evenly;
margin-left: 5%;
@ -99,3 +108,8 @@ button {
left: 2%;
border-radius: 30px;
}
.disabledbutton {
pointer-events: none;
opacity: 0.4;
}
Loading…
Cancel
Save