diff --git a/resources/icons/incoming-call.svg b/resources/icons/incoming-call.svg
new file mode 100644
index 0000000000000000000000000000000000000000..41a5675b836e8279255b232d149dcbf03e8f9d31
--- /dev/null
+++ b/resources/icons/incoming-call.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="22.08" height="22.08" viewBox="0 0 22.08 22.08">
+ <path id="noun-arrow-1167262" d="M35.45,26.488l-4.476,4.476V18.9H28.916V30.964l-4.476-4.476L23,27.955,29.945,34.9l6.971-6.945Z" transform="translate(8.913 -29.202) rotate(45)" stroke="#000" stroke-width="0.5"/>
+</svg>
diff --git a/resources/icons/missed-incoming-call.svg b/resources/icons/missed-incoming-call.svg
new file mode 100644
index 0000000000000000000000000000000000000000..d7cd11fc12b0e0db3bb85ec81cd2449b4c1c812e
--- /dev/null
+++ b/resources/icons/missed-incoming-call.svg
@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="8.814" viewBox="0 0 16 8.814">
+ <g id="noun-missed-3555066" transform="translate(-23.455 -28)">
+ <g id="Group_82" data-name="Group 82" transform="translate(23.455 28)">
+ <path id="Path_289" data-name="Path 289" d="M37.727,37.615a2.761,2.761,0,0,1-1.964-.815L31.17,32.211l1.782-1.782,4.589,4.593a.268.268,0,0,0,.368,0l5.852-5.852,1.782,1.782L39.691,36.8A2.761,2.761,0,0,1,37.727,37.615Z" transform="translate(-29.543 -28.802)"/>
+ <path id="Path_290" data-name="Path 290" d="M28.518,35.555H26v-6.3A1.259,1.259,0,0,1,27.259,28h6.3v2.518H28.518Z" transform="translate(-26 -28)"/>
+ </g>
+ </g>
+</svg>
diff --git a/resources/icons/missed-outgoing-call.svg b/resources/icons/missed-outgoing-call.svg
new file mode 100644
index 0000000000000000000000000000000000000000..18107c34408b6861d48e570ab785afa1d244407a
--- /dev/null
+++ b/resources/icons/missed-outgoing-call.svg
@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="8.814" viewBox="0 0 16 8.814">
+ <g id="noun-missed-3555066" transform="translate(-0.001)">
+ <g id="Group_82" data-name="Group 82" transform="translate(0.001)">
+ <path id="Path_289" data-name="Path 289" d="M38.986,37.615A2.761,2.761,0,0,0,40.95,36.8l4.593-4.589-1.782-1.782-4.589,4.593a.268.268,0,0,1-.368,0L32.952,29.17,31.17,30.952,37.022,36.8A2.761,2.761,0,0,0,38.986,37.615Z" transform="translate(-31.17 -28.802)"/>
+ <path id="Path_290" data-name="Path 290" d="M31.036,35.555h2.518v-6.3A1.259,1.259,0,0,0,32.3,28H26v2.518h5.036Z" transform="translate(-17.555 -28)"/>
+ </g>
+ </g>
+</svg>
diff --git a/resources/icons/outgoing-call.svg b/resources/icons/outgoing-call.svg
new file mode 100644
index 0000000000000000000000000000000000000000..5b99b0ebed20a3bcea9b0316180bb5fc5dccedab
--- /dev/null
+++ b/resources/icons/outgoing-call.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="22.08" height="22.08" viewBox="0 0 22.08 22.08">
+ <path id="noun-arrow-1167262" d="M12.45,7.589,7.974,12.064V0H5.916V12.064L1.44,7.588,0,9.055,6.945,16l6.971-6.945Z" transform="translate(10.267 21.654) rotate(-135)" stroke="#000" stroke-width="0.5"/>
+</svg>
diff --git a/src/app/commoncomponents/CallMessageDelegate.qml b/src/app/commoncomponents/CallMessageDelegate.qml
index fb4330de3ab222f9990634de91be654b0aa0bca4..79dbb0c01bab306d9b5da31f43d436551fe21264 100644
--- a/src/app/commoncomponents/CallMessageDelegate.qml
+++ b/src/app/commoncomponents/CallMessageDelegate.qml
@@ -18,6 +18,7 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
+import Qt5Compat.GraphicalEffects
import net.jami.Models 1.1
import net.jami.Adapters 1.1
import net.jami.Constants 1.1
@@ -47,6 +48,8 @@ SBSMessageBase {
bubble.border.color: CurrentConversation.color
bubble.border.width: root.isActive ? 1.5 : 0
+ bubble.color: JamiTheme.messageInBgColor
+ bubble.opacity: 0.6
Connections {
target: CurrentConversation
@@ -65,7 +68,7 @@ SBSMessageBase {
property bool isActive: LRCInstance.indexOfActiveCall(ConfId, ActionUri, DeviceId) !== -1
visible: isActive || ConfId === "" || Duration > 0
- property var baseColor: isOutgoing? CurrentConversation.color : JamiTheme.messageInBgColor
+ property var baseColor: JamiTheme.messageInBgColor
innerContent.children: [
RowLayout {
@@ -74,22 +77,59 @@ SBSMessageBase {
spacing: 10
visible: root.visible
- Label {
+ Image {
+ id: statusIcon
+ Layout.leftMargin: 8
+ width: 10
+ height: 10
+ verticalAlignment: Qt.AlignVCenter
+ visible: !root.isActive
+
+ source: {
+ if (root.isOutgoing) {
+ if (Duration > 0)
+ return "qrc:/icons/outgoing-call.svg";
+ else
+ return "qrc:/icons/missed-outgoing-call.svg";
+ } else {
+ if (Duration > 0)
+ return "qrc:/icons/incoming-call.svg";
+ else
+ return "qrc:/icons/missed-incoming-call.svg";
+ }
+ }
+ layer {
+ enabled: true
+ effect: ColorOverlay {
+ color: {
+ if (Duration > 0)
+ return UtilsAdapter.luma(root.baseColor) ? JamiTheme.chatviewTextColorLight : JamiTheme.chatviewTextColorDark
+ return JamiTheme.redColor
+ }
+ }
+ }
+
+ }
+
+ TextEdit {
id: callLabel
- Layout.margins: 8
+ topPadding: 8
+ bottomPadding: 8
+
Layout.fillWidth: true
Layout.rightMargin: root.isActive ? 0 : root.timeWidth + 16
- Layout.leftMargin: root.isActive ? 10 : 8
+ Layout.leftMargin: root.isActive ? 10 : -5 /* spacing is 10 and we want 5px with icon */
text: {
if (root.isActive)
return JamiStrings.startedACall;
return Body;
}
+ verticalAlignment: Qt.AlignVCenter
horizontalAlignment: Qt.AlignHCenter
- font.pointSize: JamiTheme.mediumFontSize
+ font.pointSize: JamiTheme.smallFontSize
font.hintingPreference: Font.PreferNoHinting
renderType: Text.NativeRendering
textFormat: Text.MarkdownText
diff --git a/src/app/commoncomponents/SBSMessageBase.qml b/src/app/commoncomponents/SBSMessageBase.qml
index 42902d7d8eea9a7a7f5be6cb8b68832e3e77eaf5..5dabb60e43dcba2f93c0683c3e8f45f20f4d2b04 100644
--- a/src/app/commoncomponents/SBSMessageBase.qml
+++ b/src/app/commoncomponents/SBSMessageBase.qml
@@ -405,6 +405,8 @@ Control {
return -20;
if (root.bigMsg || bubble.isDeleted)
return 5;
+ if (root.type === Interaction.Type.CALL)
+ return 8;
return 9;
}
}