Farm_4) animation, audio, text

animation

var self = this;

var animal;

animalData.forEach(function(element){

// create each animal and save it's properties

// 위에서 프레임으로 잡아줬기 때문에 맽 끝에 프레임 번호를 넣어줘야 한다

animal = self.animals.create(-1000, self.game.world.centerY, element.key, 0);

//I'm saving everything that's not Phaser-related in an object

animal.customParams = {text: element.key};

//anchor point set to the center of the sprite

animal.anchor.setTo(0.5);

// create animal animation

// animation을 추가하는 것으로 임의의 animation명과 프레임 반복을 설정

// 3개의 프레임 per second 작동 설정, loop 설정 false

// 만약 loop가 true면 무한반복 한다

animal.animations.add('animate', [0, 1, 2, 1, 0, 1], 3, false);

//enable input so we can touch it

animal.inputEnabled = true;

animal.input.pixelPerfectClick = true;

animal.events.onInputDown.add(self.animateAnimal, self);

});

audio

1) preload로 쓰고자 하는 audio 준비

preload: function() {

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

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

this.load.spritesheet('chicken', 'assets/images/chicken_spritesheet.png', 131, 200, 3);

this.load.spritesheet('horse', 'assets/images/horse_spritesheet.png', 212, 200, 3);

this.load.spritesheet('pig', 'assets/images/pig_spritesheet.png', 297, 200, 3);

this.load.spritesheet('sheep', 'assets/images/sheep_spritesheet.png', 244, 200, 3);

// 아무거나 실행 되니까 두개 잡아도 상관 없다

this.load.audio('chickenSound', ['assets/audio/chicken.ogg', 'assets/audio/chicken.mp3']);

this.load.audio('horseSound', ['assets/audio/horse.ogg', 'assets/audio/horse.mp3']);

this.load.audio('pigSound', ['assets/audio/pig.ogg', 'assets/audio/pig.mp3']);

this.load.audio('sheepSound', ['assets/audio/sheep.ogg', 'assets/audio/sheep.mp3']);

},

2) forEach돌리기 위한 배열 설정이도 키 값을 audio로 설정

var animalData = [

{key: 'chicken', text: 'CHICKEN', audio: 'chickenSound'},

{key: 'horse', text: 'HORSE', audio: 'horseSound'},

{key: 'pig', text: 'PIG', audio: 'pigSound'},

{key: 'sheep', text: 'SHEEP', audio: 'sheepSound'}

];

3) forEach내부에서 customParams의 key값을 임의 설정 (sound는 키워드 아님)하고 잡아뒀던 오디오를 add

animal.customParams = {text: element.key, sound: self.game.add.audio(element.audio)};

4) 클릭시 실행되는 함수인 animateAnimal에서 3)에서 잡아둔 sound를 잡고 들어가서 play()를 실행

animateAnimal: function(sprite, event) {

sprite.play('animate');

// 여기서 sound는 내장된 키워드가 아니고 위에서 우리가

// customParams에서 sound로 키 값을 잡았기 때문이다

sprite.customParams.sound.play();

},

text

var animalData = [

{key: 'chicken', text: 'CHICKEN', audio: 'chickenSound'},

{key: 'horse', text: 'HORSE', audio: 'horseSound'},

{key: 'pig', text: 'PIG', audio: 'pigSound'},

{key: 'sheep', text: 'SHEEP', audio: 'sheepSound'}

];

//show animal text

this.showText(this.currentAnimal);

newAnimalMovement.onComplete.add(function()

{

this.isMoving = false;

this.showText(newAnimal);

}, this);

showText: function(animal) {

if(!this.animalText) {

var style = {

font: 'bold 30pt Arial',

fill: '#D0171B',

align: 'center'

}

this.animalText = this.game.add.text(this.game.width/2, this.game.height * 0.85, '', style);

this.animalText.anchor.setTo(0.5);

}

this.animalText.setText(animal.customParams.text);

this.animalText.visible = true;

}