@@ -21,6 +21,7 @@ import Ubuntu.Components.ListItems 0.1
2121
2222Item {
2323 id: root
24+
2425 property alias model: trackRepeater.model
2526
2627 implicitHeight: childrenRect.height
@@ -32,8 +33,8 @@ Item {
3233 Audio {
3334 id: audio
3435 objectName: "audio"
35− property real progress: audio.position / audio.duration
3636
37+ property real progress: audio.position / audio.duration
3738 property Item playingItem
3839
3940 Component.onDestruction: {
@@ -54,9 +55,11 @@ Item {
5455 delegate: Item {
5556 id: trackItem
5657 objectName: "trackItem" + index
58+
59+ property bool isPlayingItem: audio.playingItem == trackItem
60+
5761 anchors { left: parent.left; right: parent.right }
5862 height: units.gu(5)
59− property bool isPlayingItem: audio.playingItem == trackItem
6063
6164 function play() {
6265 audio.stop();
@@ -69,12 +72,14 @@ Item {
6972
7073 Row {
7174 id: trackRow
72− width: parent.width
73− spacing: units.gu(1)
75+
7476 property int column1Width: units.gu(3)
7577 property int column2Width: width - (2 * spacing) - column1Width - column3Width
7678 property int column3Width: units.gu(4)
79+
7780 anchors.verticalCenter: parent.verticalCenter
81+ width: parent.width
82+ spacing: units.gu(1)
7883
7984 Button {
8085 objectName: "playButton"
@@ -102,17 +107,15 @@ Item {
102107 Item {
103108 anchors.verticalCenter: parent.verticalCenter
104109 width: parent.column2Width
105− height: trackArtistLabel.visible ? trackTitleLabel.height + trackArtistLabel.height : trackTitleLabel.height
110+ height: trackSubtitleLabel.visible ? trackTitleLabel.height + trackSubtitleLabel.height : trackTitleLabel.height
106111
107112 Label {
108113 id: trackTitleLabel
109114 objectName: "trackTitleLabel"
110− anchors.top: parent.top
111− anchors.left: parent.left
112− anchors.right: parent.right
113− fontSize: "small"
115+ anchors { top: parent.top; left: parent.left; right: parent.right }
114116 opacity: 0.9
115117 color: "white"
118+ fontSize: "small"
116119 horizontalAlignment: Text.AlignLeft
117120 text: modelData["title"]
118121 style: Text.Raised
@@ -121,36 +124,36 @@ Item {
121124 }
122125
123126 Label {
124− id: trackArtistLabel
125− objectName: "trackArtistLabel"
126− fontSize: "small"
127+ id: trackSubtitleLabel
128+ objectName: "trackSubtitleLabel"
129+ anchors { top: trackTitleLabel.bottom; left: parent.left; right: parent.right }
130+ visible: text != ""
127131 opacity: 0.9
128132 color: "white"
133+ fontSize: "small"
129134 horizontalAlignment: Text.AlignLeft
130− anchors.top: trackTitleLabel.bottom
131− anchors.left: parent.left
132− anchors.right: parent.right
133− width: parent.column2Width
134− text: modelData["artist"]
135+ text: modelData["subtitle"] !== undefined ? modelData["subtitle"] : ""
135136 style: Text.Raised
136137 styleColor: "black"
137138 elide: Text.ElideRight
138− visible: modelData["artist"] !== undefined
139139 }
140140
141141 UbuntuShape {
142142 id: progressBarFill
143143 objectName: "progressBarFill"
144− color: UbuntuColors.orange
145− anchors.left: progressBarImage.left
146− anchors.right: progressBarImage.right
147− anchors.verticalCenter: progressBarImage.verticalCenter
148− height: units.dp(2)
149− anchors.margins: units.dp(2)
150− anchors.rightMargin: maxWidth - (maxWidth * audio.progress) + units.dp(2)
151− visible: progressBarImage.visible
152144
153145 property int maxWidth: progressBarImage.width - units.dp(4)
146+
147+ anchors {
148+ left: progressBarImage.left
149+ right: progressBarImage.right
150+ verticalCenter: progressBarImage.verticalCenter
151+ margins: units.dp(2)
152+ rightMargin: maxWidth - (maxWidth * audio.progress) + units.dp(2)
153+ }
154+ height: units.dp(2)
155+ visible: progressBarImage.visible
156+ color: UbuntuColors.orange
154157 }
155158
156159 Image {
@@ -163,32 +166,29 @@ Item {
163166 }
164167
165168 Label {
166− id: valueLabel
169+ id: timeLabel
167170 objectName: "timeLabel"
168− fontSize: "small"
171+ anchors.verticalCenter: parent.verticalCenter
172+ width: parent.column3Width
169173 opacity: 0.9
170174 color: "white"
171− anchors.verticalCenter: parent.verticalCenter
175+ fontSize: "small"
172176 horizontalAlignment: Text.AlignRight
173− width: parent.column3Width
174177 text: lengthToString(modelData["length"])
175178 style: Text.Raised
176179 styleColor: "black"
177180
178181 function lengthToString(s) {
179− if (s <= 0 || s == undefined) {
180− return ""
181− }
182+ if (s <= 0 || s === undefined) return ""
183+
182184 var sec = "" + s % 60
183− if (sec.length == 1)
184− sec = "0" + sec
185+ if (sec.length == 1) sec = "0" + sec
185186 var hour = Math.floor(s / 3600)
186187 if (hour < 1) {
187188 return Math.floor(s / 60) + ":" + sec
188189 } else {
189190 var min = "" + Math.floor(s / 60) % 60
190− if (min.length == 1)
191− min = "0" + min
191+ if (min.length == 1) min = "0" + min
192192 return hour + ":" + min + ":" + sec
193193 }
194194 }