phina.js Tips集 #当たり判定編 - Qiita
上記サイトを参考にphina.jsライブラリを使用し、下記のコードで四方八方から向かってくる正方形をよけてスコアを稼ぐ避けげーを作ろうと思っているのですが、100行目の
if(shape.hitTestElement(sprite)){
var self = this;
self.exit();
}
これらを追加するとコンソール上に”ReferenceError: sprite is not defined”(spriteが定義されていない)と表示されてしまい、うまくいきません。上記のコードを除くと正常に動作します。
initプロパティでspriteは定義しているように見えるのですが、何が問題なのでしょうか?
対処法をご教示いただきたいです。よろしくお願いします。
環境
OS: windows10
ブラウザ: firefox
対象のコード
<html>
<head>
<meta charset='utf-8' />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>Getting started | phina.js</title>
<!-- phina.js を読み込む -->
<script src='http://cdn.rawgit.com/phi-jp/phina.js/v0.2.0/build/phina.js'></script>
<!-- メイン処理 -->
<script>
// phina.js をグローバル領域に展開
phina.globalize();
var ASSETS = {
//image
image: {
'tomapiko': 'https://rawgit.com/phi-jp/phina.js/develop/assets/images/tomapiko.png',
},
};
var SCREEN_WIDTH = 640;
var SCREEN_HEIGHT = 960;
var SPEED = 5;
var ENEMY_INTERVAL = 10;
// MainScene クラスを定義
phina.define('MainScene', {
superClass: 'DisplayScene',
init: function() {
this.superInit();
// 背景色を指定
this.backgroundColor = '#444';
// スプライト画像作成
var sprite = Sprite('tomapiko').addChildTo(this);
// 初期位置
sprite.x = 325;
sprite.y = 740;
// 一定フレーム経過したら
// タッチ保持イベント
this.onpointstay = function(e) {
// スプライトをタッチ位置に
sprite.x = e.pointer.x;
sprite.y = e.pointer.y;
};
// タッチ移動イベント
this.onpointmove = function(e) {
// スプライトをタッチ位置に
sprite.x = e.pointer.x;
sprite.y = e.pointer.y;
};
},
update: function(app){
if (app.frame % ENEMY_INTERVAL === 0) {
// 敵生成
//長方形を描画
for(var kali = 1; kali <= 50;){
var default_x = Random.randint(-15,655);
var default_y = Random.randint(-15,975);
if (-5 <= default_x && default_x <= 645 && -5 <= default_y && default_y <= 965){}
else{
var shape = Shape().addChildTo(this);
shape.setSize(10,10);
shape.x = default_x;
shape.y = default_y;
if (-15 <= default_x && default_x <= 320 && -15 <= default_y && default_y <= 330){
// Physicalクラスを適用して移動
var phis_y_left_up = Random.randint(1,4)
var phis_x_left_up = Math.sqrt(25 - phis_y_left_up^2)
var last_x = phis_x_left_up
var last_y = phis_y_left_up
}
else if (321 <= default_x && default_x <= 655 && -15 <= default_y && default_y <= 330){
var phis_x_right_up = Random.randint(-1,-4)
var phis_y_right_up = Math.sqrt(25 - phis_x_right_up^2)
var last_x = phis_x_right_up
var last_y = phis_y_right_up
}
else if (-15 <= default_x && default_x <= 320 && 331 <= default_y && default_y <= 975){
var phis_y_left_down = Random.randint(-1,-4)
var phis_x_left_down = Math.sqrt(25 - phis_y_left_down^2)
var last_x = phis_x_left_down
var last_y = phis_y_left_down
}
else if(321 <= default_x && default_x <= 655 && 331 <= default_y && default_y <= 975){
var phis_x_right_down = Random.randint(-1,-4)
var kali_k = Math.sqrt(25 - phis_x_right_down^2)
var phis_y_right_down = kali_k * -1
var last_x = phis_x_right_down
var last_y = phis_y_right_down
}
shape.physical.force(last_x , last_y);
if(shape.hitTestElement(sprite)){
var self = this;
self.exit();
}
}
kali++;
}
}
}
});
// メイン処理
phina.main(function() {
// アプリケーション生成
var app = GameApp({
//startLabel: 'main', // メインシーンから開始する
assets: ASSETS, //loading image
});
// アプリケーション実行
app.run();
});
</script>
</head>
<body>
</body>
</html>