import QtQuick
import "../../../config"

Item {
    id: root

    property var values: []
    property color lineColor: Colors.primary
    property color fillColor: Qt.alpha(Colors.primary, 0.15)
    property real windowMs: 60000
    property real minWidth: 120
    property real graphHeight: 30

    width: Math.max(minWidth, parent ? parent.width : minWidth)
    height: graphHeight

    Canvas {
        id: canvas
        anchors.fill: parent

        onPaint: {
            var ctx = getContext("2d")
            ctx.clearRect(0, 0, width, height)

            var data = root.values
            if (!data || data.length < 2) return

            var now = Date.now()
            var windowStart = now - root.windowMs

            var padY = 2
            var drawH = height - padY * 2

            var maxVal = 0
            for (var i = 0; i < data.length; i++) {
                if (data[i].time >= windowStart && data[i].value > maxVal)
                    maxVal = data[i].value
            }
            if (maxVal === 0) maxVal = 1

            ctx.beginPath()
            var started = false
            for (var j = 0; j < data.length; j++) {
                var pt = data[j]
                if (pt.time < windowStart) continue

                var x = ((pt.time - windowStart) / root.windowMs) * width
                var y = height - padY - (pt.value / maxVal) * drawH

                if (!started) {
                    ctx.moveTo(x, y)
                    started = true
                } else {
                    ctx.lineTo(x, y)
                }
            }
            ctx.strokeStyle = root.lineColor
            ctx.lineWidth = 1.5
            ctx.stroke()

            ctx.lineTo(width, height)
            ctx.lineTo(0, height)
            ctx.closePath()
            ctx.fillStyle = root.fillColor
            ctx.fill()
        }

        Connections {
            target: root
            function onValuesChanged() { canvas.requestPaint() }
            function onWidthChanged() { canvas.requestPaint() }
            function onHeightChanged() { canvas.requestPaint() }
        }
    }
}