Flatten objects and format time in info-section

fixes #104

Author: Johannes Stelzer

spring-boot-admin-samples/spring-boot-admin-sample/pom.xml

@@ -36,6 +36,10 @@
                     <addResources>false</addResources>
                 </configuration>
             </plugin>
+            <plugin>
+                <groupId>pl.project13.maven</groupId>
+                <artifactId>git-commit-id-plugin</artifactId>
+            </plugin>
         </plugins>
     </build>
 </project>

spring-boot-admin-server-ui/app/js/filter/flatten.js

@@ -0,0 +1,53 @@
+/*
+ * Copyright 2014 the original author or authors.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+'use strict';
+
+var angular = require('angular');
+
+module.exports = function ($filter) {
+    var flatten = function (obj, prefix) {
+        if (obj instanceof Date) {
+            obj = $filter('date')(obj, 'dd.MM.yyyy HH:mm:ss');
+        }
+        if (typeof obj === 'boolean' || typeof obj === 'string' || typeof obj === 'number') {
+            return (prefix ? prefix + ': ' : '') + obj;
+        }
+
+        var result = '';
+        var first = true;
+        angular.forEach(obj, function(value, key) {
+            if (angular.isString(value) && (key === 'time' || key === 'timestamp')) {
+               if (/^\d+$/.test(value)) {
+                  value = new Date(value * 1000);
+               } else if (/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}\+\d{4}$/.test(value)) {
+                  value = new Date(value);
+               }
+            }
+
+            if (first) {
+                first = false;
+            } else {
+                result = result + '\n';
+            }
+
+            result = result + flatten(value, prefix ? prefix + '.' + key : key);
+        });
+
+        return result;
+    };
+
+    return flatten;
+};

spring-boot-admin-server-ui/app/js/filter/index.js

@@ -8,3 +8,4 @@ springBootAdmin.filter('classNameLoggerOnly', require('./classNameLoggerOnly'));
 springBootAdmin.filter('capitalize', require('./capitalize'));
 springBootAdmin.filter('humanBytes', require('./humanBytes'));
 springBootAdmin.filter('joinArray', require('./joinArray'));
+springBootAdmin.filter('flatten', require('./flatten'));

spring-boot-admin-server-ui/app/views/apps/details.html

@@ -9,7 +9,7 @@
 				<thead><tr><th colspan="2">Application <small class="pull-right"><a href="api/applications/{{ application.id }}/info">raw JSON</a></small></th></tr></thead>
 				<tbody>
 					<tr ng-repeat="(key, value) in info" >
-						<td>{{ key }}</td><td>{{ value }}</td>
+						<td>{{ key }}</td><td style="white-space: pre;">{{ value | flatten }}</td>
 					</tr>
 				</tbody>
 			</table>

spring-boot-admin-server-ui/app/views/overview.html

@@ -23,7 +23,7 @@ <h2 >Spring-Boot applications<br>
 			<tr ng-repeat="application in applications|orderBy:order.column:order.descending|orderBy:'statusInfo.status':false track by application.id">
 				<td>{{ application.name }}<br/><span class="muted">{{ application.serviceUrl || application.managementUrl || application.healthUrl }}</span></td>
 				<td>{{ application.info.version }}</td>
-				<td><span ng-repeat="(name, value) in application.info track by name" ng-if="name != 'version'">{{name}}: {{value}}<br></span></td>
+				<td><span ng-repeat="(name, value) in application.info track by name" ng-if="name != 'version'" style="white-space: pre">{{value | flatten:name}}<br/></span></td>
 				<td><span class="status-{{application.statusInfo.status}}" title="{{application.statusInfo.timestamp  | date:'dd.MM.yyyy HH:mm:ss' }}">{{ application.statusInfo.status }}</span>
 				<span ng-show="application.refreshing" class="refresh"></span></td>
 				<td>