Update HTML5-Space-Invaders.html
Fix problems arising from the new webkit implementation of window.performace.now (high resolution timer draft).
This commit is contained in:
parent
48ed66ef23
commit
573652505f
|
@ -318,17 +318,32 @@
|
||||||
return el.querySelector(selector);
|
return el.querySelector(selector);
|
||||||
};
|
};
|
||||||
|
|
||||||
// crossbrowser implementation for requestAnimationFrame
|
|
||||||
var requestAnimation = (function() {
|
(function() {
|
||||||
return window.requestAnimationFrame
|
var lastTime = 0;
|
||||||
|| window.webkitRequestAnimationFrame
|
var vendors = ['ms', 'moz', 'webkit', 'o'];
|
||||||
|| window.mozRequestAnimationFrame
|
for(var x = 0; x < vendors.length && !window.requestAnimationFrameFrame; ++x) {
|
||||||
|| window.oRequestAnimationFrame
|
window.requestAnimationFrameFrame = window[vendors[x]+'requestAnimationFrameFrame'];
|
||||||
|| window.msRequestAnimationFrame
|
window.cancelAnimationFrame =
|
||||||
|| function(callback, element) {
|
window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelrequestAnimationFrameFrame'];
|
||||||
window.setTimeout(callback, 1000/60);
|
}
|
||||||
|
|
||||||
|
if (!window.requestAnimationFrameFrame)
|
||||||
|
window.requestAnimationFrameFrame = function(callback, element) {
|
||||||
|
var currTime = new Date().getTime();
|
||||||
|
var timeToCall = Math.max(0, 16 - (currTime - lastTime));
|
||||||
|
var id = window.setTimeout(function() { callback(currTime + timeToCall); },
|
||||||
|
timeToCall);
|
||||||
|
lastTime = currTime + timeToCall;
|
||||||
|
return id;
|
||||||
};
|
};
|
||||||
})();
|
|
||||||
|
if (!window.cancelAnimationFrame)
|
||||||
|
window.cancelAnimationFrame = function(id) {
|
||||||
|
clearTimeout(id);
|
||||||
|
};
|
||||||
|
}());
|
||||||
|
|
||||||
|
|
||||||
//!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
|
//!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
|
||||||
// game objects
|
// game objects
|
||||||
|
@ -1308,8 +1323,9 @@
|
||||||
|
|
||||||
// animation loop
|
// animation loop
|
||||||
var gameWrapper = $("#game");
|
var gameWrapper = $("#game");
|
||||||
var startTime = window.mozAnimationStartTime || +new Date;
|
var startTime = window.performance.now() || window.mozAnimationStartTime || +new Date;
|
||||||
requestAnimation(loop, gameWrapper);
|
|
||||||
|
requestAnimationFrame(loop, gameWrapper);
|
||||||
function loop(timestamp) {
|
function loop(timestamp) {
|
||||||
// time since last draw
|
// time since last draw
|
||||||
var drawStart = (timestamp || +new Date);
|
var drawStart = (timestamp || +new Date);
|
||||||
|
@ -1325,7 +1341,7 @@
|
||||||
startTime = drawStart;
|
startTime = drawStart;
|
||||||
}
|
}
|
||||||
|
|
||||||
requestAnimation(loop, gameWrapper);
|
requestAnimationFrame(loop, gameWrapper);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1447,9 +1463,11 @@
|
||||||
|
|
||||||
// animation loop
|
// animation loop
|
||||||
var gameWrapper = $("#game");
|
var gameWrapper = $("#game");
|
||||||
var startTime = window.mozAnimationStartTime || +new Date;
|
debugger;
|
||||||
requestAnimation(loop, gameWrapper);
|
var startTime = window.performance.now() || window.mozAnimationStartTime || +new Date;
|
||||||
|
requestAnimationFrame(loop, gameWrapper);
|
||||||
function loop(timestamp) {
|
function loop(timestamp) {
|
||||||
|
|
||||||
// time since last draw
|
// time since last draw
|
||||||
var drawStart = (timestamp || +new Date);
|
var drawStart = (timestamp || +new Date);
|
||||||
var diff = drawStart - startTime;
|
var diff = drawStart - startTime;
|
||||||
|
@ -1467,7 +1485,7 @@
|
||||||
startTime = drawStart;
|
startTime = drawStart;
|
||||||
}
|
}
|
||||||
|
|
||||||
requestAnimation(loop, gameWrapper);
|
requestAnimationFrame(loop, gameWrapper);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue