EXTREMUM_web/base/static/js/radio_timeseries_dataset.js

74 lines
2.4 KiB
JavaScript

import { create_dataframe, create_selection } from './methods.js';
$(document).ready(function () {
$('#timeseries-datasets').change(function () {
const selectedDataset = $("input[name=timeseries_dataset]:checked").val();
if (selectedDataset) {
resetContainers();
toggleSkeletons(true);
const csrfToken = $("[name=csrfmiddlewaretoken]").val();
// AJAX request to fetch the dataset
$.ajax({
method: 'POST',
url: '', // Specify your endpoint here
headers: { 'X-CSRFToken': csrfToken },
data: { action: "timeseries-dataset", timeseries_dataset: selectedDataset },
success: function (response) {
alert("herereererer")
toggleSkeletons(false);
handleTimeseriesResponse(response);
},
error: function (error) {
toggleSkeletons(false);
console.error("An error occurred:", error);
}
});
}
});
/**
* Reset the containers by hiding any previous data.
*/
function resetContainers() {
const elementsToHide = [
"#df_div", "#stats_div", "#ts_confidence_div", "#ts_stats_div"
];
elementsToHide.forEach(selector => $(selector).empty().hide());
}
/**
* Toggle skeleton loaders for a smooth user experience.
* @param {boolean} show - Whether to show or hide the skeleton loaders.
*/
function toggleSkeletons(show) {
const skeletonSelectors = [
"#df_skeleton", "#stats_skeleton", "#ts_confidence_skeleton", "#ts_stats_skeleton"
];
skeletonSelectors.forEach(selector => $(selector).toggle(show));
}
/**
* Handle the response for timeseries dataset.
* @param {Object|string} response - The server response.
*/
function handleTimeseriesResponse(response) {
try {
const data = JSON.parse(response);
if (!data) throw new Error("Invalid response format");
// Populate data and stats
if (data.fig) {
$("#ts_confidence_div").html(data.fig).show();
}
if (data.fig1) {
$("#ts_stats_div").html(data.fig1).show();
}
} catch (error) {
console.error("Failed to process response:", error);
}
}
});