Added piece layout

16 files changed, 299 insertions, 3 deletions

diff --git a/harbour-sailchess.pro b/harbour-sailchess.pro
index 762f411..2e954fc 100644
--- a/harbour-sailchess.pro
+++ b/harbour-sailchess.pro
@@ -20,6 +20,7 @@ DISTFILES += qml/harbour-sailchess.qml \
     qml/cover/CoverPage.qml \
     qml/pages/Board.qml \
     qml/Square.qml \
+    qml/Functions.qml \
     rpm/harbour-sailchess.changes.in \
     rpm/harbour-sailchess.changes.run.in \
     rpm/harbour-sailchess.spec \
diff --git a/qml/Functions.qml b/qml/Functions.qml
new file mode 100644
index 0000000..7e32f4e
--- /dev/null
+++ b/qml/Functions.qml
@@ -0,0 +1,25 @@
+import QtQuick 2.0
+import "pages"
+
+Item {
+    id: functions
+
+    function get_piece(i) {
+        if (i === 0 || i === 7) return "rook";
+        else if (i === 1 || i === 6) return "knight";
+        else if (i === 2 || i === 5) return "bishop";
+        else if (i === 3) return "queen";
+        else if (i === 4) return "king";
+        else if (i >= 8 && i <= 15) return "pawn";
+    }
+
+    function fill() {
+        for (var i = 0; i < 16; i++) {
+            const piece = get_piece(i);
+            repeater.itemAt(i).image = piece !== "" ? "images/b" + piece + ".svg" : "";
+            repeater.itemAt(-i + 63).image = piece !== "" ? "images/w" + piece + ".svg" : "";
+        }
+        // Swap white king & queen
+        repeater.itemAt(60).image = [repeater.itemAt(59).image, repeater.itemAt(59).image = repeater.itemAt(60).image][0];
+    }
+}
diff --git a/qml/Square.qml b/qml/Square.qml
index de61de4..f71f3a5 100644
--- a/qml/Square.qml
+++ b/qml/Square.qml
@@ -1,11 +1,20 @@
 import QtQuick 2.0
 
 Rectangle {
+    property int i: 0
+    property string image: ""
+    width: page.width / 8
     height: this.width
+    color: ((i >> 3 ^ i) & 1) == 1 ? "#e8ebef" : "#7d8796"
     border.color: "yellow"
     border.width: 0
     MouseArea {
         anchors.fill: parent
         onClicked: parent.border.width ^= 3
     }
+    Image {
+        width: parent.width
+        height: this.width
+        source: image
+    }
 }
diff --git a/qml/images/bbishop.svg b/qml/images/bbishop.svg
new file mode 100644
index 0000000..4ce248f
--- /dev/null
+++ b/qml/images/bbishop.svg
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">
+  <g style="opacity:1; fill:none; fill-rule:evenodd; fill-opacity:1; stroke:#000000; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;">
+    <g style="fill:#000000; stroke:#000000; stroke-linecap:butt;"> 
+      <path
+        d="M 9,36 C 12.39,35.03 19.11,36.43 22.5,34 C 25.89,36.43 32.61,35.03 36,36 C 36,36 37.65,36.54 39,38 C 38.32,38.97 37.35,38.99 36,38.5 C 32.61,37.53 25.89,38.96 22.5,37.5 C 19.11,38.96 12.39,37.53 9,38.5 C 7.646,38.99 6.677,38.97 6,38 C 7.354,36.06 9,36 9,36 z" />
+      <path
+        d="M 15,32 C 17.5,34.5 27.5,34.5 30,32 C 30.5,30.5 30,30 30,30 C 30,27.5 27.5,26 27.5,26 C 33,24.5 33.5,14.5 22.5,10.5 C 11.5,14.5 12,24.5 17.5,26 C 17.5,26 15,27.5 15,30 C 15,30 14.5,30.5 15,32 z" />
+      <path
+        d="M 25 8 A 2.5 2.5 0 1 1  20,8 A 2.5 2.5 0 1 1  25 8 z" />
+    </g>
+    <path
+       d="M 17.5,26 L 27.5,26 M 15,30 L 30,30 M 22.5,15.5 L 22.5,20.5 M 20,18 L 25,18"
+       style="fill:none; stroke:#ffffff; stroke-linejoin:miter;" />
+  </g>
+</svg>
diff --git a/qml/images/bking.svg b/qml/images/bking.svg
new file mode 100644
index 0000000..d90dc73
--- /dev/null
+++ b/qml/images/bking.svg
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">
+  <g style="fill:none; fill-opacity:1; fill-rule:evenodd; stroke:#000000; stroke-width:1.5; stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;">
+    <path
+       d="M 22.5,11.63 L 22.5,6"
+       style="fill:none; stroke:#000000; stroke-linejoin:miter;"
+       id="path6570" />
+    <path
+       d="M 22.5,25 C 22.5,25 27,17.5 25.5,14.5 C 25.5,14.5 24.5,12 22.5,12 C 20.5,12 19.5,14.5 19.5,14.5 C 18,17.5 22.5,25 22.5,25"
+       style="fill:#000000;fill-opacity:1; stroke-linecap:butt; stroke-linejoin:miter;" />
+    <path
+       d="M 11.5,37 C 17,40.5 27,40.5 32.5,37 L 32.5,30 C 32.5,30 41.5,25.5 38.5,19.5 C 34.5,13 25,16 22.5,23.5 L 22.5,27 L 22.5,23.5 C 19,16 9.5,13 6.5,19.5 C 3.5,25.5 11.5,29.5 11.5,29.5 L 11.5,37 z "
+       style="fill:#000000; stroke:#000000;" />
+    <path
+       d="M 20,8 L 25,8"
+       style="fill:none; stroke:#000000; stroke-linejoin:miter;" />
+    <path
+       d="M 32,29.5 C 32,29.5 40.5,25.5 38.03,19.85 C 34.15,14 25,18 22.5,24.5 L 22.51,26.6 L 22.5,24.5 C 20,18 9.906,14 6.997,19.85 C 4.5,25.5 11.85,28.85 11.85,28.85"
+       style="fill:none; stroke:#ffffff;" />
+    <path
+       d="M 11.5,30 C 17,27 27,27 32.5,30 M 11.5,33.5 C 17,30.5 27,30.5 32.5,33.5 M 11.5,37 C 17,34 27,34 32.5,37"
+       style="fill:none; stroke:#ffffff;" />
+  </g>
+</svg>
diff --git a/qml/images/bknight.svg b/qml/images/bknight.svg
new file mode 100644
index 0000000..02b0894
--- /dev/null
+++ b/qml/images/bknight.svg
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>

+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">

+ <g>

+  <title>Unicorn</title>

+  <g id="Head" style="opacity:1; fill:none; fill-opacity:1; fill-rule:evenodd; stroke:#000000; stroke-width:1.5; stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;">

+    <path id="Neck" d="M 22,10 C 32.5,11 38.5,18 38,39 L 15,39 C 15,30 25,32.5 23,18" style="fill:#000000; stroke:#000000;"/>

+    <path id="Face" fill="#000000" d="m24,18c0.38,2.91 -5.55,7.37 -8,9c-3,2 -2.82,4.34 -5,4c-1.042,-0.94 1.41,-3.04 0,-3c-1,0 0.19,1.23 -1,2c-1,0 -4,1 -4,-4c0,-2 6,-12 6,-12c0,0 -7.5275,-6.475 -7.0413,-7.15c0.4863,-0.675 8.9863,4.45 9.0413,3.65c-0.73,-0.994 -0.5,-2 -0.5,-3c1,-1 3,2.5 3,2.5l2,0c0,0 0.78,-1.992 2.5,-3c1,0 1,3 1,3" style="fill:#000000; stroke:#000000;"/>

+    <path id="Nose" d="M 9.5 25.5 A 0.5 0.5 0 1 1 8.5,25.5 A 0.5 0.5 0 1 1 9.5 25.5 z" style="fill:#ffffff; stroke:#ffffff;"/>

+    <path id="Eye" d="M 15 15.5 A 0.5 1.5 0 1 1  14,15.5 A 0.5 1.5 0 1 1  15 15.5 z" transform="matrix(0.866,0.5,-0.5,0.866,9.693,-5.173)" style="fill:#ffffff; stroke:#ffffff;"/>

+    <path id="Mane" d="M 24.55,10.4 L 24.1,11.85 L 24.6,12 C 27.75,13 30.25,14.49 32.5,18.75 C 34.75,23.01 35.75,29.06 35.25,39 L 35.2,39.5 L 37.45,39.5 L 37.5,39 C 38,28.94 36.62,22.15 34.25,17.66 C 31.88,13.17 28.46,11.02 25.06,10.5 L 24.55,10.4 z " style="fill:#ffffff; stroke:none;"/>

+  </g>

+ </g>

+</svg>

diff --git a/qml/images/bpawn.svg b/qml/images/bpawn.svg
new file mode 100644
index 0000000..072f2fe
--- /dev/null
+++ b/qml/images/bpawn.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">
+  <path
+    d="M 22,9 C 19.79,9 18,10.79 18,13 C 18,13.89 18.29,14.71 18.78,15.38 C 16.83,16.5 15.5,18.59 15.5,21 C 15.5,23.03 16.44,24.84 17.91,26.03 C 14.91,27.09 10.5,31.58 10.5,39.5 L 33.5,39.5 C 33.5,31.58 29.09,27.09 26.09,26.03 C 27.56,24.84 28.5,23.03 28.5,21 C 28.5,18.59 27.17,16.5 25.22,15.38 C 25.71,14.71 26,13.89 26,13 C 26,10.79 24.21,9 22,9 z "
+    style="opacity:1; fill:#000000; fill-opacity:1; fill-rule:nonzero; stroke:#000000; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:miter; stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;" />
+</svg>
diff --git a/qml/images/bqueen.svg b/qml/images/bqueen.svg
new file mode 100644
index 0000000..6f1e4a5
--- /dev/null
+++ b/qml/images/bqueen.svg
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">
+  <g style="opacity:1; fill:000000; fill-opacity:1; fill-rule:evenodd; stroke:#000000; stroke-width:1.5; stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;">
+    <g style="fill:#000000; stroke:none;">
+      <circle cx="6"    cy="12" r="2.75" />
+      <circle cx="14"   cy="9"  r="2.75" />
+      <circle cx="22.5" cy="8"  r="2.75" />
+      <circle cx="31"   cy="9"  r="2.75" />
+      <circle cx="39"   cy="12" r="2.75" />
+    </g>
+    <path
+       d="M 9,26 C 17.5,24.5 30,24.5 36,26 L 38.5,13.5 L 31,25 L 30.7,10.9 L 25.5,24.5 L 22.5,10 L 19.5,24.5 L 14.3,10.9 L 14,25 L 6.5,13.5 L 9,26 z"
+       style="stroke-linecap:butt; stroke:#000000;" />
+    <path
+       d="M 9,26 C 9,28 10.5,28 11.5,30 C 12.5,31.5 12.5,31 12,33.5 C 10.5,34.5 10.5,36 10.5,36 C 9,37.5 11,38.5 11,38.5 C 17.5,39.5 27.5,39.5 34,38.5 C 34,38.5 35.5,37.5 34,36 C 34,36 34.5,34.5 33,33.5 C 32.5,31 32.5,31.5 33.5,30 C 34.5,28 36,28 36,26 C 27.5,24.5 17.5,24.5 9,26 z"
+       style="stroke-linecap:butt;" />
+    <path
+       d="M 11,38.5 A 35,35 1 0 0 34,38.5"
+       style="fill:none; stroke:#000000; stroke-linecap:butt;" />
+    <path
+       d="M 11,29 A 35,35 1 0 1 34,29"
+       style="fill:none; stroke:#ffffff;" />
+    <path
+       d="M 12.5,31.5 L 32.5,31.5"
+       style="fill:none; stroke:#ffffff;" />
+    <path
+       d="M 11.5,34.5 A 35,35 1 0 0 33.5,34.5"
+       style="fill:none; stroke:#ffffff;" />
+    <path
+       d="M 10.5,37.5 A 35,35 1 0 0 34.5,37.5"
+       style="fill:none; stroke:#ffffff;" />
+  </g>
+</svg>
diff --git a/qml/images/brook.svg b/qml/images/brook.svg
new file mode 100644
index 0000000..337af8f
--- /dev/null
+++ b/qml/images/brook.svg
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">
+  <g style="opacity:1; fill:000000; fill-opacity:1; fill-rule:evenodd; stroke:#000000; stroke-width:1.5; stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;">
+    <path
+      d="M 9,39 L 36,39 L 36,36 L 9,36 L 9,39 z "
+      style="stroke-linecap:butt;" />
+    <path
+      d="M 12.5,32 L 14,29.5 L 31,29.5 L 32.5,32 L 12.5,32 z "
+      style="stroke-linecap:butt;" />
+    <path
+      d="M 12,36 L 12,32 L 33,32 L 33,36 L 12,36 z "
+      style="stroke-linecap:butt;" />
+    <path
+      d="M 14,29.5 L 14,16.5 L 31,16.5 L 31,29.5 L 14,29.5 z "
+      style="stroke-linecap:butt;stroke-linejoin:miter;" />
+    <path
+      d="M 14,16.5 L 11,14 L 34,14 L 31,16.5 L 14,16.5 z "
+      style="stroke-linecap:butt;" />
+    <path
+      d="M 11,14 L 11,9 L 15,9 L 15,11 L 20,11 L 20,9 L 25,9 L 25,11 L 30,11 L 30,9 L 34,9 L 34,14 L 11,14 z "
+      style="stroke-linecap:butt;" />
+    <path
+      d="M 12,35.5 L 33,35.5 L 33,35.5"
+      style="fill:none; stroke:#ffffff; stroke-width:1; stroke-linejoin:miter;" />
+    <path
+      d="M 13,31.5 L 32,31.5"
+      style="fill:none; stroke:#ffffff; stroke-width:1; stroke-linejoin:miter;" />
+    <path
+      d="M 14,29.5 L 31,29.5"
+      style="fill:none; stroke:#ffffff; stroke-width:1; stroke-linejoin:miter;" />
+    <path
+      d="M 14,16.5 L 31,16.5"
+      style="fill:none; stroke:#ffffff; stroke-width:1; stroke-linejoin:miter;" />
+    <path
+      d="M 11,14 L 34,14"
+      style="fill:none; stroke:#ffffff; stroke-width:1; stroke-linejoin:miter;" />
+  </g>
+</svg>
diff --git a/qml/images/wbishop.svg b/qml/images/wbishop.svg
new file mode 100644
index 0000000..0f28d08
--- /dev/null
+++ b/qml/images/wbishop.svg
@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">
+  <g style="opacity:1; fill:none; fill-rule:evenodd; fill-opacity:1; stroke:#000000; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;">
+    <g style="fill:#ffffff; stroke:#000000; stroke-linecap:butt;"> 
+      <path
+        d="M 9,36 C 12.39,35.03 19.11,36.43 22.5,34 C 25.89,36.43 32.61,35.03 36,36 C 36,36 37.65,36.54 39,38 C 38.32,38.97 37.35,38.99 36,38.5 C 32.61,37.53 25.89,38.96 22.5,37.5 C 19.11,38.96 12.39,37.53 9,38.5 C 7.646,38.99 6.677,38.97 6,38 C 7.354,36.06 9,36 9,36 z" />
+      <path
+        d="M 15,32 C 17.5,34.5 27.5,34.5 30,32 C 30.5,30.5 30,30 30,30 C 30,27.5 27.5,26 27.5,26 C 33,24.5 33.5,14.5 22.5,10.5 C 11.5,14.5 12,24.5 17.5,26 C 17.5,26 15,27.5 15,30 C 15,30 14.5,30.5 15,32 z" />
+      <path
+        d="M 25 8 A 2.5 2.5 0 1 1  20,8 A 2.5 2.5 0 1 1  25 8 z" />
+    </g>
+    <path
+      d="M 17.5,26 L 27.5,26 M 15,30 L 30,30 M 22.5,15.5 L 22.5,20.5 M 20,18 L 25,18"
+      style="fill:none; stroke:#000000; stroke-linejoin:miter;" />
+  </g>
+</svg>
diff --git a/qml/images/wking.svg b/qml/images/wking.svg
new file mode 100644
index 0000000..8b2d7b7
--- /dev/null
+++ b/qml/images/wking.svg
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">
+  <g style="fill:none; fill-opacity:1; fill-rule:evenodd; stroke:#000000; stroke-width:1.5; stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;">
+    <path
+      d="M 22.5,11.63 L 22.5,6"
+      style="fill:none; stroke:#000000; stroke-linejoin:miter;" />
+    <path
+      d="M 20,8 L 25,8"
+      style="fill:none; stroke:#000000; stroke-linejoin:miter;" />
+    <path
+      d="M 22.5,25 C 22.5,25 27,17.5 25.5,14.5 C 25.5,14.5 24.5,12 22.5,12 C 20.5,12 19.5,14.5 19.5,14.5 C 18,17.5 22.5,25 22.5,25"
+      style="fill:#ffffff; stroke:#000000; stroke-linecap:butt; stroke-linejoin:miter;" />
+    <path
+      d="M 11.5,37 C 17,40.5 27,40.5 32.5,37 L 32.5,30 C 32.5,30 41.5,25.5 38.5,19.5 C 34.5,13 25,16 22.5,23.5 L 22.5,27 L 22.5,23.5 C 19,16 9.5,13 6.5,19.5 C 3.5,25.5 11.5,29.5 11.5,29.5 L 11.5,37 z "
+      style="fill:#ffffff; stroke:#000000;" />
+    <path
+      d="M 11.5,30 C 17,27 27,27 32.5,30"
+      style="fill:none; stroke:#000000;" />
+    <path
+      d="M 11.5,33.5 C 17,30.5 27,30.5 32.5,33.5"
+      style="fill:none; stroke:#000000;" />
+    <path
+      d="M 11.5,37 C 17,34 27,34 32.5,37"
+      style="fill:none; stroke:#000000;" />
+  </g>
+</svg>
diff --git a/qml/images/wknight.svg b/qml/images/wknight.svg
new file mode 100644
index 0000000..644d6e8
--- /dev/null
+++ b/qml/images/wknight.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>

+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">

+ <g>

+  <title>Unicorn</title>

+  <g id="Head" style="opacity:1; fill:none; fill-opacity:1; fill-rule:evenodd; stroke:#000000; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;">

+    <path id="Neck" d="M 22,10 C 32.5,11 38.5,18 38,39 L 15,39 C 15,30 25,32.5 23,18" style="fill:#ffffff; stroke:#000000;"/>

+   <path id="Face" d="m24,18c0.38,2.91 -5.55,7.37 -8,9c-3,2 -2.82,4.34 -5,4c-1.042,-0.94 1.41,-3.04 0,-3c-1,0 0.19,1.23 -1,2c-1,0 -4,1 -4,-4c0,-2 6,-12 6,-12c0,0 -7.5275,-6.475 -7.0413,-7.15c0.4863,-0.675 8.9863,4.45 9.0413,3.65c-0.73,-0.994 -0.5,-2 -0.5,-3c1,-1 3,2.5 3,2.5l2,0c0,0 0.78,-1.992 2.5,-3c1,0 1,3 1,3" style="fill:#ffffff; stroke:#000000;"/>

+    <path id="Nose" d="M 9.5 25.5 A 0.5 0.5 0 1 1 8.5,25.5 A 0.5 0.5 0 1 1 9.5 25.5 z" style="fill:#000000; stroke:#000000;"/>

+    <path id="Eye" d="M 15 15.5 A 0.5 1.5 0 1 1  14,15.5 A 0.5 1.5 0 1 1  15 15.5 z" transform="matrix(0.866,0.5,-0.5,0.866,9.693,-5.173)" style="fill:#000000; stroke:#000000;"/>

+  </g>

+ </g>

+</svg>

diff --git a/qml/images/wpawn.svg b/qml/images/wpawn.svg
new file mode 100644
index 0000000..1142516
--- /dev/null
+++ b/qml/images/wpawn.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">
+  <path
+    d="M 22,9 C 19.79,9 18,10.79 18,13 C 18,13.89 18.29,14.71 18.78,15.38 C 16.83,16.5 15.5,18.59 15.5,21 C 15.5,23.03 16.44,24.84 17.91,26.03 C 14.91,27.09 10.5,31.58 10.5,39.5 L 33.5,39.5 C 33.5,31.58 29.09,27.09 26.09,26.03 C 27.56,24.84 28.5,23.03 28.5,21 C 28.5,18.59 27.17,16.5 25.22,15.38 C 25.71,14.71 26,13.89 26,13 C 26,10.79 24.21,9 22,9 z "
+    style="opacity:1; fill:#ffffff; fill-opacity:1; fill-rule:nonzero; stroke:#000000; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:miter; stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;" />
+</svg>
diff --git a/qml/images/wqueen.svg b/qml/images/wqueen.svg
new file mode 100644
index 0000000..97043c5
--- /dev/null
+++ b/qml/images/wqueen.svg
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">
+  <g style="opacity:1; fill:#ffffff; fill-opacity:1; fill-rule:evenodd; stroke:#000000; stroke-width:1.5; stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;">
+    <path
+      d="M 9 13 A 2 2 0 1 1  5,13 A 2 2 0 1 1  9 13 z"
+      transform="translate(-1,-1)" />
+    <path
+      d="M 9 13 A 2 2 0 1 1  5,13 A 2 2 0 1 1  9 13 z"
+      transform="translate(15.5,-5.5)" />
+    <path
+      d="M 9 13 A 2 2 0 1 1  5,13 A 2 2 0 1 1  9 13 z"
+      transform="translate(32,-1)" />
+    <path
+      d="M 9 13 A 2 2 0 1 1  5,13 A 2 2 0 1 1  9 13 z"
+      transform="translate(7,-4.5)" />
+    <path
+      d="M 9 13 A 2 2 0 1 1  5,13 A 2 2 0 1 1  9 13 z"
+      transform="translate(24,-4)" />
+    <path
+      d="M 9,26 C 17.5,24.5 30,24.5 36,26 L 38,14 L 31,25 L 31,11 L 25.5,24.5 L 22.5,9.5 L 19.5,24.5 L 14,10.5 L 14,25 L 7,14 L 9,26 z "
+      style="stroke-linecap:butt;" />
+    <path
+      d="M 9,26 C 9,28 10.5,28 11.5,30 C 12.5,31.5 12.5,31 12,33.5 C 10.5,34.5 10.5,36 10.5,36 C 9,37.5 11,38.5 11,38.5 C 17.5,39.5 27.5,39.5 34,38.5 C 34,38.5 35.5,37.5 34,36 C 34,36 34.5,34.5 33,33.5 C 32.5,31 32.5,31.5 33.5,30 C 34.5,28 36,28 36,26 C 27.5,24.5 17.5,24.5 9,26 z "
+      style="stroke-linecap:butt;" />
+    <path
+      d="M 11.5,30 C 15,29 30,29 33.5,30"
+      style="fill:none;" />
+    <path
+      d="M 12,33.5 C 18,32.5 27,32.5 33,33.5"
+      style="fill:none;" />
+  </g>
+</svg>
diff --git a/qml/images/wrook.svg b/qml/images/wrook.svg
new file mode 100644
index 0000000..8d2d932
--- /dev/null
+++ b/qml/images/wrook.svg
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="45" height="45">
+  <g style="opacity:1; fill:#ffffff; fill-opacity:1; fill-rule:evenodd; stroke:#000000; stroke-width:1.5; stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4; stroke-dasharray:none; stroke-opacity:1;">
+    <path
+      d="M 9,39 L 36,39 L 36,36 L 9,36 L 9,39 z "
+      style="stroke-linecap:butt;" />
+    <path
+      d="M 12,36 L 12,32 L 33,32 L 33,36 L 12,36 z "
+      style="stroke-linecap:butt;" />
+    <path
+      d="M 11,14 L 11,9 L 15,9 L 15,11 L 20,11 L 20,9 L 25,9 L 25,11 L 30,11 L 30,9 L 34,9 L 34,14"
+      style="stroke-linecap:butt;" />
+    <path
+      d="M 34,14 L 31,17 L 14,17 L 11,14" />
+    <path
+      d="M 31,17 L 31,29.5 L 14,29.5 L 14,17"
+      style="stroke-linecap:butt; stroke-linejoin:miter;" />
+    <path
+      d="M 31,29.5 L 32.5,32 L 12.5,32 L 14,29.5" />
+    <path
+      d="M 11,14 L 34,14"
+      style="fill:none; stroke:#000000; stroke-linejoin:miter;" />
+  </g>
+</svg>
diff --git a/qml/pages/Board.qml b/qml/pages/Board.qml
index f04a0f1..efa79f7 100644
--- a/qml/pages/Board.qml
+++ b/qml/pages/Board.qml
@@ -6,6 +6,10 @@ Page {
     id: page
     allowedOrientations: Orientation.Portrait
 
+    Functions {
+        id: functions
+    }
+
     SilicaFlickable {
         anchors.fill: parent
         contentHeight: column.height
@@ -33,11 +37,10 @@ Page {
                     id: repeater
                     model: 64
                     delegate: Square {
-                        width: page.width / 8
-                        color: ((index >> 3 ^ index) & 1) == 1 ? "#e8ebef" : "#7d8796"
-
+                        i: index
                     }
                 }
+                Component.onCompleted: functions.fill()
             }
         }
     }