Tag Archives: dice_game

Changing standards

I was just playing my Generic Dice Game to pass some time, and I noticed the high score board wasn’t updating properly anymore. The high score board is fetched from the server by an AJAX request, so that the board can be updated seamlessly after the user submits a new score. After looking into the code it turns out the AJAX request was:

xmlhttp_score_threshold.open('GET', 'http://www.aidansean.com/dice_game/scores.php?task=get_highscore_threshold&sid=' + Math.random(),true) ;

whereas it should have read:

xmlhttp_score_threshold.open('GET', 'scores.php?task=get_highscore_threshold&sid=' + Math.random(),true) ;

As a result it was being caught out by the same origin policy. This is a pernicious bug because technically it raises no alarms. The AJAX request is successfully sent and the reply is successfully received, however the client is not allowed to read the response text. The high scores table get successfully updated on the server, so from the point of view of both the client and the server everything works without any problems, and I’m left scratching my head as to what went wrong.

It was only when I tried to access the page directly and found a beautifully formatted HTML table that I realised something was amiss. A direct request works whereas an AJAX request doesn’t? It seems like a change in browser behaviour, as this used to work in Firefox, but looking for changelogs online has not brought up any useful information. After consulting Stack Overflow it turns out the standards were tightened slightly around two years ago, which would account for the change in behaviour.

So this is simply a cautionary tale. Even though the code you write may work at the time, the standards can change under your feet, leading to compatibility problems in the future! Right now about 5% of my projects are suffering from some form of standards change or another, and need some non-urgent fixes.

Generic dice game

This project is a rewrite of a previous project It emulates the popular dice game, Yahtzee. This game previusly used PHP, but was converted to Javascript once I became sufficiently skilled to rewrite it.

Links

Live page
GitHub repository

Overview

The user clicks to roll the dice, with the interactions being detected by event listeners. As the user fills in the scores the corresponding boxes are removed via the DOM. Users can submit scores via AJAX which are then stored in a MySQL table.

Challenges

Challenge: This page requires dynamic HTML content to allow the buttons to be removed as the user clicks them, and added as the game is reset.
Solution: This is simply achieved using the HTML DOM. (Resolved)

Sample output

Generic dice game
Generic dice game