Skip to content

Commit

Permalink
Fix #665
Browse files Browse the repository at this point in the history
  • Loading branch information
@gashcrumb
gashcrumb committed Oct 22, 2013
1 parent 004ddd0 commit cb60d16
Show file tree
Hide file tree
Showing 5 changed files with 204 additions and 25 deletions.
7 changes: 7 additions & 0 deletions hawtio-web/src/main/webapp/app/core/html/preferences.html
View file
Expand Up @@ -35,7 +35,14 @@
</select>
<span class="help-block">Level of logging for the web console frontend</span>
</div>
</div>

<div class="control-group">
<label class="control-label" for="logBuffer">Log Buffer</label>
<div class="controls">
<input type="number" id="logBuffer" ng-model="logBuffer">
<span class="help-block">The number of log statements to keep available in the frontend log panel</span>
</div>
</div>

<div class="control-group">
Expand Down
20 changes: 20 additions & 0 deletions hawtio-web/src/main/webapp/app/core/js/corePlugin.ts
View file
Expand Up @@ -401,6 +401,26 @@ angular.module('hawtioCore', ['bootstrap', 'ngResource', 'ui', 'ui.bootstrap.dia
}).
directive('gridStyle', function($window) {
return new Core.GridStyle($window);
}).
directive('logToggler', function(localStorage) {
return {
restrict: 'A',
link: ($scope, $element, $attr) => {
$element.click(() => {
var log = $("#log-panel");
Logger.debug("height: ", log.height());
if (log.height() !== 0) {
localStorage['showLog'] = 'false';
log.css({'bottom': '110%'});
} else {
localStorage['showLog'] = 'true';
log.css({'bottom': '50%'});
}
return false;
});
}
};

});

// enable bootstrap tooltips
Expand Down
12 changes: 12 additions & 0 deletions hawtio-web/src/main/webapp/app/core/js/preferences.ts
View file
Expand Up @@ -8,13 +8,25 @@ module Core {

$scope.localStorage = localStorage;

$scope.logBuffer = 0;
if ('logBuffer' in localStorage) {
$scope.logBuffer = parseInt(localStorage['logBuffer']);
}

$scope.$watch('localStorage.logLevel', (newValue, oldValue) => {
if (newValue !== oldValue) {
var level = JSON.parse(newValue);
Logger.setLevel(level);
}
});

$scope.$watch('logBuffer', (newValue, oldValue) => {
if (newValue !== oldValue) {
localStorage['logBuffer'] = newValue;
window['LogBuffer'] = newValue;
}
});

$scope.updateRate = localStorage['updateRate'];
$scope.url = localStorage['url'];
$scope.autoRefresh = localStorage['autoRefresh'] === "true";
Expand Down
69 changes: 69 additions & 0 deletions hawtio-web/src/main/webapp/css/site-base.css
View file
Expand Up @@ -10,6 +10,75 @@ a:focus {
.property-name {
white-space: nowrap;
}

#log-panel {
position: fixed;
top: -5px;
left: 30px;
right: 30px;
bottom: 50%;
z-index: 10000;
background: white;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
border: 2px solid #d4d4d4;
opacity: 0.8;
transition: bottom 1s ease-in-out;
}

#log-panel > div {
position: relative;
width: 100%;
height: 100%;
}

#log-panel #log-panel-statements {
margin-left: 0;
margin-bottom: 0;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 20px;
background: black;
overflow-y: auto;
}

#log-panel-statements li {
font-family: monospace;
margin-left: 3px;
margin-right: 3px;
}

#log-panel-statements li.DEBUG {
color: dodgerblue;
}

#log-panel-statements li.INFO {
color: white;
}

#log-panel-statements li.WARN {
color: yellow;
}

#log-panel-statements li.ERROR {
color: red;
}


#log-panel #close {
text-align: center;
position: absolute;
height: 20px;
bottom: 0;
left: 0;
right: 0;
background: white;
border-top: 1px solid #d4d4d4;
}


#canvas {
display: inline-block;
}
Expand Down
121 changes: 96 additions & 25 deletions hawtio-web/src/main/webapp/index.html
View file
Expand Up @@ -53,6 +53,15 @@

<body>

<div id="log-panel" style="bottom: 110%">
<div>
<ul id="log-panel-statements"></ul>
<div id="close" log-toggler>
<i class="icon-chevron-up"></i>
</div>
</div>
</div>

<div id="main-body" ng-controller="Core.AppController" style="display: none;">
<!-- navbar-inverse -->
<div id="main-nav" class="navbar navbar-fixed-top" ng-show="!fullScreen()" ng-controller="Core.NavBarController">
Expand Down Expand Up @@ -84,6 +93,11 @@
</li>
</ul>
</li>
<li ng-show="loggedIn()" title="Show the logging console">
<a href="" log-toggler>
<i class="icon-file-text"></i>
</a>
</li>
<li ng-show="loggedIn()" ng-class="{active : isActive('#/preferences')}">
<a ng-href="{{link('#/preferences')}}" title="Edit your preferences" data-placement="bottom">
<i class="icon-cogs"></i>
Expand Down Expand Up @@ -211,48 +225,105 @@ <h2 title="Status Code: {{connectFailure.status}}">Cannot Connect: {{connectFail
<script type="text/javascript">

Logger.setLevel(Logger.INFO);
// we'll default to 100 statements I guess...
// TODO - make configurable...
window['LogBuffer'] = 100;

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 ('showLog' in window.localStorage) {
var showLog = window.localStorage['showLog'];
// console.log("showLog: ", showLog);
if (showLog === 'true') {
var container = document.getElementById("log-panel");
container.setAttribute("style", "bottom: 50%;");
}
}

if ('logBuffer' in window.localStorage) {
var logBuffer = window.localStorage['logBuffer'];
window['LogBuffer'] = parseInt(logBuffer);
} else {
window.localStorage['logBuffer'] = window['LogBuffer'];
}
}

if ('console' in window) {
var MyConsole = window.console;

var MyConsole = window.console;
// sneaky hack to redirect console.log !
Logger.setHandler(function(messages, context) {
var hdlr = MyConsole.log;
Logger.setHandler(function(messages, context) {
// MyConsole.log("context: ", context);
// MyConsole.log("messages: ", messages);
var container = document.getElementById("log-panel");
var panel = document.getElementById("log-panel-statements");

// Prepend the logger's name to the log message for easy identification.
if (context.name) {
messages[0] = "[" + context.name + "] " + messages[0];
}
var node = document.createElement("li");

var text = ""

var isArrayOrObject = function(o) {
return (!!o) && (o.constructor === Array || o.constructor === Object);
};

// 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;
for (var i = 0; i < messages.length; i++) {
var message = messages[i];
if (isArrayOrObject(message)) {
text = text + JSON.stringify(message);
} else {
text = text + " " + message;
}
}

hdlr.apply(MyConsole, messages);
});
node.innerHTML = text;
node.className = context.level.name;
panel.appendChild(node);
if (panel.childNodes.length > parseInt(window['LogBuffer'])) {
panel.firstChild.remove();
}

window.console = {
log: Logger.debug,
warn: Logger.warn,
error: Logger.error,
info: Logger.info
};
}
if (container.scrollHeight = 0) {
panel.scrollTop = panel.scrollHeight;
}

if (panel.scrollTop > panel.scrollHeight - container.scrollHeight - 100) {
panel.scrollTop = panel.scrollHeight;
}

});

/*
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);
});
*/

// sneaky hack to redirect console.log !
window.console = {
log: Logger.debug,
warn: Logger.warn,
error: Logger.error,
info: Logger.info
};
</script>


Expand Down

0 comments on commit cb60d16

Please sign in to comment.