DXN Release

Daily release of DXN for the first 10 years.

by jarosciak

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/5.5.0/echarts.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>DBXen Token Release Simulation</title>
    <style>
        /* CSS styles */
        html, body {
            margin: 0;
            padding: 0;
            height: 100%;
            font-family: 'Arial', sans-serif;
            background-color: #f4f6f8;
        }

        .container {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 100vh;
            max-width: 1400px;
            margin: 0 auto;
            text-align: center;
            padding: 0px;
        }

        h1 {
            font-size: 2.5rem;
            color: #333;
            margin-bottom: 10px;
        }

        .description {
            font-size: 1rem;
            color: #666;
            margin-bottom: 20px;
            max-width: 900px;
            line-height: 1.5;
        }

        #chart {
            width: 95%; /* Take more space */
            height: 70%; /* Larger height */
            border-radius: 10px;
            box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
        }

        .network-select-container {
            margin-bottom: 20px;
        }

        #network-select {
            padding: 5px;
            font-size: 1rem;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>🚀 DBXen Token Release Simulation</h1>
        <div class="description">
            <b>$DXN</b> is minted by burning XEN, with a total supply of <b>5,010,000 DXN</b> released over <b>62 years</b>.<br>
            DXN rewards are distributed in <b>24-hour cycles</b> to all XEN burners, and all fees go to DXN stakers.
        </div>

        <div class="network-select-container">
            <label for="network-select">Select Network: </label>
            <select id="network-select">
                <option...

JavaScript

// Constants
const totalYears = 62;
const numDays = 365 * totalYears;
const initialDailyReward = 10000; // Starting with 10,000 DXN per day
const decayRate = 0.998; // 0.2% decay per cycle
const totalSupply = 5010000; // Total DXN supply

// Genesis dates
const genesisDates = {
    "Ethereum": new Date(Date.UTC(2023, 2, 22, 14, 0, 11)),
    "Avalanche": new Date(Date.UTC(2023, 1, 23, 14, 7, 20)),
    "Base": new Date(Date.UTC(2023, 7, 25, 19, 0, 43)),
    "Binance": new Date(Date.UTC(2023, 2, 9, 1, 57, 40)),
    "Dogechain": new Date(Date.UTC(2023, 2, 16, 11, 55, 14)),
    "ETHPOW": new Date(Date.UTC(2023, 2, 16, 12, 24, 59)),
    "Evmos": new Date(Date.UTC(2023, 2, 16, 12, 20, 1)),
    "Fantom": new Date(Date.UTC(2023, 2, 16, 11, 44, 7)),
    "Moonbeam": new Date(Date.UTC(2023, 2, 16, 12, 3, 30)),
    "OKX": new Date(Date.UTC(2023, 2, 15, 23, 24, 28)),
    "Optimism": new Date(Date.UTC(2023, 8, 21, 14, 0, 23)),
    "Polygon": new Date(Date.UTC(2023, 1, 16, 2, 3, 19)),
    "Pulsechain": new Date(Date.UTC(2023, 9, 23, 13, 9, 45))
};

// Helper functions
function calculateElapsedTime(startDate, endDate) {
    const elapsedMs = endDate.getTime() - startDate.getTime();
    const totalSeconds = Math.floor(elapsedMs / 1000);
    const years = Math.floor(totalSeconds / (365.25 * 24 * 60 * 60));
    const remainingSecondsAfterYears = totalSeconds % (365.25 * 24 * 60 * 60);
    const months = Math.floor(remainingSecondsAfterYears / (30.44 * 24 * 60 * 60));
    const remainingSecondsAfterMonths = remainingSecondsAfterYears % (30.44 * 24 * 60 * 60);
    const days = Math.floor(remainingSecondsAfterMonths / (24 * 60 * 60));

    return `${years} years, ${months} months, ${days} days`;
}

function addDays(date, days) {
    const result = new Date(date);
    result.setUTCDate(result.getUTCDate() + days);
    return result;
}

function formatDate(date) {
    return date.toLocaleDateString('en-US', {
        weekday: 'long',
        year: 'numeric',
        month: 'short',
     ...