Changeset View
Changeset View
Standalone View
Standalone View
src/qml/ContextView.qml
Show First 20 Lines • Show All 84 Lines • ▼ Show 20 Line(s) | 83 | ScrollBar.vertical: ScrollBar { | |||
---|---|---|---|---|---|
85 | policy: ScrollBar.AlwaysOn | 85 | policy: ScrollBar.AlwaysOn | ||
86 | } | 86 | } | ||
87 | 87 | | |||
88 | // Album Art + title + metadata + lyrics | 88 | // Album Art + title + metadata + lyrics | ||
89 | ColumnLayout { | 89 | ColumnLayout { | ||
90 | id: content | 90 | id: content | ||
91 | 91 | | |||
92 | width: topItem.width | 92 | width: topItem.width | ||
93 | anchors.leftMargin: elisaTheme.layoutHorizontalMargin | ||||
94 | anchors.rightMargin: elisaTheme.layoutHorizontalMargin | ||||
93 | 95 | | |||
94 | // Album art slice | 96 | // Album art slice | ||
95 | Image { | 97 | Image { | ||
96 | id: albumIcon | 98 | id: albumIcon | ||
97 | source: albumArtUrl.toString() === '' ? Qt.resolvedUrl(elisaTheme.defaultAlbumImage) : albumArtUrl | 99 | source: albumArtUrl.toString() === '' ? Qt.resolvedUrl(elisaTheme.defaultAlbumImage) : albumArtUrl | ||
98 | 100 | | |||
99 | Layout.maximumHeight: elisaTheme.contextCoverImageSize | 101 | Layout.maximumHeight: elisaTheme.contextCoverImageSize | ||
100 | Layout.preferredHeight: elisaTheme.contextCoverImageSize | 102 | Layout.preferredHeight: elisaTheme.contextCoverImageSize | ||
101 | Layout.fillWidth: true | 103 | Layout.fillWidth: true | ||
102 | Layout.leftMargin: elisaTheme.layoutHorizontalMargin | | |||
103 | Layout.rightMargin: elisaTheme.layoutHorizontalMargin | | |||
104 | Layout.topMargin: elisaTheme.layoutVerticalMargin | | |||
105 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | 104 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | ||
106 | 105 | | |||
106 | // Touch the sides of the scrollview | ||||
107 | Layout.leftMargin: -elisaTheme.layoutHorizontalMargin | ||||
108 | Layout.rightMargin: -elisaTheme.layoutHorizontalMargin | ||||
109 | | ||||
107 | sourceSize.width: topItem.width | 110 | sourceSize.width: topItem.width | ||
108 | sourceSize.height: topItem.width | 111 | sourceSize.height: topItem.width | ||
109 | 112 | | |||
110 | asynchronous: true | 113 | asynchronous: true | ||
111 | 114 | | |||
112 | fillMode: Image.PreserveAspectCrop | 115 | fillMode: Image.PreserveAspectCrop | ||
113 | } | 116 | } | ||
114 | 117 | | |||
115 | // Song title | 118 | // Song title | ||
116 | LabelWithToolTip { | 119 | LabelWithToolTip { | ||
117 | id: titleLabel | 120 | id: titleLabel | ||
118 | 121 | | |||
119 | font.pointSize: elisaTheme.headerTitleFontSize | 122 | font.pointSize: elisaTheme.headerTitleFontSize | ||
120 | font.weight: Font.Bold | 123 | font.weight: Font.Bold | ||
121 | 124 | | |||
125 | horizontalAlignment: Label.AlignHCenter | ||||
126 | | ||||
122 | Layout.fillWidth: true | 127 | Layout.fillWidth: true | ||
123 | Layout.alignment: Qt.AlignLeft | Qt.AlignTop | 128 | Layout.alignment: Qt.AlignTop | ||
124 | Layout.leftMargin: elisaTheme.layoutHorizontalMargin | 129 | | ||
125 | Layout.rightMargin: elisaTheme.layoutHorizontalMargin | | |||
126 | Layout.topMargin: elisaTheme.layoutVerticalMargin | 130 | Layout.topMargin: elisaTheme.layoutVerticalMargin | ||
127 | } | 131 | } | ||
128 | 132 | | |||
129 | LabelWithToolTip { | 133 | LabelWithToolTip { | ||
130 | id: albumArtistLabel | 134 | id: subtitleLabel | ||
131 | 135 | | |||
132 | 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) : '') | 136 | text: { | ||
137 | if (artistName !== '' && albumName !== '') { | ||||
138 | return i18nc('display of artist and album in context view', '<i>by</i> <b>%1</b> <i>from</i> <b>%2</b>', artistName, albumName) | ||||
139 | } else if (artistName === '' && albumName !== '') { | ||||
140 | return i18nc('display of album in context view', '<i>from</i> <b>%1</b>', albumName) | ||||
141 | } else if (artistName !== '' && albumName === '') { | ||||
142 | i18nc('display of artist in context view', '<i>by</i> <b>%1</b>', artistName) | ||||
143 | } | ||||
144 | } | ||||
133 | 145 | | |||
134 | font.pointSize: Math.round(elisaTheme.defaultFontPointSize * 1.4) | 146 | font.pointSize: Math.round(elisaTheme.defaultFontPointSize * 1.4) | ||
147 | horizontalAlignment: Label.AlignHCenter | ||||
135 | 148 | | |||
136 | visible: artistName !== '' && albumName !== '' | 149 | visible: artistName !== '' && albumName !== '' | ||
137 | 150 | | |||
138 | Layout.fillWidth: true | 151 | Layout.fillWidth: true | ||
139 | Layout.alignment: Qt.AlignLeft | Qt.AlignTop | 152 | Layout.alignment: Qt.AlignTop | ||
140 | Layout.leftMargin: elisaTheme.layoutHorizontalMargin | | |||
141 | Layout.rightMargin: elisaTheme.layoutHorizontalMargin | | |||
142 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | | |||
143 | } | 153 | } | ||
144 | 154 | | |||
145 | LabelWithToolTip { | 155 | // Horizontal line separating title and subtitle from metadata | ||
146 | id: albumLabel | 156 | Rectangle { | ||
147 | | ||||
148 | text: (albumName ? i18nc('display of album in context view', '<i>from</i> <b>%1</b>', albumName) : '') | | |||
149 | | ||||
150 | font.pointSize: Math.round(elisaTheme.defaultFontPointSize * 1.4) | | |||
151 | | ||||
152 | visible: artistName === '' && albumName !== '' | | |||
153 | | ||||
154 | Layout.fillWidth: true | 157 | Layout.fillWidth: true | ||
155 | Layout.alignment: Qt.AlignLeft | Qt.AlignTop | 158 | Layout.leftMargin: elisaTheme.layoutHorizontalMargin * 5 | ||
156 | Layout.leftMargin: elisaTheme.layoutHorizontalMargin | 159 | Layout.rightMargin: elisaTheme.layoutHorizontalMargin * 5 | ||
157 | Layout.rightMargin: elisaTheme.layoutHorizontalMargin | 160 | Layout.topMargin: elisaTheme.layoutVerticalMargin * 2 | ||
158 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | 161 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin * 2 | ||
159 | } | | |||
160 | 162 | | |||
161 | LabelWithToolTip { | 163 | height: 1 | ||
162 | id: artistLabel | | |||
163 | 164 | | |||
164 | text: (artistName ? i18nc('display of artist in context view', '<i>by</i> <b>%1</b>', artistName) : '') | 165 | color: myPalette.mid | ||
165 | | ||||
166 | font.pointSize: Math.round(elisaTheme.defaultFontPointSize * 1.4) | | |||
167 | | ||||
168 | visible: artistName !== '' && albumName === '' | | |||
169 | | ||||
170 | Layout.fillWidth: true | | |||
171 | Layout.alignment: Qt.AlignLeft | Qt.AlignTop | | |||
172 | Layout.leftMargin: elisaTheme.layoutHorizontalMargin | | |||
173 | Layout.rightMargin: elisaTheme.layoutHorizontalMargin | | |||
174 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | | |||
175 | } | 166 | } | ||
176 | 167 | | |||
177 | // Metadata | 168 | // Metadata | ||
178 | ColumnLayout { | 169 | ColumnLayout { | ||
179 | id: allMetaData | 170 | id: allMetaData | ||
180 | 171 | | |||
181 | spacing: 0 | 172 | spacing: 0 | ||
182 | Layout.fillWidth: true | 173 | Layout.fillWidth: true | ||
183 | Layout.leftMargin: elisaTheme.layoutHorizontalMargin | | |||
184 | Layout.rightMargin: elisaTheme.layoutHorizontalMargin | | |||
185 | 174 | | |||
186 | Repeater { | 175 | Repeater { | ||
187 | id: trackData | 176 | id: trackData | ||
188 | 177 | | |||
189 | model: metaDataModel | 178 | model: metaDataModel | ||
190 | 179 | | |||
191 | delegate: MetaDataDelegate { | 180 | delegate: MetaDataDelegate { | ||
192 | Layout.fillWidth: true | 181 | Layout.fillWidth: true | ||
193 | } | 182 | } | ||
194 | } | 183 | } | ||
195 | } | 184 | } | ||
196 | 185 | | |||
186 | // Horizontal line separating metadata from lyrics | ||||
187 | Rectangle { | ||||
188 | Layout.fillWidth: true | ||||
189 | Layout.leftMargin: elisaTheme.layoutHorizontalMargin * 5 | ||||
190 | Layout.rightMargin: elisaTheme.layoutHorizontalMargin * 5 | ||||
191 | Layout.topMargin: elisaTheme.layoutVerticalMargin * 2 | ||||
192 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin * 2 | ||||
193 | | ||||
194 | height: 1 | ||||
195 | | ||||
196 | color: myPalette.mid | ||||
197 | | ||||
198 | visible: metaDataModel.lyrics !== "" | ||||
199 | } | ||||
200 | | ||||
197 | // Lyrics | 201 | // Lyrics | ||
198 | ContextViewLyrics { | 202 | Label { | ||
199 | id: lyricsContextView | 203 | text: metaDataModel.lyrics | ||
204 | | ||||
205 | wrapMode: Text.WordWrap | ||||
206 | | ||||
207 | horizontalAlignment: Label.AlignHCenter | ||||
200 | 208 | | |||
201 | Layout.fillWidth: true | 209 | Layout.fillWidth: true | ||
202 | Layout.leftMargin: elisaTheme.layoutHorizontalMargin | | |||
203 | Layout.rightMargin: elisaTheme.layoutHorizontalMargin | | |||
204 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | 210 | Layout.bottomMargin: elisaTheme.layoutVerticalMargin | ||
205 | 211 | | |||
206 | visible: metaDataModel.lyrics !== "" | 212 | visible: metaDataModel.lyrics !== "" | ||
207 | 213 | | |||
208 | lyrics: metaDataModel.lyrics | | |||
209 | } | 214 | } | ||
210 | } | 215 | } | ||
211 | } | 216 | } | ||
212 | 217 | | |||
213 | // Footer with file path label | 218 | // Footer with file path label | ||
214 | HeaderFooterToolbar { | 219 | HeaderFooterToolbar { | ||
215 | type: "footer" | 220 | type: "footer" | ||
216 | contentLayoutSpacing: elisaTheme.layoutHorizontalMargin | 221 | contentLayoutSpacing: elisaTheme.layoutHorizontalMargin | ||
Show All 37 Lines |