TornLog 1.1.1.0

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+



Details

Author
fyrye
Current version
1.1.1.0
GitHub
fyrye/tornLog
Downloads
1388
Category
Widgets
Tags
Report
GitHub Issues

Releases


Dependencies

  • core/1.2.4:
    • Class.Extras
    • Element.Event
    • Element.Style
    • Element.Dimensions
    • Selectors
    • Fx.Tween
  • more/1.2.4.4:
    • Date
    • Drag.Move
    • HtmlTable.Zebra
    • HTMLTable.Sort

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:

  1. 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

  1. message - (string, required) The message to send to TornLog
  2. fn1 - (function, optional) The function to execute before the message is sent (false if no function).
  3. 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();

Screenshots


Discuss

A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.

Found a bug in this plugin? Please report it this repository's Github Issues.

blog comments powered by Disqus