src/third_party/trace-viewer/trace_viewer/base.html

   1 <!DOCTYPE html>
   2 <!--
   3 Copyright (c) 2014 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 <script>
   8 'use strict';
   9
  10
  11 /**
  12  * The global object.
  13  * @type {!Object}
  14  * @const
  15  */
  16 var global = this;
  17
  18 /** Platform, package, object property, and Event support. */
  19 this.tv = (function() {
  20   if (window.tv) {
  21     console.warn('Base was multiply initialized. First init wins.');
  22     return window.tv;
  23   }
  24
  25   /**
  26    * Builds an object structure for the provided namespace path,
  27    * ensuring that names that already exist are not overwritten. For
  28    * example:
  29    * 'a.b.c' -> a = {};a.b={};a.b.c={};
  30    * @param {string} name Name of the object that this file defines.
  31    * @param {*=} opt_object The object to expose at the end of the path.
  32    * @param {Object=} opt_objectToExportTo The object to add the path to;
  33    *     default is {@code global}.
  34    * @private
  35    */
  36   function exportPath(name, opt_object, opt_objectToExportTo) {
  37     var parts = name.split('.');
  38     var cur = opt_objectToExportTo || global;
  39
  40     for (var part; parts.length && (part = parts.shift());) {
  41       if (!parts.length && opt_object !== undefined) {
  42         // last part and we have an object; use it
  43         cur[part] = opt_object;
  44       } else if (part in cur) {
  45         cur = cur[part];
  46       } else {
  47         cur = cur[part] = {};
  48       }
  49     }
  50     return cur;
  51   };
  52
  53   var panicElement = undefined;
  54   var rawPanicMessages = [];
  55   function showPanicElementIfNeeded() {
  56     if (panicElement)
  57       return;
  58
  59     var panicOverlay = document.createElement('div');
  60     panicOverlay.style.backgroundColor = 'white';
  61     panicOverlay.style.border = '3px solid red';
  62     panicOverlay.style.boxSizing = 'border-box';
  63     panicOverlay.style.color = 'black';
  64     panicOverlay.style.display = '-webkit-flex';
  65     panicOverlay.style.height = '100%';
  66     panicOverlay.style.left = 0;
  67     panicOverlay.style.padding = '8px';
  68     panicOverlay.style.position = 'fixed';
  69     panicOverlay.style.top = 0;
  70     panicOverlay.style.webkitFlexDirection = 'column';
  71     panicOverlay.style.width = '100%';
  72
  73     panicElement = document.createElement('div');
  74     panicElement.style.webkitFlex = '1 1 auto';
  75     panicElement.style.overflow = 'auto';
  76     panicOverlay.appendChild(panicElement);
  77
  78     if (!document.body) {
  79       setTimeout(function() {
  80         document.body.appendChild(panicOverlay);
  81       }, 150);
  82     } else {
  83       document.body.appendChild(panicOverlay);
  84     }
  85   }
  86
  87   function showPanic(panicTitle, panicDetails) {
  88
  89     if (panicDetails instanceof Error)
  90       panicDetails = panicDetails.stack;
  91
  92     showPanicElementIfNeeded();
  93     var panicMessageEl = document.createElement('div');
  94     panicMessageEl.innerHTML =
  95         '<h2 id="message"></h2>' +
  96         '<pre id="details"></pre>';
  97     panicMessageEl.querySelector('#message').textContent = panicTitle;
  98     panicMessageEl.querySelector('#details').textContent = panicDetails;
  99     panicElement.appendChild(panicMessageEl);
 100
 101     rawPanicMessages.push({
 102       title: panicTitle,
 103       details: panicDetails
 104     });
 105   }
 106
 107   function hasPanic() {
 108     return rawPanicMessages.length !== 0;
 109   }
 110   function getPanicText() {
 111     return rawPanicMessages.map(function(msg) {
 112       return msg.title;
 113     }).join(', ');
 114   }
 115
 116   function exportTo(namespace, fn) {
 117     var obj = exportPath(namespace);
 118     var exports = fn();
 119
 120     for (var propertyName in exports) {
 121       // Maybe we should check the prototype chain here? The current usage
 122       // pattern is always using an object literal so we only care about own
 123       // properties.
 124       var propertyDescriptor = Object.getOwnPropertyDescriptor(exports,
 125                                                                propertyName);
 126       if (propertyDescriptor)
 127         Object.defineProperty(obj, propertyName, propertyDescriptor);
 128     }
 129   };
 130
 131   var pendingCallbacks = [];
 132   var polymerReadyFired = false;
 133   function onPolymerReady(callback) {
 134     pendingCallbacks.push(callback);
 135     if (polymerReadyFired)
 136       scheduleRunPendingCallbacks_();
 137   }
 138
 139   var runScheduled = false;
 140   function scheduleRunPendingCallbacks_() {
 141     if (runScheduled)
 142       return;
 143     runScheduled = true;
 144     // TODO(nduca): I have no idea why magicDelay is needed. :'(
 145     var magicDelay = 32;
 146     setTimeout(runPendingCallbacks_, magicDelay);
 147   }
 148
 149   function runPendingCallbacks_() {
 150     runScheduled = false;
 151     var pending = pendingCallbacks.slice();
 152     pendingCallbacks = [];
 153
 154     pending.forEach(function(cb) {
 155       cb.call(global);
 156     });
 157   }
 158
 159   /**
 160    * Initialization which must be deferred until run-time.
 161    */
 162   function initialize() {
 163     if (!window._TRACE_VIEWER_IS_COMPILED) {
 164       var ver = parseInt(
 165           window.navigator.appVersion.match(/Chrome\/(\d+)\./)[1], 10);
 166       if (ver < 36) {
 167         var msg = 'A Chrome version of 36 or higher is required for ' +
 168             'trace-viewer development. Please upgrade your version of Chrome ' +
 169             'and try again.';
 170         showPanic('Invalid Chrome version', msg);
 171       }
 172     }
 173
 174     tv.doc = document;
 175
 176     tv.isMac = /Mac/.test(navigator.platform);
 177     tv.isWindows = /Win/.test(navigator.platform);
 178     tv.isChromeOS = /CrOS/.test(navigator.userAgent);
 179     tv.isLinux = /Linux/.test(navigator.userAgent);
 180
 181     addEventListener('polymer-ready', function() {
 182       polymerReadyFired = true;
 183       scheduleRunPendingCallbacks_();
 184     });
 185   }
 186
 187   return {
 188     initialize: initialize,
 189
 190     exportTo: exportTo,
 191     showPanic: showPanic,
 192     hasPanic: hasPanic,
 193     getPanicText: getPanicText,
 194     onPolymerReady: onPolymerReady
 195   };
 196 })();
 197
 198 tv.initialize();
 199 </script>