Financial Decision Simulator - Tax Bracket Challenge
About this app
Join a salaryman in navigating new financial dynamics as he balances a tighter budget and adjusts his investments in light of a new tax bracket.
Financial Decision Simulator - Tax Bracket Challenge Help Tom Navigate His New Tax Challenge! Submit Decision Next Scenario
Related apps
IPTV M3U8 & EPG Generator Studio | Image to M3U Playlist & Guide
Image to IPTV Converter & M3U Playlist Generator
Image to IPTV Converter & M3U Playlist Generator
Image to M3U Playlist Converter | IPTV & Media Stream Generator
Roulette Row Predictor Pro - Live Pattern & Trend Stats Analyzer
Video to Repeated Sequence Generator - Rhythm & Glitch Loop Maker
LoopCraft - Video to Repeated Sequence Converter
LoopMatrix - Video Sequence Repeater & Stutter Maker
MuffleFX - Video & Audio Low-Pass Filter Studio
Seeding Rate Calculator
Irrigation Set Time Calculator
Fertilizer Nutrient Units Calculator
Put this on your site
Source
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Financial Decision Simulator - Tax Bracket Challenge</title>
<meta name="description" content="Join a salaryman in navigating new financial dynamics as he balances a tighter budget and adjusts his investments in light of a new tax bracket.">
<meta name="keywords" content="financial decisions, tax bracket, budgeting, retirement, investments, elderly care, net income, salaryman">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.min.js" crossorigin="anonymous"></script>
<script type="text/javascript">
let currentScenario = 1;
let knowledgeScore = 0;
const totalScenarios = 2;
document.addEventListener("DOMContentLoaded", function() {
loadScenario();
$("#submit-button").on("click", function() {
const userChoice = $("input[name='decision']:checked").val();
checkChoice(userChoice);
});
$("#next-scenario-button").on("click", function() {
currentScenario++;
loadScenario();
});
});
function loadScenario() {
if (currentScenario > totalScenarios) {
showFinalOutcome();
return;
}
$("#scenario").text(`Scenario ${currentScenario}`);
const caseStudy = createScenario(currentScenario);
$("#context").text(caseStudy.description);
let choicesHtml = caseStudy.choices.map((choice) => `<label><input type="radio" name="decision" value="${choice.value}"> ${choice.text}</label><br>`).join("");
$("#decision-container").html(choicesHtml);
$("#feedback").text('');
$("#next-scenario-button").hide();
}
function checkChoice(userChoice) {
const caseStudy = createScenario(currentScenario);
if (userChoice === caseStudy.correctChoice) {
knowledgeScore += 1;
$("#feedback").text("Great decision! You're on the right track! 🎉").css("color", "green");
} else {
$("#feedback").text(`${caseStudy.feedback}. A wiser choice was: ${caseStudy.bestOutcome}`).css("color", "red");
}
$("#next-scenario-button").show();
}
function createScenario(level) {
const scenarios = [
{
description: "Meet Tom, a salaryman recently thrust into a 35% tax bracket. With rising living costs, including expenditure for his elderly parents' care, Tom must now allocate his 70/20/10 budget where 70% is for Living Costs, 20% for Investments, and 10% for Savings. Currently, he spends excessively on traditional investments, risking his take-home pay.",
correctChoice: "Option A",
choices: [
{ value: "Option A", text: "Shift 20% of traditional investments into a tax-deferred account like an IRA." },
{ value: "Option B", text: "Continue funding traditional investments without changes." }
],
feedback: "Continuing with traditional investments might cost him comfortable margins due to high taxation.",
bestOutcome: "Adapting investments allows for longer-term savings and reduces immediate tax liability."
},
{
description: "After reallocating his budget, Tom finds a significant portion of his monthly living costs consumed by elderly care. He realizes adjustments to personal spending, especially existing debts need to come into play as well.",
correctChoice: "Option B",
choices: [
{ value: "Option A", text: "Cut down personal entertainment expenses strictly." },
{ value: "Option B", text: "Prioritize negotiating debt payment timings for better cash flow." }
],
feedback: "Solely reducing entertainment may not provide sufficient flexibility for elderly care costs.",
bestOutcome: "Focusing on debt management can improve both cash flow and quality of care for parents."
}
];
return scenarios[level - 1];
}
function showFinalOutcome() {
$("#main-container").html(`<h2>Your Knowledge Score: ${knowledgeScore} out of ${totalScenarios}</h2><button id="restart-button" class="btn btn-primary">Play Again</button>`);
$("#restart-button").on("click", function() {
currentScenario = 1;
knowledgeScore = 0;
loadScenario();
});
}
</script>
<style>
body {
background: linear-gradient(to right, #ffcc80, #fff8e1);
color: #6d4c41;
font-family: 'Roboto', sans-serif;
}
#main-container {
text-align: center;
margin-top: 50px;
}
#feedback {
margin-top: 20px;
font-size: 20px;
font-weight: bold;
}
#decision-container {
margin: 20px;
font-size: 18px;
}
</style>
</head>
<body>
<div id="main-container" class="container">
<h1>Help Tom Navigate His New Tax Challenge!</h1>
<div id="scenario" class="my-4"></div>
<div id="context" class="my-4"></div>
<div id="decision-container"></div>
<button id="submit-button" class="btn btn-success">Submit Decision</button>
<button id="next-scenario-button" class="btn btn-info" style="display:none;">Next Scenario</button>
<div id="feedback"></div>
</div>
</body>
</html>
NEW APPS
These are apps made by the community!