Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(13)

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/network/NetworkOverview.js

Issue 2573673002: DevTools: enable private field checks as a part of compilation. (Closed)
Patch Set: review comments addressed. Created 4 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
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 * @unrestricted 5 * @unrestricted
6 */ 6 */
7 Network.NetworkOverview = class extends UI.TimelineOverviewBase { 7 Network.NetworkOverview = class extends UI.TimelineOverviewBase {
8 constructor() { 8 constructor() {
9 super(); 9 super();
10 this.element.classList.add('network-overview'); 10 this.element.classList.add('network-overview');
11 11
12 /** @type {number} */ 12 /** @type {number} */
13 this._numBands = 1; 13 this._numBands = 1;
14 /** @type {number} */ 14 /** @type {number} */
15 this._windowStart = 0; 15 this._windowStart = 0;
16 /** @type {number} */ 16 /** @type {number} */
17 this._windowEnd = 0; 17 this._windowEnd = 0;
18 /** @type {boolean} */ 18 /** @type {boolean} */
19 this._restoringWindow = false; 19 this._restoringWindow = false;
20 /** @type {boolean} */ 20 /** @type {boolean} */
21 this._updateScheduled = false; 21 this._updateScheduled = false;
22 /** @type {number} */
23 this._canvasWidth = 0;
24 /** @type {number} */
25 this._canvasHeight = 0;
26 22
27 SDK.targetManager.addModelListener( 23 SDK.targetManager.addModelListener(
28 SDK.ResourceTreeModel, SDK.ResourceTreeModel.Events.Load, this._loadEven tFired, this); 24 SDK.ResourceTreeModel, SDK.ResourceTreeModel.Events.Load, this._loadEven tFired, this);
29 SDK.targetManager.addModelListener( 25 SDK.targetManager.addModelListener(
30 SDK.ResourceTreeModel, SDK.ResourceTreeModel.Events.DOMContentLoaded, th is._domContentLoadedEventFired, this); 26 SDK.ResourceTreeModel, SDK.ResourceTreeModel.Events.DOMContentLoaded, th is._domContentLoadedEventFired, this);
31 27
32 this.reset(); 28 this.reset();
33 } 29 }
34 30
35 /** 31 /**
(...skipping 68 matching lines...) Expand 10 before | Expand all | Expand 10 after
104 wasShown() { 100 wasShown() {
105 this.onResize(); 101 this.onResize();
106 } 102 }
107 103
108 /** 104 /**
109 * @override 105 * @override
110 */ 106 */
111 onResize() { 107 onResize() {
112 var width = this.element.offsetWidth; 108 var width = this.element.offsetWidth;
113 var height = this.element.offsetHeight; 109 var height = this.element.offsetHeight;
114 this._calculator.setDisplayWindow(width); 110 this.calculator().setDisplayWindow(width);
115 this.resetCanvas(); 111 this.resetCanvas();
116 var numBands = (((height - 1) / Network.NetworkOverview._bandHeight) - 1) | 0; 112 var numBands = (((height - 1) / Network.NetworkOverview._bandHeight) - 1) | 0;
117 this._numBands = (numBands > 0) ? numBands : 1; 113 this._numBands = (numBands > 0) ? numBands : 1;
118 this.scheduleUpdate(); 114 this.scheduleUpdate();
119 } 115 }
120 116
121 /** 117 /**
122 * @override 118 * @override
123 */ 119 */
124 reset() { 120 reset() {
(...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after
157 this._updateScheduled = true; 153 this._updateScheduled = true;
158 this.element.window().requestAnimationFrame(this.update.bind(this)); 154 this.element.window().requestAnimationFrame(this.update.bind(this));
159 } 155 }
160 156
161 /** 157 /**
162 * @override 158 * @override
163 */ 159 */
164 update() { 160 update() {
165 this._updateScheduled = false; 161 this._updateScheduled = false;
166 162
167 var newBoundary = 163 var calculator = this.calculator();
168 new Network.NetworkTimeBoundary(this._calculator.minimumBoundary(), this ._calculator.maximumBoundary()); 164
165 var newBoundary = new Network.NetworkTimeBoundary(calculator.minimumBoundary (), calculator.maximumBoundary());
169 if (!this._lastBoundary || !newBoundary.equals(this._lastBoundary)) { 166 if (!this._lastBoundary || !newBoundary.equals(this._lastBoundary)) {
170 var span = this._calculator.boundarySpan(); 167 var span = calculator.boundarySpan();
171 while (this._span < span) 168 while (this._span < span)
172 this._span *= 1.25; 169 this._span *= 1.25;
173 this._calculator.setBounds(this._calculator.minimumBoundary(), this._calcu lator.minimumBoundary() + this._span); 170 calculator.setBounds(calculator.minimumBoundary(), calculator.minimumBound ary() + this._span);
174 this._lastBoundary = 171 this._lastBoundary = new Network.NetworkTimeBoundary(calculator.minimumBou ndary(), calculator.maximumBoundary());
175 new Network.NetworkTimeBoundary(this._calculator.minimumBoundary(), th is._calculator.maximumBoundary());
176 if (this._windowStart || this._windowEnd) { 172 if (this._windowStart || this._windowEnd) {
177 this._restoringWindow = true; 173 this._restoringWindow = true;
178 var startTime = this._calculator.minimumBoundary(); 174 var startTime = calculator.minimumBoundary();
179 var totalTime = this._calculator.boundarySpan(); 175 var totalTime = calculator.boundarySpan();
180 var left = (this._windowStart - startTime) / totalTime; 176 var left = (this._windowStart - startTime) / totalTime;
181 var right = (this._windowEnd - startTime) / totalTime; 177 var right = (this._windowEnd - startTime) / totalTime;
182 this._restoringWindow = false; 178 this._restoringWindow = false;
183 } 179 }
184 } 180 }
185 181
186 var context = this._canvas.getContext('2d'); 182 var context = this.context();
187 var calculator = this._calculator;
188 var linesByType = {}; 183 var linesByType = {};
189 var paddingTop = 2; 184 var paddingTop = 2;
190 185
191 /** 186 /**
192 * @param {string} type 187 * @param {string} type
193 * @param {string} strokeStyle 188 * @param {string} strokeStyle
194 */ 189 */
195 function drawLines(type, strokeStyle) { 190 function drawLines(type, strokeStyle) {
196 var lines = linesByType[type]; 191 var lines = linesByType[type];
197 if (!lines) 192 if (!lines)
(...skipping 28 matching lines...) Expand all
226 lines.push(y, start, end); 221 lines.push(y, start, end);
227 } 222 }
228 223
229 var requests = this._requestsList; 224 var requests = this._requestsList;
230 var n = requests.length; 225 var n = requests.length;
231 for (var i = 0; i < n; ++i) { 226 for (var i = 0; i < n; ++i) {
232 var request = requests[i]; 227 var request = requests[i];
233 var band = this._bandId(request.connectionId); 228 var band = this._bandId(request.connectionId);
234 var y = (band === -1) ? 0 : (band % this._numBands + 1); 229 var y = (band === -1) ? 0 : (band % this._numBands + 1);
235 var timeRanges = 230 var timeRanges =
236 Network.RequestTimingView.calculateRequestTimeRanges(request, this._ca lculator.minimumBoundary()); 231 Network.RequestTimingView.calculateRequestTimeRanges(request, this.cal culator().minimumBoundary());
237 for (var j = 0; j < timeRanges.length; ++j) { 232 for (var j = 0; j < timeRanges.length; ++j) {
238 var type = timeRanges[j].name; 233 var type = timeRanges[j].name;
239 if (band !== -1 || type === Network.RequestTimeRangeNames.Total) 234 if (band !== -1 || type === Network.RequestTimeRangeNames.Total)
240 addLine(type, y, timeRanges[j].start * 1000, timeRanges[j].end * 1000) ; 235 addLine(type, y, timeRanges[j].start * 1000, timeRanges[j].end * 1000) ;
241 } 236 }
242 } 237 }
243 238
244 context.clearRect(0, 0, this._canvas.width, this._canvas.height); 239 context.clearRect(0, 0, this.width(), this.height());
245 context.save(); 240 context.save();
246 context.scale(window.devicePixelRatio, window.devicePixelRatio); 241 context.scale(window.devicePixelRatio, window.devicePixelRatio);
247 context.lineWidth = 2; 242 context.lineWidth = 2;
248 drawLines(Network.RequestTimeRangeNames.Total, '#CCCCCC'); 243 drawLines(Network.RequestTimeRangeNames.Total, '#CCCCCC');
249 drawLines(Network.RequestTimeRangeNames.Blocking, '#AAAAAA'); 244 drawLines(Network.RequestTimeRangeNames.Blocking, '#AAAAAA');
250 drawLines(Network.RequestTimeRangeNames.Connecting, '#FF9800'); 245 drawLines(Network.RequestTimeRangeNames.Connecting, '#FF9800');
251 drawLines(Network.RequestTimeRangeNames.ServiceWorker, '#FF9800'); 246 drawLines(Network.RequestTimeRangeNames.ServiceWorker, '#FF9800');
252 drawLines(Network.RequestTimeRangeNames.ServiceWorkerPreparation, '#FF9800') ; 247 drawLines(Network.RequestTimeRangeNames.ServiceWorkerPreparation, '#FF9800') ;
253 drawLines(Network.RequestTimeRangeNames.Push, '#8CDBff'); 248 drawLines(Network.RequestTimeRangeNames.Push, '#8CDBff');
254 drawLines(Network.RequestTimeRangeNames.Proxy, '#A1887F'); 249 drawLines(Network.RequestTimeRangeNames.Proxy, '#A1887F');
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after
289 } 284 }
290 context.restore(); 285 context.restore();
291 } 286 }
292 }; 287 };
293 288
294 /** @type {number} */ 289 /** @type {number} */
295 Network.NetworkOverview._bandHeight = 3; 290 Network.NetworkOverview._bandHeight = 3;
296 291
297 /** @typedef {{start: number, end: number}} */ 292 /** @typedef {{start: number, end: number}} */
298 Network.NetworkOverview.Window; 293 Network.NetworkOverview.Window;
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698