Tag Archive: Photos

JavaScript Flickr carousel

December 19, 2014 9:03 am Published by Leave your thoughts

My wife and I made something a couple of weeks ago, and her name is Simone. Our families and some friends want to see lots of pictures, but most people don’t want us to flood their Facebook feeds with baby photos (nor do we want to). So we’ve been uploading them to Flickr mostly, but I wanted a slightly simpler page where people could just see a carousel slideshow of photos of our daughter. There was no good immediately-integrated-with-Flickr JavaScript carousel I could find, but I was pretty easily able to integrate it with Fotorama.

Here is the final product (and beautiful pictures of my girl). Here are the easy steps to do it yourself:

  1. Sign up for a Flickr API key. If this is a non-commercial site, it’s free and instant.
  2. Grab the download or copy the hotlink markup from the setup page in the Fotorama docs
  3. Add this markup to your page:
    <div class="carousel" data-auto="false"></div>

    There’s a lot of configuration options you can add besides that. Here’s the full list.

  4. And now the final step, the JavaScript that populates the carousel:
      <script type="text/javascript">
        $(function() {
          var AddPhotosToCarousel = function(data) {
          var imgs = [];
          $.each(data.photoset.photo, function(index, photo) {
            imgs.push({img: photo['url_m'],
                       thumb: photo['url_sq'],
                       caption: photo['title']});
            });
            $('.carousel').fotorama({ data: imgs });
          };
          $.getJSON('https://api.flickr.com/services/rest/?method=flickr.photosets.getPhotos&api_key=XXXXXXXXXX&photoset_id=YYYYYYYYYY&format=json&extras=url_sq,url_m&jsoncallback=?', AddPhotosToCarousel);
        });
      </script>
    

You must put your API key and your photoset’s id into that big URL you pass to $.getJSON(). If you want the photos to show up in reverse order (as I did), change imgs.push() to imgs.unshift(). You can display things other than photosets (search results and such), but you’ll need to dig into the Flickr API docs to build those queries yourself.

I’m an image meme

February 9, 2012 8:17 am Published by 2 Comments

Three winters ago, I took this picture while I was working from home, waiting for the icy roads to warm up. Since then, it’s become a fairly common photo to accompany blog posts about working from home. (Thanks, in part, to my very friendly Attribution-only Creative Commons licensing.) Here are a couple examples.

But now it’s come back to bite me. I’m now an image meme called “Freelancer Fred”. It’s on quickmeme, and BoingBoing covered it yesterday.

Fresh Plutor

August 14, 2006 11:42 am Published by Leave your thoughts

Wait, what? That’s an outrage. I hope it was a sale. Update: Ah, jeez. It was a photoshop. I’ve been hoodwinked.

Pinhole lessons

March 6, 2006 7:40 am Published by

My pinhole photos came on Saturday. Several of them came out pretty well, and I was surprised that my camera had virtually zero light leaks. M’s mom is scanning them at work and emailing them to me today, hopefully they’ll be up later. (They’re up, as of 12:30.) I’m planning a second 110 pinhole camera, but I thought I’d share what I’ve learned from my first attempt:

  1. Make the pinhole smaller much bigger! Even the ones that are good came out pretty fuzzy.
  2. Make sure the pinhole is centered and parallel to the film plane. The photos were all more up-and-to-the-right from where I thought they were.
  3. Compensate for reciprocity failure.
  4. For that matter, I just need to get better at judging light conditions.

Pinhole camera links

February 28, 2006 5:28 pm Published by

A round-up of the pinhole camera links that I used (and others that I just found interesting) while building mine: