Skip to content


Extending BulkLoader – Throwing an event when an item is downloaded

A while ago, I needed something that could load a LOT of images at a short times notice without Flash crashing or stopping in the middle of the queue without reason, like what happens if you loop a Loader 500 times.

Then I found BulkLoader…
It was all I needed, but then the client wanted the image added to the stage at the moment it was downloaded, this is not build in the BulkLoaders classes, so I extended those.

Here is how I did it.

Getting started

We are going to extend the BulkLoader classes so it throws an event when a single download has finished.
To do this, get the latest version of BulkLoader at Google Code.

Unpack the zipped file, and open up the BulkLoader.as and BulkProgressEvent.as in the br.com.stimuli.loading package.

BulkLoader.as

Let’s start with adding an event constant name with the global variables:

public static const ITEMLOADED : String = "item_loaded";

You may insert it under the line (178):

public static const COMPLETE : String = "complete";

Next scroll down to the function _onItemComplete (line 801).
At the bottom of that function you should see the following if-statement:

 if(allDone) {
    _onAllLoaded();
}

replace it with:

var eItemL : BulkProgressEvent = new BulkProgressEvent(ITEMLOADED,item);
eItemL.setInfo(bytesLoaded, bytesTotal, bytesTotalCurrent, _itemsLoaded, itemsTotal, weightPercent);
dispatchEvent(eItemL);
 
if (allDone) {
      _onAllLoaded();
 }

What did we do here?
We’re creating an instance of a BulkProgressEvent and add relevant information to it.
Next we’re going to dispatch it everytime this function is called.
As you can see, we’ve given the constructor another new parameter, the loaded item, we wil have to extend the BulkProgressEvent.

BulkProgressEvent.as

Start with adding a constant, a new name for a new kind of Event, an ITEMLOADED event, you can do that under line 52:

public static const ITEMLOADED : String = "item_loaded";

Next, create an new public variable (or an private one and make it a property by adding a getter & a setter), named lastLoadedItem (under line 70 for example):

public var lastLoadedItem:LoadingItem;

Now we are going to change the BulkProgressEvents constructor by adding a new parameter. Insert llItem:LoadingItem=null after the name parameter so the constructor looks like this:

public function BulkProgressEvent( name : String,llItem:LoadingItem=null, bubbles:Boolean=true, cancelable:Boolean=false ){

We gave it the default value null so we don’t have to change other code from the rest of the project.

Don’t forget to import LoadingItem

import br.com.stimuli.loading.loadingtypes.LoadingItem;

In the constructor, under the line

this.name = name;

add

this.lastLoadedItem = llItem;

Change in the clone function the line:

var b : BulkProgressEvent = new BulkProgressEvent(name, bubbles, cancelable)

to:

var b : BulkProgressEvent = new BulkProgressEvent(name, lastLoadedItem, bubbles, cancelable)

And you’re done!
Now you can add an new eventlistener to you BulkLoader instance and capture every new loaded item.

Usage


Just add another listener to the BulkLoader instance to listen for the ITEMLOADED event.
You can retrieve your last loaded item in the function you assigned to that ITEMLOADED event by calling that public variable/property lastLoadedItem.

var loader: BulkLoader = new BulkLoader("galleryLoader")
loader.addEventListener(BulkLoader.COMPLETE,bloaderComplete)
loader.addEventListener(BulkLoader. ITEMLOADED, itemComplete)
 
private function itemComplete(e:BulkProgressEvent):void{
	trace("lastLoadedItem:" + e.lastLoadedItem)
}

Download

Here is a download, adjusted version of BulkLoader r239: download.

What is BulkLoader?

BulkLoader is a minimal library written in Actionscript 3 (AS3) that aims to make loading and managing complex loading requirements easier and faster. BulkLoader takes a more dynamic, less architecture heavy aproach. Few imports and making heavy use of AS3’s dynamic capabilities, BulkLoader has a one-liner feel that doesn’t get in your way.

BulkLoader tries to hide the complexity of loading different data types in AS3 and provides a unified interface for loading, accessing and events notification for different types of content.

This library is licensed under an open source MIT license. Features:

  • Connection pooling.
  • Unified interface for different loading types.
  • Unified progress notification.
  • Events for individual items and as groups.
  • Priority
  • Stop and resuming individually as well as in bulk.
  • Cache management.
  • Statistics about loading (latency, speed, average speed).
  • Various kinds on progress indication: ratio (items loaded / items to load), bytes , and weighted percentage.
  • Configurable number of retries.
  • Configurable logging.
  • Various assest types (XML, NetStreams, Swfs, Images, Sound, Text Files)

Design goals:

  • Minimal imports.
  • Few method to learn.
  • Consistent interface, regardless of content type.

BulkLoader tries to gracefully handle progress notification in these use cases:

  • Few connections to open: bytes total can be used instantly.
  • Many connections opened: progress by ratio
  • Many connections opened for data of widely varying sizes: progress by weight.

Posted in AIR, AS3, bulkloader, Flash, Flex.

Tagged with , , .


11 Responses

Stay in touch with the conversation, subscribe to the RSS feed for comments on this post.

  1. Ryan Mac says

    Nice tutorial, saved me some time.

    Don’t forget to import br.com.stimuli.loading.loadingtypes.LoadingItem;

    and replace to this to overriden clone function around line 100 on BulkProgressEvent.as:
    var b : BulkProgressEvent = new BulkProgressEvent(name, lastLoadedItem, bubbles, cancelable)

    Laters


    Thx for the corrections, added them to the post.

  2. Okan says

    Thanks,

    it’s working very well… But the adjusted versions are the original files of bulkloader. I’ve followed your tutorial and changed them…

  3. Joao says

    Great work, please help me in this case.
    How do i know what’s the progress of a file that is loading. For example, i have loader.add(“image1.jpg”,{id:”0″});
    loader.add(“image2.jpg”,{id:”1″});
    loader.add(“image3.jpg”,{id:”2″});
    loader.add(“image4.jpg”,{id:”3″});

    i know what was the id of the last item loaded, but how do i know what’s the progress of a loading item?

    Thank you in advance.
    Great work btw.

  4. Joris Timmerman says

    I’m afraid it’s only possible to know the total progress (bytes or percentage)
    or how many of total items where loaded.
    You also have weighted progress, the progress in comparison of the total weight of the download queue (filesize).
    Hope I could help!

  5. Arthur Debert says

    Hi Joris.

    Thanks for the write up!
    BulkLoader already dispatches events for an individual item, no need to extend it! You can just say:

    bulkLoader.add(“image.jpg”).addEventListener(Event.Complete, onItemLoaded, false);

    and then:

    function onItemComplete(e:Event) : void{
    addChild(e.target.content);
    }

    This is well documented at http://code.google.com/p/bulk-loader/wiki/HowToUseEvents

    Cheers
    Arthur Debert

  6. Alvaro Quezada says

    Thanks a lot for your last reply… saving … I trying to figure out how to display de jpg recently loaded… one by one…

  7. fajerwerki says

    I just want to tell you that your blog is very interesting, bookmarked

  8. RA says

    how to get image size before loading complete…i want to get image width and height without waiting to download all the image….i tried Event.INIT and EVENT.OPEN , nothing works for me….is there any solution for it ?

    Thank you ,

  9. RA says

    Solution : If you are using the bulkloader , you have to make another loader within flash library like v
    var largeLoader:Loader= new Loader();
    var req:URLRequest= new URLRequest(str2);
    largeLoader.contentLoaderInfo.addEventListener(Event.INIT,onLargeItemInit1);

    and than in the function you will trace(evt.target.content.width )

  10. Didzis says

    feature – to get individual items as they have done loading is so self-evident. could not belive it was not implemented in BulkLoader (great code otherwise) as it is. I was about to append bulk loaders code by my self, but You saved my time! ty, ty, ty!

Continuing the Discussion

  1. Anonymous linked to this post on May 21, 2010

    […] […]



Some HTML is OK

or, reply to this post via trackback.