flask_LPE/static/js/script.js

$(document).ready(function(){

    if ($('#homeSpacer')){
        $('#content').css({height:'0',overflow:'hidden'});
     $('#homeSpacer').click(function(){
          $(this).css('height','0');
          $('#content').css({height:'auto',overflow:'auto'});
          $('nav').css('z-index','1000');
          $("body").css('overflow','auto');  

     });
    }
    function getRndInteger(min, max) {
         return Math.floor(Math.random() * (max - min + 1) ) + min;
    }
    var vw = $(window).width(); 
    var sun_x = getRndInteger(0, vw - 100);
    var sun_y = getRndInteger(0, 550);
    var shape_x = getRndInteger(-vw/2, vw/2);
    var shape_y = getRndInteger(0, 200);


    $('.picto_sun').css({top:sun_y , left:sun_x,});
    $('.picto_shape').css({top:shape_y , left:shape_x, width:vw , height: 'auto'});

    $('#topBtn').click(function(){
        $('.menuItem').toggleClass('open')
      });

    $('.menuItem').click(function(){
        $('.menuItem').removeClass('menu_active');
        $('.menuItem').toggleClass('open');
        $(this).addClass('menu_active');
      });

    $(document).scroll(function() {
        var dtop = $(document).scrollTop();
        var maxH = $(document).height();
        var windowh = $(window).height();
        var ratio = maxH / windowh; 
        var topval = dtop+(dtop/ratio)+140; 
        $('#logo').css('top',topval );
    })



    actu_img_width = $('.img_container').width();
    console.log(actu_img_width);
    $('.img_container').css('height', actu_img_width);
})

  // Lightbox functionality
const galleryThumbnails = document.querySelectorAll('.gallery-thumbnail');
const lightboxModal = document.getElementById('lightboxModal');
const lightboxImage = document.getElementById('lightboxImage');
const closeLightbox = document.getElementById('closeLightbox');

// Open lightbox when thumbnail is clicked
galleryThumbnails.forEach(thumbnail => {
    thumbnail.addEventListener('click', function() {
        const fullsizeImageSrc = thumbnail.getAttribute('data-fullsize');
        lightboxImage.src = fullsizeImageSrc;
        lightboxModal.classList.add('active');
    });
});

// Close lightbox
closeLightbox.addEventListener('click', function() {
    lightboxModal.classList.remove('active');
});

// Close lightbox when clicked outside the image
window.addEventListener('click', function(event) {
    if (event.target === lightboxModal) {
        lightboxModal.classList.remove('active');
    }
});