1"use strict"; 2 3function slider_script(params) { 4 5 const sliders = document.querySelectorAll('.fr-slider'); 6 const inBuilder = document.querySelector('.iframe.mounted'); 7 8 const { isWpgb = false } = params || {}; 9 if (isWpgb) { 10 sliders.forEach((slider) => { 11 12 13 // remove pagination 14 const list = slider.querySelector('.splide__list'); 15 16 const pagination = slider.querySelector('.splide__pagination'); 17 if (pagination) pagination.remove(); 18 if (list.classList.contains('.wpgb-enabled')) { 19 const children = list.children; 20 21 for (let i = 0; i < children.length; i++) { 22 children[i].remove(); 23 } 24 25 } 26 }); 27 return; 28 } 29 30 const { isBricksFilters = false } = params || {}; 31 32 storeID(sliders) 33 addSlideClasses(sliders) 34 initiateSliders(sliders); 35 // switchIds(sliders) 36 // setBreakoutOverflow(sliders) 37 // paginationRender(sliders) 38 39 40 function afterSplideMounted() { 41 // storeID(sliders) 42 switchIds(sliders) 43 setBreakoutOverflow(sliders) 44 customAriaControls(sliders) 45 } 46 47 function customAriaControls(sliders) { 48 49 [...sliders] 50 .map((slider) => { 51 const options = sliderOptions(slider) 52 const slides = slider.querySelectorAll('.splide__slide:not(.splide__slide--clone)') 53 const paginationList = slider.querySelectorAll('.splide__pagination') 54 55 return { slides, paginationList, options } 56 }) 57 .filter(({ options, paginationList }) => (options.pagination && paginationList)) 58 .forEach(({ slides, paginationList }) => [...paginationList].flatMap(getFixedAriaIDs).forEach(fixAriaIDs(slides)) 59 ); 60 61 function fixAriaIDs() { 62 return ({ child, index }) => { 63 const slides = document.querySelectorAll('.splide__slide'); 64 const slideId = slides[index].id; 65 const childBullet = child.querySelector('button'); 66 childBullet.setAttribute('aria-controls', slideId); 67 }; 68 } 69 70 function getFixedAriaIDs(pagination) { 71 return [...pagination.querySelectorAll('li')] 72 .map((child, index) => ({ child, index })); 73 } 74 75 } 76 77 78 79 removeExtraPaginationInBuilder(sliders) 80 removeExtraPaginationInBricksFilters(sliders) 81 82 function storeID(sliders) { 83 sliders.forEach((slider) => { 84 const list = slider.querySelector('.splide__list'); 85 const children = list.children; 86 for (let i = 0; i < children.length; i++) { 87 // if(!children[i].id){ 88 // children[i].id = `demo-${[i]}` 89 90 // } 91 children[i].dataset.slideId = children[i].id 92 } 93 }); 94 } 95 96 97 function addSlideClasses(sliders) { 98 sliders.forEach((slider) => { 99 const list = slider.querySelector('.splide__list'); 100 const children = list.children; 101 102 103 for (let i = 0; i < children.length; i++) { 104 105 if (children[i].classList.contains('brx-nestable-children-placeholder')) { 106 continue; 107 } 108 if (children[i].classList.contains('splide__slide')) { 109 } 110 children[i].classList.add('splide__slide'); 111 } 112 113 if (children.length > 1 && inBuilder) { 114 for (let i = 0; i < children.length; i++) { 115 if (children[i].classList.contains('brx-nestable-children-placeholder')) { 116 children[i].remove(); 117 } 118 } 119 } 120 121 }); 122 } 123 124 function switchIds(sliders) { 125 sliders.forEach((slider) => { 126 const list = slider.querySelector('.splide__list'); 127 const children = list.children; 128 for (let i = 0; i < children.length; i++) { 129 const child = children[i] 130 // Jira issue: FC-100 131 child.dataset.splideSlide = child.id 132 if(child.dataset.slideId) { 133 child.id = child.dataset.slideId 134 } else { 135 child.dataset.slideId = child.dataset.splideSlide 136 } 137 } 138 }); 139 } 140 141 // function initiateSliders 142 function initiateSliders(sliders) { 143 144 const slidersToSync = Array.from(sliders).filter((slider) => { 145 return slider.dataset.frSliderSync === 'true'; 146 }); 147 148 const slidersSingles = Array.from(sliders).filter((slider) => { 149 return slider.dataset.frSliderSync === 'false'; 150 }); 151 152 const slidersToSyncByID = slidersToSync.reduce((acc, slider) => { 153 const id = slider.dataset.frSliderSyncId; 154 if (!acc[id]) { 155 acc[id] = []; 156 } 157 acc[id].push(slider); 158 return acc; 159 }, {}); 160 161 const slidersSync = []; 162
163 Object.keys(slidersToSyncByID).forEach((id) => { 164 const slidersInstance = []; 165 slidersToSyncByID[id].forEach((slider) => { 166 const splideInstance = new Splide(slider) 167 splideInstance.on('mounted', afterSplideMounted) 168 slidersInstance.push(splideInstance); 169 }); 170 171 172 const sortedSliderInstances = slidersInstance.sort((a, b) => { 173 const aIsNavigation = JSON.parse(a.root.dataset.splide)?.isNavigation ?? false; 174 const bIsNavigation = JSON.parse(b.root.dataset.splide)?.isNavigation ?? false; 175 return aIsNavigation - bIsNavigation; 176 }); 177 178 slidersSync.push({ id, slidersInstance: sortedSliderInstances }); 179 180 }); 181 182 slidersSync.forEach((group) => { 183 group.slidersInstance.forEach((slider, index) => { 184 185 slider.on('move', (newIndex) => { 186 syncOtherSliders(group.slidersInstance, index, newIndex); 187 }); 188 189 190 if (turnAutoScroll(slider.root)) { 191 slider.mount(window.splide.Extensions); 192 } else { 193 slider.mount(); 194 } 195 196 slider.on('moved', () => { 197 updateButtonState(group.id, slider); 198 }) 199 200 updateButtonState(group.id, slider); 201 202 if (index === 0) { 203 customNavButton(group.id, slider, 'next') 204 customNavButton(group.id, slider, 'prev') 205 progressBar(group.id, slider) 206 } 207 208 window.bricksData.splideInstances[group.id] = slider; 209 210 }); 211 }); 212 213 slidersSingles.forEach((slider) => { 214 215 const splide = new Splide(slider); 216 splide.on('mounted', afterSplideMounted) 217 if (turnAutoScroll(slider)) { 218 splide.mount(window.splide.Extensions); 219 } else { 220 splide.mount(); 221 } 222 223 window.bricksData.splideInstances[slider.id] = splide; 224 }); 225 226 } 227 // end function initiateSliders 228 229 function syncOtherSliders(sliders, sourceIndex, newIndex) { 230 sliders.forEach((otherSlider, otherIndex) => { 231 if (otherIndex !== sourceIndex) { 232 otherSlider.go(newIndex); 233 } 234 }); 235 } 236 237 238 239 // breakout 240 241 function setBreakoutOverflow(sliders) { 242 sliders.forEach((slider) => { 243 const isBreakout = slider.dataset.frSliderBreakout; 244 if (isBreakout === 'false') return 245 const list = slider.querySelector('.fr-slider__list'); 246 const track = slider.querySelector('.fr-slider__track'); 247 list.style.overflow = 'visible'; 248 track.style.overflow = 'visible'; 249 250 }); 251 } 252 253 // Auto Scroll 254 255 function turnAutoScroll(slider) { 256 const autoScroll = slider.dataset.frSliderAutoScroll; 257 if (autoScroll === 'true') { 258 return true; 259 } 260 return false; 261 } 262 263 // Custom Controls 264 265 function getSliderSyncID(slider) { 266 if (slider.dataset.frSliderSyncId) { 267 return slider.dataset.frSliderSyncId; 268 } else { 269 return null; 270 } 271 } 272 273 function customNavButton(id, slider, direction) { 274 const customNavs = document.querySelectorAll('.fr-slider-custom-navigation'); 275 customNavs.forEach((nav) => { 276 if (nav.dataset.frSliderNavType === 'next' || nav.dataset.frSliderNavType === 'nextPrev' || nav.dataset.frSliderNavType === 'prev') { 277 const syncID = nav.dataset.frSliderNavSyncId; 278 if (syncID === id) { 279 const buttons = nav.querySelectorAll(`.fr-slider__custom-arrow--${direction}`); 280 buttons.forEach((button) => { 281 button.addEventListener('click', function () { 282 const command = direction === 'next' ? '+1' : '-1'; 283 slider.go(command); 284 updateButtonState(id, slider); // call updateButtonState after the slide change 285 }); 286 }); 287 } 288 } 289 }); 290 } 291 292 293 function updateButtonState(id, slider) { 294 const customNavs = document.querySelectorAll('.fr-slider-custom-navigation'); 295 customNavs.forEach((nav) => { 296 if (nav.dataset.frSliderNavType === 'next' || nav.dataset.frSliderNavType === 'nextPrev' || nav.dataset.frSliderNavType === 'prev') { 297 const syncID = nav.dataset.frSliderNavSyncId; 298 if (syncID === id) { 299 const buttons = nav.querySelectorAll('.fr-slider__custom-arrow'); 300 const type = slider.options.type; 301 const rewind = slider.options.rewind; 302 const getIndex = slider.index; // get the current slide index 303 const slidesCount = slider.length; // get the total number of slides 304 const perPage = slider.options.perPage; // get the number of slides per page 305 306 if ((getIndex >= slidesCount - perPage) && type !== 'loop' && rewind !== true) { 307 buttons[1].setAttribute('disabled', '') 308 } else { 309 buttons[1].removeAttribute('disabled') 310 } 311 312 if (getIndex === 0 && type !== 'loop' && rewind !== true) { 313 buttons[0].setAttribute('disabled', '') 314 } else { 315 buttons[0].removeAttribute('disabled') 316 } 317 } 318 } 319 }); 320 } 321 322 323 324 325 326 function goToSlide(slider, index) { 327 slider.go(index); 328 } 329 330 function progressBar(id, slider) { 331 332 const customNavs = document.querySelectorAll('.fr-slider-custom-navigation[data-fr-slider-nav-sync-id="' + id + '"]');
333 customNavs.forEach((nav) => { 334 if (nav.dataset.frSliderNavType === 'progress') { 335 let counter = 0; 336 const bar = nav.querySelector('.fr-slider__progress-bar'); 337 const syncID = nav.dataset.frSliderNavSyncId; 338 if (syncID === id) { 339 340 function updateProgress() { 341 const end = slider.Components.Controller.getEnd() + 1; 342 const rate = Math.min((slider.index + 1) / end, 1); 343 bar.style.width = String(100 * rate) + '%'; 344 } 345 346 updateProgress(); 347 slider.on('mounted move', updateProgress); 348 349 350 } 351 352 const buttonsWrapper = nav.querySelector('.fr-slider__progress-buttons'); 353 const slides = slider.Components.Elements.slides; 354 355 slides.forEach((slide, index) => { 356 357 const button = document.createElement('button'); 358 button.classList.add('fr-slider__progress-button'); 359 button.setAttribute('data-index', index); 360 buttonsWrapper.appendChild(button); 361 }); 362 363 const buttons = buttonsWrapper.querySelectorAll('.fr-slider__progress-button'); 364 buttons.forEach((button) => { 365 button.addEventListener('click', function () { 366 const index = Number(button.dataset.index); 367 368 slider.go(index); 369 }); 370 }); 371 372 } 373 374 }); 375 } 376 377 378 379 function paginationRender(sliders) { 380 381 sliders.forEach((slider) => { 382 const paginationList = slider.querySelectorAll('.fr-slider__pagination'); 383 paginationList.forEach((pagination, index) => { 384 if (index === 0) { 385 return; 386 } 387 pagination.remove(); 388 }); 389 390 }); 391 } 392 393 394 function sliderOptions(slider) { 395 return slider.dataset.splide ? JSON.parse(slider.dataset.splide) : {}; 396 } 397 398 399 function removeExtraPaginationInBuilder(sliders) { 400 401 if (inBuilder) { 402 sliders.forEach((slider) => { 403 const slidesList = slider.querySelector('.splide__list'); 404 const children = slidesList.children.length; 405 const slidesLength = children - 1; 406 const paginationList = slider.querySelectorAll('.splide__pagination'); 407 408 const options = sliderOptions(slider) 409 410 paginationList.forEach((pagination, index) => { 411 if (pagination.children.length > slidesLength) { 412 const children = pagination.querySelectorAll('li'); 413 const childrenLength = children.length; 414 children.forEach((child, index) => { 415 if (index > slidesLength && options.perPage <= 1) { 416 child.remove(); 417 } else if (index > slidesLength / options.perPage && options.perPage > 1) { 418 child.remove(); 419 } 420 421 }); 422 } 423 }); 424 }); 425 } 426 } 427 428 function removeExtraPaginationInBricksFilters(sliders) { 429 if (!isBricksFilters) return 430 431 sliders.forEach((slider) => { 432 const sliderList = slider.querySelector('.splide__list'); 433 const slidesList = sliderList.querySelectorAll('.splide__slide:not(.splide__slide--clone)'); 434 const slidesLength = slidesList.length; 435 const paginationList = slider.querySelectorAll('.splide__pagination'); 436 437 paginationList.forEach((pagination, index) => { 438 const paginationItems = pagination.querySelectorAll('li'); 439 440 if (paginationItems.length <= slidesLength) return 441 442 Array.from(paginationItems).forEach((item, index) => { 443 if (index <= slidesLength) return 444 item.remove() 445 }) 446 447 const sliderId = slider.id 448 refreshSliderInstance(sliderId) 449 450 }) 451 }); 452 } 453 454 function refreshSliderInstance(sliderId) { 455 const sliderInstance = window.bricksData.splideInstances[sliderId]; 456 if (!sliderInstance) return 457 sliderInstance.refresh() 458 } 459 460} 461 462// document.addEventListener("DOMContentLoaded", slider_script); 463 464function wpgb_slider_script() { 465 466 // check for the presence of WP_GRID_Builder 467 if (window.WP_Grid_Builder) { 468 WP_Grid_Builder.on('init', function (wpgb) { 469 470 // check for wpgb.facets, if no facets dont run the code 471 if (wpgb.facets) { 472 wpgb.facets.on('appended', function (nodes) { 473 474 475 let isFacetSlider = false;
476 477 const sliders = document.querySelectorAll('.fr-slider'); 478 sliders.forEach((slider) => { 479 if (slider.querySelector('.wpgb-enabled')) { 480 isFacetSlider = true; 481 console.log('isFacetSlider', isFacetSlider) 482 } 483 }); 484 485 if (isFacetSlider) { 486 slider_script() 487 } 488 489 }); 490 491 wpgb.facets.on('change', function () { 492 493 let isFacetSlider = false; 494 495 const sliders = document.querySelectorAll('.fr-slider'); 496 sliders.forEach((slider) => { 497 if (slider.querySelector('.wpgb-enabled')) { 498 isFacetSlider = true; 499 console.log('isFacetSlider', isFacetSlider) 500 } 501 }); 502 503 if (isFacetSlider) { 504 slider_script({ isWpgb: true }) 505 } 506 507 // slider_script({ isWpgb: true }) 508 509 }); 510 } 511 512 }); 513 } 514} 515 516function runSliderScriptsOnBricksFilters() { 517 518 if (typeof window.bricksFilters !== 'function') return 519 520 521 const bricksFilterRun = bricksFiltersFn.run 522 bricksFiltersFn.run = function () { 523 524 bricksFilterRun.apply(this, arguments) 525 setTimeout(() => { 526 slider_script({isBricksFilters: true}) 527 }) 528 } 529} 530 531document.addEventListener("DOMContentLoaded", function (e) { 532 533 bricksIsFrontend && slider_script(); 534 bricksIsFrontend && wpgb_slider_script(); 535 bricksIsFrontend && runSliderScriptsOnBricksFilters() 536 537}); 538 539
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.