Problem/Motivation
OpenCollective currently publishes a number of HTML widgets. Even if not all of these will be available on Drupal.org, let's list them here. The discussion about how to allow/disallow these options will hopefully help us come up with architectural clarity.
Steps to reproduce
Proposed resolution
Text widget
This is somewhat unique to our module. Possibly provide an option to the formatter as to whether we want to add the target=_blank instead of baking it into the template?
<a href="https://opencollective.com/portland-drupal">OpenCollective: portland-drupal</a>
<a href="https://patreon.com/liberatr" target="_blank">Patreon: liberatr</a>
<a href="https://github.com/sponsors/liberatr" target="_blank">Github: liberatr</a>
<a href="https://example.com">https://example.com</a>
YAML:
open_collective: portland-drupal
patreon: liberatr
github: liberatr
custom: https://example.com
Donate Button
<script src="https://opencollective.com/:collectiveSlug/:verb/button.js" color="[white|blue]"></script>
YAML:
open_collective: webform
# if "embed" is not present, widget defaults to "button" if we are in "button" formatter
# if "slug" is not present, the single value is used
open_collective:
embed: button
# if "type" is not present, assume "button"
slug: funding-extensions
verb: donate
color: blue
# verb defaults to "donate"
# color defaults to "blue"
Image version
<a href="https://opencollective.com/:slug/:verb" target="_blank">
<img src="https://opencollective.com/:slug/:verb/button@2x.png?color=:color" width=300 />
</a>
YAML:
open_collective:
embed: image
slug: funding-extensions
verb: donate
color: blue
Show supporters & Sponsors
<script src="https://opencollective.com/:collectiveSlug/banner.js"></script>
YAML:
open_collective:
embed: banner
slug: drupal_gin
# It is possible to pass a json object describing css styles to this widget - we may want to consider a way for a site owner to specify this in a site-wide form.
Show Events
<script src="https://opencollective.com/:collectiveSlug/events.js" width="500"></script>
YAML:
open_collective:
embed: events
slug: portland-drupal
<script src="https://opencollective.com/:username/collectives.js?role=backer"></script>
YAML:
open_collective:
embed: collectives
username: jrockowitz
role: backer
# role defaults to backer
# role accepts: backer, admin, member, host
<iframe src="https://opencollective.com/embed/:collectiveSlug/donate" style="width: 100%; min-height: 100vh;"></iframe>
<iframe src="https://opencollective.com/embed/:collectiveSlug/contribute/:tierSlug" style="width: 100%; min-height: 100vh;"></iframe>
YAML:
open_collective:
embed: contribute
slug: realtimeseo
amount: 66.66
interval: month
platformTip: 3.34
skipStepDetails: true
# tier defaults to "donate"
open_collective:
embed: contribute
slug: mautic-conference-europe-4da0de72
tier: general-access-ticket-32898
Examples:
<iframe src="https://opencollective.com/realtimeseo/donate?amount=66.66&platformContribution=3.34&interval=month&skipStepDetails=true" style="width: 100%; min-height: 100vh;"></iframe>
<iframe src="https://opencollective.com/embed/mautic-conference-europe-4da0de72/contribute/general-access-ticket-32898" style="width: 100%; min-height: 100vh;"></iframe>
<a href="https://opencollective.com/:collectiveSlug"><img src="https://opencollective.com/:collectiveSlug/tiers/:roleSlug.svg?limit=30&button=false&avatarHeight=46&width=750"></a>
<a href="https://github.com/:collectiveSlug/:projectSlug/graphs/contributors"><img src="https://opencollective.com/:collectiveSlug/contributors.svg?width=890&button=false" /></a>
YAML:
open_collective:
embed: badge
slug: realtimeseo
role: backers
limit: 30
button: false
avatarHeight: 46
width: 750
height: 46
# role defaults to "backers"
# role accepts backers, contributors, individuals, organizations
# limit should be between 0 and 999
# limit defaults to 30
# width defaults to null
# height defaults to null
# button defaults to true
open_collective:
embed: badge
slug: devshop
role: contributors
open_collective:
embed: badge
slug: devshop
role: individuals
Organizations
Example:
Support this project with your organization. Your logo will show up here with a link to your website. <a href="https://opencollective.com/{{slug}}/contribute">Contribute</a>
<a href="https://opencollective.com/{{slug}}/organization/0/website"><img src="https://opencollective.com/{{slug}}/organization/0/avatar.svg"></a>
<a href="https://opencollective.com/{{slug}}/organization/1/website"><img src="https://opencollective.com/{{slug}}/organization/1/avatar.svg"></a>
<a href="https://opencollective.com/{{slug}}/organization/2/website"><img src="https://opencollective.com/{{slug}}/organization/2/avatar.svg"></a>
<a href="https://opencollective.com/{{slug}}/organization/3/website"><img src="https://opencollective.com/{{slug}}/organization/3/avatar.svg"></a>
<a href="https://opencollective.com/{{slug}}/organization/4/website"><img src="https://opencollective.com/{{slug}}/organization/4/avatar.svg"></a>
<a href="https://opencollective.com/{{slug}}/organization/5/website"><img src="https://opencollective.com/{{slug}}/organization/5/avatar.svg"></a>
YAML:
open_collective:
embed: organizations
slug: realtimeseo
limit: 10
# limit should be between 0 and 999
# limit should default to 10
# loop over the template for as many times as specified in "limit"
Remaining tasks
- Ensure all Yaml values are plain text, number, hyphen, underscore. May want to take the URL on output and validate it, or maybe for thie input run XSS::filter
- Implement Show supporters & Sponsors
- Implement Show Events
- Implement My Contributions
- Implement Contribution Flow
- For all of the above OpenCollective widgets, fall back to text formatter properly
- We need the system of implementing providers. This task may be worked in parallel, but it felt better to put this discussion on its own page.
- See
✨
Funding: Implement Providers for D9
Fixed
User interface changes
API changes
Data model changes