Team:University College London/fbphotosbytudelft

From 2012.igem.org

(Difference between revisions)

Latest revision as of 12:19, 19 August 2012

Intro

This is a template page that lists all pictures from a facebook album.

Either use this template or give credits to the TU Delft team! If you have questions, contact me: Jelmer Cnossen

How To Use This

Find a facebook album ID to display, using fb_listalbums
Put the generated code from fb_listalbums in your wiki, and modify it.

Parameters

{{:Team:TU_Delft/fb_photodisplay|album=ID|count=Number of images|css=CSS class}}
Parameters: 
album: Facebook album ID
count: Number of pictures to display
css: CSS class for each image
callback: Javascript callback function name, callback(container)

loading facebook photos...

@@ Line 50: / Line 50: @@
 function fetchPhotos() {
-   addScript(baseurl + "/" + albumID + "/photos?callback=fb_photos"+albumID);
+   addScript(baseurl + "/" + albumID + "/photos?limit=100&offset=0&callback=fb_photos"+albumID);
 }
@@ Line 56: / Line 56: @@
    // template parameters
    var n = </html>{{{count|6}}}<html> - 1;
-  var animate = </html>{{{animate|true}}}<html>;
    var j=0;
@@ Line 65: / Line 64: @@
    var html = '';
    for(j=0;j<response.data.length;j++) {
-    if(j>n) { break; }
      var item = response.data[j];
      var imgSmall = item.picture;
-     html += '<a rel="lightbox[</html>{{{album}}}<html>]" href="'+imgSmall.source+'" target="blank"><img class="</html>{{{css}}}<html>" src=\"'+imgSmall+'"></a>';
+     var imgBig = item.source;
+    var imgName = item.name;
+    if(typeof imgName == "undefined") { imgName = ""; }
+    if(j>n) {
+           html += '<a rel="lightbox[</html>{{{album}}}<html>]" href="'+imgBig+'" title="'+imgName+'"></a>';
+           }else{
+          html += '<a rel="lightbox[</html>{{{album}}}<html>]" href="'+imgBig+'" title="'+imgName+'"><img class="</html>{{{css|fbphoto}}}<html>" src=\"'+imgSmall+'"></a>';
+          }
    }
    $("#photobox" + albumID).html(html);