Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Hanti

Preload site with the first content

Recommended Posts

Hello!

I have a swf "main.swf" with four button that loads four external swf. 

When I open "main.swf" load the first swf "home.swf" 

import com.greensock.*;
import com.greensock.loading.SWFLoader;
import com.greensock.events.LoaderEvent;
import flash.events.MouseEvent;


var loader:SWFLoader = new SWFLoader("home.swf",{onInit:initHandler, onProgress:progressHandler, onComplete:completeHandler, container:this});
var swf = new Array(home,about,contact,works);


for (var i:int=0; i<swf.length; i++) {
swf[i].addEventListener(MouseEvent.CLICK, openSwf);
}


function openSwf(e:MouseEvent): void{
var newURL:String = e.target.name + ".swf";
loader.url = newURL;
loader.load(true); // reload SWFLoader and flush/unload old content
}

function initHandler(event:LoaderEvent):void {
//fade the swf in as soon as it inits
TweenLite.from(event.target.content, 1, {alpha:0});
}


function progressHandler(event:LoaderEvent):void {
progress_mc.progressBar_mc.scaleX = event.target.progress;
trace("progress: " + event.target.progress);
}

function completeHandler(event:LoaderEvent):void {
trace(event.target + " is complete!");
TweenLite.to(progress_mc.progressBar_mc, 1, {alpha:0});
}

//load the first swf 
loader.load();

I would like to write a code to preload my site and at the same time the first content (Home.swf) in a different total progress bar for for example "total_bar". I suppose that should be used a queue:LoaderMax and append all I want to load...is that right?

 

But I should do it on main.swf or should I create another swf file (for example index.swf) that loads the main.swf and home.swf?

 

Thanks for your help and sorry for my english!  :-P

 

 

Link to comment
Share on other sites

Yes, you should use LoaderMax to create a queue of SWFLoaders. 

When your app starts out only have the home.swf in the queue of loaders and then once home.swf is loaded you can append all the other loaders to the LoaderMax. This way as home.swf is loading its progress will represent the total progress of the LoaderMax (since it is the only thing in the LoaderMax).

 

Once its done loading, you add more loaders, tell the LoaderMax to load() again and then your progress bar will represent the loading of the new loaders.

Link to comment
Share on other sites

Hi Carl, thanks for your help!  :-P

I'm sorry but maybe I did not understand, I should do it on main.swf or should I create another swf file (for example index.swf) that loads the main.swf and home.swf?

 

I would like to load main.swf and home.swf on a different progress bar from "progress_mc"...

 

 

This is what I would do:

flow.jpg

 

Do you show me an example?

Thanks for your time Carl!

Link to comment
Share on other sites

I don't think you need another index.swf to hold main and all the others.

 

Main.swf can create a LoaderMax that has 2 loaders in it

 

1: SelfLoader to monitor the loading of main.swf

2: SWFLoader to monitor the loading home.swf

 

Check the SelfLoader docs here:

http://api.greensock.com/as/com/greensock/loading/SelfLoader.html

 

The docs contain code that should show you exactly how to load main.swf and home.swf

 

So once those 2 files are loaded you can then hide your totalProgress bar and then I imagine you will just load the other swfs via individual SWFLoaders when the user clicks the various buttons.

Link to comment
Share on other sites

Hi Carl and thanks again for your help!

I have rewritten the code with SelfLoader but I know you can do better...

 

I would like to ask you a few things:

 

- When I click on a button I unload the queue of LoaderMax, is the right thing to do?

- Why the total_bar seems to start loading from the middle of the line? Is there a way to have a more linear animation?

- Why I receive "progress: 0" when I click on a button? This is contained in progressHandler() and not in child_progressHandler()

 

This is a files link: http://we.tl/RshuyeKD0F

 

Thanks!  :-P

package  {
	
	import flash.display.MovieClip;
	import flash.events.*;
	import flash.display.*;
	import com.greensock.loading.*;
        import com.greensock.events.LoaderEvent;
	
	
	public class main extends MovieClip {
		
		var queue:LoaderMax = new LoaderMax({name:"mainQueue", onInit:initHandler, onProgress:progressHandler, onComplete:completeHandler});

		var loader_child:SWFLoader = new SWFLoader("",{onInit:child_initHandler, onProgress:child_progressHandler, onComplete:child_completeHandler,  container:this, x:100, y:50});
		
		public function main() {
			// constructor code
			init_totalLoader();
			
			var swf:Array = new Array(works,about,contact,home);
			for (var i:int=0; i<swf.length; i++) {
                        swf[i].addEventListener(MouseEvent.CLICK, openSwf);
			swf[i].visible=false;
            }
			
			child_bar.visible=false;
		}
		
		
		public function init_totalLoader() {
			 
             //append the SelfLoader and several other loaders
			 var loader:SelfLoader = new SelfLoader(this, {name:"self"});
             queue.append( loader );
             queue.append( new SWFLoader("swf/home.swf", {name:"home", container:this, x:100, y:50}) );
             //start loading the LoaderMax queue
             queue.load()
			 
		}
		

		
		
		function openSwf(e:MouseEvent): void{
			
             var newURL:String = "swf/" + e.target.name + ".swf";
             loader_child.url = newURL;
             loader_child.load(true); // reload SWFLoader and flush/unload old content
        }
		
		
		
		///////////////////TOTAL LOADER FUNCTIONS///////////////////////////
		 
        public function initHandler(event:LoaderEvent):void {
			
		total_bar.visible=true;
		
        }
		
		
        public function progressHandler(event:LoaderEvent):void {
		
		percent.text=String(Math.floor(event.target.progress*100))+"%";
	    total_bar.totalprogress.scaleX = event.target.progress;
        trace("progress: " + event.target.progress);
		
        }
		
		
		public function completeHandler(event:LoaderEvent):void {
			
         trace(event.target + " is complete!");
		 percent.visible=false;
		 child_bar.visible=true;
		 total_bar.visible=false;
		 home.visible=true;
		 works.visible=true;
	     contact.visible=true;
		 about.visible=true;
		 
        }
		
		
		
		///////////////////CHILD LOADER FUNCTIONS///////////////////////////
		 
        public function child_initHandler(event:LoaderEvent):void {
			
			queue.unload()
        
        }
		
		 
        public function child_progressHandler(event:LoaderEvent):void {
			
		child_bar.childprogress.scaleX = event.target.progress;
		
        }
		
		public function child_completeHandler(event:LoaderEvent):void {
			
			
        }
		
	}
	
}

Link to comment
Share on other sites

First, thanks for providing the files, very helpful.

Oddly enough I can not at the moment explain why the queue's onProgress is firing when you try to load loader_child. It is very strange. I will have to look into this further with a rested head.

 

---

 

- When I click on a button I unload the queue of LoaderMax, is the right thing to do?

 

 

I don't think it should be necessary, but it seems if I remove the code that queue.unload(), the other swfs don't load. This again seems odd as your loader_child should have no relation to the queue.

 

- Why the total_bar seems to start loading from the middle of the line? Is there a way to have a more linear animation?

 

 

I wasn't able to see this behavior as everything loaded super fast, but this isn't all that odd. The issue is that the progress bar can't even display until all the code (and external LoaderMax code) is loaded. All your filesize that needs to load is on frame1 of main.fla. So what is happening is that your SelfLoader is virtually complete before the progress bar even shows up. Typically SelfLoader works best when the swf that is self loading has very little code and assets on frame 1 and lots of heavy stuff in subsequent frames (usually dumped on frame2). In such a setup the load progress will be very small once frame 1 renders the progress bar and then as the heavier assets load you get a very smooth loading progress. 

 

As a test, place a very large image (500kb) on frame 2, and a stop() action on frame1, this will give you better results than your light-weight test files. 

 

 

--

 

I will do my best to give you better answers for the odd behavior tomorrow

Link to comment
Share on other sites

 

I don't think it should be necessary, but it seems if I remove the code that queue.unload(), the other swfs don't load. This again seems odd as your loader_child should have no relation to the queue.

 

If you remove the code that queue.unload(), the other swfs are loaded but they are behind the home.swf (loaded via LoaderMax). If you change x of loader_child to 120 you can see them.

 

I wait for your news! Thanks Carl!  :-P

Link to comment
Share on other sites

Ah, thank you, Hanti. Glad to know the swfs were still loading, just hidden. 

 

It seems now the remaining issue is figuring out why the child_loaders were causing the queue's progress to fire and report 0.

Link to comment
Share on other sites

ah, a little feature I wasn't quite sure of.

 

When you unload() the LoaderMax it actually effects the progress() (sets it to 0) which is why the onProgress is firing. As items are unloaded from the LoaderMax the progress is changing. So the issue you were having wasn't a bug.

 

Please try this slightly revised code which should help you not have to unload the LoaderMax multiple times and will always unload() the currently visible swf:

 

package  {


import flash.display.MovieClip;
import flash.events.*;
import flash.display.*;
import com.greensock.loading.*;
    import com.greensock.events.LoaderEvent;




public class main extends MovieClip {


var queue:LoaderMax = new LoaderMax({name:"mainQueue", onInit:initHandler, onProgress:progressHandler, onComplete:completeHandler});
//loader_child never gets added to queue, yet when loader_child loads, queue's onProgress will fire as evidenced in traces.
var loader_child:SWFLoader = new SWFLoader("some.swf",{onInit:child_initHandler, onProgress:child_progressHandler, onComplete:child_completeHandler,  container:this, x:100, y:50});


var currentChild:SWFLoader;


public function main() {
// constructor code
init_totalLoader();


var swf:Array = new Array(works,about,contact,home);
for (var i:int=0; i<swf.length; i++) {
            swf[i].addEventListener(MouseEvent.CLICK, openSwf);
swf[i].visible=false;
            }


child_bar.visible=false;




}




public function unloadIt(e:MouseEvent): void{
queue.unload();
}


public function init_totalLoader() {


             //append the SelfLoader and several other loaders
var loader:SelfLoader = new SelfLoader(this, {name:"self"});
             //queue.append( loader );
             queue.append( new SWFLoader("swf/home.swf", {name:"home", container:this, x:100, y:50}) );
             //start loading the LoaderMax queue


currentChild = LoaderMax.getLoader("home");


             queue.load()


}








function openSwf(e:MouseEvent): void{
currentChild.unload();
currentChild = loader_child;
             var newURL:String = "swf/" + e.target.name + ".swf";
             loader_child.url = newURL;
             loader_child.load(); // reload SWFLoader and flush/unload old content


        }






///////////////////TOTAL LOADER FUNCTIONS///////////////////////////


        public function initHandler(event:LoaderEvent):void {


total_bar.visible=true;


        }




        public function progressHandler(event:LoaderEvent):void {
percent.text=String(Math.floor(event.target.progress*100))+"%";
    total_bar.totalprogress.scaleX = event.target.progress;
         trace("LoaderMax onProgress Firing and progress = : " + event.target.progress);


        }




public function completeHandler(event:LoaderEvent):void {


         trace(event.target + " is complete!");
percent.visible=false;
child_bar.visible=true;
total_bar.visible=false;
home.visible=true;
works.visible=true;
    contact.visible=true;
about.visible=true;


        }






///////////////////CHILD LOADER FUNCTIONS///////////////////////////


        public function child_initHandler(event:LoaderEvent):void {


        
        }




        public function child_progressHandler(event:LoaderEvent):void {


child_bar.childprogress.scaleX = event.target.progress;


        }


public function child_completeHandler(event:LoaderEvent):void {




        }








}


}
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×