import QtQuick
import QtQuick.Effects
import QtQuick.Controls
import QtQuick.Controls.Material

Item {
    id: root
    property color base_color: "#000F0F0F"
    property color tank_lid_color: "#F0121212"
    property color tank_base_color: "#00FFFFFF"
    property color water_level_color: "#F00F7FAF"
    property color tank_base_border_color: "#F0121212"
    property color text_color: "#F05FAF5F"
    property double height_max: tank_base.height - 10
    property double current_level: 0
    property double percentage_filled: 0
    property int distance: 0
    property double min_thres_input: 0
    property double max_thres_input: 0
    property double rate_of_fill: 0
    property double expected_to_fill: 0

    Rectangle {
        id: base
        color: root.base_color
        anchors.fill: parent
        Rectangle {
            id: tank_lid
            color: root.tank_lid_color
            anchors {
                bottom: tank_base.top
                horizontalCenter: tank_base.horizontalCenter
                bottomMargin: -5
            }
            radius: 10
            width: tank_base.width / 3
            height: tank_base.height / 15
        }

        Rectangle {
            id: tank_base
            color: root.tank_base_color
            anchors.centerIn: parent
            width: parent.width
            height: parent.height
            border.color: root.tank_base_border_color
            border.width: 5
            radius: 4
        }

        Rectangle {
            id: water_level
            color: root.water_level_color
            height: root.current_level
            width: tank_base.width - 10
            anchors {
                bottom: tank_base.bottom
                horizontalCenter: tank_base.horizontalCenter
                bottomMargin: 5
            }
            Behavior on color {
                ColorAnimation {
                    duration: 200
                }
            }
            Behavior on height {
                NumberAnimation {
                    duration: 200
                }
            }
        }

        Text {
            id: water_level_reading
            text: "Current Reading: " + (root.distance / 10)+ " cm"
            font.pointSize: 16
            color: root.text_color
            anchors {
                margins: 5
                top: tank_base.bottom
                horizontalCenter: parent.horizontalCenter
            }
            horizontalAlignment: Text.AlignHCenter
        }

        Text {
            id: water_level_percentage
            text: "Percentage: " + root.percentage_filled + " %"
            font.pointSize: 16
            color: root.text_color
            anchors {
                margins: 5
                top: water_level_reading.bottom
                horizontalCenter: parent.horizontalCenter
            }
            horizontalAlignment: Text.AlignHCenter
        }

        Text {
            id: fill_status
            text: "Filling status: " + (( root.rate_of_fill > 0)? "Filling" : "Discharging")
            font.pointSize: 16
            color: root.text_color
            anchors {
                margins: 5
                top: water_level_percentage.bottom
                horizontalCenter: parent.horizontalCenter
            }
            horizontalAlignment: Text.AlignHCenter
        }
        Text {
            id: rate_of_fill_label
            text: "Rate of fill: " + root.rate_of_fill + " cm/s"
            font.pointSize: 16
            color: root.text_color
            anchors {
                margins: 5
                top: fill_status.bottom
                horizontalCenter: parent.horizontalCenter
            }
            horizontalAlignment: Text.AlignHCenter
        }
        Text {
            id: expected_to_fill_label
            text: "Expected to fill in: " + root.expected_to_fill + " s"
            font.pointSize: 16
            color: root.text_color
            visible: (root.rate_of_fill > 0) ? true : false
            anchors {
                margins: 5
                top: rate_of_fill_label.bottom
                horizontalCenter: parent.horizontalCenter
            }
            horizontalAlignment: Text.AlignHCenter
        }
    }
    function setConfig(config: var) {
        min_thres_input = config.min;
        max_thres_input = config.max;
    }

    function setDistance(distance) {
        root.distance = distance;
        let distance_f = distance / 10;
        console.log("Distance changed to: ", distance_f);
        let current_min_reading = Math.max(0, min_thres_input);
        let effective_max_reading = Math.max(0, max_thres_input) - current_min_reading;
        let current_reading = Math.max(0, distance_f - current_min_reading);
        console.log("Current reading is: " + current_reading)
        console.log("Current min reading is: " + current_min_reading)
        console.log("Effective max reading is: " + effective_max_reading)

        let height_max_possible = root.height_max;
        let percentage_filled = Math.max(0, ((effective_max_reading - current_reading) / effective_max_reading * 100))
        let normalized_height = percentage_filled * height_max_possible / 100;
        console.log("Current reading is: " + current_reading)
        console.log("Normalized height is: " + normalized_height)
        console.log("Percentage filled is: " + percentage_filled)
        root.current_level = normalized_height;
        root.percentage_filled = percentage_filled;
    }
}