Skip to content

Commit

Permalink
Changed Harvest To Communal Function
Browse files Browse the repository at this point in the history
  • Loading branch information
Squirrel-314 committed Jan 6, 2021
1 parent 4516334 commit a6f6a33
Show file tree
Hide file tree
Showing 3 changed files with 106 additions and 87 deletions.
23 changes: 18 additions & 5 deletions Game/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,15 +9,28 @@
<body>
<div id="land">
<div class="plot" id="plot1">
<button id="grow1" onclick="plantPeas()">Grow Peas!</button><button id="harvest1" onclick="harvestPeas()">Harvest Peas!</button>
<button id="growPeas" onclick="plantPeas()">Grow Peas!</button>
<button id="harvestPeas" onclick="harvest('Peas')">Harvest Peas!</button>
</div>
<div class="plot" id="plot2">
<div class="lock-tooltip" id="lockedDiv2"><img id="lock2" class="locked" src="../Images/Lock/lock.png" alt="Locked"><span class="tooltiptext"><br><br>This plot is locked <br> Pay 25 bushels of peas to unlock <br> <button class="purchase-plot" onclick="purchasePlot2()">Purchase Plot</button></span></div>
<div id="openPlot2"><button id="grow2" onclick="plantCorn()">Grow Corn!</button><button id="harvest2" onclick="harvestCorn()">Harvest Corn!</button></div>
<div class="lock-tooltip" id="lockedDiv2">
<img id="lock2" class="locked" src="../Images/Lock/lock.png" alt="Locked">
<span class="tooltiptext"><br><br>This plot is locked <br> Pay 25 bushels of peas to unlock <br> <button class="purchase-plot" onclick="purchasePlot2()">Purchase Plot</button></span>
</div>
<div id="openPlot2">
<button id="growCorn" onclick="plantCorn()">Grow Corn!</button>
<button id="harvestCorn" onclick="harvest('Corn')">Harvest Corn!</button>
</div>
</div>
<div class="plot" id="plot3">
<div class="lock-tooltip" id="lockedDiv3"><img id="lock3" class="locked" src="../Images/Lock/lock.png" alt="Locked"><span class="tooltiptext-left" id="lock3Text"><br><br>This plot is locked <br> Purchase the previous plot to unlock</span></div>
<div id="openPlot3"><button id="grow3" onclick="plantStrawberries()">Grow Strawberries!</button><button id="harvest3" onclick="harvestStrawberries()">Harvest Strawberries!</button></div>
<div class="lock-tooltip" id="lockedDiv3">
<img id="lock3" class="locked" src="../Images/Lock/lock.png" alt="Locked">
<span class="tooltiptext-left" id="lock3Text"><br><br>This plot is locked <br> Purchase the previous plot to unlock</span>
</div>
<div id="openPlot3">
<button id="growStrawberries" onclick="plantStrawberries()">Grow Strawberries!</button>
<button id="harvestStrawberries" onclick="harvest('Strawberries')">Harvest Strawberries!</button>
</div>
</div>
<div class="plot" id="plot4">
<div class="lock-tooltip" id="lockedDiv4"><img id="lock4" class="locked" src="../Images/Lock/lock.png" alt="Locked"><span class="tooltiptext"><br><br>This plot is locked <br> Purchase the previous plot to unlock</span></div>
Expand Down
165 changes: 85 additions & 80 deletions Game/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@
~~~~~~~~~~~~~~~~~
TABLE OF CONTENTS
~~~~~~~~~~~~~~~~~
Idea | Thoughts, plots, the lot
Ideas | Thoughts, plots, the lot
Game Data | All game information stored in object variables
Harvest & Plant | Harvest function
Peas | All about the first plot
Store | Update the store
Purchase Plots | Functions that unlock plots
Expand All @@ -21,9 +22,10 @@ Ideas
/*
//Automate harvesting while active
if (poltStatus.peas = "ready") {
document.getElementById("harvest1").click();
setTimeout(document.getElementById("harvestPeas").click());
}
*/

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Game Data
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
Expand Down Expand Up @@ -65,157 +67,160 @@ let plotStatus = initalPlotStatus;
let produce = initalProduce;
let plots = initalPlots;

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
// Harvest & Plant
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

function harvest(veg) {
// Create proper IDs
let plntID = "grow" + veg;
let hrvstID = "harvest" + veg;

// If veg is equal to peas
if (veg === 'Peas') {
// Set plot status to empty
plotStatus.peas = "empty";
// Add one to peas
produce.peas++;
}
if (veg === "Corn") {
plotStatus.corn = "empty";
produce.corn++;
}
if (veg === "Strawberries") {
plotStatus.strawberries = "empty";
produce.strawberries++;
}
// Hide harvest button
document.getElementById(hrvstID).style.opacity = "0";
document.getElementById(hrvstID).style.zIndex = "-1";
// Display grow button
document.getElementById(plntID).style.opacity = "1";
document.getElementById(plntID).style.zIndex = "1";
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
// Peas
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

// Set peaPlot to pea plot div in HTML
let peaPlot = document.getElementById("plot1");
// Set pea plant button
let peaPlntBtn = document.getElementById("growPeas");
// Set pea harvets button
let peaHvstBtn = document.getElementById("harvestPeas");

// Triggred by onclick of grow peas
function plantPeas() {
// Set timeout for growingPeas and readyPeas
setTimeout(growingPeas, 2000); // Change the status if peas to growing in 2 seconds
setTimeout(readyPeas, 5000); // Change the status of peas to ready in 5 seconds
// Remove the grow peas button
document.getElementById("grow1").style.opacity = "0";
peaPlntBtn.style.opacity = "0";
}

function growingPeas() {plotStatus.peas = "growing";}
function readyPeas() {plotStatus.peas = "ready";}

function harvestPeas() {
// Reset pea status to empty
plotStatus.peas = "empty";
// Show the grow button
document.getElementById("grow1").style.opacity = "1";
// Remove the harvest button
document.getElementById("harvest1").style.opacity = "0";
// Put the harvets button on top
document.getElementById("harvest1").style.zIndex = "-1";
// Put grow peas button on top
document.getElementById("grow1").style.zIndex = "1";
// Add one to peas
produce.peas++;
}

/*
// Attempt at reducing to one harvest function
function harvest(veg, num) {
plotStatus.veg = "empty";
document.getElementById("grow" + num).style.opacity = "1";
document.getElementById("harvest1" + num).style.opacity = "0";
document.getElementById("harvest1" + num).style.zIndex = "-1";
produce.veg++;
}
*/

function peaStatus() {
// If pea status is equal to the string "ready"
if (plotStatus.peas === "ready") {
// Change background images to grow peas images
document.getElementById("plot1").style.background = "url(../Images/Vegetables/Peas/grown-pea.png)";
document.getElementById("plot1").style.backgroundSize = "cover";
peaPlot.style.background = "url(../Images/Vegetables/Peas/grown-pea.png)";
peaPlot.style.backgroundSize = "cover";
// Show the harvest button and put it on top
document.getElementById("harvest1").style.opacity = "1";
document.getElementById("harvest1").style.zIndex = "1";
peaHvstBtn.style.opacity = "1";
peaHvstBtn.style.zIndex = "1";
// Put the grow peas button under
document.getElementById("grow1").style.zIndex = "-1";
peaPlntBtn.style.zIndex = "-1";
}
// If pea status is equal to the string "ready"
else if (plotStatus.peas === "growing") {
// Change background images to sprouting plant image
document.getElementById("plot1").style.background = "url(../Images/Plots/growing.png)";
document.getElementById("plot1").style.backgroundSize = "cover";
peaPlot.style.background = "url(../Images/Plots/growing.png)";
peaPlot.style.backgroundSize = "cover";
}
// Otherwise
else {
// Change background images to empty plot image
document.getElementById("plot1").style.background = "url(../Images/Plots/plot.png)";
document.getElementById("plot1").style.backgroundSize = "cover";
peaPlot.style.background = "url(../Images/Plots/plot.png)";
peaPlot.style.backgroundSize = "cover";
}
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
// Corn
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

let cornPlot = document.getElementById("plot2");
let cornPlntBtn = document.getElementById("growCorn");
let cornHvstBtn = document.getElementById("harvestCorn");

function plantCorn() {
setTimeout(growingCorn, 8000);
setTimeout(readyCorn, 12000);
document.getElementById("grow2").style.opacity = "0";
cornPlntBtn.style.opacity = "0";
}

function growingCorn() {plotStatus.corn = "growing";}
function readyCorn() {plotStatus.corn = "ready";}

function harvestCorn() {
plotStatus.corn = "empty";
document.getElementById("grow2").style.opacity = "1";
document.getElementById("harvest2").style.opacity = "0";
document.getElementById("harvest2").style.zIndex = "-1";
document.getElementById("grow2").style.zIndex = "1";
produce.corn++;
}

function cornStatus() {
if (plotStatus.corn === "ready") {
document.getElementById("plot2").style.background = "url(../Images/Vegetables/Corn/grown-corn.png)";
document.getElementById("plot2").style.backgroundSize = "cover";
document.getElementById("harvest2").style.opacity = "1";
document.getElementById("harvest2").style.zIndex = "1";
document.getElementById("grow2").style.zIndex = "-1";
cornPlot.style.background = "url(../Images/Vegetables/Corn/grown-corn.png)";
cornPlot.style.backgroundSize = "cover";
cornHvstBtn.style.opacity = "1";
cornHvstBtn.style.zIndex = "1";
cornPlntBtn.style.zIndex = "-1";
}
else if (plotStatus.corn === "growing") {
document.getElementById("plot2").style.background = "url(../Images/Plots/growing.png)";
document.getElementById("plot2").style.backgroundSize = "cover";
cornPlot.style.background = "url(../Images/Plots/growing.png)";
cornPlot.style.backgroundSize = "cover";
}
else {
document.getElementById("plot2").style.background = "url(../Images/Plots/plot.png)";
document.getElementById("plot2").style.backgroundSize = "cover";
cornPlot.style.background = "url(../Images/Plots/plot.png)";
cornPlot.style.backgroundSize = "cover";
}
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
// Strawberries
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

let strawberriesPlot = document.getElementById("plot3");
let strawberriesPlntBtn = document.getElementById("growStrawberries");
let strawberriesHvstBtn = document.getElementById("harvestStrawberries");

function plantStrawberries() {
setTimeout(sproutingStrawberries, 20000);
setTimeout(floweringStrawberries, 60000);
setTimeout(fruitingStrawberries, 120000);
document.getElementById("grow3").style.opacity = "0";
strawberriesPlntBtn.style.opacity = "0";
}

function sproutingStrawberries() {plotStatus.strawberries = "sprouting";}
function floweringStrawberries() {plotStatus.strawberries = "flowering";}
function fruitingStrawberries() {plotStatus.strawberries = "fruiting";}

function harvestStrawberries() {
plotStatus.strawberries = "empty";
document.getElementById("grow3").style.opacity = "1";
document.getElementById("harvest3").style.opacity = "0";
document.getElementById("harvest3").style.zIndex = "-1";
document.getElementById("grow3").style.zIndex = "1";
produce.strawberries++;
}

function strawberriesStatus() {
if (plotStatus.strawberries === "fruiting") {
document.getElementById("plot3").style.background = "url(../Images/Fruits/Strawberries/grown-strawberries.png)";
document.getElementById("plot3").style.backgroundSize = "cover";
document.getElementById("harvest3").style.opacity = "1";
document.getElementById("harvest3").style.zIndex = "1";
document.getElementById("grow3").style.zIndex = "-1";
strawberriesPlot.style.background = "url(../Images/Fruits/Strawberries/grown-strawberries.png)";
strawberriesPlot.style.backgroundSize = "cover";
strawberriesHvstBtn.style.opacity = "1";
strawberriesHvstBtn.style.zIndex = "1";
strawberriesPlntBtn.style.zIndex = "-1";
}
else if (plotStatus.strawberries === "flowering") {
document.getElementById("plot3").style.background = "url(../Images/Fruits/Strawberries/flowering-strawberries.png)";
document.getElementById("plot3").style.backgroundSize = "cover";
strawberriesPlot.style.background = "url(../Images/Fruits/Strawberries/flowering-strawberries.png)";
strawberriesPlot.style.backgroundSize = "cover";
}
else if (plotStatus.strawberries === "sprouting") {
document.getElementById("plot3").style.background = "url(../Images/Fruits/Strawberries/growing-strawberries.png)";
document.getElementById("plot3").style.backgroundSize = "cover";
strawberriesPlot.style.background = "url(../Images/Fruits/Strawberries/growing-strawberries.png)";
strawberriesPlot.style.backgroundSize = "cover";
}
else {
document.getElementById("plot3").style.background = "url(../Images/Plots/plot.png)";
document.getElementById("plot3").style.backgroundSize = "cover";
strawberriesPlot.style.background = "url(../Images/Plots/plot.png)";
strawberriesPlot.style.backgroundSize = "cover";
}
}

Expand Down Expand Up @@ -316,10 +321,10 @@ function setup() {
produceDisplay();

if (plots.cornplot === "unlocked") {
setTimeout(openCornLock, 500);
openCornLock();
}
if (plots.strawberryplot === "unlocked") {
setTimeout(openStrawberryLock, 500);
openStrawberryLock();
}
}

Expand Down
5 changes: 3 additions & 2 deletions Game/styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,12 +54,13 @@ body {
position: relative;
}

#grow1, #grow2, #grow3 {
#growPeas, #growCorn, #growStrawberries {
transition: .2s;
border-radius: 2px;
position: absolute;
z-index: 1;
border: solid 2px black;
opacity: 1;
}

.locked {
Expand All @@ -83,7 +84,7 @@ body {
display: none;
}

#harvest1, #harvest2, #harvest3 {
#harvestPeas, #harvestCorn, #harvestStrawberries {
transition: .2s;
border-radius: 2px;
opacity: 0;
Expand Down

0 comments on commit a6f6a33

Please sign in to comment.