README

####
This is a basic jquery plugin that will allow you to pull in an instagram feed.

The user data for the uploader of the image is attached to the image in the jquery data.  
You can access it by using $('#id').data('user')

Alternate image sizes are available as well as caption data.  They are attached to the image element 
that is created.

To get altImageSizes object use var altImages = $('#me_0').data('altImageSizes');
To get Caption object use var caption = $('#me_0').data('caption');
To get User object var user = $('#me_0').data('user');
To get link to Instagram image page var link = $('#me_0').data('instagramLink');

*** me_0 is the id of the element you wish to get data for, so this would change for each image.

####

####
USAGE
####

--- getMyStream (example with onclick and mouseover tooltip to show user and caption) ---

<div id="me" />
<div style="margin-left: 15px; padding: 5px; background-color: #a7a7a7; position: absolute; opacity: 0; filter:alpha(opacity=0)" class="caption"></div>
<div id="pagesLeft"></div>

$(document).ready(function(){
	var $caption = $('.caption');
	
	
    $("#me").instagram('getStream', {
		count: 4,
		getUser: true,
		callback: function() {
		    // show page numbers
		    $totalPages = $('#me').data('pages');
		    $pageHolder = $('#pagesLeft');
		    
		    if(typeof($totalPages) != 'undefined') {
			    $pageHolder.html($totalPages + ' pages left');
		    }
			
			$.each($('#me img'), function() {
				var $this = $(this);
				var largeUrl = $this.data('altImageSizes').standard_resolution.url;
				
				$this.click(function() {
					window.open(largeUrl); 
				}).mouseover(function() {
					
					var html = $this.data('user').username;
					if ($this.data('caption') != null) {
						html += ': ' + $(this).data('caption').text;
					}
					
					$this.mousemove(function(e){
						$caption.css({left: e.pageX, top: e.pageY});
					});
	
					$caption.html(html);
					$caption.animate({
					  opacity: 1
					}, {queue: false});
				}).mouseout(function(){
					$caption.animate({
					  opacity: 0
					}, {queue: false});
				});
			});
		}
	});


--- getUserStream ---

<div id="user" />

$(document).ready(function() {
	$("#user").instagram('getStream', {
		count: 5,
		user: 1574083
	});
});


--- getMyLikes ---

<div id="myLikes" />

$(document).ready(function() {
	$("#myLikes").instagram('getMyLikes', {
		count: 5
	});
});

--- getPopularStream ---

<div id="popular" />

$(document).ready(function() {
	$("#popular").instagram('getPopularStream', {
		count: 5
	});
});

--- getStreamByTag ---

<div id="search" />

$(document).ready(function() {
	$("#search").instagram('getStreamByTag', {
		count: 5,
		tag: 'transformers'
	});
});