357 lines
11 KiB
QML
357 lines
11 KiB
QML
import QtQuick 2.14
|
||
import QtQuick.Layouts 1.3
|
||
import QtQuick.Controls 2.14
|
||
|
||
import utils 1.0
|
||
|
||
import StatusQ.Core 0.1
|
||
import StatusQ.Core.Theme 0.1
|
||
import StatusQ.Controls 0.1
|
||
|
||
import "../popups"
|
||
import shared 1.0
|
||
import shared.panels 1.0
|
||
import shared.views.chat 1.0
|
||
import shared.panels.chat 1.0
|
||
import shared.controls.chat 1.0
|
||
|
||
Item {
|
||
id: root
|
||
signal addBtnClicked()
|
||
signal selectEns(string username)
|
||
|
||
property var ensUsernamesStore
|
||
|
||
property int profileContentWidth
|
||
|
||
// Defaults to show message
|
||
property bool isMessage: true
|
||
property bool isEmoji: false
|
||
property bool isCurrentUser: false
|
||
property int contentType: 1
|
||
property string message: qsTr("Hey")
|
||
property string authorCurrentMsg: "0"
|
||
property string authorPrevMsg: "1"
|
||
property bool isText: true
|
||
property var clickMessage: function(){}
|
||
|
||
function shouldDisplayExampleMessage(){
|
||
return root.ensUsernamesStore.ensUsernamesModel.count > 0 &&
|
||
root.ensUsernamesStore.numOfPendingEnsUsernames() !== root.ensUsernamesStore.ensUsernamesModel &&
|
||
store.ensUsernamesStore.preferredUsername !== ""
|
||
}
|
||
anchors.fill: parent
|
||
|
||
Item {
|
||
anchors.top: parent.top
|
||
width: profileContentWidth
|
||
anchors.horizontalCenter: parent.horizontalCenter
|
||
|
||
Component {
|
||
id: statusENS
|
||
Item {
|
||
Text {
|
||
id: usernameTxt
|
||
text: username.substr(0, username.indexOf(".")) + " " + (isPending ? qsTr("(pending)") : "")
|
||
color: Style.current.textColor
|
||
}
|
||
|
||
Text {
|
||
|
||
anchors.top: usernameTxt.bottom
|
||
anchors.topMargin: 2
|
||
text: username.substr(username.indexOf("."))
|
||
color: Theme.palette.baseColor1
|
||
}
|
||
}
|
||
}
|
||
|
||
Component {
|
||
id: normalENS
|
||
Item {
|
||
Text {
|
||
id: usernameTxt
|
||
text: username + " " + (isPending ? qsTr("(pending)") : "")
|
||
font.pixelSize: 16
|
||
color: Theme.palette.directColor1
|
||
anchors.top: parent.top
|
||
anchors.topMargin: 5
|
||
}
|
||
}
|
||
}
|
||
|
||
Component {
|
||
id: ensDelegate
|
||
Item {
|
||
height: 45
|
||
anchors.left: parent.left
|
||
anchors.right: parent.right
|
||
|
||
MouseArea {
|
||
enabled: !model.isPending
|
||
anchors.fill: parent
|
||
cursorShape:enabled ? Qt.PointingHandCursor : Qt.ArrowCursor
|
||
onClicked: selectEns(model.ensUsername)
|
||
}
|
||
|
||
Rectangle {
|
||
id: circle
|
||
width: 35
|
||
height: 35
|
||
radius: 35
|
||
color: Theme.palette.primaryColor1
|
||
|
||
StatusBaseText {
|
||
text: "@"
|
||
opacity: 0.7
|
||
font.weight: Font.Bold
|
||
font.pixelSize: 16
|
||
color: Theme.palette.indirectColor1
|
||
anchors.centerIn: parent
|
||
verticalAlignment: Text.AlignVCenter
|
||
anchors.verticalCenter: parent.verticalCenter
|
||
}
|
||
}
|
||
|
||
Loader {
|
||
sourceComponent: model.ensUsername.endsWith(".stateofus.eth") ? statusENS : normalENS
|
||
property string username: model.ensUsername
|
||
property bool isPending: model.isPending
|
||
active: true
|
||
anchors.left: circle.right
|
||
anchors.leftMargin: Style.current.smallPadding
|
||
}
|
||
}
|
||
}
|
||
|
||
ENSPopup {
|
||
id: ensPopup
|
||
ensUsernamesStore: root.ensUsernamesStore
|
||
}
|
||
|
||
StatusBaseText {
|
||
id: sectionTitle
|
||
text: qsTr("ENS usernames")
|
||
anchors.left: parent.left
|
||
anchors.leftMargin: 24
|
||
anchors.top: parent.top
|
||
anchors.topMargin: 24
|
||
font.weight: Font.Bold
|
||
font.pixelSize: 20
|
||
color: Theme.palette.directColor1
|
||
}
|
||
|
||
Item {
|
||
id: addUsername
|
||
anchors.top: sectionTitle.bottom
|
||
anchors.topMargin: Style.current.bigPadding
|
||
width: addButton.width + usernameText.width + Style.current.padding
|
||
height: addButton.height
|
||
|
||
StatusRoundButton {
|
||
id: addButton
|
||
width: 40
|
||
height: 40
|
||
anchors.verticalCenter: parent.verticalCenter
|
||
icon.name: "add"
|
||
type: StatusRoundButton.Type.Secondary
|
||
}
|
||
|
||
StatusBaseText {
|
||
id: usernameText
|
||
text: qsTr("Add username")
|
||
color: Theme.palette.primaryColor1
|
||
anchors.left: addButton.right
|
||
anchors.leftMargin: Style.current.padding
|
||
anchors.verticalCenter: addButton.verticalCenter
|
||
font.pixelSize: 15
|
||
}
|
||
|
||
MouseArea {
|
||
anchors.fill: parent
|
||
cursorShape: Qt.PointingHandCursor
|
||
onClicked: addBtnClicked()
|
||
}
|
||
}
|
||
|
||
|
||
StatusBaseText {
|
||
id: usernamesLabel
|
||
text: qsTr("Your usernames")
|
||
anchors.left: parent.left
|
||
anchors.top: addUsername.bottom
|
||
anchors.topMargin: 24
|
||
font.pixelSize: 16
|
||
color: Theme.palette.directColor1
|
||
}
|
||
|
||
Item {
|
||
anchors.top: usernamesLabel.bottom
|
||
anchors.topMargin: 10
|
||
anchors.left: parent.left
|
||
anchors.right: parent.right
|
||
height: 200
|
||
id: ensList
|
||
|
||
ScrollView {
|
||
anchors.fill: parent
|
||
Layout.fillWidth: true
|
||
Layout.fillHeight: true
|
||
|
||
ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
|
||
ScrollBar.vertical.policy: lvEns.contentHeight > lvEns.height ? ScrollBar.AlwaysOn : ScrollBar.AlwaysOff
|
||
|
||
ListView {
|
||
id: lvEns
|
||
anchors.fill: parent
|
||
model: root.ensUsernamesStore.ensUsernamesModel
|
||
spacing: 10
|
||
clip: true
|
||
delegate: ensDelegate
|
||
}
|
||
}
|
||
}
|
||
|
||
Separator {
|
||
id: separator
|
||
anchors.topMargin: Style.current.padding
|
||
anchors.top: ensList.bottom
|
||
}
|
||
|
||
StatusBaseText {
|
||
id: chatSettingsLabel
|
||
visible: root.ensUsernamesStore.ensUsernamesModel.count > 0 &&
|
||
root.ensUsernamesStore.numOfPendingEnsUsernames() != root.ensUsernamesStore.ensUsernamesModel.count
|
||
text: qsTr("Chat settings")
|
||
anchors.left: parent.left
|
||
anchors.top: ensList.bottom
|
||
anchors.topMargin: 24
|
||
font.pixelSize: 16
|
||
color: Theme.palette.directColor1
|
||
}
|
||
|
||
Item {
|
||
width: childrenRect.width
|
||
height: childrenRect.height
|
||
|
||
id: preferredUsername
|
||
anchors.left: parent.left
|
||
anchors.top: chatSettingsLabel.bottom
|
||
anchors.topMargin: 24
|
||
|
||
StatusBaseText {
|
||
id: usernameLabel
|
||
visible: chatSettingsLabel.visible
|
||
text: qsTr("Primary Username")
|
||
font.pixelSize: 14
|
||
font.weight: Font.Bold
|
||
color: Theme.palette.directColor1
|
||
}
|
||
|
||
StatusBaseText {
|
||
id: usernameLabel2
|
||
visible: chatSettingsLabel.visible
|
||
text: root.ensUsernamesStore.preferredUsername || qsTr("None selected")
|
||
anchors.left: usernameLabel.right
|
||
anchors.leftMargin: Style.current.padding
|
||
font.pixelSize: 14
|
||
color: Theme.palette.directColor1
|
||
}
|
||
|
||
MouseArea {
|
||
anchors.fill: parent
|
||
cursorShape: Qt.PointingHandCursor
|
||
onClicked: ensPopup.open()
|
||
}
|
||
}
|
||
|
||
Item {
|
||
id: messagesShownAs
|
||
visible: shouldDisplayExampleMessage()
|
||
anchors.top: !visible ? separator.bottom : preferredUsername.bottom
|
||
anchors.topMargin: Style.current.padding * 2
|
||
|
||
UserImage {
|
||
id: chatImage
|
||
anchors.left: parent.left
|
||
anchors.leftMargin: Style.current.padding
|
||
anchors.top: parent.top
|
||
anchors.topMargin: 20
|
||
|
||
image: root.ensUsernamesStore.icon
|
||
|
||
onClicked: root.parent.clickMessage(true, false, false, null, false, false, false)
|
||
}
|
||
|
||
UsernameLabel {
|
||
id: chatName
|
||
anchors.leftMargin: 20
|
||
anchors.top: parent.top
|
||
anchors.topMargin: 0
|
||
anchors.left: chatImage.right
|
||
|
||
displayName: "@" + (root.ensUsernamesStore.preferredUsername.replace(".stateofus.eth", ""))
|
||
localName: ""
|
||
amISender: true
|
||
}
|
||
|
||
Rectangle {
|
||
property int chatVerticalPadding: 7
|
||
property int chatHorizontalPadding: 12
|
||
id: chatBox
|
||
color: Style.current.secondaryBackground
|
||
height: 35
|
||
width: 80
|
||
radius: 16
|
||
anchors.left: chatImage.right
|
||
anchors.leftMargin: 8
|
||
anchors.top: chatImage.top
|
||
|
||
ChatTextView {
|
||
id: chatText
|
||
message: root.message
|
||
anchors.top: parent.top
|
||
anchors.topMargin: chatBox.chatVerticalPadding
|
||
anchors.left: parent.left
|
||
anchors.leftMargin: chatBox.chatHorizontalPadding
|
||
width: parent.width
|
||
anchors.right: parent.right
|
||
store: root.store
|
||
}
|
||
|
||
RectangleCorner {}
|
||
}
|
||
|
||
ChatTimePanel {
|
||
id: chatTime
|
||
anchors.top: chatBox.bottom
|
||
anchors.topMargin: 4
|
||
anchors.bottomMargin: Style.current.padding
|
||
anchors.right: chatBox.right
|
||
anchors.rightMargin: Style.current.padding
|
||
timestamp: new Date().getTime()
|
||
visible: true
|
||
}
|
||
|
||
StatusBaseText {
|
||
anchors.top: chatTime.bottom
|
||
anchors.left: chatImage.left
|
||
anchors.topMargin: Style.current.padding
|
||
text: qsTr("You’re displaying your ENS username in chats")
|
||
font.pixelSize: 14
|
||
color: Theme.palette.baseColor1
|
||
}
|
||
}
|
||
|
||
|
||
Connections {
|
||
target: root.ensUsernamesStore.ensUsernamesModule
|
||
onUsernameConfirmed: {
|
||
messagesShownAs.visible = shouldDisplayExampleMessage()
|
||
chatSettingsLabel.visible = true
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|