<?php /*template name: collections*/ get_header(); ?>
<div class="uk-cover-container uk-text-center banner white" uk-scrollspy="cls: uk-animation-fade; delay: 300">
    <canvas class="uk-visible@m" width="" height="300"></canvas>
    <canvas class="uk-hidden@m" width="" height="300"></canvas>


    <?php
    $image = get_field('banner_image');
    if( !empty( $image ) ): ?>
        <img uk-img data-src="<?php echo esc_url($image['url']); ?>" alt="<?php echo esc_attr($image['alt']); ?>" / data-width data-height uk-cover>
    <?php endif; ?>




	<div class="uk-position-cover uk-text-center uk-container uk-flex uk-flex-center uk-flex-middle" uk-scrollspy="cls: uk-animation-fade; delay: 500">
        <div>
            <h1 class="white"><?php the_title(); ?></h1>
      </div>
    </div>
</div>


<?php
// Check if the correct password cookie is set
if ( isset( $_COOKIE['custom_password'] ) && $_COOKIE['custom_password'] === get_field('password_field', 7) ) {
    // If the password matches, show the protected content
    ?>
    <div class="protected-content">




<div class="uk-container uk-container-large">
	<main role="main">
			<section >


				<?php if (have_posts()): while (have_posts()) : the_post(); ?>

					<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

            <h2 uk-scrollspy="cls: uk-animation-fade; delay: 300" class="uk-text-center uk-margin-xlarge-top uk-margin-medium-bottom"><?php echo esc_html( get_field('header') ); ?></h2>

            <?php
            $sub_title = get_field('sub_title');
            if ( !empty( $sub_title ) ) : ?>
                <h3 uk-scrollspy="cls: uk-animation-fade; delay: 300" class="uk-text-center uk-margin-medium-bottom"><?php echo esc_html( $sub_title ); ?></h3>
            <?php endif; ?>

            <div class="uk-text-center" uk-scrollspy="cls: uk-animation-fade; delay: 300">

              <?php
              $image = get_field('catalogue_image');
              if( !empty( $image ) ): ?>
                  <img uk-img data-src="<?php echo esc_url($image['url']); ?>" alt="<?php echo esc_attr($image['alt']); ?>" / data-width data-height>
              <?php endif; ?>

            </div>


            <div class="uk-grid-large uk-margin-medium-bottom uk-margin-large-top" uk-grid uk-scrollspy="target: > div; cls: uk-animation-fade; delay: 300">
              <div class="uk-width-1-2@m">
        				<div class="uk-text-right@m uk-text-center">
                  <?php
                  $cat = get_field('catalouge_copy');
                  if ( !empty( $cat ) ) : ?>
                      <a class="yellow-btn yellow-blue" uk-toggle="target: #flip" href="#">View Catalogue <i class="fa-light fa-file-pdf"></i></a>

                      <div id="flip" uk-modal>
                          <div class="uk-modal-dialog white-bg">
                              <?php echo do_shortcode( $cat ); ?>
                          </div>
                      </div>

                  <?php endif; ?>

                </div>
              </div>
              <div class="uk-width-1-2@m">
                <div class="uk-text-left@m uk-text-center">
                  <?php
                    $file = get_field('catalouge');
                    if( $file ): ?>
                        <a target="_BLANK"  class="outline-blue-btn" href="<?php echo $file['url']; ?>">Download a Copy <i class="fa-light fa-download"></i></a>
                    <?php endif; ?>

                </div>
              </div>
            </div>

						<?php the_content(); ?>

						<div class="uk-clearfix"></div>

						<p class="uk-text-right"><?php edit_post_link( __('Edit this page'), '', '', 0, 'post-edit-link uk-text-large uk-padding-small uk-button-large uk-button uk-button-primary' ); ?></p>

					</article>

			<?php endwhile; ?><?php endif; ?>

			</section>
	</main>
</div>

<div uk-scrollspy="cls: uk-animation-fade; delay: 300" class="collections-bg uk-padding-large" style="
<?php
$image = get_field('footer_banner_image');
if( !empty( $image ) ): ?>
    background-image: url('<?php echo esc_url($image['url']); ?>');
<?php endif; ?>">
	<div class="uk-container" uk-scrollspy="cls: uk-animation-fade; delay: 500">
		<h2 class="small white uk-text-center uk-margin-medium-top">To order, please fill out our printable order form.</h2>

		<div class="uk-text-center">
      <?php
        $file = get_field('order_form');
        if( $file ): ?>
            <a target="_BLANK"  class="yellow-btn yellow-blue" href="<?php echo esc_url($file['url']); ?>">Download Order Form <i class="fa-light fa-file-pdf"></i></a>
        <?php endif; ?>
    </div>

	</div>
</div>


</div>
<?php
} else { ?>

  <div class="uk-container">

    <h3 class="blue uk-margin-large-top uk-margin-medium-bottom">This page is only available to our Registered Dealers</h3>

    <a href="#" uk-toggle="target: #login" class=" yellow-btn yellow-blue uk-margin-xlarge-bottom">Login or Sign Up<i class="fa-kit fa-diamond-icon"></i></a>

  </div>
<?php }
?>


<?php get_footer(); ?>
