Tag Archives: as3

Fp10 3d Logo

By Zevan | November 25, 2009
CLICK HERE TO COPY
Actionscript:
  1. var container:Sprite = new Sprite();
  2. container.x = stage.stageWidth / 2;
  3. container.y = stage.stageHeight / 2;
  4. addChild(container);
  5.  
  6. var redBox:Sprite = new Sprite();
  7. redBox.graphics.beginFill(0xFF0000);
  8. redBox.graphics.drawRect(-50,-250,100,500);
  9. redBox.rotationZ = 10;
  10. container.addChild(redBox);
  11.  
  12. var logos:Array = []
  13. var elements:Array = [];
  14. elements.push({element:redBox, z:0});
  15.  
  16. // add the logos
  17. for (var i:int = 0; i<6; i++){
  18.     var logoContainer:MovieClip = new MovieClip();
  19.     var logoText:TextField = new TextField();
  20.     logoText.defaultTextFormat = new TextFormat("_sans", 50);
  21.     logoText.text = "LOGO";
  22.     logoText.autoSize = "left";
  23.     logoText.selectable= false;
  24.    
  25.     logoText.x = -logoText.width / 2;
  26.     logoText.y = -logoText.height / 2;
  27.     logoContainer.addChild(logoText);
  28.     logoText.backgroundColor = 0xFFFFFF;
  29.    
  30.     container.addChild(logoContainer);
  31.     logos.push(logoContainer);
  32.     elements.push({element:logoContainer, z:0});
  33. }
  34.  
  35. var ang:Number = -Math.PI / 2;
  36. var rotationSpeed:Number = 0.05;
  37. addEventListener(Event.ENTER_FRAME, onLoop);
  38. function onLoop(evt:Event):void {
  39.    
  40.      var dx:Number = (mouseY - stage.stageHeight / 2) / 10;
  41.      var dy:Number = (mouseX - stage.stageWidth / 2) / 10;
  42.      container.rotationX += (dx - container.rotationX) / 4;
  43.      container.rotationY += (dy - container.rotationY) / 4;
  44.      
  45.      ang += rotationSpeed;
  46.      for (var i:int = 0; i<logos.length; i++){
  47.          var logo:Sprite = logos[i];
  48.          logo.x = 150 * Math.cos(ang + i);
  49.          logo.z = 150 * Math.sin(ang + i);
  50.          logo.alpha = 1 - logo.z / 200;
  51.          logo.rotationY = -Math.atan2(logo.z, logo.x)  / Math.PI * 180  - 90;
  52.      }
  53.      
  54.      // z-sort
  55.      for (i = 0; i<elements.length; i++){
  56.           elements[i].z = elements[i].element.transform.getRelativeMatrix3D(this).position.z;
  57.      }
  58.      
  59.     elements.sortOn("z", Array.NUMERIC | Array.DESCENDING);
  60.     for (i = 0; i<elements.length; i++) {
  61.         container.addChild(elements[i].element);
  62.     }
  63. }

A student of mine was having trouble creating a 3D logo for a client. I created this snippet to help explain how some of the fp10 3D stuff works.... z-sorting etc... The code could be optimized a bit... but it works nicely...


Have a look at the swf...

Posted in 3D, misc, motion | Also tagged , , | 2 Comments

Functions Returning Functions

By Zevan | November 23, 2009
CLICK HERE TO COPY
Actionscript:
  1. var connect:Function = function(xp:Number, yp:Number, col:uint=0):Function{
  2.     graphics.lineStyle(0,col);
  3.     graphics.moveTo(xp, yp);
  4.     var line:Function = function(xp:Number, yp:Number):Function{
  5.         graphics.lineTo(xp, yp);
  6.         return line;
  7.     }
  8.     return line;
  9. }
  10.  
  11. // draw a triangle
  12. connect(200,100)(300,300)(100,300)(200, 100);
  13.  
  14. // draw a box
  15. connect(100,100, 0xFF0000)(150,100)(150,150)(100, 150)(100,100);

This is one of those techniques that I never really get tired of. It's pretty useless, but fun to play around with every now and then. This draws the somewhat boring looking picture below:

[EDIT]
A few people pointed out that this could be simplified with arguments.callee... So here is an example... it does the same thing as the original code...

CLICK HERE TO COPY
Actionscript:
  1. var connect:Function = function(xp:Number, yp:Number, col:uint=0):Function{
  2.     graphics.lineStyle(0,col);
  3.     graphics.moveTo(xp, yp);
  4.     return function(xp:Number, yp:Number):Function{
  5.         graphics.lineTo(xp, yp);
  6.         return arguments.callee;
  7.     }
  8. }

Posted in functions, misc | Also tagged , | 6 Comments

QuickBox2D Custom Debug Draw

By Zevan | November 18, 2009
CLICK HERE TO COPY
Actionscript:
  1. import com.actionsnippet.qbox.*;
  2. import Box2D.Dynamics.*
  3.  
  4. stage.frameRate = 60;
  5.  
  6. var sim:QuickBox2D = new QuickBox2D(this, {debug:true});
  7.  
  8. // get at the b2DebugDraw instance
  9. var debug:b2DebugDraw = sim.w.m_debugDraw;
  10. debug.m_drawScale = 30.0;
  11. debug.m_fillAlpha = 0.5;
  12. debug.m_alpha = 0.5;
  13. debug.m_lineThickness = 1.0;
  14. debug.m_drawFlags = 0xFF;
  15.  
  16. sim.createStageWalls();  
  17.  
  18. for (var i:int = 0; i<10; i++){
  19.   sim.addBox({x:3 + i, y:3 + i, width:2, height:0.5});
  20. }
  21. sim.addCircle({x:12, y:5, radius:2});
  22.  
  23. sim.start();
  24. sim.mouseDrag();

Note: This snippet requires the QuickBox2D library

This snippet shows an easy way to get at the settings for Box2D's debug renderer.


Have a look at the swf...

Posted in Uncategorized | Also tagged , , , | 2 Comments

Obfuscated Slider

By Zevan | November 16, 2009
CLICK HERE TO COPY
Actionscript:
  1. var slider:MovieClip = makeSlider();
  2. slider.addEventListener(Event.CHANGE, function(evt:Event):void{
  3.     trace(evt.currentTarget.percent);                                  
  4. });
  5.  
  6. function makeSlider():MovieClip{
  7.     var slider:MovieClip = MovieClip(addChild(new MovieClip()));
  8.     var circle:Sprite = Sprite(slider.addChild(new Sprite()));
  9.     with (circle.graphics) beginFill(0x000000), drawCircle(0,0,10);
  10.     var line:Shape = Shape(slider.addChild(new Shape()));
  11.     with (line.graphics) lineStyle(0,0x000000), lineTo(0, 100);
  12.     slider.x = slider.y = 100;
  13.     circle.addEventListener(MouseEvent.MOUSE_DOWN, function(evt:Event):void{ evt.currentTarget.startDrag(false, new Rectangle(0,0,0,100)), slider.addEventListener(Event.ENTER_FRAME, onChange) });
  14.     var stopIt:Function = function(){ stopDrag(), slider.removeEventListener(Event.ENTER_FRAME, onChange) };
  15.     stage.addEventListener(Event.MOUSE_LEAVE, stopIt);
  16.     stage.addEventListener(MouseEvent.MOUSE_UP, stopIt);
  17.     return slider;
  18. }
  19. function onChange(evt:Event):void { evt.currentTarget.percent = evt.currentTarget.getChildAt(0).y / 100, evt.currentTarget.dispatchEvent(new Event(Event.CHANGE)) }

This is a pretty nasty implementation of a basic slider. Just felt like writing some obfuscated code today... It could probably be made even more confusing with some additional tweaks...

Have a look at the swf over at wonderfl...

Posted in UI | Also tagged , | Comments closed