<?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/vhosts/dordanmech.com/httpdocs/','','../','../../','../../../');
  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 records from 'projects'
  list($projectsRecords, $projectsMetaData) = getRecords(array(
    'tableName'   => 'projects',
    'loadUploads' => true,
    'allowSearch' => false,
  ));

  // load record from 'projects_introduction'
  list($projects_introductionRecords, $projects_introductionMetaData) = getRecords(array(
    'tableName'   => 'projects_introduction',
    'where'       => '', // load first record
    'loadUploads' => true,
    'allowSearch' => false,
    'limit'       => '1',
  ));
  $projects_introductionRecord = @$projects_introductionRecords[0]; // get first record
  if (!$projects_introductionRecord) { dieWith404("Record not found!"); } // show error message if no record found

?>
<!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">
    <title><?php echo htmlencode($projects_introductionRecord['title']) ?></title>
    <meta content="" name="description">
    <meta content="" name="author">
    <meta content="" name="keywords">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport">
    <!-- favicon -->
    <link href="img/favicon.png" rel="icon" sizes="32x32" type="image/png">
    <!-- Bootstrap CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <!-- font themify CSS -->
    <link rel="stylesheet" href="css/themify-icons.css">
    <!-- font awesome CSS -->
    <link href="font-awesome/css/font-awesome.css" rel="stylesheet">
    <!-- revolution slider css -->
    <link rel="stylesheet" type="text/css" href="css/fullscreen.css" media="screen" />
	<link rel="stylesheet" type="text/css" href="rs-plugin/css/settings.css" media="screen" />
    <link rel="stylesheet" href="css/rev-settings.css" type="text/css">
    <!-- on3step CSS -->
    <link href="css/animated-on3step.css" rel="stylesheet">
    <link href="css/owl.carousel.css" rel="stylesheet">
    <link href="css/owl.theme.css" rel="stylesheet">
    <link href="css/owl.transitions.css" rel="stylesheet">
    <link href="css/on3step-style.css" rel="stylesheet">
    <link href="css/queries-on3step.css" media="all" rel="stylesheet" type="text/css">
  </head>
  <body>
  
    <!-- preloader -->
    <div class="bg-preloader"></div>
    <div class="preloader">
      <div class="mainpreloader">
      <span></span>
      </div>
  </div>
    <!-- preloader end -->
    
    <!-- content wraper -->
    <div class="content-wrapper">
    
<?php require_once('_masthead2.php'); ?>
      
      <!-- subheader -->
      <section id="subheaderprojects">
        <img class="background-img" src="<?php echo $imgUrl ?>">
        <div class="container">
          <div class="row">
            <div class="col-md-12">
              <h1><?php echo htmlencode($projects_introductionRecord['title']) ?></h1>
            </div>
            
            <!-- devider -->
            <div class="col-md-12">
              <div class="devider-page">
                <div class="devider-img-right">
                </div>
              </div>
            </div>

            <div class="col-md-12">
              <ul class="subdetail">
                <li>&nbsp;</li>
              </ul>
            </div>
          </div>
        </div>
      </section>
      <!-- subheader end -->
      
      <!-- section projects -->
      <section class="whitepage no-top" id="projects">
        <div class="container">
          <div class="row">
          
            <!-- filter project -->
            <div class="onStep" data-animation="fadeInUp" data-time="300">
              <div class="filter-wraper text-center">
                <ul id="filter-porto">
  <li class="space"></li>
  <li class="filt-projects" data-project="*">View All</li>
  <li class="space"></li>

  <?php foreach ($projectsRecords as $record): ?>
    <?php if (@$alreadySeen[ $record['category'] ]++) { continue; } // skip categories we've already seen ?>
    <li class="filt-projects" data-project=".<?php echo $record['category'] ?>"><?php echo $record['category:label'] ?></li>
    <li class="space"></li>
  <?php endforeach ?>
</ul>
              </div>
            </div>
            <!-- filter project end -->
            
            <!-- start gallery -->
            <div class="no-gutter onStep" data-animation="fadeInUp" data-time="600" id="projects-wrap">

              <?php foreach ($projectsRecords as $record): ?>
              <div class="col-md-4 col-xs-12 item <?php echo $record['category'] ?>">
                <div class="projects-grid">
                    
<?php foreach ($record['images'] as $index => $upload): ?>
<?php if ($index >= 1) { continue; } // limit uploads shown ?>
<a href="<?php echo $record['_link'] ?>">
<img src="<?php echo htmlencode($upload['urlPath']) ?>" width="<?php echo $upload['width'] ?>" height="<?php echo $upload['height'] ?>" alt="<?php echo htmlencode($record['title']) ?>" class="img-responsive" /></a>
<?php endforeach ?>
                    
                      <p><a href="<?php echo $record['_link'] ?>"><?php echo htmlencode($record['title']) ?> &raquo;</a></p>
                </div>
              </div>
              <?php endforeach ?>
                            
            </div>
            <!-- gallery end -->
          </div>
        </div>
      </section>
      <!-- section projects end -->
      
      <!-- footer -->
<?php require_once('_footer.php'); ?>
      <!-- footer end -->
      
      <!-- ScrolltoTop -->
      <div id="totop">
        <span class="ti-angle-up"></span>
      </div>
      
    </div>
    <!-- content wraper end -->
    
    <!-- plugin JS -->
    <script src="plugin/pluginson3step.js" type="text/javascript"></script> 
    <!-- slider revolution  -->
    <script type="text/javascript" src="rs-plugin/js/jquery.themepunch.revolution.min.js"></script>
    <!-- on3step JS -->
    <script src="js/on3step.js" type="text/javascript"></script>
    <script src="js/plugin-set.js" type="text/javascript"></script>
  </body>
</html>