<!DOCTYPE HTML>
<HTML>
<HEAD>
<TITLE>30秒</TITLE>
</HEAD>
<BODY>
<div style="margin: 0 auto;width: 500px;">
<P>
Press W, A, S, D keys to move
</P>
<SECTION style="border-style: solid; border-width: 2px; width: 500px;">
<CANVAS WIDTH="500" HEIGHT="500" ID="canvas_1" tabindex="0">
Canvas tag not supported
</CANVAS>
</SECTION>
<div id = "ptx">
x
</div>
<div id = "pty">
y
</div>
<div id = "result">
result
</div>
</div>
<SCRIPT>
var canvas = document.getElementById("canvas_1");
canvas.addEventListener('keydown', doKeyDown, true);
canvas.addEventListener('keyup', doKeyUp, true);
canvas_context = canvas.getContext("2d");
var seconds = 0; //记数时间
var handle; //事件柄
handle = setInterval("timer()",1000);
canvas.focus();
var keybuf = {};
var x = 250.0;
var y = 250.0;
var bulletList = new Array(60);
for (var i=0; i<bulletList.length ; i++) {
var tempBullet;
if((tempBullet=createBullet())!=null ){
bulletList[i] = null;
bulletList[i] =tempBullet;
}
}
setInterval("reflash()", 1000 / 60);
function reflash() {
clearCanvas();
canvas_context.fillStyle = "orange";
//canvas_context.fillRect(x, y, 10, 10);
canvas_context.beginPath();
canvas_context.arc(x,y,5,0,2*Math.PI,true);
canvas_context.stroke();
canvas_context.fill();
// draw bullet
doKeyEvent();
for (var i=0; i<bulletList.length ; i++) {
bulletList[i].move();
bulletList[i].draw();
}
// hit bullet
for (var k=0; k<bulletList.length ; k++) {
//if(Math.abs(x-bulletList[k].bx)<10.0 && Math.abs(y-bulletList[k].by)<10.0){
if( Math.sqrt(Math.pow((x-bulletList[k].bx),2)+ Math.pow((y-bulletList[k].by),2)) < 10 ) {
if(seconds <= 10){
alert("you lost" + "\n"+seconds+"\n"+"你弱爆了!!");
}else if (seconds < 20 ){
alert("you lost" + "\n"+seconds+"\n"+"再接再厉!!");
}else if (seconds < 30 ){
alert("you lost" + "\n"+seconds+"\n"+"你是男人!");
}else if (seconds < 40 ){
alert("you lost" + "\n"+seconds+"\n"+"你是男人!");
}else if (seconds < 50 ){
alert("you lost" + "\n"+seconds+"\n"+"你是男人!!");
}else if (seconds < 60 ){
alert("you lost" + "\n"+seconds+"\n"+"你是男人!!!");
}else if (seconds >= 70 ){
alert("you lost" + "\n"+seconds+"\n"+"春哥附体拉!");
}
window.location.reload();
//document.getElementById("result").innerHTML = "you failed";
}
}
// bullet number
for (var j=0; j<bulletList.length ; j++) {
if (bulletList[j].bx < 0 || bulletList[j].bx > 500 || bulletList[j].by < 0 || bulletList[j].by > 500) {
var tempBullet;
if((tempBullet=createBullet()) != null ) {
bulletList[j] = null;
bulletList[j] = tempBullet;
} else{
i--;
}
}
}
document.getElementById("ptx").innerHTML = x;
document.getElementById("pty").innerHTML = y;
}
function timer () {
seconds ++;
}
function createBullet(){
var dir = Math.ceil(Math.random()*4);
var s_x ;
var s_y ;
var s_cos ;
var s_sin ;
if(dir == 1){
s_x = Math.ceil(Math.random()*490);
s_y = 0;
s_cos = Math.random() * 2.0-1.0;
s_sin = Math.sqrt(1-s_cos * s_cos);
} else if (dir == 2){
s_x = 0;
s_y = Math.ceil(Math.random()*490);
s_sin = Math.random() * 2.0-1.0 ;
s_cos = Math.sqrt(1-s_sin * s_sin);
} else if (dir == 3){
s_x = Math.ceil(Math.random()*490) ;
s_y = 490;
s_cos = Math.random() * 2.0-1.0;
s_sin = -Math.sqrt(1-s_cos * s_cos);
} else if (dir == 4){
s_x = 490;
s_y = Math.ceil(Math.random()*490);
s_sin = Math.random() * 2.0-1.0 ;
s_cos = -Math.sqrt(1-s_sin * s_sin);
} else if (dir ==0 ){
return null;
}
return new bullet(s_x,s_y,s_cos,s_sin);
}
function doKeyUp(e) {
var evt = e || window.event;
keybuf[evt.keyCode] = false;
//doKeyEvent();
}
function doKeyPress(e) {
doKeyEvent();
}
function doKeyDown(e) {
var evt = e || window.event;
keybuf[evt.keyCode] = true;
//doKeyEvent();
}
function doKeyEvent() {
var speed = 1.5 ;
// THE w KEY
if (keybuf[87] == true && judge_frontier()) {
y = y - speed;
if (!judge_frontier()) {
y = y + speed;
}
}
// THE s KEY
if (keybuf[83] == true && judge_frontier()) {
y = y + speed;
if (!judge_frontier()) {
y = y - speed;
}
}
// THE a KEY
if (keybuf[65] == true && judge_frontier()) {
x = x - speed;
if (!judge_frontier()) {
x = x + speed;
}
}
// THE d KEY
if (keybuf[68] == true && judge_frontier()) {
x = x + speed;
if (!judge_frontier()) {
x = x - speed;
}
}
}
function judge_frontier() {
if (x < 5 || x > 475 || y < 5 || y > 475) {
return false;
} else {
return true;
}
}
function bullet(startx , starty, cos , sin) {
this.bx = startx;
this.by = starty;
this.speed = 1.0;
//this.startx = startx;
//this.starty = starty;
this.cos = cos;
this.sin = sin;
this.draw = function() {
canvas_context.fillStyle = "brown";
//canvas_context.fillRect(this.bx, this.by, 10, 10);
canvas_context.beginPath();
canvas_context.arc(this.bx, this.by,5,0,2*Math.PI,true);
canvas_context.stroke();
canvas_context.fill();
}
this.move = function() {
this.bx = this.bx + this.speed * this.cos;
this.by = this.by + this.speed * this.sin;
}
}
function clearCanvas() {
canvas.width = canvas.width;
}
</SCRIPT>
</BODY>
</HTML>
最終更新:2013年06月17日 11:26