Team:Cambridge/Photos

From 2010.igem.org

(Difference between revisions)

Latest revision as of 00:06, 18 August 2010

Photo Gallery

@@ Line 2: / Line 2: @@
 {{:Team:Cambridge/Templates/headerbar|colour=#386abc|title=Photo Gallery}}
 <html>
-<iframe align="center" src="http://www.flickr.com/slideShow/index.gne?group_id=&user_id=52129837@N08&set_id=&text=" frameBorder="0" width="650" height="500" scrolling="no"></iframe>
+<div style="text-align:center">
+<script>
+function jsonFlickrApi(rsp) {
+ if (rsp.stat != "ok"){
+  // If this executes, something broke!
+  return;
+ }
+ //variable "s" is going to contain
+ //all the markup that is generated by the loop below
+ var s = "";
+ //this loop runs through every item and creates HTML
+ for (var i=0; i < rsp.photos.photo.length; i++) {
+//for (var i=0; i < 10; i++) {
+  photo = rsp.photos.photo[ i ];
+  //notice that "t.jpg" is where you change the
+  //size of the image
+  t_url = "http://farm" + photo.farm +
+  ".static.flickr.com/" + photo.server + "/" +
+  photo.id + "_" + photo.secret + "_" + "t.jpg";
+ b_url = "http://farm" + photo.farm +
+  ".static.flickr.com/" + photo.server + "/" +
+  photo.id + "_" + photo.secret + "_" + "z.jpg";
+  p_url = "http://www.flickr.com/photos/" +
+  photo.owner + "/" + photo.id;
+  s +=  '<a class="lightbox" href="' + b_url + '">' + '<img alt="'+
+  photo.title + '"src="' + t_url + '" style="margin:10px; border:1px solid gray;" />' + '</a>';
+ }
+ document.writeln(s);
+ //this tells the JavaScript to write
+ //everything in variable "s" onto the page
+}
+</script>
+<script type="text/javascript" language="javascript" src="http://api.flickr.com/services/rest/?format=json&method=flickr.photos.search&user_id=52129837@N08&api_key=52566611a5be16fbbbe57f3dbe4f1fef&count=5"></script>
+</div>
 </html>
 {{:Team:Cambridge/Templates/footerMinimal}}