<?php
/**
 * The template used for displaying page content in front page.php
 *
 * @package tos
 */

?>

<!-- Start Home Page Slider -->
<section id="header-slider">
  <div class="container">
     <div class="header-static-block">
        <div class="big-text"><img class="img-responsive" src="<?php bloginfo('template_directory'); ?>/img/my-serbia.png" alt="myserbia"></div>
        <div class="green-btn"><img class="img-responsive" src="<?php bloginfo('template_directory'); ?>/img/my-serbia-btn.png" alt="myserbia"></div>
        <div class="social-media-logo"><img class="img-responsive" src="<?php bloginfo('template_directory'); ?>/img/instagram-img.png" alt="instagram"></div>
       
     </div>
     
      <!-- Carousel -->
      
			<?php // The header tweets Query
				$args = array( 
					'post_type' => 'tweet',
					'orderby' => 'menu_order',
					'order'=>ASC
				);
				$tweet_query = new WP_Query( $args );
				
				if ( $tweet_query->have_posts() ) :
      ?>
      <div id="header-carousel">
      <?php while ( $tweet_query->have_posts() ) : $tweet_query->the_post(); ?>
        <div class="header-tweet">
            <div class="col-lg-8 col-lg-offset-2 text-center">
              <div class="header-tweet-content">
                <p class="nick"><?php the_title(); ?></p>
                <?php the_content(); ?>
              </div>
            </div>
        </div>
        <?php endwhile; ?>
      </div>
      <?php endif; ?>
      
      <!-- /carousel -->
      
      <div class="col-lg-8 col-lg-offset-2 text-center arrow">
          <a href="#about" class="btn btn-circle page-scroll">
              <span class="glyphicon glyphicon-menu-down" aria-hidden="true"></span>
          </a>
      </div>
      
  </div>
	
  <!-- Video bgd -->
  <video autoplay loop poster="<?php bloginfo('template_directory'); ?>/video/header-bgd.jpg" id="bgvid">
    <source src="<?php bloginfo('template_directory'); ?>/video/tos-video.webm" type="video/webm">
    <source src="<?php bloginfo('template_directory'); ?>/video/tos-video.mp4" type="video/mp4">
  </video> 

</section>
<!-- End Home Page Slider -->
       
       
<!-- About Us Section -->  
<section id="about">     
  
       <?php echo get_template_part('tpl-about'); ?>               
</section>      
<!--/ End of About Us Section -->  

      
                  
<!-- Start Team Section -->
<section class="no-padding" id="team">
        <div class="container-fluid no-padding">
           
           <div id="blogers-carousel" class="owl-carousel owl-theme">
                <?php
                    // The Query
                    $args = array( 
											'post_type' => 'Team members',
											'orderby' => 'menu_order',
											'order'=>ASC
                    );
                    $query1 = new WP_Query( $args );

                    // The Loop
                    while ( $query1->have_posts() ) :
                        $query1->the_post();
                        $img = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'team-img');
                        
                        $title = get_the_title( $ID );
                        $content = get_the_content(); 


                        $tw = get_field('twitter_link');
                        $inst = get_field('instagram_link');
                        $fb = get_field('facebook_link');
                        $link = get_field('custom_link');
										?>

                      <div class="card hovercard">
                      
                         <div class="team-img"><img src="<?php echo $img[0]; ?>" /></div>
                          <div class="info">
                            <div class="title"><h4><?php echo $title; ?></h4></div>
                            <div class="desc"><p><?php echo $content; ?></p></div>
                            <div class="bottom">
                            <?php if (!empty($tw)) : ?>
                            <a class="btn-twitter" href="<?php echo $tw; ?>" target="_blank">
                                <i class="fa fa-twitter"></i>
                            </a>
                            <?php endif; ?>
                            <?php if (!empty($fb)) : ?>
                            <a class="btn-fb" href="<?php echo $fb; ?>" target="_blank">
                                <i class="fa fa-facebook"></i>
                            </a>
                            <?php endif; ?>
                            <?php if (!empty($inst)) : ?>
                            <a class="btn-instagram" href="<?php echo $inst; ?>" target="_blank">
                                <i class="fa fa-instagram"></i>
                            </a>
                            <?php endif; ?>
                            <?php if (!empty($link)) : ?>
                            <a class="btn-custom" href="<?php echo $link; ?>" target="_blank">
                                <i class="fa fa-link"></i>
                            </a>
                            <?php endif; ?>
                            </div>
                         </div>

                       </div>
   
								<?php
                    endwhile;
                    wp_reset_postdata();
                ?>
              </div>
        </div> 
</section>
<!-- End Team Section -->
    

   
<!-- INSTAGRAM -->
<section id="smw">
	<div id="smw-scroll">
    <div class="container-fluid no-padding">
       <div id="smw-isotope" class="grid">
          <?php echo do_shortcode('[social-streams]'); ?>
       </div>
    </div>
  </div>
  <div class="smw-buttons">
    <div class="smw-prev"><i class="icon-chevron-left icon-white"></i></div>
    <div class="smw-next"><i class="icon-chevron-right icon-white"></i></div>
  </div>
</section>
<!-- / END OF INSTAGRAM -->
    

<!-- BLOG POST SLIDER -->
<section id="blog-slider">
     
      <?php
            $args = array( 'posts_per_page' => 5 );
            $lastposts = get_posts( $args );

            
           
            foreach ( $lastposts as $post ) :
              setup_postdata( $post );
              $src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'fullHD' );
              $field = get_fields('author_avatar');
                $author_members = get_field('author_member', $post->ID);
        ?>
        
                <div class="wrap" style="background: url(<?php echo $src[0] ?>) top center no-repeat; background-size:cover;">
                  <div class="infowrap">   
                   <div class="pink new-display">
                      <div class="container">
                        <?php foreach ($author_members as $author_member) : ?>
                        <?php
                            $author_name = get_the_title($author_member->ID);
                            $size = 'thumbnail';
                            $author_image_attr = array(
                                'class'	=> "attachment-$size img-responsive",
                                'alt'	=> trim( strip_tags( $author_name ) ),
                                'title'	=> trim( strip_tags( $author_name ) ),
                            );
                        ?>
                          <div class="circle">
                              <?php echo get_the_post_thumbnail($author_member->ID, $size, $author_image_attr); ?>
                          </div>
                        <?php endforeach; ?>
                          <div class="author-info">
                            <div class="pull">  
                              <span class="post-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></span>
                              <span class="author"><?php echo $author_name; ?>, <?php the_time('d/m/Y'); ?></span>
                            </div>
                          </div>
                      </div>
                   </div>
                   
                   <div class="dark light">
                      <div class="container">
                          <p><?php echo get_excerpt(); ?></p>
                          <?php //the_content(); ?> 
                          <a class="btn-more" href="<?php the_permalink(); ?>"><?php _e( 'Read more', 'tos' ); ?><span class="glyphicon glyphicon-menu-right" aria-hidden="true"></span></a>
 
                      </div>
                   </div>
                  </div>
                </div>
                
            <?php endforeach; 
            wp_reset_postdata(); ?>
</section>
<!-- / END OF POST SLIDER -->



<!---- VIDEO ------>
<section id="video">
   
  <div class="container-fluid no-padding">
       <?php 

        $args = array( 
                     'post_type' => 'video',
										 'orderby' => 'menu_order', 
                     'order'=>ASC
                );
        $query_video = new WP_Query( $args );
        if ( $query_video->have_posts() ) {
            $counter = 0;
            while ( $query_video->have_posts() ) {
                $position = ($counter%2 == 0)?"left":"right";
                $query_video->the_post();

                $img = get_field('video_thumbnail');
                //var_dump($img);
                $yt_short_code = get_field('video_url');
				?>
                <div class="col-md-6 no-padding">
                	<a class="popup-youtube" href="http://www.youtube.com/watch?v=<?php echo $yt_short_code; ?>"> 
                		<img src="<?php echo $img['sizes']['youtube-thumb']; ?>" class="img-responsive" alt="TOS video" />
                  </a>
                </div>
       	<?php
               $counter++; 
            } // end while
        } // end if
        ?>
    </div>
</section>
<!----/ END OF VIDEO ------>