Example RxJS file dnd upload

DnDUpload.js

var mouseDropS = $('#drop').onAsObservable('drop')

var uploadsS = mouseDropS.flatMap(function(e) {
  var fileList = e.originalEvent.dataTransfer.files
  var files = range(fileList.length).map(function(i) { return fileList[i] })

  return Rx.Observable.fromArray(files.map(function(file) {
    var subject = new Rx.ReplaySubject(1)
    var reader = new FileReader()

    reader.onload = function(e) {
      var fd = new FormData()
      fd.append('fileToUpload', e.target.result)
      fd.append('contentType', file.type)

      var ajaxS = $.ajaxAsObservable({
        type: 'POST',
        url: '/upload',
        data: fd,
        processData: false,
        contentType: false
      })

      ajaxS.subscribe(subject)
    }

    reader.readAsDataURL(file)
    return subject.asObservable()
  }))
})

uploadsS.subscribe(function (s) { s.subscribe(log) })

I like this, but you probably don't need to first load the file; if you don't, then the browser just sends the binary file instead of the base64-encoded one.