feat(app): toolbar in progress

linphone-desktop/assets/languages/en.ts

@@ -394,6 +394,41 @@ Server url not configured.</translation>
         <translation>auto</translation>
     </message>
 </context>
+<context>
+    <name>MainWindowMenuBar</name>
+    <message>
+        <source>tools</source>
+        <translation>Tools</translation>
+    </message>
+    <message>
+        <source>help</source>
+        <translation>Help</translation>
+    </message>
+    <message>
+        <source>options</source>
+        <translation>Options</translation>
+    </message>
+    <message>
+        <source>settings</source>
+        <translation>Settings</translation>
+    </message>
+    <message>
+        <source>accountAssistant</source>
+        <translation>Account assistant</translation>
+    </message>
+    <message>
+        <source>audioAssistant</source>
+        <translation>Audio Assistant</translation>
+    </message>
+    <message>
+        <source>debugWindow</source>
+        <translation>Debug window</translation>
+    </message>
+    <message>
+        <source>about</source>
+        <translation>About</translation>
+    </message>
+</context>
 <context>
     <name>ManageAccounts</name>
     <message>

linphone-desktop/assets/languages/fr.ts

@@ -393,6 +393,41 @@ Url du serveur non configurée.</translation>
         <translation>auto</translation>
     </message>
 </context>
+<context>
+    <name>MainWindowMenuBar</name>
+    <message>
+        <source>tools</source>
+        <translation>Outils</translation>
+    </message>
+    <message>
+        <source>help</source>
+        <translation>Aide</translation>
+    </message>
+    <message>
+        <source>options</source>
+        <translation>Options</translation>
+    </message>
+    <message>
+        <source>settings</source>
+        <translation>Paramètres</translation>
+    </message>
+    <message>
+        <source>accountAssistant</source>
+        <translation>Assistant de compte</translation>
+    </message>
+    <message>
+        <source>audioAssistant</source>
+        <translation>Assistant audio</translation>
+    </message>
+    <message>
+        <source>debugWindow</source>
+        <translation>Fenêtre de debug</translation>
+    </message>
+    <message>
+        <source>about</source>
+        <translation>À propos</translation>
+    </message>
+</context>
 <context>
     <name>ManageAccounts</name>
     <message>

linphone-desktop/resources.qrc

@@ -303,6 +303,7 @@
     <file>ui/views/App/Main/Contacts.qml</file>
     <file>ui/views/App/Main/Conversation.qml</file>
     <file>ui/views/App/Main/Home.qml</file>
+    <file>ui/views/App/Main/MainWindowMenuBar.qml</file>
     <file>ui/views/App/Main/MainWindow.qml</file>
     <file>ui/views/App/ManageAccounts.qml</file>
     <file>ui/views/App/qmldir</file>

linphone-desktop/ui/modules/Linphone/Styles/TimelineStyle.qml

@@ -6,6 +6,8 @@ import Common 1.0
 // =============================================================================
 
 QtObject {
+  property color color: Colors.k
+
   property QtObject contact: QtObject {
     property int height: 60
 

linphone-desktop/ui/modules/Linphone/Timeline.qml

@@ -45,6 +45,11 @@ ColumnLayout {
 
   spacing: 0
 
+  Rectangle {
+    anchors.fill: parent
+    color: TimelineStyle.color
+  }
+
   SmartConnect {
     Component.onCompleted: {
       // Handle if current entry was moved in timeline.

linphone-desktop/ui/views/App/Main/MainWindow.qml

@@ -2,6 +2,9 @@ import QtQuick 2.7
 import QtQuick.Controls 2.0
 import QtQuick.Layouts 1.3
 
+// Explicit import to support Toolbar.
+import QtQuick.Controls 1.4 as Controls1
+
 import Common 1.0
 import Linphone 1.0
 import Utils 1.0
@@ -10,7 +13,7 @@ import App.Styles 1.0
 
 // =============================================================================
 
-ApplicationWindow {
+Controls1.ApplicationWindow {
   id: window
 
   property string _currentView: ''
@@ -84,145 +87,160 @@ ApplicationWindow {
   onActiveFocusItemChanged: activeFocusItem == null && smartSearchBar.hideMenu()
 
   // ---------------------------------------------------------------------------
-  // Toolbar properties.
+  // Mernu bar.
   // ---------------------------------------------------------------------------
 
-  header: ToolBar {
-    background: MainWindowStyle.toolBar.background
-    height: MainWindowStyle.toolBar.height
+  menuBar: MainWindowMenuBar {}
 
-    RowLayout {
-      anchors {
-        fill: parent
-        leftMargin: MainWindowStyle.toolBar.leftMargin
-        rightMargin: MainWindowStyle.toolBar.rightMargin
-      }
-      spacing: MainWindowStyle.toolBar.spacing
+  ColumnLayout {
+    anchors.fill: parent
+    spacing: 0
 
-      Collapse {
-        id: collapse
+    // -------------------------------------------------------------------------
+    // Toolbar properties.
+    // -------------------------------------------------------------------------
 
-        Layout.fillHeight: parent.height
-        target: window
-        targetHeight: MainWindowStyle.minimumHeight
-      }
+    ToolBar {
+      Layout.fillWidth: true
+      Layout.preferredHeight: MainWindowStyle.toolBar.height
 
-      AccountStatus {
-        id: accountStatus
+      background: MainWindowStyle.toolBar.background
 
-        Layout.fillHeight: parent.height
-        Layout.preferredWidth: MainWindowStyle.accountStatus.width
+      RowLayout {
+        anchors {
+          fill: parent
+          leftMargin: MainWindowStyle.toolBar.leftMargin
+          rightMargin: MainWindowStyle.toolBar.rightMargin
+        }
+        spacing: MainWindowStyle.toolBar.spacing
 
-        account: AccountSettingsModel
+        Collapse {
+          id: collapse
 
-        TooltipArea {
-          text: AccountSettingsModel.sipAddress
+          Layout.fillHeight: parent.height
+          target: window
+          targetHeight: MainWindowStyle.minimumHeight
         }
 
-        onClicked: Utils.openWindow('ManageAccounts', window)
-      }
+        AccountStatus {
+          id: accountStatus
+
+          Layout.fillHeight: parent.height
+          Layout.preferredWidth: MainWindowStyle.accountStatus.width
 
-      Column {
-        width: MainWindowStyle.autoAnswerStatus.width
+          account: AccountSettingsModel
 
-        Icon {
-          icon: SettingsModel.autoAnswerStatus
-            ? 'auto_answer'
-            : ''
-          iconSize: MainWindowStyle.autoAnswerStatus.iconSize
+          TooltipArea {
+            text: AccountSettingsModel.sipAddress
+          }
+
+          onClicked: Utils.openWindow('ManageAccounts', window)
         }
 
-        Text {
-          clip: true
-          font {
-            pointSize: MainWindowStyle.autoAnswerStatus.text.fontSize
+        Column {
+          width: MainWindowStyle.autoAnswerStatus.width
+
+          Icon {
+            icon: SettingsModel.autoAnswerStatus
+              ? 'auto_answer'
+              : ''
+            iconSize: MainWindowStyle.autoAnswerStatus.iconSize
+          }
+
+          Text {
+            clip: true
+            font {
+              pointSize: MainWindowStyle.autoAnswerStatus.text.fontSize
+            }
+            text: qsTr('autoAnswerStatus')
+            width: parent.width
+            color: MainWindowStyle.autoAnswerStatus.text.color
           }
-          text: qsTr('autoAnswerStatus')
-          width: parent.width
-          color: MainWindowStyle.autoAnswerStatus.text.color
         }
-      }
 
-      SmartSearchBar {
-        id: smartSearchBar
+        SmartSearchBar {
+          id: smartSearchBar
 
-        Layout.fillWidth: true
-        entryHeight: MainWindowStyle.searchBox.entryHeight
-        maxMenuHeight: MainWindowStyle.searchBox.maxHeight
-        placeholderText: qsTr('mainSearchBarPlaceholder')
+          Layout.fillWidth: true
+          entryHeight: MainWindowStyle.searchBox.entryHeight
+          maxMenuHeight: MainWindowStyle.searchBox.maxHeight
+          placeholderText: qsTr('mainSearchBarPlaceholder')
 
-        model: SmartSearchBarModel {}
+          model: SmartSearchBarModel {}
 
-        onAddContact: window.setView('ContactEdit', {
-          sipAddress: sipAddress
-        })
+          onAddContact: window.setView('ContactEdit', {
+            sipAddress: sipAddress
+          })
 
-        onLaunchCall: CallsListModel.launchAudioCall(sipAddress)
-        onLaunchChat: window.setView('Conversation', {
-          sipAddress: sipAddress
-        })
+          onLaunchCall: CallsListModel.launchAudioCall(sipAddress)
+          onLaunchChat: window.setView('Conversation', {
+            sipAddress: sipAddress
+          })
 
-        onLaunchVideoCall: CallsListModel.launchVideoCall(sipAddress)
+          onLaunchVideoCall: CallsListModel.launchVideoCall(sipAddress)
 
-        onEntryClicked: window.setView(entry.contact ? 'ContactEdit' : 'Conversation', {
-          sipAddress: entry.sipAddress
-        })
+          onEntryClicked: window.setView(entry.contact ? 'ContactEdit' : 'Conversation', {
+            sipAddress: entry.sipAddress
+          })
+        }
       }
     }
-  }
-
-  // ---------------------------------------------------------------------------
-  // Content.
-  // ---------------------------------------------------------------------------
 
-  RowLayout {
-    anchors.fill: parent
-    spacing: 0
+    // -------------------------------------------------------------------------
+    // Content.
+    // -------------------------------------------------------------------------
 
-    // Main menu.
-    ColumnLayout {
+    RowLayout {
       Layout.fillHeight: true
-      Layout.maximumWidth: MainWindowStyle.menu.width
-      Layout.preferredWidth: MainWindowStyle.menu.width
+      Layout.fillWidth: true
+
       spacing: 0
 
-      Menu {
-        id: menu
+      // Main menu.
+      ColumnLayout {
+        Layout.maximumWidth: MainWindowStyle.menu.width
+        Layout.preferredWidth: MainWindowStyle.menu.width
 
-        entryHeight: MainWindowStyle.menu.entryHeight
-        entryWidth: MainWindowStyle.menu.width
+        spacing: 0
 
-        entries: [{
-          entryName: qsTr('homeEntry'),
-          icon: 'home'
-        }, {
-          entryName: qsTr('contactsEntry'),
-          icon: 'contact'
-        }]
+        Menu {
+          id: menu
 
-        onEntrySelected: !entry ? setView('Home') : setView('Contacts')
-      }
+          entryHeight: MainWindowStyle.menu.entryHeight
+          entryWidth: MainWindowStyle.menu.width
 
-      // History.
-      Timeline {
-        id: timeline
+          entries: [{
+            entryName: qsTr('homeEntry'),
+            icon: 'home'
+          }, {
+            entryName: qsTr('contactsEntry'),
+            icon: 'contact'
+          }]
 
-        Layout.fillHeight: true
-        Layout.fillWidth: true
-        model: TimelineModel
+          onEntrySelected: !entry ? setView('Home') : setView('Contacts')
+        }
+
+        // History.
+        Timeline {
+          id: timeline
+
+          Layout.fillHeight: true
+          Layout.fillWidth: true
+          model: TimelineModel
 
-        onEntrySelected: setView('Conversation', { sipAddress: entry })
+          onEntrySelected: setView('Conversation', { sipAddress: entry })
+        }
       }
-    }
 
-    // Main content.
-    Loader {
-      id: contentLoader
+      // Main content.
+      Loader {
+        id: contentLoader
 
-      Layout.fillHeight: true
-      Layout.fillWidth: true
+        Layout.fillHeight: true
+        Layout.fillWidth: true
 
-      Component.onCompleted: setView('Home')
+        Component.onCompleted: setView('Home')
+      }
     }
   }
 }

linphone-desktop/ui/views/App/Main/MainWindowMenuBar.qml

+import QtQuick 2.7
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+
+ // ============================================================================
+
+ MenuBar {
+   style: MenuBarStyle {
+     background: Rectangle {
+       anchors.fill: parent
+       color: '#E8E8E7'
+     }
+
+     itemDelegate: Rectangle {
+       implicitHeight: text.height + 8
+       implicitWidth: text.width + 18
+       color: 'transparent'
+
+       Text {
+         id: text
+
+         anchors.centerIn: parent
+         font: root.font
+         text: formatMnemonic(styleData.text, styleData.underlineMnemonic)
+         color: styleData.open ? '#FE5E00' : '#515557'
+       }
+     }
+   }
+
+   // --------------------------------------------------------------------------
+
+   Menu {
+     title: qsTr('options')
+
+     MenuItem {
+       text: qsTr('settings')
+     }
+   }
+
+   Menu {
+     title: qsTr('tools')
+
+     MenuItem {
+       text: qsTr('accountAssistant')
+     }
+
+     MenuItem {
+       text: qsTr('audioAssistant')
+     }
+
+     MenuSeparator {}
+
+     MenuItem {
+       text: qsTr('debugWindow')
+     }
+   }
+
+   Menu {
+     title: qsTr('help')
+
+     MenuItem {
+       text: qsTr('about')
+     }
+   }
+
+ }