• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# Copyright 2016 The Chromium OS Authors. All rights reserved.
2# Use of this source code is governed by a BSD-style license that can be
3# found in the LICENSE file.
4"""Text templates used by various parts of results_report."""
5from __future__ import print_function
6
7import cgi
8from string import Template
9
10_TabMenuTemplate = Template("""
11<div class='tab-menu'>
12  <a href="javascript:switchTab('$table_name', 'html')">HTML</a>
13  <a href="javascript:switchTab('$table_name', 'text')">Text</a>
14  <a href="javascript:switchTab('$table_name', 'tsv')">TSV</a>
15</div>""")
16
17
18def _GetTabMenuHTML(table_name):
19  # N.B. cgi.escape does some very basic HTML escaping. Nothing more.
20  escaped = cgi.escape(table_name, quote=True)
21  return _TabMenuTemplate.substitute(table_name=escaped)
22
23
24_ExperimentFileHTML = """
25<div class='results-section'>
26  <div class='results-section-title'>Experiment File</div>
27  <div class='results-section-content'>
28    <pre>%s</pre>
29</div>
30"""
31
32
33def _GetExperimentFileHTML(experiment_file_text):
34  if not experiment_file_text:
35    return ''
36  return _ExperimentFileHTML % (cgi.escape(experiment_file_text),)
37
38
39_ResultsSectionHTML = Template("""
40<div class='results-section'>
41  <div class='results-section-title'>$sect_name</div>
42  <div class='results-section-content'>
43    <div id='${short_name}-html'>$html_table</div>
44    <div id='${short_name}-text'><pre>$text_table</pre></div>
45    <div id='${short_name}-tsv'><pre>$tsv_table</pre></div>
46  </div>
47  $tab_menu
48</div>
49""")
50
51
52def _GetResultsSectionHTML(print_table, table_name, data):
53  first_word = table_name.strip().split()[0]
54  short_name = first_word.lower()
55  return _ResultsSectionHTML.substitute(
56      sect_name=table_name,
57      html_table=print_table(data, 'HTML'),
58      text_table=print_table(data, 'PLAIN'),
59      tsv_table=print_table(data, 'TSV'),
60      tab_menu=_GetTabMenuHTML(short_name),
61      short_name=short_name)
62
63
64_MainHTML = Template("""
65<html>
66<head>
67  <style type="text/css">
68    body {
69      font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
70      font-size: 12px;
71    }
72
73    pre {
74      margin: 10px;
75      color: #039;
76      font-size: 14px;
77    }
78
79    .chart {
80      display: inline;
81    }
82
83    .hidden {
84      visibility: hidden;
85    }
86
87    .results-section {
88      border: 1px solid #b9c9fe;
89      margin: 10px;
90    }
91
92    .results-section-title {
93      background-color: #b9c9fe;
94      color: #039;
95      padding: 7px;
96      font-size: 14px;
97      width: 200px;
98    }
99
100    .results-section-content {
101      margin: 10px;
102      padding: 10px;
103      overflow:auto;
104    }
105
106    #box-table-a {
107      font-size: 12px;
108      width: 480px;
109      text-align: left;
110      border-collapse: collapse;
111    }
112
113    #box-table-a th {
114      padding: 6px;
115      background: #b9c9fe;
116      border-right: 1px solid #fff;
117      border-bottom: 1px solid #fff;
118      color: #039;
119      text-align: center;
120    }
121
122    #box-table-a td {
123      padding: 4px;
124      background: #e8edff;
125      border-bottom: 1px solid #fff;
126      border-right: 1px solid #fff;
127      color: #669;
128      border-top: 1px solid transparent;
129    }
130
131    #box-table-a tr:hover td {
132      background: #d0dafd;
133      color: #339;
134    }
135
136  </style>
137  <script type='text/javascript' src='https://www.google.com/jsapi'></script>
138  <script type='text/javascript'>
139    google.load('visualization', '1', {packages:['corechart']});
140    google.setOnLoadCallback(init);
141    function init() {
142      switchTab('summary', 'html');
143      ${perf_init};
144      switchTab('full', 'html');
145      drawTable();
146    }
147    function drawTable() {
148      ${chart_js};
149    }
150    function switchTab(table, tab) {
151      document.getElementById(table + '-html').style.display = 'none';
152      document.getElementById(table + '-text').style.display = 'none';
153      document.getElementById(table + '-tsv').style.display = 'none';
154      document.getElementById(table + '-' + tab).style.display = 'block';
155    }
156  </script>
157</head>
158
159<body>
160  $summary_table
161  $perf_html
162  <div class='results-section'>
163    <div class='results-section-title'>Charts</div>
164    <div class='results-section-content'>$chart_divs</div>
165  </div>
166  $full_table
167  $experiment_file
168</body>
169</html>
170""")
171
172
173# It's a bit ugly that we take some HTML things, and some non-HTML things, but I
174# need to balance prettiness with time spent making things pretty.
175def GenerateHTMLPage(perf_table, chart_js, summary_table, print_table,
176                     chart_divs, full_table, experiment_file):
177  """Generates a crosperf HTML page from the given arguments.
178
179  print_table is a two-arg function called like: print_table(t, f)
180    t is one of [summary_table, print_table, full_table]; it's the table we want
181      to format.
182    f is one of ['TSV', 'HTML', 'PLAIN']; it's the type of format we want.
183  """
184  summary_table_html = _GetResultsSectionHTML(print_table, 'Summary Table',
185                                              summary_table)
186  if perf_table:
187    perf_html = _GetResultsSectionHTML(print_table, 'Perf Table', perf_table)
188    perf_init = "switchTab('perf', 'html')"
189  else:
190    perf_html = ''
191    perf_init = ''
192
193  full_table_html = _GetResultsSectionHTML(print_table, 'Full Table',
194                                           full_table)
195  experiment_file_html = _GetExperimentFileHTML(experiment_file)
196  return _MainHTML.substitute(
197      perf_init=perf_init,
198      chart_js=chart_js,
199      summary_table=summary_table_html,
200      perf_html=perf_html,
201      chart_divs=chart_divs,
202      full_table=full_table_html,
203      experiment_file=experiment_file_html)
204