bengott / meteor-avatar Goto Github PK

Others helpers like AutoForm use the same helper argument name that the corresponding HTML tag attribute. So I suggest that we use:

{{> avatar user=user class="circle")

Plus I think the class avatar should be added automatically.

If you agree with these two changes, I can propose a PR.

Is the different accounts needs to be merged before ? I mean I can login with either google of fb of twitter or password, but they are all different user in the eyes of the app. This one still managed to find all avatars ? Is it This magical ?

suggestion : put an example in the readme, like in usage but with real data. Currently trying to play with it!

I've just pulled the latest version and my site design it now broken because you changed the size of the standard avatar from 40px to 50px.

Either this need to be fixed in stone, or else user controllable.

Hey there,

When signing in with twitter, there are two attributes returned: profile_image_url and profile_image_url_https

Loading the non-https version when using SSL means that you lose the beautiful green lock in the webbrowser as you are loading some content over an insecure connection.

I'll fork the project and start working on a fix.

Elliott

I've had some preliminary success integrating particle4dev:upload-avatar into a test project. For this project, however, I would need to modify it a fair amount in order to achieve what I want. The method of saving the image directly on the user object as a base64-encoded string does work though.
@particle4dev: Would you be interested in collaborating/contributing on this?

@Kestanous had suggested using vsivsi:file-collection, which is another file upload option. It has some other nice features like HTTP interfaces and resumable uploads too. Dunno if those features are explicitly necessary, but they might be nice to have.

Anyone have opinions on this?

Just encountered this error for the first time today:

Exception in template helper: TypeError: Cannot read property 'trim' of undefined
    at Object.Gravatar.cleanString (http://localhost:3000/packages/jparker_gravatar.js?7c397392549dc8d918d0cea6fc18378e402010e9:46:16)
    at Object.Gravatar.isHash (http://localhost:3000/packages/jparker_gravatar.js?7c397392549dc8d918d0cea6fc18378e402010e9:58:38)
    at Object.Gravatar.imageUrl (http://localhost:3000/packages/jparker_gravatar.js?7c397392549dc8d918d0cea6fc18378e402010e9:92:12)
    at getGravatarUrl (http://localhost:3000/packages/bengott_avatar.js?e9dfb040f26355cd260ee0d02b6836325e5b0213:328:19)
    at Object.Avatar.getUrl (http://localhost:3000/packages/bengott_avatar.js?e9dfb040f26355cd260ee0d02b6836325e5b0213:268:15)
    at Object.Template.avatar.helpers.imageUrl (http://localhost:3000/packages/bengott_avatar.js?e9dfb040f26355cd260ee0d02b6836325e5b0213:117:19)
    at bindDataContext (http://localhost:3000/packages/blaze.js?77c0809654ee3a10dcd5a4f961fb1437e7957d33:2693:16)
    at Blaze._wrapCatchingExceptions (http://localhost:3000/packages/blaze.js?77c0809654ee3a10dcd5a4f961fb1437e7957d33:1602:16)
    at Spacebars.call (http://localhost:3000/packages/spacebars.js?3c496d2950151d744a8574297b46d2763a123bdf:169:18)
    at Spacebars.mustacheImpl (http://localhost:3000/packages/spacebars.js?3c496d2950151d744a8574297b46d2763a123bdf:106:25)

Not sure why…

Maybe I missed it, but it would be nice to have a section in the docs about which user properties are required for the package to work, in case you're trying not to publish the whole user object?

not sure if this is Meteor or something. but it seems Meteor auto updated me, which sucks, as it seemed to have broken a bunch of things. can't find any workaround...but really like using the avatar packages.

While selecting package versions:
error: Conflict: Constraint [email protected] || 1.0.7 is not satisfied by stylus 2.511.1.
Constraints on package "stylus":

• stylus@=2.511.1 <- top level
• [email protected] || 1.0.7 <- bengott:avatar 0.7.6

Hi,

If you think it can help, I just updated the jparker:gravatar package which now handle being passed a hash instead of an email. I've did it in a transparent way for the user. You can pass an email or a hash, the package takes care of figuring out what to do with it.

Thanks for your package, it looks promising !

PS: links to github user account in your readme are broken (it only works in issue comments, not in markdown file (see Github API docs for details)

Im getting this weird issue with 0.6.0

http://www.gravatar.com/avatar/00000000000000000000000000000000?default=404&size=200

in the logs,

with default setup :

  Avatar.options =
    defaultImageUrl: "user-default.png"
    gravatarDefault: "user-default.png"

when specifying defaultType : image

  Avatar.options =
    defaultType: 'image'
    defaultImageUrl: "user-default.png"
    gravatarDefault: "user-default.png"

i get http://i0.wp.com/localhost/user-default.png

i just have no idea of where this could be coming from! thanks! :)

Just testing out the latest version of the package, but it seems some avatars are a bit broken?

See http://meta.telesc.pe/

Hey Ben!
Looks like an awesome package!!

It would be cool to have a default fallback image call in your helper in case none of the services provide one for the user ( in the case for example he signs up with email and doesnt have a gravatar)

for example:
{{> avatar fallback="default-img.png"}}

what do you think?

Hi There,

I'm not 100% clear on the emailHashProperty option, if its the right thing for what I'm after with this package or if what I want to do is possible here.

I'd like to not publish the user emails, (avatars stopped working of course which is what pointed me at this option). I do set a profile.primaryemail property that is available and is what I'd ideally like it to reference. Is this possible or have I misunderstood this option?

Thanks and regards

Paul

I'm just wondering if you have a timescale for allowing users to provide their own avatars?

Requesting GitHub avatars using HTTP urls give an error (unless you run a plugin such as HTTPS Everywhere):
http://avatars.githubusercontent.com/jorisbontje?s=200

$ curl -v "http://avatars.githubusercontent.com/moncrey?s=200"
...
< HTTP/1.1 404 Not Found

The HTTPS urls work okay:
https://avatars.githubusercontent.com/jorisbontje?s=200

$ curl -v "https://avatars.githubusercontent.com/moncrey?s=200"
...
< HTTP/1.1 200 OK

avatars are read clientside, so a client should have an access to user.services[servicename][picture]
since every service has it's own picture-url-detection, it would be great to have those properties listed (so we could use em in publications)

README is a good place, imho
(idk, maybe in some public property of the package also)

P.S. Thanks for the package :)

How about making the gravatar package a weak dependency and only run/use the gravatar logic of this package if Package['jparker:gravatar'] isn't undefined.

Just a thought which will make gravatar opt-in.

On the Telescope homepage, avatars are getting the avatar-hide-initials class instead of avatar-hide-image.

For some reason they're working fine on post pages though.

See: http://meta.telesc.pe/ vs http://meta.telesc.pe/posts/3hDwb4D9HQntws4ey

Also, it seems like this started happening with the recent 1.1 update.

After adding the avatar package, I am getting the following error.

Is it possible to know what URL's to add to the Browser Policy Allow Origin??

Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' 'unsafe-inline'

Exception in template helper: EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' http://.bootstrapcdn.com http://.googleapis.com http://.gstatic.com https://.bootstrapcdn.com https://.googleapis.com https://.gstatic.com".

If a service image uses a 302 redirect then this will trigger the onerror handler in Chrome, causing the image to be hidden.

Facebook images work this way, tested in chrome 43.0.2357 linux and mac and chrome 45 linux.

Can workaround by suppressing the error css

.avatar-image {
  display: inline !important;
}

That's not ideal though as genuinely broken links will now not be handled.

I'm attempting to access the Avatar.getUrl function when I populate my database on the server's Meteor.startup, but I'm getting a "Cannot call method 'getUrl' of undefined" error. Is the Avatar object only accessible client side? Any reason you can think of why this wouldn't be possible? Only thing I can think of is that the export.js file isn't in a lib directly, so it hasn't been loaded/defined yet when the Meteor.startup method is running.

I've tried to define Avatar.options in a directory accessible by both client & server, and get the same message. Is it possible to make it so that the Avatar object and helper methods can be used server side as well?

Hey there. Really appreciate all the work on this package. It's great! I've got a telescope-based app and am showing upvoter's avatars for each post, but it seems to only display the first and the last. Really strange:

Yet, if I view my /all-users page, they all display correctly and then when I return to the post list, I can see them again.

Any ideas of what might be going on here? My repo is here if you have a chance to look into it. It's probably something funky that I did, but am at a loss. Any help would be much appreciated. Thanks man

I understand that Meteor automatically caches static resources, but is there anyway to cache avatars or is that up to Gravatar's cache poilcy?

If I got it right, this property should allow to specify where in the user's object we store some URL which leads to any pic.

Something like this I suppose:

customImageProperty: "services.someOtherField.fieldWIthUrlAsValue"

Is that right?

If yes, then can someone give a small example of how to use it, because it doesn't work like this for me. Yes I do publish and subscribe those fields.

If not then can someone clarify me of what that property is and is it somehow possible to tell the avatar package to use a custom (not twitter or facebook, etc.) url for a pic from a user's object.

If the defaultAvatarUrl option is not specified, trying to call indexOf in the getUrl function will throw an exception. Also, I noticed that the default.png file that ships with the package is never used anywhere. You could potentially solve the indexOf error by using the path to default.png as a fallback for default url being undefined, but that raises the issue of whether you would prefer to show default.png or the user initials. Since the packaged default.png is in most cases going to be successfully loaded, using it as the fallback results in the initials being almost never shown.

Furthermore, I can't seem to get the initials to show at all. I tried providing no email hash and no default image, but the initials still didn't show up. The avatar just showed an image tag with no src, and the initials were hidden.

I would like to use {{> avatar }} while rendering templates in the server side. I am using meteor-handlebars-server.

When I try to render myTemplate.handlebars with avatar partial, I get:

Error: The partial avatar could not be found

I tried to make myTemplate.js in the server directory like this:

Handlebars.templates.myTemplate({}, {
  avatar: Handlebars.templates.avatar
});

But it didn't do anything. Any suggestions?

Provide UI that allows user to select avatar image from all linked services (twitter, facebook, etc.). Custom (uploaded) image could also be handled from within this UI workflow. I'll work on some mockups for this...

Check the logic here:

Whether or not you set a value for gravatarDefault value, it is set to "404". And then at L122, the defaultAvatarUrl is not used if something is set for gravatarDefault.

When I run my app in my localmachine the avatar package picks up the users facebook and or google avatar, however when I run the app on my android phone, the avatar only picks up the initials of the user. What could be the problem?

When changing the size of the avatar, it seems like having a fixed value for the line-height isn't ideal:

https://github.com/bengott/meteor-avatar/blob/master/template/avatar.styl#L17

I could submit a PR to try and make sizing more flexible?

Hi, great package!

Avatar does not seem to pickup any settings.

I have the following in a /client folder :

Meteor.startup(function () {
    Avatar.options = {
        //emailHashProperty: 'email_hash',
        defaultType: "initials",
        defaultAvatarUrl: '/assets/img/avatar.png',
        gravatarDefault: 'identicon',
        //serverBaseUrl: 'http://example.com'
    };
});

My avatars default to images.
Also I see a 404s in the console:
9342a3f23c9501393019a3236e2cbbda:1 GET http://www.gravatar.com/avatar/9342a3f23c9501393019a3236e2cbbda?default=404&size=200 404 (Not Found)

Any ideas?

In the code snippet the parameters use for the type is "shape" (shape="circle")

but the parameters is now type (type="circle")

using this package with materializecss i get a namespacing problems with .avatar classes

http://materializecss.com/collections.html#!

maybe the solution would be to namespace your classes mavatar or something.

what do you think?

I'm adding a bunch of accessibility fixes to Telescope, which appears to use this avatars package. Unfortunately, since no alt attribute is specified on avatar images, and no option is available to specify them, they are read by screen readers as strings of random characters.

I'd like to ask that an alt= option be added to the helper. I'd also request that "Avatar" be the default alt value if none is specified, since there should always be an accessible fallback regardless of whether the user configures one. Given that Telescope uses avatars heavily, adding this fallback will go a long way to making its interface more screen reader friendly.

Thanks!

I've got a page with several facebook avatars (all of the same user). From refresh to refresh, I get different results. Usually they all show up, or they all don't, but sometimes I get a mix. In the debug tool's element browser, if I delete the SPAN associated with the initials, and remove the display: none property of the <img> tag, the image shows fine. I'm not sure what's causing the onerror to trip. I don't see any errors in the network tab of the debug tools.

Is this related to any currently-open issues? Or a new issue?

Avatar.options = {
  fallbackType: "default image",
  defaultImageUrl: "img/avatar.png"
};

renders to

GET http://i2.wp.com/localhost/img/avatar.png 404 (Not Found)

It seems the detection of SSL doesn't seem to be working (https://github.com/bengott/meteor-avatar/blob/master/export.js#L83), because I get a bunch of errors about avatar images not being secured...

You can see it here on crater: https://crater.io/

Could you please also add linked-in support?

Is there an option to disable gravatar at all? E.g. if one wants to use service's img or initials only.
Didn't find such option in readme...

After looking at code, it seems like initials would be put only after getting an image for gravatar fails, which is bad, imho.

I'm still encountering that error from place to place. For example:

http://meta.telesc.pe/category/feature-request

I haven't looked into it too much yet, but could it be because the avatar helper is not finding the correct user? Maybe the helper could fail silently in those cases instead of triggering the error?

Using a pretty vanilla setup with accounts and accounts-facebook. I already had my account authenticated and installed this avatar package. Assumed i can add {{> avatar user=this shape="circle"}} right on any page where I am logged in and it would work but all i see is a grey circle always. Doesnt seem to matter what i set the defaults to? Any help?

I emailed, Slack'd, and mentioned @bengott multiple times in the last couple months but haven't heard back from him a single time. In fact, I'm a bit worried that something might've happened to him. Or maybe he just decided to quit the tech industry altogether?

In the meantime, I've been trying take care of this package but I just don't have much free time since I already have to maintain Telescope. So I think it'd be great if somebody else was willing to maintain it moving forward.

Since the package has already been renamed to utilities:avatar from bengott:avatar, a change of maintainer would not require any change on the end user's part (I would just give you access to the utilities organization).

We would probably have to change repos though, which would mean losing the PRs and issues associated with this repo, which is why I haven't done it yet.

Anyway, I'm curious to get your thoughts on this.

@rodrigok @CarlQLange @GerryR @zimme @indymike @raiyankamal @TheAncientGoat @jorisbontje @em0ney @cwohlman @kevohagan

In here:

We'd need to use something like https://gist.github.com/jasonrhodes/2321581

I don't know if there's an easy way to fix this, but I'm getting a lot of 404s for users who don't have gravatars:

Any idea what we could do to fix this?

Is it possible to set default options in the configuration for things like shape, textColor, bgColor and size?

If not, would it be possible to add this ability? I want all of my avatars to be rounded, and have a specific text and background color, it's a bit of a pain (and not good if I want to change one of the values in the future) to add it every time the template is used.

Current code can only detect relative paths that start with '/'
This will not stand, man...

https://github.com/bengott/meteor-avatar/blob/master/export.js#L29-L32

// If it's a relative path, complete the URL (prepend the origin)
if (defaultUrl.charAt(0) === '/' && defaultUrl.charAt(1) !== '/') {
  defaultUrl = location.origin + defaultUrl;
}

I've noticed this slow-down issue ever since using the avatar package in Telescope. Would be awesome to fix it!

https://www.youtube.com/watch?v=AkSoLAFXrvE

/cc @Slava