diff options
author | Justin Worthe <justin.worthe@gmail.com> | 2014-07-19 11:58:25 +0200 |
---|---|---|
committer | Justin Worthe <justin.worthe@gmail.com> | 2014-07-19 11:58:25 +0200 |
commit | 10d101e5fee782f6370c93ac2e39ebc96054ea4b (patch) | |
tree | 4904a8da7aded89b3d588ac43c0d64d13dbd3f5b | |
parent | 76c53168629511ec46124ed221044d210e4f87c6 (diff) |
Fixed animation issue on players
-rw-r--r-- | assets/images/player-a-spritesheet.svg | 76 | ||||
-rw-r--r-- | assets/images/player-b-spritesheet.svg | 76 | ||||
-rw-r--r-- | game/prefabs/player.js | 11 | ||||
-rw-r--r-- | game/states/play.js | 18 | ||||
-rw-r--r-- | game/states/preload.js | 6 |
5 files changed, 174 insertions, 13 deletions
diff --git a/assets/images/player-a-spritesheet.svg b/assets/images/player-a-spritesheet.svg new file mode 100644 index 0000000..bc2ad19 --- /dev/null +++ b/assets/images/player-a-spritesheet.svg @@ -0,0 +1,76 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- Created with Inkscape (http://www.inkscape.org/) --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + width="200" + height="100" + id="svg2" + version="1.1" + inkscape:version="0.48.4 r9939" + sodipodi:docname="player-a.svg"> + <defs + id="defs4" /> + <sodipodi:namedview + id="base" + pagecolor="#ffffff" + bordercolor="#666666" + borderopacity="1.0" + inkscape:pageopacity="0.0" + inkscape:pageshadow="2" + inkscape:zoom="5.6" + inkscape:cx="117.44598" + inkscape:cy="39.526154" + inkscape:document-units="px" + inkscape:current-layer="layer1" + showgrid="false" + inkscape:window-width="1920" + inkscape:window-height="1017" + inkscape:window-x="-8" + inkscape:window-y="-8" + inkscape:window-maximized="1" /> + <metadata + id="metadata7"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> + <dc:title></dc:title> + </cc:Work> + </rdf:RDF> + </metadata> + <g + inkscape:label="Layer 1" + inkscape:groupmode="layer" + id="layer1" + transform="translate(0,-952.36218)"> + <path + sodipodi:type="arc" + style="fill:#ff4500;fill-opacity:1;fill-rule:evenodd;stroke:#0000ff;stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" + id="path2985" + sodipodi:cx="50" + sodipodi:cy="50" + sodipodi:rx="48" + sodipodi:ry="48" + d="M 98,50 C 98,76.509668 76.509668,98 50,98 23.490332,98 2,76.509668 2,50 2,23.490332 23.490332,2 50,2 76.509668,2 98,23.490332 98,50 z" + transform="translate(0,952.36218)" /> + <path + sodipodi:type="arc" + style="fill:#992200;fill-opacity:1;fill-rule:evenodd;stroke:#0000ff;stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" + id="path2985-1" + sodipodi:cx="50" + sodipodi:cy="50" + sodipodi:rx="48" + sodipodi:ry="48" + d="M 98,50 A 48,48 0 1 1 2,50 48,48 0 1 1 98,50 z" + transform="translate(100,952.36218)" /> + </g> +</svg> diff --git a/assets/images/player-b-spritesheet.svg b/assets/images/player-b-spritesheet.svg new file mode 100644 index 0000000..33cf5a2 --- /dev/null +++ b/assets/images/player-b-spritesheet.svg @@ -0,0 +1,76 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- Created with Inkscape (http://www.inkscape.org/) --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + width="200" + height="100" + id="svg2" + version="1.1" + inkscape:version="0.48.4 r9939" + sodipodi:docname="player-b.svg"> + <defs + id="defs4" /> + <sodipodi:namedview + id="base" + pagecolor="#ffffff" + bordercolor="#666666" + borderopacity="1.0" + inkscape:pageopacity="0.0" + inkscape:pageshadow="2" + inkscape:zoom="1.979899" + inkscape:cx="13.561425" + inkscape:cy="12.003943" + inkscape:document-units="px" + inkscape:current-layer="layer1" + showgrid="false" + inkscape:window-width="1920" + inkscape:window-height="1017" + inkscape:window-x="-8" + inkscape:window-y="-8" + inkscape:window-maximized="1" /> + <metadata + id="metadata7"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> + <dc:title></dc:title> + </cc:Work> + </rdf:RDF> + </metadata> + <g + inkscape:label="Layer 1" + inkscape:groupmode="layer" + id="layer1" + transform="translate(0,-952.36218)"> + <path + sodipodi:type="arc" + style="fill:#ffff00;fill-opacity:1;fill-rule:evenodd;stroke:#0000ff;stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" + id="path2985" + sodipodi:cx="50" + sodipodi:cy="50" + sodipodi:rx="48" + sodipodi:ry="48" + d="M 98,50 C 98,76.509668 76.509668,98 50,98 23.490332,98 2,76.509668 2,50 2,23.490332 23.490332,2 50,2 76.509668,2 98,23.490332 98,50 z" + transform="translate(0,952.36218)" /> + <path + sodipodi:type="arc" + style="fill:#999900;fill-opacity:1;fill-rule:evenodd;stroke:#0000ff;stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none" + id="path2985-7" + sodipodi:cx="50" + sodipodi:cy="50" + sodipodi:rx="48" + sodipodi:ry="48" + d="M 98,50 A 48,48 0 1 1 2,50 48,48 0 1 1 98,50 z" + transform="translate(100,952.36218)" /> + </g> +</svg> diff --git a/game/prefabs/player.js b/game/prefabs/player.js index 98179d9..95ea761 100644 --- a/game/prefabs/player.js +++ b/game/prefabs/player.js @@ -2,6 +2,9 @@ var Player = function(game, x, y, key, frame) { Phaser.Sprite.call(this, game, x, y, key, frame); + this.animations.add('active', [0]); + this.animations.add('waiting', [1]); + this.baseKey = key; this.moving = false; this.scale = {x: 0.01, y: 0.01}; @@ -11,16 +14,16 @@ var Player = function(game, x, y, key, frame) { this.score = 0; this.isMyTurn = false; + this.animIsMyTurn = true; }; Player.prototype = Object.create(Phaser.Sprite.prototype); Player.prototype.constructor = Player; Player.prototype.update = function() { - var newKey = this.baseKey + (this.isMyTurn ? '' : '-dim'); - if (this.key !== newKey) { - console.log('Setting sprite to ' + newKey); - this.loadTexture(newKey); + if (this.isMyTurn !== this.animIsMyTurn) { + this.animIsMyTurn = this.isMyTurn; + this.play(this.animIsMyTurn ? 'active' : 'waiting'); } }; diff --git a/game/states/play.js b/game/states/play.js index aed4f90..1d13e0b 100644 --- a/game/states/play.js +++ b/game/states/play.js @@ -71,9 +71,9 @@ Play.prototype = { } }, readLevelFile: function() { - this.walls = this.game.add.group(); this.pills = this.game.add.group(); this.players = this.game.add.group(); + this.walls = this.game.add.group(); var levelText = this.game.cache.getText('level'); var splitRows = levelText.split('\n'); @@ -139,15 +139,23 @@ Play.prototype = { this.game.input.keyboard.addKey(this.playerAControls.down).onDown.add(this.movePlayer.bind(this, this.playerA, 0, 1), this); this.game.input.keyboard.addKey(this.playerAControls.left).onDown.add(this.movePlayer.bind(this, this.playerA, -1, 0), this); this.game.input.keyboard.addKey(this.playerAControls.right).onDown.add(this.movePlayer.bind(this, this.playerA, 1, 0), this); - padA.getButton(Phaser.Gamepad.XBOX360_DPAD_UP).onDown.add(this.movePlayer.bind(this, this.playerA, 0, -1), this); - padA.getButton(Phaser.Gamepad.XBOX360_DPAD_DOWN).onDown.add(this.movePlayer.bind(this, this.playerA, 0, 1), this); - padA.getButton(Phaser.Gamepad.XBOX360_DPAD_LEFT).onDown.add(this.movePlayer.bind(this, this.playerA, -1, 0), this); - padA.getButton(Phaser.Gamepad.XBOX360_DPAD_RIGHT).onDown.add(this.movePlayer.bind(this, this.playerA, 1, 0), this); + if (padA.connected) { + padA.getButton(Phaser.Gamepad.XBOX360_DPAD_UP).onDown.add(this.movePlayer.bind(this, this.playerA, 0, -1), this); + padA.getButton(Phaser.Gamepad.XBOX360_DPAD_DOWN).onDown.add(this.movePlayer.bind(this, this.playerA, 0, 1), this); + padA.getButton(Phaser.Gamepad.XBOX360_DPAD_LEFT).onDown.add(this.movePlayer.bind(this, this.playerA, -1, 0), this); + padA.getButton(Phaser.Gamepad.XBOX360_DPAD_RIGHT).onDown.add(this.movePlayer.bind(this, this.playerA, 1, 0), this); + } this.game.input.keyboard.addKey(this.playerBControls.up).onDown.add(this.movePlayer.bind(this, this.playerB, 0, -1), this); this.game.input.keyboard.addKey(this.playerBControls.down).onDown.add(this.movePlayer.bind(this, this.playerB, 0, 1), this); this.game.input.keyboard.addKey(this.playerBControls.left).onDown.add(this.movePlayer.bind(this, this.playerB, -1, 0), this); this.game.input.keyboard.addKey(this.playerBControls.right).onDown.add(this.movePlayer.bind(this, this.playerB, 1, 0), this); + if (padB.connected) { + padB.getButton(Phaser.Gamepad.XBOX360_DPAD_UP).onDown.add(this.movePlayer.bind(this, this.playerB, 0, -1), this); + padB.getButton(Phaser.Gamepad.XBOX360_DPAD_DOWN).onDown.add(this.movePlayer.bind(this, this.playerB, 0, 1), this); + padB.getButton(Phaser.Gamepad.XBOX360_DPAD_LEFT).onDown.add(this.movePlayer.bind(this, this.playerB, -1, 0), this); + padB.getButton(Phaser.Gamepad.XBOX360_DPAD_RIGHT).onDown.add(this.movePlayer.bind(this, this.playerB, 1, 0), this); + } }, movePlayer: function(player, deltaX, deltaY) { var newX = player.x + deltaX; diff --git a/game/states/preload.js b/game/states/preload.js index 7d9b9d3..2ffc179 100644 --- a/game/states/preload.js +++ b/game/states/preload.js @@ -13,10 +13,8 @@ Preload.prototype = { this.load.onLoadComplete.addOnce(this.onLoadComplete, this); this.load.setPreloadSprite(this.asset); this.load.image('wall', 'assets/images/wall.svg'); - this.load.image('player-a', 'assets/images/player-a.svg'); - this.load.image('player-a-dim', 'assets/images/player-a-dim.svg'); - this.load.image('player-b', 'assets/images/player-b.svg'); - this.load.image('player-b-dim', 'assets/images/player-b-dim.svg'); + this.load.spritesheet('player-a', 'assets/images/player-a-spritesheet.svg', 100, 100); + this.load.spritesheet('player-b', 'assets/images/player-b-spritesheet.svg', 100, 100); this.load.image('pill', 'assets/images/pill.svg'); this.load.image('bonus-pill', 'assets/images/bonus-pill.svg'); |