Fix GPU brush transforms

Author: JimBobSquarePants

src/ImageSharp.Drawing.WebGPU/Shaders/WgslSource/draw_leaf.wgsl

@@ -166,7 +166,13 @@ fn main(
                     var p1 = bitcast<vec2<f32>>(vec2(scene[dd + 3u], scene[dd + 4u]));
                     var r0 = bitcast<f32>(scene[dd + 5u]);
                     var r1 = bitcast<f32>(scene[dd + 6u]);
-                    let user_to_gradient = transform_inverse(transform);
+                    let scale_x = length(transform.matrx.xy);
+                    let scale_y = length(transform.matrx.zw);
+                    let average_scale = 0.5 * (scale_x + scale_y);
+                    p0 = transform_apply(transform, p0);
+                    p1 = transform_apply(transform, p1);
+                    r0 *= average_scale;
+                    r1 *= average_scale;
                     // Output variables
                     var xform = Transform();
                     var focal_x = 0.0;
@@ -177,10 +183,7 @@ fn main(
                         // When the radii are the same, emit a strip gradient
                         kind = RAD_GRAD_KIND_STRIP;
                         let scaled = r0 / distance(p0, p1);
-                        xform = transform_mul(
-                            two_point_to_unit_line(p0, p1),
-                            user_to_gradient
-                        );
+                        xform = two_point_to_unit_line(p0, p1);
                         radius = scaled * scaled;
                     } else {
                         // Assume a two point conical gradient unless the centers
@@ -204,10 +207,7 @@ fn main(
                         focal_x = r0 / (r0 - r1);
                         let cf = (1.0 - focal_x) * p0 + focal_x * p1;
                         radius = r1 / (distance(cf, p1));
-                        let user_to_unit_line = transform_mul(
-                            two_point_to_unit_line(cf, p1),
-                            user_to_gradient
-                        );
+                        let user_to_unit_line = two_point_to_unit_line(cf, p1);
                         var user_to_scaled = user_to_unit_line;
                         // When r == 1.0, focal point is on circle
                         if abs(radius - 1.0) <= GRADIENT_EPSILON {
@@ -241,15 +241,24 @@ fn main(
                 }
                 case DRAWTAG_FILL_ELLIPTIC_GRADIENT: {
                     info[di] = draw_flags;
-                    var center = bitcast<vec2<f32>>(vec2(scene[dd + 1u], scene[dd + 2u]));
-                    var axis_end = bitcast<vec2<f32>>(vec2(scene[dd + 3u], scene[dd + 4u]));
+                    let local_center = bitcast<vec2<f32>>(vec2(scene[dd + 1u], scene[dd + 2u]));
+                    let local_axis_end = bitcast<vec2<f32>>(vec2(scene[dd + 3u], scene[dd + 4u]));
                     let axis_ratio = bitcast<f32>(scene[dd + 5u]);
-                    center = transform_apply(transform, center);
-                    axis_end = transform_apply(transform, axis_end);
+
+                    var center = transform_apply(transform, local_center);
+                    var axis_end = transform_apply(transform, local_axis_end);
                     let dxy = axis_end - center;
                     let axis = length(dxy);
                     let inv_axis = 1.0 / axis;
-                    let inv_second_axis = inv_axis / axis_ratio;
+                    let local_axis = local_axis_end - local_center;
+                    let local_axis_len = length(local_axis);
+                    let local_second_end = local_center + vec2(
+                        (-local_axis.y / local_axis_len) * (local_axis_len * axis_ratio),
+                        (local_axis.x / local_axis_len) * (local_axis_len * axis_ratio));
+                    let second_end = transform_apply(transform, local_second_end);
+                    let second_axis = length(second_end - center);
+                    let transformed_axis_ratio = select(axis_ratio, second_axis / axis, axis > 0.0);
+                    let inv_second_axis = inv_axis / transformed_axis_ratio;
                     let cos_theta = dxy.x * inv_axis;
                     let sin_theta = dxy.y * inv_axis;
                     // Map the ellipse to the unit circle so the fill parameter is length(local_xy).
@@ -268,17 +277,55 @@ fn main(
                 }
                 case DRAWTAG_FILL_SWEEP_GRADIENT: {
                     info[di] = draw_flags;
-                    let p0 = bitcast<vec2<f32>>(vec2(scene[dd + 1u], scene[dd + 2u]));
-                    let xform = transform_mul(transform, Transform(vec4(1.0, 0.0, 0.0, 1.0), p0, vec3(0.0, 0.0, 1.0)));
-                    let inv = transform_inverse(xform);
-                    info[di + 1u] = bitcast<u32>(inv.matrx.x);
-                    info[di + 2u] = bitcast<u32>(inv.matrx.y);
-                    info[di + 3u] = bitcast<u32>(inv.matrx.z);
-                    info[di + 4u] = bitcast<u32>(inv.matrx.w);
-                    info[di + 5u] = bitcast<u32>(inv.translate.x);
-                    info[di + 6u] = bitcast<u32>(inv.translate.y);
-                    info[di + 7u] = scene[dd + 3u];
-                    info[di + 8u] = scene[dd + 4u];
+                    let center = bitcast<vec2<f32>>(vec2(scene[dd + 1u], scene[dd + 2u]));
+                    let t0 = bitcast<f32>(scene[dd + 3u]);
+                    let t1 = bitcast<f32>(scene[dd + 4u]);
+                    let tau = 6.2831855;
+                    let transformed_center = transform_apply(transform, center);
+                    let start_dir = transform_apply(transform, center + vec2(cos(t0 * tau), -sin(t0 * tau)));
+                    let end_dir = transform_apply(transform, center + vec2(cos(t1 * tau), -sin(t1 * tau)));
+                    let start_xy = start_dir - transformed_center;
+                    let end_xy = end_dir - transformed_center;
+                    let transformed_t0 = fract((atan2(-start_xy.y, start_xy.x) / tau) + 1.0);
+                    let transformed_end = fract((atan2(-end_xy.y, end_xy.x) / tau) + 1.0);
+                    let minimum_magnitude = abs(t1 - t0);
+                    let determinant = (transform.matrx.x * transform.matrx.w) - (transform.matrx.y * transform.matrx.z);
+                    var direction_hint = sign(t1 - t0);
+                    if direction_hint == 0.0 {
+                        direction_hint = 1.0;
+                    }
+
+                    if determinant < 0.0 {
+                        direction_hint = -direction_hint;
+                    }
+
+                    var delta = transformed_end - transformed_t0;
+                    if direction_hint >= 0.0 {
+                        while delta < 0.0 {
+                            delta += 1.0;
+                        }
+
+                        if abs(delta) < 1e-6 && minimum_magnitude >= 1.0 - 1e-6 {
+                            delta = 1.0;
+                        }
+                    } else {
+                        while delta > 0.0 {
+                            delta -= 1.0;
+                        }
+
+                        if abs(delta) < 1e-6 && minimum_magnitude >= 1.0 - 1e-6 {
+                            delta = -1.0;
+                        }
+                    }
+
+                    info[di + 1u] = bitcast<u32>(1.0);
+                    info[di + 2u] = bitcast<u32>(0.0);
+                    info[di + 3u] = bitcast<u32>(0.0);
+                    info[di + 4u] = bitcast<u32>(1.0);
+                    info[di + 5u] = bitcast<u32>(-transformed_center.x);
+                    info[di + 6u] = bitcast<u32>(-transformed_center.y);
+                    info[di + 7u] = bitcast<u32>(transformed_t0);
+                    info[di + 8u] = bitcast<u32>(transformed_t0 + delta);
                 }
                 case DRAWTAG_FILL_IMAGE: {
                     info[di] = draw_flags;