ぺらぺら小僧がめおべ（解説）

「ゲームオーバーを表示させよう」という授業の後作ったものです。

ゲームオーバーを画面の中央に表示して、少しずつ大きくするという課題でした。

この時に、Piskelの使い方も習って、その時にフレームを使ったアニメーションの作り方も教えていただいて、作ったキャラクターがぺらぺらおしゃべりしているように見えたので、ぺらぺら小僧と名付けました。

おしゃべりなぺらぺら小僧。隕石が近づいてくるのにも気づかず、ぺらぺら喋っています。
「ぺらぺら小僧！うしろ！」

var assets = [
 // 背景
 'images/space.png',
 // 隕石
 'images/asteroid_1.png',
 // 戦闘機
 'images/cf307/perapera.png',
 // 爆発
 'images/bomb.png',
 // ゲームオーバー
 "images/title_gameover.png",
 // 音
 'sounds/bomb.mp3',
 'sounds/bomb_l.mp3',
 // CodeFriendsタイトル
 "images/title.png",
 "images/planet_04.png"　　　
];

function gameStart(){// ゲーム画面
    var scene = gameManager.createGameScene();
    core.replaceScene(scene); core.resume();

    //==========
    // ここから
    //==========

    // 背景
    var background = new ExSprite(320, 480);
    background.image = core.assets["images/space.png"];
    scene.addChild(background);

    // プレイヤー
    var soldier = new ExSprite(64, 64);
    soldier.image = core.assets["images/cf307/perapera.png"];
    soldier.x = 320 / 2 - soldier.width / 2;
    soldier.y = 250;
    scene.addChild(soldier);
    soldier.frame = [0, 1, 2,];

    //惑星
    var pla = new ExSprite(88, 88);
    pla.image =core.assets["images/planet_04.png"];
    pla.x = 320,
    pla.y = 0;
    scene.addChild(pla);
    pla.scale(0.1, 0.1);
    pla.tl.then(function(){ 
        pla.tl.moveTo(soldier.x - 12, soldier.y, 50 - 12); 
        pla.tl.scaleTo(1, 1, 10); 
    });

    // 50フレーム後に戦闘機爆発
    soldier.addCollision(pla);
    soldier.addEventListener(Event.COLLISION,function(e){
        var bomb = new ExSprite(32, 32);
        bomb.image = core.assets["images/bomb.png"];
        bomb.x = soldier.x;
        bomb.y = soldier.y;
        scene.addChild(bomb);
        bomb.tl.scaleTo(5, 5, 0);
        // 爆発のアニメーション
        bomb.frame = [0, 1, 2, 3, 4, null];
        bomb.addEventListener(Event.ANIMATION_END, function(){
            // ゲームオーバーを表示させる
            var gameover = new ExSprite(147, 48);
            gameover.image = core.assets['images/title_gameover.png'];
            gameover.x = 320 / 2 - gameover.width/2;
            gameover.y = 480 / 2 - gameover.height/2;
            scene.addChild(gameover);
            // 少しずつ大きくさせてみよう
            gameover.scale(0.5, 0.5);
            gameover.tl.scaleTo(2.3, 2.3, 10);
            gameover.tl.then(function() {
                core.stop();
            });
        });
        // 戦闘機を消す
        soldier.remove();
        // 爆発する音を鳴らす
        var sound = core.assets['sounds/bomb_l.mp3'].clone();
        sound.play();
    });

    //==========
    // ここまで
    //==========
}

function titleStart(){// タイトル画面
    var scene = gameManager.createTitleScene();
    core.replaceScene(scene); core.pause();
    scene.on(enchant.Event.TOUCH_START, function(){gameStart();});
}

//==========
// EnchantJS
var gameManager;
var core;
enchant();
gameManager = new common.GameManager();
window.onload = function() {
core = gameManager.createCore(320, 480);
core.preload(assets);
core.onload = function(){titleStart();};
core.start();
};