Using realtime data

Signed-off-by: Pieter-Jan Geeroms <[email protected]>

package.json

@@ -12,6 +12,7 @@
   "dependencies": {
     "body-parser": "^1.15.2",
     "express": "^4.14.0",
+    "got": "^6.3.0",
     "jade": "^1.11.0",
     "jsonld": "^0.4.11"
   }

server.js

@@ -2,8 +2,11 @@ var express = require('express');
 var bodyParser = require('body-parser');
 var jsonld = require('jsonld');
 var url = require('url');
+var got = require('got');
 var app = express();
 
+const realtime = "http://datatank.stad.gent/4/mobiliteit/bezettingparkingsrealtime.json";
+
 app.set('views', __dirname + '/views');
 app.set('view engine', 'jade');
 app.use(express.static(__dirname + '/public'));
@@ -30,8 +33,10 @@ app.get('/parking', function (req, res) {
 //    }
     res.render('index',{ title : 'Home', data: parsedJson, freeSpace: free, errors : errors });
   } else {
-    console.log("No json was found");
-    res.render('empty', { title: 'Home'});
+    got(realtime).then(response => {
+      let data = JSON.parse(response.body);
+      res.render('empty', { title: 'Home', data: data});
+    });
   }
 
 
@@ -80,14 +85,6 @@ function validateJsonld(json) {
   return errors;
 }
 
-app.post('/json', jsonParser, function (req, res) {
-  var json = req.body;
-  var errors = validateJsonld(json);
-  res.send(errors);
-
-
-});
-
 app.listen(8080, function () {
   console.log('Example app listening on port 8080!');
 });

views/empty.jade

@@ -5,18 +5,19 @@ block content
       ul
         each error in errors
           li= error
-  article
-    h2
-    p
-    p
-    p
-    a(href="http://www.google.com/maps/place/51.053858,3.724259")
-      | <img class="map" src="https://maps.googleapis.com/maps/api/staticmap?center=Ghent,Belgium&zoom=13&size=400x200&maptype=roadmap&markers=color:red|51.053858,3.724259&key=AIzaSyA8Tawxe7x2cpGiTpvOh35xHe8dUZsjsFg" alt="Parking Name">
+
+  each parking in data
+    article
+      h2= parking.name
+      p= parking.address
+      p= parking.contactInfo
+      a(href="http://www.google.com/maps/place/51.053858,3.724259")
+        img(class="map" src="https://maps.googleapis.com/maps/api/staticmap?center=Ghent,Belgium&zoom=13&size=400x200&maptype=roadmap&markers=color:red|"+ parking.latitude +","+ parking.longitude +"&key=AIzaSyA8Tawxe7x2cpGiTpvOh35xHe8dUZsjsFg" alt="Parking Name")
 
-    div
       div
-      meter(min="0" max="100" value="0")
-      div.spotsOpen
-        span.number
-        p VRIJE
-        p.spots PLAATSEN
+        div
+        meter(min="0" max=parking.totalCapacity value=parking.totalCapacity - parking.parkingStatus.availableCapacity)
+        div.spotsOpen
+          span.number= parking.parkingStatus.availableCapacity
+          p VRIJE
+          p.spots PLAATSEN