var
gameimg = [
'images/start.png'
,
'images/start_over.png'
,
'images/go.png'
,
'images/go_over.png'
,
'images/running.gif'
,
'images/run_start1.gif'
,
'images/run_start2.gif'
,
'images/run_start3.gif'
];
var
speed_obj =
new
SpeedClass();
window.onload =
function
(){
var
callback =
function
(){
speed_obj.init();
}
img_preload(gameimg, callback);
}
function
SpeedClass(){
this.levelset = [8,5,8,12];
this.playerlist = null;
this.player = 0;
this.level = 2;
this.lock = 0;
this.isstart = 0;
this.isover = 0;
}
SpeedClass.prototype.init =
function
(){
this.reset();
this.create_player();
this.create_event();
}
SpeedClass.prototype.reset =
function
(){
this.player = 0;
this.level = $(
'level'
).value;
this.playerlist =
$_tag
(
'li'
,
'playerlist'
);
for
(
var
i=0; i<this.playerlist.length; i++){
this.playerlist[i].className =
''
;
}
disp(
'start_btn'
,
'show'
,
'start_btn'
);
disp(
'go_btn'
,
'hide'
,
'go_btn'
);
this.lock = 0;
this.isstart = 0;
this.isover = 0;
}
SpeedClass.prototype.create_player =
function
(){
var
runway = [];
var
playerlist = [];
for
(
var
i=1; i<=8; i++){
runway[i] =
'<li><div id="player'
+ (9-i) +
'" class="run_status1"></div></li>'
;
playerlist[i] =
'<li>'
+ i +
'</li>'
;
}
$(
'runway'
).innerHTML = runway.join(
''
);
$(
'playerlist'
).innerHTML = playerlist.join(
''
);
runway = null;
playerlist = null;
}
SpeedClass.prototype.create_event =
function
(){
var
self = this;
this.playerlist =
$_tag
(
'li'
,
'playerlist'
);
for
(
var
i=0; i<this.playerlist.length; i++){
this.playerlist[i].onmouseover =
function
(){
if
(this.className!=
'on'
){
this.className =
'over'
;
}
}
this.playerlist[i].onmouseout =
function
(){
if
(this.className!=
'on'
){
this.className =
''
;
}
}
this.playerlist[i].onclick =
function
(o,c){
return
function
(){
if
(self.lock==0){
o.playerlist[c].className =
'on'
;
if
(o.player!=0 && o.player!=c+1){
o.playerlist[o.player-1].className =
''
;
}
o.player = c + 1;
}
}
}(self, i);
}
$(
'start_btn'
).onmouseover =
function
(){
this.className =
'start_over_btn'
;
}
$(
'start_btn'
).onmouseout =
function
(){
this.className =
'start_btn'
;
}
$(
'start_btn'
).onclick =
function
(){
if
(self.player==0){
return
alert(
'请选择要支持的选手'
);
}
else
{
self.lock = 1;
disp(
'start_btn'
,
'hide'
);
disp(
'go_btn'
,
'show'
);
for
(
var
i=1; i<=8; i++){
self.start(i);
}
}
}
$(
'go_btn'
).onmouseover =
function
(){
this.className =
'go_over_btn'
;
}
$(
'go_btn'
).onmouseout =
function
(){
this.className =
'go_btn'
;
}
$(
'go_btn'
).onclick =
function
(){
self.go();
}
}
SpeedClass.prototype.start =
function
(c){
var
o = $(
'player'
+ c);
var
step = 1;
var
self = this;
var
exert = 0;
o.style.marginLeft =
'62px'
;
var
et = setInterval(
function
(){
if
(step<4){
o.className =
'run_status'
+ step;
}
else
{
if
(o.className!=
'running'
){
o.className =
'running'
;
}
if
(self.isstart==0){
self.isstart = 1;
}
if
(self.isover==1){
clearInterval(et);
}
else
{
if
(self.player!=c){
exert = Math.
floor
(Math.random()* self.levelset[self.level])+3;
}
o.style.marginLeft = parseInt(o.style.marginLeft) + Math.
floor
(Math.random()*8)+4 + exert +
'px'
;
if
(parseInt(o.style.marginLeft)>=745){
clearInterval(et);
self.isover = 1;
self.gameover(o.id);
}
}
}
step ++;
}, 350)
}
SpeedClass.prototype.go =
function
(){
if
(this.isstart==1 && this.isover==0){
var
o = $(
'player'
+ this.player);
var
exert = Math.
floor
(Math.random()*3)+2;
o.style.marginLeft = parseInt(o.style.marginLeft) + exert +
'px'
;
}
return
false;
}
SpeedClass.prototype.gameover =
function
(id){
id = id.replace(
'player'
,
''
);
var
self = this;
var
msg =
''
;
if
(id==this.player){
msg =
"恭喜你,你支持的选手获得胜利\n\n"
;
}
else
{
msg =
"很遗憾,你支持的选手没有获得胜利,获胜的是"
+ id + "号选
\n";
}
if
(confirm(msg +
'是否重新开始?'
)==true){
setTimeout(
function
(){
self.init();
},1000);
}
else
{
return
false;
}
}
function
$(id){
this.id = id;
return
document.getElementById(id);
}
function
$_tag
(name, id){
if
(typeof(id)!=
'undefined'
){
return
$(id).getElementsByTagName(name);
}
else
{
return
document.getElementsByTagName(name);
}
}
function
disp(id, handle, classname){
if
(handle==
'show'
){
$(id).style.display =
'block'
;
}
else
{
$(id).style.display =
'none'
;
}
if
(typeof(classname)!=
'undefined'
){
$(id).className = classname;
}
}
function
img_preload(img, callback){
var
onload_img = 0;
var
tmp_img = [];
for
(
var
i=0,imgnum=img.length; i<imgnum; i++){
tmp_img[i] =
new
Image();
tmp_img[i].src = img[i];
if
(tmp_img[i].complete){
onload_img ++;
}
else
{
tmp_img[i].onload =
function
(){
onload_img ++;
}
}
}
var
et = setInterval(
function
(){
if
(onload_img==img.length){
clearInterval(et);
callback();
}
},200);
}