mirror of
https://github.com/logsol/chuck.js.git
synced 2026-05-11 10:37:34 +00:00
adapted fps meter
This commit is contained in:
parent
550d14fbef
commit
d7025ffd67
1 changed files with 149 additions and 5 deletions
154
app/Lib/Vendor/Stats.js
vendored
154
app/Lib/Vendor/Stats.js
vendored
|
|
@ -1,9 +1,153 @@
|
||||||
define(function() {
|
define(function() {
|
||||||
var Stats=function(){var l=Date.now(),m=l,g=0,n=Infinity,o=0,h=0,p=Infinity,q=0,r=0,s=0,f=document.createElement("div");f.id="stats";f.addEventListener("mousedown",function(b){b.preventDefault();t(++s%2)},!1);f.style.cssText="width:80px;opacity:0.9;cursor:pointer";var a=document.createElement("div");a.id="fps";a.style.cssText="padding:0 0 3px 3px;text-align:left;background-color:#002";f.appendChild(a);var i=document.createElement("div");i.id="fpsText";i.style.cssText="color:#0ff;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px";
|
/**
|
||||||
i.innerHTML="FPS";a.appendChild(i);var c=document.createElement("div");c.id="fpsGraph";c.style.cssText="position:relative;width:74px;height:30px;background-color:#0ff";for(a.appendChild(c);74>c.children.length;){var j=document.createElement("span");j.style.cssText="width:1px;height:30px;float:left;background-color:#113";c.appendChild(j)}var d=document.createElement("div");d.id="ms";d.style.cssText="padding:0 0 3px 3px;text-align:left;background-color:#020;display:none";f.appendChild(d);var k=document.createElement("div");
|
* @author mrdoob / http://mrdoob.com/
|
||||||
k.id="msText";k.style.cssText="color:#0f0;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px";k.innerHTML="MS";d.appendChild(k);var e=document.createElement("div");e.id="msGraph";e.style.cssText="position:relative;width:74px;height:30px;background-color:#0f0";for(d.appendChild(e);74>e.children.length;)j=document.createElement("span"),j.style.cssText="width:1px;height:30px;float:left;background-color:#131",e.appendChild(j);var t=function(b){s=b;switch(s){case 0:a.style.display=
|
*/
|
||||||
"block";d.style.display="none";break;case 1:a.style.display="none",d.style.display="block"}};return{REVISION:11,domElement:f,setMode:t,begin:function(){l=Date.now()},end:function(){var b=Date.now();g=b-l;n=Math.min(n,g);o=Math.max(o,g);k.textContent=g+" MS ("+n+"-"+o+")";var a=Math.min(30,30-30*(g/200));e.appendChild(e.firstChild).style.height=a+"px";r++;b>m+1E3&&(h=Math.round(1E3*r/(b-m)),p=Math.min(p,h),q=Math.max(q,h),i.textContent=h+" FPS ("+p+"-"+q+")",a=Math.min(30,30-30*(h/100)),c.appendChild(c.firstChild).style.height=
|
|
||||||
a+"px",m=b,r=0);return b},update:function(){l=this.end()}}};
|
var Stats = function () {
|
||||||
|
|
||||||
|
var startTime = Date.now(), prevTime = startTime;
|
||||||
|
var ms = 0, msMin = Infinity, msMax = 0;
|
||||||
|
var fps = 0, fpsMin = Infinity, fpsMax = 0;
|
||||||
|
var frames = 0, mode = 0;
|
||||||
|
|
||||||
|
var container = document.createElement( 'div' );
|
||||||
|
container.id = 'stats';
|
||||||
|
container.addEventListener( 'mousedown', function ( event ) { event.preventDefault(); setMode( ++ mode % 2 ) }, false );
|
||||||
|
container.style.cssText = 'width:80px;opacity:0.9;cursor:pointer';
|
||||||
|
|
||||||
|
var fpsDiv = document.createElement( 'div' );
|
||||||
|
fpsDiv.id = 'fps';
|
||||||
|
fpsDiv.style.cssText = 'padding:0 0 3px 3px;text-align:left;background-color:#002';
|
||||||
|
container.appendChild( fpsDiv );
|
||||||
|
|
||||||
|
var fpsText = document.createElement( 'div' );
|
||||||
|
fpsText.id = 'fpsText';
|
||||||
|
fpsText.style.cssText = 'color:#0ff;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px';
|
||||||
|
fpsText.innerHTML = 'FPS';
|
||||||
|
fpsDiv.appendChild( fpsText );
|
||||||
|
|
||||||
|
var fpsGraph = document.createElement( 'div' );
|
||||||
|
fpsGraph.id = 'fpsGraph';
|
||||||
|
fpsGraph.style.cssText = 'position:relative;width:74px;height:20px;background-color:#0ff';
|
||||||
|
fpsDiv.appendChild( fpsGraph );
|
||||||
|
|
||||||
|
while ( fpsGraph.children.length < 74 ) {
|
||||||
|
|
||||||
|
var bar = document.createElement( 'span' );
|
||||||
|
bar.style.cssText = 'width:1px;height:20px;float:left;background-color:#113';
|
||||||
|
fpsGraph.appendChild( bar );
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
var msDiv = document.createElement( 'div' );
|
||||||
|
msDiv.id = 'ms';
|
||||||
|
msDiv.style.cssText = 'padding:0 0 3px 3px;text-align:left;background-color:#020;display:none';
|
||||||
|
container.appendChild( msDiv );
|
||||||
|
|
||||||
|
var msText = document.createElement( 'div' );
|
||||||
|
msText.id = 'msText';
|
||||||
|
msText.style.cssText = 'color:#0f0;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px';
|
||||||
|
msText.innerHTML = 'MS';
|
||||||
|
msDiv.appendChild( msText );
|
||||||
|
|
||||||
|
var msGraph = document.createElement( 'div' );
|
||||||
|
msGraph.id = 'msGraph';
|
||||||
|
msGraph.style.cssText = 'position:relative;width:74px;height:30px;background-color:#0f0';
|
||||||
|
msDiv.appendChild( msGraph );
|
||||||
|
|
||||||
|
while ( msGraph.children.length < 74 ) {
|
||||||
|
|
||||||
|
var bar = document.createElement( 'span' );
|
||||||
|
bar.style.cssText = 'width:1px;height:30px;float:left;background-color:#131';
|
||||||
|
msGraph.appendChild( bar );
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
var setMode = function ( value ) {
|
||||||
|
|
||||||
|
mode = value;
|
||||||
|
|
||||||
|
switch ( mode ) {
|
||||||
|
|
||||||
|
case 0:
|
||||||
|
fpsDiv.style.display = 'block';
|
||||||
|
msDiv.style.display = 'none';
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
fpsDiv.style.display = 'none';
|
||||||
|
msDiv.style.display = 'block';
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
var updateGraph = function ( dom, value ) {
|
||||||
|
|
||||||
|
var child = dom.appendChild( dom.firstChild );
|
||||||
|
child.style.height = value + 'px';
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
return {
|
||||||
|
|
||||||
|
REVISION: 12,
|
||||||
|
|
||||||
|
domElement: container,
|
||||||
|
|
||||||
|
setMode: setMode,
|
||||||
|
|
||||||
|
begin: function () {
|
||||||
|
|
||||||
|
startTime = Date.now();
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
end: function () {
|
||||||
|
|
||||||
|
var time = Date.now();
|
||||||
|
|
||||||
|
ms = time - startTime;
|
||||||
|
msMin = Math.min( msMin, ms );
|
||||||
|
msMax = Math.max( msMax, ms );
|
||||||
|
|
||||||
|
msText.textContent = ms + ' MS (' + msMin + '-' + msMax + ')';
|
||||||
|
updateGraph( msGraph, Math.min( 30, 30 - ( ms / 200 ) * 30 ) );
|
||||||
|
|
||||||
|
frames ++;
|
||||||
|
|
||||||
|
if ( time > prevTime + 1000 ) {
|
||||||
|
|
||||||
|
fps = Math.round( ( frames * 1000 ) / ( time - prevTime ) );
|
||||||
|
fpsMin = Math.min( fpsMin, fps );
|
||||||
|
fpsMax = Math.max( fpsMax, fps );
|
||||||
|
|
||||||
|
fpsText.textContent = fps + ' FPS (' + fpsMin + '-' + fpsMax + ')';
|
||||||
|
updateGraph( fpsGraph, Math.min( 30, 30 - ( fps / 100 ) * 30 ) );
|
||||||
|
|
||||||
|
prevTime = time;
|
||||||
|
frames = 0;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
return time;
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
update: function () {
|
||||||
|
|
||||||
|
startTime = this.end();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
if ( typeof module === 'object' ) {
|
||||||
|
|
||||||
|
module.exports = Stats;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
return Stats;
|
return Stats;
|
||||||
});
|
});
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue