@eva/plugin-stats 1.3.0-alpha.1 → 2.0.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/EVA.plugin.stats.js +210 -73
  2. package/dist/EVA.plugin.stats.min.js +1 -1
  3. package/dist/plugin-stats.cjs.js +190 -3
  4. package/dist/plugin-stats.cjs.prod.js +2 -2
  5. package/dist/plugin-stats.d.ts +5 -0
  6. package/dist/plugin-stats.esm.js +189 -2
  7. package/package.json +2 -2
package/dist/EVA.plugin.stats.js CHANGED
@@ -1,77 +1,57 @@
1
- this.EVA = this.EVA || {};
2
- this.EVA.plugin = this.EVA.plugin || {};
3
-
4
- this.EVA.plugin.stats = function (exports, eva_js) {
1
+ window.EVA = window.EVA || {};
2
+ window.EVA.plugin = window.EVA.plugin || {};
3
+ var _EVA_IIFE_stats = function (exports, eva_js) {
5
4
  'use strict';
6
-
7
- var _extendStatics = function extendStatics(d, b) {
8
- _extendStatics = Object.setPrototypeOf || {
5
+ var extendStatics = function (d, b) {
6
+ extendStatics = Object.setPrototypeOf || {
9
7
  __proto__: []
10
8
  } instanceof Array && function (d, b) {
11
9
  d.__proto__ = b;
12
10
  } || function (d, b) {
13
- for (var p in b) {
14
- if (b.hasOwnProperty(p)) d[p] = b[p];
15
- }
11
+ for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
16
12
  };
17
-
18
- return _extendStatics(d, b);
13
+ return extendStatics(d, b);
19
14
  };
20
-
21
15
  function __extends(d, b) {
22
- _extendStatics(d, b);
23
-
16
+ extendStatics(d, b);
24
17
  function __() {
25
18
  this.constructor = d;
26
19
  }
27
-
28
20
  d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
29
21
  }
30
-
31
- var _assign = function __assign() {
32
- _assign = Object.assign || function __assign(t) {
22
+ var __assign = function () {
23
+ __assign = Object.assign || function __assign(t) {
33
24
  for (var s, i = 1, n = arguments.length; i < n; i++) {
34
25
  s = arguments[i];
35
-
36
- for (var p in s) {
37
- if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
38
- }
26
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
39
27
  }
40
-
41
28
  return t;
42
29
  };
43
-
44
- return _assign.apply(this, arguments);
30
+ return __assign.apply(this, arguments);
45
31
  };
46
-
47
32
  var StatsComponent = function (_super) {
48
33
  __extends(StatsComponent, _super);
49
-
50
34
  function StatsComponent() {
51
35
  return _super !== null && _super.apply(this, arguments) || this;
52
36
  }
53
-
54
37
  StatsComponent.prototype.update = function () {
55
38
  this.stats && this.stats.begin();
56
39
  };
57
-
58
40
  StatsComponent.componentName = 'Stats';
59
41
  return StatsComponent;
60
42
  }(eva_js.Component);
61
-
62
43
  var Stats$2 = StatsComponent;
63
-
64
- var Stats = function Stats(style) {
65
- style = _assign({
44
+ var Stats = function (style) {
45
+ style = __assign({
66
46
  width: 20,
67
47
  height: 12,
68
48
  x: 0,
69
49
  y: 0
70
50
  }, style);
71
51
  var width = style.width,
72
- height = style.height,
73
- x = style.x,
74
- y = style.y;
52
+ height = style.height,
53
+ x = style.x,
54
+ y = style.y;
75
55
  var mode = 0;
76
56
  var container = document.createElement('div');
77
57
  container.style.cssText = "position:fixed;top:0;left:0;cursor:pointer;opacity:0.9;z-index:10000;width: " + width + "vw;height: " + height + "vw;left: " + x + "vw;top: " + y + "vw;";
@@ -79,79 +59,75 @@ this.EVA.plugin.stats = function (exports, eva_js) {
79
59
  event.preventDefault();
80
60
  showPanel(++mode % container.children.length);
81
61
  }, false);
82
-
83
62
  function addPanel(panel) {
84
63
  container.appendChild(panel.dom);
85
64
  return panel;
86
65
  }
87
-
88
66
  function showPanel(id) {
89
67
  for (var i = 0; i < container.children.length; i++) {
90
68
  container.children[i].style.display = i === id ? 'block' : 'none';
91
69
  }
92
-
93
70
  mode = id;
94
71
  }
95
-
96
72
  var beginTime = (performance || Date).now(),
97
- prevTime = beginTime,
98
- frames = 0;
73
+ prevTime = beginTime,
74
+ frames = 0;
99
75
  var fpsPanel = addPanel(Stats.Panel('FPS', '#0ff', '#002'));
100
76
  var msPanel = addPanel(Stats.Panel('MS', '#0f0', '#020'));
77
+ var dcPanel = addPanel(Stats.Panel('DrawCall', '#330570', '#A69700'));
78
+ var tcPanel = addPanel(Stats.Panel('TC:', '#A62500', '#00B454'));
101
79
  var memPanel;
102
-
103
80
  if (self.performance && self.performance.memory) {
104
81
  memPanel = addPanel(Stats.Panel('MB', '#f08', '#201'));
105
82
  }
106
-
107
83
  showPanel(0);
108
84
  return {
109
85
  REVISION: 16,
110
86
  dom: container,
111
87
  addPanel: addPanel,
112
88
  showPanel: showPanel,
113
- begin: function begin(time) {
89
+ begin: function (time) {
114
90
  beginTime = time || (performance || Date).now();
115
91
  },
116
- end: function end() {
92
+ end: function (hook) {
117
93
  frames++;
118
94
  var time = (performance || Date).now();
119
95
  msPanel.update(time - beginTime, 200);
120
-
96
+ if (hook) {
97
+ dcPanel.update(hook.deltaDrawCalls, Math.max(50, hook.maxDeltaDrawCalls));
98
+ tcPanel.update(hook.texturesCount, Math.max(20, hook.maxTextureCount));
99
+ }
121
100
  if (time >= prevTime + 1000) {
122
101
  fpsPanel.update(frames * 1000 / (time - prevTime), 100);
123
102
  prevTime = time;
124
103
  frames = 0;
125
-
126
104
  if (memPanel) {
127
105
  var memory = performance.memory;
128
106
  memPanel.update(memory.usedJSHeapSize / 1048576, memory.jsHeapSizeLimit / 1048576);
129
107
  }
130
108
  }
131
-
132
109
  return time;
133
110
  },
134
- update: function update() {
111
+ update: function () {
135
112
  beginTime = this.end();
136
113
  },
137
114
  domElement: container,
138
115
  setMode: showPanel
139
116
  };
140
117
  };
141
-
142
118
  Stats.Panel = function (name, fg, bg) {
143
119
  var min = Infinity,
144
- max = 0;
120
+ max = 0;
145
121
  var round = Math.round;
146
122
  var PR = round(window.devicePixelRatio || 1);
147
123
  var WIDTH = 80 * PR,
148
- HEIGHT = 48 * PR,
149
- TEXT_X = 3 * PR,
150
- TEXT_Y = 2 * PR,
151
- GRAPH_X = 3 * PR,
152
- GRAPH_Y = 15 * PR,
153
- GRAPH_WIDTH = 74 * PR,
154
- GRAPH_HEIGHT = 30 * PR;
124
+ HEIGHT = 48 * PR,
125
+ TEXT_X = 3 * PR,
126
+ TEXT_Y = 2 * PR,
127
+ GRAPH_X = 3 * PR,
128
+ GRAPH_Y = 15 * PR,
129
+ GRAPH_WIDTH = 74 * PR,
130
+ GRAPH_HEIGHT = 30 * PR;
155
131
  var canvas = document.createElement('canvas');
156
132
  canvas.width = WIDTH;
157
133
  canvas.height = HEIGHT;
@@ -169,7 +145,7 @@ this.EVA.plugin.stats = function (exports, eva_js) {
169
145
  context.fillRect(GRAPH_X, GRAPH_Y, GRAPH_WIDTH, GRAPH_HEIGHT);
170
146
  return {
171
147
  dom: canvas,
172
- update: function update(value, maxValue) {
148
+ update: function (value, maxValue) {
173
149
  min = Math.min(min, value);
174
150
  max = Math.max(max, value);
175
151
  context.fillStyle = bg;
@@ -185,30 +161,193 @@ this.EVA.plugin.stats = function (exports, eva_js) {
185
161
  }
186
162
  };
187
163
  };
188
-
189
164
  var Stats$1 = Stats;
190
-
165
+ var GLHook = function () {
166
+ function GLHook(_gl) {
167
+ this.drawPasses = 0;
168
+ this.isInit = false;
169
+ this.realGLDrawElements = function () {};
170
+ if (_gl) {
171
+ if (_gl.__proto__.drawElements) {
172
+ this.gl = _gl;
173
+ this.realGLDrawElements = _gl.__proto__.drawElements;
174
+ _gl.__proto__.drawElements = this.fakeGLdrawElements(this);
175
+ this.isInit = true;
176
+ }
177
+ } else {
178
+ console.error("[GLHook] GL can't be NULL");
179
+ }
180
+ }
181
+ GLHook.prototype.fakeGLdrawElements = function (context) {
182
+ return function (mode, count, type, offset) {
183
+ context.drawPasses++;
184
+ context.realGLDrawElements.call(this, mode, count, type, offset);
185
+ };
186
+ };
187
+ GLHook.prototype.reset = function () {
188
+ this.drawPasses = 0;
189
+ };
190
+ GLHook.prototype.release = function () {
191
+ if (this.isInit) {
192
+ this.gl.__proto__.drawElements = this.realGLDrawElements;
193
+ }
194
+ this.isInit = false;
195
+ };
196
+ return GLHook;
197
+ }();
198
+ var TextureHook = function () {
199
+ function TextureHook(_gl) {
200
+ this.createdTextures = new Array();
201
+ this.maxTexturesCount = 0;
202
+ this.isInit = false;
203
+ this.realGLCreateTexture = function () {};
204
+ this.realGLDeleteTexture = function () {};
205
+ if (_gl) {
206
+ if (_gl.__proto__.createTexture) {
207
+ this.gl = _gl;
208
+ this.realGLCreateTexture = _gl.__proto__.createTexture;
209
+ this.realGLDeleteTexture = _gl.__proto__.deleteTexture;
210
+ _gl.__proto__.createTexture = this.fakeGLCreateTexture(this);
211
+ _gl.__proto__.deleteTexture = this.fakeGLDeleteTexture(this);
212
+ this.isInit = true;
213
+ }
214
+ } else {
215
+ console.error("[TextureHook] GL can't be NULL");
216
+ }
217
+ }
218
+ Object.defineProperty(TextureHook.prototype, "currentTextureCount", {
219
+ get: function () {
220
+ return this.createdTextures.length;
221
+ },
222
+ enumerable: false,
223
+ configurable: true
224
+ });
225
+ TextureHook.prototype.registerTexture = function (texture) {
226
+ this.createdTextures.push(texture);
227
+ this.maxTexturesCount = Math.max(this.createdTextures.length, this.maxTexturesCount);
228
+ };
229
+ TextureHook.prototype.fakeGLCreateTexture = function (context) {
230
+ return function () {
231
+ var texture = context.realGLCreateTexture.call(this);
232
+ context.registerTexture(texture);
233
+ return texture;
234
+ };
235
+ };
236
+ TextureHook.prototype.fakeGLDeleteTexture = function (context) {
237
+ return function (texture) {
238
+ var index = context.createdTextures.indexOf(texture);
239
+ if (index > -1) {
240
+ context.createdTextures.splice(index, 1);
241
+ }
242
+ context.realGLDeleteTexture.call(this, texture);
243
+ };
244
+ };
245
+ TextureHook.prototype.reset = function () {
246
+ this.createdTextures = new Array();
247
+ this.maxTexturesCount = 0;
248
+ };
249
+ TextureHook.prototype.release = function () {
250
+ if (this.isInit) {
251
+ this.gl.__proto__.createTexture = this.realGLCreateTexture;
252
+ this.gl.__proto__.deleteTexture = this.realGLDeleteTexture;
253
+ console.log('[TextureHook] Hook was removed!');
254
+ }
255
+ this.isInit = false;
256
+ };
257
+ return TextureHook;
258
+ }();
259
+ var BaseHooks = function () {
260
+ function BaseHooks() {
261
+ this._drawCalls = -1;
262
+ this._maxDeltaDrawCalls = -1;
263
+ }
264
+ BaseHooks.prototype.attach = function (gl) {
265
+ this.glhook = new GLHook(gl);
266
+ this.texturehook = new TextureHook(gl);
267
+ };
268
+ Object.defineProperty(BaseHooks.prototype, "drawCalls", {
269
+ get: function () {
270
+ if (this.glhook && this.glhook.isInit) {
271
+ return this.glhook.drawPasses;
272
+ }
273
+ return -1;
274
+ },
275
+ enumerable: false,
276
+ configurable: true
277
+ });
278
+ Object.defineProperty(BaseHooks.prototype, "maxDeltaDrawCalls", {
279
+ get: function () {
280
+ return this._maxDeltaDrawCalls;
281
+ },
282
+ enumerable: false,
283
+ configurable: true
284
+ });
285
+ Object.defineProperty(BaseHooks.prototype, "deltaDrawCalls", {
286
+ get: function () {
287
+ if (this._drawCalls == -1) {
288
+ this._drawCalls = this.drawCalls;
289
+ return 0;
290
+ }
291
+ var dc = this.drawCalls;
292
+ var delta = dc - this._drawCalls;
293
+ this._drawCalls = dc;
294
+ this._maxDeltaDrawCalls = Math.max(this._maxDeltaDrawCalls, delta);
295
+ return delta;
296
+ },
297
+ enumerable: false,
298
+ configurable: true
299
+ });
300
+ Object.defineProperty(BaseHooks.prototype, "maxTextureCount", {
301
+ get: function () {
302
+ if (this.texturehook && this.texturehook.isInit) return this.texturehook.maxTexturesCount;
303
+ return 0;
304
+ },
305
+ enumerable: false,
306
+ configurable: true
307
+ });
308
+ Object.defineProperty(BaseHooks.prototype, "texturesCount", {
309
+ get: function () {
310
+ if (this.texturehook && this.texturehook.isInit) return this.texturehook.currentTextureCount;
311
+ return 0;
312
+ },
313
+ enumerable: false,
314
+ configurable: true
315
+ });
316
+ BaseHooks.prototype.reset = function () {
317
+ this._maxDeltaDrawCalls = -1;
318
+ this._drawCalls = -1;
319
+ if (this.glhook) this.glhook.reset();
320
+ if (this.texturehook) this.texturehook.reset();
321
+ };
322
+ BaseHooks.prototype.release = function () {
323
+ if (this.glhook) this.glhook.release();
324
+ if (this.texturehook) this.texturehook.release();
325
+ };
326
+ return BaseHooks;
327
+ }();
191
328
  var StatsSystem = function (_super) {
192
329
  __extends(StatsSystem, _super);
193
-
194
330
  function StatsSystem() {
195
331
  var _this = _super !== null && _super.apply(this, arguments) || this;
196
-
197
332
  _this.show = true;
198
333
  return _this;
199
334
  }
200
-
201
335
  StatsSystem.prototype.init = function (param) {
202
336
  if (param === void 0) {
203
337
  param = {
204
338
  show: true
205
339
  };
206
340
  }
207
-
208
341
  this.show = param.show;
209
342
  this.style = param.style;
343
+ this.renderSystem = this.game.getSystem('Renderer');
344
+ this.app = this.renderSystem.application;
345
+ if (this.app && this.show) {
346
+ var gl = this.app.renderer.gl;
347
+ this.hook = new BaseHooks();
348
+ this.hook.attach(gl);
349
+ }
210
350
  };
211
-
212
351
  StatsSystem.prototype.start = function () {
213
352
  if (!this.show) return;
214
353
  this.component = this.game.scene.addComponent(new Stats$2());
@@ -217,16 +356,13 @@ this.EVA.plugin.stats = function (exports, eva_js) {
217
356
  this.stats.showPanel(0);
218
357
  document.body.appendChild(this.stats.dom);
219
358
  };
220
-
221
359
  StatsSystem.prototype.lateUpdate = function () {
222
360
  if (!this.show) return;
223
- this.stats && this.stats.end();
361
+ this.stats && this.stats.end(this.hook);
224
362
  };
225
-
226
363
  StatsSystem.systemName = 'Stats';
227
364
  return StatsSystem;
228
365
  }(eva_js.System);
229
-
230
366
  var StatsSystem$1 = StatsSystem;
231
367
  var index = {
232
368
  Components: [Stats$2],
@@ -234,9 +370,10 @@ this.EVA.plugin.stats = function (exports, eva_js) {
234
370
  };
235
371
  exports.Stats = Stats$2;
236
372
  exports.StatsSystem = StatsSystem$1;
237
- exports['default'] = index;
373
+ exports["default"] = index;
238
374
  Object.defineProperty(exports, '__esModule', {
239
375
  value: true
240
376
  });
241
377
  return exports;
242
378
  }({}, EVA);
379
+ window.EVA.plugin.stats = window.EVA.plugin.stats || _EVA_IIFE_stats;
package/dist/EVA.plugin.stats.min.js CHANGED
@@ -1 +1 @@
1
- this.EVA=this.EVA||{},this.EVA.plugin=this.EVA.plugin||{},this.EVA.plugin.stats=function(t,e){"use strict";var n=function(t,e){return(n=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function i(t,e){function i(){this.constructor=t}n(t,e),t.prototype=null===e?Object.create(e):(i.prototype=e.prototype,new i)}var o=function(){return(o=Object.assign||function(t){for(var e,n=1,i=arguments.length;n<i;n++)for(var o in e=arguments[n])Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o]);return t}).apply(this,arguments)},s=function(t){function e(){return null!==t&&t.apply(this,arguments)||this}return i(e,t),e.prototype.update=function(){this.stats&&this.stats.begin()},e.componentName="Stats",e}(e.Component),a=function t(e){var n=(e=o({width:20,height:12,x:0,y:0},e)).width,i=e.height,s=e.x,a=e.y,l=0,r=document.createElement("div");function c(t){return r.appendChild(t.dom),t}function p(t){for(var e=0;e<r.children.length;e++)r.children[e].style.display=e===t?"block":"none";l=t}r.style.cssText="position:fixed;top:0;left:0;cursor:pointer;opacity:0.9;z-index:10000;width: "+n+"vw;height: "+i+"vw;left: "+s+"vw;top: "+a+"vw;",r.addEventListener("click",(function(t){t.preventDefault(),p(++l%r.children.length)}),!1);var h,f=(performance||Date).now(),u=f,d=0,y=c(t.Panel("FPS","#0ff","#002")),m=c(t.Panel("MS","#0f0","#020"));return self.performance&&self.performance.memory&&(h=c(t.Panel("MB","#f08","#201"))),p(0),{REVISION:16,dom:r,addPanel:c,showPanel:p,begin:function(t){f=t||(performance||Date).now()},end:function(){d++;var t=(performance||Date).now();if(m.update(t-f,200),t>=u+1e3&&(y.update(1e3*d/(t-u),100),u=t,d=0,h)){var e=performance.memory;h.update(e.usedJSHeapSize/1048576,e.jsHeapSizeLimit/1048576)}return t},update:function(){f=this.end()},domElement:r,setMode:p}};a.Panel=function(t,e,n){var i=1/0,o=0,s=Math.round,a=s(window.devicePixelRatio||1),l=80*a,r=48*a,c=3*a,p=2*a,h=3*a,f=15*a,u=74*a,d=30*a,y=document.createElement("canvas");y.width=l,y.height=r,y.style.cssText="width:100%;height:100%";var m=y.getContext("2d");return m.font="bold "+9*a+"px Helvetica,Arial,sans-serif",m.textBaseline="top",m.fillStyle=n,m.fillRect(0,0,l,r),m.fillStyle=e,m.fillText(t,c,p),m.fillRect(h,f,u,d),m.fillStyle=n,m.globalAlpha=.9,m.fillRect(h,f,u,d),{dom:y,update:function(r,w){i=Math.min(i,r),o=Math.max(o,r),m.fillStyle=n,m.globalAlpha=1,m.fillRect(0,0,l,f),m.fillStyle=e,m.fillText(s(r)+" "+t+" ("+s(i)+"-"+s(o)+")",c,p),m.drawImage(y,h+a,f,u-a,d,h,f,u-a,d),m.fillRect(h+u-a,f,a,d),m.fillStyle=n,m.globalAlpha=.9,m.fillRect(h+u-a,f,a,s((1-r/w)*d))}}};var l=a,r=function(t){function e(){var e=null!==t&&t.apply(this,arguments)||this;return e.show=!0,e}return i(e,t),e.prototype.init=function(t){void 0===t&&(t={show:!0}),this.show=t.show,this.style=t.style},e.prototype.start=function(){this.show&&(this.component=this.game.scene.addComponent(new s),this.stats=l(this.style),this.component.stats=this.stats,this.stats.showPanel(0),document.body.appendChild(this.stats.dom))},e.prototype.lateUpdate=function(){this.show&&this.stats&&this.stats.end()},e.systemName="Stats",e}(e.System),c={Components:[s],Systems:[r]};return t.Stats=s,t.StatsSystem=r,t.default=c,Object.defineProperty(t,"__esModule",{value:!0}),t}({},EVA);
1
+ window.EVA=window.EVA||{},window.EVA.plugin=window.EVA.plugin||{};var _EVA_IIFE_stats=function(t,e){"use strict";var r=function(t,e){return r=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var r in e)e.hasOwnProperty(r)&&(t[r]=e[r])},r(t,e)};function o(t,e){function o(){this.constructor=t}r(t,e),t.prototype=null===e?Object.create(e):(o.prototype=e.prototype,new o)}var n=function(){return n=Object.assign||function(t){for(var e,r=1,o=arguments.length;r<o;r++)for(var n in e=arguments[r])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},n.apply(this,arguments)},i=function(t){function e(){return null!==t&&t.apply(this,arguments)||this}return o(e,t),e.prototype.update=function(){this.stats&&this.stats.begin()},e.componentName="Stats",e}(e.Component),s=i,a=function(t){var e=(t=n({width:20,height:12,x:0,y:0},t)).width,r=t.height,o=t.x,i=t.y,s=0,l=document.createElement("div");function u(t){return l.appendChild(t.dom),t}function h(t){for(var e=0;e<l.children.length;e++)l.children[e].style.display=e===t?"block":"none";s=t}l.style.cssText="position:fixed;top:0;left:0;cursor:pointer;opacity:0.9;z-index:10000;width: "+e+"vw;height: "+r+"vw;left: "+o+"vw;top: "+i+"vw;",l.addEventListener("click",(function(t){t.preventDefault(),h(++s%l.children.length)}),!1);var c,p=(performance||Date).now(),f=p,d=0,x=u(a.Panel("FPS","#0ff","#002")),w=u(a.Panel("MS","#0f0","#020")),m=u(a.Panel("DrawCall","#330570","#A69700")),_=u(a.Panel("TC:","#A62500","#00B454"));return self.performance&&self.performance.memory&&(c=u(a.Panel("MB","#f08","#201"))),h(0),{REVISION:16,dom:l,addPanel:u,showPanel:h,begin:function(t){p=t||(performance||Date).now()},end:function(t){d++;var e=(performance||Date).now();if(w.update(e-p,200),t&&(m.update(t.deltaDrawCalls,Math.max(50,t.maxDeltaDrawCalls)),_.update(t.texturesCount,Math.max(20,t.maxTextureCount))),e>=f+1e3&&(x.update(1e3*d/(e-f),100),f=e,d=0,c)){var r=performance.memory;c.update(r.usedJSHeapSize/1048576,r.jsHeapSizeLimit/1048576)}return e},update:function(){p=this.end()},domElement:l,setMode:h}};a.Panel=function(t,e,r){var o=1/0,n=0,i=Math.round,s=i(window.devicePixelRatio||1),a=80*s,l=48*s,u=3*s,h=2*s,c=3*s,p=15*s,f=74*s,d=30*s,x=document.createElement("canvas");x.width=a,x.height=l,x.style.cssText="width:100%;height:100%";var w=x.getContext("2d");return w.font="bold "+9*s+"px Helvetica,Arial,sans-serif",w.textBaseline="top",w.fillStyle=r,w.fillRect(0,0,a,l),w.fillStyle=e,w.fillText(t,u,h),w.fillRect(c,p,f,d),w.fillStyle=r,w.globalAlpha=.9,w.fillRect(c,p,f,d),{dom:x,update:function(l,m){o=Math.min(o,l),n=Math.max(n,l),w.fillStyle=r,w.globalAlpha=1,w.fillRect(0,0,a,p),w.fillStyle=e,w.fillText(i(l)+" "+t+" ("+i(o)+"-"+i(n)+")",u,h),w.drawImage(x,c+s,p,f-s,d,c,p,f-s,d),w.fillRect(c+f-s,p,s,d),w.fillStyle=r,w.globalAlpha=.9,w.fillRect(c+f-s,p,s,i((1-l/m)*d))}}};var l=a,u=function(){function t(t){this.drawPasses=0,this.isInit=!1,this.realGLDrawElements=function(){},t?t.__proto__.drawElements&&(this.gl=t,this.realGLDrawElements=t.__proto__.drawElements,t.__proto__.drawElements=this.fakeGLdrawElements(this),this.isInit=!0):console.error("[GLHook] GL can't be NULL")}return t.prototype.fakeGLdrawElements=function(t){return function(e,r,o,n){t.drawPasses++,t.realGLDrawElements.call(this,e,r,o,n)}},t.prototype.reset=function(){this.drawPasses=0},t.prototype.release=function(){this.isInit&&(this.gl.__proto__.drawElements=this.realGLDrawElements),this.isInit=!1},t}(),h=function(){function t(t){this.createdTextures=new Array,this.maxTexturesCount=0,this.isInit=!1,this.realGLCreateTexture=function(){},this.realGLDeleteTexture=function(){},t?t.__proto__.createTexture&&(this.gl=t,this.realGLCreateTexture=t.__proto__.createTexture,this.realGLDeleteTexture=t.__proto__.deleteTexture,t.__proto__.createTexture=this.fakeGLCreateTexture(this),t.__proto__.deleteTexture=this.fakeGLDeleteTexture(this),this.isInit=!0):console.error("[TextureHook] GL can't be NULL")}return Object.defineProperty(t.prototype,"currentTextureCount",{get:function(){return this.createdTextures.length},enumerable:!1,configurable:!0}),t.prototype.registerTexture=function(t){this.createdTextures.push(t),this.maxTexturesCount=Math.max(this.createdTextures.length,this.maxTexturesCount)},t.prototype.fakeGLCreateTexture=function(t){return function(){var e=t.realGLCreateTexture.call(this);return t.registerTexture(e),e}},t.prototype.fakeGLDeleteTexture=function(t){return function(e){var r=t.createdTextures.indexOf(e);r>-1&&t.createdTextures.splice(r,1),t.realGLDeleteTexture.call(this,e)}},t.prototype.reset=function(){this.createdTextures=new Array,this.maxTexturesCount=0},t.prototype.release=function(){this.isInit&&(this.gl.__proto__.createTexture=this.realGLCreateTexture,this.gl.__proto__.deleteTexture=this.realGLDeleteTexture,console.log("[TextureHook] Hook was removed!")),this.isInit=!1},t}(),c=function(){function t(){this._drawCalls=-1,this._maxDeltaDrawCalls=-1}return t.prototype.attach=function(t){this.glhook=new u(t),this.texturehook=new h(t)},Object.defineProperty(t.prototype,"drawCalls",{get:function(){return this.glhook&&this.glhook.isInit?this.glhook.drawPasses:-1},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"maxDeltaDrawCalls",{get:function(){return this._maxDeltaDrawCalls},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"deltaDrawCalls",{get:function(){if(-1==this._drawCalls)return this._drawCalls=this.drawCalls,0;var t=this.drawCalls,e=t-this._drawCalls;return this._drawCalls=t,this._maxDeltaDrawCalls=Math.max(this._maxDeltaDrawCalls,e),e},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"maxTextureCount",{get:function(){return this.texturehook&&this.texturehook.isInit?this.texturehook.maxTexturesCount:0},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"texturesCount",{get:function(){return this.texturehook&&this.texturehook.isInit?this.texturehook.currentTextureCount:0},enumerable:!1,configurable:!0}),t.prototype.reset=function(){this._maxDeltaDrawCalls=-1,this._drawCalls=-1,this.glhook&&this.glhook.reset(),this.texturehook&&this.texturehook.reset()},t.prototype.release=function(){this.glhook&&this.glhook.release(),this.texturehook&&this.texturehook.release()},t}(),p=function(t){function e(){var e=null!==t&&t.apply(this,arguments)||this;return e.show=!0,e}return o(e,t),e.prototype.init=function(t){if(void 0===t&&(t={show:!0}),this.show=t.show,this.style=t.style,this.renderSystem=this.game.getSystem("Renderer"),this.app=this.renderSystem.application,this.app&&this.show){var e=this.app.renderer.gl;this.hook=new c,this.hook.attach(e)}},e.prototype.start=function(){this.show&&(this.component=this.game.scene.addComponent(new s),this.stats=l(this.style),this.component.stats=this.stats,this.stats.showPanel(0),document.body.appendChild(this.stats.dom))},e.prototype.lateUpdate=function(){this.show&&this.stats&&this.stats.end(this.hook)},e.systemName="Stats",e}(e.System),f=p,d={Components:[s],Systems:[f]};return t.Stats=s,t.StatsSystem=f,t.default=d,Object.defineProperty(t,"__esModule",{value:!0}),t}({},EVA);window.EVA.plugin.stats=window.EVA.plugin.stats||_EVA_IIFE_stats;
package/dist/plugin-stats.cjs.js CHANGED
@@ -80,6 +80,8 @@ var Stats = function (style) {
80
80
  var beginTime = (performance || Date).now(), prevTime = beginTime, frames = 0;
81
81
  var fpsPanel = addPanel(Stats.Panel('FPS', '#0ff', '#002'));
82
82
  var msPanel = addPanel(Stats.Panel('MS', '#0f0', '#020'));
83
+ var dcPanel = addPanel(Stats.Panel('DrawCall', '#330570', '#A69700'));
84
+ var tcPanel = addPanel(Stats.Panel('TC:', '#A62500', '#00B454'));
83
85
  var memPanel;
84
86
  if (self.performance && self.performance.memory) {
85
87
  memPanel = addPanel(Stats.Panel('MB', '#f08', '#201'));
@@ -93,10 +95,14 @@ var Stats = function (style) {
93
95
  begin: function (time) {
94
96
  beginTime = time || (performance || Date).now();
95
97
  },
96
- end: function () {
98
+ end: function (hook) {
97
99
  frames++;
98
100
  var time = (performance || Date).now();
99
101
  msPanel.update(time - beginTime, 200);
102
+ if (hook) {
103
+ dcPanel.update(hook.deltaDrawCalls, Math.max(50, hook.maxDeltaDrawCalls));
104
+ tcPanel.update(hook.texturesCount, Math.max(20, hook.maxTextureCount));
105
+ }
100
106
  if (time >= prevTime + 1000) {
101
107
  fpsPanel.update((frames * 1000) / (time - prevTime), 100);
102
108
  prevTime = time;
@@ -155,6 +161,180 @@ Stats.Panel = function (name, fg, bg) {
155
161
  };
156
162
  var Stats$1 = Stats;
157
163
 
164
+ var GLHook = (function () {
165
+ function GLHook(_gl) {
166
+ this.drawPasses = 0;
167
+ this.isInit = false;
168
+ this.realGLDrawElements = function () { };
169
+ if (_gl) {
170
+ if (_gl.__proto__.drawElements) {
171
+ this.gl = _gl;
172
+ this.realGLDrawElements = _gl.__proto__.drawElements;
173
+ _gl.__proto__.drawElements = this.fakeGLdrawElements(this);
174
+ this.isInit = true;
175
+ }
176
+ }
177
+ else {
178
+ console.error("[GLHook] GL can't be NULL");
179
+ }
180
+ }
181
+ GLHook.prototype.fakeGLdrawElements = function (context) {
182
+ return function (mode, count, type, offset) {
183
+ context.drawPasses++;
184
+ context.realGLDrawElements.call(this, mode, count, type, offset);
185
+ };
186
+ };
187
+ GLHook.prototype.reset = function () {
188
+ this.drawPasses = 0;
189
+ };
190
+ GLHook.prototype.release = function () {
191
+ if (this.isInit) {
192
+ this.gl.__proto__.drawElements = this.realGLDrawElements;
193
+ }
194
+ this.isInit = false;
195
+ };
196
+ return GLHook;
197
+ }());
198
+
199
+ var TextureHook = (function () {
200
+ function TextureHook(_gl) {
201
+ this.createdTextures = new Array();
202
+ this.maxTexturesCount = 0;
203
+ this.isInit = false;
204
+ this.realGLCreateTexture = function () { };
205
+ this.realGLDeleteTexture = function () { };
206
+ if (_gl) {
207
+ if (_gl.__proto__.createTexture) {
208
+ this.gl = _gl;
209
+ this.realGLCreateTexture = _gl.__proto__.createTexture;
210
+ this.realGLDeleteTexture = _gl.__proto__.deleteTexture;
211
+ _gl.__proto__.createTexture = this.fakeGLCreateTexture(this);
212
+ _gl.__proto__.deleteTexture = this.fakeGLDeleteTexture(this);
213
+ this.isInit = true;
214
+ }
215
+ }
216
+ else {
217
+ console.error("[TextureHook] GL can't be NULL");
218
+ }
219
+ }
220
+ Object.defineProperty(TextureHook.prototype, "currentTextureCount", {
221
+ get: function () {
222
+ return this.createdTextures.length;
223
+ },
224
+ enumerable: false,
225
+ configurable: true
226
+ });
227
+ TextureHook.prototype.registerTexture = function (texture) {
228
+ this.createdTextures.push(texture);
229
+ this.maxTexturesCount = Math.max(this.createdTextures.length, this.maxTexturesCount);
230
+ };
231
+ TextureHook.prototype.fakeGLCreateTexture = function (context) {
232
+ return function () {
233
+ var texture = context.realGLCreateTexture.call(this);
234
+ context.registerTexture(texture);
235
+ return texture;
236
+ };
237
+ };
238
+ TextureHook.prototype.fakeGLDeleteTexture = function (context) {
239
+ return function (texture) {
240
+ var index = context.createdTextures.indexOf(texture);
241
+ if (index > -1) {
242
+ context.createdTextures.splice(index, 1);
243
+ }
244
+ context.realGLDeleteTexture.call(this, texture);
245
+ };
246
+ };
247
+ TextureHook.prototype.reset = function () {
248
+ this.createdTextures = new Array();
249
+ this.maxTexturesCount = 0;
250
+ };
251
+ TextureHook.prototype.release = function () {
252
+ if (this.isInit) {
253
+ this.gl.__proto__.createTexture = this.realGLCreateTexture;
254
+ this.gl.__proto__.deleteTexture = this.realGLDeleteTexture;
255
+ console.log('[TextureHook] Hook was removed!');
256
+ }
257
+ this.isInit = false;
258
+ };
259
+ return TextureHook;
260
+ }());
261
+
262
+ var BaseHooks = (function () {
263
+ function BaseHooks() {
264
+ this._drawCalls = -1;
265
+ this._maxDeltaDrawCalls = -1;
266
+ }
267
+ BaseHooks.prototype.attach = function (gl) {
268
+ this.glhook = new GLHook(gl);
269
+ this.texturehook = new TextureHook(gl);
270
+ };
271
+ Object.defineProperty(BaseHooks.prototype, "drawCalls", {
272
+ get: function () {
273
+ if (this.glhook && this.glhook.isInit) {
274
+ return this.glhook.drawPasses;
275
+ }
276
+ return -1;
277
+ },
278
+ enumerable: false,
279
+ configurable: true
280
+ });
281
+ Object.defineProperty(BaseHooks.prototype, "maxDeltaDrawCalls", {
282
+ get: function () {
283
+ return this._maxDeltaDrawCalls;
284
+ },
285
+ enumerable: false,
286
+ configurable: true
287
+ });
288
+ Object.defineProperty(BaseHooks.prototype, "deltaDrawCalls", {
289
+ get: function () {
290
+ if (this._drawCalls == -1) {
291
+ this._drawCalls = this.drawCalls;
292
+ return 0;
293
+ }
294
+ var dc = this.drawCalls;
295
+ var delta = dc - this._drawCalls;
296
+ this._drawCalls = dc;
297
+ this._maxDeltaDrawCalls = Math.max(this._maxDeltaDrawCalls, delta);
298
+ return delta;
299
+ },
300
+ enumerable: false,
301
+ configurable: true
302
+ });
303
+ Object.defineProperty(BaseHooks.prototype, "maxTextureCount", {
304
+ get: function () {
305
+ if (this.texturehook && this.texturehook.isInit)
306
+ return this.texturehook.maxTexturesCount;
307
+ return 0;
308
+ },
309
+ enumerable: false,
310
+ configurable: true
311
+ });
312
+ Object.defineProperty(BaseHooks.prototype, "texturesCount", {
313
+ get: function () {
314
+ if (this.texturehook && this.texturehook.isInit)
315
+ return this.texturehook.currentTextureCount;
316
+ return 0;
317
+ },
318
+ enumerable: false,
319
+ configurable: true
320
+ });
321
+ BaseHooks.prototype.reset = function () {
322
+ this._maxDeltaDrawCalls = -1;
323
+ this._drawCalls = -1;
324
+ if (this.glhook)
325
+ this.glhook.reset();
326
+ if (this.texturehook)
327
+ this.texturehook.reset();
328
+ };
329
+ BaseHooks.prototype.release = function () {
330
+ if (this.glhook)
331
+ this.glhook.release();
332
+ if (this.texturehook)
333
+ this.texturehook.release();
334
+ };
335
+ return BaseHooks;
336
+ }());
337
+
158
338
  var StatsSystem = (function (_super) {
159
339
  __extends(StatsSystem, _super);
160
340
  function StatsSystem() {
@@ -166,6 +346,13 @@ var StatsSystem = (function (_super) {
166
346
  if (param === void 0) { param = { show: true }; }
167
347
  this.show = param.show;
168
348
  this.style = param.style;
349
+ this.renderSystem = this.game.getSystem('Renderer');
350
+ this.app = this.renderSystem.application;
351
+ if (this.app && this.show) {
352
+ var gl = this.app.renderer.gl;
353
+ this.hook = new BaseHooks();
354
+ this.hook.attach(gl);
355
+ }
169
356
  };
170
357
  StatsSystem.prototype.start = function () {
171
358
  if (!this.show)
@@ -179,7 +366,7 @@ var StatsSystem = (function (_super) {
179
366
  StatsSystem.prototype.lateUpdate = function () {
180
367
  if (!this.show)
181
368
  return;
182
- this.stats && this.stats.end();
369
+ this.stats && this.stats.end(this.hook);
183
370
  };
184
371
  StatsSystem.systemName = 'Stats';
185
372
  return StatsSystem;
@@ -193,4 +380,4 @@ var index = {
193
380
 
194
381
  exports.Stats = Stats$2;
195
382
  exports.StatsSystem = StatsSystem$1;
196
- exports['default'] = index;
383
+ exports["default"] = index;
package/dist/plugin-stats.cjs.prod.js CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@eva/eva.js"),e=function(t,n){return(e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,n)};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@eva/eva.js"),e=function(t,r){return e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var r in e)e.hasOwnProperty(r)&&(t[r]=e[r])},e(t,r)};
2
2
  /*! *****************************************************************************
3
3
  Copyright (c) Microsoft Corporation. All rights reserved.
4
4
  Licensed under the Apache License, Version 2.0 (the "License"); you may not use
@@ -12,4 +12,4 @@ MERCHANTABLITY OR NON-INFRINGEMENT.
12
12
 
13
13
  See the Apache Version 2.0 License for specific language governing permissions
14
14
  and limitations under the License.
15
- ***************************************************************************** */function n(t,n){function o(){this.constructor=t}e(t,n),t.prototype=null===n?Object.create(n):(o.prototype=n.prototype,new o)}var o=function(){return(o=Object.assign||function(t){for(var e,n=1,o=arguments.length;n<o;n++)for(var i in e=arguments[n])Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i]);return t}).apply(this,arguments)},i=function(t){function e(){return null!==t&&t.apply(this,arguments)||this}return n(e,t),e.prototype.update=function(){this.stats&&this.stats.begin()},e.componentName="Stats",e}(t.Component),s=function(t){var e=(t=o({width:20,height:12,x:0,y:0},t)).width,n=t.height,i=t.x,a=t.y,r=0,l=document.createElement("div");function c(t){return l.appendChild(t.dom),t}function p(t){for(var e=0;e<l.children.length;e++)l.children[e].style.display=e===t?"block":"none";r=t}l.style.cssText="position:fixed;top:0;left:0;cursor:pointer;opacity:0.9;z-index:10000;width: "+e+"vw;height: "+n+"vw;left: "+i+"vw;top: "+a+"vw;",l.addEventListener("click",(function(t){t.preventDefault(),p(++r%l.children.length)}),!1);var f,h=(performance||Date).now(),u=h,d=0,y=c(s.Panel("FPS","#0ff","#002")),m=c(s.Panel("MS","#0f0","#020"));return self.performance&&self.performance.memory&&(f=c(s.Panel("MB","#f08","#201"))),p(0),{REVISION:16,dom:l,addPanel:c,showPanel:p,begin:function(t){h=t||(performance||Date).now()},end:function(){d++;var t=(performance||Date).now();if(m.update(t-h,200),t>=u+1e3&&(y.update(1e3*d/(t-u),100),u=t,d=0,f)){var e=performance.memory;f.update(e.usedJSHeapSize/1048576,e.jsHeapSizeLimit/1048576)}return t},update:function(){h=this.end()},domElement:l,setMode:p}};s.Panel=function(t,e,n){var o=1/0,i=0,s=Math.round,a=s(window.devicePixelRatio||1),r=80*a,l=48*a,c=3*a,p=2*a,f=3*a,h=15*a,u=74*a,d=30*a,y=document.createElement("canvas");y.width=r,y.height=l,y.style.cssText="width:100%;height:100%";var m=y.getContext("2d");return m.font="bold "+9*a+"px Helvetica,Arial,sans-serif",m.textBaseline="top",m.fillStyle=n,m.fillRect(0,0,r,l),m.fillStyle=e,m.fillText(t,c,p),m.fillRect(f,h,u,d),m.fillStyle=n,m.globalAlpha=.9,m.fillRect(f,h,u,d),{dom:y,update:function(l,v){o=Math.min(o,l),i=Math.max(i,l),m.fillStyle=n,m.globalAlpha=1,m.fillRect(0,0,r,h),m.fillStyle=e,m.fillText(s(l)+" "+t+" ("+s(o)+"-"+s(i)+")",c,p),m.drawImage(y,f+a,h,u-a,d,f,h,u-a,d),m.fillRect(f+u-a,h,a,d),m.fillStyle=n,m.globalAlpha=.9,m.fillRect(f+u-a,h,a,s((1-l/v)*d))}}};var a=s,r=function(t){function e(){var e=null!==t&&t.apply(this,arguments)||this;return e.show=!0,e}return n(e,t),e.prototype.init=function(t){void 0===t&&(t={show:!0}),this.show=t.show,this.style=t.style},e.prototype.start=function(){this.show&&(this.component=this.game.scene.addComponent(new i),this.stats=a(this.style),this.component.stats=this.stats,this.stats.showPanel(0),document.body.appendChild(this.stats.dom))},e.prototype.lateUpdate=function(){this.show&&this.stats&&this.stats.end()},e.systemName="Stats",e}(t.System),l={Components:[i],Systems:[r]};exports.Stats=i,exports.StatsSystem=r,exports.default=l;
15
+ ***************************************************************************** */function r(t,r){function o(){this.constructor=t}e(t,r),t.prototype=null===r?Object.create(r):(o.prototype=r.prototype,new o)}var o=function(){return o=Object.assign||function(t){for(var e,r=1,o=arguments.length;r<o;r++)for(var n in e=arguments[r])Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},o.apply(this,arguments)},n=function(t){function e(){return null!==t&&t.apply(this,arguments)||this}return r(e,t),e.prototype.update=function(){this.stats&&this.stats.begin()},e.componentName="Stats",e}(t.Component),s=function(t){var e=(t=o({width:20,height:12,x:0,y:0},t)).width,r=t.height,n=t.x,i=t.y,a=0,l=document.createElement("div");function u(t){return l.appendChild(t.dom),t}function h(t){for(var e=0;e<l.children.length;e++)l.children[e].style.display=e===t?"block":"none";a=t}l.style.cssText="position:fixed;top:0;left:0;cursor:pointer;opacity:0.9;z-index:10000;width: "+e+"vw;height: "+r+"vw;left: "+n+"vw;top: "+i+"vw;",l.addEventListener("click",(function(t){t.preventDefault(),h(++a%l.children.length)}),!1);var c,p=(performance||Date).now(),f=p,d=0,x=u(s.Panel("FPS","#0ff","#002")),m=u(s.Panel("MS","#0f0","#020")),w=u(s.Panel("DrawCall","#330570","#A69700")),y=u(s.Panel("TC:","#A62500","#00B454"));return self.performance&&self.performance.memory&&(c=u(s.Panel("MB","#f08","#201"))),h(0),{REVISION:16,dom:l,addPanel:u,showPanel:h,begin:function(t){p=t||(performance||Date).now()},end:function(t){d++;var e=(performance||Date).now();if(m.update(e-p,200),t&&(w.update(t.deltaDrawCalls,Math.max(50,t.maxDeltaDrawCalls)),y.update(t.texturesCount,Math.max(20,t.maxTextureCount))),e>=f+1e3&&(x.update(1e3*d/(e-f),100),f=e,d=0,c)){var r=performance.memory;c.update(r.usedJSHeapSize/1048576,r.jsHeapSizeLimit/1048576)}return e},update:function(){p=this.end()},domElement:l,setMode:h}};s.Panel=function(t,e,r){var o=1/0,n=0,s=Math.round,i=s(window.devicePixelRatio||1),a=80*i,l=48*i,u=3*i,h=2*i,c=3*i,p=15*i,f=74*i,d=30*i,x=document.createElement("canvas");x.width=a,x.height=l,x.style.cssText="width:100%;height:100%";var m=x.getContext("2d");return m.font="bold "+9*i+"px Helvetica,Arial,sans-serif",m.textBaseline="top",m.fillStyle=r,m.fillRect(0,0,a,l),m.fillStyle=e,m.fillText(t,u,h),m.fillRect(c,p,f,d),m.fillStyle=r,m.globalAlpha=.9,m.fillRect(c,p,f,d),{dom:x,update:function(l,w){o=Math.min(o,l),n=Math.max(n,l),m.fillStyle=r,m.globalAlpha=1,m.fillRect(0,0,a,p),m.fillStyle=e,m.fillText(s(l)+" "+t+" ("+s(o)+"-"+s(n)+")",u,h),m.drawImage(x,c+i,p,f-i,d,c,p,f-i,d),m.fillRect(c+f-i,p,i,d),m.fillStyle=r,m.globalAlpha=.9,m.fillRect(c+f-i,p,i,s((1-l/w)*d))}}};var i=s,a=function(){function t(t){this.drawPasses=0,this.isInit=!1,this.realGLDrawElements=function(){},t?t.__proto__.drawElements&&(this.gl=t,this.realGLDrawElements=t.__proto__.drawElements,t.__proto__.drawElements=this.fakeGLdrawElements(this),this.isInit=!0):console.error("[GLHook] GL can't be NULL")}return t.prototype.fakeGLdrawElements=function(t){return function(e,r,o,n){t.drawPasses++,t.realGLDrawElements.call(this,e,r,o,n)}},t.prototype.reset=function(){this.drawPasses=0},t.prototype.release=function(){this.isInit&&(this.gl.__proto__.drawElements=this.realGLDrawElements),this.isInit=!1},t}(),l=function(){function t(t){this.createdTextures=new Array,this.maxTexturesCount=0,this.isInit=!1,this.realGLCreateTexture=function(){},this.realGLDeleteTexture=function(){},t?t.__proto__.createTexture&&(this.gl=t,this.realGLCreateTexture=t.__proto__.createTexture,this.realGLDeleteTexture=t.__proto__.deleteTexture,t.__proto__.createTexture=this.fakeGLCreateTexture(this),t.__proto__.deleteTexture=this.fakeGLDeleteTexture(this),this.isInit=!0):console.error("[TextureHook] GL can't be NULL")}return Object.defineProperty(t.prototype,"currentTextureCount",{get:function(){return this.createdTextures.length},enumerable:!1,configurable:!0}),t.prototype.registerTexture=function(t){this.createdTextures.push(t),this.maxTexturesCount=Math.max(this.createdTextures.length,this.maxTexturesCount)},t.prototype.fakeGLCreateTexture=function(t){return function(){var e=t.realGLCreateTexture.call(this);return t.registerTexture(e),e}},t.prototype.fakeGLDeleteTexture=function(t){return function(e){var r=t.createdTextures.indexOf(e);r>-1&&t.createdTextures.splice(r,1),t.realGLDeleteTexture.call(this,e)}},t.prototype.reset=function(){this.createdTextures=new Array,this.maxTexturesCount=0},t.prototype.release=function(){this.isInit&&(this.gl.__proto__.createTexture=this.realGLCreateTexture,this.gl.__proto__.deleteTexture=this.realGLDeleteTexture,console.log("[TextureHook] Hook was removed!")),this.isInit=!1},t}(),u=function(){function t(){this._drawCalls=-1,this._maxDeltaDrawCalls=-1}return t.prototype.attach=function(t){this.glhook=new a(t),this.texturehook=new l(t)},Object.defineProperty(t.prototype,"drawCalls",{get:function(){return this.glhook&&this.glhook.isInit?this.glhook.drawPasses:-1},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"maxDeltaDrawCalls",{get:function(){return this._maxDeltaDrawCalls},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"deltaDrawCalls",{get:function(){if(-1==this._drawCalls)return this._drawCalls=this.drawCalls,0;var t=this.drawCalls,e=t-this._drawCalls;return this._drawCalls=t,this._maxDeltaDrawCalls=Math.max(this._maxDeltaDrawCalls,e),e},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"maxTextureCount",{get:function(){return this.texturehook&&this.texturehook.isInit?this.texturehook.maxTexturesCount:0},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"texturesCount",{get:function(){return this.texturehook&&this.texturehook.isInit?this.texturehook.currentTextureCount:0},enumerable:!1,configurable:!0}),t.prototype.reset=function(){this._maxDeltaDrawCalls=-1,this._drawCalls=-1,this.glhook&&this.glhook.reset(),this.texturehook&&this.texturehook.reset()},t.prototype.release=function(){this.glhook&&this.glhook.release(),this.texturehook&&this.texturehook.release()},t}(),h=function(t){function e(){var e=null!==t&&t.apply(this,arguments)||this;return e.show=!0,e}return r(e,t),e.prototype.init=function(t){if(void 0===t&&(t={show:!0}),this.show=t.show,this.style=t.style,this.renderSystem=this.game.getSystem("Renderer"),this.app=this.renderSystem.application,this.app&&this.show){var e=this.app.renderer.gl;this.hook=new u,this.hook.attach(e)}},e.prototype.start=function(){this.show&&(this.component=this.game.scene.addComponent(new n),this.stats=i(this.style),this.component.stats=this.stats,this.stats.showPanel(0),document.body.appendChild(this.stats.dom))},e.prototype.lateUpdate=function(){this.show&&this.stats&&this.stats.end(this.hook)},e.systemName="Stats",e}(t.System),c={Components:[n],Systems:[h]};exports.Stats=n,exports.StatsSystem=h,exports.default=c;
package/dist/plugin-stats.d.ts CHANGED
@@ -1,4 +1,6 @@
1
+ import type { Application } from '@eva/renderer-adapter';
1
2
  import { Component } from '@eva/eva.js';
3
+ import type { RendererSystem } from '@eva/plugin-renderer';
2
4
  import { System } from '@eva/eva.js';
3
5
 
4
6
  declare const _default: {
@@ -25,9 +27,12 @@ declare interface StatsParams {
25
27
 
26
28
  export declare class StatsSystem extends System {
27
29
  static systemName: string;
30
+ app: Application;
31
+ renderSystem: RendererSystem;
28
32
  show: boolean;
29
33
  stats: any;
30
34
  style: any;
35
+ hook: any;
31
36
  component: Stats;
32
37
  init(param?: StatsParams): void;
33
38
  start(): void;
package/dist/plugin-stats.esm.js CHANGED
@@ -76,6 +76,8 @@ var Stats = function (style) {
76
76
  var beginTime = (performance || Date).now(), prevTime = beginTime, frames = 0;
77
77
  var fpsPanel = addPanel(Stats.Panel('FPS', '#0ff', '#002'));
78
78
  var msPanel = addPanel(Stats.Panel('MS', '#0f0', '#020'));
79
+ var dcPanel = addPanel(Stats.Panel('DrawCall', '#330570', '#A69700'));
80
+ var tcPanel = addPanel(Stats.Panel('TC:', '#A62500', '#00B454'));
79
81
  var memPanel;
80
82
  if (self.performance && self.performance.memory) {
81
83
  memPanel = addPanel(Stats.Panel('MB', '#f08', '#201'));
@@ -89,10 +91,14 @@ var Stats = function (style) {
89
91
  begin: function (time) {
90
92
  beginTime = time || (performance || Date).now();
91
93
  },
92
- end: function () {
94
+ end: function (hook) {
93
95
  frames++;
94
96
  var time = (performance || Date).now();
95
97
  msPanel.update(time - beginTime, 200);
98
+ if (hook) {
99
+ dcPanel.update(hook.deltaDrawCalls, Math.max(50, hook.maxDeltaDrawCalls));
100
+ tcPanel.update(hook.texturesCount, Math.max(20, hook.maxTextureCount));
101
+ }
96
102
  if (time >= prevTime + 1000) {
97
103
  fpsPanel.update((frames * 1000) / (time - prevTime), 100);
98
104
  prevTime = time;
@@ -151,6 +157,180 @@ Stats.Panel = function (name, fg, bg) {
151
157
  };
152
158
  var Stats$1 = Stats;
153
159
 
160
+ var GLHook = (function () {
161
+ function GLHook(_gl) {
162
+ this.drawPasses = 0;
163
+ this.isInit = false;
164
+ this.realGLDrawElements = function () { };
165
+ if (_gl) {
166
+ if (_gl.__proto__.drawElements) {
167
+ this.gl = _gl;
168
+ this.realGLDrawElements = _gl.__proto__.drawElements;
169
+ _gl.__proto__.drawElements = this.fakeGLdrawElements(this);
170
+ this.isInit = true;
171
+ }
172
+ }
173
+ else {
174
+ console.error("[GLHook] GL can't be NULL");
175
+ }
176
+ }
177
+ GLHook.prototype.fakeGLdrawElements = function (context) {
178
+ return function (mode, count, type, offset) {
179
+ context.drawPasses++;
180
+ context.realGLDrawElements.call(this, mode, count, type, offset);
181
+ };
182
+ };
183
+ GLHook.prototype.reset = function () {
184
+ this.drawPasses = 0;
185
+ };
186
+ GLHook.prototype.release = function () {
187
+ if (this.isInit) {
188
+ this.gl.__proto__.drawElements = this.realGLDrawElements;
189
+ }
190
+ this.isInit = false;
191
+ };
192
+ return GLHook;
193
+ }());
194
+
195
+ var TextureHook = (function () {
196
+ function TextureHook(_gl) {
197
+ this.createdTextures = new Array();
198
+ this.maxTexturesCount = 0;
199
+ this.isInit = false;
200
+ this.realGLCreateTexture = function () { };
201
+ this.realGLDeleteTexture = function () { };
202
+ if (_gl) {
203
+ if (_gl.__proto__.createTexture) {
204
+ this.gl = _gl;
205
+ this.realGLCreateTexture = _gl.__proto__.createTexture;
206
+ this.realGLDeleteTexture = _gl.__proto__.deleteTexture;
207
+ _gl.__proto__.createTexture = this.fakeGLCreateTexture(this);
208
+ _gl.__proto__.deleteTexture = this.fakeGLDeleteTexture(this);
209
+ this.isInit = true;
210
+ }
211
+ }
212
+ else {
213
+ console.error("[TextureHook] GL can't be NULL");
214
+ }
215
+ }
216
+ Object.defineProperty(TextureHook.prototype, "currentTextureCount", {
217
+ get: function () {
218
+ return this.createdTextures.length;
219
+ },
220
+ enumerable: false,
221
+ configurable: true
222
+ });
223
+ TextureHook.prototype.registerTexture = function (texture) {
224
+ this.createdTextures.push(texture);
225
+ this.maxTexturesCount = Math.max(this.createdTextures.length, this.maxTexturesCount);
226
+ };
227
+ TextureHook.prototype.fakeGLCreateTexture = function (context) {
228
+ return function () {
229
+ var texture = context.realGLCreateTexture.call(this);
230
+ context.registerTexture(texture);
231
+ return texture;
232
+ };
233
+ };
234
+ TextureHook.prototype.fakeGLDeleteTexture = function (context) {
235
+ return function (texture) {
236
+ var index = context.createdTextures.indexOf(texture);
237
+ if (index > -1) {
238
+ context.createdTextures.splice(index, 1);
239
+ }
240
+ context.realGLDeleteTexture.call(this, texture);
241
+ };
242
+ };
243
+ TextureHook.prototype.reset = function () {
244
+ this.createdTextures = new Array();
245
+ this.maxTexturesCount = 0;
246
+ };
247
+ TextureHook.prototype.release = function () {
248
+ if (this.isInit) {
249
+ this.gl.__proto__.createTexture = this.realGLCreateTexture;
250
+ this.gl.__proto__.deleteTexture = this.realGLDeleteTexture;
251
+ console.log('[TextureHook] Hook was removed!');
252
+ }
253
+ this.isInit = false;
254
+ };
255
+ return TextureHook;
256
+ }());
257
+
258
+ var BaseHooks = (function () {
259
+ function BaseHooks() {
260
+ this._drawCalls = -1;
261
+ this._maxDeltaDrawCalls = -1;
262
+ }
263
+ BaseHooks.prototype.attach = function (gl) {
264
+ this.glhook = new GLHook(gl);
265
+ this.texturehook = new TextureHook(gl);
266
+ };
267
+ Object.defineProperty(BaseHooks.prototype, "drawCalls", {
268
+ get: function () {
269
+ if (this.glhook && this.glhook.isInit) {
270
+ return this.glhook.drawPasses;
271
+ }
272
+ return -1;
273
+ },
274
+ enumerable: false,
275
+ configurable: true
276
+ });
277
+ Object.defineProperty(BaseHooks.prototype, "maxDeltaDrawCalls", {
278
+ get: function () {
279
+ return this._maxDeltaDrawCalls;
280
+ },
281
+ enumerable: false,
282
+ configurable: true
283
+ });
284
+ Object.defineProperty(BaseHooks.prototype, "deltaDrawCalls", {
285
+ get: function () {
286
+ if (this._drawCalls == -1) {
287
+ this._drawCalls = this.drawCalls;
288
+ return 0;
289
+ }
290
+ var dc = this.drawCalls;
291
+ var delta = dc - this._drawCalls;
292
+ this._drawCalls = dc;
293
+ this._maxDeltaDrawCalls = Math.max(this._maxDeltaDrawCalls, delta);
294
+ return delta;
295
+ },
296
+ enumerable: false,
297
+ configurable: true
298
+ });
299
+ Object.defineProperty(BaseHooks.prototype, "maxTextureCount", {
300
+ get: function () {
301
+ if (this.texturehook && this.texturehook.isInit)
302
+ return this.texturehook.maxTexturesCount;
303
+ return 0;
304
+ },
305
+ enumerable: false,
306
+ configurable: true
307
+ });
308
+ Object.defineProperty(BaseHooks.prototype, "texturesCount", {
309
+ get: function () {
310
+ if (this.texturehook && this.texturehook.isInit)
311
+ return this.texturehook.currentTextureCount;
312
+ return 0;
313
+ },
314
+ enumerable: false,
315
+ configurable: true
316
+ });
317
+ BaseHooks.prototype.reset = function () {
318
+ this._maxDeltaDrawCalls = -1;
319
+ this._drawCalls = -1;
320
+ if (this.glhook)
321
+ this.glhook.reset();
322
+ if (this.texturehook)
323
+ this.texturehook.reset();
324
+ };
325
+ BaseHooks.prototype.release = function () {
326
+ if (this.glhook)
327
+ this.glhook.release();
328
+ if (this.texturehook)
329
+ this.texturehook.release();
330
+ };
331
+ return BaseHooks;
332
+ }());
333
+
154
334
  var StatsSystem = (function (_super) {
155
335
  __extends(StatsSystem, _super);
156
336
  function StatsSystem() {
@@ -162,6 +342,13 @@ var StatsSystem = (function (_super) {
162
342
  if (param === void 0) { param = { show: true }; }
163
343
  this.show = param.show;
164
344
  this.style = param.style;
345
+ this.renderSystem = this.game.getSystem('Renderer');
346
+ this.app = this.renderSystem.application;
347
+ if (this.app && this.show) {
348
+ var gl = this.app.renderer.gl;
349
+ this.hook = new BaseHooks();
350
+ this.hook.attach(gl);
351
+ }
165
352
  };
166
353
  StatsSystem.prototype.start = function () {
167
354
  if (!this.show)
@@ -175,7 +362,7 @@ var StatsSystem = (function (_super) {
175
362
  StatsSystem.prototype.lateUpdate = function () {
176
363
  if (!this.show)
177
364
  return;
178
- this.stats && this.stats.end();
365
+ this.stats && this.stats.end(this.hook);
179
366
  };
180
367
  StatsSystem.systemName = 'Stats';
181
368
  return StatsSystem;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eva/plugin-stats",
3
- "version": "1.3.0-alpha.1",
3
+ "version": "2.0.0-beta.1",
4
4
  "description": "@eva/plugin-stats",
5
5
  "main": "index.js",
6
6
  "module": "dist/plugin-stats.esm.js",
@@ -18,7 +18,7 @@
18
18
  "license": "MIT",
19
19
  "homepage": "https://eva.js.org",
20
20
  "dependencies": {
21
- "@eva/eva.js": "1.3.0-alpha.1",
21
+ "@eva/eva.js": "2.0.0-beta.1",
22
22
  "lodash-es": "^4.17.21"
23
23
  }
24
24
  }