// Grabbing elements
const imageInput = document.getElementById('imageInput');
const uploadButton = document.getElementById('uploadButton');
const resultContainer = document.getElementById('result-container');
const resultText = document.getElementById('resultText');
const uploadedImage = document.getElementById('uploadedImage');

// Mock prediction function (replace this with Hugging Face API call if needed)
function mockPrediction(image) {
  const classes = ['Cat', 'Dog'];
  const randomIndex = Math.floor(Math.random() * classes.length);
  return classes[randomIndex];
}

// Handle upload button click
uploadButton.addEventListener('click', () => {
  const file = imageInput.files[0];
  if (!file) {
    alert('Please upload an image first!');
    return;
  }

  // Display the image
  const reader = new FileReader();
  reader.onload = function (e) {
    uploadedImage.src = e.target.result;
    uploadedImage.alt = file.name;
  };
  reader.readAsDataURL(file);

  // Mock prediction
  const prediction = mockPrediction(file);
  resultText.textContent = `This looks like a ${prediction}!`;

  // Show result container
  resultContainer.classList.remove('hidden');
});