before and after: alloy

app.js

var Alloy = require("alloy"), _ = Alloy._, A$ = Alloy.A, M$ = Alloy.M, BC$ = Alloy.Backbone.Collection, TFL$ = Ti.UI.FILL, TSZ$ = Ti.UI.SIZE, $ = {};

$.master = A$(Ti.UI.createWindow({
    backgroundColor: "white",
    layout: "vertical",
    id: "master"
}), "Window"), $.table = A$(Ti.UI.createTableView({
    id: "table"
}), "TableView", $.master), $.master.add($.table), function(exports) {
    $.table.setData([ Ti.UI.createTableViewRow({
        title: "Alcatraz",
        image: "smallpic1.jpg"
    }), Ti.UI.createTableViewRow({
        title: "American Flag",
        image: "smallpic2.jpg"
    }), Ti.UI.createTableViewRow({
        title: "Penitentiary Sign",
        image: "smallpic3.jpg"
    }) ]), $.table.addEventListener("click", function(e) {
        exports.fireEvent("rowClick", {
            image: e.row.image
        });
    });
}($.master)

app_for_master.js

/**
 * Alloy for Titanium by Appcelerator
 * This is generated code, DO NOT MODIFY - changes will be lost!
 * Copyright (c) 2012 by Appcelerator, Inc.
 */
var Alloy = require("alloy"), _ = Alloy._, A$ = Alloy.A, M$ = Alloy.M, BC$ = Alloy.Backbone.Collection, TFL$ = Ti.UI.FILL, TSZ$ = Ti.UI.SIZE, $ = {};

$.master =  require('alloy/components/master').create();

// from index.js

// I use the convenience function on the component object to open the master view, but I could also have done:
// $.master.self.open();
$.master.open(); 
$.master.doAlert();

master.js

var Alloy = require("alloy"), _ = Alloy._, A$ = Alloy.A, M$ = Alloy.M, BC$ = Alloy.Backbone.Collection;;

var Lifecycle = {};

Lifecycle.beforeCreate = function($) {
    Ti.API.info('beforeCreate');
};
Lifecycle.afterCreate = function($) {
    Ti.API.info('afterCreate');

    // prints 'white'
    Ti.API.info($.self.backgroundColor);
};

exports.create = function(args) {
    var $ = {};
    args = args || {};
	
    Lifecycle.beforeCreate($);
	
    // generated from markup
    $.master = A$(Ti.UI.createWindow({
        backgroundColor: "white",
        layout: "vertical",
        id: "master"
    }), "Window");
    $.table = A$(Ti.UI.createTableView({
        id: "table"
    }), "TableView", $.master); 
    $.master.add($.table);
    
    // generated from controller
    $.table.setData([ Ti.UI.createTableViewRow({
        title: "Alcatraz",
        image: "smallpic1.jpg"
    }), Ti.UI.createTableViewRow({
        title: "American Flag",
        image: "smallpic2.jpg"
    }), Ti.UI.createTableViewRow({
        title: "Penitentiary Sign",
        image: "smallpic3.jpg"
    }) ]); 
    $.table.addEventListener("click", function(e) {
        $.master.fireEvent("rowClick", {
            image: e.row.image
        });
    });
    
    // custom function exposed from component object
    $.doAlert = function() {
    	alert('i did an alert');
    };

    // custom function to make opening the top level window simpler
    $.open = function(o) {
        $.self.open(o);
    }
    
    // extend component object with IDed UI elements
    Lifecycle.afterCreate($);

    return $;
}