Merge pull request #263 from Wunderfitz/lean-overview

Remove magnifying glass, reorganize title bar, introduce interaction hint

qml/pages/OverviewPage.qml

@@ -66,6 +66,13 @@ Page {
             overviewPage.chatListCreated = true;
             chatListView.scrollToTop();
             updateSecondaryContentTimer.start();
+            var remainingInteractionHints = appSettings.remainingInteractionHints;
+            Debug.log("Remaining interaction hints: " + remainingInteractionHints);
+            if (remainingInteractionHints > 0) {
+                interactionHintTimer.start();
+                titleInteractionHint.opacity = 1.0;
+                appSettings.remainingInteractionHints = remainingInteractionHints - 1;
+            }
         }
     }
 
@@ -162,9 +169,8 @@ Page {
 
     function resetFocus() {
         if (chatSearchField.text === "") {
-            chatSearchField.visible = false;
+            chatSearchField.opacity = 0.0;
-            pageHeader.visible = true;
+            pageHeader.opacity = 1.0;
-            searchChatButton.visible = overviewPage.connectionState === TelegramAPI.ConnectionReady;
         }
         chatSearchField.focus = false;
         overviewPage.focus = true;
@@ -252,9 +258,12 @@ Page {
             }
         }
 
-        Row {
+        PageHeader {
-            id: headerRow
+            id: pageHeader
-            width: parent.width - Theme.horizontalPageMargin
+            title: qsTr("Fernschreiber")
+            leftMargin: Theme.itemSizeMedium
+            visible: opacity > 0
+            Behavior on opacity { FadeAnimation {} }
 
             GlassItem {
                 id: pageStatus
@@ -266,63 +275,45 @@ Page {
                 cache: false
             }
 
-            PageHeader {
+            MouseArea {
-                id: pageHeader
+                anchors.fill: parent
-                title: qsTr("Fernschreiber")
-                width: visible ? ( parent.width - pageStatus.width - searchChatButton.width ) : 0
-                opacity: visible ? 1 : 0
-                Behavior on opacity { FadeAnimation {} }
-            }
-
-            IconButton {
-                id: searchChatButton
-                width: visible ? height : 0
-                opacity: visible ? 1 : 0
-                Behavior on opacity { NumberAnimation {} }
-                anchors.verticalCenter: parent.verticalCenter
-                icon {
-                    source: "image://theme/icon-m-search?" + Theme.highlightColor
-                    asynchronous: true
-                }
-                visible: overviewPage.connectionState === TelegramAPI.ConnectionReady
                 onClicked: {
                     chatSearchField.focus = true;
-                    chatSearchField.visible = true;
+                    chatSearchField.opacity = 1.0;
-                    pageHeader.visible = false;
+                    pageHeader.opacity = 0.0;
-                    searchChatButton.visible = false;
-                }
-            }
-
-            SearchField {
-                id: chatSearchField
-                visible: false
-                opacity: visible ? 1 : 0
-                Behavior on opacity { FadeAnimation {} }
-                width: visible ? ( parent.width - pageStatus.width ) : 0
-                height: pageHeader.height
-                placeholderText: qsTr("Filter your chats...")
-                canHide: text === ""
-
-                onTextChanged: {
-                    searchChatTimer.restart();
-                }
-
-                onHideClicked: {
-                    resetFocus();
-                }
-
-                EnterKey.iconSource: "image://theme/icon-m-enter-close"
-                EnterKey.onClicked: {
-                    resetFocus();
                 }
             }
 
         }
 
+        SearchField {
+            id: chatSearchField
+            visible: opacity > 0
+            opacity: 0
+            Behavior on opacity { FadeAnimation {} }
+            width: parent.width
+            height: pageHeader.height
+            placeholderText: qsTr("Filter your chats...")
+            canHide: text === ""
+
+            onTextChanged: {
+                searchChatTimer.restart();
+            }
+
+            onHideClicked: {
+                resetFocus();
+            }
+
+            EnterKey.iconSource: "image://theme/icon-m-enter-close"
+            EnterKey.onClicked: {
+                resetFocus();
+            }
+        }
+
         SilicaListView {
             id: chatListView
             anchors {
-                top: headerRow.bottom
+                top: pageHeader.bottom
                 bottom: parent.bottom
                 left: parent.left
                 right: parent.right
@@ -372,4 +363,24 @@ Page {
             }
         }
     }
+
+    Timer {
+        id: interactionHintTimer
+        running: false
+        interval: 4000
+        onTriggered: {
+            titleInteractionHint.opacity = 0.0;
+        }
+    }
+
+    InteractionHintLabel {
+        id: titleInteractionHint
+        text: qsTr("Tap on the title bar to filter your chats")
+        visible: opacity > 0
+        invert: true
+        anchors.fill: parent
+        Behavior on opacity { FadeAnimation {} }
+        opacity: 0
+    }
+
 }

src/appsettings.cpp

@@ -29,6 +29,7 @@ namespace {
     const QString KEY_NOTIFICATION_TURNS_DISPLAY_ON("notificationTurnsDisplayOn");
     const QString KEY_NOTIFICATION_FEEDBACK("notificationFeedback");
     const QString KEY_STORAGE_OPTIMIZER("storageOptimizer");
+    const QString KEY_REMAINING_INTERACTION_HINTS("remainingInteractionHints");
 }
 
 AppSettings::AppSettings(QObject *parent) : QObject(parent), settings("harbour-fernschreiber", "settings")
@@ -146,3 +147,17 @@ void AppSettings::setStorageOptimizer(bool enable)
         emit storageOptimizerChanged();
     }
 }
+
+int AppSettings::remainingInteractionHints() const
+{
+    return settings.value(KEY_REMAINING_INTERACTION_HINTS, 3).toInt();
+}
+
+void AppSettings::setRemainingInteractionHints(int remainingHints)
+{
+    if (remainingInteractionHints() != remainingHints) {
+        LOG(KEY_REMAINING_INTERACTION_HINTS << remainingHints);
+        settings.setValue(KEY_REMAINING_INTERACTION_HINTS, remainingHints);
+        emit remainingInteractionHintsChanged();
+    }
+}

src/appsettings.h

@@ -31,6 +31,7 @@ class AppSettings : public QObject {
     Q_PROPERTY(bool notificationTurnsDisplayOn READ notificationTurnsDisplayOn WRITE setNotificationTurnsDisplayOn NOTIFY notificationTurnsDisplayOnChanged)
     Q_PROPERTY(NotificationFeedback notificationFeedback READ notificationFeedback WRITE setNotificationFeedback NOTIFY notificationFeedbackChanged)
     Q_PROPERTY(bool storageOptimizer READ storageOptimizer WRITE setStorageOptimizer NOTIFY storageOptimizerChanged)
+    Q_PROPERTY(int remainingInteractionHints READ remainingInteractionHints WRITE setRemainingInteractionHints NOTIFY remainingInteractionHintsChanged)
 
 public:
     enum NotificationFeedback {
@@ -67,6 +68,9 @@ public:
     bool storageOptimizer() const;
     void setStorageOptimizer(bool enable);
 
+    int remainingInteractionHints() const;
+    void setRemainingInteractionHints(int remainingHints);
+
 signals:
     void sendByEnterChanged();
     void focusTextAreaAfterSendChanged();
@@ -76,6 +80,7 @@ signals:
     void notificationTurnsDisplayOnChanged();
     void notificationFeedbackChanged();
     void storageOptimizerChanged();
+    void remainingInteractionHintsChanged();
 
 private:
     QSettings settings;

translations/harbour-fernschreiber-de.ts

@@ -1080,6 +1080,10 @@
         <source>Download failed.</source>
         <translation>Download fehlgeschlagen.</translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation>Tippen Sie auf die Titelleiste, um Ihre Chats zu filtern</translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>

translations/harbour-fernschreiber-en.ts

@@ -1080,6 +1080,10 @@
         <source>Download failed.</source>
         <translation>Download failed.</translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation>Tap on the title bar to filter your chats</translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>

translations/harbour-fernschreiber-es.ts

@@ -1069,6 +1069,10 @@
         <source>Download failed.</source>
         <translation>Error al bajar</translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>

translations/harbour-fernschreiber-fi.ts

@@ -1081,6 +1081,10 @@
         <source>Download failed.</source>
         <translation type="unfinished">Lataus epäonnistui.</translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>

translations/harbour-fernschreiber-hu.ts

@@ -1069,6 +1069,10 @@
         <source>Download failed.</source>
         <translation type="unfinished">A letöltés nem sikerült.</translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>

translations/harbour-fernschreiber-it.ts

@@ -1080,6 +1080,10 @@
         <source>Download failed.</source>
         <translation type="unfinished">Download non riuscito.</translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>

translations/harbour-fernschreiber-pl.ts

@@ -1091,6 +1091,10 @@
         <source>Download failed.</source>
         <translation type="unfinished"></translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>

translations/harbour-fernschreiber-ru.ts

@@ -1091,6 +1091,10 @@
         <source>Download failed.</source>
         <translation type="unfinished">Ошибка скачивания.</translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>

translations/harbour-fernschreiber-sv.ts

@@ -1080,6 +1080,10 @@
         <source>Download failed.</source>
         <translation>Nerladdning misslyckades.</translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>

translations/harbour-fernschreiber-zh_CN.ts

@@ -1069,6 +1069,10 @@
         <source>Download failed.</source>
         <translation>下载失败。</translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>

translations/harbour-fernschreiber.ts

@@ -1080,6 +1080,10 @@
         <source>Download failed.</source>
         <translation type="unfinished">Download failed.</translation>
     </message>
+    <message>
+        <source>Tap on the title bar to filter your chats</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>PinnedMessageItem</name>