brscPicasa jQuery plugin

1. Intro
2. Features
3. Why you should use it
4. Usage
5. Options
6. Available photo sizes
7. Link replacing examples
8. Pure options examples
9. Changelog
10. TODO
11. Help
12. Downloads
13. Author

Intro back to top

brscPicasa is jQuery plugin for displaying photos from Google Picasa Web Albums service.

Features back to top

• Very easy to use: can replace urls to Picasa page with photos on that page.
• Quick: uses Google's partial response.
• Can display both public and private photos.
• Can be easily integrated with any lightbox clone plugin thanks to callback option.
• Currently work on most modern browsers that support CORS.
• Released under the MIT License.

Why you should use it back to top

It's easy to use but powerful

First of all it can be used in two ways: in link replacing mode and in standard pure options mode.

Link replacing mode is unique feature (at least I didn't find any plugin with similar functionality) and is very easy to use. All you have to do is to put some link to Picasa picture/album/user on your page and execute brscPicasa on that link or on any of it's parents (for instance on body element). brscPicasa will find link to Picasa page and will replace it with photos from that page. You don't have to know any album or photo IDs, you don't have to copy any RSS links to your albums. Just go to your Picasa picture/album/user page, copy address from browser's address bar and put it on your page. brscPicasa will do the rest.

Standard pure options mode is standard mode known from other similar plugins: you have to specify all options and IDs (like user, album_id or album_name, picture_id) in JavaScript.

It's quick and it minimizes use of bandwidth

Second unique feature of brscPicasa is use of partial response of Google Data Protocol. This means that brscPicasa requests only minimal amount of information from Picasa API (only what it really needs) so it works quicker and displays your photos faster. Some numbers: information about 100 pictures without partial response weights 15,6KB, brscPicasa downloads only 3,8KB thanks to partial response (that's about 75% less).

It can display public and private photos

You can display both public and private photos in both modes. To display private photos you need to specify authkey in url (link replacing mode) or in brscPicasa settings (pure options mode).

Usage back to top

Requirements

You need to include jQuery and brscPicasa somewhere on your page:

<script type="text/javascript" src="scripts/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="scripts/jquery.brscPicasa.min.js"></script>

Link replacing mode

Insert a link to Picasa photo/album/user page on your page:

<a id="my_albums" href="http://picasaweb.google.pl/barszczmm">My public albums</a>

Execute brscPicasa on your link:

$('#my_albums').brscPicasa();

...or on any of it's parents (remember that all links to Picasa found in this parent will be replaced):

$('body').brscPicasa({albums_titles: false});

Pure options mode

Just execute brscPicasa (with settings) on any element and pictures will be appended to that element:

$('#picasa_album').brscPicasa({
	user: 'barszczmm',
	album_name: 'Fun',
	mode: 'photos'
});

Setting default options

You can specify brscPicasa options when you are executing it on selected elements (examples above) but you can also specify default options for it. This can be useful when you want to execute brscPicasa multiple times and do not want to repeat some options all the time. Here's how to set default options for brscPicasa:

$.fn.brscPicasa.defaults = {
	photos_thumbsize: '64c',
	photo_displaysize: '320',
	classes: {
		link_with_image: 'loaded-link'
	},
	callback: function() {
		$('a.loaded-link img', this).parent().click(function() {
			alert('some lightbox clone could be opening now');
			return false;
		});
	}
};

Options specified on execution of brscPicasa overwrite those defaults.

Available options back to top

{
link_replacer: '',
container: '',
album_list: '',
photos_list: '',
list_item: '',
single_item: '',
link_with_image: '',
photo: '',
title: ''
}

Available photo sizes back to top

Link replacing examples back to top

Pure options examples back to top

$('#code1 .code-trigger').click(function() {
	$(this).parent().brscPicasa({
		user: 'barszczmm',
		mode: 'photos',
		photos_linkedsize: 'none'
	});
	$(this).remove();
});

$('#code2 .code-trigger').click(function() {
	$(this).parent().brscPicasa({
		user: 'barszczmm',
		album_name: '200408250902GRy',
		photo_id: '5290919539705066066',
		authkey: 'Gv1sRgCMb_uNzer526uAE',
		mode: 'photo'
	});
	$(this).remove();
});

Changelog back to top

brscPicasa 1.0 (2010/10/06)
First release.

TODO back to top

• support all browsers (not only those supportnig CORS)
• replace also links to mobile version of Picasa Web Albums

Help back to top

Use comments on plugin page.

Downloads back to top

Downloads can be found here.

Author back to top

Maciej 'barszcz' Marczewski, http://www.barszcz.info/