How to integrate Raphael?

Find code here before you post.
Locked
linb
Site Admin
Posts: 102
Joined: Thu Apr 25, 2013 6:51 am

How to integrate Raphael?

Post by linb »

Integrated-Raphael.PNG
Integrated-Raphael.PNG (10.12 KiB) Viewed 7245 times
   
Class('App', 'xui.Com',{
    Instance:{
        iniComponents : function(){
            // [[code created by CrossUI RAD Tools
            var host=this, children=[], append=function(child){children.push(child.get(0))};
            
            append(
                (new xui.UI.Dialog)
                .setHost(host,"ctl_dialog2")
                .setLeft(100)
                .setTop(20)
                .setWidth(320)
                .setHeight(340)
                .setResizer(false)
                .setCaption("How to integrate Raphael?")
                .setMinBtn(false)
                .setMaxBtn(false)
            );
            
            host.ctl_dialog2.append(
                (new xui.UI.Pane)
                .setHost(host,"ctl_pane7")
                .setDomId("RaphaelCanvas")
                .setDock("fill")
            );
            
            return children;
            // ]]code created by CrossUI RAD Tools
        },
        drawRaphael:function(domId){
            var paper = Raphael("RaphaelCanvas", 300, 300);
            paper.clear();
            paper.rect(0, 0, 300, 300, 10).attr({fill: "#fff", stroke: "none"});
            paper.circle(150, 150, 60)
                .animate({fill: "#223fa3", stroke: "#000", "stroke-width": 80, "stroke-opacity": 0.5}, 2000);
        },
        events : {"onReady":"_com_onready"},
        _com_onready : function (com,threadid){
            var ns=this;
            // You can include them in html file
            xui.include("Raphael","http://www.crossui.com/test3parts/rapha ... ",function(){
                ns.drawRaphael("RaphaelCanvas");
            });        
        }
    }
});
Class('App', 'xui.Com',{
    Instance:{
        iniComponents : function(){
            // [[code created by CrossUI RAD Tools
            var host=this, children=[], append=function(child){children.push(child.get(0))};
            
            append(
                (new xui.UI.Dialog)
                .setHost(host,"ctl_dialog2")
                .setLeft(100)
                .setTop(20)
                .setWidth(320)
                .setHeight(340)
                .setResizer(false)
                .setCaption("How to integrate Raphael?")
                .setMinBtn(false)
                .setMaxBtn(false)
            );
            
            host.ctl_dialog2.append(
                (new xui.UI.Pane)
                .setHost(host,"ctl_pane7")
                .setDomId("RaphaelCanvas")
                .setDock("fill")
            );
            
            return children;
            // ]]code created by CrossUI RAD Tools
        },
        drawRaphael:function(domId){
            var paper = Raphael("RaphaelCanvas", 300, 300);
            paper.clear();
            paper.rect(0, 0, 300, 300, 10).attr({fill: "#fff", stroke: "none"});
            paper.circle(150, 150, 60)
                .animate({fill: "#223fa3", stroke: "#000", "stroke-width": 80, "stroke-opacity": 0.5}, 2000);
        },
        events : {"onReady":"_com_onready"},
        _com_onready : function (com,threadid){
            var ns=this;
            // You can include them in html file
            xui.include("Raphael","http://www.crossui.com/test3parts/rapha ... ",function(){
                ns.drawRaphael("RaphaelCanvas");
            });        
        }
    }
});
   

Locked