Printable Version of Topic
Click here to view this topic in its original format
HTMLHelp Forums _ Client-side Scripting _ Having trouble with Save and Load Game Function
Posted by: AngusmcFangus Jan 4 2017, 03:31 PM
I have a save and load function with a button.
here are the functions for the save and load
function Save() {
localStorage.setItem("cash", cash);
localStorage.setItem("god", god);
}
function Load() {
cash = localStorage.getItem("cash", cash);
cash = parseInt(cash);
god = localStorage.getItem("god", god);
god = parseInt(god);
document.getElementById('text').value = god;
document.getElementById('text').value = cash;
}
The Load is the one I am having a problem with.
It works in the sense that it recognizes that it saved the item, but it doesn't update the amount it has
Ex
Buy God
God Cost 1000000
God's 0
yet even when it says that It knows there is something there. When I buy another god it does this
Buy God
God Cost 1440000
God's 2
Here is the God Function and button
Button
<a href="#"><button style="background-color: transparent;color: white"button onclick="buygod()">Buy Candy God</button><span style="font-size:12px;cursor:pointer"><br /><p3> There Can only be one god... Right?<p3>
<br />
Candy God's: <span id="god">0</span>
<br />
Candy God Cost: $ <span id="godCost">1000000</span>
<br /></a>
Function
var god = 0;
function buygod(){
var godCost = Math.floor(1000000 * Math.pow(1.2,god)); //works out the cost of this cursor
if(cash >= godCost){ //checks that the player can afford the cursor
god = god + 1; //increases number of cursors
cash = cash - godCost; //removes the cookies spent
document.getElementById('god').innerHTML = god; //updates the number of cursors for the user
document.getElementById('cash').innerHTML = cash; //updates the number of cookies for the user
};
var nextCost = Math.floor(1000000 * Math.pow(1.2,god)); //works out the cost of the next cursor
document.getElementById('godCost').innerHTML = nextCost; //updates the cursor cost for the user
};
window.setInterval(function(){
candyClick(god);
}, .000000000000001);
Before the save
after saving, rerunning the code, and loading
I ran out of space for another screen shot, but after buying one more upgrade it jumps up to two.
Any Suggestions and or answers would be very helpful!
Posted by: CharlesEF Jan 4 2017, 06:17 PM
You're saving both 'cash' and 'god' values in the same element:
document.getElementById('text').value = cash;
Posted by: AngusmcFangus Jan 4 2017, 07:48 PM
You're saving both 'cash' and 'god' values in the same element:
document.getElementById('text').value = cash;
I am still new to coding, so can you expand more on the 2 elements part. Do you mean when I put the "text" part in?
Posted by: pandy Jan 4 2017, 08:33 PM
Somewhere in the HTML you have an element with the id 'text', probably an INPUT. First you say "make the value of that input what's in the varable god'. Directly after you say "make the value of the same input what's in the variable cash'. Only the latter will show up.
You need two inputs with different IDs. Then you need to change the JavaScript so each line only targets one of them.
document.getElementById('something_else').value = cash;
You can use innerHTML instead of value. That way you don't need do have an input in the HTML. You can use any HTML element.
Posted by: AngusmcFangus Jan 5 2017, 10:22 AM
Somewhere in the HTML you have an element with the id 'text', probably an INPUT. First you say "make the value of that input what's in the varable god'. Directly after you say "make the value of the same input what's in the variable cash'. Only the latter will show up.
You need two inputs with different IDs. Then you need to change the JavaScript so each line only targets one of them.
document.getElementById('something_else').value = cash;
You can use innerHTML instead of value. That way you don't need do have an input in the HTML. You can use any HTML element.
Thank you for helping me with that, but ut us still bugging out with the same thing I was having trouble with earlier. It doesn't update the amount after rerunning the code
Posted by: pandy Jan 5 2017, 10:41 AM
Show your stuff then. Both JS and HTML. Link to the page if possible.
Posted by: AngusmcFangus Jan 6 2017, 09:03 AM
Show your stuff then. Both JS and HTML. Link to the page if possible.
https://docs.google.com/a/isd624.org/document/d/1vxrulhRYYLnjQOr70oX1Aoy4wlV8TOpBv_OaMH2yPx8/edit?usp=sharing
post it into this link
http://www.w3schools.com/graphics/tryit.asp?filename=trygame_default_gravity
Posted by: pandy Jan 6 2017, 11:57 AM
You have so many errors in the HTML alone that that could be reason enough. It isn't. But you should fix them. Use https://validator.w3.org/ . To start with you can't invent your own elements, like P3 and H1.5...
The CSS is better, but there still are error. Fix those too. Use this for help finding them: https://jigsaw.w3.org/css-validator/ .
Point is, if you apply CSS or JS to messy HTML there is no way to know what happens.
But, I think your main problem is the below CSS rule. It makes everything disappear. Removing the lines I've commented out at least makes the block appear again.
height: 100%;
/* width: 0; */
position: fixed;
z-index: 1;
top: 0;
left: 400px;
background-color: #111;
/* overflow-x: hidden; */
transition: 0.5s;
padding-top: 60px;
}
http://www.w3schools.com/graphics/tryit.as...default_gravity
Didn't understand that.
Posted by: AngusmcFangus Jan 6 2017, 02:38 PM
You have so many errors in the HTML alone that that could be reason enough. It isn't. But you should fix them. Use https://validator.w3.org/ . To start with you can't invent your own elements, like P3 and H1.5...
The CSS is better, but there still are error. Fix those too. Use this for help finding them: https://jigsaw.w3.org/css-validator/ .
Point is, if you apply CSS or JS to messy HTML there is no way to know what happens.
But, I think your main problem is the below CSS rule. It makes everything disappear. Removing the lines I've commented out at least makes the block appear again.
height: 100%;
/* width: 0; */
position: fixed;
z-index: 1;
top: 0;
left: 400px;
background-color: #111;
/* overflow-x: hidden; */
transition: 0.5s;
padding-top: 60px;
}
http://www.w3schools.com/graphics/tryit.as...default_gravity
Didn't understand that.
Thanks for the suggestion. The link was for the place im using the code in. It runs your code for you. When I removed the Overflow part it removed my side bar completely
This is what happened
Heres link again just in case http://www.w3schools.com/graphics/tryit.asp?filename=trygame_default_gravity
Posted by: pandy Jan 6 2017, 03:30 PM
The link was for the place im using the code in. It runs your code for you.
It wasn't there at all to start with. Now you at least see parts of it. If you remove the rule altogether everything is there, but obviously not styled as you want it to be.
/* .sidenav {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
top: 0;
left: 400px;
background-color: #111;
overflow-x: hidden;
transition: 0.5s;
padding-top: 60px;
} */
The positioning needs to be adopted to the rest of your layout. But I don't know where you want the sidebar to be and how you want it to look. As said, the HTML is so messy that I don't even know where to begin. Clean things up to start with.
Posted by: AngusmcFangus Jan 6 2017, 04:08 PM
The link was for the place im using the code in. It runs your code for you.
It wasn't there at all to start with. Now you at least see parts of it. If you remove the rule altogether everything is there, but obviously not styled as you want it to be.
/* .sidenav {
height: 100%;
width: 0;
position: fixed;
z-index: 1;
top: 0;
left: 400px;
background-color: #111;
overflow-x: hidden;
transition: 0.5s;
padding-top: 60px;
} */
The positioning needs to be adopted to the rest of your layout. But I don't know where you want the sidebar to be and how you want it to look. As said, the HTML is so messy that I don't even know where to begin. Clean things up to start with.
It is there when you hit the button called "Upgrades"
I don't really know how to clean it up because that is how I learned to do it.
Posted by: pandy Jan 7 2017, 12:48 AM
It is there when you hit the button called "Upgrades"
I see. I guess I misunderstood the problem. Exactly what is it that doesn't show up now? What part of the JS?
You'll have to unlearn then.
Posted by: AngusmcFangus Jan 7 2017, 07:35 PM
It is there when you hit the button called "Upgrades"
I see. I guess I misunderstood the problem. Exactly what is it that doesn't show up now? What part of the JS?
You'll have to unlearn then.
When you save the game after lets say 2 workers...
after you rerun the code (refresh) and hit load the 2 workers that the game knows you have don't show up
Posted by: pandy Jan 7 2017, 08:49 PM
I can't even start the game.
Posted by: AngusmcFangus Jan 8 2017, 05:15 PM
I can't even start the game.
thats weird I have been on it for the past few hours
Are you sure your using the w3schools link I gave earlier?
Posted by: AngusmcFangus Jan 13 2017, 08:30 AM
I guess this topic is getting old now, with no new items that may help, but Thanks for all the feedback that you did give me. I really appreciated it.
Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)