From 9a3864e92ca6630bdb95a96a2fe7bf9bcfdd122b Mon Sep 17 00:00:00 2001
From: CrazyTim <impdeveloper@gmail.com>
Date: Tue, 11 Jun 2024 06:36:04 +1000
Subject: [PATCH] Change color of `dragEventHue` and rename debug methods

---
 src/constants.js |  2 +-
 src/wheel.js     | 20 ++++++++++----------
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/constants.js b/src/constants.js
index 3e522a4..c812539 100644
--- a/src/constants.js
+++ b/src/constants.js
@@ -76,5 +76,5 @@ export const Debugging = Object.freeze({
   pointerLineColor: '#ff00ff',
   labelOutlineColor: '#ff00ff',
   labelRadiusColor: '#00ff00',
-  dragEventHue: 200,
+  dragPointHue: 300,
 });
diff --git a/src/wheel.js b/src/wheel.js
index 14540fa..39554ee 100644
--- a/src/wheel.js
+++ b/src/wheel.js
@@ -204,8 +204,8 @@ export class Wheel {
     this.drawBorder(ctx);
     this.drawImage(ctx, this._image, false);
     this.drawImage(ctx, this._overlayImage, true);
-    this.drawPointerLine(ctx);
-    this.drawDragEvents(ctx);
+    this.drawDebugPointerLine(ctx);
+    this.drawDebugDragPoints(ctx);
 
     this._isInitialising = false;
 
@@ -299,7 +299,7 @@ export class Wheel {
 
   }
 
-  drawPointerLine(ctx) {
+  drawDebugPointerLine(ctx) {
 
     if (!this.debug) return;
 
@@ -443,21 +443,21 @@ export class Wheel {
 
   }
 
-  drawDragEvents(ctx) {
+  drawDebugDragPoints(ctx) {
 
     if (!this.debug || !this._dragEvents?.length) return;
 
     const dragEventsReversed = [...this._dragEvents].reverse();
-    const actualLineWidth = this.getScaledNumber(0.5);
-    const actualCircleDiameter = this.getScaledNumber(4);
+    const lineWidth = this.getScaledNumber(0.5);
+    const circleDiameter = this.getScaledNumber(4);
 
     for (const [i, event] of dragEventsReversed.entries()) {
-      const percent = (i / this._dragEvents.length) * 100;
+      const lightnessPercent = (i / this._dragEvents.length) * 100;
       ctx.beginPath();
-      ctx.arc(event.x, event.y, actualCircleDiameter, 0, 2 * Math.PI);
-      ctx.fillStyle = `hsl(${Constants.Debugging.dragEventHue},100%,${percent}%)`;
+      ctx.arc(event.x, event.y, circleDiameter, 0, 2 * Math.PI);
+      ctx.fillStyle = `hsl(${Constants.Debugging.dragPointHue},100%,${lightnessPercent}%)`;
       ctx.strokeStyle = '#000';
-      ctx.lineWidth = actualLineWidth;
+      ctx.lineWidth = lineWidth;
       ctx.fill();
       ctx.stroke();
     }