Analyzing the Amazon Universal WishList Bookmarklet

Amazon added a nifty Universal Wishlist function to their site back in August but I just discovered it today (thanks Yuriy!).  Essentially it is a personalized bookmarklet/favelet that injects code into any page, letting you add any and everything to your Amazon wishlist.

The code for the bookmarklet is this:

javascript:(function(){var%20w=window,l=w.location,d=w.document,s=d.createElement('script'),e=encodeURIComponent,x='undefined',u='http://www.amazon.com/gp/wishlist/add';if(typeof%20s!='object')l.href=u+'?u='+e(l)+'&t='+e(d.title);function%20g(){if(d.readyState&&d.readyState!='complete'){setTimeout(g,200);}else{if(typeof%20AUWLBook==x)s.setAttribute('src',u+'.js?loc='+e(l)),d.body.appendChild(s);function%20f(){(typeof%20AUWLBook==x)?setTimeout(f,200):AUWLBook.showPopover();}f();}}g();}())

Not very readable – so I decided to expand it.  I added linebreaks, and in some cases vars, {}s and in one case changed a tertiary conditional to a regular if..else statement:

//javascript:
(function() {

    //order of execution:
    //1. Initialization
    //2. Script check
    //3. Load remote script
    //4. Execute remote script


    //***Initialization ***
    //create short aliases for common objects
    var w = window, l = w.location, d = w.document;
    //create a script element and give it a short alias
    var s = d.createElement('script');
    //create some more short aliases...
    var e = encodeURIComponent, x = 'undefined';
    var u = 'http://www.amazon.com/gp/wishlist/add';

    //***Script check ***
    //if the script element was not properly created...
    if (typeof s != 'object') {
        //..navigate to the Wishlist add page, passing along the current page url and title
        l.href = u + '?u=' + e(l) + '&t=' + e(d.title);
        //effectively ends the script
    }

    //...else (script successfully created)

    //*** Load remote script ***
    //create a function that we can call recursively until the document is fully loaded
    function g() {
        //if the document is not fully loaded...
        if (d.readyState && d.readyState != 'complete') {
            //.. wait 200 milliseconds and then try again
            setTimeout(g, 200);
        } else { //... the document IS fully loaded
            //if the Amazon Universal Wishlist object is undefined...
            if (typeof AUWLBook == x) {
                //set the source of the script element to http://www.amazon.com/gp/wishlist/add.js 
                //This is a pretty complex and large JavaScript object, not discussed here
                //Essentially it displays a floating div in the top left corner of the page
                //in which the user can enter product details and select from the pictures on the
                //current page.
                //AUWLBook is personalized for each user, setting Wishlist titles and regystryIds
                //If the user is signed out, it will navigate to the Amazon sign in page, and then 
                //to the wishlist
                //If the user is signed in, it will display a floating confirmation div with options
                //of navigating to the list or "continue shopping".
                //I don't BELIEVE the loc query parameter actually alters the generated JavaScript, 
                //it must be used for other purposes
                s.setAttribute('src', u + '.js?loc=' + e(l));
                //append the script
                d.body.appendChild(s);
            }
            //***Execute remote script ***
            //create a function that we can call recursively until the AUWLBook object is fully loaded
            function f() {
                //if the AUWLBook object is not loaded yet, wait 200 ms and try again
                if (typeof AUWLBook == x) {
                    setTimeout(f, 200);
                } else { //when loaded display the pop-over div - see above
                    AUWLBook.showPopover();
                }
            }
            //call the f function
            f();
        }
    }
    //call the g function
    g();
} ())

See http://etherpad.com/10gdKmen5u for the full js with proper highlighting.