import QtQuick 2.7
import QtQuick.Window 2.2
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0
import QtQuick.VirtualKeyboard 2.1
import AGL.Demo.Controls 1.0

ApplicationWindow {
    id: root
    visible: true
    width: 1080
    height: 1487

    property string onsId: qsTr("onscreenapp")
    property string pri_path: qsTr("onstestapp/")
    property string filepath: pri_path + qsTr("vics.qml")
    property string msgdata: ""
    property string postmsg: ""

    Text {
        id: title
        width: parent.width
        height: 40
        text: "OnScreen Test App"
        font.pixelSize: 40
    }

    ColumnLayout {
        spacing: 20
        anchors.top: title.bottom
        anchors.topMargin: 40
        anchors.horizontalCenter: title.horizontalCenter

        // show received reply information area
        Flickable {
             id: flickable
             width: 800
             height: 160
             Layout.alignment: Qt.AlignCenter

             TextArea.flickable: TextArea {
                 id: output
                 text: "show received reply information area\n...\n...\n...\n...\n"
                 font.pixelSize: 20
                 wrapMode: TextArea.Wrap
             }

             ScrollBar.vertical: ScrollBar { }
         }

        // select onscreen type area
        GroupBox {
            title: "Please select send OnScreen Type"
            font.pixelSize: 30
            font.bold: true
            width: 800
            height: 100
            Layout.alignment: Qt.AlignLeft

            RowLayout {
                anchors.fill: parent
                RadioButton {
                    text: qsTr("VICS")
                    font.pixelSize: 20
                    checked: true
                    onClicked: {
                        selectVICS();
                        console.log("clicked:", "VICS")
                    }
                }
                RadioButton {
                    text: qsTr("SYS")
                    font.pixelSize: 20
                    onClicked: {
                        selectSYS();
                        console.log("clicked:", "SYS")
                    }
                }
                RadioButton {
                    text: qsTr("TEL")
                    font.pixelSize: 20
                    onClicked: {
                        selectTEL();
                        console.log("clicked:", "TEL")
                    }
                }
                RadioButton {
                    text: qsTr("MSG")
                    font.pixelSize: 20
                    onClicked: {
                        selectMSG();
                        console.log("clicked:", "MSG")
                    }
                }
            }
        }

        // edit post message area
        GroupBox {
            id : editarea
            title: "Please input parameter to onscreen"
            font.pixelSize: 30
            font.bold: true
            width: 800
            height: 400
            Layout.alignment: Qt.AlignLeft

            ColumnLayout {
                spacing:  20
                RowLayout {
                    id: line3
                    spacing: 20
                    Label {
                        id: dataname1
                        anchors.left: parent.left
                        anchors.leftMargin: 30
                        text: qsTr("info")
                        font.pixelSize: 20
                        font.italic: true
                        color: '#00ADDC'
                    }

                    TextInput {
                        id: data1
                        text: qsTr("tokyo vics information!")
                        font.pixelSize: 20
                        font.italic: true
                        anchors.left: dataname1.right
                        anchors.leftMargin: 20
                        color: '#00ADDC'
                        cursorVisible: true
                        inputMethodHints: Qt.ImhNone
                        onFocusChanged: {
                            console.log("OnScreenData1")
                            if(data1.focus)
                                vkb.visible = true
                        }
                    }
                }
                RowLayout {
                    id: line4
                    visible: false
                    spacing: 20
                    Label {
                        id: dataname2
                        anchors.left: parent.left
                        anchors.leftMargin: 30
                        text: qsTr("")
                        font.pixelSize: 20
                        font.italic: true
                        color: '#00ADDC'
                    }

                    TextInput {
                        id: data2
                        text: qsTr("")
                        font.pixelSize: 20
                        font.italic: true
                        anchors.left: dataname2.right
                        anchors.leftMargin: 20
                        color: '#00ADDC'
                        cursorVisible: true
                        inputMethodHints: Qt.ImhNone
                        onFocusChanged: {
                            console.log("OnScreenData2")
                            if(data2.focus)
                                vkb.visible = true
                        }
                    }
                }
                RowLayout {
                    id: line5
                    visible: false
                    spacing: 20
                    Label {
                        id: dataname3
                        anchors.left: parent.left
                        anchors.leftMargin: 30
                        text: qsTr("")
                        font.pixelSize: 20
                        font.italic: true
                        color: '#00ADDC'
                    }

                    TextInput {
                        id: data3
                        text: qsTr("")
                        font.pixelSize: 20
                        font.italic: true
                        anchors.left: dataname3.right
                        anchors.leftMargin: 20
                        color: '#00ADDC'
                        cursorVisible: true
                        inputMethodHints: Qt.ImhNone
                        onFocusChanged: {
                            console.log("OnScreenData3")
                            if(data3.focus)
                                vkb.visible = true
                        }
                    }
                }
            }
        }

        // post button
        Button {
            id: poster
            text: "Post"
            Layout.alignment: Qt.AlignCenter
            onClicked: {
                console.log("poster pressed")
                if (onsId != "")
                    postMessage();
            }
        }
    }

    InputPanel {
        id: vkb
        visible: false
        anchors.right: parent.right
        anchors.left: parent.left
        anchors.bottom: parent.bottom
        onActiveChanged: {
            if(!active) { visible = false; }
        }
    }

    function selectVICS() {
        filepath = pri_path + "vics.qml";
        dataname1.text = "info"
        data1.text = "tokyo vics information!"
        dataname2.text = ""
        data2.text = ""
        dataname3.text = ""
        data3.text = ""
        line3.visible = true
        line4.visible = false
        line5.visible = false
    }

    function selectSYS() {
        filepath = pri_path + "system.qml";
        dataname1.text = "type"
        data1.text = "system error"
        dataname2.text = "text"
        data2.text = "System Error Occured!"
        dataname3.text = ""
        data3.text = ""
        line3.visible = true
        line4.visible = true
        line5.visible = false
    }

    function selectTEL() {
        filepath = pri_path + "phone.qml";
        dataname1.text = "status"
        data1.text = "Call Answered"
        dataname2.text = ""
        data2.text = ""
        dataname3.text = ""
        data3.text = ""
        line3.visible = true
        line4.visible = false
        line5.visible = false
    }

    function selectMSG() {
        filepath = pri_path + "msg.qml";
        dataname1.text = "data1"
        data1.text = "from testApp data1"
        dataname2.text = "data2"
        data2.text = "from testApp data2"
        dataname3.text = "data3"
        data3.text = "from testApp data3"
        line3.visible = true
        line4.visible = true
        line5.visible = true
    }

    function postMessage() {
        postmsg = "{\"file\": \"" + filepath + "\"";
        if (data1.text != "") {
            msgdata = "\"" + dataname1.text + "\":\"" + data1.text + "\"";
        }
        if (data2.text !="") {
            if (msgdata != "")
                msgdata += ",";
            msgdata += "\"" + dataname2.text + "\":\"" + data2.text + "\"";
        }
        if (data3.text !="") {
            if (msgdata != "")
                msgdata += ",";
            msgdata += "\"" + dataname3.text + "\":\"" + data3.text + "\"";
        }
        if(msgdata != "")
            postmsg += ",\"data\":{" + msgdata + "}}"
        else
            postmsg += "}"

        eventHandler.showWindow(onsId, postmsg);
    }

    function qmlOnReplyShowWindow(text) {
        console.log("onstestapp received:",text);
        output.text = text;
        eventHandler.hideWindow(onsId);
    }
}