JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/phaser/2.0.2/phaser.min.js"></script>
<button id="pauseButton"></button>
JavaScript
var game = new Phaser.Game(480, 360, Phaser.AUTO, '', {
preload: preload,
create: create,
update: update,
render: render
});
function preload() {
game.load.crossOrigin = true;
game.load.image('sky', 'http://i.imgur.com/826zH6I.png');
game.load.image('diamond', 'http://i.imgur.com/CE723hP.png');
game.load.image('firstaid', 'http://i.imgur.com/bIgeKWU.png');
game.onPause.add(onPause);
game.onResume.add(onResume);
}
function create() {
sky = game.add.sprite(0, 0, 'sky');
diamond1 = game.add.sprite(32, 32, 'diamond');
firstaid1 = game.add.sprite(96, 32, 'firstaid');
diamond2 = game.add.sprite(32, 64, 'diamond');
firstaid2 = game.add.sprite(96, 64, 'firstaid');
function doAlert(text){
alert(text);
}
var textString = "";
textString = "Wow, a huge diamond! Score!";
diamond1.inputEnabled = true;
diamond1.events.onInputDown.add(function(){doAlert(textString)}, this);
textString = "Your wounds are healed!";
firstaid1.inputEnabled = true;
firstaid1.events.onInputDown.add(function(){doAlert(textString)}, this);
function makeAlert(text) {
return function () {
alert(text);
};
}
textString = "Wow, a huge diamond! Score!";
diamond2.inputEnabled = true;
diamond2.events.onInputDown.add(makeAlert(textString), this);
textString = "Your wounds are healed!";
firstaid2.inputEnabled = true;
firstaid2.events.onInputDown.add(makeAlert(textString), this);
}
function update() {
}
function render() {
}
function onPause() {
}
function onResume() {
}
$(function () {
$("#pauseButton").text("Pause").data("paused", false).click(function () {
$(this).data("paused", !$(this).data("paused"));
if ($(this).data("paused")) {
$(this).text("Resume");
game.paused = true;
} else {
$(this).text("Pause");
game.paused = false;
...