(function($) {

var id = null;

/**
 * Toolbar plugin
 *
 * Creates a Facebook like toolbar.
 */
$.fn.toolbar = function(options) {
	// Save id of toolbar.
	id = $(this).attr('id');

	// Build main options.
	var options = $.extend({}, $.fn.toolbar.defaults, options);

	// Build element specific options from metadata.
	var options = $.meta ? $.extend({}, options, $(this).data()):options;

	$(this).find('a.icon').click(function() {
		var name = nameFromId($(this).attr('id'), 'icon');

		// Close if open and vice versa.
		if ($(this).hasClass('open')) {
			close(name);
		} else {
			// Close other open layers.
			closeAll();

			// Open this one.
			open(name);
		}

		// Cancel click event.
		return false;
	});

	$('#container').click(closeAll);
};

// private functions

/**
 * Positions a layer above it's icon and displays it.
 */
function open(name) {
	var icon = $('#toolbar-icon-' + name);
	var layer = $('#toolbar-layer-' + name);

	layer.css({
		left: icon.offset().left + 'px',
		bottom: icon.parents('#' + id).outerHeight() + 'px'
	}).fadeIn('normal', function() {
		$(this).addClass('open');
		icon.addClass('open');
	});
}

/**
 * Hides an open layer.
 */
function close(name) {
	var icon = $('#toolbar-icon-' + name);
	var layer = $('#toolbar-layer-' + name);

	layer.fadeOut('fast', function() {
		$(this).removeClass('open');
		icon.removeClass('open');
	});
}

/**
 * Closes all open layers.
 */
function closeAll() {
	$('#' + id + '-container .toolbar-layer.open').fadeOut('fast', function() {
		$(this).removeClass('open');
		var name = nameFromId($(this).attr('id'), 'layer');
		$('#toolbar-icon-' + name).removeClass('open');
	});
}

/**
 * Returns the name of an element from it's Id.
 */
function nameFromId(id, type) {
	var prefix = 'toolbar-' + type + '-';
	return id.substr(prefix.length);
}

// public functions
$.fn.toolbar.abc = function() {
	//...
};

// plugin defaults
$.fn.toolbar.defaults = {
};

})(jQuery);