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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: tracing/tracing/ui/extras/chrome/cc/layer_tree_quad_stack_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_tree_host_impl_view.html ('k') | tracing/tracing/ui/extras/chrome/cc/layer_view.css » ('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) 2015 The Chromium Authors. All rights reserved. 3 Copyright (c) 2015 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="import" href="/tracing/base/color.html"> 8 <link rel="import" href="/tracing/base/color.html">
9 <link rel="import" href="/tracing/base/math/quad.html"> 9 <link rel="import" href="/tracing/base/math/quad.html">
10 <link rel="import" href="/tracing/base/math/range.html"> 10 <link rel="import" href="/tracing/base/math/range.html">
11 <link rel="import" href="/tracing/base/raf.html"> 11 <link rel="import" href="/tracing/base/raf.html">
12 <link rel="import" href="/tracing/base/unit_scale.html"> 12 <link rel="import" href="/tracing/base/unit_scale.html">
13 <link rel="import" href="/tracing/extras/chrome/cc/debug_colors.html"> 13 <link rel="import" href="/tracing/extras/chrome/cc/debug_colors.html">
14 <link rel="import" href="/tracing/extras/chrome/cc/picture.html"> 14 <link rel="import" href="/tracing/extras/chrome/cc/picture.html">
15 <link rel="import" href="/tracing/extras/chrome/cc/render_pass.html"> 15 <link rel="import" href="/tracing/extras/chrome/cc/render_pass.html">
16 <link rel="import" href="/tracing/extras/chrome/cc/tile.html"> 16 <link rel="import" href="/tracing/extras/chrome/cc/tile.html">
17 <link rel="import" href="/tracing/extras/chrome/cc/util.html"> 17 <link rel="import" href="/tracing/extras/chrome/cc/util.html">
18 <link rel="import" href="/tracing/model/event_set.html"> 18 <link rel="import" href="/tracing/model/event_set.html">
19 <link rel="import" href="/tracing/ui/base/info_bar.html"> 19 <link rel="import" href="/tracing/ui/base/info_bar.html">
20 <link rel="import" href="/tracing/ui/base/quad_stack_view.html"> 20 <link rel="import" href="/tracing/ui/base/quad_stack_view.html">
21 <link rel="import" href="/tracing/ui/base/utils.html"> 21 <link rel="import" href="/tracing/ui/base/utils.html">
22 22
23 <style>
24 * /deep/ tr-ui-e-chrome-cc-layer-tree-quad-stack-view {
25 position: relative;
26 }
27
28 * /deep/ tr-ui-e-chrome-cc-layer-tree-quad-stack-view > top-controls {
29 flex: 0 0 auto;
30 background-image: -webkit-gradient(linear,
31 0 0, 100% 0,
32 from(#E5E5E5),
33 to(#D1D1D1));
34 border-bottom: 1px solid #8e8e8e;
35 border-top: 1px solid white;
36 display: flex;
37 flex-flow: row wrap;
38 flex-direction: row;
39 font-size: 14px;
40 padding-left: 2px;
41 overflow: hidden;
42 }
43
44 * /deep/ tr-ui-e-chrome-cc-layer-tree-quad-stack-view >
45 top-controls input[type='checkbox'] {
46 vertical-align: -2px;
47 }
48
49 * /deep/ tr-ui-e-chrome-cc-layer-tree-quad-stack-view > .what-rasterized {
50 color: -webkit-link;
51 cursor: pointer;
52 text-decoration: underline;
53 position: absolute;
54 bottom: 10px;
55 left: 10px;
56 }
57
58 * /deep/ tr-ui-e-chrome-cc-layer-tree-quad-stack-view > #input-event {
59 background-image: url('./images/input-event.png');
60 display: none;
61 }
62 </style>
63
64 <template id='tr-ui-e-chrome-cc-layer-tree-quad-stack-view-template'> 23 <template id='tr-ui-e-chrome-cc-layer-tree-quad-stack-view-template'>
24 <style>
25 #input-event {
26 background-image: url('./images/input-event.png');
27 display: none;
28 }
29 </style>
65 <img id='input-event'/> 30 <img id='input-event'/>
66 </template> 31 </template>
67 32
68 <script> 33 <script>
69 'use strict'; 34 'use strict';
70 35
71 /** 36 /**
72 * @fileoverview Graphical view of LayerTreeImpl, with controls for 37 * @fileoverview Graphical view of LayerTreeImpl, with controls for
73 * type of layer content shown and info bar for content-loading warnings. 38 * type of layer content shown and info bar for content-loading warnings.
74 */ 39 */
(...skipping 17 matching lines...) Expand all
92 /** 57 /**
93 * @constructor 58 * @constructor
94 */ 59 */
95 const LayerTreeQuadStackView = 60 const LayerTreeQuadStackView =
96 tr.ui.b.define('tr-ui-e-chrome-cc-layer-tree-quad-stack-view'); 61 tr.ui.b.define('tr-ui-e-chrome-cc-layer-tree-quad-stack-view');
97 62
98 LayerTreeQuadStackView.prototype = { 63 LayerTreeQuadStackView.prototype = {
99 __proto__: HTMLDivElement.prototype, 64 __proto__: HTMLDivElement.prototype,
100 65
101 decorate() { 66 decorate() {
67 this.style.flexGrow = 1;
68 this.style.flexShrink = 1;
69 this.style.flexBasis = '100%';
70 this.style.flexDirection = 'column';
71 this.style.minHeight = 0;
72 this.style.display = 'flex';
73 this.style.width = '100%';
74
102 this.isRenderPassQuads_ = false; 75 this.isRenderPassQuads_ = false;
103 this.pictureAsImageData_ = {}; // Maps picture.guid to PictureAsImageData. 76 this.pictureAsImageData_ = {}; // Maps picture.guid to PictureAsImageData.
104 this.messages_ = []; 77 this.messages_ = [];
105 this.controls_ = document.createElement('top-controls'); 78 this.controls_ = document.createElement('top-controls');
79 this.controls_.style.flexGrow = 0;
80 this.controls_.style.flexShrink = 0;
81 this.controls_.style.flexBasis = 'auto';
82 this.controls_.style.backgroundImage =
83 '-webkit-gradient(linear, 0 0, 100% 0, from(#E5E5E5), to(#D1D1D1))';
84 this.controls_.style.borderBottom = '1px solid #8e8e8e';
85 this.controls_.style.borderTop = '1px solid white';
86 this.controls_.style.display = 'flex';
87 this.controls_.style.flexDirection = 'row';
88 this.controls_.style.flexWrap = 'wrap';
89 this.controls_.style.fontSize = '14px';
90 this.controls_.style.paddingLeft = '2px';
91 this.controls_.style.overflow = 'hidden';
106 this.infoBar_ = document.createElement('tr-ui-b-info-bar'); 92 this.infoBar_ = document.createElement('tr-ui-b-info-bar');
107 this.quadStackView_ = new tr.ui.b.QuadStackView(); 93 this.quadStackView_ = new tr.ui.b.QuadStackView();
108 this.quadStackView_.addEventListener( 94 this.quadStackView_.addEventListener(
109 'selectionchange', this.onQuadStackViewSelectionChange_.bind(this)); 95 'selectionchange', this.onQuadStackViewSelectionChange_.bind(this));
110 this.extraHighlightsByLayerId_ = undefined; 96 this.extraHighlightsByLayerId_ = undefined;
111 this.inputEventImageData_ = undefined; 97 this.inputEventImageData_ = undefined;
112 98
113 const m = tr.ui.b.MOUSE_SELECTOR_MODE; 99 const m = tr.ui.b.MOUSE_SELECTOR_MODE;
114 const mms = this.quadStackView_.mouseModeSelector; 100 const mms = this.quadStackView_.mouseModeSelector;
115 mms.settingsKey = 'tr.e.cc.layerTreeQuadStackView.mouseModeSelector'; 101 mms.settingsKey = 'tr.e.cc.layerTreeQuadStackView.mouseModeSelector';
(...skipping 1087 matching lines...) Expand 10 before | Expand all | Expand 10 after
1203 event.selection = new tr.model.EventSet(tasks); 1189 event.selection = new tr.model.EventSet(tasks);
1204 this.dispatchEvent(event); 1190 this.dispatchEvent(event);
1205 } 1191 }
1206 }; 1192 };
1207 1193
1208 return { 1194 return {
1209 LayerTreeQuadStackView, 1195 LayerTreeQuadStackView,
1210 }; 1196 };
1211 }); 1197 });
1212 </script> 1198 </script>
OLDNEW
« no previous file with comments | « tracing/tracing/ui/extras/chrome/cc/layer_tree_host_impl_view.html ('k') | tracing/tracing/ui/extras/chrome/cc/layer_view.css » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698