From 98c1da085cc6ca05a6d746ab12f8ab489920c3ce Mon Sep 17 00:00:00 2001 From: Rex Date: Thu, 14 Sep 2023 13:50:35 +0800 Subject: [PATCH] Rename --- examples/jigsaw/generate-frames.js | 1 + .../jigsaw/generateframes/GenerateFrames.js | 26 ++++++++------- templates/jigsaw/jigsawpiece/DrawPieceMask.js | 32 +++++++++---------- templates/jigsaw/jigsawpiece/JigsawPiece.js | 14 +++++--- 4 files changed, 41 insertions(+), 32 deletions(-) diff --git a/examples/jigsaw/generate-frames.js b/examples/jigsaw/generate-frames.js index ed1f32e807..f499e2948c 100644 --- a/examples/jigsaw/generate-frames.js +++ b/examples/jigsaw/generate-frames.js @@ -17,6 +17,7 @@ class Demo extends Phaser.Scene { baseKey: 'classroom', targetKey: 'pieces', columns: 8, rows: 6, + edgeWidth: 15, edgeHeight: 15 }) this.add.image(0, 0, 'pieces', '__BASE').setOrigin(0); diff --git a/templates/jigsaw/generateframes/GenerateFrames.js b/templates/jigsaw/generateframes/GenerateFrames.js index 52453f0ed7..033c5ca03e 100644 --- a/templates/jigsaw/generateframes/GenerateFrames.js +++ b/templates/jigsaw/generateframes/GenerateFrames.js @@ -11,7 +11,7 @@ var GenerateFrames = function (scene, { baseKey, targetKey, columns, rows, - overlap, + edgeWidth, edgeHeight, edges, drawMaskCallback, getFrameNameCallback = DefaultGetFrameNameCallback @@ -22,16 +22,19 @@ var GenerateFrames = function (scene, { var baseFrameWidth = baseFrame.cutWidth, baseFrameHeight = baseFrame.height; - if (overlap === undefined) { - overlap = Math.min(baseFrameWidth / columns, baseFrameHeight / rows) / 7; + if (edgeWidth === undefined) { + edgeWidth = (baseFrameWidth / columns) / 7; + } + if (edgeHeight === undefined) { + edgeHeight = (baseFrameHeight / rows) / 7; } if (edges === undefined) { edges = RandomPieceEdges(columns, rows); } - var frameWidth = (baseFrameWidth + (columns - 1) * overlap) / columns; - var frameHeight = (baseFrameHeight + (rows - 1) * overlap) / rows; + var frameWidth = (baseFrameWidth + (columns - 1) * edgeWidth) / columns; + var frameHeight = (baseFrameHeight + (rows - 1) * edgeHeight) / rows; var frameManager = new FrameManager(scene, { key: targetKey, @@ -45,12 +48,12 @@ var GenerateFrames = function (scene, { var sample = new JigsawPiece(scene, { width: frameWidth, height: frameHeight, - indent: overlap, + indentX: edgeWidth, indentY: edgeHeight, key: baseKey }); - var startX = -overlap, - startY = -overlap; + var startX = -edgeWidth, + startY = -edgeHeight; var scrollX = startX, scrollY = startY; for (var r = 0; r < rows; r++) { @@ -64,11 +67,11 @@ var GenerateFrames = function (scene, { frameManager.paste(getFrameNameCallback(c, r), sample); - scrollX += frameWidth - overlap; + scrollX += frameWidth - edgeWidth; } scrollX = startX; - scrollY += frameHeight - overlap; + scrollY += frameHeight - edgeHeight; } sample.destroy(); @@ -81,7 +84,8 @@ var GenerateFrames = function (scene, { frameWidth, frameHeight, - overlap, + edgeWidth, + edgeHeight, getFrameNameCallback, } } diff --git a/templates/jigsaw/jigsawpiece/DrawPieceMask.js b/templates/jigsaw/jigsawpiece/DrawPieceMask.js index 0d19b684b0..e56038f771 100644 --- a/templates/jigsaw/jigsawpiece/DrawPieceMask.js +++ b/templates/jigsaw/jigsawpiece/DrawPieceMask.js @@ -5,55 +5,55 @@ const RAD180 = DegToRad(180); const RAD270 = DegToRad(270); const RAD360 = DegToRad(360); -var DrawPieceMask = function (graphics, width, height, indent, edgeMode) { +var DrawPieceMask = function (graphics, width, height, edgeWidth, edgeHeight, edgeMode) { var centerX = width / 2, centerY = height / 2; graphics.clear(); graphics.beginPath(); - graphics.moveTo(indent, indent); + graphics.moveTo(edgeWidth, edgeHeight); switch (edgeMode.top) { case 1: - graphics.lineTo(centerX - indent, indent); - graphics.arc(centerX, indent, indent, RAD180, RAD360, false); + graphics.lineTo(centerX - edgeHeight, edgeHeight); + graphics.arc(centerX, edgeHeight, edgeHeight, RAD180, RAD360, false); break; case 2: - graphics.lineTo(centerX - indent, indent); - graphics.arc(centerX, indent, indent, RAD180, RAD360, true); + graphics.lineTo(centerX - edgeHeight, edgeHeight); + graphics.arc(centerX, edgeHeight, edgeHeight, RAD180, RAD360, true); break; } - graphics.lineTo(width - indent, indent); + graphics.lineTo(width - edgeWidth, edgeHeight); switch (edgeMode.right) { case 1: - graphics.arc(width - indent, centerY, indent, RAD270, RAD90, false); + graphics.arc(width - edgeWidth, centerY, edgeWidth, RAD270, RAD90, false); break; case 2: - graphics.arc(width - indent, centerY, indent, RAD270, RAD90, true); + graphics.arc(width - edgeWidth, centerY, edgeWidth, RAD270, RAD90, true); break; } - graphics.lineTo(width - indent, height - indent); + graphics.lineTo(width - edgeWidth, height - edgeHeight); switch (edgeMode.bottom) { case 1: - graphics.arc(centerX, height - indent, indent, RAD0, RAD180, false); + graphics.arc(centerX, height - edgeHeight, edgeHeight, RAD0, RAD180, false); break; case 2: - graphics.arc(centerX, height - indent, indent, RAD0, RAD180, true); + graphics.arc(centerX, height - edgeHeight, edgeHeight, RAD0, RAD180, true); break; } - graphics.lineTo(indent, height - indent); + graphics.lineTo(edgeWidth, height - edgeHeight); switch (edgeMode.left) { case 1: - graphics.arc(indent, centerY, indent, RAD90, RAD270, false); + graphics.arc(edgeWidth, centerY, edgeWidth, RAD90, RAD270, false); break; case 2: - graphics.arc(indent, centerY, indent, RAD90, RAD270, true); + graphics.arc(edgeWidth, centerY, edgeWidth, RAD90, RAD270, true); break; } - graphics.lineTo(indent, indent); + graphics.lineTo(edgeWidth, edgeHeight); graphics.closePath(); graphics.fillPath(); diff --git a/templates/jigsaw/jigsawpiece/JigsawPiece.js b/templates/jigsaw/jigsawpiece/JigsawPiece.js index 694bfbc72b..396f94881d 100644 --- a/templates/jigsaw/jigsawpiece/JigsawPiece.js +++ b/templates/jigsaw/jigsawpiece/JigsawPiece.js @@ -7,17 +7,21 @@ import DrawPieceMask from './DrawPieceMask.js'; class JigsawPiece extends Phaser.GameObjects.RenderTexture { constructor(scene, { width, height, - indent, + edgeWidth, edgeHeight, key, }) { super(scene, 0, 0, width, height); this.setBaseKey(key); - if (indent === undefined) { - indent = Math.min(width, height) / 7; + if (edgeWidth === undefined) { + edgeWidth = width / 7; } - this.indent = indent; + this.edgeWidth = edgeWidth; + if (edgeHeight === undefined) { + edgeHeight = height / 7; + } + this.edgeHeight = edgeHeight; var maskGraphics = scene.make.graphics({ add: false }); this.setMask(maskGraphics.createGeometryMask()); @@ -68,7 +72,7 @@ class JigsawPiece extends Phaser.GameObjects.RenderTexture { this.camera.setScroll(0, 0); - drawMaskCallback(this.maskGraphics, this.width, this.height, this.indent, edgeMode); + drawMaskCallback(this.maskGraphics, this.width, this.height, this.edgeWidth, this.edgeHeight, edgeMode); return this; }