PDA

View Full Version : Revamping my site


Mike Anime
12-17-2009, 06:46 AM
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





<!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\">&nbsp;</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)."\">&nbsp;</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,$new height,$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>&laquo;Prev</b></a>";}

// else no link

else{echo "<b>&laquo;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&raquo;</b></a> ";}

// else no link

else{echo " <b>Next&raquo;</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







// 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;

ChopSuey
12-18-2009, 12:51 AM
Might want to add to the top
<title>ArcTheLad Gallery</title>

:D

Mike Anime
12-18-2009, 04:41 AM
Might want to add to the top
<title>ArcTheLad Gallery</title>

:D

you gave a good point that will be easy enough to do it will just take a little time.


any other things needing fixing?

Princeton
12-18-2009, 12:26 PM
moved to vB3 General Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=111)

Mike Anime
12-18-2009, 09:35 PM
moved to vB3 General Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=111)

why move it here? this is not vB related.