From e14fbe9437a37ffd77020639d671b86302485b1f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A9bastien=20Blin?= <sebastien.blin@savoirfairelinux.com> Date: Tue, 20 Feb 2024 12:57:45 -0500 Subject: [PATCH] CallMessageDelegate: add icon and follow font-size GitLab: #1463 Change-Id: I8c61d1c526ddf69ae910627d0804608fd17b5c45 --- resources/icons/incoming-call.svg | 3 ++ resources/icons/missed-incoming-call.svg | 8 +++ resources/icons/missed-outgoing-call.svg | 8 +++ resources/icons/outgoing-call.svg | 3 ++ .../commoncomponents/CallMessageDelegate.qml | 50 +++++++++++++++++-- src/app/commoncomponents/SBSMessageBase.qml | 2 + 6 files changed, 69 insertions(+), 5 deletions(-) create mode 100644 resources/icons/incoming-call.svg create mode 100644 resources/icons/missed-incoming-call.svg create mode 100644 resources/icons/missed-outgoing-call.svg create mode 100644 resources/icons/outgoing-call.svg diff --git a/resources/icons/incoming-call.svg b/resources/icons/incoming-call.svg new file mode 100644 index 000000000..41a5675b8 --- /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 000000000..d7cd11fc1 --- /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 000000000..18107c344 --- /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 000000000..5b99b0ebe --- /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 fb4330de3..79dbb0c01 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 42902d7d8..5dabb60e4 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; } } -- GitLab