content/browser/resources/media/peer_connection_update_table.js

   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  * The data of a peer connection update.
   8  * @param {number} pid The id of the renderer.
   9  * @param {number} lid The id of the peer conneciton inside a renderer.
  10  * @param {string} type The type of the update.
  11  * @param {string} value The details of the update.
  12  * @constructor
  13  */
  14 var PeerConnectionUpdateEntry = function(pid, lid, type, value) {
  15   /**
  16    * @type {number}
  17    */
  18   this.pid = pid;
  19
  20   /**
  21    * @type {number}
  22    */
  23   this.lid = lid;
  24
  25   /**
  26    * @type {string}
  27    */
  28   this.type = type;
  29
  30   /**
  31    * @type {string}
  32    */
  33   this.value = value;
  34 };
  35
  36
  37 /**
  38  * Maintains the peer connection update log table.
  39  */
  40 var PeerConnectionUpdateTable = (function() {
  41   'use strict';
  42
  43   /**
  44    * @constructor
  45    */
  46   function PeerConnectionUpdateTable() {
  47     /**
  48      * @type {string}
  49      * @const
  50      * @private
  51      */
  52     this.UPDATE_LOG_ID_SUFFIX_ = '-update-log';
  53
  54     /**
  55      * @type {string}
  56      * @const
  57      * @private
  58      */
  59     this.UPDATE_LOG_CONTAINER_CLASS_ = 'update-log-container';
  60
  61     /**
  62      * @type {string}
  63      * @const
  64      * @private
  65      */
  66     this.UPDATE_LOG_TABLE_CLASS = 'update-log-table';
  67   }
  68
  69   PeerConnectionUpdateTable.prototype = {
  70     /**
  71      * Adds the update to the update table as a new row. The type of the update
  72      * is set to the summary of the cell; clicking the cell will reveal or hide
  73      * the details as the content of a TextArea element.
  74      *
  75      * @param {!Element} peerConnectionElement The root element.
  76      * @param {!PeerConnectionUpdateEntry} update The update to add.
  77      */
  78     addPeerConnectionUpdate: function(peerConnectionElement, update) {
  79       var tableElement = this.ensureUpdateContainer_(peerConnectionElement);
  80
  81       var row = document.createElement('tr');
  82       tableElement.firstChild.appendChild(row);
  83
  84       var time = new Date(parseFloat(update.time));
  85       row.innerHTML = '<td>' + time.toLocaleString() + '</td>';
  86
  87       if (update.value.length == 0) {
  88         row.innerHTML += '<td>' + update.type + '</td>';
  89         return;
  90       }
  91
  92       row.innerHTML += '<td><details><summary>' + update.type +
  93           '</summary></details></td>';
  94
  95       var valueContainer = document.createElement('pre');
  96       var details = row.cells[1].childNodes[0];
  97       details.appendChild(valueContainer);
  98       valueContainer.textContent = update.value;
  99     },
 100
 101     /**
 102      * Makes sure the update log table of the peer connection is created.
 103      *
 104      * @param {!Element} peerConnectionElement The root element.
 105      * @return {!Element} The log table element.
 106      * @private
 107      */
 108     ensureUpdateContainer_: function(peerConnectionElement) {
 109       var tableId = peerConnectionElement.id + this.UPDATE_LOG_ID_SUFFIX_;
 110       var tableElement = $(tableId);
 111       if (!tableElement) {
 112         var tableContainer = document.createElement('div');
 113         tableContainer.className = this.UPDATE_LOG_CONTAINER_CLASS_;
 114         peerConnectionElement.appendChild(tableContainer);
 115
 116         tableElement = document.createElement('table');
 117         tableElement.className = this.UPDATE_LOG_TABLE_CLASS;
 118         tableElement.id = tableId;
 119         tableElement.border = 1;
 120         tableContainer.appendChild(tableElement);
 121         tableElement.innerHTML = '<tr><th>Time</th>' +
 122             '<th class="update-log-header-event">Event</th></tr>';
 123       }
 124       return tableElement;
 125     }
 126   };
 127
 128   return PeerConnectionUpdateTable;
 129 })();