PDA

View Full Version : URGENT - Photo Album Viewer Script Not Working



vlane95678
08-30-2006, 03:05 PM
1) Script Title: PHP Photo Album Script

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/indexb.html

3) Describe problem:

Hi world!

I am using the PHP Photo Album Script found on this site - DynamicDrive. This script allows the php to grab files in a particular folder and display them on the screen. Now here's the problem . . . it says that it will display the images by FILE NAME and also has the feature to display by DATE. I followed the instructions to display by FILE NAME, but it is not working. It keeps displaying the images by the date not the file name. I NEED IT BY FILE NAME!!

Can anyone debug this thing? Here's the script:

HTML:
<HEAD>
<style type="text/css">

.slideshow{ /*CSS for DIV containing each image*/
float: left;
margin-right: 11px;
margin-bottom: 10px;
}

.slideshow img{ /*CSS for each image tag*/
border: 0;
width: 135x;
height: 88px;
}

#navlinks{ /*CSS for DIV containing the navigational links*/
width: 400px;
}

#navlinks a{ /*CSS for each navigational link*/
margin-right: 0px;
margin-bottom: 05px;
font-size: 100%;
}

#navlinks a.current{ /*CSS for currently selected navigational link*/
background-color: #C6E959;
}
</style>
</HEAD>
-------------------------------------------------------------------
---------------------------------------------------------------------

<BODY>
<script type="text/javascript">

/***********************************************
* PHP Photo Album script- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/

var dimension="4x5" //Specify dimension of gallery (number of images shown), such as 4x2, 3x1 etc
var imagepath="http://www.clientcardz.com/Layouts_Small/" //Absolute path to image directory. Include trailing slash (/)
var href_target="new" //Enter target attribute of links, if applicable

//Toggle popup link setting: popupsetting[0 or 1, "pop up window attributes" (if 1)]
var popupsetting=[1, "width=440px, height=275px, scrollbars, resizable"]

//Toggle image description: descriptionprefix[0 or 1, "Text to show" (if 1)]
var descriptionprefix=[1, "Layouts-"]

//Sort images by date? ("asc", "desc", or "")
//"desc" for example causes the newest images to show up first in the gallery
//"" disables this feature, so images are sorted by file name (default)
var gsortorder=""

//By default, each image hyperlinks to itself.
//However, if you wish them to link to larger versions of themselves
//Specify the directory in which the larger images are located
//The file names of these large images should mirror those of the original
//Enter a blank string ("") to disable this option
var targetlinkdir="http://www.clientcardz.com/Layouts_Large/"

/////No need to edit beyond here///////////////////

function sortbydate(a, b){ //Sort images function
if (gsortorder=="") //sort by file date: older to newer
return new Date(a[1])-new Date(b[1])
else if (gsortorder=="") //sort by file date: newer to older
return new Date(b[1])-new Date(a[1])
}

if (gsortorder=="" || gsortorder=="")
galleryarray.sort(sortbydate)

var totalslots=dimension.split("x")[0]*dimension.split("x")[1]

function buildimage(i){
var imagecompletepath=(targetlinkdir!="")? targetlinkdir+galleryarray[i][0] : imagepath+galleryarray[i][0]
var tempcontainer='<a href="'+imagecompletepath+'" target="'+href_target+'" onClick="return popuplinkfunc(this)">'
tempcontainer+='<img src="'+imagepath+galleryarray[i][0]+'" title="'+galleryarray[i][0]+' ['+galleryarray[i][1]+']" />'
tempcontainer+='</a><br />'
tempcontainer+=(descriptionprefix[0]==1)? descriptionprefix[1]+(i+1) : ""
return tempcontainer
}

function jumptopage(p){
var startpoint=(p-1)*totalslots
var y=1;
for (i=0; i<totalslots; i++){
document.getElementById("slide"+i).innerHTML=(typeof galleryarray[startpoint+i]!="undefined")? buildimage(startpoint+i) : ""
}
while(document.getElementById("navlink"+y)!=null){
document.getElementById("navlink"+y).className=""
y++
}
document.getElementById("navlink"+p).className="current"
}

var curimage=0
for (y=0; y<dimension.split("x")[1]; y++){
for (x=0; x<dimension.split("x")[0]; x++){
if (curimage<galleryarray.length)
document.write('<div id="slide'+curimage+'" class="slideshow">'+buildimage(curimage)+'</div>')
curimage++
}
document.write('<br style="clear: left" />')
}

function popuplinkfunc(imgsrc){
if (popupsetting[0]==1){
var popwin=open(imgsrc.href, "popwin", popupsetting[1])
popwin.focus()
return false
}
else
return true
}

</script>

<!--Below HTML code refers to the navigational links for the gallery-->

</font>

<div id="navlinks">
<font face="Arial" size="2" color="#354600">
<script type="text/javascript">
for (i=1; i<Math.ceil(galleryarray.length/totalslots)+1; i++)
document.write('<a id="navlink'+i+'" href="javascript:jumptopage('+i+')\"><img border="0" src="http://www.clientcardz.com/Lanitech_Artwork/graphic_arrow_blue.gif" width="11" height="11">Page '+i+' </a> ')
document.getElementById("navlink1").className="current"
</script>
</BODY>
----------------------------------------------------------------------
---------------------------------------------------------------------

PHP SCRIPT:

<?
Header("content-type: application/x-javascript");

function returnimages($dirname=".") {
$pattern="\.(jpg|jpeg|png|gif|bmp)$";
$files = array();
$curimage=0;
if($handle = opendir($dirname)) {
while(false !== ($file = readdir($handle))){
if(eregi($pattern, $file)){
$filedate=date ("M d, Y H:i:s", filemtime($file));
echo 'galleryarray[' . $curimage .']=["' . $file . '", "'.$filedate.'"];' . "\n";
$curimage++;
}
}

closedir($handle);
}
return($files);
}

echo "var galleryarray=new Array();" . "\n";
returnimages();
?>
-----------------------------------------------------------------------
----------------------------------------------------------------------
You can see it in action here. IMPORTANT - go to Page 3 and mouseover/right click properties of the last few images. You'll see that the label doesn't match the file name:

http://www.clientcardz.com/layouts.htm


HELP PLEASE!!! SOMEONE!! I've already posted this problem on another forum with no responses that worked.

ddadmin
08-30-2006, 06:31 PM
Please don't cross post the same question in multiple categories (one in "JavaScript" has been deleted).

It seems to be working correctly for me. Note that the script sorts alphabetically, which means something like 11 would proceed 2.

vlane95678
08-30-2006, 10:15 PM
Here is an example page of the script not working. The files names are letters only (i.e,. 'a', 'c') and the image itself display the letter of the file name.

It is clearly out of aphabetical order:

http://www.clientcardz.com/new/new.html

"Z" should not be the first image if it is sorting alphbetically.

Please help!

vlane95678
08-30-2006, 11:12 PM
I looked through other people's post on this script and all the problems they were having with it as well.

I've decided to ditch fixing this problem and coming up with another solution. I am now using the file name in place of the visible text description below th e image. That's the only way around this problem.

Thank you to those who responded.

ddadmin
08-31-2006, 01:03 AM
Ok, the problem then must be the way your server lists files within a directory. The PHP Photo album assumes that it's by file name, and doesn't attempt to do any type of sorting in that case. If your server somehow lists files in a different manner, the returned images will not be in alphabetical order.

Try modifying the code:


if (gsortorder=="asc" || gsortorder=="desc")
galleryarray.sort(sortbydate)

inside the JavaScript code (code of Step 3) to:


if (gsortorder=="asc" || gsortorder=="desc")
galleryarray.sort(sortbydate)
else
galleryarray.sort()