added beginnings of stripe payment for subscriptions

2025-01-19 21:20:12 +00:00
parent c0afafd07b
commit b8624c94a1
13 changed files with 81 additions and 2 deletions
--- a/ui/static/checkout.js
+++ b/ui/static/checkout.js
@@ -0,0 +1,21 @@
+const stripe = Stripe("pk_test_51QikGlGk6yuk3uA8MT3uQrPMpUqJlKzkxfbrfrd34yXolWSbJYEFWm674s2aUydZyjjS0W2oByEJTV0LXMs1pWTk002ioHxQl6");
+
+initialize();
+
+// Create a Checkout Session
+async function initialize() {
+  const fetchClientSecret = async () => {
+    const response = await fetch("/create-checkout-session", {
+      method: "POST",
+    });
+    const { clientSecret } = await response.json();
+    return clientSecret;
+  };
+
+  const checkout = await stripe.initEmbeddedCheckout({
+    fetchClientSecret,
+  });
+
+  // Mount Checkout
+  checkout.mount('#checkout');
+}
--- a/ui/templates/base.html
+++ b/ui/templates/base.html
@@ -4,6 +4,8 @@
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Live Stream</title>
+        {% block header_config %}
+        {% endblock %}
    </head>
    <body>
        {% block main_content %}
--- a/ui/templates/checkout.html
+++ b/ui/templates/checkout.html
@@ -0,0 +1,15 @@
+{% extends "base.html" %}
+
+{% block header_config %}
+<link rel="stylesheet" href="style.css" />
+<script src="https://js.stripe.com/v3/"></script>
+<script src="{{ url_for('static', filename='checkout.js') }}" defer></script>
+
+{% endblock %}
+
+{% block main_content %}
+    <!-- Display a payment form -->
+    <div id="checkout">
+        <!-- Checkout will insert the payment form here -->
+      </div>
+{% endblock %}