From be7e219143d14b61677e7b6aa1d0719eccbf0f4a Mon Sep 17 00:00:00 2001
From: Tangent Chang <andy23512@gmail.com>
Date: Sat, 11 May 2024 18:42:42 +0800
Subject: [PATCH] feat: highlight 3d press

---
 src/app/components/switch/switch.component.html |  9 +++++++++
 src/app/pages/home-page/home-page.component.ts  | 10 +++++-----
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/app/components/switch/switch.component.html b/src/app/components/switch/switch.component.html
index fb25e76..1a480e9 100644
--- a/src/app/components/switch/switch.component.html
+++ b/src/app/components/switch/switch.component.html
@@ -9,6 +9,15 @@
     [highlightKey]="highlightKey()"
   ></svg:g>
 }
+<svg:circle
+  class="fill-alnitak-500"
+  [attr.cx]="center().x"
+  [attr.cy]="center().y"
+  [attr.r]="53.68"
+  [attr.opacity]="
+    highlightKey()?.positionCodes?.includes(positionCodeMap().c) ? 0.5 : 0
+  "
+></svg:circle>
 <svg:text
   [attr.x]="center().x"
   [attr.y]="center().y"
diff --git a/src/app/pages/home-page/home-page.component.ts b/src/app/pages/home-page/home-page.component.ts
index cb4f793..fadf212 100644
--- a/src/app/pages/home-page/home-page.component.ts
+++ b/src/app/pages/home-page/home-page.component.ts
@@ -32,11 +32,11 @@ export class HomePageComponent {
   readonly router = inject(Router);
   firstLessonUrl = '/topic/number/lesson/123';
   highlightPositionCodes: number[] = [
-    [-1, -1, 1, 3],
-    [-1, -1, 2, 4],
-    [-1, -1, 6, 8],
-    [-1, -1, 7, 9],
-  ].map((list) => pickRandomItem(list));
+    [0, 1, 2, 3, 4, [1, 2], [1, 4], [3, 2], [3, 4]],
+    [5, 6, 7, 8, 9, [6, 7], [6, 9], [8, 7], [8, 9]],
+  ]
+    .map((list) => pickRandomItem(list))
+    .flat();
 
   @HostBinding('class') classes = 'block relative h-full';