import QtQuick 2.1
import QtQuick.Window 2.1

Window {
    visible: true
    width: 360
    height: 360

    Item {
        id: root

        anchors.fill: parent

        property alias itemScale: contentItem.scale
        default property alias content: contentItem.data

        Rectangle {
            id: background

            anchors.fill: parent
            anchors.margins: -1
            color: "black"
            opacity: 0.9
        }

        Item {
            id: contentItem

            anchors.fill: parent
            anchors.margins: 10

            Rectangle {
                anchors.fill: parent
                anchors.margins: 50
                color: "green"

                TextInput {
                    id: input

                    anchors.fill: parent
                    anchors.margins: 50

                    color: "black"
                    focus: true
                    clip: true
                    text: "aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa"

                    selectByMouse: true
                    selectionColor: "#008090"
                    inputMethodHints: Qt.ImhNoPredictiveText
                }
            }
        }

        states: [
            State {
                name: "out"
                PropertyChanges { target: root; opacity: 0; itemScale: 0.9 }
            }
        ]

        transitions: [
            Transition {
                from: "out"; to: "";
                SequentialAnimation {
                    NumberAnimation { properties: "opacity,itemScale"; duration: 256; easing.type: Easing.OutQuad }
                }
            },
            Transition {
                from: ""; to: "out";
                SequentialAnimation {
                    NumberAnimation { properties: "opacity,itemScale"; duration: 256; easing.type: Easing.OutQuad }
                }
            }
        ]
    }

    MouseArea {
        anchors.fill: parent
        onClicked: {
            root.state = (root.state == "" ? "out" : "")
       }
    }
}