Merge lp:~ahayzen/music-app/refactor-pull-now-playing-sidebar into lp:music-app

[Andrew Hayzen]

* Make NowPlaying into a conditional sidebar

* Make NowPlaying into a conditional sidebar

Pull of lp:~music-app-dev/music-app/refactor-now-playing-as-sidebar into lp:music-app/refactor with conflicts resolved :)

[Andrew Hayzen (ahayzen)]

Note this pulls in lp:~ahayzen/music-app/async-loader-pages as well.

[lp:~ahayzen/music-app/refactor-pull-now-playing-sidebar]

848. By Andrew Hayzen on 2015-03-23

* Reverse cherry pick lp:~ahayzen/music-app/async-loader-pages out of this branch

[Andrew Hayzen (ahayzen)]

OK reverse cherry picked async-loader-pages out, but this [0] patch still remains not sure it is needed in this specific branch, but it does fix columnflow issues.

0 - http://bazaar.launchpad.net/~music-app-dev/music-app/refactor-now-playing-as-sidebar/revision/842

[lp:~ahayzen/music-app/refactor-pull-now-playing-sidebar]

849. By Andrew Hayzen on 2015-03-23

* Fix bad merge conflict

[Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot)]

PASSED: Continuous integration, rev:848
http://91.189.93.70:8080/job/music-app-refactor-ci/49/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/generic-mediumtests-utopic/2398
        deb: http://91.189.93.70:8080/job/generic-mediumtests-utopic/2398/artifact/work/output/*zip*/output.zip
    SUCCESS: http://91.189.93.70:8080/job/music-app-refactor-utopic-amd64-ci/7
    SUCCESS: http://91.189.93.70:8080/job/music-app-refactor-vivid-amd64-ci/49

Click here to trigger a rebuild:
http://91.189.93.70:8080/job/music-app-refactor-ci/49/rebuild

review: Approve (continuous-integration)

[Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot)]

PASSED: Continuous integration, rev:849
http://91.189.93.70:8080/job/music-app-refactor-ci/50/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/generic-mediumtests-utopic/2399
        deb: http://91.189.93.70:8080/job/generic-mediumtests-utopic/2399/artifact/work/output/*zip*/output.zip
    SUCCESS: http://91.189.93.70:8080/job/music-app-refactor-utopic-amd64-ci/8
    SUCCESS: http://91.189.93.70:8080/job/music-app-refactor-vivid-amd64-ci/50

Click here to trigger a rebuild:
http://91.189.93.70:8080/job/music-app-refactor-ci/50/rebuild

review: Approve (continuous-integration)

[Victor Thompson (vthompson)]

Currently there are issues with app rotation in vivid. These are fixed with the full implementation of shell rotation (which has not yet landed). This MP is more or less blocked from using autorotation until that lands in vivid and vivid becomes the stable channel.

[lp:~ahayzen/music-app/refactor-pull-now-playing-sidebar]

850. By Andrew Hayzen on 2015-03-30

* Merge of lp:music-app/refactor

851. By Andrew Hayzen on 2015-03-30

* Fix uses of header instead of blurredHeader

[Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot)]

PASSED: Continuous integration, rev:851
http://91.189.93.70:8080/job/music-app-refactor-ci/55/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/generic-mediumtests-utopic/2462
        deb: http://91.189.93.70:8080/job/generic-mediumtests-utopic/2462/artifact/work/output/*zip*/output.zip
    SUCCESS: http://91.189.93.70:8080/job/music-app-refactor-utopic-amd64-ci/13
    SUCCESS: http://91.189.93.70:8080/job/music-app-refactor-vivid-amd64-ci/55

Click here to trigger a rebuild:
http://91.189.93.70:8080/job/music-app-refactor-ci/55/rebuild

review: Approve (continuous-integration)

[Alan Pope 🍺🐧🐱 🦄 (popey)]

Is this still valid / wanted?

[Victor Thompson (vthompson)]

This pulls in the final portion of the code that was prototyped for the "converged" music app that was demoed at MWC. Currently it is blocked by the vivid rotation bug [1]. We discussed possibly disabling auto-rotation and landing this, but we assumed the auto-rotation bug would be fixed soon. If we want to have the "converged" app available, we can disable auto-rotation and land this.

1 - lp:1448017

[lp:~ahayzen/music-app/refactor-pull-now-playing-sidebar]

852. By Andrew Hayzen on 2015-06-28

* Merge of lp:music-app/refactor

[Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot)]

PASSED: Continuous integration, rev:852
http://91.189.93.70:8080/job/music-app-ci/1330/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/music-app-vivid-amd64-ci/182

Click here to trigger a rebuild:
http://91.189.93.70:8080/job/music-app-ci/1330/rebuild

review: Approve (continuous-integration)

[Andrew Hayzen (ahayzen)]

Inline note to self :-)

review: Needs Information

[lp:~ahayzen/music-app/refactor-pull-now-playing-sidebar]

853. By Andrew Hayzen on 2015-07-18

* Add changelog

[Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot)]

PASSED: Continuous integration, rev:853
http://91.189.93.70:8080/job/music-app-ci/1342/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/music-app-vivid-amd64-ci/194

Click here to trigger a rebuild:
http://91.189.93.70:8080/job/music-app-ci/1342/rebuild

review: Approve (continuous-integration)

[Victor Thompson (vthompson)]

I've been playing with this branch a bit on my desktop and a Nexus 7. One thing I think we should do is to optimize the side panel Now Playing page a bit more.

1. The text for the current song title should be smaller
2. The padding between components could be made a lot smaller
3. Maybe we put the progress current time and duration on the same Row as the ProgressBar?
4. Maybe the buttons could be a bit smaller?
5. Perhaps we can make the side panel smaller such that the blurred header is "square" and the cover art utilizes this space better

If we try to minimize items 2, 3, and 4 then perhaps the cover art could be made to fit the blurred header a bit more better, ie be square.

This doesn't need to be done under this MP, but I think it'd be great if this single switch to the converged view did so cleanly.

[Victor Thompson (vthompson)]

Or perhaps we could make the NowPlayingSidebar component 47 GU high [1]. The down side is that it's not as clear that the queue is under the Now Playing component. Maybe we need to reconsider having 2 headers? We should check with the SDK and see if that's the intended path.

1 - http://i.imgur.com/c3lFxpL.jpg

[Victor Thompson (vthompson)]

Thinking about it more, I think just making the NowPlayingSidebar 47 GU tall is the best course of action for now. If we want to optimize the spacing and whatnot later we can do so at that time. I don't think the view for the converged device will be as small as the Nexus 7.

[lp:~ahayzen/music-app/refactor-pull-now-playing-sidebar]

854. By Andrew Hayzen on 2015-08-25

Merge of lp:~vthompson/music-app/fix-orientation

855. By Andrew Hayzen on 2015-08-25

* Merge of trunk

856. By Andrew Hayzen on 2015-08-25

* Remove unused orientation sensor

[Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot)]

PASSED: Continuous integration, rev:856
http://91.189.93.70:8080/job/music-app-ci/1364/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/music-app-vivid-amd64-ci/216

Click here to trigger a rebuild:
http://91.189.93.70:8080/job/music-app-ci/1364/rebuild

review: Approve (continuous-integration)

Unmerged revisions

856. By Andrew Hayzen on 2015-08-25

* Remove unused orientation sensor

855. By Andrew Hayzen on 2015-08-25

* Merge of trunk

854. By Andrew Hayzen on 2015-08-25

Merge of lp:~vthompson/music-app/fix-orientation

853. By Andrew Hayzen on 2015-07-18

* Add changelog

852. By Andrew Hayzen on 2015-06-28

* Merge of lp:music-app/refactor

851. By Andrew Hayzen on 2015-03-30

* Fix uses of header instead of blurredHeader

850. By Andrew Hayzen on 2015-03-30

* Merge of lp:music-app/refactor

849. By Andrew Hayzen on 2015-03-23

* Fix bad merge conflict

848. By Andrew Hayzen on 2015-03-23

* Reverse cherry pick lp:~ahayzen/music-app/async-loader-pages out of this branch

847. By Andrew Hayzen on 2015-03-23

* Make NowPlaying into a conditional sidebar

=== modified file 'app/components/MusicPage.qml'
--- app/components/MusicPage.qml	2015-08-19 14:03:16 +0000
+++ app/components/MusicPage.qml	2015-08-25 20:05:00 +0000
@@ -29,15 +29,36 @@
         bottomMargin: musicToolbar.visible ? musicToolbar.height : 0
         fill: parent
     }
+    flickable: pageFlickable
 
+    default property alias content: pageChildrenContainer.data
     property Dialog currentDialog
+    property Flickable pageFlickable
     property bool searchable: false
     property int searchResultsCount
     property bool showToolbar: true
 
+    onVisibleChanged: {
+        if (visible) {
+            onPageVisible()
+        }
+    }
+
+    function onPageVisible() {
+        mainPageStack.setPage(thisPage);
+
+        // Rebind sidebar so that it is visible on this page
+        nowPlayingSidebarLoader.parent = parent
+        nowPlayingSidebarLoader.anchors.bottom = parent.bottom
+        nowPlayingSidebarLoader.anchors.right = parent.right
+        nowPlayingSidebarLoader.anchors.top = parent.top
+        // doesn't need to be bound due to us forcing the header to be shown in wideAspect mode
+        nowPlayingSidebarLoader.anchors.topMargin = thisPage.header.height
+    }
+
     Label {
         anchors {
-            centerIn: parent
+            centerIn: pageChildrenContainer
         }
         text: i18n.tr("No items found")
         visible: parent.state === "search" && searchResultsCount === 0
@@ -57,9 +78,29 @@
         }
     }
 
-    onVisibleChanged: {
-        if (visible) {
-            mainPageStack.setPage(thisPage);
+    Item {
+        id: pageChildrenContainer
+        anchors {
+            bottom: parent.bottom
+            left: parent.left
+            top: parent.top
+        }
+        width: parent.width - (wideAspect ? nowPlayingSidebarLoader.width : 0)
+    }
+
+    // Hack to keep the header visible as we cannot use flickable: null due to issues with the topMargin
+    Connections {
+        target: thisPage.header
+        onYChanged: {
+            if (wideAspect) {
+                thisPage.header.y = 0
+            }
+        }
+    }
+
+    Component.onCompleted: {
+        if (visible) {  // onVisible is not sometimes called so use onComplete as well
+            onPageVisible()
         }
     }
 }

=== added file 'app/components/NowPlayingSidebar.qml'
--- app/components/NowPlayingSidebar.qml	1970-01-01 00:00:00 +0000
+++ app/components/NowPlayingSidebar.qml	2015-08-25 20:05:00 +0000
@@ -0,0 +1,60 @@
+/*
+ * Copyright (C) 2013, 2014, 2015
+ *      Andrew Hayzen <[e-mail]>
+ *      Daniel Holm <[e-mail]>
+ *      Victor Thompson <[e-mail]>
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; version 3.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.3
+import Ubuntu.Components 1.1
+
+
+Queue {
+    clip: true
+    isSidebar: true
+    header: Column {
+        id: sidebarColumn
+        anchors {
+            left: parent.left
+            right: parent.right
+        }
+
+        NowPlayingFullView {
+            anchors {
+                fill: undefined
+            }
+            clip: true
+            height: units.gu(30)
+            width: parent.width
+        }
+
+        NowPlayingToolbar {
+            anchors {
+                fill: undefined
+            }
+            bottomProgressHint: false
+            height: units.gu(10)
+            width: parent.width
+        }
+    }
+
+    // TODO: Currently the Queue's header is shown when the user
+    //       pulls down on the ListView, this covers it up.
+    Rectangle {
+        anchors.fill: parent
+        color: "#2c2c34"
+        z: -1
+    }
+}

=== modified file 'app/components/NowPlayingToolbar.qml'
--- app/components/NowPlayingToolbar.qml	2015-07-29 01:23:11 +0000
+++ app/components/NowPlayingToolbar.qml	2015-08-25 20:05:00 +0000
@@ -30,6 +30,8 @@
     }
     color: styleMusic.common.black
 
+    property alias bottomProgressHint: playerControlsProgressBar.visible
+
     /* Repeat button */
     MouseArea {
         id: nowPlayingRepeatButton

=== modified file 'app/components/Queue.qml'
--- app/components/Queue.qml	2015-06-27 21:06:26 +0000
+++ app/components/Queue.qml	2015-08-25 20:05:00 +0000
@@ -37,6 +37,7 @@
     model: trackQueue.model
     objectName: "nowPlayingqueueList"
 
+    property bool isSidebar: false
     property int normalHeight: units.gu(6)
     property int transitionDuration: 250  // transition length of animations
 
@@ -44,7 +45,8 @@
 
     delegate: MusicListItem {
         id: queueListItem
-        color: player.currentIndex === index ? "#2c2c34" : styleMusic.mainView.backgroundColor
+        color: isSidebar ? (player.currentIndex === index ? "#3d3d45" : "#2c2c34")
+                         : (player.currentIndex === index ? "#2c2c34" : styleMusic.mainView.backgroundColor)
         column: Column {
             Label {
                 id: trackTitle
@@ -68,7 +70,7 @@
         leftSideAction: Remove {
             onTriggered: trackQueue.removeQueueList([index])
         }
-        multiselectable: true
+        multiselectable: !isSidebar
         reorderable: true
         rightSideActions: [
             AddToPlaylist{

=== modified file 'app/music-app.qml'
--- app/music-app.qml	2015-08-19 14:03:16 +0000
+++ app/music-app.qml	2015-08-25 20:05:00 +0000
@@ -36,7 +36,7 @@
     objectName: "musicMainView"
     applicationName: "com.ubuntu.music"
     id: mainView
-
+    automaticOrientation: true
     backgroundColor: styleMusic.mainView.backgroundColor
     headerColor: styleMusic.mainView.headerColor
 
@@ -285,9 +285,18 @@
 
     signal listItemSwiping(int i)
 
-    property bool wideAspect: width >= units.gu(70) && loadedUI
+    property bool landscape: width > height
+    property bool wideAspect: loadedUI && landscape && width >= units.gu(70)
     property bool loadedUI: false  // property to detect if the UI has finished
 
+    onWideAspectChanged: {
+        // FIXME: if user has gone nowPlaying->Add to playlist nowPlaying won't be popped
+        if (wideAspect && mainPageStack.currentMusicPage !== null &&
+                mainPageStack.currentMusicPage.objectName === "nowPlayingPage") {
+            mainPageStack.pop()
+        }
+    }
+
     // FUNCTIONS
 
     onEmptyStateChanged: {
@@ -716,10 +725,23 @@
         source: "components/MusicToolbar.qml"
         visible: (mainPageStack.currentPage.showToolbar || mainPageStack.currentPage.showToolbar === undefined) &&
                  !firstRun &&
-                 !noMusic
+                 !noMusic &&
+                 !wideAspect
         z: 200  // put on top of everything else
     }
 
+    Loader {
+        id: nowPlayingSidebarLoader
+        active: wideAspect
+        anchors {  // start offscreen
+            right: parent.right
+        }
+        asynchronous: true
+        source: "components/NowPlayingSidebar.qml"
+        visible: active
+        width: units.gu(40)
+    }
+
     PageStack {
         id: mainPageStack
 
@@ -982,6 +1004,10 @@
 
             function pushNowPlaying()
             {
+                if (wideAspect) {  // no now playing page in wideAspect mode
+                    return;
+                }
+
                 // only push if on a different page
                 if (mainPageStack.currentPage.title !== i18n.tr("Now playing")
                         && mainPageStack.currentPage.title !== i18n.tr("Queue")) {

=== modified file 'app/ui/AddToPlaylist.qml'
--- app/ui/AddToPlaylist.qml	2015-08-19 14:03:16 +0000
+++ app/ui/AddToPlaylist.qml	2015-08-25 20:05:00 +0000
@@ -41,6 +41,7 @@
 // Page that will be used when adding tracks to playlists
 MusicPage {
     id: addToPlaylistPage
+    pageFlickable: addtoPlaylistView
     objectName: "addToPlaylistPage"
     // TRANSLATORS: this appears in the header with limited space (around 20 characters)
     title: i18n.tr("Select playlist")

=== modified file 'app/ui/Albums.qml'
--- app/ui/Albums.qml	2015-05-03 16:22:31 +0000
+++ app/ui/Albums.qml	2015-08-25 20:05:00 +0000
@@ -29,6 +29,7 @@
 MusicPage {
     id: albumsPage
     objectName: "albumsPage"
+    pageFlickable: albumCardView
     title: i18n.tr("Albums")
     searchable: true
     searchResultsCount: albumsModelFilter.count

=== modified file 'app/ui/ArtistView.qml'
--- app/ui/ArtistView.qml	2015-05-03 16:22:31 +0000
+++ app/ui/ArtistView.qml	2015-08-25 20:05:00 +0000
@@ -33,6 +33,7 @@
 MusicPage {
     id: artistViewPage
     objectName: "artistViewPage"
+    pageFlickable: artistAlbumView
     visible: false
 
     property string artist: ""

=== modified file 'app/ui/Artists.qml'
--- app/ui/Artists.qml	2015-05-03 16:22:31 +0000
+++ app/ui/Artists.qml	2015-08-25 20:05:00 +0000
@@ -35,6 +35,7 @@
 MusicPage {
     id: artistsPage
     objectName: "artistsPage"
+    pageFlickable: artistCardView
     title: i18n.tr("Artists")
     searchable: true
     searchResultsCount: artistsModelFilter.count

=== modified file 'app/ui/Genres.qml'
--- app/ui/Genres.qml	2015-05-03 16:22:31 +0000
+++ app/ui/Genres.qml	2015-08-25 20:05:00 +0000
@@ -29,6 +29,7 @@
 MusicPage {
     id: genresPage
     objectName: "genresPage"
+    pageFlickable: genreCardView
     title: i18n.tr("Genres")
     searchable: true
     searchResultsCount: genresModelFilter.count

=== modified file 'app/ui/Playlists.qml'
--- app/ui/Playlists.qml	2015-06-27 21:06:26 +0000
+++ app/ui/Playlists.qml	2015-08-25 20:05:00 +0000
@@ -33,6 +33,7 @@
 MusicPage {
     id: playlistsPage
     objectName: "playlistsPage"
+    pageFlickable: playlistslist
     // TRANSLATORS: this is the name of the playlists page shown in the tab header.
     // Remember to keep the translation short to fit the screen width
     title: i18n.tr("Playlists")

=== modified file 'app/ui/Recent.qml'
--- app/ui/Recent.qml	2015-06-27 21:06:26 +0000
+++ app/ui/Recent.qml	2015-08-25 20:05:00 +0000
@@ -34,6 +34,7 @@
 MusicPage {
     id: recentPage
     objectName: "recentPage"
+    pageFlickable: recentCardView
     title: i18n.tr("Recent")
 
     property bool changed: false

=== modified file 'app/ui/Songs.qml'
--- app/ui/Songs.qml	2015-06-27 21:06:26 +0000
+++ app/ui/Songs.qml	2015-08-25 20:05:00 +0000
@@ -34,6 +34,7 @@
 MusicPage {
     id: songsPage
     objectName: "songsPage"
+    pageFlickable: tracklist
     title: i18n.tr("Songs")
     searchable: true
     searchResultsCount: songsModelFilter.count

=== modified file 'app/ui/SongsView.qml'
--- app/ui/SongsView.qml	2015-07-26 22:43:31 +0000
+++ app/ui/SongsView.qml	2015-08-25 20:05:00 +0000
@@ -36,6 +36,7 @@
 MusicPage {
     id: songStackPage
     objectName: "songsPage"
+    pageFlickable: albumtrackslist
     visible: false
 
     property string line1: ""
@@ -229,11 +230,11 @@
                     }
                 }
             }
-            property int baseHeight: header.width > units.gu(60) ? units.gu(33.5) : ((header.width - units.gu(5)) / 2) + units.gu(12)
+            property int baseHeight: blurredHeader.width > units.gu(60) ? units.gu(33.5) : ((blurredHeader.width - units.gu(5)) / 2) + units.gu(12)
             coverSources: songStackPage.covers
             height: songStackPage.line1 !== i18n.tr("Playlist") &&
                     songStackPage.line1 !== i18n.tr("Genre") &&
-                    header.width <= units.gu(60) ?
+                    blurredHeader.width <= units.gu(60) ?
                         baseHeight + units.gu(3) : baseHeight
             bottomColumn: Column {
                 Label {

=== modified file 'debian/changelog'
--- debian/changelog	2015-08-18 21:08:05 +0000
+++ debian/changelog	2015-08-25 20:05:00 +0000
@@ -9,6 +9,7 @@
   [ Andrew Hayzen ]
   * Fix for console errors when using the parent changed helpers
   * Add support for a content-hub source in both single and multiple selection modes (LP: #1357324)
+  * Make NowPlaying into a conditional sidebar
 
  -- Victor Thompson <[e-mail]>  Thu, 23 Jul 2015 21:08:38 -0500