var demo = {
	colorIndex:0,
	interval:0,
	element:null,
	getRandom:function(){
		return Math.ceil(Math.random()*4) + 2;
	},
	color:function(){
		var colors = ["#EFEFEF", "#F00", "#0F0", "#00F", "#000", "#EFEFEF"];
		bytefx.color(
			document.getElementById("text"),
			"color",
			colors[demo.colorIndex],
			colors[++demo.colorIndex],
			1,
			demo.color
		);
		if(demo.colorIndex + 1 === colors.length)
			demo.colorIndex = 0;
	},
	color1:function(){
		bytefx.color(demo.element, "backgroundColor", "#EFEFEF", "#000", demo.getRandom(), demo.move3);
	},
	color2:function(){
		bytefx.color(demo.element, "backgroundColor", "#000", "#36F", demo.getRandom(), demo.color3);
	},
	color3:function(){
		bytefx.color(demo.element, "backgroundColor", "#36F", "#EFEFEF", demo.getRandom(), demo.fade1);
	},
	fade1:function(){
		bytefx.fade(demo.element, 100, 30, demo.getRandom(), demo.size1);
	},
	fade2:function(){
		bytefx.fade(demo.element, 30, 0, demo.getRandom(), demo.fade3);
	},
	fade3:function(){
		bytefx.fade(demo.element, 0, 60, demo.getRandom(), demo.size2);
	},
	fade4:function(){
		bytefx.fade(demo.element, 60, 100, demo.getRandom(), demo.color1);
	},
	fade5:function(){
		bytefx.fade(demo.element, 30, 100, 9, demo.color3);
	},
	move1:function(){
		bytefx.move(demo.element, {x:300,y:200}, demo.getRandom(), demo.fade2);
	},
	move2:function(){
		bytefx.move(demo.element, {x:500,y:30}, demo.getRandom(), demo.fade4);
	},
	move3:function(){
		bytefx.move(demo.element, {x:10,y:10}, demo.getRandom(), demo.color2);
	},
	move4:function(){
		bytefx.move(demo.element, {x:10,y:10}, 9, demo.fade5);
	},
	size1:function(){
		bytefx.size(demo.element, {width:240,height:300,$width:26,$height:26,height$:26}, demo.getRandom(), demo.move1);
	},
	size2:function(){
		bytefx.size(demo.element, {width:240,height:40,$width:26,$height:26,height$:26}, demo.getRandom(), demo.move2);
	},
	size3:function(){
		bytefx.size(demo.element, {width:240,height:40,$width:26,$height:26,height$:26}, 9, demo.move4);
	},
	start:function(element){
		this.element = element;
		this.fade1();
		this.color();
		bytefx.drag(this.element,function(){
				bytefx.clear(demo.element)
				// you could clear span clor too
				// [i.e. bytefx.clear(document.getElementById("text"))]
			},					
			function(){
				demo.size3()
			}
		);
	}
}; 
onload = function() {
	demo.start(document.getElementById("bytefx"));
};