Pet_1) init, API Doc 활용, phaser 함수 다시 이해

//this game will have only 1 state

var GameState = {

// initiate some game-level settings

// 게임이 시작하면서 init을 통해 일반적인 세팅을 해준다

init: function() {

// scaling options

// 화면 크기 설정한 픽셀만큼 꽉 채워서 보여주도록 설정

this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;

// 수직, 수평 정렬 활성화

this.scale.pageAlignHorizontally = true;

this.scale.pageAlignVertically = true;

},

//load the game assets before the game starts

preload: function() {

this.load.image('backyard', 'assets/images/backyard.png');

this.load.image('apple', 'assets/images/apple.png');

this.load.image('candy', 'assets/images/candy.png');

this.load.image('rotate', 'assets/images/rotate.png');

this.load.image('toy', 'assets/images/rubber_duck.png');

this.load.image('arrow', 'assets/images/arrow.png');

// API 적극적으로 활용한다

// http://phaser.io/docs/2.6.2/Phaser.Loader.html#spritesheet

this.load.spritesheet('pet', 'assets/images/pet.png', 97, 83, 5, 1, 1);

},

//executed after everything is loaded

create: function() {

// 아래 문을 예로 이해의 폭을 넓히자면

// 어떠한 attribute을 설정해주는 것이 아니고

// this.background : 이 게임 object내에 background라는 변수를 선언하고

// this.game 이 게임의 오브젝트가 가진 add의 sprite라는 메소드를 사용하여

// 위치 0, 0에 asset을 'backyard' 라는 key를 가진 asset을 쓰겠다는 의미이다

this.background = this.game.add.sprite(0, 0, 'backyard');

this.pet = this.game.add.sprite(100, 400, 'pet');

this.pet.anchor.setTo(0.5);

//custom properties

this.pet.customParams = {health: 100, fun: 100};

this.apple = this.game.add.sprite(72, 570, 'apple');

this.candy = this.game.add.sprite(144, 570, 'candy');

this.toy = this.game.add.sprite(216, 570, 'toy');

this.rotate = this.game.add.sprite(288, 570, 'rotate');

},

};

//initiate the Phaser framework

var game = new Phaser.Game(360, 640, Phaser.AUTO);

game.state.add('GameState', GameState);

game.state.start('GameState');