Adobe Systems, Inc.

KeyHole.as

Go to the documentation of this file.
00001 /******************************************************
00002 ** Copyright 2005-2006 Adobe Systems Incorporated
00003 ** Distributed under the MIT License (see accompanying file LICENSE_1_0_0.txt
00004 ** or a copy at http://opensource.adobe.com/licenses.html)
00005 **
00006 ** This is a sample class showing how 2D drawing
00007 ** can be used to create custom SMTPE-type transitions
00008 ** like the ever-popular key-hole effect ;)
00009 ** What would really be impressive is for someone to do
00010 ** 'Kiki wipes' with this...
00011 ********************************************************/
00012 
00013 import mx.transitions.Transition;
00014 import mx.transitions.TransitionManager;
00015 
00016 
00017 class amg.transitions.KeyHole extends Transition {
00018 
00019         public var type:Object = KeyHole;
00020         public var className:String = "KeyHole";
00021         
00022         private var _mask:MovieClip;
00023         private var _startPoint:Number = 5;
00024         private var _cornerMode:Boolean;
00025         private var _shape:String = "SQUARE";
00026         private var _maxDimension:Number;
00027         private var _minDimension:Number;
00028         private var _renderShape:Function;
00029 
00030         function KeyHole (content:MovieClip, transParams:Object, manager:TransitionManager) {
00031                 this.init (content, transParams, manager);
00032         };
00033         
00034         function init (content:MovieClip, transParams:Object, manager:TransitionManager):Void {
00035                 super.init (content, transParams, manager);
00036                 if (transParams.startPoint) this._startPoint = transParams.startPoint;
00037                 if (transParams.shape!=undefined) this._shape = transParams.shape;
00038                 this._maxDimension = Math.max (this._width, this._height);
00039                 this._minDimension = Math.min (this._width, this._height);
00040                 
00041                 
00042                 this._render = this._renderKeyHole;
00043                         
00044 
00045                 this._initMask();
00046         };
00047 
00048         function start ():Void {
00049                 this._content.setMask (this._mask);
00050                 super.start();
00051         }
00052         
00053         function cleanUp ():Void {
00054                 this._mask.removeMovieClip();
00055                 super.cleanUp();
00056         }
00057 
00058         
00059         private function _initMask ():Void {
00060                 var container:MovieClip = this._content;
00061                 var depth:Number = this.getNextHighestDepthMC (container);
00062                 
00063                 var mask:MovieClip = this._mask = container.createEmptyMovieClip ("__mask_Iris_"+this.direction, depth);
00064                 //mask._alpha = 30;
00065                 mask._visible = false;
00066                 var ib:Object = this._innerBounds;
00067                 
00068                 switch (this._startPoint) {
00069                         case 1:
00070                         // top left
00071                                 mask._x = ib.xMin;
00072                                 mask._y = ib.yMin;
00073                                 break;
00074                         case 4: 
00075                         // left
00076                                 mask._x = ib.xMin;
00077                                 mask._y = (ib.yMin + ib.yMax) * .5;
00078                                 break;
00079                         case 3:
00080                         // top right
00081                                 mask._rotation = 90;
00082                                 mask._x = ib.xMax;
00083                                 mask._y = ib.yMin;
00084                                 break;
00085                         case 2:
00086                         // top center
00087                                 mask._rotation = 90;
00088                                 mask._x = (ib.xMin + ib.xMax) * .5;
00089                                 mask._y = ib.yMin;
00090                                 break;
00091                         case 9:
00092                         // bottom right
00093                                 mask._rotation = 180;
00094                                 mask._x = ib.xMax;
00095                                 mask._y = ib.yMax;
00096                                 break;
00097                         case 6: 
00098                         // right
00099                                 mask._rotation = 180;
00100                                 mask._x = ib.xMax;
00101                                 mask._y = (ib.yMin + ib.yMax) * .5;
00102                                 break;
00103                         case 7:
00104                         // bottom left
00105                                 mask._rotation = -90;
00106                                 mask._x = ib.xMin;
00107                                 mask._y = ib.yMax;
00108                                 break;
00109                         case 8: 
00110                         // bottom center
00111                                 mask._rotation = -90;
00112                                 mask._x = (ib.xMin + ib.xMax) * .5;
00113                                 mask._y = ib.yMax;
00114                                 break;
00115                         case 5:
00116                         // center
00117                                 mask._x = (ib.xMin + ib.xMax) * .5;
00118                                 mask._y = (ib.yMin + ib.yMax) * .5;
00119                                 break;
00120                         default:
00121                                 break;
00122                 }
00123         }
00124 
00125         // stub--dynamically overwritten by one of the other render methods 
00126         private function _render (p:Number):Void {}
00127         
00128         private function _renderKeyHole (p:Number):Void {
00129                 var mask:MovieClip = this._mask;
00130                 mask.clear();
00131                 mask.beginFill (0xFF0000);
00132                 
00133                 
00134                 
00135                 
00136                 var maxRadius:Number = .5 * Math.sqrt (this._width*this._width + this._height*this._height);
00137                 this.drawKeyhole (mask, 0, 0, p*maxRadius);
00138                 
00139                 
00140                 mask.endFill();
00141                  
00142                 
00143                 
00144         }
00145         
00146         
00147         
00148         private function drawKeyhole (mc:MovieClip, x:Number, y:Number, r:Number):Void {
00149                 
00150                 mc.lineStyle(1, 0x000000);
00151                 mc.beginFill(0x000000);
00152                 mc.moveTo (x-(r*.5),y);
00153                 mc.lineTo(x-(r*.5),y+r*2);
00154                 mc.lineTo(x+(r*.5),y+r*2);
00155                 mc.lineTo(x+(r*.5),y);
00156                 mc.lineTo(x-(r*.5),y);
00157                 mc.endFill();
00158                 mc.beginFill(0x000000);
00159                 mc.moveTo (x+r, y);
00160                 mc.curveTo (r+x, Math.tan(Math.PI/8)*r+y, Math.sin(Math.PI/4)*r+x, Math.sin(Math.PI/4)*r+y);
00161                 mc.curveTo (r+x, Math.tan(Math.PI/8)*r+y, Math.sin(Math.PI/4)*r+x, Math.sin(Math.PI/4)*r+y);
00162                 mc.curveTo (Math.tan(Math.PI/8)*r+x, r+y, x, r+y);
00163                 mc.curveTo (-Math.tan(Math.PI/8)*r+x, r+y, -Math.sin(Math.PI/4)*r+x, Math.sin(Math.PI/4)*r+y);
00164                 mc.curveTo (-r+x, Math.tan(Math.PI/8)*r+y, -r+x, y);
00165                 mc.curveTo (-r+x, -Math.tan(Math.PI/8)*r+y, -Math.sin(Math.PI/4)*r+x, -Math.sin(Math.PI/4)*r+y);
00166                 mc.curveTo (-Math.tan(Math.PI/8)*r+x, -r+y, x, -r+y);
00167                 mc.curveTo (Math.tan(Math.PI/8)*r+x, -r+y, Math.sin(Math.PI/4)*r+x, -Math.sin(Math.PI/4)*r+y);
00168                 mc.curveTo (r+x, -Math.tan(Math.PI/8)*r+y, r+x, y);
00169                 mc.endFill();
00170                 
00171         }
00172 
00173         private function _renderCircle (p:Number):Void {
00174                 var mask:MovieClip = this._mask;
00175                 mask.clear();
00176                 mask.beginFill (0xFF0000);
00177                 
00178                 if (this._startPoint == 5) {
00179                         // iris from center
00180                         var maxRadius:Number = .5 * Math.sqrt (this._width*this._width + this._height*this._height);
00181                         this.drawCircle (mask, 0, 0, p*maxRadius);
00182                 } else {
00183                         if (this._cornerMode) {
00184                                 // iris from corner
00185                                 var maxRadius:Number = Math.sqrt (this._width*this._width + this._height*this._height);
00186                                 this._drawQuarterCircle (mask, p*maxRadius);
00187                         } else {
00188                                 // iris from edge
00189                                 if (this._startPoint == 4 || this._startPoint == 6) {
00190                                         // half-circle from left or right edge
00191                                         var maxRadius:Number = Math.sqrt (this._width*this._width + .25*this._height*this._height);
00192                                 } else if (this._startPoint == 2 || this._startPoint == 8) {
00193                                         // half-circle from top or bottom edge
00194                                         var maxRadius:Number = Math.sqrt (.25*this._width*this._width + this._height*this._height);
00195                                 }
00196                                 this._drawHalfCircle (mask, p*maxRadius);  
00197                         }
00198                 }
00199                 mask.endFill();
00200         }
00201 
00202         private function _drawQuarterCircle (mc:MovieClip, r:Number):Void {
00203                 var x=0, y=0;
00204                 mc.lineTo (r, 0);
00205                 mc.curveTo (r+x, Math.tan(Math.PI/8)*r+y, Math.sin(Math.PI/4)*r+x, Math.sin(Math.PI/4)*r+y);
00206                 mc.curveTo (Math.tan(Math.PI/8)*r+x, r+y, x, r+y);
00207         }
00208         
00209         private function _drawHalfCircle (mc:MovieClip, r:Number):Void {
00210                 var x=0, y=0;
00211                 mc.lineTo (0, -r);
00212                 mc.curveTo (Math.tan(Math.PI/8)*r+x, -r+y, Math.sin(Math.PI/4)*r+x, -Math.sin(Math.PI/4)*r+y);
00213                 mc.curveTo (r+x, -Math.tan(Math.PI/8)*r+y, r+x, y);
00214                 mc.curveTo (r+x, Math.tan(Math.PI/8)*r+y, Math.sin(Math.PI/4)*r+x, Math.sin(Math.PI/4)*r+y);
00215                 mc.curveTo (Math.tan(Math.PI/8)*r+x, r+y, x, r+y);
00216                 mc.lineTo (0, 0);
00217         }
00218         
00219         //this._maxDimension = Math.max (this._width, this._height);
00220         
00221         private function _renderSquareEdge (p:Number):Void {
00222                 var mask = this._mask;
00223                 mask.clear();
00224                 mask.beginFill (0xFF0000);
00225                 var s = this._startPoint;
00226                 var w = p*this._width;
00227                 var h = p*this._height;
00228                 var z = p*this._maxDimension;
00229                 if(s == 4 || s == 6){
00230                         this.drawBox (mask, 0, -.5*h, w, h);
00231                 }else if(this._height < this._width){
00232                         this.drawBox (mask, 0, -.5*z, h, w); 
00233                 }else{
00234                         this.drawBox (mask, 0, -.5*z, z, z);
00235                 }
00236                 mask.endFill();
00237         }
00238         
00239         
00240         private function _renderSquareCorner (p:Number):Void {
00241                 var mask = this._mask;
00242                 mask.clear();
00243                 mask.beginFill (0xFF0000);
00244                 var s = this._startPoint;
00245                 var w = p*this._width;
00246                 var h = p*this._height;
00247                 if (s == 5) {
00248                         this.drawBox (mask, -.5*w, -.5*h, w, h);
00249                 }else if(s == 3 || s == 7){
00250                         this.drawBox (mask, 0, 0, h, w);
00251                 } else {
00252                         this.drawBox (mask, 0, 0, w, h);
00253                 }
00254                 mask.endFill();
00255         }
00256 }
00257 
00258 

Copyright © 2006 Adobe Systems Incorporated.

Use of this website signifies your agreement to the Terms of Use and Online Privacy Policy.