Reading Comprehension Assistant

Reading Comprehension Assistant

1. Paste Your Text

2. Ask Your Questions

3. Review Answers

Answers will appear here after you submit your text and questions.

Please provide both a text passage and at least one question.

`; return; } // Show loading state answersPlaceholder.classList.add('hidden'); loadingSpinner.classList.remove('hidden'); answersOutput.innerHTML = ''; // Clear previous answers answersOutput.appendChild(loadingSpinner); const questionArray = questions.split('\n').filter(q => q.trim() !== ''); // Construct the prompt for the Gemini API const prompt = ` Based *only* on the following text passage, answer each of the questions provided. If the answer to a question cannot be found in the text, explicitly state "The answer is not found in the provided text." Do not use any external knowledge. --- TEXT PASSAGE --- ${passage} --- END TEXT PASSAGE --- --- QUESTIONS --- ${questionArray.join('\n')} --- END QUESTIONS --- `; // Define the expected JSON structure for the response const payload = { contents: [{ role: "user", parts: [{ text: prompt }] }], generationConfig: { responseMimeType: "application/json", responseSchema: { type: "OBJECT", properties: { "answers": { "type": "ARRAY", "items": { "type": "OBJECT", "properties": { "question": { "type": "STRING" }, "answer": { "type": "STRING" } }, required: ["question", "answer"] } } }, required: ["answers"] } } }; try { const response = await fetch(API_URL, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(payload) }); if (!response.ok) { throw new Error(`API request failed with status ${response.status}`); } const result = await response.json(); if (result.candidates && result.candidates.length > 0 && result.candidates[0].content && result.candidates[0].content.parts && result.candidates[0].content.parts.length > 0) { const jsonText = result.candidates[0].content.parts[0].text; const parsedJson = JSON.parse(jsonText); displayAnswers(parsedJson.answers); } else { throw new Error("Invalid response structure from API."); } } catch (error) { console.error("Error fetching answers:", error); answersOutput.innerHTML = `

An error occurred while fetching answers. Please check the console for details.

`; } finally { loadingSpinner.classList.add('hidden'); } }; /** * Renders the questions and answers in the output area. * @param {Array} answersArray - An array of {question, answer} objects. */ const displayAnswers = (answersArray) => { answersOutput.innerHTML = ''; // Clear previous content if (!answersArray || answersArray.length === 0) { answersOutput.appendChild(answersPlaceholder); answersPlaceholder.classList.remove('hidden'); answersPlaceholder.innerText = "No answers were generated. Try rephrasing your questions."; return; } const fragment = document.createDocumentFragment(); answersArray.forEach(item => { const qaBlock = document.createElement('div'); qaBlock.className = 'p-4 border border-gray-200 rounded-lg bg-gray-50'; const questionEl = document.createElement('p'); questionEl.className = 'font-semibold text-gray-800 mb-2'; questionEl.textContent = `Q: ${item.question}`; const answerEl = document.createElement('p'); answerEl.className = 'text-gray-700'; answerEl.textContent = `A: ${item.answer}`; qaBlock.appendChild(questionEl); qaBlock.appendChild(answerEl); fragment.appendChild(qaBlock); }); answersOutput.appendChild(fragment); }; // --- Event Listener --- if (getAnswersBtn) { getAnswersBtn.addEventListener('click', handleGetAnswers); } });
Scroll to Top