1<!DOCTYPE html>
2<!--
3Copyright 2016 The Chromium Authors. All rights reserved.
4Use of this source code is governed by a BSD-style license that can be
5found in the LICENSE file.
6-->
7
8<link rel="import" href="/components/core-icons/core-icons.html">
9
10<link rel="import" href="/dashboard/static/simple_xhr.html">
11
12<polymer-element name="nav-bar">
13  <template>
14    <style>
15
16      #navbar {
17        width: 100%;
18      }
19
20      #navbar ul {
21        list-style: none;
22        padding: 0;
23        margin: 0;
24        border: 0;
25        font-size: 100%;
26        font: inherit;
27        vertical-align: baseline;
28        z-index: 1000;
29        margin-left: -10px; /* Ignore body's padding left. */
30        padding-right: 20px; /* Ignore body's padding right. */
31      }
32
33      #navbar > ul {
34        display: flex;
35        display: -webkit-flex;
36        width: 100%;
37        background-color: #2D2D2D;
38        border-bottom: black;
39        margin-bottom: 6px;
40      }
41
42      #navbar li {
43        padding: 6px 10px;
44      }
45
46      #navbar li > a {
47        cursor: pointer;
48        text-decoration: none;
49      }
50
51      #navbar > ul > li, #navbar > ul > li > a {
52        color: #ddd;
53        font-weight: bold;
54      }
55
56      /* The addition of the icons to the <core-icon> elements to the submenus
57       * makes the submenu title text lower; the below style rule is intended
58       * to align the other menu items. */
59      #navbar .menu > li a {
60        display: inline-block;
61        padding-top: 3px;
62      }
63
64      #navbar .submenu li, #navbar .submenu a {
65        color: #ddd;
66        font-weight: normal;
67      }
68
69      /* This is a spacer in the navbar list that pushes the items after it
70       * all the way to the right side. */
71      .spacer {
72        flex: 100;
73      }
74
75      #navbar .menu li:hover > ul {
76        margin-top: 6px;
77        background-color: #2D2D2D;
78        border: 1px solid rgba(0, 0, 0, .2);
79      }
80
81      #navbar li:hover, #navbar a:hover {
82        color: white;
83      }
84
85      #navbar .menu-drop-arrow {
86        border-top-color: #aaa;
87        position: relative;
88        top: -1px;
89        border-style: solid dashed dashed;
90        border-color: transparent;
91        border-top-color: #c0c0c0;
92        display: -moz-inline-box;
93        display: inline-block;
94        font-size: 0;
95        height: 0;
96        line-height: 0;
97        width: 0;
98        border-width: 3px 3px 0;
99        padding-top: 1px;
100        left: 4px;
101      }
102
103      /* Basic select menus. */
104      .menu ul {
105        display: none;
106      }
107
108      .menu li:hover > ul {
109        display: block;
110        position: absolute;
111      }
112
113      .report-issue {
114        color: #dd4b39 !important;
115      }
116    </style>
117
118    <nav id="navbar">
119      <ul class="menu">
120        <li><a href="/">Home</a></li>
121        <li><a href="/alerts">Alerts</a></li>
122        <li><a href="/report">Browse Graphs</a></li>
123        <li><a href="https://code.google.com/p/chromium/issues/list?q=label%3AType-Bug-Regression+label%3APerformance&amp;sort=-id"
124               target="_blank">Perf Bugs</a></li>
125        <li>Other Pages<core-icon icon="arrow-drop-down"></core-icon>
126          <ul class="submenu">
127            <li><a href="/edit_test_owners">Edit Test Owners</a></li>
128            <li><a href="/bisect_stats">Bisect Stat Graphs</a></li>
129            <li><a href="/new_points">Recently Added Points</a></li>
130            <li><a href="/debug_alert">Debug Alert</a></li>
131          </ul>
132        </li>
133        <li>Waterfalls<core-icon icon="arrow-drop-down"></core-icon>
134          <ul class="submenu">
135            <li><a href="http://build.chromium.org/p/chromium.perf/waterfall?show_events=true&amp;failures_only=true&amp;reload=120"
136                   target="_blank">chromium.perf</a></li>
137            <li><a href="http://build.chromium.org/p/chromium.webkit/waterfall?builder=Win7%20Perf&amp;builder=Mac10.6%20Perf&amp;builder=Linux%20Perf"
138                   target="_blank">chromium.webkit</a></li>
139            <li><a href="http://build.chromium.org/p/chromium.gpu/waterfall?show_events=true&amp;failures_only=true&amp;reload=120"
140                   target="_blank">chromium.gpu</a></li>
141            <li><a href="http://build.chromium.org/p/tryserver.chromium.perf/builders"
142                   target="_blank">Bisect bots</a></li>
143          </ul>
144        </li>
145        <li>Help<core-icon icon="arrow-drop-down"></core-icon>
146          <ul class="submenu">
147            <li><a href="http://www.chromium.org/developers/speed-infra/performance-dashboard"
148                   target="_blank">Perf Dashboard Public Documentation</a></li>
149            <li><a href="http://www.chromium.org/developers/speed-infra/performance-dashboard/endpoints"
150                   target="_blank">Documented Endpoints</a></li>
151            <li><a href="http://www.chromium.org/developers/tree-sheriffs/perf-sheriffs"
152                   target="_blank">About Chromium Perf Sheriffing</a></li>
153            <li><a href="https://docs.google.com/a/chromium.org/document/d/1kIMZ8jNA2--4JsCtUJ_OprnlfT6aM3BfHrQ8o4s3bDI/edit"
154                   target="_blank">Chromium Perf Sheriff Status</a></li>
155            <li><a href="http://www.chromium.org/developers/tree-sheriffs/perf-sheriffs/bisecting-performance-regressions"
156                   target="_blank">Bisecting Performance Regressions</a></li>
157            <li><a href="http://www.chromium.org/developers/how-tos/gpu-wrangling"
158                   target="_blank">GPU Bots &amp; Pixel Wrangling</a></li>
159            <li><a href="https://docs.google.com/a/google.com/spreadsheets/d/1R_1BAOd3xeVtR0jn6wB5HHJ2K25mIbKp3iIRQKkX38o/view"
160                   target="_blank">Benchmark Owners Spreadsheet</a></li>
161            <li><a href="https://docs.google.com/document/d/1cF2Ny3UYbXq2y3fZaygUSz_3lVc0SOrSRZwXqGjjKgo/view"
162                   target="_blank">Triaging Stoppage Alerts</a></li>
163          </ul>
164        </li>
165
166        <template if="{{isAdmin}}">
167          <li>Admin<core-icon icon="arrow-drop-down"></core-icon>
168            <ul class="submenu">
169              <li><a href="/edit_site_config" target="_blank">Edit Site Config</a></li>
170              <li><a href="/edit_site_config?key=ip_whitelist" target="_blank">Edit IP Whitelist</a></li>
171              <li><a href="/edit_sheriffs" target="_blank">Edit Sheriff Rotations</a></li>
172              <li><a href="/edit_anomaly_configs" target="_blank">Edit Anomaly Configs</a></li>
173              <li><a href="/edit_bug_labels" target="_blank">Edit Bug Labels</a></li>
174              <li><a href="/stats" target="_blank">View Statistics</a></li>
175              <li><a href="/migrate_test_names" target="_blank">Migrate Test Names</a></li>
176              <li><a href="/edit_site_config?key=bot_whitelist" target="_blank">Bot Whitelist</a></li>
177              <li><a href="/change_internal_only" target="_blank">Change internal_only</a></li>
178            </ul>
179          </li>
180        </template>
181
182        <li class="report-issue">
183          <core-icon icon="bug-report"></core-icon> Report Issue
184          <core-icon icon="arrow-drop-down"></core-icon>
185          <ul class="submenu">
186            <li><a on-click="{{reportBug}}">Report a Perf Dashboard Bug</a></li>
187            <li><a on-click="{{fileIpWhitelistRequest}}">Request Buildbot IP Whitelisting</a></li>
188            <li><a on-click="{{fileBotWhitelistRequest}}">Request to Make Buildbots Publicly Visible</a></li>
189            <li><a on-click="{{fileMonitoringRequest}}">Request Monitoring for Tests</a></li>
190          </ul>
191        </li>
192        <li class="spacer"></li>
193        <li><a href="{{loginUrl}}" title="switch user">{{displayUsername}}</a></li>
194      </ul>
195    </nav>
196  </template>
197  <script>
198    'use strict';
199    Polymer('nav-bar', {
200      ready: function() {
201        simple_xhr.send('/navbar',
202                        {'path': location.pathname + location.search},
203                        function(response) {
204                          this.loginUrl = response.login_url;
205                          this.displayUsername = response.display_username;
206                          this.isAdmin = response.is_admin;
207                        }.bind(this));
208      },
209      /**
210       * Opens a window with new Chromium bug, pre-filled with some info.
211       * @param {string} summary The title of the bug.
212       * @param {string} comment The description of the bug.
213       * @param {Array} labels A list of labels to apply to the bug.
214       * @param {Array} cc A list of email addresses to cc on the bug.
215       */
216      openCrBugWindow: function(summary, comment, labels, cc) {
217        var url = 'https://code.google.com/p/chromium/issues/entry?';
218        url += [
219          'summary=' + encodeURIComponent(summary),
220          'comment=' + encodeURIComponent(comment),
221          'labels=' + encodeURIComponent(labels.join(',')),
222          'cc=' + encodeURIComponent(cc.join(','))
223        ].join('&');
224        window.open(url, '_blank');
225      },
226
227      /**
228       * Opens a window with new GitHub issue, pre-filled with some info.
229       * @param {string} summary The title of the bug.
230       * @param {string} comment The description of the bug.
231       * @param {string} label Label to apply to the bug.
232       */
233      openGitHubIssueWindow: function(summary, comment, label) {
234        var url = 'https://github.com/catapult-project/catapult/issues/new?';
235        url += [
236          'title=' + encodeURIComponent(summary),
237          'body=' + encodeURIComponent(comment),
238          'labels=' + encodeURIComponent(label),
239        ].join('&');
240        window.open(url, '_blank');
241      },
242
243      /**
244       * Opens a window to report a general dashboard bug.
245       */
246      reportBug: function() {
247        var os = this.guessOS();
248        var chromeVersion = 'unknown';
249        var chromeVersionMatch = navigator.userAgent.match(/Chrome\/(\S*)/);
250        if (chromeVersionMatch) {
251          chromeVersion = chromeVersionMatch[1];
252        }
253        var description = 'Chrome version: ' + chromeVersion;
254        description += ' (' + os + ')\n';
255        description += 'URL: ' + document.location.href + '\n\n';
256        description += 'Please copy and paste any errors from JavaScript';
257        description += ' console (';
258        description += (os == 'Mac' ? 'Command+Option+J' : 'Ctrl+Shift+J');
259        description += ' to open):\n\n';
260        description += 'Please describe the problem:\n';
261        this.openGitHubIssueWindow(
262            'Perf Dashboard: ', description, 'Perf Dashboard');
263      },
264
265      /**
266       * Guesses user's OS from user agent string (for pre-filling bug labels).
267       * @return {string} The name of an OS.
268       */
269      guessOS: function() {
270        var userAgentContains = function(s) {
271          return navigator.userAgent.indexOf(s) != -1;
272        };
273        if (userAgentContains('CrOS')) {
274          return 'Chrome OS';
275        } else if (userAgentContains('Windows')) {
276          return 'Windows';
277        } else if (userAgentContains('Macintosh')) {
278          return 'Mac';
279        } else if (userAgentContains('Linux')) {
280          return 'Linux';
281        } else if (userAgentContains('Android')) {
282          return 'Android';
283        }
284        return 'unknown';
285      },
286
287      fileIpWhitelistRequest: function() {
288        var description = 'Please whitelist the following IP addresses ' +
289            'to send data to the Chrome Perf Dashboard:\n' +
290            '<IP ADDRESSES HERE>\n\n' +
291            'These buildbots are for:\n';
292        var labels = ['Performance-Dashboard-IPWhitelist',
293                      'Restrict-View-Google'];
294        this.openCrBugWindow('IP Whitelist Request', description, labels, []);
295      },
296
297      fileBotWhitelistRequest: function() {
298        var description = 'Please make the following bots and all their data ' +
299            'publicly available, with no google.com login required: \n' +
300            '<BOT NAMES HERE>\n\n';
301        var labels = ['Performance-Dashboard-BotWhitelist',
302                      'Restrict-View-Google'];
303        this.openCrBugWindow('Bot Whitelist Request', description, labels, []);
304      },
305
306      fileMonitoringRequest: function() {
307        var description = 'Please add monitoring for the following tests:\n\n' +
308            'Test owner (see http://go/perf-test-owners):\n' +
309            'Buildbot master name:\n' +
310            'Test suite names:\n' +
311            'Restrict to these specific traces (if any):\n' +
312            'Email address and/or URL of sheriff rotation: \n' +
313            'Receive individual email alerts immediately or as a daily' +
314            ' summary?\nShould these alerts be Google-internal?\n';
315        var labels = [
316          'Performance-Dashboard-MonitoringRequest',
317          'Restrict-View-Google'
318        ];
319        this.openCrBugWindow('Monitoring Request', description, labels, []);
320      }
321    });
322  </script>
323</polymer-element>
324