diff options
Diffstat (limited to 'ishtar_common')
| -rw-r--r-- | ishtar_common/static/js/ishtar.js | 84 | ||||
| -rw-r--r-- | ishtar_common/templates/blocks/DataTables-stats-detail.html | 79 | ||||
| -rw-r--r-- | ishtar_common/templates/blocks/DataTables-stats.html | 85 | ||||
| -rw-r--r-- | ishtar_common/templates/blocks/DataTables.html | 16 |
4 files changed, 155 insertions, 109 deletions
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 += "</tbody></table>"; - $("#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 %} +<div class="sources sources-{{extra}}"> + <div id="charts-{{stats_name}}-{{extra}}"> + <div id="chart-{{stats_name}}-{{extra}}-wrapper" class="chart-wrapper"> + <div id="chart-{{stats_name}}-{{extra}}" class="chart-content"></div> + <div class="resize-handler"></div> + </div> + <hr/> + <p class='alert alert-info' id="stats-zoom-help-{{stats_name}}-{{extra}}" style="z-index:-1"> + <i class="fa fa-info-circle" aria-hidden="true"></i> + {% trans 'Draw rectangle on the graph to zoom. Double-click to reinitialize.' %} + </p> + <div class='form chart-img-form'> + <div class="text-center"> + <button id="chart-img-display-{{stats_name}}-{{extra}}" + type='button' class='btn btn-secondary'> + {% trans "Display as an image" %} + </button> + </div> + <br> + <div id="chart-img-{{stats_name}}-{{extra}}" class='chart-img'> + <div class="card"> + <div id="img-{{stats_name}}-{{extra}}" + class="card-img-top text-center ml-3 mt-3"></div> + <div class="card-body"> + <div class='alert alert-info'> + <i class="fa fa-info-circle" aria-hidden="true"></i> + {% trans 'Right-click on this image to save it.' %} + </div> + </div> + </div> + </div> + </div> + </div> + <div id="stats-table-{{stats_name}}-{{extra}}"> + <div id="stats-table-content-{{stats_name}}-{{extra}}"></div> + <hr> + <div class="text-center"> + <a id="stats-table-csv-{{stats_name}}-{{extra}}" href="#" + type='button' class='btn btn-secondary'> + {% trans "Export as CSV" %} + </a> + </div> + </div> + <div id="stats-empty-{{stats_name}}-{{extra}}"> + <p class="alert alert-info" > + <i class="fa fa-info-circle" aria-hidden="true"></i> + {% trans "No data" %} + </p> + </div> + <div id="stats-error-{{stats_name}}-{{extra}}"> + <div class="alert alert-info"> + <i class="fa fa-info-circle" aria-hidden="true"></i> + {% trans "Too many values for the selected modalities, graph cannot be displayed. You can: " %} + <ul> + <li>{% trans 'Select "table" type.'%}</li> + <li>{% trans 'Refine the search to limit the results.'%}</li> + </ul> + </div> + </div> +</div> + +<script language="javascript" type="text/javascript"> +jQuery(document).ready(function(){ + $("#chart-{{stats_name}}-wrapper-{{extra}}").resizable({ + handleSelector: ".resize-handler", + onDragStart: function (e, $el, opt) { + $("#chart-{{stats_name}}-{{extra}}-wrapper").addClass('chart-resize'); + $("#chart-{{stats_name}}-{{extra}}").hide(); + }, + onDragEnd: function (e, $el, opt) { + $("#chart-{{stats_name}}-{{extra}}-wrapper").removeClass('chart-resize'); + $("#chart-{{stats_name}}-{{extra}}").show(); + stats_current_graph.replot( { resetAxes: true } ); + } + }); + } +); +</script> 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 @@ </p> </div> <hr/> - <div id="charts-{{name}}"> - <div id="chart-{{name}}-wrapper" class="chart-wrapper"> - <div id="chart-{{name}}" class="chart-content"></div> - <div class="resize-handler"></div> - </div> - <hr/> - <p class='alert alert-info' id="stats-zoom-help-{{name}}" style="z-index:-1"> - <i class="fa fa-info-circle" aria-hidden="true"></i> - {% trans 'Draw rectangle on the graph to zoom. Double-click to reinitialize.' %} - </p> - <div class='form chart-img-form'> - <div class="text-center"> - <button id="chart-img-display-{{name}}" - type='button' class='btn btn-secondary'> - {% trans "Display as an image" %} - </button> - </div> - <br> - <div id="chart-img-{{name}}" class='chart-img'> - <div class="card"> - <div id="img-{{name}}" - class="card-img-top text-center ml-3 mt-3"></div> - <div class="card-body"> - <div class='alert alert-info'> - <i class="fa fa-info-circle" aria-hidden="true"></i> - {% trans 'Right-click on this image to save it.' %} - </div> - </div> - </div> - </div> - </div> - </div> - <div id="stats-table-{{name}}"> - <div id="stats-table-content-{{name}}"></div> - <hr> - <div class="text-center"> - <a id="stats-table-csv-{{name}}" href="#" - type='button' class='btn btn-secondary'> - {% trans "Export as CSV" %} - </a> - </div> - </div> - <div id="stats-empty-{{name}}"> - <p class="alert alert-info" > - <i class="fa fa-info-circle" aria-hidden="true"></i> - {% trans "No data" %} - </p> - </div> - <div id="stats-error-{{name}}"> - <div class="alert alert-info"> - <i class="fa fa-info-circle" aria-hidden="true"></i> - {% trans "Too many values for the selected modalities, graph cannot be displayed. You can: " %} - <ul> - <li>{% trans 'Select "table" type.'%}</li> - <li>{% trans 'Refine the search to limit the results.'%}</li> - </ul> - </div> - </div> -</div> -<script language="javascript" type="text/javascript"> -jQuery(document).ready(function(){ - $("#chart-{{name}}-wrapper").resizable({ - handleSelector: ".resize-handler", - onDragStart: function (e, $el, opt) { - $("#chart-{{name}}-wrapper").addClass('chart-resize'); - $("#chart-{{name}}").hide(); - }, - onDragEnd: function (e, $el, opt) { - $("#chart-{{name}}-wrapper").removeClass('chart-resize'); - $("#chart-{{name}}").show(); - stats_current_graph.replot( { resetAxes: true } ); - } - }); - } -); -</script>
\ 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 %} +</div> 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 %} |