From 14103fb0a728ae91c9c1b9509ea1cc80623fb170 Mon Sep 17 00:00:00 2001
From: Sami Mokaddem <mokaddem.sami@gmail.com>
Date: Mon, 23 Oct 2017 17:25:41 +0200
Subject: [PATCH] Added led feed indicator

---
 static/js/index/index.js | 16 ++++++++++++++++
 templates/index.html     | 23 +++++++++++++++++++++++
 2 files changed, 39 insertions(+)

diff --git a/static/js/index/index.js b/static/js/index/index.js
index f957628..21560b4 100644
--- a/static/js/index/index.js
+++ b/static/js/index/index.js
@@ -1,4 +1,6 @@
+var feedStatusFreqCheck = 1000*15;
 var maxNumPoint = hours_spanned;
+var keepaliveTime = 0;
 var emptyArray = [];
 for(i=0; i<maxNumPoint; i++) {
     emptyArray.push([i, 0]);
@@ -147,6 +149,17 @@ $(document).ready(function () {
 
 });
 
+function ledColorManager() {
+    if(new Date().getTime() - keepaliveTime > feedStatusFreqCheck) { // no feed
+        $("#status_led").removeClass("led_green");
+        $("#status_led").addClass("led_red");
+    } else {
+        $("#status_led").removeClass("led_red");
+        $("#status_led").addClass("led_green");
+    }
+    setTimeout(function(){ ledColorManager(); }, feedStatusFreqCheck);
+}
+
 
 //  LOG TABLE
 function updateLogTable(feedName, log) {
@@ -177,6 +190,9 @@ function updateLogTable(feedName, log) {
                 tableBody.deleteRow(0);
             }
         }
+    } else if (feedName == "Keepalive") {
+        keepaliveTime = new Date().getTime();
+        ledColorManager();
     } else {
         // do nothing
         return;
diff --git a/templates/index.html b/templates/index.html
index 5a3bb06..5ae9a43 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -29,6 +29,28 @@ table {
     overflow-y: scroll;
 }
 
+.led_green {
+    float: right;
+    margin: auto auto;
+    margin-top: 12.5px;
+    width: 24px;
+    height: 24px;
+    background-color: #ABFF00;
+    border-radius: 50%;
+    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #304701 0 -1px 9px, #89FF00 0 2px 12px;
+}
+
+.led_red {
+    float: right;
+    margin: auto auto;
+    margin-top: 12.5px;
+    width: 24px;
+    height: 24px;
+    background-color: #F82222;
+    border-radius: 50%;
+    box-shadow: rgba(0, 0, 0, 0.2) 0 -1px 7px 1px, inset #304701 0 -1px 9px, #FF0303 0 2px 12px;
+}
+
 .marker_animation {
   stroke: darkred;
   position: absolute;
@@ -71,6 +93,7 @@ small {
         <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0; padding-left: 15px;">
             <div class="navbar-header">
                 <a class="navbar-brand" href="{{ url_for('index') }}">Misp feed dashboard</a>
+                <div id="status_led" class="led_red"></div>
             </div>
             <!-- /.navbar-header -->