Ajax With Uploadify
|
|
Hi guys, first of all let me say how great the Hey!Watch system is! I’ve been using it a while now and am amazed at the quality and speed at which videos are created. I’m using the jQuery plugin Uploadify – I’ve had it set up and running on a couple of sites for a while now and has been working fine. But recently I’ve had a few failures and I’ve been trying to work out what’s happening. The plugin is set to upload to http://heywatch.com/upload.xml . All fields including Heywatch key are set correctly – as I say it’s been working a couple of weeks now. The way I have set it to work is as follows:
The past couple of days I’ve been getting a few failure emails from my database script because my script is not getting the Heywatch ID and width and height I’m sending it. When I test my form, the file uploads correctly but the jquery doesn’t receive the data back from heywatch – so it just hangs on the upload form page. My script is a bit slack and doesn’t check for errors from heywatch, but the videos are uploaded, encoded and ftp-d to my server. I’m a bit stuck now as I can’t tell whether the problems my end or Heywatch end – eg if the xml format has changed or anything.. Any ideas/suggestions would be greatly appreciated. My in-page code:
<script type="text/javascript">
$(function() {
$('#data').fileUpload ({
'uploader' : '<?php echo $baseurl; ?>/js/uploadify/uploader-cms.swf',
'script' : 'http://heywatch.com/upload.xml',
'scriptData' : {'key': 'mykeyhere','uid': '<?php echo $_SESSION['uid']; ?>','title': '<?php echo $_SESSION[uid].'_'.time(); ?>'},
'cancelImg' : '<?php echo $baseurl; ?>/js/uploadify/cancel.png',
'multi' : false,
'auto' : false,
'method' : 'POST',
onSelectOnce: function (evt, data) {
if(data.fileCount>0){
$('#uploadBtn').show();
$('.validation-advice').hide();
}
},
onProgress: function (evt, queueID, fileObj, data) {
$('input,textarea').attr("disabled", true);
$('#upload_status').html("<strong>Uploading Video <img src='<?php echo $baseurl; ?>/images/ajax-loader.gif' style='vertical-align: middle;' /></strong>");
},
onCancel: function (evt, queueID, fileObj, data) {
$('input,textarea').removeAttr("disabled");
$('#upload_status').html("");
},
onError: function (evt, queueID, fileObj, errorObj) {
alert(errorObj.type);
alert(errorObj.status);
alert(errorObj.text);
},
onComplete: function (evt, queueID, fileObj, response, data) {
heywatch_id = $(response).find("id").text();
width = $(response).find("video").attr("width");
height = $(response).find("video").attr("height");
$('#upload_status').html("<strong>Video Uploaded <img src='<?php echo $baseurl; ?>/images/ajax-loader.gif' style='vertical-align: middle;' /></strong>");
postFormData();
}
});
function getVal(el) {
if (el.is(":checked")) {
return 1;
} else {
return 0;
}
}
function postFormData() {
var inputData = ({'heywatch_id': heywatch_id, 'width': width, 'height': height, 'uid': <?php echo $_SESSION['uid']; ?>, 'video_title': $('#title').val(), 'creative' : getVal($('#creative')), 'brand' : getVal($('#brand')), 'publisher' : getVal($('#publisher')), 'comments' : $('#comments').val(), 'tags' : $('#tags').val()});
$('#upload_status').html("<strong>Sending Video Details <img src='<?php echo $baseurl; ?>/images/ajax-loader.gif' style='vertical-align: middle;' /></strong>");
$.ajax({
url: "<?php echo $baseurl; ?>/content/ajax/ajax_upload_video_form.php",
data: inputData,
cache: false,
success: function(response){
$('input,textarea').removeAttr("disabled");
$('#upload_status').html("<strong>All done!</strong>");
var redirect_url = "<?php echo $baseurl; ?>/<?php echo $_SESSION['username']; ?>/virals/videos/";
window.location = redirect_url;
}
});
}
});
</script>
|