-
-
Notifications
You must be signed in to change notification settings - Fork 3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fetch sponsors at build time, show ALL non-skeevy sponsors; closes #4271
(#4272) * Show all sponsors on site - change ordering: sponsors, then backers - blacklist bad actors - rename `default.html` to `default.liquid`, because it's a Liquid template. - fiddles with the CSS a bit - do not attempt to display a link if there is no website * use smaller imgs for backers * Fetch all open collective sponsor images to save their dimensions * Reworked avatars. LEss reflows due to image dimensions. Smoother loading animation that doesn't wait for all images. Progressive enhanced * Add standardised lazy loading to all images * Set height on badges to avoid page reflows * Add node version specification in .nvmrc to get netlify up to date * Move avatars javascript to external file for better development experience Co-authored-by: Peter Müller <[email protected]>
- Loading branch information
Showing
13 changed files
with
1,302 additions
and
1,152 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1 @@ | ||
| 12 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| [ | ||
| "cheap-writing-service", | ||
| "emailmarketingservices-io", | ||
| "device-tricks1", | ||
| "my-true-media", | ||
| "yiannakis-ttafounas-ttafounas", | ||
| "writerseperhour", | ||
| "casinotop-com", | ||
| "casino-topp", | ||
| "casinoutanreg", | ||
| "supercazino-ro", | ||
| "igor-noskov", | ||
| "blue-link-seo", | ||
| "casino-online", | ||
| "domywriting", | ||
| "writemypaper4me", | ||
| "trust-my-paper", | ||
| "seowebsitetraffic-net", | ||
| "pfannen-test", | ||
| "mochajs" | ||
| ] |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,133 @@ | ||
| #!/usr/bin/env node | ||
| 'use strict'; | ||
|
|
||
| const debug = require('debug')('mocha:docs:data:supporters'); | ||
| const needle = require('needle'); | ||
| const imageSize = require('image-size'); | ||
| const blacklist = new Set(require('./blacklist.json')); | ||
|
|
||
| const API_ENDPOINT = 'https://api.opencollective.com/graphql/v2'; | ||
|
|
||
| const query = `query account($limit: Int, $offset: Int, $slug: String) { | ||
| account(slug: $slug) { | ||
| orders(limit: $limit, offset: $offset) { | ||
| limit | ||
| offset | ||
| totalCount | ||
| nodes { | ||
| fromAccount { | ||
| name | ||
| slug | ||
| website | ||
| imgUrlMed: imageUrl(height:64) | ||
| imgUrlSmall: imageUrl(height:32) | ||
| type | ||
| } | ||
| totalDonations { | ||
| value | ||
| } | ||
| createdAt | ||
| } | ||
| } | ||
| } | ||
| }`; | ||
|
|
||
| const graphqlPageSize = 1000; | ||
|
|
||
| const nodeToSupporter = node => ({ | ||
| name: node.fromAccount.name, | ||
| slug: node.fromAccount.slug, | ||
| website: node.fromAccount.website, | ||
| imgUrlMed: node.fromAccount.imgUrlMed, | ||
| imgUrlSmall: node.fromAccount.imgUrlSmall, | ||
| firstDonation: node.createdAt, | ||
| totalDonations: node.totalDonations.value * 100, | ||
| type: node.fromAccount.type | ||
| }); | ||
|
|
||
| /** | ||
| * Retrieves donation data from OC | ||
| * | ||
| * Handles pagination | ||
| * @param {string} slug - Collective slug to get donation data from | ||
| * @returns {Promise<Object[]>} Array of raw donation data | ||
| */ | ||
| const getAllOrders = async (slug = 'mochajs') => { | ||
| let allOrders = []; | ||
| const variables = {limit: graphqlPageSize, offset: 0, slug}; | ||
|
|
||
| // Handling pagination if necessary (2 pages for ~1400 results in May 2019) | ||
| while (true) { | ||
| const result = await needle( | ||
| 'post', | ||
| API_ENDPOINT, | ||
| {query, variables}, | ||
| {json: true} | ||
| ); | ||
| const orders = result.body.data.account.orders.nodes; | ||
| allOrders = [...allOrders, ...orders]; | ||
| variables.offset += graphqlPageSize; | ||
| if (orders.length < graphqlPageSize) { | ||
| debug('retrieved %d orders', allOrders.length); | ||
| return allOrders; | ||
| } else { | ||
| debug( | ||
| 'loading page %d of orders...', | ||
| Math.floor(variables.offset / graphqlPageSize) | ||
| ); | ||
| } | ||
| } | ||
| }; | ||
|
|
||
| module.exports = async () => { | ||
| const orders = await getAllOrders(); | ||
| // Deduplicating supporters with multiple orders | ||
| const uniqueSupporters = new Map(); | ||
|
|
||
| const supporters = orders | ||
| .map(nodeToSupporter) | ||
| .filter(supporter => !blacklist.has(supporter.slug)) | ||
| .reduce((supporters, supporter) => { | ||
| if (uniqueSupporters.has(supporter.slug)) { | ||
| // aggregate donation totals | ||
| uniqueSupporters.get(supporter.slug).totalDonations += | ||
| supporter.totalDonations; | ||
| return supporters; | ||
| } | ||
| uniqueSupporters.set(supporter.slug, supporter); | ||
| return [...supporters, supporter]; | ||
| }, []) | ||
| .sort((a, b) => b.totalDonations - a.totalDonations) | ||
| .reduce( | ||
| (supporters, supporter) => { | ||
| if (supporter.type === 'INDIVIDUAL') { | ||
| supporters.backers.push({ | ||
| ...supporter, | ||
| avatar: supporter.imgUrlSmall | ||
| }); | ||
| } else { | ||
| supporters.sponsors.push({...supporter, avatar: supporter.imgUrlMed}); | ||
| } | ||
| return supporters; | ||
| }, | ||
| {sponsors: [], backers: []} | ||
| ); | ||
|
|
||
| // Fetch images for sponsors and save their image dimensions | ||
| await Promise.all( | ||
| supporters.sponsors.map(async sponsor => { | ||
| for await (const chunk of needle.get(sponsor.avatar)) { | ||
| sponsor.dimensions = imageSize(chunk); | ||
| break; | ||
| } | ||
| }) | ||
| ); | ||
|
|
||
| debug( | ||
| 'found %d valid backers and %d valid sponsors (%d total)', | ||
| supporters.backers.length, | ||
| supporters.sponsors.length, | ||
| supporters.backers.length + supporters.sponsors.length | ||
| ); | ||
| return supporters; | ||
| }; |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| ## Sponsors | ||
|
|
||
| Use Mocha at Work? Ask your manager or marketing team if they'd help [support](https://opencollective.com/mochajs#support) our project. Your company's logo will also be displayed on [npmjs.com](http://npmjs.com/package/mocha) and our [GitHub repository](https://github.com/mochajs/mocha#sponsors). | ||
|
|
||
| <ul class="image-list" id="sponsors"> | ||
| {%- for supporter in supporters.sponsors -%} | ||
| <li> | ||
| {%- if supporter.website -%} | ||
| <a href="{{ supporter.website }}" target="_blank" rel="noopener" title="{{ supporter.name }}"> | ||
| {%- endif -%} | ||
| <img src="{{ supporter.avatar }}" width="{{ supporter.dimensions.width }}" height="{{ supporter.dimensions.height }}" alt="{{ supporter.name }}" /> | ||
| {%- if supporter.website -%} | ||
| </a> | ||
| {%- endif -%} | ||
| </li> | ||
| {%- endfor -%} | ||
| </ul> | ||
|
|
||
| ## Backers | ||
|
|
||
| Find Mocha helpful? Become a [backer](https://opencollective.com/mochajs#support) and support Mocha with a monthly donation. | ||
|
|
||
| <ul class="image-list faded-images" id="backers"> | ||
| {%- for supporter in supporters.backers -%} | ||
| <li> | ||
| {%- if supporter.website -%} | ||
| <a href="{{ supporter.website }}" target="_blank" rel="noopener" title="{{ supporter.name }}"> | ||
| {%- endif -%} | ||
| <img src="{{ supporter.avatar }}" alt="{{ supporter.name }}" /> | ||
| {%- if supporter.website -%} | ||
| </a> | ||
| {%- endif -%} | ||
| </li> | ||
| {%- endfor -%} | ||
| </ul> | ||
|
|
||
| <script src="/js/avatars.js"></script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.