templates/AppTemplates/valide/galerieContent/element.js line 1

Open in your IDE?
  3. var gallery = document.querySelector('#gallery');
  4. var getVal = function (elem, style) { return parseInt(window.getComputedStyle(elem).getPropertyValue(style)); };
  5. var getHeight = function (item) { return item.querySelector('.content').getBoundingClientRect().height; };
  6. var resizeAll = function () {
  7. var altura = getVal(gallery, 'grid-auto-rows');
  8. var gap = getVal(gallery, 'grid-row-gap');
  9. gallery.querySelectorAll('.gallery-item').forEach(function (item) {
  10. var el = item;
  11. el.style.gridRowEnd = "span " + Math.ceil((getHeight(item) + gap) / (altura + gap));
  12. });
  13. };
  14. gallery.querySelectorAll('img').forEach(function (item) {
  15. item.classList.add('byebye');
  16. if (item.complete) {
  17. console.log(item.src);
  18. }
  19. else {
  20. item.addEventListener('load', function () {
  21.     var altura = getVal(gallery, 'grid-auto-rows');
  22.     var gap = getVal(gallery, 'grid-row-gap');
  23.     var gitem = item.parentElement.parentElement;
  24.     gitem.style.gridRowEnd = "span " + Math.ceil((getHeight(gitem) + gap) / (altura + gap));
  25.     item.classList.remove('byebye');
  26. });
  27. }
  28. });
  29. window.addEventListener('resize', resizeAll);
  30. gallery.querySelectorAll('.gallery-item').forEach(function (item) {
  31. item.addEventListener('click', function () {        
  32. item.classList.toggle('full');        
  33. });
  34. });