OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <!-- |
| 3 Copyright 2017 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 <link rel="import" href="/components/polymer/polymer.html"> |
| 8 |
| 9 <link rel="import" href="/dashboard/elements/alerts-table.html"> |
| 10 <link rel="import" href="/dashboard/static/simple_xhr.html"> |
| 11 |
| 12 <dom-module id="benchmark-health-report-details"> |
| 13 <style> |
| 14 .error { |
| 15 color: #dd4b39; |
| 16 font-weight: bold; |
| 17 } |
| 18 |
| 19 #loading-spinner { |
| 20 width: 100%; |
| 21 display: flex; |
| 22 justify-content: center; |
| 23 } |
| 24 </style> |
| 25 <template> |
| 26 <template is="dom-if" if="{{loading}}"> |
| 27 <div id="loading-spinner"><img src="//www.google.com/images/loading.gif"><
/div> |
| 28 </template> |
| 29 <template is="dom-if" if="{{error}}"> |
| 30 <div class="error">{{error}}</div> |
| 31 </template> |
| 32 <template is="dom-if" if="{{computeSuccessfulLoad(loading, error)}}"> |
| 33 <h1>Report for {{benchmark}} on {{master}}</h1> |
| 34 <h2>{{benchmark}} is on {{bots.length}} bots:</h2> |
| 35 <ul> |
| 36 <template is="dom-repeat" items="{{bots}}"> |
| 37 <li>{{item}} |
| 38 </template> |
| 39 </ul> |
| 40 |
| 41 <h2>{{alerts.length}} alerts for {{benchmark}} in the last {{numDays}} day
s</h2> |
| 42 <h3>{{computeNumValid(alerts)}} valid and {{computeNumInvalid(alerts)}} in
valid and {{computeNumUntriaged(alerts)}} untriaged</h3> |
| 43 <alerts-table id="alerts-table" |
| 44 alert-list="{{alerts}}" |
| 45 extra-columns="{{extraColumns}}"></alerts-table> |
| 46 </template> |
| 47 |
| 48 </template> |
| 49 <script> |
| 50 'use strict'; |
| 51 Polymer({ |
| 52 is: 'benchmark-health-report-details', |
| 53 properties: { |
| 54 alerts: { |
| 55 notify: true, |
| 56 type: Array |
| 57 }, |
| 58 benchmark: { |
| 59 notify: true, |
| 60 type: String |
| 61 }, |
| 62 bots: { |
| 63 notify: true, |
| 64 type: Array |
| 65 }, |
| 66 extraColumns: { |
| 67 type: Array, |
| 68 notify: true, |
| 69 value: () => ([ |
| 70 { |
| 71 'key': 'percent_changed', |
| 72 'label': 'Delta %' |
| 73 }, |
| 74 { |
| 75 'key': 'absolute_delta', |
| 76 'label': 'Abs Delta' |
| 77 }, |
| 78 { |
| 79 'key': 'units', |
| 80 'label': 'Units' |
| 81 } |
| 82 ]) |
| 83 }, |
| 84 error: { |
| 85 notify: true, |
| 86 type: Boolean, |
| 87 value: false |
| 88 }, |
| 89 loading: { |
| 90 notify: true, |
| 91 type: Boolean, |
| 92 value: true |
| 93 }, |
| 94 master: { |
| 95 notify: true, |
| 96 type: String |
| 97 }, |
| 98 monitored: { |
| 99 notify: true, |
| 100 type: Boolean |
| 101 }, |
| 102 numDays: { |
| 103 notify: true, |
| 104 type: Number |
| 105 } |
| 106 }, |
| 107 |
| 108 countAlerts: function(bugCheck, alerts) { |
| 109 var count = 0; |
| 110 for (var alert of alerts) { |
| 111 if (bugCheck(alert.bug_id)) { |
| 112 count++; |
| 113 } |
| 114 } |
| 115 return count; |
| 116 }, |
| 117 |
| 118 computeSuccessfulLoad: (loading, error) => !(loading || error), |
| 119 |
| 120 computeNumInvalid: function(alerts) { |
| 121 return this.countAlerts(this.isInvalidAlert, alerts); |
| 122 }, |
| 123 |
| 124 computeNumValid: function(alerts) { |
| 125 return this.countAlerts(this.isValidAlert, alerts); |
| 126 }, |
| 127 |
| 128 computeNumUntriaged: function(alerts) { |
| 129 return this.countAlerts(this.isUntriagedAlert, alerts); |
| 130 }, |
| 131 |
| 132 // Using != and == here and below since bugId could be null or undefined |
| 133 isValidAlert: bugId => (bugId != null && bugId >= 0), |
| 134 |
| 135 isInvalidAlert: bugId => (bugId != null && bugId < 0), |
| 136 |
| 137 isUntriagedAlert: bugId => (bugId == null), |
| 138 |
| 139 ready: function() { |
| 140 var params = { |
| 141 'master': this.master, |
| 142 'benchmark': this.benchmark, |
| 143 'num_days': this.numDays |
| 144 }; |
| 145 simple_xhr.send('/benchmark_health_report', params, |
| 146 response => { |
| 147 this.alerts = response['alerts']; |
| 148 this.bots = response['bots']; |
| 149 this.monitored = response['monitored']; |
| 150 this.loading = false; |
| 151 }, |
| 152 errorMsg => { |
| 153 this.error = errorMsg; |
| 154 this.loading = false; |
| 155 }); |
| 156 } |
| 157 }); |
| 158 </script> |
| 159 </dom-module> |
OLD | NEW |