Flickr Hacks

Preface

In February 2004, a tiny startup in Vancouver called Ludicorp launched a web site for sharing photos called Flickr. Using some of the tools they’d built for their primary product (a web game called Game Neverending), Ludicorp quickly changed the way millions of people share photos. Just one year and one month after its launch, web giant Yahoo! purchased Flickr—with rumors putting the price tag at somewhere around $30 million. Yahoo! is now working diligently to “Flickrize” all of its features by adapting the innovations that Flickr brought to photo sharing to Yahoo!’s existing features for searching, shopping, and travel planning.

So, what exactly did Flickr accomplish that attracted millions of users and has an established web company changing the way it does business? The answer isn’t an easy one, but studying how Flickr has taken the world by storm can give us some indication of where the Web is headed.

One innovation that Flickr pioneered is the act of tagging digital content. Instead of imposing a category system, Flickr lets individual photographers do the hard work of classifying photos. For example, a photo of a car can be tagged with words such as car or automobile, or with more specific descriptive terms such as Honda, convertible, or shiny. Then, others interested in pictures of cars, convertibles, or shiny things can browse those tags to find photos that might interest them. Tagging is a clever way to loosely connect photos without a structured categorization system.

In addition to tagging, Flickr allows members to create ad hoc groups to share photos of specific subjects. A famous frivolous example is the Flickr Squared Circle group (http://www.flickr.com/groups/circle/), which formed to share photos of circular objects cropped to squares. Anyone can participate, and the group has built a library of over 22,000 squared circle photographs at the time of this writing.

In addition to collaborating with strangers on Flickr, you can add friends and family to your Flickr contacts list to easily keep track of new photos posted by people you know. It’s a simple but powerful way to share experiences with people you care about.

Another innovation that sets Flickr apart from other photo-sharing services is its open API. Flickr’s open architecture allows outside developers to code features for Flickr and show Flickr photos on other web sites and inside other applications. One striking example of the API in action is Jim Bumgardner’s visualization of over 1,000 images in the Flickr Squared Circle pool, shown in Figure P-1.

Figure P-1. Flickr squared circle poster

The individual photographers contributing to the Squared Circle group had no idea their photos would end up in a colorful montage, but Flickr’s API made the visualization possible. Many sites and applications have already integrated with Flickr thanks to the API, and you’ll see many examples of how people are using the API in this book.

The power of sharing photos instantly via the Web hit mainstream consciousness soon after bombs ripped through London’s subway on July 7, 2005. As television news networks scrambled to get images of the bombing on TV, pictures were already appearing on Flickr, thanks to people with cell phone cameras at the scene. The photo by Adam Stacey shown in Figure P-2 became an early icon of the attacks, and you can still view this photo on Flickr (http://www.flickr.com/photos/qwghlm/24230239/in/pool-bomb/) and read the comments posted.

Figure P-2. London bombing photo by Adam Stacey

During a horrific incident, when people were desperate for any information they could glean about the situation, Flickr provided a way to share images from the event instantly, while it was happening. In addition, Flickr provided a space where people could discuss the event and form groups to share bombing photos, and Flickr’s tagging features allowed others to find bomb-related photos quickly.

While most of the photo sharing that happens on a daily basis at Flickr isn’t nearly as serious as the photos shared on July 7, 2005, the London bombings let the world know that the features Flickr provides make it more important than a simple web toy.

Why Flickr Hacks?

The term hacking has a bad reputation in the press. They use it to refer to someone who breaks into systems or wreaks havoc with computers as their weapon. Among people who write code, though, the term hack refers to a “quick-and-dirty” solution to a problem, or a clever way to get something done. And the term hacker is taken very much as a compliment, referring to someone as being creative, having the technical chops to get things done. The Hacks series is an attempt to reclaim the word, document the good ways people are hacking, and pass the hacker ethic of creative participation on to the uninitiated. Seeing how others approach systems and problems is often the quickest way to learn about a new technology.

This book aims to help you gain a deeper appreciation and understanding of the creativity Flickr has made possible by showing you some of the many ways people are using and extending Flickr on their own. By understanding Flickr, you’ll have a better sense of where the Web is headed, and how you can participate.

How to Use This Book

You can read this book from cover to cover if you like, but each hack stands on its own, so feel free to browse and jump to the different sections that interest you most. If there’s a prerequisite you need to know about, a cross-reference will guide you to the right hack.

How to Run the Hacks

The programmatic hacks in this book run either on the command line (that’s Terminal for Mac OS X folks, or the DOS command window for Windows users) or as CGI scripts or PHP scripts—dynamic pages living on your web site, accessed through your web browser.

Command-Line Scripts

Running a hack on the command line invariably involves the following steps:

1. Type the program into a garden-variety text editor: Notepad on Windows, TextEdit on Mac OS X, vi or Emacs on Unix/Linux, or anything else of the sort. Save the file as directed—usually as scriptname.pl (the .pl bit stands for Perl, the predominant programming language used in Flickr Hacks).

   Alternately, you can download the code for all of the hacks online at http://www.oreilly.com/catalog/flickrhks/, where you’ll find a ZIP archive filled with individual scripts already saved as text files.

2. Get to the command line on your computer or remote server. In Mac OS X, launch Terminal (Applications → Utilities → Terminal). In Windows, click the Start button, select Run, type command, and hit the Enter/Return key on your keyboard. In Unix... well, we’ll just assume you know how to get to the command line.

3. Navigate to where you saved the script at hand. This varies from operating system to operating system, but it usually involves a command like cd ~/Desktop (that’s your Desktop on the Mac).

4. Invoke the script by running the programming language’s interpreter (e.g., Perl) and feeding it the script (e.g., scriptname.pl), like so:

   perl 
   scriptname.pl

5. Most often, you’ll also need to pass along some parameters—your search query, the number of results you’d like, and so forth. Simply drop them in after the script name, enclosing them in quotes if they’re more than one word or if they include an odd character or three:

   perl 
   scriptname.pl '"much ado about nothing" script' 10

6. The results of your script are almost always sent straight back to the command-line window in which you’re working, like so:

   > perl 
   scriptname.pl '"much ado about nothing" script' 10
   
   1. "Amazon.com: Books: Much Ado About Nothing: Screenplay ..." [http://www.amazon.com/exec/obidos/tg/detail/-/0393311112?v=glance]
   2. "Much Ado About Nothing Script" [http://www.signal42.com/much_ado_about_nothing_script.asp]
   ...

   Tip

   The elllpsis (...) bit signifies that we’ve cut off the output for brevity’s sake.

7. To stop output scrolling off your screen faster than you can read it, on most systems you can pipe (read: redirect) the output to a little program called more :

   perl 
   scriptname.pl 
   | more

8. Hit the Enter/Return key on your keyboard to scroll through line by line, or use the spacebar to leap through page by page.

   You’ll also sometimes want to direct output to a file for safekeeping, importing into your spreadsheet application, or displaying on your web site. This is as easy as:

   perl 
   scriptname.pl 
   >
    output_filename.txt

9. And to pour some input into your script from a file, simply do the opposite:

   perl 
   scriptname.pl 
   <
    input_filename.txt

   Don’t worry if you can’t remember all of this; each relevant hack has a Section 2.5.3 section that shows you just how it’s done.

CGI Scripts

CGI scripts—programs that run on your web site and produce pages dynamically—are a little more complicated if you’re not used to them. While fundamentally they’re the same sorts of scripts as those run on the command line, they are more troublesome because setups vary so widely. Your content might be hosted on your own server, on an Internet service provider’s (ISP’s) server, on a corporate intranet server, or anything in between.

Since going through every possibility is beyond the scope of this (or any) book, if you need help you should check your ISP’s knowledge base or call their technical support department, or ask your local system administrator.

Generally, though, the methodology is the same:

1. Type the program into a garden-variety text editor: Notepad on Windows, TextEdit on Mac OS X, vi or Emacs on Unix/Linux, or anything else of the sort. Save the file as directed—usually as scriptname.cgi (the .cgi bit reveals that you’re dealing with a CGI—that’s Common Gateway Interface—script).

   Alternately, you can download the code for all of the hacks online at http://www.oreilly.com/catalog/flickrhks/, where you’ll find a ZIP archive filled with individual scripts already saved as text files.

2. Move the script over to wherever your web site lives. You should have some directory on a server somewhere in which all of your web pages (all those .html files) and images (files ending in .jpg, .gif, etc.) live. Within this directory, you’ll probably see something called a cgi-bin directory: this is where CGI scripts must usually live in order to be run rather than just displayed in your web browser when you visit the pages that contain them.

3. You usually need to bless CGI scripts as executable—to be run rather than displayed. Just how you do this depends on the operating system of your server. If you’re on a Unix/Linux or Mac OS X system, this usually entails typing the following on the command line:

   chmod 755 
   scriptname.cgi

4. Now you should be able to point your web browser at the script and have it run as expected, behaving in a manner similar to that described in the Section 2.5.3 section of the hack at hand.

   Just what URL you use, once again, varies wildly. It should, however, look something like this: http://www.your_domain.com/cgi-bin/scriptname.cgi, where your_domain.com is your web site domain, cgi-bin is the directory in which your CGI scripts live, and scriptname.cgi is the script itself.

   If you don’t have a domain and your site is hosted by an ISP, the URL is more likely to look like this: http://www.your_isp.com/~your_username/cgi-bin/scriptname.cgi, where your_isp.com is your ISP’s domain, ~your_username is your username at the ISP, cgi-bin is the directory in which your CGI scripts live, and scriptname.cgi is the script itself.

If you come up with something called an “Internal Server Error” or see the error code 500, something’s gone wrong somewhere in the process. At this point you can take a crack at debugging (read: shaking the bugs out) yourself, or ask your ISP or system administrator for help. Debugging—especially CGI debugging—can be a little more than the average newbie can bear, but there is help in the form of a famous Frequently Asked Question (FAQ): “The Idiot’s Guide to Solving Perl CGI Problems.” Search for it and step through it as directed.

PHP Scripts

PHP scripts—programs in the PHP language that run on your web site and produce pages dynamically—are set up in a manner very similar to CGI scripts, but are generally easier to manage. Unlike CGI scripts, the files do not need to live in a special cgi-bin/ directory, but can coexist with your HTML files. Also you usually don’t have to change the file permissions.

Most of the scripts in this book require PHP Version 4, which is commonly available from most hosting providers.

For more information about PHP, check out the online manual at http://www.php.net/manual/en/.

Learning to Code

Fancy trying your hand at a spot of programming? O’Reilly’s best-selling Learning Perl (http://www.oreilly.com/catalog/lperl3/), by Randal L. Schwartz and Tom Phoenix, provides a good start. Apply what you learn to understanding and using the hacks in this book, perhaps even taking on the Section 1.8.3 sections to tweak and fiddle with the scripts. This is a useful way to get some programming under your belt, since it’s always a little easier to learn how to program when you have a task to accomplish and existing code to leaf through.

How This Book Is Organized

The book is divided into seven chapters, organized by subject:

Chapter 1

This chapter shows you how to master the basics of sharing photos on Flickr, including editing images for Flickr, managing extended information about your photos, and posting directly from your cell phone. You’ll also find an overview of tools to help you upload photos more efficiently and a look at ways to use Flickr to publish photos on your own web site.

Chapter 2

Flickr is famous for tagging. This chapter shows how to take advantage of tagging for organizing and publicizing your photos. You’ll also see some unique ways people are using tagging to group photos by location, and you’ll find some external games that use Flickr’s tagging features for fun.

Chapter 3

This chapter introduces you to some unexpected ways to find and view Flickr photos. You’ll get an overview of the many ways Flickr uses RSS to distribute photos, a look at how you can use Flickr mobile to stay in touch on the go, and the lowdown on how to view Flickr photos on your TV.

Chapter 4

Use the hacks in this chapter to learn more about your Flickr community. In addition to the basics of adding and viewing contacts, you’ll find hacks that show how to view your contacts on a map and browse their non-Flickr activities. You’ll also see how to find out which tags are most popular among your friends and which photos they’re marking as their favorites.

Chapter 5

In this chapter, you’ll see how Flickr experts manage large collections of photos and maintain large Flickr groups. You’ll find out how to back up your Flickr photos for safekeeping and how to create a contact sheet of your Flickr photos for quick reference.

Chapter 6

This chapter introduces you to the Flickr API, which is a back door that Flickr provides for developers. You can use the hacks in this chapter as building blocks for your own Flickr applications. You’ll see concrete examples for talking with the API, authenticating with the API, and using existing tools for rapid Flickr development.

Chapter 7

See how people are using Flickr photos in their own applications and games, and have a bit of fun in the process. This chapter shows how to turn your photos into beautiful collages, ransom notes, motivational posters, sliding puzzles, and more.

Conventions Used in This Book

The following is a list of the typographical conventions used in this book:

Italic

Used for emphasis and new terms where they are defined, and to indicate Unix utilities, URLs, filenames, filename extensions, and directory/folder names. For example, a path in the filesystem will appear as /Developer/Applications.

Constant width

Used to show code examples, the contents of files, and console output, as well as the names of variables, commands, and other code excerpts.

Constant width bold

Used to highlight portions of code, either for emphasis or to indicate text that should be typed by the user.

Constant width italic

Used in code examples to show sample text to be replaced with your own values.

Gray type

Gray text is used to indicate a cross-reference within the text.

You should pay special attention to notes set apart from the text with the following icons:

Tip

This is a tip, suggestion, or general note. It contains useful supplementary information about the topic at hand.

Warning

This is a warning or note of caution, often indicating that your money or your privacy might be at risk.

The thermometer icons, found next to each hack, indicate the relative complexity of the hack:

beginner

moderate

expert

Using Code Examples

This book is here to help you get your job done. In general, you may use the code in this book in your programs and documentation. You do not need to contact us for permission unless you’re reproducing a significant portion of the code. For example, writing a program that uses several chunks of code from this book does not require permission. Selling or distributing a CD-ROM of examples from O’Reilly books does require permission. Answering a question by citing this book and quoting example code does not require permission. Incorporating a significant amount of example code from this book into your product’s documentation does require permission.

We appreciate, but do not require, attribution. An attribution usually includes the title, author, publisher, and ISBN. For example: "Flickr Hacks by Paul Bausch and Jim Bumgardner. Copyright 2006 O’Reilly Media, Inc., 0-596-10245-3.”

If you feel your use of code examples falls outside fair use or the permission given above, feel free to contact us at [e-mail].

How to Contact Us

We have tested and verified the information in this book to the best of our ability, but you may find that features have changed (or even that we have made mistakes!). As a reader of this book, you can help us to improve future editions by sending us your feedback. Please let us know about any errors, inaccuracies, bugs, misleading or confusing statements, and typos that you find anywhere in this book.

Please also let us know what we can do to make this book more useful to you. We take your comments seriously and will try to incorporate reasonable suggestions into future editions. You can write to us at:

O’Reilly Media, Inc.

1005 Gravenstein Hwy N.

Sebastopol, CA 95472

[phone] (in the U.S. or Canada)

[phone] (international/local)

[phone] (fax)

To ask technical questions or to comment on the book, send email to:

[e-mail]

The web site for Flickr Hacks lists examples, errata, and plans for future editions. You can find this page at:

http://www.oreilly.com/catalog/flickrhks/

For more information about this book and others, see the O’Reilly web site:

http://www.oreilly.com

Got a Hack?

To explore Hacks books online or to contribute a hack for future titles, visit:

http://hacks.oreilly.com

Safari Enabled

When you see a Safari® Enabled icon on the cover of your favorite technology book, that means the book is available online through the O’Reilly Network Safari Bookshelf.

Safari offers a solution that’s better than e-Books. It’s a virtual library that lets you easily search thousands of top tech books, cut and paste code samples, download chapters, and find quick answers when you need the most accurate, current information. Try it for free at http://safari.oreilly.com.