Return to Snippet

Revision: 19774
at October 30, 2009 11:23 by Winkyboy


Initial Code
package {

	import flash.events.*;
    import flash.display.*;
    import flash.net.*;
    import flash.utils.*;
	import flash.text.*;
    //import flash.media.Sound;
    //import flash.media.SoundChannel;
    //import flash.media.SoundTransform;
    //import flash.media.SoundMixer;

    import flash.filters.GlowFilter;
	import flash.filters.BlurFilter;

    //import com.MRM.*;

    import caurina.transitions.*;
    import caurina.transitions.properties.*;
    CurveModifiers.init();
	
	public class banner extends MovieClip {

		var dropWidth:Number = 3; // This will put this many pixels between the frame and the MASK/DROPSHADOW elements.
		//var loops:Number = 0; // do not change
		//var loopsMax:Number = 1; // how many times animation will loop
		//var loopDelay:Number = 2000; // time to delay before looping, set in milliseconds

        var glowIn:GlowFilter=new GlowFilter(0xFFFFFF,0.75,20,20,2,2);
        var glowOut:GlowFilter=new GlowFilter(0xFFFFFF,0,10,10,2,2);
		var blurIn:BlurFilter = new BlurFilter(2.0, 2.0, 1)
		var blurOut:BlurFilter = new BlurFilter(0.0, 0.0, 1)

		// animation function variables
		var pauseHere:Number; // change on each frame; determines how long you want to wait at any particular frame.
		var gap:Number; // a delay in between each step of an animation on each frame.
		
		var bumpSpeed:Number = .25;
		var spinSpeed:Number = .25;
		var moveSpeed:Number = .25;
		var FADESPEED:Number = .5;
		var BLURSPEED:Number = .5;
		var BUMPSIZE:Number = 1.25;


		public function banner() {
            //init
            ColorShortcuts.init();
            FilterShortcuts.init();
			
			// draw a border
			var myBorder:Shape = new Shape();
			myBorder.graphics.lineStyle(1,0x00000000);
			//myBorder.graphics.beginFill(0xff00ff00);
			myBorder.graphics.drawRect(0+dropWidth, 0+dropWidth, stage.stageWidth-(2*dropWidth), stage.stageHeight-(2*dropWidth));
			myBorder.graphics.endFill();
			addChild(myBorder);

			// size the dropshadow
			solid_mc.x = 0 + dropWidth;
			solid_mc.y = 0 + dropWidth;
			solid_mc.width = stage.stageWidth - 2*dropWidth;
			solid_mc.height = stage.stageHeight - 2*dropWidth;
			
			// size the mask
			mask_mc.x = 0 + dropWidth;
			mask_mc.y = 0 + dropWidth;
			mask_mc.width = stage.stageWidth - 2*dropWidth;
			mask_mc.height = stage.stageHeight - 2*dropWidth;
			
			// set button actions
			cta_invis_mc.buttonMode = true;
			cta_invis_mc.addEventListener(MouseEvent.MOUSE_DOWN,clickItem);
			cta_invis_mc.x = 0;
			cta_invis_mc.y = 0;
			cta_invis_mc.width = stage.stageWidth;
			cta_invis_mc.height = stage.stageHeight;
			
			makeButton(cta_manual_mc, overItem, outItem, clickItem);
			makeButton(cta_centering_mc, overItem, outItem, clickItem); cta_centering_mc.setText("DYNAMIC TEXT");
			
		}
		
		
		
		
		
		
		
		
		// GENERAL BUTTON OVER/OUT/CLICK FUNCTIONS
		
		private function makeButton(which_mc:MovieClip, overFunction:Function, outFunction:Function, clickFunction:Function):void {
			which_mc.buttonMode = true; 
			which_mc.useHandCursor = true;
			which_mc.mouseChildren = false;
			which_mc.addEventListener(MouseEvent.MOUSE_OVER, overFunction);
			which_mc.addEventListener(MouseEvent.MOUSE_OUT, outFunction);
			which_mc.addEventListener(MouseEvent.CLICK, clickFunction);
		}
		
        private function overItem(e:Event) {
            Tweener.addTween(e.currentTarget, {_filter:glowIn, scaleX:1.05, scaleY:1.05, time:0.2});
            //e.currentTarget.gotoAndStop(2);
//          switch (e.currentTarget.name) {
//              case "mc_dock_beef" :
//              break;
//          }
        }

        private function outItem(e:Event) {
            Tweener.addTween(e.currentTarget, {_filter:glowOut, scaleX:1, scaleY:1, time:0.2});
            //e.currentTarget.gotoAndStop(1);
        }


        private function clickItem(e:Event) {
			trace(e.currentTarget.name);
//            switch (e.currentTarget.name) {
//                case "tv01_mc" :
//                break;
//			}
		}












		// ANIMATION (CUSTOMIZED TWEENER) FUNCTIONS


		// init hides a movieclip and sets its alpha property to 0. This is useful for entering a new frame where the elements need to animate in.
		private function init(which_mc):void {
			which_mc.alpha = 0;
			which_mc.visible = false;
		}

		// fades a movieclip in or out.
		// syntax: fade(mymovieclip_mc, "out", .5, -1);
		private function fade(which_mc:MovieClip, method:String, myDelay:Number, newSpeed:Number):void {
			var thisSpeed:Number;
			if (newSpeed >= 0) thisSpeed = newSpeed; else thisSpeed = FADESPEED;
			
			switch(method)
			{
				case "in" :
				Tweener.addTween(which_mc, {alpha:100, time:thisSpeed, delay:myDelay});
				which_mc.visible = true;
				break;
				case "out" :
				Tweener.addTween(which_mc, {alpha:0, time:thisSpeed, delay:myDelay, onComplete:function() { which_mc.visible = false; } });				
				break;
			}
		}		
		
		// bump increases a movieclip's scale temporarily then returns it to normal
		// syntax: bump(mymovieclip_mc, 0, -1);
		private function bump(which_mc:MovieClip, myDelay:Number, factor:Number):void {
			var baseScale:Number = which_mc.scaleX;
			if (factor < 1) factor = 1;
			Tweener.addTween(which_mc, {scaleX:BUMPSIZE * baseScale * factor, scaleY:BUMPSIZE * baseScale * factor, time:bumpSpeed, delay:myDelay});
			Tweener.addTween(which_mc, {scaleX:baseScale-(BUMPSIZE*baseScale*.1), scaleY:baseScale-(BUMPSIZE*baseScale*.1), time:bumpSpeed, delay:myDelay + bumpSpeed});
			Tweener.addTween(which_mc, {scaleX:baseScale, scaleY:baseScale, time:bumpSpeed, delay:myDelay + (bumpSpeed*2), transition:"easeInOutQuad" });
		}
		
		// blurs a movieclip in or out.
		// syntax: blur(mymovieclip_mc, "out", .5, -1);
		private function blur(which_mc:MovieClip, method:String, myDelay:Number, newSpeed:Number):void {
			var thisSpeed:Number;
			if (newSpeed >= 0) thisSpeed = newSpeed; else thisSpeed = BLURSPEED;
			
			switch(method)
			{
				case "in" :
				Tweener.addTween(which_mc, {_filter:blurIn, time:thisSpeed, delay:myDelay});
				break;
				case "out" :
				Tweener.addTween(which_mc, {_filter:blurOut, time:thisSpeed, delay:myDelay});
				break;
			}
		}





	}
}

Initial URL
http://dl.getdropbox.com/u/316550/code-AS3_banner_class_template.zip

Initial Description
This is an AS3 version of the banner template I created a while back in AS2. The code has been placed in the accompanying banner.as file, with the exception of a little bit of code within the dynamically-centering button you'll see placed on the stage.

Just like the AS2 version, this is: An empty FLA to be repurposed for creating other banners of varying size. Clickable area is resized automatically to fit the stage size, and a sample button with rollover states is included. 

I removed the frames-based animation; you can just add your own as you feel.

(Uses Tweener from http://code.google.com/p/tweener/ )

Initial Title
AS3 Banner Template

Initial Tags
template

Initial Language
ActionScript 3