diff options
| -rw-r--r-- | client/components/users/userAvatar.jade | 2 | ||||
| -rw-r--r-- | client/components/users/userAvatar.js | 45 | ||||
| -rw-r--r-- | collections/avatars.js | 2 | ||||
| -rw-r--r-- | i18n/en.i18n.json | 1 |
4 files changed, 34 insertions, 16 deletions
diff --git a/client/components/users/userAvatar.jade b/client/components/users/userAvatar.jade index d6527a5d..9a92db57 100644 --- a/client/components/users/userAvatar.jade +++ b/client/components/users/userAvatar.jade @@ -36,6 +36,8 @@ template(name="memberName") = user.username template(name="changeAvatarPopup") + if error.get + .warning {{_ error.get}} ul.pop-over-list each uploadedAvatars li: a.js-select-avatar diff --git a/client/components/users/userAvatar.js b/client/components/users/userAvatar.js index 73b2631a..a35415e2 100644 --- a/client/components/users/userAvatar.js +++ b/client/components/users/userAvatar.js @@ -47,6 +47,10 @@ BlazeComponent.extendComponent({ return 'changeAvatarPopup'; }, + onCreated: function() { + this.error = new ReactiveVar(''); + }, + avatarUrlOptions: function() { return { auth: false, @@ -79,28 +83,39 @@ BlazeComponent.extendComponent({ }); }, + setError: function(error) { + this.error.set(error); + }, + events: function() { return [{ 'click .js-upload-avatar': function() { this.$('.js-upload-avatar-input').click(); }, 'change .js-upload-avatar-input': function(evt) { - var self = this; - var file, fileUrl; - - FS.Utility.eachFile(evt, function(f) { - file = Avatars.insert(new FS.File(f)); - fileUrl = file.url(self.avatarUrlOptions()); + let file, fileUrl; + + FS.Utility.eachFile(evt, (f) => { + try { + file = Avatars.insert(new FS.File(f)); + fileUrl = file.url(this.avatarUrlOptions()); + } catch (e) { + this.setError('avatar-too-big'); + } }); - var fetchAvatarInterval = window.setInterval(function() { - $.ajax({ - url: fileUrl, - success: function() { - self.setAvatar(file.url(self.avatarUrlOptions())); - window.clearInterval(fetchAvatarInterval); - } - }); - }, 100); + + if (fileUrl) { + this.setError(''); + let fetchAvatarInterval = window.setInterval(() => { + $.ajax({ + url: fileUrl, + success: () => { + this.setAvatar(file.url(this.avatarUrlOptions())); + window.clearInterval(fetchAvatarInterval); + } + }); + }, 100); + } }, 'click .js-select-avatar': function() { var avatarUrl = this.currentData().url(this.avatarUrlOptions()); diff --git a/collections/avatars.js b/collections/avatars.js index 5ca074ee..87af7120 100644 --- a/collections/avatars.js +++ b/collections/avatars.js @@ -3,7 +3,7 @@ Avatars = new FS.Collection('avatars', { new FS.Store.GridFS('avatars') ], filter: { - maxSize: 32000, + maxSize: 72000, allow: { contentTypes: ['image/*'] } diff --git a/i18n/en.i18n.json b/i18n/en.i18n.json index ca1edfdc..9aaff5d6 100644 --- a/i18n/en.i18n.json +++ b/i18n/en.i18n.json @@ -189,6 +189,7 @@ "editProfilePopup-title": "Edit Profile", "changeAvatarPopup-title": "Change Avatar", "changePasswordPopup-title": "Change Password", + "avatar-too-big": "The avatar is too large (70Kb max)", "cardDetailsActionsPopup-title": "Card Actions", "disambiguateMultiLabelPopup-title": "Disambiguate Label Action", "disambiguateMultiMemberPopup-title": "Disambiguate Member Action" |