Tag Archives: as3

Interesting Texture #3 (animated)

Actionscript:
  1. [SWF(frameRate=60, backgroundColor=0x000000, width=500, height=500)]
  2. var canvas:BitmapData = new BitmapData(500,500,false, 0x000000);
  3. addChild(new Bitmap(canvas));
  4. var clone:BitmapData = new BitmapData(500,500,false, 0x000000);
  5. var canvasRect:Rectangle = canvas.rect;
  6. var w:int = canvas.width;
  7. var w2:Number = 1/w;
  8. var w10:Number = 1/(w * 80);
  9. var convert:Number = Math.PI/180;
  10. var size:int = canvas.width * canvas.height;
  11. var pix:Vector.<uint> = new Vector.<uint>(size, true);
  12. var gray:ColorMatrixFilter = new ColorMatrixFilter([1, 0.55, 0.55, 0,0,0.55, 0.9, 0.55, 0,0,0.55, 0.55, 0.550,0, 0,0,0,1,0]);
  13. var m:Matrix = new Matrix();
  14. m.scale(1,-1);
  15. m.translate(0,canvas.height);
  16. var sin:Number = 0, cos:Number = 0;
  17. var dx:Number = 0, dy:Number = 0;
  18. var pnt:Point = new Point();
  19. var blur:BlurFilter = new BlurFilter(10,10,1);
  20. addEventListener(Event.ENTER_FRAME, onLoop);
  21. function onLoop(evt:Event):void {
  22.     canvas.lock();
  23.     dx += (mouseX * 10 - 3000 - dx) / 8;
  24.     dy += (mouseY * 4 - dy) / 8;
  25.     for (var i:int = 0; i<size; i++){
  26.         var xp:int = i % w;
  27.         var yp:int = int(i * w2);
  28.         var xp2:int = xp <<1;
  29.         var t:Number = (yp * (xp2 + dx) * w10) % 3.14687;
  30.         //compute sine
  31.         // technique from http://lab.polygonal.de/2007/07/18/fast-and-accurate-sinecosine-approximation/
  32.         // by Michael Baczynski
  33.         if (t<0) {
  34.             sin=1.27323954*t+.405284735*t*t;
  35.         } else {
  36.             sin=1.27323954*t-0.405284735*t*t;
  37.         }
  38.         // compute cosine
  39.         t = (xp2 + dy) * convert % 6.28;
  40.         t+=1.57079632;
  41.         if (t>3.14159265) {
  42.             t-=6.28318531;
  43.         }
  44.         if (t<0) {
  45.             cos=1.27323954*t+0.405284735*t*t;
  46.         } else {
  47.             cos=1.27323954*t-0.405284735*t*t;
  48.         }
  49.         var c1:int = 31 * (cos - sin);
  50.         if (c1 <0) c1 = 256 - c1;
  51.         c1 = (c1 <<2 | c1) ;
  52.         pix[i] = c1 <<15 | c1 <<9 | c1;
  53.     }
  54.     canvas.setVector(canvasRect, pix);
  55.     clone.copyPixels(canvas, canvasRect, pnt);
  56.     canvas.draw(clone, m, null, BlendMode.SUBTRACT);
  57.     clone.copyPixels(canvas, canvasRect, pnt);
  58.     clone.applyFilter(clone, canvasRect, pnt, blur);
  59.     canvas.draw(clone, null, null, BlendMode.ADD);
  60.     canvas.applyFilter(canvas, canvas.rect, new Point(0,0), gray);
  61.     canvas.unlock();
  62. }

This snippet creates an interactive animated texture. Originally this texture wasn an unoptimized messy code snippet (see the original post here) - I went through and did a few optimizations to get it running in real-time and this is the result:

Check out the swf over at wonderfl.net...

Posted in BitmapData, Vector, color, pixel manipulation | Also tagged , | Leave a comment

QuickBox2D Unicycler

Actionscript:
  1. import com.actionsnippet.qbox.*;
  2. import Box2D.Common.Math.*;
  3. import Box2D.Dynamics.Joints.*;
  4. [SWF (backgroundColor=0x000000, width=700, height=600, frameRate=60)]
  5. var sim:QuickBox2D = new QuickBox2D(this, {debug:false,gravityY:10, renderJoints:false});
  6. sim.setDefault({fillColor:0xCC0000,lineAlpha:0});
  7. sim.createStageWalls();
  8.  
  9. for (var i:int = 0; i<20; i++){
  10.     sim.addCircle({x:1+i * 0.8, y:1, radius:0.1+Math.random()*0.1, restitution:0.3});
  11. }
  12.  
  13. sim.setDefault({fillColor:0xEFEFEF, fillAlpha:0.5, lineColor:0xFFFFFF, groupIndex:-2});
  14. var ancA:QuickObject = sim.addCircle({x:20, y:12, radius:0.5, density:0, skin:"none"});
  15. var ancB:QuickObject = sim.addCircle({x:20, y:2, radius:0.5, density:0, skin:"none"});
  16. var head:QuickObject = sim.addCircle({x:0, y:-0.6, radius:0.5});
  17. var neck:QuickObject = sim.addBox({x:0, y:1, width:0.5, height:2});
  18. var spindle:QuickObject = sim.addBox({x:0, y:3, width:0.1, height:2})
  19. spindle.userData.visible = false;
  20. var top:QuickObject = sim.addGroup({objects:[head, neck, spindle], x:10, y:5, fixedRotation:true});
  21. var upperLegA:QuickObject = sim.addBox({x:10, y:7.5, width:0.25, height:1.5});
  22. var lowerLegA:QuickObject = sim.addBox({x:10, y:9, width:0.25, height:1.5});
  23. var wheel:QuickObject = sim.addCircle({x:10, y:9, radius:1});
  24. var upperLegB:QuickObject = sim.addBox({x:10, y:7.5, width:0.25, height:1.5});
  25. var lowerLegB:QuickObject = sim.addBox({x:10, y:9, width:0.25, height:1.5});
  26. var upperArmA:QuickObject = sim.addBox({x:10.7, y:5.25, width:1.5, height:0.25});
  27. var lowerArmA:QuickObject = sim.addBox({x:11.8, y:5.25, width:1.2, height:0.25});
  28. var upperArmB:QuickObject = sim.addBox({x:9.5, y:5.25, width:1.5, height:0.25});
  29. var lowerArmB:QuickObject = sim.addBox({x:8.4, y:5.25, width:1.2, height:0.25});
  30. var anchor:b2Vec2 = new b2Vec2();
  31. function connect(a:QuickObject, b:QuickObject, lower:Number, upper:Number, offX:Number=0, offY:Number = 0):QuickObject{
  32.      var min:Number = Math.min(a.y, b.y);
  33.      var max:Number = Math.max(a.y, b.y);
  34.      anchor.y = min + (max - min) * 0.5 + offY;
  35.      min = Math.min(a.x, b.x);
  36.      max = Math.max(a.x, b.x);
  37.      anchor.x = min + (max - min) * 0.5 + offX;
  38.      return sim.addJoint({type:"revolute", a:a.body, b:b.body, x1:anchor.x, y1:anchor.y, lowerAngle:lower, upperAngle:upper});
  39. }
  40. sim.addJoint({type:"revolute", a:wheel.body, b:top.body, x1:wheel.x, y1:wheel.y});
  41. sim.addJoint({type:"revolute", a:lowerLegA.body, b:wheel.body, x1:lowerLegA.x, y1:lowerLegA.y + 0.7});
  42. sim.setDefault({enableLimit:true});
  43. connect(top, upperArmA, 0, 3, -.3, .1);
  44. connect(upperArmA, lowerArmA, -2.5, -1, 0, 0);
  45. connect(top, upperArmB, -3, 0, .3, .1);
  46. connect(upperArmB, lowerArmB, -2.5, -1, 0, 0);
  47. sim.addJoint({type:"distance", a:lowerArmA.body, b:ancA.body, frequencyHz:0.3});
  48. sim.addJoint({type:"distance", a:lowerArmB.body, b:ancB.body, frequencyHz:0.3});
  49. sim.setDefault({enableLimit:true});
  50. connect(top, upperLegA, -6.28, 6, 0, 0.8);
  51. connect(upperLegA, lowerLegA, .1, 6);
  52. wheel.angle = Math.PI;
  53. connect(top, upperLegB, -6.28, 6, 0, 0.8);
  54. connect(upperLegB, lowerLegB, .1, 6);
  55. sim.setDefault({enableLimit:false, type:"revolute"});
  56. sim.addJoint({a:lowerLegB.body, b:wheel.body, x1:lowerLegB.x, y1:lowerLegB.y + 0.7});
  57.  
  58. sim.start();
  59. sim.mouseDrag();
  60.  
  61. var sd:Number = 5, s:Number = 0, t:Number = 0;
  62. addEventListener(Event.ENTER_FRAME, function():void{
  63.     top.angle = Math.cos(t += 0.05) * 0.2;
  64.     if (top.x> 19) sd = -5
  65.     if (top.x <5) sd = 5;
  66.     s += (sd - s) / 8;
  67.     wheel.body.SetAngularVelocity(s);
  68. });

This chunk of code uses QuickBox2D to create a simple looking character riding a unicycle...

Have a look at the swf...

Posted in Box2D, QuickBox2D, motion | Also tagged , , , | 9 Comments

QuickBox2D Floating Walker

Actionscript:
  1. import com.actionsnippet.qbox.*;
  2. import Box2D.Common.Math.*;
  3. import Box2D.Dynamics.Joints.*;
  4.  
  5. [SWF (backgroundColor=0x000000, width=700, height=600, frameRate=60)]
  6.  
  7. var sim:QuickBox2D = new QuickBox2D(this, {gravityY:.2});
  8.  
  9. sim.setDefault({fillColor:0xEFEFEF, fillAlpha:0.5, lineColor:0xFFFFFF});
  10.  
  11. sim.createStageWalls();
  12.  
  13. for (var i:int = 0; i<20; i++){
  14.     sim.addCircle({x:1+i, y:1, radius:0.2, restitution:1});
  15. }
  16.  
  17. var head:QuickObject = sim.addCircle({x:0, y:0, radius:0.5});
  18. var neck:QuickObject = sim.addBox({x:0, y:1, width:0.5, height:2});
  19. var top:QuickObject = sim.addGroup({objects:[head, neck], x:10, y:5, fixedRotation:true});
  20.  
  21. var upperLegA:QuickObject = sim.addBox({x:10, y:7.5, width:0.25, height:1.5,groupIndex:-2});
  22. var lowerLegA:QuickObject = sim.addBox({x:10, y:9, width:0.25, height:1.5,groupIndex:-2});
  23.  
  24. var upperLegB:QuickObject = sim.addBox({x:10, y:7.5, width:0.25, height:1.5,groupIndex:-2});
  25. var lowerLegB:QuickObject = sim.addBox({x:10, y:9, width:0.25, height:1.5,groupIndex:-2});
  26.  
  27. var anchor:b2Vec2 = new b2Vec2();
  28. function connect(a:QuickObject, b:QuickObject, lower:Number, upper:Number, offX:Number=0, offY:Number = 0):QuickObject{
  29.      var min:Number = Math.min(a.y, b.y);
  30.      var max:Number = Math.max(a.y, b.y);
  31.      anchor.y = min + (max - min) * 0.5 + offY;
  32.      min = Math.min(a.x, b.x);
  33.      max = Math.max(a.x, b.x);
  34.      anchor.x = min + (max - min) * 0.5 + offX;
  35.      return sim.addJoint({a:a.body, b:b.body, x1:anchor.x, y1:anchor.y, lowerAngle:lower, upperAngle:upper});
  36. }
  37.  
  38. sim.setDefault({type:"revolute", collideConnected:false, enableLimit:true, enableMotor:true, maxMotorTorque:250, lineColor:0xFFFFFF});
  39.  
  40. var upperLegAJoint:QuickObject = connect(top, upperLegA, -1, 1, 0, 0.8);
  41. var upperLegBJoint:QuickObject = connect(top, upperLegB, -1, 1, 0, 0.8);
  42.  
  43. var lowerLegAJoint:QuickObject = connect(upperLegA, lowerLegA, -1, 1);
  44. var lowerLegBJoint:QuickObject = connect(upperLegB, lowerLegB, -1, 1);
  45.  
  46. sim.start();
  47. sim.mouseDrag();
  48.  
  49.  
  50. var j:b2RevoluteJoint;
  51. var t:Number = -Math.PI * 0.5;
  52. addEventListener(Event.ENTER_FRAME, onLoop);
  53. function onLoop(evt:Event):void {
  54.    
  55.     var s1:Number = 1*Math.sin(t);
  56.     var s2:Number = 1*Math.sin(t+Math.PI);
  57.     t+= 0.05;
  58.    
  59.     top.body.SetAngularVelocity(s1 * 0.25);
  60.    
  61.     j =  upperLegAJoint.joint as b2RevoluteJoint;
  62.     j.SetMotorSpeed(s1);
  63.    
  64.     j =  upperLegBJoint.joint as b2RevoluteJoint;
  65.     j.SetMotorSpeed(s2);
  66.      
  67.     j = lowerLegAJoint.joint as b2RevoluteJoint;
  68.     j.SetMotorSpeed(-s2);
  69.    
  70.     j = lowerLegBJoint.joint as b2RevoluteJoint;
  71.     j.SetMotorSpeed(-s1);
  72. }

Experimenting with primitive robot designs... this was just an improvised design - it looks like it may make sense to break out a pencil and some paper - or my wacom... to get something interesting...


Have a look at the swf...


Posted in Box2D, QuickBox2D, motion | Also tagged , , , | 1 Comment

QuickBox2D Prismatic Joint

Actionscript:
  1. import com.actionsnippet.qbox.*;
  2. import Box2D.Common.Math.*;
  3.  
  4. [SWF (backgroundColor=0x000000, width=700, height=600, frameRate=60)]
  5.  
  6. var sim:QuickBox2D = new QuickBox2D(this);
  7.  
  8. sim.setDefault({fillColor:0xCCCCCC, lineColor:0x3355AA});
  9.  
  10. sim.createStageWalls();
  11.  
  12. var box:QuickObject = sim.addBox({x:10, y:10, density:0});
  13. var circle:QuickObject = sim.addCircle({x:10, y:13});
  14.  
  15. sim.addJoint({type:"prismatic", a:box.body, b:circle.body, axis:new b2Vec2(1, 0), upperTranslation:3, lowerTranslation:-3, enableLimit:true, motorSpeed:10, maxMotorForce:10, enableMotor:true});
  16.  
  17. sim.start();
  18. sim.mouseDrag();

Simple prismatic joint demo. Prismatic joints are odd, it took me awhile to realize how to use them and what they can be used for... Plan on using them in the creation of some Box2D machines in the near futrure...

Check out the swf

Posted in Box2D, QuickBox2D, motion | Also tagged , , , | 1 Comment