🚧 Remake patreon tab

app/data/boosters.yaml

@@ -0,0 +1,8 @@
+cats:
+- Dēmētrius ille
+- GAKONS
+
+businessCats:
+- myOmochi Games
+
+sponsors: []

app/data/i18n/English.json

@@ -552,20 +552,16 @@
         "helpPages": "Learn"
     },
     "patreon": {
-        "aboutPatrons": "Patrons are people who show their support to ComigoGames at Patreon, in form of recurring donations. Not everyone there comes from ct.js; some are using other apps from ComigoGames. Tip: if you are a creator and donate to ComigoGames via Patreon, you will get a link to your page here — that's my little help to your creations :)",
-        "patronsHeader": "Our patrons",
-        "businessShuttles": "Business shuttles",
-        "noShuttlesYet": "No business shuttles yet :c Your company may be the first one, though!",
-        "shuttlesDescription": "Business shuttles are considered as partners of ct.js. They are listed on ct.js' homepage and its store pages.",
-        "spacePirates": "Space Pirates",
-        "noPiratesYet": "There are no Space Pirates yet :c",
-        "piratesDescription": "Space Pirates get priority support on Discord server with a cool role, and get listed here.",
-        "spaceProgrammers": "Space Programmers",
-        "programmersDescription": "\"Space Programmer\" is a legacy tier that was available before ct.js went open-source and brought sources of jam games to patrons.",
-        "aspiringAstronauts": "Aspiring Astronauts",
-        "noAstronautsYet": "There are no Aspiring Astronauts yet :c",
-        "astronautsDescription": "Astronauts get a special role in Discord and get listed here!",
+        "aboutPatrons": "Patrons are people who show their support to ComigoGames at Boosty, in form of recurring donations, similarly to subscriptions on Patreon.",
         "thankAllPatrons": "Thanks to all ComigoGames patrons, current and former ones, as your support keeps Comigo moving forward and making even better apps! :)",
+        "patronsHeader": "Our patrons",
+        "sponsors": "Sponsors",
+        "noSponsorsYet": "There're no sponsors yet. You can be the first!",
+        "sponsorsDescription": "Sponsors are displayed as such on ct.js site and other pages, like on ct.js game jams.",
+        "businessCats": "Business cats",
+        "businessCatsDescription": "Business cats get access to a special support channel on Discord server and receive support for ct.js and gamedev as a whole, too.",
+        "cats": "Cats",
+        "catsDescription": "Cats are people that want to support ct.js with more than just \"thanks\". They get listed in ct.js (here!) and everywhere CoMiGo remembers to add them.",
         "becomeAPatron": "Become a patron",
         "aboutFillers": [
             "is cool all around 😎",

gulpfile.js

@@ -572,36 +572,12 @@ const templates = () => gulp.src('./src/projectTemplates/**/*')
 
 const gallery = () => gulp.src('./bundledAssets/**/*')
     .pipe(gulp.dest('./app/bundledAssets'));
-
-// eslint-disable-next-line valid-jsdoc
-/**
- * @see https://stackoverflow.com/a/22907134
- */
-const patronsCache = done => {
-    const http = require('https');
-
-    const dest = './app/data/patronsCache.csv',
-          src = 'https://docs.google.com/spreadsheets/d/e/2PACX-1vTUMd6nvY0if8MuVDm5-zMfAxWCSWpUzOc81SehmBVZ6mytFkoB3y9i9WlUufhIMteMDc00O9EqifI3/pub?output=csv';
-    const file = fs.createWriteStream(dest);
-    http.get(src, response => {
-        response.pipe(file);
-        file.on('finish', () => {
-            file.close(() => done()); // close() is async, call cb after close completes.
-        });
-    })
-    .on('error', err => { // Handle errors
-        fs.unlink(dest); // Delete the file async. (But we don't check the result)
-        done(err);
-    });
-};
-
 const packages = gulp.series([
     lint,
     abortOnWindows,
     gulp.parallel([
         build,
         docs,
-        patronsCache,
         examples,
         templates,
         gallery
@@ -659,7 +635,6 @@ exports.lintI18n = lintI18n;
 exports.lint = lint;
 exports.packages = packages;
 exports.nwbuild = bakePackages;
-exports.patronsCache = patronsCache;
 exports.docs = docs;
 exports.build = build;
 exports.deploy = deploy;

src/riotTags/patreon-screen.tag

@@ -1,69 +1,63 @@
 patron-line
-    img(src="{patron.avatar}")
-    b {opts.patron.name}
+    .aPatronEmoji {parent.getEmoji(opts.patron)}
+    b {opts.patron}
     |
     |
-    span(if="{!opts.patron.about}") {parent.getFiller(opts.patron.name)}
-    a(href="{opts.patron.link}" if="{opts.patron.about}")
-        | {opts.patron.about}
-        |
-        |
-        span(if="{opts.patron['18+']}") 🔞
-    span(if="{!opts.patron['18+'] && opts.patron.about}") {parent.getEmoji(opts.patron.name)}
-    script.
+    span {parent.getFiller(opts.patron)}
 
 patreon-screen.aView(style="z-index: 100;")
     .Confetti
         .aConfettiPiece(each="{confetti in (new Array(15))}" style="background: {getConfettiColor()}")
+    aside
+        p {voc.aboutPatrons}
+        p.aPatronThanks {voc.thankAllPatrons}
+        h3
+            img(src="/data/img/boostyTiers_sponsor.png")
+            |
+            | {voc.sponsors}
+        p {voc.sponsorsDescription}
+
+        h3
+            img(src="/data/img/boostyTiers_businessCat.png")
+            |
+            | {voc.businessCats}
+        p {voc.businessCatsDescription}
+
+        h3
+            img(src="/data/img/boostyTiers_ct.png")
+            |
+            | {voc.cats}
+        p {voc.catsDescription}
+
+        button(onclick="{openBoosty}").nml
+            svg.feather
+                use(xlink:href="#heart")
+            span  {voc.becomeAPatron}
     h1 {voc.patronsHeader}
-    p {voc.aboutPatrons}
     div(if="{loading}")
         svg.feather
             use(xlink:href="#loader")
         | {vocGlob.loading}
     div(if="{!loading}")
-        h2 {voc.businessShuttles}
-
-        patron-line(each="{patron in patrons.shuttles}" patron="{patron}")
-
-        p
-            span(if="{!patrons.shuttles.length}") {voc.noShuttlesYet}
+        h2
+            img(src="/data/img/boostyTiers_sponsor.png")
             |
-            |
-            | {voc.shuttlesDescription}
-
-        h2 {voc.spacePirates}
-
-        patron-line(each="{patron in patrons.pirates}" patron="{patron}")
+            | {voc.sponsors}
+        patron-line(each="{patron in patrons.sponsors}" patron="{patron}")
+        p(if="{!patrons.sponsors.length}") {voc.noSponsorsYet}
 
-        p
-            span(if="{!patrons.pirates.length}") {noPiratesYet}
+        h2
+            img(src="/data/img/boostyTiers_businessCat.png")
             |
-            |
-            | {voc.piratesDescription}
-
-        h2 {voc.spaceProgrammers}
-
-        patron-line(each="{patron in patrons.programmers}" patron="{patron}")
-
-        p {voc.programmersDescription}
+            | {voc.businessCats}
+        patron-line(each="{patron in patrons.businessCats}" patron="{patron}")
 
-        h2 {voc.aspiringAstronauts}
-
-        patron-line(each="{patron in patrons.astronauts}" patron="{patron}")
-
-        p
-            span(if="{!patrons.astronauts.length}") {noAstronautsYet}
-            |
+        h2
+            img(src="/data/img/boostyTiers_ct.png")
             |
-            | {voc.astronautsDescription}
+            | {voc.cats}
+        patron-line(each="{patron in patrons.cats}" patron="{patron}")
 
-        p.aPatronThanks {voc.thankAllPatrons}
-
-    button(onclick="{openPatreon}").nml
-        svg.feather
-            use(xlink:href="#heart")
-        span  {voc.becomeAPatron}
     script.
         this.namespace = 'patreon';
         this.mixin(window.riotVoc);
@@ -111,56 +105,18 @@ patreon-screen.aView(style="z-index: 100;")
         this.getConfettiColor = () =>
             this.confettiColors[Math.floor(Math.random() * this.confettiColors.length)];
 
-        this.importPatronData = text => {
-            const patrons = [];
-            var table = text.split('\r\n').map(row => row.split(','));
-            for (let i = 1, l = table.length; i < l; i++) {
-                const obj = {},
-                      row = table[i];
-                for (let j = 0; j < row.length; j++) {
-                    obj[table[0][j].trim()] = row[j];
-                }
-                const prev = patrons.find(patron => patron.name === obj.name);
-                if (prev) {
-                    patrons.splice(patrons.indexOf(prev), 1);
-                }
-                patrons.push(obj);
-            }
-            patrons.filter(patron => patron.tier);
-            patrons.forEach(patron => {
-                patron.former = Boolean(patron.former);
-                if (patron.tier === 'An Aspiring Astronaut') {
-                    this.patrons.astronauts.push(patron);
-                } else if (patron.tier === 'A Space Pirate') {
-                    this.patrons.pirates.push(patron);
-                } else if (patron.tier === 'A Business Shuttle') {
-                    this.patrons.shuttles.push(patron);
-                } else if (patron.tier === 'A Space Programmer') {
-                    this.patrons.programmers.push(patron);
-                }
-            });
+        this.importPatronData = async () => {
+            const fs = require('fs-extra');
+            const YAML = require('js-yaml');
+            const raw = await fs.readFile('./data/boosters.yaml', 'utf8');
+            const patronsYaml = YAML.load(raw);
+
+            this.patrons = patronsYaml;
             this.loading = false;
             this.update();
         };
-        this.loadPatrons = () => {
-            this.loading = true;
-            window.fetch('https://docs.google.com/spreadsheets/d/e/2PACX-1vTUMd6nvY0if8MuVDm5-zMfAxWCSWpUzOc81SehmBVZ6mytFkoB3y9i9WlUufhIMteMDc00O9EqifI3/pub?output=csv')
-            .then(response => response.text())
-            .then(this.importPatronData)
-            .catch(e => {
-                console.error(e);
-                const fs = require('fs-extra');
-                fs.readFile('./data/patronsCache.csv', {
-                    encoding: 'utf8'
-                })
-                .then(this.importPatronData)
-                .catch(e => {
-                    console.error(e);
-                });
-            });
-        };
-        this.loadPatrons();
+        this.importPatronData();
 
-        this.openPatreon = () => {
+        this.openBoosty = () => {
             nw.Shell.openExternal('https://www.patreon.com/comigo');
-        };
+        };

src/styl/tags/patreon-screen.styl

@@ -1,16 +1,46 @@
 patreon-screen
     display block
     padding 1rem 2rem
+    h1
+        font-size 2.5rem
     h2
         margin-bottom 1rem
+        margin-top 2rem
+        img
+            vertical-align middle
+            margin-right 0.2em
+    aside
+        {shadamb}
+        padding 1rem
+        margin 0 0 0 2rem
+        border 1px solid borderBright
+        border-radius br
+        float right
+        width 22rem
+        box-sizing border-box
+        p
+            line-height 1.65
+            margin-top 0
+        h3
+            font-weight bold
+            margin-bottom 0
+            padding-bottom 0
+            img
+                height 1.5rem
+                vertical-align middle
 
 patron-line
     display block
     & + &
         margin-top 0.5rem
-    img
-        border-radius 100%
+    .aPatronEmoji
         width 3rem
         height @width
+        font-size 1.5rem
+        line-height @width
+        background rgba(act, 0.27)
+        text-align center
+        border-radius 100%
         margin-right 0.5rem
-        vertical-align middle
+        vertical-align middle
+        display inline-block