=Major CustomBlocks.php overhaul, expanding block support and customization...

Jake Vanderwerf

7 days ago 46d681c6b825d21b3f698d793c4e630c687d90ad

 assets/js/concise/UtilityFunctions.js

@@ -418,9 +418,13 @@
      console.warn('prefixInput called with null/undefined input');
      return;
   }
   // console.log('Prefixing input: ', input);
   // console.log('With prefix: ', prefix);
   // console.log('Wrapper: ', wrapper);
   const oldId = input.id;
   const newId = replace ? prefix : `${prefix}${input.name}`;

   // console.log('Old ID: ', oldId);
   // console.log('New ID: ', newId);
   // Search for label within wrapper if provided, otherwise use existing logic
   let label = null;

@@ -988,12 +992,75 @@
   { passive: true }
);


window.previousBGSize = 'Small';
window.bgSizes = {
   Small: 500,
   Med: 768,
   Large: 1024
};

window.bgObserver = new IntersectionObserver((entries) => {
      entries.forEach(entry => {
         if (entry.isIntersecting) {
            let newSize = entry.target.dataset[`bg${window.previousBGSize}`];
            entry.target.style.backgroundImage = `url(${newSize})`;
            entry.target.dataset.bgImg = window.previousBGSize;
            window.bgObserver.unobserve(entry.target);
         }
      })
   },
   {
      root: null,
      rootMargin: '0px 0px -100px 0px',
      threshold: 0
   });

function updateBG() {
   let current = window.innerWidth;
   let newWidth = getBGWidth(current);

   if (newWidth) {
      window.previousBGSize = newWidth;
      document.querySelectorAll('[data-bg-img]:not([data-bg-img="'+window.previousBGSize+'"])').forEach(img => {
         window.bgObserver.observe(img);
      });
   }

}
function getBGWidth(width) {
   let prev = window.previousBGSize;

   let check = {
      Small: ['Med','Large'],
      Med: ['Large'],
      Large: false
   };

   if (!check[prev]) {
      return false;
   }
   let next = 'Small';

   check[prev].forEach(w => {
      if (width => window.bgSizes[w]) {
         next = w;
      }
   });
   return next;
}

updateBG();

// Debounced resize to recalc scrollable height
window.addEventListener('resize', () => {
   window.debouncer.schedule('recalc-max-scroll', () => {
      updateMaxScroll();
      updateScrollProgress(window.scrollY || docEl.scrollTop || 0);
   }, 20);
   window.debouncer.schedule('bg-resize', () => {
      updateBG();
   });
});

// Initial setup
@@ -1010,3 +1077,28 @@
   window.decodeHelper.innerHTML = text;
   return window.decodeHelper.value;
}


window.focusNextElement = function() {
   //add all elements we want to include in our selection
   var focussableElements =
      'a:not([disabled]), button:not([disabled]), input[type=text]:not([disabled]), [tabindex]:not([disabled]):not([tabindex="-1"])';
   if (document.activeElement && document.activeElement.form) {
      var focussable = Array.prototype.filter.call(
         document.activeElement.form.querySelectorAll(focussableElements),
         function (element) {
            //check for visibility while always include the current activeElement
            return (
               element.offsetWidth > 0 ||
               element.offsetHeight > 0 ||
               element === document.activeElement
            );
         }
      );
      var index = focussable.indexOf(document.activeElement);
      if (index > -1) {
         var nextElement = focussable[index + 1] || focussable[0];
         nextElement.focus();
      }
   }
}