Commit a6da910c authored by Camilo Higuita's avatar Camilo Higuita

ui fixes on android and desktop, custom menuitems and moodtags return

parent 4a2868f8
...@@ -242,6 +242,18 @@ QString Babe::backgroundColor() ...@@ -242,6 +242,18 @@ QString Babe::backgroundColor()
QString Babe::foregroundColor() QString Babe::foregroundColor()
{ {
#if defined(Q_OS_ANDROID)
return "#FFF";
#elif defined(Q_OS_LINUX)
QWidget widget;
return widget.palette().color(QPalette::Foreground).name();
#elif defined(Q_OS_WIN32)
return "#FFF";
#endif
}
QString Babe::textColor()
{
#if defined(Q_OS_ANDROID) #if defined(Q_OS_ANDROID)
return "#FFF"; return "#FFF";
#elif defined(Q_OS_LINUX) #elif defined(Q_OS_LINUX)
...@@ -267,12 +279,12 @@ QString Babe::hightlightColor() ...@@ -267,12 +279,12 @@ QString Babe::hightlightColor()
QString Babe::midColor() QString Babe::midColor()
{ {
#if defined(Q_OS_ANDROID) #if defined(Q_OS_ANDROID)
return "#31363b"; return "#3e444b";
#elif defined(Q_OS_LINUX) #elif defined(Q_OS_LINUX)
QWidget widget; QWidget widget;
return widget.palette().color(QPalette::Midlight).name(); return widget.palette().color(QPalette::Midlight).name();
#elif defined(Q_OS_WIN32) #elif defined(Q_OS_WIN32)
return "#31363b"; return "#3e444b";
#endif #endif
} }
...@@ -321,6 +333,13 @@ int Babe::cursorPos(QString &axis) ...@@ -321,6 +333,13 @@ int Babe::cursorPos(QString &axis)
else return 0; else return 0;
} }
QString Babe::moodColor(const int &pos)
{
if(pos < BAE::MoodColors.size())
return BAE::MoodColors.at(pos);
else return "";
}
QString Babe::homeDir() QString Babe::homeDir()
{ {
return BAE::MusicPath; return BAE::MusicPath;
......
...@@ -63,6 +63,7 @@ public: ...@@ -63,6 +63,7 @@ public:
Q_INVOKABLE static QString backgroundColor(); Q_INVOKABLE static QString backgroundColor();
Q_INVOKABLE static QString foregroundColor(); Q_INVOKABLE static QString foregroundColor();
Q_INVOKABLE static QString textColor();
Q_INVOKABLE static QString hightlightColor(); Q_INVOKABLE static QString hightlightColor();
Q_INVOKABLE static QString midColor(); Q_INVOKABLE static QString midColor();
Q_INVOKABLE static QString altColor(); Q_INVOKABLE static QString altColor();
...@@ -72,6 +73,8 @@ public: ...@@ -72,6 +73,8 @@ public:
Q_INVOKABLE static int screenGeometry(QString &side); Q_INVOKABLE static int screenGeometry(QString &side);
Q_INVOKABLE static int cursorPos(QString &axis); Q_INVOKABLE static int cursorPos(QString &axis);
Q_INVOKABLE static QString moodColor(const int &pos);
Q_INVOKABLE static QString homeDir(); Q_INVOKABLE static QString homeDir();
Q_INVOKABLE static QVariantList getDirs(const QString &pathUrl); Q_INVOKABLE static QVariantList getDirs(const QString &pathUrl);
......
...@@ -35,5 +35,6 @@ ...@@ -35,5 +35,6 @@
<file>view_models/FolderPickerList.qml</file> <file>view_models/FolderPickerList.qml</file>
<file>view_models/FolderPickerDelegate.qml</file> <file>view_models/FolderPickerDelegate.qml</file>
<file>utils/BabeIcon.qml</file> <file>utils/BabeIcon.qml</file>
<file>view_models/TableMenuItem.qml</file>
</qresource> </qresource>
</RCC> </RCC>
...@@ -11,5 +11,7 @@ Theme=Light ...@@ -11,5 +11,7 @@ Theme=Light
[Material] [Material]
Theme=Light Theme=Light
;Accent=BlueGrey Accent=#E91E63
;Primary=BlueGray Primary=#31363b
Foreground=#FFFFFF
Background=#31363b
...@@ -12,7 +12,7 @@ Pane ...@@ -12,7 +12,7 @@ Pane
property alias gridModel: gridModel property alias gridModel: gridModel
property alias grid: grid property alias grid: grid
signal albumCoverClicked(string album, string artist) signal albumCoverClicked(string album, string artist)
signal bgClicked()
width: 500 width: 500
height: 400 height: 400
...@@ -29,6 +29,12 @@ Pane ...@@ -29,6 +29,12 @@ Pane
gridModel.clear() gridModel.clear()
} }
MouseArea
{
anchors.fill: parent
onClicked: bgClicked()
}
BabeHolder BabeHolder
{ {
visible: grid.count === 0 visible: grid.count === 0
...@@ -40,6 +46,12 @@ Pane ...@@ -40,6 +46,12 @@ Pane
GridView GridView
{ {
id: grid id: grid
MouseArea
{
anchors.fill: parent
onClicked: bgClicked()
z: -999
}
width: Math.min(model.count, Math.floor(parent.width/cellWidth))*cellWidth width: Math.min(model.count, Math.floor(parent.width/cellWidth))*cellWidth
height: parent.height height: parent.height
...@@ -58,11 +70,12 @@ Pane ...@@ -58,11 +70,12 @@ Pane
snapMode: GridView.SnapToRow snapMode: GridView.SnapToRow
// flow: GridView.FlowTopToBottom // flow: GridView.FlowTopToBottom
// maximumFlickVelocity: albumSize*8 // maximumFlickVelocity: albumSize*8
model: gridModel model: gridModel
SystemPalette { id: myPalette; colorGroup: SystemPalette.Active } SystemPalette { id: myPalette; colorGroup: SystemPalette.Active }
// highlight: Rectangle // highlight: Rectangle
// { // {
// id: highlight // id: highlight
......
...@@ -74,10 +74,10 @@ ListView ...@@ -74,10 +74,10 @@ ListView
} }
} }
TableMenu TableMenu
{ {
id: contextMenu id: contextMenu
} }
ListModel { id: listModel } ListModel { id: listModel }
...@@ -102,7 +102,7 @@ ListView ...@@ -102,7 +102,7 @@ ListView
onClicked: onClicked:
{ {
currentIndex = index currentIndex = index
list.rowClicked(index) list.rowClicked(index)
} }
onPlay: list.quickPlayTrack(index) onPlay: list.quickPlayTrack(index)
...@@ -110,7 +110,9 @@ ListView ...@@ -110,7 +110,9 @@ ListView
{ {
currentRow = index currentRow = index
contextMenu.rate = bae.trackRate(list.model.get(currentRow).url) contextMenu.rate = bae.trackRate(list.model.get(currentRow).url)
contextMenu.open() if(bae.isMobile()) contextMenu.open()
else
contextMenu.popup()
list.rowPressed(index) list.rowPressed(index)
} }
......
...@@ -24,7 +24,10 @@ ItemDelegate ...@@ -24,7 +24,10 @@ ItemDelegate
{ {
if(!bae.isMobile()) if(!bae.isMobile())
if (mouse.button === Qt.RightButton) if (mouse.button === Qt.RightButton)
{
menuClicked() menuClicked()
}
} }
} }
...@@ -36,6 +39,7 @@ ItemDelegate ...@@ -36,6 +39,7 @@ ItemDelegate
rows:2 rows:2
columns:4 columns:4
ToolButton ToolButton
{ {
id: playBtn id: playBtn
......
...@@ -11,16 +11,25 @@ Menu ...@@ -11,16 +11,25 @@ Menu
id: rootMenu id: rootMenu
x: parent.width / 2 - width / 2 x: parent.width / 2 - width / 2
y: parent.height / 2 - height / 2 y: parent.height / 2 - height / 2
modal: true modal: bae.isMobile()
focus: true
property int rate : 0 property int rate : 0
property string starColor : "#FFC107" property string starColor : "#FFC107"
property string starReg : "gray" property string starReg : bae.foregroundColor()
property string starIcon: MdiFont.Icon.star property string starIcon: MdiFont.Icon.star
property int starSize : 22 property int assetsize : menuItemHeight/2
property int menuItemHeight : bae.isMobile() ? 48 : 32;
signal rated(int value) signal rated(int value)
enter: Transition {
NumberAnimation { property: "opacity"; from: 0.0; to: 1.0 }
}
function rateIt(rank) function rateIt(rank)
{ {
rate = rank rate = rank
...@@ -28,55 +37,84 @@ Menu ...@@ -28,55 +37,84 @@ Menu
} }
Label background: Rectangle
{ {
padding: 10 implicitWidth: 200
font.bold: true implicitHeight: 40
width: parent.width color: bae.backgroundColor()
horizontalAlignment: Qt.AlignHCenter border.color: bae.midColor()
elide: Text.ElideRight border.width: 1
text: currentRow >= 0 ? list.model.get(currentRow).title : "" radius: 4
} }
MenuItem
// Label
// {
// id: titleLabel
// visible: bae.isMobile()
// padding: bae.isMobile() ? 10 : 0
// font.bold: true
// width: parent.width
// height: bae.isMobile() ? menuItemHeight : 0
// horizontalAlignment: Qt.AlignHCenter
// elide: Text.ElideRight
// text: currentRow >= 0 ? list.model.get(currentRow).title : ""
// color: bae.foregroundColor()
// }
TableMenuItem
{ {
text: qsTr("Babe it") height: menuItemHeight
onTriggered: ; txt: "Babe it"
onTriggered: {}
} }
MenuItem
TableMenuItem
{ {
text: qsTr("Queue") height: menuItemHeight
onTriggered: txt: "Queue"
{ onTriggered: list.queueTrack(currentRow)
console.log(currentRow)
list.queueTrack(currentRow)
}
} }
MenuItem
TableMenuItem
{ {
text: qsTr("Edit...") height: menuItemHeight
onTriggered: ; txt: "Edit..."
onTriggered: {}
} }
MenuItem
TableMenuItem
{ {
text: qsTr("Remove") height: menuItemHeight
onTriggered: ; txt: "Remove"
onTriggered: {}
} }
MenuItem
TableMenuItem
{ {
text: qsTr("Edit...") height: menuItemHeight
onTriggered: ; txt: "Save..."
onTriggered: {}
} }
MenuItem
TableMenuItem
{ {
text: qsTr("Remove") height: menuItemHeight
onTriggered: ; txt: "Send to..."
onTriggered: {}
} }
MenuItem MenuItem
{ {
height: menuItemHeight
hoverEnabled: true
padding: 10
RowLayout RowLayout
{ {
anchors.fill: parent anchors.fill: parent
ToolButton ToolButton
{ {
Layout.fillHeight: true Layout.fillHeight: true
...@@ -86,7 +124,7 @@ Menu ...@@ -86,7 +124,7 @@ Menu
{ {
text: starIcon text: starIcon
color: rate >= 1 ? starColor :starReg color: rate >= 1 ? starColor :starReg
iconSize: starSize iconSize: assetsize
} }
onClicked: rateIt(1) onClicked: rateIt(1)
...@@ -100,7 +138,7 @@ Menu ...@@ -100,7 +138,7 @@ Menu
{ {
text: starIcon text: starIcon
color: rate >= 2 ? starColor :starReg color: rate >= 2 ? starColor :starReg
iconSize: starSize iconSize: assetsize
} }
onClicked: rateIt(2) onClicked: rateIt(2)
...@@ -114,41 +152,152 @@ Menu ...@@ -114,41 +152,152 @@ Menu
{ {
text: starIcon text: starIcon
color: rate >= 3 ? starColor :starReg color: rate >= 3 ? starColor :starReg
iconSize: starSize iconSize: assetsize
} }
onClicked: rateIt(3) onClicked: rateIt(3)
} }
// ToolButton ToolButton
// { {
// Layout.fillHeight: true Layout.fillHeight: true
// Layout.fillWidth: true Layout.fillWidth: true
// Layout.alignment: Qt.AlignCenter Layout.alignment: Qt.AlignCenter
// BabeIcon BabeIcon
// { {
// text: starIcon text: starIcon
// color: rate >= 4 ? starColor :starReg color: rate >= 4 ? starColor :starReg
// iconSize: starSize iconSize: assetsize
// } }
// onClicked: rateIt(4) onClicked: rateIt(4)
// } }
// ToolButton ToolButton
// { {
// Layout.fillHeight: true Layout.fillHeight: true
// Layout.fillWidth: true Layout.fillWidth: true
// Layout.alignment: Qt.AlignCenter Layout.alignment: Qt.AlignCenter
// BabeIcon BabeIcon
// { {
// text: starIcon text: starIcon
// color: rate >= 5 ? starColor :starReg color: rate >= 5 ? starColor :starReg
// iconSize: starSize iconSize: assetsize
// } }
// onClicked: rateIt(5) onClicked: rateIt(5)
// } }
}
}
MenuItem
{
height: menuItemHeight
hoverEnabled: true
padding: 10
RowLayout
{
anchors.fill: parent
ToolButton
{
Layout.fillHeight: true
Layout.fillWidth: true
Layout.alignment: Qt.AlignCenter
Rectangle
{
anchors.centerIn: parent
width: assetsize
height: assetsize
color: bae.moodColor(0)
radius: 2
border.color: bae.altColor()
border.width: 1
}
onClicked: {}
}
ToolButton
{
Layout.fillHeight: true
Layout.fillWidth: true
Layout.alignment: Qt.AlignCenter
Rectangle
{
anchors.centerIn: parent
width: assetsize
height: assetsize
color: bae.moodColor(1)
radius: 2
border.color: bae.altColor()
border.width: 1
}
onClicked: {}
}
ToolButton
{
Layout.fillHeight: true
Layout.fillWidth: true
Layout.alignment: Qt.AlignCenter
Rectangle
{
anchors.centerIn: parent
width: assetsize
height: assetsize
color: bae.moodColor(2)
radius: 2
border.color: bae.altColor()
border.width: 1
}
onClicked: {}
}
ToolButton
{
Layout.fillHeight: true
Layout.fillWidth: true
Layout.alignment: Qt.AlignCenter
Rectangle
{
anchors.centerIn: parent
width: assetsize
height: assetsize
color: bae.moodColor(3)
radius: 2
border.color: bae.altColor()
border.width: 1
}
onClicked: {}
}
ToolButton
{
Layout.fillHeight: true
Layout.fillWidth: true
Layout.alignment: Qt.AlignCenter
Rectangle
{
anchors.centerIn: parent
width: assetsize
height: assetsize
color: bae.moodColor(4)
radius: 2
border.color: bae.altColor()
border.width: 1
}
onClicked: {}
}
......
import QtQuick 2.0
import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3
import "../utils/Icons.js" as MdiFont
import "../utils/Help.js" as H
import "../utils"
MenuItem
{
id: tableMenuItemRoot
property string txt
// background: Rectangle
// {
// color: tableMenuItemRoot.hovered ? bae.hightlightColor() : bae.backgroundColor()
// }
hoverEnabled: true
Label
{
width: parent.width
height: parent.height
text: txt
padding: 10
color: bae.foregroundColor()
horizontalAlignment: Qt.AlignLeft
verticalAlignment: Qt.AlignVCenter
elide: Text.ElideRight
}
}
...@@ -34,6 +34,9 @@ BabeGrid ...@@ -34,6 +34,9 @@ BabeGrid
y: (drawer.position * albumsViewGrid.height * 0.33)*-1 y: (drawer.position * albumsViewGrid.height * 0.33)*-1
} }
onBgClicked: if(drawer.visible) drawer.close()
onFocusChanged: drawer.close()
Drawer Drawer
{ {
id: drawer id: drawer
...@@ -42,14 +45,18 @@ BabeGrid ...@@ -42,14 +45,18 @@ BabeGrid
edge: Qt.BottomEdge edge: Qt.BottomEdge
interactive: false interactive: false
focus: true focus: true
modal:true modal: bae.isMobile()
dragMargin: 0
background: Rectangle background: Rectangle
{ {
anchors.fill: parent anchors.fill: parent
z: -999 z: -999
color: bae.altColor() color: bae.altColor()
} }
Column Column
{ {
anchors.fill: parent anchors.fill: parent
......
...@@ -34,6 +34,9 @@ BabeGrid ...@@ -34,6 +34,9 @@ BabeGrid
y: (drawer.position * artistsViewGrid.height * 0.33)*-1 y: (drawer.position * artistsViewGrid.height * 0.33)*-1
} }
onBgClicked: if(drawer.visible) drawer.close()
onFocusChanged: drawer.close()
Drawer Drawer
{ {
id: drawer id: drawer
...@@ -41,6 +44,12 @@ BabeGrid ...@@ -41,6 +44,12 @@ BabeGrid
width: parent.width width: parent.width
edge: Qt.BottomEdge edge: Qt.BottomEdge
interactive: false interactive: false
focus: true
modal: bae.isMobile()
dragMargin: 0
clip: true
background: Rectangle background: Rectangle
{ {
......
...@@ -129,8 +129,8 @@ Item ...@@ -129,8 +129,8 @@ Item
Layout.column: 1 Layout.column: 1
Layout.fillWidth: true Layout.fillWidth: true
height: 48 height: 48
// anchors.top: cover.bottom
visible: list.count>0 visible: list.count > 0
Rectangle Rectangle