[TIMOB-8995] IOS: Add paging control customization

   // this sets the background color of the master UIView (when there are no windows/tab groups on it)
   Titanium.UI.setBackgroundColor('#000');
     
   // create tab group
   var tabGroup = Titanium.UI.createTabGroup();
     
     
   //
   // create base UI tab and root window
   //
   var win = Titanium.UI.createWindow({  
       title:'SCROLLVIEW',
       backgroundColor:Ti.UI.iOS.COLOR_SCROLLVIEW_BACKGROUND
   });
   var tab1 = Titanium.UI.createTab({  
       icon:'KS_nav_views.png',
       title:'SCROLLVIEW',
       window:win
   });
     
   function getOrientation(o)
   {  //Came from orientation.js, but we didn't need the buttons and such
   	switch (o)
   	{
   		case Titanium.UI.PORTRAIT:
   			return 'portrait';
   		case Titanium.UI.UPSIDE_PORTRAIT:
   			return 'upside portrait';
   		case Titanium.UI.LANDSCAPE_LEFT:
   			return 'landscape left';
   		case Titanium.UI.LANDSCAPE_RIGHT:
   			return 'landscape right';
   		case Titanium.UI.FACE_UP:
   			return 'face up';
   		case Titanium.UI.FACE_DOWN:
   			return 'face down';
   		case Titanium.UI.UNKNOWN:
   			return 'unknown';
   	}
   }
   
   
   
   // initialize to all modes
   win.orientationModes = [
   	Titanium.UI.PORTRAIT,
   	Titanium.UI.LANDSCAPE_LEFT,
   	Titanium.UI.LANDSCAPE_RIGHT
   ];
   
   
   //
   // orientation change listener
   //
   Ti.Gesture.addEventListener('orientationchange',function(e)
   {
   
   	// get orienation from event object
   	var orientation = getOrientation(e.orientation);
   });
   
   var view1 = Ti.UI.createView({
   	backgroundColor:'red'
   });
   var l1 = Ti.UI.createLabel({
   	text:'View 1',
   	color:'#fff',
   	width:'auto',
   	height:'auto'
   });
   view1.add(l1);
   
   var view2 = Ti.UI.createView({
   	backgroundColor:'blue'
   });
   var l2 = Ti.UI.createLabel({
   	text:'Click Me (View 2 - see log)',
   	color:'#fff',
   	width:'auto',
   	height:'auto'
   });
   view2.add(l2);
   
   var view3 = Ti.UI.createView({
   	backgroundColor:'green'
   });
   var l3 = Ti.UI.createLabel({
   	text:'View 3',
   	color:'#fff',
   	width:'auto',
   	height:'auto'
   });
   view3.add(l3);
   
   var view4 = Ti.UI.createView({
   	backgroundColor:'black'
   });
   var l4 = Ti.UI.createLabel({
   	text:'View 4',
   	color:'#fff',
   	width:'auto',
   	height:'auto'
   });
   view4.add(l4);
   
   
   var scrollView = Titanium.UI.createScrollableView({
   	views:[view1,view2,view3,view4],
   	showPagingControl:true,
   	pagingControlHeight:30,
   	maxZoomScale:2.0,
   	currentPage:1,
   	backgroundColor:'grey',
   	
   });
   
   win.add(scrollView);
   
   var i=1;
   var activeView = view1;
   
   scrollView.addEventListener('scroll', function(e)
   {
   	activeView = e.view;  // the object handle to the view that is about to become visible
   	i = e.currentPage;
   	Titanium.API.info("scroll called - current index " + i + ' active view ' + activeView);
   });
   scrollView.addEventListener('click', function(e)
   {
   	Ti.API.info('ScrollView received click event, source = ' + e.source);
   });
   scrollView.addEventListener('touchend', function(e)
   {
   	Ti.API.info('ScrollView received touchend event, source = ' + e.source);
   });
   
   // add button to dynamically add a view
   var alpha = Titanium.UI.createButton({
   	title:'1.0',
   	style:Titanium.UI.iPhone.SystemButtonStyle.BORDERED
   });
   alpha.addEventListener('click',function()
   {
   	scrollView.pagingControlAlpha = 1.0;
   });
   var alphaoff = Titanium.UI.createButton({
   	title:'0.0',
   	style:Titanium.UI.iPhone.SystemButtonStyle.BORDERED
   });
   alphaoff.addEventListener('click',function()
   {
   	scrollView.pagingControlAlpha = 0.0;
   });
   var alphahalfoff = Titanium.UI.createButton({
   	title:'0.5',
   	style:Titanium.UI.iPhone.SystemButtonStyle.BORDERED
   });
   alphahalfoff.addEventListener('click',function()
   {
   	scrollView.pagingControlAlpha = 0.5;
   });
   // jump button to dynamically change go directly to a page (non-animated)
   var jump = Titanium.UI.createButton({
   	title:'Jump',
   	style:Titanium.UI.iPhone.SystemButtonStyle.BORDERED
   });
   jump.addEventListener('click',function()
   {
   	i = (scrollView.currentPage + 1) % scrollView.views.length;
   	scrollView.currentPage = i;
   });
   
   // change button to dynamically change a view
   var top = Titanium.UI.createButton({
   	title:'top',
   	style:Titanium.UI.iPhone.SystemButtonStyle.BORDERED
   });
   top.addEventListener('click',function()
   {
   	scrollView.pagingControlOnTop = true;
   });
   var bottom = Titanium.UI.createButton({
   	title:'bottom',
   	style:Titanium.UI.iPhone.SystemButtonStyle.BORDERED
   });
   bottom.addEventListener('click',function()
   {
   	scrollView.pagingControlOnTop = false;
   });
   var overlaytrue = Titanium.UI.createButton({
   	title:'OvrT',
   	style:Titanium.UI.iPhone.SystemButtonStyle.BORDERED
   });
   overlaytrue.addEventListener('click',function()
   {
   	scrollView.overlayEnabled = true;
   });
   var overlayfalse = Titanium.UI.createButton({
   	title:'OvrF',
   	style:Titanium.UI.iPhone.SystemButtonStyle.BORDERED
   });
   overlayfalse.addEventListener('click',function()
   {
   	scrollView.overlayEnabled = false;
   });
   // move scroll view left
   var left = Titanium.UI.createButton({
   	image:'../images/icon_arrow_left.png'
   });
   left.addEventListener('click', function(e)
   {
   	if (i === 0){ return; }
   	i--;
   	scrollView.scrollToView(i);
   });
   
   // move scroll view right
   var right = Titanium.UI.createButton({
   	image:'../images/icon_arrow_right.png'
   });
   right.addEventListener('click', function(e)
   {
   	if (i === (scrollView.views.length-1)){ return; }
   	i++;
   	scrollView.scrollToView(scrollView.views[i]);
   });
   var checkValuesOnConsole = Titanium.UI.createButton({
   	title:'check',
   	style:Titanium.UI.iPhone.SystemButtonStyle.BORDERED
   });
   checkValuesOnConsole.addEventListener('click',function()
   {
   	Ti.API.info("pagingControlAlpha : "+scrollView.pagingControlAlpha);
   	Ti.API.info("pagingControlOnTop : "+scrollView.pagingControlOnTop);
   	Ti.API.info("overlayEnabled : "+scrollView.overlayEnabled);
   	//Ti.API.info("pagingControlHeight"+scrollView.pagingControlHeight);
   	//Ti.API.info("showPagingControl"+scrollView.showPagingControl);
   });
   
   if (Titanium.Platform.osname == 'iphone' || Titanium.Platform.osname == 'ipad')
   {
   	// set toolbar
   	win.setToolbar([alpha,alphahalfoff,alphaoff,overlaytrue,overlayfalse,checkValuesOnConsole]);
   }
   win.setRightNavButton(top);
   win.setLeftNavButton(bottom);
   
   //
   tabGroup.addTab(tab1);  
   
     
    
     
   // open tab group
   tabGroup.open();