Git commit 86ee587acfd817c0df9c782224f6ff0c086904ef by Bruno Coudoin.
Committed on 30/08/2015 at 07:49.
Pushed by bcoudoin into branch 'master'.

chess, add support for drag and drop

It is now possible to move pieces by click or by drag.
Added a new square object to model the board independantly of
the pieces.

M  +62   -4    src/activities/chess/Chess.qml
M  +13   -11   src/activities/chess/Piece.qml
M  +2    -2    src/activities/chess/chess.js

http://commits.kde.org/gcompris/86ee587acfd817c0df9c782224f6ff0c086904ef

diff --git a/src/activities/chess/Chess.qml b/src/activities/chess/Chess.qml
index 9d2187a..062a4ae 100644
--- a/src/activities/chess/Chess.qml
+++ b/src/activities/chess/Chess.qml
@@ -71,6 +71,7 @@ ActivityBase {
             property bool difficultyByLevel: activity.difficultyByLevel
             property var positions
             property var pieces: pieces
+            property var squares: squares
             property var history
             property int from
             property bool blackTurn
@@ -173,6 +174,42 @@ ActivityBase {
         }
 =

         Repeater {
+            id: squares
+            model: items.positions
+            delegate: square
+            parent: chessboard
+
+            DropArea {
+                id: square
+                x: items.cellSize * (7 - pos % 8) + spacing / 2
+                y: items.cellSize * Math.floor(pos / 8) + spacing / 2
+                width: items.cellSize - spacing
+                height: items.cellSize - spacing
+                z: 1
+                keys: acceptMove ? ['acceptMe'] : ['sorryNo']
+                property bool acceptMove : false
+                property int pos: modelData.pos
+                property int spacing: 6 * ApplicationInfo.ratio
+                Rectangle {
+                    id: possibleMove
+                    anchors.fill: parent
+                    color: parent.containsDrag ? 'green' : 'transparent'
+                    border.width: parent.acceptMove ? 5 : 0
+                    border.color: "black"
+                    z: 1
+                }
+            }
+
+            function getSquareAt(pos) {
+                for(var i=3D0; i < squares.count; i++) {
+                    if(squares.itemAt(i).pos =3D=3D=3D pos)
+                        return squares.itemAt(i)
+                }
+                return(undefined)
+            }
+        }
+
+        Repeater {
             id: pieces
             model: items.positions
             delegate: piece
@@ -187,24 +224,46 @@ ActivityBase {
                 img: modelData.img
                 x: items.cellSize * (7 - pos % 8) + spacing / 2
                 y: items.cellSize * Math.floor(pos / 8) + spacing / 2
+                z: 1
                 pos: modelData.pos
                 newPos: modelData.pos
                 rotation: - chessboard.rotation
 =

                 property int spacing: 6 * ApplicationInfo.ratio
 =

+                Drag.active: dragArea.drag.active
+                Drag.hotSpot.x: width / 2
+                Drag.hotSpot.y: height / 2
+
                 MouseArea {
+                    id: dragArea
                     anchors.fill: parent
                     enabled: !items.gameOver
-                    onClicked: {
+                    drag.target: parent
+                    onPressed: {
+                        piece.Drag.keys =3D ['acceptMe']
+                        parent.z =3D 100
                         if(parent.isWhite =3D=3D 1 && !items.blackTurn ||
                                 parent.isWhite =3D=3D 0 && items.blackTurn=
) {
                             items.from =3D parent.newPos
                             Activity.showPossibleMoves(items.from)
-                        } else if(items.from !=3D -1 && parent.acceptMove)=
 {
+                        } else if(items.from !=3D -1 && squares.getSquareA=
t(parent.newPos)['acceptMove']) {
                             Activity.moveTo(items.from, parent.newPos)
                         }
                     }
+                    onReleased: {
+                        if(piece.Drag.target) {
+                            console.log("1")
+                            if(items.from !=3D -1) {
+                                Activity.moveTo(items.from, piece.Drag.tar=
get.pos)
+                            }
+                        } else {
+                            var pos =3D parent.pos
+                            // Force recalc of the old x,y position
+                            parent.pos =3D 0
+                            pieces.getPieceAt(pos).move(pos)
+                        }
+                    }
                 }
             }
 =

@@ -212,8 +271,7 @@ ActivityBase {
                 var fromPiece =3D getPieceAt(from)
                 var toPiece =3D getPieceAt(to)
                 toPiece.hide(from)
-                fromPiece.pos =3D to
-                fromPiece.newPos =3D to
+                fromPiece.move(to)
             }
 =

             function promotion(to) {
diff --git a/src/activities/chess/Piece.qml b/src/activities/chess/Piece.qml
index ecdcebd..f9ad25b 100644
--- a/src/activities/chess/Piece.qml
+++ b/src/activities/chess/Piece.qml
@@ -37,7 +37,7 @@ Image {
 =

 =

     SequentialAnimation {
-        id: moveAnim
+        id: hideAnim
         NumberAnimation {
             target: piece
             property: "scale"
@@ -59,6 +59,11 @@ Image {
             property: 'scale'
             value: 1
         }
+        PropertyAction {
+            target: piece
+            property: 'z'
+            value: 2
+        }
     }
 =

     SequentialAnimation {
@@ -84,22 +89,19 @@ Image {
         }
     }
 =

-    Rectangle {
-        id: possibleMove
-        anchors.fill: parent
-        color: 'transparent'
-        border.width: parent.acceptMove ? 5 : 0
-        border.color: "black"
-        z: 1
-    }
-
     function hide(newPos) {
         piece.newPos =3D newPos
-        moveAnim.start()
+        hideAnim.start()
     }
 =

     function promotion() {
         promotionAnim.start()
     }
+
+    function move(to) {
+        piece.newPos =3D to
+        piece.pos =3D to
+        piece.z =3D 2
+    }
 }
 =

diff --git a/src/activities/chess/chess.js b/src/activities/chess/chess.js
index be07d19..822db8b 100644
--- a/src/activities/chess/chess.js
+++ b/src/activities/chess/chess.js
@@ -257,7 +257,7 @@ function randomMove() {
 // Clear all accept move marker from the chessboard
 function clearAcceptMove() {
     for(var i=3D0; i < items.positions.length; ++i)
-        items.pieces.getPieceAt(i)['acceptMove'] =3D false
+        items.squares.getSquareAt(i)['acceptMove'] =3D false
 }
 =

 // Highlight the possible moves for the piece at position 'from'
@@ -267,7 +267,7 @@ function showPossibleMoves(from) {
     for(var i=3D0; i < result.length; ++i) {
         if(viewPosToEngine(from) =3D=3D result[i][1]) {
             var pos =3D engineToViewPos(result[i][2])
-            items.pieces.getPieceAt(pos)['acceptMove'] =3D true
+            items.squares.getSquareAt(pos)['acceptMove'] =3D true
         }
     }
 }