html5 drag drop,javascript

I'm trying to setup HTML5 drag and drop using dataTransfer.getData (http://html5demos.com/drag-anything) which reads any text into drop window and use plupload (http://www.plupload.com) to save that data.

Current code:

if (getDataType.checked == false && e.dataTransfer.types) {

li.innerHTML = '

• ';

[].forEach.call(e.dataTransfer.types, function (type) {

li.innerHTML += '

' + entities(e.dataTransfer.getData(type) + ' (content-type: ' + type + ')') + '';

if (e.dataTransfer.types == 'Files') {

li.innerHTML += '

' + entities(e.dataTransfer.getData(type) + ' (uploadable: ' + type + ')') + '';

}

});

li.innerHTML += '

';

} else {

// ... however, if we're IE, we don't have the .types property, so we'll just get the Text value

li.innerHTML = e.dataTransfer.getData('Text');

}

I need help taking the output of dataTransfer.getData to plupload and the dropzone knowing the difference between a file and snippet of text.

EDIT:

To add more context around what I've tried.

1. Use if statement to do something if the dropped items are files. This doesn't work because (I believe) the items have already been dropped and therefore can't be uploaded

2. Get dataTransfer.files but that doesn't store uploadable files and kills the on-the-fly writing of the snippet.

I think that the solution involves querying the dropped items at the beginning and then using plupload for the files and dataTransfer.getData for the snippets - problem is I don't know how to do this. Any help would be much appreciated.