1
// Copyright 2011 The Closure Library Authors. All Rights Reserved.
2
//
3
// Licensed under the Apache License, Version 2.0 (the "License");
4
// you may not use this file except in compliance with the License.
5
// You may obtain a copy of the License at
6
//
7
//      http://www.apache.org/licenses/LICENSE-2.0
8
//
9
// Unless required by applicable law or agreed to in writing, software
10
// distributed under the License is distributed on an "AS-IS" BASIS,
11
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12
// See the License for the specific language governing permissions and
13
// limitations under the License.
14

15
/**
16
 * @fileoverview Displays frames per second (FPS) for the current window.
17
 * Only supported in browsers that support requestAnimationFrame.
18
 * See: https://developer.mozilla.org/en/DOM/window.requestAnimationFrame.
19
 *
20
 * @see ../demos/fpsdisplay.html
21
 */
22

23
goog.provide('goog.debug.FpsDisplay');
24

25
goog.require('goog.asserts');
26
goog.require('goog.async.AnimationDelay');
27
goog.require('goog.dom');
28
goog.require('goog.dom.TagName');
29
goog.require('goog.ui.Component');
30

31

32

33
/**
34
 * Displays frames per seconds that the window this component is
35
 * rendered in is animating at.
36
 *
37
 * @param {goog.dom.DomHelper=} opt_domHelper An optional dom helper.
38
 * @constructor
39
 * @extends {goog.ui.Component}
40
 * @final
41
 */
42
goog.debug.FpsDisplay = function(opt_domHelper) {
43
  goog.debug.FpsDisplay.base(this, 'constructor', opt_domHelper);
44
};
45
goog.inherits(goog.debug.FpsDisplay, goog.ui.Component);
46

47

48
/**
49
 * CSS class for the FPS display.
50
 */
51
goog.debug.FpsDisplay.CSS = goog.getCssName('goog-fps-display');
52

53

54
/**
55
 * The number of samples per FPS report.
56
 */
57
goog.debug.FpsDisplay.SAMPLES = 10;
58

59

60
/**
61
 * The current animation.
62
 * @type {goog.debug.FpsDisplay.FpsAnimation_}
63
 * @private
64
 */
65
goog.debug.FpsDisplay.prototype.animation_ = null;
66

67

68
/** @override */
69
goog.debug.FpsDisplay.prototype.createDom = function() {
70
  this.setElementInternal(
71
      this.getDomHelper().createDom(
72
          goog.dom.TagName.DIV, goog.debug.FpsDisplay.CSS));
73
};
74

75

76
/** @override */
77
goog.debug.FpsDisplay.prototype.enterDocument = function() {
78
  goog.debug.FpsDisplay.base(this, 'enterDocument');
79
  this.animation_ = new goog.debug.FpsDisplay.FpsAnimation_(this.getElement());
80
  this.delay_ = new goog.async.AnimationDelay(
81
      this.handleDelay_, this.getDomHelper().getWindow(), this);
82
  this.delay_.start();
83
};
84

85

86
/**
87
 * @param {number} now The current time.
88
 * @private
89
 */
90
goog.debug.FpsDisplay.prototype.handleDelay_ = function(now) {
91
  if (this.isInDocument()) {
92
    this.animation_.onAnimationFrame(now);
93
    this.delay_.start();
94
  }
95
};
96

97

98
/** @override */
99
goog.debug.FpsDisplay.prototype.exitDocument = function() {
100
  goog.debug.FpsDisplay.base(this, 'exitDocument');
101
  this.animation_ = null;
102
  goog.dispose(this.delay_);
103
};
104

105

106
/**
107
 * @return {number} The average frames per second.
108
 */
109
goog.debug.FpsDisplay.prototype.getFps = function() {
110
  goog.asserts.assert(
111
      this.isInDocument(), 'Render the FPS display before querying FPS');
112
  return this.animation_.lastFps_;
113
};
114

115

116

117
/**
118
 * @param {Element} elem An element to hold the FPS count.
119
 * @constructor
120
 * @private
121
 */
122
goog.debug.FpsDisplay.FpsAnimation_ = function(elem) {
123
  /**
124
   * An element to hold the current FPS rate.
125
   * @type {Element}
126
   * @private
127
   */
128
  this.element_ = elem;
129

130
  /**
131
   * The number of frames observed so far.
132
   * @type {number}
133
   * @private
134
   */
135
  this.frameNumber_ = 0;
136
};
137

138

139
/**
140
 * The last time which we reported FPS at.
141
 * @type {number}
142
 * @private
143
 */
144
goog.debug.FpsDisplay.FpsAnimation_.prototype.lastTime_ = 0;
145

146

147
/**
148
 * The last average FPS.
149
 * @type {number}
150
 * @private
151
 */
152
goog.debug.FpsDisplay.FpsAnimation_.prototype.lastFps_ = -1;
153

154

155
/**
156
 * @param {number} now The current time.
157
 */
158
goog.debug.FpsDisplay.FpsAnimation_.prototype.onAnimationFrame = function(now) {
159
  var SAMPLES = goog.debug.FpsDisplay.SAMPLES;
160
  if (this.frameNumber_ % SAMPLES == 0) {
161
    this.lastFps_ = Math.round((1000 * SAMPLES) / (now - this.lastTime_));
162
    goog.dom.setTextContent(this.element_, this.lastFps_);
163
    this.lastTime_ = now;
164
  }
165
  this.frameNumber_++;
166
};
167

168