import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0

ApplicationWindow {
    visible: true
    width: 1080
    height: 768
    title: qsTr("Robot Control")


    ColumnLayout {
        Layout.fillHeight: true
        Layout.fillWidth: true

        Button {
            Layout.fillHeight: true
            Layout.fillWidth: true
            id: button
            text: qsTr("Connect Webcam")
            checked: false
            font.pixelSize: 20
            checkable: true
            background: Rectangle {
                border.width: 0
                color: "#DDDDDD"
                width: button.width
                height: button.height
            }
            onClicked: {
                if (button.checked) {
                    button.background.color = "#0074D9";
                }
                else {
                    button.background.color = "#DDDDDD";
                }
                gui.cmd_connect(button.checked);
            }
        }

        Image {
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.alignment: Qt.AlignLeft
            fillMode: Image.PreserveAspectFit
            id: webcamImage
            cache: false
            asynchronous: true
            source: "image://webcam/video"
        }

        Connections {
            target: gui

            onWebcam_status: {
                button.checked = connected;
                if (connected) {
                    button.background.color = "#2ECC40";
                }
                else {
                    button.background.color = "#DDDDDD";
                }
            }

            onWebcam_refresh: {
                webcamImage.source = "";
                webcamImage.source = "image://webcam/video";
            }
        }
    }
}