feat(home): splitted in tow areas

tests/languages/en.ts

@@ -9,11 +9,19 @@
     </message>
 </context>
 <context>
-    <name>mainWindow</name>
+    <name>home</name>
     <message>
         <source>mainSearchBarPlaceholder</source>
         <translation>Search contact, start call, start chat...</translation>
     </message>
+    <message>
+        <source>homeEntry</source>
+        <translation>Home</translation>
+    </message>
+    <message>
+        <source>contactsEntry</source>
+        <translation>Contacts</translation>
+    </message>
 </context>
 <context>
     <name>manageAccounts</name>

tests/languages/fr.ts

@@ -9,11 +9,19 @@
     </message>
 </context>
 <context>
-    <name>mainWindow</name>
+    <name>home</name>
     <message>
         <source>mainSearchBarPlaceholder</source>
         <translation>Chercher contact, commencer appel ou chat...</translation>
     </message>
+    <message>
+        <source>homeEntry</source>
+        <translation>Accueil</translation>
+    </message>
+    <message>
+        <source>contactsEntry</source>
+        <translation>Contacts</translation>
+    </message>
 </context>
 <context>
     <name>manageAccounts</name>

tests/linphone.pro

@@ -25,7 +25,8 @@ lupdate_only{
     ui/components/form/*.qml \
     ui/components/misc/*.qml \
     ui/components/select/*.qml \
-    ui/views/*.qml
+    ui/views/*.qml \
+    ui/views/home/*.qml
 }
 
 RESOURCES += \

tests/resources.qrc

@@ -9,14 +9,14 @@
   <file>ui/components/dialog/DialogPlus.qml</file>
   <file>ui/components/form/Collapse.qml</file>
   <file>ui/components/form/DialogButton.qml</file>
-  <file>ui/components/form/RoundButton.qml</file>
   <file>ui/components/form/ToolBarButton.qml</file>
   <file>ui/components/form/TransparentComboBox.qml</file>
   <file>ui/components/misc/Contact.qml</file>
+  <file>ui/components/misc/MenuEntry.qml</file>
   <file>ui/components/select/SelectContact.qml</file>
 
   <!-- UI: Views. -->
-  <file>ui/views/mainWindow.qml</file>
+  <file>ui/views/home/home.qml</file>
   <file>ui/views/manageAccounts.qml</file>
   <file>ui/views/newCall.qml</file>
 

tests/src/main.cpp

@@ -8,7 +8,7 @@
 
 int main (int argc, char *argv[]) {
   App app(argc, argv);
-  QQmlApplicationEngine engine(QUrl("qrc:/ui/views/mainWindow.qml"));
+  QQmlApplicationEngine engine(QUrl("qrc:/ui/views/home/home.qml"));
 
   if (engine.rootObjects().isEmpty())
     return EXIT_FAILURE;

tests/ui/components/dialog/DialogDescription.qml

@@ -3,8 +3,8 @@ import QtQuick 2.7
 // ===================================================================
 
 Item {
-    property alias text: description.text
     property alias fontSize: description.font.pointSize
+    property alias text: description.text
 
     height: text ? 90 : 25
 

tests/ui/components/dialog/DialogPlus.qml

@@ -6,8 +6,8 @@ import QtQuick.Window 2.2
 
 Window {
     default property alias contents: content.data // Required.
-    property alias descriptionText: description.text // Optionnal.
     property alias buttons: buttons.data // Required.
+    property alias descriptionText: description.text // Optionnal.
     property bool centeredButtons // Optionnal.
 
     modality: Qt.WindowModal

tests/ui/components/form/Collapse.qml

 import QtQuick 2.7
 import QtQuick.Controls 2.0
 
+// ===================================================================
+
 Item {
     property bool enabled: false
     property alias image: backgroundImage.source
 
     signal collapsed (bool collapsed)
 
-    id: collapse
-
-    // Default.
-    height: 50
-    width: 50
-
     function updateCollapse () {
         enabled = !enabled
         collapsed(enabled)

tests/ui/components/form/DialogButton.qml

 import QtQuick 2.7
 import QtQuick.Controls 2.0
 
+// ===================================================================
+
 Button {
     background: Rectangle {
         color: button.down ? '#FE5E00' : '#434343'

tests/ui/components/form/RoundButton.qml

-import QtQuick 2.7
-import QtQuick.Controls 2.0
-
-Button {
-    property alias image: backgroundImage.source
-
-    Image {
-        anchors.fill: parent
-        id: backgroundImage
-        fillMode: Image.PreserveAspectFit
-    }
-}

tests/ui/components/form/ToolBarButton.qml

 import QtQuick 2.7
 import QtQuick.Controls 2.0
 
+// ===================================================================
+
 ToolButton {
     property alias image: backgroundImage.source
 
     Image {
         anchors.fill: parent
+        fillMode: Image.PreserveAspectFit
         id: backgroundImage
     }
 }

tests/ui/components/misc/MenuEntry.qml

+import QtQuick 2.7
+
+Rectangle {
+    property alias entryName: text.text
+    property bool isSelected
+
+    color: isSelected ? '#434343' : '#8E8E8E'
+
+    Row {
+        anchors.fill: parent
+        anchors.leftMargin: 10
+        anchors.rightMargin: 10
+        spacing: 10
+
+        Image {
+            height: parent.height
+            width: 30
+        }
+
+        Text {
+            color: '#FFFFFF'
+            font.pointSize: 13
+            height: parent.height
+            id: text
+            verticalAlignment: Text.AlignVCenter
+        }
+
+        Image {
+            height: parent.height
+        }
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        onClicked: { } // TODO.
+    }
+}

tests/ui/components/select/SelectContact.qml

@@ -50,50 +50,50 @@ Item {
             // TODO: Remove, use C++ model instead.
             model: ListModel {
                 ListElement {
-                    _presence: 'connected'
-                    _sipAddress: 'jim.williams.zzzz.yyyy.kkkk.sip.linphone.org'
-                    _username: 'Toto'
+                    $presence: 'connected'
+                    $sipAddress: 'jim.williams.zzzz.yyyy.kkkk.sip.linphone.org'
+                    $username: 'Toto'
                 }
                 ListElement {
-                    _presence: 'connected'
-                    _sipAddress: 'toto.lala.sip.linphone.org'
-                    _username: 'Toto'
+                    $presence: 'connected'
+                    $sipAddress: 'toto.lala.sip.linphone.org'
+                    $username: 'Toto'
                 }
                 ListElement {
-                    _presence: 'disconnected'
-                    _sipAddress: 'machin.truc.sip.linphone.org'
-                    _username: 'Toto'
+                    $presence: 'disconnected'
+                    $sipAddress: 'machin.truc.sip.linphone.org'
+                    $username: 'Toto'
                 }
                 ListElement {
-                    _presence: 'absent'
-                    _sipAddress: 'hey.listen.sip.linphone.org'
-                    _username: 'Toto'
+                    $presence: 'absent'
+                    $sipAddress: 'hey.listen.sip.linphone.org'
+                    $username: 'Toto'
                 }
                 ListElement {
-                    _presence: 'do_not_disturb'
-                    _sipAddress: 'valentin.cognito.sip.linphone.org'
-                    _username: 'Toto'
+                    $presence: 'do$not$disturb'
+                    $sipAddress: 'valentin.cognito.sip.linphone.org'
+                    $username: 'Toto'
                 }
                 ListElement {
-                    _presence: 'do_not_disturb'
-                    _sipAddress: 'charles.henri.sip.linphone.org'
-                    _username: 'Toto'
+                    $presence: 'do$not$disturb'
+                    $sipAddress: 'charles.henri.sip.linphone.org'
+                    $username: 'Toto'
                 }
                 ListElement {
-                    _presence: 'disconnected'
-                    _sipAddress: 'yesyes.nono.sip.linphone.org'
-                    _username: 'Toto'
+                    $presence: 'disconnected'
+                    $sipAddress: 'yesyes.nono.sip.linphone.org'
+                    $username: 'Toto'
                 }
                 ListElement {
-                    _presence: 'connected'
-                    _sipAddress: 'nsa.sip.linphone.org'
-                    _username: 'Toto'
+                    $presence: 'connected'
+                    $sipAddress: 'nsa.sip.linphone.org'
+                    $username: 'Toto'
                 }
             }
 
             delegate: Contact {
-                sipAddress: _sipAddress
-                username: _username
+                sipAddress: $sipAddress
+                username: $username
                 width: parent.width
             }
         }

tests/ui/views/mainWindow.qml → tests/ui/views/home/home.qml

@@ -3,6 +3,7 @@ import QtQuick.Controls 2.0
 import QtQuick.Layouts 1.3
 
 import 'qrc:/ui/components/form'
+import 'qrc:/ui/components/misc'
 
 ApplicationWindow {
     header: ToolBar {
@@ -13,10 +14,14 @@ ApplicationWindow {
 
         RowLayout {
             anchors.fill: parent
-            anchors.rightMargin: 10
+            anchors.leftMargin: 20
+            anchors.rightMargin: 20
+            spacing: 20
 
             // Collapse.
             Collapse {
+                Layout.preferredWidth: 25
+                Layout.fillHeight: parent.height
                 image: 'qrc:/imgs/collapse.svg'
                 onCollapsed: {
                     mainWindow.height = collapsed ? 480 : 70
@@ -24,7 +29,32 @@ ApplicationWindow {
             }
 
             // User info.
-            // TODO
+            Column {
+                Layout.preferredWidth: 200
+                Layout.fillHeight: parent.height
+
+                // Username.
+                Text {
+                    clip: true
+                    color: '#5A585B'
+                    font.weight: Font.DemiBold
+                    height: parent.height / 2
+                    font.pointSize: 11
+                    text: 'Edward Miller'
+                    verticalAlignment: Text.AlignBottom
+                    width: parent.width
+                }
+
+                // Sip address.
+                Text {
+                    clip: true
+                    color: '#5A585B'
+                    height: parent.height / 2
+                    text: 'e.miller@sip-linphone.org'
+                    verticalAlignment: Text.AlignTop
+                    width: parent.width
+                }
+            }
 
             // User actions.
             ToolBarButton {
@@ -57,6 +87,8 @@ ApplicationWindow {
 
             // Start conference.
             ToolBarButton {
+                Layout.fillHeight: parent.height
+                Layout.preferredWidth: 32
                 image: 'qrc:/imgs/start_conference.svg'
             }
         }
@@ -66,4 +98,48 @@ ApplicationWindow {
     minimumWidth: 640
     title: 'Linphone'
     visible: true
+
+    RowLayout {
+        anchors.fill: parent
+        spacing: 0
+
+        // Main menu.
+        ColumnLayout {
+            Layout.fillHeight: true
+            Layout.preferredWidth: 250
+            spacing: 0
+
+            MenuEntry {
+                Layout.preferredHeight: 50
+                Layout.preferredWidth: parent.width
+                entryName: qsTr('homeEntry')
+            }
+
+            Item { Layout.preferredHeight: 2 }
+
+            MenuEntry {
+                Layout.preferredHeight: 50
+                Layout.preferredWidth: parent.width
+                entryName: qsTr('contactsEntry')
+            }
+
+            Rectangle {
+                Layout.fillHeight: true
+                Layout.preferredWidth: parent.width
+            }
+
+            Rectangle {
+                Layout.preferredWidth: 250
+                Layout.preferredHeight: 70
+                color: '#EAEAEA'
+            }
+        }
+
+        // Main content.
+        Rectangle {
+            Layout.fillHeight: true
+            Layout.fillWidth: true
+            color: 'blue'
+        }
+    }
 }