dtf-site.html held commercial rules, the nesting engine, PDF analysis, the cart and every handler in a single inline script, 42% of the runtime code in one file, and the money logic lived in the middle of it. It is now nine files under local/static, cut at the section markers the original author left, so no function was split across a boundary: config, product modes, upload, sheet analysis, PDF, quality, packing, cart, flow. They load as classic scripts in the original order and share one global scope, so evaluation is exactly what it was; the extraction was checked byte-identical against the original before the tags replaced it. dtf-site.html is 1,394 lines of markup and style. With no inline script left anywhere, the policy no longer needs a hash allowlist: script-src is now 'self' alone, which is stronger than what it replaced and cannot drift as the page changes. Three things depended on the old shape and were updated rather than worked around. The pricing parity test read the ladder out of the HTML and now reads it from site-config.js, still proving the server agrees with what the customer is shown. The isolated artwork test served four hardcoded script paths and now serves any script that resolves inside local/static, so the next file added does not silently 404. The CSP assertion checked the whole policy for 'unsafe-inline' and now checks the script-src directive alone, since style-src legitimately carries it. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
174 lines
7.4 KiB
JavaScript
174 lines
7.4 KiB
JavaScript
/* Site DTF — Carousel, path selector, delivery choice and input masks.
|
|
Extracted verbatim from the single inline script in dtf-site.html.
|
|
Loaded as classic scripts in the order listed there: they share one global
|
|
scope and run top to bottom, exactly as the original did. */
|
|
// ── decisões
|
|
// Remanejar conserta encaixe, não resolução — e a nota mede só resolução.
|
|
// Por isso a nota NÃO muda aqui. E a metragem nova só existe depois que o motor
|
|
// roda na folha de verdade, no servidor: o navegador recebe a folha fechada,
|
|
// não as artes separadas, então não há como recalcular aqui sem inventar número.
|
|
$('qOk').addEventListener('click',()=>{
|
|
if($('qOk').disabled) return;
|
|
const ok=$('ciente').classList.contains('on');
|
|
qm(ok? '<b>Registrado.</b> Você confirmou que viu a ressalva de resolução.'
|
|
: '<b>Certo.</b> Seu pedido está montado abaixo.','var(--tx)');
|
|
$('carr').scrollIntoView({behavior:'smooth',block:'nearest'});
|
|
});
|
|
|
|
$('pOk').addEventListener('click',()=>$('carr').scrollIntoView({behavior:'smooth'}));
|
|
$('pMais').addEventListener('click',()=>$('foco').scrollIntoView({behavior:'smooth'}));
|
|
$('pVolta').addEventListener('click',()=>{
|
|
folhas=[]; artes=[]; reencaixado=false; pintaFolha(); pintaArtes();
|
|
limpaPaineis(); // o carrinho só some se o pedido estiver vazio
|
|
$('foco').scrollIntoView({behavior:'smooth'});
|
|
});
|
|
// carrossel
|
|
(function(){
|
|
const tr=$('trilho'); if(!tr) return;
|
|
const slides=[...tr.children], pontos=$('cPontos');
|
|
slides.forEach((_,i)=>{
|
|
const b=document.createElement('button');
|
|
b.className='pt'+(i?'':' on'); b.setAttribute('aria-label','Cartão '+(i+1));
|
|
b.addEventListener('click',()=>ir(i)); pontos.appendChild(b);
|
|
});
|
|
function ir(i){
|
|
i=Math.max(0,Math.min(slides.length-1,i));
|
|
tr.scrollTo({left:slides[i].offsetLeft-tr.offsetLeft,behavior:'smooth'});
|
|
}
|
|
function atual(){
|
|
const meio=tr.scrollLeft+tr.clientWidth/2;
|
|
let a=0,d=Infinity;
|
|
slides.forEach((s,i)=>{
|
|
const c=s.offsetLeft-tr.offsetLeft+s.offsetWidth/2;
|
|
if(Math.abs(c-meio)<d){ d=Math.abs(c-meio); a=i; }
|
|
});
|
|
return a;
|
|
}
|
|
tr.addEventListener('scroll',()=>{
|
|
const a=atual();
|
|
[...pontos.children].forEach((p,i)=>p.classList.toggle('on',i===a));
|
|
},{passive:true});
|
|
$('cAnt').addEventListener('click',()=>ir(atual()-1));
|
|
$('cPro').addEventListener('click',()=>ir(atual()+1));
|
|
})();
|
|
|
|
// A declaração de formato só orienta: filtra o seletor e mostra o preço esperado.
|
|
// Se o arquivo que chegar contrariar, o arquivo ganha e o site avisa.
|
|
const AUTO=/[.](png|jpe?g|webp|pdf)$/i;
|
|
function pintaCaminhos(){
|
|
if(!$('caminhos')) return;
|
|
const ehF=modo&&ehFolha();
|
|
$('caminhos').style.display = ehF? '' : 'none';
|
|
if(!ehF) return;
|
|
document.querySelectorAll('#caminhos .cam').forEach(b=>b.classList.toggle('on', b.dataset.cam===caminho));
|
|
$('camA').textContent='a partir de '+rs(pisoEscada());
|
|
$('camB').textContent=rs(TABELA[modo])+' fixo';
|
|
$('inp').accept = caminho==='auto' ? '.png,.jpg,.jpeg,.pdf'
|
|
: '.tif,.tiff,.psd,.psb,.ai,.cdr';
|
|
$('zSub').textContent = caminho==='auto'
|
|
? 'PNG, JPG ou PDF · conferência automática, nota na tela'
|
|
: 'CDR, AI, PSD ou TIFF · sem conferência, metro pela tabela';
|
|
}
|
|
document.querySelectorAll('#caminhos .cam').forEach(b=>b.addEventListener('click',()=>{
|
|
caminho=b.dataset.cam; avisoCam(''); pintaCaminhos();
|
|
}));
|
|
function avisoCam(txt){
|
|
const el=$('trocouCam'); if(!el) return;
|
|
el.innerHTML=txt; el.style.display = txt? '' : 'none';
|
|
}
|
|
|
|
function pintaEntrega(){
|
|
document.querySelectorAll('.opE').forEach(b=>
|
|
b.classList.toggle('on', b.dataset.ent===entrega.tipo));
|
|
$('cep').classList.toggle('on', entrega.tipo==='frete');
|
|
$('vFrete').textContent = entrega.tipo!=='frete' ? '—'
|
|
: entrega.cotado ? rs(entrega.valor) : 'a cotar';
|
|
$('avisoE').innerHTML = entrega.tipo==='retira'
|
|
? 'DTF é impresso depois que você paga. Avisamos no WhatsApp quando estiver '+
|
|
'<b>pronto para retirar</b> — não venha antes do aviso.'
|
|
: '';
|
|
$('bPagar').disabled = !entrega.cotado || !clienteOk();
|
|
pintaPedido();
|
|
}
|
|
|
|
// máscaras e conferência dos campos do cliente
|
|
function liga(id,fmt,val,chave,erro,msg){
|
|
const el=$(id), er=$(erro);
|
|
el.addEventListener('input',e=>{
|
|
e.target.value=fmt(e.target.value);
|
|
cliente[chave]=e.target.value;
|
|
el.classList.remove('ruim','bom'); er.textContent='';
|
|
if(val(e.target.value)) el.classList.add('bom');
|
|
pintaEntrega();
|
|
});
|
|
el.addEventListener('blur',()=>{
|
|
if(!el.value){ el.classList.remove('ruim','bom'); er.textContent=''; return; }
|
|
const ok=val(el.value);
|
|
el.classList.toggle('ruim',!ok); el.classList.toggle('bom',ok);
|
|
er.textContent = ok? '' : msg;
|
|
});
|
|
}
|
|
liga('fCnpj', v=>{
|
|
const d=v.replace(/\D/g,'').slice(0,14);
|
|
return d.replace(/^(\d{2})(\d)/,'$1.$2').replace(/^(\d{2})\.(\d{3})(\d)/,'$1.$2.$3')
|
|
.replace(/\.(\d{3})(\d)/,'.$1/$2').replace(/(\d{4})(\d)/,'$1-$2');
|
|
}, cnpjOk, 'cnpj', 'eCnpj', 'CNPJ inválido · confira os números');
|
|
liga('fZap', v=>{
|
|
const d=v.replace(/\D/g,'').slice(0,11);
|
|
return d.length>6 ? '('+d.slice(0,2)+') '+d.slice(2,d.length-4)+'-'+d.slice(-4)
|
|
: d.length>2 ? '('+d.slice(0,2)+') '+d.slice(2) : d;
|
|
}, zapOk, 'zap', 'eZap', 'Faltam dígitos no número');
|
|
liga('fMail', v=>v.trim(), mailOk, 'mail', 'eMail', 'E-mail inválido');
|
|
function pintaZoom(){
|
|
$('zTxt').textContent=Math.round(ZOOMS[zoomI]*100)+'%';
|
|
$('zMenos').disabled = zoomI===0;
|
|
$('zMais').disabled = zoomI===ZOOMS.length-1;
|
|
}
|
|
$('zMais').addEventListener('click',()=>{
|
|
if(zoomI<ZOOMS.length-1){ zoomI++; pintaZoom(); previaAoVivo(); }
|
|
});
|
|
$('zMenos').addEventListener('click',()=>{
|
|
if(zoomI>0){ zoomI--; pintaZoom(); previaAoVivo(); }
|
|
});
|
|
pintaZoom();
|
|
|
|
document.querySelectorAll('.opE').forEach(b=>b.addEventListener('click',()=>{
|
|
entrega.tipo=b.dataset.ent;
|
|
entrega.cotado = entrega.tipo==='retira';
|
|
entrega.valor=0;
|
|
if(entrega.tipo==='frete') $('cepMsg').innerHTML='';
|
|
pintaEntrega();
|
|
}));
|
|
$('cepIn').addEventListener('input',e=>{
|
|
const v=e.target.value.replace(/\D/g,'').slice(0,8);
|
|
e.target.value = v.length>5 ? v.slice(0,5)+'-'+v.slice(5) : v;
|
|
entrega.cep=v; entrega.cotado=false; entrega.valor=0; pintaEntrega();
|
|
});
|
|
$('bCep').addEventListener('click',async()=>{
|
|
if(entrega.cep.length!==8){ $('cepMsg').innerHTML='CEP incompleto.'; return; }
|
|
if(window.dtfFreight){ await window.dtfFreight(); return; }
|
|
// A cotação vem da transportadora. Enquanto a integração não existir, o pedido não
|
|
// fecha por frete: o valor precisa estar fechado antes do Mercado Pago.
|
|
$('cepMsg').innerHTML='<b style="color:#FFB63D">Cotação de frete ainda não integrada.</b><br>'+
|
|
'O valor precisa vir da transportadora antes do pagamento — senão você pagaria um '+
|
|
'total que não é o final. Por enquanto, retire em Franca ou fale conosco no WhatsApp.';
|
|
pintaEntrega();
|
|
});
|
|
|
|
$('bMais').addEventListener('click',()=>{
|
|
if(itemAtual){ pedido.push(itemAtual); itemAtual=null; }
|
|
$('atual').style.display='none'; $('carrLin').innerHTML='';
|
|
$('foco').classList.remove('on'); $('cards').style.display='';
|
|
['qual','prev'].forEach(id=>$(id).classList.remove('on'));
|
|
modo=null; artes=[]; folhas=[]; metros=0; nota=0; montagemCm=0;
|
|
pintaPedido();
|
|
document.getElementById('envio').scrollIntoView({behavior:'smooth'});
|
|
});
|
|
|
|
$('bPagar').addEventListener('click',()=>{
|
|
if(window.dtfCheckout) window.dtfCheckout();
|
|
else alert('O pedido online está indisponível no momento. Tente novamente em instantes.');
|
|
});
|
|
pintaEntrega();
|
|
|