start implementing live request tracking

watcher/app.py

@@ -1,7 +1,9 @@
 from time import time
 
 import socketio
+import socket
 from flask import Flask, render_template
+from flask import request
 
 sio = socketio.Server()
 app = Flask(__name__)
@@ -38,6 +40,7 @@ def start_run(run_index):
 
 @app.route("/link/start/<run>/<index>")
 def link_start(run, index):
+    live_request(run, index)
     if db["current_run"] != run:
         return "Wrong run number, check that you update your run", 404
     else:
@@ -70,6 +73,14 @@ def connect(sid, data):
         current_run = db["run_data"][db["current_run"]]
         sio.emit('sync_current_run', current_run, room=sid)
 
+def live_request(run, index):
+    ip = request.remote_addr
+    request_data = {}
+    request_data["hostname"] = socket.gethostbyaddr(ip)
+    request_data["time"] = time()
+
+    sio.emit('live_request', request_data)
+
 
 if __name__ == '__main__':
     app.run(host="0.0.0.0", debug=True)

watcher/static/index.js

@@ -43,7 +43,30 @@ require(['jquery', 'socket.io'], function(jq, io) {
                 addLink(link_id, run_data["data"][link_id]);
             }
         });
+        socket.on('live_request', function(request_data) {
+            request_time = new Date(request_data["time"] * 1000);
+            addLiveRequest(request_data["hostname"], request_time);
         });
+    });
+
+    function addLiveRequest(request_host, request_time) {
+        alert("yes");
+        let hostname = request_host;
+        let timesting = request_time.getHours() + ":" + request_time.getMinutes();
+
+        let html = `
+        <div class="item">
+            <div>
+                ${hostname}
+            </div>
+            <div>
+                ${timesting}
+            </div>
+        </div>
+        `;
+        $('#live_requests').prepend($(html));
+
+    }
 
     function addLink(link_id, link_data) {
         let stop = "handoff" in link_data;

watcher/templates/index.html

@@ -64,11 +64,26 @@
         </div>
       </div>
 
-      <div class="card">
+      <div id="live_requests" class="card">
-        <div class="item">live requests</div>
+        <div class="item">
+            <div>
+                Hostname
+            </div>
+            <div>
+                Time
+            </div>
+        </div>
         <div class="card__title">
             Live Requests
         </div>
+        <div class="item">
+            <div>
+                Hostname
+            </div>
+            <div>
+                
+            </div>
+        </div>
       </div>
     </div>
   </body>