diff --git a/ui/app/AppLayouts/Chat/ContactsColumn.qml b/ui/app/AppLayouts/Chat/ContactsColumn.qml
index 6c3be88f1f..2da214c509 100644
--- a/ui/app/AppLayouts/Chat/ContactsColumn.qml
+++ b/ui/app/AppLayouts/Chat/ContactsColumn.qml
@@ -27,6 +27,10 @@ Item {
font.pixelSize: 17
}
+ PublicChatPopup {
+ id: publicChatPopup
+ }
+
Rectangle {
id: searchBox
height: 36
@@ -41,7 +45,7 @@ Item {
TextField {
id: searchText
- placeholderText: qsTr("Search or join channel")
+ placeholderText: qsTr("Search")
anchors.left: parent.left
anchors.leftMargin: 32
anchors.verticalCenter: parent.verticalCenter
@@ -162,11 +166,7 @@ Item {
QQC2.Action {
text: qsTr("Join public chat")
icon.source: "../../img/public_chat.svg"
- onTriggered: {
- chatGroupsListView.currentIndex = chatsModel.joinChat(
- searchText.text)
- searchText.text = ""
- }
+ onTriggered: publicChatPopup.open()
}
onAboutToHide: {
addChatLbl.state = "default"
diff --git a/ui/app/AppLayouts/Chat/components/PublicChatPopup.qml b/ui/app/AppLayouts/Chat/components/PublicChatPopup.qml
new file mode 100644
index 0000000000..b168b76e10
--- /dev/null
+++ b/ui/app/AppLayouts/Chat/components/PublicChatPopup.qml
@@ -0,0 +1,199 @@
+import QtQuick 2.12
+import QtQuick.Controls 2.3
+import QtQuick.Layouts 1.3
+import "../../../../imports"
+import "../../Shared"
+import "./"
+
+Item {
+ function open(){
+ popup.open()
+ channelName.forceActiveFocus(Qt.MouseFocusReason)
+ }
+
+ function close(){
+ popup.close()
+ }
+
+ Popup {
+ id: popup
+ modal: true
+ closePolicy: Popup.NoAutoClose
+ Overlay.modal: Rectangle {
+ color: "#60000000"
+ }
+ parent: Overlay.overlay
+ x: Math.round((parent.width - width) / 2)
+ y: Math.round((parent.height - height) / 2)
+ width: 480
+ height: 509
+ background: Rectangle {
+ color: Theme.white
+ radius: 8
+ }
+ padding: 0
+ contentItem: Item {
+ Text {
+ id: modalDialogTitle
+ text: qsTr("Join public chat")
+ anchors.top: parent.top
+ anchors.left: parent.left
+ font.bold: true
+ font.pixelSize: 17
+ anchors.leftMargin: 16
+ anchors.topMargin: 16
+ }
+
+ Image {
+ id: closeModalImg
+ anchors.top: parent.top
+ anchors.right: parent.right
+ anchors.rightMargin: 16
+ anchors.topMargin: 16
+ source: "../../../img/close.svg"
+ MouseArea {
+ id: closeModalMouseArea
+ cursorShape: Qt.PointingHandCursor
+ anchors.fill: parent
+ onClicked : {
+ popup.close()
+ }
+ }
+ }
+
+ Separator {
+ id: separator
+ anchors.top: modalDialogTitle.bottom
+ }
+
+ Row {
+ id: description
+ Layout.fillHeight: false
+ Layout.fillWidth: true
+ anchors.top: separator.bottom
+ anchors.left: parent.left
+ anchors.right: parent.right
+ width: parent.width
+ padding: 20
+
+ Text {
+ width: parent.width - 20
+ font.pixelSize: 15
+ text: qsTr("A public chat is where you get to hang out with others, make friends and talk about subjects of your interest.")
+ wrapMode: Text.WordWrap
+ verticalAlignment: Text.AlignTop
+ }
+ }
+
+ Rectangle {
+ id: channelNameBox
+ height: 44
+ color: Theme.grey
+ anchors.top: description.bottom
+ radius: 8
+ anchors.right: parent.right
+ anchors.rightMargin: 16
+ anchors.left: parent.left
+ anchors.leftMargin: 16
+
+ TextField {
+ id: channelName
+ placeholderText: qsTr("chat-name")
+ anchors.left: parent.left
+ anchors.leftMargin: 32
+ anchors.verticalCenter: parent.verticalCenter
+ font.pixelSize: 15
+ background: Rectangle {
+ color: "#00000000"
+ }
+ width: popup.width - 65
+ }
+
+ Image {
+ id: image4
+ anchors.left: parent.left
+ anchors.leftMargin: 10
+ anchors.verticalCenter: parent.verticalCenter
+ fillMode: Image.PreserveAspectFit
+ source: "../../../img/hash.svg"
+ }
+
+ MouseArea {
+ id: mouseArea
+ anchors.fill: parent
+ onClicked : {
+ channelName.forceActiveFocus(Qt.MouseFocusReason)
+ }
+ }
+ }
+
+ RowLayout {
+ id: row
+ Layout.fillHeight: false
+ Layout.fillWidth: true
+ anchors.right: parent.right
+ anchors.rightMargin: 65
+ anchors.left: parent.left
+ anchors.leftMargin: 65
+ anchors.top: channelNameBox.bottom
+ anchors.topMargin: 37
+
+ Flow {
+ Layout.fillHeight: false
+ Layout.fillWidth: true
+ spacing: 20
+
+ SuggestedChannel { channel: "ethereum" }
+ SuggestedChannel { channel: "status" }
+ SuggestedChannel { channel: "general" }
+ SuggestedChannel { channel: "dapps" }
+ SuggestedChannel { channel: "crypto" }
+ SuggestedChannel { channel: "introductions" }
+ SuggestedChannel { channel: "tech" }
+ SuggestedChannel { channel: "ama" }
+ SuggestedChannel { channel: "gaming" }
+ SuggestedChannel { channel: "sexychat" }
+ SuggestedChannel { channel: "nsfw" }
+ SuggestedChannel { channel: "science" }
+ SuggestedChannel { channel: "music" }
+ SuggestedChannel { channel: "movies" }
+ SuggestedChannel { channel: "sports" }
+ SuggestedChannel { channel: "politics" }
+ }
+ }
+
+ Separator {
+ id: separator2
+ anchors.bottom: parent.bottom
+ anchors.bottomMargin: 75
+ }
+
+ Button {
+ id: btnJoinChat
+ anchors.bottom: parent.bottom
+ anchors.right: parent.right
+ anchors.bottomMargin: 16
+ anchors.rightMargin: 16
+ width: 44
+ height: 44
+ Image {
+ source: channelName.text == "" ? "../../../img/arrow-button-inactive.svg" : "../../../img/arrow-btn-active.svg"
+ }
+ background: Rectangle {
+ color: "transparent"
+ }
+ MouseArea {
+ id: btnMAJoinChat
+ cursorShape: Qt.PointingHandCursor
+ anchors.fill: parent
+ onClicked : {
+ if(channelName.text === "") return;
+
+ chatsModel.joinChat(channelName.text)
+ popup.close()
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/ui/app/AppLayouts/Chat/components/qmldir b/ui/app/AppLayouts/Chat/components/qmldir
index ce59d59180..358b86ac2e 100644
--- a/ui/app/AppLayouts/Chat/components/qmldir
+++ b/ui/app/AppLayouts/Chat/components/qmldir
@@ -1 +1,2 @@
SuggestedChannel 1.0 SuggestedChannel.qml
+PublicChatPopup 1.0 PublicChatPopup.qml
\ No newline at end of file
diff --git a/ui/app/AppLayouts/Shared/Separator.qml b/ui/app/AppLayouts/Shared/Separator.qml
new file mode 100644
index 0000000000..066b260aa1
--- /dev/null
+++ b/ui/app/AppLayouts/Shared/Separator.qml
@@ -0,0 +1,10 @@
+import QtQuick 2.12
+import "../../../imports"
+
+Rectangle {
+ id: separator
+ width: parent.width
+ height: 1
+ color: Theme.grey
+ anchors.topMargin: 16
+}
\ No newline at end of file
diff --git a/ui/app/AppLayouts/Shared/qmldir b/ui/app/AppLayouts/Shared/qmldir
new file mode 100644
index 0000000000..e6bb309b10
--- /dev/null
+++ b/ui/app/AppLayouts/Shared/qmldir
@@ -0,0 +1 @@
+Separator 1.0 Separator.qml
\ No newline at end of file
diff --git a/ui/app/img/arrow-btn-active.svg b/ui/app/img/arrow-btn-active.svg
new file mode 100644
index 0000000000..f5cfe6a3f5
--- /dev/null
+++ b/ui/app/img/arrow-btn-active.svg
@@ -0,0 +1,4 @@
+
diff --git a/ui/app/img/arrow-button-inactive.svg b/ui/app/img/arrow-button-inactive.svg
new file mode 100644
index 0000000000..f3e5a2f428
--- /dev/null
+++ b/ui/app/img/arrow-button-inactive.svg
@@ -0,0 +1,4 @@
+
diff --git a/ui/app/img/close.svg b/ui/app/img/close.svg
new file mode 100644
index 0000000000..26cae722b9
--- /dev/null
+++ b/ui/app/img/close.svg
@@ -0,0 +1,3 @@
+
diff --git a/ui/app/img/hash.svg b/ui/app/img/hash.svg
new file mode 100644
index 0000000000..55e5432675
--- /dev/null
+++ b/ui/app/img/hash.svg
@@ -0,0 +1,3 @@
+