Pull in a simple javascript log implementation to kick off #665

hawtio · Oct 22, 2013 · c1de7a4 · c1de7a4
1 parent 21a71a1
commit c1de7a4
Show file tree

Hide file tree

Showing 5 changed files with 120 additions and 5 deletions.
diff --git a/hawtio-web/src/main/d.ts/logger.d.ts b/hawtio-web/src/main/d.ts/logger.d.ts
@@ -0,0 +1,32 @@
+
+
+declare var Logger:Logging.LoggerStatic;
+
+declare module Logging {
+
+  export interface LogLevel {
+    value: number;
+    name: string;
+  }
+
+  export interface Logger {
+    setHandler(handler:Function):void;
+    enabledFor(level:LogLevel):bool;
+    setLevel(level:LogLevel):void;
+    debug(...arguments:any[]):void;
+    info(...arguments:any[]):void;
+    warn(...arguments:any[]):void;
+    error(...arguments:any[]):void;
+  }
+
+  export interface LoggerStatic extends Logger {
+    useDefaults(level:LogLevel):void;
+    get(name:string):Logger;
+    DEBUG:LogLevel;
+    INFO:LogLevel;
+    WARN:LogLevel;
+    ERROR:LogLevel;
+    OFF:LogLevel;
+  }
+
+}
diff --git a/hawtio-web/src/main/webapp/app/core/html/preferences.html b/hawtio-web/src/main/webapp/app/core/html/preferences.html
@@ -6,8 +6,9 @@
 
       <strong>Behaviour</strong>
       <form class="form-horizontal">
+
         <div class="control-group">
-          <label class="control-label" for="updateRate" title="How frequently the data is updated in the browser">Update Rate</label>
+          <label class="control-label" for="updateRate">Update Rate</label>
 
           <div class="controls">
             <select id="updateRate" ng-model="updateRate">
@@ -18,7 +19,23 @@
               <option value="10000">10 seconds</option>
               <option value="30000">30 seconds</option>
             </select>
+            <span class="help-block">How frequently the data is updated in the browser</span>
+          </div>
+        </div>
+
+        <div class="control-group">
+          <label class="control-label" for="logLevel">Log Level</label>
+          <div class="controls">
+            <select id="logLevel" ng-model="localStorage.logLevel">
+              <option value='{"value": 99, "name": "OFF"}'>Off</option>
+              <option value='{"value": 8, "name": "ERROR"}'>Error</option>
+              <option value='{"value": 4, "name": "WARN"}'>Warn</option>
+              <option value='{"value": 2, "name": "INFO"}'>Info</option>
+              <option value='{"value": 1, "name": "DEBUG"}'>Debug</option>
+            </select>
+            <span class="help-block">Level of logging for the web console frontend</span>
           </div>
+
         </div>
 
         <div class="control-group">

diff --git a/hawtio-web/src/main/webapp/app/core/js/corePlugin.ts b/hawtio-web/src/main/webapp/app/core/js/corePlugin.ts
@@ -365,7 +365,9 @@ angular.module('hawtioCore', ['bootstrap', 'ngResource', 'ui', 'ui.bootstrap.dia
           }
 
           setTimeout(() => {
-            $("#main-body").fadeIn(2000);
+            $("#main-body").fadeIn(2000).after(() => {
+              Logger.info("Hawtio started!");
+            });
           }, 500);
 
         }).

diff --git a/hawtio-web/src/main/webapp/app/core/js/preferences.ts b/hawtio-web/src/main/webapp/app/core/js/preferences.ts
@@ -2,6 +2,19 @@ module Core {
 
   export function PreferencesController($scope, localStorage) {
 
+    if (!angular.isDefined(localStorage['logLevel'])) {
+      localStorage['logLevel'] = '{"value": 2, "name": "INFO"}';
+    }
+
+    $scope.localStorage = localStorage;
+
+    $scope.$watch('localStorage.logLevel', (newValue, oldValue) => {
+      if (newValue !== oldValue) {
+        var level = JSON.parse(newValue);
+        Logger.setLevel(level);
+      }
+    });
+
     $scope.updateRate = localStorage['updateRate'];
     $scope.url = localStorage['url'];
     $scope.autoRefresh = localStorage['autoRefresh'] === "true";

diff --git a/hawtio-web/src/main/webapp/index.html b/hawtio-web/src/main/webapp/index.html
@@ -202,7 +202,61 @@ <h2 title="Status Code: {{connectFailure.status}}">Cannot Connect: {{connectFail
       </div>
     </div>
 
+    <!--
+      Configure logging first thing...
+    -->
+    <script type="text/javascript" src="lib/logger.min.js"></script>
+    <script type="text/javascript" src="lib/json2-min.js"></script>
+
+    <script type="text/javascript">
+
+      Logger.setLevel(Logger.INFO);
+
+      if ('localStorage' in window) {
+        if ('logLevel' in window.localStorage) {
+          var logLevel = JSON.parse(window.localStorage['logLevel']);
+          // console.log("Using log level: ", logLevel);
+          Logger.setLevel(logLevel);
+        }
+      }
+
+      if ('console' in window) {
+
+        var MyConsole = window.console;
+        // sneaky hack to redirect console.log !
+        Logger.setHandler(function(messages, context) {
+          var hdlr = MyConsole.log;
+
+          // Prepend the logger's name to the log message for easy identification.
+          if (context.name) {
+            messages[0] = "[" + context.name + "] " + messages[0];
+          }
 
+          // Delegate through to custom warn/error loggers if present on the console.
+          if (context.level === Logger.WARN && MyConsole.warn) {
+            hdlr = MyConsole.warn;
+          } else if (context.level === Logger.ERROR && MyConsole.error) {
+            hdlr = MyConsole.error;
+          } else if (context.level === Logger.INFO && MyConsole.info) {
+            hdlr = MyConsole.info;
+          }
+
+          hdlr.apply(MyConsole, messages);
+        });
+
+        window.console = {
+          log: Logger.debug,
+          warn: Logger.warn,
+          error: Logger.error,
+          info: Logger.info
+        };
+      }
+
+
+    </script>
+
+
+    <!-- Now load and set up the plugin loader -->
     <script type="text/javascript" src="app/core/js/hawtio-plugin-loader.js"></script>
 
     <script type="text/javascript">
@@ -216,8 +270,6 @@ <h2 title="Status Code: {{connectFailure.status}}">Cannot Connect: {{connectFail
       });
     </script>
 
-
-
     <!-- charts and jolokia for jmx -->
     <script type="text/javascript" src="lib/d3.v3.min.js"></script>
 
@@ -227,7 +279,6 @@ <h2 title="Status Code: {{connectFailure.status}}">Cannot Connect: {{connectFail
     <script type="text/javascript" src="lib/cubism.v1.min.js"></script>
     <script type="text/javascript" src="lib/jolokia-cubism-min.js"></script>
     <script type="text/javascript" src="lib/jolokia-simple-min.js"></script>
-    <script type="text/javascript" src="lib/json2-min.js"></script>
 
     <!-- UI framework -->
     <script type="text/javascript" src="lib/bootstrap.min.js"></script>