Minor UI cleanup

sailfish/qml/components/PlaybackBar.qml

@@ -39,7 +39,7 @@ PanelBackground {
     id: playbackBar
     height: Theme.itemSizeLarge
     width: parent.width
-    y: parent.height
+    y: parent.height - height
     property PlaybackManager manager
     property bool open
     property real visibleSize: height
@@ -55,6 +55,7 @@ PanelBackground {
         height: parent.height
         onClicked: playbackBar.state = (playbackBar.state == "large" ? "open" : "large")
 
+
         RemoteImage {
             id: albumArt
             anchors {
@@ -217,7 +218,7 @@ PanelBackground {
            name: "large"
             PropertyChanges {
                 target: playbackBar
-                height: Screen.height
+                height: pageStack.currentOrientation & Orientation.LandscapeMask ? Screen.width : Screen.height
             }
             PropertyChanges {
                 target: albumArt
@@ -332,7 +333,8 @@ PanelBackground {
            when: (appWindow.mediaPlayer.playbackState === MediaPlayer.StoppedState || "__hidePlaybackBar" in pageStack.currentPage) && state != "page"
            PropertyChanges {
                target: playbackBarTranslate
-               y: playbackBar.height
+               // + small padding since the ProgressBar otherwise would stick out
+               y: playbackBar.height + Theme.paddingSmall
            }
            PropertyChanges {
                target: playbackBar
@@ -354,6 +356,19 @@ PanelBackground {
         Page {
             property bool __hidePlaybackBar: true
             showNavigationIndicator: true
+            allowedOrientations: appWindow.allowedOrientations
+            SilicaFlickable {
+                anchors.fill: parent
+                PullDownMenu {
+                    MenuItem {
+                        //: Pulley menu item to view detailed media information of a song
+                        text: qsTr("Info")
+                    }
+                    MenuItem {
+                        //: Pulley menu item: add music to a playlist
+                        text: qsTr("Add to playlist")
+                    }
+                }
                 Loader {
                     Component.onCompleted: setSource(Qt.resolvedUrl("PlaybackBar.qml"),
                                                      {"state": "page", "manager": manager, "y": 0})
@@ -361,6 +376,7 @@ PanelBackground {
                 }
             }
         }
+    }
 
     transitions: [
         Transition {

sailfish/qml/harbour-sailfin.qml

@@ -45,36 +45,9 @@ ApplicationWindow {
 
     property bool _hidePlaybackBar: false
 
-    Connections {
-        target: pageStack
-        onCurrentPageChanged: {
-            /*_hidePlaybackBar = "__hidePlaybackBar" in pageStack.currentPage
-            if (_hidePlaybackBar) {
-                playbackBar.state = "hidden"
-            } else {
-                //playbackBar.state = ""
-                //appWindow.bottomMargin = playbackBar.height
-            }*/
-            console.log("Current page changed: " + _hidePlaybackBar)
-        }
-    }
-
     bottomMargin: playbackBar.visibleSize
 
-    //FIXME: proper error handling
+
-    Connections {
-        target: ApiClient
-        onNetworkError: errorNotification.show("Network error: " + error)
-        onConnectionFailed: errorNotification.show("Connect error: " + error)
-        //onConnectionSuccess: errorNotification.show("Success: " + loginMessage)
-        onSetupRequired: {
-            var isInSetup = pageStack.find(function (page) { return typeof page._isSetupPage !== "undefined" }) !== null
-            console.log("Is in setup: " + isInSetup)
-            if (!isInSetup) {
-                pageStack.replace(Qt.resolvedUrl("pages/setup/AddServerPage.qml"), {"backNavigation": false});
-            }
-        }
-    }
 
     initialPage: Component {
         MainPage {
@@ -102,7 +75,6 @@ ApplicationWindow {
             return Qt.resolvedUrl("cover/VideoCover.qml")
         }
     }
-    allowedOrientations: Orientation.All
 
     Notification {
         id: errorNotification
@@ -139,8 +111,24 @@ ApplicationWindow {
     
     PlaybackBar {
         id: playbackBar
-        //open: !_hidePlaybackBar//_mediaPlayer.playbackState != MediaPlayer.StoppedState
         manager: _playbackManager
-        //state: "hidden"
+        state: "hidden"
+        // CTMBWSIU: Code That Might Break When Silica Is Updated
+        Component.onCompleted: playbackBar.parent = __silica_applicationwindow_instance._rotatingItem
+    }
+
+    //FIXME: proper error handling
+    Connections {
+        target: ApiClient
+        onNetworkError: errorNotification.show("Network error: " + error)
+        onConnectionFailed: errorNotification.show("Connect error: " + error)
+        //onConnectionSuccess: errorNotification.show("Success: " + loginMessage)
+        onSetupRequired: {
+            var isInSetup = pageStack.find(function (page) { return typeof page._isSetupPage !== "undefined" }) !== null
+            console.log("Is in setup: " + isInSetup)
+            if (!isInSetup) {
+                pageStack.replace(Qt.resolvedUrl("pages/setup/AddServerPage.qml"), {"backNavigation": false});
+            }
+        }
     }
 }

sailfish/qml/pages/AboutPage.qml

@@ -25,8 +25,6 @@ import "../components"
 
 Page {
     id: page
-
-    // The effective value will be restricted by ApplicationWindow.allowedOrientations
     allowedOrientations: Orientation.All
 
     SilicaFlickable {

sailfish/qml/pages/MainPage.qml

@@ -35,39 +35,47 @@ Page {
     id: page
     allowedOrientations: Orientation.All
 
-    SilicaFlickable {
+    // This component is reused both in the normal state and error state
-        anchors.fill: parent
+    Component {
-
+        id: commonPullDownMenu
-        // PullDownMenu and PushUpMenu must be declared in SilicaFlickable, SilicaListView or SilicaGridView
         PullDownMenu {
             MenuItem {
+                //: Pulley menu item: navigate to application settings page
                 text: qsTr("Settings")
                 onClicked: pageStack.push(Qt.resolvedUrl("SettingsPage.qml"))
             }
             MenuItem {
-                text: qsTr("Refresh")
+                //: Pulley menu item: reload items on page
+                text: qsTr("Reload")
                 onClicked: loadModels(true)
             }
             busy: mediaLibraryModel.status == ApiModel.Loading
         }
+    }
+
+    SilicaFlickable {
+        id: flickable
+        anchors.fill: parent
+
+        // PullDownMenu and PushUpMenu must be declared in SilicaFlickable, SilicaListView or SilicaGridView
+        Loader { sourceComponent: commonPullDownMenu; }
 
         // Tell SilicaFlickable the height of its content.
-        contentHeight: column.visible ? column.height : errorColumn.height
+        contentHeight: column.height + Theme.paddingMedium
 
         // Place our content in a Column.  The PageHeader is always placed at the top
         // of the page, followed by our content.
         Column {
             id: column
-            visible: mediaLibraryModel.status != ApiModel.Error
-
             width: page.width
-            //spacing: Theme.paddingLarge
+
             UserViewModel {
                 id: mediaLibraryModel2
                 apiClient: ApiClient
             }
 
             MoreSection {
+                //- Section header for films and TV shows that an user hasn't completed yet.
                 text: qsTr("Resume watching")
                 clickable: false
                 busy: userResumeModel.status == ApiModel.Loading
@@ -86,6 +94,7 @@ Page {
                 }
             }
             MoreSection {
+                //- Section header for next episodes in a TV show that an user was watching.
                 text: qsTr("Next up")
                 clickable: false
                 busy: showNextUpModel.status == ApiModel.Loading
@@ -139,30 +148,23 @@ Page {
                 }
             }
         }
+    }
+    SilicaFlickable {
+        id: errorFlickable
+        anchors.fill: parent
+        visible: false
+        opacity: 0
+        contentHeight: errorColumn.height
 
-        Column {
+        Loader { sourceComponent: commonPullDownMenu; }
-            id: errorColumn
-            width: parent.width
-            visible: mediaLibraryModel.status == ApiModel.Error
-            PageHeader {
-                title: qsTr("Network error")
-            }
 
-            Item {
+        ViewPlaceholder {
-                width: 1
+            enabled: true
-                height: page.height / 3
+            //- ViewPlaceholder text for when a network error has occurred and no contents could be loaded
-            }
+            text: qsTr("Network error")
-
+            //- ViewPlaceholder hint text for when a network error has occurred and no contents could be loaded.
-            PlainLabel {
+            //- The user can reload the page by using the pulley, which this text should hint at.
-                text: qsTr("An error has occurred. Please try again.")
+            hintText: qsTr("Pull down to retry again")
-            }
-            Item { width: 1; height: Theme.paddingLarge }
-            Button {
-                text: qsTr("Retry")
-                anchors.horizontalCenter: parent.horizontalCenter
-                onClicked: loadModels(true)
-            }
-            Item { width: 1; height: Theme.paddingLarge }
         }
     }
 
@@ -209,7 +211,7 @@ Page {
                 }
             }
             Behavior on height {
-                NumberAnimation { duration: 300 }
+                NumberAnimation { easing.type: Easing.OutQuad; duration: 300 }
             }
             model: itemModel
             width: parent.width
@@ -231,4 +233,49 @@ Page {
             }
         }
     }
+
+    state: "default"
+    states: [
+        State {
+            name: "default"
+            when: mediaLibraryModel2.status !== ApiModel.Error
+        },
+        State {
+            name: "error"
+            when: mediaLibraryModel2.status === ApiModel.Error
+
+            PropertyChanges {
+                target: errorFlickable
+                visible: true
+                opacity: 1
+            }
+
+            PropertyChanges {
+                target: flickable
+                opacity: 0
+                visible: false
+            }
+        }
+    ]
+
+    transitions: [
+        Transition {
+            from: "default"
+            to: "error"
+            SequentialAnimation {
+                PropertyAction { target: errorFlickable; property: "visible"; value: true }
+                FadeAnimation {}
+                PropertyAction { target: flickable; property: "visible"; value: false }
+            }
+        },
+        Transition {
+            from: "error"
+            to: "default"
+            SequentialAnimation {
+                PropertyAction { target: flickable; property: "visible"; value: true }
+                FadeAnimation {}
+                PropertyAction { target: errorFlickable; property: "visible"; value: false }
+            }
+        }
+    ]
 }

sailfish/qml/pages/SettingsPage.qml

@@ -25,6 +25,7 @@ import "../components"
 
 Page {
     id: settingsPage
+    allowedOrientations: Orientation.All
 
     SilicaFlickable {
         anchors.fill: parent