OLD | NEW |
1 // Copyright 2013 The Chromium Authors. All rights reserved. | 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 | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 var NetworkUI = (function() { | 5 var NetworkUI = (function() { |
6 'use strict'; | 6 'use strict'; |
7 | 7 |
8 // Properties to display in the network state table. Each entry can be either | 8 // Properties to display in the network state table. Each entry can be either |
9 // a single state field or an array of state fields. If more than one is | 9 // a single state field or an array of state fields. If more than one is |
10 // specified then the first non empty value is used. | 10 // specified then the first non empty value is used. |
(...skipping 18 matching lines...) Expand all Loading... |
29 'GUID', | 29 'GUID', |
30 'service_path', | 30 'service_path', |
31 'Name', | 31 'Name', |
32 'Type', | 32 'Type', |
33 'profile_path', | 33 'profile_path', |
34 'visible', | 34 'visible', |
35 'onc_source' | 35 'onc_source' |
36 ]; | 36 ]; |
37 | 37 |
38 /** | 38 /** |
39 * Create a cell with a button for expanding a network state table row. | 39 * Returns the property associated with a key (which may reference a |
| 40 * sub-object). |
| 41 * |
| 42 * @param {Object} properties The object containing the network properties. |
| 43 * @param {string} key The ONC key for the property. May refer to a nested |
| 44 * propety, e.g. 'WiFi.Security'. |
| 45 * @return {*} The value associated with the property. |
| 46 */ |
| 47 var getValueFromProperties = function(properties, key) { |
| 48 if (!key) { |
| 49 console.error('Empty key'); |
| 50 return undefined; |
| 51 } |
| 52 var dot = key.indexOf('.'); |
| 53 if (dot > 0) { |
| 54 var key1 = key.substring(0, dot); |
| 55 var key2 = key.substring(dot + 1); |
| 56 var subobject = properties[key1]; |
| 57 if (subobject) |
| 58 return getValueFromProperties(subobject, key2); |
| 59 } |
| 60 return properties[key]; |
| 61 }; |
| 62 |
| 63 /** |
| 64 * Creates a cell with a button for expanding a network state table row. |
40 * | 65 * |
41 * @param {string} guid The GUID identifying the network. | 66 * @param {string} guid The GUID identifying the network. |
42 * @return {DOMElement} The created td element that displays the given value. | 67 * @return {DOMElement} The created td element that displays the given value. |
43 */ | 68 */ |
44 var createStateTableExpandButton = function(guid) { | 69 var createStateTableExpandButton = function(guid) { |
45 var cell = document.createElement('td'); | 70 var cell = document.createElement('td'); |
46 cell.className = 'state-table-expand-button-cell'; | 71 cell.className = 'state-table-expand-button-cell'; |
47 var button = document.createElement('button'); | 72 var button = document.createElement('button'); |
48 button.addEventListener('click', function(event) { | 73 button.addEventListener('click', function(event) { |
49 toggleExpandRow(event.target, guid); | 74 toggleExpandRow(event.target, guid); |
50 }); | 75 }); |
51 button.className = 'state-table-expand-button'; | 76 button.className = 'state-table-expand-button'; |
52 button.textContent = '+'; | 77 button.textContent = '+'; |
53 cell.appendChild(button); | 78 cell.appendChild(button); |
54 return cell; | 79 return cell; |
55 }; | 80 }; |
56 | 81 |
57 /** | 82 /** |
58 * Create a cell in network state table. | 83 * Creates a cell in network state table. |
59 * | 84 * |
60 * @param {string} value Content in the cell. | 85 * @param {string} value Content in the cell. |
61 * @return {DOMElement} The created td element that displays the given value. | 86 * @return {DOMElement} The created td element that displays the given value. |
62 */ | 87 */ |
63 var createStateTableCell = function(value) { | 88 var createStateTableCell = function(value) { |
64 var cell = document.createElement('td'); | 89 var cell = document.createElement('td'); |
65 cell.textContent = value || ''; | 90 cell.textContent = value || ''; |
66 return cell; | 91 return cell; |
67 }; | 92 }; |
68 | 93 |
69 /** | 94 /** |
70 * Create a row in the network state table. | 95 * Creates a row in the network state table. |
71 * | 96 * |
72 * @param {Array} stateFields The state fields to use for the row. | 97 * @param {Array} stateFields The state fields to use for the row. |
73 * @param {Object} state Property values for the network or favorite. | 98 * @param {Object} state Property values for the network or favorite. |
74 * @return {DOMElement} The created tr element that contains the network | 99 * @return {DOMElement} The created tr element that contains the network |
75 * state information. | 100 * state information. |
76 */ | 101 */ |
77 var createStateTableRow = function(stateFields, state) { | 102 var createStateTableRow = function(stateFields, state) { |
78 var row = document.createElement('tr'); | 103 var row = document.createElement('tr'); |
79 row.className = 'state-table-row'; | 104 row.className = 'state-table-row'; |
80 var guid = state.GUID; | 105 var guid = state.GUID; |
81 row.appendChild(createStateTableExpandButton(guid)); | 106 row.appendChild(createStateTableExpandButton(guid)); |
82 for (var i = 0; i < stateFields.length; ++i) { | 107 for (var i = 0; i < stateFields.length; ++i) { |
83 var field = stateFields[i]; | 108 var field = stateFields[i]; |
84 var value = ''; | 109 var value = ''; |
85 if (typeof field == 'string') { | 110 if (typeof field == 'string') { |
86 value = networkConfig.getValueFromProperties(state, field); | 111 value = getValueFromProperties(state, field); |
87 } else { | 112 } else { |
88 for (var j = 0; j < field.length; ++j) { | 113 for (var j = 0; j < field.length; ++j) { |
89 value = networkConfig.getValueFromProperties(state, field[j]); | 114 value = getValueFromProperties(state, field[j]); |
90 if (value) | 115 if (value) |
91 break; | 116 break; |
92 } | 117 } |
93 } | 118 } |
94 if (field == 'GUID') | 119 if (field == 'GUID') |
95 value = value.slice(0, 8); | 120 value = value.slice(0, 8); |
96 row.appendChild(createStateTableCell(value)); | 121 row.appendChild(createStateTableCell(value)); |
97 } | 122 } |
98 return row; | 123 return row; |
99 }; | 124 }; |
100 | 125 |
101 /** | 126 /** |
102 * Create table for networks or favorites. | 127 * Creates a table for networks or favorites. |
103 * | 128 * |
104 * @param {string} tablename The name of the table to be created. | 129 * @param {string} tablename The name of the table to be created. |
105 * @param {Array} stateFields The list of fields for the table. | 130 * @param {Array} stateFields The list of fields for the table. |
106 * @param {Array} states An array of network or favorite states. | 131 * @param {Array} states An array of network or favorite states. |
107 */ | 132 */ |
108 var createStateTable = function(tablename, stateFields, states) { | 133 var createStateTable = function(tablename, stateFields, states) { |
109 var table = $(tablename); | 134 var table = $(tablename); |
110 var oldRows = table.querySelectorAll('.state-table-row'); | 135 var oldRows = table.querySelectorAll('.state-table-row'); |
111 for (var i = 0; i < oldRows.length; ++i) | 136 for (var i = 0; i < oldRows.length; ++i) |
112 table.removeChild(oldRows[i]); | 137 table.removeChild(oldRows[i]); |
(...skipping 16 matching lines...) Expand all Loading... |
129 * This callback function is triggered when favorite networks are received. | 154 * This callback function is triggered when favorite networks are received. |
130 * | 155 * |
131 * @param {Object} data A list of network state information for each | 156 * @param {Object} data A list of network state information for each |
132 * favorite network. | 157 * favorite network. |
133 */ | 158 */ |
134 var onFavoriteNetworksReceived = function(states) { | 159 var onFavoriteNetworksReceived = function(states) { |
135 createStateTable('favorite-state-table', FAVORITE_STATE_FIELDS, states); | 160 createStateTable('favorite-state-table', FAVORITE_STATE_FIELDS, states); |
136 }; | 161 }; |
137 | 162 |
138 /** | 163 /** |
139 * Toggle the button state and add or remove a row displaying the complete | 164 * Toggles the button state and add or remove a row displaying the complete |
140 * state information for a row. | 165 * state information for a row. |
141 * | 166 * |
142 * @param {DOMElement} btn The button that was clicked. | 167 * @param {DOMElement} btn The button that was clicked. |
143 * @param {string} guid GUID identifying the network. | 168 * @param {string} guid GUID identifying the network. |
144 */ | 169 */ |
145 var toggleExpandRow = function(btn, guid) { | 170 var toggleExpandRow = function(btn, guid) { |
146 var cell = btn.parentNode; | 171 var cell = btn.parentNode; |
147 var row = cell.parentNode; | 172 var row = cell.parentNode; |
148 if (btn.textContent == '-') { | 173 if (btn.textContent == '-') { |
149 btn.textContent = '+'; | 174 btn.textContent = '+'; |
(...skipping 12 matching lines...) Expand all Loading... |
162 * @param {DOMElement} baseRow The unexpanded row associated with the new row. | 187 * @param {DOMElement} baseRow The unexpanded row associated with the new row. |
163 * @return {DOMElement} The created tr element for the expanded row. | 188 * @return {DOMElement} The created tr element for the expanded row. |
164 */ | 189 */ |
165 var createExpandedRow = function(guid, baseRow) { | 190 var createExpandedRow = function(guid, baseRow) { |
166 var expandedRow = document.createElement('tr'); | 191 var expandedRow = document.createElement('tr'); |
167 expandedRow.className = 'state-table-row'; | 192 expandedRow.className = 'state-table-row'; |
168 var emptyCell = document.createElement('td'); | 193 var emptyCell = document.createElement('td'); |
169 emptyCell.style.border = 'none'; | 194 emptyCell.style.border = 'none'; |
170 expandedRow.appendChild(emptyCell); | 195 expandedRow.appendChild(emptyCell); |
171 var detailCell = document.createElement('td'); | 196 var detailCell = document.createElement('td'); |
| 197 detailCell.id = guid; |
172 detailCell.className = 'state-table-expanded-cell'; | 198 detailCell.className = 'state-table-expanded-cell'; |
173 detailCell.colSpan = baseRow.childNodes.length - 1; | 199 detailCell.colSpan = baseRow.childNodes.length - 1; |
174 expandedRow.appendChild(detailCell); | 200 expandedRow.appendChild(detailCell); |
175 var showDetail = function(state) { | 201 var showDetail = function(state, error) { |
176 if (networkConfig.lastError) | 202 if (error && error.message) |
177 detailCell.textContent = networkConfig.lastError; | 203 detailCell.textContent = error.message; |
178 else | 204 else |
179 detailCell.textContent = JSON.stringify(state, null, '\t'); | 205 detailCell.textContent = JSON.stringify(state, null, '\t'); |
180 }; | 206 }; |
181 var selected = $('get-property-format').selectedIndex; | 207 var selected = $('get-property-format').selectedIndex; |
182 var selectedId = $('get-property-format').options[selected].value; | 208 var selectedId = $('get-property-format').options[selected].value; |
183 if (selectedId == 'shill') | 209 if (selectedId == 'shill') { |
184 networkConfig.getShillProperties(guid, showDetail); | 210 chrome.send('getShillProperties', [guid]); |
185 else if (selectedId == 'managed') | 211 } else if (selectedId == 'managed') { |
186 networkConfig.getManagedProperties(guid, showDetail); | 212 chrome.networkingPrivate.getManagedProperties(guid, function(properties) { |
| 213 showDetail(properties, chrome.runtime.lastError); }); |
| 214 } else { |
| 215 chrome.networkingPrivate.getProperties(guid, function(properties) { |
| 216 showDetail(properties, chrome.runtime.lastError); }); |
| 217 } |
| 218 return expandedRow; |
| 219 }; |
| 220 |
| 221 /** |
| 222 * Callback invoked by Chrome after a getShillProperties call. |
| 223 * |
| 224 * @param {Object} properties The requested Shill properties. Will contain |
| 225 * just the 'GUID' and 'ShillError' properties if the call failed. |
| 226 */ |
| 227 var getShillPropertiesResult = function(args) { |
| 228 var properties = args.shift(); |
| 229 var guid = properties['GUID']; |
| 230 if (!guid) { |
| 231 console.error('No GUID in getShillPropertiesResult'); |
| 232 return; |
| 233 } |
| 234 |
| 235 var detailCell = document.querySelector('td#' + guid); |
| 236 if (!detailCell) { |
| 237 console.error('No cell for GUID: ' + guid); |
| 238 return; |
| 239 } |
| 240 |
| 241 if (properties['ShillError']) |
| 242 detailCell.textContent = properties['ShillError']; |
187 else | 243 else |
188 networkConfig.getProperties(guid, showDetail); | 244 detailCell.textContent = JSON.stringify(properties, null, '\t'); |
189 return expandedRow; | 245 |
190 }; | 246 }; |
191 | 247 |
192 /** | 248 /** |
193 * Requests an update of all network info. | 249 * Requests an update of all network info. |
194 */ | 250 */ |
195 var requestNetworks = function() { | 251 var requestNetworks = function() { |
196 networkConfig.getNetworks( | 252 chrome.networkingPrivate.getNetworks( |
197 { 'type': 'All', 'visible': true }, | 253 {'networkType': 'All', 'visible': true}, onVisibleNetworksReceived); |
198 onVisibleNetworksReceived); | 254 chrome.networkingPrivate.getNetworks( |
199 networkConfig.getNetworks( | 255 {'networkType': 'All', 'configured': true}, onFavoriteNetworksReceived); |
200 { 'type': 'All', 'configured': true }, | |
201 onFavoriteNetworksReceived); | |
202 }; | 256 }; |
203 | 257 |
204 /** | 258 /** |
205 * Sets refresh rate if the interval is found in the url. | 259 * Sets refresh rate if the interval is found in the url. |
206 */ | 260 */ |
207 var setRefresh = function() { | 261 var setRefresh = function() { |
208 var interval = parseQueryParams(window.location)['refresh']; | 262 var interval = parseQueryParams(window.location)['refresh']; |
209 if (interval && interval != '') | 263 if (interval && interval != '') |
210 setInterval(requestNetworks, parseInt(interval) * 1000); | 264 setInterval(requestNetworks, parseInt(interval) * 1000); |
211 }; | 265 }; |
212 | 266 |
213 /** | 267 /** |
214 * Get network information from WebUI. | 268 * Gets network information from WebUI. |
215 */ | 269 */ |
216 document.addEventListener('DOMContentLoaded', function() { | 270 document.addEventListener('DOMContentLoaded', function() { |
217 $('refresh').onclick = requestNetworks; | 271 $('refresh').onclick = requestNetworks; |
218 setRefresh(); | 272 setRefresh(); |
219 requestNetworks(); | 273 requestNetworks(); |
220 }); | 274 }); |
221 | 275 |
222 return {}; | 276 return { |
| 277 getShillPropertiesResult: getShillPropertiesResult |
| 278 }; |
223 })(); | 279 })(); |
OLD | NEW |