pay/web/template/template.qtpl

353 lines
17 KiB
Plaintext

{% package template %}
{% import (
"golang.org/x/text/language"
"golang.org/x/text/message"
"source.toby3d.me/toby3d/pay/internal/domain"
) %}
{% interface Page {
body()
dir()
lang()
t(format message.Reference, v ...any)
title()
head()
} %}
{% code
type Context struct {
language language.Tag
printer *message.Printer
amount uint64
processors domain.ConfigProcessors
}
func NewContext(processors domain.ConfigProcessors, lang language.Tag, amount uint64) *Context {
return &Context{
language: lang,
printer: message.NewPrinter(lang),
amount: amount,
processors: processors,
}
}
%}
{% stripspace %}
{% func (ctx Context) head() %}
<link rel="icon" href="/favicon.ico" sizes="32x32">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/manifest.webmanifest">
<link rel="preload stylesheet"{% space %}
as="style"{% space %}
href="/styles.css"{% space %}
type="text/css"{% space %}
fetchpriority="high"{% space %}
referrerpolicy="no-referrer"{% space %}
crossorigin="anonymous">
{% endfunc %}
{% func (ctx Context) body() %}
<h1>{%= ctx.title() %}</h1>
<noscript>
<h1>{%= ctx.t(`Donate $%d to %s`, ctx.amount/100, "toby3d") %}</h1>
</noscript>
<p class="[ cluster ][ form ][ js-enabled ]" hidden>
<span>{%= ctx.t(`Donate`) %}</span>
<label class="with-icon">
<span class="icon"{% space %}
role="img"{% space %}
aria-label="{%= ctx.t(`dollar amount`) %}">
💲
</span>
<input class="form__amount"{% space %}
type="number"{% space %}
name="amount"{% space %}
value="{%dul ctx.amount / 100 %}"{% space %}
min="0"{% space %}
step="1"{% space %}
pattern="[0-9]+"{% space %}
inputmode="decimal"{% space %}
required />
</label>
<label>
<span class="visually-hidden">{%= ctx.t(`contribution frequency`) %}</span>
<select name="period">
<option value="0" selected>{%= ctx.t(`one time`) %}</option>
<option value="7">{%= ctx.t(`weekly`) %}</option>
<option value="30">{%= ctx.t(`monthly`) %}</option>
<option value="365">{%= ctx.t(`annually`) %}</option>
</select>
</label>
<label>
<input type="checkbox"{% space %}
name="inRussia"{% space %}
value="true" />
{%= ctx.t(`from Russia`) %}
</label>
</p>
<ul class="[ cluster ][ list-style-type:none padding-inline-start:unset ]">
{% if ctx.processors.Liberapay != "" %}
<li>
<a class="[ button ][ js-button ]"{% space %}
data-period-min="1"{% space %}
data-period-max="365"{% space %}
data-in-russia="false"{% space %}
data-pattern="https://liberapay.com/{%s ctx.processors.Liberapay %}/donate?amount=%f&currency=USD&period=%p"{% space %}
rel="noopener noreferrer payment"{% space %}
href="https://liberapay.com/{%s ctx.processors.Liberapay %}/donate{% if ctx.amount > 0 %}?amount={%f.2 float64(ctx.amount) / 100 %}&currency=USD&period=monthly{% endif %}">
{%= icon("liberapay") %}
Liberapay
</a>
</li>
{% endif %}
{% if ctx.processors.PayPal != "" %}
<li>
<a class="[ button ][ js-button ]"{% space %}
data-period-max="1"{% space %}
data-in-russia="false"{% space %}
data-pattern="https://www.paypal.me/{%s ctx.processors.PayPal %}/%fUSD"{% space %}
rel="noopener noreferrer payment"{% space %}
href="https://www.paypal.me/{%s ctx.processors.PayPal %}{% if ctx.amount > 0 %}/{%f.2 float64(ctx.amount) / 100 %}USD{% endif %}">
{%= icon("paypal") %}
PayPal
</a>
</li>
{% endif %}
{% if ctx.processors.YooMoney != "" %}
<li>
<a class="[ button ][ js-button ]"{% space %}
data-amount-min="2"{% space %}
data-amount-max="15000"{% space %}
data-period-max="1"{% space %}
data-in-russia="true"{% space %}
data-pattern="https://yoomoney.ru/to/{%s ctx.processors.YooMoney %}/%d"{% space %}
rel="noopener noreferrer payment"{% space %}
href="https://yoomoney.ru/to/{%s ctx.processors.YooMoney %}{% if ctx.amount > 0 %}/{%dul ctx.amount %}{% endif %}">
{%= icon("yoomoney") %}
ЮMoney
</a>
</li>
{% endif %}
{% if ctx.processors.Kofi != "" %}
<li>
<a class="[ button ][ js-button ]"{% space %}
data-amount-min="200"{% space %}
data-period-max="30"{% space %}
data-period-except="7"{% space %}
data-in-russia="false"{% space %}
data-pattern="https://ko-fi.com/{%s ctx.processors.Kofi %}/%f"{% space %}
rel="noopener noreferrer payment"{% space %}
href="https://ko-fi.com/{%s ctx.processors.Kofi %}{% if ctx.amount > 0 %}/{%f.2 float64(ctx.amount) / 100 %}{% endif %}">
{%= icon("kofi") %}
Ko-fi
</a>
</li>
{% endif %}
{% if ctx.processors.DonationAlerts != "" %}
<li>
<a class="[ button ][ js-button ]"{% space %}
data-amount-min="1"{% space %}
data-period-max="1"{% space %}
data-pattern="https://www.donationalerts.com/r/{%s ctx.processors.DonationAlerts %}"{% space %}
rel="noopener noreferrer payment"{% space %}
href="https://www.donationalerts.com/r/{%s ctx.processors.DonationAlerts %}">
{%= icon("da") %}
DonationAlerts
</a>
</li>
{% endif %}
{% if ctx.processors.BuyMeACoffee != "" %}
<li>
<a class="[ button ][ js-button ]"{% space %}
data-amount-min="300"{% space %}
data-period-max="1"{% space %}
data-in-russia="false"{% space %}
data-pattern="https://www.buymeacoffee.com/{%s ctx.processors.BuyMeACoffee %}"{% space %}
rel="noopener noreferrer payment"{% space %}
href="https://www.buymeacoffee.com/{%s ctx.processors.BuyMeACoffee %}">
{%= icon("bmc") %}
Buy me a coffee
</a>
</li>
{% endif %}
{% if ctx.processors.Tribute != "" %}
<li>
<a class="[ button ][ js-button ]"{% space %}
data-period-max="1"{% space %}
data-pattern="https://t.me/tribute/app?startapp={%s ctx.processors.Tribute %}"{% space %}
rel="noopener noreferrer payment"{% space %}
href="https://t.me/tribute/app?startapp={%s ctx.processors.Tribute %}">
{%= icon("telegram") %}
Telegram
</a>
</li>
{% endif %}
</ul>
{% endfunc %}
{% func (ctx Context) dir() %}
{% switch ctx.language %}
{% default %}
ltr
{% case language.Arabic, language.Persian, language.Hebrew, language.Urdu %}
rtl
{% endswitch %}
{% endfunc %}
{% func (ctx Context) lang() %}
{% code base, _ := ctx.language.Base() %}
{%s base.String() %}
{% endfunc %}
{% func (ctx Context) t(format message.Reference, v ...any) %}
{%s ctx.printer.Sprintf(format, v...) %}
{% endfunc %}
{% func (ctx Context) title() %}
NotDotPay
{% endfunc %}
{% func Template(p Page) %}
<!DOCTYPE html>
<html lang="{%= p.lang() %}"{% space %}
dir="{%= p.dir() %}">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="color-scheme" content="light">
<title>NotDotPay</title>
{%= p.head() %}
</head>
<body>
{%= p.body() %}
<script async>
document.querySelectorAll('.js-enabled').forEach(el => el.hidden = false);
document.querySelectorAll('noscript').forEach(el => el.remove());
</script>
<script src="/scripts.js" async defer></script>
</body>
</html>
{% endfunc %}
{% func icon(id string) %}
{% switch id %}
{% case "liberapay" %}
<svg class="icon"{% space %}
width="32"{% space %}
height="32"{% space %}
viewBox="0 0 80 80"{% space %}
aria-hidden="true"{% space %}
focusable="false"{% space %}
xmlns="http://www.w3.org/2000/svg">
<path fill="#1a171b" d="M25.91 63.04c-3.57 0-6.37-.47-8.41-1.4a9.03 9.03 0 0 1-4.38-3.8 11.15 11.15 0 0 1-1.28-5.55c.03-2.08.32-4.31.87-6.67L22.3 5.57l11.69-1.81L23.5 47.2c-.2.9-.32 1.73-.34 2.49-.03.75.11 1.42.41 2 .3.57.82 1.04 1.55 1.39a8.7 8.7 0 0 0 3.05.68l-2.26 9.28m42.24-24.96c0 3.67-.6 7.03-1.81 10.07a23.94 23.94 0 0 1-5.01 7.88 22.43 22.43 0 0 1-7.7 5.17 25.4 25.4 0 0 1-9.76 1.85c-1.71 0-3.42-.16-5.13-.46l-3.4 13.65H24.19L36.7 24.05a67.6 67.6 0 0 1 6.9-1.62c2.6-.48 5.4-.71 8.42-.71 2.81 0 5.24.42 7.27 1.28a13.6 13.6 0 0 1 5.02 3.5 14.32 14.32 0 0 1 2.9 5.21c.63 1.99.95 4.11.95 6.37M40.78 53.54c.85.2 1.91.3 3.17.3 1.96 0 3.74-.36 5.35-1.09a11.8 11.8 0 0 0 4.11-3.05 14.1 14.1 0 0 0 2.64-4.72c.63-1.83.95-3.86.95-6.07 0-2.16-.48-4-1.44-5.5-.95-1.51-2.61-2.27-4.97-2.27-1.61 0-3.12.15-4.53.46l-5.28 21.94" />
</svg>
{% case "paypal" %}
<svg class="icon"{% space %}
width="32"{% space %}
height="32"{% space %}
viewBox="0 0 154.7 190.5"{% space %}
aria-hidden="true"{% space %}
focusable="false"{% space %}
xmlns="http://www.w3.org/2000/svg">
{% comment %}Left blue{% endcomment %}
<path fill="#003087" d="M28 0a5.5 5.5 0 0 0-5.5 4.6L.1 147.2a4.5 4.5 0 0 0 4.4 5.2h33.3l8.3-52.5 9-57.2a5.5 5.5 0 0 1 5.4-4.6h47.8c8.7 0 16.6 2 23.4 5.6C132 19.7 112.4 0 85.3 0z" />
{% comment %}Middle blue{% endcomment %}
<path fill="#001c64" d="M60.5 38.1a5.5 5.5 0 0 0-5.4 4.6l-9 57.2-8.3 52.5 8.3-52.5a5.5 5.5 0 0 1 5.4-4.6H78a54 54 0 0 0 53.8-51.6 50 50 0 0 0-23.4-5.6z" />
{% comment %}Right blue{% endcomment %}
<path fill="#0070e0" d="M131.7 43.7a54 54 0 0 1-53.8 51.6H51.5c-2.7 0-5 2-5.4 4.6l-8.3 52.5-5.2 33a4.5 4.5 0 0 0 4.4 5.1h28.7a5.5 5.5 0 0 0 5.4-4.6l7.6-48a5.5 5.5 0 0 1 5.4-4.5H101a54 54 0 0 0 53.2-45.7c3-18.7-6.5-35.6-22.5-44z" />
</svg>
{% case "yoomoney" %}
<svg class="icon"{% space %}
width="32"{% space %}
height="32"{% space %}
viewBox="0 0 169 120"{% space %}
aria-hidden="true"{% space %}
focusable="false"{% space %}
xmlns="http://www.w3.org/2000/svg">
<path fill="#fff" d="M109 0a59.9 59.9 0 1 0 0 120c33 0 60-27 60-60S142 0 109 0Zm0 82.4A22.7 22.7 0 0 1 86.6 60 22.7 22.7 0 0 1 109 37.6 22.7 22.7 0 0 1 131.4 60 23 23 0 0 1 109 82.4Z"/>
<path fill="#fff" d="M48.6 17.5v87.3H27.3L0 17.5h48.6Z"/>
</svg>
{% case "kofi" %}
<svg class="icon"{% space %}
width="32"{% space %}
height="32"{% space %}
viewBox="0 0 665.2 436.4"{% space %}
aria-hidden="true"{% space %}
focusable="false"{% space %}
xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="a" x1="336" x2="421.7" y1="4124.6" y2="3861.6" gradientTransform="matrix(1 0 0 -1 4.1 4362.6)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#ff4ea3"/>
<stop offset="1" stop-color="#ff5e5b"/>
</linearGradient>
</defs>
<path fill="#fff" d="M516.5 242c-23.9 2.6-43.7 1.2-43.7 1.2V93.6h30.5a67.4 67.4 0 0 1 67.5 70.3c0 49-25.2 68.8-54.3 78zM645 137.3c-9.2-46.4-33-75.5-59.5-92.7a157 157 0 0 0-90.1-27.8H39.6c-16 0-22.5 16-22.5 23.9V46s-1.3 201.3 1.2 310c4 63.6 67.6 63.6 67.6 63.6s208 0 308.6-1.3c5.3 0 9.2 0 14.5-1.3 57-14.5 62.3-67.5 62.3-96.7 114 5.1 194.9-75.7 173.7-183z"/>
<path d="M661.5 134.2v-.2C650.2 77.2 619 46.5 594.9 30.7A174.7 174.7 0 0 0 495.4 0H39.6C14 0 .3 23.6.3 40.7v5.2c0 2-1.2 202.7 1.3 310.5v.6c2.5 41 25.7 60.5 44.7 69.7 19.6 9.5 38.8 9.7 39.6 9.7 8.6 0 210 0 308.7-1.3 5.7 0 11.2 0 18.4-1.7l.2-.1a91 91 0 0 0 63.6-52.2c5.8-12.8 9.3-27.2 10.6-43.9 27.6-.7 53.5-6.1 77-16.2a168 168 0 0 0 62.7-45.1c32.7-38 45-88.3 34.4-141.7zm-626.4 221C32.6 249.4 33.8 54.2 34 46v-5.2c0-.5 1.2-7.3 5.7-7.3h455.8a140.8 140.8 0 0 1 81 25.2c27.3 17.8 45 45.4 52.2 81.9 8.5 43-1.1 83.3-27 113.4-29.1 33.9-76.3 52-129.5 49.5a16.8 16.8 0 0 0-17.6 16.8c0 45.6-16.2 71.9-49.4 80.4-3.3.8-5.7.8-10.5.8h-.3c-87.6 1.1-256.8 1.3-306.6 1.3H86s-12.6-.3-25-6.3c-15.8-7.7-24.5-21.6-25.8-41.3z"/>
<path d="M471.6 260c.6 0 6 .4 14.5.4 11 0 21.9-.6 32.3-1.8 1-.1 2.1-.3 3.2-.7 43.8-13.9 66-45.5 66-94a84 84 0 0 0-20-57.2 82.2 82.2 0 0 0-64.4-29.9h-30.4c-9.3 0-16.8 7.5-16.8 16.8v149.6c0 8.8 6.8 16.2 15.6 16.8zm18-33.2V110.4h13.7c15.4 0 29.1 6.3 38.7 17.8l.2.3c8 9.1 11.8 20.7 11.8 35.4 0 33.5-12.3 52-41 61.5a258 258 0 0 1-23.5 1.4z"/>
<path fill="#ff5e5b" d="M241 334.7c5.2 2.6 7.9 0 7.9 0s72.9-66.3 106-104.6c29-34.5 30.5-91.5-18.6-112.6C286 96.2 245 142.6 245 142.6c-35.8-39.7-90-37-115.3-10.6-25.1 26.5-15.9 71.6 2.7 98 17.2 24 94 92.8 106 103.4 0-1.4 1.3 0 2.6 1.3z"/>
<path fill="url(#a)" d="M410.8 618.4c3 .6 5.5-2 5.5-2s72.9-66.2 106-104.5c29.1-34.5 30.5-91.5-18.6-112.6-50.3-21.3-91.4 25.1-91.4 25.1-35.8-39.7-90-37-115.2-10.6-25.2 26.5-16 71.6 2.6 98 16.2 22.6 97.5 95.7 107.7 104.9 1 .8 2.1 1.5 3.4 1.7z" transform="translate(-167.4 -281.8)"/>
</svg>
{% case "da" %}
<svg class="icon"{% space %}
width="32"{% space %}
height="32"{% space %}
viewBox="0 0 69 80"{% space %}
aria-hidden="true"{% space %}
focusable="false"{% space %}
xmlns="http://www.w3.org/2000/svg">
<path fill="#FFF" d="M34.9 46.6h-5.5c-.3 0-.6-.1-.8-.3a1 1 0 0 1-.3-.8l.5-4.9c0-.5.5-1 1.1-1h5.4c.4 0 .7.2.9.4.2.2.3.5.3.8l-.5 4.9c0 .5-.6.9-1.1.9Zm.8-9.6h-5.5a1 1 0 0 1-1.1-1l1.5-16.6c0-.5.5-.9 1.1-.9h5.5a1 1 0 0 1 1.1 1l-1.5 16.6c0 .5-.5.9-1 1Zm32.5-19.2c.6.6.9 1.5.8 2.4l-2.2 24.6c0 .8-.4 1.5-1 2L48.2 64c-.7.6-1.5 1-2.4 1H27L10.5 80l1.3-15.2H3.4A3.4 3.4 0 0 1 0 61.2L5.1 3c.2-1.7 1.7-3 3.4-3h42.8c1 0 2 .4 2.6 1.2l14.3 16.6ZM55.2 40l1.3-15.2c0-.9-.3-1.7-.9-2.4l-8-9.3A3.4 3.4 0 0 0 45 12H19.6a3.4 3.4 0 0 0-3.4 3l-3 34a3.4 3.4 0 0 0 3.4 3.7h25a3 3 0 0 0 2.3-1L54 42.3a3 3 0 0 0 1-2.1Z"/>
</svg>
{% case "bmc" %}
<svg class="icon"{% space %}
width="32"{% space %}
height="32"{% space %}
viewBox="0 0 884 1279"{% space %}
aria-hidden="true"{% space %}
focusable="false"{% space %}
xmlns="http://www.w3.org/2000/svg">
<path fill="#0D0C22" d="m791 298-1-1-2-1 3 2Zm13 91h-1 1Zm-13-92v1-1Zm0 1v-1 1Zm12 91 2-1 1-1-3 2Zm-9-89-2-2h-1l3 2Zm-364 886-3 2h1l2-2Zm211-41v3-3Zm-22 41-3 2h1l2-2Zm-338 10-3-1 3 1Zm-33-32-1-4 1 4Z"/>
<path fill="#FD0" d="M473 591c-46 20-98 42-166 42-28 0-56-4-84-12l47 480a80 80 0 0 0 80 74l88 3 96-3a80 80 0 0 0 79-74l50-530c-22-8-44-13-70-13-44 0-79 15-120 33Z"/>
<path fill="#0D0C22" d="M79 386v1h1l-1-1Z"/>
<path fill="#0D0C22" d="m880 342-7-36c-7-31-21-62-54-73-10-4-22-5-30-13s-11-19-12-30l-11-61c-3-17-5-37-13-52-10-22-32-34-53-42-11-5-22-8-33-11C613 10 557 5 503 2c-66-4-132-2-198 3-48 5-100 10-146 27-17 6-35 14-47 27a51 51 0 0 0-10 61c8 14 22 24 37 31 19 8 39 15 60 19a1334 1334 0 0 0 417 7c19-3 31-27 25-44-6-21-24-28-44-25l-9 1h-2a1234 1234 0 0 1-313 1l-6-1h-1l-6-1a665 665 0 0 1-42-9 6 6 0 0 1 3-9 626 626 0 0 1 45-8l21-2a1336 1336 0 0 1 290 1l7 1h5l43 8c21 5 47 6 57 29 3 7 4 15 6 23l2 10a153589 153589 0 0 0 15 74 13 13 0 0 1-11 10l-3 1h-3a1670 1670 0 0 1-253 16 1976 1976 0 0 1-250-16l-7-1-15-3-52-8c-21-4-41-2-60 8-16 9-28 22-36 38-8 17-11 35-14 53-4 18-10 38-8 56 5 40 33 73 74 80a2072 2072 0 0 0 604 20 26 26 0 0 1 28 29l-3 37a15200479 15200479 0 0 1-55 528c-2 22-2 44-6 66-7 34-30 54-63 62-31 7-62 11-94 11l-105-1c-37 0-82-3-111-31-26-24-29-63-32-96l-14-131-25-242-17-157-1-8c-2-19-15-37-36-36-18 0-38 16-36 36l12 116 25 241 22 205 4 40c8 71 62 110 130 121 40 6 80 8 120 8 52 1 104 3 155-6 75-14 131-64 139-142a758975 758975 0 0 0 30-290l25-243 11-111a26 26 0 0 1 21-22c21-5 42-12 57-28 24-26 29-60 21-94ZM72 366v4-4Zm3 16 1 1-2-1h1Zm2 3c0 1 1 2 0 0Zm4 3Zm720-5c-8 7-20 11-31 12a2172 2172 0 0 1-667-2c-9-1-19-3-25-9-12-13-6-38-3-53 3-14 8-33 25-35 26-3 56 8 81 12a1787 1787 0 0 0 562-7c22-4 45-11 58 11 9 15 10 35 9 52-1 7-4 14-9 19Z"/>
</svg>
{% case "telegram" %}
<svg class="icon"{% space %}
width="32"{% space %}
height="32"{% space %}
viewBox="0 0 543 543"{% space %}
aria-hidden="true"{% space %}
focusable="false"{% space %}
xmlns="http://www.w3.org/2000/svg">
<path fill="#fff" d="M37 240c146-64 243-106 292-126 139-58 168-68 186-68 5 0 14 1 20 6 5 4 6 9 7 13l1 20c-8 79-40 271-57 360-7 37-21 50-34 51-29 2-51-19-79-38l-112-75c-49-32-17-50 11-79 7-8 135-124 138-135 0-1 0-6-3-9-3-2-7-2-10-1-4 1-75 48-211 140a95 95 0 0 1-54 20c-18-1-52-11-78-19-31-10-56-15-54-33 1-9 14-18 37-27z"/>
</g>
</svg>
{% endswitch %}
{% endfunc %}
{% endstripspace %}