Added session details/fingerprint (w/ icons)

public/misc/script.manage.js

@@ -22,7 +22,10 @@ $(document).ready(function(){
                 var Sessions = JSON.parse(data.UserSessions);
                 for (var i = 0; i < data.SessionCount; i++) {
                     try {
-                        var Fingerprint = JSON.parse(atob(Sessions[i]['fp']));
+                        var fingerPrint = JSON.parse(atob(Sessions[i]['fp']));
+                        var sessionDetails = '<img class="browsericon" src="/images/' + fingerPrint['browser'] + '_256x256.png">';
+                        sessionDetails += fingerPrint['browser'] + ' -- ' + fingerPrint['platform'];
+                        sessionDetails += '<br>' + fingerPrint['city'] + ' (' + fingerPrint['countrycode'] + ')';
                     } catch(e) {
                         // Do nothing
                     } 
@@ -34,8 +37,7 @@ $(document).ready(function(){
                             text: Sessions[i]['iss']
                         }))
                         .append($('<td>', {
-//                            text: Sessions[i]['fp'] ? atob(Sessions[i]['fp'])['browser'] + '(' + atob(Sessions[i]['fp'])['platform'] + ')' : ''
-                            text: Fingerprint ? Fingerprint['browser'] + ' (' + Fingerprint['platform'] + ')' : ''
+                            html: sessionDetails ? sessionDetails : ''
                         }))
                     );
                 }

public/misc/style.css

@@ -142,10 +142,16 @@ body {
 	    	padding-top: 5px;
 			background: white;
 	    	font-size: inherit;
-	    	font-weight: bold;
             z-index: 99;
             overflow-y: auto;
         }
+            .main section #sessions .browsericon {
+                height: 30px;
+                float: left;
+                margin-right: 5px;
+                border: none;
+                filter: drop-shadow(0px 0px 1px #000);
+            }
         .main section table {
             width: 100%;
         }