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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: tracing/tracing/ui/extras/chrome/cc/layer_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
« no previous file with comments | « tracing/tracing/ui/extras/chrome/cc/layer_view.css ('k') | tracing/tracing/ui/extras/chrome/cc/picture_debugger.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
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/layer_view.css">
9
10 <link rel="import" href="/tracing/base/raf.html"> 8 <link rel="import" href="/tracing/base/raf.html">
11 <link rel="import" href="/tracing/base/settings.html"> 9 <link rel="import" href="/tracing/base/settings.html">
12 <link rel="import" href="/tracing/extras/chrome/cc/constants.html"> 10 <link rel="import" href="/tracing/extras/chrome/cc/constants.html">
13 <link rel="import" href="/tracing/extras/chrome/cc/picture.html"> 11 <link rel="import" href="/tracing/extras/chrome/cc/picture.html">
14 <link rel="import" href="/tracing/model/event_set.html"> 12 <link rel="import" href="/tracing/model/event_set.html">
15 <link rel="import" href="/tracing/ui/base/drag_handle.html"> 13 <link rel="import" href="/tracing/ui/base/drag_handle.html">
16 <link rel="import" href="/tracing/ui/extras/chrome/cc/layer_tree_quad_stack_view .html"> 14 <link rel="import" href="/tracing/ui/extras/chrome/cc/layer_tree_quad_stack_view .html">
17 15
18 <script> 16 <script>
19 'use strict'; 17 'use strict';
20 18
21 /** 19 /**
22 * @fileoverview LayerView coordinates graphical and analysis views of layers. 20 * @fileoverview LayerView coordinates graphical and analysis views of layers.
23 */ 21 */
24 22
25 tr.exportTo('tr.ui.e.chrome.cc', function() { 23 tr.exportTo('tr.ui.e.chrome.cc', function() {
26 const constants = tr.e.cc.constants; 24 const constants = tr.e.cc.constants;
27 25
28 /** 26 /**
29 * @constructor 27 * @constructor
30 */ 28 */
31 const LayerView = tr.ui.b.define('tr-ui-e-chrome-cc-layer-view'); 29 const LayerView = tr.ui.b.define('tr-ui-e-chrome-cc-layer-view');
32 30
33 LayerView.prototype = { 31 LayerView.prototype = {
34 __proto__: HTMLDivElement.prototype, 32 __proto__: HTMLDivElement.prototype,
35 33
36 decorate() { 34 decorate() {
35 this.style.flexDirection = 'column';
36 this.style.display = 'flex';
37 this.style.left = 0;
38 this.style.position = 'relative';
39 this.style.top = 0;
40
37 this.layerTreeQuadStackView_ = 41 this.layerTreeQuadStackView_ =
38 new tr.ui.e.chrome.cc.LayerTreeQuadStackView(); 42 new tr.ui.e.chrome.cc.LayerTreeQuadStackView();
39 this.dragBar_ = document.createElement('tr-ui-b-drag-handle'); 43 this.dragBar_ = document.createElement('tr-ui-b-drag-handle');
40 this.analysisEl_ = 44 this.analysisEl_ =
41 document.createElement('tr-ui-e-chrome-cc-layer-view-analysis'); 45 document.createElement('tr-ui-e-chrome-cc-layer-view-analysis');
46 this.analysisEl_.style.height = '150px';
47 this.analysisEl_.style.overflowY = 'auto';
42 this.analysisEl_.addEventListener('requestSelectionChange', 48 this.analysisEl_.addEventListener('requestSelectionChange',
43 this.onRequestSelectionChangeFromAnalysisEl_.bind(this)); 49 this.onRequestSelectionChangeFromAnalysisEl_.bind(this));
44 50
45 this.dragBar_.target = this.analysisEl_; 51 this.dragBar_.target = this.analysisEl_;
46 52
47 Polymer.dom(this).appendChild(this.layerTreeQuadStackView_); 53 Polymer.dom(this).appendChild(this.layerTreeQuadStackView_);
48 Polymer.dom(this).appendChild(this.dragBar_); 54 Polymer.dom(this).appendChild(this.dragBar_);
49 Polymer.dom(this).appendChild(this.analysisEl_); 55 Polymer.dom(this).appendChild(this.analysisEl_);
50 56
51 this.layerTreeQuadStackView_.addEventListener('selection-change', 57 this.layerTreeQuadStackView_.addEventListener('selection-change',
(...skipping 35 matching lines...) Expand 10 before | Expand all | Expand 10 after
87 Polymer.dom(this.analysisEl_).textContent = ''; 93 Polymer.dom(this.analysisEl_).textContent = '';
88 94
89 const layer = selection.layer; 95 const layer = selection.layer;
90 if (layer && layer.args && layer.args.pictures) { 96 if (layer && layer.args && layer.args.pictures) {
91 Polymer.dom(this.analysisEl_).appendChild( 97 Polymer.dom(this.analysisEl_).appendChild(
92 this.createPictureBtn_(layer.args.pictures)); 98 this.createPictureBtn_(layer.args.pictures));
93 } 99 }
94 100
95 const analysis = selection.createAnalysis(); 101 const analysis = selection.createAnalysis();
96 Polymer.dom(this.analysisEl_).appendChild(analysis); 102 Polymer.dom(this.analysisEl_).appendChild(analysis);
103 for (const child of this.analysisEl_.children) {
104 child.style.userSelect = 'text';
105 }
97 } else { 106 } else {
98 this.dragBar_.style.display = 'none'; 107 this.dragBar_.style.display = 'none';
99 this.analysisEl_.style.display = 'none'; 108 this.analysisEl_.style.display = 'none';
100 const analysis = Polymer.dom(this.analysisEl_).firstChild; 109 const analysis = Polymer.dom(this.analysisEl_).firstChild;
101 if (analysis) { 110 if (analysis) {
102 Polymer.dom(this.analysisEl_).removeChild(analysis); 111 Polymer.dom(this.analysisEl_).removeChild(analysis);
103 } 112 }
104 this.layerTreeQuadStackView_.style.height = 113 this.layerTreeQuadStackView_.style.height =
105 window.getComputedStyle(this).height; 114 window.getComputedStyle(this).height;
106 } 115 }
(...skipping 36 matching lines...) Expand 10 before | Expand all | Expand 10 after
143 this.layerTreeQuadStackView_.extraHighlightsByLayerId = 152 this.layerTreeQuadStackView_.extraHighlightsByLayerId =
144 extraHighlightsByLayerId; 153 extraHighlightsByLayerId;
145 } 154 }
146 }; 155 };
147 156
148 return { 157 return {
149 LayerView, 158 LayerView,
150 }; 159 };
151 }); 160 });
152 </script> 161 </script>
OLDNEW
« no previous file with comments | « tracing/tracing/ui/extras/chrome/cc/layer_view.css ('k') | tracing/tracing/ui/extras/chrome/cc/picture_debugger.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698