1 files changed, 79 insertions, 0 deletions
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>&nbsp;
+            {% 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>&nbsp;
+                            {% 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>&nbsp;
+            {% 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>&nbsp;
+            {% 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>