Commit a0503784 authored by Camilo Higuita's avatar Camilo Higuita

polish new ui footer and a few fixes

parent 2b26432f
kirigami @ 7f743390
Subproject commit 72f49c2026345579fb5444b930d6fa670fb849f7
Subproject commit 7f743390899b2418d4694d49b1eab4d360c25990
......@@ -27,16 +27,18 @@ Kirigami.ApplicationWindow
title: qsTr("Babe")
wideScreen: root.width > coverSize
property bool shuffle : false
/*PLAYBACK*/
/*THEMING*/
property bool shuffle : false
property var currentTrack : ({babe:0, stars: 0})
property int currentTrackIndex : 0
property int prevTrackIndex : 0
property string currentArtwork
property int toolBarIconSize: bae.loadSetting("ICON_SIZE", "BABE", isMobile ? 24 : 22)
property int toolBarHeight : isMobile ? 48 : toolBarIconSize *2
property int contentMargins : 15
property bool timeLabels : false
/*THEMING*/
property string infoMsg : ""
property string babeColor : bae.babeColor()
......@@ -88,13 +90,18 @@ Kirigami.ApplicationWindow
signal missingAlert(var track)
/*READONLY PROPS*/
readonly property real opacityLevel : 0.7
readonly property real opacityLevel : 0.8
readonly property bool isMobile: bae.isMobile()
readonly property int wideSize : bae.screenGeometry("width")*0.5
readonly property int rowHeight: isMobile ? 64 : 52
readonly property int rowHeightAlt: isMobile ? 48 : 32
readonly property int headerHeight: rowHeight
readonly property int contentMargins : 15
/*PROPS*/
property int toolBarIconSize: bae.loadSetting("ICON_SIZE", "BABE", isMobile ? 24 : 22)
property int toolBarHeight : isMobile ? 48 : toolBarIconSize *2
property int columnWidth: Kirigami.Units.gridUnit * 20
property int coverSize: isMobile ? Math.sqrt(root.width*root.height)*0.4 : columnWidth * 0.65
......@@ -161,7 +168,7 @@ Kirigami.ApplicationWindow
title: "Missing file"
onAccepted:
{
bae.removeTrack(mainPlaylist.currentTrack.url)
bae.removeTrack(currentTrack.url)
mainPlaylist.list.model.remove(mainPlaylist.list.currentIndex)
}
......@@ -185,8 +192,8 @@ Kirigami.ApplicationWindow
{
target: player
onPos: progressBar.value = pos
onTiming: progressTime.text = time
onDurationChanged: durationTime.text = time
onTiming: progressTimeLabel = time
onDurationChanged: durationTimeLabel = time
onFinished: Player.nextTrack()
}
......@@ -206,7 +213,7 @@ Kirigami.ApplicationWindow
onTrackLyricsReady:
{
if(url === root.mainPlaylist.currentTrack.url)
if(url === currentTrack.url)
root.mainPlaylist.infoView.lyrics = lyrics
}
......@@ -217,6 +224,7 @@ Kirigami.ApplicationWindow
header: BabeBar
{
id: mainToolbar
height: headerHeight
visible: true
currentIndex: currentView
bgColor: isMobile && pageStack.currentIndex === 0 && !pageStack.wideMode ? babeColor : babeAltColor
......@@ -274,22 +282,27 @@ Kirigami.ApplicationWindow
pageStack.currentIndex = 1
currentView = 4
}
onSearchViewClicked:
{
pageStack.currentIndex = 1
currentView = 5
}
}
property alias playIcon: playIcon
property alias babeBtnIcon: babeBtnIcon
property alias progressBar : progressBar
property alias durationTime : durationTime
property alias progressTime : progressTime
property string durationTimeLabel : "00:00"
property string progressTimeLabel : "00:00"
footer: Item
{
id: playbackControls
width: parent.width
anchors.horizontalCenter: parent.horizontalCenter
height: visible ? 48 : 0
// anchors.top: cover.bottom
visible: mainPlaylist.list.count > 0
height: visible ? headerHeight : 0
visible: true
......@@ -313,41 +326,37 @@ Kirigami.ApplicationWindow
z: -999
}
Slider
{
id: progressBar
width: parent.width
z: 999
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
padding: 0
from: 0
to: 1000
value: 0
spacing: 0
onMoved: player.seek(player.duration() / 1000 * value);
background: Rectangle
{
x: progressBar.leftPadding
y: progressBar.topPadding + progressBar.availableHeight / 2 - height / 2
implicitWidth: 200
implicitHeight: 2
implicitHeight: 1
width: progressBar.availableWidth
height: implicitHeight
color: foregroundColor
color: Kirigami.Theme.viewFocusColor
Rectangle
{
width: progressBar.visualPosition * parent.width
height: parent.height
height: 2
color: babeColor
}
}
......@@ -361,49 +370,65 @@ Kirigami.ApplicationWindow
radius: progressBar.pressed ? 16 : 0
color: babeColor
}
}
RowLayout
{
anchors.fill: parent
anchors.centerIn: parent
BabeButton
{
id: shuffleBtn
iconName: shuffle ? "media-playlist-shuffle" : "media-playlist-repeat"
onClicked: shuffle = !shuffle
}
Item
{
Layout.fillWidth: true
}
Label
{
id: progressTime
anchors.top: parent.bottom
anchors.right: parent.right
visible: timeLabels
horizontalAlignment: Qt.AlignHCenter
verticalAlignment: Qt.AlignVCenter
text: "00:00"
text: progressTimeLabel +" / "+durationTimeLabel
color: foregroundColor
font.pointSize: 8
font.pointSize: 6.5
padding: 2
elide: Text.ElideRight
}
}
RowLayout
{
anchors.fill: parent
width: parent.width
height: parent.height
Item
{
Layout.fillHeight: true
Image
{
visible: (!pageStack.wideMode && pageStack.currentIndex !== 0) || !mainPlaylist.cover.visible
height: parent.height
width: parent.height
anchors.verticalCenter: parent.verticalCenter
anchors.left: parent.left
source:
{
if(currentArtwork)
(currentArtwork.length > 0 && currentArtwork !== "NONE")? "file://"+encodeURIComponent(currentArtwork) : "qrc:/assets/cover.png"
else "qrc:/assets/cover.png"
}
fillMode: Image.PreserveAspectFit
cache: false
antialiasing: true
}
}
Item
{
Layout.fillWidth: true
}
BabeButton
{
id: babeBtnIcon
iconName: "love" //"love-amarok"
iconColor: mainPlaylist.currentTrack.babe == "0" ? defaultColor : babeColor
onClicked: mainPlaylist.list.contextMenu.babeIt(mainPlaylist.currentTrackIndex)
iconColor: currentTrack.babe == "1" ? babeColor : defaultColor
onClicked:
{
var value = mainPlaylist.list.contextMenu.babeIt(currentTrackIndex)
// iconColor = value ? babeColor : foregroundColor
currentTrack["babe"] = value ? "1" : "0"
}
}
BabeButton
......@@ -433,22 +458,11 @@ Kirigami.ApplicationWindow
onPressAndHold: Player.playAt(Player.shuffle())
}
Item
{
Layout.fillWidth: true
}
Label
BabeButton
{
id: durationTime
horizontalAlignment: Qt.AlignHCenter
verticalAlignment: Qt.AlignVCenter
text: "00:00"
color: foregroundColor
font.pointSize: 8
elide: Text.ElideRight
id: shuffleBtn
iconName: shuffle ? "media-playlist-shuffle" : "media-playlist-repeat"
onClicked: shuffle = !shuffle
}
Item
......@@ -456,27 +470,10 @@ Kirigami.ApplicationWindow
Layout.fillWidth: true
}
BabeButton
{
id: searchBtn
iconColor: currentView === 5 ? babeColor : foregroundColor
// visible: !(searchInput.focus || searchInput.text)
iconName: "edit-find" //"search"
onClicked:
{
currentView = 5
pageStack.currentIndex = 1
searchView.searchInput.forceActiveFocus()
}
}
}
}
background: Rectangle
{
anchors.fill: parent
......
......@@ -5,34 +5,28 @@ function playTrack(track)
{
if(track)
{
root.mainPlaylist.currentTrack = track
root.currentTrack = track
if(bae.fileExists(root.mainPlaylist.currentTrack.url))
if(bae.fileExists(root.currentTrack.url))
{
player.source(root.mainPlaylist.currentTrack.url);
player.source(root.currentTrack.url);
player.play()
root.playIcon.iconName = "media-playback-pause"
var artwork = root.mainPlaylist.currentTrack.artwork
var artwork = root.currentTrack.artwork
// root.mainPlaylist.list.currentItem.playingIndicator = true
root.mainPlaylist.currentArtwork = artwork && artwork.length>0 && artwork !== "NONE" ? artwork : bae.loadCover(root.mainPlaylist.currentTrack.url)
root.currentArtwork = artwork && artwork.length>0 && artwork !== "NONE" ? artwork : bae.loadCover(root.mainPlaylist.currentTrack.url)
if(!root.isMobile)
{
root.title = root.mainPlaylist.currentTrack.title + " - " +root.mainPlaylist.currentTrack.artist
root.title = root.currentTrack.title + " - " +root.currentTrack.artist
if(!root.active)
bae.notifySong(root.mainPlaylist.currentTrack.url)
}
bae.notifySong(root.currentTrack.url)
}
if(bae.trackBabe(root.mainPlaylist.currentTrack.url))
root.babeBtnIcon.iconColor = babeColor
else
root.babeBtnIcon.iconColor = root.babeBtnIcon.defaultColor
var lyrics = root.mainPlaylist.currentTrack.lyrics
var lyrics = root.currentTrack.lyrics
// if(!lyrics || lyrics.length === 0 || lyrics === "NONE" )
// bae.trackLyrics(root.mainPlaylist.currentTrack.url)
......@@ -42,7 +36,7 @@ function playTrack(track)
// root.mainPlaylist.infoView.wikiAlbum = bae.albumWiki(root.mainPlaylist.currentTrack.album,root.mainPlaylist.currentTrack.artist)
// root.mainPlaylist.infoView.wikiArtist = bae.artistWiki(root.mainPlaylist.currentTrack.artist)
// // root.mainPlaylist.infoView.artistHead = bae.artistArt(root.mainPlaylist.currentTrack.artist)
}else root.missingAlert(root.mainPlaylist.currentTrack)
}else root.missingAlert(root.currentTrack)
}
}
......@@ -78,7 +72,7 @@ function nextTrack()
else
next = root.mainPlaylist.list.currentIndex+1 >= root.mainPlaylist.list.count? 0 : root.mainPlaylist.list.currentIndex+1
root.mainPlaylist.prevTrackIndex = root.mainPlaylist.list.currentIndex
root.prevTrackIndex = root.mainPlaylist.list.currentIndex
playAt(next)
}
}
......@@ -88,7 +82,7 @@ function previousTrack()
if(root.mainPlaylist.list.count>0)
{
var previous = previous = root.mainPlaylist.list.currentIndex-1 >= 0 ? root.mainPlaylist.list.currentIndex-1 : root.mainPlaylist.list.count-1
root.mainPlaylist.prevTrackIndex = root.mainPlaylist.list.currentIndex
root.prevTrackIndex = root.mainPlaylist.list.currentIndex
playAt(previous)
}
}
......
import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import org.kde.kirigami 2.2 as Kirigami
import ".."
BabeList
......@@ -45,6 +47,22 @@ BabeList
visible: headerBar
z: 999
Kirigami.Separator
{
Rectangle
{
anchors.fill: parent
color: Kirigami.Theme.viewFocusColor
}
anchors
{
left: parent.left
right: parent.right
bottom: parent.bottom
}
}
RowLayout
{
anchors.fill: parent
......@@ -71,13 +89,13 @@ BabeList
Label
{
text: headerTitle || ""
text: headerTitle || count +" tracks"
Layout.fillHeight: true
Layout.fillWidth: true
Layout.alignment: Qt.AlignCenter
elide: Text.ElideRight
font.pointSize: 8
// font.pointSize: 8
font.bold: false
color: foregroundColor
......@@ -124,7 +142,7 @@ BabeList
model: listModel
// property alias animBabe: delegate.animBabe
// property alias animBabe: delegate.animBabe
delegate: TableDelegate
{
id: delegate
......@@ -136,11 +154,12 @@ BabeList
trackRatingVisible : list.trackRating
menuItem: menuItemVisible
Connections
{
target: delegate
// onPressAndHold: if(root.isMobile) openItemMenu(index)
onPressAndHold: if(root.isMobile) openItemMenu(index)
onRightClicked: openItemMenu(index)
onClicked:
......
......@@ -62,7 +62,7 @@ BabeDialog
color: foregroundColor
placeholderText: qsTr("New playlist")
onAccepted:
{
{
addPlaylist()
clear()
close()
......@@ -74,6 +74,7 @@ BabeDialog
iconName: "checkbox"
iconColor: textColor
onClicked: addPlaylist()
}
}
......@@ -89,7 +90,17 @@ BabeDialog
playlistsList.model.append(playlists[i])
}
onAccepted: Player.addToPlaylist(tracks, playlistsList.model.get(playlistsList.currentIndex).playlist)
onAccepted:
{
if(newPlaylistField.text && newPlaylistField.text.length > 0)
{
addPlaylist()
Player.addToPlaylist(tracks,newPlaylistField.text.trim())
}
else
Player.addToPlaylist(tracks, playlistsList.model.get(playlistsList.currentIndex).playlist)
}
function addPlaylist()
{
......@@ -98,12 +109,12 @@ BabeDialog
var title = newPlaylistField.text.trim()
if(bae.addPlaylist(title))
{
playlistsList.model.append({playlist: title})
playlistsView.playlistViewModel.model.append({playlist: title})
playlistsList.positionViewAtEnd()
playlistsList.model.insert(0, {playlist: title})
playlistsView.playlistViewModel.model.insert(9, {playlist: title})
playlistsList.positionViewAtBeginning()
}
Player.addToPlaylist(tracks, title)
newPlaylistField.clear()
}
}
......
......@@ -10,6 +10,8 @@ ItemDelegate
width: parent.width
height: sameAlbum ? rowHeightAlt : rowHeight
clip: true
signal play()
signal rightClicked()
signal leftClicked()
......@@ -39,7 +41,6 @@ ItemDelegate
// property bool playingIndicator: false
property string trackMood : art
property alias trackRating : trackRating
property alias animBabe : animBabe
// NumberAnimation on x
// {
......@@ -64,11 +65,16 @@ ItemDelegate
{
anchors.fill: parent
acceptedButtons: Qt.RightButton
pressAndHoldInterval: 3000
onClicked:
{
if(!root.isMobile && mouse.button === Qt.RightButton)
rightClicked()
}
// onPressAndHold:
// {
// pressAndHold(mouse)
// }
}
RowLayout
......@@ -103,7 +109,8 @@ ItemDelegate
}
fillMode: Image.PreserveAspectFit
cache: false
antialiasing: true
antialiasing: false
smooth: true
}
onDoubleClicked: artworkCoverDoubleClicked()
......@@ -267,29 +274,29 @@ ItemDelegate
font.pointSize: 8
color: textColor
onTextChanged: animBabe.start()
SequentialAnimation
{
id: animBabe
PropertyAnimation
{
target: trackBabe
property: "color"
easing.type: Easing.InOutQuad
to: babeColor
duration: 250
}
PropertyAnimation
{
target: trackBabe
property: "color"
easing.type: Easing.InOutQuad
to: textColor
duration: 500
}
}
// onTextChanged: animBabe.start()
// SequentialAnimation
// {
// id: animBabe
// PropertyAnimation
// {
// target: trackBabe
// property: "color"
// easing.type: Easing.InOutQuad
// to: babeColor
// duration: 250
// }
// PropertyAnimation
// {
// target: trackBabe
// property: "color"
// easing.type: Easing.InOutQuad
// to: textColor
// duration: 500
// }
// }
}
......@@ -318,21 +325,21 @@ ItemDelegate
}
}
Item
{
visible: menuItem
Layout.fillHeight: true
width: sameAlbum ? rowHeight : parent.height
BabeButton
{
id: menuBtn
anchors.centerIn: parent
iconName: "overflow-menu"
iconColor: textColor
onClicked: rightClicked()
}
}
// Item
// {
// visible: menuItem
// Layout.fillHeight: true
// width: sameAlbum ? rowHeight : parent.height
// BabeButton
// {
// id: menuBtn
// anchors.centerIn: parent
// iconName: "overflow-menu"
// iconColor: textColor
// onClicked: rightClicked()
// }
// }
}
function setStars(stars)
......
......@@ -42,11 +42,13 @@ BabeMenu
function babeIt(index)
{
var url = list.model.get(index).url
var value = list.model.get(index).babe == "1" ? false : true
var url = listModel.get(index).url
var value = listModel.get(index).babe == "1" ? false : true
if(bae.babeTrack(url, value))
list.model.get(index).babe = value ? "1" : "0"
return value
}
Label
......
......@@ -21,6 +21,8 @@ ToolBar
signal playlistsViewClicked()
signal babeViewClicked()
signal playlistViewClicked()
signal searchViewClicked()
width: parent.width
id: babeBar
......@@ -50,10 +52,12 @@ ToolBar
RowLayout
{
anchors.fill: parent
BabeButton
{
id: playlistView
iconName: /*"headphones"*/ "media-optical-audio"
iconColor: (pageStack.wideMode || pageStack.currentIndex === 0 ) && !isMobile ? accentColor : textColor
onClicked: playlistViewClicked()
......@@ -131,28 +135,42 @@ ToolBar
ToolTip.text: qsTr("Playlists")
}
Item
{
Layout.fillWidth: true
Layout.alignment: Qt.AlignRight
}
BabeButton
{
iconName: "love"
iconColor: accent && currentIndex === 4? accentColor : textColor
onClicked: babeViewClicked()
id: searchView
iconColor: accent && currentIndex === 5? accentColor : textColor
// visible: !(searchInput.focus || searchInput.text)
iconName: "edit-find" //"search"
onClicked: searchViewClicked()
hoverEnabled: !isMobile
ToolTip.delay: 1000
ToolTip.timeout: 5000
ToolTip.visible: hovered && !isMobile
ToolTip.text: qsTr("Babe")
ToolTip.text: qsTr("Search")
}
// BabeButton
// {
// iconName: "love"
// iconColor: accent && currentIndex === 4? accentColor : textColor
// onClicked: babeViewClicked()
// hoverEnabled: !isMobile
// ToolTip.delay: 1000
// ToolTip.timeout: 5000
// ToolTip.visible: hovered && !isMobile
// ToolTip.text: qsTr("Babe")
// }
}
}
......@@ -18,10 +18,7 @@ Item
id: mainPlaylistRoot
property var currentTrack
property int currentTrackIndex : 0
property int prevTrackIndex : 0
property string currentArtwork
property alias artwork : artwork
property alias cover : cover
property alias list : list
......@@ -38,6 +35,17 @@ Item
// else
// root.width = coverSize*3
// }
PlaylistMenu
{
id: playlistMenu
onClearOut: Player.clearOutPlaylist()
onHideCover: cover.visible = !cover.visible
onClean: Player.cleanPlaylist()
onSaveToClicked: list.saveList()
}
Rectangle
{
anchors.fill: parent
......@@ -97,15 +105,23 @@ Item