Added ability to render single dot clicks (#235)

* Added ability to render single dot clicks

* reduce stroke continuity stage timeout

Reduce the amount of time between "separate" stroke detection

* reduce stroke distance check

Author: Aaronontheweb

src/DrawTogether.Actors/Local/StrokeContinuityStage.cs

@@ -24,7 +24,7 @@ public class StrokeContinuityStage : GraphStage<
 {
     private readonly TimeSpan _userInactivityTimeout;
     private const string UserInactivityTimeout = "user-inactivity-timeout";
-    private readonly TimeSpan _strokeDisconnectTimeout = TimeSpan.FromSeconds(1);
+    private readonly TimeSpan _strokeDisconnectTimeout = TimeSpan.FromMilliseconds(200);
 
     // Shape definition for this stage
     public override FlowShape<ImmutableList<LocalPaintProtocol.IPaintSessionMessage>, IEnumerable<ConnectedStroke>>
@@ -161,7 +161,7 @@ private IEnumerable<ConnectedStroke> ProcessBatch(ImmutableList<LocalPaintProtoc
                         // something unusual happened (e.g., user clicked somewhere else) - no need for continuity
                         var distance = CalculateDistance(activeInfo.LastPoint, pointsToAdd[0]);
 
-                        if (distance <= 500.0) // Threshold for what we consider "continuous"
+                        if (distance <= 50.0) // Threshold for what we consider "continuous"
                         {
                             // For perfect continuity, replace the first point with the last point from previous stroke
                             // This ensures there's not even a sub-pixel gap between strokes

src/DrawTogether/Components/Draw/DrawingSurface.razor

@@ -40,10 +40,22 @@
 
             @foreach (var stroke in Strokes)
             {
-                <Curve 
-                    Points="@stroke.Value.Points" 
-                    Stroke="@stroke.Value.StrokeColor.HexCodeOrColorName" 
-                    StrokeWidth="@stroke.Value.StrokeWidth.Value"/>
+                @if (stroke.Value.Points.Count == 1)
+                {
+                    <!-- Render single-point strokes as circles (dots) -->
+                    <circle cx="@stroke.Value.Points[0].X" 
+                            cy="@stroke.Value.Points[0].Y" 
+                            r="@(stroke.Value.StrokeWidth.Value / 2.0)" 
+                            fill="@stroke.Value.StrokeColor.HexCodeOrColorName" />
+                }
+                else
+                {
+                    <!-- Render multi-point strokes as curves -->
+                    <Curve 
+                        Points="@stroke.Value.Points" 
+                        Stroke="@stroke.Value.StrokeColor.HexCodeOrColorName" 
+                        StrokeWidth="@stroke.Value.StrokeWidth.Value"/>
+                }
             }
         </g>
     </svg>

tests/DrawTogether.Tests/SingleDotStrokeTests.cs

@@ -0,0 +1,88 @@
+using DrawTogether.Entities;
+using DrawTogether.Entities.Drawings;
+using DrawTogether.Entities.Users;
+using FluentAssertions;
+using Xunit;
+
+namespace DrawTogether.Tests;
+
+public class SingleDotStrokeTests
+{
+    [Fact]
+    public void Should_Detect_Single_Point_Stroke()
+    {
+        // Arrange
+        var strokeId = new StrokeId(1);
+        var point = new Point(100, 200);
+        var strokeWidth = new GreaterThanZeroInteger(5);
+        var color = new Color("#FF0000");
+        
+        var singlePointStroke = new ConnectedStroke(strokeId)
+        {
+            Points = [point],
+            StrokeWidth = strokeWidth,
+            StrokeColor = color
+        };
+        
+        // Act & Assert
+        singlePointStroke.Points.Should().HaveCount(1);
+        singlePointStroke.Points[0].Should().Be(point);
+        singlePointStroke.StrokeWidth.Should().Be(strokeWidth);
+        singlePointStroke.StrokeColor.Should().Be(color);
+    }
+    
+    [Fact]
+    public void Should_Distinguish_Single_Point_From_Multi_Point_Strokes()
+    {
+        // Arrange
+        var strokeId1 = new StrokeId(1);
+        var strokeId2 = new StrokeId(2);
+        
+        var singlePointStroke = new ConnectedStroke(strokeId1)
+        {
+            Points = [new Point(100, 200)],
+            StrokeWidth = new GreaterThanZeroInteger(3),
+            StrokeColor = new Color("#00FF00")
+        };
+        
+        var multiPointStroke = new ConnectedStroke(strokeId2)
+        {
+            Points = [new Point(100, 200), new Point(150, 250)],
+            StrokeWidth = new GreaterThanZeroInteger(3),
+            StrokeColor = new Color("#0000FF")
+        };
+        
+        // Act & Assert
+        singlePointStroke.Points.Should().HaveCount(1);
+        multiPointStroke.Points.Should().HaveCount(2);
+        
+        // This simulates the rendering logic decision
+        var shouldRenderAsCircle1 = singlePointStroke.Points.Count == 1;
+        var shouldRenderAsCircle2 = multiPointStroke.Points.Count == 1;
+        
+        shouldRenderAsCircle1.Should().BeTrue();
+        shouldRenderAsCircle2.Should().BeFalse();
+    }
+    
+    [Fact]
+    public void Should_Calculate_Correct_Circle_Radius_For_Single_Point_Stroke()
+    {
+        // Arrange
+        var strokeWidth = new GreaterThanZeroInteger(10);
+        var expectedRadius = strokeWidth.Value / 2.0;
+        
+        var singlePointStroke = new ConnectedStroke(new StrokeId(1))
+        {
+            Points = [new Point(50, 75)],
+            StrokeWidth = strokeWidth,
+            StrokeColor = new Color("#FFFF00")
+        };
+        
+        // Act
+        var actualRadius = singlePointStroke.StrokeWidth.Value / 2.0;
+        
+        // Assert
+        actualRadius.Should().Be(expectedRadius);
+        actualRadius.Should().Be(5.0);
+    }
+}