Ubuntu Music App

Merge lp:~ahayzen/music-app/remix-small-toolbar-always-show into lp:music-app/remix

  1. remix-small-toolbar-always-show
  2. Merge into remix
Proposed by Andrew Hayzen
Status: Merged
Approved by: Victor Thompson
Approved revision: 644
Merged at revision: 646
Proposed branch: lp:~ahayzen/music-app/remix-small-toolbar-always-show
Merge into: lp:music-app/remix
Prerequisite: lp:~ahayzen/music-app/remix-small-toolbar-design
Diff against target: 485 lines (+60/-164)
11 files modified
MusicArtists.qml (+3/-2)
MusicNowPlaying.qml (+3/-10)
MusicPlaylists.qml (+3/-2)
MusicSettings.qml (+0/-11)
MusicToolbar.qml (+43/-114)
MusicTracks.qml (+3/-2)
MusicaddtoPlaylist.qml (+0/-1)
common/AlbumsPage.qml (+0/-2)
common/MusicPage.qml (+4/-0)
common/SongsPage.qml (+0/-2)
music-app.qml (+1/-18)
To merge this branch: bzr merge lp:~ahayzen/music-app/remix-small-toolbar-always-show
Reviewer Review Type Date Requested Status
Victor Thompson Approve
Ubuntu Phone Apps Jenkins Bot continuous-integration Approve
Review via email: mp+236544@code.launchpad.net

Commit message

* Fix the toolbar so it is always shown
* Move progress bar to the bottom of the toolbar

Description of the change

* Fix the toolbar so it is always shown
* Move progress bar to the bottom of the toolbar

This fixes the toolbar so that it is always shown and sets the bottom margin of MusicPage to the height of the toolbar (so you can scroll to the bottom).

Note that this makes the "larger" toolbar always visible in the now playing page and this will be changed when we start work on the new now playing design.

To post a comment you must log in.
Revision history for this message
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote :

FAILED: Continuous integration, rev:642
No commit message was specified in the merge proposal. Click on the following link and set the commit message (if you want a jenkins rebuild you need to trigger it yourself):
https://code.launchpad.net/~andrew-hayzen/music-app/remix-small-toolbar-always-show/+merge/236544/+edit-commit-message

http://91.189.93.70:8080/job/music-app-remix-ci/2/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/generic-mediumtests-utopic-python3/614
        deb: http://91.189.93.70:8080/job/generic-mediumtests-utopic-python3/614/artifact/work/output/*zip*/output.zip
    SUCCESS: http://91.189.93.70:8080/job/music-app-remix-utopic-amd64-ci/2

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

review: Needs Fixing (continuous-integration)
lp:~ahayzen/music-app/remix-small-toolbar-always-show updated
643. By Andrew Hayzen

* Merge from lp:~andrew-hayzen/music-app/remix-small-toolbar-design

644. By Andrew Hayzen

* Switch progress bar position

Revision history for this message
Ubuntu Phone Apps Jenkins Bot (ubuntu-phone-apps-jenkins-bot) wrote :

PASSED: Continuous integration, rev:644
http://91.189.93.70:8080/job/music-app-remix-ci/7/
Executed test runs:
    SUCCESS: http://91.189.93.70:8080/job/generic-mediumtests-utopic-python3/646
        deb: http://91.189.93.70:8080/job/generic-mediumtests-utopic-python3/646/artifact/work/output/*zip*/output.zip
    SUCCESS: http://91.189.93.70:8080/job/music-app-remix-utopic-amd64-ci/7

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

review: Approve (continuous-integration)
Revision history for this message
Victor Thompson (vthompson) wrote :

1) It seems like attempting to swipe or drag the toolbar causes it to think it was clicked or tapped. Could we make it ignore drags/swipes?
2. I think the progress bar would look nicer if it started at the right of the image and was maybe 2 or 2.5 times as thick. Need to check with design.

Otherwise this looks great!

review: Needs Fixing
Revision history for this message
Victor Thompson (vthompson) wrote :

In lieu of not having design feedback yet on the changes I've proposed, I'm apt to approve this so that we can get it into the app.

There are so obvious testing clean up for showing the toolbar that should be done, but we can make sure we audit that at a later time.

review: Approve

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1=== modified file 'MusicArtists.qml'
2--- MusicArtists.qml 2014-09-20 15:41:33 +0000
3+++ MusicArtists.qml 2014-10-01 21:09:08 +0000
4@@ -38,8 +38,9 @@
5
6 ListView {
7 id: artistlist
8- anchors.fill: parent
9- anchors.bottomMargin: musicToolbar.mouseAreaOffset + musicToolbar.minimizedHeight
10+ anchors {
11+ fill: parent
12+ }
13 model: ArtistsModel {
14 id: artistsModel
15 albumArtists: true
16
17=== modified file 'MusicNowPlaying.qml'
18--- MusicNowPlaying.qml 2014-10-01 21:09:08 +0000
19+++ MusicNowPlaying.qml 2014-10-01 21:09:08 +0000
20@@ -44,10 +44,6 @@
21 }
22 }
23
24- Component.onCompleted: {
25- onToolbarShownChanged.connect(jumpToCurrent)
26- }
27-
28 Connections {
29 target: player
30 onCurrentIndexChanged: {
31@@ -83,8 +79,9 @@
32 ListView {
33 id: queuelist
34 objectName: "nowPlayingQueueList"
35- anchors.fill: parent
36- anchors.bottomMargin: musicToolbar.mouseAreaOffset + musicToolbar.minimizedHeight
37+ anchors {
38+ fill: parent
39+ }
40 delegate: queueDelegate
41 model: trackQueue.model
42 highlightFollowsCurrentItem: false
43@@ -117,10 +114,6 @@
44 customdebug("Queue: Now has: " + queuelist.count + " tracks")
45 }
46
47- onMovementStarted: {
48- musicToolbar.hideToolbar();
49- }
50-
51 Component {
52 id: queueDelegate
53 ListItemWithActions {
54
55=== modified file 'MusicPlaylists.qml'
56--- MusicPlaylists.qml 2014-09-20 10:50:45 +0000
57+++ MusicPlaylists.qml 2014-10-01 21:09:08 +0000
58@@ -116,8 +116,9 @@
59 ListView {
60 id: playlistslist
61 objectName: "playlistsListView"
62- anchors.fill: parent
63- anchors.bottomMargin: musicToolbar.mouseAreaOffset + musicToolbar.minimizedHeight
64+ anchors {
65+ fill: parent
66+ }
67 model: playlistModel.model
68 delegate: playlistDelegate
69 onCountChanged: {
70
71=== modified file 'MusicSettings.qml'
72--- MusicSettings.qml 2014-09-20 10:50:45 +0000
73+++ MusicSettings.qml 2014-10-01 21:09:08 +0000
74@@ -30,17 +30,6 @@
75 title: i18n.tr("Settings")
76 contentsHeight: parent.height;
77
78- onVisibleChanged: {
79- if (visible === true)
80- {
81- musicToolbar.disableToolbar()
82- }
83- else
84- {
85- musicToolbar.enableToolbar()
86- }
87- }
88-
89 onCancelClicked: PopupUtils.close(musicSettings)
90 onConfirmClicked: {
91 PopupUtils.close(musicSettings)
92
93=== modified file 'MusicToolbar.qml'
94--- MusicToolbar.qml 2014-10-01 21:09:08 +0000
95+++ MusicToolbar.qml 2014-10-01 21:09:08 +0000
96@@ -43,7 +43,6 @@
97 property int transitionDuration: 100
98
99 property alias currentHeight: musicToolbarPanel.height
100- property alias minimizedHeight: musicToolbarPanel.minimizedHeight
101 property alias expandedHeight: musicToolbarPanel.expandedHeight
102 property alias fullHeight: musicToolbarPanel.fullHeight
103 property alias mouseAreaOffset: musicToolbarPanel.hintSize
104@@ -72,22 +71,6 @@
105
106 /* Helper functions */
107
108- // Disable the toolbar for this page/view (eg a dialog)
109- function disableToolbar()
110- {
111- cachedStates.push(state);
112- musicToolbarPanel.state = "hidden";
113- }
114-
115- // Enable the toolbar (run when closing a page that disabled it)
116- function enableToolbar()
117- {
118- if (cachedStates.length > 0)
119- {
120- musicToolbarPanel.state = cachedStates.pop();
121- }
122- }
123-
124 // Back button has been pressed, jump up pageStack or back to parent page
125 function goBack()
126 {
127@@ -98,18 +81,6 @@
128 else if (mainPageStack !== null && mainPageStack.depth > 1) {
129 mainPageStack.pop(currentPage)
130 }
131-
132- startAutohideTimer()
133- }
134-
135- // Hide the toolbar
136- function hideToolbar()
137- {
138- if (!wideAspect) {
139- musicToolbarPanel.close();
140- }
141-
142- toolbarAutoHideTimer.stop(); // cancel any autohide
143 }
144
145 // Remove sheet as it has been closed
146@@ -135,32 +106,6 @@
147 currentSheet.push(sheet)
148 }
149
150- // Show the toolbar
151- function showToolbar()
152- {
153- startAutohideTimer(); // always attempt to autohide toolbar
154-
155- if (!musicToolbarPanel.opened) {
156- musicToolbarPanel.open();
157- }
158- }
159-
160- // Start the autohidetimer
161- function startAutohideTimer()
162- {
163- toolbarAutoHideTimer.restart();
164- }
165-
166- Connections {
167- target: mainView
168- onWideAspectChanged: {
169- // Force toolbar to show if in wideAspect
170- if (wideAspect && !opened) {
171- showToolbar();
172- }
173- }
174- }
175-
176 Panel {
177 id: musicToolbarPanel
178 anchors {
179@@ -169,31 +114,21 @@
180 bottom: parent.bottom
181 }
182 height: currentMode === "full" ? fullHeight : expandedHeight
183- locked: wideAspect
184-
185- __closeOnContentsClicks: false // TODO: fix bug 1295720
186+ locked: true
187+ opened: true
188
189 // The current mode of the controls
190 property string currentMode: wideAspect || (currentPage === nowPlaying)
191 ? "full" : "expanded"
192
193 // Properties for the different heights
194- property int minimizedHeight: units.gu(0.25)
195- property int expandedHeight: units.gu(7)
196+ property int expandedHeight: units.gu(7.25)
197 property int fullHeight: units.gu(11)
198
199 onCurrentModeChanged: {
200 musicToolbarFullProgressMouseArea.enabled = currentMode === "full"
201 }
202
203- onOpenedChanged: {
204- onToolbarShownChanged(opened, currentPage, currentTab);
205-
206- if (opened) {
207- startAutohideTimer();
208- }
209- }
210-
211 /* Full toolbar */
212 Rectangle {
213 id: musicToolbarFullContainer
214@@ -747,10 +682,14 @@
215 }
216 ]
217
218+ /* Disabled (empty state) controls */
219 Rectangle {
220 id: disabledPlayerControlsGroup
221 anchors {
222- fill: parent
223+ bottom: playerControlsProgressBar.top
224+ left: parent.left
225+ right: parent.right
226+ top: parent.top
227 }
228 color: "transparent"
229
230@@ -806,10 +745,14 @@
231 }
232 }
233
234+ /* Enabled (queue > 0) controls */
235 Rectangle {
236 id: enabledPlayerControlsGroup
237 anchors {
238- fill: parent
239+ bottom: playerControlsProgressBar.top
240+ left: parent.left
241+ right: parent.right
242+ top: parent.top
243 }
244 color: "transparent"
245
246@@ -931,38 +874,37 @@
247 }
248 }
249 }
250- }
251- }
252-
253- /* Object which provides the progress bar when toolbar is minimized */
254- Rectangle {
255- id: musicToolbarSmallProgressBackground
256- anchors {
257- bottom: parent.top
258- left: parent.left
259- right: parent.right
260- }
261- color: styleMusic.common.black
262- height: musicToolbarPanel.minimizedHeight
263- visible: (!musicToolbarPanel.animating &&
264- !musicToolbarPanel.opened)
265- || musicToolbarPanel.currentMode == "expanded"
266-
267- Rectangle {
268- id: musicToolbarSmallProgressHint
269- anchors.left: parent.left
270- anchors.top: parent.top
271- color: UbuntuColors.blue
272- height: parent.height
273- width: 0
274-
275- Connections {
276- target: player
277- onPositionChanged: {
278- musicToolbarSmallProgressHint.width = (player.position / player.duration) * musicToolbarSmallProgressBackground.width
279+
280+ /* Object which provides the progress bar when toolbar is minimized */
281+ Rectangle {
282+ id: playerControlsProgressBar
283+ anchors {
284+ bottom: parent.bottom
285+ left: parent.left
286+ right: parent.right
287 }
288- onStopped: {
289- musicToolbarSmallProgressHint.width = 0;
290+ color: styleMusic.common.black
291+ height: units.gu(0.25)
292+
293+ Rectangle {
294+ id: playerControlsProgressBarHint
295+ anchors {
296+ left: parent.left
297+ top: parent.top
298+ }
299+ color: UbuntuColors.blue
300+ height: parent.height
301+ width: 0
302+
303+ Connections {
304+ target: player
305+ onPositionChanged: {
306+ playerControlsProgressBarHint.width = (player.position / player.duration) * playerControlsProgressBar.width
307+ }
308+ onStopped: {
309+ playerControlsProgressBarHint.width = 0;
310+ }
311+ }
312 }
313 }
314 }
315@@ -1000,19 +942,6 @@
316 musicToolbarFullProgressBarContainer.seeking = false;
317 }
318 }
319-
320- // Timer for autohide
321- Timer {
322- id: toolbarAutoHideTimer
323- interval: 5000
324- repeat: false
325- running: false
326- onTriggered: {
327- if (currentPage !== nowPlaying) { // don't autohide on now playing
328- hideToolbar();
329- }
330- }
331- }
332 }
333 }
334
335
336=== modified file 'MusicTracks.qml'
337--- MusicTracks.qml 2014-09-20 15:41:33 +0000
338+++ MusicTracks.qml 2014-10-01 21:09:08 +0000
339@@ -36,8 +36,9 @@
340
341 ListView {
342 id: tracklist
343- anchors.fill: parent
344- anchors.bottomMargin: musicToolbar.mouseAreaOffset + musicToolbar.minimizedHeight
345+ anchors {
346+ fill: parent
347+ }
348 highlightFollowsCurrentItem: false
349 objectName: "trackstab-listview"
350 model: SortFilterModel {
351
352=== modified file 'MusicaddtoPlaylist.qml'
353--- MusicaddtoPlaylist.qml 2014-09-20 10:50:45 +0000
354+++ MusicaddtoPlaylist.qml 2014-10-01 21:09:08 +0000
355@@ -65,7 +65,6 @@
356 ListView {
357 id: addtoPlaylistView
358 anchors {
359- bottomMargin: musicToolbar.mouseAreaOffset + musicToolbar.minimizedHeight
360 fill: parent
361 }
362 clip: true
363
364=== modified file 'common/AlbumsPage.qml'
365--- common/AlbumsPage.qml 2014-09-20 15:41:33 +0000
366+++ common/AlbumsPage.qml 2014-10-01 21:09:08 +0000
367@@ -28,7 +28,6 @@
368
369 MusicPage {
370 id: albumStackPage
371- anchors.bottomMargin: units.gu(.5)
372 objectName: "albumsArtistPage"
373 visible: false
374
375@@ -38,7 +37,6 @@
376 ListView {
377 id: albumtrackslist
378 anchors {
379- bottomMargin: wideAspect ? musicToolbar.fullHeight : musicToolbar.mouseAreaOffset + musicToolbar.minimizedHeight
380 fill: parent
381 }
382 delegate: albumTracksDelegate
383
384=== modified file 'common/MusicPage.qml'
385--- common/MusicPage.qml 2014-08-20 17:35:52 +0000
386+++ common/MusicPage.qml 2014-10-01 21:09:08 +0000
387@@ -23,6 +23,10 @@
388 // generic page for music, could be useful for bottomedge implementation
389 Page {
390 id: thisPage
391+ anchors {
392+ bottomMargin: musicToolbar.currentHeight
393+ fill: parent
394+ }
395
396 onVisibleChanged: {
397 if (visible) {
398
399=== modified file 'common/SongsPage.qml'
400--- common/SongsPage.qml 2014-09-20 15:41:33 +0000
401+++ common/SongsPage.qml 2014-10-01 21:09:08 +0000
402@@ -29,7 +29,6 @@
403
404 MusicPage {
405 id: songStackPage
406- anchors.bottomMargin: units.gu(.5)
407 objectName: "songsPage"
408 visible: false
409
410@@ -52,7 +51,6 @@
411 ListView {
412 id: albumtrackslist
413 anchors {
414- bottomMargin: wideAspect ? musicToolbar.fullHeight : musicToolbar.mouseAreaOffset + musicToolbar.minimizedHeight
415 fill: parent
416 }
417 delegate: albumTracksDelegate
418
419=== modified file 'music-app.qml'
420--- music-app.qml 2014-09-30 01:04:02 +0000
421+++ music-app.qml 2014-10-01 21:09:08 +0000
422@@ -46,11 +46,7 @@
423 // Global keyboard shortcuts
424 focus: true
425 Keys.onPressed: {
426- if (event.key === Qt.Key_Alt) {
427- // On alt key press show toolbar and start autohide timer
428- musicToolbar.showToolbar();
429- }
430- else if(event.key === Qt.Key_Escape) {
431+ if(event.key === Qt.Key_Escape) {
432 musicToolbar.goBack(); // Esc Go back
433 }
434 else if(event.modifiers === Qt.AltModifier) {
435@@ -95,11 +91,9 @@
436 case Qt.Key_J: // Ctrl+J Jump to playing song
437 nowPlaying.visible = true;
438 nowPlaying.positionAt(player.currentIndex);
439- musicToolbar.showToolbar();
440 break;
441 case Qt.Key_N: // Ctrl+N Show now playing
442 nowPlaying.visible = true;
443- musicToolbar.showToolbar();
444 break;
445 case Qt.Key_P: // Ctrl+P Toggle playing state
446 player.toggle();
447@@ -576,12 +570,6 @@
448 if (args.values.url) {
449 uriHandler.process(args.values.url, true);
450 }
451-
452- // Show toolbar and start timer if there is music
453- if (!emptyPage.noMusic) {
454- musicToolbar.showToolbar();
455- musicToolbar.startAutohideTimer();
456- }
457 }
458
459 // VARIABLES
460@@ -597,7 +585,6 @@
461 property bool selectedAlbum: false
462
463 signal listItemSwiping(int i)
464- signal onToolbarShownChanged(bool shown, var currentPage, var currentTab)
465
466 property bool wideAspect: width >= units.gu(70) && loadedUI
467 property bool loadedUI: false // property to detect if the UI has finished
468@@ -679,8 +666,6 @@
469 // Show the Now Playing page and make sure the track is visible
470 tabs.pushNowPlaying();
471 nowPlaying.ensureVisibleIndex = index;
472-
473- musicToolbar.showToolbar();
474 }
475 else {
476 player.source = file;
477@@ -698,8 +683,6 @@
478 // Show the Now Playing page and make sure the track is visible
479 tabs.pushNowPlaying();
480 nowPlaying.ensureVisibleIndex = index;
481-
482- musicToolbar.showToolbar();
483 }
484
485 function playRandomSong(shuffle)

Subscribers

People subscribed via source and target branches