Variation CR
${formatNumber(crB*100)}%
Uplift
${uplift >= 0 ? '+' : ''}${isFinite(uplift) ? formatNumber(uplift) : 'N/A'}%
Visitors (A/B)
${formatNumber(vA,0)} / ${formatNumber(vB,0)}
Interpretation
${resultText}
`;
renderResult('ab-result-container', reportHtml, 'ab-test-report.pdf', chartData, chartFunction);
});
}
// 3. Sample Size Calculator
if (calcSsBtn) {
calcSsBtn.addEventListener('click', () => {
const baselineCr = getInputValue('ss-baseline-cr') / 100;
const mde = getInputValue('ss-mde') / 100;
const zAlpha = parseFloat(document.getElementById('ss-confidence').value);
const zBeta = parseFloat(document.getElementById('ss-power').value);
const confidenceText = document.getElementById('ss-confidence').options[document.getElementById('ss-confidence').selectedIndex].text;
const powerText = document.getElementById('ss-power').options[document.getElementById('ss-power').selectedIndex].text;
if (baselineCr <= 0 || mde <= 0) {
showNotification('Please enter a valid Baseline CR and MDE.', true);
return;
}
const p1 = baselineCr;
const p2 = baselineCr * (1 + mde);
const delta = p2 - p1;
const numerator = Math.pow((zAlpha * Math.sqrt(2 * p1 * (1 - p1))) + (zBeta * Math.sqrt(p1 * (1 - p1) + p2 * (1 - p2))), 2);
const denominator = Math.pow(delta, 2);
const sampleSize = Math.ceil(numerator / denominator);
const reportHtml = `
Required Sample Size
Visitors Per Variation
${formatNumber(sampleSize, 0)}
Total Visitors Needed: ${formatNumber(sampleSize * 2, 0)}
Test Parameters
Baseline CR
${formatNumber(baselineCr*100)}%
Min. Detectable Effect
${formatNumber(mde*100)}%
Significance
${confidenceText}
Statistical Power
${powerText}
Why This Matters
An adequate sample size is crucial for a reliable A/B test. Too small a sample can lead to inconclusive results, while too large a sample wastes resources. This calculation ensures your test has enough statistical power to confidently detect a meaningful change in performance.
`;
renderResult('ss-result-container', reportHtml, 'sample-size-report.pdf');
});
}
// 4. Revenue Impact Calculator
if (calcRiBtn) {
calcRiBtn.addEventListener('click', () => {
const visitors = getInputValue('ri-visitors');
const currentCr = getInputValue('ri-current-cr') / 100;
const targetCr = getInputValue('ri-target-cr') / 100;
const aov = getInputValue('ri-aov');
if (visitors <= 0 || currentCr < 0 || targetCr < 0 || aov <= 0) {
showNotification('Please enter valid, positive numbers for all fields.', true);
return;
}
const currentRevenue = visitors * currentCr * aov;
const targetRevenue = visitors * targetCr * aov;
const additionalRevenue = targetRevenue - currentRevenue;
const chartData = { currentRevenue, targetRevenue };
const chartFunction = (data) => {
const ctx = document.getElementById('revenueChart');
if(!ctx) return;
new Chart(ctx, {
type: 'bar',
data: {
labels: ['Current Revenue', 'Projected Revenue'],
datasets: [{
label: 'Monthly Revenue ($)',
data: [data.currentRevenue, data.targetRevenue],
backgroundColor: ['#fca5a5', '#4ade80'],
borderColor: ['#ef4444', '#22c55e'],
borderWidth: 1
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
scales: { y: { beginAtZero: true } },
plugins: { legend: { display: false }, title: { display: true, text: 'Revenue Comparison', font: { size: 16 } } }
}
});
};
const reportHtml = `
Potential Revenue Growth
Estimated Additional Monthly Revenue
${formatCurrency(additionalRevenue)}
Interpretation
This report estimates the financial impact of improving your conversion rate from ${formatNumber(currentCr*100)}% to ${formatNumber(targetCr*100)}%. Even small increases in conversion rate can lead to significant revenue growth over time, demonstrating the high value of conversion rate optimization (CRO) efforts.
`;
renderResult('ri-result-container', reportHtml, 'revenue-impact-report.pdf', chartData, chartFunction);
});
}
// Initialize first tab view
updateTabState();
});
