Ubuntu Music App

Merge lp:~nik90/music-app/album-code-refactor-and-fixes into lp:music-app/trusty

  1. album-code-refactor-and-fixes
  2. Merge into trusty
Proposed by Nekhelesh Ramananthan
Status: Rejected
Rejected by: Andrew Hayzen
Proposed branch: lp:~nik90/music-app/album-code-refactor-and-fixes
Merge into: lp:music-app/trusty
Diff against target: 857 lines (+303/-264)
7 files modified
MusicAlbums.qml (+224/-263)
MusicArtists.qml (+6/-0)
MusicNowPlaying.qml (+1/-0)
MusicPlaylists.qml (+4/-1)
MusicStart.qml (+4/-0)
MusicTracks.qml (+1/-0)
common/ImageButton.qml (+63/-0)
To merge this branch: bzr merge lp:~nik90/music-app/album-code-refactor-and-fixes
Reviewer Review Type Date Requested Status
Nekhelesh Ramananthan (community) Disapprove
Victor Thompson Needs Fixing
Ubuntu Phone Apps Jenkins Bot continuous-integration Needs Fixing
Review via email: mp+200946@code.launchpad.net

Commit message

This commit implements the following,
- Fixes missing playlist count in the playlist page (Bug #1267315)
- Removes some redundant code declarations.
- Added code indentation and spacing to allow for better code readability
- Where possible use column and row to remove anchor definitions in the elements themselves.
- Added new component ImageButton which is derived from the Abstract Button. This is used in places like the expandable where "Add to Playlist" and "Add to queue" actions are required.
- Changed the UbuntuShape radius to "medium" throughout the app as can be observed in the design spec at https://docs.google.com/document/d/12ZvFDfH-7zjk-seTFpP205yOuUNi9ticEkvmQFi_bTY/edit
- Tweaked grid flow type to LeftToRight to ensure that the grid view uses the application width and height efficiently.

Description of the change

This MP implements the following,
- Fixes missing playlist count in the playlist page (Bug #1267315)

- Added new component ImageButton which is derived from the Abstract Button. This is used in places like the expandable where "Add to Playlist" and "Add to queue" actions are required instead of using a label and icon by themselves. (only in MusicAlbums.qml for this MP)

- Removes some redundant code declarations like the following,
1. wrapMode: Text.NoWrap is not required since the default wrapMode is NoWrap.
2. MaximumLineCount: 1 is also not required since if you declare the width of the label, it will automatically restrict the label to 1 line.
3. Many times I saw empty signals like onDoublePressed{} with no code inside it. I removed them since they do nothing.

- Added code indentation and spacing to allow for better code readability

- Changed the UbuntuShape radius to "medium" throughout the app as can be observed in the design spec at https://docs.google.com/document/d/12ZvFDfH-7zjk-seTFpP205yOuUNi9ticEkvmQFi_bTY/edit

- Where possible use column and row to remove anchor definitions in the elements themselves.

UPDATE1: Tweaked grid flow type to LeftToRight to ensure that the grid view uses the application width and height efficiently. Before this fix, the grid would always show the albums vertically even if there were sufficient width. This is suboptimal behaviour.

NOTE: This kind of code refactor and organization is required in other pages. However to make it easier to review and also reduce the risk of regression, I will do it in several MP. This MP was focussed on the MusicAlbums.qml file alone.

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:302
http://91.189.93.70:8080/job/music-app-ci/433/
Executed test runs:
    UNSTABLE: http://91.189.93.70:8080/job/generic-mediumtests-trusty/612
    SUCCESS: http://91.189.93.70:8080/job/music-app-raring-amd64-ci/433
    SUCCESS: http://91.189.93.70:8080/job/music-app-saucy-amd64-ci/435
    SUCCESS: http://91.189.93.70:8080/job/music-app-trusty-amd64-ci/154

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

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

Thanks for the count fix. I never noticed it--I haven't paid much attention to the playlist portion of the app as that was mostly Daniel's baby. I'm not 100% sure the UbuntuShapes should be modified to have a medium radius, however. I thought most of the spec elements were NOT that round (besides the larger shapes in the Music in Albums tabs). The spec almost seems oddly somewhere between the default (small) and medium, but closer to small. BUT, I know most other apps are using the rounder version of the components. At first I assumed I wouldn't prefer the cover art images at a medium radius, but I actually do like it visualized that way now that I see it.

The refactor portion of this still needs to be reviewed a bit--I don't have time at the moment.

Revision history for this message
Nekhelesh Ramananthan (nik90) wrote :

Let me know what your final decision is regarding the ubuntu shape. Personally I like the "medium" radius since it matches with other apps and also looks good. But I leave that entirely up to you. As for the refactor portion, I will have one final look at my changes.

It seems that one of the tests is failing due to my code refactor. I tried fixing the test, but I am terrible with python and wasn't able to fix. Do you mind looking at it while reviewing my code and proposing a fix? The failing test is music_app.tests.test_music.TestMainWindow.test_add_song_to_queue_from_albums_sheet(with mouse)

lp:~nik90/music-app/album-code-refactor-and-fixes updated
303. By Nekhelesh Ramananthan

Tweaked grid behaviour to take advantage of the app width and height

304. By Nekhelesh Ramananthan

reverted manifest.json file change

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

FAILED: Continuous integration, rev:304
http://91.189.93.70:8080/job/music-app-ci/435/
Executed test runs:
    UNSTABLE: http://91.189.93.70:8080/job/generic-mediumtests-trusty/617
    SUCCESS: http://91.189.93.70:8080/job/music-app-raring-amd64-ci/435
    SUCCESS: http://91.189.93.70:8080/job/music-app-saucy-amd64-ci/437
    SUCCESS: http://91.189.93.70:8080/job/music-app-trusty-amd64-ci/156

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

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

I believe you'll need to revert your changes in r303. The Albums tab is supposed to flow left to right as it did previously, as per the design spec.

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

One more thing is that the playlist count not being shown should be fixed by the branch I have proposed to merge that completes the app's move to using the Sheet property, per the design spec. The Page that you are fixing will actually be removed by that MP.

Revision history for this message
Nekhelesh Ramananthan (nik90) wrote :

Considering that the page I did the code refactoring for does not exist and bug fixes made in another MP, I am disapproving this branch.

>I believe you'll need to revert your changes in r303. The Albums tab is supposed to flow left to right as it >did previously, as per the design spec.

You might want to check the music app trunk. In the albums tab, the albums are supposed to use a organic view as per design spec. However currently the music app shows the albums vertically there by wasting application width when viewed on the desktop. None the less, this MP is disapproved, so it doesn't matter.

review: Disapprove
Revision history for this message
Andrew Hayzen (ahayzen) wrote :

Shall I reject the MP for you?

Regarding the organic view this wasn't added before due to time constraints, but it is on our list of things todo :-)

Revision history for this message
Nekhelesh Ramananthan (nik90) wrote :

Yeah please do. Thanks.

Unmerged revisions

304. By Nekhelesh Ramananthan

reverted manifest.json file change

303. By Nekhelesh Ramananthan

Tweaked grid behaviour to take advantage of the app width and height

302. By Nekhelesh Ramananthan

Changed ubuntu shape radius to medium throughout app

301. By Nekhelesh Ramananthan

merge from trunk

300. By Nekhelesh Ramananthan

Fixed missing playlist count in the playlist page

299. By Nekhelesh Ramananthan

Revert accidental manifest.json change

298. By Nekhelesh Ramananthan

Organised the entire album tab code

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1=== modified file 'MusicAlbums.qml'
2--- MusicAlbums.qml 2013-12-23 22:53:59 +0000
3+++ MusicAlbums.qml 2014-01-09 14:17:52 +0000
4@@ -16,20 +16,20 @@
5 */
6
7 import QtQuick 2.0
8+import QtMultimedia 5.0
9 import Ubuntu.Components 0.1
10-import Ubuntu.Components.ListItems 0.1
11+import QtGraphicalEffects 1.0
12+import QtQuick.LocalStorage 2.0
13 import Ubuntu.Components.Popups 0.1
14 import Ubuntu.Components.ListItems 0.1 as ListItem
15-import QtMultimedia 5.0
16-import QtQuick.LocalStorage 2.0
17-import QtGraphicalEffects 1.0
18-import "settings.js" as Settings
19 import "meta-database.js" as Library
20 import "playlists.js" as Playlists
21+import "settings.js" as Settings
22 import "common"
23
24 Page {
25 id: mainpage
26+
27 title: i18n.tr("Albums")
28
29 property string artist: ""
30@@ -42,9 +42,7 @@
31
32 onVisibleChanged: {
33 if (visible === true)
34- {
35 musicToolbar.setPage(mainpage);
36- }
37 }
38
39 MusicSettings {
40@@ -53,27 +51,34 @@
41
42 GridView {
43 id: albumlist
44- anchors.fill: parent
45- anchors.leftMargin: units.gu(1)
46- anchors.topMargin: units.gu(1)
47- anchors.bottomMargin: units.gu(1)
48- cellHeight: (parent.height - units.gu(2))/3
49- cellWidth: (parent.height - units.gu(2))/3
50+
51+ anchors {
52+ fill: parent
53+ margins: units.gu(1)
54+ }
55+
56 model: albumModel.model
57 delegate: albumDelegate
58- flow: GridView.TopToBottom
59+ flow: GridView.LeftToRight
60+ cellHeight: mainpage.width <= units.gu(50) ? (mainpage.width - albumlist.anchors.margins)/2 : (units.gu(60) - albumlist.anchors.margins)/3
61+ cellWidth: cellHeight
62
63 Component {
64 id: albumDelegate
65 Item {
66 id: albumItem
67+
68 height: albumlist.cellHeight - units.gu(1)
69 width: albumlist.cellHeight - units.gu(1)
70 anchors.margins: units.gu(1)
71+
72 UbuntuShape {
73 id: albumShape
74+
75 height: albumItem.width
76 width: albumItem.width
77+ radius: "medium"
78+
79 image: Image {
80 id: icon
81 fillMode: Image.Stretch
82@@ -86,58 +91,58 @@
83 property string year: model.year
84 source: cover !== "" ? cover : "images/cover_default.png"
85 }
86- UbuntuShape { // Background so can see text in current state
87- id: albumBg2
88- anchors.bottom: parent.bottom
89- color: styleMusic.common.black
90- height: units.gu(4)
91- width: parent.width
92- }
93- Rectangle { // Background so can see text in current state
94- id: albumBg
95- anchors.bottom: parent.bottom
96- anchors.bottomMargin: units.gu(2)
97- color: styleMusic.common.black
98- height: units.gu(3)
99- width: parent.width
100- }
101- Label {
102- id: albumArtist
103- objectName: "albums-albumartist"
104- anchors.bottom: parent.bottom
105- anchors.bottomMargin: units.gu(1)
106- anchors.left: parent.left
107- anchors.leftMargin: units.gu(.25)
108- anchors.right: parent.right
109- anchors.rightMargin: units.gu(.25)
110- horizontalAlignment: Text.AlignHCenter
111- color: styleMusic.nowPlaying.labelSecondaryColor
112- elide: Text.ElideRight
113- text: artist
114- fontSize: "x-small"
115- }
116- Label {
117- id: albumLabel
118- anchors.bottom: parent.bottom
119- anchors.bottomMargin: units.gu(3)
120- anchors.left: parent.left
121- anchors.leftMargin: units.gu(.25)
122- anchors.right: parent.right
123- anchors.rightMargin: units.gu(.25)
124- horizontalAlignment: Text.AlignHCenter
125- color: styleMusic.common.white
126- elide: Text.ElideRight
127- text: album
128- fontSize: "small"
129+
130+ // Black Bar to contain the album title and artist
131+ UbuntuShape {
132+ anchors {
133+ left: parent.left
134+ right: parent.right
135+ bottom: parent.bottom
136+ }
137+
138+ radius: "medium"
139+ height: units.gu(5)
140+ color: styleMusic.common.black
141+
142+ // Black rectangle to remove the curved corners at the top
143+ Rectangle {
144+ anchors { fill: parent; bottomMargin: units.gu(1) }
145+ color: styleMusic.common.black
146+ }
147+
148+ Column {
149+ id: albumDataColumn
150+ anchors {
151+ verticalCenter: parent.verticalCenter
152+ left: parent.left
153+ right: parent.right
154+ margins: units.gu(1)
155+ }
156+
157+ Label {
158+ id: albumLabel
159+ text: album
160+ fontSize: "small"
161+ width: parent.width
162+ elide: Text.ElideRight
163+ color: styleMusic.common.white
164+ }
165+
166+ Label {
167+ id: albumArtist
168+ objectName: "albums-albumartist"
169+ text: artist
170+ width: parent.width
171+ fontSize: "x-small"
172+ elide: Text.ElideRight
173+ color: styleMusic.nowPlaying.labelSecondaryColor
174+ }
175+ }
176 }
177 }
178
179 MouseArea {
180 anchors.fill: parent
181- onDoubleClicked: {
182- }
183- onPressAndHold: {
184- }
185 onClicked: {
186 albumTracksModel.filterAlbumTracks(album)
187 mainpage.artist = artist
188@@ -156,112 +161,109 @@
189 id: albumSheet
190 DefaultSheet {
191 id: sheet
192- anchors.bottomMargin: units.gu(.5)
193+
194 doneButton: false
195+ anchors.bottomMargin: units.gu(0.5)
196 contentsHeight: parent.height
197 contentsWidth: parent.width
198
199 ListView {
200+ id: albumtrackslist
201+
202 clip: true
203- id: albumtrackslist
204- width: parent.width
205- anchors.top: parent.top
206- anchors.bottom: parent.bottom
207+ anchors.fill: parent
208+ anchors.margins: -units.gu(1)
209 model: albumTracksModel.model
210 delegate: albumTracksDelegate
211+
212+ onCountChanged: albumtrackslist.currentIndex = albumTracksModel.indexOf(currentFile)
213+
214 header: ListItem.Standard {
215 id: albumInfo
216+
217 width: parent.width
218 height: units.gu(20)
219+ showDivider: false
220
221 UbuntuShape {
222 id: albumImage
223- anchors.left: parent.left
224- anchors.top: parent.top
225- anchors.verticalCenter: parent.verticalCenter
226- anchors.margins: units.gu(1)
227+
228+ anchors {
229+ top: parent.top
230+ bottom: parent.bottom
231+ left: parent.left
232+ margins: units.gu(2)
233+ }
234+
235+ radius: "medium"
236 height: parent.height
237 width: height
238 image: Image {
239 source: Library.hasCover(mainpage.file) ? mainpage.cover : Qt.resolvedUrl("images/cover_default.png")
240 }
241 }
242- Label {
243- id: albumArtist
244- objectName: "albumsheet-albumartist"
245- wrapMode: Text.NoWrap
246- maximumLineCount: 1
247- fontSize: "small"
248- anchors.left: albumImage.right
249- anchors.leftMargin: units.gu(1)
250- anchors.top: parent.top
251- anchors.topMargin: units.gu(1.5)
252- anchors.right: parent.right
253- anchors.rightMargin: units.gu(1.5)
254- elide: Text.ElideRight
255- text: mainpage.artist
256- }
257- Label {
258- id: albumLabel
259- wrapMode: Text.NoWrap
260- maximumLineCount: 2
261- fontSize: "medium"
262- color: styleMusic.common.music
263- anchors.left: albumImage.right
264- anchors.leftMargin: units.gu(1)
265- anchors.top: albumArtist.bottom
266- anchors.topMargin: units.gu(0.8)
267- anchors.right: parent.right
268- anchors.rightMargin: units.gu(1.5)
269- elide: Text.ElideRight
270- text: mainpage.album
271- }
272+
273+ Column {
274+ id: albumInfoColumn
275+
276+ anchors {
277+ top: albumImage.top
278+ left: albumImage.right
279+ leftMargin: units.gu(1)
280+ }
281+
282+ Label {
283+ id: albumArtist
284+ objectName: "albumsheet-albumartist"
285+ fontSize: "small"
286+ text: mainpage.artist
287+ elide: Text.ElideRight
288+ }
289+
290+ Label {
291+ id: albumLabel
292+ text: mainpage.album
293+ elide: Text.ElideRight
294+ color: styleMusic.common.music
295+ }
296+ }
297+
298 Label {
299 id: albumYear
300- wrapMode: Text.NoWrap
301- maximumLineCount: 1
302+ anchors {
303+ top: albumInfoColumn.bottom
304+ left: albumInfoColumn.left
305+ topMargin: units.gu(2)
306+ }
307 fontSize: "x-small"
308- anchors.left: albumImage.right
309- anchors.leftMargin: units.gu(1)
310- anchors.top: albumLabel.bottom
311- anchors.topMargin: units.gu(2)
312- anchors.right: parent.right
313- anchors.rightMargin: units.gu(1.5)
314 elide: Text.ElideRight
315 text: i18n.tr(mainpage.year + " | %1 song", mainpage.year + " | %1 songs", albumTracksModel.model.count).arg(albumTracksModel.model.count)
316 }
317 }
318
319- onCountChanged: {
320- albumtrackslist.currentIndex = albumTracksModel.indexOf(currentFile)
321- }
322-
323 Component {
324 id: albumTracksDelegate
325
326 ListItem.Standard {
327 id: track
328 objectName: "albumsheet-track"
329+
330 iconFrame: false
331 progression: false
332 height: styleMusic.albums.itemHeight
333
334 MouseArea {
335 anchors.fill: parent
336- onDoubleClicked: {
337- }
338 onClicked: {
339- if (focus == false) {
340+ if (focus == false)
341 focus = true
342- }
343 trackClicked(albumTracksModel, index) // play track
344 Library.addRecent(album, artist, cover, album, "album")
345 mainView.hasRecent = true
346 recentModel.filterRecent()
347
348- // TODO: This closes the SDK defined sheet
349- // component. It should be able to close
350- // albumSheet.
351+ // TODO: This closes the SDK defined sheet component. It should be able to close
352+ // albumSheet.
353 PopupUtils.close(sheet)
354 }
355 }
356@@ -269,17 +271,14 @@
357 Label {
358 id: trackTitle
359 objectName: "albumsheet-tracktitle"
360- wrapMode: Text.NoWrap
361- maximumLineCount: 1
362+ anchors {
363+ top: parent.top
364+ left: parent.left
365+ right: expandItem.left
366+ leftMargin: units.gu(2)
367+ margins: units.gu(1)
368+ }
369 fontSize: "medium"
370- anchors.left: parent.left
371- anchors.leftMargin: units.gu(2)
372- anchors.top: parent.top
373- anchors.topMargin: units.gu(1)
374- anchors.bottom: parent.bottom
375- anchors.bottomMargin: units.gu(1)
376- anchors.right: expandItem.left
377- anchors.rightMargin: units.gu(1.5)
378 elide: Text.ElideRight
379 text: model.title
380 }
381@@ -287,48 +286,47 @@
382 Image {
383 id: expandItem
384 objectName: "albumsheet-expanditem"
385- anchors.right: parent.right
386- anchors.rightMargin: units.gu(2)
387+
388+ anchors {
389+ verticalCenter: trackTitle.verticalCenter
390+ right: parent.right
391+ rightMargin: units.gu(2)
392+ }
393 source: expandable.visible ? "images/dropdown-menu-up.svg" : "images/dropdown-menu.svg"
394 height: styleMusic.common.expandedItem
395 width: styleMusic.common.expandedItem
396- y: parent.y + (styleMusic.albums.itemHeight / 2) - (height / 2)
397+
398+ MouseArea {
399+ anchors.centerIn: parent
400+ width: styleMusic.common.expandedItem * 3
401+ height: styleMusic.common.expandedItem * 2
402+ onClicked: {
403+ if(expandable.visible) {
404+ customdebug("clicked collapse")
405+ expandable.visible = false
406+ track.height = styleMusic.albums.itemHeight
407+ }
408+ else {
409+ customdebug("clicked expand")
410+ collapseExpand(-1); // collapse all others
411+ expandable.visible = true
412+ track.height = styleMusic.albums.expandedHeight
413+ }
414+ }
415+ }
416 }
417
418- MouseArea {
419- anchors.bottom: parent.bottom
420- anchors.right: parent.right
421- anchors.top: parent.top
422- width: styleMusic.common.expandedItem * 3
423- onClicked: {
424- if(expandable.visible) {
425- customdebug("clicked collapse")
426- expandable.visible = false
427- track.height = styleMusic.albums.itemHeight
428- }
429- else {
430- customdebug("clicked expand")
431- collapseExpand(-1); // collapse all others
432- expandable.visible = true
433- track.height = styleMusic.albums.expandedHeight
434- }
435- }
436- }
437-
438- Rectangle {
439+ Item {
440 id: expandable
441- color: "transparent"
442+
443+ visible: false
444 height: styleMusic.albums.expandHeight
445- visible: false
446+
447+ Component.onCompleted: collapseExpand.connect(onCollapseExpand);
448+
449 MouseArea {
450- anchors.fill: parent
451- onClicked: {
452- customdebug("User pressed outside the playlist item and expanded items.")
453- }
454- }
455-
456- Component.onCompleted: {
457- collapseExpand.connect(onCollapseExpand);
458+ anchors.fill: parent
459+ onClicked: customdebug("User pressed outside the playlist item and expanded items.")
460 }
461
462 function onCollapseExpand(indexCol)
463@@ -341,108 +339,73 @@
464 }
465 }
466
467- // background for expander
468+ // Background for expander
469 Rectangle {
470 id: expandedBackground
471- anchors.top: parent.top
472- anchors.topMargin: styleMusic.albums.itemHeight
473+
474+ anchors {
475+ top: parent.top
476+ topMargin: styleMusic.albums.itemHeight
477+ }
478+
479+ opacity: 0.4
480+ width: track.width
481 color: styleMusic.common.black
482 height: styleMusic.albums.expandedHeight - styleMusic.albums.itemHeight
483- width: track.width
484- opacity: 0.4
485- }
486-
487- // add to playlist
488- Rectangle {
489- id: playlistRow
490- anchors.top: expandedBackground.top
491- anchors.left: parent.left
492- anchors.leftMargin: styleMusic.albums.expandedLeftMargin
493- color: "transparent"
494- height: expandedBackground.height
495- width: units.gu(15)
496- Icon {
497- id: playlistTrack
498- anchors.verticalCenter: parent.verticalCenter
499- color: styleMusic.common.white
500- name: "add"
501- height: styleMusic.common.expandedItem
502- width: styleMusic.common.expandedItem
503- }
504- Label {
505- anchors.left: playlistTrack.right
506- anchors.leftMargin: units.gu(0.5)
507- anchors.verticalCenter: parent.verticalCenter
508- color: styleMusic.common.white
509- fontSize: "small"
510- width: parent.width - playlistTrack.width - units.gu(1)
511- text: i18n.tr("Add to playlist")
512- wrapMode: Text.WordWrap
513- maximumLineCount: 3
514- }
515- MouseArea {
516- anchors.fill: parent
517- onClicked: {
518- expandable.visible = false
519- track.height = styleMusic.albums.itemHeight
520- chosenArtist = artist
521- chosenTitle = title
522- chosenTrack = file
523- chosenAlbum = album
524- chosenCover = cover
525- chosenGenre = genre
526- chosenIndex = index
527- console.debug("Debug: Add track to playlist")
528- PopupUtils.open(Qt.resolvedUrl("MusicaddtoPlaylist.qml"), mainView,
529- {
530- title: i18n.tr("Select playlist")
531- } )
532- }
533- }
534- }
535- // Queue
536- Rectangle {
537- id: queueRow
538- anchors.top: expandedBackground.top
539- anchors.left: playlistRow.left
540- anchors.leftMargin: units.gu(15)
541- color: "transparent"
542- height: expandedBackground.height
543- width: units.gu(15)
544- Image {
545- id: queueTrack
546- objectName: "albumsheet-queuetrack"
547- anchors.verticalCenter: parent.verticalCenter
548- source: "images/queue.png"
549- height: styleMusic.common.expandedItem
550- width: styleMusic.common.expandedItem
551- }
552- Label {
553- anchors.left: queueTrack.right
554- anchors.leftMargin: units.gu(0.5)
555- anchors.verticalCenter: parent.verticalCenter
556- color: styleMusic.common.white
557- fontSize: "small"
558- width: parent.width - queueTrack.width - units.gu(1)
559- text: i18n.tr("Add to queue")
560- wrapMode: Text.WordWrap
561- maximumLineCount: 3
562- }
563- MouseArea {
564- anchors.fill: parent
565- onClicked: {
566- expandable.visible = false
567- track.height = styleMusic.albums.itemHeight
568- console.debug("Debug: Add track to queue: " + title)
569- trackQueue.model.append({"title": title, "artist": artist, "file": file, "album": album, "cover": cover, "genre": genre})
570- }
571- }
572- }
573- }
574-
575- onFocusChanged: {
576- }
577- Component.onCompleted: {
578+
579+ Row {
580+ id: trackOptionsRow
581+
582+ anchors {
583+ verticalCenter: parent.verticalCenter
584+ left: parent.left
585+ right: parent.right
586+ leftMargin: styleMusic.albums.expandedLeftMargin
587+ }
588+
589+ spacing: styleMusic.albums.expandedLeftMargin
590+
591+ ImageButton {
592+ id: addToPlaylistButton
593+
594+ icon.name: "add"
595+ icon.width: styleMusic.common.expandedItem
596+ label.text: i18n.tr("Add to playlist")
597+ label.anchors.verticalCenter: icon.verticalCenter
598+
599+ onClicked: {
600+ expandable.visible = false
601+ track.height = styleMusic.albums.itemHeight
602+ chosenArtist = artist
603+ chosenTitle = title
604+ chosenTrack = file
605+ chosenAlbum = album
606+ chosenCover = cover
607+ chosenGenre = genre
608+ chosenIndex = index
609+ console.debug("Debug: Add track to playlist")
610+ PopupUtils.open(Qt.resolvedUrl("MusicaddtoPlaylist.qml"), mainView, { title: i18n.tr("Select playlist") })
611+ }
612+ }
613+
614+ ImageButton {
615+ id: addToQueueButton
616+ objectName: "albumsheet-queuetrack"
617+
618+ image.source: Qt.resolvedUrl("images/queue.png")
619+ image.width: styleMusic.common.expandedItem
620+ label.text: i18n.tr("Add to queue")
621+ label.anchors.verticalCenter: image.verticalCenter
622+
623+ onClicked: {
624+ expandable.visible = false
625+ track.height = styleMusic.albums.itemHeight
626+ console.debug("Debug: Add track to queue: " + title)
627+ trackQueue.model.append({"title": title, "artist": artist, "file": file, "album": album, "cover": cover, "genre": genre})
628+ }
629+ }
630+ }
631+ }
632 }
633 }
634 }
635@@ -450,5 +413,3 @@
636 }
637 }
638 }
639-
640-
641
642=== modified file 'MusicArtists.qml'
643--- MusicArtists.qml 2013-12-23 22:53:59 +0000
644+++ MusicArtists.qml 2014-01-09 14:17:52 +0000
645@@ -70,6 +70,7 @@
646 anchors.leftMargin: units.gu(4)
647 anchors.top: parent.top
648 anchors.topMargin: units.gu(1)
649+ radius: "medium"
650 width: styleMusic.common.albumSize
651 height: styleMusic.common.albumSize
652 image: Image {
653@@ -83,6 +84,7 @@
654 anchors.leftMargin: units.gu(3)
655 anchors.top: parent.top
656 anchors.topMargin: units.gu(1)
657+ radius: "medium"
658 width: styleMusic.common.albumSize
659 height: styleMusic.common.albumSize
660 image: Image {
661@@ -96,6 +98,7 @@
662 anchors.leftMargin: units.gu(2)
663 anchors.top: parent.top
664 anchors.topMargin: units.gu(1)
665+ radius: "medium"
666 width: styleMusic.common.albumSize
667 height: styleMusic.common.albumSize
668 image: Image {
669@@ -109,6 +112,7 @@
670 anchors.leftMargin: units.gu(1)
671 anchors.top: parent.top
672 anchors.topMargin: units.gu(1)
673+ radius: "medium"
674 width: styleMusic.common.albumSize
675 height: styleMusic.common.albumSize
676 image: Image {
677@@ -220,6 +224,7 @@
678 anchors.margins: units.gu(2)
679 height: parent.height
680 width: height
681+ radius: "medium"
682 image: Image {
683 source: artisttrackslist.cover !== "" ? artisttrackslist.cover : "images/cover_default.png"
684 }
685@@ -298,6 +303,7 @@
686 anchors.leftMargin: units.gu(2)
687 anchors.top: parent.top
688 anchors.topMargin: units.gu(1)
689+ radius: "medium"
690 width: styleMusic.common.albumSize
691 height: styleMusic.common.albumSize
692 image: Image {
693
694=== modified file 'MusicNowPlaying.qml'
695--- MusicNowPlaying.qml 2013-12-23 22:53:59 +0000
696+++ MusicNowPlaying.qml 2014-01-09 14:17:52 +0000
697@@ -528,6 +528,7 @@
698 anchors.left: parent.left
699 anchors.leftMargin: units.gu(1.5)
700 anchors.top: parent.top
701+ radius: "medium"
702 height: (queueListItem.state === "current" ? queuelist.currentHeight - units.gu(8) : queuelist.normalHeight) - units.gu(2)
703 width: height
704 image: Image {
705
706=== modified file 'MusicPlaylists.qml'
707--- MusicPlaylists.qml 2014-01-09 00:43:35 +0000
708+++ MusicPlaylists.qml 2014-01-09 14:17:52 +0000
709@@ -492,6 +492,7 @@
710
711 Label {
712 id: playlistInfoCount
713+
714 anchors {
715 top: playlistInfoLabel.bottom
716 left: playlistInfoLabel.left
717@@ -499,7 +500,7 @@
718 topMargin: units.gu(1)
719 rightMargin: units.gu(1.5)
720 }
721- text: i18n.tr("%1 song", "%1 songs", playlist.count).arg(playlist.count)
722+ text: i18n.tr("%1 song", "%1 songs", playlistInfo.count).arg(playlistInfo.count)
723 color: styleMusic.common.white
724 fontSize: "medium"
725 elide: Text.ElideRight
726@@ -1022,6 +1023,7 @@
727 anchors.leftMargin: units.gu(1)
728 anchors.top: parent.top
729 anchors.verticalCenter: parent.verticalCenter
730+ radius: "medium"
731 width: styleMusic.common.albumSize
732 height: styleMusic.common.albumSize
733 image: Image {
734@@ -1030,6 +1032,7 @@
735 UbuntuShape { // Background so can see text in current state
736 id: trackBg
737 anchors.top: parent.top
738+ radius: "medium"
739 color: styleMusic.common.black
740 width: styleMusic.common.albumSize
741 height: styleMusic.common.albumSize
742
743=== modified file 'MusicStart.qml'
744--- MusicStart.qml 2013-12-19 14:39:27 +0000
745+++ MusicStart.qml 2014-01-09 14:17:52 +0000
746@@ -104,6 +104,7 @@
747 id: recentShape
748 height: recentItem.width
749 width: recentItem.width
750+ radius: "medium"
751 image: Image {
752 id: icon
753 fillMode: Image.Stretch
754@@ -119,6 +120,7 @@
755 UbuntuShape { // Background so can see text in current state
756 id: albumBg2
757 anchors.bottom: parent.bottom
758+ radius: "medium"
759 color: styleMusic.common.black
760 height: units.gu(4)
761 width: parent.width
762@@ -228,6 +230,7 @@
763 id: genreShape
764 height: genreItem.width
765 width: genreItem.width
766+ radius: "medium"
767 image: Image {
768 id: icon
769 fillMode: Image.Stretch
770@@ -272,6 +275,7 @@
771 UbuntuShape { // Background so can see text in current state
772 id: genreBg2
773 anchors.bottom: parent.bottom
774+ radius: "medium"
775 color: styleMusic.common.black
776 height: units.gu(4)
777 width: parent.width
778
779=== modified file 'MusicTracks.qml'
780--- MusicTracks.qml 2014-01-06 18:08:52 +0000
781+++ MusicTracks.qml 2014-01-09 14:17:52 +0000
782@@ -73,6 +73,7 @@
783 anchors.leftMargin: units.gu(2)
784 anchors.top: parent.top
785 anchors.topMargin: units.gu(1)
786+ radius: "medium"
787 width: styleMusic.common.albumSize
788 height: styleMusic.common.albumSize
789 image: Image {
790
791=== added file 'common/ImageButton.qml'
792--- common/ImageButton.qml 1970-01-01 00:00:00 +0000
793+++ common/ImageButton.qml 2014-01-09 14:17:52 +0000
794@@ -0,0 +1,63 @@
795+/*
796+ * Copyright (C) 2013 Canonical Ltd
797+ *
798+ * This program is free software: you can redistribute it and/or modify
799+ * it under the terms of the GNU General Public License version 3 as
800+ * published by the Free Software Foundation.
801+ *
802+ * This program is distributed in the hope that it will be useful,
803+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
804+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
805+ * GNU General Public License for more details.
806+ *
807+ * You should have received a copy of the GNU General Public License
808+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
809+ *
810+ * Authored by: Nekhelesh Ramananthan <krnekhelesh@gmail.com>
811+ */
812+
813+import QtQuick 2.0
814+import Ubuntu.Components 0.1
815+
816+// Qml Item to draw a button with an image on its left/right
817+AbstractButton {
818+ id: imageButton
819+
820+ // Set the button label and image
821+ property alias label: _label
822+ property alias image: _image
823+ property alias icon: _icon
824+
825+ // Property to mirror the button layout if necessary. Image on the left by default.
826+ property bool mirrorLayout: false;
827+
828+ width: childrenRect.width;
829+ height: childrenRect.height;
830+
831+ Row {
832+ spacing: units.gu(1);
833+ height: childrenRect.height;
834+ LayoutMirroring.enabled: mirrorLayout
835+
836+ Icon {
837+ id: _icon
838+ name: ""
839+ height: width
840+ color: styleMusic.common.white
841+ visible: name === "" ? false : true
842+ }
843+
844+ Image {
845+ id: _image
846+ source: ""
847+ height: width
848+ visible: source === "" ? false : true
849+ }
850+
851+ Label {
852+ id: _label
853+ fontSize: "small"
854+ color: styleMusic.common.white
855+ }
856+ }
857+}

Subscribers

People subscribed via source and target branches

to status/vote changes: