Merge pull request #528 from tuanchauict/release/alpha/1.2

v1.2.5
tuanchauict · Jun 11, 2023 · ba9a0a3 · ba9a0a3
2 parents fbdb866 + 5653689
commit ba9a0a3
Showing 1 changed file with 25 additions and 19 deletions.
diff --git a/libs/ui-canvas/src/main/kotlin/mono/html/canvas/canvas/InteractionCanvasViewController.kt b/libs/ui-canvas/src/main/kotlin/mono/html/canvas/canvas/InteractionCanvasViewController.kt
@@ -41,6 +41,7 @@ internal class InteractionCanvasViewController(
         mousePointerLiveData.map { it is MousePointer.Drag }.observe(lifecycleOwner) {
             isMouseMoving = it
         }
+        context.imageSmoothingQuality = ImageSmoothingQuality.HIGH
     }
 
     override fun drawInternal() {
@@ -72,41 +73,46 @@ internal class InteractionCanvasViewController(
             return
         }
 
-        val dotPath = Path2D()
-        context.imageSmoothingEnabled = true
-        context.imageSmoothingQuality = ImageSmoothingQuality.HIGH
-        context.beginPath()
-        for (point in bound.interactionPoints) {
-            dotPath.addDot(drawingInfo.toXPx(point.left), drawingInfo.toYPx(point.top))
-        }
-        context.strokeStyle = ThemeColor.SelectionDotStroke.colorCode
-        context.lineWidth = 2.0
-        context.fillStyle = ThemeColor.SelectionDotFill.colorCode
-        context.stroke(dotPath)
-        context.fill(dotPath)
-        context.imageSmoothingEnabled = false
+        bound.interactionPoints.draw(ThemeColor.SelectionDotStroke, ThemeColor.SelectionDotFill)
     }
 
     private fun drawLineInteractionBound(bound: LineInteractionBound) {
         if (isMouseMoving) {
             return
         }
 
+        bound.interactionPoints.draw(
+            ThemeColor.SelectionDotStroke,
+            ThemeColor.SelectionDotFill
+        )
+        // Draw a small dot inside the start dot to make it simpler to distinguish start and end
+        // dots.
+        bound.interactionPoints.take(1)
+            .draw(ThemeColor.SelectionDotStroke, ThemeColor.SelectionDotStroke, 1.0)
+    }
+
+    private fun List<InteractionPoint>.draw(
+        strokeColor: ThemeColor,
+        fillColor: ThemeColor,
+        dotRadius: Double = DOT_RADIUS
+    ) {
         val dotPath = Path2D()
         context.beginPath()
-        for (point in bound.interactionPoints) {
-            dotPath.addDot(drawingInfo.toXPx(point.left), drawingInfo.toYPx(point.top))
+        for (point in this) {
+            dotPath.addDot(drawingInfo.toXPx(point.left), drawingInfo.toYPx(point.top), dotRadius)
         }
-        context.strokeStyle = ThemeColor.SelectionDotStroke.colorCode
+        context.strokeStyle = strokeColor.colorCode
         context.lineWidth = 2.0
-        context.fillStyle = ThemeColor.SelectionDotFill.colorCode
+        context.fillStyle = fillColor.colorCode
+        context.imageSmoothingEnabled = true
         context.stroke(dotPath)
         context.fill(dotPath)
+        context.imageSmoothingEnabled = false
     }
 
-    private fun Path2D.addDot(xPx: Double, yPx: Double) {
+    private fun Path2D.addDot(xPx: Double, yPx: Double, dotRadius: Double) {
         moveTo(xPx, yPx)
-        arc(xPx, yPx, DOT_RADIUS, 0.0, FULL_CIRCLE_ARG)
+        arc(xPx, yPx, dotRadius, 0.0, FULL_CIRCLE_ARG)
     }
 
     fun getInteractionPoint(pointPx: Point): InteractionPoint? {