1 // Copyright (c) 2013 The Chromium Authors. All rights reserved. 2 // Use of this source code is governed by a BSD-style license that can be 3 // found in the LICENSE file. 4 5 6 /** 7 * Maintains the stats table. 8 * @param {SsrcInfoManager} ssrcInfoManager The source of the ssrc info. 9 */ 10 var StatsTable = (function(ssrcInfoManager) { 11 'use strict'; 12 13 /** 14 * @param {SsrcInfoManager} ssrcInfoManager The source of the ssrc info. 15 * @constructor 16 */ 17 function StatsTable(ssrcInfoManager) { 18 /** 19 * @type {SsrcInfoManager} 20 * @private 21 */ 22 this.ssrcInfoManager_ = ssrcInfoManager; 23 } 24 25 StatsTable.prototype = { 26 /** 27 * Adds |report| to the stats table of |peerConnectionElement|. 28 * 29 * @param {!Element} peerConnectionElement The root element. 30 * @param {!Object} report The object containing stats, which is the object 31 * containing timestamp and values, which is an array of strings, whose 32 * even index entry is the name of the stat, and the odd index entry is 33 * the value. 34 */ 35 addStatsReport: function(peerConnectionElement, report) { 36 var statsTable = this.ensureStatsTable_(peerConnectionElement, report); 37 38 if (report.stats) { 39 this.addStatsToTable_(statsTable, 40 report.stats.timestamp, report.stats.values); 41 } 42 }, 43 44 /** 45 * Ensure the DIV container for the stats tables is created as a child of 46 * |peerConnectionElement|. 47 * 48 * @param {!Element} peerConnectionElement The root element. 49 * @return {!Element} The stats table container. 50 * @private 51 */ 52 ensureStatsTableContainer_: function(peerConnectionElement) { 53 var containerId = peerConnectionElement.id + '-table-container'; 54 var container = $(containerId); 55 if (!container) { 56 container = document.createElement('div'); 57 container.id = containerId; 58 container.className = 'stats-table-container'; 59 var head = document.createElement('div'); 60 head.textContent = 'Stats Tables'; 61 container.appendChild(head); 62 peerConnectionElement.appendChild(container); 63 } 64 return container; 65 }, 66 67 /** 68 * Ensure the stats table for track specified by |report| of PeerConnection 69 * |peerConnectionElement| is created. 70 * 71 * @param {!Element} peerConnectionElement The root element. 72 * @param {!Object} report The object containing stats, which is the object 73 * containing timestamp and values, which is an array of strings, whose 74 * even index entry is the name of the stat, and the odd index entry is 75 * the value. 76 * @return {!Element} The stats table element. 77 * @private 78 */ 79 ensureStatsTable_: function(peerConnectionElement, report) { 80 var tableId = peerConnectionElement.id + '-table-' + report.id; 81 var table = $(tableId); 82 if (!table) { 83 var container = this.ensureStatsTableContainer_(peerConnectionElement); 84 var details = document.createElement('details'); 85 container.appendChild(details); 86 var summary = document.createElement('summary'); 87 summary.textContent = report.id; 88 details.appendChild(summary); 89 90 table = document.createElement('table'); 91 details.appendChild(table); 92 table.id = tableId; 93 table.border = 1; 94 95 table.innerHTML = '<tr><th colspan=2></th></tr>'; 96 table.rows[0].cells[0].textContent = 'Statistics ' + report.id; 97 if (report.type == 'ssrc') { 98 table.insertRow(1); 99 table.rows[1].innerHTML = '<td colspan=2></td>'; 100 this.ssrcInfoManager_.populateSsrcInfo( 101 table.rows[1].cells[0], GetSsrcFromReport(report)); 102 } 103 } 104 return table; 105 }, 106 107 /** 108 * Update |statsTable| with |time| and |statsData|. 109 * 110 * @param {!Element} statsTable Which table to update. 111 * @param {number} time The number of miliseconds since epoch. 112 * @param {Array.<string>} statsData An array of stats name and value pairs. 113 * @private 114 */ 115 addStatsToTable_: function(statsTable, time, statsData) { 116 var date = Date(time); 117 this.updateStatsTableRow_(statsTable, 'timestamp', date.toLocaleString()); 118 for (var i = 0; i < statsData.length - 1; i = i + 2) { 119 this.updateStatsTableRow_(statsTable, statsData[i], statsData[i + 1]); 120 } 121 }, 122 123 /** 124 * Update the value column of the stats row of |rowName| to |value|. 125 * A new row is created is this is the first report of this stats. 126 * 127 * @param {!Element} statsTable Which table to update. 128 * @param {string} rowName The name of the row to update. 129 * @param {string} value The new value to set. 130 * @private 131 */ 132 updateStatsTableRow_: function(statsTable, rowName, value) { 133 var trId = statsTable.id + '-' + rowName; 134 var trElement = $(trId); 135 if (!trElement) { 136 trElement = document.createElement('tr'); 137 trElement.id = trId; 138 statsTable.firstChild.appendChild(trElement); 139 trElement.innerHTML = '<td>' + rowName + '</td><td></td>'; 140 } 141 trElement.cells[1].textContent = value; 142 } 143 }; 144 145 return StatsTable; 146 })(); 147
