From 9479abe114bc6b5e767b85d1f8f7c5f5dd5d7852 Mon Sep 17 00:00:00 2001 From: Elbert Ronnie <103196773+elbertronnie@users.noreply.github.com> Date: Sun, 3 Mar 2024 06:36:08 +0530 Subject: [PATCH] Fix dropdown keyboard movement bug (#1630) * Add a value to all `MenuListEntry` * cargo fmt * Make `value` as constructor in `MenuListEntry` * Make `value` as constructor in `RadioEntryData` --- .../export_dialog_message_handler.rs | 9 ++- .../utility_types/widgets/input_widgets.rs | 4 +- .../document/document_message_handler.rs | 19 +++--- .../node_properties.rs | 67 ++++++++++++------- .../document/overlays/grid_overlays.rs | 8 ++- .../common_functionality/color_selector.rs | 2 +- .../messages/tool/tool_messages/brush_tool.rs | 4 +- .../tool/tool_messages/gradient_tool.rs | 8 +-- .../messages/tool/tool_messages/path_tool.rs | 4 +- .../tool/tool_messages/polygon_tool.rs | 8 ++- .../tool/tool_messages/select_tool.rs | 4 +- 11 files changed, 86 insertions(+), 51 deletions(-) diff --git a/editor/src/messages/dialog/export_dialog/export_dialog_message_handler.rs b/editor/src/messages/dialog/export_dialog/export_dialog_message_handler.rs index 5bf4bdb2..63afee10 100644 --- a/editor/src/messages/dialog/export_dialog/export_dialog_message_handler.rs +++ b/editor/src/messages/dialog/export_dialog/export_dialog_message_handler.rs @@ -63,7 +63,7 @@ impl LayoutHolder for ExportDialogMessageHandler { fn layout(&self) -> Layout { let entries = [(FileType::Png, "PNG"), (FileType::Jpg, "JPG"), (FileType::Svg, "SVG")] .into_iter() - .map(|(val, name)| RadioEntryData::new(name).on_update(move |_| ExportDialogMessage::FileType(val).into())) + .map(|(val, name)| RadioEntryData::new(format!("{val:?}")).label(name).on_update(move |_| ExportDialogMessage::FileType(val).into())) .collect(); let export_type = vec![ @@ -94,7 +94,12 @@ impl LayoutHolder for ExportDialogMessageHandler { let index = export_area_options.iter().position(|(val, _, _)| val == &self.bounds).unwrap(); let entries = vec![export_area_options .into_iter() - .map(|(val, name, disabled)| MenuListEntry::new(name).on_update(move |_| ExportDialogMessage::ExportBounds(val).into()).disabled(disabled)) + .map(|(val, name, disabled)| { + MenuListEntry::new(format!("{val:?}")) + .label(name) + .on_update(move |_| ExportDialogMessage::ExportBounds(val).into()) + .disabled(disabled) + }) .collect()]; let export_area = vec![ diff --git a/editor/src/messages/layout/utility_types/widgets/input_widgets.rs b/editor/src/messages/layout/utility_types/widgets/input_widgets.rs index 47323f36..109f40e2 100644 --- a/editor/src/messages/layout/utility_types/widgets/input_widgets.rs +++ b/editor/src/messages/layout/utility_types/widgets/input_widgets.rs @@ -80,9 +80,9 @@ pub type MenuListEntrySections = Vec>; #[derivative(Debug, PartialEq)] #[widget_builder(not_widget_holder)] pub struct MenuListEntry { + #[widget_builder(constructor)] pub value: String, - #[widget_builder(constructor)] pub label: String, pub icon: String, @@ -294,9 +294,9 @@ pub struct RadioInput { #[derivative(Debug, PartialEq)] #[widget_builder(not_widget_holder)] pub struct RadioEntryData { + #[widget_builder(constructor)] pub value: String, - #[widget_builder(constructor)] pub label: String, pub icon: String, diff --git a/editor/src/messages/portfolio/document/document_message_handler.rs b/editor/src/messages/portfolio/document/document_message_handler.rs index ca1d4ad4..671ef70d 100644 --- a/editor/src/messages/portfolio/document/document_message_handler.rs +++ b/editor/src/messages/portfolio/document/document_message_handler.rs @@ -1163,11 +1163,15 @@ impl DocumentMessageHandler { widgets: vec![ DropdownInput::new( vec![vec![ - MenuListEntry::new(DocumentMode::DesignMode.to_string()).icon(DocumentMode::DesignMode.icon_name()), - MenuListEntry::new(DocumentMode::SelectMode.to_string()) + MenuListEntry::new(format!("{:?}", DocumentMode::DesignMode)) + .label(DocumentMode::DesignMode.to_string()) + .icon(DocumentMode::DesignMode.icon_name()), + MenuListEntry::new(format!("{:?}", DocumentMode::SelectMode)) + .label(DocumentMode::SelectMode.to_string()) .icon(DocumentMode::SelectMode.icon_name()) .on_update(|_| DialogMessage::RequestComingSoonDialog { issue: Some(330) }.into()), - MenuListEntry::new(DocumentMode::GuideMode.to_string()) + MenuListEntry::new(format!("{:?}", DocumentMode::GuideMode)) + .label(DocumentMode::SelectMode.to_string()) .icon(DocumentMode::GuideMode.icon_name()) .on_update(|_| DialogMessage::RequestComingSoonDialog { issue: Some(331) }.into()), ]]) @@ -1257,18 +1261,15 @@ impl DocumentMessageHandler { .widget_holder(), Separator::new(SeparatorType::Unrelated).widget_holder(), RadioInput::new(vec![ - RadioEntryData::default() - .value("normal") + RadioEntryData::new("normal") .icon("ViewModeNormal") .tooltip("View Mode: Normal") .on_update(|_| DocumentMessage::SetViewMode { view_mode: ViewMode::Normal }.into()), - RadioEntryData::default() - .value("outline") + RadioEntryData::new("outline") .icon("ViewModeOutline") .tooltip("View Mode: Outline") .on_update(|_| DocumentMessage::SetViewMode { view_mode: ViewMode::Outline }.into()), - RadioEntryData::default() - .value("pixels") + RadioEntryData::new("pixels") .icon("ViewModePixels") .tooltip("View Mode: Pixels") .on_update(|_| DialogMessage::RequestComingSoonDialog { issue: Some(320) }.into()), diff --git a/editor/src/messages/portfolio/document/node_graph/node_graph_message_handler/node_properties.rs b/editor/src/messages/portfolio/document/node_graph/node_graph_message_handler/node_properties.rs index 0098caa9..93a4de85 100644 --- a/editor/src/messages/portfolio/document/node_graph/node_graph_message_handler/node_properties.rs +++ b/editor/src/messages/portfolio/document/node_graph/node_graph_message_handler/node_properties.rs @@ -384,7 +384,8 @@ fn color_channel(document_node: &DocumentNode, node_id: NodeId, index: usize, na let mut entries = Vec::with_capacity(calculation_modes.len()); for method in calculation_modes { entries.push( - MenuListEntry::new(method.to_string()) + MenuListEntry::new(format!("{method:?}")) + .label(method.to_string()) .on_update(update_value(move |_| TaggedValue::RedGreenBlue(method), node_id, index)) .on_commit(commit_value), ); @@ -410,7 +411,8 @@ fn noise_type(document_node: &DocumentNode, node_id: NodeId, index: usize, name: let entries = NoiseType::list() .iter() .map(|noise_type| { - MenuListEntry::new(noise_type.to_string()) + MenuListEntry::new(format!("{noise_type:?}")) + .label(noise_type.to_string()) .on_update(update_value(move |_| TaggedValue::NoiseType(*noise_type), node_id, index)) .on_commit(commit_value) }) @@ -435,7 +437,8 @@ fn fractal_type(document_node: &DocumentNode, node_id: NodeId, index: usize, nam let entries = FractalType::list() .iter() .map(|fractal_type| { - MenuListEntry::new(fractal_type.to_string()) + MenuListEntry::new(format!("{fractal_type:?}")) + .label(fractal_type.to_string()) .on_update(update_value(move |_| TaggedValue::FractalType(*fractal_type), node_id, index)) .on_commit(commit_value) }) @@ -460,7 +463,8 @@ fn cellular_distance_function(document_node: &DocumentNode, node_id: NodeId, ind let entries = CellularDistanceFunction::list() .iter() .map(|cellular_distance_function| { - MenuListEntry::new(cellular_distance_function.to_string()) + MenuListEntry::new(format!("{cellular_distance_function:?}")) + .label(cellular_distance_function.to_string()) .on_update(update_value(move |_| TaggedValue::CellularDistanceFunction(*cellular_distance_function), node_id, index)) .on_commit(commit_value) }) @@ -488,7 +492,8 @@ fn cellular_return_type(document_node: &DocumentNode, node_id: NodeId, index: us let entries = CellularReturnType::list() .iter() .map(|cellular_return_type| { - MenuListEntry::new(cellular_return_type.to_string()) + MenuListEntry::new(format!("{cellular_return_type:?}")) + .label(cellular_return_type.to_string()) .on_update(update_value(move |_| TaggedValue::CellularReturnType(*cellular_return_type), node_id, index)) .on_commit(commit_value) }) @@ -513,7 +518,8 @@ fn domain_warp_type(document_node: &DocumentNode, node_id: NodeId, index: usize, let entries = DomainWarpType::list() .iter() .map(|domain_warp_type| { - MenuListEntry::new(domain_warp_type.to_string()) + MenuListEntry::new(format!("{domain_warp_type:?}")) + .label(domain_warp_type.to_string()) .on_update(update_value(move |_| TaggedValue::DomainWarpType(*domain_warp_type), node_id, index)) .on_commit(commit_value) }) @@ -541,7 +547,8 @@ fn blend_mode(document_node: &DocumentNode, node_id: NodeId, index: usize, name: category .iter() .map(|blend_mode| { - MenuListEntry::new(blend_mode.to_string()) + MenuListEntry::new(format!("{blend_mode:?}")) + .label(blend_mode.to_string()) .on_update(update_value(move |_| TaggedValue::BlendMode(*blend_mode), node_id, index)) .on_commit(commit_value) }) @@ -571,7 +578,8 @@ fn luminance_calculation(document_node: &DocumentNode, node_id: NodeId, index: u let mut entries = Vec::with_capacity(calculation_modes.len()); for method in calculation_modes { entries.push( - MenuListEntry::new(method.to_string()) + MenuListEntry::new(format!("{method:?}")) + .label(method.to_string()) .on_update(update_value(move |_| TaggedValue::LuminanceCalculation(method), node_id, index)) .on_commit(commit_value), ); @@ -596,7 +604,8 @@ fn line_cap_widget(document_node: &DocumentNode, node_id: NodeId, index: usize, let entries = [("Butt", LineCap::Butt), ("Round", LineCap::Round), ("Square", LineCap::Square)] .into_iter() .map(|(name, val)| { - RadioEntryData::new(name) + RadioEntryData::new(format!("{val:?}")) + .label(name) .on_update(update_value(move |_| TaggedValue::LineCap(val), node_id, index)) .on_commit(commit_value) }) @@ -620,7 +629,8 @@ fn line_join_widget(document_node: &DocumentNode, node_id: NodeId, index: usize, let entries = [("Miter", LineJoin::Miter), ("Bevel", LineJoin::Bevel), ("Round", LineJoin::Round)] .into_iter() .map(|(name, val)| { - RadioEntryData::new(name) + RadioEntryData::new(format!("{val:?}")) + .label(name) .on_update(update_value(move |_| TaggedValue::LineJoin(val), node_id, index)) .on_commit(commit_value) }) @@ -642,10 +652,12 @@ fn fill_type_widget(document_node: &DocumentNode, node_id: NodeId, index: usize) } = &document_node.inputs[index] { let entries = vec![ - RadioEntryData::new("Solid") + RadioEntryData::new("solid") + .label("Solid") .on_update(update_value(move |_| TaggedValue::FillType(FillType::Solid), node_id, index)) .on_commit(commit_value), - RadioEntryData::new("Gradient") + RadioEntryData::new("gradient") + .label("Gradient") .on_update(update_value(move |_| TaggedValue::FillType(FillType::Gradient), node_id, index)) .on_commit(commit_value), ]; @@ -671,10 +683,12 @@ fn gradient_type_widget(document_node: &DocumentNode, node_id: NodeId, index: us } = &document_node.inputs[index] { let entries = vec![ - RadioEntryData::new("Linear") + RadioEntryData::new("linear") + .label("Linear") .on_update(update_value(move |_| TaggedValue::GradientType(GradientType::Linear), node_id, index)) .on_commit(commit_value), - RadioEntryData::new("Radial") + RadioEntryData::new("radial") + .label("Radial") .on_update(update_value(move |_| TaggedValue::GradientType(GradientType::Radial), node_id, index)) .on_commit(commit_value), ]; @@ -1194,13 +1208,16 @@ pub fn adjust_channel_mixer_properties(document_node: &DocumentNode, node_id: No } = &document_node.inputs[output_channel_index] { let entries = vec![ - RadioEntryData::new(RedGreenBlue::Red.to_string()) + RadioEntryData::new(format!("{:?}", RedGreenBlue::Red)) + .label(RedGreenBlue::Red.to_string()) .on_update(update_value(|_| TaggedValue::RedGreenBlue(RedGreenBlue::Red), node_id, output_channel_index)) .on_commit(commit_value), - RadioEntryData::new(RedGreenBlue::Green.to_string()) + RadioEntryData::new(format!("{:?}", RedGreenBlue::Green)) + .label(RedGreenBlue::Green.to_string()) .on_update(update_value(|_| TaggedValue::RedGreenBlue(RedGreenBlue::Green), node_id, output_channel_index)) .on_commit(commit_value), - RadioEntryData::new(RedGreenBlue::Blue.to_string()) + RadioEntryData::new(format!("{:?}", RedGreenBlue::Blue)) + .label(RedGreenBlue::Blue.to_string()) .on_update(update_value(|_| TaggedValue::RedGreenBlue(RedGreenBlue::Blue), node_id, output_channel_index)) .on_commit(commit_value), ]; @@ -1290,7 +1307,8 @@ pub fn adjust_selective_color_properties(document_node: &DocumentNode, node_id: section .iter() .map(|choice| { - MenuListEntry::new(choice.to_string()) + MenuListEntry::new(format!("{choice:?}")) + .label(choice.to_string()) .on_update(update_value(move |_| TaggedValue::SelectiveColorChoice(*choice), node_id, colors_index)) .on_commit(commit_value) }) @@ -1337,10 +1355,12 @@ pub fn adjust_selective_color_properties(document_node: &DocumentNode, node_id: } = &document_node.inputs[mode_index] { let entries = vec![ - RadioEntryData::new("Relative") + RadioEntryData::new("relative") + .label("Relative") .on_update(update_value(|_| TaggedValue::RelativeAbsolute(RelativeAbsolute::Relative), node_id, mode_index)) .on_commit(commit_value), - RadioEntryData::new("Absolute") + RadioEntryData::new("absolute") + .label("Absolute") .on_update(update_value(|_| TaggedValue::RelativeAbsolute(RelativeAbsolute::Absolute), node_id, mode_index)) .on_commit(commit_value), ]; @@ -1912,7 +1932,8 @@ pub fn imaginate_properties(document_node: &DocumentNode, node_id: NodeId, conte let mut entries = Vec::with_capacity(sampling_methods.len()); for method in sampling_methods { entries.push( - MenuListEntry::new(method.to_string()) + MenuListEntry::new(format!("{method:?}")) + .label(method.to_string()) .on_update(update_value(move |_| TaggedValue::ImaginateSamplingMethod(method), node_id, sampling_method_index)) .on_commit(commit_value), ); @@ -1997,7 +2018,7 @@ pub fn imaginate_properties(document_node: &DocumentNode, node_id: NodeId, conte // RadioInput::new( // [(true, "Inpaint"), (false, "Outpaint")] // .into_iter() - // .map(|(paint, name)| RadioEntryData::new(name).on_update(update_value(move |_| TaggedValue::Bool(paint), node_id, inpaint_index))) + // .map(|(paint, name)| RadioEntryData::new(name).label(name).on_update(update_value(move |_| TaggedValue::Bool(paint), node_id, inpaint_index))) // .collect(), // ) // .selected_index(Some(1 - in_paint as u32)) @@ -2030,7 +2051,7 @@ pub fn imaginate_properties(document_node: &DocumentNode, node_id: NodeId, conte // let mask_fill_content_modes = ImaginateMaskStartingFill::list(); // let mut entries = Vec::with_capacity(mask_fill_content_modes.len()); // for mode in mask_fill_content_modes { - // entries.push(MenuListEntry::new(mode.to_string()).on_update(update_value(move |_| TaggedValue::ImaginateMaskStartingFill(mode), node_id, mask_fill_index))); + // entries.push(MenuListEntry::new(format!("{mode:?}")).label(mode.to_string()).on_update(update_value(move |_| TaggedValue::ImaginateMaskStartingFill(mode), node_id, mask_fill_index))); // } // let entries = vec![entries]; diff --git a/editor/src/messages/portfolio/document/overlays/grid_overlays.rs b/editor/src/messages/portfolio/document/overlays/grid_overlays.rs index 9fa44591..9fefde71 100644 --- a/editor/src/messages/portfolio/document/overlays/grid_overlays.rs +++ b/editor/src/messages/portfolio/document/overlays/grid_overlays.rs @@ -129,8 +129,12 @@ pub fn overlay_options(grid: &GridSnapping) -> Vec { TextLabel::new("Type").table_align(true).widget_holder(), Separator::new(SeparatorType::Unrelated).widget_holder(), RadioInput::new(vec![ - RadioEntryData::new("Rectangular").on_update(update_val(grid, |grid, _| grid.grid_type = GridType::RECTANGLE)), - RadioEntryData::new("Isometric").on_update(update_val(grid, |grid, _| grid.grid_type = GridType::ISOMETRIC)), + RadioEntryData::new("rectangular") + .label("Rectangular") + .on_update(update_val(grid, |grid, _| grid.grid_type = GridType::RECTANGLE)), + RadioEntryData::new("isometric") + .label("Isometric") + .on_update(update_val(grid, |grid, _| grid.grid_type = GridType::ISOMETRIC)), ]) .min_width(200) .selected_index(Some(if matches!(grid.grid_type, GridType::Rectangle { .. }) { 0 } else { 1 })) diff --git a/editor/src/messages/tool/common_functionality/color_selector.rs b/editor/src/messages/tool/common_functionality/color_selector.rs index d4370575..f555828f 100644 --- a/editor/src/messages/tool/common_functionality/color_selector.rs +++ b/editor/src/messages/tool/common_functionality/color_selector.rs @@ -89,7 +89,7 @@ impl ToolColorOptions { ] .into_iter() .map(|(icon, tooltip, color_type)| { - let mut entry = RadioEntryData::new("").tooltip(tooltip).icon(icon); + let mut entry = RadioEntryData::new(format!("{color_type:?}")).tooltip(tooltip).icon(icon); entry.on_update = radio_callback(color_type); entry }) diff --git a/editor/src/messages/tool/tool_messages/brush_tool.rs b/editor/src/messages/tool/tool_messages/brush_tool.rs index 9903bed6..9860692b 100644 --- a/editor/src/messages/tool/tool_messages/brush_tool.rs +++ b/editor/src/messages/tool/tool_messages/brush_tool.rs @@ -167,8 +167,8 @@ impl LayoutHolder for BrushTool { group .iter() .map(|blend_mode| { - MenuListEntry::new(format!("{blend_mode}")) - .value(format!("{blend_mode:?}")) + MenuListEntry::new(format!("{blend_mode:?}")) + .label(blend_mode.to_string()) .on_update(|_| BrushToolMessage::UpdateOptions(BrushToolMessageOptionsUpdate::BlendMode(*blend_mode)).into()) }) .collect() diff --git a/editor/src/messages/tool/tool_messages/gradient_tool.rs b/editor/src/messages/tool/tool_messages/gradient_tool.rs index ca16476f..6d002ed1 100644 --- a/editor/src/messages/tool/tool_messages/gradient_tool.rs +++ b/editor/src/messages/tool/tool_messages/gradient_tool.rs @@ -88,12 +88,12 @@ impl<'a> MessageHandler> for Gradien impl LayoutHolder for GradientTool { fn layout(&self) -> Layout { let gradient_type = RadioInput::new(vec![ - RadioEntryData::new("Linear") - .value("linear") + RadioEntryData::new("linear") + .label("Linear") .tooltip("Linear Gradient") .on_update(move |_| GradientToolMessage::UpdateOptions(GradientOptionsUpdate::Type(GradientType::Linear)).into()), - RadioEntryData::new("Radial") - .value("radial") + RadioEntryData::new("radial") + .label("Radial") .tooltip("Radial Gradient") .on_update(move |_| GradientToolMessage::UpdateOptions(GradientOptionsUpdate::Type(GradientType::Radial)).into()), ]) diff --git a/editor/src/messages/tool/tool_messages/path_tool.rs b/editor/src/messages/tool/tool_messages/path_tool.rs index 8eff07d4..0d79706c 100644 --- a/editor/src/messages/tool/tool_messages/path_tool.rs +++ b/editor/src/messages/tool/tool_messages/path_tool.rs @@ -125,8 +125,8 @@ impl LayoutHolder for PathTool { let unrelated_seperator = Separator::new(SeparatorType::Unrelated).widget_holder(); let manipulator_angle_options = vec![ - RadioEntryData::new("Smooth").on_update(|_| PathToolMessage::ManipulatorAngleMakeSmooth.into()), - RadioEntryData::new("Sharp").on_update(|_| PathToolMessage::ManipulatorAngleMakeSharp.into()), + RadioEntryData::new("smooth").label("Smooth").on_update(|_| PathToolMessage::ManipulatorAngleMakeSmooth.into()), + RadioEntryData::new("sharp").label("Sharp").on_update(|_| PathToolMessage::ManipulatorAngleMakeSharp.into()), ]; let manipulator_angle_index = manipulator_angle.and_then(|angle| match angle { ManipulatorAngle::Smooth => Some(0), diff --git a/editor/src/messages/tool/tool_messages/polygon_tool.rs b/editor/src/messages/tool/tool_messages/polygon_tool.rs index 82c64d05..0d5aa07d 100644 --- a/editor/src/messages/tool/tool_messages/polygon_tool.rs +++ b/editor/src/messages/tool/tool_messages/polygon_tool.rs @@ -103,8 +103,12 @@ fn create_sides_widget(vertices: u32) -> WidgetHolder { fn create_star_option_widget(primitive_shape_type: PrimitiveShapeType) -> WidgetHolder { let entries = vec![ - RadioEntryData::new("Polygon").on_update(move |_| PolygonToolMessage::UpdateOptions(PolygonOptionsUpdate::PrimitiveShapeType(PrimitiveShapeType::Polygon)).into()), - RadioEntryData::new("Star").on_update(move |_| PolygonToolMessage::UpdateOptions(PolygonOptionsUpdate::PrimitiveShapeType(PrimitiveShapeType::Star)).into()), + RadioEntryData::new("polygon") + .label("Polygon") + .on_update(move |_| PolygonToolMessage::UpdateOptions(PolygonOptionsUpdate::PrimitiveShapeType(PrimitiveShapeType::Polygon)).into()), + RadioEntryData::new("star") + .label("Star") + .on_update(move |_| PolygonToolMessage::UpdateOptions(PolygonOptionsUpdate::PrimitiveShapeType(PrimitiveShapeType::Star)).into()), ]; RadioInput::new(entries).selected_index(Some(primitive_shape_type as u32)).widget_holder() } diff --git a/editor/src/messages/tool/tool_messages/select_tool.rs b/editor/src/messages/tool/tool_messages/select_tool.rs index 321af1e3..9c7f98e5 100644 --- a/editor/src/messages/tool/tool_messages/select_tool.rs +++ b/editor/src/messages/tool/tool_messages/select_tool.rs @@ -106,8 +106,8 @@ impl SelectTool { let layer_selection_behavior_entries = [NestedSelectionBehavior::Deepest, NestedSelectionBehavior::Shallowest] .iter() .map(|mode| { - MenuListEntry::new(mode.to_string()) - .value(mode.to_string()) + MenuListEntry::new(format!("{mode:?}")) + .label(mode.to_string()) .on_update(move |_| SelectToolMessage::SelectOptions(SelectOptionsUpdate::NestedSelectionBehavior(*mode)).into()) }) .collect();