[AC-1572] iOS: ScrollableView: cacheSize does not work if page views have children...

// window
var win = Ti.UI.createWindow({
	title: 'TEST',
	backgroundColor: '#ffffff'
});


// returns array of remote images (from kitchensink)
function getPhotos() {
	var data = [];
	var baseUrl = 'http://placehold.it/';
	var imageUrl;
	for (i=30;i<40;i++){
		for (j=30;j<40;j++){
			imageUrl = baseUrl+i+'x'+j;
			data.push(imageUrl);
		}
	}	
	return data;
}


// load event for remote image
function img_load(e) {
	Ti.API.info('Loaded remote image ' + e.source.id + ': ' +e.source.image);
}


// postlayout event for view
function view_postlayout(e) {
	Ti.API.info('Post-layout ' + e.source.id);
}


// scrollable view with set cache size set to 3
var pager = Ti.UI.createScrollableView({
	cacheSize: 3
});


// assemble and open
win.add(pager);
win.open();


//
// TEST CASE SELECTOR (1, 2, 3 or 4)
//
var TEST_CASE = 1;


// simulate 2s delayed xhr call to bind scrollable view with data
setTimeout(function() {
	
	var photos = getPhotos(),
		pages = [];	
	
	// TEST CASE BRANCH
	if (TEST_CASE == 1)
	{
		// CACHESIZE WORKS HERE: ONLY 3 VIEWS ARE LOADED
		
		// load empty container views
		for (var i = 0; i < photos.length; i++)
		{	
			// container view
			var cont = Ti.UI.createView({ id: i, width: 300, height: 300, backgroundColor: 'red' });
			cont.addEventListener('postlayout', view_postlayout);
			
			// add container views to list
			pages.push(cont);
		}		
	}
	else if (TEST_CASE == 2)
	{
		// CACHESIZE WORKS HERE: ONLY 3 IMAGES ARE LOADED
		
		// load imageviews directly (no container view)
		for (var i = 0; i < photos.length; i++)
		{	
			// image
			var img = Ti.UI.createImageView({ id: i, image: photos[i], width: 200, height: 200 });
			img.addEventListener('load', img_load);
			
			// add imageview to list
			pages.push(img);
		}			
	}
	else if (TEST_CASE == 3)
	{
		// CACHESIZE DOES NOT WORK HERE: ALL CONTAINERS AND CHILD REMOTE IMAGES ARE LOADED AT ONCE
		
		// load imageviews inside a container view
		for (var i = 0; i < photos.length; i++)
		{	
			// image view
			var img = Ti.UI.createImageView({ id: i, image: photos[i], width: 200, height: 200 });
			img.addEventListener('load', img_load);
			
			// container view
			var cont = Ti.UI.createView({ id: 'container '+i, width: 300, height: 300, backgroundColor: 'blue' });
			cont.addEventListener('postlayout', view_postlayout);
			cont.add(img);
			
			// add container to list
			pages.push(cont);
		}		
	}
	else if (TEST_CASE == 4)
	{
		// CACHESIZE DOES NOT WORK HERE: ALL CONTAINERS AND CHILD VIEWS ARE LOADED AT ONCE
		
		// load view inside a container view
		for (var i = 0; i < photos.length; i++)
		{	
			// child view
			var child = Ti.UI.createView({ id: 'child '+i, width: 200, height: 200, backgroundColor: 'red' });
			child.addEventListener('postlayout', view_postlayout);
			
			// container view
			var cont = Ti.UI.createView({ id: 'container '+i, width: 300, height: 300, backgroundColor: 'blue' });
			cont.addEventListener('postlayout', view_postlayout);
			cont.add(child);
			
			// add container to list
			pages.push(cont);
		}		
	}
	
	// bind pages to scrollable view
	pager.applyProperties({
		views: pages,
		currentPage: 0
	});
	
	
}, 2000);