Added detailed examples endpoint and modified results.

This commit is contained in:
2024-12-26 15:30:00 +01:00
parent fb3acbda78
commit e6b57ce789
5 changed files with 253 additions and 24 deletions

79
static/js/examples.js Normal file
View File

@@ -0,0 +1,79 @@
$(document).ready(function() {
const visualizations = $(".visualization");
const batchSize = 10;
let startIndex = 0;
let loading = false; // Flag to prevent multiple simultaneous loads
$(".visualization").closest("tr").prev("tr").hide();
$(".visualization").closest("tr").hide();
function loadVisualizations(start, count) {
if (loading) return; // Prevent concurrent loads
loading = true;
const visualizationsToLoad = visualizations.slice(start, start + count);
let promises = [];
visualizationsToLoad.each(function() {
var $this = $(this); // Cache $(this) for better performance
var example_id = $this.data("example-id");
var example_positions = $this.data("example-positions");
var window_location = window.location.pathname.split("/");
var subtree_hash = window_location.pop(); // This line overwrites the earlier subtree_hash, is this intended?
var dir_name = window_location.pop();
var url = window.location.origin + '/stark/visualization/' + dir_name + '/' + example_id + '/' + example_positions;
promises.push($.ajax({
url: url,
success: function(result) {
var escapedHtml = `<pre><code class="conllu">${result['annodoc']}</code></pre>`;
$this.html(escapedHtml);
$('.conllu', $this).each(function() {
Annodoc.embedAnnotation($(this), Annodoc.parseConllU, Config.bratCollData);
});
$this.closest("tr").prev("tr").show();
$this.closest("tr").show();
},
error: function(jqXHR, textStatus, errorThrown) {
console.error("AJAX Error:", textStatus, errorThrown);
$this.html("<p>Error loading data.</p>");
$this.closest("tr").prev("tr").show();
$this.closest("tr").show();
},
complete: function() {
// Check if all AJAX calls in the current batch are complete
if (promises.every(p => p.state() === 'resolved' || p.state() === 'rejected')) {
loading = false; // Allow further loading
}
}
}));
});
}
function checkScroll() {
if ($(window).scrollTop() + $(window).height() >= $(document).height() - 200 && !loading) { // 200px buffer
loadVisualizations(startIndex, batchSize);
startIndex += batchSize;
}
}
// Initial load
if (typeof head !== 'undefined' && typeof head.ready === 'function') {
head.ready(function() {
loadVisualizations(startIndex, batchSize);
startIndex += batchSize;
});
} else {
if (typeof Annodoc !== 'undefined') {
loadVisualizations(startIndex, batchSize);
startIndex += batchSize;
} else {
console.error("head.js or Annodoc is not available. Ensure they are loaded correctly.");
}
}
$(window).scroll(checkScroll); // Attach scroll event listener
});

View File

@@ -23,10 +23,14 @@ $(document).ready(function() {
$(".table-wrapper tbody tr").click(function() {
$(".visualization-table").show();
var grew_url = $(this).data("href");
var subtree_hash = $(this).data("subtree-hash");
var example_id = $(this).data("exid");
var grew_link_text = $(this).data("grew-link-text");
var other_examples_text = $(this).data("other-examples-text");
var example_positions = $(this).data("expositions");
var dir_name = window.location.pathname.split("/").pop()
var url = window.location.origin + '/stark/visualization/' + dir_name + '/' + example_id + '/' + example_positions
var other_examples = window.location.origin + '/stark/result/' + dir_name + '/' + subtree_hash;
var url = window.location.origin + '/stark/visualization/' + dir_name + '/' + example_id + '/' + example_positions;
$.ajax({url: url, success: function(result){
var escapedHtml = `<pre><code class="conllu">${result['annodoc']}</code></pre>`;
$(".visualization").html(escapedHtml);
@@ -37,7 +41,12 @@ $(document).ready(function() {
if (grew_url == 'unknown') {
$(".grew-link").html("/");
} else {
$(".grew-link").html("<a href=" + grew_url + ">GREW link</a>");
$(".grew-link").html("<a href=" + grew_url + ">" + grew_link_text + "</a>");
}
if (other_examples == 'unknown') {
$(".other-examples").html("/");
} else {
$(".other-examples").html("<a href=" + other_examples + ">" + other_examples_text + "</a>");
}
});
$(".th-desc").hide();