add content win point on reel

docs/02-setup-main-game/05-main-scene/05-present-win.md

@@ -1,11 +0,0 @@
----
-sidebar_position: 5
----
-
-# Prensent Win
-
-> To be added
-
----
-
-> To be added

docs/02-setup-main-game/05-main-scene/05-win-point-on-reel.md

@@ -0,0 +1,68 @@
+---
+sidebar_position: 5
+---
+
+# Win Point On Reel
+
+## Overview
+
+- Displays win points for each payline, including scatter wins.
+- Shows the win points as the last item on each line.
+
+![Overview](../img/05-main-scene/win-point-on-reel/win-point-overview.png)
+
+## Implementation
+
+### Core Prefabs
+
+| Path | Example |
+|------|---------|
+| `assets\core-assets\hyper-core\packages\on-reel-present-win-point\prefab` | ![Overview](../img/05-main-scene/win-point-on-reel/win-point-core.png) |
+
+### Setup Steps
+
+#### Steps 1.  
+
+- Add the win point on reel prefab to your main scene.
+
+    | Component                       | Description                                         |
+    |----------------------------------|-----------------------------------------------------|
+    | `on-reel-present-win-point`      | Component to **show/hide** points on reels          |
+    | `hyper-present-win-point`        | Manages win point presentation flow                 |
+
+    ![Overview](../img/05-main-scene/win-point-on-reel/win-point-component.png)
+
+#### Steps 2. 
+- Manages the display and animation of win point labels at specific reel positions in the slot game.
+
+    ![Overview](../img/05-main-scene/win-point-on-reel/win-point-node-target-component.png)
+
+    | Property           | Type      | Description                                 |
+    |--------------------|-----------|---------------------------------------------|
+    | `labelPosition`    | `cc.Vec2` | Offset position for the win point label     |
+    | `nodeTarget`       | `cc.Node` | Target node containing the label            |
+    | `cellItemSize`     | `cc.Vec2` | Size of each slot cell                      |
+    | `defaultFontSize`  | `number`  | Default font size for the label             |
+
+#### Steps 3
+
+- Set Up Label
+
+    ![Overview](../img/05-main-scene/win-point-on-reel/win-point-label-component.png)
+
+    - Add `label-point`:            
+        - **Display:** Shows win points on reels.
+        - **Formatting:** Supports number and currency formats for localization.
+
+    - Add Font:                   
+        - Add a custom font asset to the win point component.           
+
+        |           path            |                   example                                     |
+        |---------------------------|---------------------------------------------------------------|
+        |path: `assets\game-assets\fonts\preloads\main-game\fnt-win-point-on-reel`|![Overview](../img/05-main-scene/win-point-on-reel/add-font.png)|
+
+
+
+ ## Game Result Examples
+
+ ![Overview](../img/05-main-scene/win-point-on-reel/win-point-result.png)|