From 9f965b8119a73982a036ded57684fae24533729c Mon Sep 17 00:00:00 2001
From: W13R <9070224-W13R@users.noreply.gitlab.com>
Date: Tue, 24 May 2022 20:49:18 +0200
Subject: [PATCH] Rearranged statistics page

---
 application/app/templates/statistics.html | 42 ++++-------------------
 static/css/statistics.css                 | 10 ++----
 static/js/statistics.js                   | 42 -----------------------
 3 files changed, 8 insertions(+), 86 deletions(-)
 delete mode 100644 static/js/statistics.js

diff --git a/application/app/templates/statistics.html b/application/app/templates/statistics.html
index 967fb1a..9d26016 100644
--- a/application/app/templates/statistics.html
+++ b/application/app/templates/statistics.html
@@ -20,37 +20,9 @@
 
     <div class="mainContainer">
 
-        <div class="dropDownMenu" id="statisticsDropDownMenu">
-            <button class="dropDownButton" id="statisticsDropDownMenuButton">
-                <div>
-                    {% translate "Choose" %}
-                </div>
-            </button>
-            <div class="dropDownList">
-                <button class="sChoice dropDownChoice" data-statistics_div="noyopd">
-                    {% translate "Your orders per drink" %}
-                </button>
-                <button class="sChoice dropDownChoice" data-statistics_div="yopwd">
-                    {% translate "Your orders per weekday" %}
-                </button>
-                <button class="sChoice dropDownChoice" data-statistics_div="yopml12m">
-                    {% translate "Your orders per month (last 12 months)" %}
-                </button>
-                <button class="sChoice dropDownChoice" data-statistics_div="noaopd">
-                    {% translate "All orders per drink" %}
-                </button>
-                <button class="sChoice dropDownChoice" data-statistics_div="aopwd">
-                    {% translate "All orders per weekday" %}
-                </button>
-                <button class="sChoice dropDownChoice" data-statistics_div="aopml12m">
-                    {% translate "All orders per month (last 12 months)" %}
-                </button>
-            </div>
-        </div>
-
         <div class="tablesContainer">
 
-            <div id="noyopd" class="statisticsTable nodisplay">
+            <div id="noyopd" class="statisticsTable">
                 <h1>{% translate "Your orders per drink" %}</h1>
                 {% if noyopd %}
                 <table>
@@ -70,7 +42,7 @@
                 {% endif %}
             </div>
 
-            <div id="noaopd" class="statisticsTable nodisplay">
+            <div id="noaopd" class="statisticsTable">
                 <h1>{% translate "All orders per drink" %}</h1>
                 {% if noaopd %}
                 <table>
@@ -90,7 +62,7 @@
                 {% endif %}
             </div>
     
-            <div id="yopml12m" class="statisticsTable nodisplay">
+            <div id="yopml12m" class="statisticsTable">
                 <h1>{% translate "Your orders per month (last 12 months)" %}</h1>
                 {% if yopml12m %}
                 <table>
@@ -110,7 +82,7 @@
                 {% endif %}
             </div>
 
-            <div id="aopml12m" class="statisticsTable nodisplay">
+            <div id="aopml12m" class="statisticsTable">
                 <h1>{% translate "All orders per month (last 12 months)" %}</h1>
                 {% if aopml12m %}
                 <table>
@@ -130,7 +102,7 @@
                 {% endif %}
             </div>
 
-            <div id="yopwd" class="statisticsTable nodisplay">
+            <div id="yopwd" class="statisticsTable">
                 <h1>{% translate "Your orders per weekday" %}</h1>
                 {% if yopwd %}
                 <table>
@@ -150,7 +122,7 @@
                 {% endif %}
             </div>
 
-            <div id="aopwd" class="statisticsTable nodisplay">
+            <div id="aopwd" class="statisticsTable">
                 <h1>{% translate "All orders per weekday" %}</h1>
                 {% if aopwd %}
                 <table>
@@ -174,6 +146,4 @@
 
     </div>
 
-    <script src="/static/js/statistics.js"></script>
-
 {% endblock %}
diff --git a/static/css/statistics.css b/static/css/statistics.css
index 2c97e82..9416b17 100644
--- a/static/css/statistics.css
+++ b/static/css/statistics.css
@@ -1,24 +1,21 @@
 .mainContainer {
+    min-width: 70vw;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: start;
-    width: 100%;
-    flex-grow: 1;
 }
 .statsHeading {
     min-width: max-content;
-    margin-left: 2rem;
     margin-top: 0;
 }
 .tablesContainer {
-    position: absolute;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: start;
     width: 95%;
-    margin-top: 5rem;
+    margin-top: 2rem;
 }
 .statisticsTable {
     margin-bottom: 2rem;
@@ -46,9 +43,6 @@
 .statisticsTable td:last-child {
     text-align: right;
 }
-#statisticsDropDownMenu .dropDownList {
-    z-index: 195;    
-}
 @media only screen and (max-width: 700px) {
     .statisticsTable h1 {
         min-width: 90vw;
diff --git a/static/js/statistics.js b/static/js/statistics.js
deleted file mode 100644
index 0cfdb26..0000000
--- a/static/js/statistics.js
+++ /dev/null
@@ -1,42 +0,0 @@
-{
-
-    let statistics_dropdown_choices;
-    let statistics_tables;
-
-    let dropDownMenuActive = false;
-
-    document.addEventListener("DOMContentLoaded", () => {
-
-        // elements
-        let statistics_dropdown_menu = document.getElementById("statisticsDropDownMenu");
-        let statistics_dropdown_menu_button = document.getElementById("statisticsDropDownMenuButton");
-        statistics_dropdown_choices = [...statistics_dropdown_menu.getElementsByClassName("sChoice")];
-        statistics_tables = [...document.getElementsByClassName("statisticsTable")];
-
-        statistics_dropdown_menu_button.addEventListener("click", () => {
-            if (statistics_dropdown_menu.classList.contains("dropDownVisible")) {
-                statistics_dropdown_menu.classList.remove("dropDownVisible");
-            }
-            else {
-                statistics_dropdown_menu.classList.add("dropDownVisible");
-            }
-        })
-        
-        statistics_dropdown_choices.forEach(element => {
-
-            element.addEventListener("click", () => {
-                changeStatisticsChoice(element.innerText, element.dataset.statistics_div);
-            })
-
-        })
-
-    })
-
-    function changeStatisticsChoice(choice_name, div_id) {
-        statistics_tables.forEach(element => {
-            element.classList.add("nodisplay");
-        })
-        document.getElementById(div_id).classList.remove("nodisplay");
-    }
-
-}
\ No newline at end of file