Fixes on List Overlay. Connection Error Sketch.

assets/core/negative_heart_24px.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 24.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;}
+</style>
+<path class="st0" d="M0,0h24v24H0V0z"/>
+<path id="Subtraction_1" d="M18.5,16L18.5,16L5.3,4.4C6.3,3.5,7.6,3,9,3c1.7,0,3.3,0.7,4.4,2c1.1-1.3,2.7-2,4.4-2
+	C20.6,3,23,5.3,23,8.2c0,0,0,0.1,0,0.1c0,0.6-0.1,1.3-0.3,1.9c-0.2,0.7-0.5,1.3-0.9,1.9C21.1,13.2,20.1,14.4,18.5,16L18.5,16z"/>
+<path d="M20.2,18.6L2.3,3.1L1,4.6l2.6,2.2C3.2,7.5,3,8.4,3,9.2c0,3.7,3.3,6.6,8.3,11.2l1.4,1.3l1.4-1.3c0.9-0.8,1.7-1.6,2.5-2.3
+	l2.3,2L20.2,18.6z"/>
+</svg>

i18n/translation_de.ts

@@ -114,22 +114,35 @@
 <context>
     <name>ListOverlay</name>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="184"/>
         <source>add-list-item</source>
         <extracomment>Add a New List Item</extracomment>
-        <translation>Liste hinzufügen</translation>
+        <translation type="vanished">Liste hinzufügen</translation>
     </message>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="196"/>
         <source>add-new-item</source>
         <extracomment>Add a new item to the list</extracomment>
-        <translation>Neues Listenelement hinzüfgen</translation>
+        <translation type="vanished">Neues Listenelement hinzüfgen</translation>
     </message>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="202"/>
         <source>todo-placeholder</source>
         <extracomment>Todo... placeholder text</extracomment>
-        <translation>noch zu erledigen</translation>
+        <translation type="vanished">noch zu erledigen</translation>
+    </message>
+    <message>
+        <location filename="../qml/overlays/ListOverlay.qml" line="33"/>
+        <source>search-list</source>
+        <extracomment>ex: &quot;... paste an address here to add a contact ...&quot;</extracomment>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../qml/overlays/ListOverlay.qml" line="62"/>
+        <source>peer-not-online</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../qml/overlays/ListOverlay.qml" line="203"/>
+        <source>add-list-item-btn</source>
+        <translation type="unfinished"></translation>
     </message>
 </context>
 <context>

i18n/translation_en.ts

@@ -209,22 +209,20 @@ Right-click to reset.</translation>
 <context>
     <name>ListOverlay</name>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="184"/>
-        <source>add-list-item</source>
-        <extracomment>Add a New List Item</extracomment>
-        <translation>Add a New List Item</translation>
+        <location filename="../qml/overlays/ListOverlay.qml" line="33"/>
+        <source>search-list</source>
+        <extracomment>ex: &quot;... paste an address here to add a contact ...&quot;</extracomment>
+        <translation type="unfinished">Search List</translation>
     </message>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="196"/>
-        <source>add-new-item</source>
-        <extracomment>Add a new item to the list</extracomment>
-        <translation>Add a new item to the list</translation>
+        <location filename="../qml/overlays/ListOverlay.qml" line="62"/>
+        <source>peer-not-online</source>
+        <translation type="unfinished">Peer is Offline. Applications cannot be used right now.</translation>
     </message>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="202"/>
-        <source>todo-placeholder</source>
-        <extracomment>Todo... placeholder text</extracomment>
-        <translation>Todo...</translation>
+        <location filename="../qml/overlays/ListOverlay.qml" line="203"/>
+        <source>add-list-item-btn</source>
+        <translation type="unfinished">Add Item</translation>
     </message>
 </context>
 <context>

i18n/translation_fr.ts

@@ -114,22 +114,35 @@
 <context>
     <name>ListOverlay</name>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="184"/>
         <source>add-list-item</source>
         <extracomment>Add a New List Item</extracomment>
-        <translation>Ajouter un nouvel élément</translation>
+        <translation type="vanished">Ajouter un nouvel élément</translation>
     </message>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="196"/>
         <source>add-new-item</source>
         <extracomment>Add a new item to the list</extracomment>
-        <translation>Ajouter un nouvel élément à la liste</translation>
+        <translation type="vanished">Ajouter un nouvel élément à la liste</translation>
     </message>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="202"/>
         <source>todo-placeholder</source>
         <extracomment>Todo... placeholder text</extracomment>
-        <translation>A faire...</translation>
+        <translation type="vanished">A faire...</translation>
+    </message>
+    <message>
+        <location filename="../qml/overlays/ListOverlay.qml" line="33"/>
+        <source>search-list</source>
+        <extracomment>ex: &quot;... paste an address here to add a contact ...&quot;</extracomment>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../qml/overlays/ListOverlay.qml" line="62"/>
+        <source>peer-not-online</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../qml/overlays/ListOverlay.qml" line="203"/>
+        <source>add-list-item-btn</source>
+        <translation type="unfinished"></translation>
     </message>
 </context>
 <context>

i18n/translation_pt.ts

@@ -114,22 +114,35 @@
 <context>
     <name>ListOverlay</name>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="184"/>
         <source>add-list-item</source>
         <extracomment>Add a New List Item</extracomment>
-        <translation>Adicionar Item à Lista</translation>
+        <translation type="vanished">Adicionar Item à Lista</translation>
     </message>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="196"/>
         <source>add-new-item</source>
         <extracomment>Add a new item to the list</extracomment>
-        <translation>Adicionar novo item à lista</translation>
+        <translation type="vanished">Adicionar novo item à lista</translation>
     </message>
     <message>
-        <location filename="../qml/overlays/ListOverlay.qml" line="202"/>
         <source>todo-placeholder</source>
         <extracomment>Todo... placeholder text</extracomment>
-        <translation>Afazer…</translation>
+        <translation type="vanished">Afazer…</translation>
+    </message>
+    <message>
+        <location filename="../qml/overlays/ListOverlay.qml" line="33"/>
+        <source>search-list</source>
+        <extracomment>ex: &quot;... paste an address here to add a contact ...&quot;</extracomment>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../qml/overlays/ListOverlay.qml" line="62"/>
+        <source>peer-not-online</source>
+        <translation type="unfinished"></translation>
+    </message>
+    <message>
+        <location filename="../qml/overlays/ListOverlay.qml" line="203"/>
+        <source>add-list-item-btn</source>
+        <translation type="unfinished"></translation>
     </message>
 </context>
 <context>

qml/overlays/ListOverlay.qml

@@ -10,38 +10,65 @@ import "../opaque/controls" as Awesome
 import "../opaque/fonts/Twemoji.js" as T
 import "../utils.js" as Utils
 import "../opaque/styles"
+import "../opaque/theme"
 
 ColumnLayout {
     Layout.fillWidth: true
     width:parent.width
+    id: listpanel
+    property bool online: false
 
     Text {
         Layout.fillWidth: true
     }
 
-    TextField {
+    Opaque.IconTextField {
         id: filter
-
-        placeholderText: "Search.."
-
-        style: CwtchTextFieldStyle{}
-
+        visible:listpanel.online
         anchors.left: parent.left
         anchors.right: parent.right
-
         anchors.margins: 10
 
+        //: ex: "... paste an address here to add a contact ..."
+        placeholderText: qsTr("search-list")
+        horizontalAlignment: TextInput.AlignHCenter
+        icon: gcd.assetPath + "core/search-24px.svg"
+
+
         onTextChanged: {
-            bulletinView.filter = text
-            if (bulletinView.model.get(bulletinView.currentIndex).title.indexOf(text) == -1) {
-                bulletinView.currentIndex = -1
+            listView.filter = text
+            if (listView.model.get(listView.currentIndex).title.indexOf(text) == -1) {
+                listView.currentIndex = -1
             }
         }
     }
 
+
+
+    Opaque.Icon {
+        visible:!listpanel.online
+        source: gcd.assetPath + "core/negative_heart_24px.svg"
+        iconColor: Theme.mainTextColor
+        backgroundColor: Theme.backgroundPaneColor
+        Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+        height: 150
+        width:  150
+    }
+    Opaque.EllipsisLabel {
+        visible:!listpanel.online
+        color: Theme.mainTextColor
+        Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+        size: 18 * gcd.themeScale
+        text: qsTr("peer-not-online")
+    }
+
+
+
+
     Flickable { // THE MESSAGE LIST ITSELF
         id: sv
         clip: true
+        visible:listpanel.online
         Layout.alignment: Qt.AlignLeft | Qt.AlignTop
         Layout.fillHeight: true
         Layout.fillWidth: true
@@ -87,25 +114,22 @@ ColumnLayout {
                     })
                 }
 
-                /*if(msg.c != undefined) {
-                jsonModel4.get(msg.c).complete = true
+                if(msg.c != undefined) {
+                    jsonModel4.get(msg.c).complete = true
                 }
-
-                if (sv.contentY + sv.height >= sv.contentHeight - colMessages.height && sv.contentHeight > sv.height) {
-                sv.contentY = sv.contentHeight - sv.height
-                }*/
             }
 
             onUpdateContactStatus: function(_handle, _status, _loading) {
                 if (gcd.selectedConversation == _handle) {
-                    if (_loading == true) {
-                        newposttitle.enabled = false
-                        btnSend.enabled = false
-                    } else {
-                        newposttitle.enabled = true
-                        btnSend.enabled = true
-                    }
 
+                    // Group is Synced OR p2p is Authenticated
+                    if (  (_handle.length == 32 && _status == 4) || (_handle.length == 56 && _status == 3) ) {
+                        newlistitem.readOnly = false
+                        listpanel.online = true
+                    } else {
+                        newlistitem.readOnly = true
+                        listpanel.online= false
+                    }
                 }
             }
         }
@@ -115,7 +139,7 @@ ColumnLayout {
         }
 
         ListView {
-            id: bulletinView
+            id: listView
             anchors.left: parent.left
             anchors.leftMargin: 10
             anchors.topMargin: 10
@@ -130,8 +154,8 @@ ColumnLayout {
 
             Item {
                 width: parent.width
-                height:  title.indexOf(bulletinView.filter) >= 0 ? texttitle.height : 0
-                visible: title.indexOf(bulletinView.filter) >= 0
+                height:  title.indexOf(listView.filter) >= 0 ? texttitle.height : 0
+                visible: title.indexOf(listView.filter) >= 0
 
                 Column {
                     width: parent.width
@@ -141,31 +165,24 @@ ColumnLayout {
                             checked: complete
                             onClicked: {
                                 var msg = JSON.stringify({"o":4, "c":index})
-                                gcd.sendMessage(msg, btnSend.nextMessageID++)
+                                gcd.sendMessage(msg, newlistitem.nextMessageID++)
                             }
                         }
 
                         RowLayout {
                             Text {
                                 id: texttitle
-                                text: '<b>' + Utils.htmlEscaped(title) + '</b> by ' + from + "<br/>" + timestamp
+                                text: '<b>' + Utils.htmlEscaped(title) + '</b> by ' + displayName + "<br/>" + timestamp
                                 leftPadding: 10
                                 topPadding: 5
                                 bottomPadding:5
-                                color: windowItem.cwtch_dark_color
+                                color: Theme.mainTextColor
                             }
                         }
                     }
 
 
-                    Rectangle {
-                        height: 1
-                        color: windowItem.cwtch_color
-                        anchors {
-                            left: parent.left
-                            right: parent.right
-                        }
-                    }
+                    Opaque.HLine{}
 
 
                 }
@@ -179,55 +196,28 @@ ColumnLayout {
         }
     }
 
-    GroupBox {
-        //: Add a New List Item
-        title: qsTr("add-list-item")
-        Layout.fillWidth: true
+    Opaque.ButtonTextField {
+            id: newlistitem
+            visible:listpanel.online
+            readOnly: false
+            button_text: qsTr("add-list-item-btn")
+            dropShadowColor: Theme.dropShadowPaneColor
+            property int nextMessageID: 1
+            anchors.left: parent.left
+            anchors.right: parent.right
+            anchors.margins: 10
 
-        RowLayout {
-            Layout.fillWidth: true
-            width: parent.width
-            ColumnLayout {
-                Layout.fillWidth: true
-
-
-                Text {
-                    //: Add a new item to the list
-                    text: qsTr("add-new-item")
-                }
-
-                TextField {
-                    id: newposttitle
-                    //: Todo... placeholder text
-                    placeholderText: qsTr("todo-placeholder")
-                    Layout.fillWidth: true
-                    style: CwtchTextFieldStyle{}
-                }
-
-                Opaque.Button { // SEND MESSAGE BUTTON
-                    id: btnSend
-                    icon: "regular/paper-plane"
-                    text: "add"
-                    anchors.right: parent.right
-                    anchors.rightMargin: 2
-
-                    property int nextMessageID: 1
-
-                    onClicked: {
-                        if (newposttitle.text != "") {
-                            var msg = JSON.stringify({"o":4, "t":newposttitle.text})
-                            gcd.sendMessage(msg, nextMessageID++)
-                        }
-                        newposttitle.text = ""
-                    }
+            onClicked: {
+                if (newlistitem.text != "") {
+                    var msg = JSON.stringify({"o":4, "t":newlistitem.text})
+                    gcd.sendMessage(msg, nextMessageID++)
                 }
+                newlistitem.text = ""
             }
-        }
 
     }
 
-
-
+    Opaque.HLine{}