From b6f02e255fe3403c11b1ed18cc69d13331d968b9 Mon Sep 17 00:00:00 2001 From: Johannes Theiner Date: Mon, 27 May 2019 09:31:35 +0200 Subject: [PATCH] + working version Signed-off-by: Johannes Theiner #SPM-27: add work 6h development --- .../spm/baudas/web/ShoppingTimesDiagram.java | 23 +++-- .../spm/baudas/web/TopFlopArticleDiagram.java | 19 ++++- .../java/de/hsel/spm/baudas/web/Upload.java | 2 - .../spm/baudas/web/WeekOverviewDiagram.java | 20 +++-- src/main/webapp/footer.jsp | 1 + src/main/webapp/header.jsp | 84 +++++++++++++++++-- src/main/webapp/js/cache.js | 31 ++++++- src/main/webapp/js/shopping_times.js | 4 +- src/main/webapp/js/upload.js | 38 +++++++++ src/main/webapp/js/week_overview.js | 8 +- 10 files changed, 202 insertions(+), 28 deletions(-) create mode 100644 src/main/webapp/js/upload.js diff --git a/src/main/java/de/hsel/spm/baudas/web/ShoppingTimesDiagram.java b/src/main/java/de/hsel/spm/baudas/web/ShoppingTimesDiagram.java index 11b6c69..ed40db8 100644 --- a/src/main/java/de/hsel/spm/baudas/web/ShoppingTimesDiagram.java +++ b/src/main/java/de/hsel/spm/baudas/web/ShoppingTimesDiagram.java @@ -23,6 +23,7 @@ import java.util.Map; import java.util.Set; import java.util.TreeSet; import java.util.UUID; +import java.util.regex.Pattern; /** * changes data from shopping times diagram into a readable format for chart.js @@ -34,6 +35,8 @@ import java.util.UUID; @WebServlet("/shopping_times") public class ShoppingTimesDiagram extends HttpServlet { + private static Map cache = new HashMap<>(); + private static final long serialVersionUID = 6567531484L; @Override @@ -50,13 +53,21 @@ public class ShoppingTimesDiagram extends HttpServlet { Gson gson = new Gson(); - - if (req.getParameter("id") == null) { - result.put("labels", definedOrder); - out.print(gson.toJson(result)); + String id = req.getParameter("id"); + boolean match = Pattern.matches("[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}", id); + if (id == null || !match) { return; } - UUID uuid = UUID.fromString(req.getParameter("id")); + + UUID uuid = UUID.fromString(id); + + + if(cache.containsKey(uuid)) { + out.print(gson.toJson(cache.get(uuid))); + return; + } + + File file = Data.get(uuid); ShoppingTimes shoppingTimes = new ShoppingTimes(file); @@ -81,7 +92,7 @@ public class ShoppingTimesDiagram extends HttpServlet { } } - + cache.put(uuid, result); out.print(gson.toJson(result)); } diff --git a/src/main/java/de/hsel/spm/baudas/web/TopFlopArticleDiagram.java b/src/main/java/de/hsel/spm/baudas/web/TopFlopArticleDiagram.java index 2d6692f..660d6e3 100644 --- a/src/main/java/de/hsel/spm/baudas/web/TopFlopArticleDiagram.java +++ b/src/main/java/de/hsel/spm/baudas/web/TopFlopArticleDiagram.java @@ -13,6 +13,7 @@ import java.io.IOException; import java.io.PrintWriter; import java.nio.charset.StandardCharsets; import java.util.*; +import java.util.regex.Pattern; /** * @author Johannes Theiner @@ -23,6 +24,8 @@ import java.util.*; @WebServlet("/top_flop") public class TopFlopArticleDiagram extends HttpServlet { + private static Map cache = new HashMap<>(); + private static final long serialVersionUID = 6567531464214L; @Override @@ -34,7 +37,19 @@ public class TopFlopArticleDiagram extends HttpServlet { Gson gson = new Gson(); - UUID uuid = UUID.fromString(req.getParameter("id")); + String id = req.getParameter("id"); + boolean match = Pattern.matches("[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}", id); + if(id == null || !match) { + return; + } + + UUID uuid = UUID.fromString(id); + + if(cache.containsKey(uuid)) { + out.println(gson.toJson(cache.get(uuid))); + return; + } + File file = Data.get(uuid); TopFlopArticle articles = new TopFlopArticle(file); @@ -53,6 +68,8 @@ public class TopFlopArticleDiagram extends HttpServlet { result.put("labels", labels); result.put("data", data); + + cache.put(uuid, result); out.print(gson.toJson(result)); } } \ No newline at end of file diff --git a/src/main/java/de/hsel/spm/baudas/web/Upload.java b/src/main/java/de/hsel/spm/baudas/web/Upload.java index 28f7c9d..11f7794 100644 --- a/src/main/java/de/hsel/spm/baudas/web/Upload.java +++ b/src/main/java/de/hsel/spm/baudas/web/Upload.java @@ -48,7 +48,5 @@ public class Upload extends HttpServlet { } Files.copy(inputStream, path, StandardCopyOption.REPLACE_EXISTING); - - resp.sendRedirect(""); } } \ No newline at end of file diff --git a/src/main/java/de/hsel/spm/baudas/web/WeekOverviewDiagram.java b/src/main/java/de/hsel/spm/baudas/web/WeekOverviewDiagram.java index 9230839..6f8534f 100644 --- a/src/main/java/de/hsel/spm/baudas/web/WeekOverviewDiagram.java +++ b/src/main/java/de/hsel/spm/baudas/web/WeekOverviewDiagram.java @@ -19,6 +19,7 @@ import java.util.HashMap; import java.util.List; import java.util.Map; import java.util.UUID; +import java.util.regex.Pattern; /** * changes data from week overview into readable format for chart.js @@ -30,6 +31,8 @@ import java.util.UUID; @WebServlet("/week_overview") public class WeekOverviewDiagram extends HttpServlet { + private static Map cache = new HashMap<>(); + private static final long serialVersionUID = 8484151844118L; @@ -45,16 +48,20 @@ public class WeekOverviewDiagram extends HttpServlet { Gson gson = new Gson(); + String id = req.getParameter("id"); + boolean match = Pattern.matches("[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}", id); - if (req.getParameter("id") == null) { - result.put("labels", definedOrder); - result.put("count", new ArrayList<>()); - result.put("revenue", new ArrayList<>()); - out.print(gson.toJson(result)); + + if (id == null || !match) { + return; + } + + UUID uuid = UUID.fromString(id); + if(cache.containsKey(uuid)) { + out.println(gson.toJson(cache.get(uuid))); return; } - UUID uuid = UUID.fromString(req.getParameter("id")); File file = Data.get(uuid); WeekOverview overview = new WeekOverview(file); @@ -79,6 +86,7 @@ public class WeekOverviewDiagram extends HttpServlet { result.put("count", count); result.put("revenue", revenue); + cache.put(uuid, result); out.print(gson.toJson(result)); } } \ No newline at end of file diff --git a/src/main/webapp/footer.jsp b/src/main/webapp/footer.jsp index 5e91340..175265d 100644 --- a/src/main/webapp/footer.jsp +++ b/src/main/webapp/footer.jsp @@ -12,6 +12,7 @@ M.AutoInit(); + diff --git a/src/main/webapp/header.jsp b/src/main/webapp/header.jsp index 5cd9784..a3a8979 100644 --- a/src/main/webapp/header.jsp +++ b/src/main/webapp/header.jsp @@ -12,6 +12,7 @@ media="screen,projection"/> + @@ -37,7 +38,7 @@
    @@ -77,13 +78,13 @@
    • -
    +

  • File - +
    @@ -91,9 +92,80 @@
  • -
    - +
    +
    • -
\ No newline at end of file + + + + + + + + + diff --git a/src/main/webapp/js/cache.js b/src/main/webapp/js/cache.js index 8876e59..b83aeb6 100644 --- a/src/main/webapp/js/cache.js +++ b/src/main/webapp/js/cache.js @@ -1,4 +1,33 @@ +let loading = $('#loading'); + +Chart.plugins.register({ + afterDraw: function(chart) { + if (chart.data.datasets[0].data.length === 0) { + // No data is present + var ctx = chart.chart.ctx; + var width = chart.chart.width; + var height = chart.chart.height; + chart.clear(); + + ctx.save(); + ctx.textAlign = 'center'; + ctx.textBaseline = 'middle'; + ctx.font = "16px normal 'Helvetica Nueue'"; + ctx.fillText('Kein Datenset ausgewählt', width / 2, height / 2); + ctx.restore(); + } + } +}); + $(document).ready(function () { + updateDatasets(); +}); + +function clearSelected(){ + $('#dataset').prop('selectedIndex', -1); +} + +function updateDatasets() { let dataset = $('#dataset'); request('files').then(results => { dataset.empty(); @@ -11,7 +40,7 @@ $(document).ready(function () { dataset.formSelect(); }); updateCache(); -}); +} /** * update all charts with correct values for dataset diff --git a/src/main/webapp/js/shopping_times.js b/src/main/webapp/js/shopping_times.js index c5d85dc..1f29752 100644 --- a/src/main/webapp/js/shopping_times.js +++ b/src/main/webapp/js/shopping_times.js @@ -3,10 +3,10 @@ let shopping_result; let shopping_chart = new Chart(document.getElementById("shopping_times_chart"), { type: 'bar', data: { - labels: [1, 2, 3, 4, 5], + labels: [], datasets: [{ label: 'Anzahl verkaufter Artikel', - data: [0, 0, 0, 0, 0], + data: [], backgroundColor: [ 'rgba(143, 170, 220, 0.9)', 'rgba(143, 170, 220, 0.9)', diff --git a/src/main/webapp/js/upload.js b/src/main/webapp/js/upload.js new file mode 100644 index 0000000..11d344d --- /dev/null +++ b/src/main/webapp/js/upload.js @@ -0,0 +1,38 @@ +let form = document.getElementById("upload"); + +form.onsubmit = function (event) { + event.preventDefault(); + let formData = new FormData(form); + + formData.append('file', document.getElementById("file")); + + let xhr = new XMLHttpRequest(); + + xhr.onloadstart = function(e) { + loading.removeClass("hide"); + $('.sidenav').sidenav('close'); + loading.modal('open'); + } + + xhr.upload.addEventListener("progress", function (event) { + if (event.lengthComputable) { + self.progress = Math.round(100 / event.total * event.loaded); + } else if (this.explicitTotal) { + self.progress = Math.min(1, event.loaded / self.explicitTotal); + } else { + self.progress = 0; + } + + }, false); + + xhr.onloadend = function (e) { + clearSelected(); + updateDatasets(); + form.reset(); + }; + + xhr.open('POST', form.getAttribute('action'), true); + xhr.send(formData); + + return false; +}; diff --git a/src/main/webapp/js/week_overview.js b/src/main/webapp/js/week_overview.js index ee3d77c..ec9ac12 100644 --- a/src/main/webapp/js/week_overview.js +++ b/src/main/webapp/js/week_overview.js @@ -3,16 +3,16 @@ let week_result; let week_overview = new Chart($("#overview_chart"), { type: 'line', data: { - labels: [0, 0, 0, 0, 0], + labels: [], datasets: [{ label: "Warenanzahl", - data: [0, 0, 0, 0, 0], + data: [], fill: true, backgroundColor: 'rgba(104, 216, 154, 0.5)', lineTension: 0 }, { label: "Einnahmen in €", - data: [0, 0, 0, 0, 0], + data: [], fill: true, backgroundColor: 'rgba(113, 114, 231, 1)', lineTension: 0 @@ -71,5 +71,5 @@ function updateWeekOverview() { week_overview.data.datasets[0].data = week_result.count; week_overview.data.datasets[1].data = week_result.revenue; week_overview.update(); - + loading.modal('close'); } \ No newline at end of file