Changeset View
Changeset View
Standalone View
Standalone View
src/qml/MediaPlayerControl.qml
| Show All 12 Lines | |||||
| 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.7 | ||
| 19 | import QtQuick.Layouts 1.2 | 19 | import QtQuick.Layouts 1.2 | ||
| 20 | import QtGraphicalEffects 1.0 | 20 | import QtGraphicalEffects 1.0 | ||
| 21 | import QtQuick.Controls 2.2 | 21 | import QtQuick.Controls 2.3 | ||
| 22 | import org.kde.elisa 1.0 | 22 | import org.kde.elisa 1.0 | ||
| 23 | 23 | | |||
| 24 | import QtQuick.Controls 1.4 as Controls1 | | |||
| 25 | | ||||
| 26 | FocusScope { | 24 | FocusScope { | ||
| 27 | property alias volume: volumeSlider.value | 25 | property alias volume: volumeSlider.value | ||
| 28 | property int position | 26 | property int position | ||
| 29 | property int duration | 27 | property int duration | ||
| 30 | property bool muted | 28 | property bool muted | ||
| 31 | property bool isPlaying | 29 | property bool isPlaying | ||
| 32 | property bool seekable | 30 | property bool seekable | ||
| 33 | property bool playEnabled | 31 | property bool playEnabled | ||
| 34 | property bool skipForwardEnabled | 32 | property bool skipForwardEnabled | ||
| 35 | property bool skipBackwardEnabled | 33 | property bool skipBackwardEnabled | ||
| 36 | property bool isMaximized | 34 | property bool isMaximized | ||
| 37 | 35 | | |||
| 38 | property bool shuffle | 36 | property bool shuffle | ||
| 39 | property bool repeat | 37 | property bool repeat | ||
| 40 | 38 | | |||
| 41 | signal play() | 39 | signal play() | ||
| 42 | signal pause() | 40 | signal pause() | ||
| 43 | signal playPrevious() | 41 | signal playPrevious() | ||
| 44 | signal playNext() | 42 | signal playNext() | ||
| 45 | signal seek(int position) | 43 | signal seek(int position) | ||
| 44 | signal openMenu() | ||||
| 46 | 45 | | |||
| 47 | signal maximize() | 46 | signal maximize() | ||
| 48 | signal minimize() | 47 | signal minimize() | ||
| 49 | 48 | | |||
| 50 | id: musicWidget | 49 | id: musicWidget | ||
| 51 | 50 | | |||
| 52 | SystemPalette { | 51 | SystemPalette { | ||
| 53 | id: myPalette | 52 | id: myPalette | ||
| 54 | colorGroup: SystemPalette.Active | 53 | colorGroup: SystemPalette.Active | ||
| 55 | } | 54 | } | ||
| 56 | 55 | | |||
| 57 | Theme { | 56 | Theme { | ||
| 58 | id: elisaTheme | 57 | id: elisaTheme | ||
| 59 | } | 58 | } | ||
| 60 | 59 | | |||
| 60 | Action { | ||||
| 61 | id: applicationMenuAction | ||||
| 62 | text: i18nc("open application menu", "Application Menu") | ||||
| 63 | icon.name: "application-menu" | ||||
| 64 | onTriggered: openMenu() | ||||
| 65 | } | ||||
| 66 | | ||||
| 67 | Action { | ||||
| 68 | id: repeatAction | ||||
| 69 | text: i18nc("toggle repeat mode for playlist", "Toggle Repeat") | ||||
| 70 | icon.name: musicWidget.repeat ? "media-repeat-all" : "media-repeat-none" | ||||
| 71 | onTriggered: musicWidget.repeat = !musicWidget.repeat | ||||
| 72 | } | ||||
| 73 | | ||||
| 74 | Action { | ||||
| 75 | id: shuffleAction | ||||
| 76 | text: i18nc("toggle shuffle mode for playlist", "Toggle Shuffle") | ||||
| 77 | icon.name: musicWidget.shuffle ? "media-playlist-shuffle" : "media-playlist-normal" | ||||
| 78 | onTriggered: musicWidget.shuffle = !musicWidget.shuffle | ||||
| 79 | } | ||||
| 80 | | ||||
| 81 | Action { | ||||
| 82 | id: muteAction | ||||
| 83 | text: i18nc("toggle mute mode for player", "Toggle Mute") | ||||
| 84 | icon.name: musicWidget.muted ? "player-volume-muted" : "player-volume" | ||||
| 85 | onTriggered: musicWidget.muted = !musicWidget.muted | ||||
| 86 | } | ||||
| 87 | | ||||
| 88 | Action { | ||||
| 89 | id: playPauseAction | ||||
| 90 | text: i18nc("toggle play and pause for the audio player", "Toggle Play and Pause") | ||||
| 91 | icon.name: musicWidget.isPlaying? "media-playback-pause" : "media-playback-start" | ||||
| 92 | onTriggered: musicWidget.isPlaying ? musicWidget.pause() : musicWidget.play() | ||||
| 93 | enabled: playEnabled | ||||
| 94 | } | ||||
| 95 | | ||||
| 96 | Action { | ||||
| 97 | id: skipBackwardAction | ||||
| 98 | text: i18nc("skip backward in playlists", "Skip Backward") | ||||
| 99 | icon.name: musicWidget.LayoutMirroring.enabled ? "media-skip-forward" : "media-skip-backward" | ||||
| 100 | onTriggered: musicWidget.playPrevious() | ||||
| 101 | enabled: skipBackwardEnabled | ||||
| 102 | } | ||||
| 103 | | ||||
| 104 | Action { | ||||
| 105 | id: skipForwardAction | ||||
| 106 | text: i18nc("skip forward in playlists", "Skip Forward") | ||||
| 107 | icon.name: musicWidget.LayoutMirroring.enabled ? "media-skip-backward" : "media-skip-forward" | ||||
| 108 | onTriggered: musicWidget.playNext() | ||||
| 109 | enabled: skipForwardEnabled | ||||
| 110 | } | ||||
| 111 | | ||||
| 112 | Action { | ||||
| 113 | id: minimizeMaximizeAction | ||||
| 114 | text: i18nc("toggle between maximized and minimized ivre", "Toggle Maximize") | ||||
| 115 | icon.name: musicWidget.isMaximized ? "draw-arrow-up" : "draw-arrow-down" | ||||
| 116 | onTriggered: musicWidget.isMaximized = !musicWidget.isMaximized | ||||
| 117 | } | ||||
| 118 | | ||||
| 61 | Rectangle { | 119 | Rectangle { | ||
| 62 | anchors.fill: parent | 120 | anchors.fill: parent | ||
| 63 | 121 | | |||
| 64 | color: myPalette.midlight | 122 | color: myPalette.midlight | ||
| 65 | opacity: elisaTheme.mediaPlayerControlOpacity | 123 | opacity: elisaTheme.mediaPlayerControlOpacity | ||
| 66 | } | 124 | } | ||
| 67 | 125 | | |||
| 68 | RowLayout { | 126 | RowLayout { | ||
| 69 | anchors.fill: parent | 127 | anchors.fill: parent | ||
| 70 | spacing: 5 | 128 | spacing: 5 | ||
| 71 | 129 | | |||
| 72 | Button { | 130 | FlatButtonWithToolTip { | ||
| 131 | id: minimzeMaximizeAction | ||||
| 132 | action: minimizeMaximizeAction | ||||
| 133 | | ||||
| 73 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | 134 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | ||
| 74 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | 135 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | ||
| 75 | Layout.alignment: Qt.AlignVCenter | 136 | Layout.alignment: Qt.AlignVCenter | ||
| 76 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | 137 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | ||
| 77 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | 138 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | ||
| 78 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | 139 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | ||
| 79 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | 140 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | ||
| 80 | Layout.rightMargin: LayoutMirroring.enabled ? elisaTheme.mediaPlayerHorizontalMargin : 0 | 141 | Layout.rightMargin: LayoutMirroring.enabled ? elisaTheme.mediaPlayerHorizontalMargin : 0 | ||
| 81 | Layout.leftMargin: !LayoutMirroring.enabled ? elisaTheme.mediaPlayerHorizontalMargin : 0 | 142 | Layout.leftMargin: !LayoutMirroring.enabled ? elisaTheme.mediaPlayerHorizontalMargin : 0 | ||
| 82 | | ||||
| 83 | contentItem: Image { | | |||
| 84 | anchors.fill: parent | | |||
| 85 | source: Qt.resolvedUrl(musicWidget.isMaximized ? elisaTheme.minimizeIcon : elisaTheme.maximizeIcon) | | |||
| 86 | | ||||
| 87 | width: elisaTheme.smallControlButtonSize | | |||
| 88 | height: elisaTheme.smallControlButtonSize | | |||
| 89 | | ||||
| 90 | sourceSize.width: elisaTheme.smallControlButtonSize | | |||
| 91 | sourceSize.height: elisaTheme.smallControlButtonSize | | |||
| 92 | | ||||
| 93 | fillMode: Image.PreserveAspectFit | | |||
| 94 | opacity: 1.0 | | |||
| 95 | } | 143 | } | ||
| 96 | 144 | | |||
| 97 | background: Rectangle { | 145 | FlatButtonWithToolTip { | ||
| 98 | border.width: 0 | 146 | id: skipBackwardButton | ||
| 99 | opacity: 0.0 | 147 | action: skipBackwardAction | ||
| 100 | } | | |||
| 101 | | ||||
| 102 | onClicked: { | | |||
| 103 | musicWidget.isMaximized = !musicWidget.isMaximized | | |||
| 104 | } | | |||
| 105 | } | | |||
| 106 | | ||||
| 107 | RoundButton { | | |||
| 108 | focus: skipBackwardEnabled | 148 | focus: skipBackwardEnabled | ||
| 109 | 149 | | |||
| 110 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | 150 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | ||
| 111 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | 151 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | ||
| 112 | Layout.alignment: Qt.AlignVCenter | 152 | Layout.alignment: Qt.AlignVCenter | ||
| 113 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | 153 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | ||
| 114 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | 154 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | ||
| 115 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | 155 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | ||
| 116 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | 156 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | ||
| 117 | Layout.rightMargin: LayoutMirroring.enabled ? elisaTheme.mediaPlayerHorizontalMargin : 0 | | |||
| 118 | Layout.leftMargin: !LayoutMirroring.enabled ? elisaTheme.mediaPlayerHorizontalMargin : 0 | | |||
| 119 | | ||||
| 120 | enabled: skipBackwardEnabled | | |||
| 121 | hoverEnabled: true | | |||
| 122 | | ||||
| 123 | onClicked: { | | |||
| 124 | musicWidget.playPrevious() | | |||
| 125 | } | | |||
| 126 | | ||||
| 127 | contentItem: Image { | | |||
| 128 | anchors.fill: parent | | |||
| 129 | | ||||
| 130 | source: Qt.resolvedUrl(LayoutMirroring.enabled ? elisaTheme.skipForwardIcon : elisaTheme.skipBackwardIcon) | | |||
| 131 | | ||||
| 132 | width: elisaTheme.smallControlButtonSize | | |||
| 133 | height: elisaTheme.smallControlButtonSize | | |||
| 134 | | ||||
| 135 | sourceSize.width: elisaTheme.smallControlButtonSize | | |||
| 136 | sourceSize.height: elisaTheme.smallControlButtonSize | | |||
| 137 | | ||||
| 138 | fillMode: Image.PreserveAspectFit | | |||
| 139 | | ||||
| 140 | opacity: skipBackwardEnabled ? 1.0 : 0.6 | | |||
| 141 | } | 157 | } | ||
| 142 | 158 | | |||
| 143 | background: Rectangle { | 159 | FlatButtonWithToolTip { | ||
| 144 | color: "transparent" | 160 | id: playPauseButton | ||
| 145 | 161 | action: playPauseAction | |||
| 146 | border.color: (parent.hovered || parent.activeFocus) ? myPalette.highlight : "transparent" | | |||
| 147 | border.width: 1 | | |||
| 148 | | ||||
| 149 | radius: elisaTheme.smallControlButtonSize | | |||
| 150 | | ||||
| 151 | Behavior on border.color { | | |||
| 152 | ColorAnimation { | | |||
| 153 | duration: 300 | | |||
| 154 | } | | |||
| 155 | } | | |||
| 156 | } | | |||
| 157 | } | | |||
| 158 | | ||||
| 159 | RoundButton { | | |||
| 160 | focus: playEnabled | 162 | focus: playEnabled | ||
| 161 | 163 | | |||
| 162 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | 164 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | ||
| 163 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | 165 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | ||
| 164 | Layout.alignment: Qt.AlignVCenter | 166 | Layout.alignment: Qt.AlignVCenter | ||
| 165 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | 167 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | ||
| 166 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | 168 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | ||
| 167 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | 169 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | ||
| 168 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | 170 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | ||
| 169 | | ||||
| 170 | enabled: playEnabled | | |||
| 171 | hoverEnabled: true | | |||
| 172 | | ||||
| 173 | onClicked: { | | |||
| 174 | if (musicWidget.isPlaying) { | | |||
| 175 | musicWidget.pause() | | |||
| 176 | } else { | | |||
| 177 | musicWidget.play() | | |||
| 178 | } | | |||
| 179 | } | | |||
| 180 | | ||||
| 181 | contentItem: Image { | | |||
| 182 | anchors.fill: parent | | |||
| 183 | | ||||
| 184 | source: { | | |||
| 185 | if (musicWidget.isPlaying) | | |||
| 186 | Qt.resolvedUrl(elisaTheme.pauseIcon) | | |||
| 187 | else | | |||
| 188 | Qt.resolvedUrl(elisaTheme.playIcon) | | |||
| 189 | } | | |||
| 190 | | ||||
| 191 | width: elisaTheme.smallControlButtonSize | | |||
| 192 | height: elisaTheme.smallControlButtonSize | | |||
| 193 | | ||||
| 194 | sourceSize.width: elisaTheme.smallControlButtonSize | | |||
| 195 | sourceSize.height: elisaTheme.smallControlButtonSize | | |||
| 196 | | ||||
| 197 | fillMode: Image.PreserveAspectFit | | |||
| 198 | mirror: LayoutMirroring.enabled | | |||
| 199 | opacity: playEnabled ? 1.0 : 0.6 | | |||
| 200 | } | 171 | } | ||
| 201 | 172 | | |||
| 202 | background: Rectangle { | 173 | FlatButtonWithToolTip { | ||
| 203 | color: "transparent" | 174 | id: skipForwardButton | ||
| 204 | 175 | action: skipForwardAction | |||
| 205 | border.color: (parent.hovered || parent.activeFocus) ? myPalette.highlight : "transparent" | | |||
| 206 | border.width: 1 | | |||
| 207 | | ||||
| 208 | radius: elisaTheme.smallControlButtonSize | | |||
| 209 | | ||||
| 210 | Behavior on border.color { | | |||
| 211 | ColorAnimation { | | |||
| 212 | duration: 300 | | |||
| 213 | } | | |||
| 214 | } | | |||
| 215 | } | | |||
| 216 | } | | |||
| 217 | | ||||
| 218 | RoundButton { | | |||
| 219 | focus: skipForwardEnabled | 176 | focus: skipForwardEnabled | ||
| 220 | 177 | | |||
| 221 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | 178 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | ||
| 222 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | 179 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | ||
| 223 | Layout.alignment: Qt.AlignVCenter | 180 | Layout.alignment: Qt.AlignVCenter | ||
| 224 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | 181 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | ||
| 225 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | 182 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | ||
| 226 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | 183 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | ||
| 227 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | 184 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | ||
| 228 | | ||||
| 229 | enabled: skipForwardEnabled | | |||
| 230 | hoverEnabled: true | | |||
| 231 | | ||||
| 232 | onClicked: { | | |||
| 233 | musicWidget.playNext() | | |||
| 234 | } | | |||
| 235 | | ||||
| 236 | contentItem: Image { | | |||
| 237 | anchors.fill: parent | | |||
| 238 | | ||||
| 239 | source: Qt.resolvedUrl(LayoutMirroring.enabled ? elisaTheme.skipBackwardIcon : elisaTheme.skipForwardIcon) | | |||
| 240 | | ||||
| 241 | width: elisaTheme.smallControlButtonSize | | |||
| 242 | height: elisaTheme.smallControlButtonSize | | |||
| 243 | | ||||
| 244 | sourceSize.width: elisaTheme.smallControlButtonSize | | |||
| 245 | sourceSize.height: elisaTheme.smallControlButtonSize | | |||
| 246 | | ||||
| 247 | fillMode: Image.PreserveAspectFit | | |||
| 248 | | ||||
| 249 | opacity: skipForwardEnabled ? 1.0 : 0.6 | | |||
| 250 | } | | |||
| 251 | | ||||
| 252 | background: Rectangle { | | |||
| 253 | color: "transparent" | | |||
| 254 | | ||||
| 255 | border.color: (parent.hovered || parent.activeFocus) ? myPalette.highlight : "transparent" | | |||
| 256 | border.width: 1 | | |||
| 257 | | ||||
| 258 | radius: elisaTheme.smallControlButtonSize | | |||
| 259 | | ||||
| 260 | Behavior on border.color { | | |||
| 261 | ColorAnimation { | | |||
| 262 | duration: 300 | | |||
| 263 | } | | |||
| 264 | } | | |||
| 265 | } | | |||
| 266 | } | 185 | } | ||
| 267 | 186 | | |||
| 268 | TextMetrics { | 187 | TextMetrics { | ||
| 269 | id: durationTextMetrics | 188 | id: durationTextMetrics | ||
| 270 | text: i18nc("This is used to preserve a fixed width for the duration text.", "00:00:00") | 189 | text: i18nc("This is used to preserve a fixed width for the duration text.", "00:00:00") | ||
| 271 | } | 190 | } | ||
| 272 | 191 | | |||
| 273 | LabelWithToolTip { | 192 | LabelWithToolTip { | ||
| ▲ Show 20 Lines • Show All 101 Lines • ▼ Show 20 Line(s) | 280 | LabelWithToolTip { | |||
| 375 | horizontalAlignment: Text.AlignLeft | 294 | horizontalAlignment: Text.AlignLeft | ||
| 376 | 295 | | |||
| 377 | ProgressIndicator { | 296 | ProgressIndicator { | ||
| 378 | id: durationIndicator | 297 | id: durationIndicator | ||
| 379 | position: musicWidget.duration | 298 | position: musicWidget.duration | ||
| 380 | } | 299 | } | ||
| 381 | } | 300 | } | ||
| 382 | 301 | | |||
| 383 | Image { | 302 | FlatButtonWithToolTip { | ||
| 384 | id: volumeIcon | 303 | id: muteButton | ||
| 385 | 304 | action: muteAction | |||
| 386 | source: if (musicWidget.muted) | | |||
| 387 | Qt.resolvedUrl(elisaTheme.playerVolumeMutedIcon) | | |||
| 388 | else | | |||
| 389 | Qt.resolvedUrl(elisaTheme.playerVolumeIcon) | | |||
| 390 | | ||||
| 391 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | | |||
| 392 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | | |||
| 393 | Layout.alignment: Qt.AlignVCenter | | |||
| 394 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | | |||
| 395 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | | |||
| 396 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | | |||
| 397 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | | |||
| 398 | Layout.rightMargin: !LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0 | | |||
| 399 | Layout.leftMargin: LayoutMirroring.enabled ? elisaTheme.layoutHorizontalMargin : 0 | | |||
| 400 | | ||||
| 401 | sourceSize.width: elisaTheme.smallControlButtonSize | | |||
| 402 | sourceSize.height: elisaTheme.smallControlButtonSize | | |||
| 403 | | ||||
| 404 | fillMode: Image.PreserveAspectFit | | |||
| 405 | | ||||
| 406 | visible: false | | |||
| 407 | } | | |||
| 408 | | ||||
| 409 | | ||||
| 410 | RoundButton { | | |||
| 411 | focus: true | 305 | focus: true | ||
| 412 | 306 | | |||
| 413 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | 307 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | ||
| 414 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | 308 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | ||
| 415 | Layout.alignment: Qt.AlignVCenter | 309 | Layout.alignment: Qt.AlignVCenter | ||
| 416 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | 310 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | ||
| 417 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | 311 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | ||
| 418 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | 312 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | ||
| 419 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | 313 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | ||
| 420 | | ||||
| 421 | hoverEnabled: true | | |||
| 422 | | ||||
| 423 | onClicked: musicWidget.muted = !musicWidget.muted | | |||
| 424 | | ||||
| 425 | contentItem: Image { | | |||
| 426 | anchors.fill: parent | | |||
| 427 | | ||||
| 428 | source: if (musicWidget.muted) | | |||
| 429 | Qt.resolvedUrl(elisaTheme.playerVolumeMutedIcon) | | |||
| 430 | else | | |||
| 431 | Qt.resolvedUrl(elisaTheme.playerVolumeIcon) | | |||
| 432 | | ||||
| 433 | width: elisaTheme.smallControlButtonSize | | |||
| 434 | height: elisaTheme.smallControlButtonSize | | |||
| 435 | | ||||
| 436 | sourceSize.width: elisaTheme.smallControlButtonSize | | |||
| 437 | sourceSize.height: elisaTheme.smallControlButtonSize | | |||
| 438 | | ||||
| 439 | fillMode: Image.PreserveAspectFit | | |||
| 440 | } | | |||
| 441 | | ||||
| 442 | background: Rectangle { | | |||
| 443 | color: "transparent" | | |||
| 444 | | ||||
| 445 | border.color: (parent.hovered || parent.activeFocus) ? myPalette.highlight : "transparent" | | |||
| 446 | border.width: 1 | | |||
| 447 | | ||||
| 448 | radius: elisaTheme.smallControlButtonSize | | |||
| 449 | | ||||
| 450 | Behavior on border.color { | | |||
| 451 | ColorAnimation { | | |||
| 452 | duration: 300 | | |||
| 453 | } | | |||
| 454 | } | | |||
| 455 | } | | |||
| 456 | } | 314 | } | ||
| 457 | 315 | | |||
| 458 | Slider { | 316 | Slider { | ||
| 459 | id: volumeSlider | 317 | id: volumeSlider | ||
| 460 | 318 | | |||
| 461 | from: 0 | 319 | from: 0 | ||
| 462 | to: 100 | 320 | to: 100 | ||
| 463 | 321 | | |||
| Show All 36 Lines | 354 | handle: Rectangle { | |||
| 500 | implicitHeight: 18 | 358 | implicitHeight: 18 | ||
| 501 | radius: 9 | 359 | radius: 9 | ||
| 502 | color: myPalette.base | 360 | color: myPalette.base | ||
| 503 | border.width: 1 | 361 | border.width: 1 | ||
| 504 | border.color: volumeSlider.pressed ? myPalette.text : (muted ? myPalette.mid : myPalette.dark) | 362 | border.color: volumeSlider.pressed ? myPalette.text : (muted ? myPalette.mid : myPalette.dark) | ||
| 505 | } | 363 | } | ||
| 506 | } | 364 | } | ||
| 507 | 365 | | |||
| 508 | RoundButton { | 366 | FlatButtonWithToolTip { | ||
| 509 | focus: true | 367 | focus: true | ||
| 368 | action: shuffleAction | ||||
| 510 | id: shuffleButton | 369 | id: shuffleButton | ||
| 511 | 370 | | |||
| 512 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | 371 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | ||
| 513 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | 372 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | ||
| 514 | Layout.alignment: Qt.AlignCenter | 373 | Layout.alignment: Qt.AlignCenter | ||
| 515 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | 374 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | ||
| 516 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | 375 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | ||
| 517 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | 376 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | ||
| 518 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | 377 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | ||
| 519 | | ||||
| 520 | hoverEnabled: true | | |||
| 521 | onClicked: musicWidget.shuffle = !musicWidget.shuffle | | |||
| 522 | | ||||
| 523 | contentItem: Image { | | |||
| 524 | anchors.fill: parent | | |||
| 525 | | ||||
| 526 | source: musicWidget.shuffle ? Qt.resolvedUrl(elisaTheme.shuffleIcon) : Qt.resolvedUrl(elisaTheme.noShuffleIcon) | | |||
| 527 | | ||||
| 528 | width: elisaTheme.smallControlButtonSize | | |||
| 529 | height: elisaTheme.smallControlButtonSize | | |||
| 530 | | ||||
| 531 | sourceSize.width: elisaTheme.smallControlButtonSize | | |||
| 532 | sourceSize.height: elisaTheme.smallControlButtonSize | | |||
| 533 | | ||||
| 534 | fillMode: Image.PreserveAspectFit | | |||
| 535 | } | 378 | } | ||
| 536 | 379 | | |||
| 537 | background: Rectangle { | 380 | FlatButtonWithToolTip { | ||
| 538 | color: "transparent" | | |||
| 539 | } | | |||
| 540 | } | | |||
| 541 | | ||||
| 542 | | ||||
| 543 | RoundButton { | | |||
| 544 | focus: true | 381 | focus: true | ||
| 382 | action: repeatAction | ||||
| 545 | id: repeatButton | 383 | id: repeatButton | ||
| 546 | 384 | | |||
| 547 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | 385 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | ||
| 548 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | 386 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | ||
| 549 | Layout.alignment: Qt.AlignCenter | 387 | Layout.alignment: Qt.AlignCenter | ||
| 550 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | 388 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | ||
| 551 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | 389 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | ||
| 552 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | 390 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | ||
| 553 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | 391 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | ||
| 554 | | ||||
| 555 | hoverEnabled: true | | |||
| 556 | onClicked: musicWidget.repeat = !musicWidget.repeat | | |||
| 557 | | ||||
| 558 | contentItem: Image { | | |||
| 559 | anchors.fill: parent | | |||
| 560 | | ||||
| 561 | source: musicWidget.repeat ? Qt.resolvedUrl(elisaTheme.repeatIcon) : Qt.resolvedUrl(elisaTheme.noRepeatIcon) | | |||
| 562 | | ||||
| 563 | width: elisaTheme.smallControlButtonSize | | |||
| 564 | height: elisaTheme.smallControlButtonSize | | |||
| 565 | | ||||
| 566 | sourceSize.width: elisaTheme.smallControlButtonSize | | |||
| 567 | sourceSize.height: elisaTheme.smallControlButtonSize | | |||
| 568 | | ||||
| 569 | fillMode: Image.PreserveAspectFit | | |||
| 570 | } | 392 | } | ||
| 571 | 393 | | |||
| 572 | background: Rectangle { | 394 | FlatButtonWithToolTip { | ||
| 573 | color: "transparent" | | |||
| 574 | } | | |||
| 575 | | ||||
| 576 | } | | |||
| 577 | | ||||
| 578 | Controls1.ToolButton { | | |||
| 579 | id: menuButton | 395 | id: menuButton | ||
| 580 | action: applicationMenuAction | 396 | action: applicationMenuAction | ||
| 397 | focus: true | ||||
| 581 | 398 | | |||
| 582 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | 399 | Layout.preferredWidth: elisaTheme.smallControlButtonSize | ||
| 583 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | 400 | Layout.preferredHeight: elisaTheme.smallControlButtonSize | ||
| 584 | Layout.alignment: Qt.AlignVCenter | 401 | Layout.alignment: Qt.AlignVCenter | ||
| 585 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | 402 | Layout.maximumWidth: elisaTheme.smallControlButtonSize | ||
| 586 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | 403 | Layout.maximumHeight: elisaTheme.smallControlButtonSize | ||
| 587 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | 404 | Layout.minimumWidth: elisaTheme.smallControlButtonSize | ||
| 588 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | 405 | Layout.minimumHeight: elisaTheme.smallControlButtonSize | ||
| Show All 22 Lines | |||||