From 3c628b5c01966dd7fb709224cce38f663af58caf Mon Sep 17 00:00:00 2001
From: chenshenhai <cshenhai@gmail.com>
Date: Thu, 15 Jul 2021 12:44:30 +0800
Subject: [PATCH] fix: @idraw/core select element list

---
 docs/todo/board.md                               |  2 +-
 docs/todo/idraw.md                               |  2 +-
 packages/board/src/lib/context.ts                |  4 ++++
 packages/core/examples/features/lib/data/rect.js |  4 ++--
 packages/core/examples/features/lib/main.js      |  2 +-
 packages/core/src/lib/helper.ts                  | 16 +++++++++++-----
 packages/types/src/lib/context.ts                |  1 +
 7 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/docs/todo/board.md b/docs/todo/board.md
index 1179cc0..6b08cd5 100644
--- a/docs/todo/board.md
+++ b/docs/todo/board.md
@@ -1,4 +1,4 @@
 # @idraw/board
 
-* [] Calculate screen position to context position
+* [x] Calculate screen position to context position
 * [x] Reset board's size
\ No newline at end of file
diff --git a/docs/todo/idraw.md b/docs/todo/idraw.md
index 8169864..0d96033 100644
--- a/docs/todo/idraw.md
+++ b/docs/todo/idraw.md
@@ -1,6 +1,6 @@
 # idraw
 
-* BUG: Undo/Redo need trigger "changeData" event
+* [] BUG: Undo/Redo need trigger "changeData" event
 * Export
   * [] Export image
   * [] Source file
diff --git a/packages/board/src/lib/context.ts b/packages/board/src/lib/context.ts
index f0b3ab3..bf0a136 100644
--- a/packages/board/src/lib/context.ts
+++ b/packages/board/src/lib/context.ts
@@ -139,6 +139,10 @@ class Context implements TypeContext {
     return this._ctx.isPointInPath(this._doX(x), this._doY(y));
   }
 
+  isPointInPathWithoutScroll(x: number, y: number) {
+    return this._ctx.isPointInPath(this._doSize(x), this._doSize(y));
+  }
+
   setStrokeStyle(color: string) {
     this._ctx.strokeStyle = color;
   }
diff --git a/packages/core/examples/features/lib/data/rect.js b/packages/core/examples/features/lib/data/rect.js
index a3b6bb4..5ee357f 100644
--- a/packages/core/examples/features/lib/data/rect.js
+++ b/packages/core/examples/features/lib/data/rect.js
@@ -1,5 +1,5 @@
 const data = {
-  // bgColor: '#ffffff',
+  bgColor: '#f0f0f0',
   elements: [
     {
       name: "rect-001",
@@ -56,7 +56,7 @@ const data = {
       desc: {
         color: "#e0e0e0",
         borderRadius: 20,
-        borderWidth: 10,
+        borderWidth: 2,
         borderColor: "#bd0b64",
       },
     },
diff --git a/packages/core/examples/features/lib/main.js b/packages/core/examples/features/lib/main.js
index 440b53a..dfb3d6f 100644
--- a/packages/core/examples/features/lib/main.js
+++ b/packages/core/examples/features/lib/main.js
@@ -8,7 +8,7 @@ const data = getData();
 const mount = document.querySelector('#mount');
 
 const defaultConf = {
-  scale: 1,
+  scale: 0.5,
   scrollX: 0,
   scrollY: 0,
 };
diff --git a/packages/core/src/lib/helper.ts b/packages/core/src/lib/helper.ts
index a174225..0580400 100644
--- a/packages/core/src/lib/helper.ts
+++ b/packages/core/src/lib/helper.ts
@@ -149,14 +149,20 @@ export class Helper implements TypeHelper {
   }
 
   calcSelectedElements(data: TypeData) {
+    const transform = this._ctx.getTransform();
+    const { scale = 1, scrollX = 0, scrollY = 0 } = transform;
     const start = this._areaStart;
     const end = this._areaEnd;
-    const x = Math.min(start.x, end.x);
-    const y = Math.min(start.y, end.y);
-    const w = Math.abs(end.x - start.x);
-    const h = Math.abs(end.y - start.y);
+    const x = (Math.min(start.x, end.x) - scrollX) / scale;
+    const y = (Math.min(start.y, end.y) - scrollY) / scale;
+    const w = Math.abs(end.x - start.x) / scale;
+    const h = Math.abs(end.y - start.y) / scale;
     const uuids: string[] = [];
     const ctx = this._ctx;
+
+    console.log({x, y, w, h}, start, end);
+    console.log(this._board.getTransform());
+
     ctx.beginPath();
     ctx.moveTo(x, y);
     ctx.lineTo(x + w, y);
@@ -168,7 +174,7 @@ export class Helper implements TypeHelper {
     data.elements.forEach((elem) => {
       const centerX = elem.x + elem.w / 2;
       const centerY = elem.y + elem.h / 2;
-      if (ctx.isPointInPath(centerX, centerY)) {
+      if (ctx.isPointInPathWithoutScroll(centerX, centerY)) {
         uuids.push(elem.uuid);
       }
     });
diff --git a/packages/types/src/lib/context.ts b/packages/types/src/lib/context.ts
index 6ff289a..9253b0c 100644
--- a/packages/types/src/lib/context.ts
+++ b/packages/types/src/lib/context.ts
@@ -33,6 +33,7 @@ interface TypeContext {
   setLineWidth(w: number): void;
   setLineDash(nums: number[]): void;
   isPointInPath(x: number, y: number): boolean;
+  isPointInPathWithoutScroll(x: number, y: number): boolean;
   setStrokeStyle(color: string): void;
   stroke(): void;
   translate(x: number, y: number): void;