MVC: Model Component

Free HTML5 Game Tutorial for Beginners: Page 21

Overview XML Local Storage Summary JavaScript Model Code
Open File Folder for Model Storage

Overview

This article provides an overview of the model component in the Model-View-Controller Design Pattern. The concepts serve as a building block for any game. This tutorial discusses the purpose of the model component in the Surface Game. This lesson lists model functionality, per file, for the example Surface Game.

The file, surface-game-model.js includes the JavaScript source code for the Surface Game's model. The controller calls functions within the model to load, save and restore data. The model saves and restores information during game play, including the score, level, and question number. The model also loads an XML file and returns an XML DOM object, per level in the game. The controller retrieves questions for each level from the XML file. See the How to Parse XML with JavaScript tutorial for details.

XML

Each XML file contains questions, answers, and graphics for one level in the game. See the Create an XML File tutorial to learn about preparing XML files which store information for a game. See the Create a Document Type Definition (DTD) tutorial to learn about the Document Type Definition for XML files. See the How to Parse XML with JavaScript tutorial to learn about loading and parsing XML files for the game.

Local Storage

The score, level, and question number are saved and restored with local storage if it's available, otherwise the model uses cookies. See the Save and Restore with Local Storage tutorial to learn about local storage features.

Summary

This article provided an overview of the model component in the Model-View-Controller Design Pattern. The concepts serve as a building block for any game. This tutorial discussed the purpose of the model component in the Surface Game. This lesson lists model functionality, per file, for the example Surface Game.

The file, surface-game-model.js includes the JavaScript source code for the Surface Game's model. The controller calls functions within the model to load, save and restore data. The model saves and restores information during game play, including the score, level, and question number. The model also loads an XML file and returns an XML DOM object, per level in the game. The controller retrieves questions for each level from the XML file. See the How to Parse XML with JavaScript tutorial for details.

For the next tutorial, tap the image icon containing text which says Next Lesson, or the right pointing arrow at the bottom of the page.

Previous Page Next Page
Copyright © 2015 Seven Thunder Software. All Rights Reserved.