generalMenuItem: enable text elide and width extension

Change-Id: I83897c81ed66313e84596bd7ab8cc3c79b56f47e

src/commoncomponents/contextmenu/BaseContextMenu.qml

@@ -50,6 +50,14 @@ Menu {
     function loadMenuItems(menuItems) {
         root.addItem(menuTopBorder)
 
+        // use the maximum text width as the preferred width for menu
+        for (var j = 0; j < menuItems.length; ++j) {
+            var currentItemWidth = menuItems[j].itemPreferredWidth
+            if (currentItemWidth !== JamiTheme.menuItemsPreferredWidth
+                    && currentItemWidth > menuPreferredWidth)
+                menuPreferredWidth = currentItemWidth
+        }
+
         for (var i = 0; i < menuItems.length; ++i) {
             if (menuItems[i].canTrigger) {
                 menuItems[i].parentMenu = root

src/commoncomponents/contextmenu/GeneralMenuItem.qml

@@ -37,6 +37,7 @@ MenuItem {
     property string iconColor: ""
     property bool canTrigger: true
     property bool addMenuSeparatorAfter: false
+    property bool autoTextSizeAdjustment: true
     property BaseContextMenu parentMenu
 
     property int itemPreferredWidth: JamiTheme.menuItemsPreferredWidth
@@ -59,35 +60,53 @@ MenuItem {
 
         anchors.fill: parent
 
-        ResponsiveImage {
-            id: contextMenuItemImage
+        RowLayout {
+            spacing: 0
 
-            anchors.left: status === Image.Ready ? menuItemContentRect.left : undefined
-            anchors.leftMargin: (status === Image.Ready ? 24 : 0)
-            anchors.verticalCenter: menuItemContentRect.verticalCenter
+            anchors.fill: menuItemContentRect
 
-            color: iconColor !== "" ? iconColor : JamiTheme.textColor
+            ResponsiveImage {
+                id: contextMenuItemImage
 
-            smooth: true
-            opacity: 0.7
-        }
-
-        Text {
-            id: contextMenuItemText
+                Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
+                Layout.leftMargin: status === Image.Ready ? 24 : 0
 
-            anchors.left: contextMenuItemImage.status === Image.Ready ?
-                              contextMenuItemImage.right : menuItemContentRect.left
-            anchors.leftMargin: contextMenuItemImage.status === Image.Ready ? 20 : 10
-            anchors.verticalCenter: menuItemContentRect.verticalCenter
+                visible: status === Image.Ready
 
-            height: itemPreferredHeight
+                color: iconColor !== "" ? iconColor : JamiTheme.textColor
+                smooth: true
+                opacity: 0.7
+            }
 
-            text: itemName
-            color: JamiTheme.textColor
-            wrapMode: Text.WordWrap
-            font.pointSize: JamiTheme.textFontSize
-            horizontalAlignment: Text.AlignLeft
-            verticalAlignment: Text.AlignVCenter
+            Text {
+                id: contextMenuItemText
+
+                Layout.alignment: Qt.AlignVCenter | Qt.AlignLeft
+                Layout.leftMargin: contextMenuItemImage.status === Image.Ready ? 20 : 10
+                Layout.rightMargin: contextMenuItemImage.status === Image.Ready ? 20 : 10
+                Layout.preferredHeight: itemPreferredHeight
+                Layout.preferredWidth: JamiTheme.contextMenuItemTextPreferredWidth
+
+                text: itemName
+                color: JamiTheme.textColor
+                font.pointSize: JamiTheme.textFontSize
+                horizontalAlignment: Text.AlignLeft
+                verticalAlignment: Text.AlignVCenter
+                elide: Text.ElideRight
+
+                onWidthChanged: {
+                    if (autoTextSizeAdjustment
+                            && width > contextMenuItemText.Layout.preferredWidth) {
+                        if (width > JamiTheme.contextMenuItemTextMaxWidth)
+                            contextMenuItemText.Layout.preferredWidth
+                                    = JamiTheme.contextMenuItemTextMaxWidth
+                        else
+                            contextMenuItemText.Layout.preferredWidth = width
+                        itemPreferredWidth += contextMenuItemText.Layout.preferredWidth
+                                - JamiTheme.contextMenuItemTextPreferredWidth
+                    }
+                }
+            }
         }
 
         onReleased: {
@@ -97,12 +116,20 @@ MenuItem {
 
         states: [
             State {
-                name: "hovered"; when: hovered
-                PropertyChanges { target: background; color: JamiTheme.hoverColor }
+                name: "hovered"
+                when: hovered
+                PropertyChanges {
+                    target: background
+                    color: JamiTheme.hoverColor
+                }
             },
             State {
-                name: "normal"; when: !hovered
-                PropertyChanges { target: background; color: JamiTheme.backgroundColor }
+                name: "normal"
+                when: !hovered
+                PropertyChanges {
+                    target: background
+                    color: JamiTheme.backgroundColor
+                }
             }
         ]
     }

src/constant/JamiTheme.qml

@@ -197,6 +197,8 @@ Item {
     property real smartListAvatarSize: 52
     property real avatarSizeInCall: 130
     property real callButtonPreferredSize: 50
+    property real contextMenuItemTextPreferredWidth: 142
+    property real contextMenuItemTextMaxWidth: 182
     property int participantCallInStatusViewWidth: 175
     property int participantCallInStatusViewHeight: 300
     property int participantCallInStatusDelegateHeight: 85