changed ink masks to have a blur and to allow masks of different colors by adjusting the color value to have no blackness.

1 files changed, 8 insertions, 1 deletions

diff --git a/src/client/util/InteractionUtils.tsx b/src/client/util/InteractionUtils.tsx
index 3cdf4dbd2..9591dbed3 100644
--- a/src/client/util/InteractionUtils.tsx
+++ b/src/client/util/InteractionUtils.tsx
@@ -107,7 +107,8 @@ export namespace InteractionUtils {
         pevents: string,
         opacity: number,
         nodefs: boolean,
-        downHdlr?: (e: React.PointerEvent) => void
+        downHdlr?: (e: React.PointerEvent) => void,
+        mask?: boolean
     ) {
         const pts = shape ? makePolygon(shape, points) : points;
 
@@ -133,6 +134,11 @@ export namespace InteractionUtils {
                 {/* setting the svg fill sets the arrowStart fill */}
                 {nodefs ? null : (
                     <defs>
+                        {!mask ? null : (
+                            <filter id={`mask${defGuid}`} x="-1" y="-1" width="500%" height="500%">
+                                <feGaussianBlur result="blurOut" in="offOut" stdDeviation="5"></feGaussianBlur>
+                            </filter>
+                        )}
                         {arrowStart !== 'dot' && arrowEnd !== 'dot' ? null : (
                             <marker id={`dot${defGuid}`} orient="auto" markerUnits="userSpaceOnUse" refX={0} refY="0" overflow="visible">
                                 <circle r={strokeWidth * arrowWidthFactor} fill="context-stroke" />
@@ -168,6 +174,7 @@ export namespace InteractionUtils {
                     style={{
                         // filter: drawHalo ? "url(#inkSelectionHalo)" : undefined,
                         fill: fill && fill !== 'transparent' ? fill : 'none',
+                        filter: mask ? `url(#mask${defGuid})` : undefined,
                         opacity: 1.0,
                         // opacity: strokeWidth !== width ? 0.5 : undefined,
                         pointerEvents: pevents as any,