Forked from: alkaid_72th's しゅーてぃんぐゲーム tmlib.js #techbuzz View Diff (226) Acceleration STG || tmlib.js alkaid_72th Follow 2012-12-26 03:46:07 License: MIT License Fork2 Fav0 View2662 Play Stop Reload Fullscreen Smart Phone Fork tree Readme JavaScript 228 lines HTML 1 lines CSS 0 lines iPhoneだけしか遊べないけど加速度センサを利用した縦STG作りました。 ~操作方法~ ・移動:iPhoneを傾ける ・弾丸発射:画面をタッチする Acceleration STG || tmlib.js tmlib.js v0.1.4 /* * 定数 */ var PLAYER_SIZE = 32;//自機の大きさ var ENEMY_SIZE = 32;//敵の大きさ var BULLET_SIZE = 16;//弾丸大きさ var GAME_SIZE = 320;//ゲーム画面の大きさ var INITIAL_POSITION_X = GAME_SIZE / 2;//自機の初期x座標 var INITIAL_POSITION_Y = GAME_SIZE / 4 * 3;//自機の初期y座標 /* * プレイヤークラス */ var Player = tm.createClass({ superClass: tm.app.TriangleShape, //初期化関数 init:function(){ this.superInit(PLAYER_SIZE, PLAYER_SIZE); this.v = tm.geom.Vector2(0, 0);//2次元ベクトル取得? }, //更新関数 update:function(app){ var gravity = app.accelerometer.gravity;//iPhoneの加速度取得 //移動 this.x += gravity.x * 1.5; this.y -= gravity.y * 1.5; //画面内制御 if(this.x < 0){ this.x = 0; }else if(this.x > GAME_SIZE){ this.x = GAME_SIZE; } if(this.y < 0){ this.y = 0; }else if(this.y > GAME_SIZE){ this.y = GAME_SIZE; } }, }); /* * エネミークラス */ var Enemy = tm.createClass({ superClass: tm.app.StarShape, //初期化関数 init:function(){ this.superInit(ENEMY_SIZE, ENEMY_SIZE); this.tick = 0; this.hit_flag = false; }, //更新関数 update:function(app){ this.x += Math.sin(this.tick * 10 * Math.PI / 180) * 4; this.y += 8; this.rotation += 15; //削除判定 if(this.y > GAME_SIZE || this.hit_flag === true){ this.remove(); enemyList.erase(this); } this.tick++; } }); /* * 弾丸クラス */ var Bullet = tm.createClass({ superClass:tm.app.TriangleShape, // 初期化 init:function(){ this.superInit(BULLET_SIZE, BULLET_SIZE); this.hit_flag = false; }, //更新 update:function(app){ this.y -= 8;//移動 //削除判定 if(this.y < 0 || this.hit_flag == true){ this.remove(); bulletList.erase(this); } } }); /* * タイトル画面クラス */ var TitleScene = tm.createClass({ superClass:tm.app.TitleScene, //初期化関数 init:function(){ this.superInit({ title:"Acceleration STG", width:GAME_SIZE, height:GAME_SIZE, }); }, //次のシーン呼び出し関数 onnextscene:function(){ var mainScene = new MainScene(); app.replaceScene(mainScene);//ゲーム画面を呼び出す } }); /* * リザルト画面クラス */ var ResultScene = tm.createClass({ superClass:tm.app.ResultScene, //初期化関数 init:function(){ this.superInit({ score: score, hashtags: "tmlib.js", url: "http://jsrun.it/alkaid_72th/astg", msg: "GAME OVER!! @alkaid_72th", width: GAME_SIZE, height: GAME_SIZE }); score = 0;//スコアの初期化 }, //次のシーンの呼び出し関数 onnextscene:function(){ app.replaceScene(TitleScene());//タイトル画面を呼び出す } }); /* * ゲーム画面クラス */ var MainScene = tm.createClass({ superClass:tm.app.Scene, //初期化関数 init:function(){ this.superInit(); enemyList = [];//敵の配列 bulletList = [];//弾丸の配列 //プレイヤー表示 this.player = Player(); this.addChild(this.player); this.player.x = INITIAL_POSITION_X; this.player.y = INITIAL_POSITION_Y; //スコア表示 this.score = tm.app.Label(""); this.score.width = 300; this.score.setPosition(5, 40); this.score.fillStyle = "white"; this.addChild(this.score); }, //更新関数 update:function(){ this.score.text = "SCORE:" + score;//スコアを更新する if(app.frame % 10 === 0){score += 5;}//10回の更新毎にスコアを加算する //弾丸生成 var p = app.pointing; if(p.getPointing() && app.frame % 8 === 0){ var bullet = Bullet(); bullet.x = this.player.x; bullet.y = this.player.y; this.addChild(bullet); bulletList.push(bullet); } //エネミー生成 if(app.frame % 8 === 0){ var enemy = Enemy(); enemy.x = tm.util.Random.randint(0, GAME_SIZE); enemy.y = -50; this.addChild(enemy); enemyList.push(enemy); } //衝突判定 for(var i=0, e_len = enemyList.length; i < e_len; i++){ var enemy = enemyList[i]; //自機と敵の衝突判定 if(this.player.isHitElement(enemy)){ app.replaceScene(ResultScene()); } //弾丸と敵の衝突判定 for(var j = 0, b_len = bulletList.length; j < b_len; ++j){ var bullet = bulletList[j]; if(bullet.isHitElement(enemy)){ enemy.hit_flag = true; bullet.hit_flag = true; score += 100; } } } }, }); /* * グローバル変数 */ var app = null;//アプリ var player = null;//プレイヤー var enemyList = null;//敵の配列 var bulletList = null;//弾丸の配列 var score = 0;//スコア /* * メイン関数 */ tm.main(function(){ app = tm.app.CanvasApp("#world");//worldという名前のキャンバスを作る? app.resize(GAME_SIZE, GAME_SIZE);//画面のサイズを再定義? app.fitWindow();//画面の大きさを自動変更する app.replaceScene(TitleScene());//タイトル画面を呼び出す app.run();//ゲームを起動させる }); <canvas id="world" width="320" height="320"></canvas> Acceleration STG || tmlib.js iPhoneだけしか遊べないけど加速度センサを利用した縦STG作りました。 ~操作方法~ ・移動:iPhoneを傾ける ・弾丸発射:画面をタッチする /* * 定数 */ var PLAYER_SIZE = 32;//自機の大きさ var ENEMY_SIZE = 32;//敵の大きさ var BULLET_SIZE = 16;//弾丸大きさ var GAME_SIZE = 320;//ゲーム画面の大きさ var INITIAL_POSITION_X = GAME_SIZE / 2;//自機の初期x座標 var INITIAL_POSITION_Y = GAME_SIZE / 4 * 3;//自機の初期y座標 /* * プレイヤークラス */ var Player = tm.createClass({ superClass: tm.app.TriangleShape, //初期化関数 init:function(){ this.superInit(PLAYER_SIZE, PLAYER_SIZE); this.v = tm.geom.Vector2(0, 0);//2次元ベクトル取得? }, //更新関数 update:function(app){ var gravity = app.accelerometer.gravity;//iPhoneの加速度取得 //移動 this.x += gravity.x * 1.5; this.y -= gravity.y * 1.5; //画面内制御 if(this.x < 0){ this.x = 0; }else if(this.x > GAME_SIZE){ this.x = GAME_SIZE; } if(this.y < 0){ this.y = 0; }else if(this.y > GAME_SIZE){ this.y = GAME_SIZE; } }, }); /* * エネミークラス */ var Enemy = tm.createClass({ superClass: tm.app.StarShape, //初期化関数 init:function(){ this.superInit(ENEMY_SIZE, ENEMY_SIZE); this.tick = 0; this.hit_flag = false; }, //更新関数 update:function(app){ this.x += Math.sin(this.tick * 10 * Math.PI / 180) * 4; this.y += 8; this.rotation += 15; //削除判定 if(this.y > GAME_SIZE || this.hit_flag === true){ this.remove(); enemyList.erase(this); } this.tick++; } }); /* * 弾丸クラス */ var Bullet = tm.createClass({ superClass:tm.app.TriangleShape, // 初期化 init:function(){ this.superInit(BULLET_SIZE, BULLET_SIZE); this.hit_flag = false; }, //更新 update:function(app){ this.y -= 8;//移動 //削除判定 if(this.y < 0 || this.hit_flag == true){ this.remove(); bulletList.erase(this); } } }); /* * タイトル画面クラス */ var TitleScene = tm.createClass({ superClass:tm.app.TitleScene, //初期化関数 init:function(){ this.superInit({ title:"Acceleration STG", width:GAME_SIZE, height:GAME_SIZE, }); }, //次のシーン呼び出し関数 onnextscene:function(){ var mainScene = new MainScene(); app.replaceScene(mainScene);//ゲーム画面を呼び出す } }); /* * リザルト画面クラス */ var ResultScene = tm.createClass({ superClass:tm.app.ResultScene, //初期化関数 init:function(){ this.superInit({ score: score, hashtags: "tmlib.js", url: "http://jsrun.it/alkaid_72th/astg", msg: "GAME OVER!! @alkaid_72th", width: GAME_SIZE, height: GAME_SIZE }); score = 0;//スコアの初期化 }, //次のシーンの呼び出し関数 onnextscene:function(){ app.replaceScene(TitleScene());//タイトル画面を呼び出す } }); /* * ゲーム画面クラス */ var MainScene = tm.createClass({ superClass:tm.app.Scene, //初期化関数 init:function(){ this.superInit(); enemyList = [];//敵の配列 bulletList = [];//弾丸の配列 //プレイヤー表示 this.player = Player(); this.addChild(this.player); this.player.x = INITIAL_POSITION_X; this.player.y = INITIAL_POSITION_Y; //スコア表示 this.score = tm.app.Label(""); this.score.width = 300; this.score.setPosition(5, 40); this.score.fillStyle = "white"; this.addChild(this.score); }, //更新関数 update:function(){ this.score.text = "SCORE:" + score;//スコアを更新する if(app.frame % 10 === 0){score += 5;}//10回の更新毎にスコアを加算する //弾丸生成 var p = app.pointing; if(p.getPointing() && app.frame % 8 === 0){ var bullet = Bullet(); bullet.x = this.player.x; bullet.y = this.player.y; this.addChild(bullet); bulletList.push(bullet); } //エネミー生成 if(app.frame % 8 === 0){ var enemy = Enemy(); enemy.x = tm.util.Random.randint(0, GAME_SIZE); enemy.y = -50; this.addChild(enemy); enemyList.push(enemy); } //衝突判定 for(var i=0, e_len = enemyList.length; i < e_len; i++){ var enemy = enemyList[i]; //自機と敵の衝突判定 if(this.player.isHitElement(enemy)){ app.replaceScene(ResultScene()); } //弾丸と敵の衝突判定 for(var j = 0, b_len = bulletList.length; j < b_len; ++j){ var bullet = bulletList[j]; if(bullet.isHitElement(enemy)){ enemy.hit_flag = true; bullet.hit_flag = true; score += 100; } } } }, }); /* * グローバル変数 */ var app = null;//アプリ var player = null;//プレイヤー var enemyList = null;//敵の配列 var bulletList = null;//弾丸の配列 var score = 0;//スコア /* * メイン関数 */ tm.main(function(){ app = tm.app.CanvasApp("#world");//worldという名前のキャンバスを作る? app.resize(GAME_SIZE, GAME_SIZE);//画面のサイズを再定義? app.fitWindow();//画面の大きさを自動変更する app.replaceScene(TitleScene());//タイトル画面を呼び出す app.run();//ゲームを起動させる }); <canvas id="world" width="320" height="320"></canvas> use an iframe compat browser, deer Play on jsdo.it games Author Share ブログに埋め込む QR Tag Download Complete! Description What kind of game? iPhoneだけしか遊べないけど加速度センサを利用した縦STG作りました。 ~操作方法~ ・移動:iPhoneを傾ける ・弾丸発射:画面をタッチする Control Device Smartphone Controllerjsdo.it WebSocket Controller» Mouse Keyboard Touch Device Fullscreen Activated Inactivated jsdo.it games から削除する Submit Author alkaid_72th URLhttps://twitter.com/alkaid_72th Tweet Default Panel Auto play Screenshot Readme JavaScript HTML CSS Size Width: px Height: px code <script type="text/javascript" src="http://jsdo.it/blogparts/kKsP/js"></script> application game javascript tmlib.js Discussion Questions on this code? Tags application game javascript tmlib.js Forked sort by latest page views favorite forked 弾幕STG制作part1 ~自機編~ alkaid_72th 10 3375 92/1/1 application game javascript tmlib.js tmlib.js/examples/star-piano( alkaid_72th 10 730 83/2/1 art&design javascript tmlib.js