Tag Archives: actionscript

Connect The Dots E8

By Zevan | March 19, 2010
CLICK HERE TO COPY
Actionscript:
  1. [SWF(width = 500, height = 500)]
  2. const TWO_PI:Number = Math.PI * 2;
  3. var centerX:Number = stage.stageWidth / 2;
  4. var centerY:Number = stage.stageHeight / 2;
  5. addEventListener(Event.ENTER_FRAME, onLoop);
  6. function onLoop(evt:Event):void{
  7.     // data
  8.     var points:Array = [];
  9.     var i:int = 0;
  10.     var pointNum : int = Math.max(2,int(mouseX / 12))
  11.    
  12.     var radius:Number = 200;
  13.     var step:Number = TWO_PI / pointNum;
  14.     var theta:Number = step / 2;
  15.     for (i = 0; i<pointNum; i++){
  16.         var xp:Number = centerX + radius * Math.cos(theta);
  17.         var yp:Number = centerY + radius * Math.sin(theta);
  18.         points[i] = new Point(xp, yp);
  19.         theta += step;
  20.     }
  21.     // render
  22.     graphics.clear();
  23.     graphics.lineStyle(0,0);
  24.     for ( i = 0; i<pointNum; i++){
  25.      var a:Point = points[i];
  26.      for (var j:int = 0; j<pointNum; j++){
  27.         var b:Point = points[j];
  28.         if (a != b){
  29.            graphics.drawCircle(a.x, a.y, 10);
  30.            graphics.moveTo(a.x, a.y);
  31.            graphics.lineTo(b.x, b.y);
  32.         }
  33.      }
  34.    }
  35. }

I've been using this geometric shape for lots of different things recently. Including during consulting gigs as a helpful visualization. Just move your mouse left and right... I particularly like the simpler forms you get by moving your mouse to the left (triangles squares and simple polygons):

While not entirely related this wikipedia article is interesting.

[EDIT : Thanks to martin for reminding me that I can do away with the if statement here in the above code ]

CLICK HERE TO COPY
Actionscript:
  1. graphics.clear();
  2. graphics.lineStyle(0,0);
  3. for (i = 0; i<pointNum; i++) {
  4.     var a:Point=points[i];
  5.     for (var j:int = i+1; j<pointNum; j++) {
  6.         var b:Point=points[j];
  7.         graphics.drawCircle(a.x, a.y, 10);
  8.         graphics.moveTo(a.x, a.y);
  9.         graphics.lineTo(b.x, b.y);
  10.     }
  11. }
  12. graphics.drawCircle(a.x, a.y, 10);

I implemented that change over at wonderfl and it works nicely

Posted in Graphics, Math, misc | Also tagged , | 4 Comments

Nonsense Clocks

By Zevan | March 15, 2010
CLICK HERE TO COPY
Actionscript:
  1. [SWF(width = 500, height=500, backgroundColor=0x000000)]
  2.  
  3. var clockNum:int = 100;
  4. var clocks:Vector.<Function> = new Vector.<Function>(clockNum, true);
  5.  
  6. var clockContainer:Sprite = Sprite(addChild(new Sprite()));
  7. clockContainer.x = stage.stageWidth / 2;
  8. clockContainer.y = stage.stageHeight / 2;
  9. buildClocks();
  10. runClocks();
  11.  
  12. function buildClocks():void{
  13.     for (var i:int = 0; i<clockNum; i++){
  14.         var theta:Number = Math.random() * Math.PI * 2;
  15.         var radius:Number = Math.random() * 200;
  16.         var xp:Number = radius * Math.cos(theta);
  17.         var yp:Number = radius * Math.sin(theta);
  18.         clocks[i] = makeClock(xp,yp,Math.random() * Math.PI * 2);
  19.     }
  20. }
  21. function runClocks():void{
  22.     addEventListener(Event.ENTER_FRAME, onRunClocks);
  23. }
  24. function onRunClocks(evt:Event):void{
  25.     for (var i:int = 0; i<clockNum; i++){
  26.         clocks[i]();
  27.     }
  28.     clockContainer.rotationX = clockContainer.mouseY / 30;
  29.     clockContainer.rotationY = -clockContainer.mouseX / 30;
  30. }
  31. function makeClock(x:Number, y:Number, time:Number=0):Function{
  32.     var radius:Number = Math.random() * 20 + 5;
  33.     var border:Number = radius * 0.2;
  34.     var smallRadius:Number = radius - radius * 0.3;
  35.    
  36.     var clock:Sprite = Sprite(clockContainer.addChild(new Sprite()));
  37.     clock.x = x;
  38.     clock.y = y;
  39.     clock.z = 100 - Math.random() * 200;
  40.     clock.rotationX = Math.random() * 40 - 20;
  41.     clock.rotationY = Math.random() * 40 - 20;
  42.     clock.rotationZ = Math.random() * 360;
  43.     return function():void{
  44.         with (clock.graphics){
  45.             clear();
  46.             lineStyle(1,0xFFFFFF);
  47.             drawCircle(0,0,radius + border);
  48.             var xp:Number = smallRadius * Math.cos(time/2);
  49.             var yp:Number = smallRadius * Math.sin(time/2);
  50.             moveTo(0,0);
  51.             lineTo(xp, yp);
  52.             xp = radius * Math.cos(time);
  53.             yp = radius * Math.sin(time);
  54.             moveTo(0,0);
  55.             lineTo(xp, yp);
  56.         }
  57.         time+=0.1;
  58.     }
  59. }


You can go check the swf out at wonderfl.net...

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

Clock Quiz

By Zevan | March 14, 2010

Here is a quick sunday quiz. Create some kind of clock with as little code as possible. Even just a textfield and the date object would cut it, but preferably try to do something a little more interesting. Post your results in the comments. I'll post my version on monday EOD.

[EDIT: my clock can be found here which I'll count as tomorrows post]

The last clock post I did was about the 24 hour clock have a look at that here.

Posted in Quiz | Also tagged , , | 19 Comments

Haskell Inspired zipWith() Function

By Zevan | March 12, 2010
CLICK HERE TO COPY
Actionscript:
  1. initOperators();
  2.  
  3. trace(zipWith("-", [1,2,3], [1,2,3]));
  4. trace(zipWith("+", [1,2,3], [1,2,3]));
  5. trace(zipWith("*", [1,2,3], [1,2,3]));
  6. trace(zipWith("+", [1,1,1,3], [4,5,6,7]));
  7. trace(zipWith("<<", [2, 4], [1,1]));
  8. /*
  9. outputs:
  10.  
  11. 0,0,0
  12. 2,4,6
  13. 1,4,9
  14. 5,6,7,10
  15. 4,8
  16. */
  17.  
  18. function zipWith(op:String, a:Array, b:Array):Array{
  19.     var aLeng:int = a.length;
  20.     var bLeng:int = b.length;
  21.     var leng:Number = (aLeng <bLeng) ? aLeng : bLeng;
  22.     var zipped:Array = [];
  23.    
  24.     if (!this[op])return [];
  25.    
  26.     for (var i:int = 0; i<leng; i++){
  27.         zipped[i]=this[op](a[i], b[i]);
  28.     }
  29.     return zipped;
  30. }
  31.  
  32. function initOperators():void{
  33.     this["+"]=function(a:Number, b:Number):Number{ return a + b };
  34.     this["-"]=function(a:Number, b:Number):Number{ return a - b };
  35.     this["/"]=function(a:Number, b:Number):Number{ return a / b };
  36.     this["*"]=function(a:Number, b:Number):Number{ return a * b };
  37.     this["%"]=function(a:Number, b:Number):Number{ return a % b };
  38.    
  39.     this["&"]=function(a:Number, b:Number):Number{ return a & b };
  40.     this["<<"]=function(a:Number, b:Number):Number{ return a <<b };
  41.     this["|"]=function(a:Number, b:Number):Number{ return a | b };
  42.     this[">>"]=function(a:Number, b:Number):Number{ return a>> b };
  43.     this[">>>"]=function(a:Number, b:Number):Number{ return a>>> b };
  44.     this["^"]=function(a:Number, b:Number):Number{ return a ^ b };
  45. }

This snippet is basically like the haskell zipWith() function. It can combines two arrays into one array given a single function. In this case I defined a bunch of operator functions, but it would work with any kind of function that takes two arguments and returns a value. You could extend this to work with strings and do other strange things I guess.

If you have yet to go play with haskell ... go do it now.

Posted in Number, Operators, arrays, binary, functions, misc, return values | Also tagged , , | 2 Comments