Untitled

<!DOCTYPE html>
<html lang="en">

<head>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">

<title>360 Freeze Frame</title>

<link href="css/bootstrap.min.css" rel="stylesheet">

<link href="css/thumbnail-gallery.css" rel="stylesheet">

<style>
img{max-width:200px;max-height:200px;width:200px;height:200px;}
.img360{border:1px solid #CCC;border-radius:8px;}

</style>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="js/directorySlider.js"></script>
<script src="js/bootstrap.min.js"></script>

</head>

<body>
  <!-- Navigation -->
    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
        <div class="container">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <a class="navbar-brand" href="#">360 Freeze Frame</a>
            </div>
            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav">

                </ul>
            </div>
            <!-- /.navbar-collapse -->
        </div>
        <!-- /.container -->
    </nav>

     <!-- Page Content -->
    <div class="container">

        <div class="row">

            <div class="col-lg-12">
                <h1 class="page-header">Select your Freeze Frame! <small>Frames from <?php echo date("F j, Y"); ?></small></h1>
            </div>
            <div class="col-lg-12">
<?php
$a = 0;
$b = 0;
$c = 0;

if ($handle = opendir('.')) {
    $blacklist = array('.', '..', 'frames', 'sort.php', 'compress.php', 'test.txt', 'css', 'fonts', '.DS_Store', 'js');
    while (false !== ($file = readdir($handle))) {
        if (!in_array($file, $blacklist)) {
		$atime = substr($file, 0, 2) . ':' . substr($file, 2);
		$gtime = substr($atime, 0, 5) . ' ' . substr($atime, 5);
	echo '<div style="width:230px;position:relative;display:inline-block;margin:20px;" class="panel panel-default">
			<div class="panel-heading"><h3 style="text-align:center;" class="panel-title">'. $gtime .'</h3></div><div class="panel-body">';
    echo "<div style='margin-bottom:10px;' id='". ++$a ."'></div><button style='width:100%;' type='button' class='btn btn-primary btn-lg'>Select</button></div></div>";


	echo "<script>
$('#". ++$c ."').directorySlider({
    animation: 'fade',
    filebase: 'a',
    directory: '".$file."/',
    extension: 'jpg',
    numslides: 18,
    height: 200,
	timeout: 100,
	speed: 100
});

</script>";
        }
    }
    closedir($handle);
}

?></div>

        </div>

        <hr>

        <!-- Footer -->
        <footer>
            <div class="row">
                <div class="col-lg-12">
                    <p>Copyright &copy; Connecticut Science Center 2014</p>
                </div>
            </div>
        </footer>

    </div>
    <!-- /.container -->

</body>
</html>