251 lines
7.0 KiB
HTML
251 lines
7.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Random Binary Generator with Monobit Test</title>
|
|
<style>
|
|
:root {
|
|
--bg-color: #030712;
|
|
--card-bg: #0b0f19;
|
|
--border-color: #1f293d;
|
|
--input-bg: #030712;
|
|
--text-main: #f9fafb;
|
|
--text-muted: #6b7280;
|
|
|
|
--primary: #2563eb;
|
|
--primary-hover: #1d4ed8;
|
|
|
|
--success-bg: rgba(6, 78, 59, 0.2);
|
|
--success-border: #059669;
|
|
--success-text: #34d399;
|
|
|
|
--error-bg: rgba(127, 29, 29, 0.2);
|
|
--error-border: #dc2626;
|
|
--error-text: #f87171;
|
|
}
|
|
|
|
body {
|
|
font-family: system-ui, -apple-system, sans-serif;
|
|
max-width: 500px;
|
|
margin: 40px auto;
|
|
padding: 0 20px;
|
|
line-height: 1.5;
|
|
background-color: var(--bg-color);
|
|
color: var(--text-main);
|
|
}
|
|
.card {
|
|
background-color: var(--card-bg);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 8px;
|
|
padding: 24px;
|
|
box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.8);
|
|
}
|
|
h2 {
|
|
margin-top: 0;
|
|
color: var(--text-main);
|
|
font-size: 1.35rem;
|
|
letter-spacing: -0.01em;
|
|
}
|
|
label {
|
|
display: block;
|
|
font-weight: 600;
|
|
margin-bottom: 8px;
|
|
color: var(--text-main);
|
|
font-size: 0.9rem;
|
|
}
|
|
input[type="number"] {
|
|
width: 100%;
|
|
padding: 10px 12px;
|
|
box-sizing: border-box;
|
|
margin-bottom: 16px;
|
|
background-color: var(--input-bg);
|
|
border: 1px solid var(--border-color);
|
|
border-radius: 6px;
|
|
color: var(--text-main);
|
|
font-size: 1rem;
|
|
}
|
|
input[type="number"]:focus {
|
|
outline: 2px solid var(--primary);
|
|
border-color: transparent;
|
|
}
|
|
button {
|
|
width: 100%;
|
|
padding: 12px;
|
|
background-color: var(--primary);
|
|
color: #ffffff;
|
|
border: none;
|
|
border-radius: 6px;
|
|
font-size: 0.95rem;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
transition: background-color 0.15s ease;
|
|
}
|
|
button:hover {
|
|
background-color: var(--primary-hover);
|
|
}
|
|
.info {
|
|
margin-top: 14px;
|
|
font-size: 0.85rem;
|
|
color: var(--text-muted);
|
|
}
|
|
.status {
|
|
margin-top: 16px;
|
|
padding: 12px;
|
|
border-radius: 6px;
|
|
display: none;
|
|
font-size: 0.85rem;
|
|
line-height: 1.6;
|
|
}
|
|
.status.success {
|
|
background-color: var(--success-bg);
|
|
color: var(--success-text);
|
|
border: 1px solid var(--success-border);
|
|
}
|
|
.status.error {
|
|
background-color: var(--error-bg);
|
|
color: var(--error-text);
|
|
border: 1px solid var(--error-border);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="card">
|
|
<h2>CSPRNG Binary Generator</h2>
|
|
<label for="multiplier">Enter Max Message Length (X*16-bits):</label>
|
|
<input type="number" id="multiplier" min="1" value="600" placeholder="Enter an integer">
|
|
|
|
<button id="generateBtn">Generate, Validate & Download</button>
|
|
|
|
<div class="info" id="bitCountInfo">
|
|
Total bits: 9,600 bits (1,200 bytes)
|
|
</div>
|
|
|
|
<div id="statusBox" class="status"></div>
|
|
</div>
|
|
|
|
<script>
|
|
const multiplierInput = document.getElementById('multiplier');
|
|
const bitCountInfo = document.getElementById('bitCountInfo');
|
|
const generateBtn = document.getElementById('generateBtn');
|
|
const statusBox = document.getElementById('statusBox');
|
|
|
|
multiplierInput.addEventListener('input', () => {
|
|
const x = parseInt(multiplierInput.value, 10) || 0;
|
|
const bits = x * 16;
|
|
const bytes = bits / 8;
|
|
bitCountInfo.textContent = `Total bits: ${bits.toLocaleString()} bits (${bytes.toLocaleString()} bytes)`;
|
|
});
|
|
|
|
// Trigger generator when pressing Enter inside the input field
|
|
multiplierInput.addEventListener('keydown', (event) => {
|
|
if (event.key === 'Enter') {
|
|
event.preventDefault();
|
|
generateBtn.click();
|
|
}
|
|
});
|
|
|
|
// Complementary error function approximation (NIST randomness testing helper)
|
|
function erfc(x) {
|
|
const z = Math.abs(x);
|
|
const t = 1.0 / (1.0 + 0.5 * z);
|
|
const ans = t * Math.exp(-z * z - 1.26551223 +
|
|
t * (1.00002368 +
|
|
t * (0.37409196 +
|
|
t * (0.09678418 +
|
|
t * (-0.18628806 +
|
|
t * (0.27886807 +
|
|
t * (-1.13520398 +
|
|
t * (1.48851587 +
|
|
t * (-0.82215223 +
|
|
t * 0.17087277))))))))) ;
|
|
return x >= 0 ? ans : 2.0 - ans;
|
|
}
|
|
|
|
// NIST SP 800-22 Frequency (Monobit) Test
|
|
function runMonobitTest(uint8Array) {
|
|
let sum = 0;
|
|
const totalBits = uint8Array.length * 8;
|
|
|
|
for (let i = 0; i < uint8Array.length; i++) {
|
|
let byte = uint8Array[i];
|
|
for (let bit = 0; bit < 8; bit++) {
|
|
// Convert bit (0 -> -1, 1 -> +1)
|
|
sum += ((byte >> bit) & 1) ? 1 : -1;
|
|
}
|
|
}
|
|
|
|
const sObs = Math.abs(sum) / Math.sqrt(totalBits);
|
|
const pValue = erfc(sObs / Math.sqrt(2));
|
|
|
|
// NIST standard threshold: p-value must be >= 0.01 to pass
|
|
return {
|
|
passed: pValue >= 0.01,
|
|
pValue: pValue,
|
|
totalBits: totalBits,
|
|
onesCount: (totalBits + sum) / 2
|
|
};
|
|
}
|
|
|
|
// Helper to generate a cryptographically secure 8-digit random integer string
|
|
function generateRandom8Digits() {
|
|
const randomBuffer = new Uint32Array(1);
|
|
window.crypto.getRandomValues(randomBuffer);
|
|
const num = 10000000 + (randomBuffer[0] % 90000000);
|
|
return num.toString();
|
|
}
|
|
|
|
generateBtn.addEventListener('click', () => {
|
|
statusBox.style.display = 'none';
|
|
const x = parseInt(multiplierInput.value, 10);
|
|
|
|
if (isNaN(x) || x < 1) {
|
|
alert('Please enter a valid positive integer for X.');
|
|
return;
|
|
}
|
|
|
|
const byteCount = x * 2;
|
|
const buffer = new Uint8Array(byteCount);
|
|
|
|
try {
|
|
// 1. Generate CSPRNG bytes
|
|
window.crypto.getRandomValues(buffer);
|
|
|
|
// 2. Perform Randomness Check
|
|
const testResult = runMonobitTest(buffer);
|
|
|
|
if (!testResult.passed) {
|
|
statusBox.className = 'status error';
|
|
statusBox.innerHTML = `<strong>Test Failed!</strong><br>Sequence failed Monobit randomness test (P-value: ${testResult.pValue.toFixed(4)} < 0.01). Download aborted.`;
|
|
statusBox.style.display = 'block';
|
|
return;
|
|
}
|
|
|
|
// Display Success Stats
|
|
statusBox.className = 'status success';
|
|
statusBox.innerHTML = `<strong>Randomness Test Passed!</strong><br>` +
|
|
`P-value: ${testResult.pValue.toFixed(4)} (≥ 0.01)<br>` +
|
|
`Bit distribution: ${testResult.onesCount} ones out of ${testResult.totalBits} bits.`;
|
|
statusBox.style.display = 'block';
|
|
|
|
// 3. Trigger Download with random 8-digit prefix
|
|
const randomPrefix = generateRandom8Digits();
|
|
const blob = new Blob([buffer], { type: 'application/octet-stream' });
|
|
const url = URL.createObjectURL(blob);
|
|
const a = document.createElement('a');
|
|
a.href = url;
|
|
a.download = `${randomPrefix}_onetime_${x}x16bits.pad`;
|
|
document.body.appendChild(a);
|
|
a.click();
|
|
|
|
document.body.removeChild(a);
|
|
URL.revokeObjectURL(url);
|
|
} catch (error) {
|
|
alert('An error occurred during process: ' + error.message);
|
|
}
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
</html> |