Rename

rexrainbow · Nov 30, 2024 · c1774c4 · c1774c4
1 parent 7059370
commit c1774c4
Show file tree

Hide file tree

Showing 8 changed files with 143 additions and 119 deletions.
diff --git a/examples/board-miniboard/drag.js b/examples/board-miniboard/drag.js
@@ -1,16 +1,14 @@
 import phaser from 'phaser/src/phaser.js';
 import BoardPlugin from '../../plugins/board-plugin.js';
 
-const Random = Phaser.Math.Between;
-
 class Demo extends Phaser.Scene {
     constructor() {
         super({
             key: 'examples'
         })
     }
 
-    preload() {}
+    preload() { }
 
     create() {
         var graphics = this.add.graphics({
@@ -29,66 +27,39 @@ class Demo extends Phaser.Scene {
             type: 0
         });
         var mainBoard = this.rexBoard.add.board({
-                grid: grid,
-                width: 8,
-                height: 8
-            })
+            grid: grid,
+            width: 8,
+            height: 8
+        })
             .forEachTileXY(function (tileXY, board) {
                 var points = board.getGridPoints(tileXY.x, tileXY.y, true);
                 graphics.strokePoints(points, true);
             }, this);
 
 
-        var miniBoard = this.rexBoard.add.miniBoard(500, 150, {
-            grid: grid,
-            draggable: true
-        });
+        var map = [
+            '000',
+            '000',
+            '000'
+        ]
+        CreateMiniBoard(this, mainBoard, 500, 150, 0x6495B1, map)
 
         var map = [
-                '0  ',
-                '000',
-                '  0'
-            ],
-            line;
-        for (var i = 0, icnt = map.length; i < icnt; i++) {
-            line = map[i].split('');
-            for (var j = 0, jcnt = line.length; j < jcnt; j++) {
-                if (line[j] !== ' ') {
-                    this.rexBoard.add.shape(miniBoard, j - 1, i - 1, 0, Random(0, 0xffffff));
-                }
-            }
-        }
+            '0  ',
+            '000',
+            '  0'
+        ]
+        CreateMiniBoard(this, mainBoard, 500, 150, 0x669966, map)
+
+
 
-        miniBoard
-            .on('dragstart', function (pointer, dragX, dragY) {
-                this.pullOutFromMainBoard();
-                this.setAlpha(0.3);
-            }, miniBoard)
-            .on('drag', function (pointer, dragX, dragY) {
-                this.setPosition(dragX, dragY);
-                if (this.isOverlapping(mainBoard)) {
-                    this.setAlpha(0.7);
-                    this.alignToMainBoard(mainBoard);
-                } else {
-                    this.setAlpha(0.3);
-                }
-            }, miniBoard)
-            .on('dragend', function (pointer, dragX, dragY) {
-                this.putOnMainBoard(mainBoard);
-                if (this.mainBoard) {
-                    this.setAlpha(1);
-                }
-                console.log(mainBoard.getAllChess())
-            }, miniBoard);
-
-
-        this.miniBoard = miniBoard;
+        this.miniBoard = null;
         this.miniBoardState = this.add.text(20, 20, '');
     }
 
     update() {
         var s;
-        if (this.miniBoard.mainBoard) {
+        if (this.miniBoard) {
             s = '(' + this.miniBoard.tileX + ',' + this.miniBoard.tileY + ')';
         } else {
             s = '--';
@@ -97,6 +68,49 @@ class Demo extends Phaser.Scene {
     }
 }
 
+var CreateMiniBoard = function (scene, mainBoard, x, y, color, map) {
+    var miniBoard = scene.rexBoard.add.miniBoard(x, y, {
+        grid: mainBoard.grid,
+        draggable: true
+    });
+
+    var line;
+    for (var i = 0, icnt = map.length; i < icnt; i++) {
+        line = map[i].split('');
+        for (var j = 0, jcnt = line.length; j < jcnt; j++) {
+            if (line[j] !== ' ') {
+                scene.rexBoard.add.shape(miniBoard, j - 1, i - 1, 0, color).setStrokeStyle(2, 0xffffff);
+            }
+        }
+    }
+
+    miniBoard
+        .on('dragstart', function (pointer, dragX, dragY) {
+            this.pullOutFromMainBoard();
+            this.setAlpha(0.5);
+            scene.miniBoard = null;
+        }, miniBoard)
+        .on('drag', function (pointer, dragX, dragY) {
+            this.setPosition(dragX, dragY);
+            if (this.isOverlapping(mainBoard)) {
+                this.setAlpha(0.7);
+                this.alignToMainBoard(mainBoard);
+            } else {
+                this.setAlpha(0.5);
+            }
+        }, miniBoard)
+        .on('dragend', function (pointer, dragX, dragY) {
+            this.putOnMainBoard(mainBoard);
+            this.setAlpha(1);
+            if (miniBoard.mainBoard) {
+                scene.miniBoard = miniBoard;
+            }
+            console.log(mainBoard.getAllChess())
+        }, miniBoard);
+
+    return miniBoard;
+}
+
 var config = {
     type: Phaser.AUTO,
     parent: 'phaser-example',

diff --git a/plugins/board/miniboard/input/DragEnd.js b/plugins/board/miniboard/input/DragEnd.js
@@ -1,12 +1,12 @@
 var DragEnd = function (pointer) {
-    var dragData = this.input.drag;
+    var dragData = this.miniboardInput.drag;
     // Not dragging
     if (dragData.state === 0) {
         return;
     }
 
     if (pointer === undefined) {
-        pointer = this.input.pointer;
+        pointer = this.miniboardInput.pointer;
     }
     var dragPosition = dragData.position;
     var dragX = pointer.x - dragPosition.x;

diff --git a/plugins/board/miniboard/input/DragStart.js b/plugins/board/miniboard/input/DragStart.js
@@ -0,0 +1,15 @@
+var OnDragStart = function (pointer) {
+    var dragData = this.miniboardInput.drag;
+    // Drag by another pointer
+    if (dragData.state === 1) {
+        return;
+    }
+
+    var dragPosition = dragData.position;
+    dragPosition.x = pointer.x - this.x;
+    dragPosition.y = pointer.y - this.y;
+    dragData.state = 1;
+    this.emit('dragstart', pointer, dragPosition.x, dragPosition.y);
+}
+
+export default OnDragStart;
diff --git a/plugins/board/miniboard/input/OnPointerDown.js b/plugins/board/miniboard/input/OnPointerDown.js
@@ -1,13 +1,15 @@
+import OnDragStart from './DragStart.js';
+
 var OnPointerDown = function (pointer) {
-    if (!this.input.enable) {
+    if (!this.miniboardInput.enable) {
         return;
     }
     if (!pointer.isDown) {
         return;
     }
 
-    if (this.input.pointer === null) { // Catch new touch pointer
-        this.input.pointer = pointer;
+    if (this.miniboardInput.pointer === null) { // Catch new touch pointer
+        this.miniboardInput.pointer = pointer;
     }
 
     var hitChess = OnTouchTileStart.call(this, pointer);
@@ -25,8 +27,8 @@ var OnTouchTileStart = function (pointer) {
     var tileX = out.x,
         tileY = out.y;
     grid.restoreOrigin();
-    this.input.tilePosition.x = tileX;
-    this.input.tilePosition.y = tileY;
+    this.miniboardInput.tilePosition.x = tileX;
+    this.miniboardInput.tilePosition.y = tileY;
 
     // Get touched chess
     var gameObjects = this.board.tileXYToChessArray(tileX, tileY, globChessArray);
@@ -47,20 +49,6 @@ var OnTouchTileStart = function (pointer) {
     return hitChess;
 }
 
-var OnDragStart = function (pointer) {
-    var dragData = this.input.drag;
-    // Drag by another pointer
-    if (dragData.state === 1) {
-        return;
-    }
-
-    var dragPosition = dragData.position;
-    dragPosition.x = pointer.x - this.x;
-    dragPosition.y = pointer.y - this.y;
-    dragData.state = 1;
-    this.emit('dragstart', pointer, dragPosition.x, dragPosition.y);
-}
-
 var globChessArray = [];
 
 export default OnPointerDown;
diff --git a/plugins/board/miniboard/input/OnPointerMove.js b/plugins/board/miniboard/input/OnPointerMove.js
@@ -1,5 +1,5 @@
 var OnPointerMove = function (pointer) {
-    if (!this.input.enable) {
+    if (!this.miniboardInput.enable) {
         return;
     }
 
@@ -17,12 +17,12 @@ var OnTouchTileMove = function (pointer) {
         tileY = out.y;
     grid.restoreOrigin();
 
-    if ((this.input.tilePosition.x === tileX) && (this.input.tilePosition.y === tileY)) {
+    if ((this.miniboardInput.tilePosition.x === tileX) && (this.miniboardInput.tilePosition.y === tileY)) {
         // Tile position dose not change
         return;
     }
-    this.input.tilePosition.x = tileX;
-    this.input.tilePosition.y = tileY;
+    this.miniboardInput.tilePosition.x = tileX;
+    this.miniboardInput.tilePosition.y = tileY;
 
     // Get touched chess
     var gameObjects = this.board.tileXYToChessArray(tileX, tileY, globChessArray);
@@ -40,26 +40,26 @@ var OnTouchTileMove = function (pointer) {
         this.emit('pointermove', pointer, this);
     } else {
         // Move outside
-        if (this.input.pointer === pointer) { // Release touch pointer
-            this.input.pointer = null;
+        if (this.miniboardInput.pointer === pointer) { // Release touch pointer
+            this.miniboardInput.pointer = null;
         }
     }
     globChessArray.length = 0;
 
     // Not dragging
-    if (this.input.drag.state === 0) {
-        if (this.input.pointer === pointer) {
+    if (this.miniboardInput.drag.state === 0) {
+        if (this.miniboardInput.pointer === pointer) {
             if (!hitChess) {
-                this.input.pointer = null; // Release touch pointer
+                this.miniboardInput.pointer = null; // Release touch pointer
             }
-        } else if (this.input.pointer === null) {
-            this.input.pointer = pointer; // Catch new touch pointer
+        } else if (this.miniboardInput.pointer === null) {
+            this.miniboardInput.pointer = pointer; // Catch new touch pointer
         }
     }
 }
 
 var OnDrag = function (pointer) {
-    var dragData = this.input.drag;
+    var dragData = this.miniboardInput.drag;
     // Not dragging
     if (dragData.state === 0) {
         return;

diff --git a/plugins/board/miniboard/input/OnPointerUp.js b/plugins/board/miniboard/input/OnPointerUp.js
@@ -1,15 +1,15 @@
 import OnDragEnd from './DragEnd.js';
 
 var OnPointerUp = function (pointer) {
-    if (!this.input.enable) {
+    if (!this.miniboardInput.enable) {
         return;
     }
 
     OnTouchTileEnd.call(this, pointer);
     OnDragEnd.call(this, pointer);
 
-    if (this.input.pointer === pointer) { // Release touch pointer
-        this.input.pointer = null;
+    if (this.miniboardInput.pointer === pointer) { // Release touch pointer
+        this.miniboardInput.pointer = null;
     }
 }
 
@@ -22,8 +22,8 @@ var OnTouchTileEnd = function (pointer) {
     var tileX = out.x,
         tileY = out.y;
     grid.restoreOrigin();
-    this.input.tilePosition.x = tileX;
-    this.input.tilePosition.y = tileY;
+    this.miniboardInput.tilePosition.x = tileX;
+    this.miniboardInput.tilePosition.y = tileY;
 
     // Get touched chess
     var gameObjects = this.board.tileXYToChessArray(tileX, tileY, globChessArray);

diff --git a/plugins/board/miniboard/input/SetDraggable.js b/plugins/board/miniboard/input/SetDraggable.js
@@ -3,9 +3,9 @@ var SetDraggable = function (enable) {
         enable = true;
     }
     this.setInteractive();
-    this.input.drag.enable = enable;
+    this.miniboardInput.drag.enable = enable;
     if (!enable) {
-        this.input.drag.state = 0;
+        this.miniboardInput.drag.state = 0;
     }
     return this;
 }