Skip to content

Commit

Permalink
Merge pull request #1063 from Martchus/fix_media_editor
Browse files Browse the repository at this point in the history 
Fix misleading allingment in job template editor
  • Loading branch information
@coolo
coolo committed Dec 5, 2016
2 parents ccd47bb + b2887cf commit e1068e4
Showing 1 changed file with 126 additions and 112 deletions.
238 changes: 126 additions & 112 deletions assets/javascripts/job_templates.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,17 +11,17 @@ function loadJobTemplates(data) {
var mediagroups = {};
var groups = [];
$.each(data.JobTemplates, function(i, jt) {
var media = mediagroups[jt.product.group];
if (!media) {
groups.push(jt.product.group);
media = [];
}
media.push(jt);
mediagroups[jt.product.group] = media;
var media = mediagroups[jt.product.group];
if (!media) {
groups.push(jt.product.group);
media = [];
}
media.push(jt);
mediagroups[jt.product.group] = media;
});
groups.sort();
$.each(groups, function(i, group) {
buildMediumGroup(group, mediagroups[group]);
buildMediumGroup(group, mediagroups[group]);
});
var width = alignCols() - 16;
$('#loading').remove();
Expand All @@ -38,16 +38,16 @@ function highlightChosen(chosen) {
function templateRemoved(chosen, deselected) {
var jid = chosen.find('option[value="' + deselected + '"]').data('jid');
$.ajax({url: job_templates_url + "/" + jid,
type: 'DELETE',
dataType: 'json'}).done(function() { highlightChosen(chosen); });
type: 'DELETE',
dataType: 'json'}).done(function() { highlightChosen(chosen); });
}

function addFailed(data) {
// display something without alert
if (data.hasOwnProperty('responseJSON')) {
alert(data.responseJSON.error);
alert(data.responseJSON.error);
} else {
alert("unknown error");
alert("unknown error");
}
}

Expand All @@ -60,7 +60,7 @@ function addSucceeded(chosen, selected, data) {
function finalizeTest(tr) {
var test_select = tr.find('td.name select');
if (!test_select)
return;
return;
test_select.prop('disabled', true);
tr.data('test-id', test_select.find('option:selected').data('test-id'));
}
Expand All @@ -76,16 +76,16 @@ function templateAdded(chosen, selected) {
temp['test_suite_id'] = tr.data('test-id');

$.ajax({url: job_templates_url,
type: 'POST',
dataType: 'json',
data: temp}).fail(addFailed).done(function(data) { addSucceeded(chosen, selected, data); });
type: 'POST',
dataType: 'json',
data: temp}).fail(addFailed).done(function(data) { addSucceeded(chosen, selected, data); });
}

function chosenChanged(evt, param) {
if (param.deselected) {
templateRemoved($(this), param.deselected);
templateRemoved($(this), param.deselected);
} else {
templateAdded($(this), param.selected);
templateAdded($(this), param.selected);
}
}

Expand All @@ -106,17 +106,24 @@ function addTestRow() {
$('<td class="prio">50</td>').appendTo(tr);

var archnames = table.data('archs');
$.each(archnames, function(ai, arch) {
var td = $('<td class="arch"/>').appendTo(tr);
var select = $('#machines-template').clone().appendTo(td);
select.attr('id', $(this).parent('table').id + "-" + arch + "-" + 'new');
select.attr('data-product-id', table.data('product-' + arch));
select.addClass('chosen-select');
select.show();
var width = $('.chosen-container').width();
select.chosen({"width": width + "px"});
// wait for the combo box to be selected
select.prop('disabled', true).trigger("chosen:updated");
var archHeaders = table.find('thead th.arch');
var archColIndex = 0;
$.each(archnames, function(archIndex, arch) {
while (archColIndex < archHeaders.length
&& !archHeaders[archColIndex].innerText.trim()) {
$('<td class="arch"/>').appendTo(tr);
++archColIndex;
}
var td = $('<td class="arch"/>').appendTo(tr);
var select = $('#machines-template').clone().appendTo(td);
select.attr('id', $(this).parent('table').id + "-" + arch + "-" + 'new');
select.attr('data-product-id', table.data('product-' + arch));
select.addClass('chosen-select');
select.show();
var width = $('.chosen-container').width();
select.chosen({"width": width + "px"});
// wait for the combo box to be selected
select.prop('disabled', true).trigger("chosen:updated");
});

return false;
Expand All @@ -134,108 +141,115 @@ function buildMediumGroup(group, media) {
var tests = {};
var prio = 444;
$.each(media, function(index, temp) {
var a = archs[temp.product.arch];
if (!a)
a = {};
if (!a.hasOwnProperty(temp.test_suite.name)) {
a[temp.test_suite.name] = [];
table.data('product-' + temp.product.arch, temp.product.id);
a['_id'] = temp.product.id;
}
a[temp.test_suite.name].push(temp);
archs[temp.product.arch] = a;
tests[temp.test_suite.name] = { 'prio': temp.prio,
'id': temp.test_suite.id };
var a = archs[temp.product.arch];
if (!a)
a = {};
if (!a.hasOwnProperty(temp.test_suite.name)) {
a[temp.test_suite.name] = [];
table.data('product-' + temp.product.arch, temp.product.id);
a['_id'] = temp.product.id;
}
a[temp.test_suite.name].push(temp);
archs[temp.product.arch] = a;
tests[temp.test_suite.name] = { 'prio': temp.prio,
'id': temp.test_suite.id };
});
var archnames = Object.keys(archs).sort();
table.data('archs', archnames);
var testnames = Object.keys(tests).sort();
$.each(archnames, function(index, arch) {
var a = $('<th class="arch arch_' + arch + '">' + arch + '</th>').appendTo(tr);
var a = $('<th class="arch arch_' + arch + '">' + arch + '</th>').appendTo(tr);
});
var tbody = $('<tbody/>').appendTo(table);
$.each(testnames, function(ti, test) {
var tr = $('<tr class="test_' + test + '"/>').appendTo(tbody);
tr.data('test-id', tests[test]['id']);
var shortname = test;
if (test.length >= 70) {
var tr = $('<tr class="test_' + test + '"/>').appendTo(tbody);
tr.data('test-id', tests[test]['id']);
var shortname = test;
if (test.length >= 70) {
shortname = '<span title='+test+'>' + test.substr(0,67) + '…</span>';
}
$('<td class="name">' + shortname + '</td>').appendTo(tr);
$('<td class="prio">' + tests[test]['prio'] + '</td>').appendTo(tr);
$.each(archnames, function(ai, arch) {
var td = $('<td class="arch"/>').appendTo(tr);
var select = $('#machines-template').clone().appendTo(td);
select.attr('id', group + "-" + arch + "-" + test);
select.attr('data-product-id', archs[arch]['_id']);
select.addClass('chosen-select');
if (archs.hasOwnProperty(arch) && archs[arch].hasOwnProperty(test)) {
$.each(archs[arch][test], function(mi, temp) {
var option = select.find("option[value='" + temp.machine.name + "']").prop('selected', true);
// remember the id for DELETE
option.data('jid', temp.id);
});
}
});
}
$('<td class="name">' + shortname + '</td>').appendTo(tr);
$('<td class="prio">' + tests[test]['prio'] + '</td>').appendTo(tr);

$.each(archnames, function(archIndex, arch) {
var td = $('<td class="arch"/>').appendTo(tr);
var select = $('#machines-template').clone().appendTo(td);
select.attr('id', group + "-" + arch + "-" + test);
select.attr('data-product-id', archs[arch]['_id']);
select.addClass('chosen-select');
if (archs.hasOwnProperty(arch) && archs[arch].hasOwnProperty(test)) {
$.each(archs[arch][test], function(mi, temp) {
var option = select.find("option[value='" + temp.machine.name + "']").prop('selected', true);
// remember the id for DELETE
option.data('jid', temp.id);
});
}
});
});
}

function addArchSpacer(table, position, method) {
$(table).find('thead th.arch').eq(position)[method]('<th class="arch">&nbsp;</th>');
$(table).find('tbody tr').each(function(){
$(this).find('td.arch').eq(position)[method]('<td class="arch">&nbsp;</td>');
});
$(table).find('thead th.arch').eq(position)[method]('<th class="arch">&nbsp;</th>');
$(table).find('tbody tr').each(function(){
$(this).find('td.arch').eq(position)[method]('<td class="arch">&nbsp;</td>');
});
}

function findHeaderWithAllArchitectures() {
var headerWithAllArchs = [];
$("table.mediagroup thead").each(function() {
var archs = $(this).find('th.arch');
if (archs.length > headerWithAllArchs.length)
headerWithAllArchs = archs;
});
return headerWithAllArchs;
}

function fillEmptySpace(table, tableHead, headerWithAllArchs) {
if (tableHead.length < headerWithAllArchs.length) {
headerWithAllArchs.each(function(i) {
// Used all ths, fill the rest
if (tableHead.length == i) {
for(var j = i; j < headerWithAllArchs.length; j++) {
addArchSpacer(table, j-1, 'after');
}
return false;
} else if (this.innerHTML != tableHead.get(i).innerHTML) {
addArchSpacer(table, i, 'before');
tableHead = $(table).find('thead th.arch');
}
});
}
}

function alignCols() {
// Set minimal width
$('th.name').width('0');
$('th.prio').width('0');

// Find biggest minimal width
var namewidth = 450;
$('td.name').each(function(index, test) {
if ($(this).outerWidth() > namewidth)
namewidth = $(this).outerWidth();
});
namewidth = Math.ceil(namewidth);
// Set minimal width
$('th.name').width('0');
$('th.prio').width('0');

// Find header with all architectures
var ths_all = [];
$("table.mediagroup thead").each(function() {
var archs = $(this).find('th.arch');
if (archs.length > ths_all.length)
ths_all = archs;
// Find biggest minimal width
var namewidth = 450;
$('td.name').each(function(index, test) {
if ($(this).outerWidth() > namewidth)
namewidth = $(this).outerWidth();
});
namewidth = Math.ceil(namewidth);

var headerWithAllArchs = findHeaderWithAllArchitectures();

// Fill empty space
$("table.mediagroup").each(function(index, table) {
var ths = $(this).find('thead th.arch');
if (ths.length < ths_all.length) {
ths_all.each(function(i) {
// Used all ths, fill the rest
if (ths.length == i) {
for(var j = i; j < ths_all.length; j++) {
addArchSpacer(table, j-1, 'after');
}
return false;
} else if (this.innerHTML != ths.get(i).innerHTML) {
addArchSpacer(table, i, 'before');
ths = $(table).find('thead th.arch');
}
});
}
});
// Fill empty space
$("table.mediagroup").each(function(index, table) {
fillEmptySpace(table, $(this).find('thead th.arch'), headerWithAllArchs);
});

// Compute arch width
var archwidth = $('.jobtemplate-header').outerWidth() - namewidth - $('th.prio').outerWidth();
archwidth = Math.floor(archwidth / ths_all.length) - 1;
// Compute arch width
var archwidth = $('.jobtemplate-header').outerWidth() - namewidth - $('th.prio').outerWidth();
archwidth = Math.floor(archwidth / headerWithAllArchs.length) - 1;

$('th.name').outerWidth(namewidth);
$('th.arch').outerWidth(archwidth);
$('th.name').outerWidth(namewidth);
$('th.arch').outerWidth(archwidth);

return archwidth;
return archwidth;
}

function toggleEdit() {
Expand All @@ -254,8 +268,8 @@ function submitProperties(form) {
editorForm.find('.progress-indication').show();
$.ajax({
url: editorForm.data('put-url'),
method: 'PUT',
data: editorForm.serialize(),
method: 'PUT',
data: editorForm.serialize(),
success: function() {
var newJobName = $('#editor-name').val();
showSubmitResults(editorForm, '<span class="glyphicon glyphicon-floppy-saved" aria-hidden="true"></span> Changes applied');
Expand Down

0 comments on commit e1068e4

Please sign in to comment.