import QtQuick 2.11
import QtQuick.Controls 2.4
import "./"
import "../components"

Page {
    id: root

    signal pageOpened()

    background: Rectangle {
        color: settings.theme("PageBackgroundColor")
    }

    TextField {
        id: sumInput
        placeholderText: "sum"
        visible: !endPageVisibility
        validator: IntValidator {bottom: -1000000; top: 1000000;}
        anchors {
            horizontalCenter: parent.horizontalCenter
            top: parent.top
            topMargin: parent.height * 0.1
        }
        Keys.onReturnPressed: calculator.checkSum(sumInput.text)
    }

    GameButton {
        id: checkButton
        height: parent.width * 0.2
        text: "check"
        visible: !calculator.endPageVisibility
        anchors {
            horizontalCenter: parent.horizontalCenter
            top: parent.top
            topMargin: parent.height * 0.3
        }
        onClicked: {
            calculator.checkSum(sumInput.text)
        }
    }

    Label {
        id: won
        text: calculator.endPageLabelText
        font.pixelSize: parent.width * 0.2
        visible: calculator.endPageVisibility
        color: settings.theme("PageTextColor")
        anchors {
            horizontalCenter: parent.horizontalCenter
            top: parent.top
            topMargin: parent.height * 0.05
        }
    }

    Label {
        id: sum
        text: "Sum: " + calculator.sum
        font.pixelSize: parent.width * 0.1
        visible: calculator.endPageVisibility ? ( won.text==="You Lose!" ? true:false):false
        color: settings.theme("PageTextColor")
        anchors {
            horizontalCenter: parent.horizontalCenter
            top: parent.top
            topMargin: parent.height * 0.4
        }
    }

    Row {
        id: buttonRow
        anchors {
            horizontalCenter: parent.horizontalCenter
            bottom: parent.bottom
            bottomMargin: parent.height * 0.15
        }
        height: childrenRect.height
        width: childrenRect.width
        spacing: parent.width * 0.1
        visible: calculator.endPageVisibility ? true:false

        GameButton {
            id: homeButton
            height: root.width * 0.2
            text: "home"
            onClicked: {
                game.start()
            }
        }

        GameButton {
            id: startButtons
            height: root.width * 0.2
            text: "start"
            onClicked: {
                calculator.start()
            }
        }
    }
}