Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Share avatar #4236

Merged
merged 8 commits into from
Nov 12, 2014
Merged

Share avatar #4236

merged 8 commits into from
Nov 12, 2014

Conversation

lefnire
Copy link
Contributor

@lefnire lefnire commented Nov 12, 2014

Adds ability to share your avatar on social networks. A "Share" button appears top-right when hovering over your avatar:

screen shot 2014-11-12 at 2 29 51 pm

It includes a download link which simply downloads an image of your avatar (rather, redirects to the s3 link from which you can download). When you click share on the social networks, the link will redirect to /static/front#?memberId=XXX which gives you a modal of the avatar:

modal

There are a few missing bits, but most is there. TODO:

  • When the user is logged into Addthis, it seems the selected services aren't respected. This includes the Download link. IE, if they're logged in they see the Addthis's default batch of social links, minus the download link
  • Some pieces on /static/front#?memberId=XXX are missing - pet count, memberSince, etc. This because those missing bits are in controllers/services from the main app which are too clunky to include into the static.js app. I've tried hand-selecting a few, but they're all so interdependent it causes issues. We can forgo those pieces for now.

Technical details: the download link requires S3 credentials, as well as pageres which depends on PhantomJS. To get that working, you'll need to install PhantomJS locally. To get it working on Heroku, follow these instructions (take note of the follow-up comment)

@deilann
Copy link
Contributor

deilann commented Nov 12, 2014

Total amount of XP needed to level up is also missing, at least from the
beta code I saw.

On Wed, Nov 12, 2014 at 1:35 PM, Tyler Renelle notifications@github.com
wrote:

Adds ability to share your avatar on social networks. A "Share" button
appears top-right when hovering over your avatar:

[image: screen shot 2014-11-12 at 2 29 51 pm]
https://cloud.githubusercontent.com/assets/195202/5018984/8a601f46-6a78-11e4-8778-ff40e07da785.png

It includes a download link which simply downloads an image of your avatar
(rather, redirects to the s3 link from which you can download). When you
click share on the social networks, the link will redirect to
/static/front#?memberId=XXX which gives you a modal of the avatar:

[image: modal]
https://camo.githubusercontent.com/f75b8a7062ca0f0a95ad8fc79b04743195d44f4f/687474703a2f2f692e6779617a6f2e636f6d2f37663866343039663636646134353931336437363831313633303461333335302e706e67

There are a few missing bits, but most is there. TODO:

  • When the user is logged into Addthis, it seems the selected services
    https://github.com/HabitRPG/habitrpg/compare/share-avatar?expand=1#diff-b15b92fe8a80bfe66aec828f1d8f71ceR50
    aren't respected. This includes the Download link. IE, if they're logged in
    they see the Addthis's default batch of social links, minus the download
    link
  • Some pieces on /static/front#?memberId=XXX are missing - pet count,
    memberSince, etc. This because those missing bits are in
    controllers/services from the main app which are too clunky to include into
    the static.js app. I've tried hand-selecting a few, but they're all so
    interdependent it causes issues. We can forgo those pieces for now.

You can merge this Pull Request by running

git pull https://github.com/HabitRPG/habitrpg share-avatar

Or view, comment on, or merge it at:

#4236
Commit Summary

  • feat(sharing): add ability to share avatar. adds static page with
    avatar
  • feat(sharing): directly stream avatar screenshot to aws
  • feat(sharing): move avatar-sharing to herobox, use addthis instead of
  • feat(sharing): implement caching of avatar img. img as image/png
    instead
  • feat(sharing): add download link
  • feat(sharing): screw it, social links + img + text aint working, just
  • fix(sharing): add phantomjs buildpack to heroku (for pageres),
    proper use of nested nconf keys

File Changes

Patch Links:

—
Reply to this email directly or view it on GitHub
#4236.

lefnire added a commit that referenced this pull request Nov 12, 2014
@lefnire
Merge pull request #4236 from HabitRPG/share-avatar
114cbe2 
Share avatar
@lefnire lefnire merged commit 114cbe2 into develop Nov 12, 2014
@lefnire lefnire deleted the share-avatar branch November 12, 2014 21:42
@paglias
Copy link
Contributor

paglias commented Nov 12, 2014

From mobile. Just a quick note abiut downloading: html5 allow for direct
download using a link with a 'download' attribute like
Il 12/nov/2014 22:42 "Tyler Renelle" notifications@github.com ha scritto:

Merged #4236 #4236.

—
Reply to this email directly or view it on GitHub
#4236 (comment).

@lefnire
Copy link
Contributor Author

lefnire commented Nov 12, 2014

@paglias sorry, I'm a bit confused on that comment. could you elaborate? (can wait till you're at a keyboard if you want)

@paglias
Copy link
Contributor

paglias commented Nov 12, 2014

Sorry it was written a bit fast. If you add the 'download' attribute to the
link it will download the avatar directly without being redirected to s3,
you'll get it download without changing page
Il 12/nov/2014 22:46 "Tyler Renelle" notifications@github.com ha scritto:

@paglias https://github.com/paglias sorry, I'm a bit confused on that
comment. could you elaborate? (can wait till you're at a keyboard if you
want)

—
Reply to this email directly or view it on GitHub
#4236 (comment).

@paglias
Copy link
Contributor

paglias commented Nov 12, 2014

See http://demo.hongkiat.com/html5-download-attribute/ for an example
Il 12/nov/2014 22:48 "Matteo Pagliazzi" matteopagliazzi@gmail.com ha
scritto:

Sorry it was written a bit fast. If you add the 'download' attribute to
the link it will download the avatar directly without being redirected to
s3, you'll get it download without changing page
Il 12/nov/2014 22:46 "Tyler Renelle" notifications@github.com ha
scritto:

@paglias https://github.com/paglias sorry, I'm a bit confused on that
comment. could you elaborate? (can wait till you're at a keyboard if you
want)

—
Reply to this email directly or view it on GitHub
#4236 (comment).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@lefnire @deilann @paglias