From b1f267ee18e910258acf8e80d2655bf1a8c54420 Mon Sep 17 00:00:00 2001 From: Rodrigo Nascimento Date: Sat, 30 May 2015 22:48:49 -0300 Subject: [PATCH 01/10] Init avatar selection --- .meteor/packages | 2 ++ client/routes/router.coffee | 4 +++ client/views/avatar/avatar.coffee | 13 +++++++ client/views/avatar/avatar.html | 30 ++++++++++++++++ server/methods/getAvatarSuggestion.coffee | 44 +++++++++++++++++++++++ 5 files changed, 93 insertions(+) create mode 100644 client/views/avatar/avatar.coffee create mode 100644 client/views/avatar/avatar.html create mode 100644 server/methods/getAvatarSuggestion.coffee diff --git a/.meteor/packages b/.meteor/packages index 7121f27ba09eb..ab159c30eb852 100644 --- a/.meteor/packages +++ b/.meteor/packages @@ -45,3 +45,5 @@ percolate:migrations underscorestring:underscore.string meteorhacks:kadira yasaricli:slugify +jparker:gravatar +http diff --git a/client/routes/router.coffee b/client/routes/router.coffee index d63a896904657..3a77ba6d80264 100644 --- a/client/routes/router.coffee +++ b/client/routes/router.coffee @@ -29,6 +29,10 @@ Router.onBeforeAction -> this.layout('usernameLayout') return this.render('usernamePrompt') + if Meteor.userId()? and not Meteor.user().avatarOrigin? + this.layout('usernameLayout') + return this.render('avatarPrompt') + this.next() , { except: ['login'] diff --git a/client/views/avatar/avatar.coffee b/client/views/avatar/avatar.coffee new file mode 100644 index 0000000000000..680169ee1d9c6 --- /dev/null +++ b/client/views/avatar/avatar.coffee @@ -0,0 +1,13 @@ +Template.avatarPrompt.onCreated -> + self = this + self.suggestions = new ReactiveVar + + Meteor.call 'getAvatarSuggestion', (error, avatars) -> + self.suggestions.set + ready: true + avatars: avatars + + +Template.avatarPrompt.helpers + suggestions: -> + return Template.instance().suggestions.get() diff --git a/client/views/avatar/avatar.html b/client/views/avatar/avatar.html new file mode 100644 index 0000000000000..1d4ef12bd7e47 --- /dev/null +++ b/client/views/avatar/avatar.html @@ -0,0 +1,30 @@ + diff --git a/server/methods/getAvatarSuggestion.coffee b/server/methods/getAvatarSuggestion.coffee new file mode 100644 index 0000000000000..d765a231cacab --- /dev/null +++ b/server/methods/getAvatarSuggestion.coffee @@ -0,0 +1,44 @@ +Meteor.methods + getAvatarSuggestion: -> + if not Meteor.userId() + throw new Meteor.Error 203, '[methods] typingStatus -> Usuário não logado' + + user = Meteor.user() + + avatars = [] + + if user.services.facebook?.id? + avatars.push + service: 'facebook' + url: "https://graph.facebook.com/#{user.services.facebook.id}/picture?type=large" + + if user.services.google?.picture? + avatars.push + service: 'google' + url: user.services.google.picture + + if user.services.github?.username? + avatars.push + service: 'github' + url: "https://avatars.githubusercontent.com/#{user.services.github.username}?s=200" + + if user.emails?.length > 0 + for email in user.emails when email.verified is true + avatars.push + service: 'gravatar' + url: Gravatar.imageUrl email.address + + validAvatars = [] + for avatar in avatars + try + result = HTTP.get avatar.url, npmRequestOptions: {encoding: null} + if result.statusCode is 200 + blob = "data:#{result.headers['content-type']};base64," + binary = new Buffer(result.content, 'binary') + blob += binary.toString('base64') + avatar.blob = blob + validAvatars.push avatar + catch e + # ... + + return validAvatars From 46913ff94a19fc7a0bdea18d64318b07854aee17 Mon Sep 17 00:00:00 2001 From: Rodrigo Nascimento Date: Sun, 31 May 2015 12:19:02 -0300 Subject: [PATCH 02/10] Improve interface to select avatar --- client/stylesheets/base.less | 18 ++++++++ client/views/avatar/avatar.html | 54 ++++++++++++++++++----- server/methods/getAvatarSuggestion.coffee | 9 ++-- 3 files changed, 65 insertions(+), 16 deletions(-) diff --git a/client/stylesheets/base.less b/client/stylesheets/base.less index caf913d39ebc7..ded42ba0620f8 100644 --- a/client/stylesheets/base.less +++ b/client/stylesheets/base.less @@ -2666,6 +2666,24 @@ a.github-fork { } } +.avatar-suggestion-item { + height: 80px; + margin: 10px 0px; + text-align: left; + + > div { + height: 80px; + width: 80px; + background-size: cover; + display: inline-block; + border: 1px solid #DDD; + } + button { + display: inline-block; + top: -33px; + } +} + @media all and(max-width: 1100px) { #rocket-chat { .flex-opened { diff --git a/client/views/avatar/avatar.html b/client/views/avatar/avatar.html index 1d4ef12bd7e47..68c5ef9139517 100644 --- a/client/views/avatar/avatar.html +++ b/client/views/avatar/avatar.html @@ -1,3 +1,23 @@ + + + + @@ -13,7 +13,7 @@
- +
{{/if}} @@ -48,6 +48,7 @@

Selecione um avatar

{{else}} {{_ "usernameRegistration.Loading_suggestion"}} {{/if}} + diff --git a/lib/file.coffee b/lib/file.coffee new file mode 100644 index 0000000000000..b91bdee6a21ce --- /dev/null +++ b/lib/file.coffee @@ -0,0 +1,16 @@ +store = new FS.Store.FileSystem "images", + path: "~/uploads" + fileKeyMaker: (fileObj) -> + filename = fileObj.name() + filenameInStore = fileObj.name({store: 'images'}) + + return filenameInStore || filename + +@Images = new FS.Collection "images", + stores: [store] + +@Images.allow + insert: -> + return true + update: -> + return true \ No newline at end of file From d6d5dfda25c15bcca78a807c99843c63fbe5b31a Mon Sep 17 00:00:00 2001 From: Rodrigo Nascimento Date: Sun, 31 May 2015 18:00:05 -0300 Subject: [PATCH 04/10] Move avatar upload to server side --- client/views/avatar/avatar.coffee | 25 ++++++---------------- client/views/avatar/avatar.html | 3 ++- server/methods/setAvatarFromService.coffee | 14 ++++++++++++ server/publications.coffee | 1 + 4 files changed, 24 insertions(+), 19 deletions(-) create mode 100644 server/methods/setAvatarFromService.coffee diff --git a/client/views/avatar/avatar.coffee b/client/views/avatar/avatar.coffee index c48d89aaa1017..153cc4f84dc5e 100644 --- a/client/views/avatar/avatar.coffee +++ b/client/views/avatar/avatar.coffee @@ -15,24 +15,13 @@ Template.avatarPrompt.helpers Template.avatarPrompt.events 'click .select-service': (e) -> - username = Meteor.user().username - file = new FS.File(this.blob) - file.attachData this.blob, (error) -> - if error? - console.log error - else - file.name(username) - Images.insert file, (err, fileObj) -> - console.log arguments + Meteor.call 'setAvatarFromService', this.blob, this.service, -> + console.log arguments 'change .myFileInput': (event, template) -> - username = Meteor.user().username FS.Utility.eachFile event, (blob) -> - file = new FS.File(blob) - file.attachData blob, (error) -> - if error? - console.log error - else - file.name(username) - Images.insert file, (err, fileObj) -> - console.log arguments \ No newline at end of file + reader = new FileReader() + reader.readAsDataURL(blob) + reader.onloadend = -> + Meteor.call 'setAvatarFromService', reader.result, 'upload', -> + console.log arguments \ No newline at end of file diff --git a/client/views/avatar/avatar.html b/client/views/avatar/avatar.html index e5525f970e9ea..f9dc1aa9d8692 100644 --- a/client/views/avatar/avatar.html +++ b/client/views/avatar/avatar.html @@ -45,10 +45,11 @@

Selecione um avatar

{{#unless suggestions.avatars.github}} {{> avatarSuggestionLogin 'github'}} {{/unless}} + + {{else}} {{_ "usernameRegistration.Loading_suggestion"}} {{/if}} - diff --git a/server/methods/setAvatarFromService.coffee b/server/methods/setAvatarFromService.coffee new file mode 100644 index 0000000000000..948cb37a51003 --- /dev/null +++ b/server/methods/setAvatarFromService.coffee @@ -0,0 +1,14 @@ +Meteor.methods + setAvatarFromService: (image, service) -> + if not Meteor.userId() + throw new Meteor.Error 203, '[methods] typingStatus -> Usuário não logado' + + user = Meteor.user() + + file = new FS.File image + file.attachData image, -> + file.name user.username + + Images.insert file, (err, fileObj) -> + Meteor.users.update {_id: user._id}, {$set: {avatarOrigin: service}} + diff --git a/server/publications.coffee b/server/publications.coffee index 1cc7d27137d5c..0bbf5a4c5e190 100644 --- a/server/publications.coffee +++ b/server/publications.coffee @@ -12,6 +12,7 @@ Meteor.publish 'userData', -> status: 1 statusDefault: 1 statusConnection: 1 + avatarOrigin: 1 emails: 1 'services.facebook.id': 1 'services.google.picture': 1 From f949753b9ddda0764fcdbbed5c9511567a69aaf4 Mon Sep 17 00:00:00 2001 From: Rodrigo Nascimento Date: Sun, 31 May 2015 18:29:44 -0300 Subject: [PATCH 05/10] Add upload preview --- client/stylesheets/base.less | 12 ++++++++++++ client/views/avatar/avatar.coffee | 9 +++++++-- client/views/avatar/avatar.html | 13 ++++++++++++- 3 files changed, 31 insertions(+), 3 deletions(-) diff --git a/client/stylesheets/base.less b/client/stylesheets/base.less index 3bae95dbe49a3..9a4a5b776a55c 100644 --- a/client/stylesheets/base.less +++ b/client/stylesheets/base.less @@ -2691,6 +2691,18 @@ a.github-fork { display: inline-block; top: -33px; } + input[type=file] { + position: absolute !important; + width: 100%; + top: 0; + left: 0; + height: 100%; + opacity: 0; + z-index: 10000; + * { + cursor: pointer; + } + } } @media all and(max-width: 1100px) { diff --git a/client/views/avatar/avatar.coffee b/client/views/avatar/avatar.coffee index 153cc4f84dc5e..ea7ace64e7e12 100644 --- a/client/views/avatar/avatar.coffee +++ b/client/views/avatar/avatar.coffee @@ -1,6 +1,7 @@ Template.avatarPrompt.onCreated -> self = this self.suggestions = new ReactiveVar + self.upload = new ReactiveVar Meteor.call 'getAvatarSuggestion', (error, avatars) -> self.suggestions.set @@ -12,6 +13,9 @@ Template.avatarPrompt.helpers suggestions: -> return Template.instance().suggestions.get() + upload: -> + return Template.instance().upload.get() + Template.avatarPrompt.events 'click .select-service': (e) -> @@ -23,5 +27,6 @@ Template.avatarPrompt.events reader = new FileReader() reader.readAsDataURL(blob) reader.onloadend = -> - Meteor.call 'setAvatarFromService', reader.result, 'upload', -> - console.log arguments \ No newline at end of file + template.upload.set + service: 'upload' + blob: reader.result diff --git a/client/views/avatar/avatar.html b/client/views/avatar/avatar.html index f9dc1aa9d8692..b5d82975e2bec 100644 --- a/client/views/avatar/avatar.html +++ b/client/views/avatar/avatar.html @@ -46,7 +46,18 @@

Selecione um avatar

{{> avatarSuggestionLogin 'github'}} {{/unless}} - +
+
+
+ {{#with upload}} + + {{/with}} + {{#unless upload}} + + {{/unless}} +
{{else}} {{_ "usernameRegistration.Loading_suggestion"}} {{/if}} From a29e3c10a45878b4aa71c80f2348f85299c7b595 Mon Sep 17 00:00:00 2001 From: Rodrigo Nascimento Date: Sun, 31 May 2015 18:40:13 -0300 Subject: [PATCH 06/10] Improve design --- client/stylesheets/base.less | 13 ++++++++++++- client/views/avatar/avatar.html | 4 ++-- 2 files changed, 14 insertions(+), 3 deletions(-) diff --git a/client/stylesheets/base.less b/client/stylesheets/base.less index 9a4a5b776a55c..a01fef8d9b0ab 100644 --- a/client/stylesheets/base.less +++ b/client/stylesheets/base.less @@ -2686,10 +2686,21 @@ a.github-fork { background-size: cover; display: inline-block; border: 1px solid #DDD; + font-size: 80px; + text-align: center; + line-height: 80px; + background-color: #EEE; + color: #CCC; + &.question-mark:before { + content: "?"; + position: absolute; + left: 0; + width: 80px; + } } button { display: inline-block; - top: -33px; + top: -35px; } input[type=file] { position: absolute !important; diff --git a/client/views/avatar/avatar.html b/client/views/avatar/avatar.html index b5d82975e2bec..1aee7b90883e7 100644 --- a/client/views/avatar/avatar.html +++ b/client/views/avatar/avatar.html @@ -11,7 +11,7 @@ From 8e86b71297e793f33db815970f2f7215d76bf236 Mon Sep 17 00:00:00 2001 From: Marcelo Schmidt Date: Sun, 31 May 2015 18:59:08 -0300 Subject: [PATCH 08/10] Translations to avatar --- client/views/avatar/avatar.html | 10 +++++----- i18n/en.i18n.json | 7 +++++++ i18n/pt.i18n.json | 7 +++++++ 3 files changed, 19 insertions(+), 5 deletions(-) diff --git a/client/views/avatar/avatar.html b/client/views/avatar/avatar.html index 1aee7b90883e7..56b397299e588 100644 --- a/client/views/avatar/avatar.html +++ b/client/views/avatar/avatar.html @@ -3,7 +3,7 @@
- +
{{/if}} @@ -13,7 +13,7 @@
- +
{{/if}} @@ -21,7 +21,7 @@