OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <!-- | 2 <!-- |
3 Copyright 2015 The Chromium Authors. All rights reserved. | 3 Copyright 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/ui/base/deep_utils.html"> | 8 <link rel="import" href="/tracing/ui/base/deep_utils.html"> |
9 <link rel="import" href="/tracing/value/numeric.html"> | 9 <link rel="import" href="/tracing/value/numeric.html"> |
10 <link rel="import" href="/tracing/value/unit.html"> | 10 <link rel="import" href="/tracing/value/unit.html"> |
(...skipping 110 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
121 font-family: "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", Ti
mes, Symbola, Aegyptus, Code2000, Code2001, Code2002, Musica, serif, LastResort; | 121 font-family: "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", Ti
mes, Symbola, Aegyptus, Code2000, Code2001, Code2002, Musica, serif, LastResort; |
122 font-size: 13pt; | 122 font-size: 13pt; |
123 } | 123 } |
124 </style> | 124 </style> |
125 <span id="sparkline"></span> | 125 <span id="sparkline"></span> |
126 <span id="significance"></span> | 126 <span id="significance"></span> |
127 <span id="content"></span> | 127 <span id="content"></span> |
128 <span id="warning" style="display:none">⚠</span> | 128 <span id="warning" style="display:none">⚠</span> |
129 </template> | 129 </template> |
130 </dom-module> | 130 </dom-module> |
131 <script> | 131 <script> |
132 'use strict'; | 132 'use strict'; |
133 | 133 |
134 Polymer({ | 134 Polymer({ |
135 is: 'tr-v-ui-scalar-span', | 135 is: 'tr-v-ui-scalar-span', |
136 | 136 |
137 created: function() { | 137 created: function() { |
138 this.value_ = undefined; | 138 this.value_ = undefined; |
139 this.unit_ = undefined; | 139 this.unit_ = undefined; |
140 this.context_ = undefined; | 140 this.context_ = undefined; |
141 | 141 |
142 this.warning_ = undefined; | 142 this.warning_ = undefined; |
(...skipping 145 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
288 changeClass = 'worse'; | 288 changeClass = 'worse'; |
289 emoji = tr.v.ui.Emoji.CONFOUNDED_FACE; | 289 emoji = tr.v.ui.Emoji.CONFOUNDED_FACE; |
290 title = 'regression'; | 290 title = 'regression'; |
291 } else { | 291 } else { |
292 title = 'no change'; | 292 title = 'no change'; |
293 } | 293 } |
294 | 294 |
295 // Set the content class separately from the significance class so that | 295 // Set the content class separately from the significance class so that |
296 // NEUTRAL_FACE is always a neutral color. | 296 // NEUTRAL_FACE is always a neutral color. |
297 if (changeClass) | 297 if (changeClass) |
298 this.$.content.classList.add(changeClass); | 298 Polymer.dom(this.$.content).classList.add(changeClass); |
299 | 299 |
300 switch (this.significance) { | 300 switch (this.significance) { |
301 case tr.v.Significance.DONT_CARE: | 301 case tr.v.Significance.DONT_CARE: |
302 emoji = ''; | 302 emoji = ''; |
303 changeClass = ''; | 303 changeClass = ''; |
304 break; | 304 break; |
305 | 305 |
306 case tr.v.Significance.INSIGNIFICANT: | 306 case tr.v.Significance.INSIGNIFICANT: |
307 changeClass = ''; | 307 changeClass = ''; |
308 emoji = tr.v.ui.Emoji.NEUTRAL_FACE; | 308 emoji = tr.v.ui.Emoji.NEUTRAL_FACE; |
309 if (better || worse) | 309 if (better || worse) |
310 title = 'insignificant ' + title; | 310 title = 'insignificant ' + title; |
311 break; | 311 break; |
312 | 312 |
313 case tr.v.Significance.SIGNIFICANT: | 313 case tr.v.Significance.SIGNIFICANT: |
314 if (!better && !worse) | 314 if (!better && !worse) |
315 throw new Error('How can no change be significant?'); | 315 throw new Error('How can no change be significant?'); |
316 | 316 |
317 title = 'significant ' + title; | 317 title = 'significant ' + title; |
318 break; | 318 break; |
319 } | 319 } |
320 | 320 |
321 this.$.significance.textContent = emoji; | 321 Polymer.dom(this.$.significance).textContent = emoji; |
322 this.$.significance.title = title; | 322 this.$.significance.title = title; |
323 this.$.content.title = title; | 323 this.$.content.title = title; |
324 if (changeClass) | 324 if (changeClass) |
325 this.$.significance.classList.add(changeClass); | 325 Polymer.dom(this.$.significance).classList.add(changeClass); |
326 }, | 326 }, |
327 | 327 |
328 get warning() { | 328 get warning() { |
329 return this.warning_; | 329 return this.warning_; |
330 }, | 330 }, |
331 | 331 |
332 set warning(warning) { | 332 set warning(warning) { |
333 this.warning_ = warning; | 333 this.warning_ = warning; |
334 var warningEl = this.$.warning; | 334 var warningEl = this.$.warning; |
335 if (this.warning_) { | 335 if (this.warning_) { |
(...skipping 25 matching lines...) Expand all Loading... |
361 | 361 |
362 set duration(duration) { | 362 set duration(duration) { |
363 if (duration instanceof tr.b.u.TimeDuration) { | 363 if (duration instanceof tr.b.u.TimeDuration) { |
364 this.value = duration; | 364 this.value = duration; |
365 return; | 365 return; |
366 } | 366 } |
367 this.setValueAndUnit(duration, tr.b.u.Units.timeDurationInMs); | 367 this.setValueAndUnit(duration, tr.b.u.Units.timeDurationInMs); |
368 } | 368 } |
369 }); | 369 }); |
370 </script> | 370 </script> |
OLD | NEW |