i have been working on revamping my site.
i just need some input on this test page/gallery
http://www.animerealmz.net/ArcTheLad_gallery.php
i need to know
1) how it looks on different resolutions
2) if it looks great on some and worse on other resolutions how to best fix this
3) browsers how does it look in different browsers on each resolution posted?
i have the codeing handy incase someone has a usefull suggestion to modify ANYTHING at all
like maybe i can change the code to fix the image size and number of images per row to go with each major jump in resolution????
here is the gallery script i am useing
PHP Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<LINK href="style.css" rel=stylesheet>
</head>
<body>
<!-- START main -->
<table border="0" cellpadding="0" cellspacing="0" align="center">
<?php
// max image width/height
$config['size'] = 300;
// jpeg thumbnail image quality
$config['imagequality'] = 200;
// rows of images per page
$config['rows'] = 5;
// columns of images per page
$config['cols'] = 5;
// max page numbers to show at once
$config['maxShow'] = 10;
$config['start'] = 0;
$config['max'] = 0;
$config['page'] = isset($_GET['page'])?$_GET['page']:"0";
// folder where full size images are stored (include trailing slash)
$config['fulls']="ArcTheLad_images/";
// folder where thumbnails are to be created
$config['thumbs'] = "$config[fulls]thumb";
// method to create thumbnails. options: gd1, gd2, imagemagick
$config['imagemethod'] = "gd2";
// (if imagemagick) - Path to Imagemagick "convert" program
$config['convert'] = "/usr/bin/convert";
// (if imagemagick) - Path to Imagemagick "identify" program
$config['identify'] = "/usr/bin/identify";
#######################################################################
//see if dir exits, if not create
if(isset($_GET['entry'])){
GetEntry();
}else{
PrintThumbs();
}
#######################################################################
#-#############################################
# desc: prints out html for thumbnails of images in directory
function PrintThumbs(){
global $config;
if (!file_exists($config['fulls'])) {
oops("directory <b>$config[fulls]</b> does not exist");
die;
}
//thumb directory
if (!file_exists($config['thumbs'])) {
if (!mkdir($config['thumbs'], 0755)) {
oops("Could not create thumb directory <b>$config[thumbs]</b> - check write permissions");
die;
}
}
$imagelist = GetFileList($config['fulls']);
// echo count($imagelist);
//processing for how many images to do on current page
$config['start']=($config['page']*$config['cols']*$config['rows']);
$config['max']=( ($config['page']*$config['cols']*$config['rows']) + ($config['cols']*$config['rows']) );
if($config['max'] > count($imagelist)){$config['max']=count($imagelist);}
echo "<tr><td align=\"right\" colspan=\"$config[cols]\" style=\"padding:3px;\" class=\"border\">\n";
#if there is 0 matches, show 0. otherwise show ($start+1)
if ($config['max'] == "0"){echo "Showing results <b>0 - 0</b> of <b>0</b></td></tr>\n";}
else{echo "Showing results <b>".($config['start']+1)." - $config[max]</b> of <b>".count($imagelist)."</b> entries</td></tr>\n";}
echo "<tr>";
$temp=1;
//for all the images on the page
for($i=$config['start']; $i<$config['max']; $i++){
$thumb_image = $config['thumbs']."/".$imagelist[$i];
$thumb_exists = file_exists($thumb_image);
// create thumb if not exist
if(!$thumb_exists){
set_time_limit(30);
$thumb_exists = ResizeImage("$config[fulls]$imagelist[$i]", $thumb_image, $config['size']);
}
$imagelist[$i] = rawurlencode($imagelist[$i]);
$thumb_image = $config['thumbs']."/".$imagelist[$i];
echo "<td valign=\"bottom\" align=\"center\" class=\"border\" bgcolor=000000><a href=\"$config[fulls]$imagelist[$i]\" title=\"$imagelist[$i]\" target=\"_blank\">";
if ($thumb_exists) {
echo "<img src=\"$thumb_image\" border=\"0\" alt=\"$imagelist[$i]\">";
} else {
echo "$imagelist[$i]";
}
echo "</a></td>\n";
//if the max cols is reached, start new col
if(($temp == $config['cols']) && ($i+1 != $config['max'])){
echo "</tr><tr><td colspan=\"$config[cols]\" class=\"spacer\"> </td></tr><tr>\n";
$temp=0;
}
$temp++;
}//foreach img
//if there are no results
if($config['start'] == $config['max']){
echo "<td align=\"center\" colspan=\"$config[cols]\" class=\"spacer\">No Entries found</td>\n";
}
//if there are empty "boxes" in the row (ie; last page)
elseif($temp != $config['cols']+1){
echo "<td align=\"center\" colspan=\"".($config['cols']-$temp+1)."\"> </td>\n";
}
echo "</tr>";
GetPageNumbers(count($imagelist));
}#-#PrintThumbs()
#-#############################################
# desc: grabs and prints filename
# returns: (bool) worked
function GetEntry(){
global $config;
if(!file_exists("$config[fulls]$_GET[entry]")){
oops("Entry does not exist");
return false;
}
echo "<a href=\"$_SERVER[HTTP_REFERER]\">Back</a><br>";
echo "<img src=\"$config[fulls]$_GET[entry]\">";
}#-#GetEntry()
#-#############################################
# desc: GetFileList
# param: [optional] directory to look through
# returns: array with list of images
function GetFileList($dirname="."){
global $config;
$list = array();
if ($handle = opendir($dirname)) {
while (false !== ($file = readdir($handle))) {
if (preg_match("/\.(jpe?g|gif|png)$/i",$file)) {
$list[] = $file;
}
}
closedir($handle);
}
sort($list);
return $list;
}#-#GetFileList()
#-#############################################
# desc: throw an error message
# param: [optional] any custom error to display
function oops($msg) {
?>
<table align=center>
<tr><td class=header>
Error
</td></tr>
<tr><td class=entry>
<br><?=$msg?>
<br><br>
<hr size=1 noshade width="80%" class=desc>
<center>Please hit the <a href="javaScript:history.back();"><b>back button</b></a> on your browser to try again.</center>
</td></tr></table>
<?php
}#-#oops()
#-#############################################
# desc: chooses method to resize image to correct ratio
# param: ($image) image reference of full size img to use ($newimage) what to save thumbnail as ($size) max width or height to resize to
# returns: (bool) if image was created
function ResizeImage($image, $newimage, $size) {
global $config;
switch ($config['imagemethod']) {
case "imagemagick":
return ResizeImageUsingIM($image, $newimage, $size);
break;
case "gd1":
case "gd2":
return ResizeImageUsingGD($image, $newimage, $size);
break;
default:
return false;
break;
}
}#-#ResizeImage()
#-#############################################
# desc: resizes image if GD was used
# param: ($image) image reference of full size img to use ($newimage) what to save thumbnail as ($size) max width or height to resize to
# returns: (bool) if image was created
function ResizeImageUsingGD($image, $newimage, $size) {
list ($width,$height,$type) = GetImageSize($image);
if($im = ReadImageFromFile($image,$type)){
//if image is smaller than the $size, make it actual $size
if($height < $size && $width < $size){
$newheight=$height;
$newwidth=$width;
}
//if image height is larger, height=$size, then calc width
else if($height > $width){
$newheight=$size;
$newwidth=($width / ($height/$size));//cast the resized width as int
}
//if image width is larger, width=$size, then calc width
else{
$newwidth=$size;
$newheight=($height / ($width/$size));//cast the resized height as int
}
$im2=ImageCreateTrueColor($newwidth,$newheight);
ImageCopyResampled($im2,$im,0,0,0,0,$newwidth,$newheight,$width,$height);
if(WriteImageToFile($im2,$newimage,$type)){
return true;
}
}
return false;
}#-#ResizeImageUsingGD()
#-#############################################
# desc: resizes image using imagemagick
# param: ($image) image reference of full size img to use ($newimage) what to save thumbnail as ($size) max width or height to resize to
# returns: (bool) if image was created
function ResizeImageUsingIM($image, $newimage, $size) {
global $config;
Exec("$config[identify] -ping -format \"%w %h\" \"$image\"", $sizeinfo);
if (! $sizeinfo ) {
return false;
}
$size = explode(" ", $sizeinfo[0]);
$width = $size[0];
$height = $size[1];
if (!$width) {
return false;
}
//if image is smaller than the 160 container, make it actual size
if($height < $size && $width < $size){
$newheight=$height;
$newwidth=$width;
}
//if image height is larger, height=$size, then calc width
else if($height > $width){
$newheight=$size;
$newwidth=($width / ($height/$size));//cast the resized width as int
}
//if image width is larger, width=$size, then calc width
else{
$newwidth=$size;
$newheight=($height / ($width/$size));//cast the resized height as int
}
Exec("$config[convert] -geometry \"$newwidth"."x"."$newheight\" -quality \"$config[imagequality]\" \"$image\" \"$newimage\"");
return file_exists($newimage);
}#-#ResizeImageUsingIM()
#-#############################################
# desc: resizes image using imagemagick
# param: ($filename) filename of image to create ($type) int of type. 1=gif,2=jpeg,3=png
# returns: binary img
function ReadImageFromFile($filename, $type) {
$imagetypes = ImageTypes();
switch ($type) {
case 1 :
if ($imagetypes & IMG_GIF){
return $im = ImageCreateFromGIF($filename);
}
break;
case 2 :
if ($imagetypes & IMG_JPEG){
return ImageCreateFromJPEG($filename);
}
break;
case 3 :
if ($imagetypes & IMG_PNG){
return ImageCreateFromPNG($filename);
}
break;
default:
return 0;
}
}#-#ReadImageFromFile()
#-#############################################
# desc: resizes image using imagemagick
# returns: binary img
function WriteImageToFile($im, $filename, $type) {
global $config;
switch ($type) {
case 1 :
return ImageGIF($im, $filename);
case 2 :
return ImageJpeg($im, $filename, $config['imagequality']);
case 3 :
return ImagePNG($im, $filename);
default:
return false;
}
}#-#WriteImageToFile()
#-#############################################
# sub: GetPageNumbers
# desc: gets the pages in the list
function GetPageNumbers($entries) {
global $config;
$config['totalPages']=Ceil(($entries)/($config['cols']*$config['rows']));
// echo number of pages
echo "<tr><td colspan=$config[cols] align=center height=20 class=border>Page ($config[totalPages]): ";
// echo out PREV
if( ($config['page']-1) >= 0){
echo "<a href=\"$_SERVER[SCRIPT_NAME]?page=".($config['page']-1)."\" class=page><b>«Prev</b></a>";}
// else no link
else{echo "<b>«Prev</b>";}
// for each link, echo out page link
$start=0; // starting image number
$end=$config['totalPages']-1; // ending image number (total / number image on page)
// cutoff size < page. or . page != last page (otherwise keep above values)
if($config['maxShow'] < $config['page'] || (($config['cols']*$config['rows']*$config['maxShow'])< $entries) ){
// if page >= cutoff size+1 -> start at page - cutoff size
if($config['page'] >= ($config['maxShow']+1) && $config['page'] < $end-$config['maxShow']){ $start = $config['page']-$config['maxShow'];}
elseif($end < $config['page']+$config['maxShow']+1 && $config['totalPages']-1 >= $config['maxShow']*2+1){$start = $config['totalPages']-1-$config['maxShow']*2;}
else{$start=0;} // else start at 0
// if page+cutoff+1 > number of pages total -> end= number of pages total
if( $config['page']+$config['maxShow']+1 > $config['totalPages']-1 ){$end = $entries/($config['cols']*$config['rows']);}
#&oops("$end,$config['maxShow']");
elseif($start == 0 && $end > $config['maxShow']*2){$end = $config['maxShow']*2;}
elseif($start == 0 && $config['totalPages'] <= $config['maxShow']*2){$end = $config['totalPages']-1;}
else{$end = ($config['page']+$config['maxShow']);} //end = page+cutoff+1
}
// echo out divide marker
if($start > 0){echo " ... ";}
else{echo " - ";}
// echo out each of the numbers
for($i=$start; $i<=$end ; $i++){
if($config['page']==$i){echo "<b>[".($i+1)."]</b> \n";}
else{echo "<a href=\"$_SERVER[SCRIPT_NAME]?page=$i\" class=page><b>".($i+1)."</b></a> \n";}
}
// echo out divide marker
if(Ceil($end) < $config['totalPages']-1){echo " ... ";}
else{echo " - ";}
// echo out NEXT
if( ($config['page']+1) <= $config['totalPages']-1){
echo "<a href=\"$_SERVER[SCRIPT_NAME]?page=".($config['page']+1)."\" class=page><b>Next»</b></a> ";}
// else no link
else{echo " <b>Next»</b> ";}
echo "</td></tr>";
}#-#end GetPageNumbers()
?>
<!-- END main -->
</td></tr></table>
<?php
$_GET['foo'] = 1;
$_GET['bar'] = 2;
include 'galleries2.php';
$foo = 1;
$bar = 2;
?>
</body>
</html>
here are the values i changed
PHP Code:
// max image width/height
$config['size'] = 300;
// jpeg thumbnail image quality
$config['imagequality'] = 200;
// rows of images per page
$config['rows'] = 5;
// columns of images per page
$config['cols'] = 5;