Differential D27160 Diff 77781 applets/mediacontroller/contents/ui/ExpandedRepresentation.qml

Changeset View

Standalone View

View Options

applets/mediacontroller/contents/ui/ExpandedRepresentation.qml

1/*************************************************************************** 1​/***************************************************************************
2 * Copyright 2013 Sebastian Kügler <sebas@kde.org> * 2​ * Copyright 2013 Sebastian Kügler <sebas@kde.org> *
3 * Copyright 2014, 2016 Kai Uwe Broulik <kde@privat.broulik.de> * 3​ * Copyright 2014, 2016 Kai Uwe Broulik <kde@privat.broulik.de> *
4​ * Copyright 2020 Carson Black <uhhadd@gmail.com> *
5​ * Copyright 2020 Ismael Asensio <isma.af@gmail.com> *
4 * * 6​ * *
5 * This program is free software; you can redistribute it and/or modify * 7​ * This program is free software; you can redistribute it and/or modify *
6 * it under the terms of the GNU Library General Public License as * 8​ * it under the terms of the GNU Library General Public License as *
7 * published by the Free Software Foundation; either version 2 of the * 9​ * published by the Free Software Foundation; either version 2 of the *
8 * License, or (at your option) any later version. * 10​ * License, or (at your option) any later version. *
9 * * 11​ * *
10 * This program is distributed in the hope that it will be useful, * 12​ * This program is distributed in the hope that it will be useful, *
11 * but WITHOUT ANY WARRANTY; without even the implied warranty of * 13​ * but WITHOUT ANY WARRANTY; without even the implied warranty of *
12 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * 14​ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the *
13 * GNU Library General Public License for more details. * 15​ * GNU Library General Public License for more details. *
14 * * 16​ * *
15 * You should have received a copy of the GNU Library General Public * 17​ * You should have received a copy of the GNU Library General Public *
16 * License along with this program; if not, write to the * 18​ * License along with this program; if not, write to the *
17 * Free Software Foundation, Inc., * 19​ * Free Software Foundation, Inc., *
18 * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA . * 20​ * 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA . *
19 ***************************************************************************/ 21​ ***************************************************************************/
20 22​
21import QtQuick 2.4 23​import QtQuick 2.8
22import QtQuick.Layouts 1.1 24​import QtQuick.Layouts 1.1
23import org.kde.plasma.core 2.0 as PlasmaCore 25​import org.kde.plasma.core 2.0 as PlasmaCore
24import org.kde.plasma.components 3.0 as PlasmaComponents3 26​import org.kde.plasma.components 3.0 as PlasmaComponents3
25import org.kde.plasma.extras 2.0 as PlasmaExtras 27​import org.kde.plasma.extras 2.0 as PlasmaExtras
26import org.kde.kcoreaddons 1.0 as KCoreAddons 28​import org.kde.kcoreaddons 1.0 as KCoreAddons
29​import org.kde.kirigami 2.4 as Kirigami
30​import QtGraphicalEffects 1.0
27 31​
28Item { 32​Item {
29 id: expandedRepresentation 33​ id: expandedRepresentation
30 34​
31 Layout.minimumWidth: Layout.minimumHeight * 1.333 35​ Layout.minimumWidth: units.gridUnit * 15
32 Layout.minimumHeight: units.gridUnit * 10 36​ Layout.minimumHeight: units.gridUnit * 23
33 Layout.preferredWidth: Layout.minimumWidth * 1.5 37​ Layout.preferredWidth: Layout.minimumWidth * 1.5
34 Layout.preferredHeight: Layout.minimumHeight * 1.5 38​ Layout.preferredHeight: Layout.minimumHeight * 1.5
35 39​
36 readonly property int controlSize: units.iconSizes.large 40​ readonly property int controlSize: units.iconSizes.large
37 41​
38 property double position: mpris2Source.currentData.Position || 0 42​ property double position: mpris2Source.currentData.Position || 0
39 readonly property real rate: mpris2Source.currentData.Rate || 1 43​ readonly property real rate: mpris2Source.currentData.Rate || 1
40 readonly property double length: currentMetadata ? currentMetadata["mpris:length"] || 0 : 0 44​ readonly property double length: currentMetadata ? currentMetadata["mpris:length"] || 0 : 0
41 readonly property bool canSeek: mpris2Source.currentData.CanSeek || false 45​ readonly property bool canSeek: mpris2Source.currentData.CanSeek || false
46​ readonly property bool softwareRendering: GraphicsInfo.api === GraphicsInfo.Software
42 47​
43 // only show hours (the default for KFormat) when track is actually longer than an hour 48​ // only show hours (the default for KFormat) when track is actually longer than an hour
44 readonly property int durationFormattingOptions: length >= 60*60*1000*1000 ? 0 : KCoreAddons.FormatTypes.FoldHours 49​ readonly property int durationFormattingOptions: length >= 60*60*1000*1000 ? 0 : KCoreAddons.FormatTypes.FoldHours
45 50​
46 property bool disablePositionUpdate: false 51​ property bool disablePositionUpdate: false
47 property bool keyPressed: false 52​ property bool keyPressed: false
48 53​
49 function retrievePosition() { 54​ function retrievePosition() {
▲ Show 20 Lines • Show All 69 Lines • ▼ Show 20 Line(s)122 } else if (event.key >= Qt.Key_0 && event.key <= Qt.Key_9) {
119 seekSlider.value = seekSlider.to * (event.key - Qt.Key_0) / 10 124​ seekSlider.value = seekSlider.to * (event.key - Qt.Key_0) / 10
120 seekSlider.moved(); 125​ seekSlider.moved();
121 } else { 126​ } else {
122 event.accepted = false 127​ event.accepted = false
123 } 128​ }
124 } 129​ }
125 } 130​ }
126 131​
127 PlasmaComponents3.ComboBox { 132​ ColumnLayout { // Main Column Layout
128 id: playerCombo 133​ id: mainCol
129 width: Math.round(0.6 * parent.width) 134​ anchors.fill: parent
130 height: visible ? undefined : 0 ​
131 anchors.horizontalCenter: parent.horizontalCenter ​
132 textRole: "text" ​
133 visible: model.length > 2 // more than one player, @multiplex is always there ​
134 model: { ​
135 var model = [{ ​
136 text: i18n("Choose player automatically"), ​
137 source: mpris2Source.multiplexSource ​
138 }] ​
139 135​
140 var sources = mpris2Source.sources 136​ Item { // Album Art Background + Details
141 for (var i = 0, length = sources.length; i < length; ++i) { 137​ Layout.fillWidth: true
142 var source = sources[i] 138​ Layout.fillHeight: true
broulikUnsubmitted
Done

Superfluous since you fill both width and height?

broulik: Superfluous since you fill both width and height?
143 if (source === mpris2Source.multiplexSource) { ​
144 continue ​
145 } ​
146 139​
147 // we could show the pretty player name ("Identity") here but then we 140​ Image {
148 // would have to connect all sources just for this 141​ id: backgroundImage
149 model.push({text: source, source: source}) ​
150 } ​
151 142​
152 return model 143​ source: root.albumArt
153 } 144​ sourceSize.width: 512 /*
145​ * Setting a sourceSize.width here
146​ * prevents flickering when resizing the
147​ * plasmoid on a desktop.
148​ */
149​
broulikUnsubmitted
Done

Do you have a source for this claim? From what I know blur merely blurs the actual item texture which is rendered, no the raw image source?

broulik: Do you have a source for this claim? From what I know blur merely blurs the actual item texture…
cblackAuthorUnsubmitted
Done

https://github.com/qt/qtdeclarative/blob/9893e71cea5de10193376c1733db627ef0783614/src/quick/items/qquickimage.cpp#L600-L603

cblack: https://github.
davidedmundsonUnsubmitted
Done

That says the opposite of what you want.

We want image's texture provider to be used directly. Only then will this sourcesize matter.

This is saying when layer effect is enabled it uses the base blitting path.

We don't want to use layer here, we want the image as a source to the blur directly

davidedmundson: That says the opposite of what you want. We want image's texture provider to be used directly.
150​ anchors.fill: parent
151​ anchors.margins: -units.smallSpacing*2
152​ fillMode: Image.PreserveAspectCrop
153​
154​ asynchronous: true
155​ visible: !!root.track && status === Image.Ready && !softwareRendering
156​
157​ layer.enabled: !softwareRendering
158​ layer.effect: HueSaturation {
159​ cached: true
160​
161​ lightness: -0.5
162​ saturation: 0.9
163​
164​ layer.enabled: true
165​ layer.effect: GaussianBlur {
166​ cached: true
154 167​
155 onModelChanged: { 168​ radius: 256
156 // if model changes, ComboBox resets, so we try to find the current player again... 169​ deviation: 12
157 for (var i = 0, length = model.length; i < length; ++i) { 170​ samples: 129
158 if (model[i].source === mpris2Source.current) { 171​
159 currentIndex = i 172​ transparentBorder: false
160 break ​
161 } 173​ }
162 } 174​ }
163 } 175​ }
176​ RowLayout { // Album Art + Details
177​ id: albumRow
178​ spacing: units.largeSpacing
164 179​
165 onActivated: { 180​ anchors.fill: parent
166 disablePositionUpdate = true ​
167 // ComboBox has currentIndex and currentText, why doesn't it have currentItem/currentModelValue? ​
168 mpris2Source.current = model[index].source ​
169 disablePositionUpdate = false ​
170 } ​
171 } ​
172 181​
173 Item { 182​ Item {
183​ Layout.fillWidth: true
184​ Layout.fillHeight: true
185​ Layout.preferredWidth: 50
186​
187​ visible: albumArt.visible || !!mpris2Source.currentData["Desktop Icon Name"]
188​
189​ Image { // Album Art
190​ id: albumArt
191​
174 anchors { 192​ anchors {
175 horizontalCenter: parent.horizontalCenter 193​ fill: parent
ngrahamUnsubmitted
Done

whitespace

ngraham: whitespace
cblackAuthorUnsubmitted
Done

Whitespace is intentional to help with code legibility

cblack: Whitespace is intentional to help with code legibility
176 top: playerCombo.bottom ​
177 bottom: controlCol.top ​
178 margins: units.smallSpacing 194​ margins: units.smallSpacing
179 } 195​ }
ngrahamUnsubmitted
Done

whitespace

ngraham: whitespace
180 196​
broulikUnsubmitted
Done

Does assigning undefined work? I don't see a RESET property for it. Probably want to assign color scope text color instead?

broulik: Does assigning `undefined` work? I don't see a `RESET` property for it. Probably want to assign…
181 PlasmaCore.IconItem { 197​ visible: !!root.track && status === Image.Ready
198​
199​ asynchronous: true
200​
201​ horizontalAlignment: Image.AlignRight
202​ verticalAlignment: Image.AlignVCenter
203​ fillMode: Image.PreserveAspectFit
gvgeoUnsubmitted
Done

You are limiting Details Column's width, while Album Art is not always visible.

gvgeo: You are limiting `Details Column`'s width, while `Album Art` is not always visible.
broulikUnsubmitted
Done

Make sure to Math.round random factors of a size

broulik: Make sure to `Math.round` random factors of a size
204​
205​ source: root.albumArt
ngrahamUnsubmitted
Done

Is a hardcoded white color always guaranteed to look good even when the album art is very light? Is the blurred background always going to be dark enough?

ngraham: Is a hardcoded white color always guaranteed to look good even when the album art is very light?
cblackAuthorUnsubmitted
Done

cblack: {F8085988}
ngrahamUnsubmitted
Done

All right, looks good!

ngraham: All right, looks good!
gvgeoUnsubmitted
Done

With a white theme?

gvgeo: With a white theme?
206​ }
ngrahamUnsubmitted
Done

I think that's the default, no?

ngraham: I think that's the default, no?
207​
208​ PlasmaCore.IconItem { // Fallback
209​ visible: !albumArt.visible && !!mpris2Source.currentData["Desktop Icon Name"]
210​ source: mpris2Source.currentData["Desktop Icon Name"]
211​
182 anchors { 212​ anchors {
183 horizontalCenter: parent.horizontalCenter 213​ fill: parent
184 verticalCenter: parent.verticalCenter 214​ margins: units.smallSpacing
185 } 215​ }
186 216​
187 height: Math.round(parent.height / 2) ​
188 width: height ​
189 217​
190 source: mpris2Source.currentData["Desktop Icon Name"] 218​ }
191 visible: !albumArt.visible 219​ }
220​
221​ ColumnLayout { // Details Column
222​ Layout.fillWidth: true
223​ Layout.fillHeight: true
224​ Layout.preferredWidth: 50
225​ Layout.alignment: !(albumArt.visible || !!mpris2Source.currentData["Desktop Icon Name"]) ? Qt.AlignHCenter : 0
226​
227​ /*
228​ * We use Kirigami.Heading instead of PlasmaExtras.Heading
229​ * to prevent a binding loop caused by the PC2 Label component
230​ * used by PlasmaExtras.Heading
231​ */
232​ Kirigami.Heading { // Song Title
233​ id: songTitle
234​ level: 1
235​
236​ color: (softwareRendering || !albumArt.visible) ? PlasmaCore.ColorScope.textColor : "white"
237​
238​ textFormat: Text.PlainText
239​ wrapMode: Text.Wrap
240​ fontSizeMode: Text.VerticalFit
241​
242​ text: root.track || i18n("No media playing")
192 243​
193 usesPlasmaTheme: false 244​ Layout.fillWidth: true
245​ Layout.maximumHeight: units.gridUnit*5
194 } 246​ }
247​ Kirigami.Heading { // Song Artist
248​ id: songArtist
249​ visible: root.track && root.artist
250​ level: 2
251​
252​ color: (softwareRendering || !albumArt.visible) ? PlasmaCore.ColorScope.textColor : "white"
253​
254​ textFormat: Text.PlainText
255​ wrapMode: Text.Wrap
256​ fontSizeMode: Text.VerticalFit
257​
258​ text: root.artist
259​ Layout.fillWidth: true
260​ Layout.maximumHeight: units.gridUnit*2
195 } 261​ }
262​ Kirigami.Heading { // Song Album
263​ color: (softwareRendering || !albumArt.visible) ? PlasmaCore.ColorScope.textColor : "white"
196 264​
197 Image { 265​ level: 3
198 id: albumArt 266​ opacity: 0.6
199 anchors { 267​
200 left: parent.left 268​ textFormat: Text.PlainText
201 right: parent.right 269​ wrapMode: Text.Wrap
202 top: playerCombo.bottom 270​ fontSizeMode: Text.VerticalFit
203 bottom: controlCol.top 271​
204 margins: units.smallSpacing 272​ visible: text.length !== 0
273​ text: {
274​ var metadata = root.currentMetadata
275​ if (!metadata) {
276​ return ""
205 } 277​ }
206 source: root.albumArt 278​ var xesamAlbum = metadata["xesam:album"]
207 asynchronous: true 279​ if (xesamAlbum) {
208 fillMode: Image.PreserveAspectFit 280​ return xesamAlbum
209 sourceSize: Qt.size(height, height) ​
210 visible: !!root.track && status === Image.Ready ​
211 } 281​ }
212 282​
213 Column { 283​ // if we play a local file without title and artist, show its containing folder instead
214 id: controlCol 284​ if (metadata["xesam:title"] || root.artist) {
215 width: parent.width 285​ return ""
216 anchors.bottom: parent.bottom 286​ }
217 287​
218 spacing: units.smallSpacing 288​ var xesamUrl = (metadata["xesam:url"] || "").toString()
289​ if (xesamUrl.indexOf("file:///") !== 0) { // "!startsWith()"
290​ return ""
291​ }
219 292​
ngrahamUnsubmitted
Done

there's a massive binding loop somewhere here:

file:///home/nate/kde/usr/share/plasma/plasmoids/org.kde.plasma.mediacontroller/contents/ui/ExpandedRepresentation.qml:261:21: QML Heading: Binding loop detected for property "height"
ngraham: there's a massive binding loop somewhere here: ``` file…
cblackAuthorUnsubmitted
Done

I can't seem to reproduce a binding loop here.

cblack: I can't seem to reproduce a binding loop here.
kmaterkaUnsubmitted
Done

I have not seen your code yet, I will check tomorrow. Probably because you have something like this:

Layout.preferredWidth: parent.width / 2
Layout.preferredHeight: parent.height / 2

Check the last answer from: How to design a multi-level fluid layout in QML. In short words: when possible, do not use Layout.preferredWidth, prefer implicitWidth instead. If you want to have 50-50 ratio between items, set implicitWidth in both items to the same value.

kmaterka: I have not seen your code yet, I will check tomorrow. Probably because you have something like…
kmaterkaUnsubmitted
Done

My last comment was not precise. Just check this for all details :)

kmaterka: My last comment was not precise. Just check [[ https://stackoverflow.com/a/52754479 | this ]]…
kmaterkaUnsubmitted
Done

As a general rule, you shouldn't refer to parents width in Layouts, including: Layout.maximumWidth: parent.width. It a (very) common mistake :)

kmaterka: As a general rule, you shouldn't refer to parents width in Layouts, including: `Layout.
cblackAuthorUnsubmitted
Done

This advice doesn't seem to be applicable here, as the implicitWidth of the ColumnLayout child isn't able to be mutated due to the fact that all of its child items (text) have fixed implicitWidths.

cblack: This advice doesn't seem to be applicable here, as the `implicitWidth` of the ColumnLayout…
kmaterkaUnsubmitted
Done

True, I didn't want to copy whole answer from Stack Overflow :) In this case Layout.preferredWidth should not be set to parent.width / 2, better to use Layout.preferredWidth = 50. I sometimes add % in a comment: Layout.preferredWidth = 50//%.

kmaterka: True, I didn't want to copy whole answer from Stack Overflow :) In this case `Layout.
220 RowLayout { 293​ var urlParts = xesamUrl.split("/")
221 anchors { 294​ if (urlParts.length < 3) {
222 left: parent.left 295​ return ""
223 right: parent.right ​
224 margins: units.smallSpacing ​
225 } 296​ }
226 297​
298​ var lastFolderPath = urlParts[urlParts.length - 2] // last would be filename
299​ if (lastFolderPath) {
300​ return lastFolderPath
301​ }
302​
303​ return ""
304​ }
305​ Layout.fillWidth: true
306​ Layout.maximumHeight: units.gridUnit*2
307​ }
308​ }
309​ }
310​ }
311​
312​ RowLayout { // Seek Bar
227 spacing: units.smallSpacing 313​ spacing: units.smallSpacing
228 314​
ngrahamUnsubmitted
Done

text.length !== 0 is a bit faster

ngraham: `text.length !== 0` is a bit faster
229 // if there's no "mpris:length" in the metadata, we cannot seek, so hide it in that case 315​ // if there's no "mpris:length" in the metadata, we cannot seek, so hide it in that case
230 enabled: !root.noPlayer && root.track && expandedRepresentation.length > 0 ? true : false 316​ enabled: !root.noPlayer && root.track && expandedRepresentation.length > 0 ? true : false
231 opacity: enabled ? 1 : 0 317​ opacity: enabled ? 1 : 0
232 Behavior on opacity { 318​ Behavior on opacity {
233 NumberAnimation { duration: units.longDuration } 319​ NumberAnimation { duration: units.longDuration }
234 } 320​ }
235 321​
322​ Layout.alignment: Qt.AlignHCenter
323​ Layout.fillWidth: true
324​ Layout.maximumWidth: Math.min(units.gridUnit*45, Math.round(expandedRepresentation.width*(7/10)))
ngrahamUnsubmitted
Done

If the user does something a bit silly like making the applet as big as the whole screen, they might prefer if the seek bar is really long

ngraham: If the user does something a bit silly like making the applet as big as the whole screen, they…
broulikUnsubmitted
Done

No magic numbers, please

broulik: No magic numbers, please
325​
236 // ensure the layout doesn't shift as the numbers change and measure roughly the longest text that could occur with the current song 326​ // ensure the layout doesn't shift as the numbers change and measure roughly the longest text that could occur with the current song
237 TextMetrics { 327​ TextMetrics {
238 id: timeMetrics 328​ id: timeMetrics
239 text: i18nc("Remaining time for song e.g -5:42", "-%1", 329​ text: i18nc("Remaining time for song e.g -5:42", "-%1",
240 KCoreAddons.Format.formatDuration(seekSlider.to / 1000, expandedRepresentation.durationFormattingOptions)) 330​ KCoreAddons.Format.formatDuration(seekSlider.to / 1000, expandedRepresentation.durationFormattingOptions))
241 font: theme.smallestFont 331​ font: theme.smallestFont
242 } 332​ }
243 333​
244 PlasmaComponents3.Label { 334​ PlasmaComponents3.Label { // Time Elapsed
245 Layout.preferredWidth: timeMetrics.width 335​ Layout.preferredWidth: timeMetrics.width
246 verticalAlignment: Text.AlignVCenter 336​ verticalAlignment: Text.AlignVCenter
247 horizontalAlignment: Text.AlignRight 337​ horizontalAlignment: Text.AlignRight
248 text: KCoreAddons.Format.formatDuration(seekSlider.value / 1000, expandedRepresentation.durationFormattingOptions) 338​ text: KCoreAddons.Format.formatDuration(seekSlider.value / 1000, expandedRepresentation.durationFormattingOptions)
249 opacity: 0.9 339​ opacity: 0.9
250 font: theme.smallestFont 340​ font: theme.smallestFont
341​ color: PlasmaCore.ColorScope.textColor
broulikUnsubmitted
Done

The labels are shown outside the album art, so they are unreadable now

broulik: The labels are shown outside the album art, so they are unreadable now
251 } 342​ }
252 343​
253 PlasmaComponents3.Slider { 344​ PlasmaComponents3.Slider { // Slider
254 id: seekSlider 345​ id: seekSlider
255 Layout.fillWidth: true 346​ Layout.fillWidth: true
256 z: 999 347​ z: 999
257 value: 0 348​ value: 0
258 visible: canSeek 349​ visible: canSeek
259 350​
260 onMoved: { 351​ onMoved: {
261 if (!disablePositionUpdate) { 352​ if (!disablePositionUpdate) {
Show All 18 Lines370 } else {
280 seekSlider.value += 1000000 371​ seekSlider.value += 1000000
281 } 372​ }
282 disablePositionUpdate = false 373​ disablePositionUpdate = false
283 } 374​ }
284 } 375​ }
285 } 376​ }
286 } 377​ }
287 378​
288 PlasmaComponents3.ProgressBar { 379​ PlasmaComponents3.ProgressBar { // Time Remaining
289 Layout.fillWidth: true 380​ Layout.fillWidth: true
381​ Layout.preferredHeight: seekSlider.height
290 value: seekSlider.value 382​ value: seekSlider.value
291 from: seekSlider.from 383​ from: seekSlider.from
292 to: seekSlider.to 384​ to: seekSlider.to
293 visible: !canSeek 385​ visible: !canSeek
294 } 386​ }
295 387​
296 PlasmaComponents3.Label { 388​ PlasmaComponents3.Label {
297 Layout.preferredWidth: timeMetrics.width 389​ Layout.preferredWidth: timeMetrics.width
298 verticalAlignment: Text.AlignVCenter 390​ verticalAlignment: Text.AlignVCenter
299 horizontalAlignment: Text.AlignLeft 391​ horizontalAlignment: Text.AlignLeft
300 text: i18nc("Remaining time for song e.g -5:42", "-%1", 392​ text: i18nc("Remaining time for song e.g -5:42", "-%1",
301 KCoreAddons.Format.formatDuration((seekSlider.to - seekSlider.value) / 1000, expandedRepresentation.durationFormattingOptions)) 393​ KCoreAddons.Format.formatDuration((seekSlider.to - seekSlider.value) / 1000, expandedRepresentation.durationFormattingOptions))
302 opacity: 0.9 394​ opacity: 0.9
303 font: theme.smallestFont 395​ font: theme.smallestFont
396​ color: PlasmaCore.ColorScope.textColor
304 } 397​ }
305 } 398​ }
306 399​
307 Column { 400​ Row { // Player Controls
308 width: parent.width ​
309 ​
310 PlasmaExtras.Heading { ​
311 id: song ​
312 width: parent.width ​
313 height: undefined ​
314 level: 4 ​
315 horizontalAlignment: Text.AlignHCenter ​
316 ​
317 maximumLineCount: 1 ​
318 elide: Text.ElideRight ​
319 text: { ​
320 if (!root.track) { ​
321 return i18n("No media playing") ​
322 } ​
323 return root.artist ? i18nc("artist – track", "%1 – %2", root.artist, root.track) : root.track ​
324 } ​
325 textFormat: Text.PlainText ​
326 } ​
327 ​
328 PlasmaExtras.Heading { ​
329 width: parent.width ​
330 height: undefined ​
331 level: 5 ​
332 opacity: 0.6 ​
333 horizontalAlignment: Text.AlignHCenter ​
334 wrapMode: Text.NoWrap ​
335 elide: Text.ElideRight ​
336 visible: text !== "" ​
337 text: { ​
338 var metadata = root.currentMetadata ​
339 if (!metadata) { ​
340 return "" ​
341 } ​
342 var xesamAlbum = metadata["xesam:album"] ​
343 if (xesamAlbum) { ​
344 return xesamAlbum ​
345 } ​
346 ​
347 // if we play a local file without title and artist, show its containing folder instead ​
348 if (metadata["xesam:title"] || root.artist) { ​
349 return "" ​
350 } ​
351 ​
352 var xesamUrl = (metadata["xesam:url"] || "").toString() ​
353 if (xesamUrl.indexOf("file:///") !== 0) { // "!startsWith()" ​
354 return "" ​
355 } ​
356 ​
357 var urlParts = xesamUrl.split("/") ​
358 if (urlParts.length < 3) { ​
359 return "" ​
360 } ​
361 ​
362 var lastFolderPath = urlParts[urlParts.length - 2] // last would be filename ​
363 if (lastFolderPath) { ​
364 return lastFolderPath ​
365 } ​
366 ​
367 return "" ​
368 } ​
369 textFormat: Text.PlainText ​
370 } ​
371 } ​
372 ​
373 Item { ​
374 width: parent.width ​
375 height: playerControls.height ​
376 ​
377 Row { ​
378 id: playerControls 401​ id: playerControls
402​
379 property bool enabled: root.canControl 403​ property bool enabled: root.canControl
380 property int controlsSize: theme.mSize(theme.defaultFont).height * 3 404​ property int controlsSize: theme.mSize(theme.defaultFont).height * 3
381 405​
382 anchors.horizontalCenter: parent.horizontalCenter 406​ Layout.alignment: Qt.AlignHCenter
383 spacing: units.largeSpacing 407​ spacing: units.largeSpacing
384 408​
385 PlasmaComponents3.ToolButton { 409​ PlasmaComponents3.ToolButton { // Previous
386 anchors.verticalCenter: parent.verticalCenter 410​ anchors.verticalCenter: parent.verticalCenter
387 width: expandedRepresentation.controlSize 411​ width: expandedRepresentation.controlSize
388 height: width 412​ height: width
389 enabled: playerControls.enabled && root.canGoPrevious 413​ enabled: playerControls.enabled && root.canGoPrevious
390 icon.name: LayoutMirroring.enabled ? "media-skip-forward" : "media-skip-backward" 414​ icon.name: LayoutMirroring.enabled ? "media-skip-forward" : "media-skip-backward"
391 onClicked: { 415​ onClicked: {
392 seekSlider.value = 0 // Let the media start from beginning. Bug 362473 416​ seekSlider.value = 0 // Let the media start from beginning. Bug 362473
393 root.action_previous() 417​ root.action_previous()
394 } 418​ }
395 } 419​ }
396 420​
397 PlasmaComponents3.ToolButton { 421​ PlasmaComponents3.ToolButton { // Pause/Play
398 width: Math.round(expandedRepresentation.controlSize * 1.5) 422​ width: Math.round(expandedRepresentation.controlSize * 1.5)
399 height: width 423​ height: width
400 enabled: root.state == "playing" ? root.canPause : root.canPlay 424​ enabled: root.state == "playing" ? root.canPause : root.canPlay
401 icon.name: root.state == "playing" ? "media-playback-pause" : "media-playback-start" 425​ icon.name: root.state == "playing" ? "media-playback-pause" : "media-playback-start"
402 onClicked: root.togglePlaying() 426​ onClicked: root.togglePlaying()
403 } 427​ }
404 428​
405 PlasmaComponents3.ToolButton { 429​ PlasmaComponents3.ToolButton { // Next
406 anchors.verticalCenter: parent.verticalCenter 430​ anchors.verticalCenter: parent.verticalCenter
407 width: expandedRepresentation.controlSize 431​ width: expandedRepresentation.controlSize
408 height: width 432​ height: width
409 enabled: playerControls.enabled && root.canGoNext 433​ enabled: playerControls.enabled && root.canGoNext
410 icon.name: LayoutMirroring.enabled ? "media-skip-backward" : "media-skip-forward" 434​ icon.name: LayoutMirroring.enabled ? "media-skip-backward" : "media-skip-forward"
411 onClicked: { 435​ onClicked: {
412 seekSlider.value = 0 // Let the media start from beginning. Bug 362473 436​ seekSlider.value = 0 // Let the media start from beginning. Bug 362473
413 root.action_next() 437​ root.action_next()
414 } 438​ }
415 } 439​ }
416 } 440​ }
441​
442​ PlasmaComponents3.ToolButton {
443​ id: playerSelector
444​
445​ visible: tabButtonInstantiator.model.length > 2 // more than one player, @multiplex is always there
446​
447​ onClicked: menu.open()
448​
449​ text: mpris2Source.current === mpris2Source.multiplexSource ? i18n("Choose player automatically") : mpris2Source.currentData["Identity"]
450​
451​ PlasmaComponents3.Menu {
452​ id: menu
453​ }
davidedmundsonUnsubmitted
Done

Items in a layout shouldn't specify a width

davidedmundson: Items in a layout shouldn't specify a width
454​
455​ Instantiator {
456​ id: tabButtonInstantiator
457​
458​ model: mprisSourcesModel
459​
460​ onObjectAdded: { menu.insertItem(index, object) }
461​ onObjectRemoved: { menu.removeItem(object) }
462​
463​ delegate: PlasmaComponents3.MenuItem {
464​ text: modelData["text"]
465​ onTriggered: {
466​ mpris2Source.current = modelData["source"]
467​ }
468​ }
469​ }
417 } 470​ }
418 } 471​ }
419 472​
420 Timer { 473​ Timer {
421 id: queuedPositionUpdate 474​ id: queuedPositionUpdate
422 interval: 100 475​ interval: 100
423 onTriggered: { 476​ onTriggered: {
424 if (position == seekSlider.value) { 477​ if (position == seekSlider.value) {
Show All 9 Lines