Untitled

window.onload = function() {
    let thumbnails = document.getElementsByClassName('thumbnail');
    let activeImages = document.getElementsByClassName('active');
    let itemImageMain = document.querySelector('.item-image-main');
    let featuredImage = document.getElementById('featured');
    let imgItem = document.querySelector('#main');
  
    for (var i = 0; i < thumbnails.length; i++) {
      thumbnails[i].addEventListener('mouseover', function() {
  
        if (activeImages.length > 0) {
          activeImages[0].classList.remove('active');
        }
  
        this.classList.add('active');
        document.getElementById('featured').src = this.src;
        itemImageMain.href = this.src;
      });
    }
  
    featuredImage.addEventListener('click', function() {
      var imageNames = [
        'error-', 'bordeaux-', 'dijon-', 'grand-dijon-', 
        'grand-paris-', 'grenoble-de-luxe-', 'grenoble-', 
        'mirecourt-de-luxe-', 'mirecourt-', 'nancy-', 
        'paris-plus-', 'paris-', 'reims-', 'saint-tropez-de-luxe-', 
        'saint-tropez-', 'tours-', 'versailles-', 
        'escalier-droit-bordeaux-', 'escalier-droit-dijon-', 
        'lille-deluxe-', 'lille-'
      ];
    
      for (var i = 1; i <= 50; i++) {
        var id = 'main' + i;
        if (imageNames.some(name => featuredImage.src.includes(name + i))) {
          console.log("Clicked on element with id:", id);
          document.getElementById(id).click();
          break;
        }
      }
    });
  }