MX transitions a la Senocular

programming flash
1

Senocular wrote this on another thread for tips and tricks and I wanted to explore it a bit (since I was not adding to tips & tricks, I thought it’d be best to start a thread)

// button
page1_btn.onRelease = function(){
	action = function(){
		_root.gotoAndPlay("page2_label");
	};
	play();
};
// last frame
action();

now, i really don’t understand what is happening, but i do want to learn and be able to apply it to my site.

I use this for my buttons:

Button_Names = ["about", "portfolio", "extras", "privacy", "credits", "as"];
for (i=0; i<=Button_Names.length-1; i++) {
        item = Button_Names*;
        this[item+"_btn"].mov = item;
        this[item+"_btn"].onRelease = function() {
                loadMovieNum(this.mov+".swf", 2);
				_root.intro.gotoAndStop(2);
				_root.load2.gotoAndStop(2);
				unloadMovie(4);
                this.gotoAndStop("_disabled");
                this.enabled = 0;
                Enable_Buttons(this.mov);

and i don’t understand how a transition can play out and then call the next action (ie, loadMovieNum, in this case)

am I right that senocular calls the “action” function in the last frame of the loaded page (or swf)? and that “action” would be the loading of the viewer selected content?

gee, this stuff is so hard for me to understand! how do you get actionscript instead of php,

don't work for me!!!!
2
  1. the
 tag isnt supported here ;) use either [**code] or [**php] - php giving the color coding, as you know.

2) as for the whole action function thing, all it does is lets you dynamically set what set of actions you want to occur at the end of a following animation.  If you want different actions, then youd have different action functions, each set within the button release or whatever.  If using MX style button assignment, its usually a pretty good idea to define the different actions beforehand seperately and just have assignment the actual action be assigned to the appropriate one for the onRelease.  If putting the code directly on the button, its easier to throw the definition right in the on(release)... though it really doesnt matter too much for praticallities sake and you might find it easier to have the function in the onrelease yourself.  Whatever makes you feel better with, however, the forementioned would be better suited if you are assigning your actions through a loop like that.  Yet, in your case you dont even really need an actions function since all you're doing is loading a movie and thats consistent for each button.  In that case, you just set a variable to represent the movie to load and then load that variable at the end of the transition.

The basic concept here is that you have a set of options/possibilities.  These all lead to some unique result or outcome, but to get to that outcome a shared (similar for all) transition is desired to play before achieving that outcome.  So to actually initiate that outcome after the transition, you have to SAVE the selected options actions until that outcome is required to initiate (and the actions run).

[options...] &lt;-- selection is made
[selection actions saved, play transition]
|
|
transition
|
|
V
[selection actions retrieved and processed]

That whole saving thing is what drives what happens after the transition.  If all you're doing is loading a movie, then all you have to save is a single url for the movie to load.  If you are saving a group of commands, thats saving a function call.

understand a little better?
3

Thank you senocular for such a wonderful explanation. I understand the jist of your explanation and how it functions in words, however, I am such a novice, that I am uncertain how to execute it. It appears that your example is to play one transition (ie, a screen closing) and that to play various transitions, I would perhaps need to define a funtion for each transition.

So for the sake of an example: “about” is a blue square, “products” is a green triangle and “contact” is a red circle. The viewer has the option of any selection and could go from “about” to “products” or from “about” to “contact”. I would like the transition to be a fade (or tween, et cetera) from the current loaded swf to the selected swf. So that the blue square would fade (shrink, morph, …) off of the screen and have the loaded swf fade in without the abruptness of the unLoadMovie call. Robert Reinhardt (Flash MX ActionScript Bible) has a “smooth” transition like this, but it is of movie clips, not loaded swfs.

If your example needs a function for each swf, this would be a great solution. I am trying to get rid of the “destructive page refresh” look that my site currently has but without using another top level loaded swf to play the transition (ie, the closing and opening screens as on 2advanced.com). I would like each section to alpha fade out and the new selection to fade in.

I apologize for my low-level of scripting knowledge and greatly appreciate your explanation. Also thank you for the forum tip:

 //Robert Reinhardt code

function show(num) {
	//transition current content OR add new content
	var sections = ["main", "section_1", "section_2", "section_3"];
	if (typeof (currentNum) != "undefined" && num != currentNum) {
		_root[sections[currentNum]+"_mc"].gotoAndPlay("out");
	} else {
		_root.attachMovie(sections[num], sections[num]+"_mc", 1, {_x:10, _y:10});
	}
	currentNum = num;
	//show frame on active button
	for (var i = 1; i<=4; i++) {
		if (i != num+1) {
			_root["menuButton_"+i].frame._visible = false;
		}
	}
	_root["menuButton_"+(num+1)].frame._visible = true;
}
_global.outDone = function(target) {
	target.removeMovieClip();
	show(currentNum);
};
menuButton_1.buttonLabel.text = "Main";
menuButton_1.onRelease = function() {
	show(0);
};
menuButton_2.buttonLabel.text = "Section 1";
menuButton_2.onRelease = function() {
	show(1);
};
menuButton_3.buttonLabel.text = "Section 2";
menuButton_3.onRelease = function() {
	show(2);
};
menuButton_4.buttonLabel.text = "Section 3";
menuButton_4.onRelease = function() {
	show(3);
};