I am making a clicker game with javascript and html and I was just wondering how I could use cookies, or if you have a better option that, to save the user’s progress after they close or refresh the page.
Here is my code:
<body style="background-color:#ACE087">
<header id="myHeader">
<h3 style="font-size: 40px">Restaurant Tycoon</h3>
<h3 style="font-size: 13px">Made By Terry Morgan</h3>
</header>
<style>
.button {
background-color: #FAF3E3;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
}</style>
<p id="karpartz"></p>
<p id="ohio"></p>
<p id=curry></p>
<p id="invaid"></p>
<p id="cawfee"></p>
<p id="bargir"></p>
<button style="color: black;" class= "button" id="government">
buy lemonade stand
</button>
<button style="color: black;" class="button" id="ohiow">
buy bake sale
</button>
<button style="color: black;" class="button" id="kar">
buy food court stand
</button>
<button style="color: black;" class="button" id="invadio">
buy coffee shop
</button>
<button style="color: black;" class="button" id="babiq">
buy barbecue resturant
</button>
<button style="color: black;" class="button" id="burgs">
buy burger restaurant
</button>
<header style="font-size: 30px">
Unlock new buttons</header>
<button style="color: black;" class="button" id="unlockinvade">
unlock coffee shop (5 lemonade stands)
</button>
<button style="color: black;" class="button" id="unlockbbq">
unlock barbecue resturant (20 coffee shops)
</button>
<button style="color: black;" class="button" id="unlockburgers">
unlock burger restaurant (50 barbeque restaurants)
</button>
<header style="font-size: 30px">
Unlock upgrades
</header>
<button style="color: black;" class="button" id="2cpower">
1 more click power (25 lemonade stands)
</button>
<body>
<h1>
<script type="text/javascript">
karpartz.innerHTML = karpartz
ohio.innerHTML = ohio
curry.innerHTML = curry
invaid.innerHTML = invaid
</script>
</h1>
<script>
console.log("loading...")
function cantafford() {
alert("You cannot afford this.")
}
function oauwenzijkb() {
var denrs = document.getElementById('invadio');
var denrsss = document.getElementById('babiq');
var denrssss = document.getElementById('burgs');
denrs.style.display = 'none';
denrsss.style.display = 'none';
denrssss.style.display = 'none';
}
oauwenzijkb()
function hide2clickpower(){
var div19191919 = document.getElementById('2cpower')
div19191919.style.display = 'none';}
function hideburgers() {
var div5 = document.getElementById('unlockburgers');
var div6 = document.getElementById('burgs');
div5.style.display = 'none';
div6.style.display = 'block';
}
function hideinvade() {
var div = document.getElementById('unlockinvade');
div.style.display = 'none';
var div2 = document.getElementById('invadio');
div2.style.display = 'block';
}
function cool63473() {
var div3 = document.getElementById('unlockbbq');
div3.style.display = 'none';
var div4 = document.getElementById('babiq');
div4.style.display = 'block';
}
var cpower = 1
var burgers = 0
var bbq = 0
var invades = 0
var cars = 0
var hacks = 0
var hacked = 0
var files = 0
var leaked_files = files + (" lemonade stands")
document.getElementById("bargir").innerHTML = burgers + " burger restaurants"
document.getElementById("cawfee").innerHTML = bbq + " barbecue resturants"
document.getElementById("ohio").innerHTML = hacks + " bake sales"
document.getElementById("karpartz").innerHTML = leaked_files;
document.getElementById("curry").innerHTML = hacked + " food court stands";
document.getElementById("invaid").innerHTML = invades + " coffee shops";
function onButtonClick() {
if (event.target.id === "2cpower") {
if (files > 24){
cpower = cpower + 1
files = files - 25
leaked_files = files + (" lemonade stands")
document.getElementById("karpartz").innerHTML = leaked_files;
alert("2x clickpower!")
hide2clickpower()}
else{
cantafford()}
}
else if (event.target.id === "burgs") {
burgers = burgers + cpower
document.getElementById("bargir").innerHTML = burgers + " burger restaurants"
} else if (event.target.id === "unlockburgers") {
if (bbq > 49) {
hideburgers()
bbq = bbq - 50
document.getElementById("bargir").innerHTML = burgers + " burger restaurants"
alert("you can now buy burger restaurants!")
} else if (bbq < 50) {
cantafford()
}
} else if (event.target.id === "government") {
files = files + cpower
leaked_files = files + (" lemonade stands")
document.cookie = "files"
document.getElementById("karpartz").innerHTML = leaked_files;
} else if (event.target.id === "ohiow") {
hacks = hacks + cpower
document.getElementById("ohio").innerHTML = hacks + " bake sales";
} else if (event.target.id === "kar") {
cars = cars + cpower
document.getElementById("curry").innerHTML = cars + " food court stands";
} else if (event.target.id === "unlockinvade") {
if (files > 4) {
hideinvade()
files = files - 5
leaked_files = files + (" lemonade stands")
document.getElementById("karpartz").innerHTML = leaked_files;
alert("coffee shops now available!!")
} else if (5 > files) {
cantafford()
}
} else if (event.target.id === "invadio") {
invades = invades + cpower
document.getElementById("invaid").innerHTML = invades + (" coffee shops");
} else if (event.target.id === "unlockbbq") {
if (20 > invades) {
cantafford()
} else if (invades > 19) {
cool63473()
if (lemonlemon = 1){
invades = invades - 20
document.getElementById("invaid").innerHTML = invades + " coffee shops";
}
alert("barbecue resturants now available!")
}
} else if (event.target.id === "babiq") {
bbq = bbq + cpower
document.getElementById("cawfee").innerHTML = bbq + " barbecue resturants";
}
}
const buttons = document.querySelectorAll('button');
for (const button of buttons) {
button.addEventListener('click', onButtonClick);
}
console.log("loading complete!")
</script>
</body>
email [email protected] if you have ideas or to report bugs.
<header></header>
support my game
<a href="https://restauranttycoon.mysellix.io/">here</a>
</body>
<header></header>
<button id="dev">
this button does nothing and wastes your time
</button>
Any help is appreciated, thanks . Any help is appreciated, thanks . Any help is appreciated, thanks . Any help is appreciated, thanks . Any help is appreciated, thanks . Any help is appreciated, thanks . Any help is appreciated, thanks . Any help is appreciated, thanks .
