Update v1.3

project.adoc

@@ -204,6 +204,10 @@ REST API έτσι ώστε να μπορούν να επικοινωνούν ε
 	* Το όνομα χρήστη (username).
 	* Έναν κωδικό πρόσβασης (password).
 
+Τέλος σε έναν τρίτο πίνακα καταχωρούμε ένα ιστορίκό για την διαθεσιμότητα άρα και για την ζήτηση που έχει το parking.
+Ελέγχοντας κάθε φορά που αλλάζει η κατάσταση μίας θέσης του parking, το πλήθος των ελεύθερων θέσεων, το καταχωρούμε
+σε αυτόν τον πίνακα σε συνδυασμό με ένα timestamp, εκείνης τις στιγμής.
+
 [source, sql]
 ----
 CREATE TABLE IF NOT EXISTS PARKING (
@@ -217,6 +221,13 @@ CREATE TABLE IF NOT EXISTS USERS (
 	USER_PASS VARCHAR(40) NOT NULL,
 	PRIMARY KEY(USER_NO)
 );
+
+CREATE TABLE IF NOT EXISTS PARKING_USAGE (
+	PARKING_USAGE_NO INT(10) AUTO_INCREMENT,
+	PARKING_METER INT(10) NOT NULL,
+	PARKING_DATE DATETIME NOT NULL,
+	PRIMARY KEY(PARKING_USAGE_NO)
+);
 ----
 
 ==== Υλοποίηση Κόμβου
@@ -239,6 +250,32 @@ WEB Server στη Python όπου η εκτέλεση θα πραγματοπο
 [{"no": 1, "status": false}, {"no": 2, "status": false}, {"no": 3, "status": false}, {"no": 4, "status": true}, {"no": 5, "status": false}, {"no": 6, "status": false}, {"no": 7, "status": false}, {"no": 8, "status": false}]
 ----
 
+* /chart [GET]: επιστρέφει ένα array από JSON objects, το καθένα από τα οποία εκφράζουν το πλήθως των ελεύθερων parking και
+το αντίστοιχο timestamp της ενημέρωσης. Αυτή η υπηρεσία θα μας βοηθήσει στο να σχεδιάσουμε ένα γράφημα με ματρήσεις ενός 24 ώρου,
+της ημέρας.
+
+[source, json]
+----
+[
+ {
+    "usage": 6,
+    "time": "2020-01-23 01:15:52"
+  },
+  {
+    "usage": 1,
+    "time": "2020-01-23 01:22:29"
+  },
+  {
+    "usage": 0,
+    "time": "2020-01-23 01:22:33"
+  },
+  {
+    "usage": 1,
+    "time": "2020-01-23 01:23:01"
+  }
+]
+----
+
 * /parkingStatus [POST] (content-type = "application/json"): που μας επιτρέπει να αλλάξουμε την κατάσταση μίας θέσης parking. Στο POST τα δεδομένα
 ορίζονται στο body σε αναπαράσταση JSON, έτσι ώστε ο Server να είναι ικανός να τα επεξεργαστεί και να τα αποθηκεύσει
 στη βάση δεδομένων που χρησιμοποιούμε.
@@ -347,6 +384,9 @@ flask run --host=[IP-v4] --port=8080
 Σκοπός αυτής είναι η αναπαράσταση της κατάστασης του Parking σε ένα γραφικό, φιλικό προς τον χρήστη περιβάλλον.
 Η σελίδα λοιπόν επεικονίζει για κάθε θέση parking με χρώμα κόκκινο την "μη ελεύθεση" και με πράσινο την "ελεύθερη".
 
+Ακόμα, μέσω της υπηρεσία /charts [GET] του REST API, απεικονίσεται ένα διάγραμμα με βάση την διαθεσιμότητα του parking
+το τελευταίο 24 ώρο, πιο συσκεκριμένα την τελευταία μέρα.
+
 Ένα παράδειγμα μέσω στιγμιοτύπου παρουσιάζεται παρακάτω.
 
 [.float-group]

project.html

@@ -793,6 +793,11 @@ REST API έτσι ώστε να μπορούν να επικοινωνούν ε
 </li>
 </ul>
 </div>
+<div class="paragraph">
+<p>Τέλος σε έναν τρίτο πίνακα καταχωρούμε ένα ιστορίκό για την διαθεσιμότητα άρα και για την ζήτηση που έχει το parking.
+Ελέγχοντας κάθε φορά που αλλάζει η κατάσταση μίας θέσης του parking, το πλήθος των ελεύθερων θέσεων, το καταχωρούμε
+σε αυτόν τον πίνακα σε συνδυασμό με ένα timestamp, εκείνης τις στιγμής.</p>
+</div>
 <div class="listingblock">
 <div class="content">
 <pre class="highlight"><code class="language-sql" data-lang="sql">CREATE TABLE IF NOT EXISTS PARKING (
@@ -805,6 +810,13 @@ CREATE TABLE IF NOT EXISTS USERS (
 	USER_NAME VARCHAR(40) NOT NULL UNIQUE,
 	USER_PASS VARCHAR(40) NOT NULL,
 	PRIMARY KEY(USER_NO)
+);
+
+CREATE TABLE IF NOT EXISTS PARKING_USAGE (
+	PARKING_USAGE_NO INT(10) AUTO_INCREMENT,
+	PARKING_METER INT(10) NOT NULL,
+	PARKING_DATE DATETIME NOT NULL,
+	PRIMARY KEY(PARKING_USAGE_NO)
 );</code></pre>
 </div>
 </div>
@@ -841,6 +853,37 @@ WEB Server στη Python όπου η εκτέλεση θα πραγματοπο
 <div class="ulist">
 <ul>
 <li>
+<p>/chart [GET]: επιστρέφει ένα array από JSON objects, το καθένα από τα οποία εκφράζουν το πλήθως των ελεύθερων parking και
+το αντίστοιχο timestamp της ενημέρωσης. Αυτή η υπηρεσία θα μας βοηθήσει στο να σχεδιάσουμε ένα γράφημα με ματρήσεις ενός 24 ώρου,
+της ημέρας.</p>
+</li>
+</ul>
+</div>
+<div class="listingblock">
+<div class="content">
+<pre class="highlight"><code class="language-json" data-lang="json">[
+ {
+    "usage": 6,
+    "time": "2020-01-23 01:15:52"
+  },
+  {
+    "usage": 1,
+    "time": "2020-01-23 01:22:29"
+  },
+  {
+    "usage": 0,
+    "time": "2020-01-23 01:22:33"
+  },
+  {
+    "usage": 1,
+    "time": "2020-01-23 01:23:01"
+  }
+]</code></pre>
+</div>
+</div>
+<div class="ulist">
+<ul>
+<li>
 <p>/parkingStatus [POST] (content-type = "application/json"): που μας επιτρέπει να αλλάξουμε την κατάσταση μίας θέσης parking. Στο POST τα δεδομένα
 ορίζονται στο body σε αναπαράσταση JSON, έτσι ώστε ο Server να είναι ικανός να τα επεξεργαστεί και να τα αποθηκεύσει
 στη βάση δεδομένων που χρησιμοποιούμε.</p>
@@ -1003,6 +1046,10 @@ flask run --host=[IP-v4] --port=8080</code></pre>
 Η σελίδα λοιπόν επεικονίζει για κάθε θέση parking με χρώμα κόκκινο την "μη ελεύθεση" και με πράσινο την "ελεύθερη".</p>
 </div>
 <div class="paragraph">
+<p>Ακόμα, μέσω της υπηρεσία /charts [GET] του REST API, απεικονίσεται ένα διάγραμμα με βάση την διαθεσιμότητα του parking
+το τελευταίο 24 ώρο, πιο συσκεκριμένα την τελευταία μέρα.</p>
+</div>
+<div class="paragraph">
 <p>Ένα παράδειγμα μέσω στιγμιοτύπου παρουσιάζεται παρακάτω.</p>
 </div>
 <div class="openblock float-group">
@@ -1190,7 +1237,7 @@ SLOW SUCCESS BUILDS CHARACTER, FAST SUCCESS BUILDS EGO.
 </div>
 <div id="footer">
 <div id="footer-text">
-Last updated 2020-01-22 20:04:33 +0200
+Last updated 2020-01-23 01:31:38 +0200
 </div>
 </div>
 </body>

serverNode/DB.sql

@@ -1,5 +1,6 @@
 DROP TABLE IF EXISTS PARKING;
 DROP TABLE IF EXISTS USERS;
+DROP TABLE IF EXISTS PARKING_USAGE;
 
 CREATE TABLE IF NOT EXISTS PARKING (
     PARKING_CODE INT(4) NOT NULL UNIQUE,
@@ -13,4 +14,11 @@ CREATE TABLE IF NOT EXISTS USERS (
 	PRIMARY KEY(USER_NO)
 );
 
+CREATE TABLE IF NOT EXISTS PARKING_USAGE (
+	PARKING_USAGE_NO INT(10) AUTO_INCREMENT,
+	PARKING_METER INT(10) NOT NULL,
+	PARKING_DATE DATETIME NOT NULL,
+	PRIMARY KEY(PARKING_USAGE_NO)
+);
+
 INSERT INTO USERS(USER_NAME, USER_PASS) VALUES("root", "root");

serverNode/serv.py

@@ -9,6 +9,7 @@ from flask_cors import CORS
 import mysql.connector
 from base64 import b64encode
 from os import urandom
+import time
 
 # ==================================================================
 # ==================================================================
@@ -69,6 +70,24 @@ def getParkings():
 		else:
 			parks.append({"no": res[0], "status": False})
 	return parks
+	
+
+# Define function that return the usage of parking from whole day.
+def getUsageParking():
+	usage = []
+	
+	sql = mySqlConnect()
+	myCursor = sql.cur
+	
+	values = (time.strftime('%Y-%m-%d') + ' 00:00:00', time.strftime('%Y-%m-%d') + ' 23:59:59')
+	myCursor.execute("SELECT * FROM PARKING_USAGE WHERE PARKING_DATE BETWEEN %s AND %s", values)
+	myRes = myCursor.fetchall()
+	
+	for res in myRes:
+		usage.append({"usage": res[1], "time": str(res[2])})
+	
+	return usage
+
 
 # Define a function that get if a user with exiting credencials
 #	username and password is authenticated.
@@ -103,24 +122,18 @@ def updateChart():
 	parks = getParkings()
 	all_parks = len(parks)
 	
-	full = 0
+	mysql = mySqlConnect()
+	myCursor = mysql.cur
+	
+	freeParks = 0
+	for park in parks:
+		if park['status'] == True:
+			freeParks += 1
 	
-	for p in parks:
+	values = (freeParks, time.strftime('%Y-%m-%d %H:%M:%S'))
-		if p['status'] == False:
+	myCursor.execute("INSERT INTO PARKING_USAGE (PARKING_METER, PARKING_DATE) VALUES (%s, %s)", values)
-			full+=1
+	mysql.con.commit()
 	
-	j = 1
-	if len(chart) < 16 :
-		chart.append(full)
-		print (chart)
-	elif len(chart) == 16:
-		for i in chart:
-			chart[j] = i
-			j+=1
-			
-			if j == 16:
-				break
-		chart[0] = full
 	return True
 
 
@@ -234,14 +247,8 @@ class Authenticate(Resource):
 # Chart
 class Chart(Resource):
 	def get(self):
-		result = dict()
+		result = getUsageParking()
-		
-		j = 1
-		for i in chart:
-			result[j] = i
-			j += 1
 		
-		print (result)
 		return result, 200
 
 # ==================================================================

webInterface/parking.html

@@ -77,47 +77,49 @@ $(document).ready(function(){
                 timeout: 120000,
             });
             
-            jQuery.ajax({
+            
-		                url: server_protocol + "://" + server_ip + ":" + server_port + "/chart",
+            setInterval(function () {
+                jQuery.ajax({
+		                url: server_protocol + "://" + server_ip + ":" + server_port + "/",
 		                type: "GET",
 		                
 		                contentType: "application/json; charset=utf-8",
 		                success: function(resultData) {
-		                	min = 0;
-		                	max = all_parks;
-		                	chart = "<img src='http://chart.apis.google.com/chart?cht=lc&chs=400x300&chxt=x,x,y,y&chxp=1,50|3,50&chxr=2," + min + "," + max + "|0,0,30&chds=" + min + "," + max + "&chxl=1:|Time|3:|" + "Ελεύθερες Θέσεις" + "&chd=t:"
 			                $.each(resultData, function(key, val) {
 			                    console.log("Parking No " + val.no + " -> " + val.status);
-				                
+				                if (val.status == true)
-				                if (key > 1) {
+					                $("div#" + val.no).removeClass("full").addClass("empty");
-				               		chart += "," + val;
+				                else if (val.status == false)
-				               	} else {
+					                $("div#" + val.no).removeClass("empty").addClass("full");
-				               		chart += val;
-				               	}
-				                
 			                });
-			                chart += "'>";
-			                $("div#tab3").html(chart);
 		                },
 		                error: function(jqXHR, testStatus, errorThrown) {
 		                },
 		                
 		                timeout: 120000,
 	                });
-            setInterval(function () {
+	                
-                jQuery.ajax({
+	            jQuery.ajax({
-		                url: server_protocol + "://" + server_ip + ":" + server_port + "/",
+		                url: server_protocol + "://" + server_ip + ":" + server_port + "/chart",
 		                type: "GET",
 		                
 		                contentType: "application/json; charset=utf-8",
 		                success: function(resultData) {
+		                	min = 0;
+		                	max = all_parks;
+		                	chart = "<img src='http://chart.apis.google.com/chart?cht=lc&chs=400x300&chxt=x,x,y,y&chxp=1,50|3,50&chxr=2," + min + "," + max + "|0,0,24&chds=" + min + "," + max + "&chxl=1:|Time|3:|" + "Ελεύθερες Θέσεις" + "&chd=t:"
 			                $.each(resultData, function(key, val) {
-			                    console.log("Parking No " + val.no + " -> " + val.status);
+			                    console.log("Parking No " + val.usage + " -> " + val.time);
-				                if (val.status == true)
+				                
-					                $("div#" + val.no).removeClass("full").addClass("empty");
+				                if (key > 1) {
-				                else if (val.status == false)
+				               		chart += "," + val.usage;
-					                $("div#" + val.no).removeClass("empty").addClass("full");
+				               	} else {
+				               		chart += val.usage;
+				               	}
+				                
 			                });
+			                chart += "'>";
+			                $("div#tab3").html(chart);
 		                },
 		                error: function(jqXHR, testStatus, errorThrown) {
 		                },