| OLD | NEW |
| 1 // Copyright 2015 The Chromium Authors. All rights reserved. | 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 | 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 /** | 5 /** |
| 6 * @constructor | 6 * @constructor |
| 7 * @param {function(!Array<!WebInspector.NetworkConditionsGroup>):!Array<?WebIns
pector.NetworkManager.Conditions>} populateCallback | 7 * @param {function(!Array<!WebInspector.NetworkConditionsGroup>):!Array<?WebIns
pector.NetworkManager.Conditions>} populateCallback |
| 8 * @param {function(number)} selectCallback | 8 * @param {function(number)} selectCallback |
| 9 */ | 9 */ |
| 10 WebInspector.NetworkConditionsSelector = function(populateCallback, selectCallba
ck) | 10 WebInspector.NetworkConditionsSelector = function(populateCallback, selectCallba
ck) |
| 11 { | 11 { |
| 12 this._populateCallback = populateCallback; | 12 this._populateCallback = populateCallback; |
| 13 this._selectCallback = selectCallback; | 13 this._selectCallback = selectCallback; |
| 14 this._customSetting = WebInspector.moduleSetting("customNetworkConditions"); | 14 this._customSetting = WebInspector.moduleSetting("customNetworkConditions"); |
| 15 this._customSetting.addChangeListener(this._populateOptions, this); | 15 this._customSetting.addChangeListener(this._populateOptions, this); |
| 16 this._manager = WebInspector.multitargetNetworkManager; | 16 this._manager = WebInspector.multitargetNetworkManager; |
| 17 this._manager.addEventListener(WebInspector.MultitargetNetworkManager.Events
.ConditionsChanged, this._conditionsChanged, this); | 17 this._manager.addEventListener(WebInspector.MultitargetNetworkManager.Events
.ConditionsChanged, this._conditionsChanged, this); |
| 18 this._populateOptions(); | 18 this._populateOptions(); |
| 19 } | 19 }; |
| 20 | 20 |
| 21 /** @typedef {!{title: string, items: !Array<!WebInspector.NetworkManager.Condit
ions>}} */ | 21 /** @typedef {!{title: string, items: !Array<!WebInspector.NetworkManager.Condit
ions>}} */ |
| 22 WebInspector.NetworkConditionsGroup; | 22 WebInspector.NetworkConditionsGroup; |
| 23 | 23 |
| 24 /** | 24 /** |
| 25 * @param {number} throughput | 25 * @param {number} throughput |
| 26 * @param {boolean=} plainText | 26 * @param {boolean=} plainText |
| 27 * @return {string} | 27 * @return {string} |
| 28 */ | 28 */ |
| 29 WebInspector.NetworkConditionsSelector._throughputText = function(throughput, pl
ainText) | 29 WebInspector.NetworkConditionsSelector._throughputText = function(throughput, pl
ainText) |
| 30 { | 30 { |
| 31 if (throughput < 0) | 31 if (throughput < 0) |
| 32 return ""; | 32 return ""; |
| 33 var throughputInKbps = throughput / (1024 / 8); | 33 var throughputInKbps = throughput / (1024 / 8); |
| 34 var delimiter = plainText ? "" : " "; | 34 var delimiter = plainText ? "" : " "; |
| 35 if (throughputInKbps < 1024) | 35 if (throughputInKbps < 1024) |
| 36 return WebInspector.UIString("%d%skb/s", throughputInKbps, delimiter); | 36 return WebInspector.UIString("%d%skb/s", throughputInKbps, delimiter); |
| 37 if (throughputInKbps < 1024 * 10) | 37 if (throughputInKbps < 1024 * 10) |
| 38 return WebInspector.UIString("%.1f%sMb/s", throughputInKbps / 1024, deli
miter); | 38 return WebInspector.UIString("%.1f%sMb/s", throughputInKbps / 1024, deli
miter); |
| 39 return WebInspector.UIString("%d%sMb/s", (throughputInKbps / 1024) | 0, deli
miter); | 39 return WebInspector.UIString("%d%sMb/s", (throughputInKbps / 1024) | 0, deli
miter); |
| 40 } | 40 }; |
| 41 | 41 |
| 42 /** @type {!Array.<!WebInspector.NetworkManager.Conditions>} */ | 42 /** @type {!Array.<!WebInspector.NetworkManager.Conditions>} */ |
| 43 WebInspector.NetworkConditionsSelector._presets = [ | 43 WebInspector.NetworkConditionsSelector._presets = [ |
| 44 WebInspector.NetworkManager.OfflineConditions, | 44 WebInspector.NetworkManager.OfflineConditions, |
| 45 {title: "GPRS", download: 50 * 1024 / 8, upload: 20 * 1024 / 8, latency: 500
}, | 45 {title: "GPRS", download: 50 * 1024 / 8, upload: 20 * 1024 / 8, latency: 500
}, |
| 46 {title: "Regular 2G", download: 250 * 1024 / 8, upload: 50 * 1024 / 8, laten
cy: 300}, | 46 {title: "Regular 2G", download: 250 * 1024 / 8, upload: 50 * 1024 / 8, laten
cy: 300}, |
| 47 {title: "Good 2G", download: 450 * 1024 / 8, upload: 150 * 1024 / 8, latency
: 150}, | 47 {title: "Good 2G", download: 450 * 1024 / 8, upload: 150 * 1024 / 8, latency
: 150}, |
| 48 {title: "Regular 3G", download: 750 * 1024 / 8, upload: 250 * 1024 / 8, late
ncy: 100}, | 48 {title: "Regular 3G", download: 750 * 1024 / 8, upload: 250 * 1024 / 8, late
ncy: 100}, |
| 49 {title: "Good 3G", download: 1.5 * 1024 * 1024 / 8, upload: 750 * 1024 / 8,
latency: 40}, | 49 {title: "Good 3G", download: 1.5 * 1024 * 1024 / 8, upload: 750 * 1024 / 8,
latency: 40}, |
| 50 {title: "Regular 4G", download: 4 * 1024 * 1024 / 8, upload: 3 * 1024 * 1024
/ 8, latency: 20}, | 50 {title: "Regular 4G", download: 4 * 1024 * 1024 / 8, upload: 3 * 1024 * 1024
/ 8, latency: 20}, |
| (...skipping 13 matching lines...) Expand all Loading... |
| 64 var isThrottling = (downloadInKbps >= 0) || (uploadInKbps >= 0) || (conditio
ns.latency > 0); | 64 var isThrottling = (downloadInKbps >= 0) || (uploadInKbps >= 0) || (conditio
ns.latency > 0); |
| 65 var conditionTitle = WebInspector.UIString(conditions.title); | 65 var conditionTitle = WebInspector.UIString(conditions.title); |
| 66 if (!isThrottling) | 66 if (!isThrottling) |
| 67 return {text: conditionTitle, title: conditionTitle}; | 67 return {text: conditionTitle, title: conditionTitle}; |
| 68 | 68 |
| 69 var downloadText = WebInspector.NetworkConditionsSelector._throughputText(co
nditions.download, plainText); | 69 var downloadText = WebInspector.NetworkConditionsSelector._throughputText(co
nditions.download, plainText); |
| 70 var uploadText = WebInspector.NetworkConditionsSelector._throughputText(cond
itions.upload, plainText); | 70 var uploadText = WebInspector.NetworkConditionsSelector._throughputText(cond
itions.upload, plainText); |
| 71 var pattern = plainText ? "%s (%dms, %s, %s)" : "%s (%dms RTT, %s\u2b07, %s\
u2b06)"; | 71 var pattern = plainText ? "%s (%dms, %s, %s)" : "%s (%dms RTT, %s\u2b07, %s\
u2b06)"; |
| 72 var title = WebInspector.UIString(pattern, conditionTitle, conditions.latenc
y, downloadText, uploadText); | 72 var title = WebInspector.UIString(pattern, conditionTitle, conditions.latenc
y, downloadText, uploadText); |
| 73 return {text: title, title: WebInspector.UIString("Maximum download throughp
ut: %s.\r\nMaximum upload throughput: %s.\r\nMinimum round-trip time: %dms.", do
wnloadText, uploadText, conditions.latency)}; | 73 return {text: title, title: WebInspector.UIString("Maximum download throughp
ut: %s.\r\nMaximum upload throughput: %s.\r\nMinimum round-trip time: %dms.", do
wnloadText, uploadText, conditions.latency)}; |
| 74 } | 74 }; |
| 75 | 75 |
| 76 WebInspector.NetworkConditionsSelector.prototype = { | 76 WebInspector.NetworkConditionsSelector.prototype = { |
| 77 _populateOptions: function() | 77 _populateOptions: function() |
| 78 { | 78 { |
| 79 var customGroup = {title: WebInspector.UIString("Custom"), items: this._
customSetting.get()}; | 79 var customGroup = {title: WebInspector.UIString("Custom"), items: this._
customSetting.get()}; |
| 80 var presetsGroup = {title: WebInspector.UIString("Presets"), items: WebI
nspector.NetworkConditionsSelector._presets}; | 80 var presetsGroup = {title: WebInspector.UIString("Presets"), items: WebI
nspector.NetworkConditionsSelector._presets}; |
| 81 var disabledGroup = {title: WebInspector.UIString("Disabled"), items: [W
ebInspector.NetworkManager.NoThrottlingConditions]}; | 81 var disabledGroup = {title: WebInspector.UIString("Disabled"), items: [W
ebInspector.NetworkManager.NoThrottlingConditions]}; |
| 82 this._options = this._populateCallback([customGroup, presetsGroup, disab
ledGroup]); | 82 this._options = this._populateCallback([customGroup, presetsGroup, disab
ledGroup]); |
| 83 if (!this._conditionsChanged()) { | 83 if (!this._conditionsChanged()) { |
| 84 for (var i = this._options.length - 1; i >= 0; i--) { | 84 for (var i = this._options.length - 1; i >= 0; i--) { |
| (...skipping 27 matching lines...) Expand all Loading... |
| 112 var value = this._manager.networkConditions(); | 112 var value = this._manager.networkConditions(); |
| 113 for (var index = 0; index < this._options.length; ++index) { | 113 for (var index = 0; index < this._options.length; ++index) { |
| 114 var option = this._options[index]; | 114 var option = this._options[index]; |
| 115 if (option && option.download === value.download && option.upload ==
= value.upload && option.latency === value.latency && option.title === value.tit
le) { | 115 if (option && option.download === value.download && option.upload ==
= value.upload && option.latency === value.latency && option.title === value.tit
le) { |
| 116 this._selectCallback(index); | 116 this._selectCallback(index); |
| 117 return true; | 117 return true; |
| 118 } | 118 } |
| 119 } | 119 } |
| 120 return false; | 120 return false; |
| 121 } | 121 } |
| 122 } | 122 }; |
| 123 | 123 |
| 124 /** | 124 /** |
| 125 * @param {!HTMLSelectElement} selectElement | 125 * @param {!HTMLSelectElement} selectElement |
| 126 */ | 126 */ |
| 127 WebInspector.NetworkConditionsSelector.decorateSelect = function(selectElement) | 127 WebInspector.NetworkConditionsSelector.decorateSelect = function(selectElement) |
| 128 { | 128 { |
| 129 var options = []; | 129 var options = []; |
| 130 var selector = new WebInspector.NetworkConditionsSelector(populate, select); | 130 var selector = new WebInspector.NetworkConditionsSelector(populate, select); |
| 131 selectElement.addEventListener("change", optionSelected, false); | 131 selectElement.addEventListener("change", optionSelected, false); |
| 132 | 132 |
| (...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 166 } | 166 } |
| 167 | 167 |
| 168 /** | 168 /** |
| 169 * @param {number} index | 169 * @param {number} index |
| 170 */ | 170 */ |
| 171 function select(index) | 171 function select(index) |
| 172 { | 172 { |
| 173 if (selectElement.selectedIndex !== index) | 173 if (selectElement.selectedIndex !== index) |
| 174 selectElement.selectedIndex = index; | 174 selectElement.selectedIndex = index; |
| 175 } | 175 } |
| 176 } | 176 }; |
| 177 | 177 |
| 178 /** | 178 /** |
| 179 * @return {!WebInspector.ToolbarMenuButton} | 179 * @return {!WebInspector.ToolbarMenuButton} |
| 180 */ | 180 */ |
| 181 WebInspector.NetworkConditionsSelector.createToolbarMenuButton = function() | 181 WebInspector.NetworkConditionsSelector.createToolbarMenuButton = function() |
| 182 { | 182 { |
| 183 var button = new WebInspector.ToolbarMenuButton(appendItems); | 183 var button = new WebInspector.ToolbarMenuButton(appendItems); |
| 184 button.setGlyph(""); | 184 button.setGlyph(""); |
| 185 button.turnIntoSelect(); | 185 button.turnIntoSelect(); |
| 186 | 186 |
| (...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 221 } | 221 } |
| 222 | 222 |
| 223 /** | 223 /** |
| 224 * @param {number} index | 224 * @param {number} index |
| 225 */ | 225 */ |
| 226 function select(index) | 226 function select(index) |
| 227 { | 227 { |
| 228 selectedIndex = index; | 228 selectedIndex = index; |
| 229 button.setText(options[index].title); | 229 button.setText(options[index].title); |
| 230 } | 230 } |
| 231 } | 231 }; |
| 232 | 232 |
| 233 /** | 233 /** |
| 234 * @return {!WebInspector.ToolbarCheckbox} | 234 * @return {!WebInspector.ToolbarCheckbox} |
| 235 */ | 235 */ |
| 236 WebInspector.NetworkConditionsSelector.createOfflineToolbarCheckbox = function() | 236 WebInspector.NetworkConditionsSelector.createOfflineToolbarCheckbox = function() |
| 237 { | 237 { |
| 238 var checkbox = new WebInspector.ToolbarCheckbox(WebInspector.UIString("Offli
ne"), WebInspector.UIString("Force disconnected from network"), undefined, force
Offline); | 238 var checkbox = new WebInspector.ToolbarCheckbox(WebInspector.UIString("Offli
ne"), WebInspector.UIString("Force disconnected from network"), undefined, force
Offline); |
| 239 WebInspector.multitargetNetworkManager.addEventListener(WebInspector.Multita
rgetNetworkManager.Events.ConditionsChanged, networkConditionsChanged); | 239 WebInspector.multitargetNetworkManager.addEventListener(WebInspector.Multita
rgetNetworkManager.Events.ConditionsChanged, networkConditionsChanged); |
| 240 checkbox.setChecked(WebInspector.multitargetNetworkManager.networkConditions
() === WebInspector.NetworkManager.OfflineConditions); | 240 checkbox.setChecked(WebInspector.multitargetNetworkManager.networkConditions
() === WebInspector.NetworkManager.OfflineConditions); |
| 241 | 241 |
| (...skipping 10 matching lines...) Expand all Loading... |
| 252 } | 252 } |
| 253 | 253 |
| 254 function networkConditionsChanged() | 254 function networkConditionsChanged() |
| 255 { | 255 { |
| 256 var conditions = WebInspector.multitargetNetworkManager.networkCondition
s(); | 256 var conditions = WebInspector.multitargetNetworkManager.networkCondition
s(); |
| 257 if (conditions !== WebInspector.NetworkManager.OfflineConditions) | 257 if (conditions !== WebInspector.NetworkManager.OfflineConditions) |
| 258 lastNetworkConditions = conditions; | 258 lastNetworkConditions = conditions; |
| 259 checkbox.setChecked(conditions === WebInspector.NetworkManager.OfflineCo
nditions); | 259 checkbox.setChecked(conditions === WebInspector.NetworkManager.OfflineCo
nditions); |
| 260 } | 260 } |
| 261 return checkbox; | 261 return checkbox; |
| 262 } | 262 }; |
| 263 | 263 |
| 264 /** | 264 /** |
| 265 * @constructor | 265 * @constructor |
| 266 * @extends {WebInspector.VBox} | 266 * @extends {WebInspector.VBox} |
| 267 * @implements {WebInspector.ListWidget.Delegate} | 267 * @implements {WebInspector.ListWidget.Delegate} |
| 268 */ | 268 */ |
| 269 WebInspector.NetworkConditionsSettingsTab = function() | 269 WebInspector.NetworkConditionsSettingsTab = function() |
| 270 { | 270 { |
| 271 WebInspector.VBox.call(this, true); | 271 WebInspector.VBox.call(this, true); |
| 272 this.registerRequiredCSS("components/networkConditionsSettingsTab.css"); | 272 this.registerRequiredCSS("components/networkConditionsSettingsTab.css"); |
| 273 | 273 |
| 274 this.contentElement.createChild("div", "header").textContent = WebInspector.
UIString("Network Throttling Profiles"); | 274 this.contentElement.createChild("div", "header").textContent = WebInspector.
UIString("Network Throttling Profiles"); |
| 275 | 275 |
| 276 var addButton = createTextButton(WebInspector.UIString("Add custom profile..
."), this._addButtonClicked.bind(this), "add-conditions-button"); | 276 var addButton = createTextButton(WebInspector.UIString("Add custom profile..
."), this._addButtonClicked.bind(this), "add-conditions-button"); |
| 277 this.contentElement.appendChild(addButton); | 277 this.contentElement.appendChild(addButton); |
| 278 | 278 |
| 279 this._list = new WebInspector.ListWidget(this); | 279 this._list = new WebInspector.ListWidget(this); |
| 280 this._list.element.classList.add("conditions-list"); | 280 this._list.element.classList.add("conditions-list"); |
| 281 this._list.registerRequiredCSS("components/networkConditionsSettingsTab.css"
); | 281 this._list.registerRequiredCSS("components/networkConditionsSettingsTab.css"
); |
| 282 this._list.show(this.contentElement); | 282 this._list.show(this.contentElement); |
| 283 | 283 |
| 284 this._customSetting = WebInspector.moduleSetting("customNetworkConditions"); | 284 this._customSetting = WebInspector.moduleSetting("customNetworkConditions"); |
| 285 this._customSetting.addChangeListener(this._conditionsUpdated, this); | 285 this._customSetting.addChangeListener(this._conditionsUpdated, this); |
| 286 | 286 |
| 287 this.setDefaultFocusedElement(addButton); | 287 this.setDefaultFocusedElement(addButton); |
| 288 this.contentElement.tabIndex = 0; | 288 this.contentElement.tabIndex = 0; |
| 289 } | 289 }; |
| 290 | 290 |
| 291 WebInspector.NetworkConditionsSettingsTab.prototype = { | 291 WebInspector.NetworkConditionsSettingsTab.prototype = { |
| 292 wasShown: function() | 292 wasShown: function() |
| 293 { | 293 { |
| 294 WebInspector.VBox.prototype.wasShown.call(this); | 294 WebInspector.VBox.prototype.wasShown.call(this); |
| 295 this._conditionsUpdated(); | 295 this._conditionsUpdated(); |
| 296 }, | 296 }, |
| 297 | 297 |
| 298 _conditionsUpdated: function() | 298 _conditionsUpdated: function() |
| 299 { | 299 { |
| (...skipping 161 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 461 * @return {boolean} | 461 * @return {boolean} |
| 462 */ | 462 */ |
| 463 function latencyValidator(item, index, input) | 463 function latencyValidator(item, index, input) |
| 464 { | 464 { |
| 465 var value = input.value.trim(); | 465 var value = input.value.trim(); |
| 466 return !value || (/^[\d]+$/.test(value) && value >= 0 && value <= 10
00000); | 466 return !value || (/^[\d]+$/.test(value) && value >= 0 && value <= 10
00000); |
| 467 } | 467 } |
| 468 }, | 468 }, |
| 469 | 469 |
| 470 __proto__: WebInspector.VBox.prototype | 470 __proto__: WebInspector.VBox.prototype |
| 471 } | 471 }; |
| 472 | 472 |
| 473 /** | 473 /** |
| 474 * @constructor | 474 * @constructor |
| 475 * @implements {WebInspector.ActionDelegate} | 475 * @implements {WebInspector.ActionDelegate} |
| 476 */ | 476 */ |
| 477 WebInspector.NetworkConditionsActionDelegate = function() | 477 WebInspector.NetworkConditionsActionDelegate = function() |
| 478 { | 478 { |
| 479 } | 479 }; |
| 480 | 480 |
| 481 WebInspector.NetworkConditionsActionDelegate.prototype = { | 481 WebInspector.NetworkConditionsActionDelegate.prototype = { |
| 482 /** | 482 /** |
| 483 * @override | 483 * @override |
| 484 * @param {!WebInspector.Context} context | 484 * @param {!WebInspector.Context} context |
| 485 * @param {string} actionId | 485 * @param {string} actionId |
| 486 * @return {boolean} | 486 * @return {boolean} |
| 487 */ | 487 */ |
| 488 handleAction: function(context, actionId) | 488 handleAction: function(context, actionId) |
| 489 { | 489 { |
| 490 if (actionId === "components.network-online") { | 490 if (actionId === "components.network-online") { |
| 491 WebInspector.multitargetNetworkManager.setNetworkConditions(WebInspe
ctor.NetworkManager.NoThrottlingConditions); | 491 WebInspector.multitargetNetworkManager.setNetworkConditions(WebInspe
ctor.NetworkManager.NoThrottlingConditions); |
| 492 return true; | 492 return true; |
| 493 } | 493 } |
| 494 if (actionId === "components.network-offline") { | 494 if (actionId === "components.network-offline") { |
| 495 WebInspector.multitargetNetworkManager.setNetworkConditions(WebInspe
ctor.NetworkManager.OfflineConditions); | 495 WebInspector.multitargetNetworkManager.setNetworkConditions(WebInspe
ctor.NetworkManager.OfflineConditions); |
| 496 return true; | 496 return true; |
| 497 } | 497 } |
| 498 return false; | 498 return false; |
| 499 } | 499 } |
| 500 } | 500 }; |
| OLD | NEW |