I have the following javascript that verifies and passes the 'artwork' file to a PHP script on my server, which then has some redundant verification of its own (one can never be too safe) and then writes the file to /uploads.
I need to dump the $basename PHP variable in its final state back to the javascript to then write that to a hidden input (ID="artwork_filename").
I can echo the $basename to the 'success' handler, but it feels so inelegant to then have to capture that $basename and strip it out of the result - I want an elegant solution, preferably passing $basename directly to a variable on the javascript.
Javascript:
<script>
function _(el) {
return document.getElementById(el);
}
function uploadFile() {
var file = _("file").files[0];
if (file == null) {
_("status").innerHTML = "<span style=" + '"color: black;">' + "Please select a file before clicking upload</span>";
}
//alert(file.name+" | "+file.size+" | "+file.type);
if (file.type==="application/zip"
|| file.type==="application/x-zip"
|| file.type==="application/x-zip-compressed") {
if (file.size < 52428800) {
var formdata = new FormData();
formdata.append("file", file);
var ajax = new XMLHttpRequest();
ajax.upload.addEventListener("progress", progressHandler, false);
ajax.addEventListener("load", completeHandler, false);
ajax.addEventListener("abort", abortHandler, false);
ajax.open("POST", "upload_artwork.php");
ajax.send(formdata);
} else {
//alert("File is too big! Max upload size is 50MB. To upload a bigger file, please contact us for instructions");
_("status").innerHTML = "<span style=" + '"color: red;">' + "File is too big! Max upload size is 50MB</span>";
exit();
}
} else {
_("status").innerHTML = "<span style=" + '"color: red;">' + "Upload stopped! Did you 'zip' your file?</span>";
exit();
}
}
function progressHandler(event) {
//_("loaded_n_total").innerHTML = "Uploaded: "+event.loaded+" bytes of "+event.total;
var percent = (event.loaded / event.total) * 100;
_("progress_bar").value = Math.round(percent);
_("status").innerHTML = Math.round(percent)+"% uploaded... please wait";
}
function completeHandler(event) {
_("status").innerHTML = event.target.responseText;
_("progress_bar").value = 0;
}
function errorHandler(event) {
_("status").innerHTML = "<span style=" + '"color: red;">' + "Upload failed! Notify site administrator</span>";
}
function abortHandler(event) {
_("status").innerHTML = "<span style=" + '"color: red;">' + "Upload aborted! Please try again</span>";
}
</script><input id="artwork_filename" type="hidden" name="custom" value="" />PHP:
<?php
$allowedExts = array("zip", "rar"/*, "ai", "eps", "psd", "bmp", "jpg", "png", "tiff"*/);
if (@$_FILES['file'] == null) {
echo "<span style=" . '"color: red;">' . "Please choose a file before clicking upload</span>";
exit();
} else {
$fileName = $_FILES["file"]["name"];
$fileTmpLoc = $_FILES["file"]["tmp_name"];
$fileType = $_FILES["file"]["type"];
$fileSize = $_FILES["file"]["size"];
$fileErrorMsg = $_FILES["file"]["error"];
$temp = explode(".", $_FILES["file"]["name"]);
$name = pathinfo($_FILES["file"]["name"], PATHINFO_FILENAME);
$extension = pathinfo($_FILES['file']['name'], PATHINFO_EXTENSION);
$i = '';
}
//Check for max file size breach
//OR NOT: stop it on JS side to prevent long file upload
//and then alerting user that their file is too big!
//(Also prevents sidestepping ugly PHP error kickout if file is too big.
if ((($_FILES["file"]["type"] == "application/zip")
|| ($_FILES["file"]["type"] == "application/x-zip")
|| ($_FILES["file"]["type"] == "application/x-zip-compressed")
//|| ($_FILES["file"]["type"] == "application/x-rar-compressed")
/*|| ($_FILES["file"]["type"] == "application/postscript")
|| ($_FILES["file"]["type"] == "image/vnd.adobe.photoshop")
|| ($_FILES["file"]["type"] == "image/bmp")
|| ($_FILES["file"]["type"] == "image/jpg")
|| ($_FILES["file"]["type"] == "image/png")
|| ($_FILES["file"]["type"] == "image/tiff")*/)
&& ($_FILES["file"]["size"] < 52428800)
&& in_array($extension, $allowedExts)) {
if ($_FILES["file"]["error"] > 0) {
echo "Upload error! Please notify site administrator";
} else {
if (file_exists("upload/" . $name . $i . '.' . $extension)) {
while(file_exists("upload/" . $name . $i . '.' . $extension)) {
$i++;
}
$basename = $name . $i . '.' . $extension;
if(move_uploaded_file($_FILES["file"]["tmp_name"],
"upload/" . $basename)) {
echo "<span style=" . '"color: green;">' . "Artwork successfully uploaded</span>";
} else {
echo "<span style=" . '"color: red;">' . "Upload error! Please contact the site administrator and report the issue</span>";
}
} else {
if(move_uploaded_file($fileTmpLoc, "upload/$fileName")) {
echo "<span style=" . '"color: green;">' . "Artwork successfully uploaded</span>";
} else {
echo "<span style=" . '"color: red;">' . "Upload error! Please contact the site administrator and report the issue</span>";
}
}
}
} else {
error_reporting(E_ERROR ^ E_PARSE);
echo "<span style=" . '"color: red;">' . "Upload stopped! Did you 'zip' your file?</span>";
}
?>
