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.

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

Add donation links #96

Open
wants to merge 9 commits into
base: master
Choose a base branch
from

Conversation

CylonicRaider
Copy link
Contributor

The modifications — aside from the static page footer spacing — remain invisible unless the HEIM_DONATION_URL environment variable is set appropriately (i.e. to https://patreon.com/euphoriachat for euphoria.io).

The branch is fully functioning and can be merged if its behavior is acceptable:

  • Links to the donation page are embedded into the page footer, and a more prominent button is displayed instead on the front page.
  • In rooms, a notice bar (not unlike the desktop notification one) appears when
    1. the page is loaded anew, and
    2. the user had posted a message in a previous session, and
    3. the popup has not been dismissed before.

Frontend tests pass.

Copy link
Member

@logan logan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is an excellent pull request. You figured out a lot of stuff and made it work. It looks really polished and I don't have any technical concerns.

@@ -660,6 +660,36 @@ iframe.js {
background: @brand-color;
}

&.donations {
background: @brand-color;
animation: rotate-color 30s linear infinite;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I find the color cycling a bit distracting, but my wife loves it. That's the extent of my user testing so far. Could you tweak the transition time from 30s to 180s?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Well... I'd say one is supposed to handle a notice swiftly... But sure.

margin-top: -50px;
height: 50px;

a {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This link looks better with font-weight: bold and color: #333 (or something like that).

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The pure black color could be considered a subtle form of highlighting... if the main text above were off-black. Will do.

@@ -304,6 +306,15 @@ export default React.createClass({
</div>}
{pmNotices.map(pm => <PMNotice key={pm.get('kind') + pm.get('id')} pmId={pm.get('id')} nick={pm.get('nick')} kind={pm.get('kind')} />) }
{this.state.update.get('ready') && <FastButton className="update-button" onClick={update.perform}><p>update ready<em>{Heim.isTouch ? 'tap' : 'click'} to reload</em></p></FastButton>}
{this.state.donations.eligible && this.state.donations.url && this.state.ui.notices.has('donations') && <div className="notice dark donations">
<div className="content">
<span className="title">euphoria maintenance and development is enabled by</span>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I find the mix of sentence and button in the notification to be confusing to parse when I first see it. The button calls my attention first, and then I read the label. Maybe "euphoria maintenance and development depends on you [support our patreon]"?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will do so.

Coded closely after the notification popup; one should probably dismiss
this one globally.
The URL has to be configured via the HEIM_DONATION_URL environment;
the notice will not show up at all otherwise.
- The HEIM_DONATION_URL variable was not properly propagated into the
  build.
- The donation store would race with the localStorage one for the
  latter's load event.
- The front page one gets bold text and a lighter color.
- The in-room one does not embed the button into the sentence, and the
  hue rotation is slower.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants