From b33b6cf71c35868feafa88442b44d14a6497cfdc Mon Sep 17 00:00:00 2001
From: Dorian Pula <dorian.pula@amber-penguin-software.ca>
Date: Thu, 15 Feb 2018 08:57:36 -0500
Subject: [PATCH] Break out menu button into component.  Add menu items.

---
 Menu.qml       | 72 ++++++++++++++++++--------------------------------
 MenuButton.qml | 50 +++++++++++++++++++++++++++++++++++
 2 files changed, 76 insertions(+), 46 deletions(-)
 create mode 100644 MenuButton.qml

diff --git a/Menu.qml b/Menu.qml
index fc0a53b..040c1a2 100644
--- a/Menu.qml
+++ b/Menu.qml
@@ -1,5 +1,4 @@
 import QtQuick 2.0
-import QtQuick.Controls 1.4
 import QtGraphicalEffects 1.0
 
 Rectangle {
@@ -36,55 +35,36 @@ Rectangle {
         width: parent.width
         spacing: 10
 
-        Rectangle {
-            id: button
-            anchors.horizontalCenter: parent.horizontalCenter
-
-            width: parent.width - 50
-            height: 50
-            radius: 10
-
-            color: "#9e9e9e"
-
-            border.color: "#333333"
-            border.width: 2
-
-            layer.enabled: true
-            layer.effect: DropShadow {
-                transparentBorder: true
-                horizontalOffset: 5
-                verticalOffset: 5
-                radius: 5.0
-                samples: 5
-            }
-
-            Text {
-                text: "New Game"
-                font.pointSize: 18
-                font.bold: true
-                height: 30
-
-                anchors.horizontalCenter: parent.horizontalCenter
-                anchors.verticalCenter: parent.verticalCenter
-            }
-
-            MouseArea {
-                anchors.fill: parent
-                onPressed: button.color = "#555555"
-                onReleased: button.color = "#9e9e9e"
-                onClicked: {
-                    appPage.source = "Board.qml"
-                }
+        MenuButton {
+            buttonText: "New Game"
+            function actionOnClick() {
+                appPage.source = "Board.qml"
             }
         }
 
-        Button {
-            text: "Quit"
-            width: parent.width - 50
-            height: 50
-            onClicked: Qt.quit()
+        MenuButton {
+            buttonText: "Open Game"
+//            disabled: true
+        }
 
-            anchors.horizontalCenter: parent.horizontalCenter
+        MenuButton {
+            buttonText: "Save Game"
+//            disabled: true
+        }
+
+        MenuButton {
+            buttonText: "About justCheckers"
+        }
+
+        MenuButton {
+            buttonText: "Settings"
+        }
+
+        MenuButton {
+            buttonText: "Quit"
+            function actionOnClick() {
+                Qt.quit()
+            }
         }
     }
 
diff --git a/MenuButton.qml b/MenuButton.qml
new file mode 100644
index 0000000..fa7865a
--- /dev/null
+++ b/MenuButton.qml
@@ -0,0 +1,50 @@
+import QtQuick 2.0
+import QtGraphicalEffects 1.0
+
+Rectangle {
+    id: button
+
+    property color backgroundAtRest: "#9e9e9e"
+    property color backgroundActive: "#555555"
+
+    property string buttonText: "Button"
+
+    function actionOnClick() { }
+
+    anchors.horizontalCenter: parent.horizontalCenter
+    
+    width: parent.width - 50
+    height: 50
+    radius: 10
+    
+    color: backgroundAtRest
+    
+    border.color: "#333333"
+    border.width: 2
+    
+    layer.enabled: true
+    layer.effect: DropShadow {
+        transparentBorder: true
+        horizontalOffset: 5
+        verticalOffset: 5
+        radius: 5.0
+        samples: 5
+    }
+    
+    Text {
+        text: buttonText
+        font.pointSize: 18
+        font.bold: true
+        height: 30
+        
+        anchors.horizontalCenter: parent.horizontalCenter
+        anchors.verticalCenter: parent.verticalCenter
+    }
+    
+    MouseArea {
+        anchors.fill: parent
+        onPressed: button.color = backgroundActive
+        onReleased: button.color = backgroundAtRest
+        onClicked: actionOnClick()
+    }
+}