ÿþ<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Class XI Biology Sample Paper Generator</title> <link href="img/logo1.jpg" rel="icon"> <!-- Add jsPDF library --> <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> <style> :root { --primary: #4361ee; --primary-dark: #3f37c9; --secondary: #4895ef; --danger: #f72585; --success: #4cc9f0; --light: #f8f9fa; --dark: #212529; --gray: #6c757d; --border-radius: 12px; --box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); --transition: all 0.3s ease; } * { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } body { background: linear-gradient(135deg, #f5f7fa 0%, #e2e8f0 100%); min-height: 100vh; display: flex; justify-content: center; align-items: center; padding: 20px; color: var(--dark); line-height: 1.6; } .container { width: 100%; max-width: 900px; background: white; border-radius: var(--border-radius); box-shadow: var(--box-shadow); overflow: hidden; transition: var(--transition); animation: fadeIn 0.5s ease-out; } @keyframes fadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } .header { background: linear-gradient(135deg, var(--primary), var(--primary-dark)); color: white; padding: 30px 20px; text-align: center; position: relative; overflow: hidden; } .header::before { content: ''; position: absolute; top: -50px; right: -50px; width: 150px; height: 150px; background: rgba(255, 255, 255, 0.1); border-radius: 50%; } .header h1 { font-size: 2rem; margin-bottom: 10px; font-weight: 700; position: relative; z-index: 1; } .header p { font-size: 1rem; opacity: 0.9; position: relative; z-index: 1; } .content-area { padding: 30px; } .hidden { display: none !important; } .btn { display: inline-block; padding: 12px 28px; border-radius: 50px; font-weight: 600; cursor: pointer; transition: var(--transition); border: none; text-align: center; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); margin: 10px 5px; } .btn-primary { background: var(--primary); color: white; } .btn-primary:hover { background: var(--primary-dark); transform: translateY(-2px); box-shadow: 0 8px 15px rgba(67, 97, 238, 0.3); } .btn-success { background: var(--success); color: white; } .btn-success:hover { background: #3ab0d6; transform: translateY(-2px); box-shadow: 0 8px 15px rgba(76, 201, 240, 0.3); } .btn-danger { background: var(--danger); color: white; } .btn-danger:hover { background: #d3166b; transform: translateY(-2px); box-shadow: 0 8px 15px rgba(247, 37, 133, 0.3); } .btn-group { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 20px 0; } .section-title { text-align: center; margin-bottom: 25px; color: var(--primary-dark); font-size: 1.5rem; position: relative; padding-bottom: 10px; } .section-title::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 80px; height: 3px; background: var(--secondary); border-radius: 3px; } .checkbox-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 15px; margin: 25px 0; } .checkbox-item { display: flex; align-items: center; } .checkbox-item input { margin-right: 10px; width: 18px; height: 18px; cursor: pointer; } .checkbox-item label { cursor: pointer; font-size: 0.95rem; } .generated-paper { padding: 30px; } .paper-header { text-align: center; margin-bottom: 30px; border-bottom: 2px solid var(--primary); padding-bottom: 20px; } .paper-header h2 { color: var(--primary-dark); margin-bottom: 5px; font-size: 1.8rem; } .paper-header h3 { color: var(--gray); margin-bottom: 5px; font-size: 1.2rem; font-weight: 500; } .paper-meta { display: flex; justify-content: space-between; margin-bottom: 25px; padding-bottom: 15px; border-bottom: 1px solid #eee; font-weight: 500; } .instructions { margin-bottom: 30px; padding: 20px; background: #f8f9fa; border-radius: var(--border-radius); } .instructions ol { padding-left: 20px; margin-top: 10px; } .instructions li { margin-bottom: 8px; } .question-section { margin-bottom: 30px; } .section-heading { font-weight: 600; color: var(--primary-dark); margin-bottom: 15px; padding-bottom: 5px; border-bottom: 1px solid #eee; } .question { margin-bottom: 20px; page-break-inside: avoid; } .question-text { font-weight: 500; margin-bottom: 8px; } .option { margin-left: 20px; margin-bottom: 5px; } .action-buttons { display: flex; justify-content: center; flex-wrap: wrap; gap: 15px; margin-top: 40px; } @media (max-width: 768px) { .header h1 { font-size: 1.6rem; } .content-area { padding: 20px; } .checkbox-container { grid-template-columns: 1fr; } .btn { padding: 10px 20px; font-size: 0.9rem; } .paper-header h2 { font-size: 1.4rem; } .paper-header h3 { font-size: 1rem; } } @media (max-width: 480px) { .header { padding: 20px 15px; } .section-title { font-size: 1.3rem; } .paper-meta { flex-direction: column; gap: 10px; } .action-buttons { flex-direction: column; align-items: center; } .btn { width: 100%; max-width: 250px; } } @media print { body { background: none; padding: 0; } .container { box-shadow: none; max-width: 100%; } .action-buttons { display: none; } .question { page-break-inside: avoid; } } </style> <style> /* Ensure header styling is preserved */ .header { background: linear-gradient(135deg, #4361ee, #3f37c9) !important; color: white !important; padding: 30px 20px !important; text-align: center !important; position: relative !important; overflow: hidden !important; width: 100% !important; } .header h1, .header h2, .header h3 { color: white !important; font-weight: bold !important; } .temp-pdf-container { font-family: Arial, sans-serif; line-height: 1.5; } .temp-pdf-container * { max-width: 100% !important; background-color: white !important; color: black !important; } /* Page break control */ .question { page-break-inside: avoid; break-inside: avoid; } .question-section { page-break-after: auto; } @media print { body { margin: 0 !important; padding: 0 !important; background: white !important; } .container { width: 100% !important; margin: 0 !important; padding: 0 !important; box-shadow: none !important; } .header { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; } } /* Home icon styles */ .home-icon { position: absolute; top: 20px; left: 20px; color: white; font-size: 24px; cursor: pointer; transition: var(--transition); z-index: 2; } .home-icon:hover { transform: scale(1.1); color: rgba(255, 255, 255, 0.8); } @media (max-width: 480px) { .home-icon { font-size: 20px; top: 15px; left: 15px; } } @media print { .home-icon { display: none; } } </style> </head> <body> <div class="container" id="startContainer"> <div class="header"> <a href="cbse-class-9-to-12-exam-paper-generator.html" class="home-icon"> <i class="fas fa-home"></i> </a> <h1>Class XI Biology</h1> <p>Generate Customized Sample Papers</p> </div> <div class="content-area"> <div id="startScreen"> <h2 class="section-title">Biology Paper Generator</h2> <div class="btn-group"> <button class="btn btn-primary" onclick="showChapterSelection()">Start Generating</button> </div> </div> <div id="chapterSelection" class="hidden"> <h2 class="section-title">Select Chapters for Biology</h2> <form id="chapterForm"> <div class="checkbox-container"> <div class="checkbox-item"> <input type="checkbox" id="fullPaper" name="chapter" value="Full Paper" onchange="toggleChapters()"> <label for="fullPaper">Full Paper (All Chapters)</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter1" name="chapter" value="Chapter 1"> <label for="chapter1">1. The Living World</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter2" name="chapter" value="Chapter 2"> <label for="chapter2">2. Biological Classification</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter3" name="chapter" value="Chapter 3"> <label for="chapter3">3. Plant Kingdom</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter4" name="chapter" value="Chapter 4"> <label for="chapter4">4. Animal Kingdom</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter5" name="chapter" value="Chapter 5"> <label for="chapter5">5. Morphology of Flowering Plants</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter6" name="chapter" value="Chapter 6"> <label for="chapter6">6. Anatomy of Flowering Plants</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter7" name="chapter" value="Chapter 7"> <label for="chapter7">7. Structural Organisation in Animals</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter8" name="chapter" value="Chapter 8"> <label for="chapter8">8. Cell: The Unit of Life</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter9" name="chapter" value="Chapter 9"> <label for="chapter9">9. Biomolecules</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter10" name="chapter" value="Chapter 10"> <label for="chapter10">10. Cell Cycle and Cell Division</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter11" name="chapter" value="Chapter 11"> <label for="chapter11">11. Transport in Plants</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter12" name="chapter" value="Chapter 12"> <label for="chapter12">12. Mineral Nutrition</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter13" name="chapter" value="Chapter 13"> <label for="chapter13">13. Photosynthesis in Higher Plants</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter14" name="chapter" value="Chapter 14"> <label for="chapter14">14. Respiration In Plants</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter15" name="chapter" value="Chapter 15"> <label for="chapter15">15. Plant Growth and Development</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter16" name="chapter" value="Chapter 16"> <label for="chapter16">16. Digestion and Absorption</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter17" name="chapter" value="Chapter 17"> <label for="chapter17">17. Breathing and Exchange of Gases</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter18" name="chapter" value="Chapter 18"> <label for="chapter18">18. Body Fluids and Circulation</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter19" name="chapter" value="Chapter 19"> <label for="chapter19">19. Excretory Products and their Elimination</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter20" name="chapter" value="Chapter 20"> <label for="chapter20">20. Locomotion and Movements</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter21" name="chapter" value="Chapter 21"> <label for="chapter21">21. Neural Control and Coordination</label> </div> <div class="checkbox-item"> <input type="checkbox" id="chapter22" name="chapter" value="Chapter 22"> <label for="chapter22">22. Chemical Coordination and Integration</label> </div> </div> </form> <div id="message" class="hidden"></div> <div class="btn-group"> <button class="btn btn-danger" onclick="backToStart()">Back to Start</button> <button class="btn btn-success" onclick="promptSchoolName()">Generate Paper</button> </div> </div> </div> </div> <div class="container hidden" id="generatedPaperContainer"></div> <script> // Initialize jsPDF const { jsPDF } = window.jspdf; let schoolName = ''; let questionCounter = 1; let sessionYear = ''; const questions = { biology: { "Chapter 1": { mcq: [ { question: "Which of the following is not a characteristic of living organisms?", options: ["Growth", "Reproduction", "Metabolism", "Isolation"], answer: "Isolation" }, { question: "The scientific name of mango is:", options: ["Mangifera indica", "Mangifera Indica", "mangifera indica", "Mangifera indica"], answer: "Mangifera indica" }, { question: "The taxonomic category below the level of family is:", options: ["Class", "Species", "Division", "Order"], answer: "Species" }, { question: "Which of these is a defining characteristic of living organisms?", options: ["Cellular organization", "Ability to move", "Visible growth", "All of these"], answer: "Cellular organization" }, { question: "The term 'systematics' refers to:", options: ["Identification of organisms", "Classification of organisms", "Nomenclature of organisms", "All of these"], answer: "All of these" } ], assertion: [ { statement1: "All living organisms grow.", statement2: "Growth in living organisms is from inside.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Both true" }, { statement1: "Metabolism is a defining feature of life.", statement2: "All metabolic reactions can be demonstrated in vitro.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Only statement 1 is true" } ], twoMark: [ "Differentiate between growth in living organisms and non-living objects.", "What is the importance of binomial nomenclature?", "Define species and give an example.", "What are the three main branches of systematics?" ], threeMark: [ "Explain the defining characteristics of living organisms.", "Describe the hierarchical classification system with examples.", "What are the universal rules of binomial nomenclature?" ], fiveMark: [ "Explain the various characteristics of living organisms with suitable examples.", "Discuss the importance of taxonomy and systematics in biology.", "Describe the binomial nomenclature system with its advantages." ], caseStudy: [ { case: "A student observed that some organisms like bacteria reproduce very fast while others like elephants reproduce slowly. He also noted that some non-living things like crystals also grow in size.", questions: ["How is reproduction in living organisms different from growth in non-living things?", "Why is reproduction not considered as defining property of life?", "What would be the correct way to define life?"] } ] }, "Chapter 2": { mcq: [ { question: "Who proposed the five-kingdom classification?", options: ["Linnaeus", "Whittaker", "Haeckel", "Copeland"], answer: "Whittaker" }, { question: "Which kingdom includes multicellular decomposers?", options: ["Monera", "Protista", "Fungi", "Plantae"], answer: "Fungi" }, { question: "Archaebacteria differ from eubacteria in:", options: ["Cell membrane structure", "Mode of nutrition", "Cell wall composition", "All of these"], answer: "All of these" }, { question: "Diatoms are included in:", options: ["Monera", "Protista", "Fungi", "Plantae"], answer: "Protista" }, { question: "Which of these is not a viral disease?", options: ["AIDS", "Influenza", "Tuberculosis", "Common cold"], answer: "Tuberculosis" } ], assertion: [ { statement1: "Viruses are considered as living organisms.", statement2: "Viruses can reproduce outside host cells.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Both false" }, { statement1: "Lichens are symbiotic associations.", statement2: "Lichens are pollution indicators.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Both true" } ], twoMark: [ "What are the characteristic features of monerans?", "Differentiate between archaebacteria and eubacteria.", "Why are viruses considered as borderline between living and non-living?", "Give two examples of fungi and their importance." ], threeMark: [ "Describe the five-kingdom classification system.", "Explain the economic importance of fungi.", "Draw a labeled diagram of a bacteriophage." ], fiveMark: [ "Explain the criteria used for five-kingdom classification with examples.", "Discuss the characteristic features of kingdom Protista.", "Describe the structure and importance of viruses." ], caseStudy: [ { case: "A scientist discovered a new microorganism that lives in hot springs, has a cell wall without peptidoglycan, and can survive in extreme conditions.", questions: ["To which kingdom does this organism belong?", "What are such organisms called?", "What is the significance of such organisms?"] } ] }, // ... (other chapters follow similar pattern with updated content) "Chapter 22": { mcq: [ { question: "Which gland is called the 'master gland'?", options: ["Thyroid", "Pituitary", "Adrenal", "Pancreas"], answer: "Pituitary" }, { question: "Insulin is secreted by:", options: ["Alpha cells of pancreas", "Beta cells of pancreas", "Liver", "Adrenal cortex"], answer: "Beta cells of pancreas" }, { question: "Which hormone regulates calcium metabolism?", options: ["Insulin", "Thyroxine", "Parathormone", "Glucagon"], answer: "Parathormone" }, { question: "The hormone responsible for fight or flight response is:", options: ["Adrenaline", "Thyroxine", "Insulin", "Estrogen"], answer: "Adrenaline" }, { question: "Which of these is not an endocrine gland?", options: ["Pituitary", "Thyroid", "Salivary", "Adrenal"], answer: "Salivary" } ], assertion: [ { statement1: "Hormones are chemical messengers.", statement2: "Hormones are secreted by endocrine glands.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Both true" }, { statement1: "All hormones are proteins.", statement2: "Hormones act on target tissues.", options: ["Both true", "Both false", "Only statement 1 is true", "Only statement 2 is true"], answer: "Only statement 2 is true" } ], twoMark: [ "What are the functions of growth hormone?", "Differentiate between endocrine and exocrine glands.", "What is the role of insulin in our body?", "Name two hormones secreted by adrenal gland." ], threeMark: [ "Explain the feedback mechanism of hormone action.", "Describe the disorders caused by hyposecretion of thyroid hormones.", "Draw a labeled diagram of pituitary gland showing its lobes." ], fiveMark: [ "Explain the role of hormones as chemical coordinators in human body.", "Discuss the functions of pituitary gland with its hormones.", "Describe the mechanism of action of steroid hormones." ], caseStudy: [ { case: "A patient was diagnosed with excessive thirst, frequent urination and high blood sugar levels. The doctor prescribed insulin injections.", questions: ["What disease is the patient suffering from?", "Why was insulin prescribed?", "What would happen if this condition is not treated?"] } ] } } }; function getRandomQuestions(selectedChapters, type, count) { let allQuestions = []; if (selectedChapters.includes("Full Paper")) { for (let chapter in questions.biology) { if (questions.biology[chapter][type]) { allQuestions = allQuestions.concat(questions.biology[chapter][type]); } } } else { selectedChapters.forEach(chapter => { if (questions.biology[chapter] && questions.biology[chapter][type]) { allQuestions = allQuestions.concat(questions.biology[chapter][type]); } }); } allQuestions = allQuestions.sort(() => Math.random() - 0.5); return allQuestions.slice(0, count); } function showChapterSelection() { document.getElementById('startScreen').classList.add('hidden'); document.getElementById('chapterSelection').classList.remove('hidden'); } function toggleChapters() { const fullPaperCheckbox = document.getElementById('fullPaper'); const checkboxes = document.querySelectorAll('input[name="chapter"]:not(#fullPaper)'); checkboxes.forEach(cb => cb.disabled = fullPaperCheckbox.checked); } function backToStart() { document.getElementById('generatedPaperContainer').classList.add('hidden'); document.getElementById('startContainer').classList.remove('hidden'); document.getElementById('chapterSelection').classList.add('hidden'); document.getElementById('startScreen').classList.remove('hidden'); questionCounter = 1; } function promptSchoolName() { schoolName = prompt("Write your school/institute name").toUpperCase(); if (!schoolName) { alert("School/Institute name is required!"); } else { promptSession(); } } function promptSession() { sessionYear = prompt("Enter the academic session (e.g., 2023-24)").toUpperCase(); if (!sessionYear) { alert("Academic session is required!"); } else { generatePaper(); } } function generatePaper() { document.getElementById('startContainer').classList.add('hidden'); const generatedPaperContainer = document.getElementById('generatedPaperContainer'); generatedPaperContainer.classList.remove('hidden'); generatedPaperContainer.innerHTML = ''; let paperContent = ` <div class="header"> <h2>${schoolName}</h2> </div> <div class="content-area"> <div class="paper-header"> <h3>BIOLOGY-044</h3> <h3>CLASS - XI</h3> <h3>Session: ${sessionYear}</h3> </div> <div class="paper-meta"> <div>Maximum Marks: 70</div> <div>Time Allowed: 3 hours</div> </div> <div class="instructions"> <p><strong>General Instructions:</strong></p> <p>Read the following instructions carefully and follow them:</p> <ol> <li>All questions are compulsory.</li> <li>The question paper has five sections and 33 questions.</li> <li>Section A has 16 questions of 1 mark each; Section B has 5 questions of 2 marks each; Section C has 7 questions of 3 marks each; Section D has 2 case-based questions of 4 marks each; and Section E has 3 questions of 5 marks each.</li> <li>There is no overall choice. However, internal choices have been provided in some questions. A student has to attempt only one of the alternatives in such questions.</li> <li>Wherever necessary, neat and properly labeled diagrams should be drawn.</li> </ol> </div> `; const selectedChapters = document.getElementById('fullPaper').checked ? ["Full Paper"] : Array.from(document.querySelectorAll('input[name="chapter"]:checked')).map(cb => cb.value); // Section A - MCQs const mcqs = getRandomQuestions(selectedChapters, 'mcq', 12); paperContent += ` <div class="question-section"> <h4 class="section-heading">Section A - Multiple Choice Questions (1 mark each)</h4> <p>Question 1 to 12 are multiple choice questions. Only one of the choices is correct. Select and write the correct choice as well as the answer to these questions.</p> `; mcqs.forEach((q, i) => { paperContent += ` <div class="question"> <p class="question-text">${questionCounter++}. ${q.question}</p> ${q.options.map((opt, j) => `<p class="option">${String.fromCharCode(65 + j)}. ${opt}</p>` ).join('')} </div> `; }); // Section A - Assertion Reasoning const assertions = getRandomQuestions(selectedChapters, 'assertion', 4); paperContent += ` <h4 class="section-heading" style="margin-top: 30px;">Section A - Assertion Reasoning Questions (1 mark each)</h4> <p>Question No. 13 to 16 consist of two statements  Assertion (A) and Reason (R). Answer these questions by selecting the appropriate option given below:</p> <p>A. Both A and R are true and R is the correct explanation of A.<br> B. Both A and R are true and R is not the correct explanation of A.<br> C. A is true but R is false.<br> D. A is False but R is true.</p> `; assertions.forEach((q, i) => { paperContent += ` <div class="question"> <p class="question-text">${questionCounter++}. <b>Assertion</b>: ${q.statement1}</p> <p class="option"><b>Reason</b>: ${q.statement2}</p> ${q.options.map((opt, j) => `<p class="option">${String.fromCharCode(65 + j)}. ${opt}</p>` ).join('')} </div> `; }); // Section B - 2 marks const twoMarks = getRandomQuestions(selectedChapters, 'twoMark', 5); paperContent += ` </div> <div class="question-section"> <h4 class="section-heading">Section B - Short Answer Questions (2 marks each)</h4> <p>Question No. 17 to 21 are short answer questions</p> `; twoMarks.forEach(q => { paperContent += ` <div class="question"> <p class="question-text">${questionCounter++}. ${q}</p> </div> `; }); // Section C - 3 marks const threeMarks = getRandomQuestions(selectedChapters, 'threeMark', 7); paperContent += ` </div> <div class="question-section"> <h4 class="section-heading">Section C - Short Answer Questions (3 marks each)</h4> <p>Question No. 22 to 28 are short answer questions</p> `; threeMarks.forEach(q => { paperContent += ` <div class="question"> <p class="question-text">${questionCounter++}. ${q}</p> </div> `; }); // Section D - Case Studies (4 marks) const caseStudies = getRandomQuestions(selectedChapters, 'caseStudy', 2); paperContent += ` </div> <div class="question-section"> <h4 class="section-heading">Section D - Case Study Based Questions (4 marks each)</h4> <p>Question No. 29 to 30 are case-based questions.</p> `; caseStudies.forEach(cs => { paperContent += ` <div class="question"> <p class="question-text">${questionCounter++}. ${cs.case}</p> ${cs.questions.map((subQ, j) => `<p class="option">${j + 1}. ${subQ}</p>` ).join('')} </div> `; }); // Section E - 5 marks const fiveMarks = getRandomQuestions(selectedChapters, 'fiveMark', 3); paperContent += ` </div> <div class="question-section"> <h4 class="section-heading">Section E - Long Answer Questions (5 marks each)</h4> <p>Question No. 31 to 33 are long answer questions</p> `; fiveMarks.forEach(q => { paperContent += ` <div class="question"> <p class="question-text">${questionCounter++}. ${q}</p> </div> `; }); // Add buttons below the generated paper paperContent += ` </div> <div class="action-buttons"> <button class="btn btn-primary" onclick="downloadPDF()">Download as PDF</button> <button class="btn btn-success" onclick="window.print()">Print</button> <button class="btn btn-danger" onclick="backToStart()">Back to Start</button> </div> </div> `; generatedPaperContainer.innerHTML = paperContent; } async function downloadPDF() { const element = document.getElementById('generatedPaperContainer'); // Create a temporary div with optimized settings const tempDiv = document.createElement('div'); tempDiv.style.position = 'absolute'; tempDiv.style.left = '-9999px'; tempDiv.style.width = '794px'; // A4 width in pXels (210mm) tempDiv.style.backgroundColor = 'white'; tempDiv.style.padding = '20px'; tempDiv.innerHTML = element.innerHTML; document.body.appendChild(tempDiv); try { const pdf = new jsPDF('p', 'mm', 'a4'); const pageWidth = pdf.internal.pageSize.getWidth() - 25.4; // 0.5" margins const pageHeight = pdf.internal.pageSize.getHeight() - 25.4; // Split content into pages let position = 12.7; // Start with 0.5" top margin let remainingHeight = tempDiv.scrollHeight; let pageNum = 1; while (remainingHeight > 0) { // Capture the current page section const canvas = await html2canvas(tempDiv, { scale: 2, windowHeight: pageHeight * 3.78, // mm to px windowWidth: pageWidth * 3.78, y: position * 3.78, // mm to px height: pageHeight * 3.78, useCORS: true, backgroundColor: '#ffffff', logging: false }); const imgData = canvas.toDataURL('image/jpeg', 0.92); // Add page to PDF if (pageNum > 1) { pdf.addPage('a4', 'portrait'); } pdf.addImage(imgData, 'JPEG', 12.7, 12.7, pageWidth, canvas.height * pageWidth / canvas.width); position += pageHeight; remainingHeight -= pageHeight * 3.78; // px pageNum++; } document.body.removeChild(tempDiv); pdf.save(`${schoolName}_Science_Paper.pdf`); } catch (error) { console.error('PDF generation error:', error); alert('Error generating PDF. Please try again.'); document.body.removeChild(tempDiv); } } </script> </body> </html>