{source}
<script type="text/javascript" src="/./genetic-stock-center/js/jquery-2.2.0.min.js"></script>
<script type="text/javascript" src="/./genetic-stock-center/bootstrap/js/bootstrap.min.js"></script>

<script type="text/javascript">
$('.carousel').carousel(
{
interval: 80000
});
</script>

<?php

//error_reporting(0);

error_reporting(E_ALL & ~E_NOTICE);

require_once "./genetic-stock-center/php/Config/databaseConnector.php";

//Find out if there are carousel entries to display to the user or not.
$pdo = DatabaseConnector::singleton('store');
$connection = $pdo->getConnection();
$statement = $connection->prepare("SELECT filename, link, title, subtext FROM carousel");
$statement->execute();

$results = $statement->fetchAll(PDO::FETCH_ASSOC);

$imageExtensions = ['.jpg', '.jpeg', '.tif', '.tiff', '.png'];
$active = " active";
$carouselHeight = "height: 500px;";

if (!empty($results))
{
//There are items to display. Echo out the carousel.
echo '
<div class="fluid-container">
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">';
echo '<li data-target="#myCarousel" data-slide-to="0" class="active"></li>';
for ($count = 1; $count < count($results); $count++)
{
echo '<li data-target="#myCarousel" data-slide-to="' . $count . '"></li>';
}
echo '</ol>

<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox" style="width: 100%; ' . $carouselHeight . '">';
foreach ($results as $value)
{
//Determine if the file is an image or a video.
$fileType = "video";
foreach ($imageExtensions as $extension)
{
if (strpos($value['filename'], $extension) !== FALSE)
{
$fileType = "image";
break;
}
}

//Make the html for the title.
if (!empty($value['title']))
{
$title = '<h3 class="h3-responsive" style="color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">' . $value['title'] . '</h3>';
}
else
{
$title = '';
}

//Make the html for the subtext.
if (!empty($value['subtext']))
{
$subtext = '<p style="color: white; text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;">' . $value['subtext'] . '</p>';
}
else
{
$subtext = '';
}

//Prepare the html for the link.
if (!empty($value['link']))
{
$linkStart = '<a href="' . $value['link'] . '" target="_blank">';
$linkEnd = '</a>';
}
else
{
$linkStart = '';
$linkEnd = '';
}

if (strcmp($fileType, 'video') == 0)
{
//This is a video.
echo '
<div class="item' . $active . '" align="center" >
' . $linkStart . '
<video class="video-fluid" autoplay loop muted style="object-fit: contain; width: 100%; ' . $carouselHeight . '"><source src="' . CAROUSEL_IMAGE_LOCATION . $value['filename'] . '"></video>
' . $linkEnd . '
<!--Caption-->
<div class="carousel-caption">
<div class="animated fadeInDown">
' . $title . '
' . $subtext . '
</div>
</div>
<!--Caption-->
</div>
';
}
else
{
//This is an image.
echo '
<div class="item' . $active . '" align="center">
' . $linkStart . '
<img style="object-fit: contain; width: 100%; ' . $carouselHeight . '" src="' . CAROUSEL_IMAGE_LOCATION . $value['filename'] . '" alt="' . $value['filename'] . '">
' . $linkEnd . '
<div class="carousel-caption">
<div class="animated fadeInDown">
' . $title . '
' . $subtext . '
</div>
</div>
</div>
';
}

$active = "";
}

echo '
</div>

<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>';
}

?>
{/source}