import QtQuick 2.5
import QtMultimedia 5.0

Item {
    id: root
    width: 800
    height: 600

    property real pressX: 0
    property real pressY: 0
    property real releaseX: 0
    property real releaseY: 0

    anchors.fill: parent
    Rectangle {
        id: rect
        anchors.fill: parent
        color: "black"

        MouseArea {
            id: playArea
            anchors.fill: parent
            onPressed: {
                root.pressX = mouse.x
                root.pressY = mouse.y
            }

            onReleased: {
                root.releaseX = mouse.x
                root.releaseY = mouse.y
                root.doSomething();
            }
        }
    }

    Component {
        id: highlightComponent;
        Rectangle {
            color: "transparent";
            border.color: "black"
            border.width: 2
            property alias text:t1.text;
            property alias ss: image.source;

            Text {
                id: t1
                text: "click"
                anchors.centerIn: parent
                width: 5
            }

            Image {
                id:image
                anchors.centerIn: parent
            }
        }

    }
    function doSomething(){
        var direction_flag = 0
        var dir;
        if((pressX - releaseX) > 0){
            dir= "images/left.png";
        }else if((pressX - releaseX) < 0){
            dir="images/right.png";
        }
        highlightComponent.incubateObject (
                    rect, {
                        "x" : pressX,
                        "y":pressY,
                        width:releaseX - pressX,
                        height: releaseY - pressY,
                        text:"Some text",
                        ss:dir
                    });
    }
}