Search code examples
jqueryapipicasa

Consuming Picasa API

I'm having difficulties with consuming API from Google Picasa service.

Let's say i wan't to display this values via jquery:

<entry>
<id>
    https://picasaweb.google.com/data/entry/api/user/userID/albumid/albumID/photoid/5813338978197482482
</id>
<exif:tags>
    <exif:time>1203311251000</exif:time>
    <exif:imageUniqueID>uniqueID</exif:imageUniqueID>
</exif:tags>
<media:group>
    <media:content url="https://lh6.googleusercontent.com/Penguins.jpg" height="384" width="512" type="image/jpeg" medium="image"/>
    <media:credit>user</media:credit>
    <media:description type="plain"/>
    <media:keywords/>
    <media:thumbnail url="https://lh6.googleusercontent.com/s72/Penguins.jpg" height="54" width="72"/>
    <media:thumbnail url="https://lh6.googleusercontent.com/s144/Penguins.jpg" height="108" width="144"/>
    <media:thumbnail url="https://lh6.googleusercontent.com/s288/Penguins.jpg" height="216" width="288"/>
    <media:title type="plain">Penguins.jpg</media:title>
</media:group>
</entry>

No problems when reading values from entry tree, but hassle starts with exif:tags or media:group. This is function for reading xml

$(xml).find('entry').each(function()
    {
        var item = ""
        item += "<li style='float:left;'>";
        item += $(this).find('title').text()    
        item += "</li>";
        $(".albums").append(item);
    });

Thank you

Solution

  • Crystal ball time! I'm guessing you are trying to do something like this:

    var $xml = $(/* get xml string from somewhere */);
var $entryId = $xml.find('entry > id'); // works
var $entryExifTags = $xml.find('entry > exif:tags'); // doesn't work

    This is because some characters, including :, have special meaning in jQuery selectors. Therefore you need to escape them:

    var $entryExifTags = $xml.find('entry > exif\\:tags');