Add icons and improve narrow participants column.

Telegram/SourceFiles/calls/calls.style

@@ -1132,49 +1132,55 @@ desktopCaptureSubmit: RoundButton(desktopCaptureCancel) {
 }
 
 groupCallNarrowSkip: 9px;
-groupCallNarrowRowSkip: 4px;
-groupCallNarrowSize: size(144px, 90px);
-groupCallNarrowUserpicTop: 13px;
-groupCallNarrowNameTop: 65px;
-groupCallNarrowIconTop: 62px;
-groupCallNarrowIconLess: 5px;
-groupCallWideModeWidthMin: 550px;
+groupCallNarrowMembersWidth: 202px;
+//groupCallNarrowRowSkip: 4px;
+//groupCallNarrowSize: size(144px, 90px);
+//groupCallNarrowUserpicTop: 13px;
+//groupCallNarrowNameTop: 65px;
+//groupCallNarrowIconTop: 62px;
+//groupCallNarrowIconLess: 5px;
+groupCallWideModeWidthMin: 600px;
 groupCallWideModeSize: size(960px, 580px);
-groupCallNarrowAddMemberHeight: 32px;
-groupCallNarrowOutline: 2px;
-groupCallNarrowShadowHeight: 36px;
+//groupCallNarrowAddMemberHeight: 32px;
+//groupCallNarrowOutline: 2px;
+//groupCallNarrowShadowHeight: 36px;
 
-groupCallNarrowAddMember: RoundButton(defaultActiveButton) {
-	textFg: groupCallMemberNotJoinedStatus;
-	textFgOver: groupCallMemberNotJoinedStatus;
-	textBg: groupCallMembersBg;
-	textBgOver: groupCallMembersBgOver;
-
-	height: 32px;
-	radius: roundRadiusLarge;
-
-	ripple: groupCallRipple;
-}
+//groupCallNarrowAddMember: RoundButton(defaultActiveButton) {
+//	textFg: groupCallMemberNotJoinedStatus;
+//	textFgOver: groupCallMemberNotJoinedStatus;
+//	textBg: groupCallMembersBg;
+//	textBgOver: groupCallMembersBgOver;
+//
+//	height: 32px;
+//	radius: roundRadiusLarge;
+//
+//	ripple: groupCallRipple;
+//}
 groupCallNarrowInactiveCrossLine: CrossLineAnimation {
-	fg: groupCallMemberInactiveIcon;
-	icon: icon {{ "calls/voice_mute_mini", groupCallMemberInactiveIcon }};
-	startPosition: point(7px, 4px);
-	endPosition: point(17px, 16px);
+	fg: groupCallMemberInactiveStatus;
+	icon: icon {{ "calls/video_mini_mute", groupCallMemberInactiveStatus }};
+	startPosition: point(3px, 0px);
+	endPosition: point(13px, 12px);
 	stroke: 3px;
 	strokeDenominator: 2;
 }
 groupCallNarrowColoredCrossLine: CrossLineAnimation(groupCallNarrowInactiveCrossLine) {
-	fg: groupCallMemberMutedIcon;
-	icon: icon {{ "calls/voice_mute_mini", groupCallMemberActiveIcon }};
-}
-groupCallVideoCrossLine: CrossLineAnimation(groupCallNarrowInactiveCrossLine) {
-	fg: groupCallVideoTextFg;
-	icon: icon {{ "calls/voice_mute_mini", groupCallVideoTextFg }};
+	fg: groupCallMemberNotJoinedStatus;
+	icon: icon {{ "calls/video_mini_mute", groupCallMemberActiveStatus }};
 }
+groupCallNarrowRaisedHand: icon {{ "calls/video_mini_speak", groupCallMemberInactiveStatus }};
+groupCallNarrowCameraIcon: icon {{ "calls/video_mini_video", groupCallMemberInactiveStatus }};
+groupCallNarrowScreenIcon: icon {{ "calls/video_mini_screencast", groupCallMemberInactiveStatus }};
+groupCallNarrowIconPosition: point(-4px, 2px);
+groupCallNarrowIconSkip: 15px;
+//groupCallVideoCrossLine: CrossLineAnimation(groupCallNarrowInactiveCrossLine) {
+//	fg: groupCallVideoTextFg;
+//	icon: icon {{ "calls/voice_mute_mini", groupCallVideoTextFg }};
+//}
 
 groupCallLargeVideoCrossLine: CrossLineAnimation(groupCallMemberColoredCrossLine) {
-	fg: groupCallVideoSubTextFg;
-	icon: icon {{ "calls/group_calls_unmuted", groupCallVideoSubTextFg }};
+	fg: groupCallVideoTextFg;
+	icon: icon {{ "calls/video_over_mute", groupCallVideoTextFg }};
 }
 
 GroupCallLargeVideo {
@@ -1196,16 +1202,16 @@ groupCallLargeVideoNarrow: GroupCallLargeVideo(groupCallLargeVideoWide) {
 	enlargeAlign: align(center);
 	pinPosition: point(-1px, -1px);
 }
-groupCallLargeVideoListItem: PeerListItem(groupCallMembersListItem) {
-	nameFg: groupCallVideoTextFg;
-	nameFgChecked: groupCallVideoTextFg;
-	statusFg: groupCallVideoSubTextFg;
-	statusFgOver: groupCallVideoSubTextFg;
-	statusFgActive: groupCallVideoSubTextFg;
-}
+//groupCallLargeVideoListItem: PeerListItem(groupCallMembersListItem) {
+//	nameFg: groupCallVideoTextFg;
+//	nameFgChecked: groupCallVideoTextFg;
+//	statusFg: groupCallVideoSubTextFg;
+//	statusFgOver: groupCallVideoSubTextFg;
+//	statusFgActive: groupCallVideoSubTextFg;
+//}
 groupCallLargeVideoPin: CrossLineAnimation {
-	fg: groupCallVideoSubTextFg;
-	icon: icon {{ "calls/voice_pin", groupCallVideoSubTextFg }};
+	fg: groupCallVideoTextFg;
+	icon: icon {{ "calls/voice_pin", groupCallVideoTextFg }};
 	startPosition: point(5px, 2px);
 	endPosition: point(20px, 17px);
 	stroke: 2px;

Telegram/SourceFiles/calls/group/calls_group_members.cpp

@@ -82,6 +82,7 @@ public:
 		-> rpl::producer<not_null<PeerData*>>;
 
 	Row *findRow(not_null<PeerData*> participantPeer) const;
+	void setMode(PanelMode mode);
 
 	bool rowIsMe(not_null<PeerData*> participantPeer) override;
 	bool rowCanMuteMembers() override;
@@ -91,34 +92,41 @@ public:
 		Painter &p,
 		QRect rect,
 		const IconState &state) override;
-	void rowPaintNarrowBackground(
+	int rowPaintStatusIcon(
 		Painter &p,
 		int x,
 		int y,
-		bool selected) override;
-	void rowPaintNarrowBorder(
-		Painter &p,
-		int x,
-		int y,
-		not_null<Row*> row) override;
-	void rowPaintNarrowShadow(
-		Painter &p,
-		int x,
-		int y,
-		int sizew,
-		int sizeh) override;
+		int outerWidth,
+		not_null<MembersRow*> row,
+		const IconState &state) override;
+	//void rowPaintNarrowBackground(
+	//	Painter &p,
+	//	int x,
+	//	int y,
+	//	bool selected) override;
+	//void rowPaintNarrowBorder(
+	//	Painter &p,
+	//	int x,
+	//	int y,
+	//	not_null<Row*> row) override;
+	//void rowPaintNarrowShadow(
+	//	Painter &p,
+	//	int x,
+	//	int y,
+	//	int sizew,
+	//	int sizeh) override;
 
-	int customRowHeight() override;
-	void customRowPaint(
-		Painter &p,
-		crl::time now,
-		not_null<PeerListRow*> row,
-		bool selected) override;
-	bool customRowSelectionPoint(
-		not_null<PeerListRow*> row,
-		int x,
-		int y) override;
-	Fn<QImage()> customRowRippleMaskGenerator() override;
+	//int customRowHeight() override;
+	//void customRowPaint(
+	//	Painter &p,
+	//	crl::time now,
+	//	not_null<PeerListRow*> row,
+	//	bool selected) override;
+	//bool customRowSelectionPoint(
+	//	not_null<PeerListRow*> row,
+	//	int x,
+	//	int y) override;
+	//Fn<QImage()> customRowRippleMaskGenerator() override;
 
 private:
 	[[nodiscard]] std::unique_ptr<Row> createRowForMe();
@@ -167,6 +175,10 @@ private:
 	bool toggleRowVideo(not_null<PeerListRow*> row);
 	void showRowMenu(not_null<PeerListRow*> row);
 
+	void toggleVideoEndpointActive(
+		const VideoEndpoint &endpoint,
+		bool active);
+
 	void appendInvitedUsers();
 	void scheduleRaisedHandStatusRemove();
 
@@ -188,17 +200,20 @@ private:
 	base::Timer _raisedHandStatusRemoveTimer;
 
 	base::flat_map<uint32, not_null<Row*>> _soundingRowBySsrc;
-	base::flat_map<std::string, not_null<Row*>> _videoEndpoints;
+	//base::flat_map<std::string, not_null<Row*>> _videoEndpoints;
+	base::flat_set<not_null<PeerData*>> _cameraActive;
+	base::flat_set<not_null<PeerData*>> _screenActive;
 	Ui::Animations::Basic _soundingAnimation;
 
 	crl::time _soundingAnimationHideLastTime = 0;
 	bool _skipRowLevelUpdate = false;
 
+	PanelMode _mode = PanelMode::Default;
 	Ui::CrossLineAnimation _inactiveCrossLine;
 	Ui::CrossLineAnimation _coloredCrossLine;
 	Ui::CrossLineAnimation _inactiveNarrowCrossLine;
 	Ui::CrossLineAnimation _coloredNarrowCrossLine;
-	Ui::CrossLineAnimation _videoNarrowCrossLine;
+	//Ui::CrossLineAnimation _videoNarrowCrossLine;
 	Ui::CrossLineAnimation _videoLargeCrossLine;
 	Ui::RoundRect _narrowRoundRectSelected;
 	Ui::RoundRect _narrowRoundRect;
@@ -219,7 +234,7 @@ Members::Controller::Controller(
 , _coloredCrossLine(st::groupCallMemberColoredCrossLine)
 , _inactiveNarrowCrossLine(st::groupCallNarrowInactiveCrossLine)
 , _coloredNarrowCrossLine(st::groupCallNarrowColoredCrossLine)
-, _videoNarrowCrossLine(st::groupCallVideoCrossLine)
+//, _videoNarrowCrossLine(st::groupCallVideoCrossLine)
 , _videoLargeCrossLine(st::groupCallLargeVideoCrossLine)
 , _narrowRoundRectSelected(
 	ImageRoundRadius::Large,
@@ -231,7 +246,7 @@ Members::Controller::Controller(
 		_coloredCrossLine.invalidate();
 		_inactiveNarrowCrossLine.invalidate();
 		_coloredNarrowCrossLine.invalidate();
-		_videoNarrowCrossLine.invalidate();
+		//_videoNarrowCrossLine.invalidate();
 	}, _lifetime);
 
 	rpl::combine(
@@ -444,11 +459,64 @@ void Members::Controller::subscribeToChanges(not_null<Data::GroupCall*> real) {
 		}
 	}, _lifetime);
 
+	for (const auto &[endpoint, track] : _call->activeVideoTracks()) {
+		toggleVideoEndpointActive(endpoint, true);
+	}
+	_call->videoStreamActiveUpdates(
+	) | rpl::start_with_next([=](const VideoEndpoint &endpoint) {
+		const auto active = _call->activeVideoTracks().contains(endpoint);
+		toggleVideoEndpointActive(endpoint, active);
+	}, _lifetime);
+
 	if (_prepared) {
 		appendInvitedUsers();
 	}
 }
 
+void Members::Controller::toggleVideoEndpointActive(
+		const VideoEndpoint &endpoint,
+		bool active) {
+	const auto toggleOne = [=](
+			base::flat_set<not_null<PeerData*>> &set,
+			not_null<PeerData*> participantPeer,
+			bool active) {
+		if ((active && set.emplace(participantPeer).second)
+			|| (!active && set.remove(participantPeer))) {
+			if (_mode == PanelMode::Wide) {
+				if (const auto row = findRow(participantPeer)) {
+					delegate()->peerListUpdateRow(row);
+				}
+			}
+		}
+	};
+	const auto &id = endpoint.id;
+	const auto participantPeer = endpoint.peer;
+	const auto real = _call->lookupReal();
+	if (active) {
+		if (const auto participant = findParticipant(id)) {
+			if (computeCameraEndpoint(participant) == id) {
+				toggleOne(_cameraActive, participantPeer, true);
+			} else if (computeScreenEndpoint(participant) == id) {
+				toggleOne(_screenActive, participantPeer, true);
+			}
+		}
+	} else if (const auto participant = real->participantByPeer(
+			participantPeer)) {
+		const auto &camera = computeCameraEndpoint(participant);
+		const auto &screen = computeScreenEndpoint(participant);
+		if (camera == id || camera.empty()) {
+			toggleOne(_cameraActive, participantPeer, false);
+		}
+		if (screen == id || screen.empty()) {
+			toggleOne(_screenActive, participantPeer, false);
+		}
+	} else {
+		toggleOne(_cameraActive, participantPeer, false);
+		toggleOne(_screenActive, participantPeer, false);
+	}
+
+}
+
 void Members::Controller::appendInvitedUsers() {
 	if (const auto id = _call->id()) {
 		for (const auto user : _peer->owner().invitedToCallUsers(id)) {
@@ -714,6 +782,13 @@ Row *Members::Controller::findRow(
 		delegate()->peerListFindRow(participantPeer->id.value));
 }
 
+void Members::Controller::setMode(PanelMode mode) {
+	if (_mode == mode) {
+		return;
+	}
+	_mode = mode;
+}
+
 const Data::GroupCallParticipant *Members::Controller::findParticipant(
 		const std::string &endpoint) const {
 	if (endpoint.empty()) {
@@ -884,14 +959,28 @@ void Members::Controller::rowPaintIcon(
 		Painter &p,
 		QRect rect,
 		const IconState &state) {
-	const auto narrowUserpic = (state.style == MembersRowStyle::Userpic);
-	const auto narrowVideo = (state.style == MembersRowStyle::Video);
+	if (_mode == PanelMode::Wide && state.style == MembersRowStyle::None) {
+		return;
+	}
+	//const auto narrowUserpic = (state.style == MembersRowStyle::Userpic);
+	//const auto narrowVideo = (state.style == MembersRowStyle::Video);
+	const auto narrow = (state.style == MembersRowStyle::Narrow);
+	if (!narrow && state.invited) {
+		st::groupCallMemberInvited.paintInCenter(
+			p,
+			QRect(
+				rect.topLeft() + st::groupCallMemberInvitedPosition,
+				st::groupCallMemberInvited.size()));
+		return;
+	}
 	const auto largeVideo = (state.style == MembersRowStyle::LargeVideo);
 	const auto &greenIcon = largeVideo
 		? st::groupCallLargeVideoCrossLine.icon
-		: narrowVideo
-		? st::groupCallVideoCrossLine.icon
-		: narrowUserpic
+		//: narrowVideo
+		//? st::groupCallVideoCrossLine.icon
+		//: narrowUserpic
+		//? st::groupCallNarrowColoredCrossLine.icon
+		: narrow
 		? st::groupCallNarrowColoredCrossLine.icon
 		: st::groupCallMemberColoredCrossLine.icon;
 	const auto left = rect.x() + (rect.width() - greenIcon.width()) / 2;
@@ -905,9 +994,11 @@ void Members::Controller::rowPaintIcon(
 			// Just gray icon, no cross, no coloring.
 			const auto &grayIcon = largeVideo
 				? st::groupCallLargeVideoCrossLine.icon
-				: narrowVideo
-				? st::groupCallVideoCrossLine.icon
-				: narrowUserpic
+				//: narrowVideo
+				//? st::groupCallVideoCrossLine.icon
+				//: narrowUserpic
+				//? st::groupCallNarrowInactiveCrossLine.icon
+				: narrow
 				? st::groupCallNarrowInactiveCrossLine.icon
 				: st::groupCallMemberInactiveCrossLine.icon;
 			grayIcon.paintInCenter(p, rect);
@@ -915,21 +1006,26 @@ void Members::Controller::rowPaintIcon(
 		} else if (state.active == 0.) {
 			if (state.muted == 1.) {
 				if (state.raisedHand) {
-					// #TODO narrow mode icon
-					st::groupCallMemberRaisedHand.paintInCenter(p, rect);
+					(narrow
+						? st::groupCallNarrowRaisedHand
+						: st::groupCallMemberRaisedHand).paintInCenter(p, rect);
 					return;
 				}
 				// Red crossed icon, colorized once, cached as last frame.
 				auto &line = largeVideo
 					? _videoLargeCrossLine
-					: narrowVideo
-					? _videoNarrowCrossLine
-					: narrowUserpic
+					//: narrowVideo
+					//? _videoNarrowCrossLine
+					//: narrowUserpic
+					//? _coloredNarrowCrossLine
+					: narrow
 					? _coloredNarrowCrossLine
 					: _coloredCrossLine;
-				const auto color = (largeVideo || narrowVideo)
+				const auto color = (largeVideo/* || narrowVideo*/)
 					? std::nullopt
-					: std::make_optional(st::groupCallMemberMutedIcon->c);
+					: std::make_optional(narrow
+						? st::groupCallMemberNotJoinedStatus->c
+						: st::groupCallMemberMutedIcon->c);
 				line.paint(
 					p,
 					left,
@@ -941,9 +1037,11 @@ void Members::Controller::rowPaintIcon(
 				// Gray crossed icon, no coloring, cached as last frame.
 				auto &line = largeVideo
 					? _videoLargeCrossLine
-					: narrowVideo
-					? _videoNarrowCrossLine
-					: narrowUserpic
+					//: narrowVideo
+					//? _videoNarrowCrossLine
+					//: narrowUserpic
+					//? _inactiveNarrowCrossLine
+					: narrow
 					? _inactiveNarrowCrossLine
 					: _inactiveCrossLine;
 				line.paint(p, left, top, 1.);
@@ -952,119 +1050,163 @@ void Members::Controller::rowPaintIcon(
 		}
 	}
 	const auto activeInactiveColor = anim::color(
-		st::groupCallMemberInactiveIcon,
-		(state.mutedByMe
+		(narrow
+			? st::groupCallMemberInactiveStatus
+			: st::groupCallMemberInactiveIcon),
+		(narrow
+			? st::groupCallMemberActiveStatus
+			: state.mutedByMe
 			? st::groupCallMemberMutedIcon
 			: st::groupCallMemberActiveIcon),
 		state.speaking);
 	const auto iconColor = anim::color(
 		activeInactiveColor,
-		st::groupCallMemberMutedIcon,
+		(narrow
+			? st::groupCallMemberNotJoinedStatus
+			: st::groupCallMemberMutedIcon),
 		state.muted);
-	const auto color = (largeVideo || narrowVideo)
+	const auto color = (largeVideo/* || narrowVideo*/)
 		? std::nullopt
-		: std::make_optional(iconColor);
+		: std::make_optional((narrow && state.mutedByMe)
+			? st::groupCallMemberMutedIcon->c
+			: (narrow && state.raisedHand)
+			? st::groupCallMemberInactiveStatus->c
+			: iconColor);
 
 	// Don't use caching of the last frame,
 	// because 'muted' may animate color.
 	const auto crossProgress = std::min(1. - state.active, 0.9999);
 	auto &line = largeVideo
 		? _videoLargeCrossLine
-		: narrowVideo
-		? _videoNarrowCrossLine
-		: narrowUserpic
+		//: narrowVideo
+		//? _videoNarrowCrossLine
+		//: narrowUserpic
+		//? _inactiveNarrowCrossLine
+		: narrow
 		? _inactiveNarrowCrossLine
 		: _inactiveCrossLine;
 	line.paint(p, left, top, crossProgress, color);
 }
 
-void Members::Controller::rowPaintNarrowBackground(
+int Members::Controller::rowPaintStatusIcon(
 		Painter &p,
 		int x,
 		int y,
-		bool selected) {
-	(selected ? _narrowRoundRectSelected : _narrowRoundRect).paint(
-		p,
-		{ QPoint(x, y), st::groupCallNarrowSize });
-}
+		int outerWidth,
+		not_null<MembersRow*> row,
+		const IconState &state) {
+	Expects(state.style == MembersRowStyle::Narrow);
 
-void Members::Controller::rowPaintNarrowBorder(
-		Painter &p,
-		int x,
-		int y,
-		not_null<Row*> row) {
-	//if (_call->videoEndpointLarge().peer != row->peer().get()) {
-	//	return;
-	//}
-	//auto hq = PainterHighQualityEnabler(p);
-	//p.setBrush(Qt::NoBrush);
-	//auto pen = st::groupCallMemberActiveIcon->p;
-	//pen.setWidthF(st::groupCallNarrowOutline);
-	//p.setPen(pen);
-	//p.drawRoundedRect(
-	//	QRect{ QPoint(x, y), st::groupCallNarrowSize },
-	//	st::roundRadiusLarge,
-	//	st::roundRadiusLarge);
-}
-
-void Members::Controller::rowPaintNarrowShadow(
-		Painter &p,
-		int x,
-		int y,
-		int sizew,
-		int sizeh) {
-	if (_narrowShadow.isNull()) {
-		_narrowShadow = GenerateShadow(
-			st::groupCallNarrowShadowHeight,
-			0,
-			kShadowMaxAlpha);
+	if (_mode != PanelMode::Wide) {
+		return 0;
 	}
-	const auto height = st::groupCallNarrowShadowHeight;
-	p.drawImage(
-		QRect(x, y + sizeh - height, sizew, height),
-		_narrowShadow);
+	const auto &icon = st::groupCallNarrowColoredCrossLine.icon;
+	x += st::groupCallNarrowIconPosition.x();
+	y += st::groupCallNarrowIconPosition.y();
+	const auto rect = QRect(x, y, icon.width(), icon.height());
+	rowPaintIcon(p, rect, state);
+	x += icon.width();
+	auto result = st::groupCallNarrowIconSkip;
+	if (_cameraActive.contains(row->peer())) {
+		st::groupCallNarrowCameraIcon.paint(p, x, y, outerWidth);
+		x += st::groupCallNarrowCameraIcon.width();
+		result += st::groupCallNarrowCameraIcon.width();
+	}
+	if (_screenActive.contains(row->peer())) {
+		st::groupCallNarrowScreenIcon.paint(p, x, y, outerWidth);
+		x += st::groupCallNarrowScreenIcon.width();
+		result += st::groupCallNarrowScreenIcon.width();
+	}
+	return result;
 }
 
-int Members::Controller::customRowHeight() {
-	return st::groupCallNarrowSize.height() + st::groupCallNarrowRowSkip * 2;
-}
-
-void Members::Controller::customRowPaint(
-		Painter &p,
-		crl::time now,
-		not_null<PeerListRow*> row,
-		bool selected) {
-	const auto real = static_cast<Row*>(row.get());
-	const auto width = st::groupCallNarrowSize.width();
-	const auto height = st::groupCallNarrowSize.height();
-	real->paintComplexUserpic(
-		p,
-		st::groupCallNarrowSkip,
-		st::groupCallNarrowRowSkip,
-		width,
-		width,
-		height,
-		PanelMode::Wide,
-		selected);
-}
-
-bool Members::Controller::customRowSelectionPoint(
-		not_null<PeerListRow*> row,
-		int x,
-		int y) {
-	return x >= st::groupCallNarrowSkip
-		&& x < st::groupCallNarrowSkip + st::groupCallNarrowSize.width()
-		&& y >= st::groupCallNarrowRowSkip
-		&& y < st::groupCallNarrowRowSkip + st::groupCallNarrowSize.height();
-}
-
-Fn<QImage()> Members::Controller::customRowRippleMaskGenerator() {
-	return [] {
-		return Ui::RippleAnimation::roundRectMask(
-			st::groupCallNarrowSize,
-			st::roundRadiusLarge);
-	};
-}
+//void Members::Controller::rowPaintNarrowBackground(
+//		Painter &p,
+//		int x,
+//		int y,
+//		bool selected) {
+//	(selected ? _narrowRoundRectSelected : _narrowRoundRect).paint(
+//		p,
+//		{ QPoint(x, y), st::groupCallNarrowSize });
+//}
+//
+//void Members::Controller::rowPaintNarrowBorder(
+//		Painter &p,
+//		int x,
+//		int y,
+//		not_null<Row*> row) {
+//	if (_call->videoEndpointLarge().peer != row->peer().get()) {
+//		return;
+//	}
+//	auto hq = PainterHighQualityEnabler(p);
+//	p.setBrush(Qt::NoBrush);
+//	auto pen = st::groupCallMemberActiveIcon->p;
+//	pen.setWidthF(st::groupCallNarrowOutline);
+//	p.setPen(pen);
+//	p.drawRoundedRect(
+//		QRect{ QPoint(x, y), st::groupCallNarrowSize },
+//		st::roundRadiusLarge,
+//		st::roundRadiusLarge);
+//}
+//
+//void Members::Controller::rowPaintNarrowShadow(
+//		Painter &p,
+//		int x,
+//		int y,
+//		int sizew,
+//		int sizeh) {
+//	if (_narrowShadow.isNull()) {
+//		_narrowShadow = GenerateShadow(
+//			st::groupCallNarrowShadowHeight,
+//			0,
+//			kShadowMaxAlpha);
+//	}
+//	const auto height = st::groupCallNarrowShadowHeight;
+//	p.drawImage(
+//		QRect(x, y + sizeh - height, sizew, height),
+//		_narrowShadow);
+//}
+//
+//int Members::Controller::customRowHeight() {
+//	return st::groupCallNarrowSize.height() + st::groupCallNarrowRowSkip * 2;
+//}
+//
+//void Members::Controller::customRowPaint(
+//		Painter &p,
+//		crl::time now,
+//		not_null<PeerListRow*> row,
+//		bool selected) {
+//	const auto real = static_cast<Row*>(row.get());
+//	const auto width = st::groupCallNarrowSize.width();
+//	const auto height = st::groupCallNarrowSize.height();
+//	real->paintComplexUserpic(
+//		p,
+//		st::groupCallNarrowSkip,
+//		st::groupCallNarrowRowSkip,
+//		width,
+//		width,
+//		height,
+//		PanelMode::Wide,
+//		selected);
+//}
+//
+//bool Members::Controller::customRowSelectionPoint(
+//		not_null<PeerListRow*> row,
+//		int x,
+//		int y) {
+//	return x >= st::groupCallNarrowSkip
+//		&& x < st::groupCallNarrowSkip + st::groupCallNarrowSize.width()
+//		&& y >= st::groupCallNarrowRowSkip
+//		&& y < st::groupCallNarrowRowSkip + st::groupCallNarrowSize.height();
+//}
+//
+//Fn<QImage()> Members::Controller::customRowRippleMaskGenerator() {
+//	return [] {
+//		return Ui::RippleAnimation::roundRectMask(
+//			st::groupCallNarrowSize,
+//			st::roundRadiusLarge);
+//	};
+//}
 
 auto Members::Controller::kickParticipantRequests() const
 -> rpl::producer<not_null<PeerData*>>{
@@ -1507,9 +1649,9 @@ int Members::desiredHeight() const {
 		return 0;
 	}();
 	const auto use = std::max(count, _list->fullRowsCount());
-	const auto single = (_mode.current() == PanelMode::Wide)
+	const auto single = /*(_mode.current() == PanelMode::Wide)
 		? (st::groupCallNarrowSize.height() + st::groupCallNarrowRowSkip * 2)
-		: st::groupCallMembersList.item.height;
+		: */st::groupCallMembersList.item.height;
 	return top
 		+ (use * single)
 		+ (use ? st::lineWidth : 0);
@@ -1563,9 +1705,9 @@ void Members::setupAddMember(not_null<GroupCall*> call) {
 		}
 		auto addMember = (Ui::AbstractButton*)nullptr;
 		auto wrap = [&]() -> object_ptr<Ui::RpWidget> {
-			if (mode == PanelMode::Default) {
+			//if (mode == PanelMode::Default) {
 				auto result = Settings::CreateButton(
-					this,
+					_layout.get(),
 					tr::lng_group_call_invite(),
 					st::groupCallAddMember,
 					&st::groupCallAddMemberIcon,
@@ -1573,34 +1715,36 @@ void Members::setupAddMember(not_null<GroupCall*> call) {
 					&st::groupCallMemberInactiveIcon);
 				addMember = result.data();
 				return result;
-			}
-			auto result = object_ptr<Ui::RpWidget>(_layout.get());
-			const auto skip = st::groupCallNarrowSkip;
-			const auto fullwidth = st::groupCallNarrowSize.width()
-				+ 2 * skip;
-			const auto fullheight = st::groupCallNarrowAddMember.height
-				+ st::groupCallNarrowRowSkip;
-			result->resize(fullwidth, fullheight);
-			const auto button = Ui::CreateChild<Ui::RoundButton>(
-				result.data(),
-				rpl::single(QString()),
-				st::groupCallNarrowAddMember);
-			button->move(skip, 0);
-			const auto width = fullwidth - 2 * skip;
-			button->setFullWidth(width);
-			Settings::AddButtonIcon(
-				button,
-				&st::groupCallAddMemberIcon,
-				(width - st::groupCallAddMemberIcon.width()) / 2,
-				&st::groupCallMemberInactiveIcon);
-			addMember = button;
-			return result;
+			//}
+			//auto result = object_ptr<Ui::RpWidget>(_layout.get());
+			//const auto skip = st::groupCallNarrowSkip;
+			//const auto fullwidth = st::groupCallNarrowSize.width()
+			//	+ 2 * skip;
+			//const auto fullheight = st::groupCallNarrowAddMember.height
+			//	+ st::groupCallNarrowRowSkip;
+			//result->resize(fullwidth, fullheight);
+			//const auto button = Ui::CreateChild<Ui::RoundButton>(
+			//	result.data(),
+			//	rpl::single(QString()),
+			//	st::groupCallNarrowAddMember);
+			//button->move(skip, 0);
+			//const auto width = fullwidth - 2 * skip;
+			//button->setFullWidth(width);
+			//Settings::AddButtonIcon(
+			//	button,
+			//	&st::groupCallAddMemberIcon,
+			//	(width - st::groupCallAddMemberIcon.width()) / 2,
+			//	&st::groupCallMemberInactiveIcon);
+			//addMember = button;
+			//return result;
 		}();
 		addMember->show();
 		addMember->clicks(
 		) | rpl::to_empty | rpl::start_to_stream(
 			_addMemberRequests,
 			addMember->lifetime());
+		wrap->show();
+		wrap->resizeToWidth(_layout->width());
 		_addMemberButton = wrap.data();
 		_layout->insert(1, std::move(wrap));
 	}, lifetime());
@@ -1622,9 +1766,10 @@ void Members::setMode(PanelMode mode) {
 	for (const auto &tile : _videoTiles) {
 		tile.video->setVisible(mode == PanelMode::Default);
 	}
-	_list->setMode((mode == PanelMode::Wide)
-		? PeerListContent::Mode::Custom
-		: PeerListContent::Mode::Default);
+	_listController->setMode(mode);
+	//_list->setMode((mode == PanelMode::Wide)
+	//	? PeerListContent::Mode::Custom
+	//	: PeerListContent::Mode::Default);
 }
 
 rpl::producer<int> Members::fullCountValue() const {
@@ -1763,15 +1908,26 @@ void Members::setupPinnedVideo() {
 	}
 	_call->videoStreamActiveUpdates(
 	) | rpl::start_with_next([=](const VideoEndpoint &endpoint) {
-		const auto &tracks = _call->activeVideoTracks();
-		const auto i = tracks.find(endpoint);
-		if (i != end(tracks)) {
-			_videoTiles.push_back(setupTile(endpoint, i->second));
+		if (_call->activeVideoTracks().contains(endpoint)) {
+			// Add async (=> the participant row is definitely in Members).
+			crl::on_main(_pinnedVideoWrap, [=] {
+				const auto &tracks = _call->activeVideoTracks();
+				const auto i = tracks.find(endpoint);
+				if (i != end(tracks)) {
+					_videoTiles.push_back(setupTile(endpoint, i->second));
+				}
+			});
 		} else {
-			_videoTiles.erase(
-				ranges::remove(_videoTiles, endpoint, &VideoTile::endpoint),
-				end(_videoTiles));
-			refreshTilesGeometry();
+			// Remove sync.
+			const auto eraseTill = end(_videoTiles);
+			const auto eraseFrom = ranges::remove(
+				_videoTiles,
+				endpoint,
+				&VideoTile::endpoint);
+			if (eraseFrom != eraseTill) {
+				_videoTiles.erase(eraseFrom, eraseTill);
+				refreshTilesGeometry();
+			}
 		}
 	}, _pinnedVideoWrap->lifetime());
 

Telegram/SourceFiles/calls/group/calls_group_members_row.cpp

@@ -412,15 +412,15 @@ bool MembersRow::paintVideo(
 	//return true;
 }
 
-std::tuple<int, int, int> MembersRow::UserpicInNarrowMode(
-		int x,
-		int y,
-		int sizew,
-		int sizeh) {
-	const auto useSize = st::groupCallMembersList.item.photoSize;
-	const auto skipx = (sizew - useSize) / 2;
-	return { x + skipx, y + st::groupCallNarrowUserpicTop, useSize };
-}
+//std::tuple<int, int, int> MembersRow::UserpicInNarrowMode(
+//		int x,
+//		int y,
+//		int sizew,
+//		int sizeh) {
+//	const auto useSize = st::groupCallMembersList.item.photoSize;
+//	const auto skipx = (sizew - useSize) / 2;
+//	return { x + skipx, y + st::groupCallNarrowUserpicTop, useSize };
+//}
 
 void MembersRow::paintBlobs(
 		Painter &p,
@@ -433,9 +433,9 @@ void MembersRow::paintBlobs(
 		return;
 	}
 	auto size = sizew;
-	if (mode == PanelMode::Wide) {
-		std::tie(x, y, size) = UserpicInNarrowMode(x, y, sizew, sizeh);
-	}
+	//if (mode == PanelMode::Wide) {
+	//	std::tie(x, y, size) = UserpicInNarrowMode(x, y, sizew, sizeh);
+	//}
 	const auto mutedByMe = (_state == State::MutedByMe);
 	const auto shift = QPointF(x + size / 2., y + size / 2.);
 	auto hq = PainterHighQualityEnabler(p);
@@ -461,9 +461,9 @@ void MembersRow::paintScaledUserpic(
 		int sizeh,
 		PanelMode mode) {
 	auto size = sizew;
-	if (mode == PanelMode::Wide) {
-		std::tie(x, y, size) = UserpicInNarrowMode(x, y, sizew, sizeh);
-	}
+	//if (mode == PanelMode::Wide) {
+	//	std::tie(x, y, size) = UserpicInNarrowMode(x, y, sizew, sizeh);
+	//}
 	if (!_blobsAnimation) {
 		peer()->paintUserpicLeft(p, userpic, x, y, outerWidth, size);
 		return;
@@ -503,72 +503,72 @@ void MembersRow::paintMuteIcon(
 	_delegate->rowPaintIcon(p, iconRect, computeIconState(style));
 }
 
-void MembersRow::paintNarrowName(
-		Painter &p,
-		int x,
-		int y,
-		int sizew,
-		int sizeh,
-		MembersRowStyle style) {
-	if (_narrowName.isEmpty()) {
-		_narrowName.setText(
-			st::semiboldTextStyle,
-			generateShortName(),
-			Ui::NameTextOptions());
-	}
-	if (style == MembersRowStyle::Video) {
-		_delegate->rowPaintNarrowShadow(p, x, y, sizew, sizeh);
-	}
-	const auto &icon = st::groupCallVideoCrossLine.icon;
-	const auto added = icon.width() - st::groupCallNarrowIconLess;
-	const auto available = sizew - 2 * st::normalFont->spacew - added;
-	const auto use = std::min(available, _narrowName.maxWidth());
-	const auto left = x + (sizew - use - added) / 2;
-	const auto iconRect = QRect(
-		left - st::groupCallNarrowIconLess,
-		y + st::groupCallNarrowIconTop,
-		icon.width(),
-		icon.height());
-	const auto &state = computeIconState(style);
-	_delegate->rowPaintIcon(p, iconRect, state);
-
-	p.setPen([&] {
-		if (style == MembersRowStyle::Video) {
-			return st::groupCallVideoTextFg->p;
-		} else if (state.speaking == 1. && !state.mutedByMe) {
-			return st::groupCallMemberActiveIcon->p;
-		} else if (state.speaking == 0.) {
-			if (state.active == 1.) {
-				return st::groupCallMemberInactiveIcon->p;
-			} else if (state.active == 0.) {
-				if (state.muted == 1.) {
-					return state.raisedHand
-						? st::groupCallMemberInactiveStatus->p
-						: st::groupCallMemberMutedIcon->p;
-				} else if (state.muted == 0.) {
-					return st::groupCallMemberInactiveIcon->p;
-				}
-			}
-		}
-		const auto activeInactiveColor = anim::color(
-			st::groupCallMemberInactiveIcon,
-			(state.mutedByMe
-				? st::groupCallMemberMutedIcon
-				: st::groupCallMemberActiveIcon),
-			state.speaking);
-		return anim::pen(
-			activeInactiveColor,
-			st::groupCallMemberMutedIcon,
-			state.muted);
-	}());
-	const auto nameLeft = iconRect.x() + icon.width();
-	const auto nameTop = y + st::groupCallNarrowNameTop;
-	if (use == available) {
-		_narrowName.drawLeftElided(p, nameLeft, nameTop, available, sizew);
-	} else {
-		_narrowName.drawLeft(p, nameLeft, nameTop, available, sizew);
-	}
-}
+//void MembersRow::paintNarrowName(
+//		Painter &p,
+//		int x,
+//		int y,
+//		int sizew,
+//		int sizeh,
+//		MembersRowStyle style) {
+//	if (_narrowName.isEmpty()) {
+//		_narrowName.setText(
+//			st::semiboldTextStyle,
+//			generateShortName(),
+//			Ui::NameTextOptions());
+//	}
+//	if (style == MembersRowStyle::Video) {
+//		_delegate->rowPaintNarrowShadow(p, x, y, sizew, sizeh);
+//	}
+//	const auto &icon = st::groupCallVideoCrossLine.icon;
+//	const auto added = icon.width() - st::groupCallNarrowIconLess;
+//	const auto available = sizew - 2 * st::normalFont->spacew - added;
+//	const auto use = std::min(available, _narrowName.maxWidth());
+//	const auto left = x + (sizew - use - added) / 2;
+//	const auto iconRect = QRect(
+//		left - st::groupCallNarrowIconLess,
+//		y + st::groupCallNarrowIconTop,
+//		icon.width(),
+//		icon.height());
+//	const auto &state = computeIconState(style);
+//	_delegate->rowPaintIcon(p, iconRect, state);
+//
+//	p.setPen([&] {
+//		if (style == MembersRowStyle::Video) {
+//			return st::groupCallVideoTextFg->p;
+//		} else if (state.speaking == 1. && !state.mutedByMe) {
+//			return st::groupCallMemberActiveIcon->p;
+//		} else if (state.speaking == 0.) {
+//			if (state.active == 1.) {
+//				return st::groupCallMemberInactiveIcon->p;
+//			} else if (state.active == 0.) {
+//				if (state.muted == 1.) {
+//					return state.raisedHand
+//						? st::groupCallMemberInactiveStatus->p
+//						: st::groupCallMemberMutedIcon->p;
+//				} else if (state.muted == 0.) {
+//					return st::groupCallMemberInactiveIcon->p;
+//				}
+//			}
+//		}
+//		const auto activeInactiveColor = anim::color(
+//			st::groupCallMemberInactiveIcon,
+//			(state.mutedByMe
+//				? st::groupCallMemberMutedIcon
+//				: st::groupCallMemberActiveIcon),
+//			state.speaking);
+//		return anim::pen(
+//			activeInactiveColor,
+//			st::groupCallMemberMutedIcon,
+//			state.muted);
+//	}());
+//	const auto nameLeft = iconRect.x() + icon.width();
+//	const auto nameTop = y + st::groupCallNarrowNameTop;
+//	if (use == available) {
+//		_narrowName.drawLeftElided(p, nameLeft, nameTop, available, sizew);
+//	} else {
+//		_narrowName.drawLeft(p, nameLeft, nameTop, available, sizew);
+//	}
+//}
 
 auto MembersRow::generatePaintUserpicCallback() -> PaintRoundImageCallback {
 	return [=](Painter &p, int x, int y, int outerWidth, int size) {
@@ -586,20 +586,20 @@ void MembersRow::paintComplexUserpic(
 		int sizeh,
 		PanelMode mode,
 		bool selected) {
-	if (mode == PanelMode::Wide) {
-		if (paintVideo(p, x, y, sizew, sizeh, mode)) {
-			paintNarrowName(p, x, y, sizew, sizeh, MembersRowStyle::Video);
-			_delegate->rowPaintNarrowBorder(p, x, y, this);
-			return;
-		}
-		_delegate->rowPaintNarrowBackground(p, x, y, selected);
-		paintRipple(p, x, y, outerWidth);
-	}
+	//if (mode == PanelMode::Wide) {
+	//	if (paintVideo(p, x, y, sizew, sizeh, mode)) {
+	//		paintNarrowName(p, x, y, sizew, sizeh, MembersRowStyle::Video);
+	//		_delegate->rowPaintNarrowBorder(p, x, y, this);
+	//		return;
+	//	}
+	//	_delegate->rowPaintNarrowBackground(p, x, y, selected);
+	//	paintRipple(p, x, y, outerWidth);
+	//}
 	paintBlobs(p, x, y, sizew, sizeh, mode);
-	if (mode == PanelMode::Default
-		&& paintVideo(p, x, y, sizew, sizeh, mode)) {
-		return;
-	}
+	//if (mode == PanelMode::Default
+	//	&& paintVideo(p, x, y, sizew, sizeh, mode)) {
+	//	return;
+	//}
 	paintScaledUserpic(
 		p,
 		ensureUserpicView(),
@@ -609,20 +609,22 @@ void MembersRow::paintComplexUserpic(
 		sizew,
 		sizeh,
 		mode);
-	if (mode == PanelMode::Wide) {
-		paintNarrowName(p, x, y, sizew, sizeh, MembersRowStyle::Userpic);
-		_delegate->rowPaintNarrowBorder(p, x, y, this);
-	}
+	//if (mode == PanelMode::Wide) {
+	//	paintNarrowName(p, x, y, sizew, sizeh, MembersRowStyle::Userpic);
+	//	_delegate->rowPaintNarrowBorder(p, x, y, this);
+	//}
 }
 
-int MembersRow::statusIconWidth() const {
+int MembersRow::statusIconWidth(bool skipIcon) const {
 	if (!_statusIcon || !_speaking) {
 		return 0;
 	}
 	const auto shown = _statusIcon->shownAnimation.value(
 		_statusIcon->shown ? 1. : 0.);
-	const auto full = _statusIcon->speaker.width()
-		+ _statusIcon->arcsWidth
+	const auto iconWidth = skipIcon
+		? 0
+		: (_statusIcon->speaker.width() + _statusIcon->arcsWidth);
+	const auto full = iconWidth
 		+ _statusIcon->percentWidth
 		+ st::normalFont->spacew;
 	return int(std::round(shown * full));
@@ -638,7 +640,8 @@ void MembersRow::paintStatusIcon(
 		int y,
 		const style::PeerListItem &st,
 		const style::font &font,
-		bool selected) {
+		bool selected,
+		bool skipIcon) {
 	if (!_statusIcon) {
 		return;
 	}
@@ -661,8 +664,10 @@ void MembersRow::paintStatusIcon(
 		+ QPoint(
 			speakerRect.width() - st::groupCallStatusSpeakerArcsSkip,
 			speakerRect.height() / 2);
-	const auto fullWidth = speakerRect.width()
-		+ _statusIcon->arcsWidth
+	const auto iconWidth = skipIcon
+		? 0
+		: (speakerRect.width() + _statusIcon->arcsWidth);
+	const auto fullWidth = iconWidth
 		+ _statusIcon->percentWidth
 		+ st::normalFont->spacew;
 
@@ -674,18 +679,20 @@ void MembersRow::paintStatusIcon(
 		p.scale(shown, shown);
 		p.translate(-centerx, -centery);
 	}
-	_statusIcon->speaker.paint(
-		p,
-		speakerRect.topLeft(),
-		speakerRect.width(),
-		color);
-	p.translate(arcPosition);
-	_statusIcon->arcs.paint(p, color);
-	p.translate(-arcPosition);
+	if (!skipIcon) {
+		_statusIcon->speaker.paint(
+			p,
+			speakerRect.topLeft(),
+			speakerRect.width(),
+			color);
+		p.translate(arcPosition);
+		_statusIcon->arcs.paint(p, color);
+		p.translate(-arcPosition);
+	}
 	p.setFont(st::normalFont);
 	p.setPen(st.statusFgActive);
 	p.drawTextLeft(
-		x + speakerRect.width() + _statusIcon->arcsWidth,
+		x + iconWidth,
 		y,
 		fullWidth,
 		_statusIcon->percent);
@@ -728,20 +735,31 @@ void MembersRow::paintComplexStatusText(
 		int outerWidth,
 		bool selected,
 		MembersRowStyle style) {
+	const auto skip = (style == MembersRowStyle::None)
+		? _delegate->rowPaintStatusIcon(
+			p,
+			x,
+			y,
+			outerWidth,
+			this,
+			computeIconState(MembersRowStyle::Narrow))
+		: 0;
+	const auto narrowMode = (skip > 0);
+	x += skip;
+	availableWidth -= skip;
 	const auto &font = st::normalFont;
 	const auto about = (style == MembersRowStyle::LargeVideo)
 		? QString()
-		: (_state == State::Inactive
-		|| _state == State::Muted
-		|| (_state == State::RaisedHand && !_raisedHandStatus))
+		: ((_state == State::RaisedHand && !_raisedHandStatus)
+			|| (_state != State::Active && _state != State::RaisedHand))
 		? _aboutText
 		: QString();
 	if (about.isEmpty()
 		&& _state != State::Invited
 		&& _state != State::MutedByMe) {
-		paintStatusIcon(p, x, y, st, font, selected);
+		paintStatusIcon(p, x, y, st, font, selected, narrowMode);
 
-		const auto translatedWidth = statusIconWidth();
+		const auto translatedWidth = statusIconWidth(narrowMode);
 		p.translate(translatedWidth, 0);
 		const auto guard = gsl::finally([&] {
 			p.translate(-translatedWidth, 0);
@@ -762,6 +780,8 @@ void MembersRow::paintComplexStatusText(
 		p.setPen(st::groupCallVideoSubTextFg);
 	} else if (_state == State::MutedByMe) {
 		p.setPen(st::groupCallMemberMutedIcon);
+	} else if (narrowMode && !about.isEmpty()) {
+		p.setPen(st::groupCallMembersFg);
 	} else {
 		p.setPen(st::groupCallMemberNotJoinedStatus);
 	}
@@ -814,11 +834,6 @@ void MembersRow::paintAction(
 		outerWidth);
 	if (_state == State::Invited) {
 		_actionRipple = nullptr;
-		st::groupCallMemberInvited.paint(
-			p,
-			QPoint(x, y) + st::groupCallMemberInvitedPosition,
-			outerWidth);
-		return;
 	}
 	if (_actionRipple) {
 		_actionRipple->paint(
@@ -847,6 +862,7 @@ MembersRowDelegate::IconState MembersRow::computeIconState(
 		.muted = muted,
 		.mutedByMe = (_state == State::MutedByMe),
 		.raisedHand = (_state == State::RaisedHand),
+		.invited = (_state == State::Invited),
 		.style = style,
 	};
 }
@@ -911,7 +927,7 @@ void MembersRow::addActionRipple(QPoint point, Fn<void()> updateCallback) {
 
 void MembersRow::refreshName(const style::PeerListItem &st) {
 	PeerListRow::refreshName(st);
-	_narrowName = Ui::Text::String();
+	//_narrowName = Ui::Text::String();
 }
 
 void MembersRow::stopLastActionRipple() {

Telegram/SourceFiles/calls/group/calls_group_members_row.h

@@ -29,8 +29,9 @@ namespace Calls::Group {
 
 enum class MembersRowStyle {
 	None,
-	Userpic,
-	Video,
+	//Userpic,
+	//Video,
+	Narrow,
 	LargeVideo,
 };
 
@@ -43,6 +44,7 @@ public:
 		float64 muted = 0.;
 		bool mutedByMe = false;
 		bool raisedHand = false;
+		bool invited = false;
 		MembersRowStyle style = MembersRowStyle::None;
 	};
 	virtual bool rowIsMe(not_null<PeerData*> participantPeer) = 0;
@@ -53,22 +55,29 @@ public:
 		Painter &p,
 		QRect rect,
 		const IconState &state) = 0;
-	virtual void rowPaintNarrowBackground(
+	virtual int rowPaintStatusIcon(
 		Painter &p,
 		int x,
 		int y,
-		bool selected) = 0;
-	virtual void rowPaintNarrowBorder(
-		Painter &p,
-		int x,
-		int y,
-		not_null<MembersRow*> row) = 0;
-	virtual void rowPaintNarrowShadow(
-		Painter &p,
-		int x,
-		int y,
-		int sizew,
-		int sizeh) = 0;
+		int outerWidth,
+		not_null<MembersRow*> row,
+		const IconState &state) = 0;
+	//virtual void rowPaintNarrowBackground(
+	//	Painter &p,
+	//	int x,
+	//	int y,
+	//	bool selected) = 0;
+	//virtual void rowPaintNarrowBorder(
+	//	Painter &p,
+	//	int x,
+	//	int y,
+	//	not_null<MembersRow*> row) = 0;
+	//virtual void rowPaintNarrowShadow(
+	//	Painter &p,
+	//	int x,
+	//	int y,
+	//	int sizew,
+	//	int sizeh) = 0;
 };
 
 class MembersRow final : public PeerListRow {
@@ -174,7 +183,7 @@ private:
 	struct BlobsAnimation;
 	struct StatusIcon;
 
-	int statusIconWidth() const;
+	int statusIconWidth(bool skipIcon) const;
 	int statusIconHeight() const;
 	void paintStatusIcon(
 		Painter &p,
@@ -182,7 +191,8 @@ private:
 		int y,
 		const style::PeerListItem &st,
 		const style::font &font,
-		bool selected);
+		bool selected,
+		bool skipIcon);
 
 	void refreshStatus() override;
 	void setSounding(bool sounding);
@@ -201,11 +211,11 @@ private:
 		int sizew,
 		int sizeh,
 		PanelMode mode);
-	[[nodiscard]] static std::tuple<int, int, int> UserpicInNarrowMode(
-		int x,
-		int y,
-		int sizew,
-		int sizeh);
+	//[[nodiscard]] static std::tuple<int, int, int> UserpicInNarrowMode(
+	//	int x,
+	//	int y,
+	//	int sizew,
+	//	int sizeh);
 	void paintBlobs(
 		Painter &p,
 		int x,

Telegram/SourceFiles/calls/group/calls_group_panel.cpp

@@ -1923,7 +1923,7 @@ void Panel::updateButtonsGeometry() {
 			+ (_settings ? _settings : _callShare)->width() + skip
 			+ _hangup->width() + skip;
 		const auto membersSkip = st::groupCallNarrowSkip;
-		const auto membersWidth = st::groupCallNarrowSize.width()
+		const auto membersWidth = st::groupCallNarrowMembersWidth
 			+ 2 * membersSkip;
 		auto left = (_mode == PanelMode::Default)
 			? (widget()->width() - fullWidth) / 2
@@ -1998,17 +1998,17 @@ void Panel::updateMembersGeometry() {
 	const auto desiredHeight = _members->desiredHeight();
 	if (_mode == PanelMode::Wide) {
 		const auto skip = st::groupCallNarrowSkip;
-		const auto membersWidth = st::groupCallNarrowSize.width() + 2 * skip;
+		const auto membersWidth = st::groupCallNarrowMembersWidth;
 		const auto top = st::groupCallWideVideoTop;
 		_members->setGeometry(
-			0,
+			skip,
 			top,
 			membersWidth,
 			std::min(desiredHeight, widget()->height()));
 		_pinnedVideoWrap->setGeometry(
-			membersWidth,
+			membersWidth + 2 * skip,
 			top,
-			widget()->width() - membersWidth - skip,
+			widget()->width() - membersWidth - 3 * skip,
 			widget()->height() - top - skip);
 	} else {
 		const auto membersBottom = _videoMode.current()