Load base64 image in Phaser

by Dan Wolfe

HTML

<script src="https://rawgithub.com/photonstorm/phaser/master/build/phaser.js"></script>

JavaScript

window.onload = function () {

    var game = new Phaser.Game(690, 360, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create });
    
    function preload() {
        game.load.image('image-url', 'http://placekitten.com/g/300/300');
        
        var dataURI =  'data:image/png;base64,'+
'iVBORw0KGgoAAAANSUhEUgAAAGAAAAATCAYAAABvLghXAAABZElEQVR42u2YUQrCMAyGdwjB13kP'+
'z7GrCJ5qexC8mw8VnZOsa5K/TXAbthDEKV/+Jk3Wtmn0ERjzGpWvAU99tzCDs8qX4BRyvJ5nnxRM'+
'R4aTpNiU8L3xpxhZ+Kp4OokIHkqTm/q+B753fFihXKll9j1Y/B74NEZxokv4LKDrL1+TJqk4E1em'+
'NIkSPuIj/j2X753sZB+jwZcS8Hr+CEsjTsziET4NajukWe3HNqa/EVe+lAAOHjmBVnmO+BSfC/gi'+
'AcPm9M8rwJIApszU6or59L8oH1lArUE/ukDjdyjA9y8xrYdOAkpbHMK3tFBUP3oeUPhyGRe+ZCA+'+
'MoFSvpZgabeH6neKz+iE2zkgvQ/Y55omUcrPTLC7/uhwhh2xDdnN5mfup2E+x0o9t+h3js/Sibaf'+
'LrjrCLknyj/jzy+bnC+xVuML/d7MVw519Zp4x/xx3G+HQD8r/4f8Gpx1+W8wtcr35z8BKzsYemDt'+
'gtgAAAAASUVORK5CYII=';

        var data = new Image();
        data.src = dataURI;
        game.cache.addImage('image-data', dataURI, data);
    }
    
    function create() {          
        game.add.sprite(360, 30, 'image-data');
    }
};