Plumb AudioLogs into AudioOutputDispatcherImpl. Identify listings.

Adds plumbing for streams to show up in chrome://media-internals as
well as have them identified since the Controller and Stream pages
are so similar.

BUG=260005
TEST=Streams show up properly labeled.

Review URL: https://codereview.chromium.org/104983006

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@240748 0039d316-1c4b-4281-b951-d872f2087c98

2 files changed, 15 insertions, 4 deletions

diff --git a/content/browser/resources/media/client_renderer.js b/content/browser/resources/media/client_renderer.js
index 0db66c3..5cdedaa 100644
--- a/content/browser/resources/media/client_renderer.js
+++ b/content/browser/resources/media/client_renderer.js
@@ -9,6 +9,7 @@ var ClientRenderer = (function() {
         document.getElementById('property-table').querySelector('tbody');
     this.logTable = document.getElementById('log').querySelector('tbody');
     this.graphElement = document.getElementById('graphs');
+    this.propertyName = document.getElementById('property-name');
 
     this.selectedPlayer = null;
     this.selectedAudioComponentType = null;
@@ -126,9 +127,10 @@ var ClientRenderer = (function() {
         var fragment = document.createDocumentFragment();
         for (id in components) {
           var li = document.createElement('li');
+          var friendlyName = baseName + ' ' + id;
           li.appendChild(createButton(
-              baseName + ' ' + id, renderer.selectAudioComponent_.bind(
-                  renderer, componentType, id, components[id])));
+              friendlyName, renderer.selectAudioComponent_.bind(
+                  renderer, componentType, id, components[id], friendlyName)));
           fragment.appendChild(li);
         }
         removeChildren(element);
@@ -153,7 +155,8 @@ var ClientRenderer = (function() {
       }
     },
 
-    selectAudioComponent_: function(componentType, componentId, componentData) {
+    selectAudioComponent_: function(
+          componentType, componentId, componentData, friendlyName) {
       this.selectedPlayer = null;
       this.selectedAudioComponentType = componentType;
       this.selectedAudioComponentId = componentId;
@@ -161,6 +164,9 @@ var ClientRenderer = (function() {
       this.drawProperties_(componentData);
       removeChildren(this.logTable);
       removeChildren(this.graphElement);
+
+      removeChildren(this.propertyName);
+      this.propertyName.appendChild(document.createTextNode(friendlyName));
     },
 
     redrawPlayerList_: function(players) {
@@ -192,6 +198,8 @@ var ClientRenderer = (function() {
       removeChildren(this.graphElement);
       this.drawLog_();
       this.drawGraphs_();
+      removeChildren(this.propertyName);
+      this.propertyName.appendChild(document.createTextNode('Player'));
     },
 
     drawProperties_: function(propertyMap) {
diff --git a/content/browser/resources/media/media_internals.html b/content/browser/resources/media/media_internals.html
index c555096..1f76230 100644
--- a/content/browser/resources/media/media_internals.html
+++ b/content/browser/resources/media/media_internals.html
@@ -34,7 +34,10 @@ found in the LICENSE file.
       </div>
     </div>
     <div id="property-wrapper">
-      <h2>Properties <button id="copy-button">copy to clipboard</button> </h2>
+      <h2>
+        <span id="property-name"></span> Properties
+        <button id="copy-button">copy to clipboard</button>
+      </h2>
       <table id="property-table">
         <thead>
           <tr>