<html>
<head>
<title>Indefoto</title>


<style type="text/css">
body {
	font: Arial, Helvetica, sans-serif normal 10px;
	margin: 0; padding: 0;
}
* {margin: 0; padding: 0;}
img {border: none;}
.container {
	height: 380px;
	width: 910px;
	margin: -150px 0 0 -450px;
	top: 150px; left: 50%;
	position: absolute;
}
ul.thumb {
	float: left;
	list-style: none;
	margin: 0; padding: 10px;
	width: 380px;
}
ul.thumb li {
	margin: 0; padding: 5px;
	float: left;
	position: relative;
	width: 110px;
	height: 110px;
}
ul.thumb li img {
	width: 100px; height: 100px;
	border: 1px solid #ddd;
	padding: 5px;
	background: #f0f0f0;
	position: absolute;
	left: 0; top: 0;
	-ms-interpolation-mode: bicubic; 
}
ul.thumb li img.hover {
	background:url(thumb_bg.png) no-repeat center center;
	border: none;
}
#main_view {
	float: left;
	padding: 9px 0;
	margin-left: -10px;
        width: 400px;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){


//Larger thumbnail preview 


$("ul.thumb li").hover(function() {
	$(this).css({'z-index' : '10'});
	$(this).find('img').addClass("hover").stop()
		.animate({
			marginTop: '-110px', 
			marginLeft: '-110px', 
			top: '50%', 
			left: '50%', 
			width: '174px', 
			height: '174px',
			padding: '20px' 
		}, 200);
	
	} , function() {
	$(this).css({'z-index' : '0'});
	$(this).find('img').removeClass("hover").stop()
		.animate({
			marginTop: '0', 
			marginLeft: '0',
			top: '0', 
			left: '0', 
			width: '100px', 
			height: '100px', 
			padding: '5px'
		}, 400);
});


//Swap Image on Click
	$("ul.thumb li a").click(function() {
		
		var mainImage = $(this).attr("href"); //Find Image Name
		$("#main_view img").attr({ src: mainImage });
		return false;		
	});
 
});
</script> 


</head>


<body>


<?php 


   // Foto's tellen 
   $dir                  =   "upload/test/"; 
   $max_foto            =   12; 
   $st_pagina           =   1; 
    
   $dir_aantal         =   opendir($dir); 
   $teller            =   "0"; 
    
   while($file = readdir($dir_aantal)){ 
    
     if ($file != '.' && $file != '..'){ 
             $teller = $teller + 1; 
     if (!eregi('.GIF|.JPG|.JPEG|.jpg|.gif', $file)) { 
             $teller = $teller - 1; 
   }          
    
      } 
   } 
   closedir($dir_aantal); 


   // Pagina opvragen 
   $aantal      =   ceil($teller / $max_foto); 
    
   $pagina               =   $_GET["pagina"]; 
    
   if (empty($pagina))                        
    { 
    $pagina = 1;                      
    } 


   if ($pagina <= 1)                            
    { 
    $pagina = 1; 
    } 
   if ($pagina >= $aantal) { 
   $pagina   = $aantal; 
   } 
  
   // Pagina's indelen 
          
   $begin       =    ($pagina * $max_foto) + 1 - $max_foto; 
   $einde       =    ($pagina * $max_foto) + $$max_foto;  
    
   // Navigatie 
   $vorige      =   $pagina - 1; 
   $volgende      =   $pagina + 1; 
   $ruimte      =   "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"; 
   $navigatie   =   "[ $vorige | <b>$pagina</b> | $volgende ]"; 
    
   if    ($pagina == 1){ 
     $vorige   =   $aantal; 
   } 
   if   ($pagina ==  $aantal){ 
     $volgende   =   $st_pagina;    
   } 
   if   ($pagina >=  $aantal){ 
     $volgende   =   $st_pagina;    
   } 
        
   if    ($pagina == 1){ 
     $navigatie =      "[ ... | <b>$pagina</b>  | $volgende ]"; 
   } 
   if   ($pagina ==  $aantal){ 
     $navigatie =      "[ $vorige | <b>$pagina</b> | ... ]"; 
   } 
   if   ($pagina >=  $aantal){ 
     $navigatie =      "[ $vorige | <b>$pagina</b> | ... ]"; 
   } 


   echo "    
"; 


   // Afbeeldingen weergeven 


   $filepath = $dir; 


   $pic_array = Array(); 


   if( ($pic_dir = @opendir("$filepath")) !== false ) 
    { 
        while (($pic = readdir($pic_dir)) !== false) 
            { 
                if ($pic != "." && $pic != ".." && is_file($filepath.$pic))    
                    { 
                            $pic_array[] = $pic; 
                            } 
            } 
        closedir($pic_dir); 
    } 


   // 1 lange array maken van alle foto's 
   $i = 0; 


   $teller = 0; 
   echo("<div class='container'>
<ul class='thumb'>"); 


   foreach($pic_array as $id => $pic) { 
   $fotoarray[$i] = $pic; 
   $i++; 


      $adres = $dir . "" . $pic; 
      $adres1 = $pic; 
      if (($i >= $begin) && ($i <= $einde)) { 
        
    if($teller == 3) { 
        $teller = 0; 
         } 
      
    echo "<li><a href='$adres'><img src='http://www.starohost.com/indefoto/image.php/$adres1'?width=150&amp;height=150&amp;cropratio=1:1&amp;image=/'$adres' alt='text' />
</a></li>"; 
         $teller++; 
         } 
   } 


   echo("</ul>
<div id='main_view'>
	<img src='upload/test/DSC_0056.jpg' alt='' /><br />
<small style='float: center; color: #999;'><a href=\"fotoalbum.php?page=fotoboek&amp;pagina=$vorige \">Vorige</a>  $ruimte    $navigatie    $ruimte  <a href=\"fotoalbum.php?page=fotoboek&amp;pagina=$volgende \"></small> 
         Volgende</a>
</div>
</div>
"); 
    
   // sorteren van array (alle afbeeldingen zijn nu al geladen)      
   sort($pic_array); 
    


   
          
?>