Merge pull request #12648 from ivanpopelyshev/types-2.0

Typings for pixi.js v4 and pixi-spine v1.3
This commit is contained in:
Nathan Shively-Sanders
2016-11-22 12:57:17 -08:00
committed by GitHub
6 changed files with 7756 additions and 2130 deletions
+1034 -809
View File
File diff suppressed because it is too large Load Diff
+12 -12
View File
@@ -1,5 +1,5 @@
/// <reference types="pixi.js" />
/// <reference types="pixi-spine" />
namespace Spine {
@@ -48,7 +48,7 @@ namespace Spine {
this.stage.addChild(dragonCage);
// once position and scaled, set the animation to play
this.dragon.state.setAnimationByName(0, 'flying', true);
this.dragon.state.setAnimation(0, 'flying', true);
this.animate();
@@ -186,10 +186,10 @@ namespace Spine {
this.stage.addChild(this.pixie);
this.pixie.stateData.setMixByName('running', 'jump', 0.2);
this.pixie.stateData.setMixByName('jump', 'running', 0.4);
this.pixie.stateData.setMix('running', 'jump', 0.2);
this.pixie.stateData.setMix('jump', 'running', 0.4);
this.pixie.state.setAnimationByName(0, 'running', true);
this.pixie.state.setAnimation(0, 'running', true);
this.stage.on('mousedown', this.onTouchStart);
this.stage.on('touchstart', this.onTouchStart);
@@ -200,8 +200,8 @@ namespace Spine {
private onTouchStart = (): void => {
this.pixie.state.setAnimationByName(0, 'jump', false);
this.pixie.state.addAnimationByName(0, 'running', true, 0);
this.pixie.state.setAnimation(0, 'jump', false);
this.pixie.state.addAnimation(0, 'running', true, 0);
}
@@ -277,19 +277,19 @@ namespace Spine {
this.spineboy.scale.set(1.5);
// set up the mixes!
this.spineboy.stateData.setMixByName('walk', 'jump', 0.2);
this.spineboy.stateData.setMixByName('jump', 'walk', 0.4);
this.spineboy.stateData.setMix('walk', 'jump', 0.2);
this.spineboy.stateData.setMix('jump', 'walk', 0.4);
// play animation
this.spineboy.state.setAnimationByName(0, 'walk', true);
this.spineboy.state.setAnimation(0, 'walk', true);
this.stage.addChild(this.spineboy);
this.stage.on('click', () => {
this.spineboy.state.setAnimationByName(0, 'jump', false);
this.spineboy.state.addAnimationByName(0, 'walk', true, 0);
this.spineboy.state.setAnimation(0, 'jump', false);
this.spineboy.state.addAnimation(0, 'walk', true, 0);
});
+2174 -1285
View File
File diff suppressed because it is too large Load Diff
+27 -24
View File
@@ -209,7 +209,7 @@ namespace basics {
private animate = (): void => {
this.filter.uniforms.customUniform.value += 0.04;
this.filter.uniforms['customUniform'].value += 0.04;
this.renderer.render(this.stage);
requestAnimationFrame(this.animate);
@@ -218,9 +218,9 @@ namespace basics {
}
export class CustomizedFilter extends PIXI.AbstractFilter {
export class CustomizedFilter extends PIXI.Filter {
constructor(fragmentSource: string | string[]) {
constructor(fragmentSource: string) {
super(null, fragmentSource, {
customUniform: {
type: '1f',
@@ -337,7 +337,7 @@ namespace basics {
};
this.renderTexture = new PIXI.RenderTexture(this.renderer, 300, 200, PIXI.SCALE_MODES.LINEAR, 0.1);
this.renderTexture = PIXI.RenderTexture.create(300, 200, PIXI.SCALE_MODES.LINEAR, 0.1);
this.sprite = new PIXI.Sprite(this.renderTexture);
this.sprite.x = 450;
@@ -354,7 +354,7 @@ namespace basics {
private animate = (): void => {
this.renderTexture.render(this.container);
this.renderer.render(this.container, this.renderTexture)
requestAnimationFrame(this.animate);
@@ -374,7 +374,7 @@ namespace basics {
private stage: PIXI.Container;
private movie: PIXI.extras.MovieClip;
private movie: PIXI.extras.AnimatedSprite;
constructor() {
@@ -398,11 +398,11 @@ namespace basics {
}
// create a MovieClip (brings back memories from the days of Flash, right ?)
this.movie = new PIXI.extras.MovieClip(frames);
// create a AnimatedSprite (brings back memories from the days of Flash, right ?)
this.movie = new PIXI.extras.AnimatedSprite(frames);
/*
* A MovieClip inherits all the properties of a PIXI sprite
* A AnimatedSprite inherits all the properties of a PIXI sprite
* so you can change its position, its anchor, mask it, etc
*/
this.movie.position.set(300);
@@ -460,8 +460,11 @@ namespace basics {
this.stage.addChild(this.basicText);
var style: PIXI.TextStyle = {
font: '36px Arial bold italic',
fill: PIXI.utils.hex2string(0xF7EDCA),
fontSize: 36,
fontFamily: 'Arial',
fontWeight: 'bold',
fontStyle: 'italic',
fill: '#F7EDCA',
stroke: '#4a1850',
strokeThickness: 5,
dropShadow: true,
@@ -783,7 +786,7 @@ namespace demos {
private stage: PIXI.Container;
private sprites: PIXI.ParticleContainer;
private sprites: PIXI.particles.ParticleContainer;
private maggots: BatchDude[];
@@ -799,7 +802,7 @@ namespace demos {
// create the root of the scene graph
this.stage = new PIXI.Container();
this.sprites = new PIXI.ParticleContainer(10000, {
this.sprites = new PIXI.particles.ParticleContainer(10000, {
scale: true,
position: true,
@@ -1706,7 +1709,7 @@ namespace demos {
this.stage.on('click', this.onClick);
this.stage.on('tap', this.onClick);
this.help = new PIXI.Text('Click to turn masking on / off.', { font: 'bold 12pt Arial', fill: 'white' });
this.help = new PIXI.Text('Click to turn masking on / off.', { fontFamily: 'Arial', fontSize: 12, fontWeight: 'bold', fill: 'white' });
this.help.position.y = this.renderer.height - 26;
this.help.position.x = 10;
this.stage.addChild(this.help);
@@ -1763,7 +1766,7 @@ namespace demos {
namespace demos {
export class MovieClipDemo {
export class AnimatedSpriteDemo {
private renderer: PIXI.CanvasRenderer | PIXI.WebGLRenderer;
@@ -1801,8 +1804,8 @@ namespace demos {
for (i = 0; i < 50; i++) {
// create an explosion MovieClip
var explosion = new PIXI.extras.MovieClip(explosionTextures);
// create an explosion AnimatedSprite
var explosion = new PIXI.extras.AnimatedSprite(explosionTextures);
explosion.position.x = Math.random() * 800;
explosion.position.y = Math.random() * 600;
@@ -1862,8 +1865,8 @@ namespace demos {
this.stage = new PIXI.Container();
// create two render textures... these dynamic textures will be used to draw the scene into itself
this.renderTexture = new PIXI.RenderTexture(this.renderer, this.renderer.width, this.renderer.height);
this.renderTexture2 = new PIXI.RenderTexture(this.renderer, this.renderer.width, this.renderer.height);
this.renderTexture = PIXI.RenderTexture.create(this.renderer.width, this.renderer.height);
this.renderTexture2 = PIXI.RenderTexture.create(this.renderer.width, this.renderer.height);
this.currentTexture = this.renderTexture;
// create a new sprite that uses the render texture we created above
@@ -1946,7 +1949,7 @@ namespace demos {
// render the stage to the texture
// the 'true' clears the texture before the content is rendered
this.renderTexture2.render(this.stage, null, false);
this.renderer.render(this.stage, this.renderTexture2, false);
// and finally render the stage
this.renderer.render(this.stage);
@@ -2087,11 +2090,11 @@ namespace demos {
this.stage.addChild(this.background);
// create some white text using the Snippet webfont
this.textSample = new PIXI.Text('Pixi.js can has\n multiline text!', { font: '35px Snippet', fill: 'white', align: 'left' });
this.textSample = new PIXI.Text('Pixi.js can has\n multiline text!', { fontSize: 35, fontFamily: 'Snippet', fill: 'white', align: 'left' });
this.textSample.position.set(20);
// create a text object with a nice stroke
this.spinningText = new PIXI.Text('I\'m fun!', { font: 'bold 60px Arial', fill: '#cc00ff', align: 'center', stroke: '#FFFFFF', strokeThickness: 6 });
this.spinningText = new PIXI.Text('I\'m fun!', { fontWeight: 'bold', fontSize: 60, fontFamily: 'Arial', fill: '#cc00ff', align: 'center', stroke: '#FFFFFF', strokeThickness: 6 });
// setting the anchor point to 0.5 will center align the text... great for spinning!
this.spinningText.anchor.set(0.5);
@@ -2099,7 +2102,7 @@ namespace demos {
this.spinningText.position.y = 200;
// create a text object that will be updated...
this.countingText = new PIXI.Text('COUNT 4EVAR: 0', { font: 'bold italic 60px Arvo', fill: '#3e1707', align: 'center', stroke: '#a4410e', strokeThickness: 7 });
this.countingText = new PIXI.Text('COUNT 4EVAR: 0', { fontWeight: 'bold', fontStyle: 'italic', fontSize: 60, fontFamily: 'Arvo', fill: '#3e1707', align: 'center', stroke: '#a4410e', strokeThickness: 7 });
this.countingText.position.x = 310;
this.countingText.position.y = 320;
@@ -2704,7 +2707,7 @@ namespace filters {
this.stage.on('tap', this.onClick);
this.help = new PIXI.Text('Click to turn filters on / off.', { font: 'bold 12pt Arial', fill: 'white' });
this.help = new PIXI.Text('Click to turn filters on / off.', { fontWeight: 'bold', fontSize: 12, fontFamily: 'Arial', fill: 'white' });
this.help.position.y = this.renderer.height - 25;
this.help.position.x = 10;
File diff suppressed because it is too large Load Diff
+1748
View File
File diff suppressed because it is too large Load Diff