Merge pull request #40 from TheCodeRaccoons/Develop

Develop - > Main

Author: JorchCortez

Dist/WebflowOnly/CMSFilter.js

@@ -33,6 +33,7 @@ class CMSFilter {
         this.sortOptions = document.querySelector('[wt-cmsfilter-element="sort-options"]');
         this.resultCount = document.querySelector('[wt-cmsfilter-element="results-count"]');
         this.emptyElement = document.querySelector('[wt-cmsfilter-element="empty"]');
+        this.resetIx2 = this.listElement.getAttribute('wt-cmsfilter-resetix2') || false;
 
         //Data Tracking Values
         this.allItems = [];
@@ -206,6 +207,7 @@ class CMSFilter {
                 const currentPage = this.filteredItems.slice(currentSlice, currentSlice + this.itemsPerPage);
                 currentPage.forEach(item => {
                     this.listElement.appendChild(item);
+                    if(this.resetIx2) this.ResetInteraction(item);
                 });
             }
         } else {
@@ -214,10 +216,6 @@ class CMSFilter {
             });
         }
 
-        var webflow = window.Webflow || [];
-        if(webflow) {
-            webflow.require('ix2').init();
-        }
         this.ToggleEmptyState();
         this.UpdatePaginationDisplay();
     }
@@ -292,7 +290,6 @@ class CMSFilter {
         this.SetActiveTags();
     }
 
-
     ShowResultCount() {
         if(!this.resultCount) return;
         this.resultCount.innerText = this.GetResults();
@@ -369,7 +366,6 @@ class CMSFilter {
         return filters;
     }
 
-
     GetDataSet(str) {
         return str.replace(/(?:^\w|[A-Z]|\b\w)/g, function(word, index) {
             return index === 0 ? word.toLowerCase() : word.toUpperCase();
@@ -524,8 +520,10 @@ class CMSFilter {
             }
         } 
         if(this.allItems){
-            if(this.allItems.length > 0) {
-                return this.allItems.length;
+            //trim out static elements from RenderStatic
+            let elements = this.allItems.filter(item => !item.hasAttribute('wt-renderstatic-element'));
+            if(elements.length > 0) {
+                return elements.length;
             }
             return 0;
         }
@@ -565,6 +563,37 @@ class CMSFilter {
         this.ApplyFilters();
     }
 
+    ResetInteraction(element) {
+        if (!element) {
+            console.error('Element not found');
+            return;
+        }
+
+        const WebflowIX2 = window.Webflow && Webflow.require('ix2');
+        if (!WebflowIX2) {
+            console.error('Webflow IX2 engine not found.');
+            return;
+        }
+
+        const targetElement = element.hasAttribute('data-w-id') 
+            ? element 
+            : element.querySelector('[data-w-id]');
+        
+        if (!targetElement) {
+            console.warn('No IX2 interaction found on the element or its children.');
+            return;
+        }
+
+        const dataWId = targetElement.getAttribute('data-w-id');
+        if (dataWId) {
+            targetElement.removeAttribute('data-w-id');
+            targetElement.setAttribute('data-w-id', dataWId);
+
+            WebflowIX2.init();
+        } else {
+            console.warn('No valid data-w-id attribute found.');
+        }
+    }
 
     GetFilterData() {
         let filterData = {

Dist/WebflowOnly/RenderStatic.js

@@ -25,23 +25,27 @@ class RenderStatic {
 
         let insertIndex = this.gap;
         const totalChildren = childrenArray.length;
-        const totalInsertions = Math.round(totalChildren / this.gap);
         let cloneIndex = 0;
 
-        for (let i = 0; i <= totalChildren + totalInsertions; i++) {
-            if (i === insertIndex) {
-                this.insertChildAtIndex(this.container, this.cloneables[cloneIndex], insertIndex);
-                cloneIndex = (cloneIndex < this.cloneables.length - 1) ? cloneIndex + 1 : 0;
-                insertIndex = i + this.gap + 1;
-            }
+        const maxInsertions = Math.floor((totalChildren - 1) / this.gap);
+
+        for (let i = 0; i < maxInsertions; i++) {
+            const currentIndex = i * (this.gap + 1) + this.gap;
+
+            if (currentIndex >= totalChildren) break;
+
+            this.insertChildAtIndex(this.container, this.cloneables[cloneIndex], currentIndex);
+            cloneIndex = (cloneIndex < this.cloneables.length - 1) ? cloneIndex + 1 : 0;
         }
 
         this.observeContainer();
     }
 
     insertChildAtIndex(parent, child, index = 0) {
         if (!child) return;
-        if (parent.children.length === index) return;
+
+        if (index >= parent.children.length) return;
+
         let childClone = child.cloneNode(true);
         if (parent) {
             parent.insertBefore(childClone, parent.children[index]);
@@ -77,5 +81,5 @@ const initializeRenderStatic = () => {
 if (/complete|interactive|loaded/.test(document.readyState)) {
     initializeRenderStatic();
 } else { 
-    window.addEventListener('DOMContentLoaded',initializeRenderStatic )
-}
+    window.addEventListener('DOMContentLoaded', initializeRenderStatic);
+}