A simple but highly customizable MooTools Class that brings a UI to logging, and a great alternative to using Alerts in your code that provides little information.
Unlike other javascript logging classes out there, it provides base functionality without the UI, and utilizes the MooTools.More.Log class to display messages to the browsers console. So you won't need to write extra lines for both.
It provides several events that allow you to monitor just how your application is running, such as Pre-Fire, and CallBack.
Which will allow you to fire a function before sending a log message, monitoring the time it takes to complete, as well as fire a function after a log message is sent.
Please see the below for syntax and examples.
Features:
- Optional UI based logging.
- Optional Console based logging.
- Provides callback and pre-fire events to logs
- Easy to implement, use, and customize
- CSS 2/3 Style-sheet compatible
- Includes many events based around the class other than callback and pre-fire
- Catches logs while disabled, and relays them back in the same order when re-enabled
- Compatible and tested in IE 8, FireFox 3.x, Google Chrome 4+
How to use
TornLog can be run to help troubleshoot your Web Applications and included with your classes to add functionality and error trapping.
Syntax:
var myLog = new TornLog([options], fn, fn);
Arguments:
- options - (object, optional) An object with options for the effect. See below.
Options:
- useMooLog - (boolean: defaults to true) Enables/Disables MooTools.More Log if it is included
enabled - (boolean: defaults to true) Enables/Disables logging on init
ui: - (object UI options see below options)
- placement - (string: defaults to top) Placement of the UI: Can be 'top', 'bottom', 'before', 'after'
- style - (css: defaults to top:1px;right:1px;) Custom style to force on the UI
- movable - (bool defaults to true) Is UI movable
- sizable - (bool defaults to true) Is UI sizable
- opacity - (intger <= 1 defaults to 1) the opacity of the UI
- clasName - (string defaults to 'tornLog') The class name used to define the UI's style
- wrapper - (string defaults to 'div') The tag type to wrap the UI in
- container - (mixed defaults to false) The Element to insert the UI into
- lockoriginalsize - (bool defaults to true) Forces the UI to never go smaller than it's original height or width
- keepincontainer - (bool defaults to true) Forces the UI to remain in it's container
- minSize: - (object defaults to x: 150, y: 100) x and y of the minimum size the UI can be resized to
line: - (object Line options see below options)
- start - (integer defaults to 1) The number to display for the 1st message
- numbers - (bool defaults to true) Show Number column
- dates - (bool defaults to true) Show Date column
- dateFormat - (string defaults to '[%m-%d-%y %H:%M:%S]') See [Date Format][/Native/Date#Date:format].
- durations - (bool defaults to true) Show Duration column
- append - (string defaults to '') String to append to each line.
- prepend - (string defaults to '') String to prepend to each line.
Events:
- onInit - (function) The function to execute when TornLog is created (eg: new TornLog()).
- onEnable - (function) The function to exectue when logging is enabled.
- onDisable - (function) The function to exectute when logging is disabled.
- onClearLog - (function) The function to exectute when the log is cleared.
- onSendLog - (function) The function to exectute when a log message is sent.
- onShow - (function) The function to exectute when the UI is shown.
- onHide - (function) The function to exectute when the UI is hidden.
Examples:
var myLog = false;
var myPreFire = function(){
alert('Pre-Fire started');
};
var myCallBack = function(){
alert('Good-Bye');
myLog.send('Finished Callback');
};
addEvent('domready', function(){
myLog = new TornLog();
myLog.send("Pre-Fire completed in ->", myPreFire, myCallBack);
});
//Will execute myPreFire; when the OK button is pressed will send the message to the Log with the amount of time it took from when it started
//to when you pressed ok, then fire myCallBack.
Public Methods:
send
Sends a message to TornLog
Syntax
myLog.send(message, fn1, fn2);
Arguments
- message - (string, required) The message to send to TornLog
- fn1 - (function, optional) The function to execute before the message is sent (false if no function).
- fn2 - (function, optional) The function to execute after sending a message.
Examples
myLog.send("hello", false, false);
hideUI
Hides the TornLog UI if shown
Syntax
myLog.hideUI();
showUI
Shows the TornLog UI if hidden
Syntax
myLog.showUI();
enable
Enables logging
Syntax
myLog.enable();
disable
Disables logging
Syntax
myLog.disable();
