import QtQuick 2.0
import Sailfish.Silica 1.0

Page {
    id: page
    Item {
        id: foo
        anchors.fill: parent

        Rectangle {
            id: rect
            width: 270; height: 270
            color: "transparent"
//            y: Theme.paddingMedium
//            x: (page.width - rect.width) /2

//            Drag.active: dragArea.drag.active ??
            Component.onCompleted: {
                y = Theme.paddingMedium
                x = (page.width - rect.width) /2
            }

            Rectangle {
                width: 270; height: 270
                opacity: 0.9; radius: 90
                color: Theme.highlightDimmerColor
                anchors.centerIn: rect
            }

            MouseArea {
                id: dragArea
                anchors.fill: parent

                property real dragMaxX: page.width - Theme.paddingMedium - rect.width
                property real dragMaxY: page.height - Theme.paddingMedium - Theme.itemSizeHuge - rect.height

                drag.target: rect
                drag.axis: Drag.XandYAxis
                drag.minimumX: Theme.paddingMedium
                drag.maximumX: dragMaxX
                drag.minimumY: Theme.paddingMedium
                drag.maximumY: dragMaxY

                Label {
                    anchors.centerIn: parent
                    text: "x: " + Math.round(rect.x) + "\ny: " + Math.round(rect.y)
                }

                drag.onMaximumXChanged: {
                    if (rect.x > dragMaxX)
                        rect.x = dragMaxX
                }

                drag.onMaximumYChanged: {
                    if (rect.y > dragMaxY)
                        rect.y = dragMaxY
                }

            }
        }
    }
}