基于jquery的地址栏射击游戏代码


Posted in Javascript onMarch 10, 2011

演示地址:http://demo.3water.com/js/2011/hunt/index.htm

玩法向下看
请看地址栏上的字母 O! 你使用O来向 a射击。 使用键盘上的 左箭头 和 右箭头 移动字母O. 当O移动到 a 上时,按 空格键射击! 游戏会定时30秒时间,按ESC键重新开始。
注:请使用系统自带的IE浏览器来打开本链接。

基于jquery的地址栏射击游戏代码

你使用O来向 a射击。 使用键盘上的 左箭头 和 右箭头 移动字母O. 当O移动到 a 上时,按 空格键射击! 
基于jquery的地址栏射击游戏代码
核心代码:
(function() { 
var Animal, Game; 
var __bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; }; 
Game = (function() { 
function Game() { 
this.eventReceived = __bind(this.eventReceived, this);; 
this.update = __bind(this.update, this);; this.level = 1; 
this.levelSize = 60; 
this.playerLocation = this.levelSize / 2; 
this.start(); 
} 
Game.prototype.start = function() { 
var num; 
this.points = 0; 
this.startTime = new Date; 
this.timeLimit = 30; 
this.animals = []; 
for (num = 4; num >= 1; num--) { 
this.addAnimal(); 
} 
return this.interval = setInterval(this.update, 1000 / 30); 
}; 
Game.prototype.gameOver = function() { 
clearInterval(this.interval); 
return location.hash = "在" + (this.elapsedTime()) + "秒中你共射中了" + this.points + "个a! (按ESC键重新开始)"; 
}; 
Game.prototype.elapsedTime = function() { 
return Math.floor(((new Date).getTime() - this.startTime.getTime()) / 1000); 
}; 
Game.prototype.addAnimal = function() { 
var animal; 
animal = new Animal(Math.floor(Math.random() * this.levelSize)); 
return this.animals.push(animal); 
}; 
Game.prototype.removeAnimal = function(deadAnimal) { 
var animal; 
return this.animals = (function() { 
var _i, _len, _ref, _results; 
_ref = this.animals; 
_results = []; 
for (_i = 0, _len = _ref.length; _i < _len; _i++) { 
animal = _ref[_i]; 
if (animal !== deadAnimal) { 
_results.push(animal); 
} 
} 
return _results; 
}).call(this); 
}; 
Game.prototype.isAnimalAt = function(position) { 
var animal, matches; 
matches = (function() { 
var _i, _len, _ref, _results; 
_ref = this.animals; 
_results = []; 
for (_i = 0, _len = _ref.length; _i < _len; _i++) { 
animal = _ref[_i]; 
if (Math.floor(animal.position) === position) { 
_results.push(animal); 
} 
} 
return _results; 
}).call(this); 
return matches[0]; 
}; 
Game.prototype.update = function() { 
var animal, position, timeLeft, url, _i, _len, _ref; 
url = []; 
_ref = this.animals; 
for (_i = 0, _len = _ref.length; _i < _len; _i++) { 
animal = _ref[_i]; 
animal.update(this.levelSize); 
} 
while (url.length < this.levelSize) { 
position = url.length; 
if (position === this.playerLocation) { 
if (this.isAnimalAt(this.playerLocation)) { 
url.push("@"); 
} else { 
url.push("O"); 
} 
} else if (this.isAnimalAt(position)) { 
url.push("a"); 
} else { 
url.push("-"); 
} 
} 
timeLeft = this.timeLimit - this.elapsedTime(); 
if (timeLeft <= 0) { 
return this.gameOver(); 
} else { 
if (timeLeft < 10) { 
timeLeft = "0" + timeLeft; 
} 
location.hash = (" " + timeLeft + "|") + url.join("") + ("|" + timeLeft); 
return document.title = "Points " + this.points; 
} 
}; 
Game.prototype.eventReceived = function(event) { 
var animal; 
switch (event.which) { 
case 37: 
this.playerLocation -= 1; 
if (this.playerLocation < 0) { 
return this.playerLocation = this.levelSize - 1; 
} 
break; 
case 39: 
this.playerLocation += 1; 
return this.playerLocation %= this.levelSize; 
case 38: 
case 32: 
animal = this.isAnimalAt(this.playerLocation); 
if (animal) { 
this.points += 1; 
this.removeAnimal(animal); 
console.log(this.animals.length); 
if (this.animals.length === 0) { 
return this.gameOver(); 
} 
} 
break; 
case 27: 
return this.start(); 
} 
}; 
return Game; 
})(); 
Animal = (function() { 
function Animal(position) { 
this.position = position; 
this.velocityChange = Math.random() * 0.5; 
this.velocityIndex = Math.random() * Math.PI; 
this.dampener = 0.4; 
} 
Animal.prototype.update = function(levelSize) { 
this.velocityIndex += Math.random() * this.velocityChange; 
this.position += Math.sin(this.velocityIndex) * this.dampener; 
this.position %= levelSize; 
if (this.position < 0) { 
return this.position += levelSize; 
} 
}; 
return Animal; 
})(); 
$(function() { 
var game; 
game = new Game(); 
return $(document).keydown(game.eventReceived); 
}); 
}).call(this);
Javascript 相关文章推荐
JQuery优缺点分析说明
Apr 10 Javascript
jQuery 源码分析笔记(3) Deferred机制
Jun 19 Javascript
javascript从右边截取指定字符串的三种实现方法
Nov 29 Javascript
JavaScript插件化开发教程(五)
Feb 01 Javascript
js用拖动滑块来控制图片大小的方法
Feb 27 Javascript
javascript学习小结之prototype
Dec 03 Javascript
jQuery插件FusionCharts实现的Marimekko图效果示例【附demo源码】
Mar 24 jQuery
基于vue的短信验证码倒计时demo
Sep 13 Javascript
layer弹出的iframe层在执行完毕后关闭当前弹出层的方法
Aug 17 Javascript
Vue 全家桶实现移动端酷狗音乐功能
Nov 16 Javascript
js实现盒子滚动动画效果
Aug 09 Javascript
element tree树形组件回显数据问题解决
Aug 14 Javascript
基于jquery的无缝循环新闻列表插件
Mar 07 #Javascript
JavaScript对象之间的转换 jQuery对象和原声DOM
Mar 07 #Javascript
jQuery总体架构的理解分析
Mar 07 #Javascript
关于捕获用户何时点击window.onbeforeunload的取消事件
Mar 06 #Javascript
js中将具有数字属性名的对象转换为数组
Mar 06 #Javascript
js 优化次数过多的循环 考虑到性能问题
Mar 05 #Javascript
淘宝搜索框效果实现分析
Mar 05 #Javascript
You might like
PHP的中问验证码
2006/11/25 PHP
php下获取客户端ip地址的函数
2010/03/15 PHP
PHP中Date()时间日期函数的使用方法小结
2011/04/20 PHP
PHP定时执行任务实现方法详解(Timer)
2015/07/30 PHP
PHPCrawl爬虫库实现抓取酷狗歌单的方法示例
2017/12/21 PHP
javascript SpiderMonkey中的函数序列化如何进行
2012/12/05 Javascript
javascript+xml实现简单图片轮换(只支持IE)
2012/12/23 Javascript
js对象转json数组的简单实现案例
2014/02/28 Javascript
node.js中的fs.chown方法使用说明
2014/12/16 Javascript
javascript面向对象之共享成员属性与方法及prototype关键字用法
2015/01/13 Javascript
JavaScript从数组中删除指定值元素的方法
2015/03/18 Javascript
window.onerror()的用法与实例分析
2016/01/27 Javascript
所见即所得的富文本编辑器bootstrap-wysiwyg使用方法详解
2016/05/27 Javascript
分享javascript实现的冒泡排序代码并优化
2016/06/05 Javascript
jQuery中页面返回顶部的方法总结
2016/12/30 Javascript
js replace()去除代码中空格的实例
2017/02/14 Javascript
JavaScript关联数组用法分析【概念、定义、遍历】
2017/03/15 Javascript
使用node.js搭建服务器
2017/05/20 Javascript
JavaScript学习总结之正则的元字符和一些简单的应用
2017/06/30 Javascript
vue mixins组件复用的几种方式(小结)
2017/09/06 Javascript
ztree实现左边动态生成树右边为内容详情功能
2017/11/03 Javascript
JS写XSS cookie stealer来窃取密码的步骤详解
2017/11/20 Javascript
浅谈mvvm-simple双向绑定简单实现
2018/04/18 Javascript
Js 利用正则表达式和replace函数获取string中所有被匹配到的文本(推荐)
2018/10/28 Javascript
解决vue项目F5刷新mounted里的函数不执行问题
2019/11/05 Javascript
详解如何修改 node_modules 里的文件
2020/05/22 Javascript
python使用BeautifulSoup分页网页中超链接的方法
2015/04/04 Python
Python 通过URL打开图片实例详解
2017/06/01 Python
浅析Python3爬虫登录模拟
2018/02/07 Python
Python实现利用163邮箱远程关电脑脚本
2018/02/22 Python
浅谈Python Opencv中gamma变换的使用详解
2018/04/02 Python
解决python 上传图片限制格式问题
2019/10/30 Python
详解Python GUI编程之PyQt5入门到实战
2020/12/10 Python
个人自我评价和职业目标
2014/01/24 职场文书
思想品德自我评价
2014/02/04 职场文书
实习班主任自我评价
2015/03/11 职场文书