load charts in admin by JS

PetrDlouhy · Aug 2, 2024 · ad99d5d · ad99d5d
1 parent f44bfc3
commit ad99d5d
Show file tree

Hide file tree

Showing 7 changed files with 44 additions and 38 deletions.
diff --git a/admin_tools_stats/modules.py b/admin_tools_stats/modules.py
@@ -52,8 +52,6 @@ def init_with_context(self, context):
 
         self.prepare_module_data(self.graph_key)
 
-        self.form_field = self.get_control_form(self.graph_key)
-
         if hasattr(self, "error_message"):
             messages.add_message(
                 request,
@@ -74,14 +72,6 @@ def get_title(self, graph_key):
             self.error_message = str(e)
             return ""
 
-    def get_control_form(self, graph_key):
-        """To get dynamic criteria & return into select box to display on dashboard"""
-        try:
-            return self.dashboard_stats.get_control_form()
-        except LookupError as e:
-            self.error_message = str(e)
-            return ""
-
 
 def get_active_graph():
     """Returns active graphs"""

diff --git a/admin_tools_stats/templates/admin_tools_stats/admin_charts.js b/admin_tools_stats/templates/admin_tools_stats/admin_charts.js
@@ -64,7 +64,7 @@ function loadAnalyticsChart(chart_key){
    if($("#chart_element_" + chart_key + ".notloaded").length)
       $('body').addClass("loading");
    $('.admin_charts').hide();
-   $("#chart_element_" + chart_key + ".notloaded").load("{% url "chart-analytics-without-key" %}" + chart_key, function(){
+   $("#chart_element_" + chart_key + ".notloaded").load("{% url "chart-analytics-without-key" %}" + chart_key + "?analytics_chart=true", function(){
       $(this).removeClass('notloaded');
       $(this).addClass('loaded');
       $(this).find('form.stateform:visible').each(loadAnchor);
@@ -73,6 +73,15 @@ function loadAnalyticsChart(chart_key){
    $("#chart_element_" + chart_key).show();
 }
 
+function loadAdminChart(chart_key){
+   $("#chart_element_" + chart_key + ".notloaded").load("{% url "chart-analytics-without-key" %}" + chart_key, function(){
+      $(this).removeClass('notloaded');
+      $(this).addClass('loaded');
+      $(this).find('form.stateform:visible').each(loadAnchor);
+   });
+   $("#chart_element_" + chart_key).show();
+}
+
 defer( function(){
    $( document ).ready(function() {
 

diff --git a/admin_tools_stats/templates/admin_tools_stats/chart_container.html b/admin_tools_stats/templates/admin_tools_stats/chart_container.html
@@ -1,10 +1,14 @@
 {% load admin_chart_tags %}
+{% if request.GET.analytics_chart %}  {# display chart headers only on analytics page #}
 <div id="chart_{{ chart.graph_key }}" class="chrt_container">
 <div class="chrt_flex">
     <h3>{{ chart.graph_title }}</h3>
+    {% endif %}
     {% get_control_form chart request.user as form %}
     {% include "./chart_form.html" %}
+{% if request.GET.analytics_chart %}
     <div id="chart_container_{{ chart.graph_key }}" class="chrt_svg_container"><svg></svg></div>
     <br/>
 </div>
 </div>
+{% endif %}
diff --git a/admin_tools_stats/templates/admin_tools_stats/modules/chart.html b/admin_tools_stats/templates/admin_tools_stats/modules/chart.html
@@ -7,10 +7,10 @@
        {% include '../../include_nvd3.html' %}
     {% endif %}
 
-    {% if module.form_field %}
-       {% get_control_form module.dashboard_stats request.user as form %}
-       {% include "../chart_form.html" with chart=module.dashboard_stats %}
-    {% endif %}
+     {% with module.dashboard_stats as chart %}
+       <div class="admin_charts admin_chanrts_dynamic notloaded" id="chart_element_{{ chart.graph_key }}" data-chart-key="{{ chart.graph_key }}">
+       </div>
+     {% endwith %}
 
     {% include_container module.chart_container %}
 

diff --git a/admin_tools_stats/templates/include_nvd3.html b/admin_tools_stats/templates/include_nvd3.html
@@ -3,3 +3,11 @@
 <link media="all" href="{% set_nvd3_css_path %}" type="text/css" rel="stylesheet" />
 <script src="{% set_d3_js_path %}" type="text/javascript"></script>
 <script src="{% set_nvd3_js_path %}" type="text/javascript"></script>
+<script>
+    window.onload = function() {
+        $(".admin_chanrts_dynamic").each(function() {
+            var chart_key = $(this).data("chart-key");
+            loadAdminChart(chart_key);
+        });
+    };
+</script>
diff --git a/admin_tools_stats/tests/test_admin.py b/admin_tools_stats/tests/test_admin.py
@@ -68,7 +68,7 @@ def test_admin_index_empty(self):
     def test_admin_index(self):
         """Test vanila admin index page, that should contain chart"""
         url = reverse("admin:index")
-        response = self.client.get(url)
+        response = self.client.get(url + "?analytics_chart=True")
         self.assertContains(response, "<h3>User chart</h3>", html=True)
         self.assertContains(
             response,
@@ -123,6 +123,7 @@ def test_admin_dashboard_page(self):
             graph_title="User logged in graph",
             model_name="User",
             model_app_name="auth",
+            graph_key="user_graph",
         )
         criteria = baker.make(
             "DashboardStatsCriteria",
@@ -153,12 +154,8 @@ def test_admin_dashboard_page(self):
         )
         self.assertContains(
             response,
-            '<option value="True">Active</option>',
-            html=True,
-        )
-        self.assertContains(
-            response,
-            '<option value="False">Inactive</option>',
+            '<div class="admin_charts admin_chanrts_dynamic notloaded" id="chart_element_user_graph" '
+            'data-chart-key="user_graph"></div>',
             html=True,
         )
 
@@ -191,11 +188,8 @@ def test_admin_dashboard_page_multi_series(self):
         response = self.client.get("/admin/")
         self.assertContains(
             response,
-            '<select name="select_box_multiple_series" '
-            'class="chart-input select_box_multiple_series" required>'
-            '<option value="">-------</option>'
-            '<option value="2" selected>active</option>'
-            "</select>",
+            '<div class="admin_charts admin_chanrts_dynamic notloaded" id="chart_element_user_graph" '
+            'data-chart-key="user_graph"></div>',
             html=True,
         )
 
@@ -219,15 +213,13 @@ def test_admin_dashboard_page_post(self):
             },
         )
         baker.make("CriteriaToStatsM2M", criteria=criteria, stats=stats)
-        response = self.client.post("/admin/", {"select_box_user_graph": "true"})
-        self.assertContains(
-            response,
-            '<input type="hidden" class="hidden_graph_key" name="graph_key" value="user_graph">',
-            html=True,
+        response = self.client.post(
+            "/admin/?analytics_chart=True", {"select_box_user_graph": "true"}
         )
         self.assertContains(
             response,
-            '<option value="True">Active</option>',
+            '<div class="admin_charts admin_chanrts_dynamic notloaded" id="chart_element_user_graph" '
+            'data-chart-key="user_graph"></div>',
             html=True,
         )
 

diff --git a/admin_tools_stats/tests/test_views.py b/admin_tools_stats/tests/test_views.py
@@ -76,7 +76,9 @@ def test_analytics_view_show(self):
 
     def test_analytics_chart_view(self):
         """Test function to check dashboardstats admin pages"""
-        response = self.client.get(reverse("chart-analytics", kwargs={"graph_key": "user_graph"}))
+        response = self.client.get(
+            reverse("chart-analytics", kwargs={"graph_key": "user_graph"}) + "?analytics_chart=True"
+        )
         self.assertEqual(response.status_code, 200)
         self.assertContains(response, "<h3>User chart</h3>", html=True)
         self.assertContains(
@@ -141,7 +143,7 @@ def test_get_multi_series_multiple_operations(self):
         url = reverse("chart-data", kwargs={"graph_key": "user_graph"})
         url += (
             "?time_since=2010-10-08&time_until=2010-10-12&select_box_interval=days&"
-            "select_box_chart_type=stackedAreaChart&select_box_operation_field="
+            "select_box_chart_type=stackedAreaChart&select_box_operation_field=&analytics_chart=True"
         )
         response = self.client.get(url)
         assertContainsAny(
@@ -183,7 +185,7 @@ def test_get_context_no_permission(self):
         Test no permissions
         """
         user = baker.make("User", date_joined=datetime(2010, 10, 10, tzinfo=timezone.utc))
-        url = reverse("chart-data", kwargs={"graph_key": "user_graph"})
+        url = reverse("chart-data", kwargs={"graph_key": "user_graph"}) + "?analytics_chart=True"
         url += (
             "?time_since=2010-10-08&time_until=2010-10-12&select_box_interval=days&"
             "select_box_chart_type=stackedAreaChart&select_box_operation_field="
@@ -211,7 +213,8 @@ def test_get_context(self):
         url = reverse("chart-data", kwargs={"graph_key": "user_graph"})
         url += (
             "?time_since=2010-10-08&time_until=2010-10-12&select_box_interval=days&"
-            "select_box_chart_type=stackedAreaChart&select_box_operation_field=&debug=True"
+            "select_box_chart_type=stackedAreaChart&select_box_operation_field=&debug=True&"
+            "analytics_chart=True"
         )
         chart_data_view = ChartDataView()
         chart_data_view.request = self.request_factory.get(url)
@@ -319,7 +322,7 @@ def test_get_context_tz_operation(self):
         url += (
             "?time_since=2021-10-29&time_until=2021-11-05&select_box_interval=days&"
             "select_box_chart_type=stackedAreaChart&select_box_operation_field=&debug=True&"
-            "select_box_operation=Avg"
+            "select_box_operation=Avg&analytics_chart=True"
         )
         chart_data_view = ChartDataView()
         chart_data_view.request = self.request_factory.get(url)