Refactored Browse page part of #6

* Divided in .qml and .ui.qml

harbour-received.pro

@@ -31,7 +31,6 @@ OTHER_FILES += qml/harbour-received.qml \
     qml/components/python/api.py \
     qml/components/js/Storage.js \
     qml/components/js/Favorites.js \
-    qml/pages/Browse.qml \
     translations/harbour-received-sv.ts \
     qml/pages/BrowseByCategory.qml \
     qml/components/SleepTimer.qml \
@@ -67,5 +66,7 @@ DISTFILES += \
     qml/components/StationsListContextMenu.qml \
     qml/components/CustomSearchField.qml \
     qml/pages/Settings2.qml \
-    qml/components/RecivedUpgrader.qml
+    qml/components/RecivedUpgrader.qml \
+    qml/pages/BrowsePageForm.ui.qml \
+    qml/pages/BrowsePage.qml
 

qml/pages/BrowsePage.qml

+import QtQuick 2.6
+import "../components/js/Utils.js" as Utils
+
+BrowsePageForm {
+
+    browseListView.onCurrentIndexChanged: {
+        var item = browseModel.get(browseListView.currentIndex)
+
+        switch(item.action) {
+        case "top100":
+            pageStack.push(Qt.resolvedUrl("StationsPage.qml"), {listType: Utils.Top100});
+            break;
+        case "recommended":
+            pageStack.push(Qt.resolvedUrl("StationsPage.qml"), {listType: Utils.Recommended});
+            break;
+        case "localStations":
+            pageStack.push(Qt.resolvedUrl("StationsPage.qml"), {listType: Utils.Local});
+            break;
+        default:
+            pageStack.push(Qt.resolvedUrl("BrowseByCategory.qml"), {category: item.originalTitle, headerTitle: item.title});
+            break;
+        }
+    }
+
+    Component.onCompleted: {
+        browseModel.append({ title: qsTr("Local"), action: "localStations"})
+        browseModel.append({ title: qsTr("Top 100"), action: "top100"})
+        browseModel.append({ title: qsTr("Recommended"), action: "recommended"})
+        browseModel.append({ title: qsTr("Genre"), action: "browse", originalTitle: "genre"})
+        browseModel.append({ title: qsTr("Topic"), action: "browse", originalTitle: "topic"})
+        browseModel.append({ title: qsTr("Country"), action: "browse", originalTitle: "country"})
+        browseModel.append({ title: qsTr("City"), action: "browse", originalTitle: "city"})
+        browseModel.append({ title: qsTr("Language"), action: "browse", originalTitle: "language"})
+    }
+}

qml/pages/Browse.qml → qml/pages/BrowsePageForm.ui.qml

@@ -5,6 +5,11 @@ import "../components/js/Utils.js" as Utils
 Page {
     id: browsePage
 
+    signal categorySelected(int index)
+
+    property alias browseListView: browseListView
+    property alias browseModel: browseModel
+
     SilicaListView {
         id: browseListView
         VerticalScrollDecorator { flickable: browseListView }
@@ -22,6 +27,7 @@ Page {
                     }
                 }
 
+        currentIndex: -1
         model: ListModel {
             id: browseModel
         }
@@ -40,31 +46,10 @@ Page {
                 anchors.topMargin: 7
             }
 
-            onClicked: {
-                if(action === "top100") {
-                    pageStack.push(Qt.resolvedUrl("StationsPage.qml"), {listType: Utils.Top100});
-                }
-                else if(action === "recommended") {
-                    pageStack.push(Qt.resolvedUrl("StationsPage.qml"), {listType: Utils.Recommended});
-                }
-                else if(action === "localStations") {
-                    pageStack.push(Qt.resolvedUrl("StationsPage.qml"), {listType: Utils.Local});
-                }
-                else {
-                    pageStack.push(Qt.resolvedUrl("BrowseByCategory.qml"), {category: originalTitle, headerTitle: title});
-                }
+            Connections {
+                target: listItem
+                onClicked: browseListView.currentIndex = index
             }
         }
     }
-
-    Component.onCompleted: {
-        browseModel.append({ title: qsTr("Local"), action: "localStations"})
-        browseModel.append({ title: qsTr("Top 100"), action: "top100"})
-        browseModel.append({ title: qsTr("Recommended"), action: "recommended"})
-        browseModel.append({ title: qsTr("Genre"), action: "browse", originalTitle: "genre"})
-        browseModel.append({ title: qsTr("Topic"), action: "browse", originalTitle: "topic"})
-        browseModel.append({ title: qsTr("Country"), action: "browse", originalTitle: "country"})
-        browseModel.append({ title: qsTr("City"), action: "browse", originalTitle: "city"})
-        browseModel.append({ title: qsTr("Language"), action: "browse", originalTitle: "language"})
-    }
 }

qml/pages/NavigationMenu.qml

@@ -4,7 +4,7 @@ import "../components/js/Utils.js" as Utils
 NavigationMenuForm {
     property var settingsAction: function() { pageStack.push(Qt.resolvedUrl("Settings.qml")); }
     property var showPlayerAction: function() { player.open = true; }
-    property var browseAction: function() { pageStack.push(Qt.resolvedUrl("Browse.qml"), {listType: Utils.Top100}); }
+    property var browseAction: function() { pageStack.push(Qt.resolvedUrl("BrowsePage.qml"), {listType: Utils.Top100}); }
     property var searchAction: function() { pageStack.push(Qt.resolvedUrl("StationsPage.qml"), {listType: Utils.Search}); }
 
 

translations/harbour-received-sv.ts

@@ -2,49 +2,52 @@
 <!DOCTYPE TS>
 <TS version="2.1">
 <context>
-    <name>Browse</name>
+    <name>BrowseByCategory</name>
     <message>
-        <source>Top 100</source>
-        <translation>Topp 100</translation>
+        <source>Browse by</source>
+        <translation>Bläddra efter</translation>
     </message>
+</context>
+<context>
+    <name>BrowsePage</name>
     <message>
-        <source>Browse</source>
-        <translation>Bläddra</translation>
+        <source>Local</source>
+        <translation type="unfinished">Lokalt</translation>
+    </message>
+    <message>
+        <source>Top 100</source>
+        <translation type="unfinished">Topp 100</translation>
     </message>
     <message>
         <source>Recommended</source>
-        <translation>Rekommenderade</translation>
+        <translation type="unfinished">Rekommenderade</translation>
     </message>
     <message>
         <source>Genre</source>
-        <translation>Genre</translation>
+        <translation type="unfinished">Genre</translation>
     </message>
     <message>
         <source>Topic</source>
-        <translation>Ämne</translation>
+        <translation type="unfinished">Ämne</translation>
     </message>
     <message>
         <source>Country</source>
-        <translation>Land</translation>
+        <translation type="unfinished">Land</translation>
     </message>
     <message>
         <source>City</source>
-        <translation>Stad</translation>
+        <translation type="unfinished">Stad</translation>
     </message>
     <message>
         <source>Language</source>
-        <translation>Språk</translation>
-    </message>
-    <message>
-        <source>Local</source>
-        <translation>Lokalt</translation>
+        <translation type="unfinished">Språk</translation>
     </message>
 </context>
 <context>
-    <name>BrowseByCategory</name>
+    <name>BrowsePageForm.ui</name>
     <message>
-        <source>Browse by</source>
-        <translation>Bläddra efter</translation>
+        <source>Browse</source>
+        <translation type="unfinished">Bläddra</translation>
     </message>
 </context>
 <context>

translations/harbour-received.ts

@@ -2,9 +2,16 @@
 <!DOCTYPE TS>
 <TS version="2.1">
 <context>
-    <name>Browse</name>
+    <name>BrowseByCategory</name>
     <message>
-        <source>Browse</source>
+        <source>Browse by</source>
+        <translation type="unfinished"></translation>
+    </message>
+</context>
+<context>
+    <name>BrowsePage</name>
+    <message>
+        <source>Local</source>
         <translation type="unfinished"></translation>
     </message>
     <message>
@@ -35,15 +42,11 @@
         <source>Language</source>
         <translation type="unfinished"></translation>
     </message>
-    <message>
-        <source>Local</source>
-        <translation type="unfinished"></translation>
-    </message>
 </context>
 <context>
-    <name>BrowseByCategory</name>
+    <name>BrowsePageForm.ui</name>
     <message>
-        <source>Browse by</source>
+        <source>Browse</source>
         <translation type="unfinished"></translation>
     </message>
 </context>