├── dist ├── screenshot.png ├── example │ ├── assets │ │ ├── ship.png │ │ ├── bullets.png │ │ ├── asteroid1.png │ │ ├── asteroid2.png │ │ ├── asteroid3.png │ │ ├── deep-space.jpg │ │ ├── muzzle-flash.png │ │ └── NOLICENSE │ └── index.js ├── index.html └── DebugArcadePhysics.js ├── app ├── assets │ ├── screenshot.png │ ├── example │ │ └── assets │ │ │ ├── ship.png │ │ │ ├── bullets.png │ │ │ ├── asteroid1.png │ │ │ ├── asteroid2.png │ │ │ ├── asteroid3.png │ │ │ ├── deep-space.jpg │ │ │ ├── muzzle-flash.png │ │ │ └── NOLICENSE │ └── index.html ├── example.coffee └── plugin.coffee ├── .npmignore ├── .gitignore ├── brunch-config.coffee ├── bower.json ├── package.json └── README.md /dist/screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/dist/screenshot.png -------------------------------------------------------------------------------- /app/assets/screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/app/assets/screenshot.png -------------------------------------------------------------------------------- /dist/example/assets/ship.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/dist/example/assets/ship.png -------------------------------------------------------------------------------- /dist/example/assets/bullets.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/dist/example/assets/bullets.png -------------------------------------------------------------------------------- /dist/example/assets/asteroid1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/dist/example/assets/asteroid1.png -------------------------------------------------------------------------------- /dist/example/assets/asteroid2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/dist/example/assets/asteroid2.png -------------------------------------------------------------------------------- /dist/example/assets/asteroid3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/dist/example/assets/asteroid3.png -------------------------------------------------------------------------------- /app/assets/example/assets/ship.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/app/assets/example/assets/ship.png -------------------------------------------------------------------------------- /dist/example/assets/deep-space.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/dist/example/assets/deep-space.jpg -------------------------------------------------------------------------------- /dist/example/assets/muzzle-flash.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/dist/example/assets/muzzle-flash.png -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | *.coffee 2 | *.html 3 | *.png 4 | app/ 5 | bower.json 6 | bower_components/ 7 | dist/asteroids 8 | example.js 9 | version.json 10 | -------------------------------------------------------------------------------- /app/assets/example/assets/bullets.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/app/assets/example/assets/bullets.png -------------------------------------------------------------------------------- /app/assets/example/assets/asteroid1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/app/assets/example/assets/asteroid1.png -------------------------------------------------------------------------------- /app/assets/example/assets/asteroid2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/app/assets/example/assets/asteroid2.png -------------------------------------------------------------------------------- /app/assets/example/assets/asteroid3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/app/assets/example/assets/asteroid3.png -------------------------------------------------------------------------------- /app/assets/example/assets/deep-space.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/app/assets/example/assets/deep-space.jpg -------------------------------------------------------------------------------- /app/assets/example/assets/muzzle-flash.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/samme/phaser-plugin-debug-arcade-physics/HEAD/app/assets/example/assets/muzzle-flash.png -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Numerous always-ignore extensions 2 | *.diff 3 | *.err 4 | *.orig 5 | *.log 6 | *.rej 7 | *.swo 8 | *.swp 9 | *.vi 10 | *~ 11 | *.sass-cache 12 | 13 | # OS or Editor folders 14 | .DS_Store 15 | .cache 16 | .project 17 | .settings 18 | .tmproj 19 | nbproject 20 | Thumbs.db 21 | 22 | # NPM packages folder. 23 | node_modules/ 24 | 25 | # Brunch folder for temporary files. 26 | tmp/ 27 | 28 | # Bower stuff. 29 | bower_components/ 30 | 31 | version.json 32 | -------------------------------------------------------------------------------- /brunch-config.coffee: -------------------------------------------------------------------------------- 1 | module.exports = 2 | files: 3 | javascripts: 4 | joinTo: 5 | 'DebugArcadePhysics.js': 'app/plugin.coffee' 6 | 'example/index.js': 'app/example.coffee' 7 | 'example/vendor.js': 'vendor/**' 8 | modules: 9 | definition: no 10 | wrapper: no 11 | npm: 12 | enabled: no 13 | overrides: 14 | production: 15 | optimize: no 16 | paths: 17 | public: 'dist' 18 | plugins: 19 | coffeescript: 20 | bare: no 21 | version: 22 | fileRegExp: /\.(js|html)$/ 23 | sourceMaps: no 24 | -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "phaser-plugin-debug-arcade-physics", 3 | "description": "Phaser plugin draws properties of Arcade Physics bodies", 4 | "main": "dist/DebugArcadePhysics.js", 5 | "authors": [ 6 | "samme" 7 | ], 8 | "license": "MIT", 9 | "homepage": "https://github.com/samme/phaser-plugin-debug-arcade-physics", 10 | "private": true, 11 | "ignore": [ 12 | "**/.*", 13 | "node_modules", 14 | "bower_components", 15 | "test", 16 | "tests", 17 | "*.coffee", 18 | "*.html", 19 | "*.png", 20 | "app/", 21 | "dist/asteroids", 22 | "dist/example.js", 23 | "package.json", 24 | "version.json" 25 | ], 26 | "dependencies": { 27 | "phaser": "^2.6.2" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /dist/example/assets/NOLICENSE: -------------------------------------------------------------------------------- 1 | Copyright Warning 2 | ================= 3 | 4 | Do not use any of the graphics or music found in this folder in your own games. 5 | 6 | You are free to use them for testing and prototypes, but do not release them in a commercial game. 7 | That includes games sold on MarketJS, or any game running advertisements such as via Google or Leadbolt. 8 | 9 | Why? because lots of the graphics in here come from commercial games themselves. 10 | 11 | For example sprites borrowed from Xenon 2, Metal Slug, Dig Dug and various console and Amiga games. 12 | 13 | These graphics are still owned by their copyright holders, and using them in something seen to be making money 14 | is a really bad idea on your part, ok? 15 | 16 | Plus, it's just not cool. 17 | -------------------------------------------------------------------------------- /app/assets/example/assets/NOLICENSE: -------------------------------------------------------------------------------- 1 | Copyright Warning 2 | ================= 3 | 4 | Do not use any of the graphics or music found in this folder in your own games. 5 | 6 | You are free to use them for testing and prototypes, but do not release them in a commercial game. 7 | That includes games sold on MarketJS, or any game running advertisements such as via Google or Leadbolt. 8 | 9 | Why? because lots of the graphics in here come from commercial games themselves. 10 | 11 | For example sprites borrowed from Xenon 2, Metal Slug, Dig Dug and various console and Amiga games. 12 | 13 | These graphics are still owned by their copyright holders, and using them in something seen to be making money 14 | is a really bad idea on your part, ok? 15 | 16 | Plus, it's just not cool. 17 | -------------------------------------------------------------------------------- /dist/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 12 | Phaser Debug Arcade Physics Plugin Example (Asteroids) 13 |
14 | 21 | 22 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /app/assets/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 12 | Phaser Debug Arcade Physics Plugin Example (Asteroids) 13 |
14 | 21 | 22 | 23 | 24 | 25 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "phaser-plugin-debug-arcade-physics", 3 | "description": "Draws properties of Arcade Physics bodies", 4 | "homepage": "https://github.com/samme/phaser-plugin-debug-arcade-physics/", 5 | "bugs": { 6 | "url": "https://github.com/samme/phaser-plugin-debug-arcade-physics/issues" 7 | }, 8 | "author": "samme", 9 | "version": "1.3.2", 10 | "license": "MIT", 11 | "repository": { 12 | "type": "git", 13 | "url": "git+https://github.com/samme/phaser-plugin-debug-arcade-physics.git" 14 | }, 15 | "scripts": { 16 | "start": "brunch watch --server", 17 | "build": "brunch build --production", 18 | "test": "node -c dist/DebugArcadePhysics.js; node -c dist/example/index.js", 19 | "preversion": "npm run test", 20 | "version": "npm run build && git add app dist --all && git status --short", 21 | "pub": "np", 22 | "postpublish": "git subtree push --prefix dist origin gh-pages" 23 | }, 24 | "dependencies": { 25 | "phaser": "^2.6.2" 26 | }, 27 | "devDependencies": { 28 | "auto-reload-brunch": "^2", 29 | "coffee-script-brunch": "^2", 30 | "javascript-brunch": "^2", 31 | "uglify-js-brunch": "^2", 32 | "version-brunch": "^1.0.1" 33 | }, 34 | "main": "dist/DebugArcadePhysics.js", 35 | "keywords": [ 36 | "phaser", 37 | "phaser-plugin" 38 | ] 39 | } 40 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Draws properties of Arcade Physics bodies. [Demo](https://samme.github.io/phaser-plugin-debug-arcade-physics/) 2 | 3 | ![Screenshot](https://samme.github.io/phaser-plugin-debug-arcade-physics/screenshot.png) 4 | 5 | Install 6 | ------- 7 | 8 | npm install -S phaser-plugin-debug-arcade-physics 9 | 10 | or 11 | 12 | bower install -S samme/phaser-plugin-debug-arcade-physics 13 | 14 | or add [DebugArcadePhysics.js](dist/DebugArcadePhysics.js) after phaser.js. 15 | 16 | Use 🚀 17 | --- 18 | 19 | ```javascript 20 | game.plugins.add(Phaser.Plugin.DebugArcadePhysics); 21 | // OR 22 | game.plugins.add(Phaser.Plugin.DebugArcadePhysics, { 23 | // options … (see Configure, below) 24 | }); 25 | ``` 26 | 27 | ### Configure 28 | 29 | You can try these in the [demo](https://samme.github.io/phaser-plugin-debug-arcade-physics/). 30 | 31 | ```javascript 32 | game.debug.arcade.configSet({ // default values: 33 | bodyFilled: false, 34 | filter: null , 35 | lineWidth: 1 , 36 | on: true , 37 | renderAcceleration: true , 38 | renderAngularAcceleration: true , 39 | renderAngularDrag: true , 40 | renderAngularVelocity: true , 41 | renderBlocked: true , 42 | renderBody: true , 43 | renderBodyDisabled: true , 44 | renderCenter: true , 45 | renderConfig: false, 46 | renderDrag: true , 47 | renderFriction: true , 48 | renderLegend: true , 49 | renderMaxVelocity: true , 50 | renderOffset: true , 51 | renderRotation: true , 52 | renderSpeed: true , 53 | renderTouching: true , 54 | renderVelocity: true , 55 | }); // -> see console for values 56 | ``` 57 | 58 | ### Filters 59 | 60 | Some filters are included: 61 | - `exists` 62 | - `isAlive` 63 | - `isBullet` 64 | - `isNotBullet` 65 | - `isNotParticle` 66 | - `isNotSprite` 67 | - `isParticle` 68 | - `isSprite` 69 | 70 | ```javascript 71 | // Example: 72 | // Hide bodies of objects w/ exists=false (Phaser ignores these, but doesn't disable them) 73 | game.debug.arcade.configSet({ 74 | filter: Phaser.Plugin.DebugArcadePhysics.exists 75 | }); 76 | 77 | // Example: 78 | // Keep automatic rendering 'on' but limit to Bullets 79 | game.debug.arcade.configSet({ 80 | filter: Phaser.Plugin.DebugArcadePhysics.isBullet 81 | }); 82 | 83 | // Example: 84 | // Keep automatic rendering 'on' but limit to certain objects: 85 | game.debug.arcade.configSet({ 86 | filter: function (obj) { return obj.name === "player" } 87 | }); 88 | ``` 89 | 90 | ### Special uses 91 | 92 | ```javascript 93 | // Turn automatic rendering off 94 | game.debug.arcade.off() 95 | 96 | // Draw just one body 97 | game.debug.arcade.renderObj(player); 98 | 99 | // Draw one property of one body 100 | game.debug.arcade.renderVelocity(player); 101 | ``` 102 | -------------------------------------------------------------------------------- /app/example.coffee: -------------------------------------------------------------------------------- 1 | ### 2 | http://phaser.io/examples/v2/arcade-physics/asteroids-movement 3 | ### 4 | 5 | game = undefined 6 | ship = undefined 7 | cursors = undefined 8 | bullet = undefined 9 | bullets = undefined 10 | bulletTime = 0 11 | asteroids = undefined 12 | font = "16px Consolas, Menlo, monospace" 13 | gui = undefined 14 | 15 | {dat, Phaser} = this 16 | {min, SQRT1_2} = Math 17 | {ADD} = Phaser.blendModes 18 | {mixin} = Phaser.Utils 19 | 20 | class Asteroid extends Phaser.Sprite 21 | 22 | constructor: (_game, x, y, key, frame, group) -> 23 | x ||= _game.world.randomX 24 | y ||= _game.world.randomY 25 | key ?= "asteroid#{_game.rnd.between 1, 3}" 26 | 27 | super _game, x, y, key, frame, group 28 | 29 | @anchor.setTo 0.5 30 | @name = "asteroid" 31 | size = min @width, @height 32 | @scale.setTo @mass = game.rnd.realInRange 1, 2 33 | offset = size * 0.5 * (1 - SQRT1_2) 34 | size *= SQRT1_2 35 | 36 | _game.physics.arcade.enable this 37 | @body.setSize size, size, offset, offset 38 | 39 | mixin 40 | angularVelocity: 30 41 | bounce: 42 | x: 1 43 | y: 1 44 | friction: 45 | x: 0 46 | y: 0 47 | velocity: 48 | x: _game.rnd.between -50, 50 49 | y: _game.rnd.between -50, 50 50 | , @body 51 | 52 | this 53 | 54 | explode: -> 55 | @body.enable = no 56 | @blendMode = ADD 57 | @game.add.tween(this).to(alpha: 0).start().onComplete.add @kill, this 58 | @game.add.tween(@scale).to(x: 0, y: 0).start() 59 | return 60 | 61 | update: -> 62 | @game.world.wrap this 63 | return 64 | 65 | init = -> 66 | game.debug.font = font 67 | game.debug.lineHeight = 20 68 | 69 | unless game.debug.arcade 70 | game.plugins.add Phaser.Plugin.DebugArcadePhysics 71 | 72 | return 73 | 74 | preload = -> 75 | game.load.path = "example/assets/" 76 | game.load.image "space", "deep-space.jpg" 77 | game.load.image "asteroid1", "asteroid1.png" 78 | game.load.image "asteroid2", "asteroid2.png" 79 | game.load.image "asteroid3", "asteroid3.png" 80 | game.load.image "bullet", "bullets.png" 81 | game.load.image "ship", "ship.png" 82 | return 83 | 84 | create = -> 85 | {world} = game 86 | {view} = game.camera 87 | 88 | # A spacey background 89 | space = world.space = game.add.tileSprite 0, 0, view.width, view.height, "space" 90 | space.fixedToCamera = yes 91 | 92 | # Our ships bullets 93 | bullets = game.add.group() 94 | bullets.enableBody = true 95 | # All 10 of them 96 | bullets.createMultiple 10, "bullet" 97 | bullets.setAll "alpha", 0.75 98 | bullets.setAll "anchor.x", 0.5 99 | bullets.setAll "anchor.y", 0.5 100 | bullets.setAll "blendMode", ADD 101 | 102 | # Our player ship 103 | ship = game.add.sprite world.centerX, world.centerY, "ship" 104 | ship.anchor.set 0.5 105 | 106 | # and its physics settings 107 | game.physics.enable ship, Phaser.Physics.ARCADE 108 | ship.body.angularDrag = 30 109 | ship.body.bounce.setTo 1 110 | ship.body.drag.set 10 111 | ship.body.friction.setTo 0 112 | ship.body.maxVelocity.set 100 113 | 114 | # Asteroids 115 | asteroids = game.add.group world, "asteroids", no, yes 116 | asteroids.classType = Asteroid 117 | asteroids.createMultiple Math.ceil(game.width * game.height / 1e5), null, null, yes 118 | 119 | # Game input 120 | {keyboard} = game.input 121 | cursors = keyboard.createCursorKeys() 122 | keyboard.addKeyCapture [ Phaser.Keyboard.SPACEBAR ] 123 | 124 | for key, fun of { 125 | D: toggleDim 126 | F: toggleStep 127 | R: -> game.state.restart() 128 | S: -> game.step() 129 | T: game.debug.arcade.toggle 130 | V: toggleVisible 131 | } 132 | keyboard.addKey(Phaser.Keyboard[ key ]).onDown.add fun 133 | 134 | createGui() 135 | 136 | return 137 | 138 | update = -> 139 | {arcade} = game.physics 140 | 141 | arcade.collide asteroids 142 | arcade.collide asteroids, ship 143 | arcade.overlap asteroids, bullets, (asteroid) -> asteroid.explode() 144 | 145 | {body} = ship 146 | 147 | if cursors.up.isDown 148 | arcade.accelerationFromRotation ship.rotation, 100, body.acceleration 149 | else 150 | body.acceleration.set 0 151 | 152 | if cursors.left.isDown then body.angularAcceleration = -90 153 | else if cursors.right.isDown then body.angularAcceleration = 90 154 | else body.angularAcceleration = 0 155 | 156 | fireBullet() if game.input.keyboard.isDown(Phaser.Keyboard.SPACEBAR) 157 | 158 | screenWrap ship 159 | bullets.forEachExists screenWrap, this 160 | return 161 | 162 | fireBullet = -> 163 | if game.time.now > bulletTime 164 | bullet = bullets.getFirstExists(false) 165 | if bullet 166 | bullet.reset ship.body.x + 16, ship.body.y + 16 167 | bullet.lifespan = 2000 168 | bullet.rotation = ship.rotation 169 | game.physics.arcade.velocityFromRotation ship.rotation, 250, bullet.body.velocity 170 | bulletTime = game.time.now + 100 171 | return 172 | 173 | screenWrap = (sprite) -> 174 | {world} = game 175 | 176 | if sprite.x < 0 then sprite.x = world.width 177 | else if sprite.x > world.width then sprite.x = 0 178 | if sprite.y < 0 then sprite.y = world.height 179 | else if sprite.y > world.height then sprite.y = 0 180 | 181 | return 182 | 183 | render = -> 184 | game.debug.text "(T)oggle 185 | (R)estart • 186 | Plugin v#{Phaser.Plugin.DebugArcadePhysics.VERSION} • 187 | Phaser v#{Phaser.VERSION}", 188 | 320, 20, null, game.debug.font 189 | 190 | toggleDim = -> 191 | visible = not game.world.space.visible 192 | game.world.space.visible = visible 193 | return 194 | 195 | toggleStep = -> 196 | if game.stepping then game.disableStep() else game.enableStep() 197 | return 198 | 199 | toggleVisible = -> 200 | visible = game.world.alpha isnt 1 201 | game.world.alpha = +visible 202 | return 203 | 204 | shutdown = -> 205 | gui.destroy() 206 | return 207 | 208 | addGuiKey = (_gui, obj, key) -> 209 | switch key 210 | when "lineWidth" 211 | _gui.add(obj, key, 0, 10, 1).listen() 212 | else 213 | _gui.add(obj, key).listen() 214 | 215 | return 216 | 217 | createGui = -> 218 | {arcade} = game.debug 219 | {config} = arcade 220 | 221 | gui = new dat.GUI width: 400 222 | 223 | gameF = gui.addFolder "game" 224 | pluginF = gui.addFolder "game.debug.arcade" 225 | configF = gui.addFolder "game.debug.arcade.config" 226 | worldF = gui.addFolder "world" 227 | bgF = gui.addFolder "background" 228 | 229 | for key in ["off", "on", "toggle"] 230 | pluginF.add arcade, key 231 | 232 | for key, val of config 233 | addGuiKey(configF, config, key) if val? 234 | 235 | gameF.add game, "enableStep" 236 | gameF.add game, "disableStep" 237 | gameF.add game, "step" 238 | 239 | bgF.add(game.world.space, "visible").listen() 240 | 241 | worldF.add(game.world, "alpha", 0, 1, 0.1).listen() 242 | 243 | gui 244 | 245 | game = new Phaser.Game 246 | width: "100%" 247 | height: "100%" 248 | renderer: Phaser.CANVAS 249 | parent: "phaser-example" 250 | scaleMode: Phaser.ScaleManager.NO_SCALE 251 | state: 252 | create: create 253 | init: init 254 | preload: preload 255 | render: render 256 | shutdown: shutdown 257 | update: update 258 | -------------------------------------------------------------------------------- /dist/example/index.js: -------------------------------------------------------------------------------- 1 | 2 | /* 3 | http://phaser.io/examples/v2/arcade-physics/asteroids-movement 4 | */ 5 | 6 | (function() { 7 | var ADD, Asteroid, Phaser, SQRT1_2, addGuiKey, asteroids, bullet, bulletTime, bullets, create, createGui, cursors, dat, fireBullet, font, game, gui, init, min, mixin, preload, ref, render, screenWrap, ship, shutdown, toggleDim, toggleStep, toggleVisible, update, 8 | extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }, 9 | hasProp = {}.hasOwnProperty; 10 | 11 | game = void 0; 12 | 13 | ship = void 0; 14 | 15 | cursors = void 0; 16 | 17 | bullet = void 0; 18 | 19 | bullets = void 0; 20 | 21 | bulletTime = 0; 22 | 23 | asteroids = void 0; 24 | 25 | font = "16px Consolas, Menlo, monospace"; 26 | 27 | gui = void 0; 28 | 29 | ref = this, dat = ref.dat, Phaser = ref.Phaser; 30 | 31 | min = Math.min, SQRT1_2 = Math.SQRT1_2; 32 | 33 | ADD = Phaser.blendModes.ADD; 34 | 35 | mixin = Phaser.Utils.mixin; 36 | 37 | Asteroid = (function(superClass) { 38 | extend(Asteroid, superClass); 39 | 40 | function Asteroid(_game, x, y, key, frame, group) { 41 | var offset, size; 42 | x || (x = _game.world.randomX); 43 | y || (y = _game.world.randomY); 44 | if (key == null) { 45 | key = "asteroid" + (_game.rnd.between(1, 3)); 46 | } 47 | Asteroid.__super__.constructor.call(this, _game, x, y, key, frame, group); 48 | this.anchor.setTo(0.5); 49 | this.name = "asteroid"; 50 | size = min(this.width, this.height); 51 | this.scale.setTo(this.mass = game.rnd.realInRange(1, 2)); 52 | offset = size * 0.5 * (1 - SQRT1_2); 53 | size *= SQRT1_2; 54 | _game.physics.arcade.enable(this); 55 | this.body.setSize(size, size, offset, offset); 56 | mixin({ 57 | angularVelocity: 30, 58 | bounce: { 59 | x: 1, 60 | y: 1 61 | }, 62 | friction: { 63 | x: 0, 64 | y: 0 65 | }, 66 | velocity: { 67 | x: _game.rnd.between(-50, 50), 68 | y: _game.rnd.between(-50, 50) 69 | } 70 | }, this.body); 71 | this; 72 | } 73 | 74 | Asteroid.prototype.explode = function() { 75 | this.body.enable = false; 76 | this.blendMode = ADD; 77 | this.game.add.tween(this).to({ 78 | alpha: 0 79 | }).start().onComplete.add(this.kill, this); 80 | this.game.add.tween(this.scale).to({ 81 | x: 0, 82 | y: 0 83 | }).start(); 84 | }; 85 | 86 | Asteroid.prototype.update = function() { 87 | this.game.world.wrap(this); 88 | }; 89 | 90 | return Asteroid; 91 | 92 | })(Phaser.Sprite); 93 | 94 | init = function() { 95 | game.debug.font = font; 96 | game.debug.lineHeight = 20; 97 | if (!game.debug.arcade) { 98 | game.plugins.add(Phaser.Plugin.DebugArcadePhysics); 99 | } 100 | }; 101 | 102 | preload = function() { 103 | game.load.path = "example/assets/"; 104 | game.load.image("space", "deep-space.jpg"); 105 | game.load.image("asteroid1", "asteroid1.png"); 106 | game.load.image("asteroid2", "asteroid2.png"); 107 | game.load.image("asteroid3", "asteroid3.png"); 108 | game.load.image("bullet", "bullets.png"); 109 | game.load.image("ship", "ship.png"); 110 | }; 111 | 112 | create = function() { 113 | var fun, key, keyboard, ref1, space, view, world; 114 | world = game.world; 115 | view = game.camera.view; 116 | space = world.space = game.add.tileSprite(0, 0, view.width, view.height, "space"); 117 | space.fixedToCamera = true; 118 | bullets = game.add.group(); 119 | bullets.enableBody = true; 120 | bullets.createMultiple(10, "bullet"); 121 | bullets.setAll("alpha", 0.75); 122 | bullets.setAll("anchor.x", 0.5); 123 | bullets.setAll("anchor.y", 0.5); 124 | bullets.setAll("blendMode", ADD); 125 | ship = game.add.sprite(world.centerX, world.centerY, "ship"); 126 | ship.anchor.set(0.5); 127 | game.physics.enable(ship, Phaser.Physics.ARCADE); 128 | ship.body.angularDrag = 30; 129 | ship.body.bounce.setTo(1); 130 | ship.body.drag.set(10); 131 | ship.body.friction.setTo(0); 132 | ship.body.maxVelocity.set(100); 133 | asteroids = game.add.group(world, "asteroids", false, true); 134 | asteroids.classType = Asteroid; 135 | asteroids.createMultiple(Math.ceil(game.width * game.height / 1e5), null, null, true); 136 | keyboard = game.input.keyboard; 137 | cursors = keyboard.createCursorKeys(); 138 | keyboard.addKeyCapture([Phaser.Keyboard.SPACEBAR]); 139 | ref1 = { 140 | D: toggleDim, 141 | F: toggleStep, 142 | R: function() { 143 | return game.state.restart(); 144 | }, 145 | S: function() { 146 | return game.step(); 147 | }, 148 | T: game.debug.arcade.toggle, 149 | V: toggleVisible 150 | }; 151 | for (key in ref1) { 152 | fun = ref1[key]; 153 | keyboard.addKey(Phaser.Keyboard[key]).onDown.add(fun); 154 | } 155 | createGui(); 156 | }; 157 | 158 | update = function() { 159 | var arcade, body; 160 | arcade = game.physics.arcade; 161 | arcade.collide(asteroids); 162 | arcade.collide(asteroids, ship); 163 | arcade.overlap(asteroids, bullets, function(asteroid) { 164 | return asteroid.explode(); 165 | }); 166 | body = ship.body; 167 | if (cursors.up.isDown) { 168 | arcade.accelerationFromRotation(ship.rotation, 100, body.acceleration); 169 | } else { 170 | body.acceleration.set(0); 171 | } 172 | if (cursors.left.isDown) { 173 | body.angularAcceleration = -90; 174 | } else if (cursors.right.isDown) { 175 | body.angularAcceleration = 90; 176 | } else { 177 | body.angularAcceleration = 0; 178 | } 179 | if (game.input.keyboard.isDown(Phaser.Keyboard.SPACEBAR)) { 180 | fireBullet(); 181 | } 182 | screenWrap(ship); 183 | bullets.forEachExists(screenWrap, this); 184 | }; 185 | 186 | fireBullet = function() { 187 | if (game.time.now > bulletTime) { 188 | bullet = bullets.getFirstExists(false); 189 | if (bullet) { 190 | bullet.reset(ship.body.x + 16, ship.body.y + 16); 191 | bullet.lifespan = 2000; 192 | bullet.rotation = ship.rotation; 193 | game.physics.arcade.velocityFromRotation(ship.rotation, 250, bullet.body.velocity); 194 | bulletTime = game.time.now + 100; 195 | } 196 | } 197 | }; 198 | 199 | screenWrap = function(sprite) { 200 | var world; 201 | world = game.world; 202 | if (sprite.x < 0) { 203 | sprite.x = world.width; 204 | } else if (sprite.x > world.width) { 205 | sprite.x = 0; 206 | } 207 | if (sprite.y < 0) { 208 | sprite.y = world.height; 209 | } else if (sprite.y > world.height) { 210 | sprite.y = 0; 211 | } 212 | }; 213 | 214 | render = function() { 215 | return game.debug.text("(T)oggle (R)estart • Plugin v" + Phaser.Plugin.DebugArcadePhysics.VERSION + " • Phaser v" + Phaser.VERSION, 320, 20, null, game.debug.font); 216 | }; 217 | 218 | toggleDim = function() { 219 | var visible; 220 | visible = !game.world.space.visible; 221 | game.world.space.visible = visible; 222 | }; 223 | 224 | toggleStep = function() { 225 | if (game.stepping) { 226 | game.disableStep(); 227 | } else { 228 | game.enableStep(); 229 | } 230 | }; 231 | 232 | toggleVisible = function() { 233 | var visible; 234 | visible = game.world.alpha !== 1; 235 | game.world.alpha = +visible; 236 | }; 237 | 238 | shutdown = function() { 239 | gui.destroy(); 240 | }; 241 | 242 | addGuiKey = function(_gui, obj, key) { 243 | switch (key) { 244 | case "lineWidth": 245 | _gui.add(obj, key, 0, 10, 1).listen(); 246 | break; 247 | default: 248 | _gui.add(obj, key).listen(); 249 | } 250 | }; 251 | 252 | createGui = function() { 253 | var arcade, bgF, config, configF, gameF, i, key, len, pluginF, ref1, val, worldF; 254 | arcade = game.debug.arcade; 255 | config = arcade.config; 256 | gui = new dat.GUI({ 257 | width: 400 258 | }); 259 | gameF = gui.addFolder("game"); 260 | pluginF = gui.addFolder("game.debug.arcade"); 261 | configF = gui.addFolder("game.debug.arcade.config"); 262 | worldF = gui.addFolder("world"); 263 | bgF = gui.addFolder("background"); 264 | ref1 = ["off", "on", "toggle"]; 265 | for (i = 0, len = ref1.length; i < len; i++) { 266 | key = ref1[i]; 267 | pluginF.add(arcade, key); 268 | } 269 | for (key in config) { 270 | val = config[key]; 271 | if (val != null) { 272 | addGuiKey(configF, config, key); 273 | } 274 | } 275 | gameF.add(game, "enableStep"); 276 | gameF.add(game, "disableStep"); 277 | gameF.add(game, "step"); 278 | bgF.add(game.world.space, "visible").listen(); 279 | worldF.add(game.world, "alpha", 0, 1, 0.1).listen(); 280 | return gui; 281 | }; 282 | 283 | game = new Phaser.Game({ 284 | width: "100%", 285 | height: "100%", 286 | renderer: Phaser.CANVAS, 287 | parent: "phaser-example", 288 | scaleMode: Phaser.ScaleManager.NO_SCALE, 289 | state: { 290 | create: create, 291 | init: init, 292 | preload: preload, 293 | render: render, 294 | shutdown: shutdown, 295 | update: update 296 | } 297 | }); 298 | 299 | }).call(this); 300 | 301 | -------------------------------------------------------------------------------- /app/plugin.coffee: -------------------------------------------------------------------------------- 1 | ### 2 | Debug Arcade Physics plugin v{!major!}.{!minor!}.{!maintenance!} for Phaser 3 | ### 4 | 5 | "use strict" 6 | 7 | {abs, cos, sin} = Math 8 | {freeze, seal} = Object 9 | {Bullet, Circle, Line, Particle, Point, Rectangle, SPRITE} = Phaser 10 | {sign} = Phaser.Math 11 | {ARCADE} = Phaser.Physics 12 | 13 | degreeToRadiansFactor = Math.PI / 180 14 | 15 | degreeToPxFactor = 100 / 180 16 | 17 | freeze class Phaser.Plugin.DebugArcadePhysics extends Phaser.Plugin 18 | 19 | # Constructor 20 | 21 | @addTo = (game) -> 22 | game.plugins.add this 23 | 24 | # Filters 25 | 26 | @exists = (obj) -> 27 | obj.exists 28 | 29 | @isAlive = (obj) -> 30 | obj.alive 31 | 32 | @isBullet = (obj) -> 33 | obj instanceof Bullet 34 | 35 | @isNotBullet = (obj) -> 36 | not (obj instanceof Bullet) 37 | 38 | @isNotParticle = (obj) -> 39 | not (obj instanceof Particle) 40 | 41 | @isNotSprite = (obj) -> 42 | obj.type isnt SPRITE 43 | 44 | @isParticle = (obj) -> 45 | obj instanceof Particle 46 | 47 | @isSprite = (obj) -> 48 | obj.type is SPRITE 49 | 50 | @VERSION = "{!major!}.{!minor!}.{!maintenance!}" 51 | 52 | # Private 53 | 54 | TOO_BIG = 9999 55 | 56 | red = "hsla(0 , 100%, 50%, 0.5)" 57 | coral = "hsla(15 , 100%, 50%, 0.5)" 58 | orange = "hsla(30 , 100%, 50%, 0.5)" 59 | mango = "hsla(45, 100%, 50%, 0.5)" 60 | yellow = "hsla(60 , 100%, 50%, 0.5)" 61 | umber = "hsla(60 , 100%, 25%, 0.5)" 62 | green = "hsla(120, 100%, 50%, 0.5)" 63 | flora = "hsla(150, 100%, 50%, 0.5)" 64 | aqua = "hsla(180, 100%, 50%, 0.5)" 65 | blue = "hsla(210, 100%, 50%, 0.5)" 66 | violet = "hsla(300, 100%, 50%, 0.5)" 67 | white = "hsla(0 , 0%, 100%, 0.5)" 68 | gray = "hsla(0 , 0%, 50%, 0.5)" 69 | 70 | # Prototype 71 | 72 | colors: 73 | acceleration: violet 74 | angularAcceleration: violet 75 | angularDrag: orange 76 | angularVelocity: aqua 77 | blocked: coral 78 | body: yellow 79 | bodyDisabled: gray 80 | center: white 81 | collisionNone: umber 82 | drag: orange 83 | embedded: mango 84 | friction: flora 85 | maxVelocity: green 86 | offset: yellow 87 | rotation: yellow 88 | speed: blue 89 | touching: red 90 | velocity: aqua 91 | 92 | config: seal 93 | bodyFilled: no 94 | filter: null 95 | lineWidth: 1 96 | on: yes 97 | renderAcceleration: yes 98 | renderAngularAcceleration: yes 99 | renderAngularDrag: yes 100 | renderAngularVelocity: yes 101 | renderBlocked: yes 102 | renderBody: yes 103 | renderBodyDisabled: yes 104 | renderCenter: yes 105 | renderConfig: no 106 | renderDrag: yes 107 | renderFriction: yes 108 | renderLegend: yes 109 | renderMaxVelocity: yes 110 | renderOffset: yes 111 | renderRotation: yes 112 | renderSpeed: yes 113 | renderTouching: yes 114 | renderVelocity: yes 115 | 116 | configKeys: freeze Object.keys this::config 117 | 118 | name: "Debug Arcade Physics Plugin" 119 | 120 | Object.defineProperty @prototype, "version", 121 | get: -> 122 | @constructor.VERSION 123 | 124 | # Hooks 125 | 126 | init: (settings) -> 127 | console.log "%s v%s", @name, @version 128 | @game.debug.arcade = @interface() 129 | @help() 130 | @configSet settings if settings 131 | return 132 | 133 | postRender: -> 134 | return unless @config.on 135 | @renderConfig() if @config.renderConfig 136 | @renderColors() if @config.renderLegend 137 | @renderAll() 138 | return 139 | 140 | # Helpers 141 | 142 | bodyColor: (body) -> 143 | switch yes 144 | when body.enable is off then @colors.bodyDisabled 145 | when body.checkCollision.none then @colors.collisionNone 146 | when body.embedded then @colors.embedded 147 | else @colors.body 148 | 149 | calculateAngularDrag: (body) -> 150 | {angularDrag, angularVelocity} = body 151 | {physicsElapsed} = @game.time 152 | drag = angularDrag * -sign(angularVelocity) 153 | if (abs(angularVelocity) - abs(drag * physicsElapsed)) > 0 then drag else 0 154 | 155 | _calculateDrag = new Point 156 | 157 | calculateDrag: (body, out = _calculateDrag) -> 158 | {drag, velocity} = body 159 | {physicsElapsed} = @game.time 160 | vx = velocity.x 161 | vy = velocity.y 162 | dx = drag.x * -sign(vx) 163 | dy = drag.y * -sign(vy) 164 | out.x = if (abs(vx) - abs(dx * physicsElapsed)) > 0 then dx else 0 165 | out.y = if (abs(vy) - abs(dy * physicsElapsed)) > 0 then dy else 0 166 | out 167 | 168 | configSet: (settings) -> 169 | for name, val of settings 170 | if name of @config 171 | @config[name] = val 172 | console.log name, val 173 | else 174 | console.warn "No such setting '#{name}'. Use #{@configKeys.join ", "}." 175 | this 176 | 177 | geom: (obj, color, fill = no, lineWidth = @config.lineWidth) -> 178 | {debug} = @game 179 | {context} = debug 180 | savedLineWidth = context.lineWidth 181 | context.lineWidth = lineWidth 182 | debug.geom obj, color, fill 183 | context.lineWidth = savedLineWidth 184 | this 185 | 186 | help: -> 187 | console.log "Use `game.debug.arcade`: #{Object.keys(@game.debug.arcade).join ", "}" 188 | this 189 | 190 | helpConfig: -> 191 | console.log "Use `game.debug.arcade.configSet()`: #{@configKeys.join ", "}" 192 | this 193 | 194 | hide: -> 195 | @visible = no 196 | this 197 | 198 | off: -> 199 | @config.on = no 200 | this 201 | 202 | on: -> 203 | @config.on = yes 204 | this 205 | 206 | placeLine: (line, start, end) -> 207 | @placeLineXY line, start.x, start.y, end.x, end.y 208 | 209 | placeLineXY: (line, startX, startY, endX, endY) -> 210 | line.setTo startX, startY, endX, endY 211 | 212 | placeRect: (rect, center, size) -> 213 | rect.resize(2 * size.x, 2 * size.y).centerOn(center.x, center.y) 214 | rect 215 | 216 | placeVector: (line, start, vector) -> 217 | @placeVectorXY line, start.x, start.y, vector.x, vector.y 218 | 219 | placeVectorXY: (line, startX, startY, vectorX, vectorY) -> 220 | line.setTo startX, startY, startX + vectorX, startY + vectorY 221 | 222 | renderAcceleration: (body) -> 223 | @renderVector body.acceleration, body, @colors.acceleration 224 | this 225 | 226 | renderAll: -> 227 | @renderObj @game.world 228 | this 229 | 230 | renderAngularVector: (body, length, color) -> 231 | return this if length is 0 232 | 233 | {center, halfHeight, halfWidth, rotation} = body 234 | 235 | r = rotation * degreeToRadiansFactor 236 | rCos = cos r 237 | rSin = sin r 238 | length *= degreeToPxFactor 239 | 240 | @renderLineDelta center.x + halfWidth * rCos, 241 | center.y + halfHeight * rSin, 242 | -rSin * length, 243 | rCos * length, 244 | color 245 | this 246 | 247 | renderAngularAcceleration: (body) -> 248 | @renderAngularVector body, body.angularAcceleration, @colors.acceleration 249 | this 250 | 251 | renderAngularDrag: (body) -> 252 | @renderAngularVector body, @calculateAngularDrag(body), @colors.drag 253 | this 254 | 255 | renderAngularVelocity: (body) -> 256 | @renderAngularVector body, body.angularVelocity, @colors.velocity 257 | this 258 | 259 | renderBlocked: (body) -> 260 | @renderEdges body, body.blocked, @colors.blocked 261 | this 262 | 263 | renderCenter: (body) -> 264 | {x, y} = body.center 265 | {camera} = @game 266 | @game.debug.pixel (x - camera.x), (y - camera.y), @colors.center 267 | this 268 | 269 | _circle = new Circle 270 | 271 | renderCircle: (radius, body, color) -> 272 | return this if radius < 1 273 | _circle.setTo body.center.x, body.center.y, 2 * radius 274 | @geom _circle, color 275 | this 276 | 277 | renderColors: (x = 10, y = x) -> 278 | {debug} = @game 279 | debug.start x, y 280 | for name, val of @colors 281 | debug.currentColor = val 282 | debug.line name 283 | debug.stop() 284 | this 285 | 286 | renderConfig: (x = 10, y = x) -> 287 | {debug} = @game 288 | debug.start x, y 289 | for name, val of @config 290 | debug.line "#{name}: #{val}" 291 | debug.stop() 292 | this 293 | 294 | renderDrag: (body) -> 295 | @renderVector @calculateDrag(body), body, @colors.drag 296 | this 297 | 298 | renderEdges: (body, edges, color) -> 299 | @renderLine body.left , body.top , body.left , body.bottom, color if edges.left 300 | @renderLine body.right, body.top , body.right, body.bottom, color if edges.right 301 | @renderLine body.left , body.top , body.right, body.top , color if edges.up 302 | @renderLine body.left , body.bottom, body.right, body.bottom, color if edges.down 303 | this 304 | 305 | renderFriction: (body) -> 306 | unless body.touching.none or body.friction.isZero() 307 | @renderVectorXY body.friction.x * body.velocity.x, 308 | body.friction.y * body.velocity.y, 309 | body, @colors.friction 310 | this 311 | 312 | renderMaxVelocity: (body) -> 313 | {maxVelocity} = body 314 | return this if maxVelocity.x > TOO_BIG or 315 | maxVelocity.y > TOO_BIG 316 | @renderRect maxVelocity, body, @colors.maxVelocity 317 | this 318 | 319 | renderObj: (obj) -> 320 | return this unless obj.exists 321 | 322 | {config} = this 323 | {filter} = config 324 | {body} = obj 325 | 326 | if obj.renderable and 327 | body and 328 | body.type is ARCADE and 329 | (body.enable or config.renderBodyDisabled) 330 | 331 | return this if filter and not filter(obj) 332 | 333 | @renderBody body if config.renderBody 334 | @renderBlocked body if config.renderBlocked 335 | @renderTouching body if config.renderTouching 336 | @renderOffset body if config.renderOffset 337 | @renderRotation body if config.renderRotation 338 | @renderSpeed body if config.renderSpeed 339 | @renderMaxVelocity body if config.renderMaxVelocity 340 | @renderVelocity body if config.renderVelocity 341 | @renderAcceleration body if config.renderAcceleration 342 | @renderDrag body if config.renderDrag 343 | @renderFriction body if config.renderFriction 344 | @renderAngularVelocity body if config.renderAngularVelocity 345 | @renderAngularAcceleration body if config.renderAngularAcceleration 346 | @renderAngularDrag body if config.renderAngularDrag 347 | @renderCenter body if config.renderCenter 348 | 349 | for child in obj.children 350 | @renderObj child 351 | this 352 | 353 | renderBody: (body) -> 354 | @game.debug.body body.sprite, @bodyColor(body), @config.bodyFilled 355 | this 356 | 357 | _line = new Line 358 | 359 | renderLine: (startX, startY, endX, endY, color, width) -> 360 | _line.setTo startX, startY, endX, endY 361 | @geom _line, color, no, width 362 | this 363 | 364 | renderLineDelta: (startX, startY, deltaX, deltaY, color, width) -> 365 | @renderLine startX, startY, startX + deltaX, startY + deltaY, color, width 366 | this 367 | 368 | _offset = new Line 369 | 370 | renderOffset: (body) -> 371 | @placeVectorXY _offset, body.position.x, 372 | body.position.y, 373 | -body.offset.x * body.sprite.scale.x, 374 | -body.offset.y * body.sprite.scale.y 375 | @geom _offset, @colors.offset, no 376 | this 377 | 378 | _rect = new Rectangle 379 | 380 | renderRect: (vector, body, color) -> 381 | return this if vector.isZero() 382 | @placeRect _rect, body.center, vector 383 | @geom _rect, color 384 | this 385 | 386 | renderRotation: (body) -> 387 | {halfHeight, halfWidth, rotation} = body 388 | rotation *= degreeToRadiansFactor 389 | @renderVectorXY halfWidth * cos(rotation), 390 | halfHeight * sin(rotation), 391 | body, @colors.rotation 392 | this 393 | 394 | renderSpeed: (body) -> 395 | return this if body.speed < 1 396 | @renderCircle body.speed, body, @colors.speed 397 | this 398 | 399 | renderTouching: (body) -> 400 | unless body.touching.none 401 | @renderEdges body, body.touching, @colors.touching 402 | this 403 | 404 | renderVector: (vector, body, color) -> 405 | return this if vector.isZero() 406 | @renderVectorXY vector.x, vector.y, body, color 407 | this 408 | 409 | renderVectorXY: (vectorX, vectorY, body, color) -> 410 | return this if vectorX is 0 and vectorY is 0 411 | @renderLineDelta body.center.x, body.center.y, vectorX, vectorY, color 412 | this 413 | 414 | renderVelocity: (body) -> 415 | @renderVector body.velocity, body, @colors.velocity 416 | this 417 | 418 | show: -> 419 | @visible = yes 420 | this 421 | 422 | toggle: -> 423 | @config.on = not @config.on 424 | this 425 | 426 | toggleVisible: -> 427 | @visible = not @visible 428 | this 429 | 430 | # Interface (as `game.debug.arcade`) 431 | 432 | interface: -> 433 | freeze 434 | acceleration: @renderAcceleration.bind this 435 | body: @renderBody .bind this 436 | center: @renderCenter .bind this 437 | circle: @renderCircle .bind this 438 | config: @config 439 | configSet: @configSet .bind this 440 | drag: @renderDrag .bind this 441 | help: @help .bind this 442 | helpConfig: @helpConfig .bind this 443 | hide: @hide .bind this 444 | maxVelocity: @renderMaxVelocity .bind this 445 | obj: @renderObj .bind this 446 | off: @off .bind this 447 | offset: @renderOffset .bind this 448 | on: @on .bind this 449 | rect: @renderRect .bind this 450 | rotation: @renderRotation .bind this 451 | show: @show .bind this 452 | speed: @renderSpeed .bind this 453 | vector: @renderVector .bind this 454 | vectorXY: @renderVectorXY .bind this 455 | velocity: @renderVelocity .bind this 456 | toggle: @toggle .bind this 457 | -------------------------------------------------------------------------------- /dist/DebugArcadePhysics.js: -------------------------------------------------------------------------------- 1 | 2 | /* 3 | Debug Arcade Physics plugin v1.3.2 for Phaser 4 | */ 5 | 6 | (function() { 7 | "use strict"; 8 | var ARCADE, Bullet, Circle, Line, Particle, Point, Rectangle, SPRITE, abs, cos, degreeToPxFactor, degreeToRadiansFactor, freeze, seal, sign, sin, 9 | extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }, 10 | hasProp = {}.hasOwnProperty; 11 | 12 | abs = Math.abs, cos = Math.cos, sin = Math.sin; 13 | 14 | freeze = Object.freeze, seal = Object.seal; 15 | 16 | Bullet = Phaser.Bullet, Circle = Phaser.Circle, Line = Phaser.Line, Particle = Phaser.Particle, Point = Phaser.Point, Rectangle = Phaser.Rectangle, SPRITE = Phaser.SPRITE; 17 | 18 | sign = Phaser.Math.sign; 19 | 20 | ARCADE = Phaser.Physics.ARCADE; 21 | 22 | degreeToRadiansFactor = Math.PI / 180; 23 | 24 | degreeToPxFactor = 100 / 180; 25 | 26 | freeze(Phaser.Plugin.DebugArcadePhysics = (function(superClass) { 27 | var TOO_BIG, _calculateDrag, _circle, _line, _offset, _rect, aqua, blue, coral, flora, gray, green, mango, orange, red, umber, violet, white, yellow; 28 | 29 | extend(DebugArcadePhysics, superClass); 30 | 31 | function DebugArcadePhysics() { 32 | return DebugArcadePhysics.__super__.constructor.apply(this, arguments); 33 | } 34 | 35 | DebugArcadePhysics.addTo = function(game) { 36 | return game.plugins.add(this); 37 | }; 38 | 39 | DebugArcadePhysics.exists = function(obj) { 40 | return obj.exists; 41 | }; 42 | 43 | DebugArcadePhysics.isAlive = function(obj) { 44 | return obj.alive; 45 | }; 46 | 47 | DebugArcadePhysics.isBullet = function(obj) { 48 | return obj instanceof Bullet; 49 | }; 50 | 51 | DebugArcadePhysics.isNotBullet = function(obj) { 52 | return !(obj instanceof Bullet); 53 | }; 54 | 55 | DebugArcadePhysics.isNotParticle = function(obj) { 56 | return !(obj instanceof Particle); 57 | }; 58 | 59 | DebugArcadePhysics.isNotSprite = function(obj) { 60 | return obj.type !== SPRITE; 61 | }; 62 | 63 | DebugArcadePhysics.isParticle = function(obj) { 64 | return obj instanceof Particle; 65 | }; 66 | 67 | DebugArcadePhysics.isSprite = function(obj) { 68 | return obj.type === SPRITE; 69 | }; 70 | 71 | DebugArcadePhysics.VERSION = "1.3.2"; 72 | 73 | TOO_BIG = 9999; 74 | 75 | red = "hsla(0 , 100%, 50%, 0.5)"; 76 | 77 | coral = "hsla(15 , 100%, 50%, 0.5)"; 78 | 79 | orange = "hsla(30 , 100%, 50%, 0.5)"; 80 | 81 | mango = "hsla(45, 100%, 50%, 0.5)"; 82 | 83 | yellow = "hsla(60 , 100%, 50%, 0.5)"; 84 | 85 | umber = "hsla(60 , 100%, 25%, 0.5)"; 86 | 87 | green = "hsla(120, 100%, 50%, 0.5)"; 88 | 89 | flora = "hsla(150, 100%, 50%, 0.5)"; 90 | 91 | aqua = "hsla(180, 100%, 50%, 0.5)"; 92 | 93 | blue = "hsla(210, 100%, 50%, 0.5)"; 94 | 95 | violet = "hsla(300, 100%, 50%, 0.5)"; 96 | 97 | white = "hsla(0 , 0%, 100%, 0.5)"; 98 | 99 | gray = "hsla(0 , 0%, 50%, 0.5)"; 100 | 101 | DebugArcadePhysics.prototype.colors = { 102 | acceleration: violet, 103 | angularAcceleration: violet, 104 | angularDrag: orange, 105 | angularVelocity: aqua, 106 | blocked: coral, 107 | body: yellow, 108 | bodyDisabled: gray, 109 | center: white, 110 | collisionNone: umber, 111 | drag: orange, 112 | embedded: mango, 113 | friction: flora, 114 | maxVelocity: green, 115 | offset: yellow, 116 | rotation: yellow, 117 | speed: blue, 118 | touching: red, 119 | velocity: aqua 120 | }; 121 | 122 | DebugArcadePhysics.prototype.config = seal({ 123 | bodyFilled: false, 124 | filter: null, 125 | lineWidth: 1, 126 | on: true, 127 | renderAcceleration: true, 128 | renderAngularAcceleration: true, 129 | renderAngularDrag: true, 130 | renderAngularVelocity: true, 131 | renderBlocked: true, 132 | renderBody: true, 133 | renderBodyDisabled: true, 134 | renderCenter: true, 135 | renderConfig: false, 136 | renderDrag: true, 137 | renderFriction: true, 138 | renderLegend: true, 139 | renderMaxVelocity: true, 140 | renderOffset: true, 141 | renderRotation: true, 142 | renderSpeed: true, 143 | renderTouching: true, 144 | renderVelocity: true 145 | }); 146 | 147 | DebugArcadePhysics.prototype.configKeys = freeze(Object.keys(DebugArcadePhysics.prototype.config)); 148 | 149 | DebugArcadePhysics.prototype.name = "Debug Arcade Physics Plugin"; 150 | 151 | Object.defineProperty(DebugArcadePhysics.prototype, "version", { 152 | get: function() { 153 | return this.constructor.VERSION; 154 | } 155 | }); 156 | 157 | DebugArcadePhysics.prototype.init = function(settings) { 158 | console.log("%s v%s", this.name, this.version); 159 | this.game.debug.arcade = this["interface"](); 160 | this.help(); 161 | if (settings) { 162 | this.configSet(settings); 163 | } 164 | }; 165 | 166 | DebugArcadePhysics.prototype.postRender = function() { 167 | if (!this.config.on) { 168 | return; 169 | } 170 | if (this.config.renderConfig) { 171 | this.renderConfig(); 172 | } 173 | if (this.config.renderLegend) { 174 | this.renderColors(); 175 | } 176 | this.renderAll(); 177 | }; 178 | 179 | DebugArcadePhysics.prototype.bodyColor = function(body) { 180 | switch (true) { 181 | case body.enable === false: 182 | return this.colors.bodyDisabled; 183 | case body.checkCollision.none: 184 | return this.colors.collisionNone; 185 | case body.embedded: 186 | return this.colors.embedded; 187 | default: 188 | return this.colors.body; 189 | } 190 | }; 191 | 192 | DebugArcadePhysics.prototype.calculateAngularDrag = function(body) { 193 | var angularDrag, angularVelocity, drag, physicsElapsed; 194 | angularDrag = body.angularDrag, angularVelocity = body.angularVelocity; 195 | physicsElapsed = this.game.time.physicsElapsed; 196 | drag = angularDrag * -sign(angularVelocity); 197 | if ((abs(angularVelocity) - abs(drag * physicsElapsed)) > 0) { 198 | return drag; 199 | } else { 200 | return 0; 201 | } 202 | }; 203 | 204 | _calculateDrag = new Point; 205 | 206 | DebugArcadePhysics.prototype.calculateDrag = function(body, out) { 207 | var drag, dx, dy, physicsElapsed, velocity, vx, vy; 208 | if (out == null) { 209 | out = _calculateDrag; 210 | } 211 | drag = body.drag, velocity = body.velocity; 212 | physicsElapsed = this.game.time.physicsElapsed; 213 | vx = velocity.x; 214 | vy = velocity.y; 215 | dx = drag.x * -sign(vx); 216 | dy = drag.y * -sign(vy); 217 | out.x = (abs(vx) - abs(dx * physicsElapsed)) > 0 ? dx : 0; 218 | out.y = (abs(vy) - abs(dy * physicsElapsed)) > 0 ? dy : 0; 219 | return out; 220 | }; 221 | 222 | DebugArcadePhysics.prototype.configSet = function(settings) { 223 | var name, val; 224 | for (name in settings) { 225 | val = settings[name]; 226 | if (name in this.config) { 227 | this.config[name] = val; 228 | console.log(name, val); 229 | } else { 230 | console.warn("No such setting '" + name + "'. Use " + (this.configKeys.join(", ")) + "."); 231 | } 232 | } 233 | return this; 234 | }; 235 | 236 | DebugArcadePhysics.prototype.geom = function(obj, color, fill, lineWidth) { 237 | var context, debug, savedLineWidth; 238 | if (fill == null) { 239 | fill = false; 240 | } 241 | if (lineWidth == null) { 242 | lineWidth = this.config.lineWidth; 243 | } 244 | debug = this.game.debug; 245 | context = debug.context; 246 | savedLineWidth = context.lineWidth; 247 | context.lineWidth = lineWidth; 248 | debug.geom(obj, color, fill); 249 | context.lineWidth = savedLineWidth; 250 | return this; 251 | }; 252 | 253 | DebugArcadePhysics.prototype.help = function() { 254 | console.log("Use `game.debug.arcade`: " + (Object.keys(this.game.debug.arcade).join(", "))); 255 | return this; 256 | }; 257 | 258 | DebugArcadePhysics.prototype.helpConfig = function() { 259 | console.log("Use `game.debug.arcade.configSet()`: " + (this.configKeys.join(", "))); 260 | return this; 261 | }; 262 | 263 | DebugArcadePhysics.prototype.hide = function() { 264 | this.visible = false; 265 | return this; 266 | }; 267 | 268 | DebugArcadePhysics.prototype.off = function() { 269 | this.config.on = false; 270 | return this; 271 | }; 272 | 273 | DebugArcadePhysics.prototype.on = function() { 274 | this.config.on = true; 275 | return this; 276 | }; 277 | 278 | DebugArcadePhysics.prototype.placeLine = function(line, start, end) { 279 | return this.placeLineXY(line, start.x, start.y, end.x, end.y); 280 | }; 281 | 282 | DebugArcadePhysics.prototype.placeLineXY = function(line, startX, startY, endX, endY) { 283 | return line.setTo(startX, startY, endX, endY); 284 | }; 285 | 286 | DebugArcadePhysics.prototype.placeRect = function(rect, center, size) { 287 | rect.resize(2 * size.x, 2 * size.y).centerOn(center.x, center.y); 288 | return rect; 289 | }; 290 | 291 | DebugArcadePhysics.prototype.placeVector = function(line, start, vector) { 292 | return this.placeVectorXY(line, start.x, start.y, vector.x, vector.y); 293 | }; 294 | 295 | DebugArcadePhysics.prototype.placeVectorXY = function(line, startX, startY, vectorX, vectorY) { 296 | return line.setTo(startX, startY, startX + vectorX, startY + vectorY); 297 | }; 298 | 299 | DebugArcadePhysics.prototype.renderAcceleration = function(body) { 300 | this.renderVector(body.acceleration, body, this.colors.acceleration); 301 | return this; 302 | }; 303 | 304 | DebugArcadePhysics.prototype.renderAll = function() { 305 | this.renderObj(this.game.world); 306 | return this; 307 | }; 308 | 309 | DebugArcadePhysics.prototype.renderAngularVector = function(body, length, color) { 310 | var center, halfHeight, halfWidth, r, rCos, rSin, rotation; 311 | if (length === 0) { 312 | return this; 313 | } 314 | center = body.center, halfHeight = body.halfHeight, halfWidth = body.halfWidth, rotation = body.rotation; 315 | r = rotation * degreeToRadiansFactor; 316 | rCos = cos(r); 317 | rSin = sin(r); 318 | length *= degreeToPxFactor; 319 | this.renderLineDelta(center.x + halfWidth * rCos, center.y + halfHeight * rSin, -rSin * length, rCos * length, color); 320 | return this; 321 | }; 322 | 323 | DebugArcadePhysics.prototype.renderAngularAcceleration = function(body) { 324 | this.renderAngularVector(body, body.angularAcceleration, this.colors.acceleration); 325 | return this; 326 | }; 327 | 328 | DebugArcadePhysics.prototype.renderAngularDrag = function(body) { 329 | this.renderAngularVector(body, this.calculateAngularDrag(body), this.colors.drag); 330 | return this; 331 | }; 332 | 333 | DebugArcadePhysics.prototype.renderAngularVelocity = function(body) { 334 | this.renderAngularVector(body, body.angularVelocity, this.colors.velocity); 335 | return this; 336 | }; 337 | 338 | DebugArcadePhysics.prototype.renderBlocked = function(body) { 339 | this.renderEdges(body, body.blocked, this.colors.blocked); 340 | return this; 341 | }; 342 | 343 | DebugArcadePhysics.prototype.renderCenter = function(body) { 344 | var camera, ref, x, y; 345 | ref = body.center, x = ref.x, y = ref.y; 346 | camera = this.game.camera; 347 | this.game.debug.pixel(x - camera.x, y - camera.y, this.colors.center); 348 | return this; 349 | }; 350 | 351 | _circle = new Circle; 352 | 353 | DebugArcadePhysics.prototype.renderCircle = function(radius, body, color) { 354 | if (radius < 1) { 355 | return this; 356 | } 357 | _circle.setTo(body.center.x, body.center.y, 2 * radius); 358 | this.geom(_circle, color); 359 | return this; 360 | }; 361 | 362 | DebugArcadePhysics.prototype.renderColors = function(x, y) { 363 | var debug, name, ref, val; 364 | if (x == null) { 365 | x = 10; 366 | } 367 | if (y == null) { 368 | y = x; 369 | } 370 | debug = this.game.debug; 371 | debug.start(x, y); 372 | ref = this.colors; 373 | for (name in ref) { 374 | val = ref[name]; 375 | debug.currentColor = val; 376 | debug.line(name); 377 | } 378 | debug.stop(); 379 | return this; 380 | }; 381 | 382 | DebugArcadePhysics.prototype.renderConfig = function(x, y) { 383 | var debug, name, ref, val; 384 | if (x == null) { 385 | x = 10; 386 | } 387 | if (y == null) { 388 | y = x; 389 | } 390 | debug = this.game.debug; 391 | debug.start(x, y); 392 | ref = this.config; 393 | for (name in ref) { 394 | val = ref[name]; 395 | debug.line(name + ": " + val); 396 | } 397 | debug.stop(); 398 | return this; 399 | }; 400 | 401 | DebugArcadePhysics.prototype.renderDrag = function(body) { 402 | this.renderVector(this.calculateDrag(body), body, this.colors.drag); 403 | return this; 404 | }; 405 | 406 | DebugArcadePhysics.prototype.renderEdges = function(body, edges, color) { 407 | if (edges.left) { 408 | this.renderLine(body.left, body.top, body.left, body.bottom, color); 409 | } 410 | if (edges.right) { 411 | this.renderLine(body.right, body.top, body.right, body.bottom, color); 412 | } 413 | if (edges.up) { 414 | this.renderLine(body.left, body.top, body.right, body.top, color); 415 | } 416 | if (edges.down) { 417 | this.renderLine(body.left, body.bottom, body.right, body.bottom, color); 418 | } 419 | return this; 420 | }; 421 | 422 | DebugArcadePhysics.prototype.renderFriction = function(body) { 423 | if (!(body.touching.none || body.friction.isZero())) { 424 | this.renderVectorXY(body.friction.x * body.velocity.x, body.friction.y * body.velocity.y, body, this.colors.friction); 425 | } 426 | return this; 427 | }; 428 | 429 | DebugArcadePhysics.prototype.renderMaxVelocity = function(body) { 430 | var maxVelocity; 431 | maxVelocity = body.maxVelocity; 432 | if (maxVelocity.x > TOO_BIG || maxVelocity.y > TOO_BIG) { 433 | return this; 434 | } 435 | this.renderRect(maxVelocity, body, this.colors.maxVelocity); 436 | return this; 437 | }; 438 | 439 | DebugArcadePhysics.prototype.renderObj = function(obj) { 440 | var body, child, config, filter, i, len, ref; 441 | if (!obj.exists) { 442 | return this; 443 | } 444 | config = this.config; 445 | filter = config.filter; 446 | body = obj.body; 447 | if (obj.renderable && body && body.type === ARCADE && (body.enable || config.renderBodyDisabled)) { 448 | if (filter && !filter(obj)) { 449 | return this; 450 | } 451 | if (config.renderBody) { 452 | this.renderBody(body); 453 | } 454 | if (config.renderBlocked) { 455 | this.renderBlocked(body); 456 | } 457 | if (config.renderTouching) { 458 | this.renderTouching(body); 459 | } 460 | if (config.renderOffset) { 461 | this.renderOffset(body); 462 | } 463 | if (config.renderRotation) { 464 | this.renderRotation(body); 465 | } 466 | if (config.renderSpeed) { 467 | this.renderSpeed(body); 468 | } 469 | if (config.renderMaxVelocity) { 470 | this.renderMaxVelocity(body); 471 | } 472 | if (config.renderVelocity) { 473 | this.renderVelocity(body); 474 | } 475 | if (config.renderAcceleration) { 476 | this.renderAcceleration(body); 477 | } 478 | if (config.renderDrag) { 479 | this.renderDrag(body); 480 | } 481 | if (config.renderFriction) { 482 | this.renderFriction(body); 483 | } 484 | if (config.renderAngularVelocity) { 485 | this.renderAngularVelocity(body); 486 | } 487 | if (config.renderAngularAcceleration) { 488 | this.renderAngularAcceleration(body); 489 | } 490 | if (config.renderAngularDrag) { 491 | this.renderAngularDrag(body); 492 | } 493 | if (config.renderCenter) { 494 | this.renderCenter(body); 495 | } 496 | } 497 | ref = obj.children; 498 | for (i = 0, len = ref.length; i < len; i++) { 499 | child = ref[i]; 500 | this.renderObj(child); 501 | } 502 | return this; 503 | }; 504 | 505 | DebugArcadePhysics.prototype.renderBody = function(body) { 506 | this.game.debug.body(body.sprite, this.bodyColor(body), this.config.bodyFilled); 507 | return this; 508 | }; 509 | 510 | _line = new Line; 511 | 512 | DebugArcadePhysics.prototype.renderLine = function(startX, startY, endX, endY, color, width) { 513 | _line.setTo(startX, startY, endX, endY); 514 | this.geom(_line, color, false, width); 515 | return this; 516 | }; 517 | 518 | DebugArcadePhysics.prototype.renderLineDelta = function(startX, startY, deltaX, deltaY, color, width) { 519 | this.renderLine(startX, startY, startX + deltaX, startY + deltaY, color, width); 520 | return this; 521 | }; 522 | 523 | _offset = new Line; 524 | 525 | DebugArcadePhysics.prototype.renderOffset = function(body) { 526 | this.placeVectorXY(_offset, body.position.x, body.position.y, -body.offset.x * body.sprite.scale.x, -body.offset.y * body.sprite.scale.y); 527 | this.geom(_offset, this.colors.offset, false); 528 | return this; 529 | }; 530 | 531 | _rect = new Rectangle; 532 | 533 | DebugArcadePhysics.prototype.renderRect = function(vector, body, color) { 534 | if (vector.isZero()) { 535 | return this; 536 | } 537 | this.placeRect(_rect, body.center, vector); 538 | this.geom(_rect, color); 539 | return this; 540 | }; 541 | 542 | DebugArcadePhysics.prototype.renderRotation = function(body) { 543 | var halfHeight, halfWidth, rotation; 544 | halfHeight = body.halfHeight, halfWidth = body.halfWidth, rotation = body.rotation; 545 | rotation *= degreeToRadiansFactor; 546 | this.renderVectorXY(halfWidth * cos(rotation), halfHeight * sin(rotation), body, this.colors.rotation); 547 | return this; 548 | }; 549 | 550 | DebugArcadePhysics.prototype.renderSpeed = function(body) { 551 | if (body.speed < 1) { 552 | return this; 553 | } 554 | this.renderCircle(body.speed, body, this.colors.speed); 555 | return this; 556 | }; 557 | 558 | DebugArcadePhysics.prototype.renderTouching = function(body) { 559 | if (!body.touching.none) { 560 | this.renderEdges(body, body.touching, this.colors.touching); 561 | } 562 | return this; 563 | }; 564 | 565 | DebugArcadePhysics.prototype.renderVector = function(vector, body, color) { 566 | if (vector.isZero()) { 567 | return this; 568 | } 569 | this.renderVectorXY(vector.x, vector.y, body, color); 570 | return this; 571 | }; 572 | 573 | DebugArcadePhysics.prototype.renderVectorXY = function(vectorX, vectorY, body, color) { 574 | if (vectorX === 0 && vectorY === 0) { 575 | return this; 576 | } 577 | this.renderLineDelta(body.center.x, body.center.y, vectorX, vectorY, color); 578 | return this; 579 | }; 580 | 581 | DebugArcadePhysics.prototype.renderVelocity = function(body) { 582 | this.renderVector(body.velocity, body, this.colors.velocity); 583 | return this; 584 | }; 585 | 586 | DebugArcadePhysics.prototype.show = function() { 587 | this.visible = true; 588 | return this; 589 | }; 590 | 591 | DebugArcadePhysics.prototype.toggle = function() { 592 | this.config.on = !this.config.on; 593 | return this; 594 | }; 595 | 596 | DebugArcadePhysics.prototype.toggleVisible = function() { 597 | this.visible = !this.visible; 598 | return this; 599 | }; 600 | 601 | DebugArcadePhysics.prototype["interface"] = function() { 602 | return freeze({ 603 | acceleration: this.renderAcceleration.bind(this), 604 | body: this.renderBody.bind(this), 605 | center: this.renderCenter.bind(this), 606 | circle: this.renderCircle.bind(this), 607 | config: this.config, 608 | configSet: this.configSet.bind(this), 609 | drag: this.renderDrag.bind(this), 610 | help: this.help.bind(this), 611 | helpConfig: this.helpConfig.bind(this), 612 | hide: this.hide.bind(this), 613 | maxVelocity: this.renderMaxVelocity.bind(this), 614 | obj: this.renderObj.bind(this), 615 | off: this.off.bind(this), 616 | offset: this.renderOffset.bind(this), 617 | on: this.on.bind(this), 618 | rect: this.renderRect.bind(this), 619 | rotation: this.renderRotation.bind(this), 620 | show: this.show.bind(this), 621 | speed: this.renderSpeed.bind(this), 622 | vector: this.renderVector.bind(this), 623 | vectorXY: this.renderVectorXY.bind(this), 624 | velocity: this.renderVelocity.bind(this), 625 | toggle: this.toggle.bind(this) 626 | }); 627 | }; 628 | 629 | return DebugArcadePhysics; 630 | 631 | })(Phaser.Plugin)); 632 | 633 | }).call(this); 634 | 635 | --------------------------------------------------------------------------------