Skip to content

Commit

Permalink
Merge pull request #765 from os-autoinst/fix_back_button
Browse files Browse the repository at this point in the history 
Be way more careful with history manipulation on results page
  • Loading branch information
@coolo
coolo committed Jun 30, 2016
2 parents 8a51e0a + 9737686 commit 1e9c29b
Showing 1 changed file with 84 additions and 67 deletions.
151 changes: 84 additions & 67 deletions assets/javascripts/test_result.js
View file
Original file line number Diff line number Diff line change
@@ -1,49 +1,49 @@
function checkPreviewVisible(a, preview) {
// scroll the element to the top if the preview is not in view
if (a.offset().top + preview.height() > $(window).scrollTop() + $(window).height()) {
$('body, html').animate({
$("body, html").animate({
scrollTop: a.offset().top-3
}, 250);
}

var rrow = $('#result-row');
var rrow = $("#result-row");
var extraMargin = 40;
var endOfPreview = a.offset().top + preview.height() + extraMargin;
var endOfRow = rrow.height() + rrow.offset().top;
if (endOfPreview > endOfRow) {
// only enlarge the margin - otherwise the page scrolls back
rrow.css('margin-bottom', endOfPreview - endOfRow + extraMargin);
rrow.css("margin-bottom", endOfPreview - endOfRow + extraMargin);
}
}

function previewSuccess(data, force) {
$('#preview_container_in').html(data);
var a = $('.current_preview');
$("#preview_container_in").html(data);
var a = $(".current_preview");
var td = a.parent();

var a_index = td.children('.links_a').index(a);
var a_index = td.children(".links_a").index(a);

// a width = 64
var as_per_row = Math.floor(td.width() / 64);
var full_top_rows = Math.ceil((a_index+1) / as_per_row);
var preview_offset = (as_per_row * full_top_rows) - 1;
var as_count = td.children('.links_a').length - 1;
var as_count = td.children(".links_a").length - 1;
if (as_count < preview_offset) {
preview_offset = as_count;
}

var pout = $('#preview_container_out');
var pout = $("#preview_container_out");
// make it visible so jquery gets the props right
pout.insertAfter(td.children('.links_a').eq(preview_offset));
pout.insertAfter(td.children(".links_a").eq(preview_offset));

var pin = $('#preview_container_in');
if (!(pin.find('pre').length || pin.find('audio').length)) {
window.differ = new NeedleDiff('needle_diff', 1024, 768);
setDiffScreenshot(window.differ, $('#preview_container_in #step_view').data('image'));
var pin = $("#preview_container_in");
if (!(pin.find("pre").length || pin.find("audio").length)) {
window.differ = new NeedleDiff("needle_diff", 1024, 768);
setDiffScreenshot(window.differ, $("#preview_container_in #step_view").data("image"));
setNeedle();
}
pin.css('left', -($('.result').width()+$('.component').width()+2*16));
var tdWidth = $('.current_preview').parents('td').width();
pin.css("left", -($(".result").width()+$(".component").width()+2*16));
var tdWidth = $(".current_preview").parents("td").width();
pout.width(tdWidth).hide().fadeIn({
duration: (force?0:150),
complete: function() {
Expand All @@ -52,94 +52,106 @@ function previewSuccess(data, force) {
});
}

function setResultHash(hash) {
function mapHash(hash) {
return (hash === "#details" || hash.length < 2) ? "#" : hash;
}

function setResultHash(hash, replace) {
// the details tab is the real page
if (hash == '#details')
hash = '#';
if(history.pushState) {
hash = mapHash(hash);
var locationhash = mapHash(window.location.hash);
if (locationhash === hash) { return; }
if (replace && history.replaceState) {
history.replaceState(null, null, hash);
} else if (!replace && history.pushState) {
history.pushState(null, null, hash);
} else {
location.hash = hash;
}
}

function setCurrentPreview(a, force) {
if ((a && a.length && !a.is('.current_preview')) || force) {
function setCurrentPreview(a, replace, force) {
if ((a && a.length && !a.is(".current_preview")) || force) {
// show
$('.current_preview').removeClass('current_preview');
$(".current_preview").removeClass("current_preview");

var link = a.find('a');
if (!link || !link.data('url')) {
var link = a.find("a");
if (!link || !link.data("url")) {
return;
}
a.addClass('current_preview');
setResultHash(link.attr('href'));
$.get({ url: link.data('url'), success: function(data) { previewSuccess(data, force); }}).fail(function() { setCurrentPreview(); });
a.addClass("current_preview");
setResultHash(link.attr("href"), replace);
$.get({ url: link.data("url"),
success: function(data) {
previewSuccess(data, force);
}
}).fail(function() { setCurrentPreview(null, true); });
}
else {
// hide
$('#preview_container_out').fadeOut(150);
$('.current_preview').removeClass('current_preview');
$("#preview_container_out").fadeOut(150);
$(".current_preview").removeClass("current_preview");
}
}

function nextPreview() {
var a = $('.current_preview');
var a = $(".current_preview");
if(a) {
var table = $('.current_preview').parents('table');
var a_index = table.find('.links_a').index(a);
var table = $(".current_preview").parents("table");
var a_index = table.find(".links_a").index(a);
var next_a = a_index + 1;
var b = table.find('.links_a').eq(next_a);
var b = table.find(".links_a").eq(next_a);
if (b.length) {
setCurrentPreview(b);
setCurrentPreview(b, true);
}
}
}

function prevPreview() {
var a = $('.current_preview');
var a = $(".current_preview");
if (a) {
var table = $('.current_preview').parents('table');
var a_index = table.find('.links_a').index(a);
var table = $(".current_preview").parents("table");
var a_index = table.find(".links_a").index(a);
var next_a = a_index - 1;
if (next_a >= 0) {
var b = table.find('.links_a').eq(next_a);
var b = table.find(".links_a").eq(next_a);
if (b.length) {
setCurrentPreview(b);
setCurrentPreview(b, true);
}
}
}
}

function checkResultHash() {
var hash = window.location.hash;
if (!hash || hash == '#') {
hash = '#details';
if (!hash || hash == "#") {
hash = "#details";
}
var link = $('[href="' + hash + '"]');
if (link && link.attr('role') === 'tab') {
if (!link.prop('aria-expanded')) {
link.tab('show');
var link = $("[href='" + hash + "']");
if (link && link.attr("role") === "tab") {
if (!link.prop("aria-expanded")) {
link.tab("show");
}
}
if (hash.search('#step/') == 0) {
if (link && !link.parent().is('.current_preview')) {
setCurrentPreview(link.parent());
if (hash.search("#step/") == 0) {
var detailstab = $("[href='#details']");
detailstab.tab("show");
if (link && !link.parent().is(".current_preview")) {
setCurrentPreview(link.parent(), true);
} else if (!link) {
setCurrentPreview();
setCurrentPreview(null, true);
}
} else {
// reset
setCurrentPreview();
setCurrentPreview(null, true);
}
}

function setupResult(state, jobid) {
$(".current_preview").removeClass("current_preview");

$('.current_preview').removeClass('current_preview');

$(window).keydown(function(e) {
var ftn = $(':focus').prop("tagName");
var ftn = $(":focus").prop("tagName");
if (ftn == "INPUT" || ftn == "TEXTAREA") {
return;
}
Expand All @@ -154,39 +166,44 @@ function setupResult(state, jobid) {
nextPreview();
e.preventDefault();
} else if (e.which == KeyEvent.DOM_VK_ESCAPE) {
setCurrentPreview();
setCurrentPreview(null, true);
e.preventDefault();
}
});

$(window).resize(function() {
if($('.current_preview')) {
setCurrentPreview($('.current_preview'), true);
if ($(".current_preview")) {
setCurrentPreview($(".current_preview"), true, true);
}
});

$('.links_a > a').on('click', function() {
$(".links_a > a").on("click", function() {
setCurrentPreview($(this).parent());
return false;
});

// don't overwrite the tab if coming from the URL (ignore '#')
if (location.hash.length < 2) {
if (state == 'scheduled') {
$('#result_tabs a[href="#settings"]').tab('show');
} else if (state == 'running' || state == 'waiting') {
$('#result_tabs a[href="#live"]').tab('show');
if (state == "scheduled") {
setResultHash("#settings", true);
} else if (state == "running" || state == "waiting") {
setResultHash("#live", true);
}
}
if (state == 'running' || state == 'waiting') {
if (state == "running" || state == "waiting") {
setupRunning(jobid);
}
$(window).on('hashchange', checkResultHash);
$(window).on("hashchange", checkResultHash);
checkResultHash();

$(document).on('change', '#needlediff_selector', setNeedle);
$('a[data-toggle="tab"]').on('show.bs.tab', function(e) {
setResultHash($(e.target).attr('href'));

$(document).on("change", "#needlediff_selector", setNeedle);
$("a[data-toggle='tab']").on("show.bs.tab", function(e) {
var tabshown = $(e.target).attr("href");
// now this is very special
if (window.location.hash.search("#step/") == 0 && tabshown == "#details" ) {
return;
}
setResultHash(tabshown);
});
}

0 comments on commit 1e9c29b

Please sign in to comment.