<?php header('Content-type: text/html; charset=utf-8'); ?>
<?php
  /* STEP 1: LOAD RECORDS - Copy this PHP code block near the TOP of your page */
  
  // load viewer library
  $libraryPath = 'cmsb/lib/viewer_functions.php';
  $dirsToCheck = array('/var/www/html/','','../','../../','../../../');
  foreach ($dirsToCheck as $dir) { if (@include_once("$dir$libraryPath")) { break; }}
  if (!function_exists('getRecords')) { die("Couldn't load viewer library, check filepath in sourcecode."); }

  // load record from 'homepage'
  list($homepageRecords, $homepageMetaData) = getRecords(array(
    'tableName'   => 'homepage',
    'where'       => '', // load first record
    'loadUploads' => true,
    'allowSearch' => false,
    'limit'       => '1',
  ));
  $homepageRecord = @$homepageRecords[0]; // get first record
  if (!$homepageRecord) { dieWith404("Record not found!"); } // show error message if no record found

  // load records from 'products'
  list($productsRecords, $productsMetaData) = getRecords(array(
    'tableName'   => 'products',
    'perPage'     => '6',
    'loadUploads' => true,
    'allowSearch' => false,
  ));

  // load records from 'meet_the_team'
  list($meet_the_teamRecords, $meet_the_teamMetaData) = getRecords(array(
    'tableName'   => 'meet_the_team',
    'loadUploads' => true,
    'allowSearch' => false,
  ));

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
    <meta charset="utf-8">
    
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="Common Sense Design">
    <link rel="icon" type="image/ico" href="img/favicon.png">

    <title><?php echo htmlencode($homepageRecord['title']) ?></title>

    <!-- Custom styles for this template -->
    <link rel="stylesheet" href="stylesheets/2eef9d0d.main.css"/>
    <link href='http://fonts.googleapis.com/css?family=Libre+Baskerville:400,700,400italic' rel='stylesheet' type='text/css'>

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->

    <!-- Google fonts -->
    <script type="text/javascript">
      WebFontConfig = {
        google: { families: [ 'Arvo:700:latin', 'Libre+Baskerville:400,700,400italic:latin' ] }
      };
      (function() {
        var wf = document.createElement('script');
        wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
          '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
        wf.type = 'text/javascript';
        wf.async = 'true';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(wf, s);
      })();
    </script>

  </head>
  <body>
<!-- Modal register-->
<div class="modal  fade" id="registerModal" tabindex="-1" role="dialog" aria-labelledby="registerModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content  center">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
        <h3><span class="light">Register</span> to Organique</h3>
        <hr class="divider">
      </div>
      <div class="modal-body">
        <form action="#" class="push-down-15">
          <div class="form-group">
            <input type="text" id="name" class="form-control  form-control--contact" placeholder="Username">
          </div>
          <div class="form-group">
            <input type="text" id="email" class="form-control  form-control--contact" placeholder="Email">
          </div>
          <div class="form-group">
            <input type="text" id="subject" class="form-control  form-control--contact" placeholder="Password">
          </div>
          <button type="submit" class="btn  btn-primary">REGISTER</button>
        </form>
        <a data-toggle="modal" role="button" href="#loginModal" data-dismiss="modal">Already Registered?</a>
      </div>
    </div>
  </div>
</div>

<!-- Modal login-->

<?php require_once('_masthead.php'); ?>

<div id="carousel-example-generic" class="carousel  slide" data-ride="carousel">
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
  </ol>

  <!-- Wrapper for slides -->
  <div class="carousel-inner">
    
    <div class="item active">
      <img src="img/organic-slider-2b.jpg" alt="">
      <div class="carousel-caption">

        <div class="jumbotron__container">
          <h2 class="jumbotron__subtitle">
            Fresh Mountainoak milk made into high quality, all natural, Mountainoak cheese
          </h2>
          <h1 class="jumbotron__title">
            Great cheese begins with high quality milk
          </h1>
          <a class="btn btn-primary" href="#">More details</a>
        </div>

      </div>
    </div>
    <div class="item">
      <img src="img/organic-slider-4.jpg" alt="">
      <div class="carousel-caption">

        <div class="jumbotron__container">
          <h2 class="jumbotron__subtitle">
            Great-tasting Gouda-style cheeses made with milk from our own cows
          </h2>
          <h1 class="jumbotron__title">
            Farmstead Gouda in the Dutch tradition
          </h1>
<a class="btn btn-primary" href="#">More details</a>
        </div>

      </div>
    </div><div class="item">
      <img src="img/organic-slider-3.jpg" alt="">
      <div class="carousel-caption">

        <div class="jumbotron__container">
          <h2 class="jumbotron__subtitle">
            This is a brief intro to entice visitors
          </h2>
          <h1 class="jumbotron__title">
            Headline for this slide goes here
          </h1>
<a class="btn btn-primary" href="#">More details</a>
        </div>

      </div>
    </div>
  </div>

  <!-- Controls -->
  <a class="left  carousel-control" href="#carousel-example-generic" data-slide="prev">
    <span class="glyphicon  glyphicon-chevron-left"></span>
  </a>
  <a class="right  carousel-control" href="#carousel-example-generic" data-slide="next">
    <span class="glyphicon  glyphicon-chevron-right"></span>
  </a>
</div>

<div class="container">
<div class="products-navigation  push-down-15">
  <div class="products-navigation__title">
    <h3>Featured Cheeses</h3>
  </div>
</div>

<!-- Featured Products -->
<div class="row">

<?php foreach ($productsRecords as $record): ?>
<div class="col-xs-6 col-sm-2  js--isotope-target  js--cat-2" data-price="13.71" data-rating="5">
<div class="products__single">
<figure class="products__image">
<a href="<?php echo $record['_link'] ?>">
<?php foreach ($record['main_image'] as $index => $upload): ?>
<img class="product__image" src="<?php echo $upload['thumbUrlPath'] ?>" width="<?php echo $upload['thumbWidth'] ?>" height="<?php echo $upload['thumbHeight'] ?>" alt="" />
<?php endforeach ?>
</a>
<div class="product-overlay">
<a class="product-overlay__more" href="<?php echo $record['_link'] ?>">
<span class="glyphicon glyphicon-search"></span>
</a>
</div>
</figure>
<div class="row">
<div class="col-xs-12">
<h5 class="products__title"><a href="<?php echo $record['_link'] ?>"><?php echo htmlencode($record['title']) ?></a></h5>
</div>
</div>
</div>
</div>
<?php endforeach ?>
<?php if (!$productsRecords): ?><?php endif ?>
  
<div class="clearfix visible-xs"></div> 
    
</div>

</div>
<div class="testimonials  team-slider  light-paper-pattern">
  <div class="container">
    <div class="row">
      <div class="col-xs-12">
        <a href="#js--team-carousel" data-slide="prev"><span class="glyphicon  glyphicon-circle  glyphicon-chevron-left"></span></a>
        <h3 class="testimonials__title">Meet the Team</h3>
        <a href="#js--team-carousel" data-slide="next"><span class="glyphicon  glyphicon-circle  glyphicon-chevron-right"></span></a>
        <div class="push-down-35"></div>
      </div>
    </div>
    <div id="js--team-carousel" class="carousel  slide" data-ride="carousel" data-interval="5000">
      <div class="carousel-inner">
        <div class="item  active">
          <div class="row">

<?php foreach ($meet_the_teamRecords as $record): ?>
            <div class="col-xs-12  col-sm-3">
              <?php foreach ($record['photo'] as $index => $upload): ?>
<img src="<?php echo $upload['urlPath'] ?>" width="<?php echo $upload['width'] ?>" height="<?php echo $upload['height'] ?>" alt="" />
<?php endforeach ?>
              <h5><?php echo htmlencode($record['title']) ?></h5>
              <span class="team-slider__title"><?php echo htmlencode($record['job_title']) ?></span>
            </div>
<?php endforeach ?>
<?php if (!$meet_the_teamRecords): ?><?php endif ?>            
          </div>
        </div>
      </div>
    </div>
  </div>
</div>


<div class="simple-map  js--where-we-are" data-latlng="43.361390,-80.623277" data-markers="[{lat: 43.361390,lng: -80.623277,title: 'Mountainoak Cheese'}]" data-zoom="16">
</div>
  <?php require_once('_footer.php'); ?>
  </body>
</html>