import QtQuick 2.0
import QtQuick.Controls 2.0
import de.itsblue.ScStw 2.0
import de.itsblue.ScStwMonitor 2.0

Column {
    id: timerCol

    opacity: backend.scStwClient.state === ScStwClient.CONNECTED ? 1:0

    spacing: 0

    Repeater {
        id: timerRep

        property var clearedTimers: removeDisabledTimers(backend.race.timers)

        function removeDisabledTimers(timers) {
            var ret = []
            for(var i = 0; i < timers.length; i++) {
                if(timers[i]["state"] !== ScStwTimer.DISABLED)
                    ret.push(timers[i])
            }
            return ret
        }

        model: clearedTimers.length

        delegate: Item {
            id: timerDel

            width: parent.width
            height: timerCol.height / timerRep.model

            Label {
                id: laneNameLa

                anchors {
                    left: parent.left
                }

                leftPadding: parent.width * 0.03

                width: parent.width * 0.15
                height: parent.height * 0.5

                fontSizeMode: Text.Fit

                verticalAlignment: Text.AlignVCenter
                horizontalAlignment: Text.AlignLeft

                text:  ""//index === 0 ? "A":"B"

                color: "#2a5266"

                font.pixelSize: height
                font.family: timerFont.name

                Rectangle {
                    anchors.fill: parent
                    color: "red"
                    opacity: 0
                }
            }

            Label {
                id: timerTextLa

                anchors.centerIn: parent
                anchors.horizontalCenterOffset: laneNameLa.text !== "" ? parent.width * 0.06:0
                anchors.verticalCenterOffset: -(parent.height * 0.04 * reactTimeLa.opacity)

                width: parent.width * 0.8
                height: parent.height * 0.8

                elide: "ElideRight"
                color: ([ScStwTimer.WON].indexOf(timerRep.clearedTimers[index]["state"]) >= 0 ? "#6bd43b" :
                                                                           [ScStwTimer.FAILED,ScStwTimer.LOST].indexOf(timerRep.clearedTimers[index]["state"]) >= 0 ? "#e03b2f":
                                                                                                                                   "black")

                text: timerRep.clearedTimers[index]["text"]

                fontSizeMode: Text.Fit

                verticalAlignment: Text.AlignVCenter
                horizontalAlignment: Text.AlignHCenter

                font.pixelSize: height
                font.family: timerFont.name
                minimumPixelSize: 1
            }

            Label {
                id: reactTimeLa

                property int rtime: timerRep.clearedTimers[index]["reactionTime"]

                anchors {
                    centerIn: parent
                    verticalCenterOffset: timerTextLa.contentHeight * 0.4 + reactTimeLa.contentHeight * 0.4 + timerTextLa.anchors.verticalCenterOffset
                    horizontalCenterOffset: parent.width * 0.06
                }

                width: parent.width * 0.6
                height: parent.height * 0.15

                scale: enabled ? 1:0.9
                opacity: enabled ? 1:0

                enabled: timerRep.clearedTimers[index]["state"] >= ScStwTimer.STARTING  && rtime !== 0

                fontSizeMode: Text.Fit

                verticalAlignment: Text.AlignVCenter
                horizontalAlignment: Text.AlignHCenter

                text: "reaction time (ms):  " + Math.round(rtime)

                color: "black"//appTheme.style.textColor

                font.pixelSize: timerTextLa.font.pixelSize * 0.5
                font.family: timerFont.name
                minimumPixelSize: 1

                Behavior on opacity {
                    NumberAnimation {
                        duration: 200
                    }
                }

                Behavior on scale {
                    NumberAnimation {
                        duration: 200
                    }
                }

            }
        }
    }

    Behavior on opacity {
        NumberAnimation {
            duration: 200
        }
    }
}