More tutorial improvments

9 files changed, 121 insertions, 131 deletions

diff --git a/doc/src/declarative/advtutorial.qdoc b/doc/src/declarative/advtutorial.qdoc
index 598f47b..4d3bfa8 100644
--- a/doc/src/declarative/advtutorial.qdoc
+++ b/doc/src/declarative/advtutorial.qdoc
@@ -160,18 +160,20 @@ we cannot use \l Repeater to define the blocks. Instead, we will
 create the blocks in JavaScript.
 
 Here is the JavaScript code for generating the blocks, contained in a new
-file, \c samegame.js:
+file, \c samegame.js. The code is explained below.
 
 \snippet declarative/tutorials/samegame/samegame2/samegame.js 0
 
-The main function here is \c initBoard(). It creates an array to store all the game
-blocks, then calls \c createBlock() to create enough blocks to fill the game canvas.
+The \c startNewGame() function deletes the blocks created in the previous game and
+calculates the number of rows and columns of blocks required to fill the game window for the new game.
+Then, it creates an array to store all the game
+blocks, and calls \c createBlock() to create enough blocks to fill the game window.
 
-The \c createBlock() function creates a block using the \c Block.qml file
+The \c createBlock() function creates a block from the \c Block.qml file
 and moves the new block to its position on the game canvas. This involves several steps:
 
 \list
-\o \l {createComponent(url file)} is called to generate an element from \c Block.qml.
+\o \l {createComponent(url file)}{createComponent()} is called to generate an element from \c Block.qml.
    If the component is ready, we can call \c createObject() to create an instance of the \c Block item.
    (If a component is loaded remotely - over HTTP for example - then we would have to wait for the
    component to finish loading before calling \c createObject()).
@@ -193,13 +195,13 @@ the JavaScript file as a \l{Modules#QML Modules}{module}:
 \snippet declarative/tutorials/samegame/samegame2/samegame.qml 2
 
 This allows us to refer to any functions within \c samegame.js using "SameGame"
-as a prefix: for example, \c SameGame.initBoard() or \c SameGame.createBlock().  
-This means we can now connect the New Game button's \c onClicked handler to the \c initBoard()
+as a prefix: for example, \c SameGame.startNewGame() or \c SameGame.createBlock().  
+This means we can now connect the New Game button's \c onClicked handler to the \c startNewGame()
 function, like this:
 
 \snippet declarative/tutorials/samegame/samegame2/samegame.qml 1
 
-So, when you click the New Game button, \c initBoard() is called and generates a field of blocks, like this:
+So, when you click the New Game button, \c startNewGame() is called and generates a field of blocks, like this:
 
 \image declarative-adv-tutorial2.png
 
@@ -247,7 +249,7 @@ To make it easier for the JavaScript code to interface with the QML elements, we
 The \c gameCanvas item is the exact size of the board, and has a \c score property and a \l MouseArea for input.
 The blocks are now created as its children, and its dimensions are used to determine the board size so that
 the application scales to the available screen size.
-Since its size is bound to a multiple of \c tileSize, \c tileSize needs to be moved out of \c samegame.js and into \c samegame.qml as a QML property.
+Since its size is bound to a multiple of \c blockSize, \c blockSize needs to be moved out of \c samegame.js and into \c samegame.qml as a QML property.
 Note that it can still be accessed from the script.
 
 The \l MouseArea simply calls \c{handleClick()} in \c samegame.js, which determines whether the player's click should cause any blocks to be removed, and updates \c gameCanvas.score with the current score if necessary. Here is the \c handleClick() function:
@@ -258,7 +260,7 @@ Note that if \c score was a global variable in the \c{samegame.js} file you woul
 
 \section3 Updating the score
 
-When the player clicks a block and triggers \c handleClick(), \c handleClick() also calls victoryCheck() to update the score and to check whether the player has completed the game. Here is the \c victoryCheck() code:
+When the player clicks a block and triggers \c handleClick(), \c handleClick() also calls \c victoryCheck() to update the score and to check whether the player has completed the game. Here is the \c victoryCheck() code:
 
 \snippet declarative/tutorials/samegame/samegame3/samegame.js 2
 
@@ -287,7 +289,7 @@ Here is a screenshot of what has been accomplished so far:
 
 \image declarative-adv-tutorial3.png
 
-Here is the QML code as it is now in \c samegame.qml:
+This is what \c samegame.qml looks like now:
 
 \snippet declarative/tutorials/samegame/samegame3/samegame.qml 0
 
@@ -439,7 +441,7 @@ By following this tutorial you've seen how you can write a fully functional appl
 \o Build your application with \l {{QML Elements}}{QML elements}
 \o Add application logic \l{Integrating JavaScript}{with JavaScript code}
 \o Add animations with \l {Behavior}{Behaviors} and \l{QML States}{states}
-\o Store persistent application data through online and offline methods
+\o Store persistent application data using the \l{Offline Storage API} or \l XMLHttpRequest
 \endlist
 
 There is so much more to learn about QML that we haven't been able to cover in this tutorial. Check out all the
diff --git a/examples/declarative/tutorials/samegame/samegame2/samegame.js b/examples/declarative/tutorials/samegame/samegame2/samegame.js
index d7cbd8d..3f12561 100644
--- a/examples/declarative/tutorials/samegame/samegame2/samegame.js
+++ b/examples/declarative/tutorials/samegame/samegame2/samegame.js
@@ -1,11 +1,9 @@
 //![0]
-//Note that X/Y referred to here are in game coordinates
-var maxColumn = 10;//Nums are for tileSize 40
+var blockSize = 40;
+var maxColumn = 10;
 var maxRow = 15;
-var tileSize = 40;
 var maxIndex = maxColumn*maxRow;
 var board = new Array(maxIndex);
-var tileSrc = "Block.qml";
 var component;
 
 //Index function used instead of a 2D array
@@ -13,17 +11,17 @@ function index(column,row) {
     return column + (row * maxColumn);
 }
 
-function initBoard()
+function startNewGame()
 {
-    //Delete old blocks
+    //Delete blocks from previous game
     for(var i = 0; i<maxIndex; i++){
         if(board[i] != null)
             board[i].destroy();
     }
 
     //Calculate board size
-    maxColumn = Math.floor(background.width/tileSize);
-    maxRow = Math.floor(background.height/tileSize);
+    maxColumn = Math.floor(background.width/blockSize);
+    maxRow = Math.floor(background.height/blockSize);
     maxIndex = maxRow*maxColumn;
 
     //Initialize Board
@@ -38,12 +36,11 @@ function initBoard()
 
 function createBlock(column,row){
     if(component==null)
-        component = createComponent(tileSrc);
+        component = createComponent("Block.qml");
 
-    // Note that we don't wait for the component to become ready. This will
-    // only work if the block QML is a local file. Otherwise the component will
-    // not be ready immediately. There is a statusChanged signal on the
-    // component you could use if you want to wait to load remote files.
+    // Note that if Block.qml was not a local file, component.isReady would be
+    // false and we should wait for the component's statusChanged() signal to
+    // know when the file is downloaded and fully loaded before calling createObject().
     if(component.isReady){
         var dynamicObject = component.createObject();
         if(dynamicObject == null){
@@ -52,12 +49,12 @@ function createBlock(column,row){
             return false;
         }
         dynamicObject.parent = background;
-        dynamicObject.x = column*tileSize;
-        dynamicObject.y = row*tileSize;
-        dynamicObject.width = tileSize;
-        dynamicObject.height = tileSize;
+        dynamicObject.x = column*blockSize;
+        dynamicObject.y = row*blockSize;
+        dynamicObject.width = blockSize;
+        dynamicObject.height = blockSize;
         board[index(column,row)] = dynamicObject;
-    }else{//isError or isLoading
+    }else{
         print("error loading block component");
         print(component.errorsString());
         return false;
diff --git a/examples/declarative/tutorials/samegame/samegame2/samegame.qml b/examples/declarative/tutorials/samegame/samegame2/samegame.qml
index d98d383..e0706c2 100644
--- a/examples/declarative/tutorials/samegame/samegame2/samegame.qml
+++ b/examples/declarative/tutorials/samegame/samegame2/samegame.qml
@@ -27,7 +27,7 @@ Rectangle {
 
 //![1]
         Button {
-            text: "New Game"; onClicked: SameGame.initBoard();
+            text: "New Game"; onClicked: SameGame.startNewGame();
             anchors.left: parent.left; anchors.leftMargin: 3
             anchors.verticalCenter: parent.verticalCenter
         }
diff --git a/examples/declarative/tutorials/samegame/samegame3/Dialog.qml b/examples/declarative/tutorials/samegame/samegame3/Dialog.qml
index 6c358d6..a76b517 100644
--- a/examples/declarative/tutorials/samegame/samegame3/Dialog.qml
+++ b/examples/declarative/tutorials/samegame/samegame3/Dialog.qml
@@ -12,7 +12,7 @@ Rectangle {
         page.opacity = 1;
     }
     signal closed();
-    color: "white"; border.width: 1; width: dialogText.width + 20; height: 60;
+    color: "white"; border.width: 1; width: dialogText.width + 20; height: dialogText.height + 20;
     opacity: 0
     Behavior on opacity { 
         NumberAnimation { duration: 1000 }
diff --git a/examples/declarative/tutorials/samegame/samegame3/samegame.js b/examples/declarative/tutorials/samegame/samegame3/samegame.js
index 432e88f..9620e25 100644
--- a/examples/declarative/tutorials/samegame/samegame3/samegame.js
+++ b/examples/declarative/tutorials/samegame/samegame3/samegame.js
@@ -1,10 +1,8 @@
 /* This script file handles the game logic */
-//Note that X/Y referred to here are in game coordinates
-var maxColumn = 10;//Nums are for tileSize 40
+var maxColumn = 10;
 var maxRow = 15;
 var maxIndex = maxColumn*maxRow;
 var board = new Array(maxIndex);
-var tileSrc = "Block.qml";
 var component;
 
 //Index function used instead of a 2D array
@@ -12,11 +10,11 @@ function index(column,row) {
     return column + (row * maxColumn);
 }
 
-function initBoard()
+function startNewGame()
 {
     //Calculate board size
-    maxColumn = Math.floor(gameCanvas.width/gameCanvas.tileSize);
-    maxRow = Math.floor(gameCanvas.height/gameCanvas.tileSize);
+    maxColumn = Math.floor(gameCanvas.width/gameCanvas.blockSize);
+    maxRow = Math.floor(gameCanvas.height/gameCanvas.blockSize);
     maxIndex = maxRow*maxColumn;
 
     //Close dialogs
@@ -35,12 +33,11 @@ function initBoard()
 
 function createBlock(column,row){
     if(component==null)
-        component = createComponent(tileSrc);
+        component = createComponent("Block.qml");
 
-    // Note that we don't wait for the component to become ready. This will
-    // only work if the block QML is a local file. Otherwise the component will
-    // not be ready immediately. There is a statusChanged signal on the
-    // component you could use if you want to wait to load remote files.
+    // Note that if Block.qml was not a local file, component.isReady would be
+    // false and we should wait for the component's statusChanged() signal to
+    // know when the file is downloaded and fully loaded before calling createObject().
     if(component.isReady){
         var dynamicObject = component.createObject();
         if(dynamicObject == null){
@@ -50,12 +47,12 @@ function createBlock(column,row){
         }
         dynamicObject.type = Math.floor(Math.random() * 3);
         dynamicObject.parent = gameCanvas;
-        dynamicObject.x = column*gameCanvas.tileSize;
-        dynamicObject.y = row*gameCanvas.tileSize;
-        dynamicObject.width = gameCanvas.tileSize;
-        dynamicObject.height = gameCanvas.tileSize;
+        dynamicObject.x = column*gameCanvas.blockSize;
+        dynamicObject.y = row*gameCanvas.blockSize;
+        dynamicObject.width = gameCanvas.blockSize;
+        dynamicObject.height = gameCanvas.blockSize;
         board[index(column,row)] = dynamicObject;
-    }else{//isError or isLoading
+    }else{
         print("error loading block component");
         print(component.errorsString());
         return false;
@@ -63,19 +60,19 @@ function createBlock(column,row){
     return true;
 }
 
-var fillFound;//Set after a floodFill call to the number of tiles found
+var fillFound;//Set after a floodFill call to the number of blocks found
 var floodBoard;//Set to 1 if the floodFill reaches off that node
-//NOTE: Be careful with vars named x,y, as the calling object's x,y are still in scope
+
 //![1]
-function handleClick(x,y)
+function handleClick(xPos,yPos)
 {
-    var column = Math.floor(x/gameCanvas.tileSize);
-    var row = Math.floor(y/gameCanvas.tileSize);
+    var column = Math.floor(xPos/gameCanvas.blockSize);
+    var row = Math.floor(yPos/gameCanvas.blockSize);
     if(column >= maxColumn || column < 0 || row >= maxRow || row < 0)
         return;
     if(board[index(column, row)] == null)
         return;
-    //If it's a valid tile, remove it and all connected (does nothing if it's not connected)
+    //If it's a valid block, remove it and all connected (does nothing if it's not connected)
     floodFill(column,row, -1);
     if(fillFound <= 0)
         return;
@@ -108,7 +105,7 @@ function floodFill(column,row,type)
     floodFill(column,row+1,type);
     floodFill(column,row-1,type);
     if(first==true && fillFound == 0)
-        return;//Can't remove single tiles
+        return;//Can't remove single blocks
     board[index(column,row)].opacity = 0;
     board[index(column,row)] = null;
     fillFound += 1;
@@ -125,7 +122,7 @@ function shuffleDown()
             }else{
                 if(fallDist > 0){
                     var obj = board[index(column,row)];
-                    obj.y += fallDist * gameCanvas.tileSize;
+                    obj.y += fallDist * gameCanvas.blockSize;
                     board[index(column,row+fallDist)] = obj;
                     board[index(column,row)] = null;
                 }
@@ -143,7 +140,7 @@ function shuffleDown()
                     var obj = board[index(column,row)];
                     if(obj == null)
                         continue;
-                    obj.x -= fallDist * gameCanvas.tileSize;
+                    obj.x -= fallDist * gameCanvas.blockSize;
                     board[index(column-fallDist,row)] = obj;
                     board[index(column,row)] = null;
                 }
@@ -155,20 +152,21 @@ function shuffleDown()
 //![2]
 function victoryCheck()
 {
-    //awards bonuses for no tiles left
+    //Award bonus points if no blocks left
     var deservesBonus = true;
     for(var column=maxColumn-1; column>=0; column--)
         if(board[index(column, maxRow - 1)] != null)
             deservesBonus = false;
     if(deservesBonus)
         gameCanvas.score += 500;
-    //Checks for game over
+
+    //Check whether game has finished
     if(deservesBonus || !(floodMoveCheck(0,maxRow-1, -1)))
         dialog.show("Game Over. Your score is " + gameCanvas.score);
 }
 //![2]
 
-//only floods up and right, to see if it can find adjacent same-typed tiles 
+//only floods up and right, to see if it can find adjacent same-typed blocks 
 function floodMoveCheck(column, row, type)
 {
     if(column >= maxColumn || column < 0 || row >= maxRow || row < 0)
diff --git a/examples/declarative/tutorials/samegame/samegame3/samegame.qml b/examples/declarative/tutorials/samegame/samegame3/samegame.qml
index 9623932..cdf99d7 100644
--- a/examples/declarative/tutorials/samegame/samegame3/samegame.qml
+++ b/examples/declarative/tutorials/samegame/samegame3/samegame.qml
@@ -21,11 +21,11 @@ Rectangle {
         Item {
             id: gameCanvas
             property int score: 0
-            property int tileSize: 40
+            property int blockSize: 40
 
             z: 20; anchors.centerIn: parent
-            width: parent.width - (parent.width % tileSize);
-            height: parent.height - (parent.height % tileSize);
+            width: parent.width - (parent.width % blockSize);
+            height: parent.height - (parent.height % blockSize);
 
             MouseArea {
                 anchors.fill: parent; onClicked: SameGame.handleClick(mouse.x,mouse.y);
@@ -45,7 +45,7 @@ Rectangle {
         anchors.bottom: screen.bottom
 
         Button {
-            text: "New Game"; onClicked: SameGame.initBoard();
+            text: "New Game"; onClicked: SameGame.startNewGame();
             anchors.left: parent.left; anchors.leftMargin: 3
             anchors.verticalCenter: parent.verticalCenter
         }
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml b/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml
index 0716bb3..15f5b19 100644
--- a/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml
+++ b/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml
@@ -11,7 +11,7 @@ Rectangle {
         page.opacity = 1;
     }
     signal closed();
-    color: "white"; border.width: 1; width: dialogText.width + 20; height: 60;
+    color: "white"; border.width: 1; width: dialogText.width + 20; height: dialogText.height + 20;
     opacity: 0
     Behavior on opacity { 
         NumberAnimation { duration: 1000 }
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/samegame.js b/examples/declarative/tutorials/samegame/samegame4/content/samegame.js
index a905f7d..0b1c6d6 100755
--- a/examples/declarative/tutorials/samegame/samegame4/content/samegame.js
+++ b/examples/declarative/tutorials/samegame/samegame4/content/samegame.js
@@ -1,38 +1,28 @@
 /* This script file handles the game logic */
-//Note that X/Y referred to here are in game coordinates
-var maxColumn = 10;//Nums are for gameCanvas.tileSize 40
+var maxColumn = 10;
 var maxRow = 15;
 var maxIndex = maxColumn*maxRow;
 var board = new Array(maxIndex);
-var tileSrc = "content/BoomBlock.qml";
-//var scoresURL = "http://qtfx-nokia.trolltech.com.au/samegame/scores.php";
+var component;
 var scoresURL = "";
-var timer;
-var component = createComponent(tileSrc);
+var gameDuration;
 
 //Index function used instead of a 2D array
 function index(column,row) {
     return column + (row * maxColumn);
 }
 
-function timeStr(msecs) {
-    var secs = Math.floor(msecs/1000);
-    var m = Math.floor(secs/60);
-    var ret = "" + m + "m " + (secs%60) + "s";
-    return ret;
-}
-
-function initBoard()
+function startNewGame()
 {
     for(var i = 0; i<maxIndex; i++){
-        //Delete old blocks
+        //Delete blocks from previous game
         if(board[i] != null)
             board[i].destroy();
     }
 
     //Calculate board size
-    maxColumn = Math.floor(gameCanvas.width/gameCanvas.tileSize);
-    maxRow = Math.floor(gameCanvas.height/gameCanvas.tileSize);
+    maxColumn = Math.floor(gameCanvas.width/gameCanvas.blockSize);
+    maxRow = Math.floor(gameCanvas.height/gameCanvas.blockSize);
     maxIndex = maxRow*maxColumn;
 
     //Close dialogs
@@ -49,21 +39,52 @@ function initBoard()
         }
     }
 
-    timer = new Date();
+    gameDuration = new Date();
+}
+
+function createBlock(column,row){
+    if(component==null)
+        component = createComponent("content/BoomBlock.qml");
+
+    // Note that if Block.qml was not a local file, component.isReady would be
+    // false and we should wait for the component's statusChanged() signal to
+    // know when the file is downloaded and fully loaded before calling createObject().
+    if(component.isReady){
+        var dynamicObject = component.createObject();
+        if(dynamicObject == null){
+            print("error creating block");
+            print(component.errorsString());
+            return false;
+        }
+        dynamicObject.type = Math.floor(Math.random() * 3);
+        dynamicObject.parent = gameCanvas;
+        dynamicObject.x = column*gameCanvas.blockSize;
+        dynamicObject.targetX = column*gameCanvas.blockSize;
+        dynamicObject.targetY = row*gameCanvas.blockSize;
+        dynamicObject.width = gameCanvas.blockSize;
+        dynamicObject.height = gameCanvas.blockSize;
+        dynamicObject.spawned = true;
+        board[index(column,row)] = dynamicObject;
+    }else{
+        print("error loading block component");
+        print(component.errorsString());
+        return false;
+    }
+    return true;
 }
 
-var fillFound;//Set after a floodFill call to the number of tiles found
+var fillFound;//Set after a floodFill call to the number of blocks found
 var floodBoard;//Set to 1 if the floodFill reaches off that node
-//NOTE: Be careful with vars named x,y, as the calling object's x,y are still in scope
-function handleClick(x,y)
+
+function handleClick(xPos,yPos)
 {
-    var column = Math.floor(x/gameCanvas.tileSize);
-    var row = Math.floor(y/gameCanvas.tileSize);
+    var column = Math.floor(xPos/gameCanvas.blockSize);
+    var row = Math.floor(yPos/gameCanvas.blockSize);
     if(column >= maxColumn || column < 0 || row >= maxRow || row < 0)
         return;
     if(board[index(column, row)] == null)
         return;
-    //If it's a valid tile, remove it and all connected (does nothing if it's not connected)
+    //If it's a valid block, remove it and all connected (does nothing if it's not connected)
     floodFill(column,row, -1);
     if(fillFound <= 0)
         return;
@@ -95,7 +116,7 @@ function floodFill(column,row,type)
     floodFill(column,row+1,type);
     floodFill(column,row-1,type);
     if(first==true && fillFound == 0)
-        return;//Can't remove single tiles
+        return;//Can't remove single blocks
     board[index(column,row)].dying = true;
     board[index(column,row)] = null;
     fillFound += 1;
@@ -112,7 +133,7 @@ function shuffleDown()
             }else{
                 if(fallDist > 0){
                     var obj = board[index(column,row)];
-                    obj.targetY += fallDist * gameCanvas.tileSize;
+                    obj.targetY += fallDist * gameCanvas.blockSize;
                     board[index(column,row+fallDist)] = obj;
                     board[index(column,row)] = null;
                 }
@@ -130,7 +151,7 @@ function shuffleDown()
                     obj = board[index(column,row)];
                     if(obj == null)
                         continue;
-                    obj.targetX -= fallDist * gameCanvas.tileSize;
+                    obj.targetX -= fallDist * gameCanvas.blockSize;
                     board[index(column-fallDist,row)] = obj;
                     board[index(column,row)] = null;
                 }
@@ -141,21 +162,22 @@ function shuffleDown()
 
 function victoryCheck()
 {
-    //awards bonuses for no tiles left
+    //Award bonus points if no blocks left
     var deservesBonus = true;
     for(var column=maxColumn-1; column>=0; column--)
         if(board[index(column, maxRow - 1)] != null)
             deservesBonus = false;
     if(deservesBonus)
         gameCanvas.score += 500;
-    //Checks for game over
+
+    //Check whether game has finished
     if(deservesBonus || !(floodMoveCheck(0,maxRow-1, -1))){
-        timer = new Date() - timer;
+        gameDuration = new Date() - gameDuration;
         nameInputDialog.show("You won! Please enter your name:                 ");
     }
 }
 
-//only floods up and right, to see if it can find adjacent same-typed tiles 
+//only floods up and right, to see if it can find adjacent same-typed blocks 
 function floodMoveCheck(column, row, type)
 {
     if(column >= maxColumn || column < 0 || row >= maxRow || row < 0)
@@ -169,35 +191,6 @@ function floodMoveCheck(column, row, type)
            floodMoveCheck(column, row - 1, board[index(column,row)].type);
 }
 
-function createBlock(column,row){
-    // Note that we don't wait for the component to become ready. This will
-    // only work if the block QML is a local file. Otherwise the component will
-    // not be ready immediately. There is a statusChanged signal on the
-    // component you could use if you want to wait to load remote files.
-    if(component.isReady){
-        var dynamicObject = component.createObject();
-        if(dynamicObject == null){
-            print("error creating block");
-            print(component.errorsString());
-            return false;
-        }
-        dynamicObject.type = Math.floor(Math.random() * 3);
-        dynamicObject.parent = gameCanvas;
-        dynamicObject.x = column*gameCanvas.tileSize;
-        dynamicObject.targetX = column*gameCanvas.tileSize;
-        dynamicObject.targetY = row*gameCanvas.tileSize;
-        dynamicObject.width = gameCanvas.tileSize;
-        dynamicObject.height = gameCanvas.tileSize;
-        dynamicObject.spawned = true;
-        board[index(column,row)] = dynamicObject;
-    }else{//isError or isLoading
-        print("error loading block component");
-        print(component.errorsString());
-        return false;
-    }
-    return true;
-}
-
 //![2]
 function saveHighScore(name) {
     if(scoresURL!="")
@@ -205,7 +198,7 @@ function saveHighScore(name) {
     //OfflineStorage
     var db = openDatabaseSync("SameGameScores", "1.0", "Local SameGame High Scores",100);
     var dataStr = "INSERT INTO Scores VALUES(?, ?, ?, ?)";
-    var data = [name, gameCanvas.score, maxColumn+"x"+maxRow ,Math.floor(timer/1000)];
+    var data = [name, gameCanvas.score, maxColumn+"x"+maxRow ,Math.floor(gameDuration/1000)];
     db.transaction(
         function(tx) {
             tx.executeSql('CREATE TABLE IF NOT EXISTS Scores(name TEXT, score NUMBER, gridSize TEXT, time NUMBER)');
@@ -228,7 +221,7 @@ function saveHighScore(name) {
 function sendHighScore(name) {
     var postman = new XMLHttpRequest()
     var postData = "name="+name+"&score="+gameCanvas.score
-        +"&gridSize="+maxColumn+"x"+maxRow +"&time="+Math.floor(timer/1000);
+        +"&gridSize="+maxColumn+"x"+maxRow +"&time="+Math.floor(gameDuration/1000);
     postman.open("POST", scoresURL, true);
     postman.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
     postman.onreadystatechange = function() { 
diff --git a/examples/declarative/tutorials/samegame/samegame4/samegame.qml b/examples/declarative/tutorials/samegame/samegame4/samegame.qml
index fe35e3b..5d5c81f 100644
--- a/examples/declarative/tutorials/samegame/samegame4/samegame.qml
+++ b/examples/declarative/tutorials/samegame/samegame4/samegame.qml
@@ -20,11 +20,11 @@ Rectangle {
         Item {
             id: gameCanvas
             property int score: 0
-            property int tileSize: 40
+            property int blockSize: 40
 
             z: 20; anchors.centerIn: parent
-            width: parent.width - (parent.width % tileSize);
-            height: parent.height - (parent.height % tileSize);
+            width: parent.width - (parent.width % blockSize);
+            height: parent.height - (parent.height % blockSize);
 
             MouseArea {
                 anchors.fill: parent; onClicked: SameGame.handleClick(mouse.x,mouse.y);
@@ -63,7 +63,7 @@ Rectangle {
         anchors.bottom: screen.bottom
 
         Button {
-            text: "New Game"; onClicked: SameGame.initBoard();
+            text: "New Game"; onClicked: SameGame.startNewGame();
             anchors.left: parent.left; anchors.leftMargin: 3
             anchors.verticalCenter: parent.verticalCenter
         }