Php Photo Album Sort question

**web_boy_** · 02-24-2012, 02:57 PM

1) Script Title: PHP Photo Album script v2.11

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...photoalbum.htm

3) Describe problem:

I installed the script list it states with the following being set:

new phpimagealbum({
albumvar: myvacation, //ID of photo album to display (based on getpics.php?id=xxx)
dimensions: [4,6],
sortby: ["file", "asc"], //["file" or "date", "asc" or "desc"]
autodesc: "Photo %i", //Auto add a description beneath each picture? (use keyword %i for image position, %d for image date)
showsourceorder: true, //Show source order of each picture? (helpful during set up stage)
onphotoclick:function(thumbref, thumbindex, thumbfilename){
thumbnailviewer.loadimage(thumbref.src, "fit2screen")

In my directory I have the following image names:
1.jpg, 2.jpg,3.jpg, 9.jpg,10.jpg,11.jpg,20.jpg,21.jpg

When I look at the page it does not display in that order it displays 1.jpg,10.jpg,11.jpg,2.jpg,20.jpg.21.jpg3.jpg,9.jpg

How do I get it to display in the sequential order?

Thanks in advance for your help...
Khris

**jscheuer1** · 02-24-2012, 03:19 PM

That's actually a correct sort of those files alphabetically. Obviously not numerically. You could rename the single digit files:

01.jpg, 02.jpg,03.jpg, 09.jpg,10.jpg,11.jpg,20.jpg,21.jpg

And if you have a 100.jpg, use two zeros for the single digit and one zero for the two digit files. Hopefully you don't have a 1000.jpg. But I think you can see how that would affect the number of zeros needed for each of the other filenames.

Or using a text only editor like NotePad you could edit the ddphpalbum.js file replacing:

Code:

	if (setting.sortby[0]=="file") //sort by filename (asc)
		this.albumvar.images.sort(function(a,b){return a[1].localeCompare(b[1])})
	else //sort by date (asc)
		this.albumvar.images.sort(function(a,b){return new Date(a[2])-new Date(b[2])})
	if (setting.sortby[1]=="desc"){
		this.albumvar.images.reverse()
	}

with:

Code:

	if (setting.sortby[0]=="numeric") //sort numerically by filename (asc)
		this.albumvar.images.sort(function(a,b){return +(a[1]).replace(/\D/g, '') - +(b[1]).replace(/\D/g, '');})
	else if (setting.sortby[0]=="file") //sort by filename (asc)
		this.albumvar.images.sort(function(a,b){return a[1].localeCompare(b[1])})
	else //sort by date (asc)
		this.albumvar.images.sort(function(a,b){return new Date(a[2])-new Date(b[2])})
	if (setting.sortby[1]=="desc"){
		this.albumvar.images.reverse()
	}

Then you could put here:

Code:

new phpimagealbum({
 albumvar: myvacation, //ID of photo album to display (based on getpics.php?id=xxx)
 dimensions: [4,6],
 sortby: ["numeric", "asc"], //["file" or "date", "asc" or "desc"]
 autodesc: "Photo %i", //Auto add a d . . .

**Savladai** · 04-17-2012, 10:38 PM

Originally Posted by jscheuer1

Or using a text only editor like NotePad you could edit the ddphpalbum.js file replacing:

Code:

	if (setting.sortby[0]=="file") //sort by filename (asc)
		this.albumvar.images.sort(function(a,b){return a[1].localeCompare(b[1])})
	else //sort by date (asc)
		this.albumvar.images.sort(function(a,b){return new Date(a[2])-new Date(b[2])})
	if (setting.sortby[1]=="desc"){
		this.albumvar.images.reverse()
	}

with:

Code:

	if (setting.sortby[0]=="numeric") //sort numerically by filename (asc)
		this.albumvar.images.sort(function(a,b){return +(a[1]).replace(/\D/g, '') - +(b[1]).replace(/\D/g, '');})
	else if (setting.sortby[0]=="file") //sort by filename (asc)
		this.albumvar.images.sort(function(a,b){return a[1].localeCompare(b[1])})
	else //sort by date (asc)
		this.albumvar.images.sort(function(a,b){return new Date(a[2])-new Date(b[2])})
	if (setting.sortby[1]=="desc"){
		this.albumvar.images.reverse()
	}

Then you could put here:

Code:

new phpimagealbum({
 albumvar: myvacation, //ID of photo album to display (based on getpics.php?id=xxx)
 dimensions: [4,6],
 sortby: ["numeric", "asc"], //["file" or "date", "asc" or "desc"]
 autodesc: "Photo %i", //Auto add a d . . .

Thanks for these code snippets jscheuer1 but I can't get them to work. I have named my pics 01.jpg, 02.jpg up to 15.jpg but the showsourceorder numbers are coming out 0, 2, 8, 9, 7 - in other words, all jumbled up, so that the manual captions are all wrong. The *thumbnails* appear in the correct order, it's just the showsourceorder numbers and captions which are mixed up.

Why would this happen? I do realize I could go in, figure out what order the showsourceorder is putting up and label the manual captions accordingly but this makes no sense to me. What info is showsourceorder using to determine the sequence and is there any way to override it, given that I've already implemented your above code changes? I'm working on a template page which will be used to build about 40 others so I really don't want to have to figure out showsourceorder's logic for each page! :>)

**jscheuer1** · 04-18-2012, 01:45 PM

Originally Posted by Savladai

Thanks for these code snippets jscheuer1 but I can't get them to work. I have named my pics 01.jpg, 02.jpg up to 15.jpg but the showsourceorder numbers are coming out 0, 2, 8, 9, 7 - in other words, all jumbled up, so that the manual captions are all wrong. The *thumbnails* appear in the correct order, it's just the showsourceorder numbers and captions which are mixed up.

Why would this happen? I do realize I could go in, figure out what order the showsourceorder is putting up and label the manual captions accordingly but this makes no sense to me. What info is showsourceorder using to determine the sequence and is there any way to override it, given that I've already implemented your above code changes? I'm working on a template page which will be used to build about 40 others so I really don't want to have to figure out showsourceorder's logic for each page! :>)

In my opinion the way the script was written makes things confused in some cases as regards the sort order and descriptions. For more information and a fix, see:

http://www.dynamicdrive.com/forums/s...ad.php?t=62439

If you are less interested in the discussion and more interested in the solution skip to near the bottom of post #3 in that thread, starting at the heading:

Added Later:

If you have more questions about it though, please respond in this thread.

**Savladai** · 04-18-2012, 03:43 PM

Thanks so much, John. I did read the entire thread and found it quite interesting and logical.

However, while waiting for a response to this thread, I poked around this site (great resource - thanks so much to the people who maintain it!) and found a different solution which doesn't use php but does have a feature I like - it includes a "caption" under the large version of the photo. It's called Image Thumbnail Viewer. If you know of that script, do you think it would be possible to incorporate its ability to display a full description (ie 7 or 8 words instead of just 1 or 2) under the large photo into this php version?

I'm really torn between the two scripts, because with PHP Photo Album, I only need to build one file per image (the large one) whereas with the other one I need to build 2 (large and thumbnail), so it would be really nice to add the descriptive line to the PHP Photo Album version but I know NOTHING about working with .js files. I've only just (since January) learned to work with php/mysql so my brain is feeling a bit overloaded to start with. :>)

If I must choose, I'll go with the Image Thumbnail Viewer because Photoshop can make my thumbnails pretty quickly and I do want to be able to include longer descriptions of the photos but it sure would be nice to cut down the site size, considering I have about 40 dogs with 10 to 15 pictures of each. Also, at some point in time I may want to tackle including the photos in a mysql database, although I don't feel up to that at this point.