jaeswift-website/tokenlauncher/index.html

186 lines
8.8 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JAESWIFT // TOKEN FORGE</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=JetBrains+Mono:wght@300;400;500;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/css/style.css">
<link rel="stylesheet" href="/css/section.css">
<link rel="stylesheet" href="/css/tokenlauncher.css">
</head>
<body>
<div class="scanline-overlay"></div>
<div class="grid-bg"></div>
<nav class="nav-main" id="navbar">
<div class="nav-container">
<a href="/" class="nav-logo">
<span class="logo-bracket">[</span> JAE <span class="logo-bracket">]</span>
</a>
<button class="nav-toggle" id="navToggle" aria-label="Menu">
<span></span><span></span><span></span>
</button>
<ul class="nav-menu" id="navMenu"></ul>
<div class="nav-status">
<span class="nav-clock" id="navClock"></span>
</div>
</div>
</nav>
<div class="breadcrumb">
<a href="/">HOME</a>
<span class="separator">/</span>
<a href="/armoury">ARMOURY</a>
<span class="separator">/</span>
<a href="/armoury/lab.html">LAB</a>
<span class="separator">/</span>
<span class="current">TOKEN FORGE</span>
</div>
<section class="section-header" style="padding-top: calc(var(--nav-height) + 1.5rem);">
<div class="section-header-label">LAB // SPL TOKEN LAUNCHER</div>
<h1 class="section-header-title">TOKEN FORGE</h1>
<p class="section-header-sub">&gt; Deploy custom SPL tokens on Solana. Set name, symbol, supply, and metadata &mdash; launch in one transaction.</p>
</section>
<div class="tf-container">
<!-- Wallet Bar -->
<div class="tf-wallet-bar">
<div class="tf-wallet-status" id="wallet-status">&#9675; NOT CONNECTED</div>
<button class="tf-wallet-btn" id="wallet-btn">CONNECT WALLET</button>
</div>
<!-- Status Panel (hidden by default, shown during deploy) -->
<div class="tf-status" id="status-panel">
<div class="tf-status-header">
<div class="tf-spinner" id="status-spinner"></div>
<div class="tf-status-title" id="status-title">BUILDING TRANSACTION</div>
</div>
<div class="tf-status-body" id="status-body"></div>
</div>
<!-- Token Configuration Form -->
<div class="tf-form">
<div class="tf-form-title">TOKEN CONFIGURATION</div>
<div class="tf-form-grid">
<!-- Token Name -->
<div class="tf-field">
<label class="tf-label" for="token-name">TOKEN NAME</label>
<input type="text" class="tf-input" id="token-name" placeholder="e.g. JAESWIFT TOKEN" maxlength="32" autocomplete="off" spellcheck="false">
<div class="tf-label-hint">Max 32 characters. Displayed on explorers and wallets.</div>
</div>
<!-- Token Symbol -->
<div class="tf-field">
<label class="tf-label" for="token-symbol">SYMBOL / TICKER</label>
<input type="text" class="tf-input" id="token-symbol" placeholder="e.g. JAE" maxlength="10" autocomplete="off" spellcheck="false" style="text-transform:uppercase">
<div class="tf-label-hint">Max 10 characters. The trading ticker for your token.</div>
</div>
<!-- Total Supply -->
<div class="tf-field">
<label class="tf-label" for="token-supply">TOTAL SUPPLY</label>
<input type="number" class="tf-input" id="token-supply" placeholder="e.g. 1000000000" min="1" step="1" autocomplete="off">
<div class="tf-label-hint">Whole number. The total number of tokens to mint.</div>
</div>
<!-- Decimals -->
<div class="tf-field">
<label class="tf-label" for="token-decimals">DECIMALS</label>
<select class="tf-select" id="token-decimals">
<option value="0">0 &mdash; No fractions</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6" selected>6 &mdash; Standard (like USDC)</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9 &mdash; Maximum</option>
</select>
<div class="tf-label-hint">6 is standard for most tokens. Determines fractional precision.</div>
</div>
<!-- Token Image URL -->
<div class="tf-field full-width">
<label class="tf-label" for="token-image">TOKEN IMAGE URL</label>
<input type="url" class="tf-input" id="token-image" placeholder="https://example.com/token-logo.png" autocomplete="off" spellcheck="false">
<div class="tf-label-hint">Optional. URL to your token&rsquo;s logo image (PNG/SVG). Must be publicly accessible and hosted elsewhere.</div>
</div>
<!-- Description -->
<div class="tf-field full-width">
<label class="tf-label" for="token-desc">DESCRIPTION</label>
<textarea class="tf-textarea" id="token-desc" placeholder="A brief description of your token..." rows="3" spellcheck="false"></textarea>
<div class="tf-label-hint">Optional. Shown on token explorers and metadata records.</div>
</div>
<!-- Authority Revocation -->
<div class="tf-checkboxes">
<label class="tf-checkbox-wrap">
<input type="checkbox" id="revoke-mint" checked>
<div class="tf-checkbox-text">
<span class="tf-checkbox-label">REVOKE MINT AUTHORITY</span>
<span class="tf-checkbox-rec">RECOMMENDED &mdash; Prevents creating more tokens after launch</span>
</div>
</label>
<label class="tf-checkbox-wrap">
<input type="checkbox" id="revoke-freeze" checked>
<div class="tf-checkbox-text">
<span class="tf-checkbox-label">REVOKE FREEZE AUTHORITY</span>
<span class="tf-checkbox-rec">RECOMMENDED &mdash; Prevents freezing holder wallets</span>
</div>
</label>
</div>
<!-- Fee Breakdown -->
<div class="tf-fee-section">
<div class="tf-fee-title">COST BREAKDOWN</div>
<div class="tf-fee-row">
<span class="tf-fee-label">SERVICE FEE</span>
<span class="tf-fee-value">0.1 SOL</span>
</div>
<div class="tf-fee-row">
<span class="tf-fee-label">NETWORK FEES (rent + tx)</span>
<span class="tf-fee-value">~0.015 SOL</span>
</div>
<div class="tf-fee-row tf-fee-total">
<span class="tf-fee-label">ESTIMATED TOTAL</span>
<span class="tf-fee-value">~0.115 SOL</span>
</div>
</div>
<!-- Deploy Button -->
<div class="tf-deploy-section">
<button class="tf-deploy-btn" id="deploy-btn" disabled>DEPLOY TOKEN</button>
</div>
</div>
</div>
</div>
<footer class="footer">
<div class="footer-container">
<div class="footer-left">
<span class="footer-logo">[JAE]</span>
<span class="footer-copy">&copy; 2026 JAESWIFT.XYZ</span>
</div>
<div class="footer-right">
<span class="footer-signal">SIGNAL &#9608;&#9608;&#9608;&#9608;<span class="signal-flicker">&#9608;</span></span>
</div>
</div>
</footer>
<script src="/js/wallet-connect.js"></script>
<script src="/js/nav.js"></script>
<script src="/js/clock.js"></script>
<script src="https://unpkg.com/@solana/web3.js@1.98.0/lib/index.iife.min.js"></script>
<script src="/js/tokenlauncher.js"></script>
</body>
</html>