Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(30)

Side by Side Diff: appengine/sheriff_o_matic/ui/ct-trooper-card.html

Issue 1315693002: SoM: upgrade Polymer from 0.5 to 1.0 Base URL: https://chromium.googlesource.com/infra/infra.git@master
Patch Set: get bower_components from polymer_1.0.4 Created 5 years, 4 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!-- 1 <!--
2 Copyright 2014 The Chromium Authors. All rights reserved. 2 Copyright 2014 The Chromium Authors. All rights reserved.
3 Use of this source code is governed by a BSD-style license that can be 3 Use of this source code is governed by a BSD-style license that can be
4 found in the LICENSE file. 4 found in the LICENSE file.
5 --> 5 --><html><head><link rel="import" href="ct-chart.html">
6 6
7 <link rel="import" href="ct-chart.html"> 7 <dom-module id="ct-trooper-card">
8 8 <style>
9 <polymer-element name="ct-trooper-card" attributes="group">
10 <template>
11 <style>
12 :host { 9 :host {
13 display: flex; 10 display: flex;
14 } 11 }
15 12
16 #failure { 13 #failure {
17 flex: 1; 14 flex: 1;
18 margin-left: 10px; 15 margin-left: 10px;
19 } 16 }
20 17
21 #details { 18 #details {
22 font-weight: bold; 19 font-weight: bold;
23 } 20 }
24 21
25 ::shadow #chart { 22 ::shadow #chart {
26 height: 100px; 23 height: 100px;
27 width: 400px; 24 width: 400px;
28 } 25 }
29 </style> 26 </style>
27 <template>
30 <div id="failure"> 28 <div id="failure">
31 <div id="details"> 29 <div id="details">
32 {{ group.tree }}: {{ group.details }} 30 <span>{{ group.tree }}</span>: <span>{{ group.details }}</span>
33 </div> 31 </div>
34 <ct-chart table="{{ table }}" options="{{ options }}" width=400 height=100 ></ct-chart> 32 <ct-chart table="{{ table }}" options="{{ options }}" width="400" height=" 100"></ct-chart>
35 </div> 33 </div>
36 </template> 34 </template>
37 <script> 35 <script>
38 Polymer({ 36 Polymer({
39 group: null, 37 is: 'ct-trooper-card',
40 table: null, 38 properties: {
41 options: null, 39 group: {
42 fromPercent: function(v) { 40 value: null,
41 notify: true,
42 observer: 'groupChanged'
43 },
44 options: { value: null },
45 table: { value: null }
46 },
47 fromPercent: function (v) {
43 return Number(v.substring(0, v.length - 1)); 48 return Number(v.substring(0, v.length - 1));
44 }, 49 },
45 groupChanged: function() { 50 groupChanged: function () {
46 if (!this.group) { 51 if (!this.group) {
47 return; 52 return;
48 } 53 }
49 switch (this.group.type) { 54 switch (this.group.type) {
50 case 'cq_latency': 55 case 'cq_latency':
51 this.table = { 56 this.table = {
52 labels: ["50th Percentile", "90th Percentile"], 57 labels: [
58 '50th Percentile',
59 '90th Percentile'
60 ],
53 datasets: [ 61 datasets: [
54 { 62 {
55 title: 'Limit', 63 title: 'Limit',
56 fillColor: 'grey', 64 fillColor: 'grey',
57 data: [60, 180] 65 data: [
66 60,
67 180
68 ]
58 }, 69 },
59 { 70 {
60 title: 'Actual', 71 title: 'Actual',
61 fillColor: [this.group.data.p50 > 60 ? 'red' : 'green', 72 fillColor: [
62 this.group.data.p90 > 180 ? 'red' : 'green'], 73 this.group.data.p50 > 60 ? 'red' : 'green',
63 data: [this.group.data.p50, this.group.data.p90] 74 this.group.data.p90 > 180 ? 'red' : 'green'
75 ],
76 data: [
77 this.group.data.p50,
78 this.group.data.p90
79 ]
64 } 80 }
65 ]}; 81 ]
82 };
66 break; 83 break;
67 case 'tree_status': 84 case 'tree_status':
68 this.table = { 85 this.table = {
69 labels: ["Tree Status"], 86 labels: ['Tree Status'],
70 datasets: [ 87 datasets: [
71 { 88 {
72 title: 'Minimum', 89 title: 'Minimum',
73 fillColor: 'grey', 90 fillColor: 'grey',
74 data: [80] 91 data: [80]
75 }, 92 },
76 { 93 {
77 title: 'Actual', 94 title: 'Actual',
78 fillColor: 'red', 95 fillColor: 'red',
79 data: [this.group.data.percent_open] 96 data: [this.group.data.percent_open]
80 } 97 }
81 ]}; 98 ]
99 };
82 break; 100 break;
83 case 'cycle_time': 101 case 'cycle_time':
84 this.table = { 102 this.table = {
85 labels: ["Percent of Builds"], 103 labels: ['Percent of Builds'],
86 datasets: [ 104 datasets: [
87 { 105 {
88 title: 'Median', 106 title: 'Median',
89 fillColor: 'orange', 107 fillColor: 'orange',
90 data: [this.fromPercent(this.group.data.percent_over_median_slo) ] 108 data: [this.fromPercent(this.group.data.percent_over_median_slo) ]
91 }, 109 },
92 { 110 {
93 title: 'Max', 111 title: 'Max',
94 fillColor: 'red', 112 fillColor: 'red',
95 data: [this.fromPercent(this.group.data.percent_over_max_slo)] 113 data: [this.fromPercent(this.group.data.percent_over_max_slo)]
96 } 114 }
97 ]}; 115 ]
116 };
98 break; 117 break;
99 case 'cq_false_rejection': 118 case 'cq_false_rejection':
100 this.table = { 119 this.table = {
101 labels: ["Hourly", "Weekly"], 120 labels: [
121 'Hourly',
122 'Weekly'
123 ],
102 datasets: [ 124 datasets: [
103 { 125 {
104 title: 'Limit', 126 title: 'Limit',
105 fillColor: 'grey', 127 fillColor: 'grey',
106 data: [this.group.data.hourly_max, this.group.data.weekly_max] 128 data: [
129 this.group.data.hourly_max,
130 this.group.data.weekly_max
131 ]
107 }, 132 },
108 { 133 {
109 title: 'Actual', 134 title: 'Actual',
110 fillColor: [this.group.data.hourly > this.group.data.hourly_max ? 'red' : 'green', 135 fillColor: [
111 this.group.data.weekly > this.group.data.weekly_max ? 'red' : 'green'], 136 this.group.data.hourly > this.group.data.hourly_max ? 'red' : 'green',
112 data: [this.group.data.hourly, this.group.data.weekly] 137 this.group.data.weekly > this.group.data.weekly_max ? 'red' : 'green'
138 ],
139 data: [
140 this.group.data.hourly,
141 this.group.data.weekly
142 ]
113 } 143 }
114 ]}; 144 ]
145 };
115 break; 146 break;
116 default: 147 default:
117 console.error('unknown trooper error type'); 148 console.error('unknown trooper error type');
118 return; 149 return;
119 } 150 }
120
121 this.options = { 151 this.options = {
122 scaleBeginAtZero: true, 152 scaleBeginAtZero: true,
123 legend: false, 153 legend: false,
124 annotateLabel: '<%=v1%>: <%=Math.round(v3)%>', 154 annotateLabel: '<%=v1%>: <%=Math.round(v3)%>',
125 annotateDisplay: true 155 annotateDisplay: true
126 } 156 };
127 }, 157 }
128 }); 158 });
129 </script> 159 </script>
130 </polymer-element> 160 </dom-module>
OLDNEW
« no previous file with comments | « appengine/sheriff_o_matic/ui/ct-tree-status.html ('k') | appengine/sheriff_o_matic/ui/ct-unexpected-failures.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698