status-im
/
status-desktop
mirror of https://github.com/status-im/status-desktop.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: improve style of the notification box 

Use the Channel box for that
This commit is contained in:
Jonathan Rainville 2020-08-05 14:18:07 -04:00 committed by Iuri Matias
parent 441d58a4cb
commit 156aaba0aa
6 changed files with 88 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/chat/view.nim
View File

@ -206,7 +206,7 @@ QtObject:
proc messagePushed*(self: ChatsView) {.signal.}
proc newMessagePushed*(self: ChatsView) {.signal.}
proc messageNotificationPushed*(self: ChatsView, chatId: string, text: string) {.signal.}
proc messageNotificationPushed*(self: ChatsView, chatId: string, text: string, messageType: string, chatType: int, timestamp: string, identicon: string, username: string) {.signal.}
proc messagesCleared*(self: ChatsView) {.signal.}
@ -222,7 +222,8 @@ QtObject:
self.messagePushed()
if self.channelOpenTime.getOrDefault(msg.chatId, high(int64)) < msg.timestamp.parseFloat.fromUnixFloat.toUnix:
if msg.chatId != self.activeChannel.id:
self.messageNotificationPushed(msg.chatId, msg.text)
let channel = self.chats.getChannelById(msg.chatId)
self.messageNotificationPushed(msg.chatId, msg.text, msg.messageType, channel.chatType.int, msg.timestamp, msg.identicon, msg.alias)
else:
self.newMessagePushed()

11
src/app/chat/views/channels_list.nim
View File

@ -96,6 +96,11 @@ QtObject:
proc getChannel*(self: ChannelsList, index: int): Chat = self.chats[index]
proc getChannelById*(self: ChannelsList, chatId: string): Chat =
for chat in self.chats:
if chat.id == chatId:
return chat
proc upsertChannel(self: ChannelsList, channel: Chat): int =
let idx = self.chats.findIndexById(channel.id)
if idx == -1:
@ -109,9 +114,9 @@ QtObject:
result = idx
proc getChannelColor*(self: ChannelsList, name: string): string =
for chat in self.chats:
if chat.name == name:
return chat.color
let channel = self.getChannelById(name)
if (channel == nil): return
return channel.color
proc updateChat*(self: ChannelsList, channel: Chat, moveToTop: bool = true) =
let idx = self.upsertChannel(channel)

6
ui/app/AppLayouts/Chat/ChatColumn/ChatMessages.qml
View File

@ -120,7 +120,7 @@ ScrollView {
}
onActiveChannelChanged: {
chatLogView.scrollToBottom(true)
Qt.callLater(chatLogView.scrollToBottom.bind(this, true))
}
onSendingMessage: {
@ -140,8 +140,8 @@ ScrollView {
}, 500);
}
onMessageNotificationPushed: function(chatId, msg) {
notificationWindow.notifyUser(chatId, msg)
onMessageNotificationPushed: function(chatId, msg, messageType, chatType, timestamp, identicon, username) {
notificationWindow.notifyUser(chatId, msg, messageType, chatType, timestamp, identicon, username)
}
}

3
ui/app/AppLayouts/Chat/ContactsColumn/Channel.qml
View File

@ -9,6 +9,7 @@ Rectangle {
property string lastMessage: "My latest message\n with a return"
property string timestamp: "20/2/2020"
property string unviewedMessagesCount: "2"
property string identicon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAGQAQMAAAC6caSPAAAABlBMVEXMzMz////TjRV2AAAAAWJLR0QB/wIt3gAAACpJREFUGBntwYEAAAAAw6D7Uw/gCtUAAAAAAAAAAAAAAAAAAAAAAAAAgBNPsAABAjKCqQAAAABJRU5ErkJggg=="
property bool hasMentions: false
property int chatType: Constants.chatTypePublic
property string searchStr: ""
@ -47,7 +48,7 @@ Rectangle {
fontSize: !isCompact ? this.defaultFontSize : 14
channelName: wrapper.name
channelType: wrapper.chatType
channelIdenticon: identicon
channelIdenticon: wrapper.identicon
anchors.left: parent.left
anchors.leftMargin: !isCompact ? Style.current.padding : Style.current.smallPadding
anchors.verticalCenter: parent.verticalCenter

1
ui/app/AppLayouts/Chat/ContactsColumn/ChannelList.qml
View File

@ -28,6 +28,7 @@ ScrollView {
lastMessage: model.lastMessage
timestamp: model.timestamp
chatType: model.chatType
identicon: model.identicon
unviewedMessagesCount: model.unviewedMessagesCount
hasMentions: model.hasMentions
contentType: model.contentType

106
ui/shared/NotificationWindow.qml
View File

@ -2,23 +2,33 @@ import QtQuick 2.13
import QtQuick.Controls 2.13
import QtQuick.Window 2.12
import QtQml 2.13
import QtGraphicalEffects 1.13
import "../imports"
import "../app/AppLayouts/Chat/ContactsColumn"
Item {
id: root
property var chatId: ""
property var message: "hello"
property var processClick : Backpressure.oneInTime(root, 1000, function() {
property string chatId: ""
property string message: "Everything is connected"
property int messageType: 1
property int chatType: 1
property string timestamp: "20/2/2020"
property string identicon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAGQAQMAAAC6caSPAAAABlBMVEXMzMz////TjRV2AAAAAWJLR0QB/wIt3gAAACpJREFUGBntwYEAAAAAw6D7Uw/gCtUAAAAAAAAAAAAAAAAAAAAAAAAAgBNPsAABAjKCqQAAAABJRU5ErkJggg=="
property string username: "@jonas"
property var processClick: Backpressure.oneInTime(root, 1000, function () {
notificationSound.play()
var w1 = winInit.createObject(null)
w1.destroy()
});
})
Component {
id: winInit
Window {
flags: Qt.WindowStaysOnTopHint | Qt.WindowStaysOnTopHint | Qt.Popup | Qt.WA_ShowWithoutActivating | Qt.WindowStaysOnTopHint | Qt.BypassWindowManagerHint | Qt.WindowStaysOnTopHint
flags: Qt.WindowStaysOnTopHint | Qt.WindowStaysOnTopHint | Qt.Popup
| Qt.WA_ShowWithoutActivating | Qt.WindowStaysOnTopHint
| Qt.BypassWindowManagerHint | Qt.WindowStaysOnTopHint
width: 1
height: 1
Component.onCompleted: {
@ -33,62 +43,87 @@ Item {
Window {
id: notificationWindowSub
flags: Qt.FramelessWindowHint | Qt.WindowStaysOnTopHint | Qt.WA_ShowWithoutActivating | Qt.BypassWindowManagerHint | Qt.WindowStaysOnTopHint | Qt.BypassWindowManagerHint
x: Screen.width - 250
flags: Qt.FramelessWindowHint | Qt.WindowStaysOnTopHint
| Qt.WA_ShowWithoutActivating | Qt.BypassWindowManagerHint
| Qt.WindowStaysOnTopHint | Qt.BypassWindowManagerHint
width: 300 + 10
height: channelNotif.height + 10
x: Screen.width - (width + 50)
y: 50
width: 200
height: 100
visible: true
color: Style.current.transparent
Rectangle {
Channel {
id: channelNotif
name: root.chatType === Constants.chatTypeOneToOne ? root.username : root.chatId
lastMessage: root.message
timestamp: root.timestamp
chatType: root.chatType
unviewedMessagesCount: "0"
hasMentions: false
contentType: root.messageType
identicon: root.identicon
searchStr: ""
isCompact: false
color: Style.current.background
anchors.rightMargin: 10
}
DropShadow {
anchors.fill: channelNotif
horizontalOffset: 2
verticalOffset: 5
visible: channelNotif.visible
source: channelNotif
radius: 10
samples: 15
color: "#ad000000"
}
MouseArea {
cursorShape: Qt.PointingHandCursor
anchors.fill: parent
color: "white"
Text {
anchors.centerIn: parent
text: message
MouseArea {
cursorShape: Qt.PointingHandCursor
anchors.fill: parent
onClicked: {
timer.stop()
notificationWindowSub.close()
mainWin.destroy()
applicationWindow.raise()
chatsModel.setActiveChannel(chatId);
}
}
onClicked: {
timer.stop()
notificationWindowSub.close()
applicationWindow.raise()
chatsModel.setActiveChannel(chatId)
}
}
Timer {
id: timer
interval: 4000;
running: false;
interval: 4000
running: false
repeat: false
onTriggered: {
notificationWindowSub.close()
notificationWindowSub.close()
}
}
onVisibleChanged: {
if(visible) {
timer.running = true;
if (visible) {
timer.running = true
if (applicationWindow.active) {
this.flags |= Qt.Popup
} else {
this.flags = Qt.FramelessWindowHint | Qt.WindowStaysOnTopHint | Qt.WA_ShowWithoutActivating | Qt.BypassWindowManagerHint | Qt.WindowStaysOnTopHint | Qt.BypassWindowManagerHint
this.flags = Qt.FramelessWindowHint | Qt.WindowStaysOnTopHint
| Qt.WA_ShowWithoutActivating | Qt.BypassWindowManagerHint
| Qt.WindowStaysOnTopHint | Qt.BypassWindowManagerHint
}
}
}
}
}
function notifyUser(chatId, msg) {
function notifyUser(chatId, msg, messageType, chatType, timestamp, identicon, username) {
this.chatId = chatId
this.message = msg
this.messageType = parseInt(messageType, 10)
this.chatType = chatType
this.timestamp = timestamp
this.identicon = identicon
this.username = username
processClick()
}
}
}
/*##^##
@ -96,3 +131,4 @@ Designer {
D{i:0;autoSize:true;height:480;width:640}
}
##^##*/