import QtQuick 2.1
import QtQuick.Controls 2.2

BusyIndicator {
    id: control

    property double speed: 1
    property color lineColor: "#21be2b"

    width: 100
    height: 100

    contentItem: Canvas {
        id: spinnerCanvas
        anchors.fill: parent

        property double progress: 0

            function drawSpinner(ctx, width, height, progress){
                var margins = width * 0.01
                var lineWidth = width * 0.1

                ctx.clearRect(0,0,width,height)

                ctx.beginPath();
                ctx.arc(width * 0.5 + margins, height * 0.5 + margins, height*0.5 - margins*2 - lineWidth , 0, 2*Math.PI);

                ctx.strokeStyle = "#dedede";
                ctx.lineWidth = lineWidth
                ctx.stroke();

                ctx.beginPath();
                ctx.arc(width * 0.5 + margins, height * 0.5 + margins, height*0.5 - margins*2 - lineWidth, 2*Math.PI * progress, 2*Math.PI * progress + 0.5*Math.PI);

                ctx.strokeStyle = "#48db09";
                ctx.stroke();
            }


        Timer {
            interval: Math.floor(20 * 1/control.speed)
            running: control.opacity > 0 && control.visible && control.running
            repeat: true

            onTriggered: {
                spinnerCanvas.progress += 0.0027*6
                if(spinnerCanvas.progress >= 1){
                    spinnerCanvas.progress = 0
                }

                spinnerCanvas.requestPaint()
            }
        }

        onPaint: {
            var ctx = getContext("2d");
            spinnerCanvas.drawSpinner(ctx, spinnerCanvas.height, spinnerCanvas.width, spinnerCanvas.progress)
        }

    }
}