blob: 3735004541589d08f58be1589d4d888737a02118 [file] [log] [blame]
Joshua Hesketh4db99cb2014-05-23 11:28:08 +10001// jquery plugin for Zuul status page
Timo Tijhof51516cd2013-04-09 01:32:29 +02002//
Tristan Cacqueray48ddd9e2017-05-21 10:19:02 +00003// @licstart The following is the entire license notice for the
4// JavaScript code in this page.
5//
Timo Tijhof51516cd2013-04-09 01:32:29 +02006// Copyright 2012 OpenStack Foundation
7// Copyright 2013 Timo Tijhof
8// Copyright 2013 Wikimedia Foundation
Joshua Hesketh6b1a2182014-03-21 14:40:04 +11009// Copyright 2014 Rackspace Australia
Timo Tijhof51516cd2013-04-09 01:32:29 +020010//
11// Licensed under the Apache License, Version 2.0 (the "License"); you may
12// not use this file except in compliance with the License. You may obtain
13// a copy of the License at
14//
15// http://www.apache.org/licenses/LICENSE-2.0
16//
17// Unless required by applicable law or agreed to in writing, software
18// distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
19// WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
20// License for the specific language governing permissions and limitations
21// under the License.
Tristan Cacqueray48ddd9e2017-05-21 10:19:02 +000022//
23// @licend The above is the entire license notice
24// for the JavaScript code in this page.
Timo Tijhof51516cd2013-04-09 01:32:29 +020025
26(function ($) {
Timo Tijhof4be9f742015-04-02 01:13:19 +010027 'use strict';
28
Joshua Heskethace48892014-03-22 17:18:31 +110029 function set_cookie(name, value) {
Monty Taylor860bb0a2014-03-22 09:41:25 -070030 document.cookie = name + '=' + value + '; path=/';
Joshua Heskethace48892014-03-22 17:18:31 +110031 }
32
33 function read_cookie(name, default_value) {
Monty Taylor860bb0a2014-03-22 09:41:25 -070034 var nameEQ = name + '=';
Joshua Heskethace48892014-03-22 17:18:31 +110035 var ca = document.cookie.split(';');
36 for(var i=0;i < ca.length;i++) {
37 var c = ca[i];
Monty Taylor860bb0a2014-03-22 09:41:25 -070038 while (c.charAt(0) === ' ') {
39 c = c.substring(1, c.length);
40 }
41 if (c.indexOf(nameEQ) === 0) {
Joshua Heskethace48892014-03-22 17:18:31 +110042 return c.substring(nameEQ.length, c.length);
43 }
44 }
45 return default_value;
46 }
47
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +100048 $.zuul = function(options) {
Timo Tijhof4be9f742015-04-02 01:13:19 +010049 options = $.extend({
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +100050 'enabled': true,
51 'graphite_url': '',
52 'source': 'status.json',
53 'msg_id': '#zuul_msg',
54 'pipelines_id': '#zuul_pipelines',
55 'queue_events_num': '#zuul_queue_events_num',
56 'queue_results_num': '#zuul_queue_results_num',
57 }, options);
Joshua Heskethace48892014-03-22 17:18:31 +110058
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +100059 var collapsed_exceptions = [];
Joshua Hesketh6f94dd12014-08-20 16:14:53 +100060 var current_filter = read_cookie('zuul_filter_string', '');
Jan Hrubanddeb95a2017-01-03 15:12:41 +010061 var change_set_in_url = window.location.href.split('#')[1];
62 if (change_set_in_url) {
63 current_filter = change_set_in_url;
64 }
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +100065 var $jq;
Timo Tijhof51516cd2013-04-09 01:32:29 +020066
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +100067 var xhr,
68 zuul_graph_update_count = 0,
69 zuul_sparkline_urls = {};
Joshua Hesketh9d013542014-04-03 13:08:04 +110070
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +100071 function get_sparkline_url(pipeline_name) {
72 if (options.graphite_url !== '') {
73 if (!(pipeline_name in zuul_sparkline_urls)) {
74 zuul_sparkline_urls[pipeline_name] = $.fn.graphite
75 .geturl({
76 url: options.graphite_url,
77 from: "-8hours",
78 width: 100,
79 height: 26,
80 margin: 0,
81 hideLegend: true,
82 hideAxes: true,
83 hideGrid: true,
84 target: [
85 "color(stats.gauges.zuul.pipeline." + pipeline_name
Timo Tijhof4be9f742015-04-02 01:13:19 +010086 + ".current_changes, '6b8182')"
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +100087 ]
Joshua Hesketh298c4912014-03-20 16:06:25 +110088 });
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +100089 }
90 return zuul_sparkline_urls[pipeline_name];
91 }
92 return false;
93 }
Joshua Hesketh298c4912014-03-20 16:06:25 +110094
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +100095 var format = {
Joshua Hesketh6b1a2182014-03-21 14:40:04 +110096 job: function(job) {
Joshua Hesketh9e6ce532014-04-01 13:11:53 +110097 var $job_line = $('<span />');
98
Monty Taylore78211d2017-07-21 09:48:41 +090099 if (job.result !== null) {
100 $job_line.append(
101 $('<a />')
102 .addClass('zuul-job-name')
103 .attr('href', job.report_url)
104 .text(job.name)
105 );
106 }
107 else if (job.url !== null) {
Joshua Hesketh9e6ce532014-04-01 13:11:53 +1100108 $job_line.append(
109 $('<a />')
110 .addClass('zuul-job-name')
111 .attr('href', job.url)
112 .text(job.name)
113 );
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100114 }
Joshua Hesketh9e6ce532014-04-01 13:11:53 +1100115 else {
116 $job_line.append(
117 $('<span />')
118 .addClass('zuul-job-name')
119 .text(job.name)
120 );
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100121 }
Joshua Hesketh9e6ce532014-04-01 13:11:53 +1100122
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000123 $job_line.append(this.job_status(job));
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100124
125 if (job.voting === false) {
126 $job_line.append(
Joshua Hesketh9e6ce532014-04-01 13:11:53 +1100127 $(' <small />')
128 .addClass('zuul-non-voting-desc')
129 .text(' (non-voting)')
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100130 );
131 }
Joshua Hesketh9e6ce532014-04-01 13:11:53 +1100132
Joshua Hesketha95fd552014-08-21 11:21:05 +1000133 $job_line.append($('<div style="clear: both"></div>'));
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100134 return $job_line;
135 },
136
137 job_status: function(job) {
138 var result = job.result ? job.result.toLowerCase() : null;
139 if (result === null) {
140 result = job.url ? 'in progress' : 'queued';
141 }
142
Monty Taylor860bb0a2014-03-22 09:41:25 -0700143 if (result === 'in progress') {
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000144 return this.job_progress_bar(job.elapsed_time,
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100145 job.remaining_time);
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100146 }
147 else {
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000148 return this.status_label(result);
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100149 }
150 },
151
152 status_label: function(result) {
Monty Taylor860bb0a2014-03-22 09:41:25 -0700153 var $status = $('<span />');
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100154 $status.addClass('zuul-job-result label');
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100155
156 switch (result) {
157 case 'success':
158 $status.addClass('label-success');
159 break;
160 case 'failure':
161 $status.addClass('label-danger');
162 break;
163 case 'unstable':
164 $status.addClass('label-warning');
165 break;
Alexander Evseev3103a842015-11-17 10:12:45 +0300166 case 'skipped':
167 $status.addClass('label-info');
168 break;
Antoine Musso4c2053d2016-02-04 23:35:23 +0100169 // 'in progress' 'queued' 'lost' 'aborted' ...
170 default:
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100171 $status.addClass('label-default');
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100172 }
173 $status.text(result);
174 return $status;
175 },
176
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100177 job_progress_bar: function(elapsed_time, remaining_time) {
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100178 var progress_percent = 100 * (elapsed_time / (elapsed_time +
179 remaining_time));
180 var $bar_inner = $('<div />')
181 .addClass('progress-bar')
182 .attr('role', 'progressbar')
183 .attr('aria-valuenow', 'progressbar')
184 .attr('aria-valuemin', progress_percent)
185 .attr('aria-valuemin', '0')
186 .attr('aria-valuemax', '100')
187 .css('width', progress_percent + '%');
188
189 var $bar_outter = $('<div />')
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100190 .addClass('progress zuul-job-result')
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100191 .append($bar_inner);
192
193 return $bar_outter;
194 },
195
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100196 enqueue_time: function(ms) {
197 // Special format case for enqueue time to add style
198 var hours = 60 * 60 * 1000;
199 var now = Date.now();
200 var delta = now - ms;
Monty Taylor860bb0a2014-03-22 09:41:25 -0700201 var status = 'text-success';
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000202 var text = this.time(delta, true);
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100203 if (delta > (4 * hours)) {
Monty Taylor860bb0a2014-03-22 09:41:25 -0700204 status = 'text-danger';
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100205 } else if (delta > (2 * hours)) {
Monty Taylor860bb0a2014-03-22 09:41:25 -0700206 status = 'text-warning';
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100207 }
208 return '<span class="' + status + '">' + text + '</span>';
209 },
210
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100211 time: function(ms, words) {
Monty Taylor860bb0a2014-03-22 09:41:25 -0700212 if (typeof(words) === 'undefined') {
213 words = false;
214 }
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100215 var seconds = (+ms)/1000;
216 var minutes = Math.floor(seconds/60);
217 var hours = Math.floor(minutes/60);
218 seconds = Math.floor(seconds % 60);
219 minutes = Math.floor(minutes % 60);
Monty Taylor860bb0a2014-03-22 09:41:25 -0700220 var r = '';
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100221 if (words) {
222 if (hours) {
223 r += hours;
224 r += ' hr ';
225 }
226 r += minutes + ' min';
227 } else {
Monty Taylor860bb0a2014-03-22 09:41:25 -0700228 if (hours < 10) {
229 r += '0';
230 }
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100231 r += hours + ':';
Monty Taylor860bb0a2014-03-22 09:41:25 -0700232 if (minutes < 10) {
233 r += '0';
234 }
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100235 r += minutes + ':';
Monty Taylor860bb0a2014-03-22 09:41:25 -0700236 if (seconds < 10) {
237 r += '0';
238 }
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100239 r += seconds;
240 }
241 return r;
242 },
243
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100244 change_total_progress_bar: function(change) {
Monty Taylor860bb0a2014-03-22 09:41:25 -0700245 var job_percent = Math.floor(100 / change.jobs.length);
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100246 var $bar_outter = $('<div />')
247 .addClass('progress zuul-change-total-result');
248
249 $.each(change.jobs, function (i, job) {
250 var result = job.result ? job.result.toLowerCase() : null;
251 if (result === null) {
252 result = job.url ? 'in progress' : 'queued';
253 }
254
Monty Taylor860bb0a2014-03-22 09:41:25 -0700255 if (result !== 'queued') {
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100256 var $bar_inner = $('<div />')
257 .addClass('progress-bar');
258
259 switch (result) {
260 case 'success':
261 $bar_inner.addClass('progress-bar-success');
262 break;
263 case 'lost':
264 case 'failure':
265 $bar_inner.addClass('progress-bar-danger');
266 break;
267 case 'unstable':
268 $bar_inner.addClass('progress-bar-warning');
269 break;
270 case 'in progress':
271 case 'queued':
272 break;
273 }
274 $bar_inner.attr('title', job.name)
275 .css('width', job_percent + '%');
276 $bar_outter.append($bar_inner);
277 }
278 });
279 return $bar_outter;
280 },
281
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100282 change_header: function(change) {
Monty Taylor860bb0a2014-03-22 09:41:25 -0700283 var change_id = change.id || 'NA';
Timo Tijhof51516cd2013-04-09 01:32:29 +0200284
Monty Taylor860bb0a2014-03-22 09:41:25 -0700285 var $change_link = $('<small />');
Joshua Hesketh298c4912014-03-20 16:06:25 +1100286 if (change.url !== null) {
Jens Harbott898a8bf2017-10-04 13:12:04 +0000287 var github_id = change_id.match(/^([0-9]+),([0-9a-f]{40})$/);
Jamie Lennoxa6b33ba2017-02-10 11:33:44 +1100288 if (github_id) {
289 $change_link.append(
290 $('<a />').attr('href', change.url).append(
291 $('<abbr />')
Jens Harbott898a8bf2017-10-04 13:12:04 +0000292 .attr('title', change_id)
Jamie Lennoxa6b33ba2017-02-10 11:33:44 +1100293 .text('#' + github_id[1])
294 )
295 );
Jens Harbott898a8bf2017-10-04 13:12:04 +0000296 } else if (/^[0-9a-f]{40}$/.test(change_id)) {
297 var change_id_short = change_id.slice(0, 7);
Joshua Heskethcd7a0772014-08-21 11:32:44 +1000298 $change_link.append(
299 $('<a />').attr('href', change.url).append(
300 $('<abbr />')
Jens Harbott898a8bf2017-10-04 13:12:04 +0000301 .attr('title', change_id)
Joshua Heskethcd7a0772014-08-21 11:32:44 +1000302 .text(change_id_short)
303 )
304 );
305 }
306 else {
307 $change_link.append(
Jens Harbott898a8bf2017-10-04 13:12:04 +0000308 $('<a />').attr('href', change.url).text(change_id)
Joshua Heskethcd7a0772014-08-21 11:32:44 +1000309 );
310 }
Timo Tijhof51516cd2013-04-09 01:32:29 +0200311 }
Joshua Hesketh298c4912014-03-20 16:06:25 +1100312 else {
Jens Harbott898a8bf2017-10-04 13:12:04 +0000313 if (change_id.length === 40) {
314 change_id = change_id.substr(0, 7);
315 }
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100316 $change_link.text(change_id);
Timo Tijhof51516cd2013-04-09 01:32:29 +0200317 }
Timo Tijhof51516cd2013-04-09 01:32:29 +0200318
Monty Taylor860bb0a2014-03-22 09:41:25 -0700319 var $change_progress_row_left = $('<div />')
Timo Tijhofa62e8492015-04-02 03:05:04 +0100320 .addClass('col-xs-4')
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100321 .append($change_link);
Monty Taylor860bb0a2014-03-22 09:41:25 -0700322 var $change_progress_row_right = $('<div />')
Timo Tijhofa62e8492015-04-02 03:05:04 +0100323 .addClass('col-xs-8')
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000324 .append(this.change_total_progress_bar(change));
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100325
Monty Taylor860bb0a2014-03-22 09:41:25 -0700326 var $change_progress_row = $('<div />')
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100327 .addClass('row')
328 .append($change_progress_row_left)
Monty Taylor860bb0a2014-03-22 09:41:25 -0700329 .append($change_progress_row_right);
Joshua Heskethf1b06ca2014-03-21 17:01:12 +1100330
Monty Taylor860bb0a2014-03-22 09:41:25 -0700331 var $project_span = $('<span />')
Joshua Heskethace48892014-03-22 17:18:31 +1100332 .addClass('change_project')
333 .text(change.project);
334
Monty Taylor860bb0a2014-03-22 09:41:25 -0700335 var $left = $('<div />')
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100336 .addClass('col-xs-8')
Joshua Hesketh1751e4f2014-04-01 13:24:51 +1100337 .append($project_span, $change_progress_row);
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100338
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000339 var remaining_time = this.time(
Monty Taylor860bb0a2014-03-22 09:41:25 -0700340 change.remaining_time, true);
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000341 var enqueue_time = this.enqueue_time(
Monty Taylor860bb0a2014-03-22 09:41:25 -0700342 change.enqueue_time);
343 var $remaining_time = $('<small />').addClass('time')
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100344 .attr('title', 'Remaining Time').html(remaining_time);
Monty Taylor860bb0a2014-03-22 09:41:25 -0700345 var $enqueue_time = $('<small />').addClass('time')
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100346 .attr('title', 'Elapsed Time').html(enqueue_time);
347
James E. Blair6dc954b2015-02-11 18:32:19 -0800348 var $right = $('<div />');
349 if (change.live === true) {
350 $right.addClass('col-xs-4 text-right')
351 .append($remaining_time, $('<br />'), $enqueue_time);
352 }
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100353
Monty Taylor860bb0a2014-03-22 09:41:25 -0700354 var $header = $('<div />')
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100355 .addClass('row')
356 .append($left, $right);
357 return $header;
358 },
359
360 change_list: function(jobs) {
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000361 var format = this;
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100362 var $list = $('<ul />')
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100363 .addClass('list-group zuul-patchset-body');
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100364
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100365 $.each(jobs, function (i, job) {
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100366 var $item = $('<li />')
367 .addClass('list-group-item')
368 .addClass('zuul-change-job')
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000369 .append(format.job(job));
Joshua Hesketh298c4912014-03-20 16:06:25 +1100370 $list.append($item);
Timo Tijhof51516cd2013-04-09 01:32:29 +0200371 });
372
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100373 return $list;
374 },
375
376 change_panel: function (change) {
377 var $header = $('<div />')
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100378 .addClass('panel-heading zuul-patchset-header')
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000379 .append(this.change_header(change));
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100380
Joshua Heskethdb8046e2014-03-21 18:42:25 +1100381 var panel_id = change.id ? change.id.replace(',', '_')
382 : change.project.replace('/', '_') +
Monty Taylor860bb0a2014-03-22 09:41:25 -0700383 '-' + change.enqueue_time;
Joshua Heskethdb8046e2014-03-21 18:42:25 +1100384 var $panel = $('<div />')
Monty Taylor860bb0a2014-03-22 09:41:25 -0700385 .attr('id', panel_id)
Joshua Hesketh0ca1e2e2014-03-21 16:49:05 +1100386 .addClass('panel panel-default zuul-change')
387 .append($header)
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000388 .append(this.change_list(change.jobs));
Joshua Heskethdb8046e2014-03-21 18:42:25 +1100389
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000390 $header.click(this.toggle_patchset);
Joshua Heskethdb8046e2014-03-21 18:42:25 +1100391 return $panel;
Timo Tijhof51516cd2013-04-09 01:32:29 +0200392 },
393
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100394 change_status_icon: function(change) {
395 var icon_name = 'green.png';
396 var icon_title = 'Succeeding';
397
398 if (change.active !== true) {
399 // Grey icon
400 icon_name = 'grey.png';
401 icon_title = 'Waiting until closer to head of queue to' +
402 ' start jobs';
403 }
James E. Blair107c3852015-02-07 08:23:10 -0800404 else if (change.live !== true) {
405 // Grey icon
406 icon_name = 'grey.png';
Joshua Hesketh6bc619d2015-02-11 09:30:21 +1100407 icon_title = 'Dependent change required for testing';
James E. Blair107c3852015-02-07 08:23:10 -0800408 }
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100409 else if (change.failing_reasons &&
410 change.failing_reasons.length > 0) {
411 var reason = change.failing_reasons.join(', ');
412 icon_title = 'Failing because ' + reason;
413 if (reason.match(/merge conflict/)) {
414 // Black icon
415 icon_name = 'black.png';
416 }
417 else {
418 // Red icon
419 icon_name = 'red.png';
420 }
421 }
422
423 var $icon = $('<img />')
424 .attr('src', 'images/' + icon_name)
425 .attr('title', icon_title)
426 .css('margin-top', '-6px');
427
428 return $icon;
429 },
430
431 change_with_status_tree: function(change, change_queue) {
432 var $change_row = $('<tr />');
433
434 for (var i = 0; i < change_queue._tree_columns; i++) {
435 var $tree_cell = $('<td />')
436 .css('height', '100%')
437 .css('padding', '0 0 10px 0')
438 .css('margin', '0')
439 .css('width', '16px')
440 .css('min-width', '16px')
441 .css('overflow', 'hidden')
442 .css('vertical-align', 'top');
443
444 if (i < change._tree.length && change._tree[i] !== null) {
445 $tree_cell.css('background-image',
446 'url(\'images/line.png\')')
447 .css('background-repeat', 'repeat-y');
448 }
449
450 if (i === change._tree_index) {
451 $tree_cell.append(
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000452 this.change_status_icon(change));
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100453 }
454 if (change._tree_branches.indexOf(i) !== -1) {
455 var $image = $('<img />')
456 .css('vertical-align', 'baseline');
457 if (change._tree_branches.indexOf(i) ===
458 change._tree_branches.length - 1) {
459 // Angle line
460 $image.attr('src', 'images/line-angle.png');
461 }
462 else {
463 // T line
464 $image.attr('src', 'images/line-t.png');
465 }
466 $tree_cell.append($image);
467 }
468 $change_row.append($tree_cell);
469 }
470
471 var change_width = 360 - 16*change_queue._tree_columns;
472 var $change_column = $('<td />')
473 .css('width', change_width + 'px')
474 .addClass('zuul-change-cell')
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000475 .append(this.change_panel(change));
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100476
477 $change_row.append($change_column);
478
479 var $change_table = $('<table />')
480 .addClass('zuul-change-box')
481 .css('-moz-box-sizing', 'content-box')
482 .css('box-sizing', 'content-box')
483 .append($change_row);
484
485 return $change_table;
486 },
487
Joshua Hesketh9d013542014-04-03 13:08:04 +1100488 pipeline_sparkline: function(pipeline_name) {
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000489 if (options.graphite_url !== '') {
Joshua Hesketh9d013542014-04-03 13:08:04 +1100490 var $sparkline = $('<img />')
491 .addClass('pull-right')
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000492 .attr('src', get_sparkline_url(pipeline_name));
Joshua Hesketh9d013542014-04-03 13:08:04 +1100493 return $sparkline;
494 }
495 return false;
496 },
497
498 pipeline_header: function(pipeline, count) {
499 // Format the pipeline name, sparkline and description
500 var $header_div = $('<div />')
501 .addClass('zuul-pipeline-header');
502
503 var $heading = $('<h3 />')
504 .css('vertical-align', 'middle')
505 .text(pipeline.name)
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100506 .append(
Joshua Hesketh9d013542014-04-03 13:08:04 +1100507 $('<span />')
508 .addClass('badge pull-right')
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100509 .css('vertical-align', 'middle')
Joshua Hesketh9d013542014-04-03 13:08:04 +1100510 .css('margin-top', '0.5em')
511 .text(count)
512 )
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000513 .append(this.pipeline_sparkline(pipeline.name));
Joshua Hesketh9d013542014-04-03 13:08:04 +1100514
515 $header_div.append($heading);
Joshua Hesketh298c4912014-03-20 16:06:25 +1100516
Timo Tijhof51516cd2013-04-09 01:32:29 +0200517 if (typeof pipeline.description === 'string') {
Alexander Evseev057aed12015-10-28 17:17:04 +0300518 var descr = $('<small />')
519 $.each( pipeline.description.split(/\r?\n\r?\n/), function(index, descr_part){
520 descr.append($('<p />').text(descr_part));
521 });
Joshua Hesketh9d013542014-04-03 13:08:04 +1100522 $header_div.append(
Alexander Evseev057aed12015-10-28 17:17:04 +0300523 $('<p />').append(descr)
Joshua Hesketh298c4912014-03-20 16:06:25 +1100524 );
Timo Tijhof51516cd2013-04-09 01:32:29 +0200525 }
Joshua Hesketh9d013542014-04-03 13:08:04 +1100526 return $header_div;
527 },
528
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000529 pipeline: function (pipeline, count) {
530 var format = this;
Joshua Hesketh9d013542014-04-03 13:08:04 +1100531 var $html = $('<div />')
532 .addClass('zuul-pipeline col-md-4')
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000533 .append(this.pipeline_header(pipeline, count));
Timo Tijhof51516cd2013-04-09 01:32:29 +0200534
Joshua Heskethcbdcca12014-03-20 16:06:25 +1100535 $.each(pipeline.change_queues,
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100536 function (queue_i, change_queue) {
537 $.each(change_queue.heads, function (head_i, changes) {
Joshua Heskethcbdcca12014-03-20 16:06:25 +1100538 if (pipeline.change_queues.length > 1 &&
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100539 head_i === 0) {
540 var name = change_queue.name;
Joshua Hesketh6b1a2182014-03-21 14:40:04 +1100541 var short_name = name;
542 if (short_name.length > 32) {
543 short_name = short_name.substr(0, 32) + '...';
Timo Tijhof51516cd2013-04-09 01:32:29 +0200544 }
Joshua Hesketh298c4912014-03-20 16:06:25 +1100545 $html.append(
546 $('<p />')
547 .text('Queue: ')
548 .append(
549 $('<abbr />')
550 .attr('title', name)
551 .text(short_name)
552 )
553 );
Timo Tijhof51516cd2013-04-09 01:32:29 +0200554 }
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100555
556 $.each(changes, function (change_i, change) {
James E. Blair13c5ffc2017-09-05 07:59:13 -0700557 var $change_box =
558 format.change_with_status_tree(
559 change, change_queue);
560 $html.append($change_box);
561 format.display_patchset($change_box);
Timo Tijhof51516cd2013-04-09 01:32:29 +0200562 });
563 });
564 });
Joshua Hesketh298c4912014-03-20 16:06:25 +1100565 return $html;
Joshua Heskethace48892014-03-22 17:18:31 +1100566 },
567
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000568 toggle_patchset: function(e) {
569 // Toggle showing/hiding the patchset when the header is
570 // clicked.
571
Timo Tijhof0445c272017-09-19 19:46:09 +0100572 if (e.target.nodeName.toLowerCase() === 'a') {
573 // Ignore clicks from gerrit patch set link
574 return;
575 }
576
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000577 // Grab the patchset panel
578 var $panel = $(e.target).parents('.zuul-change');
579 var $body = $panel.children('.zuul-patchset-body');
580 $body.toggle(200);
581 var collapsed_index = collapsed_exceptions.indexOf(
582 $panel.attr('id'));
583 if (collapsed_index === -1 ) {
584 // Currently not an exception, add it to list
585 collapsed_exceptions.push($panel.attr('id'));
586 }
587 else {
588 // Currently an except, remove from exceptions
589 collapsed_exceptions.splice(collapsed_index, 1);
590 }
591 },
592
593 display_patchset: function($change_box, animate) {
594 // Determine if to show or hide the patchset and/or the results
595 // when loaded
596
597 // See if we should hide the body/results
598 var $panel = $change_box.find('.zuul-change');
599 var panel_change = $panel.attr('id');
600 var $body = $panel.children('.zuul-patchset-body');
601 var expand_by_default = $('#expand_by_default')
602 .prop('checked');
603
604 var collapsed_index = collapsed_exceptions
605 .indexOf(panel_change);
606
607 if (expand_by_default && collapsed_index === -1 ||
608 !expand_by_default && collapsed_index !== -1) {
609 // Expand by default, or is an exception
610 $body.show(animate);
611 }
612 else {
613 $body.hide(animate);
614 }
615
616 // Check if we should hide the whole panel
617 var panel_project = $panel.find('.change_project').text()
618 .toLowerCase();
619
620
621 var panel_pipeline = $change_box
622 .parents('.zuul-pipeline')
623 .find('.zuul-pipeline-header > h3')
624 .html()
625 .toLowerCase();
626
627 if (current_filter !== '') {
628 var show_panel = false;
629 var filter = current_filter.trim().split(/[\s,]+/);
630 $.each(filter, function(index, f_val) {
631 if (f_val !== '') {
632 f_val = f_val.toLowerCase();
633 if (panel_project.indexOf(f_val) !== -1 ||
634 panel_pipeline.indexOf(f_val) !== -1 ||
635 panel_change.indexOf(f_val) !== -1) {
636 show_panel = true;
637 }
638 }
639 });
640 if (show_panel === true) {
641 $change_box.show(animate);
642 }
643 else {
644 $change_box.hide(animate);
645 }
646 }
647 else {
648 $change_box.show(animate);
649 }
650 },
651 };
652
653 var app = {
654 schedule: function (app) {
Timo Tijhof4be9f742015-04-02 01:13:19 +0100655 app = app || this;
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000656 if (!options.enabled) {
657 setTimeout(function() {app.schedule(app);}, 5000);
658 return;
659 }
Timo Tijhof9a2362d2017-08-24 12:55:00 -0600660 app.update().always(function () {
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000661 setTimeout(function() {app.schedule(app);}, 5000);
662 });
663
664 /* Only update graphs every minute */
665 if (zuul_graph_update_count > 11) {
666 zuul_graph_update_count = 0;
667 zuul.update_sparklines();
668 }
669 },
670
671 /** @return {jQuery.Promise} */
672 update: function () {
673 // Cancel the previous update if it hasn't completed yet.
674 if (xhr) {
675 xhr.abort();
676 }
677
678 this.emit('update-start');
679 var app = this;
680
Timo Tijhof4be9f742015-04-02 01:13:19 +0100681 var $msg = $(options.msg_id);
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000682 xhr = $.getJSON(options.source)
683 .done(function (data) {
684 if ('message' in data) {
685 $msg.removeClass('alert-danger')
686 .addClass('alert-info')
687 .text(data.message)
688 .show();
689 } else {
690 $msg.empty()
691 .hide();
692 }
693
694 if ('zuul_version' in data) {
695 $('#zuul-version-span').text(data.zuul_version);
696 }
697 if ('last_reconfigured' in data) {
698 var last_reconfigured =
699 new Date(data.last_reconfigured);
700 $('#last-reconfigured-span').text(
701 last_reconfigured.toString());
702 }
703
704 var $pipelines = $(options.pipelines_id);
705 $pipelines.html('');
706 $.each(data.pipelines, function (i, pipeline) {
707 var count = app.create_tree(pipeline);
708 $pipelines.append(
709 format.pipeline(pipeline, count));
710 });
711
712 $(options.queue_events_num).text(
713 data.trigger_event_queue ?
714 data.trigger_event_queue.length : '0'
715 );
716 $(options.queue_results_num).text(
717 data.result_event_queue ?
718 data.result_event_queue.length : '0'
719 );
720 })
Timo Tijhof67f4ac12015-04-10 00:33:50 +0100721 .fail(function (jqXHR, statusText, errMsg) {
722 if (statusText === 'abort') {
723 return;
724 }
Joshua Heskethd50eb582014-04-30 19:51:22 +1000725 $msg.text(options.source + ': ' + errMsg)
726 .addClass('alert-danger')
727 .removeClass('zuul-msg-wrap-off')
728 .show();
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000729 })
Timo Tijhof9a2362d2017-08-24 12:55:00 -0600730 .always(function () {
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000731 xhr = undefined;
732 app.emit('update-end');
733 });
734
735 return xhr;
736 },
737
738 update_sparklines: function() {
739 $.each(zuul_sparkline_urls, function(name, url) {
740 var newimg = new Image();
741 var parts = url.split('#');
742 newimg.src = parts[0] + '#' + new Date().getTime();
Timo Tijhof4be9f742015-04-02 01:13:19 +0100743 $(newimg).load(function () {
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000744 zuul_sparkline_urls[name] = newimg.src;
745 });
746 });
747 },
748
749 emit: function () {
750 $jq.trigger.apply($jq, arguments);
751 return this;
752 },
753 on: function () {
754 $jq.on.apply($jq, arguments);
755 return this;
756 },
757 one: function () {
758 $jq.one.apply($jq, arguments);
759 return this;
760 },
761
762 control_form: function() {
763 // Build the filter form filling anything from cookies
764
765 var $control_form = $('<form />')
766 .attr('role', 'form')
767 .addClass('form-inline')
768 .submit(this.handle_filter_change);
769
770 $control_form
771 .append(this.filter_form_group())
772 .append(this.expand_form_group());
773
774 return $control_form;
775 },
776
Joshua Hesketh1ed6f9d2014-03-31 22:53:06 +1100777 filter_form_group: function() {
Joshua Heskethace48892014-03-22 17:18:31 +1100778 // Update the filter form with a clear button if required
779
780 var $label = $('<label />')
781 .addClass('control-label')
782 .attr('for', 'filter_string')
783 .text('Filters')
784 .css('padding-right', '0.5em');
785
786 var $input = $('<input />')
787 .attr('type', 'text')
788 .attr('id', 'filter_string')
789 .addClass('form-control')
790 .attr('title',
791 'project(s), pipeline(s) or review(s) comma ' +
792 'separated')
Joshua Hesketh1ed6f9d2014-03-31 22:53:06 +1100793 .attr('value', current_filter);
Joshua Heskethace48892014-03-22 17:18:31 +1100794
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000795 $input.change(this.handle_filter_change);
Joshua Heskethace48892014-03-22 17:18:31 +1100796
797 var $clear_icon = $('<span />')
798 .addClass('form-control-feedback')
799 .addClass('glyphicon glyphicon-remove-circle')
800 .attr('id', 'filter_form_clear_box')
801 .attr('title', 'clear filter')
802 .css('cursor', 'pointer');
803
804 $clear_icon.click(function() {
805 $('#filter_string').val('').change();
806 });
807
Joshua Hesketh1ed6f9d2014-03-31 22:53:06 +1100808 if (current_filter === '') {
Joshua Heskethace48892014-03-22 17:18:31 +1100809 $clear_icon.hide();
810 }
811
812 var $form_group = $('<div />')
813 .addClass('form-group has-feedback')
814 .append($label, $input, $clear_icon);
815 return $form_group;
816 },
817
Joshua Heskethae230f62014-03-22 22:14:44 +1100818 expand_form_group: function() {
Monty Taylor860bb0a2014-03-22 09:41:25 -0700819 var expand_by_default = (
Joshua Heskethae230f62014-03-22 22:14:44 +1100820 read_cookie('zuul_expand_by_default', false) === 'true');
821
Monty Taylor860bb0a2014-03-22 09:41:25 -0700822 var $checkbox = $('<input />')
Joshua Heskethae230f62014-03-22 22:14:44 +1100823 .attr('type', 'checkbox')
824 .attr('id', 'expand_by_default')
825 .prop('checked', expand_by_default)
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000826 .change(this.handle_expand_by_default);
Joshua Heskethae230f62014-03-22 22:14:44 +1100827
Monty Taylor860bb0a2014-03-22 09:41:25 -0700828 var $label = $('<label />')
Joshua Heskethae230f62014-03-22 22:14:44 +1100829 .css('padding-left', '1em')
830 .html('Expand by default: ')
831 .append($checkbox);
832
833 var $form_group = $('<div />')
834 .addClass('checkbox')
835 .append($label);
836 return $form_group;
837 },
838
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000839 handle_filter_change: function() {
840 // Update the filter and save it to a cookie
841 current_filter = $('#filter_string').val();
842 set_cookie('zuul_filter_string', current_filter);
843 if (current_filter === '') {
844 $('#filter_form_clear_box').hide();
Joshua Heskethace48892014-03-22 17:18:31 +1100845 }
846 else {
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000847 $('#filter_form_clear_box').show();
Joshua Heskethace48892014-03-22 17:18:31 +1100848 }
Joshua Heskethace48892014-03-22 17:18:31 +1100849
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000850 $('.zuul-change-box').each(function(index, obj) {
851 var $change_box = $(obj);
852 format.display_patchset($change_box, 200);
Joshua Hesketh5caf4f62014-04-01 12:52:43 +1100853 });
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000854 return false;
Timo Tijhof51516cd2013-04-09 01:32:29 +0200855 },
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000856
857 handle_expand_by_default: function(e) {
858 // Handle toggling expand by default
859 set_cookie('zuul_expand_by_default', e.target.checked);
860 collapsed_exceptions = [];
861 $('.zuul-change-box').each(function(index, obj) {
862 var $change_box = $(obj);
863 format.display_patchset($change_box, 200);
864 });
865 },
866
867 create_tree: function(pipeline) {
868 var count = 0;
869 var pipeline_max_tree_columns = 1;
870 $.each(pipeline.change_queues, function(change_queue_i,
871 change_queue) {
872 var tree = [];
873 var max_tree_columns = 1;
874 var changes = [];
875 var last_tree_length = 0;
876 $.each(change_queue.heads, function(head_i, head) {
877 $.each(head, function(change_i, change) {
878 changes[change.id] = change;
879 change._tree_position = change_i;
880 });
881 });
882 $.each(change_queue.heads, function(head_i, head) {
883 $.each(head, function(change_i, change) {
James E. Blaird1d3ce32015-02-11 17:56:45 -0800884 if (change.live === true) {
885 count += 1;
886 }
Joshua Hesketh0f5c66a2014-04-30 19:23:36 +1000887 var idx = tree.indexOf(change.id);
888 if (idx > -1) {
889 change._tree_index = idx;
890 // remove...
891 tree[idx] = null;
892 while (tree[tree.length - 1] === null) {
893 tree.pop();
894 }
895 } else {
896 change._tree_index = 0;
897 }
898 change._tree_branches = [];
899 change._tree = [];
900 if (typeof(change.items_behind) === 'undefined') {
901 change.items_behind = [];
902 }
903 change.items_behind.sort(function(a, b) {
904 return (changes[b]._tree_position -
905 changes[a]._tree_position);
906 });
907 $.each(change.items_behind, function(i, id) {
908 tree.push(id);
909 if (tree.length>last_tree_length &&
910 last_tree_length > 0) {
911 change._tree_branches.push(
912 tree.length - 1);
913 }
914 });
915 if (tree.length > max_tree_columns) {
916 max_tree_columns = tree.length;
917 }
918 if (tree.length > pipeline_max_tree_columns) {
919 pipeline_max_tree_columns = tree.length;
920 }
921 change._tree = tree.slice(0); // make a copy
922 last_tree_length = tree.length;
923 });
924 });
925 change_queue._tree_columns = max_tree_columns;
926 });
927 pipeline._tree_columns = pipeline_max_tree_columns;
928 return count;
929 },
930 };
931
932 $jq = $(app);
933 return {
934 options: options,
935 format: format,
936 app: app,
937 jq: $jq
938 };
Timo Tijhof4be9f742015-04-02 01:13:19 +0100939 };
Timo Tijhof51516cd2013-04-09 01:32:29 +0200940}(jQuery));