// Copyright (C) 2023 The Qt Company Ltd.
// SPDX-License-Identifier: LicenseRef-Qt-Commercial

// This file is part of the Qt Safe Renderer module

import QtQuick
import QtQuick.Controls

Item {
    id: connectionItem
    width: 120
    height: 35
    y: 325

    property bool connectionState: clusterDataControl.connectionBool

    RegularExpressionValidator {
        id: ipValidator
        regularExpression: /^(\d{1,3}\.){3}\d{1,3}$/
    }

    // Input field for IP
    TextField {
        id: ipField
        y: 10
        width: connectionItem.width - 20
        height: 25
        font.pixelSize: 13
        text: hostName === "" ? "127.0.0.1" : hostName
        inputMethodHints: Qt.ImhNoPredictiveText // Disable auto-correction
        validator: ipValidator
        anchors.top: parent.top // Anchor to the top of the parent rectangle
    }

    // Input field for Port
    TextField {
        id: portField
        y: ipField.bottom + 10
        width: connectionItem.width - 20
        height: 25
        font.pixelSize: 13
        text: "32124"
        inputMethodHints: Qt.ImhDigitsOnly // Only accept digits
        validator: IntValidator { bottom: 0; top: 65535 } // Validate port range
        anchors.top: ipField.bottom // Anchor to the bottom of the ipField
    }

    // Text that says the status "not connected", "connecting" or "connected"
    Text {
        id: statusValueText
        y: -20
        width: 20
        height: 20
        text: "Not Connected"
        anchors.centerIn: parent.horizontalCenter
        font.pixelSize: 14
        color: "red"

        function updateStatusTextAndColor(connectionState) {
            // QAbstractSocket::UnconnectedState is represented by the value of 0
            if (connectionState === 0) {
                statusValueText.text = "Not Connected";
                statusValueText.color = "red";
                // QAbstractSocket::ConnectingState is represented by the value of 1
            } else if (connectionState === 1) {
                statusValueText.text = "Connecting..";
                statusValueText.color = "blue";
                // QAbstractSocket::ConnectedState is represented by the value of 2
            } else if (connectionState === 2) {
                statusValueText.text = "Connected";
                statusValueText.color = "green";
            }
        }

        Component.onCompleted: {
            clusterDataControl.connectionStateChanged.connect(updateStatusTextAndColor);
        }
    }

    // Connect button
    Button {
        id: connectButton
        x: 100
        y: portField.right + 10
        width: connectionItem.width - 20
        height: ipField.height + portField.height
        text: "Connect"
        enabled: ipField.acceptableInput && portField.acceptableInput // Enable only if inputs are valid
        onClicked: {
            clusterDataControl.connectToServer(ipField.text, portField.text)
        }
    }

    //    Button {
    //        id: button
    //        anchors.bottom: statusValueText.top
    //        anchors.left: statusValueText
    //        text: "Info"
    //        ToolTip.text: "about ip and port" // Set the tool tip text for the button
    //        ToolTip.delay: 1000 // Set the delay before the tool tip is shown (in milliseconds)
    //        ToolTip.timeout: 3000 // Set the timeout after which the tool tip is hidden (in milliseconds)
    //        ToolTip.visible: hovered // Show the tool tip only when the button is hovered
    //    }
}