gistfile1.txt

Drupal.behaviors.mike_files = function () {
  // Setup the dnd listeners.
  var dropZone = document.getElementById('drop_zone');
  dropZone.addEventListener('dragover', handleDragOver, false);
  dropZone.addEventListener('dragleave', handleDragLeave, false);
  dropZone.addEventListener('drop', handleFileSelect, false);
}

function handleDragOver(evt) {
  evt.stopPropagation();
  evt.preventDefault();
  $("#drop_zone").css("background-color","green");
}

function handleDragLeave(evt) {
  $("#drop_zone").css("background-color","white");
}

function handleFileSelect(evt) {
    evt.stopPropagation();
    evt.preventDefault();
    
    var files = evt.dataTransfer.files; // FileList object.
    
    window.prepFiles = new Array();
    window.fileCount = 0;
    window.prepCount = 0;
    
    for (var i = 0, f; f = files[i]; i++) {
      window.fileCount += 1;
    }
    
    for (var i = 0, f; f = files[i]; i++) {
      window.prepFiles[i] = new Array();
      window.prepFiles[i]['filename'] = f.fileName;
      window.prepFiles[i]['mimetype'] = f.type;
      var reader = new FileReader();
      reader.onload = function(evt) {
        window.prepFiles[window.prepCount]['binary'] = evt.target.result
        window.prepCount += 1;
        if (window.prepCount == window.fileCount) {
          buildPost();
        }
      }
      reader.readAsBinaryString(f);
    }   
  }
    
function buildPost() {
  var boundary = '------multipartformboundary' + (new Date).getTime();
  var dashdash = '--';
  var crlf     = '\r\n';

  /* Build RFC2388 string. */
  var builder = '';

  builder += dashdash;
  builder += boundary;
  builder += crlf;
  
  var xhr = new XMLHttpRequest();
  
  for (var i = 0, f; f = window.prepFiles[i]; i++) {
    builder += 'Content-Disposition: form-data; name="user_file[]"';
    builder += '; filename="' + f['filename'] + '"';
    builder += crlf;
    builder += 'Content-Type: ' + f['mimetype'] + '';
    builder += crlf;
    builder += crlf; 
    builder += f['binary'];
    builder += crlf;

    /* Write boundary. */
    builder += dashdash;
    builder += boundary;
    builder += crlf;
  }
  
  /* Mark end of the request. */
  builder += dashdash;
  builder += boundary;
  builder += dashdash;
  builder += crlf;
  
  xhr.open("POST", "/mike_files_upload", true);
  xhr.setRequestHeader('content-type', 'multipart/form-data; boundary=' + boundary);
  xhr.send(builder);
  
  xhr.onload = function(event) { 
      /* If we got an error display it. */
      if (xhr.responseText) {
          alert(xhr.responseText);
      }
  };
  
}