From d27c88c949010dc5cc9f7dc5ee26e519598f557e Mon Sep 17 00:00:00 2001
From: Lukas Winkler <l.winkler23@mailbox.org>
Date: Thu, 6 Oct 2016 09:01:31 +0200
Subject: [PATCH] Tabelle verbessert

---
 www/map.html   |  2 ++
 www/sidebar.js | 23 +++++++++++++----------
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/www/map.html b/www/map.html
index 3e39725..a8d76af 100644
--- a/www/map.html
+++ b/www/map.html
@@ -8,6 +8,8 @@
           integrity="sha256-xJOZHfpxLR/uhh1BwYFS5fhmOAdIRQaiOul5F/b7v3s=" crossorigin="anonymous">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"
           integrity="sha256-t2/7smZfgrST4FS1DT0bs/KotCM74XlcqZN5Vu7xlrw=" crossorigin="anonymous"/>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pure/0.6.0/tables-min.css"
+          integrity="sha256-4NzXOZY2l6V9ObAblwSPfn2wI5kyZbUMaMVVbMrZDXA=" crossorigin="anonymous"/>
     <style>
         body {
             margin: 0;
diff --git a/www/sidebar.js b/www/sidebar.js
index 4e3f3b1..64f9496 100644
--- a/www/sidebar.js
+++ b/www/sidebar.js
@@ -7,37 +7,40 @@ var sidebar = L.Control.extend({
         container.style.backgroundColor = "white";
         container.style.height = '600px';
         container.style.width = '400px';
-        var table = L.DomUtil.create("table", "sidebarTable", container);
         var button = document.createElement("button");
         button.textContent = "Topliste";
         container.appendChild(button);
 
+        var table = L.DomUtil.create("table", "sidebarTable pure-table pure-table-horizontal", container);
+
+        button.addEventListener("click", function () {
+            loadSidebar(table);
+        });
+        loadSidebar(table);
+
+
         return container;
     }
 });
 map.addControl(new sidebar);
 
-$(".leaflet-control-custom button").on("click", function () {
-    loadSidebar();
-});
-
-function loadSidebar() {
+function loadSidebar(table) {
     $.getJSON("/api/top/", {
         type: "shortestConnections"
     }).done(function (data) {
-        var table = $(".sidebarTable");
+        while (table.firstChild) {
+            table.removeChild(table.firstChild);
+        }
         for (var i = 0; i < data.length; i++) {
             var line = document.createElement("tr");
             var single = data[i];
-            console.log(single);
             for (var j = 0; j < single.length; j++) {
                 var td = document.createElement("td");
                 td.textContent = single[j];
                 line.appendChild(td);
             }
-            table.append(line);
+            table.appendChild(line);
         }
-
     });
 
 }
\ No newline at end of file