script.js

// Function to switch between screens
function showScreen(screenNumber) {
  // Hide all screens
  document.querySelectorAll('.screen').forEach(screen => {
    screen.classList.remove('active');
  });
  
  // Show the requested screen
  document.getElementById('screen' + screenNumber).classList.add('active');
}

// Handle form submission
function handleSubmit() {
  const response = document.getElementById('response').value.trim();
  
  if (response.length < 10) {
    alert('Please provide a more detailed response.');
    return;
  }
  
  // Analyze the response and provide feedback
  const feedback = analyzeResponse(response);
  
  // Display feedback
  document.getElementById('feedbackText').innerHTML = feedback;
  
  // Show feedback screen
  showScreen(4);
}

// Function to analyze caregiver response
function analyzeResponse(response) {
  // Convert to lowercase for easier matching
  const lowercaseResponse = response.toLowerCase();
  
  // Initialize score and feedback
  let score = 0;
  let positiveFeedback = [];
  let improvementFeedback = [];
  
  // Check for positive approaches
  if (lowercaseResponse.includes('calm') || lowercaseResponse.includes('gentle')) {
    score += 1;
    positiveFeedback.push('✓ Using a calm and gentle approach');
  } else {
    improvementFeedback.push('✗ Consider using a calm and gentle tone');
  }
  
  if (lowercaseResponse.includes('distract') || lowercaseResponse.includes('redirect')) {
    score += 2;
    positiveFeedback.push('✓ Good use of redirection or distraction techniques');
  } else {
    improvementFeedback.push('✗ Consider using redirection or distraction');
  }
  
  if (lowercaseResponse.includes('reassure') || lowercaseResponse.includes('comfort')) {
    score += 1;
    positiveFeedback.push('✓ Providing reassurance and comfort');
  }
  
  if (lowercaseResponse.includes('listen') || lowercaseResponse.includes('understand')) {
    score += 1;
    positiveFeedback.push('✓ Taking time to listen and understand concerns');
  }
  
  if (lowercaseResponse.includes('routine') || lowercaseResponse.includes('familiar')) {
    score += 1;
    positiveFeedback.push('✓ Recognizing the importance of routine or familiarity');
  }
  
  // Check for approaches to avoid
  if (lowercaseResponse.includes('force') || lowercaseResponse.includes('insist')) {
    score -= 1;
    improvementFeedback.push('✗ Avoid forcing or insisting when someone with dementia is agitated');
  }
  
  if (lowercaseResponse.includes('argue') || lowercaseResponse.includes('reason with')) {
    score -= 1;
    improvementFeedback.push('✗ Avoid arguing or using complex reasoning');
  }
  
  // Generate feedback based on score
  let feedbackHTML = '';
  
  if (score >= 3) {
    feedbackHTML += '<h3 class="feedback-positive">Great approach!</h3>';
  } else if (score >= 1) {
    feedbackHTML += '<h3 class="feedback-neutral">Good start, with room for improvement</h3>';
  } else {
    feedbackHTML += '<h3 class="feedback-negative">Consider a different approach</h3>';
  }
  
  // Add detailed feedback
  feedbackHTML += '<div class="feedback-details">';
  
  if (positiveFeedback.length > 0) {
    feedbackHTML += '<div class="feedback-section"><h4>What you did well:</h4><ul>';
    positiveFeedback.forEach(item => {
      feedbackHTML += `<li>${item}</li>`;
    });
    feedbackHTML += '</ul></div>';
  }
  
  if (improvementFeedback.length > 0) {
    feedbackHTML += '<div class="feedback-section"><h4>Suggestions for improvement:</h4><ul>';
    improvementFeedback.forEach(item => {
      feedbackHTML += `<li>${item}</li>`;
    });
    feedbackHTML += '</ul></div>';
  }
  
  // Add expert tips
  feedbackHTML += `
    <div class="feedback-section">
      <h4>Expert tips:</h4>
      <ul>
        <li>Approach from the front, maintain eye contact</li>
        <li>Use simple language and short sentences</li>
        <li>Allow extra time for responses</li>
        <li>Consider unmet needs (hunger, thirst, pain, toilet)</li>
        <li>Create a calm environment (reduce noise, appropriate lighting)</li>
      </ul>
    </div>
  `;
  
  feedbackHTML += '</div>';
  
  return feedbackHTML;
}