Skip to content

Commit

Permalink
deploy it on vercel #8
Browse files Browse the repository at this point in the history
  • Loading branch information
endel committed Oct 24, 2020
1 parent 70cad93 commit 0bce843
Show file tree
Hide file tree
Showing 8 changed files with 905 additions and 22 deletions.
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1 +1,3 @@
node_modules

.vercel
26 changes: 9 additions & 17 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,33 +1,25 @@
# October 2020 - UPDATE

- There is an alternative way to display the amount of patrons on your Patreon campaign [described here](https://github.com/endel/shieldsio-patreon/issues/8#issuecomment-700144629).
- I've turned off the `https://shieldsio-patreon.herokuapp.com` endpoint.
- If you'd like to continue using the endpoint implemented on this repository, click the link below to deploy it on your Heroku account, or deploy it on your own VPS server.

<a href="https://heroku.com/deploy?template=https://github.com/endel/shieldsio-patreon">
<img src="https://www.herokucdn.com/deploy/button.svg" alt="Deploy">
</a>

# shields.io for Patreon <a href="https://patreon.com/endel"><img src="https://img.shields.io/badge/dynamic/json?logo=patreon&style=for-the-badge&color=%23e85b46&label=Patreon&query=data.attributes.patron_count&suffix=%20supporters&url=https%3A%2F%2Fwww.patreon.com%2Fapi%2Fcampaigns%2F365642" /></a>
# shields.io for Patreon <a href="https://patreon.com/endel"><img src="https://img.shields.io/endpoint.svg?url=https%3A%2F%2Fshieldsio-patreon.vercel.app%2Fapi%3Fusername%3Dendel%26type%3Dpatrons&style=for-the-badge" /></a>

Custom endpoint to allow displaying Patreon's number of patrons or amount of pledges. It uses [shields.io's Endpoint feature](https://shields.io/#/endpoint).

[Use the Patreon Shields.io badge generator here](https://shieldsio-patreon.vercel.app/)

## Examples

Show number of patrons:

- Endpoint URL: `https://shieldsio-patreon.herokuapp.com/endel`
- Image SRC: `https://img.shields.io/endpoint.svg?url=https%3A%2F%2Fshieldsio-patreon.herokuapp.com%2Fendel&style=for-the-badge`
- Endpoint URL: `https://shieldsio-patreon.vercel.app/api/?username=endel&type=patrons`
- Image SRC: `https://img.shields.io/endpoint.svg?url=https%3A%2F%2Fshieldsio-patreon.vercel.app%2Fapi%3Fusername%3Dendel%26type%3Dpatrons&style=for-the-badge`

<a href="https://patreon.com/endel"><img src="preview/patrons.svg?raw=1" /> </a>
<a href="https://patreon.com/endel"><img src="https://img.shields.io/endpoint.svg?url=https%3A%2F%2Fshieldsio-patreon.vercel.app%2Fapi%3Fusername%3Dendel%26type%3Dpatrons&style=for-the-badge" /> </a>

Show pledges per month:

- Endpoint URL: `https://shieldsio-patreon.herokuapp.com/endel/pledges`
- Image SRC: `https://img.shields.io/endpoint.svg?url=https%3A%2F%2Fshieldsio-patreon.herokuapp.com%2Fendel%2Fpledgesssss&style=for-the-badge`
- Endpoint URL: `https://shieldsio-patreon.vercel.app/api/?username=endel&type=pledges`
- Image SRC: `https://img.shields.io/endpoint.svg?url=https%3A%2F%2Fshieldsio-patreon.vercel.app%2Fapi%3Fusername%3Dendel%26type%3Dpledges&style=for-the-badge`


<a href="https://patreon.com/endel"><img src="preview/pledges.svg?raw=1" /> </a>
<a href="https://patreon.com/endel"><img src="https://img.shields.io/endpoint.svg?url=https%3A%2F%2Fshieldsio-patreon.vercel.app%2Fapi%3Fusername%3Dendel%26type%3Dpledges&style=for-the-badge" /> </a>

## License

Expand Down
32 changes: 32 additions & 0 deletions api/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
const http = require('http');
const httpie = require('httpie');
const JSDOM = require('jsdom').JSDOM;

module.exports = async (request, response) => {
const username = request.query.username;
const type = request.query.type;
const suffix = request.query.suffix;

if (!username) {
return response
.status(500)
.send({ error: "'username' must be set" });
}

const { data } = await httpie.get('https://patreon.com/' + username);
const { document } = (new JSDOM(data)).window;

const message = (type === "pledges")
? document.querySelector('[data-tag="CampaignPatronEarningStats-earnings"] h2').innerHTML + (suffix || "/mo")
: document.querySelector('[data-tag="CampaignPatronEarningStats-patron-count"] h2').innerHTML + " " + (suffix || "patrons");

response.send({
schemaVersion: 1,
label: "patreon",
namedLogo: "patreon",
message: message,
color: "ff5441",
cacheSeconds: 60 * 60 * 8 // 8 hours
});
};

54 changes: 54 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
<html>
<title>shields.io patreon badge</title>
<head>
</head>
<body>
<h1><a href="https://github.com/endel/shieldsio-patreon">shieldsio-patreon</a></h1>
<p>
Custom endpoint to allow displaying Patreon's number of patrons or amount of pledges.
</p>

<input id="username" name="username" placeholder="username" value="endel" onchange="rebuild();" />
<br />

<label for="type_pledges">Show pledges $</label>
<input id="type_pledges" name="type" type="radio" value="pledges" onchange="rebuild();">

<label for="type_patrons">Show amount of patrons</label>
<input id="type_patrons" name="type" type="radio" value="patrons" checked="checked" onchange="rebuild();">
<input name="suffix" placeholder="suffix (optional)" value="" onchange="rebuild();"/>

<div>
<h2>shields.io endpoint / preview</h2>
<img id="preview" src="" alt="preview" />

<br />
<h3>Markdown image</h3>
<textarea id="markdown" cols="60" rows="6"></textarea>

<p>You may override some configurations for this badge. Check out the <a href="https://shields.io/#/endpoint">shields.io's Endpoint feature</a> documentation.</p>
</div>

<script type="text/javascript">
function rebuild() {
var img = document.querySelector('img#preview');
var textarea = document.querySelector('textarea#markdown');
img.src = "https://img.shields.io/badge/%20loading-brightgreen.svg?style=for-the-badge&colorB=000000";

var username = document.querySelector('input[name=username]').value;
var type = document.querySelector('input[type=radio]:checked').value;
var suffix = document.querySelector('input[name=suffix]').value;

var endpointUrl = `https://shieldsio-patreon.vercel.app/api?username=${username}&type=${type}`;
if (suffix) { endpointUrl += `&suffix=${encodeURIComponent(suffix)}`; }

var imageSrc = `https://img.shields.io/endpoint.svg?url=${encodeURIComponent(endpointUrl)}&style=for-the-badge`;
img.src = imageSrc;
textarea.innerHTML = `[![Support me on Patreon](${imageSrc})](https://patreon.com/${username})`;
}

rebuild();
</script>

</body>
</html>
Loading

1 comment on commit 0bce843

@vercel
Copy link

@vercel vercel bot commented on 0bce843 Oct 24, 2020

Choose a reason for hiding this comment

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

Please sign in to comment.