nostream/resources/index.html
TL 3d1e5733cc
feat: add dark theme support for static html files (#373)
* Add dark theme styling

* Add auto detect preferred  color scheme
2024-10-20 20:16:26 -04:00

163 lines
9.1 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Admission Fee Required - {{name}}</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<link rel="stylesheet" href="./css/style.css">
</head>
<body lang="en" onload="onLoad()">
<main class="container">
<form method="post" action="/invoices">
<div class="row">
<div class="col">
<h1 class="mt-4 mb-4 text-center text-nowrap">{{name}}</h1>
</div>
</div>
<div class="row">
<div class="col text-center">
<div class="row">
<div class="d-flex justify-content-center mt-2">
<p class="description-text">
This <a href="https://github.com/nostr-protocol/nostr">Nostr</a> relay <strong>requires</strong> a one-time
admission
fee. <br /> Once payment is complete, you will be able to post and fetch events from this relay.
</p>
</div>
<div class="d-flex justify-content-center mb-1 mt-2">
<p class="description-text">
Provide your Nostr public key to generate a Bitcoin Lightning invoice.
</p>
</div>
</div>
</div>
</div>
<div class="row justify-content-center">
<div class="card col col-md-10 col-lg-6 mb-4">
<div class="card-body">
<div class="d-flex flex-column mb-4">
<label for="pubkey" class="h5">Your Nostr public key</label>
<input type="text" name="pubkey" class="form-control form-control-sm" id="pubkey" placeholder="npub... or hex..." pattern="^([0-9a-f]{64}|npub1[ac-hj-np-z02-9]+)$" required>
<div id="pubkeyAfterHelpBlock" class="form-text">
Hex or npub formats accepted.
</div>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" id="tosAccepted" name="tosAccepted" value="yes" required>
<label class="form-check-label" for="tosAccepted">
I have read and agree to the <a href="#" class="card-link" data-bs-toggle="modal" data-bs-target="#tosModal">Terms of Service</a>
</label>
</div>
</div>
</div>
</div>
<div class="row">
<div class="d-flex justify-content-center mb-3">
<input type="hidden" name="feeSchedule" value="admission" />
<button id="submitBtn" class="btn btn-lg btn-warning" type="submit">Pay {{amount}} sats</button>
</div>
</div>
<div class="row d-none" id="powered-by-zebedee">
<div class="d-flex justify-content-center mb-3 mt-4">
<a href="https://zeb.gg/nostr-zbd-quickstart" target="_blank">
<img class="poweredbyzbd-img" src="https://cdn.zebedee.io/an/nostr/poweredbyzbd.png" />
</a>
</div>
</div>
</form>
</main>
<div class="modal" id="tosModal" tabindex="-1">
<div class="modal-dialog modal-lg modal-fullscreen-md-down">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Terms of Service</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p>
These are the terms of service for {{name}}; please read them before using {{name}}.
</p>
<p>
This service (and supporting services) are provided "as is", without warranty of any kind, express or implied, including but
not limited to the warranties of merchantability, fitness for a particular purpose and noninfringement.
</p>
<p>
By connecting to this relay, you agree:
<ul>
<li>To not engage in spam</li>
<li>To not flood</li>
<li>To not expect content moderation</li>
<li>To not misuse or abuse the relay service and other supporting services</li>
<li>To not disseminate illegal content or material</li>
<li>That requests to delete content you published cannot be guaranteed</li>
<li>That this relay has no control over any content published in other relays</li>
<li>That some services, such as but not limited to the privilege to publish content may require payment(s)</li>
<li>That charge backs from payments may result in the termination of the privilege to use the service</li>
<li>That the service might be revoked to you at the operator's sole discretion if found in violation of these terms</li>
<li>That the terms of service may change at any time in the future without explicit notice</li>
<li>To grant us the necessary rights to your content to provide the service to you and to other users for an unlimited time</li>
<li>To use the service in compliance with all laws, rules, and regulations applicable to you</li>
<li>To use the service in good faith and not seek to get the relay operator(s) in trouble</li>
<li>That the service may throttle, rate limit or revoke your access to any content and/or your privilege to publish content for any reason</li>
<li>That the content you publish to this relay will be further broadcasted to any interested client and/or accepting relay</li>
<li>To not infringe on the right of others to publish content to this relay as allowed by the terms of service</li>
<li>That this service is not targeted, nor intended for use by, anyone under the legal age in their respective jurisdiction</li>
<li>To be of legal age or have sufficient legal constent, permission and capacity to use this service</li>
<li>That the service may be temporarily shutdown or permanently terminated at any time and without notice</li>
<li>That the content published by you and other users may be removed at any time and without notice and for any reason</li>
<li>To have your IP address and/or public key collected for the purpose of detecting abuse, spam or misuse</li>
<li>To have your IP address and/or public key in full, truncated, or as a hash digest shared with interested clients and other accepting relays for the sole purpose of reporting abuse, spam or misuse</li>
<li>To cooperate with the relay and its operators for the purpose of combating abuse, spam or misuse of the service</li>
</ul>
<br/>
In addition you understand that:
<ul>
<li>Nostr is a decentralized and distributed network of relays that relays data by users.</li>
<li>Censorship resistance is practiced by posting to multiple relays and running your own private relay.</li>
<li>The responsibility of filtering and moderating is the sole responsibility of the users and not of the relays.</li>
<li>You may be inadvertently exposed to content that you might find triggering, disturbing, distasteful, immoral or against your views.</li>
<li>The relay operator is not liable and has no involvement in the type, quality and legality of the content being produced by users of the relay.</li>
</ul>
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
<script>
var processor = "{{processor}}"
function attemptGetPubkey() {
const maxRetries = 10
function getPubKey(retries) {
if (window.nostr && typeof window.nostr.getPublicKey === 'function') {
window.nostr.getPublicKey().then((pubkey) => {
console.log(pubkey)
document.getElementById('pubkey').setAttribute('value', pubkey)
}).catch(console.error.bind(console))
} else if (retries > 0) {
setTimeout(() => getPubKey(retries - 1), 100)
}
}
getPubKey(maxRetries)
}
function onLoad() {
setTimeout(attemptGetPubkey, 300)
if (processor === 'zebedee') {
document.getElementById('powered-by-zebedee').classList.remove('d-none')
}
// Check for system preference on load
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.body.classList.add('dark-theme');
}
}
</script>
</body>
</html>