diff --git a/src/mainview/components/ParticipantOverlay.qml b/src/mainview/components/ParticipantOverlay.qml index 9fb874608c068ca9b50fdeac262ebd9092932729..5f8740436344268a1ff69596d17440204e316e18 100644 --- a/src/mainview/components/ParticipantOverlay.qml +++ b/src/mainview/components/ParticipantOverlay.qml @@ -61,8 +61,6 @@ Item { } } - z: 1 - function setAvatar(show, uri, isLocal) { if (!show) avatar.active = false @@ -136,47 +134,56 @@ Item { } } - // Participant background and buttons for moderation - MouseArea { - id: participantRect - - anchors.fill: parent - opacity: 0 - z: 1 - - propagateComposedEvents: true - hoverEnabled: true - onPositionChanged: { + HoverHandler { + onPointChanged: { participantRect.opacity = 1 fadeOutTimer.restart() - // Here we could call: root.parent.positionChanged(mouse) - // to relay the event to a main overlay mouse area, either - // as a parent object or some property passed in. But, this - // will still fail when hovering over menus, etc. - } - onExited: { - root.z = 1 - participantRect.opacity = 0 } - onEntered: { - root.z = 2 - participantRect.opacity = 1 + + onHoveredChanged: { + if (overlayMenu.hovered) { + participantRect.opacity = 1 + fadeOutTimer.restart() + return + } + participantRect.opacity = hovered ? 1 : 0 } + } - // Timer to decide when ParticipantOverlay fade out - Timer { - id: fadeOutTimer - interval: JamiTheme.overlayFadeDelay - onTriggered: { - if (overlayMenu.hovered) - return - participantRect.opacity = 0 + // Timer to decide when ParticipantOverlay fade out + Timer { + id: fadeOutTimer + interval: JamiTheme.overlayFadeDelay + onTriggered: { + if (overlayMenu.hovered) { + fadeOutTimer.restart() + return } + participantRect.opacity = 0 } + } + + // Participant background and buttons for moderation + Rectangle { + id: participantRect + + width: parent.width + height: parent.height + color: "transparent" + opacity: 0 ParticipantOverlayMenu { id: overlayMenu visible: isMe || meModerator + + onHoveredChanged: { + if (hovered) { + participantRect.opacity = 1 + fadeOutTimer.restart() + } else { + participantRect.opacity = 0 + } + } } // Participant footer with host, moderator and mute indicators diff --git a/src/mainview/components/ParticipantOverlayButton.qml b/src/mainview/components/ParticipantOverlayButton.qml index 0f4ac7edf30d7b4a3b9138e3af8b89c4961174b8..0b90ff7868cf53e0368b44d7e9e206cf6c42ab9a 100644 --- a/src/mainview/components/ParticipantOverlayButton.qml +++ b/src/mainview/components/ParticipantOverlayButton.qml @@ -32,6 +32,7 @@ PushButton { pressedColor: JamiTheme.buttonConferencePressed imageColor: JamiTheme.whiteColor + hoverEnabled: false Rectangle { id: toolTipRect @@ -44,7 +45,7 @@ PushButton { } color : isBarLayout? JamiTheme.darkGreyColorOpacity : "transparent" - visible: root.hovered && !isSmall + visible: hover.hovered && !isSmall radius: 2 Text { @@ -55,4 +56,9 @@ PushButton { font.pointSize: JamiTheme.tinyFontSize } } + Item { + anchors.fill: parent + + HoverHandler { id: hover } + } } diff --git a/src/mainview/components/ParticipantOverlayMenu.qml b/src/mainview/components/ParticipantOverlayMenu.qml index 26c93e0bcfc1e869f40b5a85fe4fe0474322c7f5..80a835ac785e0f6c5cb8a265003bca87a1f09c4f 100644 --- a/src/mainview/components/ParticipantOverlayMenu.qml +++ b/src/mainview/components/ParticipantOverlayMenu.qml @@ -49,10 +49,12 @@ Item { property int buttonPreferredSize: 24 property int iconButtonPreferredSize: 16 - property bool hovered: false + property alias hovered: hover.hovered anchors.fill: parent + HoverHandler { id: hover } + Loader { sourceComponent: isBarLayout ? barComponent : rectComponent } Component { @@ -61,8 +63,7 @@ Item { Control { width: root.width height: root.height - - onHoveredChanged: root.hovered = hovered + hoverEnabled: false background: Rectangle { property int buttonsSize: buttonsRect.visibleButtons * 24 + 8 * 2 @@ -77,16 +78,9 @@ Item { height: isOverlayRect ? 80 : parent.height } - ColumnLayout { + ParticipantControlLayout { + id: buttonsRect anchors.centerIn: parent - - ParticipantControlLayout { - id: buttonsRect - - Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter - Layout.preferredWidth: implicitWidth - Layout.preferredHeight: shapeHeight - } } } } @@ -95,18 +89,17 @@ Item { id: barComponent Control { - width: buttonsRect.implicitWidth + width: barButtons.implicitWidth height: shapeHeight - - onHoveredChanged: root.hovered = hovered + hoverEnabled: false background: Item { clip: true Rectangle { color: JamiTheme.darkGreyColorOpacity radius: shapeRadius - width: parent.width + radius - height: parent.height + radius + width: parent.width + 2 * radius + height: parent.height + 2 * radius anchors.fill: parent anchors.leftMargin: -radius anchors.topMargin: -radius @@ -114,11 +107,7 @@ Item { } ParticipantControlLayout { - id: buttonsRect - - Layout.rightMargin: 8 - Layout.preferredWidth: implicitWidth - Layout.preferredHeight: shapeHeight + id: barButtons } } }