Commit 0df0bfa4 authored by eekkelund's avatar eekkelund

[NotificationItem] Minor improvements across glacier-home and timestamps added to notifications

parent 354a94dd
......@@ -74,7 +74,7 @@ Item {
Flickable {
id: flickable
contentHeight: gridview.height
width: closeMode ? parent.width - Theme.itemSpacingLarge : parent.width // see comment re right anchor below
width: closeMode ? parent.width - Theme.itemSpacingLarge : parent.width - Theme.itemSpacingSmall // see comment re right anchor below
MouseArea {
height: flickable.contentHeight > flickable.height ? flickable.contentHeight : flickable.height
width: flickable.width
......@@ -88,17 +88,17 @@ Item {
anchors {
top: parent.top
topMargin: closeMode ? Theme.itemSpacingLarge : 0
topMargin: closeMode ? Theme.itemSpacingLarge : Theme.itemSpacingSmall
bottom: toolBar.top
left: parent.left
// no right anchor to avoid double margin (complicated math)
leftMargin: closeMode ? Theme.itemSpacingLarge : 0
leftMargin: closeMode ? Theme.itemSpacingLarge : Theme.itemSpacingSmall
}
Grid {
id: gridview
columns: 2
spacing: closeMode ? Theme.itemSpacingLarge : 0
spacing: closeMode ? Theme.itemSpacingLarge : Theme.itemSpacingSmall
move: Transition {
NumberAnimation {
properties: "x,y"
......@@ -159,17 +159,9 @@ Item {
closeMode = false
}
}
Rectangle {
Item {
id: toolBar
color: Theme.backgroundColor
border {
width: 1
color: Theme.fillDarkColor
}
z: 202
height:Theme.itemHeightExtraLarge + 2*padding
property int padding: Theme.itemSpacingSmall
anchors {
left: parent.left
right: parent.right
......@@ -177,8 +169,20 @@ Item {
margins: -1
bottomMargin: switcherRoot.closeMode ? statusbar.height : -height
}
Behavior on anchors.bottomMargin { PropertyAnimation { duration: 100 } }
z: 202
height:Theme.itemHeightExtraLarge + 2 * toolBar.padding
Rectangle {
anchors.fill: parent
color: Theme.fillDarkColor
opacity: 0.3
border {
width: 1
color: Theme.backgroundColor
}
}
Row {
anchors {
top: parent.top
......@@ -187,7 +191,7 @@ Item {
left: parent.left
bottom: parent.bottom
}
spacing: toolBar.padding*2
spacing: toolBar.padding * 2
Button {
id: toolBarDone
......
......@@ -81,20 +81,33 @@ Flickable {
}
}
}
Timer {
id: timestampTimer
interval: 60000
running: true
repeat: true
}
Column {
id: notificationColumn
width: parent.width
anchors{
top: daterow.bottom
topMargin: Theme.itemSpacingHuge
topMargin: Theme.itemHeightLarge
}
spacing: Theme.itemSpacingHuge
spacing: Theme.itemSpacingMedium
Repeater {
model: NotificationListModel {
id: notifmodel
}
delegate: NotificationItem{}
delegate: NotificationItem{
id: notifItem
Connections {
target: timestampTimer
onTriggered: notifItem.refreshTimestamp()
onRunningChanged: if (timestampTimer.running) notifItem.refreshTimestamp()
}
}
}
}
}
......
......@@ -80,12 +80,13 @@ Image {
right:parent.right
rightMargin: Theme.itemSpacingLarge
}
interactive:false
spacing: 0
interactive:DeviceLock.state !== DeviceLock.Locked
spacing: Theme.itemSpacingExtraSmall
model: NotificationListModel {
id: notifmodel
}
clip:true
delegate: NotificationItem {
enabled:DeviceLock.state !== DeviceLock.Locked
scale: notificationColumn.opacity
......@@ -93,11 +94,13 @@ Image {
iconSize: Theme.itemHeightMedium
appName.font.pixelSize: Theme.fontSizeSmall
appName.visible: DeviceLock.state !== DeviceLock.Locked
appName.anchors.verticalCenter: appIcon.verticalCenter
appName.anchors.top: null
appName.anchors.verticalCenter: labelColumn.verticalCenter
appBody.font.pixelSize: Theme.fontSizeTiny
appBody.visible: false
appTimestamp.visible: false
appSummary.visible: false
pressBg.visible: DeviceLock.state !== DeviceLock.Locked
pressBg.opacity: 0.3
}
}
}
......@@ -100,7 +100,7 @@ MouseArea {
CloseButton {
id: closeButton
width: parent.width/4
width: rotateWindowContent ? parent.width/4 :parent.height/4
height: width
Behavior on scale { PropertyAnimation { duration: 300; easing.type: Easing.OutBack } }
scale: switcherRoot.closeMode ? 1 : 0
......
......@@ -5,15 +5,18 @@ import QtQuick.Controls.Styles.Nemo 1.0
MouseArea {
id: notifyArea
height: childrenRect.height
height: Theme.itemHeightExtraLarge*1.2
width: parent.width
property alias appIcon: appIcon
property alias appBody: appBody
property alias appName: appName
property alias appSummary: appSummary
property int iconSize: Theme.itemHeightExtraLarge
property alias labelColumn: labelColumn
property alias appTimestamp: appTimestamp
property alias pressBg: pressBg
property int iconSize:Math.min(Theme.iconSizeLauncher, height-Theme.itemSpacingMedium)
property string timeAgo
drag.target: notifyArea
drag.axis: Drag.XAxis
......@@ -27,6 +30,49 @@ MouseArea {
}
}
function refreshTimestamp() {
var seconds = Math.floor((new Date() - modelData.timestamp) / 1000)
var years = Math.floor(seconds / (365*24*60*60))
var months = Math.floor(seconds / (30*24*60*60))
var days = Math.floor(seconds / (24*60*60))
var hours = Math.floor(seconds / (60*60))
var minutes = Math.floor(seconds / 60)
if (years >= 1) {
if(years > 1) {
timeAgo = years + " " + qsTr("years ago")
} else {
timeAgo = years + " " + qsTr("year ago")
}
}else if (months >= 1) {
if (months > 1) {
timeAgo = months +" " + qsTr("months ago")
} else {
timeAgo = months +" " + qsTr("month ago")
}
}else if (days >= 1) {
if (days > 1) {
timeAgo = days + " " + qsTr("days ago")
} else {
timeAgo = days + " " + qsTr("day ago")
}
}else if (hours >= 1) {
if (hours >= 1) {
timeAgo = hours + " " + qsTr("hours ago")
} else {
timeAgo = hours + " " + qsTr("hour ago")
}
} else if (minutes >= 1) {
if (minutes > 1) {
timeAgo = minutes + " " + qsTr("minutes ago")
} else {
timeAgo = minutes + " " + qsTr("minute ago")
}
} else {
timeAgo = qsTr("Just now")
}
}
onClicked: {
if (modelData.userRemovable) {
slideAnimation.start()
......@@ -53,10 +99,12 @@ MouseArea {
}
Rectangle {
id:pressBg
anchors.fill: parent
color: "#11ffffff"
color: Theme.fillColor
visible: notifyArea.pressed
radius: Theme.itemSpacingMedium
opacity: 0.1
}
Image {
......@@ -68,6 +116,7 @@ MouseArea {
anchors{
left: parent.left
leftMargin: Theme.itemSpacingLarge
verticalCenter:parent.verticalCenter
}
source: {
......@@ -82,48 +131,65 @@ MouseArea {
}
}
}
Column {
id:labelColumn
anchors {
left:appIcon.right
leftMargin: Theme.itemSpacingLarge
verticalCenter: appIcon.verticalCenter
}
height: parent.height
width: parent.width-appIcon.width-Theme.itemSpacingLarge*2
Label {
id: appName
text: modelData.appName
width: (parent.width-appIcon.width)-Theme.itemSpacingHuge
width: parent.width-appTimestamp.width-Theme.itemSpacingSmall
color: Theme.textColor
font.pixelSize: Theme.fontSizeMedium
elide: Text.ElideRight
font.pixelSize: Theme.fontSizeSmall
font.capitalization: Font.AllUppercase
font.bold: true
anchors {
left: appIcon.right
top: parent.top
leftMargin: Theme.itemSpacingLarge
left: parent.left
}
}
Label {
id:appTimestamp
color: Theme.textColor
font.pixelSize: Theme.fontSizeTiny
text: if(timeAgo) timeAgo
horizontalAlignment: Text.AlignRight
anchors {
verticalCenter: appName.verticalCenter
rightMargin: Theme.itemSpacingSmall
right:labelColumn.right
}
Component.onCompleted: refreshTimestamp()
}
Label {
id: appSummary
text: modelData.summary
width: (parent.width-appIcon.width)-Theme.itemSpacingHuge
text: modelData.summary || modelData.previewSummary
width: parent.width-Theme.itemSpacingHuge
color: Theme.textColor
font.pixelSize: Theme.fontSizeSmall
//font.bold :true
//font.capitalization: Font.AllUppercase
font.pixelSize: Theme.fontSizeTiny
anchors{
left: appName.left
top: appName.bottom
topMargin: Theme.itemSpacingSmall
left: parent.left
// topMargin: Theme.itemSpacingSmall
}
elide: Text.ElideRight
}
Label {
id: appBody
width: (parent.width-appIcon.width)-Theme.itemSpacingHuge
text: modelData.body
width: parent.width-Theme.itemSpacingHuge
text: modelData.body || modelData.previewBody
color: Theme.textColor
font.pixelSize: Theme.fontSizeSmall
font.pixelSize: Theme.fontSizeTiny
anchors{
left: appName.left
top: appSummary.bottom
left: parent.left
}
elide: Text.ElideRight
}
}
}
......@@ -136,7 +136,7 @@ Item {
Label {
id: summary
anchors {
top: parent.top
top: icon.top
left: icon.right
right: parent.right
topMargin: notificationArea.notificationMargin
......@@ -144,11 +144,13 @@ Item {
rightMargin: notificationArea.notificationMargin
//bottomMargin: notificationArea.notificationMargin
}
font.pixelSize: Theme.fontSizeMedium
height: if(!text) 0
font.pixelSize: Theme.fontSizeTiny
text: notificationPreviewPresenter.notification != null ? notificationPreviewPresenter.notification.previewSummary : ""
color: Theme.textColor
clip: true
elide: Text.ElideRight
Component.onCompleted: console.log(height, "--", notificationPreviewPresenter.notification != null)
}
Label {
......@@ -158,9 +160,10 @@ Item {
left: summary.left
right: summary.right
}
height: if(!text) 0
font {
pixelSize: Theme.fontSizeSmall
bold: true
pixelSize: Theme.fontSizeSmall
}
text: notificationPreviewPresenter.notification != null ? notificationPreviewPresenter.notification.previewBody : ""
color: Theme.textColor
......
......@@ -55,7 +55,7 @@ Rectangle {
Rectangle{
anchors.fill: parent
color: "#313131"
color: Theme.fillDarkColor
opacity: 0.3
}
......
......@@ -22,7 +22,7 @@ Item {
Rectangle{
anchors.fill:parent
opacity: 0.8
opacity: 0.6
color: Theme.fillDarkColor
visible: panel_loader.visible && (panel_loader.sourceComponent == panel)
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment