removed old files

db.json

@@ -1,43 +0,0 @@
-{
-  "persons": [
-    {
-      "longitude": 37,
-      "latitude": 124,
-      "shortName": "VEN",
-      "name": "Martin",
-      "speed": 1,
-      "color": "#ddd",
-      "id": 0
-    },
-    {
-      "id": 1,
-      "name": "Simon",
-      "fullName": "Simon Ellinger",
-      "shortName": "ELL",
-      "speed": 4,
-      "color": "#ffff00",
-      "latitude": 0,
-      "longitude": 50
-    },
-    {
-      "id": 2,
-      "name": "Lukas",
-      "fullName": "Lukas Wagner",
-      "shortName": "WAG",
-      "speed": 9,
-      "color": "#00ff00",
-      "latitude": 0,
-      "longitude": 70
-    },
-    {
-      "id": 3,
-      "name": "Bernie",
-      "fullName": "Bernadette Hammerle",
-      "shortName": "HAM",
-      "speed": 3,
-      "color": "#888822",
-      "latitude": 0,
-      "longitude": 100
-    }
-  ]
-}

src/components/Map.js

@@ -1,31 +0,0 @@
-import React, { Component } from 'react';
-import Map from 'pigeon-maps';
-import Marker from 'pigeon-marker';
-import Overlay from 'pigeon-overlay';
-
-const MAPBOX_ACCESS_TOKEN = 'pk.eyJ1IjoicGlnZW9uLW1hcHMiLCJhIjoiY2l3eW01Y2E2MDA4dzJ6cWh5dG9pYWlwdiJ9.cvdCf-7PymM1Y3xp5j71NQ'
-
-/*const providers = () => {
-    osm: (x, y, z) => {
-      const s = String.fromCharCode(97 + (x + y + z) % 3)
-      return 'https://${s}.tile.openstreetmap.org/${z}/${x}/${y}.png'
-    }
-  }*/
-
-class PigeonMap extends Component {
-
-
-    render(){
-        return (
-            <Map center={[50.879, 4.6997]} zoom={12} width={600} height={400} className="mapWrapper"> /*
-                <Marker anchor={[50.874, 4.6947]} payload={1} onClick={({ event, anchor, payload }) => {}} />
-        
-                <Overlay anchor={[50.879, 4.6997]} offset={[120, 79]}>
-                  <img src='pigeon.jpg' width={240} height={158} alt='' />
-                </Overlay>*/
-              </Map>
-        );
-    }
-}
-
-export default PigeonMap;

src/components/TablesClass.js

@@ -1,103 +0,0 @@
-import React, { Component } from 'react';
-
-
-class TablesClass extends Component {
-    constructor(props){
-        super(props);
-        
-        this.state = {
-            persons: [
-              {name: "Martin", fullName: "Martin Venzl", status: "online", speed: 2},
-              {name: "Simon", fullName: "Simon Ellinger", status: "online", speed: 4},
-              {name: "Lukas", fullName: "Lukas Wagner", status: "online", speed: 1},
-              {name: "Bernie", fullName: "Bernadette Hammerle", status: "online", speed: 3},
-              
-              {name: "tester1", fullName: "Testperson 1", status: "online", speed: 0},
-              {name: "tester2", fullName: "Testperson 2", status: "offline", speed: 6}
-            ]
-        }
-        
-        this.sortDivs = this.sortDivs.bind(this)
-    }
-    
-    // put every person in the right div (online or offline)
-    pushPersonToDiv(personDiv){
-      if (personDiv.dataset.status==="online"){
-        document.getElementById("online").appendChild(personDiv);
-      }else{
-        document.getElementById("offline").appendChild(personDiv);
-      }
-    }
-    
-    // update the content inside the div of one person
-    updateDivContent(person){
-      var id = person.name;
-      var div = document.getElementById(id);
-      div.dataset.status = person.status;
-      if (person.status==="online") {
-        div.innerHTML = person.name +
-        " (" + person.speed + " - " + person.status + ")" +
-        "<div class='extend'>" +
-        "<img src='foto.png'/>" +
-        "<p>" + person.fullName + "</p>" +
-        "<p>Geschwindigkeit: " + person.speed + "</p>" +
-        "<p>Status: " + person.status + "</p>" +
-        "</div>";
-      }else{
-        div.innerHTML = person.name +
-        " (" + person.status + ")" +
-        "<div class='extend'>" +
-        "<img src='foto.png'/>" +
-        "<p>" + person.fullName + "</p>" +
-        "<p>Geschwindigkeit: " + person.speed + "</p>" +
-        "<p>Status: " + person.status + "</p>" +
-        "</div>";
-      }
-      this.pushPersonToDiv(div);
-    }
-      
-    // create div with event listener for every person in array
-    createDivs(person){
-        var div = document.createElement('div');
-        div.className = "person";
-        div.id = person.name;
-        div.setAttribute("data-status", person.status);
-        
-        this.pushPersonToDiv(div);
-        this.updateDivContent(person);
-        
-        // add event listener to extend every person div
-        div.addEventListener("click", function(event) {
-          this.classList.toggle("active");
-          var targetElement = event.target || event.srcElement;
-          var extend = targetElement.children[0];
-          if (extend.style.display === "block") {
-              extend.style.display = "none";
-          } else {
-            extend.style.display = "block";
-          }
-        });
-    
-    }
-      
-    
-    // comparing the speed
-    sortDivs(){
-        this.state.persons.sort(function(a, b){return b.speed - a.speed});
-        this.state.persons.map((person) => (this.updateDivContent(person)));
-    }
-
-    // render every person and a button in a wrapper
-    render(){
-        return (
-            <div className="tableWrapper">
-                {this.state.persons.map((person) => (
-                    this.createDivs(person)
-                ))}
-                <button onClick={this.sortDivs}>Sort</button>
-            </div>
-        );
-    }
-}
-
-export default TablesClass;

src/table.html

@@ -1,177 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-<meta name="viewport" content="width=device-width, initial-scale=1">  
-<style>
-#wrapper{
-  width: 30%;
-  max-height: 80vh;
-  overflow: hidden;
-}
-.person {
-  background-color: #ddd;
-  color: #444;
-  cursor: pointer;
-  padding: 18px;
-  width: 100%;
-  border: none;
-  text-align: left;
-  outline: none;
-  font-size: 15px;
-  transition: 0.4s;
-}
-
-#offline .person{
-  background-color: #eee;
-}
-
-#offline .person:hover, #online .person:hover {
-  background-color: #bbb; 
-}
-
-.extend {
-  padding: 0 18px;
-  display: none;
-  overflow: hidden;
-}
-
-img{
-  width: 90px;
-  float: left;
-  margin-right: 20px;
-  margin-top: 10px;
-}
-</style>
-<script>
-
-</script>
-</head>
-<body>
-
-<h2>Tabelle</h2>
-
-<div id="wrapper">
-  <div id="online">
-  </div>
-  <p></p>
-  <div id="offline">
-  </div>
-</div>
-
-<button onclick="sortDivs()">Sort</button>
-<button onclick="changeStatus()">Status</button>
-
-
-<script>
-//TODO: external script 
-  
-// global array of objects
-var persons = [
-  {name: "Martin", fullName: "Martin Venzl", status: "online", speed: 2},
-  {name: "Simon", fullName: "Simon Ellinger", status: "online", speed: 4},
-  {name: "Lukas", fullName: "Lukas Wagner", status: "online", speed: 1},
-  {name: "Bernie", fullName: "Bernadette Hammerle", status: "online", speed: 3},
-  
-  {name: "tester1", fullName: "Testperson 1", status: "online", speed: 0},
-  {name: "tester2", fullName: "Testperson 2", status: "offline", speed: 6}
-];
-
-// create div for every person in persons array
-function createDivs(){
-  for (person of persons) { 
-    div = document.createElement('div');
-    div.className = "person";
-    div.id = person.name;
-    div.setAttribute("data-status", person.status);
-    pushPersonToDiv(div);
-    updateDivContent(person);
-    
-    // add event listener to extend every person div
-    div.addEventListener("click", function(event) {
-    this.classList.toggle("active");
-    var targetElement = event.target || event.srcElement;
-    var extend = targetElement.children[0];
-    if (extend.style.display === "block") {
-      extend.style.display = "none";
-    } else {
-      extend.style.display = "block";
-    }
-  });
-  }
-}
-
-createDivs();
-
-
-// update the content inside the div of one person
-// TODO: only execute if something has changed 
-function updateDivContent(person){
-  var id = person.name;
-  var div = document.getElementById(id);
-  div.dataset.status = person.status;
-  if (person.status=="online") {
-    div.innerHTML = person.name +
-    " (" + person.speed + " - " + person.status + ")" +
-    "<div class=\'extend\'>" +
-    "<img src=\'foto.png\'/>" +
-    "<p>" + person.fullName + "</p>" +
-    "<p>Geschwindigkeit: " + person.speed + "</p>" +
-    "<p>Status: " + person.status + "</p>" +
-    "</div>";
-  }else{
-    div.innerHTML = person.name +
-    " (" + person.status + ")" +
-    "<div class=\'extend\'>" +
-    "<img src=\'foto.png\'/>" +
-    "<p>" + person.fullName + "</p>" +
-    "<p>Geschwindigkeit: " + person.speed + "</p>" +
-    "<p>Status: " + person.status + "</p>" +
-    "</div>";
-  }
-  pushPersonToDiv(div);
-}
-
-// convert nodes to array
-//function getPersonArray(){
-//  var nodes = document.getElementsByClassName("person");
-//  var personArray = [];
-//  for (node of nodes) {
-//    personArray.push(node);
-//  }
-//  return personArray;
-//}
-
-// put every person in the right div (online or offline)
-function pushPersonToDiv(personDiv){
-  if (personDiv.dataset.status=="online"){
-    document.getElementById("online").appendChild(personDiv);
-  }else{
-    document.getElementById("offline").appendChild(personDiv);
-  }
-}
-
-// change the status from every person
-// TODO: check if status changed in intervall 
-function changeStatus(){
-  for (person of persons) {
-    if (person.status=="online"){
-      person.status = "offline";
-      updateDivContent(person);
-    }else{
-      person.status = "online";
-      updateDivContent(person);
-    }
-  }
-}
-
-// comparing the speed
-// TODO: get speed from ? 
-function sortDivs(){   
-  persons.sort(function(a, b){return b.speed - a.speed});
-  persons.forEach(updateDivContent);
-}
-
-</script>
-
-</body>
-</html>