Advice or feature suggestions for a real-time progress bar theme component

Hi everyone!

I’m working on a progress bar theme component prototype.

The initial purpose was to have a donations progress bar for users to see on my forum since the servers’ fees are paid by our users, via my ko-fi.com account.

Each time a ko-fi donation is made, ko-fi sends a request to a PHP script I made, which triggers a request to Discourse to update the current amount setting.

The PHP script part isn’t directly related to the component, and I’d like a component that could be used for many other purposes.

I don’t have the knowledge to create an elaborate component, but I think it could interest some other people here, so if you think of interesting features, or know code better than me and think could be made better and more efficient, feel free to participate :slight_smile:

Here’s what it currently looks like:

The repo: GitHub - Canapin/Discourse-custom-progress-bar: Adds a progress bar below Discourse's header that can serve various purposes.

What we can do:

  • Adds HTML on top or below the progress bar

  • Change the component width and progress bar height

  • The progress bar as well as the numbers are set via CSS.
    Numbers use a content CSS property because I didn’t know how to update them in real time otherwise.

What I’d like to add:

  • Automatically disable or hide the component when the amount is reached

  • Descriptions for each setting

  • I feel the code isn’t “Discourse coding style”. It doesn’t use anything from Discourse. I don’t mean it should, but maybe it could be a cleaner way to do it as well as benefit from Discourse’s existing methods for some current or future features.


If you’re interested in such a component, please feel free to share whatever you have to say about it :slight_smile:

2 Likes