From de97b55bc330568ca68a50a252cccbb240480f9c Mon Sep 17 00:00:00 2001 From: Étienne Loks Date: Thu, 4 Nov 2021 11:56:09 +0100 Subject: Syndication - stats UI --- ishtar_common/static/js/ishtar.js | 84 ++++++++++++--------- .../templates/blocks/DataTables-stats-detail.html | 79 ++++++++++++++++++++ .../templates/blocks/DataTables-stats.html | 85 +++------------------- ishtar_common/templates/blocks/DataTables.html | 16 ++++ 4 files changed, 155 insertions(+), 109 deletions(-) create mode 100644 ishtar_common/templates/blocks/DataTables-stats-detail.html diff --git a/ishtar_common/static/js/ishtar.js b/ishtar_common/static/js/ishtar.js index 8a8cbb8e9..b865c7153 100644 --- a/ishtar_common/static/js/ishtar.js +++ b/ishtar_common/static/js/ishtar.js @@ -1501,12 +1501,17 @@ var search_get_query_data = function(query_vars, table_name){ }; var registered_stats = false; +var extra_list = new Array(); +var sources = new Array(); var register_stats = function(query_vars, name, source){ if (registered_stats) return; registered_stats = true; - $("#stats-form-" + name + " select").on('change', function() { - _stats_submit_search(query_vars, name, source); + $("#stats-form-" + name + " select").on('change', + function() { + for (idx in extra_list){ + _stats_submit_search(query_vars, name, sources[idx], extra_list[idx]); + } } ); $('#chart-img-display-' + name).click(function(){ @@ -1520,11 +1525,12 @@ var register_stats = function(query_vars, name, source){ }); }; -var _stats_submit_search = function(query_vars, name, source){ +var _stats_submit_search = function(query_vars, name, source, extra){ + if (!extra) extra = ""; $('.modal-progress').modal('show'); var data = search_get_query_data(query_vars, name); - register_stats(query_vars, name, source); + register_stats(query_vars, name); var url = source + "json-stats?submited=1&" + data; var modality_1 = $("#stats_modality_1-" + name).val(); @@ -1537,7 +1543,8 @@ var _stats_submit_search = function(query_vars, name, source){ var timestamp = Math.floor(Date.now() / 1000); var stats_id = "stats-" + timestamp; $("#tab-content-stats-" + name).html( - render_stats(data, name)); + render_stats(data, name, extra) + ); if ($('.modal-progress').length > 0){ $('.modal-progress').modal('hide'); } @@ -1547,7 +1554,7 @@ var _stats_submit_search = function(query_vars, name, source){ var stats_showmarker = false; var stats_incompatible_modality = "This graph type accept only one modality."; -var stats_current_graph; +var stats_current_graph = new Array(); var _render_stats_empty = function(stats_values, name){ $("#charts-" + name).hide(); @@ -1563,7 +1570,7 @@ var _render_stats_too_many_values = function(name){ $("#stats-error-" + name).show(); } -var _render_stats_table = function(stats_values, name){ +var _render_stats_table = function(stats_values, name, extra){ var modality_1 = $("#stats_modality_1-" + name).val(); var modality_2 = $("#stats_modality_2-" + name).val(); var rows = new Array(); @@ -1625,21 +1632,23 @@ var _render_stats_table = function(stats_values, name){ } html += ""; - $("#charts-" + name).hide(); - $("#stats-empty-" + name).hide(); - $("#stats-error-" + name).hide(); - $("#stats-table-content-" + name).html(html); - $("#stats-table-" + name).show(); + if (!extra) extra = "default"; + $("#charts-" + name + "-" + extra).hide(); + $("#stats-empty-" + name + "-" + extra).hide(); + $("#stats-error-" + name + "-" + extra).hide(); + $("#stats-table-content-" + name + "-" + extra).html(html); + $("#stats-table-" + name + "-" + extra).show(); var encoded_uri = encodeURI("data:text/csv;charset=utf-8,") + encodeURIComponent(Papa.unparse(rows)); - $("#stats-table-csv-" + name).attr("href", encoded_uri); - $("#stats-table-csv-" + name).attr("download", "ishtar-stats.csv"); + $("#stats-table-csv-" + name + "-" + extra).attr("href", encoded_uri); + $("#stats-table-csv-" + name + "-" + extra).attr("download", "ishtar-stats.csv"); }; var MAX_STATS_GRAPH_VALUES = 100; var MAX_STATS_GRAPH_MODALITY_VALUES = 100; +var jqvalues = new Array(); -var render_stats = function(stats_values, name){ +var render_stats = function(stats_values, name, extra){ var stats_type = $("#stats_renderer-" + name).val(); if (!stats_values || !stats_values['data'] @@ -1649,11 +1658,12 @@ var render_stats = function(stats_values, name){ stats_values = stats_values['data']; - if (stats_current_graph){ - stats_current_graph.destroy(); + if (!extra) extra = "default"; + if (stats_current_graph[extra]){ + stats_current_graph[extra].destroy(); } if (stats_type == "table"){ - return _render_stats_table(stats_values, name); + return _render_stats_table(stats_values, name, extra); } if (stats_values.length > MAX_STATS_GRAPH_VALUES){ @@ -1667,10 +1677,10 @@ var render_stats = function(stats_values, name){ } } - $("#stats-table-" + name).hide(); - $("#stats-empty-" + name).hide(); - $("#stats-error-" + name).hide(); - $("#charts-" + name).show(); + $("#stats-table-" + name + "-" + extra).hide(); + $("#stats-empty-" + name + "-" + extra).hide(); + $("#stats-error-" + name + "-" + extra).hide(); + $("#charts-" + name + "-" + extra).show(); var modality_1 = $("#stats_modality_1-" + name).val(); var modality_2 = $("#stats_modality_2-" + name).val(); stats_xaxis = { @@ -1700,7 +1710,7 @@ var render_stats = function(stats_values, name){ if (stats_values.length < 25){ stats_showmarker = true; } - var jqvalues = new Array(); + jqvalues[extra] = new Array(); var ticks = new Array(); var series = new Array(); var series_conf = new Array(); @@ -1722,16 +1732,16 @@ var render_stats = function(stats_values, name){ fill_values.push(0); } } - jqvalues.push(fill_values); + jqvalues[extra].push(fill_values); } current_serie_values.push(serie_value); var current_value = serie_values[inner_idx][1]; - jqvalues[series.indexOf(serie_value)].push(current_value); + jqvalues[extra][series.indexOf(serie_value)].push(current_value); } // put 0 for missing series for this item for (idx_serie in series){ if (current_serie_values.indexOf(series[idx_serie]) == -1){ - jqvalues[series.indexOf(series[idx_serie])].push(0); + jqvalues[extra][series.indexOf(series[idx_serie])].push(0); } } } @@ -1740,7 +1750,7 @@ var render_stats = function(stats_values, name){ for (idx in stats_values){ stats_values[idx][0] = text_truncate(stats_values[idx][0], 40); } - jqvalues = [stats_values]; + jqvalues[extra] = [stats_values]; series.push("Total"); if (stats_type != "pie"){ legend_conf = {}; @@ -1791,14 +1801,14 @@ var render_stats = function(stats_values, name){ }; if (stats_type != "pie"){ stats_options["cursor"] = { - show: true, - zoom: true, - showTooltip: false + show: true, + zoom: true, + showTooltip: false } } - - stats_current_graph = $.jqplot('chart-' + name, - jqvalues, stats_options + stats_current_graph[extra] = $.jqplot( + 'chart-' + name + "-" + extra, + jqvalues[extra], stats_options ); }; @@ -1901,4 +1911,12 @@ var inline_register_add_button = function(slug){ inline_total_forms.setAttribute('value', `${inline_form_num+1}`); } ); +}; + +var redraw_plots = function(name, key){ + if (stats_current_graph && stats_current_graph[key]){ + $('#chart-' + name + "-" + key).height($('#charts-' + name + "-" + key).height()*0.96 - 100); + $('#chart-' + name + "-" + key).width($('#charts-' + name + "-" + key).width()* 0.96); + stats_current_graph[key].replot({resetAxes: true}); + } }; \ No newline at end of file diff --git a/ishtar_common/templates/blocks/DataTables-stats-detail.html b/ishtar_common/templates/blocks/DataTables-stats-detail.html new file mode 100644 index 000000000..9dcb04ae4 --- /dev/null +++ b/ishtar_common/templates/blocks/DataTables-stats-detail.html @@ -0,0 +1,79 @@ +{% load i18n %} +
+
+
+
+
+
+
+

+   + {% trans 'Draw rectangle on the graph to zoom. Double-click to reinitialize.' %} +

+
+
+ +
+
+
+
+
+
+
+   + {% trans 'Right-click on this image to save it.' %} +
+
+
+
+
+
+ +
+

+   + {% trans "No data" %} +

+
+
+
+   + {% trans "Too many values for the selected modalities, graph cannot be displayed. You can: " %} +
    +
  • {% trans 'Select "table" type.'%}
    • +
  • {% trans 'Refine the search to limit the results.'%}
    • +
+
+
+
+ + diff --git a/ishtar_common/templates/blocks/DataTables-stats.html b/ishtar_common/templates/blocks/DataTables-stats.html index 342051d19..aae2bb91f 100644 --- a/ishtar_common/templates/blocks/DataTables-stats.html +++ b/ishtar_common/templates/blocks/DataTables-stats.html @@ -36,80 +36,13 @@

-
-
-
-
-
-
-

-   - {% trans 'Draw rectangle on the graph to zoom. Double-click to reinitialize.' %} -

-
-
- -
-
-
-
-
-
-
-   - {% trans 'Right-click on this image to save it.' %} -
-
-
-
-
-
-
-
-
-
- - {% trans "Export as CSV" %} - -
-
-
-

-   - {% trans "No data" %} -

-
-
-
-   - {% trans "Too many values for the selected modalities, graph cannot be displayed. You can: " %} -
    -
  • {% trans 'Select "table" type.'%}
    • -
  • {% trans 'Refine the search to limit the results.'%}
    • -
-
-
- - \ No newline at end of file + {% with stats_name=name %}{% with extra="default" %} + {% include "blocks/DataTables-stats-detail.html" %} + {% endwith %}{% endwith %} + {% if external_sources %}{% for source_id, source_label, source_url in external_sources %} + {% with stats_name=name %}{% with extra=source_id %} + {% include "blocks/DataTables-stats-detail.html" %} + {% endwith %}{% endwith %} + {% endfor %}{% endif %} + diff --git a/ishtar_common/templates/blocks/DataTables.html b/ishtar_common/templates/blocks/DataTables.html index 3d1b817a8..199cd3af2 100644 --- a/ishtar_common/templates/blocks/DataTables.html +++ b/ishtar_common/templates/blocks/DataTables.html @@ -94,7 +94,21 @@ map_submit_search = function(){ return _map_submit_search(query_vars, "{{name}}", "{{source}}"); }; {% endif %} + +extra_list = [ + "default"{% for source_id, source_label, source_url in external_sources %}, +"{{source_id}}"{% endfor %} +]; + +sources = [ + "{{source}}"{% for source_id, source_label, source_url in external_sources %}, + "{{source_url}}"{% endfor %} +]; + stats_submit_search = function(){ + {% if external_sources %}{% for source_id, source_label, source_url in external_sources %} + _stats_submit_search(query_vars, "{{name}}", "{{source_url}}", "{{source_id}}"); + {% endfor %}{% endif %} return _stats_submit_search(query_vars, "{{name}}", "{{source}}"); }; @@ -157,6 +171,7 @@ jQuery(document).ready(function(){ function(){ $(".sources").hide(); $(".sources-default").show(); + redraw_plots("{{name}}", "default"); } ); {% for source_id, source_label, source_url in external_sources %} @@ -164,6 +179,7 @@ jQuery(document).ready(function(){ function(){ $(".sources").hide(); $(".sources-{{source_id}}").show(); + redraw_plots("{{name}}", "{{source_id}}"); } ); {% endfor %} -- cgit v1.2.3