Skip to content

Commit ff405a9

Browse files
wdamienwdamien
committed
Update for parity with EaselJS 0.6.1.
1 parent bcfd11f commit ff405a9

26 files changed

Lines changed: 587 additions & 390 deletions

‎HISTORY.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1+
0.1.1 / 2013-05-15
2+
==================
3+
4+
* Update for parity with EaselJS 0.6.1.
5+
6+
17
0.1.0 / 2013-02-14
28
==================
39

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name":"node-easel",
33
"description":"node wrapper for EaselJS, utilizing node-canvas.",
4-
"version":"0.1.0",
4+
"version":"0.1.1",
55
"author":"Wes Gorgichuk <wes@gskinner.com>",
66
"keywords":[
77
"canvas",

‎src/easeljs/display/Bitmap.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -147,18 +147,30 @@ var p = Bitmap.prototype = new createjs.DisplayObject();
147147
/**
148148
* Because the content of a Bitmap is already in a simple format, cache is unnecessary for Bitmap instances.
149149
* You should <b>not</b> cache Bitmap instances as it can degrade performance.
150+
*
151+
* <strong>However: If you want to use a filter on a Bitmap, you <em>MUST</em> cache it, or it will not work.</strong>
152+
* To see the API for caching, please visit the DisplayObject {{#crossLink "DisplayObject/cache"}}{{/crossLink}}
153+
* method.
150154
* @method cache
151155
**/
152156

153157
/**
154158
* Because the content of a Bitmap is already in a simple format, cache is unnecessary for Bitmap instances.
155159
* You should <b>not</b> cache Bitmap instances as it can degrade performance.
160+
*
161+
* <strong>However: If you want to use a filter on a Bitmap, you <em>MUST</em> cache it, or it will not work.</strong>
162+
* To see the API for caching, please visit the DisplayObject {{#crossLink "DisplayObject/cache"}}{{/crossLink}}
163+
* method.
156164
* @method updateCache
157165
**/
158166

159167
/**
160168
* Because the content of a Bitmap is already in a simple format, cache is unnecessary for Bitmap instances.
161169
* You should <b>not</b> cache Bitmap instances as it can degrade performance.
170+
*
171+
* <strong>However: If you want to use a filter on a Bitmap, you <em>MUST</em> cache it, or it will not work.</strong>
172+
* To see the API for caching, please visit the DisplayObject {{#crossLink "DisplayObject/cache"}}{{/crossLink}}
173+
* method.
162174
* @method uncache
163175
**/
164176

‎src/easeljs/display/BitmapAnimation.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,9 @@ this.createjs = this.createjs||{};
4343
* var instance = new createjs.BitmapAnimation(spriteSheet);
4444
* instance.gotoAndStop("frameName");
4545
*
46+
* Currently, you <strong>must</strong> call either {{#crossLink "BitmapAnimation/gotoAndStop"}}{{/crossLink}} or
47+
* {{#crossLink "BitmapAnimation/gotoAndPlay"}}{{/crossLink}}, or nothing will display on stage.
48+
*
4649
* @class BitmapAnimation
4750
* @extends DisplayObject
4851
* @uses EventDispatcher

‎src/easeljs/display/Container.js‎

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -160,16 +160,21 @@ var p = Container.prototype = new createjs.DisplayObject();
160160
}
161161

162162
/**
163-
* Adds a child to the display list at the specified index, bumping children at equal or greater indexes up one, and setting
164-
* its parent to this Container. You can also add multiple children, such as "addChildAt(child1, child2, ..., index);". The
165-
* index must be between 0 and numChildren. For example, to add myShape under otherShape in the display list, you could use:
166-
* container.addChildAt(myShape, container.getChildIndex(otherShape)). This would also bump otherShape's index up by one.
167-
* Returns the last child that was added, or the last child if multiple children were added. Fails silently if the index
168-
* is out of range.
163+
* Adds a child to the display list at the specified index, bumping children at equal or greater indexes up one, and
164+
* setting its parent to this Container. You can also add multiple children, such as:
165+
*
166+
* addChildAt(child1, child2, ..., index);
167+
*
168+
* The index must be between 0 and numChildren. For example, to add myShape under otherShape in the display list,
169+
* you could use:
170+
*
171+
* container.addChildAt(myShape, container.getChildIndex(otherShape));
172+
*
173+
* This would also bump otherShape's index up by one. Fails silently if the index is out of range.
169174
* @method addChildAt
170175
* @param {DisplayObject} child The display object to add.
171176
* @param {Number} index The index to add the child at.
172-
* @return {DisplayObject} The child that was added, or the last child if multiple children were added.
177+
* @return {DisplayObject} Returns the last child that was added, or the last child if multiple children were added.
173178
**/
174179
p.addChildAt = function(child, index) {
175180
var l = arguments.length;
@@ -464,7 +469,6 @@ var p = Container.prototype = new createjs.DisplayObject();
464469
**/
465470
p._getObjectsUnderPoint = function(x, y, arr, mouseEvents) {
466471
var ctx = createjs.DisplayObject._hitTestContext;
467-
var canvas = createjs.DisplayObject._hitTestCanvas;
468472
var mtx = this._matrix;
469473
var hasHandler = this._hasMouseHandler(mouseEvents);
470474

@@ -476,8 +480,8 @@ var p = Container.prototype = new createjs.DisplayObject();
476480
ctx.globalAlpha = mtx.alpha;
477481
this.draw(ctx);
478482
if (this._testHit(ctx)) {
479-
canvas.width = 0;
480-
canvas.width = 1;
483+
ctx.setTransform(1, 0, 0, 1, 0, 0)
484+
ctx.clearRect(0,0,1,1);
481485
return this;
482486
}
483487
}
@@ -513,8 +517,8 @@ var p = Container.prototype = new createjs.DisplayObject();
513517
ctx.setTransform(mtx.a, mtx.b, mtx.c, mtx.d, mtx.tx-x, mtx.ty-y);
514518
(hitArea||child).draw(ctx);
515519
if (!this._testHit(ctx)) { continue; }
516-
canvas.width = 0;
517-
canvas.width = 1;
520+
ctx.setTransform(1, 0, 0, 1, 0, 0);
521+
ctx.clearRect(0, 0, 1, 1);
518522
if (hasHandler) { return this; }
519523
else if (arr) { arr.push(child); }
520524
else { return child; }

‎src/easeljs/display/DisplayObject.js‎

Lines changed: 46 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -169,7 +169,7 @@ var p = DisplayObject.prototype;
169169
/**
170170
* Dispatched when the user double clicks their left mouse button over this display object.
171171
* See the {{#crossLink "MouseEvent"}}{{/crossLink}} class for a listing of event properties.
172-
* @event dblClick
172+
* @event dblclick
173173
* @since 0.6.0
174174
*/
175175

@@ -191,15 +191,15 @@ var p = DisplayObject.prototype;
191191
*/
192192

193193
/**
194-
* Dispatched on each display object on a stage whenever the stage updates.
195-
* This occurs immediately before the rendering (draw) pass. When {{#crossLink "Stage/update"}}{{/crossLink}} is called, first all display objects
196-
* on the stage dispatch the tick event, then all of the display objects are drawn to stage. Children will have their
194+
* Dispatched on each display object on a stage whenever the stage updates. This occurs immediately before the
195+
* rendering (draw) pass. When {{#crossLink "Stage/update"}}{{/crossLink}} is called, first all display objects on
196+
* the stage dispatch the tick event, then all of the display objects are drawn to stage. Children will have their
197197
* tick event dispatched in order of their depth prior to the event being dispatched on their parent.
198198
* @event tick
199199
* @param {Object} target The object that dispatched the event.
200200
* @param {String} type The event type.
201-
* @param {Array} params An array containing any arguments that were passed to the Stage.update() method.
202-
* For example if you called stage.update("hello"), then the params would be ["hello"].
201+
* @param {Array} params An array containing any arguments that were passed to the Stage.update() method. For
202+
* example if you called stage.update("hello"), then the params would be ["hello"].
203203
* @since 0.6.0
204204
*/
205205

@@ -230,10 +230,10 @@ var p = DisplayObject.prototype;
230230
p.id = -1;
231231

232232
/**
233-
* Indicates whether to include this object when running Stage.getObjectsUnderPoint(), and thus for mouse
234-
* interactions. Setting this to true for
235-
* Containers will cause the Container to be returned (not its children) regardless of whether it's mouseChildren property
236-
* is true.
233+
* Indicates whether to include this object when running mouse interactions. Setting this to `false` for children
234+
* of a {{#crossLink "Container"}}{{/crossLink}} will cause events on the Container to not fire when that child is
235+
* clicked. Note that setting this property to `false` does not prevent the {{#crossLink "Container/getObjectsUnderPoint"}}{{/crossLink}}
236+
* method from returning the child.
237237
* @property mouseEnabled
238238
* @type {Boolean}
239239
* @default true
@@ -249,8 +249,8 @@ var p = DisplayObject.prototype;
249249
p.name = null;
250250

251251
/**
252-
* A reference to the Container or Stage object that contains this display object, or null if it has not been added to
253-
* one. READ-ONLY.
252+
* A reference to the Container or Stage object that contains this display object, or null if it has not been added
253+
* to one. READ-ONLY.
254254
* @property parent
255255
* @final
256256
* @type {Container}
@@ -429,34 +429,33 @@ var p = DisplayObject.prototype;
429429

430430
/**
431431
* The onTick callback is called on each display object on a stage whenever the stage updates.
432-
* This occurs immediately before the rendering (draw) pass. When stage.update() is called, first all display objects
433-
* on the stage have onTick called, then all of the display objects are drawn to stage. Children will have their
434-
* onTick called in order of their depth prior to onTick being called on their parent.
435-
* <br/><br/>
436-
* Any parameters passed in to stage.update() are passed on to the onTick() handlers. For example, if you call
437-
* stage.update("hello"), all of the display objects with a handler will have onTick("hello") called.
432+
* This occurs immediately before the rendering (draw) pass. When stage.update() is called, first all display
433+
* objects on the stage have onTick called, then all of the display objects are drawn to stage. Children will have
434+
* their `onTick` called in order of their depth prior to onTick being called on their parent.
435+
*
436+
* Any parameters passed in to `stage.update()` are passed on to the `onTick()` handlers. For example, if you call
437+
* `stage.update("hello")`, all of the display objects with a handler will have `onTick("hello")` called.
438438
* @property onTick
439439
* @type {Function}
440440
* @deprecated In favour of the "tick" event. Will be removed in a future version.
441441
*/
442442
p.onTick = null;
443443

444444
/**
445-
* An array of Filter objects to apply to this display object. Filters are only applied / updated when cache() or
446-
* updateCache() is called on the display object, and only apply to the area that is cached.
445+
* An array of Filter objects to apply to this display object. Filters are only applied / updated when `cache()` or
446+
* `updateCache()` is called on the display object, and only apply to the area that is cached.
447447
* @property filters
448448
* @type {Array}
449449
* @default null
450450
**/
451451
p.filters = null;
452452

453453
/**
454-
* Returns an ID number that uniquely identifies the current cache for this display object.
455-
* This can be used to determine if the cache has changed since a previous check.
456-
* @property cacheID
457-
* @type {Number}
458-
* @default 0
459-
*/
454+
* Returns an ID number that uniquely identifies the current cache for this display object. This can be used to * determine if the cache has changed since a previous check.
455+
* @property cacheID
456+
* @type {Number}
457+
* @default 0
458+
*/
460459
p.cacheID = 0;
461460

462461
/**
@@ -469,21 +468,23 @@ var p = DisplayObject.prototype;
469468
p.mask = null;
470469

471470
/**
472-
* A display object that will be tested when checking mouse interactions or testing getObjectsUnderPoint. The hit area
473-
* will have its transformation applied relative to this display object's coordinate space (as though the hit test object were a child of this
474-
* display object and relative to its regX/Y). The hitArea will be tested using only its own alpha value regardless of the alpha value on
475-
* the target display object, or the target's ancestors (parents). hitArea is NOT currently used by the hitTest() method.
476-
*
477-
* Note that hitArea is not supported for Stage.
471+
* A display object that will be tested when checking mouse interactions or testing {{#crossLink "Container/getObjectsUnderPoint"}}{{/crossLink}}.
472+
* The hit area will have its transformation applied relative to this display object's coordinate space (as though
473+
* the hit test object were a child of this display object and relative to its regX/Y). The hitArea will be tested
474+
* using only its own `alpha` value regardless of the alpha value on the target display object, or the target's
475+
* ancestors (parents).
476+
*
477+
* Note that hitArea is NOT currently used by the `hitTest()` method, nor is it supported for {{#crossLink "Stage"}}{{/crossLink}}.
478478
* @property hitArea
479479
* @type {DisplayObject}
480480
* @default null
481481
*/
482482
p.hitArea = null;
483483

484484
/**
485-
* A CSS cursor (ex. "pointer", "help", "text", etc) that will be displayed when the user hovers over this display object. You must enable
486-
* mouseover events using the stage.enableMouseOver() method to use this property. If null it will use the default cursor.
485+
* A CSS cursor (ex. "pointer", "help", "text", etc) that will be displayed when the user hovers over this display
486+
* object. You must enable mouseover events using the {{#crossLink "Stage/enableMouseOver"}}{{/crossLink}} method to
487+
* use this property. If null it will use the default cursor.
487488
* @property cursor
488489
* @type {String}
489490
* @default null
@@ -580,13 +581,13 @@ var p = DisplayObject.prototype;
580581

581582
/**
582583
* Draws the display object into the specified context ignoring it's visible, alpha, shadow, and transform.
583-
* Returns true if the draw was handled (useful for overriding functionality).
584+
* Returns `true` if the draw was handled (useful for overriding functionality).
585+
*
584586
* NOTE: This method is mainly for internal use, though it may be useful for advanced uses.
585587
* @method draw
586588
* @param {CanvasRenderingContext2D} ctx The canvas 2D context object to draw into.
587-
* @param {Boolean} ignoreCache Indicates whether the draw operation should ignore any current cache.
588-
* For example, used for drawing the cache (to prevent it from simply drawing an existing cache back
589-
* into itself).
589+
* @param {Boolean} ignoreCache Indicates whether the draw operation should ignore any current cache. For example,
590+
* used for drawing the cache (to prevent it from simply drawing an existing cache back into itself).
590591
**/
591592
p.draw = function(ctx, ignoreCache) {
592593
var cacheCanvas = this.cacheCanvas;
@@ -597,9 +598,9 @@ var p = DisplayObject.prototype;
597598
}
598599

599600
/**
600-
* Applies this display object's transformation, alpha, globalCompositeOperation, clipping path (mask), and shadow to the specified
601-
* context. This is typically called prior to draw.
602-
* @method setupContext
601+
* Applies this display object's transformation, alpha, globalCompositeOperation, clipping path (mask), and shadow
602+
* to the specified context. This is typically called prior to {{#crossLink "DisplayObject/draw"}}{{/crossLink}}.
603+
* @method updateContext
603604
* @param {CanvasRenderingContext2D} ctx The canvas 2D to update.
604605
**/
605606
p.updateContext = function(ctx) {
@@ -639,7 +640,7 @@ var p = DisplayObject.prototype;
639640
* @param {Number} y The y coordinate origin for the cache region.
640641
* @param {Number} width The width of the cache region.
641642
* @param {Number} height The height of the cache region.
642-
* @param {Number} scale Optional. The scale at which the cache will be created. For example, if you cache a vector shape using
643+
* @param {Number} [scale=1] The scale at which the cache will be created. For example, if you cache a vector shape using
643644
* myShape.cache(0,0,100,100,2) then the resulting cacheCanvas will be 200x200 px. This lets you scale and rotate
644645
* cached elements with greater fidelity. Default is 1.
645646
**/
@@ -843,15 +844,12 @@ var p = DisplayObject.prototype;
843844
*/
844845
p.hitTest = function(x, y) {
845846
var ctx = DisplayObject._hitTestContext;
846-
var canvas = DisplayObject._hitTestCanvas;
847-
848-
ctx.setTransform(1, 0, 0, 1, -x, -y);
847+
ctx.setTransform(1, 0, 0, 1, -x, -y);
849848
this.draw(ctx);
850849

851850
var hit = this._testHit(ctx);
852-
853-
canvas.width = 0;
854-
canvas.width = 1;
851+
ctx.setTransform(1, 0, 0, 1, 0, 0);
852+
ctx.clearRect(0, 0, 1, 1);
855853
return hit;
856854
};
857855

‎src/easeljs/display/Graphics.js‎

Lines changed: 21 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -941,31 +941,37 @@ var p = Graphics.prototype;
941941
}
942942
return this;
943943
};
944-
944+
945945
/**
946946
* Decodes a compact encoded path string into a series of draw instructions.
947947
* This format is not intended to be human readable, and is meant for use by authoring tools.
948-
* The format uses a base64 character set, with each character representing 6 bits, to define a series of draw commands.
948+
* The format uses a base64 character set, with each character representing 6 bits, to define a series of draw
949+
* commands.
949950
*
950-
* Each command is comprised of a single "header" character followed by a variable number of alternating x and y position values.
951-
* Reading the header bits from left to right (most to least significant): bits 1 to 3 specify the type of operation
952-
* (0-moveTo, 1-lineTo, 2-quadraticCurveTo, 3-bezierCurveTo, 4-closePath, 5-7 unused). Bit 4 indicates whether position values use 12 bits (2 characters)
953-
* or 18 bits (3 characters), with a one indicating the latter. Bits 5 and 6 are currently unused.
951+
* Each command is comprised of a single "header" character followed by a variable number of alternating x and y
952+
* position values. Reading the header bits from left to right (most to least significant): bits 1 to 3 specify the
953+
* type of operation (0-moveTo, 1-lineTo, 2-quadraticCurveTo, 3-bezierCurveTo, 4-closePath, 5-7 unused). Bit 4
954+
* indicates whether position values use 12 bits (2 characters) or 18 bits (3 characters), with a one indicating the
955+
* latter. Bits 5 and 6 are currently unused.
954956
*
955-
* Following the header is a series of 0 (closePath), 2 (moveTo, lineTo), 4 (quadraticCurveTo), or 6 (bezierCurveTo) parameters.
956-
* These parameters are alternating x/y positions represented by 2 or 3 characters (as indicated by the 4th bit in the command char).
957-
* These characters consist of a 1 bit sign (1 is negative, 0 is positive), followed by an 11 (2 char) or 17 (3 char) bit integer value.
958-
* All position values are in tenths of a pixel.
959-
* Except in the case of move operations which are absolute, this value is a delta from the previous x or y position (as appropriate).
957+
* Following the header is a series of 0 (closePath), 2 (moveTo, lineTo), 4 (quadraticCurveTo), or 6 (bezierCurveTo)
958+
* parameters. These parameters are alternating x/y positions represented by 2 or 3 characters (as indicated by the
959+
* 4th bit in the command char). These characters consist of a 1 bit sign (1 is negative, 0 is positive), followed
960+
* by an 11 (2 char) or 17 (3 char) bit integer value. All position values are in tenths of a pixel. Except in the
961+
* case of move operations which are absolute, this value is a delta from the previous x or y position (as
962+
* appropriate).
960963
*
961964
* For example, the string "A3cAAMAu4AAA" represents a line starting at -150,0 and ending at 150,0.
962-
* <br />A - bits 000000. First 3 bits (000) indicate a moveTo operation. 4th bit (0) indicates 2 chars per parameter.
963-
* <br />n0 - 110111011100. Absolute x position of -150.0px. First bit indicates a negative value, remaining bits indicate 1500 tenths of a pixel.
965+
* <br />A - bits 000000. First 3 bits (000) indicate a moveTo operation. 4th bit (0) indicates 2 chars per
966+
* parameter.
967+
* <br />n0 - 110111011100. Absolute x position of -150.0px. First bit indicates a negative value, remaining bits
968+
* indicate 1500 tenths of a pixel.
964969
* <br />AA - 000000000000. Absolute y position of 0.
965970
* <br />I - 001100. First 3 bits (001) indicate a lineTo operation. 4th bit (1) indicates 3 chars per parameter.
966-
* <br />Au4 - 000000101110111000. An x delta of 300.0px, which is added to the previous x value of -150.0px to provide an absolute position of +150.0px.
971+
* <br />Au4 - 000000101110111000. An x delta of 300.0px, which is added to the previous x value of -150.0px to
972+
* provide an absolute position of +150.0px.
967973
* <br />AAA - 000000000000000000. A y delta value of 0.
968-
*
974+
*
969975
* @method decodePath
970976
* @param {String} str The path string to decode.
971977
* @return {Graphics} The Graphics instance the method is called on (useful for chaining calls.)

0 commit comments

Comments
 (0)