var speed = 0.3
var amount = 3
var bg_color = "#000"
var bg_color2 = "#000"
var size = 30

var color1 = "rgba(255,255,0,1)";
var color2 = "rgba(0,255,255,1);";


function loader(){
  this.loader_div = $("#loader");

	this.bars = [];
   var root = this;
  
    
  
  
     
	//INIT
	this.stage = new Kinetic.Stage({
		container: "loader",
		width: this.loader_div.width(),
		height: this.loader_div.height(),
	});

  
	this.front_cover = new Kinetic.Layer();
	this.back_cover = new Kinetic.Layer();
	this.inner = new Kinetic.Layer();
	
	   
  
	for(var i=1;i<amount+1;i++){
		var bar = new Kinetic.Wedge({
			x: this.stage.getWidth()/2,
			y: this.stage.getHeight()/2,
			radius: 0,
			angle: 15,
			rotation: (360/amount)*i,
			fill: color1,
			shadowColor: "rgba(0,255,255,0.2)",
		});
		this.bars.push(bar);
		this.inner.add(bar);
	}
  
  
  
	
	this.back_circle = new Kinetic.Circle({
		x: this.stage.getWidth()/2,
		y: this.stage.getHeight()/2,
		radius: 0,
		fill: bg_color2,
		
	})
  
	this.front_circle = new Kinetic.Circle({
		x: this.stage.getWidth()/2,
		y: this.stage.getHeight()/2,
		radius: 0,
		fill: bg_color,
		shadowColor: "rgba(0,0,0,0.5)",
		shadowSize: 10,
	})

  
	this.front_cover.add(this.front_circle);
	this.back_cover.add(this.back_circle);
	this.stage.add(this.back_cover,this.inner,this.front_cover);


  
  


  	this.play = function(){
		TweenLite.to(this.back_circle,speed/3,{
			kinetic:{
				radius: size/2,
			},
		})
		
		TweenLite.to(this.bars,speed/3,{
			kinetic:{
				radius: size/2,
			},
			ease: Power2.easeOut,
		})
		TweenLite.to(this.front_circle,speed/3,{
			delay: 0.1,
			kinetic:{
				radius: size/2.3,
			},
			ease: "Power2.easeOut",
			onComplete: function(){
				root.load_rotate(0,1,0);
			}
		})
	}
    







	var s = speed*1.2;
	this.load_rotate = function(count,r1,r2){
		var r1 = r1;
		var r2 = r2;
		var count = count;
	
		if(count>=1){

			r1 = r1*= -1;
			r2 = 1-r2;
			
			count = 0;
			
		}
		if(r1<0){
			e =  Power1.easeOut;
			f = color1;
		}else{
			e = Power2.easeOut;
			f = color2;
		}
		TweenMax.staggerTo(this.bars,s,{
			kinetic:{
				angle: "+="+((360/amount-40)*r1),
				rotation: "+="+((360/amount+30)*r2),
				fill: f,
			},
			ease: e,

			
		},s/3);

		TweenLite.to(this.loader_div,2,{
			rotationZ: "+="+180,
			ease: Power2.easeOut
		});

		setTimeout(function() {

			root.load_rotate(count+1,r1,r2);
		}, s*1600);
  }
}


$(window).load(function(){
  
   
  var l = new loader();
  l.play();
});