... and the script ;-)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Photo Album</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
<body>
<%
' This code assumes you are using .jpg images for both the thumbnails and fullsize pictures. If you are
' using .gif then you will have to change it everywhere in the code.
' This also assumes that your thumbnails share the same name as your original with a common ending.
' e.g. Faimily-01.jpg - would be the thumbnail
' Family.jpg - would be the large image
'Declare variables
dim thumbIdentifier 'The unique string that identifies a thumbnail vs. the big image
dim thumbsPerPage 'Number of thumbnails per page
dim thumbsPerRow 'Number of thumbnails per row
dim img 'The image to display (not the thumbnail but the big one)
dim page 'what page you are on
dim first 'first image of the set to display, a set being image 0-49 based upon number per page
dim last 'last image of the set for the array
dim lastDisplay 'last image of the set to display on the 'Images 20 - 40'
dim thisPageURL 'This is the name of this page eg. album.asp. If you re-name it links in page will update
thumbsPerPage = 200 ' Number of thumbnails to display on the page
thumbIdentifier = "-01.jpg" ' This is the common string ending for all thumbnail images.
thumbsPerRow = 3 ' Number of thumbnails to display per row - surprised?
thisPageURL = Request.ServerVariables("SCRIPT_NAME") 'This gets the name of this page eg. album.asp
page = request.queryString("page") 'This is the page you are on, used for paging
if page = "" then page = 1 'If no page # exists, set to 1
img = Request.querystring("img") 'Large image to display if they clicked a thumbnail
if img = "" then 'If there is no image on URL, show the thumbnail page
' Determine which image to start / end at based upon paging and thumbsPerPage
first = ((page-1) * thumbsPerPage)
last = (page * thumbsPerPage)-1 'We do minus 1 here since we are using an array... array starts at 0 vs 1
' get the current folder location
strPathInfo = Request.ServerVariables("SCRIPT_NAME")
strPhysicalPath = Server.MapPath(strPathInfo)
set objFSO = CreateObject("Scripting.FileSystemObject")
set objFile = objFSO.GetFile(strPhysicalPath)
set objFolder = objFile.ParentFolder
set objFolderContents = objFolder.Files
' Count total number of thumbnails
totalImages = 0
For each objFileItem In objFolderContents
if inStr(LCase(objFileItem.Name),thumbIdentifier) then
totalImages = totalImages + 1
end if
next
'Limit last to totalImages so array does not go out of range.
if last > totalImages then last = totalImages
'Array starts at 0 vs. 1 so we need to offset this by 1 exception last image can'be be > than total # of images
lastDisplay = last + 1
if lastDisplay > totalImages then lastDisplay = totalImages
' Create an array to put all the images in so that we can do paging
dim arrayOfThumbs()
ReDim arrayOfThumbs(totalImages)
dim i
i = 0
' Populate the array with the images
For each objFileItem In objFolderContents
' only display the thumbnails - the images that have the ending defined in the thumbIdentifier variable at top of page
if inStr(LCase(objFileItem.Name),thumbIdentifier) then
'Isolate the image name so that we can create a link to the large version. This strips off the ending e.g. -01.jpg
image = split(objFileItem.Name, thumbIdentifier)
' Populate array
arrayOfThumbs(i)= "<td nowrap valign='bottom' align='left'><a href='default.asp?img=" & image(0) & ".jpg'>" & vbCrLf & _
"<img src='" & objFileItem.Name & "' hspace='2' border='0'></a><br><input type='checkbox' name='"&image(0) &"' id='"&image(0) &"' value='checkbox'>"&image(0) &"</td><td width='20'></td>" & vbCrLf
i = i + 1
end if
next
' Create page links if more than 1 page is needed
dim paging
if (thumbsPerPage < totalImages) then
' Assing all the page numbers to the paging string because we are going to use on top and bottom of page
paging = "Page: <b>"
k = 1
Do
paging = paging + "<a href='" & thisPageURL & "?page=" & k & "'>" & k & "</a>" & vbCrLf
k = k + 1
loop until (k * thumbsPerPage) >= totalImages
paging = paging + "<a href='" & thisPageURL & "?page=" & k & "'>" & k & "</a></b>" 'One more becase the logic cuts the last one off
end if
%>
<!-- This is where the HTML of the page starts :::: Page Title -->
<table align="center">
<tr>
<%
' Loop through the array and display images
for j = first to last
response.write(arrayOfThumbs(j))
if (j+1) Mod thumbsPerRow = 0 then response.Write(vbCrLf & "</tr><tr>" & vbCrLf) 'Create a new row based on thumbsPer row
next
%>
</tr>
</table>
<!-- Write the paging piece at the bottom
<p align="center">
<%=paging%> Images <%=first+1%> - <%=lastDisplay%> of <%=totalImages%>
</p> -->
<%
'Display the big image Page
else
%>
<!-- Else show the selected picture. You can put a title below here for the picture page or any other HTML -->
<p align='center'>
<a href='java script:history.back()'>
<img src=' <%=img%> ' align='center' border=1></a><br><br>
<a href='java script:history.back()'><< Back</a>
</p>
<% end if %>
</body>
</html>
