meegim/qml/DialogMsgOptions.qml

import QtQuick 1.1
import InvMA 1.0

DialogLiquid {
    id: dlgOptionsRoster

    signal itemClicked;
    property string itemSelected: ""

    property variant prevListModel
    property variant currListModel

    hideTo: hideToRight
    height: parent.height*0.3

    ListModel {
        id: modelListOptions
        ListElement {
            name: "clearChat"
            image: "qrc:/qml/images/menu_clear.png"
            submenu: false
            submenuback: false
        }
        ListElement {
            name: "attention"
            image: "qrc:/qml/images/attention.png"
            submenu: false
            submenuback: false
        }
    }

    function textItem( nameElement )
    {
        var ret = ""
        if( nameElement === "clearChat" ) {
            ret = qsTr("Clear chat")
        } else if( nameElement === "attention" ) {
            ret = qsTr("Send attention")
        }
        return ret
    }


    Component {
        id: componentWrapper
        Rectangle {
            id: wrapper
            width: listViewOptions.width-4
            height: 70
            border.color: "gray"
            anchors.horizontalCenter: parent.horizontalCenter
            Image {
                id: imgItem
                anchors.verticalCenter: parent.verticalCenter
                anchors.left: parent.left
                anchors.leftMargin: 20
                source: image
                height: 56; width: height
                smooth: true
            }
            Text {
                id: txtItem
                anchors.verticalCenter: parent.verticalCenter
                anchors.left: imgItem.right
                anchors.leftMargin: 20
                text: textItem( name )
                font.pixelSize: 28
            }
            Image {
                anchors.verticalCenter: parent.verticalCenter
                anchors.right: parent.right
                anchors.rightMargin: 10
                visible: submenu
                source: "qrc:/qml/images/small_arrow_black.png"
                rotation: submenuback ? 0 : 180
            }
            MouseArea {
                id: mouseAreaItem;
                anchors.fill: parent
                onClicked: {
                    wrapper.ListView.view.currentIndex = index
                    if( submenuback ) {
                        currListModel = prevListModel
                        prevListModel = undefined
                        animChangeMenu.running = true
                    } else if( submenu ) {
                        prevListModel = listViewOptions.model
                        if( name == "contact" ) {
                            currListModel = modelListContact
                        }
                        animChangeMenu.running = true
                    } else {
                        dlgOptionsRoster.state = "hidden"
                        dlgOptionsRoster.itemSelected = name
                        dlgOptionsRoster.itemClicked()
                    }
                }
            }

            states: State {
                name: "Current"
                when: wrapper.ListView.isCurrentItem
                PropertyChanges { target: wrapper; color: "lightblue" }
            }
        }
    }

    property int __marg1 : 3
    ListView {
        id: listViewOptions
        anchors.top: parent.top
        anchors.topMargin: __marg1
        anchors.left: parent.left
        anchors.leftMargin: __marg1
        anchors.bottom: parent.bottom
        anchors.bottomMargin: __marg1
        width: parent.width - __marg1*2
        model: modelListOptions
        delegate: componentWrapper
        clip: true
    }

    SequentialAnimation {
        id: animChangeMenu
        running: false
        PropertyAnimation {
            target: listViewOptions
            property: "anchors.bottomMargin"
            from: __marg1
            to: listViewOptions.height
            duration: 300
        }
        ScriptAction {
            script: {
                listViewOptions.model = currListModel
            }
        }
        PropertyAnimation {
            target: listViewOptions
            property: "anchors.bottomMargin"
            from: listViewOptions.height
            to: __marg1
            duration: 300
        }
    }

}