interfaced's picture

Posted by interfaced on February 20, 2008 at 10:12pm

Hey, I've set up a data pipe from Drupal to Flex/Flare using jQuery. Its as easy as this:

1. IN DRUPAL TEMPLATE.PHP
   function phptemplate_views_view_list_{viewname}($view, $nodes, $type) {
   foreach ($nodes as $i => $nid) {
   $node = node_load($nid->nid);
   $output[]= json_encode($node);
   }
   return 'var videos=['.implode(',',$output).']';
   }

2. IN THE HTML-TEMPLATE

function getData(){
$.getScript("http://example.com/view", function(){
/*$(videos).each(function(i){
$('#result').append(''+this.nid+"<\/div>");
});*/
$("#${application}").get(0).initData(videos);
});
}

1. IN FLEX
   ExternalInterface.addCallback("initData", initData);
   ExternalInterface.call('getData');

2. WITH FLARE
   private function initData(nodes:Array):void{

    var w:Number = 800;
    var h:Number = 600;
    var catNode:NodeSprite;
    var n:NodeSprite;
    var n2:NodeSprite;
    var e:EdgeSprite;
    var categories:Array=[];
    var data:Data = new Data();
    var rootNode:NodeSprite = data.addNode({title:'Nodes'});
    var rootCatNode:NodeSprite = data.addNode({title:'Categories'});
    var rootUncatNode:NodeSprite = data.addNode({title:'Uncategorized'});
    data.root=rootNode;
    data.addEdgeFor(rootNode,rootCatNode);
    data.addEdgeFor(rootNode,rootUncatNode);
    for(var j:Number=0;j<nodes.length;j++){
    n = data.addNode(nodes[j]);
    if(nodes[j].taxonomy.length<1){
    data.addEdgeFor(rootUncatNode,n);
    }
    else{
    for each(var cat:Object in nodes[j].taxonomy){
    if(!categories[cat.tid]){
    cat.title=cat.name;
    categories[cat.tid]=data.addNode(cat);
    data.addEdgeFor(rootCatNode,categories[cat.tid]);
    }
    data.addEdgeFor(categories[cat.tid],n);
    }
    }
    }
    vis = new Visualization(data);
    vis.bounds = new Rectangle(0,0,w,h);
    data.nodes.visit(function(ds:DataSprite):Boolean {
    var textSprite:TextSprite = new TextSprite(ds.data['title']);
    textSprite.setTextFormat(new TextFormat("ArnoPro-Regular",20,0xFFFFFF));
    textSprite.y=-textSprite.height+10;
    textSprite.x=ds.width;
    textSprite.textMode = TextSprite.EMBED;
    textSprite.mouseEnabled=false;
    textSprite.textField.selectable=false;
    textSprite.textField.mouseEnabled=false;
    ds.addChild(textSprite);
    return true; 
    });
    for each(catNode in categories){
    catNode.addEventListener(MouseEvent.CLICK,function(e:MouseEvent):void{
    //vis.continuousUpdates = false;
    var n:NodeSprite=NodeSprite(e.target);
    var idx:int;
    if(vis.operators[0].index==2) idx = 3;
    else idx=2;
    vis.operators[0].index = idx;
    var t:Transitioner = new Transitioner(2);
    t.$(vis.marks).x = anchors[idx].x;
    t.$(vis.marks).y = anchors[idx].y;
    t.$(n).fillColor = 0xFFFF9900;
    vis.update(t).play();
    });
    }
    //BUILD VISUALIZATION
    var forcelayout:ForceDirectedLayout=new ForceDirectedLayout();
    //forcelayout.defaultSpringLength=80;
    forcelayout.defaultSpringTension =.00004
    //forcelayout.defaultSpringDamping = .15
    var os:OperatorSwitch = new OperatorSwitch(
    forcelayout,
    new NodeLinkTreeLayout(Layout.LEFT_TO_RIGHT, 24, 5, 10),
    new IndentedTreeLayout(20),
    new RadialTreeLayout(50, false),
    new CircleLayout()
    );
    var anchors:Array = [
    null,
    new Point(40, h/2),
    new Point(40, 40),
    new Point(w/2, h/2),
    new Point(0, 0)
    ];
    os.index = 1;
    vis.marks.x = anchors[1].x;
    vis.marks.y = anchors[1].y;
    vis.operators.add(os);
    vis.data.nodes.visit(function(n:NodeSprite):Boolean {
    n.fillColor = 0x111111; n.fillAlpha = 1;
    n.lineColor = 0x111111; n.lineAlpha = 1;
    n.lineWidth = .2;
    n.size=.5;
    return (n.buttonMode = true);
    });
    vis.data.edges.visit(function(e:EdgeSprite):Boolean {
    e.lineAlpha=1;
    e.lineColor=0xFF111111;
    return true;
    });
    vis.update();
    addChild(vis);
    new PanZoomControl(vis);
    vis.continuousUpdates = true; 
   }
   

   }

This group offers an RSS feed. Or subscribe to these personalized, sitewide feeds: