var Card = require('account/views/card');

module.exports = Card.extend({
  attributes: function() {
    return {
      'title': this.model.get('name'),
      'data-type': 'file'
    };
  },

  className: function() {
    var className = Card.prototype.className.apply(this, arguments);
    if (this.model.get('is_uploading')) className += ' is-uploading';
    return className;
  },

  template: require('account/templates/file'),

  elements: {
    uploadProgress: 'div.card-upload-progress'
  },

  bindings: function() {
    return _.merge({
      model: {
        'change:is_uploading': 'onUploadingStateChange',
        'change:upload_progress': 'onUploadProgress'
      }
    }, Card.prototype.bindings);
  },

  context: function() {
    return _.extend({}, this.model.attributes, {
      preview: this.model.getSmallPreview(),
      extension: this.model.getExtension(),
      hasNoPreview: this.model.hasNoPreview()
    });
  },

  onUploadingStateChange: function(file, isUploading) {
    this.$el.toggleClass('is-uploading', isUploading);
  },

  onUploadProgress: function(file, progress) {
    this.getElement('uploadProgress').text(progress + '%');
  }
});

@@ -925,32 +925,143 @@
 )%0A    %7D);%0A  %7D,%0A%0A
+  updateUploadProgress: function(progress) %7B%0A    this.getElement('uploadProgress').text(progress + '%25');%0A  %7D,%0A%0A
   onUploadingSta
@@ -1212,34 +1212,49 @@
 ) %7B%0A    
+if (
 this.
-getElement('u
+isRendered) this.updateU
 ploadPro
@@ -1250,39 +1250,32 @@
 teUploadProgress
-').text
 (progress + '%25')
@@ -1263,29 +1263,23 @@
 ess(progress
- + '%25'
 );%0A  %7D%0A%7D);%0A

Fix card rendering issue when uploading first file.