export default function Calculator() { // Function to calculate videos based on budget and cost per video function calculateVideos(budget, costPerVideo) { return Math.floor(budget / costPerVideo); } // Function to calculate total views based on budget and CPM function calculateViews(budget, cpm) { return Math.floor((budget / cpm) * 1000); } // Function for ceiling budget calculations function calculateCeilingBudget(groundBudget, bonusCosts) { return groundBudget + bonusCosts; } // Function for ground budget calculations function calculateGroundBudget(ceilingBudget, bonusCosts) { return ceilingBudget - bonusCosts; } // Event listener for input changes to update calculations function updateCalculations() { const budget = parseFloat(document.getElementById("budgetInput").value) || 0; const costPerVideo = parseFloat(document.getElementById("costPerVideo").value) || 20; const cpm = parseFloat(document.getElementById("cpm").value) || 5; const bonusCosts = parseFloat(document.getElementById("bonusCosts").value) || 0; // Perform calculations const videos = calculateVideos(budget, costPerVideo); const views = calculateViews(budget, cpm); const ceilingBudget = calculateCeilingBudget(budget, bonusCosts); const groundBudget = calculateGroundBudget(ceilingBudget, bonusCosts); // Display results document.getElementById("videosOutput").textContent = videos; document.getElementById("viewsOutput").textContent = views; document.getElementById("ceilingBudgetOutput").textContent = ceilingBudget.toFixed(2); document.getElementById("groundBudgetOutput").textContent = groundBudget.toFixed(2); } // Add event listeners after mounting the component setTimeout(() => { document.getElementById("budgetInput").addEventListener("input", updateCalculations); document.getElementById("costPerVideo").addEventListener("input", updateCalculations); document.getElementById("cpm").addEventListener("input", updateCalculations); document.getElementById("bonusCosts").addEventListener("input", updateCalculations); }, 100); // Return the JSX for the component return (

Estimated Videos: 0

Estimated Views: 0

Ceiling Budget (€): 0.00

Ground Budget (€): 0.00

); } return (

Estimated Videos: 0

Estimated Views: 0

Ceiling Budget (€): 0.00

Ground Budget (€): 0.00

);