Enter your measurements above to see results instantly.
';
var met = UNITS==='met', w = 1+waste/100, f2 = ft3*w;
var yd3 = f2/27, m3 = f2*0.0283168;
var bags = met ? CC.bagsNeededM3(m3) : CC.bagsNeeded(ft3*w);
var loads = met ? CC.trucksM3(m3) : CC.trucks(yd3);
var bagN = met ? bags.k25 : bags.b80;
var bagLbl = met ? '25 kg Bags' : '80 lb Bags';
var loadLbl = met ? '8 m³ mixer load' : 'truck load';
var cost = price>0 ? (met ? m3*price : yd3*price) : 0;
var h = 'You need'+(waste>0?' (incl. '+waste+'% waste)':'')+'
';
h += '
'
+'
'+ICONS.cube+''+fmt(yd3)+'Cubic Yards
'
+'
'+ICONS.cube+''+fmt(m3)+'Cubic Metres
'
+'
'+ICONS.bags+''+bagN+''+bagLbl+'
'
+'
';
h += '
Working: '+mode.work(vals)
+(waste>0 ? ' → +'+waste+'% waste allowance' : '')+'
';
h += '
'+fmt(f2,1)+' ft³'+
''+loads+' '+loadLbl+(loads===1?'':'s')+'';
if(cost>0) h += ''+CUR+fmt(cost)+' material cost';
h += '
'+bagsHTML(bags)+actionsHTML()+'
Please enter a number for “'+f.label.replace(/<[^>]*>/g,'')+'”.
';
if(x<0) return '“'+f.label.replace(/<[^>]*>/g,'')+'” cannot be negative.
';
if(x===0){ if(!isOpt) return '“'+f.label.replace(/<[^>]*>/g,'')+'” must be greater than zero.
'; continue; }
var imp=x;
if(f.kind==='len'&&UNITS==='met') imp=x*3.28084;
else if(f.kind==='sm'&&UNITS==='met') imp=x/2.54;
else if(f.kind==='yd3'&&UNITS==='met') imp=x*1.30795;
if(imp>(VLIMIT[f.kind]||100000))
return '“'+f.label.replace(/<[^>]*>/g,'')+'” looks unusually large. Please check the value.
';
}
return null;
}
/* ---- per-panel calculation ---- */
function calcPanel(mode, panel){
var vals = {};
panel.querySelectorAll('input[data-fid]').forEach(function(i){ vals[i.getAttribute('data-fid')] = i.value.trim(); });
var box = panel.querySelector('.cc-out');
var verr = validateFields(mode, vals);
if(verr){ box.innerHTML = verr; panel._summary=''; return; }
var met = UNITS==='met', h = '';
if(mode.custom==='bags'){
var yb=CC.num(vals.y), m3b = met? yb : yb*0.764555, ft3b = met? yb*35.3147 : yb*27;
var bb = met? CC.bagsNeededM3(m3b) : CC.bagsNeeded(ft3b);
var bw = met ? fmt(yb)+' m³ ÷ 0.0117 m³ = '+bb.k25+' × 25 kg bags (÷ 0.0094 = '+bb.k20+' × 20 kg)'
: fmt(yb)+' yd³ × 27 = '+fmt(ft3b,1)+' ft³ ÷ 0.60 ft³ = '+bb.b80+' × 80 lb bags';
h = 'Bags needed
'+bagsHTML(bb)+
'
Working: '+bw+'
'+
'
Based on '+fmt(ft3b,1)+' ft³ ('+fmt(m3b,3)+' m³). Bag yields: '+
(met?'25 kg ≈ 0.0117 m³, 20 kg ≈ 0.0094 m³.':'80 lb ≈ 0.60 ft³, 60 lb ≈ 0.45 ft³, 40 lb ≈ 0.30 ft³.')+'
'+
actionsHTML()+'
Site-mix materials (1:2:4)
'+body+'
'+
'
Working: '+mw+'
'+actionsHTML()+'
Rebar estimate
'+
'
'+big+'
'+
'
'+sub+'
'+
'
Working: '+rw+'
'+
'
Material estimate only, not structural design. Bars run the full slab length both ways; laps are not counted, so add about 10% extra for laps and waste.
'+
actionsHTML()+'
'+mode.empty+'
';
} else if(mode.custom==='cost'){
var yc=CC.num(vals.y), pc=CC.num(vals.p), tc=vals.t, tImp=toImpSm(tc);
h = 'Estimate
';
var parts=[], okc=false, sumc='';
if(yc>0 && pc>0){
h += 'Material cost: '+CUR+fmt(yc*pc)+'';
parts.push(fmt(yc)+(met?' m³':' yd³')+' × '+CUR+fmt(pc)+' = '+CUR+fmt(yc*pc)+'');
sumc = 'cost '+CUR+fmt(yc*pc); okc=true;
}
if(yc>0 && tImp>0){
if(met){ var m2=CC.coverageM2(yc, +tc);
h += 'Covers: '+fmt(m2,0)+' m² at '+fmt(+tc)+' cm thick';
parts.push('Coverage = '+fmt(yc)+' ÷ ('+fmt(+tc)+' ÷ 100) = '+fmt(m2,0)+' m²');
sumc += (sumc?', ':'')+'covers '+fmt(m2,0)+' sq m';
} else { var f2c=CC.coverageFt2(yc,tImp);
h += 'Covers: '+fmt(f2c,0)+' ft² at '+fmt(+tc)+' '+USM[UNITS]+' thick';
parts.push('Coverage = '+fmt(yc)+' × 27 ÷ ('+fmt(+tc)+' ÷ 12) = '+fmt(f2c,0)+' ft²');
sumc += (sumc?', ':'')+'covers '+fmt(f2c,0)+' sq ft';
}
okc=true;
}
h += '
';
if(okc){
if(parts.length) h += '
Working: '+parts.join('
')+'
';
h += actionsHTML();
panel._summary = 'Concrete estimate: '+fmt(yc)+(met?' cubic metres':' cubic yards')
+(sumc? ', '+sumc : '')+'. via concretequantity.com/concrete-calculator/';
} else h += '
'+mode.empty+'
';
h += '
Price must be zero or greater.
'; panel._summary=''; return; }
if(px>1000000){ box.innerHTML='Price looks unusually large. Please check it.
'; panel._summary=''; return; }
price=px;
}
h = volResultsHTML(vft3, waste, price, mode, panel, vals);
}
box.innerHTML = h;
}
/* ---- panel + tabs ---- */
function buildPanel(m, first){
var p = document.createElement('div');
p.className = 'cc-panel'+(first?' on':''); p.id = 'ccp-'+m.id;
var inner = ''
+(m.diagram?'
'+m.diagram+'
':'')+'
';
m.fields.forEach(function(f){ inner += fieldHTML(f); });
inner += '
';
if(!m.custom) inner += volExtrasHTML();
inner += '';
p.innerHTML = inner;
p.querySelectorAll('input,select').forEach(function(el){
el.addEventListener('input', function(){ calcPanel(m, p); });
});
p.querySelectorAll('input[data-fid]').forEach(function(inp){
inp.addEventListener('focus', function(){ hlDim(p, inp.getAttribute('data-fid'), true); });
inp.addEventListener('blur', function(){ hlDim(p, inp.getAttribute('data-fid'), false); });
});
p.addEventListener('click', function(e){
var b = e.target && e.target.closest ? e.target.closest('.cc-act') : null;
if(b) doAction(b.getAttribute('data-act'), b, p);
});
calcPanel(m, p);
return p;
}
function activateTab(id){
var tabs = document.getElementById('ccTabs'), panels = document.getElementById('ccPanels');
if(!tabs || !panels) return false;
var ok = false;
MODES.forEach(function(m){ if(m.id===id) ok = true; });
if(!ok) return false;
tabs.querySelectorAll('button').forEach(function(b){ b.classList.toggle('on', b.getAttribute('data-mid')===id); });
panels.querySelectorAll('.cc-panel').forEach(function(p){ p.classList.toggle('on', p.id==='ccp-'+id); });
return true;
}
function buildTabs(){
var tabs = document.getElementById('ccTabs'), panels = document.getElementById('ccPanels');
if(!tabs || !panels) return;
MODES.forEach(function(m, i){
var tb = document.createElement('button');
tb.type='button'; tb.innerHTML = (ICONS[m.icon]||'')+''+m.tab+'';
tb.setAttribute('role','tab'); tb.setAttribute('data-mid', m.id);
if(i===0) tb.classList.add('on');
tb.onclick = function(){ activateTab(m.id); try{ history.replaceState(null,'','#'+m.id); }catch(e){} };
tabs.appendChild(tb);
panels.appendChild(buildPanel(m, i===0));
});
var h = (location.hash||'').replace('#','');
if(h) activateTab(h);
window.addEventListener('hashchange', function(){ activateTab((location.hash||'').replace('#','')); });
}
function buildSingle(){
var id = window.CC_SINGLE, m = null;
MODES.forEach(function(x){ if(x.id===id) m = x; });
if(!m) return;
var c = document.getElementById('ccSingle');
if(!c) return;
c.appendChild(buildPanel(m, true));
}
/* ---- units + currency ---- */
function recalcAll(){
MODES.forEach(function(m){ var p = document.getElementById('ccp-'+m.id); if(p) calcPanel(m, p); });
}
function setUnits(u){
if(u===UNITS) return;
document.querySelectorAll('#ccPanels input[data-kind], #ccSingle input[data-kind]').forEach(function(inp){
var v = parseFloat(inp.value); if(!isFinite(v)) return;
var k = inp.getAttribute('data-kind');
if(k==='len') inp.value = fmt(u==='met' ? v*0.3048 : v*3.28084);
else if(k==='sm') inp.value = fmt(u==='met' ? v*2.54 : v/2.54);
else if(k==='yd3') inp.value = fmt(u==='met' ? v*0.764555 : v*1.30795);
else if(k==='usd') inp.value = fmt(u==='met' ? v*1.30795 : v/1.30795);
});
UNITS = u;
var ui=document.getElementById('uImp'), um=document.getElementById('uMet');
if(ui) ui.classList.toggle('on', u==='imp');
if(um) um.classList.toggle('on', u==='met');
document.querySelectorAll('#ccPanels span[data-u], #ccSingle span[data-u]').forEach(function(sp){
sp.textContent = unitFor(sp.getAttribute('data-u'));
});
document.querySelectorAll('#ccPanels .upl, #ccSingle .upl').forEach(function(sp){
sp.textContent = u==='met' ? 'm³' : 'yd³';
});
recalcAll();
}
function setCur(c){
CUR = c;
var b=document.getElementById('uCur');
if(b) b.textContent = (c==='£' ? '£ GBP' : '$ USD');
document.querySelectorAll('.curSym').forEach(function(s){ s.textContent = c; });
recalcAll();
}
function buildCurToggle(){
var u=document.querySelector('.cc-units');
if(!u || document.getElementById('uCur')) return;
var b=document.createElement('button');
b.type='button'; b.id='uCur'; b.textContent='$ USD';
b.setAttribute('aria-label','Toggle currency between US dollars and British pounds');
b.onclick=function(){ setCur(CUR==='$' ? '£' : '$'); };
u.appendChild(b);
}
/* ---- init ---- */
var _uImp=document.getElementById('uImp'), _uMet=document.getElementById('uMet');
if(_uImp) _uImp.onclick = function(){ setUnits('imp'); };
if(_uMet) _uMet.onclick = function(){ setUnits('met'); };
buildCurToggle();
if(window.CC_SINGLE){ buildSingle(); } else { buildTabs(); }
})();