chg: [sensor_status UI] add types popover

TODO: handle extented types description

server/web/Flask_server.py

@@ -252,7 +252,10 @@ def sensors_status():
     else:
         daily_uuid = redis_server_stream.smembers('active_connection')
 
+    type_description_json = get_json_type_description()
+
     status_daily_uuid = []
+    types_description = {}
     for result in daily_uuid:
         first_seen = redis_server_metadata.hget('metadata_uuid:{}'.format(result), 'first_seen')
         first_seen_gmt = time.strftime('%Y-%m-%d %H:%M:%S', time.localtime(int(first_seen)))
@@ -271,6 +274,11 @@ def sensors_status():
             else:
                 type_connection_status[type] = False
             l_uuid_types.append(type)
+            if type not in types_description:
+                types_description[type] = type_description_json[type]['description']
+                if not types_description[type]:
+                    types_description[type] = 'please update your web server'
+
         l_uuid_types.sort()
         if 254 in l_uuid_types:
             extended_type = list(redis_server_metadata.smembers('all_extended_types_by_uuid:{}'.format(result)))
@@ -280,6 +288,7 @@ def sensors_status():
                     type_connection_status[extended] = True
                 else:
                     type_connection_status[extended] = False
+                types_description[extended] = ''
             l_uuid_types.extend(extended_type)
         if redis_server_metadata.sismember('blacklist_ip_by_uuid', result):
             Error = "All IP using this UUID are Blacklisted"
@@ -301,6 +310,7 @@ def sensors_status():
                                         "l_uuid_types": l_uuid_types, "Error": Error})
 
     return render_template("sensors_status.html", status_daily_uuid=status_daily_uuid,
+                                types_description=types_description,
                                 active_connection_filter=active_connection_filter)
 
 @app.route('/show_active_uuid')

server/web/templates/sensors_status.html

@@ -11,12 +11,15 @@
 
 	<!-- JS -->
 	<script src="{{ url_for('static', filename='js/jquery.js')}}"></script>
+	<script src="{{ url_for('static', filename='js/popper.min.js')}}"></script>
 	<script src="{{ url_for('static', filename='js/bootstrap.min.js')}}"></script>
 	<script src="{{ url_for('static', filename='js/jquery.dataTables.min.js')}}"></script>
 	<script src="{{ url_for('static', filename='js/dataTables.bootstrap.min.js')}}"></script>
 
   <style>
-
+	.popover{
+		max-width: 100%;
+	}
   </style>
 
 
@@ -79,7 +82,7 @@
 			</thead>
 			<tbody>
 				{% for row_uuid in status_daily_uuid %}
-					<tr>
+					<tr data-trigger="hover" title="" data-content="test content" data-original-title="test title">
 						<td>
 							<a class="" href="{{ url_for('uuid_management') }}?uuid={{row_uuid['uuid']}}">
 								{{row_uuid['uuid']}}
@@ -89,11 +92,16 @@
 						<td>{{row_uuid['first_seen_gmt']}}</td>
 						<td>{{row_uuid['last_seen_gmt']}}</td>
 						<td>
+							{{type_description}}
 							{% for uuid_type in row_uuid['l_uuid_types'] %}
 								{% if row_uuid['type_connection_status'][uuid_type] %}
-									<span class="badge badge-success">{{uuid_type}}</span>
+									<span class="badge badge-success" data-toggle="popover" data-trigger="hover" title="" data-content="{{types_description[uuid_type]}}" data-original-title="{{uuid_type}}">
+										{{uuid_type}}
+									</span>
 								{% else %}
-									<span class="badge badge-dark">{{uuid_type}}</span>
+									<span class="badge badge-dark" data-toggle="popover" data-trigger="hover" title="" data-content="{{types_description[uuid_type]}}" data-original-title="{{uuid_type}}">
+										{{uuid_type}}
+									</span>
 								{% endif %}
 							{% endfor %}
 						</td>
@@ -128,6 +136,11 @@ $(document).ready(function(){
 			"order": [[ 0, "asc" ]]
 		}
 	);
+	$('[data-toggle="popover"]').popover({
+		placement: 'top',
+		container: 'body',
+		html : false,
+	})
 });
 
 </script>