1. #1
    Ext JS Premium Member
    Join Date
    May 2009
    Location
    Barcelona (Spain)
    Posts
    218
    Vote Rating
    19
    pagullo will become famous soon enough pagullo will become famous soon enough

      7  

    Default Log4js-ext logging library published

    Log4js-ext logging library published


    I have developed a logging library form my own use, a-la log4j, for ExtJs. I decided to publish it under the GNU Lesser GPL so that the community can benefit from it.

    It provides the functionality and extensibility of the Java based log4j, plus a nice viewer that helps filter the logs, and the capability to log objects in highlighted json format. Of course, there is support for searching value in the logged objects, a must if you have tons of log output.

    This how the built-in log viewer looks like:

    log4js-ext-log-viewer.png

    Of course, there is support for logging to the browser console view, too.

    There is support for contextual logging, based on log4j's NDC concept.

    The library is fully tested, including almost 30 JsTestDriver automated tests.

    You can find it in http://code.google.com/p/log4js-ext/

    Best regards
    Last edited by pagullo; 17 Jul 2012 at 8:16 AM. Reason: Added more info
    Pedro Agulló, Barcelona (Spain)
    Agile team building, consulting, training & development
    DirectJNgine: http://code.google.com/p/directjngine - Log4js-ext: http://www.softwarementors.com/projects/p/log4js-ext/

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,077
    Vote Rating
    467
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Very nice .. thank you for the contribution.

    Regards,
    Scott.

  3. #3
    Ext JS Premium Member
    Join Date
    Jun 2010
    Posts
    100
    Vote Rating
    11
    h.wagner@telekom.de will become famous soon enough

      0  

    Default


    Quote Originally Posted by pagullo View Post
    ...
    The library is fully tested, including almost 30 JsTestDriver automated tests.

    You can find it in http://code.google.com/p/log4js-ext/
    Very useful, thank you.

    Any plans to implement some transparent persistence/backend support too?
    E.g. maybe a servlet that would use Log4J directly?

    Thanks in advance.

  4. #4
    Ext JS Premium Member
    Join Date
    May 2009
    Location
    Barcelona (Spain)
    Posts
    218
    Vote Rating
    19
    pagullo will become famous soon enough pagullo will become famous soon enough

      1  

    Default


    Quote Originally Posted by h.wagner@telekom.de View Post
    Very useful, thank you.
    Thanks for your kind words

    Quote Originally Posted by h.wagner@telekom.de View Post
    Any plans to implement some transparent persistence/backend support too?
    E.g. maybe a servlet that would use Log4J directly?

    Thanks in advance.
    I plan to provide some kind of support for remote logging for my own use (don't know if a servlet...), so it will get into log4js-ext.

    Can't commit to a timeframe (main feature of "for-free" projects, you know), but at any rate it will be there in the near future (2 months at most).

    Regards,
    Pedro Agulló, Barcelona (Spain)
    Agile team building, consulting, training & development
    DirectJNgine: http://code.google.com/p/directjngine - Log4js-ext: http://www.softwarementors.com/projects/p/log4js-ext/

  5. #5
    Sencha User talha06's Avatar
    Join Date
    Jul 2009
    Location
    Turkey
    Posts
    303
    Vote Rating
    0
    talha06 is on a distinguished road

      0  

    Default


    Hi Pagullo,

    First of all, thank you so much for this great library, by the way this is really great idea.

    I started to use this useful library, I'm trying to log globally(I'll call logger at different sources). To do this, I created a global LogViewerWindow, then I created a logger. And finally I created another global LogViewerAppender. After that I'm calling logger functions to log. Everything is OK but I can only see logs at console. I want to see logs also at LogViewerWindow which I created for this aim.

    Here's the what I tried, I'll be happy if you can help me.
    Thanks in advance.
    With regards,
    T

    Global declaration:
    Code:
    var logViewer = Ext.create('Sm.log.LogViewerWindow', {	modal			: true,
    	closeAction		: 'hide',
    	id				: 'logViewer'
    });
    Sm.log.Logger.getRoot().setLevel( Sm.log.Level.INFO );
    var logger = Sm.log.Logger.getLogger('AppLogger');
    var logViewerAppender = new Sm.log.LogViewerAppender();
    logger.addAppender(logViewerAppender);
    logger.setLevel( Sm.log.Level.ALL );
    Sm.log.Logger.getRoot().addAppender(logViewerAppender);
    Calls from different sources:
    Code:
    logger.info('Application is initializing!');
    Code:
    logger.error( "An error occured!" );
    "People will never forget how you made them feel."
    linkedin.com/in/talhakabakus

  6. #6
    Ext JS Premium Member
    Join Date
    May 2009
    Location
    Barcelona (Spain)
    Posts
    218
    Vote Rating
    19
    pagullo will become famous soon enough pagullo will become famous soon enough

      2  

    Default


    Quote Originally Posted by talha06 View Post
    Hi Pagullo,

    First of all, thank you so much for this great library, by the way this is really great idea.
    Thanks

    In order to make thinks as easy as possible, the viewer window creates its own appender if it does not receive one.

    Therefore, you need not create a new appender, just pass it to your logger like this:

    Code:
    logger.addAppender( logViewer.getAppender() );
    Let me know if it works!

    ...

    As an aside, a practice I recommend is to create the appender as soon as possible, so that it can keep accumulating logs even though you can't show the viewer.

    The code to create the appender at the very beginning and attach it to the viewer later will look like this:

    Code:
    // First step in app after making sure required classes are loaded
    logViewerAppender = new Sm.log.LogViewerAppender();
    Sm.log.Logger.getRoot().addAppender(logViewerAppender);
    
    // ...
    
    Ext.onReady() {
       // ...
       logViewer = new Sm.log.LogViewerWindow(appender: logViewerAppender);
       logViewer.show();
    }
    The appender is smart enough to keep buffering logs until it can dump them to the log viewer.

    Regards,
    Pedro Agulló, Barcelona (Spain)
    Agile team building, consulting, training & development
    DirectJNgine: http://code.google.com/p/directjngine - Log4js-ext: http://www.softwarementors.com/projects/p/log4js-ext/

  7. #7
    Sencha User talha06's Avatar
    Join Date
    Jul 2009
    Location
    Turkey
    Posts
    303
    Vote Rating
    0
    talha06 is on a distinguished road

      0  

    Default


    @pagullo

    Thanks for your quick reply & care.

    Well, after I change code through your advice, now it works until I close the LogViewerWindow. When I try to re-open it, I only see the latest log.

    Here's the updated code:
    Global Declaration in app.js
    Code:
    // <<<<<<<<<<<<<<<<<<<<<<<<<<<<< LOG4JS INIT
    Sm.log.Logger.getRoot().setLevel( Sm.log.Level.INFO );
    var logger = Sm.log.Logger.getLogger('AppLogger');
    var logViewerAppender = new Sm.log.LogViewerAppender();
    logger.setLevel( Sm.log.Level.ALL );
    Sm.log.Logger.getRoot().addAppender(logViewerAppender);
    // LOG4JS INIT >>>>>>>>>>>>>>>>>>>>>>>>>>>>>
    Calling from another source
    Code:
    logger.info('Loading users panel from');
    Thanks in advance..
    "People will never forget how you made them feel."
    linkedin.com/in/talhakabakus

  8. #8
    Ext JS Premium Member
    Join Date
    May 2009
    Location
    Barcelona (Spain)
    Posts
    218
    Vote Rating
    19
    pagullo will become famous soon enough pagullo will become famous soon enough

      2  

    Default


    As a matter of fact, I do not expect things to keep working after closing any window, I rely on "close is destruction" (that's how windows work nowadays by default).

    Anyway, if you close the log viewer, the appender will be detached, not destroyed. This means it will keep buffering logs, and whenever you attach it to a newly created log viewer, it will log all buffered logs -but the old ones will be lost, or course. I think that is consistent with what one would expect after closing a window.

    If what you want is to hide the window, you can do it and everything will work ok -I do that myself.

    My typical usage in an app is as follows:

    - Create a single viewer appender, at the very beginning of the app.
    - Create a single viewer window, and attach it to the appender.
    - Whenever I want to get the window out of my way, I hide or minimize it (if my app has support for the concept of "minimize").
    - Always have a debug menu in my app: one of the menu items can make the log viewer visible agin.

    That way, I can have a complete log history from the very beginning. If I get too many logs, I just clear them via the "clear" button in the viewer, instead of destroying the window.

    Regards,
    Pedro Agulló, Barcelona (Spain)
    Agile team building, consulting, training & development
    DirectJNgine: http://code.google.com/p/directjngine - Log4js-ext: http://www.softwarementors.com/projects/p/log4js-ext/

  9. #9
    Sencha User talha06's Avatar
    Join Date
    Jul 2009
    Location
    Turkey
    Posts
    303
    Vote Rating
    0
    talha06 is on a distinguished road

      0  

    Default


    OK Pagullo, the problem is resolved after I define everything global.

    Thanks a lot for your help & care again.

    By the way, in future release a paging or infinite grid can be useful. And an option to log into file can also be useful. If you don't mind, these are just my humble opinions to make your great extension better.

    With regards,
    T
    "People will never forget how you made them feel."
    linkedin.com/in/talhakabakus

  10. #10
    Ext JS Premium Member
    Join Date
    May 2009
    Location
    Barcelona (Spain)
    Posts
    218
    Vote Rating
    19
    pagullo will become famous soon enough pagullo will become famous soon enough

      2  

    Default


    Version 1.0 of log4js-ext is out

    log4js-ext-log-viewer.png

    It adds some extra functionality over 0.9 (which was almost a 1.0 candidate), but the main attraction is that it's been polished to the point of being a product. You know: documentation, multiple file consolidation into a single file, minification, etc.

    Here is the new features and improvements list:
    • Detail view for individual log entries: the built-in log viewer can show log details in an expanded view. That's great for complex logged objects that will be happier formatted as multiple line JSON.
    • Documentation: the wiki provides information for users to be proficient with log4js-ext in no time.
    • Javascript and CSS consolidation and minification: this makes using log4js-ext easier as now all that's needed is to add a single .js and a single .css to use all of log4js-ext. Besides, minification has reduced size to less than a third of the original size.
    • Refactored formatters to layouts: this is to follow log4j naming, a good thing because there is a thousand pages about log4j out there that might be useful in one way or other to log4js-ext users.
    • Should have zero impact, as I doubt there is anybody out there creating custom formatters/layouts as of version 0.9
    Besides, the library passes almost thirty unit tests in the latest Firefox, Chrome, Internet Explorer, Safari and even Opera.

    You can download it here.
    Pedro Agulló, Barcelona (Spain)
    Agile team building, consulting, training & development
    DirectJNgine: http://code.google.com/p/directjngine - Log4js-ext: http://www.softwarementors.com/projects/p/log4js-ext/