Easy SplitView controller - iPad, Titanium

app.js

var SplitView = require('splitview');


/**
 * SplitView Public Methods:
 * 
 * split.initWithMasterAndDetailWindows( Ti.UI.Window, Ti.UI.Window );
 * split.openInMaster( Ti.UI.Window )
 * split.openInDetail( Ti.UI.Window )
 * split.setMasterWindow( Ti.UI.Window )
 * split.setDetailWindow( Ti.UI.Window )
 * split.open( )
 * split.close( )
 */


var win1 = Ti.UI.createWindow({
	backgroundColor: 'green'
});
var win2 = Ti.UI.createWindow({
	backgroundColor: 'red'
});
var split = new SplitView();

split.initWithMasterAndDetailWindows(win1, win2);

split.open();

splitview.js

function SplitView(){
	this._splitView		= Ti.UI.iPad.createSplitWindow();
	this._masterView	= Ti.UI.iPhone.createNavigationGroup();
	this._detailView	= Ti.UI.iPhone.createNavigationGroup();
	this._detailWindows	= [];
	this._masterWindows	= [];

	this._splitView.setMasterView(this._masterView);
	this._splitView.setDetailView(this._detailView);

	var self = this;
	this._splitView.addEventListener('visible', function(e) {
		if (e.view == 'detail') {
			e.button.title = "List";
	        self._detailView.window.leftNavButton = e.button;          
	    }else if (e.view  == 'master') {
			self._detailView.window.leftNavButton = null;
	    }
	});

}
/**
 * Sets the master and detail windows
 * @param  {Ti.UI.Window} _master - Window on the left side of the splitview
 * @param  {Ti.UI.Window} _detail - Window on the right side of the splitview
 */
SplitView.prototype.initWithMasterAndDetailWindows = function(_master, _detail){
	this._masterView.setWindow(_master);
	this._detailView.setWindow(_detail);
	this._masterWindows.push(_master);
	this._detailWindows.push(_detail);
};

/**
 * Sets the detail window, closing all the windows in it if any
 * @param {Ti.UI.Window} _window - Window to be set on the detail side
 */
SplitView.prototype.setDetailWindow = function(_window){
	var len = this._detailWindows.length;
	while(len--){
		this._detailView.close(this._detailWindows[len],{animated: false});
	}
	if(!this._detailView.window){
		this._detailView.setWindow(_window);
	} else {
		this._detailView.open(_window, {animated: false});
	}
	this._detailWindows.push(_window);
};

/**
 * Sets the master window, closing all the windows in it if any
 * @param {Ti.UI.Window} _window - Window to be set on the master side
 */
SplitView.prototype.setMasterWindow = function(_window){
	var len = this._masterWindows.length;
	while(len--){
		this._masterView.close(this._masterWindows[len],{animated: false});
	}
	this._masterView.setWindow(_window);

	if(!this._masterView.window){
		this._masterView.setWindow(_window);
	} else {
		this._masterView.open(_window, {animated: false});
	}
	this._masterWindows.push(_window);

};

/**
 * Opens the spplitview component
 */
SplitView.prototype.open = function(){
	this._splitView.open();
};

/**
 * Closes the spplitview component
 */
SplitView.prototype.close = function(){
	this._splitView.close();
};

/**
 * Opens a new window in the master section of the splitview
 * @param  {Ti.UI.Window} _window - The window to be opened in the master nav group
 */
SplitView.prototype.openInMaster = function(_window){
	this._masterView.open(_window);
	this._masterWindows.push(_window);
	var self = this;
	_window.addEventListener('close', function(){
		for(var i = 0, len = self._masterWindows.length; i < len; i++){
			if(self._masterWindows[i] == _window){
				self._masterWindows.splice(i,1);
				break;
			}
		}
	});
};

/**
 * Opens a new window in the detail section of the splitview
 * @param  {Ti.UI.Window} _window - The window to be opened in the detail nav group
 */
SplitView.prototype.openInDetail = function(_window){
	this._detailView.open(_window);
	this._detailWindows.push(_window);
	var self = this;
	_window.addEventListener('close', function(){
		for(var i = 0, len = self._detailWindows.length; i < len; i++){
			if(self._detailWindows[i] == _window){
				self._detailWindows.splice(i,1);
				return;
			}
		}
	});
};

module.exports = SplitView;