diff --git a/editor/src/messages/dialog/mod.rs b/editor/src/messages/dialog/mod.rs index 3237552e..6e7e6ee1 100644 --- a/editor/src/messages/dialog/mod.rs +++ b/editor/src/messages/dialog/mod.rs @@ -1,4 +1,4 @@ -//! Handles modal dialogs that appear as floating menus in the center of the editor window. +//! Handles dialogs that appear as floating menus in the center of the editor window. //! //! Dialogs are represented as structs that implement the `DialogLayoutHolder` trait. //! diff --git a/editor/src/messages/dialog/simple_dialogs/close_all_documents_dialog.rs b/editor/src/messages/dialog/simple_dialogs/close_all_documents_dialog.rs index 3eb18129..070972f0 100644 --- a/editor/src/messages/dialog/simple_dialogs/close_all_documents_dialog.rs +++ b/editor/src/messages/dialog/simple_dialogs/close_all_documents_dialog.rs @@ -1,7 +1,7 @@ use crate::messages::layout::utility_types::widget_prelude::*; use crate::messages::prelude::*; -/// A dialog for confirming the closing of all documents viewable via `file -> close all` in the menu bar. +/// A dialog for confirming the closing of all documents viewable via `File -> Close All` in the menu bar. pub struct CloseAllDocumentsDialog { pub unsaved_document_names: Vec, } diff --git a/editor/src/messages/layout/layout_message_handler.rs b/editor/src/messages/layout/layout_message_handler.rs index aa770f5a..dd90dbbc 100644 --- a/editor/src/messages/layout/layout_message_handler.rs +++ b/editor/src/messages/layout/layout_message_handler.rs @@ -196,10 +196,10 @@ impl Vec> MessageHandler { - let update_value = value.as_str().expect("RadioInput update was not of type: u64"); - pivot_assist.position = update_value.into(); - let callback_message = (pivot_assist.on_update.callback)(pivot_assist); + Widget::PivotInput(pivot_input) => { + let update_value = value.as_str().expect("PivotInput update was not of type: u64"); + pivot_input.position = update_value.into(); + let callback_message = (pivot_input.on_update.callback)(pivot_input); responses.add(callback_message); } Widget::PopoverButton(_) => {} @@ -210,7 +210,6 @@ impl Vec> MessageHandler {} - Widget::SwatchPairInput(_) => {} Widget::TextAreaInput(text_area_input) => { let update_value = value.as_str().expect("TextAreaInput update was not of type: string"); text_area_input.value = update_value.into(); @@ -228,6 +227,7 @@ impl Vec> MessageHandler {} + Widget::WorkingColorsButton(_) => {} }; responses.add(ResendActiveWidget { layout_target, dirty_id: widget_id }); } diff --git a/editor/src/messages/layout/utility_types/layout_widget.rs b/editor/src/messages/layout/utility_types/layout_widget.rs index 134757bd..73fb9dfd 100644 --- a/editor/src/messages/layout/utility_types/layout_widget.rs +++ b/editor/src/messages/layout/utility_types/layout_widget.rs @@ -1,4 +1,3 @@ -use super::widgets::assist_widgets::*; use super::widgets::button_widgets::*; use super::widgets::input_widgets::*; use super::widgets::label_widgets::*; @@ -337,7 +336,7 @@ impl LayoutGroup { Widget::TextInput(x) => &mut x.tooltip, Widget::TextLabel(x) => &mut x.tooltip, Widget::BreadcrumbTrailButtons(x) => &mut x.tooltip, - Widget::InvisibleStandinInput(_) | Widget::PivotAssist(_) | Widget::RadioInput(_) | Widget::Separator(_) | Widget::SwatchPairInput(_) => continue, + Widget::InvisibleStandinInput(_) | Widget::PivotInput(_) | Widget::RadioInput(_) | Widget::Separator(_) | Widget::WorkingColorsButton(_) => continue, }; if val.is_empty() { *val = tooltip.clone(); @@ -483,15 +482,15 @@ pub enum Widget { NumberInput(NumberInput), OptionalInput(OptionalInput), ParameterExposeButton(ParameterExposeButton), - PivotAssist(PivotAssist), + PivotInput(PivotInput), PopoverButton(PopoverButton), RadioInput(RadioInput), Separator(Separator), - SwatchPairInput(SwatchPairInput), TextAreaInput(TextAreaInput), TextButton(TextButton), TextInput(TextInput), TextLabel(TextLabel), + WorkingColorsButton(WorkingColorsButton), } /// A single change to part of the UI, containing the location of the change and the new value. @@ -559,13 +558,13 @@ impl DiffUpdate { | Widget::ImageLabel(_) | Widget::CurveInput(_) | Widget::InvisibleStandinInput(_) - | Widget::PivotAssist(_) + | Widget::PivotInput(_) | Widget::RadioInput(_) | Widget::Separator(_) - | Widget::SwatchPairInput(_) | Widget::TextAreaInput(_) | Widget::TextInput(_) - | Widget::TextLabel(_) => None, + | Widget::TextLabel(_) + | Widget::WorkingColorsButton(_) => None, }; if let Some((tooltip, Some(tooltip_shortcut))) = &mut tooltip_shortcut { apply_shortcut_to_tooltip(tooltip_shortcut, tooltip); diff --git a/editor/src/messages/layout/utility_types/mod.rs b/editor/src/messages/layout/utility_types/mod.rs index 7dc8a69f..8408d0b1 100644 --- a/editor/src/messages/layout/utility_types/mod.rs +++ b/editor/src/messages/layout/utility_types/mod.rs @@ -3,7 +3,6 @@ pub mod widgets; pub mod widget_prelude { pub use super::layout_widget::*; - pub use super::widgets::assist_widgets::*; pub use super::widgets::button_widgets::*; pub use super::widgets::input_widgets::*; pub use super::widgets::label_widgets::*; diff --git a/editor/src/messages/layout/utility_types/widgets/assist_widgets.rs b/editor/src/messages/layout/utility_types/widgets/assist_widgets.rs deleted file mode 100644 index 492f9317..00000000 --- a/editor/src/messages/layout/utility_types/widgets/assist_widgets.rs +++ /dev/null @@ -1,102 +0,0 @@ -use crate::messages::layout::utility_types::widget_prelude::*; -use graphite_proc_macros::WidgetBuilder; - -use derivative::*; -use glam::DVec2; -use serde::{Deserialize, Serialize}; - -#[derive(Clone, Default, Derivative, Serialize, Deserialize, WidgetBuilder, specta::Type)] -#[derivative(Debug, PartialEq)] -pub struct PivotAssist { - #[widget_builder(constructor)] - pub position: PivotPosition, - - pub disabled: bool, - - // Callbacks - #[serde(skip)] - #[derivative(Debug = "ignore", PartialEq = "ignore")] - pub on_update: WidgetCallback, -} - -#[derive(Clone, Copy, Serialize, Deserialize, Debug, Default, PartialEq, Eq, specta::Type)] -pub enum PivotPosition { - #[default] - None, - TopLeft, - TopCenter, - TopRight, - CenterLeft, - Center, - CenterRight, - BottomLeft, - BottomCenter, - BottomRight, -} - -impl From<&str> for PivotPosition { - fn from(input: &str) -> Self { - match input { - "None" => PivotPosition::None, - "TopLeft" => PivotPosition::TopLeft, - "TopCenter" => PivotPosition::TopCenter, - "TopRight" => PivotPosition::TopRight, - "CenterLeft" => PivotPosition::CenterLeft, - "Center" => PivotPosition::Center, - "CenterRight" => PivotPosition::CenterRight, - "BottomLeft" => PivotPosition::BottomLeft, - "BottomCenter" => PivotPosition::BottomCenter, - "BottomRight" => PivotPosition::BottomRight, - _ => panic!("Failed parsing unrecognized PivotPosition enum value '{input}'"), - } - } -} - -impl From for Option { - fn from(input: PivotPosition) -> Self { - match input { - PivotPosition::None => None, - PivotPosition::TopLeft => Some(DVec2::new(0., 0.)), - PivotPosition::TopCenter => Some(DVec2::new(0.5, 0.)), - PivotPosition::TopRight => Some(DVec2::new(1., 0.)), - PivotPosition::CenterLeft => Some(DVec2::new(0., 0.5)), - PivotPosition::Center => Some(DVec2::new(0.5, 0.5)), - PivotPosition::CenterRight => Some(DVec2::new(1., 0.5)), - PivotPosition::BottomLeft => Some(DVec2::new(0., 1.)), - PivotPosition::BottomCenter => Some(DVec2::new(0.5, 1.)), - PivotPosition::BottomRight => Some(DVec2::new(1., 1.)), - } - } -} - -impl From for PivotPosition { - fn from(input: DVec2) -> Self { - const TOLERANCE: f64 = 1e-5_f64; - if input.y.abs() < TOLERANCE { - if input.x.abs() < TOLERANCE { - return PivotPosition::TopLeft; - } else if (input.x - 0.5).abs() < TOLERANCE { - return PivotPosition::TopCenter; - } else if (input.x - 1.).abs() < TOLERANCE { - return PivotPosition::TopRight; - } - } else if (input.y - 0.5).abs() < TOLERANCE { - if input.x.abs() < TOLERANCE { - return PivotPosition::CenterLeft; - } else if (input.x - 0.5).abs() < TOLERANCE { - return PivotPosition::Center; - } else if (input.x - 1.).abs() < TOLERANCE { - return PivotPosition::CenterRight; - } - } else if (input.y - 1.).abs() < TOLERANCE { - if input.x.abs() < TOLERANCE { - return PivotPosition::BottomLeft; - } else if (input.x - 0.5).abs() < TOLERANCE { - return PivotPosition::BottomCenter; - } else if (input.x - 1.).abs() < TOLERANCE { - return PivotPosition::BottomRight; - } - } - PivotPosition::None - } -} diff --git a/editor/src/messages/layout/utility_types/widgets/button_widgets.rs b/editor/src/messages/layout/utility_types/widgets/button_widgets.rs index aff02a4d..95310a55 100644 --- a/editor/src/messages/layout/utility_types/widgets/button_widgets.rs +++ b/editor/src/messages/layout/utility_types/widgets/button_widgets.rs @@ -106,6 +106,16 @@ pub struct TextButton { pub on_update: WidgetCallback, } +#[derive(Clone, Serialize, Deserialize, Derivative, WidgetBuilder, specta::Type)] +#[derivative(Debug, PartialEq, Default)] +pub struct WorkingColorsButton { + #[widget_builder(constructor)] + pub primary: Color, + + #[widget_builder(constructor)] + pub secondary: Color, +} + #[derive(Clone, Derivative, Serialize, Deserialize, WidgetBuilder, specta::Type)] #[derivative(Debug, PartialEq, Default)] pub struct ColorButton { 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 79405a98..504bbee2 100644 --- a/editor/src/messages/layout/utility_types/widgets/input_widgets.rs +++ b/editor/src/messages/layout/utility_types/widgets/input_widgets.rs @@ -3,11 +3,11 @@ use crate::messages::layout::utility_types::widget_prelude::*; use document_legacy::layers::layer_info::LayerDataTypeDiscriminant; use document_legacy::LayerId; -use graphene_core::raster::color::Color; use graphene_core::raster::curve::Curve; use graphite_proc_macros::WidgetBuilder; use derivative::*; +use glam::DVec2; use serde::{Deserialize, Serialize}; #[derive(Clone, Derivative, Serialize, Deserialize, WidgetBuilder, specta::Type)] @@ -339,16 +339,6 @@ pub struct RadioEntryData { pub on_update: WidgetCallback<()>, } -#[derive(Clone, Serialize, Deserialize, Derivative, WidgetBuilder, specta::Type)] -#[derivative(Debug, PartialEq, Default)] -pub struct SwatchPairInput { - #[widget_builder(constructor)] - pub primary: Color, - - #[widget_builder(constructor)] - pub secondary: Color, -} - #[derive(Clone, Serialize, Deserialize, Derivative, WidgetBuilder, specta::Type)] #[derivative(Debug, PartialEq, Default)] pub struct TextAreaInput { @@ -405,3 +395,99 @@ pub struct CurveInput { #[derivative(Debug = "ignore", PartialEq = "ignore")] pub on_update: WidgetCallback, } + +#[derive(Clone, Default, Derivative, Serialize, Deserialize, WidgetBuilder, specta::Type)] +#[derivative(Debug, PartialEq)] +pub struct PivotInput { + #[widget_builder(constructor)] + pub position: PivotPosition, + + pub disabled: bool, + + // Callbacks + #[serde(skip)] + #[derivative(Debug = "ignore", PartialEq = "ignore")] + pub on_update: WidgetCallback, +} + +#[derive(Clone, Copy, Serialize, Deserialize, Debug, Default, PartialEq, Eq, specta::Type)] +pub enum PivotPosition { + #[default] + None, + TopLeft, + TopCenter, + TopRight, + CenterLeft, + Center, + CenterRight, + BottomLeft, + BottomCenter, + BottomRight, +} + +impl From<&str> for PivotPosition { + fn from(input: &str) -> Self { + match input { + "None" => PivotPosition::None, + "TopLeft" => PivotPosition::TopLeft, + "TopCenter" => PivotPosition::TopCenter, + "TopRight" => PivotPosition::TopRight, + "CenterLeft" => PivotPosition::CenterLeft, + "Center" => PivotPosition::Center, + "CenterRight" => PivotPosition::CenterRight, + "BottomLeft" => PivotPosition::BottomLeft, + "BottomCenter" => PivotPosition::BottomCenter, + "BottomRight" => PivotPosition::BottomRight, + _ => panic!("Failed parsing unrecognized PivotPosition enum value '{input}'"), + } + } +} + +impl From for Option { + fn from(input: PivotPosition) -> Self { + match input { + PivotPosition::None => None, + PivotPosition::TopLeft => Some(DVec2::new(0., 0.)), + PivotPosition::TopCenter => Some(DVec2::new(0.5, 0.)), + PivotPosition::TopRight => Some(DVec2::new(1., 0.)), + PivotPosition::CenterLeft => Some(DVec2::new(0., 0.5)), + PivotPosition::Center => Some(DVec2::new(0.5, 0.5)), + PivotPosition::CenterRight => Some(DVec2::new(1., 0.5)), + PivotPosition::BottomLeft => Some(DVec2::new(0., 1.)), + PivotPosition::BottomCenter => Some(DVec2::new(0.5, 1.)), + PivotPosition::BottomRight => Some(DVec2::new(1., 1.)), + } + } +} + +impl From for PivotPosition { + fn from(input: DVec2) -> Self { + const TOLERANCE: f64 = 1e-5_f64; + if input.y.abs() < TOLERANCE { + if input.x.abs() < TOLERANCE { + return PivotPosition::TopLeft; + } else if (input.x - 0.5).abs() < TOLERANCE { + return PivotPosition::TopCenter; + } else if (input.x - 1.).abs() < TOLERANCE { + return PivotPosition::TopRight; + } + } else if (input.y - 0.5).abs() < TOLERANCE { + if input.x.abs() < TOLERANCE { + return PivotPosition::CenterLeft; + } else if (input.x - 0.5).abs() < TOLERANCE { + return PivotPosition::Center; + } else if (input.x - 1.).abs() < TOLERANCE { + return PivotPosition::CenterRight; + } + } else if (input.y - 1.).abs() < TOLERANCE { + if input.x.abs() < TOLERANCE { + return PivotPosition::BottomLeft; + } else if (input.x - 0.5).abs() < TOLERANCE { + return PivotPosition::BottomCenter; + } else if (input.x - 1.).abs() < TOLERANCE { + return PivotPosition::BottomRight; + } + } + PivotPosition::None + } +} diff --git a/editor/src/messages/layout/utility_types/widgets/mod.rs b/editor/src/messages/layout/utility_types/widgets/mod.rs index d388b080..92202963 100644 --- a/editor/src/messages/layout/utility_types/widgets/mod.rs +++ b/editor/src/messages/layout/utility_types/widgets/mod.rs @@ -1,4 +1,3 @@ -pub mod assist_widgets; pub mod button_widgets; pub mod input_widgets; pub mod label_widgets; 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 8ff27496..cf8034cf 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 @@ -1181,8 +1181,8 @@ pub fn transform_properties(document_node: &DocumentNode, node_id: NodeId, _cont { widgets.push(Separator::new(SeparatorType::Unrelated).widget_holder()); widgets.push( - PivotAssist::new(pivot.into()) - .on_update(update_value(|pivot: &PivotAssist| TaggedValue::DVec2(Into::>::into(pivot.position).unwrap()), node_id, 5)) + PivotInput::new(pivot.into()) + .on_update(update_value(|pivot: &PivotInput| TaggedValue::DVec2(Into::>::into(pivot.position).unwrap()), node_id, 5)) .widget_holder(), ); } else { diff --git a/editor/src/messages/portfolio/document/properties_panel/utility_functions.rs b/editor/src/messages/portfolio/document/properties_panel/utility_functions.rs index e23dd700..471216fe 100644 --- a/editor/src/messages/portfolio/document/properties_panel/utility_functions.rs +++ b/editor/src/messages/portfolio/document/properties_panel/utility_functions.rs @@ -167,8 +167,8 @@ fn node_section_transform(layer: &Layer, persistent_data: &PersistentData) -> La widgets: vec![ TextLabel::new("Location").widget_holder(), Separator::new(SeparatorType::Unrelated).widget_holder(), - PivotAssist::new(layer.pivot.into()) - .on_update(|pivot_assist: &PivotAssist| PropertiesPanelMessage::SetPivot { new_position: pivot_assist.position }.into()) + PivotInput::new(layer.pivot.into()) + .on_update(|pivot_input: &PivotInput| PropertiesPanelMessage::SetPivot { new_position: pivot_input.position }.into()) .widget_holder(), Separator::new(SeparatorType::Unrelated).widget_holder(), NumberInput::new(Some(layer.transform.x() + pivot.x)) diff --git a/editor/src/messages/tool/tool_messages/select_tool.rs b/editor/src/messages/tool/tool_messages/select_tool.rs index 00ff57c1..ee3330d8 100644 --- a/editor/src/messages/tool/tool_messages/select_tool.rs +++ b/editor/src/messages/tool/tool_messages/select_tool.rs @@ -116,8 +116,8 @@ impl SelectTool { // } fn pivot_widget(&self, disabled: bool) -> WidgetHolder { - PivotAssist::new(self.tool_data.pivot.to_pivot_position()) - .on_update(|pivot_assist: &PivotAssist| SelectToolMessage::SetPivot { position: pivot_assist.position }.into()) + PivotInput::new(self.tool_data.pivot.to_pivot_position()) + .on_update(|pivot_input: &PivotInput| SelectToolMessage::SetPivot { position: pivot_input.position }.into()) .disabled(disabled) .widget_holder() } diff --git a/editor/src/messages/tool/utility_types.rs b/editor/src/messages/tool/utility_types.rs index 62199017..3f6841d5 100644 --- a/editor/src/messages/tool/utility_types.rs +++ b/editor/src/messages/tool/utility_types.rs @@ -140,7 +140,7 @@ impl DocumentToolData { pub fn update_working_colors(&self, responses: &mut VecDeque) { let layout = WidgetLayout::new(vec![ LayoutGroup::Row { - widgets: vec![SwatchPairInput::new(self.primary_color, self.secondary_color).widget_holder()], + widgets: vec![WorkingColorsButton::new(self.primary_color, self.secondary_color).widget_holder()], }, LayoutGroup::Row { widgets: vec![ diff --git a/frontend/src/components/Editor.svelte b/frontend/src/components/Editor.svelte index e1b7da85..08d7853e 100644 --- a/frontend/src/components/Editor.svelte +++ b/frontend/src/components/Editor.svelte @@ -272,10 +272,10 @@ .popover-button, .color-button > button, .color-picker .preset-color, - .swatch-pair .swatch > button, + .working-colors-button .swatch > button, .radio-input button, .menu-list, - .menu-bar-input .entry, + .menu-list-button .entry, .layer-tree .expand-arrow, .widget-section .header { &:focus-visible { diff --git a/frontend/src/components/README.md b/frontend/src/components/README.md index bbb22bc0..bcf02e63 100644 --- a/frontend/src/components/README.md +++ b/frontend/src/components/README.md @@ -4,7 +4,7 @@ Each component represents a (usually reusable) part of the Graphite editor GUI. ## Floating Menus: `floating-menus/` -The temporary UI areas with dark backgrounds which hover over the top of the editor window content. Examples include popovers, dropdown menu selectors, and dialog modals. +The temporary UI areas with dark backgrounds which hover over the top of the editor window content. Examples include menu lists, popovers, and dialogs. ## Layout: `layout/` diff --git a/frontend/src/components/floating-menus/ColorPicker.svelte b/frontend/src/components/floating-menus/ColorPicker.svelte index e34185d3..7a311ac2 100644 --- a/frontend/src/components/floating-menus/ColorPicker.svelte +++ b/frontend/src/components/floating-menus/ColorPicker.svelte @@ -319,7 +319,7 @@ RGB - {#each rgbChannels as [channel, strength], index (channel)} + {#each rgbChannels as [channel, strength], index} {#if index > 0} {/if} @@ -343,7 +343,7 @@ > - {#each hsvChannels as [channel, strength], index (channel)} + {#each hsvChannels as [channel, strength], index} {#if index > 0} {/if} diff --git a/frontend/src/components/floating-menus/DialogModal.svelte b/frontend/src/components/floating-menus/Dialog.svelte similarity index 84% rename from frontend/src/components/floating-menus/DialogModal.svelte rename to frontend/src/components/floating-menus/Dialog.svelte index 0fdd0f8a..4394baa8 100644 --- a/frontend/src/components/floating-menus/DialogModal.svelte +++ b/frontend/src/components/floating-menus/Dialog.svelte @@ -26,7 +26,7 @@ - + @@ -39,11 +39,11 @@ {/if} {#if $dialog.panicDetails}
-
The editor crashed — sorry about that
-
Please report this by filing an issue on GitHub:
-
window.open(githubUrl($dialog.panicDetails), "_blank")} />
-
Reload the editor to continue. If this occurs
immediately on repeated reloads, clear storage:
-
+
The editor crashed — sorry about that
+
Please report this by filing an issue on GitHub:
+
window.open(githubUrl($dialog.panicDetails), "_blank")} />
+
Reload the editor to continue. If this occurs
immediately on repeated reloads, clear storage:
+
diff --git a/frontend/src/components/widgets/buttons/TextButton.svelte b/frontend/src/components/widgets/buttons/TextButton.svelte index ff15e314..96987070 100644 --- a/frontend/src/components/widgets/buttons/TextButton.svelte +++ b/frontend/src/components/widgets/buttons/TextButton.svelte @@ -88,12 +88,12 @@ } } - .widget-row > & + .text-button, + .widget-span.row > & + .text-button, .layout-row > & + .text-button { margin-left: 8px; } - .widget-column > & + .text-button, + .widget-span.column > & + .text-button, .layout-column > & + .text-button { margin-top: 8px; } diff --git a/frontend/src/components/widgets/inputs/SwatchPairInput.svelte b/frontend/src/components/widgets/buttons/WorkingColorsButton.svelte similarity index 97% rename from frontend/src/components/widgets/inputs/SwatchPairInput.svelte rename to frontend/src/components/widgets/buttons/WorkingColorsButton.svelte index ab38c99e..b2add999 100644 --- a/frontend/src/components/widgets/inputs/SwatchPairInput.svelte +++ b/frontend/src/components/widgets/buttons/WorkingColorsButton.svelte @@ -35,7 +35,7 @@ } - + @@ -27,7 +27,7 @@