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

Side by Side Diff: third_party/WebKit/Source/devtools/front_end/perf_ui/TimelineGrid.js

Issue 2623743002: DevTools: extract modules (non-extensions) (Closed)
Patch Set: rebaseline Created 3 years, 11 months 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 /* 1 /*
2 * Copyright (C) 2007, 2008 Apple Inc. All rights reserved. 2 * Copyright (C) 2007, 2008 Apple Inc. All rights reserved.
3 * Copyright (C) 2008, 2009 Anthony Ricaud <rik@webkit.org> 3 * Copyright (C) 2008, 2009 Anthony Ricaud <rik@webkit.org>
4 * Copyright (C) 2009 Google Inc. All rights reserved. 4 * Copyright (C) 2009 Google Inc. All rights reserved.
5 * 5 *
6 * Redistribution and use in source and binary forms, with or without 6 * Redistribution and use in source and binary forms, with or without
7 * modification, are permitted provided that the following conditions 7 * modification, are permitted provided that the following conditions
8 * are met: 8 * are met:
9 * 9 *
10 * 1. Redistributions of source code must retain the above copyright 10 * 1. Redistributions of source code must retain the above copyright
(...skipping 13 matching lines...) Expand all
24 * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; 24 * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
25 * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND 25 * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
26 * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 26 * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
27 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF 27 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF
28 * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 28 * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
29 */ 29 */
30 30
31 /** 31 /**
32 * @unrestricted 32 * @unrestricted
33 */ 33 */
34 UI.TimelineGrid = class { 34 PerfUI.TimelineGrid = class {
35 constructor() { 35 constructor() {
36 this.element = createElement('div'); 36 this.element = createElement('div');
37 UI.appendStyle(this.element, 'ui_lazy/timelineGrid.css'); 37 UI.appendStyle(this.element, 'perf_ui/timelineGrid.css');
38 38
39 this._dividersElement = this.element.createChild('div', 'resources-dividers' ); 39 this._dividersElement = this.element.createChild('div', 'resources-dividers' );
40 40
41 this._gridHeaderElement = createElement('div'); 41 this._gridHeaderElement = createElement('div');
42 this._gridHeaderElement.classList.add('timeline-grid-header'); 42 this._gridHeaderElement.classList.add('timeline-grid-header');
43 this._eventDividersElement = this._gridHeaderElement.createChild('div', 'res ources-event-dividers'); 43 this._eventDividersElement = this._gridHeaderElement.createChild('div', 'res ources-event-dividers');
44 this._dividersLabelBarElement = this._gridHeaderElement.createChild('div', ' resources-dividers-label-bar'); 44 this._dividersLabelBarElement = this._gridHeaderElement.createChild('div', ' resources-dividers-label-bar');
45 this.element.appendChild(this._gridHeaderElement); 45 this.element.appendChild(this._gridHeaderElement);
46 } 46 }
47 47
48 /** 48 /**
49 * @param {!UI.TimelineGrid.Calculator} calculator 49 * @param {!PerfUI.TimelineGrid.Calculator} calculator
50 * @param {number=} freeZoneAtLeft 50 * @param {number=} freeZoneAtLeft
51 * @return {!{offsets: !Array.<number>, precision: number}} 51 * @return {!{offsets: !Array.<number>, precision: number}}
52 */ 52 */
53 static calculateDividerOffsets(calculator, freeZoneAtLeft) { 53 static calculateDividerOffsets(calculator, freeZoneAtLeft) {
54 /** @const */ var minGridSlicePx = 64; // minimal distance between grid lin es. 54 /** @const */ var minGridSlicePx = 64; // minimal distance between grid lin es.
55 55
56 var clientWidth = calculator.computePosition(calculator.maximumBoundary()); 56 var clientWidth = calculator.computePosition(calculator.maximumBoundary());
57 var dividersCount = clientWidth / minGridSlicePx; 57 var dividersCount = clientWidth / minGridSlicePx;
58 var gridSliceTime = calculator.boundarySpan() / dividersCount; 58 var gridSliceTime = calculator.boundarySpan() / dividersCount;
59 var pixelsPerTime = clientWidth / calculator.boundarySpan(); 59 var pixelsPerTime = clientWidth / calculator.boundarySpan();
(...skipping 28 matching lines...) Expand all
88 if (calculator.computePosition(time) < freeZoneAtLeft) 88 if (calculator.computePosition(time) < freeZoneAtLeft)
89 continue; 89 continue;
90 offsets.push(time); 90 offsets.push(time);
91 } 91 }
92 92
93 return {offsets: offsets, precision: Math.max(0, -Math.floor(Math.log(gridSl iceTime * 1.01) / Math.LN10))}; 93 return {offsets: offsets, precision: Math.max(0, -Math.floor(Math.log(gridSl iceTime * 1.01) / Math.LN10))};
94 } 94 }
95 95
96 /** 96 /**
97 * @param {!CanvasRenderingContext2D} context 97 * @param {!CanvasRenderingContext2D} context
98 * @param {!UI.TimelineGrid.Calculator} calculator 98 * @param {!PerfUI.TimelineGrid.Calculator} calculator
99 * @param {number} paddingTop 99 * @param {number} paddingTop
100 * @param {number=} headerHeight 100 * @param {number=} headerHeight
101 * @param {number=} freeZoneAtLeft 101 * @param {number=} freeZoneAtLeft
102 */ 102 */
103 static drawCanvasGrid(context, calculator, paddingTop, headerHeight, freeZoneA tLeft) { 103 static drawCanvasGrid(context, calculator, paddingTop, headerHeight, freeZoneA tLeft) {
104 context.save(); 104 context.save();
105 var ratio = window.devicePixelRatio; 105 var ratio = window.devicePixelRatio;
106 context.scale(ratio, ratio); 106 context.scale(ratio, ratio);
107 var width = context.canvas.width / window.devicePixelRatio; 107 var width = context.canvas.width / window.devicePixelRatio;
108 var height = context.canvas.height / window.devicePixelRatio; 108 var height = context.canvas.height / window.devicePixelRatio;
109 var dividersData = UI.TimelineGrid.calculateDividerOffsets(calculator); 109 var dividersData = PerfUI.TimelineGrid.calculateDividerOffsets(calculator);
110 var dividerOffsets = dividersData.offsets; 110 var dividerOffsets = dividersData.offsets;
111 var precision = dividersData.precision; 111 var precision = dividersData.precision;
112 112
113 if (headerHeight) { 113 if (headerHeight) {
114 context.fillStyle = UI.themeSupport.patchColor('rgba(255, 255, 255, 0.5)', UI.ThemeSupport.ColorUsage.Background); 114 context.fillStyle = UI.themeSupport.patchColor('rgba(255, 255, 255, 0.5)', UI.ThemeSupport.ColorUsage.Background);
115 context.fillRect(0, 0, width, headerHeight); 115 context.fillRect(0, 0, width, headerHeight);
116 } 116 }
117 117
118 context.fillStyle = UI.themeSupport.patchColor('#333', UI.ThemeSupport.Color Usage.Foreground); 118 context.fillStyle = UI.themeSupport.patchColor('#333', UI.ThemeSupport.Color Usage.Foreground);
119 context.strokeStyle = UI.themeSupport.patchColor('rgba(0, 0, 0, 0.1)', UI.Th emeSupport.ColorUsage.Foreground); 119 context.strokeStyle = UI.themeSupport.patchColor('rgba(0, 0, 0, 0.1)', UI.Th emeSupport.ColorUsage.Foreground);
(...skipping 27 matching lines...) Expand all
147 get dividersLabelBarElement() { 147 get dividersLabelBarElement() {
148 return this._dividersLabelBarElement; 148 return this._dividersLabelBarElement;
149 } 149 }
150 150
151 removeDividers() { 151 removeDividers() {
152 this._dividersElement.removeChildren(); 152 this._dividersElement.removeChildren();
153 this._dividersLabelBarElement.removeChildren(); 153 this._dividersLabelBarElement.removeChildren();
154 } 154 }
155 155
156 /** 156 /**
157 * @param {!UI.TimelineGrid.Calculator} calculator 157 * @param {!PerfUI.TimelineGrid.Calculator} calculator
158 * @param {number=} freeZoneAtLeft 158 * @param {number=} freeZoneAtLeft
159 * @return {boolean} 159 * @return {boolean}
160 */ 160 */
161 updateDividers(calculator, freeZoneAtLeft) { 161 updateDividers(calculator, freeZoneAtLeft) {
162 var dividersData = UI.TimelineGrid.calculateDividerOffsets(calculator, freeZ oneAtLeft); 162 var dividersData = PerfUI.TimelineGrid.calculateDividerOffsets(calculator, f reeZoneAtLeft);
163 var dividerOffsets = dividersData.offsets; 163 var dividerOffsets = dividersData.offsets;
164 var precision = dividersData.precision; 164 var precision = dividersData.precision;
165 165
166 var dividersElementClientWidth = this._dividersElement.clientWidth; 166 var dividersElementClientWidth = this._dividersElement.clientWidth;
167 167
168 // Reuse divider elements and labels. 168 // Reuse divider elements and labels.
169 var divider = /** @type {?Element} */ (this._dividersElement.firstChild); 169 var divider = /** @type {?Element} */ (this._dividersElement.firstChild);
170 var dividerLabelBar = /** @type {?Element} */ (this._dividersLabelBarElement .firstChild); 170 var dividerLabelBar = /** @type {?Element} */ (this._dividersLabelBarElement .firstChild);
171 171
172 for (var i = 0; i < dividerOffsets.length; ++i) { 172 for (var i = 0; i < dividerOffsets.length; ++i) {
(...skipping 80 matching lines...) Expand 10 before | Expand all | Expand 10 after
253 setScrollTop(scrollTop) { 253 setScrollTop(scrollTop) {
254 this._dividersLabelBarElement.style.top = scrollTop + 'px'; 254 this._dividersLabelBarElement.style.top = scrollTop + 'px';
255 this._eventDividersElement.style.top = scrollTop + 'px'; 255 this._eventDividersElement.style.top = scrollTop + 'px';
256 } 256 }
257 }; 257 };
258 258
259 259
260 /** 260 /**
261 * @interface 261 * @interface
262 */ 262 */
263 UI.TimelineGrid.Calculator = function() {}; 263 PerfUI.TimelineGrid.Calculator = function() {};
264 264
265 UI.TimelineGrid.Calculator.prototype = { 265 PerfUI.TimelineGrid.Calculator.prototype = {
266 /** 266 /**
267 * @return {number} 267 * @return {number}
268 */ 268 */
269 paddingLeft() {}, 269 paddingLeft() {},
270 270
271 /** 271 /**
272 * @param {number} time 272 * @param {number} time
273 * @return {number} 273 * @return {number}
274 */ 274 */
275 computePosition(time) {}, 275 computePosition(time) {},
(...skipping 10 matching lines...) Expand all
286 286
287 /** @return {number} */ 287 /** @return {number} */
288 zeroTime() {}, 288 zeroTime() {},
289 289
290 /** @return {number} */ 290 /** @return {number} */
291 maximumBoundary() {}, 291 maximumBoundary() {},
292 292
293 /** @return {number} */ 293 /** @return {number} */
294 boundarySpan() {} 294 boundarySpan() {}
295 }; 295 };
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698