<?php
/* Set global counter for unique IDs */
global $gfxbucket_instagram;
$gfxbucket_instagram = 0;

function gfxbucket_instagram_func( $atts, $content ) {
	extract(shortcode_atts( array(
		'animate' => 'no',
		'fs'      => 'off',
	), $atts ));

	global $gfxbucket_instagram;
	$gfxbucket_instagram++;

	$class = '';

	if( $animate == 'yes' || $animate == '1' ) {
		$class .= ' animate animation-size';
	}

	wp_enqueue_script( 'gfxbucket-instagram', plugins_url( 'javascript/instagram.min.js', __FILE__ ), array('jquery'), '', true );

	ob_start();
	?>
	
	<div id="instagram-<?php echo $gfxbucket_instagram; ?>" class="instagram statement<?php echo $class; ?>">
		<ul class="instagram-images"></ul>
		<?php if( $fs == 'off' ): ?>
		<div class="container">
			<div class="row">
		<?php endif; ?>
				<div class="col-md-12">
					<div class="instagram-author-photo"></div>
					<h5><?php _e( 'Find us on Instagram', 'gfxbucket-shortcodes' ); ?></h5>
					<div class="instagram-tags"></div>
					<div class="instagram-author-tag"></div>
					<ul class="instagram-meta">
						<li class="num-photos">
							<span></span>
							<strong><?php _e( 'Photos', 'gfxbucket-shortcodes' ); ?></strong>
						</li>
						<li class="num-followers">
							<span></span>
							<strong><?php _e( 'Followers', 'gfxbucket-shortcodes' ); ?></strong>
						</li>
						<li class="num-likes">
							<span></span>
							<strong><?php _e( 'Likes', 'gfxbucket-shortcodes' ); ?></strong>
						</li>
					</ul>
					<a target="_blank" href="#" class="btn btn-lg instagram-follow"><?php _e( 'Follow', 'gfxbucket-shortcodes' ); ?></a>
				</div>
			<?php if( $fs == 'off' ): ?>
			</div>
		</div>
		<?php endif; ?>
	</div>

  	<script type="text/javascript">
		jQuery(document).ready(function($) {
			window.accessToken = '<?php echo $content; ?>';
			
			$('#instagram-<?php echo $gfxbucket_instagram; ?>').instagram({
				userId: accessToken.split('.')[0],
				accessToken: accessToken,
				clientId: '71ed5031106a4b3a9f9ff533898d4133',
				count: '999',
				updateInterval: 960*60*2,
				image_size: 'standard_resolution'
			});
		});
	</script>

	<?php
	$return = ob_get_contents();
	ob_end_clean();

	return $return;
}
add_shortcode( 'instagram', 'gfxbucket_instagram_func' );