<?php $meta = get_post_custom($post->ID); ?>

<?php if ( has_post_format( 'audio' ) ): // Audio @fromfull ?>

  <?php $formats = array();
    foreach ( explode('|','mp3|ogg') as $format ) {
      if ( isset($meta['_audio_'.$format.'_url']) ) {
        $format = ($format=='ogg')?'oga':$format;
        // Change mp3 to m4a if necessary
        if ( $format == 'mp3' ) {
          if ( strstr($meta['_audio_mp3_url'][0],'.m4a') ) {
            $format = 'm4a';
          }
        }
        $formats[] = $format;
      }
    }
  ?>

  <?php if ( !empty($formats) ): ?>
  <script type="text/javascript">
  jQuery(document).ready(function(){
    if(jQuery().jPlayer) {
      jQuery("#jquery-jplayer-<?php the_ID(); ?>").jPlayer({
        ready: function () {
          jQuery(this).jPlayer("setMedia", {
            <?php if(in_array('mp3',$formats)) { echo 'mp3: "'.$meta['_audio_mp3_url'][0].'",'."\n"; } ?>
            <?php if(in_array('m4a',$formats)) { echo 'm4a: "'.$meta['_audio_mp3_url'][0].'",'."\n"; } ?>
            <?php if(in_array('oga',$formats)) { echo 'oga: "'.$meta['_audio_ogg_url'][0].'",'."\n"; } ?>
          });
        },
        swfPath: "<?php echo get_template_directory_uri() ?>/js",
        cssSelectorAncestor: "#jp-interface-<?php the_ID(); ?>",
        supplied: "<?php echo implode(',',$formats); ?>"
      });
    }
  });
  </script>
  <?php endif; ?>

  <div class="post-format">
    <div class="image-container">
      <?php if ( has_post_thumbnail() ) {
        hu_the_post_thumbnail('thumb-large', '', false);//no attr, no placeholder
        $caption = get_post(get_post_thumbnail_id())->post_excerpt;
        if ( isset($caption) && $caption ) echo '<div class="image-caption">'.$caption.'</div>';
      } ?>
    </div>

    <div id="jquery-jplayer-<?php the_ID(); ?>" class="jp-jplayer"></div>

    <div class="jp-audio">
      <div id="jp-interface-<?php the_ID(); ?>" class="jp-interface">
        <ul class="jp-controls">
          <li><a href="#" class="jp-play" tabindex="1"><i class="fa fa-play"></i></a></li>
          <li><a href="#" class="jp-pause" tabindex="1"><i class="fa fa-pause"></i></a></li>
          <li><a href="#" class="jp-mute" tabindex="1"><i class="fa fa-volume-up"></i></a></li>
          <li><a href="#" class="jp-unmute" tabindex="1"><i class="fa fa-volume-down"></i></a></li>
        </ul>
        <div class="jp-progress-container">
          <div class="jp-progress">
            <div class="jp-seek-bar">
              <div class="jp-play-bar"></div>
            </div>
          </div>
        </div>
        <div class="jp-volume-bar-container">
          <div class="jp-volume-bar">
            <div class="jp-volume-bar-value"></div>
          </div>
        </div>
      </div>
    </div>

  </div>

<?php endif; //end of @fromfull?>

<?php if ( has_post_format( 'gallery' ) ): // Gallery ?>

	<div class="post-format">
		<?php $images = hu_post_images(); if ( !empty($images) ): ?>
		<script type="text/javascript">
			// Check if first slider image is loaded, and load flexslider on document ready
			jQuery( function($){
			 var firstImage = $('#flexslider-<?php echo the_ID(); ?>').find('img').filter(':first'),
				checkforloaded = setInterval(function() {
					var image = firstImage.get(0);
					if (image.complete || image.readyState == 'complete' || image.readyState == 4) {
						clearInterval(checkforloaded);
						$('#flexslider-<?php echo the_ID(); ?>').flexslider({
							animation: '<?php echo wp_is_mobile() ? "slide" : "fade"; ?>',
							slideshow: true,
							directionNav: true,
							controlNav: true,
							pauseOnHover: true,
							slideshowSpeed: 7000,
							animationSpeed: 600,
							smoothHeight: true,
							touch: <?php echo apply_filters('hu_flexslider_touch_support' , true); ?>
						});
					}
				}, 20);
			});
		</script>
		<div class="flex-container">
			<div class="flexslider" id="flexslider-<?php the_ID(); ?>">
				<ul class="slides">
					<?php foreach ( $images as $image ): ?>
						<li>
							<?php $imageid = wp_get_attachment_image_src($image->ID,'large'); ?>
							<img src="<?php echo esc_attr( $imageid[0] ); ?>" alt="<?php echo esc_attr( $image->post_title ); ?>">

							<?php if ( $image->post_excerpt ): ?>
								<div class="image-caption"><?php echo $image->post_excerpt; ?></div>
							<?php endif; ?>
						</li>
					<?php endforeach; ?>
				</ul>
			</div>
		</div>
		<?php endif; ?>
	</div>

<?php endif; ?>

<?php if ( has_post_format( 'image' ) ): // Image ?>

	<div class="post-format">
		<div class="image-container">
			<?php if ( has_post_thumbnail() ) {
				hu_the_post_thumbnail('thumb-large', '', false);//no attr, no placeholder
				$caption = get_post(get_post_thumbnail_id())->post_excerpt;
				if ( isset($caption) && $caption ) echo '<div class="image-caption">'.$caption.'</div>';
			} ?>
		</div>
	</div>

<?php endif; ?>

<?php if ( has_post_format( 'video' ) ): // Video @fromfull ?>
	 <div class="post-format">
    <?php
      if ( isset($meta['_video_url'][0]) && !empty($meta['_video_url'][0]) ) {
        global $wp_embed;
        $video = $wp_embed->run_shortcode('[embed]'.$meta['_video_url'][0].'[/embed]');
        echo $video;
      }
    ?>
  </div>
<?php endif; ?>

<?php if ( has_post_format( 'quote' ) ): // Quote @fromfull ?>
  <div class="post-format">
    <div class="format-container pad">
      <i class="fa fa-quote-right"></i>
      <blockquote><?php echo isset($meta['_quote'][0])?wpautop($meta['_quote'][0]):''; ?></blockquote>
      <p class="quote-author"><?php echo (isset($meta['_quote_author'][0])?'&mdash; '.$meta['_quote_author'][0]:''); ?></p>
    </div>
  </div>
<?php endif; ?>

<?php if ( has_post_format( 'chat' ) ): // Chat @fromfull?>
	<div class="post-format">
    <div class="format-container pad">
      <i class="fa fa-comments-o"></i>
      <blockquote>
        <?php echo (isset($meta['_chat'][0])?wpautop($meta['_chat'][0]):''); ?>
      </blockquote>
    </div>
  </div>
<?php endif; ?>

<?php if ( has_post_format( 'link' ) ): // Link @fromfull ?>
	<div class="post-format">
    <div class="format-container pad">
      <p><a href="<?php echo (isset($meta['_link_url'][0])?$meta['_link_url'][0]:'#'); ?>">
        <i class="fa fa-link"></i>
        <?php echo (isset($meta['_link_title'][0])?$meta['_link_title'][0]:get_the_title()); ?> &rarr;
      </a></p>
    </div>
  </div>
<?php endif; ?>