Home Tutorials Forums Articles Blogs Movies Library Employment Press
Old 05-01-2003, 09:26 PM   #1
Registered User
Join Date: Jan 2003
Posts: 118
Default Random fades

I'm trying to get a series of shapes (all the same shape) to randomly fade up and down. I'd prefer to do this with actionscript instead of tweening. Check out my attached file. I'd appreciate any suggestions.

Attached Files
File Type: zip randomc.fla.zip (8.5 KB, 273 views)
rabblerouser is offline   Reply With Quote
Old 05-05-2003, 03:37 AM   #2
thinking is design
retrotron's Avatar
Join Date: Apr 2003
Location: UK
Posts: 1,292

Here's a way to do it object-oriented wise. The reason I went this route was because then you can simply apply the HoneyComb.randomFade() method whenever you want a random comb to fade. Similarly, a fadeIn() method can easily be added on.

This is all actionscript, no symbols or whatnot, so you should be able to paste the following code into an empty .fla and test the movie. You should see one of the honey combs fade out. If you have any questions, let me know.
ActionScript Code:
// ******************************************************************* // // Define HoneyComb Class // function HoneyComb(name,parent) {     this.name = name; // set the name of the instance as this.name     this.parent = parent; // set the parent of the instance as this.parent } // end HoneyComb class definition // build the honey comb with buildComb() method // ------------------------------------------------------------------- HoneyComb.prototype.buildComb = function() {     // set up counter variables     var count_x = 0;     var count_x2 = 0;     var count_y = 0;     var depth = 0; // execute two loops to construct the honey comb for (var i=0; i < 12; i++) { // create each of the 12 columns     for (var j=0; j < 4; j++) { // create each column of four combs each         var clip_nm = "comb" + depth + "_mc"; // set the new clip name         this.parent.createEmptyMovieClip(clip_nm,depth); // create movie         with (this.parent[clip_nm]) {             // draw comb             lineStyle(1,0x272728,100);             beginfill(0x272728,100);             moveTo(0,36);             lineTo(21,0);             lineTo(62,0);             lineTo(83,36);             lineTo(62,72);             lineTo(21,72);             lineTo(0,36);             endFill();             // move comb to proper place             _x = count_x;             _y = count_y;         } // end with grouping         count_y += 77; // increment _y by 77 since one comb has been created         depth += 1; // increment the depth since 1 clip has been created     } // end j loop     if ((i % 2) > 0) { // i is even         count_y = 0; // start even rows at 0     } else { // i is odd         count_y = 38; // start odd rows at 38     } // end "if i mod 2"     count_x += 67; // move _x over 67 px to start next column } // end i loop } // end HoneyComb.buildComb() method // randomFade() method // ------------------------------------------------------------------- HoneyComb.prototype.randomFade = function() {     var ranNum = this.getRandom(1,28); // get a random number between 1 and 28     var clip_nm = "comb" + ranNum + "_mc";     // run this.fadeOut() every 10 milliseconds     fadeInterval = setInterval(this.fadeOut,10,clip_nm); } // end HoneyComb.randomFade() method // fadeOut() method // ------------------------------------------------------------------- HoneyComb.prototype.fadeOut = function(x) {     // x:   the name of the clip to fade     var thisPath = "this." + x;     if (eval(thisPath)._alpha > 0) { // do this if alpha is greater than 0         eval(thisPath)._alpha -= 1; // reduce alpha by 1     } else { // do this if alpha has reached zero         clearInterval(fadeInterval); // stop fadeInterval from executing     } // end "if _alpha > 0" } // end HoneyComb.fadeOut() // HoneyComb.getRandom() method (*courtesy of Colin Moock) // returns a random number between two specified values // ------------------------------------------------------------------- HoneyComb.prototype.getRandom = function(minVal,maxVal) {     return minVal + Math.floor(Math.random() * (maxVal + 1 - minVal)); } // end HoneyComb.getRandom() // end HoneyComb Class definition // // ******************************************************************* // // now that the HoneyComb class is defined, let's use it: var myComb = new HoneyComb("myComb",this); // create a new instance of the HoneyComb Class myComb.buildComb(); // run the "buildComb()" method myComb.randomFade(); // run "randomFade()", you can run this method as many times as you like
Hope something here helps or gives you some ideas.

retrotron is offline   Reply With Quote
Old 05-05-2003, 03:20 PM   #3
thinking is design
retrotron's Avatar
Join Date: Apr 2003
Location: UK
Posts: 1,292

I was still intrigued by the idea this morning, so I expanded the Class to do a continual fading operation where at a random time interval it randomly selects combs to fade out (which can then fade back in if so desired).

It works fairly well if the parameters are right, but if not, with 48 little movies getting adjusted, the Flash Player can get overloaded pretty easily. When the parameters are not right, it's remarkably ineffecient, so if anybody wants to jump in and make it better, redesign the class, tell me I'm doing it the most difficult way possible, that'd be great. There's got to be an easier way to do this.

Anyways, here's the new Class (again just actionscript, paste it in an empty .fla and test the movie):
PHP Code:
// ******************************************************************* //
// Define HoneyComb Class //
function HoneyComb(name,parent) {
this.name name// set the name of the instance as this.name
this.parent parent// set the parent of the instance as this.parent
this.count 0// set a counter to 0;
// end HoneyComb class

// build the honey comb with buildComb() method
// -------------------------------------------------------------------
HoneyComb.prototype.buildComb = function() {
// set up counter variables
var count_x 0;
count_x2 0;
count_y 0;
depth 0;
// execute two loops to construct the honey comb
for (var i=012i++) { // create each of the 12 columns
for (var j=04j++) { // create each column of four combs each
var clip_nm "comb" depth "_mc"// set the new clip name
this.parent.createEmptyMovieClip(clip_nm,depth); // create movie 
with (this.parent[clip_nm]) {
// draw comb
// move comb to proper place
_x count_x;
_y count_y;
// end with grouping
count_y += 77// increment _y by 77 since one comb has been created
depth += 1// increment the depth since 1 clip has been created
// end j loop
if ((2) > 0) { // i is even
count_y 0// start even rows at 0
} else { // i is odd
count_y 38// start odd rows at 38
// end "if i mod 2"
count_x += 67// move _x over 67 px to start next column
// end i loop
// end HoneyComb.buildComb() method

// randomFade() method
// -------------------------------------------------------------------
HoneyComb.prototype.randomFade = function(x,y) {
// x: the name of the current instance
    // y: the name of the secondaryInterval
    /* if (x == undefined) { // if x has not been defined, set it to "this"
        x = "this";
    } // end "if x == undefined" */
var thisInterval "." y;
clearInterval(eval(thisInterval)); // clear the random interval which called this method
trace("2: " thisInterval " cleared");
ranNum = eval(x).getRandom(1,48); // get a random number between 1 and 48
var clip_nm "comb" ranNum "_mc";
// run this.fadeOut() every 20 milliseconds
var interval_nm "fadeInterval" ranNum;
x)[interval_nm] = setInterval(eval(x).fadeOut,20,clip_nm,x,interval_nm,ranNum); 
// end HoneyComb.randomFade() method

// fadeOut() method
// -------------------------------------------------------------------
HoneyComb.prototype.fadeOut = function(x,y,z,num) {
// x: the name of the clip to fade
    // y: the name of the current instance
    // z: the name of the fadeInterval
    // num: the number of the clip being faded
var thisPath "this." x;
thisInterval "." z;
    if (eval(
thisPath)._alpha 0) { // do this if alpha is greater than 0
eval(thisPath)._alpha -= 1// reduce alpha by 1
} else { // do this if alpha has reached zero
clearInterval(eval(thisInterval)); // stop fadeInterval from executing
trace("A: " thisInterval " cleared");
        if (eval(
y).stayFaded == "no") { // if this.stayFaded is "no", start fadeBack
            // start the fadeBack interval, every ranNum milliseconds
var fadeBackInterval = eval(y).fadeBackInterval;
ranNum = eval(y).getRandom(0,fadeBackInterval);
interval_nm "waitInterval" num;
y)[interval_nm] = setInterval(eval(y).waitFadeBack,ranNum,x,y,interval_nm,num);  
// end "if this.stayFaded = "no"
// end "if _alpha > 0"
// end HoneyComb.fadeOut() method

HoneyComb.prototype.waitFadeBack = function(x,y,z,num) {
// x: the name of the clip to fade back, passed from this.fadeOut()
    // y: the name of the current instance
    // z: the name of the waitInterval
    // num: the number of the clip being faded
var thisInterval "." z;
trace("B: " thisInterval " cleared");
interval_nm "fadeBackInterval" num;
y)[interval_nm] = setInterval(eval(y).fadeBack,20,x,y,interval_nm,num);
// end HoneyComb.waitFadeBack() method

HoneyComb.prototype.fadeBack = function(x,y,z,num) {
// x: the name of the clip to fade back, passed from this.waitFadeBack()
    // y: the name of the instance
    // z: the name of the fadeBackInterval
    // num: the number of the clip being faded
var thisPath "this." x;
thisInterval "." z;
    if (eval(
thisPath)._alpha 100) { // do this if alpha is less than 100
eval(thisPath)._alpha += 1// increase alpha by 1
} else { // do this if alpha has reached 100
clearInterval(eval(thisInterval)); // stop fadeBackInterval from executing
trace("C: " thisInterval " cleared");
// end "if _alpha < 100"
// end HoneyComb.fadeBack() method

// fadingOn() method
// -------------------------------------------------------------------
HoneyComb.prototype.fadingOn = function(x,maxInterval,fadeBackInterval) {
// x: yes|no; whether the combs should fade back or stay faded out
    // maxInterval: the max time (in milliseconds) between each new fade
    // fadeBackInterval:    the max time (in milliseconds) between fadeOut and fadeIn
this.stayFaded x;
this.maxInterval maxInterval;
this.fadeBackInterval fadeBackInterval;
mainInterval setInterval(this.setRandomFade,maxInterval,this.name);
// end HoneyComb.fadingOn() method

// fadingOff() method
// -------------------------------------------------------------------
HoneyComb.prototype.fadingOff = function() {
// end HoneyComb.fadingOff() method

// setRandomFade() method
// -------------------------------------------------------------------
HoneyComb.prototype.setRandomFade = function(x) {
// x: the name of the current instance
var maxInterval = eval(x).maxInterval;
ranNum = eval(x).getRandom(0,maxInterval); // get a random number between 0 and maxInterval
var interval_nm "secondaryInterval" + eval(x).count;
trace("1: count = " + eval(x).count "; " interval_nm);
x).count += 1;
// run this.randomFade() at ranNum milliseconds
eval(x)[interval_nm] = setInterval(eval(x).randomFade,ranNum,x,interval_nm); 
// end HoneyComb.setRandomFade() method

// HoneyComb.getRandom() method (*credit to Colin Moock)
// returns a random number between two specified values
// -------------------------------------------------------------------
HoneyComb.prototype.getRandom = function(minVal,maxVal) { 
minVal Math.floor(Math.random() * (maxVal minVal));
// end HoneyComb.getRandom() method

// end HoneyComb Class definition // 
// ******************************************************************* //

// now that the HoneyComb Class is defined, let's create an instance of it and run it
var myComb = new HoneyComb("myComb",this); // create a new instance of the HoneyComb Class
myComb.buildComb(); // run the "buildComb()" method
myComb.fadingOn("no",2000,500); // run the "fadingOn()" method 
The "randomOn()" function starts the random fading, but if you want to stop it then "randomOff()" does the trick.

So the last three lines of code: after instantiating a new object and building the honey comb, the last line is the one which turns the random fading "on". It takes three parameters:
1. "yes" or "no", this sets a property called "stayFaded". If "yes", then a comb will stay faded out after it has faded; if "no", each comb will fade back in (works best as "no").
2. The maximum time (in milliseconds) between each fading event. For each fade event, the class will randomly select a number between 0 and this number and fade one comb out at that time.
3. The maximum time (in milliseconds) between a comb's fading-out and fading-back-in.

The class works best if the second parameter is a larger number and the third is smaller. The closer these two numbers get, the more work the flash player has to do at once (i.e. fading many little movies at once).

Bugs: it seems to not work right when the third number is equal or greater than the second (though it still works). I don't have the time to really work more on this, but that would be something to look at. Also, since it selects combs to fade at random, it is possible that a comb will get selected again while it is in the process of fading in or out. I reckon that would keep the comb faded out until it randomly gets select again (which might never happen for a long while since it's random).

Improvement: if you want it to fade out and stay faded out, then you set the first parameter of the ".fadingOn()" method to "yes". However, when the combs are mostly faded out and there's only a few left, it takes some time before the random selection actually selects the few visible combs, so it could take a while for the combs to all disappear. I would certainly want to adjust the way it works to fix that, maybe put the movieclips in an array, then pop each one when it is completely faded out. Then the random selection could choose from the remaining elements of the array. Something like that. That would work more effeciently since there would be fewer elements to control as more movies were removed.

Well, I must stop fooling around and get to work. Again, hope something here helps or gives you some ideas.

retrotron is offline   Reply With Quote

Thread Tools
Display Modes Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off

Forum Jump

All times are GMT. The time now is 08:15 AM.

Follow actionscriptorg on Twitter


Powered by vBulletin® Version 3.8.5
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.
Ad Management plugin by RedTyger
Copyright 2000-2013 ActionScript.org. All Rights Reserved.
Your use of this site is subject to our Privacy Policy and Terms of Use.