| OLD | NEW |
| (Empty) |
| 1 // Copyright (c) 2011 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 cr.define('options.internet', function() { | |
| 6 | |
| 7 /** | |
| 8 * Network settings constants. These enums usually match their C++ | |
| 9 * counterparts. | |
| 10 */ | |
| 11 function Constants() {} | |
| 12 // Minimum length for wireless network password. | |
| 13 Constants.MIN_WIRELESS_PASSWORD_LENGTH = 5; | |
| 14 // Minimum length for SSID name. | |
| 15 Constants.MIN_WIRELESS_SSID_LENGTH = 1; | |
| 16 // Cellular activation states: | |
| 17 Constants.ACTIVATION_STATE_UNKNOWN = 0; | |
| 18 Constants.ACTIVATION_STATE_ACTIVATED = 1; | |
| 19 Constants.ACTIVATION_STATE_ACTIVATING = 2; | |
| 20 Constants.ACTIVATION_STATE_NOT_ACTIVATED = 3; | |
| 21 Constants.ACTIVATION_STATE_PARTIALLY_ACTIVATED = 4; | |
| 22 // Network types: | |
| 23 Constants.TYPE_UNKNOWN = 0; | |
| 24 Constants.TYPE_ETHERNET = 1; | |
| 25 Constants.TYPE_WIFI = 2; | |
| 26 Constants.TYPE_WIMAX = 3; | |
| 27 Constants.TYPE_BLUETOOTH = 4; | |
| 28 Constants.TYPE_CELLULAR = 5; | |
| 29 Constants.TYPE_VPN = 6; | |
| 30 // ONC sources: | |
| 31 Constants.ONC_SOURCE_USER_IMPORT = 1; | |
| 32 Constants.ONC_SOURCE_DEVICE_POLICY = 2; | |
| 33 Constants.ONC_SOURCE_USER_POLICY = 3; | |
| 34 | |
| 35 /** | |
| 36 * Creates a new network list div. | |
| 37 * @param {Object=} opt_propertyBag Optional properties. | |
| 38 * @constructor | |
| 39 * @extends {HTMLDivElement} | |
| 40 */ | |
| 41 var NetworkElement = cr.ui.define('div'); | |
| 42 | |
| 43 NetworkElement.prototype = { | |
| 44 __proto__: HTMLDivElement.prototype, | |
| 45 | |
| 46 /** @inheritDoc */ | |
| 47 decorate: function() { | |
| 48 this.addEventListener('click', this.handleClick_); | |
| 49 }, | |
| 50 | |
| 51 /** | |
| 52 * Loads given network list. | |
| 53 * @param {Array} networks An array of network object. | |
| 54 */ | |
| 55 load: function(networks) { | |
| 56 this.textContent = ''; | |
| 57 | |
| 58 for (var i = 0; i < networks.length; ++i) { | |
| 59 this.appendChild(new NetworkItem(networks[i])); | |
| 60 } | |
| 61 }, | |
| 62 | |
| 63 /** | |
| 64 * Handles click on network list and triggers actions when clicked on | |
| 65 * a NetworkListItem button. | |
| 66 * @private | |
| 67 * @param {!Event} e The click event object. | |
| 68 */ | |
| 69 handleClick_: function(e) { | |
| 70 // We shouldn't respond to click events selecting an input, | |
| 71 // so return on those. | |
| 72 if (e.target.tagName == 'INPUT') { | |
| 73 return; | |
| 74 } | |
| 75 // Handle left button click | |
| 76 if (e.button == 0) { | |
| 77 var el = e.target; | |
| 78 // If click is on action buttons of a network item. | |
| 79 if (!(el.buttonType && el.networkType && el.servicePath)) { | |
| 80 if (el.buttonType) { | |
| 81 return; | |
| 82 } | |
| 83 // If click is on a network item or its label, walk up the DOM tree | |
| 84 // to find the network item. | |
| 85 var item = el; | |
| 86 while (item && !item.data) { | |
| 87 item = item.parentNode; | |
| 88 } | |
| 89 if (item.connecting) | |
| 90 return; | |
| 91 | |
| 92 if (item) { | |
| 93 var data = item.data; | |
| 94 // Don't try to connect to Ethernet or unactivated Cellular. | |
| 95 if (data && (data.networkType == 1 || | |
| 96 (data.networkType == 5 && data.activation_state != 1))) | |
| 97 return; | |
| 98 // If clicked on other networks item. | |
| 99 if (data && data.servicePath == '?') { | |
| 100 chrome.send('buttonClickCallback', | |
| 101 [String(data.networkType), | |
| 102 data.servicePath, | |
| 103 'connect']); | |
| 104 } | |
| 105 } | |
| 106 } | |
| 107 } | |
| 108 } | |
| 109 }; | |
| 110 | |
| 111 /** | |
| 112 * Creates a new network item. | |
| 113 * @param {Object} network The network this represents. | |
| 114 * @constructor | |
| 115 * @extends {HTMLDivElement} | |
| 116 */ | |
| 117 function NetworkItem(network) { | |
| 118 var el = cr.doc.createElement('div'); | |
| 119 el.data = network; | |
| 120 NetworkItem.decorate(el); | |
| 121 return el; | |
| 122 } | |
| 123 | |
| 124 | |
| 125 /** | |
| 126 * Decorates an element as a network item. | |
| 127 * @param {!HTMLElement} el The element to decorate. | |
| 128 */ | |
| 129 NetworkItem.decorate = function(el) { | |
| 130 el.__proto__ = NetworkItem.prototype; | |
| 131 el.decorate(); | |
| 132 }; | |
| 133 | |
| 134 NetworkItem.prototype = { | |
| 135 __proto__: HTMLDivElement.prototype, | |
| 136 | |
| 137 /** @inheritDoc */ | |
| 138 decorate: function() { | |
| 139 this.className = 'network-item'; | |
| 140 this.connectable = this.data.connectable; | |
| 141 this.connected = this.data.connected; | |
| 142 this.connecting = this.data.connecting; | |
| 143 this.other = this.data.servicePath == '?'; | |
| 144 this.id = this.data.servicePath; | |
| 145 | |
| 146 // Insert a div holding the policy-managed indicator. | |
| 147 var policyIndicator = this.ownerDocument.createElement('div'); | |
| 148 policyIndicator.className = 'controlled-setting-indicator'; | |
| 149 cr.ui.decorate(policyIndicator, options.ControlledSettingIndicator); | |
| 150 | |
| 151 if (this.data.policyManaged) { | |
| 152 policyIndicator.controlledBy = 'policy'; | |
| 153 policyIndicator.setAttribute('textPolicy', | |
| 154 localStrings.getString('managedNetwork')); | |
| 155 } | |
| 156 this.appendChild(policyIndicator); | |
| 157 | |
| 158 // textDiv holds icon, name and status text. | |
| 159 var textDiv = this.ownerDocument.createElement('div'); | |
| 160 textDiv.className = 'network-item-text'; | |
| 161 if (this.data.iconURL) { | |
| 162 textDiv.style.backgroundImage = url(this.data.iconURL); | |
| 163 } | |
| 164 | |
| 165 var nameEl = this.ownerDocument.createElement('div'); | |
| 166 nameEl.className = 'network-name-label'; | |
| 167 nameEl.textContent = this.data.networkName; | |
| 168 textDiv.appendChild(nameEl); | |
| 169 | |
| 170 if (this.other) { | |
| 171 // No status and buttons for "Other..." | |
| 172 this.appendChild(textDiv); | |
| 173 return; | |
| 174 } | |
| 175 | |
| 176 // Only show status text if not empty. | |
| 177 if (this.data.networkStatus) { | |
| 178 var statusEl = this.ownerDocument.createElement('div'); | |
| 179 statusEl.className = 'network-status-label'; | |
| 180 statusEl.textContent = this.data.networkStatus; | |
| 181 textDiv.appendChild(statusEl); | |
| 182 } | |
| 183 | |
| 184 this.appendChild(textDiv); | |
| 185 | |
| 186 var spacerDiv = this.ownerDocument.createElement('div'); | |
| 187 spacerDiv.className = 'network-item-box-spacer'; | |
| 188 this.appendChild(spacerDiv); | |
| 189 | |
| 190 var buttonsDiv = this.ownerDocument.createElement('div'); | |
| 191 var self = this; | |
| 192 if (!this.data.remembered) { | |
| 193 var no_plan = | |
| 194 this.data.networkType == Constants.TYPE_CELLULAR && | |
| 195 this.data.needs_new_plan; | |
| 196 var show_activate = | |
| 197 (this.data.networkType == Constants.TYPE_CELLULAR && | |
| 198 this.data.activation_state != | |
| 199 Constants.ACTIVATION_STATE_ACTIVATED && | |
| 200 this.data.activation_state != | |
| 201 Constants.ACTIVATION_STATE_ACTIVATING); | |
| 202 | |
| 203 // Show [Activate] button for non-activated Cellular network. | |
| 204 if (show_activate || no_plan) { | |
| 205 var button_name = no_plan ? 'buyplan_button' : 'activate_button'; | |
| 206 buttonsDiv.appendChild( | |
| 207 this.createButton_(button_name, 'activate', | |
| 208 function(e) { | |
| 209 chrome.send('buttonClickCallback', | |
| 210 [String(self.data.networkType), | |
| 211 self.data.servicePath, | |
| 212 'activate']); | |
| 213 })); | |
| 214 } | |
| 215 // Show disconnect button if not ethernet. | |
| 216 if (this.data.networkType != Constants.TYPE_ETHERNET && | |
| 217 this.data.connected) { | |
| 218 buttonsDiv.appendChild( | |
| 219 this.createButton_('disconnect_button', 'disconnect', | |
| 220 function(e) { | |
| 221 chrome.send('buttonClickCallback', | |
| 222 [String(self.data.networkType), | |
| 223 self.data.servicePath, | |
| 224 'disconnect']); | |
| 225 })); | |
| 226 } | |
| 227 if (!this.data.connected && !this.data.connecting) { | |
| 228 // connect button (if not ethernet and not showing activate button) | |
| 229 if (this.data.networkType != Constants.TYPE_ETHERNET && | |
| 230 !show_activate && !no_plan) { | |
| 231 buttonsDiv.appendChild( | |
| 232 this.createButton_('connect_button', 'connect', | |
| 233 function(e) { | |
| 234 chrome.send('buttonClickCallback', | |
| 235 [String(self.data.networkType), | |
| 236 self.data.servicePath, | |
| 237 'connect']); | |
| 238 })); | |
| 239 } | |
| 240 } | |
| 241 if (this.data.connected || | |
| 242 this.data.networkType == Constants.TYPE_ETHERNET || | |
| 243 this.data.networkType == Constants.TYPE_VPN || | |
| 244 this.data.networkType == Constants.TYPE_WIFI || | |
| 245 this.data.networkType == Constants.TYPE_CELLULAR) { | |
| 246 buttonsDiv.appendChild( | |
| 247 this.createButton_('options_button', 'options', | |
| 248 function(e) { | |
| 249 options.ProxyOptions.getInstance().setNetworkName( | |
| 250 self.data.networkName); | |
| 251 chrome.send('buttonClickCallback', | |
| 252 [String(self.data.networkType), | |
| 253 self.data.servicePath, | |
| 254 'options']); | |
| 255 })); | |
| 256 } | |
| 257 } else { | |
| 258 // Put "Forget this network" button. | |
| 259 var button = this.createButton_('forget_button', 'forget', | |
| 260 function(e) { | |
| 261 chrome.send('buttonClickCallback', | |
| 262 [String(self.data.networkType), | |
| 263 self.data.servicePath, | |
| 264 'forget']); | |
| 265 }); | |
| 266 button.disabled = this.data.policyManaged; | |
| 267 buttonsDiv.appendChild(button); | |
| 268 } | |
| 269 this.appendChild(buttonsDiv); | |
| 270 }, | |
| 271 | |
| 272 /** | |
| 273 * Creates a button for interacting with a network. | |
| 274 * @param {Object} name The name of the localStrings to use for the text. | |
| 275 * @param {Object} type The type of button. | |
| 276 */ | |
| 277 createButton_: function(name, type, callback) { | |
| 278 var buttonEl = this.ownerDocument.createElement('button'); | |
| 279 buttonEl.buttonType = type; | |
| 280 buttonEl.textContent = localStrings.getString(name); | |
| 281 buttonEl.addEventListener('click', callback); | |
| 282 return buttonEl; | |
| 283 } | |
| 284 }; | |
| 285 | |
| 286 /** | |
| 287 * Whether the underlying network is connected. Only used for display purpose. | |
| 288 * @type {boolean} | |
| 289 */ | |
| 290 cr.defineProperty(NetworkItem, 'connected', cr.PropertyKind.BOOL_ATTR); | |
| 291 | |
| 292 /** | |
| 293 * Whether the underlying network is currently connecting. | |
| 294 * Only used for display purpose. | |
| 295 * @type {boolean} | |
| 296 */ | |
| 297 cr.defineProperty(NetworkItem, 'connecting', cr.PropertyKind.BOOL_ATTR); | |
| 298 | |
| 299 /** | |
| 300 * Whether the underlying network is an other network for adding networks. | |
| 301 * Only used for display purpose. | |
| 302 * @type {boolean} | |
| 303 */ | |
| 304 cr.defineProperty(NetworkItem, 'other', cr.PropertyKind.BOOL_ATTR); | |
| 305 | |
| 306 /** | |
| 307 * Whether the underlying network is connectable. | |
| 308 * @type {boolean} | |
| 309 */ | |
| 310 cr.defineProperty(NetworkItem, 'connectable', cr.PropertyKind.BOOL_ATTR); | |
| 311 | |
| 312 return { | |
| 313 Constants: Constants, | |
| 314 NetworkElement: NetworkElement | |
| 315 }; | |
| 316 }); | |
| OLD | NEW |