Relayout StationListView Pulldown menu

[quandoparte] / application / resources / sailfish / qml / pages / StationListPage.qml

diff --git a/application/resources/sailfish/qml/pages/StationListPage.qml b/application/resources/sailfish/qml/pages/StationListPage.qml
index 7d6deca..a75c314 100644 (file)
--- a/application/resources/sailfish/qml/pages/StationListPage.qml
+++ b/application/resources/sailfish/qml/pages/StationListPage.qml
@@ -4,101 +4,104 @@ import net.cirulla.quandoparte 1.0
 import "StationListPage.js" as Private
 
 Page {
-    property variant stationView
     id: stationListPage
+    property variant stationView
+    property string searchPattern
     Binding {
         target: stationListProxyModel
         property: "searchPattern"
-        value: searchField.text
-    }
-    Binding {
-        target: stationListProxyModel
-        property: "sortingMode"
-        value: header.currentIndex
-    }
-    Binding {
-        target: stationListView
-        property: "section.property"
-        value: header.currentIndex === 0 ? "name" : ""
+        value: stationListPage.searchPattern
     }
-    SilicaListView {
-        id: stationListView
-        clip: true
-        width: parent.width
-        cacheBuffer: 10
+    SilicaFlickable {
+        interactive: !stationListView.flicking
         anchors.fill: parent
-        model:  stationListProxyModel
-        header: Column {
-            ComboBox {
-                id: header
-                currentIndex: stationListProxyModel.sortingMode
-                menu: ContextMenu {
-                    MenuItem {
-                        text: qsTr("by Name")
-                    }
-                    MenuItem {
-                        text: qsTr("by Distance")
-                    }
-                    MenuItem {
-                        text: qsTr("Recently Seen")
-                    }
-                }
-                label: qsTr("Stations")
+        pressDelay: 0
+        PullDownMenu {
+            MenuItem {
+                text: qsTr("Settings")
+                onClicked: pageStack.push(Qt.resolvedUrl("SettingsPage.qml"))
+            }
+            MenuItem {
+                text: qsTr("Show Stations by Distance")
+                onClicked: stationListProxyModel.sortingMode = StationListProxyModel.DistanceSorting
+                enabled: (stationListProxyModel.sortingMode !== StationListProxyModel.DistanceSorting)
             }
+            MenuItem {
+                text: qsTr("Show Stations by Name")
+                onClicked: stationListProxyModel.sortingMode = StationListProxyModel.AlphaSorting
+                enabled: (stationListProxyModel.sortingMode !== StationListProxyModel.AlphaSorting)
+            }
+            MenuItem {
+                text: qsTr("Show Recent Stations")
+                onClicked: stationListProxyModel.sortingMode = StationListProxyModel.RecentUsageSorting
+                enabled: (stationListProxyModel.sortingMode !== StationListProxyModel.RecentUsageSorting)
+            }
+        }
+        PageHeader {
+            id: header
             SearchField {
                 id: searchField
                 placeholderText: qsTr("Search station...")
+                inputMethodHints: Qt.ImhNoAutoUppercase | Qt.ImhNoPredictiveText
+                onTextChanged: stationListPage.searchPattern = searchField.text
+                width: stationListPage.width
+                EnterKey.onClicked: searchField.focus = false
+                EnterKey.iconSource: "image://theme/icon-m-enter-close"
             }
         }
-        section {
-            criteria: ViewSection.FirstCharacter
-            delegate: Item {
+        SilicaListView {
+            id: stationListView
+            clip: true
+            width: parent.width
+            cacheBuffer: 4 * Theme.itemSizeExtraSmall
+            anchors.top: header.bottom
+            anchors.bottom: parent.bottom
+            model:  stationListProxyModel
+            delegate: ListItem {
+                id: listItem
+                contentHeight: Theme.itemSizeExtraSmall
                 width: parent.width
-                height: Theme.itemSizeSmall
-                anchors {
-                    margins: Theme.paddingMedium
+                Label {
+                    id: mainText
+                    anchors {
+                        fill: parent
+                        margins: Theme.paddingMedium
+                    }
+                    x: Theme.paddingLarge
+                    textFormat: Text.StyledText
+                    text: model.name ? Private.highlightSearch(model.name, Theme.highlightColor) : ""
+                    verticalAlignment: Text.AlignVCenter
                 }
-               Image {
-                   anchors {
-                       left: parent.left
-                       right: sectionLabel.left
-                       verticalCenter: parent.verticalCenter
-                       margins: Theme.paddingMedium
-                   }
-                   source: "image://theme/meegotouch-separator-" + (theme.inverted ? "inverted-" : "") + "background-horizontal"
-               }
-               Label {
-                   id: sectionLabel
-                   anchors {
-                       right: sectionRightMargin.left
-                       verticalCenter: parent.verticalCenter
-                   }
-                   text: section
-               }
-                Item {
-                    id: sectionRightMargin
+                Image {
+                    id: favoriteIndicator
+                    visible: model.favorite
+                    source: "image://theme/icon-m-favorite-selected"
                     anchors {
+                        verticalCenter: parent.verticalCenter
                         right: parent.right
                     }
-                    width: Theme.paddingMedium
-                    height: Theme.paddingMedium
                 }
-            }
-            delegate: BackgroundItem {
-                id: listItem
-                height: Theme.itemSizeSmall
-                width: parent.width
-                Label {
-                    id: mainText
-                    x: Theme.paddingLarge
-                    text: Private.highlightSearch(model.name, Theme.highlightColor)
+                menu: contextMenu
+                Component {
+                    id: contextMenu
+                    ContextMenu {
+                        MenuItem {
+                            text: model.favorite ? qsTr("Remove from Favorites") : qsTr("Add to Favorites")
+                            onClicked: {
+                                model.favorite ^= true
+                                console.log("Favorite Stations:" + settings.favoriteStations)
+                            }
+                        }
+                        MenuItem {
+                            text: qsTr("Show on the map")
+                            onClicked: Qt.openUrlExternally("geo:" + model.latitude + "," + model.longitude)
+                        }
+                    }
                 }
+                onPressed: searchField.focus = false
                 onClicked: Private.loadStation(model.name, model.code)
             }
+            VerticalScrollDecorator {}
         }
     }
-    ScrollDecorator {
-        id: decorator
-        flickable: stationListView
-    }
 }