OLD | NEW |
| (Empty) |
1 // Copyright 2015 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 /** | |
6 * @fileoverview Polymer element for displaying information about a network | |
7 * in a list or summary based on ONC state properties. | |
8 */ | |
9 (function() { | |
10 'use strict'; | |
11 | |
12 /** | |
13 * TODO(stevenjb): Replace getText with a proper localization function that | |
14 * handles string substitution. | |
15 * Performs argument substitution, replacing $1, $2, etc in 'text' with | |
16 * corresponding entries in |args|. | |
17 * @param {string} text The string to perform the substitution on. | |
18 * @param {?Array<string>=} opt_args The arguments to replace $1, $2, etc with. | |
19 */ | |
20 function getText(text, opt_args) { | |
21 var res; | |
22 if (loadTimeData && loadTimeData.data_) | |
23 res = loadTimeData.getString(text) || text; | |
24 else | |
25 res = text; | |
26 if (!opt_args) | |
27 return res; | |
28 for (let i = 0; i < opt_args.length; ++i) { | |
29 let key = '$' + (i + 1); | |
30 res = res.replace(key, opt_args[i]); | |
31 } | |
32 return res; | |
33 } | |
34 | |
35 /** | |
36 * Returns the appropriate connection state text. | |
37 * @param {string} state The connection state. | |
38 * @param {string} name The name of the network. | |
39 */ | |
40 function getConnectionStateText(state, name) { | |
41 if (state == CrOnc.ConnectionState.CONNECTED) | |
42 return getText('networkConnected', [name]); | |
43 if (state == CrOnc.ConnectionState.CONNECTING) | |
44 return getText('networkConnecting', [name]); | |
45 if (state == CrOnc.ConnectionState.NOT_CONNECTED) | |
46 return getText('networkNotConnected'); | |
47 return getText(state); | |
48 }; | |
49 | |
50 /** | |
51 * Returns the name to display for |network|. | |
52 * @param {?CrOnc.NetworkStateProperties} network | |
53 */ | |
54 function getNetworkName(network) { | |
55 var name = network.Name; | |
56 if (!name) | |
57 return getText('OncType' + network.Type); | |
58 if (network.Type == 'VPN' && network.VPN && | |
59 network.VPN.Type == 'ThirdPartyVPN' && network.VPN.ThirdPartyVPN) { | |
60 var providerName = network.VPN.ThirdPartyVPN.ProviderName; | |
61 if (providerName) | |
62 return getText('vpnNameTemplate', [providerName, name]); | |
63 } | |
64 return name; | |
65 } | |
66 | |
67 /** | |
68 * Polymer class definition for 'cr-network-list-item'. | |
69 * @element cr-network-list-item | |
70 */ | |
71 Polymer({ | |
72 is: 'cr-network-list-item', | |
73 | |
74 properties: { | |
75 /** | |
76 * The ONC data properties used to display the list item. | |
77 * | |
78 * @type {?CrOnc.NetworkStateProperties} | |
79 */ | |
80 networkState: { | |
81 type: Object, | |
82 value: null, | |
83 observer: 'networkStateChanged_' | |
84 }, | |
85 | |
86 /** | |
87 * Determines how the list item will be displayed: | |
88 * 'visible' - displays the network icon (with strength) and name | |
89 * 'known' - displays the visible info along with a toggle icon for the | |
90 * preferred status and a remove button. | |
91 * 'none' - The element is a stand-alone item (e.g. part of a summary) | |
92 * and displays the name of the network type plus the network name | |
93 * and connection state. | |
94 */ | |
95 listItemType: { | |
96 type: String, | |
97 value: 'none', | |
98 observer: 'networkStateChanged_' | |
99 }, | |
100 }, | |
101 | |
102 /** | |
103 * Polymer networkState changed method. Updates the element based on the | |
104 * network state. | |
105 */ | |
106 networkStateChanged_: function() { | |
107 if (!this.networkState) | |
108 return; | |
109 | |
110 var network = this.networkState; | |
111 var isDisconnected = | |
112 network.ConnectionState == CrOnc.ConnectionState.NOT_CONNECTED; | |
113 var name = getNetworkName(network); | |
114 if (this.isListItem_(this.listItemType)) { | |
115 this.$.networkName.textContent = name; | |
116 this.$.networkName.classList.toggle('connected', !isDisconnected); | |
117 return; | |
118 } | |
119 if (network.Name && network.ConnectionState) { | |
120 this.$.networkName.textContent = getText('OncType' + network.Type); | |
121 this.$.networkName.classList.toggle('connected', false); | |
122 this.$.networkStateText.textContent = | |
123 getConnectionStateText(network.ConnectionState, name); | |
124 this.$.networkStateText.classList.toggle('connected', !isDisconnected); | |
125 return; | |
126 } | |
127 this.$.networkName.textContent = getText('OncType' + network.Type); | |
128 this.$.networkName.classList.toggle('connected', false); | |
129 this.$.networkStateText.textContent = getText('networkDisabled'); | |
130 this.$.networkStateText.classList.toggle('connected', false); | |
131 | |
132 if (network.Type == CrOnc.Type.CELLULAR) { | |
133 if (!network.GUID) | |
134 this.$.networkStateText.textContent = getText('networkDisabled'); | |
135 } | |
136 }, | |
137 | |
138 /** | |
139 * @param {?CrOnc.NetworkStateProperties} networkState | |
140 * @return {string} The icon to use for the shared button indicator. | |
141 * @private | |
142 */ | |
143 sharedIcon_: function(networkState) { | |
144 var source = (networkState && networkState.Source) || ''; | |
145 var isShared = (source == CrOnc.Source.DEVICE || | |
146 source == CrOnc.Source.DEVICE_POLICY); | |
147 return isShared ? 'check' : ''; | |
148 }, | |
149 | |
150 /** | |
151 * @param {?CrOnc.NetworkStateProperties} networkState | |
152 * @return {string} The icon to use for the preferred button. | |
153 * @private | |
154 */ | |
155 preferredIcon_: function(networkState) { | |
156 var isPreferred = networkState && networkState.Priority > 0; | |
157 return isPreferred ? 'star' : 'star-border'; | |
158 }, | |
159 | |
160 /** | |
161 * Fires a 'show-details' event with |this.networkState| as the details. | |
162 * @param {Event} event | |
163 * @private | |
164 */ | |
165 fireShowDetails_: function(event) { | |
166 this.fire('show-detail', this.networkState); | |
167 event.stopPropagation(); | |
168 }, | |
169 | |
170 /** | |
171 * Fires the 'toggle-preferred' event with |this.networkState| as the details. | |
172 * @param {Event} event | |
173 * @private | |
174 */ | |
175 fireTogglePreferred_: function(event) { | |
176 this.fire('toggle-preferred', this.networkState); | |
177 event.stopPropagation(); | |
178 }, | |
179 | |
180 /** | |
181 * Fires the 'remove' event with |this.networkState| as the details. | |
182 * @param {Event} event | |
183 * @private | |
184 */ | |
185 fireRemove_: function(event) { | |
186 this.fire('remove', this.networkState); | |
187 event.stopPropagation(); | |
188 }, | |
189 | |
190 /** | |
191 * @param {?CrOnc.NetworkStateProperties} networkState | |
192 * @return {boolean} True if the network is managed by a policy. | |
193 * @private | |
194 */ | |
195 isPolicyManaged_: function(networkState) { | |
196 var source = (networkState && networkState.Source) || ''; | |
197 var isPolicyManaged = source == CrOnc.Source.USER_POLICY || | |
198 source == CrOnc.Source.DEVICE_POLICY; | |
199 return isPolicyManaged; | |
200 }, | |
201 | |
202 /** | |
203 * @param {string} listItemType The list item type. | |
204 * @return {boolean} True if the the list item type is not 'none'. | |
205 * @private | |
206 */ | |
207 isListItem_: function(listItemType) { | |
208 return listItemType != 'none'; | |
209 }, | |
210 | |
211 /** | |
212 * @param {string} listItemType The list item type. | |
213 * @param {string} type The type to match against. | |
214 * @return {boolean} True if the the list item type matches |type|. | |
215 * @private | |
216 */ | |
217 isListItemType_: function(listItemType, type) { | |
218 return listItemType == type; | |
219 }, | |
220 }); | |
221 })(); | |
OLD | NEW |