Add a "Cyclic" gradient option that closes the ramp into a seamless loop (#4416)

* Add a Cyclic gradient attribute that wraps the stop list through the 1|0 boundary back to the first stop

* Show the wrap segment's midpoint diamond in the color picker spectrum strip when cyclic

* Keep the wrap midpoint diamond tracking the pointer by a wrapped strip width when dragged past the ends

* Give the Gradient tool's viewport overlay the same cyclic wrap midpoint diamond and drag behavior

* Correct the docs claiming the final stop's midpoint is always ignored now that cyclic uses it

* Move the gradient cyclic toggle onto the Ends row as a Link icon checkbox

* Update labels

* Register GradientHueDirection with the Data panel so its attribute column renders

* Reword wrap segment to wrapped interval and stray segment usages to interval

* Clean up comments

* Fix the color picker write-back losing default position elision and the blend path guessing the cyclic flag

node-graph/nodes/math/src/lib.rs

@@ -11,7 +11,9 @@ use math_parser::value::{Number, Value};
 use rand::{Rng, SeedableRng};
 use std::ops::{Add, Mul, Rem, Sub};
 use vector_types::Gradient;
-use vector_types::markers::{GradientForm as GradientFormAttr, GradientHueDirection as GradientHueDirectionAttr, GradientSpace as GradientSpaceAttr, GradientSpread as GradientSpreadAttr};
+use vector_types::markers::{
+	GradientCyclic as GradientCyclicAttr, GradientForm as GradientFormAttr, GradientHueDirection as GradientHueDirectionAttr, GradientSpace as GradientSpaceAttr, GradientSpread as GradientSpreadAttr,
+};
 
 /// The struct that stores the context for the maths parser.
 /// This is currently just limited to supplying `a` and `b` until we add better node graph support and UI for variadic inputs.
@@ -1238,7 +1240,7 @@ fn gradient_positions(_: impl Ctx, mut gradient: Gradient, positions: IList<f64>
 
 /// Sets the interpolation midpoint for each interval between gradient stops, a factor from 0 to 1 where the 0.5 default means linear interpolation and another value skews the transition speed toward one stop or the other.
 ///
-/// The final stop belongs to no interval so its midpoint is ignored.
+/// The final stop's midpoint controls the wrap back around to the first stop when the gradient is cyclic, and is otherwise ignored.
 ///
 /// A list shorter than the stop count repeats its last value, a longer list is truncated, and an empty list sets each midpoint to its default of 0.5.
 #[node_macro::node(category("Gradient"))]
@@ -1264,7 +1266,8 @@ fn sample_gradient(
 	let gradient_spread = gradient.lane(0).attr::<GradientSpreadAttr>();
 	let gradient_space = gradient.lane(0).attr::<GradientSpaceAttr>();
 	let gradient_hue_direction = gradient.lane(0).attr::<GradientHueDirectionAttr>();
-	Ok(gradient.element_ref(0).evaluate(position, gradient_spread, gradient_space, gradient_hue_direction))
+	let gradient_cyclic = gradient.lane(0).attr::<GradientCyclicAttr>();
+	Ok(gradient.element_ref(0).evaluate(position, gradient_spread, gradient_cyclic, gradient_space, gradient_hue_direction))
 }
 
 /// Constructs a footprint value which may be set to any transformation of a unit square describing a render area, and a render resolution at least 1x1 integer pixels.

node-graph/nodes/raster/src/blending_nodes.rs

@@ -38,22 +38,21 @@ mod blend_std {
 
 	impl Blend<Color> for Gradient {
 		// TODO: This joining is unfaithful in several ways: it samples only at stop positions so midpoint curves flatten away;
-		// it evaluates both sources with the default spread and space rather than their own attributes (which this
-		// element-level impl cannot read); and the output keeps over's attributes despite being sampled in the default space
+		// TODO: it evaluates both sources with default whole-ramp attributes rather than their own (which this element-level impl cannot read);
+		// TODO: and the output keeps over's attributes despite being sampled with defaults
 		fn blend(&self, under: &Self, blend_fn: impl Fn(Color, Color) -> Color) -> Self {
-			let mut combined_stops = self.positions().into_iter().chain(under.positions()).collect::<Vec<_>>();
+			let mut combined_stops = self.positions(false).into_iter().chain(under.positions(false)).collect::<Vec<_>>();
 			combined_stops.sort_by(|a, b| a.partial_cmp(b).unwrap_or(Ordering::Equal));
 			combined_stops.dedup_by(|a, b| (*a - *b).abs() < 1e-6);
 			let stops = combined_stops.into_iter().map(|position| {
-				let over_color = self.evaluate(position, Default::default(), Default::default(), Default::default());
-				let under_color = under.evaluate(position, Default::default(), Default::default(), Default::default());
+				let over_color = self.evaluate(position, Default::default(), false, Default::default(), Default::default());
+				let under_color = under.evaluate(position, Default::default(), false, Default::default(), Default::default());
 				let color = blend_fn(over_color, under_color);
 				GradientStop { position, midpoint: 0.5, color }
 			});
 
-			let mut gradient = Gradient::new(stops);
-			gradient.elide_default_attributes();
-			gradient
+			// Positions stay explicit because eliding them needs the cyclic flag this impl can't read, and a wrong guess would relocate the stops
+			Gradient::new(stops)
 		}
 	}
 }

node-graph/nodes/raster/src/gradient_map.rs

@@ -26,12 +26,13 @@ fn gradient_map<T: Adjust<Color> + Clone + Send + Sync + core_types::CacheHash +
 	let gradient_spread = gradient.lane(0).attr::<vector_types::markers::GradientSpread>();
 	let gradient_space = gradient.lane(0).attr::<vector_types::markers::GradientSpace>();
 	let gradient_hue_direction = gradient.lane(0).attr::<vector_types::markers::GradientHueDirection>();
+	let gradient_cyclic = gradient.lane(0).attr::<vector_types::markers::GradientCyclic>();
 	let gradient = gradient.element_ref(0);
 
 	image.adjust(|color| {
 		let intensity = color.luminance_rec_709();
 		let intensity = if reverse { 1. - intensity } else { intensity };
-		gradient.evaluate(intensity as f64, gradient_spread, gradient_space, gradient_hue_direction)
+		gradient.evaluate(intensity as f64, gradient_spread, gradient_cyclic, gradient_space, gradient_hue_direction)
 	});
 
 	image

node-graph/nodes/vector/src/vector_nodes.rs

@@ -47,6 +47,7 @@ use vector_types::vector::{PointDomain, RegionDomain};
 /// randomized draws up to it.
 fn assign_color_at(
 	gradient: &Gradient,
+	gradient_cyclic: bool,
 	gradient_space: vector_types::GradientSpace,
 	gradient_hue_direction: vector_types::GradientHueDirection,
 	position: usize,
@@ -70,7 +71,7 @@ fn assign_color_at(
 			_ => position as f64 % repeat_every as f64 / (repeat_every - 1) as f64,
 		},
 	};
-	gradient.evaluate(factor, Default::default(), gradient_space, gradient_hue_direction)
+	gradient.evaluate(factor, Default::default(), gradient_cyclic, gradient_space, gradient_hue_direction)
 }
 
 /// Uniquely sets the fill and/or stroke style of every vector element to individual colors sampled along a chosen gradient.
@@ -113,6 +114,7 @@ fn assign_colors<'e>(
 	if gradient.is_empty() {
 		return Ok((content.lane(lane).map_element(element), Attr(existing_fill), Attr(existing_stroke)));
 	}
+	let gradient_cyclic = gradient.lane(0).attr::<vector_types::markers::GradientCyclic>();
 	let gradient_space = gradient.lane(0).attr::<vector_types::markers::GradientSpace>();
 	let gradient_hue_direction = gradient.lane(0).attr::<vector_types::markers::GradientHueDirection>();
 	let gradient_element = gradient.element_ref(0);
@@ -125,7 +127,17 @@ fn assign_colors<'e>(
 		false => gradient_element,
 	};
 
-	let color = assign_color_at(gradient_element, gradient_space, gradient_hue_direction, lane, content.len(), randomize, seed, repeat_every);
+	let color = assign_color_at(
+		gradient_element,
+		gradient_cyclic,
+		gradient_space,
+		gradient_hue_direction,
+		lane,
+		content.len(),
+		randomize,
+		seed,
+		repeat_every,
+	);
 	let paint = List::new_from_element(color).into_graphic_list();
 	let parked = park_paint(ctx.arena(), paint)?;
 
@@ -183,6 +195,7 @@ fn assign_colors_graphic<'e>(
 	if gradient.is_empty() {
 		return Ok(content.lane(lane).map_element(original.clone()));
 	}
+	let gradient_cyclic = gradient.lane(0).attr::<vector_types::markers::GradientCyclic>();
 	let gradient_space = gradient.lane(0).attr::<vector_types::markers::GradientSpace>();
 	let gradient_hue_direction = gradient.lane(0).attr::<vector_types::markers::GradientHueDirection>();
 	let gradient_element = gradient.element_ref(0);
@@ -230,7 +243,17 @@ fn assign_colors_graphic<'e>(
 		Some(mut rows) => {
 			for row in 0..rows.len() {
 				let has_stroke = rows.element(row).is_some_and(|vector| vector.stroke.is_some());
-				let color = assign_color_at(gradient_element, gradient_space, gradient_hue_direction, position + row, length, randomize, seed, repeat_every);
+				let color = assign_color_at(
+					gradient_element,
+					gradient_cyclic,
+					gradient_space,
+					gradient_hue_direction,
+					position + row,
+					length,
+					randomize,
+					seed,
+					repeat_every,
+				);
 				let paint = List::new_from_element(color).into_graphic_list();
 				if fill {
 					set_paint_attribute_at(&mut rows, row, ATTR_FILL, paint.clone());