docker/pacman
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updated 不再用setInterval函数做定时处理

Browse Source
This commit is contained in:
郑浩乐 2015-12-31 16:48:58 +08:00
parent 8f997ece4c
commit 3b49e790c6
1 changed files with 39 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
pacman.js
View File

@ -1,4 +1,4 @@
'use strict'; // 'use strict';
//活动对象构造 //活动对象构造
function Item(options){ function Item(options){
options = options||{}; options = options||{};
@ -28,6 +28,7 @@ function Game(id,options){
var _ = this; var _ = this;
var _settings = { var _settings = {
name:'Pac-Man', //游戏名称 name:'Pac-Man', //游戏名称
copyright:'passer-by.com', //版权信息
width:960, //画布宽度 width:960, //画布宽度
height:640, //画布高度 height:640, //画布高度
map:{ //地图信息 map:{ //地图信息
@ -49,20 +50,36 @@ function Game(id,options){
var _context = $canvas.getContext('2d'); //画布上下文环境 var _context = $canvas.getContext('2d'); //画布上下文环境
var _items = []; //动画对象队列 var _items = []; //动画对象队列
var _status = 0; //页面状态 var _status = 0; //页面状态
var _t = 0; //内部计算器,交替帧数更新动画
var _hander = null; //画布更新 var _hander = null; //画布更新
//动画开始
this.startAnimate = function(callback,frame){
frame = frame||1;
var requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame ||window.mozRequestAnimationFrame ||window.msRequestAnimationFrame;
var t = 0; //帧数计算
var fn = function(){
t++;
if(!(t%frame)){
callback(t/frame);
}
_hander = requestAnimationFrame(fn);
};
_.stopAnimate();
_hander = requestAnimationFrame(fn);
};
//动画开始
this.stopAnimate = function(){
var cancelAnimationFrame = window.cancelAnimationFrame || window.webkitCancelAnimationFrame||window.mozCancelAnimationFrame ||window.msCancelAnimationFrame;
_hander&&cancelAnimationFrame(_hander);
};
//开始画面 //开始画面
this.launch = function(){ this.launch = function(){
_hander = setInterval(function(){ _.startAnimate(function(t){
_t++;
var s = _t%4;
//清除画布 //清除画布
_context.clearRect(0,0,_settings.width,_settings.height); _context.clearRect(0,0,_settings.width,_settings.height);
//logo //logo
_context.fillStyle = '#FC3'; _context.fillStyle = '#FC3';
_context.beginPath(); _context.beginPath();
if(s<2){ if(t%2){
_context.arc(_settings.width/2,_settings.height*.45,50,.20*Math.PI,1.80*Math.PI,false); _context.arc(_settings.width/2,_settings.height*.45,50,.20*Math.PI,1.80*Math.PI,false);
_context.lineTo(_settings.width/2,_settings.height*.45); _context.lineTo(_settings.width/2,_settings.height*.45);
}else{ }else{
@ -81,22 +98,21 @@ function Game(id,options){
_context.textAlign = 'center'; _context.textAlign = 'center';
_context.textBaseline = 'middle'; _context.textBaseline = 'middle';
_context.fillStyle = '#FFF'; _context.fillStyle = '#FFF';
_context.fillText(_settings.name,_settings.width/2,_settings.height*.618); _context.fillText(_settings.name,_settings.width/2,_settings.height*.6);
},_settings.fresh); //版权信息
_context.font = '14px Helvetica';
_context.textAlign = 'right';
_context.textBaseline = 'bottom';
_context.fillStyle = '#AAA';
_context.fillText('© '+_settings.copyright,_settings.width-12,_settings.height-5);
},10);
}; };
//动画停止 this.update = function(){
this.stop = function(){ _startAnimate(function(t){
_hander&&clearInterval(_hander);
};
//动画开始
this.start = function(){
_.stop();
_hander = setInterval(function(){ //定时刷新画布
_t++;
_items.forEach(function(item,index){ _items.forEach(function(item,index){
item.update(_t); item.update(t);
}); });
},_settings.fresh); });
}; };
//添加对象 //添加对象
this.addItem = function(item){ this.addItem = function(item){
@ -110,4 +126,5 @@ function Game(id,options){
this.draw = function(){ this.draw = function(){
}; };
//事件
} }