OLD | NEW |
| (Empty) |
1 <link rel="import" href="../../../../packages/polymer/polymer.html"> | |
2 <link rel="import" href="function_ref.html"> | |
3 <link rel="import" href="instance_ref.html"> | |
4 <link rel="import" href="observatory_element.html"> | |
5 <link rel="import" href="nav_bar.html"> | |
6 <link rel="import" href="script_ref.html"> | |
7 | |
8 <polymer-element name="code-view" extends="observatory-element"> | |
9 <template> | |
10 <link rel="stylesheet" href="css/shared.css"> | |
11 <style> | |
12 div.flex-row:hover { | |
13 background-color: #FFF3E3; | |
14 } | |
15 | |
16 .highlight { | |
17 background-color: #FFF3E3; | |
18 } | |
19 | |
20 .tooltip { | |
21 display: block; | |
22 position: absolute; | |
23 visibility: hidden; | |
24 opacity: 0; | |
25 transition: visibility 0s linear 0.5s; | |
26 transition: opacity .4s ease-in-out; | |
27 } | |
28 | |
29 .flex-row:hover .tooltip { | |
30 display: block; | |
31 position: absolute; | |
32 top: 100%; | |
33 visibility: visible; | |
34 z-index: 999; | |
35 width: auto; | |
36 min-width: 400px; | |
37 color: #ffffff; | |
38 background-color: #FFF3E3; | |
39 border-bottom-right-radius: 8px; | |
40 border-bottom-left-radius: 8px; | |
41 transition: visibility 0s linear 0.5s; | |
42 transition: opacity .4s ease-in-out; | |
43 opacity: 1; | |
44 } | |
45 | |
46 .descriptor-address { | |
47 color: #0489c3; | |
48 } | |
49 | |
50 .snippet { | |
51 text-align: center; | |
52 margin-left: 10px; | |
53 margin-right: 10px; | |
54 } | |
55 | |
56 </style> | |
57 <nav-bar> | |
58 <top-nav-menu></top-nav-menu> | |
59 <isolate-nav-menu isolate="{{ code.isolate }}"></isolate-nav-menu> | |
60 <nav-menu link="{{ code.link }}" anchor="{{ code.name }}" last="{{ true }}
"></nav-menu> | |
61 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
62 <nav-control></nav-control> | |
63 </nav-bar> | |
64 <div class="content"> | |
65 <template if="{{ code.isDartCode && code.isOptimized }}"> | |
66 <h1>Optimized code for {{ code.name }}</h1> | |
67 </template> | |
68 <template if="{{ !(code.isDartCode && code.isOptimized) }}"> | |
69 <h1>Code for {{ code.name }}</h1> | |
70 </template> | |
71 <div class="memberList"> | |
72 <div class="memberItem"> | |
73 <div class="memberName">Kind</div> | |
74 <div class="memberValue">{{code.kind}}</div> | |
75 </div> | |
76 <template if="{{ code.isDartCode }}"> | |
77 <div class="memberItem"> | |
78 <div class="memberName">Optimized</div> | |
79 <div class="memberValue">{{code.isOptimized}}</div> | |
80 </div> | |
81 </template> | |
82 <div class="memberItem"> | |
83 <div class="memberName">Function</div> | |
84 <div class="memberValue"> | |
85 <function-ref ref="{{code.function}}"> | |
86 </function-ref> | |
87 </div> | |
88 </div> | |
89 <div class="memberItem"> | |
90 <div class="memberName">Inclusive</div> | |
91 <div class="memberValue">{{ code.formattedInclusiveTicks }}</div> | |
92 </div> | |
93 <div class="memberItem"> | |
94 <div class="memberName">Exclusive</div> | |
95 <div class="memberValue">{{ code.formattedExclusiveTicks }}</div> | |
96 </div> | |
97 <div class="memberItem"> | |
98 <div class="memberName">Constant object pool</div> | |
99 <div class="memberValue"> | |
100 <any-service-ref ref="{{ code.objectPool }}"></any-service-ref> | |
101 </div> | |
102 </div> | |
103 </div> | |
104 </div> | |
105 <hr> | |
106 <div class="content"> | |
107 <template if="{{ code.hasDisassembly }}"> | |
108 <div class="flex-row"> | |
109 <div class="flex-item-fixed-2-12 memberHeader">Inclusive</div> | |
110 <div class="flex-item-fixed-2-12 memberHeader">Exclusive</div> | |
111 <div class="flex-item-fixed-2-12 memberHeader">Address</div> | |
112 <div class="flex-item-fixed-6-12 memberHeader">Disassembly</div> | |
113 </div> | |
114 </template> | |
115 <template repeat="{{ instruction in code.instructions }}"> | |
116 <div class="flex-row" on-mouseover="{{ mouseOver }}" on-mouseout="{{ mou
seOut }}" data-jump-target="{{ instruction.jumpTarget.address }}" id="addr-{{ in
struction.address }}" style="position: relative"> | |
117 <template if="{{ instruction.isComment }}"> | |
118 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Inclusive(code) }}</div> | |
119 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Exclusive(code) }}</div> | |
120 <div class="flex-item-fixed-8-12 monospace">{{ instruction.human }}<
/div> | |
121 </template> | |
122 <template if="{{ !instruction.isComment }}"> | |
123 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Inclusive(code) }}</div> | |
124 <div class="flex-item-fixed-2-12 monospace">{{ instruction.formatted
Exclusive(code) }}</div> | |
125 <template if="{{ instruction.hasDescriptors }}"> | |
126 <div class="flex-item-fixed-2-12 monospace descriptor-address"> | |
127 <div class="tooltip"> | |
128 <template repeat="{{ descriptor in instruction.descriptors }}"
> | |
129 <div class="memberList"> | |
130 <div class="memberItem"> | |
131 <div class="memberName">Kind</div> | |
132 <div class="memberValue">{{ descriptor.kind }}</div> | |
133 </div> | |
134 <div class="memberItem"> | |
135 <div class="memberName">Deoptimization ID</div> | |
136 <div class="memberValue">{{ descriptor.formattedDeoptId()
}}</div> | |
137 </div> | |
138 <template if="{{ descriptor.script != null }}"> | |
139 <div class="memberItem"> | |
140 <div class="memberName">Script</div> | |
141 <div class="memberValue"><script-ref ref="{{ descriptor
.script }}" pos="{{ descriptor.tokenPos }}"></script-ref></div> | |
142 </div> | |
143 </template> | |
144 </div> | |
145 <template if="{{ descriptor.script != null }}"> | |
146 <div class="snippet monospace"> | |
147 <span>{{ descriptor.formattedLine }}</span> | |
148 </div> | |
149 </template> | |
150 </template> | |
151 </div> | |
152 {{ instruction.formattedAddress() }} | |
153 </div> | |
154 </template> | |
155 <template if="{{ !instruction.hasDescriptors }}"> | |
156 <div class="flex-item-fixed-2-12 monospace"> | |
157 {{ instruction.formattedAddress() }} | |
158 </div> | |
159 </template> | |
160 <div class="flex-item-fixed-6-12 monospace"> | |
161 {{ instruction.human }} | |
162 </div> | |
163 </template> | |
164 </div> | |
165 </template> | |
166 </div> | |
167 </template> | |
168 </polymer-element> | |
169 | |
170 <script type="application/dart" src="code_view.dart"></script> | |
OLD | NEW |