phina.jsを使ってみた2

前回つくったもに以下の修正を加えてみた。

• カーソルでの移動からマウスポインターでの移動に切り替え
• 敵を全て消したらポップアップでclearと表示

前回のものをVersion0.1とすると今回はversion0.2くらいになるんだろうか

phina.globalize();

var ASSETS = {
  image: {
    'night': './night.gif',
    'enemy': './wood.gif',
  },
};

phina.define('MainScene', {
  superClass: 'CanvasScene',

  init: function() {
    this.superInit();

    var enemys = 8;

    // プレイヤー
    var player = Sprite('night').addChildTo(this);
    player.x = this.gridX.center();
    player.y = this.gridY.center();
    this.player = player;

    // ラベル
    var label = Label('Hunting').addChildTo(this);
    label.x = this.gridX.center();
    label.y = 30;
    label.fill = 'red';
    label.fontSize = 48;

    // 敵をmonster定義
    this.monster = CanvasElement('enemy').addChildTo(this);
    // 障害物 n 個表示
    (enemys).times(function() {
        // 敵生成
        var enemy = Sprite('enemy').addChildTo(this.monster);
        // 位置をランダムに設定
        enemy.x = Random.randint(0, 640);
        enemy.y = Random.randint(0, 960);
    }, this),

    // キャラクター移動
    this.update = function(app) {
        var keyboard = app.keyboard;

        // タッチ移動
        var p = app.pointer;
        this.player.x = p.x;
        this.player.y = p.y;

        // カーソル
        /*
        if(keyboard.getKey('left')) {
            player.x -= 16;
        };
        if(keyboard.getKey('right')) {
            player.x += 16;
        };
        if(keyboard.getKey('up')) {
            player.y -= 16;
        };
        if(keyboard.getKey('down')) {
            player.y += 16;
        };
        */


        // 衝突判定
        this.monster.children.each(function(child) {
            if (this.player.hitTestElement(child)) {
                // 敵を消す
                child.remove();
                // 敵の数をカウント
                enemys--;
                // 全て消したらalert表示
                if(enemys == 0){
                    alert('clear');
                }
            };
        }, this);
    };

  },
});

phina.main(function() {
  var app = GameApp({
    startLabel: 'main',
    assets: ASSETS,
  });
  app.run();
});

次は敵を押し出すように修正してみたいと思うが、カーソルではなくポインタでの場合に進行方向をどう取得するか考えないといけないのかな。

JavaScript 開発 phina.js