import QtQuick 1.0


Item {

    id: slider; width: 18; height: 180

   // value is read/write.
    property real value
    onValueChanged: updatePos();
    property real maximum: 1
    property real minimum: 0
    property int xMax: height - handle.height
    onXMaxChanged: updatePos();
    onMinimumChanged: updatePos();


    function updatePos() {
        var pos;
        if(value>1) value = 1
        if(value<0) value = 0
        if (maximum > minimum) {
            pos = (value * slider.xMax) / (maximum - minimum);
            //pos = Math.min(pos, width - handle.width);
            //pos = Math.max(pos, 0);
            handle.y = pos;
        } else {
            pos = (value * slider.xMax) / (minimum - maximum );

            handle.y = pos;
        }
        console.log("UpdatePos: "+handle.y)
        console.log("Value From Slider "+slider.value)
    }


    Rectangle {
        anchors.centerIn: parent
        height: 180; width: 8
        border.color: "#707070"; border.width: 1
        radius: 2
        color: "white"
        /*
        gradient: Gradient {
            GradientStop { position: 0.0; color: "gray" }
            GradientStop { position: 1.0; color: "#3B3B3B" }

        }
        */
        MouseArea{
            id: mou
            anchors.fill: parent
            onClicked: {
            console.log("MouseX "+mou.mouseY)
                var cliclPos = mou.mouseY-16
                if(cliclPos>165) cliclPos=165
               slider.value = ((slider.maximum - slider.minimum) * (cliclPos) / slider.xMax)
            }
        }
    }

    Rectangle {
        id: handle; smooth: true
        border.width: 1
        border.color: "gray"
        x: 0
        y: 0; width: 18; height: 30
        radius: 13
        color: "white"
        /*
        gradient: Gradient {
            GradientStop { position: 0.0; color: "#e70050" }
            GradientStop { position: 1.0; color: "#e60040" }
        }
*/
        MouseArea {
            id: mouse
            anchors.fill: parent; drag.target: parent
            drag.axis: Drag.YAxis; drag.minimumY: slider.minimum; drag.maximumY: slider.xMax

            onPositionChanged: {
                var buffer = ((slider.maximum - slider.minimum) * (handle.y) / slider.xMax)

                slider.value = buffer.toFixed(1)
            }

        }
    }
}