Example from Barebones

alloyForAlf.js

require(['alf'], function (Alf) {
        
    var app, publicationName, url, assetsBaseUrl, listenerCalled;


    app = {
        initialize: function () {
            this.pages = [];

            this.initLayers();
            this.initScrollView();
        },

    
        initLayers: function () {
            this.layerManager = new Alf.layer.Manager();

            this.pageLayer = new Alf.layer.Page({
                el: '#alf-layer-1',
                manager: this.layerManager
            });

            this.fullscreenLayer = new Alf.layer.Fullscreen({
                el: '#alf-layer-2',
                manager: this.layerManager
            });

            this.pageLayer.render();
            this.fullscreenLayer.render();

            Alf.hub.on('fullscreenWillAppear', function () {
                Ti.API.info('going into fullscreen mode')
                Ti.App.fireEvent('alf:fullscreenWillAppear');    
            }, this);

            Alf.hub.on('fullscreenDidDisappear', function () {
                Ti.API.info('exiting  fullscreen mode')
                Ti.App.fireEvent('alf:fullscreenDidDisappear');    
            }, this);        
        },


        initScrollView: function () {
            var that = this;

            this.scrollView = new Alf.nav.ScrollView($('#alf-layer-1').get(0), {

                numberOfPages: app.articles.length,
                 overflowScrolling: true
            });

            Ti.API.info('number of pages '+app.compiledPages.length);

            this.scrollView.on('pageWillRender', function (el, pageNum) {
                app.renderPage(el, pageNum);
            });

            //IMPORTANT - Disable this in Android
            this.scrollView.on('pageWillAppear', function (el, pageNum) {    
                Ti.App.fireEvent('alf:pageWillAppear', { pageNum: pageNum, el: el });             
            });

            this.scrollView.on('pageDidAppear', function (el, pageNum) { 
                Ti.App.fireEvent('alf:pageDidAppear', { pageNum: pageNum, el: el  });
            });

            this.scrollView.on('pageWillDestruct', function (el, pageNum) {
                app.pages[pageNum] && app.pages[pageNum].tearDown();
                delete app.pages[pageNum];
            });

            this.scrollView.start();
        },


        renderPage: function (el, pageNum) {

            var fragment, $el = $(el), pages = [];

            fragment = document.createDocumentFragment();

            Alf._.each(this.articles[pageNum].compiled.pages, function (compiledPage) {
                 var page = new Alf.layout.Page({
                     layer: this.pageLayer,
                    assetsBaseUrl: assetsBaseUrl
                 });


                page.decompile(compiledPage);
                fragment.appendChild(page.el);

                page.$el.find("a").each(function() {
                    var currentLink = $(this).attr('href');
                    Ti.API.log('removed.. '+currentLink);
                 
                    $(this).attr('onclick', "Ti.App.fireEvent('html:openURL', {url: '" + currentLink+"'}); return false");
                    $(this).attr('href','');                    
                });

                 pages.push(page);
            }, this);
 
             $el.empty().append(fragment);
             Alf._.invoke(pages, 'render');
        }
    };



    /*
     * This loads the content into Alf
     * Fired after a successful fetch in index.js
     */
    Ti.App.addEventListener("app:loadpages", function(e) {

        /*
         * Use this event to remove the native loading indicator.
         * To show again then fire app:showLoading.
         * THe event listener can be found in index.js
         */
        Ti.App.fireEvent('app:hideLoading');

        app.compiledPages = [];
        app.pages = {};

        var jsonToLoad =  e.jsonToLoad;

        if (typeof jsonToLoad === "string") {
            jsonToLoad = JSON.parse(jsonToLoad);
        }

        assetsBaseUrl = jsonToLoad.items[0].service.assetsBaseUrl;
        
        jsonToLoad.items.forEach(function (article) {

            article.compiled.pages.forEach(function (page) {
                page.articleId = article.meta.articleId;
                page.title = article.contents.title;
            });
 
            app.compiledPages = app.compiledPages.concat(article.compiled.pages)      
        });

        app.articles = jsonToLoad.items;

        app.initialize();
 
    });

    /*
     * Handles filtered content, almost identical to app:loadpages
     */
    Ti.App.addEventListener("app:loadFilteredContent", function(e) {

        // hide the loading message
        Ti.App.fireEvent('app:hideLoading');
        Ti.App.fireEvent('app:closeSideBar'); 
        
        app.compiledPages = [];
        app.pages = {};

        var jsonToLoadFilter =  e.jsonToLoadFilter;

        if (typeof jsonToLoadFilter === "string") {
            jsonToLoadFilter = JSON.parse(jsonToLoadFilter);
        }


        jsonToLoadFilter.forEach(function (article) {

            article.compiled.pages.forEach(function (page) {
                page.articleId = article.meta.articleId;
                page.title = article.contents.title;
            });

             app.compiledPages = app.compiledPages.concat(article.compiled.pages)   
                 
        });

        app.articles = jsonToLoad.items;
        
        app.scrollView.reset({numberOfPages: app.compiledPages.length});

        // close the sidebar
         Ti.App.fireEvent('alf:loadComplete');
         Ti.App.fireEvent('app:closeSideBar');   

    }); 

    window.app = app;
});