Hi stackoverflow community, I have an HTML, XML, JS related problem...
Im learning a bit of web programming languages and as a project I started making a JS-based browser game. On an earlier project, I had some trouble when I wanted to save the Highscores to a MySQL database (from JS variable to php variable). In the end, I found a way to avoid this by placing the scores in a hidden div, and by using HTML DOM placing the score in a form (JS -> PHP -> MySQL).
Now, on this project, I started using this technique to avoid a lot of JS-scripting, and using the hidden div as a sort of temporary memory. But it turned out to be some very messy code so I wanted to try using XML for putting temporary data away. I checked out the W3-schools site and adapted my code.
The game is a sort of turn-price game (very simple), where each 'day' prices get renewed and you make money by selling stuff you bought a day earlier at a cheaper price. I wanted to save the prices of the day earlier, to make a 'Your profit is: $ .....' menu. So, I thought putting the data in an XML file, so I could easily save the data and recall it later.
Now the problem is, that the data doesn't get saved at all. When I leave a JS-function, the XML-file is 'reset', all the data is lost... How can I save the XML file on the server?
Just to make things clear, I added my code, but I know it is very messy (first time I use XML :)... So I added some comments, I hope it helps. To make the problem concrete: when the nextDay() function fires, it should save the prices from the previous day, and then renew the prices, but they don't get saved.
PriceGame /* Function to randomise the prices at the start of a new day */
function randomPrice(n){
var price;
var R;
var P;
P = n * ((Math.random() * 4) / 10)
R = Math.random();
if (R > .5) {
price = n + P;
price = price.toFixed(2);
return price;
}
if (R < .5) {
price = n - P;
price = price.toFixed(2);
return price;
}
}
/* Function that fires when an user clicks on a 'Next day'-button, the prices get reset */
function nextDay(){
/* Acces XML file */
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", "XML.xml", false);
xmlhttp.send();
xmlDoc = xmlhttp.responseXML;
/* ERROR: Saving the prices from the day earlier, but this doesn't work */
for (i = 0; i < 26; i++) { /* loop for selecting all of the 26 products */
x = xmlDoc.getElementsByTagName("pricetoday")[i].childNodes[0];
price = x.nodeValue;
x = xmlDoc.getElementsByTagName('priceyesterday')[i].childNodes[0];
x.nodeValue = price;
}
/* I was checking if I could request the values from the XML file by putting them in a div, just to see if it works, but i keep on getting a my 'Null' default value ... */
x = xmlDoc.getElementsByTagName('priceyesterday')[i].childNodes[0];
priceYesterday = x.nodeValue;
document.getElementById(i+27).innerHTML = priceYesterday; /* Puts prices Yesterday in a div */
/* Renewal of prices */
for (i = 0; i < 26; i++) {
x = xmlDoc.getElementsByTagName('pricebase')[i].childNodes[0]; /* the basic price is selected for each product */
basePrice = x.nodeValue;
n = parseFloat(basePrice);
randomisedPrice = randomPrice(n); /* The basic price is randomised, added or substracted 40% */
x = xmlDoc.getElementsByTagName('pricetoday')[i].childNodes[0]; /* Saves prices in XML file */
x.nodeValue = randomisedPrice;
}
/* Display price and product */
for (i = 0; i < 26; i++) {
x = xmlDoc.getElementsByTagName("product")[i].childNodes[0]; /* Selects productsname, maybe unnessecary, but is saves some HTML code */
product = x.nodeValue;
x = xmlDoc.getElementsByTagName("pricetoday")[i].childNodes[0];
price = x.nodeValue;
document.getElementById(i + 1).innerHTML = product + ": $" + price; /* Displays products and according price */
}
/* adds a day */
x = xmlDoc.getElementsByTagName('day')[0].childNodes[0];
xparsed = parseFloat(x.nodeValue);
dayAdded = xparsed + 1;
x.nodeValue = dayAdded;
document.getElementById('daycount').innerHTML = dayAdded; /* Displays the number of days passed */
}
/* Function that fires onload, sets the day-count to 1 and resets the prices to random values */
function newDay(){
/* Acces XML file */
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
}
else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET", "XML.xml", false);
xmlhttp.send();
xmlDoc = xmlhttp.responseXML;
/* Renewal of prices */
for (i = 0; i < 26; i++) {
x = xmlDoc.getElementsByTagName('pricebase')[i].childNodes[0];
basePrice = x.nodeValue;
n = parseFloat(basePrice);
randomisedPrice = randomPrice(n);
x = xmlDoc.getElementsByTagName('pricetoday')[i].childNodes[0];
x.nodeValue = randomisedPrice;
}
/* Display price and product */
for (i = 0; i < 26; i++) {
x = xmlDoc.getElementsByTagName("product")[i].childNodes[0];
product = x.nodeValue;
x = xmlDoc.getElementsByTagName("pricetoday")[i].childNodes[0];
price = x.nodeValue;
document.getElementById(i + 1).innerHTML = product + ": $" + price;
}
/* set daycounter to 1 */
x = xmlDoc.getElementsByTagName("day")[0].childNodes[0];
x.nodeValue = 1;
}
</script>