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

Side by Side Diff: tracing/tracing/ui/extras/chrome/cc/picture_ops_chart_view.html

Issue 3017523002: Fix uses of /deep/ in trace viewer. (Closed)
Patch Set: fix tests Created 3 years, 2 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 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <!-- 2 <!--
3 Copyright (c) 2013 The Chromium Authors. All rights reserved. 3 Copyright (c) 2013 The Chromium Authors. All rights reserved.
4 Use of this source code is governed by a BSD-style license that can be 4 Use of this source code is governed by a BSD-style license that can be
5 found in the LICENSE file. 5 found in the LICENSE file.
6 --> 6 -->
7 7
8 <link rel="stylesheet" href="/tracing/ui/extras/chrome/cc/picture_ops_chart_view .css">
9
10 <link rel="import" href="/tracing/ui/base/dom_helpers.html"> 8 <link rel="import" href="/tracing/ui/base/dom_helpers.html">
11 9
12 <script> 10 <script>
13 'use strict'; 11 'use strict';
14 12
15 tr.exportTo('tr.ui.e.chrome.cc', function() { 13 tr.exportTo('tr.ui.e.chrome.cc', function() {
16 const BAR_PADDING = 1; 14 const BAR_PADDING = 1;
17 const BAR_WIDTH = 5; 15 const BAR_WIDTH = 5;
18 const CHART_PADDING_LEFT = 65; 16 const CHART_PADDING_LEFT = 65;
19 const CHART_PADDING_RIGHT = 30; 17 const CHART_PADDING_RIGHT = 30;
(...skipping 14 matching lines...) Expand all
34 * 32 *
35 * @constructor 33 * @constructor
36 */ 34 */
37 const PictureOpsChartView = 35 const PictureOpsChartView =
38 tr.ui.b.define('tr-ui-e-chrome-cc-picture-ops-chart-view'); 36 tr.ui.b.define('tr-ui-e-chrome-cc-picture-ops-chart-view');
39 37
40 PictureOpsChartView.prototype = { 38 PictureOpsChartView.prototype = {
41 __proto__: HTMLDivElement.prototype, 39 __proto__: HTMLDivElement.prototype,
42 40
43 decorate() { 41 decorate() {
42 this.style.display = 'block';
43 this.style.height = '180px';
44 this.style.margin = 0;
45 this.style.padding = 0;
46 this.style.position = 'relative';
47
44 this.picture_ = undefined; 48 this.picture_ = undefined;
45 this.pictureOps_ = undefined; 49 this.pictureOps_ = undefined;
46 this.opCosts_ = undefined; 50 this.opCosts_ = undefined;
47 51
48 this.chartScale_ = window.devicePixelRatio; 52 this.chartScale_ = window.devicePixelRatio;
49 53
50 this.chart_ = document.createElement('canvas'); 54 this.chart_ = document.createElement('canvas');
51 this.chartCtx_ = this.chart_.getContext('2d'); 55 this.chartCtx_ = this.chart_.getContext('2d');
52 Polymer.dom(this).appendChild(this.chart_); 56 Polymer.dom(this).appendChild(this.chart_);
53 57
(...skipping 10 matching lines...) Expand all
64 this.chart_.addEventListener('click', this.onClick_.bind(this)); 68 this.chart_.addEventListener('click', this.onClick_.bind(this));
65 this.chart_.addEventListener('mousemove', this.onMouseMove_.bind(this)); 69 this.chart_.addEventListener('mousemove', this.onMouseMove_.bind(this));
66 70
67 this.usePercentileScale_ = false; 71 this.usePercentileScale_ = false;
68 this.usePercentileScaleCheckbox_ = tr.ui.b.createCheckBox( 72 this.usePercentileScaleCheckbox_ = tr.ui.b.createCheckBox(
69 this, 'usePercentileScale', 73 this, 'usePercentileScale',
70 'PictureOpsChartView.usePercentileScale', false, 74 'PictureOpsChartView.usePercentileScale', false,
71 'Limit to 95%-ile'); 75 'Limit to 95%-ile');
72 Polymer.dom(this.usePercentileScaleCheckbox_).classList.add( 76 Polymer.dom(this.usePercentileScaleCheckbox_).classList.add(
73 'use-percentile-scale'); 77 'use-percentile-scale');
78 this.usePercentileScaleCheckbox_.style.position = 'absolute';
79 this.usePercentileScaleCheckbox_.style.left = 0;
80 this.usePercentileScaleCheckbox_.style.top = 0;
74 Polymer.dom(this).appendChild(this.usePercentileScaleCheckbox_); 81 Polymer.dom(this).appendChild(this.usePercentileScaleCheckbox_);
75 }, 82 },
76 83
77 get dimensionsHaveChanged() { 84 get dimensionsHaveChanged() {
78 return this.dimensionsHaveChanged_; 85 return this.dimensionsHaveChanged_;
79 }, 86 },
80 87
81 set dimensionsHaveChanged(dimensionsHaveChanged) { 88 set dimensionsHaveChanged(dimensionsHaveChanged) {
82 this.dimensionsHaveChanged_ = dimensionsHaveChanged; 89 this.dimensionsHaveChanged_ = dimensionsHaveChanged;
83 }, 90 },
(...skipping 399 matching lines...) Expand 10 before | Expand all | Expand 10 after
483 this.chartCtx_.fillText('No timing data available.', 490 this.chartCtx_.fillText('No timing data available.',
484 this.chartWidth_ * 0.5, this.chartHeight_ * 0.5); 491 this.chartWidth_ * 0.5, this.chartHeight_ * 0.5);
485 } 492 }
486 }; 493 };
487 494
488 return { 495 return {
489 PictureOpsChartView, 496 PictureOpsChartView,
490 }; 497 };
491 }); 498 });
492 </script> 499 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698