Disable view source for Developer Tools.
[chromium-blink-merge.git] / chrome / browser / resources / chromeos / network.js
blob49abd050c8e803d90998a1b66ee34a6b089dc81f
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.
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   ];
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   };
21   var LOG_LEVEL_CHECKBOX = {
22     'Error': 'log-error',
23     'User': 'log-user',
24     'Event': 'log-event',
25     'Debug': 'log-debug'
26   };
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   };
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   };
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   };
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   };
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   };
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   };
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   };
142   /**
143    * Sends a refresh request.
144    */
145   var sendRefresh = function() {
146     chrome.send('requestNetworkInfo');
147   }
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   };
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   });
177   return {
178     onNetworkInfoReceived: onNetworkInfoReceived
179   };
180 }();