Changeset View
Changeset View
Standalone View
Standalone View
src/qml/ContextView.qml
Show All 9 Lines | |||||
10 | * but WITHOUT ANY WARRANTY; without even the implied warranty of | 10 | * but WITHOUT ANY WARRANTY; without even the implied warranty of | ||
11 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU | 11 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU | ||
12 | * Lesser General Public License for more details. | 12 | * Lesser General Public License for more details. | ||
13 | * | 13 | * | ||
14 | * You should have received a copy of the GNU Lesser General Public License | 14 | * You should have received a copy of the GNU Lesser General Public License | ||
15 | * along with this program. If not, see <https://www.gnu.org/licenses/>. | 15 | * along with this program. If not, see <https://www.gnu.org/licenses/>. | ||
16 | */ | 16 | */ | ||
17 | 17 | | |||
18 | import QtQuick 2.7 | 18 | import QtQuick 2.10 | ||
19 | import QtQuick.Window 2.2 | 19 | import QtQuick.Window 2.2 | ||
20 | import QtQuick.Controls 2.2 | 20 | import QtQuick.Controls 2.2 | ||
21 | import QtQml.Models 2.2 | 21 | import QtQml.Models 2.2 | ||
22 | import org.kde.elisa 1.0 | | |||
23 | import QtQuick.Layouts 1.2 | 22 | import QtQuick.Layouts 1.2 | ||
24 | 23 | | |||
25 | Item { | 24 | import org.kde.elisa 1.0 | ||
25 | | ||||
26 | FocusScope { | ||||
26 | id: topItem | 27 | id: topItem | ||
27 | 28 | | |||
28 | property var albumName | 29 | property int databaseId: 0 | ||
29 | property var artistName | 30 | property alias title: titleLabel.text | ||
30 | property var tracksCount | 31 | property string albumName: '' | ||
31 | property var albumArtUrl | 32 | property string artistName: '' | ||
33 | property url albumArtUrl: '' | ||||
34 | property string fileUrl: '' | ||||
35 | | ||||
36 | TrackContextMetaDataModel { | ||||
37 | id: metaDataModel | ||||
38 | | ||||
39 | manager: elisa.musicManager | ||||
40 | } | ||||
32 | 41 | | |||
33 | ColumnLayout { | 42 | ColumnLayout { | ||
34 | anchors.fill: parent | 43 | anchors.fill: parent | ||
35 | 44 | | |||
36 | spacing: 0 | 45 | spacing: 0 | ||
37 | 46 | | |||
38 | Item { | 47 | TextMetrics { | ||
39 | Layout.fillHeight: true | 48 | id: titleHeight | ||
49 | text: viewTitleHeight.text | ||||
50 | font | ||||
51 | { | ||||
52 | pointSize: viewTitleHeight.font.pointSize | ||||
53 | bold: viewTitleHeight.font.bold | ||||
54 | } | ||||
55 | } | ||||
56 | | ||||
57 | LabelWithToolTip { | ||||
58 | id: viewTitleHeight | ||||
59 | text: i18nc("Title of the context view related to the currently playing track", "Now Playing") | ||||
60 | | ||||
61 | font.pointSize: elisaTheme.defaultFontPointSize * 2 | ||||
62 | | ||||
63 | Layout.alignment: Qt.AlignLeft | Qt.AlignTop | ||||
64 | Layout.topMargin: elisaTheme.layoutVerticalMargin * 3 | ||||
65 | Layout.bottomMargin: titleHeight.height | ||||
40 | } | 66 | } | ||
41 | 67 | | |||
42 | Image { | 68 | Image { | ||
43 | id: albumIcon | 69 | id: albumIcon | ||
44 | 70 | | |||
45 | source: albumArtUrl.toString() === '' ? Qt.resolvedUrl(elisaTheme.defaultAlbumImage) : albumArtUrl | 71 | source: albumArtUrl.toString() === '' ? Qt.resolvedUrl(elisaTheme.defaultAlbumImage) : albumArtUrl | ||
46 | Layout.preferredWidth: elisaTheme.coverImageSize | 72 | | ||
47 | Layout.preferredHeight: elisaTheme.coverImageSize | 73 | Layout.fillWidth: true | ||
48 | Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter | 74 | Layout.maximumHeight: elisaTheme.contextCoverImageSize | ||
49 | Layout.maximumWidth: elisaTheme.coverImageSize | 75 | Layout.preferredHeight: elisaTheme.contextCoverImageSize | ||
50 | Layout.maximumHeight: elisaTheme.coverImageSize | 76 | | ||
51 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | 77 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | ||
52 | 78 | | |||
53 | width: elisaTheme.coverImageSize | 79 | width: elisaTheme.contextCoverImageSize | ||
54 | height: elisaTheme.coverImageSize | 80 | height: elisaTheme.contextCoverImageSize | ||
55 | 81 | | |||
56 | sourceSize.width: elisaTheme.coverImageSize | 82 | sourceSize.width: parent.width | ||
57 | sourceSize.height: elisaTheme.coverImageSize | 83 | sourceSize.height: elisaTheme.contextCoverImageSize | ||
58 | 84 | | |||
59 | asynchronous: true | 85 | asynchronous: true | ||
60 | 86 | | |||
61 | fillMode: Image.PreserveAspectFit | 87 | fillMode: Image.PreserveAspectCrop | ||
62 | } | 88 | } | ||
63 | 89 | | |||
64 | LabelWithToolTip { | 90 | LabelWithToolTip { | ||
65 | id: titleLabel | 91 | id: titleLabel | ||
66 | 92 | | |||
67 | text: if (albumName !== undefined) | 93 | font.pointSize: elisaTheme.defaultFontPointSize * 2 | ||
68 | albumName | | |||
69 | else | | |||
70 | '' | | |||
71 | | ||||
72 | font.weight: Font.Bold | 94 | font.weight: Font.Bold | ||
73 | color: myPalette.text | | |||
74 | 95 | | |||
75 | horizontalAlignment: Text.AlignHCenter | 96 | Layout.alignment: Qt.AlignLeft | Qt.AlignTop | ||
97 | Layout.topMargin: elisaTheme.layoutVerticalMargin | ||||
76 | 98 | | |||
77 | Layout.fillWidth: true | 99 | elide: Text.ElideRight | ||
78 | Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom | 100 | } | ||
101 | | ||||
102 | LabelWithToolTip { | ||||
103 | id: albumArtistLabel | ||||
104 | | ||||
105 | text: (artistName && albumName ? i18nc('display of artist and album in context view', '<i>by</i> <b>%1</b> <i>from</i> <b>%2</b>', artistName, albumName) : '') | ||||
106 | | ||||
107 | font.pointSize: elisaTheme.defaultFontPointSize * 1.4 | ||||
108 | | ||||
109 | visible: artistName !== '' && albumName !== '' | ||||
110 | | ||||
111 | Layout.alignment: Qt.AlignLeft | Qt.AlignTop | ||||
79 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | 112 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | ||
80 | 113 | | |||
81 | elide: Text.ElideRight | 114 | elide: Text.ElideRight | ||
82 | } | 115 | } | ||
83 | 116 | | |||
84 | LabelWithToolTip { | 117 | LabelWithToolTip { | ||
85 | id: artistLabel | 118 | id: albumLabel | ||
86 | 119 | | |||
87 | text: if (artistName !== undefined) | 120 | text: (albumName ? i18nc('display of album in context view', '<i>from</i> <b>%1</b>', albumName) : '') | ||
88 | artistName | | |||
89 | else | | |||
90 | '' | | |||
91 | 121 | | |||
92 | font.weight: Font.Normal | 122 | font.pointSize: elisaTheme.defaultFontPointSize * 1.4 | ||
93 | color: myPalette.text | | |||
94 | 123 | | |||
95 | horizontalAlignment: Text.AlignHCenter | 124 | visible: artistName === '' && albumName !== '' | ||
96 | 125 | | |||
97 | Layout.fillWidth: true | 126 | Layout.alignment: Qt.AlignLeft | Qt.AlignTop | ||
98 | Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom | 127 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | ||
99 | 128 | | |||
100 | elide: Text.ElideRight | 129 | elide: Text.ElideRight | ||
101 | } | 130 | } | ||
102 | 131 | | |||
103 | LabelWithToolTip { | 132 | LabelWithToolTip { | ||
104 | id: numberLabel | 133 | id: artistLabel | ||
105 | | ||||
106 | text: i18np("1 track", "%1 track", tracksCount) | | |||
107 | 134 | | |||
108 | visible: tracksCount !== undefined | 135 | text: (artistName ? i18nc('display of artist in context view', '<i>by</i> <b>%1</b>', artistName) : '') | ||
109 | 136 | | |||
110 | font.weight: Font.Light | 137 | font.pointSize: elisaTheme.defaultFontPointSize * 1.4 | ||
111 | color: myPalette.text | | |||
112 | 138 | | |||
113 | horizontalAlignment: Text.AlignHCenter | 139 | visible: artistName !== '' && albumName === '' | ||
114 | 140 | | |||
115 | Layout.fillWidth: true | 141 | Layout.alignment: Qt.AlignLeft | Qt.AlignTop | ||
116 | Layout.alignment: Qt.AlignHCenter | Qt.AlignBottom | | |||
117 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | 142 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | ||
118 | 143 | | |||
119 | elide: Text.ElideRight | 144 | elide: Text.ElideRight | ||
120 | } | 145 | } | ||
121 | 146 | | |||
147 | Repeater { | ||||
148 | model: metaDataModel | ||||
149 | | ||||
150 | delegate: MetaDataDelegate { | ||||
151 | } | ||||
152 | } | ||||
153 | | ||||
122 | Item { | 154 | Item { | ||
123 | Layout.fillHeight: true | 155 | Layout.fillHeight: true | ||
124 | } | 156 | } | ||
125 | 157 | | |||
126 | RowLayout { | 158 | Row { | ||
127 | Layout.fillWidth: true | 159 | Layout.alignment: Qt.AlignLeft | Qt.AlignBottom | ||
128 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin * 2 | 160 | Layout.topMargin: elisaTheme.layoutVerticalMargin | ||
161 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | ||||
129 | 162 | | |||
130 | spacing: 0 | 163 | spacing: elisaTheme.layoutHorizontalMargin | ||
131 | 164 | | |||
132 | Image { | 165 | Image { | ||
133 | id: artistJumpIcon | 166 | sourceSize.width: fileNameLabel.height | ||
134 | 167 | sourceSize.height: fileNameLabel.height | |||
135 | source: Qt.resolvedUrl(elisaTheme.defaultArtistImage) | | |||
136 | 168 | | |||
137 | Layout.preferredWidth: elisaTheme.smallImageSize | 169 | source: elisaTheme.folderIcon | ||
138 | Layout.preferredHeight: elisaTheme.smallImageSize | 170 | } | ||
139 | Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter | | |||
140 | Layout.maximumWidth: elisaTheme.smallImageSize | | |||
141 | Layout.maximumHeight: elisaTheme.smallImageSize | | |||
142 | Layout.leftMargin: !LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0 | | |||
143 | Layout.rightMargin: LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0 | | |||
144 | 171 | | |||
145 | visible: artistName !== undefined | 172 | LabelWithToolTip { | ||
146 | width: elisaTheme.smallImageSize | 173 | id: fileNameLabel | ||
147 | height: elisaTheme.smallImageSize | | |||
148 | 174 | | |||
149 | sourceSize.width: elisaTheme.smallImageSize | 175 | text: fileUrl | ||
150 | sourceSize.height: elisaTheme.smallImageSize | | |||
151 | 176 | | |||
152 | fillMode: Image.PreserveAspectFit | 177 | elide: Text.ElideRight | ||
178 | } | ||||
179 | } | ||||
153 | } | 180 | } | ||
154 | 181 | | |||
155 | LabelWithToolTip { | 182 | onDatabaseIdChanged: { | ||
156 | text: if (artistName !== undefined) | 183 | metaDataModel.initializeByTrackId(databaseId) | ||
157 | artistName | 184 | } | ||
158 | else | | |||
159 | '' | | |||
160 | 185 | | |||
161 | font.weight: Font.Normal | 186 | Connections { | ||
162 | color: myPalette.text | 187 | target: elisa | ||
163 | 188 | | |||
164 | horizontalAlignment: Text.AlignLeft | 189 | onMusicManagerChanged: { | ||
190 | metaDataModel.initializeByTrackId(databaseId) | ||||
191 | } | ||||
165 | } | 192 | } | ||
193 | | ||||
194 | Component.onCompleted: { | ||||
195 | if (elisa.musicManager) { | ||||
196 | metaDataModel.initializeByTrackId(databaseId) | ||||
166 | } | 197 | } | ||
167 | } | 198 | } | ||
168 | } | 199 | } |