Display active media players on chrome://media-internals.

chrome/browser/resources/media_internals/metrics.js

Index: chrome/browser/resources/media_internals/metrics.js
diff --git a/chrome/browser/resources/media_internals/metrics.js b/chrome/browser/resources/media_internals/metrics.js
new file mode 100644
index 0000000000000000000000000000000000000000..9860866b2f06b91969547785eaabfbcf5aba291c
--- /dev/null
+++ b/chrome/browser/resources/media_internals/metrics.js
@@ -0,0 +1,98 @@
+// Copyright (c) 2011 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+cr.define('media', function() {
+
+  // A set of parameter names. An entry of 'abc' allows metrics to specify
+  // events with specific values of 'abc'.
+  metricProperties = {

[arv (Not doing code reviews), 2011/08/16 19:29:03]

missing vars again

[Scott Franklin, 2011/08/16 23:33:52]

Done.

+    'pipeline_state': true,
+  };
+
+  // A set of metrics to measure. The user will see the most recent and average
+  // measurement of the time between each metric's start and end events.
+  metrics = {
+    'seek': {'start': 'SEEK',
+             'end': 'pipeline_state=started'},
+    'first frame': {'start': 'WEBMEDIAPLAYER_CREATED',
+                    'end': 'pipeline_state=started'},
+  };
+
+  /**
+   * This class measures times between the events specified above. It exposes
+   * this.li, a <li> element containing a table that displays the measurements.
+   */
+  function Metrics() {
+    this.table_ = document.createElement('table');
+    this.li = createDetailsLi();
+    this.li.details.appendChild(this.table_);
+    this.li.summary.textContent = 'Metrics:';
+
+    var hrow = document.createElement('tr');
+    hrow.appendChild(makeElement('th', 'Metric:'));
+    hrow.appendChild(makeElement('th', 'Last Measure:'));
+    hrow.appendChild(makeElement('th', 'Average:'));
+    var header = document.createElement('thead');
+    header.appendChild(hrow);
+    this.table_.appendChild(header);
+
+    for (var metric in metrics) {
+      var last = document.createElement('td');
+      var avg = document.createElement('td');
+      this[metric] = {'count': 0, 'total': 0, 'start': null,
+                      'last': last, 'avg': avg};
+      var row = document.createElement('tr');
+      row.appendChild(makeElement('td', metric + ':'));
+      row.appendChild(last);
+      row.appendChild(avg);
+      this.table_.appendChild(row);
+    }
+  };
+
+  Metrics.prototype = {
+
+    /**
+     * An event has occurred. Update any metrics that refer to this type
+     * of event. Can be called multiple times by addEvent below if the metrics
+     * refer to specific parameters.
+     * @param {Object} event The MediaLogEvent that has occurred.
+     * @param {string} type The type of event.
+     */
+    addEventInternal: function(event, type) {
+      for (var metric in metrics) {
+        var m = this[metric];
+        if (type == metrics[metric].start && !m.start) {
+          m.start = event.time;
+        } else if (type == metrics[metric].end && m.start != null) {
+          var last = event.time - m.start;
+          m.last.textContent = media.round(last);
+          m.total += last;
+          m.count++;
+          if (m.count > 1)
+            m.avg.textContent = round(m.total / m.count);
+          m.start = null;
+        }
+      }
+    },
+
+    /**
+     * An event has occurred. Update any metrics that refer to events of this
+     * type or with this events parameters.
+     * @param {Object} event The MediaLogEvent that has occurred.
+     */
+    addEvent: function(event) {
+      this.addEventInternal(event, event.type);
+      for (var p in event.params) {
+        if (p in metricProperties) {
+          var type = p + '=' + event.params[p];
+          this.addEventInternal(event, type);
+        }
+      }
+    },
+  };
+
+  return {
+      Metrics: Metrics,
+  };
+});