|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>DashWallet Creator</title> |
|
|
<link rel="icon" type="image/x-icon" href="/static/favicon.ico"> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<script src="https://unpkg.com/feather-icons"></script> |
|
|
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
|
|
<script src="https://cdn.jsdelivr.net/npm/three@0.132.2/build/three.min.js"></script> |
|
|
<script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script> |
|
|
<style> |
|
|
.bg-dash { |
|
|
background: linear-gradient(135deg, #001233 0%, #00041a 100%); |
|
|
} |
|
|
.wallet-card { |
|
|
backdrop-filter: blur(16px); |
|
|
background: rgba(0, 10, 50, 0.4); |
|
|
border: 1px solid rgba(0, 140, 231, 0.3); |
|
|
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3); |
|
|
transition: all 0.3s ease; |
|
|
} |
|
|
.wallet-card:hover { |
|
|
border-color: rgba(0, 140, 231, 0.6); |
|
|
box-shadow: 0 8px 32px rgba(0, 140, 231, 0.2); |
|
|
} |
|
|
.download-btn:hover { |
|
|
transform: translateY(-4px); |
|
|
box-shadow: 0 12px 24px rgba(0, 140, 231, 0.4); |
|
|
filter: brightness(1.1); |
|
|
} |
|
|
input:focus { |
|
|
box-shadow: 0 0 0 4px rgba(0, 140, 231, 0.4); |
|
|
transform: scale(1.02); |
|
|
transition: all 0.2s ease; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="min-h-screen bg-dash text-white"> |
|
|
<div id="vanta-bg" class="fixed inset-0 z-0"></div> |
|
|
<div class="absolute inset-0 z-0 bg-gradient-to-b from-transparent to-black opacity-30"></div> |
|
|
<div class="container mx-auto px-4 py-12 relative z-10 transform-gpu"> |
|
|
<div class="max-w-md mx-auto text-center mb-12"> |
|
|
<div class="flex justify-center mb-6"> |
|
|
<svg width="64" height="64" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> |
|
|
<path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" stroke="#008CE7" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> |
|
|
<path d="M12 8V16" stroke="#008CE7" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> |
|
|
<path d="M8 12H16" stroke="#008CE7" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> |
|
|
</svg> |
|
|
</div> |
|
|
<h1 class="text-4xl font-bold mb-4">Create Your <span class="text-blue-300">Dash</span> Wallet</h1> |
|
|
<p class="text-blue-100">Generate and download your secure Dash cryptocurrency wallet credentials</p> |
|
|
</div> |
|
|
|
|
|
<div class="wallet-card rounded-2xl p-8 shadow-2xl max-w-md mx-auto"> |
|
|
<form id="walletForm" class="space-y-6"> |
|
|
<div> |
|
|
<label for="username" class="block text-sm font-medium mb-2">Username</label> |
|
|
<input type="text" id="username" class="w-full px-4 py-3 rounded-lg bg-white bg-opacity-10 border border-blue-300 border-opacity-30 text-white placeholder-blue-200 focus:outline-none focus:border-blue-400" placeholder="your_username" required> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<label for="password" class="block text-sm font-medium mb-2">Password</label> |
|
|
<div class="relative"> |
|
|
<input type="password" id="password" class="w-full px-4 py-3 rounded-lg bg-white bg-opacity-10 border border-blue-300 border-opacity-30 text-white placeholder-blue-200 focus:outline-none focus:border-blue-400" placeholder="••••••••" required> |
|
|
<button type="button" class="absolute right-3 top-3 text-blue-200 hover:text-blue-100" onclick="togglePassword()"> |
|
|
<i data-feather="eye"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<label for="email" class="block text-sm font-medium mb-2">Email (optional)</label> |
|
|
<input type="email" id="email" class="w-full px-4 py-3 rounded-lg bg-white bg-opacity-10 border border-blue-300 border-opacity-30 text-white placeholder-blue-200 focus:outline-none focus:border-blue-400" placeholder="your@email.com"> |
|
|
</div> |
|
|
|
|
|
<div class="pt-2"> |
|
|
<button type="submit" class="w-full py-3 px-4 bg-blue-500 hover:bg-blue-600 rounded-lg font-medium transition duration-200 flex items-center justify-center"> |
|
|
<i data-feather="key" class="mr-2"></i> Generate Wallet |
|
|
</button> |
|
|
</div> |
|
|
</form> |
|
|
|
|
|
<div id="walletInfo" class="hidden mt-8 space-y-4"> |
|
|
<div class="flex items-center justify-between border-b border-blue-400 border-opacity-30 pb-2"> |
|
|
<span class="font-medium">Wallet Address:</span> |
|
|
<span id="walletAddress" class="font-mono text-blue-300">DASH-XXXXXXXXXXXXXXXX</span> |
|
|
</div> |
|
|
<div class="flex items-center justify-between border-b border-blue-400 border-opacity-30 pb-2"> |
|
|
<span class="font-medium">Private Key:</span> |
|
|
<span id="privateKey" class="font-mono text-blue-300 truncate">XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</span> |
|
|
</div> |
|
|
<div class="flex items-center justify-between"> |
|
|
<span class="font-medium">Recovery Phrase:</span> |
|
|
<span id="recoveryPhrase" class="font-mono text-blue-300 truncate">word1 word2 word3...</span> |
|
|
</div> |
|
|
|
|
|
<div class="pt-6"> |
|
|
<button id="downloadBtn" class="download-btn w-full py-3 px-4 bg-green-500 hover:bg-green-600 rounded-lg font-medium transition duration-200 flex items-center justify-center"> |
|
|
<i data-feather="download" class="mr-2"></i> Download Wallet File |
|
|
</button> |
|
|
</div> |
|
|
|
|
|
<div class="text-xs text-blue-200 text-center pt-4"> |
|
|
<i data-feather="alert-triangle" class="inline mr-1"></i> Save this information securely! It cannot be recovered if lost. |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
|
|
|
VANTA.GLOBE({ |
|
|
el: "#vanta-bg", |
|
|
mouseControls: true, |
|
|
touchControls: true, |
|
|
gyroControls: false, |
|
|
minHeight: 200.00, |
|
|
minWidth: 200.00, |
|
|
scale: 1.00, |
|
|
scaleMobile: 1.00, |
|
|
color: 0x008ce7, |
|
|
backgroundColor: 0x0a0a2a, |
|
|
size: 1.00, |
|
|
rings: 12, |
|
|
points: 12.00 |
|
|
}); |
|
|
|
|
|
function generateWalletData() { |
|
|
const username = document.getElementById('username').value; |
|
|
const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; |
|
|
const words = ['dash', 'crypto', 'wallet', 'secure', 'private', 'key', 'blockchain', 'digital', 'money', 'finance', 'currency', 'decentralized']; |
|
|
|
|
|
|
|
|
let address = 'DASH-'; |
|
|
for (let i = 0; i < 16; i++) { |
|
|
address += chars.charAt(Math.floor(Math.random() * chars.length)); |
|
|
} |
|
|
|
|
|
|
|
|
let privateKey = ''; |
|
|
for (let i = 0; i < 32; i++) { |
|
|
privateKey += chars.charAt(Math.floor(Math.random() * chars.length)); |
|
|
} |
|
|
|
|
|
|
|
|
let recoveryPhrase = []; |
|
|
for (let i = 0; i < 12; i++) { |
|
|
recoveryPhrase.push(words[Math.floor(Math.random() * words.length)]); |
|
|
} |
|
|
|
|
|
return { |
|
|
username, |
|
|
address, |
|
|
privateKey, |
|
|
recoveryPhrase: recoveryPhrase.join(' '), |
|
|
timestamp: new Date().toISOString() |
|
|
}; |
|
|
} |
|
|
|
|
|
|
|
|
function togglePassword() { |
|
|
const passwordInput = document.getElementById('password'); |
|
|
if (passwordInput.type === 'password') { |
|
|
passwordInput.type = 'text'; |
|
|
} else { |
|
|
passwordInput.type = 'password'; |
|
|
} |
|
|
feather.replace(); |
|
|
} |
|
|
|
|
|
|
|
|
function downloadWalletData(data) { |
|
|
const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application/json' }); |
|
|
const url = URL.createObjectURL(blob); |
|
|
const a = document.createElement('a'); |
|
|
a.href = url; |
|
|
a.download = `dash_wallet_${data.username}.json`; |
|
|
document.body.appendChild(a); |
|
|
a.click(); |
|
|
document.body.removeChild(a); |
|
|
URL.revokeObjectURL(url); |
|
|
} |
|
|
|
|
|
|
|
|
document.getElementById('walletForm').addEventListener('submit', function(e) { |
|
|
e.preventDefault(); |
|
|
|
|
|
const walletData = generateWalletData(); |
|
|
|
|
|
|
|
|
document.getElementById('walletAddress').textContent = walletData.address; |
|
|
document.getElementById('privateKey').textContent = walletData.privateKey; |
|
|
document.getElementById('recoveryPhrase').textContent = walletData.recoveryPhrase; |
|
|
document.getElementById('walletInfo').classList.remove('hidden'); |
|
|
|
|
|
|
|
|
document.getElementById('downloadBtn').addEventListener('click', function() { |
|
|
downloadWalletData(walletData); |
|
|
}); |
|
|
|
|
|
|
|
|
document.getElementById('walletInfo').scrollIntoView({ behavior: 'smooth' }); |
|
|
}); |
|
|
|
|
|
|
|
|
feather.replace(); |
|
|
</script> |
|
|
</body> |
|
|
</html> |
|
|
|
