T Bar Ceiling Calculator
.t-bar-ceiling-calculator-container {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
max-width: 700px;
margin: 20px auto;
padding: 25px;
border: 1px solid #e0e0e0;
border-radius: 8px;
background-color: #f9f9f9;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}
.t-bar-ceiling-calculator-container h2 {
text-align: center;
color: #333;
margin-bottom: 20px;
font-size: 1.8em;
}
.t-bar-ceiling-calculator-container h3 {
color: #444;
margin-top: 30px;
margin-bottom: 15px;
font-size: 1.4em;
border-bottom: 1px solid #eee;
padding-bottom: 5px;
}
.t-bar-ceiling-calculator-container p {
line-height: 1.6;
color: #555;
margin-bottom: 10px;
}
.calculator-inputs label {
display: block;
margin-bottom: 8px;
font-weight: bold;
color: #333;
margin-top: 15px;
}
.calculator-inputs input[type="number"],
.calculator-inputs select {
width: calc(100% – 22px);
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 5px;
font-size: 1em;
}
.calculator-inputs .input-description {
font-size: 0.85em;
color: #777;
margin-top: -5px;
margin-bottom: 15px;
}
.calculator-inputs button {
display: block;
width: 100%;
padding: 12px 20px;
background-color: #007bff;
color: white;
border: none;
border-radius: 5px;
font-size: 1.1em;
cursor: pointer;
margin-top: 20px;
transition: background-color 0.3s ease;
}
.calculator-inputs button:hover {
background-color: #0056b3;
}
.calculator-results {
margin-top: 30px;
padding: 20px;
background-color: #e9f7ef;
border: 1px solid #d4edda;
border-radius: 8px;
}
.calculator-results h3 {
color: #28a745;
text-align: center;
margin-top: 0;
margin-bottom: 15px;
font-size: 1.5em;
}
.calculator-results #result p {
font-size: 1.1em;
color: #333;
margin-bottom: 8px;
}
.calculator-results #result strong {
color: #0056b3;
}
.calculator-article ul {
list-style-type: disc;
margin-left: 20px;
color: #555;
margin-bottom: 15px;
}
.calculator-article ul li {
margin-bottom: 8px;
line-height: 1.5;
}
function calculateCeilingMaterials() {
var roomLength = parseFloat(document.getElementById('roomLength').value);
var roomWidth = parseFloat(document.getElementById('roomWidth').value);
var tileType = document.getElementById('tileType').value;
var hangerWireDrop = parseFloat(document.getElementById('hangerWireDrop').value);
var wasteFactor = parseFloat(document.getElementById('wasteFactor').value);
// Input validation
if (isNaN(roomLength) || roomLength <= 0 ||
isNaN(roomWidth) || roomWidth <= 0 ||
isNaN(hangerWireDrop) || hangerWireDrop <= 0 ||
isNaN(wasteFactor) || wasteFactor < 0) {
document.getElementById('result').innerHTML = 'Please enter valid positive numbers for all fields.';
return;
}
var roomArea = roomLength * roomWidth;
var perimeter = 2 * (roomLength + roomWidth);
var wasteMultiplier = 1 + (wasteFactor / 100);
// 1. Wall Angle (10 ft pieces)
var numWallAngle = Math.ceil(perimeter / 10);
var finalNumWallAngle = Math.ceil(numWallAngle * wasteMultiplier);
// 2. Main Runners (12 ft pieces)
// Each 12ft main runner supports a 4ft width section, so 12ft * 4ft = 48 sq ft.
var numMainRunners = Math.ceil(roomArea / 48);
var finalNumMainRunners = Math.ceil(numMainRunners * wasteMultiplier);
// 3. 4 ft Cross Tees
// Each 4ft cross tee supports a 4ft length and 4ft width section, so 4ft * 4ft = 16 sq ft.
var num4ftCrossTees = Math.ceil(roomArea / 16);
var finalNum4ftCrossTees = Math.ceil(num4ftCrossTees * wasteMultiplier);
// 4. 2 ft Cross Tees (only for 2×2 ft tiles)
var num2ftCrossTees = 0;
if (tileType === "2×2 ft") {
// Each 2ft cross tee supports a 2ft length and 4ft width section, so 2ft * 4ft = 8 sq ft.
num2ftCrossTees = Math.ceil(roomArea / 8);
}
var finalNum2ftCrossTees = Math.ceil(num2ftCrossTees * wasteMultiplier);
// 5. Ceiling Tiles
var tileArea = (tileType === "2×2 ft") ? 4 : 8; // 2×2 = 4 sq ft, 2×4 = 8 sq ft
var numTiles = Math.ceil(roomArea / tileArea);
var finalNumTiles = Math.ceil(numTiles * wasteMultiplier);
// 6. Hanger Wires
// One hanger wire per 16 sq ft (assuming a 4×4 ft grid for hangers)
var numHangerWires = Math.ceil(roomArea / 16);
var hangerWireLengthPerPiece = hangerWireDrop + 1; // Add 1 ft for bending/securing
var totalHangerWireLength = numHangerWires * hangerWireLengthPerPiece;
var finalNumHangerWires = Math.ceil(numHangerWires * wasteMultiplier);
var finalTotalHangerWireLength = Math.ceil(totalHangerWireLength * wasteMultiplier);
var resultsHtml = '