JSFiddle - React, Tailwind, and code Playground

by jsumners

HTML

<ol id="users">
</ol>

JavaScript

var $users = $('#users');

$.ajax({
    url: 'https://spreadsheets.google.com/feeds/list/0AjpD3RgqIMKAdGNJam5RYkhnUnJnWDMxS2Rzbkh0amc/1/public/values?alt=json&callback=?',
    dataType: 'jsonp',
    success: function(data) {
        var entries = data.feed.entry,
            entry,
            i, j,
            image1 = 'http://www.tutorialpark.com/wp-content/uploads/3/Heart-Blending.jpg',
            image2 = 'http://www.trying-to-conceive.com/wp-content/uploads/2010/04/heart.gif',
            image = {},
            tmp = [];
        
        if (entries.length) {
            for (i = 0, j = entries.length; i < j; i += 1) {
                entry = entries[i];
                image = '<img style="width: 32px; height: 32px;" src="' + ((+entry.gsx$status.$t % 2) ? image1 : image2) + '">';
                tmp = [
                    '<li>',
                    entry.gsx$name.$t,
                    ' is at status level ',
                    image,
                    '</li>'
                ];
                
                $users.append(tmp.join(''));
            }
        }
    }
});

/**
URLs with useful information:
http://code.google.com/apis/gdata/samples/spreadsheet_sample.html
http://code.google.com/apis/spreadsheets/data/3.0/reference.html
http://docs.google.com/support/bin/answer.py?hl=en&answer=47134
**/