1<!DOCTYPE html> 2<!-- 3Copyright (c) 2013 The Chromium Authors. All rights reserved. 4Use of this source code is governed by a BSD-style license that can be 5found in the LICENSE file. 6--> 7 8<link rel="import" href="/tracing/base/utils.html"> 9<link rel="import" href="/tracing/model/event_set.html"> 10<link rel="import" href="/tracing/ui/analysis/analysis_link.html"> 11<link rel="import" href="/tracing/ui/analysis/analysis_sub_view.html"> 12<link rel="import" href="/tracing/value/ui/scalar_span.html"> 13<link rel="import" href="/tracing/value/unit.html"> 14 15<polymer-element name="tr-ui-a-single-cpu-slice-sub-view" 16 extends="tr-ui-a-sub-view"> 17 <template> 18 <style> 19 table { 20 border-collapse: collapse; 21 border-width: 0; 22 margin-bottom: 25px; 23 width: 100%; 24 } 25 26 table tr > td:first-child { 27 padding-left: 2px; 28 } 29 30 table tr > td { 31 padding: 2px 4px 2px 4px; 32 vertical-align: text-top; 33 width: 150px; 34 } 35 36 table td td { 37 padding: 0 0 0 0; 38 width: auto; 39 } 40 tr { 41 vertical-align: top; 42 } 43 44 tr:nth-child(2n+0) { 45 background-color: #e2e2e2; 46 } 47 </style> 48 <table> 49 <tr> 50 <td>Running process:</td><td id="process-name"></td> 51 </tr> 52 <tr> 53 <td>Running thread:</td><td id="thread-name"></td> 54 </tr> 55 <tr> 56 <td>Start:</td> 57 <td> 58 <tr-v-ui-scalar-span id="start"> 59 </tr-v-ui-scalar-span> 60 </td> 61 </tr> 62 <tr> 63 <td>Duration:</td> 64 <td> 65 <tr-v-ui-scalar-span id="duration"> 66 </tr-v-ui-scalar-span> 67 </td> 68 </tr> 69 <tr> 70 <td>Active slices:</td><td id="running-thread"></td> 71 </tr> 72 <tr> 73 <td>Args:</td> 74 <td> 75 <tr-ui-a-generic-object-view id="args"> 76 </tr-ui-a-generic-object-view> 77 </td> 78 </tr> 79 </table> 80 </template> 81 82 <script> 83 'use strict'; 84 Polymer({ 85 created: function() { 86 this.currentSelection_ = undefined; 87 }, 88 89 get selection() { 90 return this.currentSelection_; 91 }, 92 93 set selection(selection) { 94 if (selection.length !== 1) 95 throw new Error('Only supports single slices'); 96 if (!(selection[0] instanceof tr.model.CpuSlice)) 97 throw new Error('Only supports thread time slices'); 98 99 this.currentSelection_ = selection; 100 101 var cpuSlice = selection[0]; 102 var thread = cpuSlice.threadThatWasRunning; 103 104 var shadowRoot = this.shadowRoot; 105 if (thread) { 106 shadowRoot.querySelector('#process-name').textContent = 107 thread.parent.userFriendlyName; 108 shadowRoot.querySelector('#thread-name').textContent = 109 thread.userFriendlyName; 110 } else { 111 shadowRoot.querySelector('#process-name').parentElement.style.display = 112 'none'; 113 shadowRoot.querySelector('#thread-name').textContent = cpuSlice.title; 114 } 115 116 shadowRoot.querySelector('#start').setValueAndUnit( 117 cpuSlice.start, tr.v.Unit.byName.timeStampInMs); 118 shadowRoot.querySelector('#duration').setValueAndUnit( 119 cpuSlice.duration, tr.v.Unit.byName.timeDurationInMs); 120 121 var runningThreadEl = shadowRoot.querySelector('#running-thread'); 122 123 var timeSlice = cpuSlice.getAssociatedTimeslice(); 124 if (!timeSlice) { 125 runningThreadEl.parentElement.style.display = 'none'; 126 } else { 127 var threadLink = document.createElement('tr-ui-a-analysis-link'); 128 threadLink.selection = new tr.model.EventSet(timeSlice); 129 threadLink.textContent = 'Click to select'; 130 runningThreadEl.parentElement.style.display = ''; 131 runningThreadEl.textContent = ''; 132 runningThreadEl.appendChild(threadLink); 133 } 134 135 shadowRoot.querySelector('#args').object = cpuSlice.args; 136 137 } 138 }); 139 </script> 140</polymer-element> 141