Monacaでenchan.jsのSpriteを使ってみる

Monacaでenchan.jsのSpriteを使って、くまのピンボールを作ってみた。

公式チュートリアルを参考に、シーンの追加、Spriteの定期処理を学んだ
Let’s start enchant.js | enchant.js - A simple JavaScript framework for creating games and apps.

コードは以下のとおり

// This is a JavaScript file
enchant();
window.onload = function(){
    var game = new Game(320, 320);
    game.fps = 16;
    
    game.preload('img/animal/space3.png');
    game.onload = function(){
        var bear = new Sprite(32, 32);
        bear.image = game.assets['img/animal/space3.png'];
        bear.tick = 0;
        bear.anim = [5, 6, 5, 7];
        
        //くまの動き量
        var xShift = 5;
        var yShift = 3;
        
        bear.addEventListener('enterframe', function(){
           bear.tick++;
           bear.frame = bear.anim[bear.tick % 4]; 
           bear.x += xShift;
           bear.y += yShift;
           
           //右端についたら
           if(bear.x > 320 - 32){
               xShift = -5;
               bear.scaleX = -1;
           }
           //左端についたら
           if(bear.x < 0) {
               xShift = 5;
               bear.scaleX = 1;
           }
          
          //下についたら
            if(bear.y > 320 - 32){
               yShift = -5;
           }
           //上についたら
           if(bear.y < 0) {
               yShift = 5;
           }
       
           
        });
        
        var bearScene = new Scene();
        game.pushScene(bearScene);
        bearScene.addChild(bear);
        //game.rootScene.addChild(bear);
     };
    game.start();
      
};

衝突判定を入れてみると以下のとおり。
本当は衝突したらしばらく止まるようにしたかったのだが、うまく行かなかったのでまた明日

// This is a JavaScript file
enchant();
window.onload = function(){
    var game = new Game(320, 320);
    game.fps = 16;
    
    game.preload('img/animal/space3.png');
    game.onload = function(){
        var bear = new Sprite(32, 32);
        var bear2 = new Sprite(32, 32);
        bear.image = game.assets['img/animal/space3.png'];
        bear2.image = game.assets['img/animal/space3.png'];
        bear.tick = 0;
        bear.anim = [5, 6, 5, 7];
        bear2.anim = [15, 16, 15, 17];
        
        //くまの初期位置
        bear.x = 0;
        bear.y = 0;
        bear2.x = 320 - 32;
        bear2.y = 0;
        
        //くまの初速
        var xShift1 = 5;
        var yShift1 = 3;
        var xShift2 = 4;
        var yShift2 = 7;
        
        //hitフラグ
        var hitFlag = false;
        
        bear.addEventListener('enterframe', function(){
           bear.tick++;
           bear.frame = bear.anim[bear.tick % 4]; 
           bear2.frame = bear2.anim[bear.tick % 4]; 
           
           bear.x += xShift1;
           bear.y += yShift1;
           bear2.x += xShift2;
           bear2.y += yShift2;
           
           //右端についたら
           if(bear.x > 320 - 32){
               xShift1 = -5;
               bear.scaleX = -1;
           }
           if(bear2.x > 320 - 32){
               xShift2 = -4;
               bear2.scaleX = -1;
           }
           //左端についたら
           if(bear.x < 0) {
               xShift1 = 5;
               bear.scaleX = 1;
           }
           if(bear2.x < 0) {
               xShift2 = 4;
               bear2.scaleX = 1;
           }
           
          //下についたら
            if(bear.y > 320 - 32){
               yShift1 = -3;
           }
            if(bear2.y > 320 - 32){
               yShift2 = -7;
           }
           //上についたら
           if(bear.y < 0) {
               yShift1 = 3;
           }
           if(bear2.y < 0) {
               yShift2 = 7;
           }
           
           //ぶつかった
           if(bear.within(bear2, 20)){
               hitFlag = true;
           }
           
           if(hitFlag){
               var xtmp1 = xShift1; var ytmp1 = yShift1; var scale1 = bear.scaleX
               var xtmp2 = yShift2; var ytmp2 = yShift2; var scale2 = bear2.scaleX
               var counter = 0;
               
               //最初の１秒
               while( counter != game.fps){    
                   bear.frame =
                   bear2.frame = 18;
                   xShift1 = 0; yShift1 = 0;
                   xShift2 = 0; yShift2 = 0;
                   console.log(counter);
                   counter++;
               }
               
                xShift1 = -xtmp1; yShift1 = -ytmp1; bear.scaleX = -scale1
                xShift2 = -xtmp2; yShift2 = -ytmp2; bear2.scaleX = -scale2
                hitFlag = false;
               
            }
           
        });
        
        var bearScene = new Scene();
        game.pushScene(bearScene);
        bearScene.addChild(bear);
        bearScene.addChild(bear2);
        //game.rootScene.addChild(bear);
     };
    game.start();
    
    
};