Add the SVG Preview render mode in place of the Vello option in the preferences (#3797)

* Remove Vello from preferences

* Add the Render Mode: SVG Preview radio button

* Remove SVG outline renderer

* Add a tooltip explaination when disabled in unsupported browsers

* Fix Eyedropper tool to support Outline render mode

* Use #[allow(clippy::too_many_arguments)] instead of tuple

* Rerun nodegraph when max render area is changed

---------

Co-authored-by: Dennis Kobert <dennis@kobert.dev>

node-graph/graph-craft/src/wasm_application_io.rs

@@ -336,27 +336,13 @@ pub type WasmSurfaceHandle = SurfaceHandle<wgpu_executor::Window>;
 #[cfg(feature = "wgpu")]
 pub type WasmSurfaceHandleFrame = graphene_application_io::SurfaceHandleFrame<wgpu_executor::Window>;
 
-#[derive(Clone, Copy, Debug, PartialEq, Eq, Hash, specta::Type, serde::Serialize, serde::Deserialize)]
-pub enum VelloPreference {
-	Auto,
-	Disabled,
-}
-
 #[derive(Clone, Debug, PartialEq, Hash, specta::Type, serde::Serialize, serde::Deserialize)]
 pub struct EditorPreferences {
-	pub vello_preference: VelloPreference,
 	/// Maximum render region size in pixels along one dimension of the square area.
 	pub max_render_region_size: u32,
 }
 
 impl graphene_application_io::GetEditorPreferences for EditorPreferences {
-	fn use_vello(&self) -> bool {
-		match self.vello_preference {
-			VelloPreference::Auto => wgpu_available().unwrap_or(false),
-			VelloPreference::Disabled => false,
-		}
-	}
-
 	fn max_render_region_area(&self) -> u32 {
 		let size = self.max_render_region_size.min(u32::MAX.isqrt());
 		size.pow(2)
@@ -365,10 +351,7 @@ impl graphene_application_io::GetEditorPreferences for EditorPreferences {
 
 impl Default for EditorPreferences {
 	fn default() -> Self {
-		Self {
-			vello_preference: VelloPreference::Auto,
-			max_render_region_size: 1280,
-		}
+		Self { max_render_region_size: 1280 }
 	}
 }
 

node-graph/graphene-cli/src/main.rs

@@ -126,7 +126,6 @@ async fn main() -> Result<(), Box<dyn Error>> {
 	let device = wgpu_executor_ref.context.device.clone();
 
 	let preferences = EditorPreferences {
-		vello_preference: graph_craft::wasm_application_io::VelloPreference::Auto,
 		max_render_region_size: EditorPreferences::default().max_render_region_size,
 	};
 	let editor_api = Arc::new(WasmEditorApi {

node-graph/libraries/application-io/src/lib.rs

@@ -217,7 +217,6 @@ impl<T: NodeGraphUpdateSender> NodeGraphUpdateSender for std::sync::Mutex<T> {
 }
 
 pub trait GetEditorPreferences {
-	fn use_vello(&self) -> bool;
 	fn max_render_region_area(&self) -> u32;
 }
 
@@ -238,11 +237,11 @@ pub struct TimingInformation {
 pub struct RenderConfig {
 	pub viewport: Footprint,
 	pub scale: f64,
-	pub export_format: ExportFormat,
 	pub time: TimingInformation,
 	pub pointer: DVec2,
 	#[serde(alias = "view_mode")]
 	pub render_mode: RenderMode,
+	pub export_format: ExportFormat,
 	pub hide_artboards: bool,
 	pub for_export: bool,
 	pub for_eyedropper: bool,
@@ -259,10 +258,6 @@ impl NodeGraphUpdateSender for Logger {
 struct DummyPreferences;
 
 impl GetEditorPreferences for DummyPreferences {
-	fn use_vello(&self) -> bool {
-		false
-	}
-
 	fn max_render_region_area(&self) -> u32 {
 		1024 * 1024
 	}

node-graph/libraries/rendering/src/render_ext.rs

@@ -1,9 +1,8 @@
-use crate::renderer::{RenderParams, black_or_white_for_best_contrast, format_transform_matrix};
-use core_types::consts::LAYER_OUTLINE_STROKE_WEIGHT;
+use crate::renderer::{RenderParams, format_transform_matrix};
 use core_types::uuid::generate_uuid;
 use glam::DAffine2;
 use graphic_types::vector_types::gradient::{Gradient, GradientType};
-use graphic_types::vector_types::vector::style::{Fill, PaintOrder, PathStyle, RenderMode, Stroke, StrokeAlign, StrokeCap, StrokeJoin};
+use graphic_types::vector_types::vector::style::{Fill, PaintOrder, PathStyle, Stroke, StrokeAlign, StrokeCap, StrokeJoin};
 use std::fmt::Write;
 
 pub trait RenderExt {
@@ -14,7 +13,7 @@ pub trait RenderExt {
 impl RenderExt for Gradient {
 	type Output = u64;
 
-	// /// Adds the gradient def through mutating the first argument, returning the gradient ID.
+	/// Adds the gradient def through mutating the first argument, returning the gradient ID.
 	fn render(&self, svg_defs: &mut String, element_transform: DAffine2, stroke_transform: DAffine2, bounds: DAffine2, transformed_bounds: DAffine2, _render_params: &RenderParams) -> Self::Output {
 		let mut stop = String::new();
 		for (position, color) in self.stops.0.iter() {
@@ -163,28 +162,12 @@ impl RenderExt for PathStyle {
 	/// Renders the shape's fill and stroke attributes as a string with them concatenated together.
 	#[allow(clippy::too_many_arguments)]
 	fn render(&self, svg_defs: &mut String, element_transform: DAffine2, stroke_transform: DAffine2, bounds: DAffine2, transformed_bounds: DAffine2, render_params: &RenderParams) -> String {
-		let render_mode = render_params.render_mode;
-		match render_mode {
-			RenderMode::Outline => {
-				let fill_attribute = Fill::None.render(svg_defs, element_transform, stroke_transform, bounds, transformed_bounds, render_params);
-
-				let outline_color = black_or_white_for_best_contrast(render_params.artboard_background);
-				let mut outline_stroke = Stroke::new(Some(outline_color), LAYER_OUTLINE_STROKE_WEIGHT);
-				// Outline strokes should be non-scaling by default
-				outline_stroke.non_scaling = true;
-
-				let stroke_attribute = outline_stroke.render(svg_defs, element_transform, stroke_transform, bounds, transformed_bounds, render_params);
-				format!("{fill_attribute}{stroke_attribute}")
-			}
-			_ => {
-				let fill_attribute = self.fill.render(svg_defs, element_transform, stroke_transform, bounds, transformed_bounds, render_params);
-				let stroke_attribute = self
-					.stroke
-					.as_ref()
-					.map(|stroke| stroke.render(svg_defs, element_transform, stroke_transform, bounds, transformed_bounds, render_params))
-					.unwrap_or_default();
-				format!("{fill_attribute}{stroke_attribute}")
-			}
-		}
+		let fill_attribute = self.fill.render(svg_defs, element_transform, stroke_transform, bounds, transformed_bounds, render_params);
+		let stroke_attribute = self
+			.stroke
+			.as_ref()
+			.map(|stroke| stroke.render(svg_defs, element_transform, stroke_transform, bounds, transformed_bounds, render_params))
+			.unwrap_or_default();
+		format!("{fill_attribute}{stroke_attribute}")
 	}
 }

node-graph/libraries/vector-types/src/vector/style.rs

@@ -662,6 +662,6 @@ pub enum RenderMode {
 	Outline,
 	// /// Render with normal coloration at the document resolution, showing the pixels when the current viewport resolution is higher
 	// PixelPreview,
-	// /// Render a preview of how the object would be exported as an SVG.
-	// SvgPreview,
+	/// Render a preview of how the object would be exported as an SVG.
+	SvgPreview,
 }