From 9d23c79f7d09e69e895ba9d08d968156d13a54fd Mon Sep 17 00:00:00 2001 From: Michael Herzog Date: Thu, 30 May 2019 21:21:43 +0200 Subject: [PATCH] Added ES6 module support. (#98) --- build/stats.js | 2 +- build/stats.min.js | 2 +- build/stats.module.js | 171 ++++++++++++++++++++++++++++++++++++++++++ package-lock.json | 38 ++++++++++ package.json | 1 + rollup.config.js | 14 +++- 6 files changed, 223 insertions(+), 5 deletions(-) create mode 100644 build/stats.module.js create mode 100644 package-lock.json diff --git a/build/stats.js b/build/stats.js index 9a6ab14..4875f72 100644 --- a/build/stats.js +++ b/build/stats.js @@ -80,7 +80,7 @@ var Stats = function () { msPanel.update( time - beginTime, 200 ); - if ( time > prevTime + 1000 ) { + if ( time >= prevTime + 1000 ) { fpsPanel.update( ( frames * 1000 ) / ( time - prevTime ), 100 ); diff --git a/build/stats.min.js b/build/stats.min.js index 61757f3..3ddf1e5 100644 --- a/build/stats.min.js +++ b/build/stats.min.js @@ -1,5 +1,5 @@ // stats.js - http://github.com/mrdoob/stats.js (function(f,e){"object"===typeof exports&&"undefined"!==typeof module?module.exports=e():"function"===typeof define&&define.amd?define(e):f.Stats=e()})(this,function(){var f=function(){function e(a){c.appendChild(a.dom);return a}function u(a){for(var d=0;dg+1E3&&(r.update(1E3*a/(c-g),100),g=c,a=0,t)){var d=performance.memory;t.update(d.usedJSHeapSize/ +u(++l%c.children.length)},!1);var k=(performance||Date).now(),g=k,a=0,r=e(new f.Panel("FPS","#0ff","#002")),h=e(new f.Panel("MS","#0f0","#020"));if(self.performance&&self.performance.memory)var t=e(new f.Panel("MB","#f08","#201"));u(0);return{REVISION:16,dom:c,addPanel:e,showPanel:u,begin:function(){k=(performance||Date).now()},end:function(){a++;var c=(performance||Date).now();h.update(c-k,200);if(c>=g+1E3&&(r.update(1E3*a/(c-g),100),g=c,a=0,t)){var d=performance.memory;t.update(d.usedJSHeapSize/ 1048576,d.jsHeapSizeLimit/1048576)}return c},update:function(){k=this.end()},domElement:c,setMode:u}};f.Panel=function(e,f,l){var c=Infinity,k=0,g=Math.round,a=g(window.devicePixelRatio||1),r=80*a,h=48*a,t=3*a,v=2*a,d=3*a,m=15*a,n=74*a,p=30*a,q=document.createElement("canvas");q.width=r;q.height=h;q.style.cssText="width:80px;height:48px";var b=q.getContext("2d");b.font="bold "+9*a+"px Helvetica,Arial,sans-serif";b.textBaseline="top";b.fillStyle=l;b.fillRect(0,0,r,h);b.fillStyle=f;b.fillText(e,t,v); b.fillRect(d,m,n,p);b.fillStyle=l;b.globalAlpha=.9;b.fillRect(d,m,n,p);return{dom:q,update:function(h,w){c=Math.min(c,h);k=Math.max(k,h);b.fillStyle=l;b.globalAlpha=1;b.fillRect(0,0,r,m);b.fillStyle=f;b.fillText(g(h)+" "+e+" ("+g(c)+"-"+g(k)+")",t,v);b.drawImage(q,d+a,m,n-a,p,d,m,n-a,p);b.fillRect(d+n-a,m,a,p);b.fillStyle=l;b.globalAlpha=.9;b.fillRect(d+n-a,m,a,g((1-h/w)*p))}}};return f}); diff --git a/build/stats.module.js b/build/stats.module.js new file mode 100644 index 0000000..8a3edfd --- /dev/null +++ b/build/stats.module.js @@ -0,0 +1,171 @@ +/** + * @author mrdoob / http://mrdoob.com/ + */ + +var Stats = function () { + + var mode = 0; + + var container = document.createElement( 'div' ); + container.style.cssText = 'position:fixed;top:0;left:0;cursor:pointer;opacity:0.9;z-index:10000'; + container.addEventListener( 'click', function ( event ) { + + event.preventDefault(); + showPanel( ++ mode % container.children.length ); + + }, false ); + + // + + function addPanel( panel ) { + + container.appendChild( panel.dom ); + return panel; + + } + + function showPanel( id ) { + + for ( var i = 0; i < container.children.length; i ++ ) { + + container.children[ i ].style.display = i === id ? 'block' : 'none'; + + } + + mode = id; + + } + + // + + var beginTime = ( performance || Date ).now(), prevTime = beginTime, frames = 0; + + var fpsPanel = addPanel( new Stats.Panel( 'FPS', '#0ff', '#002' ) ); + var msPanel = addPanel( new Stats.Panel( 'MS', '#0f0', '#020' ) ); + + if ( self.performance && self.performance.memory ) { + + var memPanel = addPanel( new Stats.Panel( 'MB', '#f08', '#201' ) ); + + } + + showPanel( 0 ); + + return { + + REVISION: 16, + + dom: container, + + addPanel: addPanel, + showPanel: showPanel, + + begin: function () { + + beginTime = ( performance || Date ).now(); + + }, + + end: function () { + + frames ++; + + var time = ( performance || Date ).now(); + + msPanel.update( time - beginTime, 200 ); + + if ( time >= prevTime + 1000 ) { + + fpsPanel.update( ( frames * 1000 ) / ( time - prevTime ), 100 ); + + prevTime = time; + frames = 0; + + if ( memPanel ) { + + var memory = performance.memory; + memPanel.update( memory.usedJSHeapSize / 1048576, memory.jsHeapSizeLimit / 1048576 ); + + } + + } + + return time; + + }, + + update: function () { + + beginTime = this.end(); + + }, + + // Backwards Compatibility + + domElement: container, + setMode: showPanel + + }; + +}; + +Stats.Panel = function ( name, fg, bg ) { + + var min = Infinity, max = 0, round = Math.round; + var PR = round( window.devicePixelRatio || 1 ); + + var WIDTH = 80 * PR, HEIGHT = 48 * PR, + TEXT_X = 3 * PR, TEXT_Y = 2 * PR, + GRAPH_X = 3 * PR, GRAPH_Y = 15 * PR, + GRAPH_WIDTH = 74 * PR, GRAPH_HEIGHT = 30 * PR; + + var canvas = document.createElement( 'canvas' ); + canvas.width = WIDTH; + canvas.height = HEIGHT; + canvas.style.cssText = 'width:80px;height:48px'; + + var context = canvas.getContext( '2d' ); + context.font = 'bold ' + ( 9 * PR ) + 'px Helvetica,Arial,sans-serif'; + context.textBaseline = 'top'; + + context.fillStyle = bg; + context.fillRect( 0, 0, WIDTH, HEIGHT ); + + context.fillStyle = fg; + context.fillText( name, TEXT_X, TEXT_Y ); + context.fillRect( GRAPH_X, GRAPH_Y, GRAPH_WIDTH, GRAPH_HEIGHT ); + + context.fillStyle = bg; + context.globalAlpha = 0.9; + context.fillRect( GRAPH_X, GRAPH_Y, GRAPH_WIDTH, GRAPH_HEIGHT ); + + return { + + dom: canvas, + + update: function ( value, maxValue ) { + + min = Math.min( min, value ); + max = Math.max( max, value ); + + context.fillStyle = bg; + context.globalAlpha = 1; + context.fillRect( 0, 0, WIDTH, GRAPH_Y ); + context.fillStyle = fg; + context.fillText( round( value ) + ' ' + name + ' (' + round( min ) + '-' + round( max ) + ')', TEXT_X, TEXT_Y ); + + context.drawImage( canvas, GRAPH_X + PR, GRAPH_Y, GRAPH_WIDTH - PR, GRAPH_HEIGHT, GRAPH_X, GRAPH_Y, GRAPH_WIDTH - PR, GRAPH_HEIGHT ); + + context.fillRect( GRAPH_X + GRAPH_WIDTH - PR, GRAPH_Y, PR, GRAPH_HEIGHT ); + + context.fillStyle = bg; + context.globalAlpha = 0.9; + context.fillRect( GRAPH_X + GRAPH_WIDTH - PR, GRAPH_Y, PR, round( ( 1 - ( value / maxValue ) ) * GRAPH_HEIGHT ) ); + + } + + }; + +}; + +export default Stats; diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..44569ca --- /dev/null +++ b/package-lock.json @@ -0,0 +1,38 @@ +{ + "name": "stats.js", + "version": "0.17.0", + "lockfileVersion": 1, + "requires": true, + "dependencies": { + "rollup": { + "version": "0.36.4", + "resolved": "https://registry.npmjs.org/rollup/-/rollup-0.36.4.tgz", + "integrity": "sha1-oiRJTFOGwdc9OPe7hvafXrARo9I=", + "dev": true, + "requires": { + "source-map-support": "^0.4.0" + } + }, + "source-map": { + "version": "0.5.7", + "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", + "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=", + "dev": true + }, + "source-map-support": { + "version": "0.4.18", + "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.4.18.tgz", + "integrity": "sha512-try0/JqxPLF9nOjvSta7tVondkP5dwgyLDjVoyMDlmjugT2lRZ1OfsrYTkCd2hkDnJTKRbO/Rl3orm8vlsUzbA==", + "dev": true, + "requires": { + "source-map": "^0.5.6" + } + }, + "uglifyjs": { + "version": "2.4.11", + "resolved": "https://registry.npmjs.org/uglifyjs/-/uglifyjs-2.4.11.tgz", + "integrity": "sha1-NEDWTgRXWViVJEGOtkHGi7kNET4=", + "dev": true + } + } +} diff --git a/package.json b/package.json index 92312a1..abb967e 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,7 @@ "version": "0.17.0", "description": "JavaScript Performance Monitor", "main": "build/stats.js", + "module": "build/stats.module.js", "repository": "mrdoob/stats.js", "directories": { "example": "examples" diff --git a/rollup.config.js b/rollup.config.js index b06f31f..d8db5f8 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -1,6 +1,14 @@ export default { entry: 'src/Stats.js', - dest: 'build/stats.js', - moduleName: 'Stats', - format: 'umd' + targets: [ + { + format: 'umd', + moduleName: 'Stats', + dest: 'build/stats.js' + }, + { + format: 'es', + dest: 'build/stats.module.js' + } + ] };