// Qt
import QtQuick 2.12

//  Qml imports
import "qrc:/globals"
import "qrc:/components"


Item { id: _root

    property alias title        : _title.text
    property alias progressText : _progressText.text
    property alias minimum      : _progressCircle.minimum
    property alias maximum      : _progressCircle.maximum
    property int   value        : 0

    property string leftButtonText  : ""
    property string rightButtonText : ""


    Text { id: _title
        anchors {
            top         : _root.top
            horizontalCenter: parent.horizontalCenter
        }
        color           : Colors.offWhite
        font.pixelSize  : Fonts.fontPixelTextRectExtra
        font.weight     : Font.Medium
    }

    ProgressCircle { id: _progressCircle
        anchors {
            top         : _title.bottom
            topMargin   : Variables.defaultMargin * 4
            horizontalCenter: parent.horizontalCenter
        }
        diameter            : 175
        circleShadowColor   : Colors.mainTreatmentLighterBlue
        thickness           : 10
        value               : _root.value

        Text { id: _progressPercent
            anchors.centerIn: parent
            color           : Colors.offWhite
            font.pixelSize  : Fonts.fontPixelCirclProgressTimeSmall
            text            : _root.value + "%"
        }
    }

    Text { id: _progressText
        anchors {
            top         : _progressCircle.bottom
            topMargin   : Variables.defaultMargin * 2
            horizontalCenter: parent.horizontalCenter
        }
        color           : Colors.statusTextActive
        font.pixelSize  : Fonts.fontPixelContainerTitleSmall
        font.weight     : Font.DemiBold
        font.italic     : true
    }

    Row { id: _buttonRow
        anchors {
            bottom          : parent.bottom
            horizontalCenter: parent.horizontalCenter
        }
        spacing     : Variables.defaultMargin * 3

        TouchRect { id : _leftButton
            width   : Variables.defaultButtonWidth
            height  : Variables.defaultButtonHeight
            text    {
                text            : _root.leftButtonText
                font.pixelSize  : Fonts.fontPixelConfirm
                font.weight     : Font.Medium
            }
            visible     : _root.leftButtonText
            isDefault   : true
        }

        TouchRect { id : _rightButton
            width   : Variables.defaultButtonWidth
            height  : Variables.defaultButtonHeight
            text    {
                text            : _root.rightButtonText
                font.pixelSize  : Fonts.fontPixelConfirm
                font.weight     : Font.Medium
            }
            visible     : _root.rightButtonText
            isDefault   : true
        }
    }
}