Question

I am loading Google API using google.load() and I need to process some of what is built by it, but I need to run the JavaScript after it has already completely loaded, is there a way to ensure that happens?

Here is how I build the list of images, I need to add an attribute to each img tag though, can’t do that until after it is built right?

google.load("feeds", "1");

function initialize() {
    var feed = new google.feeds.Feed("myfeed.rss");

    feed.load(function(result) {
        if (!result.error) {             

            var container = document.getElementById("feed");

            for (var i = 0; i < result.feed.entries.length; i++) {               

               var entry = result.feed.entries[i];

               var entryTitle = entry.title;
               var entryContent = entry.content;

               imgContent = entryContent + "<p>"+entryTitle+"</p>";

               var div = document.createElement("div");
               div.className = "image";               

               div.innerHTML = imgContent;

               container.appendChild(div);
           }
       }
   });
}

google.setOnLoadCallback(initialize);

Answer 1

A simple way to do this is by creating an anonymous function in the setOnLoadCallbacklike so:

google.setOnLoadCallback(function(){

    //Run the Initialize Function
    initialize(function(){
         //Run anything else here like
         alert("My function can run here :)")  
    });
});

and then just modify your initialize function.

function initialize() { > function initialize(callback) { so that you no are passing in an anonymous function to the intialize.

and then within the feed.load(function(result) {}); you can just do callback() to activate your callback.

---

you say that anonymous function confuses you, Let me first show you a few ways to write a function

• function hello(){}
• hello = function(){}

The above are non-anonymous functions

Anonymous functions are functions that are not assigned to a variable, so the parser goes over the function and does not execute it

alert("Start")
function()
{
    alert("Middle")
}
alert("End");

Running the above will show Start and End in a dialog but Middle will never show as the function has not been executed.

Function the following:

( F )( P )

Where F is an anonymous function and P Is the param that should be in the scope, you can directly run anonymous functions without ever assigning to the function to a variable liek so:

alert("Start")
(
    function(Doc){
        alert("Middle");
    }
)(document)
alert("End")

So document gets passed into the anonymous function and becomes Doc in that scope, and Start, Middle and End all will get executed as your using a self executed anonymous function

Ok so I might have gone over the top with the explanation so ill just quickly show you how the original method works

http://en.wikipedia.org/wiki/Ajax_(programming)

Ajax is Asynchronously which means that when your calling a server such as google for some information, your javascript will continue to execute which means while your waiting for data your javscript has carried on executing..

This is why we devoted callbacks just like the initialize callback, which the google Javascript library executes when its got the data, when have create our own and were executing when we want to.