{"id":176,"date":"2025-11-12T17:57:19","date_gmt":"2025-11-12T11:57:19","guid":{"rendered":"https:\/\/stellardns.io\/?page_id=176"},"modified":"2025-11-19T04:39:53","modified_gmt":"2025-11-18T22:39:53","slug":"stellar-membership-basic","status":"publish","type":"page","link":"https:\/\/stellardns.io\/?page_id=176","title":{"rendered":"Stellar Membership Basic"},"content":{"rendered":"\r\n<div class=\"stellar-membership-form-wrapper\">\r\n    <div class=\"stellar-membership-container\">\r\n        <div class=\"membership-header\">\r\n            <h3>Basic Membership<\/h3>\r\n            <div class=\"membership-price-main\">\r\n                <div class=\"xlm-price\">50 XLM<\/div>\r\n                <div class=\"usd-price\">\u2248 $8.51<\/div>\r\n                <div class=\"price-period\">\/month<\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <p class=\"membership-description\">\r\n            Basic membership includes access to fundamental features and mainnet access.        <\/p>\r\n\r\n        <form id=\"stellar-membership-form\" class=\"stellar-membership-form\" method=\"post\">\r\n            <input type=\"hidden\" id=\"stellar_membership_nonce_field\" name=\"stellar_membership_nonce_field\" value=\"7cadbb9aaf\" \/><input type=\"hidden\" name=\"_wp_http_referer\" value=\"\/index.php?rest_route=%2Fwp%2Fv2%2Fpages%2F176\" \/>\r\n            <input type=\"hidden\" name=\"stellar_membership_tier\" value=\"1\">\r\n            <input type=\"hidden\" name=\"stellar_tier_xlm\" value=\"50\">\r\n            <input type=\"hidden\" name=\"stellar_xlm_rate\" value=\"0.170246\">\r\n\r\n            <!-- Wallet Address -->\r\n            <div class=\"form-group\">\r\n                <label for=\"stellar_member_wallet\">Wallet Address<\/label>\r\n                <input\r\n                    type=\"text\"\r\n                    id=\"stellar_member_wallet\"\r\n                    name=\"stellar_member_wallet\"\r\n                    placeholder=\"G...\"\r\n                    required\r\n                    pattern=\"^G[A-Z2-7]{55}$\"\r\n                    class=\"form-control\"\r\n                \/>\r\n                <small class=\"form-text\">Your Stellar wallet address to receive membership benefits<\/small>\r\n            <\/div>\r\n\r\n            <!-- Custom Donation Amount (Optional) - Hidden for Free Tier -->\r\n                        <div class=\"form-group\">\r\n                <label for=\"stellar_donation_usd\">\r\n                    \ud83d\udc9d Custom Amount (Optional)\r\n                <\/label>\r\n                <div class=\"donation-input-group\">\r\n                    <span class=\"currency-symbol\">$<\/span>\r\n                    <input\r\n                        type=\"number\"\r\n                        id=\"stellar_donation_usd\"\r\n                        name=\"stellar_donation_usd\"\r\n                        placeholder=\"100.00\"\r\n                        step=\"0.01\"\r\n                        min=\"0\"\r\n                        class=\"form-control donation-input\"\r\n                    \/>\r\n                <\/div>\r\n                <small class=\"form-text\">\r\n                    Enter any amount in USD and we'll convert it to XLM for you\r\n                <\/small>\r\n                <div id=\"donation-conversion\" class=\"donation-conversion\" style=\"display: none;\">\r\n                    <p>\r\n                        <strong>$<span id=\"donation-usd-amount\">0.00<\/span> USD<\/strong> =\r\n                        <strong><span id=\"donation-xlm-amount\">0<\/span> XLM<\/span>\r\n                    <\/p>\r\n                <\/div>\r\n            <\/div>\r\n            \r\n            <!-- Payment Amount Summary -->\r\n            <div class=\"payment-summary-card\">\r\n                <h4>Payment Summary<\/h4>\r\n                <div class=\"summary-row\">\r\n                    <span>Membership Tier:<\/span>\r\n                    <strong>Basic<\/strong>\r\n                <\/div>\r\n                <div class=\"summary-row\">\r\n                    <span>Amount (XLM):<\/span>\r\n                    <strong id=\"payment-xlm-display\">50 XLM<\/strong>\r\n                <\/div>\r\n                <div class=\"summary-row\">\r\n                    <span>Amount (USD):<\/span>\r\n                    <strong id=\"payment-usd-display\">\u2248 $8.51<\/strong>\r\n                <\/div>\r\n                <div class=\"summary-row\">\r\n                    <span>Network:<\/span>\r\n                    <strong>Mainnet<\/strong>\r\n                <\/div>\r\n                <div class=\"summary-row\" id=\"custom-amount-row\" style=\"display: none; border-top: 1px solid #eee; padding-top: 10px; margin-top: 10px; color: #28a745; font-weight: bold;\">\r\n                    <span>\u2713 Custom Amount Selected<\/span>\r\n                    <strong id=\"custom-amount-xlm\">0 XLM<\/strong>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <!-- Auto-Renewal - Hidden for Free Tier -->\r\n                        <div class=\"form-group\">\r\n                <label>\r\n                    <input\r\n                        type=\"checkbox\"\r\n                        name=\"stellar_auto_renew\"\r\n                        value=\"1\"\r\n                    \/>\r\n                    Enable Auto-Renewal\r\n                <\/label>\r\n                <small class=\"form-text\">Your membership will automatically renew when it expires<\/small>\r\n            <\/div>\r\n            \r\n            <!-- Membership Benefits -->\r\n            <div class=\"membership-terms\">\r\n                <h4>What's Included:<\/h4>\r\n                <ul>\r\n                                            <li>\r\n                            \u2713 Access to basic content and features                        <\/li>\r\n                        <li>\u2713 Mainnet access (real transactions)<\/li>\r\n                        <li>\u2713 Blockchain-verified membership status<\/li>\r\n                        <li>\u2713 Category-based content restrictions<\/li>\r\n                                                                                    <\/ul>\r\n            <\/div>\r\n\r\n            <!-- Submit Button -->\r\n            <button type=\"submit\" class=\"stellar-membership-submit btn btn-primary\">\r\n                <span class=\"button-text\">\r\n                    Subscribe Now                <\/span>\r\n                <span class=\"spinner\" style=\"display: none;\"><\/span>\r\n            <\/button>\r\n\r\n            <p class=\"membership-note\">\r\n                You will be redirected to your Stellar wallet to confirm and sign the subscription payment.            <\/p>\r\n        <\/form>\r\n\r\n        <div id=\"stellar-membership-status\" class=\"stellar-membership-status\" style=\"display: none;\"><\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<style>\r\n.stellar-membership-form-wrapper {\r\n    padding: 20px 0;\r\n}\r\n\r\n.stellar-membership-container {\r\n    max-width: 550px;\r\n    margin: 0 auto;\r\n    padding: 30px;\r\n    background: #f9f9f9;\r\n    border: 1px solid #ddd;\r\n    border-radius: 8px;\r\n}\r\n\r\n.membership-header {\r\n    text-align: center;\r\n    margin-bottom: 25px;\r\n    padding-bottom: 20px;\r\n    border-bottom: 2px solid #007cba;\r\n}\r\n\r\n.membership-header h3 {\r\n    margin: 0 0 10px 0;\r\n    color: #333;\r\n    font-size: 28px;\r\n}\r\n\r\n.membership-price-main {\r\n    margin: 15px 0 0 0;\r\n}\r\n\r\n.xlm-price {\r\n    font-size: 32px;\r\n    font-weight: 700;\r\n    color: #007cba;\r\n    font-family: 'Courier New', monospace;\r\n}\r\n\r\n.usd-price {\r\n    font-size: 18px;\r\n    color: #666;\r\n    margin: 5px 0 0 0;\r\n}\r\n\r\n.price-period {\r\n    font-size: 12px;\r\n    color: #999;\r\n}\r\n\r\n.membership-description {\r\n    color: #555;\r\n    text-align: center;\r\n    margin-bottom: 20px;\r\n    line-height: 1.5;\r\n}\r\n\r\n.form-group {\r\n    margin-bottom: 20px;\r\n}\r\n\r\n.form-group label {\r\n    display: block;\r\n    margin-bottom: 8px;\r\n    font-weight: 600;\r\n    color: #333;\r\n}\r\n\r\n.form-group input[type=\"checkbox\"] {\r\n    margin-right: 8px;\r\n}\r\n\r\n.form-control {\r\n    width: 100%;\r\n    padding: 10px;\r\n    border: 1px solid #ddd;\r\n    border-radius: 4px;\r\n    font-size: 14px;\r\n    font-family: monospace;\r\n    transition: border-color 0.2s;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.form-control:focus {\r\n    outline: none;\r\n    border-color: #007cba;\r\n    box-shadow: 0 0 0 3px rgba(0, 124, 186, 0.1);\r\n}\r\n\r\n.donation-input-group {\r\n    display: flex;\r\n    align-items: center;\r\n    position: relative;\r\n}\r\n\r\n.currency-symbol {\r\n    position: absolute;\r\n    left: 12px;\r\n    color: #666;\r\n    font-weight: bold;\r\n    font-size: 16px;\r\n}\r\n\r\n.donation-input {\r\n    padding-left: 30px !important;\r\n}\r\n\r\n.donation-conversion {\r\n    background: #d4edda;\r\n    border: 1px solid #c3e6cb;\r\n    color: #155724;\r\n    padding: 12px;\r\n    border-radius: 4px;\r\n    margin-top: 10px;\r\n    font-size: 14px;\r\n}\r\n\r\n.donation-conversion p {\r\n    margin: 0;\r\n}\r\n\r\n.form-text {\r\n    display: block;\r\n    margin-top: 5px;\r\n    font-size: 12px;\r\n    color: #666;\r\n}\r\n\r\n.payment-summary-card {\r\n    background: white;\r\n    padding: 15px;\r\n    border: 1px solid #e0e0e0;\r\n    border-radius: 4px;\r\n    margin: 20px 0;\r\n}\r\n\r\n.payment-summary-card h4 {\r\n    margin: 0 0 15px 0;\r\n    color: #333;\r\n    font-size: 14px;\r\n}\r\n\r\n.summary-row {\r\n    display: flex;\r\n    justify-content: space-between;\r\n    padding: 8px 0;\r\n    border-bottom: 1px solid #f0f0f0;\r\n    font-size: 14px;\r\n}\r\n\r\n.summary-row:last-child {\r\n    border-bottom: none;\r\n}\r\n\r\n.summary-row span {\r\n    color: #666;\r\n}\r\n\r\n.summary-row strong {\r\n    color: #333;\r\n    font-family: 'Courier New', monospace;\r\n    font-weight: 700;\r\n}\r\n\r\n.membership-terms {\r\n    background: white;\r\n    padding: 15px;\r\n    border: 1px solid #e0e0e0;\r\n    border-radius: 4px;\r\n    margin: 20px 0;\r\n}\r\n\r\n.membership-terms h4 {\r\n    margin: 0 0 10px 0;\r\n    color: #333;\r\n    font-size: 14px;\r\n}\r\n\r\n.membership-terms ul {\r\n    margin: 0;\r\n    padding-left: 20px;\r\n}\r\n\r\n.membership-terms li {\r\n    margin-bottom: 8px;\r\n    color: #555;\r\n    font-size: 13px;\r\n}\r\n\r\n.stellar-membership-submit {\r\n    width: 100%;\r\n    padding: 12px;\r\n    background: #007cba;\r\n    color: white;\r\n    border: none;\r\n    border-radius: 4px;\r\n    font-size: 16px;\r\n    font-weight: 600;\r\n    cursor: pointer;\r\n    transition: background 0.2s;\r\n}\r\n\r\n.stellar-membership-submit:hover {\r\n    background: #005a87;\r\n}\r\n\r\n.stellar-membership-submit:disabled {\r\n    background: #ccc;\r\n    cursor: not-allowed;\r\n}\r\n\r\n.stellar-membership-submit .spinner {\r\n    display: inline-block;\r\n    width: 16px;\r\n    height: 16px;\r\n    margin-left: 8px;\r\n    border: 2px solid #fff;\r\n    border-top-color: transparent;\r\n    border-radius: 50%;\r\n    animation: spin 0.6s linear infinite;\r\n}\r\n\r\n@keyframes spin {\r\n    to { transform: rotate(360deg); }\r\n}\r\n\r\n.membership-note {\r\n    text-align: center;\r\n    margin-top: 15px;\r\n    font-size: 12px;\r\n    color: #666;\r\n}\r\n\r\n.stellar-membership-status {\r\n    margin-top: 20px;\r\n    padding: 12px 15px;\r\n    border-radius: 4px;\r\n}\r\n\r\n.stellar-membership-status.success {\r\n    background: #d4edda;\r\n    color: #155724;\r\n    border: 1px solid #c3e6cb;\r\n}\r\n\r\n.stellar-membership-status.error {\r\n    background: #f8d7da;\r\n    color: #721c24;\r\n    border: 1px solid #f5c6cb;\r\n}\r\n\r\n@media (max-width: 600px) {\r\n    .stellar-membership-container {\r\n        padding: 20px;\r\n    }\r\n\r\n    .membership-header h3 {\r\n        font-size: 24px;\r\n    }\r\n\r\n    .xlm-price {\r\n        font-size: 24px;\r\n    }\r\n\r\n    .usd-price {\r\n        font-size: 14px;\r\n    }\r\n\r\n    .summary-row {\r\n        flex-direction: column;\r\n    }\r\n\r\n    .summary-row strong {\r\n        margin-top: 4px;\r\n    }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function() {\r\n    const form = document.getElementById('stellar-membership-form');\r\n    if (!form) return;\r\n\r\n    const tierXlm = parseFloat(form.querySelector('[name=\"stellar_tier_xlm\"]').value);\r\n    const xlmRate = parseFloat(form.querySelector('[name=\"stellar_xlm_rate\"]').value);\r\n    const donationInput = document.getElementById('stellar_donation_usd');\r\n    const donationConversion = document.getElementById('donation-conversion');\r\n    const donationUsdAmount = document.getElementById('donation-usd-amount');\r\n    const donationXlmAmount = document.getElementById('donation-xlm-amount');\r\n    const customAmountRow = document.getElementById('custom-amount-row');\r\n    const customAmountXlm = document.getElementById('custom-amount-xlm');\r\n    const paymentXlmDisplay = document.getElementById('payment-xlm-display');\r\n    const paymentUsdDisplay = document.getElementById('payment-usd-display');\r\n\r\n    \/**\r\n     * Format number with commas\r\n     *\/\r\n    function formatNumber(num, decimals = 0) {\r\n        return num.toLocaleString('en-US', { maximumFractionDigits: decimals });\r\n    }\r\n\r\n    \/**\r\n     * Update donation conversion display\r\n     *\/\r\n    donationInput.addEventListener('input', function() {\r\n        const usdAmount = parseFloat(this.value) || 0;\r\n\r\n        if (usdAmount > 0) {\r\n            const xlmAmount = Math.ceil(usdAmount \/ xlmRate); \/\/ Round up to ensure sufficient XLM\r\n\r\n            donationUsdAmount.textContent = usdAmount.toFixed(2);\r\n            donationXlmAmount.textContent = formatNumber(xlmAmount);\r\n            donationConversion.style.display = 'block';\r\n\r\n            \/\/ Show custom amount row\r\n            customAmountRow.style.display = 'flex';\r\n            customAmountXlm.textContent = formatNumber(xlmAmount) + ' XLM';\r\n\r\n            \/\/ Update payment summary\r\n            paymentXlmDisplay.textContent = formatNumber(xlmAmount) + ' XLM';\r\n            paymentUsdDisplay.textContent = '\u2248 $' + usdAmount.toFixed(2);\r\n        } else {\r\n            donationConversion.style.display = 'none';\r\n            customAmountRow.style.display = 'none';\r\n\r\n            \/\/ Reset to tier price\r\n            paymentXlmDisplay.textContent = formatNumber(tierXlm) + ' XLM';\r\n            const tierUsd = (tierXlm * xlmRate).toFixed(2);\r\n            paymentUsdDisplay.textContent = '\u2248 $' + tierUsd;\r\n        }\r\n    });\r\n\r\n    \/**\r\n     * Handle form submission\r\n     *\/\r\n    form.addEventListener('submit', function(e) {\r\n        e.preventDefault();\r\n\r\n        const wallet = document.getElementById('stellar_member_wallet').value;\r\n        const tier = document.querySelector('[name=\"stellar_membership_tier\"]').value;\r\n        const autoRenew = document.querySelector('[name=\"stellar_auto_renew\"]').checked;\r\n        const customDonation = parseFloat(donationInput.value) || 0;\r\n\r\n        if (!wallet) {\r\n            showStatus('Please enter your wallet address', 'error');\r\n            return;\r\n        }\r\n\r\n        \/\/ Validate Stellar address format\r\n        if (!\/^G[A-Z2-7]{55}$\/.test(wallet)) {\r\n            showStatus('Invalid Stellar wallet address format', 'error');\r\n            return;\r\n        }\r\n\r\n        \/\/ Calculate final amount\r\n        const finalXlm = customDonation > 0\r\n            ? Math.ceil(customDonation \/ xlmRate)\r\n            : tierXlm;\r\n        const finalUsd = (finalXlm * xlmRate).toFixed(2);\r\n\r\n        \/\/ Disable submit button\r\n        const submitBtn = form.querySelector('button[type=\"submit\"]');\r\n        const spinner = submitBtn.querySelector('.spinner');\r\n        submitBtn.disabled = true;\r\n        spinner.style.display = 'inline-block';\r\n\r\n        \/\/ Log for debugging\r\n        console.log('Membership Form Submission', {\r\n            wallet: wallet,\r\n            tier: tier,\r\n            xlmAmount: finalXlm,\r\n            usdAmount: finalUsd,\r\n            autoRenew: autoRenew\r\n        });\r\n\r\n        showStatus(\r\n            'Processing subscription... Amount: ' + formatNumber(finalXlm) + ' XLM (\u2248 $' + finalUsd + ') ' +\r\n            'You will be redirected to your Stellar wallet',\r\n            'success'\r\n        );\r\n\r\n        setTimeout(() => {\r\n            submitBtn.disabled = false;\r\n            spinner.style.display = 'none';\r\n        }, 3000);\r\n    });\r\n\r\n    \/**\r\n     * Show status message\r\n     *\/\r\n    function showStatus(message, type) {\r\n        const statusEl = document.getElementById('stellar-membership-status');\r\n        statusEl.textContent = message;\r\n        statusEl.className = 'stellar-membership-status ' + type;\r\n        statusEl.style.display = 'block';\r\n\r\n        if (type === 'error') {\r\n            setTimeout(() => {\r\n                statusEl.style.display = 'none';\r\n            }, 5000);\r\n        }\r\n    }\r\n})();\r\n<\/script>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":222,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-176","page","type-page","status-publish","has-post-thumbnail","hentry"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/stellardns.io\/index.php?rest_route=\/wp\/v2\/pages\/176","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stellardns.io\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/stellardns.io\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/stellardns.io\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/stellardns.io\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=176"}],"version-history":[{"count":1,"href":"https:\/\/stellardns.io\/index.php?rest_route=\/wp\/v2\/pages\/176\/revisions"}],"predecessor-version":[{"id":178,"href":"https:\/\/stellardns.io\/index.php?rest_route=\/wp\/v2\/pages\/176\/revisions\/178"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/stellardns.io\/index.php?rest_route=\/wp\/v2\/media\/222"}],"wp:attachment":[{"href":"https:\/\/stellardns.io\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=176"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}