Restore the colored background for collaborators that you're following
This commit is contained in:
parent
2443ee6faf
commit
4b92a15ab3
3 changed files with 84 additions and 65 deletions
|
@ -17,9 +17,8 @@ use gpui::{
|
||||||
actions, canvas, div, fill, list, overlay, point, prelude::*, px, AnyElement, AppContext,
|
actions, canvas, div, fill, list, overlay, point, prelude::*, px, AnyElement, AppContext,
|
||||||
AsyncWindowContext, Bounds, ClipboardItem, DismissEvent, Div, EventEmitter, FocusHandle,
|
AsyncWindowContext, Bounds, ClipboardItem, DismissEvent, Div, EventEmitter, FocusHandle,
|
||||||
FocusableView, FontStyle, FontWeight, InteractiveElement, IntoElement, ListOffset, ListState,
|
FocusableView, FontStyle, FontWeight, InteractiveElement, IntoElement, ListOffset, ListState,
|
||||||
Model, MouseDownEvent, ParentElement, Pixels, Point, PromptLevel, Render, RenderOnce,
|
Model, MouseDownEvent, ParentElement, Pixels, Point, PromptLevel, Render, SharedString, Styled,
|
||||||
SharedString, Styled, Subscription, Task, TextStyle, View, ViewContext, VisualContext,
|
Subscription, Task, TextStyle, View, ViewContext, VisualContext, WeakView, WhiteSpace,
|
||||||
WeakView, WhiteSpace,
|
|
||||||
};
|
};
|
||||||
use menu::{Cancel, Confirm, SelectNext, SelectPrev};
|
use menu::{Cancel, Confirm, SelectNext, SelectPrev};
|
||||||
use project::{Fs, Project};
|
use project::{Fs, Project};
|
||||||
|
@ -2296,7 +2295,7 @@ impl CollabPanel {
|
||||||
h_flex()
|
h_flex()
|
||||||
.id(channel_id as usize)
|
.id(channel_id as usize)
|
||||||
.child(Label::new(channel.name.clone()))
|
.child(Label::new(channel.name.clone()))
|
||||||
.children(face_pile.map(|face_pile| face_pile.render(cx))),
|
.children(face_pile.map(|face_pile| face_pile.render().p_1())),
|
||||||
),
|
),
|
||||||
)
|
)
|
||||||
.child(
|
.child(
|
||||||
|
|
|
@ -57,6 +57,7 @@ impl Render for CollabTitlebarItem {
|
||||||
let current_user = self.user_store.read(cx).current_user();
|
let current_user = self.user_store.read(cx).current_user();
|
||||||
let client = self.client.clone();
|
let client = self.client.clone();
|
||||||
let project_id = self.project.read(cx).remote_id();
|
let project_id = self.project.read(cx).remote_id();
|
||||||
|
let workspace = self.workspace.upgrade();
|
||||||
|
|
||||||
h_flex()
|
h_flex()
|
||||||
.id("titlebar")
|
.id("titlebar")
|
||||||
|
@ -100,6 +101,7 @@ impl Render for CollabTitlebarItem {
|
||||||
true,
|
true,
|
||||||
room.is_speaking(),
|
room.is_speaking(),
|
||||||
room.is_muted(),
|
room.is_muted(),
|
||||||
|
None,
|
||||||
&room,
|
&room,
|
||||||
project_id,
|
project_id,
|
||||||
¤t_user,
|
¤t_user,
|
||||||
|
@ -113,6 +115,12 @@ impl Render for CollabTitlebarItem {
|
||||||
}))
|
}))
|
||||||
.children(
|
.children(
|
||||||
remote_participants.iter().filter_map(|collaborator| {
|
remote_participants.iter().filter_map(|collaborator| {
|
||||||
|
let player_color = player_colors
|
||||||
|
.color_for_participant(collaborator.participant_index.0);
|
||||||
|
let is_following = workspace
|
||||||
|
.as_ref()?
|
||||||
|
.read(cx)
|
||||||
|
.is_being_followed(collaborator.peer_id);
|
||||||
let is_present = project_id.map_or(false, |project_id| {
|
let is_present = project_id.map_or(false, |project_id| {
|
||||||
collaborator.location
|
collaborator.location
|
||||||
== ParticipantLocation::SharedProject { project_id }
|
== ParticipantLocation::SharedProject { project_id }
|
||||||
|
@ -124,6 +132,7 @@ impl Render for CollabTitlebarItem {
|
||||||
is_present,
|
is_present,
|
||||||
collaborator.speaking,
|
collaborator.speaking,
|
||||||
collaborator.muted,
|
collaborator.muted,
|
||||||
|
is_following.then_some(player_color.selection),
|
||||||
&room,
|
&room,
|
||||||
project_id,
|
project_id,
|
||||||
¤t_user,
|
¤t_user,
|
||||||
|
@ -134,13 +143,7 @@ impl Render for CollabTitlebarItem {
|
||||||
v_flex()
|
v_flex()
|
||||||
.id(("collaborator", collaborator.user.id))
|
.id(("collaborator", collaborator.user.id))
|
||||||
.child(face_pile)
|
.child(face_pile)
|
||||||
.child(render_color_ribbon(
|
.child(render_color_ribbon(player_color.cursor))
|
||||||
player_colors
|
|
||||||
.color_for_participant(
|
|
||||||
collaborator.participant_index.0,
|
|
||||||
)
|
|
||||||
.cursor,
|
|
||||||
))
|
|
||||||
.cursor_pointer()
|
.cursor_pointer()
|
||||||
.on_click({
|
.on_click({
|
||||||
let peer_id = collaborator.peer_id;
|
let peer_id = collaborator.peer_id;
|
||||||
|
@ -468,11 +471,12 @@ impl CollabTitlebarItem {
|
||||||
is_present: bool,
|
is_present: bool,
|
||||||
is_speaking: bool,
|
is_speaking: bool,
|
||||||
is_muted: bool,
|
is_muted: bool,
|
||||||
|
leader_selection_color: Option<Hsla>,
|
||||||
room: &Room,
|
room: &Room,
|
||||||
project_id: Option<u64>,
|
project_id: Option<u64>,
|
||||||
current_user: &Arc<User>,
|
current_user: &Arc<User>,
|
||||||
cx: &ViewContext<Self>,
|
cx: &ViewContext<Self>,
|
||||||
) -> Option<FacePile> {
|
) -> Option<Div> {
|
||||||
if room.role_for_user(user.id) == Some(proto::ChannelRole::Guest) {
|
if room.role_for_user(user.id) == Some(proto::ChannelRole::Guest) {
|
||||||
return None;
|
return None;
|
||||||
}
|
}
|
||||||
|
@ -481,56 +485,72 @@ impl CollabTitlebarItem {
|
||||||
let followers = project_id.map_or(&[] as &[_], |id| room.followers_for(peer_id, id));
|
let followers = project_id.map_or(&[] as &[_], |id| room.followers_for(peer_id, id));
|
||||||
let extra_count = followers.len().saturating_sub(FACEPILE_LIMIT);
|
let extra_count = followers.len().saturating_sub(FACEPILE_LIMIT);
|
||||||
|
|
||||||
let pile = FacePile::default()
|
Some(
|
||||||
.child(
|
div()
|
||||||
Avatar::new(user.avatar_uri.clone())
|
.m_0p5()
|
||||||
.grayscale(!is_present)
|
.p_0p5()
|
||||||
.border_color(if is_speaking {
|
// When the collaborator is not followed, still draw this wrapper div, but leave
|
||||||
cx.theme().status().info
|
// it transparent, so that it does not shift the layout when following.
|
||||||
} else {
|
.when_some(leader_selection_color, |div, color| {
|
||||||
// We draw the border in a transparent color rather to avoid
|
div.rounded_md().bg(color)
|
||||||
// the layout shift that would come with adding/removing the border.
|
})
|
||||||
gpui::transparent_black()
|
.child(
|
||||||
})
|
FacePile::default()
|
||||||
.when(is_muted, |avatar| {
|
.child(
|
||||||
avatar.indicator(
|
Avatar::new(user.avatar_uri.clone())
|
||||||
AvatarAudioStatusIndicator::new(ui::AudioStatus::Muted).tooltip({
|
.grayscale(!is_present)
|
||||||
let github_login = user.github_login.clone();
|
.border_color(if is_speaking {
|
||||||
move |cx| Tooltip::text(format!("{} is muted", github_login), cx)
|
cx.theme().status().info
|
||||||
}),
|
} else {
|
||||||
|
// We draw the border in a transparent color rather to avoid
|
||||||
|
// the layout shift that would come with adding/removing the border.
|
||||||
|
gpui::transparent_black()
|
||||||
|
})
|
||||||
|
.when(is_muted, |avatar| {
|
||||||
|
avatar.indicator(
|
||||||
|
AvatarAudioStatusIndicator::new(ui::AudioStatus::Muted)
|
||||||
|
.tooltip({
|
||||||
|
let github_login = user.github_login.clone();
|
||||||
|
move |cx| {
|
||||||
|
Tooltip::text(
|
||||||
|
format!("{} is muted", github_login),
|
||||||
|
cx,
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
)
|
||||||
|
}),
|
||||||
)
|
)
|
||||||
}),
|
.children(followers.iter().take(FACEPILE_LIMIT).filter_map(
|
||||||
)
|
|follower_peer_id| {
|
||||||
.children(
|
let follower = room
|
||||||
followers
|
.remote_participants()
|
||||||
.iter()
|
.values()
|
||||||
.take(FACEPILE_LIMIT)
|
.find_map(|p| {
|
||||||
.filter_map(|follower_peer_id| {
|
(p.peer_id == *follower_peer_id).then_some(&p.user)
|
||||||
let follower = room
|
})
|
||||||
.remote_participants()
|
.or_else(|| {
|
||||||
.values()
|
(self.client.peer_id() == Some(*follower_peer_id))
|
||||||
.find_map(|p| (p.peer_id == *follower_peer_id).then_some(&p.user))
|
.then_some(current_user)
|
||||||
.or_else(|| {
|
})?
|
||||||
(self.client.peer_id() == Some(*follower_peer_id))
|
.clone();
|
||||||
.then_some(current_user)
|
|
||||||
})?
|
|
||||||
.clone();
|
|
||||||
|
|
||||||
Some(Avatar::new(follower.avatar_uri.clone()))
|
Some(Avatar::new(follower.avatar_uri.clone()))
|
||||||
}),
|
},
|
||||||
)
|
))
|
||||||
.children(if extra_count > 0 {
|
.children(if extra_count > 0 {
|
||||||
Some(
|
Some(
|
||||||
div()
|
div()
|
||||||
.ml_1()
|
.ml_1()
|
||||||
.child(Label::new(format!("+{extra_count}")))
|
.child(Label::new(format!("+{extra_count}")))
|
||||||
.into_any_element(),
|
.into_any_element(),
|
||||||
)
|
)
|
||||||
} else {
|
} else {
|
||||||
None
|
None
|
||||||
});
|
})
|
||||||
|
.render(),
|
||||||
Some(pile)
|
),
|
||||||
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
fn window_activation_changed(&mut self, cx: &mut ViewContext<Self>) {
|
fn window_activation_changed(&mut self, cx: &mut ViewContext<Self>) {
|
||||||
|
|
|
@ -1,13 +1,13 @@
|
||||||
use gpui::{div, AnyElement, IntoElement, ParentElement, RenderOnce, Styled, WindowContext};
|
use gpui::{div, AnyElement, Div, IntoElement, ParentElement, Styled};
|
||||||
use smallvec::SmallVec;
|
use smallvec::SmallVec;
|
||||||
|
|
||||||
#[derive(Default, IntoElement)]
|
#[derive(Default)]
|
||||||
pub struct FacePile {
|
pub struct FacePile {
|
||||||
pub faces: SmallVec<[AnyElement; 2]>,
|
pub faces: SmallVec<[AnyElement; 2]>,
|
||||||
}
|
}
|
||||||
|
|
||||||
impl RenderOnce for FacePile {
|
impl FacePile {
|
||||||
fn render(self, _: &mut WindowContext) -> impl IntoElement {
|
pub fn render(self) -> Div {
|
||||||
let player_count = self.faces.len();
|
let player_count = self.faces.len();
|
||||||
let player_list = self.faces.into_iter().enumerate().map(|(ix, player)| {
|
let player_list = self.faces.into_iter().enumerate().map(|(ix, player)| {
|
||||||
let isnt_last = ix < player_count - 1;
|
let isnt_last = ix < player_count - 1;
|
||||||
|
@ -17,7 +17,7 @@ impl RenderOnce for FacePile {
|
||||||
.when(isnt_last, |div| div.neg_mr_1())
|
.when(isnt_last, |div| div.neg_mr_1())
|
||||||
.child(player)
|
.child(player)
|
||||||
});
|
});
|
||||||
div().p_1().flex().items_center().children(player_list)
|
div().flex().items_center().children(player_list)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue