feat(ui/views/App/Calls/CallsWindow): add a ended call view

linphone-desktop/resources.qrc

@@ -339,6 +339,7 @@
     <file>ui/views/App/Calls/AbstractStartingCall.qml</file>
     <file>ui/views/App/Calls/CallsWindow.js</file>
     <file>ui/views/App/Calls/CallsWindow.qml</file>
+    <file>ui/views/App/Calls/EndedCall.qml</file>
     <file>ui/views/App/Calls/IncallFullscreenWindow.qml</file>
     <file>ui/views/App/Calls/Incall.js</file>
     <file>ui/views/App/Calls/Incall.qml</file>

linphone-desktop/ui/views/App/Calls/CallsWindow.qml

@@ -146,12 +146,15 @@ Window {
         id: incall
 
         Incall {
-          // `{}` is a workaround to avoid `TypeError: Cannot read property...` in `Incall` component.
-          call: window.call || ({
-            recording: false,
-            updating: true,
-            videoEnabled: false
-          })
+          call: window.call
+        }
+      }
+
+      Component {
+        id: endedCall
+
+        EndedCall {
+          call: window.call
         }
       }
 
@@ -188,6 +191,10 @@ Window {
             return outgoingCall
           }
 
+          if (status === CallModel.CallStatusEnded) {
+            return endedCall
+          }
+
           return incall
         }
       }

linphone-desktop/ui/views/App/Calls/EndedCall.qml

+import QtQuick 2.7
+import QtQuick.Layouts 1.3
+
+import Linphone 1.0
+import LinphoneUtils 1.0
+import Utils 1.0
+
+import App.Styles 1.0
+
+import 'Incall.js' as Logic
+
+// =============================================================================
+
+Rectangle {
+  id: endedCall
+
+  property var call
+
+  property var _sipAddressObserver: SipAddressesModel.getSipAddressObserver(sipAddress)
+
+  // ---------------------------------------------------------------------------
+
+  color: CallStyle.backgroundColor
+
+  ColumnLayout {
+    anchors {
+      fill: parent
+      topMargin: CallStyle.header.topMargin
+    }
+
+    spacing: 0
+
+    ContactDescription {
+      id: contactDescription
+
+      Layout.fillWidth: true
+      Layout.preferredHeight: CallStyle.header.contactDescription.height
+
+      horizontalTextAlignment: Text.AlignHCenter
+      sipAddress: _sipAddressObserver.sipAddress
+      username: LinphoneUtils.getContactUsername(_sipAddressObserver.contact || sipAddress)
+    }
+
+    Text {
+      Layout.fillWidth: true
+
+      color: CallStyle.header.elapsedTime.color
+      font.pointSize: CallStyle.header.elapsedTime.fontSize
+      horizontalAlignment: Text.AlignHCenter
+
+      text: {
+        var call = endedCall.call
+        return call ? Utils.formatElapsedTime(call.duration) : 0
+      }
+    }
+
+    Item {
+      id: container
+
+      Layout.fillWidth: true
+      Layout.fillHeight: true
+      Layout.margins: CallStyle.container.margins
+
+      Avatar {
+        anchors.centerIn: parent
+        backgroundColor: CallStyle.container.avatar.backgroundColor
+        image: _sipAddressObserver.contact && _sipAddressObserver.contact.vcard.avatar
+        username: contactDescription.username
+
+        height: Logic.computeAvatarSize(CallStyle.container.avatar.maxSize)
+        width: height
+      }
+    }
+
+    Item {
+      Layout.fillWidth: true
+      Layout.preferredHeight: CallStyle.actionArea.height
+    }
+  }
+}

linphone-desktop/ui/views/App/Calls/Incall.qml

@@ -68,7 +68,6 @@ Rectangle {
         anchors.left: parent.left
         icon: 'call_quality_0'
         iconSize: CallStyle.header.iconSize
-        visible: call.status !== CallModel.CallStatusEnded
         useStates: false
 
         onClicked: callStatistics.showMenu()
@@ -111,42 +110,38 @@ Rectangle {
       // Video actions.
       // -----------------------------------------------------------------------
 
-      Loader {
+      ActionBar {
         id: cameraActions
 
         anchors.right: parent.right
-        active: call.status !== CallModel.CallStatusEnded
-
-        sourceComponent: ActionBar {
-          iconSize: CallStyle.header.iconSize
+        iconSize: CallStyle.header.iconSize
 
-          ActionButton {
-            icon: 'tel_keypad'
+        ActionButton {
+          icon: 'tel_keypad'
 
-            onClicked: telKeypad.visible = !telKeypad.visible
-          }
+          onClicked: telKeypad.visible = !telKeypad.visible
+        }
 
-          ActionButton {
-            icon: 'screenshot'
-            visible: call.videoEnabled
+        ActionButton {
+          icon: 'screenshot'
+          visible: call.videoEnabled
 
-            onClicked: call.takeSnapshot()
-          }
+          onClicked: call.takeSnapshot()
+        }
 
-          ActionSwitch {
-            enabled: call.recording
-            icon: 'record'
-            useStates: false
+        ActionSwitch {
+          enabled: call.recording
+          icon: 'record'
+          useStates: false
 
-            onClicked: !enabled ? call.startRecording() : call.stopRecording()
-          }
+          onClicked: !enabled ? call.startRecording() : call.stopRecording()
+        }
 
-          ActionButton {
-            icon: 'fullscreen'
-            visible: call.videoEnabled
+        ActionButton {
+          icon: 'fullscreen'
+          visible: call.videoEnabled
 
-            onClicked: Logic.showFullscreen()
-          }
+          onClicked: Logic.showFullscreen()
         }
       }
     }
@@ -246,8 +241,6 @@ Rectangle {
       Layout.fillWidth: true
       Layout.preferredHeight: CallStyle.actionArea.height
 
-      visible: call.status !== CallModel.CallStatusEnded
-
       GridLayout {
         anchors {
           left: parent.left

linphone @ fca2fd2e

-Subproject commit 60c72c84375c753ae11bb780ec075808d5ace190
+Subproject commit fca2fd2e1e110aaae2b6be547ecb80c56dc9ff33