import QtQuick 2.0
import Sailfish.Silica 1.0
import "../common"

Page {
    id: searchPage

    SilicaListView {
        id: list

        anchors.fill: parent
        currentIndex: -1

        header: Item {
            width: list.width
            height: headerBox.implicitHeight
        }

        model: genreModel

        delegate: ListItem {
            id: listItem

            Label {
                anchors {
                    left: parent.left
                    leftMargin: Theme.paddingLarge

                    right: parent.right
                    rightMargin: Theme.paddingLarge

                    verticalCenter: parent.verticalCenter
                }

                //text: stationModel.hasFilter ? Theme.highlightText(model.title, stationModel.filter, Theme.highlightColor) : model.title //!listItem.filtering ? name : Theme.highlightText(name, view.searchField.text, Theme.highlightColor)
                text: model.Name
                font.pixelSize: Theme.fontSizeMedium

                color: listItem.highlighted ? Theme.highlightColor : Theme.primaryColor
            }
        }

//        header: PageHeader {
//            id: header
//            title: qsTr("Genres")
//        }

        ViewPlaceholder {
            text: qsTr("No genres available.")
            enabled: list.count == 0
        }

        VerticalScrollDecorator {}
    }

    Column {
        id: headerBox
        parent: list.headerItem ? list.headerItem : searchPage

        anchors {
            left: parent.left
            right: parent.right
        }

        PageHeader {
            title: qsTr("Search")
        }

        SearchField {
            id: searchField
            anchors {
                left: parent.left
                right: parent.right
            }

            placeholderText: qsTr("Search")

            onTextChanged: {
                //stationModel.filter = text
                if (text)
                    genreModel.qxFetchByQuery_("where name LIKE '%" + text +"%'")
                else
                    genreModel.qxFetchAll_();
            }
        }
    }

    RemorsePopup {
        id: remorse
    }
}