Hide canvas zoom widget automatically when zero

editor/src/document/document_message_handler.rs

@@ -543,8 +543,7 @@ impl DocumentMessageHandler {
 	}
 
 	pub fn update_document_widgets(&self, responses: &mut VecDeque<Message>) {
-		let document_bar_layout = WidgetLayout::new(vec![LayoutGroup::Row {
+		let mut widgets = vec![
-			widgets: vec![
 			WidgetHolder::new(Widget::OptionalInput(OptionalInput {
 				checked: self.snapping_enabled,
 				icon: "Snapping".into(),
@@ -625,22 +624,6 @@ impl DocumentMessageHandler {
 				separator_type: SeparatorType::Section,
 				direction: SeparatorDirection::Horizontal,
 			})),
-				WidgetHolder::new(Widget::NumberInput(NumberInput {
-					unit: "°".into(),
-					value: Some(self.movement_handler.snapped_angle() / (std::f64::consts::PI / 180.)),
-					increment_factor: 15.,
-					on_update: WidgetCallback::new(|number_input: &NumberInput| {
-						MovementMessage::SetCanvasRotation {
-							angle_radians: number_input.value.unwrap() * (std::f64::consts::PI / 180.),
-						}
-						.into()
-					}),
-					..NumberInput::default()
-				})),
-				WidgetHolder::new(Widget::Separator(Separator {
-					separator_type: SeparatorType::Section,
-					direction: SeparatorDirection::Horizontal,
-				})),
 			WidgetHolder::new(Widget::IconButton(IconButton {
 				size: 24,
 				icon: "ZoomIn".into(),
@@ -682,8 +665,40 @@ impl DocumentMessageHandler {
 				increment_callback_increase: WidgetCallback::new(|_| MovementMessage::IncreaseCanvasZoom { center_on_mouse: false }.into()),
 				..NumberInput::default()
 			})),
-			],
+		];
-		}]);
+		let rotation_value = self.movement_handler.snapped_angle() / (std::f64::consts::PI / 180.);
+		if rotation_value.abs() > 0.00001 {
+			widgets.extend([
+				WidgetHolder::new(Widget::Separator(Separator {
+					separator_type: SeparatorType::Related,
+					direction: SeparatorDirection::Horizontal,
+				})),
+				WidgetHolder::new(Widget::NumberInput(NumberInput {
+					unit: "°".into(),
+					value: Some(rotation_value),
+					increment_factor: 15.,
+					on_update: WidgetCallback::new(|number_input: &NumberInput| {
+						MovementMessage::SetCanvasRotation {
+							angle_radians: number_input.value.unwrap() * (std::f64::consts::PI / 180.),
+						}
+						.into()
+					}),
+					..NumberInput::default()
+				})),
+			]);
+		}
+		widgets.extend([
+			WidgetHolder::new(Widget::Separator(Separator {
+				separator_type: SeparatorType::Related,
+				direction: SeparatorDirection::Horizontal,
+			})),
+			WidgetHolder::new(Widget::PopoverButton(PopoverButton {
+				header: "Canvas Navigation".into(),
+				text: "Interactive options in this popover menu are coming soon.\nZoom with Shift + MMB Drag or Ctrl + Scroll Wheel Roll.\nRotate with Ctrl + MMB Drag.".into(),
+				..Default::default()
+			})),
+		]);
+		let document_bar_layout = WidgetLayout::new(vec![LayoutGroup::Row { widgets }]);
 
 		let document_mode_layout = WidgetLayout::new(vec![LayoutGroup::Row {
 			widgets: vec![

frontend/src/App.vue

@@ -207,6 +207,10 @@ img {
 	p {
 		margin-top: 8px;
 	}
+
+	.floating-menu-content h3 ~ p {
+		white-space: pre-wrap;
+	}
 }
 </style>