tank html5,index.html
經(jīng)典的坦克大戰(zhàn)
var page = document.getElementById('page');
var canvas = document.getElementById('tankMap');
var cxt = canvas.getContext("2d");
var key = []
var heroColor = ['#6699CC' , '#006699']
var hero = new Hero(225 ,470 ,0 ,heroColor);
hero.speed = 5;
curMap = 0;
var enemies = map[curMap].enemies.slice(0);
var showEnemies = enemies.splice(0,4);
var bricks = map[curMap].bricks.slice(0);
var steels = map[curMap].steels.slice(0);
var endTimer=null;
function flashMap() {
cxt.clearRect ( 0 , 0, 1200, 600 );
keyEvent();
if( !endTimer && showEnemies.length === 0 ){
endTimer = setTimeout( function(){
console.log('Game over')
clearInterval(flashInterval);
drawEnd();
if(curMap < map.length) curMap++;
else{
console.log('游戲完全結(jié)束');
alert('恭喜你通關(guān)了!刷新頁(yè)面重新闖關(guān)');
return;
}
enemies = map[curMap].enemies.slice(0);
showEnemies = enemies.splice(0,4);
bricks = map[curMap].bricks.slice(0);
steels = map[curMap].steels.slice(0);
endTimer=null;
hero.x = 225;
hero.y = 470;
setTimeout(function(){
for (var i = 0; i < showEnemies.length; i++) {
enemyRun( showEnemies[i] ,i );
}
flashInterval = setInterval( flashMap,13 );
},5000);
} , 5000)
}
drawTank( hero );
for (var i = 0; i < showEnemies.length; i++) {
drawTank( showEnemies[i] );
if( showEnemies.length < 4 && enemies.length !== 0 ){
var newEnemy = enemies.splice(0,1)[0];
showEnemies.push( newEnemy );
enemyRun( newEnemy )
}
}
drawHeroLife();
for (var i = 0; i < bricks.length; i++) {
drawBrick(bricks[i])
}
for (var i = 0; i < steels.length; i++) {
drawSteel(steels[i]);
}
}
// 刷新重繪
var flashInterval = setInterval( flashMap,13 );
// 敵機(jī)AI
// 自由移動(dòng)發(fā)射
for (var i = 0; i < showEnemies.length; i++) {
enemyRun( showEnemies[i] ,i );
}
function enemyRun(itemEnemy){
var direct = 2;
var count = 0;
var steps = 80;
itemEnemy.timer = setInterval(function () {
if( count > steps ){
direct = parseInt(Math.random() * 4);
count = -direct;
steps = parseInt(Math.random() * 200);
}
count++;
var dir = ['moveUp' , 'moveRight' , 'moveDown' , 'moveLeft'];
itemEnemy[ dir[ direct ] ]();
// 敵機(jī)子彈發(fā)射頻率
if( !itemEnemy.fireTimer ){
itemEnemy.fireTimer = setTimeout(function(){
itemEnemy.fire();
itemEnemy.fireTimer = null;
},parseInt(Math.random() * 5000));
}
}, 2 * 15 / itemEnemy.speed );
}
// 英雄操作
page.onkeydown = function (ev) {
var ev = ev || window.event;
var keycode = ev.keyCode;
// console.log(ev);
if( !key.contain( keycode ) ) key.push( keycode );
//switch( keycode ){
//case 87: // up
//if ( !hero.moveTimer ) hero.moveTimer = setInterval( function(){hero.moveUp();} , 30);
//break;
//case 68: // right
//if ( !hero.moveTimer ) hero.moveTimer = setInterval( function(){hero.moveRight();} , 30);
//break;
//case 83: // down
//if ( !hero.moveTimer ) hero.moveTimer = setInterval( function(){hero.moveDown();} , 30);
//break;
//case 65: // left
//if ( !hero.moveTimer ) hero.moveTimer = setInterval( function(){hero.moveLeft();} , 30);
//break;
//case 74: // J
//hero.fire();
//break;
//}
}
page.onkeyup = function (ev) {
var ev = ev || window.event;
var keycode = ev.keyCode;
key.remove( keycode );
//switch( keycode ){
//case 87: // up
//clearInterval( hero.moveTimer );
//hero.moveTimer = null;
//break;
//case 68: // right
//clearInterval( hero.moveTimer );
//hero.moveTimer = null;
//break;
//case 83: // down
//clearInterval( hero.moveTimer );
//hero.moveTimer = null;
//break;
//case 65: // left
//clearInterval( hero.moveTimer );
//hero.moveTimer = null;
//break;
//case 74: // J
//hero.fire();
//break;
//}
}
function keyEvent(){
if( key.contain( UP ) ){
hero.moveUp();
}else if( key.contain( RIGHT ) ){
hero.moveRight();
}else if( key.contain( LEFT ) ){
hero.moveLeft();
}else if( key.contain( DOWN ) ){
hero.moveDown();
}
}
一鍵復(fù)制
編輯
Web IDE
原始數(shù)據(jù)
按行查看
歷史
總結(jié)
以上是生活随笔為你收集整理的tank html5,index.html的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 微型计算机的评估指标,T∕CECA-G
- 下一篇: 对计算机应用的认识100,计算机应用基础