Scripts
Dynamic Multiple File Upload
Dit script genereert een formulier waaraan je inputs type file kunt toevoegen en/of verwijderen. Op deze manier kun je 1 of meer bestanden uploaden naar je server. Er zit geen check op MIMETYPES op, maar die kun je gemakkelijk zelf inbouwen. Update1: is inmiddels ingebouwd Update2: check op MIMETYPES blijkt niet veilig. Gebeurt nu met exif_imagetype. Toegevoegd: check op filesize en een resize functie voor te grote plaatjes. Het script maakt gebruik van de mootools library, te downloaden op www.mootools.net Enjoy! groeten, Jan
dynamic-multiple-file-upload
[code]<?php
ini_set ('display_errors', 1);
error_reporting (E_ALL);
$title = 'Dynamic Multiple File Uploads';
$msgs = array ();
$errs = array ();
/*
Constanten voor exif_imagetype ()
1 IMAGETYPE_GIF
2 IMAGETYPE_JPEG
3 IMAGETYPE_PNG
*/
$allowed = array (IMAGETYPE_JPEG);
function resize ($path, $dst_w) {
list ($src_w, $src_h) = getimagesize ($path);
if ($dst_w < $src_w) {
$ratio = $dst_w / $src_w;
$dst_h = ceil ($ratio * $src_h);
$src = imagecreatefromjpeg ($path);
$dst = imagecreatetruecolor ($dst_w, $dst_h);
imagecopyresampled ($dst, $src, 0, 0, 0, 0, $dst_w, $dst_h, $src_w, $src_h);
imagejpeg ($dst, $path, 80);
imagedestroy ($src);
imagedestroy ($dst);
}
}
// business logic
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$n = count ($_FILES['userfile']['error']);
for ($i = 0; $i < $n; $i++) {
if (!$_FILES['userfile']['error'][$i]) {
$tmp = $_FILES['userfile']['tmp_name'][$i];
$name = $_FILES['userfile']['name'][$i];
$dir = 'images/';
if (!in_array (exif_imagetype ($tmp), $allowed)) {
array_push ($errs, 'Sorry, alleen JPG');
}
elseif ($_FILES['userfile']['size'][$i] > 50000) {
array_push ($errs, 'Sorry, 50 KB max');
}
elseif (file_exists ($dir . $name)) {
array_push ($errs, $name . ' bestaat al!');
}
else {
$path = $_SERVER['DOCUMENT_ROOT'] . '/' . $dir . $name;
if (is_uploaded_file ($tmp)) {
if (move_uploaded_file ($tmp, $path)) {
chmod ($path, 0644);
resize ($path, 568);
array_push ($msgs, 'Geupload: ' . $name);
array_push ($msgs, '<img style="border: 1px solid #000; " src="' . $dir . $name . '">');
}
}
}
}
}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jan Koehoorn | <?php echo $title; ?></title>
<link rel="stylesheet" type="text/css" media="screen" href="reset.css" />
<link rel="stylesheet" type="text/css" media="screen" href="oop.css" />
<style type="text/css">
form {padding: 10px;}
ul.msgs {margin: 10px; padding: 10px; border: 2px solid #00f; background: #99f;}
ul.errs {margin: 10px; padding: 10px; border: 2px solid #f00; background: #f99;}
ul.msgs li,
ul.errs li {color: #000;}
</style>
<script type="text/javascript" src="mootools/mootools.js"></script>
<script type="text/javascript">
window.addEvent ('domready', function () {
$$('a.add').each (function (item) {
item.addEvent ('click', function (e) {
e = new Event (e).preventDefault ();
var p = item.getParent ();
var clone = p.clone().injectBefore(p);
var a = clone.getLast ();
a.remove ();
var remove = document.createElement ('a');
remove.innerHTML = 'verwijderen';
remove.href = '#';
remove.addEvent ('click', function (e) {
e = new Event (e).preventDefault ();
this.getParent ().remove ();
});
clone.appendChild (remove);
var f = p.getFirst ();
f.value = '';
});
});
});
</script>
</head>
<body>
<div id="container">
<h1>Jan Koehoorn | <?php echo $title; ?></h1>
<p>Dit is een dynamisch multiple file upload script. Op deze manier kun je 1 of meer bestanden tegelijk uploaden.</p>
<p>JPG only, 50 KB max</p>
<?php
if (!empty ($errs)) {
echo '<ul class="errs">';
foreach ($errs as $err) {
echo '<li>' . $err . '</li>';
}
echo '</ul>';
}
if (!empty ($msgs)) {
echo '<ul class="msgs">';
foreach ($msgs as $msg) {
echo '<li>' . $msg . '</li>';
}
echo '</ul>';
}
?>
<form id="my_form" method="post" action="<?php echo $_SERVER['REQUEST_URI']; ?>" enctype="multipart/form-data">
<p>
<input name="userfile[]" type="file" size="60" /> <a class="add" id="toevoegen" href="#">toevoegen</a>
</p>
<p>
<input type="submit" value="upload" />
</p>
</form>
</div>
</body>
</html>[/code]
Reacties
0