Targeting Instances w/ Functions

[jwopitz]

Hi,

I am trying to dynamically load & format jpgs into emptyMCs using the MovieClipLoader commands:

var myMCL = new MovieClipLoader();
myMCL.onLoadInit = function(targetMC) {
targetMC._width = 80;
targetMC._height = 90;
targetMC._alpha = 30;
}
myMCL.loadClip("image1.jpg", "_root.myMC1");
myMCL.loadClip("image2.jpg ", "_root.myMC2");

The above code runs successfully. (btw, thanks to ActionScript.org and the user who provided the code above)
Now what I would like to do is write a script such as an _alphaAdjust script where:

on(rollOver){
_root.myMC#._alpha += 2;
}
on(rollOut){
_root.myMC#._alpha -= 2;
}

I am not sure if I should be using the onEvent handlers since those are reserved for buttons but that is another story in itself (like should I inherit another class' properties?).

Really what I would like to know is how do I write a function that can be applied to multiple instance without cutting & pasting to each instance?

[johnnystorm]

Its been my experience that when loading images or swf files that its best to create an empty movieclip and load the file into there. I've noticed that there is some difficulty in controling the mc that has content loaded into it.

so:
var myMCL = new MovieClipLoader();
myMCL.onLoadInit = function(targetMC) {
targetMC._width = 80;
targetMC._height = 90;
targetMC._alpha = 30;
}
_root.myMC1.createEmptyMovieClip("loader", 5);
myMCL.loadClip("image1.jpg", "_root.myMC1.loader");
_root.myMC2.createEmptyMovieClip("loader", 5);
myMCL.loadClip("image2.jpg ", "_root.myMC2.loader");

[sleekdigital]

Really what I would like to know is how do I write a function that can be applied to multiple instance without cutting & pasting to each instance

The two choices I would consider would be 1. creating a movieclip subclass or 2. Creating a class that includes a movieclip by composition. Then define onRollover, onRollout or whatever handlers you want in that class. I like to use composition, and for example if you created a clip and stored a reference to it in a property "content" you would do something like...

content.onRollOver = function() {
//do whatever
}

Then in every instance you create, the "content" clip would have that handler defined as such.

[jwopitz]

Thanks Sleek, I think this is the avenue I want to take because this is the second time that a major project could benefit from this.

When you say "includes a movieClip by composition" do you mean I am extending the movieClip methods into the new Class that I am creating?

Also if I am thinking in the correct line, can I use both movieClip, Button and MovieClipLoader methods in this new class that I am creating?

The only thing I have read is to use something like:

class MyNewComboClass extends MovieClip {
} //or maybe that should be visa versa


Is this what you are meaning? Thanks for the lead Sleek!

[sleekdigital]

When you say "includes a movieClip by composition" do you mean I am extending the movieClip methods into the new Class that I am creating?

No, I mean use composition as an alternative to extending the movieclip class. It simply means you store a reference to a movieclip as a property in your class. I oftenr set the property value to the return value of an attachMovie call or createEmptyMovieClip call.

-s

[jwopitz]

Sorry Sleek, I am so lost. Do you know of a good source where I can learn about what you speak of? I tried searching on it but am not sure how to word the search. I searched for "create class movieClip composition" on google and found some unrelated things.

[jwopitz]

actually I found a compromise (though I would really like to explore your method). Basically this is what I have comeup with in the mean time. It is a little inconsitent when fading in and out but I am trying to figure that one out:

//dynamically loading images into appropriate MCs
var myMCL = new MovieClipLoader();
myMCL.onLoadInit = function(targetMC) {
targetMC._width = 80;
targetMC._height = 90;
targetMC._alpha = 30;
};
myMCL.loadClip("image1.jpg", "_root.myMC1");
myMCL.loadClip("image2.jpg ", "_root.myMC2");
//making fade functions
fadeIn = function (targetMC) {
targetMC.onEnterFrame = function() {
targetMC._alpha += spd;
};
};
fadeOut = function (targetMC) {
targetMC.onEnterFrame = function() {
targetMC._alpha -= spd*2;
};
};
//this is what I have on the two corresponding buttons, b1 controls myMC1, b2 - myMC2
on(rollOver){
fadeIn(myMC1);
}
on(rollOut){
fadeOut(myMC1);
}

[sleekdigital]

I did not test this, but hopefully it will get the concept across. I'll explain more later if needed.


class someNameSpace.Fader
{
private var content:MovieClip;
private var loader:MovieClipLoader;
private var contentLoaded:Boolean;
private var w:Number;
private var h:Number;
private var alpha:Number;

// name: the instance name to give the content movieclip
// target: the movieclip to put the content clip into
// assetURL: url of the file to load into the content clip
// I bet you can figure out the rest :)
public function Fader(name:String, target:MovieClip, depth:Number, assetURL:String,
x:Number, y:Number, h:Number, w:Number, alpha:Number )
{
contentLoaded = false;
content = target.createEmptyMovieClip(name, depth);
content._x = x;
content._y = y;
loader = new MovieClipLoader();
loader.addListener(this);
loader.loadClip(assetURL, content);
this.w = w;
this.h = h;
this.alpha = alpha;
}

public function onLoadInit(clip:MovieClip) {
contentLoaded = true;
trace("content loaded");
clip._width = w;
clip._height = h;
clip._alpha = alpha;
var me:Fader = this;
clip.onRollOver = function() {
trace("call fadein");
me.fadeIn(2);
}
clip.onRollOut = function() {
me.fadeOut(2);
}
}

// For these fade functions,
// I would change them to use an interval
// and clear the interval when reaching 100 or 0

public function fadeIn (speed:Number) {
var me:Fader = this;
content.onEnterFrame = function() {
trace(this._alpha);
if (this._alpha < 100) {
this._alpha += speed;
} else {
delete(this.onEnterFrame);
}
}
}
public function fadeOut(speed:Number) {
var me:Fader = this;
content.onEnterFrame = function() {
if (this._alpha > me.alpha) {
this._alpha -= speed*2;
} else {
delete(this.onEnterFrame);
}
}
}
}

[sleekdigital]

There were some mistakes in the code I posted before. The code you see there now has been tested and it works.

Example usage ...

import someNameSpace.Fader;
var fade1:Fader = new Fader("fc", _root, 1, "somefile.jpg", 50, 50, 200, 200, 50 );

-s

[BadBadNeil]

Has anyone gotten this to work? I get quite a few errors when trying the final code out. Can someone throw these into a .as and .fla file and quickly try it to see if it works. I've been trying to figure it out but for some reason it doesn't want to import the class.

Thanks!

[sleekdigital]

"someNameSpace" is just a placeholder for whatever namespace (if any) you might be using for your code. If you do use a namespace, make sure you have a folder in your AS2 class path with the same name. See the Flash help for more details on namespaces and setting up class paths

[BadBadNeil]

i pretty much figured that in this line, "import someNameSpace.Fader;" someNameSpace was a folder location, but what I don't get is why the class name in the .as file is "class someNameSpace.Fader"

If I have the .as file in the same location as the .fla file then I can omit the someNameSpace, but is it omitted in both the .as file and the .fla?

I'm going to check flash help but their class information is on the weak side. I got it to load error free now, seems my flash help files where 20 files out of date ;)

So in theory I could just keep adding new methods to the class to extend the capabilities like displaying loading progress etc. Would that be what you would do?

Thanks

[sleekdigital]

"but is it omitted in both the .as file and the .fla?"

Yes

"So in theory I could just keep adding new methods to the class to extend the capabilities like displaying loading progress etc. Would that be what you would do?"

You could certainly do that if you like. You could also extend via composition or inheritance.