Merge branch 'master' of scm.dev.nokia.troll.no:qt/qt-qml into master-integration

* 'master' of scm.dev.nokia.troll.no:qt/qt-qml: (3309 commits)
  Add some painting benchmarks.
  Make sure cookies are saved.
  Fix headers::licenseCheck autotest failure
  Re-add accidentally deleted file
  Test SizeItemToLoader to SizeLoaderToItem resizeMode change.
  Document QmlContext ownership.
  Add bug note.
  Fix elision and multilength strings when resizing a Text element.
  Document calling C++ methods from QML.
  Document margins property
  Augment documentation
  doc: There is no easeNone, it is called easeLinear
  doc: Converted the basic types page to use \qmlbasictype
  Focus focusScope from focusing for focusOnPress
  Really run image reader in its own thread.
  Don't create one QNetworkAccessManager per XMLHttpRequest
  We use JavaScript, not ECMAScript.
  XMLHttpRequest redirection
  update Image.paintedWidth and Image.paintedHeight when the source changes
  Remove debug.
  ...

38 files changed, 1038 insertions, 0 deletions

diff --git a/examples/declarative/tutorials/samegame/samegame1/Block.qml b/examples/declarative/tutorials/samegame/samegame1/Block.qml
new file mode 100644
index 0000000..b76e61a
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame1/Block.qml
@@ -0,0 +1,12 @@
+//![0]
+import Qt 4.6
+
+Item { 
+    id:block
+    
+    Image { id: img
+        source: "pics/redStone.png";
+        anchors.fill: parent
+    }
+}
+//![0]
diff --git a/examples/declarative/tutorials/samegame/samegame1/Button.qml b/examples/declarative/tutorials/samegame/samegame1/Button.qml
new file mode 100644
index 0000000..85e6777
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame1/Button.qml
@@ -0,0 +1,27 @@
+//![0]
+import Qt 4.6
+
+Rectangle {
+    id: container
+
+    signal clicked
+    property string text: "Button"
+
+    color: activePalette.button; smooth: true
+    width: txtItem.width + 20; height: txtItem.height + 6
+    border.width: 1; border.color: Qt.darker(activePalette.button); radius: 8;
+
+    gradient: Gradient {
+        GradientStop {
+            id: topGrad; position: 0.0
+            color: if (mr.pressed) { activePalette.dark } else { activePalette.light } }
+        GradientStop { position: 1.0; color: activePalette.button }
+    }
+
+    MouseRegion { id: mr; anchors.fill: parent; onClicked: container.clicked() }
+
+    Text {
+        id: txtItem; text: container.text; anchors.centerIn: container; color: activePalette.buttonText
+    }
+}
+//![0]
diff --git a/examples/declarative/tutorials/samegame/samegame1/pics/background.png b/examples/declarative/tutorials/samegame/samegame1/pics/background.png
new file mode 100644
index 0000000..3734a27
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame1/pics/background.png
diff --git a/examples/declarative/tutorials/samegame/samegame1/pics/redStone.png b/examples/declarative/tutorials/samegame/samegame1/pics/redStone.png
new file mode 100644
index 0000000..36b09a2
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame1/pics/redStone.png
diff --git a/examples/declarative/tutorials/samegame/samegame1/samegame.qml b/examples/declarative/tutorials/samegame/samegame1/samegame.qml
new file mode 100644
index 0000000..c2d3939
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame1/samegame.qml
@@ -0,0 +1,40 @@
+//![0]
+import Qt 4.6
+
+Rectangle {
+    id: screen
+    width: 490; height: 720
+
+    SystemPalette { id: activePalette }
+
+    Item {
+        width: parent.width; anchors.top: parent.top; anchors.bottom: toolbar.top
+
+        Image {
+            id: background
+            anchors.fill: parent; source: "pics/background.png"
+            fillMode: Image.PreserveAspectCrop
+        }
+    }
+
+    Rectangle {
+        id: toolbar
+        color: activePalette.window
+        height: 32; width: parent.width
+        anchors.bottom: screen.bottom
+
+        Button {
+            id: btnA; text: "New Game"; onClicked: console.log("Implement me!");
+            anchors.left: parent.left; anchors.leftMargin: 3
+            anchors.verticalCenter: parent.verticalCenter
+        }
+
+        Text {
+            id: score
+            text: "Score: Who knows?"; font.bold: true
+            anchors.right: parent.right; anchors.rightMargin: 3
+            anchors.verticalCenter: parent.verticalCenter
+        }
+    }
+}
+//![0]
diff --git a/examples/declarative/tutorials/samegame/samegame2/Block.qml b/examples/declarative/tutorials/samegame/samegame2/Block.qml
new file mode 100644
index 0000000..228ac4e
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame2/Block.qml
@@ -0,0 +1,10 @@
+import Qt 4.6
+
+Item { 
+    id:block
+    
+    Image { id: img
+        source: "pics/redStone.png";
+        anchors.fill: parent
+    }
+}
diff --git a/examples/declarative/tutorials/samegame/samegame2/Button.qml b/examples/declarative/tutorials/samegame/samegame2/Button.qml
new file mode 100644
index 0000000..63cd555
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame2/Button.qml
@@ -0,0 +1,25 @@
+import Qt 4.6
+
+Rectangle {
+    id: container
+
+    signal clicked
+    property string text: "Button"
+
+    color: activePalette.button; smooth: true
+    width: txtItem.width + 20; height: txtItem.height + 6
+    border.width: 1; border.color: Qt.darker(activePalette.button); radius: 8;
+
+    gradient: Gradient {
+        GradientStop {
+            id: topGrad; position: 0.0
+            color: if (mr.pressed) { activePalette.dark } else { activePalette.light } }
+        GradientStop { position: 1.0; color: activePalette.button }
+    }
+
+    MouseRegion { id: mr; anchors.fill: parent; onClicked: container.clicked() }
+
+    Text {
+        id: txtItem; text: container.text; anchors.centerIn: container; color: activePalette.buttonText
+    }
+}
diff --git a/examples/declarative/tutorials/samegame/samegame2/pics/background.png b/examples/declarative/tutorials/samegame/samegame2/pics/background.png
new file mode 100644
index 0000000..3734a27
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame2/pics/background.png
diff --git a/examples/declarative/tutorials/samegame/samegame2/pics/redStone.png b/examples/declarative/tutorials/samegame/samegame2/pics/redStone.png
new file mode 100644
index 0000000..36b09a2
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame2/pics/redStone.png
diff --git a/examples/declarative/tutorials/samegame/samegame2/samegame.js b/examples/declarative/tutorials/samegame/samegame2/samegame.js
new file mode 100644
index 0000000..2c02c61
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame2/samegame.js
@@ -0,0 +1,61 @@
+//![0]
+//Note that X/Y referred to here are in game coordinates
+var maxX = 10;//Nums are for tileSize 40
+var maxY = 15;
+var tileSize = 40;
+var maxIndex = maxX*maxY;
+var board = new Array(maxIndex);
+var tileSrc = "Block.qml";
+var component;
+
+//Index function used instead of a 2D array
+function index(xIdx,yIdx) {
+    return xIdx + (yIdx * maxX);
+}
+
+function initBoard()
+{
+    //Calculate board size
+    maxX = Math.floor(background.width/tileSize);
+    maxY = Math.floor(background.height/tileSize);
+    maxIndex = maxY*maxX;
+
+    //Initialize Board
+    board = new Array(maxIndex);
+    for(var xIdx=0; xIdx<maxX; xIdx++){
+        for(var yIdx=0; yIdx<maxY; yIdx++){
+            board[index(xIdx,yIdx)] = null;
+            createBlock(xIdx,yIdx);
+        }
+    }
+}
+
+function createBlock(xIdx,yIdx){
+    if(component==null)
+        component = createComponent(tileSrc);
+
+    // 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.parent = background;
+        dynamicObject.x = xIdx*tileSize;
+        dynamicObject.y = yIdx*tileSize;
+        dynamicObject.width = tileSize;
+        dynamicObject.height = tileSize;
+        board[index(xIdx,yIdx)] = dynamicObject;
+    }else{//isError or isLoading
+        print("error loading block component");
+        print(component.errorsString());
+        return false;
+    }
+    return true;
+}
+//![0]
diff --git a/examples/declarative/tutorials/samegame/samegame2/samegame.qml b/examples/declarative/tutorials/samegame/samegame2/samegame.qml
new file mode 100644
index 0000000..8d837da
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame2/samegame.qml
@@ -0,0 +1,43 @@
+import Qt 4.6
+
+Rectangle {
+    id: screen
+    width: 490; height: 720
+
+    SystemPalette { id: activePalette }
+//![2]
+    Script { source: "samegame.js" }
+//![2]
+
+    Item {
+        width: parent.width; anchors.top: parent.top; anchors.bottom: toolbar.top
+
+        Image {
+            id: background
+            anchors.fill: parent; source: "pics/background.png"
+            fillMode: Image.PreserveAspectCrop
+        }
+    }
+
+    Rectangle {
+        id: toolbar
+        color: activePalette.window
+        height: 32; width: parent.width
+        anchors.bottom: screen.bottom
+
+//![1]
+        Button {
+            id: btnA; text: "New Game"; onClicked: initBoard();
+            anchors.left: parent.left; anchors.leftMargin: 3
+            anchors.verticalCenter: parent.verticalCenter
+        }
+//![1]
+
+        Text {
+            id: score
+            text: "Score: Who knows?"; font.bold: true
+            anchors.right: parent.right; anchors.rightMargin: 3
+            anchors.verticalCenter: parent.verticalCenter
+        }
+    }
+}
diff --git a/examples/declarative/tutorials/samegame/samegame3/Block.qml b/examples/declarative/tutorials/samegame/samegame3/Block.qml
new file mode 100644
index 0000000..30a8d3a
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame3/Block.qml
@@ -0,0 +1,21 @@
+//![0]
+import Qt 4.6
+
+Item { 
+    id:block
+    property int type: 0
+    
+    Image { id: img
+        source: {
+            if(type == 0){
+                "pics/redStone.png";
+            } else if(type == 1) {
+                "pics/blueStone.png";
+            } else {
+                "pics/greenStone.png";
+            }
+        }
+        anchors.fill: parent
+    }
+}
+//![0]
diff --git a/examples/declarative/tutorials/samegame/samegame3/Button.qml b/examples/declarative/tutorials/samegame/samegame3/Button.qml
new file mode 100644
index 0000000..63cd555
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame3/Button.qml
@@ -0,0 +1,25 @@
+import Qt 4.6
+
+Rectangle {
+    id: container
+
+    signal clicked
+    property string text: "Button"
+
+    color: activePalette.button; smooth: true
+    width: txtItem.width + 20; height: txtItem.height + 6
+    border.width: 1; border.color: Qt.darker(activePalette.button); radius: 8;
+
+    gradient: Gradient {
+        GradientStop {
+            id: topGrad; position: 0.0
+            color: if (mr.pressed) { activePalette.dark } else { activePalette.light } }
+        GradientStop { position: 1.0; color: activePalette.button }
+    }
+
+    MouseRegion { id: mr; anchors.fill: parent; onClicked: container.clicked() }
+
+    Text {
+        id: txtItem; text: container.text; anchors.centerIn: container; color: activePalette.buttonText
+    }
+}
diff --git a/examples/declarative/tutorials/samegame/samegame3/Dialog.qml b/examples/declarative/tutorials/samegame/samegame3/Dialog.qml
new file mode 100644
index 0000000..96dc246
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame3/Dialog.qml
@@ -0,0 +1,23 @@
+//![0]
+import Qt 4.6
+
+Rectangle {
+    id: page
+    function forceClose() {
+        page.closed();
+        page.opacity = 0;
+    }
+    function show(txt) {
+        myText.text = txt;
+        page.opacity = 1;
+    }
+    signal closed();
+    color: "white"; border.width: 1; width: myText.width + 20; height: 60;
+    opacity: 0
+    opacity: Behavior { 
+        NumberAnimation { duration: 1000 }
+    }
+    Text { id: myText; anchors.centerIn: parent; text: "Hello World!" }
+    MouseRegion { id: mr; anchors.fill: parent; onClicked: forceClose(); }
+}
+//![0]
diff --git a/examples/declarative/tutorials/samegame/samegame3/pics/background.png b/examples/declarative/tutorials/samegame/samegame3/pics/background.png
new file mode 100644
index 0000000..3734a27
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame3/pics/background.png
diff --git a/examples/declarative/tutorials/samegame/samegame3/pics/blueStone.png b/examples/declarative/tutorials/samegame/samegame3/pics/blueStone.png
new file mode 100644
index 0000000..20e43c7
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame3/pics/blueStone.png
diff --git a/examples/declarative/tutorials/samegame/samegame3/pics/greenStone.png b/examples/declarative/tutorials/samegame/samegame3/pics/greenStone.png
new file mode 100644
index 0000000..b568a19
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame3/pics/greenStone.png
diff --git a/examples/declarative/tutorials/samegame/samegame3/pics/redStone.png b/examples/declarative/tutorials/samegame/samegame3/pics/redStone.png
new file mode 100644
index 0000000..36b09a2
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame3/pics/redStone.png
diff --git a/examples/declarative/tutorials/samegame/samegame3/samegame.js b/examples/declarative/tutorials/samegame/samegame3/samegame.js
new file mode 100644
index 0000000..38efb3b
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame3/samegame.js
@@ -0,0 +1,189 @@
+/* This script file handles the game logic */
+//Note that X/Y referred to here are in game coordinates
+var maxX = 10;//Nums are for tileSize 40
+var maxY = 15;
+var maxIndex = maxX*maxY;
+var board = new Array(maxIndex);
+var tileSrc = "Block.qml";
+var component;
+
+//Index function used instead of a 2D array
+function index(xIdx,yIdx) {
+    return xIdx + (yIdx * maxX);
+}
+
+function initBoard()
+{
+    for(var i = 0; i<maxIndex; i++){
+        //Delete old blocks
+        if(board[i] != null)
+            board[i].destroy();
+    }
+
+    //Calculate board size
+    maxX = Math.floor(gameCanvas.width/gameCanvas.tileSize);
+    maxY = Math.floor(gameCanvas.height/gameCanvas.tileSize);
+    maxIndex = maxY*maxX;
+
+    //Close dialogs
+    dialog.forceClose();
+
+    //Initialize Board
+    board = new Array(maxIndex);
+    gameCanvas.score = 0;
+    for(var xIdx=0; xIdx<maxX; xIdx++){
+        for(var yIdx=0; yIdx<maxY; yIdx++){
+            board[index(xIdx,yIdx)] = null;
+            createBlock(xIdx,yIdx);
+        }
+    }
+}
+
+function createBlock(xIdx,yIdx){
+    if(component==null)
+        component = createComponent(tileSrc);
+
+    // 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 = xIdx*gameCanvas.tileSize;
+        dynamicObject.y = yIdx*gameCanvas.tileSize;
+        dynamicObject.width = gameCanvas.tileSize;
+        dynamicObject.height = gameCanvas.tileSize;
+        board[index(xIdx,yIdx)] = dynamicObject;
+    }else{//isError or isLoading
+        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 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)
+{
+    var xIdx = Math.floor(x/gameCanvas.tileSize);
+    var yIdx = Math.floor(y/gameCanvas.tileSize);
+    if(xIdx >= maxX || xIdx < 0 || yIdx >= maxY || yIdx < 0)
+        return;
+    if(board[index(xIdx, yIdx)] == null)
+        return;
+    //If it's a valid tile, remove it and all connected (does nothing if it's not connected)
+    floodFill(xIdx,yIdx, -1);
+    if(fillFound <= 0)
+        return;
+    gameCanvas.score += (fillFound - 1) * (fillFound - 1);
+    shuffleDown();
+    victoryCheck();
+}
+//![1]
+
+function floodFill(xIdx,yIdx,type)
+{
+    if(board[index(xIdx, yIdx)] == null)
+        return;
+    var first = false;
+    if(type == -1){
+        first = true;
+        type = board[index(xIdx,yIdx)].type;
+        
+        //Flood fill initialization
+        fillFound = 0;
+        floodBoard = new Array(maxIndex);
+    }
+    if(xIdx >= maxX || xIdx < 0 || yIdx >= maxY || yIdx < 0)
+        return;
+    if(floodBoard[index(xIdx, yIdx)] == 1 || (!first && type != board[index(xIdx,yIdx)].type))
+        return;
+    floodBoard[index(xIdx, yIdx)] = 1;
+    floodFill(xIdx+1,yIdx,type);
+    floodFill(xIdx-1,yIdx,type);
+    floodFill(xIdx,yIdx+1,type);
+    floodFill(xIdx,yIdx-1,type);
+    if(first==true && fillFound == 0)
+        return;//Can't remove single tiles
+    board[index(xIdx,yIdx)].opacity = 0;
+    board[index(xIdx,yIdx)] = null;
+    fillFound += 1;
+}
+
+function shuffleDown()
+{
+    //Fall down
+    for(var xIdx=0; xIdx<maxX; xIdx++){
+        var fallDist = 0;
+        for(var yIdx=maxY-1; yIdx>=0; yIdx--){
+            if(board[index(xIdx,yIdx)] == null){
+                fallDist += 1;
+            }else{
+                if(fallDist > 0){
+                    var obj = board[index(xIdx,yIdx)];
+                    obj.y += fallDist * gameCanvas.tileSize;
+                    board[index(xIdx,yIdx+fallDist)] = obj;
+                    board[index(xIdx,yIdx)] = null;
+                }
+            }
+        }
+    }
+    //Fall to the left
+    var fallDist = 0;
+    for(var xIdx=0; xIdx<maxX; xIdx++){
+        if(board[index(xIdx, maxY - 1)] == null){
+            fallDist += 1;
+        }else{
+            if(fallDist > 0){
+                for(var yIdx=0; yIdx<maxY; yIdx++){
+                    var obj = board[index(xIdx,yIdx)];
+                    if(obj == null)
+                        continue;
+                    obj.x -= fallDist * gameCanvas.tileSize;
+                    board[index(xIdx-fallDist,yIdx)] = obj;
+                    board[index(xIdx,yIdx)] = null;
+                }
+            }
+        }
+    }
+}
+
+//![2]
+function victoryCheck()
+{
+    //awards bonuses for no tiles left
+    var deservesBonus = true;
+    for(var xIdx=maxX-1; xIdx>=0; xIdx--)
+        if(board[index(xIdx, maxY - 1)] != null)
+            deservesBonus = false;
+    if(deservesBonus)
+        gameCanvas.score += 500;
+    //Checks for game over
+    if(deservesBonus || !(floodMoveCheck(0,maxY-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 
+function floodMoveCheck(xIdx, yIdx, type)
+{
+    if(xIdx >= maxX || xIdx < 0 || yIdx >= maxY || yIdx < 0)
+        return false;
+    if(board[index(xIdx, yIdx)] == null)
+        return false;
+    var myType = board[index(xIdx, yIdx)].type;
+    if(type == myType)
+        return true;
+    return floodMoveCheck(xIdx + 1, yIdx, myType) ||
+           floodMoveCheck(xIdx, yIdx - 1, board[index(xIdx,yIdx)].type);
+}
diff --git a/examples/declarative/tutorials/samegame/samegame3/samegame.qml b/examples/declarative/tutorials/samegame/samegame3/samegame.qml
new file mode 100644
index 0000000..8bdb428
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame3/samegame.qml
@@ -0,0 +1,62 @@
+//![0]
+import Qt 4.6
+
+Rectangle {
+    id: screen
+    width: 490; height: 720
+
+    SystemPalette { id: activePalette }
+    Script { source: "samegame.js" }
+
+    Item {
+        width: parent.width; anchors.top: parent.top; anchors.bottom: toolbar.top
+
+        Image {
+            id: background
+            anchors.fill: parent; source: "pics/background.png"
+            fillMode: Image.PreserveAspectCrop
+        }
+
+//![1]
+        Item {
+            id: gameCanvas
+            property int score: 0
+            property int tileSize: 40
+
+            z: 20; anchors.centerIn: parent
+            width: parent.width - (parent.width % tileSize);
+            height: parent.height - (parent.height % tileSize);
+
+            MouseRegion {
+                id: gameMR
+                anchors.fill: parent; onClicked: handleClick(mouse.x,mouse.y);
+            }
+        }
+//![1]
+    }
+
+//![2]
+    Dialog { id: dialog; anchors.centerIn: parent; z: 21 }
+//![2]
+
+    Rectangle {
+        id: toolbar
+        color: activePalette.window
+        height: 32; width: parent.width
+        anchors.bottom: screen.bottom
+
+        Button {
+            id: btnA; text: "New Game"; onClicked: initBoard();
+            anchors.left: parent.left; anchors.leftMargin: 3
+            anchors.verticalCenter: parent.verticalCenter
+        }
+
+        Text {
+            id: score
+            text: "Score: " + gameCanvas.score; font.bold: true
+            anchors.right: parent.right; anchors.rightMargin: 3
+            anchors.verticalCenter: parent.verticalCenter
+        }
+    }
+}
+//![0]
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/BoomBlock.qml b/examples/declarative/tutorials/samegame/samegame4/content/BoomBlock.qml
new file mode 100644
index 0000000..2eb2ceb
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/BoomBlock.qml
@@ -0,0 +1,63 @@
+import Qt 4.6
+
+Item { id:block
+    property int type: 0
+    property bool dying: false
+    //![1]
+    property bool spawned: false
+    property int targetX: 0
+    property int targetY: 0
+
+    x: SpringFollow { enabled: spawned; source: targetX; spring: 2; damping: 0.2 }
+    y: SpringFollow { source: targetY; spring: 2; damping: 0.2 }
+    //![1]
+
+    //![2]
+    Image { id: img
+        source: {
+            if(type == 0){
+                "pics/redStone.png";
+            } else if(type == 1) {
+                "pics/blueStone.png";
+            } else {
+                "pics/greenStone.png";
+            }
+        }
+        opacity: 0
+        opacity: Behavior { NumberAnimation { matchProperties:"opacity"; duration: 200 } }
+        anchors.fill: parent
+    }
+    //![2]
+
+    //![3]
+    Particles { id: particles
+        width:1; height:1; anchors.centerIn: parent;
+        emissionRate: 0;
+        lifeSpan: 700; lifeSpanDeviation: 600;
+        angle: 0; angleDeviation: 360;
+        velocity: 100; velocityDeviation:30;
+        source: {
+            if(type == 0){
+                "pics/redStar.png";
+            } else if (type == 1) {
+                "pics/blueStar.png";
+            } else {
+                "pics/greenStar.png";
+            }
+        }
+    }
+    //![3]
+
+    //![4]
+    states: [
+        State{ name: "AliveState"; when: spawned == true && dying == false
+            PropertyChanges { target: img; opacity: 1 }
+        },
+        State{ name: "DeathState"; when: dying == true
+            StateChangeScript { script: particles.burst(50); }
+            PropertyChanges { target: img; opacity: 0 }
+            StateChangeScript { script: block.destroy(1000); }
+        }
+    ]
+    //![4]
+}
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/Button.qml b/examples/declarative/tutorials/samegame/samegame4/content/Button.qml
new file mode 100644
index 0000000..63cd555
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/Button.qml
@@ -0,0 +1,25 @@
+import Qt 4.6
+
+Rectangle {
+    id: container
+
+    signal clicked
+    property string text: "Button"
+
+    color: activePalette.button; smooth: true
+    width: txtItem.width + 20; height: txtItem.height + 6
+    border.width: 1; border.color: Qt.darker(activePalette.button); radius: 8;
+
+    gradient: Gradient {
+        GradientStop {
+            id: topGrad; position: 0.0
+            color: if (mr.pressed) { activePalette.dark } else { activePalette.light } }
+        GradientStop { position: 1.0; color: activePalette.button }
+    }
+
+    MouseRegion { id: mr; anchors.fill: parent; onClicked: container.clicked() }
+
+    Text {
+        id: txtItem; text: container.text; anchors.centerIn: container; color: activePalette.buttonText
+    }
+}
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml b/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml
new file mode 100644
index 0000000..3371d53
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/Dialog.qml
@@ -0,0 +1,21 @@
+import Qt 4.6
+
+Rectangle {
+    id: page
+    function forceClose() {
+        page.closed();
+        page.opacity = 0;
+    }
+    function show(txt) {
+        myText.text = txt;
+        page.opacity = 1;
+    }
+    signal closed();
+    color: "white"; border.width: 1; width: myText.width + 20; height: 60;
+    opacity: 0
+    opacity: Behavior { 
+        NumberAnimation { duration: 1000 }
+    }
+    Text { id: myText; anchors.centerIn: parent; text: "Hello World!" }
+    MouseRegion { id: mr; anchors.fill: parent; onClicked: forceClose(); }
+}
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/pics/background.png b/examples/declarative/tutorials/samegame/samegame4/content/pics/background.png
new file mode 100644
index 0000000..3734a27
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/pics/background.png
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/pics/blueStar.png b/examples/declarative/tutorials/samegame/samegame4/content/pics/blueStar.png
new file mode 100644
index 0000000..ff9588f
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/pics/blueStar.png
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/pics/blueStone.png b/examples/declarative/tutorials/samegame/samegame4/content/pics/blueStone.png
new file mode 100644
index 0000000..20e43c7
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/pics/blueStone.png
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/pics/greenStar.png b/examples/declarative/tutorials/samegame/samegame4/content/pics/greenStar.png
new file mode 100644
index 0000000..cd06854
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/pics/greenStar.png
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/pics/greenStone.png b/examples/declarative/tutorials/samegame/samegame4/content/pics/greenStone.png
new file mode 100644
index 0000000..b568a19
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/pics/greenStone.png
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/pics/redStar.png b/examples/declarative/tutorials/samegame/samegame4/content/pics/redStar.png
new file mode 100644
index 0000000..0a4dffe
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/pics/redStar.png
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/pics/redStone.png b/examples/declarative/tutorials/samegame/samegame4/content/pics/redStone.png
new file mode 100644
index 0000000..36b09a2
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/pics/redStone.png
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/pics/star.png b/examples/declarative/tutorials/samegame/samegame4/content/pics/star.png
new file mode 100644
index 0000000..defbde5
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/pics/star.png
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/pics/yellowStone.png b/examples/declarative/tutorials/samegame/samegame4/content/pics/yellowStone.png
new file mode 100644
index 0000000..b1ce762
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/pics/yellowStone.png
diff --git a/examples/declarative/tutorials/samegame/samegame4/content/samegame.js b/examples/declarative/tutorials/samegame/samegame4/content/samegame.js
new file mode 100755
index 0000000..2a0d718
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/content/samegame.js
@@ -0,0 +1,249 @@
+/* This script file handles the game logic */
+//Note that X/Y referred to here are in game coordinates
+var maxX = 10;//Nums are for gameCanvas.tileSize 40
+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 = "";
+var timer;
+var component = createComponent(tileSrc);
+
+//Index function used instead of a 2D array
+function index(xIdx,yIdx) {
+    return xIdx + (yIdx * maxX);
+}
+
+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 getTileSize()
+{
+    return tileSize;
+}
+
+function initBoard()
+{
+    for(var i = 0; i<maxIndex; i++){
+        //Delete old blocks
+        if(board[i] != null)
+            board[i].destroy();
+    }
+
+    //Calculate board size
+    maxX = Math.floor(gameCanvas.width/gameCanvas.tileSize);
+    maxY = Math.floor(gameCanvas.height/gameCanvas.tileSize);
+    maxIndex = maxY*maxX;
+
+    //Close dialogs
+    scoreName.forceClose();
+    dialog.forceClose();
+
+    var a = new Date();
+    //Initialize Board
+    board = new Array(maxIndex);
+    gameCanvas.score = 0;
+    for(var xIdx=0; xIdx<maxX; xIdx++){
+        for(var yIdx=0; yIdx<maxY; yIdx++){
+            board[index(xIdx,yIdx)] = null;
+            createBlock(xIdx,yIdx);
+        }
+    }
+    timer = new Date();
+
+    print(timer.valueOf() - a.valueOf());
+}
+
+var fillFound;//Set after a floodFill call to the number of tiles 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)
+{
+    var xIdx = Math.floor(x/gameCanvas.tileSize);
+    var yIdx = Math.floor(y/gameCanvas.tileSize);
+    if(xIdx >= maxX || xIdx < 0 || yIdx >= maxY || yIdx < 0)
+        return;
+    if(board[index(xIdx, yIdx)] == null)
+        return;
+    //If it's a valid tile, remove it and all connected (does nothing if it's not connected)
+    floodFill(xIdx,yIdx, -1);
+    if(fillFound <= 0)
+        return;
+    gameCanvas.score += (fillFound - 1) * (fillFound - 1);
+    shuffleDown();
+    victoryCheck();
+}
+
+function floodFill(xIdx,yIdx,type)
+{
+    if(board[index(xIdx, yIdx)] == null)
+        return;
+    var first = false;
+    if(type == -1){
+        first = true;
+        type = board[index(xIdx,yIdx)].type;
+        
+        //Flood fill initialization
+        fillFound = 0;
+        floodBoard = new Array(maxIndex);
+    }
+    if(xIdx >= maxX || xIdx < 0 || yIdx >= maxY || yIdx < 0)
+        return;
+    if(floodBoard[index(xIdx, yIdx)] == 1 || (!first && type != board[index(xIdx,yIdx)].type))
+        return;
+    floodBoard[index(xIdx, yIdx)] = 1;
+    floodFill(xIdx+1,yIdx,type);
+    floodFill(xIdx-1,yIdx,type);
+    floodFill(xIdx,yIdx+1,type);
+    floodFill(xIdx,yIdx-1,type);
+    if(first==true && fillFound == 0)
+        return;//Can't remove single tiles
+    board[index(xIdx,yIdx)].dying = true;
+    board[index(xIdx,yIdx)] = null;
+    fillFound += 1;
+}
+
+function shuffleDown()
+{
+    //Fall down
+    for(var xIdx=0; xIdx<maxX; xIdx++){
+        var fallDist = 0;
+        for(var yIdx=maxY-1; yIdx>=0; yIdx--){
+            if(board[index(xIdx,yIdx)] == null){
+                fallDist += 1;
+            }else{
+                if(fallDist > 0){
+                    var obj = board[index(xIdx,yIdx)];
+                    obj.targetY += fallDist * gameCanvas.tileSize;
+                    board[index(xIdx,yIdx+fallDist)] = obj;
+                    board[index(xIdx,yIdx)] = null;
+                }
+            }
+        }
+    }
+    //Fall to the left
+    fallDist = 0;
+    for(xIdx=0; xIdx<maxX; xIdx++){
+        if(board[index(xIdx, maxY - 1)] == null){
+            fallDist += 1;
+        }else{
+            if(fallDist > 0){
+                for(yIdx=0; yIdx<maxY; yIdx++){
+                    obj = board[index(xIdx,yIdx)];
+                    if(obj == null)
+                        continue;
+                    obj.targetX -= fallDist * gameCanvas.tileSize;
+                    board[index(xIdx-fallDist,yIdx)] = obj;
+                    board[index(xIdx,yIdx)] = null;
+                }
+            }
+        }
+    }
+}
+
+function victoryCheck()
+{
+    //awards bonuses for no tiles left
+    var deservesBonus = true;
+    for(var xIdx=maxX-1; xIdx>=0; xIdx--)
+        if(board[index(xIdx, maxY - 1)] != null)
+            deservesBonus = false;
+    if(deservesBonus)
+        gameCanvas.score += 500;
+    //Checks for game over
+    if(deservesBonus || !(floodMoveCheck(0,maxY-1, -1))){
+        timer = new Date() - timer;
+        scoreName.show("You won! Please enter your name:                 ");
+        //dialog.show("Game Over. Your score is " + gameCanvas.score);
+    }
+}
+
+//only floods up and right, to see if it can find adjacent same-typed tiles 
+function floodMoveCheck(xIdx, yIdx, type)
+{
+    if(xIdx >= maxX || xIdx < 0 || yIdx >= maxY || yIdx < 0)
+        return false;
+    if(board[index(xIdx, yIdx)] == null)
+        return false;
+    var myType = board[index(xIdx, yIdx)].type;
+    if(type == myType)
+        return true;
+    return floodMoveCheck(xIdx + 1, yIdx, myType) ||
+           floodMoveCheck(xIdx, yIdx - 1, board[index(xIdx,yIdx)].type);
+}
+
+function createBlock(xIdx,yIdx){
+    // 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 = xIdx*gameCanvas.tileSize;
+        dynamicObject.targetX = xIdx*gameCanvas.tileSize;
+        dynamicObject.targetY = yIdx*gameCanvas.tileSize;
+        dynamicObject.width = gameCanvas.tileSize;
+        dynamicObject.height = gameCanvas.tileSize;
+        dynamicObject.spawned = true;
+        board[index(xIdx,yIdx)] = dynamicObject;
+    }else{//isError or isLoading
+        print("error loading block component");
+        print(component.errorsString());
+        return false;
+    }
+    return true;
+}
+
+//![2]
+function saveHighScore(name) {
+    if(scoresURL!="")
+        sendHighScore(name);
+    //OfflineStorage
+    var db = openDatabaseSync("SameGameScores", "1.0", "Local SameGame High Scores",100);
+    var dataStr = "INSERT INTO Scores VALUES(?, ?, ?, ?)";
+    var data = [name, gameCanvas.score, maxX+"x"+maxY ,Math.floor(timer/1000)];
+    db.transaction(
+        function(tx) {
+            tx.executeSql('CREATE TABLE IF NOT EXISTS Scores(name TEXT, score NUMBER, gridSize TEXT, time NUMBER)');
+            tx.executeSql(dataStr, data);
+
+            var rs = tx.executeSql('SELECT * FROM Scores WHERE gridSize = "12x17" ORDER BY score desc LIMIT 10');
+            var r = "\nHIGH SCORES for a standard sized grid\n\n"
+            for(var i = 0; i < rs.rows.length; i++){
+                r += (i+1)+". " + rs.rows.item(i).name +' got '
+                    + rs.rows.item(i).score + ' points in '
+                    + rs.rows.item(i).time + ' seconds.\n';
+            }
+            dialog.show(r);
+        }
+    );
+}
+//![2]
+
+//![1]
+function sendHighScore(name) {
+    var postman = new XMLHttpRequest()
+    var postData = "name="+name+"&score="+gameCanvas.score
+        +"&gridSize="+maxX+"x"+maxY +"&time="+Math.floor(timer/1000);
+    postman.open("POST", scoresURL, true);
+    postman.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
+    postman.onreadystatechange = function() { 
+        if (postman.readyState == postman.DONE) {
+            dialog.show("Your score has been uploaded.");
+        }
+    }
+    postman.send(postData);
+}
+//![1]
diff --git a/examples/declarative/tutorials/samegame/samegame4/highscores/README b/examples/declarative/tutorials/samegame/samegame4/highscores/README
new file mode 100644
index 0000000..eaa00fa
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/highscores/README
@@ -0,0 +1 @@
+The SameGame example can interface with a simple PHP script to store XML high score data on a remote server. We do not have a publically accessible server available for this use, but if you have access to a PHP capable webserver you can copy the files (score_data.xml, score.php, score_style.xsl) to it and alter the highscore_server variable at the top of the samegame.js file to point to it.
diff --git a/examples/declarative/tutorials/samegame/samegame4/highscores/score_data.xml b/examples/declarative/tutorials/samegame/samegame4/highscores/score_data.xml
new file mode 100755
index 0000000..c3fd90d
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/highscores/score_data.xml
@@ -0,0 +1,2 @@
+<record><score>1000000</score><name>Alan the Tester</name><gridSize>0x0</gridSize><seconds>0</seconds></record>
+<record><score>6213</score><name>Alan</name><gridSize>12x17</gridSize><seconds>51</seconds></record>
diff --git a/examples/declarative/tutorials/samegame/samegame4/highscores/score_style.xsl b/examples/declarative/tutorials/samegame/samegame4/highscores/score_style.xsl
new file mode 100755
index 0000000..670354c
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/highscores/score_style.xsl
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="ISO-8859-1"?>
+<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
+<xsl:template match="/">
+  <html>
+  <head><title>SameGame High Scores</title></head>
+  <body>
+  <h2>SameGame High Scores</h2>
+    <table border="1">
+      <tr bgcolor="lightsteelblue">
+        <th>Name</th>
+        <th>Score</th>
+        <th>Grid Size</th>
+        <th>Time, s</th>
+      </tr>
+      <xsl:for-each select="records/record">
+      <xsl:sort select="score" data-type="number" order="descending"/>
+      <tr>
+        <td><xsl:value-of select="name"/></td>
+        <td><xsl:value-of select="score"/></td>
+        <td><xsl:value-of select="gridSize"/></td>
+        <td><xsl:value-of select="seconds"/></td>
+      </tr>
+      </xsl:for-each>
+    </table>
+  </body>
+  </html>
+</xsl:template>
+</xsl:stylesheet>
diff --git a/examples/declarative/tutorials/samegame/samegame4/highscores/scores.php b/examples/declarative/tutorials/samegame/samegame4/highscores/scores.php
new file mode 100755
index 0000000..3cceb2d
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/highscores/scores.php
@@ -0,0 +1,34 @@
+<?php
+    $score = $_POST["score"];
+    echo "<html>";
+    echo "<head><title>SameGame High Scores</title></head><body>";
+    if($score > 0){#Sending in a new high score
+        $name = $_POST["name"];
+        $grid = $_POST["gridSize"];
+        $time = $_POST["time"];
+        if($name == "")
+            $name = "Anonymous";
+        //if($grid != "10x10"){
+        //Need a standard, so as to reject others?
+        //}
+	$file = fopen("score_data.xml", "a"); #It's XML. Happy?
+        $ret = fwrite($file, "<record><score>". $score . "</score><name>" 
+            . $name . "</name><gridSize>" . $grid . "</gridSize><seconds>"
+            . $time . "</seconds></record>\n");
+        echo "Your score has been recorded. Thanks for playing!";
+        if($ret == False)
+            echo "<br/> There was an error though, so don't expect to see that score again.";
+    }else{#Read high score list
+        #Now uses XSLT to display. So just print the file. With XML cruft added.
+        #Note that firefox at least won't apply the XSLT on a php file. So redirecting
+	$file = fopen("scores.xml", "w");
+        $ret = fwrite($file, '<?xml version="1.0" encoding="ISO-8859-1"?>' . "\n"
+            . '<?xml-stylesheet type="text/xsl" href="score_style.xsl"?>' . "\n"
+            . "<records>\n" . file_get_contents("score_data.xml") . "</records>\n");
+        if($ret == False)
+            echo "There was an internal error. Sorry.";
+        else
+            echo '<script type="text/javascript">window.location.replace("scores.xml")</script>';
+    }
+    echo "</body></html>";
+?>
diff --git a/examples/declarative/tutorials/samegame/samegame4/samegame.qml b/examples/declarative/tutorials/samegame/samegame4/samegame.qml
new file mode 100644
index 0000000..19b929f
--- /dev/null
+++ b/examples/declarative/tutorials/samegame/samegame4/samegame.qml
@@ -0,0 +1,77 @@
+import Qt 4.6
+import "content"
+
+Rectangle {
+    id: screen
+    width: 490; height: 720
+
+    SystemPalette { id: activePalette }
+
+    Item {
+        width: parent.width; anchors.top: parent.top; anchors.bottom: toolBar.top
+
+        Image {
+            id: background
+            anchors.fill: parent; source: "content/pics/background.png"
+            fillMode: Image.PreserveAspectCrop
+        }
+
+        Item {
+            id: gameCanvas
+            property int score: 0
+            property int tileSize: 40
+
+            Script { source: "content/samegame.js" }
+
+            z: 20; anchors.centerIn: parent
+            width: parent.width - (parent.width % getTileSize());
+            height: parent.height - (parent.height % getTileSize());
+
+            MouseRegion {
+                id: gameMR
+                anchors.fill: parent; onClicked: handleClick(mouse.x,mouse.y);
+            }
+        }
+    }
+
+    Dialog { id: dialog; anchors.centerIn: parent; z: 21 }
+    Dialog {
+        id: scoreName; anchors.centerIn: parent; z: 22;
+        Text {
+            id: spacer
+            opacity: 0
+            text: "   You won! Please enter your name:"
+        }
+        TextInput {
+            id: editor
+            onAccepted: {
+                if(scoreName.opacity==1&&editor.text!="")
+                    saveHighScore(editor.text);
+                scoreName.forceClose();
+            }
+            anchors.verticalCenter: parent.verticalCenter
+            width: 72; focus: true
+            anchors.left: spacer.right
+        }
+    }
+
+    Rectangle {
+        id: toolBar
+        color: activePalette.window
+        height: 32; width: parent.width
+        anchors.bottom: screen.bottom
+
+        Button {
+            id: btnA; text: "New Game"; onClicked: {initBoard();}
+            anchors.left: parent.left; anchors.leftMargin: 3
+            anchors.verticalCenter: parent.verticalCenter
+        }
+
+        Text {
+            id: score
+            text: "Score: " + gameCanvas.score; font.bold: true
+            anchors.right: parent.right; anchors.rightMargin: 3
+            anchors.verticalCenter: parent.verticalCenter
+        }
+    }
+}