Phaser Mask

by karasutengu

HTML

<body>
<script src='https://cdnjs.cloudflare.com/ajax/libs/phaser/2.6.1/phaser.min.js'></script>
</body>

CSS

body {
    background-color: #000000;
    border: 0;
    margin: 0;
    overflow: hidden:
  }

JavaScript

var mask;
var img;

function preload() {
game.load.crossOrigin = "Anonymous";
game.load.image('back', 'http://i.imgur.com/cZCZOVG.jpg');
}

function create() {
  img = game.add.image(game.world.centerX, game.world.centerY, 'back').anchor.setTo(0.5);
  mask = game.add.graphics(0, 0);
  mask.beginFill(0xffffff);
  mask.drawCircle(game.world.centerX, game.world.centerY, 600);
  img.mask = mask;
}


var game = new Phaser.Game(800, 800,
  Phaser.AUTO, 'particles', {
    preload: preload,
    create: create
  });