slide-to-unlock.js

// Titanium Mobile code for slider control functionality
//----------------------------------------
// @CJ_Reed 23rd Dec 2010

var sliderView = Titanium.UI.createView({top:100,height:50,left: 40,width:240,backgroundColor:'#000'});
var sliderButton = Titanium.UI.createView({width:96,borderRadius:5,backgroundColor:'#bbb',height:sliderView.height,left:sliderView.left,top:sliderView.top});
Titanium.UI.currentWindow.add(sliderView);
Titanium.UI.currentWindow.add(sliderButton);

function unlock (){
	// function triggered when slider 'unlocks'
	var msgbox = Titanium.UI.createAlertDialog({title:'Unlock', message:'unlock function fired...'});
	msgbox.show();
};

sliderButton.addEventListener('touchmove', function(e) 
{	var moveX = e.x + sliderButton.animatedCenter.x - sliderButton.width/2; 
	if (moveX + sliderButton.width/2 >= sliderView.left + sliderView.width)
	{	// button right-edge stop
		moveX = sliderView.left + sliderView.width - (sliderButton.width/2);
	}
	else if (moveX - sliderButton.width/2 <= sliderView.left)
	{	// button left-edge stop
		moveX = sliderView.left + (sliderButton.width/2);
	}	
	sliderButton.animate({center:{x:moveX,y:(sliderButton.top+(sliderButton.height/2))}, duration:1});
});

sliderButton.addEventListener('touchend', function(e) 
{	var endX = sliderButton.animatedCenter.x + (sliderButton.width/2);
	if (endX ==  sliderView.left + sliderView.width)
	{	// button released at right-edge stop
		unlock();
	};
	//springback
	sliderButton.animate({center:{x:(sliderView.left+sliderButton.width/2),y:(sliderButton.top+(sliderButton.height/2))}, duration:300}); 
});