vaadin-upload

vaadin

by SlashBunny

HTML

<base href="https://raw-dot-custom-elements.appspot.com/vaadin/vaadin-upload/v2.0.0/vaadin-upload/">
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
<script src="https://cdn.vaadin.com/vaadin-elements/master/mock-http-request/lib/mock.js"></script>
<link rel="import" href="vaadin-upload.html">
<script>
  function mockXhrGenerator(file) {
    var xhr = new MockHttpRequest();
    xhr.upload = {};
    xhr.onsend = function() {
      var total = file && file.size ||  1024,
        done = 0;

      function start() {
        setTimeout(progress, 1000);
      }

      function progress() {
        xhr.upload.onprogress({
          total: total,
          loaded: done
        });
        if (done < total) {
          setTimeout(progress, 200);
          done = Math.min(total, done + 254000);
        } else if (!file.abort) {
          setTimeout(finish, 1000);
        }
      }

      function finish() {
        xhr.receive(200, '{"message":"OK"}');
      }
      start();
    };
    return xhr;
  }

  window.addEventListener('WebComponentsReady', function() {
    // Monkey-patch vaadin-upload prototype to use MockHttpRequest
    Object.getPrototypeOf(document.createElement('vaadin-upload'))._createXhr = mockXhrGenerator;
  });

</script>

<vaadin-upload accept=".pdf">
  <iron-icon slot="drop-label-icon" icon="description"></iron-icon>
  <span slot="drop-label">Drop your favourite Novels here (PDF files only)</span>
</vaadin-upload>