Skip to content

Commit 1264ea8

Browse files
committed
Tidy up the UI with clearer Layers panel selection marks and removal of most "coming soon" UI elements
1 parent 287ef26 commit 1264ea8

11 files changed

Lines changed: 143 additions & 126 deletions

File tree

editor/src/messages/portfolio/document/document_message_handler.rs

Lines changed: 59 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -1699,25 +1699,25 @@ impl DocumentMessageHandler {
16991699

17001700
let document_mode_layout = WidgetLayout::new(vec![LayoutGroup::Row {
17011701
widgets: vec![
1702-
DropdownInput::new(
1703-
vec![vec![
1704-
MenuListEntry::new(format!("{:?}", DocumentMode::DesignMode))
1705-
.label(DocumentMode::DesignMode.to_string())
1706-
.icon(DocumentMode::DesignMode.icon_name()),
1707-
MenuListEntry::new(format!("{:?}", DocumentMode::SelectMode))
1708-
.label(DocumentMode::SelectMode.to_string())
1709-
.icon(DocumentMode::SelectMode.icon_name())
1710-
.on_commit(|_| DialogMessage::RequestComingSoonDialog { issue: Some(330) }.into()),
1711-
MenuListEntry::new(format!("{:?}", DocumentMode::GuideMode))
1712-
.label(DocumentMode::GuideMode.to_string())
1713-
.icon(DocumentMode::GuideMode.icon_name())
1714-
.on_commit(|_| DialogMessage::RequestComingSoonDialog { issue: Some(331) }.into()),
1715-
]])
1716-
.selected_index(Some(self.document_mode as u32))
1717-
.draw_icon(true)
1718-
.interactive(false) // TODO: set to true when dialogs are not spawned
1719-
.widget_holder(),
1720-
Separator::new(SeparatorType::Section).widget_holder(),
1702+
// DropdownInput::new(
1703+
// vec![vec![
1704+
// MenuListEntry::new(format!("{:?}", DocumentMode::DesignMode))
1705+
// .label(DocumentMode::DesignMode.to_string())
1706+
// .icon(DocumentMode::DesignMode.icon_name()),
1707+
// MenuListEntry::new(format!("{:?}", DocumentMode::SelectMode))
1708+
// .label(DocumentMode::SelectMode.to_string())
1709+
// .icon(DocumentMode::SelectMode.icon_name())
1710+
// .on_commit(|_| DialogMessage::RequestComingSoonDialog { issue: Some(330) }.into()),
1711+
// MenuListEntry::new(format!("{:?}", DocumentMode::GuideMode))
1712+
// .label(DocumentMode::GuideMode.to_string())
1713+
// .icon(DocumentMode::GuideMode.icon_name())
1714+
// .on_commit(|_| DialogMessage::RequestComingSoonDialog { issue: Some(331) }.into()),
1715+
// ]])
1716+
// .selected_index(Some(self.document_mode as u32))
1717+
// .draw_icon(true)
1718+
// .interactive(false) // TODO: set to true when dialogs are not spawned
1719+
// .widget_holder(),
1720+
// Separator::new(SeparatorType::Section).widget_holder(),
17211721
],
17221722
}]);
17231723

@@ -1744,7 +1744,7 @@ impl DocumentMessageHandler {
17441744
widgets: vec![TextLabel::new("Overlays").bold(true).widget_holder()],
17451745
},
17461746
LayoutGroup::Row {
1747-
widgets: vec![TextLabel::new("Coming soon").widget_holder()],
1747+
widgets: vec![TextLabel::new("Granular settings in this menu are coming soon").widget_holder()],
17481748
},
17491749
])
17501750
.widget_holder(),
@@ -1828,16 +1828,16 @@ impl DocumentMessageHandler {
18281828
_ => Some(1),
18291829
})
18301830
.widget_holder(),
1831-
PopoverButton::new()
1832-
.popover_layout(vec![
1833-
LayoutGroup::Row {
1834-
widgets: vec![TextLabel::new("View Mode").bold(true).widget_holder()],
1835-
},
1836-
LayoutGroup::Row {
1837-
widgets: vec![TextLabel::new("Coming soon").widget_holder()],
1838-
},
1839-
])
1840-
.widget_holder(),
1831+
// PopoverButton::new()
1832+
// .popover_layout(vec![
1833+
// LayoutGroup::Row {
1834+
// widgets: vec![TextLabel::new("View Mode").bold(true).widget_holder()],
1835+
// },
1836+
// LayoutGroup::Row {
1837+
// widgets: vec![TextLabel::new("Coming soon").widget_holder()],
1838+
// },
1839+
// ])
1840+
// .widget_holder(),
18411841
Separator::new(SeparatorType::Unrelated).widget_holder(),
18421842
];
18431843

@@ -2191,7 +2191,7 @@ impl<'a> ClickXRayIter<'a> {
21912191
}
21922192
}
21932193

2194-
pub fn navigation_controls(ptz: &PTZ, navigation_handler: &NavigationMessageHandler, tooltip_name: &str) -> [WidgetHolder; 6] {
2194+
pub fn navigation_controls(ptz: &PTZ, navigation_handler: &NavigationMessageHandler, tooltip_name: &str) -> [WidgetHolder; 5] {
21952195
[
21962196
IconButton::new("ZoomIn", 24)
21972197
.tooltip("Zoom In")
@@ -2209,34 +2209,34 @@ pub fn navigation_controls(ptz: &PTZ, navigation_handler: &NavigationMessageHand
22092209
.on_update(|_| NavigationMessage::CanvasTiltResetAndZoomTo100Percent.into())
22102210
.disabled(ptz.tilt().abs() < 1e-4 && (ptz.zoom() - 1.).abs() < 1e-4)
22112211
.widget_holder(),
2212-
PopoverButton::new()
2213-
.popover_layout(vec![
2214-
LayoutGroup::Row {
2215-
widgets: vec![TextLabel::new(format!("{tooltip_name} Navigation")).bold(true).widget_holder()],
2216-
},
2217-
LayoutGroup::Row {
2218-
widgets: vec![TextLabel::new({
2219-
let tilt = if tooltip_name == "Canvas" { "Tilt:\n• Alt + Middle Click Drag\n\n" } else { "" };
2220-
format!(
2221-
"
2222-
Interactive controls in this\n\
2223-
menu are coming soon.\n\
2224-
\n\
2225-
Pan:\n\
2226-
• Middle Click Drag\n\
2227-
\n\
2228-
{tilt}Zoom:\n\
2229-
• Shift + Middle Click Drag\n\
2230-
• Ctrl + Scroll Wheel Roll
2231-
"
2232-
)
2233-
.trim()
2234-
})
2235-
.multiline(true)
2236-
.widget_holder()],
2237-
},
2238-
])
2239-
.widget_holder(),
2212+
// PopoverButton::new()
2213+
// .popover_layout(vec![
2214+
// LayoutGroup::Row {
2215+
// widgets: vec![TextLabel::new(format!("{tooltip_name} Navigation")).bold(true).widget_holder()],
2216+
// },
2217+
// LayoutGroup::Row {
2218+
// widgets: vec![TextLabel::new({
2219+
// let tilt = if tooltip_name == "Canvas" { "Tilt:\n• Alt + Middle Click Drag\n\n" } else { "" };
2220+
// format!(
2221+
// "
2222+
// Interactive controls in this\n\
2223+
// menu are coming soon.\n\
2224+
// \n\
2225+
// Pan:\n\
2226+
// • Middle Click Drag\n\
2227+
// \n\
2228+
// {tilt}Zoom:\n\
2229+
// • Shift + Middle Click Drag\n\
2230+
// • Ctrl + Scroll Wheel Roll
2231+
// "
2232+
// )
2233+
// .trim()
2234+
// })
2235+
// .multiline(true)
2236+
// .widget_holder()],
2237+
// },
2238+
// ])
2239+
// .widget_holder(),
22402240
Separator::new(SeparatorType::Related).widget_holder(),
22412241
NumberInput::new(Some(navigation_handler.snapped_zoom(ptz.zoom()) * 100.))
22422242
.unit("%")

editor/src/messages/portfolio/document/node_graph/node_graph_message_handler.rs

Lines changed: 16 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2250,13 +2250,17 @@ impl NodeGraphMessageHandler {
22502250
.map(|layer| layer.to_node())
22512251
.collect::<HashSet<_>>();
22522252

2253-
let mut selected_parents = HashSet::new();
2253+
let mut ancestors_of_selected = HashSet::new();
2254+
let mut descendants_of_selected = HashSet::new();
22542255
for selected_layer in &selected_layers {
22552256
for ancestor in LayerNodeIdentifier::new(*selected_layer, network_interface, &[]).ancestors(network_interface.document_metadata()) {
2256-
if ancestor != LayerNodeIdentifier::ROOT_PARENT && !selected_layers.contains(&ancestor.to_node()) {
2257-
selected_parents.insert(ancestor.to_node());
2257+
if ancestor != LayerNodeIdentifier::ROOT_PARENT && ancestor.to_node() != *selected_layer {
2258+
ancestors_of_selected.insert(ancestor.to_node());
22582259
}
22592260
}
2261+
for descendant in LayerNodeIdentifier::new(*selected_layer, network_interface, &[]).descendants(network_interface.document_metadata()) {
2262+
descendants_of_selected.insert(descendant.to_node());
2263+
}
22602264
}
22612265

22622266
for (&node_id, node_metadata) in &network_interface.network_metadata(&[]).unwrap().persistent_metadata.node_metadata {
@@ -2294,26 +2298,25 @@ impl NodeGraphMessageHandler {
22942298
}
22952299
});
22962300

2297-
let is_selected_parent = selected_parents.contains(&node_id);
2298-
22992301
let data = LayerPanelEntry {
23002302
id: node_id,
2303+
alias: network_interface.frontend_display_name(&node_id, &[]),
2304+
tooltip: if cfg!(debug_assertions) { format!("Layer ID: {node_id}") } else { "".into() },
2305+
in_selected_network: selection_network_path.is_empty(),
23012306
children_allowed,
23022307
children_present: layer.has_children(network_interface.document_metadata()),
23032308
expanded: layer.has_children(network_interface.document_metadata()) && !collapsed.0.contains(&layer),
23042309
depth: layer.ancestors(network_interface.document_metadata()).count() - 1,
2305-
parent_id: layer
2306-
.parent(network_interface.document_metadata())
2307-
.and_then(|parent| if parent != LayerNodeIdentifier::ROOT_PARENT { Some(parent.to_node()) } else { None }),
2308-
alias: network_interface.frontend_display_name(&node_id, &[]),
2309-
tooltip: if cfg!(debug_assertions) { format!("Layer ID: {node_id}") } else { "".into() },
23102310
visible: network_interface.is_visible(&node_id, &[]),
23112311
parents_visible,
23122312
unlocked: !network_interface.is_locked(&node_id, &[]),
23132313
parents_unlocked,
2314-
selected: selected_layers.contains(&node_id) || is_selected_parent,
2315-
in_selected_network: selection_network_path.is_empty(),
2316-
selected_parent: is_selected_parent,
2314+
parent_id: layer
2315+
.parent(network_interface.document_metadata())
2316+
.and_then(|parent| if parent != LayerNodeIdentifier::ROOT_PARENT { Some(parent.to_node()) } else { None }),
2317+
selected: selected_layers.contains(&node_id),
2318+
ancestor_of_selected: ancestors_of_selected.contains(&node_id),
2319+
descendant_of_selected: descendants_of_selected.contains(&node_id),
23172320
};
23182321
responses.add(FrontendMessage::UpdateDocumentLayerDetails { data });
23192322
}

editor/src/messages/portfolio/document/utility_types/nodes.rs

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,8 @@ pub struct LayerPanelEntry {
3636
pub id: NodeId,
3737
pub alias: String,
3838
pub tooltip: String,
39+
#[serde(rename = "inSelectedNetwork")]
40+
pub in_selected_network: bool,
3941
#[serde(rename = "childrenAllowed")]
4042
pub children_allowed: bool,
4143
#[serde(rename = "childrenPresent")]
@@ -51,10 +53,10 @@ pub struct LayerPanelEntry {
5153
#[serde(rename = "parentId")]
5254
pub parent_id: Option<NodeId>,
5355
pub selected: bool,
54-
#[serde(rename = "inSelectedNetwork")]
55-
pub in_selected_network: bool,
56-
#[serde(rename = "selectedParent")]
57-
pub selected_parent: bool,
56+
#[serde(rename = "ancestorOfSelected")]
57+
pub ancestor_of_selected: bool,
58+
#[serde(rename = "descendantOfSelected")]
59+
pub descendant_of_selected: bool,
5860
}
5961

6062
#[derive(Debug, Clone, Default, serde::Serialize, serde::Deserialize, PartialEq, Eq, specta::Type)]

editor/src/messages/tool/tool_messages/select_tool.rs

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -176,19 +176,19 @@ impl LayoutHolder for SelectTool {
176176
let disabled = self.tool_data.selected_layers_count < 2;
177177
widgets.push(Separator::new(SeparatorType::Unrelated).widget_holder());
178178
widgets.extend(self.alignment_widgets(disabled));
179-
widgets.push(
180-
PopoverButton::new()
181-
.popover_layout(vec![
182-
LayoutGroup::Row {
183-
widgets: vec![TextLabel::new("Align").bold(true).widget_holder()],
184-
},
185-
LayoutGroup::Row {
186-
widgets: vec![TextLabel::new("Coming soon").widget_holder()],
187-
},
188-
])
189-
.disabled(disabled)
190-
.widget_holder(),
191-
);
179+
// widgets.push(
180+
// PopoverButton::new()
181+
// .popover_layout(vec![
182+
// LayoutGroup::Row {
183+
// widgets: vec![TextLabel::new("Align").bold(true).widget_holder()],
184+
// },
185+
// LayoutGroup::Row {
186+
// widgets: vec![TextLabel::new("Coming soon").widget_holder()],
187+
// },
188+
// ])
189+
// .disabled(disabled)
190+
// .widget_holder(),
191+
// );
192192

193193
// Flip
194194
let disabled = self.tool_data.selected_layers_count == 0;

editor/src/messages/tool/utility_types.rs

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -250,14 +250,13 @@ impl LayoutHolder for ToolData {
250250
.iter()
251251
.map(|tool_group| tool_group.iter().map(|tool_availability| {
252252
match tool_availability {
253-
ToolAvailability::Available(tool) => ToolEntry::new( tool.tool_type(), tool.icon_name())
254-
.tooltip( tool.tooltip())
255-
.tooltip_shortcut(action_keys!(tool_type_to_activate_tool_message(tool.tool_type())))
256-
257-
,
253+
ToolAvailability::Available(tool) => ToolEntry::new(tool.tool_type(), tool.icon_name())
254+
.tooltip(tool.tooltip())
255+
.tooltip_shortcut(action_keys!(tool_type_to_activate_tool_message(tool.tool_type()))),
258256
ToolAvailability::ComingSoon(tool) => tool.clone(),
259257
}
260-
}).collect::<Vec<_>>())
258+
})
259+
.collect::<Vec<_>>())
261260
.flat_map(|group| {
262261
let separator = std::iter::once(Separator::new(SeparatorType::Section).direction(SeparatorDirection::Vertical).widget_holder());
263262
let buttons = group.into_iter().map(|ToolEntry { tooltip, tooltip_shortcut, tool_type, icon_name }| {
@@ -397,16 +396,14 @@ fn list_tools_in_groups() -> Vec<Vec<ToolAvailability>> {
397396
],
398397
vec![
399398
// Raster tool group
400-
// ToolAvailability::Available(Box::<imaginate_tool::ImaginateTool>::default()), // TODO: Fix and reenable ASAP
401-
ToolAvailability::ComingSoon(
402-
ToolEntry::new(ToolType::Heal, "RasterImaginateTool").tooltip("Coming Soon: Imaginate Tool - Temporarily disabled, please use Imaginate node directly from graph"),
403-
),
404399
ToolAvailability::Available(Box::<brush_tool::BrushTool>::default()),
405400
ToolAvailability::ComingSoon(ToolEntry::new(ToolType::Heal, "RasterHealTool").tooltip("Coming Soon: Heal Tool (J)")),
406401
ToolAvailability::ComingSoon(ToolEntry::new(ToolType::Clone, "RasterCloneTool").tooltip("Coming Soon: Clone Tool (C)")),
407402
ToolAvailability::ComingSoon(ToolEntry::new(ToolType::Patch, "RasterPatchTool").tooltip("Coming Soon: Patch Tool")),
408403
ToolAvailability::ComingSoon(ToolEntry::new(ToolType::Detail, "RasterDetailTool").tooltip("Coming Soon: Detail Tool (D)")),
409404
ToolAvailability::ComingSoon(ToolEntry::new(ToolType::Relight, "RasterRelightTool").tooltip("Coming Soon: Relight Tool (O)")),
405+
// ToolAvailability::Available(Box::<imaginate_tool::ImaginateTool>::default()), // TODO: Fix and reenable
406+
ToolAvailability::ComingSoon(ToolEntry::new(ToolType::Heal, "RasterImaginateTool").tooltip("Coming Soon: Imaginate Tool")),
410407
],
411408
]
412409
}

frontend/src/components/Editor.svelte

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -152,7 +152,7 @@
152152
--color-transparent-checkered-background-position-mini: 0 0, 4px 4px, 4px 4px;
153153
--color-transparent-checkered-background-repeat: repeat, repeat, repeat;
154154
155-
--background-inactive-stripes: repeating-linear-gradient(
155+
--inheritance-stripes-background: repeating-linear-gradient(
156156
-45deg,
157157
transparent 0px,
158158
transparent calc((3px * sqrt(2) / 2) - 0.5px),
@@ -161,6 +161,9 @@
161161
transparent calc((3px * sqrt(2) / 2) + 0.5px),
162162
transparent calc(6px * sqrt(2) / 2)
163163
);
164+
--inheritance-dots-background: url('data:image/svg+xml;utf8,\
165+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 6 6" width="6px" height="6px" fill="%23444"><rect width="1" height="1" /><rect x="3" y="3" width="1" height="1" /></svg>\
166+
');
164167
165168
// Array of 2x3 dots (fill: --color-e-nearwhite)
166169
--icon-drag-grip: url('data:image/svg+xml;utf8,\

frontend/src/components/layout/FloatingMenu.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -473,7 +473,7 @@
473473
474474
.floating-menu-content {
475475
background: var(--color-2-mildblack);
476-
box-shadow: rgba(var(--color-0-black-rgb), 50%) 0 2px 4px;
476+
box-shadow: rgba(var(--color-0-black-rgb), 0.5) 0 2px 4px;
477477
border-radius: 4px;
478478
color: var(--color-e-nearwhite);
479479
font-size: inherit;

0 commit comments

Comments
 (0)