Free WBS Generator Online - Work Breakdown Structure Maker - Small Study Tools `;
const blob=new Blob([html],{type:'text/html'});
const a=document.createElement('a'); a.download=`wbs-${(tree.text||'project').replace(/\s+/g,'-').toLowerCase()}.html`; a.href=URL.createObjectURL(blob); a.click();
toast('PDF report downloaded — open and Print → Save as PDF');
}function dlSVG(){
doRender();
const canvas=document.getElementById('wbsCanvas');
const svgStr=`
`;
const blob=new Blob([svgStr],{type:'image/svg+xml'});
const a=document.createElement('a'); a.download='wbs-diagram.svg'; a.href=URL.createObjectURL(blob); a.click();
toast('SVG downloaded!');
}function dlCSV(){
const all=flatNodes(tree);
const header='WBS Code,Task Name,Level,Status,Assignee,Due Date,Effort (h),Notes\n';
const rows=all.map(n=>`"${n.code}","${n.text.replace(/"/g,'""')}",${n.level},"${n.status}","${n.assignee||''}","${n.due||''}",${n.effort||0},"${(n.note||'').replace(/"/g,'""')}"`).join('\n');
const blob=new Blob([header+rows],{type:'text/csv'});
const a=document.createElement('a'); a.download='wbs-data.csv'; a.href=URL.createObjectURL(blob); a.click();
toast('CSV downloaded!');
}function dlJSON(){
const data=JSON.stringify({project:tree.text,generated:new Date().toISOString(),tree},null,2);
const blob=new Blob([data],{type:'application/json'});
const a=document.createElement('a'); a.download='wbs-data.json'; a.href=URL.createObjectURL(blob); a.click();
toast('JSON downloaded!');
}function shareLink(){
try{
const data=btoa(unescape(encodeURIComponent(JSON.stringify({t:tree.text,c:tree.children}))));
const url=window.location.href.split('?')[0]+'?wbs='+data.slice(0,2000);
navigator.clipboard.writeText(url).then(()=>toast('Share link copied to clipboard!')).catch(()=>toast('Link too long — try export JSON instead'));
}catch(e){toast('Share failed — try export JSON instead');}
}function importJSON(e){
const file=e.target.files[0]; if(!file) return;
const reader=new FileReader();
reader.onload=ev=>{
try{
const data=JSON.parse(ev.target.result);
if(data.tree){ tree=data.tree; document.getElementById('projName').value=data.project||tree.text||'Project'; reCodes(); renderEditor(); schedRender(); toast('JSON imported!'); }
else toast('Invalid JSON format');
}catch(err){toast('Failed to parse JSON: '+err.message);}
};
reader.readAsText(file);
}// ─── APP MODE ─────────────────────────────────────────────────
function setAppMode(m){
isPro=m==='pro';
document.getElementById('btnSimple').classList.toggle('active',!isPro);
document.getElementById('btnPro').classList.toggle('active',isPro);
widget().classList.toggle('pro-mode',isPro);
const pb=document.getElementById('proBar'); if(pb) pb.style.display=isPro?'flex':'none';
if(isPro){ buildThemeChips(); buildLevelColorRows(); }
renderEditor(); schedRender();
try{localStorage.setItem('sst_wbs_mode',m);}catch(e){}
}// ─── UTILS ────────────────────────────────────────────────────
function esc(s){return String(s||'').replace(/&/g,'&').replace(//g,'>').replace(/"/g,'"');}
function toast(msg){const t=document.getElementById('toast');t.textContent=msg;t.classList.add('show');setTimeout(()=>t.classList.remove('show'),2600);}// ─── CANVAS DRAG-TO-PAN (mouse) ─────────────────────────────────
// Touch users can already pan the preview with a native swipe/scroll
// gesture. This adds the matching click-and-drag experience for
// mouse users, which is what the grab cursor on the canvas promises.
(function initCanvasDrag(){
const scrollEl = document.getElementById('canvasScroll');
if(!scrollEl) return;
let isDown=false, startX=0, startY=0, startLeft=0, startTop=0, moved=false;
scrollEl.addEventListener('mousedown', e=>{
isDown=true; moved=false;
startX=e.pageX; startY=e.pageY;
startLeft=scrollEl.scrollLeft; startTop=scrollEl.scrollTop;
});
window.addEventListener('mousemove', e=>{
if(!isDown) return;
const dx=e.pageX-startX, dy=e.pageY-startY;
if(Math.abs(dx)>3||Math.abs(dy)>3) moved=true;
scrollEl.scrollLeft = startLeft - dx;
scrollEl.scrollTop = startTop - dy;
});
window.addEventListener('mouseup', ()=>{ isDown=false; });
scrollEl.addEventListener('mouseleave', ()=>{ isDown=false; });
})();// ─── INIT ─────────────────────────────────────────────────────
// Check URL for shared WBS
try{
const params=new URLSearchParams(window.location.search);
const wbsParam=params.get('wbs');
if(wbsParam){ const data=JSON.parse(decodeURIComponent(escape(atob(wbsParam)))); tree.text=data.t||'Project'; tree.children=data.c||[]; reCodes(); document.getElementById('projName').value=tree.text; toast('Shared WBS loaded!'); }
}catch(e){}renderEditor();
schedRender();
try{const m=localStorage.getItem('sst_wbs_mode');if(m==='pro')setAppMode('pro');}catch(e){}
