Skip to content

Commit fa7fee9

Browse files
photonstormphotonstorm
committed
Moved Matrix and RoundedRectangle into Phaser geom structure.
1 parent 77a3bfe commit fa7fee9

2 files changed

Lines changed: 378 additions & 0 deletions

File tree

‎src/geom/Matrix.js‎

Lines changed: 274 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,274 @@
1+
/**
2+
* @author Mat Groves http://matgroves.com/ @Doormat23
3+
*/
4+
5+
/**
6+
* The Matrix class is now an object, which makes it a lot faster,
7+
* here is a representation of it :
8+
* | a | b | tx|
9+
* | c | d | ty|
10+
* | 0 | 0 | 1 |
11+
*
12+
* @class Matrix
13+
* @constructor
14+
*/
15+
Phaser.Matrix = function()
16+
{
17+
/**
18+
* @property a
19+
* @type Number
20+
* @default 1
21+
*/
22+
this.a = 1;
23+
24+
/**
25+
* @property b
26+
* @type Number
27+
* @default 0
28+
*/
29+
this.b = 0;
30+
31+
/**
32+
* @property c
33+
* @type Number
34+
* @default 0
35+
*/
36+
this.c = 0;
37+
38+
/**
39+
* @property d
40+
* @type Number
41+
* @default 1
42+
*/
43+
this.d = 1;
44+
45+
/**
46+
* @property tx
47+
* @type Number
48+
* @default 0
49+
*/
50+
this.tx = 0;
51+
52+
/**
53+
* @property ty
54+
* @type Number
55+
* @default 0
56+
*/
57+
this.ty = 0;
58+
};
59+
60+
/**
61+
* Creates a Matrix object based on the given array. The Element to Matrix mapping order is as follows:
62+
*
63+
* a = array[0]
64+
* b = array[1]
65+
* c = array[3]
66+
* d = array[4]
67+
* tx = array[2]
68+
* ty = array[5]
69+
*
70+
* @method fromArray
71+
* @param array {Array} The array that the matrix will be populated from.
72+
*/
73+
Phaser.Matrix.prototype.fromArray = function(array)
74+
{
75+
this.a = array[0];
76+
this.b = array[1];
77+
this.c = array[3];
78+
this.d = array[4];
79+
this.tx = array[2];
80+
this.ty = array[5];
81+
};
82+
83+
/**
84+
* Creates an array from the current Matrix object.
85+
*
86+
* @method toArray
87+
* @param transpose {Boolean} Whether we need to transpose the matrix or not
88+
* @return {Array} the newly created array which contains the matrix
89+
*/
90+
Phaser.Matrix.prototype.toArray = function(transpose)
91+
{
92+
if(!this.array) this.array = new PIXI.Float32Array(9);
93+
var array = this.array;
94+
95+
if(transpose)
96+
{
97+
array[0] = this.a;
98+
array[1] = this.b;
99+
array[2] = 0;
100+
array[3] = this.c;
101+
array[4] = this.d;
102+
array[5] = 0;
103+
array[6] = this.tx;
104+
array[7] = this.ty;
105+
array[8] = 1;
106+
}
107+
else
108+
{
109+
array[0] = this.a;
110+
array[1] = this.c;
111+
array[2] = this.tx;
112+
array[3] = this.b;
113+
array[4] = this.d;
114+
array[5] = this.ty;
115+
array[6] = 0;
116+
array[7] = 0;
117+
array[8] = 1;
118+
}
119+
120+
return array;
121+
};
122+
123+
/**
124+
* Get a new position with the current transformation applied.
125+
* Can be used to go from a child's coordinate space to the world coordinate space. (e.g. rendering)
126+
*
127+
* @method apply
128+
* @param pos {Point} The origin
129+
* @param [newPos] {Point} The point that the new position is assigned to (allowed to be same as input)
130+
* @return {Point} The new point, transformed through this matrix
131+
*/
132+
Phaser.Matrix.prototype.apply = function(pos, newPos)
133+
{
134+
newPos = newPos || new Phaser.Point();
135+
136+
newPos.x = this.a * pos.x + this.c * pos.y + this.tx;
137+
newPos.y = this.b * pos.x + this.d * pos.y + this.ty;
138+
139+
return newPos;
140+
};
141+
142+
/**
143+
* Get a new position with the inverse of the current transformation applied.
144+
* Can be used to go from the world coordinate space to a child's coordinate space. (e.g. input)
145+
*
146+
* @method applyInverse
147+
* @param pos {Point} The origin
148+
* @param [newPos] {Point} The point that the new position is assigned to (allowed to be same as input)
149+
* @return {Point} The new point, inverse-transformed through this matrix
150+
*/
151+
Phaser.Matrix.prototype.applyInverse = function(pos, newPos)
152+
{
153+
newPos = newPos || new Phaser.Point();
154+
155+
var id = 1 / (this.a * this.d + this.c * -this.b);
156+
var x = pos.x;
157+
var y = pos.y;
158+
159+
newPos.x = this.d * id * x + -this.c * id * y + (this.ty * this.c - this.tx * this.d) * id;
160+
newPos.y = this.a * id * y + -this.b * id * x + (-this.ty * this.a + this.tx * this.b) * id;
161+
162+
return newPos;
163+
};
164+
165+
/**
166+
* Translates the matrix on the x and y.
167+
*
168+
* @method translate
169+
* @param {Number} x
170+
* @param {Number} y
171+
* @return {Matrix} This matrix. Good for chaining method calls.
172+
**/
173+
Phaser.Matrix.prototype.translate = function(x, y)
174+
{
175+
this.tx += x;
176+
this.ty += y;
177+
178+
return this;
179+
};
180+
181+
/**
182+
* Applies a scale transformation to the matrix.
183+
*
184+
* @method scale
185+
* @param {Number} x The amount to scale horizontally
186+
* @param {Number} y The amount to scale vertically
187+
* @return {Matrix} This matrix. Good for chaining method calls.
188+
**/
189+
Phaser.Matrix.prototype.scale = function(x, y)
190+
{
191+
this.a *= x;
192+
this.d *= y;
193+
this.c *= x;
194+
this.b *= y;
195+
this.tx *= x;
196+
this.ty *= y;
197+
198+
return this;
199+
};
200+
201+
202+
/**
203+
* Applies a rotation transformation to the matrix.
204+
* @method rotate
205+
* @param {Number} angle The angle in radians.
206+
* @return {Matrix} This matrix. Good for chaining method calls.
207+
**/
208+
Phaser.Matrix.prototype.rotate = function(angle)
209+
{
210+
var cos = Math.cos( angle );
211+
var sin = Math.sin( angle );
212+
213+
var a1 = this.a;
214+
var c1 = this.c;
215+
var tx1 = this.tx;
216+
217+
this.a = a1 * cos-this.b * sin;
218+
this.b = a1 * sin+this.b * cos;
219+
this.c = c1 * cos-this.d * sin;
220+
this.d = c1 * sin+this.d * cos;
221+
this.tx = tx1 * cos - this.ty * sin;
222+
this.ty = tx1 * sin + this.ty * cos;
223+
224+
return this;
225+
};
226+
227+
/**
228+
* Appends the given Matrix to this Matrix.
229+
*
230+
* @method append
231+
* @param {Matrix} matrix
232+
* @return {Matrix} This matrix. Good for chaining method calls.
233+
*/
234+
Phaser.Matrix.prototype.append = function(matrix)
235+
{
236+
var a1 = this.a;
237+
var b1 = this.b;
238+
var c1 = this.c;
239+
var d1 = this.d;
240+
241+
this.a = matrix.a * a1 + matrix.b * c1;
242+
this.b = matrix.a * b1 + matrix.b * d1;
243+
this.c = matrix.c * a1 + matrix.d * c1;
244+
this.d = matrix.c * b1 + matrix.d * d1;
245+
246+
this.tx = matrix.tx * a1 + matrix.ty * c1 + this.tx;
247+
this.ty = matrix.tx * b1 + matrix.ty * d1 + this.ty;
248+
249+
return this;
250+
};
251+
252+
/**
253+
* Resets this Matix to an identity (default) matrix.
254+
*
255+
* @method identity
256+
* @return {Matrix} This matrix. Good for chaining method calls.
257+
*/
258+
Phaser.Matrix.prototype.identity = function()
259+
{
260+
this.a = 1;
261+
this.b = 0;
262+
this.c = 0;
263+
this.d = 1;
264+
this.tx = 0;
265+
this.ty = 0;
266+
267+
return this;
268+
};
269+
270+
Phaser.identityMatrix = new Phaser.Matrix();
271+
272+
// Because PIXI uses its own type, we'll replace it with ours to avoid duplicating code or confusion.
273+
PIXI.Matrix = Phaser.Matrix;
274+
PIXI.identityMatrix = Phaser.identityMatrix;

‎src/geom/RoundedRectangle.js‎

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,104 @@
1+
/**
2+
* @author Mat Groves http://matgroves.com/
3+
*/
4+
5+
/**
6+
* The Rounded Rectangle object is an area defined by its position and has nice rounded corners, as indicated by its top-left corner point (x, y) and by its width and its height.
7+
*
8+
* @class RoundedRectangle
9+
* @constructor
10+
* @param x {Number} The X coordinate of the upper-left corner of the rounded rectangle
11+
* @param y {Number} The Y coordinate of the upper-left corner of the rounded rectangle
12+
* @param width {Number} The overall width of this rounded rectangle
13+
* @param height {Number} The overall height of this rounded rectangle
14+
* @param radius {Number} Controls the radius of the rounded corners
15+
*/
16+
Phaser.RoundedRectangle = function(x, y, width, height, radius)
17+
{
18+
/**
19+
* @property x
20+
* @type Number
21+
* @default 0
22+
*/
23+
this.x = x || 0;
24+
25+
/**
26+
* @property y
27+
* @type Number
28+
* @default 0
29+
*/
30+
this.y = y || 0;
31+
32+
/**
33+
* @property width
34+
* @type Number
35+
* @default 0
36+
*/
37+
this.width = width || 0;
38+
39+
/**
40+
* @property height
41+
* @type Number
42+
* @default 0
43+
*/
44+
this.height = height || 0;
45+
46+
/**
47+
* @property radius
48+
* @type Number
49+
* @default 20
50+
*/
51+
this.radius = radius || 20;
52+
53+
/**
54+
* The type of the object, should be one of the Graphics type consts, PIXI.Graphics.RRECT in this case
55+
* @property type
56+
* @type Number
57+
* @default 0
58+
*/
59+
this.type = 4;
60+
};
61+
62+
/**
63+
* Creates a clone of this Rounded Rectangle
64+
*
65+
* @method clone
66+
* @return {RoundedRectangle} a copy of the rounded rectangle
67+
*/
68+
Phaser.RoundedRectangle.prototype.clone = function()
69+
{
70+
return new Phaser.RoundedRectangle(this.x, this.y, this.width, this.height, this.radius);
71+
};
72+
73+
/**
74+
* Checks whether the x and y coordinates given are contained within this Rounded Rectangle
75+
*
76+
* @method contains
77+
* @param x {Number} The X coordinate of the point to test
78+
* @param y {Number} The Y coordinate of the point to test
79+
* @return {Boolean} Whether the x/y coordinates are within this Rounded Rectangle
80+
*/
81+
Phaser.RoundedRectangle.prototype.contains = function(x, y)
82+
{
83+
if(this.width <= 0 || this.height <= 0)
84+
return false;
85+
86+
var x1 = this.x;
87+
if(x >= x1 && x <= x1 + this.width)
88+
{
89+
var y1 = this.y;
90+
91+
if(y >= y1 && y <= y1 + this.height)
92+
{
93+
return true;
94+
}
95+
}
96+
97+
return false;
98+
};
99+
100+
// constructor
101+
Phaser.RoundedRectangle.prototype.constructor = Phaser.RoundedRectangle;
102+
103+
// Because PIXI uses its own type, we'll replace it with ours to avoid duplicating code or confusion.
104+
PIXI.RoundedRectangle = Phaser.RoundedRectangle;

0 commit comments

Comments
 (0)