Twitter Texture Alphabet

By Zevan | August 4, 2009
CLICK HERE TO COPY
Actionscript:
  1. [SWF(width = 1000, height=800, frameRate=60)]
  2.  
  3. // if you don't have flex you'll need to embed this font in your library
  4. [Embed(source="/Library/Fonts/Verdana.ttf", fontFamily="Verdana")]
  5. var Verdana:Class;
  6.  
  7. var canvas:BitmapData = new BitmapData(1000,800,false, 0xFFFFFF);
  8. addChild(new Bitmap(canvas));
  9. var overlay:BitmapData = new BitmapData(1000,800,true, 0x01FFFFFF);
  10.  
  11.  
  12. var txt:TextField = TextField(addChild(new TextField()));
  13. with (txt){
  14.     defaultTextFormat = new TextFormat("Verdana", 10);
  15.     embedFonts = true;
  16.     width = stage.stageWidth-20;
  17.     height = stage.stageHeight-20;
  18.     multiline = true;
  19.     wordWrap = true;
  20.     text ="";
  21.     textColor = 0x444444;
  22.     selectable = false;
  23.     x = y = 10;
  24.     text = "loading...";
  25. }
  26.  
  27.  
  28. var selectWords:Array = [];
  29. var currFirstLetter:String="";
  30. var prevFirstLetter:String="";
  31. var index:int = 0;
  32. var anchorX:Number = 0, anchorY:Number = 0, theta:Number, radius:Number;
  33. addEventListener(Event.ENTER_FRAME, onLoop);
  34. function onLoop(evt:Event):void {
  35.      canvas.copyPixels(overlay, overlay.rect, new Point(0,0), null, null, true);
  36.      var leng:int = selectWords.length;
  37.      if (leng> 0){
  38.          var word:String = selectWords[index % leng];
  39.          trace(word);
  40.          currFirstLetter = word.charAt(0);
  41.          if (currFirstLetter != prevFirstLetter){
  42.              anchorX = Math.random() * (stage.stageWidth - 200) + 100
  43.              anchorY = Math.random() * (stage.stageHeight - 200) + 100;
  44.              theta = Math.random() * Math.PI * 2;
  45.              radius = 50 + Math.random() * 100;
  46.              txt.textColor = [0,0xFFFFFF,0xCCCCCC,0x666666][int(Math.random()*4)];
  47.          }else{
  48.              txt.x = anchorX + radius * Math.cos(theta);
  49.              txt.y = anchorY + radius * Math.sin(theta);
  50.              theta += Math.random() * .1;
  51.              radius += 3;
  52.              txt.scaleX = txt.scaleY = 1 + Math.random();
  53.              if (int(Math.random()*30) == 1) txt.scaleX = txt.scaleY = 1 + Math.random()*10;
  54.              txt.rotation = theta / Math.PI * 180;
  55.              txt.text = word;
  56.              canvas.draw(txt, txt.transform.matrix);
  57.          }
  58.          prevFirstLetter = currFirstLetter;
  59.          index++;
  60.      }
  61. }
  62.  
  63. var loader:URLLoader = new URLLoader();
  64. var req:URLRequest = new URLRequest("http://search.twitter.com/search.atom");
  65. var vars:URLVariables = new URLVariables();
  66. vars.q = "alphabet";
  67. // results per page
  68. vars.rpp = "100";
  69. vars.page = 1;
  70. vars.lang = "en";
  71.  
  72. req.data = vars;
  73. req.method = URLRequestMethod.POST;
  74. loader.load(req);
  75. loader.addEventListener(Event.COMPLETE, onLoaded);                                 
  76. function onLoaded(evt:Event):void{
  77.     var searchData:XML = new XML(loader.data);
  78.     var atom:Namespace = searchData.namespace("");
  79.     default xml namespace = atom;
  80.     var titles:String = "";
  81.     for each(var entry:XML in searchData.entry){
  82.         titles += entry.title.toString();
  83.     }
  84.     var index:int = 0;
  85.     var words:Array = titles.split(" ");
  86.     for (var i:int = 0; i<words.length; i++){
  87.         // exclude a few things
  88.         if (words[i].match(/RT|\@|\#|http/g).length == 0){
  89.             selectWords[index++] = words[i].replace(/\s|\r|\n|\"/g, "");
  90.         }
  91.     }
  92.     selectWords.sort();
  93.     txt.text =""
  94.        removeChild(txt);
  95. }

This snippet draws a texture using a twitter search for the word "alphabet". The results are arranged alphabetically and used to draw a texture.


Have a look at the swf:

This entry was posted in BitmapData, external data, string manipulation, strings and tagged , , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

2 Comments

  1. Art
    Posted September 18, 2009 at 2:43 pm | Permalink

    Quite cool effect !!!..If I were to use a different website for the search such as http://www.google.com, do I just need to change the following code lines:
    ..
    64. var req:URLRequest = new URLRequest(”http://search.twitter.com/search.atom”);
    ..
    66. vars.q = “alphabet”; using a diffenent searching word..such as AS3..

    and to also limit the number of iterations …??..

    Sorry, I am just retaking AS3 coding…

    Thanks and great site. Best regards,

    Art

  2. Zevan
    Posted September 18, 2009 at 4:36 pm | Permalink

    Hey Art,

    Unfortunately no. This uses the Twitter search API, other websites such as google, tublr, flicker etc… all have their own unique API’s and thus the XML will be formatted differently so you’d need to alter the code to read the correct part of the XML… would be cool if that wasn’t the case though :)

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*