meegim/qml/DialogOptionsRoster.qml

import QtQuick 1.1
import InvMA 1.0

DialogLiquid {
    id: dlgOptionsRoster

    signal itemClicked;
    property string itemSelected: ""

    property variant prevListModel
    property variant currListModel

    property bool isOnline: false

    hideTo: hideToRight

    ListModel {
        id: modelListOptions
        ListElement {
            name: "accounts"
            image: "qrc:/qml/images/accounts.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: false
        }
        ListElement {
            name: "contact"
            image: "qrc:/qml/images/contact_menu.png"
            submenu: true
            submenuback: false
            activeOnlyOnline: false
        }
        ListElement {
            name: "offlinejid"
            image: "qrc:/qml/images/onlinepeople.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: false
        }
        /*ListElement {
            name: "groups"
            image: "qrc:/qml/images/presence-online.png"
            submenu: false
            submenuback: false
        }*/
        ListElement {
            name: "myvcard"
            image: "qrc:/qml/images/myvcard.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: true
        }
        ListElement {
            name: "subscribes"
            image: "qrc:/qml/images/menu_auth.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: true
        }
        ListElement {
            name: "enterroom"
            image: "qrc:/qml/images/menu_muc.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: true
        }
        ListElement {
            name: "settings"
            image: "qrc:/qml/images/settings.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: false
        }
        ListElement {
            name: "about"
            image: "qrc:/qml/images/info.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: false
        }
        ListElement {
            name: "quit"
            image: "qrc:/qml/images/app_close.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: false
        }
    }

    ListModel {
        id: modelListContact
        ListElement {
            name: "back"
            image: "qrc:/qml/images/menu_back.png"
            submenu: true
            submenuback: true
            activeOnlyOnline: false
        }
        ListElement {
            name: "vcard"
            image: "qrc:/qml/images/vcard.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: true
        }
        ListElement {
            name: "contactadd"
            image: "qrc:/qml/images/contact_add.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: true
        }
        ListElement {
            name: "contactedit"
            image: "qrc:/qml/images/contact_edit.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: true
        }
        ListElement {
            name: "contactremove"
            image: "qrc:/qml/images/contact_remove.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: true
        }
        ListElement {
            name: "contactsubscribe"
            image: "qrc:/qml/images/subscribe_accept.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: true
        }
        ListElement {
            name: "contactunsubscribe"
            image: "qrc:/qml/images/subscribe_reject.png"
            submenu: false
            submenuback: false
            activeOnlyOnline: true
        }
    }

    function textItem( nameElement )
    {
        var ret = ""
        if( nameElement === "accounts" ) {
            ret = qsTr("Accounts")
        } else if( nameElement === "contact" ) {
            ret = qsTr("Contact")
        } else if( nameElement === "contactadd" ) {
            ret = qsTr("Add contact")
        } else if( nameElement === "contactedit" ) {
            ret = qsTr("Rename contact")
        } else if( nameElement === "contactremove" ) {
            ret = qsTr("Remove contact")
        } else if( nameElement === "offlinejid" ) {
            //ret = qsTr("Show/Hide offline")
            if( xmppClient.showOffline ) {
                ret = qsTr("Hide offline")
            } else {
                ret = qsTr("Show offline")
            }
        } else if( nameElement === "groups" ) {
            //ret = qsTr("Show/Hide groups")
        } else if( nameElement === "about" ) {
            ret = qsTr("About")
        } else if( nameElement === "settings" ) {
            ret = qsTr("Settings")
        } else if( nameElement === "vcard" ) {
            ret = qsTr("vCard")
        } else if( nameElement === "myvcard" ) {
            ret = qsTr("My vCard")
        } else if( nameElement === "quit" ) {
            ret = qsTr("Quit")
        } else if( nameElement === "back" ) {
            ret = qsTr("Back")
        } else if( nameElement === "contactsubscribe" ) {
            ret = qsTr("Request authorization")
        } else if( nameElement === "contactunsubscribe" ) {
            ret = qsTr("Unsubscribe")
        } else if( nameElement === "subscribes" ) {
            ret = qsTr("Received requests")
        } else if( nameElement === "enterroom" ) {
            ret = qsTr("Join groupchat")
        }

        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
                opacity: activeOnlyOnline ? ( isOnline ? 1 : 0.7 ) : 1
            }
            Text {
                id: txtItem
                anchors.verticalCenter: parent.verticalCenter
                anchors.left: imgItem.right
                anchors.leftMargin: 20
                text: textItem( name )
                font.pixelSize: 28
                color: activeOnlyOnline ? ( isOnline ? "black" : "gray" ) : "black"
            }
            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
                enabled: activeOnlyOnline ? ( isOnline ? true : false ) : true
                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
    }

    /*onStateChanged: {
        if( (state == "visible") && (listViewOptions.model !== listViewOptions) ) {
            listViewOptions.model = listViewOptions
        }
    }*/


    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
        }
    }

}