I'm trying to allow users to upload images to a server, utilising client side compression of jpeg files for reduced bandwidth use.
However I seem to be having great difficulty doing this and would appreciate some help with it.
I've tried using the example code from the website as a view eg:
<!DOCTYPE html>
<html xmlns="<a class="linkification-ext" href="http://www.w3.org/1999/xhtml" title="Linkification: http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>" dir="ltr">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Plupload - Getting Started</title>
<script type="text/javascript" src="<?php echo base_url();?>assets/js/plupload.full.min.js" ></script>
</head>
<body>
<ul id="filelist"></ul>
<br />
<div id="container">
<a id="browse" href="javascript:;">[Browse...]</a>
<a id="start-upload" href="javascript:;">[Start Upload]</a>
</div>
<br />
<pre id="console"></pre>
<script type="text/javascript">
var uploader = new plupload.Uploader({
browse_button: 'browse', // this can be an id of a DOM element or the DOM element itself
url: '<?php echo base_url();?>application/views/messages/upload.php',
resize: {
quality: 80,
preserve_headers: false
}
});
uploader.init();
uploader.bind('FilesAdded', function(up, files) {
var html = '';
plupload.each(files, function(file) {
html += '<li id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></li>';
});
document.getElementById('filelist').innerHTML += html;
});
uploader.bind('UploadProgress', function(up, file) {
document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
});
uploader.bind('Error', function(up, err) {
document.getElementById('console').innerHTML += "
Error #" + err.code + ": " + err.message;
});
document.getElementById('start-upload').onclick = function() {
uploader.start();
};
</script>
</body>
</html>
And the standard upload.php page in the same directory as the aforementioned view:
<?php
if (empty($_FILES) || $_FILES["file"]["error"]) {
die('{"OK": 0}');
}
$fileName = $_FILES["file"]["name"];
move_uploaded_file($_FILES["file"]["tmp_name"], "<?php echo base_url();?>uploads/files/$fileName");
die('{"OK": 1}');
?>
The code seems to run and I get the 100% message along with the file information, but there is no image in the referenced upload directory, other views in the same folder can write to the directory using other file upload methods so permissions doesn't seem to be the issue. I would appreciate some advice here, on what the problem may be, or where to look for the answer, thanks.