Today I came across an annoying issue with a CS3 file that I had edited a month ago. I was required to make simple edits so I re-opened the fla file. It crashed every time I tried publishing, saving or simply viewing the action tab and could not figure out why. After hours of debugging I finally fixed the problem by simply copying it from the network to my desktop. Basically every time I tried opening the fla file from the network it crashed. I don't have an exact reason why this is happening because other files work fine, however this is the solution to fix it.

Flashnutz News bug, fla crashes

We are going to explore how to build a preloader in as3.  Before building the preloader you will need to understand how to load external images/data with ActionScript 3.

If you read the loading external images post you will know that the image was loaded into the contentLoaderInfo property of the Loader object. This is what the code looks like.

var imgLoader:Loader =  new Loader();
imgLoader.contentLoaderInfo.addEventListner(Event.COMPLETE,
loaderCompleteHandler);
 
function loaderCompleteHandler(e:Event):void{
trace('Image has loaded.');
}
 
imgLoader.load(new URLRequest('image.jpg'));

To monitor the loading progress of this externally loaded image we need to use the LoaderInfo object which is a package of information about the load that is passed to the event listener of contentLoaderInfo. The properties of the LoaderInfo class along with the event object will provide all the information needed to build our preloader.

The available properties of the LoaderInfo class are:

• bytesLoaded
• bytesTotal
• content
• frameRate
• height
• width
• loader

The available event types of the LoaderInfo class are:

• COMPLETE
• INIT
• PROGRESS
• UNLOAD

From the event types above we need to use the PROGRESS event type like the following.

imgLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, preloaderHandler);

Then to display the bytes being loaded we need to use the bytesLoaded and bytesTotal properties, and trace them when the function preloaderHandler is triggered. If you divide the 2 and multiply by 100 you will get the percentage loaded.

function preloaderhandler(e:ProgressEvent):void{
trace('bytesLoaded:  ' + e.bytesLoaded);
trace('bytesTotal:  ' + e.bytesTotal);
trace('percentage loaded:  ' +
Math.round((e.bytesLoaded/e.bytesTotal)*100) + "%");
}

The complete source code looks like this.

var imgLoader:Loader =  new Loader();
imgLoader.contentLoaderInfo.addEventListner(Event.COMPLETE,
loaderCompleteHandler);
imgLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,
preloaderHandler);
 
function loaderCompleteHandler(e:Event):void{
trace('Image has loaded.');
}
 
function preloaderhandler(e:ProgressEvent):void{
trace('bytesLoaded:  ' + e.bytesLoaded);
trace('bytesTotal:  ' + e.bytesTotal);
trace('percentage loaded:  ' +
Math.round((e.bytesLoaded/e.bytesTotal)*100) + "%");
}
 
imgLoader.load(new URLRequest('image.jpg'));

Enjoy. I'll write a post soon on how to integrate this preloader script with a simple animation.

Flashnutz ActionScript 3.0 contentLoaderInfo, LoaderInfo, preloader

Yesterday I posted how the Date class worked in ActionScript 3.  Today I though I would build a simple clock application using the Date class.

Building the clock app involves using the Date class in a couple of ways. The Date class returns the current date and time of when the method is called and only once per object created. Basically the example I gave in my previous Date class post performed this once.

To have our clock continually roll through the time and date, a new Date object must be created and the methods of the Date class that return the date and time properties must be called at regular intervals to display the changing time. To create our clock application, we will use the Timer class.

The following code will create a TextField object to display the time and a Timer object that updates every 1/10th of a second in the updateTime() event handler for the Timer event of the Timer class.

When the updateTime() event handler is called on each TIMER event, a new Date object and a new variable for the time are created, concatenated, and set as the text property for myDisplay.

A new Date object needs to be created each time because the Date class stores only the time and date values for the time in which the object was created.

Alright.. Let's get into the code..

var myDisplay:TextField = new TextField();
var myTimer:Timer = new Timer(100);
 
myTimer.addEventListener(TimerEvent.TIMER, updateTime);
 
function updateTime(evt:TimerEvent):void{
 
var localDate:Date = new Date();
var hour:int = localDate.getHours();
var minute:String;
var second:String;
 
/* Note that if the second and minute
values are less than 10 we add a 0 to the
single digit */
 
if(localDate.getMinutes()<10){
	minute = String(0)+localDate.getMinutes();
}else{
	minute = String(localDate.getMinutes());
}
 
if(localDate.getSeconds()<10){
	second = String(0)+localDate.getSeconds();
}else{
	second = String(localDate.getSeconds());
}
 
myDisplay.text = hour+':'+minute+':'+second;
 
}
 
myTimer.start();
addChild(myDisplay);

Hope this helps ...  Peace...

Flashnutz ActionScript 3.0 Date class, Date Object, Textfield object, Timer class, Timer object

The Date class will allow you to check the current date and time on a user's computer. You'll find this class valuable when developing widgets like an event count down clock. To work with the Date class, you must instantiate a Date object:

var myDate:Date = new Date();
trace(myDate);

When the Date object has been built, you can call methods or get properties of the Date class to get date and time values:

var myDate:Date = new Date();
trace(myDate.getDate());

The getDate() method gets the current day of the month.

The getMonth() method gets the month of the year as a number value. Numeric references to the current month are not the normal month numbers we are used to working with.

For example, January is equal to 0 and December is equal to 11. For display reasons, always add 1 to the returned month number to get the true calendar month value.

Available methods for getting Time and Date properties of the Date class are:

• getDate();
• getDay();
• getFullYear();
• getHours();
• getMilliseconds();
• getMinutes();
• getMonth();
• getSeconds();

Note: For a full description of each method search "date class" via the Flash help menu.

Easy.. now get fancy with it and tell us what you created..

Flashnutz ActionScript 3.0 actionscript, ActionScript 3.0, Date class, Date Object

I was trying to install Ghostscript on my MediaTemple (mt) Linux server but I kept getting the following error:

tar: This does not look like a tar archive
tar: Skipping to next header
tar: Archive contains obsolescent base-64 headers
tar: Error exit delayed from previous errors

The quick fix around this is to type the following:

gzip -d filename.tar.gz

and then

tar -xf filename.tar

This should extract the file without errors.

Peace

Flashnutz Linux ghostscript

One technique of loading external images is using the Loader class. It's similar to the URLLoader class but the Loader class loads and displays loaded images and SWF content. The Loader class is a part of the DisplayObject class; it is capable of displaying content as well as loading it.

To load external images using the Loader class, you need to create an object of the Loader class.

var imgLoader:Loader = new Loader();

To load an image into the Loader Object, the load method of the Loader class is used, along with a URLRequest.

var imgLoader:Loader = new Loader();
imgLoader.load(new URLRequest('image.jpg'));

The LoaderInfo class also has events and event types that dispatch information about the progress of the load through the Loader class.

The code below traces a loaded message after the loader object has completed loading the image.

var imgLoader:Loader =  new Loader();
imgLoader.contentLoaderInfo.addEventListner(Event.COMPLETE,loaderCompleteHandler);
 
function loaderCompleteHandler(e:Event):void{
   trace('Image has loaded.');
}
 
imgLoader.load(new URLRequest('image.jpg'));

At this point all you have done is loaded in the image to the Loader Object. For the loaded image to display you will need to add the Loader object to the display list.

addChild(imgLoader);

The complete source code looks like this.

var imgLoader:Loader =  new Loader();
imgLoader.contentLoaderInfo.addEventListner(Event.COMPLETE,loaderCompleteHandler);
 
function loaderCompleteHandler(e:Event):void{
   trace('Image has loaded.');
   addChild(imgLoader);
}
 
imgLoader.load(new URLRequest('image.jpg'));

hope this helps...

Flashnutz ActionScript 3.0 DisplayObject, Loader, LoaderInfo, URLLoader, URLRequest

Until now Flash sites have not ranked well with search engines because they could not index them. For web developers or SEO specialists, this meant extra work.

In a press release on Tuesday Adobe announced that it was working with both Yahoo! and Google to enable indexing of Flash files. The project will enable searches on Flash content to return text and links, which can then be indexed. Better still, current Flash content will be immediately searchable by search engines, without alteration.

David Wadhwani, general manager and vice president of the Platform Business Unit at Adobe said:

Until now it has been extremely challenging to search the millions of RIAs (rich Internet applications) and dynamic content on the Web, so we are leading the charge in improving search of content that runs in Adobe Flash Player. We are initially working with Google and Yahoo! to significantly improve search of this rich content on the Web, and we intend to broaden the availability of this capability to benefit all content publishers, developers and end users.

Of course, all this assumes that the search engine has the Flash tech working: Google is rolling out Flash search today, but Yahoo! said it was going to enable the feature in a later release of its search engine and that it was “working with Adobe to determine the best possible implementation.” And no, Microsoft wasn’t mentioned at all.

However, Adobe’s statement does indicate Adobe will work with other search engines as well. With Microsoft having its Flash competitor, Silverlight, however, I’m wondering if that will slow things down between the two companies.

Flashnutz News ActionScript 3.0, Adobe, content publishers, search engines, SEO

Flashnutz ActionScript 2.0, ActionScript 3.0, News ActionScript 2.0, ActionScript 3.0, Flash 10, Flash 9, Flash Player

The dotted lines that appear around links is an accessibility feature for people who can't use a mouse and are forced to use a keyboard to navigate. It works well when you use the tab key but it still shows when you are using a mouse.

If your working on government sites that need w3c compliance then I would not recommend removing this feature, otherwise use the CSS code below.

a {
      /* Mozilla */
	outline:none;
 
	/* IE */
	-moz-outline-style: none;
   }

You could get fancy and use the dotted line to your advantage. With CSS you can change the dotted line type to solid or change its colour to suit the design.

Good Luck!

Flashnutz CSS Cascading Style Sheets, CSS

Adobe have announced that Flash 10 will be making it's way to the Android platform by the end of the year. In an announced at the Mobile World Congress event in Barcelona, Adobe revealed that they plan to release their first full-fledged Flash multimedia player for smartphones by the end of 2009.

"We've made a lot of progress, but there is still a lot of engineering work to be done," said Anup Murarka, director of partner development and technology strategy for Adobe's platform business unit.

Adobe are expected to demonstrate the Flash Player 10 for smartphones beta during the Mobile World Congress event.

Flashnutz News Adobe, Android, flash, Flash 10