Home | History | Annotate | Download | only in perf_insights_examples
      1 <!DOCTYPE html>
      2 <html>
      3 <!--
      4 Copyright (c) 2015 The Chromium Authors. All rights reserved.
      5 Use of this source code is governed by a BSD-style license that can be
      6 found in the LICENSE file.
      7 -->
      8 <head>
      9 <title>Perf Insights Trace Viewer</title>
     10 <meta charset='utf-8'>
     11 
     12 <script src="/components/webcomponentsjs/webcomponents.js"></script>
     13 
     14 <link rel="import" href="/components/polymer/polymer.html">
     15 <link rel="import" href="/tracing/base/xhr.html">
     16 <link rel="import" href="/tracing/base/timing.html">
     17 <link rel="import" href="/tracing/importer/import.html">
     18 <link rel="import" href="/tracing/ui/extras/full_config.html">
     19 <link rel="import" href="/tracing/ui/timeline_view.html">
     20 
     21 <style>
     22   html,
     23   body {
     24     height: 100%;
     25   }
     26 
     27   body {
     28     -webkit-flex-direction: column;
     29     display: -webkit-flex;
     30     margin: 0;
     31     padding: 0;
     32   }
     33 
     34   body > tr-ui-timeline-view {
     35     -webkit-flex: 1 1 auto;
     36     min-height: 0;
     37   }
     38   body > tr-ui-timeline-view:focus {
     39     outline: none;
     40   }
     41 </style>
     42 </head>
     43 <body>
     44   <tr-ui-timeline-view>
     45     <track-view-container id='track_view_container'></track-view-container>
     46   </tr-ui-timeline-view>
     47 
     48   <script>
     49   'use strict';
     50 
     51   var timelineViewEl;
     52 
     53   function loadTrace(filename) {
     54     var p = new tr.b.TimedNamedPromise('loadTrace', function(resolve) {
     55       resolve(tr.b.getAsync(filename));
     56     });
     57     p.then(createViewFromTrace.bind(this),
     58         tr.showPanic.bind(this, 'Couldn\'t load trace.', filename));
     59   }
     60 
     61   function createViewFromTrace(trace) {
     62     var m = new tr.Model();
     63     var i = new tr.importer.Import(m);
     64     var p = i.importTracesWithProgressDialog([trace]);
     65 
     66     p.then(
     67       function() {
     68         timelineViewEl.model = m;
     69         timelineViewEl.updateDocumentFavicon();
     70         timelineViewEl.globalMode = true;
     71         timelineViewEl.viewTitle = '';
     72       },
     73       function(err) {
     74         var overlay = new tr.ui.b.Overlay();
     75         overlay.textContent = tr.b.normalizeException(err).message;
     76         overlay.title = 'Import error';
     77         overlay.visible = true;
     78       });
     79   }
     80 
     81   function reload() {
     82     loadTrace(window.location.hash.substr(1));
     83   }
     84 
     85   window.addEventListener('hashchange', reload);
     86 
     87   function onLoad() {
     88     timelineViewEl = document.querySelector('tr-ui-timeline-view');
     89     timelineViewEl.globalMode = true;
     90     reload();
     91   }
     92   window.addEventListener('load', onLoad);
     93   </script>
     94 </body>
     95 </html>
     96