1// @TODO withClassName || with-class-name 2 3(function ($, Drupal, once, drupalSettings) { 4 'use strict'; 5 6 Drupal.behaviors.CohesionSlick = { 7 attach: function (context) { 8 var gridSettings = drupalSettings.cohesion.responsive_grid_settings; 9 var cmm = new Drupal.CohesionResponsiveBreakpoints( 10 drupalSettings.cohesion.responsive_grid_settings 11 ); 12 var onceInit = 'coh-slider-container-init'; 13 const isMatchHeightEnabled = drupalSettings.cohesion.front_end_settings.global_js.matchHeight; 14 15 $.each($('.coh-slider-container', context), function () { 16 var $this = $(this); 17 var $slider = $('> .coh-slider-container-mid > .coh-slider-container-inner', this); 18 var $slides = $('> .coh-slider-item', $slider); 19 20 // Refresh slick if this is re-called (e.g. when opening a tab containing a slick slider and attaching drupal behaviors) 21 if ($this.data('jquery-once-' + onceInit)) { 22 $slider.slick('refresh'); 23 return; 24 } 25 26 // handle case where in VPB you might add a slider but not have added the slide yet. Trick slick into thinking is initialised. 27 if (!$slides.length) { 28 $slider.addClass('slick-initialized'); 29 return; 30 } 31 32 function updateCount(slick) { 33 var i = (slick.currentSlide ? slick.currentSlide : 0) + 1; 34 35 slick.$slideCounter.text(i + '/' + slick.slideCount); 36 } 37 38 function updateCounter(slick) { 39 if (slick.options.counter) { 40 // Only append if it doesnt exist - moves the DOM element around so we don't have to worry about any clean up 41 if (!$(slick.options.appendCounter).find(slick.$slideCounter).length) { 42 $(slick.options.appendCounter).append(slick.$slideCounter); 43 } 44 } else { 45 // Detach from the DOM, but keep in memory ready for use later if we need it 46 slick.$slideCounter.detach(); 47 } 48 // Always keep the counter up to date regardless 49 updateCount(slick); 50 } 51 52 function updateNavigationLabels(slick) { 53 // Accessibility of labels 54 if (slick.options.infinite && slick.options.arrows) { 55 if (i === 1) { 56 $(slick.$prevArrow).attr('aria-label', 'Last slide'); 57 } else { 58 $(slick.$prevArrow).attr('aria-label', 'Previous slide'); 59 } 60 61 if (i === slick.slideCount) { 62 $(slick.$nextArrow).attr('aria-label', 'First slide'); 63 } else { 64 $(slick.$nextArrow).attr('aria-label', 'Next slide'); 65 } 66 } 67 } 68 69 // Recall behaviors for any cloned slides 70 $slider.on('init', function (event, slick) {
71 var clones = $($('.slick-cloned', slick.$slideTrack)); 72 73 // Cache the slide counter into memory 74 slick.$slideCounter = $('<div />', { 75 class: slick.options.counterClass, 76 }); 77 78 // We only want to init this once we know that the slider has actually initd 79 once(onceInit, $this); 80 81 $.each(clones, function () { 82 Drupal.behaviors.CohesionSlick.attach($(this)); 83 }); 84 85 updateCounter(slick); 86 87 updateNavigationLabels(slick); 88 }); 89 90 $slider.on('afterChange', function (event, slick) { 91 updateCount(slick); 92 93 updateNavigationLabels(slick); 94 }); 95 96 $slider.on('breakpoint', function (event, slick, breakpoint) { 97 // Update the counter encase the position has changed per breakpoint 98 updateCounter(slick); 99 }); 100 101 var settings = $slider.data().cohSlider; 102 103 settings.mobileFirst = cmm.getGridType() === cmm.constants.mobile; 104 105 // Handle the dots if the user asked for the dots to be numbers otherwise just fallback to a style 106 // We can't use === as twig sends back 0 || 1 107 settings.customPaging = function (slider, i) { 108 return settings.dotsNumbers == true 109 ? $('<button type="button" />').text(i + 1) 110 : $('<button type="button" />'); 111 }; 112 113 if (typeof settings.asNavFor !== 'undefined' && settings.asNavFor !== null) { 114 settings.asNavFor = $(settings.asNavFor + ' .coh-slider-container-inner'); 115 } 116 117 var responsive = []; 118 var matchHeights = {}; 119 var matchHeightsInit = false; 120 var previousResponsiveSettings = false; 121 122 // Loop through the slick slider breakpoints. 123 for (var i = 0; i < cmm.breakpoints.length; i++) { 124 var breakpointKey = cmm.breakpoints[i].key; 125 var breakpoint = settings.responsive[breakpointKey]; 126 127 // Grab the match heights settings 128 if ( 129 typeof breakpoint !== 'undefined' && 130 typeof breakpoint.matchHeights !== 'undefined' && 131 !$.isArray(breakpoint.matchHeights) 132 ) { 133 matchHeights[breakpointKey] = settings.responsive[breakpointKey].matchHeights; 134 135 // Handle custom classes 136 if (typeof matchHeights[breakpointKey].class !== 'undefined') { 137 matchHeights[breakpointKey].target = matchHeights[breakpointKey].class; 138 } 139 140 matchHeightsInit = true; 141 } 142 143 // If the grid is set to desktop first then grab the desktop first settings and 144 // set them outside the responsive settings so they are default 145 if (cmm.getGridType() !== cmm.constants.mobile && breakpointKey === 'xl') { 146 // Move the current settings into global 147 if (typeof breakpoint.appendArrows !== 'undefined') { 148 breakpoint.appendArrows = $(breakpoint.appendArrows.trim() + ':first', $this); 149 } 150 151 // Move the current settings into global 152 if (typeof breakpoint.appendDots !== 'undefined') { 153 breakpoint.appendDots = $(breakpoint.appendDots.trim() + ':first', $this); 154 } 155 156 // Move the current settings into global 157 if (typeof breakpoint.appendCounter !== 'undefined') { 158 breakpoint.appendCounter = $(breakpoint.appendCounter.trim() + ':first', $this); 159 } 160 161 // Move the current settings into global 162 if (typeof breakpoint.appendPlaypause !== 'undefined') { 163 breakpoint.appendPlaypause = $(breakpoint.appendPlaypause.trim() + ':first', $this); 164 } 165 166 jQuery.extend(settings, breakpoint); 167 } else { 168 // Remove anything without any settings 169 if (!jQuery.isEmptyObject(breakpoint)) { 170 var responsive_obj = { settings: breakpoint }; 171 172 // Update the slick slider object with the pixel value width. 173 if (typeof gridSettings.breakpoints[breakpointKey].width === 'undefined') { 174 // This must be the lowest breakpoint because it doesn't have a width defined 175 responsive_obj.breakpoint = 0; 176 } else { 177 // Otherwise grab the width from the responsive grid settings 178 if (cmm.getGridType() === cmm.constants.desktop) { 179 // If the grid is desktop first we have to readd the +1 max-width fix because slick uses < rather than <= 180 responsive_obj.breakpoint = cmm.getBreakp
180ointMediaWidth(breakpointKey) + 1; 181 } else { 182 responsive_obj.breakpoint = cmm.getBreakpointMediaWidth(breakpointKey); 183 } 184 } 185 186 // Handle `appendArrows` to include `this` otherwise if you have multiple sliders on the page it bubbles down 187 if (typeof breakpoint.appendArrows !== 'undefined') { 188 responsive_obj.settings.appendArrows = $( 189 breakpoint.appendArrows.trim() + '', 190 $this 191 ); 192 } 193 194 if (typeof breakpoint.appendDots !== 'undefined') { 195 responsive_obj.settings.appendDots = $(breakpoint.appendDots.trim() + '', $this); 196 } 197 198 if (typeof breakpoint.appendCounter !== 'undefined') { 199 responsive_obj.settings.appendCounter = $( 200 breakpoint.appendCounter.trim() + '', 201 $this 202 ); 203 } 204 205 if (typeof breakpoint.appendPlaypause !== 'undefined') { 206 responsive_obj.settings.appendPlaypause = $( 207 breakpoint.appendPlaypause.trim() + ':first', 208 $this 209 ); 210 } 211 212 if (previousResponsiveSettings !== false) { 213 responsive_obj.settings = $.extend( 214 {}, 215 previousResponsiveSettings, 216 responsive_obj.settings 217 ); 218 } 219 previousResponsiveSettings = responsive_obj.settings; 220 responsive.push(responsive_obj); 221 } 222 } 223 } 224 225 // Set the rtl 226 settings.rtl = document.dir === 'ltr' ? false : true; 227 228 settings.responsive = responsive; 229 230 // Init the slick slider. 231 $slider.slick(settings); 232 233 // Init match heights 234 if (matchHeightsInit !== false && isMatchHeightEnabled) { 235 $slider.cohesionContainerMatchHeights({ 236 excludeElements: ['slide'], 237 targets: matchHeights, 238 context: context, 239 expressionPrefixes: [ 240 '.slick-list > .slick-track', 241 '.slick-list > .slick-track > .coh-slider-item', 242 ], 243 loaders: [ 244 '.coh-slider-container > .coh-slider-container-mid > .coh-slider-container-inner img', 245 '.coh-slider-container > .coh-slider-container-mid > .coh-slider-container-inner frame', 246 '.coh-slider-container > .coh-slider-container-mid > .coh-slider-container-inner iframe', 247 '.coh-slider-container > .coh-slider-container-mid > .coh-slider-container-inner img', 248 '.coh-slider-container > .coh-slider-container-mid > .coh-slider-container-inner input[type="image"]', 249 '.coh-slider-container > .coh-slider-container-mid > .coh-slider-container-inner link', 250 '.coh-slider-container > .coh-slider-container-mid > .coh-slider-container-inner script', 251 '.coh-slider-container > .coh-slider-container-mid > .coh-slider-container-inner style', 252 ], 253 }); 254 } 255 256 // Update match heights on change 257 var breakpointOriginal = false;
258 if (isMatchHeightEnabled) { 259 if ($.fn.matchHeight._groups.length > 0) { 260 $slider.on('breakpoint', function (event, slick, breakpoint) { 261 if (breakpointOriginal !== breakpoint) { 262 $.fn.matchHeight._update(); 263 264 breakpointOriginal = breakpoint; 265 } 266 }); 267 } 268 } 269 }); 270 }, 271 }; 272})(jQuery, Drupal, once, drupalSettings);
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.