Skip to content

Commit 9f9043d

Browse files
photonstormphotonstorm
committed
Added the new Shape base class and the Arc, Rectangle and Triangle primitives
1 parent dedc939 commit 9f9043d

15 files changed

Lines changed: 866 additions & 0 deletions

‎src/gameobjects/index.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,11 @@ var GameObjects = {
3636
TileSprite: require('./tilesprite/TileSprite'),
3737
Zone: require('./zone/Zone'),
3838

39+
// Shapes
40+
41+
Shape: require('./shape/Shape'),
42+
Rectangle: require('./shape/Rectangle'),
43+
3944
// Game Object Factories
4045

4146
Factories: {
@@ -48,6 +53,7 @@ var GameObjects = {
4853
Particles: require('./particles/ParticleManagerFactory'),
4954
PathFollower: require('./pathfollower/PathFollowerFactory'),
5055
RenderTexture: require('./rendertexture/RenderTextureFactory'),
56+
Shape: require('./shape/ShapeFactory'),
5157
Sprite: require('./sprite/SpriteFactory'),
5258
StaticBitmapText: require('./bitmaptext/static/BitmapTextFactory'),
5359
Text: require('./text/static/TextFactory'),
@@ -64,6 +70,7 @@ var GameObjects = {
6470
Image: require('./image/ImageCreator'),
6571
Particles: require('./particles/ParticleManagerCreator'),
6672
RenderTexture: require('./rendertexture/RenderTextureCreator'),
73+
Shape: require('./shape/ShapeCreator'),
6774
Sprite: require('./sprite/SpriteCreator'),
6875
StaticBitmapText: require('./bitmaptext/static/BitmapTextCreator'),
6976
Text: require('./text/static/TextCreator'),

‎src/gameobjects/shape/Arc.js‎

Lines changed: 162 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,162 @@
1+
/**
2+
* @author Richard Davey <rich@photonstorm.com>
3+
* @copyright 2018 Photon Storm Ltd.
4+
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
5+
*/
6+
7+
var ArcRender = require('./ArcRender');
8+
var Class = require('../../utils/Class');
9+
var DegToRad = require('../../math/DegToRad');
10+
var Earcut = require('../../geom/polygon/Earcut');
11+
var GeomCircle = require('../../geom/circle/Circle');
12+
var Shape = require('./Shape');
13+
var MATH_CONST = require('../../math/const');
14+
15+
/**
16+
* @classdesc
17+
*
18+
* @class Arc
19+
* @extends Phaser.GameObjects.Shape
20+
* @memberOf Phaser.GameObjects
21+
* @constructor
22+
* @since 3.13.0
23+
*
24+
* @param {Phaser.Scene} scene - The Scene to which this Game Object belongs. A Game Object can only belong to one Scene at a time.
25+
* @param {number} x - The horizontal position of this Game Object in the world.
26+
* @param {number} y - The vertical position of this Game Object in the world.
27+
*/
28+
var Arc = new Class({
29+
30+
Extends: Shape,
31+
32+
Mixins: [
33+
ArcRender
34+
],
35+
36+
initialize:
37+
38+
function Arc (scene, x, y, radius, fillColor, fillAlpha, startAngle, endAngle, anticlockwise)
39+
{
40+
if (startAngle === undefined) { startAngle = 0; }
41+
if (endAngle === undefined) { endAngle = 360; }
42+
if (anticlockwise === undefined) { anticlockwise = false; }
43+
44+
Shape.call(this, scene, 'Arc', new GeomCircle(x, y, radius));
45+
46+
this.pathData = [];
47+
this.pathIndexes = [];
48+
49+
this.startAngle = DegToRad(startAngle);
50+
this.endAngle = DegToRad(endAngle);
51+
this.anticlockwise = anticlockwise;
52+
this.iterations = 0.01;
53+
54+
this.setPosition(x, y);
55+
this.setSize(this.data.radius, this.data.radius);
56+
57+
this.updateDisplayOrigin();
58+
59+
if (fillColor !== undefined)
60+
{
61+
this.setFillStyle(fillColor, fillAlpha);
62+
}
63+
64+
this.updateData();
65+
},
66+
67+
setSmoothing: function (value)
68+
{
69+
if (value === undefined) { value = 0.01; }
70+
71+
this.iterations = value;
72+
73+
return this.updateData();
74+
},
75+
76+
setStartAngle: function (angle, anticlockwise)
77+
{
78+
this.startAngle = DegToRad(angle);
79+
80+
if (anticlockwise !== undefined)
81+
{
82+
this.anticlockwise = anticlockwise;
83+
}
84+
85+
return this.updateData();
86+
},
87+
88+
setEndAngle: function (angle, anticlockwise)
89+
{
90+
this.endAngle = DegToRad(angle);
91+
92+
if (anticlockwise !== undefined)
93+
{
94+
this.anticlockwise = anticlockwise;
95+
}
96+
97+
return this.updateData();
98+
},
99+
100+
updateData: function ()
101+
{
102+
var step = this.iterations;
103+
var iteration = step;
104+
105+
var x = 0;
106+
var y = 0;
107+
108+
var radius = this.data.radius;
109+
var startAngle = this.startAngle;
110+
var endAngle = this.endAngle;
111+
var anticlockwise = this.anticlockwise;
112+
113+
endAngle -= startAngle;
114+
115+
if (anticlockwise)
116+
{
117+
if (endAngle < -MATH_CONST.PI2)
118+
{
119+
endAngle = -MATH_CONST.PI2;
120+
}
121+
else if (endAngle > 0)
122+
{
123+
endAngle = -MATH_CONST.PI2 + endAngle % MATH_CONST.PI2;
124+
}
125+
}
126+
else if (endAngle > MATH_CONST.PI2)
127+
{
128+
endAngle = MATH_CONST.PI2;
129+
}
130+
else if (endAngle < 0)
131+
{
132+
endAngle = MATH_CONST.PI2 + endAngle % MATH_CONST.PI2;
133+
}
134+
135+
var path = [ x + Math.cos(startAngle) * radius, y + Math.sin(startAngle) * radius ];
136+
137+
var ta;
138+
139+
while (iteration < 1)
140+
{
141+
ta = endAngle * iteration + startAngle;
142+
143+
path.push(x + Math.cos(ta) * radius);
144+
path.push(y + Math.sin(ta) * radius);
145+
146+
iteration += step;
147+
}
148+
149+
ta = endAngle + startAngle;
150+
151+
path.push(x + Math.cos(ta) * radius);
152+
path.push(y + Math.sin(ta) * radius);
153+
154+
this.pathIndexes = Earcut(path);
155+
this.pathData = path;
156+
157+
return this;
158+
}
159+
160+
});
161+
162+
module.exports = Arc;

‎src/gameobjects/shape/ArcRender.js‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
/**
2+
* @author Richard Davey <rich@photonstorm.com>
3+
* @copyright 2018 Photon Storm Ltd.
4+
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
5+
*/
6+
7+
var renderWebGL = require('../../utils/NOOP');
8+
var renderCanvas = require('../../utils/NOOP');
9+
10+
if (typeof WEBGL_RENDERER)
11+
{
12+
renderWebGL = require('./ArcWebGLRenderer');
13+
}
14+
15+
if (typeof CANVAS_RENDERER)
16+
{
17+
// renderCanvas = require('./RectangleCanvasRenderer');
18+
}
19+
20+
module.exports = {
21+
22+
renderWebGL: renderWebGL,
23+
renderCanvas: renderCanvas
24+
25+
};

‎src/gameobjects/shape/ArcWebGLRenderer.js‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
/**
2+
* @author Richard Davey <rich@photonstorm.com>
3+
* @copyright 2018 Photon Storm Ltd.
4+
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
5+
*/
6+
7+
var Utils = require('../../renderer/webgl/Utils');
8+
9+
/**
10+
* Renders this Game Object with the WebGL Renderer to the given Camera.
11+
* The object will not render if any of its renderFlags are set or it is being actively filtered out by the Camera.
12+
* This method should not be called directly. It is a utility function of the Render module.
13+
*
14+
* @method Phaser.GameObjects.Arc#renderWebGL
15+
* @since 3.13.0
16+
* @private
17+
*
18+
* @param {Phaser.Renderer.WebGL.WebGLRenderer} renderer - A reference to the current active WebGL renderer.
19+
* @param {Phaser.GameObjects.Arc} src - The Game Object being rendered in this call.
20+
* @param {number} interpolationPercentage - Reserved for future use and custom pipelines.
21+
* @param {Phaser.Cameras.Scene2D.Camera} camera - The Camera that is rendering the Game Object.
22+
* @param {Phaser.GameObjects.Components.TransformMatrix} parentMatrix - This transform matrix is defined if the game object is nested
23+
*/
24+
var ArcWebGLRenderer = function (renderer, src, interpolationPercentage, camera, parentMatrix)
25+
{
26+
var pipeline = this.pipeline;
27+
28+
var camMatrix = pipeline._tempMatrix1;
29+
var shapeMatrix = pipeline._tempMatrix2;
30+
var calcMatrix = pipeline._tempMatrix3;
31+
32+
renderer.setPipeline(pipeline);
33+
34+
shapeMatrix.applyITRS(src.x, src.y, src.rotation, src.scaleX, src.scaleY);
35+
36+
camMatrix.copyFrom(camera.matrix);
37+
38+
if (parentMatrix)
39+
{
40+
// Multiply the camera by the parent matrix
41+
camMatrix.multiplyWithOffset(parentMatrix, -camera.scrollX * src.scrollFactorX, -camera.scrollY * src.scrollFactorY);
42+
43+
// Undo the camera scroll
44+
shapeMatrix.e = src.x;
45+
shapeMatrix.f = src.y;
46+
47+
// Multiply by the Sprite matrix, store result in calcMatrix
48+
camMatrix.multiply(shapeMatrix, calcMatrix);
49+
}
50+
else
51+
{
52+
shapeMatrix.e -= camera.scrollX * src.scrollFactorX;
53+
shapeMatrix.f -= camera.scrollY * src.scrollFactorY;
54+
55+
// Multiply by the Sprite matrix, store result in calcMatrix
56+
camMatrix.multiply(shapeMatrix, calcMatrix);
57+
}
58+
59+
var fillTintColor = Utils.getTintAppendFloatAlphaAndSwap(src.fillColor, src.fillAlpha * (camera.alpha * src.alpha));
60+
61+
var pathData = src.pathData;
62+
var pathIndexes = src.pathIndexes;
63+
64+
for (var i = 0; i < pathIndexes.length; i += 3)
65+
{
66+
var p0 = pathIndexes[i] * 2;
67+
var p1 = pathIndexes[i + 1] * 2;
68+
var p2 = pathIndexes[i + 2] * 2;
69+
70+
var x0 = pathData[p0 + 0];
71+
var y0 = pathData[p0 + 1];
72+
var x1 = pathData[p1 + 0];
73+
var y1 = pathData[p1 + 1];
74+
var x2 = pathData[p2 + 0];
75+
var y2 = pathData[p2 + 1];
76+
77+
var tx0 = calcMatrix.getX(x0, y0);
78+
var ty0 = calcMatrix.getY(x0, y0);
79+
80+
var tx1 = calcMatrix.getX(x1, y1);
81+
var ty1 = calcMatrix.getY(x1, y1);
82+
83+
var tx2 = calcMatrix.getX(x2, y2);
84+
var ty2 = calcMatrix.getY(x2, y2);
85+
86+
pipeline.batchTri(tx0, ty0, tx1, ty1, tx2, ty2, 0, 0, 1, 1, fillTintColor, fillTintColor, fillTintColor, pipeline.tintEffect);
87+
}
88+
};
89+
90+
module.exports = ArcWebGLRenderer;

‎src/gameobjects/shape/Rectangle.js‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
/**
2+
* @author Richard Davey <rich@photonstorm.com>
3+
* @copyright 2018 Photon Storm Ltd.
4+
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
5+
*/
6+
7+
var Class = require('../../utils/Class');
8+
var GeomRectangle = require('../../geom/rectangle/Rectangle');
9+
var Shape = require('./Shape');
10+
var RectangleRender = require('./RectangleRender');
11+
12+
/**
13+
* @classdesc
14+
*
15+
* @class Rectangle
16+
* @extends Phaser.GameObjects.Shape
17+
* @memberOf Phaser.GameObjects
18+
* @constructor
19+
* @since 3.13.0
20+
*
21+
* @param {Phaser.Scene} scene - The Scene to which this Game Object belongs. A Game Object can only belong to one Scene at a time.
22+
* @param {number} x - The horizontal position of this Game Object in the world.
23+
* @param {number} y - The vertical position of this Game Object in the world.
24+
*/
25+
var Rectangle = new Class({
26+
27+
Extends: Shape,
28+
29+
Mixins: [
30+
RectangleRender
31+
],
32+
33+
initialize:
34+
35+
function Rectangle (scene, x, y, width, height, fillColor, fillAlpha)
36+
{
37+
Shape.call(this, scene, 'Rectangle', new GeomRectangle(x, y, width, height));
38+
39+
this.setPosition(x, y);
40+
this.setSize(width, height);
41+
42+
this.updateDisplayOrigin();
43+
44+
if (fillColor !== undefined)
45+
{
46+
this.setFillStyle(fillColor, fillAlpha);
47+
}
48+
}
49+
50+
});
51+
52+
module.exports = Rectangle;

‎src/gameobjects/shape/RectangleCanvasRenderer.js‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
/**
2+
* @author Richard Davey <rich@photonstorm.com>
3+
* @copyright 2018 Photon Storm Ltd.
4+
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
5+
*/
6+
7+
/**
8+
* Renders this Game Object with the Canvas Renderer to the given Camera.
9+
* The object will not render if any of its renderFlags are set or it is being actively filtered out by the Camera.
10+
* This method should not be called directly. It is a utility function of the Render module.
11+
*
12+
* @method Phaser.GameObjects.Image#renderCanvas
13+
* @since 3.0.0
14+
* @private
15+
*
16+
* @param {Phaser.Renderer.Canvas.CanvasRenderer} renderer - A reference to the current active Canvas renderer.
17+
* @param {Phaser.GameObjects.Image} src - The Game Object being rendered in this call.
18+
* @param {number} interpolationPercentage - Reserved for future use and custom pipelines.
19+
* @param {Phaser.Cameras.Scene2D.Camera} camera - The Camera that is rendering the Game Object.
20+
* @param {Phaser.GameObjects.Components.TransformMatrix} parentMatrix - This transform matrix is defined if the game object is nested
21+
*/
22+
var RectangleCanvasRenderer = function (renderer, src, interpolationPercentage, camera, parentMatrix)
23+
{
24+
renderer.batchSprite(src, src.frame, camera, parentMatrix);
25+
};
26+
27+
module.exports = RectangleCanvasRenderer;

0 commit comments

Comments
 (0)