import QtQuick 2.5

Rectangle {
    width: 400
    height: 700

    ListModel {
        id: listModel

        ListElement { label: "dave"; foo: 0 }
        ListElement { label: "jane"; foo: 0 }
        ListElement { label: "paul"; foo: 0 }
    }

    Rectangle {
        anchors.fill: listView
        border.color: "red"
        color: "transparent"
    }

    ListView {
        id: listView
        x: 100
        y: 300
        width: 200
        height: 300

        model: listModel

        delegate: Text { text: label }

        move: Transition { NumberAnimation { properties: "y"; duration: 150 }}

        section.property: "foo"
        section.delegate: Text { text: section; color: "gray" }
    }

    function resetFoos() {
        for (var i=0; i < listModel.count; i++) {
            listModel.get(i).foo = 0;
        }
    }

    property int delay: 800

    Timer {
        id: _t1
        interval: delay
        running: true
        onTriggered: {
            resetFoos(); // this one can be commented out, it doesn't make a difference

            console.log("Bumping Paul to top");
            var paul = listModel.get(2);
            paul.foo = 1;
            listModel.move(2, 0, 1);

            _t2.restart();
        }
    }

    Timer {
        id: _t2
        interval: delay
        onTriggered: {
            resetFoos();

            console.log("Bumping Jane to top, Paul is back down");
            var jane = listModel.get(2);
            jane.foo = 1;

            listModel.move(2, 0, 1);

            _t3.restart();
        }
    }

    Timer {
        id: _t3
        interval: delay
        onTriggered: {
            resetFoos();

            console.log("Bumping Dave to top, Jane is back down");
            var dave = listModel.get(2);
            dave.foo = 2;
            listModel.move(2, 0, 1);

            _t1.restart();
        }
    }

}