Make a sample XML document or JSON file with data for your game. For puzzles (word search, crossword, etc.), you should make an XML document or JSON file that includes the entire puzzle. For a game like Battleship, you could store game configuration data or a saved game.
Even though you might not be ready to incorporate all of the data from the XML or JSON in your project, your sample data should include enough information to be useful and show that you understand how to define nontrivial XML documents or JSON files with multiple elements or properties. Note that to receive full credit for this assignment, parsed data from the XML document or JSON file must be displayed in the game grid.
Use XMLHttpRequest to load your XML document or JSON file and then display data from the document in your game grid. Display the data in such a way that it's clear that your code has parsed the data. Include a readme.txt file that explains what information is from the XML document or JSON file and where that information is displayed. When I grade your assignment I will change the XML or JSON data and make sure that the changed data is loaded and displayed, so the readme.txt file should tell me where to find the XML or JSON file and where I can expect to see changes when I modify the file.
I suggest that you use the synchronous version of XMLHttpRequest for this assignment unless you have a particular reason for using the asynchronous version. The synchronous version is easier to use, and often there's nothing else to do while waiting for the server's response.
After loading an XML document you can use getElementsByTagName to get a list of XML elements of a particular type. You can also use DOM functions with XML in a way that's similar to using them with HTML.
You can see an example of loading and parsing JSON data on this page: http://universe.tc.uvu.edu/cs2550/notes/l9/AjaxDemo/index.html Look at the bottom of the page for the heading Synchronous POST.
Here is a link to a demo that shows how to load a local file with Ajax: Local file demo
Include a plain-text file in your zip file that explains how you used XML or JSON and how and where the data from the XML or JSON document is displayed on your game description page (index.html) or your game grid page. Make sure you include file names (and the location in a subdirectory, if appropriate) so that I can see and change the data in the file.
• Chrome will not load local files for XMLHttpRequests
because of the way it implements the same-origin policy.
I recommend that you use Firefox to test this assignment on Windows.
You can try running Chrome with the command-line option --allow-file-access-from-files When I first tried this it didn't work, but after reading this Stack Overflow page, it worked and I could load a local file: http://stackoverflow.com/questions/18586921/how-to-launch-html-using-chrome-at-allow-file-access-from-files-mode
To test this assignment with Safari on a Mac, you can follow the instructions on this web page for disabling local file restrictions: https://www.thepolyglotdeveloper.com/2014/08/bypass-cors-errors-testing-apis-locally/ You can also disable cross-origin restrictions in the Develop menu in Safari. Don't forget to re-enable the restrictions when you go back to regular web browsing.
• Be aware that when your code loads a local file, it will not get a status of 200, even when the data is successfully loaded. That's because the status code is set by the web server, and local files are not loaded from a web server. You will usually want to make sure that you get a status code of 200, but that will not work for this assignment. Because your program won't work if you check for a status code of 200, you will not receive full credit for this assignment if your code includes a check for a status code.
• I recommend that you use a synchronous XMLHttpRequest rather than asynchronous because it's simpler. In Firefox you will get a message saying that synchronous XMLHttpRequest on the main thread is deprecated. That's because the browser's user interface will be unusable until the request is finished, and a user might think the application isn't working right. For this class that isn't an issue.
• There is no easy way to update or modify an XML or JSON file without using server-side scripts.
• Loading local files with XMLHttpRequest is not a good practice for production web applications, but it works well for this class. It's very close to loading files from a web server, but is much easier to set up because it doesn't require a web server.
|25||XML document or JSON file with sample game data|
|30||Uses XMLHttpRequest to get data from XML document or JSON file and parses the XML or JSON|
|25||Displays parsed data from XML document or JSON file on game page or game description page|
|10||Displays parsed data from XML document or JSON file in the game grid.|
|10||Includes readme.txt file that explains how XML or JSON is used and where the information is displayed|
-10 points if the code does a check for a status code of 200 or any other value.