-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
78 lines (73 loc) · 3.68 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html>
<html>
<head>
<title>Mentoring Program ROI Calculator</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="calc.css">
<script>
function calculateEmployeesRetained() {
var employeesInProgram = parseInt(document.getElementById("employeesInProgram").value);
var employeesRetained = Math.floor(employeesInProgram * 0.49); // 49% are likely to be retained
document.getElementById("employeesRetained").value = employeesRetained;
}
function calculateROI() {
var employeesRetained = parseInt(document.getElementById("employeesRetained").value);
var averageSalary = parseFloat(document.getElementById("averageSalary").value.replace('£',''));
var replacementCostMultiplier = parseFloat(document.getElementById("replacementCostMultiplier").value);
var mentoringSoftwareCosts = parseFloat(document.getElementById("mentoringSoftwareCosts").value.replace('£',''));
var employeeReplacementCost = averageSalary * replacementCostMultiplier;
var retentionSavings = employeesRetained * employeeReplacementCost;
var programROI = (retentionSavings / mentoringSoftwareCosts);
document.getElementById("averageSalary").value = "£" + averageSalary.toFixed(0);
document.getElementById("mentoringSoftwareCosts").value = "£" + mentoringSoftwareCosts.toFixed(0);
document.getElementById("result").innerHTML = "Program ROI: " + programROI.toFixed(0) + "%";
}
window.onload = function() {
document.getElementById("employeesInProgram").addEventListener('input', calculateEmployeesRetained);
calculateEmployeesRetained(); // Calculate initial Employees Retained
}
</script>
</head>
<body>
<div class="calculator-container">
<div class="calculator-form">
<div class="form-row">
<label for="employeesInProgram">
# Employees in Program:
<div class="tooltip">
<img src="https://assets-global.website-files.com/5ce11396d0cadb55a02cabf7/645610087006e13277602b8a_Group%201849.svg" class="tool-tip-icon">
<span class="tooltip-text">Approximately 49% of employees that take part in mentoring are more likely to stay.</span>
</div>
</label>
<input type="number" id="employeesInProgram" min="0" value="100" class="input-field">
</div>
<div class="form-row">
<label for="employeesRetained"># Employees Retained:</label>
<input type="number" id="employeesRetained" readonly class="input-field">
</div>
<div class="form-row">
<label for="averageSalary">Average Employee Salary:</label>
<input type="text" id="averageSalary" min="0" value="£30000" class="input-field">
</div>
<div class="form-row">
<label for="replacementCostMultiplier">
Employee Replacement Cost:
<div class="tooltip">
<img src="https://assets-global.website-files.com/5ce11396d0cadb55a02cabf7/645610087006e13277602b8a_Group%201849.svg" class="tool-tip-icon">
<span class="tooltip-text">The average cost to replace a mid-level employee is 75% of their salary.</span>
</div
></label>
<input type="number" id="replacementCostMultiplier" min="0" value="0.75" step="0.1" class="input-field">
</div>
<div class="form-row">
<label for="mentoringSoftwareCosts">Mentoring Program Costs:</label>
<input type="text" id="mentoringSoftwareCosts" min="0" value="£25000" class="input-field">
</div>
<div class="button-container">
<button onclick="calculateROI()">Calculate ROI</button>
</div>
<div class="result" id="result"></div>
</div>
</div>
</body>
</html>