Clean up and don't allow clicks on already filled places

3 files changed, 149 insertions, 139 deletions

diff --git a/examples/declarative/toys/tic-tac-toe/content/Button.qml b/examples/declarative/toys/tic-tac-toe/content/Button.qml
index 9b2dc8e..d0f387f 100644
--- a/examples/declarative/toys/tic-tac-toe/content/Button.qml
+++ b/examples/declarative/toys/tic-tac-toe/content/Button.qml
@@ -43,35 +43,37 @@ import Qt 4.7
 Rectangle {
     id: container
 
-    property string text: "Button"
-    property bool down: false
-    property string mainCol: "lightgray"
-    property string darkCol: "darkgray"
-    property string lightCol: "white"
+    property string text
+    property bool pressed: false
+
+    signal clicked
 
     width: buttonLabel.width + 20; height: buttonLabel.height + 6
-    border { width: 1; color: Qt.darker(mainCol) } 
-    radius: 8;
-    color: mainCol
+    border { width: 1; color: Qt.darker(container.color) } 
+    radius: 8
+    color: "lightgray"
     smooth: true
 
     gradient: Gradient {
         GradientStop {
-            id: topGrad; position: 0.0
-            color: if (container.down) { darkCol } else { lightCol }
+            position: 0.0
+            color: container.pressed ? "darkgray" : "white"
+        }
+        GradientStop { 
+            position: 1.0
+            color: container.color
         }
-        GradientStop { position: 1.0; color: mainCol }
     }
 
-    signal clicked
-
-    MouseArea { id: mr; anchors.fill: parent; onClicked: container.clicked() }
+    MouseArea { 
+        anchors.fill: parent
+        onClicked: container.clicked()
+    }
 
     Text {
         id: buttonLabel
-
         anchors.centerIn: container
-        text: container.text;
+        text: container.text
         font.pixelSize: 14
     }
 }
diff --git a/examples/declarative/toys/tic-tac-toe/content/tic-tac-toe.js b/examples/declarative/toys/tic-tac-toe/content/tic-tac-toe.js
index f8d6d9f..5a166b7 100644
--- a/examples/declarative/toys/tic-tac-toe/content/tic-tac-toe.js
+++ b/examples/declarative/toys/tic-tac-toe/content/tic-tac-toe.js
@@ -1,145 +1,149 @@
 function winner(board)
 {
     for (var i=0; i<3; ++i) {
-        if (board.children[i].state!=""
-            && board.children[i].state==board.children[i+3].state
-            && board.children[i].state==board.children[i+6].state)
+        if (board.children[i].state != ""
+                && board.children[i].state == board.children[i+3].state
+                && board.children[i].state == board.children[i+6].state)
             return true
 
-        if (board.children[i*3].state!=""
-            && board.children[i*3].state==board.children[i*3+1].state
-            && board.children[i*3].state==board.children[i*3+2].state)
+        if (board.children[i*3].state != ""
+                && board.children[i*3].state == board.children[i*3+1].state
+                && board.children[i*3].state == board.children[i*3+2].state)
             return true
     }
 
-    if (board.children[0].state!=""
-        && board.children[0].state==board.children[4].state!=""
-        && board.children[0].state==board.children[8].state!="")
+    if (board.children[0].state != ""
+            && board.children[0].state == board.children[4].state != ""
+            && board.children[0].state == board.children[8].state != "")
         return true
 
-    if (board.children[2].state!=""
-        && board.children[2].state==board.children[4].state!=""
-        && board.children[2].state==board.children[6].state!="")
+    if (board.children[2].state != ""
+            && board.children[2].state == board.children[4].state != ""
+            && board.children[2].state == board.children[6].state != "")
         return true
 
     return false
 }
 
-function restart()
+function restartGame()
 {
-    // No moves left - start again
+    game.running = true
+
     for (var i=0; i<9; ++i)
         board.children[i].state = ""
 }
 
-function makeMove(pos,player)
+function makeMove(pos, player)
 {
     board.children[pos].state = player
     if (winner(board)) {
-        win(player + " wins")
+        gameFinished(player + " wins")
         return true
     } else {
         return false
     }
 }
 
+function canPlayAtPos(pos)
+{
+    return board.children[pos].state == ""
+}
+
 function computerTurn()
 {
     var r = Math.random();
-    if(r < game.difficulty){
+    if (r < game.difficulty)
         smartAI();
-    }else{
-        randAI();
-    }
+    else
+        randomAI();
 }
 
 function smartAI()
 {
-    function boardCopy(a){
+    function boardCopy(a) {
         var ret = new Object;
         ret.children = new Array(9);
-        for(var i = 0; i<9; i++){
+        for (var i = 0; i<9; i++) {
             ret.children[i] = new Object;
             ret.children[i].state = a.children[i].state;
         }
         return ret;
     }
-    for(var i=0; i<9; i++){
+
+    for (var i=0; i<9; i++) {
         var simpleBoard = boardCopy(board);
-        if (board.children[i].state == "") {
+        if (canPlayAtPos(i)) {
             simpleBoard.children[i].state = "O";
-            if(winner(simpleBoard)){
-                makeMove(i,"O")
+            if (winner(simpleBoard)) {
+                makeMove(i, "O")
                 return
             }
         }
     }
-    for(var i=0; i<9; i++){
+    for (var i=0; i<9; i++) {
         var simpleBoard = boardCopy(board);
-        if (board.children[i].state == "") {
+        if (canPlayAtPos(i)) {
             simpleBoard.children[i].state = "X";
-            if(winner(simpleBoard)){
-                makeMove(i,"O")
+            if (winner(simpleBoard)) {
+                makeMove(i, "O")
                 return
             }
         }
     }
-    function thwart(a,b,c){//If they are at a, try b or c
+
+    function thwart(a,b,c) {    //If they are at a, try b or c
         if (board.children[a].state == "X") {
-            if (board.children[b].state == "") {
-                makeMove(b,"O")
+            if (canPlayAtPos(b)) {
+                makeMove(b, "O")
                 return true
-            }else if (board.children[c].state == "") {
-                makeMove(c,"O")
+            } else if (canPlayAtPos(c)) {
+                makeMove(c, "O")
                 return true
             }
         }
         return false;
     }
-    if(thwart(4,0,2)) return;
-    if(thwart(0,4,3)) return;
-    if(thwart(2,4,1)) return;
-    if(thwart(6,4,7)) return;
-    if(thwart(8,4,5)) return;
-    if(thwart(1,4,2)) return;
-    if(thwart(3,4,0)) return;
-    if(thwart(5,4,8)) return;
-    if(thwart(7,4,6)) return;
-    for(var i =0; i<9; i++){//Backup
-        if (board.children[i].state == "") {
-            makeMove(i,"O")
+
+    if (thwart(4,0,2)) return;
+    if (thwart(0,4,3)) return;
+    if (thwart(2,4,1)) return;
+    if (thwart(6,4,7)) return;
+    if (thwart(8,4,5)) return;
+    if (thwart(1,4,2)) return;
+    if (thwart(3,4,0)) return;
+    if (thwart(5,4,8)) return;
+    if (thwart(7,4,6)) return;
+
+    for (var i =0; i<9; i++) {
+        if (canPlayAtPos(i)) {
+            makeMove(i, "O")
             return
         }
     }
-    restart();
+    restartGame();
 }
 
-function randAI()
+function randomAI()
 {
-    var open = 0;
-    for (var i=0; i<9; ++i)
-        if (board.children[i].state == "") {
-            open += 1;
-        }
-    if(open == 0){
-        restart();
-        return;
+    var unfilledPosns = new Array();
+
+    for (var i=0; i<9; ++i) {
+        if (canPlayAtPos(i))
+            unfilledPosns.push(i);
+    }
+
+    if (unfilledPosns.length == 0) {
+        restartGame();
+    } else {
+        var choice = unfilledPosns[Math.floor(Math.random() * unfilledPosns.length)];
+        makeMove(choice, "O");
     }
-    var openA = new Array(open);//JS doesn't have lists I can append to (i think)
-    var acc = 0;
-    for (var i=0; i<9; ++i)
-        if (board.children[i].state == "") {
-            openA[acc] = i;
-            acc += 1;
-        }
-    var choice = openA[Math.floor(Math.random() * open)];
-    makeMove(choice, "O");
 }
 
-function win(s)
+function gameFinished(message)
 {
-    msg.text = s
-    msg.opacity = 1
-    endtimer.running = true
+    messageDisplay.text = message
+    messageDisplay.visible = true
+    game.running = false
 }
 
diff --git a/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml b/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml
index 707add7..34c3130 100644
--- a/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml
+++ b/examples/declarative/toys/tic-tac-toe/tic-tac-toe.qml
@@ -42,76 +42,80 @@ import Qt 4.7
 import "content"
 import "content/tic-tac-toe.js" as Logic
 
-Item {
+Rectangle {
     id: game
 
-    property bool show: false
+    property bool running: true
     property real difficulty: 1.0   //chance it will actually think
 
-    width: 440
-    height: 480
-    anchors.fill: parent
+    width: display.width; height: display.height + 10
 
     Image {
-        id: boardimage
-        anchors { verticalCenter: parent.verticalCenter; horizontalCenter: parent.horizontalCenter }
+        id: boardImage
         source: "content/pics/board.png"
     }
 
-    Grid {
-        id: board
-        anchors.fill: boardimage
-        columns: 3
-
-        Repeater {
-            model: 9
-            TicTac {
-                width: board.width/3
-                height: board.height/3
-                onClicked: {
-                    if (!endtimer.running) {
-                        if (!Logic.makeMove(index,"X"))
-                            Logic.computerTurn()
-                    }
-                }
-            }
-        }
+    Text {
+        id: messageDisplay
+        anchors.centerIn: parent
+        color: "blue"
+        style: Text.Outline; styleColor: "white"
+        font.pixelSize: 50; font.bold: true
+        visible: false
 
         Timer {
-            id: endtimer
-            interval: 1600
-            onTriggered: { msg.opacity = 0; Logic.restart() }
+            running: messageDisplay.visible
+            onTriggered: { 
+                messageDisplay.visible = false;
+                Logic.restartGame();
+            }
         }
     }
 
-    Row {
-        spacing: 4
-        anchors { top: board.bottom; horizontalCenter: board.horizontalCenter }
+    Column {
+        id: display
 
-        Button {
-            text: "Hard"
-            onClicked: game.difficulty = 1.0;
-            down: game.difficulty == 1.0
-        }
-        Button {
-            text: "Moderate"
-            onClicked: game.difficulty = 0.8;
-            down: game.difficulty == 0.8
-        }
-        Button {
-            text: "Easy"
-            onClicked: game.difficulty = 0.2;
-            down: game.difficulty == 0.2
+        Grid {
+            id: board
+            width: boardImage.width; height: boardImage.height
+            columns: 3
+
+            Repeater {
+                model: 9
+
+                TicTac {
+                    width: board.width/3
+                    height: board.height/3
+
+                    onClicked: {
+                        if (game.running && Logic.canPlayAtPos(index)) {
+                            if (!Logic.makeMove(index, "X"))
+                                Logic.computerTurn();
+                        }
+                    }
+                }
+            }
         }
-    }
 
-    Text {
-        id: msg
+        Row {
+            spacing: 4
+            anchors.horizontalCenter: parent.horizontalCenter
 
-        anchors.centerIn: parent
-        opacity: 0
-        color: "blue"
-        style: Text.Outline; styleColor: "white"
-        font.pixelSize: 50; font.bold: true
+            Button {
+                text: "Hard"
+                pressed: game.difficulty == 1.0
+                onClicked: { game.difficulty = 1.0 }
+            }
+            Button {
+                text: "Moderate"
+                pressed: game.difficulty == 0.8
+                onClicked: { game.difficulty = 0.8 }
+            }
+            Button {
+                text: "Easy"
+                pressed: game.difficulty == 0.2
+                onClicked: { game.difficulty = 0.2 }
+            }
+        }
     }
 }