main

import QtQuick 2.0

Rectangle {
    id: page
    width: 300
    height: 350
    color: "#acf4f7"
    border.width: 0
    x: 0
    y: 0
    property string gotdata:"no output yet"
    //============================//
    // signal
    signal qmlRequireData(string msg)
    //============================//
    // slot
    function qmlUpdateData(text){
        page.gotdata=text
        // msg designer:: imperative code not supported in Qt Quick
        page.color=text
    }
    //============================//    
    property int pressCount: 0
    Text {
        x: 132
        y: 136
        color: "#121098"
        text: qsTr("Signal Data Exchange in C++Qt/QML for Android/iOS/WP8")
        font.bold: true
        anchors.verticalCenterOffset: -120
        anchors.horizontalCenterOffset: 0
        anchors.verticalCenter: parent.verticalCenter
        anchors.horizontalCenter: parent.horizontalCenter
    }
    Text {
        color: "#121098"
        text: qsTr("Total request sent = "+ page.pressCount)
        font.bold: true
        anchors.verticalCenterOffset: -10
        anchors.horizontalCenterOffset: 0
        anchors.verticalCenter: parent.verticalCenter
        anchors.horizontalCenter: parent.horizontalCenter
    }
    Text {
        x: 67
        y: 65
        color: "#121098"
        text: qsTr("returned ouput = "+page.gotdata)
        font.bold: true
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.horizontalCenterOffset: 1
        anchors.verticalCenter: parent.verticalCenter
        anchors.verticalCenterOffset: 18
    }
    //========================================//
    // Init:: container_buttonOK
    Rectangle {
        id: container_buttonOK
        x: 146
        y: 231
        width: 64
        height: 59
        color: "#00000000"
        anchors.verticalCenterOffset: 120
        anchors.verticalCenter: parent.verticalCenter
        anchors.horizontalCenter: parent.horizontalCenter

        Rectangle {
            id: buttonRect
            x: -103
            y: -10
            width: 201
            height: 80
            radius: 14
            Text {
                id: textLabel_ok3
                x: 82
                y: 27
                width: 38
                height: 27
                color: "#f2f53d"
                text: "Ok"
                font.bold: true
                font.pixelSize: 22
            }
            border.width: 6
            gradient: Gradient {
                GradientStop {
                    position: 0
                    color: "#bef7fe"
                }
                GradientStop {
                    position: 1
                    color: "#000000"
                }
            }
            clip: false
        }

        MouseArea {
            anchors.rightMargin: -34
            anchors.bottomMargin: -11
            anchors.leftMargin: -103
            anchors.topMargin: -10
            hoverEnabled: false
            anchors.fill: parent
            onClicked: {
                console.log("got clicked")
                page.pressCount++
                page.qmlRequireData("send me ouput: " + page.pressCount)
            }
        }
    }
    // End:: container_buttonOK
    //========================================//
    // Init:: container_buttonExit
    Rectangle {
        id: container_buttonExit
        x: 219
        width: 64
        height: 59
        color: "#00000000"
        anchors.top: parent.top
        anchors.topMargin: 10
        anchors.right: parent.right
        anchors.rightMargin: 10
        Rectangle {
            id: rect_Exit
            x: -23
            y: 0
            width: 87
            height: 73
            radius: 14
            gradient: Gradient {
                GradientStop {
                    position: 0
                    color: "#f43e54"
                }

                GradientStop {
                    position: 1
                    color: "#000000"
                }
            }
            clip: false
            Text {
                id: textLabel_Exit
                x: 35
                y: 23
                width: 18
                height: 27
                color: "#ffed49"
                text: "X"
                font.bold: true
                font.pixelSize: 22
            }
            border.width: 6
        }

        MouseArea {
            anchors.topMargin: 0
            anchors.leftMargin: -23
            anchors.rightMargin: 0
            hoverEnabled: false
            anchors.fill: parent
            anchors.bottomMargin: -14
            onClicked: {
                Qt.quit();
            }
        }
    }
    // End:: container_buttonExit
    //========================================//
}