backgroundImage transition

transition background

function transition(){
  var self = Titanium.UI.createWindow({
		backgroundColor:'#c9c9c9',
	});
	var backs = Titanium.UI.createView({
		backgroundImage:'/images/back1.png',
		top:-30,
		left:-30,
		bottom:0,
		right:0,
		opacity:0,
	})
	self.add(backs);

	var gradient = Titanium.UI.createView({
		top:0,
		bottom:0,
		left:0,
		right:0,
		opacity:0.3,
		backgroundGradient:{type:'linear',
			colors:['#fff','#000'],
			startPoint:{x:'100%',y:0},
			endPoint:{x:'100%',y:'100%'}
		}
	})



	setTimeout(function() {
		self.fireEvent('ciclo');
	}, 1000);

	self.addEventListener('ciclo', function(e){

		backs.backgroundImage = '/images/back1.png';
		var inicio = Ti.UI.createAnimation({opacity:1, duration:500,});
		var primero = Ti.UI.createAnimation({opacity:0, duration:5000,left:0, right:-30});
		var segundo = Ti.UI.createAnimation({opacity:1, duration:500, });
		var tercero = Ti.UI.createAnimation({opacity:0, duration:5000,left:0, right:-30});
		var cuarto = Ti.UI.createAnimation({opacity:1, duration:500,});
		var quinto = Ti.UI.createAnimation({opacity:0, duration:5000,left:0, right:-30});
		var sexto = Ti.UI.createAnimation({opacity:1, duration:500,});
		var septimo = Titanium.UI.createAnimation({opacity:0, duration:5000, left:0, right:-30});


		
		backs.animate(inicio);
		
		inicio.addEventListener('complete', function(e){
			backs.animate(primero);
			backs.backgroundImage = '/images/back1.png';
		});


		primero.addEventListener('complete', function() {
			backs.animate(segundo);
			backs.backgroundImage = '/images/back2.png';
			backs.left = -30;
			backs.right = 0;
		});

		segundo.addEventListener('complete', function(e){
			backs.animate(tercero);
		});

		tercero.addEventListener('complete', function(e){
			backs.animate(cuarto);
			backs.backgroundImage = '/images/back3.png';
			backs.left = -30;
			backs.right = 0;
		});

		cuarto.addEventListener('complete', function(e){
			backs.animate(quinto);
		});

		quinto.addEventListener('complete', function(e){
			backs.animate(sexto);
			backs.backgroundImage = '/images/back4.png';
			backs.left = -30;
			backs.right = 0;
		})

		sexto.addEventListener('complete', function(e){
			backs.animate(septimo);
		});


		septimo.addEventListener('complete', function(e){
			backs.backgroundImage = '/images/back1.png';
			self.fireEvent('ciclo');
		});
	});	

	Titanium.App.addEventListener('reinciarCiclo', function(e){
		self.fireEvent('ciclo');
	})



	self.add(gradient);

	
	return self;
}
module.exports = transition;