import Qt 4.7

Rectangle {
    SystemPalette { id: myPalette; colorGroup: SystemPalette.Active }
    color : myPalette.window;

    id: rectangle1
    width: 400;
    height: 400;
    anchors.fill: parent

    signal dictLink(string link);
    signal fromChange(string value);
    signal toChange(string value)


    function setFromStartValues(startFrom, startTo, startFromIndex, startToIndex){
        comboFrom.setStartValue(startFrom, startFromIndex)
        comboTo.setStartValue(startTo, startToIndex)
    }

    function setToStartValues(startFrom, startTo, startFromIndex, startToIndex){
        comboFrom.setStartValue(startFrom, startFromIndex)
        comboTo.setStartValue(startTo, startToIndex)
    }

    MouseArea {
        id: mouse_area1
        anchors.fill: parent
        z:-1
        onClicked: {
            comboTo.expanded=false;
            comboFrom.expanded=false;
        }
    }

    ComboBox {
        id: comboFrom
        model: fromModell
        anchors.right: comboFromField.right
        anchors.left: comboFromField.left
        parentField: comboFromField
        expanded: false
        height: 20
        basicHeight:20
        index: 1
        onExpandedChanged: {
            if(expanded==true){
                z=2;
                mouse_area1.z=1;
            }
            else{
                z=0;
                mouse_area1.z=-1;
            }
       }
       onValueSelected: rectangle1.fromChange(value)
    }

    ComboBox {
        id: comboTo
        model: fromModell
        anchors.right: comboToField.right
        anchors.left: comboToField.left
        parentField: comboToField
        expanded: false
        height: 20
        basicHeight:20
        index: 1
        onExpandedChanged: {
            if(expanded==true){
                z=2;
                mouse_area1.z=1;
            }
            else{
                z=0;
                mouse_area1.z=-1;
            }
       }
       onValueSelected: rectangle1.toChange(value)
    }

    Item {
        id: comboFromField
        width: 120
        anchors.left: fromLabel.right
        anchors.leftMargin: 5
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 10
        anchors.top: parent.top
    }

    Item {
        id: comboToField
        width: 120
        anchors.left: toLabel.right
        anchors.leftMargin: 5
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 10
        anchors.top: parent.top
    }

    Text {
        id: fromLabel
        text: qsTr("From: ");
        anchors.top: parent.top
        anchors.topMargin: 3
        font.pixelSize: 12
    }

    Text {
        id: toLabel
        text: qsTr("To: ");
        anchors.left: comboFrom.right
        anchors.leftMargin: 15
        anchors.verticalCenterOffset: 0
        anchors.verticalCenter: fromLabel.verticalCenter
        font.pixelSize: 12
    }

    Item {
        id: item1
        anchors.topMargin: 30
        anchors.fill: parent
        ScrollBar2 {
            id: horizontalScrollBar1
            z:2;
            width: parent.width-12;
            windowHeight: parent.height
            anchors.left: parent.left
            orientation: Qt.Horizontal
            position: 100
        }
        ScrollBar2 {
            id: horizontalScrollBar2
            z:2;
            width: parent.width-12;
            windowHeight: parent.height
            anchors.left: horizontalScrollBar1.left
            anchors.leftMargin: horizontalScrollBar1.position
            orientation: Qt.Horizontal
            position: 100
        }
        ScrollBar2 {
            id: horizontalScrollBar3
            z:2;
            width: parent.width-12;
            windowHeight: parent.height
            anchors.left: horizontalScrollBar2.left
            anchors.leftMargin: horizontalScrollBar2.position
            orientation: Qt.Horizontal
            position: 100
        }

        ElementsListView{
            id: dictList
            width: rectangle1.width
            anchors.topMargin: 0
            anchors.top: parent.top
            anchors.bottom: parent.bottom
            highlightResizeSpeed: 1000

            header: Component{
                id: dictListHeader
                Item {
                    width: rectangle1.width
                    height: 20
                    Row {
                        anchors.fill: parent
                        Rectangle {
                            id: fromRecHeader
                            width: horizontalScrollBar1.position
                            height: parent.height
                            radius: 1
                            gradient: Gradient { GradientStop { position: 0.3; color: "#a0cbec" } GradientStop { position: 0.99; color: "#35a0f1" } }

                            Text {
                                id: fromTextHeader
                                text: qsTr("From");
                                elide: Text.ElideRight
                                font.pixelSize: 12
                                anchors.centerIn: parent
                            }
                        }
                        Rectangle {
                            id: toRecHeader
                            width: horizontalScrollBar2.position
                            height: parent.height
                            radius: 1
                            gradient: Gradient { GradientStop { position: 0.3; color: "#a0cbec" } GradientStop { position: 0.99; color: "#35a0f1" } }

                            Text {
                                id: toTextHeader
                                text: qsTr("To");
                                elide: Text.ElideRight
                                font.pixelSize: 12
                                anchors.centerIn: parent
                            }
                        }
                        Rectangle {
                            id: nameRecHeader
                            width: horizontalScrollBar3.position
                            height: parent.height
                            radius: 1
                            gradient: Gradient { GradientStop { position: 0.3; color: "#a0cbec" } GradientStop { position: 0.99; color: "#35a0f1" } }

                            Text {
                                id: nameTextHeader
                                text: qsTr("Title");
                                elide: Text.ElideRight
                                font.pixelSize: 12
                                anchors.centerIn: parent
                            }
                        }
                        Rectangle {
                            id: sizeRecHeader
                            width: 100;
                            height: parent.height
                            radius: 1
                            gradient: Gradient { GradientStop { position: 0.3; color: "#a0cbec" } GradientStop { position: 0.99; color: "#35a0f1" } }

                            Text {
                                id: sizeTextHeader
                                text: qsTr("Size");
                                elide: Text.ElideRight
                                font.pixelSize: 12
                                anchors.centerIn: parent
                            }
                        }
                    }
                }
            }

            delegate: Component{
                id: dictListDelegate
                Item {
                    width: rectangle1.width
                    height:nameText.height
                    MouseArea{
                        anchors.fill: parent
                        onClicked: {
                            dictList.currentIndex = index
                        }
                        onDoubleClicked: {
                            rectangle1.dictLink(link)
                        }
                    }
                    Row {
                        anchors.fill: parent
                        Text {
                            id: fromText
                            text: " "+from+" ";
                            width:  horizontalScrollBar1.position
                            elide: Text.ElideRight
                        }

                        Text {
                            id: toText
                            text: " "+to+" ";
                            width:  horizontalScrollBar2.position
                            elide: Text.ElideRight
                        }

                        Text {
                            id: nameText
                            text: " "+name+" ";
                            width:  horizontalScrollBar3.position
                            elide: Text.ElideRight
                        }
                        Text {
                            id: sizeText
                            text: " "+size+" ";
                            width:  100
                            elide: Text.ElideRight
                        }
                    }
                }
            }
            model: dictModel
        }
    }
}