title: file download with XMLHttpRequest
body: <p>I am having a hard time implementing a simple file download script. <br/>
  This is what I have so far, working ok : </p>
  
  <ul>
  <li>Open an  XMLHttpRequest </li>
  <li>Get remote file as blob binary</li>
  <li>Show download progress</li>
  </ul>
  
  <p>My problem is :</p>
  
  <ul>
  <li>creating a custom download directory</li>
  <li>renaming downloaded file as original source name</li>
  <li>downloaded file does not include its extension</li>
  <li>Possibility to add the option to prompt a save as location before download ?</li>
  </ul>
  
  <p>This is the snippet :<br/></p>
  
  <pre><code>    $('#DownloadBtn').click(function(e) {
  
          e.preventDefault();
  
          var urlFile = $(this).attr('href'); // remote file www.blabla.com/soft123.bin
          var fileName = ''; // Get remote file name &amp; extension ?
  
          var progressBar = document.querySelector('progress');
  
          window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
  
          function onError(e) {
              console.log('Error', e);
          }
  
          var xhr = new XMLHttpRequest();
          xhr.addEventListener("progress", updateProgress, false);
          xhr.open('GET', urlFile, true);
          xhr.responseType = 'blob';
          var resourceDIRLOC = "Downloads";
          xhr.onload = function(e) {
              window.requestFileSystem(TEMPORARY, 10 * 1024 * 1024, function(fs) {
                  fs.root.getDirectory(fs.root.fullPath + '/' + resourceDIRLOC, {
                      create: true
                  }, function(dir) {
                      resourceDIR = dir;
                      fs.root.getFile(fileName, {
                          create: true
                      }, function(fileEntry) {
                          fileEntry.createWriter(function(writer) {
                              writer.onwrite = function(e) {};
                              writer.onerror = function(e) {};
                              var blob = new Blob([xhr.response], {
                                  type: ' application/octet-stream'
                              });
  
                              writer.write(blob);
                          }, onError);
                      }, onError);
                  }, onError);
              }, onError);
          };
  
          function updateProgress(e) {
              if (e.lengthComputable) {
                  $(progressBar).show();
                  var i = (e.loaded / e.total) * 100;
                  progressBar.value = i;
                  if (i == 100) {
                      $(progressBar).hide();
                  }
              }
          }
          xhr.send();
      });
  </code></pre>
  
  <p>The downloaded file is located under <code>FileSystem-&gt;000-&gt;t</code> with <code>00</code> as name ( not soft123.bin )<br/><br/>
  I am not sure if it is possible to give the user an option to choose a download directory outside FileSystem? As defined above, target directory <code>resourceDIRLOC = "Downloads"</code> but the request is not creating this folder ? neither giving the file a name and extension<br/>
  Any advise is appreciated<br/>
  Thanks</p>