Log in

View Full Version : Resolved PHP Photo Album


villian999
01-23-2009, 05:21 AM
1) Script Title: PHP Photo Album

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

3) Describe problem: I have a website setup, I'm currently hosting it on my PC for development purposes. When trying to get the PHP Photo Album to work, the section that is supposed to show the photo gallery is blank. The text before the gallery shows.. but the actual images never load.

The page is setup in PHP, after the PHP is parsed... the HTML source code is as follows:



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Kik3n Art</title>
<link rel="stylesheet" type="text/css" href="scripts/styling.css"></link>
<link rel="stylesheet" type="text/css" href="scripts/layout.css"></link>
<link rel="stylesheet" type="text/css" href="scripts/css/lightbox.css" media="screen"></link>
<script type="text/javascript" src="stephysite.js"></script>
<script type="text/javascript" src="scripts/functions.js"></script>

<style type="text/css">

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

.slideshow img{ /*CSS for each image tag*/
border: 0;
width: 200px;
height: 106px;
}

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

#navlinks a{ /*CSS for each navigational link*/
margin-right: 8px;
margin-bottom: 3px;
font-size: 110%;
}

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

<div id="divTitle" align="center">Kik3n Art - Paintings</div>
<script language="javascript">
varTitle = xGetElementById('divTitle').innerHTML;
document.title = varTitle;
</script>
<div id="divcenter">
<img src="images/background1.jpg" class="bkgrnd" alt="" />
<div id="colLeft">
<div id="Menu">
<div id="divLogo" align="right">
<img id="logo" alt="Kik3n Art Logo" src="images/kalogo.gif" />

</div>
<table id="themenu" align="center" summary="">
<tr><td><a href="index.php" target="_self">[ Home ]</a></td></tr>
<tr><td><a href="aboutme.php">[ About Me ]</a></td></tr>
<tr><td><a href="gallery.php?gal=paintings">[ Paintings ]</a></td></tr>
<tr><td><a href="gallery.php?gal=photo">[ Photography ]</a></td></tr>
<tr><td><a href="gallery.php?gal=sketches">[ Sketches ]</a></td></tr>

<tr><td><a href="requests.php">[ Requests ]</a></td></tr>
<tr><td><a href="/forum/">[ Forum ]</a></td></tr>
<tr><td><a href="links.php">[ Links ]</a></td></tr>
<tr><td><a href="contactme.php">[ Contact Me ]</a></td></tr>
</table>
</div>
</div>

<div id="colRight">
<div id="rightContent"><div id="theGallery">
<div id="galText">
<p>This is my gallery. All of my current artwork is posted here. Just click on the thumbnail to view the entire piece, and if you'd like to purchase just click on buy! Enjoy.</p>
</div>

<div id="theGal">
<div id="galCont">
<script src="http://127.0.0.1/kik3nart/phpver/images/paintings/thumbs/getpics.php" type="text/javascript"></script>

<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 galleryarray=new Array();
var dimension="3x2" //Specify dimension of gallery (number of images shown), such as 4x2, 3x1 etc
var imagepath="http://127.0.0.1/kik3nart/phpver/images/paintings/thumbs/" //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=500px, height=400px, scrollbars, resizable"]

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

//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="desc"

//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://127.0.0.1/kik3nart/phpver/images/paintings/"

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

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

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

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

function buildimage(i){
var imagecompletepath=(targetlinkdir!="")? targetlinkdir+'TN'+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-->

<div id="navlinks">
<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+')\">Page'+i+'</a> ')
document.getElementById("navlink1").className="current"
</script>
</div>
</div></div>
</div>

</div></div></div>
<div id="footer" align="center">Copyright &copy; 2008 <a href="index.html" target="_self">Kik3n.</a> No content may be used without permission from the creators.</div>

</body>
</html>


The error console in FireFox shows:

Error: invalid XML markup
Source File: http://127.0.0.1/kik3nart/phpver/images/paintings/thumbs/getpics.php
Line: 2
Source Code:
<?
and
Error: document.getElementById("navlink1") is null
Source File: http://127.0.0.1/kik3nart/phpver/gallery.php?gal=paintings
Line: 178
jscheuer1
01-23-2009, 06:07 AM
I'd really need to be able to see the page. Although the link to it is in the error message, at the moment I'm getting a "Could not connect to remote server" error when I click on it.

The first error is probably due to your host rejecting the shorthand <? at the top of the getpics.php file. If that's the problem, changing it to:

<?php

will fix at least that much. That might not actually be the problem though it probably is, and even if it is, there could be other issues between your server's PHP interpreter and the getpics.php file.

By way of explanation, some PHP servers are simply configured differently than the vast majority for which this code was written.

Once all of the problems with that file are resolved, the other problem may go away, but if it doesn't we will be better able to identify why it is happening and to fix it.
villian999
01-23-2009, 02:59 PM
The reason you cant get to it is because 127.0.0.1 is the loopback IP... meaning when you click it, it tries to access the file from your computer. I dont have it setup so anyone outside my LAN can access it. I can change that temporarily if need be.

You are correct, I knew that <?php would resolve the issue with the first error message, but I changed it back to <? just because it is what is on the original script. I have shorthand php tags disabled in my php.ini. I have changed the <? back to <?php

OMG I feel stupid now.. The getpics.php has a line that says
echo "var galleryarray=new Array();" . "\n"; . When originally parsed, it simply printed that line ON my page instead of incorporating it into the source code. I had added that line to the body of the page at the start of the javascript so it would be included as an actual variable. After changing the <? back to <?php I tried removing it from the body and putting it back in the getpics.php... and it worked... grr.

Thanks for your help!
jscheuer1
01-23-2009, 04:15 PM
As long as it's working for you, I no longer need to see the page.