src/chrome/browser/resources/chromeos/network.js

   1 // Copyright 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 var NetworkUI = function() {
   6   // Properties to display in the network state table
   7   var NETWORK_STATE_FIELDS = [
   8     'Name', 'Type', 'State', 'Profile', 'Connectable',
   9     'Error', 'Address', 'Security', 'Cellular.NetworkTechnology',
  10     'Cellular.ActivationState', 'Cellular.RoamingState',
  11     'Cellular.OutOfCredits', 'Strength'
  12   ];
  13
  14   var LOG_LEVEL_CLASSNAME = {
  15     'Error': 'network-log-level-error',
  16     'User': 'network-log-level-user',
  17     'Event': 'network-log-level-event',
  18     'Debug': 'network-log-level-debug'
  19   };
  20
  21   var LOG_LEVEL_CHECKBOX = {
  22     'Error': 'log-error',
  23     'User': 'log-user',
  24     'Event': 'log-event',
  25     'Debug': 'log-debug'
  26   };
  27
  28   /**
  29    * Create a tag of log level.
  30    *
  31    * @param {string} level A string that represents log level.
  32    * @return {DOMElement} The created span element.
  33    */
  34   var createLevelTag = function(level) {
  35     var tag = document.createElement('span');
  36     tag.className = 'network-level-tag';
  37     tag.textContent = level;
  38     tag.classList.add(LOG_LEVEL_CLASSNAME[level]);
  39     return tag;
  40   };
  41
  42   /**
  43    * Creates an element that contains the time, the event, the level and
  44    * the description of the given log entry.
  45    *
  46    * @param {Object} logEntry An object that represents a single line of log.
  47    * @return {DOMElement}  The created p element that represents the log entry.
  48    */
  49   var createLogEntryText = function(logEntry) {
  50     var level = logEntry['level'];
  51     if (!$(LOG_LEVEL_CHECKBOX[level]).checked)
  52       return null;
  53     var res = document.createElement('p');
  54     var textWrapper = document.createElement('span');
  55     var fileinfo = '';
  56     if ($('log-fileinfo').checked)
  57       fileinfo = logEntry['file'];
  58     textWrapper.textContent = loadTimeData.getStringF(
  59       'logEntryFormat',
  60       logEntry['timestamp'],
  61       fileinfo,
  62       logEntry['event'],
  63       logEntry['description']);
  64     res.appendChild(createLevelTag(level));
  65     res.appendChild(textWrapper);
  66     return res;
  67   };
  68
  69   /**
  70    * Create event log entries.
  71    *
  72    * @param {Array.<string>} logEntries A array of strings that each string
  73    *     represents a log event in JSON format.
  74    */
  75   var createEventLog = function(logEntries) {
  76     var container = $('network-log-container');
  77     container.textContent = '';
  78     for (var i = 0; i < logEntries.length; ++i) {
  79       var entry = createLogEntryText(JSON.parse(logEntries[i]));
  80       if (entry)
  81         container.appendChild(entry);
  82     }
  83   };
  84
  85   /**
  86    * Create a cell in network state table.
  87    *
  88    * @param {string} value Content in the cell.
  89    * @return {DOMElement} The created td element that displays the given value.
  90    */
  91   var createStatusTableCell = function(value) {
  92     var col = document.createElement('td');
  93     col.textContent = value || '';
  94     return col;
  95   };
  96
  97   /**
  98    * Create a row in the network state table.
  99    *
 100    * @param {string} path The network path.
 101    * @param {dictionary} status Properties of the network.
 102    * @return {DOMElement} The created tr element that contains the network
 103    *     state information.
 104    */
 105   var createStatusTableRow = function(path, status) {
 106     var row = document.createElement('tr');
 107     row.className = 'network-status-table-row';
 108     row.appendChild(createStatusTableCell(path));
 109     row.appendChild(createStatusTableCell(status['GUID'].slice(1, 9)));
 110     for (var i = 0; i < NETWORK_STATE_FIELDS.length; ++i) {
 111       row.appendChild(createStatusTableCell(status[NETWORK_STATE_FIELDS[i]]));
 112     }
 113     return row;
 114   };
 115
 116   /**
 117    * Create network state table.
 118    *
 119    * @param {Array.<Object>} networkStatuses An array of network states.
 120    */
 121   var createNetworkTable = function(networkStatuses) {
 122     var table = $('network-status-table');
 123     var oldRows = table.querySelectorAll('.network-status-table-row');
 124     for (var i = 0; i < oldRows.length; ++i)
 125       table.removeChild(oldRows[i]);
 126     for (var path in networkStatuses)
 127       table.appendChild(
 128           createStatusTableRow(path, networkStatuses[path]));
 129   };
 130
 131   /**
 132    * This callback function is triggered when the data is received.
 133    *
 134    * @param {dictionary} data A dictionary that contains network state
 135    *     information.
 136    */
 137   var onNetworkInfoReceived = function(data) {
 138     createEventLog(JSON.parse(data.networkEventLog));
 139     createNetworkTable(data.networkState);
 140   };
 141
 142   /**
 143    * Sends a refresh request.
 144    */
 145   var sendRefresh = function() {
 146     chrome.send('requestNetworkInfo');
 147   }
 148
 149   /**
 150    * Sets refresh rate if the interval is found in the url.
 151    */
 152   var setRefresh = function() {
 153     var interval = parseQueryParams(window.location)['refresh'];
 154     if (interval && interval != '')
 155       setInterval(sendRefresh, parseInt(interval) * 1000);
 156   };
 157
 158   /**
 159    * Get network information from WebUI.
 160    */
 161   document.addEventListener('DOMContentLoaded', function() {
 162     $('log-refresh').onclick = sendRefresh;
 163     $('log-error').checked = true;
 164     $('log-error').onclick = sendRefresh;
 165     $('log-user').checked = true;
 166     $('log-user').onclick = sendRefresh;
 167     $('log-event').checked = true;
 168     $('log-event').onclick = sendRefresh;
 169     $('log-debug').checked = false;
 170     $('log-debug').onclick = sendRefresh;
 171     $('log-fileinfo').checked = false;
 172     $('log-fileinfo').onclick = sendRefresh;
 173     setRefresh();
 174     sendRefresh();
 175   });
 176
 177   return {
 178     onNetworkInfoReceived: onNetworkInfoReceived
 179   };
 180 }();