Html实验报告.docx
- 文档编号:13976313
- 上传时间:2023-06-19
- 格式:DOCX
- 页数:26
- 大小:842.87KB
Html实验报告.docx
《Html实验报告.docx》由会员分享,可在线阅读,更多相关《Html实验报告.docx(26页珍藏版)》请在冰点文库上搜索。
Html实验报告
Html实验报告
实验主题:
运用html语言编写一个网站或游戏。
小组成员:
软件1106班孙高飞20112250软件1106班钟伟20112260
实验目的:
检测自己掌握html的程度,训练运用html语言编程的能力,使自己多掌握一门编程的语言。
实验题目:
小游戏----“愤怒的小鸟”。
实验过程:
我们俩在选择题目时,本来想做一个网站,但又觉得网站没啥意思,所以我们决定做一个小游戏。
我们吸收了“桌面弹球”和“愤怒的小鸟”的经验,结合了两者的界面和规则,编写了一个小游戏。
当然,做小游戏并不是一帆风顺的,我们也有一些难题,就不一一阐述了,最后通过上网搜索和查资料的方法都一一解决了,最终生成了这个小游戏。
代码:
#000;">Nosupport
//
varcanvas=document.getElementById('canvas');
varcontext=canvas.getContext("2d");
varpig=newImage();
pig.src="pig.png";
varbird=newImage();
bird.src="bird.png";
varbackground=newImage();;
background.src="background.png";
varleft=newImage();
left.src="left.png";
varright=newImage();
right.src="right.png";
varpig2=newImage();
pig2.src="pig2.png";
varegg=newImage();
egg.src="egg.png";
varsmallPig=newImage();
smallPig.src="smallPig.png";
vargamestart=newImage();
gamestart.src="gamestart.png";
vargameState=["GameStart","InGame","GameOver","GameWin"];
varcurrentGameState=gameState[0];
varLevel=["Level1","Level2"];
varcurrentLevel=Level[0];
varnumberofenemy=32;
varboolhasEnemy=1;
functioninit(){
varb2Vec2=Box2D.Common.Math.b2Vec2
b2AABB=Box2D.Collision.b2AABB
b2BodyDef=Box2D.Dynamics.b2BodyDef
b2Body=Box2D.Dynamics.b2Body
b2FixtureDef=Box2D.Dynamics.b2FixtureDef
b2Fixture=Box2D.Dynamics.b2Fixture
b2World=Box2D.Dynamics.b2World
b2MassData=Box2D.Collision.Shapes.b2MassData
b2PolygonShape=Box2D.Collision.Shapes.b2PolygonShape
b2CircleShape=Box2D.Collision.Shapes.b2CircleShape
b2DebugDraw=Box2D.Dynamics.b2DebugDraw
b2MouseJointDef=Box2D.Dynamics.Joints.b2MouseJointDef
b2RevoluteJointDef=Box2D.Dynamics.Joints.b2RevoluteJointDef
;
varworld;
varground;
varenemy;
varleftFlipper;
varrightFlipper;
varleftjoint;
varrightjoint;
varourbird;
varlife=21;
varherolife=1;
createworld();
createground();
createcircle();
createbuttom();
createsmallEnemy();
createFlipper();
window.setInterval(update,1000/60);
varmouseX,mouseY,mousePVec,isMouseDown,selectedBody,mouseJoint;
varcanvasPosition=getElementPosition(document.getElementById("canvas"));
document.addEventListener("mousedown",function(e){
isMouseDown=true;
handleMouseMove(e);
document.addEventListener("mousemove",handleMouseMove,true);
},true);
document.addEventListener("mouseup",function(){
document.removeEventListener("mousemove",handleMouseMove,true);
isMouseDown=false;
mouseX=undefined;
mouseY=undefined;
},true);
functionhandleMouseMove(e){
mouseX=(e.clientX-canvasPosition.x)/30;
mouseY=(e.clientY-canvasPosition.y)/30;
};
functiongetBodyAtMouse(){
mousePVec=newb2Vec2(mouseX,mouseY);
varaabb=newb2AABB();
aabb.lowerBound.Set(mouseX-0.001,mouseY-0.001);
aabb.upperBound.Set(mouseX+0.001,mouseY+0.001);
selectedBody=null;
world.QueryAABB(getBodyCB,aabb);
returnselectedBody;
}
functiongetBodyCB(fixture){
if(fixture.GetBody().GetType()!
=b2Body.b2_staticBody){
if(fixture.GetShape().TestPoint(fixture.GetBody().GetTransform(),mousePVec)){
selectedBody=fixture.GetBody();
returnfalse;
}
}
returntrue;
}
functioncreateworld()
{
world=newb2World(newb2Vec2(0,10),true)
};
functioncreatebuttom()
{
varbodyDef=newb2BodyDef;
bodyDef.type=b2Body.b2_staticBody;
bodyDef.userData="thebuttom";
bodyDef.position=newb2Vec2(0,0);
varbuttom=world.CreateBody(bodyDef);
varfixDef=newb2FixtureDef;
fixDef.density=1.0;
fixDef.friction=0.5;
fixDef.restitution=0.2;
varpd=newb2PolygonShape;
pd.SetAsEdge(newb2Vec2(11.07,18.7),newb2Vec2(8.93,18.7));
fixDef.shape=pd;
buttom.CreateFixture(fixDef);
}
functioncreateground()
{
varbodyDef=newb2BodyDef;
bodyDef.type=b2Body.b2_staticBody;
bodyDef.userData='ground';
bodyDef.position=newb2Vec2(0,0);
ground=world.CreateBody(bodyDef);
varfixDef=newb2FixtureDef;
fixDef.density=1.0;
fixDef.friction=0.5;
fixDef.restitution=0.2;
varpd=newb2PolygonShape;
pd.SetAsEdge(newb2Vec2(5,0),newb2Vec2(15,0));
fixDef.shape=pd;
ground.CreateFixture(fixDef);
pd.SetAsEdge(newb2Vec2(15,0),newb2Vec2(15,14));
fixDef.shape=pd;
ground.CreateFixture(fixDef);
pd.SetAsEdge(newb2Vec2(15,14),newb2Vec2(10,20));
fixDef.shape=pd;
ground.CreateFixture(fixDef);
pd.SetAsEdge(newb2Vec2(10,20),newb2Vec2(5,14));
fixDef.shape=pd;
ground.CreateFixture(fixDef);
pd.SetAsEdge(newb2Vec2(5,14),newb2Vec2(5,0));
fixDef.shape=pd;
ground.CreateFixture(fixDef);
};
functioncreateenemy()
{
varbodyDef=newb2BodyDef;
bodyDef.type=b2Body.b2_staticBody;
bodyDef.userData="enemy1";
varfixDef=newb2FixtureDef;
fixDef.density=1;
fixDef.friction=0.5;
fixDef.restitution=0.1;
fixDef.shape=newb2CircleShape
(2);
bodyDef.position.x=1.0*10;
bodyDef.position.y=0.7*10;
enemy=world.CreateBody(bodyDef)
enemy.CreateFixture(fixDef);
}
functioncreatesmallEnemy()
{
varbodyDef=newb2BodyDef;
bodyDef.type=b2Body.b2_staticBody;
bodyDef.position.Set(5,1);
bodyDef.userData="smallenemy1";
varfixDef=newb2FixtureDef;
fixDef.density=1;
fixDef.friction=0.5;
fixDef.restitution=0.1;
fixDef.shape=newb2CircleShape(0.5);
for(ci=0;ci<8;ci++)
{
for(cj=0;cj<4;cj++)
{
bodyDef.position.x=5+0.625+(ci)*1.25;
bodyDef.position.y=2.5+2.5*cj;
enemy=world.CreateBody(bodyDef)
enemy.CreateFixture(fixDef);
}
}
}
functioncreatecircle()
{
varbodyDef=newb2BodyDef;
bodyDef.userData='ourbird';
bodyDef.type=b2Body.b2_dynamicBody;
bodyDef.bullet=true;
bodyDef.position.Set(5,1);
varfixDef=newb2FixtureDef;
fixDef.density=1;
fixDef.friction=0;
fixDef.restitution=0.5;
fixDef.shape=newb2CircleShape(0.3);
bodyDef.position.x=1.2*10;
bodyDef.position.y=1.4*10;
ourbird=world.CreateBody(bodyDef)
ourbird.CreateFixture(fixDef);
};
functioncreateFlipper()
{
varp1=newb2Vec2(11.6,16.4);
varp2=newb2Vec2(8.4,16.4);
varbodyDef=newb2BodyDef;
bodyDef.userData='leftflipper';
bodyDef.type=b2Body.b2_dynamicBody;
bodyDef.position=p2;
leftFlipper=world.CreateBody(bodyDef);
bodyDef.userData='rihtflipper';
bodyDef.position=p1;
rightFlipper=world.CreateBody(bodyDef);
varpd=newb2PolygonShape;
pd.SetAsBox(1.3,0.08);
varfixDef=newb2FixtureDef;
fixDef.density=10.0;
fixDef.shape=pd;
leftFlipper.CreateFixture(fixDef);
rightFlipper.CreateFixture(fixDef);
varjd=newb2RevoluteJointDef();
jd.bodyA=ground;
jd.localAnchorB.SetZero();
jd.enableMotor=true;
jd.maxMotorTorque=1000;
jd.enableLimit=true;
jd.motorSpeed=0;
jd.Initialize(ground,rightFlipper,newb2Vec2(13,16.4));
jd.lowerAngle=-30.0*Math.PI/180.0;
jd.upperAngle=15.0*Math.PI/180.0;
rightjoint=world.CreateJoint(jd);
jd.motorSpeed=0.0;
jd.Initialize(ground,leftFlipper,newb2Vec2(7,16.4));
jd.lowerAngle=-15.0*Math.PI/180.0;
jd.upperAngle=30.0*Math.PI/180.0;
leftjoint=world.CreateJoint(jd);
};
varlistener=newBox2D.Dynamics.b2ContactListener;
listener.EndContact=function(contact)
{
if((contact.GetFixtureA().GetBody().GetUserData()=='ourbird')&&(contact.GetFixtureB().GetBody().GetUserData()=='enemy1')){
if(getValue(contact.GetFixtureA().GetBody().GetLinearVelocity())>5)
life=life-1;
}
if((contact.GetFixtureA().GetBody().GetUserData()=='ourbird')&&(contact.GetFixtureB().GetBody().GetUserData()=='smallenemy1')){
{
contact.GetFixtureB().GetBody().SetUserData("dead");
}
}
if((contact.GetFixtureA().GetBody().GetUserData()=='thebuttom')&&(contact.GetFixtureB().GetBody().GetUserData()=='ourbird'))
{
herolife=herolife-1;}
}
functiongetValue(value)//求一个向量的模
{
vara=value.x*value.x;
varb=value.y*value.y;
varc=Math.sqrt(a+b);
returnc;
}
functionkeydown(e)
{
vare=e||event;
varcurrKey=e.keyCode||e.which||e.charCode;
if((currKey==90))
{
leftjoint.SetMotorSpeed(-40.0);
}
if((currKey==77))
{
rightjoint.SetMotorSpeed(40.0);
}
}
functionDestorybody()
{
for(b=world.GetBodyList();b;b=b.GetNext())
{
if(b.GetUserData()=='smallenemy1')
{
world.DestroyBody(b);
}
if(b.GetUserData()=='enemy1')
{
world.DestroyBody(b);
}
}
}
functionkeyup(e)
{
vare=e||event;
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- Html 实验 报告