Skip to content

Commit 1d21e78

Browse files
iLikeGrapeiLikeGrape
committed
garden test
1 parent 688c065 commit 1d21e78

File tree

3 files changed

+109
-0
lines changed

3 files changed

+109
-0
lines changed

‎garden.css‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
2+
.cellContainer{
3+
display: grid;
4+
grid-template-columns: repeat(6, auto);
5+
margin: auto;
6+
grid-column-gap: 50px;
7+
grid-row-gap: 50px;
8+
}
9+
.cell{
10+
width: 150px;
11+
height: 150px;
12+
border-radius: 15px;
13+
border: 10px solid black;
14+
}

‎garden.html‎

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatable" content="IE=edge">
6+
<meta name="viewport" content="width=device-width">
7+
<title>Garden</title>
8+
<link rel="stylesheet" href="garden.css"
9+
</head>
10+
<body>
11+
<div id="gameContainer">
12+
<h1>Garden</h1>
13+
<div id="cellContainer">
14+
<div cellRow="0" cellCollumn="0" class="cell"></div>
15+
<div cellRow="0" cellCollumn="1" class="cell"></div>
16+
<div cellRow="0" cellCollumn="2" class="cell"></div>
17+
<div cellRow="0" cellCollumn="3" class="cell"></div>
18+
<div cellRow="0" cellCollumn="4" class="cell"></div>
19+
<div cellRow="0" cellCollumn="5" class="cell"></div>
20+
<div cellRow="1" cellCollumn="0" class="cell"></div>
21+
<div cellRow="1" cellCollumn="1" class="cell"></div>
22+
<div cellRow="1" cellCollumn="2" class="cell"></div>
23+
<div cellRow="1" cellCollumn="3" class="cell"></div>
24+
<div cellRow="1" cellCollumn="4" class="cell"></div>
25+
<div cellRow="1" cellCollumn="5" class="cell"></div>
26+
<div cellRow="2" cellCollumn="0" class="cell"></div>
27+
<div cellRow="2" cellCollumn="1" class="cell"></div>
28+
<div cellRow="2" cellCollumn="2" class="cell"></div>
29+
<div cellRow="2" cellCollumn="3" class="cell"></div>
30+
<div cellRow="2" cellCollumn="4" class="cell"></div>
31+
<div cellRow="2" cellCollumn="5" class="cell"></div>
32+
<div cellRow="3" cellCollumn="0" class="cell"></div>
33+
<div cellRow="3" cellCollumn="1" class="cell"></div>
34+
<div cellRow="3" cellCollumn="2" class="cell"></div>
35+
<div cellRow="3" cellCollumn="3" class="cell"></div>
36+
<div cellRow="3" cellCollumn="4" class="cell"></div>
37+
<div cellRow="3" cellCollumn="5" class="cell"></div>
38+
<div cellRow="4" cellCollumn="0" class="cell"></div>
39+
<div cellRow="4" cellCollumn="1" class="cell"></div>
40+
<div cellRow="4" cellCollumn="2" class="cell"></div>
41+
<div cellRow="4" cellCollumn="3" class="cell"></div>
42+
<div cellRow="4" cellCollumn="4" class="cell"></div>
43+
<div cellRow="4" cellCollumn="5" class="cell"></div>
44+
<div cellRow="5" cellCollumn="0" class="cell"></div>
45+
<div cellRow="5" cellCollumn="1" class="cell"></div>
46+
<div cellRow="5" cellCollumn="2" class="cell"></div>
47+
<div cellRow="5" cellCollumn="3" class="cell"></div>
48+
<div cellRow="5" cellCollumn="4" class="cell"></div>
49+
<div cellRow="5" cellCollumn="5" class="cell"></div>
50+
51+
52+
53+
54+
55+
56+
</div>
57+
<div id="list">
58+
<h3><a href=/main/index.html>Home</h3>
59+
</div>
60+
</div>
61+
<script src="garden.js"></script>
62+
</body>
63+
</html>

‎garden.js‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
const cells = document.querySelectorAll(".cell");
2+
let cellId = {
3+
row : null,
4+
collumn : null,
5+
};
6+
let plantedArray = [];
7+
8+
9+
function initializeGame(){
10+
cells.forEach(cell => cell.addEventListener("click", cellClicked))
11+
}
12+
function cellClicked(){
13+
let cellId = {
14+
row : this.getAttribute("cellRow"),
15+
collumn : this.getAttribute("cellCollumn"),
16+
}
17+
plantedArray.push(cellId)
18+
}
19+
function update(){
20+
cells.forEach(updateCells(cell))
21+
}
22+
function updateCells(cell){
23+
let cellId = {
24+
row : cell.getAttribute("cellRow"),
25+
collumn : cell.getAttribute("cellCollumn"),
26+
}
27+
for(let i=0; i < plantedArray.length; i++){
28+
if(cellId == plantedArray[i]){
29+
this.textContent = "X"
30+
}
31+
}
32+
}

0 commit comments

Comments
 (0)