Better of faster way of reading and diplaying folder image ?

[Peuplarchie]

Good day to you all,

              I'm working on a photo gallery code.

              I find my code very slow !

 

Can somebody help me figure out why ?

And if somebody know a better way of doing such ?

 

here is my code:

 

<?php

set_time_limit(0);


	$dir = $_GET['dir'];
$directory = $dir;



$my_directory = ($directory);
$dir = dir($my_directory);
while($temp = $dir->read())
{
  $dirarray[] = $temp;
}
print j_array($dirarray);

function j_array($var){
$javastr = "<script language=\"javascript\">";
$javastr .= "var d = new Array();";
$diro="Pictures/";
while(list($key, $val) = each($var)){
  $javastr .= "d[$key] = new Image();";
      $javastr .= "d[$key].src = '$diro$val';";
}
$javastr .= "</script>";
return $javastr;
}






$diri = $directory; //You could add a $_GET to change the directory
$files = scandir($diri);
//Creating var for Portrait images list	
$portrait = "";
//Creating var for Landscape images list	
$landscape = "";
//Creating var for panoramic images list	
$panoramic = "";
//Creating var for panoramic images list	
$other = "";
// Echo the name

echo "<div id=\"bar\"><b>".strtoupper($directory)." </b></div>";
echo "<br/><div>";
foreach($files as $key => $value){

if ($value != "." && $value != "..") {

	//Substring to $value his last 5 char
	$formatfind =  substr($value,-5);
	// Subtracting to this the last 4
	$format =  substr($formatfind,0,-4);
	//This is in my naming convension.Portrait equal 1    landscape equal 0 and panoramic equal 2

// if file $format equal 1
    if ($format == "1") {
// add it to portrait list
$portrait .= "<a onmouseover=this.style.cursor=\"pointer\" ' onfocus='this.blur();' onclick=\"document.getElementById('".$value."').style.display = 'block' \" ><img src=\"".$directory."/".$value."\" width=\"50px\" class=\"imag\"></a>\n"; 
$portrait .= "<div id=\"".$value."\"   style=\"display: none;  position: absolute;  margin-left:-100px; margin-top:-225px;  padding: 10px; background-color: #ffffff; text-align: justify; font-size: 12px;\">";
$portrait .= "<img src=\"".$directory."/".$value."\"   name=\"".$value."\"/><br />".$value."<br/><div style=\"color:#000000; background-color:#ffffff; font-size:14px; text-align:center;\" onmouseover=\"this.style.backgroundColor='#cccccc'; this.style.cursor='pointer';\" style='font-size: 12px; ' onfocus='this.blur();' onmouseout=\"this.style.backgroundColor='#FFFFFF';\" onclick=\"document.getElementById('".$value."').style.display = 'none' \" ><b>Fermer</b></div></div>";
}

// if  file $format equal 2	
if ($format == "2") {
$landscape .= "<a onmouseover=this.style.cursor=\"pointer\" ' onfocus='this.blur();' onclick=\"document.getElementById('".$value."').style.display = 'block' \" ><img src=\"".$directory."/".$value."\" width=\"50px\" class=\"imag\"></a>\n"; 
$landscape .= "<div id=\"".$value."\"   style=\"display: none;  position: absolute;  margin-left:-250px; margin-right:auto;  margin-top:-200px; margin-bottom:auto;   padding: 10px; background-color: #ffffff; text-align: justify; font-size: 12px;\">";
$landscape .= "<img src=\"".$directory."/".$value."\"   name=\"".$value."\"/><br />".$value."<br/><div style=\"color:#000000; background-color:#ffffff;  font-size:14px; text-align:center;\"  onmouseover=\"this.style.backgroundColor='#cccccc'; this.style.cursor='pointer';\" style='font-size: 12px;' onfocus='this.blur();'  onmouseout=\"this.style.backgroundColor='#FFFFFF';\"  onclick=\"document.getElementById('".$value."').style.display = 'none' \" ><b>Fermer</b></div></div>";



}

// if  file $format equal 3	
if ($format == "3") {
$panoramic .= "<a onmouseover=this.style.cursor=\"pointer\" ' onfocus='this.blur();' onclick=\"document.getElementById('".$value."').style.display = 'block' \" ><img src=\"".$directory."/".$value."\" width=\"50px\" class=\"imag\"></a>\n"; 
$panoramic .= "<div id=\"".$value."\"   style=\"display: none;  position: absolute;  margin:0 auto; margin-top:-450px;   padding: 10px; background-color: #ffffff; text-align: justify; font-size: 12px;\">";
$panoramic .= "<img src=\"".$directory."/".$value."\"   name=\"".$value."\"/><br />".$value."<br/><div style=\"color:#000000; background-color:#ffffff;  font-size:14px; text-align:center;\"   onmouseover=\"this.style.backgroundColor='#cccccc'; this.style.cursor='pointer';\"style='font-size: 12px;' onfocus='this.blur();'  onmouseout=\"this.style.backgroundColor='#FFFFFF';\"  onclick=\"document.getElementById('".$value."').style.display = 'none' \" ><b>Fermer</b></div></div>";


}
}else{
$other .= "<a onmouseover=this.style.cursor=\"pointer\" ' onfocus='this.blur();' onclick=\"document.getElementById('".$value."').style.display = 'block' \" ><img src=\"".$directory."/".$value."\" width=\"50px\" class=\"imag\"></a>\n"; 
$other .= "<div id=\"".$value."\"   style=\"display: none;  position: absolute;  margin:0 auto; margin-top:-450px;   padding: 10px; background-color: #ffffff; text-align: justify; font-size: 12px;\">";
$other .= "<img src=\"".$directory."/".$value."\"   name=\"".$value."\"/><br />".$value."<br/><div style=\"color:#000000; background-color:#ffffff;  font-size:14px; text-align:center;\"   onmouseover=\"this.style.backgroundColor='#cccccc'; this.style.cursor='pointer';\"style='font-size: 12px;' onfocus='this.blur();'  onmouseout=\"this.style.backgroundColor='#FFFFFF';\"  onclick=\"document.getElementById('".$value."').style.display = 'none' \" ><b>Fermer</b></div></div>";

	}

}
// echo result of the 3 format
echo "<center>".$portrait."</center>";
echo "<br/>";
echo  "<center>".$landscape."</center>";
echo "<br/>";
echo  "<center>".$panoramic."</center>";
echo "<br/>";	
echo  "<center>".$other."</center>";
echo "<br/>";
echo "</div>"

?>

 

 

Thanks !