Search code examples
titaniumappcelerator

Getting post objects from ACS with photo_id


I'm developing an App that gets data from ACS, the post objects. In my app there is button and when the users click that button it get the posts data. In every post there is also a photo_id, which allows me to get the photo url from the cloud. But there is a problem, it has a callback function and by the time the callback occurs it is too late.

Anyway, the code below only shows the last post with a photo, the first post doesn't have a photo. (there are only 2 post objects so far).

I believe the problem is in the callback, but I can't seem to fix it.

Hope you guys can help me out, thanks in advance!

Here is my code:

function getCarsClick() {


Cloud.Posts.query({
    page: 1,
    per_page: 20

}, function (e) {
    if (e.success) {

        var tableData = [];


        for (var i = 0; i < e.posts.length; i++) {


            var post = e.posts[i];


            var row = Titanium.UI.createTableViewRow();

            var title = Titanium.UI.createLabel({
            text:post.title,
            font:{fontSize:18,fontWeight:'bold'},
            color:'#ef349d',
            width:'auto',
            textAlign:'left',
            top:2,
            left:40,
            height:30
            });

            var subtitle =  Titanium.UI.createLabel({
            text:post.content,
            font:{fontSize:12,fontWeight:'normal'},
            color:'#000000',
            width:'auto',
            textAlign:'left',
            bottom:10,
            left:60,
            height:32
            });



            row.add(title);
            row.add(subtitle);
            row.hasChild=true;
            row.height = 80;
            row.selectedBackgroundColor = '#ef349d';




            Cloud.Photos.show({
                photo_id: post.photo_id
            }, function (e) {
                if (e.success) {
                    var photo = e.photos[0];


                    var img1 = Ti.UI.createImageView({image:photo.urls.square_75,width:30,height:30,left:2, top:2});
                    row.add(img1);

                } else {
                    alert('Error:\n' +
                        ((e.error && e.message) || JSON.stringify(e)));

                }


            });


            tableData.push(row);


        }


        //add table data
        $.tableview1.setData(tableData);


    } else {
        alert('Error:\n' +
            ((e.error && e.message) || JSON.stringify(e)));
    }
});

}


Solution

  • If you pass a photo into the post using the default parameter provided, the image should come back by default and not require you to make an additonal API call to get the photo.

    I would also suggest if you are just starting out to use Alloy and more importantly use ListViews not TableView

    https://github.com/aaronksaunders/AppC-Alloy-Book-Misc