$(function () {
    $("[data-book-id]").each(function () {
        Books.Id = $(this).attr("data-book-id");
        Books.ShowLoading();
        Books.ShowBook();
    });
});

var Books = {

    Id: "",

    ShowLoading: function () {
        $('[data-book-id="' + Books.Id + '"] .book').html("{ Loading book... }");
    },

    ShowBook: function () {
        $.ajax({
            dataType: "jsonp",
            jsonpCallback: "Books.ParseCallback",
            url: "https://www.googleapis.com/books/v1/volumes/" + Books.Id + "?callback=Books.ParseCallback"
        });
    },

    ParseCallback: function (response) {
        // show the photo!
        Books.GetHTML(response);
    },

    GetHTML: function (book) {
        var author = book.volumeInfo.authors[0];
        var titleAndAuthor = "<a href=\"" + book.volumeInfo.infoLink + "\"><span style=\"font-size:24px\">" + book.volumeInfo.title + "</span><br />" + book.volumeInfo.subtitle + "</a><br />" + author;
        var booksLogo = "<p><img src=\"http://www.connemara.net/Content/Images/SocialMedia/GoogleBooks.png\"></p>";
        var description = "<p><i>" + book.volumeInfo.description.substring(0, 100) + " ...</i></p>";
        var thumbnail = "<a href=\"" + book.volumeInfo.infoLink + "\"><img src=\"" + book.volumeInfo.imageLinks.thumbnail + "\" alt=\"" + book.volumeInfo.title + "\" style=\"border-right: solid 1px #bbb; border-bottom: solid 1px #bbb\"\"></a>";

        // render HTML
        $('[data-book-id="' + book.id + '"] .book').html(thumbnail);
        $('[data-book-id="' + book.id + '"] > .description').html(titleAndAuthor + description + booksLogo);
    }
};