| 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 CrOncStrings = { | 8 CrOncStrings = { |
| 9 OncTypeCellular: loadTimeData.getString('OncTypeCellular'), | 9 OncTypeCellular: loadTimeData.getString('OncTypeCellular'), |
| 10 OncTypeEthernet: loadTimeData.getString('OncTypeEthernet'), | 10 OncTypeEthernet: loadTimeData.getString('OncTypeEthernet'), |
| 11 OncTypeTether: loadTimeData.getString('OncTypeTether'), | 11 OncTypeTether: loadTimeData.getString('OncTypeTether'), |
| 12 OncTypeVPN: loadTimeData.getString('OncTypeVPN'), | 12 OncTypeVPN: loadTimeData.getString('OncTypeVPN'), |
| 13 OncTypeWiFi: loadTimeData.getString('OncTypeWiFi'), | 13 OncTypeWiFi: loadTimeData.getString('OncTypeWiFi'), |
| 14 OncTypeWiMAX: loadTimeData.getString('OncTypeWiMAX'), | 14 OncTypeWiMAX: loadTimeData.getString('OncTypeWiMAX'), |
| 15 networkListItemConnected: | 15 networkListItemConnected: |
| 16 loadTimeData.getString('networkListItemConnected'), | 16 loadTimeData.getString('networkListItemConnected'), |
| 17 networkListItemConnecting: | 17 networkListItemConnecting: |
| 18 loadTimeData.getString('networkListItemConnecting'), | 18 loadTimeData.getString('networkListItemConnecting'), |
| 19 networkListItemConnectingTo: | 19 networkListItemConnectingTo: |
| 20 loadTimeData.getString('networkListItemConnectingTo'), | 20 loadTimeData.getString('networkListItemConnectingTo'), |
| 21 networkListItemNotConnected: | 21 networkListItemNotConnected: |
| 22 loadTimeData.getString('networkListItemNotConnected'), | 22 loadTimeData.getString('networkListItemNotConnected'), |
| 23 vpnNameTemplate: loadTimeData.getString('vpnNameTemplate'), | 23 vpnNameTemplate: loadTimeData.getString('vpnNameTemplate'), |
| 24 }; | 24 }; |
| 25 | 25 |
| 26 // Properties to display in the network state table. Each entry can be either | 26 // Properties to display in the network state table. Each entry can be either |
| 27 // a single state field or an array of state fields. If more than one is | 27 // a single state field or an array of state fields. If more than one is |
| 28 // specified then the first non empty value is used. | 28 // specified then the first non empty value is used. |
| 29 var NETWORK_STATE_FIELDS = [ | 29 var NETWORK_STATE_FIELDS = [ |
| 30 'GUID', | 30 'GUID', 'service_path', 'Name', 'Type', 'ConnectionState', 'connectable', |
| 31 'service_path', | 31 'ErrorState', 'WiFi.Security', ['Cellular.NetworkTechnology', 'EAP.EAP'], |
| 32 'Name', | 32 'Cellular.ActivationState', 'Cellular.RoamingState', 'WiFi.Frequency', |
| 33 'Type', | |
| 34 'ConnectionState', | |
| 35 'connectable', | |
| 36 'ErrorState', | |
| 37 'WiFi.Security', | |
| 38 ['Cellular.NetworkTechnology', 'EAP.EAP'], | |
| 39 'Cellular.ActivationState', | |
| 40 'Cellular.RoamingState', | |
| 41 'WiFi.Frequency', | |
| 42 'WiFi.SignalStrength' | 33 'WiFi.SignalStrength' |
| 43 ]; | 34 ]; |
| 44 | 35 |
| 45 var FAVORITE_STATE_FIELDS = [ | 36 var FAVORITE_STATE_FIELDS = [ |
| 46 'GUID', | 37 'GUID', 'service_path', 'Name', 'Type', 'profile_path', 'visible', 'Source' |
| 47 'service_path', | |
| 48 'Name', | |
| 49 'Type', | |
| 50 'profile_path', | |
| 51 'visible', | |
| 52 'Source' | |
| 53 ]; | 38 ]; |
| 54 | 39 |
| 55 /** | 40 /** |
| 56 * Creates and returns a typed HTMLTableCellElement. | 41 * Creates and returns a typed HTMLTableCellElement. |
| 57 * | 42 * |
| 58 * @return {!HTMLTableCellElement} A new td element. | 43 * @return {!HTMLTableCellElement} A new td element. |
| 59 */ | 44 */ |
| 60 var createTableCellElement = function() { | 45 var createTableCellElement = function() { |
| 61 return /** @type {!HTMLTableCellElement} */(document.createElement('td')); | 46 return /** @type {!HTMLTableCellElement} */ (document.createElement('td')); |
| 62 }; | 47 }; |
| 63 | 48 |
| 64 /** | 49 /** |
| 65 * Creates and returns a typed HTMLTableRowElement. | 50 * Creates and returns a typed HTMLTableRowElement. |
| 66 * | 51 * |
| 67 * @return {!HTMLTableRowElement} A new tr element. | 52 * @return {!HTMLTableRowElement} A new tr element. |
| 68 */ | 53 */ |
| 69 var createTableRowElement = function() { | 54 var createTableRowElement = function() { |
| 70 return /** @type {!HTMLTableRowElement} */(document.createElement('tr')); | 55 return /** @type {!HTMLTableRowElement} */ (document.createElement('tr')); |
| 71 }; | 56 }; |
| 72 | 57 |
| 73 /** | 58 /** |
| 74 * Returns the ONC data property for networkState associated with a key. Used | 59 * Returns the ONC data property for networkState associated with a key. Used |
| 75 * to access properties in the networkState by |key| which may may refer to a | 60 * to access properties in the networkState by |key| which may may refer to a |
| 76 * nested property, e.g. 'WiFi.Security'. If any part of a nested key is | 61 * nested property, e.g. 'WiFi.Security'. If any part of a nested key is |
| 77 * missing, this will return undefined. | 62 * missing, this will return undefined. |
| 78 * | 63 * |
| 79 * @param {!chrome.networkingPrivate.NetworkStateProperties} networkState The | 64 * @param {!chrome.networkingPrivate.NetworkStateProperties} networkState The |
| 80 * network state property dictionary. | 65 * network state property dictionary. |
| 81 * @param {string} key The ONC key for the property. | 66 * @param {string} key The ONC key for the property. |
| 82 * @return {*} The value associated with the property or undefined if the | 67 * @return {*} The value associated with the property or undefined if the |
| 83 * key (any part of it) is not defined. | 68 * key (any part of it) is not defined. |
| 84 */ | 69 */ |
| 85 var getOncProperty = function(networkState, key) { | 70 var getOncProperty = function(networkState, key) { |
| 86 var dict = /** @type {!Object} */(networkState); | 71 var dict = /** @type {!Object} */ (networkState); |
| 87 var keys = key.split('.'); | 72 var keys = key.split('.'); |
| 88 while (keys.length > 1) { | 73 while (keys.length > 1) { |
| 89 var k = keys.shift(); | 74 var k = keys.shift(); |
| 90 dict = dict[k]; | 75 dict = dict[k]; |
| 91 if (!dict || typeof dict != 'object') | 76 if (!dict || typeof dict != 'object') |
| 92 return undefined; | 77 return undefined; |
| 93 } | 78 } |
| 94 return dict[keys.shift()]; | 79 return dict[keys.shift()]; |
| 95 }; | 80 }; |
| 96 | 81 |
| 97 /** | 82 /** |
| 98 * Creates a cell with a button for expanding a network state table row. | 83 * Creates a cell with a button for expanding a network state table row. |
| 99 * | 84 * |
| 100 * @param {string} guid The GUID identifying the network. | 85 * @param {string} guid The GUID identifying the network. |
| 101 * @return {!HTMLTableCellElement} The created td element that displays the | 86 * @return {!HTMLTableCellElement} The created td element that displays the |
| 102 * given value. | 87 * given value. |
| 103 */ | 88 */ |
| 104 var createStateTableExpandButton = function(guid) { | 89 var createStateTableExpandButton = function(guid) { |
| 105 var cell = createTableCellElement(); | 90 var cell = createTableCellElement(); |
| 106 cell.className = 'state-table-expand-button-cell'; | 91 cell.className = 'state-table-expand-button-cell'; |
| 107 var button = document.createElement('button'); | 92 var button = document.createElement('button'); |
| 108 button.addEventListener('click', function(event) { | 93 button.addEventListener('click', function(event) { |
| 109 toggleExpandRow(/** @type {!HTMLElement} */(event.target), guid); | 94 toggleExpandRow(/** @type {!HTMLElement} */ (event.target), guid); |
| 110 }); | 95 }); |
| 111 button.className = 'state-table-expand-button'; | 96 button.className = 'state-table-expand-button'; |
| 112 button.textContent = '+'; | 97 button.textContent = '+'; |
| 113 cell.appendChild(button); | 98 cell.appendChild(button); |
| 114 return cell; | 99 return cell; |
| 115 }; | 100 }; |
| 116 | 101 |
| 117 /** | 102 /** |
| 118 * Creates a cell with an icon representing the network state. | 103 * Creates a cell with an icon representing the network state. |
| 119 * | 104 * |
| 120 * @param {!chrome.networkingPrivate.NetworkStateProperties} networkState The | 105 * @param {!chrome.networkingPrivate.NetworkStateProperties} networkState The |
| 121 * network state properties. | 106 * network state properties. |
| 122 * @return {!HTMLTableCellElement} The created td element that displays the | 107 * @return {!HTMLTableCellElement} The created td element that displays the |
| 123 * icon. | 108 * icon. |
| 124 */ | 109 */ |
| 125 var createStateTableIcon = function(networkState) { | 110 var createStateTableIcon = function(networkState) { |
| 126 var cell = createTableCellElement(); | 111 var cell = createTableCellElement(); |
| 127 cell.className = 'state-table-icon-cell'; | 112 cell.className = 'state-table-icon-cell'; |
| 128 var icon = /** @type {!CrNetworkIconElement} */( | 113 var icon = /** @type {!CrNetworkIconElement} */ ( |
| 129 document.createElement('cr-network-icon')); | 114 document.createElement('cr-network-icon')); |
| 130 icon.isListItem = true; | 115 icon.isListItem = true; |
| 131 icon.networkState = networkState; | 116 icon.networkState = networkState; |
| 132 cell.appendChild(icon); | 117 cell.appendChild(icon); |
| 133 return cell; | 118 return cell; |
| 134 }; | 119 }; |
| 135 | 120 |
| 136 /** | 121 /** |
| 137 * Creates a cell in the network state table. | 122 * Creates a cell in the network state table. |
| 138 * | 123 * |
| (...skipping 91 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 230 | 215 |
| 231 /** | 216 /** |
| 232 * Toggles the button state and add or remove a row displaying the complete | 217 * Toggles the button state and add or remove a row displaying the complete |
| 233 * state information for a row. | 218 * state information for a row. |
| 234 * | 219 * |
| 235 * @param {!HTMLElement} btn The button that was clicked. | 220 * @param {!HTMLElement} btn The button that was clicked. |
| 236 * @param {string} guid GUID identifying the network. | 221 * @param {string} guid GUID identifying the network. |
| 237 */ | 222 */ |
| 238 var toggleExpandRow = function(btn, guid) { | 223 var toggleExpandRow = function(btn, guid) { |
| 239 var cell = btn.parentNode; | 224 var cell = btn.parentNode; |
| 240 var row = /** @type {!HTMLTableRowElement} */(cell.parentNode); | 225 var row = /** @type {!HTMLTableRowElement} */ (cell.parentNode); |
| 241 if (btn.textContent == '-') { | 226 if (btn.textContent == '-') { |
| 242 btn.textContent = '+'; | 227 btn.textContent = '+'; |
| 243 row.parentNode.removeChild(row.nextSibling); | 228 row.parentNode.removeChild(row.nextSibling); |
| 244 } else { | 229 } else { |
| 245 btn.textContent = '-'; | 230 btn.textContent = '-'; |
| 246 var expandedRow = createExpandedRow(guid, row); | 231 var expandedRow = createExpandedRow(guid, row); |
| 247 row.parentNode.insertBefore(expandedRow, row.nextSibling); | 232 row.parentNode.insertBefore(expandedRow, row.nextSibling); |
| 248 } | 233 } |
| 249 }; | 234 }; |
| 250 | 235 |
| (...skipping 21 matching lines...) Expand all Loading... |
| 272 detailCell.textContent = error.message; | 257 detailCell.textContent = error.message; |
| 273 else | 258 else |
| 274 detailCell.textContent = JSON.stringify(state, null, '\t'); | 259 detailCell.textContent = JSON.stringify(state, null, '\t'); |
| 275 }; | 260 }; |
| 276 var selected = $('get-property-format').selectedIndex; | 261 var selected = $('get-property-format').selectedIndex; |
| 277 var selectedId = $('get-property-format').options[selected].value; | 262 var selectedId = $('get-property-format').options[selected].value; |
| 278 if (selectedId == 'shill') { | 263 if (selectedId == 'shill') { |
| 279 chrome.send('getShillProperties', [guid]); | 264 chrome.send('getShillProperties', [guid]); |
| 280 } else if (selectedId == 'state') { | 265 } else if (selectedId == 'state') { |
| 281 chrome.networkingPrivate.getState(guid, function(properties) { | 266 chrome.networkingPrivate.getState(guid, function(properties) { |
| 282 showDetail(properties, chrome.runtime.lastError); }); | 267 showDetail(properties, chrome.runtime.lastError); |
| 268 }); |
| 283 } else if (selectedId == 'managed') { | 269 } else if (selectedId == 'managed') { |
| 284 chrome.networkingPrivate.getManagedProperties(guid, function(properties) { | 270 chrome.networkingPrivate.getManagedProperties(guid, function(properties) { |
| 285 showDetail(properties, chrome.runtime.lastError); }); | 271 showDetail(properties, chrome.runtime.lastError); |
| 272 }); |
| 286 } else { | 273 } else { |
| 287 chrome.networkingPrivate.getProperties(guid, function(properties) { | 274 chrome.networkingPrivate.getProperties(guid, function(properties) { |
| 288 showDetail(properties, chrome.runtime.lastError); }); | 275 showDetail(properties, chrome.runtime.lastError); |
| 276 }); |
| 289 } | 277 } |
| 290 return expandedRow; | 278 return expandedRow; |
| 291 }; | 279 }; |
| 292 | 280 |
| 293 /** | 281 /** |
| 294 * Callback invoked by Chrome after a getShillProperties call. | 282 * Callback invoked by Chrome after a getShillProperties call. |
| 295 * | 283 * |
| 296 * @param {Array} args The requested Shill properties. Will contain | 284 * @param {Array} args The requested Shill properties. Will contain |
| 297 * just the 'GUID' and 'ShillError' properties if the call failed. | 285 * just the 'GUID' and 'ShillError' properties if the call failed. |
| 298 */ | 286 */ |
| (...skipping 16 matching lines...) Expand all Loading... |
| 315 else | 303 else |
| 316 detailCell.textContent = JSON.stringify(properties, null, '\t'); | 304 detailCell.textContent = JSON.stringify(properties, null, '\t'); |
| 317 | 305 |
| 318 }; | 306 }; |
| 319 | 307 |
| 320 /** | 308 /** |
| 321 * Requests an update of all network info. | 309 * Requests an update of all network info. |
| 322 */ | 310 */ |
| 323 var requestNetworks = function() { | 311 var requestNetworks = function() { |
| 324 chrome.networkingPrivate.getNetworks( | 312 chrome.networkingPrivate.getNetworks( |
| 325 {'networkType': chrome.networkingPrivate.NetworkType.ALL, | 313 { |
| 326 'visible': true}, | 314 'networkType': chrome.networkingPrivate.NetworkType.ALL, |
| 315 'visible': true |
| 316 }, |
| 327 onVisibleNetworksReceived); | 317 onVisibleNetworksReceived); |
| 328 chrome.networkingPrivate.getNetworks( | 318 chrome.networkingPrivate.getNetworks( |
| 329 {'networkType': chrome.networkingPrivate.NetworkType.ALL, | 319 { |
| 330 'configured': true}, | 320 'networkType': chrome.networkingPrivate.NetworkType.ALL, |
| 321 'configured': true |
| 322 }, |
| 331 onFavoriteNetworksReceived); | 323 onFavoriteNetworksReceived); |
| 332 }; | 324 }; |
| 333 | 325 |
| 334 /** | 326 /** |
| 335 * Requests the global policy dictionary and updates the page. | 327 * Requests the global policy dictionary and updates the page. |
| 336 */ | 328 */ |
| 337 var requestGlobalPolicy = function() { | 329 var requestGlobalPolicy = function() { |
| 338 chrome.networkingPrivate.getGlobalPolicy(function(policy) { | 330 chrome.networkingPrivate.getGlobalPolicy(function(policy) { |
| 339 document.querySelector('#global-policy').textContent = | 331 document.querySelector('#global-policy').textContent = |
| 340 JSON.stringify(policy, null, '\t'); | 332 JSON.stringify(policy, null, '\t'); |
| (...skipping 21 matching lines...) Expand all Loading... |
| 362 $('refresh').onclick = requestNetworks; | 354 $('refresh').onclick = requestNetworks; |
| 363 setRefresh(); | 355 setRefresh(); |
| 364 requestNetworks(); | 356 requestNetworks(); |
| 365 requestGlobalPolicy(); | 357 requestGlobalPolicy(); |
| 366 }); | 358 }); |
| 367 | 359 |
| 368 document.addEventListener('custom-item-selected', function(event) { | 360 document.addEventListener('custom-item-selected', function(event) { |
| 369 chrome.send('addNetwork', [event.detail.customData]); | 361 chrome.send('addNetwork', [event.detail.customData]); |
| 370 }); | 362 }); |
| 371 | 363 |
| 372 return { | 364 return {getShillPropertiesResult: getShillPropertiesResult}; |
| 373 getShillPropertiesResult: getShillPropertiesResult | |
| 374 }; | |
| 375 })(); | 365 })(); |
| OLD | NEW |