diff options
| -rw-r--r-- | doc/src/declarative/advtutorial.qdoc | 8 | ||||
| -rw-r--r-- | doc/src/declarative/advtutorial1.qdoc | 5 | ||||
| -rw-r--r-- | doc/src/declarative/advtutorial2.qdoc | 4 | ||||
| -rw-r--r-- | doc/src/declarative/advtutorial3.qdoc | 4 | ||||
| -rw-r--r-- | doc/src/declarative/advtutorial4.qdoc | 25 | ||||
| -rwxr-xr-x | examples/declarative/tutorials/samegame/samegame4/content/samegame.js | 4 |
6 files changed, 30 insertions, 20 deletions
diff --git a/doc/src/declarative/advtutorial.qdoc b/doc/src/declarative/advtutorial.qdoc index 21eab92..c796633 100644 --- a/doc/src/declarative/advtutorial.qdoc +++ b/doc/src/declarative/advtutorial.qdoc @@ -53,10 +53,10 @@ The results of the individual steps are in the $QTDIR/examples/declarative/tutor Tutorial chapters: \list -\o \l {advtutorial1}{Advanced Tutorial 1 - Basic Game Screen and Block} -\o \l {advtutorial2}{Advanced Tutorial 2 - Dynamically create the Blocks} -\o \l {advtutorial3}{Advanced Tutorial 3 - Implement the Game Logic} -\o \l {advtutorial4}{Advanced Tutorial 4 - Finishing Touches} +\o \l {Advanced Tutorial 1 - Creating the Game Canvas and Blocks} +\o \l {Advanced Tutorial 2 - Populating the Game Canvas} +\o \l {Advanced Tutorial 3 - Implementing the Game Logic} +\o \l {Advanced Tutorial 4 - Finishing Touches} \endlist */ diff --git a/doc/src/declarative/advtutorial1.qdoc b/doc/src/declarative/advtutorial1.qdoc index 1d47615..66fa607 100644 --- a/doc/src/declarative/advtutorial1.qdoc +++ b/doc/src/declarative/advtutorial1.qdoc @@ -42,8 +42,7 @@ /*! \page advtutorial1.html \example declarative/tutorials/samegame/samegame1 -\target advtutorial1 -\title Advanced Tutorial 1 - Creating the Game canvas and block +\title Advanced Tutorial 1 - Creating the Game Canvas and Blocks The first step is to create the items in your application. In Same Game we have a main game screen and the blocks that populate it. @@ -79,6 +78,6 @@ You should be familiar with all that goes on in these files so far. This is a very basic start and doesn't move at all - next we will populate the game canvas with some blocks. -[\l {advtutorial.html}{Advanced Tutorial}] [Next: \l {advtutorial2}{Advanced Tutorial 2}] +[\l {advtutorial.html}{Advanced Tutorial}] [Next: \l {Advanced Tutorial 2 - Populating the Game Canvas}] */ diff --git a/doc/src/declarative/advtutorial2.qdoc b/doc/src/declarative/advtutorial2.qdoc index 0265446..abfdbc6 100644 --- a/doc/src/declarative/advtutorial2.qdoc +++ b/doc/src/declarative/advtutorial2.qdoc @@ -41,7 +41,7 @@ /*! \page advtutorial2.html -\target advtutorial2 +\example declarative/tutorials/samegame/samegame2 \title Advanced Tutorial 2 - Populating the Game Canvas Now that we've written some basic elements, let's start writing the game. The @@ -103,6 +103,6 @@ by adding a script element to it. With those two changes, and the script file, you are now dynamically creating a field of blocks you can play with. They don't do anything now though; the next chapter will add the game mechanics. -[Previous: \l {advtutorial1}{Advanced Tutorial 1}] [\l {advtutorial.html}{Advanced Tutorial}] [Next: \l {advtutorial3}{Advanced Tutorial 3}] +[Previous: \l {Advanced Tutorial 1 - Creating the Game canvas and block}] [\l {advtutorial.html}{Advanced Tutorial}] [Next: \l {Advanced Tutorial 3 - Implementing the Game Logic}] */ diff --git a/doc/src/declarative/advtutorial3.qdoc b/doc/src/declarative/advtutorial3.qdoc index ea504aa..0d236e4 100644 --- a/doc/src/declarative/advtutorial3.qdoc +++ b/doc/src/declarative/advtutorial3.qdoc @@ -41,7 +41,7 @@ /*! \page advtutorial3.html -\target advtutorial3 +\example declarative/tutorials/samegame/samegame3 \title Advanced Tutorial 3 - Implementing the Game Logic To the \c initBoard function we added clearing the board beforehand, so that clicking new game won't leave the previous game @@ -111,7 +111,7 @@ The game works, but it's a little boring right now. Where's the smooth animated If you were a QML expert you could have written these in for the first iteration, but in this tutorial they've been saved until the next chapter - where your application becomes alive! -[Previous: \l {advtutorial2}{Advanced Tutorial 2}] [\l {advtutorial.html}{Advanced Tutorial}] [Next: \l {advtutorial4}{Advanced Tutorial 4}] +[Previous: \l {Advanced Tutorial 2 - Populating the Game Canvas}] [\l {advtutorial.html}{Advanced Tutorial}] [Next: \l {Advanced Tutorial 4 - Finishing Touches}] */ diff --git a/doc/src/declarative/advtutorial4.qdoc b/doc/src/declarative/advtutorial4.qdoc index 5f8c0e9..f4724d8 100644 --- a/doc/src/declarative/advtutorial4.qdoc +++ b/doc/src/declarative/advtutorial4.qdoc @@ -41,7 +41,7 @@ /*! \page advtutorial4.html -\target advtutorial4 +\example declarative/tutorials/samegame/samegame4 \title Advanced Tutorial 4 - Finishing Touches Now we're going to do two things to liven the game up. Animate the blocks and add a web-based high score system. @@ -118,17 +118,26 @@ player's actions. The end result is shown below: \image declarative-adv-tutorial4.gif +\section2 Offline High Scores +Another extension we might want for the game is some way of storing and retrieving high scores. This tutorial contains both online and offline high score storage. + +For better high score data, we want the name and time of the player. The time is obtained in the script fairly simply, but we +have to ask the player for their name. We thus re-use the dialog QML file to pop up a dialog asking for the player's name (and +if they exit this dialog without entering it they have a way to opt out of posting their high score). When the dialog is closed we store the name and high score, using the code below. + +\snippet declarative/tutorials/samegame/samegame4/content/samegame.js 2 + +For offline storage, we use the HTML 5 offline storage javascript API to maintain a persistant SQL database unique to this application. This first line in this function calls the function for the web-based high scores, described later, if it has been setup. Next we create an offline storage database for the high scores using openDatabase and prepare the data and SQL query that we want to use to save it. The offline storage API uses SQL queries for data manipulation and retrival, and in the db.transaction call we use three SQL queries to initialize the database (if necessary), and then add to and retrieve high scores. To use the returned data, we turn it into a string with one line per row returned, and show a dialog containing that string. For a more detailed explanation of the offline storage API in QML, consult the global object documentation. + +This is one way of storing and displaying high scores locally, but not the only way. A more complex alternative would have been to create a high score dialog component, and pass the results to it for processing and display (instead of resusing the Dialog). This would allow a more themable dialog that could present the high scores better. If your QML is the UI for a C++ application, you could also have passed the score to a C++ function to store it locally in a variety of ways, including a simple format without SQL. + \section2 Web-based High Scores -Another extension we might want for the game is some way of storing and retrieving high scores. In this tutorial we'll show you -how to integrate a web enabled high score storage into your QML application. The implementation we've done is very +You've seen how to store high scores locally, but it is also easy to integrate a web enabled high score storage into your QML application. This tutorial also shows you how to communicate the high scores to a web server. The implementation we've done is very simple - the high score data is posted to a php script running on a server somewhere, and that server then stores it and displays it to visitors. You could request an XML or QML file from that same server, which contained and displayed the scores, -but that's beyond the scope of this tutorial. +but that's beyond the scope of this tutorial. The php script we've used is available in the examples directory. -For better high score data, we want the name and time of the player. The time is obtained in the script fairly simply, but we -have to ask the player for their name. We thus re-use the dialog QML file to pop up a dialog asking for the player's name (and -if they exit this dialog without entering it they have a way to opt out of posting their high score). When the dialog is closed, if the player entered their name we can send the data to the web service in the following snippet out of the script file: \snippet declarative/tutorials/samegame/samegame4/content/samegame.js 1 @@ -145,5 +154,5 @@ By following this tutorial you've now ben shown how to write a fully functional written in a script file and with both many fluid animations and being web-enabled. Congratulations, you should now be skilled enough to write your own QML applications. -[Previous: \l {advtutorial3}{Advanced Tutorial 3}] [\l {advtutorial.html}{Advanced Tutorial}] +[Previous: \l {Advanced Tutorial 3 - Implementing the Game Logic}] [\l {advtutorial.html}{Advanced Tutorial}] */ diff --git a/examples/declarative/tutorials/samegame/samegame4/content/samegame.js b/examples/declarative/tutorials/samegame/samegame4/content/samegame.js index 58de55f..d5778fe 100755 --- a/examples/declarative/tutorials/samegame/samegame4/content/samegame.js +++ b/examples/declarative/tutorials/samegame/samegame4/content/samegame.js @@ -5,7 +5,7 @@ var maxY = 15; var maxIndex = maxX*maxY; var board = new Array(maxIndex); var tileSrc = "content/BoomBlock.qml"; -var scoresURL = "http://qtfx-nokia.trolltech.com.au/samegame/scores.php"; +//var scoresURL = "http://qtfx-nokia.trolltech.com.au/samegame/scores.php"; var scoresURL = ""; var timer; var component = createComponent(tileSrc); @@ -206,6 +206,7 @@ function createBlock(xIdx,yIdx){ return true; } +//![2] function saveHighScore(name) { if(scoresURL!="") sendHighScore(name); @@ -241,6 +242,7 @@ function saveHighScore(name) { } ); } +//![2] //![1] function sendHighScore(name) { |