mirror of
https://github.com/konvajs/konva.git
synced 2025-04-05 20:48:28 +08:00
Sprite animations keys are now set to arrays of integers, not array of object literals containing x y width and height. changed index attr to frameIndex
This commit is contained in:
Eric Rowell
parent
e594aa5656
commit
4d8ee45f71
@ -25,7 +25,7 @@ module.exports = function(grunt) {
|
||||
'src/filters/Sepia.js',
|
||||
'src/filters/Solarize.js',
|
||||
//'src/filters/Ripple.js',
|
||||
//'src/filters/Kaleidoscope.js',
|
||||
'src/filters/Kaleidoscope.js',
|
||||
|
||||
// core
|
||||
'src/Animation.js',
|
||||
|
||||
@ -4,8 +4,7 @@
|
||||
* @constructor
|
||||
* @augments Kinetic.Shape
|
||||
* @param {Object} config
|
||||
* @param {Number} config.angle
|
||||
* @param {Number} config.angleDeg angle in degrees
|
||||
* @param {Number} config.angle in degrees
|
||||
* @param {Number} config.innerRadius
|
||||
* @param {Number} config.outerRadius
|
||||
* @param {Boolean} [config.clockwise]
|
||||
@ -13,13 +12,13 @@
|
||||
* @@nodeParams
|
||||
* @example
|
||||
* // draw a Arc that's pointing downwards<br>
|
||||
* var Arc = new Kinetic.Arc({<br>
|
||||
* var arc = new Kinetic.Arc({<br>
|
||||
* innerRadius: 40,<br>
|
||||
* outerRadius: 80,<br>
|
||||
* fill: 'red',<br>
|
||||
* stroke: 'black'<br>
|
||||
* strokeWidth: 5,<br>
|
||||
* angleDeg: 60,<br>
|
||||
* angle: 60,<br>
|
||||
* rotationDeg: -120<br>
|
||||
* });
|
||||
*/
|
||||
|
||||
@ -6,9 +6,10 @@
|
||||
* @memberof Kinetic
|
||||
* @augments Kinetic.Shape
|
||||
* @param {Object} config
|
||||
* @param {Array} config.points can be a flattened array of points, an array of point arrays, or an array of point objects.
|
||||
* e.g. [0,1,2,3], [[0,1],[2,3]] and [{x:0,y:1},{x:2,y:3}] are equivalent
|
||||
* @param {Number} [config.tension] default value is 1. Higher values will result in a more curvy line. A value of 0 will result in no interpolation.
|
||||
* @param {Array} config.points
|
||||
* @param {Number} [config.tension] Higher values will result in a more curvy line. A value of 0 will result in no interpolation.
|
||||
* The default is 0
|
||||
* @param {Boolean} [config.closed] defines whether or not the line shape is closed, creating a polygon or blob
|
||||
* @@shapeParams
|
||||
* @@nodeParams
|
||||
* @example
|
||||
@ -144,54 +145,57 @@
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Line, 'closed', false);
|
||||
|
||||
/**
|
||||
* get closed
|
||||
* @name getClosed
|
||||
* @method
|
||||
* @memberof Kinetic.Line.prototype
|
||||
* @returns {Boolean}
|
||||
*/
|
||||
|
||||
/**
|
||||
* set closed
|
||||
* @name setClosed
|
||||
* get/set closed flag. The default is false
|
||||
* @name closed
|
||||
* @method
|
||||
* @memberof Kinetic.Line.prototype
|
||||
* @param {Boolean} closed
|
||||
* @returns {Boolean}
|
||||
* @example
|
||||
* // get closed flag<br>
|
||||
* var closed = line.closed();<br><br>
|
||||
*
|
||||
* // close the shape<br>
|
||||
* line.closed(true);<br><br>
|
||||
*
|
||||
* // open the shape<br>
|
||||
* line.closed(false);
|
||||
*/
|
||||
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Line, 'tension', 0);
|
||||
|
||||
/**
|
||||
* get tension
|
||||
* @name getTension
|
||||
* get/set tension
|
||||
* @name tension
|
||||
* @method
|
||||
* @memberof Kinetic.Line.prototype
|
||||
* @param {Number} Higher values will result in a more curvy line. A value of 0 will result in no interpolation.
|
||||
* The default is 0
|
||||
* @returns {Number}
|
||||
*/
|
||||
|
||||
/**
|
||||
* set tension
|
||||
* @name setTension
|
||||
* @method
|
||||
* @memberof Kinetic.Line.prototype
|
||||
* @param {Number} tension
|
||||
* @example
|
||||
* // get tension<br>
|
||||
* var tension = line.tension();<br><br>
|
||||
*
|
||||
* // set tension<br>
|
||||
* line.tension(3);
|
||||
*/
|
||||
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Line, 'points');
|
||||
/**
|
||||
* get points array
|
||||
* @name getPoints
|
||||
* get/set points array
|
||||
* @name points
|
||||
* @method
|
||||
* @memberof Kinetic.Line.prototype
|
||||
* @param {Array} points
|
||||
* @returns {Array}
|
||||
*/
|
||||
|
||||
/**
|
||||
* set points array
|
||||
* @name setPoints
|
||||
* @method
|
||||
* @memberof Kinetic.Line.prototype
|
||||
* @param {Array} can be an array of point objects or an array
|
||||
* of Numbers. e.g. [{x:1,y:2},{x:3,y:4}] or [1,2,3,4]
|
||||
* @example
|
||||
* // get points<br>
|
||||
* var points = line.points();<br><br>
|
||||
*
|
||||
* // set points<br>
|
||||
* line.points([10, 20, 30, 40, 50, 60]);<br><br>
|
||||
*
|
||||
* // push a new point<br>
|
||||
* line.points(line.points().concat([70, 80]));
|
||||
*/
|
||||
})();
|
||||
@ -59,21 +59,18 @@
|
||||
Kinetic.Util.extend(Kinetic.Rect, Kinetic.Shape);
|
||||
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Rect, 'cornerRadius', 0);
|
||||
|
||||
/**
|
||||
* set corner radius
|
||||
* @name setCornerRadius
|
||||
* @method
|
||||
* @memberof Kinetic.Rect.prototype
|
||||
* @param {Number} corner radius
|
||||
*/
|
||||
|
||||
/**
|
||||
* get corner radius
|
||||
* @name getCornerRadius
|
||||
* get/set corner radius
|
||||
* @name cornerRadius
|
||||
* @method
|
||||
* @memberof Kinetic.Rect.prototype
|
||||
* @param {Number} cornerRadius
|
||||
* @returns {Number}
|
||||
* @example
|
||||
* // get corner radius<br>
|
||||
* var cornerRadius = rect.cornerRadius();<br><br>
|
||||
*
|
||||
* // set corner radius<br>
|
||||
* rect.cornerRadius(10);
|
||||
*/
|
||||
|
||||
})();
|
||||
|
||||
@ -7,15 +7,14 @@
|
||||
* @constructor
|
||||
* @augments Kinetic.Shape
|
||||
* @param {Object} config
|
||||
* @param {Number} config.angle
|
||||
* @param {Number} config.angleDeg angle in degrees
|
||||
* @param {Number} config.angle in degrees
|
||||
* @param {Number} config.innerRadius
|
||||
* @param {Number} config.outerRadius
|
||||
* @param {Boolean} [config.clockwise]
|
||||
* @@shapeParams
|
||||
* @@nodeParams
|
||||
* @example
|
||||
* var Ring = new Kinetic.Ring({<br>
|
||||
* var ring = new Kinetic.Ring({<br>
|
||||
* innerRadius: 40,<br>
|
||||
* outerRadius: 80,<br>
|
||||
* fill: 'red',<br>
|
||||
@ -69,19 +68,18 @@
|
||||
});
|
||||
|
||||
/**
|
||||
* set innerRadius
|
||||
* @name setInnerRadius
|
||||
* get/set innerRadius
|
||||
* @name innerRadius
|
||||
* @method
|
||||
* @memberof Kinetic.Ring.prototype
|
||||
* @param {Number} innerRadius
|
||||
*/
|
||||
|
||||
/**
|
||||
* get innerRadius
|
||||
* @name getInnerRadius
|
||||
* @method
|
||||
* @memberof Kinetic.Ring.prototype
|
||||
* @returns {Number}
|
||||
* @example
|
||||
* // get inner radius<br>
|
||||
* var innerRadius = ring.innerRadius();<br><br>
|
||||
*
|
||||
* // set inner radius<br>
|
||||
* ring.innerRadius(20);
|
||||
*/
|
||||
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Ring, 'outerRadius', function() {
|
||||
@ -89,18 +87,17 @@
|
||||
});
|
||||
|
||||
/**
|
||||
* set outerRadius
|
||||
* @name setOuterRadius
|
||||
* @method
|
||||
* @memberof Kinetic.Ring.prototype
|
||||
* @param {Number} innerRadius
|
||||
*/
|
||||
|
||||
/**
|
||||
* get outerRadius
|
||||
* @name getOuterRadius
|
||||
* get/set outerRadius
|
||||
* @name outerRadius
|
||||
* @method
|
||||
* @memberof Kinetic.Ring.prototype
|
||||
* @param {Number} outerRadius
|
||||
* @returns {Number}
|
||||
* @example
|
||||
* // get outer radius<br>
|
||||
* var outerRadius = ring.outerRadius();<br><br>
|
||||
*
|
||||
* // set outer radius<br>
|
||||
* ring.outerRadius(20);
|
||||
*/
|
||||
})();
|
||||
|
||||
@ -12,56 +12,35 @@
|
||||
* @@shapeParams
|
||||
* @@nodeParams
|
||||
* @example
|
||||
* var animations = {<br>
|
||||
* idle: [{<br>
|
||||
* x: 2,<br>
|
||||
* y: 2,<br>
|
||||
* width: 70,<br>
|
||||
* height: 119<br>
|
||||
* }, {<br>
|
||||
* x: 71,<br>
|
||||
* y: 2,<br>
|
||||
* width: 74,<br>
|
||||
* height: 119<br>
|
||||
* }, {<br>
|
||||
* x: 146,<br>
|
||||
* y: 2,<br>
|
||||
* width: 81,<br>
|
||||
* height: 119<br>
|
||||
* }, {<br>
|
||||
* x: 226,<br>
|
||||
* y: 2,<br>
|
||||
* width: 76,<br>
|
||||
* height: 119<br>
|
||||
* }],<br>
|
||||
* punch: [{<br>
|
||||
* x: 2,<br>
|
||||
* y: 138,<br>
|
||||
* width: 74,<br>
|
||||
* height: 122<br>
|
||||
* }, {<br>
|
||||
* x: 76,<br>
|
||||
* y: 138,<br>
|
||||
* width: 84,<br>
|
||||
* height: 122<br>
|
||||
* }, {<br>
|
||||
* x: 346,<br>
|
||||
* y: 138,<br>
|
||||
* width: 120,<br>
|
||||
* height: 122<br>
|
||||
* }]<br>
|
||||
* };<br><br>
|
||||
*
|
||||
* var imageObj = new Image();<br>
|
||||
* imageObj.onload = function() {<br>
|
||||
* var sprite = new Kinetic.Sprite({<br>
|
||||
* x: 200,<br>
|
||||
* y: 100,<br>
|
||||
* image: imageObj,<br>
|
||||
* animation: 'idle',<br>
|
||||
* animations: animations,<br>
|
||||
* animation: 'standing',<br>
|
||||
* animations: {<br>
|
||||
* standing: [<br>
|
||||
* // x, y, width, height (6 frames)<br>
|
||||
* 0, 0, 49, 109,<br>
|
||||
* 52, 0, 49, 109,<br>
|
||||
* 105, 0, 49, 109,<br>
|
||||
* 158, 0, 49, 109,<br>
|
||||
* 210, 0, 49, 109,<br>
|
||||
* 262, 0, 49, 109<br>
|
||||
* ],<br>
|
||||
* kicking: [<br>
|
||||
* // x, y, width, height (6 frames)<br>
|
||||
* 0, 109, 45, 98,<br>
|
||||
* 45, 109, 45, 98,<br>
|
||||
* 95, 109, 63, 98,<br>
|
||||
* 156, 109, 70, 98,<br>
|
||||
* 229, 109, 60, 98,<br>
|
||||
* 287, 109, 41, 98<br>
|
||||
* ]<br>
|
||||
* },<br>
|
||||
* frameRate: 7,<br>
|
||||
* index: 0<br>
|
||||
* frameIndex: 0<br>
|
||||
* });<br>
|
||||
* };<br>
|
||||
* imageObj.src = '/path/to/image.jpg'
|
||||
@ -79,7 +58,7 @@
|
||||
this.anim = new Kinetic.Animation();
|
||||
this.on('animationChange.kinetic', function() {
|
||||
// reset index when animation changes
|
||||
this.setIndex(0);
|
||||
this.frameIndex(0);
|
||||
});
|
||||
|
||||
this.sceneFunc(this._sceneFunc);
|
||||
@ -87,21 +66,29 @@
|
||||
},
|
||||
_sceneFunc: function(context) {
|
||||
var anim = this.getAnimation(),
|
||||
index = this.getIndex(),
|
||||
f = this.getAnimations()[anim][index],
|
||||
index = this.frameIndex(),
|
||||
ix4 = index * 4,
|
||||
set = this.getAnimations()[anim],
|
||||
x = set[ix4 + 0],
|
||||
y = set[ix4 + 1],
|
||||
width = set[ix4 + 2],
|
||||
height = set[ix4 + 3],
|
||||
image = this.getImage();
|
||||
|
||||
if(image) {
|
||||
context.drawImage(image, f.x, f.y, f.width, f.height, 0, 0, f.width, f.height);
|
||||
context.drawImage(image, x, y, width, height, 0, 0, width, height);
|
||||
}
|
||||
},
|
||||
_hitFunc: function(context) {
|
||||
var anim = this.getAnimation(),
|
||||
index = this.getIndex(),
|
||||
f = this.getAnimations()[anim][index];
|
||||
index = this.frameIndex(),
|
||||
ix4 = index * 4,
|
||||
set = this.getAnimations()[anim],
|
||||
width = set[ix4 + 2],
|
||||
height = set[ix4 + 3];
|
||||
|
||||
context.beginPath();
|
||||
context.rect(0, 0, f.width, f.height);
|
||||
context.rect(0, 0, width, height);
|
||||
context.closePath();
|
||||
context.fillShape(this);
|
||||
},
|
||||
@ -141,17 +128,17 @@
|
||||
clearInterval(this.interval);
|
||||
},
|
||||
_updateIndex: function() {
|
||||
var index = this.getIndex(),
|
||||
var index = this.frameIndex(),
|
||||
animation = this.getAnimation(),
|
||||
animations = this.getAnimations(),
|
||||
anim = animations[animation],
|
||||
len = anim.length;
|
||||
len = anim.length / 4;
|
||||
|
||||
if(index < len - 1) {
|
||||
this.setIndex(index + 1);
|
||||
this.frameIndex(index + 1);
|
||||
}
|
||||
else {
|
||||
this.setIndex(0);
|
||||
this.frameIndex(0);
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -161,92 +148,106 @@
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Sprite, 'animation');
|
||||
|
||||
/**
|
||||
* set animation key
|
||||
* @name setAnimation
|
||||
* get/set animation key
|
||||
* @name animation
|
||||
* @method
|
||||
* @memberof Kinetic.Sprite.prototype
|
||||
* @param {String} anim animation key
|
||||
*/
|
||||
|
||||
/**
|
||||
* get animation key
|
||||
* @name getAnimation
|
||||
* @method
|
||||
* @memberof Kinetic.Sprite.prototype
|
||||
* @returns {String}
|
||||
* @example
|
||||
* // get animation key<br>
|
||||
* var animation = sprite.animation();<br><br>
|
||||
*
|
||||
* // set animation key<br>
|
||||
* sprite.animation('kicking');
|
||||
*/
|
||||
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Sprite, 'animations');
|
||||
|
||||
/**
|
||||
* set animations map
|
||||
* @name setAnimations
|
||||
* get/set animations map
|
||||
* @name animations
|
||||
* @method
|
||||
* @memberof Kinetic.Sprite.prototype
|
||||
* @param {Object} animations
|
||||
*/
|
||||
|
||||
/**
|
||||
* get animations map
|
||||
* @name getAnimations
|
||||
* @method
|
||||
* @memberof Kinetic.Sprite.prototype
|
||||
* @returns {Object}
|
||||
* @example
|
||||
* // get animations map<br>
|
||||
* var animations = sprite.animations();<br><br>
|
||||
*
|
||||
* // set animations map<br>
|
||||
* sprite.animations({<br>
|
||||
* standing: [<br>
|
||||
* // x, y, width, height (6 frames)<br>
|
||||
* 0, 0, 49, 109,<br>
|
||||
* 52, 0, 49, 109,<br>
|
||||
* 105, 0, 49, 109,<br>
|
||||
* 158, 0, 49, 109,<br>
|
||||
* 210, 0, 49, 109,<br>
|
||||
* 262, 0, 49, 109<br>
|
||||
* ],<br>
|
||||
* kicking: [<br>
|
||||
* // x, y, width, height (6 frames)<br>
|
||||
* 0, 109, 45, 98,<br>
|
||||
* 45, 109, 45, 98,<br>
|
||||
* 95, 109, 63, 98,<br>
|
||||
* 156, 109, 70, 98,<br>
|
||||
* 229, 109, 60, 98,<br>
|
||||
* 287, 109, 41, 98<br>
|
||||
* ]<br>
|
||||
* });
|
||||
*/
|
||||
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Sprite, 'image');
|
||||
|
||||
/**
|
||||
* set image
|
||||
* @name setImage
|
||||
* get/set image
|
||||
* @name image
|
||||
* @method
|
||||
* @memberof Kinetic.Sprite.prototype
|
||||
* @param {Image} image
|
||||
* @returns {Image}
|
||||
* @example
|
||||
* // get image
|
||||
* var image = sprite.image();<br><br>
|
||||
*
|
||||
* // set image<br>
|
||||
* sprite.image(imageObj);
|
||||
*/
|
||||
|
||||
/**
|
||||
* get image
|
||||
* @name getImage
|
||||
* @method
|
||||
* @memberof Kinetic.Sprite.prototype
|
||||
* @returns {ImageObject}
|
||||
*/
|
||||
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Sprite, 'index', 0);
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Sprite, 'frameIndex', 0);
|
||||
|
||||
/**
|
||||
* set animation frame index
|
||||
* @name setIndex
|
||||
* @method
|
||||
* @memberof Kinetic.Sprite.prototype
|
||||
* @param {Integer} index frame index
|
||||
*/
|
||||
|
||||
/**
|
||||
* get animation frame index
|
||||
* @name getIndex
|
||||
* set/set animation frame index
|
||||
* @name frameIndex
|
||||
* @method
|
||||
* @memberof Kinetic.Sprite.prototype
|
||||
* @param {Integer} frameIndex
|
||||
* @returns {Integer}
|
||||
* @example
|
||||
* // get animation frame index<br>
|
||||
* var frameIndex = sprite.frameIndex();<br><br>
|
||||
*
|
||||
* // set animation frame index<br>
|
||||
* sprite.frameIndex(3);
|
||||
*/
|
||||
|
||||
Kinetic.Factory.addGetterSetter(Kinetic.Sprite, 'frameRate', 17);
|
||||
|
||||
/**
|
||||
* set frame rate in frames / second. Default is 17 frames per second. Increase this number to make the sprite
|
||||
* get/set frame rate in frames per second. Increase this number to make the sprite
|
||||
* animation run faster, and decrease the number to make the sprite animation run slower
|
||||
* @name setFrameRate
|
||||
* The default is 17 frames per second
|
||||
* @name frameRate
|
||||
* @method
|
||||
* @memberof Kinetic.Sprite.prototype
|
||||
* @param {Integer} frameRate
|
||||
* @returns {Integer}
|
||||
* @example
|
||||
* // get frame rate<br>
|
||||
* var frameRate = sprite.frameRate();<br><br>
|
||||
*
|
||||
* // set frame rate to 2 frames per second<br>
|
||||
* sprite.frameRate(2);
|
||||
*/
|
||||
|
||||
/**
|
||||
* get frame rate
|
||||
* @name getFrameRate
|
||||
* @method
|
||||
* @memberof Kinetic.Sprite.prototype
|
||||
* @returns {Number}
|
||||
*/
|
||||
|
||||
})();
|
||||
|
||||
@ -94,10 +94,10 @@
|
||||
<script src="unit/filters/Sepia-test.js"></script>
|
||||
<script src="unit/filters/Emboss-test.js"></script>
|
||||
<script src="unit/filters/Solarize-test.js"></script>
|
||||
|
||||
<script src="unit/filters/Kaleidoscope-test.js"></script>
|
||||
<!--
|
||||
<script src="unit/filters/Ripple-test.js"></script>
|
||||
<script src="unit/filters/Kaleidoscope-test.js"></script>
|
||||
|
||||
-->
|
||||
|
||||
|
||||
|
||||
@ -798,88 +798,34 @@ suite('Node', function() {
|
||||
var stage = addStage();
|
||||
var layer = new Kinetic.Layer();
|
||||
|
||||
var anims = {
|
||||
standing: [{
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}, {
|
||||
x: 52,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}, {
|
||||
x: 105,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}, {
|
||||
x: 158,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}, {
|
||||
x: 210,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}, {
|
||||
x: 262,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}],
|
||||
|
||||
kicking: [{
|
||||
x: 0,
|
||||
y: 109,
|
||||
width: 45,
|
||||
height: 98
|
||||
}, {
|
||||
x: 45,
|
||||
y: 109,
|
||||
width: 45,
|
||||
height: 98
|
||||
}, {
|
||||
x: 95,
|
||||
y: 109,
|
||||
width: 63,
|
||||
height: 98
|
||||
}, {
|
||||
x: 156,
|
||||
y: 109,
|
||||
width: 70,
|
||||
height: 98
|
||||
}, {
|
||||
x: 229,
|
||||
y: 109,
|
||||
width: 60,
|
||||
height: 98
|
||||
}, {
|
||||
x: 287,
|
||||
y: 109,
|
||||
width: 41,
|
||||
height: 98
|
||||
}]
|
||||
};
|
||||
|
||||
//for(var n = 0; n < 50; n++) {
|
||||
sprite = new Kinetic.Sprite({
|
||||
//x: Math.random() * stage.getWidth() - 30,
|
||||
var sprite = new Kinetic.Sprite({
|
||||
x: 200,
|
||||
//y: Math.random() * stage.getHeight() - 50,
|
||||
y: 50,
|
||||
image: imageObj,
|
||||
animation: 'standing',
|
||||
animations: anims,
|
||||
index: 0,
|
||||
frameRate: Math.random() * 6 + 6,
|
||||
animations: {
|
||||
standing: [
|
||||
0, 0, 49, 109,
|
||||
52, 0, 49, 109,
|
||||
105, 0, 49, 109,
|
||||
158, 0, 49, 109,
|
||||
210, 0, 49, 109,
|
||||
262, 0, 49, 109
|
||||
],
|
||||
kicking: [
|
||||
0, 109, 45, 98,
|
||||
45, 109, 45, 98,
|
||||
95, 109, 63, 98,
|
||||
156, 109, 70, 98,
|
||||
229, 109, 60, 98,
|
||||
287, 109, 41, 98
|
||||
]
|
||||
},
|
||||
frameRate: 10,
|
||||
draggable: true,
|
||||
shadowColor: 'black',
|
||||
shadowBlur: 3,
|
||||
shadowOffset: [3, 1],
|
||||
shadowOffset: {x: 3, y:1},
|
||||
shadowOpacity: 0.3
|
||||
});
|
||||
|
||||
@ -958,39 +904,6 @@ suite('Node', function() {
|
||||
showHit(layer);
|
||||
});
|
||||
|
||||
// ======================================================
|
||||
test('node caching width minimal configuration', function(done) {
|
||||
var stage = addStage();
|
||||
var layer = new Kinetic.Layer();
|
||||
stage.add(layer);
|
||||
|
||||
var rect = new Kinetic.Rect({
|
||||
width : 50,
|
||||
height : 50,
|
||||
fill: 'green',
|
||||
stroke: 'blue',
|
||||
strokeWidth: 5,
|
||||
draggable: true
|
||||
});
|
||||
|
||||
rect.toImage({
|
||||
callback: function(imageObj) {
|
||||
assert.equal(Kinetic.Util._isElement(imageObj), true);
|
||||
var cachedShape = new Kinetic.Image({
|
||||
image: imageObj,
|
||||
draggable: true,
|
||||
stroke: 'red',
|
||||
strokeWidth: 5
|
||||
});
|
||||
|
||||
layer.add(cachedShape);
|
||||
layer.draw();
|
||||
done();
|
||||
}
|
||||
});
|
||||
|
||||
showHit(layer);
|
||||
});
|
||||
// ======================================================
|
||||
test('hide group', function() {
|
||||
var stage = addStage();
|
||||
|
||||
@ -6,87 +6,35 @@ suite('Sprite', function() {
|
||||
var stage = addStage();
|
||||
var layer = new Kinetic.Layer();
|
||||
|
||||
var anims = {
|
||||
standing: [{
|
||||
x: 0,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}, {
|
||||
x: 52,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}, {
|
||||
x: 105,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}, {
|
||||
x: 158,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}, {
|
||||
x: 210,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}, {
|
||||
x: 262,
|
||||
y: 0,
|
||||
width: 49,
|
||||
height: 109
|
||||
}],
|
||||
|
||||
kicking: [{
|
||||
x: 0,
|
||||
y: 109,
|
||||
width: 45,
|
||||
height: 98
|
||||
}, {
|
||||
x: 45,
|
||||
y: 109,
|
||||
width: 45,
|
||||
height: 98
|
||||
}, {
|
||||
x: 95,
|
||||
y: 109,
|
||||
width: 63,
|
||||
height: 98
|
||||
}, {
|
||||
x: 156,
|
||||
y: 109,
|
||||
width: 70,
|
||||
height: 98
|
||||
}, {
|
||||
x: 229,
|
||||
y: 109,
|
||||
width: 60,
|
||||
height: 98
|
||||
}, {
|
||||
x: 287,
|
||||
y: 109,
|
||||
width: 41,
|
||||
height: 98
|
||||
}]
|
||||
};
|
||||
|
||||
//for(var n = 0; n < 50; n++) {
|
||||
sprite = new Kinetic.Sprite({
|
||||
//x: Math.random() * stage.getWidth() - 30,
|
||||
var sprite = new Kinetic.Sprite({
|
||||
x: 200,
|
||||
//y: Math.random() * stage.getHeight() - 50,
|
||||
y: 50,
|
||||
image: imageObj,
|
||||
animation: 'standing',
|
||||
animations: anims,
|
||||
frameRate: Math.random() * 6 + 6,
|
||||
animations: {
|
||||
standing: [
|
||||
0, 0, 49, 109,
|
||||
52, 0, 49, 109,
|
||||
105, 0, 49, 109,
|
||||
158, 0, 49, 109,
|
||||
210, 0, 49, 109,
|
||||
262, 0, 49, 109
|
||||
],
|
||||
kicking: [
|
||||
0, 109, 45, 98,
|
||||
45, 109, 45, 98,
|
||||
95, 109, 63, 98,
|
||||
156, 109, 70, 98,
|
||||
229, 109, 60, 98,
|
||||
287, 109, 41, 98
|
||||
]
|
||||
},
|
||||
frameRate: 10,
|
||||
draggable: true,
|
||||
shadowColor: 'black',
|
||||
shadowBlur: 3,
|
||||
shadowOffset: [3, 1],
|
||||
shadowOffset: {x: 3, y:1},
|
||||
shadowOpacity: 0.3
|
||||
});
|
||||
|
||||
@ -94,7 +42,7 @@ suite('Sprite', function() {
|
||||
stage.add(layer);
|
||||
|
||||
assert.equal(sprite.getClassName(), 'Sprite');
|
||||
assert.equal(sprite.getIndex(), 0);
|
||||
assert.equal(sprite.frameIndex(), 0);
|
||||
|
||||
showHit(layer);
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user