which is this:
http://img264.imageshack.us/i/picpicy.jpg/
heres a live test of it:
http://mtfl.freehostia.com/sample7_1.php
problem is when i upload a pic it doesn't upload. here are the php files:
sample7_1.php
<!-- sample7_1.php -->
<!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">
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<title>Sample 7_1</title>
<script type="text/javascript" src="functions.js"></script>
</head>
<body>
<h1>My Gallery</h1>
<div id="maindiv">
<!-- Big Image -->
<div id="middiv">
<?php require_once ("midpic.php"); ?>
</div>
<!-- Messages -->
<div id="errordiv"></div>
<!-- Image navigation -->
<div id="picdiv"><?php require_once ("picnav.php"); ?></div>
</div>
<h2>Add An Image</h2>
<form action="process_upload.php" method="post" target="uploadframe"
enctype="multipart/form-data" onsubmit="uploadimg(this); return false">
<input type="file" id="myfile" name="myfile" />
<input type="submit" value="Submit" />
<iframe id="uploadframe" name="uploadframe" src="process_upload.php">
</iframe>
</form>
</body>
</html>
functions.js
// functions.js
function runajax(objID, serverPage)
{
//Create a boolean variable to check for a valid Internet Explorer instance.
var xmlhttp = false;
//Check if we are using IE.
try {
//If the JavaScript version is greater than 5.
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
//If not, then use the older ActiveX object.
try {
//If we are using Internet Explorer.
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
//Else we must be using a non-IE browser.
xmlhttp = false;
}
}
// If we are not using IE, create a JavaScript instance of the object.
if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
xmlhttp = new XMLHttpRequest();
}
var obj = document.getElementById(objID);
xmlhttp.open("GET", serverPage);
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
obj.innerHTML = xmlhttp.responseText;
}
}
xmlhttp.send(null);
}
// Delay in milliseconds before refreshing gallery.
var refreshrate = 1000;
//Function to show a loading message.
function updateStatus()
{
document.getElementById("errordiv").innerHTML = "";
document.getElementById("middiv").innerHTML = "<b>Loading...</b>";
}
function refreshView()
{
// Reload the full-size image.
setTimeout ('runajax ("middiv","midpic.php")',refreshrate);
// Reload the navigation.
setTimeout ('runajax ("picdiv","picnav.php")',refreshrate);
}
function uploadimg(theform)
{
// Update user status message.
updateStatus();
// Now submit the form.
theform.submit();
// And finally update the display.
refreshView();
}
function removeimg(theimg)
{
runajax("errordiv", "delpic.php?pic=" + theimg);
refreshView();
}
function imageClick(img)
{
updateStatus();
runajax('middiv', 'midpic.php?curimage=' + img);
runajax('picdiv', 'picnav.php?curimage=' + img);
}
config.php
<?php
//config.php
// Max dimensions of generated images.
$GLOBALS['maxwidth'] = 500;
$GLOBALS['maxheight'] = 200;
// Max dimensions of generated thumbnails.
$GLOBALS['maxwidththumb'] = 60;
$GLOBALS['maxheightthumb'] = 60;
// Where to store the images and thumbnails.
$GLOBALS['imagesfolder'] = "images";
$GLOBALS['thumbsfolder'] = "images/thumbs";
// Allowed file types and mime types
$GLOBALS['allowedmimetypes'] = array('image/jpeg',
'image/pjpeg',
'image/png',
'image/gif');
$GLOBALS['allowedfiletypes'] = array(
'jpg' => array('load' => 'ImageCreateFromJpeg',
'save' => 'ImageJpeg'),
'jpeg' => array('load' => 'ImageCreateFromJpeg',
'save' => 'ImageJpeg'),
'gif' => array('load' => 'ImageCreateFromGif',
'save' => 'ImageGif'),
'png' => array('load' => 'ImageCreateFromPng',
'save' => 'ImagePng')
);
// Number of images per row in the navigation.
$GLOBALS['maxperrow'] = 7;
?>
functions.php
<?php
// functions.php
// A function to create an array of all the images in the folder.
function getImages()
{
$images = array();
if (is_dir($GLOBALS['imagesfolder'])) {
$files = scandir ($GLOBALS['imagesfolder']);
foreach ($files as $file) {
$path = $GLOBALS['imagesfolder'] . '/' . $file;
if (is_file($path)) {
$pathinfo = pathinfo($path);
if (array_key_exists($pathinfo['extension'],
$GLOBALS['allowedfiletypes']))
$images[] = $file;
}
}
}
return $images;
}
// Calculate the new dimensions based on maximum allowed dimensions.
function calculateDimensions($width, $height, $maxWidth, $maxHeight)
{
$ret = array('w' => $width, 'h' => $height);
$ratio = $width / $height;
if ($width > $maxWidth || $height > $maxHeight) {
$ret['w'] = $maxWidth;
$ret['h'] = $ret['w'] / $ratio;
if ($ret['h'] > $maxHeight) {
$ret['h'] = $maxHeight;
$ret['w'] = $ret['h'] * $ratio;
}
}
return $ret;
}
// A function to change the size of an image.
function createThumb($img, $maxWidth, $maxHeight, $ext = '')
{
$path = $GLOBALS['imagesfolder'] . '/' . basename($img);
if (!file_exists($path) || !is_file($path))
return;
$pathinfo = pathinfo($path);
$extension = $pathinfo['extension'];
if (!array_key_exists($extension, $GLOBALS['allowedfiletypes']))
return;
$cursize = getImageSize($path);
$newsize = calculateDimensions($cursize[0], $cursize[1],
$maxWidth, $maxHeight);
$newfile = preg_replace('/(\.' . preg_quote($extension, '/') . ')$/',
$ext . '\\1', $img);
$newpath = $GLOBALS['thumbsfolder'] . '/' . $newfile;
$loadfunc = $GLOBALS['allowedfiletypes'][$extension]['load'];
$savefunc = $GLOBALS['allowedfiletypes'][$extension]['save'];
$srcimage = $loadfunc($path);
$dstimage = ImageCreateTrueColor($newsize['w'], $newsize['h']);
ImageCopyResampled($dstimage, $srcimage,
0, 0, 0, 0,
$newsize['w'], $newsize['h'],
$cursize[0], $cursize[1]);
$savefunc($dstimage, $newpath);
return $newpath;
}
?>
process_upload.php
<?php
require_once ("config.php");
require_once ("functions.php");
// Check for a valid file upload.
if (!isset($_FILES['myfile']) || $_FILES['myfile']['error'] != UPLOAD_ERR_OK)
exit;
// Check for a valid file type.
if (in_array($_FILES['myfile']['type'], $GLOBALS['allowedmimetypes'])){
// Finally, copy the file to our destination directory.
$dstPath = $GLOBALS['imagesfolder'] . '/' . $_FILES['myfile']['name'];
move_uploaded_file($_FILES['myfile']['tmp_name'], $dstPath);
}
?>
midpic.php
<?php
//midpic.php
require_once ("config.php");
require_once ("functions.php");
$imgarr = getImages();
// If our gallery contains images, show either the selected
// image, or if there are none selected, then show the first one.
if (count($imgarr) > 0) {
$curimage = $_GET['curimage'];
if (!in_array($curimage, $imgarr))
$curimage = $imgarr[0];
// Create a smaller version in case of huge uploads.
$thumb = createthumb($curimage,
$GLOBALS['maxwidth'],
$GLOBALS['maxheight'],
'_big');
if (file_exists($thumb) && is_file($thumb)) {
?>
<div id="imagecontainer">
<img src="<?= $thumb ?>" alt="" />
</div>
<div id="imageoptions">
<a href="delpic.php?pic=<?= $curimage ?>"
onclick="removeimg ('<?= $curimage ?>'); return false">
<img src="delete.png" alt="Delete image" />
</a>
</div>
<?php
}
}
else
echo "Gallery is empty.";
?>
picnav.php
<?php
//picnav.php
require_once ("config.php");
require_once ("functions.php");
//Find a total amount of images.
$imgarr = getImages();
$numimages = count($imgarr);
//If there is more than one image.
if ($numimages > 0) {
$curimage = $_GET['curimage'];
if (!in_array($curimage, $imgarr))
$curimage = $imgarr[0];
$selectedidx = array_search($curimage, $imgarr);
?>
<table id="navtable">
<tr>
<?php
$numtoshow = min($numimages, $GLOBALS['maxperrow']);
$firstidx = max(0, $selectedidx - floor($numtoshow / 2));
if ($firstidx + $numtoshow > $numimages)
$firstidx = $numimages - $numtoshow;
for ($i = $firstidx; $i < $numtoshow + $firstidx; $i++) {
$file = $imgarr[$i];
$selected = $selectedidx == $i;
$thumb = createthumb($file,
$GLOBALS['maxwidththumb'],
$GLOBALS['maxheightthumb'],
'_th');
if (!file_exists($thumb) || !is_file($thumb))
continue;
?>
<td<?php if ($selected) { ?> class="selected"<?php } ?>>
<a href="sample7_1.php?curimage=<?= $file ?>"
onclick="imageClick('<?= $file ?>'); return false">
<img src="<?= $thumb ?>" alt="" />
</a>
</td>
<?php
}
?>
</tr>
</table>
<?php
}
?>
sorry for the long code :queasy:, lol. anyway, id appreciate the help.