src/chrome/browser/resources/performance_monitor/chart.html

   1 <!doctype html>
   2
   3 <!-- Copyright (c) 2012 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 <!-- This page uses Flot version 0.7 in compressed form for efficiency.
   8 Readable Flot source is available at http://code.google.com/p/flot/
   9 Good caliber Flot API docs are at: http://people.iola.dk/olau/flot/API.txt
  10 as of 6/2012. -->
  11
  12 <html i18n-values="dir:textdirection;">
  13   <head>
  14     <meta charset="utf-8">
  15     <title i18n-content="title"></title>
  16     <link rel="stylesheet" type="text/css" href="chart.css">
  17   </head>
  18   <body i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize">
  19     <div id="warnings-box">
  20       <div id="warnings-text">
  21         <span id="flag-not-enabled-warning" class="warning">
  22           <span i18n-content="flagNotEnabledWarning"></span>&nbsp;
  23           <a target="_blank" i18n-content="enableFlag"
  24               i18n-values="href:enableFlagsURL">
  25           </a>
  26         </span>
  27         <span id="no-aggregation-warning" class="warning"
  28             i18n-content="noAggregationWarning">
  29         </span>
  30       </div>
  31     </div>
  32     <div class="horizontal-box">
  33       <div id="settings-accordion" class="accordion">
  34         <h1 id="performance-heading" i18n-content="title"></h1>
  35         <div id="time-range-section">
  36           <details>
  37             <summary>
  38               <h2 id="time-range-title" i18n-content="timeRangeSection"></h2>
  39             </summary>
  40             <div class="accordion-contents">
  41               <h3 id="time-resolution-header"
  42                   i18n-content="timeResolutionCategory">
  43               </h3>
  44               <div id="choose-time-range">
  45               </div>
  46               <div id="time-shift-category">
  47                 <h3 i18n-content="timeRangeButtonHeading"></h3>
  48                 <div class="horizontal-box">
  49                   <button id="back-time" title="Back">&lt;&lt;</button>
  50                   <div class="spacer"></div>
  51                   <button id="forward-time" title="Forward">&gt;&gt;</button>
  52                 </div>
  53               </div>
  54               <h3 id="aggregation-header" i18n-content="aggregationCategory">
  55               </h3>
  56               <div id="choose-aggregation">
  57               </div>
  58             </div>
  59           </details>
  60         </div>
  61         <div id="metrics-section">
  62           <details>
  63             <summary>
  64               <h2 id="choose-metrics-header" i18n-content="metricsSection"></h2>
  65             </summary>
  66             <div class="accordion-contents">
  67               <div id="choose-metrics">
  68               </div>
  69             </div>
  70           </details>
  71         </div>
  72         <div id="events-section">
  73           <details>
  74             <summary>
  75               <h2 id="choose-events-header" i18n-content="eventsSection"></h2>
  76             </summary>
  77             <div class="accordion-contents">
  78               <div id="choose-events">
  79               </div>
  80             </div>
  81           </details>
  82         </div>
  83       </div>
  84       <div id="charts">
  85       </div>
  86       <div id="templates" hidden>
  87         <div id="chart-template" class="chart">
  88           <div class="grid"></div>
  89           <div class="yaxis-label-container"><h4></h4></div>
  90         </div>
  91         <div id="label-template" class="event-label"></div>
  92         <h3 id="category-label-template"></h3>
  93         <div id="category-template">
  94           <h3 class="category-heading"></h3>
  95           <div class="checkbox-group">
  96           </div>
  97         </div>
  98         <div id="checkbox-template">
  99           <label class="input-label">
 100             <input type="checkbox">
 101             <span></span>
 102           </label>
 103         </div>
 104         <div id="radio-template" class="radio">
 105           <label class="input-label">
 106             <input type="radio">
 107             <span></span>
 108           </label>
 109         </div>
 110       </div>
 111     </div>
 112     <script src="chrome://resources/js/cr.js"></script>
 113     <script src="chrome://resources/js/load_time_data.js"></script>
 114     <script src="chrome://resources/js/util.js"></script>
 115     <script src="chrome://performance/strings.js"></script>
 116     <script src="chrome://resources/js/i18n_template2.js"></script>
 117     <script src="jquery.js"></script>
 118     <script src="flot.js"></script>
 119     <script src="chart.js"></script>
 120   </body>
 121 </html>