ThunderBolt AS3, which is a lightweight logger extension for Flex 3-4, AIR and Flash 9-10 applications, has been updated to version 2.2.

Check out the new features:

New features

1. Logging of package names + class names + code line numbers (Flash Debug Player required).

   

2. ThunderBoltTarget for using Flex Logging API improved.
3. SWC updated for using Flex 4 (Gumbo)
4. ThunderBolt AS3 Console uses a certificate of Thawte sponsored by Adobe.

   

5. ThunderBolt AS3 Console is updated using latest version of Adobe AIR v.1.5.1
6. Issue 10 fixed: “Command + Q not working in OS X“
7. All examples and documentation has been updated as well.

Happy Logging

-Jens

After a public beta phase of two months and about 500-1.000 beta testers (1.240 downloads) the doors are open for the new release 2.0. Thanks to all the participants!

One of the new features is the support and Flex 4 (Gumbo). Check out the following example. Note: Flash Player 10 beta will be required.

Example

Instruction

1. For using Flex 4 SDK beta and Flex Builder 3 follow the instructions published by Peter deHaan (blog.flexexamples.com).
2. Grab ThunderBoltAS3_Gumbo.swc for using ThunderBolt AS3 within your Gumbo project. You will find the SWC within ThunderBoltAS3_v2.0.zip, which is available at Google Code. Add the SWC to your lib folder at your project.
3. Log your project using ThunderBolt AS3 as usual or as described on its Wiki page at Google Code

Full source

To download full source of the example above just jump to ThunderBolt AS3 download list at Google Code and grab the latest ThunderBoltAS3_v2.0.zip. Within this *.zip you will find a folder examples/flex/gumbo.

Happy logging with Gumbo !

For all those who not familiar with it: ThunderBolt AS3 is a lightweight logger extension for any ActionScript 3 applications based on Flash CS3, Flex or Adobe AIR using Firebug or its own ThunderBolt AS3 Console.

Here are some tips and tricks using ThunderBolt AS3:

1. Using different log levels

   ThunderBolt AS3 supports different log levels, which based on the supported levels by Firebug, such as “info”, “warn”, “error” or “debug”. It’s pretty simple to use it:

   log level example ( Download code )

   1. import org.osflash.thunderbolt.Logger;
   2.  
   3. //
   4. // some log objects
   5. var myNumber: int = 5;
   6. var myString: String = "Lorem ipsum";
   7.  
   8. // INFO log level
   9. Logger.info ("Just an info message");
   10. //
   11. // DEBUG log level
   12. Logger.debug ("A debug log ", myString);
   13. //
   14. // WARN log level
   15. Logger.warn ("A warn message", myNumber);
   16. //
   17. // ERROR log level
   18. Logger.error ("An error log ", myString);

   Screen shot using Firebug:
   

   Screen shot using ThunderBolt AS3 Console:
   

2. Logging one or more objects at once

   ThunderBolt AS3 logs more than one objects at once. It could be primitive types (int, uint, Number, Boolean, …) or more complex data such as an instance of any classes or nested objects. Here an example:

   Example for logging few objects at once ( Download code )

   1. import org.osflash.thunderbolt.Logger;
   2.  
   3. //
   4. // some log objects
   5. var myNumber: int = 5;
   6. var myString: String = "Lorem ipsum";
   7.  
   8. var myObject: Object = {    exampleArray: ["firstValue", "secondValue"],
   9.                             y: 10,
   10.                             exampleString: "Hello",
   11.                             nestedObject: { x: 100,
   12.                                             y: 200}
   13.                         };
   14.                                                
   15. // Logging an object with nested items
   16. Logger.info ("Logging an object with nested items ", myObject);
   17. //
   18. // Logging more objects at once
   19. Logger.info ("Logging more objects at once ", myString, myNumber, myObject);

   Screen shot using Firebug:
   

   Screen shot using ThunderBolt AS3 Console:
   

3. Using the Flex Logging API

   ThunderBolt AS3 supports the Flex Logging API using its own log target called ThunderBoltTarget. To use it you will need to use and import the ThunderBoltTarget.as as well:

   Example for using Flex logging API ( Download code )

   1. import mx.logging.Log;
   2. import org.osflash.thunderbolt.ThunderBoltTarget;
   3.  
   4. // init ThunderBoltTarget
   5. _target = new ThunderBoltTarget();
   6.  
   7. /*                             
   8. You can disable the time, level or category as well                           
   9. _target.includeTime = false;
   10. _target.includeLevel = false;
   11. _target.includeCategory = false;                   
   12. */     
   13.            
   14. _target.filters = ["de.websector.playground.ThunderBoltTargetExample"];
   15. Log.addTarget(_target);
   16.  
   17. // start logging
   18. Log.getLogger("de.websector.playground.ThunderBoltTargetExample").info("Just an info message.");

   Screen shot using Firebug:
   

   Screen shot using ThunderBolt AS3 Console:
   

4. Stop and hide logging

   To release your project you might to disable all logging data. Then put the following line into your code.

   1. Logger.hide = true;
   2.  

5. Show a memory snapshot

   Make a memory snapshot whenever you want:

   1. Logger.memorySnapshot();
   2.  

6. Show or hide a time stamp

   Lets make a time stamp. The default value is “true”. To hide the time stamp use this:

   1. Logger.includeTime = false;
   2.  

7. Using the new ThunderBolt AS3 v.2.1beta v.2.0 and its Console

   The new version of ThunderBolt AS3 (v.2.1beta v.2.0) detects either Firebug is installed or not. If not, then it uses the well known trace() method to log all data into “flashlog.txt”. You can enforce this process using:

   1. Logger.console = true;
   2.  

   To show all information in a well defined structure I’d recommend to use the new ThunderBolt AS3 Console. It’s a handy tool to log any AIR application as well

8. Using the ThunderBolt AS3 Console for logging ActionScript 1 or 2 projects

   As described above ThunderBolt AS3 Console follows a simple principle: It reads just all information logged by the ThunderBolt AS3 Logger (v.2.1beta v.2.0) into “flashlog.txt” and shows it in a hierarchal order based on different log levels.

   That means you can use ThunderBolt AS3 Console for logging any AS 1 or 2 projects too . Just call a trace() method as follows. Note the prefixes named “info”, “error”, “warn” or “debug” followed by a whitespace at the beginning:

   trace() example for using ThunderBolt AS3 Console ( Download code )

   1. //
   2. // tracing an info log level
   3. trace ("info Here is an info message to display using ThunderBolt AS3 Console");
   4. //
   5. // tracing an error log level
   6. var myString: String = "hello console";
   7. trace ("error Here is an error message" + myString);
   8. //
   9. // tracing an debug log level
   10. trace ("debug Here is a debug message" + myString);
   11. //
   12. // tracing a warn log level
   13. trace ("warn Here is a warn message");

   Screen shot using ThunderBolt AS3 Console:
   

9. Any issues with the Flash Player security sandbox using Firebug?

   If you have any security issues with the Flash Player security sandbox using ThunderBolt AS3 and Firebug set within your HTML template the value of the parameter named “allowScriptAccess” to “always”. For more information check Adobes Flex 3 Help: “About ExternalInterface API security in Flex”

10. Issues using ThunderBolt AS3 Console on Windows?

    What a pretty sh…y thing: The ThunderBolt AS3 Console is currently available for OS X only. There are some issues using an opened AIR app and “flashlog.txt” at the same time on Windows. Check out this entry at Adobes AIR forum for more information. Hoping that Adobe will fix this issue in the future. So long, sorry for all the Windows user out there .

    BTW: Feel free to post here your request to Adobes AIR team as well

Open source!

ThunderBolt AS3 and its console is open source! Grab the source, change and adapt it. Or do whatever you want

Happy logging!

Features based on ThunderBolt AS3 v.1.0

• Log levels: INFO, WARN, ERROR, DEBUG (FATAL, ALL)
• Tree view for complex object structures such as class identifier and its properties
• Custom LogTarget based on Flex Logging API including filters
• Memory snapshot
• SWC components for logging using Flex 2 or Flash CS3. Only 4kB for the Flash based SWC and 24kB for Flex one using the Flex 2 Logging Framework.

For more information check the Wiki on Google Code.

Live examples

Note: Press F12 to open Firebug within Firefox to receive all logging messages.
Any questions…? What the fuck is Firebug…?

Pure Flex 2 example:

Flex 2 example using the Flex 2 Logging Framework:

Pure Flash CS3 example:

Free download

Full source of ThunderBolt AS3 including all examples and libraries as SWC’s:
ThunderBoltAS3_v1.0.zip
(Downloads: 1470)

Happy logging !

In part 1 I described a way for using ThunderBolt AS3 with the Flex 2 Logging Framework using an own log target called ThunderBoltTarget. This is a handy extension, but it has a disadvantage: The Flex 2 Logging Framework doesn’t support outputs of nested objects because the original Flex 2 Log instance uses an instance of the LogLogger which dispatches only a message of the logged object typed as String.

For this issue is better to use the ThunderBolt Logger instance directly for logging objects and its nested objects including all properties . With the latest release I have added a common way for using log levels as well. Check out the the following instructions.

Example

Screen Shot: Logging to Firebug

Instructions

1. Grab the latest ThunderBolt AS3 package (includes two classes only) from its repository via SVN on Google Code or download it directly. Make sure that you have installed Firebug as well.

2. For logging to Firebug call the ThunderBolt Logger class methods such as info, warn, error, debug. You don’t need to create an instance of Logger because all of its public methods and public properties are static.

   Code examples using ThunderBolt

   1. //
   2. // import ThunderBolt Logger
   3. import org.osflash.thunderbolt.Logger;
   4.  
   5. //
   6. // log a string as an info message
   7. var myString: String = "Lorem ipsum";
   8. Logger.info ("A simple string", myString);
   9.  
   10. //
   11. // Log two objects (or more ) as an error message
   12. var myNumber: int = 5;
   13. var myString2: String = "Lorem ipsum";
   14. Logger.error ("Two log objects: A number typed as int and a string", myNumber, myString2);
   15.  
   16. //
   17. // Log an array with a nested object as a warn message
   18. var myArray: Array = ["firstValue",{x: 100, y: 200}, "secondValue"];
   19. Logger.warn ("An array with a nested object: ", myArray);
   20.  
   21. //
   22. // Log an object with a nested array as a debug message
   23. var myObject: Object = {exampleArray: ["firstValue", "secondValue"], y: 10, exampleString: "Hello", nestedObject: {x: 100, y: 200}};
   24. Logger.debug ("An object with a nested object and nested array", o);
   25.  
   26. //
   27. // Optionally you can hide the time stamp
   28. Logger.includeTime = false;
3. That’s all – happy logging

Source

You will find the latest source of the ThunderBolt AS 3 package on Google Code too. It’s open source and based on the Mozilla Public License 1.1.

However, ThunderBolt includes now a custom target class called ThunderBoltTarget extending the Flex 2 AbstractTarget class for using default behaviors and properties of the Flex 2 Logging Framework such as filters or common log levels. For more information about custom targets check out the Flex 2 LiveDocs: “Using the Logging API“

Example

Using ThunderBoltTarget

1. Create an instance of ThunderBoltTarget

   1.  
   2. _target = new ThunderBoltTarget();
   3.  

2. Optionally you can hide the output of time, log levels and category…

   1. _target.includeTime = false;
   2. _target.includeLevel = false;
   3. _target.includeCategory = false;

3. …or filter the message using wildcards, e.g. only messages for the classes in the de.websector.* package.

   1.  
   2. _target.filters = ["de.websector.*"];
   3.  

4. Add the ThunderBoltTarget as a custom target for the Flex Log instance

   1.  
   2. Log.addTarget(_target);
   3.  

5. Call the Flex Log instance to send an info message to ThunderBolt. The getLogger() method defines a specified category, which describes an ID for mapping log messages as described above via _target.filters

   1.  
   2. Log.getLogger("de.websector.playground.ThunderBoltTargetExample").info("Just an info message.");
   3.  

6. Flex Logging Framework supports logging of multiple objects using flags such as {0}, {1}, etc. Note: The outputs of these objects are only Strings, not a complex hierarchy of all properties and methods.

   1.  
   2. Log.getLogger("de.websector.playground.ThunderBoltTargetExample").error("Calling two objects, a number named myNumber and a array called myArray: {0}, {1}", myNumber, myArray);
   3.  

7. All code of the example above.

   ThunderBoltTargetExample.mxml ( Download code )

   1. <?xml version="1.0" encoding="utf-8"?>
   2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
   3.     initialize="initializeHandler( )">
   4.  
   5.     <mx:Script>
   6.         <![CDATA[
   7.             import org.osflash.thunderbolt.Logger;
   8.             import flash.events.Event;
   9.            
   10.             private function traceToFirebug(event:Event):void 
   11.             {
   12.                 var myNumber: int = 5;
   13.                 var myString: String = "Lorem ipsum";
   14.                 var myArray: Array = ["firstValue",{x: 100, y: 200}, "secondValue"];
   15.                
   16.                 var label: String = event.target.label;
   17.            
   18.                 switch (label)
   19.                 {
   20.                     case "info":
   21.                         Log.getLogger("de.websector.playground.ThunderBoltTargetExample").info("Just an info message.");
   22.                     break;
   23.                     case "warn":
   24.                         Log.getLogger("de.websector.playground.ThunderBoltTargetExample").warn("Here is the value of the String named myString: {0}", myString);
   25.                     break;
   26.                     case "error":
   27.                         Log.getLogger("de.websector.playground.ThunderBoltTargetExample").error("Calling two objects, a number myNumber and a nested array called myArray: {0}, {1}", myNumber, myArray);
   28.                     break;
   29.                     case "debug":
   30.                         Log.getLogger("de.websector.playground.ThunderBoltTargetExample").debug("Just a info message.");
   31.                     break;
   32.                     default:
   33.  
   34.                 }
   35.             }
   36.  
   37.             import mx.logging.Log;
   38.             import org.osflash.thunderbolt.ThunderBoltTarget;
   39.            
   40.             private var _target: ThunderBoltTarget;
   41.            
   42.             private function initializeHandler( ):void
   43.             {
   44.                 _target = new ThunderBoltTarget();
   45.                 /*
   46.                 You can disable the time, level or category as follow            
   47.                 _target.includeTime = false;
   48.                 _target.includeLevel = false;
   49.                 _target.includeCategory = false;                
   50.                 */              
   51.                 _target.filters = ["de.websector.playground.ThunderBoltTargetExample"];
   52.                 Log.addTarget(_target);
   53.             }
   54.            
   55.            
   56.             private function getFireBug( ):void
   57.             {
   58.                 var url:URLRequest = new URLRequest( "http://www.getfirebug.com/" );
   59.                 navigateToURL( url );
   60.             }
   61.        
   62.       ]]>
   63.     </mx:Script>
   64.     <mx:Style source="css/logger.css"/>
   65.     <mx:Text htmlText="Using ThunderBoltTarget based on the Flex 2.0 Logging Framework"  paddingBottom="15" />
   66.     <mx:HBox horizontalGap="10">
   67.          <mx:Button label="info"
   68.                     click="traceToFirebug(event);" id="infoButton" width="100" height="50"/>
   69.          <mx:Button label="warn"
   70.                     click="traceToFirebug(event);" id="warnButton" width="100" height="50"/>
   71.          <mx:Button label="error"
   72.                     click="traceToFirebug(event);" id="errorButton" width="100" height="50"/>      
   73.          <mx:Button label="debug"
   74.                     click="traceToFirebug(event);" id="logButton" width="100" height="50"/>
   75.     </mx:HBox>    
   76.     <mx:Text htmlText="Press F12 to open Firebug"
   77.             paddingTop="15" paddingBottom="5"/>
   78.     <mx:LinkButton label="(Who the fuck is Firebug?)" id="getFirebug" click="getFireBug();" />
   79. </mx:Application>

Source

You’ll find the latest source of ThunderBolt, its custom target called ThunderBoldTarget.as and all examples on Google Code or check it out via SVN.

I’ve already joined the Flash-Thunderbolt project for coding an AS3 version. It won’t be a copy of the current AS2 package but rather another approach for using Firebugs Console API as simple as possible. Check it out, here are my first steps:

Example

Instructions

The ThunderBolt AS3 package contains only one class named Logger.as. It supports logging primitive types such as Number, String, Boolean, etc. as well as Objects, Arrays and public properties of all classes. Use short cuts for determing different log levels as Zeroi does: “i” = info, “e” = error, “w” = warn, “d” = debug.

Here is an example:

Source

First of all: Feel free to check out the latest source via SVN .

Feedback

Feedback and suggestions for improvement are welcome If you’d like to join the Flash-ThunderBolt project just drop me an email or feel free to post a comment.