import QtQuick 2.2
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.2
import Karelia 1.0

ApplicationWindow {
    id: root
    width: ViewerEngine.screenWidth
    height: ViewerEngine.screenHeight
    visible: true

    TextField {
        id: commentField
        font.pointSize: 14
        placeholderText: qsTr("Оставьте комментарий")
        text: ""
    }

    Button {
        id: commentSubmit
        width: 82 * ViewerEngine.ratio
        height: 76 * ViewerEngine.ratio

        style: ButtonStyle {
            background: Rectangle {

                radius: 2
                color: control.pressed ? "#666666" : "#999999"
            }

            label: Label {
                text: qsTr("Отпр.")
                font.pointSize: 16
                color: control.pressed ? "#ffffff" : "#000000"
                verticalAlignment: Text.AlignVCenter
                horizontalAlignment: Text.AlignHCenter
            }
        }

        onClicked: {
            console.log(commentField.text);
        }
    }

    /*function showMessage(message, type, isAuthoHidden)
    {
        if (message)
        {
            switch (type)
            {
                default:
                case MessageTypes.NotifyType:

                    popUp.setSource("NotifyMessage.qml", {message: message});

                    if (isAuthoHidden)
                        notifyMessageTimer.start();

                    break;
            }
        }
    }

    Timer {
        id: notifyMessageTimer
        interval: 5000
        repeat: false
        running: false

        onTriggered: {

            popUp.setSource("");
        }
    }

    Connections {
        target: ViewerEngine
        onMainPageIsReady: main.setSource("main.qml");
    }

    Connections {
        target: ViewerEngine
        onNotifyMessage: {

            showMessage(message, type, isAuthoHidden);
        }
    }

    Rectangle {
        id: mainBlock
        anchors.fill: parent
        color: "#333333"

        states: [
            State {
                name: "PORTRAIT"
                when: mainBlock.height >= 420

                AnchorChanges {
                    target: startLogo
                    anchors.horizontalCenter: introBlock.horizontalCenter
                }

                AnchorChanges {
                    target: appLogo
                    anchors.top: startLogo.bottom
                    anchors.left: undefined
                    anchors.horizontalCenter: introBlock.horizontalCenter
                }
                AnchorChanges {
                    target: organizationLogo
                    anchors.left: undefined
                    anchors.horizontalCenter: introBlock.horizontalCenter
                }
                PropertyChanges {
                    target: appLogo
                    anchors.topMargin: 30 * ViewerEngine.ratio
                }
                PropertyChanges {
                    target: organizationLogo
                    anchors.leftMargin: 0
                }
            },
            State {
                name: "LANDSCAPE"
                when: mainBlock.height < 420

                AnchorChanges {
                    target: startLogo
                    anchors.left: introBlock.left
                    anchors.horizontalCenter: undefined
                }
                AnchorChanges {
                    target: appLogo
                    anchors.top: introBlock.top
                    anchors.left: startLogo.right
                    anchors.horizontalCenter: undefined
                }
                AnchorChanges {
                    target: organizationLogo
                    anchors.left: startLogo.right
                    anchors.horizontalCenter: undefined
                }
                PropertyChanges {
                    target: startLogo
                    anchors.leftMargin: 30 * ViewerEngine.ratio
                }
                PropertyChanges {
                    target: appLogo
                    anchors.topMargin: 0
                    anchors.leftMargin: 30 * ViewerEngine.ratio
                }

                PropertyChanges {
                    target: organizationLogo
                    anchors.leftMargin: 30 * ViewerEngine.ratio
                }
            }
        ]

        Item {
            id: introBlock
            width: mainBlock.width
            height: childrenRect.height
            anchors.verticalCenter: mainBlock.verticalCenter

            Image {
                id: startLogo
                width: 208 * ViewerEngine.ratio
                height: 208 * ViewerEngine.ratio
                anchors.top: introBlock.top
                source: ViewerEngine.imagePath("logo_start.png")
            }

            Image {
                id: appLogo
                width: 264 * ViewerEngine.ratio
                height: 46 * ViewerEngine.ratio
                source: ViewerEngine.imagePath("logo_app_name.png")
            }

            Image {
                id: organizationLogo
                width: 151 * ViewerEngine.ratio
                height: 93 * ViewerEngine.ratio
                anchors.top: appLogo.bottom
                anchors.topMargin: 30 * ViewerEngine.ratio
                source: ViewerEngine.imagePath("logo_organization.png")
            }
        }

        Loader {
            id: main
            anchors.fill: parent
            asynchronous: true
            focus: true
        }

        Loader {
            id: popUp
            z: 30
            anchors.fill: parent
        }

        Connections {
            target: popUp.item
            onPopUpClose: popUp.setSource("");
        }
    }*/
}