Profile image for Joel Ruiz joelruiz
The following code help me create automatic galleries of Picasa Albums implementing the lytebox also.
All you require is:
- picasa userId
- albumID
- size of miniatures
- max number of fotos to show
- size of the foto
- linktype
- 0 : 1 miniature only
- 1 : all miniatures
- 2 : first image as link
Language
JavaScript
Tags
galleries lytebox picasa

Picasa Galleries

1 function galWithAllThumbs(data) { 2 var titulo = ''; 3 var thumbCount = 100; 4 var picsCount = data.feed.entry.length - 1; 5 var j = 0; 6 var albumTitle = data.feed.title.$t; 7 document.write('<h3>' + albumTitle + '</h3>'); 8 for (var i = picsCount; i > picsCount - thumbCount; i--) { 9 var pic = data.feed.entry[j]; 10 document.write('<a href="' + pic.media$group.media$content[0].url + '" rel="lyteshow[' + albumTitle + ']" title="' + pic.title.$t + '" ><img src="' + pic.media$group.media$thumbnail[0].url + '" alt="' + pic.title.$t + '" ></a>'); 11 j++; 12 } 13 14 } 15 16 function galWithOneThumb(data) { 17 var titulo = ''; 18 var thumbCount = 100; 19 var picsCount = data.feed.entry.length - 1; 20 var albumTitle = data.feed.title.$t; 21 var j = 0; 22 var pic = data.feed.entry[j]; 23 document.write('<a href="' + pic.media$group.media$content[0].url + '" rel="lyteshow[' + albumTitle + ']" title="' + pic.title.$t + '" ><img src="' + pic.media$group.media$thumbnail[0].url + '" alt="' + albumTitle + '" ></a>'); 24 for (var i = picsCount; i > picsCount - thumbCount; i--) { 25 j++; 26 pic = data.feed.entry[j]; 27 document.write('<a href="' + pic.media$group.media$content[0].url + '" rel="lyteshow[' + albumTitle + ']" title="' + pic.title.$t + '" alt="' + albumTitle + '" ></a>'); 28 } 29 } 30 31 function galWithOneImg(data) { 32 var titulo = ''; 33 var thumbCount = 100; 34 var picsCount = data.feed.entry.length - 1; 35 var albumTitle = data.feed.title.$t; 36 var j = 0; 37 var pic = data.feed.entry[j]; 38 document.write('<a href="' + pic.media$group.media$content[0].url + '" rel="lyteshow[' + albumTitle + ']" title="' + pic.title.$t + '" ><img src="' + pic.media$group.media$content[0].url + '" width="300px" alt="' + albumTitle + '" ></a>'); 39 for (var i = picsCount; i > picsCount - thumbCount; i--) { 40 j++; 41 pic = data.feed.entry[j]; 42 document.write('<a href="' + pic.media$group.media$content[0].url + '" rel="lytebox[' + albumTitle + ']" title="' + pic.title.$t + '" ></a>'); 43 } 44 } 45 46 function galOfAlbums(data) { 47 var titulo = ''; 48 var thumbCount = 100; 49 var picsCount = data.feed.entry.length - 1; 50 var j = 0; 51 document.write('<h3>Ultimos albums</h3>'); 52 for (var i = picsCount; i > picsCount - thumbCount; i--) { 53 var pic = data.feed.entry[j]; 54 document.write('<script src="' + pic.link[0].href + '&kind=photo&thumbsize=' + pic.media$group.media$thumbnail[0].width + 'c&imgmax=1000&access=public&callback=galWithOneThumb"><\/script>'); 55 j++; 56 } 57 } 58 59 function mostrarGaleria(userId, albumId, linkType, miniSize, fotoCount, fotoSize){ 60 if (linkType == 0){ 61 //mostrar una sola miniatura 62 document.write('<script src="http://picasaweb.google.com/data/feed/base/user/' + userId + '/albumid/' + albumId + '?kind=photo&max-results='+ fotoCount + '&thumbsize=' + miniSize + '&imgmax=' + fotoSize + '&access=public&alt=json-in-script&callback=galWithOneThumb"><\/script>'); 63 } 64 if (linkType == 1){ 65 //mostrar todas las miniaturas 66 document.write('<script src="http://picasaweb.google.com/data/feed/base/user/' + userId + '/albumid/' + albumId + '?kind=photo&max-results='+ fotoCount + '&thumbsize=' + miniSize + '&imgmax=' + fotoSize + '&access=public&alt=json-in-script&callback=galWithAllThumbs"><\/script>'); 67 } 68 if (linkType == 2){ 69 //mostrar una imagen como enlace 70 document.write('<script src="http://picasaweb.google.com/data/feed/base/user/' + userId + '/albumid/' + albumId + '?kind=photo&max-results='+ fotoCount + '&imgmax=' + fotoSize + '&access=public&alt=json-in-script&callback=galWithOneImg"><\/script>'); 71 } 72 } 73 74 function mostrarAlbums(userId, miniSize, itemCount, itemSize){ 75 document.write('<script src="http://picasaweb.google.com/data/feed/base/user/' + userId + '/?kind=album&max-results='+ itemCount + '&thumbsize=' + miniSize + '&imgmax=' + itemSize + '&alt=json-in-script&callback=galOfAlbums"><\/script>'); 76 }

Discussion

This helps me avoid to have to copy the url of each photo. As soon as I upload the fotos, I just need to get the album name and my user id in order to create the gallery at my blog.

Comments