src/third_party/trace-viewer/trace_viewer/tracing/analysis/cpu_slice_view.html

   1 <!DOCTYPE html>
   2 <!--
   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
   5 found in the LICENSE file.
   6 -->
   7
   8 <link rel="import" href="/tracing/analysis/slice_view.html">
   9 <link rel="import" href="/tracing/analysis/util.html">
  10 <link rel="import" href="/tracing/analysis/analysis_link.html">
  11 <link rel="import" href="/base/utils.html">
  12
  13 <template id="cpu-slice-view-template">
  14   <table>
  15     <tr class="analysis-table-row">
  16       <td colspan=2><b>CPU Time Slice</b></td>
  17     </tr>
  18     <tr class="analysis-table-row">
  19       <td>Running process:</td><td id="process-name"></td>
  20     </tr>
  21     <tr class="analysis-table-row">
  22       <td>Running thread:</td><td id="thread-name"></td>
  23     </tr>
  24     <tr class="analysis-table-row">
  25       <td>Start:</td><td id="start"></td>
  26     </tr>
  27     <tr class="analysis-table-row">
  28       <td>Duration:</td><td id="duration"></td>
  29     </tr>
  30     <tr class="analysis-table-row">
  31       <td>Active slices:</td><td id="running-thread"></td>
  32     </tr>
  33   </table>
  34 </template>
  35
  36 <script>
  37 'use strict';
  38
  39 tv.exportTo('tracing.analysis', function() {
  40   var THIS_DOC = document.currentScript.ownerDocument;
  41   var tsRound = tracing.analysis.tsRound;
  42
  43   /**
  44    * @constructor
  45    */
  46   var CpuSliceView = tv.ui.define('cpu-slice-view',
  47                                     tracing.analysis.SliceView);
  48
  49   CpuSliceView.prototype = {
  50     __proto__: tracing.analysis.SliceView.prototype,
  51
  52     decorate: function() {
  53       tracing.analysis.SliceView.prototype.decorate.call(this);
  54       this.classList.add('cpu-slice-view');
  55     },
  56
  57     updateContents: function() {
  58       this.textContent = '';
  59       this.appendChild(tv.instantiateTemplate('#cpu-slice-view-template',
  60           THIS_DOC));
  61
  62       var cpuSlice = this.slice;
  63       var thread = cpuSlice.threadThatWasRunning;
  64
  65       if (thread) {
  66         this.querySelector('#process-name').textContent =
  67             thread.parent.userFriendlyName;
  68         this.querySelector('#thread-name').textContent =
  69             thread.userFriendlyName;
  70       } else {
  71         this.querySelector('#process-name').parentElement.style.display =
  72             'none';
  73         this.querySelector('#thread-name').textContent = cpuSlice.title;
  74       }
  75       this.querySelector('#start').textContent = tsRound(cpuSlice.start) + 'ms';
  76       this.querySelector('#duration').textContent =
  77           tsRound(cpuSlice.duration) + 'ms';
  78       var runningThreadEl = this.querySelector('#running-thread');
  79       var timeSlice = cpuSlice.getAssociatedTimeslice();
  80       if (!timeSlice) {
  81         runningThreadEl.parentElement.style.display = 'none';
  82       } else {
  83         var threadLink = new tracing.analysis.AnalysisLink();
  84         threadLink.textContent = 'Click to select';
  85         threadLink.selectionGenerator = function() {
  86           var selection = new tracing.Selection();
  87           selection.push(timeSlice);
  88           return selection;
  89         }.bind(this);
  90         runningThreadEl.appendChild(threadLink);
  91       }
  92     }
  93   };
  94
  95   tracing.analysis.SliceView.register(
  96       'tracing.analysis.CpuSlice', CpuSliceView);
  97
  98   return {
  99     CpuSliceView: CpuSliceView
 100   };
 101 });
 102 </script>