Skip to content

Commit c6f7224

Browse files
committed
Added Size component.
1 parent 74a84a8 commit c6f7224

2 files changed

Lines changed: 292 additions & 1 deletion

File tree

src/structs/Size.js

Lines changed: 290 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,290 @@
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+
9+
/**
10+
* @classdesc
11+
* The Size component is a simple structure that helps you encapsulate a `width` and `height` and, if required, maintain
12+
* the aspect ratios between them.
13+
*
14+
* @class Size
15+
* @memberof Phaser.Structs
16+
* @constructor
17+
* @since 3.16.0
18+
*
19+
* @param {number} [width] - The width of the Size component.
20+
* @param {number} [height=width] - The height of the Size component. If not given, it will use the `width`.
21+
* @param {boolean} [lockAspectRatio=false] - Should the aspect ratio between the `width` and `height` be locked?
22+
*/
23+
var Size = new Class({
24+
25+
initialize:
26+
27+
function Size (width, height, lockAspectRatio)
28+
{
29+
if (width === undefined) { width = 0; }
30+
if (height === undefined) { height = width; }
31+
if (lockAspectRatio === undefined) { lockAspectRatio = false; }
32+
33+
/**
34+
* The width.
35+
*
36+
* @name Phaser.Structs.Size#_width
37+
* @type {number}
38+
* @private
39+
* @since 3.16.0
40+
*/
41+
this._width = width;
42+
43+
/**
44+
* The height.
45+
*
46+
* @name Phaser.Structs.Size#_height
47+
* @type {number}
48+
* @private
49+
* @since 3.16.0
50+
*/
51+
this._height = height;
52+
53+
/**
54+
* The proportional relationship between the width and height.
55+
*
56+
* This property is read only and is updated automatically when either the `width` or `height` properties are changed,
57+
* providing the aspect ratio lock isn't enabled.
58+
*
59+
* @name Phaser.Structs.Size#ratioH
60+
* @type {number}
61+
* @readonly
62+
* @since 3.16.0
63+
*/
64+
this.ratioH = (height === 0) ? 0 : width / height;
65+
66+
/**
67+
* The proportional relationship between the height and width.
68+
*
69+
* This property is read only and is updated automatically when either the `width` or `height` properties are changed,
70+
* providing the aspect ratio lock isn't enabled.
71+
*
72+
* @name Phaser.Structs.Size#ratioV
73+
* @type {number}
74+
* @readonly
75+
* @since 3.16.0
76+
*/
77+
this.ratioV = (width === 0) ? 0 : height / width;
78+
79+
/**
80+
* Lock the aspect ratio to its current value?
81+
*
82+
* If enabled, changing the width or height properties will automatically adjust the other based on the aspect ratio.
83+
*
84+
* @name Phaser.Structs.Size#lock
85+
* @type {boolean}
86+
* @since 3.16.0
87+
*/
88+
this.lock = lockAspectRatio;
89+
},
90+
91+
/**
92+
* Lock the aspect ratio to its current value?
93+
*
94+
* If enabled, changing the `width` or `height` properties will automatically adjust the other based on the aspect ratio.
95+
*
96+
* @method Phaser.Structs.Size#setAspectRatioLock
97+
* @since 3.16.0
98+
*
99+
* @param {boolean} value - `true` to enable the aspect ratio lock or `false` to disable it.
100+
*
101+
* @return {this} This Size instance.
102+
*/
103+
setAspectRatioLock: function (value)
104+
{
105+
this.lock = value;
106+
107+
return this;
108+
},
109+
110+
/**
111+
* Lock the aspect ratio to its current value?
112+
*
113+
* If enabled, changing the `width` or `height` properties will automatically adjust the other based on the aspect ratio.
114+
*
115+
* @method Phaser.Structs.Size#set
116+
* @since 3.16.0
117+
*
118+
* @param {number} [width] - The width of the Size component.
119+
* @param {number} [height=width] - The height of the Size component. If not given, it will use the `width`.
120+
* @param {boolean} [lockAspectRatio=false] - Should the aspect ratio between the `width` and `height` be locked?
121+
*
122+
* @return {this} This Size instance.
123+
*/
124+
set: function (width, height)
125+
{
126+
if (width === undefined) { width = 0; }
127+
if (height === undefined) { height = width; }
128+
129+
if (this.lock)
130+
{
131+
this._width = width * this.ratioH;
132+
this._height = height * this.ratioV;
133+
}
134+
else
135+
{
136+
this._width = width;
137+
this.height = height;
138+
}
139+
140+
return this;
141+
},
142+
143+
/**
144+
* Sets the width of this Size component.
145+
*
146+
* If the aspect ratio is locked, changing the width will also automatically update the height.
147+
*
148+
* @method Phaser.Structs.Size#setWidth
149+
* @since 3.16.0
150+
*
151+
* @param {number} width - The width of the Size component.
152+
*
153+
* @return {this} This Size instance.
154+
*/
155+
setWidth: function (value)
156+
{
157+
this.width = value;
158+
159+
return this;
160+
},
161+
162+
/**
163+
* Gets the width of this Size component.
164+
*
165+
* @method Phaser.Structs.Size#getWidth
166+
* @since 3.16.0
167+
*
168+
* @return {number} The width of this Size component.
169+
*/
170+
getWidth: function ()
171+
{
172+
return this._width;
173+
},
174+
175+
/**
176+
* Sets the height of this Size component.
177+
*
178+
* If the aspect ratio is locked, changing the height will also automatically update the width.
179+
*
180+
* @method Phaser.Structs.Size#setHeight
181+
* @since 3.16.0
182+
*
183+
* @param {number} height - The height of the Size component.
184+
*
185+
* @return {this} This Size instance.
186+
*/
187+
setHeight: function (value)
188+
{
189+
this.height = value;
190+
191+
return this;
192+
},
193+
194+
/**
195+
* Gets the height of this Size component.
196+
*
197+
* @method Phaser.Structs.Size#getHeight
198+
* @since 3.16.0
199+
*
200+
* @return {number} The height of this Size component.
201+
*/
202+
getHeight: function ()
203+
{
204+
return this._height;
205+
},
206+
207+
/**
208+
* Returns a string representation of this Size component.
209+
*
210+
* @method Phaser.Structs.Size#toString
211+
* @since 3.16.0
212+
*
213+
* @return {string} A string representation of this Size component.
214+
*/
215+
toString: function ()
216+
{
217+
return '[{ Size (width=' + this._width + ' height=' + this._height + ' ratioH=' + this.ratioH + ' ratioV=' + this.ratioV + ' lock=' + this.lock + ') }]';
218+
},
219+
220+
/**
221+
* The width.
222+
*
223+
* Changing this value will automatically update the `height` if the aspect ratio lock is enabled.
224+
* You can also use the `setWidth` and `getWidth` methods.
225+
*
226+
* @name Phaser.Structs.Size#width
227+
* @type {number}
228+
* @since 3.16.0
229+
*/
230+
width: {
231+
232+
get: function ()
233+
{
234+
return this._width;
235+
},
236+
237+
set: function (value)
238+
{
239+
this._width = value;
240+
241+
if (this.lock)
242+
{
243+
this._height = value * this.ratioV;
244+
}
245+
else
246+
{
247+
this.ratioH = (this._height === 0) ? 0 : value / this._height;
248+
this.ratioV = (this._width === 0) ? 0 : this._height / value;
249+
}
250+
}
251+
252+
},
253+
254+
/**
255+
* The height.
256+
*
257+
* Changing this value will automatically update the `width` if the aspect ratio lock is enabled.
258+
* You can also use the `setHeight` and `getHeight` methods.
259+
*
260+
* @name Phaser.Structs.Size#height
261+
* @type {number}
262+
* @since 3.16.0
263+
*/
264+
height: {
265+
266+
get: function ()
267+
{
268+
return this._height;
269+
},
270+
271+
set: function (value)
272+
{
273+
this._height = value;
274+
275+
if (this.lock)
276+
{
277+
this._width = value * this.ratioH;
278+
}
279+
else
280+
{
281+
this.ratioH = (this._height === 0) ? 0 : this._width / value;
282+
this.ratioV = (this._width === 0) ? 0 : value / this._width;
283+
}
284+
}
285+
286+
}
287+
288+
});
289+
290+
module.exports = Size;

src/structs/index.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ module.exports = {
1414
Map: require('./Map'),
1515
ProcessQueue: require('./ProcessQueue'),
1616
RTree: require('./RTree'),
17-
Set: require('./Set')
17+
Set: require('./Set'),
18+
Size: require('./Size')
1819

1920
};

0 commit comments

Comments
 (0)