diff --git a/Changelog.md b/Changelog.md index 9cf757db6..053e83279 100644 --- a/Changelog.md +++ b/Changelog.md @@ -40,6 +40,7 @@ * Fix avatar display on mobile profile [#4591](https://github.com/diaspora/diaspora/pull/4591) * Add lightbox to unauthenticated header, fix [#4432](https://github.com/diaspora/diaspora/issues/4432) * Fix "more picture" indication (+n) on mobile by adding a link on the indication [#4592](https://github.com/diaspora/diaspora/pull/4592) +* Display errors when photo upload fails [#4509](https://github.com/diaspora/diaspora/issues/4509) ## Features * Add oEmbed content to the mobile view [#4343](https://github.com/diaspora/diaspora/pull/4353) diff --git a/app/assets/javascripts/app/views/publisher/uploader_view.js b/app/assets/javascripts/app/views/publisher/uploader_view.js index b09d8dd21..730850ebe 100644 --- a/app/assets/javascripts/app/views/publisher/uploader_view.js +++ b/app/assets/javascripts/app/views/publisher/uploader_view.js @@ -60,13 +60,19 @@ app.views.PublisherUploader = Backbone.View.extend({ }, uploadCompleteHandler: function(id, fileName, response) { - this.el_info.text(Diaspora.I18n.t('photo_uploader.completed', {file: fileName})).fadeTo(2000, 0); + if (response.success){ + this.el_info.text(Diaspora.I18n.t('photo_uploader.completed', {file: fileName})).fadeTo(2000, 0); - var id = response.data.photo.id, - url = response.data.photo.unprocessed_image.url; + var id = response.data.photo.id, + url = response.data.photo.unprocessed_image.url; - this._addFinishedPhoto(id, url); - this.trigger('change'); + this._addFinishedPhoto(id, url); + this.trigger('change'); + } else { + this._cancelPhotoUpload(); + this.trigger('change'); + this.el_info.text(Diaspora.I18n.t('photo_uploader.error', {file: fileName})); + } }, // replace the first photo placeholder with the finished uploaded image and @@ -96,6 +102,14 @@ app.views.PublisherUploader = Backbone.View.extend({ } }, + _cancelPhotoUpload: function() { + var publisher = this.options.publisher; + var placeholder = publisher.el_photozone.find('li.loading').first(); + placeholder + .removeClass('loading') + .find('img').remove(); + }, + // remove an already uploaded photo _removePhoto: function(evt) { var self = this; diff --git a/config/locales/javascript/javascript.en.yml b/config/locales/javascript/javascript.en.yml index c52b13398..b24371dfd 100644 --- a/config/locales/javascript/javascript.en.yml +++ b/config/locales/javascript/javascript.en.yml @@ -81,6 +81,7 @@ en: photo_uploader: looking_good: "OMG, you look awesome!" completed: "<%= file %> completed" + error: "A problem occurred while uploading file <%= file %>" invalid_ext: "{file} has invalid extension. Only {extensions} are allowed." size_error: "{file} is too large, maximum file size is {sizeLimit}." empty: "{file} is empty, please select files again without it." diff --git a/spec/javascripts/app/views/publisher_view_spec.js b/spec/javascripts/app/views/publisher_view_spec.js index a6a7135b3..708f63180 100644 --- a/spec/javascripts/app/views/publisher_view_spec.js +++ b/spec/javascripts/app/views/publisher_view_spec.js @@ -382,15 +382,17 @@ describe("app.views.Publisher", function() { }); }); - context('completion', function() { + context('successful completion', function() { beforeEach(function() { Diaspora.I18n.loadLocale({ photo_uploader: { completed: '<%= file %> completed' }}); $('#photodropzone').html('
  • '); - this.uploader.onComplete(null, 'test.jpg', { data: { photo: { - id: '987', - unprocessed_image: { url: 'test.jpg' } - }}}); + this.uploader.onComplete(null, 'test.jpg', { + data: { photo: { + id: '987', + unprocessed_image: { url: 'test.jpg' } + }}, + success: true }); }); it('shows it in text form', function() { @@ -417,6 +419,25 @@ describe("app.views.Publisher", function() { expect(this.view.el_preview.prop('disabled')).toBeFalsy(); }); }); + + context('unsuccessful completion', function() { + beforeEach(function() { + Diaspora.I18n.loadLocale({ photo_uploader: { completed: '<%= file %> completed' }}); + $('#photodropzone').html('
  • '); + + this.uploader.onComplete(null, 'test.jpg', { + data: { photo: { + id: '987', + unprocessed_image: { url: 'test.jpg' } + }}, + success: false }); + }); + + it('shows error message', function() { + var info = this.view.view_uploader.el_info; + expect(info.text()).toBe(Diaspora.I18n.t('photo_uploader.error', {file: 'test.jpg'})) + }); + }); }); context('photo removal', function() {