import QtQuick 2.0
import QtQuick.Controls 2.3
import QtQuick.Layouts 1.0
import MaemoConfig 1.0

Rectangle {
    id: appWindow
    visible: true
    color: "black"
    property string highlight: "#00a2ff"
    property int itemHeight: 76

    signal rowClicked(string msg);

    ListModel {
        id: xxx
        ListElement {
            name: "Bill Smith"
            datestr: "10/22/2021 | 11:04 pm"
            type: "call"
            message: ""
            delivery: "sent"
        }
        ListElement {
            datestr: "10/22/2021 | 11:04 pm"
            name: "John Brown"
            type: "call"
            message: "received"
        }
        ListElement {
            datestr: "10/22/2021 | 11:04 pm"
            name: "Sam Wise"
            type: "sms"
            message: "I'm going back, are you done or drinking still?"
            delivery: "sent"
        }
        ListElement {
            datestr: "10/22/2021 | 11:04 pm"
            name: "MijnOverheid"
            type: "sms"
            message: "Uw DigiD sms-code om in te loggen <snip>"
            delivery: "read"
        }
        ListElement {
            datestr: "10/22/2021 | 11:04 pm"
            name: "Wizzup"
            type: "call"
            message: ""
            delivery: "missed"
        }
        ListElement {
            datestr: "10/22/2021 | 11:04 pm"
            name: "dsc"
            type: "sms"
            message: "Call me later plz."
            delivery: "unread"
        }
        ListElement {
            datestr: "10/22/2021 | 11:04 pm"
            name: "Bar Foo"
            type: "call"
            message: ""
            delivery: "sent"
        }
    }

    ListView {
        anchors.topMargin: 10
        anchors.bottomMargin: 10
        anchors.leftMargin: 4
        anchors.rightMargin: 4
        anchors.fill: parent

        model: xxx
        delegate: Rectangle {
            height: itemHeight
            width: parent.width
            color: "black"

            Item {
                height: itemHeight
                width: parent.width

                MouseArea {
                    anchors.fill: parent
                    hoverEnabled: true

                    onEntered: {
                        parent.parent.color = highlight;
                    }
                    onExited: {
                        parent.parent.color = "black";
                    }
                    onClicked: {
                        appWindow.rowClicked('wazaaaa');
                    }
                }
            }

            RowLayout {
                spacing: 0
                height: itemHeight
                width: parent.width

                Item {
                    Layout.preferredWidth: 64
                    Layout.preferredHeight: itemHeight

                    Image {
                        width: 48
                        height: 48
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.verticalCenter: parent.verticalCenter
                        id: imgStatus
                        source: {
                            var img = "";
                            if(type == "sms") {
                                img = "general_sms.png";
                                if(delivery == "sent") {
                                    img = "chat_replied_sms.png";
                                } else if (delivery == "unread") {
                                    img = "chat_unread_sms.png";
                                }
                            } else if(type == "call") {
                                img = "general_sent.png";
                                if(delivery == "received") {
                                    img = "general_received.png";
                                } else if(delivery == "missed") {
                                    img = "general_missed.png";
                                }
                            } else {
                                img = "general_help.png";
                            }
                            return "qrc:///" + img;
                        }
                        smooth: true
                        visible: true
                    }
                }

                Item {
                    // spacer
                    Layout.preferredWidth: 8
                    Layout.preferredHeight: itemHeight
                }


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

                    RowLayout {
                        Layout.fillWidth: true
                        Layout.preferredHeight: itemHeight / 2

                        Text {
                            text: {
                                //return cfg.get(Config.MaemoTest);
                                return "yay"
                            }

                            textFormat: Text.PlainText
                            color: "white"
                            font.pointSize: 18
                            Layout.alignment: Qt.AlignTop
                        }

                        Text {
                            text: {
                                if(message !== "") datestr;
                                else "";
                            }
                            color: "grey"
                            textFormat: Text.PlainText
                            font.pointSize: 12
                            Layout.alignment: Qt.AlignTop

                        }

                        Item {
                            Layout.fillWidth: true
                        }
                    }

                    Text {
                        Layout.fillWidth: true
                        Layout.preferredHeight: itemHeight / 2
                        textFormat: Text.PlainText
                        color: "grey"
                        font.pointSize: 14
                        text: {
                            if(message !== "") message;
                            else datestr;
                        }
                    }
                }

                Item {
                    Layout.preferredHeight: itemHeight
                    Layout.preferredWidth: itemHeight

                    Image {
                        width: 48
                        height: 48
                        anchors.horizontalCenter: parent.horizontalCenter
                        anchors.verticalCenter: parent.verticalCenter
                        id: imgPerson
                        source: "qrc:///general_default_avatar.png"
                        smooth: true
                        visible: true
                    }
                }
            }
        }
    }
}