Watercolor Technique Guide Generator

Technique Definition

Materials

Steps & Notes

Wet-on-Wet Wash

Focus: Atmospheric effects, Soft edges | Prepared by: J. Artist
I. Required Materials
II. Step-by-Step Procedure
III. Troubleshooting & Tips
Key Outcome: Achieve soft transitions and bleeding effects.

Document Metadata

${mistakesText.replace(/\n/g, '
')}

`; } // --- PDF Export --- function generatePDF() { const element = document.getElementById('guide-render'); const title = document.getElementById('ctrl-name').value || 'Watercolor_Technique'; const filename = `${title.replace(/[^a-z0-9]/gi, '_')}_Guide.pdf`; // 1. Prepare PDF Structure (Copying content and adding metadata) const pdfTemplate = document.getElementById('pdf-template'); pdfTemplate.innerHTML = element.innerHTML; // Add global header metadata using config values const titleEl = pdfTemplate.querySelector('.guide-title'); const metaEl = pdfTemplate.querySelector('.guide-meta'); titleEl.innerText = document.getElementById('cfg-title').value || title; metaEl.innerHTML = ` Technique: ${document.getElementById('ctrl-name').value} | Skill Level: ${document.getElementById('cfg-audience').value} | Prepared by: ${document.getElementById('cfg-author').value} `; // 2. Generate PDF pdfTemplate.style.display = 'block'; const opt = { margin: 0.5, filename: filename, image: { type: 'jpeg', quality: 0.98 }, html2canvas: { scale: 2 }, jsPDF: { unit: 'in', format: 'letter', orientation: 'portrait' } }; html2pdf().set(opt).from(pdfTemplate).save().then(() => { pdfTemplate.style.display = 'none'; }); } return { switchTab, updateMeta, updateDoc, generatePDF }; })();
Scroll to Top