Polymer core-ajax file upload progress

Question

how do I add a progress bar. I use the code provided by eric bidelman here => Polymer Core-Ajax File upload

downloadinit: function( event, detail, sender ){
            this.files = sender.files;
            for ( var i = 0; i < this.files.length; i++ ) {
                var file = this.files[i]
                this.uploadsize += file.size;
                this.fileList[this.uploadPop] = file.name;
                this.uploadPop += 1;
            }

            event.stopPropagation(); // Stop stuff happening
            event.preventDefault(); // Totally stop stuff happening

            for( var i = 0, f; f = this.files[i]; ++i) {
                this.data.append( sender.name, f, f.name );
            }
            this.queryUrl2 = "projects/submit.php?pjid="+this.projDetails.projectid;
            this.submitBody = this.data;
            this.$.ajaxAction2.contentType = null;
        },
        triggerDownload: function(){
            this.$.ajaxAction2.go();
            data = new FormData;
            this.files = null;
            this.fileList = [];
            this.submitBody = null;
            this.uploadsize = 0;
            this.uploadPop = 0;
        },

Answer 1

You can add a 'loading' mask.

<template>
<form>
   <paper-input type="File" label="Choose File" ... ></paper-input>
   <paper-button label="Send" on-click="{{sendData}}" raisedButton></paper-button>
</form>
<core-ajax id="ajax" url="/upload"
           method="POST"
           on-core-response="{{onResponse}}"
           ....
></core-ajax>
</template>
<script>
sendData: function () {
    ...
    this.$.ajax.go();
    this.spiningLoadingMask(true);
    ...
},

onResponse: function () {
    ...
    this.spiningLoadinMask(false);
    ...
},

spiningLoadingMask: function (val) {
    if(val){
    ... //start moving the wheel
    } else {
    ... //stop that wheel
    }
}
</script>

something like that can work, there is not a 'Progress Bar' but a spining wheel is a good option.

Answer 2

有一个请求请求实现了缺少的功能https://github.com/Polymer/core-ajax/pull/27